/**
 * Telsche – Utility-Klassen des Designsystems.
 * Ergänzt theme.json um die Muster, die dort nicht abbildbar sind.
 */

/* ---------------------------------------------------------------------------
 * Mono-Eyebrow – das wichtigste Wiedererkennungsmerkmal des Designs.
 * UPPERCASE, IBM Plex Mono, weite Laufweite.
 * ------------------------------------------------------------------------- */
.telsche-eyebrow {
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: var(--wp--preset--font-size--mono-sm);
	letter-spacing: var(--wp--custom--eyebrow--letter-spacing);
	text-transform: uppercase;
	color: var(--wp--preset--color--sail-red);
}

.telsche-eyebrow--muted {
	color: var(--wp--preset--color--text-muted);
}

.telsche-eyebrow--faint {
	color: var(--wp--preset--color--text-faint);
}

/* Auf dunklem Grün (Hub-Banner, Teaser-Bänder) */
.telsche-eyebrow--gold {
	color: var(--wp--preset--color--gold-muted);
}

.telsche-eyebrow--xs {
	font-size: var(--wp--preset--font-size--mono-xs);
	letter-spacing: 0.14em;
}

/* Mono-Metazeile ohne Uppercase-Zwang (Datumsspalten wie "2026 / 07-31") */
.telsche-mono {
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: var(--wp--preset--font-size--mono-sm);
	letter-spacing: 0.06em;
	color: var(--wp--preset--color--text-faint);
}

/* ---------------------------------------------------------------------------
 * Karten & Frames
 * ------------------------------------------------------------------------- */
.telsche-card {
	background: var(--wp--preset--color--card-white);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--card);
}

.telsche-frame {
	background: var(--wp--preset--color--card-white);
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--frame);
	box-shadow: var(--wp--custom--shadow--frame);
	overflow: hidden;
}

/* Cream-Kopfleiste (Buch-Box, Anzeige-Header, Datenblatt) */
.telsche-card-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 10px 18px;
	background: var(--wp--preset--color--cream);
}

/* ---------------------------------------------------------------------------
 * Trenner
 * ------------------------------------------------------------------------- */
.telsche-divider {
	border: 0;
	border-top: 1px solid var(--wp--preset--color--border);
}

/* Logbuch: gestrichelt */
.telsche-divider--dashed {
	border-top-style: dashed;
	border-top-color: var(--wp--preset--color--border-strong);
}

/* ---------------------------------------------------------------------------
 * Chips & Pills
 * ------------------------------------------------------------------------- */
.telsche-chip {
	display: inline-block;
	padding: 6px 14px;
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--pill);
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13px;
	font-weight: 500;
	color: var(--wp--preset--color--text-body);
	background: transparent;
	cursor: pointer;
	transition: background 150ms ease, color 150ms ease;
}

.telsche-chip.is-active {
	background: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--white-soft);
}

/* Zahlen-Chips im Hub ("6 HÄFEN") */
.telsche-chip--count {
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: var(--wp--preset--font-size--mono-xs);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	background: var(--wp--preset--color--chip-green);
	border-color: transparent;
	color: var(--wp--preset--color--hull-green);
}

/* ---------------------------------------------------------------------------
 * Foto-Overlays (Karten mit Text auf Bild)
 * ------------------------------------------------------------------------- */
.telsche-photo-card {
	position: relative;
	border-radius: var(--wp--custom--radius--cardLg);
	overflow: hidden;
}

.telsche-photo-card::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--wp--preset--gradient--photo-overlay);
	pointer-events: none;
}

.telsche-photo-card > .telsche-photo-card__content {
	position: absolute;
	inset: auto 0 0 0;
	z-index: 1;
	padding: 20px 24px;
	color: var(--wp--preset--color--white-soft);
}

.telsche-photo-card__content .telsche-eyebrow {
	color: var(--wp--preset--color--teak-light);
}

/* ---------------------------------------------------------------------------
 * Buttons: Outline-Variante grün (Partner-CTAs – rot bleibt Affiliate/Inhalt)
 * ------------------------------------------------------------------------- */
.wp-block-button.is-style-outline-green .wp-block-button__link {
	background: transparent;
	border: 1px solid var(--wp--preset--color--hull-green);
	color: var(--wp--preset--color--hull-green);
}

.wp-block-button.is-style-outline-green .wp-block-button__link:hover {
	background: var(--wp--preset--color--chip-green);
}

/* ---------------------------------------------------------------------------
 * Links: Hover per Design 150ms
 * ------------------------------------------------------------------------- */
a {
	transition: color 150ms ease;
}

/* Eingebettete Medien (YouTube etc.) nie breiter als der Viewport */
iframe,
embed,
video {
	max-width: 100%;
}

/* ---------------------------------------------------------------------------
 * Content-Elemente: Galerien (importierte Core-Gallery-Markup ohne Inline-Styles)
 * ------------------------------------------------------------------------- */
figure.wp-block-gallery.has-nested-images {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 28px 0;
}

/* Default: Kacheln füllen die Zeile (2 Bilder → halbe, 3 → Drittel) */
figure.wp-block-gallery.has-nested-images > figure.wp-block-image {
	flex: 1 1 calc(33.333% - 8px);
	min-width: calc(33.333% - 8px);
	margin: 0;
	display: flex;
	position: relative;
}

figure.wp-block-gallery.columns-2 > figure.wp-block-image {
	flex-basis: calc(50% - 6px);
	max-width: calc(50% - 6px);
}

figure.wp-block-gallery.columns-3 > figure.wp-block-image {
	flex-basis: calc(33.333% - 8px);
	max-width: calc(33.333% - 8px);
}

figure.wp-block-gallery.columns-4 > figure.wp-block-image {
	flex-basis: calc(25% - 9px);
	max-width: calc(25% - 9px);
}

figure.wp-block-gallery.columns-1 > figure.wp-block-image {
	flex-basis: 100%;
	max-width: 100%;
}

figure.wp-block-gallery.has-nested-images figure.wp-block-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--card);
}

/* Gleiche Zeilenhöhen bei "is-cropped" – Porträt-Fotos werden beschnitten */
figure.wp-block-gallery.is-cropped > figure.wp-block-image img {
	aspect-ratio: 3 / 4;
}

figure.wp-block-gallery.is-cropped.columns-4 > figure.wp-block-image img {
	aspect-ratio: 1 / 1;
}

/* Captions als Overlay unten auf dem Foto (wie im Live-Design) */
figure.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
	position: absolute;
	inset: auto 0 0 0;
	margin: 0;
	padding: 28px 12px 10px;
	text-align: center;
	font-family: var(--wp--preset--font-family--figtree);
	font-style: normal;
	font-size: 13px;
	font-weight: 600;
	color: #fff;
	background: linear-gradient(180deg, rgba(20, 32, 26, 0) 0%, rgba(20, 32, 26, 0.72) 70%);
	border-radius: 0 0 var(--wp--custom--radius--card) var(--wp--custom--radius--card);
}

@media (max-width: 600px) {
	figure.wp-block-gallery.has-nested-images > figure.wp-block-image {
		flex-basis: calc(50% - 6px);
		max-width: calc(50% - 6px);
	}
}

/* ---------------------------------------------------------------------------
 * Content-Elemente: Tabellen & Zitate (Artikel, Pages, Kaufberatungen)
 * ------------------------------------------------------------------------- */
.wp-block-post-content figure.wp-block-table {
	margin: 28px 0;
	background: var(--wp--preset--color--card-white);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--card);
	overflow-x: auto;
}

.wp-block-post-content .wp-block-table table {
	border-collapse: collapse;
	width: 100%;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 14.5px;
	line-height: 1.5;
}

.wp-block-post-content .wp-block-table th,
.wp-block-post-content .wp-block-table td {
	border: 0;
	border-bottom: 1px dashed var(--wp--preset--color--border-strong);
	padding: 12px 18px;
	text-align: left;
	vertical-align: top;
}

.wp-block-post-content .wp-block-table tr:last-child td {
	border-bottom: 0;
}

/* Kopfzeile: cream Band wie beim Datenblatt. Der tr:first-child-Fallback gilt
 * nur für Tabellen OHNE echten thead – sonst wäre die erste Datenzeile doppelt
 * gehighlightet. */
.wp-block-post-content .wp-block-table thead th,
.wp-block-post-content .wp-block-table table:not(:has(thead)) tr:first-child:has(strong) td {
	background: var(--wp--preset--color--cream);
	border-bottom: 1px solid var(--wp--preset--color--border-strong);
	font-weight: 600;
	color: var(--wp--preset--color--ink);
}

/* Erste Spalte: gedämpfte Beschriftung */
.wp-block-post-content .wp-block-table td:first-child,
.wp-block-post-content .wp-block-table th:first-child {
	color: var(--wp--preset--color--text-muted);
	font-weight: 600;
	white-space: nowrap;
}

/* ---------------------------------------------------------------------------
 * Mobile Reihenfolge: Utilities + gezielte Ausblendungen im gestapelten Layout
 * ------------------------------------------------------------------------- */
@media (min-width: 1024px) {
	.telsche-nur-mobil {
		display: none !important;
	}
}

@media (max-width: 1023px) {
	.telsche-nur-desktop {
		display: none !important;
	}

	/* Sidebar-TOC ist mobil ein Duplikat des Inline-TOC. */
	.telsche-article__sidebar > .telsche-toc:not(.telsche-toc--mobile) {
		display: none;
	}

	/* Bibliotheks-Teaser + doppelte Buchbox: mobil reicht eine Empfehlung. */
	.telsche-article__sidebar .telsche-bibteaser,
	.telsche-article__sidebar .telsche-buchside--doppelt {
		display: none;
	}
}

/* Community-Modul: CTA + bestehende Kommentare/Pingbacks + Formular als
 * ein gemeinsam gerahmter Block am Artikelende. Nutzt dieselbe
 * Grid-Aufteilung wie .telsche-article__layout (minmax(0,720px) + 380px,
 * zentriert), damit die Karte unabhängig vom jeweiligen Template
 * (Artikel/Hafen/Ankerplatz/Törn/Modell) an derselben Stelle wie die
 * Artikel-Hauptspalte beginnt - nicht einfach für sich zentriert. Eigenes
 * Seiten-Padding, weil nicht jedes Template (z. B. .telsche-ort) auf dem
 * <main>-Element Seitenabstand mitbringt; auf Templates, die das schon
 * tun (.telsche-article), wird es direkt darunter wieder auf 0 gesetzt,
 * um keinen doppelten Rand zu erzeugen. */
.telsche-community-modul {
	display: grid;
	grid-template-columns: minmax(0, 720px) 380px;
	gap: clamp(32px, 4vw, 64px);
	justify-content: center;
	margin-top: 40px;
	padding-left: clamp(20px, 3.5vw, 48px);
	padding-right: clamp(20px, 3.5vw, 48px);
}

.telsche-article .telsche-community-modul {
	padding-left: 0;
	padding-right: 0;
}

@media (max-width: 1023px) {
	.telsche-community-modul {
		grid-template-columns: minmax(0, 720px);
	}
}

.telsche-community-modul__karte {
	grid-column: 1;
	background: var(--wp--preset--color--card-white);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--cardLg);
	padding: 24px 28px 32px;
}

.telsche-comments__leer {
	color: var(--wp--preset--color--text-faint);
	font-size: 14px;
	margin: 0 0 8px;
}

.telsche-community-cta {
	padding-bottom: 20px;
	border-bottom: 1px solid var(--wp--preset--color--border);
}

.telsche-community-cta__body {
	padding-top: 10px;
	display: grid;
	gap: 8px;
}

.telsche-community-cta__frage {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 18px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--wp--preset--color--text-body);
	margin: 0;
}

.telsche-community-cta__text {
	font-size: 14px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-muted);
	margin: 0;
}

.telsche-community-cta__button {
	justify-self: start;
	margin-top: 6px;
	padding: 12px 22px;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--sail-red);
	color: var(--wp--preset--color--white-soft);
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
	font-weight: 600;
	text-decoration: none;
}

.telsche-community-cta__button:hover {
	background: var(--wp--preset--color--sail-red-dark);
}

.telsche-community-cta__button:focus-visible {
	outline: 2px solid var(--wp--preset--color--gold-muted);
	outline-offset: 2px;
}

/* Kommentare - Rahmen/Positionierung kommt jetzt von .telsche-community-modul,
 * die Trennung zur CTA darüber übernimmt deren eigener border-bottom. */
.telsche-comments {
	margin-top: 32px;
}

.telsche-comments__heading {
	font-size: 24px;
	margin: 0 0 20px;
}

.telsche-comment {
	border-bottom: 1px dashed var(--wp--preset--color--border-strong);
	padding: 18px 0;
}

.telsche-comment__meta {
	align-items: center;
	gap: 10px;
}

.telsche-comment__avatar img {
	border-radius: 999px;
}

.telsche-comment__author {
	font-weight: 600;
	font-size: 14.5px;
	color: var(--wp--preset--color--ink);
}

.telsche-comment__date {
	font-size: 11px;
	color: var(--wp--preset--color--text-faint);
}

.telsche-comment .wp-block-comment-content {
	font-size: 15px;
	line-height: 1.6;
	margin-top: 10px;
}

.telsche-comment .wp-block-comment-reply-link {
	font-size: 13px;
	font-weight: 600;
}

/* Pingbacks/Trackbacks: kompakter Einzeiler statt voller Kommentar-Karte */
.telsche-comments li.pingback .telsche-comment,
.telsche-comments li.trackback .telsche-comment {
	padding: 8px 0;
}

.telsche-comments li.pingback .wp-block-comment-content,
.telsche-comments li.trackback .wp-block-comment-content,
.telsche-comments li.pingback .wp-block-comment-reply-link,
.telsche-comments li.trackback .wp-block-comment-reply-link,
.telsche-comments li.pingback .wp-block-avatar,
.telsche-comments li.trackback .wp-block-avatar,
.telsche-comments li.pingback [class*="comment-likes"],
.telsche-comments li.trackback [class*="comment-likes"] {
	display: none;
}

.telsche-comments li.pingback .telsche-comment__meta::before,
.telsche-comments li.trackback .telsche-comment__meta::before {
	content: "Erwähnt in:";
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--wp--preset--color--text-faint);
	white-space: nowrap;
}

.telsche-comments li.pingback .telsche-comment__author,
.telsche-comments li.trackback .telsche-comment__author {
	font-weight: 500;
	font-size: 13.5px;
}

.telsche-comments .wp-block-post-comments-form {
	margin-top: 24px;
}

/* Nur per JS gesetzt (telsche-frontend.js) - ohne JavaScript bleibt das
 * Formular immer normal sichtbar/nutzbar. */
#respond.is-collapsed {
	display: none;
}

.telsche-comments .wp-block-post-comments-form input[type="text"],
.telsche-comments .wp-block-post-comments-form input[type="email"],
.telsche-comments .wp-block-post-comments-form input[type="url"],
.telsche-comments .wp-block-post-comments-form textarea {
	width: 100%;
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: 8px;
	background: var(--wp--preset--color--white-warm);
	padding: 10px 14px;
	font-family: inherit;
	font-size: 14.5px;
}

.telsche-comments .wp-block-post-comments-form input[type="submit"] {
	background: var(--wp--preset--color--hull-green);
	color: var(--wp--preset--color--white-warm);
	border: 0;
	border-radius: var(--wp--custom--radius--button);
	padding: 11px 22px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

.telsche-comments .wp-block-post-comments-form input[type="submit"]:hover {
	background: var(--wp--preset--color--ink);
}

/* Suchergebnis-Seite */
.telsche-suchseite__kopf {
	margin-bottom: clamp(28px, 4vw, 44px);
}

.telsche-suchseite__kopf .wp-block-query-title {
	margin: 8px 0 20px;
}

.telsche-suchseite__form .wp-block-search__input {
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--button);
	background: var(--wp--preset--color--white-warm);
	padding: 11px 16px;
	font-size: 15px;
}

.telsche-suchseite__form .wp-block-search__button {
	background: var(--wp--preset--color--hull-green);
	color: var(--wp--preset--color--white-warm);
	border: 0;
	border-radius: var(--wp--custom--radius--button);
	padding: 11px 22px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

.telsche-suchseite__form .wp-block-search__button:hover {
	background: var(--wp--preset--color--ink);
}

.telsche-suche__anzahl {
	margin-bottom: 14px;
}

.telsche-suche__liste {
	list-style: none;
	margin: 0;
	padding: 0;
}

.telsche-suche__liste > li {
	margin: 0 !important;
	border-bottom: 1px dashed var(--wp--preset--color--border-strong);
}

.telsche-suche__zeile {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 18px 6px;
	text-decoration: none;
	font-family: var(--wp--preset--font-family--figtree);
}

.telsche-suche__zeile:hover {
	background: var(--wp--preset--color--paper);
	text-decoration: none;
}

img.telsche-suche__thumb,
.telsche-suche__thumb {
	width: 76px;
	height: 76px;
	border-radius: 10px;
	object-fit: cover;
	flex-shrink: 0;
}

.telsche-suche__thumb--leer {
	background: var(--wp--preset--color--chip-green);
	display: block;
}

.telsche-suche__text {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.telsche-suche__meta {
	display: flex;
	align-items: baseline;
	gap: 12px;
}

.telsche-suche__datum {
	font-size: 11px;
	color: var(--wp--preset--color--text-faint);
}

.telsche-suche__titel {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 20px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	line-height: 1.3;
}

.telsche-suche__zeile:hover .telsche-suche__titel {
	color: var(--wp--preset--color--sail-red);
}

.telsche-suche__auszug {
	font-size: 14px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-muted);
}

.telsche-suche__pfeil {
	margin-left: auto;
	color: var(--wp--preset--color--sail-red);
	flex-shrink: 0;
}

.telsche-suche__leer {
	padding: 28px;
}

.telsche-suche__leer-titel {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 22px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	margin: 0;
}

.telsche-suche__leer-text {
	font-size: 14.5px;
	color: var(--wp--preset--color--text-muted);
	margin: 10px 0 0;
}

.telsche-suche__leer-links {
	font-size: 14.5px;
	font-weight: 600;
	margin: 12px 0 0;
}

.telsche-suche__nav {
	display: flex;
	justify-content: space-between;
	margin-top: 24px;
	font-size: 14px;
	font-weight: 600;
}

.telsche-suche__nav a {
	color: var(--wp--preset--color--sail-red);
}

@media (max-width: 600px) {
	.telsche-suche__auszug {
		display: none;
	}

	img.telsche-suche__thumb,
	.telsche-suche__thumb {
		width: 56px;
		height: 56px;
	}
}

/* Zitate: roter Left-Border, Newsreader kursiv */
.wp-block-post-content blockquote {
	margin: 28px 0;
	padding: 4px 0 4px 22px;
	border-left: 3px solid var(--wp--preset--color--sail-red);
}

.wp-block-post-content blockquote p {
	font-family: var(--wp--preset--font-family--newsreader);
	font-style: italic;
	font-size: 1.1em;
	line-height: 1.55;
	color: var(--wp--preset--color--ink);
	margin: 0 0 8px;
}

.wp-block-post-content blockquote p:last-child {
	margin-bottom: 0;
}

.wp-block-post-content blockquote cite {
	font-family: var(--wp--preset--font-family--plex-mono);
	font-style: normal;
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-faint);
}

