/* ==========================================================================
   Ordinary content pages – theme-only layer
   ==========================================================================

   Used by page.php, index.php and 404.php: pages that have no hero and
   therefore need their first section to clear the fixed header, which every
   approved page solves through its own hero.

   The frozen prototype has one class with this geometry, .scaffold, but it
   means "this page is deliberately not built yet". Reusing it for a real
   Impressum would be a lie in the markup, so the same padding formula gets an
   honest name here. Typography, colour and spacing still come from the frozen
   layers underneath.
   ========================================================================== */

.content-page {
  padding-block: calc(var(--header-height-compact) + var(--section-padding-block))
    var(--section-padding-block);
}

@media (min-width: 1024px) {
  .content-page {
    padding-block: calc(var(--header-height) + var(--section-padding-block))
      var(--section-padding-block);
  }
}

.content-page__title {
  margin-block-start: var(--space-sm);
}

/* Running text stays at a readable measure; wide and full aligned blocks from
   the editor are allowed to break out of it. */
.content-page__body {
  max-width: 44rem;
  margin-block-start: var(--space-xl);
}

.content-page__body > * + * {
  margin-block-start: var(--space-md);
}

.content-page__body > h2,
.content-page__body > h3 {
  margin-block-start: var(--space-2xl);
}

.content-page__body > .alignwide,
.content-page__body > .alignfull {
  max-width: none;
}

/* Legal pages carry content the approved marketing pages never do: authority
   and register URLs that are one unbreakable token, and tables of data
   categories or retention periods. Reproduced at 375px, a single long URL and a
   three-column table pushed the document to 620px wide. Both are contained
   here rather than allowed to scroll the whole page sideways. */

.content-page__body {
  overflow-wrap: anywhere;
}

.content-page__body table {
  width: 100%;
  border-collapse: collapse;
}

/* A table that genuinely cannot fit scrolls inside its own box. tabindex and
   role make that box reachable and announced for keyboard and screen-reader
   users, which a bare overflow container is not. */
.content-page__table {
  overflow-x: auto;
  max-width: 100%;
}

.content-page__table:focus-visible {
  outline: 2px solid var(--color-gold);
  outline-offset: 2px;
}

.content-page__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-block-start: var(--space-xl);
}