/* Arena Adlersaal – ergänzende Stile.
   Farben, Schriften und Größen kommen aus theme.json. */

img { max-width: 100%; height: auto; }

/* Abschnitte: oben/unten 96 px, seitlich der Seitenrand aus der Referenz */
.aa-section {
	padding: var(--wp--preset--spacing--70) var(--wp--custom--gutter);
}

/* Sichtbarer Fokus auf hellem und dunklem Grund (schwarzer Rahmen mit weißem Innenrand) */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--wp--preset--color--ink);
	outline-offset: 2px;
	box-shadow: 0 0 0 2px var(--wp--preset--color--paper);
}
/* Auf dunklen Flächen umgekehrt: weißer Rahmen, schwarzer Innenrand (gilt auch für Patterns) */
:where(.aa-header, .has-ink-background-color, .has-panel-dark-background-color, .has-whatsapp-bar-background-color) :focus-visible {
	outline-color: var(--wp--preset--color--paper);
	box-shadow: 0 0 0 2px var(--wp--preset--color--ink);
}

/* Sprunglink (von WordPress erzeugt) */
.skip-link.screen-reader-text:focus {
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--body);
	font-weight: 600;
}

/* Buttons: Mindesthöhe 48 px */
.wp-element-button,
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--wp--custom--button-min-height);
	text-decoration: none;
}

/* Button-Varianten. Standard (schwarz, weiße Schrift) kommt aus theme.json. */
.wp-block-button.is-style-hell .wp-block-button__link {
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
}
.wp-block-button.is-style-hell .wp-block-button__link:hover {
	background: var(--wp--preset--color--surface);
}
.wp-block-button.is-style-rahmen .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--paper);
	border: 1px solid rgba(255, 255, 255, 0.6);
}
.wp-block-button.is-style-rahmen .wp-block-button__link:hover {
	background: rgba(255, 255, 255, 0.1);
}

/* Header */
.aa-header {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
	border-bottom: 1px solid var(--wp--custom--line-inverse);
	padding: 20px var(--wp--custom--gutter);
	gap: 12px 40px;
}
.aa-logo {
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 28px;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.2;
}
.aa-logo a { color: inherit; text-decoration: none; }
.aa-nav { font-size: 14px; font-weight: 500; }
.aa-nav .wp-block-navigation__container { gap: 4px 22px; align-items: center; }
/* Doppelte Klasse wie im WordPress-Kern, sonst gewinnt dessen "display: block; color: inherit". */
.aa-header .aa-nav .wp-block-navigation-item__content.wp-block-navigation-item__content {
	display: inline-flex;
	align-items: center;
	min-height: var(--wp--custom--touch-min);
	color: inherit;
	text-decoration: none;
}
.aa-header .aa-nav .wp-block-navigation-item__content.wp-block-navigation-item__content:hover { opacity: 0.85; }
/* Aktive Seite: Unterstrich direkt unter dem Text */
.aa-header .aa-nav .wp-block-navigation-item__content[aria-current="page"] .wp-block-navigation-item__label {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 6px;
}
/* Kontakt-Button: weiß mit schwarzer Schrift (Kontrast 19,8:1) */
.aa-header .aa-nav .aa-nav-kontakt .wp-block-navigation-item__content.wp-block-navigation-item__content {
	min-height: var(--wp--custom--button-min-height);
	margin-left: 8px;
	padding: 0 28px;
	border-radius: var(--wp--custom--radius);
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}
.aa-header .aa-nav .aa-nav-kontakt .wp-block-navigation-item__content.wp-block-navigation-item__content:hover {
	opacity: 1;
	background: var(--wp--preset--color--surface);
}
.aa-header .aa-nav .aa-nav-kontakt .wp-block-navigation-item__content[aria-current="page"] .wp-block-navigation-item__label {
	text-decoration: none;
}

