/* Mobile responsive layer for Innov8 UK Group — overrides inline desktop styles on small screens.
   NOTE: selectors match the React-serialized style attribute: space after colon, 0-prefixed decimals, rgb() colors. */
@media (max-width: 768px) {
  /* Prevent the off-screen nav drawer (or any wide child) from creating horizontal scroll */
  html, body { overflow-x: clip !important; }

  /* Collapse multi-column layouts to a single column */
  div[style*="grid-template-columns: repeat("],
  div[style*="grid-template-columns: 1.05fr"],
  div[style*="grid-template-columns: 1.2fr"],
  div[style*="grid-template-columns: 1.1fr"],
  div[style*="grid-template-columns: 1fr 1fr"],
  div[style*="grid-template-columns: auto 1fr"] { grid-template-columns: 1fr !important; }
  /* Items that spanned multiple columns must not force extra tracks */
  a[style*="grid-column: span"], div[style*="grid-column: span"] { grid-column: auto !important; }

  /* Page gutters + compress the tall desktop vertical padding on mobile */
  div[style*="max-width: 1360px"] { padding-left: 20px !important; padding-right: 20px !important; padding-top: 44px !important; padding-bottom: 44px !important; }

  /* Full-bleed bands: pull their vertical padding in too (horizontal left as-is) */
  div[style*="padding: 88px 48px"],
  div[style*="padding: 96px 48px"],
  div[style*="padding: 80px 48px"],
  div[style*="padding: 72px 48px"],
  div[style*="padding: 64px 48px"],
  div[style*="padding: 100px 48px"],
  div[style*="padding: 110px 48px"],
  div[style*="padding: 120px 48px"] { padding-top: 46px !important; padding-bottom: 46px !important; }

  /* Tighten oversized column/row gaps once stacked */
  div[style*="gap: 56px"] { gap: 30px !important; }
  div[style*="gap: 48px"] { gap: 28px !important; }
  div[style*="gap: 40px"] { gap: 24px !important; }

  /* Headline scale — catch-all so no inline size slips through */
  h1 { font-size: clamp(36px, 10.5vw, 96px) !important; line-height: 1.02 !important; }
  h2 { font-size: clamp(26px, 8vw, 54px) !important; line-height: 1.06 !important; }

  /* Nav: hide desktop links on mobile — replaced by the hamburger drawer */
  div[style*="gap: 30px"][style*="font-weight: 600"] { display: none !important; }

  /* Hide oversized decorative outline text & watermarks */
  div[style*="font-size: 200px"], div[style*="font-size: 420px"] { display: none !important; }

  /* Cost breakdown table: hide the desktop header row, stack each row's cells */
  div[style*="grid-template-columns: 2fr 1.1fr"][style*="background: rgb(19, 17, 18)"] { display: none !important; }
  div[style*="grid-template-columns: 2fr 1.1fr"] { grid-template-columns: 1fr !important; gap: 6px !important; }

  /* Instant quote dropdown fits the screen (border-box so padding doesn't overflow) */
  #iq-panel { box-sizing: border-box !important; width: calc(100vw - 20px) !important; left: 10px !important; right: 10px !important; max-width: none !important; padding: 18px 16px !important; max-height: calc(100vh - 90px) !important; }
  #iq-panel input, #iq-panel select, #iq-panel button { box-sizing: border-box !important; }

  /* Hero radial glow: span full page width on mobile, centred near the top */
  div[style*="radial-gradient(800px 460px at 85% 15%"] {
    background: radial-gradient(200vw 560px at 50% -8%, rgba(111,172,70,.24), transparent 72%) !important;
  }

  /* Media never overflows */
  iframe, img { max-width: 100% !important; }

  /* Hero figure: pull it into view on mobile, bottom-right, behind the text */
  img[alt="Operative in protective suit and respirator"] {
    height: 380px !important; width: auto !important; max-width: none !important;
    right: -46px !important; bottom: 0 !important; opacity: .6 !important;
  }
  /* Trim the tall hero padding so the section frames nicely on a phone */
  /* Home-hero mobile rules now live in Home.dc.html <style> for cache-free iteration */
  /* Trust strip hidden on mobile (Home only) */
  div[data-trust-strip] { display: none !important; }
  /* Remove the "Talk to the team / before you decide" CTA band on mobile — every page */
  div:has(> div[style*="radial-gradient(500px 260px at 15% 50%"]) { display: none !important; }

  /* --- Top contact bar hidden on mobile; Instant Quote button lives in the header (mobile-nav.js) --- */
  div[style*="padding: 10px 48px"] { display: none !important; }

  /* --- Nav row: tighter, logo + burger only --- */
  div[style*="z-index: 50"] div[style*="padding: 14px 48px"],
  div[style*="padding: 14px 48px"] { padding: 12px 18px !important; }

  /* --- Footer: identical layout on every page (matches Home) --- */
  a[data-pm-desktop] { display: none !important; }
  a[data-pm-mobile] { display: block !important; }
  div[data-footer-bottom] { padding-top: 0 !important; margin-top: -24px !important; }
}