/* =========================================================================
   SUNNY'S DINER — Retro American West-Coast Diner in Yokohama
   Design system: red × cream × chrome, neon glow, checkerboard, sunburst
   ========================================================================= */

:root{
  /* core palette */
  --red:        #D7263D;
  --red-deep:   #A31621;
  --red-soft:   #E8506A;
  --cream:      #F6EDD4;
  --cream-2:    #FCF6E6;
  --cream-3:    #FBEFCF;
  --ink:        #211C18;
  --ink-soft:   #4A423B;

  /* chrome */
  --chrome-hi:  #ffffff;
  --chrome-1:   #eef0f3;
  --chrome-2:   #c7ccd3;
  --chrome-3:   #9aa1aa;
  --chrome-4:   #6c727b;

  /* accents */
  --teal:       #1EB3B8;
  --teal-deep:  #0E8A8F;
  --mustard:    #F4B41A;
  --mustard-2:  #E89C0E;

  /* neon / night */
  --night:      #15131F;
  --night-2:    #221E33;
  --neon-pink:  #FF466E;
  --neon-cyan:  #3CE7E0;
  --neon-yellow:#FFE45E;

  /* sunset */
  --sun-1:#FFD36B; --sun-2:#FF9E57; --sun-3:#FF6B6B; --sun-4:#C0468C; --sun-5:#5E3B8C;

  /* type */
  /* type — cool / stylish direction */
  --font-script:  'Kaushan Script', cursive;
  --font-display: 'Bebas Neue', sans-serif;
  --font-jp-pop:  'Zen Kaku Gothic New', sans-serif;
  --font-jp:      'Zen Kaku Gothic New', sans-serif;

  /* accent currently selected (tweakable) */
  --accent: var(--teal);
  --accent-deep: var(--teal-deep);

  --maxw: 1180px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--font-jp);
  color:var(--ink);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }

/* ============================ reusable bits ============================= */

.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 28px; }

/* chrome surface */
.chrome{
  background:linear-gradient(180deg,
    var(--chrome-hi) 0%, var(--chrome-1) 18%, var(--chrome-2) 50%,
    var(--chrome-3) 78%, var(--chrome-4) 100%);
}

/* checkerboard */
.checker{
  background-image:
    conic-gradient(var(--ink) 90deg, transparent 90deg 180deg,
                   var(--ink) 180deg 270deg, transparent 270deg);
  background-size:28px 28px;
  background-position:0 0;
}
.checker-red{
  background-image:
    conic-gradient(var(--red) 90deg, transparent 90deg 180deg,
                   var(--red) 180deg 270deg, transparent 270deg);
  background-size:28px 28px;
}

