/* =========================================================================
   der Stoffladen – Pattern-Styles
   Nur Design-Elemente, die theme.json NICHT abbilden kann (Pills, Chips).
   Farben/Abstände über die theme.json-CSS-Variablen – kein hartcodiertes Theming.
   Geladen via enqueue_block_assets (Front-end + Editor).
   ========================================================================= */

/* Eyebrow als gestricheltes Pill (z. B. «Stoffe · Mercerie · Nähkurse — Belp»)
   Werte exakt nach Vorlage (derStoffladen.dc.html Z. 91). */
.dsl-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	width: fit-content;
	margin: 0;
	padding: 8px 15px;
	border: 1.5px dashed var(--wp--preset--color--teal);
	border-radius: 999px;
	font: 600 12px/1 "Inter", sans-serif;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--teal-deep);
	background: rgba(40, 190, 204, 0.08);
}

/* Hero-Eyebrow: zusätzliches «<>»-Icon links (nur hier, andere Eyebrows ohne Icon) */
.dsl-eyebrow--icon::before {
	content: "";
	width: 15px;
	height: 15px;
	flex: 0 0 auto;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%230E7C87' stroke-width='2'%3E%3Cpath d='M3 6l6 6-6 6M21 6l-6 6 6 6'/%3E%3C/svg%3E");
}

/* Merkmal-Chips (z. B. «Anfänger:innen willkommen») mit SVG-Häkchen.
   Werte exakt nach Vorlage (derStoffladen.dc.html Z. 111). */
.dsl-chip {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	padding: 8px 13px;
	background: #fff;
	border: 1px solid var(--wp--preset--color--paper-deep);
	border-radius: 999px;
	font: 600 13px/1 "Inter", sans-serif;
	color: var(--wp--preset--color--ink-2);
}

.dsl-chip::before {
	content: "";
	width: 14px;
	height: 14px;
	flex: 0 0 auto;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2.4'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
}

/* =========================================================================
   Hero (Startseite) — exakt nach Vorlage (derStoffladen.dc.html, Z. 87–137)
   Bilder/Texte editierbar (native Blöcke); hier nur Layout/Optik der Vorlage.
   ========================================================================= */

/* Section: 24px horizontal kommt vom Root-Padding, vertikal wie Vorlage (64/40) */
.dsl-hero {
	padding-top: 64px;
	padding-bottom: 40px;
}

/* Zwei Spalten: Text + Bild-Collage, Vorlage-Flexwerte (Rest via wp:group-Flex) */
.dsl-hero-text {
	flex: 1 1 460px;
	min-width: min(320px, 100%);
}
.dsl-hero-art {
	flex: 1 1 420px;
	/* min() statt fixem Minimum: auf schmalen Viewports (375er-Geräte haben
	   nach 2×24px Root-Padding nur 327px) sonst 14px horizontaler Overflow. */
	min-width: min(360px, 100%);
	position: relative;
	min-height: 540px;
}

/* Titel */
.dsl-hero-text .dsl-hero-title {
	margin: 22px 0 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(2.6rem, 5.4vw, 4.2rem);
	line-height: 1.02;
	letter-spacing: -0.03em;
	color: var(--wp--preset--color--ink);
}
.dsl-hero-title em {
	font-style: italic;
	color: var(--wp--preset--color--teal);
}

/* Lead */
.dsl-hero-text .dsl-hero-lead {
	margin: 24px 0 0;
	max-width: 520px;
	font: 400 19px/1.6 "Inter", sans-serif;
	color: var(--wp--preset--color--ink-2);
}
.dsl-hero-lead strong {
	color: var(--wp--preset--color--ink);
}

/* Buttons (Vorlage Z. 102–108): grösser als Default, Primär mit Häkchen-Icon */
.dsl-hero-text .dsl-hero-actions {
	margin-top: 30px;
}
.dsl-hero-actions .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 15px 24px;
	border-radius: 11px;
	font: 700 16px/1 "Inter", sans-serif;
}
.dsl-hero-actions .wp-block-button:not(.is-style-outline) .wp-block-button__link {
	box-shadow: 0 10px 24px rgba(19, 153, 166, 0.28);
}
.dsl-hero-actions .wp-block-button:not(.is-style-outline) .wp-block-button__link::before {
	content: "";
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
}
.dsl-hero-actions .wp-block-button.is-style-outline .wp-block-button__link {
	border: 1.5px solid var(--wp--preset--color--ink);
	color: var(--wp--preset--color--ink);
	background: transparent;
}

/* Chips-Reihe Abstand (Vorlage margin-top 28) */
.dsl-hero-text .dsl-hero-chips {
	margin-top: 28px;
}

/* --- Bild-Collage (rechte Spalte) --- */

/* Deko-Streifen hinter den Bildern (Vorlage Z. 121) */
.dsl-hero-art::before {
	content: "";
	position: absolute;
	right: 4px;
	top: 40px;
	width: min(330px, calc(100% - 8px));
	height: 360px;
	border-radius: 22px;
	transform: rotate(-3deg);
	background-color: #f4eadb;
	background-image:
		repeating-linear-gradient(45deg, rgba(40, 190, 204, 0.18) 0 15px, transparent 15px 30px),
		repeating-linear-gradient(-45deg, rgba(40, 190, 204, 0.18) 0 15px, transparent 15px 30px);
	z-index: 0;
}

/* Gerahmte «Polaroid»-Bilder: weisser Rahmen, gestrichelte Kante, gedreht */
.dsl-hero-art .wp-block-image {
	position: absolute;
	margin: 0;
	background: #fff;
	border: 1.6px dashed var(--wp--preset--color--border-dash);
	border-radius: 16px;
}
.dsl-hero-art .wp-block-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 9px;
}
.dsl-hero-img--main {
	right: 24px;
	top: 0;
	width: 300px;
	height: 400px;
	padding: 10px;
	transform: rotate(2.5deg);
	box-shadow: 0 22px 50px rgba(35, 32, 28, 0.16);
	z-index: 2;
}
.dsl-hero-img--fabric {
	left: 0;
	top: 128px;
	width: 218px;
	height: 272px;
	padding: 9px;
	transform: rotate(-4.5deg);
	box-shadow: 0 18px 40px rgba(35, 32, 28, 0.14);
	z-index: 3;
}
.dsl-hero-img--bag {
	right: 74px;
	bottom: -6px;
	width: 182px;
	height: 182px;
	padding: 9px;
	transform: rotate(-2deg);
	box-shadow: 0 16px 36px rgba(35, 32, 28, 0.14);
	z-index: 3;
}

/* «oft ausgebucht»-Badge mit Float-Animation (Vorlage Z. 131–134) */
.dsl-hero-badge {
	position: absolute;
	left: 6px;
	top: 6px;
	width: 96px;
	height: 96px;
	border-radius: 50%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	background: var(--wp--preset--color--terracotta);
	color: #fff;
	box-shadow: 0 12px 26px rgba(197, 107, 74, 0.4);
	animation: floaty 5s ease-in-out infinite;
	z-index: 4;
}
.dsl-hero-badge .dsl-badge-top {
	margin: 0;
	font: 800 18px/1 var(--wp--preset--font-family--display);
}
.dsl-hero-badge .dsl-badge-sub {
	margin: 0;
	font: 700 11px/1.2 "Inter", sans-serif;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

@keyframes floaty {
	0%, 100% { transform: translateY(0) rotate(-6deg); }
	50% { transform: translateY(-7px) rotate(-6deg); }
}

/* Mobil: Spalten brechen um (flex-wrap), Section-Padding wie Vorlage reduzieren */
@media (max-width: 600px) {
	.dsl-hero {
		padding-top: 48px;
		padding-bottom: 48px;
	}
}

/* =========================================================================
   Highlight-Strip «Das Herzstück» — exakt nach Vorlage (derStoffladen.dc.html)
   Dunkles Band; 24px Seiten-Padding kommt vom constrained Root-Padding.
   ========================================================================= */
.dsl-strip {
	padding-top: 22px;
	padding-bottom: 22px;
}

/* Pill «Das Herzstück» (gestrichelt, teal-soft) */
.dsl-strip-pill {
	display: inline-flex;
	align-items: center;
	width: fit-content;
	margin: 0;
	padding: 6px 12px;
	border: 1.4px dashed var(--wp--preset--color--teal-soft);
	border-radius: 999px;
	font: 700 11px/1 "Inter", sans-serif;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--wp--preset--color--teal-soft);
}

/* Claim-Text */
.dsl-strip-text {
	margin: 0;
	font: 500 17px/1.4 "Inter", sans-serif;
	color: rgba(255, 255, 255, 0.9);
}

/* CTA «Jetzt Platz sichern →» (teal-soft, dunkles Petrol-Text via Inline-Style) */
.dsl-strip-cta .wp-block-button__link {
	padding: 12px 20px;
	border-radius: 10px;
	font: 700 15px/1 "Inter", sans-serif;
}

/* =========================================================================
   Kurse & Workshops (3 Karten) — exakt nach Vorlage (derStoffladen.dc.html)
   ========================================================================= */
.dsl-workshops {
	padding-top: 84px;
	padding-bottom: 30px;
}

/* Zentrierter Abschnittskopf */
.dsl-workshops .dsl-ws-head {
	max-width: 680px;
	margin-inline: auto;
	text-align: center;
}
.dsl-workshops .dsl-ws-head .dsl-ws-title {
	margin: 18px 0 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(2rem, 4vw, 3rem);
	line-height: 1.05;
	letter-spacing: -0.025em;
	color: var(--wp--preset--color--ink);
}
.dsl-workshops .dsl-ws-head .dsl-ws-lead {
	margin: 16px 0 0;
	font: 400 18px/1.6 "Inter", sans-serif;
	color: var(--wp--preset--color--ink-2);
}

/* Karten-Grid (auto-fit, Vorlage minmax 300 / gap 22 / margin-top 44) */
.dsl-workshops .dsl-ws-grid {
	margin-top: 44px;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
	gap: 22px;
}

/* Karte */
.dsl-ws-card {
	background: #fff;
	border: 1px solid var(--wp--preset--color--paper-deep);
	border-radius: 18px;
	padding: 28px;
	box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05);
}
.dsl-ws-card--dark {
	background: var(--wp--preset--color--ink);
	border: none;
	color: #fff;
	box-shadow: 0 14px 34px rgba(35, 32, 28, 0.18);
}

/* Icon-Badge (Vorlage 52×52, Icon je Karte via --icon-Variable) */
.dsl-ws-card .dsl-ws-icon {
	width: 52px;
	height: 52px;
	margin-bottom: 16px;
	border-radius: 14px;
	background: rgba(40, 190, 204, 0.12);
	display: flex;
	align-items: center;
	justify-content: center;
}
.dsl-ws-card--dark .dsl-ws-icon {
	background: rgba(40, 190, 204, 0.18);
}
.dsl-ws-icon::before {
	content: "";
	width: 26px;
	height: 26px;
	background: var(--icon) no-repeat center / contain;
}
.dsl-ws-icon--target {
	--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2v20M2 12h20'/%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3C/svg%3E");
}
.dsl-ws-icon--lines {
	--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7h18M3 12h18M3 17h12'/%3E%3C/svg%3E");
}
.dsl-ws-icon--heart {
	--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%2328BECC' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-4.35-9.5-8.5C.5 9 2 5 6 5c2 0 3.5 1.5 4 2.5C10.5 6.5 12 5 14 5c4 0 5.5 4 3.5 7.5C19 16.65 12 21 12 21z'/%3E%3C/svg%3E");
}

/* Karten-Texte */
.dsl-ws-card .dsl-ws-card-title {
	margin: 0 0 8px;
	font: 700 21px var(--wp--preset--font-family--display);
	color: var(--wp--preset--color--ink);
}
.dsl-ws-card--dark .dsl-ws-card-title {
	color: #fff;
}
.dsl-ws-card .dsl-ws-card-text {
	margin: 0;
	font: 400 16px/1.6 "Inter", sans-serif;
	color: var(--wp--preset--color--ink-2);
}
.dsl-ws-card .dsl-ws-card-text strong {
	color: var(--wp--preset--color--ink);
}
.dsl-ws-card--dark .dsl-ws-card-text {
	margin: 0 0 14px;
	color: rgba(255, 255, 255, 0.82);
}

/* «Platz anfragen →» (nur dunkle Karte) */
.dsl-ws-card .dsl-ws-link {
	margin: 0;
}
.dsl-ws-card .dsl-ws-link a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--wp--preset--color--teal-soft);
	font: 700 15px "Inter", sans-serif;
	text-decoration: none;
}

/* =========================================================================
   Gemeinsame Bausteine für die Startseiten-Sektionen
   ========================================================================= */

/* Gestreifter Sektions-Hintergrund (Stoffe, Kontakt) */
.dsl-striped {
	background-color: var(--wp--preset--color--paper-soft);
	background-image:
		repeating-linear-gradient(45deg, rgba(40, 190, 204, 0.09) 0 16px, transparent 16px 32px),
		repeating-linear-gradient(-45deg, rgba(40, 190, 204, 0.09) 0 16px, transparent 16px 32px);
}

/* Eyebrow-Variante auf dunklem Grund (teal-soft, kein Hintergrund) */
.dsl-eyebrow--light {
	border-color: var(--wp--preset--color--teal-soft);
	color: var(--wp--preset--color--teal-soft);
	background: transparent;
}

/* Eyebrow mit Papierflieger-Icon (Rundgang) */
.dsl-eyebrow--send::before {
	content: "";
	width: 15px;
	height: 15px;
	flex: 0 0 auto;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%230E7C87' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l19-9-9 19-2-8-8-2z'/%3E%3C/svg%3E");
}

/* Gemeinsame Sektions-Überschrift/Lead-Größen werden je Sektion gesetzt (exakte Werte) */

/* =========================================================================
   Stoffe & Mercerie
   ========================================================================= */
