/* ═══════════════════════════════════════════════════════════
   SIT DOWN — dining room & cocktail lounge
   Tokens → base → paper → components → sections → responsive
   ═══════════════════════════════════════════════════════════ */

@font-face{font-family:Playfair;src:url(../fonts/PlayfairDisplay.woff2) format('woff2-variations');font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:Playfair;src:url(../fonts/PlayfairDisplay-Italic.woff2) format('woff2-variations');font-weight:400 900;font-style:italic;font-display:swap}
@font-face{font-family:Crimson;src:url(../fonts/CrimsonText.woff2) format('woff2');font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:Crimson;src:url(../fonts/CrimsonText-Italic.woff2) format('woff2');font-weight:400 700;font-style:italic;font-display:swap}

:root{
  /* colour */
  --paper:#f9f8f2;
  --paper-warm:#f5f1e6;
  --ink:#1a1a1a;
  --ink-soft:#3c3c3c;
  --ink-mute:#6c665e;
  --red:#da4143;
  --red-deep:#b32f35;
  --rule:rgba(218,65,67,.38);
  --rule-ink:rgba(26,26,26,.14);
  --wall:#e6e1d6;

  /* type */
  --display:Playfair,'Playfair Display',Georgia,serif;
  --body:Crimson,'Crimson Text',Georgia,serif;
  --fs-body:clamp(1.02rem,.94rem + .35vw,1.22rem);
  --fs-lead:clamp(1.1rem,1rem + .5vw,1.38rem);
  --fs-meta:clamp(.7rem,.66rem + .18vw,.86rem);

  /* space */
  --pad-x:clamp(1.1rem,4.4vw,5.5rem);
  --gap:clamp(1.5rem,3.2vw,3.5rem);
  --sec-y:clamp(3.6rem,8vw,9rem);
  --sheet-max:113.75rem;

  /* motion */
  --ease:cubic-bezier(.22,.61,.36,1);
  --dur:.55s;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
html.anim{scroll-behavior:auto}
body{
  margin:0;background:var(--wall);color:var(--ink);
  font:400 var(--fs-body)/1.58 var(--body);
  overflow-x:hidden;text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
body.is-locked{overflow:hidden}
/* Lenis */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto}
.lenis.lenis-stopped{overflow:hidden}
img,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p,dl,dd,figure,ul{margin:0}
ul{list-style:none;padding:0}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--red);color:var(--paper)}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}

/* ── paper & wallpaper ─────────────────────────────────── */
.wallpaper{
  position:fixed;inset:0;z-index:0;background:var(--wall);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cg fill='none' stroke='%23cfc7b6' stroke-width='1.1' opacity='.85'%3E%3Cpath d='M90 8c14 18 30 26 30 44s-16 22-30 38c-14-16-30-20-30-38S76 26 90 8z'/%3E%3Cpath d='M90 52c7 9 15 13 15 22s-8 11-15 19c-7-8-15-10-15-19s8-13 15-22z'/%3E%3Cpath d='M0 98c18 14 26 30 44 30s22-16 38-30c-16-14-20-30-38-30S18 84 0 98z'/%3E%3Cpath d='M180 98c-18 14-26 30-44 30s-22-16-38-30c16-14 20-30 38-30s26 16 44 30z'/%3E%3Cpath d='M90 172c-14-18-30-26-30-44s16-22 30-38c14 16 30 20 30 38s-16 26-30 44z'/%3E%3Ccircle cx='90' cy='90' r='5'/%3E%3C/g%3E%3C/svg%3E");
  background-size:200px 200px;
}
.wallpaper::after{ /* wallpaper sheen */
  content:'';position:absolute;inset:0;
  background:radial-gradient(120% 80% at 50% 0%,rgba(255,255,255,.5),rgba(0,0,0,.09) 70%);
}

