/**
 * WEB-116: Design-Tokens, Typo, Cards, Buttons.
 * WEB-124: ausschließlich Light-Theme — keine Dark-Variante.
 * theme.json bleibt Design-Quelle; diese Datei spiegelt die Tokens als --fs-*.
 */

@font-face {
	font-family: "Source Sans 3";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/source-sans-3-latin-400-normal.woff2") format("woff2");
}

@font-face {
	font-family: "Source Sans 3";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/source-sans-3-latin-600-normal.woff2") format("woff2");
}

@font-face {
	font-family: "Source Sans 3";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/source-sans-3-latin-700-normal.woff2") format("woff2");
}

:root {
	color-scheme: light;
	--fs-blue: #404890;
	--fs-blue-dark: #2c3268;
	--fs-surface: #f4f5fa;
	--fs-line: #e6e8f2;
	--fs-ink: #1f2430;
	--fs-muted: #5c6370;
	--fs-bg: #ffffff;
	--fs-on-brand: #ffffff;
	--fs-header-bg: #ffffff;
	--fs-control-bg: #ffffff;
	--fs-link: #404890;
	--fs-link-hover: #2c3268;
	--fs-heading: #2c3268;
	--fs-radius-card: 1.25rem;
	--fs-radius-btn: 0.75rem;
	/* WEB-1083: Statusfarben für Formular-Rückmeldungen. AA gegen die jeweilige Fläche. */
	--fs-ok-surface: #e9f2ec;
	--fs-ok-ink: #1b5e33;
	--fs-err-surface: #fbeaea;
	--fs-err-ink: #8a1f1f;
	--fs-shadow-card: 0 1px 0 rgba(44, 50, 104, 0.04), 0 18px 40px rgba(44, 50, 104, 0.07);
	--fs-section-pad: clamp(3.5rem, 8vw, 6rem);
	--fs-type-body: clamp(1.0625rem, 0.3vw + 1rem, 1.125rem);
	--fs-type-h1: clamp(2.25rem, 4.5vw, 3.5rem);
	--fs-type-h2: clamp(1.5rem, 2.2vw, 2rem);
	scrollbar-color: var(--fs-line) var(--fs-surface);
}

html {
	color-scheme: light;
	max-width: 100%;
}

body {
	background: var(--fs-bg);
	color: var(--fs-ink);
	font-family: "Source Sans 3", ui-sans-serif, "Segoe UI", sans-serif;
	font-size: var(--fs-type-body);
	line-height: 1.6;
}

.site-header-part,
.wp-site-blocks > .wp-block-template-part:has(.site-header),
.site-header {
	background: var(--fs-header-bg);
}

.site-header {
	color: var(--fs-blue);
	border-bottom-color: var(--fs-line);
}

.site-title a,
.primary-menu a {
	color: var(--fs-heading);
}

.primary-menu a:hover,
.primary-menu a:focus {
	color: var(--fs-link);
	background: var(--fs-surface);
}

.site-main a {
	color: var(--fs-link);
}

.site-main a:hover,
.site-main a:focus {
	color: var(--fs-link-hover);
}

/* WEB-287: CTA-Links müssen .site-main a schlagen (gleiche Spezifität, tokens.css lädt danach). */
.site-main .fs-cta a:not(.wp-block-button__link) {
	color: var(--fs-on-brand);
	text-decoration: underline;
	text-underline-offset: 0.18em;
}

.site-main .fs-cta a:not(.wp-block-button__link):hover,
.site-main .fs-cta a:not(.wp-block-button__link):focus {
	color: var(--fs-on-brand);
}

.site-main .fs-cta a:not(.wp-block-button__link):focus-visible {
	outline: 2px solid var(--fs-on-brand);
	outline-offset: 0.2em;
}

.site-main h1,
.site-main h2,
.site-main .wp-block-heading:is(h1, h2, h3) {
	color: var(--fs-heading);
	font-weight: 700;
	letter-spacing: -0.03em;
	text-wrap: balance;
}

.site-main h1,
.site-main .wp-block-heading:is(h1) {
	font-size: var(--fs-type-h1);
	line-height: 1.12;
}

.site-main h2,
.site-main .wp-block-heading:is(h2) {
	font-size: var(--fs-type-h2);
	line-height: 1.2;
}

.fs-hero .wp-block-heading,
.fs-hero h1,
.fs-cta .wp-block-heading,
.fs-cta h2 {
	color: var(--fs-on-brand);
	font-size: var(--fs-type-h1);
	letter-spacing: -0.03em;
	text-wrap: balance;
}

.fs-cta .wp-block-heading,
.fs-cta h2 {
	font-size: var(--fs-type-h2);
}

.site-main .wp-block-post-content > .wp-block-heading,
.site-main .entry-content > .wp-block-heading {
	margin-block-start: var(--fs-section-pad);
}

.site-main .wp-block-post-content > .wp-block-heading:first-child,
.site-main .entry-content > .wp-block-heading:first-child {
	margin-block-start: 0;
}

.fs-hero.wp-block-cover .wp-block-cover__inner-container,
.fs-hero:not(.wp-block-cover) {
	padding-block: var(--fs-section-pad);
}

.fs-hero.wp-block-cover.alignfull .wp-block-cover__inner-container {
	padding-block: var(--fs-section-pad);
	padding-inline: clamp(1.25rem, 5vw, 4rem);
}

