/* =========================================================
   SUSHIGARDEN DZ — Brand-true stylesheet
   Tokens from Volume I, Edition 2026.
   ========================================================= */

:root{
  /* === PRIMARY (60·30·10) === */
  --akane:        #C8102E;
  --akane-rgb:    200,16,46;
  --sumi:         #0B0B0C;
  --sumi-rgb:     11,11,12;
  --kome:         #F5EFE6;
  --kome-rgb:     245,239,230;

  /* === SECONDARY === */
  --shoyu:        #8B0F1E;
  --sake:         #E63B4F;
  --sumi-soft:    #1F1F22;
  --washi:        #FBF7EF;

  /* === SURFACES === */
  --bg:           var(--washi);
  --ink:          var(--sumi);
  --line:         rgba(11,11,12,.10);
  --line-strong:  rgba(11,11,12,.22);

  /* === TYPE === */
  --display:  'Shippori Mincho', 'Noto Serif JP', Georgia, serif;
  --sans:     'Inter', system-ui, -apple-system, Segoe UI, sans-serif;
  --jp:       'Noto Sans JP', sans-serif;

  /* === SCALE === */
  --h1: clamp(48px, 7.4vw, 110px);
  --h2: clamp(34px, 4.6vw, 72px);
  --h3: clamp(22px, 1.8vw, 28px);
  --body: 16px;
  --eyebrow: 12px;

  /* === MOTION === */
  --ease: cubic-bezier(.2,.7,.2,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --ease-in:  cubic-bezier(.7,0,.84,0);

  /* === SHADOWS === */
  --shadow-soft: 0 24px 60px -24px rgba(11,11,12,.18), 0 1px 0 rgba(11,11,12,.04);
  --shadow-pop:  0 40px 80px -24px rgba(200,16,46,.35);
}

/* =====================================================
   RESET / BASE
   ===================================================== */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  font-family:var(--sans);
  font-size:var(--body);
  line-height:1.6;
  color:var(--ink);
  background:var(--bg);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
ul,ol{ list-style:none; }
::selection{ background:var(--akane); color:var(--washi); }

/* =====================================================
   GRAIN / TEXTURE
   ===================================================== */
.grain{
  position:fixed; inset:0; pointer-events:none; z-index:9000;
  opacity:.06; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* =====================================================
   CURSOR
   ===================================================== */
.cursor{ position:fixed; top:0; left:0; pointer-events:none; z-index:9999; mix-blend-mode:difference; }
.cursor-dot{
  position:absolute; width:6px; height:6px; background:var(--washi);
  border-radius:50%; transform:translate(-50%,-50%);
  transition:width .25s var(--ease), height .25s var(--ease);
}
.cursor-ring{
  position:absolute; width:36px; height:36px; border:1px solid var(--washi);
  border-radius:50%; transform:translate(-50%,-50%);
  transition:width .35s var(--ease), height .35s var(--ease), background .35s var(--ease);
}
.cursor.is-cta .cursor-ring{ width:64px; height:64px; background:rgba(255,255,255,.06); }
.cursor.is-link .cursor-ring{ width:48px; height:48px; }
@media (max-width:900px){ .cursor{ display:none; } }

/* =====================================================
   PRELOADER
   ===================================================== */
.preloader{
  position:fixed; inset:0; background:var(--sumi); z-index:9500;
  display:flex; align-items:center; justify-content:center; flex-direction:column; gap:24px;
  transition:opacity .9s var(--ease), visibility .9s;
  /* CSS safety net: auto-hide after 2.4s even if JS never runs */
  animation:preAutoHide .9s var(--ease) 2.4s forwards;
}
.preloader.is-done{ opacity:0; visibility:hidden; pointer-events:none; animation:none; }
@keyframes preAutoHide{
  to{ opacity:0; visibility:hidden; pointer-events:none; }
}
.pre-circle{ position:relative; width:120px; height:120px; }
.pre-svg{ width:100%; height:100%; transform:rotate(-90deg); }
.pre-progress{ animation:preFill 1.6s var(--ease) forwards; }
@keyframes preFill{ to{ stroke-dashoffset:0; } }
.pre-kanji{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-family:var(--jp); color:var(--washi); font-size:40px; font-weight:700;
}
.pre-label{
  font-family:var(--sans); color:var(--washi); font-size:11px;
  letter-spacing:.32em; font-weight:600;
}
.pre-label span{ color:var(--akane); margin:0 8px; }

/* =====================================================
   NAV
   ===================================================== */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px clamp(20px,4vw,56px);
  transition:background .4s var(--ease), backdrop-filter .4s, padding .4s, border-color .4s;
  border-bottom:1px solid transparent;
}
.nav.is-scrolled{
  background:rgba(251,247,239,.78);
  backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  padding:12px clamp(20px,4vw,56px);
  border-color:var(--line);
}
.nav-logo{ display:flex; align-items:center; gap:12px; }
.nav-logo-mark{ width:38px; height:38px; flex:0 0 38px; transition:transform .6s var(--ease-out); }
.nav-logo:hover .nav-logo-mark{ transform:rotate(360deg); }
.nav-logo-text{ display:flex; flex-direction:column; line-height:1.1; }
.nav-logo-text strong{ font-family:var(--display); font-size:18px; font-weight:600; letter-spacing:-.01em; }
.nav-logo-text em{ font-style:normal; font-size:10.5px; letter-spacing:.22em; color:rgba(11,11,12,.6); text-transform:uppercase; font-weight:500; }

.nav-links{ display:flex; gap:32px; }
.nav-links a{
  font-size:13.5px; font-weight:500; position:relative; padding:6px 0;
  color:rgba(11,11,12,.78); transition:color .3s;
}
.nav-links a::after{
  content:''; position:absolute; left:0; bottom:0; width:0; height:1px;
  background:var(--akane); transition:width .4s var(--ease-out);
}
.nav-links a:hover{ color:var(--ink); }
.nav-links a:hover::after{ width:100%; }

.nav-cta{
  display:inline-flex; align-items:center; gap:10px;
  padding:11px 18px; background:var(--sumi); color:var(--washi);
  border-radius:999px; font-size:13px; font-weight:600;
  transition:transform .35s var(--ease), background .35s;
  letter-spacing:.02em;
}
.nav-cta:hover{ transform:translateY(-2px); background:var(--akane); }
.nav-cta .dot{ width:6px; height:6px; background:var(--akane); border-radius:50%; box-shadow:0 0 0 4px rgba(200,16,46,.25); animation:pulse 1.6s infinite; }
.nav-cta:hover .dot{ background:var(--washi); box-shadow:0 0 0 4px rgba(245,239,230,.25); }
.nav-cta .arrow{ transition:transform .3s; }
.nav-cta:hover .arrow{ transform:translateX(4px); }

@keyframes pulse{ 0%,100%{ opacity:1; } 50%{ opacity:.4; } }

.nav-burger{ display:none; width:40px; height:40px; flex-direction:column; justify-content:center; align-items:center; gap:5px; }
.nav-burger span{ width:22px; height:1.5px; background:var(--ink); transition:transform .35s var(--ease), opacity .25s; }
.nav-burger.is-open span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
.nav-burger.is-open span:nth-child(2){ opacity:0; }
.nav-burger.is-open span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

.mobile-menu{
  position:fixed; inset:0; z-index:990; background:var(--sumi); color:var(--washi);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px;
  opacity:0; visibility:hidden; transition:opacity .45s var(--ease), visibility .45s;
}
.mobile-menu.is-open{ opacity:1; visibility:visible; }
.mobile-menu a{ font-family:var(--display); font-size:34px; font-weight:500; }
.mobile-menu .mobile-cta{
  margin-top:24px; padding:14px 28px; background:var(--akane); border-radius:999px;
  font-family:var(--sans); font-size:15px; font-weight:600; letter-spacing:.02em;
}

@media (max-width:900px){
  .nav-links, .nav-cta{ display:none; }
  .nav-burger{ display:flex; }
}

/* =====================================================
   GLOBAL TYPE / HELPERS
   ===================================================== */
.eyebrow{
  display:inline-flex; align-items:center; gap:14px;
  font-size:var(--eyebrow); font-weight:600; letter-spacing:.32em; text-transform:uppercase;
  color:rgba(11,11,12,.7);
}
.eyebrow.light{ color:rgba(245,239,230,.8); }
.eyebrow .bar{
  width:48px; height:1px; background:var(--akane);
}
.section-title{
  font-family:var(--display); font-weight:600;
  font-size:var(--h2); line-height:1.04; letter-spacing:-.02em;
  margin:18px 0 18px;
}
.section-title em{ font-style:italic; font-weight:400; }
.section-title .akane{ color:var(--akane); }
.section-lede{
  max-width:620px; font-size:17px; line-height:1.65;
  color:rgba(11,11,12,.74);
}
.section-head{ padding:0 clamp(20px,4vw,56px); margin-bottom:60px; }

.btn{
  display:inline-flex; align-items:center; gap:12px;
  padding:16px 26px; border-radius:999px; font-weight:600; font-size:14.5px;
  letter-spacing:.02em; transition:transform .4s var(--ease), background .4s, color .4s, box-shadow .4s;
  position:relative; overflow:hidden;
}
.btn-primary{ background:var(--sumi); color:var(--washi); }
.btn-primary:hover{ background:var(--akane); transform:translateY(-3px); box-shadow:var(--shadow-pop); }
.btn-ghost{ background:transparent; color:var(--ink); border:1px solid var(--line-strong); }
.btn-ghost:hover{ border-color:var(--ink); transform:translateY(-3px); }
.btn-arrow{ transition:transform .3s var(--ease); display:inline-block; }
.btn:hover .btn-arrow{ transform:translateX(6px); }
.btn-dot{ width:8px; height:8px; background:var(--akane); border-radius:50%; box-shadow:0 0 0 4px rgba(200,16,46,.18); }

/* =====================================================
   HERO
   ===================================================== */
.hero{
  position:relative; min-height:100svh; padding:140px clamp(20px,4vw,56px) 80px;
  display:grid; grid-template-columns:1.05fr .95fr; gap:60px; align-items:center;
  background:linear-gradient(180deg, var(--washi) 0%, var(--kome) 100%);
  overflow:hidden;
}

.hero-bg{ position:absolute; inset:0; pointer-events:none; }
.hero-circle{
  position:absolute; border:1px solid rgba(11,11,12,.07); border-radius:50%;
}
.hero-circle-1{ width:80vw; height:80vw; left:-20vw; top:-30vw; }
.hero-circle-2{ width:60vw; height:60vw; right:-10vw; bottom:-20vw; }
.hero-circle-3{ width:30vw; height:30vw; left:30vw; bottom:-15vw; border-color:rgba(200,16,46,.10); }
.hero-grid{
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(11,11,12,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(11,11,12,.04) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: radial-gradient(ellipse at center, #000 30%, transparent 75%);
  opacity:.7;
}
.hero-kanji{
  position:absolute; right:-8vw; top:8vh;
  font-family:var(--jp); font-weight:700;
  font-size:clamp(280px, 38vw, 620px);
  color:rgba(11,11,12,.04); letter-spacing:-.05em;
  user-select:none; pointer-events:none; line-height:.85;
}

.hero-content{ position:relative; z-index:2; }
.hero-eyebrow{
  display:flex; align-items:center; gap:14px; font-size:11px; font-weight:600;
  letter-spacing:.34em; color:rgba(11,11,12,.65); margin-bottom:36px;
}
.hero-eyebrow .line{ width:42px; height:1px; background:var(--akane); }

.hero-title{
  font-family:var(--display); font-weight:600;
  font-size:var(--h1); line-height:1; letter-spacing:-.025em;
  color:var(--ink);
}
.hero-title .word{ display:inline-block; overflow:hidden; vertical-align:bottom; margin-right:.18em; }
.hero-title .word > span{
  display:inline-block; transform:translateY(110%);
  animation:wordUp .9s var(--ease-out) forwards;
}
.hero-title .word.akane > span{ color:var(--akane); }
.hero-title .word.italic{ font-style:italic; font-weight:400; }
.hero-title .word:nth-child(1) > span{ animation-delay:.10s; }
.hero-title .word:nth-child(2) > span{ animation-delay:.16s; }
.hero-title .word:nth-child(3) > span{ animation-delay:.22s; }
.hero-title .word:nth-child(4) > span{ animation-delay:.28s; }
.hero-title .word:nth-child(5) > span{ animation-delay:.34s; }
.hero-title .word:nth-child(6) > span{ animation-delay:.40s; }
.hero-title .word:nth-child(8) > span{ animation-delay:.55s; }
.hero-title .word:nth-child(9) > span{ animation-delay:.62s; }
.hero-title .word:nth-child(10) > span{ animation-delay:.68s; }
.hero-title .word:nth-child(11) > span{ animation-delay:.74s; }
@keyframes wordUp{ to{ transform:translateY(0); } }

.hero-sub{
  margin:30px 0 38px; max-width:520px; font-size:17.5px; line-height:1.6;
  color:rgba(11,11,12,.72);
  opacity:0; animation:fadeUp 1s var(--ease-out) .9s forwards;
}
.hero-sub em{ color:var(--akane); font-style:normal; font-weight:600; }
.hero-actions{
  display:flex; gap:14px; flex-wrap:wrap;
  opacity:0; animation:fadeUp 1s var(--ease-out) 1.05s forwards;
}
@keyframes fadeUp{ from{ opacity:0; transform:translateY(20px); } to{ opacity:1; transform:none; } }

/* MEDALLION 3D */
.hero-medallion{
  position:relative; aspect-ratio:1; max-width:620px; width:100%;
  margin-left:auto; perspective:1400px;
  animation:fadeIn 1.4s var(--ease-out) .4s both;
}
@keyframes fadeIn{ from{ opacity:0; } to{ opacity:1; } }

.medallion-stage{
  position:relative; width:100%; height:100%;
  transform-style:preserve-3d;
  animation:medFloat 9s ease-in-out infinite;
}
@keyframes medFloat{
  0%,100%{ transform:rotateX(8deg) rotateY(-8deg) translateY(0); }
  50%{ transform:rotateX(-4deg) rotateY(8deg) translateY(-12px); }
}

.medallion-ring{
  position:absolute; inset:0; border-radius:50%;
  border:1px dashed rgba(11,11,12,.18);
  animation:ringSpin 26s linear infinite;
}
.medallion-ring-1{ inset:-6%; border-color:rgba(11,11,12,.14); }
.medallion-ring-2{ inset:6%; border-style:dotted; animation-direction:reverse; animation-duration:18s; border-color:rgba(200,16,46,.28); }
.medallion-ring-3{ inset:14%; border-style:solid; border-color:rgba(11,11,12,.06); animation-duration:34s; }
@keyframes ringSpin{ to{ transform:rotate(360deg); } }

.medallion-disc{
  position:absolute; inset:18%; border-radius:50%;
  filter:drop-shadow(0 50px 70px rgba(200,16,46,.35)) drop-shadow(0 20px 40px rgba(11,11,12,.4));
  transform:translateZ(40px);
}
.medallion-svg{ width:100%; height:100%; }
.rice-flower{ animation:rice 12s ease-in-out infinite; transform-origin:center; }
@keyframes rice{ 0%,100%{ transform:rotate(0); } 50%{ transform:rotate(20deg); } }

.medallion-floaters{ position:absolute; inset:0; pointer-events:none; }
.floater{
  position:absolute; font-family:var(--jp); font-weight:700;
  color:rgba(11,11,12,.18); font-size:32px;
  animation:floatY 8s ease-in-out infinite;
}
.floater.f1{ top:6%;  left:-2%; font-size:54px; color:rgba(200,16,46,.4); }
.floater.f2{ top:30%; right:-4%; font-size:44px; animation-delay:1s; }
.floater.f3{ bottom:8%; left:8%; font-size:60px; color:rgba(200,16,46,.3); animation-delay:2s; }
.floater.f4{ bottom:24%; right:6%; font-size:38px; animation-delay:3s; }
@keyframes floatY{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-14px); } }

/* HERO scroll cue */
.hero-scroll{
  position:absolute; left:clamp(20px,4vw,56px); bottom:80px; z-index:3;
  display:flex; flex-direction:column; align-items:center; gap:10px;
  font-size:10px; letter-spacing:.4em; color:rgba(11,11,12,.6); font-weight:600;
}
.scroll-line{ width:1px; height:60px; background:linear-gradient(var(--ink), transparent); position:relative; overflow:hidden; }
.scroll-line::after{ content:''; position:absolute; left:0; right:0; top:-50%; height:50%; background:var(--akane); animation:scrollDown 2s infinite var(--ease); }
@keyframes scrollDown{ to{ top:100%; } }

/* HERO marquee */
.hero-marquee{
  position:absolute; left:0; right:0; bottom:0;
  background:var(--sumi); color:var(--washi);
  padding:14px 0; overflow:hidden; border-top:1px solid rgba(245,239,230,.08);
}
.marquee-track{
  display:flex; gap:48px; align-items:center;
  white-space:nowrap; animation:marquee 28s linear infinite;
  font-family:var(--display); font-style:italic; font-size:18px; font-weight:500;
}
.marquee-track .dot{ color:var(--akane); }
@keyframes marquee{ to{ transform:translateX(-50%); } }

@media (max-width:1000px){
  .hero{ grid-template-columns:1fr; padding-top:120px; }
  .hero-medallion{ max-width:420px; margin:0 auto; }
  .hero-scroll{ display:none; }
}

/* =====================================================
   PHILOSOPHY
   ===================================================== */
.philosophy{
  padding:140px clamp(20px,4vw,56px);
  background:var(--washi);
  position:relative;
}
.pillars{
  display:grid; grid-template-columns:repeat(4, 1fr); gap:0;
  border-top:1px solid var(--line);
}
.pillar{
  position:relative; padding:48px 36px 56px;
  border-right:1px solid var(--line);
  transition:background .5s var(--ease);
}
.pillar:last-child{ border-right:0; }
.pillar:hover{ background:rgba(200,16,46,.04); }
.pillar-num{
  font-family:var(--jp); font-weight:700; font-size:54px;
  color:var(--akane); line-height:1; margin-bottom:38px;
  transition:transform .5s var(--ease);
}
.pillar:hover .pillar-num{ transform:translateY(-6px); }
.pillar h3{
  font-family:var(--display); font-size:30px; font-weight:600;
  letter-spacing:-.01em; margin-bottom:14px;
}
.pillar p{ font-size:15px; line-height:1.65; color:rgba(11,11,12,.72); }
.pillar-line{
  position:absolute; right:-1px; top:0; width:1px; height:0; background:var(--akane);
  transition:height .5s var(--ease);
}
.pillar:hover .pillar-line{ height:100%; }

@media (max-width:900px){
  .pillars{ grid-template-columns:1fr 1fr; }
  .pillar:nth-child(2n){ border-right:0; }
  .pillar:nth-child(-n+2){ border-bottom:1px solid var(--line); }
}
@media (max-width:560px){
  .pillars{ grid-template-columns:1fr; }
  .pillar{ border-right:0; border-bottom:1px solid var(--line); }
  .pillar:last-child{ border-bottom:0; }
}

/* =====================================================
   MENU
   ===================================================== */
.menu{
  background:var(--sumi); color:var(--washi);
  padding:140px 0 160px; position:relative; overflow:hidden;
}
.menu .eyebrow{ color:rgba(245,239,230,.6); }
.menu .section-title{ color:var(--washi); }
.menu .section-title .akane{ color:var(--sake); }
.menu .section-lede{ color:rgba(245,239,230,.7); }

.menu-tabs{
  position:relative; display:flex; gap:0;
  margin:0 clamp(20px,4vw,56px) 56px;
  border-top:1px solid rgba(245,239,230,.12);
  border-bottom:1px solid rgba(245,239,230,.12);
  overflow-x:auto;
}
.tab{
  position:relative; flex:1; min-width:160px;
  padding:24px 16px; display:flex; flex-direction:column; gap:6px;
  align-items:flex-start; text-align:left; color:rgba(245,239,230,.55);
  transition:color .35s var(--ease);
  border-right:1px solid rgba(245,239,230,.12);
}
.tab:last-of-type{ border-right:0; }
.tab:hover{ color:var(--washi); }
.tab.is-active{ color:var(--washi); }
.tab-jp{ font-family:var(--jp); font-size:14px; color:var(--akane); font-weight:700; letter-spacing:.05em; }
.tab.is-active .tab-jp{ color:var(--sake); }
.tab-name{ font-family:var(--display); font-size:24px; font-weight:500; letter-spacing:-.01em; }
.tab-meta{ font-size:11px; letter-spacing:.24em; color:rgba(245,239,230,.4); font-weight:600; }
.tab-indicator{
  position:absolute; bottom:-1px; height:2px; background:var(--akane);
  transition:left .55s var(--ease-out), width .55s var(--ease-out);
}

.menu-panel{
  display:none; padding:0 clamp(20px,4vw,56px);
}
.menu-panel.is-active{ display:block; animation:panelIn .7s var(--ease-out); }
@keyframes panelIn{ from{ opacity:0; transform:translateY(20px); } to{ opacity:1; transform:none; } }

.panel-head{
  display:flex; justify-content:space-between; align-items:flex-end; gap:40px;
  padding-bottom:32px; border-bottom:1px solid rgba(245,239,230,.12);
  margin-bottom:32px;
}
.panel-head h3{ font-family:var(--display); font-size:48px; font-weight:600; letter-spacing:-.02em; }
.panel-head p{ color:rgba(245,239,230,.7); margin-top:10px; max-width:520px; }
.panel-head p strong{ color:var(--washi); font-weight:600; }
.panel-jp{
  font-family:var(--jp); font-weight:700; font-size:90px;
  color:rgba(200,16,46,.55); line-height:.9; letter-spacing:-.04em;
}

.menu-list{ display:flex; flex-direction:column; }
.dish{
  display:grid; grid-template-columns:80px 1fr auto auto; gap:20px;
  align-items:center; padding:22px 0;
  border-bottom:1px solid rgba(245,239,230,.08);
  transition:padding .4s var(--ease), background .4s;
  position:relative;
}
.dish:hover{ padding-left:14px; }
.dish::before{
  content:''; position:absolute; left:0; top:50%; width:0; height:1px;
  background:var(--akane); transition:width .4s var(--ease-out);
  transform:translateY(-50%);
}
.dish:hover::before{ width:8px; }
.dish-num{ font-size:11px; letter-spacing:.22em; color:rgba(245,239,230,.4); font-weight:600; }
.dish-name{ font-family:var(--display); font-size:26px; font-weight:500; letter-spacing:-.01em; }
.dish-name .badge{
  display:inline-block; margin-left:14px; padding:3px 10px;
  background:var(--akane); color:var(--washi); border-radius:999px;
  font-family:var(--sans); font-size:10px; font-weight:600; letter-spacing:.18em;
  vertical-align:middle;
}
.dish-dots{
  height:1px; border-top:1px dashed rgba(245,239,230,.18);
}
.dish-price{
  font-family:var(--display); font-size:26px; font-weight:600;
  color:var(--washi); letter-spacing:-.01em;
}
.dish-price small{ font-size:11px; font-weight:600; color:rgba(245,239,230,.5); margin-left:4px; letter-spacing:.18em; }
.dish-signature .dish-name{ color:var(--sake); }
.dish-signature .dish-price{ color:var(--sake); }

@media (max-width:700px){
  .panel-head{ flex-direction:column; align-items:flex-start; }
  .panel-jp{ font-size:60px; }
  .dish{ grid-template-columns:60px 1fr auto; gap:14px; }
  .dish-dots{ display:none; }
  .dish-name{ font-size:20px; }
  .dish-price{ font-size:20px; }
}

/* === BOXES === */
.boxes{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:18px;
}
.box{
  position:relative; padding:32px 28px;
  background:var(--sumi-soft);
  border:1px solid rgba(245,239,230,.08);
  border-radius:6px;
  display:flex; flex-direction:column; gap:24px;
  transition:transform .5s var(--ease), border-color .5s, background .5s;
  overflow:hidden;
}
.box::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at top right, rgba(200,16,46,.18), transparent 60%);
  opacity:0; transition:opacity .5s;
  pointer-events:none;
}
.box:hover{ transform:translateY(-6px); border-color:rgba(200,16,46,.4); }
.box:hover::before{ opacity:1; }

