/* Zumi Sushi: interior-page design system.
   Extracted from the approved Option 2 homepage (masa language):
   charcoal ink, bone paper, brand red, Cormorant caps statements,
   Jost body, 01/02/03 section labels, red hanko seals, film-grain photography. */

:root{
  --ink:#26241F;
  --ink-soft:#3a362e;
  --deep:#201E19;
  --bone:#F6F3EC;
  --bone-hi:#F1EDE4;
  --cream:#E7E3DA;
  --muted:#6f695e;
  --faded:#8d867a;
  --hair:#d9d3c6;
  --red:#C0392B;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--bone); color:var(--ink);
  font:400 16px/1.6 'Jost',sans-serif;
  -webkit-font-smoothing:antialiased;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
.serif{ font-family:'Cormorant Garamond',serif; }

/* ---------- layout ---------- */
.wrap{ max-width:1440px; margin:0 auto; padding:0 34px; }
@media (max-width:760px){ .wrap{ padding:0 20px; } }

/* ---------- nav ---------- */
.nav{
  position:absolute; top:0; left:0; right:0; z-index:20;
  display:flex; align-items:center; justify-content:space-between;
  padding:26px 34px;
}
.nav .mark{ font:500 17px 'Jost'; letter-spacing:.5em; color:var(--bone); }
.nav .links{ display:flex; align-items:center; gap:34px; }
.nav .links nav{ display:flex; gap:30px; font:400 14.5px 'Jost'; color:var(--cream); }
.nav .links nav a{ transition:color .3s; }
.nav .links nav a:hover, .nav .links nav a[aria-current]{ color:#fff; }
.nav .cta{
  font:400 14.5px 'Jost'; color:var(--bone);
  background:var(--red); border:1px solid var(--red); padding:13px 26px;
  transition:background .3s,border-color .3s;
}
.nav .cta:hover{ background:#a83125; border-color:#a83125; }
.nav .hanko{
  display:flex; align-items:center; justify-content:center;
  width:46px; height:46px; background:var(--red); border:1px solid var(--red);
  font:500 19px 'Shippori Mincho'; color:var(--bone);
}
.nav .burger{ display:none; flex-direction:column; gap:5px; background:none; border:0; padding:6px 2px; cursor:pointer; }
.nav .burger span{ width:22px; height:1.5px; background:var(--bone); transition:transform .3s,opacity .3s; }
@media (max-width:900px){
  .nav{ padding:18px 20px; }
  .nav .links nav, .nav .hanko{ display:none; }
  .nav .cta{ font-size:12.5px; padding:9px 16px; }
  .nav .burger{ display:flex; }
}
/* mobile menu sheet */
.sheet{
  position:fixed; inset:0; z-index:40; background:var(--deep);
  display:flex; flex-direction:column; justify-content:center; padding:0 34px;
  opacity:0; pointer-events:none; transition:opacity .35s;
}
.sheet.open{ opacity:1; pointer-events:auto; }
.sheet a{
  font:500 34px/1 'Cormorant Garamond'; letter-spacing:.08em; color:var(--cream);
  padding:16px 0; border-bottom:1px solid rgba(231,227,218,.12);
}
.sheet a[aria-current]{ color:var(--red); }
.sheet .close{
  position:absolute; top:20px; right:20px; background:none; border:0;
  font:300 30px/1 'Jost'; color:var(--bone); cursor:pointer; padding:6px 10px;
}

/* ---------- hero ---------- */
.hero{ position:relative; height:62vh; min-height:480px; background:var(--deep); overflow:hidden; }
.hero.tall{ height:74vh; }
.hero .media{ position:absolute; inset:0; }
.hero .media img{ width:100%; height:100%; object-fit:cover; }
.hero .media.mono img{ filter:grayscale(1) brightness(.62) contrast(1.04); }
.hero .media.dim img{ filter:brightness(.66); }
.hero .scrim{ position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(20,19,16,.4) 0%, rgba(20,19,16,.05) 35%, rgba(20,19,16,.35) 100%); }
.hero .statement{
  position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; text-align:center; pointer-events:none;
}
.hero .statement .over{ font:italic 400 30px 'Cormorant Garamond'; color:var(--cream); letter-spacing:.06em; }
.hero .statement .word{
  font:500 92px/1.08 'Cormorant Garamond'; color:var(--bone);
  letter-spacing:.24em; padding-left:.24em;
  text-shadow:0 2px 30px rgba(20,19,16,.35);
}
.hero .foot{
  position:absolute; left:34px; right:34px; bottom:26px;
  display:flex; align-items:baseline; justify-content:space-between;
  font:400 19px 'Cormorant Garamond'; color:var(--cream);
}
.hero .foot .brand{ display:flex; align-items:baseline; gap:12px; }
.hero .foot .brand b{ font:500 15px 'Jost'; color:var(--bone); }
@media (max-width:760px){
  .hero{ height:66svh; min-height:420px; }
  .hero .statement .over{ font-size:19px; }
  .hero .statement .word{ font-size:46px; letter-spacing:.2em; padding-left:.2em; }
  .hero .foot{ left:20px; right:20px; bottom:18px; font-size:15px; }
  .hero .foot .brand b{ font-size:13px; }
}

/* ---------- section label (01 · Name) ---------- */
.sec{ padding-top:96px; }
.sec-label{ display:flex; gap:110px; align-items:baseline; }
.sec-label .no{ font:400 15px 'Cormorant Garamond'; color:var(--red); }
.sec-label .name{ font:400 16px 'Cormorant Garamond'; color:var(--ink); }
@media (max-width:760px){
  .sec{ padding-top:56px; }
  .sec-label{ gap:40px; }
}

/* ---------- serif caps statement ---------- */
.statement-block{ text-align:center; padding:70px 130px 80px; }
.statement-block .lines{ font:500 48px/1.3 'Cormorant Garamond'; letter-spacing:.05em; color:var(--ink); }
.statement-block .sub{ font:400 17px 'Cormorant Garamond'; color:var(--faded); margin-top:24px; letter-spacing:.04em; }
@media (max-width:900px){ .statement-block{ padding:50px 30px 56px; } .statement-block .lines{ font-size:32px; } }
@media (max-width:760px){ .statement-block{ padding:40px 4px 44px; } .statement-block .lines{ font-size:22px; letter-spacing:.04em; } }

/* ---------- editorial body ---------- */
.prose{ font:400 26px/1.6 'Cormorant Garamond'; color:var(--ink-soft); }
.prose p{ margin:0 0 30px; }
.prose p:last-child{ margin-bottom:0; }
@media (max-width:760px){ .prose{ font-size:19px; } }

/* ---------- reveals (standalone: real window scroller, no design frame) ---------- */
html.rv-on [data-rv]{ opacity:0; transform:translateY(34px);
  transition:opacity 1.05s cubic-bezier(.22,1,.36,1), transform 1.05s cubic-bezier(.22,1,.36,1); }
html.rv-on [data-rv].rv-in{ opacity:1; transform:none; }
html.rv-on [data-rv][data-rv-d="1"]{ transition-delay:.14s; }
html.rv-on [data-rv][data-rv-d="2"]{ transition-delay:.28s; }
html.rv-on [data-rv][data-rv-d="3"]{ transition-delay:.42s; }
html.rv-on [data-rv] .zoom{ transform:scale(1.07); transition:transform 1.7s cubic-bezier(.22,1,.36,1); }
html.rv-on [data-rv].rv-in .zoom{ transform:scale(1); }
html.rv-on .rv-hero{ animation:zx-hero 2.2s cubic-bezier(.22,1,.36,1) both; }
@keyframes zx-hero{ from{ opacity:0; transform:scale(1.06); } to{ opacity:1; transform:none; } }
.rv-line{ display:block; overflow:hidden; padding-bottom:.08em; margin-bottom:-.08em; }
.rv-line>span{ display:block; }
html.rv-on [data-rvl] .rv-line>span{ transform:translateY(118%);
  transition:transform 1.05s cubic-bezier(.22,1,.36,1); }
html.rv-on [data-rvl].rv-in .rv-line>span{ transform:none; }
html.rv-on [data-rvl] .rv-line:nth-child(2)>span{ transition-delay:.12s; }
html.rv-on [data-rvl] .rv-line:nth-child(3)>span{ transition-delay:.24s; }

/* ---------- imagery ---------- */
.ph{ position:relative; overflow:hidden; background:#1c1a16; }
.ph img{ width:100%; height:100%; object-fit:cover; }

/* ---------- buttons ---------- */
.btn{
  display:inline-block; font:400 15px 'Jost'; letter-spacing:.04em;
  padding:15px 34px; border:1px solid var(--ink); color:var(--ink);
  transition:background .3s,color .3s,border-color .3s;
}
.btn:hover{ background:var(--ink); color:var(--bone); }
.btn.red{ background:var(--red); border-color:var(--red); color:var(--bone); }
.btn.red:hover{ background:#a83125; border-color:#a83125; }

/* ---------- guest list band ---------- */
.guest{ text-align:center; padding:120px 0; max-width:800px; margin:0 auto; }
.guest h3{ font:400 30px 'Cormorant Garamond'; color:var(--ink); margin:0; }
.guest p{ font:400 16px/1.7 'Jost'; color:var(--muted); margin:14px 0 0; }
.guest .row{ display:flex; gap:0; margin-top:28px; border-bottom:1px solid var(--ink); padding-bottom:10px; text-align:left; }
.guest .row input{
  flex:1; font:400 16px 'Jost'; color:var(--ink); background:none; border:0; outline:none; padding:0;
}
.guest .row input::placeholder{ color:#a49d8f; }
.guest .row button{
  font:500 13px 'Jost'; letter-spacing:.14em; color:var(--red);
  background:none; border:0; cursor:pointer; padding:0;
}
.guest .ig{ font:400 15px 'Jost'; color:var(--muted); margin-top:26px; }
@media (max-width:760px){ .guest{ padding:70px 0; } }

/* ---------- footer ---------- */
.footer{ background:var(--ink); color:var(--cream); padding:80px 0 60px; }
.footer .cols{ display:grid; grid-template-columns:1fr 1fr 1fr 1fr; gap:40px; align-items:start; }
.footer .mark{ font:500 16px 'Jost'; letter-spacing:.5em; }
.footer .kv{ display:flex; gap:26px; font:400 16px 'Cormorant Garamond'; }
.footer .kv + .kv{ margin-top:10px; }
.footer .kv .k{ color:var(--faded); min-width:14px; }
.footer nav{ display:grid; gap:8px; font:400 15px 'Jost'; color:var(--cream); }
.footer nav a:hover{ color:#fff; }
.footer .hanko{
  justify-self:end; display:flex; align-items:center; justify-content:center;
  width:46px; height:46px; background:var(--red); border:1px solid var(--red);
  font:500 19px 'Shippori Mincho'; color:var(--bone);
}
.footer .fine{ font:400 14px 'Jost'; color:var(--faded); margin-top:70px; }
@media (max-width:900px){
  .footer .cols{ grid-template-columns:1fr 1fr; }
  .footer .hanko{ justify-self:start; }
}
@media (max-width:560px){ .footer .cols{ grid-template-columns:1fr; gap:32px; } }

/* ---------- menu page ---------- */
.plates{ background:var(--deep); padding:84px 0 92px; }
.plates .kicker{ text-align:center; font:400 13px 'Cormorant Garamond'; letter-spacing:.3em; text-transform:uppercase; color:var(--red); }
.plates .line{ text-align:center; font:italic 400 30px 'Cormorant Garamond'; color:var(--cream); margin:12px 0 56px; }
.plates .row{ display:flex; justify-content:center; gap:64px; flex-wrap:wrap; }
.plate-tier{ text-align:center; }
.plate-tier .ring{
  width:104px; height:104px; border-radius:50%; margin:0 auto;
  border:3px solid; position:relative;
  box-shadow:0 24px 38px -16px rgba(0,0,0,.85);
  background:radial-gradient(circle at 35% 30%, rgba(255,255,255,.10), rgba(0,0,0,.28));
}
.plate-tier .ring::after{
  content:''; position:absolute; inset:14px; border-radius:50%;
  border:1px solid rgba(246,243,236,.22);
}
.plate-tier .t-name{ font:italic 400 17px 'Cormorant Garamond'; letter-spacing:.1em; color:#a49d90; margin-top:20px; }
.plate-tier .t-price{ font:500 22px 'Cormorant Garamond'; color:var(--bone); margin-top:4px; }
@media (max-width:760px){
  .plates .row{ gap:34px; }
  .plate-tier .ring{ width:76px; height:76px; }
}
.menu-cat{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; padding:64px 0 30px; }
.menu-cat .art{ position:relative; height:640px; }
.menu-cat.flip .art{ order:2; }
.menu-items{ display:grid; gap:0; }
.menu-item{ display:flex; align-items:baseline; gap:18px; padding:19px 0; border-bottom:1px solid var(--hair); }
.menu-item:first-child{ padding-top:4px; }
.menu-item .n{ font:500 21px 'Cormorant Garamond'; color:var(--ink); white-space:nowrap; }
.menu-item .d{ flex:1; font:400 14.5px/1.5 'Jost'; color:var(--muted); }
.menu-item .dot{
  width:13px; height:13px; border-radius:50%; border:2.5px solid; flex:none;
  align-self:center;
}
@media (max-width:900px){
  .menu-cat{ grid-template-columns:1fr; gap:30px; }
  .menu-cat .art{ height:400px; }
  .menu-cat.flip .art{ order:0; }
  .menu-item .n{ white-space:normal; font-size:19px; }
}

/* ---------- story page ---------- */
.split{ display:grid; grid-template-columns:1fr 1fr; }
.split .pane{ padding:90px 70px; display:flex; flex-direction:column; justify-content:center; }
.split .pane .script{ font:400 74px/1 'Mrs Saint Delafield'; color:var(--bone); }
.split .ph{ min-height:640px; }
@media (max-width:900px){
  .split{ grid-template-columns:1fr; }
  .split .pane{ padding:50px 24px; }
  .split .pane .script{ font-size:52px; }
  .split .ph{ min-height:380px; }
}

/* ---------- location page ---------- */
.addr{ text-align:center; padding:90px 0 60px; }
.addr .big{ font:500 64px/1.2 'Cormorant Garamond'; letter-spacing:.05em; color:var(--ink); }
.addr .sub{ font:400 19px 'Cormorant Garamond'; color:var(--faded); margin-top:16px; }
@media (max-width:760px){ .addr .big{ font-size:34px; } }
.mapband{ position:relative; height:560px; overflow:hidden; background:var(--deep); }
.mapband iframe{
  position:absolute; inset:0; width:100%; height:100%; border:0;
  filter:grayscale(1) contrast(1.04) brightness(.94);
}
@media (max-width:760px){ .mapband{ height:400px; } }
.info-cols{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:40px; padding:80px 0; }
.info-cols h4{ font:400 14px 'Cormorant Garamond'; letter-spacing:.24em; text-transform:uppercase; color:var(--red); margin:0 0 16px; }
.info-cols div p{ font:400 21px/1.55 'Cormorant Garamond'; color:var(--ink-soft); margin:0; }
.info-cols div p + p{ margin-top:8px; }
@media (max-width:900px){ .info-cols{ grid-template-columns:1fr; gap:36px; padding:56px 0; } }

/* ---------- contact page ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:80px; padding:90px 0 40px; align-items:start; }
.contact-grid .ph{ height:720px; }
.c-rows{ display:grid; gap:0; }
.c-row{ padding:30px 0; border-bottom:1px solid var(--hair); }
.c-row .k{ font:400 13px 'Cormorant Garamond'; letter-spacing:.24em; text-transform:uppercase; color:var(--red); }
.c-row .v{ font:500 30px 'Cormorant Garamond'; color:var(--ink); margin-top:8px; }
.c-row .v a:hover{ color:var(--red); }
.c-row .note{ font:400 14.5px/1.6 'Jost'; color:var(--muted); margin-top:8px; max-width:420px; }
@media (max-width:900px){
  .contact-grid{ grid-template-columns:1fr; gap:40px; padding:56px 0 20px; }
  .contact-grid .ph{ height:420px; }
  .c-row .v{ font-size:23px; }
}

@media (prefers-reduced-motion: reduce){
  html.rv-on [data-rv], html.rv-on [data-rvl] .rv-line>span{ opacity:1; transform:none; transition:none; }
  html.rv-on .rv-hero{ animation:none; }
}


/* ---------- guest list signup (shared with the homepage) ---------- */
.zn-form{ width:min(440px, 100%); max-width:100%; margin:0; }
/* the label + field band in the footer; it must fold on a phone */
.zn-band{ display:grid; grid-template-columns:380px 1fr; gap:60px; align-items:start;
  margin-top:64px; padding-top:44px; border-top:1px solid rgba(231,227,218,.14); }
@media (max-width:860px){ .zn-band{ grid-template-columns:1fr; gap:16px; margin-top:44px; padding-top:32px; } }
.zn-row{ display:flex; align-items:stretch; border-bottom:1px solid rgba(231,227,218,.42); transition:border-color .35s; }
.zn-row:focus-within{ border-bottom-color:var(--red); }
.zn-input{ flex:1 1 auto; min-width:0; background:transparent; border:0; outline:0; color:var(--bone);
  font:400 15px 'Jost'; letter-spacing:.04em; padding:13px 2px; }
.zn-input::placeholder{ color:rgba(241,237,228,.62); }
.zn-btn{ flex:0 0 auto; background:var(--red); border:1px solid var(--red); color:var(--bone); cursor:pointer;
  font:400 12.5px 'Jost'; letter-spacing:.18em; text-transform:uppercase; padding:0 22px;
  transition:background .35s, border-color .35s; }
.zn-btn:hover{ background:#a63125; border-color:#a63125; }
.zn-note{ font:400 13px/1.6 'Jost'; color:rgba(231,227,218,.6); margin:14px 0 0; }
.zn-msg{ display:none; font:400 13.5px/1.6 'Jost'; margin:14px 0 0; }
.zn-ok{ color:var(--cream); }
.zn-err, .zn-off{ color:var(--red); }
.zn-form.is-done .zn-row, .zn-form.is-done .zn-note{ display:none; }
.zn-form.is-done .zn-ok{ display:block; }
.zn-form.is-err .zn-err{ display:block; }
.zn-form.is-off .zn-off{ display:block; }
.zn-form.is-busy .zn-btn{ opacity:.5; pointer-events:none; }
.zn-lab{ font:400 16px 'Cormorant Garamond'; color:var(--faded); margin-bottom:12px; }

/* on a bone section the same form flips to ink */
.zn-ink{ margin:28px auto 0; text-align:left; }
.zn-ink .zn-row{ border-bottom-color:var(--ink); }
.zn-ink .zn-input{ color:var(--ink); font-size:16px; }
.zn-ink .zn-input::placeholder{ color:#a49d8f; }
.zn-ink .zn-note{ color:var(--muted); }
.zn-ink .zn-ok{ color:var(--ink); }

@media (max-width:760px){
  .zn-form{ width:100%; }
  .zn-btn{ padding:0 15px; font-size:11.5px; letter-spacing:.14em; }
  .zn-input{ font-size:14px; padding:11px 2px; }
}
