/*
Theme Name: Yin Yoga Conference
Theme URI: https://yin-yoga-conference.de
Author: Jan Wolk
Description: Block-Theme der Yin Yoga Conference — Katalog: strenges Raster, viel Weiß, die Lehrenden gehängt wie Werke, Abendblau nur für die Hauptaktion. Farben, Schrift und Abstände stehen in theme.json; SEO-Ausgabe macht Rank Math, Funktionen das Site-Plugin yin-yoga-conference-site.
Version: 4.6.1
Requires at least: 6.9
Tested up to: 7.1
Requires PHP: 8.2
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: yin-yoga-conference
*/


/* ---------------------------------------------------------------
   Ersatzschriften, solange Hanken Grotesk und Newsreader laden: Systemschriften auf Laufweite und Höhen
   der Webschriften gebracht, damit die Zeilen beim Schriftwechsel nicht neu umbrechen.
   Werte aus den Schriftdateien (fontTools, 2026-10-04): Laufweite eines deutschen Mustersatzes
   Hanken/Arial = 99,51 %, Newsreader/Georgia = 91,41 %; Höhen aus den Typo-Metriken
   (Hanken 1,0 / 0,303, Newsreader 0,735 / 0,265) geteilt durch diesen Faktor.
   --------------------------------------------------------------- */
@font-face {
	font-family: "Hanken Grotesk Ersatz";
	src: local("Arial"), local("ArialMT"), local("Helvetica"), local("Roboto");
	size-adjust: 99.51%;
	ascent-override: 100.49%;
	descent-override: 30.45%;
	line-gap-override: 0%;
}

@font-face {
	font-family: "Newsreader Ersatz";
	src: local("Georgia"), local("Times New Roman"), local("Noto Serif");
	size-adjust: 91.41%;
	ascent-override: 80.41%;
	descent-override: 28.99%;
	line-gap-override: 0%;
}


/* ---------------------------------------------------------------
   Kurzformen der Tokens aus theme.json
   --------------------------------------------------------------- */
:root {
	--yyc-bg: var(--wp--preset--color--background);
	--yyc-lavur: var(--wp--preset--color--surface);
	--yyc-input: var(--wp--preset--color--surface-input);
	--yyc-ink: var(--wp--preset--color--text);
	--yyc-text: var(--wp--preset--color--text-body);
	--yyc-muted: var(--wp--preset--color--text-muted);
	--yyc-line: var(--wp--preset--color--border);
	--yyc-line-lit: var(--wp--preset--color--border-strong);
	--yyc-abendblau: var(--wp--preset--color--abendblau);
	--yyc-nacht: var(--wp--preset--color--nacht);
	--yyc-focus: var(--wp--preset--color--focus);
	--yyc-error: var(--wp--preset--color--error);
	/* Große Ziffern der Schritte in Stein (5,48:1 auf Grund) */
	--yyc-ziffer: var(--wp--preset--color--text-muted);
	--yyc-ui: var(--wp--preset--font-family--ui);
	--yyc-headline: var(--wp--preset--font-family--headline);
	--yyc-sans: var(--wp--preset--font-family--text);
	--yyc-dur: var(--wp--custom--motion--duration);
	--yyc-slow: var(--wp--custom--motion--slow);
	--yyc-ease: var(--wp--custom--motion--easing);
	--yyc-gap: var(--wp--custom--section-gap);
	--yyc-measure: var(--wp--custom--measure);
	--yyc-pad: clamp(1rem, 4vw, 3rem);
	/* Eine Zeile Grundschrift: das Maß für Abstände zwischen Überschrift und Text */
	--yyc-zeile: calc(1.55 * var(--wp--preset--font-size--base));
}

/* ---------------------------------------------------------------
   Flächen: vier Stile. Grund (flaeche-grund, flaeche-gelb) ist der Seitengrund, Pergament (flaeche-pergament)
   eine ruhige Fläche, Tusche (flaeche-dunkel, .yyc-night) die dunkle. Zwei Blautöne: Nacht ist der Grund von Knöpfen
   und Marken, Abendblau erscheint beim Zeigen – die Lampe geht an. Die Kante #8FA6DE steht nur auf Tusche.
   (Jan, 2026-10-08: Namen aus „Tusche und Siegel“ abgelöst; der Übergangsblock für die alten Klassen ist seit 2026-10-09 entfernt.)
   --------------------------------------------------------------- */
:root,
.yyc-flaeche-hell {
	--fl-bg: var(--yyc-bg);
	--fl-text: var(--yyc-text);
	--fl-soft: var(--yyc-muted);
	--fl-link: var(--yyc-ink);
	--fl-link-hover: var(--yyc-abendblau);
	--fl-focus: var(--yyc-focus);
	--fl-line: var(--yyc-line);
	--fl-line-lit: var(--yyc-line-lit);
	--fl-knoten: var(--yyc-line-lit);
	--fl-select-bg: var(--yyc-ink);
	--fl-select-text: var(--yyc-bg);
}

.is-style-flaeche-pergament {
	--fl-bg: var(--yyc-lavur); /* Pergament #E6E0D2 */
	--fl-line: #CFC8B8;
}

/* Fläche dunkel = Tusche (Nachtrag „Blass“, 2026-10-05): Gastgeber-Abschnitt, Schlussfelder der Unterseiten, Footer.
   Die Kurzformen werden im Block neu belegt, damit Überschriften, Links und Linien von selbst hell stehen.
   Kontraste: Kalkweiß 15,5 : 1, Stein dunkel 7,9 : 1, Hover 7,05 : 1. */
.is-style-flaeche-dunkel,
.yyc-night {
	--yyc-bg: var(--wp--preset--color--surface-dark);
	--yyc-ink: #F5F4F0;
	--yyc-text: #E9E6DF;
	--yyc-muted: #B3B0A6;
	--yyc-line: #3A3A37;
	--yyc-line-lit: #6E6C66;
	--fl-bg: var(--wp--preset--color--surface-dark);
	--fl-text: #E9E6DF;
	--fl-soft: #B3B0A6;
	--fl-link: #F5F4F0;
	--fl-link-hover: #8FA6DE;
	--fl-focus: #F5F4F0;
	--fl-line: #3A3A37;
	--fl-line-lit: #6E6C66;
	--fl-select-bg: #F5F4F0;
	--fl-select-text: #1C1C1A;
}

/* Hauptaktion auf Tusche: Kalkweiß gefüllt, Tusche-Schrift (Abendblau hätte dort nur 2 : 1) */
:is(.is-style-flaeche-dunkel, .yyc-night) .wp-block-button:not(.is-style-outline) > .wp-block-button__link {
	background: #F5F4F0;
	border-color: #F5F4F0;
	color: #1C1C1A;
}

:is(.is-style-flaeche-dunkel, .yyc-night) .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover,
:is(.is-style-flaeche-dunkel, .yyc-night) .wp-block-button:not(.is-style-outline) > .wp-block-button__link:focus-visible {
	background: #E6E0D2;
	border-color: #E6E0D2;
	color: #1C1C1A;
}

:is(.is-style-flaeche-dunkel, .yyc-night) .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: #F5F4F0;
	color: #1C1C1A;
}

/* Marke auf Tusche: Nacht bleibt, die Kante trägt die Marke, nicht die Fläche (Nacht auf Tusche 1,44 : 1, Kante 7,05 : 1;
   Jan, 2026-10-08: seit „die Lampe geht an“ steht die Marke auf Nacht) */
:is(.is-style-flaeche-dunkel, .yyc-night) .yyc-siegel:not(.yyc-siegel--leer) {
	box-shadow: inset 0 0 0 1px #8FA6DE;
}

:is(.is-style-flaeche-dunkel, .yyc-night) a:where(:not(.wp-element-button)):hover {
	color: #8FA6DE;
}

/* Der Footer liegt auf Tusche; folgt er auf ein dunkles Schlussfeld, trennt ihn eine Linie */
.yyc-footer {
	border-top: 1px solid #3A3A37;
}

:where([class*="is-style-flaeche-"], .yyc-night) {
	color: var(--fl-text);
	background-color: var(--fl-bg);
	border-image: conic-gradient(var(--fl-bg) 0 0) fill 0 / / 0 100vmax;
}

/* ---------------------------------------------------------------
   Grundlagen
   --------------------------------------------------------------- */
html {
	scroll-behavior: smooth;
	scrollbar-color: var(--yyc-line-lit) var(--yyc-bg);
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	caret-color: var(--yyc-abendblau);
	accent-color: var(--yyc-ink); /* Abendblau-Regel: Kästchen und Radios in Ruhe nicht blau */
	overflow-wrap: break-word;
	overflow-x: clip;
	hyphens: auto;
	hyphenate-limit-chars: 12 5 4;
	-webkit-hyphenate-limit-before: 5; /* Safari kennt hyphenate-limit-chars nicht */
	-webkit-hyphenate-limit-after: 4;
	-webkit-hyphenate-limit-lines: 2;
	hyphenate-limit-lines: 2;
	font-kerning: normal;
	font-size: clamp(1.1875rem, 1.12rem + 0.3vw, 1.3125rem);
	font-optical-sizing: auto;
	/* Newsreader: Mediävalziffern im Text, Versalziffern in Überschriften */
	font-variant-numeric: oldstyle-nums proportional-nums;
	hanging-punctuation: first allow-end;
}

::selection {
	background: var(--fl-select-bg);
	color: var(--fl-select-text);
}

h1, h2, h3, h4, h5, h6 {
	text-wrap: balance;
	hyphens: manual;
	font-variant-numeric: lining-nums;
	color: var(--yyc-ink);
}

p, li, dd, figcaption {
	text-wrap: pretty;
}

:where(.wp-block-post-content, .yyc-section__body) :where(p, ul, ol, dl, blockquote) {
	max-width: var(--yyc-measure);
}

[id] {
	scroll-margin-top: var(--wp--preset--spacing--60);
}

a {
	color: var(--fl-link);
	text-decoration-color: var(--yyc-line-lit);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.22em;
	transition: color var(--yyc-dur) var(--yyc-ease), text-decoration-color var(--yyc-dur) var(--yyc-ease);
}

a:where(:not(.wp-element-button)):hover {
	color: var(--fl-link-hover);
	text-decoration-color: currentColor;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--fl-focus);
	outline-offset: 3px;
}

.yyc-skip-link,
.skip-link.screen-reader-text:focus {
	background: var(--yyc-ink);
	color: var(--yyc-bg);
	font-weight: 700;
	padding: 0.75rem 1.5rem;
	text-decoration: none;
}

time,
.yyc-tabular,
.wp-block-post-date {
	font-variant-numeric: tabular-nums lining-nums;
}

/* Optischer Randausgleich: Überschriften fluchten an der Buchstabenkante mit der Lesespalte.
   Folgezeilen rücken um die übliche Vorbreite von Hanken Grotesk 300 (0,075 em), die erste Zeile um die gemessene
   ihres ersten Buchstabens (--yyc-vorbreite, gesetzt von satz.php). Bezugskante ist die Kante im Lesetext, nicht die
   Spaltenkante: Newsreader 400 hat vor Stämmen und Serifen im Mittel 0,033 em Vorbreite, bei 1,3125 rem rund
   0,043 rem (--yyc-lesekante; gemessen mit fontTools, opsz 20, 2026-10-04). */
:root {
	--yyc-lesekante: 0.043rem;
}

:where(h1, h2, h3, h4)[style*="--yyc-vorbreite"],
.yyc-title__main,
.yyc-title__claim {
	margin-inline-start: calc(-0.068em + var(--yyc-lesekante));
	text-indent: calc((var(--yyc-vorbreite, 0.068) - 0.068) * -1em);
}

/* Links trennen nicht nach Wörterbuch (nur an Fugen aus satz.php): Ein gebundenes „für␣Anfänger“ zählte sonst als
   ein langes Wort und bräche als „An-fänger“. */
:where(p, li, dd, figcaption) a {
	-webkit-hyphens: manual;
	hyphens: manual;
}

/* Wörter aus der Fugenliste (satz.php) trennen nur an ihrer Wortfuge */
.yyc-fuge {
	-webkit-hyphens: manual;
	hyphens: manual;
}

/* Label (Format, Kategorie) */
.yyc-label,
.is-style-yyc-label {
	display: inline-block;
	border: 1px solid var(--fl-line-lit);
	color: var(--yyc-ink);
	font-family: var(--yyc-ui);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 500;
	letter-spacing: 0.1em;
	font-variant-numeric: tabular-nums lining-nums;
	line-height: 1.3;
	text-transform: uppercase;
	padding: 0.3rem 0.6rem;
}

/* Präventionskurs: eigene Farbe (Seladon), von keiner anderen Rolle genutzt; eckig wie alles im Katalog */
.yyc-label--praevention,
.is-style-yyc-label-praevention {
	background: var(--wp--preset--color--label-praevention);
	border-color: var(--wp--preset--color--label-praevention);
	color: var(--yyc-bg);
	border-radius: var(--wp--custom--radius--blatt);
	padding-inline: 0.8rem;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* ---------------------------------------------------------------
   Buttons — das einzige blaue Feld neben den Marken
   --------------------------------------------------------------- */
.wp-block-button__link,
.wp-element-button,
.yyc-form button[type="submit"] {
	/* Block statt Flex: In einem Flex-Container fällt das Leerzeichen vor einer Trennfuge (span.yyc-fuge) weg
	   („dasKontaktformular“). align-content zentriert senkrecht auch im Block. */
	display: inline-block;
	align-content: center;
	text-align: center;
	min-height: 3.25rem;
	/* Höhe kommt aus min-height; der kleine Innenabstand greift nur, wenn eine Beschriftung umbricht.
	   Gilt auch für Outline-Knöpfe, denen der Kern 2 px mehr gibt — so stehen beide gleich hoch. */
	padding-block: 0.5rem !important;
	cursor: pointer;
	font-variant-numeric: lining-nums;
	transition: background-color var(--yyc-dur) var(--yyc-ease), border-color var(--yyc-dur) var(--yyc-ease), color var(--yyc-dur) var(--yyc-ease), transform 120ms var(--yyc-ease);
}

/* Die Lampe geht an (Jan, 2026-10-08): Hauptaktionen stehen auf Nacht, beim Zeigen werden sie Abendblau – heller,
   nicht dunkler. Keine neuen Werte, nur die Rollen der beiden Blautöne getauscht. Auf Tusche gilt die Regel oben
   (Kalkweiß, beim Zeigen Pergament). Der Kern setzt Grund und Hover aus theme.json; hier kommt der Tastaturfokus dazu. */
.wp-block-button:not(.is-style-outline) > .wp-block-button__link:focus-visible {
	background: var(--yyc-abendblau);
	border-color: var(--yyc-abendblau);
	color: var(--yyc-input);
}

/* Beim Drücken gibt der Knopf 1 px nach */
.wp-block-button__link:active,
.yyc-form button[type="submit"]:active {
	transform: translateY(1px);
}

.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--yyc-ink);
	border: 1px solid var(--yyc-ink);
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--yyc-ink);
	color: var(--yyc-bg);
}

/* ---------------------------------------------------------------
   Hinweisband der Vorschau (nur für Berechtigte, Site-Plugin)
   --------------------------------------------------------------- */