.fs-cta {
	padding-block: var(--fs-section-pad) !important;
}

.site-main .has-surface-background-color {
	background-color: var(--fs-surface) !important;
}

.fs-cards .wp-block-column {
	border: 0;
	border-radius: var(--fs-radius-card);
	background: var(--fs-bg);
	box-shadow: var(--fs-shadow-card);
	overflow: hidden;
	transition: transform 180ms ease, box-shadow 180ms ease;
}

.fs-cards .wp-block-column.has-surface-background-color,
.fs-cards .wp-block-column.has-background {
	background: var(--fs-bg) !important;
}

.fs-cards .wp-block-column:hover,
.fs-cards .wp-block-column:focus-within {
	transform: translateY(-4px);
}

.fs-cards .wp-block-heading::before {
	content: none !important;
	display: none !important;
}

.fs-card-photo img,
.fs-cards .wp-block-image img {
	border-radius: 0.85rem;
}

.fs-trust-photo img,
.fs-map-embed iframe {
	border-radius: var(--fs-radius-card);
}

.site-main .wp-block-button__link,
.editor-styles-wrapper .wp-block-button__link,
.fs-anfrage-form__submit,
.primary-menu > li:last-child > a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.75rem;
	padding: 0.85rem 1.4rem;
	border-radius: var(--fs-radius-btn);
	font-weight: 600;
	box-shadow: none;
	text-decoration: none;
	transition: background-color 180ms ease, color 180ms ease, transform 180ms ease, border-color 180ms ease;
}

.site-main .wp-block-button:not(.is-style-outline) .wp-block-button__link,
.fs-hero .wp-block-button:not(.is-style-outline) .wp-block-button__link,
.fs-anfrage-form__submit,
.primary-menu > li:last-child > a {
	background-color: var(--fs-blue);
	color: var(--fs-on-brand);
	border: 0;
	box-shadow: none;
}

.site-main .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.site-main .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus,
.fs-hero .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.fs-hero .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus,
.fs-anfrage-form__submit:hover,
.fs-anfrage-form__submit:focus,
.primary-menu > li:last-child > a:hover,
.primary-menu > li:last-child > a:focus {
	background-color: var(--fs-blue-dark);
	color: var(--fs-on-brand);
	transform: translateY(-1px);
	box-shadow: none;
}

/* WEB-287: Invertierter Primärbutton nur im CTA — Gutenberg-Presets nutzen !important. */
.site-main .fs-cta .wp-block-button:not(.is-style-outline) .wp-block-button__link {
	background-color: var(--fs-on-brand) !important;
	color: var(--fs-blue) !important;
	border: 0;
	box-shadow: none;
}

.site-main .fs-cta .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.site-main .fs-cta .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus {
	background-color: var(--fs-surface) !important;
	color: var(--fs-blue-dark) !important;
	transform: translateY(-1px);
	box-shadow: none;
}

.site-main .fs-cta .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus-visible {
	outline: 2px solid var(--fs-on-brand);
	outline-offset: 3px;
}

.site-main .wp-block-button.is-style-outline .wp-block-button__link,
.fs-hero .wp-block-button.is-style-outline .wp-block-button__link,
.fs-cta .wp-block-button.is-style-outline .wp-block-button__link {
	background-color: transparent;
	box-shadow: none;
	border: 1.5px solid currentColor;
}

.fs-hero .wp-block-button.is-style-outline .wp-block-button__link,
.fs-cta .wp-block-button.is-style-outline .wp-block-button__link {
	color: var(--fs-on-brand);
	border-color: var(--fs-on-brand);
}

.fs-hero .wp-block-button.is-style-outline .wp-block-button__link:hover,
.fs-hero .wp-block-button.is-style-outline .wp-block-button__link:focus,
.fs-cta .wp-block-button.is-style-outline .wp-block-button__link:hover,
.fs-cta .wp-block-button.is-style-outline .wp-block-button__link:focus {
	background-color: rgba(255, 255, 255, 0.12);
	transform: translateY(-1px);
}

input,
select,
textarea,
button:not(.nav-toggle):not(.fs-anfrage-form__submit) {
	color-scheme: inherit;
}

.fs-anfrage-form input,
.fs-anfrage-form select,
.fs-anfrage-form textarea {
	background: var(--fs-control-bg);
	color: var(--fs-ink);
	border-color: var(--fs-line);
	border-radius: var(--fs-radius-btn);
}

.fs-faq-item {
	background: var(--fs-surface);
	color: var(--fs-ink);
	border-color: var(--fs-line);
	border-radius: var(--fs-radius-card);
}

.fs-faq-item > summary {
	color: var(--fs-heading);
}

.site-nav {
	background: var(--fs-header-bg);
}

@media (prefers-reduced-motion: reduce) {
	.fs-cards .wp-block-column,
	.site-main .wp-block-button__link,
	.fs-anfrage-form__submit,
	.primary-menu > li:last-child > a {
		transition: none;
		transform: none;
	}

	.fs-cards .wp-block-column:hover,
	.fs-cards .wp-block-column:focus-within,
	.site-main .wp-block-button__link:hover,
	.site-main .wp-block-button__link:focus,
	.fs-anfrage-form__submit:hover,
	.fs-anfrage-form__submit:focus,
	.primary-menu > li:last-child > a:hover,
	.primary-menu > li:last-child > a:focus {
		transform: none;
	}
}
