/* ============================================================
   HOME PAGE — premium "Tokyo Night Dining, Samurai Blue"
   Section variety + cinematic hero + editorial cards.
   ============================================================ */

/* ---------- HERO ---------- */
.home-hero{ position:relative; min-height:94svh; display:flex; align-items:flex-end; overflow:hidden; background:#050505; isolation:isolate; }
.home-hero__media{ position:absolute; inset:0; z-index:-2; }
.home-hero__media img{ width:100%; height:100%; object-fit:cover; opacity:.5; transform:scale(1.06); animation:heroPan 20s var(--ease) forwards; }
@media (prefers-reduced-motion:reduce){ .home-hero__media img{ animation:none; transform:none; } }
.home-hero::after{ content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(115deg, rgba(5,5,5,.94), rgba(5,5,5,.6) 48%, rgba(5,5,5,.2)),
    radial-gradient(70% 60% at 80% 20%, rgba(84,199,218,.14), transparent 60%),
    linear-gradient(0deg, rgba(5,5,5,.95), transparent 55%); }
.home-hero__inner{ position:relative; z-index:1; padding-block:clamp(var(--sp-8),12vw,7rem) clamp(3rem,7vw,5rem); max-width:820px; display:grid; gap:1rem; }
.home-hero__eyebrow{ display:inline-flex; align-items:center; gap:8px; color:var(--samurai-blue); font-size:.8rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; }
.home-hero__eyebrow .sakura{ width:16px; height:16px; }
.home-hero h1{ font-size:clamp(2.6rem,6.2vw,4.8rem); line-height:.98; }
.home-hero h1 .cy{ color:var(--samurai-blue); }
.home-hero__lead{ color:var(--text-on-dark-muted); font-size:var(--fs-500); max-width:44ch; }

/* Mega price */
.price-mega{ display:flex; align-items:flex-start; gap:.5rem; margin-top:.4rem; }
.price-mega .cur{ font-family:var(--font-display); font-weight:800; font-size:clamp(1.3rem,3vw,2rem); color:var(--samurai-blue); margin-top:.6rem; }
.price-mega .num{ font-family:var(--font-display); font-weight:800; font-size:clamp(4rem,13vw,8rem); line-height:.78; color:var(--samurai-blue); text-shadow:0 8px 50px rgba(84,199,218,.4); letter-spacing:-.02em; }
.price-mega .meta{ display:flex; flex-direction:column; margin-top:.5rem; }
.price-mega .meta .per{ font-family:var(--font-display); font-weight:700; font-size:1.05rem; color:var(--text-strong); line-height:1; }
.price-mega .meta .sub{ font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--text-dim); margin-top:4px; }

.home-hero__actions{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:.4rem; }
.home-hero__micro{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:.4rem; }
.home-hero__micro a{ display:inline-flex; align-items:center; gap:6px; font-weight:600; font-size:.9rem; color:var(--text); }
.home-hero__micro svg{ width:17px; height:17px; color:var(--samurai-blue); }
.hero-chips{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.9rem; }
.hero-chip{ display:inline-flex; align-items:center; gap:8px; padding:.5rem .9rem; border:1px solid rgba(255,255,255,.16); border-radius:999px; background:rgba(0,0,0,.3); font-size:.82rem; font-weight:600; }
.hero-chip svg{ width:16px; height:16px; color:var(--samurai-blue); }

/* ---------- Trust band (cyan) ---------- */
.trust-band{ background:linear-gradient(180deg, rgba(84,199,218,.1), rgba(84,199,218,.03)); border-block:1px solid rgba(84,199,218,.2); }
.trust-band__row{ display:grid; grid-template-columns:repeat(4,1fr); }
@media (max-width:760px){ .trust-band__row{ grid-template-columns:1fr 1fr; } }
.trust-band__item{ display:flex; align-items:center; gap:11px; padding:1.15rem .5rem; }
.trust-band__item svg{ width:22px; height:22px; color:var(--samurai-blue); flex:none; }
.trust-band__item b{ display:block; color:var(--text-strong); font-size:.95rem; }
.trust-band__item span{ font-size:.76rem; color:var(--text-dim); }

/* ---------- Category showcase (asymmetric) ---------- */
.home-cats{ display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:200px; gap:1rem; }
@media (max-width:820px){ .home-cats{ grid-template-columns:1fr 1fr; grid-auto-rows:170px; } }
@media (max-width:480px){ .home-cats{ grid-template-columns:1fr; grid-auto-rows:150px; } }
.home-cats .cat-card{ aspect-ratio:auto; border:1px solid var(--border); }
.home-cats .cat-card:first-child{ grid-column:span 1; grid-row:span 2; }
@media (min-width:821px){ .home-cats .cat-card:first-child{ grid-column:span 1; grid-row:span 2; } }
.home-cats .cat-card img{ opacity:.46; }
.home-cats .cat-card:hover img{ opacity:.58; }
.cat-card__body{ background:linear-gradient(to top, rgba(5,5,5,.9), rgba(5,5,5,.15) 60%, transparent); }
.cat-card__arrow{ display:inline-flex; align-items:center; gap:6px; color:var(--samurai-blue); font-weight:700; font-size:.82rem; margin-top:6px; opacity:0; transform:translateY(6px); transition:all var(--dur); }
.cat-card:hover .cat-card__arrow, .cat-card:focus-visible .cat-card__arrow{ opacity:1; transform:none; }
.cat-card .sakura{ position:absolute; top:12px; inset-inline-end:12px; width:18px; height:18px; color:rgba(84,199,218,.6); }