.box-tier{ display:inline-block; font-size:11px; letter-spacing:.32em; color:var(--akane); font-weight:700; }
.box-head h4{ font-family:var(--display); font-size:36px; font-weight:600; letter-spacing:-.01em; margin:8px 0 6px; }
.box-pcs{ font-size:13px; color:rgba(245,239,230,.55); letter-spacing:.06em; text-transform:uppercase; font-weight:500; }

.box-mix{ display:flex; flex-direction:column; gap:10px; padding:18px 0; border-top:1px solid rgba(245,239,230,.1); border-bottom:1px solid rgba(245,239,230,.1); }
.box-mix li{ display:flex; justify-content:space-between; align-items:center; font-size:13.5px; }
.box-mix li span{ color:rgba(245,239,230,.66); letter-spacing:.06em; text-transform:uppercase; font-weight:500; }
.box-mix li strong{ font-family:var(--display); font-size:20px; font-weight:600; }

.box-foot{ display:flex; justify-content:space-between; align-items:center; gap:14px; }
.box-price{ font-family:var(--display); font-size:34px; font-weight:600; letter-spacing:-.02em; }
.box-price small{ font-size:11px; font-weight:600; color:rgba(245,239,230,.55); margin-left:4px; letter-spacing:.18em; }
.box-cta{
  font-size:13px; font-weight:600; letter-spacing:.04em;
  padding:10px 14px; border:1px solid rgba(245,239,230,.18); border-radius:999px;
  transition:background .4s, color .4s, border-color .4s, transform .4s;
}
.box-cta:hover{ background:var(--akane); color:var(--washi); border-color:var(--akane); transform:translateX(3px); }

