/* ============================================================
   BS Solar Solution — responsive rules
   Breakpoints follow Bootstrap 5:
   xxl 1399.98 | xl 1199.98 | lg 991.98 | md 767.98 | sm 575.98
   ============================================================ */

@media (max-width: 1399.98px){
  .section{ padding-block: 72px; }
  .cta-band{ padding: 2.5rem; }
}

@media (max-width: 1199.98px){
  .site-nav .nav-link{ margin-inline: .12rem; font-size: .95rem; }
  .navbar-brand img{ height: 50px; }
  .hero-stats .num{ font-size: 1.5rem; }
  .footer-middle{ padding-left: 0 !important; }
}

/* ---- tablet and below: collapsed navbar ---- */
@media (max-width: 991.98px){
  .section{ padding-block: 60px; }
  .py-70{ padding-block: 52px; }
  .banner-sec{ padding-block: 1.25rem 3.5rem; }

  .site-nav .logo-light{ display: block !important; }
  .site-nav .logo-dark{ display: none !important; }

  .site-nav.is-scrolled,
  .site-nav.nav-solid{
    background: var(--sky);
    box-shadow: none;
  }
  .site-nav.is-scrolled .logo-light,
  .site-nav.nav-solid .logo-light{ display: block; }
  .site-nav.is-scrolled .logo-dark,
  .site-nav.nav-solid .logo-dark{ display: none; }
  .site-nav.is-scrolled .navbar-toggler,
  .site-nav.nav-solid .navbar-toggler{ color: #fff; }

  .site-nav .navbar-collapse{
    background: var(--paper);
    margin-top: 1rem;
    padding: 1rem 1.25rem;
    border-radius: var(--radius);
    box-shadow: var(--shadow-md);
  }
  .site-nav .navbar-collapse .nav-link{ color: var(--ink); padding-block: .5rem; }
  .site-nav .navbar-collapse .nav-link::after{ display: none; }
  .site-nav .navbar-collapse .nav-link.active,
  .site-nav .navbar-collapse .nav-link:hover{ color: var(--flare); }
  .site-nav .navbar-nav{ align-items: flex-start; }
  .site-nav .btn-sun{ margin-top: .5rem; }

  .page-header{ padding: 6rem 0 3.5rem; }

  .banner-img-sec{ margin-top: 2rem; }
  .banner-img-sec img{ max-width: 560px; }

  .cta-band{ text-align: center; }
  .cta-band .btn{ width: auto; }

  .auth-side{ padding: 2.25rem; }
  .auth-wrap{ min-height: auto; padding-block: 3rem; }
}

/* ---- mobile ---- */
@media (max-width: 767.98px){
  .section{ padding-block: 48px; }
  .section-tight{ padding-block: 36px; }
  .py-70{ padding-block: 44px; }

  .site-nav{ padding-block: .6rem; }
  .site-nav .navbar-brand img{ height: 44px; }
  .site-nav .navbar-brand{ margin-right: 0; }
  .site-nav.is-scrolled .navbar-brand img{ height: 42px; }
  .theme-toggle-mobile{ margin-left: auto; }

  .top-bar .row.align-items-center{ flex-wrap: nowrap; }
  .top-bar .row > .col-md-8{ flex: 0 0 70%; width: 70%; text-align: left; }
  .top-bar .row > .col-md-4{ flex: 0 0 30%; width: 30%; }
  .top-bar .col-md-8 span{ display: block; white-space: nowrap; }
  .top-bar .col-md-8 .me-4{ margin-right: 0 !important; }
  .top-bar .col-md-8 a{ font-size: .75rem; }
  .top-bar .social{ margin-top: 0; justify-content: flex-end; gap: .3rem; }
  .top-bar .social a{ margin-left: 0; font-size: .95rem; }

  .hero-sec h1{ font-size: 2rem; }
  .hero-sec .lead{ font-size: 1rem; }
  .scheme-ticker{ gap: .6rem; min-height: 40px; padding-inline: .75rem; }
  .ticker-track{ font-size: .82rem; }
  .ticker-item{ padding: .35rem 2rem .35rem 0; }
  .ticker-live{ padding: .26rem .5rem; }
  .hero-stats{ margin-top: 1.75rem; padding-top: 1.1rem; }
  .hero-stats .num{ font-size: 1.3rem; }
  .hero-stats .label{ font-size: .75rem; }
  .roofline svg{ height: 34px; }

  .page-header{ padding: 5.5rem 0 3rem; }

  .form-card,
  .estimator{ padding: 1.4rem; }

  .cta-band{ padding: 2rem 1.4rem; }
  .cta-band h3{ font-size: 1.35rem; }

  .step{ padding-left: 3rem; }
  .step .step-num{ width: 2.2rem; height: 2.2rem; font-size: .9rem; }
  .step-line{ left: 1.08rem; top: 2.3rem; }

  .quote-card{ padding: 1.5rem; }
  .svc-card{ padding: 1.6rem 1.3rem; }

  .footer-inner{ padding: 2.75rem 0 1.5rem; }
  .footer-bottom{ text-align: center; }

  .whatsapp-float{ width: 46px; height: 46px; font-size: 1.3rem; }
}

@media (max-width: 575.98px){
  .hero-sec h1{ font-size: 1.75rem; }
  .hero-stats .col-4{ text-align: center; }
  .section-title{ font-size: 1.45rem; }
  .stat-card .num{ font-size: 1.7rem; }
  .filter-pill{ padding: .4rem .9rem; font-size: .82rem; }
  .btn-lg{ padding: .65rem 1.3rem; font-size: 1rem; }
  .auth-side{ padding: 1.75rem; }
  .form-card{ padding: 1.15rem; }
}

@media (max-width: 380px){
  .site-nav .navbar-brand img{ height: 40px; }
  .theme-toggle-mobile{ width: 46px; height: 32px; }
  .navbar-toggler{ padding-inline: .25rem; }
}
