/**
 * Ergotherapie-Zentrum Ammerland: globale Styles.
 *
 * Tokens kommen aus theme.json (--wp--preset--*, --wp--custom--*).
 * Hier liegt, was theme.json nicht ausdrücken kann: Fokus, Bewegung,
 * Silbentrennung, Header-Verhalten, dekorative CI-Motive.
 *
 * Z-Index-Skala: 1 Deko-Ebene, 2 Inhalt über Deko, 100 Header, 100000 Navigations-Overlay (Core).
 */

/* Metrisch angeglichene Ersatzschriften: weniger Layoutsprung, bis die Webfonts geladen sind. */
@font-face {
	font-family: "Raleway Fallback";
	src: local("Arial Bold"), local("Arial-BoldMT"), local("Arial");
	font-weight: 100 900;
	size-adjust: 100.86%;
	ascent-override: 93.19%;
	descent-override: 23.2%;
	line-gap-override: 0%;
}

@font-face {
	font-family: "Lato Fallback";
	src: local("Arial"), local("ArialMT");
	size-adjust: 99.2%;
	ascent-override: 99.5%;
	descent-override: 21.47%;
	line-gap-override: 0%;
}

:root {
	--ezam-ease: var(--wp--custom--ease--out, cubic-bezier(0.22, 1, 0.36, 1));
	--ezam-fast: var(--wp--custom--duration--fast, 160ms);
	--ezam-base: var(--wp--custom--duration--base, 240ms);
	--ezam-slow: var(--wp--custom--duration--slow, 700ms);
	--ezam-radius-sm: var(--wp--custom--radius--sm, 0.75rem);
	--ezam-radius-md: var(--wp--custom--radius--md, 1.25rem);
	--ezam-radius-lg: var(--wp--custom--radius--lg, 2rem);
	--ezam-focus: var(--wp--preset--color--coral-dark);
	--ezam-header-offset: calc(var(--wp--custom--header--height, 5.25rem) + var(--wp-admin--admin-bar--height, 0px));
	--ezam-wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'%3E%3Cpath d='M0 64V30C160 6 330 0 520 16s380 42 560 34 280-30 360-44v58Z'/%3E%3C/svg%3E");
	color-scheme: light;
}

/*
 * Schutz vor seitlichem Verrutschen: html gibt overflow an den Viewport weiter (dort wird „clip“
 * zu „hidden“, keine waagerechte Scroll-Leiste, kein Wischen zur Seite). body und der
 * Seiten-Wrapper schneiden dann selbst ab: clip erzeugt keinen Scroll-Container, der klebende
 * Header bleibt intakt, fixierte Ebenen (Admin-Leiste, Menü-Overlay, Banner) sind nicht betroffen.
 */
html {
	scroll-padding-top: calc(var(--ezam-header-offset) + 1rem);
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	overflow-x: clip;
}

body {
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-tap-highlight-color: rgb(192 116 92 / 0.18);
	overflow-x: clip;
}

/*
 * Deko, die seitlich übersteht, ließe die Seite sonst per Wischgeste 1 bis 2px verrutschen.
 * Nur im Frontend: Im Website-Editor trägt die Block-Liste (.is-root-container) dieselbe Klasse.
 */
.wp-site-blocks:not(.is-root-container) {
	overflow-x: clip;
}

/* Block-Themes setzen Abstände zwischen Header, Main und Footer: die Übergänge gestalten die Abschnitte selbst. */
:where(.wp-site-blocks) > * {
	margin-block-start: 0;
}

::selection {
	background: var(--wp--preset--color--coral-light);
	color: var(--wp--preset--color--ink);
}

/* ---------- Typografie ---------- */

:where(h1, h2, h3, h4, h5, h6, .wp-block-heading) {
	text-wrap: balance;
	overflow-wrap: break-word;
	hyphens: auto;
	-webkit-hyphens: auto;
	hyphenate-limit-chars: 14 6 6;
	font-variant-numeric: lining-nums;
}

:where(p, li, dd, figcaption, blockquote) {
	text-wrap: pretty;
	overflow-wrap: break-word;
	hyphens: auto;
	-webkit-hyphens: auto;
	hyphenate-limit-chars: 10 4 4;
}

