/* ==========================================================================
   Laxmi Infraventure — mobile responsiveness layer
   The source design (support.js driven) ships with NO breakpoints — it is
   built for desktop widths only. Everything below targets that exact
   markup via attribute selectors on the original inline styles, so the
   desktop look stays byte-for-byte identical and only small screens change.
   ========================================================================== */

@media (max-width: 980px) {
  /* Two-column grids (slide-out menu, footer columns) stack */
  [style*="grid-template-columns:1.15fr 1fr"],
  [style*="grid-template-columns:1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
  [style*="border-left:1px solid rgba(255,255,255,.1)"] {
    border-left: none !important;
    border-top: 1px solid rgba(255,255,255,.1) !important;
    margin-top: 24px !important;
    padding-top: 24px !important;
  }

  /* Page gutters: 40px -> 20px */
  [style*="padding:0 40px"],
  [style*="padding: 0 40px"] { padding-left: 20px !important; padding-right: 20px !important; }
  [style*="padding:22px 40px"] { padding-left: 20px !important; padding-right: 20px !important; }

  /* Section rhythm: 112px -> 64px */
  [style*="padding:112px 0"] { padding-top: 64px !important; padding-bottom: 64px !important; }

  /* Slide-out menu panel outer padding */
  [style*="padding:104px 40px 40px"] { padding: 84px 16px 24px !important; }
  [style*="padding:44px 0 26px"] { padding: 28px 0 20px !important; }
  [style*="padding:0 56px"] { padding: 0 24px !important; }

  /* Headline scale */
  [style*="font-size:60px"] { font-size: 34px !important; }
  [style*="font-size:56px"] { font-size: 32px !important; }
  [style*="font-size:52px"] { font-size: 30px !important; }
  [style*="font-size:48px"] { font-size: 28px !important; }
  [style*="font-size:44px"] { font-size: 26px !important; }
  [style*="font-size:42px"] { font-size: 24px !important; }
  [style*="font-size:24px"] { font-size: 19px !important; } /* menu links */

  /* Header / logo */
  header[style*="padding:22px 40px"] { padding: 14px 18px !important; }
  img[style*="height:78px"] { height: 46px !important; }
  img[style*="height:96px"] { height: 56px !important; }

  /* Buttons that carry wide fixed horizontal padding */
  [style*="padding:18px 34px"] { padding: 15px 22px !important; }
  [style*="padding:15px 30px"] { padding: 13px 20px !important; }

  /* Hero text block: pull in from the 48px side margins and lower the
     large bottom offset a bit so the heading + dots don't crowd the
     bottom edge on short mobile screens */
  [style*="left:48px;right:48px;bottom:120px"] { left: 20px !important; right: 20px !important; bottom: 88px !important; }

  /* Backdrop blur (glass header, menu overlay) is one of the more
     GPU-expensive things a phone can be asked to do continuously while
     scrolling — it forces the browser to recomposite everything behind
     it every frame. Turning it off on small screens is the single
     biggest lag fix here; the semi-opaque background colour underneath
     still reads fine without the blur. */
  [style*="blur(18px)"],
  [style*="blur(6px)"] { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }

  /* The three sticky 100vh panels + 70vh spacer each (~440vh of scroll
     total) are heavy to paint on mobile GPUs. Shorten the dwell so the
     section doesn't feel "stuck" while scrolling through it. */
  [style*="margin-bottom:70vh"] { margin-bottom: 30vh !important; }
}

@media (max-width: 560px) {
  [style*="font-size:34px"] { font-size: 28px !important; }
  [style*="font-size:30px"] { font-size: 25px !important; }
  [style*="font-size:28px"] { font-size: 23px !important; }
  [style*="font-size:26px"] { font-size: 21px !important; }

  /* Stack any remaining flex rows that are still forcing two items side by side
     with generous gaps (hero CTA row, contact/quote button row) */
  [style*="display:flex"][style*="gap:20px"],
  [style*="display:flex"][style*="gap:24px"] { flex-wrap: wrap !important; }
}