/* ==========================================================================
   Driller Haustechnik – Design-Tokens
   Überschreibt die Solvior-Variablen aus assets/css/solvior-core.css.
   Siehe Plan.md Kapitel 3.
   ========================================================================== */

:root {
	/* ----------------------------------------------------------------------
	   Farben – Solvior-Basis (unverändert übernommen, hier nur dokumentiert,
	   damit die Palette an einer Stelle vollständig lesbar ist)
	   ---------------------------------------------------------------------- */
	--tj-color-theme-primary: #0075ff;   /* Kompetenz/Technik: CTAs, Links, Icons */
	--tj-color-theme-dark: #051229;      /* Headlines, dunkle Sektionen, Footer   */
	--tj-color-heading-primary: #051229;
	--tj-color-text-body: #364052;
	--tj-color-text-body-2: #7e8590;
	--tj-color-theme-bg: #e1e8f0;
	--tj-color-theme-bg-2: #dfecfd;
	--tj-color-border-2: #ced7e0;

	/* ----------------------------------------------------------------------
	   Ergänzungen Driller
	   Design-Regel: Blau = Kompetenz. Orange = Handlung. Grün = Geld.
	   Pro Screen NIE mehr als ein oranger Button.
	   ---------------------------------------------------------------------- */
	--dr-color-accent: #ff7a00;          /* nur Telefon-Button + Konfigurator "Weiter" */
	--dr-color-accent-hover: #e56d00;
	--dr-color-success: #16a34a;         /* Förderbeträge, Häkchen, Ersparnis */
	--dr-color-success-bg: #f0fdf4;
	--dr-color-warm-bg: #fff7ed;         /* Förder-Block, Highlight-Boxen */

	/* Kontrastgeprüft: #ff7a00 auf Weiß erreicht als Fläche nur 2.9:1 und ist
	   damit NICHT für Text auf hellem Grund geeignet. Nur als Button-Fläche mit
	   weißer Schrift verwenden (dort 3.4:1 für >=18.66px Bold = AA konform).
	   Für orangen Text auf Weiß diesen dunkleren Ton nehmen: */
	--dr-color-accent-text: #c25e00;     /* 4.6:1 auf #ffffff = AA */

	/* ----------------------------------------------------------------------
	   Typografie
	   Solvior setzt --tj-ff-heading mit 'serif'-Fallback, obwohl Libre Franklin
	   eine Sans ist. Beim Font-Swap führt das zu einem sichtbaren Serifen-Blitz.
	   Hier korrigiert.
	   ---------------------------------------------------------------------- */
	--tj-ff-heading: 'Libre Franklin', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--tj-ff-body: 'Lato', system-ui, -apple-system, 'Segoe UI', sans-serif;

	/* Schriftgrößen – gegenüber Solvior reduziert.
	   72px H1 ist Agentur-Optik; eine Lead-Seite braucht Lesbarkeit.

	   Bewusst die --tj-fs-* des Parents überschrieben statt eigener --dr-fs-*:
	   solvior-core.css setzt diese Tokens nur ein einziges Mal (:root, Zeile 26)
	   und referenziert sie überall. Ein Override hier wirkt damit global, auch
	   in allen Widget-Styles — ohne eine einzige Selektor-Regel. */
	--tj-fs-h1: 56px;
	--tj-fs-h2: 40px;
	--tj-fs-h3: 30px;
	--tj-fs-h4: 24px;
	--tj-fs-h5: 20px;
	--tj-fs-h6: 18px;
	--tj-fs-body: 17px;
	--tj-fs-p: 17px;
	--dr-lh-body: 1.7;

	/* ----------------------------------------------------------------------
	   Layout
	   ---------------------------------------------------------------------- */
	--dr-radius-card: 8px;
	--dr-radius-button: 6px;
	--dr-radius-konfigurator: 16px;
	--dr-shadow-card: 0 4px 24px rgba(5, 18, 41, 0.08);
	--dr-shadow-card-hover: 0 8px 32px rgba(5, 18, 41, 0.14);
	--dr-section-padding: 120px;
	--dr-container: 1320px;
	--dr-content: 1140px;
}

/* Mobile Typo- und Spacing-Stufe.
   Solvior bringt für die Schriftgrößen KEINE Breakpoints mit — 72px H1 bleibt
   dort auch auf dem Handy stehen und bricht das Layout. Das wird hier behoben. */
@media (max-width: 767px) {
	:root {
		--tj-fs-h1: 34px;
		--tj-fs-h2: 27px;
		--tj-fs-h3: 24px;
		--tj-fs-h4: 20px;
		--tj-fs-body: 16px;
		--tj-fs-p: 16px;
		--dr-section-padding: 64px;
	}
}