/* =========================================================================
   ABP News v2 – Beitrags-Detailseite und News-Übersicht
   Baut auf den vorhandenen Tokens aus _custom.scss (--abp--global--*) und
   theme.json (--wp--preset--*) auf. Keine rem-Werte: das Theme setzt die
   Root-Schriftgröße auf 10px.
   ========================================================================= */

:root {
  --abp--news--navy: var(--wp--preset--color--primary, #001538);
  --abp--news--navy-dark: var(--wp--preset--color--primary-dark, #00102b);
  --abp--news--blue: var(--wp--preset--color--secondary-blue, #184898);
  --abp--news--cyan: #00aefc;               /* brand-cyan aus dem Logo, nur als Akzent */
  --abp--news--green: #00eb8c;              /* accent-green, nie für Text */
  --abp--news--slate: #5f6a7e;              /* slate-500-aa, Sekundärtext */
  --abp--news--line: #e6e8f2;
  --abp--news--tint: #eef3fb;
  --abp--news--surface: var(--wp--preset--color--base, #fcfdff);
  --abp--news--radius-xs: 4px;
  --abp--news--radius-sm: 6px;
  --abp--news--radius-md: 14px;
  --abp--news--shadow: 0 1px 2px rgba(0, 21, 56, .04), 0 10px 30px -12px rgba(0, 21, 56, .12);
  --abp--news--display: clamp(30px, 2.2vw + 18px, 48px);
  --abp--news--label: clamp(20px, .4vw + 17px, 24px);
  --abp--news--lead: clamp(18px, .5vw + 15px, 24px);
  --abp--news--body: clamp(17px, .2vw + 16px, 18px);
  --abp--news--section: clamp(64px, 6vw, 104px);
  --abp--news--sticky-top: calc(var(--wp-admin--admin-bar--height, 0px) + 96px); /* unter der fixierten Kopfzeile */
}

/* Hintergrund = Seitenhintergrund des Themes, damit die Anker-Leiste nicht als graues Band absteht */
.abp--article-page {
  background: transparent;
  color: var(--abp--news--navy);
  font-family: var(--abp--global--font-family);
  font-size: 15px;
  line-height: 1.55;
}
.abp--article-page h1,
.abp--article-page h2,
.abp--article-page h3 { text-wrap: balance; }

.abp--wrap {
  width: min(var(--wp--style--global--wide-size, 1470px), calc(100% - 32px));
  max-width: 1470px;
  margin-inline: auto;
}

/* Anker-Leiste: Aufbau 1:1 aus dem Muster „Anker-Navigation“ der Landingpages.
   Auf den News-Seiten nur kompakter (Button) und mobil sauber umbrechend. */
.abp--subnav { align-items: center; row-gap: 6px; }
.abp--subnav p, .abp--subnav a { white-space: nowrap; -webkit-hyphens: manual; hyphens: manual; }
.abp--subnav .wp-block-breadcrumbs li { white-space: nowrap; }
.abp--subnav .wp-block-button__link { padding-top: 9px; padding-bottom: 7px; line-height: 1.2; }
@media (max-width: 781px) {
  .abp--subnav { flex-direction: column; align-items: stretch; flex-wrap: nowrap; padding-top: 8px !important; padding-bottom: 8px !important; }
  .abp--subnav .wp-block-breadcrumbs { min-width: 0; }
  .abp--subnav .wp-block-breadcrumbs ol { flex-wrap: nowrap; overflow: hidden; }
  .abp--subnav .wp-block-breadcrumbs li:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .abp--subnav .wp-block-breadcrumbs li:last-child > * { display: block; overflow: hidden; text-overflow: ellipsis; }
  .abp--wrap { width: calc(100% - 32px); }
  .abp--subnav > .wp-block-group { gap: 4px 18px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .abp--subnav > .wp-block-group::-webkit-scrollbar { display: none; }
  .abp--subnav .wp-block-buttons { display: none; }
}

/* Lesefortschritt */
.abp--progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 1000; pointer-events: none; }
.abp--progress span { display: block; height: 100%; width: 0; background: var(--abp--news--blue); }

/* Kleinteile */
.abp--meta { font-size: 13px; line-height: 16px; font-weight: 500; color: var(--abp--news--slate); }
.abp--eyebrow, .abp--facts dt { font-size: 10px; line-height: 12px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--abp--news--slate); }
.abp--chip { display: inline-flex; white-space: nowrap; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--abp--news--line); border-radius: var(--abp--news--radius-xs); background: #fff; color: var(--abp--news--navy) !important; font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; text-decoration: none !important; }
.abp--chip:hover { border-color: var(--abp--news--blue); color: var(--abp--news--blue) !important; }
.abp--dot { width: 8px; height: 8px; border-radius: 50%; background: var(--abp--news--green); flex: none; }

/* Artikelkopf: gleiche Spalten wie das Artikelraster */
.abp--article-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 16px clamp(32px, 4vw, 64px); padding-top: clamp(24px, 3vw, 40px); }
.abp--article-head__meta { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding-top: 12px; }
.abp--article-head__main { display: grid; gap: 20px; min-width: 0; max-width: 720px; }
.abp--article-title { margin: 0; font-size: var(--abp--news--display); line-height: 1.13; font-weight: 600; letter-spacing: -.01em; color: var(--abp--news--navy); }
.abp--article-sub { margin: 0; max-width: 62ch; font-size: clamp(17px, .4vw + 15px, 19px); line-height: 1.55; color: var(--abp--news--slate); }
.abp--article-image { margin: 8px 0 0; }
.abp--article-image img { display: block; width: auto; max-width: 100%; height: auto; border-radius: var(--abp--news--radius-md); }

/* Raster: 1/3 Meta-Spalte, 2/3 Artikel */
.abp--article-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: clamp(32px, 4vw, 64px); padding-block: clamp(32px, 4vw, 56px) var(--abp--news--section); }
.abp--article-aside__inner { position: sticky; top: var(--abp--news--sticky-top); display: grid; gap: 24px; }
.abp--byline { display: grid; gap: 18px; }
.abp--author { display: flex; gap: 14px; align-items: center; }
.abp--avatar { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex: none; background: var(--abp--news--tint); }
.abp--avatar--initial { display: grid; place-items: center; font-size: 22px; font-weight: 600; color: var(--abp--news--blue); }
.abp--author strong { display: block; font-size: 15px; line-height: 20px; font-weight: 600; }
.abp--author span { display: block; font-size: 13px; line-height: 18px; color: var(--abp--news--slate); }
.abp--facts { display: flex; gap: 32px; margin: 0; }
.abp--facts div { display: grid; gap: 6px; }
.abp--facts dt { order: -1; }
.abp--facts dd { margin: 0; font-size: 15px; line-height: 20px; font-weight: 600; font-variant-numeric: tabular-nums; }
.abp--share { display: flex; gap: 8px; align-items: center; }
.abp--share .abp--meta { margin-right: auto; }
.abp--icon-btn { width: 40px; height: 40px; display: grid; place-items: center; padding: 0; border: 1px solid var(--abp--news--line); border-radius: var(--abp--news--radius-sm); background: #fff; color: var(--abp--news--navy) !important; cursor: pointer; }
.abp--icon-btn:hover { border-color: var(--abp--news--blue); color: var(--abp--news--blue) !important; }
.abp--icon-btn svg { width: 18px; height: 18px; }
.abp--share-status { min-height: 16px; margin: -10px 0 0; font-size: 12px; color: var(--abp--news--blue); }
.abp--toc { display: grid; gap: 12px; padding-top: 20px; border-top: 1px solid var(--abp--news--line); }
.abp--toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.abp--toc a { display: block; padding: 8px 10px; border-left: 2px solid transparent; color: var(--abp--news--navy) !important; text-decoration: none !important; font-size: 14px; line-height: 20px; }
.abp--toc a:hover { background: var(--abp--news--tint); }
.abp--toc a.is-active { border-left-color: var(--abp--news--blue); background: var(--abp--news--tint); color: var(--abp--news--blue) !important; }

/* Artikeltext – alles aus Gutenberg */
.abp--prose { max-width: 720px; min-width: 0; font-size: var(--abp--news--body); line-height: 1.72; color: var(--abp--news--navy); }
.abp--prose > * { margin-top: 0; margin-bottom: 0; }
.abp--prose > * + * { margin-top: 1.15em; }
.abp--prose p { font-size: inherit; line-height: inherit; }
.abp--prose a { color: var(--abp--news--blue); text-decoration: underline; text-underline-offset: 3px; }
.abp--prose strong { font-weight: 600; }
.abp--prose h2 { margin-top: 2.2em; font-size: var(--abp--news--label); line-height: 1.3; font-weight: 600; color: var(--abp--news--navy); scroll-margin-top: var(--abp--news--sticky-top); }
.abp--prose h3 { margin-top: 1.8em; font-size: 19px; line-height: 28px; font-weight: 600; }
.abp--prose ul:not([class*="is-style-"]),
.abp--prose ol:not([class*="is-style-"]) { padding-left: 1.2em; }
.abp--prose li + li { margin-top: .4em; }

.abp--prose .is-style-abp-lead { font-size: var(--abp--news--lead); line-height: 1.6; font-weight: 500; }
.abp--prose .is-style-abp-lead::first-letter,
.abp--prose .has-drop-cap:not(:focus)::first-letter { float: left; margin: .08em .1em 0 0; font-size: 3.6em; line-height: .82; font-weight: 600; color: var(--abp--news--blue); }

/* Großes Zitat: core/pullquote */
.abp--prose .wp-block-pullquote { position: relative; margin-block: 2em; padding: clamp(28px, 3vw, 44px); border: 0; border-radius: var(--abp--news--radius-md); background: var(--abp--news--navy-dark); color: #fff; text-align: left; }
.abp--prose .wp-block-pullquote blockquote { margin: 0; padding: 0; border: 0; }
.abp--prose .wp-block-pullquote blockquote::before { content: ""; display: block; width: 40px; height: 32px; margin-bottom: 16px; background: var(--abp--news--cyan);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 32'%3E%3Cpath d='M0 32V19.2C0 8.6 5.3 2.2 15.9 0l1.6 4.6C11.6 6.4 8.8 9.7 8.6 14.6h7.6V32zm22.6 0V19.2C22.6 8.6 27.9 2.2 38.5 0L40 4.6c-5.8 1.8-8.6 5.1-8.9 10h7.7V32z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 32'%3E%3Cpath d='M0 32V19.2C0 8.6 5.3 2.2 15.9 0l1.6 4.6C11.6 6.4 8.8 9.7 8.6 14.6h7.6V32zm22.6 0V19.2C22.6 8.6 27.9 2.2 38.5 0L40 4.6c-5.8 1.8-8.6 5.1-8.9 10h7.7V32z'/%3E%3C/svg%3E") center / contain no-repeat; }
.abp--prose .wp-block-pullquote p { margin: 0; font-size: clamp(24px, 1.4vw + 16px, 34px); line-height: 1.3; font-weight: 600; color: #fff; }
.abp--prose .wp-block-pullquote cite { display: flex; align-items: center; gap: 10px; margin-top: 18px; font-style: normal; font-size: 13px; line-height: 18px; text-transform: none; color: rgba(255, 255, 255, .75); }
.abp--prose .wp-block-pullquote cite::before { content: ""; width: 24px; height: 1px; background: var(--abp--news--cyan); flex: none; }

/* Zitat mit Quelle: core/quote */
.abp--prose .wp-block-quote { margin-inline: 0; padding: 4px 0 4px 24px; border-left: 3px solid var(--abp--news--blue); }
.abp--prose .wp-block-quote p { font-size: clamp(18px, .4vw + 16px, 21px); line-height: 1.55; font-weight: 500; }
.abp--prose .wp-block-quote cite { display: block; margin-top: 10px; font-style: normal; font-size: 13px; line-height: 18px; color: var(--abp--news--slate); }
.abp--prose .wp-block-quote cite strong { color: var(--abp--news--navy); }

/* Nummerierte Schritte: core/list, Stil „Nummerierte Schritte“ */
.abp--prose .is-style-abp-steps { list-style: none; padding: 0; display: grid; gap: 12px; counter-reset: abp-step; }
.abp--prose .is-style-abp-steps > li { counter-increment: abp-step; position: relative; margin: 0; padding: 18px 18px 18px 72px; border: 1px solid var(--abp--news--line); border-radius: var(--abp--news--radius-md); background: #fff; font-size: 15px; line-height: 24px; color: var(--abp--news--slate); }
.abp--prose .is-style-abp-steps > li::before { content: counter(abp-step); position: absolute; left: 18px; top: 18px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: var(--abp--news--radius-xs); background: var(--abp--news--navy-dark); color: #fff; font-size: 15px; font-weight: 600; }
.abp--prose .is-style-abp-steps > li > strong:first-child { display: block; font-size: 16px; color: var(--abp--news--navy); }

/* Bilder, Tabellen, Trenner im Text */
.abp--prose .wp-block-image img { border-radius: var(--abp--news--radius-md); height: auto; }
.abp--prose figcaption { margin-top: 10px; font-size: 13px; line-height: 20px; color: var(--abp--news--slate); text-align: left; }
.abp--prose .wp-block-table { overflow-x: auto; }
.abp--prose .wp-block-separator { border: 0; border-top: 1px solid var(--abp--news--line); }

/* Schlagwörter und Blättern */
.abp--tags { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 2em !important; }
.abp--tags a { padding: 8px 12px; border: 1px solid var(--abp--news--line); border-radius: var(--abp--news--radius-xs); background: #fff; color: var(--abp--news--navy) !important; font-size: 13px; line-height: 16px; font-weight: 500; text-decoration: none !important; }
.abp--tags a:hover { border-color: var(--abp--news--blue); color: var(--abp--news--blue) !important; }
.abp--pager { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 40px !important; }
.abp--pager a { display: grid; gap: 6px; padding: 18px 20px; border: 1px solid var(--abp--news--line); border-radius: var(--abp--news--radius-md); background: #fff; color: var(--abp--news--navy) !important; text-decoration: none !important; }
.abp--pager a:hover { border-color: var(--abp--news--blue); }
.abp--pager a.is-next { text-align: right; grid-column: 2; }
.abp--pager strong { font-size: 16px; line-height: 22px; font-weight: 600; }

/* Auf dem Laufenden + Beitragsraster (Karten-Styles kommen aus _custom.scss) */
.abp--updates { padding-block: var(--abp--news--section); border-top: 1px solid var(--abp--news--line); }
.abp--updates__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: clamp(32px, 4vw, 64px); align-items: start; }
.abp--updates__nl { align-self: stretch; }
.abp--updates .abp--news-grid { padding: 0; }
.abp--col-title { margin: 0 0 20px; font-size: var(--wp--preset--font-size--medium); line-height: 1.3; font-weight: 600; color: var(--abp--news--navy); }
.abp--updates__sticky { position: sticky; top: var(--abp--news--sticky-top); }
.abp--news-grid__apendix { margin-top: 16px; }
.abp--btn-ghost { display: inline-flex; padding: 14px 18px; border: 1px solid var(--abp--news--line); border-radius: var(--abp--news--radius-xs); background: #fff; color: var(--abp--news--navy) !important; font-size: 13px; line-height: 16px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; text-decoration: none !important; }
.abp--btn-ghost:hover { border-color: var(--abp--news--blue); color: var(--abp--news--blue) !important; }
.abp--nl-fallback { display: grid; gap: 16px; padding: 32px; border-radius: var(--abp--news--radius-md); background: #fff; box-shadow: var(--abp--news--shadow); text-align: center; }

/* Übersicht /aktuelles/ */
.abp--archive-head { display: grid; gap: 20px; padding-block: clamp(24px, 3vw, 40px) clamp(24px, 3vw, 40px); }
.abp--archive-intro { max-width: 62ch; font-size: clamp(17px, .4vw + 15px, 19px); line-height: 1.55; color: var(--abp--news--slate); }
.abp--archive-intro > * { margin: 0; }
.abp--archive-intro > * + * { margin-top: .8em; }
.abp--filter { display: flex; flex-wrap: wrap; gap: 8px; }
.abp--filter a { padding: 9px 12px; border: 1px solid var(--abp--news--line); border-radius: var(--abp--news--radius-xs); background: #fff; color: var(--abp--news--navy) !important; font-size: 13px; line-height: 16px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; text-decoration: none !important; }
.abp--filter a:hover { border-color: var(--abp--news--blue); color: var(--abp--news--blue) !important; }
.abp--filter a[aria-current="page"] { background: var(--abp--news--navy-dark); border-color: var(--abp--news--navy-dark); color: #fff !important; }
.abp--pagination ul { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 24px 0 0; padding: 0; }
.abp--pagination a, .abp--pagination span { display: grid; place-items: center; min-width: 40px; height: 40px; padding: 0 12px; border: 1px solid var(--abp--news--line); border-radius: var(--abp--news--radius-xs); background: #fff; color: var(--abp--news--navy) !important; font-size: 14px; font-weight: 600; text-decoration: none !important; }
.abp--pagination .current { background: var(--abp--news--navy-dark); border-color: var(--abp--news--navy-dark); color: #fff !important; }

:focus-visible { outline: 2px solid var(--abp--news--blue); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .abp--progress { display: none; } }

/* Responsiv */
@media (max-width: 980px) {
  .abp--article-head, .abp--article-grid, .abp--updates__grid { grid-template-columns: minmax(0, 1fr); }
  .abp--article-head__meta { flex-direction: row; flex-wrap: wrap; align-items: center; padding-top: 0; }
  .abp--article-aside__inner, .abp--updates__sticky { position: static; }
  .abp--toc { display: none; }
}
@media (max-width: 640px) {
  .abp--pager { grid-template-columns: minmax(0, 1fr); }
  .abp--pager a.is-next { grid-column: auto; text-align: left; }
}

/* Newsletter-Karte aus der Startseite: volle Spaltenbreite statt Inhaltsbreite */
.abp--updates__nl .wp-block-group.has-white-background-color { padding: clamp(28px, 3vw, 48px) clamp(20px, 3vw, 48px); border-radius: var(--abp--global--border-radius); }
.abp--updates__nl .wp-block-group.has-white-background-color > * { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }
