/**
 * Responsive: shared breakpoints.
 *
 * @package HelloElementorChild
 */

/* ─── RESPONSIEF ─────────────────────────────────────────── */
@media (max-width: 900px) {
  .hero__inner            { grid-template-columns: 1fr; gap: 40px; }
  .hero__afbeelding       { display: none; }
  .stappen__rij           { grid-template-columns: 1fr; }
  .stappen__rij::before   { display: none; }
  .testimonials__rij      { grid-template-columns: 1fr; }
  .usp-balk__inner        { grid-template-columns: repeat(2, 1fr); }
  .site-footer__inner     { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 600px) {
  :root { --sectie-pad: 52px 20px; }
  .usp-balk__inner    { grid-template-columns: 1fr; }
  .site-footer__inner { grid-template-columns: 1fr; }
  .merken-grid        { grid-template-columns: repeat(2, 1fr); }
  .hero__knoppen      { flex-direction: column; }
  .cta-banner__knoppen { flex-direction: column; align-items: center; }
}