/* Silbentrennung nur, wo der Platz knapp ist: auf breiten Bildschirmen umbrechen Wörter ganz. */
@media (min-width: 782px) {
	:where(h1, h2, h3, h4, h5, h6, .wp-block-heading, p, li, dd, figcaption, blockquote) {
		hyphens: manual;
		-webkit-hyphens: manual;
	}
}

:where(.wp-element-button, .wp-block-navigation, .wp-block-site-title, .is-style-badge) {
	font-variant-numeric: lining-nums;
	hyphens: manual;
}

/* Raleway hat Mediävalziffern: auch Absätze in Raleway (Schriftwahl im Block) bekommen Versalziffern. */
:where(.has-raleway-font-family) {
	font-variant-numeric: lining-nums;
}

:where(p, li) {
	max-width: 70ch;
}

:where(.has-text-align-center) {
	margin-inline: auto;
}

strong,
b {
	font-weight: 700;
}

/* Telefonnummern, Postleitzahlen: nicht umbrechen, gleiche Ziffernbreite. */
.ezam-nowrap {
	white-space: nowrap;
}

.ezam-num {
	font-variant-numeric: lining-nums tabular-nums;
}

/* ---------- Links & Fokus ---------- */

a {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
	transition:
		color var(--ezam-fast) var(--ezam-ease),
		text-decoration-color var(--ezam-fast) var(--ezam-ease),
		text-decoration-thickness var(--ezam-fast) var(--ezam-ease);
}

a:hover {
	text-decoration-thickness: 2px;
}

/* Kein Doppeltipp-Zoom-Verzug auf Links und Bedienelementen (nicht an html/body, Zoomen bleibt möglich). */
:where(a, button, summary, label, [role="button"]) {
	touch-action: manipulation;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--ezam-focus);
	outline-offset: 3px;
	border-radius: 0.25rem;
}

/* Shape Lock: Buttons bleiben auch im Fokus Pillen (gleiche Spezifität wie die Regel darüber, steht später). */
:where(.wp-element-button, .wp-block-button__link):focus-visible {
	border-radius: var(--wp--custom--radius--pill);
}

:where(a, button, summary):focus:not(:focus-visible) {
	outline: none;
}

.skip-link.screen-reader-text:focus {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--base);
	font-family: var(--wp--preset--font-family--raleway);
	font-weight: 700;
	padding: 0.9rem 1.4rem;
	border-radius: var(--wp--custom--radius--pill);
	top: 0.75rem;
	left: 0.75rem;
	z-index: 100001;
	text-decoration: none;
	box-shadow: var(--wp--preset--shadow--soft);
}

/* ---------- Buttons ---------- */

:where(.wp-element-button, .wp-block-button__link) {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.6em;
	min-height: 3rem;
	touch-action: manipulation;
	text-decoration: none;
}

/*
 * Übergänge mit Klassen-Spezifität: die Link-Regel „a { transition }“ oben würde sie bei
 * Link-Buttons sonst ersetzen (dann springt die Fläche, während die Schrift noch überblendet).
 */
.wp-element-button,
.wp-block-button__link {
	transition:
		background-color var(--ezam-fast) var(--ezam-ease),
		border-color var(--ezam-fast) var(--ezam-ease),
		color var(--ezam-fast) var(--ezam-ease),
		box-shadow var(--ezam-base) var(--ezam-ease),
		transform var(--ezam-fast) var(--ezam-ease);
}

:where(.wp-element-button, .wp-block-button__link):hover {
	transform: translateY(-1px);
	box-shadow: 0 10px 22px -12px rgb(22 56 73 / 0.45);
}

:where(.wp-element-button, .wp-block-button__link):active {
	transform: translateY(0) scale(0.98);
	box-shadow: none;
}

:where(.wp-element-button, .wp-block-button__link) svg {
	flex: none;
	width: 1.25em;
	height: 1.25em;
}

/* ---------- Kopfbereich ---------- */

.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 100;
}

@media (max-width: 600px) {
	/* Die Admin-Leiste scrollt auf Handys mit: der Header klebt dann ganz oben. */
	.wp-site-blocks > header.wp-block-template-part {
		top: 0;
	}
}