/* ---------------------------------------------------------------------------
 * Topbar
 * ------------------------------------------------------------------------- */
.telsche-topbar {
	min-height: 80px;
	padding: 12px clamp(20px, 3.5vw, 48px);
	background: var(--wp--preset--color--paper);
	border-bottom: 1px solid var(--wp--preset--color--border);
}

.telsche-topbar__wordmark,
.telsche-topbar__wordmark a {
	font-family: var(--wp--preset--font-family--newsreader);
	font-weight: 600;
	font-size: 26px;
	line-height: 1;
	color: var(--wp--preset--color--hull-green);
	text-decoration: none;
	margin: 0;
}

.telsche-topbar__tagline {
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: var(--wp--preset--font-size--mono-xs);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-faint);
	margin: 4px 0 0;
}

.telsche-topbar__nav {
	font-size: 15px;
	font-weight: 600;
}

.telsche-topbar__nav a {
	color: var(--wp--preset--color--text-body);
}

.telsche-topbar__nav .current-menu-item > a,
.telsche-topbar__nav a[aria-current="page"] {
	color: var(--wp--preset--color--sail-red);
	border-bottom: 2px solid var(--wp--preset--color--sail-red);
	padding-bottom: 2px;
}

.telsche-topbar__nav a:hover {
	color: var(--wp--preset--color--sail-red);
	text-decoration: none;
}

/* Mobile Navigation: Overlay im Theme-Look statt WP-Standard */
.telsche-topbar__nav .wp-block-navigation__responsive-container-open,
.telsche-topbar__nav .wp-block-navigation__responsive-container-close {
	color: var(--wp--preset--color--ink);
}

.telsche-topbar__nav .wp-block-navigation__responsive-container-open svg,
.telsche-topbar__nav .wp-block-navigation__responsive-container-close svg {
	width: 28px;
	height: 28px;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--paper);
	/* Eng gehalten, damit das Menue auf einem iPhone ohne Scrollen passt. */
	padding: 12px 24px 16px;
}

/*
 * Schließkreuz fest in die obere rechte Ecke des Overlays.
 *
 * Der Haken, an dem das zweimal hängengeblieben ist: Zwischen Overlay und
 * Kreuz liegen zwei Wrapper (__responsive-close und __responsive-dialog).
 * Bekommt einer davon position: relative, misst das Kreuz seine 14 Pixel von
 * DESSEN Oberkante – und die liegt unter dem „Telsche"-Titel, also genau auf
 * Höhe des Suchfelds. Beide müssen deshalb ausdrücklich static bleiben.
 *
 * Bezugspunkt ist dann der Overlay-Container selbst: Er ist im geöffneten
 * Zustand position: fixed und damit der Containing Block.
 */
.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
	position: static;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	position: absolute;
	top: 12px;
	right: 16px;
	z-index: 5;
	padding: 4px;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open::before {
	content: "Telsche";
	display: block;
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 20px;
	font-weight: 600;
	color: var(--wp--preset--color--hull-green);
	margin-bottom: 2px;
	padding-right: 44px; /* Platz für das Schließkreuz in der Ecke */
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding-top: 6px;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
	width: 100%;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	justify-content: flex-start !important;
	align-items: flex-start !important;
	text-align: left;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	width: 100%;
	padding-left: 16px !important;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	width: 100%;
	border-bottom: 1px dashed var(--wp--preset--color--border-strong);
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item > a {
	width: 100%;
	text-align: left;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item > a {
	display: block;
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 22px;
	font-weight: 500;
	color: var(--wp--preset--color--ink);
	padding: 6px 0;
	border: 0;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item > a[aria-current="page"] {
	color: var(--wp--preset--color--sail-red);
}

/* Themenwelten-Unterpunkte: kleiner, eingerückt, Figtree */
.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	padding: 0 0 4px 16px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0;
	width: 100%;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
	border-bottom: 0;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item > a {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 15.5px;
	font-weight: 500;
	color: var(--wp--preset--color--text-muted);
	padding: 3px 0;
}

/* ---------------------------------------------------------------------------
 * Footer + Partner-Leiste
 * ------------------------------------------------------------------------- */
.telsche-partnerbar {
	padding: 36px clamp(20px, 3.5vw, 48px);
	border-top: 1px solid var(--wp--preset--color--border);
	background: var(--wp--preset--color--paper);
}

.telsche-partnerbar__intro {
	width: 280px;
	flex-shrink: 0;
}

.telsche-partnerbar__cards {
	flex: 1;
	min-width: 300px;
}

.telsche-partnerbar__card {
	position: relative;
	flex: 1;
	min-width: 280px;
	padding: 20px 24px;
}

.telsche-partnerbar__logo {
	width: 110px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--chip-green);
	border-radius: 6px;
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 9px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--text-faint);
	flex-shrink: 0;
	margin: 0;
}

.telsche-partnerbar__name {
	font-size: 15px;
	font-weight: 600;
	margin: 0;
}

.telsche-partnerbar__name a {
	color: var(--wp--preset--color--ink);
}

.telsche-partnerbar__context {
	font-size: 12.5px;
	color: var(--wp--preset--color--text-muted);
	margin: 2px 0 0;
}

.telsche-partnerbar__ad-label {
	position: absolute;
	top: 12px;
	right: 16px;
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 9px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--text-faint-warm);
	margin: 0;
}

.telsche-partnerbar__intro .telsche-eyebrow {
	margin: 0;
}

.telsche-partnerbar__satz {
	font-size: 13.5px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-muted);
	margin: 8px 0 0;
}

.telsche-partnerbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 48px;
}

.telsche-partnerbar__cards {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
}

.telsche-partnerbar__card {
	display: flex;
	align-items: center;
	gap: 20px;
}

.telsche-partnerbar__logo-img {
	width: 110px;
	height: 44px;
	object-fit: contain;
	flex-shrink: 0;
}

.telsche-footer__bar {
	padding: 28px clamp(20px, 3.5vw, 48px);
}

.telsche-footer__wordmark {
	font-family: var(--wp--preset--font-family--newsreader);
	font-weight: 600;
	font-size: 18px;
	color: var(--wp--preset--color--white-warm);
	margin: 0;
}

.telsche-footer__links {
	font-size: 13px;
	font-weight: 500;
}

.telsche-footer__links a {
	color: #c3cdbe;
}

.telsche-footer__links a:hover {
	color: var(--wp--preset--color--white-soft);
	text-decoration: none;
}

/* ---------------------------------------------------------------------------
 * Post-Karten (Index / Archiv)
 * ------------------------------------------------------------------------- */
.telsche-post-card {
	overflow: hidden;
	background: var(--wp--preset--color--card-white);
}

.telsche-post-card .wp-block-post-featured-image img {
	width: 100%;
	height: 180px;
	object-fit: cover;
}

.telsche-post-card__body {
	padding: 18px 20px 20px;
}

.telsche-post-card .wp-block-post-title {
	font-size: 19px;
	font-weight: 600;
	line-height: 1.3;
	margin: 8px 0 0;
}

.telsche-post-card .wp-block-post-title a {
	color: var(--wp--preset--color--ink);
}

.telsche-post-card .wp-block-post-excerpt {
	color: var(--wp--preset--color--text-muted);
	margin-top: 8px;
}

.telsche-post-card .taxonomy-category a {
	color: var(--wp--preset--color--sail-red);
}


/* ---------------------------------------------------------------------------
 * Hub-Banner (grüne Leiste unter der Topbar)
 * ------------------------------------------------------------------------- */
.telsche-hubbanner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding: 10px clamp(20px, 3.5vw, 48px);
	background: var(--wp--preset--color--hull-green);
}

.telsche-hubbanner__label {
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: var(--wp--preset--font-size--mono-xs);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold-muted);
}

.telsche-hubbanner__link {
	font-size: 13px;
	font-weight: 600;
	color: var(--wp--preset--color--teak-light);
	white-space: nowrap;
}

.telsche-hubbanner__link:hover {
	color: var(--wp--preset--color--white-soft);
	text-decoration: none;
}

.telsche-hubbanner p {
	margin: 0;
}

.telsche-hubbanner__link-wrap {
	white-space: nowrap;
}

/* ---------------------------------------------------------------------------
 * Artikel-Layout: Lesespalte 720px + Sidebar 380px, zentriert
 * ------------------------------------------------------------------------- */
.telsche-article {
	padding: clamp(24px, 4vw, 48px) clamp(20px, 3.5vw, 48px) clamp(48px, 6vw, 80px);
}

.telsche-article__layout {
	display: grid;
	grid-template-columns: minmax(0, 720px) 380px;
	gap: clamp(32px, 4vw, 64px);
	justify-content: center;
	align-items: start;
}

.telsche-article__sidebar {
	display: grid;
	gap: 20px;
	align-content: start;
}

@media (max-width: 1023px) {
	.telsche-article__layout {
		grid-template-columns: minmax(0, 720px);
	}
}

.telsche-article__main .wp-block-post-title {
	margin: 14px 0 0;
	text-wrap: balance;
}

.telsche-article__hero img {
	width: 100%;
	max-height: 400px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--cardLg);
}

.telsche-article__hero {
	margin-top: 28px;
}

/* Boots-Seite: Hochkant-Ankerfoto – Ausschnitt tiefer, damit der Rumpf
 * mit Schriftzug nicht abgeschnitten wird. */
.page-template-boot .telsche-article__hero img {
	object-position: center 72%;
}

.telsche-article__main .wp-block-post-content {
	margin-top: 28px;
}

.telsche-article__main .wp-block-post-content h2 {
	margin-top: 44px;
	scroll-margin-top: 24px;
}

/* Manche Überschriften tragen aus der Editor-Historie ein <strong> in sich –
 * sie sollen aussehen wie alle anderen. */
.wp-block-post-content h2 > strong,
.wp-block-post-content h3 > strong,
.wp-block-post-content h4 > strong {
	font-weight: inherit;
}

.telsche-article__main .wp-block-post-content h3 {
	margin-top: 32px;
	scroll-margin-top: 24px;
}

.telsche-article__main .wp-block-post-content img {
	border-radius: var(--wp--custom--radius--card);
	max-width: 100%;
	height: auto;
}

.telsche-article__main .wp-block-post-content figure.wp-block-image {
	margin-left: 0;
	margin-right: 0;
	max-width: 100%;
}

/* ---------------------------------------------------------------------------
 * Breadcrumb (Mono)
 * ------------------------------------------------------------------------- */
.telsche-breadcrumb {
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: var(--wp--preset--font-size--mono-xs);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-faint);
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: baseline;
}

.telsche-breadcrumb a {
	color: var(--wp--preset--color--text-faint);
}

.telsche-breadcrumb a:hover {
	color: var(--wp--preset--color--sail-red);
	text-decoration: none;
}

.telsche-breadcrumb__current {
	color: var(--wp--preset--color--sail-red);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 32ch;
}

/* ---------------------------------------------------------------------------
 * Autor-Zeile
 * ------------------------------------------------------------------------- */
.telsche-autor {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 20px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--wp--preset--color--border);
}

img.telsche-autor__foto {
	width: 40px;
	height: 40px;
	border-radius: 999px;
	object-fit: cover;
	flex-shrink: 0;
}

.telsche-autor__avatar {
	width: 40px;
	height: 40px;
	border-radius: 999px;
	background: var(--wp--preset--color--hull-green);
	color: var(--wp--preset--color--white-warm);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 14px;
	font-weight: 700;
	flex-shrink: 0;
}

.telsche-autor__meta {
	display: grid;
	gap: 2px;
}

.telsche-autor__name {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 14px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
}

/* ---------------------------------------------------------------------------
 * Inhaltsverzeichnis (Sidebar)
 * ------------------------------------------------------------------------- */
.telsche-toc {
	padding: 18px 20px;
}

.telsche-toc__title {
	margin: 0 0 10px;
}

.telsche-toc__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 2px;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
}

.telsche-toc__list li {
	border-left: 2px solid transparent;
	padding: 4px 0 4px 12px;
}

.telsche-toc__list li.is-active {
	border-left-color: var(--wp--preset--color--sail-red);
}

.telsche-toc__list a {
	color: var(--wp--preset--color--text-muted);
}

.telsche-toc__list li.is-active a {
	color: var(--wp--preset--color--sail-red);
	font-weight: 600;
}

.telsche-toc__list a:hover {
	color: var(--wp--preset--color--sail-red);
	text-decoration: none;
}

/*
 * Mobile-TOC (Design-Handoff): cream Box mit grünem Left-Border, rechts
 * abgerundet, nummerierte Einträge – eingeklappt auf 3 Punkte mit
 * "+ N weitere Abschnitte". Desktop zeigt stattdessen das Sidebar-TOC.
 */
.telsche-toc--mobile {
	display: none;
}

@media (max-width: 1023px) {
	.telsche-toc--mobile {
		display: block;
		margin: 20px 0 32px;
		border: 0;
		border-left: 3px solid var(--wp--preset--color--hull-green);
		border-radius: 0 12px 12px 0;
		background: var(--wp--preset--color--cream);
		padding: 14px 16px;
	}

	.telsche-toc--mobile .telsche-toc__list {
		counter-reset: toc;
		gap: 6px;
		font-size: 13px;
		font-weight: 500;
	}

	.telsche-toc--mobile .telsche-toc__list li {
		border-left: 0;
		padding: 0;
		counter-increment: toc;
	}

	.telsche-toc--mobile .telsche-toc__list a {
		color: var(--wp--preset--color--hull-green);
	}

	.telsche-toc--mobile .telsche-toc__list a::before {
		content: counter(toc) ". ";
	}

	.telsche-toc--mobile .telsche-toc__list li.is-active a {
		color: var(--wp--preset--color--sail-red);
	}

	.telsche-toc--mobile .telsche-toc__mehr {
		background: none;
		border: 0;
		padding: 0;
		margin-top: 6px;
		font-family: var(--wp--preset--font-family--figtree);
		font-size: 13px;
		font-weight: 500;
		color: var(--wp--preset--color--text-faint);
		cursor: pointer;
		text-align: left;
	}

	.telsche-article__sidebar .telsche-toc {
		display: none;
	}
}

/* ---------------------------------------------------------------------------
 * Mehr aus dieser Themenwelt (Sidebar)
 * ------------------------------------------------------------------------- */
.telsche-welt-mehr {
	padding: 18px 20px;
}

.telsche-welt-mehr__list {
	list-style: none;
	margin: 12px 0 0;
	padding: 0;
	display: grid;
	gap: 14px;
}

.telsche-welt-mehr__list a {
	display: flex;
	gap: 12px;
	align-items: center;
	text-decoration: none;
}

.telsche-welt-mehr__thumb,
.telsche-welt-mehr__list img.telsche-welt-mehr__thumb {
	width: 64px;
	height: 48px;
	object-fit: cover;
	border-radius: 6px;
	flex-shrink: 0;
}

.telsche-welt-mehr__thumb--empty {
	background: var(--wp--preset--color--chip-green);
}

.telsche-welt-mehr__text {
	display: grid;
	gap: 2px;
}

.telsche-welt-mehr__title {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--wp--preset--color--ink);
}

.telsche-welt-mehr__list a:hover .telsche-welt-mehr__title {
	color: var(--wp--preset--color--sail-red);
}

/* ---------------------------------------------------------------------------
 * Themenwelt-Teaser (Foto-Band am Artikelende)
 * ------------------------------------------------------------------------- */
.telsche-welt-teaser {
	display: block;
	position: relative;
	min-height: 200px;
	margin-top: 48px;
	border-radius: var(--wp--custom--radius--cardLg);
	overflow: hidden;
	background-size: cover;
	background-position: center;
	background-color: var(--wp--preset--color--hull-green);
	text-decoration: none;
}

.telsche-welt-teaser::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--wp--preset--gradient--photo-overlay-left);
}

.telsche-welt-teaser--noimg::before {
	background: none;
}

.telsche-welt-teaser__content {
	position: relative;
	z-index: 1;
	display: grid;
	gap: 6px;
	padding: 28px 32px;
	min-height: 200px;
	align-content: center;
	max-width: 60%;
}

.telsche-welt-teaser__title {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 28px;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--wp--preset--color--white-soft);
}

.telsche-welt-teaser__count {
	font-size: 14px;
	font-weight: 600;
	color: var(--wp--preset--color--teak-light);
}

.telsche-welt-teaser:hover .telsche-welt-teaser__count {
	color: var(--wp--preset--color--white-soft);
}

/* ---------------------------------------------------------------------------
 * Buch-Tipp-Box (inline im Artikel)
 * ------------------------------------------------------------------------- */
.telsche-buchbox {
	margin: 32px 0;
	overflow: hidden;
	font-family: var(--wp--preset--font-family--figtree);
}

.telsche-buchbox__body {
	display: flex;
	gap: 20px;
	padding: 18px 20px;
	align-items: flex-start;
}

.telsche-buchbox__cover,
.telsche-buchbox img.telsche-buchbox__cover {
	width: 92px;
	height: auto;
	border-radius: var(--wp--custom--radius--cover);
	box-shadow: var(--wp--custom--shadow--cover);
	flex-shrink: 0;
}

.telsche-buchbox__cover--empty {
	height: 132px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--chip-green);
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 9px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--wp--preset--color--text-faint);
}

.telsche-buchbox__titel {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 19px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	margin: 0;
	line-height: 1.3;
}

.telsche-buchbox__autor {
	margin: 4px 0 0;
}

.telsche-buchbox__fazit {
	font-size: 14px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-muted);
	margin: 10px 0 0;
}

.telsche-buchbox__cta {
	display: inline-block;
	margin-top: 14px;
	background: var(--wp--preset--color--sail-red);
	color: var(--wp--preset--color--white-soft) !important;
	font-size: 13.5px;
	font-weight: 600;
	border-radius: var(--wp--custom--radius--button);
	padding: 9px 18px;
	transition: background 150ms ease;
}

.telsche-buchbox__cta:hover {
	background: var(--wp--preset--color--sail-red-dark);
	text-decoration: none !important;
}

.telsche-buchbox__fussnote {
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 10px;
	color: var(--wp--preset--color--text-faint-warm);
	margin: 0;
	padding: 10px 20px 14px;
	border-top: 1px dashed var(--wp--preset--color--border-strong);
}

/* ---------------------------------------------------------------------------
 * FAQ (Akkordeon)
 * ------------------------------------------------------------------------- */
.telsche-faq {
	margin: 40px 0 0;
	padding: 18px 20px;
	font-family: var(--wp--preset--font-family--figtree);
}

.telsche-faq .wp-block-details {
	border-bottom: 1px solid var(--wp--preset--color--border);
	padding: 12px 0;
	font-size: 15px;
}

.telsche-faq .wp-block-details:last-child {
	border-bottom: 0;
	padding-bottom: 4px;
}

.telsche-faq summary {
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	cursor: pointer;
	list-style: none;
	position: relative;
	padding-right: 28px;
}

.telsche-faq summary::-webkit-details-marker {
	display: none;
}

.telsche-faq summary::after {
	content: "+";
	position: absolute;
	right: 2px;
	top: 50%;
	transform: translateY(-50%);
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 16px;
	color: var(--wp--preset--color--sail-red);
}

.telsche-faq details[open] summary::after {
	content: "−";
}

.telsche-faq details p {
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--wp--preset--color--text-muted);
	margin: 10px 0 0;
}

/* ---------------------------------------------------------------------------
 * Startseite
 * ------------------------------------------------------------------------- */
