/* ==========================================================================
   ASTRAL Versicherungen – Theme-Stile
   Gestaltung nach den ASTRAL-E-Mail-Vorlagen: hell, Blau #008DD2, Kästen in
   Hellblau/Hellgrün, blaue Versal-Überschriften, Bildbänder, Signaturbalken.
   ========================================================================== */

:root {
	--astral-blau: var(--wp--preset--color--blau);
	--astral-blau-dunkel: var(--wp--preset--color--blau-dunkel);
	--astral-blau-hell: var(--wp--preset--color--blau-hell);
	--astral-blau-zart: var(--wp--preset--color--blau-zart);
	--astral-gruen: var(--wp--preset--color--gruen);
	--astral-gruen-hell: var(--wp--preset--color--gruen-hell);
	--astral-tinte: var(--wp--preset--color--tinte);
	--astral-grau: var(--wp--preset--color--grau);
	--astral-linie: var(--wp--preset--color--linie);
	--astral-sonne: var(--wp--preset--color--sonne);
	--astral-radius: 8px;
	--astral-schatten: var(--wp--preset--shadow--karte);
	--astral-icons: url("../icons/");
}

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

:where(a, button, input, summary):focus-visible {
	outline: 3px solid var(--astral-blau-dunkel);
	outline-offset: 2px;
	border-radius: 2px;
}

/* Hilfsklassen ------------------------------------------------------------ */
.astral-overline {
	margin: 0 0 0.5rem;
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--astral-blau-dunkel);
}
.astral-overline a { color: inherit; text-decoration: none; }
.astral-blau { color: var(--astral-blau); }
.astral-einleitung { font-size: var(--wp--preset--font-size--large); color: var(--astral-grau); }
/* Absatz bleibt spaltenbreit (bündig unter der Überschrift), nur der Text wird auf eine gut lesbare Zeilenlänge begrenzt – unabhängig von der Bildschirmbreite. */
.astral-einleitung__text { display: block; max-width: 46rem; }
.astral-mehr-link { margin: 0; font-weight: 700; }
.astral-mehr-link a { text-decoration: none; }
.astral-mehr-link a:hover { text-decoration: underline; }

.astral-platzhalter-hinweis,
.astral-platzhalter-inline {
	display: inline-block;
	padding: 0.2rem 0.6rem;
	border-radius: 999px;
	background: var(--astral-sonne);
	color: var(--astral-tinte);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.01em;
}
.astral-platzhalter-inline { margin-left: 0.4rem; vertical-align: middle; }

.astral-entwurf-hinweis {
	padding: 1rem 1.25rem;
	border-left: 4px solid var(--astral-sonne);
	background: #FFF8E1;
	border-radius: 0 var(--astral-radius) var(--astral-radius) 0;
}

/* Haken-Liste */
.astral-haken { list-style: none; padding-left: 0; }
.astral-haken li { position: relative; padding-left: 1.9rem; margin: 0.35rem 0; }
.astral-haken li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.2em;
	width: 1.3rem;
	height: 1.3rem;
	background: var(--astral-gruen);
	-webkit-mask: url("../icons/haken.svg") center / contain no-repeat;
	mask: url("../icons/haken.svg") center / contain no-repeat;
}

/* Buttons (feste Größe: weiße Schrift auf Blau braucht mind. 19 px fett) */
.wp-element-button,
.wp-block-button__link { font-size: 1.1875rem !important; }
.wp-block-button.is-style-outline > .wp-block-button__link {
	border: 2px solid var(--astral-blau);
	background: transparent;
	color: var(--astral-blau-dunkel);
	padding: calc(0.85rem - 2px) calc(1.5rem - 2px);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--astral-blau-hell);
	color: var(--astral-blau-dunkel);
}

/* Kopfbereich --------------------------------------------------------------- */
.astral-header-bereich { position: relative; z-index: 20; }
.astral-topbar { font-size: 0.9375rem; color: var(--astral-grau); }
.astral-topbar p { margin: 0; }
.astral-topbar-links a { color: var(--astral-blau-dunkel); text-decoration: none; margin-left: 1.25rem; font-weight: 600; }
.astral-topbar-links a:first-child { margin-left: 0; }
.astral-topbar-links a:hover { text-decoration: underline; }

.astral-logo { display: block; line-height: 0; }
.astral-logo img { width: clamp(170px, 18vw, 230px); height: auto; }

.astral-kopf-kontakt p { margin: 0; line-height: 1.2; }
.astral-kopf-telefon a,
.astral-kopf-rueckruf { display: flex; flex-direction: column; text-decoration: none; color: var(--astral-tinte); font-weight: 700; font-size: 1.1875rem; }
.astral-kopf-telefon span,
.astral-kopf-rueckruf span { font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--astral-grau); }
.astral-kopf-telefon a:hover { color: var(--astral-blau-dunkel); }
.astral-kopf-rueckruf { font-size: 1rem; color: var(--astral-gruen); padding-left: 1.5rem; border-left: 1px solid var(--astral-linie); }

.astral-menue-leiste {
	border-top: 1px solid var(--astral-linie);
	border-bottom: 4px solid var(--astral-blau);
}
.astral-menue-leiste .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	padding: 0.85rem 0.15rem;
	color: var(--astral-tinte);
	text-decoration: none;
	border-bottom: 3px solid transparent;
	margin-bottom: -4px;
}
.astral-menue-leiste .wp-block-navigation__container > .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
.astral-menue-leiste .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:focus-visible {
	color: var(--astral-blau-dunkel);
	border-bottom-color: var(--astral-blau-dunkel);
}
.astral-menue-leiste .wp-block-navigation .wp-block-navigation__submenu-container {
	min-width: 17rem;
	padding: 0.5rem 0;
	border: 1px solid var(--astral-linie) !important;
	border-top: 3px solid var(--astral-blau) !important;
	border-radius: 0 0 var(--astral-radius) var(--astral-radius);
	box-shadow: var(--wp--preset--shadow--hoch);
	font-weight: 500;
}
.astral-menue-leiste .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 0.5rem 1.1rem;
	color: var(--astral-tinte);
	text-decoration: none;
}
.astral-menue-leiste .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	background: var(--astral-blau-hell);
	color: var(--astral-blau-dunkel);
}

/* Hintere Untermenüs öffnen nach links (kein Überlauf am rechten Rand) */
.astral-menue-leiste .wp-block-navigation__container > .wp-block-navigation-item:nth-last-child(-n+2) > .wp-block-navigation__submenu-container { left: auto; right: 0; }

/* Startseite: Kopfbereich (Held) ------------------------------------------- */
.astral-startseite > .wp-block-post-content > .alignfull:first-child { margin-top: 0; }
.astral-held {
	position: relative;
	overflow: hidden;
	padding-top: var(--wp--preset--spacing--50);
	padding-bottom: var(--wp--preset--spacing--40);
	background: linear-gradient(180deg, #fff 0%, var(--astral-blau-hell) 100%);
}
.astral-held::before {
	/* diagonale Blaufläche wie in den E-Mail-Bannern */
	content: "";
	position: absolute;
	top: 0;
	right: -8%;
	width: 44%;
	height: 100%;
	background: var(--astral-blau);
	clip-path: polygon(30% 0, 100% 0, 100% 100%, 0 100%);
	opacity: 0.95;
}
.astral-held > * { position: relative; }
.astral-held-titel { margin-top: 0.25rem; line-height: 1.08; letter-spacing: -0.015em; }
.astral-held-text { max-width: 36em; color: var(--wp--preset--color--fliesstext); }
.astral-held .wp-block-buttons { margin-top: 1.75rem; }
.astral-held .astral-haken { margin-top: 1.5rem; display: flex; flex-wrap: wrap; gap: 0.25rem 1.5rem; }
.astral-held .astral-haken li { margin: 0; font-weight: 600; }

.astral-video-platzhalter {
	position: relative;
	margin: 0;
	border-radius: var(--astral-radius);
	overflow: hidden;
	box-shadow: var(--wp--preset--shadow--hoch);
	background: #fff;
}
.astral-video-platzhalter img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 25%; }
.astral-video-play {
	position: absolute;
	left: 50%;
	top: 44%;
	width: 88px;
	height: 88px;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 10px 30px rgba(0, 63, 114, 0.3);
}
.astral-video-play::after {
	content: "";
	position: absolute;
	inset: 0;
	margin: auto;
	width: 34px;
	height: 34px;
	transform: translateX(3px);
	background: var(--astral-blau);
	-webkit-mask: url("../icons/play.svg") center / contain no-repeat;
	mask: url("../icons/play.svg") center / contain no-repeat;
}
.astral-video-platzhalter figcaption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 0.9rem 1.25rem 0.9rem 2.1rem;
	background: var(--astral-blau);
	color: #fff;
	font-size: 1.0625rem;
	line-height: 1.35;
}
.astral-video-platzhalter figcaption::before {
	content: "";
	position: absolute;
	left: 1.1rem;
	top: 0.95rem;
	bottom: 0.95rem;
	width: 4px;
	background: #fff;
}
.astral-video-platzhalter .astral-platzhalter-hinweis { position: absolute; top: 1rem; left: 1rem; }

.astral-kennzahlen {
	margin-top: var(--wp--preset--spacing--50) !important;
	padding: 1.25rem 1.5rem;
	background: #fff;
	border-radius: var(--astral-radius);
	box-shadow: var(--astral-schatten);
	gap: 1rem !important;
}
.astral-kennzahlen p { margin: 0; color: var(--astral-grau); font-size: 1rem; }
.astral-kennzahlen strong { display: block; font-size: 1.75rem; line-height: 1.15; color: var(--astral-blau-dunkel); }

/* Abschnitte ---------------------------------------------------------------- */
.astral-abschnitt { padding-top: var(--wp--preset--spacing--60); padding-bottom: var(--wp--preset--spacing--60); }
.astral-abschnitt--oben0 { padding-top: 0; }
.astral-abschnitt > h2 { margin-top: 0; }

/* Themen-Kacheln */
.astral-themen { margin-top: var(--wp--preset--spacing--40) !important; gap: 1.25rem !important; }
.astral-thema {
	position: relative;
	padding: 1.5rem 1.4rem 1.4rem;
	background: #fff;
	border: 1px solid var(--astral-linie);
	border-radius: var(--astral-radius);
	transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}
