/* ============================================================================
   JDM Bike Garage — hero.css  (Tuner HUD / Dyno Lab carousel)
   ============================================================================ */
.hero{ position:relative; min-height:100svh; overflow:hidden; background:#111; }
.hero--carousel{ padding:0; display:block; }
.hero-swiper{ width:100%; height:100svh; min-height:560px; background:#111; }
.hero-swiper .swiper-slide{ position:relative; overflow:hidden; background:#111; }
.hero-slide__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.hero-slide__shade{ position:absolute; inset:0; background:
  linear-gradient(105deg, rgba(8,8,10,.88) 0%, rgba(8,8,10,.45) 52%, rgba(8,8,10,.22) 100%),
  linear-gradient(180deg, rgba(8,8,10,.35) 0%, transparent 28%, transparent 58%, rgba(8,8,10,.55) 100%); }
.hero-slide__content{
  position:relative; z-index:2; height:100%;
  width:min(100% - 2.4rem, var(--container)); margin-inline:auto;
  display:flex; flex-direction:column; justify-content:center; align-items:flex-start;
  padding:7.5rem 0 5.5rem; max-width:680px; text-align:left;
}
.hero-slide__content .tag{
  letter-spacing:.22em; margin-bottom:1rem;
  padding-bottom:.7rem; border-bottom:2px solid var(--neon);
}
.hero__title{ font-family:var(--font-jp); font-weight:900; font-size:clamp(2.4rem, 7vw, 5.2rem); line-height:.96; letter-spacing:-.02em; }
.hero__title .line{ display:block; }
.hero__title .neon{ color:var(--neon); font-family:var(--font-tech); letter-spacing:.04em; text-transform:uppercase; }
.hero__lede{ margin:1.2rem 0 1.8rem; color:var(--muted); max-width:44ch; font-size:clamp(1rem,1.5vw,1.12rem); }
.hero__actions{ display:flex; gap:1rem; flex-wrap:wrap; }
.hero__spec{
  margin-top:2rem; display:flex; gap:0; flex-wrap:wrap;
  border:1px solid rgba(255,0,51,.35); background:rgba(10,10,12,.55);
}
.hero__spec > div{ padding:.85rem 1.3rem; border-left:1px solid rgba(255,0,51,.28); min-width:6.5rem; }
.hero__spec > div:first-child{ border-left:0; }
.hero__spec .n{ display:block; font-family:var(--font-tech); font-size:1.7rem; color:var(--white); letter-spacing:.02em; }
.hero__spec .n small{ font-size:.5em; margin-left:.15em; color:var(--neon); }
.hero__spec .l{ display:block; color:var(--muted); font-family:var(--font-mono); font-size:.68rem; letter-spacing:.18em; margin-top:.2rem; text-transform:uppercase; }

.hero-swiper__pag{ bottom:1.5rem !important; left:50% !important; transform:translateX(-50%); width:auto !important; z-index:3; }
.hero-swiper__pag .swiper-pagination-bullet{
  width:22px; height:3px; border-radius:0; background:rgba(255,255,255,.28); opacity:1; margin:0 4px !important;
}
.hero-swiper__pag .swiper-pagination-bullet-active{ background:var(--neon); box-shadow:0 0 10px var(--glow); }
.hero-swiper__nav{
  color:var(--neon); width:42px; height:42px; margin-top:0; top:auto; bottom:1.2rem;
  background:rgba(10,10,12,.55); border:1px solid rgba(255,0,51,.55); border-radius:2px; z-index:3;
}
.hero-swiper__nav::after{ font-size:13px; font-weight:700; }
.swiper-button-prev.hero-swiper__nav{ left:auto; right:5rem; }
.swiper-button-next.hero-swiper__nav{ right:1.2rem; }

/* Slim dyno stripe under carousel */
.hero-dyno{ background:#0a0a0c; border-top:1px solid rgba(255,0,51,.4); border-bottom:1px solid rgba(255,255,255,.06); }
.hero-dyno__in{
  width:min(100% - 2.4rem, var(--container)); margin-inline:auto;
  display:flex; align-items:center; gap:2rem; flex-wrap:wrap; padding:.9rem 0;
}
.hero-dyno__in > .mono{ color:var(--muted); font-size:.78rem; letter-spacing:.14em; white-space:nowrap; }
.hero-dyno__in > .mono b{ color:var(--neon); }
.hero-dyno .dyno{ flex:1; min-width:220px; display:flex; flex-direction:column; gap:.35rem; }
.hero-dyno .dyno__row{ display:grid; grid-template-columns:2.4rem 1fr 2.2rem; gap:.6rem; align-items:center; font-size:.72rem; color:var(--muted); font-family:var(--font-mono, monospace); letter-spacing:.08em; }
.hero-dyno .dyno__track{ height:4px; background:rgba(255,255,255,.08); overflow:hidden; border-radius:0; }
.hero-dyno .dyno__fill{ display:block; height:100%; width:0; background:var(--neon); transition:width 1.2s ease; box-shadow:0 0 8px var(--glow); }
.hero-dyno.is-dyno .dyno__fill{ width:var(--w); }

@media (max-width:720px){
  .hero-swiper{ min-height:100svh; }
  .hero-slide__content{ padding:5.8rem 0 4.5rem; max-width:100%; }
  .hero__spec > div{ padding:.7rem .9rem; min-width:auto; flex:1; }
  .swiper-button-prev.hero-swiper__nav, .swiper-button-next.hero-swiper__nav{ display:none; }
  .hero-dyno__in{ gap:1rem; }
}

/* Single full-bleed slide (no side-by-side peek) */
.hero-swiper,
.hero--carousel .hero-swiper,
.hero--market .hero-swiper {
  width: 100% !important;
  overflow: hidden;
}
.hero-swiper .swiper-wrapper { width: 100%; }
.hero-swiper .swiper-slide {
  width: 100% !important;
  flex-shrink: 0;
  box-sizing: border-box;
}
.hero-slide__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}