.yyc-vorschau-band {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0 var(--wp--preset--spacing--40);
	padding: 0.5rem var(--wp--style--root--padding-right, 1rem) 0.5rem var(--wp--style--root--padding-left, 1rem);
	background: var(--yyc-lavur);
	border-bottom: 1px solid var(--yyc-line);
	color: var(--yyc-muted);
	font-size: var(--wp--preset--font-size--sm);
}

.yyc-vorschau-band p {
	margin: 0;
}

.yyc-vorschau-band__zu {
	min-height: 2.75rem;
	padding: 0;
	border: 0;
	background: none;
	color: var(--yyc-ink);
	font: inherit;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
	cursor: pointer;
}

.yyc-vorschau-band[hidden] {
	display: none;
}

/* ---------------------------------------------------------------
   Header und Navigation
   --------------------------------------------------------------- */
.yyc-header {
	position: relative;
	z-index: 10;
	background: var(--yyc-bg);
	border-bottom: 1px solid var(--yyc-line);
}

.home .yyc-header {
	border-bottom-color: transparent;
}

.yyc-header__bar {
	min-height: 4.5rem;
	gap: var(--wp--preset--spacing--50);
}

.yyc-header .wp-block-site-title a {
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	min-height: 3rem;
	color: var(--yyc-ink);
	text-decoration: none;
}

.yyc-header__actions {
	gap: var(--wp--preset--spacing--50);
}

.yyc-header__actions .wp-block-button__link {
	font-size: var(--wp--preset--font-size--sm);
	min-height: 3rem;
	padding: 0.5rem 1.125rem;
	white-space: nowrap;
}

/* Startseite: Der Auftritt trägt die Hauptaktion in Nacht; der Kopf führt dieselbe Aktion als Rahmen,
   damit im ersten Bild nur ein blauer Button steht (Abendblau-Regel). Übrige Seiten: Kopf bleibt blau.
   Beim Zeigen geht auch hier die Lampe an, wie überall (Jan, 2026-10-08; vorher wurde der Rahmen Tinte). */
.home .yyc-header__actions .wp-block-button:not(.is-style-outline) > .wp-block-button__link {
	background: transparent;
	color: var(--yyc-ink);
	border: 1px solid var(--yyc-ink);
}

.home .yyc-header__actions .wp-block-button:not(.is-style-outline) > .wp-block-button__link:is(:hover, :focus-visible) {
	background: var(--yyc-abendblau);
	border-color: var(--yyc-abendblau);
	color: var(--yyc-input);
}

.yyc-header .wp-block-navigation .wp-block-navigation-item__content {
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	min-height: 3rem;
	color: var(--yyc-text);
	text-decoration: underline;
	text-decoration-color: transparent;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.4em;
}

.yyc-header .wp-block-navigation .wp-block-navigation-item__content:hover,
.yyc-header .wp-block-navigation [aria-current="page"] {
	color: var(--yyc-ink);
	text-decoration-color: var(--yyc-abendblau);
}

.yyc-header .wp-block-navigation__responsive-container-open,
.yyc-header .wp-block-navigation__responsive-container-close {
	font-family: var(--yyc-ui);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	color: var(--yyc-ink);
	min-height: 3rem;
	min-width: 3rem;
	padding: 0 1.125rem;
	align-items: center;
	line-height: 1;
	border: 1px solid var(--yyc-ink);
}

.yyc-header .wp-block-navigation__responsive-container-close {
	border: 0;
	text-decoration: underline;
	text-underline-offset: 0.3em;
}

.yyc-header .wp-block-navigation .yyc-nav-cta {
	display: none;
}

@media (max-width: 959.98px) {
	.yyc-header .wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none !important;
	}

	.yyc-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
	}
}

/* Zwischen 960 und 1199 px: Menü enger, damit Wortmarke, sechs Einträge und Button in eine Zeile passen */
@media (min-width: 960px) and (max-width: 1199.98px) {
	.yyc-header .wp-block-navigation .wp-block-navigation__container {
		gap: var(--wp--preset--spacing--40);
	}

	.yyc-header__bar,
	.yyc-header__actions {
		gap: var(--wp--preset--spacing--40);
	}

	.yyc-header .wp-block-site-title {
		letter-spacing: 0.16em;
	}
}

/* Unter 360 px passten gesperrte Wortmarke und Menü-Knopf nicht in eine Zeile: 320 px liefen 27 px (Ersatzschrift
   38 px) quer über. Sperrung und Abstand enger, die Wortmarke bleibt eine Zeile (Jan, 2026-10-08). */
@media (max-width: 359.98px) {
	.yyc-header__bar {
		gap: var(--wp--preset--spacing--30);
	}

	.yyc-header .wp-block-site-title {
		letter-spacing: 0.06em;
	}
}

@media (max-width: 599.98px) {
	.yyc-header__actions .wp-block-buttons {
		display: none;
	}

	.yyc-header .wp-block-navigation .is-menu-open .yyc-nav-cta {
		display: flex;
	}
}

.yyc-header .wp-block-navigation__responsive-container.is-menu-open {
	padding: var(--wp--preset--spacing--50) var(--yyc-pad);
	background: var(--yyc-bg) !important;
	--navigation-layout-justification-setting: flex-start;
	--navigation-layout-justify: flex-start;
}

.yyc-header .is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: var(--wp--preset--spacing--80);
}

.yyc-header .is-menu-open .wp-block-navigation__container {
	gap: 0;
	align-items: flex-start;
	width: 100%;
}

.yyc-header .is-menu-open .wp-block-navigation-item {
	width: 100%;
	border-bottom: 1px solid var(--yyc-line);
}

.yyc-header .is-menu-open .wp-block-navigation-item.yyc-nav-cta {
	border-bottom: 0;
}

.yyc-header .is-menu-open .wp-block-navigation-item__content {
	font-family: var(--yyc-headline);
	font-size: var(--wp--preset--font-size--2-xl);
	font-weight: 400;
	letter-spacing: -0.015em;
	line-height: 1.15;
	color: var(--yyc-ink);
	padding-block: 0.75rem;
	width: 100%;
}

.yyc-header .is-menu-open .yyc-nav-cta .wp-block-navigation-item__content {
	justify-content: center;
	background: var(--yyc-nacht);
	color: var(--yyc-input);
	font-family: var(--yyc-ui);
	font-size: var(--wp--preset--font-size--sm);
	letter-spacing: 0.04em;
	font-weight: 500;
	text-decoration: none;
	min-height: 3.25rem;
	margin-top: var(--wp--preset--spacing--60);
	transition: background-color var(--yyc-dur) var(--yyc-ease);
}

.yyc-header .is-menu-open .yyc-nav-cta .wp-block-navigation-item__content:is(:hover, :focus-visible) {
	background: var(--yyc-abendblau);
	color: var(--yyc-input);
}

/* Bereichsnavigation (Collective C1, 2026-10-09): zweite Zeile im Kopf, nur in einem Bereich der Site — ob sie
   erscheint, entscheidet das Site-Plugin (includes/bereich.php). Einträge wie das Hauptmenü (Small, aktuelle Seite
   unterstrichen, Abendblau beim Zeigen), rechts „Mitmachen“ als Rahmenknopf: Die Hauptaktion in Nacht trägt schon
   die erste Zeile. Kein Menü-Knopf: Die Einträge brechen um, ab 320 px ohne Querscroll. */
.yyc-header .yyc-bereich {
	border-top: 1px solid var(--yyc-line);
	min-height: 3.5rem;
	padding-block: 0.25rem;
	column-gap: var(--wp--preset--spacing--50);
	row-gap: 0;
	align-items: center;
}

.yyc-header .yyc-bereich .wp-block-navigation__container {
	column-gap: var(--wp--preset--spacing--50);
	row-gap: 0;
}

.yyc-header .yyc-bereich .wp-block-button__link {
	font-size: var(--wp--preset--font-size--sm);
	min-height: 3rem;
	padding: 0.5rem 1.125rem;
	white-space: nowrap;
}

@media (max-width: 599.98px) {
	.yyc-header .yyc-bereich,
	.yyc-header .yyc-bereich .wp-block-navigation__container {
		column-gap: var(--wp--preset--spacing--40);
	}

	.yyc-header .yyc-bereich {
		padding-block-end: var(--wp--preset--spacing--30);
	}
}

/* ---------------------------------------------------------------
   Breadcrumbs (Rank Math, über den Block des Site-Plugins)
   --------------------------------------------------------------- */
.yyc-breadcrumbs,
.rank-math-breadcrumb {
	color: var(--yyc-muted);
	font-family: var(--yyc-ui);
	font-size: var(--wp--preset--font-size--sm);
}

.yyc-breadcrumbs {
	margin-block: var(--wp--preset--spacing--50) 0;
}

.rank-math-breadcrumb p {
	margin: 0;
	max-width: none;
}

.rank-math-breadcrumb a {
	color: var(--yyc-muted);
	display: inline-block;
	padding-block: 0.75rem;
}

.rank-math-breadcrumb .separator {
	margin-inline: 0.375rem;
}

/* ---------------------------------------------------------------
   Marken (Klassen yyc-siegel) — das Kürzel an der Ausstellungswand: ein scharfes Quadrat in Nacht mit
   Label-Schrift; leer als Rahmen in Linie stark, der freie Platz. Immer aria-hidden.
   --------------------------------------------------------------- */
.yyc-siegel {
	--yyc-siegel: 3.25rem;
	display: inline-grid;
	place-content: center;
	flex: none;
	box-sizing: border-box;
	width: var(--yyc-siegel);
	aspect-ratio: 1;
	background: var(--yyc-nacht); /* beim Zeigen Abendblau (.yyc-siegel-link), Jan, 2026-10-08 */
	color: var(--yyc-input);
	font-family: var(--yyc-ui);
	font-weight: 500;
	font-size: max(0.6875rem, calc(var(--yyc-siegel) * 0.22));
	letter-spacing: 0.1em;
	line-height: 1.15;
	text-align: center;
	text-indent: 0;
	font-variant-numeric: lining-nums tabular-nums;
	user-select: none;
}

.yyc-siegel > span {
	display: block;
	padding-inline-start: 0.1em; /* Sperrung rechts ausgleichen, damit die Schrift mittig steht */
}

.yyc-siegel--leer {
	background: transparent;
	border: 1px solid var(--yyc-line-lit);
	color: var(--yyc-muted); /* die Nummer eines freien Platzes im Line-up */
}

/* Namensmarke: das Namensschild der Konferenz – Kürzel, daneben das Angebot. Eine Regel für Profil und Line-up
   (Jan, 2026-10-08). */
.yyc-siegel--name {
	--yyc-siegel: 4rem;
}

.yyc-lineup .yyc-siegel--name {
	--yyc-siegel: 2.5rem;
}

@media (prefers-reduced-motion: no-preference) {
	@supports (animation-timeline: view()) {
		/* Die Marke wird gesetzt, wenn sie ins Bild kommt */
		.yyc-siegel {
			animation: yyc-setzen linear forwards;
			animation-timeline: view();
			animation-range: entry 20% entry 80%;
		}

		/* Im Line-up steht die Namensmarke still: In der Karte bewegt sich sonst nichts, zehn kleine Marken, die einzeln
		   nachblenden, flackerten beim Scrollen. Gesetzt werden weiter die freien Plätze (Jan, 2026-10-08). */
		.yyc-lineup__zeichen > .yyc-siegel {
			animation: none;
		}
	}
}

@keyframes yyc-setzen {
	from { opacity: 0; transform: scale(0.92); }
	to { opacity: 1; transform: scale(1); }
}

/* ---------------------------------------------------------------
   Abschnitte — Katalogeinträge: Haarlinie, Nummer · Stichwort, Aussage, Lesespalte
   --------------------------------------------------------------- */
.yyc-main {
	margin-block-start: 0;
	padding-bottom: var(--yyc-gap);
}

.yyc-main:has(.wp-block-post-content > .yyc-cta:last-child),
.yyc-main:has(> .yyc-cta:last-child) {
	padding-bottom: 0;
}

.wp-block-post-content > .yyc-section,
.yyc-main > .yyc-section {
	margin-block-start: var(--yyc-gap);
}

.wp-block-post-content > .yyc-section--split,
.wp-block-post-content > .yyc-section:where([class*="is-style-flaeche-"]) {
	margin-block-start: 0;
	padding-block: calc(var(--yyc-gap) * 0.62);
}

/* Folgt ein Eintrag auf einen Abschnitt ohne eigenen Innenabstand (Line-up, Galerie), rückt er ab, damit die
   Linie nicht am letzten Satz klebt */
.wp-block-post-content > .yyc-section:not(.yyc-section--split, [class*="is-style-flaeche-"]) + .yyc-section--split {
	margin-block-start: calc(var(--yyc-gap) * 0.62);
}

/* Jeder Eintrag auf dem Grund beginnt an einer Haarlinie; die Nummer hängt direkt darunter.
   Einträge auf der Fläche setzen sich durch ihren Ton ab und brauchen keine Linie. Die Linie ist ein eigenes
   Element, weil der Grund über die volle Breite (border-image) einen Rahmen überdecken würde. */
.wp-block-post-content > .yyc-section--split:not([class*="is-style-flaeche-pergament"], [class*="is-style-flaeche-dunkel"], .yyc-hero) {
	padding-block-start: calc(var(--yyc-zeile) * 1.25);
}

.wp-block-post-content > .yyc-section--split:not([class*="is-style-flaeche-pergament"], [class*="is-style-flaeche-dunkel"], .yyc-hero)::before {
	content: "";
	position: absolute;
	inset-inline: 0;
	top: 0;
	height: 1px;
	background: var(--yyc-line-lit); /* Abschnittsbeginn: Linie stark (2,6 : 1), Linien in Listen bleiben hell */
	transform-origin: 0 50%;
}

.yyc-section {
	position: relative;
}

.yyc-section > h2,
.yyc-section--split > h2 {
	margin-block: 0 var(--yyc-zeile);
}

.yyc-section h2 {
	font-size: var(--wp--preset--font-size--3-xl);
	font-weight: 500;
	line-height: 1.04;
	letter-spacing: -0.02em;
	max-width: 18ch;
}

.yyc-section__head {
	margin-block: 0 calc(var(--yyc-zeile) * 1.5);
}

.yyc-section__head > * {
	margin-block: 0;
}

/* Nummer · Stichwort: die Katalognummer des Eintrags (Jan, 2026-10-04: sichtbar); seit 2026-10-08 auch über dem
   Namen im Profil („01 · Lehrende“) */
.yyc-section__head > .is-kicker,
.yyc-profil__kopf > .is-kicker {
	display: flex;
	gap: 0.5em;
	margin-block-end: calc(var(--yyc-zeile) * 1.6);
	color: var(--yyc-muted);
	font-family: var(--yyc-ui);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 1.3;
	text-transform: uppercase;
	font-variant-numeric: tabular-nums lining-nums;
	max-width: none;
}

.is-kicker__num {
	color: var(--yyc-ink);
}

.yyc-section__body > :first-child {
	margin-block-start: 0;
}

.yyc-section__body > p + p {
	margin-block-start: calc(var(--yyc-zeile) * 0.6);
}

