/*
 * Design-Tokens – Standardwerte des Themes.
 *
 * Die --nds-*-Variablen sind der Vertrag mit Nordsueden Studio: Werte, die dort im
 * Dashboard überschrieben werden, landen in uploads/nordsueden-studio/tokens.css und
 * werden nach dieser Datei geladen. Das Theme nutzt im eigenen CSS nur Variablen.
 *
 * Fluide Größen: Viewport 375 → 1920 px, Root 16 px (wie im bisherigen Clamp-System).
 */

@font-face {
	font-family: "Caveat";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../fonts/caveat-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: "Caveat";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../fonts/caveat-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;
}

:root {
	/* Schriften (Adobe-Kit qut1gpx lädt Nordsueden Studio, Caveat liegt im Theme) */
	--nds-font-heading: "benton-modern-display", Georgia, "Times New Roman", serif;
	--nds-font-body: "nunito", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--nds-font-accent: "Caveat", "Segoe Script", cursive;

	/* Farben – im Dashboard überschreibbar */
	--nds-color-primary: #62A8AF;
	--nds-color-secondary: #2C6770;
	--nds-color-accent: #63B3BE;
	--nds-color-text: #333333;
	--nds-color-background: #FBFAF7;
	--nds-color-surface: #F5F1EB;

	/* Schriftgrößen: h1–h6, p, small = h-xxxlarge … t-small des Design-Systems */
	--nds-fs-h1: clamp(2.5rem, 2.01456rem + 2.0712vw, 4.5rem);
	--nds-lh-h1: 1.1;
	--nds-fs-h2: clamp(2.25rem, 2.12864rem + 0.5178vw, 2.75rem);
	--nds-lh-h2: 1.2;
	--nds-fs-h3: clamp(1.88rem, 1.78398rem + 0.38835vw, 2.25rem);
	--nds-lh-h3: 1.25;
	--nds-fs-h4: clamp(1.5rem, 1.43932rem + 0.2589vw, 1.75rem);
	--nds-lh-h4: 1.3;
	--nds-fs-h5: clamp(1.13rem, 1.09466rem + 0.12945vw, 1.25rem);
	--nds-lh-h5: 1.35;
	--nds-fs-h6: clamp(1.13rem, 1.09466rem + 0.12945vw, 1.25rem);
	--nds-lh-h6: 1.5;
	--nds-fs-p: 1rem;
	--nds-lh-p: 1.5;
	--nds-fs-small: 0.88rem;
	--nds-lh-small: 1.5;

	/* Weitere Stufen (nur im Theme) */
	--nds-fs-xsmall: clamp(0.75rem, 0.73483rem + 0.06472vw, 0.81rem);
	--nds-lh-xsmall: 1.4;
	--nds-fs-eyebrow: clamp(0.63rem, 0.57949rem + 0.19417vw, 0.81rem);
	--nds-lh-eyebrow: 1.4;
	--nds-fs-script: clamp(1.5rem, 1.37864rem + 0.5178vw, 2rem);
	--nds-lh-script: 1.2;
	--nds-fs-button: 1rem;
	--nds-lh-button: 1.2;

	/* Palette des Design-Systems. Was einer --nds-Farbe entspricht, folgt ihr. */
	--ga_petrol: var(--nds-color-primary);
	--ga_petrol_dunkel: var(--nds-color-secondary);
	--ga_petrol_hell: var(--nds-color-accent);
	--ga_text: var(--nds-color-text);
	--ga_creme: var(--nds-color-background);
	--ga_sand: var(--nds-color-surface);
	--ga_tinte: #1E2A32;
	--ga_grau: #75848D;
	--ga_eis: #DDECEE;
	--ga_eis_hell: #E0F0F3;
	--ga_eis_rand: #CFE5E8;
	--ga_weiss: #FFFFFF;

	/* Alte Variablennamen aus dem Elementor-Kit (werden im übernommenen CSS benutzt) */
	--Prime: var(--ga_petrol);
	--Prime1: var(--ga_petrol_hell);
	--Akzent_02: var(--ga_petrol_dunkel);
	--Text: var(--ga_tinte);
	--Text2: var(--ga_grau);
	--BG_01: var(--ga_creme);
	--BG_02: var(--ga_eis);
	--BG_03: var(--ga_sand);
	--hellblau: var(--ga_eis_hell);
	--footer: var(--ga_tinte);
	--weiss: var(--ga_weiss);
	--leichtweiss: #3B6E77;
	--Benton: var(--nds-font-heading);
	--nunito: var(--nds-font-body);
	--serifen: var(--nds-font-accent);

	/* Maße */
	--gs_radius: 25px;
	--gs_radius_pill: 50px;
	--gs_wrap: 1142px;
	--xsmall: 5px;
	--small: 10px;
	--normal: 30px;
	--large: 50px;
	--xlarge: 75px;
	--25: 25px;
	--18pt: 18px;
	--20pt: 20px;
	--teambild_l: 350px;
	--Breite: min(1142px, calc(100% - clamp(10px, (100vw - 767px) * 1000, 20px)));

	/* Header-Höhe (fixierter Kopf), für Anker-Sprünge */
	--sbn-header-h: 141px;
}