.sheet{
  position:relative;z-index:1;max-width:var(--sheet-max);margin-inline:auto;
  background:var(--paper);padding:clamp(.75rem,1.6vw,3rem) clamp(.6rem,1.2vw,1.5rem) clamp(1rem,2vw,2rem);
  /* box-shadow, not drop-shadow: a filtered ancestor would become the
     containing block for the fixed-position menu overlay. */
  box-shadow:-2px 3px 18px rgba(0,0,0,.26);
  overflow:hidden;
}
.sheet::after{ /* real paper scan, tiled seamlessly */
  content:'';position:absolute;inset:0;z-index:6;pointer-events:none;
  mix-blend-mode:multiply;opacity:.92;
  background-image:url(../assets/paper.webp);
  background-size:900px 900px;background-repeat:repeat;
}
.frame{border:3px solid var(--red);border-top:0;padding:0 0 clamp(2rem,3vw,3rem)}

/* ── shared type ───────────────────────────────────────── */
.display{
  font-family:var(--display);font-weight:700;text-transform:uppercase;
  line-height:.86;letter-spacing:-.02em;color:var(--red);margin:0;
  font-size:clamp(3.4rem,10vw,9.5rem);
}
.display--xl{font-size:clamp(4.2rem,13.5vw,13.5rem)}
.display--lg{font-size:clamp(3.4rem,10.5vw,10.5rem)}
.kicker{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.02em;font-size:clamp(1.15rem,2.1vw,1.7rem);margin:0}
.tag{display:flex;align-items:center;gap:.75rem;font-family:var(--display);font-style:italic;font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:var(--fs-meta)}
.tag__line{flex:1;height:1px;background:currentColor;opacity:.5}
.lead{font-size:var(--fs-lead);line-height:1.62;color:var(--ink-soft);max-width:46ch}
.cap{
  float:left;display:grid;place-items:center;margin:.35rem .7rem .1rem 0;
  width:clamp(3rem,5.4vw,5.2rem);height:clamp(3rem,5.4vw,5.2rem);
  background:var(--ink);color:var(--paper);
  font-family:var(--display);font-weight:700;line-height:1;
  font-size:clamp(2.1rem,3.8vw,3.6rem);
}
.rule{display:block;width:100%;height:2px;background:var(--rule);flex:none}
.rule--thin{height:1px;background:var(--rule-ink)}
.rule--v{width:2px;height:auto;background:var(--rule)}

/* ── buttons ───────────────────────────────────────────────
   Two frames: a red rule on the button itself and an ink rule
   offset behind it, printed slightly out of register.        */
.btn{
  position:relative;display:inline-grid;isolation:isolate;
  border:1px solid var(--red);color:var(--red);
  padding:.72em 2.2em;justify-self:start;
}
.btn::after{ /* the out-of-register second frame */
  content:'';position:absolute;inset:-1px;z-index:-1;
  border:1px solid rgba(26,26,26,.4);translate:6px 5px;pointer-events:none;
}
.btn::before{ /* hover fill, scaled from the baseline so nothing escapes */
  content:'';position:absolute;inset:0;z-index:-2;background:var(--red);
  transform:scaleY(0);transform-origin:50% 100%;transition:transform .45s var(--ease);
}
.btn__label{
  grid-area:1/1;overflow:hidden;
  font-family:var(--display);font-weight:700;font-size:clamp(1rem,1.25vw,1.35rem);
  text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;text-align:center;
}
.btn__label em{display:block;font-style:normal;transition:transform .45s var(--ease);will-change:transform}
.btn__label--hover em{transform:translateY(110%)}
.btn:hover .btn__label em{transform:translateY(-110%)}
.btn:hover .btn__label--hover em{transform:translateY(0)}
.btn:hover{color:var(--paper)}
.btn:hover::before{transform:scaleY(1)}
/* section CTAs hang off the right edge of their column, as on the original */
.split__left>.btn,.about__text>.btn{justify-self:end;margin-right:6px}
.btn--solid{background:var(--red);color:var(--paper);border-color:var(--red)}
.btn--solid::before{background:var(--ink)}

/* ── media ─────────────────────────────────────────────── */
.media{position:relative;overflow:hidden;background:#181613}
.media>video,.media>img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);will-change:transform}
.grain{
  position:absolute;inset:0;pointer-events:none;z-index:2;opacity:.35;mix-blend-mode:screen;
  background-color:#5a462e;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)' opacity='.5'/%3E%3C/svg%3E");
  background-size:200px;
}
.media{background-size:cover;background-position:50% 50%}
/* invisible until it really plays — see site.js */
.media>video.v{visibility:hidden}
.media>video.v.is-playing{visibility:visible}
.etching{
  mix-blend-mode:multiply;filter:grayscale(1) contrast(1.16) brightness(1.04);
  width:100%;height:auto;
}