/* Der Weg weiter: Hanken 500, unterstrichen mit Linie stark, die beim Zeigen abendblau wird */
.yyc-weiter {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	min-height: 3rem;
	font-family: var(--yyc-ui);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	letter-spacing: 0.01em;
	color: var(--yyc-ink);
	text-decoration-line: underline;
	text-decoration-color: var(--yyc-line-lit);
	text-underline-offset: 0.3em;
}

.yyc-weiter::after {
	content: "";
	flex: none;
	width: 1.5rem;
	height: 0.875rem;
	background: currentColor;
	-webkit-mask: url("assets/images/pfeil.svg") center / contain no-repeat;
	mask: url("assets/images/pfeil.svg") center / contain no-repeat;
	transition: transform var(--yyc-dur) var(--yyc-ease);
}

.yyc-weiter:hover::after {
	transform: translateX(0.2em);
}

/* Weg weiter im Text (satz.php setzt span.yyc-weiter__ende): Der Link fließt wie Text, der Pfeil hängt am
   letzten Wort und bricht mit ihm um. Die Zeigefläche bleibt 48 px hoch (padding-block, ohne Zeilenhöhe). */
.yyc-weiter:has(> .yyc-weiter__ende) {
	display: inline;
	padding-block: 0.55em;
}

.yyc-weiter:has(> .yyc-weiter__ende)::after {
	content: none;
}

.yyc-weiter__ende {
	white-space: nowrap;
}

.yyc-weiter__ende::after {
	content: "";
	display: inline-block;
	width: 1.5rem;
	height: 0.875rem;
	margin-inline-start: 0.5em;
	vertical-align: -0.05em;
	background: currentColor;
	-webkit-mask: url("assets/images/pfeil.svg") center / contain no-repeat;
	mask: url("assets/images/pfeil.svg") center / contain no-repeat;
	transition: transform var(--yyc-dur) var(--yyc-ease);
}

.yyc-weiter:hover .yyc-weiter__ende::after,
.yyc-cards__item--ganz:has(.yyc-cards__weg > a:hover) .yyc-weiter__ende::after {
	transform: translateX(0.2em);
}

@media (min-width: 960px) {
	/* Zwölf Spalten: Nummer · Stichwort in 1–3, die Aussage ab Spalte 4, der Text darunter in der Lesespalte;
	   Spalte 12 bleibt leer oder trägt Marken. */
	.yyc-section--split:not(.yyc-hero) {
		display: grid;
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: var(--wp--preset--spacing--50);
		align-items: start;
	}

	.yyc-section--split:not(.yyc-hero) > * {
		margin-block: 0;
		grid-column: 4 / 12;
	}

	.yyc-section--split:not(.yyc-hero) > .yyc-section__head {
		grid-column: 1 / -1;
		grid-row: 1;
		display: grid;
		grid-template-columns: subgrid;
		align-items: baseline; /* Register: Nummer und erste Zeile der Aussage auf einer Grundlinie */
		margin-block-end: calc(var(--yyc-zeile) * 2);
	}

	.yyc-section__head > .is-kicker {
		grid-column: 1 / 4;
		margin-block-end: 0;
	}

	.yyc-section__head > h2 {
		grid-column: 4 / 12;
	}

	/* Direkt gesetzte Überschrift (übrige Seiten, Schluss): gleiche Stelle wie die Aussage */
	.yyc-section--split:not(.yyc-hero) > :is(h1, h2) {
		grid-row: 1;
		margin-block-end: calc(var(--yyc-zeile) * 2);
	}

	.yyc-section--split:not(.yyc-hero) > .yyc-section__body {
		grid-row: 2;
	}

	.yyc-section--split:where(.yyc-cards, .yyc-steps):not(.yyc-hero) > .yyc-section__body {
		grid-column: 1 / -1;
	}

	/* Abschluss unter einer Liste (Import: Absätze nach der letzten Tür): Lesespalte ab Spalte 4, unter den Einträgen. */
	.yyc-section--split:not(.yyc-hero) > .yyc-section__body.yyc-section__nachsatz {
		grid-row: 3;
		grid-column: 4 / 12;
		margin-block-start: calc(var(--yyc-zeile) * 2);
	}
}

.yyc-section__nachsatz {
	margin-block-start: calc(var(--yyc-zeile) * 2);
}

.yyc-section__nachsatz > p {
	max-width: var(--yyc-measure);
}

/* ---------------------------------------------------------------
   Auftritt — der Name groß und leicht, darunter das eine Foto über die volle Breite mit Bildunterschrift
   --------------------------------------------------------------- */
.wp-block-post-content > .yyc-hero {
	margin-block-start: 0;
	padding-block: 0;
	display: grid;
	grid-template-areas: "text" "bild";
	grid-template-columns: minmax(0, 1fr);
}

.yyc-hero > * {
	margin-block: 0;
}

.yyc-hero__text {
	grid-area: text;
	position: relative;
	z-index: 1;
	display: grid;
	gap: var(--wp--preset--spacing--50);
	padding-block: clamp(2.5rem, 1.5rem + 5vw, 6rem) var(--wp--preset--spacing--60);
}

.yyc-hero__text > * {
	margin-block: 0;
}

.yyc-hero__text > h1 {
	max-width: none;
	font-weight: 500;
	line-height: 1;
}

.yyc-title__main {
	display: block;
	font-size: var(--wp--preset--font-size--display);
	line-height: 0.98;
	letter-spacing: -0.02em;
}

.yyc-title__claim {
	display: block;
	margin-top: 0.45em;
	font-family: var(--yyc-sans);
	font-size: var(--wp--preset--font-size--claim);
	font-style: italic;
	font-weight: 300;
	line-height: 1.15;
	letter-spacing: -0.005em;
	color: var(--yyc-muted);
}

/* Die Stimme nach oben (Jan, 2026-10-08): Auf der Startseite steht das Keyword „Yin Yoga online.“ als Katalogzeile
   über dem Titel, der Satz „Viele Stimmen, eine Praxis.“ in Display-Größe. Der H1-Text bleibt wortgleich (SEO), nur die
   Gewichtung kippt zurück. Die einzige Stelle der Site mit der Serif auf Display-Größe – keine zweite.
   Randausgleich: satz.php misst Hanken; für Newsreader Claim 300 kursiv gemessen (fontTools, 2026-10-08): V links
   0,122 em + 0,03 em Diagonalüberhang = 0,152 em (erste Zeile), e 0,026 em + 0,015 em Rundung = 0,04 em (Folgezeilen).
   Beide Werte in em, also größenunabhängig; der Hanken-Wert 0,044 ließ das V bei 104 px rund 11 px zu weit rechts stehen. */
.home .yyc-hero h1 > .yyc-title__main {
	font-family: var(--yyc-ui);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 1.3;
	text-transform: uppercase;
	color: var(--yyc-muted);
	font-variant-numeric: tabular-nums lining-nums;
}

.home .yyc-hero h1 > .yyc-title__claim {
	margin-top: 0.35em;
	margin-inline-start: calc(-0.04em + var(--yyc-lesekante));
	text-indent: calc((0.152 - 0.04) * -1em);
	/* Höchstens so groß, dass „Viele Stimmen,“ auch in der Ersatzschrift in eine Zeile passt: Georgia kursiv läuft
	   6,04 em, Newsreader kursiv 5,50 em (size-adjust gilt der Grundschrift). Greift erst unter rund 380 px; so springt
	   der Umbruch beim Schriftwechsel nicht. */
	font-size: min(var(--wp--preset--font-size--display), calc((100vw - 2rem) / 6.2));
	/* Der Claim bricht immer am Sinnschritt: „Viele Stimmen,“ / „eine Praxis.“ – auf jeder Breite und in beiden Schriften
	   gleich (einzeilig wären es 10,0 em in Newsreader, 10,8 em in der Ersatzschrift; dazwischen spränge der Umbruch). */
	max-width: 7.5em;
	line-height: 1;
	letter-spacing: -0.01em;
	color: var(--yyc-ink);
}

.yyc-hero__text > p {
	max-width: 34ch;
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.45;
	color: var(--yyc-text);
}

/* Datum: die Marke steht vor der Zeile, Datum und Nachsatz rechts daneben */
.yyc-hero__text > p:has(> strong) {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	column-gap: var(--wp--preset--spacing--50);
	align-items: center;
	max-width: none;
	margin-block-start: var(--wp--preset--spacing--30);
	padding-block-start: var(--wp--preset--spacing--50);
	border-top: 1px solid var(--yyc-line);
	font-family: var(--yyc-ui);
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-muted);
}

.yyc-hero__text > p:has(> strong) > .yyc-siegel {
	grid-row: 1 / span 2;
}

.yyc-hero__text > p:has(> strong) > :not(.yyc-siegel) {
	grid-column: 2;
}

.yyc-hero__text > p > strong {
	display: block;
	hyphens: manual;
	overflow-wrap: normal; /* nie mitten in „2027“ umbrechen; die Zeile bricht nur an Leerräumen */
	margin-block-end: 0.2rem;
	font-family: var(--yyc-headline);
	font-weight: 400;
	font-size: var(--wp--preset--font-size--2-xl);
	letter-spacing: -0.015em;
	line-height: 1.12;
	color: var(--yyc-ink);
	font-variant-numeric: lining-nums;
	margin-inline-start: -0.085em; /* Vorbreite des E in Hanken Grotesk 400; die Zeile steht neben der Marke, nicht über Lesetext */
}

.yyc-datum__nachsatz {
	display: block;
	margin-inline-start: -0.085em; /* Vorbreite des B in Hanken Grotesk 400, wie beim E darüber */
}

/* Unter 360 px ist „25. Oktober 2027.“ (gebunden, satz.php) neben der Marke breiter als die Spalte und lief quer
   über; eine Stufe kleiner passt die Zeile (Jan, 2026-10-08). */
@media (max-width: 359.98px) {
	.yyc-hero__text > p > strong {
		font-size: var(--wp--preset--font-size--xl);
	}
}

/* Start-Phase: „Nächste Stunde“ (yyc-booking) steht an der Stelle der Datumszeile, gleich gesetzt.
   Unter 600 px bricht die Zeile sauber: kein Mittelpunkt am Zeilenende, die Zeit darunter. */
@media (max-width: 599px) {
	.yyc-naechste-stunde__trenner { display: none; }
	.yyc-naechste-stunde__zeit { display: block; }
}

.yyc-siegel--datum {
	--yyc-siegel: 4rem;
	font-size: 0.75rem;
	letter-spacing: 0.06em;
}

.yyc-hero__text > .wp-block-buttons {
	margin-block-start: var(--wp--preset--spacing--30);
}

/* Bild im Auftritt (übrige Seiten): ruhiges Bildfeld in Graustufen */
.yyc-hero .wp-block-image,
.yyc-hero .yyc-placeholder {
	grid-area: bild;
	margin: var(--wp--preset--spacing--70) 0 0;
}

.yyc-hero .wp-block-image img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

/* Übrige Seiten: die Tafel unbeschnitten in 16 : 9, in der Breite einer großen Spalte, mit Bildunterschrift */
body:not(.home) .yyc-hero .wp-block-image {
	max-width: 56rem;
	margin-block-end: var(--wp--preset--spacing--80); /* Bildunterschrift nicht an der Haarlinie des nächsten Eintrags */
}

@media (min-width: 600px) {
	.yyc-hero > .yyc-placeholder { aspect-ratio: 3 / 1; }
}

/* Startseite: img-01 als Katalogtafel in Naturfarben. Handy 4 : 3 auf die Mitte der Bolsterreihe, ab 600 px die ganze
   Tafel (21 : 9, 1376 × 590), ohne Rahmen, darunter die Bildunterschrift aus start.md. */
.home .yyc-hero .wp-block-image {
	margin-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--90);
}

.home .yyc-hero .wp-block-image img {
	aspect-ratio: 4 / 3;
	object-position: 50% 50%;
}

.home .yyc-hero .wp-block-image figcaption,
.wp-element-caption {
	margin: 0.75rem 0 0;
	color: var(--yyc-muted);
	font-family: var(--yyc-ui);
	font-size: var(--wp--preset--font-size--sm);
	line-height: 1.45;
	max-width: var(--yyc-measure);
}

@media (min-width: 600px) {
	.home .yyc-hero .wp-block-image img {
		aspect-ratio: 1376 / 590;
	}
}

@media (min-width: 960px) {
	/* Titelblatt im Zwölferraster: der Name über die ganze Breite, darunter links die Einleitung (1–6),
	   rechts Datum und Knopf (7–11) auf derselben Oberkante */
	.home .yyc-hero__text {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: var(--wp--preset--spacing--50);
		row-gap: 0;
		align-items: start;
		padding-block: clamp(3rem, 9vh, 7rem) var(--wp--preset--spacing--60);
	}

	.home .yyc-hero__text > h1 {
		grid-column: 1 / -1;
		margin-block-end: var(--wp--preset--spacing--70);
	}

	.home .yyc-hero__text > p:not(:has(> strong)) {
		grid-column: 1 / 6;
		grid-row: 2 / span 2;
		max-width: 34ch;
	}

	.home .yyc-hero__text > p:has(> strong) {
		grid-column: 7 / -1;
		grid-row: 2;
		margin-block-start: 0.5rem; /* Oberkante der Linie auf der Versalhöhe der Einleitung */
	}

	.home .yyc-hero__text > .wp-block-buttons {
		grid-column: 7 / -1;
		grid-row: 3;
		margin-block-start: var(--wp--preset--spacing--60);
		padding-inline-start: calc(4rem + var(--wp--preset--spacing--50)); /* unter dem Datum, nicht unter der Marke */
	}

	/* Bildunterschrift ab Spalte 4, auf der Kante der Lesespalten darunter */
	.home .yyc-hero .wp-block-image figcaption {
		margin-inline-start: calc(3 / 12 * (100% + var(--wp--preset--spacing--50)));
	}
}

/* Übrige Seiten: der Einstieg ist ein ruhiges Bildfeld, kein ganzer Bildschirm; die H1 eine Stufe kleiner */
body:not(.home) :is(.yyc-hero, .yyc-section) h1 {
	font-size: clamp(2.75rem, 2rem + 3vw, 4.75rem);
	font-weight: 500;
	line-height: 1.04;
	max-width: 18ch;
}

/* Lange Titel (über 32 Zeichen, satz.php) eine Stufe kleiner */
body:not(.home) :is(.yyc-hero, .yyc-section) h1.is-lang {
	font-size: clamp(2.25rem, 1.8rem + 2vw, 3.5rem);
	line-height: 1.08;
	max-width: 22ch;
}

/* Unter 360 px eine Stufe kleiner, wie Wortmarke und Datum der Startseite: Kurze Titel bindet satz.php ganz
   („Auf die Warteliste“ ohne Bruchstelle), bei 2,75 rem lief die Warteliste 32 px quer (Jan, 2026-10-08, Nachtrag 1). */
@media (max-width: 359.98px) {
	body:not(.home) :is(.yyc-hero, .yyc-section) h1 {
		font-size: 2.25rem;
	}
}

