/* Kampung Kecil: restrained restaurant motion */
:root{--ease-restaurant:cubic-bezier(.22,1,.36,1)}
::selection{background:#e8bd75;color:#3e240f}
.nav a{position:relative;transition:color .22s ease}
@media(min-width:851px){.nav a:after{content:"";position:absolute;bottom:-5px;left:0;right:0;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease-restaurant)}.nav a:hover:after,.nav a:focus-visible:after{transform:scaleX(1)}}
.btn,.hero-controls button{transition:transform .25s var(--ease-restaurant),box-shadow .25s ease,background-color .25s ease}
.btn:hover,.hero-controls button:hover{transform:translateY(-3px);box-shadow:0 9px 22px #43240e32}
.btn:active,.hero-controls button:active{transform:translateY(0)}
.card,.branch{transition:transform .4s var(--ease-restaurant),box-shadow .4s ease,border-color .4s ease}
.card:hover,.branch:hover{transform:translateY(-5px);box-shadow:0 16px 38px #42200f20;border-color:#dfc49c}
.card img,.feature img,.branch>img{transition:transform .65s var(--ease-restaurant),filter .5s ease}
.card:hover img,.branch:hover>img{transform:scale(1.035);filter:saturate(1.08)}
.card{isolation:isolate}.card img{display:block}
.hero .slide.active img{animation:restaurant-kenburns 7s ease-out both}
@keyframes restaurant-kenburns{from{transform:scale(1.065)}to{transform:scale(1)}}
.slide-caption h1,.slide-caption p,.slide-caption .actions{animation:restaurant-slide-up .7s var(--ease-restaurant) both}
.slide-caption p{animation-delay:.1s}.slide-caption .actions{animation-delay:.2s}
@keyframes restaurant-slide-up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
[data-reveal].is-visible{animation:restaurant-reveal .65s var(--ease-restaurant) both;animation-delay:var(--reveal-delay,0ms)}
@keyframes restaurant-reveal{from{opacity:.55;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.eyebrow{position:relative}.eyebrow:after{content:"";display:inline-block;width:24px;height:1px;background:var(--gold);vertical-align:middle;margin-left:10px}
:focus-visible{outline:3px solid #d9a64c;outline-offset:3px}
@media(max-width:750px){.card:hover,.branch:hover{transform:none}.hero .slide.active img{animation:none}.btn:hover{transform:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important;transform:none!important}}