/* ============================================================================
   Japan Bike Market — responsive.css
   Phone / tablet: full-width, no empty white voids
   ============================================================================ */

html, body{
  max-width:100%;
  overflow-x:clip;
}
main, .hero, .section, .section--tight, .section--paper, .section--store,
.feature-bar, .promo-overlap, .cta-band, .flash-deal, .member-band, .brand-strip, .ftr{
  max-width:100%;
  width:100%;
}
.container{
  width:min(100% - 1.6rem, var(--container));
  box-sizing:border-box;
}

/* On phone/tablet: never leave content invisible (avoids white holes) */
@media (max-width:900px){
  [data-reveal]{
    opacity:1 !important;
    transform:none !important;
  }
  :root{
    --sp-6:2.8rem;
    --sp-7:3.4rem;
    --sp-8:3.6rem;
  }
  .section{ padding-block:2.8rem; }
  .section--tight{ padding-block:2.2rem; }
  .section--store{ padding-block:2.6rem; }
  .sec-center{ margin-bottom:1.6rem; }
  .cta-band{ padding:2.4rem 0; }
  .flash-deal{ padding:2.2rem 0; }
  .feature-bar{ padding:1.6rem 0; }
  .member-band{ padding:2.8rem 0; }
  .brand-strip{ padding:1.6rem 0; }
}

@media (min-width:1800px){
  :root{ --container:1480px; }
}

@media (max-width:1080px){
  .market{ grid-template-columns:1fr; }
  .filter-panel{ position:static; }
  .cats{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .steps{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .stepc::after{ display:none; }
  .split{ grid-template-columns:1fr; }
  .trust-grid,.news-grid,.reviews{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ftr__grid{ grid-template-columns:1fr 1fr; }
  .listings{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pcard-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* Tablet */
@media (max-width:900px){
  .hdr__in{
    grid-template-columns:1fr auto;
    width:min(100% - 1.4rem, var(--container));
    height:64px;
    gap:.8rem;
  }
  .hdr__logo-txt{ font-size:1.15rem; }
  .hdr__nav,.hdr__actions{ display:none; }
  .hdr__burger{ display:flex; justify-self:end; }
  .hdr__nav.is-open{
    display:flex;
    position:fixed;
    inset:64px 0 auto;
    flex-direction:column;
    gap:0;
    padding:1rem 1.2rem 1.4rem;
    background:var(--white);
    border-bottom:1px solid var(--line);
    box-shadow:var(--shadow-sm);
    z-index:950;
  }
  .hdr__nav.is-open .hdr__link{
    padding:.95rem 0;
    border-bottom:1px solid var(--line);
    font-size:.9rem;
    letter-spacing:.06em;
  }

  .util{ display:none; }
  .cat-nav{ display:none; }

  .hero--lukas{
    height:min(58svh, 520px);
    min-height:360px;
  }
  .hero-slide__copy{
    left:1rem;
    right:1rem;
    max-width:none;
    top:auto;
    bottom:14%;
    transform:none;
  }
  .hero-slide__title{ font-size:clamp(1.7rem, 7.5vw, 2.6rem); }
  .hero-slide__jp{ display:none; }

  .promo-overlap{
    margin-top:0;
    padding:1rem 0 0;
  }
  .promo-row,
  .feature-bar__grid,
  .dual-banners,
  .flash-deal__in,
  .news-grid--store,
  .brand-strip__grid,
  .pcard-grid,
  .steps{ grid-template-columns:1fr; }

  .promo-tile,
  .promo-tile__body{ min-height:160px; }
  .feature-bar__item{ align-items:center; }
  .dual-banner{ grid-template-columns:1fr; }
  .dual-banner__img{ aspect-ratio:16/9; min-height:0; }
  .flash-deal__media{ aspect-ratio:16/10; }
  .member-band__form{ flex-direction:column; max-width:100%; }
  .member-band__form .btn{ width:100%; }

  .stats__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ftr__cta{ width:min(100% - 1.4rem, var(--container)); }
  .ftr__grid, .ftr__bottom{ width:min(100% - 1.4rem, var(--container)); }
}

/* Phone */
@media (max-width:560px){
  .container{ width:min(100% - 1.2rem, var(--container)); }

  .listings,.listings--2,.cats,.steps,.trust-grid,.news-grid,.reviews,
  .contact-grid,.form__row,.ftr__grid,.pcard-grid{ grid-template-columns:1fr; }

  .stats__grid{ grid-template-columns:1fr 1fr; }
  .ftr__cta-in,.ftr__bottom{ flex-direction:column; align-items:flex-start; }

  .hero--lukas{
    height:min(52svh, 460px);
    min-height:320px;
  }
  .hero-slide__copy{ bottom:12%; padding-right:0; }
  .hero-slide__eyebrow{ font-size:.68rem; margin-bottom:.6rem; }
  .hero-slide__title{ font-size:clamp(1.55rem, 8vw, 2.1rem); }
  .hero-slide__copy .btn{ padding:.7rem 1.2rem; font-size:.78rem; }

  .title-store{ font-size:1.35rem; letter-spacing:.04em; }
  .sec-center__lede{ font-size:.88rem; }
  .cta-band__in h2{ font-size:clamp(1.2rem, 5.5vw, 1.7rem); }
  .pcard__name{ font-size:1rem; }
  .faq__q{ font-size:.95rem; padding:1.1rem 1rem; }

  .feature-bar__ic{ width:46px; height:46px; }
  .feature-bar__item h3{ font-size:.95rem; }
  .feature-bar__item p{ font-size:.82rem; }
}

@media (max-width:400px){
  .stats__grid{ grid-template-columns:1fr; }
  .hdr__logo-txt small{ display:none; }
}
