/* /home-c proposal (2026-10-05): shorter homepage. Compact morning strip, trimmed Skip Tokyo, 'Also from Japan' row. */
/* compact morning strip on night */
.hc-morning{padding-block:clamp(64px,8vw,104px)}
.hc-morning__head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:12px 32px}
.hc-morning .lx-h2{max-width:20ch}
.lx .hc-morning__now{display:inline-flex;align-items:center;gap:8px;margin:0;font-size:.92rem;color:var(--on-2);font-variant-numeric:tabular-nums}
.hc-morning__now time{color:var(--on);font-weight:600}
.hc-rail{--p:0%;position:relative;list-style:none;margin:clamp(32px,4vw,48px) 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(10px,1.4vw,20px)}
.hc-rail::before,.hc-rail::after{content:"";position:absolute;left:calc(100%/12);right:calc(100%/12);top:calc(var(--img) + 18px);height:1px;background:var(--hair-d)}
.hc-rail{--img:clamp(84px,10vw,140px)}
.hc-rail::after{right:auto;width:calc(var(--p) * 10/12);background:var(--gold);transition:width 1.2s var(--ease)}
.hc-rail li{position:relative;display:grid;justify-items:center;text-align:center;gap:6px;color:var(--on-2)}
.hc-rail img{width:100%;max-width:var(--img);aspect-ratio:1;object-fit:cover;border-radius:var(--r-m,10px);opacity:.85;transition:opacity .4s var(--ease),transform .4s var(--ease)}
.hc-rail li::before{content:"";order:1;width:9px;height:9px;margin:7px 0 4px;border-radius:50%;background:var(--night);border:1px solid var(--on-2);z-index:1}
.hc-rail img{order:0}.hc-rail b{order:2}.hc-rail span{order:3}
.hc-rail b{font-family:var(--serif);font-weight:500;font-variation-settings:"opsz" 30;font-size:clamp(1.2rem,1.8vw,1.6rem);line-height:1;color:var(--on)}
.hc-rail span{font-size:.84rem;line-height:1.35;max-width:14ch}
.hc-rail li.is-past::before{background:var(--gold);border-color:var(--gold)}
.hc-rail li.is-now::before{background:var(--gold-lt);border-color:var(--gold-lt);transform:scale(1.4);box-shadow:0 0 0 5px rgba(238,241,245,.12)}
.hc-rail li.is-now img{opacity:1;transform:translateY(-3px)}
.hc-rail li.is-now span{color:var(--on);font-weight:600}
.lx .hc-morning__note{margin:28px 0 0;font-size:.86rem;color:var(--on-2)}
.hc-morning__note a{color:var(--on);text-underline-offset:3px}
@media(max-width:760px){
  .hc-rail{grid-template-columns:repeat(6,minmax(96px,1fr));overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(-1*var(--gutter));padding:0 var(--gutter) 6px;scrollbar-width:none;--img:96px}
  .hc-rail::-webkit-scrollbar{display:none}
  .hc-rail li{scroll-snap-align:start}
  .hc-rail::before,.hc-rail::after{display:none}
}
/* One supplier: map sits beside the intro only, smaller; the 4 reasons run in a row underneath */
@media(min-width:720px){.hc-why .hb-why__grid{grid-template-columns:minmax(0,1fr) clamp(230px,31vw,360px);gap:clamp(28px,4vw,64px);align-items:center}}
.hc-why .hb-map{width:100%;max-width:360px;justify-self:center;padding:14px 16px}
.hc-why .sm{max-height:340px}
.hc-why .hb-map figcaption{font-size:.8rem}
@media(min-width:720px) and (max-width:999px){.hc-why .sm{max-height:300px}.hc-why .hb-map figcaption{font-size:.74rem}}
@media(max-width:719px){.hc-why .hb-map{max-width:300px}.hc-why .sm{max-height:280px}}
/* 4 reasons: 2 x 2 on tablet/desktop so every title sits on one line — identical title/text rhythm in all four cells */
.hc .hc-reasons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin-top:clamp(40px,4.5vw,64px);padding:0;border-top:1px solid var(--hair-l)}
.hc .hc-reasons > li{padding:clamp(22px,2.4vw,30px) clamp(20px,2.6vw,40px);border:0;border-bottom:1px solid var(--hair-l)}
.hc .hc-reasons > li:nth-child(odd){padding-left:0}
.hc .hc-reasons > li:nth-child(even){padding-right:0;border-left:1px solid var(--hair-l)}
.hc .hc-reasons b{display:block;margin:0;font-size:clamp(1.15rem,1.4vw,1.3rem);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hc .hc-reasons span{display:block;margin-top:10px;font-size:.95rem;line-height:1.6;max-width:56ch}
@media(max-width:640px){
  .hc .hc-reasons{grid-template-columns:1fr}
  .hc .hc-reasons > li:nth-child(n){padding:18px 0;border-left:0}
  .hc .hc-reasons b{white-space:normal}}
.hc-why{padding-bottom:clamp(56px,6vw,88px)}
/* Before you order: compact objections block */
.hc-faq{padding-block:clamp(56px,7vw,96px)}
.hc-faq__grid{display:grid;gap:20px 64px}
@media(min-width:1000px){.hc-faq__grid{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);align-items:start}}
/* Skip Tokyo without the route cards: one readable column */
.hc-net .lx-adv{display:block;max-width:780px}
/* 'Also from Japan' row under the FAQ */
.hc-also{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;margin-top:clamp(40px,5vw,64px);padding-top:24px;border-top:1px solid var(--hair-l)}
.lx .hc-also__label{margin:0;font-weight:600;color:var(--ink)}
.hc-also ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 22px}
.hc-also a{display:inline-flex;align-items:center;gap:10px;color:var(--ink-2);text-decoration:none;font-size:.95rem}
.hc-also a:hover span{text-decoration:underline;text-underline-offset:3px}
.hc-also img{width:44px;height:44px;border-radius:50%;object-fit:cover}
@media(prefers-reduced-motion:reduce){.hc-rail::after,.hc-rail img{transition:none}}
/* Beyond seafood (original section, Luca) — a little more compact */
.hc-beyond{padding-block:clamp(56px,6.5vw,96px)}
.hc-beyond .lx-also{margin-top:clamp(24px,3vw,40px)}
.hc-beyond .lx-also img{aspect-ratio:16/10}
.hc-beyond .lx-also h3{margin-top:12px;font-size:1.3rem}
@media(max-width:899px){
  .hc-beyond .lx-also{gap:14px}
  .hc-beyond .lx-also a{display:grid;grid-template-columns:110px 1fr;grid-template-rows:auto auto 1fr;column-gap:16px;align-items:start}
  .hc-beyond .lx-also img{grid-row:1/4;aspect-ratio:1;border-radius:var(--r-m,10px)}
  .hc-beyond .lx-also h3{margin-top:0;font-size:1.15rem}
  .hc-beyond .lx-also p{margin-top:4px;font-size:.9rem}
  .hc-beyond .lx-also span.more{margin-top:6px;justify-self:start}
}
/* cream section followed by cream section: one comfortable gap, not two paddings stacked (Luca 2026-10-05) */
.hc .lx-sec--light:has(+ .lx-sec--light){padding-bottom:clamp(48px,5.5vw,96px)}
.hc .lx-sec--light + .lx-sec--light{padding-top:clamp(28px,3vw,48px)}