.telsche-home {
	padding: clamp(24px, 4vw, 48px) clamp(20px, 3.5vw, 48px) clamp(48px, 6vw, 80px);
	max-width: 1344px;
	margin: 0 auto;
}

.telsche-home__section {
	margin-top: clamp(40px, 6vw, 72px);
}

.telsche-home__heading {
	margin: 6px 0 24px;
}

/* Hero: Feature-Karte + Letzte Einträge */
.telsche-hero {
	display: grid;
	grid-template-columns: 1fr 380px;
	gap: clamp(24px, 3vw, 40px);
	align-items: start;
}

.telsche-hero__main {
	display: flex;
	flex-direction: column;
}

.telsche-hero__feature {
	position: relative;
	display: block;
	min-height: 480px;
	border-radius: var(--wp--custom--radius--frame);
	overflow: hidden;
	background-size: cover;
	background-position: center;
	background-color: var(--wp--preset--color--hull-green);
	text-decoration: none;
}

.telsche-hero__feature::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--wp--preset--gradient--photo-overlay);
}

.telsche-hero__content {
	position: absolute;
	inset: auto 0 0 0;
	z-index: 1;
	display: grid;
	gap: 10px;
	padding: 32px 36px;
}

.telsche-hero__eyebrow {
	color: var(--wp--preset--color--teak-light);
}

.telsche-hero__title {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: clamp(24px, 3vw, 38px);
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--wp--preset--color--white-soft);
	text-wrap: balance;
}

.telsche-hero__date {
	color: var(--wp--preset--color--white-warm);
	opacity: 0.75;
}

/* "Neu & aktualisiert": 3 kompakte Karten mit Thumbnail – bewusst anders
   als die Chronik-Listen, es geht um Content-Updates, nicht um den Feed.
   Die Spalte streckt sich auf die Höhe der Hero-Karte; die Karten teilen
   sich den Platz. */
.telsche-updates {
	display: grid;
	gap: 12px;
	align-content: start;
}

.telsche-updates__head {
	margin: 0 0 2px;
}

.telsche-updates__card {
	display: grid;
	grid-template-columns: 64px 1fr;
	gap: 16px;
	align-items: center;
	padding: 14px 16px;
	text-decoration: none;
	transition: border-color 150ms ease;
}

.telsche-updates__card:hover {
	border-color: var(--wp--preset--color--teak);
}

.telsche-updates__card img.telsche-updates__thumb,
.telsche-updates__thumb {
	width: 64px;
	height: 64px;
	object-fit: cover;
	border-radius: 8px;
	display: block;
}

.telsche-updates__thumb--empty {
	background: var(--wp--preset--color--chip-green);
}

.telsche-updates__text {
	display: grid;
	gap: 3px;
}

.telsche-updates__label {
	color: var(--wp--preset--color--sail-red);
}

.telsche-updates__title {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 17px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--wp--preset--color--ink);
}

.telsche-updates__card:hover .telsche-updates__title {
	color: var(--wp--preset--color--sail-red);
}

.telsche-updates__date {
	margin-top: 2px;
}

.telsche-updates__autor {
	font-size: 10px;
}

.telsche-updates__bullets {
	list-style: none;
	margin: 8px 0 0;
	padding: 0;
	display: grid;
	gap: 4px;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 12.5px;
	line-height: 1.45;
	color: var(--wp--preset--color--text-muted);
}

.telsche-updates__bullets li {
	position: relative;
	padding-left: 16px;
}

.telsche-updates__bullets li::before {
	content: "✓";
	position: absolute;
	left: 0;
	color: var(--wp--preset--color--hull-green);
	font-weight: 700;
}

/* Buch-Variante: Cover im Hochformat + Amazon-CTA (verkauft, nicht nur informiert) */
.telsche-updates__card--buch {
	grid-template-columns: 88px 1fr;
	align-items: start;
}

.telsche-updates__card--buch img.telsche-updates__cover,
.telsche-updates__cover {
	width: 88px;
	height: 128px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--cover);
	box-shadow: var(--wp--custom--shadow--cover);
	display: block;
	margin-top: 4px;
}

.telsche-updates__cover--empty {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--chip-green);
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 8px;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-faint);
}

.telsche-updates__labelrow {
	display: flex;
	justify-content: space-between;
	gap: 8px;
}

a.telsche-updates__title {
	text-decoration: none;
}

.telsche-updates__cta {
	display: inline-block;
	justify-self: start;
	margin-top: 6px;
	background: var(--wp--preset--color--sail-red);
	color: var(--wp--preset--color--white-soft) !important;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 12.5px;
	font-weight: 600;
	border-radius: var(--wp--custom--radius--button);
	padding: 7px 14px;
	transition: background 150ms ease;
}

.telsche-updates__cta:hover {
	background: var(--wp--preset--color--sail-red-dark);
	text-decoration: none !important;
}

/* Community-Hinweis unter dem Feature-Foto - füllt den Weißraum, wenn die
 * "Neu & aktualisiert"-Spalte höher ist als das Foto. Bewusst klein. */
.telsche-hero__community {
	display: grid;
	gap: 12px;
	margin-top: 28px;
}

.telsche-hero__community-label {
	margin: 0 0 2px;
}

.telsche-hero__community-item {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	text-decoration: none;
	color: var(--wp--preset--color--text-muted);
	font-size: 13px;
	line-height: 1.5;
}

.telsche-hero__community-text {
	display: block;
}

.telsche-hero__community-kommentar {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.telsche-hero__community-ziel {
	display: block;
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 11px;
	color: var(--wp--preset--color--text-faint);
	margin-top: 2px;
}

.telsche-hero__community-avatar {
	border-radius: 50%;
	margin-top: 2px;
	flex-shrink: 0;
}

.telsche-hero__community-item strong {
	color: var(--wp--preset--color--text-body);
}

.telsche-hero__community-item:hover strong {
	color: var(--wp--preset--color--sail-red);
}

@media (max-width: 1023px) {
	.telsche-hero {
		grid-template-columns: 1fr;
	}

	.telsche-hero__feature {
		min-height: 340px;
	}
}

/* Geschichten-Teaser (Startseite): zwei grossformatige Foto-Kacheln
   nebeneinander, derselbe Aufbau wie die Hero-Feature-Karte oben
   (Hintergrundbild, Verlaufs-Overlay, Titel unten links), nur kompakter
   und ohne die "Neu & aktualisiert"-Spalte daneben. */
.telsche-geschichtenteaser__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(16px, 2vw, 28px);
}

.telsche-geschichtenteaser__card {
	position: relative;
	display: block;
	min-height: 320px;
	border-radius: var(--wp--custom--radius--frame);
	overflow: hidden;
	background-size: cover;
	background-position: center;
	background-color: var(--wp--preset--color--hull-green);
	text-decoration: none;
}

.telsche-geschichtenteaser__card::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--wp--preset--gradient--photo-overlay);
}

.telsche-geschichtenteaser__content {
	position: absolute;
	inset: auto 0 0 0;
	z-index: 1;
	display: grid;
	gap: 8px;
	padding: 26px 28px;
}

.telsche-geschichtenteaser__eyebrow {
	color: var(--wp--preset--color--teak-light);
}

.telsche-geschichtenteaser__title {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: clamp(20px, 2.4vw, 30px);
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--wp--preset--color--white-soft);
	text-wrap: balance;
}

@media (max-width: 720px) {
	.telsche-geschichtenteaser__grid {
		grid-template-columns: 1fr;
	}

	.telsche-geschichtenteaser__card {
		min-height: 260px;
	}
}

/* Themenwelt-Kacheln */
.telsche-welten {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
}

.telsche-welten__tile {
	position: relative;
	display: block;
	height: 320px;
	border-radius: var(--wp--custom--radius--cardLg);
	overflow: hidden;
	background-size: cover;
	background-position: center;
	background-color: var(--wp--preset--color--hull-green);
	text-decoration: none;
}

.telsche-welten__tile::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--wp--preset--gradient--photo-overlay);
}

.telsche-welten__content {
	position: absolute;
	inset: auto 0 0 0;
	z-index: 1;
	display: grid;
	gap: 6px;
	padding: 18px 20px;
}

.telsche-welten__title {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 21px;
	font-weight: 600;
	letter-spacing: -0.01em;
	color: var(--wp--preset--color--white-soft);
	line-height: 1.2;
}

.telsche-welten__meta {
	color: var(--wp--preset--color--teak-light);
}

@media (max-width: 1023px) {
	.telsche-welten {
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
	}

	.telsche-welten__tile {
		height: 200px;
	}
}

/* Logbuch-Feed + Sidebar */
.telsche-home__split {
	display: grid;
	grid-template-columns: 1fr 380px;
	gap: clamp(24px, 3vw, 40px);
	align-items: start;
}

.telsche-home__sidebar {
	display: grid;
	gap: 20px;
	margin-top: 58px;
}

.telsche-home__more {
	margin-top: 20px;
	font-weight: 600;
	font-size: 14.5px;
}

@media (max-width: 1023px) {
	.telsche-home__split {
		grid-template-columns: 1fr;
	}

	.telsche-home__sidebar {
		margin-top: 8px;
	}
}

/* Boot-Band (Sidebar): grünes Band mit Strichzeichnung – bewusst anders als Artikel-Kacheln */
.telsche-bootband {
	display: block;
	border-radius: var(--wp--custom--radius--cardLg);
	overflow: hidden;
	background: var(--wp--preset--color--hull-green);
	text-decoration: none;
}

/* Zeichnung groß zeigen – gleicher Grünton wie das Band, daher nahtlos.
   Boot nach rechts angeschnitten, Textzone links bleibt frei. */
.telsche-bootband__zeichnung {
	display: block;
	width: 100%;
	height: 320px;
	object-fit: contain;
	object-position: center bottom;
	transform: translateX(14%) scale(1.7);
	transform-origin: 50% 70%;
}

.telsche-bootband__content {
	position: relative;
	z-index: 1;
	display: grid;
	gap: 4px;
	padding: 0 20px 20px;
	margin-top: -56px;
}

.telsche-bootband__name {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 24px;
	font-weight: 600;
	color: var(--wp--preset--color--white-soft);
}

.telsche-bootband__specs {
	color: var(--wp--preset--color--teak-light);
}

.telsche-bootband__link {
	margin-top: 8px;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
	font-weight: 600;
	color: var(--wp--preset--color--gold-muted);
}

.telsche-bootband:hover .telsche-bootband__link {
	color: var(--wp--preset--color--white-soft);
}

/* Kompakte Sidebar-Variante (SEO-Einstiegsseiten) */
.telsche-bootband--kompakt .telsche-bootband__zeichnung {
	height: 230px;
	transform: translateX(14%) scale(1.7);
	transform-origin: 50% 70%;
}

.telsche-bootband--kompakt .telsche-bootband__content {
	margin-top: -58px;
	padding-bottom: 16px;
}

.telsche-bootband--kompakt .telsche-bootband__name {
	font-size: 20px;
}

.telsche-bootband--kompakt .telsche-bootband__specs {
	font-size: 10px;
}

/* Bordbibliothek-Teaser (grünes Band) */
.telsche-bibteaser {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	background: var(--wp--preset--color--hull-green);
	border-radius: var(--wp--custom--radius--cardLg);
	padding: 22px 24px;
	text-decoration: none;
	overflow: hidden;
}

.telsche-bibteaser__text {
	display: grid;
	gap: 6px;
}

.telsche-bibteaser__title {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 19px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--wp--preset--color--white-soft);
}

.telsche-bibteaser__link {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13px;
	font-weight: 600;
	color: var(--wp--preset--color--teak-light);
}

.telsche-bibteaser:hover .telsche-bibteaser__link {
	color: var(--wp--preset--color--white-soft);
}

.telsche-bibteaser__covers {
	display: flex;
	flex-shrink: 0;
}

.telsche-bibteaser__covers img.telsche-bibteaser__cover {
	width: 56px;
	height: 80px;
	object-fit: cover;
	border-radius: 3px;
	box-shadow: var(--wp--custom--shadow--cover);
}

.telsche-bibteaser__covers img.telsche-bibteaser__cover:nth-child(1) {
	transform: rotate(-4deg);
}

.telsche-bibteaser__covers img.telsche-bibteaser__cover:nth-child(2) {
	transform: rotate(3deg) translateX(-8px);
}

.telsche-bibteaser__covers img.telsche-bibteaser__cover:nth-child(3) {
	transform: rotate(-2deg) translateX(-16px);
}

/* Bootstankstellen-Teaser (rotes Band, Haefen/Ankerplaetze-Seitenleiste) */
.telsche-tankteaser {
	display: flex;
	align-items: center;
	gap: 16px;
	background: var(--wp--preset--color--sail-red-dark);
	border-radius: var(--wp--custom--radius--cardLg);
	padding: 22px 24px;
	text-decoration: none;
}

.telsche-tankteaser__text {
	display: grid;
	gap: 6px;
}

.telsche-tankteaser__title {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 19px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--wp--preset--color--white-soft);
}

.telsche-tankteaser__link {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13px;
	font-weight: 600;
	color: var(--wp--preset--color--teak-light);
}

.telsche-tankteaser:hover .telsche-tankteaser__link {
	color: var(--wp--preset--color--white-soft);
}

/* Podcast-Teaser (dunkles Band, sitewide Seitenleiste) */
.telsche-podcastteaser {
	display: flex;
	flex-direction: column;
	gap: 16px;
	background: var(--wp--preset--color--sail-red-dark);
	border-radius: var(--wp--custom--radius--cardLg);
	padding: 22px 24px;
}

.telsche-podcastteaser__top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
}

.telsche-podcastteaser__text {
	display: grid;
	gap: 6px;
}

.telsche-podcastteaser__title {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 19px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--wp--preset--color--white-soft);
}

.telsche-podcastteaser__icon {
	flex-shrink: 0;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	box-shadow: var(--wp--custom--shadow--cover);
}

.telsche-podcastteaser__links {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 20px;
}

.telsche-podcastteaser__link {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13px;
	font-weight: 600;
	color: var(--wp--preset--color--teak-light);
	text-decoration: none;
}

.telsche-podcastteaser__link:hover {
	color: var(--wp--preset--color--white-soft);
}

.telsche-podcastteaser__folgen {
	display: grid;
	gap: 10px;
	margin-top: 2px;
	padding: 14px 16px;
	background: rgba(0, 0, 0, 0.18);
	border-radius: var(--wp--custom--radius--card);
}

.telsche-podcastteaser__folgen-label {
	color: var(--wp--preset--color--white-warm);
	opacity: 0.65;
}

.telsche-podcastteaser__folgenliste {
	display: grid;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.telsche-podcastteaser__folge {
	position: relative;
	padding-left: 26px;
	display: grid;
	gap: 3px;
}

.telsche-podcastteaser__folge::before {
	/* Echte Folgennummer aus data-nummer (Position im Gesamt-Feed), nicht
	 * ein reiner CSS-Zähler - der würde nur die Anzeigereihenfolge (neueste
	 * zuerst) hochzählen statt die tatsächliche Folgennummer zu zeigen. */
	content: attr(data-nummer);
	position: absolute;
	left: 0;
	top: 1px;
	width: 17px;
	height: 17px;
	border-radius: 50%;
	background: var(--wp--preset--color--gold-muted);
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 10.5px;
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.telsche-podcastteaser__folge-titel {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
	font-weight: 600;
	color: var(--wp--preset--color--white-soft);
}

.telsche-podcastteaser__folge-text {
	font-size: 12.5px;
	line-height: 1.4;
	color: var(--wp--preset--color--white-warm);
	opacity: 0.75;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Podcast-Hinweis inline im Artikeltext - schmal, max. zwei Zeilen,
 * bewusst unauffaelliger als der grosse Podcast-Teaser. */
.telsche-podcast-inline {
	display: flex;
	align-items: baseline;
	gap: 8px;
	margin: 24px 0;
	padding: 10px 16px;
	border-left: 3px solid var(--wp--preset--color--sail-red);
	background: var(--wp--preset--color--cream);
	border-radius: 0 var(--wp--custom--radius--card) var(--wp--custom--radius--card) 0;
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-body);
}

.telsche-podcast-inline__icon {
	flex-shrink: 0;
}

.telsche-podcast-inline__link {
	color: var(--wp--preset--color--sail-red);
	font-weight: 600;
	text-decoration: none;
}

.telsche-podcast-inline__link:hover {
	color: var(--wp--preset--color--sail-red-dark);
}

/* ---------------------------------------------------------------------------
 * Themen-Hub
 * ------------------------------------------------------------------------- */
.telsche-hub__inner {
	max-width: 1344px;
	margin: 0 auto;
	padding: clamp(24px, 4vw, 48px) clamp(20px, 3.5vw, 48px) clamp(48px, 6vw, 80px);
}

.telsche-hub__hero {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(24px, 4vw, 56px);
	align-items: center;
	margin-top: 20px;
}

.telsche-hub__hero-text .wp-block-post-title {
	margin: 10px 0 0;
	text-wrap: balance;
}

.telsche-hub__intro {
	margin-top: 16px;
	font-size: 16.5px;
	line-height: 1.65;
	color: var(--wp--preset--color--text-muted);
	max-width: 54ch;
}

/* Hub-Zweispalter: unter 1024px untereinander */
@media (max-width: 1023px) {
	.telsche-hubspalten {
		flex-wrap: wrap !important;
	}

	.telsche-hubspalten .wp-block-column {
		flex-basis: 100% !important;
	}
}

.telsche-hub__hero-img img {
	width: 100%;
	height: 320px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--frame);
}

/*
 * Wo der Ausschnitt eines Hero-Bilds sitzt, hängt am Motiv, nicht am
 * Seitenformat – deshalb steht die Position nicht hier, sondern je Seite im
 * Feld telsche_hero_fokus (siehe telsche_hero_fokus() in functions.php).
 */

@media (max-width: 1023px) {
	.telsche-hub__hero {
		grid-template-columns: 1fr;
	}

	.telsche-hub__hero-img img {
		height: 220px;
	}
}

.telsche-hub .wp-block-post-content {
	margin-top: clamp(28px, 4vw, 48px);
	font-size: 16px;
	line-height: 1.65;
	max-width: 74ch;
}

.telsche-hub .wp-block-post-content h2 {
	margin-top: 40px;
}

.telsche-hub__hero-text .telsche-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 22px;
}

/* Hub-Split: Route + Karte links (Rail), Orte + Logbuch rechts */
.telsche-hub__split {
	display: grid;
	grid-template-columns: 400px 1fr;
	gap: clamp(28px, 4vw, 56px);
	align-items: start;
	margin-top: clamp(36px, 5vw, 56px);
}

@media (max-width: 1023px) {
	.telsche-hub__split {
		grid-template-columns: 1fr;
	}
}

.telsche-hub__rail {
	display: grid;
	gap: 20px;
}

.telsche-hub__main {
	display: grid;
	gap: clamp(32px, 4vw, 48px);
	align-content: start;
}

/* Direktes Heading im Hub-Main (z. B. "Die Ausrüstungsliste") bekommt seinen
 * Abstand nach unten schon vom Grid-Gap - eigener Margin würde sich
 * addieren und den Abstand doppelt so groß wirken lassen wie bei der
 * Bordbibliothek. */
.telsche-hub__main > .wp-block-heading {
	margin: 0;
}