/* ── nav ───────────────────────────────────────────────── */
.nav{
  position:sticky;top:0;z-index:40;isolation:isolate;
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  padding:clamp(1rem,2vw,1.8rem) var(--pad-x);
  background:linear-gradient(var(--paper) 72%,rgba(249,248,242,0));
  transition:transform .5s var(--ease);
}
/* the page frame's top rule, running behind the nav furniture */
.nav::before{
  content:'';position:absolute;left:-3px;right:-3px;top:50%;height:3px;
  background:var(--red);transform:translateY(-50%);z-index:-1;
}
.nav__left{position:relative;justify-self:start}
.nav__menu{
  display:grid;place-items:center;
  width:clamp(3.4rem,5vw,4.6rem);aspect-ratio:1;border-radius:50%;
  background:var(--red);color:var(--paper);
  font-family:var(--display);font-style:italic;font-weight:700;
  font-size:clamp(.72rem,1vw,.95rem);text-transform:uppercase;letter-spacing:.06em;
  transition:transform .4s var(--ease);
}
.nav__menu::after{ /* the pin-dot the stamp circles carry */
  content:'';position:absolute;top:.55rem;left:1.1rem;width:4px;height:4px;
  border-radius:50%;background:var(--paper);opacity:.8;
}
.nav__menu:hover{transform:scale(1.07) rotate(-4deg)}
.nav__cart{
  position:absolute;right:-.9rem;bottom:-.7rem;display:grid;place-items:center;
  width:clamp(1.7rem,2.4vw,2.2rem);aspect-ratio:1;border-radius:50%;
  border:1px solid var(--red);background:var(--paper);color:var(--red);
  font-family:var(--display);font-weight:700;font-size:var(--fs-meta);line-height:1;
  transition:background .35s var(--ease),color .35s var(--ease);
}
.nav__cart:hover{background:var(--red);color:var(--paper)}
.logo{
  position:relative;display:grid;justify-items:center;gap:.1rem;padding:.5rem 1.8rem .4rem;
  border:1px solid var(--red);background:var(--paper);
}
/* the little brackets where the frame rule meets the masthead */
.logo::before,.logo::after{
  content:'';position:absolute;bottom:-1px;width:clamp(.8rem,1.6vw,1.5rem);height:.85rem;
  border-bottom:1px solid var(--red);
}
.logo::before{right:calc(100% + 1px);border-right:1px solid var(--red)}
.logo::after{left:calc(100% + 1px);border-left:1px solid var(--red)}
.logo__name{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--red);font-size:clamp(1.1rem,2vw,1.9rem);line-height:1}
.logo__sub{font-family:var(--display);font-style:italic;font-size:var(--fs-meta);color:var(--ink-soft);letter-spacing:.08em}
.nav__reserve{
  justify-self:end;display:flex;align-items:center;gap:.6rem;
  padding:.75rem 2.4rem;border:1px solid var(--red);border-radius:50%;
  background:var(--paper);color:var(--red);
  font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.12em;
  font-size:var(--fs-meta);transition:background .4s var(--ease),color .4s var(--ease);
}
.nav__reserve .dot{width:4px;height:4px;border-radius:50%;background:currentColor}
.nav__reserve:hover{background:var(--red);color:var(--paper)}