.ezam-header {
	background-color: rgb(252 252 251 / 0.94);
	-webkit-backdrop-filter: saturate(140%) blur(10px);
	backdrop-filter: saturate(140%) blur(10px);
	border-bottom: 1px solid rgb(129 143 85 / 0.2);
}

@supports (animation-timeline: scroll()) {
	@media (prefers-reduced-motion: no-preference) {
		.ezam-header {
			animation: ezam-header-lift linear both;
			animation-timeline: scroll(root block);
			animation-range: 0 8rem;
		}
	}
}

@keyframes ezam-header-lift {
	to {
		border-bottom-color: transparent;
		box-shadow: 0 12px 32px -20px rgb(22 56 73 / 0.4);
	}
}

@media (prefers-reduced-transparency: reduce) {
	.ezam-header {
		background-color: var(--wp--preset--color--base);
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}
}

/* Dreifarbiger CI-Streifen aus dem Corporate-Design-Leitfaden. */
.ezam-tricolor {
	height: 5px;
	background: linear-gradient(
		90deg,
		var(--wp--preset--color--blue) 0 33.333%,
		var(--wp--preset--color--sage) 33.333% 66.666%,
		var(--wp--preset--color--coral) 66.666% 100%
	);
}

.ezam-header__bar {
	min-height: var(--wp--custom--header--height);
}

.ezam-header .ezam-brand {
	flex: 0 1 auto;
	min-width: 0;
}

.ezam-brand a {
	display: block;
	line-height: 0;
	border-radius: 0.5rem;
}

/* Im Header steht nur die Bildmarke (Hand, Blätter, Herz, Mensch), ohne Schriftzug. */
.ezam-brand img {
	display: block;
	width: auto;
	height: clamp(3rem, 2.5rem + 1.5vw, 4rem);
	max-width: 100%;
}

.ezam-footer .ezam-brand img {
	height: auto;
	width: min(15rem, 70vw);
}

.ezam-header__actions {
	flex: none;
}

/*
 * Telefon-Button im Header: Die Nummer steht ausgeschrieben neben Logo und Menü, solange die Zeile
 * Platz hat. Erst unter 480px wird er zum runden Symbol, die Nummer bleibt als Screenreader-Text erhalten.
 */
@media (max-width: 479.98px) {
	.ezam-header .ezam-contact__label {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		clip-path: inset(50%);
		white-space: nowrap;
	}

	.ezam-header .wp-block-ezam-contact .wp-element-button {
		width: 3rem;
		height: 3rem;
		padding: 0;
		border-radius: 50%;
	}
}

