/* Responsive laag bovenop het desktop-ontwerp (alle regels staan onder een media query,
   behalve het losmaken van de vaste 1320px-breedte). */

/* Geen horizontale scroll meer op laptops smaller dan 1320px en op mobiel */
html, body,
[style*="min-width: 1320px"], [style*="min-width:1320px"] { min-width: 0 !important; }

/* Hamburger + menu: standaard verborgen op desktop */
.il-burger, .il-menu { display: none; }

@media (max-width: 900px) {
  html, body { overflow-x: clip; }
  body { -webkit-text-size-adjust: 100%; }

  /* Rasters worden 1 kolom; statistiek-blokken 2 kolommen */
  [style*="grid-template-columns"] { grid-template-columns: 1fr !important; gap: 24px !important; }
  [style*="repeat(4"] { grid-template-columns: 1fr 1fr !important; gap: 16px !important; }
  [style*="1.5fr"] > :first-child, [style*="1.25fr"] > :first-child { grid-column: 1 / -1; }
  [style*="1.5fr"], [style*="1.25fr"] { grid-template-columns: 1fr 1fr !important; }

  /* Secties: minder witruimte */
  section { padding-top: 64px !important; padding-bottom: 56px !important; }
  section:first-of-type { padding-top: 150px !important; }

  /* Vaste breedtes loslaten */
  [style*="width: 375px"], [style*="width:375px"],
  [style*="width: 300px"], [style*="width:300px"] { width: auto !important; max-width: 100% !important; }
  img, video, svg { max-width: 100%; }

  /* Navigatie: tekstlinks en CTA weg, hamburger erin */
  a.scp1, div:has(> a.scp1):not(:has(> a.scp2)), a.scp2 { display: none !important; }
  .il-burger {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; margin-left: 4px; border: 0; border-radius: 999px;
    background: #14150f; cursor: pointer; padding: 0;
  }
  .il-burger span, .il-burger span::before, .il-burger span::after {
    content: ""; display: block; width: 18px; height: 2px; background: #c9f24a;
    border-radius: 2px; position: relative; transition: transform .2s ease, background .2s ease;
  }
  .il-burger span::before { position: absolute; top: -6px; }
  .il-burger span::after { position: absolute; top: 6px; }
  .il-burger[aria-expanded="true"] span { background: transparent; }
  .il-burger[aria-expanded="true"] span::before { transform: translateY(6px) rotate(45deg); }
  .il-burger[aria-expanded="true"] span::after { transform: translateY(-6px) rotate(-45deg); }

  .il-menu {
    position: fixed; left: 12px; right: 12px; top: 116px; z-index: 89;
    flex-direction: column; gap: 4px; padding: 14px;
    background: rgba(255,255,255,.98); border: 1px solid rgba(20,21,15,.09);
    border-radius: 24px; box-shadow: 0 24px 60px rgba(20,21,15,.22);
    max-height: calc(100vh - 140px); overflow-y: auto;
  }
  .il-menu.open { display: flex; }
  .il-menu a {
    text-decoration: none; color: #14150f; font-weight: 600; font-size: 17px;
    padding: 14px 16px; border-radius: 14px;
  }
  .il-menu a:hover, .il-menu a:active { background: #f4f6ee; }
  .il-menu a.il-cta { background: #c9f24a; text-align: center; font-weight: 700; margin-top: 6px; }

  /* Zwevende chat-knop en toppbanner compacter */
  [style*="z-index: 92"], [style*="z-index:92"] { font-size: 12.5px !important; padding: 8px 14px !important; }
}
