/* =========================================================================
   AEROZONE EQUIPMENT PVT. LTD. — RESPONSIVE STYLESHEET (v3 / CLEANED)
   Load order: bootstrap.min.css -> style.css -> THIS FILE (last).

   Sections that already carry their own inline <style> + media queries in
   index.html (hero slider, #products, #client-logos, #why-choose-us,
   #testimonials) are intentionally NOT duplicated here — this file only
   covers layout that lives in style.css: header, about, faq, contact,
   footer, fab, stats.
   Breakpoints: 1200 / 992 / 768 / 576 / 420
   ========================================================================= */

/* =============== 0. GLOBAL — HORIZONTAL SCROLL GUARD (always on) ===== */
html, body{
  overflow-x: hidden;
  width: 100%;
  max-width: 100%;
}
*, *::before, *::after{ box-sizing: border-box; }
img, svg, video, iframe, canvas{ max-width: 100%; height: auto; }
.container-xl, section, .row{ max-width: 100%; }

/* =============== 1. 1200px — large desktop / laptop =============== */
@media (max-width:1200px){
  .about-bento{grid-template-columns:1fr;}
  .about-bento-panel{order:2;}
  .about-bento-list{order:1;}
}

/* =============== 2. 992px — tablets landscape =============== */
@media (max-width:992px){
  .cursor-glow{display:none;}
  .section-pad{padding:56px 0;}

  .top-bar-info span{display:none;}
  .top-bar-inner{padding:8px 20px;}
  .main-header-row{padding:12px 20px;}
  .main-nav{display:none !important;}
  .hamburger{display:flex !important;}

  .mv-ribbon{grid-template-columns:1fr 1fr;}
  .mv-ribbon .mv-card:last-child{grid-column:1 / -1; max-width:480px; margin:0 auto;}
  .abp-stats{grid-template-columns:1fr 1fr;}

  .fab-stack{right:18px; bottom:20px;}
}

/* =============== 3. 768px — tablets / large phones =============== */
@media (max-width:768px){
  .section-pad{padding:44px 0;}

  .top-bar-inner{padding:7px 18px;}
  .top-bar-info a[href^="mailto"]{display:none;}
  .btn-brochure span{display:none;}
  .btn-brochure{padding:8px 12px;}
  .main-header-row{padding:10px 18px;}
  .brand img{height:42px !important;}

  .about-bento-panel, .about-bento-list{padding:26px 22px;}
  .abp-since strong{font-size:2.1rem;}
  .mv-ribbon{grid-template-columns:1fr; gap:18px; margin-top:40px;}
  .mv-ribbon .mv-card:last-child{grid-column:auto; max-width:none; margin:0;}

  .contact-glass{padding:28px 22px;}
  .map-embed{height:150px;}

  .site-footer{padding:52px 0 0;}
  .footer-bottom{flex-direction:column; align-items:flex-start;}
  .footer-bottom a{margin:0 18px 0 0;}

  .fab-stack{right:16px; bottom:18px;}
}

/* =============== 4. 576px — phones =============== */
@media (max-width:576px){
  html{font-size:15px;}
  .container-xl{padding:0 16px;}

  .eyebrow{font-size:.72rem;}
  .section-title{font-size:clamp(1.6rem,6vw,2.1rem);}

  .top-bar-info a:first-child{font-size:.74rem;}
  .top-bar-social{display:none !important;}

  .brand img{height:38px !important;}
  .mobile-menu{padding:90px 24px 32px;}
  .mobile-menu .m-link{font-size:1.05rem; padding:12px 0;}

  .about-bento-list{padding:20px 18px;}
  .abl-item{gap:14px; padding:16px 0;}
  .abl-num{width:32px; font-size:1.2rem;}
  .abp-stats{grid-template-columns:1fr 1fr; gap:12px;}
  .abp-stat{padding:12px;}

  .stats-strip .num, .stat-box .num{font-size:1.7rem;}

  .marquee-track .cl{font-size:1rem; gap:6px;}

  .faq-q{font-size:.92rem;}

  .contact-glass{padding:24px 18px; border-radius:16px;}
  .map-embed{height:120px;}
  .btn-submit{padding:13px; font-size:.85rem;}

  .newsletter-input{flex-direction:column; border-radius:12px;}
  .newsletter-input input{padding:12px;}
  .newsletter-input button{padding:10px; width:100%;}

  .brochure-modal-content .modal-body{padding:24px;}
  .modal-body{padding:20px;}

  .fab-stack{right:14px; bottom:14px; gap:10px;}
  .fab-btn{width:46px; height:46px; font-size:1.1rem;}
  .fab-top{width:40px; height:40px;}
}

/* =============== 5. 420px — small phones =============== */
@media (max-width:420px){
  .container-xl{padding:0 16px;}
  .top-bar-inner{padding:6px 16px;}
  .top-bar-info{gap:12px;}
  .main-header-row{padding:8px 16px;}

  .abp-stats{grid-template-columns:1fr;}
  .about-bento-panel{padding:22px 18px;}

  .stat-box .num, .stats-strip .num{font-size:1.5rem;}
  .stat-box .lbl, .stats-strip .lbl{font-size:.68rem;}

  .fab-btn{width:46px; height:46px; font-size:1.15rem;}
  .fab-top{width:40px; height:40px;}
}