/* A slow tidal rhythm over real photographs of the warung. */
html{scroll-padding-top:90px}
.nav{position:sticky;top:0;z-index:50;background:rgba(245,240,229,.94);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(20,58,55,.1)}
.hero{isolation:isolate}
.hero .hero-image{animation:hero-drift 22s ease-in-out infinite alternate;transform-origin:50% 60%;will-change:transform}
.hero-water{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.33;background:repeating-radial-gradient(ellipse 74% 20% at 58% 112%,transparent 0 43px,rgba(216,242,224,.12) 46px 48px,transparent 52px 91px);animation:tide-breathe 9s ease-in-out infinite alternate;mix-blend-mode:screen}
.hero-inner{z-index:3}
.hero .eyebrow{animation:rise-in .8s .1s both}
.hero h1{animation:rise-in .9s .22s both;text-wrap:balance;text-shadow:0 2px 20px rgba(0,0,0,.1)}
.hero p{animation:rise-in .9s .43s both}
.hero .actions{animation:rise-in .9s .58s both}
.hero .hero-bottom{animation:rise-in .9s .75s both}
.tide-edge{position:absolute;bottom:-2px;left:-2%;width:104%;height:90px;z-index:4;pointer-events:none;overflow:hidden}
.tide-edge svg{width:100%;height:100%;display:block;animation:wave-drift 11s ease-in-out infinite alternate}
.tide-edge .tide-back{fill:#d7e6d9;opacity:.75}.tide-edge .tide-front{fill:var(--cream)}
.ticker{overflow:hidden;background:var(--cream);border-bottom:1px solid rgba(20,58,55,.18);padding:22px 0 20px;white-space:nowrap}
.ticker-track{display:inline-block;min-width:max-content;font:700 16px/1 'Outfit',sans-serif;letter-spacing:.16em;animation:ticker 34s linear infinite}
.ticker-track span{color:#dc9963;margin:0 40px;font-size:18px}
.ocean-scene{position:relative;isolation:isolate;height:min(75vw,690px);min-height:460px;overflow:hidden;background:#143a37;color:#fff}
.ocean-scene>img{position:absolute;inset:-9% 0;width:100%;height:118%;object-fit:cover;object-position:center 74%;transform:translateY(var(--ocean-shift,0px)) scale(1.04);will-change:transform;filter:saturate(.92) contrast(1.08)}
.ocean-scene:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,35,36,.62),transparent 82%),linear-gradient(0deg,rgba(9,35,36,.42),transparent 64%);pointer-events:none}
.ocean-overlay{position:absolute;z-index:2;left:clamp(20px,7vw,110px);right:20px;top:50%;transform:translateY(-47%)}
.ocean-overlay p{font:700 clamp(47px,7.5vw,110px)/.93 'Outfit',sans-serif;letter-spacing:-.075em;margin:20px 0 38px;text-shadow:0 6px 24px rgba(0,0,0,.12)}
.ocean-overlay em{font-style:normal;color:#f2bb7a}
.ocean-scroll{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.15em;border-top:1px solid rgba(255,255,255,.8);padding-top:12px}
.ocean-scene .tide-edge .tide-back{fill:#b9d7cc}.ocean-scene .tide-edge .tide-front{fill:var(--dark)}
.splitphoto{overflow:hidden}.splitphoto img{transition:transform .8s cubic-bezier(.2,.8,.2,1)}.splitphoto:hover img{transform:scale(1.035)}
.menu{background:#e4ece3;position:relative}.menu:before{content:"";display:block;position:absolute;right:0;top:0;width:min(42vw,480px);height:100%;pointer-events:none;opacity:.15;background:repeating-radial-gradient(ellipse at 100% 15%,transparent 0 42px,#43928a 44px 46px,transparent 49px 78px)}
.menu>.wrap{position:relative}.menutabs button{transition:background .25s,color .25s,transform .25s}.menutabs button:hover{transform:translateY(-3px)}
.menu-item{transition:background .3s,transform .3s}.menu-item:hover{background:#fff;transform:translateY(-2px);position:relative;z-index:1}
.card{transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .45s}.card:hover{transform:translateY(-9px);box-shadow:0 24px 45px rgba(25,59,53,.12);border-color:#b8d2c6}
.cards .card:nth-child(2){transition-delay:.08s}.cards .card:nth-child(3){transition-delay:.16s}
.experience{position:relative;overflow:hidden;background:#e8bd83}.experience:before{content:"";position:absolute;inset:0;opacity:.2;background:repeating-radial-gradient(ellipse 70% 35% at 98% 100%,transparent 0 35px,#fff 37px 39px,transparent 41px 77px);pointer-events:none}.experience-inner{position:relative}.experience img{transform:rotate(-2deg);box-shadow:22px 25px 0 rgba(20,58,55,.16);transition:transform .7s ease}.experience img:hover{transform:rotate(0deg) scale(1.015)}
.surprise{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:8vw;align-items:center;padding-top:95px;padding-bottom:95px}.surprise img{height:410px;max-width:500px;object-fit:cover;object-position:50% 63%;border-radius:46% 46% 7px 7px;filter:saturate(.8)}.surprise h2{font:700 clamp(38px,4.5vw,65px)/1 'Outfit',sans-serif;letter-spacing:-.06em;margin:18px 0}.surprise p{font-size:18px;max-width:460px}
.last{position:relative;overflow:hidden;isolation:isolate}.last:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.18;background:repeating-radial-gradient(ellipse 70% 30% at 50% 120%,transparent 0 33px,#cdece1 36px 38px,transparent 41px 79px);animation:tide-breathe 12s ease-in-out infinite alternate}
.reveal{opacity:0;transform:translateY(32px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}.reveal.visible{opacity:1;transform:translateY(0)}
@keyframes hero-drift{from{transform:scale(1.02) translate3d(-.4%,0,0)}to{transform:scale(1.095) translate3d(.6%,-1%,0)}}
@keyframes tide-breathe{from{transform:translateY(0) scale(1)}to{transform:translateY(-16px) scale(1.06)}}
@keyframes wave-drift{from{transform:translateX(-1.3%) scaleX(1.03)}to{transform:translateX(1.3%) scaleX(1.03)}}
@keyframes ticker{to{transform:translateX(-50%)}}
@keyframes rise-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:800px){.ocean-scene{height:620px}.ocean-scene>img{object-position:55% 74%}.surprise{grid-template-columns:1fr;gap:30px;padding-top:70px;padding-bottom:70px}.surprise img{height:390px;max-width:100%}}
@media(max-width:470px){.tide-edge{height:60px}.ticker{padding:17px 0}.ticker-track{font-size:13px}.ticker-track span{margin:0 19px}.ocean-scene{height:560px;min-height:0}.ocean-scene>img{object-position:49% 75%}.ocean-overlay{top:49%}.ocean-overlay p{font-size:clamp(45px,11vw,67px)}.surprise img{height:330px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero .hero-image,.hero-water,.hero .eyebrow,.hero h1,.hero p,.hero .actions,.hero .hero-bottom,.tide-edge svg,.ticker-track,.last:before{animation:none!important}.hero .eyebrow,.hero h1,.hero p,.hero .actions,.hero .hero-bottom{opacity:1;transform:none}.reveal{opacity:1;transform:none;transition:none}.ocean-scene>img{transform:none!important}.splitphoto img,.card,.experience img,.menutabs button,.menu-item{transition:none!important}}