/* Zweiteilige H1 auf Unterseiten (Collective, 2026-10-09: „Kollegiale Beratung für Yogalehrer. Ein Fall, eine Stunde.“):
   Der Titelteil folgt der Größe der H1, damit die Stufe unter 360 px auch hier greift – sonst stand „für Yogalehrer.“
   (gebunden) in Display-Größe und lief bei 320 px 35 px quer. Der Claim behält seine Größe. */
body:not(.home) h1 > .yyc-title__main {
	font-size: inherit;
}

body:not(.home) .yyc-hero__text {
	padding-block: clamp(2rem, 1rem + 4vw, 4.5rem) var(--wp--preset--spacing--50);
}

body:not(.home) .yyc-hero__text > p {
	max-width: var(--yyc-measure);
}

body:not(.home) .yyc-hero .wp-block-image img {
	object-position: 50% 55%;
}

@media (min-width: 960px) {
	body:not(.home) .yyc-hero__text {
		max-width: 52rem;
	}
}

/* Seitenwechsel: der Kopf bleibt stehen, der Inhalt wechselt wie ein neues Blatt */
@media (prefers-reduced-motion: no-preference) {
	@view-transition {
		navigation: auto;
	}

	.yyc-header {
		view-transition-name: kopf;
	}

	::view-transition-old(root) {
		animation: yyc-blatt-aus 200ms var(--yyc-ease) both;
	}

	::view-transition-new(root) {
		animation: yyc-blatt-ein 360ms var(--yyc-ease) both;
	}
}

@keyframes yyc-blatt-aus {
	to { opacity: 0; }
}

@keyframes yyc-blatt-ein {
	from { opacity: 0; }
}

/* Der Katalog blättert: Marke, Porträtrahmen und Name gleiten zwischen Übersicht und Profil (Namen setzt
   functions.php nur am angeklickten Ziel). Das Blatt wechselt darunter wie gehabt. */
@media (prefers-reduced-motion: no-preference) {
	::view-transition-group(yyc-marke),
	::view-transition-group(yyc-bild),
	::view-transition-group(yyc-name) {
		animation-duration: 520ms;
		animation-timing-function: cubic-bezier(0.2, 0.7, 0.2, 1);
	}

	/* Name und Marke ändern ihre Größe: nicht überblenden, sondern das neue Bild mit dem Rahmen aus der alten Lage
	   heraus skalieren (gleiches Seitenverhältnis), damit Schrift und Kanten nicht doppelt stehen */
	::view-transition-old(yyc-name),
	::view-transition-old(yyc-marke) {
		animation: yyc-blatt-aus 160ms cubic-bezier(0.2, 0.7, 0.2, 1) both;
	}

	::view-transition-new(yyc-name),
	::view-transition-new(yyc-marke) {
		animation: none;
	}

}

/* Die Marken der Lehrenden sind Wege zu den Profilen */
.yyc-siegel-link {
	display: inline-flex;
	border-radius: 0;
	text-decoration: none;
}

.yyc-siegel-link > .yyc-siegel {
	transition: background-color var(--yyc-dur) var(--yyc-ease);
}

.yyc-siegel-link:hover > .yyc-siegel,
.yyc-siegel-link:focus-visible > .yyc-siegel {
	background: var(--yyc-abendblau);
}

/* ---------------------------------------------------------------
   Bewegung im Katalog (DESIGN.md, Motion): nur transform und opacity, Kurve cubic-bezier(.2, .7, .2, 1).
   Der Ausgangszustand jeder Animation ist der Endzustand: Die Einträge laufen ohne „backwards“, vor ihrem
   Bereich steht also der fertige Text (auch im Ganzseitenbild, im Druck, ohne Scroll-Timeline).
   --------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
	/* Der Katalog öffnet sich: Name, Claim, Lead, Datum und Knopf je 70 ms versetzt, das Foto in 900 ms */
	.home .yyc-hero__text > * {
		animation: yyc-auftritt 600ms cubic-bezier(0.2, 0.7, 0.2, 1) both;
	}

	.home .yyc-hero__text > :nth-child(2) { animation-delay: 140ms; }
	.home .yyc-hero__text > :nth-child(3) { animation-delay: 210ms; }
	.home .yyc-hero__text > :nth-child(n+4) { animation-delay: 280ms; }

	.home .yyc-title__claim {
		animation: yyc-auftritt 600ms cubic-bezier(0.2, 0.7, 0.2, 1) 70ms both;
	}

	.home .yyc-hero .wp-block-image img {
		animation: yyc-abbildung 900ms cubic-bezier(0.2, 0.7, 0.2, 1) 200ms both;
	}

	/* Die Abbildung wird eingelegt: ein Deckblatt im Ton des Grunds gleitet von oben nach unten weg (nur transform) */
	.home .yyc-hero .wp-block-image {
		position: relative;
		overflow: clip; /* das leicht vergrößerte Foto ragt beim Einlegen nicht über den Rahmen */
	}

	.home .yyc-hero .wp-block-image::before {
		content: "";
		position: absolute;
		inset: 0 0 auto;
		z-index: 1;
		aspect-ratio: 4 / 3;
		background: var(--yyc-bg);
		transform-origin: 50% 100%;
		pointer-events: none;
		animation: yyc-deckblatt 900ms cubic-bezier(0.2, 0.7, 0.2, 1) 200ms both;
	}

	/* Die Haarlinie über dem Datum zieht sich wie eine Linie im Katalog, bevor das Datum erscheint */
	.home .yyc-hero__text > p:has(> strong) {
		border-top-color: transparent;
		position: relative;
	}

	.home .yyc-hero__text > p:has(> strong)::before {
		content: "";
		position: absolute;
		inset: 0 0 auto;
		height: 1px;
		background: var(--yyc-line);
		transform-origin: 0 50%;
		animation: yyc-linie 600ms cubic-bezier(0.2, 0.7, 0.2, 1) 180ms both;
	}

	@supports (animation-timeline: view()) {
		/* Einträge legen sich an: erst die Haarlinie von links, dann Nummer, Aussage, Text */
		.wp-block-post-content > .yyc-section--split:not([class*="is-style-flaeche-pergament"], [class*="is-style-flaeche-dunkel"], .yyc-hero)::before {
			animation: yyc-linie linear forwards;
			animation-timeline: view();
			animation-range: entry 0% entry 35%;
		}

		/* Nur der Kopf des Eintrags legt sich an; der Text steht schon da, wenn man ihn liest */
		.yyc-section__head > .is-kicker,
		.yyc-section__head > h2,
		.yyc-section--split > h2,
		.yyc-cards__item,
		.yyc-steps__item {
			animation: yyc-anlegen linear forwards;
			animation-timeline: view();
			animation-range: entry 0% entry 45%;
		}

		.yyc-section__head > h2 { animation-range: entry 5% entry 50%; }
		.yyc-steps__item:nth-child(even) { animation-range: entry 5% entry 50%; }
	}
}

@keyframes yyc-auftritt {
	from { opacity: 0; transform: translateY(12px); }
	to { opacity: 1; transform: none; }
}

@media (min-width: 600px) {
	.home .yyc-hero .wp-block-image::before { aspect-ratio: 1376 / 590; }
}

@keyframes yyc-deckblatt {
	from { transform: scaleY(1); }
	to { transform: scaleY(0); }
}

@keyframes yyc-abbildung {
	from { opacity: 0; transform: scale(1.02); }
	to { opacity: 1; transform: none; }
}

@keyframes yyc-anlegen {
	from { opacity: 0; transform: translateY(12px); }
	to { opacity: 1; transform: none; }
}

@keyframes yyc-linie {
	from { transform: scaleX(0); }
	to { transform: scaleX(1); }
}

/* Porträts der Lehrenden blenden auf (Profilseite) */
@keyframes yyc-einziehen {
	from { opacity: 0; }
	to { opacity: 1; }
}

/* Bilder im Inhalt: Tafeln in Naturfarben (Jan, 2026-10-04) — kein Graustufenfilter, kein Druckeffekt mehr.
   Porträts der Lehrenden behalten ihre eigene Regel. */
.wp-block-post-content .wp-block-image img,
.wp-block-post-featured-image img {
	display: block;
	width: 100%;
	height: auto;
}

/* Beiträge: Das Beitragsbild steht auch im Text (Bildplan); dann zeigt der Kopf es nicht doppelt */
.yyc-article:has(.wp-block-post-content .wp-block-image) .wp-block-post-featured-image {
	display: none;
}

/* Leere Tafel: an der Stelle eines Bilds der Vorwelt, bis die Tafel aus 04-bilder.md da ist (functions.php).
   Gleiche Fläche wie das Bild, Ton der Fläche, keine Schrift. Das Seitenverhältnis folgt dem Ort. */
.yyc-tafel-leer {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	background: var(--yyc-lavur);
}

.yyc-hero .yyc-tafel-leer { aspect-ratio: 16 / 9; }
.home .yyc-hero .yyc-tafel-leer { aspect-ratio: 4 / 3; }

@media (min-width: 600px) {
	.home .yyc-hero .yyc-tafel-leer { aspect-ratio: 1376 / 590; }
}

/* Platzhalter für ein Bild, das noch fehlt: gleiche Fläche, kein Layoutsprung */
.yyc-placeholder {
	display: flex;
	align-items: flex-end;
	aspect-ratio: 3 / 2;
	background: var(--yyc-lavur);
	border: 1px solid var(--fl-line);
	padding: var(--wp--preset--spacing--40);
	color: var(--fl-soft);
	font-size: var(--wp--preset--font-size--sm);
}

.yyc-placeholder > p {
	margin: 0;
}

.yyc-placeholder--portrait { aspect-ratio: 4 / 5; }

/* ---------------------------------------------------------------
   Die Lehrenden — eine Reihe Marken: gesetzte für die Lehrenden, eine leere für den freien Platz
   --------------------------------------------------------------- */
.yyc-siegelreihe {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--40);
	margin-block-start: calc(var(--yyc-zeile) * 1.5);
}

@media (min-width: 960px) {
	/* Die Marken stehen in Spalte 12, oben bündig mit dem Text */
	.yyc-section--split:not(.yyc-hero) > .yyc-siegelreihe {
		grid-column: 12;
		grid-row: 2;
		flex-direction: column;
		align-items: flex-end;
		margin-block-start: 0.35rem;
	}
}

/* Jans Marke unter seinem Text, ab 960 px in Spalte 12 wie die Reihe der Lehrenden */
.yyc-siegel--zeichen {
	margin-block-start: calc(var(--yyc-zeile) * 1.25);
}

@media (min-width: 960px) {
	.yyc-section--split:not(.yyc-hero) > .yyc-section__body:has(> .yyc-siegel--zeichen) {
		position: relative;
	}

	.yyc-section__body > .yyc-siegel--zeichen {
		position: absolute;
		top: 0.35rem;
		/* rechte Kante von Spalte 12: der Text steht in 4–11 (acht Spalten), eine Spalte und ein Abstand weiter */
		right: calc(-1 * (var(--wp--preset--spacing--50) + (100% - 7 * var(--wp--preset--spacing--50)) / 8));
		margin: 0;
	}
}


/* ---------------------------------------------------------------
   Drei Türen — Zeilen an Haarlinien
   --------------------------------------------------------------- */
.yyc-cards__list,
.yyc-steps__list {
	gap: 0;
}

.yyc-cards__item {
	position: relative;
	border-top: 1px solid var(--fl-line);
	padding-block: calc(var(--yyc-zeile) * 1.25);
	margin-block: 0;
}

.yyc-cards__item:last-child {
	border-bottom: 1px solid var(--fl-line);
}

.yyc-cards__item > * {
	margin-block: 0;
}

.yyc-cards__item > h3 {
	overflow-wrap: normal;
	font-size: var(--wp--preset--font-size--2-xl);
	font-weight: 500;
	letter-spacing: -0.015em;
	line-height: 1.1;
	margin-block-end: calc(var(--yyc-zeile) * 0.5);
}

@media (min-width: 760px) {
	/* Register: Titel und Text stehen auf derselben ersten Grundlinie */
	.yyc-cards__item {
		display: grid;
		grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
		column-gap: var(--wp--preset--spacing--50);
		align-items: baseline;
	}

	.yyc-cards__item > h3 {
		grid-column: 1;
		margin-block-end: 0;
	}

	.yyc-cards__item > p {
		grid-column: 2;
	}
}

@media (min-width: 960px) {
	/* Im Zwölferraster: Titel in 4–6, Text und Weg in 7–11 (der Spaltenabstand muss gegen gap: 0 der Liste
	   wieder gesetzt werden, sonst verrutscht das Unterraster) */
	.yyc-cards__list {
		display: grid;
		grid-template-columns: subgrid;
		column-gap: var(--wp--preset--spacing--50);
	}

	.yyc-cards__item {
		grid-column: 4 / 12;
		grid-template-columns: subgrid;
		column-gap: var(--wp--preset--spacing--50);
	}

	.yyc-cards__item > h3 { grid-column: 1 / 4; }
	.yyc-cards__item > p { grid-column: 4 / -1; }
}

/* Bis 1280 px ist eine Spalte zu schmal für „Präventionskurs“ in Title-Größe: Titel über vier Spalten, ungetrennt */
@media (min-width: 960px) and (max-width: 1279.98px) {
	.yyc-cards__item > h3 { grid-column: 1 / 5; }
	.yyc-cards__item > p { grid-column: 5 / -1; }
}

/* Der Weg aus der Tür: eigene Zeile mit Pfeil, nie getrennt */
.yyc-cards__weg {
	margin-block-start: calc(var(--yyc-zeile) * 0.25) !important;
}

.yyc-cards__weg > .yyc-weiter {
	hyphens: manual;
}

/* Die ganze Tür ist Zeigefläche; beim Zeigen wird der Titel rot, der Pfeil rückt vor */
.yyc-cards__item--ganz .yyc-cards__weg > a::before {
	content: "";
	position: absolute;
	inset: 0;
}

.yyc-cards__item--ganz > h3 {
	transition: color var(--yyc-dur) var(--yyc-ease);
}

.yyc-cards__item--ganz:has(.yyc-cards__weg > a:hover) > h3,
.yyc-cards__item--ganz:has(.yyc-cards__weg > a:focus-visible) > h3 {
	color: var(--yyc-abendblau);
}

.yyc-cards__item--ganz:has(.yyc-cards__weg > a:hover) .yyc-weiter::after {
	transform: translateX(0.2em);
}

/* ---------------------------------------------------------------
   Vier Schritte — große Ziffern in Stein, eine Haarlinie darüber
   --------------------------------------------------------------- */
.yyc-steps__list {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	counter-reset: yyc-step;
	row-gap: calc(var(--yyc-zeile) * 1.5);
}

.yyc-steps__item {
	position: relative;
	display: grid;
	grid-row: span 2;
	grid-template-rows: subgrid; /* Titel und Text teilen die Zeilen mit den Nachbarn: gemeinsame Linie */
	row-gap: calc(var(--yyc-zeile) * 0.4);
	align-content: start;
	counter-increment: yyc-step;
	border-top: 1px solid var(--fl-line);
	padding-block-start: calc(var(--yyc-zeile) * 0.75);
	margin-block: 0;
}

.yyc-steps__item > * {
	margin-block: 0;
}

