/*
 * AI Zentra – Stylesheet für Website UND Editor.
 * Aufbau: 1 Schriften · 2 Variablen · 3 Grundlagen · 4 Kopfzeile · 5 Abschnitte · 6 Bausteine
 *         7 Hero-Visual · 8 Formular · 9 Firmendaten · 10 Fußzeile · 11 Animation · 12 Hilfsklassen
 * Farben nur über die Variablen unten ändern – dann bleibt alles einheitlich.
 */

/* 1 ─ Schriften (selbst gehostet, OFL-Lizenz) */
@font-face { font-family: "Space Grotesk"; src: url("../fonts/space-grotesk-var.woff2") format("woff2"); font-weight: 300 700; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("../fonts/plex-sans-var.woff2") format("woff2"); font-weight: 100 700; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("../fonts/plex-sans-400i.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../fonts/plex-mono-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../fonts/plex-mono-500.woff2") format("woff2"); font-weight: 500 700; font-style: normal; font-display: swap; }

/* 2 ─ Variablen */
:root {
	--az-night: #07111F;
	--az-ink: #0D1726;
	--az-ink-2: #12203A;
	--az-paper: #F4F7FA;
	--az-white: #FFFFFF;
	--az-text: #0B1524;
	--az-muted: #475569;
	--az-on-dark: #E8EEF6;
	--az-muted-dark: #A3B3C7;
	--az-petrol: #0E7490;
	--az-petrol-hover: #0B5D74;
	--az-cyan: #22D3EE;
	--az-cyan-soft: rgba(34, 211, 238, .12);
	--az-line: #D9E1EA;
	--az-line-dark: rgba(162, 196, 235, .16);
	--az-amber: #FBBF24;
	--az-amber-bg: #FEF3C7;
	--az-amber-text: #7C3F06;
	--az-danger: #B42318;
	--az-danger-dark: #FDA29B;
	--az-ok: #067647;

	--az-font-head: "Space Grotesk", system-ui, sans-serif;
	--az-font-body: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	--az-font-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;

	--az-wrap: 1200px;
	--az-gutter: clamp(1rem, 4vw, 2rem);
	--az-section-y: clamp(4rem, 2.8rem + 5vw, 7.5rem);
	--az-radius: 14px;
	--az-radius-sm: 8px;
	--az-header-h: 72px;
	--az-ease: cubic-bezier(.2, .7, .2, 1);
	--az-shadow: 0 1px 2px rgba(11, 21, 36, .06), 0 8px 24px -12px rgba(11, 21, 36, .18);
	--az-shadow-hover: 0 2px 4px rgba(11, 21, 36, .06), 0 18px 40px -18px rgba(11, 21, 36, .30);
	--az-glow: 0 0 0 1px rgba(34, 211, 238, .35), 0 0 32px -6px rgba(34, 211, 238, .45);
}

/* 3 ─ Grundlagen */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--az-header-h) + 1rem); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
	margin: 0;
	background: var(--az-paper);
	color: var(--az-text);
	font-family: var(--az-font-body);
	font-size: 1.0625rem;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}
body.az-nav-offen { overflow: hidden; }
img, svg, video { max-width: 100%; height: auto; }
img { display: block; }
h1, h2, h3, h4, .az-h {
	font-family: var(--az-font-head);
	font-weight: 600;
	line-height: 1.12;
	letter-spacing: -.02em;
	margin: 0 0 .6em;
	text-wrap: balance;
	color: inherit;
}
h1 { font-size: clamp(2.2rem, 1.55rem + 2.9vw, 3.9rem); letter-spacing: -.03em; }
h2 { font-size: clamp(1.75rem, 1.35rem + 1.7vw, 2.75rem); }
h3 { font-size: clamp(1.15rem, 1.08rem + .3vw, 1.3rem); line-height: 1.3; letter-spacing: -.01em; }
h4 { font-size: 1.05rem; line-height: 1.35; }
p { margin: 0 0 1em; text-wrap: pretty; }
p:last-child, ul:last-child, ol:last-child { margin-bottom: 0; }
ul, ol { margin: 0 0 1em; padding-left: 1.25em; }
/* WordPress nullt bei blockGap 0 in Fluss-Layouts alle Außenabstände (`:root :where(.is-layout-flow) > *`,
   Spezifität 0,1,0) und schlägt damit p/ul/ol. Gleiche Spezifität, später geladen → Textfluss zurück;
   Komponenten-Regeln weiter unten gewinnen weiterhin. */
:root :where(.is-layout-flow, .is-layout-constrained) > :where(p, ul, ol):where(:not(:last-child)) { margin-block-end: 1em; }
:root :where(.is-layout-flow, .is-layout-constrained) > :where(h1, h2, h3, h4, h5, h6):where(:not(:last-child)) { margin-block-end: .6em; }
.az-grid:not(:last-child), .az-fd:not(:last-child) { margin-bottom: 2rem; }
li + li { margin-top: .35em; }
strong, b { font-weight: 600; }
a { color: var(--az-petrol); text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover { color: var(--az-petrol-hover); text-decoration-thickness: 2px; }
code, kbd, samp { font-family: var(--az-font-mono); font-size: .9em; }
hr { border: 0; border-top: 1px solid var(--az-line); margin: 2.5rem 0; }
address { font-style: normal; }
::selection { background: rgba(34, 211, 238, .35); color: inherit; }

:focus { outline: none; }
:focus-visible { outline: 2px solid var(--az-petrol); outline-offset: 3px; border-radius: 4px; }
.az-on-dark :focus-visible, .az-header :focus-visible, .az-footer :focus-visible, .az-section--dark :focus-visible, .az-section--ink :focus-visible { outline-color: var(--az-cyan); }

.az-wrap { width: 100%; max-width: calc(var(--az-wrap) + 2 * var(--az-gutter)); margin-inline: auto; padding-inline: var(--az-gutter); }
.az-main { display: block; }
.az-main:focus { outline: none; }

.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
	height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0;
	position: absolute !important; word-wrap: normal !important;
}
.az-skip {
	position: absolute; left: 1rem; top: -100px; z-index: 1000;
	background: var(--az-cyan); color: var(--az-night); font-weight: 600;
	padding: .75rem 1rem; border-radius: var(--az-radius-sm); text-decoration: none;
}
.az-skip:focus { top: 1rem; }

/* Icons (SVG-Sprite, Lucide) */
.az-i {
	width: 1.25em; height: 1.25em; flex: none;
	fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round;
	vertical-align: -.22em;
}

/* Buttons – eigene (.az-btn) und Kern-Button-Block (.wp-block-button__link) sehen gleich aus */
.az-btn, .wp-block-button__link {
	--b-bg: var(--az-petrol); --b-fg: #fff; --b-bd: var(--az-petrol);
	display: inline-flex; align-items: center; justify-content: center; gap: .55em;
	min-height: 48px; padding: .75rem 1.35rem;
	border: 1px solid var(--b-bd); border-radius: 999px;
	background: var(--b-bg); color: var(--b-fg);
	font: 600 1rem/1.2 var(--az-font-body); letter-spacing: .005em;
	text-decoration: none; text-align: center; cursor: pointer;
	transition: background-color .2s, border-color .2s, color .2s, box-shadow .25s, transform .2s var(--az-ease);
}
.az-btn:hover, .wp-block-button__link:hover { --b-bg: var(--az-petrol-hover); --b-bd: var(--az-petrol-hover); color: var(--b-fg); text-decoration: none; }
.az-btn:active, .wp-block-button__link:active { transform: translateY(1px); }
.az-btn .az-i, .wp-block-button__link .az-i { transition: transform .2s var(--az-ease); }
.az-btn:hover .az-i { transform: translateX(3px); }
.az-btn--sm { min-height: 40px; padding: .5rem 1rem; font-size: .9375rem; }
.az-btn--ghost, .az-btn-ghost .wp-block-button__link { --b-bg: transparent; --b-fg: var(--az-petrol); --b-bd: currentColor; }
.az-btn--ghost:hover, .az-btn-ghost .wp-block-button__link:hover { --b-bg: rgba(14, 116, 144, .08); --b-fg: var(--az-petrol-hover); --b-bd: var(--az-petrol-hover); }

