/**
 * Content-section block — repeatable H2 + text (+ optional image) pattern.
 * BEM: content-section__element--modifier
 */
.content-section {
  padding-block: var(--space-section);
  border-top: 0.0625rem solid rgba(245, 241, 234, 0.06);
}

.content-section:first-of-type {
  border-top: none;
}

.content-section__intro {
  margin-top: var(--space-h2-text);
}

.content-section__h3-group {
  display: grid;
  gap: 1.5rem;
  margin-top: 1.5rem;
}

.content-section__h3-group h3 {
  margin-bottom: var(--space-h3-text);
}

.content-section__cta {
  margin-top: 1.5rem;
}

/* Bonus card grid (used on /bonus/) */
.bonus-grid {
  margin-top: var(--space-h2-text);
}

.bonus-card {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  background: var(--color-bg-dark);
  border-radius: var(--radius-card);
  padding: var(--space-card-padding);
}

.bonus-card__media {
  border-radius: var(--radius-card);
  overflow: hidden;
}

.bonus-card__media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.bonus-card__title {
  margin-bottom: 0;
}

.bonus-card__text {
  font-size: var(--fs-small);
  flex-grow: 1;
}