/* ERMES siteV2 — Global responsive overrides
   Applied site-wide on top of each page's inline CSS.
   Mobile-first cascading breakpoints: 1024 / 900 / 640 / 420 px.
   Goal: zero horizontal scroll, readable type, stacked layouts on small screens. */

/* ── 0. Universal safeguards ─────────────────────────────────────────── */
html, body { max-width: 100%; overflow-x: hidden; }
*, *::before, *::after { box-sizing: border-box; }
img, video, svg, canvas, iframe { max-width: 100%; height: auto; }
img[width][height] { height: auto; }
table { max-width: 100%; }
pre, code { max-width: 100%; overflow-x: auto; word-break: break-word; }
/* Allow long words / URLs to wrap instead of overflowing */
h1, h2, h3, h4, h5, h6, p, li, a, span { overflow-wrap: anywhere; word-wrap: break-word; }

/* ── 1. ≤ 1024 px — tablets : reduce huge horizontal paddings ─────── */
@media (max-width: 1024px) {
  [style*="padding: 80px"]      { padding: 56px 28px !important; }
  [style*="padding:80px"]       { padding: 56px 28px !important; }
  [style*="padding: 96px"]      { padding: 64px 28px !important; }
  [style*="padding:96px"]       { padding: 64px 28px !important; }
  [style*="padding: 0 60px"]    { padding: 0 28px !important; }
  [style*="padding: 0 48px"]    { padding: 0 24px !important; }
  [style*="padding: 0 40px"]    { padding: 0 24px !important; }
  [style*="padding: 0 36px"]    { padding: 0 24px !important; }
  [style*="padding: 0 32px"]    { padding: 0 20px !important; }
  /* Two-column asymmetric → balanced two columns */
  [style*="grid-template-columns:1fr 520px"],
  [style*="grid-template-columns: 1fr 520px"],
  [style*="grid-template-columns:1fr 480px"],
  [style*="grid-template-columns: 1fr 480px"],
  [style*="grid-template-columns:1fr 440px"],
  [style*="grid-template-columns: 1fr 440px"],
  [style*="grid-template-columns:1fr 420px"],
  [style*="grid-template-columns: 1fr 420px"],
  [style*="grid-template-columns:1fr 400px"],
  [style*="grid-template-columns: 1fr 400px"] {
    grid-template-columns: 1fr 1fr !important;
  }
  /* 4 columns → 2 columns */
  [style*="grid-template-columns: repeat(4, 1fr)"],
  [style*="grid-template-columns:repeat(4,1fr)"],
  [style*="grid-template-columns: 1fr 1fr 1fr 1fr"] {
    grid-template-columns: 1fr 1fr !important;
  }
  /* 6 columns → 3 columns */
  [style*="grid-template-columns:repeat(6,1fr)"],
  [style*="grid-template-columns: repeat(6, 1fr)"] {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

/* ── 2. ≤ 900 px — small tablets / large phones : stack multi-cols ── */
@media (max-width: 900px) {
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: repeat(2, 1fr)"],
  [style*="grid-template-columns:repeat(2,1fr)"],
  [style*="grid-template-columns: 1fr 1fr 1fr"],
  [style*="grid-template-columns:1fr 1fr 1fr"],
  [style*="grid-template-columns: repeat(3, 1fr)"],
  [style*="grid-template-columns:repeat(3,1fr)"],
  [style*="grid-template-columns: 52fr 48fr"],
  [style*="grid-template-columns: 260px 1fr"],
  [style*="grid-template-columns: 1fr 420px"],
  [style*="grid-template-columns: 1fr 480px"],
  [style*="grid-template-columns: 1fr 440px"],
  [style*="grid-template-columns: 1fr 400px"],
  [style*="grid-template-columns:1fr 520px"],
  [style*="grid-template-columns:1fr 480px"],
  [style*="grid-template-columns:1fr 440px"],
  [style*="grid-template-columns:1fr 420px"],
  [style*="grid-template-columns:1fr 400px"] {
    grid-template-columns: 1fr !important;
  }
  /* 4 cols (already reduced above) further → 2 */
  /* Auto-fill grids keep their min — nothing to do */

  /* Reduce gigantic font-sizes inline */
  [style*="font-size: 72px"], [style*="font-size:72px"] { font-size: 44px !important; }
  [style*="font-size: 64px"], [style*="font-size:64px"] { font-size: 40px !important; }
  [style*="font-size: 56px"], [style*="font-size:56px"] { font-size: 36px !important; }
  [style*="font-size: 48px"], [style*="font-size:48px"] { font-size: 32px !important; }
  [style*="font-size: 44px"], [style*="font-size:44px"] { font-size: 30px !important; }
  [style*="font-size: 40px"], [style*="font-size:40px"] { font-size: 28px !important; }
  [style*="font-size: 36px"], [style*="font-size:36px"] { font-size: 26px !important; }
  [style*="font-size: 32px"], [style*="font-size:32px"] { font-size: 24px !important; }

  [style*="padding: 60px"] { padding: 36px 20px !important; }
  [style*="padding:60px"]  { padding: 36px 20px !important; }
  [style*="padding: 48px"] { padding: 28px 18px !important; }
  [style*="padding:48px"]  { padding: 28px 18px !important; }
}

/* ── 3. ≤ 640 px — phones : collapse remaining multi-col grids ──── */
@media (max-width: 640px) {
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: repeat(2, 1fr)"],
  [style*="grid-template-columns:repeat(2,1fr)"],
  [style*="grid-template-columns: repeat(3, 1fr)"],
  [style*="grid-template-columns:repeat(3,1fr)"],
  [style*="grid-template-columns: repeat(4, 1fr)"],
  [style*="grid-template-columns:repeat(4,1fr)"],
  [style*="grid-template-columns:repeat(6,1fr)"],
  [style*="grid-template-columns: repeat(6, 1fr)"],
  [style*="grid-template-columns: 1fr auto"],
  [style*="grid-template-columns: 1fr auto auto"],
  [style*="grid-template-columns: 2fr 1fr 1fr 1fr"],
  [style*="grid-template-columns: 1fr repeat(4, auto)"] {
    grid-template-columns: 1fr !important;
  }

  /* Generic horizontal padding compression */
  [style*="padding: 0 28px"], [style*="padding:0 28px"] { padding-left: 16px !important; padding-right: 16px !important; }
  [style*="padding: 0 24px"], [style*="padding:0 24px"] { padding-left: 14px !important; padding-right: 14px !important; }
  [style*="padding: 0 20px"], [style*="padding:0 20px"] { padding-left: 14px !important; padding-right: 14px !important; }

  /* Card / section paddings */
  [style*="padding: 40px"] { padding: 22px 16px !important; }
  [style*="padding:40px"]  { padding: 22px 16px !important; }
  [style*="padding: 32px"] { padding: 20px 14px !important; }
  [style*="padding:32px"]  { padding: 20px 14px !important; }
  [style*="padding: 28px"] { padding: 18px 14px !important; }
  [style*="padding:28px"]  { padding: 18px 14px !important; }

  /* Hero / display type further reduced */
  [style*="font-size: 72px"], [style*="font-size:72px"] { font-size: 34px !important; }
  [style*="font-size: 64px"], [style*="font-size:64px"] { font-size: 32px !important; }
  [style*="font-size: 56px"], [style*="font-size:56px"] { font-size: 30px !important; }
  [style*="font-size: 48px"], [style*="font-size:48px"] { font-size: 26px !important; }
  [style*="font-size: 44px"], [style*="font-size:44px"] { font-size: 24px !important; }
  [style*="font-size: 40px"], [style*="font-size:40px"] { font-size: 24px !important; }
  [style*="font-size: 36px"], [style*="font-size:36px"] { font-size: 22px !important; }
  [style*="font-size: 32px"], [style*="font-size:32px"] { font-size: 20px !important; }
  [style*="font-size: 28px"], [style*="font-size:28px"] { font-size: 19px !important; }
  [style*="font-size: 24px"], [style*="font-size:24px"] { font-size: 18px !important; }
  [style*="font-size: 22px"], [style*="font-size:22px"] { font-size: 17px !important; }
  [style*="font-size: 20px"], [style*="font-size:20px"] { font-size: 16px !important; }

  /* Hide elements that explicitly opt-in for desktop only */
  .desktop-only { display: none !important; }

  /* Tables / wide content : allow horizontal scroll inside */
  table { display: block; overflow-x: auto; white-space: nowrap; }

  /* Flex rows wrap by default */
  [style*="display:flex"], [style*="display: flex"] { flex-wrap: wrap; }

  /* Common fixed-width inline elements → fluid */
  [style*="width: 480px"], [style*="width:480px"],
  [style*="width: 440px"], [style*="width:440px"],
  [style*="width: 420px"], [style*="width:420px"],
  [style*="width: 400px"], [style*="width:400px"],
  [style*="width: 360px"], [style*="width:360px"],
  [style*="min-width: 480px"], [style*="min-width:480px"],
  [style*="min-width: 420px"], [style*="min-width:420px"],
  [style*="min-width: 400px"], [style*="min-width:400px"] {
    width: 100% !important; min-width: 0 !important; max-width: 100% !important;
  }
}

/* ── 4. ≤ 420 px — small phones : final tightening ───────────────── */
@media (max-width: 420px) {
  [style*="padding: 24px"] { padding: 16px 12px !important; }
  [style*="padding:24px"]  { padding: 16px 12px !important; }
  [style*="padding: 20px"] { padding: 14px 12px !important; }
  [style*="padding:20px"]  { padding: 14px 12px !important; }

  [style*="font-size: 18px"], [style*="font-size:18px"] { font-size: 15px !important; }
  [style*="font-size: 16px"], [style*="font-size:16px"] { font-size: 14px !important; }
}

/* ── 5. CTA hardening (mobile) ───────────────────────────────────── */
@media (max-width: 640px) {
  /* CTA group wrappers: stack vertically, full width */
  .cta-btns, .cta-buttons, .cta-final-btns, .hero-ctas, .pricing-ctas,
  .cta-row, .cta-inner, .ctas, .hero-cta-row, .nav-cta-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    gap: 10px !important;
  }

  /* Any anchor/button used as a CTA: full width, wrap text, never overflow */
  .btn, .btn-primary, .btn-primary-lg, .btn-secondary, .btn-outline,
  .btn-ghost, .btn-violet, .btn-gold, .btn-ins, .btn-ins-lg, .btn-p, .btn-s,
  .btn-submit, .btn-start, .btn-back, .btn-next, .btn-outline-radar,
  .cta-primary, .cta-secondary, .hero-cta-primary, .bridge-cta,
  .card-cta, .pricing-cta, .results-cta, .insights-callout-cta,
  .agent-cta, .report-cta-link, .model-cta-link {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    white-space: normal !important;
    word-break: normal;
    overflow-wrap: anywhere;
    text-align: center;
    line-height: 1.25;
  }

  /* CTA blocks / boxed CTAs */
  .cta-box, .cta-section, .cta-final {
    padding: 22px 16px !important;
    text-align: center;
  }
  .cta-title  { font-size: 22px !important; line-height: 1.2 !important; }
  .cta-sub, .cta-note { font-size: 14px !important; }

  /* Nav CTA inside header stays inline (handled by nav.js) — don't full-width it */
  .ermn .ermn-cta-btn, .ermn .ermn-cta-secondary,
  .nav-cta, .nav-cta-ghost {
    width: auto !important;
  }
}

/* Very small phones: tighten CTA padding so labels never get cut */
@media (max-width: 380px) {
  .btn, .btn-primary, .btn-primary-lg, .btn-secondary, .btn-outline,
  .cta-primary, .cta-secondary, .hero-cta-primary {
    padding: 12px 14px !important;
    font-size: 14px !important;
  }
}