/* K-061 Vorschau F (Serif) – einzige Stelle mit Farbwerten. Stand 12.10.2026, claude-w1.
   Offen: Petrol (IDENTITY v2) fehlt hier bewusst, bis Andreas die Richtung wählt. */
@font-face { font-family: "Newsreader"; src: url(fonts/newsreader-var-normal.woff2) format("woff2"); font-weight: 400 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url(fonts/newsreader-var-italic.woff2) format("woff2"); font-weight: 400 500; font-style: italic; font-display: swap; }
@font-face { font-family: "Archivo"; src: url(fonts/archivo-600.woff) format("woff"); font-weight: 600; font-style: normal; font-display: swap; }

:root {
  --ink: #14120F;
  --white: #FAF7F1;
  --yellow: #F2D04B;
  --petrol: #1F5A5C; /* Grün aus IDENTITY v2, nur Variante index-gruen */
  --muted: #5C564C;
  --muted-on-ink: #B5AD9F;
  --soft-on-ink: #E6E0D3;
  --line-ink: rgba(20, 18, 15, .2);
  --line-w: rgba(250, 247, 241, .2);
  --shade-9: rgba(20, 18, 15, .9);
  --shade-7: rgba(20, 18, 15, .72);
  --shade-0: rgba(20, 18, 15, 0);
  --ph-bg: rgba(20, 18, 15, .08);
  --ph-bg-ink: rgba(250, 247, 241, .12);

  --serif: "Newsreader", Georgia, "Times New Roman", serif;
  --gro: "Archivo", "Arial Narrow", Arial, sans-serif;

  --pad: 40px;
  --edge: max(var(--pad), calc((100vw - 1440px) / 2 + var(--pad)));
  --sec: clamp(64px, 7.2vw, 104px); /* 19.10. abends, Andreas: Abstände zwischen allen Sektionen kleiner, «nicht nur zuoberst» (vorher 88–160) */
  /* Abstände innen hängen am Sektionsabstand (19.10., Andreas «denk mal durch»): innen immer kleiner als zwischen Sektionen */
  --gap-l: calc(var(--sec) * .6);  /* Block zu Block: Titel → Inhalt, Text → Bild */
  --gap-m: calc(var(--sec) * .4);  /* bis zur Haarlinie, Kicker → Titel */
  --gap-s: calc(var(--sec) * .3);  /* Haarlinie → Inhalt */
  --col: 24px;
}
@media (max-width: 1100px) { :root { --pad: 28px; } }
@media (max-width: 700px) { :root { --pad: 20px; --col: 16px; } }