.dsl-stoffe { padding-top: 84px; padding-bottom: 84px; }
.dsl-stoffe-row { align-items: center; }
.dsl-stoffe-img {
	margin: 0;
	padding: 12px;
	background: #fff;
	border: 1.6px dashed var(--wp--preset--color--border-dash);
	border-radius: 20px;
	box-shadow: 0 20px 44px rgba(35, 32, 28, 0.12);
	transform: rotate(-1.5deg);
}
.dsl-stoffe-img img {
	display: block;
	width: 100%;
	height: 440px;
	object-fit: cover;
	border-radius: 12px;
}
.dsl-stoffe .dsl-stoffe-title {
	margin: 18px 0 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(2rem, 3.6vw, 2.8rem);
	line-height: 1.06;
	letter-spacing: -0.025em;
	color: var(--wp--preset--color--ink);
}
.dsl-stoffe-lead {
	margin: 16px 0 26px;
	max-width: 480px;
	font: 400 18px/1.65 "Inter", sans-serif;
	color: var(--wp--preset--color--ink-2);
}
.dsl-stoffe-feats {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	max-width: 480px;
}
.dsl-feat {
	display: flex;
	align-items: center;
	gap: 11px;
	margin: 0;
	padding: 15px 16px;
	background: #fff;
	border: 1px solid var(--wp--preset--color--paper-deep);
	border-radius: 13px;
	font: 600 15px "Inter", sans-serif;
	color: var(--wp--preset--color--ink);
}
.dsl-feat::before {
	content: "";
	width: 9px;
	height: 9px;
	flex: 0 0 auto;
	border-radius: 50%;
}
.dsl-feat--teal::before { background: var(--wp--preset--color--teal); }
.dsl-feat--terra::before { background: var(--wp--preset--color--terracotta); }

/* =========================================================================
   Über uns
   ========================================================================= */
.dsl-ueber { padding-top: 84px; padding-bottom: 84px; }
.dsl-ueber-row { align-items: center; }
.dsl-ueber .dsl-ueber-title {
	margin: 18px 0 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(2rem, 3.6vw, 2.8rem);
	line-height: 1.06;
	letter-spacing: -0.025em;
	color: var(--wp--preset--color--ink);
}
.dsl-ueber .dsl-ueber-lead {
	margin: 16px 0 0;
	max-width: 480px;
	font: 400 18px/1.65 "Inter", sans-serif;
	color: var(--wp--preset--color--ink-2);
}
.dsl-ueber .dsl-stats {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 34px;
	margin-top: 30px;
}
.dsl-ueber .dsl-stat {
	display: flex;
	flex-direction: column;
}
.dsl-stat-num {
	margin: 0;
	font: 800 34px var(--wp--preset--font-family--display);
	color: var(--wp--preset--color--teal);
}
.dsl-stat-label {
	margin: 0;
	font: 500 14px "Inter", sans-serif;
	color: var(--wp--preset--color--ink-3);
}
.dsl-ueber-collage {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}
.dsl-ueber-img {
	margin: 0;
}
.dsl-ueber-img img {
	display: block;
	width: 100%;
	height: 143px;
	object-fit: cover;
	border-radius: 16px;
	border: 1px solid var(--wp--preset--color--paper-deep);
}
.dsl-ueber-img--big {
	grid-row: span 2;
}
.dsl-ueber-img--big img {
	height: 300px;
}

/* =========================================================================
   Services
   ========================================================================= */
.dsl-services { padding-top: 74px; padding-bottom: 74px; }
.dsl-services-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
	gap: 20px;
}
.dsl-svc-card {
	background: #fff;
	border: 1px solid var(--wp--preset--color--paper-deep);
	border-radius: 18px;
	padding: 28px;
	box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05);
}
.dsl-svc-card--accent {
	background: var(--wp--preset--color--terracotta);
	border: none;
	color: #fff;
	box-shadow: 0 14px 30px rgba(197, 107, 74, 0.25);
}
.dsl-svc-card .dsl-svc-title {
	margin: 0 0 8px;
	font: 700 20px var(--wp--preset--font-family--display);
	color: var(--wp--preset--color--ink);
}
.dsl-svc-card--accent .dsl-svc-title { color: #fff; }
.dsl-svc-card .dsl-svc-text {
	margin: 0 0 14px;
	font: 400 15px/1.6 "Inter", sans-serif;
	color: var(--wp--preset--color--ink-2);
}
.dsl-svc-card--accent .dsl-svc-text { color: rgba(255, 255, 255, 0.88); margin-bottom: 16px; }
.dsl-svc-price {
	margin: 0;
	font: 800 22px var(--wp--preset--font-family--display);
	color: var(--wp--preset--color--teal);
}
.dsl-svc-price span {
	font: 500 14px "Inter", sans-serif;
	color: var(--wp--preset--color--ink-3);
}
.dsl-svc-cta { margin: 0; }
.dsl-svc-cta a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: #fff;
	color: var(--wp--preset--color--ink);
	padding: 12px 18px;
	border-radius: 10px;
	font: 700 15px "Inter", sans-serif;
	text-decoration: none;
}

/* =========================================================================
   Kundengalerie (dunkel, Masonry)
   ========================================================================= */
.dsl-galerie { padding-top: 84px; padding-bottom: 84px; }
.dsl-galerie .dsl-galerie-head {
	max-width: 640px;
	margin: 0 auto 40px;
	text-align: center;
}
.dsl-galerie-head .dsl-galerie-title {
	margin: 18px 0 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(2rem, 3.8vw, 2.9rem);
	line-height: 1.05;
	letter-spacing: -0.025em;
	color: #fff;
}
.dsl-galerie-head .dsl-galerie-lead {
	margin: 14px 0 0;
	font: 400 18px/1.6 "Inter", sans-serif;
	color: rgba(255, 255, 255, 0.78);
}
.dsl-galerie-grid {
	columns: 4 200px;
	column-gap: 14px;
}
.dsl-galerie-grid .dsl-galerie-img {
	margin: 0 0 14px;
	break-inside: avoid;
}
.dsl-galerie-img img {
	display: block;
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 14px;
}

/* PhotoSwipe-Link um die Galerie-Bilder (Kundengalerie + Workshop-Streifen) */
.dsl-pswp-link {
	display: block;
	line-height: 0;
	cursor: zoom-in;
	border-radius: inherit;
}

/* =========================================================================
   Workshop-Galerie (Foto-Streifen)
   ========================================================================= */
.dsl-wsgal { padding-top: 34px; padding-bottom: 20px; }
.dsl-wsgal .dsl-wsgal-head {
	align-items: flex-end;
	gap: 16px;
	margin-bottom: 28px;
}
.dsl-wsgal-title {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(1.5rem, 2.6vw, 2rem);
	letter-spacing: -0.02em;
	color: var(--wp--preset--color--ink);
}
.dsl-wsgal-sub {
	margin: 0;
	font: 500 15px "Inter", sans-serif;
	color: var(--wp--preset--color--ink-3);
}
.dsl-wsgal-card {
	background: #fff;
	border: 1px solid var(--wp--preset--color--paper-deep);
	border-radius: 18px;
	padding: 18px;
	box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05);
}
.dsl-wsgal-card .dsl-wsgal-meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
	margin: 4px 4px 14px;
}
.dsl-wsgal-tag {
	margin: 0;
	padding: 5px 10px;
	border-radius: 999px;
	background: rgba(40, 190, 204, 0.12);
	font: 700 10px "Inter", sans-serif;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--teal-deep);
}
.dsl-wsgal-name {
	margin: 0;
	font: 700 20px var(--wp--preset--font-family--display);
	color: var(--wp--preset--color--ink);
}
.dsl-wsgal-date,
.dsl-wsgal-lead-by {
	margin: 0;
	font: 500 14px "Inter", sans-serif;
	color: var(--wp--preset--color--ink-3);
}
.dsl-wsgal-lead-by { margin-left: auto; font-size: 13px; }
.dsl-wsgal-card .dsl-wsgal-note {
	margin: 0 4px 14px;
	font: 400 15px/1.5 "Inter", sans-serif;
	font-style: italic;
	color: var(--wp--preset--color--ink-2);
}
.dsl-wsgal-strip {
	display: flex;
	gap: 12px;
	overflow-x: auto;
	padding: 4px 4px 10px;
}
.dsl-wsgal-strip::-webkit-scrollbar { height: 8px; }
.dsl-wsgal-strip::-webkit-scrollbar-thumb { background: #e0d2bc; border-radius: 99px; }
/* Foto-Streifen: Server-Block rendert <a class="dsl-pswp-link"><img></a> (Lightbox) */
.dsl-wsgal-strip .dsl-pswp-link {
	flex: 0 0 auto;
	display: block;
	line-height: 0;
}
.dsl-wsgal-strip img {
	display: block;
	width: 158px;
	height: 158px;
	object-fit: cover;
	border-radius: 12px;
	border: 1px solid #eadfcd;
}

/* =========================================================================
   Anmeldung & Anfrage (dunkle Box mit Formular-Vorschau)
   ========================================================================= */
.dsl-anm { padding-top: 64px; padding-bottom: 84px; }
.dsl-anm-box {
	background: var(--wp--preset--color--ink);
	border-radius: 26px;
	overflow: hidden;
	gap: 0 !important;
}
.dsl-anm-info {
	padding: 48px 44px;
	color: #fff;
}
.dsl-anm .dsl-anm-title {
	margin: 18px 0 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(2rem, 3.4vw, 2.7rem);
	line-height: 1.06;
	letter-spacing: -0.02em;
	color: #fff;
}
.dsl-anm-lead {
	margin: 16px 0 26px;
	max-width: 380px;
	font: 400 17px/1.6 "Inter", sans-serif;
	color: rgba(255, 255, 255, 0.8);
}
.dsl-anm-line {
	display: grid;
	grid-template-columns: 44px 1fr;
	align-items: center;
	gap: 0 14px;
	margin: 0;
	color: #fff;
}
.dsl-anm-line::before {
	content: "";
	grid-column: 1;
	grid-row: 1 / 3;
	width: 44px;
	height: 44px;
	align-self: center;
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.1) var(--icon) no-repeat center;
}
.dsl-anm-line--phone { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2328BECC' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.9.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E"); }
.dsl-anm-line--mail { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2328BECC' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-10 5L2 7'/%3E%3C/svg%3E"); }
.dsl-anm-line--wa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2328BECC' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M14.5 9.5a4 4 0 1 0-5 5'/%3E%3Cpath d='M3 21l1.9-5.7a9 9 0 1 1 3.8 3.8L3 21z'/%3E%3C/svg%3E"); }
.dsl-anm-l {
	grid-column: 2;
	grid-row: 1;
	font: 500 12px "Inter", sans-serif;
	color: rgba(255, 255, 255, 0.55);
}
.dsl-anm-line a,
.dsl-anm-line > span:last-child {
	grid-column: 2;
	grid-row: 2;
	font: 600 16px "Inter", sans-serif;
	color: #fff;
	text-decoration: none;
}
.dsl-anm-formcol {
	background: var(--wp--preset--color--paper);
	padding: 40px;
}
/* Formular-Vorschau (statisch; echtes Formular folgt in Etappe 3) */
.dsl-form { display: flex; flex-direction: column; gap: 16px; }
.dsl-form .dsl-field { display: flex; flex-direction: column; }
.dsl-form label { font: 600 13px "Inter", sans-serif; color: var(--wp--preset--color--ink); margin-bottom: 7px; }
.dsl-form input,
.dsl-form select,
.dsl-form textarea {
	box-sizing: border-box;
	width: 100%;
	padding: 13px 15px;
	border: 1.5px solid var(--wp--preset--color--border);
	border-radius: 11px;
	font: 400 15px "Inter", sans-serif;
	background: #fff;
	color: var(--wp--preset--color--ink);
	outline: none;
}
.dsl-form textarea { resize: vertical; }
.dsl-form .dsl-check { flex-direction: row; align-items: flex-start; gap: 10px; font: 400 13px/1.45 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }
.dsl-form .dsl-check input { width: 17px; height: 17px; margin-top: 2px; accent-color: var(--wp--preset--color--teal); flex: 0 0 auto; }
.dsl-form-btn {
	margin-top: 4px;
	background: var(--wp--preset--color--teal-deep);
	color: #fff;
	border: none;
	padding: 15px;
	border-radius: 11px;
	font: 700 16px "Inter", sans-serif;
	cursor: pointer;
	box-shadow: 0 10px 22px rgba(19, 153, 166, 0.28);
}

/* =========================================================================
   Virtueller Rundgang (Matterport)
   ========================================================================= */
.dsl-rund { padding-top: 84px; padding-bottom: 30px; }
.dsl-rund .dsl-rund-head {
	align-items: flex-end;
	gap: 24px;
	margin-bottom: 30px;
}
.dsl-rund-intro { max-width: 640px; }
.dsl-rund-intro .dsl-rund-title {
	margin: 18px 0 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(2rem, 3.6vw, 2.8rem);
	line-height: 1.06;
	letter-spacing: -0.025em;
	color: var(--wp--preset--color--ink);
}
.dsl-rund-intro .dsl-rund-lead {
	margin: 16px 0 0;
	max-width: 480px;
	font: 400 18px/1.65 "Inter", sans-serif;
	color: var(--wp--preset--color--ink-2);
}
.dsl-rund-link { margin: 0; }
.dsl-rund-link a {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 13px 20px;
	border-radius: 11px;
	border: 1.5px solid var(--wp--preset--color--ink);
	color: var(--wp--preset--color--ink);
	font: 700 15px "Inter", sans-serif;
	text-decoration: none;
}
.dsl-rund-frame {
	position: relative;
	padding: 12px;
	background: #fff;
	border: 1.6px dashed var(--wp--preset--color--border-dash);
	border-radius: 20px;
	box-shadow: 0 20px 44px rgba(35, 32, 28, 0.12);
}
.dsl-rund-badge {
	position: absolute;
	top: -13px;
	left: 30px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	background: var(--wp--preset--color--terracotta);
	color: #fff;
	font: 700 11px "Inter", sans-serif;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: 6px 13px;
	border-radius: 999px;
	box-shadow: 0 8px 18px rgba(197, 107, 74, 0.32);
}
.dsl-rund-badge::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #fff;
}
.dsl-rund-embed {
	position: relative;
	aspect-ratio: 16 / 9;
	border-radius: 12px;
	overflow: hidden;
	background: var(--wp--preset--color--ink);
}
.dsl-rund-embed iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}
.dsl-rund .dsl-rund-tip {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 14px 4px 0;
	font: 500 13px "Inter", sans-serif;
	color: var(--wp--preset--color--ink-3);
}
.dsl-rund-tip::before {
	content: "";
	width: 15px;
	height: 15px;
	flex: 0 0 auto;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%239B8E7E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

/* =========================================================================
   Kontakt – Virtueller Rundgang (zentriert, 1:1 Kontakt.dc.html)
   ========================================================================= */
.dsl-krund { padding: 80px 24px 24px; }
.dsl-krund .dsl-krund-head {
	max-width: 680px;
	margin: 0 auto;
	text-align: center;
}
.dsl-krund-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	margin: 0;
	padding: 8px 15px;
	border: 1.5px dashed var(--wp--preset--color--teal);
	border-radius: 999px;
	font: 600 12px "Inter", sans-serif;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--teal-deep);
	background: rgba(40, 190, 204, 0.08);
}
.dsl-krund-eyebrow::before {
	content: "";
	width: 15px;
	height: 15px;
	flex: 0 0 auto;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%230E7C87' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l19-9-9 19-2-8-8-2z'/%3E%3C/svg%3E");
}
section.dsl-krund .dsl-krund-title {
	margin: 18px 0 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(2rem, 3.8vw, 2.9rem);
	line-height: 1.05;
	letter-spacing: -0.025em;
	color: var(--wp--preset--color--ink);
}
section.dsl-krund .dsl-krund-lead {
	margin: 16px auto 0;
	max-width: 540px;
	font: 400 18px/1.65 "Inter", sans-serif;
	color: var(--wp--preset--color--ink-2);
}
.dsl-krund-frame {
	position: relative;
	max-width: 1080px;
	margin-inline: auto;
	padding: 12px;
	background: #fff;
	border: 1.6px dashed var(--wp--preset--color--border-dash);
	border-radius: 20px;
	box-shadow: 0 20px 44px rgba(35, 32, 28, 0.12);
}
/* Falle #3: margin-top am direkten Section-Kind wird sonst genullt → höher scopen */
section.dsl-krund .dsl-krund-frame { margin-top: 40px; }
.dsl-krund-badge {
	position: absolute;
	top: -13px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	background: var(--wp--preset--color--terracotta);
	color: #fff;
	font: 700 11px "Inter", sans-serif;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: 6px 13px;
	border-radius: 999px;
	box-shadow: 0 8px 18px rgba(197, 107, 74, 0.32);
}
.dsl-krund-badge::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #fff;
}
.dsl-krund-embed {
	position: relative;
	aspect-ratio: 16 / 9;
	border-radius: 12px;
	overflow: hidden;
	background: var(--wp--preset--color--ink);
}
.dsl-krund-embed iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}
/* Click-to-load-Facade (Matterport erst bei Klick) */
.dsl-krund-facade {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 14px;
	background-color: var(--wp--preset--color--ink);
	background-size: cover;
	background-position: center;
	color: #fff;
}
.dsl-krund-facade::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(35, 32, 28, 0.38);
}
.dsl-krund-play {
	position: relative;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	display: flex;
	align-items: center;
	justify-content: center;
}
.dsl-krund-play::after {
	content: "";
	border-style: solid;
	border-width: 12px 0 12px 20px;
	border-color: transparent transparent transparent var(--wp--preset--color--ink);
	margin-left: 5px;
}
.dsl-krund-cta {
	position: relative;
	font: 700 16px "Inter", sans-serif;
}
.dsl-krund-facade:hover .dsl-krund-play,
.dsl-krund-facade:focus-visible .dsl-krund-play {
	background: #fff;
	transform: scale(1.06);
}
section.dsl-krund .dsl-krund-tip {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	max-width: 1080px;
	margin: 16px auto 0;
	font: 500 13px "Inter", sans-serif;
	color: var(--wp--preset--color--ink-3);
	text-align: center;
}
.dsl-krund-tip::before {
	content: "";
	width: 15px;
	height: 15px;
	flex: 0 0 auto;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%239B8E7E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

/* =========================================================================
   Kontakt & Öffnungszeiten
   ========================================================================= */
.dsl-kontakt { padding-top: 84px; padding-bottom: 84px; }
.dsl-kontakt-row { align-items: flex-start; }
.dsl-kontakt .dsl-kontakt-title {
	margin: 18px 0 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(2rem, 3.6vw, 2.8rem);
	line-height: 1.06;
	letter-spacing: -0.025em;
	color: var(--wp--preset--color--ink);
}
.dsl-kontakt-addr {
	margin: 16px 0 24px;
	font: 400 18px/1.65 "Inter", sans-serif;
	color: var(--wp--preset--color--ink-2);
}
.dsl-kontakt-actions .wp-block-button__link {
	padding: 13px 20px;
	border-radius: 11px;
	font: 700 15px "Inter", sans-serif;
}
.dsl-kontakt-actions .is-style-outline .wp-block-button__link {
	border: 1.5px solid var(--wp--preset--color--ink);
	color: var(--wp--preset--color--ink);
	background: transparent;
}
/* WhatsApp-Kanal-Box: ganze Box ist ein Link (Vorlage derStoffladen.dc.html Z. 417 ff.) */
.dsl-wa {
	margin-top: 24px;
	display: flex;
	align-items: center;
	gap: 18px;
	text-decoration: none;
	background: #fff;
	border: 1.5px solid #cfe9ec;
	border-radius: 18px;
	padding: 18px 20px;
	box-shadow: 0 10px 26px rgba(35, 32, 28, 0.05);
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.dsl-wa:hover {
	transform: translateY(-3px);
	box-shadow: 0 18px 38px rgba(19, 153, 166, 0.16);
	border-color: var(--wp--preset--color--teal-soft);
}
.dsl-wa-icon {
	position: relative;
	flex: none;
	width: 52px;
	height: 52px;
	border-radius: 14px;
	background: linear-gradient(150deg, var(--wp--preset--color--teal-soft), var(--wp--preset--color--teal));
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 8px 18px rgba(19, 153, 166, 0.3);
}
.dsl-wa-dot {
	position: absolute;
	top: -5px;
	right: -5px;
	width: 13px;
	height: 13px;
	border-radius: 50%;
	background: var(--wp--preset--color--terracotta);
	border: 2.5px solid #fff;
}
.dsl-wa-body {
	flex: 1;
	min-width: 0;
}
.dsl-wa-head {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}
.dsl-wa-name {
	font: 700 15px var(--wp--preset--font-family--display);
	color: var(--wp--preset--color--ink);
}
.dsl-wa-badge {
	font: 700 10px "Inter", sans-serif;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--teal-deep);
	background: rgba(40, 190, 204, 0.14);
	border-radius: 999px;
	padding: 3px 8px;
}
.dsl-wa-desc {
	display: block;
	margin-top: 3px;
	font: 400 13px/1.45 "Inter", sans-serif;
	color: var(--wp--preset--color--ink-3);
}
.dsl-wa-btn {
	flex: none;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	background: var(--wp--preset--color--teal-deep);
	color: #fff;
	padding: 10px 15px;
	border-radius: 11px;
	font: 700 14px "Inter", sans-serif;
}
.dsl-hours {
	background: #fff;
	border: 1px solid var(--wp--preset--color--paper-deep);
	border-radius: 18px;
	padding: 30px 32px;
	box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05);
}
.dsl-hours-title {
	margin: 0 0 18px;
	font: 700 20px var(--wp--preset--font-family--display);
	color: var(--wp--preset--color--ink);
}
.dsl-hour {
	padding: 13px 0;
	border-bottom: 1px dashed var(--wp--preset--color--border);
	flex-wrap: nowrap !important;
}
.dsl-hour--closed { border-bottom: none; }
.dsl-hour-day {
	margin: 0;
	font: 600 15px "Inter", sans-serif;
	color: var(--wp--preset--color--ink);
}
.dsl-hour-time {
	margin: 0;
	font: 500 15px "Inter", sans-serif;
	color: var(--wp--preset--color--ink-2);
	text-align: right;
}
.dsl-hour--closed .dsl-hour-day,
.dsl-hour--closed .dsl-hour-time { color: var(--wp--preset--color--ink-3); }

