main {
  padding-bottom: var(--space-16);
}

.hero--verantwortung {
  padding-top: var(--space-16);
  padding-bottom: var(--space-12);
}

.hero--verantwortung-content {
  max-width: 720px;
}

.hero-cta-row {
  margin-top: var(--space-4);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}

.hero-badges {
  margin-top: var(--space-4);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.section-intro,
.section-definition,
.section-entertainment,
.section-prevention,
.section-support,
.section-legal,
.section-responsibility,
.section-rules,
.section-transparency,
.section-keywords {
  padding-top: var(--space-12);
  padding-bottom: var(--space-12);
}

.section-intro-grid,
.definition-grid,
.entertainment-grid,
.prevention-grid,
.support-grid,
.legal-grid,
.responsibility-grid,
.rules-grid,
.transparency-grid {
  align-items: flex-start;
  gap: var(--space-8);
}

.section-intro-card,
.definition-card,
.entertainment-card,
.support-card,
.responsibility-card,
.transparency-card {
  height: 100%;
}

.definition-image,
.responsibility-image {
  width: 100%;
  object-fit: cover;
}

.prevention-wrapper,
.support-grid-wrapper {
  max-width: var(--container-max-width);
}

.prevention-header {
  margin-bottom: var(--space-6);
  max-width: 720px;
}

.keyword-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.transparency-cta {
  margin-top: var(--space-4);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}

@media (min-width: 1024px) {
  .hero--verantwortung {
    padding-top: var(--space-20);
    padding-bottom: var(--space-16);
  }
}