/* Guide-Trennband: klare Zäsur zwischen Hub-Modulen und Langtext */
.telsche-hub__guideband {
	margin-top: clamp(40px, 6vw, 72px);
	background: var(--wp--preset--color--cream);
	border-top: 1px solid var(--wp--preset--color--border-strong);
	border-bottom: 1px solid var(--wp--preset--color--border-strong);
}

.telsche-hub__guideband-inner {
	max-width: 1344px;
	margin: 0 auto;
	padding: 22px clamp(20px, 3.5vw, 48px);
}

.telsche-hub__guideband-titel {
	margin: 4px 0 0 !important;
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 26px !important;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--wp--preset--color--ink);
}

/* FAQ-Label als H2 (semantisch), optisch weiter Eyebrow */
h2.telsche-faq__h2 {
	margin: 0 0 4px !important;
	font-family: var(--wp--preset--font-family--plex-mono) !important;
	font-size: var(--wp--preset--font-size--mono-xs) !important;
	font-weight: 400 !important;
	letter-spacing: 0.14em !important;
	line-height: 1.4;
}

.telsche-hub__guide {
	padding-top: clamp(28px, 4vw, 44px) !important;
}

.telsche-hub__guide-layout {
	padding: 0;
}

.telsche-hub__guide .wp-block-post-content {
	margin-top: 28px;
	max-width: none;
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: var(--wp--preset--font-size--body-serif);
	line-height: 1.68;
}

.telsche-hub__guide .wp-block-post-content h2 {
	margin-top: 44px;
	scroll-margin-top: 24px;
}

.telsche-hub__guide .wp-block-post-content > h2:first-child {
	margin-top: 0;
}

/* Routen-Karte mit angedocktem Revier-Buch */
.telsche-weltroute {
	max-width: none;
}

.telsche-weltroute__head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
	margin-bottom: 16px;
}

.telsche-weltroute__karte-link {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
}

/* Törn-Routenbox: Dauerzeile unter dem Kopf, Stationen als Links */
.telsche-weltroute__dauer {
	margin: -6px 0 16px;
	font-size: 13px;
	color: var(--wp--preset--color--text-muted);
}

.telsche-weltroute .telsche-route__name a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.telsche-weltroute .telsche-route__name a:hover {
	color: var(--wp--preset--color--sail-red);
}

.telsche-weltroute__buch {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-top: 18px;
	padding-top: 16px;
	border-top: 1px solid var(--wp--preset--color--border);
}

.telsche-weltroute__buch img.telsche-weltroute__cover {
	width: 42px;
	height: 60px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--cover);
	box-shadow: var(--wp--custom--shadow--cover);
	flex-shrink: 0;
}

.telsche-weltroute__buch-text {
	display: grid;
	gap: 3px;
	flex: 1;
	min-width: 0;
}

.telsche-weltroute__buch-titel {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 14px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
}

.telsche-weltroute__cta {
	background: var(--wp--preset--color--sail-red);
	color: var(--wp--preset--color--white-soft) !important;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 12.5px;
	font-weight: 600;
	border-radius: var(--wp--custom--radius--button);
	padding: 8px 14px;
	flex-shrink: 0;
	transition: background 150ms ease;
}

.telsche-weltroute__cta:hover {
	background: var(--wp--preset--color--sail-red-dark);
	text-decoration: none !important;
}

/* Orte-Verzeichnis (Übersichts-Hubs): skalierende Zeilen-Liste */
.telsche-verzeichnis__heading {
	margin: 0 0 14px !important;
}

.telsche-verzeichnis__controls {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 4px 0 10px;
}

/* Jede Filter-Dimension (Revier, Epoche) ist eine eigene Chip-Gruppe -
   ohne eigenes flex-wrap hier wickeln ihre Chips als Inline-Elemente um
   und kleben dann ohne Zeilenabstand aneinander, statt den 8px-Gap der
   Eltern-Reihe zu bekommen. */
.telsche-verzeichnis__chipgroup {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

/* Suchfeld als weißer Chip am Ende der Filterreihe */
.telsche-verzeichnis__suche {
	width: 150px;
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--card-white);
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13px;
	padding: 6px 14px;
	transition: width 150ms ease;
}

.telsche-verzeichnis__suche:focus {
	outline: 2px solid var(--wp--preset--color--hull-green);
	outline-offset: -1px;
	width: 220px;
}

.telsche-verzeichnis__leer p {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 14.5px;
	color: var(--wp--preset--color--text-muted);
	padding: 24px 0;
}

.telsche-verzeichnis__pagination {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 20px;
}

.telsche-verzeichnis__pagination .telsche-mono {
	margin-right: 8px;
}

.telsche-verzeichnis--liste {
	list-style: none;
	margin: 0;
	padding: 0;
}

.telsche-verzeichnis--liste li {
	border-bottom: 1px dashed var(--wp--preset--color--border-strong);
}

.telsche-verzeichnis__zeile {
	display: grid;
	grid-template-columns: 96px 1fr auto;
	gap: 18px;
	align-items: center;
	padding: 16px 0;
	text-decoration: none;
}

.telsche-verzeichnis__thumb,
.telsche-verzeichnis--liste img.telsche-verzeichnis__thumb {
	width: 96px;
	height: 72px;
	object-fit: cover;
	border-radius: 8px;
	display: block;
	background: var(--wp--preset--color--chip-green);
}

.telsche-verzeichnis__text {
	display: grid;
	gap: 3px;
	min-width: 0;
}

.telsche-verzeichnis__name {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 19px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--wp--preset--color--ink);
}

.telsche-verzeichnis__zeile:hover .telsche-verzeichnis__name {
	color: var(--wp--preset--color--sail-red);
}

.telsche-verzeichnis__kurz {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-muted);
}

.telsche-verzeichnis__fakten {
	font-size: 10px;
	margin-top: 2px;
}

.telsche-verzeichnis__pfeil {
	color: var(--wp--preset--color--sail-red);
	font-size: 18px;
}

@media (max-width: 600px) {
	.telsche-verzeichnis__zeile {
		grid-template-columns: 72px 1fr auto;
		gap: 12px;
	}

	.telsche-verzeichnis__thumb,
	.telsche-verzeichnis--liste img.telsche-verzeichnis__thumb {
		width: 72px;
		height: 56px;
	}
}

/* Übersichts-Template: Content luftig, Überschrift mit Abstand */
.telsche-hub__main .wp-block-post-content {
	font-size: 16px;
	line-height: 1.65;
}

.telsche-hub__main .wp-block-post-content > p:first-child {
	margin-top: 0;
	max-width: 66ch;
	color: var(--wp--preset--color--text-muted);
}

.telsche-hub__main .wp-block-post-content h2 {
	margin: 36px 0 4px;
}

/* Törn-Varianten-Modul: drei große Zahlen, Text zum Umschalten */
.telsche-varianten__body {
	padding: 16px 18px 18px;
}

.telsche-varianten__intro {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-muted);
	margin: 0 0 14px;
}

.telsche-varianten__zahlen {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
}

.telsche-varianten__zahl {
	display: grid;
	gap: 2px;
	justify-items: center;
	padding: 12px 6px 10px;
	background: transparent;
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--card);
	cursor: pointer;
	transition: background 150ms ease, border-color 150ms ease;
}

.telsche-varianten__zahl.is-active {
	background: var(--wp--preset--color--chip-green);
	border-color: var(--wp--preset--color--hull-green);
}

.telsche-varianten__wert {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 26px;
	font-weight: 700;
	line-height: 1;
	color: var(--wp--preset--color--sail-red);
}

.telsche-varianten__einheit {
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 9px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-faint);
}

.telsche-varianten__label {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 11px;
	font-weight: 600;
	line-height: 1.25;
	text-align: center;
	color: var(--wp--preset--color--text-body);
}

.telsche-varianten__text {
	margin-top: 14px;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--wp--preset--color--text-body);
}

.telsche-varianten__text p {
	margin: 0;
}

/* Empfehlungs-Box extern (Rail) */
.telsche-externbox__body {
	padding: 14px 18px 16px;
	font-family: var(--wp--preset--font-family--figtree);
}

.telsche-externbox__titel {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 17px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--wp--preset--color--ink);
	margin: 0;
}

.telsche-externbox__text {
	font-size: 13px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-muted);
	margin: 8px 0 0;
}

.telsche-externbox__link {
	display: inline-block;
	margin-top: 10px;
	font-size: 13px;
	font-weight: 600;
}

/* Marken-Box (Rail) */
.telsche-markenbox__liste {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 16px 18px 18px;
}

.telsche-tag {
	display: inline-block;
	padding: 5px 12px;
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--pill);
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 12.5px;
	font-weight: 500;
	color: var(--wp--preset--color--text-body);
}

/* Geschichte-Box (Rail) */
.telsche-storybox {
	display: block;
	overflow: hidden;
	text-decoration: none;
	font-family: var(--wp--preset--font-family--figtree);
}

/* Story-Teaser in der Hub-Hauptspalte: zweispaltig über "Aus dem Logbuch" */
.telsche-storyreihe {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	margin-bottom: 40px;
}

.telsche-storyreihe > * {
	margin-block-start: 0 !important;
}

.telsche-storyreihe .telsche-storybox img.telsche-storybox__bild {
	height: 180px;
}

@media (max-width: 781px) {
	.telsche-storyreihe {
		grid-template-columns: 1fr;
	}
}

.telsche-storybox img.telsche-storybox__bild {
	width: 100%;
	height: 150px;
	object-fit: cover;
	display: block;
}

.telsche-storybox__body {
	display: grid;
	gap: 5px;
	padding: 14px 18px 16px;
}

.telsche-storybox__titel {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 17px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--wp--preset--color--ink);
}

.telsche-storybox:hover .telsche-storybox__titel {
	color: var(--wp--preset--color--sail-red);
}

.telsche-storybox__text {
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-muted);
}

.telsche-storybox__link {
	font-size: 13px;
	font-weight: 600;
	color: var(--wp--preset--color--sail-red);
}

/* Tagestörn-Box: Preiszeile in der telsche-storybox-Karte */
.telsche-tagestoernbox__preis {
	font-weight: 600;
	color: var(--wp--preset--color--sail-red);
}

/* Tagestörn-Box, Variante "band": eigenständige Optik, KEINE
 * Wiederverwendung von telsche-ueberboot - dieser Block landet in
 * unterschiedlich breiten Spalten (Hafen-Artikel mit Sidebar,
 * Guide-Hub-Seiten ohne Sidebar), deshalb immer gestapelt (Foto oben,
 * Text darunter) und jede Farbe explizit gesetzt, statt auf eine nur
 * auf einer anderen Seite gescopte h2-Farbe zu vertrauen. */
.telsche-tagestoernbox--band {
	display: block;
	background: var(--wp--preset--color--hull-green);
	border-radius: var(--wp--custom--radius--cardLg);
	overflow: hidden;
	margin: clamp(28px, 4vw, 40px) 0;
	text-decoration: none;
}

.telsche-tagestoernbox--band__foto img {
	width: 100%;
	height: 200px;
	object-fit: cover;
	display: block;
	margin: 0;
}

.telsche-tagestoernbox--band__body {
	display: block;
	padding: 24px 28px 28px;
}

.telsche-tagestoernbox--band__titel {
	display: block;
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 24px;
	line-height: 1.25;
	font-weight: 600;
	color: var(--wp--preset--color--white-warm);
	margin: 10px 0 0;
}

.telsche-tagestoernbox--band__text {
	display: block;
	font-size: 14.5px;
	line-height: 1.6;
	color: #c3cdbe;
	margin: 10px 0 0;
	max-width: 60ch;
}

.telsche-tagestoernbox--band__preis {
	display: block;
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 22px;
	font-weight: 700;
	color: var(--wp--preset--color--white-warm);
	margin: 14px 0 0;
}

.telsche-tagestoernbox--band__cta {
	display: block;
	font-size: 14px;
	font-weight: 600;
	color: var(--wp--preset--color--teak-light);
	margin: 14px 0 0;
}

.telsche-tagestoernbox--band:hover .telsche-tagestoernbox--band__cta {
	text-decoration: underline;
}

/* Tagestörn-Box, Variante "streifen": schmale Vollbreite-Leiste ganz
 * unten auf der Startseite, gleiches Platzierungsprinzip wie
 * telsche-hubbanner (außerhalb des breitenbegrenzten Hauptbereichs). */
.telsche-tagestoernbox--streifen {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	padding: 14px clamp(20px, 3.5vw, 48px);
	background: var(--wp--preset--color--hull-green);
	text-decoration: none;
}

.telsche-tagestoernbox--streifen__text {
	color: var(--wp--preset--color--white-warm);
	font-size: 14.5px;
}

.telsche-tagestoernbox--streifen__link {
	color: var(--wp--preset--color--teak-light);
	font-size: 14px;
	font-weight: 600;
}

/* Hinweisbox: deutlich abgesetzter Hinweistext (z. B. Unverbindlichkeit),
 * gleiche Kastenoptik wie telsche-merkbox, aber ohne deren Punkte-Liste. */
.telsche-hinweisbox {
	margin: 24px 0 34px;
	padding: 18px 22px;
	background: var(--wp--preset--color--cream);
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--frame);
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--wp--preset--color--text-body);
}

.telsche-hinweisbox p {
	margin: 0;
}

/* Themen-Einstiege: 2×2 Foto-Kacheln */
.telsche-einstiegskarten {
	grid-template-columns: repeat(2, 1fr) !important;
}

.telsche-einstiegskarten .telsche-welten__tile {
	height: 200px;
}

/* Modell-Flotte */
.telsche-verzeichnis__thumb--boot {
	background: var(--wp--preset--color--hull-green) url('../img/telsche-strichzeichnung.png') center 35% / 150% no-repeat;
}

.telsche-verzeichnis__zeile--offen {
	text-decoration: none;
}

.telsche-modell__folgt {
	white-space: nowrap;
	font-size: 9px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	border: 1px dashed var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--pill);
	padding: 5px 10px;
}

/*
 * Guide-Teaser: Foto-Kacheln unter der Artikel-Liste.
 *
 * ZUR FORM, weil das sonst wie ein Versehen aussieht.
 *
 * Kacheln der obersten Ebene -- die vier Themenwelten -- sind 320 Pixel hoch
 * und bei vier Spalten damit rund 298 x 320: quadratisch. Alles darunter, die
 * Guides eines Reviers und die Kaufberatungen der Bordbibliothek, ist genau
 * halb so hoch: 160 Pixel, rund 1,9:1, ein flacher Streifen.
 *
 * Daraus folgt eine Bedingung an die Titel: Bei 18 Pixeln bleiben nach den
 * Innenabstaenden 124 Pixel fuer Text. Zwei Zeilen Titel plus Metazeile
 * brauchen 66 davon, drei Zeilen 88 -- dann ist die Kachel ueberwiegend
 * Schrift und das Foto nur noch Hintergrund. Wer hier einen Titel setzt,
 * haelt ihn kurz.
 *
 * Warum die Form und nicht nur die Groesse: Die beiden Reihen stehen nie
 * nebeneinander -- zwischen ihnen liegt ein ganzer Abschnitt. Ein reiner
 * Groessenunterschied verpufft dann, weil das Auge nichts zum Vergleichen
 * hat. Ein Formatwechsel erkennt man auch einzeln. Dazu eine Stufe kleinere
 * Schrift, damit die Kachel als Ganzes eine Ebene tiefer wirkt.
 */
.telsche-guideteaser {
	grid-template-columns: repeat(2, 1fr) !important;
	margin-top: 8px;
}

.telsche-guideteaser .telsche-welten__tile,
.telsche-kaufberatungen .telsche-welten__tile {
	height: 160px;
}

.telsche-guideteaser .telsche-welten__title,
.telsche-kaufberatungen .telsche-welten__title {
	font-size: 18px;
	line-height: 1.25;
}

@media (max-width: 700px) {
	.telsche-guideteaser {
		grid-template-columns: 1fr !important;
	}

}

/* Häfen & Ankerplätze-Sektion */
.telsche-weltorte {
	scroll-margin-top: 24px;
}

.telsche-weltorte__head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
}

.telsche-weltorte__heading {
	margin: 0 0 20px;
}

.telsche-weltorte__mehr {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
	font-weight: 600;
	white-space: nowrap;
}

.telsche-weltorte__kacheln {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
	align-items: stretch;
}

/* Unter 900 px zwei Spalten – vier Kacheln ergeben dann ein sauberes 2 × 2
   statt einer einzelnen Kachel in der zweiten Reihe. */
@media (max-width: 900px) {
	.telsche-weltorte__kacheln {
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
	}
}

.telsche-ortkachel {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	text-decoration: none;
}

.telsche-ortkachel img.telsche-ortkachel__bild,
.telsche-ortkachel__bild--leer {
	width: 100%;
	height: 150px;
	object-fit: cover;
	display: block;
	background: var(--wp--preset--color--chip-green);
}

.telsche-ortkachel__body {
	display: grid;
	gap: 5px;
	padding: 14px 18px 16px;
}

.telsche-ortkachel__name {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 19px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--wp--preset--color--ink);
}

.telsche-ortkachel:hover .telsche-ortkachel__name {
	color: var(--wp--preset--color--sail-red);
}

.telsche-ortkachel__text {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-muted);
}

.telsche-ortkachel__fakten {
	font-size: 10px;
	line-height: 1.6;
	border-top: 1px dashed var(--wp--preset--color--border-strong);
	padding-top: 8px;
	margin-top: 4px;
}

/* Routen-Stationen-Karte */
.telsche-route {
	padding: 20px 22px;
	max-width: 420px;
}

.telsche-route__station {
	position: relative;
	padding: 0 0 18px 26px;
}

.telsche-route__station::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 6px;
	width: 10px;
	height: 10px;
	border-radius: 999px;
	background: var(--wp--preset--color--sail-red);
}

.telsche-route__station--start::before,
.telsche-route__station--ziel::before {
	background: var(--wp--preset--color--hull-green);
}

.telsche-route__station::after {
	content: "";
	position: absolute;
	left: 8px;
	top: 20px;
	bottom: -2px;
	border-left: 1px dashed var(--wp--preset--color--border-strong);
}

.telsche-route__station:last-child {
	padding-bottom: 0;
}

.telsche-route__station:last-child::after {
	display: none;
}

.telsche-route__name {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 14.5px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	margin: 0;
}

.telsche-route__note {
	font-size: 12.5px;
	color: var(--wp--preset--color--text-muted);
	margin: 2px 0 0;
}

/* Artikel-Liste der Themenwelt */
.telsche-weltliste {
	margin-top: clamp(32px, 5vw, 56px);
}

.telsche-weltliste__head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	border-bottom: 2px solid var(--wp--preset--color--ink);
	padding-bottom: 10px;
}

.telsche-weltliste__head p {
	margin: 0;
}

.telsche-weltliste__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.telsche-weltliste__list li {
	border-bottom: 1px dashed var(--wp--preset--color--border-strong);
}

.telsche-weltliste__list a {
	display: grid;
	grid-template-columns: 72px 64px 1fr;
	gap: 16px;
	align-items: center;
	padding: 14px 0;
	text-decoration: none;
}

.telsche-weltliste__date {
	text-transform: uppercase;
	white-space: nowrap;
}

.telsche-weltliste__thumb,
.telsche-weltliste__list img.telsche-weltliste__thumb {
	width: 64px;
	height: 48px;
	object-fit: cover;
	border-radius: 6px;
}

