/* Vrouwveiliger – correctie hero, doelgroepkaarten en sectieafstand */

/* Hero-kop iets breder:
   Waar, wanneer en
   waardoor voelen
   vrouwen zich onveilig? */
.hero h1 {
  max-width: 840px;
}

/* Doelgroepkaarten iets lager, zodat de onderkant van de hero rustiger wordt
   en de noodtekst niet wordt verdrongen. */
.audience-routes {
  transform: translateY(16px);
  margin-bottom: 16px;
}

/* Meer witruimte vóór 'Waarom ervaringen tellen'. */
.why-section {
  padding-top: 72px;
}

@media (max-width: 980px) {
  .hero h1 {
    max-width: 760px;
  }

  .audience-routes {
    transform: translateY(12px);
    margin-bottom: 12px;
  }

  .why-section {
    padding-top: 60px;
  }
}

@media (max-width: 767px) {
  .hero h1 {
    max-width: 100%;
  }

  .audience-routes {
    transform: none;
    margin-bottom: 0;
  }

  .why-section {
    padding-top: 44px;
  }
}

/* Consistente afstand tussen kop en eerste tekst, gelijk aan de hero (24px). */
.audience-card h2,
.why-section__copy h2,
.app-section__copy h2,
.municipal-results__copy h2,
.privacy-section > .site-container > h2 {
  margin-bottom: 24px;
}

/* De methodekop gebruikt een eigen horizontale compositie; ook daar 24px tussen titel en tekst. */
.method-v-header__title-row h2 {
  margin-bottom: 24px;
}

/* Ruimere overgang tussen de doelgroepkaarten en 'Waarom ervaringen tellen'. */
.audience-routes {
  margin-bottom: 42px;
}

.why-section {
  padding-top: 92px;
}

@media (max-width: 980px) {
  .audience-routes {
    margin-bottom: 34px;
  }

  .why-section {
    padding-top: 76px;
  }
}

@media (max-width: 767px) {
  .audience-routes {
    margin-bottom: 20px;
  }

  .why-section {
    padding-top: 58px;
  }
}