/* ── menu overlay ──────────────────────────────────────── */
.menu{
  position:fixed;inset:0;z-index:60;background:var(--paper);
  display:grid;grid-template-rows:auto 1fr auto;gap:1rem;
  padding:clamp(1.2rem,3vw,2.5rem) var(--pad-x) clamp(1.5rem,3vw,3rem);
  clip-path:inset(0 0 100% 0);pointer-events:none;
  transition:clip-path .8s var(--ease);
}
.menu.is-open{clip-path:inset(0 0 0 0);pointer-events:auto}
.menu::after{
  content:'';position:absolute;inset:0;pointer-events:none;mix-blend-mode:multiply;opacity:.5;
  background-image:url(../assets/paper.webp);background-size:900px 900px;
}
.menu__label{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.18em;color:var(--red);font-size:var(--fs-meta)}
.menu__close{position:absolute;top:clamp(1rem,3vw,2.4rem);right:var(--pad-x);width:2.6rem;height:2.6rem}
.menu__close::before,.menu__close::after{content:'';position:absolute;inset:50% 0 auto;height:2px;background:var(--red);transition:transform .4s var(--ease)}
.menu__close::before{transform:rotate(45deg)}
.menu__close::after{transform:rotate(-45deg)}
.menu__close:hover::before{transform:rotate(135deg)}
.menu__close:hover::after{transform:rotate(45deg)}
.menu__list{align-self:center;display:grid;gap:clamp(.1rem,.4vw,.5rem);border-top:1px solid var(--rule)}
.menu__list li{border-bottom:1px solid var(--rule);overflow:hidden}
.menu__list a{
  position:relative;display:flex;align-items:baseline;gap:1rem;padding:clamp(.4rem,1.1vw,1rem) .4rem;
  font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:-.02em;
  font-size:clamp(2.2rem,7vw,5.5rem);line-height:1;color:var(--ink);
  transition:color .45s var(--ease),padding-left .45s var(--ease);
}
.menu__list a::before{content:attr(data-i);font-family:var(--body);font-style:italic;font-size:var(--fs-meta);letter-spacing:.1em;color:var(--red);transform:translateY(-.4em)}
.menu__list a:hover{color:var(--red);padding-left:1.4rem}
.menu__foot{font-style:italic;color:var(--ink-mute);font-size:var(--fs-meta);letter-spacing:.04em}
.menu__foot a{border-bottom:1px solid var(--rule)}

/* ── hero ──────────────────────────────────────────────── */
.hero{position:relative;display:grid;gap:clamp(.5rem,1.2vw,1rem);padding:clamp(.5rem,2vw,2rem) var(--pad-x) 0}
.hero__marquee{margin:0;overflow:hidden;padding:.1em 0 .06em}
.marquee__track{display:flex;align-items:center;gap:clamp(1rem,2.4vw,3rem);width:max-content;will-change:transform}
.marquee__item{
  font-family:var(--display);font-weight:700;text-transform:uppercase;
  font-size:clamp(4.4rem,15.2vw,15rem);line-height:.82;letter-spacing:-.035em;color:var(--red);
}
.marquee__star{
  flex:none;width:clamp(1rem,2vw,2.2rem);aspect-ratio:1;background:var(--red);
  clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);
}
.hero__note{justify-self:end;font-style:italic;color:var(--red);font-size:var(--fs-meta);letter-spacing:.08em}
.hero__media{aspect-ratio:16/9;margin-top:clamp(.4rem,1vw,1rem)}
.hero__caption{
  position:absolute;left:0;bottom:0;z-index:3;max-width:34ch;
  padding:clamp(1rem,2.4vw,2.4rem);color:#f4f1e8;font-size:var(--fs-body);line-height:1.5;
  text-shadow:0 1px 18px rgba(0,0,0,.7);
}
.hero__media::after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(10,8,6,.75),rgba(10,8,6,0) 55%)}
.stamp{position:absolute;color:var(--red);opacity:.5;pointer-events:none;mix-blend-mode:multiply}
.stamp svg{width:100%;height:auto}
.stamp--hero{
  top:clamp(.8rem,2vw,2rem);right:clamp(.8rem,2vw,2rem);z-index:4;
  width:clamp(5.5rem,9vw,10rem);color:#f4efe4;opacity:.78;mix-blend-mode:normal;
  filter:drop-shadow(0 1px 10px rgba(0,0,0,.45));
}
.stamp__text{font-family:var(--display);font-size:15px;letter-spacing:.22em;text-transform:uppercase;fill:currentColor}
.stamp__big{font-family:var(--display);font-weight:700;font-size:30px;fill:currentColor;text-transform:uppercase}