.telsche-weltliste__thumb--empty {
	display: block;
	background: var(--wp--preset--color--chip-green);
}

.telsche-weltliste__text {
	display: grid;
	gap: 3px;
}

.telsche-weltliste__title {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--wp--preset--color--ink);
}

.telsche-weltliste__list a:hover .telsche-weltliste__title {
	color: var(--wp--preset--color--sail-red);
}

/* ---------------------------------------------------------------------------
 * Bordbibliothek
 * ------------------------------------------------------------------------- */
.telsche-bib__hero {
	background: var(--wp--preset--color--hull-green);
}

.telsche-bib__hero-inner {
	max-width: 1344px;
	margin: 0 auto;
	padding: clamp(36px, 5vw, 64px) clamp(20px, 3.5vw, 48px);
}

.telsche-bib__title {
	color: var(--wp--preset--color--white-soft);
	margin: 10px 0 0;
	max-width: 18ch;
}

.telsche-bib__sub {
	color: var(--wp--preset--color--teak-light);
	font-size: 15.5px;
	margin: 14px 0 0;
	max-width: 52ch;
}

.telsche-bib__hero-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 32px;
	flex-wrap: wrap;
}

/* Cover-Fächer im Hero */
.telsche-coverfaecher {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	padding-right: 24px;
}

.telsche-coverfaecher img.telsche-coverfaecher__cover {
	width: 110px;
	height: 158px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--cover);
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.4);
}

.telsche-coverfaecher img.telsche-coverfaecher__cover:nth-child(1) {
	transform: rotate(-4deg);
}

.telsche-coverfaecher img.telsche-coverfaecher__cover:nth-child(2) {
	transform: rotate(3deg) translateX(-14px);
}

.telsche-coverfaecher img.telsche-coverfaecher__cover:nth-child(3) {
	transform: rotate(-2deg) translateX(-28px);
}

@media (max-width: 782px) {
	.telsche-coverfaecher {
		display: none;
	}
}

.telsche-bib__inner {
	max-width: 1344px;
	margin: 0 auto;
	padding: clamp(28px, 4vw, 48px) clamp(20px, 3.5vw, 48px) clamp(48px, 6vw, 80px);
}

.telsche-bib__split {
	display: grid;
	grid-template-columns: 480px 1fr;
	gap: clamp(28px, 4vw, 48px);
	align-items: start;
	margin-top: 8px;
}

@media (max-width: 1100px) {
	.telsche-bib__split {
		grid-template-columns: 1fr;
	}
}

.telsche-bib__regal .wp-block-heading {
	margin: 0 0 18px;
}

/* Kaufberatungs-Karten */
.telsche-einstiege {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	margin-bottom: clamp(32px, 5vw, 56px);
}

@media (max-width: 1023px) {
	.telsche-einstiege {
		grid-template-columns: 1fr;
	}
}

.telsche-einstieg {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	text-decoration: none;
}

.telsche-einstieg img.telsche-einstieg__bild {
	width: 100%;
	height: 170px;
	object-fit: cover;
	display: block;
}

.telsche-einstieg__body {
	display: grid;
	gap: 6px;
	padding: 16px 20px 18px;
}

.telsche-einstieg__titel {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 19px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--wp--preset--color--ink);
}

.telsche-einstieg:hover .telsche-einstieg__titel {
	color: var(--wp--preset--color--sail-red);
}

.telsche-einstieg__text {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-muted);
}

.telsche-einstieg__link {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
	font-weight: 600;
	color: var(--wp--preset--color--sail-red);
	margin-top: 4px;
}

/* Bestenliste */
.telsche-besten__list {
	list-style: none;
	margin: 0;
	padding: 8px 20px;
}

.telsche-besten__item {
	display: grid;
	grid-template-columns: 44px 64px 1fr;
	gap: 16px;
	align-items: center;
	padding: 16px 0;
	border-bottom: 1px dashed var(--wp--preset--color--border-strong);
}

.telsche-besten__item:last-child {
	border-bottom: 0;
}

.telsche-besten__rang {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 30px;
	font-weight: 700;
	color: var(--wp--preset--color--teak);
	text-align: center;
}

.telsche-besten__rang--1 {
	color: var(--wp--preset--color--sail-red);
}

.telsche-besten__cover,
.telsche-besten__list img.telsche-besten__cover {
	width: 64px;
	height: 92px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--cover);
	box-shadow: var(--wp--custom--shadow--cover);
}

.telsche-besten__cover--empty {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--chip-green);
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 8px;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-faint);
}

.telsche-besten__text {
	display: grid;
	gap: 4px;
	justify-items: start;
}

.telsche-besten__titel {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--wp--preset--color--ink);
}

.telsche-besten__cta {
	margin-top: 4px;
	font-size: 13px;
	font-weight: 700;
}

/* Regal */
.telsche-regal__filter {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 20px;
}

.telsche-regal__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
}

@media (max-width: 1280px) {
	.telsche-regal__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.telsche-regal__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
	}
}

.telsche-regal__card {
	display: grid;
	gap: 6px;
	justify-items: center;
	text-align: center;
	padding: 20px 16px;
}

.telsche-regal__cover,
.telsche-regal__grid img.telsche-regal__cover {
	width: 96px;
	height: 138px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--cover);
	box-shadow: var(--wp--custom--shadow--cover);
	margin-bottom: 8px;
}

.telsche-regal__cover--empty {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--chip-green);
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 9px;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-faint);
}

.telsche-regal__titel {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--wp--preset--color--ink);
}

.telsche-regal__meta {
	font-size: 10px;
	text-transform: uppercase;
}

.telsche-regal__cta {
	margin-top: 6px;
	font-size: 13px;
	font-weight: 700;
}

.telsche-regal__fussnote {
	border-top: 0;
	padding: 16px 0 0;
}

/* Regal – Listenformat (z. B. Ausrüstungs-Regal statt Foto-Kacheln):
 * einzeilige Zeilen in festen Spalten, wechselnde Hintergründe für
 * Lesbarkeit statt Trennlinien. */
.telsche-regal--liste .telsche-regal__liste {
	display: flex;
	flex-direction: column;
	border-top: 1px solid var(--wp--preset--color--border);
}

.telsche-regal--liste .telsche-regal__card {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 1.1fr) 130px;
	align-items: center;
	justify-items: stretch;
	gap: 8px 20px;
	padding: 11px 14px;
	text-align: left;
	border-bottom: 1px solid var(--wp--preset--color--border);
}

.telsche-regal--liste .telsche-regal__card > * {
	min-width: 0;
}

.telsche-regal--liste .telsche-regal__card:nth-child(odd) {
	background: var(--wp--preset--color--cream);
}

.telsche-regal--liste .telsche-regal__card[hidden] {
	display: none;
}

.telsche-regal--liste .telsche-regal__titel {
	min-width: 0;
	font-size: 14.5px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.telsche-regal--liste .telsche-regal__titel--klappbar {
	display: flex;
	align-items: center;
	gap: 6px;
	overflow: visible;
	white-space: normal;
	cursor: pointer;
	outline: none;
}

.telsche-regal--liste .telsche-regal__titel--klappbar:focus-visible {
	outline: 2px solid var(--wp--preset--color--sail-red-dark);
	outline-offset: 3px;
	border-radius: 3px;
}

.telsche-regal--liste .telsche-regal__titel-text {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.telsche-regal--liste .telsche-regal__chevron {
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: 50%;
	background-color: var(--wp--preset--color--card-white);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath d='M2 3.5L5 6.5L8 3.5' stroke='%2317231d' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	transition: transform 150ms ease, background-color 150ms ease, border-color 150ms ease;
}

.telsche-regal--liste .telsche-regal__titel--klappbar:hover .telsche-regal__chevron {
	border-color: var(--wp--preset--color--sail-red-dark);
}

.telsche-regal--liste .telsche-regal__titel--klappbar[aria-expanded="true"] .telsche-regal__chevron {
	transform: rotate(180deg);
	background-color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--ink);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath d='M2 3.5L5 6.5L8 3.5' stroke='%23fdfcf8' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.telsche-regal--liste .telsche-regal__detail {
	grid-column: 1 / -1;
	display: flex;
	gap: 16px;
	padding: 2px 0 12px;
}

.telsche-regal--liste .telsche-regal__detail[hidden] {
	display: none;
}

.telsche-regal--liste .telsche-regal__detail-foto {
	width: 128px;
	height: 96px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--cover);
	box-shadow: var(--wp--custom--shadow--cover);
	flex-shrink: 0;
}

.telsche-regal--liste .telsche-regal__detail-text {
	font-size: 13.5px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-body);
}

.telsche-regal--liste .telsche-regal__detail-text p {
	margin: 0;
}

.telsche-regal--liste .telsche-regal__detail-text ul {
	margin: 8px 0 0;
	padding-left: 18px;
}

.telsche-regal--liste .telsche-regal__meta {
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.telsche-regal--liste .telsche-regal__cta {
	margin-top: 0;
	white-space: nowrap;
}

@media (max-width: 600px) {
	.telsche-regal--liste .telsche-regal__card {
		grid-template-columns: 1fr auto;
		grid-template-areas: "titel cta" "meta cta";
		row-gap: 2px;
	}

	.telsche-regal--liste .telsche-regal__titel {
		grid-area: titel;
		white-space: normal;
	}

	.telsche-regal--liste .telsche-regal__meta {
		grid-area: meta;
	}

	.telsche-regal--liste .telsche-regal__cta {
		grid-area: cta;
		align-self: center;
	}
}

/* ---------------------------------------------------------------------------
 * Logbuch-Chronik
 * ------------------------------------------------------------------------- */
.telsche-logbuch__inner {
	max-width: 1344px;
	margin: 0 auto;
	padding: clamp(24px, 4vw, 48px) clamp(20px, 3.5vw, 48px) clamp(48px, 6vw, 80px);
}

/* Hero-Split nach Hub-Vorbild: Text links, Logbuch-Foto rechts mit Badge */
.telsche-logbuch__hero {
	display: grid;
	grid-template-columns: 1fr 1.1fr;
	gap: clamp(28px, 4vw, 64px);
	align-items: center;
}

@media (max-width: 1023px) {
	.telsche-logbuch__hero {
		grid-template-columns: 1fr;
	}
}

.telsche-logbuch__hero-text h1 {
	margin: 8px 0 0;
}

.telsche-logbuch__intro {
	margin-top: 16px;
	font-size: 16.5px;
	line-height: 1.65;
	color: var(--wp--preset--color--text-muted);
	max-width: 54ch;
}

.telsche-logbuch__hero-text .telsche-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 22px;
}

.telsche-logbuch__hero-media {
	position: relative;
}

.telsche-logbuch__hero-img img {
	width: 100%;
	height: 400px;
	object-fit: cover;
	object-position: center 60%;
	border-radius: var(--wp--custom--radius--frame);
	display: block;
}

@media (max-width: 1023px) {
	.telsche-logbuch__hero-img img {
		height: 240px;
	}
}

.telsche-logbuch__hero-badge {
	position: absolute;
	left: 16px;
	bottom: 14px;
	margin: 0;
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 10px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--white-soft);
	background: rgba(23, 35, 29, 0.7);
	border-radius: 6px;
	padding: 5px 10px;
}

.telsche-logbuch__rail {
	display: grid;
	gap: 20px;
}

.telsche-social {
	padding: 18px 20px;
}

.telsche-social__zeile {
	margin: 10px 0 0;
	padding-top: 10px;
	border-top: 1px dashed var(--wp--preset--color--border-strong);
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 14px;
	font-weight: 600;
}

.telsche-social__zeile a {
	color: var(--wp--preset--color--ink);
}

.telsche-social__zeile a:hover {
	color: var(--wp--preset--color--sail-red);
	text-decoration: none;
}

/* Split: Kapitel-Route links (Rail), Chronik rechts */
.telsche-logbuch__split {
	display: grid;
	grid-template-columns: 400px 1fr;
	gap: clamp(28px, 4vw, 56px);
	align-items: start;
	margin-top: clamp(36px, 5vw, 56px);
}

@media (max-width: 1023px) {
	.telsche-logbuch__split {
		grid-template-columns: 1fr;
	}
}

.telsche-logbuch__feed-head {
	margin: 0 0 4px !important;
}

/* Chronik im schmaleren Feed: einspaltig */
.telsche-logbuch__feed .telsche-chronik__list {
	grid-template-columns: 1fr;
}

.telsche-kapitelroute {
	max-width: none;
}

.telsche-kapitelroute .telsche-route__name a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.telsche-kapitelroute .telsche-route__name a:hover {
	color: var(--wp--preset--color--sail-red);
}

.telsche-kapitelroute .telsche-route__note {
	text-transform: uppercase;
	font-size: 10px;
}

/* Offene Station (Ausblick) */
.telsche-route__station--offen::before {
	background: var(--wp--preset--color--paper);
	border: 2px solid var(--wp--preset--color--teak);
	width: 8px;
	height: 8px;
}

.telsche-logbuch .wp-block-post-content {
	margin-top: clamp(40px, 6vw, 64px);
	font-size: 16px;
	line-height: 1.65;
}

/* Kapitel im Detail: 3-spaltiges Karten-Grid mit großen Kapitelziffern */
.telsche-kapitel-intro {
	font-size: 16.5px;
	line-height: 1.68;
	columns: 2;
	column-gap: clamp(32px, 4vw, 56px);
}

.telsche-kapitel-intro p {
	break-inside: avoid;
	margin-top: 0;
}

@media (max-width: 781px) {
	.telsche-kapitel-intro {
		columns: 1;
	}
}

.telsche-kapitel-head {
	margin: clamp(36px, 5vw, 56px) 0 24px !important;
}

.telsche-kapitel-liste {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	counter-reset: kapitel;
	margin-top: 8px;
	align-items: stretch;
}

/* WPs Flow-Layout gibt Kindern ab dem zweiten einen margin-top – im Grid raus damit */
.telsche-kapitel-liste > * {
	margin-block-start: 0 !important;
}

@media (max-width: 1200px) {
	.telsche-kapitel-liste {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 781px) {
	.telsche-kapitel-liste {
		grid-template-columns: 1fr;
	}
}

.telsche-kapitel {
	counter-increment: kapitel;
}

.telsche-kapitel__marker {
	display: none;
}

.telsche-kapitel__card {
	position: relative;
	padding: 22px 24px 24px;
	height: 100%;
}

/* Große Kapitelziffer auf dem Foto */
.telsche-kapitel__card::before {
	content: counter(kapitel);
	position: absolute;
	top: 10px;
	right: 18px;
	z-index: 1;
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 48px;
	font-weight: 700;
	line-height: 1;
	color: var(--wp--preset--color--white-soft);
	text-shadow: 0 2px 10px rgba(23, 35, 29, 0.65);
}

.telsche-kapitel--zukunft .telsche-kapitel__card::before {
	content: "→";
}

.telsche-kapitel__titel {
	font-size: 21px;
	margin: 6px 44px 0 0 !important;
	line-height: 1.25;
	scroll-margin-top: 24px;
}

/* Aufklapp-Karte: Foto + Titel sichtbar, Text hinter "Kapitel lesen".
   Einheitliche Höhen: Karte streckt sich, die Lesen-Zeile sitzt immer unten. */
.telsche-kapitel {
	display: flex;
}

.telsche-kapitel__card {
	padding: 0;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	width: 100%;
}

.telsche-kapitel__card > .telsche-kapitel__foto {
	width: 100%;
	height: 190px;
	object-fit: cover;
	border-radius: 0;
	display: block;
	flex-shrink: 0;
}

.telsche-kapitel__kopf {
	padding: 16px 20px 0;
	flex: 1;
}

.telsche-kapitel__details {
	padding: 0 20px 16px;
	margin-top: 12px;
}

.telsche-kapitel__details summary {
	list-style: none;
	cursor: pointer;
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 11px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--sail-red);
	padding: 8px 0;
	border-top: 1px dashed var(--wp--preset--color--border-strong);
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.telsche-kapitel__details summary::-webkit-details-marker {
	display: none;
}

.telsche-kapitel__details summary::after {
	content: "+";
	font-size: 15px;
}

.telsche-kapitel__details[open] summary::after {
	content: "−";
}

.telsche-kapitel__details[open] summary {
	color: var(--wp--preset--color--text-muted);
}

.telsche-kapitel__details .telsche-kapitel__text {
	padding-top: 10px;
}

.telsche-kapitel__text {
	font-size: 15px;
	line-height: 1.65;
	color: var(--wp--preset--color--text-body);
}

.telsche-kapitel__text p {
	margin: 0 0 12px;
}

.telsche-kapitel__text a {
	font-weight: 600;
}

/* Externe Forum-Links dezent markieren */
.telsche-kapitel__text a[href*="boote-forum"]::after {
	content: " ↗";
	font-size: 0.85em;
	color: var(--wp--preset--color--text-faint);
}

.telsche-kapitel__foto {
	width: 100%;
	height: 150px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--card);
	display: block;
}

.telsche-kapitel__caption {
	font-family: var(--wp--preset--font-family--newsreader);
	font-style: italic;
	font-size: 12.5px;
	color: var(--wp--preset--color--text-muted);
	margin: 6px 0 0;
}

.telsche-chronik {
	margin-top: 28px;
}

.telsche-chronik__filter {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 8px;
}

.telsche-chronik__season {
	margin-top: 36px;
}

.telsche-chronik__season-head {
	display: flex;
	align-items: baseline;
	gap: 16px;
}

.telsche-chronik__season-title {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 22px;
	font-weight: 600;
	color: var(--wp--preset--color--sail-red);
	white-space: nowrap;
}

.telsche-chronik__season-line {
	flex: 1;
	border-top: 1px solid var(--wp--preset--color--border-strong);
	transform: translateY(-4px);
}

/* Einträge zweispaltig – halbiert die Scroll-Länge */
.telsche-chronik__list {
	list-style: none;
	margin: 8px 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: clamp(32px, 4vw, 56px);
	align-items: start;
}

@media (max-width: 1023px) {
	.telsche-chronik__list {
		grid-template-columns: 1fr;
	}
}

.telsche-chronik__list li {
	border-bottom: 1px dashed var(--wp--preset--color--border-strong);
}

.telsche-chronik__list a {
	display: grid;
	grid-template-columns: 76px 64px 1fr;
	gap: 16px;
	align-items: center;
	padding: 13px 0;
	text-decoration: none;
}

.telsche-chronik__date {
	white-space: nowrap;
}

.telsche-chronik__thumb,
.telsche-chronik__list img.telsche-chronik__thumb {
	width: 64px;
	height: 48px;
	object-fit: cover;
	border-radius: 6px;
}

.telsche-chronik__thumb--empty {
	display: block;
	background: var(--wp--preset--color--chip-green);
}

.telsche-chronik__text {
	display: grid;
	gap: 3px;
}

.telsche-chronik__title {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--wp--preset--color--ink);
}

.telsche-chronik__list a:hover .telsche-chronik__title {
	color: var(--wp--preset--color--sail-red);
}

.telsche-chronik__more-wrap {
	margin-top: 32px;
	text-align: center;
}

.telsche-chronik__more {
	background: transparent;
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--button);
	padding: 10px 22px;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 14px;
	font-weight: 600;
	color: var(--wp--preset--color--text-body);
	cursor: pointer;
	transition: background 150ms ease;
}