/* ---------- Featured editorial (image-overlay cards) ---------- */
.hfeat{ display:grid; grid-template-columns:2fr 1fr 1fr; grid-auto-rows:minmax(210px,1fr); gap:1rem; }
@media (max-width:820px){ .hfeat{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .hfeat{ grid-template-columns:1fr; } }
.hfav{ position:relative; overflow:hidden; border-radius:20px; border:1px solid var(--border); display:flex; flex-direction:column; justify-content:flex-end; padding:1.2rem; min-height:210px; isolation:isolate; }
.hfav img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; transition:transform .6s var(--ease); }
.hfav::after{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(5,5,5,.05), rgba(5,5,5,.5) 52%, rgba(5,5,5,.94)); }
.hfav:hover img{ transform:scale(1.06); }
.hfav.big{ grid-row:span 2; }
@media (max-width:820px){ .hfav.big{ grid-column:span 2; grid-row:span 1; min-height:260px; } }
@media (max-width:520px){ .hfav.big{ grid-column:span 1; } }
.hfav__tag{ position:absolute; top:1rem; inset-inline-start:1rem; z-index:1; font-size:.66rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--on-blue); background:var(--samurai-blue); padding:4px 10px; border-radius:999px; }
.hfav h3{ font-size:clamp(1.05rem,2.2vw,1.5rem); }
.hfav__desc{ color:var(--text-on-dark-muted); font-size:.86rem; margin-top:.35rem; max-width:40ch; }
.hfav__meta{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:.7rem; }
.hfav__price{ font-family:var(--font-display); font-weight:700; color:var(--samurai-blue); font-size:1.05rem; }

/* ---------- Ivory story band ---------- */
.home-ivory{ background:linear-gradient(180deg,var(--panel-ivory),var(--panel-ivory-2)); color:var(--on-ivory); }
.home-ivory .eyebrow{ color:var(--samurai-blue-dark); }
.home-ivory h2,.home-ivory h3,.home-ivory strong{ color:var(--on-ivory); }
.home-ivory p,.home-ivory li{ color:var(--on-ivory-muted); }
.home-ivory .btn--ghost{ border-color:var(--ivory-line); color:var(--on-ivory); }
.home-ivory .btn--ghost:hover{ background:rgba(41,33,27,.06); border-color:var(--samurai-blue-dark); }
.story-badges{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.4rem; }
.story-badge{ display:flex; align-items:center; gap:9px; background:#fff; border:1px solid var(--ivory-line); border-radius:12px; padding:.7rem 1rem; box-shadow:0 6px 20px rgba(41,33,27,.05); }
.story-badge svg{ width:20px; height:20px; color:var(--samurai-blue-dark); }
.story-badge b{ font-size:.9rem; color:var(--on-ivory); }
.story-media{ display:grid; grid-template-columns:1fr 1fr; gap:.9rem; }
.story-media img{ width:100%; border-radius:16px; border:1px solid var(--ivory-line); object-fit:cover; aspect-ratio:3/4; box-shadow:0 12px 30px rgba(41,33,27,.1); }
.story-media img:nth-child(2){ margin-top:2rem; }

/* ---------- Gallery strip (overlapping editorial) ---------- */
.gallery-strip{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:1rem; }
@media (max-width:700px){ .gallery-strip{ grid-template-columns:1fr 1fr; } }
.gallery-strip a{ position:relative; overflow:hidden; border-radius:16px; border:1px solid var(--border); }
.gallery-strip a:first-child{ grid-row:span 2; }
@media (max-width:700px){ .gallery-strip a:first-child{ grid-column:span 2; grid-row:span 1; } }
.gallery-strip img{ width:100%; height:100%; object-fit:cover; min-height:180px; transition:transform .5s var(--ease); }
.gallery-strip a:hover img{ transform:scale(1.05); }

/* ---------- Final CTA band (cyan) ---------- */
.home-final{ position:relative; overflow:hidden; text-align:center; background:linear-gradient(180deg, rgba(84,199,218,.12), rgba(10,10,10,0)), var(--bg-2); border-top:1px solid rgba(84,199,218,.2); }
.home-final .sakura{ position:absolute; inset-inline-start:50%; top:-30px; transform:translateX(-50%); width:120px; height:120px; color:rgba(84,199,218,.08); }