/* ── generic section ───────────────────────────────────── */
.section{padding:var(--sec-y) var(--pad-x)}

/* ── menu + reserve split ──────────────────────────────── */
.split{display:grid;grid-template-columns:1fr 2px .82fr;gap:clamp(1.6rem,3.4vw,4rem);align-items:start}
.split__left{display:grid;gap:clamp(1rem,2vw,2rem);align-content:start}
.etching--menu{max-width:min(100%,34rem);justify-self:center}
.split__right{display:grid;gap:clamp(.9rem,1.6vw,1.4rem);align-content:start;text-align:center;position:sticky;top:clamp(6rem,9vw,8.5rem);align-self:start}
.display--red-card{
  background:var(--red);color:var(--paper);text-align:center;
  padding:.28em .3em .2em;font-size:clamp(2.8rem,5.6vw,5.4rem);
}
.split__right .tag{background:var(--red);color:var(--paper);padding:.9rem 1rem .1rem;margin-bottom:-1px}
.etching--phone{max-width:min(100%,20rem);justify-self:center;margin-top:.5rem}
.phone{font-family:var(--display);font-weight:700;font-size:clamp(1.3rem,2.2vw,2rem);color:var(--red);transition:letter-spacing .4s var(--ease)}
.phone:hover{letter-spacing:.02em}
.facts{display:grid;gap:.3rem;line-height:1.5}
.facts dt{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:var(--fs-meta);margin-top:1rem}
.facts dd{margin:0;color:var(--ink-soft)}
.facts--tight dt{margin-top:.8rem}
.facts--tight{text-align:left}

/* ── about ─────────────────────────────────────────────── */
.about{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,4vw,5rem);align-items:start}
.about__text{display:grid;gap:clamp(1rem,2vw,1.8rem);align-content:start}
.about__text .tag--red{background:var(--red);color:var(--paper);padding:1rem 1.1rem;margin-bottom:-1.4rem}
.about__text .display{background:var(--red);color:var(--paper);padding:0 .12em .18em;justify-self:start}
.about__media{aspect-ratio:4/5;position:sticky;top:6rem}

/* ── lounge ────────────────────────────────────────────── */
.lounge{
  display:grid;gap:clamp(1.2rem,2.6vw,2.6rem);
  grid-template-columns:minmax(0,1fr) minmax(0,.72fr) 2px minmax(0,1fr);
  grid-template-areas:
    'title  title  rule specials'
    'video  card   rule specials'
    'hr     hr     hr   hr'
    'note   note   note note';
  align-items:start;
}
.lounge__title{grid-area:title}
.lounge__media{grid-area:video;aspect-ratio:3/4}
.lounge__card{grid-area:card}
.lounge__rule{grid-area:rule;align-self:stretch}
.specials{grid-area:specials;display:grid;gap:.75rem;align-content:start}
.lounge__hr{grid-area:hr;margin-block:clamp(1rem,2vw,2rem)}
.note{grid-area:note;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(1rem,2.4vw,2.4rem);align-items:start}
.card{
  background:var(--paper-warm);border:1px solid var(--rule-ink);
  padding:clamp(1.1rem,2.2vw,2.2rem);display:grid;gap:1rem;
}
.card .etching{max-width:11rem;justify-self:center}
.specials__media{aspect-ratio:3/2;margin-top:.4rem}
.specials__name{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--red);font-size:clamp(1rem,1.4vw,1.25rem);margin-top:.6rem}
.etching--sm{max-width:9.5rem}
.note{align-items:stretch}
.note__card{
  background:var(--red);color:var(--paper);padding:clamp(1.6rem,3.4vw,3.4rem);
  display:grid;gap:1.1rem;align-content:center;font-size:var(--fs-lead);line-height:1.6;
}
.note__hi{font-family:var(--display);font-weight:700;font-size:clamp(1.5rem,2.6vw,2.4rem)}
.note__sign{justify-self:end}
.note .kicker{grid-column:1/-1;margin-bottom:.4rem}
.note__media{aspect-ratio:1;min-height:100%}

