/* Seribu Rasa — 1000rasa.zoeclouds.com */
:root{
  --burgundy:#6E1F24;
  --burgundy-deep:#4A1418;
  --burgundy-ink:#3A0F13;
  --cream:#F7EFE2;
  --cream-soft:#FDF9F2;
  --gold:#C08B3E;
  --gold-soft:#E0BE84;
  --ink:#2B211E;
  --muted:#6E5C53;
  --line:rgba(110,31,36,.16);
  --wrap:1220px;
  --r:3px;
  --sh:0 18px 48px -24px rgba(58,15,19,.45);
  --ease:cubic-bezier(.22,.61,.36,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--cream-soft);color:var(--ink);
  font:400 16px/1.65 Karla,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:"Playfair Display",Georgia,serif;font-weight:400;letter-spacing:-.01em;margin:0}
h1 em,h2 em{font-style:italic;color:var(--gold)}
p{margin:0 0 1em}
.wrap{width:min(100% - 2.5rem,var(--wrap));margin-inline:auto}
.skip{position:absolute;left:-999px;top:0;background:var(--burgundy);color:var(--cream);padding:.75rem 1.25rem;z-index:200}
.skip:focus{left:0}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}

.eyebrow{font:600 .72rem/1.2 Karla;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin:0 0 1rem}

/* ---------------------------------------------------------------- buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  min-height:46px;padding:.72rem 1.6rem;border-radius:var(--r);cursor:pointer;
  font:600 .8rem/1 Karla;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;
  border:1px solid transparent;transition:background .25s var(--ease),color .25s var(--ease),
    border-color .25s var(--ease),transform .25s var(--ease);
}
.btn:hover{transform:translateY(-2px)}
.btn--gold{background:var(--gold);color:#2B1A08;border-color:var(--gold)}
.btn--gold:hover{background:var(--gold-soft);border-color:var(--gold-soft)}
.btn--ghost{border-color:rgba(247,239,226,.5);color:var(--cream)}
.btn--ghost:hover{background:rgba(247,239,226,.12);border-color:var(--cream)}
.btn--outline{border-color:var(--burgundy);color:var(--burgundy)}
.btn--outline:hover{background:var(--burgundy);color:var(--cream)}
.btn--wa{background:transparent;border-color:var(--line);color:var(--burgundy);min-height:42px;padding:.6rem 1.1rem}
.btn--wa:hover{background:var(--burgundy);color:var(--cream);border-color:var(--burgundy)}
.ico-wa{width:16px;height:16px;fill:currentColor}
.link-arrow{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;
  font:600 .78rem/1 Karla;letter-spacing:.14em;text-transform:uppercase;color:var(--burgundy);padding:.4rem 0}
.link-arrow svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;
  transition:transform .25s var(--ease)}
.link-arrow:hover svg{transform:translateX(5px)}

/* -------------------------------------------------------------------- nav */
.nav{position:fixed;inset:0 0 auto;z-index:100;transition:background .35s var(--ease),
  box-shadow .35s var(--ease),padding .35s var(--ease);padding:.6rem 0}
.nav__in{width:min(100% - 2.5rem,var(--wrap));margin-inline:auto;
  display:flex;align-items:center;gap:1.5rem}
.nav__brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--cream);
  font-family:"Playfair Display",serif;font-size:1.15rem;letter-spacing:.02em;transition:color .35s var(--ease)}
.nav__mark{width:44px;height:auto}
.nav__links{display:flex;gap:2rem;margin-left:auto}
.nav__links a{text-decoration:none;color:rgba(247,239,226,.86);font:500 .82rem/1 Karla;
  letter-spacing:.12em;text-transform:uppercase;padding:.5rem 0;position:relative;transition:color .25s var(--ease)}
.nav__links a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--gold);
  transition:width .3s var(--ease)}
.nav__links a:hover::after,.nav__links a.is-active::after{width:100%}
.nav__cta{min-height:40px;padding:.6rem 1.3rem}
.nav__toggle{display:none;background:none;border:0;cursor:pointer;padding:10px;margin-left:auto}
.nav__toggle span{display:block;width:24px;height:2px;background:var(--cream);margin:5px 0;
  transition:transform .3s var(--ease),opacity .2s var(--ease)}