/* Auf dunklem Grund: Türkis als Hauptfarbe, dunkle Schrift (Kontrast > 10:1) */
.az-on-dark .az-btn, .az-on-dark .wp-block-button__link,
.az-section--dark .az-btn, .az-section--dark .wp-block-button__link,
.az-section--ink .az-btn, .az-section--ink .wp-block-button__link,
.az-header .az-btn, .az-footer .az-btn {
	--b-bg: var(--az-cyan); --b-fg: var(--az-night); --b-bd: var(--az-cyan);
}
.az-on-dark .az-btn:hover, .az-on-dark .wp-block-button__link:hover,
.az-section--dark .az-btn:hover, .az-section--dark .wp-block-button__link:hover,
.az-section--ink .az-btn:hover, .az-section--ink .wp-block-button__link:hover,
.az-header .az-btn:hover, .az-footer .az-btn:hover {
	--b-bg: #67E8F9; --b-bd: #67E8F9; box-shadow: var(--az-glow);
}
.az-section--dark .az-btn--ghost, .az-section--dark .az-btn-ghost .wp-block-button__link,
.az-section--ink .az-btn--ghost, .az-section--ink .az-btn-ghost .wp-block-button__link {
	--b-bg: rgba(255, 255, 255, .02); --b-fg: var(--az-on-dark); --b-bd: rgba(232, 238, 246, .32);
}
.az-section--dark .az-btn--ghost:hover, .az-section--dark .az-btn-ghost .wp-block-button__link:hover,
.az-section--ink .az-btn--ghost:hover, .az-section--ink .az-btn-ghost .wp-block-button__link:hover {
	--b-bg: rgba(34, 211, 238, .08); --b-fg: #fff; --b-bd: var(--az-cyan); box-shadow: none;
}
.wp-block-buttons, .az-actions { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; margin: 1.75rem 0 0; padding: 0; list-style: none; }
.wp-block-buttons > .wp-block-button { margin: 0; }

/* 4 ─ Kopfzeile */
.az-header {
	position: sticky; top: 0; z-index: 100;
	border-bottom: 1px solid transparent;
	color: var(--az-on-dark);
	transition: border-color .25s;
}
/* Hintergrund und Unschärfe auf eigener Ebene: backdrop-filter direkt an der Kopfzeile macht sie zum
   Bezugsrahmen für das fixierte Handy-Menü – das Menü wäre dann 0 px hoch und unsichtbar. */
.az-header::before {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background: rgba(7, 17, 31, .94);
	-webkit-backdrop-filter: saturate(140%) blur(14px);
	backdrop-filter: saturate(140%) blur(14px);
}
.admin-bar .az-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .az-header { top: 46px; } }
@media (max-width: 600px) { .admin-bar .az-header { top: 0; } }
.az-header.is-scrolled { border-bottom-color: var(--az-line-dark); }
.az-header__bar { display: flex; align-items: center; gap: 1rem; min-height: var(--az-header-h); }
.az-header__tools { display: flex; align-items: center; gap: .6rem; margin-left: auto; }