/* ── shop ──────────────────────────────────────────────── */
.shop{
  display:grid;gap:clamp(1.2rem,2.6vw,2.4rem);justify-items:start;align-items:start;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-areas:'title cta' 'lead cta' 'products products';
}
.shop .display{grid-area:title}
.shop .lead{grid-area:lead}
.shop .btn{grid-area:cta;justify-self:end;align-self:start;margin-top:.6rem}
.products{grid-area:products;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2.4vw,2.4rem);width:100%;margin-top:1rem}
.product{display:grid;grid-template-rows:auto 1fr auto;gap:.35rem;text-align:center}
.product__frame{
  display:grid;place-items:center;aspect-ratio:1;
  border:1px solid var(--rule-ink);background:var(--paper-warm);
  padding:clamp(1rem,2.4vw,2.4rem);overflow:hidden;
}
.product__frame img{
  max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;
  transition:transform .7s var(--ease);mix-blend-mode:multiply;filter:grayscale(1) contrast(1.14);
}
.product:hover .product__frame img{transform:scale(1.08) rotate(-1.5deg)}
.product__name{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:clamp(.9rem,1.2vw,1.1rem);margin-top:.6rem}
.product__price{font-style:italic;color:var(--red)}

/* ── ticker strip ──────────────────────────────────────── */
.strip{
  border-block:2px solid var(--rule);background:var(--red);color:var(--paper);
  padding:.6rem 0;overflow:hidden;
}
.marquee__track--sm{gap:clamp(1rem,2vw,2rem)}
.strip__item{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:clamp(.85rem,1.4vw,1.2rem);white-space:nowrap}
.strip .marquee__star{background:var(--paper);width:clamp(.5rem,.9vw,.9rem)}

/* ── book ──────────────────────────────────────────────── */
/* checkerboard band + rule that opens the booking spread */
.checkrule{display:block;margin:clamp(2rem,5vw,5rem) var(--pad-x) 0;border-bottom:2px solid var(--red)}
.checkrule::before{
  content:'';display:block;height:16px;
  background-image:
    linear-gradient(45deg,var(--red) 25%,transparent 0,transparent 75%,var(--red) 0),
    linear-gradient(45deg,var(--red) 25%,transparent 0,transparent 75%,var(--red) 0);
  background-size:16px 16px;background-position:0 0,8px 8px;opacity:.8;
}

.book{
  position:relative;display:grid;column-gap:clamp(1.5rem,4vw,4.5rem);row-gap:clamp(1.2rem,2.6vw,2.4rem);
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
}
.book .display{grid-column:1/-1;justify-self:start;text-align:left}
.book .lead{align-self:start;max-width:38ch}
.stamp--book{top:clamp(1rem,4vw,4rem);right:var(--pad-x);width:clamp(6rem,10vw,11rem);color:var(--ink);opacity:.22}
/* opening hours + address, in place of a form nobody can answer yet */
.visit{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.2rem,3vw,3rem);width:100%;align-items:start}
.hours{display:grid;grid-template-columns:auto 1fr;gap:.35rem 1.2rem;margin:0}
.hours dt{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:var(--fs-meta)}
.hours dd{margin:0;color:var(--ink-soft);border-bottom:1px solid var(--rule-ink);padding-bottom:.35rem}
.visit__side{display:grid;gap:1rem;justify-items:start}
.visit__addr{font-size:var(--fs-lead);line-height:1.5}
.visit__map{font-style:italic;color:var(--red);border-bottom:1px solid var(--rule)}

/* verbatim guest reviews */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2.4vw,2.4rem);width:100%;margin-top:1rem;align-items:start}
.quote{display:grid;gap:.9rem;align-content:start;padding:clamp(1.1rem,2.2vw,2rem);
  background:var(--paper-warm);border:1px solid var(--rule-ink)}
.quote blockquote{margin:0;font-size:var(--fs-lead);line-height:1.55;color:var(--ink-soft)}
.quote cite{font-family:var(--display);font-style:italic;font-weight:700;text-transform:uppercase;
  letter-spacing:.1em;font-size:var(--fs-meta);color:var(--red)}
.guests{display:grid;gap:clamp(1.2rem,2.6vw,2.4rem);justify-items:start;align-items:start;
  grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'title cta' 'lead cta' 'quotes quotes'}