.nav.is-solid{background:rgba(74,20,24,.97);box-shadow:0 8px 30px -16px rgba(0,0,0,.6);padding:.35rem 0}
.nav.is-solid .nav__brand{color:var(--cream)}

/* ------------------------------------------------------------------- hero */
.hero{position:relative;min-height:100svh;display:grid;place-items:center;
  background:var(--burgundy-ink);overflow:hidden;padding:7rem 0 5rem;text-align:center}
.hero__bg{position:absolute;inset:0}
.hero__img{width:100%;height:100%;object-fit:cover;opacity:.42;
  transform:scale(1.06);animation:kb 22s var(--ease) forwards}
@keyframes kb{to{transform:scale(1)}}
.hero__bg::after{content:"";position:absolute;inset:0;
  background:radial-gradient(90% 70% at 50% 45%,rgba(58,15,19,.35) 0%,rgba(58,15,19,.86) 62%,var(--burgundy-ink) 100%)}
.hero__in{position:relative;width:min(100% - 2.5rem,860px);color:var(--cream)}
.hero__logo{width:min(230px,52vw);margin:0 auto 1.6rem;opacity:0;animation:up .9s .1s var(--ease) forwards}
.hero__eyebrow{font:600 .7rem/1.2 Karla;letter-spacing:.32em;text-transform:uppercase;
  color:var(--gold-soft);margin:0 0 1.1rem;opacity:0;animation:up .9s .25s var(--ease) forwards}
.hero h1{font-size:clamp(2.3rem,6.2vw,4.4rem);line-height:1.08;margin:0 0 1.4rem;
  opacity:0;animation:up .9s .35s var(--ease) forwards}
.hero h1 em{color:var(--gold-soft)}
.hero__sub{max-width:56ch;margin:0 auto 2.3rem;color:rgba(247,239,226,.8);font-size:1.02rem;
  opacity:0;animation:up .9s .45s var(--ease) forwards}
.hero__cta{display:flex;gap:.9rem;justify-content:center;flex-wrap:wrap;
  opacity:0;animation:up .9s .55s var(--ease) forwards}
@keyframes up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.hero__scroll{position:absolute;bottom:2rem;left:50%;translate:-50% 0;width:22px;height:36px;
  border:1px solid rgba(247,239,226,.4);border-radius:12px;display:grid;place-items:start center;padding-top:7px}
.hero__scroll span{width:3px;height:7px;border-radius:2px;background:var(--gold-soft);
  animation:sc 1.8s infinite var(--ease)}
@keyframes sc{0%{opacity:0;transform:translateY(0)}40%{opacity:1}100%{opacity:0;transform:translateY(12px)}}

/* ------------------------------------------------------------------ story */
section{scroll-margin-top:80px}
.story{background:var(--cream);padding:clamp(4.5rem,9vw,8rem) 0}
.story__grid{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(2rem,6vw,5.5rem);align-items:start}
.story h2{font-size:clamp(2rem,4.2vw,3.1rem);line-height:1.12}
.story__body p{color:var(--muted);font-size:1.02rem}
.story__sign{font-family:"Playfair Display",serif;font-style:italic;font-size:1.3rem;
  color:var(--burgundy);margin-top:1.8rem;padding-top:1.5rem;border-top:1px solid var(--line)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;margin-top:clamp(3rem,6vw,5rem);
  padding-top:clamp(2.5rem,5vw,3.5rem);border-top:1px solid var(--line)}
.stat{text-align:center}
.stat strong{display:block;font-family:"Playfair Display",serif;font-weight:400;
  font-size:clamp(2rem,4vw,2.9rem);color:var(--burgundy);line-height:1}
.stat span{display:block;margin-top:.5rem;font-size:.8rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted)}

/* --------------------------------------------------------------- sections */
.sec-head{max-width:60ch;margin:0 0 clamp(2.5rem,5vw,3.5rem)}
.sec-head h2{font-size:clamp(2rem,4.4vw,3.2rem);line-height:1.12}
.sec-sub{color:var(--muted);margin-top:1rem;max-width:52ch}

