/* Wissen-Übersicht, Magazin-Layout (Übergabe design_handoff_wissen_uebersicht, Thomas 04.11.2026) – nur unter .mund-wissen-archiv.
   Tokens wie die Artikelvorlage (wissen.css); Schriften der Website (Newsreader, Schibsted Grotesk) statt Source Serif 4 / Instrument Sans. */
.mund-wissen-archiv {
  --navy-900: #07162C; --navy-800: #0B2040; --navy-700: #10284A; --navy-ink: #0A1C36;
  --text: #2A3A50; --muted: #5B6676; --muted-2: #8A93A0; --numeral: #B4BCC8; --line: #CFC9BE; --hover: #F4F1EA;
  --paper: #FCFAF6; --lime: #E6F21A; --lime-dunkel: #D4E000;
  --on-dark: #E6EBF2; --on-dark-2: #C9D2DE; --on-dark-3: #B4C0D0; --on-dark-4: #4A6080;
  --serif: var(--wp--preset--font-family--serif, Georgia, serif); --sans: var(--wp--preset--font-family--grotesk, system-ui, sans-serif);
  --rand: clamp(20px, 5vw, 64px); --breite: 1280px; --tempo: 200ms;
  background: var(--paper); color: var(--text); font-family: var(--sans); overflow-wrap: break-word;
}
/* CH: Marktfarbe der Website (Rot mit weisser Schrift) statt Lime */
body.markt-ch .mund-wissen-archiv { --lime: var(--mund-akzent); --lime-dunkel: #B80E13; }
body.markt-ch .mund-wissen-archiv a.mwa-knopf, body.markt-ch .mund-wissen-archiv a.mwa-knopf:hover { color: var(--mund-akzent-text); }
.mund-wissen-archiv :is(h1, h2, p, figure, blockquote, ol) { margin: 0; }
.mund-wissen-archiv a { text-decoration: none; }
.mund-wissen-archiv a:focus-visible { outline: 2px solid var(--navy-ink); outline-offset: 2px; }
.mwa-quadrat { display: inline-block; width: 11px; height: 11px; background: var(--lime); flex-shrink: 0; }

/* Masthead */
.mwa-kopf { box-sizing: border-box; max-width: var(--breite); margin: 0 auto; padding: clamp(24px, 3.4vw, 44px) var(--rand) clamp(20px, 2.6vw, 32px);
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 64px; position: relative; }
.mwa-kopf::after { content: ""; position: absolute; left: var(--rand); right: var(--rand); bottom: 0; border-bottom: 1px solid var(--navy-ink); }
.mwa-kopf__titel { flex: 1 1 520px; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.mwa-kicker { font-size: 12px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--navy-ink); }
.mwa-kopf h1 { font-family: var(--serif); font-weight: 500; font-size: clamp(34px, 4.6vw, 60px); line-height: 1; letter-spacing: -.022em; color: var(--navy-ink); }
.mwa-kopf__unter { flex: 1 1 320px; max-width: 420px; font-size: clamp(15px, 1.3vw, 17px); line-height: 1.55; color: var(--muted); text-wrap: pretty; }

/* Aufmacher – einzige dunkle Fläche */
.mund-wissen-archiv a.mwa-aufmacher { display: block; color: var(--on-dark); background-color: var(--navy-900); }
.mund-wissen-archiv a.mwa-aufmacher:focus-visible { outline: 2px solid var(--lime); outline-offset: -6px; }
.mwa-aufmacher__innen { max-width: var(--breite); margin: 0 auto; display: flex; flex-wrap: wrap-reverse; align-items: stretch; }
.mwa-aufmacher__text { box-sizing: border-box; flex: 1 1 480px; min-width: 0; padding: clamp(28px, 4.4vw, 64px) var(--rand); display: flex; flex-direction: column; gap: clamp(16px, 2vw, 24px);
  background: radial-gradient(ellipse 70% 60% at 100% 0%, #1A3456 0%, rgba(26,52,86,0) 70%), linear-gradient(170deg, #07162C 0%, #0B2040 70%, #10284A 100%); }
.mwa-aufmacher__zeile { display: flex; align-items: center; gap: 12px; font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: #fff; }
.mwa-trenner { color: var(--on-dark-4); }
.mwa-aufmacher__nr { color: var(--on-dark-3); }
.mwa-aufmacher__titel { display: flex; flex-direction: column; gap: clamp(14px, 1.8vw, 22px); font-family: var(--serif); font-weight: 400; color: #fff; hyphens: manual; }
.mwa-aufmacher__kurz { font-size: clamp(68px, 9vw, 124px); line-height: .86; letter-spacing: -.04em; }
.mwa-aufmacher__rest { font-size: clamp(22px, 2.4vw, 30px); line-height: 1.2; color: var(--on-dark-2); max-width: 520px; text-wrap: balance; }
.mwa-aufmacher__ganz { font-size: clamp(40px, 5vw, 68px); line-height: 1; letter-spacing: -.025em; text-wrap: balance; }
.mwa-aufmacher__teaser { font-size: clamp(15px, 1.3vw, 17px); line-height: 1.6; color: var(--on-dark-3); max-width: 500px; hyphens: auto;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.mwa-aufmacher__fuss { margin-top: auto; padding-top: 16px; border-top: 1px solid rgba(180,192,208,.25); display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; font-size: 14px; color: var(--on-dark-3); }
.mwa-rubrik { white-space: nowrap; text-transform: uppercase; }
.mwa-aufmacher__fuss .mwa-lesen { margin-left: auto; font-size: 16px; font-weight: 600; color: #fff; transition: transform var(--tempo); }
.mwa-aufmacher:hover .mwa-lesen, .mwa-aufmacher:focus-visible .mwa-lesen { transform: translateX(6px); }
.mwa-aufmacher__bild { flex: 1 1 560px; min-width: 0; position: relative; overflow: hidden; min-height: clamp(260px, 46vw, 640px); background: var(--navy-800); }
.mwa-aufmacher__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; animation: mwa-gleiten 1600ms cubic-bezier(.2,.7,.2,1) both; }
@keyframes mwa-gleiten { from { transform: scale(1.06); } to { transform: scale(1); } }

/* Ein Gedanke */
.mwa-gedanke { box-sizing: border-box; max-width: var(--breite); margin: 0 auto; padding: clamp(48px, 7vw, 104px) var(--rand) clamp(40px, 6vw, 88px); display: flex; flex-wrap: wrap; gap: 16px 64px; }
.mwa-gedanke__label { flex: 0 0 200px; font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--muted-2); padding-top: 14px; }
.mwa-gedanke__zitat { flex: 1 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.mwa-gedanke blockquote { margin: 0; padding: 0; border: 0; font-family: var(--serif); font-weight: 400; font-size: clamp(34px, 5vw, 68px); line-height: 1.06; letter-spacing: -.02em; color: var(--navy-ink); text-wrap: balance; hyphens: manual; }
.mwa-gedanke blockquote p { font: inherit; margin: 0; }
.mwa-gedanke figcaption { font-size: 14px; color: var(--muted); }
.mwa-abstand { height: clamp(40px, 6vw, 72px); }

/* Inhalt */
.mwa-inhalt { box-sizing: border-box; max-width: var(--breite); margin: 0 auto; padding: 0 var(--rand) clamp(56px, 7vw, 96px); }
.mwa-inhalt__kopf { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--navy-ink); padding-bottom: 12px; }
.mwa-inhalt__kopf h2 { font-family: var(--sans); font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--navy-ink); }
.mwa-inhalt__kopf span { font-size: 13px; color: var(--muted); }
.mwa-liste { list-style: none; padding: 0; }
.mwa-liste li { border-bottom: 1px solid var(--line); margin: 0; }
.mund-wissen-archiv .mwa-liste a { color: inherit; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px clamp(20px, 3vw, 40px); padding: clamp(20px, 2.4vw, 28px) 0; transition: background-color var(--tempo); }
.mwa-liste__nr { flex: 0 0 clamp(48px, 7vw, 96px); font-family: var(--serif); font-size: clamp(28px, 3.4vw, 44px); line-height: .9; color: var(--numeral); transition: color var(--tempo); }
.mwa-liste__text { flex: 1 1 420px; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.mwa-liste__rubrik { font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.mwa-liste__titel { font-family: var(--serif); font-weight: 500; font-size: clamp(22px, 2.4vw, 30px); line-height: 1.15; color: var(--navy-ink); text-wrap: balance; }
.mwa-liste__teaser { font-size: 15px; line-height: 1.55; max-width: 640px; hyphens: auto; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mwa-liste__meta { flex: 0 1 220px; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; font-size: 14px; color: var(--muted); padding-top: 4px; }
.mwa-liste__meta .mwa-lesen { margin-top: 6px; font-size: 15px; font-weight: 600; color: var(--navy-ink); transition: transform var(--tempo); }
.mund-wissen-archiv .mwa-liste a:is(:hover, :focus-visible) { background-color: var(--hover); }
.mwa-liste a:is(:hover, :focus-visible) .mwa-liste__nr { color: var(--navy-ink); }
.mwa-liste a:is(:hover, :focus-visible) .mwa-lesen { transform: translateX(6px); }
.mwa-seiten { padding-top: 28px; display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 15px; }
.mund-wissen-archiv .mwa-seiten :is(a, span) { color: var(--navy-ink); padding: 12px 4px; }
.mund-wissen-archiv .mwa-seiten a { text-decoration: underline; text-underline-offset: .2em; }
.mwa-seiten .current { font-weight: 700; }
.mwa-leer { box-sizing: border-box; max-width: var(--breite); margin: 0 auto; padding: 48px var(--rand); }

/* Kontaktimpuls */
.mwa-impuls { border-top: 1px solid var(--line); }
.mwa-impuls__innen { box-sizing: border-box; max-width: var(--breite); margin: 0 auto; padding: clamp(28px, 3.4vw, 44px) var(--rand); display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 20px; }
.mwa-impuls__satz { font-family: var(--serif); font-size: clamp(24px, 2.6vw, 32px); color: var(--navy-ink); }
.mund-wissen-archiv a.mwa-knopf { font-size: 16px; font-weight: 600; color: var(--navy-ink); background: var(--lime); padding: 15px 22px; white-space: nowrap; transition: background-color var(--tempo); }
.mund-wissen-archiv a.mwa-knopf:hover { background: var(--lime-dunkel); color: var(--navy-ink); }

@media (max-width: 719px) {
  .mund-wissen-archiv .mwa-liste a { display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 8px 16px; }
  .mwa-liste__text { display: contents; }
  .mwa-liste__nr { grid-column: 1; }
  .mwa-liste__rubrik { grid-column: 2; }
  .mwa-liste__titel, .mwa-liste__teaser, .mwa-liste__meta { grid-column: 1 / -1; }
  .mwa-liste__meta { flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; padding-top: 0; }
  .mwa-liste__meta .mwa-lesen { margin: 0 0 0 auto; }
  .mwa-gedanke__label { flex-basis: 100%; padding-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .mwa-aufmacher__img { animation: none; }
  .mund-wissen-archiv :is(.mwa-liste a, .mwa-liste__nr, .mwa-lesen, .mwa-knopf) { transition: none; }
}