/* =========================================================
   JOON — Direction A · SOFREH (the laid table) — paged deck
   ========================================================= */
:root{
  --g1:#EFE7DB; --g2:#F5EFE6; --g3:#F5EFE6;
  --gold:#4f1422; --gold-s:rgba(79,20,34,.24); --acc:#2f5d50;
  --cream:#4f1422; --cream-d:rgba(79,20,34,.74);
  --green:#F1ECE2; --ink:#4f1422;
  --serif:"Cormorant Garamond","Times New Roman",serif;
  --sans:"Jost","Helvetica Neue",Arial,sans-serif;
  --pad:20px; --bar:60px; --top:62px;
  --ease:cubic-bezier(.22,.61,.12,1);
  --arch:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 100' preserveAspectRatio='none'%3E%3Cpath d='M0,100 L0,42 C0,24 12,14 24,8 C27,6.5 29,4 30,0 C31,4 33,6.5 36,8 C48,14 60,24 60,42 L60,100 Z'/%3E%3C/svg%3E");
  --ph:calc(100svh - var(--bar) - env(safe-area-inset-bottom));
}
@supports not (height:100svh){ :root{ --ph:calc(100vh - var(--bar)); } }
@media (min-width:900px){ :root{ --pad:5vw; --bar:0px; --top:84px; } }

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0; background:var(--g2); color:var(--cream);
  font-family:var(--sans); font-weight:300; font-size:16px; line-height:1.55;
  overflow-x:clip; -webkit-font-smoothing:antialiased;
  padding-bottom:calc(var(--bar) + env(safe-area-inset-bottom));
}
img,video{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ margin:0; font-weight:300; }
h2{ font-family:var(--serif); letter-spacing:-.01em; }
h2 em{ color:var(--gold); }
p{ margin:0; }
figure{ margin:0; }
::selection{ background:var(--gold); color:var(--g2); }
.label{ font-family:var(--sans); font-size:11px; font-weight:400; letter-spacing:.3em; text-transform:uppercase; color:var(--acc); }

/* ---------- deck mode ---------- */
html.deck, html.deck body{ height:100%; overflow:hidden; overscroll-behavior:none; }
html.deck .deck{ position:fixed; left:0; right:0; top:0; height:var(--ph); touch-action:none; }
.page{ position:relative; min-height:var(--ph); overflow:hidden; }
html.deck .page{ position:absolute; inset:0; min-height:0; height:100%; visibility:hidden; }
html.deck .page.is-active{ visibility:visible; }

.ln{ display:block; overflow:hidden; padding-bottom:.08em; margin-bottom:-.08em; }
.ln > span{ display:inline-block; }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 24px;
  font-family:var(--sans); font-size:11.5px; font-weight:400; letter-spacing:.22em; text-transform:uppercase;
  transition:background .5s var(--ease), color .5s var(--ease), border-color .5s;
}
.btn-gold{ background:var(--gold); color:var(--g2); }
.btn-gold:hover{ background:var(--acc); }
.btn-line{ border:1px solid var(--gold-s); color:var(--cream); }
.btn-line:hover{ border-color:var(--gold); color:var(--gold); }
.btn-deep{ background:var(--ink); color:var(--g2); }
.btn-deep:hover{ background:var(--acc); }

/* ---------- arch ---------- */
.arch{ position:relative; aspect-ratio:3/5; }
.arch-win{
  position:absolute; inset:0; overflow:hidden; background:var(--g1); clip-path:inset(0.25% 0% 0% 0%);
  -webkit-mask:var(--arch) 0 0/100% 100% no-repeat; mask:var(--arch) 0 0/100% 100% no-repeat;
}
.arch-win video{ width:100%; height:100%; object-fit:cover; }
.arch-line{ position:absolute; left:-10px; top:-13px; width:calc(100% + 20px); height:calc(100% + 13px); overflow:visible; pointer-events:none; }
.arch-line path{ fill:none; stroke:var(--gold); stroke-width:1; vector-effect:non-scaling-stroke; opacity:.85; }

/* ---------- header ---------- */
.top{
  position:fixed; z-index:50; top:0; left:0; right:0; height:var(--top);
  display:flex; align-items:center; justify-content:center; padding:0 var(--pad);
  background:rgba(245,239,230,.96); border-bottom:1px solid rgba(79,20,34,.14);
  pointer-events:none;
}
.top > *{ pointer-events:auto; }
.top-mark{ display:block; padding:6px; }
.mono{
  display:block; width:38px; height:37px; background:var(--gold);
  -webkit-mask:url(media/img/monogram_clean_2000.png) center/contain no-repeat; mask:url(media/img/monogram_clean_2000.png) center/contain no-repeat;
}
.top-nav, .top-reserve{ display:none; }
.count{
  display:none; position:absolute; right:var(--pad); top:50%; transform:translateY(-50%);
  align-items:center; gap:8px; font-size:11px; letter-spacing:.24em; color:var(--gold); font-variant-numeric:tabular-nums; color:var(--acc);
}
.count i{ width:16px; height:1px; background:var(--gold-s); }
.count-t{ color:var(--cream-d); }
html.deck .count{ display:flex; }
@media (min-width:900px){
  .top{ justify-content:space-between; }
  .top-nav{ display:flex; gap:34px; }
  .top-nav a, .top-reserve{ font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--cream-d); transition:color .4s; }
  .top-nav a:hover, .top-nav a.is-on{ color:var(--acc); }
  .top-reserve{ display:inline-flex; align-items:center; height:42px; padding:0 24px; border:1px solid var(--gold-s); color:var(--cream); }
  .top-reserve:hover{ background:var(--gold); color:var(--g2); border-color:var(--gold); }
  .count{ position:fixed; top:auto; bottom:34px; left:var(--pad); right:auto; transform:none; }
}

/* ---------- mobile bar ---------- */
.bar{
  position:fixed; z-index:60; left:0; right:0; bottom:0;
  height:calc(var(--bar) + env(safe-area-inset-bottom)); padding-bottom:env(safe-area-inset-bottom);
  display:grid; grid-template-columns:1.35fr 1fr 1fr;
  background:var(--g3); border-top:1px solid rgba(79,20,34,.2);
}
.bar a{ display:flex; align-items:center; justify-content:center; font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--cream); }
.bar a + a{ border-left:1px solid rgba(79,20,34,.14); }
.bar .bar-main{ background:var(--gold); color:var(--g2); font-weight:500; }
@media (min-width:900px){ .bar{ display:none; } }

/* =========================================================
   01 HERO
   ========================================================= */