/* ------------------------------------------------------------- signatures */
.sigs{padding:clamp(4.5rem,9vw,7.5rem) 0;background:var(--cream-soft)}
.sig-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem}
.sig{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.sig:hover{transform:translateY(-6px);box-shadow:var(--sh)}
.sig__img{aspect-ratio:4/5;overflow:hidden;background:var(--cream)}
.sig__img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.sig:hover .sig__img img{transform:scale(1.06)}
.sig__body{padding:1.3rem 1.35rem 1.5rem;display:flex;flex-direction:column;flex:1}
.sig__body h3{font-size:1.22rem;line-height:1.25;margin-bottom:.55rem}
.sig__body p{color:var(--muted);font-size:.9rem;line-height:1.55;flex:1}
.price{font:600 .82rem/1 Karla;letter-spacing:.1em;color:var(--burgundy);
  padding-top:.9rem;border-top:1px solid var(--line);margin-top:.9rem}

/* ------------------------------------------------------------------- menu */
.menu{padding:clamp(4.5rem,9vw,7.5rem) 0;background:var(--cream)}
.tabs{display:flex;gap:.5rem;flex-wrap:wrap;padding-bottom:1.6rem;border-bottom:1px solid var(--line);
  margin-bottom:2.2rem}
.tab{background:none;border:1px solid transparent;cursor:pointer;padding:.6rem 1.15rem;min-height:42px;
  border-radius:var(--r);font:600 .78rem/1 Karla;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);transition:all .25s var(--ease)}
.tab:hover{color:var(--burgundy);border-color:var(--line)}
.tab[aria-selected="true"]{background:var(--burgundy);color:var(--cream);border-color:var(--burgundy)}
.panel__blurb{color:var(--muted);font-style:italic;max-width:60ch;margin-bottom:2rem;
  font-family:"Playfair Display",serif;font-size:1.08rem}
.dishes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;
  gap:.3rem 3.5rem}
.dish{display:flex;gap:1rem;align-items:flex-start;padding:1.1rem 0;border-bottom:1px solid var(--line)}
.dish__thumb{flex:0 0 76px;width:76px;height:76px;border-radius:var(--r);overflow:hidden;background:var(--cream-soft)}
.dish__thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.dish:hover .dish__thumb img{transform:scale(1.08)}
.dish__thumb--none{background:
  repeating-linear-gradient(45deg,rgba(110,31,36,.05) 0 6px,transparent 6px 12px)}
.dish__txt{flex:1;min-width:0}
.dish__txt h4{font-size:1.06rem;line-height:1.3;margin-bottom:.25rem}
.dish__txt p{color:var(--muted);font-size:.85rem;line-height:1.5;margin:0}
.dish__price{flex:0 0 auto;font:600 .82rem/1.5 Karla;color:var(--burgundy);white-space:nowrap;
  padding-left:.5rem;text-align:right;max-width:9rem}
.menu__pdf{margin-top:2.8rem;text-align:center}

/* ---------------------------------------------------------------- gallery */
.gallery{background:var(--burgundy-ink)}
.g-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:0}
.g-item{margin:0;aspect-ratio:1;overflow:hidden;position:relative}
.g-item img{width:100%;height:100%;object-fit:cover;opacity:.88;
  transition:transform .8s var(--ease),opacity .4s var(--ease)}
.g-item:hover img{transform:scale(1.08);opacity:1}

/* ------------------------------------------------------------ experiences */
.exps{padding:clamp(4.5rem,9vw,7.5rem) 0;background:var(--cream-soft)}
.exp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.8rem}
.exp{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.exp:hover{transform:translateY(-6px);box-shadow:var(--sh)}
.exp__img{aspect-ratio:16/11;overflow:hidden;background:var(--cream)}
.exp__img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.exp:hover .exp__img img{transform:scale(1.06)}
.exp__body{padding:1.7rem 1.7rem 1.9rem}
.exp__body h3{font-size:1.45rem;margin-bottom:.7rem}
.exp__body p{color:var(--muted);font-size:.94rem}

/* --------------------------------------------------------------- outlets */
.locs{padding:clamp(4.5rem,9vw,7.5rem) 0;background:var(--cream)}
.outlets{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);
  gap:0 3.5rem}
