/* Block: content-section — wiederkehrender Block H2 + Text + Bild */
.content-section {
  padding-block: calc(var(--space-section) / 2);
  border-top: 1px solid var(--color-border);
}
.content-section:first-of-type { border-top: none; }

.content-section__media {
  margin-block: var(--space-h2-text) var(--space-paragraph);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--color-bg-dark);
}
.content-section__media img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}
.content-section__intro { margin-top: var(--space-h2-text); }
.content-section h3 { margin-top: var(--space-section); margin-bottom: var(--space-h3-text); }
.content-section h3:first-of-type { margin-top: calc(var(--space-section) / 1.5); }
.content-section .btn { margin-top: var(--space-paragraph); }

.content-section ul,
.content-section ol {
  padding-left: 1.3rem;
  margin-bottom: var(--space-paragraph);
  display: grid;
  gap: 8px;
}
.content-section ul { list-style: disc; }
.content-section ol { list-style: decimal; }
.content-section li { padding-left: 4px; }

/* Mobile: Bild steht nach dem H2, aber vor dem Text */
@media (max-width: 767px) {
  .content-section__media { order: -1; }
}