.yyc-steps__item > h3 {
	align-self: start; /* Ziffern und Titel oben bündig; der Text darunter beginnt in jeder Spalte auf derselben Höhe */
	font-size: var(--wp--preset--font-size--xl);
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.2;
}

.yyc-steps__weg {
	color: inherit;
	text-decoration-line: underline;
	text-decoration-thickness: 1px;
	text-decoration-color: var(--fl-line-lit, var(--yyc-line-lit));
	text-underline-offset: 0.18em;
	transition: color var(--yyc-dur) var(--yyc-ease), text-decoration-color var(--yyc-dur) var(--yyc-ease);
}

.yyc-steps__weg:hover {
	color: var(--yyc-abendblau);
	text-decoration-color: currentColor;
}

/* Die Nummer liest der Screenreader aus dem Text; sichtbar steht sie groß und leicht in Stein */
.yyc-steps__num {
	display: block;
	font-size: 0;
	margin-block-end: 0.35rem;
}

.yyc-steps__num::before {
	content: counter(yyc-step);
	font-family: var(--yyc-headline);
	font-size: var(--wp--preset--font-size--3-xl);
	font-weight: 500;
	line-height: 1;
	color: var(--yyc-ink);
	font-variant-numeric: tabular-nums lining-nums;
	letter-spacing: -0.03em;
}

@media (min-width: 760px) {
	.yyc-steps__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: var(--wp--preset--spacing--70);
	}
}

@media (min-width: 960px) {
	/* Schritte unter der Aussage, Spalten 4–11 */
	.yyc-section--split.yyc-steps > .yyc-section__body.yyc-steps__list {
		grid-column: 4 / 12;
		column-gap: var(--wp--preset--spacing--70);
	}
}

/* Im Katalog bleiben es zwei Spalten: vier schmale Spalten brechen „Ab dem 25. Oktober 2027“ nicht sauber */

/* ---------------------------------------------------------------
   FAQ
   --------------------------------------------------------------- */
.yyc-faq__list {
	gap: 0;
	border-bottom: 1px solid var(--fl-line);
}

.yyc-faq .wp-block-details {
	border-top: 1px solid var(--fl-line);
	margin-block: 0;
}

.yyc-faq .wp-block-details summary {
	position: relative;
	display: block;
	align-content: center;
	padding-inline-end: calc(1.125rem + var(--wp--preset--spacing--50));
	min-height: 3rem;
	padding-block: var(--wp--preset--spacing--40);
	font-size: var(--wp--preset--font-size--lg);
	font-weight: 700;
	line-height: 1.3;
	cursor: pointer;
	list-style: none;
	transition: color var(--yyc-dur) var(--yyc-ease);
}

.yyc-faq .wp-block-details summary::-webkit-details-marker {
	display: none;
}

.yyc-faq .wp-block-details summary:hover {
	color: var(--fl-link);
}

/* Plus aus zwei Fäden; der senkrechte fällt beim Öffnen weg */
.yyc-faq .wp-block-details summary::after {
	content: "";
	position: absolute;
	inset-inline-end: 0;
	top: 50%;
	translate: 0 -50%;
	width: 1.125rem;
	height: 1.125rem;
	background:
		linear-gradient(currentColor, currentColor) center / 100% 1.5px no-repeat,
		linear-gradient(currentColor, currentColor) center / 1.5px 100% no-repeat;
	transition: background-size var(--yyc-dur) var(--yyc-ease);
}

.yyc-faq .wp-block-details[open] summary::after {
	background-size: 100% 1.5px, 1.5px 0;
}

.yyc-faq .wp-block-details > :not(summary) {
	margin-block: 0 var(--wp--preset--spacing--40);
}

.yyc-faq .wp-block-details > :last-child {
	margin-block-end: var(--wp--preset--spacing--50);
}

/* Pricing — Konditionen als Zeilen, keine Preiskarten */
.yyc-pricing ul {
	list-style: none;
	padding: 0;
	margin-block: 0 var(--wp--preset--spacing--50);
	max-width: none;
	border-bottom: 1px solid var(--fl-line);
}

.yyc-pricing li {
	border-top: 1px solid var(--fl-line);
	padding-block: var(--wp--preset--spacing--40);
	margin: 0;
	font-variant-numeric: tabular-nums;
}

.yyc-pricing li strong {
	font-weight: 700;
}

/* Gallery — Lehrende: Porträt 4:5, Name, Schwerpunkt */
.yyc-gallery__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wp--preset--spacing--60) var(--wp--preset--spacing--50);
}

@media (min-width: 600px) { .yyc-gallery__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 960px) { .yyc-gallery__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .yyc-gallery__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.yyc-teacher {
	margin-block: 0;
}

.yyc-teacher > * {
	margin-block: 0;
}

.yyc-teacher .wp-block-image,
.yyc-teacher .yyc-placeholder {
	margin-block-end: var(--wp--preset--spacing--40);
}

.yyc-teacher .wp-block-image img {
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
}

.yyc-teacher > h3 {
	font-size: var(--wp--preset--font-size--xl);
	font-weight: 500;
	margin-block-end: var(--wp--preset--spacing--20);
	color: var(--yyc-ink);
}

.yyc-teacher > p {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--fl-soft);
}

.yyc-contact .yyc-section__body > p {
	color: var(--yyc-muted);
	font-size: var(--wp--preset--font-size--sm);
}

/* ---------------------------------------------------------------
   Komm dazu — der Schluss: Display über die volle Breite, Text und großer Knopf ab Spalte 4
   --------------------------------------------------------------- */
.wp-block-post-content > .yyc-cta,
.yyc-main > .yyc-cta {
	position: relative;
	padding-block: clamp(6rem, 4rem + 10vw, 12rem);
}

/* Linie stark über dem Schluss auf dem Grund (der Grund über die volle Breite überdeckt einen Rahmen) */
.wp-block-post-content > .yyc-cta:not(.yyc-night)::before {
	content: "";
	position: absolute;
	inset-inline: 0;
	top: 0;
	height: 1px;
	background: var(--yyc-line-lit);
}

.yyc-cta > .yyc-section--split {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-items: start;
}

.yyc-cta > .yyc-section--split > * {
	margin-block: 0;
}


.yyc-cta > .yyc-section--split > h2 {
	margin-block-end: var(--yyc-zeile);
}

.yyc-cta h2 {
	/* Höchstens so groß, dass rund 8,5 em in die Spalte passen: Mobil standen „Du unterrichtest“ oder „Ausprobieren“
	   in Display-Größe breiter als die Spalte und brachen im Wort (320/390 px, 2026-10-09). Ab rund 600 px gilt Display. */
	font-size: min(var(--wp--preset--font-size--display), calc((100vw - 2.5rem) / 8.5));
	font-weight: 500;
	line-height: 1;
	max-width: none;
	margin-block-end: var(--yyc-zeile);
}

.yyc-cta .yyc-section__body > p {
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.5;
	max-width: 34ch;
}

.yyc-cta .wp-block-buttons {
	margin-block-start: calc(var(--yyc-zeile) * 1.25);
}

.yyc-cta .wp-block-button__link {
	font-size: var(--wp--preset--font-size--lg);
	min-height: 3.75rem;
	padding-inline: 2rem;
}

@media (min-width: 960px) {
	.yyc-cta > .yyc-section--split {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: var(--wp--preset--spacing--50);
	}

	.yyc-cta > .yyc-section--split > h2 {
		grid-column: 1 / -1;
		grid-row: 1;
		margin-block-end: calc(var(--yyc-zeile) * 1.5);
	}

	.yyc-cta > .yyc-section--split > .yyc-section__body {
		grid-column: 4 / 12;
		grid-row: 2;
	}

}

/* ---------------------------------------------------------------
   Profil einer Lehrperson — die Lehrperson ist das Bild (Modus experience)
   Markup: Site-Plugin, yyc_site_profil_html(). Porträt in Tusche gedruckt, volles Siegel mit dem Vornamen.
   --------------------------------------------------------------- */
.yyc-profil {
	margin-block: clamp(1.5rem, 1rem + 3vw, 4rem) 0;
}

.yyc-profil__auftritt {
	display: grid;
	gap: var(--wp--preset--spacing--60);
	padding-block-end: calc(var(--yyc-gap) * 0.5);
}

.yyc-profil__portrait {
	margin: 0;
	aspect-ratio: 4 / 5;
	background: var(--yyc-lavur);
	overflow: hidden;
}

.yyc-profil__portrait img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (prefers-reduced-motion: no-preference) {
	/* Das Porträt zieht ein wie die Lavur der Startseite */
	.yyc-profil:not(.yyc-profil--vorschau) .yyc-profil__portrait img {
		animation: yyc-einziehen 1.8s var(--yyc-ease) 0.1s both;
	}
}

.yyc-profil__portrait-leer {
	display: grid;
	place-items: end start;
	height: 100%;
	padding: var(--wp--preset--spacing--40);
	color: var(--yyc-muted);
	font-size: var(--wp--preset--font-size--sm);
}

.yyc-profil__kopf {
	display: grid;
	align-content: end;
	gap: var(--wp--preset--spacing--50);
}

.yyc-profil__kopf > * {
	margin: 0;
}

.yyc-profil__name {
	font-size: var(--wp--preset--font-size--display);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.015em;
	max-width: 12ch;
}

.yyc-profil__schwerpunkt {
	font-family: var(--yyc-headline);
	font-size: var(--wp--preset--font-size--claim);
	font-style: italic;
	font-weight: 300;
	line-height: 1.2;
	color: var(--yyc-text);
	max-width: 28ch;
	text-wrap: balance;
}

.yyc-profil__zeichen,
.yyc-lineup__zeichen {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--50);
}

.yyc-lineup__zeichen {
	gap: var(--wp--preset--spacing--30); /* im Maß der kleineren Marke */
}

/* Der Stoff der Lehrperson in Markengröße vor der Namensmarke (Jan, 2026-10-08) */
.yyc-stoff {
	flex: none;
	width: 4rem; /* wie .yyc-siegel--name */
	aspect-ratio: 1;
	overflow: hidden;
}

.yyc-stoff img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.yyc-profil__angebot,
.yyc-lineup__label {
	margin: 0;
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--yyc-text);
}

@media (min-width: 960px) {
	.yyc-profil__auftritt {
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		column-gap: var(--wp--preset--spacing--80);
		align-items: end;
	}
}

/* Die Bildfelder: gleicher Rhythmus wie auf den Seiten, Haarlinie als Kante */
.yyc-profil .yyc-profil__abschnitt {
	padding-block: calc(var(--yyc-gap) * 0.45);
	border-top: 1px solid var(--yyc-line);
}

.yyc-profil .yyc-profil__abschnitt h2 {
	font-size: var(--wp--preset--font-size--2-xl);
}

.yyc-profil__ausbildung {
	list-style: none;
	margin: 0;
	padding: 0;
	max-width: none;
	border-bottom: 1px solid var(--yyc-line);
}

.yyc-profil__ausbildung li {
	display: grid;
	/* Am Handy nur so breit wie die Jahreszahl, damit der Text Platz behält */
	grid-template-columns: 3rem minmax(0, 1fr);
	gap: var(--wp--preset--spacing--30);
	margin: 0;
	padding-block: 0.8rem;
	border-top: 1px solid var(--yyc-line);
	align-items: baseline;
}

.yyc-profil__jahr {
	font-variant-numeric: tabular-nums lining-nums;
	color: var(--yyc-muted);
}

@media (min-width: 600px) {
	.yyc-profil__ausbildung li {
		grid-template-columns: 6.5rem minmax(0, 1fr);
		gap: var(--wp--preset--spacing--40);
	}
}

.yyc-profil__anbieter .yyc-section__body > p:first-child {
	color: var(--yyc-text);
}

.yyc-profil__kennzeichnung {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-muted);
}

.yyc-profil__wege {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--wp--preset--spacing--60);
}

/* ---------------------------------------------------------------
   Line-up auf /lehrende/: Karten aus echten Profilen, dahinter leere Siegel
   --------------------------------------------------------------- */
.yyc-lineup__raster {
	list-style: none;
	margin: 0;
	padding: 0;
	max-width: none;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wp--preset--spacing--70) var(--wp--preset--spacing--50);
}

/* Bis drei Spalten: Karten im Fluss, die freien Plätze als Siegelzeile, unten bündig mit der letzten Karte */
@media (max-width: 1279.98px) {
	.yyc-lineup .yyc-lineup__raster {
		display: flex;
		flex-wrap: wrap;
		align-items: flex-end;
		gap: var(--wp--preset--spacing--70) var(--wp--preset--spacing--40);
	}

	.yyc-lineup__karte {
		flex: 0 0 100%;
		align-self: flex-start;
	}
}

@media (min-width: 600px) and (max-width: 1279.98px) {
	.yyc-lineup .yyc-lineup__raster {
		column-gap: var(--wp--preset--spacing--50);
	}

	.yyc-lineup__karte {
		flex-basis: calc((100% - var(--wp--preset--spacing--50)) / 2);
		margin-inline-end: 0;
	}
}

@media (min-width: 960px) and (max-width: 1279.98px) {
	.yyc-lineup__karte {
		flex-basis: calc((100% - 2 * var(--wp--preset--spacing--50)) / 3);
	}
}

/* Ab vier Spalten: jeder freie Platz ist eine Zelle, der leere Abdruck steht auf der Unterkante der Porträts */
@media (min-width: 1280px) {
	.yyc-lineup__raster {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.yyc-lineup__platz {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		align-content: start;
	}

	/* Stärker als die Listen-Rücksetzung unten: die unsichtbare Porträtfläche, auf der das Siegel steht */
	.yyc-lineup .yyc-lineup__raster > .yyc-lineup__platz::before {
		content: "";
		grid-area: 1 / 1;
		width: 100%;
		aspect-ratio: 4 / 5;
	}

	.yyc-lineup__platz > .yyc-siegel {
		grid-area: 1 / 1;
		align-self: end;
	}
}

/* Gegen die allgemeinen Listenregeln der Inhalte: kein Einzug, kein Abstand je Punkt */
.yyc-lineup .yyc-lineup__raster {
	padding: 0;
}

.yyc-lineup .yyc-lineup__raster > li {
	margin: 0;
	padding: 0;
}

.yyc-lineup .yyc-lineup__raster > li::before {
	content: none;
}


.yyc-lineup__link {
	display: grid;
	gap: var(--wp--preset--spacing--20);
	color: var(--yyc-ink);
	text-decoration: none;
}

.yyc-lineup__bild {
	display: block;
	aspect-ratio: 4 / 5;
	margin-block-end: var(--wp--preset--spacing--30);
	background: var(--yyc-lavur);
	overflow: hidden;
}

.yyc-lineup__bild img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 1.2s var(--yyc-ease);
}

.yyc-lineup__link:hover .yyc-lineup__bild img {
	transform: scale(1.02);
}

/* Jede Lehrperson hat einen Stoff aus der Bolsterreihe (Jan, 2026-10-08): Vielstimmigkeit als Material, nicht als
   Farbe. Er liegt als Streifen am linken Rand über dem Rahmen (Passepartout, das Porträt rückt nicht). Ohne Porträt
   hängt der Streifen genauso, daneben die leere Fläche in Pergament – wie die leere Marke: das Passepartout hängt
   schon, das Werk kommt. Kein Stoff als ganze Fläche: Die Ausschnitte sind fünffach vergrößert und läsen sich dort
   wie ein kaputtes Bild (Jan, 2026-10-08, Nachtrag 1). Kein Rahmen, kein Schatten: Er ist Material, kein Icon. */