.box-featured{
  background:linear-gradient(160deg, #2a0a10 0%, var(--sumi-soft) 60%);
  border-color:rgba(200,16,46,.35);
  grid-row:span 1;
}
.box-deluxe{
  background:linear-gradient(150deg, var(--akane) 0%, var(--shoyu) 100%);
  border-color:transparent;
  grid-column:span 2;
  flex-direction:row; align-items:flex-end; justify-content:space-between;
  padding:42px 36px;
}
.box-deluxe::before{ display:none; }
.box-deluxe .box-mix{ border-color:rgba(245,239,230,.2); }
.box-deluxe .box-mix li span{ color:rgba(245,239,230,.85); }
.box-deluxe .box-cta{ background:var(--washi); color:var(--sumi); border-color:var(--washi); }
.box-deluxe .box-cta:hover{ background:var(--sumi); color:var(--washi); border-color:var(--sumi); }
.box-deluxe .box-head h4{ font-size:54px; }

.box-badge{
  position:absolute; top:18px; right:18px;
  font-size:10px; font-weight:700; letter-spacing:.22em;
  padding:5px 10px; border-radius:999px; background:var(--akane); color:var(--washi);
}
.box-badge-deluxe{ background:var(--washi); color:var(--shoyu); }

@media (max-width:1000px){
  .boxes{ grid-template-columns:repeat(2, 1fr); }
  .box-deluxe{ grid-column:span 2; flex-direction:column; align-items:flex-start; }
}
@media (max-width:600px){
  .boxes{ grid-template-columns:1fr; }
  .box-deluxe{ grid-column:auto; }
}

/* =====================================================
   PANEL CINEMA — 4K hero per category
   ===================================================== */
.panel-cinema{
  position:relative; margin:0 0 56px; height:clamp(280px, 46vh, 520px);
  border-radius:14px; overflow:hidden;
  box-shadow:0 30px 80px -30px rgba(0,0,0,.6), inset 0 0 0 1px rgba(245,239,230,.05);
  isolation:isolate;
}
.panel-cinema img{
  position:absolute; inset:-8%; width:116%; height:116%;
  object-fit:cover; object-position:center;
  transform:scale(1.06);
  transition:transform 1.4s var(--ease-out);
  will-change:transform;
}
.panel-cinema:hover img{ transform:scale(1.12); }
.panel-cinema::before{
  content:''; position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(180deg, rgba(11,11,12,.15) 0%, rgba(11,11,12,.0) 35%, rgba(11,11,12,.85) 100%),
    radial-gradient(120% 80% at 80% 0%, rgba(200,16,46,.18), transparent 60%);
}
.panel-cinema-grain{
  position:absolute; inset:0; z-index:2; pointer-events:none; opacity:.18; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}
.panel-cinema-overlay{
  position:absolute; left:0; right:0; bottom:0; z-index:3;
  display:flex; justify-content:space-between; align-items:flex-end;
  padding:30px 32px; gap:24px;
  color:var(--washi);
}
.pc-jp{
  font-family:var(--jp); font-weight:700;
  font-size:clamp(64px, 9vw, 130px); line-height:.9;
  color:rgba(245,239,230,.92); letter-spacing:-.04em;
  text-shadow:0 6px 30px rgba(0,0,0,.5);
}
.pc-tag{
  font-size:11px; font-weight:700; letter-spacing:.3em;
  padding:8px 14px; border:1px solid rgba(245,239,230,.4);
  border-radius:999px; backdrop-filter:blur(10px);
  background:rgba(11,11,12,.4); white-space:nowrap;
}

@media (max-width:700px){
  .panel-cinema{ height:280px; margin-bottom:32px; }
  .panel-cinema-overlay{ padding:18px 20px; flex-direction:column; align-items:flex-start; gap:12px; }
}

/* =====================================================
   SIGNATURES — Horizontal-pinned scroll (Framer-style)
   ===================================================== */
.signatures{
  position:relative;
  background:var(--sumi); color:var(--washi);
  /* total scroll length controls horizontal travel — set in JS-driven inline OR fixed long height */
  height:560vh;
}
.sig-sticky{
  position:sticky; top:0; height:100vh;
  display:flex; flex-direction:column;
  overflow:hidden;
}
.sig-head{
  position:relative; z-index:5;
  padding:28px clamp(20px,4vw,56px) 18px;
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:30px;
  border-bottom:1px solid rgba(245,239,230,.1);
}
.sig-head .eyebrow{ color:rgba(245,239,230,.6); }
.sig-head .eyebrow .bar{ background:var(--akane); }
.sig-title{
  font-family:var(--display); font-weight:600; letter-spacing:-.02em;
  font-size:clamp(22px, 2.4vw, 38px); line-height:1.1;
}
.sig-title em{ font-style:italic; font-weight:400; }
.sig-title .akane{ color:var(--sake); }
.sig-progress{
  width:240px; height:2px; background:rgba(245,239,230,.12); border-radius:2px; overflow:hidden;
  justify-self:end;
}
.sig-progress-fill{ width:0%; height:100%; background:var(--akane); transition:width .15s linear; }

.sig-track{
  flex:1; display:flex; gap:24px; align-items:center;
  padding:40px clamp(20px,4vw,56px);
  will-change:transform;
}
.sig-card{
  flex:0 0 auto; width:min(82vw, 720px); height:72vh;
  display:grid; grid-template-rows:1fr auto;
  background:var(--sumi-soft); border-radius:14px;
  border:1px solid rgba(245,239,230,.08);
  overflow:hidden; position:relative;
  transition:transform .6s var(--ease), border-color .4s;
}
.sig-card:hover{ border-color:rgba(200,16,46,.4); }
.sig-img{ position:relative; overflow:hidden; }
.sig-img img{
  width:100%; height:100%; object-fit:cover;
  transform:scale(1.04); transition:transform 1s var(--ease-out);
  filter:saturate(1.05) contrast(1.04);
}
.sig-card:hover .sig-img img{ transform:scale(1.1); }
.sig-img::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 50%, rgba(11,11,12,.6) 100%);
}
.sig-meta{
  padding:22px 26px; display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto auto;
  gap:6px 16px; align-items:start;
}
.sig-num{
  grid-row:span 3; font-size:11px; letter-spacing:.32em; font-weight:700;
  color:var(--akane); writing-mode:vertical-rl; transform:rotate(180deg); align-self:stretch;
  padding-top:4px;
}
.sig-meta h3{ font-family:var(--display); font-size:30px; font-weight:600; letter-spacing:-.01em; }
.sig-meta p{ font-size:14px; line-height:1.55; color:rgba(245,239,230,.65); }
.sig-foot{
  display:flex; justify-content:space-between; align-items:baseline; gap:14px;
  margin-top:14px; padding-top:14px; border-top:1px solid rgba(245,239,230,.1);
}
.sig-foot span{ font-size:11px; letter-spacing:.24em; font-weight:600; color:rgba(245,239,230,.5); }
.sig-foot strong{ font-family:var(--display); font-size:26px; font-weight:600; }
.sig-foot small{ font-size:11px; color:rgba(245,239,230,.5); margin-left:4px; letter-spacing:.18em; }

