/* Christoph 17 – Stile der Seitenvorlagen (templates/). Nur Rollen-Variablen aus tokens.css verwenden. */

/* Hauptbereich direkt unter dem Kopf, Abschnitte ohne Blockabstand dazwischen */
.wp-site-blocks > main.c17-haupt, main.c17-haupt { margin-block-start: 0; }
main.c17-haupt > * { margin-block: 0; }

/* Inhalt von Standardseite, Rechtstext, interner Bereich, Beitrag, Suche, 404 */
.c17-seiteninhalt { padding-block: var(--c17-space-64) var(--c17-space-96); }
@media (max-width: 820px) { .c17-seiteninhalt { padding-block: var(--c17-space-48) var(--c17-space-64); } }
.c17-seitenkopf .c17-seitenkopf__titel { margin: 0; }

/* Einzelbeitrag (News und Instagram, E84): flaches Band, Kennung/Datum und Überschrift mittig */
.c17-seitenkopf.c17-seitenkopf--beitrag { padding-block: var(--c17-space-24); }
.c17-seitenkopf--beitrag .c17-seitenkopf__innen { align-items: center; text-align: center; gap: 10px; }
.c17-seitenkopf--beitrag .c17-beitrag__meta { justify-content: center; }
.c17-seitenkopf--beitrag .c17-seitenkopf__titel { font-size: clamp(28px, 3vw, 40px); line-height: 1.02; max-width: 1100px; text-wrap: balance; }
.c17-seiteninhalt.c17-beitrag { padding-top: var(--c17-space-32); }
@media (max-width: 820px) {
	.c17-seitenkopf.c17-seitenkopf--beitrag { padding-block: 18px 20px; }
	.c17-seiteninhalt.c17-beitrag { padding-top: 0; }
}

/* Rechtstext: ruhige Zwischenüberschriften */
.c17-rechtstext :where(h2) { font-size: var(--wp--preset--font-size--x-large); margin-top: var(--c17-space-48); }
.c17-rechtstext :where(h3) { font-family: var(--wp--preset--font-family--barlow); font-size: var(--c17-h4-size); font-weight: 600; text-transform: none; letter-spacing: normal; margin-top: var(--c17-space-32); }


