/* Bausteine der Patterns. Maße stammen aus design/README.md Abschnitt 3 und 4. */

/* Abschnitte */
.adf-section { padding: var(--wp--preset--spacing--section) var(--adf-gutter); }
.adf-section > * + * { margin-block-start: var(--wp--preset--spacing--gross); }
.adf-section > * + :is(.wp-block-list.adf-anliegen, .wp-block-table.adf-tabelle) { margin-block-start: var(--wp--preset--spacing--gross); } /* trotz margin: 0 der Listen */
.adf-schmal > * { max-width: 960px; }
.adf-dark :where(h1, h2, h3) { color: #fff; }
.adf-dark a:not(.wp-block-button__link) { color: #fff; }
.adf-kopf, .adf-stapel { display: flex; flex-direction: column; gap: 12px; }
.adf-stapel { gap: 24px; }
.adf-kopf > *, .adf-stapel > * { margin: 0; max-width: 40em; }
.adf-stapel > .wp-block-heading, .adf-stapel > .adf-aktionen { max-width: none; }
.adf-kopfzeile { align-items: flex-end; gap: 16px 32px; }
.adf-dark .adf-kopfzeile { align-items: center; }

/* Raster und Karten */
.adf-raster { display: grid; gap: 28px; grid-template-columns: repeat(auto-fit, minmax(min(var(--adf-min, 320px), 100%), 1fr)); }
.adf-hero {
	display: grid; align-items: center; gap: 48px 64px;
	grid-template-columns: repeat(auto-fit, minmax(min(460px, 100%), 1fr));
}
.adf-hero--breit { gap: 48px 72px; grid-template-columns: repeat(auto-fit, minmax(min(480px, 100%), 1fr)); }
@media (min-width: 960px) { .adf-hero--breit { align-items: start; grid-template-columns: minmax(0, 1fr) minmax(280px, 360px); } }
.adf-hero--schmal { grid-template-columns: repeat(auto-fit, minmax(min(440px, 100%), 1fr)); }
@media (min-width: 1024px) { .adf-hero:has(> .adf-hero__text) { grid-template-columns: minmax(0, 1fr) minmax(300px, 400px); } } /* Start: "Ihr Ansprechpartner" in einer Zeile */
.adf-hero__text { display: flex; flex-direction: column; gap: 28px; }
.adf-hero__text > *, .adf-stapel > * { margin: 0; }
.wp-block-group.adf-karte {
	display: flex; flex-direction: column; gap: 16px; padding: var(--wp--preset--spacing--karte);
	border-radius: var(--wp--custom--radius--karte);
}
.adf-karte > * { margin: 0; }
.wp-block-group.adf-rahmen {
	display: grid; gap: 40px 64px; padding: clamp(28px, 4vw, 56px); border: 2px solid var(--adf-primary);
	border-radius: var(--wp--custom--radius--gross); grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr));
}
.adf-eyebrow { margin: 0; font: 500 1.125rem var(--adf-lexend); color: var(--adf-primary); }
.adf-eyebrow--icon { display: flex; align-items: center; gap: 12px; }

/* Verlinkte Karte: der Link in der Überschrift deckt die ganze Karte ab */
.adf-link { position: relative; }
.adf-link a { color: var(--adf-dark); text-decoration: none; }
.adf-link a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.adf-link a:focus-visible { outline: none; }
.adf-link:has(a:focus-visible) { outline: 3px solid var(--adf-dark); outline-offset: 3px; }
.adf-link:hover { box-shadow: inset 0 0 0 2px var(--adf-primary); }
.adf-karte .adf-mehr, .adf-weiter { display: flex; align-items: center; gap: 8px; min-height: 48px; font-weight: 700; color: var(--adf-primary); }
.adf-karte .adf-mehr { margin-top: auto; }
.adf-weiter a { display: flex; align-items: center; min-height: 48px; }
.adf-mehr::after, .adf-pfeil .wp-block-button__link::after {
	content: ""; flex: none; width: 1.15em; height: 1.15em; background: currentColor;
	-webkit-mask: var(--adf-pfeil) center / contain no-repeat; mask: var(--adf-pfeil) center / contain no-repeat;
}

/* Buttons: Stil "Standard" kommt aus theme.json, Umrissstile hier */
.wp-block-button__link { display: inline-flex; align-items: center; justify-content: center; gap: .55em; min-height: 56px; text-decoration: none; }
.wp-block-button__link:hover { filter: brightness(.95); }
.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background) {
	background: #fff; border: 2px solid var(--adf-primary); color: var(--adf-primary); padding: 0.75rem 1.625rem;
}
.wp-block-button.is-style-outline-light > .wp-block-button__link {
	background: transparent; border: 2px solid #fff; color: #fff; padding: 0.75rem 1.625rem;
}
.adf-chat .wp-block-button__link::before, .adf-leiste__wa a::before {
	content: ""; flex: none; width: 22px; height: 22px; background: currentColor;
	-webkit-mask: var(--adf-chat) center / contain no-repeat; mask: var(--adf-chat) center / contain no-repeat;
}
/* Schmale Bildschirme: Buttons volle Breite, gleich große Tippflächen */
@media (max-width: 480px) {
	.wp-block-buttons, .wp-block-button, .wp-block-button__link, .adf-senden { width: 100%; box-sizing: border-box; }
}
.adf-aktionen { gap: 16px; }
.adf-aktionen .wp-block-buttons { margin: 0; }
.wp-block-buttons.adf-aktionen { gap: 16px; }