/* =========================================================================
   Unterseiten – gemeinsamer zentrierter Hero (Stoffe/Kurse/Galerie/Kontakt)
   ========================================================================= */
.dsl-subhero {
	padding-top: 60px;
	padding-bottom: 20px;
	text-align: center;
}
.dsl-subhero .dsl-eyebrow {
	margin-inline: auto;
}
.dsl-subhero .dsl-subhero-title {
	margin: 18px 0 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(2.6rem, 5.2vw, 4rem);
	line-height: 1.03;
	letter-spacing: -0.03em;
	color: var(--wp--preset--color--ink);
}
.dsl-subhero .dsl-subhero-title em {
	font-style: italic;
	color: var(--wp--preset--color--teal);
}
.dsl-subhero .dsl-subhero-lead {
	margin: 18px auto 0;
	max-width: 540px;
	font: 400 19px/1.6 "Inter", sans-serif;
	color: var(--wp--preset--color--ink-2);
}

/* =========================================================================
   Kontaktseite – Detail-Grid + Formular
   ========================================================================= */
.dsl-kp {
	padding-top: 30px;
	padding-bottom: 20px;
}
.dsl-kp-cols { align-items: flex-start; }
.dsl-kp-details {
	display: flex;
	flex-direction: column;
	gap: 18px;
}
.dsl-kp-cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}

/* Kontakt-Karte: ganze Karte klickbar (Stretched-Link), Icon als ::before */
.dsl-kp-card {
	position: relative;
	background: #fff;
	border: 1px solid var(--wp--preset--color--paper-deep);
	border-radius: 16px;
	padding: 22px;
	box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05);
}
.dsl-kp-card::before {
	content: "";
	display: block;
	width: 44px;
	height: 44px;
	margin-bottom: 12px;
	border-radius: 12px;
	background: rgba(40, 190, 204, 0.12) var(--icon) no-repeat center;
}
.dsl-kp-card--phone { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.9.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E"); }
.dsl-kp-card--mail { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-10 5L2 7'/%3E%3C/svg%3E"); }
.dsl-kp-l {
	margin: 0;
	font: 500 12px "Inter", sans-serif;
	color: var(--wp--preset--color--ink-3);
}
.dsl-kp-v {
	margin: 0;
	font: 700 17px "Inter", sans-serif;
	color: var(--wp--preset--color--ink);
}
.dsl-kp-v--mail { font-size: 14px; word-break: break-all; }
.dsl-kp-v a { color: inherit; text-decoration: none; }

/* Stretched-Link: ganze Karte/Box klickbar, ohne den Inhalt zu verlassen */
.dsl-kp-stretch::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

/* Öffnungszeiten-Box auf der Kontaktseite (Vorlage: padding 26/28) */
.dsl-kp-hours {
	background: #fff;
	border: 1px solid var(--wp--preset--color--paper-deep);
	border-radius: 18px;
	padding: 26px 28px;
	box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05);
}
.dsl-kp-hours .dsl-hours-title { margin: 0 0 14px; }
.dsl-kp-hours .dsl-hour { padding: 12px 0; }

/* WhatsApp-Box: Icon (::before) | Text | Abonnieren, ganze Box klickbar */
.dsl-kp-wa {
	position: relative;
	display: grid;
	grid-template-columns: 48px 1fr auto;
	align-items: center;
	gap: 0 16px;
	background: var(--wp--preset--color--ink);
	border-radius: 18px;
	padding: 24px 26px;
}
.dsl-kp-wa::before {
	content: "";
	grid-column: 1;
	grid-row: 1 / 3;
	width: 48px;
	height: 48px;
	border-radius: 14px;
	background: rgba(40, 190, 204, 0.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2328BECC' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M14.5 9.5a4 4 0 1 0-5 5'/%3E%3Cpath d='M3 21l1.9-5.7a9 9 0 1 1 3.8 3.8L3 21z'/%3E%3C/svg%3E") no-repeat center;
}
.dsl-kp-wa-text { grid-column: 2; min-width: 0; }
.dsl-kp-wa-name { margin: 0; font: 700 16px "Inter", sans-serif; color: #fff; }
.dsl-kp-wa-sub { margin: 2px 0 0; font: 400 13px "Inter", sans-serif; color: rgba(255, 255, 255, 0.65); }
.dsl-kp-wa-link { grid-column: 3; margin: 0; }
.dsl-kp-wa-link a {
	display: inline-block;
	background: var(--wp--preset--color--teal-soft);
	color: var(--wp--preset--color--teal-ink);
	font: 700 14px "Inter", sans-serif;
	padding: 11px 16px;
	border-radius: 10px;
	text-decoration: none;
}

/* Eingebettete OpenStreetMap-Karte mit Google-Maps-Link */
.dsl-kp-map {
	max-width: 1180px;
	margin: 0 auto;
	position: relative;
	height: 300px;
	border: 1px solid var(--wp--preset--color--paper-deep);
	border-radius: 20px;
	overflow: hidden;
	box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05);
}
/* Falle #3: margin-top am direkten Section-Kind wird sonst genullt → höher scopen */
section.dsl-kp .dsl-kp-map { margin-top: 24px; }
.dsl-kp-map-frame {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	filter: grayscale(0.12) contrast(0.98);
}
.dsl-kp-map-link {
	position: absolute;
	right: 14px;
	bottom: 14px;
	background: #fff;
	color: var(--wp--preset--color--ink);
	border: 1px solid var(--wp--preset--color--paper-deep);
	font: 700 13px "Inter", sans-serif;
	padding: 9px 14px;
	border-radius: 10px;
	box-shadow: 0 6px 16px rgba(35, 32, 28, 0.12);
	text-decoration: none;
}

/* Formular-Spalte (sticky, dunkel) */
.dsl-kp-formwrap {
	position: sticky;
	top: 90px;
	background: var(--wp--preset--color--ink);
	border-radius: 22px;
	padding: 38px 36px;
	color: #fff;
}
.dsl-kp-form-title {
	margin: 0 0 6px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: 1.7rem;
	letter-spacing: -0.02em;
}
.dsl-kp-form-lead {
	margin: 0 0 22px;
	font: 400 15px/1.6 "Inter", sans-serif;
	color: rgba(255, 255, 255, 0.72);
}
.dsl-form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}
/* Dunkle Formular-Felder */
.dsl-form--dark label { color: rgba(255, 255, 255, 0.7); font-size: 12px; margin-bottom: 6px; }
.dsl-form--dark input,
.dsl-form--dark textarea {
	border: 1.5px solid rgba(255, 255, 255, 0.16);
	background: rgba(255, 255, 255, 0.06);
	color: #fff;
	padding: 12px 14px;
	border-radius: 10px;
}
.dsl-form--dark input::placeholder,
.dsl-form--dark textarea::placeholder { color: rgba(255, 255, 255, 0.4); }
.dsl-form-btn--soft {
	background: var(--wp--preset--color--teal-soft);
	color: var(--wp--preset--color--teal-ink);
	box-shadow: none;
}

/* Kontaktseite mobil */
@media (max-width: 820px) {
	.dsl-kp-formwrap { position: static; }
}
@media (max-width: 520px) {
	.dsl-kp-cards { grid-template-columns: 1fr; }
	.dsl-form-row { grid-template-columns: 1fr; }
}

/* =========================================================================
   Kundengalerie – Filter, Masonry, CTA
   ========================================================================= */
/* Galerie-Block: Filter zentriert, dann Masonry */
.dsl-kg-hero { padding-bottom: 10px; }
.dsl-kg-galerie { text-align: center; }

/* Filter-Pills (weisse Box, zentriert über der Galerie) */
.dsl-kg-filter {
	display: inline-flex;
	gap: 9px;
	flex-wrap: wrap;
	justify-content: center;
	padding: 8px;
	background: #fff;
	border: 1px solid var(--wp--preset--color--paper-deep);
	border-radius: 999px;
	box-shadow: 0 8px 22px rgba(35, 32, 28, 0.05);
}
.dsl-kg-fbtn {
	border: none;
	cursor: pointer;
	padding: 10px 20px;
	border-radius: 999px;
	font: 700 14px "Inter", sans-serif;
	background: transparent;
	color: var(--wp--preset--color--ink);
	transition: background 0.15s ease, color 0.15s ease;
}
.dsl-kg-fbtn.is-active {
	background: var(--wp--preset--color--teal-deep);
	color: #fff;
}

/* Masonry-Galerie */
.dsl-kg { padding: 24px 24px 70px; }
.dsl-kg-grid {
	max-width: 1220px;
	margin: 0 auto;
	columns: 4 250px;
	column-gap: 16px;
	text-align: left;
}
.dsl-kg-filter + .dsl-kg-grid { margin-top: 34px; }
.dsl-kg-item {
	position: relative;
	break-inside: avoid;
	margin: 0 0 16px;
	border-radius: 16px;
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--paper-deep);
	box-shadow: 0 8px 22px rgba(35, 32, 28, 0.06);
}
.dsl-kg-item.is-hidden { display: none; }
.dsl-kg-item .dsl-pswp-link { border-radius: 0; }
.dsl-kg-item img {
	display: block;
	width: 100%;
	height: auto;
}
.dsl-kg-label {
	position: absolute;
	left: 12px;
	bottom: 12px;
	background: rgba(35, 32, 28, 0.78);
	color: #fff;
	font: 600 11px "Inter", sans-serif;
	letter-spacing: 0.04em;
	padding: 5px 11px;
	border-radius: 999px;
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}