.astral-thema::before {
	content: "";
	display: block;
	width: 3rem;
	height: 3rem;
	margin-bottom: 1rem;
	border-radius: 50%;
	background: var(--astral-blau-hell);
}
.astral-thema::after {
	content: "";
	position: absolute;
	top: calc(1.5rem + 0.7rem);
	left: calc(1.4rem + 0.7rem);
	width: 1.6rem;
	height: 1.6rem;
	background: var(--astral-blau-dunkel);
	-webkit-mask: var(--icon) center / contain no-repeat;
	mask: var(--icon) center / contain no-repeat;
}
.astral-thema--gruender { --icon: url("../icons/gruender.svg"); }
.astral-thema--betrieb { --icon: url("../icons/betrieb.svg"); }
.astral-thema--berater { --icon: url("../icons/berater.svg"); }
.astral-thema--shop { --icon: url("../icons/shop.svg"); }
.astral-thema--do { --icon: url("../icons/do.svg"); }
.astral-thema--cyber { --icon: url("../icons/cyber.svg"); }
.astral-thema--recht { --icon: url("../icons/recht.svg"); }
.astral-thema--maschine { --icon: url("../icons/maschine.svg"); }
.astral-thema--flotte { --icon: url("../icons/flotte.svg"); }
.astral-thema--haus { --icon: url("../icons/haus.svg"); }
.astral-thema--vorsorge { --icon: url("../icons/vorsorge.svg"); }
.astral-thema--privat { --icon: url("../icons/privat.svg"); }
.astral-thema h3 { margin: 0 0 0.4rem; font-size: 1.1875rem; line-height: 1.25; }
.astral-thema h3 a { color: var(--astral-tinte); text-decoration: none; }
.astral-thema h3 a::after { content: ""; position: absolute; inset: 0; } /* ganze Kachel klickbar */
.astral-thema p { margin: 0; font-size: 1rem; color: var(--astral-grau); }
.astral-thema:hover,
.astral-thema:focus-within { border-color: var(--astral-blau); box-shadow: var(--astral-schatten); transform: translateY(-2px); }
.astral-thema:hover h3 a { color: var(--astral-blau-dunkel); }
.astral-thema--privat { background: var(--astral-gruen-hell); border-color: transparent; }
.astral-thema--privat::before { background: #fff; }
.astral-thema--privat::after { background: var(--astral-gruen); }

/* Kästen wie in den E-Mail-Vorlagen */
.astral-versprechen { gap: 1rem !important; }
.astral-kasten {
	padding: 1.4rem 1.5rem;
	background: #fff;
	border-radius: var(--astral-radius);
}
.astral-kasten h3 { margin: 0.1rem 0 0.4rem; font-size: 1.25rem; }
.astral-kasten p { margin: 0; }
.astral-kasten-label {
	display: block;
	margin: 0;
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--astral-blau-dunkel);
}
.astral-kasten--gruen { background: var(--astral-gruen-hell); }
.astral-kasten--gruen .astral-kasten-label { color: var(--astral-gruen); }

.astral-zitat {
	margin-top: 1.75rem;
	padding-left: 1.1rem;
	border-left: 4px solid var(--astral-blau);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	color: var(--astral-tinte);
}
.astral-zitat span { display: block; margin-top: 0.35rem; font-size: 0.9375rem; font-weight: 500; color: var(--astral-grau); }

/* Preisbeispiele */
.astral-preise { margin-top: var(--wp--preset--spacing--40) !important; gap: 1.25rem !important; }
.astral-preis {
	display: flex;
	flex-direction: column;
	padding: 1.5rem 1.6rem;
	background: var(--astral-blau-hell);
	border-radius: var(--astral-radius);
}
.astral-preis p { margin: 0; }
.astral-preis-fuer { margin-top: 0.35rem !important; color: var(--astral-grau); }
.astral-preis-betrag { margin: 0.9rem 0 !important; font-size: 2.25rem; font-weight: 700; line-height: 1.1; color: var(--astral-tinte); }
.astral-preis-betrag small { font-size: 1rem; font-weight: 600; color: var(--astral-grau); }
.astral-preis-betrag small:last-child { display: block; margin-top: 0.2rem; }
.astral-preis-zeile { display: flex; justify-content: space-between; gap: 1rem; padding: 0.6rem 0; border-top: 1px solid var(--astral-blau-zart); color: var(--astral-grau); font-size: 1rem; }
.astral-preis-link { margin-top: auto !important; padding-top: 0.6rem; font-weight: 700; }
.astral-preis-link a { text-decoration: none; }

.astral-vorteil {
	margin-top: 1.25rem !important;
	padding: 1.25rem 1.6rem;
	background: var(--astral-gruen-hell);
	border-radius: var(--astral-radius);
	gap: 1rem;
}
.astral-vorteil p { margin: 0; font-size: 1.1875rem; }
.astral-vorteil .astral-kasten-label { color: var(--astral-gruen); margin-bottom: 0.2rem; }

/* Bildband mit blauer Unterzeile (wie „La Dolce Vita“-Vorlage) */
.astral-bildband { position: relative; margin: 0 !important; }
.astral-bildband img { display: block; width: 100%; height: clamp(220px, 30vw, 420px); object-fit: cover; object-position: center 60%; }
.astral-bildband figcaption {
	position: relative;
	padding: 1rem clamp(1rem, 4vw, 2rem) 1rem calc(clamp(1rem, 4vw, 2rem) + 1.1rem);
	background: var(--astral-blau);
	color: #fff;
	font-size: clamp(1.1875rem, 2vw, 1.375rem);
	font-weight: 700;
}
.astral-bildband figcaption::before {
	content: "";
	position: absolute;
	left: clamp(1rem, 4vw, 2rem);
	top: 1rem;
	bottom: 1rem;
	width: 4px;
	background: #fff;
}

/* Beitragskarten ------------------------------------------------------------ */
.astral-beitraege { margin-top: var(--wp--preset--spacing--30); }
.astral-beitraege .wp-block-post-template { gap: 1.5rem; }
.astral-beitrag-karte {
	height: 100%;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--astral-linie);
	border-radius: var(--astral-radius);
	overflow: hidden;
	transition: box-shadow 0.15s, transform 0.15s;
}
.astral-beitrag-karte:hover { box-shadow: var(--astral-schatten); transform: translateY(-2px); }
.astral-beitrag-karte .wp-block-post-featured-image { margin: 0; }
.astral-beitrag-karte .wp-block-post-featured-image img { display: block; }
.astral-beitrag-karte__inhalt { display: flex; flex-direction: column; flex: 1; padding: 1.25rem 1.4rem 1.4rem; }
.astral-beitrag-karte__inhalt > * { margin: 0; }
.astral-beitrag-karte .wp-block-post-title { margin: 0.25rem 0 0.5rem; font-size: 1.25rem; line-height: 1.3; }
.astral-beitrag-karte .wp-block-post-title a { color: var(--astral-tinte); text-decoration: none; }
.astral-beitrag-karte .wp-block-post-title a:hover { color: var(--astral-blau-dunkel); }
.astral-beitrag-karte .wp-block-post-excerpt { color: var(--astral-grau); font-size: 1rem; }
.astral-beitrag-karte .wp-block-post-excerpt__excerpt { margin: 0 0 1rem; }
.astral-beitrag-karte .astral-beitrag-meta { margin-top: auto; padding-top: 0.9rem; border-top: 1px solid var(--astral-linie); }