/* Footer */
.aa-footer {
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--text-muted);
	border-top: 1px solid var(--wp--custom--line);
	padding: 56px var(--wp--custom--gutter);
	font-size: 15px;
	line-height: 1.7;
}
.aa-footer .aa-footer-raster { max-width: 1296px; margin: 0 auto; gap: 40px; align-items: start; }
/* Gleichmäßige Zeilen: keine Zusatzabstände aus dem Fluss-Layout von WordPress */
.aa-footer .is-layout-flow > * { margin-block-start: 0; margin-block-end: 0; }
.aa-footer p { margin: 0; }
.aa-footer-logo {
	font-family: var(--wp--preset--font-family--heading);
	font-size: 26px;
	font-weight: 700;
	color: var(--wp--preset--color--ink);
}
.aa-footer .aa-footer-nav .wp-block-navigation__container { gap: 0; }
/* Jede einzeilige Zeile und jeder Link: 44 px hoch, Text mittig */
.aa-footer .aa-footer-zeile,
.aa-footer .aa-footer-nav .wp-block-navigation-item__content.wp-block-navigation-item__content {
	display: flex;
	align-items: center;
	min-height: var(--wp--custom--touch-min);
}
.aa-footer .aa-footer-zeile a,
.aa-footer .aa-footer-nav .wp-block-navigation-item__content.wp-block-navigation-item__content {
	color: inherit;
	text-decoration: none;
}
.aa-footer .aa-footer-zeile a:hover,
.aa-footer .aa-footer-nav .wp-block-navigation-item__content.wp-block-navigation-item__content:hover {
	text-decoration: underline;
}

/* Menü auf dem Handy */
.aa-header .aa-nav .wp-block-navigation__responsive-container-open,
.aa-header .aa-nav .wp-block-navigation__responsive-container-close { color: inherit; min-width: 44px; min-height: 44px; }
.aa-header .wp-block-navigation.aa-nav .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
	padding: 20px var(--wp--custom--gutter);
}
.aa-header .aa-nav .is-menu-open .wp-block-navigation__container { gap: 8px; font-size: 18px; }
.aa-header .aa-nav .is-menu-open .aa-nav-kontakt .wp-block-navigation-item__content.wp-block-navigation-item__content { margin-left: 0; margin-top: 8px; }
/* Menü-Schaltfläche schon unter 1400 px statt erst unter 600 px (Grenze des WordPress-Kerns,
   wp-includes/blocks/navigation/style.css:590–600 und :647–651). Logo, Navigation und Seitenränder brauchen
   gemessen 1388 px; darüber passt der Kopf in eine Zeile, darunter bräche er um. */
@media (max-width: 1399.98px) {
	.aa-header .aa-nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}
	.aa-header .aa-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

/* Abschnitte bündig: kein Zusatzabstand zwischen Header, Inhalt, Footer
   und zwischen den Abschnitten einer gestalteten Seite */
.wp-site-blocks > * { margin-block-start: 0; }
.page-template-page-gestaltet .aa-main > .wp-block-post-content > * { margin-block-start: 0; margin-block-end: 0; }

/* Kleiner Titel über Abschnitten */
.aa-eyebrow {
	margin: 0;
	font-size: var(--wp--preset--font-size--eyebrow);
	font-weight: 600;
	letter-spacing: 0.18em;
	line-height: 1.4;
	text-transform: uppercase;
}

/* Foto-Platzhalter: graue Fläche mit Beschreibung, später durch ein Bild ersetzt */
.aa-platzhalter {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	text-align: center;
	font-size: 14px;
	color: var(--wp--preset--color--placeholder-text);
}
.aa-platzhalter p { margin: 0; }
.aa-platzhalter.has-panel-dark-background-color {
	padding: 40px;
	font-size: 15px;
	color: rgba(255, 255, 255, 0.8);
}
.aa-platzhalter--520 { min-height: 520px; }
.aa-platzhalter--420 { min-height: 420px; }

/* Hero: links Text auf Schwarz, rechts Fotofläche; auf dem Handy untereinander */
.aa-hero {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(440px, 100%), 1fr));
	container-type: inline-size;
}
/* Kein automatischer Abstand vor Text oder Fotofläche, beide beginnen oben bündig */
.aa-hero.wp-block-group > * { margin: 0; }
.aa-hero .aa-hero__text {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 28px;
	padding: 88px var(--wp--custom--gutter);
}
.aa-hero .aa-hero__text > * { margin: 0; }
.aa-hero h1 { line-height: 1.08; }
.aa-hero .aa-hero__lead {
	max-width: 560px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.85);
}
.aa-hero .aa-hero__buttons { gap: 16px; margin-top: 8px; }
/* Unterseiten-Hero: etwas weniger Innenabstand, H1 in Unterseiten-Größe */
.aa-hero--unterseite .aa-hero__text { padding-block: 80px; }
.aa-hero--unterseite h1 { line-height: 1.1; }
/* Text und Foto untereinander (Hero schmaler als 2 × 440 px): Fotofläche niedriger */
@container (max-width: 879.98px) {
	.aa-hero .aa-platzhalter--520,
	.aa-hero .aa-platzhalter--420 { min-height: 300px; }
}

/* Stapel: Inhalte untereinander mit festem Abstand (statt der Abstände des Fluss-Layouts) */
.aa-stapel.wp-block-group {
	display: flex;
	flex-direction: column;
	gap: 24px;
}
.aa-stapel.wp-block-group > * { margin: 0; }