.guests .display{grid-area:title}
.guests .lead{grid-area:lead}
.guests>.btn{grid-area:cta;justify-self:end;margin-top:.6rem}
.quotes{grid-area:quotes}
.split__media{aspect-ratio:4/5;margin-block:.4rem}
.footer__hour{display:block;color:var(--ink-soft)}
.footer__hour b{font-weight:400}
.book__media{grid-column:1/-1;aspect-ratio:16/10;margin-top:clamp(1rem,3vw,3rem)}

/* ── footer ────────────────────────────────────────────── */
.footer{
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1.2rem,2.6vw,2.6rem);
  padding:clamp(2rem,4vw,4rem) var(--pad-x) 0;
}
.footer__col{display:grid;gap:.35rem;align-content:start;font-style:normal;color:var(--ink-soft)}
.footer__title{font-family:var(--display);font-style:italic;font-weight:700;text-transform:uppercase;letter-spacing:.16em;font-size:var(--fs-meta);color:var(--red);margin-bottom:.4rem}
.footer__col a{width:fit-content;transition:transform .35s var(--ease),color .35s var(--ease)}
.footer__col a:hover{color:var(--red);transform:translateX(6px)}
.footer__rule{grid-column:1/-1;margin-top:1.5rem}
.footer__legal{grid-column:1/-1;font-size:var(--fs-meta);letter-spacing:.06em;color:var(--ink-mute);text-align:center}

/* ── mobile call bar ───────────────────────────────────── */
.callbar{
  position:fixed;bottom:0;z-index:50;display:none;place-items:center;
  padding:.9rem 1rem calc(.9rem + env(safe-area-inset-bottom) + 56px);
  margin-bottom:-56px;
  font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.82rem;
  background:var(--ink);color:var(--paper);
  transform:translateY(110%);transition:transform .5s var(--ease);
}
.callbar{left:0;width:38%}
.callbar--book{left:38%;width:62%;background:var(--red)}
body.show-bar .callbar{transform:translateY(0)}

/* ── preloader ─────────────────────────────────────────── */
.preloader{
  position:fixed;inset:0;z-index:90;background:var(--paper);
  display:grid;place-content:center;justify-items:center;gap:.8rem;
  will-change:transform;
}
.preloader::after{
  content:'';position:absolute;inset:0;pointer-events:none;mix-blend-mode:multiply;opacity:.5;
  background-image:url(../assets/paper.webp);background-size:900px 900px;
}
.preloader__brand{display:flex;gap:.02em;font-family:var(--display);font-weight:700;text-transform:uppercase;color:var(--red);font-size:clamp(2.6rem,9vw,7rem);line-height:1;letter-spacing:-.02em}
.preloader__brand .sp{width:.3em}
.preloader__meta{font-style:italic;color:var(--ink-mute);letter-spacing:.1em;font-size:var(--fs-meta)}
.preloader__count{font-family:var(--display);font-weight:700;color:var(--ink);font-size:var(--fs-meta);letter-spacing:.2em}
.preloader__rule{display:block;width:min(52vw,22rem);height:1px;background:var(--rule-ink)}
.preloader__rule i{display:block;height:100%;width:0;background:var(--red);transform-origin:0 50%}
body:not(.is-loading) .preloader{display:none}

/* ── JS-driven reveal states ───────────────────────────── */
.line{display:block;overflow:hidden}
.line__i{display:block;will-change:transform}
.anim .reveal{opacity:0;transform:translateY(20px)}
.anim .reveal-media{clip-path:inset(0 0 100% 0)}
.anim .reveal-lines{opacity:0}
.anim body.is-loading{overflow:hidden}

