/* ==========================================================================
   Elite Living Realty — mobile responsiveness safety net (additive only).

   Goals:
     • No page scrolls or clips off sideways on a phone.
     • The header's burger menu always stays on-screen and reachable.
     • The stat counters (Transactions, Clients Served, …) stay inside their
       cells on small screens instead of spilling past the edge.

   Notes:
     • Uses `overflow-x: clip` (NOT hidden) so any `position: sticky`
       elements on the site keep working.
     • Mobile rules use `!important` only so they reliably win inside each
       page's own media queries. Nothing on desktop is affected.
   ========================================================================== */

/* Never let a page scroll sideways. `clip` is sticky-safe, unlike `hidden`. */
html, body { overflow-x: clip; }

/* Embeds / media can't force the layout wider than the viewport.
   (Background & hero cover images are intentionally left untouched.) */
svg, video, canvas, iframe { max-width: 100%; }

@media (max-width: 680px) {
  /* --- Header: tighten spacing so logo + Sign In + burger all fit, and the
         burger never gets pushed off the right edge. --- */
  .nav,
  header.scrolled .nav { padding-left: 16px !important; padding-right: 16px !important; }
  .nav-cta { gap: 12px !important; }
  .logo-img { height: 26px !important; }

  /* --- Stat counters: shrink to fit the 2-up mobile grid. --- */
  .stat { padding-left: 10px !important; padding-right: 10px !important; }
  .stat .num { font-size: clamp(24px, 7.2vw, 46px) !important; }
}

/* Narrow phones — guarantee the big numbers never spill. */
@media (max-width: 380px) {
  .stat .num { font-size: 24px !important; }
}