.telsche-chronik__more:hover {
	background: var(--wp--preset--color--cream);
}

/* ---------------------------------------------------------------------------
 * Standard-Page (Impressum, Buch-Unterseiten …)
 * ------------------------------------------------------------------------- */
.telsche-page__inner {
	max-width: 760px;
	margin: 0 auto;
	padding: clamp(24px, 4vw, 48px) clamp(20px, 3.5vw, 48px) clamp(48px, 6vw, 80px);
}

.telsche-page__inner .wp-block-post-title {
	margin: 14px 0 0;
	text-wrap: balance;
}

.telsche-page .wp-block-post-content {
	margin-top: 28px;
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: var(--wp--preset--font-size--body-serif);
	line-height: 1.68;
}

.telsche-page .wp-block-post-content h2 {
	margin-top: 44px;
	scroll-margin-top: 24px;
}

.telsche-page .wp-block-post-content img {
	border-radius: var(--wp--custom--radius--card);
}

/* ---------------------------------------------------------------------------
 * Boots-Seite
 * ------------------------------------------------------------------------- */
.telsche-boot__hero {
	position: relative;
	height: 340px;
	overflow: hidden;
	background: var(--wp--preset--color--hull-green);
}

.telsche-boot__hero-img img {
	width: 100%;
	height: 340px;
	object-fit: cover;
}

.telsche-boot__hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--wp--preset--gradient--photo-overlay);
}

.telsche-boot__hero-content {
	position: absolute;
	inset: auto 0 0 0;
	z-index: 1;
	max-width: 1344px;
	margin: 0 auto;
	padding: 0 clamp(20px, 3.5vw, 48px) 32px;
}

.telsche-boot__hero-eyebrow {
	color: var(--wp--preset--color--teak-light);
	margin: 0;
}

.telsche-boot__hero .wp-block-post-title {
	color: var(--wp--preset--color--white-soft);
	margin: 8px 0 0;
}

.telsche-boot__inner {
	max-width: 900px;
	margin: 0 auto;
	padding: clamp(28px, 4vw, 48px) clamp(20px, 3.5vw, 48px) clamp(48px, 6vw, 80px);
}

.telsche-boot .wp-block-post-content {
	font-size: 16.5px;
	line-height: 1.68;
}

.telsche-boot .wp-block-post-content h2 {
	margin-top: 40px;
}

/* Datenblatt */
.telsche-datenblatt {
	margin: 32px 0;
	overflow: hidden;
	max-width: 560px;
}

.telsche-datenblatt__table {
	margin: 0;
}

/* Ausführlicher Steckbrief: Gruppen-Überschriften, kompaktere Zeilen */
.telsche-datenblatt__gruppe {
	margin: 0;
	padding: 14px 18px 6px;
	color: var(--wp--preset--color--hull-green);
	/*
	 * Die Gruppennamen tragen die ganze Gliederung der Infoboxen – sie
	 * dürfen sich deutlicher von den Zeilen darunter absetzen. 500 ist
	 * dabei bewusst der Höchstwert: Vom IBM Plex Mono sind nur 400 und 500
	 * gebündelt, alles darüber würde der Browser künstlich fetten, und
	 * Faux-Bold sieht bei einer Monospace mit Letterspacing schlecht aus.
	 */
	font-weight: 500;
}

.telsche-datenblatt__gruppe--klappbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	cursor: pointer;
	user-select: none;
	outline: none;
}

.telsche-datenblatt__gruppe--klappbar:focus-visible {
	outline: 2px solid var(--wp--preset--color--sail-red-dark);
	outline-offset: 3px;
	border-radius: 3px;
}

.telsche-datenblatt__gruppe--klappbar::after {
	content: "";
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: 50%;
	background-color: var(--wp--preset--color--card-white);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath d='M2 3.5L5 6.5L8 3.5' stroke='%2317231d' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	transition: transform 150ms ease, background-color 150ms ease, border-color 150ms ease;
}

.telsche-datenblatt__gruppe--klappbar[aria-expanded="false"]::after {
	transform: rotate(-90deg);
}

.telsche-datenblatt__gruppe--klappbar[aria-expanded="true"]::after {
	background-color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--ink);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath d='M2 3.5L5 6.5L8 3.5' stroke='%23fdfcf8' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.telsche-datenblatt__gruppe--klappbar:hover {
	color: var(--wp--preset--color--sail-red-dark);
}

.telsche-datenblatt__gruppe--klappbar:hover::after {
	border-color: var(--wp--preset--color--sail-red-dark);
}

.telsche-datenblatt__fussnote {
	margin: 0;
	padding: 12px 18px 16px;
	border-top: 1px solid var(--wp--preset--color--border);
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-muted);
}

.telsche-steckbrief .telsche-datenblatt__table + .telsche-datenblatt__gruppe {
	border-top: 1px solid var(--wp--preset--color--border);
	margin-top: 10px;
	padding-top: 14px;
}

.telsche-steckbrief .telsche-datenblatt__table td {
	padding: 6px 18px;
	line-height: 1.45;
	vertical-align: top;
}

.telsche-steckbrief .telsche-datenblatt__table td:first-child {
	width: 46%;
	letter-spacing: 0.06em;
	text-transform: none;
	font-size: 12px;
}

.telsche-datenblatt__table table {
	border-collapse: collapse;
	width: 100%;
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 12.5px;
}

.telsche-datenblatt__table td {
	border: 0;
	border-bottom: 1px dashed var(--wp--preset--color--border);
	padding: 10px 18px;
}

.telsche-datenblatt__table tr:last-child td {
	border-bottom: 0;
}

.telsche-datenblatt__table td:first-child {
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--wp--preset--color--text-faint);
	width: 40%;
}

.telsche-datenblatt__table td:last-child {
	color: var(--wp--preset--color--ink);
	font-weight: 500;
}

/* ---------------------------------------------------------------------------
 * Ort-Seiten (Häfen & Ankerplätze)
 * ------------------------------------------------------------------------- */
.telsche-ort .telsche-boot__hero-content .telsche-breadcrumb,
.telsche-ort .telsche-boot__hero-content .telsche-breadcrumb a {
	color: var(--wp--preset--color--teak-light);
}

.telsche-ort .telsche-boot__hero-content .telsche-breadcrumb__current {
	color: var(--wp--preset--color--white-warm);
}

.telsche-ort__layout {
	max-width: 1344px;
	margin: 0 auto;
	padding: clamp(24px, 4vw, 40px) clamp(20px, 3.5vw, 48px) clamp(48px, 6vw, 80px);
}

/* Quick-Facts-Band */
.telsche-ortfakten {
	background: var(--wp--preset--color--cream);
	border-bottom: 1px solid var(--wp--preset--color--border-strong);
}

.telsche-ortfakten__inner {
	max-width: 1344px;
	margin: 0 auto;
	padding: 12px clamp(20px, 3.5vw, 48px);
	display: flex;
	flex-wrap: wrap;
	gap: 8px 28px;
}

.telsche-ortfakten__item {
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 11px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-body);
	white-space: nowrap;
}

.telsche-ortfakten__item::before {
	content: "▸ ";
	color: var(--wp--preset--color--sail-red);
}

/* Steckbrief nutzt das Datenblatt, aber kompakt in der Sidebar */
.telsche-steckbrief {
	margin: 0;
	max-width: none;
}

/* Seekarte */
.telsche-karte {
	overflow: hidden;
}

.telsche-karte__map {
	width: 100%;
	background: var(--wp--preset--color--chip-green);
}

.telsche-karte__pin {
	display: block;
	width: 16px;
	height: 16px;
	border-radius: 999px;
	border: 3px solid #fff;
	box-shadow: 0 1px 5px rgba(23, 35, 29, 0.5);
}

.telsche-karte__pin--hafen {
	background: var(--wp--preset--color--hull-green);
}

.telsche-karte__pin--anker {
	background: var(--wp--preset--color--sail-red);
}

.telsche-karte__pin--geschichte {
	background: var(--wp--preset--color--gold-muted);
}

.telsche-karte__popup {
	font-family: var(--wp--preset--font-family--figtree);
	font-weight: 600;
}

/* Törnrouten: nummerierte Pins, damit Karte und Etappenliste zusammenpassen */
.telsche-karte__pin--nr {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 999px;
	border: 2px solid #fff;
	background: var(--wp--preset--color--hull-green);
	box-shadow: 0 1px 5px rgba(23, 35, 29, 0.5);
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	color: #fff;
}

.telsche-karte__hinweis {
	margin: 10px 0 0;
	font-size: 12px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-muted);
}

/* Windrose */
.telsche-windrose {
	overflow: hidden;
}

.telsche-windrose__body {
	padding: 16px 18px 14px;
}

.telsche-windrose__body svg {
	width: 100%;
	max-width: 220px;
	display: block;
	margin: 0 auto;
}

.telsche-windrose__legende {
	display: flex;
	justify-content: center;
	gap: 18px;
	margin-top: 10px;
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 10px;
	letter-spacing: 0.06em;
}

.telsche-windrose__geschuetzt {
	color: var(--wp--preset--color--hull-green);
}

.telsche-windrose__offen {
	color: var(--wp--preset--color--sail-red);
}

/* ---------------------------------------------------------------------------
 * Über-Seite
 * ------------------------------------------------------------------------- */
.telsche-ueber__inner {
	max-width: 1344px;
	margin: 0 auto;
	padding: clamp(24px, 4vw, 48px) clamp(20px, 3.5vw, 48px) clamp(48px, 6vw, 80px);
}

.telsche-ueber__hero {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(24px, 4vw, 56px);
	align-items: center;
}

.telsche-ueber__hero .wp-block-post-title {
	margin: 12px 0 0;
	text-wrap: balance;
}

.telsche-ueber__hero-img {
	position: relative;
}

.telsche-ueber__hero-img img {
	width: 100%;
	height: 420px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--frame);
}

.telsche-ueber__hero-badge {
	position: absolute;
	left: 16px;
	bottom: 14px;
	margin: 0;
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--wp--preset--color--white-warm);
	background: rgba(23, 35, 29, 0.7);
	border-radius: 6px;
	padding: 5px 10px;
}

.telsche-ueber__intro {
	font-size: 17px;
	line-height: 1.65;
	color: var(--wp--preset--color--text-body);
	margin: 20px 0 0;
	max-width: 54ch;
}

@media (max-width: 1023px) {
	.telsche-ueber__hero {
		grid-template-columns: 1fr;
	}

	.telsche-ueber__hero-img img {
		height: 260px;
	}
}

.telsche-ueber__buttons {
	margin-top: 24px;
	gap: 12px;
}

.telsche-ueber__btn-primary a {
	display: inline-block;
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--white-warm);
	font-size: 14px;
	font-weight: 600;
	border-radius: var(--wp--custom--radius--button);
	padding: 11px 22px;
}

.telsche-ueber__btn-primary a:hover {
	background: var(--wp--preset--color--hull-green);
	text-decoration: none;
}

.telsche-ueber__btn-outline a {
	display: inline-block;
	border: 1px solid var(--wp--preset--color--border-strong);
	color: var(--wp--preset--color--text-body);
	font-size: 14px;
	font-weight: 600;
	border-radius: var(--wp--custom--radius--button);
	padding: 11px 22px;
}

.telsche-ueber__btn-outline a:hover {
	background: var(--wp--preset--color--cream);
	text-decoration: none;
}

.telsche-ueber .wp-block-post-content {
	margin-top: clamp(32px, 5vw, 56px);
	font-size: 16px;
	line-height: 1.65;
}

.telsche-ueber .wp-block-post-content h2 {
	margin-top: 44px;
}

/* ---------------------------------------------------------------------------
 * Tagestörn-Seite (gleiches Hero-Muster wie die Über-Seite)
 * ------------------------------------------------------------------------- */
.telsche-tagestoern__inner {
	max-width: 1344px;
	margin: 0 auto;
	padding: clamp(24px, 4vw, 48px) clamp(20px, 3.5vw, 48px) clamp(48px, 6vw, 80px);
}

.telsche-tagestoern__hero {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(24px, 4vw, 56px);
	align-items: center;
}

.telsche-tagestoern__hero .wp-block-post-title {
	margin: 12px 0 0;
	text-wrap: balance;
}

.telsche-tagestoern__hero-img {
	position: relative;
}

.telsche-tagestoern__hero-img img {
	width: 100%;
	height: 420px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--frame);
}

.telsche-tagestoern__hero-badge {
	position: absolute;
	left: 16px;
	bottom: 14px;
	margin: 0;
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--wp--preset--color--white-warm);
	background: rgba(23, 35, 29, 0.7);
	border-radius: 6px;
	padding: 5px 10px;
}

.telsche-tagestoern__intro {
	font-size: 17px;
	line-height: 1.65;
	color: var(--wp--preset--color--text-body);
	margin: 20px 0 0;
	max-width: 54ch;
}

@media (max-width: 1023px) {
	.telsche-tagestoern__hero {
		grid-template-columns: 1fr;
	}

	.telsche-tagestoern__hero-img img {
		height: 260px;
	}
}

.telsche-tagestoern .wp-block-post-content {
	margin-top: clamp(32px, 5vw, 56px);
	font-size: 16px;
	line-height: 1.65;
}

.telsche-tagestoern .wp-block-post-content h2 {
	margin-top: 44px;
}

.telsche-tagestoern .wp-block-post-content .telsche-ueberboot h2 {
	font-size: 32px;
	line-height: 1.2;
	color: var(--wp--preset--color--white-warm);
	margin: 12px 0 0;
}

/* Törn-Optionen: 4 Karten im telsche-crew-Muster, 2 statt 3 Spalten */
.telsche-toernoptionen {
	grid-template-columns: repeat(2, 1fr) !important;
}

@media (max-width: 700px) {
	.telsche-toernoptionen {
		grid-template-columns: 1fr !important;
	}
}

/* Kennzahl-Karten (sitzen in der Story-Spalte neben der Skipper-Karte) */
.telsche-kennzahlen {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
	margin: 28px 0 0;
}

.telsche-kennzahl {
	padding: 18px;
}

.telsche-kennzahl__zahl {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 30px;
	font-weight: 700;
	color: var(--wp--preset--color--sail-red);
	margin: 0;
}

.telsche-kennzahl__label {
	font-size: 13px;
	color: var(--wp--preset--color--text-muted);
	margin: 4px 0 0;
}

/* Crew-Karten */
.telsche-crewsektion {
	margin-top: clamp(40px, 5vw, 56px);
}

.telsche-ueber .wp-block-post-content .telsche-crewsektion h2 {
	margin: 0 0 20px;
}

.telsche-crew {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin: 0;
}

.telsche-crewkarte__titel {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 20px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	margin: 0;
}

.telsche-crewkarte {
	overflow: hidden;
}

.telsche-crewkarte__foto-platzhalter {
	height: 220px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--chip-green);
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--wp--preset--color--text-faint);
	margin: 0;
}

.telsche-crewkarte__foto {
	margin: 0;
}

.telsche-crewkarte__foto img {
	width: 100%;
	height: 240px;
	object-fit: cover;
	display: block;
}

/* Hochkant-Foto: größere Karte, damit sie mit der Story-Spalte daneben harmoniert. */
.telsche-skipperkarte .telsche-crewkarte__foto img {
	height: 440px;
}

.telsche-crewkarte__body {
	padding: 18px 20px 20px;
}

.telsche-crewkarte__name {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 20px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	margin: 6px 0 0;
}

.telsche-crewkarte__text {
	font-size: 14px;
	line-height: 1.6;
	color: var(--wp--preset--color--text-muted);
	margin: 6px 0 0;
}

/* ---------------------------------------------------------------------------
 * Partner-Kontext-Anzeige (Modul B, Sidebar)
 * ------------------------------------------------------------------------- */
.telsche-partnerad {
	overflow: hidden;
	font-family: var(--wp--preset--font-family--figtree);
}

.telsche-partnerad__foto {
	width: 100%;
	height: 150px;
	object-fit: cover;
	display: block;
}

.telsche-partnerad__body {
	padding: 16px 18px 18px;
}

.telsche-partnerad__body img.telsche-partnerad__logo {
	height: 34px;
	width: auto;
	max-width: 160px;
	object-fit: contain;
	object-position: left center;
	margin-bottom: 10px;
	display: block;
}

.telsche-partnerad__name {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 17px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	margin: 0;
	line-height: 1.3;
}

.telsche-partnerad__zeile {
	font-size: 13px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-muted);
	margin: 10px 0 0;
}

/* Bewusst grüner Outline-Button – rot bleibt Affiliate/Inhalt vorbehalten. */
.telsche-partnerad__cta {
	display: inline-block;
	margin-top: 12px;
	border: 1px solid var(--wp--preset--color--hull-green);
	color: var(--wp--preset--color--hull-green) !important;
	font-size: 12.5px;
	font-weight: 600;
	border-radius: var(--wp--custom--radius--button);
	padding: 8px 16px;
	transition: background 150ms ease;
}

.telsche-partnerad__cta:hover {
	background: var(--wp--preset--color--chip-green);
	text-decoration: none !important;
}

/* Modul C: mobile Inline-Variante am Artikelende */
.telsche-partnerinline {
	display: none;
	margin-top: 40px;
	padding: 14px 16px;
	gap: 16px;
	align-items: center;
	font-family: var(--wp--preset--font-family--figtree);
}

.telsche-partnerinline__foto {
	width: 74px;
	height: 74px;
	object-fit: cover;
	border-radius: 8px;
	flex-shrink: 0;
}

.telsche-partnerinline__text {
	display: grid;
	gap: 4px;
}

.telsche-partnerinline__name {
	font-size: 15px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
}

.telsche-partnerinline__text a {
	font-size: 13px;
	font-weight: 600;
}

@media (max-width: 1023px) {
	.telsche-partnerinline {
		display: flex;
	}

	/* In der eingeflossenen Sidebar keine zweite Partner-Anzeige */
	.telsche-article__sidebar .telsche-partnerad {
		display: none;
	}
}

/* ---------------------------------------------------------------------------
 * Buch-Tipp Sidebar-Karte (cream)
 * ------------------------------------------------------------------------- */
.telsche-buchside {
	background: var(--wp--preset--color--cream);
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--card);
	overflow: hidden;
	font-family: var(--wp--preset--font-family--figtree);
}

.telsche-buchside__head {
	display: flex;
	justify-content: space-between;
	padding: 10px 18px;
	border-bottom: 1px dashed var(--wp--preset--color--border-strong);
}

.telsche-buchside__body {
	display: flex;
	gap: 14px;
	padding: 14px 18px 16px;
	align-items: flex-start;
}

.telsche-buchside__body img.telsche-buchside__cover {
	width: 64px;
	height: auto;
	border-radius: var(--wp--custom--radius--cover);
	box-shadow: var(--wp--custom--shadow--cover);
	flex-shrink: 0;
}

.telsche-buchside__titel {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 16px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	margin: 0;
	line-height: 1.3;
}

.telsche-buchside__fazit {
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-muted);
	margin: 6px 0 0;
}

.telsche-buchside__cta {
	display: inline-block;
	margin-top: 8px;
	font-size: 13px;
	font-weight: 700;
}

.telsche-buchside__bullets {
	padding: 0 18px 4px;
}

.telsche-buchside__fuss {
	padding: 10px 18px 16px;
}