/* ---------- Beitragsübersicht (News, Archiv) ---------- */
.c17-abschnitt--liste { padding-block: var(--c17-space-48) var(--c17-space-96); }
.c17-newsraster { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 20px; list-style: none; margin: 0; padding: 0; }
.c17-newsraster > li { margin: 0; }
.c17-newskarte { display: flex; flex-direction: column; height: 100%; background: var(--c17-surface-raised); border: 1px solid var(--c17-line); }
.c17-newskarte .c17-newskarte__bild { margin: 0; }
.c17-newskarte__bild img { display: block; width: 100%; object-fit: cover; }
.c17-newskarte__text { padding: 20px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.wp-block-group:is(.c17-newskarte, .c17-newskarte__text, .c17-newskarte__meta, .c17-beitrag__meta) > * { margin-block: 0; }
.c17-newskarte__meta, .c17-beitrag__meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.c17-art {
	padding: 3px 8px; font-family: var(--wp--preset--font-family--ibm-plex-mono); font-size: 12px; font-weight: 500;
	letter-spacing: .12em; text-transform: uppercase; line-height: 1.3;
}
.c17-art.c17-art--news { background: var(--c17-brand); color: var(--c17-on-brand); }
.c17-art.c17-art--insta { background: var(--c17-info); color: var(--c17-on-info); }
:is(.c17-newskarte__datum, .c17-beitrag__datum) { font-family: var(--wp--preset--font-family--ibm-plex-mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--c17-text-muted); }
.c17-beitrag__datum { color: var(--c17-grau-300); }
.c17-newskarte .c17-newskarte__titel { font-size: 26px; line-height: 1.05; font-weight: 700; }
.c17-newskarte__titel a { color: inherit; text-decoration: none; }
.c17-newskarte__titel a:hover { color: var(--c17-accent-text); }
.c17-newskarte__auszug { display: flex; flex-direction: column; gap: 10px; flex: 1; }
.c17-newskarte__auszug .wp-block-post-excerpt__excerpt { margin: 0; font-size: 16px; color: var(--c17-text-muted); }
.c17-newskarte__auszug .wp-block-post-excerpt__more-text { margin: auto 0 0; font-weight: 600; }
/* Neuester Beitrag groß (nur Seite 1 und nur mit Bild) */
body:not(.paged) .c17-newsraster > li.type-post:first-child:has(.c17-newskarte__bild) { grid-column: span 2; }
body:not(.paged) .c17-newsraster > li.type-post:first-child .c17-newskarte:has(.c17-newskarte__bild) { flex-direction: row; }
body:not(.paged) .c17-newsraster > li.type-post:first-child .c17-newskarte__bild { width: 58%; flex: none; }
body:not(.paged) .c17-newsraster > li.type-post:first-child .c17-newskarte__bild img { height: 100% !important; aspect-ratio: auto !important; }
body:not(.paged) .c17-newsraster > li.type-post:first-child .c17-newskarte__titel { font-size: 36px; }
@media (max-width: 1000px) { .c17-newsraster { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 820px) {
	.c17-newsraster { grid-template-columns: 1fr; }
	body:not(.paged) .c17-newsraster > li.type-post:first-child:has(.c17-newskarte__bild) { grid-column: auto; }
	body:not(.paged) .c17-newsraster > li.type-post:first-child .c17-newskarte:has(.c17-newskarte__bild) { flex-direction: column; }
	body:not(.paged) .c17-newsraster > li.type-post:first-child .c17-newskarte__bild { width: 100%; }
	body:not(.paged) .c17-newsraster > li.type-post:first-child .c17-newskarte__bild img { aspect-ratio: 3 / 2 !important; height: auto !important; }
	body:not(.paged) .c17-newsraster > li.type-post:first-child .c17-newskarte__titel { font-size: 28px; }
}

/* Blättern */
.c17-blaettern { margin-top: var(--c17-space-48); gap: 8px; }
.c17-blaettern :is(a, .page-numbers) {
	min-width: 44px; min-height: 44px; display: inline-grid; place-items: center; padding: 0 12px; box-sizing: border-box;
	font-family: var(--wp--preset--font-family--ibm-plex-mono); font-weight: 500; text-decoration: none;
	border: 1px solid var(--c17-line); color: var(--c17-text);
}
.c17-blaettern .page-numbers.current { background: var(--c17-action); color: var(--c17-on-action); border-color: var(--c17-action); }
.c17-blaettern .page-numbers.dots { border: 0; }
.c17-blaettern a:hover { color: var(--c17-accent-text); }

/* ---------- Einzelbeitrag ---------- */
.c17-beitrag .c17-beitrag__bild { margin-bottom: var(--c17-space-48) !important; }
.c17-beitrag__bild img { width: 100%; object-fit: cover; }
.c17-zurueck { margin-top: var(--c17-space-48) !important; }

/* ---------- Suche und Treffer ---------- */
.c17-suche :is(.wp-block-search__input, .wp-block-search__button, .wp-block-search__inside-wrapper) { border-radius: 0; }
.c17-suche .wp-block-search__inside-wrapper { gap: 8px; border: 0; padding: 0; }
.c17-suche .wp-block-search__input {
	min-height: 44px; padding: 10px 12px; font: 400 17px/1.5 var(--wp--preset--font-family--barlow);
	color: var(--c17-text); background: var(--c17-surface-raised); border: 1px solid var(--c17-text-muted);
}
.c17-suche .wp-block-search__button {
	min-height: 44px; margin: 0; padding: 10px 22px; border: 0; cursor: pointer;
	background: var(--c17-action); color: var(--c17-on-action); font: 600 16px/1.2 var(--wp--preset--font-family--barlow);
}
.c17-suche .wp-block-search__button:hover { background: var(--c17-action-hover); }
.c17-treffer .wp-block-post-template { list-style: none; margin: 0; padding: 0; }
.c17-treffer__eintrag { padding-block: var(--c17-space-24); border-top: 1px solid var(--c17-line); }
.c17-treffer__eintrag > * { margin-block: 0 8px; }
.c17-treffer .c17-treffer__titel { font-size: 24px; }
.c17-treffer__titel a { color: inherit; text-decoration: none; }
.c17-treffer__titel a:hover { color: var(--c17-accent-text); }
.c17-treffer__auszug p { margin: 0; color: var(--c17-text-muted); }

/* ---------- Gästebuch ---------- */
.c17-abschnitt--gaestebuch { padding-block: var(--c17-space-64) var(--c17-space-96); }
.c17-gb { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: var(--c17-space-64); align-items: start; }
.wp-block-group:is(.c17-gb, .c17-gb__haupt) > * { margin-block: 0; }
.c17-gb__haupt { display: flex; flex-direction: column; }
.c17-gb__einleitung > :first-child { margin-top: 0; }
.c17-gb__einleitung .wp-block-quote { margin: 0; padding: var(--c17-space-8) 0 var(--c17-space-8) var(--c17-space-24); }
.c17-gb__einleitung .wp-block-quote p { font-size: 34px; line-height: 1.1; }
.c17-gb__einleitung .wp-block-quote cite { display: block; margin-top: var(--c17-space-12); font-family: var(--wp--preset--font-family--ibm-plex-mono); font-size: var(--c17-label-size); font-style: normal; letter-spacing: .12em; text-transform: uppercase; color: var(--c17-text-muted); }
.c17-gb .c17-gb__ueberschrift { margin: var(--c17-space-48) 0 var(--c17-space-16); }
.c17-gb__einleitung:empty + .c17-gb__ueberschrift { margin-top: 0; }

.c17-gb-liste { list-style: none; margin: 0; padding: 0; }
.c17-gb-eintrag { padding: var(--c17-space-32) 0; border-top: 1px solid var(--c17-line); display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: var(--c17-space-16); }
.c17-gb-eintrag:last-child { border-bottom: 1px solid var(--c17-line); }
.c17-gb-eintrag__initial {
	width: 56px; height: 56px; display: grid; place-items: center; background: var(--c17-surface);
	font-family: var(--wp--preset--font-family--barlow-condensed); font-weight: 800; font-size: 28px; color: var(--c17-text);
}
.c17-gb-eintrag__initial--antwort { background: var(--c17-brand); color: var(--c17-on-brand); }
.c17-gb-eintrag__kopf { display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: baseline; margin-bottom: var(--c17-space-8); }
.c17-gb-eintrag .c17-gb-eintrag__name { margin: 0; font-family: var(--wp--preset--font-family--barlow); font-size: var(--c17-h4-size); font-weight: 600; text-transform: none; letter-spacing: normal; }
.c17-gb-eintrag__meta { font-family: var(--wp--preset--font-family--ibm-plex-mono); font-size: 13px; color: var(--c17-text-muted); }
.c17-gb-eintrag__text p, .c17-gb-eintrag__antwort p { margin: 0; }
.c17-gb-eintrag__text p + p { margin-top: var(--c17-space-8); }
.c17-gb-eintrag__antwort {
	margin-top: var(--c17-space-16); background: var(--c17-surface); padding: var(--c17-space-16) var(--c17-space-16) var(--c17-space-16) 20px;
	border-left: 2px solid var(--c17-brand); font-size: var(--c17-small-size); display: flex; flex-direction: column; gap: 4px;
}
.c17-gb-leer { color: var(--c17-text-muted); }
.c17-gb-blaettern { display: flex; flex-wrap: wrap; margin-top: var(--c17-space-32); }

.c17-gb-seitenspalte { position: sticky; top: calc(var(--c17-kopf-h) + var(--wp-admin--admin-bar--height, 0px) + var(--c17-space-24)); display: flex; flex-direction: column; gap: var(--c17-space-24); }
.c17-gb-karte { background: var(--c17-surface); padding: 28px; display: flex; flex-direction: column; gap: var(--c17-space-16); border-top: var(--c17-accent-line) solid var(--c17-brand); }
.c17-gb-karte p { margin: 0; }
.c17-gb-karte .c17-gb-karte__titel { margin: 0; font-size: var(--wp--preset--font-size--x-large); line-height: 1.1; font-weight: 800; }
.c17-gb-feld { display: flex; flex-direction: column; gap: 6px; }
.c17-gb-feld label { font-weight: 600; font-size: 15px; }
.c17-gb-optional { font-weight: 400; color: var(--c17-text-muted); }
.c17-gb-hinweistext { font-size: 14px; line-height: 1.45; color: var(--c17-text-muted); }
.c17-gb-feld :is(input, textarea) {
	font: 400 17px/1.5 var(--wp--preset--font-family--barlow); color: var(--c17-text); background: var(--c17-surface-raised);
	border: 1px solid var(--c17-grau-500); border-radius: 0; padding: 10px 12px; min-height: 44px; width: 100%; box-sizing: border-box;
}
.c17-gb-feld textarea { min-height: 160px; resize: vertical; }
.c17-gb-feld :is(input, textarea):focus-visible { outline-offset: 0; border-color: var(--c17-focus); }
.c17-gb-feld [aria-invalid="true"] { border: 2px solid var(--c17-danger-text); }
.c17-gb-haken { display: grid; grid-template-columns: 24px 1fr; gap: 10px; align-items: start; font-size: 15px; line-height: 1.45; }
.c17-gb-haken input { width: 22px; height: 22px; margin: 1px 0 0; accent-color: var(--c17-brand); }
.c17-gb-knopf {
	display: inline-flex; align-items: center; justify-content: center; align-self: flex-start; min-height: 44px; padding: 12px 22px;
	font: 600 16px/1.2 var(--wp--preset--font-family--barlow); border: 2px solid transparent; border-radius: 0; cursor: pointer;
	background: var(--c17-action); color: var(--c17-on-action); text-decoration: none;
}
.c17-gb-knopf:hover { background: var(--c17-action-hover); color: var(--c17-on-action); }
.c17-gb-knopf--umriss { background: transparent; color: var(--c17-text); border-color: currentColor; }
.c17-gb-knopf--umriss:hover { background: transparent; color: var(--c17-accent-text); }
.c17-gb-erfolg { display: flex; gap: 10px; align-items: center; align-self: flex-start; background: var(--c17-success); color: var(--c17-on-success); padding: 10px 14px; font-weight: 600; }
.c17-gb-erfolg svg { width: 20px; height: 20px; flex: none; }
.c17-gb-meldung { background: var(--c17-danger); color: var(--c17-on-danger); padding: 12px 16px; font-size: 15px; }
.c17-gb-meldung p, .c17-gb-meldung ul { margin: 0; }
.c17-gb-meldung ul { padding-left: 20px; }
/* Fallenfeld für Bots: für Menschen unsichtbar */
.c17-gb-falle { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.c17-gb-schritte .c17-label { color: var(--c17-text); }
.c17-gb-schritte { background: var(--c17-tint); box-shadow: inset 0 0 0 2px var(--c17-tint-line); padding: 22px 24px; display: flex; flex-direction: column; gap: 12px; }
.c17-gb-schritte ol { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; counter-reset: c17-schritt; }
.c17-gb-schritte li { display: grid; grid-template-columns: 28px 1fr; gap: 10px; align-items: baseline; font-size: 15px; line-height: 1.45; counter-increment: c17-schritt; }
.c17-gb-schritte li::before { content: counter(c17-schritt); font-family: var(--wp--preset--font-family--barlow-condensed); font-weight: 800; font-size: 24px; line-height: 1; color: var(--c17-accent-text); }
@media (max-width: 1000px) {
	.c17-gb { grid-template-columns: 1fr; gap: var(--c17-space-48); }
	.c17-gb-seitenspalte { position: static; }
}
@media (max-width: 820px) {
	.c17-abschnitt--gaestebuch { padding-block: var(--c17-space-48) var(--c17-space-64); }
	.c17-gb__einleitung .wp-block-quote p { font-size: 26px; }
	.c17-gb-eintrag { grid-template-columns: 1fr; }
	.c17-gb-eintrag__initial { display: none; }
	.c17-gb-karte { padding: 20px; }
}
/* Sprungziele nicht unter dem festen Kopfbereich verstecken */
:is(#gaestebuch-formular, #eintraege, .c17-gb-eintrag) { scroll-margin-top: calc(var(--c17-kopf-h) + var(--wp-admin--admin-bar--height, 0px) + var(--c17-space-24)); }

/* ---------- Instagram (AP5, Mockup E33) ---------- */
.c17-newsfilter { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 var(--c17-space-32); }
.c17-newsfilter a { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 16px; background: var(--c17-surface); color: var(--c17-text); font-weight: 600; font-size: 15px; line-height: 1.2; text-decoration: none; }
.c17-newsfilter a:hover:not([aria-current]) { color: var(--c17-accent-text); }
.c17-newsfilter a[aria-current="page"] { background: var(--c17-brand); color: var(--c17-on-brand); }
.c17-newsraster > li.type-c17_instagram .c17-newskarte__bild img { aspect-ratio: 4 / 5 !important; }
.c17-newsraster > li.type-c17_instagram .c17-newskarte__auszug .wp-block-post-excerpt__excerpt { color: var(--c17-text); }
.c17-newskarte__bild, .c17-ig-beitrag__video { position: relative; }
.c17-ig-abspielen { position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; margin: -32px 0 0 -32px; background: rgba(14, 22, 30, .75); border-radius: 50%; pointer-events: none; }
.c17-ig-abspielen::after { content: ""; position: absolute; left: 26px; top: 20px; border-style: solid; border-width: 12px 0 12px 20px; border-color: transparent transparent transparent #fff; }
/* Bild so hoch, dass es samt Leiste ohne Scrollen sichtbar ist; höchstens 520 px breit, Inhalt höchstens 1100 px (E84) */
.c17-ig-beitrag {
	--c17-ig-h: clamp(240px, calc(100dvh - var(--c17-kopf-h) - 250px), 650px);
	display: grid; grid-template-columns: min(520px, calc(var(--c17-ig-h) * var(--c17-ig-format, .8))) minmax(0, 1fr);
	gap: var(--c17-space-48); align-items: start; max-width: 1100px !important; margin-inline: auto !important;
}
.c17-ig-beitrag__medien { display: grid; gap: 12px; }
.c17-ig-beitrag ~ .alignwide { max-width: 1100px !important; margin-inline: auto !important; }
.c17-ig-beitrag__figur { margin: 0; }
.c17-ig-beitrag__bild { display: block; width: 100%; height: auto; }
/* Einzelbild: sehr hohe Vorschaubilder (Reels 9:16) auf 4:5 zuschneiden, damit das Bild auf den Bildschirm passt */
.c17-ig-beitrag__medien--eins .c17-ig-beitrag__bild { aspect-ratio: var(--c17-ig-format, .8); object-fit: cover; }
.c17-ig-beitrag__video { display: block; }
.c17-ig-beitrag__text { font-size: 18px; overflow-wrap: anywhere; }
.c17-ig-beitrag__text > p { margin: 0 0 1em; }
/* Knopf „Auf Instagram“ in der Leiste unter dem Bild (E85) */
.c17-ig-beitrag__leiste { display: flex; justify-content: flex-end; }
.c17-galerie__zusatz { display: flex; margin-top: var(--c17-space-12); justify-content: flex-end; }
.c17-galerie.ist-aktiv .c17-galerie__zusatz { margin: 0; }
.c17-galerie__leiste { flex-wrap: wrap; }
/* Schmale Galerie (z. B. Querformat auf niedrigem Bildschirm): Punkte weglassen, Zähler genügt – Leiste bleibt einzeilig */
.c17-galerie { container-type: inline-size; }
@container (max-width: 380px) { .c17-galerie .c17-galerie__leiste .c17-galerie__punkte { display: none; } }
.c17-ig-beitrag__knopf {
	display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px; white-space: nowrap;
	background: var(--c17-action); color: var(--c17-on-action); font-weight: 600; font-size: 15px; text-decoration: none;
}
.c17-ig-beitrag__knopf:hover { background: var(--c17-action-hover); color: var(--c17-on-action); }
/* Querformat: Bild oben mittig, Text darunter in Lesebreite; am Laptop bleiben die ersten Textzeilen sichtbar (E85) */
.c17-ig-beitrag.c17-ig-beitrag--quer {
	--c17-ig-hq: clamp(180px, calc(100dvh - var(--c17-kopf-h) - 300px), 700px);
	grid-template-columns: minmax(0, 1fr); gap: 22px;
}
.c17-ig-beitrag--quer .c17-ig-beitrag__medien { width: min(100%, calc(var(--c17-ig-hq) * var(--c17-ig-format))); margin-inline: auto; }
.c17-ig-beitrag--quer .c17-ig-beitrag__text { width: min(100%, 720px); margin-inline: auto; font-size: 17px; }
@media (max-width: 820px) {
	.c17-ig-beitrag { grid-template-columns: minmax(0, 1fr); gap: var(--c17-space-24); margin-inline: calc(-1 * var(--c17-gutter, 16px)) !important; }
	.c17-ig-beitrag__text, .c17-ig-beitrag__medien .c17-galerie__leiste { padding-inline: var(--c17-gutter, 16px); }
	.c17-ig-beitrag__text { font-size: 17px; }
	.c17-ig-beitrag--quer .c17-ig-beitrag__medien { width: 100%; }
	.c17-ig-beitrag__leiste, .c17-ig-beitrag__medien > .c17-galerie > .c17-galerie__zusatz { padding-inline: var(--c17-gutter, 16px); }
}

/* Bildergalerie (Karussell) – inc/galerie.php, assets/js/galerie.js */
.c17-galerie { --c17-galerie-format: 1.333; margin-block: var(--c17-space-32); }
.c17-ig-beitrag__medien .c17-galerie { margin: 0; }
.c17-galerie__buehne { position: relative; }
.c17-galerie__spur { display: flex; margin: 0; padding: 0; list-style: none; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: thin; }
.c17-galerie__folie { position: relative; flex: 0 0 100%; margin: 0; scroll-snap-align: start; scroll-snap-stop: always; }
.c17-galerie__folie > * { margin: 0; }
.c17-galerie__folie img { display: block; width: 100%; height: auto; }
/* Mit Skript: einheitliches Format, Bilder eingepasst statt beschnitten, Leiste ohne Scrollbalken. */
.c17-galerie.ist-aktiv .c17-galerie__spur { scrollbar-width: none; background: var(--c17-surface); }
.c17-galerie.ist-aktiv .c17-galerie__spur::-webkit-scrollbar { display: none; }
.c17-galerie.ist-aktiv .c17-galerie__folie { aspect-ratio: var(--c17-galerie-format); }
.c17-galerie.ist-aktiv .c17-galerie__folie > :is(figure, a) { height: 100%; }
.c17-galerie.ist-aktiv .c17-galerie__folie :is(figure, a) { display: block; position: relative; height: 100%; }
.c17-galerie.ist-aktiv .c17-galerie__folie img { width: 100%; height: 100%; object-fit: contain; }
.c17-galerie.ist-aktiv .c17-galerie__folie figcaption { position: absolute; left: 0; right: 0; bottom: 0; margin: 0; padding: 8px 12px; background: rgba(14, 22, 30, .75); color: #fff; font-size: 15px; }
.c17-galerie__folie.ist-vergroesserbar img { cursor: zoom-in; }
.c17-galerie__pfeil, .c17-galerie__gross { position: absolute; z-index: 1; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: var(--c17-radius); background: rgba(14, 22, 30, .75); color: #fff; cursor: pointer; }
.c17-galerie__pfeil { top: 50%; margin-top: -22px; }
.c17-galerie__pfeil--zurueck { left: 12px; }
.c17-galerie__pfeil--weiter { right: 12px; }
.c17-galerie__gross { top: 12px; right: 12px; }
.c17-galerie__pfeil:hover, .c17-galerie__gross:hover { background: var(--c17-orange-50); color: var(--c17-nacht); }
.c17-galerie__leiste { display: flex; align-items: center; gap: var(--c17-space-12); margin-top: var(--c17-space-12); }
.c17-galerie__spiel { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--c17-line); border-radius: var(--c17-radius); background: transparent; color: var(--c17-text); cursor: pointer; }
.c17-galerie__spiel svg { width: 18px; height: 18px; }
.c17-galerie__spiel:hover { border-color: var(--c17-accent-text); color: var(--c17-accent-text); }
.c17-galerie__punkte { display: flex; flex-wrap: wrap; gap: 0; flex: 1; }
.c17-galerie__punkt { width: 28px; height: 44px; padding: 0; border: 0; background: transparent; cursor: pointer; position: relative; }
.c17-galerie__punkt::before { content: ""; position: absolute; left: 4px; right: 4px; top: 20px; height: 4px; background: var(--c17-line); }
.c17-galerie__punkt[aria-current="true"]::before { background: var(--c17-orange-50); }
.c17-galerie__punkt:hover::before { background: var(--c17-text-muted); }
.c17-galerie__zaehler { margin: 0 0 0 auto; font-family: var(--wp--preset--font-family--ibm-plex-mono); font-size: 13px; letter-spacing: .08em; color: var(--c17-text-muted); }
.c17-galerie__unterschrift { margin: var(--c17-space-8) 0 0; font-size: 15px; color: var(--c17-text-muted); }
@media (max-width: 600px) {
	.c17-galerie__pfeil { width: 40px; height: 40px; margin-top: -20px; }
	.c17-galerie__pfeil--zurueck { left: 6px; }
	.c17-galerie__pfeil--weiter { right: 6px; }
}

/* Großansicht */
.c17-grossbild-offen { overflow: hidden; }
.c17-grossbild { width: 100vw; height: 100vh; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: rgba(7, 12, 17, .95); color: #fff; }
.c17-grossbild::backdrop { background: rgba(7, 12, 17, .6); }
.c17-grossbild[open] { display: grid; place-items: center; }
.c17-grossbild__figur { display: grid; place-items: center; width: 100%; height: 100%; margin: 0; padding: 64px 72px 72px; box-sizing: border-box; }
.c17-grossbild__bild { max-width: 100%; max-height: calc(100dvh - 160px); width: auto; height: auto; object-fit: contain; }
.c17-grossbild__text { margin-top: 12px; max-width: 70ch; text-align: center; font-size: 15px; color: #d5dade; }
.c17-grossbild__zaehler { position: absolute; left: 16px; top: 16px; margin: 0; line-height: 44px; font-family: var(--wp--preset--font-family--ibm-plex-mono); font-size: 13px; letter-spacing: .08em; color: #d5dade; }
.c17-grossbild__zu, .c17-grossbild__pfeil { position: absolute; display: grid; place-items: center; width: 48px; height: 48px; padding: 0; border: 0; border-radius: var(--c17-radius); background: rgba(255, 255, 255, .12); color: #fff; cursor: pointer; }
.c17-grossbild__zu { top: 12px; right: 12px; }
.c17-grossbild__pfeil { top: 50%; margin-top: -24px; }
.c17-grossbild__pfeil--zurueck { left: 12px; }
.c17-grossbild__pfeil--weiter { right: 12px; }
.c17-grossbild__zu:hover, .c17-grossbild__pfeil:hover { background: var(--c17-orange-50); color: var(--c17-nacht); }
.c17-grossbild.ist-einzeln :is(.c17-grossbild__pfeil, .c17-grossbild__zaehler) { display: none; }
@media (max-width: 600px) {
	.c17-grossbild__figur { padding: 64px 8px 80px; }
	.c17-grossbild__pfeil { top: auto; bottom: 16px; margin: 0; }
}

/* Kontaktformular (E87) */
.c17-kontakt { max-width: 720px; }
.c17-kontakt__datenschutz { margin: 0; }