/* =======================================================================
 * Silvalue — Zentrale Breiten-/Abstands-Token (Redesign, Prompt 2,
 * Betreiberauftrag 2026-09-28: "Vereinheitliche nun das Breiten- und
 * Abstands-System der Website")
 * =======================================================================
 * Vier-Ebenen-Layoutsystem, wörtlich aus dem Betreiber-Prompt übernommen:
 *
 *   --sv-shell-max    Wide / Site Shell   max. 1.680px
 *   --sv-content-max  Content             max. 1.280px (= theme.json
 *                                          settings.layout.contentSize,
 *                                          hier nur gespiegelt, nicht neu
 *                                          erfunden)
 *   --sv-prose-max     Prose / Fließtext   ~720–780px bzw. max. 65–75
 *                                          Zeichen/Zeile
 *   --sv-hero-copy-max Hero Copy           max. 640px
 *
 * Dazu ein gemeinsamer responsiver horizontaler Seitenabstand
 * (--sv-gutter). Diese Datei ist die EINZIGE Stelle, an der diese Werte
 * als Zahl stehen — jede verbrauchende Datei referenziert ab jetzt die
 * Variable statt eigene Kopien zu pflegen (Auftrag: "Verwende möglichst
 * zentrale CSS-Variablen ..., damit die Breiten nicht mehrfach als
 * Einzelwerte gepflegt werden müssen").
 *
 * Muss vor allen anderen Redesign-Dateien geladen werden (siehe
 * functions.php, silvalue_enqueue_assets() — als Abhängigkeit von
 * "silvalue-header" und "silvalue-patterns" eingetragen).
 *
 * --sv-hero-copy-max (640px) ist NUR eine dokumentierende Spiegelung des
 * bereits in home-redesign.css bestehenden Hero-Copy-Werts
 * (`body.home .sv-hero__copy{max-width:640px}`, Teil des in Prompt 1
 * fertiggestellten Headers/Heros). Diese Datei verändert die Hero-Regel
 * selbst NICHT und referenziert sie auch nicht per var() — ausdrücklicher
 * Auftrag: "ohne den in Prompt 1 überarbeiteten Header oder Hero wieder
 * zu verändern". Der Token dient nur der vollständigen Dokumentation des
 * Vier-Ebenen-Systems an einer Stelle.
 * ===================================================================== */

:root {
	--sv-shell-max: 1680px;
	--sv-content-max: 1280px;
	--sv-prose-max: 780px;
	--sv-hero-copy-max: 640px;

	/* Gemeinsamer responsiver Seitenabstand für alle "Wide/Shell"-Flächen
	   (Header, Startseiten-/Leistungsübersicht-Abschnitte, Footer) — Wert
	   unverändert aus dem bereits auf Startseite/Leistungsübersicht
	   geprüften und freigegebenen --sv2-gutter übernommen (vorher einzeln
	   in home-redesign.css UND services-redesign.css UND
	   content-page-redesign.css dupliziert), NICHT neu berechnet, damit
	   sich an der bereits abgenommenen Optik nichts verschiebt.
	   ~20,7px bei 390px Breite (Vorgabe im Prompt: "etwa 16px" — die
	   Differenz von rund 4-5px ist der bereits produktiv laufende,
	   optisch geprüfte Wert; Content-/Prose-Seiten ohne eigenen
	   Wide-Abschnitt nutzen ohnehin WordPress' eigenen
	   Root-Padding-Abstand (theme.json styles.spacing.padding, Token
	   "sm"), der bei 390px rechnerisch ~16px ergibt — siehe Bericht). */
	--sv-gutter: clamp(20px, 1.2vw + 16px, 64px);

	/* Rückwärtskompatible Aliase: home-redesign.css, services-redesign.css
	   und content-page-redesign.css referenzieren weiterhin die Namen
	   "--sv2-content-max"/"--sv2-gutter" (gewachsene Bezeichnung aus den
	   Redesign-Dateien vom 2026-09-22). Hier zentral auf die neuen,
	   sprechenden Token umgeleitet, statt jede Verbrauchsstelle in den drei
	   Dateien einzeln umzuschreiben — Verhalten bleibt dadurch unverändert,
	   nur die Pflege ist jetzt zentral. */
	--sv2-content-max: var(--sv-shell-max);
	--sv2-gutter: var(--sv-gutter);
}

/* Ab 1920px fester 100px-Randabstand statt der Klammer-Formel — der
   ursprüngliche clamp() allein erreicht 64px rechnerisch erst bei etwa
   4.000px Breite (1,2vw + 16px = 64px ⇒ vw ≈ 40 ⇒ ca. 4.000px
   Viewport-Breite), das war schon in der bisherigen, getrennten
   Fassung (home-redesign.css/services-redesign.css) so und wird hier nur
   zentral zusammengeführt. */
@media (min-width: 1920px) {
	:root {
		--sv-gutter: 100px;
		--sv2-gutter: var(--sv-gutter);
	}
}

/* NACHTRAG 2026-10-09 — Betreiberwunsch: Abstand zwischen Website und
   Bildschirmrand auf kleineren Laptops (MacBook Air, ~1280–1470px) etwa
   verdreifachen. --sv-gutter war vorher clamp(20px, 1.2vw + 16px, 64px)
   (~33px bei 1440px). Neu ab 782px: clamp(20px, 7vw, 100px) (~90px bei
   1280px, 100px ab ca. 1430px und ab 1920px). Unter 782px bleibt die alte
   Formel (~21px bei 390px) — ein erster Wurf mit 7vw für alle Breiten
   hatte das Handy auf ~27px angehoben und wurde zurückgenommen.
   Zuerst doppelt versucht, dann auf Betreiberwunsch dreifach.
   Header, Footer und Textseiten (Impressum, Datenschutz …) nutzen nicht
   --sv-gutter, sondern WordPress' Root-Padding (theme.json
   styles.spacing.padding, Token "sm" ≈ 16–20px). Damit ihre Kanten mit
   den Abschnitten auf einer Linie bleiben, wird dasselbe Root-Padding ab
   782px auf --sv-gutter gesetzt (Variablen direkt auf body, damit sie die
   von WordPress auf :root gesetzten Werte überstimmen). Unter 782px bleibt
   alles wie bisher. */
@media (min-width: 782px) {
	:root {
		--sv-gutter: clamp(20px, 7vw, 100px);
	}

	body {
		--wp--style--root--padding-left: var(--sv-gutter);
		--wp--style--root--padding-right: var(--sv-gutter);
	}
}
