/* ============================================================
   Mobiele overrides — Verbouwassistent
   De site is opgebouwd met inline styles; onder de 900px
   overschrijven deze regels ze met !important.
   Wordt op elke pagina geladen via de helmet (mobile.css link).
   ============================================================ */

@media (max-width: 900px) {

  html, body { overflow-x: hidden; }

  /* --- Alle meerkoloms-grids naar één kolom --- */
  [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  /* Tekst altijd vóór de afbeelding in afwisselende secties */
  [style*="order:2"] { order: 0 !important; }

  /* --- Typografie schaalt mee --- */
  h1 { font-size: clamp(31px, 8vw, 44px) !important; line-height: 1.12 !important; }
  h2 { font-size: clamp(25px, 6.5vw, 32px) !important; line-height: 1.18 !important; }

  /* --- Grote sfeerfoto's minder hoog --- */
  img[style*="object-fit:cover"] { height: min(64vw, 380px) !important; }

  /* Zwevende kaartjes binnen het beeld houden */
  [style*="position:absolute"][style*="left:-"]  { left: 12px !important; }
  [style*="position:absolute"][style*="right:-"] { right: 12px !important; }

  /* --- Rustiger verticaal ritme --- */
  section[style*="padding"]:not([style*="#141A15"]) {
    padding-top: 44px !important;
    padding-bottom: 44px !important;
  }
  header[style*="padding:72px"] { padding-top: 44px !important; }

  /* Grote kaart-paddings compacter */
  [style*="padding:56px"]      { padding: 26px 20px !important; }
  [style*="padding:52px 44px"] { padding: 32px 20px !important; }
  [style*="padding:40px 44px"] { padding: 26px 20px !important; }
  [style*="padding:44px"]      { padding: 28px 22px !important; }

  /* --- Vergelijkingstabel (Prijzen) horizontaal scrollbaar --- */
  .table-scroll {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  .table-scroll table { min-width: 620px; }
}

/* Extra klein (smalle telefoons) */
@media (max-width: 380px) {
  h1 { font-size: 29px !important; }
}