/* diner buttons */
.btn{
  display:inline-flex; align-items:center; gap:.55em;
  font-family:var(--font-jp-pop); font-size:16px; letter-spacing:.02em;
  padding:14px 26px; border-radius:999px; cursor:pointer; border:none;
  transition:transform .12s ease, box-shadow .12s ease, filter .12s ease;
  position:relative; white-space:nowrap;
}
.btn:active{ transform:translateY(1px); }
.btn-red{
  background:var(--red); color:#fff;
  box-shadow:0 4px 0 var(--red-deep), 0 10px 22px rgba(163,22,33,.35);
}
.btn-red:hover{ filter:brightness(1.05); box-shadow:0 6px 0 var(--red-deep), 0 14px 26px rgba(163,22,33,.42); transform:translateY(-2px); }
.btn-cream{
  background:var(--cream-2); color:var(--ink);
  box-shadow:0 4px 0 #cdbf98, 0 10px 22px rgba(0,0,0,.16);
}
.btn-cream:hover{ transform:translateY(-2px); box-shadow:0 6px 0 #cdbf98, 0 14px 26px rgba(0,0,0,.2); }
.btn-ghost{
  background:transparent; color:#fff; border:2px solid rgba(255,255,255,.65);
  box-shadow:none;
}
.btn-ghost:hover{ background:rgba(255,255,255,.12); border-color:#fff; }

/* eyebrow label */
.eyebrow{
  font-family:var(--font-display); font-size:13px; letter-spacing:.18em;
  color:var(--red); text-transform:uppercase; display:inline-block;
}
.eyebrow.on-dark{ color:var(--neon-yellow); }

/* section title block */
.sec-head{ text-align:center; margin-bottom:46px; }
.sec-head .jp{
  font-family:var(--font-jp-pop); font-size:clamp(28px,4vw,44px);
  margin:.25em 0 .15em; line-height:1.2;
}
.sec-head .en{
  font-family:var(--font-script); color:var(--accent-deep);
  font-size:clamp(20px,2.4vw,28px); transform:rotate(-2deg);
  display:inline-block;
}

/* starburst badge */
.starburst{
  --pts: 16;
  position:relative; display:grid; place-items:center;
  width:120px; height:120px; color:#fff; text-align:center;
  background:var(--mustard);
  clip-path:polygon(
    100% 50%,86.6% 56.5%,93.3% 69.1%,79.1% 70.7%,82.1% 84.7%,
    68.5% 79.4%,66.3% 93.6%,55.6% 84.2%,50% 97.2%,44.4% 84.2%,
    33.7% 93.6%,31.5% 79.4%,17.9% 84.7%,20.9% 70.7%,6.7% 69.1%,
    13.4% 56.5%,0% 50%,13.4% 43.5%,6.7% 30.9%,20.9% 29.3%,
    17.9% 15.3%,31.5% 20.6%,33.7% 6.4%,44.4% 15.8%,50% 2.8%,
    55.6% 15.8%,66.3% 6.4%,68.5% 20.6%,82.1% 15.3%,79.1% 29.3%,
    93.3% 30.9%,86.6% 43.5%);
}

/* image placeholder (striped) */
.ph{
  position:relative; overflow:hidden; border-radius:10px;
  background:
    repeating-linear-gradient(45deg,
      rgba(0,0,0,.06) 0 12px, rgba(0,0,0,.02) 12px 24px),
    var(--cream-3);
  display:grid; place-items:center; color:var(--ink-soft);
}
.ph::after{
  content:attr(data-label);
  font-family:'Courier New', monospace; font-size:12px; letter-spacing:.06em;
  color:rgba(33,28,24,.55); text-align:center; padding:8px 12px;
  border:1px dashed rgba(33,28,24,.3); border-radius:6px;
  background:rgba(252,246,230,.6);
}
.ph.on-dark{
  background:
    repeating-linear-gradient(45deg,
      rgba(255,255,255,.08) 0 12px, rgba(255,255,255,.02) 12px 24px),
    rgba(255,255,255,.04);
}
.ph.on-dark::after{ color:rgba(255,255,255,.65); border-color:rgba(255,255,255,.3); background:rgba(255,255,255,.05); }

/* reveal animation */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.08s; } .reveal.d2{ transition-delay:.16s; }
.reveal.d3{ transition-delay:.24s; } .reveal.d4{ transition-delay:.32s; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; } }

