/* ============================================================================
   Nippon Bike World — base.css  (reset, base, editorial typography)
   ============================================================================ */
*,*::before,*::after{ box-sizing:border-box; } *{ margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } *{ animation:none!important; transition:none!important; } }
html{ max-width:100%; overflow-x:clip; }
body{ font-family:var(--font-jp); background:var(--bg); color:var(--fg); line-height:1.9; letter-spacing:.02em; overflow-x:clip; max-width:100%; -webkit-font-smoothing:antialiased; }
img,svg{ display:block; max-width:100%; height:auto; }
img{ background:var(--navy-3); }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font:inherit; color:inherit; cursor:pointer; background:none; border:0; }
input,textarea,select{ font:inherit; color:inherit; }
:focus-visible{ outline:1px solid var(--gold); outline-offset:4px; }
::selection{ background:var(--gold); color:var(--navy); }
::-webkit-scrollbar{ width:9px; } ::-webkit-scrollbar-thumb{ background:var(--navy-3); } ::-webkit-scrollbar-track{ background:var(--navy); }
.en{ font-family:var(--font-en); }
.ui{ font-family:var(--font-ui); }

h1,h2,h3,h4{ font-weight:800; line-height:1.2; letter-spacing:.01em; }

.container{ width:min(100% - 2rem, var(--container)); margin-inline:auto; box-sizing:border-box; }
.container--wide{ width:min(100% - 2rem, 1480px); margin-inline:auto; box-sizing:border-box; }
.section{ padding-block:var(--sp-8); position:relative; background:var(--navy); }
.section--tight{ padding-block:var(--sp-6); }
.section--paper{
  background:var(--ivory); color:var(--navy);
}
.section--paper .sec-head__t,
.section--paper .piece__jp,
.section--paper h2,
.section--paper h3{ color:var(--navy); }
.section--paper .sec-head__x,
.section--paper .piece__x,
.section--paper .lede,
.section--paper p{ color:rgba(10,20,40,.62); }
.section--paper .piece{ background:var(--white); border-color:rgba(10,20,40,.12); }
.section--paper .piece__cat,
.section--paper .piece__en,
.section--paper .kicker,
.section--paper .gold{ color:var(--gold-deep); }
.section--paper .piece__spec{ border-color:rgba(10,20,40,.1); }
.section--paper .piece__spec .n{ color:var(--gold-deep); }
.section--paper .faq{ border-color:rgba(10,20,40,.12); }
.section--paper .faq__item{ border-color:rgba(10,20,40,.12); }
.section--paper .faq__q .ico{ color:var(--gold-deep); }
.section--paper .spread{ border-color:rgba(10,20,40,.12); background:var(--white); }
.section--paper .pull q{ color:var(--navy); }
.section--paper .pull__who{ color:var(--gold-deep); }
.section--paper .sec-head__no{ color:var(--gold-deep); }
.section--paper .link{ color:var(--gold-deep); }

.kicker{ font-family:var(--font-ui); font-weight:400; font-size:.72rem; letter-spacing:.42em; text-transform:uppercase; color:var(--gold); display:flex; align-items:center; gap:1rem; }
.kicker::before{ content:""; width:42px; height:1px; background:var(--gold); }
.kicker--c{ justify-content:center; }

.display{ font-family:var(--font-jp); font-weight:800; font-size:clamp(2.2rem,6vw,5rem); line-height:1.16; }
.display--en{ font-family:var(--font-en); font-weight:600; letter-spacing:.01em; }
.gold{ color:var(--gold); }
.lede{ color:var(--muted); font-size:clamp(1rem,1.5vw,1.16rem); max-width:60ch; }
.muted{ color:var(--muted); }
.serif-num{ font-family:var(--font-en); font-weight:600; }

[data-reveal]{ opacity:0; transform:translateY(30px); transition:opacity 1.1s var(--ease), transform 1.1s var(--ease); }
[data-reveal].in{ opacity:1; transform:none; }
[data-reveal-delay="1"]{ transition-delay:.1s; }
[data-reveal-delay="2"]{ transition-delay:.2s; }
[data-reveal-delay="3"]{ transition-delay:.3s; }

.rule{ height:1px; background:var(--line); border:0; }
.skip-link{ position:fixed; left:1rem; top:-4rem; z-index:1000; background:var(--gold); color:var(--navy); padding:.6rem 1rem; transition:top .3s; }
.skip-link:focus{ top:1rem; }
.scroll-progress{ position:fixed; top:0; left:0; height:2px; width:0; background:var(--grad-gold); z-index:9997; }