.az-brand { display: inline-flex; align-items: center; gap: .6rem; color: #fff; text-decoration: none; flex: none; }
.az-brand:hover { color: #fff; text-decoration: none; }
.az-brand__mark { width: 34px; height: 34px; color: #fff; }
.az-brand__name { font: 600 1.2rem/1 var(--az-font-head); letter-spacing: -.02em; }
.az-brand__suffix { font: 500 .7rem/1 var(--az-font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--az-muted-dark); padding: .25rem .4rem; border: 1px solid var(--az-line-dark); border-radius: 4px; }

/* Sprachumschalter DE | EN – immer sichtbar */
.az-lang { display: flex; margin: 0; padding: 3px; list-style: none; border: 1px solid var(--az-line-dark); border-radius: 999px; background: rgba(255, 255, 255, .03); }
.az-lang li { margin: 0; }
.az-lang a {
	display: flex; align-items: center; justify-content: center; min-width: 40px; min-height: 34px; padding: 0 .6rem;
	border-radius: 999px; color: var(--az-muted-dark); text-decoration: none;
	font: 500 .8125rem/1 var(--az-font-mono); letter-spacing: .08em;
}
.az-lang a:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.az-lang a[aria-current="true"] { color: var(--az-night); background: var(--az-cyan); }

/* Burger */
.az-burger {
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; padding: 0; border: 1px solid var(--az-line-dark); border-radius: 12px;
	background: transparent; color: #fff; cursor: pointer;
}
.az-burger__lines, .az-burger__lines::before, .az-burger__lines::after,
.az-burger__lines span { display: block; width: 18px; height: 1.5px; background: currentColor; border-radius: 2px; transition: transform .25s var(--az-ease), opacity .2s; }
.az-burger__lines { position: relative; background: transparent; }
.az-burger__lines::before, .az-burger__lines::after { content: ""; position: absolute; left: 0; }
.az-burger__lines::before { top: -6px; }
.az-burger__lines::after { top: 6px; }
.az-burger[aria-expanded="true"] .az-burger__lines span { opacity: 0; }
.az-burger[aria-expanded="true"] .az-burger__lines::before { transform: translateY(6px) rotate(45deg); }
.az-burger[aria-expanded="true"] .az-burger__lines::after { transform: translateY(-6px) rotate(-45deg); }

/* Menü – Handy: Panel unter der Kopfzeile */
.az-nav { position: fixed; inset: var(--az-header-h) 0 0 0; z-index: 99; background: var(--az-night); overflow-y: auto; overscroll-behavior: contain; visibility: hidden; opacity: 0; transform: translateY(-8px); transition: opacity .2s, transform .25s var(--az-ease), visibility 0s linear .25s; }
.admin-bar .az-nav { top: calc(var(--az-header-h) + 46px); }
.az-nav.is-open { visibility: visible; opacity: 1; transform: none; transition: opacity .2s, transform .25s var(--az-ease); }
html:not(.js) .az-nav { position: static; visibility: visible; opacity: 1; transform: none; background: transparent; }
html:not(.js) .az-burger { display: none; }
.az-nav__inner { padding: 1.25rem var(--az-gutter) 2.5rem; }
.az-menu, .az-menu__sub { list-style: none; margin: 0; padding: 0; }
.az-menu > li { position: relative; margin: 0; border-bottom: 1px solid var(--az-line-dark); display: flex; flex-wrap: wrap; align-items: center; }
.az-menu a { color: var(--az-on-dark); text-decoration: none; }
.az-menu > li > a { flex: 1; padding: 1rem 0; font: 500 1.125rem/1.3 var(--az-font-head); }
.az-menu a:hover, .az-menu .current-menu-item > a, .az-menu .current-menu-ancestor > a { color: var(--az-cyan); }
.az-menu__toggle { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 10px; background: transparent; color: var(--az-muted-dark); cursor: pointer; }
.az-menu__toggle .az-i { transition: transform .25s var(--az-ease); }
.az-menu__toggle[aria-expanded="true"] .az-i { transform: rotate(180deg); }
.az-menu__sub { flex-basis: 100%; display: none; padding: 0 0 .75rem; }
.az-menu__toggle[aria-expanded="true"] + .az-menu__sub, html:not(.js) .az-menu__sub { display: block; }
.az-menu__sub li { margin: 0; }
.az-menu__sub a { display: block; padding: .6rem .75rem; border-radius: 10px; font-weight: 500; }
.az-menu__sub a:hover { background: rgba(255, 255, 255, .04); }
.az-menu__desc { display: block; margin-top: .15rem; font-size: .875rem; font-weight: 400; color: var(--az-muted-dark); line-height: 1.45; }
.az-nav__cta { margin-top: 1.5rem; width: 100%; }
.az-header__cta { display: none; }

@media (min-width: 640px) {
	.az-header__cta { display: inline-flex; }
	.az-nav__cta { display: none; }
}

/* Menü – ab 1080 px: waagerecht, Untermenü als Ausklapp-Panel */
@media (min-width: 1080px) {
	.az-burger { display: none; }
	.az-header__tools { margin-left: 0; }
	.az-nav, html:not(.js) .az-nav { position: static; inset: auto; visibility: visible; opacity: 1; transform: none; background: transparent; overflow: visible; margin-left: auto; transition: none; }
	.az-nav__inner { padding: 0; }
	.az-menu { display: flex; align-items: center; gap: .25rem; }
	.az-menu > li { border: 0; flex-wrap: nowrap; }
	.az-menu > li > a { padding: .5rem .65rem; font: 500 .9375rem/1.2 var(--az-font-body); border-radius: 8px; }
	.az-menu > li > a:hover { background: rgba(255, 255, 255, .05); }
	.az-menu > .current-menu-item > a, .az-menu > .current-menu-ancestor > a { color: #fff; box-shadow: inset 0 -2px 0 var(--az-cyan); border-radius: 0; }
	.az-menu__toggle { width: 28px; height: 32px; margin-left: -.4rem; }
	.az-menu__sub, html:not(.js) .az-menu__sub {
		display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .25rem;
		position: absolute; top: calc(100% + 12px); left: calc(50% - min(320px, 40vw)); width: min(640px, 80vw); /* mittig unter dem Menüpunkt, sonst ragt es rechts hinaus */
		padding: .75rem; border: 1px solid var(--az-line-dark); border-radius: var(--az-radius);
		background: rgba(10, 20, 36, .97); box-shadow: 0 24px 60px -20px rgba(0, 0, 0, .6);
		visibility: hidden; opacity: 0; transform: translateY(-6px);
		transition: opacity .18s, transform .2s var(--az-ease), visibility 0s linear .2s;
	}
	.az-menu__sub::before { content: ""; position: absolute; inset: -14px 0 auto; height: 14px; }
	.az-menu > li:hover > .az-menu__sub,
	.az-menu__toggle[aria-expanded="true"] + .az-menu__sub,
	.az-menu > li:focus-within > .az-menu__sub { visibility: visible; opacity: 1; transform: none; transition: opacity .18s, transform .2s var(--az-ease); }
	.az-menu > li.az-zu > .az-menu__sub { visibility: hidden; opacity: 0; }
	.az-menu__sub a { padding: .75rem .85rem; }
	.az-header__cta { display: inline-flex; }
}
@media (min-width: 1080px) and (max-width: 1239px) {
	.az-header__cta { display: none; }
}

/* Brotkrumen – dunkler Streifen, geht nahtlos in den Seitenkopf über */
.az-crumbs { background: var(--az-night); color: var(--az-muted-dark); font: 400 .8125rem/1.4 var(--az-font-mono); letter-spacing: .02em; }
.az-crumbs ol { display: flex; flex-wrap: wrap; gap: .25rem .5rem; margin: 0; padding: 1.1rem 0 0; list-style: none; }
.az-crumbs li { margin: 0; display: inline-flex; align-items: center; gap: .5rem; }
.az-crumbs li + li::before { content: "/"; color: rgba(163, 179, 199, .5); }
.az-crumbs a { color: var(--az-muted-dark); text-decoration: none; }
.az-crumbs a:hover { color: var(--az-cyan); text-decoration: underline; }
.az-crumbs [aria-current] { color: var(--az-on-dark); }

/* 5 ─ Abschnitte */
.az-section { position: relative; padding-block: var(--az-section-y); }
.az-section--light { background: var(--az-paper); }
.az-section--white { background: var(--az-white); }
.az-section--dark, .az-section--ink { color: var(--az-on-dark); background: var(--az-night); }
.az-section--ink { background: var(--az-ink); }
.az-section--dark a:not(.az-btn):not(.wp-block-button__link), .az-section--ink a:not(.az-btn):not(.wp-block-button__link) { color: var(--az-cyan); }
.az-section--tight { padding-block: clamp(3rem, 2.4rem + 3vw, 5rem); }
.az-section + .az-section--white, .az-section--white + .az-section--white { border-top: 1px solid var(--az-line); }
.az-section--light + .az-section--light { padding-top: 0; }

/* Blaupausen-Raster auf dunklen Abschnitten */
.az-section--dark::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background-image:
		linear-gradient(rgba(162, 196, 235, .055) 1px, transparent 1px),
		linear-gradient(90deg, rgba(162, 196, 235, .055) 1px, transparent 1px);
	background-size: 48px 48px;
	-webkit-mask-image: radial-gradient(120% 90% at 70% 0%, #000 30%, transparent 75%);
	mask-image: radial-gradient(120% 90% at 70% 0%, #000 30%, transparent 75%);
}
.az-section--dark > * { position: relative; }

/* Abschnittskopf: Kennung · Überschrift · Einleitung */
.az-head { max-width: 760px; margin-bottom: clamp(2rem, 1.6rem + 1.8vw, 3.25rem); }
.az-head:last-child { margin-bottom: 0; }
.az-head--center { margin-inline: auto; text-align: center; }
.az-head--center .wp-block-buttons { justify-content: center; }
.az-head > h2, .az-head > h1 { margin-bottom: .45em; }
.az-kicker {
	display: inline-flex; align-items: center; gap: .6rem; margin: 0 0 1.1rem;
	font: 500 .78rem/1.3 var(--az-font-mono); letter-spacing: .14em; text-transform: uppercase;
	color: var(--az-petrol);
}
.az-kicker::before { content: ""; width: 22px; height: 1px; background: currentColor; }
.az-section--dark .az-kicker, .az-section--ink .az-kicker, .az-on-dark .az-kicker { color: var(--az-cyan); }
.az-lead { font-size: clamp(1.075rem, 1.02rem + .3vw, 1.2rem); line-height: 1.6; color: var(--az-muted); max-width: 66ch; }
.az-section--dark .az-lead, .az-section--ink .az-lead { color: var(--az-muted-dark); }
.az-head--center .az-lead { margin-inline: auto; }
.az-note { font-size: .9375rem; color: var(--az-muted); }
.az-note:not(:first-child) { margin-top: 1.5rem; }
.az-section--dark .az-note, .az-section--ink .az-note { color: var(--az-muted-dark); }

/* Hero (Startseite) */
.az-hero { padding-block: clamp(3.5rem, 2.5rem + 5vw, 7rem) clamp(4rem, 3rem + 5vw, 7.5rem); overflow: hidden; }
.az-hero::after {
	content: ""; position: absolute; pointer-events: none;
	width: 900px; height: 900px; right: -320px; top: -360px; border-radius: 50%;
	background: radial-gradient(closest-side, rgba(34, 211, 238, .16), rgba(14, 116, 144, .08) 45%, transparent 70%);
}
.az-hero__grid { display: grid; gap: clamp(2.5rem, 2rem + 3vw, 4.5rem); align-items: center; }
.az-hero h1 { max-width: 14ch; font-size: clamp(2.35rem, 1.5rem + 3.6vw, 4.35rem); }
.az-hero h1 em, .az-hero h1 .az-accent { font-style: normal; color: var(--az-cyan); }
.az-hero .az-lead { font-size: clamp(1.1rem, 1.03rem + .4vw, 1.3rem); max-width: 54ch; }
.az-hero__points { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin: 2rem 0 0; padding: 0; list-style: none; font: 400 .8125rem/1.4 var(--az-font-mono); color: var(--az-muted-dark); letter-spacing: .02em; }
.az-hero__points li { margin: 0; display: inline-flex; align-items: center; gap: .45rem; }
.az-hero__points li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--az-cyan); box-shadow: 0 0 10px var(--az-cyan); }
@media (min-width: 1000px) {
	.az-hero__grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); }
}

/* Seitenkopf (Unterseiten) */
.az-pagehero { padding-block: clamp(2.5rem, 2rem + 3vw, 4.5rem) clamp(3.5rem, 2.8rem + 3.5vw, 6rem); }
.az-pagehero h1, .az-pagehero__title { max-width: 22ch; margin-bottom: .4em; }
.az-pagehero--compact { padding-block: clamp(2rem, 1.6rem + 2vw, 3rem) clamp(2.5rem, 2rem + 2.5vw, 4rem); }
.az-pagehero--compact h1 { font-size: clamp(2rem, 1.6rem + 1.8vw, 3rem); margin: 0; }

/* Raster */
.az-grid { display: grid; gap: clamp(1rem, .8rem + .8vw, 1.5rem); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) {
	.az-grid--2, .az-grid--3, .az-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1000px) {
	.az-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
/* Vier Karten erst ab 1200 px: darunter sind die Spalten zu schmal für Wörter wie „Fahrzeugzuordnung“ */
@media (min-width: 1200px) {
	.az-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.az-split { display: grid; gap: clamp(1rem, .8rem + 1vw, 1.75rem); }
@media (min-width: 860px) { .az-split { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.az-split--wide { gap: clamp(2rem, 1.5rem + 3vw, 4.5rem); align-items: start; }
@media (min-width: 1000px) { .az-split--wide { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); } }

/* 6 ─ Bausteine */

/* Karte */
.az-card {
	position: relative; display: flex; flex-direction: column; gap: .2rem;
	padding: clamp(1.35rem, 1.2rem + .6vw, 1.85rem);
	background: var(--az-white); border: 1px solid var(--az-line); border-radius: var(--az-radius);
	box-shadow: var(--az-shadow);
	transition: transform .3s var(--az-ease), box-shadow .3s var(--az-ease), border-color .3s;
}
.az-card::before {
	content: ""; position: absolute; left: 1.5rem; right: 1.5rem; top: -1px; height: 2px; border-radius: 2px;
	background: linear-gradient(90deg, var(--az-petrol), var(--az-cyan));
	transform: scaleX(0); transform-origin: left; transition: transform .45s var(--az-ease);
}
.az-card:hover { transform: translateY(-3px); box-shadow: var(--az-shadow-hover); border-color: #C5D1DE; }
.az-card:hover::before { transform: scaleX(1); }
.az-card h3 { margin: .9rem 0 .4rem; }
/* Lange deutsche Komposita („Suchmaschinenmarketing“) in schmalen Karten trennen statt über den Rand laufen lassen.
   Nur Wörter ab 12 Zeichen; break-word fängt Browser ohne Trennwörterbuch ab. */
:is(.az-card, .az-step, .az-panel) h3 { hyphens: auto; -webkit-hyphenate-limit-before: 5; -webkit-hyphenate-limit-after: 5; hyphenate-limit-chars: 12 5 5; overflow-wrap: break-word; }
.az-card p { color: var(--az-muted); font-size: 1rem; }
.az-card .az-ib + h3 { margin-top: 1.1rem; }
.az-card > :first-child:is(h3) { margin-top: 0; }
.az-card__more { margin-top: auto !important; padding-top: 1rem; font-weight: 600; font-size: .9375rem; }
.az-card__more a { display: inline-flex; align-items: center; gap: .4rem; text-decoration: none; }
.az-card__more a::after { content: ""; position: absolute; inset: 0; border-radius: var(--az-radius); }
.az-card__more a:hover { text-decoration: underline; }
.az-card--feature { border-color: rgba(14, 116, 144, .35); background: linear-gradient(180deg, #fff, #F2FAFC); }
.az-card--feature::before { transform: scaleX(1); }

/* Karten auf Dunkel: Glas */
.az-section--dark .az-card, .az-section--ink .az-card {
	background: linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .015));
	border-color: var(--az-line-dark); box-shadow: none;
	-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.az-section--dark .az-card:hover, .az-section--ink .az-card:hover { border-color: rgba(34, 211, 238, .45); box-shadow: 0 0 0 1px rgba(34, 211, 238, .12), 0 20px 50px -24px rgba(34, 211, 238, .35); }
.az-section--dark .az-card p, .az-section--ink .az-card p { color: var(--az-muted-dark); }
.az-section--dark .az-card__more a, .az-section--ink .az-card__more a { color: var(--az-cyan); }

/* Icon-Kachel (Block „Icon“) */
.az-ib {
	display: inline-flex; align-items: center; justify-content: center; flex: none;
	width: 48px; height: 48px; border-radius: 12px;
	color: var(--az-petrol); background: rgba(14, 116, 144, .08); border: 1px solid rgba(14, 116, 144, .18);
}
.az-ib .az-i { width: 24px; height: 24px; }
.az-section--dark .az-ib, .az-section--ink .az-ib { color: var(--az-cyan); background: var(--az-cyan-soft); border-color: rgba(34, 211, 238, .28); box-shadow: inset 0 0 18px rgba(34, 211, 238, .08); }
.az-ib--plain { width: auto; height: auto; background: none; border: 0; box-shadow: none !important; }

/* Liste mit Häkchen */
.az-checklist { list-style: none; padding: 0; margin: 0 0 1em; }
.az-checklist li { position: relative; padding-left: 1.9rem; }
.az-checklist li + li { margin-top: .6rem; }
.az-checklist li::before {
	content: ""; position: absolute; left: 0; top: .3em; width: 1.15rem; height: 1.15rem; border-radius: 50%;
	background: var(--az-petrol);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='12'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='12'/%3E%3C/svg%3E") center / contain no-repeat;
	opacity: .14;
}
.az-checklist li::after {
	content: ""; position: absolute; left: .22rem; top: calc(.3em + .22rem); width: .72rem; height: .72rem;
	background: var(--az-petrol);
	-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='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%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='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.az-section--dark .az-checklist li::before, .az-section--ink .az-checklist li::before,
.az-section--dark .az-checklist li::after, .az-section--ink .az-checklist li::after { background: var(--az-cyan); }
.az-checklist--cols { columns: 2 280px; column-gap: 2.5rem; }
.az-checklist--cols li { break-inside: avoid; }
.az-checklist--cols li + li { margin-top: 0; }
.az-checklist--cols li { margin-bottom: .6rem; }

/* Nummerierte Leistungsliste (12 Leistungen) */
.az-numlist { list-style: none; counter-reset: az-num; padding: 0; margin: 0; display: grid; gap: 0; border-top: 1px solid var(--az-line); }
@media (min-width: 860px) { .az-numlist { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 3rem; } }
.az-numlist li { counter-increment: az-num; position: relative; margin: 0; padding: 1rem 0 1rem 3.25rem; border-bottom: 1px solid var(--az-line); font-weight: 500; }
.az-numlist li::before { content: counter(az-num, decimal-leading-zero); position: absolute; left: 0; top: 1.1rem; font: 500 .8125rem/1.4 var(--az-font-mono); color: var(--az-petrol); letter-spacing: .06em; }
.az-section--dark .az-numlist, .az-section--dark .az-numlist li, .az-section--ink .az-numlist, .az-section--ink .az-numlist li { border-color: var(--az-line-dark); }
.az-section--dark .az-numlist li::before, .az-section--ink .az-numlist li::before { color: var(--az-cyan); }

/* Panel (z. B. „Was Sie liefern / Was wir übernehmen“) */
.az-panel { padding: clamp(1.5rem, 1.2rem + 1.2vw, 2.25rem); border-radius: var(--az-radius); background: var(--az-white); border: 1px solid var(--az-line); }
.az-panel h3 { display: flex; align-items: center; gap: .75rem; margin: 0 0 1.1rem; }
.az-panel .az-ib + h3 { margin-top: 1rem; }
.az-panel .az-ib { width: 40px; height: 40px; }
.az-panel--accent { background: var(--az-ink); color: var(--az-on-dark); border-color: var(--az-ink); }
.az-panel--accent .az-ib { color: var(--az-cyan); background: var(--az-cyan-soft); border-color: rgba(34, 211, 238, .28); }
.az-panel--accent .az-checklist li::before, .az-panel--accent .az-checklist li::after { background: var(--az-cyan); }
.az-panel--accent p { color: var(--az-muted-dark); }
.az-panel--accent a:not(.wp-block-button__link), .az-callout a:not(.wp-block-button__link) { color: var(--az-cyan); }
.az-panel--accent a:not(.wp-block-button__link):hover, .az-callout a:not(.wp-block-button__link):hover { color: #67E8F9; }

/* Hinweis-Kasten (z. B. Genauigkeitsprinzip) */
.az-callout {
	position: relative; display: grid; gap: 0 1.5rem; align-items: start;
	padding: clamp(1.5rem, 1.2rem + 1.4vw, 2.5rem); border-radius: var(--az-radius);
	background: var(--az-ink); color: var(--az-on-dark); overflow: hidden;
	border: 1px solid rgba(34, 211, 238, .22);
}
.az-callout::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: linear-gradient(180deg, var(--az-cyan), var(--az-petrol)); }
.az-callout h2, .az-callout h3 { margin: 0 0 .5rem; }
.az-callout p { color: var(--az-muted-dark); }
.az-callout .az-ib { color: var(--az-cyan); background: var(--az-cyan-soft); border-color: rgba(34, 211, 238, .28); }
.az-callout > .az-ib { margin-bottom: 1rem; } /* Überschrift näher am eigenen Text als am Symbol */
@media (min-width: 760px) {
	/* Symbol links über Überschrift und Text; ohne feste Spalte rutscht der Text unter das Symbol
	   und drückt die Überschrift in einen schmalen Rest am rechten Rand */
	.az-callout { grid-template-columns: auto minmax(0, 1fr); }
	.az-callout > .az-ib { grid-row: 1 / span 2; margin-bottom: 0; }
	.az-callout > :not(.az-ib) { grid-column: 2; }
}

/* Schritte 01–04 */
.az-steps { display: grid; gap: 1rem; counter-reset: az-step; position: relative; }
@media (min-width: 640px) { .az-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .az-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; } }
.az-step { counter-increment: az-step; position: relative; padding: 1.5rem 1.4rem 1.6rem; border-radius: var(--az-radius); border: 1px solid var(--az-line); background: var(--az-white); }
.az-step::before {
	content: counter(az-step, decimal-leading-zero) " / 04";
	display: flex; align-items: center; gap: .6rem; margin-bottom: 1.25rem;
	font: 500 .78rem/1 var(--az-font-mono); letter-spacing: .12em; color: var(--az-petrol);
}
.az-step::after { content: ""; position: absolute; left: 1.4rem; right: 1.4rem; top: 3.05rem; height: 1px; background: linear-gradient(90deg, var(--az-line), transparent); }
.az-step h3 { margin: 0 0 .5rem; }
.az-step p { color: var(--az-muted); font-size: 1rem; }
.az-section--dark .az-step, .az-section--ink .az-step { background: rgba(255, 255, 255, .03); border-color: var(--az-line-dark); }
.az-section--dark .az-step::before, .az-section--ink .az-step::before { color: var(--az-cyan); }
.az-section--dark .az-step::after, .az-section--ink .az-step::after { background: linear-gradient(90deg, rgba(34, 211, 238, .5), transparent); }
.az-section--dark .az-step p, .az-section--ink .az-step p { color: var(--az-muted-dark); }

/* Plattformen (nur Namen, keine Logos) */
.az-platforms { display: grid; gap: .75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 760px) { .az-platforms { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .az-platforms { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.az-platform { padding: 1.1rem 1.15rem 1.2rem; border-radius: 12px; border: 1px solid var(--az-line); background: var(--az-white); }
.az-platform p { margin: 0; }
.az-platform p:first-child { font: 600 1.15rem/1.2 var(--az-font-head); letter-spacing: -.01em; }
.az-platform p + p { margin-top: .35rem; font: 400 .75rem/1.35 var(--az-font-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--az-muted); }
.az-section--dark .az-platform, .az-section--ink .az-platform { background: rgba(255, 255, 255, .03); border-color: var(--az-line-dark); }
.az-section--dark .az-platform p + p, .az-section--ink .az-platform p + p { color: var(--az-muted-dark); }

/* Verkaufs-Bausteine (1.1.0) */

/* Akzent in Überschriften: <em> = Farbe statt Kursiv */
.az-section :is(h1, h2) em { font-style: normal; color: var(--az-petrol); }
.az-section--dark :is(h1, h2) em, .az-section--ink :is(h1, h2) em { color: var(--az-cyan); }

/* Vorher/Nachher-Vergleich („Ohne Unterstützung“ ↔ „Mit AI Zentra“) */
.az-split--compare { position: relative; max-width: 1040px; margin-inline: auto; align-items: stretch; }
.az-split--compare .az-panel--accent { box-shadow: 0 30px 70px -35px rgba(14, 116, 144, .6); }
@media (min-width: 860px) {
	.az-split--compare::before {
		content: ""; position: absolute; z-index: 2; left: 50%; top: 50%; width: 46px; height: 46px; border-radius: 50%;
		transform: translate(-50%, -50%);
		background: var(--az-petrol) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 20px no-repeat;
		box-shadow: 0 0 0 6px var(--az-paper), 0 10px 30px -10px rgba(14, 116, 144, .7);
	}
}

/* Panel „ohne Unterstützung“: gedämpft, x statt Haken */
.az-panel--minus { background: var(--az-white); }
.az-section--white .az-panel--minus { background: var(--az-paper); }
.az-panel--minus .az-ib { color: var(--az-muted); background: rgba(71, 85, 105, .07); border-color: rgba(71, 85, 105, .16); }
.az-panel--minus .az-checklist li { color: var(--az-muted); }
.az-panel--minus .az-checklist li::before { background: var(--az-muted); }
.az-panel--minus .az-checklist li::after {
	background: var(--az-muted);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");
}

/* Plattform-Band unter dem Hero. Ohne JS / „Bewegung reduzieren“: normales Raster.
   Mit JS (site.js): Liste doppelt, läuft endlos, Pause per Knopf, Maus oder Tastaturfokus. */
.az-ticker { border-block: 1px solid var(--az-line-dark); }
.az-ticker__label { margin: 0 0 1.1rem; text-align: center; font: 500 .75rem/1.3 var(--az-font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--az-muted-dark); }
.az-ticker .az-note { margin: 1.1rem auto 0; text-align: center; max-width: 80ch; font-size: .8rem; }
.az-marquee { position: relative; }
.az-marquee__view {
	overflow: hidden; padding-block: 2px;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.az-platforms--marquee.is-marquee { display: flex; gap: 0; width: max-content; animation: az-marquee 38s linear infinite; }
.is-marquee .az-platform { flex: none; display: flex; align-items: baseline; gap: .65rem; margin-right: .75rem; padding: .7rem 1.25rem; border-radius: 999px; white-space: nowrap; }
.is-marquee .az-platform p + p { margin-top: 0; }
.az-marquee:hover .is-marquee, .az-marquee:focus-within .is-marquee, .az-marquee.is-paused .is-marquee { animation-play-state: paused; }
.az-marquee__toggle {
	position: absolute; z-index: 2; right: 0; top: 50%; transform: translateY(-50%);
	display: inline-flex; align-items: center; justify-content: center; gap: 3px;
	width: 36px; height: 36px; padding: 0; border-radius: 50%; cursor: pointer;
	border: 1px solid var(--az-line-dark); background: var(--az-ink); color: var(--az-on-dark);
}
.az-marquee__toggle::before, .az-marquee__toggle::after { content: ""; width: 3px; height: 12px; border-radius: 1px; background: currentColor; }
.az-marquee__toggle[aria-pressed="true"]::after { display: none; }
.az-marquee__toggle[aria-pressed="true"]::before { width: 0; height: 0; margin-left: 3px; border-radius: 0; background: none; border-style: solid; border-width: 7px 0 7px 11px; border-color: transparent transparent transparent currentColor; }
.az-marquee__toggle:hover { border-color: var(--az-cyan); color: #fff; }
@keyframes az-marquee { to { transform: translateX(-50%); } }

/* Leistungs-Karten mit Nummer 01–05 */
.az-services { counter-reset: az-svc; }
.az-services .az-card--service { counter-increment: az-svc; }
.az-services .az-card--service::after {
	content: counter(az-svc, decimal-leading-zero); position: absolute; top: 1.55rem; right: 1.6rem;
	font: 500 .78rem/1 var(--az-font-mono); letter-spacing: .12em; color: var(--az-muted);
}

/* Ablauf in drei Schritten */
.az-steps--3 .az-step::before { content: counter(az-step, decimal-leading-zero) " / 03"; }
@media (min-width: 760px) { .az-steps--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.wp-block-buttons.az-center { justify-content: center; margin-top: clamp(2rem, 1.6rem + 1.5vw, 3rem); }

/* Schnellstart: Bereich wählen → Formular vorausgefüllt */
.az-choose { overflow: hidden; }
.az-choose::before {
	content: ""; position: absolute; pointer-events: none; left: 50%; top: 50%; width: 900px; height: 520px; transform: translate(-50%, -50%);
	background: radial-gradient(closest-side, rgba(34, 211, 238, .12), rgba(14, 116, 144, .05) 55%, transparent 75%);
}
.az-choose .az-wrap { position: relative; }
.wp-block-buttons.az-chooser { justify-content: center; gap: .75rem; max-width: 720px; margin: 0 auto; }
.az-chooser .wp-block-button__link::after {
	content: ""; display: inline-block; flex: none; width: 16px; height: 16px; margin-left: .5rem; vertical-align: -3px; background: currentColor; transition: transform .2s var(--az-ease);
	-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='2.4' stroke-linecap='round' stroke-linejoin='round'%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='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}
.az-chooser .wp-block-button__link:hover::after { transform: translateX(3px); }

/* FAQ (Kern-Block „Details“) */
.az-faq { max-width: 880px; border-top: 1px solid var(--az-line); }
.az-head--center + .az-faq { margin-inline: auto; }
.wp-block-details { margin: 0; }
.az-faq > .wp-block-details, .az-faq__item { border-bottom: 1px solid var(--az-line); }
.wp-block-details summary {
	position: relative; display: block; list-style: none; cursor: pointer;
	padding: 1.25rem 3rem 1.25rem 0; font: 600 1.075rem/1.4 var(--az-font-head); letter-spacing: -.005em;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::before, .wp-block-details summary::after {
	content: ""; position: absolute; right: .55rem; top: 50%; width: 14px; height: 1.75px; border-radius: 2px;
	background: var(--az-petrol); transition: transform .25s var(--az-ease);
}
.wp-block-details summary::after { transform: rotate(90deg); }
.wp-block-details[open] summary::after { transform: rotate(0deg); }
.wp-block-details summary:hover { color: var(--az-petrol); }
.wp-block-details > :not(summary) { margin: 0 0 1rem; padding-right: 3rem; color: var(--az-muted); }
.wp-block-details > :last-child:not(summary) { margin-bottom: 1.4rem; }
.az-section--dark .az-faq, .az-section--dark .az-faq > .wp-block-details { border-color: var(--az-line-dark); }
.az-section--dark .wp-block-details summary::before, .az-section--dark .wp-block-details summary::after { background: var(--az-cyan); }
.az-section--dark .wp-block-details > :not(summary) { color: var(--az-muted-dark); }

/* Muster-Listing (eBay-Seite) – deutlich als Muster gekennzeichnet */
.az-sample {
	position: relative; padding: clamp(1.4rem, 1.1rem + 1.4vw, 2.25rem); border-radius: var(--az-radius);
	background: var(--az-white); border: 1px dashed #D4A017; box-shadow: var(--az-shadow);
}
.az-badge {
	display: inline-flex; align-items: center; gap: .45rem; margin: 0 0 1rem;
	padding: .35rem .7rem; border-radius: 999px;
	background: var(--az-amber-bg); color: var(--az-amber-text);
	font: 500 .75rem/1.2 var(--az-font-mono); letter-spacing: .08em; text-transform: uppercase;
}
.az-badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #D97706; }
.az-sample h3 { font-size: clamp(1.1rem, 1.02rem + .35vw, 1.3rem); margin: 0 0 1rem; }
.az-sample .wp-block-table { margin: 0 0 1rem; }
.az-ph, .az-sample td em, .az-sample h3 em, .az-sample li em { font-family: var(--az-font-mono); font-style: normal; font-size: .875em; color: var(--az-amber-text); background: var(--az-amber-bg); padding: .1em .4em; border-radius: 4px; }

/* Tabellen (Kern-Block „Tabelle“). Die Kern-Stile laden NACH main.css (volles Gitter, 3-px-Kopflinie,
   word-break mitten im Wort) – daher figure.wp-block-table (Spezifität 0,1,1 + Element) statt .wp-block-table. */
figure.wp-block-table { margin: 0 0 1.5rem; overflow-x: auto; }
figure.wp-block-table table { width: 100%; border-collapse: collapse; font-size: .9375rem; }
figure.wp-block-table thead { border-bottom: 1px solid var(--az-line); }
figure.wp-block-table :is(th, td) {
	padding: .7rem .85rem; text-align: left; vertical-align: top;
	border: 0; border-bottom: 1px solid var(--az-line); word-break: normal; overflow-wrap: break-word;
}
figure.wp-block-table th { font: 500 .75rem/1.3 var(--az-font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--az-muted); }
figure.wp-block-table :is(th, td):first-child { width: 38%; }
figure.wp-block-table td:first-child { color: var(--az-muted); font-weight: 500; }
figure.wp-block-table figcaption { margin-top: .6rem; font-size: .8125rem; color: var(--az-muted); }
.az-sample td em { -webkit-box-decoration-break: clone; box-decoration-break: clone; }
/* Handy: Merkmal als kleine Beschriftung über dem Inhalt – zwei schmale Spalten brächen Wörter wie
   „Fahrzeugzuordnung“ mitten im Wort um. Der Tabellenkopf bleibt für Screenreader erhalten. */
@media (max-width: 559px) {
	figure.wp-block-table :is(table, tbody, tr, td) { display: block; width: auto; }
	figure.wp-block-table thead {
		position: absolute; width: 1px; height: 1px; overflow: hidden;
		clip-path: inset(50%); white-space: nowrap; border: 0;
	}
	figure.wp-block-table tr { padding: .65rem 0; border-bottom: 1px solid var(--az-line); }
	figure.wp-block-table tbody tr:first-child { border-top: 1px solid var(--az-line); }
	figure.wp-block-table td { padding: 0; border: 0; }
	figure.wp-block-table td:first-child {
		width: auto; margin-bottom: .2rem;
		font: 500 .6875rem/1.4 var(--az-font-mono); letter-spacing: .08em; text-transform: uppercase;
	}
}

/* Bild */
.wp-block-image { margin: 0 0 1.5rem; }
.wp-block-image img { border-radius: var(--az-radius); }
.wp-block-image figcaption { margin-top: .6rem; font-size: .875rem; color: var(--az-muted); }

/* Aufruf-Band (CTA) */
.az-cta { overflow: hidden; }
.az-cta::after {
	content: ""; position: absolute; left: 50%; bottom: -420px; width: 1100px; height: 640px; transform: translateX(-50%); pointer-events: none;
	background: radial-gradient(closest-side, rgba(34, 211, 238, .18), rgba(14, 116, 144, .08) 50%, transparent 72%);
}
.az-cta .az-head { margin-bottom: 0; }

/* Fließtext-Seiten (Impressum, Datenschutz, neue Seiten) */
.az-prose { max-width: calc(760px + 2 * var(--az-gutter)); }
.az-prose h2 { font-size: clamp(1.35rem, 1.2rem + .7vw, 1.75rem); margin-top: 2.5rem; }
.az-prose h3 { margin-top: 1.75rem; }
.az-prose > :first-child { margin-top: 0; }
.az-prose ul, .az-prose ol { padding-left: 1.3em; }
.az-vorlage {
	/* Fließtext statt flex: sonst wird jedes Inline-Element (fettes Stichwort, Link) zur eigenen schmalen Spalte */
	display: block; margin: 0 0 2rem; padding: 1rem 1.15rem;
	border-radius: 10px; background: var(--az-amber-bg); color: var(--az-amber-text); border: 1px solid #F3D27A; font-size: .9375rem;
}

/* Bindestrich-Wort in Überschriften zusammenhalten (inc/typografie.php) */
.az-nobr { white-space: nowrap; }

/* Platzhalter für fehlende Firmendaten */
.az-platzhalter {
	display: inline-block; padding: .05em .45em; border: 1px dashed #D97706; border-radius: 4px;
	background: var(--az-amber-bg); color: var(--az-amber-text);
	font: 500 .85em/1.4 var(--az-font-mono);
}

/* 7 ─ Hero-Visual: Aufgaben-Zentrale – fünf Bereiche wechseln nacheinander auf „erledigt“ (beispielhafte Darstellung)
   Ohne JS oder bei „Bewegung reduzieren“ steht sofort alles auf „erledigt“; die Animation läuft einmal (~5 s) und endet. */
.az-hv { position: relative; margin: 0; max-width: 540px; justify-self: center; width: 100%; font-size: .875rem; color: var(--az-on-dark); }
.az-hv__badge {
	position: absolute; z-index: 3; right: 0; top: -14px;
	display: inline-flex; align-items: center; gap: .4rem; margin: 0; padding: .3rem .65rem; border-radius: 999px;
	background: var(--az-amber-bg); color: var(--az-amber-text);
	font: 500 .7rem/1.2 var(--az-font-mono); letter-spacing: .06em; text-transform: uppercase;
}
.az-hv__badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #D97706; }
.az-hv__panel {
	position: relative; overflow: hidden; border-radius: var(--az-radius); border: 1px solid rgba(34, 211, 238, .3);
	background: linear-gradient(180deg, rgba(18, 32, 58, .88), rgba(10, 20, 36, .88));
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	box-shadow: 0 0 0 1px rgba(34, 211, 238, .06), 0 30px 80px -30px rgba(34, 211, 238, .32), 0 30px 80px -40px rgba(0, 0, 0, .8);
}
.az-hv__bar { display: flex; align-items: center; gap: .5rem; padding: .65rem .9rem; border-bottom: 1px solid var(--az-line-dark); font: 400 .75rem/1 var(--az-font-mono); color: var(--az-muted-dark); letter-spacing: .03em; }
.az-hv__dots { display: inline-flex; gap: 5px; margin-right: .3rem; }
.az-hv__dots i { width: 7px; height: 7px; border-radius: 50%; background: rgba(163, 179, 199, .35); }
.az-hv__top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .25rem .75rem; padding: 1rem 1.1rem .55rem; }
.az-hv__title { margin: 0; font: 600 1.05rem/1.3 var(--az-font-head); color: #fff; letter-spacing: -.005em; }
.az-hv__sub { margin: 0; font: 400 .7rem/1.3 var(--az-font-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--az-muted-dark); }
.az-hv__list { display: grid; gap: .45rem; margin: 0; padding: .2rem .8rem .6rem; list-style: none; }
.az-hv__row {
	display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: .75rem;
	margin: 0; padding: .6rem .7rem; border-radius: 10px;
	border: 1px solid var(--az-line-dark); background: rgba(255, 255, 255, .025);
}
.az-hv__ico { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 10px; color: var(--az-cyan); background: var(--az-cyan-soft); border: 1px solid rgba(34, 211, 238, .25); }
.az-hv__ico .az-i { width: 19px; height: 19px; }
.az-hv__txt { display: grid; gap: .1rem; min-width: 0; }
.az-hv__txt b { font: 600 .9rem/1.25 var(--az-font-head); color: #fff; }
.az-hv__txt small { font-size: .75rem; line-height: 1.35; color: var(--az-muted-dark); }
.az-hv__st { display: grid; justify-items: end; }
.az-hv__st > * { grid-area: 1 / 1; }
.az-hv__busy, .az-hv__done {
	display: inline-flex; align-items: center; gap: .35rem; padding: .25rem .55rem; border-radius: 999px; white-space: nowrap;
	font: 500 .66rem/1.2 var(--az-font-mono); letter-spacing: .06em; text-transform: uppercase;
}
.az-hv__busy { visibility: hidden; opacity: 0; color: #FCD34D; background: rgba(251, 191, 36, .1); border: 1px solid rgba(251, 191, 36, .3); }
.az-hv__busy::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.az-hv__done { color: #6EE7B7; background: rgba(16, 185, 129, .1); border: 1px solid rgba(110, 231, 183, .3); }
.az-hv__done .az-i { width: 13px; height: 13px; }
.az-hv__progress { height: 4px; margin: .35rem 1.1rem 1.15rem; border-radius: 999px; background: rgba(255, 255, 255, .07); overflow: hidden; }
.az-hv__progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--az-petrol), var(--az-cyan)); box-shadow: 0 0 12px rgba(34, 211, 238, .6); transform-origin: left center; }
.az-hv__scan { position: absolute; left: 0; right: 0; top: 0; height: 40%; pointer-events: none; background: linear-gradient(180deg, transparent, rgba(34, 211, 238, .09) 80%, rgba(34, 211, 238, .55) 99%, transparent); opacity: 0; }
.az-hv__float {
	position: absolute; z-index: 3; left: -14px; bottom: -20px;
	display: inline-flex; align-items: center; gap: .45rem; margin: 0; padding: .55rem .95rem; border-radius: 999px;
	background: var(--az-cyan); color: var(--az-night); font: 600 .84rem/1.2 var(--az-font-body);
	box-shadow: var(--az-glow), 0 18px 40px -18px rgba(0, 0, 0, .7);
}
.az-hv__float .az-i { width: 16px; height: 16px; }
@media (max-width: 480px) {
	.az-hv__row { grid-template-columns: 32px minmax(0, 1fr) auto; gap: .55rem; padding: .5rem .55rem; }
	.az-hv__ico { width: 32px; height: 32px; border-radius: 8px; }
	.az-hv__ico .az-i { width: 16px; height: 16px; }
	.az-hv__list { padding-inline: .55rem; }
	.az-hv__float { left: 8px; bottom: -18px; }
}
@media (max-width: 380px) {
	.az-hv__txt small, .az-hv__sub { display: none; }
}

/* Animation nur mit JavaScript und ohne „Bewegung reduzieren“ */
@media (prefers-reduced-motion: no-preference) {
	.js-reveal .az-hv__row:nth-child(1) { --d: 1.2s; }
	.js-reveal .az-hv__row:nth-child(2) { --d: 1.9s; }
	.js-reveal .az-hv__row:nth-child(3) { --d: 2.6s; }
	.js-reveal .az-hv__row:nth-child(4) { --d: 3.3s; }
	.js-reveal .az-hv__row:nth-child(5) { --d: 4s; }
	.js-reveal .az-hv__row { animation: az-hv-flash 1s ease var(--d, 0s); }
	.js-reveal .az-hv__busy { visibility: visible; opacity: 1; animation: az-hv-out .25s ease var(--d, 0s) forwards; }
	.js-reveal .az-hv__busy::before { animation: az-hv-pulse 1s ease-in-out infinite; }
	.js-reveal .az-hv__done { opacity: 0; transform: scale(.8); animation: az-hv-in .4s var(--az-ease) var(--d, 0s) forwards; }
	.js-reveal .az-hv__progress span { transform: scaleX(0); animation: az-hv-bar 4s ease forwards; }
	.js-reveal .az-hv__scan { animation: az-scan 2.2s var(--az-ease) .5s 1 forwards; }
	.js-reveal .az-hv__float { opacity: 0; transform: translateY(10px); animation: az-hv-in .6s var(--az-ease) 4.5s forwards; }
}
@keyframes az-hv-in { to { opacity: 1; transform: none; } }
@keyframes az-hv-out { to { opacity: 0; visibility: hidden; } }
@keyframes az-hv-pulse { 50% { opacity: .3; } }
@keyframes az-hv-flash { 0% { border-color: rgba(34, 211, 238, .65); background: rgba(34, 211, 238, .1); } }
@keyframes az-hv-bar { 0% { transform: scaleX(0); } 30% { transform: scaleX(.2); } 47.5% { transform: scaleX(.4); } 65% { transform: scaleX(.6); } 82.5% { transform: scaleX(.8); } 100% { transform: scaleX(1); } }
@keyframes az-scan { 0% { transform: translateY(-100%); opacity: 1; } 85% { opacity: 1; } 100% { transform: translateY(260%); opacity: 0; } }

/* 8 ─ Kontaktformular */
.az-contact { display: grid; gap: clamp(2rem, 1.5rem + 3vw, 4rem); align-items: start; }
@media (min-width: 1000px) { .az-contact { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); } }
.az-form-card { padding: clamp(1.4rem, 1.1rem + 1.4vw, 2.5rem); border-radius: var(--az-radius); background: var(--az-white); border: 1px solid var(--az-line); box-shadow: var(--az-shadow); color: var(--az-text); }
.az-form { display: grid; gap: 1.15rem; }
.az-form__row { display: grid; gap: 1.15rem; }
@media (min-width: 640px) { .az-form__row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.az-field { display: grid; gap: .4rem; min-width: 0; }
.az-field label, .az-field__label { font-weight: 600; font-size: .9375rem; }
.az-field__opt { font-weight: 400; color: var(--az-muted); font-size: .875rem; }
.az-field__req { color: var(--az-danger); }
.az-field input, .az-field select, .az-field textarea {
	width: 100%; min-height: 48px; padding: .7rem .9rem;
	border: 1px solid #B8C4D2; border-radius: 10px; background: #fff; color: var(--az-text);
	font: 400 1rem/1.4 var(--az-font-body);
	transition: border-color .15s, box-shadow .15s;
}
.az-field textarea { min-height: 150px; resize: vertical; }
.az-field select {
	-webkit-appearance: none; appearance: none; padding-right: 2.5rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right .8rem center; background-size: 18px;
}
.az-field input:hover, .az-field select:hover, .az-field textarea:hover { border-color: #8496AB; }
.az-field input:focus-visible, .az-field select:focus-visible, .az-field textarea:focus-visible { outline: none; border-color: var(--az-petrol); box-shadow: 0 0 0 3px rgba(14, 116, 144, .22); }
.az-field [aria-invalid="true"] { border-color: var(--az-danger); box-shadow: 0 0 0 1px var(--az-danger); }
.az-field__hint { font-size: .8125rem; color: var(--az-muted); margin: 0; }
.az-field__error { display: flex; gap: .35rem; align-items: flex-start; margin: 0; font-size: .875rem; font-weight: 500; color: var(--az-danger); }
.az-field__error:empty { display: none; }
.az-form__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.az-form__privacy { margin: 0; font-size: .875rem; color: var(--az-muted); }
.az-form__submit { justify-self: start; min-width: 200px; }
.az-form__submit[disabled] { opacity: .7; cursor: progress; }
.az-form__submit .az-spinner { width: 16px; height: 16px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: az-spin .8s linear infinite; display: none; }
.az-form.is-sending .az-spinner { display: inline-block; }
@keyframes az-spin { to { transform: rotate(360deg); } }
.az-form__status { border-radius: 10px; padding: 1rem 1.1rem; font-size: .9375rem; }
.az-form__status:empty { display: none; }
.az-form__status.is-error { background: #FEF3F2; color: #7A271A; border: 1px solid #FECDCA; }
.az-form__status.is-success { background: #ECFDF3; color: #054F31; border: 1px solid #ABEFC6; }
.az-form__status strong { display: block; margin-bottom: .2rem; }
.az-form__status a { color: inherit; font-weight: 600; }
.az-form-done { text-align: left; }
.az-form-done .az-ib { color: var(--az-ok); background: #ECFDF3; border-color: #ABEFC6; margin-bottom: 1rem; }

/* 9 ─ Firmendaten-Block */
.az-fd { display: grid; gap: 1rem; margin: 0; }
.az-fd__row { position: relative; min-height: 44px; padding-left: calc(44px + .9rem); }
.az-fd__row .az-ib { position: absolute; left: 0; top: 0; width: 44px; height: 44px; }
.az-fd dt { font: 500 .75rem/1.3 var(--az-font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--az-muted); margin: .1rem 0 .2rem; }
.az-fd dd { margin: 0; font-weight: 500; overflow-wrap: anywhere; }
.az-section--dark .az-fd dt, .az-section--ink .az-fd dt { color: var(--az-muted-dark); }
.az-fd--impressum { gap: 0; border-top: 1px solid var(--az-line); }
.az-fd--impressum .az-fd__row { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); gap: .9rem; min-height: 0; padding: .8rem 0; border-bottom: 1px solid var(--az-line); }
.az-fd--impressum dt { margin: .2rem 0 0; }
.az-fd--impressum .az-fd__row, .az-fd--kurz .az-fd__row:not(:has(.az-ib)) { padding-left: 0; }
@media (max-width: 560px) { .az-fd--impressum .az-fd__row { grid-template-columns: 1fr; gap: .2rem; } }

/* 10 ─ Fußzeile */
.az-footer { position: relative; background: var(--az-night); color: var(--az-muted-dark); font-size: .9375rem; border-top: 1px solid var(--az-line-dark); }
.az-footer::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 1px; background: linear-gradient(90deg, transparent, rgba(34, 211, 238, .55), transparent); }
.az-footer__grid { display: grid; gap: 2.5rem; padding-block: clamp(3.5rem, 3rem + 2.5vw, 5rem) 2.5rem; }
@media (min-width: 700px) { .az-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1080px) { .az-footer__grid { grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr)); } }
.az-footer__brand p { max-width: 36ch; margin: 1.1rem 0 1.5rem; }
.az-footer__title { margin: 0 0 1rem; font: 500 .75rem/1.3 var(--az-font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--az-on-dark); }
.az-footer__links, .az-footer__legal { list-style: none; margin: 0; padding: 0; }
.az-footer__links li + li { margin-top: .55rem; }
.az-footer a:not(.az-btn) { color: var(--az-muted-dark); text-decoration: none; }
.az-footer a:not(.az-btn):hover { color: #fff; text-decoration: underline; }
.az-footer__address { line-height: 1.6; margin-bottom: 1rem; }
.az-footer__address strong { color: var(--az-on-dark); font-weight: 600; }
.az-footer__mail { display: flex; align-items: center; gap: .5rem; margin: 0 0 .4rem; }
.az-footer__mail .az-i { color: var(--az-cyan); }
.az-footer__bottom { display: grid; gap: .75rem 2rem; padding-block: 1.5rem 2rem; border-top: 1px solid var(--az-line-dark); font-size: .8125rem; }
@media (min-width: 900px) { .az-footer__bottom { grid-template-columns: auto 1fr; align-items: center; } .az-footer__legal { justify-self: end; } }
.az-footer__copy { margin: 0; }
.az-footer__legal { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; }
.az-footer__legal li { margin: 0; }
.az-footer__note { grid-column: 1 / -1; margin: 0; max-width: 110ch; color: rgba(163, 179, 199, .82); font-size: .78rem; line-height: 1.55; }

/* 404 */
.az-404 { min-height: 56vh; display: flex; align-items: center; }
.az-404__links { display: flex; flex-wrap: wrap; gap: .75rem; list-style: none; margin: 2rem 0 0; padding: 0; }
.az-404__links li { margin: 0; }

/* 11 ─ Einblenden beim Scrollen (nur mit JS; ohne „Bewegung reduzieren“)
   :where() hält die Versteck-Regel leicht (0,3,0) – sonst schlägt sie „.is-in“ (0,4,0) und alles bleibt unsichtbar. */
.js-reveal .az-section:where(:not(.az-hero):not(.az-pagehero)) :is(.az-head, .az-card, .az-step, .az-panel, .az-callout, .az-platform, .az-sample, .az-form-card, .az-numlist, .az-faq, .az-chooser) {
	opacity: 0; transform: translateY(18px);
	transition: opacity .7s var(--az-ease), transform .7s var(--az-ease);
	transition-delay: var(--az-delay, 0s);
}
.js-reveal .az-section :is(.az-head, .az-card, .az-step, .az-panel, .az-callout, .az-platform, .az-sample, .az-form-card, .az-numlist, .az-faq, .az-chooser).is-in { opacity: 1; transform: none; }
.js-reveal .az-section .az-card.is-in:hover { transform: translateY(-3px); transition-delay: 0s; }
.js-reveal .az-hero .az-hero__grid > *, .js-reveal .az-pagehero .az-head { animation: az-rise .8s var(--az-ease) both; }
.js-reveal .az-hero .az-hero__grid > :nth-child(2) { animation-delay: .15s; }
@keyframes az-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* 12 ─ Hilfsklassen & Druck */
.az-center { text-align: center; }
.az-mono { font-family: var(--az-font-mono); }
.az-mt-0 { margin-top: 0 !important; }
.az-space { margin-top: clamp(2rem, 1.6rem + 2vw, 3.5rem) !important; }

@media print {
	.az-header, .az-footer, .az-skip, .az-crumbs, .az-hv, .wp-block-buttons { display: none !important; }
	.az-section { padding-block: 1.5rem; background: #fff !important; color: #000 !important; }
	.az-section::before, .az-section::after { display: none; }
	.js-reveal * { opacity: 1 !important; transform: none !important; }
}
