:root{
  --burgundy:#460F21;
  --burgundy-deep:#2c0915;
  --champagne:#E3CEA4;
  --champagne-soft:#cdb98f;
  --ink:#0b0708;
  --ink-2:#140f0e;
  --ink-3:#1f1715;
  --line:rgba(227,206,164,.14);
  --serif:'Cormorant Garamond', Georgia, serif;
  --sans:'Jost', system-ui, sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
/* Everything on the page is sized in rem against one 17-step scale, so the
   whole system moves together from here rather than by touching each rule —
   the fluid heading clamps included. 17.5px lands body copy near 17px, which
   is where longer reading gets comfortable. */
html{overflow-x:hidden;font-size:17.5px}
body{
  background:var(--ink);color:#e9e3d8;font-family:var(--sans);font-weight:300;line-height:1.7;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;cursor:none;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
/* Body text is weight 300, and a browser's default for <strong> is "bolder",
   which from 300 resolves to 400 — no visible emphasis at all. Every
   <strong> on the site was flat until this. */
strong{font-weight:600;color:#efe9de}
::selection{background:var(--champagne);color:var(--ink)}
.wrap{max-width:1400px;margin:0 auto;padding:0 40px}
.eyebrow{font-size:.78rem;letter-spacing:.42em;text-transform:uppercase;color:var(--champagne-soft);font-weight:400}
h1,h2,h3{font-family:var(--serif);font-weight:500;letter-spacing:.01em;line-height:1.04}

/* line-mask reveal primitives */
.line-mask{overflow:hidden;display:inline-block;vertical-align:top}
.reveal-word{display:inline-block}

/* CUSTOM CURSOR */
.cursor{position:fixed;top:0;left:0;width:9px;height:9px;border-radius:50%;background:var(--champagne);z-index:200;pointer-events:none;transform:translate(-50%,-50%);transition:width .3s,height .3s,background .3s,opacity .3s;mix-blend-mode:difference}
.cursor-ring{position:fixed;top:0;left:0;width:42px;height:42px;border:1px solid rgba(227,206,164,.5);border-radius:50%;z-index:200;pointer-events:none;transform:translate(-50%,-50%);transition:width .35s cubic-bezier(.2,.8,.2,1),height .35s cubic-bezier(.2,.8,.2,1),opacity .3s,border-color .3s}
body.hovering .cursor{width:0;height:0}
body.hovering .cursor-ring{width:66px;height:66px;border-color:var(--champagne)}

/* HEADER */
/* MODERN FLOATING PILL HEADER */
header{position:fixed;top:0;left:0;right:0;z-index:60;padding:18px 0;transition:padding .4s ease}
header.scrolled{padding:10px 0}
header .wrap{max-width:1120px}
.nav{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  background:rgba(16,11,11,.5);
  -webkit-backdrop-filter:blur(22px) saturate(1.3);backdrop-filter:blur(22px) saturate(1.3);
  border:1px solid rgba(227,206,164,.16);
  border-radius:60px;
  padding:9px 9px 9px 24px;
  box-shadow:0 14px 50px rgba(0,0,0,.34);
  transition:background .4s,border-color .4s;
}
header.scrolled .nav,header.solid .nav{background:rgba(13,9,9,.72);border-color:rgba(227,206,164,.24)}
.brand{display:flex;align-items:center}
.brand img{height:30px;filter:brightness(1.05);transition:.3s}
.nav-links{display:flex;gap:4px;list-style:none;align-items:center}
.nav-links li{display:flex;align-items:center}
.nav-links a{display:inline-flex;align-items:center;gap:8px;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:#d8d0c2;padding:10px 16px;border-radius:40px;transition:color .3s,background .3s,box-shadow .3s;font-weight:400;line-height:1.2}
.nav-links a:hover{color:var(--champagne);background:rgba(227,206,164,.08)}
.nav-links a.active{color:var(--champagne);background:rgba(227,206,164,.09);box-shadow:inset 0 0 0 1px rgba(227,206,164,.22)}
.btn-order{display:inline-flex;align-items:center;gap:9px;background:var(--champagne);color:var(--ink);padding:12px 22px;border-radius:50px;cursor:none;border:none;font-family:var(--sans);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;transition:.35s;text-decoration:none;white-space:nowrap}
.btn-order:hover{background:#fff;box-shadow:0 10px 26px rgba(227,206,164,.3)}
.btn-order svg{width:15px;height:15px}
.menu-toggle{display:none;background:none;border:none;color:var(--champagne);cursor:none;padding:8px}

/* MOBILE NAV */
.mobile-nav{position:fixed;inset:0;z-index:130;background:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;opacity:0;pointer-events:none;transition:opacity .4s}
.mobile-nav.open{opacity:1;pointer-events:auto}
.mobile-nav a{font-family:var(--serif);font-size:2.1rem;color:#e9e3d8;padding:8px;transition:.3s}
.mobile-nav a:hover,.mobile-nav a.active{color:var(--champagne)}
.mobile-nav .btn-order{margin-top:24px;font-family:var(--sans);font-size:.86rem}
.mobile-nav .x{position:absolute;top:24px;right:24px;background:none;border:1px solid var(--line);color:var(--champagne);width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer}

/* GHOST / LINK BUTTONS */
.ghost{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 28px;border-radius:50px;border:1px solid var(--line);color:var(--champagne);font-size:.82rem;letter-spacing:.18em;text-transform:uppercase;transition:.35s;cursor:none;font-family:var(--sans);background:transparent;white-space:nowrap;line-height:1.2}
.ghost svg{width:15px;height:15px;flex-shrink:0}
.ghost:hover{border-color:var(--champagne);background:rgba(227,206,164,.06)}

/* HERO — split: copy left, living mosaic right */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden;padding:130px 0 70px;background:var(--ink)}
.hero-glow{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(56% 58% at 74% 40%,rgba(70,15,33,.5),transparent 66%),
             radial-gradient(42% 46% at 10% 90%,rgba(227,206,164,.05),transparent 62%)}
.hero-inner{position:relative;z-index:3;width:100%;display:grid;grid-template-columns:1fr .98fr;gap:min(5vw,64px);align-items:center;
  /* Everything hanging below the plate: its caption and the arrows. The copy
     is centred against the whole column, so without allowing for this it
     settles half that distance below the plate itself and reads as
     off-centre. */
  --plate-tail:168px;
}
.hero-copy{max-width:560px;transform:translateY(calc(var(--plate-tail) / -2))}
.hero .eyebrow{display:block;margin-bottom:26px;overflow:hidden}
.hero h1{font-size:clamp(2.2rem,3.9vw,3.8rem);color:#fff;letter-spacing:-.01em;font-weight:500;line-height:1.08}

/* living mosaic */
/* ---------- HERO PLATE ----------
   One dish at a time on a slowly turning plate, swapped for the next as if
   the table were being served. */
.hero-plate{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center}
.plate-glow{
  position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);
  width:118%;aspect-ratio:1;border-radius:50%;pointer-events:none;z-index:0;
  background:radial-gradient(circle,rgba(227,206,164,.13),rgba(70,15,33,.16) 45%,transparent 68%);
}
.plate-stage{
  position:relative;z-index:1;width:min(46vw,520px);aspect-ratio:1;
  filter:drop-shadow(0 34px 46px rgba(0,0,0,.6));
}
.plate-stage img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:contain;
  opacity:0;will-change:transform,opacity;
}
.plate-stage img.on{opacity:1}

.plate-meta{position:relative;z-index:2;text-align:center;margin-top:24px;min-height:76px}
.plate-meta b{display:block;font-family:var(--serif);font-size:1.52rem;color:#fff;font-weight:500;line-height:1.2}
.plate-meta span{display:block;font-size:.92rem;color:#a99f8f;margin-top:5px;line-height:1.6;max-width:340px;margin-inline:auto}

.plate-nav{position:relative;z-index:2;display:flex;align-items:center;gap:18px;margin-top:14px}
.pnav{
  width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:transparent;
  color:#cbbfac;display:grid;place-items:center;cursor:none;transition:.3s;flex-shrink:0;
}
.pnav svg{width:17px;height:17px}
.pnav:hover{border-color:var(--champagne);color:var(--champagne)}
.pnav:focus-visible{outline:2px solid var(--champagne);outline-offset:3px}
.plate-dots{display:flex;gap:7px;align-items:center}
.plate-dots i{display:block;width:6px;height:6px;border-radius:50%;background:rgba(227,206,164,.26);transition:.4s;cursor:none}
.plate-dots i.on{background:var(--champagne);transform:scale(1.45)}

@media(max-width:980px){
  .plate-stage{width:min(76vw,420px)}
  .plate-glow{width:112%}
}
@media(max-width:680px){
  .plate-stage{width:min(82vw,360px)}
  .plate-meta{margin-top:18px;min-height:0}
  .plate-meta b{font-size:1.34rem}
  .plate-nav{margin-top:12px}
  .pnav,.plate-dots i{cursor:pointer}
}
.hero h1 em{font-style:italic;color:var(--champagne);font-weight:400}
.hero h1 .line-mask{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.hero h1 .reveal-line{display:block;will-change:transform}
.m-only{display:none}
.hero p{max-width:430px;color:#d8cdbb;font-size:1.06rem;line-height:1.62}
.hero p.hero-lead{margin:28px 0 0}
.hero p.hero-sub{margin:16px 0 0;font-size:.98rem;color:#a89e8e}
.hero-cta{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.scroll-cue{position:absolute;bottom:34px;left:50%;transform:translateX(-50%);z-index:4;font-size:.74rem;letter-spacing:.34em;text-transform:uppercase;color:var(--champagne-soft);display:flex;flex-direction:column;align-items:center;gap:12px}
.scroll-cue i{width:1px;height:48px;background:linear-gradient(var(--champagne),transparent);display:block}

/* INNER PAGE HERO */
.page-hero{position:relative;padding:210px 0 96px;overflow:hidden;border-bottom:1px solid var(--line)}
.page-hero .pbg{position:absolute;inset:0;z-index:0}
.page-hero .pbg img{width:100%;height:100%;object-fit:cover;opacity:.45;transform:scale(1.05)}
.page-hero .pbg::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--ink),rgba(11,7,8,.4) 70%),linear-gradient(90deg,var(--ink) 5%,rgba(11,7,8,.2) 70%)}
.page-hero .wrap{position:relative;z-index:2}
.page-hero h1{font-size:clamp(2.4rem,4.8vw,4rem);color:#fff;margin:18px 0 16px}
.page-hero h1 em{font-style:italic;color:var(--champagne)}
.page-hero p{max-width:540px;color:#cabfae;font-size:1.06rem}
.crumbs{font-family:var(--sans);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--champagne-soft)}
.crumbs a:hover{color:var(--champagne)}
.crumbs span{opacity:.5;margin:0 8px}

/* VELOCITY MARQUEE */
.marquee{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;overflow:hidden;background:var(--ink-2);white-space:nowrap}
.marquee-track{display:inline-flex;gap:54px;font-family:var(--serif);font-style:italic;font-size:1.9rem;color:var(--champagne-soft);will-change:transform}
.marquee-track span{display:inline-flex;align-items:center;gap:54px}
.marquee-track span::after{content:"✦";color:var(--burgundy);font-style:normal}

/* SECTION */
.section{padding:140px 0;position:relative}
.label{display:flex;align-items:center;gap:16px;margin-bottom:26px}
.label i{width:46px;height:1px;background:var(--champagne-soft);display:block}

/* STORY / ABOUT split */
.story,.split{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}
.story-media,.split-media{position:relative;height:620px;border-radius:8px;overflow:hidden;border:1px solid var(--line)}
.story-media img,.split-media img{width:100%;height:120%;object-fit:cover;will-change:transform}
.story h2,.split h2{font-size:clamp(2.15rem,4.2vw,3.3rem);color:#fff;margin:20px 0 26px}
.story h2 em,.split h2 em{font-style:italic;color:var(--champagne)}
.story p,.split p{color:#bcb3a4;margin-bottom:18px}
.stats{display:flex;gap:46px;margin-top:38px;padding-top:30px;border-top:1px solid var(--line)}
.stats b{font-family:var(--serif);font-size:2.8rem;color:var(--champagne);display:block;line-height:1;font-weight:500}
.stats small{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:#9b9182}

/* SIGNATURE (pinned) */
.signature{position:relative;height:100vh;min-height:640px;overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center}
.sig-bg{position:absolute;inset:0;z-index:0}
.sig-bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.1);will-change:transform}
.sig-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(80% 80% at 50% 50%,rgba(11,7,8,.35),var(--ink))}
.sig-inner{position:relative;z-index:2;max-width:760px;padding:0 30px}
.sig-inner .eyebrow{display:block;margin-bottom:22px}
.sig-inner h2{font-size:clamp(2.4rem,5.4vw,4.6rem);color:#fff}
.sig-inner h2 em{font-style:italic;color:var(--champagne)}
.sig-inner p{color:#cabfae;max-width:480px;margin:24px auto 0}

/* MENU TEASER (home) */
.teaser{display:grid;grid-template-columns:1fr 1.05fr;gap:72px;align-items:center}
.teaser-copy h2{font-size:clamp(2.2rem,4.6vw,3.6rem);color:#fff;margin:18px 0 22px}
.teaser-copy h2 em{font-style:italic;color:var(--champagne)}
.teaser-copy p{color:#bcb3a4;margin-bottom:30px;max-width:420px}
.teaser-imgs{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.teaser-imgs figure{border-radius:10px;overflow:hidden;border:1px solid var(--line);height:230px;position:relative}
.teaser-imgs img{width:100%;height:100%;object-fit:cover;transition:.7s}
.teaser-imgs figure:hover img{transform:scale(1.06)}
.teaser-imgs figcaption{position:absolute;left:12px;bottom:11px;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:#fff;background:rgba(11,7,8,.6);backdrop-filter:blur(6px);padding:6px 11px;border-radius:30px}

/* MENU GRID (menu page) */
.menu-head{text-align:center;max-width:640px;margin:0 auto 56px}
.menu-head h2{font-size:clamp(2.2rem,4.6vw,3.6rem);color:#fff;margin:18px 0}
.menu-head h2 em{font-style:italic;color:var(--champagne)}
.menu-head p{color:#b3ab9d}
.tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:54px}
.tab{background:transparent;border:1px solid var(--line);color:#c9bfac;padding:11px 24px;border-radius:50px;cursor:none;font-family:var(--sans);font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;transition:.3s}
.tab:hover{border-color:var(--champagne-soft)}
.tab.active{background:var(--champagne);color:var(--ink);border-color:var(--champagne)}
.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.dish{background:linear-gradient(180deg,var(--ink-2),var(--ink-3));border:1px solid var(--line);border-radius:10px;overflow:hidden;transition:.4s;will-change:transform,opacity}
.dish:hover{transform:translateY(-6px);border-color:rgba(227,206,164,.3);box-shadow:0 24px 50px rgba(0,0,0,.5)}
.dish-img{height:230px;overflow:hidden}
.dish-img img{width:100%;height:100%;object-fit:cover;transition:.7s}
.dish:hover .dish-img img{transform:scale(1.07)}
.dish-body{padding:24px 24px 26px}
.dish-body h3{font-size:1.52rem;color:#fff;margin-bottom:6px}
.dish-body p{font-size:.92rem;color:#a99f8f;font-weight:300;line-height:1.55}
.dish-tag{display:inline-block;margin-top:14px;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--champagne-soft);border:1px solid var(--line);padding:5px 12px;border-radius:30px}
.menu-note{text-align:center;margin-top:52px}

/* CORPORATE */
.corp{background:linear-gradient(180deg,var(--ink-2),var(--ink));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.corp-head{text-align:center;max-width:660px;margin:0 auto 56px}
.corp-head h2{font-size:clamp(2.2rem,4.4vw,3.5rem);color:#fff;margin:16px 0}
.corp-head h2 em{font-style:italic;color:var(--champagne)}
.corp-head p{color:#b3ab9d}
.corp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:54px}
.corp-card{border:1px solid var(--line);border-radius:14px;padding:40px 34px;background:rgba(255,255,255,.02);transition:.4s}
.corp-card:hover{transform:translateY(-6px);border-color:rgba(227,206,164,.32);box-shadow:0 24px 50px rgba(0,0,0,.4)}
.corp-card .ic{color:var(--champagne);margin-bottom:20px;display:block}
.corp-card .ic svg{width:34px;height:34px}
.corp-card h3{font-size:1.52rem;color:#fff;margin-bottom:10px}
.corp-card p{font-size:.98rem;color:#a99f8f}
.corp-cta{text-align:center}

/* STEPS */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;counter-reset:s}
.step{position:relative;padding-top:14px}
.step .num{font-family:var(--serif);font-size:3.4rem;color:var(--champagne);line-height:1;display:block;margin-bottom:16px;font-weight:500}
.step h3{font-size:1.52rem;color:#fff;margin-bottom:8px}
.step p{color:#a99f8f;font-size:.98rem}

/* CTA BAND */
.cta-band{scroll-margin-top:96px;text-align:center;background:linear-gradient(180deg,var(--ink),var(--burgundy-deep));padding:130px 0}
.cta-band h2{font-size:clamp(2.4rem,5vw,4rem);color:#fff;margin:16px 0 14px}
.cta-band h2 em{font-style:italic;color:var(--champagne)}
.cta-band p{color:#cabfae;max-width:520px;margin:0 auto 40px}
.cta-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;align-items:stretch}
/* all three CTAs share one silhouette: same height, padding, type scale */
.cta-row .btn-order,.cta-row .ghost{min-height:52px;padding:0 26px;font-size:.78rem;letter-spacing:.15em;gap:10px}
.cta-row .btn-order svg,.cta-row .ghost svg{width:16px;height:16px}

/* CONTACT FORM */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start}
.form{display:grid;gap:18px}
.form .frow{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field label{display:block;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--champagne-soft);margin-bottom:8px}
.field input,.field textarea{width:100%;background:var(--ink-2);border:1px solid var(--line);border-radius:10px;color:#e9e3d8;padding:14px 16px;font-family:var(--sans);font-size:.98rem;transition:.3s;cursor:none}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--champagne);background:var(--ink-3)}
.field textarea{min-height:140px;resize:vertical}
.form-note{font-size:.86rem;color:#8c8273}

/* INFO LIST (contact) */
.vrow{display:flex;gap:18px;padding:20px 0;border-top:1px solid var(--line)}
.vrow:last-child{border-bottom:1px solid var(--line)}
.vrow .ic{color:var(--champagne);flex-shrink:0;margin-top:3px}
.vrow b{display:block;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--champagne-soft);margin-bottom:5px;font-weight:500}
.vrow span{color:#d6cdbd;font-size:1.06rem}
.map{margin-top:30px;border:1px solid var(--line);border-radius:12px;overflow:hidden;height:280px;background:var(--ink-2);position:relative}
.map iframe{width:100%;height:100%;border:0;filter:grayscale(.4) invert(.92) hue-rotate(180deg) contrast(.9)}

/* ORDER */
.order-band{position:relative;padding:60px 0 80px;text-align:center;background:linear-gradient(180deg,var(--ink),var(--burgundy-deep))}
.order-band h2{font-size:clamp(2.4rem,4.8vw,4rem);color:#fff;margin:18px 0 14px}
.order-band h2 em{font-style:italic;color:var(--champagne)}
.order-band p{color:#cabfae;max-width:540px;margin:0 auto 44px}
.order-band p em{font-style:normal;color:var(--champagne);font-weight:600}
/* ORDER PLATFORM TILES (eye-catching) */
/* PRELOADER */
.preloader{position:fixed;inset:0;z-index:400;background:var(--ink);display:flex;align-items:center;justify-content:center;animation:preKill .5s 6s forwards}
.pre-inner{display:flex;flex-direction:column;align-items:center;gap:26px}
.pre-logo{height:42px;width:auto;opacity:0;animation:preIn .65s .05s cubic-bezier(.2,.7,.2,1) forwards}
.pre-line{width:160px;height:1px;background:rgba(227,206,164,.16);overflow:hidden;display:block}
.pre-line i{display:block;height:100%;background:var(--champagne);transform:scaleX(0);transform-origin:0 50%;animation:preFill 2.2s .3s cubic-bezier(.25,.6,.25,1) forwards}
.preloader.done{opacity:0;visibility:hidden;transition:opacity .5s,visibility .5s}
@keyframes preIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes preFill{to{transform:scaleX(.72)}}
@keyframes preKill{to{opacity:0;visibility:hidden}}

/* ============ LIVE DOT (nav + band) ============ */
@keyframes livePulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.62)}}
@keyframes liveRing{0%{transform:scale(.7);opacity:.65}70%,100%{transform:scale(2.6);opacity:0}}

/* the Reserve link gets a small breathing dot so it reads as "open now" */
.nav-links a.res-link,.mobile-nav a.res-link{position:relative;display:inline-flex;align-items:center;gap:8px}
.mobile-nav a.res-link{line-height:1.1}
.live-dot{position:relative;width:7px;height:7px;border-radius:50%;background:#7ddba4;flex-shrink:0;
  box-shadow:0 0 8px rgba(125,219,164,.75);animation:livePulse 2s ease-in-out infinite}
.live-dot::after{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid #7ddba4;animation:liveRing 2s ease-out infinite}
.mobile-nav .live-dot{width:9px;height:9px}

/* ============ RESERVE STRIP (slim, right under the hero) ============ */
.rsv-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:linear-gradient(90deg,rgba(70,15,33,.34),rgba(255,255,255,.02) 55%,rgba(70,15,33,.28))}
/* Two classes on purpose. This div is `wrap rsv-strip-in`, and .wrap's
   phone rule (padding:0 20px) appears later in the file — at equal
   specificity it won, leaving the strip with no vertical padding at all
   and its contents sitting 1px off a visible border. */
.rsv-strip .rsv-strip-in{display:flex;align-items:center;gap:26px;padding:26px 40px;flex-wrap:wrap}
.rss-live{display:inline-flex;align-items:center;gap:9px;font-size:.74rem;letter-spacing:.2em;
  text-transform:uppercase;color:#a5e0bf;white-space:nowrap;flex-shrink:0}
.rss-live i{position:relative;width:7px;height:7px;border-radius:50%;background:#7ddba4;flex-shrink:0;
  box-shadow:0 0 8px rgba(125,219,164,.75);animation:livePulse 2s ease-in-out infinite}
.rss-live i::after{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid #7ddba4;animation:liveRing 2s ease-out infinite}
.rss-line{flex:1;min-width:200px;margin:0;color:#c3b9a9;font-size:.98rem;line-height:1.6}
.rss-line strong{color:#fff;font-weight:500}
.rss-btn{display:inline-flex;align-items:center;gap:9px;flex-shrink:0;padding:12px 24px;border-radius:50px;
  border:1px solid rgba(227,206,164,.45);color:var(--champagne);font-size:.78rem;letter-spacing:.15em;
  text-transform:uppercase;font-weight:600;cursor:none;transition:.35s;white-space:nowrap}
.rss-btn svg{width:15px;height:15px;transition:transform .3s}
.rss-btn:hover{background:var(--champagne);border-color:var(--champagne);color:var(--ink)}
.rss-btn:hover svg{transform:translateX(4px)}

/* the Reserve button borrows the live dot wherever it appears */
.btn-order .live-dot,.ghost .live-dot{margin-left:-2px}
.menu-note{display:flex;gap:14px;justify-content:center;align-items:center;flex-wrap:wrap}

@media(max-width:780px){
  .rsv-strip .rsv-strip-in{padding:34px 22px;gap:18px}
  .rss-line{flex:1 1 100%;order:2;min-width:0;font-size:.98rem}
  .rss-btn{order:3;width:100%;justify-content:center}
}

/* ============ RESERVE BAND (home) ============ */
.rsv-band{position:relative;overflow:hidden;padding:120px 0;background:linear-gradient(180deg,var(--ink),var(--burgundy-deep) 62%,var(--ink))}
.rsv-band-glow{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(48% 52% at 22% 40%,rgba(227,206,164,.09),transparent 66%),
             radial-gradient(46% 48% at 84% 72%,rgba(70,15,33,.55),transparent 68%)}
.rsv-band-in{position:relative;z-index:2;display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:center}
.rsv-band-copy{max-width:520px}
.live-tag{display:inline-flex;align-items:center;gap:10px;padding:15px 22px 15px 20px;border-radius:40px;
  /* The label is uppercase with wide letter-spacing, which makes a pill
     look tighter than the numbers suggest — 8px left the letters almost
     touching the border. Slightly less on the right because the trailing
     letter-space already adds room there. */
  border:1px solid rgba(125,219,164,.3);background:rgba(125,219,164,.07);color:#a5e0bf;
  font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;font-weight:500;margin-bottom:24px}
.live-tag i{position:relative;width:7px;height:7px;border-radius:50%;background:#7ddba4;flex-shrink:0;
  box-shadow:0 0 8px rgba(125,219,164,.75);animation:livePulse 2s ease-in-out infinite}
.live-tag i::after{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid #7ddba4;animation:liveRing 2s ease-out infinite}
.rsv-band h2{font-size:clamp(2.2rem,4.6vw,3.7rem);color:#fff;line-height:1.06;font-weight:500;margin-bottom:20px}
.rsv-band h2 em{font-style:italic;color:var(--champagne)}
.rsv-band p{color:#cbbfac;font-size:1.06rem;line-height:1.75;max-width:460px;margin-bottom:34px}
.rsv-band-cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.rsv-band-cta .ghost svg{width:15px;height:15px;flex-shrink:0}

.rsv-band-steps{display:flex;flex-direction:column;gap:2px}
.rb-step{display:flex;align-items:flex-start;gap:18px;padding:22px 24px;border:1px solid var(--line);
  background:rgba(255,255,255,.025);transition:border-color .4s,background .4s}
.rb-step:first-child{border-radius:16px 16px 0 0}
.rb-step:last-child{border-radius:0 0 16px 16px}
.rb-step + .rb-step{border-top:none}
.rb-step:hover{border-color:rgba(227,206,164,.34);background:rgba(255,255,255,.05)}
.rb-step b{font-family:var(--serif);font-size:1.52rem;color:var(--champagne);font-weight:500;line-height:1;flex-shrink:0;min-width:34px}
.rb-step span{color:#c3b9a9;font-size:.98rem;line-height:1.6}

@media(max-width:980px){
  .rsv-band{padding:90px 0}
  .rsv-band-in{grid-template-columns:minmax(0,1fr);gap:44px}
  .rsv-band-copy{max-width:100%}
  .rsv-band p{max-width:100%}
}
@media(max-width:680px){
  /* A full-bleed coloured band on a narrow screen: its own padding is the
     only thing holding the words off a visible edge, so it needs noticeably
     more than the plain sections around it, not the same. */
  .rsv-band{padding:132px 0}
  .live-tag{margin-bottom:30px}
  .rsv-band-in{gap:60px}
  .rsv-band .wrap{padding:0 32px}   /* bordered boxes need more room off the edge than plain text does */
  .rsv-band-cta{flex-direction:column;align-items:stretch}
  .rsv-band-cta .btn-order,.rsv-band-cta .ghost{width:100%;justify-content:center}
  .rb-step{padding:24px 22px;gap:18px}
  .rb-step b{font-size:1.34rem;min-width:28px}
}

/* ============ RESERVATION FORM ============ */
.rsv-section{padding-top:80px}
.rsv-wrap{display:grid;grid-template-columns:1fr 300px;gap:56px;align-items:start}

.rsv-step{padding-bottom:44px;margin-bottom:44px;border-bottom:1px solid var(--line)}
.rsv-head{display:flex;align-items:baseline;gap:16px;margin-bottom:24px}
.rsv-num{font-family:var(--mono,var(--sans));font-size:.74rem;letter-spacing:.18em;color:var(--champagne);font-weight:600;flex-shrink:0}
.rsv-head h2{font-size:clamp(1.62rem,2.6vw,2.2rem);color:#fff;font-weight:500;line-height:1.2}
.rsv-hint{font-size:.92rem;color:#9b9182;margin-top:14px;line-height:1.7}
.rsv-hint a{color:var(--champagne);border-bottom:1px solid rgba(227,206,164,.3)}
.rsv-hint.closed{color:#cbbfac;background:rgba(227,206,164,.05);border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin-top:0}

/* party size */
.party-pick{display:flex;flex-wrap:wrap;gap:9px}
.party-btn{
  min-width:54px;height:54px;padding:0 6px;border-radius:14px;border:1px solid var(--line);
  background:rgba(255,255,255,.02);color:#d8cdbb;font-family:var(--serif);font-size:1.34rem;
  cursor:none;transition:.3s;line-height:1;
}
.party-btn:hover{border-color:rgba(227,206,164,.45);color:#fff}
.party-btn.on{background:var(--champagne);border-color:var(--champagne);color:var(--ink);font-weight:600}
.party-btn:focus-visible{outline:2px solid var(--champagne);outline-offset:2px}

/* date */
.date-row{display:flex;gap:20px;align-items:flex-end;flex-wrap:wrap;margin-bottom:26px}
.rsv-field{flex:1;min-width:200px}
.rsv-field label{display:block;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--champagne-soft);margin-bottom:8px}
.rsv-field label .opt{text-transform:none;letter-spacing:0;color:#7d7168;font-size:.86rem}
.rsv-field input,.rsv-field textarea{
  width:100%;background:var(--ink-2);border:1px solid var(--line);border-radius:12px;color:#e9e3d8;
  padding:14px 16px;font-family:var(--sans);font-size:.98rem;transition:.3s;cursor:none;
}
.rsv-field input:focus,.rsv-field textarea:focus{outline:none;border-color:var(--champagne);background:var(--ink-3)}
.rsv-field textarea{resize:vertical;min-height:88px}
.rsv-field.bad input,.rsv-field.bad textarea{border-color:#c96a6a}
.rsv-err{display:block;font-size:.86rem;color:#e08d8d;margin-top:6px;min-height:1px}
.rsv-field input[type=date]{color-scheme:dark}
.date-quick{display:flex;gap:8px;flex-wrap:wrap;padding-bottom:2px}
.quick-btn{
  padding:12px 16px;border-radius:40px;border:1px solid var(--line);background:transparent;
  color:#c3b9a9;font-family:var(--sans);font-size:.82rem;letter-spacing:.04em;cursor:none;transition:.3s;white-space:nowrap;
}
.quick-btn:hover{border-color:rgba(227,206,164,.45);color:#fff}
.quick-btn.on{background:rgba(227,206,164,.14);border-color:rgba(227,206,164,.5);color:var(--champagne)}

/* time slots */
.slot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:9px}
/* Cormorant ships old-style figures by default: 1 reads as I and 0 as O.
   Every place a number must be read as a number asks for lining figures. */
.stats b,.step .num,.rb-step b,.party-btn,.rsv-summary,.done-card b,.side-rows b,
.pkg .price b,.slot-btn,.rsv-num,.marquee-track{font-variant-numeric:lining-nums tabular-nums;
  font-feature-settings:"lnum" 1,"onum" 0}

/* The time buttons are never animated. A stagger here left the lower rows
   sitting at a fraction of full opacity, which reads as a dark wash down the
   grid — it was reported three times. This rule makes it impossible for any
   script to do it again, on any screen size. */
.slot-grid .slot-btn{opacity:1!important;transform:none!important;filter:none!important}

.slot-btn{
  padding:13px 6px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.02);
  color:#e0d6c6;font-family:var(--sans);font-size:.92rem;cursor:none;transition:.3s;font-variant-numeric:tabular-nums;
}
.slot-btn:hover:not(.off){border-color:rgba(227,206,164,.5);color:#fff}
.slot-btn.on{background:var(--champagne);border-color:var(--champagne);color:var(--ink);font-weight:600}
.slot-btn.off{
  color:#7a6f6a;border-color:rgba(227,206,164,.07);background:rgba(255,255,255,.012);
  cursor:not-allowed;
  /* The strike is drawn in its own colour, not the muted text colour —
     otherwise the line disappears into the background as the text does. */
  text-decoration:line-through;text-decoration-color:rgba(224,141,141,.85);
  text-decoration-thickness:2px;text-underline-offset:0;
}
.slot-btn:focus-visible{outline:2px solid var(--champagne);outline-offset:2px}

/* grid of detail fields */
.rsv-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}
.rsv-step > .rsv-field + .rsv-field,
.rsv-step > .rsv-grid + .rsv-field{margin-top:18px}
#rCompany{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

/* footer of the form */
.rsv-foot{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.rsv-summary{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-family:var(--serif);
  font-size:1.2rem;color:#8a8078;transition:color .4s;
}
.rsv-summary.ready{color:#fff}
.rsv-summary .s-sep{width:4px;height:4px;border-radius:50%;background:var(--line-2,rgba(227,206,164,.3))}
.rsv-submit{border:none}
.rsv-submit:disabled{opacity:.4;pointer-events:none}
.rsv-submit.busy{opacity:.75}
.rsv-note{font-size:.86rem;color:#9b9182}
.rsv-error{
  font-size:.92rem;color:#e08d8d;background:rgba(224,141,141,.08);
  border:1px solid rgba(224,141,141,.28);border-radius:12px;padding:13px 16px;width:100%;
}

/* success */
.rsv-done{max-width:560px}
.done-mark{
  width:62px;height:62px;border-radius:50%;background:rgba(130,192,162,.14);color:#82c0a2;
  display:flex;align-items:center;justify-content:center;margin-bottom:26px;
}
.done-mark svg{width:28px;height:28px}
.rsv-done h2{font-size:clamp(1.95rem,3.4vw,2.7rem);color:#fff;font-weight:500;margin-bottom:16px}
.done-lead{color:#cbbfac;line-height:1.75;margin-bottom:28px}
.done-lead strong{color:var(--champagne);font-weight:500}
.done-card{border:1px solid var(--line);border-radius:16px;overflow:hidden;margin-bottom:20px}
.done-card div{display:flex;justify-content:space-between;gap:16px;padding:14px 18px;border-bottom:1px solid var(--line)}
.done-card div:last-child{border-bottom:none}
.done-card span{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:#9b9182}
.done-card b{font-family:var(--serif);font-size:1.06rem;color:#fff;font-weight:500;text-align:right}
.done-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}

/* side rail */
.rsv-side{display:flex;flex-direction:column;gap:14px;position:sticky;top:110px}
.side-card{border:1px solid var(--line);border-radius:16px;padding:22px 22px 24px;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01))}
.side-card.quiet{background:linear-gradient(110deg,rgba(70,15,33,.4),rgba(255,255,255,.015) 82%)}
.side-card .eyebrow{display:block;margin-bottom:14px}
.side-card p{color:#bcb3a4;font-size:.98rem;line-height:1.7;margin:0}
.side-rows{display:flex;flex-direction:column;gap:11px}
.side-rows div{display:flex;flex-direction:column;gap:3px}
.side-rows span{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:#9b9182}
.side-rows b{font-family:var(--serif);font-size:1.06rem;color:#fff;font-weight:500}
.side-link{display:inline-block;margin-top:12px;color:var(--champagne);font-size:.86rem;letter-spacing:.06em;border-bottom:1px solid rgba(227,206,164,.3)}

@media(max-width:980px){
  .rsv-wrap{grid-template-columns:minmax(0,1fr);gap:44px}
  .rsv-side{position:static;flex-direction:row;flex-wrap:wrap}
  .side-card{flex:1;min-width:220px}
}
@media(max-width:680px){
  .rsv-section{padding-top:56px}
  .rsv-step{padding-bottom:34px;margin-bottom:34px}
  .rsv-head{gap:12px;margin-bottom:20px}
  .party-btn{min-width:47px;height:47px;font-size:1.2rem;border-radius:12px}
  .party-pick{gap:7px}
  .rsv-grid{grid-template-columns:minmax(0,1fr);gap:16px}
  .date-row{gap:16px}
  .rsv-field{min-width:0}
  .slot-grid{grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:7px}
  .slot-btn{padding:12px 4px;font-size:.86rem}
  .rsv-summary{font-size:1.06rem;gap:10px}
  .rsv-submit{width:100%;justify-content:center}
  .rsv-side{flex-direction:column}
  .side-card{min-width:0}
}

/* CATERING PACKAGES */
.pkgs{background:linear-gradient(180deg,var(--ink),var(--ink-2) 55%,var(--ink));text-align:center}
.pkgs .corp-head{margin-bottom:52px}
.pkgs .corp-head p strong{color:var(--champagne);font-weight:500}
.pkg-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;align-items:stretch}
.pkg{position:relative;display:flex;flex-direction:column;text-align:left;padding:30px 24px 26px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.012));transition:transform .45s cubic-bezier(.2,.8,.2,1),border-color .4s,box-shadow .4s}
.pkg:hover{transform:translateY(-7px);border-color:rgba(227,206,164,.38);box-shadow:0 28px 60px rgba(0,0,0,.5)}
.pkg-flag{font-weight:600;position:absolute;top:-11px;left:26px;background:var(--champagne);color:var(--ink);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;padding:6px 13px;border-radius:30px;white-space:nowrap}
.pkg.featured{border-color:rgba(227,206,164,.45);background:radial-gradient(80% 60% at 84% 0%,rgba(227,206,164,.14),transparent 62%),linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015))}
.pkg.pkg-signature{border-color:rgba(227,206,164,.35);background:radial-gradient(80% 60% at 84% 0%,rgba(70,15,33,.6),transparent 64%),linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015))}
.pkg.pkg-signature .pkg-flag{font-weight:600;background:var(--burgundy);color:var(--champagne)}
.pkg-top{padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid var(--line)}
.pkg-top h3{font-family:var(--serif);font-size:1.68rem;color:#fff;font-weight:600;line-height:1.1}
.pkg .price{display:flex;align-items:baseline;gap:8px;margin-top:10px;flex-wrap:wrap}
.pkg .price b{font-family:var(--serif);font-size:2.5rem;color:var(--champagne);font-weight:500;line-height:1}
.pkg .price small{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:#a99f8f;font-weight:500}
.pkg ul{list-style:none;margin:0 0 24px;display:flex;flex-direction:column;gap:9px;text-align:left}
.pkg li{position:relative;padding-left:20px;font-size:.92rem;color:#cec5b7;font-weight:400;line-height:1.55}
.pkg li em{font-style:normal;color:var(--champagne-soft);font-weight:500}
.pkg li::before{content:"";position:absolute;left:0;top:.58em;width:7px;height:7px;border-radius:50%;border:1px solid var(--champagne-soft)}
.pkg.featured li::before,.pkg.pkg-signature li::before{background:var(--champagne-soft)}

/* Each package is one big target. The link carries the whole card through a
   stretched pseudo-element, so the card is clickable while the thing that
   receives focus and announces itself is a real link — a div with a click
   handler would give the mouse a target and the keyboard nothing. */
.pkg{position:relative}
.pkg-cta{
  display:inline-flex;align-items:center;gap:9px;margin-top:22px;
  font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;font-weight:500;
  color:var(--champagne);transition:gap .3s,color .3s;
}
.pkg-cta svg{width:15px;height:15px;flex-shrink:0}
.pkg-cta::after{content:"";position:absolute;inset:0;border-radius:inherit}
.pkg:hover .pkg-cta{gap:15px;color:#fff}
.pkg:has(.pkg-cta:focus-visible){outline:2px solid var(--champagne);outline-offset:3px}
.pkg-cta:focus-visible{outline:none}

.addons{margin-top:46px;padding:34px 38px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(110deg,rgba(70,15,33,.4),rgba(255,255,255,.02) 80%)}
.addons-head{margin-bottom:20px}

.pkg-photos-band{padding-top:0}
.pkg-photos{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.pkg-photos figure{position:relative;border-radius:16px;overflow:hidden;border:1px solid var(--line);height:360px}
.pkg-photos img{width:100%;height:100%;object-fit:cover;transition:.8s cubic-bezier(.2,.8,.2,1)}
.pkg-photos figure:hover img{transform:scale(1.06)}
.pkg-photos figcaption{position:absolute;left:18px;bottom:16px;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:#fff;background:rgba(11,7,8,.6);backdrop-filter:blur(6px);padding:8px 16px;border-radius:30px}
.addon-list{list-style:none;display:flex;flex-wrap:wrap;gap:10px 12px}
.addon-list li{font-size:.92rem;color:#d5cbbb;font-weight:400;border:1px solid var(--line);border-radius:40px;padding:9px 18px;background:rgba(255,255,255,.02);transition:.3s}
.addon-list li:hover{border-color:rgba(227,206,164,.4);color:#fff}

/* SPACE GALLERY (drag / arrow slider) */
.gallery{padding:110px 0 120px;overflow:hidden;background:linear-gradient(180deg,var(--ink),var(--ink-2) 60%,var(--ink))}
.gal-head{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:46px}
.gal-head h2{font-size:clamp(2.15rem,4.2vw,3.5rem);color:#fff;line-height:1.05;margin-top:16px}
.gal-head h2 em{font-style:italic;color:var(--champagne)}
.gal-nav{display:flex;gap:12px;flex-shrink:0}
.gnav{width:52px;height:52px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--champagne);display:flex;align-items:center;justify-content:center;cursor:none;transition:.35s}
.gnav:hover{border-color:var(--champagne);background:rgba(227,206,164,.08)}
.gnav:disabled{opacity:.3;pointer-events:none}
.gnav svg{width:18px;height:18px}
.gal-viewport{overflow:hidden;padding:0 40px;cursor:grab;touch-action:pan-y pinch-zoom}
/* On a touch screen the browser scrolls this strip itself. Arbitrating a
   horizontal drag against the page's own scroll is what fails on a real
   phone, and no amount of gesture maths beats the platform's own scroller —
   it brings momentum and snapping for free. Set by JS on coarse pointers. */
.gal-viewport.native{
  overflow-x:auto;overflow-y:hidden;cursor:default;
  touch-action:pan-x pan-y;scroll-snap-type:x proximity;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;
  scroll-padding-left:20px;overscroll-behavior-x:contain;
}
.gal-viewport.native::-webkit-scrollbar{display:none}
.gal-viewport.native .gal-track{transform:none!important}
.gal-viewport.native .gslide{scroll-snap-align:center}
.gal-viewport.dragging{cursor:grabbing}
.gal-track{display:flex;gap:22px;will-change:transform}
.gslide{position:relative;flex:0 0 clamp(280px,42vw,620px);aspect-ratio:3/2;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:var(--ink-3)}
.gslide img{width:100%;height:100%;object-fit:cover;pointer-events:none;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.gslide:hover img{transform:scale(1.05)}
.gslide figcaption{position:absolute;left:16px;bottom:15px;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:#fff;background:rgba(11,7,8,.6);backdrop-filter:blur(6px);padding:7px 14px;border-radius:30px}
.gal-bar{margin-top:36px;height:2px;background:rgba(227,206,164,.14);border-radius:2px;overflow:hidden}
.gal-bar i{display:block;height:100%;width:30%;background:var(--champagne);border-radius:2px;transform-origin:0 50%}

/* MENU PEEK (before order) */
.menu-peek{padding:96px 0 44px;text-align:center;position:relative}
.menu-peek .label{justify-content:center}
.menu-peek h2{font-size:clamp(2.15rem,4vw,3.3rem);color:#fff;margin:16px 0 16px}
.menu-peek h2 em{font-style:italic;color:var(--champagne)}
.menu-peek .mp-head p{color:#bcb3a4;max-width:520px;margin:0 auto 30px}
.menu-peek .mp-head .btn-order{margin-bottom:54px}
.mp-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.mp-strip figure{position:relative;border-radius:14px;overflow:hidden;border:1px solid var(--line);height:250px}
.mp-strip img{width:100%;height:100%;object-fit:cover;transition:.7s}
.mp-strip figure:hover img{transform:scale(1.07)}
.mp-strip figcaption{position:absolute;left:12px;bottom:12px;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:#fff;background:rgba(11,7,8,.6);backdrop-filter:blur(6px);padding:6px 12px;border-radius:30px}

.platforms{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:1010px;margin:0 auto;align-items:stretch}
.plat-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;padding:36px 32px 30px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012));cursor:none;text-align:left;min-height:262px;overflow:hidden;color:inherit;transition:transform .45s cubic-bezier(.2,.8,.2,1),border-color .4s,box-shadow .4s,background .4s}
.plat-card:hover{transform:translateY(-8px);border-color:rgba(227,206,164,.4);background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.02));box-shadow:0 30px 64px rgba(0,0,0,.5)}
.plat-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .45s;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(227,206,164,.13),transparent 65%)}
.plat-card:hover::after{opacity:1}
.plat-badge{width:62px;height:62px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.52rem;flex-shrink:0;color:#fff;overflow:hidden;box-shadow:0 10px 26px rgba(0,0,0,.4)}
.plat-badge.logo{background:none!important;box-shadow:none}
.plat-badge img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
.plat-badge .clover-mark{width:56%;height:56%;object-fit:contain}
.plat-badge.diba-badge{width:auto;height:46px;background:none!important;box-shadow:none;border-radius:0;overflow:visible;justify-content:flex-start}
.plat-badge.diba-badge img{width:auto;height:100%;object-fit:contain;border-radius:0}
.plat-card .pname{display:block;font-family:var(--serif);font-size:1.9rem;color:#fff;font-weight:500;margin-top:26px;line-height:1.1}
.plat-card .pn-sub{display:block;font-size:1.2rem;color:#cdbfa8;font-style:italic;margin-top:3px}
/* "For delivery, give us a call" is a separate instruction from the pickup
   sentence above it, so it gets its own line rather than trailing off the
   end of a paragraph. */
.pd-line{display:block;margin-top:7px}
.plat-card .pdesc{display:block;font-size:.86rem;letter-spacing:.04em;color:#a99f8f;margin-top:4px}
.plat-card .pgo{margin-top:auto;padding-top:22px;display:inline-flex;align-items:center;gap:8px;color:var(--champagne);font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600}
.plat-card .pgo svg{width:15px;height:15px;transition:transform .3s}
.plat-card:hover .pgo svg{transform:translateX(5px)}

/* CLOVER — stands out */
.plat-card.clover{border-color:rgba(227,206,164,.5);background:radial-gradient(85% 65% at 86% 4%,rgba(227,206,164,.3),transparent 60%),linear-gradient(165deg,rgba(227,206,164,.1),rgba(70,15,33,.42) 75%);box-shadow:0 0 0 1px rgba(227,206,164,.22),0 26px 60px rgba(70,15,33,.4)}
.plat-card.clover:hover{transform:translateY(-11px);border-color:rgba(227,206,164,.75);box-shadow:0 0 0 1px rgba(227,206,164,.55),0 36px 84px rgba(70,15,33,.55)}
.plat-card.clover .pdesc{color:#cbbfac}

/* CORPORATE + DELIVERY cards */
.plat-badge.corp-badge{background:rgba(227,206,164,.13)!important;color:var(--champagne);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1px rgba(227,206,164,.2)!important}
.plat-badge.corp-badge svg{width:30px;height:30px}
.plat-card.delivery{cursor:default;justify-content:center}
.plat-card.delivery:hover{transform:none;border-color:var(--line);background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012));box-shadow:none}
.deliv-opts{margin-top:auto;padding-top:20px;display:flex;flex-direction:column;gap:10px;width:100%}
.plat-card.delivery .deliv-opts{margin-top:0;padding-top:0;gap:16px}
.plat-card.delivery .deliv-opt{padding:16px 18px}
.plat-card.delivery .deliv-opt .dn{font-size:1.34rem}
.deliv-opt{display:flex;align-items:center;gap:12px;padding:11px 14px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.02);color:inherit;cursor:none;transition:border-color .3s,background .3s,transform .3s}
.deliv-opt:hover{border-color:rgba(227,206,164,.5);background:rgba(227,206,164,.06);transform:translateX(4px)}
.deliv-opt .plat-badge.sm{width:34px;height:34px;border-radius:9px;box-shadow:none;flex-shrink:0}
.deliv-opt .dn{font-family:var(--serif);font-size:1.2rem;color:#fff;line-height:1}
.deliv-opt>svg{width:16px;height:16px;margin-left:auto;color:var(--champagne-soft);transition:transform .3s}
.deliv-opt:hover>svg{transform:translateX(3px);color:var(--champagne)}

/* DISCOUNT — prominent */
.disc-ribbon{position:absolute;top:18px;right:18px;z-index:3;background:var(--champagne);color:var(--ink);font-family:var(--sans);font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:7px 14px;border-radius:30px;box-shadow:0 8px 22px rgba(227,206,164,.45);white-space:nowrap;animation:discPulse 2.4s ease-in-out infinite}
@keyframes discPulse{0%,100%{box-shadow:0 8px 22px rgba(227,206,164,.4)}50%{box-shadow:0 8px 30px rgba(227,206,164,.75)}}
/* The badge sits in a three-across card that is only ~250px wide inside its
   padding. At .92rem with nowrap it measured 265px — wider than the card it
   lives in — so it is sized to fit rather than to shout. */
/* No nowrap. With it the pill could not shrink below its one-line width, so
   on any narrower card — or at a larger text size or browser zoom — it kept
   its width and spilled past the card's edge. Allowed to wrap it simply
   becomes two lines and stays inside, whatever the container does. */
.clover-disc{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin-top:16px;
  background:var(--champagne);color:var(--ink);font-family:var(--sans);font-weight:700;
  font-size:.78rem;letter-spacing:.02em;text-transform:uppercase;padding:10px 15px;
  border-radius:26px;max-width:100%;text-align:center;line-height:1.35;
  box-shadow:0 8px 24px rgba(227,206,164,.32)}
/* Its host is a flex item of the card, so it stretches full width; without
   this the badge hugs the left edge and reads as misaligned. */
.plat-card [data-clover-note]{display:flex;justify-content:center;width:100%}
.clover-disc svg{width:13px;height:13px;flex-shrink:0}
.disc-pill{display:inline-block;margin-left:8px;background:var(--champagne);color:var(--ink);font-size:.74rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:3px 9px;border-radius:20px;vertical-align:middle;font-family:var(--sans)}

/* CORPORATE ORDERING BAR */
.corp-order{display:flex;align-items:center;gap:24px;max-width:1010px;margin:22px auto 0;padding:24px 32px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(110deg,rgba(70,15,33,.55),rgba(255,255,255,.025) 85%);text-align:left;cursor:none;color:inherit;transition:transform .45s cubic-bezier(.2,.8,.2,1),border-color .4s,box-shadow .4s}
.corp-order:hover{transform:translateY(-5px);border-color:rgba(227,206,164,.42);box-shadow:0 28px 60px rgba(0,0,0,.5)}
.co-ic{width:56px;height:56px;border-radius:15px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:rgba(227,206,164,.12);color:var(--champagne);box-shadow:inset 0 0 0 1px rgba(227,206,164,.16)}
.co-ic svg{width:27px;height:27px}
.co-text{flex:1;display:flex;flex-direction:column;gap:4px;min-width:0}
.co-text b{font-family:var(--serif);font-size:1.52rem;color:#fff;font-weight:500;line-height:1.15}
.co-text small{font-size:.92rem;color:#bcb3a4;line-height:1.5}
.co-go{display:inline-flex;align-items:center;gap:8px;color:var(--champagne);font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;white-space:nowrap;flex-shrink:0}
.co-go svg{width:15px;height:15px;transition:transform .3s}
.corp-order:hover .co-go svg{transform:translateX(5px)}

[hidden]{display:none!important}

/* VISIT */
.visit{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.visit-info{padding:64px 56px;background:var(--ink-2)}
.visit-info h2{font-size:clamp(2.3rem,4vw,3.3rem);color:#fff;margin:14px 0 30px}
.visit-info h2 em{font-style:italic;color:var(--champagne)}
.visit-img{overflow:hidden}
.visit-img img{width:100%;height:115%;object-fit:cover;min-height:480px;will-change:transform}

/* FOOTER */
footer{background:var(--burgundy-deep);padding:90px 0 36px;border-top:1px solid var(--line)}
.foot-top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:50px;padding-bottom:50px;border-bottom:1px solid var(--line)}
.foot-top img{height:40px;margin-bottom:22px}
.foot-top p{color:#b6ac9c;font-size:.98rem;max-width:300px}
.foot-col h4{font-family:var(--sans);font-size:.78rem;letter-spacing:.24em;text-transform:uppercase;color:var(--champagne);margin-bottom:20px;font-weight:500}
.foot-col a,.foot-col p{display:block;color:#c2b9a9;font-size:.98rem;margin-bottom:12px;transition:.3s;cursor:none}
.foot-col a:hover{color:var(--champagne)}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:30px;flex-wrap:wrap;gap:14px}
.foot-bottom small{color:#8c8273;font-size:.86rem}

/* FLOATING ORDER */
.float-order{position:fixed;right:28px;bottom:28px;z-index:55;display:flex;align-items:center;gap:12px;background:var(--champagne);color:var(--ink);padding:16px 26px;border-radius:50px;cursor:none;border:none;font-family:var(--sans);font-size:.86rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;box-shadow:0 18px 44px rgba(0,0,0,.5);transform:translateY(140px);transition:.5s cubic-bezier(.2,.8,.2,1)}
.float-order.show{transform:translateY(0)}
.float-order:hover{background:#fff}
.float-order svg{width:18px;height:18px}
.float-order .dot{width:8px;height:8px;border-radius:50%;background:var(--burgundy);animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

/* MODAL */
.modal-bg{position:fixed;inset:0;z-index:120;background:rgba(8,5,6,.82);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;pointer-events:none;transition:.4s}
.modal-bg.open{opacity:1;pointer-events:auto}
.modal{background:linear-gradient(180deg,var(--ink-2),var(--ink));border:1px solid var(--line);border-radius:18px;max-width:520px;width:100%;padding:46px 44px;transform:translateY(30px) scale(.97);transition:.45s cubic-bezier(.2,.8,.2,1);position:relative}
.modal-bg.open .modal{transform:none}
.modal .x{position:absolute;top:22px;right:22px;background:none;border:1px solid var(--line);color:#c9bfac;width:38px;height:38px;border-radius:50%;cursor:none;transition:.3s;display:flex;align-items:center;justify-content:center}
.modal .x:hover{border-color:var(--champagne);color:var(--champagne);transform:rotate(90deg)}
.modal .eyebrow{display:block;text-align:center;margin-bottom:10px}
.modal h3{font-size:2.2rem;color:#fff;text-align:center;margin-bottom:8px}
.modal h3 em{font-style:italic;color:var(--champagne)}
.modal>p{text-align:center;color:#a99f8f;font-size:.98rem;margin-bottom:30px}
.modal-list{display:flex;flex-direction:column;gap:14px}
.modal-list a{position:relative;display:flex;align-items:center;gap:18px;padding:18px 20px;border:1px solid var(--line);border-radius:16px;transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .35s,box-shadow .35s,background .35s;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012));cursor:none;overflow:hidden}
.modal-list a:hover{transform:translateY(-3px);border-color:rgba(227,206,164,.4);box-shadow:0 18px 40px rgba(0,0,0,.5)}
.modal-list .plat-badge{width:54px;height:54px;font-size:1.2rem;border-radius:14px;box-shadow:0 8px 20px rgba(0,0,0,.4)}
.modal-list .plat-badge.logo{box-shadow:none}
.modal-list .m-info{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-width:0}
.modal-list b{font-family:var(--serif);font-size:1.52rem;color:#fff;font-weight:500;line-height:1.1}
.modal-list small{font-size:.82rem;color:#a99f8f}
.modal-list .arr{margin-left:auto;flex-shrink:0;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--champagne-soft);transition:.3s}
.modal-list .arr svg{width:18px;height:18px}
.modal-list a:hover .arr{background:var(--champagne);color:var(--ink);border-color:var(--champagne);transform:translateX(2px)}
/* Clover stands out in the modal too */
.modal-list a.clover{border-color:rgba(227,206,164,.5);background:radial-gradient(60% 120% at 92% 25%,rgba(227,206,164,.24),transparent 62%),linear-gradient(110deg,rgba(227,206,164,.08),rgba(70,15,33,.45) 80%);box-shadow:0 0 0 1px rgba(227,206,164,.22)}
.modal-list a.clover:hover{border-color:rgba(227,206,164,.7);box-shadow:0 0 0 1px rgba(227,206,164,.55),0 20px 44px rgba(70,15,33,.5)}
.modal-list .disc-ribbon{display:none}
.modal-list .clover-disc{margin-top:10px;font-size:.86rem;padding:9px 15px}
.modal-list .plat-badge.diba-badge{width:auto;max-width:118px;height:30px;background:none!important;box-shadow:none;border-radius:0}
.modal-list .plat-badge.diba-badge img{width:auto;height:100%;object-fit:contain;border-radius:0}
/* divider + corporate row in modal */
.modal-div{display:flex;align-items:center;gap:14px;margin:6px 2px 2px;color:#8a8173;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase}
.modal-div::before,.modal-div::after{content:"";height:1px;flex:1;background:var(--line)}
.modal-list a.corp{background:linear-gradient(110deg,rgba(70,15,33,.5),rgba(255,255,255,.02) 85%)}
.modal-list .corp-badge{background:rgba(227,206,164,.12)!important;color:var(--champagne);box-shadow:inset 0 0 0 1px rgba(227,206,164,.16)!important;display:flex;align-items:center;justify-content:center}
.modal-list .corp-badge svg{width:26px;height:26px}

/* RESPONSIVE */
@media(max-width:980px){
  .hero{min-height:0;padding:140px 0 70px}
  /* Stacked, the mosaic goes first: a phone screen opens on the food,
     not on three lines of type. */
  .hero-inner{grid-template-columns:minmax(0,1fr);gap:46px}
  .hero-copy{max-width:100%;order:2;transform:none}
  .hero-plate{order:1}
  .story,.split,.visit,.teaser,.contact-grid{grid-template-columns:minmax(0,1fr);gap:46px}
  .story-media,.split-media{height:420px}
  .menu-grid,.corp-grid,.steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pkg-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mp-strip{grid-template-columns:repeat(2,1fr)}
  .platforms{grid-template-columns:1fr;max-width:480px}
  .corp-order{max-width:480px;flex-direction:column;align-items:flex-start;gap:18px;text-align:left}
  .steps{gap:24px}
  .foot-top{grid-template-columns:1fr 1fr}
  .scroll-cue{display:none}
  .visit-img img{min-height:340px}
  .page-hero{padding:170px 0 70px}
}
/* Five links plus the order button stop fitting well before the phone
   breakpoint — hand the nav to the hamburger while it still has room. */
@media(max-width:1000px){
  .nav-links,.nav .btn-order{display:none}
  .menu-toggle{display:block}
}
/* ---------- Google rating (About) ---------- */
.greview{
  margin-top:34px;padding:26px 28px 28px;border:1px solid var(--line);border-radius:18px;
  background:linear-gradient(150deg,rgba(255,255,255,.045),rgba(255,255,255,.012) 70%);
  max-width:520px;
}
.gr-top{display:flex;align-items:center;gap:18px}
.gr-mark{width:34px;height:34px;flex-shrink:0;display:block}
.gr-mark svg{width:100%;height:100%;display:block}
.gr-score b{
  display:block;font-family:var(--serif);font-size:2.8rem;line-height:1;color:#fff;font-weight:500;
  font-variant-numeric:lining-nums tabular-nums;
}
.gr-score small{display:block;font-size:.86rem;color:#a99f8f;margin-top:8px;letter-spacing:.02em}

/* Two rows of the same five stars, the gold one clipped to the exact
   fraction — 4.8 shows as four stars and four fifths, not a rounded five. */
.gr-stars{position:relative;display:inline-block;margin-top:7px;line-height:1;
  font-size:1.06rem;letter-spacing:.14em;color:rgba(227,206,164,.22)}
.gr-stars::before{content:"★★★★★"}
.gr-stars i{position:absolute;left:0;top:0;overflow:hidden;white-space:nowrap;
  width:0;color:var(--champagne);transition:width .9s cubic-bezier(.2,.8,.2,1)}
.gr-stars i::before{content:"★★★★★"}

.gr-lead{font-size:.98rem;color:#bcb3a4;line-height:1.7;margin:20px 0 22px}
.greview .gr-btn{margin:0}

@media(max-width:680px){
  .greview{padding:22px 20px 24px;max-width:100%}
  .gr-top{gap:14px}
  .greview .gr-btn{width:100%;justify-content:center}
}

/* ---------- phone: order of sections, and no reveal animations ----------
   Reserve follows ordering on a phone, where the two decisions sit together;
   on a wider screen the page keeps its original rhythm. Only the sections
   that move carry an order — the rest share one value and hold their
   source order between them. */
@media(max-width:680px){
  .flow{display:flex;flex-direction:column}
  .flow > *{order:5}
  .flow > #hero{order:1}
  .flow > .rsv-strip{order:2}
  .flow > #order{order:3}
  .flow > #reserve{order:4}

  /* Nothing fades on a phone. The JS skips the timelines, but this rule is
     what actually guarantees it: a media query is re-evaluated whenever the
     viewport changes, so it holds even when the script decided otherwise —
     resizing a desktop window into phone width, for instance.

     Every one of these is something a timeline fades, blurs, clips or
     shifts. The containers matter as much as the text: opacity on a parent
     dims its children while their own computed opacity still reads 1, which
     is exactly how the first pass missed this. */
  .anim,
  .hero-copy, .hero-copy [data-hero],
  .line-mask, .reveal-word,
  .page-hero .crumbs, .page-hero h1, .page-hero p,
  .platforms > *, .mp-strip > *,
  .story-media, .split-media, .visit-img,
  .gslide, #menuGrid .dish,
  .rsv-done,
  .rsv-band-copy, .rsv-band-steps{
    opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important;
  }
}
@media(max-width:680px){
  body{cursor:auto}
  .cursor,.cursor-ring{display:none}
  .wrap{padding:0 20px}
  .menu-grid,.corp-grid,.steps,.foot-top,.teaser-imgs,.form .frow,.platforms{grid-template-columns:minmax(0,1fr)}
  .m-only{display:inline}
  .stats{flex-wrap:wrap;gap:20px 34px}
  .stats>div{min-width:0}
  .stats b{font-size:2.1rem}
  .visit-info{padding:42px 28px}
  .section{padding:90px 0}
  /* order cards: compact so all three fit within one mobile view */
  .platforms{max-width:100%;gap:12px}
  .plat-card{min-height:auto;padding:18px 18px}
  .plat-badge{width:48px;height:48px}
  .plat-badge.corp-badge svg{width:24px;height:24px}
  .plat-badge.diba-badge{height:36px}
  .plat-card .pname{margin-top:12px;font-size:1.52rem}
  .plat-card .pn-sub{font-size:1.06rem;margin-top:1px}
  .plat-card .pdesc{margin-top:3px;font-size:.82rem}
  .plat-card .pgo{padding-top:12px}
  .clover-disc{margin-top:12px;font-size:.82rem;padding:10px 16px}
  .order-band{padding:34px 0 88px}
  .plat-card.delivery .deliv-opts{gap:12px}
  .plat-card.delivery .deliv-opt{padding:12px 14px}
  .plat-card.delivery .deliv-opt .dn{font-size:1.2rem}
  /* floating CTA: smaller, and keep it clear of tappable content */
  .float-order{right:14px;bottom:14px;padding:13px 18px;font-size:.74rem;gap:9px}
  .float-order svg{width:16px;height:16px}
  .float-order .dot{width:6px;height:6px}
  footer{padding-bottom:78px}
  /* order modal: block layout + scroll so it can never clip on short screens */
  .modal-bg{display:block;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:14px}
  .modal{margin:14px auto;padding:30px 18px 22px;border-radius:16px}
  .modal .eyebrow{margin-bottom:8px}
  .modal h3{font-size:1.68rem;margin-bottom:6px}
  .modal>p{font-size:.92rem;margin-bottom:20px}
  .modal .x{top:14px;right:14px;width:34px;height:34px}
  .modal-list a{gap:11px;padding:13px 12px;border-radius:14px}
  .modal-list .plat-badge{width:42px;height:42px;border-radius:12px}
  .modal-list .plat-badge.diba-badge{max-width:64px;height:19px}
  .modal-list .m-info b{font-size:1.06rem;line-height:1.25}
  .modal-list .m-info small{font-size:.82rem;line-height:1.35}
  .modal-list .arr{width:32px;height:32px}
  .modal-list .arr svg{width:15px;height:15px}
  /* the In-Store row carries a logo + 2-line title + pill — stack it so nothing is squeezed */
  .modal-list a.clover{flex-direction:column;align-items:flex-start;gap:9px;padding:15px 52px 15px 14px}
  .modal-list a.clover .arr{position:absolute;right:12px;top:50%;margin:0;transform:translateY(-50%)}
  .modal-list a.clover:hover .arr{transform:translateY(-50%)}
  .modal-list a.clover .m-info{width:100%}
  .modal-list .clover-disc{font-size:.78rem;padding:8px 13px}
  /* CTA row: full-width stacked buttons instead of cramped pills */
  .cta-row{flex-direction:column;gap:11px;max-width:340px;margin-left:auto;margin-right:auto}
  .cta-row .btn-order,.cta-row .ghost{width:100%;padding:0 18px}
  /* packages */
  .pkg-photos{grid-template-columns:minmax(0,1fr);gap:14px}
  .pkg-photos figure{height:260px}
  .pkg-grid{grid-template-columns:minmax(0,1fr);gap:26px}
  .pkg{padding:26px 20px 24px}
  .pkg .price b{font-size:2.1rem}
  .addons{margin-top:34px;padding:26px 20px}
  .addon-list li{font-size:.86rem;padding:8px 14px}
  /* gallery */
  .gallery{padding:74px 0 80px}
  .gal-head{flex-direction:column;align-items:flex-start;gap:20px;margin-bottom:30px}
  .gal-viewport{padding:0 20px}
  .gal-track{gap:14px}
  .gslide{flex:0 0 82vw;border-radius:12px}
  .gnav{width:46px;height:46px}
  .gal-bar{margin-top:26px}
  /* menu peek */
  .menu-peek{padding:64px 0 8px}
  .menu-peek .mp-head .btn-order{margin-bottom:34px}
  .mp-strip{grid-template-columns:1fr 1fr;gap:12px}
  .mp-strip figure{height:158px}
  /* hero: stacked copy + compact mosaic */
  .hero{padding:118px 0 56px}
  .hero-inner{gap:34px}
  .hero p{max-width:100%}
  .hero p.hero-sub{color:#bdb3a4}
  .hero .eyebrow{letter-spacing:.22em}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .story-media img,.split-media img,.visit-img img,.sig-bg img,.page-hero .pbg img{transform:none!important}
}

/* ---------------------------------------------------------
   STILL / CAPTURE MODE  (activated by ?still or #still)
   Neutralises 100vh sections and forces animated content
   visible so headless PDF/screenshot captures are complete.
   --------------------------------------------------------- */
.still .preloader{display:none!important}
.still .hero{height:auto!important;min-height:0!important;padding:170px 0 90px!important}
.still .plate-stage img{transform:none!important}
.still .plate-stage img.on{opacity:1!important}
.still .signature{height:auto!important;min-height:0!important;padding:120px 0!important}
.still .scroll-cue,.still .float-order,.still .cursor,.still .cursor-ring{display:none!important}
.still .anim,.still .dish,.still [data-hero],.still [data-sig]{opacity:1!important;transform:none!important;clip-path:none!important}
.still .marquee-track{transform:none!important}
.still .gal-track{transform:none!important}
.still .gal-viewport{overflow:visible!important}
.still .modal-bg.open{opacity:1!important;pointer-events:auto!important}
.still .modal-bg.open .modal{transform:none!important}