/* KW Ads-FAQ: flache FAQ-Liste fuer Anzeigen-Landingpages (#1364 Foreman,
 * LP-Design-Welle Teil 1, Plan-Punkt 4).
 *
 * WARUM eigene Datei statt kw-blocks.css: kw-blocks.css laedt async
 * (media="print"+onload, siehe kw-blocks.php:133) -- ads-faq hatte bisher GAR
 * KEIN eigenes CSS (nur .kw-overline aus dem globalen Bundle traf zufaellig),
 * die Liste rendert als nackte Browser-<details>. Neue Regeln in kw-blocks.css
 * wuerden also NACH dem ersten Paint nachschnappen (CLS). Gleiches Muster wie
 * ad-hero/style.css: Datei ist klein und ausschliesslich auf .kw-ads-faq*
 * gescoped, render.php druckt sie zusaetzlich SYNCHRON als <style> inline
 * (file_get_contents), die externe Kopie bleibt als doppelter Boden (Browser-
 * Cache/Back-Forward) bestehen wie bei den anderen selbsttragenden Bloecken.
 *
 * OPTIK-ANGLEICH: Werte 1:1 aus kw-blocks.css .kw-faq-block .kw-faq*
 * (kanonischer Akkordeon-Stil, #961) auf die eigenen .kw-ads-faq__*-Klassen
 * uebertragen -- FUNKTION bleibt die flache Liste (keine Themen-Gruppierung,
 * kein Umbau auf den Site-faq-Block, dessen Code bleibt unangetastet).
 */

.kw-ads-faq {
	padding: 64px 20px;
}
.kw-ads-faq__inner {
	max-width: 800px;
	margin: 0 auto;
}
.kw-ads-faq__head {
	text-align: center;
	margin-bottom: 32px;
}
.kw-ads-faq__title {
	font-family: 'Josefin Sans', sans-serif;
	font-weight: 700;
	font-size: clamp(22px, 3vw, 32px);
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin: 8px 0 0;
	color: var(--kw-body-text, #1A1A1A);
}
.kw-ads-faq__list {
	list-style: none;
	padding: 0;
	margin: 0;
	border-top: 1px solid var(--kw-border, #DDD5C8);
}
.kw-ads-faq__item {
	border-bottom: 1px solid var(--kw-border, #DDD5C8);
}
.kw-ads-faq__q {
	width: 100%;
	background: transparent;
	border: 0;
	padding: 18px 4px;
	min-height: 56px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	text-align: left;
	font-family: 'Josefin Sans', sans-serif;
	font-weight: 600;
	font-size: 15px;
	letter-spacing: 0.6px;
	text-transform: uppercase;
	color: var(--kw-body-text, #1A1A1A);
	cursor: pointer;
	transition: color .25s;
	list-style: none;
}
.kw-ads-faq__q::-webkit-details-marker { display: none; }
.kw-ads-faq__q:hover,
.kw-ads-faq__item[open] .kw-ads-faq__q { color: var(--kw-bordeaux, #97233F); }
.kw-ads-faq__plus {
	width: 28px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: 'Josefin Sans', sans-serif;
	font-weight: 400;
	font-size: 22px;
	color: var(--kw-bordeaux, #97233F);
	flex-shrink: 0;
}
.kw-ads-faq__item[open] .kw-ads-faq__plus::before { content: '\2013'; }
.kw-ads-faq__item:not([open]) .kw-ads-faq__plus::before { content: '+'; }
.kw-ads-faq__a { padding: 0 4px 22px; max-width: 70ch; }
.kw-ads-faq__a p {
	margin: 0;
	font-size: 15.5px;
	line-height: 1.65;
	color: var(--kw-text-muted, #666);
}

@media (max-width: 782px) {
	.kw-ads-faq { padding: 48px 20px; }
}

/* ===== #1512: Kern-Block-Rahmen (RAHMEN-Pfad, InnerBlocks) =====
   Ein FAQ-Eintrag ist jetzt core/details (natives <details><summary>) statt
   dem Legacy-Markup mit eigenen .kw-ads-faq__qtext/.kw-ads-faq__plus-Spans --
   core/details erlaubt keine eigenen Kind-Spans in der Summary (RichText-
   Attribut). Optik 1:1 aus den .kw-ads-faq__q/-plus-Regeln oben uebernommen,
   Plus-/Minus-Icon hier per ::after auf dem summary-Element nachgebaut. */
.kw-ads-faq__list .wp-block-details.kw-ads-faq__item {
	border-bottom: 1px solid var(--kw-border, #DDD5C8);
	margin: 0;
}
.kw-ads-faq__list .wp-block-details.kw-ads-faq__item > summary {
	width: 100%;
	background: transparent;
	border: 0;
	padding: 18px 4px;
	min-height: 56px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	text-align: left;
	font-family: 'Josefin Sans', sans-serif;
	font-weight: 600;
	font-size: 15px;
	letter-spacing: 0.6px;
	text-transform: uppercase;
	color: var(--kw-body-text, #1A1A1A);
	cursor: pointer;
	list-style: none;
}
.kw-ads-faq__list .wp-block-details.kw-ads-faq__item > summary::-webkit-details-marker { display: none; }
.kw-ads-faq__list .wp-block-details.kw-ads-faq__item > summary::marker { content: ""; }
.kw-ads-faq__list .wp-block-details.kw-ads-faq__item > summary:hover,
.kw-ads-faq__list .wp-block-details.kw-ads-faq__item[open] > summary { color: var(--kw-bordeaux, #97233F); }
.kw-ads-faq__list .wp-block-details.kw-ads-faq__item > summary::after {
	content: '+';
	width: 28px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: 'Josefin Sans', sans-serif;
	font-weight: 400;
	font-size: 22px;
	color: var(--kw-bordeaux, #97233F);
	flex-shrink: 0;
}
.kw-ads-faq__list .wp-block-details.kw-ads-faq__item[open] > summary::after { content: '\2013'; }
/* Antwort-Absatz: je nach WP-Version liegt er direkt als Geschwister der
   summary im <details> ODER in einem .wp-block-details__content-Wrapper --
   beide Faelle werden abgedeckt. */
.kw-ads-faq__list .wp-block-details.kw-ads-faq__item > p,
.kw-ads-faq__list .wp-block-details.kw-ads-faq__item .wp-block-details__content {
	padding: 0 4px 22px;
	max-width: 70ch;
}
.kw-ads-faq__list .wp-block-details.kw-ads-faq__item p {
	margin: 0;
	font-size: 15.5px;
	line-height: 1.65;
	color: var(--kw-text-muted, #666);
}

/* ===== Folge-Fix #1512 (Migrations-Fund, reports/issue-1512/migration-
   protokoll.md Abschnitt 4): ACF rendert das <InnerBlocks/> im Rahmen-Pfad
   serverseitig in einen zusaetzlichen Wrapper
   <div class="acf-innerblocks-container"> zwischen .kw-ads-faq__list und den
   FAQ-Eintraegen. .kw-ads-faq__list ist kein CSS-Grid (Nachfahren-Selektoren
   oben ueberstehen den Wrapper bereits unveraendert, Protokoll Abschnitt 4)
   -- die Regel hier raeumt trotzdem den generischen Zwischen-Wrapper aus dem
   Layout-Baum, konsistent zu den drei Grid-Bloecken und ohne Risiko, weil
   GESCOPED auf diesen Block (nicht global auf .acf-innerblocks-container --
   der Wrapper existiert sitewide in jedem ACF-InnerBlocks-Block). */
.kw-ads-faq__list > .acf-innerblocks-container {
	display: contents;
}