/* CTA-Band */
.dsl-kg-cta { padding-bottom: 84px; }
.dsl-kg-cta-box {
	background: var(--wp--preset--color--ink);
	border-radius: 24px;
	padding: 48px 44px;
}
.dsl-kg-cta-text .dsl-kg-cta-title {
	margin: 0 0 10px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(1.8rem, 3.2vw, 2.5rem);
	letter-spacing: -0.02em;
	color: #fff;
}
.dsl-kg-cta-text .dsl-kg-cta-lead {
	margin: 0;
	font: 400 17px "Inter", sans-serif;
	color: rgba(255, 255, 255, 0.78);
}
.dsl-kg-cta-btnwrap { margin: 0; }
.dsl-kg-cta-btn {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	background: var(--wp--preset--color--teal-soft);
	color: var(--wp--preset--color--teal-ink);
	padding: 15px 26px;
	border-radius: 12px;
	font: 700 16px "Inter", sans-serif;
	white-space: nowrap;
	text-decoration: none;
}

/* === Header / Nav – Vorlage-CSS (Kontakt.dc.html) auf nativen wp:navigation-Block ===
   Links bleiben editierbar (wp:navigation), Mobil-Toggle = Vorlage-Mechanik (Checkbox +
   .nav-burger), Optik 1:1. Reines CSS, kein WP-Overlay → in jedem Browser identisch. */
/* Der template-part-Wrapper (<header class="wp-block-template-part">) ist nur header-hoch
   und sperrt den sticky-Header sonst ein → layout-transparent machen, damit der Header
   relativ zur ganzen Seite (wp-site-blocks) klebt. */
header.wp-block-template-part { display: contents; }
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(251,246,238,.86); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-bottom: 1px solid var(--wp--preset--color--border-soft); }
.site-header .dsl-nav { position: relative; padding: 12px 0; }
.site-header .wp-block-site-logo { margin: 0; }
.site-header .wp-block-site-logo img { height: 50px; width: auto; border-radius: 8px; }

/* Links (Desktop), gap 28 wie Vorlage */
.nav-links { --wp--style--block-gap: 28px; }
.nav-links .wp-block-navigation-item__content { font: 600 15px/1 "Inter", sans-serif; color: var(--wp--preset--color--ink); text-decoration: none; }
/* Aktuell aufgerufene Seite im Menü petrol hervorheben (aria-current via functions.php) */
.nav-links a[aria-current="page"],
.nav-links a[aria-current="page"] .wp-block-navigation-item__label { color: var(--wp--preset--color--teal-deep); }