.yyc-lineup__bild {
	position: relative;
}

.yyc-lineup__bild .yyc-lineup__stoff {
	position: absolute;
	inset-block: 0;
	inset-inline-start: 0;
	z-index: 1;
	width: 0.75rem;
	height: 100%;
	object-fit: cover;
}

.yyc-lineup__link:hover .yyc-lineup__bild .yyc-lineup__stoff {
	transform: none;
}

/* Die Katalognummer der Karte, wie die Nummern der Startseite (Jan, 2026-10-08) */
.yyc-lineup__nummer {
	font-family: var(--yyc-ui);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 1.3;
	color: var(--yyc-muted);
	font-variant-numeric: tabular-nums lining-nums;
}

.yyc-lineup__name {
	font-family: var(--yyc-headline);
	font-size: var(--wp--preset--font-size--xl);
	font-weight: 500;
	line-height: 1.1;
	text-decoration: underline;
	text-decoration-color: transparent;
	text-underline-offset: 0.2em;
	text-decoration-thickness: 1px;
	transition: text-decoration-color var(--yyc-dur) var(--yyc-ease);
}

.yyc-lineup__link:hover .yyc-lineup__name {
	text-decoration-color: var(--yyc-abendblau);
}

.yyc-lineup__schwerpunkt {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-muted);
}

.yyc-lineup + p {
	margin-block-start: var(--wp--preset--spacing--50);
	color: var(--yyc-muted);
}

/* ---------------------------------------------------------------
   Konto der Lehrenden: Anmelden, Passwort, Mein Profil (Vorlage page-landing)
   --------------------------------------------------------------- */
.yyc-konto {
	max-width: 30rem;
	padding-block: clamp(3rem, 2rem + 5vw, 7rem) var(--yyc-gap);
}

.yyc-konto__titel {
	font-size: var(--wp--preset--font-size--display);
	font-weight: 500;
	line-height: 1;
	margin-block: 0 var(--yyc-zeile);
}

.yyc-konto > p {
	color: var(--yyc-text);
}

.yyc-form--konto,
.yyc-konto > .yyc-notice {
	margin-block-start: var(--wp--preset--spacing--60);
}

.yyc-konto > .yyc-notice + .yyc-form--konto {
	margin-block-start: var(--wp--preset--spacing--40);
}

.yyc-konto__weiter {
	margin-block-start: var(--wp--preset--spacing--50);
	font-size: var(--wp--preset--font-size--sm);
}

.yyc-mein-profil {
	max-width: var(--wp--style--global--wide-size, 80rem) !important;
	padding-block: clamp(2rem, 1rem + 4vw, 5rem) var(--yyc-gap);
}

.yyc-mein-profil__kopf {
	max-width: 44rem;
	margin-block-end: var(--wp--preset--spacing--70);
}

.yyc-mein-profil__kopf .yyc-konto__titel {
	margin-block-end: var(--wp--preset--spacing--40);
}

.yyc-mein-profil__status {
	color: var(--yyc-muted);
	font-size: var(--wp--preset--font-size--sm);
}

.yyc-mein-profil__raster {
	display: grid;
	gap: var(--wp--preset--spacing--80);
}

.yyc-mein-profil__vorschau {
	min-width: 0;
}

.yyc-mein-profil__vorschau-titel {
	display: flex;
	align-items: center;
	min-height: 3rem;
	cursor: pointer;
	margin: 0 0 var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--yyc-muted);
	list-style: none;
}

.yyc-mein-profil__vorschau-titel::-webkit-details-marker {
	display: none;
}

/* Plus aus zwei Fäden wie in den FAQ; der senkrechte fällt beim Öffnen weg */
.yyc-mein-profil__vorschau-titel::after {
	content: "";
	flex: none;
	width: 0.875rem;
	height: 0.875rem;
	margin-inline-start: 0.75em;
	color: var(--yyc-ink);
	background:
		linear-gradient(currentColor, currentColor) center / 100% 1.5px no-repeat,
		linear-gradient(currentColor, currentColor) center / 1.5px 100% no-repeat;
	transition: background-size var(--yyc-dur) var(--yyc-ease);
}

.yyc-mein-profil__vorschau[open] > .yyc-mein-profil__vorschau-titel::after {
	background-size: 100% 1.5px, 1.5px 0;
}

.yyc-mein-profil__vorschau:not([open]) > .yyc-mein-profil__vorschau-titel {
	margin-block-end: 0;
	border-block: 1px solid var(--yyc-line);
}

/* Die Vorschau ist die Profilseite, verkleinert auf ein Blatt */
.yyc-mein-profil__vorschau-blatt {
	border: 1px solid var(--yyc-line);
	background: var(--yyc-bg);
	padding: var(--wp--preset--spacing--50);
	/* zoom verkleinert auch die Höhenangabe: deshalb durch den Faktor geteilt */
	max-height: calc(70vh / 0.5);
	overflow: auto;
	zoom: 0.5;
}

.yyc-mein-profil__vorschau-blatt .yyc-profil {
	margin-block-start: 0;
}

@media (min-width: 1100px) {
	.yyc-mein-profil__raster {
		grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
		align-items: start;
	}

	/* Im Quelltext steht die Vorschau vorn (am Handy oben, zugeklappt); am Schreibtisch rechts neben dem Formular */
	.yyc-mein-profil__raster > .yyc-form--profil {
		grid-column: 1;
		grid-row: 1;
	}

	.yyc-mein-profil__vorschau {
		grid-column: 2;
		grid-row: 1;
		position: sticky;
		top: var(--wp--preset--spacing--60);
	}

	.yyc-mein-profil__vorschau-blatt {
		max-height: calc((100vh - 8rem) / 0.42);
		zoom: 0.42;
	}

	/* Im Blatt immer die Anordnung des Schreibtischs */
	.yyc-mein-profil__vorschau-blatt .yyc-profil__auftritt {
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		column-gap: var(--wp--preset--spacing--80);
		align-items: end;
	}
}

.yyc-form--profil {
	max-width: 40rem;
	gap: var(--wp--preset--spacing--60);
}

.yyc-form__gruppe {
	display: grid;
	gap: var(--wp--preset--spacing--40);
	margin: 0;
	padding: var(--wp--preset--spacing--50) 0 0;
	border: 0;
	border-top: 1px solid var(--yyc-line);
}

.yyc-form__gruppe > legend {
	padding: 0 var(--wp--preset--spacing--30) 0 0;
	font-family: var(--yyc-headline);
	font-size: var(--wp--preset--font-size--lg);
	font-weight: 400;
}

.yyc-form__pflicht {
	font-weight: 400;
	color: var(--yyc-muted);
}

/* Auswahlgruppen: ohne Rahmen des Browsers, an einer Haarlinie wie die übrigen Gruppen */
.yyc-form fieldset.yyc-form__choices {
	margin: 0;
	padding: var(--wp--preset--spacing--30) 0 0;
	border: 0;
	border-top: 1px solid var(--yyc-line);
}

.yyc-form fieldset.yyc-form__choices > legend {
	padding: 0 var(--wp--preset--spacing--30) 0 0;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--sm);
}

.yyc-form__choices--reihe {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--wp--preset--spacing--50);
}

.yyc-form__choice--wichtig {
	padding: var(--wp--preset--spacing--40) 0;
	border-top: 1px solid var(--yyc-line);
	border-bottom: 1px solid var(--yyc-line);
}

.yyc-form__zaehler {
	margin: 0;
	font-size: var(--wp--preset--font-size--xs);
	color: var(--yyc-muted);
	font-variant-numeric: tabular-nums lining-nums;
}

.yyc-form__zaehler.is-zu-viel,
.yyc-form__zaehler.is-zu-wenig {
	color: var(--yyc-error);
}

/* Fortschritt beim Hochladen des Porträts: eine Haarlinie, die sich mit Tusche füllt */
.yyc-form__upload {
	display: grid;
	gap: var(--wp--preset--spacing--20);
}

.yyc-form__upload progress {
	appearance: none;
	width: 100%;
	height: 3px;
	border: 0;
	background: var(--yyc-line);
	color: var(--yyc-ink);
}

.yyc-form__upload progress::-webkit-progress-bar {
	background: var(--yyc-line);
}

.yyc-form__upload progress::-webkit-progress-value {
	background: var(--yyc-ink);
}

.yyc-form__upload progress::-moz-progress-bar {
	background: var(--yyc-ink);
}

.yyc-form__upload p {
	margin: 0;
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-muted);
	font-variant-numeric: tabular-nums;
}

.yyc-form__aktionen {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wp--preset--spacing--40);
}

.yyc-form__aktionen > .yyc-form__hint {
	flex-basis: 100%;
}

/* Zweite Aktion: Outline in Tusche, die Hauptaktion bleibt das blaue Feld */
.yyc-form button[type="submit"].yyc-form__zweit {
	background: transparent;
	color: var(--yyc-ink);
	border-color: var(--yyc-ink);
}

.yyc-form button[type="submit"].yyc-form__zweit:is(:hover, :focus-visible) {
	background: var(--yyc-ink);
	color: var(--yyc-bg);
}

.yyc-form input[type="file"] {
	font: inherit;
	font-size: var(--wp--preset--font-size--sm);
	min-height: 3rem;
}

.yyc-form input[type="file"]::file-selector-button {
	margin-inline-end: var(--wp--preset--spacing--40);
	min-height: 3rem;
	padding: 0 1.25rem;
	background: transparent;
	color: var(--yyc-ink);
	border: 1px solid var(--yyc-ink);
	font: inherit;
	cursor: pointer;
}

/* ---------------------------------------------------------------
   Herzstück: Programm, Angebot, Konto, Meine Angebote (Markup: Plugin yyc-booking)
   Hängerolle statt Dashboard: Tage mit Datumssiegel, Zeilen an Haarlinien, Zustände als Wort in Tusche grau.
   Rot nur für Siegel und die eine Hauptaktion.
   --------------------------------------------------------------- */

/* Filter: Textlinks, der aktive mit roter Unterstreichung */
.yyc-filter {
	display: grid;
	gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--70);
	margin-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--80);
	padding-block: var(--wp--preset--spacing--50);
	border-block: 1px solid var(--yyc-line);
}

@media (min-width: 760px) {
	.yyc-filter {
		display: flex;
		flex-wrap: wrap;
		gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--80);
	}
}

.yyc-filter__titel {
	margin: 0 0 var(--wp--preset--spacing--10);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--yyc-muted);
}

.yyc-filter__liste {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--wp--preset--spacing--40);
	margin: 0;
	padding: 0;
	list-style: none;
	max-width: none;
}

.yyc-filter__liste li {
	margin: 0;
}

.yyc-filter__liste a,
.yyc-konto-nav a {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	color: var(--yyc-text);
	font-size: var(--wp--preset--font-size--sm);
	text-decoration: underline;
	text-decoration-color: transparent;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.4em;
	transition: color var(--yyc-dur) var(--yyc-ease), text-decoration-color var(--yyc-dur) var(--yyc-ease);
}

.yyc-filter__liste a:hover,
.yyc-konto-nav a:hover {
	color: var(--yyc-ink);
	text-decoration-color: var(--yyc-line-lit);
}

.yyc-filter__liste a[aria-current],
.yyc-konto-nav a[aria-current] {
	color: var(--yyc-ink);
	font-weight: 500;
	text-decoration-color: var(--yyc-abendblau);
	text-decoration-thickness: 2px;
}

.yyc-programm__liste[aria-busy="true"] {
	opacity: 0.45;
	transition: opacity var(--yyc-dur) var(--yyc-ease);
}

/* Ein Tag: Datumssiegel und Wochentag, darunter die Zeilen */
.yyc-tag + .yyc-tag {
	margin-block-start: var(--wp--preset--spacing--80);
}

.yyc-tag__kopf {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--50);
	margin-block-end: var(--wp--preset--spacing--40);
}

.yyc-tag__titel {
	margin: 0;
	font-size: var(--wp--preset--font-size--xl);
	font-weight: 500;
	line-height: 1.1;
	max-width: none;
}

.yyc-tag__datum {
	margin-inline-start: 0.4em;
	color: var(--yyc-muted);
}

/* Programmzeile */
.yyc-zeilen {
	margin: 0;
	padding: 0;
	list-style: none;
	max-width: none;
	border-top: 1px solid var(--yyc-line);
}

.yyc-zeilen > li.yyc-zeile {
	margin: 0;
}

.yyc-zeile {
	display: grid;
	grid-template-columns: 3.75rem minmax(0, 1fr);
	grid-template-areas:
		"zeit haupt"
		"stand stand";
	gap: var(--wp--preset--spacing--20) var(--wp--preset--spacing--40);
	padding-block: var(--wp--preset--spacing--50);
	border-bottom: 1px solid var(--yyc-line);
}

@media (min-width: 760px) {
	.yyc-zeile {
		grid-template-columns: 5rem minmax(0, 1fr) minmax(11rem, auto);
		grid-template-areas: "zeit haupt stand";
		column-gap: var(--wp--preset--spacing--60);
		align-items: start;
	}
}

.yyc-zeile p {
	margin: 0;
}

.yyc-zeile__zeit {
	grid-area: zeit;
	padding-block-start: 0.15rem;
	font-size: var(--wp--preset--font-size--lg);
	font-variant-numeric: tabular-nums lining-nums;
	color: var(--yyc-ink);
	line-height: 1.2;
}

.yyc-zeile__tag {
	display: block;
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.04em;
	color: var(--yyc-muted);
}

.yyc-zeile__haupt {
	grid-area: haupt;
	display: grid;
	gap: var(--wp--preset--spacing--20);
	min-width: 0;
}

.yyc-zeile__titel {
	margin: 0;
	font-family: var(--yyc-headline);
	font-size: var(--wp--preset--font-size--lg);
	font-weight: 400;
	line-height: 1.25;
	max-width: 32ch;
}

.yyc-zeile__titel a {
	color: var(--yyc-ink);
	text-decoration: underline;
	text-decoration-color: transparent;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
	transition: text-decoration-color var(--yyc-dur) var(--yyc-ease);
}

.yyc-zeile__titel a:hover {
	text-decoration-color: var(--yyc-abendblau);
}

.yyc-zeile__lehrperson {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-text);
}

/* Kleines Porträt, in Tusche gedruckt wie die großen */
.yyc-zeile__bild {
	flex: none;
	display: block;
	width: 2rem;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--yyc-lavur);
}

.yyc-zeile__bild img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.yyc-zeile__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-muted);
	font-variant-numeric: lining-nums;
}

.yyc-zeile__stand {
	grid-area: stand;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--20) var(--wp--preset--spacing--40);
}

@media (min-width: 760px) {
	.yyc-zeile__stand {
		flex-direction: column;
		align-items: flex-end;
		justify-content: flex-start;
		text-align: right;
	}
}

.yyc-zeile__zustand {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-muted);
}