.astral-beitrag-meta { display: flex; align-items: center; gap: 0.75rem; margin: 1rem 0 1.5rem; }
.astral-autor-bild { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; flex: none; }
.astral-autor-bild--initialen { display: grid; place-items: center; background: var(--astral-blau); color: #fff; font-weight: 700; font-size: 1.0625rem; letter-spacing: 0.02em; }
.astral-beitrag-meta__text { display: flex; flex-direction: column; line-height: 1.3; }
.astral-beitrag-meta__name { font-weight: 700; color: var(--astral-tinte); }
.astral-beitrag-meta__funktion,
.astral-beitrag-meta__datum { font-size: 0.9375rem; color: var(--astral-grau); }
.astral-beitrag-meta--kompakt { margin: 0; gap: 0.6rem; }
.astral-beitrag-meta--kompakt .astral-autor-bild { width: 36px; height: 36px; font-size: 0.875rem; }
.astral-beitrag-meta--kompakt .astral-beitrag-meta__name { font-size: 0.9375rem; }
.astral-beitrag-meta--kompakt .astral-beitrag-meta__datum { font-size: 0.875rem; }

/* Einzelbeitrag */
.astral-beitrag .wp-block-post-title { font-size: var(--wp--preset--font-size--xx-large); margin-top: 0.25rem; }
.astral-beitrag-bild img { border-radius: var(--astral-radius); }
.astral-beitrag .wp-block-post-content { font-size: 1.1875rem; }
.astral-beitrag .wp-block-post-content h2 { margin-top: 2.25rem; font-size: 1.625rem; }
.astral-schlagworte { margin-top: 2rem; color: var(--astral-grau); }
.astral-schlagworte a { display: inline-block; margin: 0.15rem 0.2rem; padding: 0.15rem 0.7rem; border-radius: 999px; background: var(--astral-blau-hell); color: var(--astral-blau-dunkel); text-decoration: none; font-weight: 600; font-size: 0.9375rem; }
.astral-autor-box { margin-top: 2rem; padding: 1.5rem; background: var(--astral-blau-hell); border-left: 4px solid var(--astral-blau); border-radius: 0 var(--astral-radius) var(--astral-radius) 0; }
.astral-autor-box .astral-beitrag-meta { margin-top: 0; }
.astral-autor-box p { margin-bottom: 0; }

/* Teaser (Bewertungen, Nachfolge) */
.astral-teaser { height: 100%; padding: 2rem; border-radius: var(--astral-radius); border: 1px solid var(--astral-linie); }
.astral-teaser h3 { margin-top: 0.25rem; }
.astral-teaser--kompass { background: var(--astral-blau-hell); border-color: transparent; }
.astral-teaser--nachfolge { padding-top: 0; overflow: hidden; }
.astral-teaser-bild { display: block; width: calc(100% + 4rem); max-width: none; height: 220px; margin: 0 -2rem 1.5rem; object-fit: cover; object-position: center 35%; }
.astral-sterne-beispiel { display: grid; gap: 0.6rem; margin: 1.25rem 0; padding: 1.1rem 1.25rem; background: #fff; border-radius: var(--astral-radius); }
.astral-sterne-beispiel div { display: flex; justify-content: space-between; align-items: center; gap: 1rem; font-weight: 600; }
.astral-sterne {
	--p: calc(var(--wert, 0) / 5 * 100%);
	display: inline-block;
	flex: none;
	width: 7.5rem;
	height: 1.35rem;
	background: linear-gradient(90deg, #F2B01E var(--p), #D9E1E8 var(--p));
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.9 6.6 7.1.6-5.4 4.7 1.6 7L12 17.3 5.8 21l1.6-7L2 9.2l7.1-.6z'/%3E%3C/svg%3E") left center / 1.5rem 1.35rem repeat-x;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.9 6.6 7.1.6-5.4 4.7 1.6 7L12 17.3 5.8 21l1.6-7L2 9.2l7.1-.6z'/%3E%3C/svg%3E") left center / 1.5rem 1.35rem repeat-x;
}

/* Kontaktband (blau, mit Diagonale wie im E-Mail-Banner) */
.astral-kontakt-band {
	position: relative;
	overflow: hidden;
	padding-top: var(--wp--preset--spacing--50);
	padding-bottom: var(--wp--preset--spacing--50);
	color: #fff;
}
.astral-kontakt-band::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 52%;
	width: 18px;
	background: rgba(255, 255, 255, 0.28);
	transform: skewX(-24deg);
}
.astral-kontakt-band::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: calc(52% + 32px);
	width: 5px;
	background: rgba(255, 255, 255, 0.5);
	transform: skewX(-24deg);
}
.astral-kontakt-band > * { position: relative; z-index: 1; }
.astral-kontakt-band h2 { color: #fff; margin: 0.35rem 0; }
.astral-kontakt-band-klein { margin: 0; font-size: 1.25rem; font-weight: 600; }

.astral-signatur { padding-left: 1rem; border-left: 4px solid var(--astral-blau); line-height: 1.55; }
.astral-signatur p { margin: 0; }
.astral-signatur--karte { padding: 1.4rem 1.6rem; background: #fff; color: var(--wp--preset--color--fliesstext); border-radius: 0 var(--astral-radius) var(--astral-radius) 0; box-shadow: var(--wp--preset--shadow--hoch); border-left-width: 6px; border-left-color: var(--astral-blau-dunkel); }
.astral-signatur--karte .wp-block-buttons { margin-top: 1rem; }

/* Seitenkopf für Unterseiten */
.astral-seitenkopf .wp-block-post-title,
.astral-seitenkopf .wp-block-query-title { margin: 0.25rem 0 0.75rem; }
.astral-seitenkopf-text,
.astral-seitenkopf .wp-block-post-excerpt__excerpt { box-sizing: border-box; padding-right: max(0px, calc(100% - 46rem)); font-size: var(--wp--preset--font-size--large); color: var(--astral-grau); margin: 0; }

/* Fußbereich ---------------------------------------------------------------- */
.astral-fuss { font-size: 1rem; }
.astral-fuss .astral-logo img { width: 200px; margin-bottom: 1rem; }
.astral-fuss-titel { margin: 0 0 0.75rem; font-size: 0.875rem !important; letter-spacing: 0.14em; text-transform: uppercase; color: var(--astral-blau-dunkel); }
.astral-fuss-liste { list-style: none; padding: 0; margin: 0; }
.astral-fuss-liste li { margin: 0.3rem 0; }
.astral-fuss a { color: var(--wp--preset--color--fliesstext); text-decoration: none; }
.astral-fuss a:hover { color: var(--astral-blau-dunkel); text-decoration: underline; }
.astral-fuss-unten { margin-top: var(--wp--preset--spacing--40); border-top: 1px solid var(--astral-blau-zart); color: var(--astral-grau); }
.astral-fuss-unten p { margin: 0; }
.astral-fuss-recht { gap: 1rem; align-items: center; }
.astral-login a::before { content: "🔒 "; }

/* Handy-Leiste */
.astral-handy-leiste { display: none; }

/* Responsiv ---------------------------------------------------------------- */
@media (max-width: 1100px) {
	.astral-kopf-rueckruf { display: none !important; }
}
@media (max-width: 781px) {
	.astral-topbar { display: none; }
	h1, h2, .astral-held-titel { hyphens: auto; -webkit-hyphens: auto; overflow-wrap: break-word; }
	.astral-held-titel { font-size: 2.125rem !important; }
	.astral-kennzahlen { grid-template-columns: 1fr 1fr !important; }
	.astral-kennzahlen strong { font-size: 1.5rem; }
	.astral-thema { padding: 1rem 1rem 1rem 4.4rem; }
	.astral-thema::before { position: absolute; left: 1rem; top: 1rem; width: 2.6rem; height: 2.6rem; margin: 0; }
	.astral-thema::after { left: 1.6rem; top: 1.6rem; width: 1.4rem; height: 1.4rem; }
	.astral-thema h3 { font-size: 1.125rem; }
	.astral-thema p { font-size: 0.9375rem; }
	.astral-kopf { border-bottom: 4px solid var(--astral-blau); }
	.astral-menue-leiste { position: absolute; top: 0; right: 0; height: calc(1.8rem + 48px); display: flex; align-items: center; border: 0 !important; background: transparent !important; }
	.astral-kopf-telefon,
	.astral-kopf-cta { display: none !important; }
	.astral-menue-leiste .wp-block-navigation { justify-content: flex-end; }
	.astral-kopf { position: relative; }
	.astral-held::before { width: 100%; height: 38%; top: auto; bottom: 0; right: 0; clip-path: polygon(0 35%, 100% 0, 100% 100%, 0 100%); }
	.astral-video-platzhalter img { aspect-ratio: 4 / 3; }
	.astral-kontakt-band::before,
	.astral-kontakt-band::after { display: none; }
	body { padding-bottom: 64px; }
	.astral-handy-leiste {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 0.5rem;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 50;
		padding: 0.5rem 0.75rem calc(0.5rem + env(safe-area-inset-bottom));
		background: #fff;
		box-shadow: 0 -4px 18px rgba(0, 63, 114, 0.15);
	}
	.astral-handy-leiste a {
		display: block;
		padding: 0.75rem;
		border-radius: 4px;
		text-align: center;
		font-weight: 700;
		font-size: 1.1875rem;
		text-decoration: none;
		background: var(--astral-blau);
		color: #fff;
	}
	.astral-handy-leiste a:first-child { background: var(--astral-blau-hell); color: var(--astral-blau-dunkel); }
}
@media (prefers-reduced-motion: reduce) {
	.astral-thema,
	.astral-beitrag-karte { transition: none; }
	.astral-thema:hover,
	.astral-beitrag-karte:hover { transform: none; }
}

/* ==========================================================================
   Themenseiten
   ========================================================================== */

/* Banner wie in der Kfz-E-Mail: blaue Fläche links, schräger Übergang ins Foto/Video */
.astral-ohne-titel > .wp-block-post-content > .alignfull:first-child { margin-top: 0; }
.astral-themenbanner {
	position: relative;
	overflow: hidden;
	min-height: clamp(380px, 38vw, 520px);
	display: flex;
	align-items: center;
	background: var(--astral-blau);
	color: #fff;
}
.astral-themenbanner__medien {
	z-index: 0;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 62%;
	margin: 0 !important;
	max-width: none !important;
}
.astral-themenbanner__medien img,
.astral-themenbanner__video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 70% center;
}
.astral-themenbanner__video { opacity: 0; transition: opacity 0.8s ease; }
.astral-themenbanner__video.laeuft { opacity: 1; }
.astral-themenbanner::before {
	/* blaue Fläche mit Diagonale über dem linken Bildrand */
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: calc(38% + 12vw);
	background: var(--astral-blau);
	clip-path: polygon(0 0, 100% 0, calc(100% - 12vw) 100%, 0 100%);
	z-index: 1;
}
.astral-themenbanner::after {
	/* helle Linie parallel zur Diagonale (liegt unter der blauen Fläche, nur der Rand ist sichtbar) */
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: calc(38% + 12vw + 7px);
	background: rgba(255, 255, 255, 0.85);
	clip-path: polygon(0 0, 100% 0, calc(100% - 12vw) 100%, 0 100%);
	z-index: 0;
	pointer-events: none;
}
.astral-themenbanner > .astral-themenbanner__text { position: relative; z-index: 2; width: 100%; padding: var(--wp--preset--spacing--50) 0; }
.astral-themenbanner__text > * { max-width: 32rem; }
.astral-themenbanner h1 { margin: 0.4rem 0 0.75rem; color: #fff; font-size: clamp(2rem, 3.4vw, 2.875rem); line-height: 1.12; }
.astral-themenbanner__klein { margin: 0; font-size: 1.25rem; font-weight: 500; }
.astral-themenbanner__preis { margin: 0 0 1.25rem; font-size: 1.375rem; }
.astral-themenbanner__preis strong { font-size: 2rem; }
.astral-video-pause {
	position: absolute;
	right: 1rem;
	bottom: 1rem;
	z-index: 3;
	padding: 0.35rem 0.8rem;
	border: 0;
	border-radius: 999px;
	background: rgba(24, 32, 44, 0.6);
	color: #fff;
	font: inherit;
	font-size: 0.875rem;
	cursor: pointer;
}

/* Kurz erklärt */
.astral-kurz { padding: 1.4rem 1.6rem; background: var(--astral-blau-hell); border-left: 4px solid var(--astral-blau); border-radius: 0 var(--astral-radius) var(--astral-radius) 0; }
.astral-kurz p:last-child { margin-bottom: 0; }
.astral-abschnitt--eng { padding-top: var(--wp--preset--spacing--50); padding-bottom: var(--wp--preset--spacing--50); }
.astral-seiten-kontakt p { margin: 0 0 0.75rem; }

/* Preisbox wie „Voilà – der Preis“ */
.astral-preis-zeile span:last-child { text-align: right; }
.astral-preisbox {
	display: grid;
	grid-template-columns: minmax(12rem, 1fr) 2fr;
	gap: 2rem;
	padding: 2rem;
	background: #fff;
	border-radius: var(--astral-radius);
	box-shadow: var(--astral-schatten);
}
.astral-preisbox__titel { display: flex; flex-direction: column; align-items: center; text-align: center; }
.astral-praesentator { display: block; width: min(100%, 250px); height: auto; padding-top: 1rem; }
/* mittig im freien Platz unter dem Text; höhere Spezifität, weil WordPress beim letzten Element margin-bottom: 0 setzt */
.astral-preisbox__titel > .astral-praesentator { margin-top: auto; margin-bottom: auto; }
.astral-preisbox__titel h2 { margin: 0.5rem 0; font-size: clamp(1.875rem, 3vw, 2.5rem); line-height: 1.15; }
.astral-preisbox__titel p { color: var(--astral-grau); }
.astral-preisbox__inhalt > * + * { margin-top: 1rem; }
.astral-preis--weiss { background: var(--astral-blau-hell); }
/* Alternativangebot: gleicher Aufbau wie der Hauptpreis, in Grün; geänderte Werte fett */
.astral-preis--alternative { background: var(--astral-gruen-hell); }
.astral-preis--alternative .astral-kasten-label { color: var(--astral-gruen); }
.astral-preis--alternative .astral-preis-betrag { color: var(--astral-gruen); }
.astral-preis--alternative .astral-preis-zeile { border-top-color: #D3E4BF; }
.astral-preis-zeile strong { color: var(--astral-tinte); }
.astral-vorteil--block { display: block; }
.astral-vorteil--block .astral-kasten-label { margin-bottom: 0.3rem; }
.astral-vorteil-text { margin: 0; font-size: 1.25rem; color: var(--astral-tinte); }
.astral-vorteil-text strong { font-size: 2rem; color: var(--astral-gruen); }
.astral-vorteil-text small { font-size: 1rem; color: var(--astral-grau); }
.astral-rechnung { padding: 0.9rem 1.2rem; border: 1px solid var(--astral-linie); border-radius: var(--astral-radius); }
.astral-rechnung summary { cursor: pointer; font-weight: 700; color: var(--astral-blau-dunkel); }
.astral-rechnung table { width: 100%; margin-top: 0.75rem; border-collapse: collapse; font-size: 1rem; }
.astral-rechnung td { padding: 0.35rem 0; border-top: 1px solid var(--astral-linie); }
.astral-rechnung td:last-child { text-align: right; white-space: nowrap; }
.astral-rechnung__summe td { font-weight: 700; color: var(--astral-tinte); }
.astral-annehmen { align-items: center; padding-top: 0.5rem; }
.astral-annehmen__frage { margin: 0; font-size: 1.5rem; font-weight: 700; color: var(--astral-tinte); }
.astral-annehmen__frage span { color: var(--astral-blau); }
.astral-kleingedruckt { max-width: 1200px; margin: 1.25rem auto 0 !important; font-size: 0.875rem; color: var(--astral-grau); }

/* Listen */
.astral-haken--spalten { columns: 3 16rem; column-gap: 2rem; margin-top: 1.5rem; }
.astral-haken--spalten li { break-inside: avoid; }
.astral-kreuz { list-style: none; padding-left: 0; }
.astral-kreuz li { position: relative; padding-left: 1.9rem; margin: 0.5rem 0; }
.astral-kreuz li::before,
.astral-kreuz li::after {
	content: "";
	position: absolute;
	left: 0.35rem;
	top: 0.8em;
	width: 0.9rem;
	height: 2px;
	background: #B3403A;
	transform: rotate(45deg);
}
.astral-kreuz li::after { transform: rotate(-45deg); }
.astral-haken li { margin: 0.5rem 0; }

/* Kästen-Varianten */
.astral-beispiele { gap: 1rem !important; margin-top: var(--wp--preset--spacing--30) !important; }
.astral-kasten--rahmen { border: 1px solid var(--astral-linie); }
.astral-kasten--blau { background: var(--astral-blau-hell); }
.astral-hinweis-zeile { margin-top: 1.5rem; padding: 0.9rem 1.2rem; background: var(--astral-gruen-hell); border-radius: var(--astral-radius); color: var(--astral-tinte); font-weight: 600; }

/* FAQ */
.astral-faq { margin: 0 0 0.75rem; padding: 1rem 1.25rem; background: #fff; border: 1px solid var(--astral-linie); border-radius: var(--astral-radius); }
.astral-faq summary { cursor: pointer; font-weight: 700; font-size: 1.125rem; color: var(--astral-tinte); list-style: none; padding-right: 2rem; position: relative; }
.astral-faq summary::-webkit-details-marker { display: none; }
.astral-faq summary::after { content: "+"; position: absolute; right: 0; top: -0.1rem; font-size: 1.5rem; color: var(--astral-blau); }
.astral-faq[open] summary::after { content: "–"; }
.astral-faq[open] { border-color: var(--astral-blau); }
.astral-faq p { margin: 0.75rem 0 0; }

/* Autor-Zeile auf Themenseiten */
.astral-autor-box p { display: flex; align-items: center; gap: 0.9rem; flex-wrap: wrap; }

@media (max-width: 781px) {
	.astral-themenbanner { display: block; min-height: 0; }
	.astral-themenbanner__medien { position: relative; width: auto; height: 220px; margin: 0 calc(-1 * var(--wp--style--root--padding-left)) !important; }
	.astral-themenbanner::before,
	.astral-themenbanner::after { display: none; }
	.astral-themenbanner > .astral-themenbanner__text { padding: 1.5rem 0 2rem; }
	.astral-preisbox { grid-template-columns: 1fr; padding: 1.25rem; gap: 1rem; }
	.astral-annehmen__frage { font-size: 1.25rem; }
	.astral-praesentator { width: 150px; }
}
@media (prefers-reduced-motion: reduce) {
	.astral-themenbanner__video { display: none; }
}

/* ==========================================================================
   Galerie „Echte Fotos aus unserem Arbeitsalltag“ + Großansicht
   ========================================================================== */
.astral-galerie.wp-block-gallery { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); gap: 0.75rem !important; margin-top: var(--wp--preset--spacing--30); }
.astral-galerie.wp-block-gallery > .wp-block-image { width: auto !important; margin: 0 !important; }
.astral-galerie.wp-block-gallery > .wp-block-image a,
.astral-galerie.wp-block-gallery > .wp-block-image img { width: 100% !important; height: auto !important; }
.astral-galerie .wp-block-image { position: relative; border-radius: var(--astral-radius); overflow: hidden; background: var(--astral-blau-hell); }
.astral-galerie .wp-block-image a { display: block; cursor: zoom-in; }
.astral-galerie .wp-block-image img { aspect-ratio: 4 / 3; object-fit: cover; transition: transform 0.25s ease; }
.astral-galerie .wp-block-image:hover img,
.astral-galerie .wp-block-image a:focus-visible img { transform: scale(1.04); }
.astral-galerie .wp-block-image a::after {
	/* Lupe als Hinweis „zum Vergrößern antippen“ */
	content: "";
	position: absolute;
	right: 0.6rem;
	bottom: 0.6rem;
	width: 2.2rem;
	height: 2.2rem;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230069A3' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6'/%3E%3Cpath d='M15 15l5 5M10.5 8v5M8 10.5h5'/%3E%3C/svg%3E") center / 1.2rem no-repeat;
	box-shadow: 0 2px 8px rgba(0, 63, 114, 0.2);
}
.astral-galerie figcaption.wp-element-caption { display: none !important; } /* Erläuterung erscheint in der Großansicht */
.astral-galerie .wp-block-image::before { display: none !important; } /* Unschärfe-Streifen von WordPress für Bildtexte */
.astral-galerie-hinweis { color: var(--astral-grau); font-size: 1rem; }

.astral-lightbox { width: min(1100px, 94vw); max-height: 94vh; padding: 0; border: 0; border-radius: var(--astral-radius); background: #fff; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45); overflow: hidden; }
.astral-lightbox::backdrop { background: rgba(10, 20, 35, 0.82); }
.astral-lightbox__bild { display: block; width: 100%; max-height: 72vh; object-fit: contain; background: #0d1622; }
.astral-lightbox__text { display: flex; gap: 1rem; align-items: flex-start; justify-content: space-between; padding: 1rem 1.25rem 1.1rem; border-left: 5px solid var(--astral-blau); }
.astral-lightbox__text p { margin: 0; font-size: 1.0625rem; color: var(--wp--preset--color--fliesstext); }
.astral-lightbox__zaehler { flex: none; font-size: 0.875rem; color: var(--astral-grau); white-space: nowrap; }
.astral-lightbox button { position: absolute; border: 0; border-radius: 50%; width: 2.75rem; height: 2.75rem; background: rgba(255, 255, 255, 0.92); color: var(--astral-tinte); font-size: 1.5rem; line-height: 1; cursor: pointer; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25); }
.astral-lightbox__zu { top: 0.75rem; right: 0.75rem; }
.astral-lightbox__zurueck,
.astral-lightbox__weiter { top: calc(min(36vh, 35vw) - 1.4rem); } /* Bildmitte, auch auf dem Handy */
.astral-lightbox__zurueck { left: 0.75rem; }
.astral-lightbox__weiter { right: 0.75rem; }
.astral-lightbox button:hover { background: #fff; color: var(--astral-blau-dunkel); }
@media (prefers-reduced-motion: reduce) {
	.astral-galerie .wp-block-image img { transition: none; }
}

.astral-galerie-abschnitt { margin-top: var(--wp--preset--spacing--50) !important; }

/* ---------- Schaden melden: Anleitung mit Bildern ---------- */
.astral-tutorial { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: var(--wp--preset--spacing--40, 1.5rem); counter-reset: none; }
.astral-tutorial__schritt { background: #fff; border-radius: var(--astral-radius); box-shadow: var(--astral-schatten); overflow: hidden; display: flex; flex-direction: column; }
.astral-tutorial__schritt figure { margin: 0; aspect-ratio: 4 / 3; background: var(--astral-blau-hell); }
.astral-tutorial__schritt img { display: block; width: 100%; height: 100%; object-fit: cover; }
.astral-tutorial__schritt h3 { margin: 1rem 1.25rem 0.4rem; font-size: 1.2rem; color: var(--astral-tinte); }
.astral-tutorial__schritt p { margin: 0 1.25rem 1.25rem; color: var(--astral-grau); }
.astral-vergleich { display: grid; grid-template-columns: 1fr 1fr; gap: var(--wp--preset--spacing--40, 1.5rem); margin-top: 2rem; }
.astral-vergleich__bild { margin: 0; background: #fff; border-radius: var(--astral-radius); overflow: hidden; border: 3px solid; position: relative; }
.astral-vergleich__bild img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.astral-vergleich__bild figcaption { padding: 0.9rem 1.2rem 1.1rem; color: var(--astral-tinte); }
.astral-vergleich__bild::before { z-index: 2; position: absolute; top: 0.75rem; left: 0.75rem; width: 3rem; height: 3rem; border-radius: 50%; display: grid; place-items: center; font-size: 1.8rem; font-weight: 700; color: #fff; line-height: 1; }
.astral-vergleich__bild--falsch { border-color: #C0392B; }
.astral-vergleich__bild--falsch::before { content: "✕"; background: #C0392B; }
.astral-vergleich__bild--falsch img { filter: saturate(0.6); }
.astral-vergleich__bild--richtig { border-color: var(--astral-gruen); }
.astral-vergleich__bild--richtig::before { content: "✓"; background: var(--astral-gruen); }
@media (max-width: 781px) { .astral-vergleich { grid-template-columns: 1fr; } }

/* ---------- Schaden melden: Formular ---------- */
.astral-schaden { background: #fff; border-radius: var(--astral-radius); box-shadow: var(--astral-schatten); padding: clamp(1.25rem, 3vw, 2.25rem); }
.astral-schaden fieldset { border: 0; margin: 0 0 1.75rem; padding: 0; min-width: 0; }
.astral-schaden legend { display: flex; align-items: center; gap: 0.6rem; font-size: 1.25rem; font-weight: 700; color: var(--astral-tinte); margin-bottom: 1rem; }
.astral-schaden__schritt { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--astral-blau); color: #fff; font-size: 1rem; }
.astral-schaden__kacheln { display: grid; grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr)); gap: 0.75rem; }
.astral-schaden__kachel { position: relative; display: flex; flex-direction: column; gap: 0.3rem; padding: 1rem; border: 2px solid var(--astral-linie); border-radius: var(--astral-radius); background: var(--astral-blau-hell); cursor: pointer; transition: border-color 0.15s, background 0.15s; }
.astral-schaden__kachel:hover { border-color: var(--astral-blau); }
.astral-schaden__kachel input { position: absolute; opacity: 0; pointer-events: none; }
.astral-schaden__kachel svg { width: 2.2rem; height: 2.2rem; color: var(--astral-blau-dunkel); }
.astral-schaden__kachel-titel { font-weight: 700; color: var(--astral-tinte); line-height: 1.25; }
.astral-schaden__kachel-hinweis { font-size: 0.875rem; color: var(--astral-grau); line-height: 1.35; }
.astral-schaden__kachel:has(input:checked) { border-color: var(--astral-blau); background: #fff; box-shadow: 0 0 0 3px var(--astral-blau-zart); }
.astral-schaden__kachel:has(input:focus-visible) { outline: 3px solid var(--astral-blau-dunkel); outline-offset: 2px; }
.astral-schaden__rest { display: none; }
.astral-schaden__rest.ist-aktiv { display: block; }
.astral-schaden__raster { display: grid; grid-template-columns: 1fr 1fr; gap: 0.25rem 1.25rem; }
.astral-schaden__raster + .astral-schaden__raster { margin-top: 0.25rem; }
.astral-schaden__raster[hidden] { display: none; }
.astral-schaden__raster p { margin: 0 0 0.75rem; }
.astral-schaden__breit { grid-column: 1 / -1; }
.astral-schaden label { display: block; font-weight: 600; font-size: 0.95rem; color: var(--astral-tinte); margin-bottom: 0.3rem; }
.astral-schaden input[type="text"], .astral-schaden input[type="email"], .astral-schaden input[type="tel"], .astral-schaden input[type="date"], .astral-schaden input[type="time"], .astral-schaden select, .astral-schaden textarea { width: 100%; box-sizing: border-box; padding: 0.65rem 0.8rem; border: 1px solid #B8C4CF; border-radius: 6px; font: inherit; font-size: 1rem; background: #fff; color: var(--astral-tinte); }
.astral-schaden textarea { resize: vertical; }
.astral-schaden input:focus, .astral-schaden select:focus, .astral-schaden textarea:focus { outline: 2px solid var(--astral-blau); outline-offset: 1px; border-color: var(--astral-blau); }
.astral-schaden.ist-geprueft :invalid, .ist-geprueft .astral-schaden :invalid, form.ist-geprueft :invalid { border-color: #C0392B; }
.astral-schaden__foto-tipp { margin: 0 0 1rem; padding: 0.8rem 1rem; background: var(--astral-gruen-hell); border-radius: var(--astral-radius); color: var(--astral-tinte); }
.astral-schaden__upload input[type="file"] { position: absolute; width: 1px; height: 1px; opacity: 0; }
.astral-schaden__dropzone { display: flex !important; flex-direction: column; align-items: center; gap: 0.35rem; padding: 1.75rem 1rem; border: 2px dashed var(--astral-blau); border-radius: var(--astral-radius); background: var(--astral-blau-hell); text-align: center; cursor: pointer; }
.astral-schaden__dropzone:hover, .astral-schaden__upload input:focus-visible + .astral-schaden__dateiliste { background: #fff; }
.astral-schaden__upload:focus-within .astral-schaden__dropzone { outline: 3px solid var(--astral-blau-dunkel); outline-offset: 2px; }
.astral-schaden__dropzone-titel { font-weight: 700; color: var(--astral-blau-dunkel); font-size: 1.05rem; }
.astral-schaden__dropzone-hinweis { font-weight: 400; font-size: 0.875rem; color: var(--astral-grau); }
.astral-schaden__dateiliste { list-style: none; margin: 0.75rem 0 0; padding: 0; }
.astral-schaden__dateiliste li { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 0.45rem 0; border-bottom: 1px solid var(--astral-linie); font-size: 0.95rem; }
.astral-schaden__dateiliste button { border: 0; background: none; color: #C0392B; font: inherit; font-size: 0.875rem; cursor: pointer; text-decoration: underline; }
.astral-schaden__dateifehler, .astral-schaden__fehler { margin: 0.75rem 0; padding: 0.75rem 1rem; border-radius: var(--astral-radius); background: #FDECEA; color: #8E2A20; font-weight: 600; }
.astral-schaden__einwilligung label { display: flex; gap: 0.6rem; align-items: flex-start; font-weight: 400; margin-bottom: 0.75rem; }
.astral-schaden__einwilligung input { margin-top: 0.3rem; flex: none; width: 1.1rem; height: 1.1rem; }
.astral-schaden__senden { font-size: 1.1rem; padding: 0.9rem 2rem; }
.astral-schaden__senden:disabled { opacity: 0.7; cursor: wait; }
.astral-schaden__klein { font-size: 0.875rem; color: var(--astral-grau); }
.astral-schaden__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.astral-schaden--danke { border-left: 6px solid var(--astral-gruen); }
.astral-schaden--danke h3 { margin-top: 0; }
@media (max-width: 781px) { .astral-schaden__raster { grid-template-columns: 1fr; } }
.astral-schaden .astral-schaden__kachel { display: flex; flex-direction: column; align-items: flex-start; margin: 0; font-weight: 400; font-size: 1rem; }
.astral-schaden .astral-schaden__kachel-titel { display: block; font-weight: 700; }
.astral-schaden .astral-schaden__kachel-hinweis { display: block; }

/* ---------- Über uns ---------- */
.astral-ueber-bild { margin: 0; border-radius: var(--astral-radius); overflow: hidden; box-shadow: var(--astral-schatten); max-width: 26rem; margin-inline: auto; }
.astral-ueber-bild img { display: block; width: 100%; height: auto; }

/* Leistungsvergleich (z. B. Wohngebäude): zwei Tarife nebeneinander */
.astral-leistungstabelle-wrap { overflow-x: auto; margin-top: var(--wp--preset--spacing--40, 1.5rem); border-radius: var(--astral-radius); background: #fff; box-shadow: 0 8px 24px rgba(0, 63, 114, 0.08); }
.astral-leistungstabelle { width: 100%; border-collapse: collapse; font-size: 0.98rem; min-width: 34rem; }
.astral-leistungstabelle th, .astral-leistungstabelle td { padding: 0.7rem 1rem; text-align: left; border-bottom: 1px solid #E3EDF5; vertical-align: top; }
.astral-leistungstabelle thead th { background: #0069A3; color: #fff; font-size: 1.05rem; position: sticky; top: 0; }
.astral-leistungstabelle thead th.ist-empfohlen { background: #507C24; }
.astral-leistungstabelle tbody th[scope="row"] { font-weight: 400; width: 46%; }
.astral-leistungstabelle td { width: 27%; }
.astral-leistungstabelle td.ist-empfohlen { background: #F4F8EE; }
.astral-leistungstabelle__gruppe th { background: #EFF8FD; color: #003F72; font-weight: 700; font-size: 0.85rem; letter-spacing: 0.06em; text-transform: uppercase; }
.astral-leistungstabelle tbody tr:not(.astral-leistungstabelle__gruppe):hover { background: #FAFCFE; }
@media (max-width: 600px) { .astral-leistungstabelle th, .astral-leistungstabelle td { padding: 0.55rem 0.6rem; font-size: 0.9rem; } }

/* Anfrage- und Rückrufformular */
.astral-anfrage__anliegen { border: 0; padding: 0; margin: 0 0 1rem; display: flex; flex-wrap: wrap; gap: .6rem; }
.astral-anfrage__anliegen legend { font-weight: 700; margin-bottom: .5rem; padding: 0; }
.astral-anfrage__anliegen label { display: inline-flex; align-items: center; gap: .5rem; padding: .6rem 1rem; border: 2px solid #D5E3EE; border-radius: 999px; background: #fff; cursor: pointer; font-weight: 600; }
.astral-anfrage__anliegen label:has(input:checked) { border-color: #008DD2; background: #EFF8FD; color: #003F72; }
.astral-anfrage [data-nur][hidden] { display: none; }

/* Angebotsliste (Übersichtsseiten): quadratisches Bild, Titel, Text, Link – untereinander */
.astral-angebotsliste { list-style: none; margin: 1.5rem 0 2.5rem; padding: 0; }
.astral-angebotsliste__eintrag { display: grid; grid-template-columns: 9rem 1fr; gap: 1.5rem; align-items: start; padding: 1.25rem 0; border-top: 1px solid #DCE6EF; }
.astral-angebotsliste__eintrag:last-child { border-bottom: 1px solid #DCE6EF; }
.astral-angebotsliste__bild { display: block; width: 9rem; aspect-ratio: 1; border-radius: var(--astral-radius, 10px); overflow: hidden; background: #EFF8FD; }
.astral-angebotsliste__bild img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.astral-angebotsliste__eintrag:hover .astral-angebotsliste__bild img { transform: scale(1.05); }
.astral-angebotsliste__platzhalter { display: grid; place-items: center; width: 100%; height: 100%; font-size: 2rem; font-weight: 700; color: #fff; background: linear-gradient(135deg, #003F72, #008DD2); }
.astral-angebotsliste__text h3 { margin: 0 0 .35rem; font-size: 1.3rem; }
.astral-angebotsliste__text h3 a { color: inherit; text-decoration: none; }
.astral-angebotsliste__text h3 a:hover { color: #0069A3; text-decoration: underline; }
.astral-angebotsliste__text p { margin: 0 0 .5rem; }
.astral-angebotsliste__link { font-weight: 700; color: #0069A3; text-decoration: none; }
.astral-angebotsliste__link:hover { text-decoration: underline; }
@media (max-width: 600px) { .astral-angebotsliste__eintrag { grid-template-columns: 5.5rem 1fr; gap: 1rem; } .astral-angebotsliste__bild { width: 5.5rem; } .astral-angebotsliste__platzhalter { font-size: 1.4rem; } }

/* Vermögensschadenhaftpflicht: Pyramide, Vertrauensband, Berufsliste */
.astral-pyramide { margin: 0; }
.astral-pyramide img, .astral-pyramide svg { display: block; width: 100%; max-width: 100%; height: auto; }
.astral-vertrauensband { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: 1.5rem; padding: 1.75rem; background: var(--astral-blau-hell); border-radius: var(--astral-radius); }
.astral-vertrauensband__teil { display: flex; gap: 1.25rem; align-items: flex-start; }
.astral-vertrauensband__teil p { margin: 0 0 0.4rem; }
.astral-vertrauensband__teil ul { margin: 0.4rem 0 0; }
.astral-vertrauensband__titel { font-size: var(--wp--preset--font-size--large); font-weight: 700; color: var(--wp--preset--color--logo); }
.astral-vertrauensband__note { display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; }
.astral-vertrauensband__siegel { flex: 0 0 auto; width: 6.5rem; height: 6.5rem; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; line-height: 1.1; }
.astral-vertrauensband__siegel--google { background: #fff; color: var(--astral-blau); font-size: 3rem; font-weight: 700; box-shadow: var(--astral-schatten); }
.astral-vertrauensband__siegel--focus { background: var(--wp--preset--color--logo); color: #fff; border: 4px solid var(--astral-sonne); }
.astral-vertrauensband__siegel--focus span { font-size: 1.15rem; font-weight: 800; letter-spacing: 0.08em; }
.astral-vertrauensband__siegel--focus small { font-size: 0.7rem; margin-top: 0.2rem; }
.astral-berufsliste { columns: 3 15rem; column-gap: 2rem; }
.astral-berufsliste li { break-inside: avoid; margin: 0 0 0.7rem; }
@media (max-width: 600px) { .astral-vertrauensband__siegel { width: 4.75rem; height: 4.75rem; } .astral-vertrauensband__siegel--google { font-size: 2.2rem; } }

/* Rechner mobile Arbeitsmaschinen */
.astral-geraeterechner { background: #fff; border-radius: var(--astral-radius); box-shadow: var(--astral-schatten); padding: clamp(1.25rem, 3vw, 2.25rem); }
.astral-gr-schritt { padding-bottom: 1.25rem; margin-bottom: 1.25rem; border-bottom: 1px solid var(--astral-linie); }
.astral-gr-schritt__nr, .astral-gr-anfrage > summary { display: flex; align-items: center; gap: 0.6rem; font-size: var(--wp--preset--font-size--large); font-weight: 700; color: var(--wp--preset--color--logo); margin: 0 0 0.75rem; }
.astral-gr-schritt__nr span, .astral-gr-anfrage > summary span { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--astral-blau); color: #fff; font-size: 1rem; flex: 0 0 auto; }
.astral-geraeterechner input[type="search"], .astral-geraeterechner input[type="number"] { width: 100%; box-sizing: border-box; padding: 0.65rem 0.8rem; border: 1px solid #B8C4CF; border-radius: 6px; font: inherit; font-size: 1rem; background: #fff; color: var(--astral-tinte); }
.astral-gr-suche { font-size: 1.1rem !important; padding: 0.85rem 1rem !important; border-width: 2px !important; border-color: var(--astral-blau) !important; }
.astral-gr-treffer { list-style: none; margin: 0.5rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); gap: 0.5rem; }
.astral-gr-treffer button { width: 100%; height: 100%; text-align: left; display: flex; flex-direction: column; gap: 0.15rem; padding: 0.6rem 0.8rem; border: 1px solid var(--astral-blau-zart); border-radius: 6px; background: var(--astral-blau-hell); color: var(--astral-tinte); font: inherit; cursor: pointer; }
.astral-gr-treffer button:hover, .astral-gr-treffer button:focus-visible { border-color: var(--astral-blau); background: #fff; outline: none; box-shadow: 0 0 0 2px var(--astral-blau); }
.astral-gr-treffer button span { font-size: 0.85rem; color: var(--astral-grau); }
.astral-gr-positionen { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.astral-gr-position { border: 1px solid var(--astral-blau-zart); border-left: 4px solid var(--astral-blau); border-radius: 6px; padding: 1rem 1rem 0.25rem; }
.astral-gr-position__kopf { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 0.5rem; }
.astral-gr-entfernen { background: none; border: 0; color: var(--astral-blau-dunkel); text-decoration: underline; cursor: pointer; font: inherit; font-size: 0.9rem; }
.astral-gr-position__hinweis { font-size: 0.9rem; color: var(--astral-grau); margin: 0 0 0.75rem; }
.astral-gr-position__hinweis--anfrage { color: #8a5a00; font-weight: 600; }
.astral-gr-felder { grid-template-columns: repeat(3, 1fr); }
.astral-gr-position__beitrag { font-weight: 600; color: var(--astral-gruen); margin: 0 0 0.75rem; }
.astral-gr-varianten, .astral-gr-fragen { border: 0; padding: 0; margin: 0.5rem 0 0; }
.astral-gr-varianten legend, .astral-gr-fragen legend { font-weight: 600; margin-bottom: 0.5rem; }
.astral-gr-varianten label { display: flex !important; gap: 0.6rem; align-items: flex-start; font-weight: 400 !important; padding: 0.6rem 0.8rem; border: 1px solid var(--astral-linie); border-radius: 6px; margin-bottom: 0.5rem; cursor: pointer; }
.astral-gr-varianten label:has(input:checked) { border-color: var(--astral-blau); background: var(--astral-blau-hell); }
.astral-gr-varianten input { margin-top: 0.3rem; }
.astral-gr-ergebnis { background: var(--wp--preset--color--gruen-hell); border-radius: var(--astral-radius); padding: 1.25rem 1.5rem; margin-bottom: 1.25rem; transition: opacity .2s; }
.astral-gr-ergebnis.ist-laedt { opacity: 0.6; }
.astral-gr-ergebnis__label { margin: 0; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.8rem; color: var(--astral-gruen); }
.astral-gr-ergebnis__betrag { margin: 0.2rem 0; font-size: clamp(2rem, 5vw, 2.75rem); font-weight: 800; color: var(--astral-gruen); line-height: 1.1; }
.astral-gr-ergebnis__betrag small { font-size: 1rem; font-weight: 600; color: var(--astral-tinte); }
.astral-gr-ergebnis__netto { margin: 0 0 0.75rem; }
.astral-gr-tabelle { width: 100%; border-collapse: collapse; margin: 0.5rem 0 1rem; background: #fff; border-radius: 6px; }
.astral-gr-tabelle td { padding: 0.45rem 0.75rem; border-bottom: 1px solid var(--astral-linie); }
.astral-gr-tabelle td:last-child { text-align: right; white-space: nowrap; }
.astral-gr-tabelle__summe td { font-weight: 700; }
.astral-gr-vergleich__titel { font-weight: 600; margin: 0 0 0.4rem; }
.astral-gr-vergleich { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.5rem; }
.astral-gr-vergleich li { background: #fff; border: 1px solid var(--astral-linie); border-radius: 6px; padding: 0.5rem; text-align: center; display: flex; flex-direction: column; font-size: 0.9rem; }
.astral-gr-vergleich li.ist-aktiv { border: 2px solid var(--astral-gruen); }
.astral-gr-meldung { background: #fff; border-left: 4px solid var(--astral-blau); border-radius: 6px; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.astral-gr-meldung ul { margin: 0.25rem 0; padding-left: 1.2rem; }
.astral-gr-meldung p { margin: 0.25rem 0 0; }
.astral-gr-meldung--anfrage { border-left-color: var(--astral-sonne); }
.astral-gr-anfrage { border: 2px solid var(--astral-blau); border-radius: var(--astral-radius); padding: 1rem 1.25rem; }
.astral-gr-anfrage > summary { cursor: pointer; margin: 0; list-style: none; }
.astral-gr-anfrage > summary::-webkit-details-marker { display: none; }
.astral-gr-anfrage[open] > summary { margin-bottom: 1rem; }
.astral-gr-frage { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; align-items: center; padding: 0.4rem 0; border-bottom: 1px solid var(--astral-linie); }
.astral-gr-frage span { flex: 1 1 18rem; }
.astral-gr-frage label { display: inline-flex !important; gap: 0.35rem; font-weight: 400 !important; margin: 0 !important; }
@media (max-width: 781px) { .astral-gr-felder { grid-template-columns: 1fr; } .astral-gr-vergleich { grid-template-columns: repeat(2, 1fr); } }
/* Einfache zweispaltige Tabelle (Leistungen, Selbstbehalte) */
.astral-tabelle-einfach { margin: 0.5rem 0 1.5rem; }
.astral-tabelle-einfach table { width: 100%; border-collapse: collapse; background: #fff; border-radius: var(--astral-radius); overflow: hidden; box-shadow: 0 8px 24px rgba(0, 63, 114, 0.08); }
.astral-tabelle-einfach th, .astral-tabelle-einfach td { padding: 0.65rem 1rem; text-align: left; border-bottom: 1px solid #E3EDF5; vertical-align: top; }
.astral-tabelle-einfach thead th { background: #0069A3; color: #fff; }
.astral-tabelle-einfach td:last-child { font-weight: 600; }
/* Pfeil neben Überschrift, zeigt auf den Rechner */
.astral-titel-pfeil { gap: 1rem; }
.astral-titel-pfeil h2 { margin: 0; }
.astral-pfeil-runter { flex: 0 0 auto; position: relative; display: inline-block; width: 48px; height: 48px; border-radius: 50%; background: var(--astral-blau); animation: astral-wippen 1.6s ease-in-out infinite; }
.astral-pfeil-runter span { position: absolute; left: 50%; top: 11px; width: 4px; height: 22px; margin-left: -2px; background: #fff; border-radius: 2px; }
.astral-pfeil-runter span::after { content: ""; position: absolute; left: 50%; bottom: -1px; width: 14px; height: 14px; border-right: 4px solid #fff; border-bottom: 4px solid #fff; border-radius: 2px; transform: translateX(-50%) rotate(45deg); }
.astral-pfeil-runter:focus-visible { outline: 3px solid var(--astral-sonne); outline-offset: 3px; }
.astral-pfeil-runter:hover { background: var(--astral-blau-dunkel); }
@keyframes astral-wippen { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(6px); } }
@media (prefers-reduced-motion: reduce) { .astral-pfeil-runter { animation: none; } }

html { scroll-behavior: smooth; }
#geraeterechner { scroll-margin-top: 1.5rem; }

/* Versicherer-Bewertungen */
.astral-daumen { --g: 1.6rem; position: relative; display: inline-block; width: calc(var(--g) * 5); height: var(--g); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-2 -2 28 28'%3E%3Cpath fill='%23D3DCE5' d='M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-2z'/%3E%3C/svg%3E") 0 0 / var(--g) var(--g) repeat-x; vertical-align: middle; flex: 0 0 auto; }
.astral-daumen::after { content: ""; position: absolute; inset: 0 auto 0 0; width: calc(var(--wert) / 5 * 100%); background: var(--bild) 0 0 / var(--g) var(--g) repeat-x; }
.astral-daumen--gruen { --bild: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-2 -2 28 28'%3E%3Cpath fill='%23507C24' d='M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-2z'/%3E%3C/svg%3E"); }
.astral-daumen--gelb { --bild: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-2 -2 28 28'%3E%3Cpath fill='%23B07800' d='M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-2z'/%3E%3C/svg%3E"); }
.astral-daumen--rot { --bild: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-2 -2 28 28'%3E%3Cpath fill='%23B42318' d='M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-2z'/%3E%3C/svg%3E"); }
.astral-daumen--klein { --g: 1.05rem; }
.astral-bew-werkzeug { display: grid; grid-template-columns: minmax(12rem, 1fr) auto auto; gap: 1rem 1.5rem; align-items: end; margin-bottom: 1rem; }
.astral-bew-werkzeug p { margin: 0; }
.astral-bew-werkzeug label { display: block; font-weight: 600; font-size: 0.9rem; margin-bottom: 0.3rem; }
.astral-bew-werkzeug input, .astral-bew-werkzeug select { width: 100%; box-sizing: border-box; padding: 0.6rem 0.8rem; border: 1px solid #B8C4CF; border-radius: 6px; font: inherit; background: #fff; }
.astral-bew-filter { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.astral-bew-filter button { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.55rem 0.85rem; border: 1px solid var(--astral-blau-zart); border-radius: 999px; background: #fff; font: inherit; font-size: 0.9rem; cursor: pointer; color: var(--astral-tinte); }
.astral-bew-filter button[aria-pressed="true"] { background: var(--wp--preset--color--logo); border-color: var(--wp--preset--color--logo); color: #fff; }
.astral-bew-punkt { width: 0.7rem; height: 0.7rem; border-radius: 50%; display: inline-block; }
.astral-bew-punkt--gruen { background: #507C24; } .astral-bew-punkt--gelb { background: #E0A800; } .astral-bew-punkt--rot { background: #B42318; }
.astral-bew-zaehler { color: var(--astral-grau); font-size: 0.95rem; }
.astral-bew-liste { display: grid; gap: 0.6rem; }
.astral-bew { background: #fff; border: 1px solid var(--astral-linie); border-left: 5px solid #C9D3DC; border-radius: var(--astral-radius); }
.astral-bew--gruen { border-left-color: #507C24; } .astral-bew--gelb { border-left-color: #E0A800; } .astral-bew--rot { border-left-color: #B42318; }
.astral-bew > summary { display: grid; grid-template-columns: 1fr auto 2rem; gap: 1rem; align-items: center; padding: 0.9rem 1.1rem; cursor: pointer; list-style: none; }
.astral-bew > summary::-webkit-details-marker { display: none; }
.astral-bew > summary:focus-visible { outline: 3px solid var(--astral-blau); outline-offset: 2px; }
.astral-bew__name strong { display: block; color: var(--astral-tinte); }
.astral-bew__name small { color: var(--astral-grau); }
.astral-bew__note { display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; justify-content: flex-end; }
.astral-bew__note b { font-size: 1.25rem; }
.astral-bew__note em { font-style: normal; font-size: 0.85rem; color: var(--astral-grau); min-width: 12rem; }
.astral-bew__trend { font-size: 1.4rem; font-weight: 700; color: var(--astral-blau-dunkel); text-align: center; }
.astral-bew[open] > summary { border-bottom: 1px solid var(--astral-linie); }
.astral-bew__details { display: grid; grid-template-columns: 3fr 2fr; gap: 1rem 2rem; padding: 1rem 1.1rem 1.2rem; }
.astral-bew__kriterien { list-style: none; margin: 0; padding: 0; }
.astral-bew__kriterien li { display: grid; grid-template-columns: 1fr auto 2.5rem; gap: 0.75rem; align-items: center; padding: 0.35rem 0; border-bottom: 1px solid #EEF2F6; font-size: 0.95rem; }
.astral-bew__kriterien li > b { text-align: right; }
.astral-bew__nb { grid-column: 2 / 4; color: var(--astral-grau); font-size: 0.85rem; text-align: right; }
.astral-bew__fakten { margin: 0; display: grid; gap: 0.6rem; align-content: start; font-size: 0.95rem; }
.astral-bew__fakten dt { font-weight: 700; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--astral-blau-dunkel); }
.astral-bew__fakten dd { margin: 0; }
.astral-bew-ampel { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); gap: 0.75rem; }
.astral-bew-ampel li { background: #fff; border-radius: var(--astral-radius); padding: 0.9rem 1rem; border-left: 5px solid; }
.astral-bew-ampel li:nth-child(1) { border-color: #507C24; } .astral-bew-ampel li:nth-child(2) { border-color: #E0A800; } .astral-bew-ampel li:nth-child(3) { border-color: #B42318; } .astral-bew-ampel li:nth-child(4) { border-color: #C9D3DC; }
@media (max-width: 781px) {
	.astral-bew-werkzeug { grid-template-columns: 1fr; }
	.astral-bew > summary { grid-template-columns: 1fr 1.5rem; }
	.astral-bew__note { grid-column: 1 / 2; justify-content: flex-start; }
	.astral-bew__trend { grid-row: 1; grid-column: 2; }
	.astral-bew__note em { min-width: 0; }
	.astral-bew__details { grid-template-columns: 1fr; }
	.astral-daumen { --g: 1.3rem; }
}
@media (max-width: 600px) {
	.astral-tabelle-einfach thead { display: none; }
	.astral-tabelle-einfach table, .astral-tabelle-einfach tbody, .astral-tabelle-einfach tr, .astral-tabelle-einfach td { display: block; width: auto; }
	.astral-tabelle-einfach tr { border-bottom: 1px solid #E3EDF5; padding: 0.4rem 0; }
	.astral-tabelle-einfach td { border: 0; padding: 0.2rem 1rem; }
}
.astral-bew > summary > *, .astral-bew__details > *, .astral-bew__kriterien li > span { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 600px) { .astral-bew__kriterien li { grid-template-columns: 1fr auto 2rem; gap: 0.5rem; } .astral-bew__details, .astral-bew > summary { padding-left: 0.8rem; padding-right: 0.8rem; } }

/* Geldanlage: Kennzahlen zum Kundendepot */
.astral-kennzahlen { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.75rem; }
.astral-kennzahl { background: #fff; border-radius: var(--astral-radius); padding: 0.9rem 1rem; box-shadow: var(--astral-schatten); }
.astral-kennzahl strong { display: block; font-size: clamp(1.25rem, 2.4vw, 1.6rem); color: var(--wp--preset--color--logo); line-height: 1.2; }
.astral-kennzahl--gruen strong { color: var(--astral-gruen); }
.astral-kennzahl span { font-size: 0.85rem; color: var(--astral-grau); }
.astral-depotbild img { border-radius: var(--astral-radius); box-shadow: var(--astral-schatten); background: #fff; }
.astral-depotbild figcaption { font-size: 0.8rem; color: var(--astral-grau); }
@media (max-width: 420px) { .astral-kennzahlen { grid-template-columns: 1fr; } }
.astral-kennzahl span { display: block; line-height: 1.4; margin-top: 0.25rem; }
/* Grüner Infokasten (z. B. Steuern) */
.astral-steuerkasten { background: var(--wp--preset--color--gruen-hell); border-radius: var(--astral-radius); padding: 1.25rem 1.5rem; margin-top: 1.5rem; }
.astral-steuerkasten h3 { margin-top: 0; color: var(--astral-gruen); }
.astral-steuerkasten .astral-haken li { margin: 0.5rem 0; }
.astral-steuerkasten .astral-kleingedruckt { margin-bottom: 0; }

/* Versicherungs-Lexikon */
.astral-lexikon-suche { position: sticky; top: 0; z-index: 5; background: var(--astral-blau-hell); padding: 1rem 0 0.5rem; margin-bottom: 1rem; }
.astral-lexikon-suche label { display: block; font-weight: 700; margin-bottom: 0.35rem; }
.astral-lexikon-suche input[type="search"] { width: 100%; box-sizing: border-box; padding: 0.85rem 1rem; font: inherit; font-size: 1.1rem; border: 2px solid var(--astral-blau); border-radius: 8px; background: #fff; }
.astral-lexikon-suche input[type="search"]:focus { outline: 3px solid var(--astral-sonne); outline-offset: 1px; }
.astral-lexikon-themen { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0.75rem 0; }
.astral-lexikon-themen button { padding: 0.45rem 0.8rem; border: 1px solid var(--astral-blau-zart); border-radius: 999px; background: #fff; font: inherit; font-size: 0.9rem; cursor: pointer; color: var(--astral-tinte); }
.astral-lexikon-themen button[aria-pressed="true"] { background: var(--wp--preset--color--logo); border-color: var(--wp--preset--color--logo); color: #fff; }
.astral-lexikon-az { display: flex; flex-wrap: wrap; gap: 0.25rem; }
.astral-lexikon-az a { display: inline-grid; place-items: center; min-width: 2rem; height: 2rem; border-radius: 6px; background: #fff; font-weight: 700; text-decoration: none; color: var(--astral-blau-dunkel); border: 1px solid var(--astral-blau-zart); }
.astral-lexikon-az a:hover, .astral-lexikon-az a:focus-visible { background: var(--astral-blau); color: #fff; }
.astral-lexikon-zaehler { margin: 0.5rem 0 0; font-size: 0.9rem; color: var(--astral-grau); }
.astral-lexikon-leer { background: #fff; border-left: 4px solid var(--astral-sonne); padding: 0.75rem 1rem; border-radius: 6px; }
.astral-lexikon__gruppe { margin-bottom: 1.5rem; }
.astral-lexikon__buchstabe { font-size: 2rem; color: var(--astral-blau); border-bottom: 2px solid var(--astral-blau-zart); padding-bottom: 0.25rem; margin: 1.5rem 0 0.75rem; scroll-margin-top: 13rem; }
.astral-lexikon__eintrag { background: #fff; border-radius: var(--astral-radius); padding: 1rem 1.25rem; margin-bottom: 0.6rem; box-shadow: 0 1px 2px rgba(0,63,114,.05); scroll-margin-top: 13rem; }
.astral-lexikon__eintrag h3 { margin: 0 0 0.35rem; font-size: 1.15rem; color: var(--wp--preset--color--logo); }
.astral-lexikon__eintrag p { margin: 0; }
.astral-lexikon__eintrag.ist-titeltreffer { outline: 2px solid var(--astral-blau); }
.astral-lexikon__eintrag[hidden], .astral-lexikon__gruppe[hidden] { display: none; }
.astral-lexikon__thema { margin-top: 0.5rem !important; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--astral-gruen); }
.astral-lexikon__stichworte { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 600px) { .astral-lexikon-suche { position: static; } .astral-lexikon__buchstabe, .astral-lexikon__eintrag { scroll-margin-top: 1rem; } }
.astral-lexikon-az[hidden], .astral-lexikon-leer[hidden] { display: none; }
.astral-lexikon-zaehler a { font-weight: 600; }
.astral-lexikon-az--themen a { padding: 0 0.75rem; font-weight: 600; }
.astral-themenbanner + .wp-block-columns { margin-top: var(--wp--preset--spacing--50, 3rem); }

/* Begriffe zum Verlinken (z. B. Wohngebäude: /wohngebaeudeversicherung/#bauartklasse) */
#begriffe { scroll-margin-top: 3.5rem; }
.astral-begriffe-liste { margin-bottom: var(--wp--preset--spacing--40); }
.astral-begriffe .astral-lexikon__eintrag.astral-begriff { padding: 1.25rem 1.5rem; margin-bottom: 1rem; scroll-margin-top: 1.5rem; }
.astral-begriff > * + * { margin-top: 0.75rem !important; }
.astral-begriff h3 { font-size: 1.25rem; scroll-margin-top: 2.75rem; }
.astral-begriff:has(:target) { outline: 3px solid var(--astral-blau); outline-offset: 2px; animation: astral-begriff-blinken 1.6s ease-out 1; }
@keyframes astral-begriff-blinken { 0% { background: #FFF6D6; } 100% { background: #fff; } }
.astral-begriff__fuss { font-size: 0.875rem; color: var(--astral-grau); }
.astral-begriff__bild img { width: 100%; height: auto; border: 1px solid #E3EDF5; border-radius: var(--astral-radius); }
.astral-begriff__bild figcaption { font-size: 0.875rem; color: var(--astral-grau); }
.astral-begriff .astral-tabelle-einfach { margin: 0.75rem 0; }
.astral-begriff .astral-tabelle-einfach td:not(:first-child) { white-space: nowrap; font-weight: 600; }
@media (prefers-reduced-motion: reduce) { .astral-begriff:has(:target) { animation: none; } }
.astral-begriffe__einleitung { font-size: var(--wp--preset--font-size--large); color: var(--astral-grau); }
.astral-abschnitt > .astral-galerie-abschnitt:first-child { margin-top: 0 !important; } /* kein doppelter Abstand, wenn die Galerie den Abschnitt eröffnet */

/* ---------- Fragebogen Wohngebäude (Schritt für Schritt) ---------- */
.astral-fb { scroll-margin-top: 1rem; }
.astral-fb__fortschritt { margin: 0 0 1.5rem; }
.astral-fb__stand { margin: 0 0 0.5rem; font-weight: 700; color: var(--astral-tinte); }
.astral-fb__balken { height: 8px; border-radius: 4px; background: var(--astral-blau-zart); overflow: hidden; }
.astral-fb__balken span { display: block; height: 100%; width: 0; background: var(--astral-blau); transition: width 0.3s ease; }
.astral-fb__liste { display: flex; flex-wrap: wrap; gap: 0.35rem; list-style: none; margin: 0.9rem 0 0; padding: 0; }
.astral-fb__liste button { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.3rem 0.65rem; border: 1px solid var(--astral-linie); border-radius: 999px; background: #fff; color: var(--astral-grau); font: inherit; font-size: 0.8125rem; cursor: pointer; }
.astral-fb__liste button span { display: inline-grid; place-items: center; min-width: 1.35rem; height: 1.35rem; border-radius: 50%; background: var(--astral-blau-hell); color: var(--astral-blau-dunkel); font-weight: 700; font-size: 0.75rem; }
.astral-fb__liste button.ist-besucht { color: var(--astral-tinte); border-color: var(--astral-blau-zart); }
.astral-fb__liste button[aria-current="step"] { background: var(--astral-blau); border-color: var(--astral-blau); color: #fff; }
.astral-fb__liste button[aria-current="step"] span { background: #fff; }
.astral-fb__kopf { display: flex; gap: 1rem; align-items: flex-start; padding-bottom: 1rem; margin-bottom: 1.25rem; border-bottom: 2px solid var(--astral-blau-zart); }
.astral-fb__kopf h3 { margin: 0 0 0.3rem; font-size: 1.5rem; }
.astral-fb__kopf h3:focus { outline: none; }
.astral-fb__kopf p { margin: 0; color: var(--astral-grau); }
.astral-fb__buchstabe { flex: none; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 8px; background: var(--astral-blau); color: #fff; font-size: 1.4rem; font-weight: 700; }
.astral-fb__bild { display: block; width: 100%; max-width: 560px; height: auto; margin: 0 0 1.25rem; border: 1px solid var(--astral-linie); border-radius: var(--astral-radius); }
.astral-fb__raster { display: grid; grid-template-columns: repeat(6, 1fr); gap: 0.25rem 1rem; align-items: end; }
.astral-fb__feld { margin: 0 0 0.9rem; grid-column: span 3; }
.astral-fb__feld--s { grid-column: span 2; }
.astral-fb__feld--m { grid-column: span 3; }
.astral-fb__feld--l { grid-column: 1 / -1; }
.astral-fb .astral-fb__erkl { font-size: 0.875rem; font-weight: 600; white-space: nowrap; margin-left: 0.35rem; }
.astral-fb__erkl::after { content: " \203A"; }
.astral-fb__erkl-zeile { align-self: center; }
.astral-fb__einheit { display: flex; align-items: center; }
.astral-fb__einheit input { border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; }
.astral-fb__einheit > span { padding: 0.65rem 0.7rem; border: 1px solid #B8C4CF; border-left: 0; border-radius: 0 6px 6px 0; background: var(--astral-blau-hell); color: var(--astral-grau); font-size: 0.95rem; white-space: nowrap; }
.astral-fb fieldset.astral-fb__gruppe { margin: 0.4rem 0 1.25rem; }
.astral-fb fieldset.astral-fb__gruppe legend { display: block; font-size: 1.05rem; font-weight: 700; margin-bottom: 0.6rem; }
.astral-fb__optionen { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 13rem), 1fr)); gap: 0.5rem; }
.astral-fb__optionen--liste { grid-template-columns: 1fr; }
.astral-fb__optionen--breit { grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
.astral-fb .astral-fb__option { display: flex; gap: 0.6rem; align-items: flex-start; margin: 0; padding: 0.6rem 0.8rem; border: 1px solid var(--astral-linie); border-radius: 6px; background: var(--astral-blau-hell); font-weight: 400; font-size: 0.975rem; line-height: 1.4; cursor: pointer; }
.astral-fb .astral-fb__option:hover { border-color: var(--astral-blau); }
.astral-fb .astral-fb__option:has(input:checked) { border-color: var(--astral-blau); background: #fff; box-shadow: 0 0 0 2px var(--astral-blau-zart); }
.astral-fb__option input, .astral-fb__check input { flex: none; width: 1.1rem; height: 1.1rem; margin-top: 0.15rem; accent-color: var(--astral-blau); }
.astral-fb__janein .astral-fb__optionen { grid-template-columns: repeat(auto-fill, minmax(8rem, 10rem)); }
.astral-fb__zusatz { margin: 0.6rem 0 0; max-width: 28rem; }
.astral-fb .astral-fb__zusatz label { font-weight: 400; font-size: 0.9rem; color: var(--astral-grau); }
.astral-fb .astral-fb__check { display: flex; gap: 0.6rem; align-items: flex-start; font-weight: 400; margin: 0 0 0.8rem; }
.astral-fb__zwischentitel { grid-column: 1 / -1; margin: 0.75rem 0 0.6rem; font-size: 1.05rem; }
.astral-fb fieldset.astral-fb__kasten { margin: 0.5rem 0 1.25rem; padding: 1rem 1.1rem 0.3rem; border: 1px solid var(--astral-linie); border-radius: var(--astral-radius); background: #FBFDFF; }
.astral-fb fieldset.astral-fb__kasten > legend { display: block; padding: 0 0.4rem; margin: 0; font-size: 1.05rem; font-weight: 700; }
.astral-fb__kasten-hinweis { margin: 0 0 0.75rem; font-size: 0.9rem; color: var(--astral-grau); }
.astral-fb__zeile { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr)); gap: 0 0.75rem; padding: 0.5rem 0 0.1rem; border-top: 1px solid var(--astral-linie); }
.astral-fb__zeile-titel { grid-column: 1 / -1; margin: 0 0 0.35rem; font-weight: 700; color: var(--astral-tinte); }
.astral-fb__zeile .astral-fb__feld { grid-column: auto; margin-bottom: 0.6rem; }
.astral-fb .astral-fb__zeile label { font-weight: 400; font-size: 0.85rem; color: var(--astral-grau); }
.astral-fb__hinweis { grid-column: 1 / -1; margin: 0.5rem 0 1rem; padding: 0.9rem 1.1rem; border-left: 5px solid var(--astral-blau); border-radius: 0 var(--astral-radius) var(--astral-radius) 0; background: var(--astral-blau-hell); }
.astral-fb__hinweis p { margin: 0; }
.astral-fb .astral-fb__hinweis-titel { font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--astral-blau-dunkel); margin-bottom: 0.3rem; }
.astral-fb__hinweis--warnung { border-left-color: #B9770E; background: #FFF6E5; }
.astral-fb .astral-fb__hinweis--warnung .astral-fb__hinweis-titel { color: #8A5A00; }
.astral-fb__fotos .astral-haken { margin-top: 0; }
.astral-fb__nav { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--astral-linie); }
.astral-fb__nav .wp-element-button { margin-left: auto; }
.astral-fb__zurueck { border: 1px solid var(--astral-linie); border-radius: 6px; background: #fff; color: var(--astral-tinte); font: inherit; padding: 0.7rem 1.4rem; cursor: pointer; }
.astral-fb__zurueck:hover { border-color: var(--astral-blau); }
.astral-fb__speicher { margin: 1rem 0 0; font-size: 0.85rem; color: var(--astral-grau); }
.astral-fb__speicher button { border: 0; background: none; padding: 0; color: var(--astral-blau-dunkel); font: inherit; text-decoration: underline; cursor: pointer; }
.astral-fb__schritt.ist-geprueft :invalid { border-color: #C0392B; }
.astral-fb__schritt.ist-geprueft .astral-fb__check:has(:invalid) { color: #8E2A20; }
.astral-fb__schritt[hidden], .astral-fb__speicher[hidden], .astral-fb__fortschritt[hidden] { display: none; }
@media (max-width: 781px) {
	.astral-fb__raster { grid-template-columns: 1fr 1fr; }
	.astral-fb__feld, .astral-fb__feld--m, .astral-fb__feld--l { grid-column: 1 / -1; }
	.astral-fb__feld--s { grid-column: span 1; }
	.astral-fb__liste { display: none; }
	.astral-fb__kopf h3 { font-size: 1.25rem; }
}
.astral-fb { max-width: 60rem; margin-inline: auto; }
.astral-galerie.wp-block-gallery.columns-2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); } /* zwei Bilder (z. B. in Beiträgen) über die ganze Breite */
@media (max-width: 781px) { .astral-themenbanner__medien img[src*="thema-hamburg-hafen"] { object-position: 88% center; } } /* Hafenbanner: auf dem Handy die Speicherstadt zeigen */

/* Kennzeichnung KI-generierter Bannerbilder und -videos (Art. 50 KI-VO), unten in der blauen Fläche */
.astral-themenbanner > .astral-themenbanner__text { align-self: stretch; display: flex; flex-direction: column; justify-content: center; }
.astral-themenbanner > .astral-themenbanner__text::after {
	content: "Bild/Video: KI-generiert";
	position: absolute;
	left: 0;
	bottom: 0.9rem;
	font-size: 0.75rem;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.82);
}
@media (max-width: 781px) {
	.astral-themenbanner > .astral-themenbanner__text::after { bottom: 0.6rem; }
}
.astral-beispiele + .astral-beispiele { margin-top: var(--wp--preset--spacing--30, 1.25rem); }
.astral-bew-legende { display: flex; flex-wrap: wrap; gap: 0.4rem 1.5rem; list-style: none; padding: 0; margin: 0.5rem 0 1.5rem; font-size: 0.95rem; } .astral-bew-legende li { margin: 0; }