/* ── from the board ───────────────────────────────────── */
.board{display:grid;gap:clamp(1rem,2.4vw,2rem);justify-items:start}
.board__note{font-style:italic;color:var(--ink-mute);font-size:var(--fs-meta);letter-spacing:.06em;max-width:64ch}
.board__list{display:grid;width:100%;counter-reset:dish;border-top:2px solid var(--rule);padding:0;margin:0;list-style:none}
.board__item{
  display:grid;grid-template-columns:auto 1fr;column-gap:clamp(1rem,2.6vw,2.6rem);align-items:baseline;
  padding:clamp(.8rem,1.8vw,1.5rem) 0;border-bottom:1px solid var(--rule-ink);
}
.board__item::before{
  counter-increment:dish;content:counter(dish,decimal-leading-zero);
  font-family:var(--body);font-style:italic;color:var(--red);font-size:var(--fs-meta);letter-spacing:.1em;
}
.board__name{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.01em;
  font-size:clamp(1.25rem,2.6vw,2.4rem);line-height:1.05;margin:0}
.board__detail{grid-column:2;color:var(--ink-soft);font-size:var(--fs-lead);margin:.25rem 0 0}

/* ═══ RESPONSIVE ═══════════════════════════════════════ */
@media (max-width:1100px){
  .split{grid-template-columns:1fr}
  .split__right{position:static}
  .split .rule--v{display:none}
  .about{grid-template-columns:1fr}
  .about__media{position:static;aspect-ratio:16/10}
  .lounge{
    grid-template-columns:1fr 1fr;
    grid-template-areas:
      'title title'
      'video card'
      'specials specials'
      'hr hr'
      'note note';
  }
  .lounge__rule{display:none}
  .footer{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:760px){
  :root{--sec-y:clamp(3rem,11vw,4.5rem)}
  .sheet{padding:.4rem .35rem .6rem}
  .frame{border-width:2px}
  /* small screens follow the original: masthead left, menu disc on the right */
  .nav{grid-template-columns:1fr auto;gap:.6rem;padding-block:.9rem}
  .nav__left{grid-column:2;grid-row:1;justify-self:end}
  .logo{grid-column:1;grid-row:1;justify-self:start}
  .nav__cart{right:auto;left:-.9rem}
  .nav__reserve{display:none}
  .nav__reserve{letter-spacing:.06em}
  .nav__reserve .dot{display:none}
  .hero__media{aspect-ratio:4/5}
  .hero__caption{max-width:none;font-size:1rem}
  .stamp--hero{width:5.4rem;top:auto;bottom:auto;right:.2rem;opacity:.42}
  .lounge{grid-template-columns:1fr;grid-template-areas:'title' 'video' 'card' 'specials' 'hr' 'note'}
  .lounge__media{aspect-ratio:4/5}
  .note{grid-template-columns:1fr}
  .note__media{aspect-ratio:16/10}
  .products{grid-template-columns:1fr;gap:1.2rem}
  .shop{grid-template-columns:1fr;grid-template-areas:'title' 'lead' 'products' 'cta'}
  .shop .btn{justify-self:start;margin-top:0}
  .product{grid-template-columns:5.5rem 1fr;text-align:left;align-items:center;gap:.2rem 1rem;border-bottom:1px solid var(--rule-ink);padding-bottom:1rem}
  .product__frame{grid-row:1/3;padding:.5rem}
  .product__name{margin-top:0;align-self:end}
  .product__price{align-self:start}
  .visit{grid-template-columns:1fr}
  .quotes{grid-template-columns:1fr}
  .board__item{column-gap:.9rem}
  .guests{grid-template-columns:1fr;grid-template-areas:'title' 'lead' 'quotes' 'cta'}
  .guests>.btn{justify-self:start;margin-top:0}
  .book{grid-template-columns:1fr}
  .stamp--book{width:5rem;opacity:.13}
  .nav__reserve{padding:.6rem 1.1rem;font-size:.66rem}
  .book__media{aspect-ratio:4/5}
  .footer{grid-template-columns:1fr 1fr}
  .callbar{display:grid}
  main{padding-bottom:3.5rem}
  .display--red-card{font-size:clamp(2.6rem,13vw,4rem)}
  .cap{margin-right:.5rem}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
  .anim .reveal,.anim .reveal-lines{opacity:1;transform:none}
  .anim .reveal-media{clip-path:none}
}

/* client overrides */
.lounge__media{aspect-ratio:16/10}
.hero__media>video,.hero__media>img{object-position:50% 42%}
.hero__media{background-position:50% 42%}
.book__media>video,.book__media>img{object-position:50% 40%}
.book__media{background-position:50% 40%}