.sig-card-final{ background:linear-gradient(160deg, var(--shoyu), var(--sumi-soft)); }

.sig-end{
  flex:0 0 auto; width:min(60vw, 520px); height:72vh;
  display:flex; flex-direction:column; justify-content:center; align-items:flex-start;
  gap:24px; padding:40px;
  background:var(--akane); color:var(--washi); border-radius:14px;
  position:relative; overflow:hidden;
  transition:transform .5s var(--ease);
}
.sig-end:hover{ transform:translateY(-6px); }
.sig-end-jp{ font-family:var(--jp); font-weight:700; font-size:120px; line-height:.85; opacity:.18; position:absolute; right:-10px; bottom:-30px; }
.sig-end-title{ font-family:var(--display); font-weight:500; font-size:48px; letter-spacing:-.02em; line-height:1.05; max-width:340px; position:relative; z-index:2; }
.sig-end-cta{
  display:inline-flex; align-items:center; gap:8px;
  padding:14px 22px; background:var(--sumi); color:var(--washi); border-radius:999px;
  font-size:13.5px; font-weight:600; letter-spacing:.04em;
  position:relative; z-index:2;
  transition:transform .3s var(--ease);
}
.sig-end:hover .sig-end-cta{ transform:translateX(6px); }

.sig-rail{
  display:flex; align-items:center; gap:16px;
  padding:18px clamp(20px,4vw,56px);
  border-top:1px solid rgba(245,239,230,.1);
  font-size:10px; letter-spacing:.34em; font-weight:700; color:rgba(245,239,230,.5);
}
.sig-rail-bar{
  flex:1; height:1px; background:rgba(245,239,230,.12); position:relative; overflow:hidden;
}
.sig-rail-bar #sigRail{
  position:absolute; left:0; top:0; height:100%; width:8%; background:var(--akane);
  transition:left .15s linear, width .15s;
}

@media (max-width:900px){
  .signatures{ height:auto; }
  .sig-sticky{ position:static; height:auto; }
  .sig-head{ grid-template-columns:1fr; gap:14px; }
  .sig-progress{ display:none; }
  .sig-track{
    flex:none; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory;
    transform:none !important;
    -webkit-overflow-scrolling:touch;
  }
  .sig-card, .sig-end{ width:88vw; height:560px; scroll-snap-align:start; }
  .sig-rail{ display:none; }
}

/* =====================================================
   CRAFT — sticky scroll storytelling
   ===================================================== */
.craft{
  background:var(--washi); color:var(--ink);
  padding:140px 0;
  position:relative;
}
.craft-grid{
  max-width:1400px; margin:0 auto;
  padding:0 clamp(20px,4vw,56px);
  display:grid; grid-template-columns:1fr 1fr; gap:80px;
  align-items:flex-start;
}
.craft-text{ padding-top:20px; }
.craft-text .section-title em{ font-style:italic; font-weight:400; }
.craft-text .section-lede{ margin-bottom:40px; }

.craft-steps{
  display:flex; flex-direction:column; gap:24px;
}
.craft-step{
  display:grid; grid-template-columns:80px 1fr; gap:18px;
  padding:30px 0; border-top:1px solid var(--line);
  opacity:.32; transition:opacity .6s var(--ease);
  cursor:pointer;
}
.craft-step:last-child{ border-bottom:1px solid var(--line); }
.craft-step.is-active{ opacity:1; }
.cs-num{
  font-family:var(--display); font-weight:600; font-size:38px; line-height:1;
  color:var(--akane); letter-spacing:-.02em;
  transition:transform .5s var(--ease);
}
.craft-step.is-active .cs-num{ transform:translateX(8px); }
.craft-step h3{ font-family:var(--display); font-size:32px; font-weight:600; letter-spacing:-.01em; margin-bottom:8px; }
.craft-step p{ font-size:15px; line-height:1.65; color:rgba(11,11,12,.7); }

.craft-stage{
  position:sticky; top:90px;
  aspect-ratio:4/5; max-height:78vh;
}
.craft-frame{
  position:relative; width:100%; height:100%;
  border-radius:16px; overflow:hidden;
  background:var(--sumi);
  box-shadow:0 50px 100px -30px rgba(11,11,12,.5);
}
.craft-img{
  position:absolute; inset:0;
  opacity:0; transform:scale(1.06);
  transition:opacity .9s var(--ease-out), transform 1.6s var(--ease-out);
  pointer-events:none;
}
.craft-img.is-active{
  opacity:1; transform:scale(1);
}
.craft-img img{
  width:100%; height:100%; object-fit:cover;
  filter:saturate(1.05) contrast(1.05);
}
.craft-img::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 40%, rgba(11,11,12,.55) 100%);
}
.craft-counter{
  position:absolute; left:24px; top:24px; z-index:3;
  font-family:var(--display); font-size:38px; font-weight:600; color:var(--washi);
  display:flex; align-items:baseline; gap:6px; letter-spacing:-.02em;
}
.craft-counter i{ font-style:normal; opacity:.4; font-size:24px; }
.craft-counter span:last-child{ opacity:.6; font-size:24px; }
.craft-jp{
  position:absolute; right:24px; bottom:18px; z-index:3;
  font-family:var(--jp); font-weight:700; font-size:80px; line-height:.85;
  color:var(--washi); letter-spacing:-.04em;
  text-shadow:0 6px 30px rgba(0,0,0,.4);
  transition:opacity .6s, transform .6s var(--ease-out);
}

@media (max-width:1000px){
  .craft-grid{ grid-template-columns:1fr; gap:50px; }
  .craft-stage{ position:relative; top:0; max-height:none; aspect-ratio:1; }
}

/* =====================================================
   QUOTE
   ===================================================== */
.quote{
  position:relative; padding:160px clamp(20px,4vw,56px); text-align:center;
  background:var(--kome); overflow:hidden;
}
.quote-kanji{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  font-family:var(--jp); font-weight:700; color:rgba(200,16,46,.07);
  font-size:clamp(380px, 50vw, 720px); pointer-events:none; user-select:none; line-height:.85;
}
.quote-text{
  position:relative; max-width:1100px; margin:0 auto;
  font-family:var(--display); font-style:italic; font-weight:400;
  font-size:clamp(36px, 5.4vw, 78px); line-height:1.2; letter-spacing:-.02em;
  color:var(--ink);
}
.quote-text [data-split]{
  display:inline-block; transform:translateY(110%); opacity:0;
  transition:transform .9s var(--ease-out), opacity .9s var(--ease-out);
  margin:0 .12em;
}
.quote-text.is-in [data-split]{ transform:translateY(0); opacity:1; }
.quote-author{ position:relative; margin-top:32px; font-size:13px; letter-spacing:.32em; font-weight:600; color:rgba(11,11,12,.55); }

/* =====================================================
   DELIVERY
   ===================================================== */
.delivery{ padding:140px clamp(20px,4vw,56px); background:var(--washi); }
.delivery-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center;
}
.delivery-bullets{
  display:flex; flex-direction:column; gap:12px; margin:32px 0 36px;
}
.delivery-bullets li{
  display:grid; grid-template-columns:60px 1fr; gap:18px; align-items:baseline;
  padding:14px 0; border-top:1px solid var(--line); font-size:15.5px;
}
.delivery-bullets li:last-child{ border-bottom:1px solid var(--line); }
.b-num{ font-family:var(--display); font-size:18px; font-weight:600; color:var(--akane); }
.delivery-bullets li strong{ font-family:var(--display); font-weight:600; font-size:18px; margin-right:8px; }

