/* ========================================================================== 
   NASHORN Artikel responsive migration
   Desktop remains owned by aktuelles.css. This file only rebuilds the article
   content through the canonical responsive viewport families.
   ========================================================================== */

/* Shared article grammar for every non-desktop canonical family. */
@media (min-width: 768px) and (max-width: 1199.98px) and (orientation: landscape) and (min-height: 601px),
       (min-width: 1024px) and (max-width: 1199.98px) and (orientation: portrait),
       (max-width: 767.98px),
       (min-width: 768px) and (max-width: 1023.98px) and (orientation: portrait),
       (min-width: 768px) and (max-width: 1199.98px) and (orientation: landscape) and (max-height: 600px) {
  .article-page .article-header {
    padding-top: calc(var(--header-h) + clamp(24px, 3.5vw, 40px));
    padding-bottom: var(--site-section-space);
  }

  .article-page .article-header__inner {
    min-width: 0;
  }

  .article-page .article-header__copy,
  .article-page .article-feature,
  .article-page .article-feature img {
    min-width: 0;
    max-width: 100%;
  }

  .article-page .article-header .eyebrow {
    margin-bottom: var(--site-page-eyebrow-gap);
  }

  .article-page .article-header__date {
    margin-bottom: var(--site-page-eyebrow-gap);
    font-size: var(--site-meta-size);
    line-height: var(--site-meta-line-height);
    letter-spacing: var(--site-meta-letter-spacing);
  }

  .article-page .article-header h1 {
    max-width: 14ch;
  }

  .article-page .article-header__lead {
    max-width: 58ch;
    margin-top: var(--site-title-copy-gap);
  }

  .article-page .article-feature {
    min-height: 0;
    aspect-ratio: 4 / 3;
  }

  .article-page .article-feature img {
    height: 100%;
    min-height: 0;
    object-fit: cover;
  }

  .article-page .article-body {
    width: min(100%, 46rem);
    margin-inline: auto;
    padding-bottom: var(--site-section-space);
    font-size: var(--site-body-size);
    line-height: 1.72;
  }

  .article-page .article-body__lead {
    margin-bottom: var(--site-section-space-compact);
    font-size: var(--site-lead-size);
    line-height: var(--site-lead-line-height);
  }

  .article-page .article-body section + section,
  .article-page .article-body section + p {
    margin-top: var(--site-section-space-compact);
  }

  .article-page .article-body h2 {
    max-width: 22ch;
    margin-bottom: var(--site-title-copy-gap);
    font-size: var(--site-section-title-size);
    line-height: var(--site-section-title-line-height);
    letter-spacing: var(--site-section-title-letter-spacing);
  }

  .article-page .article-back {
    min-height: var(--site-touch-target);
    gap: var(--site-action-gap);
    margin-top: var(--site-section-space-compact);
    padding-top: var(--site-title-copy-gap);
    font-size: var(--site-action-size);
    line-height: var(--site-action-line-height);
    letter-spacing: var(--site-action-letter-spacing);
  }

  .article-page .article-back .icon {
    width: var(--site-action-icon-size);
    height: var(--site-action-icon-size);
  }
}

/* Compact Desktop Master preserves the editorial split at tablet scale. */
@media (min-width: 768px) and (max-width: 1199.98px) and (orientation: landscape) and (min-height: 601px),
       (min-width: 1024px) and (max-width: 1199.98px) and (orientation: portrait) {
  .article-page .article-header__inner {
    grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
    gap: clamp(40px, 5vw, 64px);
    align-items: center;
  }
}

/* Touch Master: deliberate single-column intro and controlled editorial media. */
@media (max-width: 767.98px),
       (min-width: 768px) and (max-width: 1023.98px) and (orientation: portrait),
       (min-width: 768px) and (max-width: 1199.98px) and (orientation: landscape) and (max-height: 600px) {
  .article-page .article-header__inner {
    grid-template-columns: minmax(0, 1fr);
    gap: calc(var(--site-card-gap) * 2);
    align-items: start;
  }

  .article-page .article-feature {
    aspect-ratio: 16 / 9;
  }
}

/* Mobile Portrait keeps one uninterrupted reading flow. */
@media (max-width: 767.98px) and (orientation: portrait) {
  .article-page .article-feature {
    aspect-ratio: 4 / 3;
  }
}

/* Low-height landscape uses the compact Homepage Touch Master rhythm. */
@media (max-width: 1199.98px) and (orientation: landscape) and (max-height: 600px) {
  .article-page .article-header {
    padding-top: calc(var(--header-h) + var(--site-card-gap));
  }

  .article-page .article-header__inner {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    align-items: center;
  }

  .article-page .article-feature {
    aspect-ratio: 16 / 10;
  }

  .article-page .article-body {
    width: min(100%, 44rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .article-page .article-back .icon {
    transition: none;
  }
}