/* ---------------------------------------------------------------------------
 * Empfehlungs-Block (Artikelende): grüne Top-Border, 3 Karten
 * ------------------------------------------------------------------------- */
.telsche-empfehlungen {
	margin-top: 48px;
	border-top: 2px solid var(--wp--preset--color--hull-green);
	padding-top: 20px;
	font-family: var(--wp--preset--font-family--figtree);
}

.telsche-empfehlungen__grid {
	gap: 16px;
	margin-top: 14px;
}

.telsche-empfehlung {
	padding: 16px 18px;
}

.telsche-empfehlung__titel {
	font-size: 15px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	margin: 8px 0 0;
	line-height: 1.35;
}

.telsche-empfehlung__text {
	font-size: 13px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-muted);
	margin: 6px 0 0;
}

.telsche-empfehlung__link {
	font-size: 13px;
	font-weight: 700;
	margin: 10px 0 0;
}

.telsche-empfehlungen__fussnote {
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 10px;
	color: var(--wp--preset--color--text-faint-warm);
	margin: 12px 0 0;
}

/* ---------------------------------------------------------------------------
 * Über-Seite: Skipper- & Transparenz-Karten
 * ------------------------------------------------------------------------- */
.telsche-skipper {
	display: grid;
	grid-template-columns: 380px 1fr;
	gap: clamp(24px, 3.5vw, 48px);
	margin: 0;
	align-items: start;
}

/* WP-Flow-Layout gibt Nicht-Erst-Kindern margin-block-start – in Grids
 * verschiebt das alle Boxen ab der zweiten nach unten. */
.telsche-skipper > *,
.telsche-kennzahlen > *,
.telsche-crew > *,
.telsche-transparenz > *,
.telsche-ueberboot > * {
	margin-block-start: 0 !important;
}

.telsche-skipperkarte {
	overflow: hidden;
}

.telsche-ueber .wp-block-post-content .telsche-skipper__story h2 {
	margin: 8px 0 0;
}

.telsche-skipper__pills {
	margin-top: 14px;
}

.telsche-skipper__pills .telsche-chip {
	margin: 0;
}

.telsche-skipper__pills .telsche-chip a {
	color: inherit;
}

.telsche-skipper__story p {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 18px;
	line-height: 1.7;
	color: var(--wp--preset--color--text-body);
	margin: 16px 0 0;
	max-width: 68ch;
}

/* Boot-Band: grüne Box mit Steuerhaus-Foto → Boots-Seite */
.telsche-ueberboot {
	display: grid;
	grid-template-columns: 1fr 520px;
	background: var(--wp--preset--color--hull-green);
	border-radius: var(--wp--custom--radius--cardLg);
	overflow: hidden;
	margin: clamp(40px, 5vw, 56px) 0;
}

.telsche-ueberboot__left {
	padding: 40px 44px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
}

.telsche-ueber .wp-block-post-content .telsche-ueberboot h2 {
	font-size: 32px;
	line-height: 1.2;
	color: var(--wp--preset--color--white-warm);
	margin: 12px 0 0;
}

.telsche-ueberboot__text {
	font-size: 15px;
	line-height: 1.65;
	color: #c3cdbe;
	margin: 14px 0 0;
	max-width: 56ch;
}

.telsche-ueberboot__specs {
	font-size: 11px;
	color: var(--wp--preset--color--teak-light);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 22px 0 0;
}

.telsche-ueberboot__cta {
	font-size: 14px;
	font-weight: 600;
	margin: 22px 0 0;
}

.telsche-ueberboot__cta a {
	color: var(--wp--preset--color--teak-light);
}

.telsche-ueberboot__foto {
	margin: 0;
}

.telsche-ueberboot__foto img {
	width: 100%;
	height: 100%;
	min-height: 320px;
	object-fit: cover;
	display: block;
}

/* Podcast-Band: rote Box mit Cover-Art -> Spotify/Apple Podcasts */
.telsche-podcastband {
	display: grid;
	grid-template-columns: 1fr 320px;
	background: var(--wp--preset--color--sail-red-dark);
	border-radius: var(--wp--custom--radius--cardLg);
	overflow: hidden;
	margin: clamp(40px, 5vw, 56px) 0;
}

.telsche-podcastband > * {
	margin-block-start: 0 !important;
}

.telsche-podcastband__left {
	padding: 40px 44px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
}

.telsche-ueber .wp-block-post-content .telsche-podcastband h2 {
	font-size: 32px;
	line-height: 1.2;
	color: var(--wp--preset--color--white-warm);
	margin: 12px 0 0;
}

.telsche-podcastband__text {
	font-size: 15px;
	line-height: 1.65;
	color: var(--wp--preset--color--teak-light);
	margin: 14px 0 0;
	max-width: 56ch;
}

.telsche-podcastband__links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 28px;
	margin: 24px 0 0;
}

.telsche-podcastband__links a {
	font-size: 14px;
	font-weight: 600;
	color: var(--wp--preset--color--white-warm);
}

.telsche-podcastband__links a:hover {
	color: var(--wp--preset--color--teak-light);
}

.telsche-podcastband__foto {
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--ink);
}

.telsche-podcastband__foto img {
	width: 100%;
	height: 100%;
	min-height: 320px;
	object-fit: cover;
	display: block;
}

/* An-Bord-bleiben-Sektion: Newsletter + Social nebeneinander */
.telsche-folgen {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(20px, 3vw, 40px);
	margin: 0 0 clamp(28px, 4vw, 44px);
	align-items: stretch;
}

.telsche-folgen > * {
	margin-block-start: 0 !important;
}

.telsche-folgen__newsletter .telsche-newsletter {
	height: 100%;
}

.telsche-folgen__social {
	padding: 24px 26px;
}

.telsche-folgen__titel {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 22px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	margin: 10px 0 0;
}

.telsche-folgen__text {
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--wp--preset--color--text-muted);
	margin: 10px 0 16px;
}

.telsche-folgen__link {
	margin: 0 0 10px;
}

.telsche-folgen__link a {
	display: flex;
	align-items: center;
	gap: 12px;
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--button);
	padding: 12px 16px;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
}

/* Logos als CSS-Daten-URIs – SVG im Content überlebt das kses von WP.com nicht. */
.telsche-folgen__link a::before {
	content: "";
	width: 22px;
	height: 22px;
	flex-shrink: 0;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}

.telsche-folgen__link--instagram a::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d6336c' stroke-width='2'%3E%3Crect x='2.5' y='2.5' width='19' height='19' rx='5.5'/%3E%3Ccircle cx='12' cy='12' r='4.5'/%3E%3Ccircle cx='17.6' cy='6.4' r='1.3' fill='%23d6336c' stroke='none'/%3E%3C/svg%3E");
}

.telsche-folgen__link--youtube a::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e02f2f'%3E%3Cpath d='M23 7.2c-.26-1.2-1.03-2.14-2.02-2.46C19.2 4.2 12 4.2 12 4.2s-7.2 0-8.98.54C2.03 5.06 1.26 6 1 7.2.55 9.36.55 12 .55 12s0 2.64.45 4.8c.26 1.2 1.03 2.14 2.02 2.46 1.78.54 8.98.54 8.98.54s7.2 0 8.98-.54c.99-.32 1.76-1.26 2.02-2.46.45-2.16.45-4.8.45-4.8s0-2.64-.45-4.8zM9.7 15.6V8.4l6.1 3.6-6.1 3.6z'/%3E%3C/svg%3E");
}

.telsche-folgen__link a:hover {
	background: var(--wp--preset--color--cream);
	text-decoration: none;
	color: var(--wp--preset--color--sail-red);
}

@media (max-width: 781px) {
	.telsche-folgen {
		grid-template-columns: 1fr;
	}
}

.telsche-transparenz {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(20px, 3vw, 40px);
	margin: 0;
}

.telsche-transparenz__karte {
	padding: 28px;
}

.telsche-ueber .wp-block-post-content .telsche-transparenz h3 {
	font-size: 22px;
	margin: 10px 0 0;
}

.telsche-transparenz__karte--cream {
	background: var(--wp--preset--color--cream);
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--card);
}

.telsche-transparenz__text {
	font-size: 14.5px;
	line-height: 1.65;
	color: var(--wp--preset--color--text-muted);
	margin: 12px 0 0;
}

@media (max-width: 1023px) {
	.telsche-skipper,
	.telsche-ueberboot,
	.telsche-podcastband {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 781px) {
	.telsche-crew,
	.telsche-kennzahlen,
	.telsche-transparenz {
		grid-template-columns: 1fr;
	}

	.telsche-ueberboot__left,
	.telsche-podcastband__left {
		padding: 28px 24px;
	}

	.telsche-ueberboot__foto img,
	.telsche-podcastband__foto img {
		min-height: 240px;
		height: 240px;
	}
}

.telsche-transparenz__link {
	font-size: 13.5px;
	font-weight: 600;
	margin: 12px 0 0;
}

/* ---------------------------------------------------------------------------
 * Foto-Strip & Linkliste (Boots-Seite)
 * ------------------------------------------------------------------------- */
.telsche-fotostrip img {
	border-radius: 8px;
	height: 120px;
	object-fit: cover;
}

.telsche-linkliste {
	margin: 32px 0;
}

.telsche-linkliste__zeile {
	border-bottom: 1px dashed var(--wp--preset--color--border-strong);
	padding: 10px 0;
	margin: 0;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 15px;
	font-weight: 600;
}

.telsche-linkliste__zeile a {
	color: var(--wp--preset--color--ink);
}

.telsche-linkliste__zeile a:hover {
	color: var(--wp--preset--color--sail-red);
	text-decoration: none;
}

/* ---------------------------------------------------------------------------
 * Häfen-Kacheln (Hub)
 * ------------------------------------------------------------------------- */
.telsche-haefen {
	gap: 16px;
	margin: 28px 0;
}

.telsche-hafen {
	padding: 16px 18px;
}

.telsche-hafen__name {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 19px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	margin: 6px 0 0;
}

.telsche-hafen__note {
	font-size: 13px;
	color: var(--wp--preset--color--text-muted);
	margin: 4px 0 0;
}

/* ---------------------------------------------------------------------------
 * Bibliothek: Hinweis-Band
 * ------------------------------------------------------------------------- */
.telsche-bib__hinweis {
	margin-top: clamp(32px, 5vw, 56px);
	background: var(--wp--preset--color--cream);
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--cardLg);
	padding: 20px 26px;
	gap: 24px;
}

.telsche-bib__hinweis-text {
	font-size: 14px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-muted);
	margin: 0;
	max-width: 62ch;
}

.telsche-bib__hinweis-link {
	font-size: 13.5px;
	font-weight: 600;
	margin: 0;
	white-space: nowrap;
}

/* ---------------------------------------------------------------------------
 * Topbar: Such-Pill
 * ------------------------------------------------------------------------- */
.telsche-topbar__search {
	width: 190px;
}

.telsche-topbar__search .wp-block-search__inside-wrapper {
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--card-white);
	padding: 2px 4px 2px 14px;
}

.telsche-topbar__search input.wp-block-search__input {
	border: 0;
	background: transparent;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13px;
	padding: 6px 0;
	outline: none;
}

.telsche-topbar__search button.wp-block-search__button {
	border: 0;
	background: transparent;
	color: var(--wp--preset--color--text-muted);
	font-size: 14px;
	padding: 4px 8px;
	cursor: pointer;
}

.telsche-topbar__search button.wp-block-search__button:hover {
	color: var(--wp--preset--color--sail-red);
}

@media (max-width: 1200px) {
	.telsche-topbar__search {
		display: none;
	}
}

/* ---------------------------------------------------------------------------
 * Suche im mobilen Navigations-Overlay
 *
 * Die Such-Pill oben rechts verschwindet unter 1200 px – mit wachsender Zahl
 * an Ortsseiten fehlt die Suche mobil aber spürbar. Deshalb liegt zusätzlich
 * ein Search-Block IM Navigationsmenü. Er wird grundsätzlich ausgeblendet und
 * nur dann gezeigt, wenn das Overlay offen ist. Damit erscheint er weder in
 * der Desktop-Navigationsleiste noch im zugeklappten Zustand.
 * ------------------------------------------------------------------------- */
.telsche-topbar__nav .wp-block-search {
	display: none;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-search {
	display: block;
	width: 100%;
	margin: 0 0 8px;
	order: -1; /* immer ganz oben, unabhängig von der Blockreihenfolge */
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-search__inside-wrapper {
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--card-white);
	padding: 4px 6px 4px 16px;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open input.wp-block-search__input {
	border: 0;
	background: transparent;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 16px; /* 16px verhindert den Zoom beim Fokus auf iOS */
	padding: 8px 0;
	outline: none;
	width: 100%;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open button.wp-block-search__button {
	border: 0;
	background: transparent;
	color: var(--wp--preset--color--text-muted);
	font-size: 16px;
	padding: 6px 10px;
	cursor: pointer;
}

.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open button.wp-block-search__button:hover {
	color: var(--wp--preset--color--sail-red);
}

/* Das Menü-Item-Styling der Navigation darf den Suchblock nicht erwischen. */
.telsche-topbar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-search {
	border-bottom: 0;
}

/* ---------------------------------------------------------------------------
 * Über-uns-Box (Sidebar, Vertrauens-Anker für Search-Besucher)
 * ------------------------------------------------------------------------- */
.telsche-ueberbox {
	overflow: hidden;
	font-family: var(--wp--preset--font-family--figtree);
}

.telsche-ueberbox__foto {
	width: 100%;
	height: 340px;
	object-fit: cover;
	object-position: center 35%;
	display: block;
}

.telsche-ueberbox__body {
	padding: 16px 18px 18px;
}

.telsche-ueberbox__text {
	font-size: 13.5px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-body);
	margin: 8px 0 0;
}

.telsche-ueberbox__links {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 16px;
	margin-top: 12px;
}

.telsche-ueberbox__links a {
	font-size: 13px;
	font-weight: 600;
}

/* ---------------------------------------------------------------------------
 * Newsletter-Box (cream)
 * ------------------------------------------------------------------------- */
.telsche-newsletter {
	background: var(--wp--preset--color--cream);
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--card);
	padding: 20px 22px;
}

.telsche-newsletter__text {
	font-size: 13.5px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-muted);
	margin-top: 8px;
}

.telsche-newsletter__form {
	display: flex;
	gap: 8px;
	margin-top: 14px;
}

.telsche-newsletter__input {
	flex: 1;
	min-width: 0;
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--button);
	background: var(--wp--preset--color--card-white);
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
	padding: 10px 14px;
}

.telsche-newsletter__input:focus {
	outline: 2px solid var(--wp--preset--color--hull-green);
	outline-offset: -1px;
}

.telsche-newsletter__submit {
	border: 0;
	border-radius: var(--wp--custom--radius--button);
	background: var(--wp--preset--color--hull-green);
	color: var(--wp--preset--color--white-soft);
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
	font-weight: 600;
	padding: 10px 18px;
	cursor: pointer;
	transition: background 150ms ease;
}

.telsche-newsletter__submit:hover {
	background: var(--wp--preset--color--ink);
}

.telsche-newsletter__hinweis {
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 9px;
	color: var(--wp--preset--color--text-faint-warm);
	margin: 8px 0 0;
}

/* Jetpack-Variante (live): ans Designsystem angleichen */
.telsche-newsletter .wp-block-jetpack-subscriptions input[type="email"] {
	border: 1px solid var(--wp--preset--color--border-strong) !important;
	border-radius: var(--wp--custom--radius--button) !important;
	font-family: var(--wp--preset--font-family--figtree) !important;
	font-size: 13.5px !important;
}

.telsche-newsletter .wp-block-jetpack-subscriptions button {
	background: var(--wp--preset--color--hull-green) !important;
	border-radius: var(--wp--custom--radius--button) !important;
	font-family: var(--wp--preset--font-family--figtree) !important;
	font-size: 13.5px !important;
	font-weight: 600 !important;
}

/* Themenwelt-Chips im Logbuch-Filter: dezent grün abgesetzt */
.telsche-chip--welt {
	border-color: var(--wp--preset--color--hull-green);
	color: var(--wp--preset--color--hull-green);
}

.telsche-chip--welt.is-active {
	background: var(--wp--preset--color--hull-green);
	border-color: var(--wp--preset--color--hull-green);
	color: var(--wp--preset--color--white-soft);
}

/* Guide-Anker-Chip im Hero + Anker-Offset des Bandes */
.telsche-hero-chips {
	margin-top: 22px;
	align-items: center;
}

.telsche-hero-chips .telsche-chips {
	display: contents;
}

.telsche-hub__hero-text .telsche-hero-chips .telsche-chips {
	margin-top: 0;
}

a.telsche-chip--guide {
	background: var(--wp--preset--color--hull-green);
	border-color: var(--wp--preset--color--hull-green);
	color: var(--wp--preset--color--white-soft);
	text-decoration: none;
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: var(--wp--preset--font-size--mono-xs);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: 6px 14px;
}

a.telsche-chip--guide:hover {
	background: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--ink);
}

.telsche-hub__guideband {
	scroll-margin-top: 16px;
}

/* Flotten-Gruppen: Abstand zwischen Kernlinie und Sonderlingen */
.telsche-verzeichnisblock .telsche-weltorte + .telsche-weltorte {
	margin-top: clamp(36px, 5vw, 56px);
}

/* Steckbrief: verknüpfte Artikel-Liste */
.telsche-steckbrief__artikel {
	padding: 12px 18px 16px;
	border-top: 1px solid var(--wp--preset--color--border);
}

.telsche-steckbrief__artikel .telsche-linkliste__zeile {
	font-size: 13.5px;
	padding: 8px 0;
}

.telsche-steckbrief__artikel .telsche-linkliste__zeile:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}

/* Gewährleistungshinweis unter den Hafen-Kontaktdaten.
   Sitzt als letztes Kind IN der Karte – deshalb eigene Flächenfarbe und
   Innenabstand statt Außenabstand, sonst rutscht er optisch heraus. */