/* Listen mit Symbol */
.wp-block-list.adf-haken, .wp-block-list.adf-anliegen {
	display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none;
}
.adf-haken li::before, .adf-anliegen li::before {
	content: ""; flex: none; width: 22px; height: 22px; margin-top: .3em; background: var(--wp--preset--color--success);
	-webkit-mask: var(--adf-haken) center / contain no-repeat; mask: var(--adf-haken) center / contain no-repeat;
}
/* Kein flex am li: sonst wird jeder Link im Text ein eigenes Flex-Element und bricht die Zeile. */
.adf-haken li { position: relative; padding-left: 32px; }
.adf-haken li::before { position: absolute; left: 0; top: 0; }
.adf-waagrecht { flex-direction: row !important; flex-wrap: wrap; gap: 12px 28px !important; font-size: 1.125rem; }
.wp-block-list.adf-anliegen {
	display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(min(480px, 100%), 1fr));
}
.adf-anliegen li {
	display: flex; align-items: center; gap: 18px; padding: 24px 28px; border-radius: 16px;
	background: var(--wp--preset--color--surface); font-size: 1.3125rem; font-style: italic;
}
.adf-anliegen li::before { width: 32px; height: 32px; margin: 0; background: var(--adf-primary); -webkit-mask-image: var(--adf-chat); mask-image: var(--adf-chat); }
.adf-anliegen--leistung li { font-style: normal; font-size: 1.25rem; }
.adf-anliegen--leistung li::before { width: 28px; height: 28px; background: var(--wp--preset--color--success); -webkit-mask-image: var(--adf-haken); mask-image: var(--adf-haken); }
.wp-block-list.adf-icons-liste { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; list-style: none; }
.adf-icons-liste li { --adf-i-gr: 26px; position: relative; padding-left: 38px; }
.adf-icons-liste li::before { position: absolute; left: 0; top: 2px; }