/* Am Handy trägt der Weg zum Angebot die ganze Breite */
@media (max-width: 759.98px) {
	.yyc-zeile__weg {
		flex: 1 0 100%;
		justify-content: space-between;
		border-top: 1px solid var(--yyc-line);
	}
}

.yyc-zeile.is-abgesagt .yyc-zeile__zeit,
.yyc-zeile.is-abgesagt .yyc-zeile__haupt {
	color: var(--yyc-muted);
}

.yyc-zeile.is-abgesagt del {
	text-decoration-thickness: 1px;
	color: var(--yyc-muted);
}

.yyc-zeile__mein {
	display: inline-flex;
	align-items: center;
	gap: var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-muted);
}

/* Siegel „DEIN PLATZ“: zwei Zeilen im roten Feld */
.yyc-siegel--platz {
	--yyc-siegel: 3.5rem;
	font-size: 0.72rem;
	letter-spacing: 0.06em;
	line-height: 1.1;
}

.yyc-zeile__mein .yyc-siegel--leer {
	--yyc-siegel: 2.5rem;
}

/* Beim Sichern wird das Siegel gesetzt – der eine Moment, der sich anfühlen darf */
@media (prefers-reduced-motion: no-preference) {
	.yyc-siegel.yyc-siegel--gesetzt {
		animation: yyc-setzen 700ms var(--yyc-ease) 150ms both;
		animation-timeline: auto;
		animation-range: normal;
	}
}

.yyc-leer {
	color: var(--yyc-muted);
	max-width: var(--yyc-measure);
}

/* Listen des Herzstücks: gegen die allgemeine Listenregel der Inhalte (Einzug, Abstand je Punkt) */
.wp-block-post-content :is(.yyc-zeilen, .yyc-filter__liste, .yyc-buchen__liste, .yyc-angebote__liste, .yyc-termine__liste, .yyc-konto-nav ul) {
	padding-inline-start: 0;
}

.wp-block-post-content :is(.yyc-zeilen, .yyc-filter__liste, .yyc-buchen__liste, .yyc-angebote__liste, .yyc-termine__liste, .yyc-konto-nav ul) > li {
	margin-block: 0;
}

/* ---- Angebotsseite ---- */
.yyc-angebot__kopf {
	display: grid;
	gap: var(--wp--preset--spacing--40);
	padding-block: clamp(2rem, 1rem + 4vw, 5rem) calc(var(--yyc-gap) * 0.45);
	max-width: 48rem;
}

.yyc-angebot__kopf > p {
	margin: 0;
}

.yyc-angebot__titel {
	margin: 0;
	font-size: var(--wp--preset--font-size--3-xl);
	font-weight: 500;
	line-height: 1.06;
	letter-spacing: -0.01em;
	max-width: 18ch;
	text-wrap: balance;
}

.yyc-angebot__kurz {
	font-family: var(--yyc-headline);
	font-size: var(--wp--preset--font-size--lg);
	font-style: italic;
	font-weight: 300;
	color: var(--yyc-muted);
	max-width: 34rem;
}

.yyc-angebot__meta {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-text);
	font-variant-numeric: lining-nums;
}

.yyc-angebot__lehrperson {
	display: inline-flex;
	align-items: center;
	gap: var(--wp--preset--spacing--40);
	justify-self: start;
	margin-block-start: var(--wp--preset--spacing--30);
	color: var(--yyc-ink);
	text-decoration: none;
}

.yyc-angebot__lehrperson .yyc-zeile__bild {
	width: 3.5rem;
}

.yyc-angebot__lp-text {
	display: grid;
	gap: 0.15rem;
}

.yyc-angebot__lp-name {
	font-size: var(--wp--preset--font-size--lg);
	text-decoration: underline;
	text-decoration-color: var(--yyc-line-lit);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
	transition: text-decoration-color var(--yyc-dur) var(--yyc-ease);
}

.yyc-angebot__lehrperson:hover .yyc-angebot__lp-name {
	text-decoration-color: var(--yyc-abendblau);
}

.yyc-angebot__lp-schwerpunkt {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-muted);
}

.yyc-angebot .yyc-profil__abschnitt {
	padding-block: calc(var(--yyc-gap) * 0.4);
	border-top: 1px solid var(--yyc-line);
}

.yyc-angebot .yyc-profil__abschnitt h2 {
	font-size: var(--wp--preset--font-size--2-xl);
}

/* Termine wählen: eine Zeile je Termin, ein Knopf für alle */
.yyc-buchen__termine {
	margin: 0;
	padding: 0;
	border: 0;
	min-width: 0;
}

.yyc-buchen__liste {
	margin: 0;
	padding: 0;
	list-style: none;
	max-width: none;
	border-top: 1px solid var(--yyc-line);
}

.yyc-buchen__liste > li.yyc-buchen__zeile {
	margin: 0;
}

.yyc-buchen__zeile {
	display: grid;
	grid-template-columns: 1.375rem minmax(0, 1fr);
	gap: var(--wp--preset--spacing--20) var(--wp--preset--spacing--40);
	align-items: start;
	padding-block: var(--wp--preset--spacing--40);
	border-bottom: 1px solid var(--yyc-line);
}

@media (min-width: 600px) {
	.yyc-buchen__zeile {
		grid-template-columns: 1.375rem minmax(0, 1fr) auto;
	}
}

.yyc-buchen__zeile input[type="radio"] {
	width: 1.375rem;
	height: 1.375rem;
	margin: 0.2rem 0 0;
	accent-color: var(--yyc-ink);
}

.yyc-buchen__leer {
	width: 1.375rem;
}

.yyc-buchen__wann {
	display: grid;
	gap: 0.15rem;
	cursor: pointer;
}

.yyc-buchen__datum {
	font-size: var(--wp--preset--font-size--base);
	color: var(--yyc-ink);
	font-variant-numeric: lining-nums;
}

.yyc-buchen__zeit {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-muted);
	font-variant-numeric: tabular-nums lining-nums;
}

.yyc-buchen__stand {
	grid-column: 2;
	display: inline-flex;
	align-items: center;
	gap: var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-muted);
}

@media (min-width: 600px) {
	.yyc-buchen__stand {
		grid-column: 3;
		justify-content: flex-end;
	}
}

.yyc-buchen__zeile.is-abgesagt {
	color: var(--yyc-muted);
}

.yyc-buchen__reihe {
	grid-column: 2 / -1;
	font-size: var(--wp--preset--font-size--sm);
}

.yyc-buchen__reihe summary {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	cursor: pointer;
	color: var(--yyc-text);
	text-decoration: underline;
	text-decoration-color: var(--yyc-line-lit);
	text-underline-offset: 0.3em;
}

.yyc-buchen__reihe ul {
	margin: 0 0 var(--wp--preset--spacing--20);
	padding-inline-start: 1.1rem;
	color: var(--yyc-muted);
	font-variant-numeric: tabular-nums lining-nums;
}

.yyc-buchen__schluss {
	display: grid;
	gap: var(--wp--preset--spacing--40);
	justify-items: start;
	margin-block-start: var(--wp--preset--spacing--60);
}

.yyc-buchen__schluss p {
	margin: 0;
}

.yyc-buchen__recht {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-muted);
	line-height: 1.6;
}

@media (max-width: 599.98px) {
	.yyc-buchen__knopf {
		width: 100%;
	}
}

.yyc-buchen__wege {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--60);
}

.yyc-notice--gesetzt {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--50);
	margin-block-end: var(--wp--preset--spacing--60);
}

.yyc-notice--gesetzt .yyc-siegel--platz {
	--yyc-siegel: 4.25rem;
	font-size: 0.875rem;
}

.yyc-termine-kurz {
	margin: 0;
	padding-inline-start: 1.1rem;
	font-variant-numeric: tabular-nums lining-nums;
}

/* ---- Konto der Teilnehmenden ---- */
.yyc-konto-nav ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--wp--preset--spacing--50);
	margin: 0;
	padding: 0;
	list-style: none;
	max-width: none;
}

.yyc-konto-nav li {
	margin: 0;
}

.yyc-kontoseite .yyc-mein-profil__kopf > .yyc-notice {
	margin-block-start: var(--wp--preset--spacing--50);
}

.yyc-stunden + .yyc-stunden {
	margin-block-start: var(--wp--preset--spacing--90);
}

.yyc-stunden__titel {
	font-size: var(--wp--preset--font-size--xl);
	font-weight: 500;
	margin-block: 0 var(--wp--preset--spacing--40);
}

.yyc-zeile__aktionen {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wp--preset--spacing--20) var(--wp--preset--spacing--40);
}

@media (min-width: 760px) {
	.yyc-zeile__aktionen {
		flex-direction: column;
		align-items: flex-end;
	}
}

.yyc-zeile__zoom {
	white-space: nowrap;
}

.yyc-zeile__hinweis {
	display: block;
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 400;
	color: var(--yyc-muted);
}

.yyc-weiter.yyc-zeile__zoom {
	flex-wrap: wrap;
	row-gap: 0;
}

@media (min-width: 760px) {
	.yyc-weiter.yyc-zeile__zoom {
		justify-content: flex-end;
	}
}

/* Hinweis unter dem Link, der Pfeil bleibt am Text */
.yyc-weiter.yyc-zeile__zoom::after {
	order: 2;
}

.yyc-weiter .yyc-zeile__hinweis {
	order: 3;
	flex-basis: 100%;
	text-align: inherit;
}

.yyc-zeile__klein,
.yyc-zeile__frei {
	font-size: var(--wp--preset--font-size--xs);
	color: var(--yyc-muted);
	max-width: 22rem;
}

.yyc-knopfform {
	margin: 0;
}

/* Knopf, der wie ein Link aussieht: für Nebenaktionen neben der einen Hauptaktion */
.yyc-textknopf {
	min-height: 2.75rem;
	padding: 0;
	border: 0;
	background: none;
	color: var(--yyc-ink);
	font: inherit;
	font-size: var(--wp--preset--font-size--sm);
	text-decoration: underline;
	text-decoration-color: var(--yyc-line-lit);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.3em;
	cursor: pointer;
	transition: text-decoration-color var(--yyc-dur) var(--yyc-ease), color var(--yyc-dur) var(--yyc-ease);
}

.yyc-textknopf:hover {
	text-decoration-color: var(--yyc-abendblau);
}

.yyc-leerfeld {
	padding: var(--wp--preset--spacing--70) var(--wp--preset--spacing--60);
	background: var(--yyc-lavur);
	max-width: 40rem;
}

.yyc-leerfeld p {
	margin: 0 0 var(--wp--preset--spacing--50);
}

.yyc-leerfeld p:last-child {
	margin: 0;
}

.yyc-kontoseite__formulare {
	display: grid;
	gap: var(--wp--preset--spacing--70);
	max-width: 40rem;
}

.yyc-loeschen summary {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	cursor: pointer;
	color: var(--yyc-muted);
	font-size: var(--wp--preset--font-size--sm);
	text-decoration: underline;
	text-underline-offset: 0.3em;
}

.yyc-loeschen[open] summary {
	margin-block-end: var(--wp--preset--spacing--40);
}

/* ---- Meine Angebote (Lehrende) ---- */
.yyc-angebote__neu {
	margin-block: 0 var(--wp--preset--spacing--60);
}

.yyc-angebote__liste {
	margin: 0 0 var(--wp--preset--spacing--80);
	padding: 0;
	list-style: none;
	max-width: 48rem;
	border-top: 1px solid var(--yyc-line);
}

.yyc-angebote__zeile {
	display: grid;
	gap: 0.2rem;
	margin: 0;
	padding-block: var(--wp--preset--spacing--40);
	border-bottom: 1px solid var(--yyc-line);
}

.yyc-angebote__titel {
	font-size: var(--wp--preset--font-size--lg);
	color: var(--yyc-ink);
}

.yyc-angebote__meta,
.yyc-angebote__termine {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-muted);
}

.yyc-angebote__via {
	max-width: 40rem;
	padding-block-start: var(--wp--preset--spacing--60);
	border-top: 1px solid var(--yyc-line);
}

.yyc-angebote__via h2,
.yyc-termine h2 {
	font-size: var(--wp--preset--font-size--xl);
	font-weight: 500;
	margin-block: 0 var(--wp--preset--spacing--40);
}

.yyc-angebote__via-feld {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--30);
	align-items: center;
}

.yyc-angebote__via-feld input {
	flex: 1 1 18rem;
	min-height: 3rem;
	padding: 0.6rem 0.8rem;
	border: 1px solid var(--yyc-line-lit);
	background: var(--yyc-input);
	color: var(--yyc-ink);
	font: inherit;
	font-size: var(--wp--preset--font-size--sm);
}

.yyc-kopieren {
	min-height: 3rem;
	padding: 0 1.25rem;
	border: 1px solid var(--yyc-ink);
	background: transparent;
	color: var(--yyc-ink);
	font: inherit;
	cursor: pointer;
}

.yyc-termine {
	margin-block-start: var(--wp--preset--spacing--90);
	padding-block-start: var(--wp--preset--spacing--60);
	border-top: 1px solid var(--yyc-line);
	max-width: 48rem;
}

.yyc-termine__liste {
	margin: 0 0 var(--wp--preset--spacing--70);
	padding: 0;
	list-style: none;
	max-width: none;
	border-top: 1px solid var(--yyc-line);
}

.yyc-termine__zeile {
	margin: 0;
	padding-block: var(--wp--preset--spacing--40);
	border-bottom: 1px solid var(--yyc-line);
}

.yyc-termine__zeile p {
	margin: 0;
}

.yyc-termine__wann {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--wp--preset--spacing--40);
	color: var(--yyc-ink);
	font-variant-numeric: tabular-nums lining-nums;
}

.yyc-termine__stand {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-muted);
}

.yyc-termine__zeile.is-abgesagt .yyc-termine__wann,
.yyc-termine__zeile.is-vorbei .yyc-termine__wann {
	color: var(--yyc-muted);
}

.yyc-termine__wege a {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	font-size: var(--wp--preset--font-size--sm);
}

.yyc-termine__bearbeiten summary {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	cursor: pointer;
	font-size: var(--wp--preset--font-size--sm);
	color: var(--yyc-text);
	text-decoration: underline;
	text-decoration-color: var(--yyc-line-lit);
	text-underline-offset: 0.3em;
}

.yyc-termine__bearbeiten[open] {
	padding-block-end: var(--wp--preset--spacing--40);
}

.yyc-form--termin {
	margin-block-start: var(--wp--preset--spacing--40);
	max-width: 32rem;
}

.yyc-form__zeile {
	display: grid;
	gap: var(--wp--preset--spacing--40);
}

@media (min-width: 600px) {
	.yyc-form__zeile {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.yyc-form input.yyc-form__kurz {
	max-width: 12rem;
}

/* Präventionsfelder nur beim Format Präventionskurs (Skript setzt hidden; die Gruppenregel darf es nicht überstimmen) */
.yyc-angebote__praevention[hidden] {
	display: none;
}

.yyc-angebote__archiv {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wp--preset--spacing--40);
	margin-block-start: var(--wp--preset--spacing--80);
}

.yyc-teilnehmende {
	margin-block-start: var(--wp--preset--spacing--40);
	overflow-x: auto;
}

.yyc-tabelle {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--wp--preset--font-size--sm);
	font-variant-numeric: tabular-nums lining-nums;
}