/* ===== Bold intro (2026-10-05): big headline, No.1 statement, dark map panel, numbered reasons ===== */
.hw .hw-h2{font-size:clamp(2.5rem,5.2vw,4.6rem);line-height:1.02;letter-spacing:-.015em;max-width:none}
.hw .hw-h2 em{display:block;font-style:italic;font-weight:500;color:#1d5fa6}
html[lang="ja"] .hw .hw-h2{font-size:clamp(2rem,4.2vw,3.5rem);line-height:1.3}
html[lang="ja"] .hw .hw-h2 em{font-style:normal}
.hw-no1{display:flex;align-items:center;gap:clamp(14px,2vw,26px);margin:clamp(22px,3vw,34px) 0 6px;padding:clamp(14px,1.8vw,20px) 0;border-top:1px solid var(--hair-l);border-bottom:1px solid var(--hair-l)}
.hw-no1__big{font-family:var(--serif);font-weight:600;font-variation-settings:"opsz" 30;font-size:clamp(3.6rem,7vw,6.2rem);line-height:.86;letter-spacing:-.03em;
  background:linear-gradient(180deg,#0b1b30 0%,#1d5fa6 140%);-webkit-background-clip:text;background-clip:text;color:transparent;white-space:nowrap}
.hw-no1__big sup{font-size:.32em;vertical-align:top;color:#1d5fa6;-webkit-text-fill-color:#1d5fa6;margin-left:2px}
.hw-no1__txt b{display:block;font-family:var(--serif);font-weight:600;font-size:clamp(1.15rem,1.9vw,1.6rem);line-height:1.18;color:var(--ink)}
html[lang="ja"] .hw-no1__txt b{font-family:var(--mincho)}
.hw-no1__txt small{display:block;margin-top:6px;font-size:.84rem;color:var(--ink-3)}
.lx .hw .lx-lead{margin-top:18px}
/* dark map panel */
.hw .hb-map{background:radial-gradient(120% 90% at 30% 20%,#1c3557 0%,#0f2240 55%,#0b1b30 100%);border:0;box-shadow:0 30px 60px -30px rgba(11,27,48,.55)}
@media(min-width:720px){.hw .hb-why__grid{grid-template-columns:minmax(0,1fr) clamp(280px,36vw,470px)}.hw .hb-map{max-width:470px;padding:18px 18px 14px}.hw .sm{max-height:440px}}
.hw .sm-land{fill:#27466f;stroke:#33557f}
.hw .sm-arc{stroke:#dfe6ee;stroke-width:1.6;opacity:.9}
.hw .sm-dot{fill:#0b1b30;stroke:#fff;stroke-width:2}
.hw .sm-hub{fill:#fff}.hw .sm-hub-ring{stroke:#fff}
.hw .sm-label,.hw .sm-hub-label{fill:#fff;stroke:#0f2240}
.hw .sm-sub{fill:rgba(245,242,234,.7)}
.hw .sm-reg{fill:rgba(205,211,219,.10);stroke:#cdd3db;stroke-opacity:.75}
.hw .sm-reglabel{fill:#cdd3db;stroke:#0f2240}
.hw .hb-map figcaption{color:rgba(245,242,234,.7)}
/* numbered reasons */
.hw .hc-reasons{counter-reset:r}
.hw .hc-reasons li{counter-increment:r}
.hw .hc-reasons li b::before{content:counter(r,decimal-leading-zero);display:block;margin-bottom:8px;font-family:var(--serif);font-size:1.9rem;font-weight:500;line-height:1;color:#1d5fa6}
html[lang="ja"] .hw-no1__txt b,html[lang="ja"] .hw-no1__txt small{word-break:keep-all;overflow-wrap:anywhere}
/* bigger map panel: fills the right column and matches the text column height */
@media(min-width:1000px){.hw .hb-why__grid{grid-template-columns:minmax(0,1fr) clamp(380px,42vw,600px);align-items:stretch}
  .hw .hb-map{max-width:none;display:flex;flex-direction:column;justify-content:center;padding:20px 22px 16px}
  .hw .sm{max-height:620px;width:100%}}
@media(min-width:720px) and (max-width:999px){.hw .hb-map{max-width:440px}.hw .sm{max-height:480px}}
@media(max-width:719px){.hw .hb-map{max-width:none}.hw .sm{max-height:440px}}
.hw .no1-note{margin:10px 0 0;color:var(--ink-3);font-size:.76rem}
.hw .sm-regsub{font-size:11px;font-weight:500;fill:rgba(205,211,219,.8)}
/* JP: softer claim (Luca 2026-10-06) — statement only, no big "No.1" */
.hw-no1--ja .hw-no1__txt b{font-size:clamp(1.4rem,2.4vw,2rem);line-height:1.45;color:var(--ink)}
.hw-no1--ja sup{font-size:.55em;color:#1d5fa6;margin-left:2px}