.outlet{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;
  padding:1.35rem 0;border-bottom:1px solid var(--line)}
.outlet h3{font-size:1.2rem;line-height:1.3}
.outlet p{margin:.2rem 0 0;color:var(--muted);font-size:.83rem;letter-spacing:.08em;text-transform:uppercase}
.locs__catering{margin-top:clamp(2.5rem,5vw,4rem);background:var(--burgundy);color:var(--cream);
  border-radius:var(--r);padding:clamp(1.8rem,4vw,2.8rem);display:flex;align-items:center;
  justify-content:space-between;gap:2rem;flex-wrap:wrap}
.locs__catering h3{font-size:1.6rem;margin-bottom:.4rem}
.locs__catering p{margin:0;color:rgba(247,239,226,.75)}

/* ----------------------------------------------------------------- footer */
.foot{background:var(--burgundy-ink);color:rgba(247,239,226,.72);padding:clamp(3.5rem,7vw,5.5rem) 0 2rem}
.foot__in{display:grid;grid-template-columns:1.6fr 1fr 1.3fr 1fr;gap:2.5rem}
.foot__brand img{width:150px;margin-bottom:1.2rem}
.foot__brand p{max-width:30ch;font-size:.93rem}
.foot__col h4{color:var(--gold-soft);font:600 .72rem/1 Karla;letter-spacing:.2em;
  text-transform:uppercase;margin-bottom:1.1rem}
.foot__col a{display:block;text-decoration:none;padding:.42rem 0;font-size:.92rem;
  transition:color .25s var(--ease)}
.foot__col a:hover{color:var(--gold-soft)}
.foot__base{margin-top:3rem;padding-top:1.8rem;border-top:1px solid rgba(247,239,226,.14);
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.8rem;
  color:rgba(247,239,226,.5)}
.foot__base p{margin:0}

/* ----------------------------------------------------------------- reveal */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.is-in{opacity:1;transform:none}

/* ------------------------------------------------------------ responsive */
@media (max-width:1080px){
  .sig-grid{grid-template-columns:repeat(2,1fr)}
  .g-grid{grid-template-columns:repeat(4,1fr)}
  .foot__in{grid-template-columns:1fr 1fr;gap:2rem}
}
@media (max-width:860px){
  .nav__links{position:fixed;inset:0 0 auto;top:0;padding:6rem 2rem 2.5rem;flex-direction:column;
    gap:.4rem;background:rgba(74,20,24,.985);transform:translateY(-100%);
    transition:transform .4s var(--ease);margin:0}
  .nav__links.is-open{transform:none}
  .nav__links a{font-size:1.05rem;padding:.85rem 0;border-bottom:1px solid rgba(247,239,226,.12)}
  .nav__toggle{display:block;order:3;z-index:2}
  .nav__cta{display:none}
  .nav__brand{margin-right:auto}
  .nav.is-open .nav__toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav.is-open .nav__toggle span:nth-child(2){opacity:0}
  .nav.is-open .nav__toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .story__grid{grid-template-columns:1fr}
  .stats{grid-template-columns:repeat(2,1fr);gap:2rem 1rem}
  .dishes,.outlets{grid-template-columns:1fr;gap:0}
  .exp-grid{grid-template-columns:1fr}
  .locs__catering{flex-direction:column;align-items:flex-start}
}
@media (max-width:560px){
  .g-grid{grid-template-columns:repeat(2,1fr)}
  .sig-grid{grid-template-columns:1fr;gap:1.2rem}
  .foot__in{grid-template-columns:1fr}
  .hero{min-height:92svh}
  .dish__thumb{flex-basis:64px;width:64px;height:64px}
  .dish__price{max-width:6.5rem;font-size:.78rem}
  .btn{width:100%}
  .hero__cta .btn{width:auto;flex:1 1 auto}
  .outlet .btn{width:auto}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
  .hero__logo,.hero__eyebrow,.hero h1,.hero__sub,.hero__cta{opacity:1}
}