.yyc-tabelle th,
.yyc-tabelle td {
	padding: 0.6rem 0.75rem 0.6rem 0;
	border-bottom: 1px solid var(--yyc-line);
	text-align: left;
	vertical-align: top;
}

.yyc-tabelle th {
	font-weight: 500;
	color: var(--yyc-muted);
}

/* ---------------------------------------------------------------
   Formulare (Markup liefert das Site-Plugin)
   --------------------------------------------------------------- */
.yyc-form {
	display: grid;
	gap: var(--wp--preset--spacing--50);
	background: var(--yyc-input);
	border: 1px solid var(--yyc-line);
	padding: var(--wp--preset--spacing--60);
	max-width: 36rem;
	color: var(--yyc-text);
	--fl-focus: var(--yyc-focus);
}

.yyc-form__field {
	display: grid;
	gap: var(--wp--preset--spacing--20);
	margin: 0;
	padding: 0;
	border: 0;
	min-width: 0;
}

.yyc-form label,
.yyc-form legend {
	font-family: var(--yyc-ui);
	font-weight: 500;
	font-size: var(--wp--preset--font-size--sm);
	padding: 0;
}

.yyc-form legend {
	margin-block-end: var(--wp--preset--spacing--20);
}

.yyc-form input[type="text"],
.yyc-form input[type="email"],
.yyc-form input[type="number"],
.yyc-form input[type="date"],
.yyc-form input[type="time"],
.yyc-form input[type="url"],
.yyc-form input[type="tel"],
.yyc-form input[type="password"],
.yyc-form select,
.yyc-form textarea {
	width: 100%;
	min-height: 3rem;
	box-sizing: border-box;
	background: var(--yyc-input);
	color: var(--yyc-ink);
	border: 1px solid var(--yyc-line-lit);
	border-radius: 0;
	padding: 0.625rem 0.75rem;
	font: inherit;
	line-height: 1.4;
	transition: border-color var(--yyc-dur) var(--yyc-ease);
}

.yyc-form textarea {
	min-height: 10rem;
	resize: vertical;
}

.yyc-form input:hover,
.yyc-form select:hover,
.yyc-form textarea:hover {
	border-color: var(--yyc-text);
}

.yyc-form :where(input, select, textarea):focus-visible {
	border-color: var(--yyc-ink);
}

.yyc-form ::placeholder {
	color: var(--yyc-muted);
	opacity: 1;
}

.yyc-form__choices {
	display: grid;
	gap: 0;
}

.yyc-form__choice {
	display: flex;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--30);
	min-height: 3rem;
	padding-block: 0.5rem;
	line-height: 1.6;
	cursor: pointer;
}

/* Kästchen an der ersten Zeile, auch wenn der Text umbricht */
.yyc-form__choice > input {
	margin-block-start: 0.3rem !important; /* (Zeilenhöhe 1,6 × Grundgröße − 1,375rem) / 2 */
}

.yyc-form .yyc-form__choice label,
.yyc-form label.yyc-form__choice {
	font-weight: 400;
	font-size: var(--wp--preset--font-size--base);
}

.yyc-form input[type="radio"],
.yyc-form input[type="checkbox"] {
	flex: none;
	width: 1.375rem;
	height: 1.375rem;
	margin: 0;
}

.yyc-form__hint,
.yyc-form__consent {
	font-family: var(--yyc-ui);
	color: var(--yyc-muted);
	font-size: var(--wp--preset--font-size--sm);
	line-height: 1.5;
	margin: 0;
}

.yyc-form__error {
	font-family: var(--yyc-ui);
	color: var(--yyc-error);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	margin: 0;
}

/* Gleiche Spezifität wie die Feldregel oben (0,2,1) und später im Blatt: der Fehlerrahmen setzt sich durch. */
.yyc-form :is(input, select, textarea)[aria-invalid="true"] {
	border-color: var(--yyc-error);
	border-width: 2px;
}

.yyc-form button[type="submit"] {
	justify-self: start;
	background: var(--yyc-nacht);
	color: var(--yyc-input);
	border: 1px solid var(--yyc-nacht);
	border-radius: 0;
	font: inherit;
	font-family: var(--yyc-ui);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500; /* wie alle Buttons (theme.json) */
	letter-spacing: 0.04em;
	line-height: 1.3;
	padding: 0.9375rem 1.75rem;
}

.yyc-form button[type="submit"]:is(:hover, :focus-visible) {
	background: var(--yyc-abendblau);
	border-color: var(--yyc-abendblau);
}

.yyc-form button[type="submit"][disabled] {
	background: var(--yyc-line-lit);
	border-color: var(--yyc-line-lit);
	color: var(--yyc-text);
	cursor: progress;
}

/* Honeypot: für Menschen und Screenreader nicht vorhanden */
.yyc-form__hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.yyc-notice {
	border: 1px solid var(--yyc-line-lit);
	background: var(--yyc-input);
	color: var(--yyc-text);
	padding: var(--wp--preset--spacing--50);
	max-width: 36rem;
}

.yyc-notice > :first-child { margin-block-start: 0; }
.yyc-notice > :last-child { margin-block-end: 0; }

.yyc-notice--error {
	border-color: var(--yyc-error);
	color: var(--yyc-error);
}

/* Im Formular kein Kasten im Kasten: die Meldung steht als Kopf des Formulars über einer Haarlinie. */
.yyc-form > .yyc-notice {
	border: 0;
	border-block-end: 1px solid var(--yyc-line);
	background: none;
	padding: 0 0 var(--wp--preset--spacing--50);
	max-width: none;
}

.yyc-notice:focus { outline: none; }
.yyc-notice:focus-visible { outline: 2px solid var(--yyc-focus); outline-offset: 4px; }

.yyc-notice__title {
	font-family: var(--yyc-headline);
	font-size: var(--wp--preset--font-size--xl);
	font-weight: 500;
	line-height: 1.1;
	margin-block: 0 var(--wp--preset--spacing--20);
}

/* Sprungliste der Fehler: jede Zeile führt zum Feld */
.yyc-notice .yyc-notice__liste {
	list-style: none;
	margin: var(--wp--preset--spacing--30) 0 0;
	padding: 0;
	font-size: var(--wp--preset--font-size--sm);
}

.yyc-notice .yyc-notice__liste li {
	margin: 0;
	padding-block: var(--wp--preset--spacing--20);
	border-top: 1px solid color-mix(in srgb, var(--yyc-error) 25%, transparent);
}

.yyc-notice__liste a {
	color: inherit;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
}

/* ---------------------------------------------------------------
   Beitragsliste
   --------------------------------------------------------------- */
.yyc-posts .wp-block-post-template {
	list-style: none;
	padding: 0;
	margin: 0;
	max-width: none;
	border-bottom: 1px solid var(--fl-line);
}

.yyc-posts .wp-block-post {
	border-top: 1px solid var(--fl-line);
	padding-block: var(--wp--preset--spacing--50);
	margin: 0;
}

.yyc-posts .wp-block-post > * {
	margin-block: 0;
}

.yyc-posts .wp-block-post-title {
	max-width: 26ch;
	font-size: var(--wp--preset--font-size--2-xl);
	font-weight: 500;
	line-height: 1.08;
	margin-block: var(--wp--preset--spacing--10) var(--wp--preset--spacing--30);
}

.yyc-posts .wp-block-post-title a {
	color: var(--yyc-ink);
	text-decoration-color: transparent;
}

.yyc-posts .wp-block-post-title a:hover {
	color: var(--yyc-abendblau);
	text-decoration-color: currentColor;
	text-decoration-thickness: 1px;
}

.yyc-posts .wp-block-post-excerpt__excerpt {
	margin: 0;
	max-width: var(--yyc-measure);
}

.yyc-posts__meta > * + *::before {
	content: "·";
	margin-inline-end: var(--wp--preset--spacing--20);
}

.yyc-posts__meta {
	gap: var(--wp--preset--spacing--20);
	color: var(--yyc-muted);
	font-size: var(--wp--preset--font-size--sm);
}

@media (min-width: 960px) {
	.yyc-posts .wp-block-post {
		display: grid;
		grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
		column-gap: var(--wp--preset--spacing--50);
		align-items: baseline;
	}

	.yyc-posts .wp-block-post > :not(.yyc-posts__meta) {
		grid-column: 2;
	}

	.yyc-posts .yyc-posts__meta {
		grid-column: 1;
		grid-row: 1 / span 3;
	}

	.yyc-posts .wp-block-post-title {
		margin-block-start: 0;
	}
}

.wp-block-query-pagination {
	margin-block-start: var(--wp--preset--spacing--60);
	font-variant-numeric: tabular-nums;
}

.wp-block-query-pagination a,
.wp-block-query-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	min-height: 3rem;
	min-width: 2rem;
	justify-content: center;
}

/* ---------------------------------------------------------------
   Beitrag und Rechtstext — Lesespalte
   --------------------------------------------------------------- */
.yyc-article__head {
	margin-block-start: clamp(2rem, 1rem + 4vw, 4rem);
}

.yyc-article__head .wp-block-post-title {
	max-width: 20ch;
	margin-block: 0 var(--wp--preset--spacing--50);
	color: var(--yyc-ink);
}

.yyc-article__meta {
	gap: var(--wp--preset--spacing--20);
	color: var(--yyc-muted);
	font-size: var(--wp--preset--font-size--sm);
}

.yyc-article .wp-block-post-featured-image {
	margin-block: var(--wp--preset--spacing--70) 0;
}

.yyc-article .wp-block-post-featured-image img {
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.yyc-article .wp-block-post-content {
	margin-block-start: var(--wp--preset--spacing--70);
}

.yyc-article .wp-block-post-content > :where(h2),
.yyc-legal .wp-block-post-content > :where(h2) {
	margin-block: var(--wp--preset--spacing--80) var(--wp--preset--spacing--40);
}

.yyc-article .wp-block-post-content > :where(h3),
.yyc-legal .wp-block-post-content > :where(h3) {
	margin-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--30);
}

.yyc-legal .wp-block-post-content {
	margin-block-start: clamp(2rem, 1rem + 4vw, 4rem);
}

.yyc-legal .wp-block-post-content > :where(h2) {
	font-size: var(--wp--preset--font-size--xl);
}

.yyc-legal .wp-block-post-content > :where(h3) {
	font-size: var(--wp--preset--font-size--lg);
}

.yyc-legal .wp-block-post-content > h1 {
	font-size: var(--wp--preset--font-size--3-xl);
}

.wp-block-post-content :where(ul, ol) {
	padding-inline-start: 1.25em;
}

.wp-block-post-content :where(li) {
	margin-block: var(--wp--preset--spacing--20);
}

.wp-block-post-content :where(li)::marker {
	color: var(--fl-knoten);
}

.wp-block-table :where(th, td) {
	border: 0;
	border-bottom: 1px solid var(--fl-line);
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40) var(--wp--preset--spacing--30) 0;
	text-align: start;
	vertical-align: top;
	font-variant-numeric: tabular-nums;
}

.wp-block-table thead {
	border-bottom: 1px solid var(--fl-line-lit);
}

.wp-block-table th {
	font-weight: 700;
	font-size: var(--wp--preset--font-size--sm);
}

/* ---------------------------------------------------------------
   Footer — Tiefe
   --------------------------------------------------------------- */
.yyc-footer {
	margin-block-start: 0;
	padding-block: var(--wp--preset--spacing--90) var(--wp--preset--spacing--60);
	font-family: var(--yyc-ui);
	font-size: var(--wp--preset--font-size--sm);
}

.yyc-footer__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wp--preset--spacing--60) var(--wp--preset--spacing--50);
}

.yyc-footer__grid > * {
	margin-block: 0;
}

@media (min-width: 600px) {
	.yyc-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 960px) {
	.yyc-footer__grid { grid-template-columns: minmax(0, 4fr) repeat(3, minmax(0, 2.66fr)); }
}

.yyc-footer__wordmark {
	font-family: var(--yyc-headline);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 600;
	letter-spacing: 0.22em;
	line-height: 1.2;
	text-transform: uppercase;
	margin-block: 0 var(--wp--preset--spacing--40);
}

.yyc-footer__brand p {
	margin-block: 0 var(--wp--preset--spacing--20);
	max-width: 34ch;
}

.yyc-footer__brand p:not(.yyc-footer__wordmark) {
	color: var(--fl-soft);
}

.yyc-footer__col > h2 {
	font-family: var(--yyc-ui);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--fl-soft);
	margin-block: 0 var(--wp--preset--spacing--30);
}

.yyc-footer .wp-block-navigation {
	font-size: var(--wp--preset--font-size--sm);
}

.yyc-footer .wp-block-navigation .wp-block-navigation__container {
	gap: 0;
}

.yyc-footer .wp-block-navigation .wp-block-navigation-item__content,
.yyc-footer .wp-block-navigation .wp-block-pages-list__item__link {
	color: var(--fl-text);
	display: inline-flex;
	align-items: center;
	min-height: 3rem;
	text-decoration: underline;
	text-decoration-color: transparent;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.3em;
}

.yyc-footer .wp-block-navigation .wp-block-navigation-item__content:hover {
	color: var(--fl-link);
	text-decoration-color: currentColor;
}

.yyc-footer__note {
	border-top: 1px solid var(--fl-line);
	margin-block-start: var(--wp--preset--spacing--70);
	padding-block-start: var(--wp--preset--spacing--50);
	gap: var(--wp--preset--spacing--30) var(--wp--preset--spacing--50);
	color: var(--fl-soft);
}

.yyc-footer__note p {
	margin: 0;
	max-width: none;
}

.yyc-footer__note a {
	display: inline-block;
	padding-block: 0.75rem;
}

/* ---------------------------------------------------------------
   404 und Suche
   --------------------------------------------------------------- */
.yyc-plain {
	margin-block-start: clamp(2.5rem, 1.2rem + 5vw, 5rem);
}

/* ---------------------------------------------------------------
   Bewegung aus, wenn gewünscht: alles steht still im Endzustand
   --------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }

	/* Keine Bewegung: Pfeil und Knopf bleiben stehen; Farbwechsel beim Zeigen bleiben als Rückmeldung */
	.yyc-weiter:hover::after,
	.yyc-weiter:hover .yyc-weiter__ende::after,
	.yyc-cards__item--ganz:has(.yyc-cards__weg > a:hover) .yyc-weiter__ende::after,
	.yyc-cards__item--ganz:has(.yyc-cards__weg > a:hover) .yyc-weiter::after,
	.wp-block-button__link:active,
	.yyc-form button[type="submit"]:active {
		transform: none;
	}

	/* Nur Einblenden: der Auftritt erscheint in 300 ms, ohne Weg */
	.home .yyc-hero__text,
	.home .yyc-hero .wp-block-image {
		animation: yyc-einziehen 300ms ease-out both;
	}
}

@media print {
	.yyc-header__actions,
	.yyc-header .wp-block-navigation,
	.yyc-footer .wp-block-navigation { display: none; }

	:where([class*="is-style-flaeche-"], .yyc-night) { border-image: none; color: inherit; }
}