/**
 * Startseite v2 — Portierung des Claude-Design-Entwurfs (27.08.2026)
 *
 * Der Entwurf kam als eine Datei mit Inline-Styles an jedem Element und einem
 * `min-width: 1100px` um alles. Beides ist für eine Live-Seite unbrauchbar:
 * Inline-Styles kann niemand pflegen, und der Mindestbreite-Rahmen hätte auf
 * jedem Telefon einen waagerechten Scrollbalken erzeugt.
 *
 * Hier stehen dieselben Werte als Klassen, plus die drei Stufen, die der
 * Entwurf nicht hatte (1100 / 900 / 600 px). Die Farben sind 1:1 aus dem
 * Entwurf übernommen — sie sind dunkler als das heutige Theme, das ist der
 * Charakter des Redesigns und Absicht.
 *
 * Geladen nur auf der v2-Seite (siehe includes/startseite-v2.php).
 */

/* ------------------------------------------------------------------
   Schriften — SELBST GEHOSTET, nicht von Google.
   ------------------------------------------------------------------
   Der Entwurf lud Outfit und Source Sans 3 per <link> von
   fonts.googleapis.com. Auf einem deutschen Shop ist das dasselbe Problem,
   das am 26.08.2026 bei Friendly Captcha behoben wurde: Jeder Seitenaufruf
   schickt die Besucher-IP an einen Google-Server, ohne Einwilligung und vor
   dem Cookie-Banner. Deshalb liegen die beiden Schriften (latin-Subset,
   variabel, zusammen 61 KB) im Theme unter assets/fonts/.

   `font-display: swap`: Der Text ist sofort in der Systemschrift da und
   wechselt, wenn die Schrift geladen ist. Das kostet einen Umbruchsprung,
   ist aber besser als unsichtbarer Text — und beide Dateien werden vorgeladen
   (siehe includes/startseite-v2.php).
   ------------------------------------------------------------------ */
/*
 * ZWEI Dateien, nicht sechs: Beides sind VARIABLE Schriften (fvar/gvar in der
 * Tabelle), die die ganze Gewichtsachse in einer Datei tragen. Der erste Anlauf
 * lud je Schnitt eine eigene URL — und holte damit dreimal dieselben 32 KB.
 * Aufgefallen ist es an den Dateigroessen: outfit-600/700/800 waren
 * byteidentisch (md5 98ccc2b7…). Mit dem Bereich `100 900` im Deskriptor setzt
 * der Browser die Achse selbst; gemessen unterscheiden sich 600, 700 und 800
 * danach genauso wie vorher (784,8 / 796,8 / 808,7 px auf „Handy Reparatur").
 * Gespart: 64 KB und vier Anfragen.
 *
 * `format('woff2')` genuegt — den Achsenbereich liest der Browser aus der
 * Datei. Das aeltere `woff2-variations` braucht keine aktuelle Fassung mehr,
 * und zwei `src`-Zeilen waeren ohnehin sinnlos: Die spaetere ueberschreibt die
 * fruehere komplett, statt als Rueckfallebene zu dienen.
 */
@font-face {
	font-family: 'Outfit'; font-style: normal; font-weight: 100 900; font-display: swap;
	src: url('fonts/outfit.woff2') format('woff2');
}
@font-face {
	font-family: 'Source Sans 3'; font-style: normal; font-weight: 200 900; font-display: swap;
	src: url('fonts/source-sans-3.woff2') format('woff2');
}