/* =====================================================
   MAP — Senior cinematic SVG (Alger delivery zone)
   ===================================================== */
.delivery-visual{
  aspect-ratio:1; position:relative;
  perspective:1600px;
}
.map{
  position:relative; width:100%; height:100%;
  border-radius:20px; overflow:hidden;
  background:
    radial-gradient(120% 90% at 30% 20%, #14141a 0%, #0B0B0C 55%, #050506 100%);
  box-shadow:
    0 50px 120px -40px rgba(200,16,46,.35),
    0 30px 80px -30px rgba(0,0,0,.7),
    inset 0 0 0 1px rgba(245,239,230,.06),
    inset 0 60px 120px -40px rgba(200,16,46,.07);
}
.map-tilt{
  position:absolute; inset:0;
  transform-style:preserve-3d;
  transform:rotateX(8deg) rotateY(-6deg);
  transition:transform .9s var(--ease-out);
  will-change:transform;
}
.map:hover .map-tilt{ transform:rotateX(4deg) rotateY(-3deg); }

/* base SVG */
.map-svg{
  position:absolute; inset:0; width:100%; height:100%;
  display:block;
}

/* topographic ellipses (concentric ground contours) */
.map-topo ellipse{
  fill:none; stroke:rgba(245,239,230,.05); stroke-width:.6;
}

/* coordinate cross-hairs */
.map-cross line{
  stroke:rgba(245,239,230,.06); stroke-width:.6; stroke-dasharray:3 6;
}

/* radar rings */
.map-rings circle{
  fill:none; stroke:rgba(200,16,46,.18); stroke-width:.7;
  stroke-dasharray:2 6;
  animation:ringBreathe 6s ease-in-out infinite;
}
.map-rings circle:nth-child(2){ animation-delay:1s; opacity:.7; }
.map-rings circle:nth-child(3){ animation-delay:2s; opacity:.45; }
@keyframes ringBreathe{
  0%,100%{ stroke-opacity:.18; }
  50%{ stroke-opacity:.42; }
}

/* radar sweep wedge */
.map-sweep{ transform-origin:500px 510px; }

/* routes */
.map-routes .route{
  fill:none;
  stroke:url(#routeGrad);
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-dasharray:6 8;
  animation:routeFlow 1.4s linear infinite;
}
@keyframes routeFlow{ to{ stroke-dashoffset:-14; } }

/* pulse aura around HQ — not on the disc, but a static glow already from gradient */

/* === HTML labels === */
.map-labels{ position:absolute; inset:0; pointer-events:none; }
.m-label{
  position:absolute; transform:translate(-50%,-50%);
  display:flex; flex-direction:column; gap:4px;
  pointer-events:auto;
  animation:labelIn .8s var(--ease-out) both;
}
.m-label[data-side="right"]{ transform:translate(8%,-50%); align-items:flex-start; }
.m-label[data-side="left"]{  transform:translate(-108%,-50%); align-items:flex-end; text-align:right; }
@keyframes labelIn{ from{ opacity:0; transform:translate(-50%,-40%); } }

.m-label .ml-name{
  font-family:var(--display); font-size:18px; font-weight:600; color:var(--washi);
  letter-spacing:-.005em; line-height:1;
  padding:7px 12px; background:rgba(11,11,12,.78);
  border:1px solid rgba(245,239,230,.16);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border-radius:6px;
  position:relative;
}
.m-label[data-side="right"] .ml-name{ border-left:2px solid var(--akane); padding-left:12px; }
.m-label[data-side="left"]  .ml-name{ border-right:2px solid var(--akane); padding-right:12px; }
.m-label .ml-eta{
  font-size:10px; letter-spacing:.18em; font-weight:600;
  color:rgba(245,239,230,.6); text-transform:uppercase;
  padding:0 4px;
}

/* HQ label */
.m-hq{ transform:translate(-50%,-160%); align-items:center; }
.m-hq .ml-pill{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 14px; border-radius:999px;
  background:var(--akane); color:var(--washi);
  font-family:var(--sans); font-size:12px; font-weight:700; letter-spacing:.06em;
  box-shadow:0 12px 30px -10px rgba(200,16,46,.6);
  white-space:nowrap;
}
.m-hq .ml-pill em{ font-style:normal; opacity:.8; font-weight:500; }
.m-hq .ml-pill .ml-dot{
  width:6px; height:6px; background:var(--washi); border-radius:50%;
  box-shadow:0 0 0 3px rgba(245,239,230,.3);
  animation:pulse 1.6s infinite;
}
.m-hq .ml-sub{
  font-size:9.5px; letter-spacing:.32em; font-weight:600;
  color:rgba(245,239,230,.5); text-transform:uppercase;
}

/* === HUD chrome === */
.map-hud{
  position:absolute; z-index:5; pointer-events:none;
  font-family:var(--sans); color:var(--washi);
}
.map-hud-tl{ top:18px; left:18px; display:flex; align-items:center; gap:10px; padding:8px 12px;
  border:1px solid rgba(245,239,230,.14); border-radius:999px; background:rgba(11,11,12,.6); backdrop-filter:blur(8px); }
.map-hud-tl .hud-dot{ width:8px; height:8px; background:#3CFF8E; border-radius:50%; box-shadow:0 0 0 4px rgba(60,255,142,.18); animation:pulse 1.4s infinite; }
.hud-text{ font-size:10px; letter-spacing:.32em; font-weight:700; }
.hud-text.dim{ color:rgba(245,239,230,.55); }
.hud-title{
  display:block; font-size:9.5px; letter-spacing:.34em; font-weight:700;
  color:rgba(245,239,230,.55); margin-bottom:8px;
}

/* compass */
.map-hud-tr{ top:14px; right:14px; }
.compass{
  width:72px; height:72px; border-radius:50%;
  border:1px solid rgba(245,239,230,.16);
  background:rgba(11,11,12,.6); backdrop-filter:blur(8px);
  position:relative;
}
.compass span{
  position:absolute; left:50%; transform:translateX(-50%);
  font-size:9px; letter-spacing:.18em; font-weight:700;
  color:rgba(245,239,230,.7);
}
.compass .cx-n{ top:6px; color:var(--akane); }
.compass .cx-s{ bottom:6px; }
.compass .cx-e{ top:50%; right:6px; left:auto; transform:translateY(-50%); }
.compass .cx-w{ top:50%; left:6px; transform:translateY(-50%); }
.cx-needle{
  position:absolute; left:50%; top:50%; width:2px; height:24px;
  background:linear-gradient(var(--akane), transparent);
  transform-origin:center bottom; transform:translate(-50%,-100%) rotate(0deg);
  animation:needleSpin 12s linear infinite;
}
.cx-needle::before{
  content:''; position:absolute; left:50%; bottom:-2px; width:6px; height:6px;
  background:var(--akane); border-radius:50%; transform:translateX(-50%);
  box-shadow:0 0 0 3px rgba(200,16,46,.25);
}
@keyframes needleSpin{ to{ transform:translate(-50%,-100%) rotate(360deg); } }

/* scale bar */
.map-hud-bl{ bottom:18px; left:18px; display:flex; align-items:center; gap:12px; }
.scale-bar{
  width:80px; height:6px; position:relative;
  border-left:1px solid rgba(245,239,230,.5);
  border-right:1px solid rgba(245,239,230,.5);
}
.scale-bar::before{
  content:''; position:absolute; left:0; right:0; top:50%;
  height:1px; background:rgba(245,239,230,.4);
}
.scale-bar span{
  position:absolute; left:0; top:50%; height:1px; width:50%;
  background:var(--akane);
}

/* ETA leaderboard */
.map-hud-br{
  bottom:18px; right:18px; pointer-events:auto;
  padding:14px 16px; border-radius:12px;
  background:rgba(11,11,12,.72); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(245,239,230,.1);
  min-width:200px;
  box-shadow:0 20px 40px -20px rgba(0,0,0,.6);
}
.eta-list{ display:flex; flex-direction:column; gap:8px; }
.eta-list li{
  display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:center;
  font-size:12px; font-weight:500;
}
.eta-d{
  width:6px; height:6px; background:var(--akane); border-radius:50%;
  box-shadow:0 0 0 3px rgba(200,16,46,.2);
  animation:pulse 1.8s infinite;
}
.eta-list li:nth-child(1) .eta-d{ animation-delay:0s; }
.eta-list li:nth-child(2) .eta-d{ animation-delay:.3s; }
.eta-list li:nth-child(3) .eta-d{ animation-delay:.6s; }
.eta-list li:nth-child(4) .eta-d{ animation-delay:.9s; }
.eta-list li:nth-child(5) .eta-d{ animation-delay:1.2s; }
.eta-name{ color:var(--washi); }
.eta-list em{ font-style:normal; font-family:var(--display); font-weight:600; font-size:14px; color:var(--akane); }

@media (max-width:1000px){
  .delivery-grid{ grid-template-columns:1fr; gap:50px; }
  .delivery-visual{ max-width:560px; margin:0 auto; }
  .map-tilt{ transform:none; }
  .map:hover .map-tilt{ transform:none; }
}
@media (max-width:560px){
  .map-hud-tr{ display:none; }
  .map-hud-br{ position:static; margin-top:14px; backdrop-filter:none; background:rgba(11,11,12,.92); }
  .delivery-visual{ aspect-ratio:auto; }
  .map{ aspect-ratio:1; }
  .m-label .ml-name{ font-size:13px; padding:5px 9px; }
  .m-label .ml-eta{ display:none; }
}

/* =====================================================
   CTA
   ===================================================== */
.cta{ position:relative; padding:160px clamp(20px,4vw,56px); background:var(--sumi); color:var(--washi); overflow:hidden; }
.cta-bg{
  position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(circle at 80% 20%, rgba(200,16,46,.25) 0%, transparent 45%),
    radial-gradient(circle at 10% 90%, rgba(139,15,30,.4) 0%, transparent 50%);
}
.cta-inner{ position:relative; max-width:1100px; margin:0 auto; text-align:center; }
.cta .eyebrow{ justify-content:center; margin-bottom:28px; }
.cta-title{
  font-family:var(--display); font-weight:600;
  font-size:clamp(54px, 8vw, 130px); line-height:.96; letter-spacing:-.03em;
}
.cta-title em{ font-style:italic; font-weight:400; }
.cta-title .kome{ color:var(--kome); }
.cta-sub{ margin:28px auto 56px; font-size:18px; color:rgba(245,239,230,.7); max-width:520px; }

.cta-channels{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:16px;
  max-width:980px; margin:0 auto;
}
.channel{
  display:flex; align-items:center; gap:18px;
  padding:24px 22px; border:1px solid rgba(245,239,230,.14); border-radius:12px;
  text-align:left;
  transition:border-color .4s, background .4s, transform .4s;
}
.channel:hover{ border-color:var(--akane); background:rgba(200,16,46,.06); transform:translateY(-4px); }
.channel-ic{ width:46px; height:46px; flex:0 0 46px; border:1px solid rgba(245,239,230,.18); border-radius:50%; display:grid; place-items:center; color:var(--akane); transition:background .4s, color .4s; }
.channel:hover .channel-ic{ background:var(--akane); color:var(--washi); border-color:var(--akane); }
.channel-ic svg{ width:20px; height:20px; }
.channel-meta{ flex:1; display:flex; flex-direction:column; gap:4px; }
.channel-label{ font-size:10px; letter-spacing:.32em; font-weight:700; color:rgba(245,239,230,.55); }
.channel-value{ font-family:var(--display); font-size:20px; font-weight:600; }
.channel-arrow{ font-size:20px; color:rgba(245,239,230,.5); transition:transform .3s, color .3s; }
.channel:hover .channel-arrow{ transform:translateX(6px); color:var(--washi); }

.cta-hours{
  margin-top:80px; padding-top:36px; border-top:1px solid rgba(245,239,230,.12);
  display:grid; grid-template-columns:repeat(3, 1fr); gap:18px; max-width:760px; margin-inline:auto;
}
.cta-hours > div{ display:flex; flex-direction:column; gap:6px; padding:8px 0; }
.cta-hours span{ font-size:10px; letter-spacing:.34em; font-weight:700; color:rgba(245,239,230,.5); }
.cta-hours strong{ font-family:var(--display); font-size:20px; font-weight:500; }

@media (max-width:900px){
  .cta-channels, .cta-hours{ grid-template-columns:1fr; }
}

/* =====================================================
   FOOTER
   ===================================================== */
.footer{
  position:relative; background:var(--kome); padding:80px clamp(20px,4vw,56px) 0;
  overflow:hidden;
}
.footer-top{
  display:grid; grid-template-columns:1.2fr 2fr; gap:60px;
  padding-bottom:50px; border-bottom:1px solid var(--line);
}
.footer-brand{ display:flex; gap:18px; align-items:flex-start; }
.footer-mark{ width:54px; height:54px; flex:0 0 54px; }
.footer-brand h3{ font-family:var(--display); font-size:24px; font-weight:600; }
.footer-brand p{ margin-top:8px; font-size:14px; font-style:italic; color:rgba(11,11,12,.65); max-width:320px; }

.footer-cols{ display:grid; grid-template-columns:repeat(3, 1fr); gap:30px; }
.footer-cols h5{ font-size:11px; font-weight:700; letter-spacing:.32em; text-transform:uppercase; margin-bottom:16px; color:rgba(11,11,12,.6); }
.footer-cols a, .footer-cols span{ display:block; font-size:14.5px; padding:6px 0; color:var(--ink); }
.footer-cols a{ transition:color .3s, transform .3s; }
.footer-cols a:hover{ color:var(--akane); transform:translateX(3px); }
.footer-cols .off{ color:rgba(11,11,12,.5); }

.footer-bottom{
  display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap;
  padding:30px 0;
  font-size:12px; letter-spacing:.04em; color:rgba(11,11,12,.6);
  border-bottom:1px solid var(--line);
  position:relative; z-index:2;
}
.footer-bottom .jp{ font-family:var(--jp); letter-spacing:.06em; }

.footer-jumbo{
  font-family:var(--display); font-weight:600;
  font-size:clamp(110px, 22vw, 320px); line-height:.85;
  text-align:center; letter-spacing:-.04em;
  color:transparent;
  -webkit-text-stroke:1px rgba(11,11,12,.18);
  margin:30px 0 -40px;
  user-select:none;
}

@media (max-width:900px){
  .footer-top{ grid-template-columns:1fr; }
  .footer-cols{ grid-template-columns:1fr 1fr; }
}

/* =====================================================
   REVEAL ANIMATIONS
   ===================================================== */
[data-reveal]{ opacity:0; transform:translateY(40px); transition:opacity 1s var(--ease-out), transform 1s var(--ease-out); }
[data-reveal].is-in{ opacity:1; transform:none; }
[data-reveal]:nth-child(1){ transition-delay:.05s; }
[data-reveal]:nth-child(2){ transition-delay:.10s; }
[data-reveal]:nth-child(3){ transition-delay:.15s; }
[data-reveal]:nth-child(4){ transition-delay:.20s; }
[data-reveal]:nth-child(5){ transition-delay:.25s; }
[data-reveal]:nth-child(6){ transition-delay:.30s; }
[data-reveal]:nth-child(7){ transition-delay:.35s; }

/* =====================================================
   LEAD FORM MODAL — order flow
   ===================================================== */
.lead-modal{
  position:fixed; inset:0; z-index:9800;
  display:flex; align-items:center; justify-content:center;
  padding:clamp(0px, 3vw, 32px);
  opacity:0; visibility:hidden;
  transition:opacity .45s var(--ease), visibility .45s;
}
.lead-modal.is-open{ opacity:1; visibility:visible; }
.lead-backdrop{
  position:absolute; inset:0;
  background:rgba(11,11,12,.74);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
}
.lead-shell{
  position:relative; z-index:2;
  width:min(1100px, 100%); max-height:min(94vh, 900px);
  background:var(--washi); color:var(--ink);
  border-radius:18px; overflow:hidden;
  display:grid; grid-template-rows:auto 1fr;
  box-shadow:
    0 60px 140px -40px rgba(0,0,0,.6),
    0 0 0 1px rgba(11,11,12,.08);
  transform:translateY(20px) scale(.98);
  transition:transform .55s var(--ease-out);
}
.lead-modal.is-open .lead-shell{ transform:none; }

.lead-head{
  display:flex; justify-content:space-between; align-items:flex-start; gap:24px;
  padding:24px 28px 18px;
  border-bottom:1px solid var(--line);
  background:var(--washi);
}
.lead-head-meta h2{
  font-family:var(--display); font-weight:600; font-size:clamp(24px, 2.8vw, 36px);
  letter-spacing:-.02em; line-height:1.05; margin:8px 0 6px;
}
.lead-head-meta h2 em{ font-style:italic; font-weight:400; color:var(--akane); }
.lead-head-meta p{ font-size:13px; color:rgba(11,11,12,.6); }
.lead-eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-size:11px; font-weight:700; letter-spacing:.32em; text-transform:uppercase;
  color:rgba(11,11,12,.65);
}
.lead-eyebrow .bar{ width:32px; height:1px; background:var(--akane); }

.lead-close{
  width:42px; height:42px; flex:0 0 42px; border-radius:50%;
  border:1px solid var(--line-strong); color:var(--ink);
  display:grid; place-items:center;
  transition:background .35s var(--ease), color .35s, transform .35s, border-color .35s;
}
.lead-close svg{ width:18px; height:18px; }
.lead-close:hover{ background:var(--sumi); color:var(--washi); border-color:var(--sumi); transform:rotate(90deg); }

.lead-grid{
  display:grid; grid-template-columns:1.35fr 1fr;
  overflow:hidden; min-height:0;
}

/* === LEFT: catalog === */
.lead-catalog{
  display:flex; flex-direction:column;
  border-right:1px solid var(--line);
  min-height:0;
}
.lead-tabs{
  position:relative; display:flex;
  border-bottom:1px solid var(--line);
  padding:0 12px;
  background:var(--washi);
}
.lt-tab{
  flex:1; padding:16px 8px;
  display:flex; flex-direction:column; align-items:center; gap:4px;
  font-size:13px; font-weight:600; letter-spacing:.04em;
  color:rgba(11,11,12,.5);
  transition:color .3s var(--ease);
}
.lt-tab.is-active{ color:var(--ink); }
.lt-jp{
  font-family:var(--jp); font-weight:700; font-size:11px;
  color:var(--akane); letter-spacing:.05em;
  opacity:.5; transition:opacity .3s;
}
.lt-tab.is-active .lt-jp{ opacity:1; }
.lt-indicator{
  position:absolute; bottom:-1px; height:2px; background:var(--akane);
  transition:left .5s var(--ease-out), width .5s var(--ease-out);
  pointer-events:none;
}

.lead-items{
  flex:1; overflow-y:auto; min-height:0;
  padding:14px 18px 24px;
  scrollbar-width:thin; scrollbar-color:var(--line-strong) transparent;
}
.lead-items::-webkit-scrollbar{ width:6px; }
.lead-items::-webkit-scrollbar-thumb{ background:var(--line-strong); border-radius:3px; }

.li-row{
  display:grid; grid-template-columns:1fr auto auto; gap:18px; align-items:center;
  padding:14px 4px; border-bottom:1px solid var(--line);
  transition:padding .3s var(--ease);
  position:relative;
}
.li-row:last-child{ border-bottom:0; }
.li-row.has-qty{ background:linear-gradient(90deg, rgba(200,16,46,.06), transparent 60%); padding-left:14px; }
.li-row::before{
  content:''; position:absolute; left:0; top:0; bottom:0; width:2px; background:var(--akane);
  transform:scaleY(0); transform-origin:center; transition:transform .35s var(--ease);
}
.li-row.has-qty::before{ transform:scaleY(1); }

.li-info{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.li-name{
  font-family:var(--display); font-size:18px; font-weight:600; letter-spacing:-.005em;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.li-desc{
  font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(11,11,12,.5); font-weight:600;
}
.li-price{
  font-family:var(--display); font-size:18px; font-weight:600;
  color:var(--ink); white-space:nowrap;
}
.li-price small{ font-size:9.5px; font-weight:600; color:rgba(11,11,12,.5); margin-left:3px; letter-spacing:.16em; }

.li-qty{
  display:inline-flex; align-items:center; gap:0;
  border:1px solid var(--line-strong); border-radius:999px;
  background:var(--washi); overflow:hidden;
  transition:border-color .3s, background .3s;
}
.li-qty.has-qty{ border-color:var(--akane); background:rgba(200,16,46,.06); }
.li-qty button{
  width:32px; height:32px; display:grid; place-items:center;
  font-size:18px; font-weight:600; color:var(--ink);
  transition:background .25s, color .25s;
}
.li-qty button:hover{ background:var(--sumi); color:var(--washi); }
.li-qty button[disabled]{ opacity:.3; pointer-events:none; }
.li-qty .qty-val{
  min-width:28px; text-align:center;
  font-family:var(--display); font-size:15px; font-weight:600;
}

/* === RIGHT: cart + form === */
.lead-cart{
  display:flex; flex-direction:column; min-height:0;
  background:var(--kome);
  overflow-y:auto;
}
.lc-head{
  padding:18px 24px 12px;
  border-bottom:1px solid var(--line);
}
.lc-head h3{ font-family:var(--display); font-size:22px; font-weight:600; letter-spacing:-.01em; margin-top:6px; }

.lc-list{
  display:flex; flex-direction:column; gap:8px;
  padding:12px 24px;
  max-height:170px; overflow-y:auto;
}
.lc-list::-webkit-scrollbar{ width:6px; }
.lc-list::-webkit-scrollbar-thumb{ background:var(--line-strong); border-radius:3px; }
.lc-empty{
  text-align:center; font-size:13px; color:rgba(11,11,12,.5);
  padding:20px 0; line-height:1.6;
}
.lc-empty small{ font-size:11px; letter-spacing:.18em; text-transform:uppercase; }

.lc-row{
  display:grid; grid-template-columns:1fr auto auto; gap:10px; align-items:center;
  padding:8px 0; border-bottom:1px dashed rgba(11,11,12,.1);
  font-size:13.5px;
  animation:lcIn .35s var(--ease-out);
}
@keyframes lcIn{ from{ opacity:0; transform:translateX(8px); } to{ opacity:1; transform:none; } }
.lc-row .lc-name{ font-weight:500; line-height:1.3; }
.lc-row .lc-name small{ color:rgba(11,11,12,.5); font-weight:500; margin-left:4px; }
.lc-row .lc-line{
  font-family:var(--display); font-weight:600; font-size:14px;
}
.lc-row .lc-x{
  width:22px; height:22px; border-radius:50%; border:1px solid var(--line);
  display:grid; place-items:center; font-size:14px; color:rgba(11,11,12,.55);
  transition:background .25s, color .25s, border-color .25s;
}
.lc-row .lc-x:hover{ background:var(--akane); color:var(--washi); border-color:var(--akane); }

.lc-total{
  display:flex; justify-content:space-between; align-items:baseline;
  padding:14px 24px; background:var(--sumi); color:var(--washi);
  border-top:1px solid var(--line);
}
.lc-total span{ font-size:11px; letter-spacing:.32em; font-weight:700; color:rgba(245,239,230,.6); }
.lc-total strong{ font-family:var(--display); font-size:30px; font-weight:600; letter-spacing:-.02em; }
.lc-total strong small{ font-size:12px; font-weight:600; color:rgba(245,239,230,.55); margin-left:4px; letter-spacing:.18em; }

.lead-form{
  padding:18px 24px 24px;
  display:flex; flex-direction:column; gap:12px;
}
.lf-field{ display:flex; flex-direction:column; gap:6px; }
.lf-field span{
  font-size:10.5px; letter-spacing:.28em; text-transform:uppercase; font-weight:700;
  color:rgba(11,11,12,.6);
}
.lf-field span em{ font-style:normal; color:var(--akane); margin-left:2px; }
.lf-field input,
.lf-field textarea{
  font:inherit; font-size:14px; padding:11px 14px;
  border:1px solid var(--line-strong); border-radius:8px;
  background:var(--washi); color:var(--ink);
  transition:border-color .25s, box-shadow .25s, background .25s;
  width:100%; resize:vertical;
}
.lf-field input:focus,
.lf-field textarea:focus{
  outline:none;
  border-color:var(--akane);
  box-shadow:0 0 0 3px rgba(200,16,46,.12);
}
.lf-field input.invalid,
.lf-field textarea.invalid{
  border-color:var(--akane); background:rgba(200,16,46,.05);
  animation:shake .35s var(--ease);
}
@keyframes shake{
  0%,100%{ transform:translateX(0); }
  25%{ transform:translateX(-4px); }
  75%{ transform:translateX(4px); }
}

.lf-submit{
  display:inline-flex; justify-content:space-between; align-items:center;
  width:100%; padding:14px 22px; margin-top:6px;
  background:var(--akane); color:var(--washi); border-radius:999px;
  font-weight:700; font-size:14px; letter-spacing:.04em;
  transition:transform .35s var(--ease), background .35s, box-shadow .35s;
  position:relative; overflow:hidden;
}
.lf-submit::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent);
  transform:translateX(-100%); transition:transform .8s var(--ease-out);
}
.lf-submit:hover{ background:var(--shoyu); transform:translateY(-2px); box-shadow:var(--shadow-pop); }
.lf-submit:hover::before{ transform:translateX(100%); }
.lf-submit-arrow{ transition:transform .3s; font-size:18px; }
.lf-submit:hover .lf-submit-arrow{ transform:translateX(6px); }
.lf-submit[disabled]{ background:var(--sumi-soft); pointer-events:none; opacity:.55; }

.lf-meta{ font-size:11px; color:rgba(11,11,12,.55); text-align:center; margin-top:2px; line-height:1.5; }

/* mobile layout */
@media (max-width:900px){
  .lead-modal{ padding:0; }
  .lead-shell{ height:100svh; max-height:100svh; border-radius:0; }
  .lead-grid{ grid-template-columns:1fr; grid-template-rows:1fr auto; }
  .lead-catalog{ border-right:0; border-bottom:1px solid var(--line); min-height:0; }
  .lead-cart{ max-height:55vh; }
  .lc-list{ max-height:120px; }
}
@media (max-width:560px){
  .li-name{ font-size:15px; }
  .li-price{ font-size:15px; }
  .lc-total strong{ font-size:24px; }
}

/* lock body when open */
body.lead-open{ overflow:hidden; }

/* === SUCCESS TOAST === */
.lead-toast{
  position:fixed; bottom:30px; left:50%; transform:translate(-50%, 30px);
  z-index:9900;
  display:flex; align-items:center; gap:14px;
  padding:14px 18px; border-radius:14px;
  background:var(--sumi); color:var(--washi);
  box-shadow:0 30px 60px -20px rgba(0,0,0,.5);
  opacity:0; visibility:hidden;
  transition:opacity .45s var(--ease), transform .55s var(--ease-out), visibility .45s;
  max-width:90vw;
}
.lead-toast.is-show{ opacity:1; visibility:visible; transform:translate(-50%, 0); }
.lead-toast-ic{
  width:40px; height:40px; flex:0 0 40px; border-radius:50%;
  background:#3CFF8E; color:var(--sumi);
  display:grid; place-items:center;
}
.lead-toast-ic svg{ width:20px; height:20px; }
.lead-toast strong{ font-family:var(--display); font-size:16px; font-weight:600; display:block; }
.lead-toast span{ font-size:12px; color:rgba(245,239,230,.7); }

/* =====================================================
   REDUCED MOTION
   ===================================================== */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

/* =====================================================
   HOVER-ONLY EFFECTS — prevent stuck states on touch
   ===================================================== */
@media (hover: none){
  .dish:hover{ padding-left:0; }
  .dish:hover::before{ width:0; }
  .pillar:hover{ background:transparent; }
  .pillar:hover .pillar-num{ transform:none; }
  .pillar:hover .pillar-line{ height:0; }
  .box:hover{ transform:none; border-color:rgba(245,239,230,.08); }
  .box:hover::before{ opacity:0; }
  .channel:hover{ background:transparent; transform:none; border-color:rgba(245,239,230,.14); }
  .channel:hover .channel-ic{ background:transparent; color:var(--akane); border-color:rgba(245,239,230,.18); }
  .footer-cols a:hover{ color:var(--ink); transform:none; }
  .nav-cta:hover{ transform:none; background:var(--sumi); }
  .nav-cta:hover .arrow{ transform:none; }
  .btn:hover{ transform:none; }
  .btn:hover .btn-arrow{ transform:none; }
  .btn-primary:hover{ background:var(--sumi); box-shadow:none; }
  .btn-ghost:hover{ border-color:var(--line-strong); }
  .panel-cinema:hover img{ transform:scale(1.06); }
  .sig-card:hover{ border-color:rgba(245,239,230,.08); }
  .sig-card:hover .sig-img img{ transform:scale(1.04); }
  .map:hover .map-tilt{ transform:none; }
  .lead-close:hover{ background:transparent; color:var(--ink); border-color:var(--line-strong); transform:none; }
  .lf-submit:hover{ background:var(--akane); transform:none; box-shadow:none; }
  .lf-submit:hover .lf-submit-arrow{ transform:none; }
  .li-qty button:hover{ background:transparent; color:var(--ink); }
  .lc-row .lc-x:hover{ background:transparent; color:rgba(11,11,12,.55); border-color:var(--line); }
}

/* =====================================================
   MOBILE STICKY ORDER BAR
   ===================================================== */
.mob-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:850;
  display:none;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  gap:8px;
  background:linear-gradient(180deg, rgba(11,11,12,.0), rgba(11,11,12,.92) 30%);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  pointer-events:none;
  transition:opacity .35s var(--ease), transform .45s var(--ease-out);
  opacity:0; transform:translateY(120%);
}
.mob-bar.is-visible{ opacity:1; transform:none; pointer-events:auto; }
.mob-bar > *{ pointer-events:auto; }
.mob-bar a, .mob-bar button{
  height:52px; border-radius:14px;
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--sans); font-weight:700; font-size:14px; letter-spacing:.04em;
  color:var(--washi);
}
.mob-bar svg{ width:22px; height:22px; }
.mob-bar-call{ width:52px; flex:0 0 52px; background:rgba(245,239,230,.1); border:1px solid rgba(245,239,230,.16); }
.mob-bar-wa{ width:52px; flex:0 0 52px; background:#1FA855; }
.mob-bar-cta{
  flex:1; gap:10px; padding:0 18px;
  background:var(--akane); color:var(--washi);
  box-shadow:0 12px 30px -10px rgba(200,16,46,.6);
}
.mob-bar .mb-dot{ width:6px; height:6px; background:var(--washi); border-radius:50%; box-shadow:0 0 0 4px rgba(245,239,230,.2); animation:pulse 1.4s infinite; }
.mob-bar .mb-arrow{ font-size:18px; }

@media (max-width:900px){
  .mob-bar{ display:flex; }
  /* push footer up a bit so the bar doesn't hide content */
  .footer{ padding-bottom:90px; }
}

/* =====================================================
   MOBILE POLISH (≤ 720px)
   ===================================================== */
@media (max-width:720px){
  /* Section padding — tighter on phones */
  .philosophy, .delivery, .craft{ padding:80px clamp(18px,5vw,28px); }
  .menu{ padding:80px 0 100px; }
  .quote{ padding:90px clamp(18px,5vw,28px); }
  .cta{ padding:90px clamp(18px,5vw,28px); }
  .signatures{ padding-top:0; }
  .footer{ padding-top:60px; }
  .section-head{ margin-bottom:36px; padding:0 clamp(18px,5vw,28px); }

  /* Hero */
  .hero{ padding:110px 22px 70px; gap:30px; min-height:auto; }
  .hero-title{ font-size:clamp(40px, 11vw, 64px); line-height:1.02; }
  .hero-sub{ font-size:15.5px; }
  .hero-actions .btn{ padding:14px 20px; font-size:13.5px; }
  .hero-marquee{ padding:10px 0; }
  .marquee-track{ font-size:14px; gap:32px; animation-duration:22s; }
  .hero-medallion{ max-width:78vw; }
  .hero-eyebrow{ margin-bottom:24px; gap:10px; font-size:10.5px; letter-spacing:.28em; }
  .hero-eyebrow .line{ width:24px; }

  /* Nav */
  .nav{ padding:14px 18px; }
  .nav.is-scrolled{ padding:10px 18px; }
  .nav-logo-text strong{ font-size:16px; }
  .nav-logo-text em{ font-size:9.5px; letter-spacing:.18em; }

  /* Pillars */
  .pillar{ padding:36px 22px 40px; }
  .pillar-num{ font-size:42px; margin-bottom:24px; }
  .pillar h3{ font-size:24px; }

  /* Menu */
  .tab{ padding:18px 12px; min-width:130px; }
  .tab-name{ font-size:18px; }
  .tab-meta{ font-size:9.5px; letter-spacing:.18em; }
  .panel-head{ padding-bottom:20px; margin-bottom:20px; }
  .panel-head h3{ font-size:30px; }
  .panel-head p{ font-size:13.5px; }
  .panel-jp{ font-size:48px !important; }

  .panel-cinema{ height:220px; margin-bottom:24px; border-radius:10px; }
  .panel-cinema-overlay{ padding:14px 16px; }
  .pc-jp{ font-size:46px; }
  .pc-tag{ font-size:9.5px; letter-spacing:.22em; padding:6px 10px; }

  .dish{ padding:18px 0; gap:10px; grid-template-columns:46px 1fr auto; }
  .dish-num{ font-size:9.5px; letter-spacing:.16em; }
  .dish-name{ font-size:17px; }
  .dish-price{ font-size:18px; }
  .dish-name .badge{ display:none; }
  .dish-signature .dish-name::after{ content:' ★'; color:var(--sake); }

  /* Box */
  .boxes{ gap:14px; }
  .box{ padding:24px 20px; gap:18px; }
  .box-head h4{ font-size:28px; }
  .box-deluxe .box-head h4{ font-size:36px; }
  .box-price{ font-size:26px; }
  .box-cta{ padding:9px 12px; font-size:12px; }

  /* Signatures gallery */
  .sig-head{ padding:18px 22px 14px; }
  .sig-title{ font-size:18px; }
  .sig-track{ padding:24px 18px; gap:16px; }
  .sig-card{ width:78vw; height:auto; }
  .sig-img{ aspect-ratio:4/3; }
  .sig-meta{ padding:18px 20px; }
  .sig-meta h3{ font-size:24px; }
  .sig-meta p{ font-size:13px; }
  .sig-foot strong{ font-size:22px; }
  .sig-end{ width:80vw; height:auto; padding:30px 26px; }
  .sig-end-title{ font-size:30px; }
  .sig-end-cta{ padding:12px 18px; font-size:12.5px; }

  /* Craft */
  .craft-stage{ aspect-ratio:4/5; max-height:none; }
  .craft-step{ padding:22px 0; gap:12px; grid-template-columns:50px 1fr; }
  .cs-num{ font-size:28px; }
  .craft-step h3{ font-size:24px; }
  .craft-step p{ font-size:14px; }
  .craft-counter{ font-size:30px; left:18px; top:18px; }
  .craft-jp{ font-size:54px; right:18px; bottom:14px; }

  /* Quote */
  .quote-text{ font-size:clamp(28px, 8vw, 42px); }
  .quote-author{ font-size:11px; letter-spacing:.24em; margin-top:24px; }

  /* Delivery / Map */
  .delivery-grid{ gap:36px; }
  .delivery-bullets{ gap:8px; margin:24px 0 28px; }
  .delivery-bullets li{ grid-template-columns:42px 1fr; gap:12px; padding:12px 0; font-size:14px; }
  .b-num{ font-size:15px; }
  .delivery-bullets li strong{ font-size:15px; }

  .map-hud-tl{ padding:6px 10px; }
  .hud-text{ font-size:9px; letter-spacing:.22em; }
  .map-hud-tr{ display:none; }
  .map-hud-bl{ display:none; }
  .map-hud-br{
    position:absolute; bottom:14px; left:14px; right:14px;
    padding:10px 12px; min-width:0; border-radius:8px;
  }
  .hud-title{ font-size:8.5px; letter-spacing:.24em; margin-bottom:6px; }
  .eta-list li{ grid-template-columns:auto 1fr auto; gap:8px; font-size:11px; }
  .eta-list em{ font-size:12px; }
  .m-label .ml-name{ font-size:12px; padding:4px 8px; line-height:1; }
  .m-label .ml-eta{ display:none; }
  .m-hq{ transform:translate(-50%, -180%); }
  .m-hq .ml-pill{ padding:6px 11px; font-size:10.5px; letter-spacing:.04em; }
  .m-hq .ml-sub{ display:none; }

  /* CTA */
  .cta-title{ font-size:clamp(40px, 12vw, 64px); }
  .cta-sub{ font-size:15px; margin:20px auto 36px; }
  .channel{ padding:18px 16px; gap:14px; }
  .channel-ic{ width:38px; height:38px; flex-basis:38px; }
  .channel-value{ font-size:17px; }
  .cta-hours{ margin-top:50px; padding-top:24px; gap:14px; }
  .cta-hours strong{ font-size:17px; }

  /* Footer */
  .footer-top{ padding-bottom:36px; gap:40px; }
  .footer-cols{ gap:24px; }
  .footer-cols h5{ margin-bottom:10px; font-size:10px; letter-spacing:.24em; }
  .footer-bottom{ padding:24px 0; font-size:11px; flex-direction:column; align-items:flex-start; gap:8px; }
  .footer-jumbo{ font-size:24vw; margin:20px 0 -20px; }

  /* === Lead modal — touch-friendly === */
  .lead-shell{ height:100svh; max-height:100svh; border-radius:0; }
  .lead-head{ padding:18px 20px 14px; gap:14px; }
  .lead-head-meta h2{ font-size:22px; }
  .lead-head-meta p{ font-size:12px; }
  .lead-eyebrow{ font-size:10px; letter-spacing:.24em; }
  .lead-close{ width:38px; height:38px; flex-basis:38px; }

  .lead-tabs{ padding:0 6px; }
  .lt-tab{ padding:14px 4px; font-size:12px; gap:3px; }
  .lt-jp{ font-size:10px; }

  .lead-items{ padding:8px 14px 16px; }
  .li-row{ grid-template-columns:1fr auto; grid-template-rows:auto auto; gap:6px 12px; padding:14px 4px; }
  .li-info{ grid-column:1; grid-row:1; }
  .li-price{ grid-column:2; grid-row:1; align-self:start; font-size:16px; }
  .li-qty{ grid-column:1 / -1; grid-row:2; justify-self:start; }
  .li-name{ font-size:15.5px; }
  .li-desc{ font-size:10px; letter-spacing:.14em; }
  .li-qty button{ width:42px; height:42px; font-size:20px; }
  .li-qty .qty-val{ min-width:36px; font-size:16px; }

  .lead-cart{ max-height:none; }
  .lc-head{ padding:14px 20px 10px; }
  .lc-list{ padding:10px 20px; max-height:none; }
  .lc-row{ font-size:13px; gap:8px; }
  .lc-row .lc-x{ width:28px; height:28px; font-size:16px; }
  .lc-total{ padding:14px 20px; }
  .lc-total strong{ font-size:24px; }
  .lead-form{ padding:14px 20px 22px; gap:10px; }
  .lf-field input, .lf-field textarea{ font-size:16px; padding:13px 14px; }  /* iOS no-zoom */
  .lf-submit{ padding:15px 22px; font-size:14px; }

  /* Cursor + custom interactions off (already disabled but make sure) */
  .cursor{ display:none !important; }
}

/* Tiny phones */
@media (max-width:380px){
  .hero-title{ font-size:36px; }
  .nav-logo-text em{ display:none; }
  .panel-head h3{ font-size:26px; }
  .lead-head-meta h2{ font-size:19px; }
  .lt-tab{ font-size:11px; min-width:auto; }
  .lt-jp{ display:none; }
}