/* NebularAds Redesign — mobile fixes.
   The design uses inline desktop styles; these rules override them ONLY on
   small screens (max-width media queries), so desktop is untouched.
   Attribute selectors + !important are required to beat inline styles. */

@media (max-width: 810px) {
  /* Kill horizontal scrolling entirely */
  html, body { overflow-x: hidden !important; max-width: 100vw !important; }

  img, video, iframe, svg { max-width: 100% !important; height: auto; }

  /* Stack every multi-column grid into a single column */
  [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }

  /* Let flex rows wrap instead of overflowing */
  [style*="display:flex"], [style*="display: flex"] { flex-wrap: wrap !important; }

  /* Fixed min-widths force overflow on phones */
  [style*="min-width"] { min-width: 0 !important; }

  /* Typography scale-down (desktop px -> mobile px) */
  [style*="font-size:64px"] { font-size: 36px !important; }
  [style*="font-size:60px"] { font-size: 35px !important; }
  [style*="font-size:56px"] { font-size: 34px !important; }
  [style*="font-size:54px"] { font-size: 33px !important; }
  [style*="font-size:52px"] { font-size: 32px !important; }
  [style*="font-size:50px"] { font-size: 31px !important; }
  [style*="font-size:48px"] { font-size: 30px !important; }
  [style*="font-size:46px"] { font-size: 29px !important; }
  [style*="font-size:44px"] { font-size: 28px !important; }
  [style*="font-size:42px"] { font-size: 27px !important; }
  [style*="font-size:40px"] { font-size: 26px !important; }
  [style*="font-size:38px"] { font-size: 25px !important; }
  [style*="font-size:36px"] { font-size: 24px !important; }
  [style*="font-size:34px"] { font-size: 23px !important; }
  [style*="font-size:32px"] { font-size: 22px !important; }
  [style*="font-size:30px"] { font-size: 21px !important; }
  [style*="font-size:28px"] { font-size: 20px !important; }
  [style*="font-size:26px"] { font-size: 19px !important; }

  /* Tighten horizontal padding and large gaps */
  [style*="padding:0 32px"] { padding-left: 18px !important; padding-right: 18px !important; }
  [style*="gap:64px"], [style*="gap:56px"], [style*="gap:52px"],
  [style*="gap:48px"], [style*="gap:44px"], [style*="gap:40px"] { gap: 24px !important; }

  /* Sticky header: allow it to wrap into two rows and stay compact */
  header > div {
    height: auto !important;
    min-height: 58px;
    padding-top: 8px !important;
    padding-bottom: 10px !important;
    row-gap: 6px !important;
    justify-content: center !important;
  }
  header nav { gap: 14px !important; row-gap: 4px !important; justify-content: center !important; }
  header nav a { font-size: 13px !important; }
  header a[href*="contact"] { font-size: 13px !important; padding: 9px 14px !important; }
}

@media (max-width: 480px) {
  /* Extra tightening for small phones */
  [style*="padding:0 32px"] { padding-left: 14px !important; padding-right: 14px !important; }
  [style*="font-size:54px"], [style*="font-size:52px"] { font-size: 30px !important; }
  [style*="font-size:19px"] { font-size: 16.5px !important; }
  [style*="font-size:18px"] { font-size: 16px !important; }
  /* Full-width primary buttons for easy tapping */
  a[style*="padding:16px 28px"], a[style*="padding:16px 26px"] {
    width: 100%;
    justify-content: center !important;
  }
}