/* Seitenkopf ohne Foto */
.aa-seitenkopf { padding: 88px var(--wp--custom--gutter); }
.aa-seitenkopf h1 { max-width: 820px; line-height: 1.1; }
.aa-seitenkopf .aa-seitenkopf__lead {
	max-width: 640px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.85);
}

/* Zwei Spalten (Intro, Leistungsliste): ab 2 × 360 px nebeneinander, sonst untereinander */
.aa-zweispaltig.wp-block-group {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr));
	gap: 48px 64px;
	align-items: start;
}
.aa-zweispaltig.wp-block-group > * { margin: 0; }

/* Fließtext auf hellem Grund */
.aa-fliesstext { color: var(--wp--preset--color--text-muted); }
.aa-stapel.aa-fliesstext { gap: 20px; }

/* Größerer Abstand im Stapel (kleiner Titel über Raster) */
.aa-stapel.aa-stapel--weit { gap: 40px; }

/* Raster: Spalten passen sich an, auf dem Handy untereinander */
.aa-raster.wp-block-group {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr));
	gap: 32px;
}
.aa-raster.wp-block-group > * { margin: 0; }
.aa-raster.aa-raster--klein {
	grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
	gap: 24px;
}

/* Karte: weiß mit feiner Linie */
.aa-karte.wp-block-group {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 32px;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: var(--wp--custom--radius);
}
.aa-karte.wp-block-group > * { margin: 0; }
.aa-karte p {
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.65;
	color: var(--wp--preset--color--text-muted);
}

/* Kleiner Abstand im Stapel (kleiner Titel direkt über der Überschrift) */
.aa-stapel.aa-stapel--eng { gap: 12px; }
.aa-platzhalter--220 { min-height: 220px; }

/* Einstiegskarte: Foto oben, Text darunter; die ganze Karte ist über den Link der H3 klickbar */
.aa-karte.aa-einstieg { position: relative; padding: 0; gap: 0; }
.aa-einstieg .aa-einstieg__text {
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 14px;
	padding: 32px;
}
.aa-einstieg .aa-einstieg__text > * { margin: 0; }
/* "Mehr erfahren" in allen Karten unten auf gleicher Höhe */
.aa-einstieg .aa-einstieg__text > .aa-mehr { margin-top: auto; }
.aa-einstieg h3 { font-size: 28px; }
.aa-einstieg h3 a { color: inherit; text-decoration: none; }
.aa-einstieg h3 a::after { content: ""; position: absolute; inset: 0; }
.aa-einstieg:hover h3 a { text-decoration: underline; }
/* Fokus-Rahmen um die ganze Karte statt nur um die Überschrift */
.aa-einstieg h3 a:focus-visible { outline: none; box-shadow: none; }
.aa-einstieg h3 a:focus-visible::after {
	outline: 3px solid var(--wp--preset--color--ink);
	outline-offset: 2px;
	box-shadow: 0 0 0 2px var(--wp--preset--color--paper);
}
/* "Mehr erfahren" mit Pfeil; der Pfeil ist ein eingebettetes SVG, keine externe Datei */
.aa-einstieg .aa-mehr {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: var(--wp--custom--touch-min);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink);
}
.aa-einstieg .aa-mehr::after {
	content: "";
	width: 18px;
	height: 18px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Überschriften in Fließtext-Gruppen bleiben schwarz */
.aa-fliesstext :is(h2, h3) { color: var(--wp--preset--color--ink); }

/* Leistungsliste: Einträge mit Trennlinie oben */
.aa-liste.wp-block-group > * { margin: 0; }
.aa-liste .aa-liste__eintrag {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 28px 0;
	border-top: 1px solid rgba(0, 0, 0, 0.18);
}
.aa-liste .aa-liste__eintrag > * { margin: 0; }
.aa-liste p {
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.65;
	color: var(--wp--preset--color--text-muted);
}

/* Fakten-Band: drei Kurzinfos auf Schwarz, ohne Überschriften */
.aa-fakten { padding: 64px var(--wp--custom--gutter); }
.aa-fakten .aa-raster { gap: 32px 48px; }
.aa-fakt.wp-block-group { display: flex; flex-direction: column; gap: 6px; }
.aa-fakt.wp-block-group > * { margin: 0; }
.aa-fakt .aa-fakt__wert {
	font-family: var(--wp--preset--font-family--heading);
	font-size: 40px;
	font-weight: 600;
	line-height: 1.1;
}
.aa-fakt .aa-fakt__text {
	font-size: var(--wp--preset--font-size--small);
	color: rgba(255, 255, 255, 0.8);
}

/* Galerie-Auszug */
.aa-stapel.aa-stapel--mittel { gap: 32px; }
.aa-raster.aa-raster--eng { gap: 20px; container: aa-raster-eng / inline-size; }
.aa-platzhalter--300 { min-height: 300px; }
/* Fotos untereinander (Raster schmaler als 2 × 340 px + Abstand): niedriger */
@container aa-raster-eng (max-width: 699.98px) {
	.aa-platzhalter--300 { min-height: 220px; }
}

/* Anfrage-Band: H2 links, Button rechts; auf dem Handy untereinander */
.aa-anfrage-band { padding: 80px var(--wp--custom--gutter); }
.aa-anfrage-band__inhalt.wp-block-group {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
}
.aa-anfrage-band__inhalt.wp-block-group > * { margin: 0; }
.aa-anfrage-band h2 {
	max-width: 640px;
	font-size: clamp(28px, 3vw, 38px);
	line-height: 1.2;
}

/* Anfrage-Formular: schmaler Block, Platzhalter fürs Formular, WhatsApp-Leiste */
.aa-anfrage.wp-block-group { max-width: 960px; }
.aa-formular-platzhalter.wp-block-group {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 320px;
	padding: 24px;
	border: 1px dashed rgba(0, 0, 0, 0.45);
	border-radius: var(--wp--custom--radius);
	text-align: center;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--text-muted);
}
.aa-formular-platzhalter.wp-block-group > * { margin: 0; }
.aa-whatsapp-leiste.wp-block-group {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 20px 28px;
	border-radius: var(--wp--custom--radius);
}
.aa-whatsapp-leiste.wp-block-group > * { margin: 0; }
.aa-whatsapp-leiste p { font-size: 17px; font-weight: 500; }

