/* =========================================================
 * SEMINARE — Rubrik „Tierisch gut informiert“
 * Body-Klassen: tgt-seminare (Übersicht), tgt-seminar-detail (je Seminar)
 *
 * Eigenes Stylesheet: functions.php (tgt_sem_enqueue_styles) lädt es nur,
 * wo Seminar-Bausteine stehen. Bausteine und Verhalten: inc/seminare.php,
 * assets/js/seminare.js.
 *
 * Signatur: die TERMIN-SCHEIBE — das Kreis-Badge der CI, nur mit dem Datum
 * statt des Tier-Icons. Durchgezogen = Termin steht, gestrichelt = Termin
 * folgt. Dazu: freie Plätze als Kreise.
 *
 * Nutzt nur vorhandene Tokens, .tgt-disc/.tgt-glyph (Kontakt-Abschnitt in
 * blocks.css), .tgt-form-panel (Kontakt), .tgt-akkordeon (Über mich),
 * .tgt-karten-reihe/.tgt-info-karte und .tgt-detail-cta.
 * ========================================================= */

/* Neue Glyphen — gleiches Maskenverfahren wie im Kontakt-Abschnitt von blocks.css */
.tgt-glyph--aid{--g:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%222%22%20y%3D%227%22%20width%3D%2220%22%20height%3D%2214%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M16%207V5a2%202%200%200%200-2-2h-4a2%202%200%200%200-2%202v2%22%2F%3E%3Cpath%20d%3D%22M12%2011v6%22%2F%3E%3Cpath%20d%3D%22M9%2014h6%22%2F%3E%3C%2Fsvg%3E")}
.tgt-glyph--steth{--g:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M11%202v2%22%2F%3E%3Cpath%20d%3D%22M5%202v2%22%2F%3E%3Cpath%20d%3D%22M5%203H4a2%202%200%200%200-2%202v4a6%206%200%200%200%2012%200V5a2%202%200%200%200-2-2h-1%22%2F%3E%3Cpath%20d%3D%22M8%2015a6%206%200%200%200%2012%200v-3%22%2F%3E%3Ccircle%20cx%3D%2220%22%20cy%3D%2210%22%20r%3D%222%22%2F%3E%3C%2Fsvg%3E")}
.tgt-glyph--dumbbell{--g:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M6.5%206.5v11%22%2F%3E%3Cpath%20d%3D%22M17.5%206.5v11%22%2F%3E%3Cpath%20d%3D%22M3%209v6%22%2F%3E%3Cpath%20d%3D%22M21%209v6%22%2F%3E%3Cpath%20d%3D%22M6.5%2012h11%22%2F%3E%3C%2Fsvg%3E")}
.tgt-glyph--calendar{--g:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2218%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M16%202v4%22%2F%3E%3Cpath%20d%3D%22M8%202v4%22%2F%3E%3Cpath%20d%3D%22M3%2010h18%22%2F%3E%3C%2Fsvg%3E")}
.tgt-glyph--users{--g:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M16%2021v-2a4%204%200%200%200-4-4H6a4%204%200%200%200-4%204v2%22%2F%3E%3Ccircle%20cx%3D%229%22%20cy%3D%227%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22M22%2021v-2a4%204%200%200%200-3-3.87%22%2F%3E%3Cpath%20d%3D%22M16%203.13a4%204%200%200%201%200%207.75%22%2F%3E%3C%2Fsvg%3E")}
.tgt-glyph--euro{--g:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M4%2010h12%22%2F%3E%3Cpath%20d%3D%22M4%2014h9%22%2F%3E%3Cpath%20d%3D%22M19%206a7.7%207.7%200%200%200-5.2-2A7.9%207.9%200%200%200%206%2012c0%204.4%203.5%208%207.8%208%202%200%203.8-.8%205.2-2%22%2F%3E%3C%2Fsvg%3E")}
.tgt-glyph--bell{--g:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M6%208a6%206%200%200%201%2012%200c0%207%203%209%203%209H3s3-2%203-9%22%2F%3E%3Cpath%20d%3D%22M10.3%2021a1.94%201.94%200%200%200%203.4%200%22%2F%3E%3C%2Fsvg%3E")}
.tgt-glyph--cap{--g:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M21.42%2010.922a1%201%200%200%200-.019-1.838L12.83%205.18a2%202%200%200%200-1.66%200L2.6%209.08a1%201%200%200%200%200%201.832l8.57%203.908a2%202%200%200%200%201.66%200z%22%2F%3E%3Cpath%20d%3D%22M22%2010v6%22%2F%3E%3Cpath%20d%3D%22M6%2012.5V16a6%203%200%200%200%2012%200v-3.5%22%2F%3E%3C%2Fsvg%3E")}
.tgt-glyph--check{--g:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M20%206%209%2017l-5-5%22%2F%3E%3C%2Fsvg%3E")}
.tgt-glyph--plus{--g:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M5%2012h14%22%2F%3E%3Cpath%20d%3D%22M12%205v14%22%2F%3E%3C%2Fsvg%3E")}
.tgt-glyph--minus{--g:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M5%2012h14%22%2F%3E%3C%2Fsvg%3E")}
.tgt-glyph--arrow{--g:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M5%2012h14%22%2F%3E%3Cpath%20d%3D%22m12%205%207%207-7%207%22%2F%3E%3C%2Fsvg%3E")}
.tgt-glyph--info{--g:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22%2F%3E%3Cpath%20d%3D%22M12%2016v-4%22%2F%3E%3Cpath%20d%3D%22M12%208h.01%22%2F%3E%3C%2Fsvg%3E")}

/* Maske mit flexiblerem Format: .tgt-disc--gross für Themen-Karten */
.tgt-disc--gross { --disc: 72px; }
.tgt-disc--gross .tgt-glyph { width: 46%; height: 46%; }

/* ---------- TERMIN-SCHEIBE ---------- */

.tgt-termin-scheibe {
	--ts: 88px;
	flex: none;
	box-sizing: border-box;
	width: var(--ts);
	height: var(--ts);
	border-radius: 50%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2px;
	background: #fff;
	border: 5px solid var(--tgt-teal);
	/* weisser Aussenring: hebt die Scheibe auch auf Himmelblau-Flaechen ab */
	box-shadow: 0 0 0 3px #fff, var(--tgt-elev-1);
	font-family: var(--tgt-font-display);
	font-weight: var(--tgt-fw-display);
	line-height: 1;
	text-align: center;
	color: var(--tgt-steel);
}

.tgt-termin-scheibe__tag,
.tgt-termin-scheibe__monat {
	font-size: 11px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--tgt-teal-deep);
	/* Der Laufweite-Ausgleich haelt die Buchstaben optisch mittig */
	padding-left: 0.12em;
}

.tgt-termin-scheibe__nr {
	font-size: 32px;
	letter-spacing: -0.02em;
}

.tgt-termin-scheibe--klein {
	--ts: 62px;
	border-width: 4px;
	gap: 1px;
	box-shadow: 0 0 0 2px #fff, var(--tgt-elev-1);
}

.tgt-termin-scheibe--klein .tgt-termin-scheibe__tag {
	display: none;
}

.tgt-termin-scheibe--klein .tgt-termin-scheibe__nr {
	font-size: 22px;
}

.tgt-termin-scheibe--klein .tgt-termin-scheibe__monat {
	font-size: 10px;
}

/* Termin folgt: gleiche Scheibe, nur gestrichelt und mit Glocke */
.tgt-termin-scheibe--offen {
	border-width: 3px;
	border-style: dashed;
	background: transparent;
	box-shadow: none;
	color: var(--tgt-teal-deep);
}

.tgt-termin-scheibe--offen .tgt-glyph {
	width: 38%;
	height: 38%;
}

/* ---------- FREIE PLAETZE (Kreise) ---------- */

.tgt-plaetze {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px 10px;
	margin: 0;
	font-size: var(--tgt-fs-caption);
	line-height: 1.4;
	color: var(--tgt-slate-soft);
}

.tgt-plaetze__dots {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 4px;
}

.tgt-plaetze__dots i {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--tgt-teal);
}

.tgt-plaetze__dots i.is-belegt {
	background: var(--tgt-line-strong);
}

.tgt-plaetze strong {
	color: var(--tgt-slate);
	font-weight: var(--tgt-fw-medium);
}

.tgt-plaetze--knapp strong {
	color: var(--tgt-teal-deep);
}

/* ---------- KLEINE BAUSTEINE ---------- */

/* Meta-Zeile: Uhrzeit, Ort, Preis */
.tgt-sem-meta {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
	font-size: var(--tgt-fs-body-sm);
	line-height: 1.4;
	color: var(--tgt-slate);
}

.tgt-sem-meta li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.tgt-sem-meta .tgt-glyph {
	width: 17px;
	height: 17px;
	color: var(--tgt-teal-deep);
}

.tgt-sem-meta--stapel {
	flex-direction: column;
	gap: 8px;
}

/* Text-Link ohne Button, z. B. „Details ansehen“ */
.tgt-sem-link {
	font-family: var(--tgt-font-display);
	font-weight: var(--tgt-fw-display);
	font-size: 15px;
	color: var(--tgt-steel);
	text-decoration: none;
	white-space: nowrap;
}

.tgt-sem-link::after {
	content: "\2192";
	display: inline-block;
	margin-left: 8px;
	transition: transform var(--tgt-dur-base) var(--tgt-ease-out);
}

.tgt-sem-link:hover,
.tgt-sem-link:focus-visible {
	color: var(--tgt-steel-deep);
	text-decoration: none;
}

.tgt-sem-link:hover::after,
.tgt-sem-link:focus-visible::after {
	transform: translateX(4px);
}

/* Status-Pille: Termin steht (gefuellt) / Termin auf Anfrage (gestrichelt) */
.tgt-sem-status {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 5px 12px;
	border-radius: var(--tgt-radius-pill);
	font-size: 12.5px;
	font-weight: var(--tgt-fw-medium);
	line-height: 1.2;
	white-space: nowrap;
}

.tgt-sem-status--termin {
	background: var(--tgt-steel-soft);
	color: var(--tgt-steel-deep);
}

.tgt-sem-status--termin::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--tgt-teal);
}

.tgt-sem-status--offen {
	border: 1.5px dashed var(--tgt-teal);
	color: var(--tgt-teal-deep);
}

/* Reihenname-Chips (Startseite, Querverweis): Scheibe + Titel */
.tgt-sem-chips {
	list-style: none;
	margin: var(--tgt-space-5) 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.tgt-sem-chips a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 6px 18px 6px 6px;
	background: #fff;
	border: 1px solid var(--tgt-line);
	border-radius: var(--tgt-radius-pill);
	box-shadow: var(--tgt-elev-1);
	font-size: 15px;
	font-weight: var(--tgt-fw-medium);
	color: var(--tgt-slate);
	text-decoration: none;
	transition: transform var(--tgt-dur-base) var(--tgt-ease-out),
	            border-color var(--tgt-dur-base) var(--tgt-ease-out),
	            box-shadow var(--tgt-dur-base) var(--tgt-ease-out);
}

.tgt-sem-chips a:hover,
.tgt-sem-chips a:focus-visible {
	transform: translateY(-2px);
	border-color: var(--tgt-teal);
	box-shadow: var(--tgt-elev-2);
	color: var(--tgt-steel);
	text-decoration: none;
}

.tgt-sem-chips .tgt-disc {
	--disc: 34px;
}

.tgt-sem-chips .tgt-disc::before {
	inset: 2px;
	border-width: 1.5px;
}

/* ---------- STARTSEITEN-STREIFEN ---------- */

.tgt-sem-streifen .tgt-sem-streifen__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	gap: clamp(28px, 5vw, 72px);
	align-items: center;
}

.tgt-sem-streifen__text > * {
	margin-block-start: 0;
}

.tgt-sem-streifen__text .tgt-kicker {
	margin-bottom: 10px;
}

.tgt-sem-streifen__text h2 {
	margin-bottom: var(--tgt-space-3);
}

.tgt-sem-streifen__text > p:not(.tgt-kicker) {
	color: var(--tgt-slate-soft);
	max-width: 46ch;
}

.tgt-sem-streifen__text .wp-block-buttons {
	margin-top: 0;
}

/* Das Ticket: weiss, mit gestricheltem Trenner zur Aktion */
.tgt-sem-ticket {
	background: #fff;
	border-radius: var(--tgt-radius-2xl);
	box-shadow: var(--tgt-elev-2);
	padding: clamp(22px, 3vw, 32px);
	display: grid;
	gap: 18px;
}

.tgt-sem-ticket > * {
	margin: 0;
}

.tgt-sem-ticket__kicker {
	font-size: var(--tgt-fs-kicker);
	font-weight: var(--tgt-fw-medium);
	letter-spacing: var(--tgt-ls-kicker);
	text-transform: uppercase;
	color: var(--tgt-teal-deep);
}

.tgt-sem-ticket__zeile {
	display: flex;
	align-items: center;
	gap: clamp(16px, 2.4vw, 24px);
}

.tgt-sem-ticket__info {
	min-width: 0;
}

.tgt-sem-ticket__info h3 {
	font-size: var(--tgt-fs-h3);
	margin: 0 0 8px;
}

.tgt-sem-ticket__info h3 a {
	color: var(--tgt-steel);
	text-decoration: none;
}

.tgt-sem-ticket__info p {
	margin: 0;
	color: var(--tgt-slate-soft);
	font-size: var(--tgt-fs-body-sm);
}

.tgt-sem-ticket__aktion {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px 24px;
	padding-top: 18px;
	border-top: 2px dashed var(--tgt-steel-soft);
}

.tgt-sem-ticket__aktion .wp-block-button {
	margin: 0;
}

.tgt-sem-ticket--offen {
	background: rgba(255, 255, 255, 0.7);
	box-shadow: none;
	border: 2px dashed var(--tgt-teal);
}

/* ---------- ÜBERSICHT: HERO ---------- */

.wp-block-group.tgt-sem-hero {
	background: var(--tgt-gradient-hero);
	border-bottom: 1px solid var(--tgt-line);
	padding: clamp(28px, 4.5vw, 56px) var(--tgt-space-5) clamp(36px, 6vw, 72px);
}

.tgt-sem-hero .tgt-sem-hero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
	gap: clamp(28px, 5vw, 72px);
	align-items: center;
}

.tgt-sem-hero__text > * {
	margin-block-start: 0;
}

.tgt-sem-hero__text .tgt-kicker {
	margin: 0 0 10px;
}

.tgt-sem-hero__text .tgt-display {
	margin: 0 0 14px;
}

.tgt-sem-hero__text .tgt-lead {
	margin: 0;
	max-width: 46ch;
}

.tgt-sem-hero__text .tgt-sem-hero__aktionen {
	margin-block-start: 36px;
	gap: var(--tgt-space-3) var(--tgt-space-4);
}

/* Fakten-Zeile unter den Hero-Buttons: Core-Liste mit .tgt-knochen-liste,
   hier waagerecht gesetzt. ul davor, damit sie die Knochen-Liste uebersticht. */
ul.tgt-sem-fakten {
	margin: 28px 0 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 22px;
	font-size: var(--tgt-fs-body-sm);
	color: var(--tgt-slate-soft);
}

ul.tgt-sem-fakten li {
	margin: 0;
}

/* Bildkomposition: Freisteller vor grosser Himmelblau-Scheibe */
.tgt-sem-hero__visual {
	position: relative;
	isolation: isolate;
	width: min(100%, 440px);
	aspect-ratio: 1 / 1.05;
	margin-inline: auto;
}

.tgt-sem-hero__visual::before {
	content: "";
	position: absolute;
	z-index: -1;
	right: 0;
	top: 6%;
	width: 88%;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	background: var(--tgt-teal);
	box-shadow: inset 0 0 0 10px var(--tgt-teal), inset 0 0 0 14px rgba(255, 255, 255, 0.85);
}

.tgt-sem-hero__visual::after {
	content: "";
	position: absolute;
	z-index: -1;
	left: 2%;
	top: 14%;
	width: 18%;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	border: 4px solid var(--tgt-steel-soft);
}

.tgt-sem-hero__visual .wp-block-image {
	margin: 0;
}

.tgt-sem-hero__visual .wp-block-image img,
.tgt-sem-hero__visual img {
	position: absolute;
	left: 50%;
	bottom: 0;
	height: 96%;
	width: auto;
	max-width: none;
	transform: translateX(-44%);
	filter: drop-shadow(0 14px 18px rgba(22, 65, 140, 0.22));
}

.tgt-sem-hero__chip {
	position: absolute;
	left: -4%;
	bottom: 4%;
	background: #fff;
	border-radius: var(--tgt-radius-pill);
	box-shadow: var(--tgt-elev-3);
	padding: 8px 22px 8px 8px;
	text-decoration: none;
	color: var(--tgt-slate);
	transition: transform var(--tgt-dur-base) var(--tgt-ease-out);
}

.tgt-sem-hero__chip:hover,
.tgt-sem-hero__chip:focus-visible {
	transform: translateY(-3px);
	text-decoration: none;
	color: var(--tgt-slate);
}

.tgt-sem-hero__chipinhalt {
	display: flex;
	align-items: center;
	gap: 14px;
}

.tgt-sem-hero__chiptext {
	display: grid;
	gap: 1px;
	font-size: 13.5px;
	line-height: 1.3;
	color: var(--tgt-slate-soft);
}

.tgt-sem-hero__chiptext strong {
	font-family: var(--tgt-font-display);
	font-weight: var(--tgt-fw-display);
	font-size: 16px;
	color: var(--tgt-steel);
}

/* ---------- ÜBERSICHT: TERMINE ---------- */

.tgt-sem-termine {
	display: grid;
	gap: 16px;
	max-width: 900px;
	margin: var(--tgt-space-6) auto 0;
}

.tgt-sem-termin {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 12px clamp(18px, 3vw, 30px);
	background: #fff;
	border: 1px solid var(--tgt-line);
	border-radius: var(--tgt-radius-xl);
	box-shadow: var(--tgt-elev-1);
	padding: clamp(18px, 2.6vw, 26px);
	transition: transform var(--tgt-dur-base) var(--tgt-ease-out),
	            box-shadow var(--tgt-dur-base) var(--tgt-ease-out),
	            border-color var(--tgt-dur-base) var(--tgt-ease-out);
}

.tgt-sem-termin:hover {
	transform: translateY(-2px);
	border-color: var(--tgt-teal);
	box-shadow: var(--tgt-elev-2);
}

.tgt-sem-termin__main {
	display: grid;
	gap: 10px;
	min-width: 0;
}

.tgt-sem-termin__main > * {
	margin: 0;
}

.tgt-sem-termin h3 {
	font-size: var(--tgt-fs-h3);
	margin: 0;
}

.tgt-sem-termin h3 a {
	color: var(--tgt-steel);
	text-decoration: none;
}

.tgt-sem-termin__notiz {
	font-size: var(--tgt-fs-caption);
	color: var(--tgt-slate-soft);
}

.tgt-sem-termin__aktion {
	display: grid;
	justify-items: center;
	gap: 10px;
}

.tgt-sem-termin__aktion .wp-block-button,
.tgt-sem-termin__aktion .wp-block-button__link {
	width: 100%;
	text-align: center;
}

.tgt-sem-termin__aktion .wp-block-button {
	margin: 0;
}

@media (max-width: 720px) {
	.tgt-sem-termin {
		grid-template-columns: auto minmax(0, 1fr);
	}

	.tgt-sem-termin__aktion {
		grid-column: 1 / -1;
		justify-items: stretch;
		grid-template-columns: 1fr;
	}

	.tgt-sem-termin__aktion .tgt-sem-link {
		text-align: center;
	}
}

@media (max-width: 400px) {
	.tgt-termin-scheibe {
		--ts: 72px;
	}

	.tgt-termin-scheibe__nr {
		font-size: 26px;
	}
}

/* ---------- VORMERKEN (gestrichelt = noch kein Termin) ---------- */

.tgt-form.tgt-sem-vormerken {
	max-width: 900px;
	margin: var(--tgt-space-5) auto 0;
	background: var(--tgt-steel-tint);
	border: 2px dashed var(--tgt-teal);
	border-radius: var(--tgt-radius-xl);
	padding: clamp(20px, 3vw, 30px);
	display: grid;
	gap: 18px;
}

.tgt-sem-vormerken .wpcf7-form {
	display: grid;
	gap: 14px;
}

.tgt-sem-vormerken__kopf {
	display: flex;
	align-items: center;
	gap: clamp(14px, 2.4vw, 22px);
}

.tgt-sem-vormerken__kopf .tgt-termin-scheibe {
	--ts: 62px;
	background: #fff;
}

.tgt-sem-vormerken__kopf h3 {
	font-size: var(--tgt-fs-h3);
	margin: 0 0 4px;
}

.tgt-sem-vormerken__kopf p {
	margin: 0;
	color: var(--tgt-slate-soft);
	font-size: var(--tgt-fs-body-sm);
}

.tgt-sem-vormerken__felder {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) auto;
	gap: 0 14px;
	align-items: end;
}

.tgt-form.tgt-sem-vormerken p {
	margin: 0 0 4px;
}

.tgt-sem-vormerken__felder p {
	margin: 0;
}

.tgt-sem-vormerken__consent {
	margin: 0;
}

@media (max-width: 560px) {
	.tgt-sem-vormerken__kopf {
		align-items: flex-start;
	}
}

@media (max-width: 760px) {
	.tgt-sem-vormerken__felder {
		grid-template-columns: 1fr;
		gap: 14px;
	}

	.tgt-sem-vormerken__senden input[type="submit"] {
		width: 100%;
	}
}

/* ---------- FORMULARE: Felder, die der Kontakt-Block nicht kennt ---------- */

/* Eine Feldhoehe fuer Eingaben und Auswahlfelder (46 px wie die Buttons):
   Blocksy setzt 40 px, ein Select mit 12 px Polster hat darin keinen Platz
   fuer seine Zeile und schneidet den Text unten ab. */
.tgt-sem-form input[type="text"],
.tgt-sem-form input[type="email"],
.tgt-sem-form input[type="tel"],
.tgt-sem-form select {
	height: 46px;
}

.tgt-form select {
	width: 100%;
	font: inherit;
	font-size: var(--tgt-fs-body-sm);
	line-height: 1.4;
	color: var(--tgt-slate);
	background-color: #fff;
	border: 1px solid var(--tgt-line-strong);
	border-radius: 12px;
	padding-block: 0;
	padding-inline: 14px 40px;
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2316418C' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	background-size: 16px;
}

.tgt-form select:focus {
	outline: none;
	border-color: var(--tgt-steel);
	box-shadow: 0 0 0 3px var(--tgt-steel-soft);
}

.tgt-form label {
	display: block;
}

.tgt-form .wpcf7-form-control-wrap {
	display: block;
	margin-top: 4px;
}

.tgt-sem-felder {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 16px;
}

.tgt-sem-felder .is-voll {
	grid-column: 1 / -1;
}

.tgt-sem-felder p {
	margin: 0 0 14px;
}

.tgt-form .tgt-sem-consent {
	font-size: var(--tgt-fs-caption);
	color: var(--tgt-slate-soft);
	line-height: 1.5;
}

.tgt-form .tgt-sem-consent .wpcf7-form-control-wrap {
	margin-top: 0;
}

.tgt-form .tgt-sem-consent label {
	font-weight: var(--tgt-fw-regular);
	font-size: inherit;
	letter-spacing: 0;
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

.tgt-form .tgt-sem-consent input[type="checkbox"] {
	flex: none;
	width: 18px;
	height: 18px;
	margin: 2px 0 0;
	accent-color: var(--tgt-steel);
}

.tgt-sem-form .wpcf7-response-output {
	margin: 14px 0 0;
}

@media (max-width: 560px) {
	.tgt-sem-felder {
		grid-template-columns: 1fr;
	}
}

/* ---------- ÜBERSICHT: THEMEN-KARTEN ---------- */

.tgt-sem-karten {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 20px;
	margin-top: var(--tgt-space-6);
}

/*
 * Genau vier Seminare stehen als 2 × 2, nicht als 3 + 1. Der Bereich ist die Breite, in der
 * auto-fit drei Spalten bildet (vier passen erst ab 1320 px Fensterbreite in eine Reihe).
 */
@media (min-width: 700px) and (max-width: 1319px) {
	.tgt-sem-karten:has(> .tgt-sem-karte:nth-child(4):last-child) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.tgt-sem-karte {
	position: relative;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--tgt-line);
	border-radius: var(--tgt-radius-xl);
	box-shadow: var(--tgt-elev-1);
	padding: clamp(22px, 3vw, 30px);
	transition: transform var(--tgt-dur-base) var(--tgt-ease-out),
	            box-shadow var(--tgt-dur-base) var(--tgt-ease-out),
	            border-color var(--tgt-dur-base) var(--tgt-ease-out);
}

.tgt-sem-karte:hover {
	transform: translateY(-3px);
	border-color: var(--tgt-teal);
	box-shadow: var(--tgt-elev-2);
}

.tgt-sem-karte__kopf {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: var(--tgt-space-4);
}

.tgt-sem-karte .tgt-disc {
	margin: 0;
}

.tgt-sem-karte h3 {
	font-size: var(--tgt-fs-h3);
	margin: 0 0 8px;
}

.tgt-sem-karte h3 a {
	color: var(--tgt-slate);
	text-decoration: none;
}

/* ganze Karte klickbar, genau ein Linkziel */
.tgt-sem-karte h3 a::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
}

.tgt-sem-karte:hover h3 a {
	color: var(--tgt-steel);
}

.tgt-sem-karte:has(a:focus-visible) {
	outline: 3px solid var(--tgt-steel);
	outline-offset: 3px;
}

.tgt-sem-karte__frage {
	margin: 0 0 var(--tgt-space-4);
	font-size: var(--tgt-fs-body-sm);
	font-weight: var(--tgt-fw-medium);
	line-height: 1.45;
	color: var(--tgt-teal-deep);
}

.tgt-sem-karte ul.tgt-knochen-liste li {
	font-size: var(--tgt-fs-body-sm);
	margin-bottom: 7px;
}

.tgt-sem-karte__fuss {
	margin-top: auto;
	padding-top: var(--tgt-space-4);
	display: flex;
	flex-wrap: wrap; /* schmale Karten (vier in einer Reihe): „Mehr erfahren“ rutscht in die nächste Zeile */
	align-items: baseline;
	justify-content: space-between;
	gap: 4px 12px;
	font-size: var(--tgt-fs-body-sm);
	color: var(--tgt-slate-soft);
}

.tgt-sem-karte .tgt-sem-preis {
	white-space: nowrap; /* „ab 65 € pro Person“ nicht mitten im Preis umbrechen */
}

.tgt-sem-karte ul.tgt-knochen-liste {
	margin-bottom: var(--tgt-space-5);
}

.tgt-sem-preis strong {
	font-family: var(--tgt-font-display);
	font-weight: var(--tgt-fw-display);
	font-size: 18px;
	color: var(--tgt-steel);
}

.tgt-sem-mehr {
	font-family: var(--tgt-font-display);
	font-weight: var(--tgt-fw-display);
	color: var(--tgt-teal-deep);
	white-space: nowrap;
}

.tgt-sem-mehr::after {
	content: "\2192";
	margin-left: 8px;
	display: inline-block;
	transition: transform var(--tgt-dur-base) var(--tgt-ease-out);
}

.tgt-sem-karte:hover .tgt-sem-mehr::after {
	transform: translateX(4px);
}

@media (max-width: 600px) {
	.tgt-sem-karte ul.tgt-knochen-liste {
		margin-bottom: var(--tgt-space-3);
	}

	.tgt-sem-karte__fuss {
		padding-top: var(--tgt-space-3);
	}
}

/* ---------- ÜBERSICHT: GRUPPEN-PANEL (nutzt .tgt-form-panel) ---------- */

.tgt-sem-gruppe .tgt-form-panel {
	margin-inline: auto;
}

.tgt-form-panel__aside .tgt-sem-richtpreis {
	margin: 6px 0 0;
	font-size: var(--tgt-fs-body-sm);
	color: rgba(255, 255, 255, 0.86);
}

.tgt-sem-gruppenform {
	max-width: none;
}

.tgt-sem-gruppenform input[type="submit"] {
	min-width: 190px;
}

/* ---------- FAQ ---------- */

.tgt-sem-faq {
	max-width: 760px;
	margin: var(--tgt-space-5) auto 0;
	display: grid;
	gap: 12px;
}

.tgt-sem-faq .tgt-akkordeon {
	margin: 0;
}

/* Blocksy gibt jedem Kind eines Flow-Layouts margin-bottom (1,5em), auch dem
   summary: geschlossen bliebe unter der Frage eine leere Fläche. */
.tgt-sem-faq .tgt-akkordeon summary {
	margin-bottom: 0;
}

.tgt-sem-faq .tgt-akkordeon p {
	margin-top: 0;
	font-size: var(--tgt-fs-body-sm);
}

.tgt-sem-faq--eng {
	max-width: none;
	margin-top: var(--tgt-space-4);
}

/* Abschluss-CTA direkt unter den FAQ: der Abstand kommt schon vom Abschnitt davor */
.tgt-pad.tgt-sem-cta-sec {
	padding-top: 0;
}

.tgt-sem-cta-sec .tgt-detail-cta {
	margin-top: 0;
}

/* ---------- DETAILSEITE ---------- */

.tgt-sem-detail {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 348px;
	grid-template-areas:
		"kopf   aside"
		"main   aside";
	grid-template-rows: auto 1fr;
	column-gap: clamp(28px, 4.4vw, 60px);
	align-items: start;
}

.tgt-sem-detail > * {
	margin-block: 0;
}

.tgt-sem-detail__kopf { grid-area: kopf; }
.tgt-sem-detail__main { grid-area: main; min-width: 0; }

.tgt-sem-detail > .tgt-sem-buchung {
	grid-area: aside;
	position: sticky;
	top: 112px;
}

@media (max-width: 960px) {
	.tgt-sem-detail {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas:
			"kopf"
			"aside"
			"main";
		grid-template-rows: auto;
	}

	.tgt-sem-detail > .tgt-sem-buchung {
		position: static;
		margin: var(--tgt-space-5) 0 var(--tgt-space-6);
	}
}

.tgt-sem-krume {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0 0 var(--tgt-space-5);
	font-size: var(--tgt-fs-caption);
	color: var(--tgt-slate-soft);
}

.tgt-sem-krume a {
	color: var(--tgt-slate-soft);
	text-decoration: underline;
	text-decoration-color: var(--tgt-line-strong);
}

.tgt-sem-krume a:hover {
	color: var(--tgt-steel);
}

.tgt-sem-detail__kopf > * {
	margin-block-start: 0;
}

.tgt-sem-detail__kopf .tgt-kicker {
	margin-bottom: 10px;
}

.tgt-sem-detail__kopf h1 {
	font-size: clamp(32px, 4.4vw, 46px);
	line-height: var(--tgt-lh-display);
	margin: 0 0 var(--tgt-space-4);
}

.tgt-sem-detail__kopf .tgt-lead {
	font-size: clamp(18px, 2.4vw, 20px);
	line-height: 1.6;
	color: var(--tgt-slate);
	margin: 0;
	max-width: 60ch;
}

.tgt-sem-chipzeile {
	list-style: none;
	margin: var(--tgt-space-5) 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.tgt-sem-chipzeile li {
	background: var(--tgt-steel-soft);
	color: var(--tgt-steel-deep);
	font-size: var(--tgt-fs-caption);
	font-weight: var(--tgt-fw-medium);
	padding: 5px 14px;
	border-radius: var(--tgt-radius-pill);
}

.tgt-sem-detail__main > * {
	margin-block-start: 0;
}

.tgt-sem-detail__main > h2 {
	margin: var(--tgt-space-7) 0 var(--tgt-space-4);
}

.tgt-sem-detail__main > h2::after {
	content: "";
	display: block;
	width: 52px;
	height: 4px;
	border-radius: 2px;
	background: var(--tgt-teal);
	margin-top: 10px;
}

.tgt-sem-detail__main > h2:first-child {
	margin-top: var(--tgt-space-6);
}

.tgt-sem-detail__main .tgt-karten-reihe {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 16px;
	margin-top: var(--tgt-space-4);
}

.tgt-sem-detail__main .tgt-info-karte p:not(.tgt-karte-kopf) {
	font-size: var(--tgt-fs-body-sm);
	margin: 0;
}

.tgt-sem-detail__main .tgt-info-karte .tgt-karte-kopf {
	margin: 0 0 var(--tgt-space-2);
}

/* Blickfang: Zitat (wenn kein Foto) */
.tgt-sem-zitat {
	margin: var(--tgt-space-6) 0 0;
	padding: clamp(22px, 3.4vw, 32px) clamp(22px, 3.4vw, 36px);
	border: none;
	border-radius: var(--tgt-radius-xl);
	background: var(--tgt-gradient-steel);
	max-width: none;
}

.tgt-sem-zitat::before {
	content: "\201C";
	display: block;
	font-family: var(--tgt-font-display);
	font-weight: var(--tgt-fw-display);
	font-size: 64px;
	line-height: 0.55;
	margin-bottom: 4px;
	color: var(--tgt-teal);
}

.tgt-sem-zitat p {
	margin: 0;
	font-family: var(--tgt-font-display);
	font-weight: var(--tgt-fw-display);
	font-style: normal;
	font-size: clamp(22px, 3.2vw, 30px);
	line-height: 1.3;
	color: #fff;
}

/* optionale Einleitungszeile über dem Zitat */
.tgt-sem-zitat .tgt-sem-zitat__vor {
	margin: 0 0 8px;
	font-family: var(--tgt-font);
	font-weight: var(--tgt-fw-regular);
	font-size: var(--tgt-fs-body-sm);
	line-height: 1.5;
	color: var(--tgt-steel-soft);
}

.tgt-sem-foto {
	margin: var(--tgt-space-6) 0 0;
}

.tgt-sem-foto img {
	display: block;
	width: 100%;
	max-height: 440px;
	object-fit: cover;
	object-position: 50% 30%;
	border-radius: var(--tgt-radius-xl);
	box-shadow: var(--tgt-elev-2);
}

.tgt-sem-foto figcaption {
	margin-top: 8px;
	font-size: var(--tgt-fs-caption);
	color: var(--tgt-slate-soft);
}

/* Rückblick: „schon gegeben“ als ruhiger Beleg */
.tgt-sem-rueckblick {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin-top: var(--tgt-space-6);
	padding: 14px 18px;
	background: var(--tgt-steel-tint);
	border: 1px solid var(--tgt-steel-soft);
	border-radius: var(--tgt-radius-md);
	font-size: var(--tgt-fs-body-sm);
	line-height: 1.55;
}

.tgt-sem-rueckblick p {
	margin: 0;
}

.tgt-sem-rueckblick::before {
	content: "";
	flex: none;
	width: 22px;
	height: 22px;
	margin-top: 1px;
	background-color: var(--tgt-teal-deep);
	-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M20%206%209%2017l-5-5%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M20%206%209%2017l-5-5%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}

/* ---------- BUCHUNGSKARTE (rechte Spalte) ---------- */

.tgt-sem-buchung {
	background: #fff;
	border: 1px solid var(--tgt-line);
	border-radius: var(--tgt-radius-2xl);
	box-shadow: var(--tgt-elev-3);
	overflow: hidden;
}

.tgt-sem-buchung p {
	margin: 0;
}

.tgt-sem-buchung__kopf {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 22px 24px;
	background: var(--tgt-steel-tint);
	border-bottom: 1px solid var(--tgt-steel-soft);
}

.tgt-sem-buchung__kopf .tgt-termin-scheibe--offen {
	--ts: 68px;
	background: #fff;
}

.tgt-sem-buchung__kicker {
	font-size: var(--tgt-fs-kicker);
	font-weight: var(--tgt-fw-medium);
	letter-spacing: var(--tgt-ls-kicker);
	text-transform: uppercase;
	color: var(--tgt-teal-deep);
	margin-bottom: 2px !important;
}

.tgt-sem-buchung__titel {
	font-family: var(--tgt-font-display);
	font-weight: var(--tgt-fw-display);
	font-size: 19px;
	line-height: 1.25;
	color: var(--tgt-steel);
}

.tgt-sem-buchung__zeit {
	font-size: var(--tgt-fs-body-sm);
	color: var(--tgt-slate-soft);
	margin-top: 2px !important;
}

.tgt-sem-buchung__body {
	display: grid;
	gap: 14px;
	padding: 22px 24px;
}

.tgt-sem-buchung__preis {
	font-family: var(--tgt-font-display);
	font-weight: var(--tgt-fw-display);
	font-size: 30px;
	line-height: 1.1;
	color: var(--tgt-steel);
}

.tgt-sem-buchung__preis small {
	font-family: var(--tgt-font);
	font-weight: var(--tgt-fw-regular);
	font-size: var(--tgt-fs-body-sm);
	color: var(--tgt-slate-soft);
}

.tgt-sem-buchung__hinweis {
	font-size: var(--tgt-fs-caption);
	color: var(--tgt-slate-soft);
	margin-top: -8px !important;
}

.tgt-sem-buchung__btn {
	margin-top: 4px;
}

.tgt-sem-buchung__btn .wp-block-button,
.tgt-sem-buchung__btn .wp-block-button__link {
	width: 100%;
	text-align: center;
}

.tgt-sem-buchung__fuss {
	padding: 16px 24px 20px;
	border-top: 1px solid var(--tgt-line);
	font-size: var(--tgt-fs-body-sm);
	line-height: 1.8;
	color: var(--tgt-slate-soft);
}

.tgt-sem-buchung__fuss a {
	font-weight: var(--tgt-fw-medium);
}

.tgt-sem-mini p {
	margin: 0 0 10px;
}

.tgt-sem-mini input[type="submit"] {
	width: 100%;
}

.tgt-sem-buchung--offen {
	border: 2px dashed var(--tgt-teal);
	box-shadow: var(--tgt-elev-2);
}

/* ---------- DETAILSEITE: Abschluss ---------- */

.tgt-sem-detail-sec {
	padding-top: clamp(28px, 4vw, 48px);
}

.wp-block-group.tgt-sem-detail-cta {
	margin-top: var(--tgt-space-8);
}

.tgt-sem-wechsler {
	margin-top: var(--tgt-space-6);
	text-align: center;
}

.tgt-sem-wechsler__kopf {
	margin: 0 0 var(--tgt-space-3);
	font-family: var(--tgt-font-display);
	font-weight: var(--tgt-fw-display);
	font-size: 15px;
	letter-spacing: 0.04em;
	color: var(--tgt-slate-soft);
}

/* Der Baustein baut den Buttons-Block ohne WordPress-Layoutklasse (is-layout-flex)
   selbst. Ohne display:flex greifen weder gap noch justify-content, und die
   Buttons kleben aneinander. Gleiches Muster wie .tgt-route-btns. */
.tgt-sem-wechsler .wp-block-buttons {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--tgt-space-3);
}

.tgt-sem-wechsler .wp-block-button__link {
	padding: 8px 22px;
	font-size: var(--tgt-fs-body-sm);
}

/* ---------- QUERVERWEIS auf Tierart-Seiten ---------- */

.wp-block-group.tgt-sem-hinweis {
	clear: both;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: var(--tgt-space-4) var(--tgt-space-6);
	margin-top: var(--tgt-space-7);
	padding: clamp(20px, 3.2vw, 30px);
	background: var(--tgt-steel-tint);
	border: 1px solid var(--tgt-steel-soft);
	border-radius: var(--tgt-radius-2xl);
}

.tgt-sem-hinweis > * {
	margin: 0;
}

.tgt-sem-hinweis .tgt-kicker {
	margin-bottom: 6px;
}

.tgt-sem-hinweis h3 {
	margin: 0 0 6px;
}

.tgt-sem-hinweis__text p:not(.tgt-kicker) {
	font-size: var(--tgt-fs-body-sm);
	color: var(--tgt-slate-soft);
	max-width: 56ch;
}

.tgt-sem-hinweis .tgt-sem-chips {
	grid-column: 1;
	margin: 0;
}

.tgt-sem-hinweis__alle {
	grid-column: 2;
	grid-row: 2;
	justify-self: end;
}

@media (max-width: 760px) {
	.wp-block-group.tgt-sem-hinweis {
		grid-template-columns: minmax(0, 1fr);
	}

	.tgt-sem-hinweis__alle {
		grid-column: 1;
		grid-row: auto;
		justify-self: start;
	}
}

/* ---------- RESPONSIV ---------- */

@media (max-width: 880px) {
	.tgt-sem-streifen .tgt-sem-streifen__grid,
	.tgt-sem-hero .tgt-sem-hero__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.tgt-sem-hero__visual {
		width: min(66vw, 300px);
	}
}

@media (max-width: 520px) {
	/* Handy: Themen-Chips etwas kleiner, damit zwei in eine Zeile passen */
	.tgt-sem-chips {
		gap: 8px;
		margin: var(--tgt-space-4) 0;
	}

	.tgt-sem-chips a {
		gap: 8px;
		padding: 5px 14px 5px 5px;
		font-size: 14px;
	}

	.tgt-sem-chips .tgt-disc {
		--disc: 30px;
	}

	.tgt-sem-ticket__zeile {
		align-items: flex-start;
	}

	.tgt-sem-hero__chip {
		left: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.tgt-sem-karte,
	.tgt-sem-termin,
	.tgt-sem-chips a,
	.tgt-sem-hero__chip,
	.tgt-sem-link::after,
	.tgt-sem-mehr::after {
		transition: none;
	}

	.tgt-sem-karte:hover,
	.tgt-sem-termin:hover,
	.tgt-sem-chips a:hover,
	.tgt-sem-hero__chip:hover {
		transform: none;
	}
}

/* Sprungziele (#termine, #gruppe, #vormerken …) nicht unter den Sticky-Header schieben */
.tgt-sem-termine-sec,
.tgt-sem-gruppe,
.tgt-sem-themen,
.tgt-sem-vormerken,
.tgt-sem-detail [id] {
	scroll-margin-top: 104px;
}

/* ---------- ANMELDEFENSTER „PLATZ BUCHEN“ ---------- */

.tgt-sem-dialog {
	width: min(560px, calc(100vw - 24px));
	max-height: calc(100vh - 24px);
	padding: 0;
	border: 0;
	border-radius: var(--tgt-radius-2xl);
	background: #fff;
	color: var(--tgt-slate);
	box-shadow: 0 24px 80px rgba(14, 47, 107, 0.4);
	overflow: auto;
}

.tgt-sem-dialog::backdrop {
	background: rgba(14, 47, 107, 0.5);
}

html:has(dialog.tgt-sem-dialog[open]) {
	overflow: hidden;
}

/* Schließen-Knopf bleibt beim Scrollen im Fenster sichtbar (Handy):
   ein Streifen ohne Höhe klebt oben, der Knopf hängt daran. */
.tgt-sem-dialog__close {
	position: sticky;
	top: 0;
	z-index: 1;
	height: 0;
	margin: 0;
}

.tgt-sem-dialog__close button {
	position: absolute;
	top: 12px;
	right: 12px;
	box-shadow: 0 0 0 4px #fff;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--tgt-steel-tint);
	color: var(--tgt-steel);
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
}

.tgt-sem-dialog__close button:hover,
.tgt-sem-dialog__close button:focus-visible {
	background: var(--tgt-steel-soft);
}

.tgt-sem-dialog__body.tgt-form {
	max-width: none;
	padding: 28px clamp(20px, 4vw, 32px);
}

.tgt-sem-dialog__body h2 {
	font-size: var(--tgt-fs-h2);
	margin: 0 0 var(--tgt-space-4);
	padding-right: 48px;
}

.tgt-sem-dialog__summary {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-bottom: 20px;
	padding: 14px 16px;
	background: var(--tgt-steel-tint);
	border-radius: var(--tgt-radius-lg);
}

.tgt-sem-dialog__summary > div {
	display: grid;
	gap: 2px;
	font-size: 14px;
	color: var(--tgt-slate-soft);
}

.tgt-sem-dialog__summary strong {
	font-family: var(--tgt-font-display);
	font-weight: var(--tgt-fw-display);
	font-size: 17px;
	color: var(--tgt-steel);
}

.tgt-sem-dialog__summe {
	margin: 4px 0 14px;
	font-size: 16px;
}

.tgt-sem-dialog__summe strong {
	font-family: var(--tgt-font-display);
	font-weight: var(--tgt-fw-display);
	font-size: 22px;
	color: var(--tgt-steel);
}

/* Platzzahl: Zähler mit Plus/Minus um ein echtes Zahlenfeld */
.tgt-sem-feldname {
	display: block;
	margin-bottom: 4px;
	font-size: var(--tgt-fs-caption);
	font-weight: var(--tgt-fw-medium);
	letter-spacing: 0.02em;
	color: var(--tgt-slate);
}

.tgt-sem-stepper {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px;
	background: #fff;
	border: 1px solid var(--tgt-line-strong);
	border-radius: var(--tgt-radius-pill);
}

.tgt-sem-stepper__btn {
	width: 38px;
	height: 38px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--tgt-steel-tint);
	color: var(--tgt-steel);
	display: grid;
	place-items: center;
	cursor: pointer;
}

.tgt-sem-stepper__btn:hover,
.tgt-sem-stepper__btn:focus-visible {
	background: var(--tgt-steel-soft);
}

.tgt-sem-stepper__btn::before {
	content: "";
	width: 16px;
	height: 16px;
	background-color: currentColor;
}

.tgt-sem-stepper__btn[data-step="-1"]::before {
	-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M5%2012h14%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M5%2012h14%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}

.tgt-sem-stepper__btn[data-step="1"]::before {
	-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M5%2012h14%22%2F%3E%3Cpath%20d%3D%22M12%205v14%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M5%2012h14%22%2F%3E%3Cpath%20d%3D%22M12%205v14%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}

.tgt-sem-stepper .wpcf7-form-control-wrap {
	display: block;
	margin: 0;
}

.tgt-sem-stepper input[type="number"].tgt-sem-stepper__zahl {
	width: 56px;
	height: 38px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	text-align: center;
	font-family: var(--tgt-font-display);
	font-weight: var(--tgt-fw-display);
	font-size: 20px;
	color: var(--tgt-steel);
	-moz-appearance: textfield;
	appearance: textfield;
}

.tgt-sem-stepper input[type="number"]::-webkit-outer-spin-button,
.tgt-sem-stepper input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Fehlermeldung unter dem Zähler, ohne den Zähler zu sprengen */
.tgt-sem-stepper .wpcf7-not-valid-tip {
	position: absolute;
	left: 8px;
	top: 100%;
	margin-top: 6px;
	width: max-content;
	max-width: 280px;
}

.tgt-sem-stepper:has(.wpcf7-not-valid-tip) {
	margin-bottom: 40px;
}

/* ---------- SPAMSCHUTZ: Honigtopf (für Menschen unsichtbar) ---------- */

.tgt-form .tgt-hp {
	position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	margin: 0;
	overflow: hidden;
}

.tgt-sem-formular-fehlt {
	margin: 0;
	padding: 14px 16px;
	background: var(--tgt-steel-tint);
	border-radius: var(--tgt-radius-md);
	font-size: var(--tgt-fs-body-sm);
}

/* ---------- FOTOREIHE: drei Fotos am Handy in einer Zeile ----------
   Die allgemeine Bildreihe (blocks.css) bricht am Handy auf zwei Spalten um, das dritte Foto
   stuende dann allein darunter. Wie auf den Leistungsseiten: drei kleine Quadrate nebeneinander. */
@media (max-width: 500px) {
	.tgt-sem-detail .wp-block-group.tgt-bild-reihe:has(> .wp-block-image:nth-child(3):last-child) {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 8px;
	}
	.tgt-sem-detail .tgt-bild-reihe:has(> .wp-block-image:nth-child(3):last-child) .wp-block-image img {
		aspect-ratio: 1;
		border-radius: var(--tgt-radius-md);
	}
}

/* ---------- SEMINAR-FOTO IM HOCHFORMAT ----------
   Das Foto im Massage-Seminar ist ein Hochformat (3:4). Im breiten Rahmen blieben links und rechts leere
   Streifen. Mit der Klasse tgt-sem-foto--hoch steht es in seiner eigenen Form, mittig und nicht zugeschnitten. */
.tgt-sem-foto--hoch {
	max-width: 360px;
	margin-inline: auto;
}

.tgt-sem-foto--hoch img {
	max-height: none;
	aspect-ratio: 3 / 4;
	object-position: 50% 40%;
}