/* Ablauf: echte nummerierte Liste, der fette Anfang eines Punkts ist sein Titel */
ol.adf-ablauf { --adf-min: 300px; counter-reset: schritt; margin: 0; padding: 0; list-style: none; } ol.adf-ablauf:has(> li:nth-child(4)) { --adf-min: 440px; } /* 4 Schritte: 2 × 2 statt 4 schmale Spalten */
.adf-ablauf li { padding: 36px; border-radius: var(--wp--custom--radius--karte); background: #fff; counter-increment: schritt; }
.adf-ablauf li::before {
	content: counter(schritt); display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; margin-bottom: 14px;
	border-radius: 50%; background: var(--adf-primary); color: #fff; font: 600 1.5rem var(--adf-lexend);
}
.adf-ablauf strong {
	display: block; margin-bottom: 14px; font: 600 var(--wp--preset--font-size--m)/1.3 var(--adf-lexend);
	color: var(--wp--preset--color--primary-dark);
}

/* Hinweis, Preis */
.wp-block-group.adf-hinweis {
	display: flex; gap: 18px; align-items: flex-start; padding: 24px 28px; border: 2px solid var(--adf-primary); border-radius: 16px;
}
.adf-hinweis > * { margin: 0; }
.adf-hinweis::before { margin-top: 2px; }
.adf-preis { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; }
.adf-preis__zahl { font: 700 var(--wp--preset--font-size--price)/1.1 var(--adf-lexend); color: var(--adf-dark); }
.adf-preis__zahl--klein { font-size: 2rem; line-height: 1.25; }

/* Porträt, Einzugsgebiet, Sprungmarken */
.adf-portrait { position: relative; justify-self: center; width: 100%; max-width: 480px; margin: 0; }
.adf-portrait > * { margin: 0; }
.adf-portrait__bild {
	--adf-i-gr: 72px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; aspect-ratio: 4 / 5;
	border: 2px dashed var(--adf-primary); border-radius: var(--wp--custom--radius--gross); background: #fff;
	color: var(--adf-primary); font: 500 1.125rem var(--adf-lexend);
}
.adf-portrait .wp-block-image img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--wp--custom--radius--gross); }
.adf-portrait__name {
	position: absolute; left: -24px; bottom: 32px; display: flex; flex-direction: column; padding: 16px 22px;
	border-radius: 14px; background: #fff; box-shadow: var(--wp--preset--shadow--karte); font-size: 1.0625rem;
}
.adf-portrait__name > * { margin: 0; }
.adf-portrait strong { font: 600 1.1875rem var(--adf-lexend); color: var(--adf-dark); }
@media (max-width: 600px) { .adf-portrait__name { left: 12px; right: 12px; bottom: 12px; } }
.adf-kreise {
	display: flex; align-items: center; justify-content: center; justify-self: center; width: 100%; max-width: 440px;
	aspect-ratio: 1; border-radius: 50%; background: var(--wp--preset--color--surface);
}
.adf-kreise > div { margin: 0; display: flex; align-items: center; justify-content: center; width: 64%; aspect-ratio: 1; border-radius: 50%; border: 2px dashed var(--adf-primary); }
.adf-kreise > div > p {
	--adf-i-gr: 34px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; width: 50%; margin: 0;
	aspect-ratio: 1; border-radius: 50%; background: var(--adf-primary); color: #fff; font: 600 1.125rem var(--adf-lexend);
}
.adf-toc > * { margin: 0; }
.adf-toc { padding: 28px 32px; border-radius: var(--wp--custom--radius--karte); background: #fff; }
.adf-toc__titel { margin: 0 0 6px; font: 600 1.125rem var(--adf-lexend); color: var(--adf-dark); }
.adf-toc ul { margin: 0; padding: 0; list-style: none; }
.adf-toc a { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; border-bottom: 1px solid var(--wp--preset--color--line); font-weight: 500; text-decoration: none; }
.adf-toc a:is(:hover, :focus-visible) { text-decoration: underline; }
.adf-toc a::after { content: "↓" / ""; color: var(--adf-primary); }
.adf-toc li:last-child a { border-bottom: 0; }

/* FAQ mit dem Core-Block Details */
.adf-faq { display: flex; flex-direction: column; gap: 12px; }
.adf-faq > * { margin: 0; }
.wp-block-details { margin: 0; border-radius: 14px; background: #fff; }
.wp-block-details summary {
	display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; padding: 16px 24px;
	font: 600 1.25rem var(--adf-lexend); color: var(--adf-dark); cursor: pointer; list-style: none;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after {
	content: ""; flex: none; width: 26px; height: 26px; background: var(--adf-primary); transition: transform .2s;
	-webkit-mask: var(--adf-plus) center / contain no-repeat; mask: var(--adf-plus) center / contain no-repeat;
}
.wp-block-details[open] summary::after { transform: rotate(45deg); }
.wp-block-details > :not(summary) { margin: 0; padding: 0 24px 24px; }
@media (prefers-reduced-motion: reduce) { .wp-block-details summary::after { transition: none; } }

/* Preis- und Informationsseiten */
.wp-block-list.adf-pillen { display: flex; flex-wrap: wrap; gap: 8px 12px; margin: 8px 0 0; padding: 0; list-style: none; }
.adf-pillen a {
	display: flex; align-items: center; min-height: 48px; padding: 0 20px; border-radius: 999px; background: #fff;
	color: var(--adf-dark); font-size: 1.125rem; text-decoration: none;
}
.adf-pillen a:hover { text-decoration: underline; }
.wp-block-group.adf-karte--rahmen { border: 2px solid var(--adf-primary); }
.wp-block-group.adf-karte--hell { border: 2px solid var(--wp--preset--color--line); }
.adf-karte--rahmen .adf-preis__zahl, .adf-karte .adf-preis--gross .adf-preis__zahl { font-size: var(--wp--preset--font-size--price); }
.adf-h-icon { display: flex; align-items: center; gap: 12px; margin: 0; font-size: var(--wp--preset--font-size--m); color: var(--adf-dark); }
.wp-block-list.adf-dl { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
.adf-dl:not(.adf-dl--preise) strong { display: block; }
.adf-kopfzeile--icon { display: flex; align-items: center; gap: 18px; }
.adf-pfeilliste li::before, .adf-kreuz li::before { content: ""; flex: none; width: 24px; height: 24px; margin-top: .25em; }
.adf-pfeilliste li::before { background: var(--adf-primary); -webkit-mask: var(--adf-pfeil) center / contain no-repeat; mask: var(--adf-pfeil) center / contain no-repeat; }
.adf-kreuz li::before { background: var(--adf-dark); -webkit-mask: var(--adf-kreuz) center / contain no-repeat; mask: var(--adf-kreuz) center / contain no-repeat; }
.wp-block-list.adf-pfeilliste, .wp-block-list.adf-kreuz { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
.adf-pfeilliste li, .adf-kreuz li { position: relative; padding-left: 38px; }
.adf-pfeilliste li::before, .adf-kreuz li::before { position: absolute; left: 0; top: 0; }
.adf-raster--breit { --adf-min: 440px; }
.adf-antwortzeit { display: flex; align-items: center; gap: 12px; margin: 0; font-size: 1.3125rem; }
.adf-antwortzeit svg { flex: none; color: var(--adf-primary); }

.adf-karte .wp-block-buttons, .adf-karte .wp-block-button, .adf-karte .wp-block-button__link { width: 100%; }
.adf-karte .wp-block-button__link { box-sizing: border-box; }