.v2 {
	--v2-ink: #101418;
	--v2-ink-2: #0A0C10;
	--v2-paper: #F4F4F1;
	--v2-line: #E4E4DE;
	--v2-line-2: #E0E0DA;
	--v2-brand: #0083C4;
	--v2-brand-hell: #009FE0;
	--v2-brand-dunkel: #006A9E;
	--v2-brand-eis: #4FB8E8;
	--v2-text: #40454C;
	--v2-text-2: #565B62;
	--v2-grau: #8A8E95;
	--v2-grau-hell: #B9BEC6;
	--v2-rand: 1240px;

	font-family: 'Source Sans 3', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	color: var(--v2-ink);
	/* Das Theme hat kein globales border-box (siehe style.css) — hier lokal. */
	box-sizing: border-box;
}
.v2 *, .v2 *::before, .v2 *::after { box-sizing: border-box; }
.v2 h1, .v2 h2, .v2 h3, .v2 .v2-outfit {
	font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	/*
	 * `color: inherit` ist hier keine Feinheit, sondern die Reparatur eines
	 * unsichtbaren Titels: theme.json setzt Ueberschriften global auf die
	 * Textfarbe `ink` (#0f172a). Auf dem dunklen Hero stand die H1 damit
	 * dunkelblau auf fast schwarz — beim ersten Testlauf praktisch unlesbar.
	 * Die Abschnitte bestimmen ihre Farbe, die Ueberschrift erbt sie.
	 */
	color: inherit;
}
.v2 a { color: inherit; text-decoration: none; }
/* Sprungziele muessen unter dem Sticky-Header landen, nicht dahinter
   (Kopfbereich 102px, gemessen 27.08.2026). #finder bringt das schon aus
   style.css mit; der Fairness-Preis-Abschnitt ist das zweite Ziel. */
.v2 section[id] { scroll-margin-top: 116px; }
.v2 p { margin: 0; }

