/* ═══ GOLF MOBILE ═══ */
#golf-ham   { display: none; }
#golf-mmenu { display: none; }

@media (max-width: 768px) {

  /* ── PREVENT OVERFLOW ── */
  html, body { overflow-x: hidden !important; }
  * { box-sizing: border-box !important; }
  section { overflow: hidden !important; }
  /* Catch any flex row that still escapes */
  div[style*="display: flex"][style*="align-items: center"] { min-width: 0 !important; }
  div[style*="flex: 1"] { min-width: 0 !important; overflow: hidden !important; }

  /* ── LOGOS ── */
  nav img   { height: 26px !important; width: auto !important; }
  footer img { height: 26px !important; width: auto !important; }

  /* ── NAV ── */
  #golf-navlinks { display: none !important; }
  #golf-ham {
    display: flex !important; flex-direction: column;
    gap: 5px; background: none; border: none; cursor: pointer; padding: 8px;
  }
  #golf-ham span {
    display: block; width: 24px; height: 2px;
    background: #0E0C0B; border-radius: 2px; transition: all 0.25s;
  }
  #golf-mmenu {
    position: fixed; top: 68px; left: 0; right: 0; z-index: 998;
    background: rgba(250,248,245,0.97); backdrop-filter: blur(14px);
    border-bottom: 1px solid #E5E0D8; padding: 12px 20px 24px;
  }
  #golf-mmenu button {
    display: block !important; width: 100% !important; text-align: left !important;
    padding: 14px 0 !important; font-size: 16px !important; border: none !important;
    border-bottom: 1px solid #E5E0D8 !important; background: none !important;
    cursor: pointer !important; font-family: inherit !important; color: #0E0C0B !important;
  }
  #golf-mmenu .golf-cta-btn {
    display: block !important; margin-top: 16px !important; width: 100% !important;
    text-align: center !important; padding: 12px !important; background: #C2410C !important;
    color: white !important; border-radius: 8px !important; font-weight: 600 !important;
    font-size: 14px !important; border: none !important; cursor: pointer !important;
    font-family: inherit !important;
  }

  /* ── MOCKUPS: zoom down, no scroll, no sidebar ── */

  /* 1. Hide the 180px sidebar inside DashboardMockup */
  div[style*="width: 180px"][style*="flex-shrink: 0"] {
    display: none !important;
  }

  /* 2. Remove fixed heights so content isn't clipped after zoom */
  div[style*="height: 380px"],
  div[style*="height: 340px"],
  div[style*="height: 320px"],
  div[style*="height: 300px"] {
    height: auto !important;
    overflow-y: visible !important;
  }

  /* 3. Zoom only BrowserFrame (has box-shadow). Episode cards have no box-shadow — excluded. */
  div[style*="border-radius: 12px"][style*="overflow: hidden"][style*="box-shadow"] {
    zoom: 0.55 !important;
  }

  /* ── ALL GRIDS → single column ── */
  div[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  /* ── SECTION PADDING ── */
  section { padding-left: 20px !important; padding-right: 20px !important; }
  section > div { padding-left: 0 !important; padding-right: 0 !important; }

  /* ── LARGE FLEX GAPS → stack ── */
  div[style*="display: flex"][style*="gap: 80px"],
  div[style*="display: flex"][style*="gap: 60px"],
  div[style*="display: flex"][style*="gap: 48px"],
  div[style*="display: flex"][style*="gap: 40px"] {
    flex-direction: column !important;
    gap: 24px !important;
  }

  /* ── TYPOGRAPHY ── */
  h1 { font-size: 2rem !important; line-height: 1.2 !important; }
  h2 { font-size: 1.5rem !important; }

  /* ── MAX WIDTHS → full ── */
  div[style*="max-width: 480px"],
  div[style*="max-width: 580px"],
  div[style*="max-width: 700px"],
  div[style*="max-width: 560px"],
  p[style*="max-width"] { max-width: 100% !important; }

  /* ── FOOTER ── */
  footer { padding: 40px 20px 28px !important; }
  footer > div > div[style*="grid"] {
    grid-template-columns: 1fr 1fr !important;
    gap: 28px !important;
  }
  footer > div > div[style*="border-top"] {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 6px !important;
  }


  /* ── PLATFORM PAGE: prevent side scroll from drug map fixed widths ── */
  div[style*="flex: 0 0 180px"],
  div[style*="flex: 0 0 120px"],
  div[style*="flex: 0 0 28px"],
  div[style*="flex: 0 0 18px"] {
    flex: 0 0 auto !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }
  div[style*="display: flex"][style*="align-items: center"][style*="gap: 10px"][style*="padding: 7px"] {
    flex-wrap: wrap !important;
  }

  /* ── COVERAGE ROWS ── */
  div[style*="padding: 16px 20px"][style*="border-radius: 9px"] {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  div[style*="padding: 16px 20px"][style*="border-radius: 9px"] span[style*="cursor: pointer"] {
    font-size: 11px !important;
    padding: 3px 8px !important;
  }
}

@media (min-width: 769px) and (max-width: 1024px) {
  div[style*="grid-template-columns: repeat(4"] { grid-template-columns: repeat(2,1fr) !important; }
  div[style*="grid-template-columns: repeat(3"] { grid-template-columns: repeat(2,1fr) !important; }
}