/* Navigation: Unter 1024px öffnet sich das Menü als Overlay, auch zwischen 600 und 1023px. */
@media (min-width: 600px) and (max-width: 1023.98px) {
	.ezam-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.ezam-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

/* ---------- Dekorative CI-Motive ---------- */

/* Pflanzenzeichnung als Randakzent, wie auf den Flyern. Rein dekorativ. */
.ezam-leaf-accent {
	position: relative;
	isolation: isolate;
}

.ezam-leaf-accent::after {
	content: "";
	position: absolute;
	z-index: -1;
	pointer-events: none;
	width: clamp(7rem, 12vw, 11rem);
	aspect-ratio: 340 / 650;
	right: clamp(-1rem, 1vw, 2rem);
	bottom: clamp(-2rem, -1vw, 0rem);
	background: url("../images/deko-blatt-zweig.webp") center / contain no-repeat;
	opacity: 0.75;
}

.ezam-leaf-accent--left::after {
	right: auto;
	left: clamp(-1.5rem, 1vw, 2rem);
	transform: scaleX(-1);
}

.ezam-leaf-accent--top::after {
	bottom: auto;
	top: clamp(-1rem, 1vw, 2rem);
}

.ezam-leaf-accent--ranke::after {
	background-image: url("../images/deko-blatt-ranke.webp");
	aspect-ratio: 340 / 569;
}

@media (max-width: 781.98px) {
	.ezam-leaf-accent::after {
		width: 6rem;
		opacity: 0.5;
	}
}

/* Organische Wellenkante oben oder unten an einer farbigen Fläche. */
.ezam-wave-top,
.ezam-wave-bottom {
	--ezam-wave-h: clamp(1.75rem, 4vw, 3.75rem);
}

.ezam-wave-top {
	-webkit-mask:
		var(--ezam-wave) top / 100% var(--ezam-wave-h) no-repeat,
		linear-gradient(#000 0 0) bottom / 100% calc(100% - var(--ezam-wave-h) + 1px) no-repeat;
	mask:
		var(--ezam-wave) top / 100% var(--ezam-wave-h) no-repeat,
		linear-gradient(#000 0 0) bottom / 100% calc(100% - var(--ezam-wave-h) + 1px) no-repeat;
	padding-top: calc(var(--ezam-wave-h) + var(--wp--preset--spacing--60)) !important;
}

.ezam-wave-bottom {
	-webkit-mask:
		var(--ezam-wave) bottom / 100% var(--ezam-wave-h) no-repeat,
		linear-gradient(#000 0 0) top / 100% calc(100% - var(--ezam-wave-h) + 1px) no-repeat;
	mask:
		var(--ezam-wave) bottom / 100% var(--ezam-wave-h) no-repeat,
		linear-gradient(#000 0 0) top / 100% calc(100% - var(--ezam-wave-h) + 1px) no-repeat;
	padding-bottom: calc(var(--ezam-wave-h) + var(--wp--preset--spacing--60)) !important;
}

.ezam-wave-bottom {
	--ezam-wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'%3E%3Cpath d='M0 0v34c160 24 330 30 520 14s380-42 560-34 280 30 360 44V0Z'/%3E%3C/svg%3E");
}

/* Weiche organische Fläche hinter Bildkompositionen (Hero). */
.ezam-blob {
	position: relative;
	isolation: isolate;
}

.ezam-blob::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset: 6% -4% -2% 8%;
	background: var(--wp--preset--color--sage-wash);
	border-radius: 58% 42% 46% 54% / 48% 56% 44% 52%;
	pointer-events: none;
}

.ezam-blob--coral::before {
	background: var(--wp--preset--color--coral-wash);
}

.ezam-blob--blue::before {
	background: var(--wp--preset--color--blue-wash);
}

/* Startseiten-Hero nebeneinander: Die Fläche tritt unten rechts deutlich als Form hervor, nicht als schmaler Rand. */
@media (min-width: 900px) {
	.ezam-home-hero .ezam-blob::before {
		inset: 12% -7% -6% 18%;
	}
}

/* Hero-Bildkomposition: großes Bild mit kleinem, überlappendem Rundbild. */
.ezam-hero-media {
	position: relative;
}

.ezam-hero-media > .wp-block-image:first-child {
	margin: 0;
}

.ezam-hero-media .ezam-hero-inset {
	position: absolute;
	z-index: 2;
	left: -4%;
	bottom: 6%;
	width: 34%;
	margin: 0;
}

.ezam-hero-media .ezam-hero-inset img {
	border: 0.4rem solid var(--wp--preset--color--base);
	box-shadow: var(--wp--preset--shadow--soft);
}

@media (max-width: 781.98px) {
	.ezam-hero-media .ezam-hero-inset {
		left: 0;
		bottom: -4%;
		width: 36%;
	}
}

/* ---------- Bewegung ---------- */

@keyframes ezam-rise {
	from {
		opacity: 0;
		translate: 0 1.25rem;
	}

	to {
		opacity: 1;
		translate: 0 0;
	}
}

@keyframes ezam-unveil {
	from {
		clip-path: inset(18% 0 0 0 round var(--ezam-radius-lg));
		opacity: 0.2;
		scale: 1.04;
	}

	to {
		clip-path: inset(0 0 0 0 round 0);
		opacity: 1;
		scale: 1;
	}
}

@media (prefers-reduced-motion: no-preference) {
	/* Hero: Text in Lesereihenfolge, danach das Bild. */
	.ezam-hero-intro > * {
		animation: ezam-rise var(--ezam-slow) var(--ezam-ease) both;
	}

	.ezam-hero-intro > :nth-child(2) { animation-delay: 70ms; }
	.ezam-hero-intro > :nth-child(3) { animation-delay: 140ms; }
	.ezam-hero-intro > :nth-child(4) { animation-delay: 210ms; }
	.ezam-hero-intro > :nth-child(5) { animation-delay: 280ms; }

	.ezam-hero-media > .wp-block-image:first-child img {
		animation: ezam-unveil 1s var(--ezam-ease) 120ms both;
	}

	.ezam-hero-media .ezam-hero-inset {
		animation: ezam-rise var(--ezam-slow) var(--ezam-ease) 520ms both;
	}

	/* Abschnitte gleiten beim Scrollen herein, wo der Browser Scroll-Timelines kann. Ohne Unterstützung bleibt alles sichtbar. */
	@supports (animation-timeline: view()) {
		.ezam-reveal > * {
			animation: ezam-rise linear both;
			animation-timeline: view();
			animation-range: entry 0% entry 70%;
		}
	}
}

/* ---------- Kontakt- und Icon-Block ---------- */

.ezam-icon {
	--ezam-icon-size: 2.5rem;
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: var(--ezam-icon-size);
	height: var(--ezam-icon-size);
	color: var(--ezam-icon-color, currentColor);
	line-height: 0;
}

.ezam-icon svg {
	width: 100%;
	height: 100%;
}

.ezam-icon.is-size-s { --ezam-icon-size: 1.5rem; }
.ezam-icon.is-size-m { --ezam-icon-size: 2.5rem; }
.ezam-icon.is-size-l { --ezam-icon-size: 3.5rem; }

.ezam-icon.has-tone-blue { --ezam-icon-color: var(--wp--preset--color--blue); --ezam-icon-bg: var(--wp--preset--color--blue-wash); --ezam-icon-solid: var(--wp--preset--color--blue); }
.ezam-icon.has-tone-sage { --ezam-icon-color: var(--wp--preset--color--sage-dark); --ezam-icon-bg: var(--wp--preset--color--sage-wash); --ezam-icon-solid: var(--wp--preset--color--sage); }
.ezam-icon.has-tone-coral { --ezam-icon-color: var(--wp--preset--color--coral-dark); --ezam-icon-bg: var(--wp--preset--color--coral-wash); --ezam-icon-solid: var(--wp--preset--color--coral); }
.ezam-icon.has-tone-ink { --ezam-icon-color: var(--wp--preset--color--ink); --ezam-icon-bg: var(--wp--preset--color--blue-wash); --ezam-icon-solid: var(--wp--preset--color--ink); }
.ezam-icon.has-tone-base { --ezam-icon-color: var(--wp--preset--color--base); --ezam-icon-bg: rgb(252 252 251 / 0.14); --ezam-icon-solid: var(--wp--preset--color--base); }

.ezam-icon.has-badge-soft,
.ezam-icon.has-badge-solid {
	width: calc(var(--ezam-icon-size) * 1.7);
	height: calc(var(--ezam-icon-size) * 1.7);
	padding: calc(var(--ezam-icon-size) * 0.35);
	border-radius: 50%;
	background: var(--ezam-icon-bg);
}

.ezam-icon.has-badge-solid {
	background: var(--ezam-icon-solid);
	color: var(--wp--preset--color--base);
}

.ezam-icon.has-tone-base.has-badge-solid {
	color: var(--wp--preset--color--blue);
}

/* Nur Browser-Standardabstand zurücksetzen; Block-Gap-Abstände von Gruppen und Spalten bleiben erhalten. */
:where(.wp-block-ezam-contact) {
	margin: 0;
}

.ezam-contact-link {
	display: inline-flex;
	align-items: flex-start;
	gap: 0.65em;
	color: var(--wp--preset--color--blue);
	font-weight: 700;
	text-decoration: none;
	min-height: 1.5rem;
}

.ezam-contact-link .ezam-icon {
	--ezam-icon-size: 1.3em;
	color: var(--wp--preset--color--coral-dark);
	margin-top: 0.12em;
}

a.ezam-contact-link:hover .ezam-contact__label {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.2em;
}

a.ezam-contact-link:hover {
	color: var(--wp--preset--color--coral-dark);
}

/* Auf Grün hell hätte Koralle dunkel nur 4,3:1: Die Schrift wird dunkler, die Unterstreichung zeigt den Hover. */
.is-style-section-sage a.ezam-contact-link:hover {
	color: var(--wp--preset--color--ink);
}

.ezam-contact-link address,
.ezam-contact-text address {
	font-style: normal;
}

.ezam-contact-text {
	display: inline-flex;
	align-items: flex-start;
	gap: 0.65em;
}

.ezam-contact-text .ezam-icon {
	--ezam-icon-size: 1.3em;
	color: var(--wp--preset--color--coral-dark);
	margin-top: 0.12em;
}

/* Kontakt-Buttons: gleiche Basis wie Core-Buttons, Varianten über Klassen. */
.wp-block-ezam-contact .wp-element-button.is-accent {
	background-color: var(--wp--preset--color--coral-dark);
	border-color: var(--wp--preset--color--coral-dark);
	color: var(--wp--preset--color--base);
}

.wp-block-ezam-contact .wp-element-button.is-accent:hover,
.wp-block-ezam-contact .wp-element-button.is-accent:focus-visible {
	background-color: #865140;
	border-color: #865140;
}

.wp-block-ezam-contact .wp-element-button.is-outline {
	background-color: transparent;
	border-color: currentColor;
	color: var(--wp--preset--color--blue);
}

.wp-block-ezam-contact .wp-element-button.is-outline:hover,
.wp-block-ezam-contact .wp-element-button.is-outline:focus-visible {
	background-color: var(--wp--preset--color--blue-wash);
	border-color: var(--wp--preset--color--blue);
	color: var(--wp--preset--color--ink);
}

/* Auf dunklen Abschnitten (Blau, Grün dunkel) werden Buttons hell. */
:where(.is-style-section-blue, .is-style-section-sage-strong) .wp-block-ezam-contact .wp-element-button:not(.is-accent) {
	background-color: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--blue);
}

:where(.is-style-section-blue, .is-style-section-sage-strong) .wp-block-ezam-contact .wp-element-button.is-outline {
	background-color: transparent;
	border-color: rgb(252 252 251 / 0.7);
	color: var(--wp--preset--color--base);
}

/* Hover und Fokus auf dunklen Flächen: heller Button wird blau getönt, Kontur-Button bleibt hell beschriftet. */
:where(.is-style-section-blue, .is-style-section-sage-strong) .wp-block-ezam-contact .wp-element-button:not(.is-accent):not(.is-outline):is(:hover, :focus-visible) {
	background-color: var(--wp--preset--color--blue-wash);
	border-color: var(--wp--preset--color--blue-wash);
	color: var(--wp--preset--color--ink);
}

/* Zarte Hover-Fläche (0,08 wie beim Core-Kontur-Button): heller Text bleibt auch auf Grün dunkel über 4,5:1. */
:where(.is-style-section-blue, .is-style-section-sage-strong) .wp-block-ezam-contact .wp-element-button.is-outline:is(:hover, :focus-visible) {
	background-color: rgb(252 252 251 / 0.08);
	border-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--base);
}

:where(.is-style-section-blue, .is-style-section-sage-strong) .ezam-contact-link,
:where(.is-style-section-blue, .is-style-section-sage-strong) .ezam-contact-link .ezam-icon,
:where(.is-style-section-blue, .is-style-section-sage-strong) .ezam-contact-text .ezam-icon {
	color: var(--wp--preset--color--base);
}

/* ---------- Fußbereich ---------- */

.ezam-footer a:not(.wp-element-button) {
	text-decoration: none;
}

.ezam-footer a:not(.wp-element-button):hover {
	text-decoration: underline;
}

.ezam-footer .wp-block-navigation .wp-block-navigation-item__content {
	padding-block: 0.2rem;
}

/* ---------- Druck ---------- */

@media print {
	.wp-site-blocks > header.wp-block-template-part {
		position: static;
	}

	.ezam-header,
	.ezam-leaf-accent::after,
	.ezam-blob::before {
		backdrop-filter: none;
		background: none;
	}

	.wp-block-navigation__responsive-container-open,
	.ezam-tricolor {
		display: none !important;
	}
}