/* CTA «Workshop anfragen» als Button (Text weiss, Pfeil links) */
.nav-links a[href*="#anmelden"] {
	display: inline-flex; align-items: center; gap: 8px;
	background: var(--wp--preset--color--teal-deep); color: #fff;
	padding: 11px 18px; border-radius: 10px;
	font: 700 14px/1 "Inter", sans-serif;
	box-shadow: 0 8px 18px rgba(19,153,166,.25);
}
.nav-links a[href*="#anmelden"] .wp-block-navigation-item__label { color: #fff; }
.nav-links a[href*="#anmelden"]::before {
	content: ""; width: 16px; height: 16px; flex: none;
	background: no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
}
.nav-links a[href*="#anmelden"]:hover { background: var(--wp--preset--color--teal-deep); box-shadow: 0 8px 18px rgba(19,153,166,.35); }

/* Burger + versteckte Toggle-Checkbox */
.nav-toggle { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; margin: 0; }
.nav-burger { display: none; align-items: center; justify-content: center; width: 46px; height: 46px; border: 1.5px solid var(--wp--preset--color--border); border-radius: 12px; background: #fff; cursor: pointer; color: var(--wp--preset--color--ink); flex: 0 0 auto; }
.nav-burger .x { display: none; }
.nav-toggle:checked ~ .nav-burger .bars { display: none; }
.nav-toggle:checked ~ .nav-burger .x { display: block; }

/* Mobil (≤880px wie Vorlage): Burger sichtbar, ganze Nav als Dropdown unter dem Header */
@media (max-width: 880px) {
	.nav-burger { display: inline-flex; }
	/* nur das <nav> ansprechen – WP kopiert die Klasse auch aufs <ul> */
	.site-header nav.nav-links {
		position: absolute; top: calc(100% + 1px); left: 0; right: 0;
		background: var(--wp--preset--color--paper); border-bottom: 1px solid var(--wp--preset--color--border-soft);
		padding: 12px 22px 20px; display: none;
		box-shadow: 0 20px 34px rgba(35,32,28,.12);
	}
	.nav-toggle:checked ~ nav.nav-links { display: block; }
	.nav-links .wp-block-navigation__container { flex-direction: column; align-items: stretch; gap: 0; width: 100%; }
	.nav-links .wp-block-navigation-item__content { display: block; width: 100%; font-size: 17px; padding: 11px 4px; border-bottom: 1px solid var(--wp--preset--color--border-soft); }
	.nav-links a[href*="#anmelden"] { justify-content: center; border-bottom: none; margin-top: 8px; padding: 14px 18px; font-size: 15px; }
}

/* === Footer – exakt nach Vorlage (derStoffladen.dc.html) ===
   Abstände kommen aus dem blockGap im Markup (Footer 34, Top 32, Cols 48,
   Brand 14, Spalten 12, Bottom 16). Horizontal-/Vertikal-Padding aus theme.json
   (24px) + Block (54/30). Hier NUR Typografie, Farben, Linien – keine gaps. */
/* Dekorativer Karo-Streifen über dem Footer (Vorlage: 14px, teal-Karos auf Papier) */
.dsl-foot-seam {
	height: 14px;
	background-color: var(--wp--preset--color--paper);
	background-image:
		repeating-linear-gradient(45deg, rgba(40, 190, 204, 0.5) 0 14px, transparent 14px 28px),
		repeating-linear-gradient(-45deg, rgba(40, 190, 204, 0.5) 0 14px, transparent 14px 28px);
}

.site-footer { color: #fff; }
.dsl-foot-brand { max-width: 300px; }
.dsl-foot-brand img { height: 48px; width: auto; border-radius: 8px; }
.dsl-foot-tagline { margin: 0; font: 400 14px/1.6 "Inter", sans-serif; color: rgba(255,255,255,.7); }
.dsl-foot-label { margin: 0; font: 700 12px/1.2 "Inter", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--wp--preset--color--teal-soft); }
.dsl-foot-links { list-style: none; margin: 0; padding: 0; }
.dsl-foot-links li { margin: 0 0 9px; font: 500 15px/1.2 "Inter", sans-serif; color: rgba(255,255,255,.82); }
.dsl-foot-links li:last-child { margin-bottom: 0; }
.dsl-foot-links a { color: inherit; text-decoration: none; }
.dsl-foot-bottom { padding-top: 18px; border-top: 1px dashed rgba(255,255,255,.18); }
.dsl-foot-copy { margin: 0; font: 400 13px/1.4 "Inter", sans-serif; color: rgba(255,255,255,.5); }
.dsl-foot-credit { margin: 0; display: inline-flex; align-items: center; gap: 5px; font: 400 13px/1.4 "Inter", sans-serif; color: rgba(255,255,255,.5); }
.dsl-foot-credit a { color: rgba(255,255,255,.8); font-weight: 600; text-decoration: none; }
.dsl-foot-legal { list-style: none; margin: 0; padding: 0; display: flex; gap: 18px; }
.dsl-foot-legal a { font: 400 13px/1.4 "Inter", sans-serif; color: rgba(255,255,255,.5); text-decoration: none; }

/* =========================================================================
   KURSE-SEITE – exakt nach Kurse.dc.html
   ========================================================================= */

/* --- Hero (dunkel, 2×2-Foto-Grid) – Vorlage Z. 76–94 --- */
.dsl-kurse-hero { padding-block: 70px 78px; color: #fff; overflow: hidden; }
.dsl-khero-inner { display: flex; gap: 56px; align-items: center; flex-wrap: wrap; }
.dsl-khero-text { flex: 1 1 460px; min-width: min(320px, 100%); }
.dsl-khero-text .dsl-khero-title {
	margin: 20px 0 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(2.6rem, 5.2vw, 4rem);
	line-height: 1.03;
	letter-spacing: -0.03em;
	color: #fff;
}
.dsl-khero-text .dsl-khero-title em { color: var(--wp--preset--color--teal-soft); font-style: italic; }
.dsl-khero-text .dsl-khero-lead {
	margin: 22px 0 0;
	max-width: 520px;
	font: 400 19px/1.6 "Inter", sans-serif;
	color: rgba(255, 255, 255, 0.8);
}
.dsl-khero-text .dsl-khero-actions { margin-top: 30px; }
.dsl-khero-cta, .dsl-khero-ghost { margin: 0; }
.dsl-khero-cta a, .dsl-khero-ghost a {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 15px 24px;
	border-radius: 11px;
	font: 700 16px "Inter", sans-serif;
	text-decoration: none;
}
.dsl-khero-cta a { background: var(--wp--preset--color--teal-soft); color: var(--wp--preset--color--teal-ink); }
.dsl-khero-ghost a { background: transparent; color: #fff; border: 1.5px solid rgba(255, 255, 255, 0.3); }
.dsl-khero-art { flex: 1 1 360px; min-width: min(300px, 100%); display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.dsl-khero-art .dsl-khero-img { margin: 0; }
.dsl-khero-art .dsl-khero-img img { width: 100%; height: 220px; object-fit: cover; border-radius: 16px; border: 1px solid rgba(255, 255, 255, 0.12); }
.dsl-khero-art .dsl-khero-img--down img { margin-top: 24px; }

/* --- Zwei Kursarten (3 Karten) – Vorlage Z. 96–122. Nutzt .dsl-ws-card; Terrakotta neu --- */
.dsl-kurse-typen { padding-block: 80px 30px; }
.dsl-kt-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 22px; }
.dsl-ws-card.dsl-ws-card--terra {
	background: var(--wp--preset--color--terracotta);
	border: none;
	color: #fff;
	box-shadow: 0 14px 34px rgba(197, 107, 74, 0.22);
}
.dsl-ws-card--terra .dsl-ws-icon { background: rgba(255, 255, 255, 0.18); }
.dsl-ws-card--terra .dsl-ws-icon--heart {
	--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-4.35-9.5-8.5C.5 9 2 5 6 5c2 0 3.5 1.5 4 2.5C10.5 6.5 12 5 14 5c4 0 5.5 4 3.5 7.5C19 16.65 12 21 12 21z'/%3E%3C/svg%3E");
}
.dsl-ws-card.dsl-ws-card--terra .dsl-ws-card-title { color: #fff; }
.dsl-ws-card.dsl-ws-card--terra .dsl-ws-card-text { margin: 0 0 14px; color: rgba(255, 255, 255, 0.9); }
.dsl-ws-card--terra .dsl-ws-link a { color: #fff; border-bottom: 2px solid rgba(255, 255, 255, 0.5); padding-bottom: 2px; }

/* --- Workshop-Liste: Server-Block hat keinen blockGap → Flex-Gap hier (Startseite + Kurse) --- */
.dsl-wsgal-list { display: flex; flex-direction: column; gap: 18px; }

/* --- Rückblick (Kurse) – Vorlage Z. 124–151 --- */
.dsl-krueck { padding-block: 46px 20px; }
.dsl-krueck-head .dsl-krueck-title {
	margin: 16px 0 6px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(2rem, 3.6vw, 2.8rem);
	letter-spacing: -0.025em;
	color: var(--wp--preset--color--ink);
}
.dsl-krueck-head .dsl-krueck-lead { margin: 0; font: 400 18px "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }
.dsl-krueck .dsl-wsgal-list { margin-top: 28px; }

/* --- Kursteam – Vorlage Z. 153–170 --- */
.dsl-team { padding-block: 64px 20px; }
.dsl-team-box {
	background-color: var(--wp--preset--color--paper-soft);
	background-image:
		repeating-linear-gradient(45deg, rgba(40, 190, 204, 0.09) 0 16px, transparent 16px 32px),
		repeating-linear-gradient(-45deg, rgba(40, 190, 204, 0.09) 0 16px, transparent 16px 32px);
	border-radius: 22px;
	padding: 40px;
	display: flex;
	gap: 40px;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
}
.dsl-team-intro { flex: 1 1 320px; }
.dsl-team-intro .dsl-team-title {
	margin: 16px 0 8px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(1.7rem, 3vw, 2.3rem);
	letter-spacing: -0.02em;
	color: var(--wp--preset--color--ink);
}
.dsl-team-intro .dsl-team-lead { margin: 0; max-width: 420px; font: 400 17px/1.6 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }
.dsl-team-list { flex: 1 1 320px; }
.dsl-team-person {
	background: #fff;
	border: 1px solid var(--wp--preset--color--paper-deep);
	border-radius: 14px;
	padding: 14px 18px;
}
/* Icon→Text-Abstand: blockGap:0 des Flex-Groups würde gap killen → höher scopen */
.dsl-team-list .dsl-team-person { gap: 14px; }
.dsl-team-ini {
	flex: 0 0 auto;
	width: 42px; height: 42px;
	border-radius: 50%;
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--teal-soft);
	display: flex; align-items: center; justify-content: center;
	margin: 0;
	font: 800 15px var(--wp--preset--font-family--display);
}
.dsl-team-name { margin: 0; font: 700 16px "Inter", sans-serif; color: var(--wp--preset--color--ink); }
.dsl-team-role { margin: 0; font: 500 13px "Inter", sans-serif; color: var(--wp--preset--color--ink-3); }

/* --- Info & Preise – Vorlage Z. 172–190 --- */
.dsl-kinfo { padding-block: 48px 10px; }
.dsl-kinfo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 18px; }
.dsl-kinfo-card { background: #fff; border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 16px; padding: 24px; box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05); }
.dsl-kinfo-card .dsl-kinfo-h { margin: 0 0 6px; font: 700 18px var(--wp--preset--font-family--display); color: var(--wp--preset--color--ink); }
.dsl-kinfo-card .dsl-kinfo-p { margin: 0 0 12px; font: 400 14px/1.55 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }
.dsl-kinfo-card .dsl-kinfo-price { margin: 0; font: 800 20px var(--wp--preset--font-family--display); color: var(--wp--preset--color--teal); }
.dsl-kinfo-card .dsl-kinfo-price span { font: 500 13px "Inter", sans-serif; color: var(--wp--preset--color--ink-3); }

/* --- Gut zu wissen (AGB-Kurzfassung) – Vorlage Z. 192–208 --- */
.dsl-kagb { padding-block: 40px 10px; }
.dsl-kagb-box { background: #fff; border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 20px; padding: 34px 36px; box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05); }
.dsl-kagb-box .dsl-kagb-title { margin: 0 0 6px; font: 700 22px var(--wp--preset--font-family--display); color: var(--wp--preset--color--ink); }
.dsl-kagb-box .dsl-kagb-lead { margin: 0 0 22px; font: 400 15px "Inter", sans-serif; color: var(--wp--preset--color--ink-3); }
.dsl-kagb-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr)); gap: 20px 36px; }
.dsl-kagb-item { position: relative; padding-left: 39px; }
.dsl-kagb-item::before {
	content: "";
	position: absolute; left: 0; top: 1px;
	width: 26px; height: 26px;
	border-radius: 50%;
	background-color: rgba(40, 190, 204, 0.14);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 14px;
}
.dsl-kagb-item .dsl-kagb-t { margin: 0 0 3px; font: 700 15px "Inter", sans-serif; color: var(--wp--preset--color--ink); }
.dsl-kagb-item .dsl-kagb-d { margin: 0; font: 400 14px/1.55 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }

/* =========================================================================
   STOFFE-SEITE – exakt nach Stoffe.dc.html
   ========================================================================= */

/* Eyebrow-Variante Terrakotta (Neu im Laden) */
.dsl-eyebrow--terra { border-color: var(--wp--preset--color--terracotta); color: var(--wp--preset--color--terracotta); background: rgba(197, 107, 74, 0.08); }

/* --- Hero (hell, 3-Bild-Grid) – Vorlage Z. 74–91 --- */
.dsl-shero { padding-block: 64px 36px; }
.dsl-shero-inner { display: flex; gap: 56px; align-items: center; flex-wrap: wrap; }
.dsl-shero-text { flex: 1 1 440px; min-width: min(320px, 100%); }
.dsl-shero-text .dsl-shero-title {
	margin: 20px 0 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(2.4rem, 5vw, 3.8rem);
	line-height: 1.04;
	letter-spacing: -0.03em;
	color: var(--wp--preset--color--ink);
}
.dsl-shero-text .dsl-shero-title em { color: var(--wp--preset--color--teal); font-style: italic; }
.dsl-shero-text .dsl-shero-lead { margin: 22px 0 0; max-width: 500px; font: 400 19px/1.6 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }
.dsl-shero-text .dsl-shero-actions { margin-top: 28px; }
.dsl-shero-cta, .dsl-shero-ghost { margin: 0; }
.dsl-shero-cta a, .dsl-shero-ghost a { display: inline-flex; align-items: center; gap: 9px; padding: 14px 22px; border-radius: 11px; font: 700 15px "Inter", sans-serif; text-decoration: none; }
.dsl-shero-cta a { background: var(--wp--preset--color--teal-deep); color: #fff; box-shadow: 0 10px 24px rgba(19, 153, 166, 0.28); }
.dsl-shero-ghost a { background: transparent; color: var(--wp--preset--color--ink); border: 1.5px solid var(--wp--preset--color--ink); }
.dsl-shero-art { flex: 1 1 380px; min-width: min(320px, 100%); display: grid; grid-template-columns: 1.3fr 1fr; gap: 14px; }
.dsl-shero-art .dsl-shero-img { margin: 0; }
.dsl-shero-art .dsl-shero-img img { width: 100%; height: 183px; object-fit: cover; border-radius: 18px; border: 1px solid var(--wp--preset--color--paper-deep); }
.dsl-shero-art .dsl-shero-img--main { grid-row: span 2; }
.dsl-shero-art .dsl-shero-img--main img { height: 380px; }

/* --- Stoffqualitäten (Chips) – Vorlage Z. 93–104 --- */
.dsl-squal { padding-block: 24px 20px; }
.dsl-squal-box { background: #fff; border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 20px; padding: 30px 32px; box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05); }
.dsl-squal-box .dsl-squal-title { margin: 0 0 4px; font: 700 20px var(--wp--preset--font-family--display); color: var(--wp--preset--color--ink); }
.dsl-squal-box .dsl-squal-lead { margin: 0 0 18px; font: 400 14px "Inter", sans-serif; color: var(--wp--preset--color--ink-3); }
.dsl-squal-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 9px; }
.dsl-squal-chips li { margin: 0; font: 600 14px "Inter", sans-serif; color: var(--wp--preset--color--ink); background: var(--wp--preset--color--paper-soft); border: 1px solid var(--wp--preset--color--paper-deep); padding: 8px 14px; border-radius: 999px; }

/* --- Neu im Laden (Masonry mit Caption-Badge) – Vorlage Z. 106–147 --- */
.dsl-sneu { padding-block: 44px 10px; }
.dsl-sneu .dsl-sneu-head { margin-bottom: 26px; }
.dsl-sneu-head-l .dsl-sneu-title { margin: 16px 0 0; font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: clamp(1.9rem, 3.4vw, 2.6rem); letter-spacing: -0.025em; color: var(--wp--preset--color--ink); }
.dsl-sneu-head .dsl-sneu-sub { margin: 0; max-width: 340px; font: 500 15px "Inter", sans-serif; color: var(--wp--preset--color--ink-3); }
.dsl-sneu-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 14px; }
.dsl-sneu-grid .dsl-sneu-item { position: relative; margin: 0; border-radius: 18px; overflow: hidden; border: 1px solid var(--wp--preset--color--paper-deep); box-shadow: 0 10px 28px rgba(35, 32, 28, 0.06); }
.dsl-sneu-grid .dsl-sneu-item img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dsl-sneu-grid .dsl-sneu-item--wide { grid-column: span 6; aspect-ratio: 3/2; }
.dsl-sneu-grid .dsl-sneu-item--sq { grid-column: span 4; aspect-ratio: 1/1; }
.dsl-sneu-grid .dsl-sneu-item figcaption { position: absolute; left: 12px; bottom: 12px; margin: 0; background: rgba(35, 32, 28, 0.78); color: #fff; font: 600 12px "Inter", sans-serif; padding: 6px 12px; border-radius: 999px; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }

/* --- Stoff-Welten (8 Kategorie-Karten) – Vorlage Z. 149–245 --- */
.dsl-skat { padding-block: 40px 20px; }
.dsl-skat .dsl-skat-head { margin-bottom: 28px; }
.dsl-skat-head .dsl-skat-title { margin: 16px 0 0; font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: clamp(1.9rem, 3.4vw, 2.6rem); letter-spacing: -0.025em; color: var(--wp--preset--color--ink); }
.dsl-skat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)); gap: 20px; }
.dsl-skat-card { background: #fff; border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 18px; overflow: hidden; box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05); }
.dsl-skat-collage { display: grid; grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; gap: 3px; height: 200px; overflow: hidden; }
.dsl-skat-collage .dsl-skat-img { margin: 0; height: 100%; }
.dsl-skat-collage .dsl-skat-img img { width: 100%; height: 100%; object-fit: cover; }
.dsl-skat-collage .dsl-skat-img--main { grid-row: span 2; }
.dsl-skat-body { padding: 18px 20px; }
.dsl-skat-body .dsl-skat-name { margin: 0 0 4px; font: 700 19px var(--wp--preset--font-family--display); color: var(--wp--preset--color--ink); }
.dsl-skat-body .dsl-skat-sub { margin: 0; font: 400 14px/1.5 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }

/* --- Mercerie (karierter Abschnitt, 4 Karten) – Vorlage Z. 247–286 --- */
.dsl-smerc {
	padding-block: 80px;
	background-color: var(--wp--preset--color--paper-soft);
	background-image:
		repeating-linear-gradient(45deg, rgba(40, 190, 204, 0.09) 0 16px, transparent 16px 32px),
		repeating-linear-gradient(-45deg, rgba(40, 190, 204, 0.09) 0 16px, transparent 16px 32px);
}
.dsl-smerc .dsl-smerc-head { max-width: 640px; margin: 0 auto 34px; text-align: center; }
.dsl-smerc-head .dsl-eyebrow { margin-inline: auto; }
.dsl-smerc-head .dsl-smerc-title { margin: 16px 0 0; font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: clamp(1.9rem, 3.4vw, 2.6rem); letter-spacing: -0.025em; color: var(--wp--preset--color--ink); }
.dsl-smerc-head .dsl-smerc-lead { margin: 14px 0 0; font: 400 17px/1.6 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }
.dsl-smerc-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr)); gap: 18px; }
.dsl-smerc-card { background: #fff; border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 18px; overflow: hidden; box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05); }
.dsl-smerc-card .dsl-smerc-img { margin: 0; }
.dsl-smerc-card .dsl-smerc-img img { display: block; width: 100%; height: 180px; object-fit: cover; }
.dsl-smerc-body { padding: 18px 20px; }
.dsl-smerc-body .dsl-smerc-name { margin: 0 0 4px; font: 700 18px var(--wp--preset--font-family--display); color: var(--wp--preset--color--ink); }
.dsl-smerc-body .dsl-smerc-sub { margin: 0; font: 400 14px/1.5 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }

/* --- Nähmaschinen & Restenstoffe – Vorlage Z. 288–303 --- */
.dsl-swerk { padding-block: 64px 20px; }
.dsl-swerk-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.dsl-swerk-card { background: #fff; border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 20px; padding: 34px 36px; box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05); }
.dsl-swerk-card .dsl-swerk-icon { width: 52px; height: 52px; margin-bottom: 16px; border-radius: 14px; background: rgba(40, 190, 204, 0.12); display: flex; align-items: center; justify-content: center; }
.dsl-swerk-card .dsl-swerk-icon::before {
	content: ""; width: 26px; height: 26px;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='11' rx='2'/%3E%3Cpath d='M7 8V6a3 3 0 0 1 6 0v2M12 12v3'/%3E%3C/svg%3E");
}
.dsl-swerk-card .dsl-swerk-name { margin: 0 0 8px; font: 700 22px var(--wp--preset--font-family--display); color: var(--wp--preset--color--ink); }
.dsl-swerk-card .dsl-swerk-text { margin: 0; font: 400 16px/1.65 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }
.dsl-swerk-card .dsl-swerk-text strong { color: var(--wp--preset--color--ink); }
.dsl-swerk-card--terra { background: var(--wp--preset--color--terracotta); border: none; box-shadow: 0 14px 34px rgba(197, 107, 74, 0.22); display: flex; flex-direction: column; justify-content: center; }
.dsl-swerk-card--terra .dsl-swerk-name { color: #fff; font-size: 26px; }
.dsl-swerk-card--terra .dsl-swerk-text { color: rgba(255, 255, 255, 0.92); }
.dsl-swerk-card--terra .dsl-swerk-text strong { color: #fff; }

/* --- CTA (dunkle Box) – Vorlage Z. 305–314 --- */
.dsl-scta { padding-block: 50px 84px; }
.dsl-scta-box { background: var(--wp--preset--color--ink); border-radius: 24px; padding: 48px 44px; gap: 28px; }
.dsl-scta-text .dsl-scta-title { margin: 0 0 10px; font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: clamp(1.8rem, 3.2vw, 2.5rem); letter-spacing: -0.02em; color: #fff; }
.dsl-scta-text .dsl-scta-lead { margin: 0; font: 400 17px "Inter", sans-serif; color: rgba(255, 255, 255, 0.78); }
.dsl-scta-btnwrap { margin: 0; }
.dsl-scta-btn { display: inline-flex; align-items: center; gap: 9px; background: var(--wp--preset--color--teal-soft); color: var(--wp--preset--color--teal-ink); padding: 15px 26px; border-radius: 12px; font: 700 16px "Inter", sans-serif; text-decoration: none; white-space: nowrap; }
@media (max-width: 420px) {
	/* Schmale Geräte: Box-Padding reduzieren, Button darf umbrechen —
	   sonst drückt der nowrap-Button die Seite in den H-Scroll. */
	.dsl-scta-box { padding: 36px 24px; }
	.dsl-scta-btn { white-space: normal; text-align: center; }
}

/* =========================================================================
   KURSE – Termine / Programm (CPT) – Vorlage Z. 91–141
   ========================================================================= */
.dsl-kterm { padding-block: 80px 16px; }
.dsl-kterm .dsl-kterm-head { gap: 24px; }
.dsl-kterm-head-l .dsl-kterm-title { margin: 16px 0 6px; font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: clamp(2rem, 3.6vw, 2.8rem); letter-spacing: -0.025em; color: var(--wp--preset--color--ink); }
.dsl-kterm-head-l .dsl-kterm-lead { margin: 0; max-width: 560px; font: 400 18px "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }
.dsl-kterm-cta { margin: 0; flex: 0 0 auto; }
.dsl-kterm-cta a { display: inline-flex; align-items: center; gap: 9px; background: var(--wp--preset--color--teal-deep); color: #fff; padding: 14px 22px; border-radius: 11px; font: 700 15px "Inter", sans-serif; text-decoration: none; box-shadow: 0 10px 22px rgba(19, 153, 166, 0.25); }
/* Info-Chips */
.dsl-kterm .dsl-kterm-chips { gap: 10px; margin: 22px 0 28px; }
.dsl-kterm-chip { margin: 0; display: inline-flex; align-items: center; gap: 9px; font: 600 13px "Inter", sans-serif; color: var(--wp--preset--color--ink); background: var(--wp--preset--color--paper-soft); border: 1px solid var(--wp--preset--color--paper-deep); padding: 9px 15px; border-radius: 999px; }
.dsl-kterm-chip::before { content: ""; flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%; background: var(--wp--preset--color--teal); }
.dsl-kterm-chip--terra::before { background: var(--wp--preset--color--terracotta); }

/* Termin-Grid (Server-Block – plain HTML, alle Flex/Gaps hier) */
.dsl-kt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(348px, 100%), 1fr)); gap: 18px; }
.dsl-kt-grid > * { min-width: 0; }
.dsl-kt-rhythm { hyphens: auto; overflow-wrap: break-word; }
.dsl-kt-card { background: #fff; border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 18px; padding: 22px 22px 18px; box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05); display: flex; flex-direction: column; gap: 15px; }
.dsl-kt-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.dsl-kt-id { display: flex; align-items: center; gap: 13px; min-width: 0; flex: 1 1 auto; }
.dsl-kt-rt { min-width: 0; }
.dsl-kt-nr { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 13px; background: var(--wp--preset--color--ink); color: var(--wp--preset--color--teal-soft); display: flex; align-items: center; justify-content: center; font: 800 18px var(--wp--preset--font-family--display); }
.dsl-kt-rhythm { display: block; font: 700 18px var(--wp--preset--font-family--display); color: var(--wp--preset--color--ink); line-height: 1.12; }
.dsl-kt-time { display: inline-flex; align-items: center; gap: 6px; margin-top: 3px; font: 500 13px "Inter", sans-serif; color: var(--wp--preset--color--ink-3); }
.dsl-kt-time::before { content: ""; width: 14px; height: 14px; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%239B8E7E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); }
.dsl-kt-price { flex: 0 0 auto; font: 800 19px var(--wp--preset--font-family--display); color: var(--wp--preset--color--teal); }
.dsl-kt-dates { display: flex; flex-wrap: wrap; gap: 7px; }
.dsl-kt-cap { display: flex; align-items: center; gap: 10px; margin-top: auto; padding-bottom: 2px; }
.dsl-kt-cap-bar { flex: 1; height: 6px; background: #F0E7D8; border-radius: 999px; overflow: hidden; }
.dsl-kt-cap-fill { display: block; height: 100%; background: var(--wp--preset--color--teal); border-radius: 999px; }
.dsl-kt-cap-text { flex: 0 0 auto; font: 500 13px "Inter", sans-serif; color: var(--wp--preset--color--ink-2); white-space: nowrap; }
.dsl-kt-cap-text strong { color: var(--wp--preset--color--ink); font-weight: 700; }
.dsl-kt-cap--full .dsl-kt-cap-text { color: var(--wp--preset--color--terracotta); font-weight: 700; }
.dsl-kt-cap--knapp .dsl-kt-cap-text, .dsl-kt-cap--knapp .dsl-kt-cap-text strong { color: var(--wp--preset--color--alert); }
.dsl-kt-cap--knapp .dsl-kt-cap-fill { background: var(--wp--preset--color--alert); }
.dsl-kt-date { font: 600 13px "Inter", sans-serif; color: var(--wp--preset--color--ink); background: rgba(40, 190, 204, 0.10); border: 1px solid rgba(40, 190, 204, 0.22); padding: 6px 11px; border-radius: 9px; }
.dsl-kt-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid #F0E7D8; padding-top: 14px; margin-top: 0; }
.dsl-kt-leitung { display: inline-flex; align-items: center; gap: 8px; font: 500 14px "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }
.dsl-kt-leitung::before { content: ""; flex: 0 0 auto; width: 16px; height: 16px; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239B8E7E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E"); }
.dsl-kt-link { font: 700 14px "Inter", sans-serif; color: var(--wp--preset--color--teal-deep); text-decoration: none; white-space: nowrap; }

/* Kurse-Block (App-Katalog) – rendert die Vorlage-Karte (.dsl-kt-*) aus dem Katalog-JSON */
.dsl-kurse-empty-note { margin: 0; font: 400 17px "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }

/* =========================================================================
   AGB-SEITE – exakt nach AGB.dc.html
   ========================================================================= */
/* Eyebrow mit Dokument-Icon */
.dsl-eyebrow--doc::before {
	content: ""; width: 15px; height: 15px; flex: 0 0 auto;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%230E7C87' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 2v6h6M9 13h6M9 17h6'/%3E%3C/svg%3E");
}

/* --- Hero (zentriert) – Vorlage Z. 84–98 --- */
.dsl-agb-hero { padding-block: 60px 10px; text-align: center; }
.dsl-agb-hero .dsl-eyebrow { margin-inline: auto; }
.dsl-agb-hero .dsl-agb-title { margin: 20px 0 0; font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: clamp(2.4rem, 5vw, 3.9rem); line-height: 1.04; letter-spacing: -0.03em; color: var(--wp--preset--color--ink); }
.dsl-agb-hero .dsl-agb-title em { color: var(--wp--preset--color--teal); font-style: italic; }
.dsl-agb-hero .dsl-agb-lead { margin: 18px auto 0; max-width: 560px; font: 400 19px/1.6 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }
.dsl-agb-hero .dsl-agb-badge {
	margin: 22px auto 0; width: fit-content; display: inline-flex; align-items: center; gap: 9px;
	font: 600 13px "Inter", sans-serif; color: var(--wp--preset--color--ink);
	background: #fff; border: 1px solid var(--wp--preset--color--paper-deep); padding: 9px 16px; border-radius: 999px;
}
.dsl-agb-hero .dsl-agb-badge::before {
	content: ""; width: 15px; height: 15px; flex: 0 0 auto;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E");
}

/* --- Body: TOC + Klauseln – Vorlage Z. 100–228 --- */
.dsl-agb-body { padding-block: 46px 84px; }
.dsl-agb-grid { display: grid; grid-template-columns: 230px 1fr; gap: 48px; align-items: start; max-width: 1100px; margin-inline: auto; }
/* Grid-Kinder dürfen nicht über ihre Spalte wachsen (sonst ragen Karten aus der Mitte) */
.dsl-agb-grid > * { min-width: 0; }
.dsl-ds-addr a, .dsl-agb-contact a { overflow-wrap: break-word; }

/* TOC (sticky) */
.dsl-agb-toc { position: sticky; top: 96px; }
.dsl-agb-toc .dsl-agb-toc-label { margin: 0 0 14px; padding-left: 2px; font: 700 11px "Inter", sans-serif; letter-spacing: 0.16em; text-transform: uppercase; color: var(--wp--preset--color--ink-3); }
.dsl-agb-toc-list { counter-reset: toc; list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.dsl-agb-toc-list li { counter-increment: toc; margin: 0; }
.dsl-agb-toc-list li a { display: flex; gap: 11px; align-items: baseline; font: 600 14px/1.4 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); padding: 9px 8px; border-radius: 9px; border: 1px solid transparent; text-decoration: none; transition: color .15s ease, border-color .15s ease; }
.dsl-agb-toc-list li a::before { content: counter(toc); flex: 0 0 auto; width: 16px; font: 800 13px var(--wp--preset--font-family--display); color: var(--wp--preset--color--teal); }
.dsl-agb-toc-list li a:hover { color: var(--wp--preset--color--teal-deep); border-color: var(--wp--preset--color--teal-soft); }

/* Klauseln */
.dsl-agb-clauses { counter-reset: clause; display: flex; flex-direction: column; gap: 18px; }
.dsl-agb-clause { counter-increment: clause; scroll-margin-top: 96px; background: #fff; border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 18px; padding: 30px 32px; box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05); display: flex; gap: 22px; }
.dsl-agb-clause::before { content: counter(clause); flex: 0 0 auto; width: 46px; height: 46px; border-radius: 13px; background: rgba(40, 190, 204, 0.12); display: flex; align-items: center; justify-content: center; font: 800 20px var(--wp--preset--font-family--display); color: var(--wp--preset--color--teal); }
.dsl-agb-clause-body { flex: 1; min-width: 0; }
.dsl-agb-clause-body .dsl-agb-h { margin: 0 0 8px; font: 700 21px var(--wp--preset--font-family--display); color: var(--wp--preset--color--ink); }
.dsl-agb-clause-body .dsl-agb-p { margin: 0 0 12px; font: 400 16px/1.65 "Inter", sans-serif; color: var(--wp--preset--color--ink-body); }
.dsl-agb-clause-body .dsl-agb-p strong { color: var(--wp--preset--color--ink); }
.dsl-agb-clause-body .dsl-agb-note { margin: 0; font: 400 15px/1.6 "Inter", sans-serif; font-style: italic; color: var(--wp--preset--color--ink-3); }
.dsl-agb-clause-body > *:last-child { margin-bottom: 0; }

/* Gebühren-Grid (§2) */
.dsl-agb-clause-body .dsl-agb-fees { margin: 20px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.dsl-agb-fee { background: var(--wp--preset--color--paper); border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 14px; padding: 18px; }
.dsl-agb-fee .dsl-agb-fee-pct { margin: 0; font: 800 30px var(--wp--preset--font-family--display); line-height: 1; color: var(--wp--preset--color--teal); }
.dsl-agb-fee .dsl-agb-fee-t { margin: 8px 0 3px; font: 700 13px "Inter", sans-serif; color: var(--wp--preset--color--ink); }
.dsl-agb-fee .dsl-agb-fee-d { margin: 0; font: 400 13px/1.45 "Inter", sans-serif; color: var(--wp--preset--color--ink-3); }
.dsl-agb-fee--warn { border-color: #EBD6CB; }
.dsl-agb-fee--warn .dsl-agb-fee-pct { color: var(--wp--preset--color--terracotta); }
.dsl-agb-fee--dark { background: var(--wp--preset--color--ink); border-color: var(--wp--preset--color--ink); }
.dsl-agb-fee--dark .dsl-agb-fee-pct { color: #E58A66; }
.dsl-agb-fee--dark .dsl-agb-fee-t { color: #fff; }
.dsl-agb-fee--dark .dsl-agb-fee-d { color: rgba(255, 255, 255, 0.6); }

/* Ersatzperson-Zeile (§2) */
.dsl-agb-clause-body .dsl-agb-ersatz { margin: 18px 0 0; display: flex; align-items: center; gap: 9px; font: 500 15px/1.6 "Inter", sans-serif; color: var(--wp--preset--color--ink-body); }
.dsl-agb-ersatz::before {
	content: ""; flex: 0 0 auto; width: 17px; height: 17px;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
}

/* Nähmaschinen-Miete (§5) – Text + Preis nebeneinander */
.dsl-agb-clause-body--row { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.dsl-agb-miete-text .dsl-agb-h { margin: 0 0 8px; }
.dsl-agb-miete-price { text-align: right; }
.dsl-agb-miete-price .dsl-agb-miete-amount { margin: 0; font: 800 26px var(--wp--preset--font-family--display); line-height: 1; color: var(--wp--preset--color--teal); }
.dsl-agb-miete-price .dsl-agb-miete-sub { margin: 4px 0 0; font: 500 14px "Inter", sans-serif; color: var(--wp--preset--color--ink-3); }

/* Akzeptanz-Box (gap höher scopen – blockGap:0 des Flex-Groups würde ihn sonst nullen) */
.dsl-agb-clauses .dsl-agb-accept { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; background: var(--wp--preset--color--ink); border-radius: 18px; padding: 28px 32px; box-shadow: 0 14px 34px rgba(35, 32, 28, 0.18); }
.dsl-agb-accept::before {
	content: ""; flex: 0 0 auto; width: 50px; height: 50px; border-radius: 14px;
	background: rgba(40, 190, 204, 0.18) no-repeat center;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%2328BECC' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
	background-size: 26px; background-position: center;
}
.dsl-agb-accept .dsl-agb-accept-text { flex: 1; min-width: 240px; margin: 0; font: 500 17px/1.55 "Inter", sans-serif; color: rgba(255, 255, 255, 0.92); }
.dsl-agb-accept .dsl-agb-accept-btnwrap { flex: 0 0 auto; margin: 0; }
.dsl-agb-accept-btn { display: inline-flex; align-items: center; gap: 8px; background: var(--wp--preset--color--teal-soft); color: var(--wp--preset--color--teal-ink); padding: 13px 20px; border-radius: 11px; font: 700 15px "Inter", sans-serif; text-decoration: none; }

/* Kontakt-Hinweis */
.dsl-agb-clauses .dsl-agb-contact { margin: 6px 4px 0; font: 400 13px "Inter", sans-serif; color: var(--wp--preset--color--ink-3); }
.dsl-agb-contact a { color: var(--wp--preset--color--teal-deep); font-weight: 600; text-decoration: none; }
@media (max-width: 900px) {
	.dsl-agb-grid { grid-template-columns: 1fr; gap: 28px; }
	.dsl-agb-toc { position: static; top: auto; }
}
@media (max-width: 560px) {
	.dsl-agb-clause-body .dsl-agb-fees { grid-template-columns: 1fr; }
	.dsl-agb-clause { padding: 24px; gap: 16px; }
}

/* =========================================================================
   DATENSCHUTZ-SEITE – nutzt .dsl-agb-Stile, ergänzt DS-Spezifika (Vorlage AGB/Datenschutz.dc.html)
   ========================================================================= */
/* Eyebrow mit Schloss-Icon */
.dsl-eyebrow--lock::before {
	content: ""; width: 15px; height: 15px; flex: 0 0 auto;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%230E7C87' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E");
}

/* Entwurf-Hinweis */
.dsl-ds-noticewrap { padding-block: 30px 0; }
.dsl-ds-draft {
	max-width: 1100px; margin-inline: auto; display: flex; gap: 13px; align-items: flex-start;
	background: rgba(197, 107, 74, 0.08); border: 1.5px dashed #D69A6A; border-radius: 14px;
	padding: 16px 20px; font: 500 14px/1.55 "Inter", sans-serif; color: #7A5238;
}
.dsl-ds-draft::before {
	content: ""; flex: 0 0 auto; width: 20px; height: 20px; margin-top: 1px;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23C56B4A' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 9v4M12 17h.01M10.3 3.9L1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/%3E%3C/svg%3E");
}
.dsl-ds-draft strong { color: var(--wp--preset--color--terracotta); }

/* §1 Adress-Box */
.dsl-agb-clause-body .dsl-ds-addr { margin: 0; background: var(--wp--preset--color--paper); border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 13px; padding: 18px 20px; font: 500 15px/1.7 "Inter", sans-serif; color: var(--wp--preset--color--ink); }
.dsl-ds-addr a { color: var(--wp--preset--color--teal-deep); font-weight: 600; text-decoration: none; }

/* §2 Daten-Karten */
.dsl-agb-clause-body .dsl-ds-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 12px; }
.dsl-ds-card { background: var(--wp--preset--color--paper); border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 13px; padding: 16px 18px; }
.dsl-ds-card .dsl-ds-card-t { margin: 0 0 5px; font: 700 14px "Inter", sans-serif; color: var(--wp--preset--color--ink); }
.dsl-ds-card .dsl-ds-card-d { margin: 0; font: 400 14px/1.5 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }

/* §3 Zweck-Liste (Häkchen) */
.dsl-agb-clause-body .dsl-ds-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.dsl-ds-list li { margin: 0; display: flex; gap: 10px; align-items: flex-start; font: 400 15px/1.55 "Inter", sans-serif; color: var(--wp--preset--color--ink-body); }
.dsl-ds-list li::before {
	content: ""; flex: 0 0 auto; width: 17px; height: 17px; margin-top: 2px;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
}

/* §8 Rechte-Chips */
.dsl-agb-clause-body .dsl-ds-rights { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)); gap: 10px; }
.dsl-ds-right { margin: 0; display: flex; align-items: center; gap: 9px; background: var(--wp--preset--color--paper); border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 11px; padding: 13px 15px; font: 600 14px "Inter", sans-serif; color: var(--wp--preset--color--ink); }
.dsl-ds-right::before { content: ""; flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%; background: var(--wp--preset--color--teal-soft); }
.dsl-agb-clause-body .dsl-ds-rights-note { margin: 14px 0 0; font: 400 15px/1.6 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }

/* §9 Kontakt-CTA (dunkle Box mit Mail-Icon) */
.dsl-agb-clauses .dsl-ds-cta { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; scroll-margin-top: 96px; background: var(--wp--preset--color--ink); border-radius: 18px; padding: 28px 32px; box-shadow: 0 14px 34px rgba(35, 32, 28, 0.18); }
.dsl-ds-cta::before {
	content: ""; flex: 0 0 auto; width: 50px; height: 50px; border-radius: 14px;
	background: rgba(40, 190, 204, 0.18) no-repeat center;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2328BECC' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='M22 6l-10 7L2 6'/%3E%3C/svg%3E");
	background-size: 24px; background-position: center;
}
.dsl-ds-cta-text { flex: 1; min-width: 240px; }
.dsl-ds-cta-text .dsl-ds-cta-title { margin: 0 0 4px; font: 700 19px var(--wp--preset--font-family--display); color: #fff; }
.dsl-ds-cta-text .dsl-ds-cta-lead { margin: 0; font: 500 15px/1.55 "Inter", sans-serif; color: rgba(255, 255, 255, 0.75); }
.dsl-ds-cta-btnwrap { flex: 0 0 auto; margin: 0; }
.dsl-ds-cta-btn { display: inline-flex; align-items: center; gap: 8px; background: var(--wp--preset--color--teal-soft); color: var(--wp--preset--color--teal-ink); padding: 13px 20px; border-radius: 11px; font: 700 15px "Inter", sans-serif; text-decoration: none; }

/* =========================================================================
   IMPRESSUM-SEITE – exakt nach Impressum.dc.html (Hero = .dsl-agb-hero)
   ========================================================================= */
/* Eyebrow mit Info-Icon */
.dsl-eyebrow--info::before {
	content: ""; width: 15px; height: 15px; flex: 0 0 auto;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%230E7C87' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4M12 8h.01'/%3E%3C/svg%3E");
}

.dsl-imp { padding-block: 42px 84px; }
.dsl-imp-stack { max-width: 1000px; margin-inline: auto; }
.dsl-imp-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 18px; }
.dsl-imp-card { background: #fff; border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 18px; padding: 32px; box-shadow: 0 10px 28px rgba(35, 32, 28, 0.05); }

/* Karten-Label mit Icon-Box */
.dsl-imp-card .dsl-imp-label { display: flex; align-items: center; gap: 13px; margin: 0 0 18px; font: 700 13px "Inter", sans-serif; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--ink-3); }
.dsl-imp-label::before { content: ""; flex: 0 0 auto; width: 44px; height: 44px; border-radius: 12px; background-color: rgba(40, 190, 204, 0.12); background-repeat: no-repeat; background-position: center; background-size: 22px; }
.dsl-imp-label--building::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18M5 21V7l8-4v18M19 21V11l-6-3'/%3E%3C/svg%3E"); }
.dsl-imp-label--phone::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.9.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E"); }

.dsl-imp-card .dsl-imp-name { margin: 0 0 6px; font: 700 26px var(--wp--preset--font-family--display); letter-spacing: -0.01em; color: var(--wp--preset--color--ink); }
.dsl-imp-card .dsl-imp-addr { margin: 0; font: 400 16px/1.7 "Inter", sans-serif; color: var(--wp--preset--color--ink-body); }
.dsl-imp-card .dsl-imp-divider { margin: 20px 0; border: none; height: 1px; background: #EFE6D6; }
.dsl-imp-card .dsl-imp-note { margin: 0; font: 400 14px/1.6 "Inter", sans-serif; color: var(--wp--preset--color--ink-3); }

/* Kontakt-Items */
.dsl-imp-card .dsl-imp-contact { display: flex; flex-direction: column; gap: 14px; }
.dsl-imp-ci { display: grid; grid-template-columns: 38px 1fr; gap: 0 13px; align-items: center; margin: 0; }
.dsl-imp-ci::before { content: ""; grid-column: 1; grid-row: 1 / 3; width: 38px; height: 38px; border-radius: 10px; background-color: var(--wp--preset--color--paper); border: 1px solid var(--wp--preset--color--paper-deep); background-repeat: no-repeat; background-position: center; background-size: 17px; }
.dsl-imp-ci--phone::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.9.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E"); }
.dsl-imp-ci--mail::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='M22 6l-10 7L2 6'/%3E%3C/svg%3E"); }
.dsl-imp-ci--pin::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E"); }
.dsl-imp-ci .dsl-imp-ci-l { grid-column: 2; grid-row: 1; font: 400 12px "Inter", sans-serif; color: var(--wp--preset--color--ink-3); }
.dsl-imp-ci .dsl-imp-ci-v { grid-column: 2; grid-row: 2; font: 600 16px "Inter", sans-serif; color: var(--wp--preset--color--ink); text-decoration: none; word-break: break-word; }

/* Versand & Lieferung */
.dsl-imp-card--ship .dsl-imp-shiptitle { display: flex; align-items: center; gap: 13px; margin: 0 0 8px; font: 700 21px var(--wp--preset--font-family--display); color: var(--wp--preset--color--ink); }
.dsl-imp-card--ship .dsl-imp-shiptitle::before {
	content: ""; flex: 0 0 auto; width: 44px; height: 44px; border-radius: 12px; background-color: rgba(40, 190, 204, 0.12);
	background: rgba(40,190,204,.12) no-repeat center; background-size: 22px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 3h5v5M21 3l-7 7M10 21H3v-7M3 21l7-7'/%3E%3Crect x='3' y='3' width='7' height='7' rx='1'/%3E%3C/svg%3E");
}
.dsl-imp-card--ship .dsl-imp-shiplead { margin: 0 0 20px; font: 400 16px/1.65 "Inter", sans-serif; color: var(--wp--preset--color--ink-body); }
.dsl-imp-tarif { background: var(--wp--preset--color--paper); border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 14px; padding: 18px 22px; }
.dsl-imp-tarif .dsl-imp-tarif-land { margin: 0; display: flex; align-items: center; gap: 14px; }
.dsl-imp-flag { font-size: 26px; line-height: 1; }
.dsl-imp-tarif-txt { display: flex; flex-direction: column; }
.dsl-imp-tarif-txt strong { font: 700 16px "Inter", sans-serif; color: var(--wp--preset--color--ink); }
.dsl-imp-tarif-txt span { font: 400 14px "Inter", sans-serif; color: var(--wp--preset--color--ink-3); }
.dsl-imp-tarif .dsl-imp-tarif-preis { margin: 0; font: 800 22px var(--wp--preset--font-family--display); color: var(--wp--preset--color--teal); }
.dsl-imp-card--ship .dsl-imp-foreign { margin: 14px 0 0; display: flex; gap: 13px; align-items: flex-start; background: rgba(197, 107, 74, 0.07); border: 1.5px dashed #D69A6A; border-radius: 14px; padding: 16px 20px; font: 500 14px/1.6 "Inter", sans-serif; color: #7A5238; }
.dsl-imp-foreign::before { content: ""; flex: 0 0 auto; width: 20px; height: 20px; margin-top: 1px; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23C56B4A' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4M12 8h.01'/%3E%3C/svg%3E"); }
.dsl-imp-foreign strong { color: var(--wp--preset--color--terracotta); }

/* Credits */
.dsl-imp-credits { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding: 28px 32px; }
.dsl-imp-credits-text .dsl-imp-credits-label { margin: 0 0 6px; font: 700 13px "Inter", sans-serif; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--ink-3); }
.dsl-imp-credits-text .dsl-imp-credits-p { margin: 0; font: 400 15px/1.55 "Inter", sans-serif; color: var(--wp--preset--color--ink-body); }
.dsl-imp-credits-p a { color: var(--wp--preset--color--teal-deep); font-weight: 600; text-decoration: none; }
.dsl-imp-credits-btnwrap { margin: 0; flex: 0 0 auto; line-height: 0; }
.dsl-imp-credits-btn { display: inline-flex; align-items: center; gap: 8px; background: var(--wp--preset--color--teal-deep); color: #fff; padding: 12px 18px; border-radius: 11px; font: 700 14px "Inter", sans-serif; text-decoration: none; box-shadow: 0 8px 18px rgba(19, 153, 166, 0.22); }

/* Legal-Buttons */
.dsl-imp-stack .dsl-imp-legal { display: flex; flex-wrap: wrap; gap: 12px; }
.dsl-imp-legal-btn { margin: 0; }
.dsl-imp-legal-btn a { display: inline-flex; align-items: center; gap: 8px; background: #fff; border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 11px; padding: 12px 18px; font: 600 14px "Inter", sans-serif; color: var(--wp--preset--color--ink); text-decoration: none; }
.dsl-imp-legal-btn a::before { content: ""; width: 16px; height: 16px; background-repeat: no-repeat; background-position: center; background-size: contain; }
.dsl-imp-legal-btn--lock a::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E"); }
.dsl-imp-legal-btn--doc a::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 2v6h6'/%3E%3C/svg%3E"); }
@media (max-width: 760px) { .dsl-imp-grid { grid-template-columns: 1fr; } }

/* =========================================================================
   MOBILE-FEINSCHLIFF
   ========================================================================= */
/* Lange Wörter in grossen Titeln dürfen umbrechen (Soft-Hyphens + Fallback) */
.dsl-agb-hero .dsl-agb-title,
.dsl-shero-text .dsl-shero-title,
.dsl-khero-text .dsl-khero-title { overflow-wrap: break-word; hyphens: auto; }
/* Stoffe: Nähmaschinen+Restenstoffe (fix 2-spaltig) mobil untereinander */
@media (max-width: 600px) {
	.dsl-swerk-grid { grid-template-columns: 1fr; }
	/* Termin-Grid: minmax(348px) ist auf schmalen Screens breiter als der Platz → einspaltig */
	.dsl-kt-grid { grid-template-columns: 1fr; }
	/* Kurse-Rubriken mobil kompakter (drei Rubriken untereinander → weniger Leerraum) */
	.dsl-kterm { padding-block: 44px 8px; }
	.dsl-kterm .dsl-kterm-head { gap: 14px; }
	.dsl-kterm-head-l .dsl-kterm-lead { font-size: 16px; }
	.dsl-kterm .dsl-kterm-chips { margin: 16px 0 20px; }
	/* Karten-Fuss: Leitung + Link einzeilig halten (langer Name «Evelina Nördershäuser») */
	.dsl-kt-leitung, .dsl-kt-link { font-size: 13px; }
}

/* =========================================================================
   404-SEITE – exakt nach 404.dc.html
   ========================================================================= */
@keyframes dsl-404-dash { to { stroke-dashoffset: -40; } }
@keyframes dsl-404-floaty { 0%, 100% { transform: translateY(0) rotate(-6deg); } 50% { transform: translateY(-7px) rotate(-6deg); } }

.dsl-404 { min-height: 72vh; display: flex; align-items: center; padding: 80px 24px; }
.dsl-404-inner { max-width: 760px; margin: 0 auto; width: 100%; text-align: center; }

.dsl-404-eyebrow { display: inline-flex; align-items: center; gap: 9px; margin: 0; padding: 8px 15px; border: 1.5px dashed var(--wp--preset--color--teal); border-radius: 999px; font: 600 12px "Inter", sans-serif; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--teal-deep); background: rgba(40, 190, 204, 0.08); }
.dsl-404-eyebrow::before { content: ""; flex: 0 0 auto; width: 15px; height: 15px; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%230E7C87' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4M12 8h.01'/%3E%3C/svg%3E"); }

/* Grosse «404»-Illustration (Deko) – äusserer Block-Wrapper erzwingt eigene Zeile (Pill darüber) */
.dsl-404-inner .dsl-404-art-wrap { margin-top: 34px; text-align: center; }
.dsl-404-art { position: relative; display: inline-block; }
.dsl-404-art-num { font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: clamp(6rem, 20vw, 11rem); line-height: 0.9; letter-spacing: -0.04em; color: var(--wp--preset--color--ink); }
.dsl-404-art-zero { color: var(--wp--preset--color--teal); font-style: italic; }
.dsl-404-art-seam { position: absolute; left: -6%; bottom: -6px; width: 112%; height: 46px; overflow: visible; }
.dsl-404-art-seam path { animation: dsl-404-dash 2.4s linear infinite; }
.dsl-404-art-badge { position: absolute; right: -30px; bottom: -2px; width: 74px; height: 74px; border-radius: 50%; background: var(--wp--preset--color--terracotta); color: #fff; display: flex; align-items: center; justify-content: center; text-align: center; box-shadow: 0 12px 26px rgba(197, 107, 74, 0.4); animation: dsl-404-floaty 5s ease-in-out infinite; font: 800 15px var(--wp--preset--font-family--display); }

.dsl-404-inner .dsl-404-title { margin-top: 30px; font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: clamp(1.7rem, 3.6vw, 2.6rem); line-height: 1.08; letter-spacing: -0.025em; color: var(--wp--preset--color--ink); }
.dsl-404-inner .dsl-404-lead { margin: 16px auto 0; max-width: 480px; font: 400 18px/1.65 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }

/* Aktionen */
.dsl-404-inner .dsl-404-actions { margin-top: 32px; gap: 14px; flex-wrap: wrap; justify-content: center; }
.dsl-404-btn a.wp-block-button__link { display: inline-flex; align-items: center; gap: 9px; padding: 15px 24px; border-radius: 11px; font: 700 16px "Inter", sans-serif; }
.dsl-404-btn--home a.wp-block-button__link { background: var(--wp--preset--color--teal-deep); color: #fff; border: none; box-shadow: 0 10px 24px rgba(19, 153, 166, 0.28); }
.dsl-404-btn--home a.wp-block-button__link::before { content: ""; width: 18px; height: 18px; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-8 9 8M5 10v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V10'/%3E%3C/svg%3E"); }
.dsl-404-btn--help a.wp-block-button__link { background: transparent; color: var(--wp--preset--color--ink); border: 1.5px solid var(--wp--preset--color--ink); }

/* Quick-Links */
.dsl-404-inner .dsl-404-quick { margin-top: 46px; }
.dsl-404-quick .dsl-404-quick-label { margin: 0 0 16px; font: 700 12px "Inter", sans-serif; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--ink-3); }
.dsl-404-quick-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr)); gap: 12px; max-width: 620px; margin: 0 auto; text-align: left; }
.dsl-404-quick-grid > * { min-width: 0; }
.dsl-404-card { position: relative; gap: 13px; background: #fff; border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 14px; padding: 15px 17px; box-shadow: 0 8px 22px rgba(35, 32, 28, 0.04); transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease; }
.dsl-404-card:hover { transform: translateY(-3px); box-shadow: 0 16px 32px rgba(19, 153, 166, 0.14); border-color: var(--wp--preset--color--teal-soft); }
.dsl-404-card::before { content: ""; flex: 0 0 auto; width: 40px; height: 40px; border-radius: 11px; background-color: rgba(40, 190, 204, 0.12); background-repeat: no-repeat; background-position: center; background-size: 20px 20px; }
.dsl-404-card--stoffe::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7h18M3 12h18M3 17h12'/%3E%3C/svg%3E"); }
.dsl-404-card--kurse::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2v20M2 12h20'/%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3C/svg%3E"); }
.dsl-404-card--galerie::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Ccircle cx='8.5' cy='8.5' r='1.5'/%3E%3Cpath d='M21 15l-5-5L5 21'/%3E%3C/svg%3E"); }
.dsl-404-card--kontakt::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%231399A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E"); }
.dsl-404-card-text { gap: 2px; }
.dsl-404-card .dsl-404-card-title { margin: 0; font: 700 15px "Inter", sans-serif; color: var(--wp--preset--color--ink); }
.dsl-404-card .dsl-404-card-title a.dsl-404-stretch { color: inherit; text-decoration: none; }
.dsl-404-card .dsl-404-card-title a.dsl-404-stretch::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.dsl-404-card .dsl-404-card-sub { margin: 0; font: 400 13px "Inter", sans-serif; color: var(--wp--preset--color--ink-3); }

@media (max-width: 560px) { .dsl-404 { padding: 48px 24px; } }

/* =========================================================================
   KURS-ANMELDE-MODAL (Buchung → Kursverwaltung)
   ========================================================================= */
.dsl-anm-modal { position: fixed; inset: 0; margin: auto; width: min(560px, calc(100vw - 32px)); height: -moz-fit-content; height: fit-content; max-height: calc(100vh - 48px); max-height: calc(100dvh - 48px); padding: 0; border: none; border-radius: 20px; background: var(--wp--preset--color--paper); color: var(--wp--preset--color--ink); box-shadow: 0 30px 80px rgba(35, 32, 28, 0.32); overflow: visible; }
.dsl-anm-modal::backdrop { background: rgba(35, 32, 28, 0.55); backdrop-filter: blur(3px); }
/* hidden-Attribut MUSS schlagen (sonst zeigt .dsl-anm-field{display:flex} das TWINT-/Status-Feld trotz hidden). */
.dsl-anm-modal [hidden] { display: none !important; }
.dsl-anm-form { box-sizing: border-box; position: relative; padding: 30px 32px 26px; max-height: calc(100vh - 48px); max-height: calc(100dvh - 48px); overflow-y: auto; overscroll-behavior: contain; padding-bottom: max(26px, env(safe-area-inset-bottom)); }
.dsl-anm-close { position: absolute; z-index: 10; top: 16px; right: 16px; width: 38px; height: 38px; border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 50%; background: #fff; color: var(--wp--preset--color--ink); font-size: 22px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 8px rgba(35, 32, 28, 0.12); }
.dsl-anm-close:hover { background: var(--wp--preset--color--paper-soft); }
.dsl-anm-eyebrow { margin: 0; font: 600 12px "Inter", sans-serif; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--teal-deep); }
.dsl-anm-title { margin: 6px 0 0; font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: clamp(1.4rem, 2.6vw, 1.75rem); letter-spacing: -0.02em; color: var(--wp--preset--color--ink); }
.dsl-anm-lead { margin: 6px 0 18px; font: 400 14px/1.5 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); }
.dsl-anm-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.dsl-anm-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.dsl-anm-field { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; min-width: 0; }
.dsl-anm-grid--plzort { grid-template-columns: 110px 1fr; }
.dsl-anm-grid--pay { align-items: start; }
.dsl-anm-form label, .dsl-anm-pay legend { font: 600 13px "Inter", sans-serif; color: var(--wp--preset--color--ink); }
.dsl-anm-opt { font-weight: 400; color: var(--wp--preset--color--ink-3); }
.dsl-anm-form input[type=text], .dsl-anm-form input[type=email], .dsl-anm-form input[type=tel], .dsl-anm-form select, .dsl-anm-form textarea { box-sizing: border-box; width: 100%; padding: 9px 12px; border: 1px solid var(--wp--preset--color--border); border-radius: 10px; background: #fff; font: 400 15px "Inter", sans-serif; color: var(--wp--preset--color--ink); }
.dsl-anm-form input:focus, .dsl-anm-form select:focus, .dsl-anm-form textarea:focus { outline: none; border-color: var(--wp--preset--color--teal); box-shadow: 0 0 0 3px rgba(40, 190, 204, 0.18); }
.dsl-anm-pay { display: flex; flex-direction: column; gap: 5px; border: 1px solid var(--wp--preset--color--paper-deep); border-radius: 10px; padding: 9px 13px 11px; }
.dsl-anm-pay legend { padding: 0; font: 600 13px "Inter", sans-serif; }
.dsl-anm-radio { display: flex; align-items: center; gap: 7px; font-weight: 500; cursor: pointer; }
.dsl-anm-radio input { width: auto; }
.dsl-anm-check { display: flex; align-items: flex-start; gap: 10px; font: 400 13px/1.4 "Inter", sans-serif; color: var(--wp--preset--color--ink-2); margin: 2px 0 14px; cursor: pointer; }
.dsl-anm-check input { width: auto; margin-top: 2px; flex: 0 0 auto; }
.dsl-anm-submit { width: 100%; padding: 15px; border: none; border-radius: 12px; background: var(--wp--preset--color--teal-deep); color: #fff; font: 700 16px "Inter", sans-serif; cursor: pointer; box-shadow: 0 10px 24px rgba(19, 153, 166, 0.28); }
.dsl-anm-submit:hover { background: var(--wp--preset--color--teal-deep); }
.dsl-anm-submit:disabled { opacity: 0.6; cursor: default; }
.dsl-anm-status { margin: 0 0 14px; padding: 12px 14px; border-radius: 11px; font: 500 14px/1.45 "Inter", sans-serif; }
.dsl-anm-status--ok { background: rgba(40, 190, 204, 0.12); border: 1px solid rgba(40, 190, 204, 0.3); color: var(--wp--preset--color--teal-deep); }
.dsl-anm-status--err { background: rgba(197, 107, 74, 0.1); border: 1px solid rgba(197, 107, 74, 0.3); color: var(--wp--preset--color--terracotta); }
/* Erfolgs-Zustand nach Buchung: nur Titel, Danke-Box und «Schliessen» zeigen –
   alle übrigen Form-Kinder (Eyebrow, Lead, Felder, Honeypot) ausblenden. */
.dsl-anm-form--done > *:not(.dsl-anm-title):not(.dsl-anm-status):not(.dsl-anm-submit) { display: none; }
.dsl-anm-form--done .dsl-anm-title { margin-bottom: 18px; }
.dsl-anm-form--done .dsl-anm-status { margin-bottom: 18px; }
@media (max-width: 560px) {
	/* Mobile: nicht im (zu grossen) Layout-Viewport zentrieren – sonst sitzt die Ober-/Unterkante
	   hinter Safaris Adressleiste/Toolbar. Stattdessen oben verankern mit Toolbar-/Safe-Area-Abstand
	   und Hoehe auf den sichtbaren Bereich (dvh) begrenzen → Schliessen- UND Absenden-Button erreichbar. */
	/* Modal- UND Formular-max-height MUESSEN identisch sein – sonst quillt das (hoehere)
	   Formular unten aus dem Modal (overflow:visible) und der Absenden-Button rutscht aus dem Bild. */
	.dsl-anm-modal { inset: auto; top: calc(env(safe-area-inset-top, 0px) + 14px); left: 50%; right: auto; bottom: auto; transform: translateX(-50%); margin: 0; width: calc(100vw - 20px); overflow: hidden; max-height: calc(100vh - 36px); max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 36px); border-radius: 16px; }
	.dsl-anm-form { padding: 26px 18px 20px; max-height: calc(100vh - 36px); max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 36px); padding-bottom: max(24px, calc(env(safe-area-inset-bottom) + 16px)); }
	.dsl-anm-grid { grid-template-columns: 1fr; gap: 0; }
	.dsl-anm-close { top: 12px; right: 12px; width: 34px; height: 34px; }
}

/* ============================================================
   Leerer State «Nähworkshops» – Karte mit Warteliste
   Vorlage: «Nähworkshops Leerer State.dc.html», Variante A.
   Erscheint im Kurse-Block, wenn die Rubrik «workshop» keine Termine hat.
   ============================================================ */
/* Leer-State füllt die volle Content-Breite (einspaltiges Grid statt auto-fill-Zelle). */
.dsl-kt-grid--single { grid-template-columns: 1fr; }
@keyframes dsl-wsempty-ndl {
	0%, 100% { transform: translateY(0) rotate(-8deg); }
	50% { transform: translateY(-6px) rotate(-8deg); }
}
.dsl-wsempty {
	position: relative;
	margin-top: 40px;
	background: #fff;
	border: 1.6px dashed var(--wp--preset--color--border-dash);
	border-radius: 22px;
	padding: 44px 40px;
	box-shadow: 0 14px 34px rgba(35, 32, 28, 0.06);
	text-align: center;
	overflow: hidden;
}
.dsl-wsempty-bg {
	position: absolute;
	inset: 0;
	opacity: 0.5;
	pointer-events: none;
	background-image:
		repeating-linear-gradient(45deg, rgba(40, 190, 204, 0.06) 0 14px, transparent 14px 28px),
		repeating-linear-gradient(-45deg, rgba(40, 190, 204, 0.06) 0 14px, transparent 14px 28px);
}
.dsl-wsempty-inner { position: relative; }
.dsl-wsempty-icon {
	width: 76px;
	height: 76px;
	margin: 0 auto 22px;
	border-radius: 20px;
	background: rgba(40, 190, 204, 0.12);
	display: flex;
	align-items: center;
	justify-content: center;
}
.dsl-wsempty-icon svg { animation: dsl-wsempty-ndl 4.5s ease-in-out infinite; }
.dsl-wsempty-title {
	font: 800 26px "Bricolage Grotesque", sans-serif;
	color: var(--wp--preset--color--ink);
	margin: 0 0 10px;
	letter-spacing: -0.01em;
}
.dsl-wsempty-text {
	font: 400 16px/1.6 "Inter", sans-serif;
	color: var(--wp--preset--color--ink-2);
	margin: 0 auto 26px;
	max-width: 440px;
}
.dsl-wsempty-cta { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.dsl-wsempty-btn {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 14px 22px;
	border-radius: 11px;
	font: 700 15px "Inter", sans-serif;
	text-decoration: none;
}
.dsl-wsempty-btn--primary {
	background: var(--wp--preset--color--teal-deep);
	color: #fff;
	box-shadow: 0 10px 22px rgba(19, 153, 166, 0.26);
}
.dsl-wsempty-btn--ghost {
	background: transparent;
	color: var(--wp--preset--color--ink);
	border: 1.5px solid var(--wp--preset--color--ink);
}
@media (prefers-reduced-motion: reduce) {
	.dsl-wsempty-icon svg { animation: none; }
}

/* ---- Ferien-/Hinweis-Band (site-weit, unter dem Header) --------------------
   Inhalt lebt editierbar im Header-Template-Part (DB); ein-/ausbauen via
   tools/ferien-band.php pro Umgebung. Naht-Optik = border-dash-Token. */
.dsl-ferien-band {
	background: var(--wp--preset--color--paper-soft);
	border-top: 2px dashed var(--wp--preset--color--border-dash);
	border-bottom: 2px dashed var(--wp--preset--color--border-dash);
	padding: 13px 24px;
}
.dsl-ferien-band p {
	margin: 0;
	text-align: center;
	font: 500 15px/1.55 "Inter", sans-serif;
	color: var(--wp--preset--color--ink-body);
}
.dsl-ferien-band p::before {
	content: "";
	display: inline-block;
	width: 15px;
	height: 15px;
	margin-right: 9px;
	vertical-align: -2px;
	background: var(--wp--preset--color--terracotta);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 21s-6.7-4.3-9.3-8.1C.8 10 1.6 6.4 4.5 5.2 6.6 4.3 9 5 12 8c3-3 5.4-3.7 7.5-2.8 2.9 1.2 3.7 4.8 1.8 7.7C18.7 16.7 12 21 12 21z'/%3E%3C/svg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 21s-6.7-4.3-9.3-8.1C.8 10 1.6 6.4 4.5 5.2 6.6 4.3 9 5 12 8c3-3 5.4-3.7 7.5-2.8 2.9 1.2 3.7 4.8 1.8 7.7C18.7 16.7 12 21 12 21z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.dsl-ferien-band strong { color: var(--wp--preset--color--terracotta); font-weight: 700; }