.hero{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:var(--top) var(--pad) 22px;
  background:radial-gradient(120% 85% at 50% 38%, #FBF8F2 0%, #F5EFE6 45%, var(--g2) 100%);
}
.hero-label{ font-size:10.5px; letter-spacing:.26em; text-align:center; }
.hero-arch{ width:min(60vw, calc(var(--ph) * .31)); margin-top:22px; z-index:1; }
.arch-shade{ position:absolute; inset:0; background:linear-gradient(to bottom, rgba(245,239,230,0) 64%, rgba(245,239,230,.92) 96%); }
@media (min-width:900px){ .arch-shade{ display:none; } }
.hero-word{
  position:relative; z-index:2; margin-top:-.4em; order:2;
  font-family:var(--serif); font-size:min(30vw, calc(var(--ph) * .15)); line-height:.8; font-style:italic; font-weight:300; color:var(--gold);
  letter-spacing:-.02em; white-space:nowrap; text-shadow:none;
}
.hw{ display:inline-block; overflow:hidden; padding:0 .05em .26em; margin:0 -.05em -.26em; vertical-align:top; }
.hw > span{ display:inline-block; }
.hero-label{ order:0; } .hero-arch{ order:1; } .hero-copy{ order:3; text-align:center; margin-top:10px; }
.hero-line{ font-family:var(--serif); font-size:20px; line-height:1.25; }
.hero-line em{ color:var(--gold); }
.hero-cta{ display:flex; gap:10px; justify-content:center; margin-top:18px; }
.hero-cta .btn{ padding:0 18px; }
.hint{ display:none; }
@media (min-width:900px){
  .hero{ display:block; padding:0; }
  .hero-label{ position:absolute; left:var(--pad); top:19vh; font-size:11px; text-align:left; }
  .hero-arch{ position:absolute; right:15vw; top:50%; margin:0; height:min(80vh, 780px); width:auto; transform:translateY(-46%); }
  .hero-word{ position:absolute; left:calc(var(--pad) - 1.5vw); bottom:10vh; margin:0; font-size:min(33vw, 60vh); }
  .hero-copy{ position:absolute; left:var(--pad); top:calc(19vh + 44px); margin:0; text-align:left; max-width:420px; }
  .hero-line{ font-size:30px; }
  .hero-cta{ justify-content:flex-start; margin-top:30px; }
  .hint{
    display:flex; position:absolute; right:var(--pad); bottom:5vh; flex-direction:column; align-items:center; gap:12px;
    font-size:10px; letter-spacing:.3em; text-transform:uppercase; color:var(--cream-d); writing-mode:vertical-rl;
  }
  .hint i{ width:1px; height:60px; background:linear-gradient(var(--gold), transparent); }
}

/* =========================================================
   02 INTRO / 14 SWEETS (centred pages)
   ========================================================= */
.intro{
  display:flex; align-items:center; justify-content:center; text-align:center; padding:var(--top) var(--pad) 30px;
  background:radial-gradient(90% 70% at 50% 50%, #FBF8F2 0%, var(--g2) 80%);
}
.ornament{
  width:44px; height:43px; margin:0 auto 34px; background:var(--gold); opacity:.85;
  -webkit-mask:url(media/img/monogram_clean_2000.png) center/contain no-repeat; mask:url(media/img/monogram_clean_2000.png) center/contain no-repeat;
}
.intro-text{ font-family:var(--serif); font-size:clamp(29px, 7.6vw, 66px); line-height:1.14; }
.intro-text em{ color:var(--gold); }
.nooshe{
  display:flex; align-items:center; justify-content:center; text-align:center; padding:var(--top) var(--pad) 30px;
  background:radial-gradient(90% 70% at 50% 50%, #FBF8F2 0%, var(--g2) 80%);
}
.nooshe-in{ max-width:780px; }
.nooshe-fa{ margin:22px 0 0; font-family:"Noto Nastaliq Urdu", serif; font-size:clamp(46px, 13vw, 96px); line-height:1.9; color:var(--ink); }
.nooshe-h{ margin:-6px 0 0; font-family:var(--serif); font-weight:300; font-size:clamp(48px, 13vw, 118px); line-height:1.02; }
.nooshe-h em{ color:var(--ink); }
.nooshe-text{ margin:22px auto 0; max-width:30ch; font-family:var(--serif); font-size:clamp(19px, 4.8vw, 28px); line-height:1.35; color:var(--cream-d); }
.nooshe-text em{ color:var(--acc); }

/* =========================================================
   03 THE TABLE
   ========================================================= */
.table{ background:radial-gradient(90% 70% at 50% 50%, #FBF8F2 0%, var(--g2) 75%); }
.pano{ position:absolute; left:0; top:0; transform-origin:0 0; will-change:transform; }
.pano-img{ width:100%; height:100%; max-width:none; user-select:none; -webkit-user-drag:none; box-shadow:0 30px 80px rgba(79,20,34,.2); }
.pano-caps{ position:absolute; left:0; right:0; }
.cap{ position:absolute; bottom:30px; margin:0; width:250px; transform:translateX(-50%); text-align:center; opacity:0; visibility:hidden; }
.cap-rule{ display:block; width:1px; height:60px; margin:0 auto 12px; background:linear-gradient(rgba(79,20,34,0), var(--gold)); }
.cap figcaption{ padding:15px 18px 17px; background:rgba(251,248,242,.95); border-top:1px solid var(--gold); border-bottom:1px solid var(--gold-s); }
.cap-n{ display:block; font-size:10.5px; letter-spacing:.3em; color:var(--acc); margin-bottom:6px; }
.cap b{ display:block; font-family:var(--serif); font-style:italic; font-weight:400; font-size:25px; line-height:1.1; color:var(--cream); }
.cap figcaption > span:last-child{ display:block; margin-top:8px; font-size:13px; letter-spacing:.03em; color:var(--cream-d); line-height:1.45; }
.pano-vignette{
  position:absolute; inset:0; pointer-events:none;
  background:none;
}
.pano-title{ position:absolute; left:0; right:0; top:14%; text-align:center; padding:0 var(--pad); pointer-events:none; }
.pano-title h2{ font-size:clamp(46px, 12vw, 116px); line-height:.95; margin-top:14px; }
.pano-sub{ position:absolute; left:0; right:0; bottom:17%; text-align:center; pointer-events:none; font-size:10.5px; letter-spacing:.26em; text-transform:uppercase; color:var(--cream-d); }
.pano-dots{ position:absolute; left:50%; bottom:12px; transform:translateX(-50%); display:flex; gap:10px; margin:0; padding:0; list-style:none; }
.pano-dots li{ width:18px; height:1px; background:rgba(79,20,34,.25); transition:background .6s, width .6s var(--ease); }
.pano-dots li.on{ background:var(--gold); width:34px; }
@media (min-width:900px){
  .cap{ bottom:10vh; width:290px; }
  .cap b{ font-size:30px; }
  .pano-title{ top:12%; }
  .pano-dots{ bottom:36px; }
}

/* =========================================================
   MENU PAGES (mp)
   ========================================================= */
.mp{
  display:flex; flex-direction:column;
  background:radial-gradient(110% 70% at 50% 100%, #FBF8F2 0%, var(--g2) 75%);
}
.mp-ph{ position:relative; flex:1 1 auto; min-height:0; overflow:hidden; }
.mp-ph img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.mp-ph::after{ content:""; position:absolute; inset:0; background:linear-gradient(to bottom, rgba(245,239,230,0) 0, rgba(245,239,230,0) 70%, var(--fade, var(--g2)) 100%); pointer-events:none; }
.mp-ph2{ display:grid; grid-template-columns:1fr 1fr; }
.mp-ph2 figure{ position:relative; }
.mp-ph2 img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.mp-arch{ display:flex; justify-content:center; align-items:flex-end; padding-top:calc(var(--top) + 6px); }
.mp-arch::after{ display:none; }
.mp-arch .arch{ height:100%; max-height:100%; }
.mp-body{ flex:0 0 auto; padding:14px var(--pad) 18px; }
.mp-h{ font-size:clamp(40px, 11vw, 92px); line-height:.92; margin:8px 0 0; }
.mp-note{ margin-top:8px; font-size:13.5px; color:var(--cream-d); }
.ml{ margin-top:12px; }
.ml h4{ margin:12px 0 2px; font-family:var(--sans); font-size:10.5px; font-weight:400; letter-spacing:.28em; text-transform:uppercase; color:var(--acc); opacity:.9; }
.mi{ display:grid; grid-template-columns:1fr auto; column-gap:12px; align-items:baseline; padding:5px 0; border-bottom:1px solid rgba(79,20,34,.14); }
.mi b{ font-family:var(--serif); font-weight:400; font-size:20px; line-height:1.15; color:var(--cream); }
.mi b small{ font-family:var(--sans); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--cream-d); margin-left:6px; }
.mi i{ font-style:normal; font-size:12px; letter-spacing:.14em; color:var(--acc); white-space:nowrap; }
.mi span{ grid-column:1 / -1; font-size:13px; line-height:1.35; color:var(--cream-d); margin-top:1px; }
.ml-split > div + div{ margin-top:4px; }
.ml-row{ display:grid; grid-template-columns:repeat(3, 1fr); column-gap:14px; }
.ml-row .mi b{ font-size:18px; }
.ml-row .mi{ grid-template-columns:1fr; }
.ml-grid{ display:grid; grid-template-columns:1fr 1fr; column-gap:16px; }
.ml-grid .mi b{ font-size:17px; }
.ml-grid .mi{ padding:4px 0; }
.mi-wide{ grid-column:1 / -1; }
.ml-small{ margin-top:10px; font-size:13px; color:var(--cream-d); }
.ml-center{ text-align:left; max-width:520px; margin:0 auto; }
.price-big{ margin-top:10px; font-family:var(--serif); font-size:34px; color:var(--gold); letter-spacing:.02em; }

/* page-specific (mobile) */
#begin .mp-ph{ min-height:120px; }
.green{ background:radial-gradient(110% 70% at 50% 100%, #F8F5EE 0%, var(--green) 70%); --fade:var(--green); }
.green .mp-h em{ color:var(--gold); }
.green .mi{ border-bottom-color:rgba(79,20,34,.14); }
.beige{ background:#FBF8F2; color:var(--ink); --fade:#FBF8F2; }
.beige .mp-ph::after{ background:linear-gradient(to bottom, rgba(251,248,242,0) 0, rgba(251,248,242,0) 72%, #FBF8F2 100%); }
.beige .label{ color:var(--acc); }
.beige .mp-h{ color:var(--ink); }
.beige .mp-h em, .beige .price-big{ color:var(--ink); }
.lunch-course{ list-style:none; margin:12px 0 18px; padding:0; }
.lunch-course li{ display:grid; grid-template-columns:34px 1fr; align-items:baseline; padding:7px 0; border-bottom:1px solid rgba(79,20,34,.2); font-family:var(--serif); font-size:20px; line-height:1.2; color:var(--ink); font-weight:500; }
.lunch-course li p{ margin:0; }
.lunch-course li span{ font-family:var(--sans); font-size:10.5px; letter-spacing:.24em; color:var(--acc); font-weight:400; }
.lunch-course em{ font-weight:400; color:var(--acc); padding:0 .15em; }
.serves{ display:grid; grid-template-columns:repeat(3,1fr); margin-top:16px; border-top:1px solid var(--gold-s); border-bottom:1px solid var(--gold-s); }
.serves div{ padding:12px 4px; text-align:center; }
.serves div + div{ border-left:1px solid var(--gold-s); }
.serves span{ display:block; font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--cream-d); }
.serves b{ display:block; margin-top:4px; font-family:var(--serif); font-weight:400; font-size:26px; color:var(--gold); }
.platter .mp-ph{ min-height:200px; }

@media (min-width:900px){
  .mp{ display:grid; grid-template-columns:46% 1fr; }
  .mp-rev{ grid-template-columns:1fr 46%; }
  .mp-rev .mp-ph{ order:2; }
  .mp-ph{ height:100%; }
  .mp-ph::after{ background:linear-gradient(to right, rgba(245,239,230,0) 70%, var(--fade, var(--g2)) 100%); }
  .mp-rev .mp-ph::after{ background:linear-gradient(to left, rgba(245,239,230,0) 70%, var(--fade, var(--g2)) 100%); }
  .beige .mp-ph::after{ background:linear-gradient(to right, rgba(251,248,242,0) 70%, #FBF8F2 100%); }
  .mp-ph2{ grid-template-columns:1fr; grid-template-rows:1fr 1fr; }
  .mp-arch{ padding:calc(var(--top) + 30px) 0 60px; align-items:center; }
  .mp-arch .arch{ height:100%; }
  .mp-body{ align-self:center; padding:var(--top) 5vw 40px 5vw; max-width:760px; }
  .mp-h{ font-size:clamp(56px, 6.2vw, 104px); margin-top:14px; }
  .mp-note{ font-size:15px; margin-top:14px; }
  .ml{ margin-top:22px; }
  .ml h4{ margin:18px 0 4px; }
  .mi{ padding:8px 0; }
  .mi b{ font-size:25px; }
  .mi span{ font-size:14px; }
  .ml-split{ display:grid; grid-template-columns:1fr 1fr; column-gap:36px; }
  .ml-split > div + div{ margin-top:0; }
  .ml-grid{ column-gap:30px; }
  .ml-grid .mi b{ font-size:21px; }
  .ml-grid .mi{ padding:6px 0; }
  .price-big{ font-size:44px; margin-top:16px; }
  .lunch-course li{ font-size:25px; padding:10px 0; }
  .serves b{ font-size:36px; }
  .serves div{ padding:18px 4px; }
  .tea .mp-h, .coolers .mp-h{ font-size:clamp(52px, 5vw, 84px); }
}

/* =========================================================
   06 KOFTEH
   ========================================================= */
.kofteh{
  display:flex; flex-direction:column; align-items:center; justify-content:center; padding:calc(var(--top) + 10px) var(--pad) 18px;
  background:radial-gradient(80% 60% at 50% 40%, #FBF8F2 0%, var(--g3) 75%);
}
.kofteh-arch{ height:calc(var(--ph) * .5); }
.kofteh-copy{ margin-top:18px; text-align:center; }
.kofteh-copy h2{ font-size:clamp(56px, 16vw, 190px); line-height:.86; margin-top:10px; }
.kofteh-sub{ margin-top:10px; font-family:var(--serif); font-style:italic; font-size:21px; }
.kofteh-text{ margin:6px auto 0; max-width:360px; color:var(--cream-d); font-size:14px; }
.kofteh .price-big{ margin-top:6px; font-size:28px; }
@media (min-width:900px){
  .kofteh{ display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:4vw; padding:var(--top) var(--pad) 40px; }
  .kofteh-arch{ height:min(78vh, 760px); justify-self:center; }
  .kofteh-copy{ margin:0; text-align:left; }
  .kofteh-sub{ font-size:28px; margin-top:20px; }
  .kofteh-text{ margin:12px 0 0; font-size:15.5px; }
  .kofteh .price-big{ font-size:44px; margin-top:18px; }
}

/* =========================================================
   15 ROOM
   ========================================================= */
.room{ display:flex; flex-direction:column; justify-content:center; padding:calc(var(--top) + 6px) var(--pad) 16px; background:radial-gradient(100% 70% at 70% 60%, #FBF8F2 0%, var(--g2) 75%); }
.room-copy h2{ font-size:clamp(46px, 12vw, 120px); line-height:.9; margin-top:12px; }
.room-text{ margin-top:14px; max-width:420px; color:var(--cream-d); font-size:14.5px; }
.room-arches{ margin-top:26px; display:flex; gap:5vw; align-items:flex-start; justify-content:center; flex:1 1 auto; min-height:0; }
.room-arches{ gap:4vw; }
.room-a1{ width:min(50vw, calc(var(--ph) * .3)); }
.room-a2{ width:min(34vw, calc(var(--ph) * .2)); margin-top:auto; }
@media (min-width:900px){
  .room{ display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:4vw; padding:var(--top) var(--pad) 40px; }
  .room-copy h2{ font-size:clamp(64px, 7.2vw, 120px); }
  .room-text{ font-size:15.5px; margin-top:24px; }
  .room-arches{ margin:0; gap:3vw; height:78vh; align-items:flex-start; }
  .room-a1{ width:auto; height:100%; max-height:none; }
  .room-a2{ width:auto; height:68%; max-height:none; margin-top:auto; }
}

/* =========================================================
   16 OCCASIONS
   ========================================================= */
.occasions{ display:flex; align-items:safe center; padding:calc(var(--top) + 14px) var(--pad) 16px; background:radial-gradient(90% 60% at 50% 40%, #FBF8F2 0%, var(--g2) 80%); }
.occ-in{ width:100%; max-width:1120px; margin:0 auto; }
.occasions h2{ font-size:clamp(46px, 12vw, 110px); line-height:.92; margin-top:12px; }
.occ{ list-style:none; margin:26px 0 0; padding:0; border-bottom:1px solid var(--gold-s); }
.occ li{ border-top:1px solid var(--gold-s); }
.occ a{ position:relative; display:grid; grid-template-columns:36px 1fr; column-gap:8px; row-gap:2px; padding:13px 0 14px; overflow:hidden; }
.occ a::before{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(79,20,34,.06), rgba(79,20,34,0)); transform:scaleX(0); transform-origin:0 50%; transition:transform .9s var(--ease); }
.occ a:hover::before{ transform:scaleX(1); }
.occ-n{ grid-row:1 / span 2; padding-top:9px; font-size:10.5px; letter-spacing:.3em; color:var(--acc); }
.occ-t{ font-family:var(--serif); font-style:italic; font-size:29px; line-height:1.1; transition:transform .9s var(--ease), color .6s; }
.occ-d{ color:var(--cream-d); font-size:13.5px; }
.occ-d em{ font-family:var(--serif); font-size:1.15em; color:var(--gold); }
.occ-go{ display:none; }
.occ a:hover .occ-t{ transform:translateX(12px); color:var(--acc); }
@media (min-width:900px){
  .occ{ margin-top:50px; }
  .occ a{ grid-template-columns:80px 1fr 1fr 80px; align-items:center; padding:24px 0; }
  .occ-n{ grid-row:auto; padding:0; }
  .occ-t{ font-size:46px; }
  .occ-d{ font-size:15.5px; }
  .occ-go{ display:block; justify-self:end; font-size:10.5px; letter-spacing:.3em; text-transform:uppercase; color:var(--acc); }
}

/* =========================================================
   17 VISIT
   ========================================================= */
.visit{ display:flex; flex-direction:column; align-items:center; justify-content:center; padding:calc(var(--top) + 4px) var(--pad) 14px; text-align:center; background:radial-gradient(90% 70% at 30% 50%, #FBF8F2 0%, #F5EFE6 40%, var(--g2) 100%); }
.visit-arch{ height:calc(var(--ph) * .24); }
.visit-copy{ margin-top:14px; }
.visit-big{ display:inline-flex; align-items:center; gap:.16em; font-family:var(--serif); font-weight:300; font-size:clamp(64px, 19vw, 210px); line-height:1; color:var(--gold); transition:color .6s; }
.visit-big:hover{ color:var(--acc); }
.visit-arrow{ display:inline-block; width:.4em; height:1px; background:currentColor; position:relative; top:.06em; transition:width .8s var(--ease); }
.visit-arrow::after{ content:""; position:absolute; right:0; top:-.07em; width:.14em; height:.14em; border-top:1px solid currentColor; border-right:1px solid currentColor; transform:rotate(45deg); transform-origin:100% 0; }
.visit-big:hover .visit-arrow{ width:.58em; }
.visit-wa{ margin-top:4px; font-size:14px; color:var(--cream-d); }
.visit-wa a{ color:var(--cream); border-bottom:1px solid var(--gold-s); }
.visit-grid{ margin-top:18px; display:grid; gap:12px; }
.visit-grid .label{ margin-bottom:4px; font-size:10.5px; }
.visit-grid p{ font-size:14px; line-height:1.45; }
.visit-grid p + p{ margin-top:2px; }
.dim{ color:var(--cream-d); white-space:nowrap; }
.u{ border-bottom:1px solid var(--gold-s); padding-bottom:1px; transition:color .4s, border-color .4s; }
.u:hover{ color:var(--acc); border-color:var(--acc); }
@media (min-width:900px){
  .visit{ display:grid; grid-template-columns:.75fr 1.25fr; gap:6vw; align-items:center; padding:var(--top) var(--pad) 40px; text-align:left; }
  .visit-arch{ height:min(74vh, 700px); justify-self:center; }
  .visit-copy{ margin:0; }
  .visit-big{ font-size:clamp(100px, 13vw, 210px); }
  .visit-wa{ margin-top:6px; }
  .visit-grid{ grid-template-columns:repeat(3, 1fr); gap:3vw; margin-top:40px; padding-top:34px; border-top:1px solid var(--gold-s); }
  .visit-grid p{ font-size:15.5px; }
  .visit-grid p + p{ margin-top:8px; }
  .visit-grid .label{ margin-bottom:12px; }
  .dim{ display:block; }
}

/* ---------- no-JS / static fallback for the table ---------- */
html:not(.deck) .table{ padding:var(--top) 0 30px; display:flex; flex-direction:column; }
html:not(.deck) .pano{ position:relative; width:auto; height:auto; order:2; }
html:not(.deck) .pano-img{ width:100%; height:auto; }
html:not(.deck) .pano-caps, html:not(.deck) .pano-vignette, html:not(.deck) .pano-dots, html:not(.deck) .pano-sub{ display:none; }
html:not(.deck) .pano-title{ position:relative; top:auto; margin-bottom:30px; }
html:not(.deck) .mp-ph{ min-height:300px; }

/* =========================================================
   AMBIENCE FOOTAGE (round 2)
   ========================================================= */
.bgv{ position:absolute; inset:0; overflow:hidden; }
.bgv video{ width:100%; height:100%; object-fit:cover; }
.bgv-desk, .arch-desk{ display:none; }
.bgv-dim::after{ content:""; position:absolute; inset:0; background:linear-gradient(rgba(245,239,230,.95), rgba(245,239,230,.93) 50%, rgba(245,239,230,.97)); }
.occ-in{ position:relative; z-index:1; }
.kofteh-arch, .kofteh-copy{ position:relative; z-index:1; }

/* hall */
.hall{ background:var(--g3); }
.hall-a::after{ content:""; position:absolute; inset:0; background:linear-gradient(to bottom, rgba(245,239,230,0) 0, rgba(245,239,230,0) 22%, rgba(245,239,230,0) 46%, rgba(245,239,230,.94) 78%, var(--g3) 100%); }
.hall-copy{ position:absolute; left:0; right:0; bottom:0; padding:0 var(--pad) 22px; }
.hall-copy h2{ font-size:clamp(48px, 13vw, 110px); line-height:.92; margin-top:10px; }
.hall-text{ margin-top:12px; max-width:400px; font-size:14.5px; color:var(--cream-d); }

/* sweets arches */
.mp-arch2{ gap:6vw; }
.sweets .mp-btn{ margin-top:16px; }
.sweets .mp-arch .arch{ height:100%; }

@media (min-width:900px){
  .bgv-desk{ display:block; }
  .arch-desk{ display:block; }
  .kofteh .bgv-desk::after{ content:""; position:absolute; inset:0; background:radial-gradient(70% 90% at 30% 50%, rgba(245,239,230,.94), rgba(245,239,230,.98)); }
  .hall-a{ right:auto; width:34%; }
  .hall-b{ left:34%; right:auto; width:34%; }
  .hall-a::after, .hall-b::after{ content:""; position:absolute; inset:0; background:linear-gradient(to bottom, rgba(245,239,230,0), rgba(245,239,230,0) 20%); }
  .hall-b::after{ background:linear-gradient(to bottom, rgba(245,239,230,0), rgba(245,239,230,0) 20%), linear-gradient(to right, rgba(245,239,230,0) 60%, var(--g3)); }
  .hall-copy{ left:68%; right:0; top:0; bottom:0; display:flex; flex-direction:column; justify-content:center; padding:var(--top) 4vw 40px 3vw; }
  .hall-copy h2{ font-size:clamp(56px, 5.4vw, 96px); margin-top:16px; }
  .hall-text{ font-size:15.5px; margin-top:20px; }
  .sweets .mp-arch{ align-items:center; gap:4vw; }
  .sweets .mp-arch .arch{ height:auto; width:min(44%, 40vh); }
  .sweets .mp-arch .arch-desk{ width:min(32%, 30vh); align-self:flex-end; margin-bottom:12vh; }
}

/* =========================================================
   ROUND 3 — food whole in frame, never under a scrim
   ========================================================= */
.mp-ph::after, .beige .mp-ph::after{ display:none; }
.mp-ph:not(.mp-arch):not(.mp-ph2) > img{
  top:calc(var(--top) + 2px); left:var(--pad); width:calc(100% - 2 * var(--pad)); height:calc(100% - var(--top) - 6px);
  object-fit:contain; filter:drop-shadow(0 16px 30px rgba(79,20,34,.18));
}
.mp-ph2{ gap:10px; padding:calc(var(--top) + 2px) var(--pad) 4px; }
.mp-ph2 figure{ position:relative; }
.mp-ph2 img{ object-fit:contain; filter:drop-shadow(0 16px 30px rgba(79,20,34,.18)); }
.beige .mp-ph img, .beige .mp-ph2 img{ filter:drop-shadow(0 14px 26px rgba(79,20,34,.16)); }
.hall-a video{ object-position:50% 22%; }
@media (min-width:900px){
  .mp-ph:not(.mp-arch):not(.mp-ph2) > img{ top:calc(var(--top) + 8px); left:3vw; width:calc(100% - 6vw); height:calc(100% - var(--top) - 56px); }
  .mp-two{ grid-template-columns:56% 1fr; }
  .mp-ph2{ grid-template-columns:1fr 1fr; grid-template-rows:1fr; gap:1.6vw; padding:calc(var(--top) + 8px) 2.4vw 48px 3vw; }
  .hall-a{ right:auto; width:56%; }
  .hall-a::after{ background:linear-gradient(to bottom, rgba(245,239,230,0), rgba(245,239,230,0) 20%), linear-gradient(to right, rgba(245,239,230,0) 72%, var(--g3)); }
  .hall-copy{ left:56%; padding:var(--top) 5vw 40px 4vw; }
  .sweets .mp-arch .arch{ width:min(58%, 44vh); }
}

/* =========================================================
   R4 (25 Oct) · OUR STORY · FROM OUR KITCHEN · CATERING
   ========================================================= */
/* our story: five chapters of the Persian table, one per gesture */
.story{ display:flex; flex-direction:column; background:radial-gradient(90% 60% at 60% 70%, #FBF8F2 0%, var(--g2) 80%); }
.st-media{ position:relative; flex:0 0 auto; height:calc(var(--ph) * .5); margin:calc(var(--top) + 8px) var(--pad) 0; }
.st-m{ position:absolute; inset:0; opacity:0; visibility:hidden; }
.st-m.is-on{ opacity:1; visibility:inherit; }
.st-m img{ width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 14px 26px rgba(79,20,34,.16)); }
.st-m video{ width:100%; height:100%; object-fit:cover; }
.st-m:nth-child(4) video{ object-position:50% 72%; }
.st-m:nth-child(5) video{ object-position:50% 30%; }
.st-copy{ flex:1 1 auto; min-height:0; display:flex; flex-direction:column; padding:14px var(--pad) 12px; }
.st-of{ color:var(--cream-d); }
.st-caps{ display:grid; margin-top:10px; }
.st-cap{ grid-area:1 / 1; opacity:0; visibility:hidden; }
.st-cap.is-on{ opacity:1; visibility:inherit; }
.st-era{ display:flex; align-items:center; font-size:10.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--acc); }
.st-era span{ min-width:30px; margin-right:12px; padding-right:12px; border-right:1px solid var(--gold-s); }
.st-head{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; column-gap:14px; row-gap:0; margin-top:4px; }
.st-t{ white-space:nowrap; }
.st-t{ font-family:var(--serif); font-style:italic; font-weight:300; font-size:clamp(38px, 10.6vw, 120px); line-height:1.05; color:var(--ink); }
.st-fa{ font-family:"Noto Nastaliq Urdu", serif; font-size:clamp(22px, 6.2vw, 60px); line-height:1.6; color:var(--ink); opacity:.82; white-space:nowrap; }
.st-d{ margin-top:6px; font-size:14px; line-height:1.5; color:var(--cream-d); max-width:44ch; }
.st-d em{ font-family:var(--serif); font-size:1.12em; color:var(--gold); }
.st-dots{ list-style:none; display:flex; gap:8px; margin:auto 0 0; padding:12px 0 0; }
.st-dots li{ width:6px; height:6px; border-radius:50%; border:1px solid var(--gold-s); transition:background .5s, border-color .5s; }
.st-dots li.on{ background:var(--gold); border-color:var(--gold); }
@media (min-width:900px){
  .story{ flex-direction:row; }
  .st-media{ height:auto; margin:0; width:50vw; flex:0 0 auto; }
  .st-m{ inset:calc(var(--top) + 34px) 1vw 58px var(--pad); }
  .st-m video{ object-fit:contain; }
  .st-m:nth-child(4) video, .st-m:nth-child(5) video{ object-position:50% 50%; }
  .st-copy{ flex:1 1 0; justify-content:center; padding:calc(var(--top) + 24px) var(--pad) 90px 4vw; }
  .st-caps{ margin-top:30px; }
  .st-era{ font-size:11.5px; }
  .st-head{ justify-content:flex-start; column-gap:34px; margin-top:14px; }
  .st-t{ font-size:clamp(64px, 6.4vw, 124px); }
  .st-fa{ font-size:clamp(36px, 3.8vw, 68px); }
  .st-d{ margin-top:20px; font-size:18px; line-height:1.62; max-width:40ch; }
  .st-dots{ margin:42px 0 0; padding:0; }
}
@media (min-width:900px) and (max-height:860px){
  .st-m{ inset:calc(var(--top) + 18px) 1vw 40px var(--pad); }
  .st-copy{ padding-top:calc(var(--top) + 10px); padding-bottom:70px; }
  .st-caps{ margin-top:18px; }
  .st-t{ font-size:clamp(58px, 11vh, 100px); }
  .st-fa{ font-size:clamp(30px, 5.6vh, 52px); }
  .st-d{ margin-top:12px; font-size:16px; line-height:1.55; }
  .st-dots{ margin-top:26px; }
}

/* from our kitchen: one plate per gesture */
.gal{ display:flex; flex-direction:column; padding:calc(var(--top) + 4px) var(--pad) 14px; background:radial-gradient(90% 60% at 50% 45%, #FBF8F2 0%, var(--g2) 80%); }
.gal-h{ font-size:clamp(34px, 9.6vw, 112px); line-height:.94; margin-top:8px; }
.gal-stage{ position:relative; flex:1 1 0; min-height:0; margin-top:18px; container-type:size; }
.gal-frame{
  position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);
  width:min(calc(100cqw - 22px), calc((100cqh - 22px) * .8)); height:min(calc(100cqh - 22px), calc((100cqw - 22px) * 1.25));
}
.gal-frame::after{ content:""; position:absolute; inset:-10px; border:1px solid var(--gold-s); pointer-events:none; }
.gal-fig{ position:absolute; inset:0; opacity:0; visibility:hidden; }
.gal-fig.is-on{ opacity:1; visibility:inherit; }
.gal-fig img{ width:100%; height:100%; object-fit:cover; }
.gal-foot{ margin-top:12px; display:flex; align-items:flex-end; justify-content:space-between; gap:16px; }
.gal-caps{ display:grid; flex:1 1 auto; }
.gal-cap{ grid-area:1 / 1; display:grid; grid-template-columns:30px 1fr; column-gap:6px; opacity:0; visibility:hidden; }
.gal-cap.is-on{ opacity:1; visibility:inherit; }
.gal-n{ grid-row:1 / span 2; padding-top:7px; font-size:10.5px; letter-spacing:.3em; color:var(--acc); }
.gal-cap b{ font-family:var(--serif); font-style:italic; font-weight:400; font-size:26px; line-height:1.1; color:var(--ink); }
.gal-cap > span:last-child{ font-size:13.5px; line-height:1.4; color:var(--cream-d); }
.gal-dots{ list-style:none; display:flex; gap:8px; margin:0 0 8px; padding:0; }
.gal-dots li{ width:6px; height:6px; border-radius:50%; border:1px solid var(--gold-s); transition:background .5s, border-color .5s; }
.gal-dots li.on{ background:var(--gold); border-color:var(--gold); }
@media (min-width:900px){
  .gal{ display:grid; grid-template-columns:.85fr 1.15fr; grid-template-rows:1fr auto; grid-template-areas:"head stage" "foot stage"; column-gap:5vw; padding:var(--top) var(--pad) 96px; }
  .gal-head{ grid-area:head; align-self:end; }
  .gal-h{ font-size:clamp(60px, 6.4vw, 112px); }
  .gal-stage{ grid-area:stage; align-self:center; height:min(72vh, 820px); margin:0; }
  .gal-foot{ grid-area:foot; flex-direction:column; align-items:flex-start; margin-top:40px; padding-top:30px; border-top:1px solid var(--gold-s); }
  .gal-caps{ width:100%; }
  .gal-cap{ grid-template-columns:56px 1fr; }
  .gal-n{ padding-top:16px; }
  .gal-cap b{ font-size:46px; }
  .gal-cap > span:last-child{ font-size:15.5px; margin-top:6px; }
  .gal-dots{ margin:30px 0 0 56px; }
}
html:not(.deck) .gal-stage{ container-type:normal; flex:none; }
html:not(.deck) .gal-frame{ position:relative; left:auto; top:auto; transform:none; width:100%; height:auto; }
html:not(.deck) .gal-fig{ position:relative; opacity:1; visibility:visible; margin-bottom:24px; }
html:not(.deck) .gal-caps{ display:block; }
html:not(.deck) .gal-cap{ opacity:1; visibility:visible; margin-bottom:10px; }
html:not(.deck) .gal-dots{ display:none; }

/* catering: three named packages, no prices, one WhatsApp ask */
.cater{ display:flex; align-items:center; padding:var(--top) var(--pad) 14px; background:radial-gradient(90% 60% at 50% 40%, #FBF8F2 0%, var(--g2) 80%); }
.cater-in{ width:100%; max-width:1180px; margin:0 auto; }
.cater h2{ font-size:clamp(40px, 10.6vw, 110px); line-height:.92; margin-top:10px; }
.pk{ list-style:none; margin:16px 0 0; padding:0; border-bottom:1px solid var(--gold-s); }
.pk li{ display:grid; grid-template-columns:30px 1fr; column-gap:6px; padding:9px 0 10px; border-top:1px solid var(--gold-s); }
.pk-n{ grid-row:1 / span 4; padding-top:9px; font-size:10.5px; letter-spacing:.3em; color:var(--acc); }
.pk-ask{ justify-self:start; display:inline-flex; align-items:center; gap:10px; margin-top:7px; padding-bottom:3px; border-bottom:1px solid var(--gold-s); font-size:10.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--ink); transition:color .4s, border-color .4s; }
.pk-ask::after{ content:""; width:16px; height:1px; background:currentColor; transition:width .6s var(--ease); }
.pk-ask:hover{ color:var(--acc); border-color:var(--acc); }
.pk-ask:hover::after{ width:26px; }
.pk-t{ display:flex; align-items:baseline; gap:12px; }
.pk-t b{ font-family:var(--serif); font-style:italic; font-weight:400; font-size:29px; line-height:1.05; color:var(--ink); }
.pk-fa{ font-family:"Noto Nastaliq Urdu", serif; font-size:16px; line-height:1.7; color:var(--cream-d); }
.pk-m{ margin-top:1px; font-size:10.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--acc); }
.pk-d{ margin-top:4px; font-size:13px; line-height:1.42; color:var(--cream-d); }
.cater-foot{ margin-top:16px; display:flex; flex-direction:column; align-items:flex-start; gap:10px; }
.cater-note{ font-size:12.5px; line-height:1.45; color:var(--cream-d); max-width:520px; }
@media (min-width:900px){
  .cater h2{ font-size:clamp(64px, 7vw, 116px); }
  .pk{ display:grid; grid-template-columns:repeat(3, 1fr); margin-top:44px; border-bottom:0; border-top:1px solid var(--gold-s); }
  .pk li{ display:block; padding:28px 2.6vw 4px; border-top:0; }
  .pk li + li{ border-left:1px solid var(--gold-s); }
  .pk li:first-child{ padding-left:0; }
  .pk-n{ display:block; padding:0; }
  .pk-t{ margin-top:16px; flex-direction:column; align-items:flex-start; gap:0; }
  .pk-t b{ font-size:52px; }
  .pk-fa{ font-size:21px; line-height:1.9; }
  .pk-m{ margin-top:4px; }
  .pk-d{ margin-top:14px; font-size:15px; line-height:1.55; max-width:30ch; }
  .pk-ask{ margin-top:22px; padding:13px 18px; border:1px solid var(--gold-s); }
  .pk-ask:hover{ background:var(--gold); color:var(--g2); border-color:var(--gold); }
  .cater-foot{ margin-top:30px; padding-top:24px; border-top:1px solid var(--gold-s); flex-direction:row; align-items:center; gap:34px; }
  .cater-note{ font-size:14.5px; }
}

/* short laptop screens (e.g. 1366x640, 1536x730): every page fits under the top bar */
.cater{ align-items:safe center; padding-top:calc(var(--top) + 14px); }
@media (min-width:900px) and (max-height:860px){
  .pano-title{ top:calc(var(--top) + 18px); }
  .mp-body{ padding-top:calc(var(--top) + 10px); padding-bottom:28px; }
  .mp-h{ font-size:clamp(48px, 9.5vh, 96px); margin-top:10px; }
  .tea .mp-h, .coolers .mp-h{ font-size:clamp(46px, 8.5vh, 84px); }
  .ml{ margin-top:14px; }
  .ml h4{ margin:12px 0 2px; }
  .mi{ padding:5px 0; }
  .mi b{ font-size:22px; }
  .ml-grid .mi b{ font-size:19px; }
  .ml-grid .mi{ padding:4px 0; }
  .price-big{ font-size:38px; margin-top:10px; }
  .kofteh-copy h2{ font-size:clamp(80px, 22vh, 190px); }
  .kofteh-sub{ margin-top:12px; }
  .kofteh .price-big{ font-size:38px; margin-top:10px; }
  .occasions{ padding-bottom:64px; }
  .occasions h2{ font-size:clamp(48px, 10vh, 96px); }
  .occ{ margin-top:20px; }
  .occ a{ padding:1.3vh 0; }
  .occ-t{ font-size:clamp(28px, 5.2vh, 46px); }
  .cater{ padding-bottom:64px; }
  .cater h2{ font-size:clamp(46px, 9vh, 96px); }
  .cater-note{ max-width:none; }
  .pk{ margin-top:22px; }
  .pk li{ padding-top:16px; }
  .pk-t{ margin-top:8px; }
  .pk-t b{ font-size:clamp(36px, 6.6vh, 52px); }
  .pk-fa{ font-size:18px; line-height:1.6; }
  .pk-d{ margin-top:8px; font-size:14px; line-height:1.5; }
  .pk-ask{ margin-top:14px; padding:10px 16px; }
  .cater-foot{ margin-top:18px; padding-top:14px; }
  .cater-note{ font-size:13.5px; }
}

/* =========================================================
   R6 · PAGER (‹ 03 — 23 ›) + SWIPE HINT
   ========================================================= */
.pager{ display:none; position:absolute; right:6px; top:50%; transform:translateY(-50%); align-items:center; }
html.deck .pager{ display:flex; }
.pager .count{ position:static; transform:none; display:flex; }
.pg{
  width:40px; height:40px; display:flex; align-items:center; justify-content:center; padding:0; margin:0;
  background:none; border:0; border-radius:50%; color:var(--gold); cursor:pointer; -webkit-tap-highlight-color:transparent;
  transition:opacity .4s, background .4s;
}
.pg svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.2; stroke-linecap:round; stroke-linejoin:round; }
@media (hover:hover){ .pg:hover{ background:rgba(79,20,34,.06); } }
.pg:focus-visible{ outline:1px solid var(--gold); outline-offset:-4px; }
.pg.is-off{ visibility:hidden; }
/* the giant word is decoration: it must never sit on top of the hero buttons (short laptops) */
.hero-word{ pointer-events:none; }
@media (min-width:900px){
  .pager{ position:fixed; top:auto; bottom:8px; left:calc(var(--pad) - 12px); right:auto; transform:none; }
  .pager .count{ margin:0 2px; }
}
.t-touch{ display:none; }
@media (hover:none) and (pointer:coarse){ .t-touch{ display:inline; } .t-mouse{ display:none; } }
/* phone hero: a quiet 'Swipe' with an arrow drifting left */
@media (max-width:899px) and (hover:none) and (pointer:coarse){
  html.deck .hero .hint{
    display:flex; order:4; align-items:center; gap:10px; margin-top:14px;
    font-size:10px; letter-spacing:.3em; text-transform:uppercase; color:var(--cream-d);
  }
  html.deck .hero .hint i{ position:relative; width:34px; height:1px; background:linear-gradient(to left, transparent, var(--gold)); order:-1; animation:hint-drift 2.2s var(--ease) infinite; }
  html.deck .hero .hint i::before{ content:""; position:absolute; left:0; top:-3px; width:7px; height:7px; border-left:1px solid var(--gold); border-bottom:1px solid var(--gold); transform:rotate(45deg); }
}
@keyframes hint-drift{ 0%{ transform:translateX(10px); opacity:0; } 30%{ opacity:1; } 100%{ transform:translateX(-12px); opacity:0; } }
@media (prefers-reduced-motion:reduce){ .hero .hint i{ animation:none !important; } }

/* =========================================================
   R6 · THE FULL MENU — in-site panel, one gesture = one dish
   ========================================================= */
.menu-ov{
  position:fixed; inset:0; z-index:200; background:var(--g2); color:var(--ink);
  display:flex; flex-direction:column; overflow:hidden; overscroll-behavior:none;
  opacity:0; transform:translateY(16px); transition:opacity .45s var(--ease), transform .55s var(--ease);
}
.menu-ov[hidden]{ display:none; }
.menu-ov.is-open{ opacity:1; transform:none; }
html.menu-on, html.menu-on body{ overflow:hidden; }
.mo-head{ flex:none; background:var(--g2); border-bottom:1px solid rgba(79,20,34,.14); }
.mo-top{ position:relative; padding:14px 64px 4px var(--pad); }
.mo-top .label{ font-size:10px; letter-spacing:.28em; }
.mo-top h2{ margin-top:3px; font-family:var(--serif); font-size:32px; line-height:1; font-weight:300; color:var(--ink); }
.mo-top h2 em{ color:var(--gold); font-style:italic; }
.mo-x{
  position:absolute; right:10px; top:10px; width:44px; height:44px; display:flex; align-items:center; justify-content:center;
  background:none; border:1px solid var(--gold-s); border-radius:50%; color:var(--gold); cursor:pointer; padding:0;
}
.mo-x svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.2; stroke-linecap:round; }
@media (hover:hover){ .mo-x:hover{ background:var(--gold); color:var(--g2); border-color:var(--gold); } }
.mo-chips{
  display:flex; gap:6px; overflow-x:auto; padding:8px var(--pad) 10px; scrollbar-width:none; touch-action:pan-x;
  -webkit-mask:linear-gradient(to right, transparent 0, #000 14px, #000 calc(100% - 22px), transparent); mask:linear-gradient(to right, transparent 0, #000 14px, #000 calc(100% - 22px), transparent);
}
.mo-chips::-webkit-scrollbar{ display:none; }
.mo-chips a{
  flex:none; display:inline-flex; align-items:center; height:32px; padding:0 13px; border:1px solid var(--gold-s); border-radius:16px;
  font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--cream-d); white-space:nowrap; transition:background .35s, color .35s, border-color .35s;
}
.mo-chips a.is-on{ background:var(--gold); border-color:var(--gold); color:var(--g2); }

/* the stage: scenes stacked, one shown */
.mo-stage{ position:relative; flex:1 1 auto; min-height:0; overflow:hidden; touch-action:none; }
.ms{
  position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-start; gap:20px;
  padding:18px 0 12px; visibility:hidden; opacity:0;
  transition:opacity .6s var(--ease), visibility 0s linear .6s;
}
.ms.is-on{ visibility:visible; opacity:1; transition:opacity .7s var(--ease) .08s, visibility 0s; }
.ms-ph{ flex:0 1 auto; min-height:0; display:flex; justify-content:center; margin:0; }
.ms-ph img{ width:100%; height:auto; max-height:100%; object-fit:contain; display:block; }
.ms-tx{ flex:none; padding:0 var(--pad); }
.ms-cat{ display:flex; justify-content:space-between; gap:12px; font-size:10px; letter-spacing:.26em; text-transform:uppercase; color:var(--acc); }
.ms-k{ color:var(--cream-d); font-variant-numeric:tabular-nums; }
.ms h3{ margin-top:10px; font-family:var(--serif); font-size:38px; line-height:1.05; font-weight:400; color:var(--ink); }
.ms h3 small{ font-family:var(--sans); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--cream-d); margin-left:6px; white-space:nowrap; }
.ms h3 em{ font-style:normal; color:var(--gold); margin-left:10px; white-space:nowrap; }
@media (max-width:899px){ .ms h3 em{ display:block; margin:4px 0 0; } }
.ms-d{ margin-top:8px; font-size:15.5px; line-height:1.45; color:var(--cream-d); }
.ms-note{ margin-top:8px; font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--acc); }
.ms-p{ margin-top:14px; font-family:var(--serif); font-size:32px; color:var(--gold); letter-spacing:.02em; }
.ms .serves{ margin-top:12px; }
.ms-list{ justify-content:center; }
.ms-list .ms-tx{ width:100%; }
.ms-list .ml{ margin-top:14px; }
.ms-list .mi b{ font-size:22px; }
.ms-lunch .lunch-course{ margin:10px 0 0; }
.ms-lunch .lunch-course li{ font-size:19px; padding:6px 0; }
/* scene motion: the photo settles, the words rise */
.ms .ms-ph img{ transform:scale(1.03); transition:transform 1.2s var(--ease); }
.ms.is-on .ms-ph img{ transform:none; }
.ms .ms-tx > *{ transform:translateY(10px); transition:transform .8s var(--ease) .12s; }
.ms.is-on .ms-tx > *{ transform:none; }

.mo-pager{ flex:none; display:flex; align-items:center; justify-content:center; gap:6px; height:calc(54px + env(safe-area-inset-bottom)); padding-bottom:env(safe-area-inset-bottom); border-top:1px solid rgba(79,20,34,.14); }
.mo-count{ display:flex; align-items:center; gap:8px; font-size:11px; letter-spacing:.24em; color:var(--acc); font-variant-numeric:tabular-nums; min-width:92px; justify-content:center; }
.mo-count i{ width:16px; height:1px; background:var(--gold-s); }
.mo-t{ color:var(--cream-d); }

@media (min-width:900px){
  .mo-top{ padding:22px 96px 6px var(--pad); display:flex; align-items:baseline; gap:28px; }
  .mo-top h2{ font-size:46px; margin:0; }
  .mo-top .label{ order:2; }
  .mo-x{ right:var(--pad); top:18px; width:48px; height:48px; }
  .mo-chips{ padding:6px var(--pad) 14px; gap:8px; flex-wrap:wrap; -webkit-mask:none; mask:none; }
  .ms{ flex-direction:row; align-items:center; justify-content:flex-start; gap:5vw; padding:3vh var(--pad); }
  .ms-ph{ flex:0 0 58%; height:100%; align-items:center; }
  .ms-ph img{ height:100%; width:100%; }
  .ms-tx{ flex:1 1 auto; padding:0; max-width:460px; }
  .ms h3{ font-size:48px; margin-top:14px; }
  .ms-d{ font-size:16px; margin-top:10px; }
  .ms-p{ font-size:34px; margin-top:18px; }
  .ms-list{ justify-content:center; }
  .ms-list .ms-tx{ max-width:620px; }
  .mo-pager{ height:62px; }
}
@media (min-width:900px) and (max-height:760px){
  .mo-top{ padding-top:14px; }
  .mo-top h2{ font-size:38px; }
  .mo-chips{ padding-bottom:10px; }
  .ms h3{ font-size:40px; }
  .ms-lunch .lunch-course li{ font-size:18px; padding:4px 0; }
  .mo-pager{ height:52px; }
}
@media (prefers-reduced-motion:reduce){ .menu-ov{ transition:opacity .2s; transform:none; } .ms .ms-ph img, .ms .ms-tx > *{ transform:none; transition:none; } }
/* occasions on tall desktops: the last row ends clear of the pager */
@media (min-width:900px) and (min-height:861px){
  .occasions{ padding-bottom:48px; }
  .occ{ margin-top:40px; }
  .occ a{ padding:20px 0; }
}