/* === Mobile Full-Width Fix (non-destructive) === */
html, body { max-width: 100%; overflow-x: hidden; }

@media (max-width: 768px) {
  /* Make all containers span screen width on mobile */
  .container { max-width: 100% !important; padding-left: 16px; padding-right: 16px; }

  /* Header container should also be full width */
  .site-header, .site-header .container { max-width: 100% !important; }

  /* Make hero background truly edge-to-edge without changing markup */
  .hero { 
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    width: 100vw;
  }

  /* Avoid any accidental fixed widths causing horizontal scroll */
  [style*="width:"] { max-width: 100% !important; }
}