/**
 * Rheinfly – Design-Tokens.
 * Identisch in Elementor → Website-Einstellungen (globale Farben/Schriften) pflegen.
 */

/* Inter lokal (SIL OFL 1.1, siehe assets/fonts/OFL.txt) */
@font-face {
	font-family: "Inter";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/inter-400.woff2") format("woff2");
}
@font-face {
	font-family: "Inter";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/inter-600.woff2") format("woff2");
}
@font-face {
	font-family: "Inter";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/inter-700.woff2") format("woff2");
}

:root {
	/* Farben – Primär aus dem Logo (Schwarz), Akzent Rhein-Blau für Buchung/Links */
	--rf-primary: #111111;
	--rf-primary-contrast: #ffffff;
	--rf-accent: #0a58ca;          /* Weiß darauf: 6,4:1 */
	--rf-accent-hover: #08449c;
	--rf-accent-soft: #e8f0fc;
	--rf-logo-gray: #545454;
	--rf-text: #1a1a1a;
	--rf-muted: #5b6470;
	--rf-bg: #ffffff;
	--rf-bg-alt: #f5f7fa;
	--rf-border: #e3e7ed;
	--rf-success: #0b7a4b;         /* Parkhinweis: grün = nutzbar */
	--rf-danger: #c62828;          /* Parkhinweis: rot = freihalten */

	/* Schrift */
	--rf-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--rf-fs-sm: 14px;
	--rf-fs-base: 17px;
	--rf-fs-lg: 20px;
	--rf-fs-xl: 26px;
	--rf-fs-2xl: 32px;
	--rf-fs-3xl: 40px;
	--rf-fs-h1: 40px;
	--rf-fs-h2: 30px;
	--rf-fs-h3: 20px;
	--rf-lh-text: 1.6;
	--rf-lh-heading: 1.2;
	--rf-fw-regular: 400;
	--rf-fw-semibold: 600;
	--rf-fw-bold: 700;

	/* Abstände (4er-Raster) */
	--rf-space-1: 4px;
	--rf-space-2: 8px;
	--rf-space-3: 16px;
	--rf-space-4: 24px;
	--rf-space-5: 32px;
	--rf-space-6: 48px;
	--rf-space-7: 80px;
	--rf-section-y: 80px;

	/* Layout */
	--rf-container: 1200px;
	--rf-gutter: 16px;

	/* Radien & Schatten */
	--rf-radius: 12px;
	--rf-radius-btn: 10px;
	--rf-radius-pill: 999px;
	--rf-shadow-card: 0 1px 2px rgba(17, 17, 17, 0.04), 0 8px 24px rgba(17, 17, 17, 0.06);
	--rf-shadow-raised: 0 12px 32px rgba(17, 17, 17, 0.12);

	/* Bedienelemente */
	--rf-control-h: 48px;
	--rf-focus: 0 0 0 3px rgba(10, 88, 202, 0.35);
	--rf-transition: 160ms ease;
}

@media (max-width: 767px) {
	:root {
		--rf-fs-h1: 32px;
		--rf-fs-h2: 26px;
		--rf-section-y: 48px;
	}
}