/* Social-Felder: zwei schwarze Karten */
.aa-raster.aa-raster--breit { grid-template-columns: repeat(auto-fit, minmax(min(380px, 100%), 1fr)); }
.aa-social-karte.wp-block-group {
	display: flex;
	flex-direction: column;
	gap: 20px;
	min-height: 360px;
	padding: 36px;
	border-radius: var(--wp--custom--radius);
}
.aa-social-karte.wp-block-group > * { margin: 0; }
.aa-social-karte h3 { font-size: 28px; }
.aa-social-karte > p { font-size: var(--wp--preset--font-size--small); color: rgba(255, 255, 255, 0.8); }
.aa-social-karte .aa-platzhalter { flex: 1; min-height: 160px; }

/* Kontaktseite: Formular links, Kontaktwege rechts */
.aa-kontakt.wp-block-group {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr));
	gap: 56px 72px;
	align-items: start;
}
.aa-kontakt.wp-block-group > * { margin: 0; }
.aa-whatsapp-box.wp-block-group {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 32px;
	border-radius: var(--wp--custom--radius);
}
.aa-whatsapp-box.wp-block-group > * { margin: 0; }
.aa-whatsapp-box h3 { font-size: 28px; }
.aa-whatsapp-box p { color: rgba(255, 255, 255, 0.85); }
.aa-stapel.aa-adresse { gap: 8px; }

/* Karte und Text: Kartenfläche links, Adresse rechts mittig */
.aa-zweispaltig.aa-zweispaltig--karte {
	grid-template-columns: repeat(auto-fit, minmax(min(380px, 100%), 1fr));
	align-items: stretch;
	container: aa-karte / inline-size;
}
.aa-zweispaltig--karte > .aa-stapel { justify-content: center; }
.aa-fliesstext .aa-adresse-gross { font-size: 18px; }
/* Karte und Text untereinander (schmaler als 2 × 380 px + 64 px Abstand): Kartenfläche niedriger */
@container aa-karte (max-width: 823.98px) {
	.aa-zweispaltig--karte > .aa-platzhalter--420 { min-height: 300px; }
}

/* Galerie mit Filter: Buttons erzeugt galerie-filter.js */
.aa-filter { display: flex; flex-wrap: wrap; gap: 12px; }
.aa-chip {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--wp--custom--touch-min);
	padding: 0 24px;
	border: 1px solid var(--wp--preset--color--ink);
	border-radius: var(--wp--custom--radius);
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--body);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}
.aa-chip:hover { background: var(--wp--preset--color--surface); }
.aa-chip[aria-pressed="true"] {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
}
/* Ausgeblendete Bilder wirklich ausblenden (die Platzhalter haben display: flex) */
.aa-galerie > [hidden] { display: none !important; }
/* Unsichtbarer Hinweis für Screenreader */
.aa-sr-hinweis {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}