.telsche-datenblatt__hinweis {
	margin: 0 !important;
	padding: .8rem 1rem 1rem;
	background: var(--wp--preset--color--card-white);
	font-size: .72rem;
	line-height: 1.45;
	color: var(--wp--preset--color--tinte-schwach, #6b6459);
	border-top: 1px solid var(--wp--preset--color--border);
}

/* Lange URLs und Mailadressen dürfen im schmalen Datenblatt umbrechen. */
.telsche-datenblatt__table a {
	overflow-wrap: anywhere;
}

/* Lizenzangabe unter dem Hero-Bild – klein, zurückhaltend, aber lesbar. */
.telsche-bildnachweis {
	margin: .5rem 0 0;
	font-size: .7rem;
	line-height: 1.4;
	color: var(--wp--preset--color--tinte-schwach, #6b6459);
	opacity: .8;
}
.telsche-boot__hero .telsche-bildnachweis {
	color: rgba(255, 255, 255, .75);
}

/*
 * Bildunterschrift im Ort-Hero. Sie liegt wie der Nachweis ueber dem Bild
 * und muss deshalb hell sein. Breite begrenzt, damit ein Satz nicht ueber
 * die ganze Heroflaeche laeuft und unlesbar wird.
 */
.telsche-boot__hero .telsche-bildunterschrift {
	max-width: 62ch;
	margin-top: 8px;
	color: rgba(255, 255, 255, .92);
	text-shadow: 0 1px 2px rgba(0, 0, 0, .45);
}
.telsche-bildnachweis a {
	color: inherit;
	text-decoration: underline;
}

/* ---------------------------------------------------------------------------
 * Törn-Etappen
 *
 * Die Etappenliste ist der Kern einer Törnidee: eine nummerierte Folge von
 * Orten, die jeweils auf die Hafen- oder Ankerplatzseite führen. Der Text
 * daneben sagt, warum dieser Ort in diesem Törn vorkommt – die Details
 * stehen auf der Ortsseite, nicht hier.
 * ------------------------------------------------------------------------- */
.telsche-etappen {
	margin: 40px 0 0;
}

.telsche-etappen__heading {
	font-family: var(--wp--preset--font-family--newsreader);
	margin: 0 0 4px;
}

.telsche-etappen__intro {
	margin: 0 0 22px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--wp--preset--color--text-muted);
}

.telsche-etappen__gruppe {
	margin: 26px 0 8px;
	color: var(--wp--preset--color--hull-green);
	font-weight: 500;
}

.telsche-etappen__liste {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: etappe;
}

.telsche-etappen__punkt {
	display: flex;
	gap: 14px;
	padding: 14px 0;
	border-bottom: 1px dashed var(--wp--preset--color--border);
}

.telsche-etappen__punkt:last-child {
	border-bottom: 0;
}

.telsche-etappen__nr {
	flex: 0 0 auto;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--wp--preset--color--chip-green);
	color: var(--wp--preset--color--hull-green);
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 13px;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
}

.telsche-etappen__body {
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.telsche-etappen__ort {
	display: flex;
	align-items: baseline;
	gap: 10px;
	flex-wrap: wrap;
}

.telsche-etappen__ort a {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 19px;
	font-weight: 500;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.telsche-etappen__ort a:hover {
	color: var(--wp--preset--color--sail-red);
}

.telsche-etappen__text {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 15.5px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-muted);
}

/* ---------------------------------------------------------------------------
 * Guide-Familie
 *
 * Steht in allen vier Rügen-Guides und macht sichtbar, dass es vier sind.
 * Der Guide, auf dem man gerade ist, wird hervorgehoben und nicht verlinkt –
 * sonst klickt man im Kreis.
 * ------------------------------------------------------------------------- */
.telsche-guidefamilie {
	margin: 36px 0;
}

.telsche-guidefamilie__intro {
	margin: 10px 18px 4px;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 15px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-muted);
}

.telsche-guidefamilie__liste {
	list-style: none;
	margin: 0;
	padding: 0;
}

.telsche-guidefamilie__punkt {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 2px 12px;
	padding: 12px 18px;
	border-top: 1px solid var(--wp--preset--color--border);
}

/*
 * „Du bist hier" muss auf einen Blick lesbar sein – der helle Ton allein war
 * dafür zu leise. Rot markiert die Stelle, flutet sie aber nicht: ein Balken
 * an der Kante und das Label in Rot. Eine ganz rote Zeile mit weißer Schrift
 * wäre das lauteste Element der Seite und würde dem Artikel die Aufmerksamkeit
 * nehmen, den sie eigentlich nur einordnen soll.
 */
.telsche-guidefamilie__punkt.is-aktiv {
	background: var(--wp--preset--color--chip-green);
	box-shadow: inset 3px 0 0 var(--wp--preset--color--sail-red);
}

.telsche-guidefamilie__punkt.is-aktiv .telsche-guidefamilie__titel {
	font-weight: 600;
}

.telsche-guidefamilie__punkt.is-aktiv .telsche-eyebrow {
	color: var(--wp--preset--color--sail-red);
}

.telsche-guidefamilie__titel {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 18px;
	font-weight: 500;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

a.telsche-guidefamilie__titel:hover {
	color: var(--wp--preset--color--sail-red);
}

.telsche-guidefamilie__punkt .telsche-eyebrow {
	align-self: center;
	text-align: right;
}

.telsche-guidefamilie__text {
	grid-column: 1 / -1;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-muted);
}

@media (max-width: 600px) {
	.telsche-guidefamilie__punkt {
		grid-template-columns: 1fr;
	}
	.telsche-guidefamilie__punkt .telsche-eyebrow {
		text-align: left;
	}
}

/* ---------------------------------------------------------------------------
   Buch ↔ Törnidee: dieselbe Karte in beide Richtungen. Auf der Buchseite
   steht darin der Törn, auf der Törnseite die Rezension – deshalb ein
   gemeinsames Muster und keine zwei Bausteine.
   --------------------------------------------------------------------------- */
.telsche-buchtoern {
	margin: 36px 0;
}

.telsche-buchtoern__karte {
	display: flex;
	gap: 18px;
	align-items: flex-start;
	padding: 16px 18px 18px;
	text-decoration: none;
	color: inherit;
}

.telsche-buchtoern__karte + .telsche-buchtoern__karte {
	border-top: 1px solid var(--wp--preset--color--border);
}

/* Buchcover stehen hochkant, Törnbilder liegen – beide auf dieselbe Höhe. */
.telsche-buchtoern img.telsche-buchtoern__cover {
	width: 76px;
	height: auto;
	flex: 0 0 auto;
	border-radius: var(--wp--custom--radius--cover);
	box-shadow: var(--wp--custom--shadow--cover);
}

.telsche-buchtoern img.telsche-buchtoern__bild {
	width: 112px;
	height: 84px;
	flex: 0 0 auto;
	object-fit: cover;
	border-radius: 8px;
}

.telsche-buchtoern__text {
	display: grid;
	gap: 5px;
}

.telsche-buchtoern__titel {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 19px;
	line-height: 1.25;
	color: var(--wp--preset--color--ink);
}

.telsche-buchtoern__kurz {
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-muted);
}

.telsche-buchtoern__cta {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
	font-weight: 600;
	color: var(--wp--preset--color--sail-red);
}

.telsche-buchtoern__karte:hover .telsche-buchtoern__titel {
	color: var(--wp--preset--color--sail-red);
}

@media (max-width: 600px) {
	.telsche-buchtoern__karte {
		gap: 14px;
	}

	.telsche-buchtoern img.telsche-buchtoern__bild {
		width: 88px;
		height: 66px;
	}
}

/* ---------------------------------------------------------------------------
   Startseite: „Vier Guides, ein Revier" und „Aus unseren Rügen-Guides"

   Zwei Abschnitte über die volle Breite, gebaut wie die Themenwelten-Reihe
   darüber: Eyebrow, Überschrift, Inhalt. Kein Kasten, keine Seitenspalte.
   Erst die vier Wege ins Revier, dann sechs Beispiele aus dem Bestand.
   --------------------------------------------------------------------------- */

/* Vier Kacheln nebeneinander wie die Themenwelten – der Guide-Teaser steht
   sonst in der schmalen Hauptspalte eines Hubs und ist dort zweispaltig. */
.telsche-heimguides .telsche-guideteaser {
	grid-template-columns: repeat(4, 1fr) !important;
}

@media (max-width: 1100px) {
	.telsche-heimguides .telsche-guideteaser {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}

@media (max-width: 600px) {
	.telsche-heimguides .telsche-guideteaser {
		grid-template-columns: 1fr !important;
	}
}

/* Sechs Empfehlungen in zwei Spalten: je Zeile ein Paar desselben Typs. */
.telsche-heimrevier__liste {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: clamp(24px, 3vw, 48px);
}

@media (max-width: 900px) {
	.telsche-heimrevier__liste {
		grid-template-columns: 1fr;
	}
}

/* In der letzten Zeile stört die Trennlinie – einspaltig nur beim letzten. */
.telsche-heimrevier__liste li:nth-last-child(-n+2) {
	border-bottom: 0;
}

@media (max-width: 900px) {
	.telsche-heimrevier__liste li:nth-last-child(-n+2) {
		border-bottom: 1px dashed var(--wp--preset--color--border-strong);
	}

	.telsche-heimrevier__liste li:last-child {
		border-bottom: 0;
	}
}

.telsche-heimrevier__mehr {
	margin: 20px 0 0;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 14.5px;
	line-height: 1.7;
	color: var(--wp--preset--color--text-muted);
}

.telsche-heimrevier__mehr a {
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	border-bottom: 1px solid var(--wp--preset--color--border-strong);
}

.telsche-heimrevier__mehr a:hover {
	color: var(--wp--preset--color--sail-red);
	border-bottom-color: var(--wp--preset--color--sail-red);
}

/* Der Weg in den ganzen Revierteil steht für sich, nicht in der Aufzählung. */
.telsche-heimrevier__alles {
	display: block;
	margin-top: 10px;
}

.telsche-heimrevier__alles a {
	color: var(--wp--preset--color--sail-red);
	border-bottom: 0;
}

/* ---------------------------------------------------------------------------
   Bordbibliothek: Kaufberatungen als Kacheln in einer Reihe

   Klasse bewusst telsche-kaufberatungen: telsche-bibteaser ist bereits
   vergeben -- so heisst der Bordbibliothek-Teaser in der Seitenleiste.

   Dasselbe Muster wie Themenwelten und Guide-Kacheln. Etwas höher als jene,
   weil die Titel hier ganze Fragen sind und über drei Zeilen laufen können.
   --------------------------------------------------------------------------- */
.telsche-kaufberatungen {
	grid-template-columns: repeat(4, 1fr);
	margin-bottom: clamp(32px, 5vw, 56px);
}


@media (max-width: 1100px) {
	.telsche-kaufberatungen {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.telsche-kaufberatungen {
		grid-template-columns: 1fr;
	}

}

/* ---------------------------------------------------------------------------
   Ort im Fließtext (telsche/ort-tipp)

   Der Standard, um in einem Logbucheintrag einen Hafen oder Ankerplatz zu
   featuren. Bewusst schmaler und ruhiger als die Buch-Boxen: Sie unterbricht
   den Text, sie ersetzt ihn nicht. Deshalb Bild links in Briefmarkengröße,
   kein Rahmen, nur eine Linie an der Kante in unserem Rot – dieselbe Sprache
   wie „Du bist hier" in der Guide-Familie.
   --------------------------------------------------------------------------- */
.telsche-orttipp {
	margin: 28px 0;
	border-left: 3px solid var(--wp--preset--color--sail-red);
	background: var(--wp--preset--color--cream);
	border-radius: 0 var(--wp--custom--radius--cardLg) var(--wp--custom--radius--cardLg) 0;
}

.telsche-orttipp__karte {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	padding: 16px 18px;
	text-decoration: none;
	color: inherit;
}

.telsche-orttipp img.telsche-orttipp__bild,
.telsche-orttipp .telsche-orttipp__bild--leer {
	width: 104px;
	height: 78px;
	flex: 0 0 auto;
	object-fit: cover;
	border-radius: 8px;
	background: var(--wp--preset--color--chip-green);
	display: block;
}

.telsche-orttipp__text {
	display: grid;
	gap: 4px;
	min-width: 0;
}

.telsche-orttipp__name {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 19px;
	line-height: 1.25;
	color: var(--wp--preset--color--ink);
}

.telsche-orttipp__hinweis {
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-body);
}

.telsche-orttipp__fakten {
	font-size: 12px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-muted);
}

.telsche-orttipp__cta {
	margin-top: 2px;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
	font-weight: 600;
	color: var(--wp--preset--color--sail-red);
}

.telsche-orttipp__karte:hover .telsche-orttipp__name {
	color: var(--wp--preset--color--sail-red);
}

@media (max-width: 600px) {
	.telsche-orttipp__karte {
		gap: 12px;
		padding: 14px;
	}

	.telsche-orttipp img.telsche-orttipp__bild,
	.telsche-orttipp .telsche-orttipp__bild--leer {
		width: 76px;
		height: 60px;
	}
}


/*
 * Naturschutz-Hinweis im Fliesstext.
 *
 * Bewusst als Gegenstueck zur roten Ort-Box gebaut: gleiche Geometrie, nur
 * gruen. Rot heisst bei uns "schau dir das an", gruen heisst "hier gilt
 * etwas". Ohne Bild, weil die Box nicht werben, sondern informieren soll –
 * und weil sie oft mehrfach auf einer Seite steht.
 */
.telsche-naturschutz {
	margin: 28px 0;
	padding: 16px 18px;
	display: grid;
	gap: 5px;
	border-left: 3px solid var(--wp--preset--color--hull-green);
	background: var(--wp--preset--color--chip-green);
	border-radius: 0 var(--wp--custom--radius--cardLg) var(--wp--custom--radius--cardLg) 0;
}

.telsche-naturschutz__label {
	color: var(--wp--preset--color--hull-green);
}

.telsche-naturschutz__gebiet {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 19px;
	line-height: 1.25;
	color: var(--wp--preset--color--ink);
}

.telsche-naturschutz__hinweis {
	margin: 0;
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-body);
}

.telsche-naturschutz__quelle {
	font-size: 12px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-muted);
}

.telsche-naturschutz__cta {
	margin-top: 2px;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13.5px;
	font-weight: 600;
	color: var(--wp--preset--color--hull-green);
	text-decoration: none;
}

.telsche-naturschutz__cta:hover {
	text-decoration: underline;
}

@media (max-width: 600px) {
	.telsche-naturschutz {
		padding: 14px;
	}
}


/*
 * Bildunterschrift zum Beitragsbild. Etwas groesser und dunkler als der
 * Bildnachweis darunter – sie ist Text, der Nachweis ist Kleingedrucktes.
 */
.telsche-bildunterschrift {
	margin: 10px 0 0;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-muted);
}


/*
 * Merkbox: die Kurzfassung am Artikelanfang.
 *
 * Bewusst anders als die gruene Naturschutz- und die rote Ort-Box gebaut:
 * die stehen mitten im Text und unterbrechen ihn, diese hier steht davor
 * und ersetzt ihn fuer alle, die es eilig haben. Deshalb ein voller Rahmen
 * statt einer Kante links, und Zahlen statt Aufzaehlungspunkten – man soll
 * sagen koennen "Punkt drei".
 */
.telsche-merkbox {
	margin: 0 0 34px;
	padding: 22px 24px 20px;
	background: var(--wp--preset--color--cream);
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: var(--wp--custom--radius--frame);
}

.telsche-merkbox__kopf {
	display: grid;
	gap: 4px;
	margin-bottom: 14px;
}

.telsche-merkbox__eyebrow {
	color: var(--wp--preset--color--teak);
}

.telsche-merkbox__titel {
	font-family: var(--wp--preset--font-family--newsreader);
	font-size: 23px;
	line-height: 1.2;
	color: var(--wp--preset--color--ink);
}

.telsche-merkbox__liste {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: merkbox;
	display: grid;
	gap: 11px;
}

.telsche-merkbox__punkt {
	counter-increment: merkbox;
	position: relative;
	padding-left: 34px;
	font-size: 15px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-body);
}

.telsche-merkbox__punkt::before {
	content: counter(merkbox);
	position: absolute;
	left: 0;
	top: 1px;
	width: 22px;
	height: 22px;
	display: grid;
	place-items: center;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--hull-green);
	color: var(--wp--preset--color--white-soft);
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 12px;
	font-weight: 600;
}

.telsche-merkbox__label {
	font-weight: 600;
	color: var(--wp--preset--color--ink);
}

.telsche-merkbox__link {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px solid transparent;
}

.telsche-merkbox__link:hover .telsche-merkbox__label,
.telsche-merkbox__link:focus-visible .telsche-merkbox__label {
	color: var(--wp--preset--color--hull-green);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.telsche-merkbox__fuss {
	margin: 16px 0 0;
	padding-top: 14px;
	border-top: 1px dashed var(--wp--preset--color--border-strong);
	font-size: 14px;
	line-height: 1.55;
	color: var(--wp--preset--color--text-muted);
}

.telsche-merkbox__fuss a {
	color: var(--wp--preset--color--hull-green);
	text-decoration: none;
	border-bottom: 1px solid var(--wp--preset--color--border-strong);
}

.telsche-merkbox__fuss a:hover {
	border-bottom-color: var(--wp--preset--color--hull-green);
}

@media (max-width: 600px) {
	.telsche-merkbox {
		padding: 18px 16px 16px;
	}

	.telsche-merkbox__titel {
		font-size: 20px;
	}

	.telsche-merkbox__punkt {
		padding-left: 30px;
		font-size: 14.5px;
	}
}


/*
 * Waren wir da? Der Marker ganz vorn in der Quick-Facts-Leiste.
 *
 * Bewusst als gefuellter Chip gebaut und nicht als weiteres Mono-Item mit
 * Dreieck: Er beantwortet keine Frage ueber den Ort, sondern eine ueber uns,
 * und diesen Unterschied soll man sehen. Gruen fuer "selbst gelegen", neutral
 * umrandet fuer "noch nicht" – kein Rot, weil Recherche kein Makel ist.
 */
.telsche-ortfakten__erfahrung {
	font-family: var(--wp--preset--font-family--plex-mono);
	font-size: 11px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	white-space: nowrap;
	padding: 3px 10px 4px;
	border-radius: var(--wp--custom--radius--pill);
	line-height: 1.2;
}

.telsche-ortfakten__erfahrung--ja {
	background: var(--wp--preset--color--hull-green);
	color: var(--wp--preset--color--white-soft);
}

.telsche-ortfakten__erfahrung--nein {
	background: transparent;
	border: 1px solid var(--wp--preset--color--border-strong);
	color: var(--wp--preset--color--text-muted);
}

/* Consent-Banner (GA4) - fest unten, bis Entscheidung getroffen wurde. */
.telsche-consent {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9999;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 24px;
	background: var(--wp--preset--color--ink);
	box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.2);
}

.telsche-consent[hidden] {
	display: none;
}

.telsche-consent__text {
	margin: 0;
	max-width: 60ch;
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--wp--preset--color--white-warm);
}

.telsche-consent__text a {
	color: var(--wp--preset--color--teak-light);
}

.telsche-consent__buttons {
	display: flex;
	gap: 10px;
	flex-shrink: 0;
}

.telsche-consent__btn {
	font-family: var(--wp--preset--font-family--figtree);
	font-size: 13px;
	font-weight: 600;
	padding: 10px 18px;
	border-radius: var(--wp--custom--radius--pill);
	cursor: pointer;
	border: 1px solid transparent;
}

.telsche-consent__btn--accept {
	background: var(--wp--preset--color--hull-green);
	color: var(--wp--preset--color--white-soft);
}

.telsche-consent__btn--reject {
	background: transparent;
	border-color: var(--wp--preset--color--border-strong);
	color: var(--wp--preset--color--white-warm);
}

@media (max-width: 600px) {
	.telsche-consent {
		flex-direction: column;
		align-items: stretch;
		text-align: left;
	}
	.telsche-consent__buttons {
		justify-content: stretch;
	}
	.telsche-consent__btn {
		flex: 1;
	}
}

/* Jetpack "Teilen mit" / "Gefällt mir" nebeneinander statt gestapelt -
 * spart Platz, beide Widgets sind von Jetpack injiziert, kein eigenes
 * Markup. Die Like-Box setzt selbst width:100% (Jetpack-CSS), deshalb
 * hier mit hoeherer Spezifitaet auf auto zurueckgesetzt. */
div.sharedaddy {
	display: inline-block;
	vertical-align: top;
	margin-right: 32px;
}

div.sharedaddy.jetpack-likes-widget-wrapper {
	width: auto;
	min-width: 160px;
}