/*
 * Design tokens — the single source of truth for colour, type and spacing.
 *
 * Values come from `design/DESIGN-RULES.md` in the repo, which is binding.
 * The brand colours are sampled from the logo PNG, NOT from the brochure: the
 * earlier tokens (#80CC28 / #82B0E2) were a 300 dpi print measurement and are
 * wrong. Both brand tones are light, so they work only as FILLS carrying dark
 * text — white-on-green is 2:1 and unusable. That is what the darkened
 * derivatives below exist for.
 */

/* --- webfonts, self-hosted -------------------------------------------------
 * Gabarito carries headlines, figures and labels; Hanken Grotesk carries body
 * copy. Both are variable fonts: ONE file spans the whole weight range, which
 * is why the weight is declared as a range. Splitting them into per-weight
 * rules pointing at the same file is what produces faux-bold headings.
 * Both SIL OFL 1.1, licences in assets/fonts/. Served from this theme, so no
 * request leaves the site (GDPR) and the WP Rocket font setting is not
 * load-bearing.
 */

@font-face {
	font-family: "Gabarito";
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
	src: url("../fonts/gabarito-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Gabarito";
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
	src: url("../fonts/gabarito-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Hanken Grotesk";
	font-style: normal;
	font-weight: 300 800;
	font-display: swap;
	src: url("../fonts/hanken-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Hanken Grotesk";
	font-style: normal;
	font-weight: 300 800;
	font-display: swap;
	src: url("../fonts/hanken-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
	/* --- brand, sampled from the logo PNG -------------------------------- */
	--qv-green: #95C11A;          /* fill only; pair with --qv-ink */
	--qv-blue: #89B4E1;           /* fill only; pair with --qv-ink */
	--qv-ink: #181716;            /* text, and the dark band */

	/* Darkened derivatives, each measured. The suffix says where it is safe. */
	--qv-green-ink: #41690B;      /* 6.5:1 on white, 5.8:1 on --qv-mist */
	--qv-green-cta: #4E7F0D;      /* 4.8:1 on white */
	--qv-blue-ink: #1D4E80;       /* 8.6:1 on white */

	/* --- neutrals -------------------------------------------------------- */
	--qv-ink-2: #4A524E;
	--qv-bg: #FFFFFF;
	--qv-mist: #EFF4F8;           /* the quiet band surface */
	--qv-hair: #DDE3E7;
	--qv-line: #6E8BA2;           /* graphic strokes; 3.2:1 on --qv-mist */

	/* --- type ------------------------------------------------------------ */
	--qv-font-display: "Gabarito", "Trebuchet MS", sans-serif;
	--qv-font-sans: "Hanken Grotesk", system-ui, -apple-system, sans-serif;

	/* Owner 2026-08-18: "we should not use super small font in the whole
	   template. readability is very important." These two steps carry every
	   label and every supporting line on the site, so the floor is raised here
	   rather than per component — 13.1px and 14.4px were caption sizes doing
	   body-copy work. */
	--qv-text-xs: 0.9rem;
	--qv-text-sm: 1rem;
	--qv-text-base: 1.0625rem;
	--qv-text-lede: clamp(1.05rem, 1.45vw, 1.32rem);
	--qv-h2: clamp(1.8rem, 5vw, 4rem);
	--qv-h1: clamp(2.05rem, 8.3vw, 8.4rem);

	/* Measure. Body copy USES this width — it is not a ceiling to stay under.
	   A 46-character column beside 900px of free space reads as a mistake. */
	--qv-measure: 72ch;

	/* --- structure -------------------------------------------------------- */
	/* No shell: the design is a sequence of full-bleed bands, so the gutter is
	   the only horizontal constraint — was der Wert wichtiger macht als er
	   aussieht.

	   Owner 2026-08-18: „we are almost at the edge of the browser". Gemessen war
	   der Einzug 35px bei 1024, 49px bei 1440, 56px bei 1680 — und 56px bei 1920,
	   weil der alte Deckel von 3.5rem ab 1647px greift. Anteilig hiess das 3,4 %
	   bei 1440 und nur noch 2,9 % bei 1920: je groesser der Schirm, desto knapper
	   der Rand. Genau verkehrt herum.

	   Der Faktor steigt deshalb auf 4.2vw und der Deckel auf 6.5rem. Auf dem
	   Telefon aendert sich nichts — dort gewinnt weiterhin der Mindestwert, und
	   320px Breite hat keinen Rand zu verschenken. */
	--qv-gutter: clamp(1.15rem, 4.2vw, 6.5rem);

	/* Das gemeinsame Mass fuer ALLES, was in einem Band steht.
	   Owner 2026-08-18, nachdem gemessen war, dass es nicht am Rand liegt: in 48
	   Baendern streuten die rechten Kanten der eigenen Kinder bei 1920 um mehr
	   als 200px, auf der Startseite um 1549px. Die Ueberschrift wuchs mit dem
	   Schirm, das Register war bei 83,6rem gedeckelt, der Fliesstext bei 72ch —
	   drei rechte Kanten in einem Band. DAS liest sich unfertig, nicht der Rand.

	   Kein Shell-Wrapper: die Baender bleiben randlos und behalten ihre
	   Diagonalen, gedeckelt wird nur der Inhalt, ueber den Innenabstand des
	   Bandes selbst. Unterhalb von rund 1770px gewinnt weiterhin der Seitenrand,
	   dort aendert sich also nichts. */
	--qv-inhalt: 100rem;

	/* THE angle. One number for the whole site: how far an edge drops across
	   the full viewport width. The cut marks the hand-over — a band is entered
	   through it and ends straight. Two diagonals per page, never five. */
	--qv-fall: 6vw;

	--qv-radius-control: 5px;
	--qv-radius-panel: 10px;
}

@media (max-width: 820px) {
	:root {
		--qv-fall: 11vw;
	}
}

/* Die Uebergangs-Aliase, die hier standen, sind am 2026-08-18 entfallen. Sie
   trugen die Namen des in Runde 9 verworfenen Entwurfs und hielten
   archive/single/search/404 am Leben, bis diese vier auf dem Bandsystem neu
   gebaut waren. Das ist jetzt der Fall: `layout.css` ist geloescht,
   `components.css` auf das Anruf-Widget geschrumpft, und die Werte, die dort
   noch gebraucht wurden, stehen ausgeschrieben in der jeweiligen Regel.

   Ab hier gilt wieder: was nicht oben in dieser Datei steht, gibt es nicht. */