/* =============================== NAV =================================== */
.topbar{
  position:sticky; top:0; z-index:50;
  border-bottom:3px solid var(--ink);
  box-shadow:0 6px 18px rgba(0,0,0,.18);
}
.topbar .checker{ height:8px; }
.topbar .bar{ display:flex; align-items:center; justify-content:space-between; height:64px; }
.topbar .logo{ font-family:var(--font-script); font-size:30px; color:var(--red);
  text-shadow:1px 1px 0 #fff, 2px 2px 0 var(--chrome-3); line-height:1; }
.topbar nav{ display:flex; align-items:center; gap:26px; }
.topbar nav a{ font-family:var(--font-jp-pop); font-size:14px; position:relative; }
.topbar nav a::after{ content:""; position:absolute; left:0; right:100%; bottom:-5px; height:2px;
  background:var(--red); transition:right .2s ease; }
.topbar nav a:hover::after{ right:0; }
.topbar .btn{ padding:9px 20px; font-size:14px; }
.nav-links{ }
@media(max-width:820px){ .nav-links{ display:none; } }

/* ============================ HERO shared ============================== */
.hero{ position:relative; min-height:92vh; display:none; align-items:center; overflow:hidden; }
body[data-hero="neon"]     .hero.hero-neon,
body[data-hero="sunset"]   .hero.hero-sunset,
body[data-hero="interior"] .hero.hero-interior{ display:flex; }

.hero .badge-est{
  position:absolute; font-family:var(--font-display); font-size:12px; letter-spacing:.12em;
}

/* ---- HERO A : NEON NIGHT ---- */
.hero-neon{ background:
  radial-gradient(120% 90% at 80% 10%, #2a2444 0%, var(--night-2) 40%, var(--night) 80%);
  color:#fff; }
.hero-neon::before{ /* faint checker floor */
  content:""; position:absolute; left:0; right:0; bottom:0; height:34%;
  background-image:
    conic-gradient(rgba(255,255,255,.05) 90deg, transparent 90deg 180deg,
                   rgba(255,255,255,.05) 180deg 270deg, transparent 270deg);
  background-size:46px 46px;
  transform:perspective(360px) rotateX(58deg); transform-origin:bottom; opacity:.8;
}
.hero-neon .glow-ring{ position:absolute; inset:auto; }
.neon-script{
  font-family:var(--font-script); line-height:.95;
  color:#fff; font-size:clamp(56px,11vw,140px);
  text-shadow:
    0 0 6px #fff, 0 0 16px var(--neon-pink), 0 0 32px var(--neon-pink),
    0 0 56px var(--neon-pink), 0 0 90px rgba(255,70,110,.6);
  animation:flicker 5.5s infinite;
}
.neon-cyan-text{
  color:#fff;
  text-shadow:0 0 6px #fff, 0 0 14px var(--neon-cyan), 0 0 30px var(--neon-cyan), 0 0 54px rgba(60,231,232,.6);
}
@keyframes flicker{
  0%,18%,22%,25%,53%,57%,100%{ opacity:1; }
  20%,24%,55%{ opacity:.72; }
}
.hero-neon .open-sign{
  display:inline-flex; align-items:center; gap:.5em; font-family:var(--font-display);
  font-size:13px; letter-spacing:.1em; padding:7px 16px; border-radius:999px; white-space:nowrap;
  border:2px solid var(--neon-cyan); color:var(--neon-cyan);
  box-shadow:0 0 10px rgba(60,231,232,.5), inset 0 0 10px rgba(60,231,232,.25);
}
.hero-neon .open-sign .dot{ width:8px; height:8px; border-radius:50%; background:var(--neon-cyan);
  box-shadow:0 0 8px var(--neon-cyan); animation:blink 1.6s steps(1) infinite; }
@keyframes blink{ 50%{ opacity:.25; } }

/* ---- HERO B : SUNSET ---- */
.hero-sunset{ color:#3a1f3a;
  background:linear-gradient(180deg,var(--sun-5) 0%,var(--sun-4) 24%,var(--sun-3) 48%,var(--sun-2) 72%,var(--sun-1) 100%); }
.hero-sunset .sun{
  position:absolute; left:50%; top:34%; transform:translate(-50%,-50%);
  width:min(560px,80vw); aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle, #FFF2C4 0%, #FFD86B 40%, #FF9E57 70%, transparent 72%);
  filter:blur(.3px);
}
.hero-sunset .rays{ position:absolute; inset:0; opacity:.5;
  background:repeating-conic-gradient(from 0deg at 50% 38%,
    rgba(255,255,255,.18) 0deg 6deg, transparent 6deg 16deg);
  -webkit-mask-image:radial-gradient(circle at 50% 38%, #000 0%, transparent 62%);
          mask-image:radial-gradient(circle at 50% 38%, #000 0%, transparent 62%);
}
.hero-sunset .palms{ position:absolute; left:0; right:0; bottom:0; height:30%;
  background:linear-gradient(180deg, transparent, rgba(74,30,60,.85));
}
.hero-sunset .horizon{ position:absolute; left:0; right:0; bottom:0; height:24%;
  background:repeating-linear-gradient(90deg, rgba(58,31,58,.0) 0 60px, rgba(58,31,58,.0) 60px);
}
.sunset-title{ font-family:var(--font-jp-pop); color:#fff; line-height:1.04;
  font-size:clamp(40px,8vw,96px);
  text-shadow:0 3px 0 var(--sun-4), 0 6px 18px rgba(94,59,140,.5); }
.sunset-title .stroke{ color:var(--sun-1); }

/* ---- HERO C : INTERIOR ---- */
.hero-interior{ background:var(--ink); color:#fff; }
.hero-interior .photo{ position:absolute; inset:0; }
.hero-interior .photo .ph{ width:100%; height:100%; border-radius:0; }
.hero-interior .scrim{ position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(20,17,15,.82) 0%, rgba(20,17,15,.5) 46%, rgba(20,17,15,.15) 100%); }
.hero-interior .floor{ position:absolute; left:0; right:0; bottom:0; height:18px; }
.interior-plate{
  background:var(--cream-2); color:var(--ink); border-radius:18px;
  border:6px solid #fff; box-shadow:0 24px 60px rgba(0,0,0,.5);
  padding:34px 38px; max-width:520px;
  outline:2px solid var(--chrome-3); outline-offset:-12px;
}
.interior-plate .title{ font-family:var(--font-jp-pop); font-size:clamp(30px,4.2vw,52px); line-height:1.12; }

/* hero common content */
.hero-content{ position:relative; z-index:3; width:100%; }
.hero-copy{ max-width:680px; }
.hero-copy .kicker{ font-family:var(--font-display); letter-spacing:.16em; font-size:13px; }
.hero-sub{ font-family:var(--font-jp); font-size:clamp(15px,1.6vw,19px); line-height:1.9; margin:18px 0 30px; max-width:42ch; }
.hero-cta{ display:flex; gap:14px; flex-wrap:wrap; }

/* scroll cue */
.scroll-cue{ position:absolute; left:50%; bottom:22px; transform:translateX(-50%); z-index:4;
  font-family:var(--font-display); font-size:11px; letter-spacing:.2em; opacity:.85;
  display:flex; flex-direction:column; align-items:center; gap:8px; }
.scroll-cue .line{ width:2px; height:34px; background:currentColor; animation:cue 1.8s ease-in-out infinite; transform-origin:top; }
@keyframes cue{ 0%,100%{ transform:scaleY(.3); opacity:.4 } 50%{ transform:scaleY(1); opacity:1 } }

/* ============================ CONCEPT ================================= */
.concept{ padding:96px 0; background:
  linear-gradient(180deg,var(--cream) 0%, var(--cream-2) 100%); position:relative; }
.concept .grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; }
.concept .lead{ font-family:var(--font-jp-pop); font-size:clamp(24px,3vw,36px); line-height:1.5; margin:.4em 0; }
.concept p{ font-size:16px; line-height:2.05; color:var(--ink-soft); margin:1em 0; }
.concept .photo-stack{ position:relative; }
.concept .photo-stack .ph.main{ height:420px; border:8px solid #fff;
  box-shadow:0 20px 44px rgba(0,0,0,.2); transform:rotate(-2deg); }
.concept .photo-stack .ph.mini{ position:absolute; right:-22px; bottom:-30px; width:200px; height:200px;
  border:7px solid #fff; box-shadow:0 16px 34px rgba(0,0,0,.25); transform:rotate(4deg); }
.concept .est-badge{ position:absolute; left:-26px; top:-26px; width:104px; height:104px;
  border-radius:50%; background:var(--red); color:#fff; display:grid; place-items:center; text-align:center;
  font-family:var(--font-display); font-size:12px; line-height:1.5; box-shadow:0 10px 24px rgba(163,22,33,.4);
  border:3px dashed rgba(255,255,255,.8); transform:rotate(-8deg); z-index:2; }
.stat-row{ display:flex; gap:30px; margin-top:30px; }
.stat-row .stat .n{ font-family:var(--font-display); font-size:30px; color:var(--accent-deep); }
.stat-row .stat .l{ font-size:13px; color:var(--ink-soft); }
@media(max-width:820px){ .concept .grid{ grid-template-columns:1fr; gap:64px; } }

/* ============================ GALLERY ================================= */
.gallery{ padding:96px 0; background:var(--ink); color:#fff; position:relative; }
.gallery::before{ content:""; position:absolute; top:0; left:0; right:0; height:14px; }
.gallery .strip-top{ position:absolute; top:0; left:0; right:0; height:14px; }
.polaroids{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.polaroid{ background:#fff; padding:12px 12px 42px; border-radius:4px; color:var(--ink);
  box-shadow:0 14px 30px rgba(0,0,0,.4); position:relative; }
.polaroid .ph{ height:190px; border-radius:2px; }
.polaroid .cap{ position:absolute; left:0; right:0; bottom:12px; text-align:center;
  font-family:var(--font-script); font-size:18px; color:var(--ink); }
.polaroid:nth-child(odd){ transform:rotate(-2deg); }
.polaroid:nth-child(even){ transform:rotate(2deg); margin-top:18px; }
.polaroid:hover{ transform:rotate(0) scale(1.03); z-index:2; transition:transform .2s ease; }
@media(max-width:920px){ .polaroids{ grid-template-columns:repeat(2,1fr); } }

/* ============================ MENU =================================== */
.menu{ padding:96px 0; background:
  radial-gradient(140% 120% at 50% 0%, var(--cream-2), var(--cream)); }
.menu-tabs{ display:flex; justify-content:center; gap:10px; margin-bottom:40px; flex-wrap:wrap; }
.menu-tab{ font-family:var(--font-jp-pop); font-size:15px; padding:10px 22px; border-radius:999px;
  background:#fff; border:2px solid var(--ink); cursor:pointer; transition:all .15s ease; }
.menu-tab[aria-selected="true"]{ background:var(--red); color:#fff; border-color:var(--red-deep);
  box-shadow:0 4px 0 var(--red-deep); }
.menu-panel{ display:none; }
.menu-panel.active{ display:block; }
.menu-board{ background:var(--cream-2); border:3px solid var(--ink); border-radius:18px;
  padding:42px 46px; box-shadow:0 16px 40px rgba(0,0,0,.14); position:relative; }
.menu-board::before{ content:""; position:absolute; inset:10px; border:1px solid rgba(33,28,24,.25); border-radius:10px; pointer-events:none; }
.menu-cols{ display:grid; grid-template-columns:1fr 1fr; gap:14px 54px; }
.m-item{ display:flex; align-items:baseline; gap:10px; padding:12px 0; border-bottom:1px dotted rgba(33,28,24,.3); }
.m-item .nm{ font-family:var(--font-jp-pop); font-size:17px; white-space:nowrap; }
.m-item .en{ font-family:var(--font-display); font-size:10px; letter-spacing:.06em; color:var(--ink-soft); }
.m-item .dots{ flex:1; border-bottom:2px dotted rgba(33,28,24,.3); transform:translateY(-4px); }
.m-item .pr{ font-family:var(--font-display); font-size:16px; color:var(--red); white-space:nowrap; }
.m-item .desc{ display:block; font-size:12.5px; color:var(--ink-soft); margin-top:3px; }
@media(max-width:760px){ .menu-cols{ grid-template-columns:1fr; gap:6px; } .menu-board{ padding:30px 24px; } }

/* signature row */
.signatures{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:54px; }
.sig-card{ background:#fff; border-radius:16px; overflow:hidden; border:3px solid var(--ink);
  box-shadow:0 12px 28px rgba(0,0,0,.16); position:relative; }
.sig-card .ph{ height:200px; border-radius:0; }
.sig-card .body{ padding:20px 22px 24px; }
.sig-card .nm{ font-family:var(--font-jp-pop); font-size:20px; }
.sig-card .desc{ font-size:13.5px; color:var(--ink-soft); line-height:1.8; margin-top:8px; }
.sig-card .price-burst{ position:absolute; top:-14px; right:-14px; width:84px; height:84px;
  font-family:var(--font-display); font-size:11px; line-height:1.3; z-index:2; transform:rotate(8deg); }
.sig-card .price-burst .y{ font-size:18px; display:block; }
@media(max-width:820px){ .signatures{ grid-template-columns:1fr; } }

/* ============================ ACCESS ================================= */
.access{ padding:96px 0; background:var(--cream); }
.access .grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:44px; align-items:stretch; }
.map-frame{ border:8px solid #fff; border-radius:16px; box-shadow:0 16px 40px rgba(0,0,0,.18);
  overflow:hidden; outline:2px solid var(--chrome-3); outline-offset:-12px; min-height:380px; position:relative; }
.map-frame .ph{ width:100%; height:100%; min-height:380px; border-radius:0; }
.map-frame .pin{ position:absolute; left:46%; top:42%; transform:translate(-50%,-100%);
  font-family:var(--font-jp-pop); }
.map-pin{ width:34px; height:34px; border-radius:50% 50% 50% 0; background:var(--red); transform:rotate(-45deg);
  box-shadow:0 6px 14px rgba(0,0,0,.3); border:3px solid #fff; }
.info-card{ background:#fff; border:3px solid var(--ink); border-radius:16px; padding:34px 34px;
  box-shadow:0 12px 28px rgba(0,0,0,.12); display:flex; flex-direction:column; gap:18px; }
.info-row{ display:flex; gap:14px; align-items:flex-start; }
.info-row .k{ font-family:var(--font-display); font-size:11px; letter-spacing:.1em; color:var(--red);
  min-width:74px; padding-top:3px; }
.info-row .v{ font-size:15px; line-height:1.7; }
.info-row .v b{ font-family:var(--font-jp-pop); font-weight:400; }
@media(max-width:820px){ .access .grid{ grid-template-columns:1fr; } }

/* ============================ HOURS / CTA ============================ */
.hours{ padding:90px 0; background:var(--ink); color:#fff; }
.hours .grid{ display:grid; grid-template-columns:1fr 1fr; gap:46px; align-items:center; }
.hours-table{ width:100%; border-collapse:collapse; }
.hours-table td{ padding:13px 4px; border-bottom:1px solid rgba(255,255,255,.16); font-size:15px; }
.hours-table .day{ font-family:var(--font-jp-pop); }
.hours-table .time{ text-align:right; font-family:var(--font-display); font-size:14px; letter-spacing:.04em; }
.hours-table .closed{ color:var(--red-soft); }
.cta-box{ text-align:center; }
.cta-box .big{ font-family:var(--font-jp-pop); font-size:clamp(26px,3.4vw,40px); line-height:1.3; }
.cta-box .tel{ font-family:var(--font-display); font-size:clamp(30px,5vw,52px); color:var(--neon-yellow);
  display:inline-block; margin:14px 0 8px; }
.cta-box .note{ font-size:13px; opacity:.75; }
.cta-box .btns{ display:flex; gap:14px; justify-content:center; margin-top:24px; flex-wrap:wrap; }
@media(max-width:760px){ .hours .grid{ grid-template-columns:1fr; gap:40px; } }

/* ============================ FOOTER ================================= */
.footer{ background:var(--night); color:#fff; padding:60px 0 30px; text-align:center; position:relative; }
.footer .strip{ position:absolute; top:0; left:0; right:0; height:10px; }
.footer .neon{ font-family:var(--font-script); font-size:clamp(40px,7vw,76px); color:#fff;
  text-shadow:0 0 6px #fff,0 0 16px var(--neon-pink),0 0 34px var(--neon-pink); }
.footer .sub{ font-family:var(--font-display); letter-spacing:.18em; font-size:12px; opacity:.7; margin-top:6px; }
.footer .socials{ display:flex; gap:18px; justify-content:center; margin:26px 0; }
.footer .socials a{ font-family:var(--font-jp-pop); font-size:14px; padding:8px 18px; border-radius:999px;
  border:1.5px solid rgba(255,255,255,.4); transition:all .15s; }
.footer .socials a:hover{ background:#fff; color:var(--night); }
.footer .copy{ font-size:12px; opacity:.5; margin-top:18px; }

/* section number tag */
.sec-no{ font-family:var(--font-display); font-size:13px; letter-spacing:.2em; color:var(--accent-deep);
  display:inline-block; margin-bottom:6px; }

/* =====================================================================
   COOL TYPE TUNING — Bebas Neue + Zen Kaku Gothic New + Kaushan Script
   Zen Kaku default weight is light, so headings get explicit heavy weight;
   Bebas Neue is tall/condensed, so labels gain a touch more tracking.
   ===================================================================== */
.sec-head .jp,
.concept .lead,
.interior-plate .title,
.sunset-title,
.cta-box .big,
#hours h2{ font-weight:900; letter-spacing:.01em; }

.hero-copy .neon-cyan-text,
.hero-copy + *{ }

.topbar nav a,
.btn,
.menu-tab,
.m-item .nm,
.sig-card .nm,
.cta-box .note,
.info-row .v b,
.hours-table .day,
.stat-row .stat .l,
.footer .socials a{ font-weight:700; }

.concept p,
.hero-sub,
.sig-card .desc,
.info-row .v,
.menu-board,
.hours-table td{ font-weight:500; }

/* Bebas Neue display sizing: tall & thin, so nudge tracking + weight presence */
.eyebrow{ font-size:14px; letter-spacing:.22em; }
.sec-no{ letter-spacing:.24em; }
.m-item .pr{ font-size:19px; letter-spacing:.02em; }
.m-item .en{ font-size:11px; letter-spacing:.12em; }
.hours-table .time{ font-size:16px; }
.hero-neon .open-sign{ font-size:14px; letter-spacing:.14em; }
.footer .sub{ letter-spacing:.22em; }

/* script logos a touch larger to balance the slim sign type */
.topbar .logo{ font-size:32px; }
.sec-head .en{ font-size:clamp(22px,2.6vw,30px); }