/* Der Seitenrand: eine Variable, damit alle Abschnitte dieselbe Kante haben. */
.v2-inner { max-width: var(--v2-rand); margin-inline: auto; }
.v2-sec { padding: 88px 48px; }
.v2-sec--weiss  { background: #fff; }
.v2-sec--papier { background: var(--v2-paper); }
.v2-sec--blau   { background: var(--v2-brand); }
.v2-sec--dunkel { background: var(--v2-ink); color: #fff; }
.v2-sec--linie-oben { border-top: 1px solid var(--v2-line); }
.v2-sec--eng-oben { padding-top: 0; }

/* ---------- Abschnittskopf: Eyebrow, Titel, Link rechts ---------- */
.v2-eyebrow {
	font-family: 'Outfit', sans-serif; font-weight: 700; font-size: 13px;
	letter-spacing: .09em; text-transform: uppercase;
	color: var(--v2-brand-dunkel); margin-bottom: 10px;
}
.v2-h2 { font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 38px; margin: 0; letter-spacing: -.01em; text-wrap: balance; }
.v2-kopf { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 40px; }
.v2 .v2-mehr {
	font-weight: 700; font-size: 15.5px; color: var(--v2-ink);
	border-bottom: 2px solid var(--v2-brand); padding-bottom: 2px; white-space: nowrap;
	transition: color .15s ease, border-color .15s ease;
}
.v2 .v2-mehr:hover { color: var(--v2-brand-dunkel); border-color: var(--v2-brand-hell); }

/* ---------- Knöpfe ---------- */
.v2-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	font-family: 'Outfit', sans-serif; font-weight: 700; font-size: 15.5px;
	padding: 13px 24px; border-radius: 10px; border: 0; cursor: pointer;
	transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .08s ease;
}
.v2-btn:hover { transform: translateY(-1px); }
.v2 .v2-btn--blau { background: var(--v2-brand); color: #fff; }
.v2 .v2-btn--blau:hover { background: var(--v2-brand-hell); color: #fff; }
.v2 .v2-btn--dunkel { background: var(--v2-ink); color: #fff; }
.v2 .v2-btn--dunkel:hover { background: #2A2F36; color: #fff; }
.v2 .v2-btn--rand { border: 1.5px solid #3A4048; color: #fff; }
.v2 .v2-btn--rand:hover { border-color: var(--v2-brand-eis); color: var(--v2-brand-eis); }
.v2-btn--gross { font-size: 16.5px; padding: 15px 30px; }

/* ---------- Hero ----------

   Der Hero war bis zum 02.09.2026 fast schwarz (`--v2-ink`, #101418), so kam
   er aus dem Entwurf. Ali: „Findet ihr das schwarze passend? Farblich."
   Christos: „Das seh ich wie Ali. rest ist gut, aber Farbe im Header."

   Also Markenfarbe statt Schwarz — und zwar GENAU die der Zusagen-Leiste ganz
   oben (#025B89, gemessen). Damit lesen sich Leiste, weiße Kopfzeile und Hero
   als ein Block statt als drei Fremde. Der Verlauf darunter gibt Tiefe, ohne
   die Farbe zu wechseln: dieselbe Blaufamilie, nur nach unten dunkler.

   Nur der Hero wechselt. Die dunklen Vorteilskarten, der Abschluss-Aufruf und
   die dunklen Knöpfe bleiben, wie sie sind — „rest ist gut". Schwarz ist damit
   Akzent statt Grundton.

   Die vier Textfarben darunter sind an die neue Fläche angepasst, nicht aus
   Geschmack, sondern gerechnet: Auf Schwarz trug der Vorspann 9,8:1, auf dem
   Blau wären es mit derselben Farbe 3,9:1 gewesen — unter der Schwelle für
   Fließtext. Die gemessenen Werte stehen an den Regeln. */
.v2-hero {
	background: linear-gradient(180deg, #02628F 0%, #025B89 38%, #013E5E 100%);
	color: #fff; padding: 72px 48px 88px; position: relative; overflow: hidden;
}
.v2-hero::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	/* Der Schimmer war blau auf Schwarz; auf Blau braucht er einen helleren
	   Ton, sonst ist er nicht mehr zu sehen. */
	background: radial-gradient(900px 500px at 85% -10%, rgba(130, 214, 255, .20), transparent 60%);
}
.v2-hero__inner {
	max-width: var(--v2-rand); margin-inline: auto; position: relative;
	display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 620px); gap: 56px;
	/*
	 * `center` ist erst seit dem 27.08.2026 richtig. Vorher stand hier `start`,
	 * weil der Finder mit allen vier Schritten untereinander 1.050px hoch war —
	 * mittig ausgerichtet waere die Headline weit nach unten gerutscht. Seit der
	 * Finder in der kompakten Betriebsart laeuft, ist die Karte konstant 603px
	 * hoch (jede Stufe, jede Geraeteart, gemessen), und die 160px Unterschied
	 * zum Text verteilen sich mittig auf beide Seiten statt als leeres Viertel
	 * unten links zu stehen.
	 */
	align-items: center;
}
.v2-hero__pille {
	display: inline-flex; align-items: center; gap: 8px;
	/* Weiß auf durchscheinendem Weiß: 7,3:1. Das bisherige Eisblau auf dem
	   neuen Grund waere 3,3:1 gewesen, bei 13,5px Versalien zu wenig. */
	background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .38);
	color: #fff; font-family: 'Outfit', sans-serif; font-weight: 600;
	font-size: 13.5px; letter-spacing: .06em; text-transform: uppercase;
	padding: 6px 14px; border-radius: 999px; margin-bottom: 26px;
}
.v2-hero h1 {
	font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 56px; line-height: 1.06;
	margin: 0 0 22px; letter-spacing: -.015em; text-wrap: balance;
}
/* Ein helleres Eisblau: das bisherige (#4FB8E8) kam auf dem Blau auf 3,3:1
   und waere neben dem weißen Rest verwaschen gewesen. Dieses trägt 4,9:1 und
   bleibt sichtbar etwas anderes als Weiß. */
.v2-hero h1 span { color: #9BDCFF; }
/* 5,4:1 statt der 3,9:1, die --v2-grau-hell auf dem Blau getragen haette.
   Die Variable selbst bleibt unangetastet - sie steht auch anderswo. */
.v2-hero__lead { font-size: 19px; line-height: 1.55; color: #D8DEE5; margin: 0 0 34px; max-width: 52ch; }
.v2-hero .v2-usp svg { color: #9BDCFF; }
.v2-usp { display: flex; gap: 28px; flex-wrap: wrap; font-size: 15px; color: #DDE0E4; }
.v2-usp span { display: flex; gap: 8px; align-items: center; }
/* Der Haken ist ein SVG, kein Textzeichen: ein ✓ aus der Schrift sitzt je
   System unterschiedlich hoch (siehe Projektregel zu Icons). */
.v2-usp svg { width: 15px; height: 15px; flex-shrink: 0; color: var(--v2-brand-eis); stroke-width: 3; }

/* Der echte Reparatur-Finder sitzt im Hero. Er bringt sein eigenes Aussehen
   mit (assets/repair-finder.css) — hier nur der Rahmen, den der Entwurf
   vorsieht: weiße Karte mit tiefem Schatten auf dunklem Grund. */
.v2-finder .awfr {
	border-radius: 16px !important;
	box-shadow: 0 30px 80px rgba(0, 0, 0, .45) !important;
	border-color: transparent !important;
	margin: 0 !important;
}

/* ---------- Der Seitentitel gehoert hier nicht hin ----------
   page.html gibt „Startseite v2" als H1 ueber dem Inhalt aus. Auf einer
   Startseite ist der Hero die Ueberschrift; zwei H1 waeren zudem eine zu viel.
   Die Klasse setzt includes/startseite-v2.php an den <body>. */
body.edvr-startseite-v2 .wp-block-post-title { display: none; }
body.edvr-startseite-v2 .wp-site-blocks > main { padding-top: 0; margin-top: 0; }
body.edvr-startseite-v2 main > .wp-block-group:first-child { margin-top: 0; }

/* ---------- Bekannt aus ---------- */
.v2-bekannt { background: #fff; border-bottom: 1px solid var(--v2-line); padding: 20px 48px; }
.v2-bekannt .edvr-bekannt {
	max-width: var(--v2-rand); margin-inline: auto;
	margin-top: 0; padding-top: 0; border-top: 0;
	justify-content: space-between; gap: 24px 32px;
}
.v2-bekannt .edvr-bekannt__item { box-shadow: none; border-color: var(--v2-line-2); min-height: 40px; }

/* ---------- Ablauf: drei Schritte ---------- */
.v2-schritte { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.v2-schritt { background: #fff; border-radius: 14px; padding: 30px; border: 1px solid var(--v2-line); }
.v2-schritt__nr {
	font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 15px;
	background: var(--v2-ink); color: var(--v2-brand-eis);
	width: 36px; height: 36px; border-radius: 10px;
	display: flex; align-items: center; justify-content: center; margin-bottom: 18px;
}
.v2-schritt h3 { font-family: 'Outfit', sans-serif; font-weight: 700; font-size: 20px; margin: 0 0 8px; }
.v2-schritt p { color: var(--v2-text-2); line-height: 1.55; }

/* ---------- Warum: fünf dunkle Karten ---------- */
.v2-vorteile { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.v2-vorteil { background: var(--v2-ink); color: #fff; border-radius: 14px; padding: 26px 22px; }
.v2-vorteil__tag {
	font-family: 'Outfit', sans-serif; font-size: 12px; font-weight: 700;
	letter-spacing: .09em; text-transform: uppercase; color: var(--v2-brand-eis); margin-bottom: 12px;
}
.v2-vorteil__titel { font-family: 'Outfit', sans-serif; font-weight: 700; font-size: 18.5px; line-height: 1.25; margin-bottom: 8px; }
.v2-vorteil__text { font-size: 14.5px; color: var(--v2-grau-hell); line-height: 1.5; }

/* ---------- Zweispalter (Service, Award, Über uns, Umwelt) ---------- */
.v2-split { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
.v2-split--breit-links { grid-template-columns: 1.05fr 1fr; }
.v2-split--breit-rechts { grid-template-columns: 1fr 1.05fr; }
.v2-absatz { font-size: 17px; line-height: 1.6; color: var(--v2-text); margin: 0 0 14px; }
.v2-absatz:last-of-type { margin-bottom: 26px; }

.v2-liste { display: grid; gap: 12px; }
.v2-listenzeile {
	display: flex; gap: 16px; background: var(--v2-paper); border-radius: 12px;
	padding: 20px 22px; align-items: baseline;
}
.v2-listenzeile strong { font-family: 'Outfit', sans-serif; font-size: 16.5px; flex: 0 0 230px; }
.v2-listenzeile span { color: var(--v2-text-2); }
/* Umwelt-Variante: weiße Karten mit Haken */
.v2-listenzeile--weiss { background: #fff; border: 1px solid var(--v2-line); gap: 14px; }
.v2-listenzeile--weiss svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--v2-brand-dunkel); stroke-width: 3; position: relative; top: 4px; }

/* ---------- Fairness-Preis ---------- */
.v2-award__bild { width: 100%; border-radius: 16px; display: block; box-shadow: 0 24px 60px rgba(0, 0, 0, .25); }
.v2-sec--blau .v2-eyebrow { color: #BDE4F7; }
.v2-sec--blau .v2-h2 { color: #fff; }
.v2-award__claim { font-family: 'Outfit', sans-serif; font-weight: 600; font-size: 18px; margin: 14px 0 18px; color: #E8F5FC; }
.v2-award__text { font-size: 17px; line-height: 1.6; color: #F2FAFE; margin: 0 0 26px; }

/* ---------- Über uns ---------- */
.v2-adresse {
	display: inline-flex; flex-direction: column; gap: 2px;
	background: var(--v2-paper); border-radius: 12px; padding: 18px 22px;
	border-left: 4px solid var(--v2-brand);
}
.v2-adresse strong { font-family: 'Outfit', sans-serif; font-size: 16px; }
.v2-adresse span { color: var(--v2-text-2); }
.v2-adresse .v2-kaffee { color: var(--v2-brand-dunkel); font-weight: 600; font-size: 14.5px; }
.v2-bilder { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.v2-bilder img { width: 100%; height: 340px; object-fit: cover; border-radius: 14px; display: block; }
.v2-bilder img:nth-child(2) { margin-top: 28px; }

/* ---------- Blog ---------- */
/* Die Beiträge kommen aus [edvr_blog_cards] (immer die drei neuesten), nicht
   als festgeschriebene Liste wie im Entwurf — sonst steht hier in einem halben
   Jahr ein alter Artikel. Das Aussehen wird hier an den Entwurf angeglichen. */
.v2-blog .edvr-posts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.v2-blog .edvr-post {
	background: var(--v2-paper); border: 1px solid var(--v2-line); border-radius: 14px;
	overflow: hidden; color: var(--v2-ink); display: flex; flex-direction: column;
	transition: border-color .15s ease, transform .1s ease;
}
.v2-blog .edvr-post:hover { border-color: var(--v2-brand); transform: translateY(-2px); }
.v2-blog .edvr-post__media { height: 160px; background: linear-gradient(135deg, #101418, #2A2F36); position: relative; }
.v2-blog .edvr-post__img { width: 100%; height: 100%; object-fit: cover; }
.v2-blog .edvr-post__badge {
	position: absolute; left: 16px; bottom: 14px;
	color: var(--v2-brand-eis); font-family: 'Outfit', sans-serif; font-weight: 700;
	font-size: 15px; letter-spacing: .04em; background: none; padding: 0;
}
.v2-blog .edvr-post__body { padding: 22px 24px 24px; display: flex; flex-direction: column; gap: 10px; }
.v2-blog .edvr-post__meta { font-size: 13.5px; color: var(--v2-grau); }
.v2-blog .edvr-post__title { font-family: 'Outfit', sans-serif; font-weight: 700; font-size: 18.5px; line-height: 1.3; }
.v2-blog .edvr-post__excerpt { font-size: 15px; color: var(--v2-text-2); line-height: 1.5; }
.v2-blog .edvr-post__more {
	font-weight: 700; font-size: 14.5px; border-bottom: 2px solid var(--v2-brand);
	align-self: flex-start; padding-bottom: 1px;
}

/* ---------- Abschluss-CTA ---------- */
.v2-cta { position: relative; overflow: hidden; text-align: center; padding: 96px 48px; }
.v2-cta::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: radial-gradient(700px 400px at 50% 120%, rgba(0, 131, 196, .24), transparent 65%);
}
.v2-cta__inner {
	max-width: 760px; margin-inline: auto; position: relative;
	display: flex; flex-direction: column; align-items: center; gap: 22px;
}
.v2-cta__zahl {
	font-family: 'Outfit', sans-serif; font-weight: 600; font-size: 13.5px;
	letter-spacing: .08em; text-transform: uppercase; color: var(--v2-brand-eis);
	border: 1px solid rgba(79, 184, 232, .45); border-radius: 999px; padding: 6px 16px;
}
.v2-cta h2 { font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 44px; margin: 0; letter-spacing: -.015em; text-wrap: balance; }
.v2-cta__lead { font-size: 18px; line-height: 1.55; color: var(--v2-grau-hell); margin: 0; max-width: 56ch; }
.v2-cta__knoepfe { display: flex; gap: 14px; margin-top: 8px; flex-wrap: wrap; justify-content: center; }

/* ============================================================
   Stufen — der Entwurf hatte keine. `min-width: 1100px` haette auf
   jedem Telefon einen waagerechten Scrollbalken erzeugt.
   ============================================================ */
@media (max-width: 1100px) {
	.v2-sec, .v2-hero, .v2-cta, .v2-bekannt { padding-left: 32px; padding-right: 32px; }
	.v2-hero__inner, .v2-split { gap: 44px; }
	.v2-hero h1 { font-size: 46px; }
	.v2-h2 { font-size: 32px; }
	.v2-cta h2 { font-size: 36px; }
	/* Fuenf dunkle Karten passen hier nicht mehr: 3 + 2 liest sich besser als
	   fuenf Spalten von 150px. */
	.v2-vorteile { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 900px) {
	.v2-sec, .v2-cta { padding-top: 64px; padding-bottom: 64px; }
	.v2-hero { padding-top: 52px; padding-bottom: 64px; }
	/* Der Finder wandert unter den Text: nebeneinander bliebe fuer beides zu
	   wenig Platz, und der Finder ist das Werkzeug, nicht die Beigabe. */
	/*
	 * `minmax(0, 1fr)`, nicht `1fr`: Ein `1fr`-Track hat `auto` als
	 * Mindestgroesse, und die ist die min-content-Breite des Inhalts. Der echte
	 * Reparatur-Finder bringt 437px mit — auf einem 390px-Telefon wurde die
	 * Spalte damit 416px breit und der Hero (overflow: hidden) hat rechts
	 * 44px abgeschnitten, unsichtbar, ohne Scrollbalken. Mit `minmax(0, …)`
	 * darf der Track kleiner werden als sein Inhalt verlangt.
	 */
	.v2-hero__inner, .v2-split, .v2-split--breit-links, .v2-split--breit-rechts { grid-template-columns: minmax(0, 1fr); }
	.v2-schritte { grid-template-columns: 1fr; }
	.v2-vorteile { grid-template-columns: 1fr 1fr; }
	.v2-blog .edvr-posts { grid-template-columns: 1fr; }
	.v2-kopf { flex-direction: column; align-items: flex-start; gap: 14px; }
	/* Auf dem Handy stehen Bezeichnung und Text uebereinander — nebeneinander
	   blieben fuer den Text keine 20 Zeichen. */
	.v2-listenzeile { flex-direction: column; gap: 6px; }
	.v2-listenzeile strong { flex: none; }
	.v2-listenzeile--weiss { flex-direction: row; }
	/* Im Award-Zweispalter gehoert das Bild nach oben. */
	.v2-award__bild { max-height: 300px; object-fit: cover; }
	.v2-bilder img { height: 240px; }
	.v2-bilder img:nth-child(2) { margin-top: 0; }
}

@media (max-width: 600px) {
	.v2-sec, .v2-hero, .v2-cta, .v2-bekannt { padding-left: 18px; padding-right: 18px; }
	.v2-hero h1 { font-size: 34px; letter-spacing: -.01em; }
	.v2-hero__lead { font-size: 17px; }
	.v2-h2 { font-size: 26px; }
	.v2-cta h2 { font-size: 28px; }
	.v2-vorteile { grid-template-columns: 1fr; }
	.v2-usp { gap: 10px 20px; font-size: 14px; }
	.v2-bilder { grid-template-columns: 1fr; }
	.v2-bilder img { height: 200px; }
	.v2-cta__knoepfe { flex-direction: column; align-self: stretch; }
	.v2-cta__knoepfe .v2-btn { width: 100%; }
	.v2-listenzeile { padding: 16px 18px; }
	/* Die Bekannt-aus-Leiste wird zum Wischband (wie auf der aktuellen Seite). */
	.v2-bekannt .edvr-bekannt { justify-content: flex-start; }
}

/* ------------------------------------------------------------------
   Der dunkle Abschluss-CTA soll bündig am Footer sitzen.
   ------------------------------------------------------------------
   style.css macht das für `.home`; diese Seite ist eine gewöhnliche Seite und
   bekäme sonst den Block-Abstand aus theme.json als weißen Spalt zwischen
   schwarzem CTA und dunkelblauem Footer. Gescoped über die Body-Klasse, weil
   `.v2` nur den Seiteninhalt umfasst — der Footer liegt daneben.
   ------------------------------------------------------------------ */
.edvr-startseite-v2 .wp-site-blocks > footer { margin-top: 0; }

@media (prefers-reduced-motion: reduce) {
	.v2-btn:hover, .v2-blog .edvr-post:hover { transform: none; }
}