/* v5.css · Vorschau „Vertretung zuerst“ · nur Token; keine Änderung an site.css
   Eingebunden nach site.css (_vorschau_vertretung.html); deploy_candidate() biegt auf /home-v5.css um.
   Neon nur auf Ink. Papier-Bänder (#leistung, #kanzlei) remappen ihre Token über .light-band (site.css). */

/* ===== 0 · Übernommene seitenlokale Bausteine (Regeln wörtlich, BAUPLAN § 5.1) ===== */
/* /gdpr-article-27-representative/ Z. 90–96 */
.lp-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:28px 0 0;padding:0;list-style:none;counter-reset:lpstep}
.lp-steps li{counter-increment:lpstep;padding:22px;display:flex;flex-direction:column;gap:8px}
.lp-steps li::before{content:counter(lpstep,decimal-leading-zero);font-family:var(--font-mono);font-size:.78rem;letter-spacing:.14em;color:var(--mut)}
.lp-steps h3{margin:0}
.lp-steps p{margin:0;font-size:.92rem;color:var(--mut)}
/* /eu-representative-services/ Z. 116–120 */
.lp-faq{max-width:860px;margin-top:28px}
.lp-faq details{border-bottom:1px solid var(--hairline);padding:4px 0}
.lp-faq summary{cursor:pointer;font-family:var(--font-serif);font-size:1.12rem;color:var(--tx);padding:14px 0;list-style-position:outside}
.lp-faq summary:hover{color:var(--link-hover)}
.lp-faq details p{color:var(--tx-body);max-width:760px;margin:0 0 16px}
/* /ai-act-authorised-representative/ Z. 88–90 */
.lp-jump{display:flex;flex-wrap:wrap;gap:14px;margin:14px 0 0;padding:0;list-style:none;font-family:var(--font-mono);font-size:.78rem;letter-spacing:.08em}
.lp-jump a{color:var(--tx);text-decoration:none;border:1px solid var(--hairline);border-radius:6px;padding:5px 10px}
.lp-jump a:hover{color:var(--link-hover)}
/* Mobilregeln der Quellseiten (≤900px) */
@media(max-width:900px){
  .lp-steps{grid-template-columns:1fr}
}

/* ===== 1 · Einstieg #raas ===== */
.v5-intro{align-items:start}
.v5-intro .lp-glance{margin-top:8px}
.v5-norms{margin:16px 0 18px;line-height:1.75}
.v5-lead{font-size:1.12rem;color:var(--tx-body);max-width:58ch}
#rollen{scroll-margin-top:76px}
.v5-links{margin:18px 0 0}

/* ===== 2 · Rollen-Check #check (R2 AP10: Zeilenliste .v5-check*, .v5-tag und .v5-check-us gelöscht; #check ist der Kopf des Rollen-Registers, 13.2) ===== */
.v5-bridge{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin-top:28px;padding:18px 22px;border:1px solid var(--hairline);border-radius:12px;background:rgba(255,255,255,.02)}
.v5-bridge p{margin:0;flex:1 1 320px;color:var(--tx-body)}

/* ===== 3 · Papier-Band #leistung (Kontext-Korrekturen, 05 N2 Nr. 5) ===== */
.light-band .legal-boundary{border-color:var(--hairline);border-left-color:var(--violet);background:rgba(21,19,15,.03)}   /* border-color allein hätte den Violett-Balken mit überschrieben */
.v5-scope-note{margin:16px 0 0;font-size:.94rem;color:var(--tx-body)}
.v5-boundary{margin:22px 0 0;max-width:860px;font-size:.92rem;line-height:1.55}

/* ===== 4 · Ablauf #ablauf und Twin-Schritte (4 Spalten) ===== */
.steps.v5-steps-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.v5-cta-row{margin-top:24px}

/* ===== 5 · Einklappen (natives details; ohne JS bedienbar) ===== */
.v5-fold>summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 18px;min-height:44px;padding:6px 0}
.v5-fold>summary::-webkit-details-marker{display:none}
.v5-fold>summary>.kicker{grid-column:1;margin:0}
.v5-fold-h{grid-column:1;margin:0;font-family:var(--font-serif);font-weight:500;font-size:clamp(1.4rem,2.6vw,1.9rem);color:var(--tx)}
.v5-fold-plus{grid-column:2;grid-row:1 / span 2;width:34px;height:34px;border:1px solid var(--hairline);border-radius:999px;position:relative}
.v5-fold-plus::before,.v5-fold-plus::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;background:var(--tx);transform:translate(-50%,-50%)}
.v5-fold-plus::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .25s ease}
.v5-fold[open]>summary .v5-fold-plus::after{transform:translate(-50%,-50%) rotate(0)}
.v5-fold>summary:hover .v5-fold-h{color:var(--link-hover)}
.v5-fold>summary:focus-visible{outline:2px solid var(--focus-ctx);outline-offset:4px;border-radius:6px}
.v5-fold-body{padding-top:clamp(20px,3vw,32px)}
.v5-fold--sm>summary{grid-template-columns:minmax(0,max-content) 26px;justify-content:start;gap:4px 12px;font-family:var(--font-sans);font-size:.95rem;font-weight:600;letter-spacing:0;text-transform:none;color:var(--tx)}   /* QA D06/MOB-06 */
.v5-fold--sm>summary:hover{color:var(--link-hover)}
.v5-fold--sm>summary .v5-fold-plus{grid-row:1;width:26px;height:26px}
.v5-fold--sm{margin-top:18px}
section.v5-folded{padding:clamp(28px,4vw,48px) 0}
.v5-fold .crossreg-shotwrap{margin-bottom:0}                  /* Anschnitt am Bandrand nur live, nicht im Panel */
@media(prefers-reduced-motion:reduce){.v5-fold-plus::after{transition:none}}

/* ===== 6 · Preise #pricing (R2 AP10: Regeln der gefalteten Preisliste gelöscht; Preisraster seit R2 AP4 in 13.8) ===== */

/* ===== 7 · Twin ===== */
.v5-twin-h{font-family:var(--font-serif);font-weight:500;font-size:clamp(1.4rem,2.6vw,1.9rem);margin:clamp(32px,5vw,48px) 0 8px;color:var(--tx)}
.v5-jump{margin:18px 0 0}
.v5-step-go .link-arrow{display:inline-flex;align-items:flex-end;padding-bottom:1px;min-height:44px;margin-top:8px;align-self:flex-start}   /* QA D16 */
.v5-twin-close{text-align:center;margin-top:clamp(48px,7vw,84px);border-top:1px solid var(--hairline);padding-top:clamp(36px,5vw,60px)}
.v5-twin-close-h{font-family:var(--font-serif);font-weight:500;font-size:clamp(1.6rem,3vw,2.2rem);margin:8px 0;color:var(--tx)}
.v5-twin-close .sec-sub,.v5-twin-close .cta-serious{margin-left:auto;margin-right:auto;max-width:620px}
.v5-twin-close .hero-ctas{justify-content:center}

/* ===== 8 · Breakpoints ===== */
@media(max-width:1020px){
  .steps.v5-steps-4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  #rollen{scroll-margin-top:100px}
  .steps.v5-steps-4{grid-template-columns:1fr}   /* (0,2,0)-Falle, explizit */
  .v5-rail{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin-inline:-24px;padding:0 24px 10px;scroll-padding-inline:24px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  .v5-rail>*{flex:0 0 86%;min-width:0;scroll-snap-align:start}
  .v5-rail:focus-visible{outline:2px solid var(--focus-ctx);outline-offset:4px}
  .site-index .idx-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 18px}
}
@media(max-width:480px){
  .v5-rail{margin-inline:-16px;padding-inline:16px;scroll-padding-inline:16px}
  #stats.dark-band .proof-ledger .led-item{background:rgba(255,255,255,.05)}   /* site.css Z. 770 ist für Creme gedacht */
}
@media print{.v5-fold-plus{display:none}}
@media print{details.v5-fold::details-content,.lp-faq details::details-content{content-visibility:visible;display:block}}   /* QA V-08; Fallback per beforeprint im v5-Skript */

/* ===== 9 · Feinschliff nach Sichtprüfung (Build 21.10.2026; im BAU_PROTOKOLL begründet) ===== */
/* 9.1 Rollen-Check (Spalten, Label, Norm-Tag): R2 AP10 gelöscht, die Zeilenliste entfällt seit R2 AP2 */
/* 9.2 FAQ: eigener Plus-Marker statt des überhängenden Dreiecks; Desktop zweispaltig (Titel | Fragen) */
#faq .lp-faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:44px}
#faq .lp-faq summary::-webkit-details-marker{display:none}
#faq .lp-faq summary::after{content:"+";flex:0 0 auto;width:28px;height:28px;border:1px solid var(--hairline);border-radius:999px;display:grid;place-items:center;font-family:var(--font-sans);font-size:1rem;line-height:1;color:var(--tx);transition:transform .25s ease}
#faq .lp-faq details[open]>summary::after{transform:rotate(45deg)}
#faq .lp-faq summary:focus-visible{outline:2px solid var(--focus-ctx);outline-offset:4px;border-radius:6px}
@media(prefers-reduced-motion:reduce){#faq .lp-faq summary::after{transition:none}}
/* R2 AP4: Rasterteil von 9.2 (#faq .wrap>…) ersetzt durch 13.10 (Plan § 3.7, D-P4: Kopf und Anfrage kleben als ein Element) */
/* 9.3 Bündigkeit: Kontaktnotizen zentriert (p{max-width} hielt sie links). Kooperationszeile: R2 AP10 gelöscht (raas_coop steht seit R2 AP3 in #kanzlei, 13.6) */
#contact .cta-note{margin-left:auto;margin-right:auto}
/* 9.4 Vertretungs-Preiskarte: Preisblock rechts neben dem Text statt darunter */
@media(min-width:861px){#pricing .price-firms .pf-txt{flex:1 1 0;min-width:min(100%,440px)}}
/* 9.5 Touch-Ziele ≥ 44 px (Abnahme § 11) ohne Layoutverschiebung: Inline-Padding vergrößert nur die Trefferfläche */
@media(max-width:860px){
  .v5-links .link-arrow,.v5-bridge .link-arrow,#contact .cta-note .link-arrow,#radar .int-compact .link-arrow{padding-top:20px;padding-bottom:4px}
  #contact .cta-phone a,.raas-dual-rows a{padding-block:13px}
  #radar .int-snippet>summary{min-height:44px;padding-block:12px;box-sizing:border-box}
  .v5-jump{gap:8px}
  .v5-jump a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px}
}

/* ===== 10 · Fixes nach QA (21.10.2026; Befund-IDs aus konzept/qa/, Protokoll: konzept/qa/FIX_PROTOKOLL.md) ===== */
/* 10.1 #raas: Normzeile ohne zweite Neon-Kante (D18). Gewichtung der Rollenkarten (E-05): R2 AP10 gelöscht, Rollen-Register 13.2 */
.v5-norms{border-left:0;padding-left:0}
/* 10.1b Einstieg: Prüfdatum in der Glance-Box (E-11). raas_sub als Schlussabsatz (E-01) und ab-Preis je Karte (E-04): R2 AP10 gelöscht
         (raas_sub seit R2 AP4 im Faltblock #kanzlei, Preis im Rollen-Register 13.2) */
.lp-glance-date{margin:6px 0 0;font-size:.8rem;line-height:1.5;color:var(--mut)}
/* 10.2 #check: Brücken-Link rechtsbündig (D15). Länderzeilen (E-08): R2 AP10 gelöscht, Pfeil-Links seit R2 AP2 in #rollen .v5-roles-links */
.v5-bridge .link-arrow{margin-left:auto}
/* 10.3 #leistung: R2 AP10 gelöscht (.scope-* entfällt mit dem Ledger 13.4; Breite der Grenzbox seit Fixer R2 in 13.20 j) */
/* 10.4 #ablauf: R2 AP10 gelöscht (.lp-deliv und .inline-stat entfallen mit den Schritten 13.5; Zwei-Verträge-Block seit R2 AP3 in #kanzlei, 13.6) */
/* 10.5 #pricing: Abstand Badge (D26), Software-Pläne abgesetzt (D08; #plans seit R2 AP4 in #funnel, Abstand oben 13.16 c).
        R2 AP10 gelöscht: Bedingung statt Häkchen (alte Preisliste) und pr_note/pr_sep unter #pricing (Ersatz 13.9) */
#rep-pricing{margin-top:32px}
#plans{padding-top:clamp(20px,3vw,32px);border-top:1px solid var(--hairline)}
/* 10.6 #faq: Titel läuft am Desktop mit (D27). R2 AP4: ersetzt durch 13.10 (.v5-faq-aside klebt mit Kopf und Anfrage, Plan § 3.7) */
/* 10.7 Bildbänder (F3/D05): Kapitelwechsel ohne Leerflächen und ohne verwaiste Haarlinie.
        R2 AP1: „#stats + #suite{border-top…}“ gelöscht (D-P3, Plan § 3.0); die Linie Stats → Suite kommt jetzt aus dem Haarliniensystem 12.1 */
@media(min-width:861px){section.poster-band{margin:0}}
.poster-band + section{border-top:0}
/* 10.8 Twin: Start-Button an der Kapitelspitze (E-07) */
.v5-twin-cta{margin:22px 0 0}
/* 10.9 Teil III (Twin; bis R6 Teil II): Absatz unter den Abdeckungskarten (D19), Kennzahl im Fold leiser als die H2 (D14), Vorbehalt in der Summary sichtbar (V-01) */
.v5-fold .crossreg-stat{font-size:clamp(1.25rem,2vw,1.5rem)}
.v5-fold>summary>.v5-fold-note{grid-column:1;display:block;margin:6px 0 0;max-width:68ch;font-family:var(--font-sans);font-size:.95rem;line-height:1.55;letter-spacing:0;text-transform:none;color:var(--mut)}
/* 10.10 Abschluss: Telefonnummer bricht nicht um (D25) */
#contact .cta-phone a{white-space:nowrap}
/* 10.11 Navigation: CTA-Text mit Luft (D20); mobil kein Dropdown-Pfeil (MOB-14). R2 AP1: beide Regeln wortgleich nach Abschnitt K verschoben */
/* 10.12 Wizard (nur Startseite): Hinweis volle Breite, Modal tiefer (D21). Die Kanzlei-Kachelreihe im Ergebnis (E-02) bleibt Theo-Entscheid */
.raas-orient{max-width:none}
@media(min-width:861px){.raas-ov{padding-top:10vh}}
/* 10.13 Mobil */
@media(max-width:640px){
  /* MOB-01: Vertretungs-CTA in der Logozeile, ohne Querscroll erreichbar. R2 AP1: die drei Kopf-Regeln wortgleich nach Abschnitt K verschoben */
  /* MOB-03: Touch-Ziele ≥ 44 px (Kopf-Teil „.topnav a,.lang-toggle button“ und „.lang-toggle button“ seit R2 AP1 wortgleich in Abschnitt K) */
  #suite a.suite-arrow{display:inline-grid;place-items:center;min-width:44px;min-height:44px;margin:-9px}
  #regimes .coverage-card>.link-arrow{display:inline-flex;align-items:center;min-height:44px}
  #kanzlei .bp-card li>a{display:inline-block;padding-block:12px}
  /* MOB-05: Teaser-Strich führt in den Button, Ziel 44 px */
  .hero-raas-teaser{display:block;line-height:1.5}
  .hero-raas-teaser .btn-rep{display:inline-flex;align-items:center;min-height:44px;margin:6px 0 0 4px;vertical-align:middle}
  /* MOB-10: Rail-Karten sofort sichtbar, nicht gestreckt */
  html.js .v5-rail>.reveal{opacity:1;transform:none;transition:none}
  .v5-rail{align-items:flex-start}
}
@media(max-width:560px){
  /* MOB-11: Preisblock der Vertretungskarte volle Breite, linksbündig (Knopf-Regel R2 AP10 gelöscht: kein .btn mehr in .pf-cta) */
  #rep-pricing .pf-cta{align-self:stretch;text-align:left}
}

/* ===== 11 · Theo-Entscheid 21.10.2026 (Punkt 3a): Wizard-Ergebnis auf der Startseite ohne Kanzlei-Kachelreihe ===== */
/* Rechtsberatung bleibt im Anfrageformular als gesonderter zweiter Auftrag wählbar (L16 „Ein Formular, zwei getrennte Aufträge“). */
/* R3 recht_code B05: Kacheln immer aus; die Zwischenzeile nur unter @supports (ohne :has() verwarf der Browser sonst die ganze Regel) */
.raas-ov .raas-book{display:none}
@supports selector(:has(*)){.raas-ov .raas-sub:has(+ .raas-book){display:none}}

/* ===== 12 · Fundament (Runde 2, Plan konzept/r2/06_PLAN_FINAL.md § 5.2; AP1) =====
   Selektor-Regel (Harte Grenzen 1 und 2): jede Regel trägt main > section:not(.hero), eine Sektions-ID außer #top/#tour
   oder eine v5-Klasse. Nichts hier erreicht .hero, #top oder header.topbar (Abnahme: Hero- und Kopf-Diff = 0). */
/* 12.0 Tokens (nur Startseite). Auf den Sektionen statt auf :root: Custom Properties erben und stehen in getComputedStyle
   jedes Hero-Elements; auf :root wäre der Computed-Style-Diff des Hero ungleich 0. Glyphen: eigene Pfade im 24er-Raster (R-P6). */
main > section:not(.hero){
  --v5-violet-glow:rgba(145,139,183,.13);--v5-cream-glow:rgba(242,240,234,.045);
  --v5-hair-fade:linear-gradient(90deg,transparent,rgba(242,240,234,.14) 22%,rgba(242,240,234,.14) 78%,transparent);
  --v5-edge-grad:linear-gradient(180deg,rgba(242,240,234,.32),rgba(242,240,234,.06) 42%,rgba(145,139,183,.24));
  --v5-rule:rgba(242,240,234,.42);--v5-ease:cubic-bezier(.2,.7,.2,1);--v5-r-lg:16px;--v5-r-md:12px;
  --v5-ico-check: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.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12.75 9.75 18 19.5 6.5'/%3E%3C/svg%3E");   /* eigener Haken, 2 Striche */
  --v5-ico-doc: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.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.5 3.5h7.25l3.75 3.75V20.5h-11z'/%3E%3Cpath d='M13.75 3.5v3.75h3.75'/%3E%3C/svg%3E");   /* eigenes Blatt mit Falz */
  --v5-ico-minus: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.5' stroke-linecap='round'%3E%3Cpath d='M6.5 12h11'/%3E%3C/svg%3E");   /* waagrechter Strich */
}
/* M03 warmes Glas auf den Bändern selbst (D-P1): site.css Z. 131–146 deklariert die Token auf
   .topbar/.dark-band/.final-cta; Kinder erben vom nächsten Vorfahren. (0,1,1)/(0,1,2) schlägt (0,1,0).
   .light-band (#kanzlei), .topbar und .hero bleiben unberührt. */
main .dark-band,main .final-cta,main > section:not([class]){
  --card-glass-grad:linear-gradient(180deg,rgba(242,240,234,.06) 0%,rgba(242,240,234,.02) 100%);
  --card-glass-bd:rgba(242,240,234,.10);
  --card-glass-shadow:inset 0 1px 0 rgba(242,240,234,.12),0 1px 2px rgba(0,0,0,.40),0 32px 64px -34px rgba(0,0,0,.80);
  --card-glass-shadow-hover:inset 0 1px 0 rgba(242,240,234,.16),0 2px 4px rgba(0,0,0,.40),0 40px 72px -34px rgba(0,0,0,.85);
}
.v5-vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 12.1 Licht (M01) und ein Haarliniensystem (D-P3) */
#pricing,#twin,#contact{position:relative;isolation:isolate}
#pricing::before,#twin::before,#contact::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none}
/* #raas: Licht als Hintergrund-Ebenen der Sektion statt ::before. Gemessen (AP1): sobald #raas selbst positioniert oder
   isoliert ist (position:relative oder isolation:isolate, auch ohne ::before), rastert Chromium das Hero-Poster mobil anders
   (92.212 Pixel, max. Delta 21) und der Hero-Diff ist nicht 0. Gleiche Geometrie (Padding-Box), kein Stapelkontext.
   Folge für AP2: #raas selbst bleibt ohne position, isolation, z-index, transform, filter und opacity; Kinder dürfen das. */
#raas{background-image:radial-gradient(70% 55% at 12% 0%,var(--v5-violet-glow),transparent 70%),radial-gradient(45% 40% at 92% 20%,var(--v5-cream-glow),transparent 72%);background-size:100% 100%;background-repeat:no-repeat}
#pricing::before{background:radial-gradient(60% 55% at 88% 0%,var(--v5-violet-glow),transparent 70%)}
#twin::before{background:radial-gradient(60% 50% at 10% 0%,var(--v5-violet-glow),transparent 70%)}
#contact::before{background:radial-gradient(60% 70% at 50% 0%,rgba(145,139,183,.16),transparent 70%)}
main > section:not(.hero):not(.poster-band):not(.light-band):not(.final-cta){
  border-top:0;background-image:var(--v5-hair-fade);background-size:100% 1px;background-repeat:no-repeat;background-position:top center}
/* keine Linie unter Hero, Bildbändern und dem Papier-Band; volle :not-Kette, damit (0,5,2) die Linienregel (0,4,2) schlägt */
main > .hero + section:not(.hero):not(.poster-band):not(.light-band):not(.final-cta),
main > .poster-band + section:not(.hero):not(.poster-band):not(.light-band):not(.final-cta),
main > .light-band + section:not(.hero):not(.poster-band):not(.light-band):not(.final-cta){background-image:none}
#contact.final-cta{border-top:0}
#contact::after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--v5-hair-fade);pointer-events:none}
/* geprüft: site.css nutzt an .final-cta weder ::before noch ::after */
@media print{#pricing::before,#twin::before,#contact::before{display:none}#raas{background-image:none}}

/* 12.2 Kantenlicht (M03) */
.v5-edge{position:relative}
.v5-edge::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;pointer-events:none;background:var(--v5-edge-grad);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}

/* 12.3 Akzentdisziplin (M04); Klassenregeln mit Sektionsbezug (Harte Grenze 1) */
#crossreg .crossreg-stat{color:var(--tx)}
#raas .lp-glance{border-left-color:var(--hairline)}
#pricing .price-feats li::before{color:var(--tx-body)}
#pricing .price-most{background:var(--bg);color:var(--tx);border:1px solid var(--hairline)}
#twin .twin-engine{border-left-color:var(--violet)}
main > section:not(.hero) .btn.btn-primary{box-shadow:inset 0 1px 0 rgba(255,255,255,.45)}   /* M22, nie im Hero (R-P1, D-P2) */

/* 12.4 Kapitelsystem (M05/M21) und Bildband-Captions (D-P5) */
.v5-num::before{content:attr(data-n);display:inline-block;margin-right:14px;padding-right:14px;border-right:1px solid var(--hairline);color:var(--tx);letter-spacing:.08em}
.v5-part{font:500 .7rem/1.3 var(--font-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--mut);margin:0}
.v5-jumpbar{display:flex;align-items:baseline;gap:clamp(16px,3vw,40px);margin-top:48px;padding-top:20px;border-top:1px solid var(--hairline)}
main > section.poster-band .poster-caption{background:linear-gradient(180deg,transparent,rgba(27,22,17,.55) 35%,rgba(27,22,17,.88))}
.poster-caption .v5-part{display:block;margin:0 0 8px;color:var(--cream)}          /* keine opacity */
/* Abnahme D2: 5 Messpunkte unter jeder Caption (DE/EN, Desktop/Mobil) >= 4,5:1; sonst Teil-Marke und Kicker
   auf eine Ink-Glas-Fläche rgba(27,22,17,.72) mit 10px Radius setzen. */

/* 12.5 Schritt-Nummern einheitlich (inkl. Ablauf-Zähler, D-E9): Mono, Haarlinien-Pill, transparent, Creme-Text */
main > section:not(.hero) .step .step-no,main > section:not(.hero) .twin-steps .step-no,#ablauf .lp-steps>li::before{background:transparent;color:var(--tx);border:1px solid var(--hairline);font-family:var(--font-mono)}
main > section:not(.hero) .step.step-final .step-no{background:transparent;color:var(--tx);border-color:var(--violet)}
#ablauf .lp-steps>li::before{align-self:flex-start;border-radius:999px;padding:3px 12px;font-size:.7rem}   /* Pill-Maße wie .step .step-no (site.css Z. 457–460) */

/* 12.6 Bildfenster ohne neue Dateien. Doppelte Klasse = Spezifität (0,2,1): schlägt .poster-band .poster-img
   (0,2,0), video.inline-loop (0,1,1) und, weil später geladen, .loop-frame img.poster (0,2,1).
   display bleibt bei site.css (Loop/Standbild-Umschaltung). Quellverhältnis statt auto (D-E8). */
.v5-crop{position:relative;overflow:hidden;aspect-ratio:var(--ar);border-radius:14px}
.v5-crop.v5-crop>img,.v5-crop.v5-crop>video,.v5-crop.v5-crop>picture>img{position:absolute;max-width:none;max-height:none;aspect-ratio:var(--src-ar);object-fit:fill;
  width:calc(100% / var(--w));height:auto;border-radius:0;
  left:calc(-100% * var(--x) / var(--w));top:calc(-100% * var(--y) / var(--h))}
.v5-crop--graph{--x:.185;--y:.305;--w:.75;--h:.65;--ar:2.051;--src-ar:16/9}
.v5-crop--heat{--x:.055;--y:.264;--w:.925;--h:.68;--ar:2.176;--src-ar:8/5}
#poster-map .v5-crop{border-radius:0}
@media(max-width:640px){#poster-map .v5-crop--graph{--x:.36;--y:.31;--w:.45;--h:.64;--ar:1.25}}
/* Rechnung: Fenster (x,y,w,h) als Anteil der Quelle; Bildbreite = Rahmen/w; left = −x/w (Rahmenbreite);
   top = −y/h (Rahmenhöhe); --ar = w·Breite_Quelle / (h·Höhe_Quelle). Werte per Screenshot bestätigen. */

/* 12.7 Bewegung (keine Knopfregel, R-P1) */
html.js .v5-stagger>.reveal:nth-child(2){transition-delay:80ms}
html.js .v5-stagger>.reveal:nth-child(3){transition-delay:160ms}
html.js .v5-stagger>.reveal:nth-child(4){transition-delay:240ms}
html.js .v5-stagger>.reveal:nth-child(5){transition-delay:320ms}
html.js .v5-stagger>.reveal:nth-child(6){transition-delay:400ms}
html.js .v5-stagger>.reveal:nth-child(7){transition-delay:480ms}
.v5-route-pulse{position:absolute;inset:0;pointer-events:none;opacity:0;transform:translateX(-100%)}
@media(prefers-reduced-motion:no-preference) and (min-width:861px){.v5-route.in .v5-route-pulse{animation:v5-pulse 4.2s var(--v5-ease) 1 forwards}}
@keyframes v5-pulse{0%{opacity:0;transform:translateX(-60%)}15%,85%{opacity:1}100%{opacity:0;transform:translateX(60%)}}
@media(prefers-reduced-motion:reduce){html.js .v5-stagger>.reveal{transition-delay:0s}.v5-role{transition:none}.v5-role:hover{transform:none}}

/* 12.8 Typografie (M18, D-E1) */
main > section:not(.hero) h2{font-weight:450;letter-spacing:-.015em;text-wrap:balance}
main > section:not(.hero) h2{font-variation-settings:"opsz" 72}   /* Funk Serif führt opsz und wght variabel (funk-fonts.css Z. 4) */
#raas .v5-intro h2,#contact h2{font-size:clamp(34px,4.2vw,52px);line-height:1.08}
main > section:not(.hero) p{text-wrap:pretty}

/* ===== 13 · Komponenten (Plan § 5.3; ab AP2, hier anhängen) ===== */
/* 13.1 Einstieg #raas (AP2, Plan § 3.1): Intro-Raster, Knopfreihe (Anfrage gefüllt, Rolle finden Ghost), Normzeile,
   Datenblatt mit sechs Zeilen, Sprungleiste mit Teil-Marke. #raas selbst bleibt ohne position, isolation, z-index,
   transform, filter und opacity (AP1, Abweichung 2: sonst Hero-Diff mobil ungleich 0); Kinder dürfen das. */
@media(min-width:1021px){
  #raas .v5-intro{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(40px,5vw,72px);align-items:start}
}
#raas .v5-lead{margin-bottom:0}
#raas .v5-intro-ctas{margin:26px 0 0}
#raas .v5-norms{margin:18px 0 0;padding:0;border:0;max-width:62ch;font-family:var(--font-mono);font-size:.78rem;line-height:1.7;letter-spacing:.02em;text-transform:none;color:var(--mut)}
/* Datenblatt „Auf einen Blick“: Glas, Kantenlicht (.v5-edge), Kopf mit Haarlinie, Zeilen durch Haarlinien, keine Neon-Kante */
#raas .lp-glance{max-width:none;margin:6px 0 0;padding:24px 28px 18px;border:1px solid var(--card-glass-bd);border-radius:var(--v5-r-lg);background:var(--card-glass-grad);box-shadow:var(--card-glass-shadow)}
#raas .lp-glance-h{margin:0;padding-bottom:12px;border-bottom:1px solid var(--hairline)}
#raas .lp-glance dl{gap:0}
#raas .lp-glance dl>div{grid-template-columns:7.5rem minmax(0,1fr);gap:16px;padding:11px 0;border-bottom:1px solid var(--hairline)}
#raas .lp-glance dt{font-size:.72rem;letter-spacing:.07em;line-height:1.55}
#raas .lp-glance dd{font-size:.93rem;line-height:1.5}
#raas .lp-glance-more{margin-top:2px}
/* Sprungleiste Teil I: Teil-Marke links (D-E3), Einträge rechts mit Mono-Nummern 02–07 aus data-n */
#raas .v5-jumpbar .v5-part{flex:0 0 auto}
#raas .v5-jump{margin:0;flex:1 1 auto;gap:8px}
#raas .v5-jump a{display:inline-flex;align-items:center;gap:7px;letter-spacing:.04em}
#raas .v5-jump a::before{content:attr(data-n);color:var(--mut);letter-spacing:.06em}

/* 13.2 Rollen-Register #rollen mit Kopf #check (AP2, Plan § 3.2): 3 × 2 gleich gebaute Karten, Subgrid-Zeilen
   Tag · Titel · Für · Text · Fuß (Preise auf einer Linie), ganze Karte klickbar, Aktions-Link darüber (D-E7, Risiko 11) */
#check{scroll-margin-top:76px}                                   /* Wert wie site.css Z. 151 (Plan § 5.3 Anker) */
#rollen .v5-roles-head{margin:0}
#rollen .v5-roles-h{margin:0;font-family:var(--font-serif);font-weight:450;font-variation-settings:"opsz" 72;font-size:clamp(1.6rem,2.8vw,2.15rem);line-height:1.12;letter-spacing:-.015em;text-wrap:balance;color:var(--tx)}
#rollen .v5-roles-head .sec-sub{margin:12px 0 0}
.v5-roles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.v5-role{position:relative;min-width:0;display:flex;flex-direction:column;gap:10px;padding:24px 22px 16px}
@supports (grid-template-rows:subgrid){
  .v5-role{display:grid;grid-row:span 5;grid-template-rows:subgrid;row-gap:10px}
}
.v5-role--main{--card-glass-grad:linear-gradient(180deg,rgba(242,240,234,.09) 0%,rgba(242,240,234,.035) 100%)}
.v5-role-tag{justify-self:start;align-self:start;font:500 .7rem/1.35 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--tx);border:1px solid rgba(145,139,183,.55);border-radius:6px;padding:4px 9px}
.v5-role-t{margin:0;font-family:var(--font-serif);font-weight:500;font-size:1.32rem;line-height:1.18;letter-spacing:-.01em;color:var(--tx)}
.v5-role-t a{color:inherit;text-decoration:none;transition:color .15s ease;padding-block:9px}   /* Trefferfläche ≥ 44 px ohne Layoutverschiebung (inline, wie 9.5) */
.v5-role-t a::after{content:"";position:absolute;inset:0;border-radius:16px}    /* Stretched Link auf die Leistungsseite */
.v5-role-t a:hover{color:var(--link-hover)}
.v5-role-for{margin:0;max-width:none;font-size:.92rem;line-height:1.5;color:var(--tx-body)}
.v5-role-l{display:block;margin:0 0 2px;font:400 .82rem/1.4 var(--font-sans);color:var(--mut)}   /* ruhige Vorzeile (D-E5) */
.v5-role-p{margin:0;max-width:none;font-size:.88rem;line-height:1.55;color:var(--mut)}
.v5-role-foot{display:flex;flex-direction:column;align-items:flex-start;gap:0;margin-top:auto;padding-top:12px;border-top:1px solid var(--hairline)}
@supports (grid-template-rows:subgrid){.v5-role-foot{margin-top:0}}
#rollen .v5-fee{margin:0;font-size:.9rem;line-height:1.45;color:var(--tx);font-variant-numeric:lining-nums tabular-nums}
.v5-role-go{position:relative;z-index:1;display:inline-flex;align-items:flex-end;min-height:44px;padding-bottom:1px;font-size:.92rem}
.v5-role-lang{margin-top:8px;font:400 .66rem/1.4 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
html[lang="en"] .v5-role-lang{display:none}
/* Fokus: Ring um die ganze Karte statt um den Titel (P3-04) */
.v5-role:has(.v5-role-t a:focus-visible){outline:3px solid var(--focus-ctx);outline-offset:4px}
@supports selector(:has(*)){.v5-role-t a:focus-visible{outline:none}}
/* Bewegung: Staffel-Reveal (12.7) nur für opacity/transform; Hover-Lift über translate ohne Staffel-Verzug
   (AP1 offener Punkt: transition-delay gilt sonst auch für den Lift). ID-Spezifität schlägt site.css (0,2,1) und 12.7 (0,4,1). */
#rollen .v5-role{transition-property:opacity,transform,translate,box-shadow;transition-duration:.6s,.6s,.25s,.25s;transition-timing-function:ease,ease,var(--v5-ease),ease}
html.js #rollen .v5-roles>.v5-role:nth-child(2){transition-delay:80ms,80ms,0s,0s}
html.js #rollen .v5-roles>.v5-role:nth-child(3){transition-delay:160ms,160ms,0s,0s}
html.js #rollen .v5-roles>.v5-role:nth-child(4){transition-delay:240ms,240ms,0s,0s}
html.js #rollen .v5-roles>.v5-role:nth-child(5){transition-delay:320ms,320ms,0s,0s}
html.js #rollen .v5-roles>.v5-role:nth-child(6){transition-delay:400ms,400ms,0s,0s}
@media(hover:hover){
  #rollen .v5-role:hover{translate:0 -2px;box-shadow:var(--card-glass-shadow-hover);--v5-edge-grad:linear-gradient(180deg,rgba(242,240,234,.5),rgba(242,240,234,.1) 42%,rgba(145,139,183,.36))}
}
@media(prefers-reduced-motion:reduce){#rollen .v5-role:hover{translate:none}}
/* Brücke zum Twin und eine Zeile mit Pfeil-Links (Länder-Einstieg, Übersicht) */
#rollen .v5-roles-links{display:flex;flex-wrap:wrap;gap:0 28px;margin:12px 0 0;max-width:none}
#rollen .v5-roles-links .link-arrow{display:inline-flex;align-items:flex-end;min-height:44px;padding-bottom:1px}

/* 13.3 Breakpoints für 13.1/13.2 */
@media(max-width:1020px){
  .v5-roles{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  #raas .v5-intro-ctas{flex-direction:column;align-items:stretch;gap:12px}
  #raas .v5-intro-ctas .btn{display:flex;width:100%;min-height:48px;align-items:center;justify-content:center;text-align:center}
  #raas .lp-glance{padding:20px 18px 14px}
  #raas .lp-glance dl>div{grid-template-columns:minmax(0,1fr);gap:2px;padding:8px 0}
  #raas .lp-glance dd{line-height:1.45}
  /* Sprungleiste: Teil-Marke darüber, eine Wischzeile mit Randmaske; padding-block hält den Fokusring (3 + 2 px) frei */
  #raas .v5-jump{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;
    margin-inline:-24px;padding:6px 24px;scroll-padding-inline:24px;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%)}
  #raas .v5-jump::-webkit-scrollbar{display:none}
  #raas .v5-jump>li{flex:0 0 auto;scroll-snap-align:start}
  #raas .v5-jump a{white-space:nowrap}
  #check{scroll-margin-top:100px}                                 /* Wert wie site.css Z. 152 */
  .v5-roles{grid-template-columns:minmax(0,1fr);gap:14px}
  .v5-role{padding:18px 18px 10px;row-gap:8px;gap:8px}
  .v5-role-p{line-height:1.5}
  #rollen .v5-bridge{padding:14px 16px}
  html[lang="de"] .v5-role{hyphens:auto}
}
@media(max-width:480px){
  #raas .v5-jump{margin-inline:-16px;padding-inline:16px;scroll-padding-inline:16px;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 10px,#000 calc(100% - 10px),transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 10px,#000 calc(100% - 10px),transparent 100%)}
}

/* 13.4 Leistungsumfang #leistung (AP3, Plan § 3.3): Ink statt Papier (Rückfall: Klasse light-band), Ledger in drei Spalten
   Enthalten · Sie erhalten · Nie enthalten. Kopflinie --v5-rule, Spalten durch Haarlinien getrennt, Zeilen 12 px mit Haarlinie,
   Glyphen aus den 12.0-Token (eigene Pfade, R-P6) als Maske in Creme bzw. gedämpft. Kein Neon; alles über Token, greift auch auf Papier. */
.v5-ledger{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,.9fr);margin:0;border-top:1px solid var(--v5-rule)}
.v5-ledger-col{min-width:0;padding:20px clamp(18px,2.4vw,34px) 4px}
.v5-ledger-col:first-child{padding-left:0}
.v5-ledger-col:last-child{padding-right:0}
.v5-ledger-col+.v5-ledger-col{border-left:1px solid var(--hairline)}
.v5-ledger-h{margin:0 0 4px;font:500 .72rem/1.5 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--tx)}
.v5-led{list-style:none;margin:0;padding:0}
.v5-led>li{position:relative;margin:0;padding:12px 0 12px 28px;border-bottom:1px solid var(--hairline);font-size:.93rem;line-height:1.5;color:var(--tx-body);text-wrap:pretty}
.v5-led>li:last-child{border-bottom:0}
.v5-led>li::before{content:"";position:absolute;left:0;top:15px;width:16px;height:16px;background:var(--tx);
  -webkit-mask:var(--v5-ico-check) center/16px 16px no-repeat;mask:var(--v5-ico-check) center/16px 16px no-repeat}
.v5-led--doc>li::before{top:13px;-webkit-mask-image:var(--v5-ico-doc);mask-image:var(--v5-ico-doc)}
.v5-led--out>li::before{background:var(--mut);-webkit-mask-image:var(--v5-ico-minus);mask-image:var(--v5-ico-minus)}
.v5-led-tag{display:block;margin:0 0 3px;font:500 .66rem/1.45 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
#leistung .v5-scope-note{margin:4px 0 0;padding-top:12px;border-top:1px solid var(--hairline);font-size:.88rem;line-height:1.5;color:var(--tx-body)}

/* 13.5 Ablauf #ablauf (AP3, Plan § 3.4): drei gleich hohe Schrittkarten, „Von Ihnen“/„Ergebnis“ als dl am Kartenfuß (Haarlinie,
   Mono-Labels), Hinweiszeile in Sans; Zustellweg-Tafel als das große Bild von Teil I (D-E4); ein Primärknopf am Sektionsende. */
#ablauf .lp-steps.v5-steps-3{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
#ablauf .lp-steps>li{padding:22px 22px 20px;gap:10px}
.v5-step-io{margin:auto 0 0;padding-top:14px;border-top:1px solid var(--hairline);display:grid;gap:12px}
.v5-step-io dt{margin:0 0 3px;font:500 .66rem/1.4 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.v5-step-io dd{margin:0;font-size:.88rem;line-height:1.5;color:var(--tx-body);text-wrap:pretty}
/* Subgrid (≥ 861): Nummer · Titel · Text · dl laufen über die Reihe bündig, „Von Ihnen“ steht in allen drei Karten auf einer Linie */
@supports (grid-template-rows:subgrid){
  @media(min-width:861px){
    #ablauf .lp-steps.v5-steps-3>li{display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:10px}
    #ablauf .lp-steps.v5-steps-3>li::before{justify-self:start}
    #ablauf .lp-steps.v5-steps-3 .v5-step-io{margin-top:0;align-self:start}
  }
}
#ablauf .v5-ab-note{margin:18px 0 0;max-width:68ch;font-size:.9rem;line-height:1.55;color:var(--mut)}
/* Zustellweg-Tafel: volle Wrap-Breite, Haarlinien-Rahmen + Kantenlicht (.v5-edge, 12.2), violettes Licht von oben als Hintergrund-Ebene
   (::before trägt die Kante); Titel auf der H2-Skala. Fünf zweistufige Knoten auf einer Linie (10–90 %), Knoten 3 gefüllt in Creme. */
#ablauf .v5-route{padding:clamp(28px,4vw,56px);border:1px solid var(--card-glass-bd);border-radius:var(--v5-r-lg);
  background:radial-gradient(60% 70% at 50% 0%,var(--v5-violet-glow),transparent 72%),var(--card-glass-grad);box-shadow:var(--card-glass-shadow)}
#ablauf .v5-route>.kicker{display:block;margin:0}
.v5-route-h{margin:12px 0 0;font-family:var(--font-serif);font-weight:450;font-variation-settings:"opsz" 72;font-size:clamp(30px,3.4vw,40px);line-height:1.1;letter-spacing:-.015em;text-wrap:balance;color:var(--tx)}
.v5-route-track{position:relative;padding:10px 0 4px;overflow:hidden}   /* hält den wandernden Lichtpunkt in der Spur (keine Überbreite) */
.v5-route-row{position:relative;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.v5-route-row::before{content:"";position:absolute;left:10%;right:10%;top:17px;height:1px;
  background:linear-gradient(90deg,rgba(242,240,234,.08),rgba(242,240,234,.34) 14%,rgba(242,240,234,.34) 86%,rgba(242,240,234,.08))}
.v5-node{position:relative;min-width:0;margin:0;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 clamp(6px,1.1vw,16px)}
.v5-node-no{position:relative;z-index:1;display:grid;place-items:center;width:34px;height:34px;border-radius:999px;border:1px solid rgba(242,240,234,.34);background:var(--bg);font:500 .78rem/1 var(--font-mono);color:var(--tx)}
.v5-node--key .v5-node-no{background:var(--cream);border-color:var(--cream);color:var(--ink);box-shadow:0 0 0 5px rgba(242,240,234,.07),0 0 22px rgba(145,139,183,.42)}
.v5-node-k{margin-top:16px;font:500 .72rem/1.4 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--tx)}
.v5-node-d{display:block;margin-top:6px;max-width:24ch;font-size:.9rem;line-height:1.45;color:var(--tx-body);text-wrap:pretty}
.v5-route-note{margin:0 auto;max-width:62ch;text-align:center;font-size:.9rem;line-height:1.55;color:var(--mut)}
/* Lichtpunkt (12.7): Spurbreites Element, nur transform/opacity (D-E10). Fleck in Höhe der Linie (Spur-Padding 10 + 17 px);
   linear statt --v5-ease, damit er bei voller Deckkraft (15–85 %) genau die Linie 10–90 % abfährt; Start nach dem Einblenden (.6 s). */
.v5-route-pulse{background:radial-gradient(closest-side,rgba(242,240,234,.95),rgba(145,139,183,.5) 45%,transparent) no-repeat 50% 20px/120px 14px}
@media(prefers-reduced-motion:no-preference) and (min-width:861px){#ablauf .v5-route.in .v5-route-pulse{animation-timing-function:linear;animation-delay:.5s}}
#ablauf .v5-cta-row{margin-top:clamp(28px,3.5vw,40px)}

/* 13.6 #kanzlei: Zwei-Verträge-Faltblock und Kooperationszeile (AP3, aus #ablauf verschoben; Plan § 3.6, § 5.3 „Kanzlei-Dokument“).
   Nur die Regeln für die verschobenen Teile; AP4 ergänzt raas_sub (.v5-fold-lead), lb_serious und den Dokument-Stil der Spalten. */
#kanzlei .v5-fold--doc{margin-top:clamp(32px,4vw,48px);padding-top:6px;border-top:1px solid var(--hairline)}
#kanzlei .v5-fold--doc>summary{font-size:1rem;font-weight:600;color:var(--tx)}
#kanzlei .v5-fold--doc>.v5-fold-body{max-width:860px;padding-top:10px}
#kanzlei .v5-fold--doc .raas-dual-rows{grid-template-columns:minmax(0,1fr);gap:8px;margin:0}
#kanzlei .v5-fold--doc .raas-dual-rows p{max-width:none}
#kanzlei .v5-fold--doc .v5-fold-body>p:not([class]){margin:14px 0 0;font-size:.92rem;line-height:1.6;color:var(--tx-body)}
#kanzlei .v5-coop{margin:18px 0 0;max-width:860px;text-align:left;font-family:var(--font-sans);font-size:.86rem;line-height:1.55;letter-spacing:0;text-transform:none;color:var(--mut)}
/* AP4 (Plan § 3.6, § 5.3 „Kanzlei-Dokument“, M19): Rechtsträger-Spalten als gesetztes Papier ohne Glas und Schatten; Kopf je Spalte
   als 2-px-Linie (UG Ink; Kanzlei #2A63BF, 5,0:1 auf Creme). Ersetzt die 5-px-Neon-Kappe auf Creme (Harte Grenze 8, AP1 offen).
   Mittelachse mit vertikalem Label bleibt (site.css). Text bündig mit der Kopflinie. */
#kanzlei .bp-card{background:transparent;box-shadow:none;border:0;border-radius:0;-webkit-backdrop-filter:none;backdrop-filter:none;padding:20px 0 4px}
#kanzlei .bp-card.regingada{border-top:2px solid var(--ink)}
#kanzlei .bp-card.kanzlei{border-top:2px solid #2A63BF}
#kanzlei .bp-card h3{margin:0}
#kanzlei .founder blockquote{max-width:62ch}
/* Faltblock: raas_sub als Einstieg (Sans 1 rem, Ink), lb_serious als letzter Absatz, beide linksbündig im Dokumentmaß */
#kanzlei .v5-fold-lead{margin:0 0 16px;max-width:none;font-family:var(--font-sans);font-size:1rem;line-height:1.6;color:var(--tx)}
#kanzlei .v5-fold--doc .boundary-serious{max-width:none;margin:18px 0 0;padding-top:14px;border-top:1px solid var(--hairline);text-align:left;font-size:.92rem;line-height:1.6;color:var(--tx-body)}
@media(max-width:640px){
  /* Porträt 96 px neben lb_cred statt darüber, Zitat volle Breite (Kopfabstand der Bühne mobil: 13.16 d, 13.19 q) */
  #kanzlei .signac-stage .founder{grid-template-columns:96px minmax(0,1fr);grid-template-areas:"q q" "p c";gap:18px 16px;align-items:center;padding:24px 12px}
  #kanzlei .founder>div{display:contents}
  #kanzlei .founder blockquote{grid-area:q;max-width:none}
  #kanzlei .founder-photo{grid-area:p}
  #kanzlei .founder img{width:96px}
  #kanzlei .founder figcaption{grid-area:c;margin-top:0}
}

/* 13.7 Breakpoints und Druck für 13.4–13.6 */
@media(max-width:1020px){
  #ablauf .lp-steps.v5-steps-3{gap:14px}
  #ablauf .lp-steps>li{padding:18px 16px 16px}
  #ablauf .lp-steps>li>p,#ablauf .v5-step-io dd{font-size:.84rem}
  .v5-node-d{font-size:.84rem}
}
@media(max-width:900px){
  .v5-ledger{grid-template-columns:minmax(0,1fr)}
  .v5-ledger-col,.v5-ledger-col:first-child,.v5-ledger-col:last-child{padding:18px 0 4px}
  .v5-ledger-col+.v5-ledger-col{margin-top:14px;border-left:0;border-top:1px solid var(--hairline)}
}
@media(max-width:860px){
  /* Schritte untereinander (641–860), dl zweispaltig; Tafel senkrecht: Linie links durch die Knotenmitte (17 px), Knoten als Zeilen */
  #ablauf .lp-steps.v5-steps-3{grid-template-columns:minmax(0,1fr)}
  .v5-step-io{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px}
  .v5-route-row{grid-template-columns:minmax(0,1fr)}
  .v5-route-row::before{display:none}
  .v5-node:not(:last-child)::after{content:"";position:absolute;left:16.5px;top:17px;bottom:-17px;width:1px;background:rgba(242,240,234,.34)}   /* Mitte Knoten n bis Mitte Knoten n+1 */
  .v5-node{display:grid;grid-template-columns:34px minmax(0,1fr);column-gap:16px;align-items:start;text-align:left;padding:0 0 18px}
  .v5-node:last-child{padding-bottom:0}
  .v5-node-no{grid-row:1 / span 2}
  .v5-node-k{margin-top:9px}
  .v5-node-d{margin-top:3px;max-width:none;font-size:.9rem}
  .v5-route-pulse{display:none}
}
@media(max-width:640px){
  /* Schritte als Wischleiste (.v5-rail, 86 % Karten, MOB-04 a); ID-Regel oben setzt sonst gap 20 px */
  #ablauf .lp-steps.v5-steps-3{gap:14px;align-items:stretch}      /* gleich hohe Karten in der Leiste (MOB-10 setzt flex-start) */
  #ablauf .lp-steps>li{padding:18px 18px 16px}
  .v5-step-io{grid-template-columns:minmax(0,1fr)}
  .v5-led>li{padding-block:10px}
  .v5-led>li::before{top:13px}
  .v5-led--doc>li::before{top:11px}
  #ablauf .v5-route{padding:24px 18px 26px}
  .v5-route-track{margin-top:24px;padding-top:4px}
  .v5-node{padding-bottom:16px}
  .v5-node-k{margin-top:8px}
  .v5-route-note{text-align:left;margin-left:0}
}
@media print{
  #ablauf .lp-steps>li::before{color:#000;border-color:#999}
  .v5-led>li::before{background:#000}
  .v5-led-tag,.v5-step-io dt,.v5-step-io dd,.v5-node-k,.v5-node-d{color:#000!important}
  #ablauf .v5-route{background:#fff;box-shadow:none;border-color:#999}
  .v5-route-pulse{display:none}
  .v5-node-no{background:#fff;color:#000;border-color:#999}
  .v5-node--key .v5-node-no{background:#000;color:#fff;box-shadow:none}
}

/* 13.8 Preise #pricing (AP4, Plan § 3.5): Kopfkarte mit Pfeil-Link statt Knopf (B-E2), Preisraster Rolle × Größe offen (B-E1;
   Zellen rep_pg_* = Ausschnitte der unveränderten rep_pt_*, assert_preise.py), Art. 22 als datierte Zwischenzeile, Konditionen als
   Zeile mit Haarlinien-Zellen, genau ein Primärknopf, Pläne-Hinweis als Fußzeile. Kein Neon außer dem Primärknopf. */
.v5-fees-wrap{position:relative}
#preisliste{scroll-margin-top:76px}                               /* Wert wie site.css Z. 151 (Plan § 5.3 Anker; jetzt div statt details) */
.v5-fees{width:100%;table-layout:fixed;border-collapse:collapse;border-spacing:0;font-variant-numeric:lining-nums tabular-nums}   /* fest: vier gleich breite Größenspalten */
.v5-fees caption{caption-side:top;text-align:left;padding:0 0 14px;font:500 .74rem/1.4 var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--tx)}
.v5-fees th,.v5-fees td{padding:12px 0 12px 16px;border-bottom:1px solid var(--hairline);text-align:right;vertical-align:baseline;font-weight:400}
.v5-fees thead th{padding-block:10px;font:500 .7rem/1.4 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mut);vertical-align:bottom}
.v5-fees thead th[scope="colgroup"]{text-align:right;color:var(--tx);letter-spacing:.12em}
.v5-fees thead th[rowspan]{width:15rem;text-align:left;padding-left:0}
.v5-fees thead tr:last-child th,.v5-fees thead th[rowspan]{border-bottom-color:var(--v5-rule)}   /* starke Linie unter dem Kopf */
.v5-fees tbody th{width:15rem;padding-left:0;padding-right:16px;text-align:left;font-family:var(--font-serif);font-weight:500;font-size:1.08rem;line-height:1.3;color:var(--tx)}
.v5-fees td.v5-pg{white-space:nowrap;font-size:.95rem;color:var(--tx-body)}
.v5-fees td.v5-pg-all{display:none}
.v5-fees td.v5-fees-span{text-align:left;font-size:.95rem;color:var(--tx-body)}
.v5-fees tr:has(+ .v5-fees-dated)>*{border-bottom:0}                /* Art.-22-Zeile gehört zur KI-VO-Zeile darüber */
.v5-fees-dated td{padding:0 0 12px calc(15rem + 16px);text-align:left;font-size:.86rem;line-height:1.5;color:var(--mut);text-wrap:pretty}
.v5-fees-foot{margin:14px 0 0;max-width:none;font-size:.82rem;line-height:1.6;color:var(--mut)}
/* Konditionen: Label + drei Haarlinien-Zellen (Raster auto · 3 × 1fr) */
.v5-terms{display:grid;grid-template-columns:auto minmax(0,1fr);margin-top:clamp(24px,3vw,32px);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.v5-terms-l{margin:0;padding:16px 28px 16px 0;font:500 .72rem/1.55 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--tx)}
.v5-terms ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.v5-terms li{margin:0;padding:16px 20px;border-left:1px solid var(--hairline);font-size:.88rem;line-height:1.55;color:var(--tx-body);text-wrap:pretty}
#pricing .v5-cta-row{margin:0}
/* Fußzeile: Querverweis auf die Software-Pläne in Teil III (Twin; bis R6 Teil II) (kein Nebenziel neben dem Kaufknopf) */
.v5-pr-foot{margin:0;padding-top:8px;max-width:none;border-top:1px solid var(--hairline);font-size:.86rem;color:var(--mut)}
.v5-pr-foot .link-arrow{display:inline-flex;align-items:flex-end;min-height:44px;padding-bottom:1px}

/* 13.9 Software-Pläne am Ende von #funnel (AP4, Plan § 3.16): #plans, pr_note, pr_sep wortgleich aus #pricing verschoben. Abstand oben
   und Haarlinie aus 10.5 (#plans, ID-Regel); hier die bisher an #pricing gebundenen Regeln (site.css „#pricing .price-d …“, 9.4, 10.5,
   12.3 Häkchen in Creme), damit Karten, Kontrast und Akzent gleich bleiben. */
#plans .price-d,#plans .price-per{color:var(--tx-body)}
#plans .price-feats li::before{color:var(--tx-body)}
#plans .price-card.price-addon .price-feats li::before{color:var(--mut)}
@media(min-width:861px){#plans .price-firms .pf-txt{flex:1 1 0;min-width:min(100%,440px)}}
#funnel>.wrap>.pricing-note{text-align:left;margin:14px 0 0;max-width:62ch;font-size:.82rem;line-height:1.55}
#funnel .pricing-sep{text-align:left;margin:16px 0 0;max-width:62ch;font-weight:400;font-size:.92rem;color:var(--tx-body)}

/* 13.10 Fragen #faq (AP4, Plan § 3.7, D-P4): neun Fragen rechts; links Kopf und Anfrage als EIN klebendes Element.
   Ersetzt 9.2 (Rasterteil) und 10.6. ≤ 1020: Aside per display:contents aufgelöst, Reihenfolge Kopf · Anfrage · Liste · weitere Fragen
   (Runde 3, Codex-Abnahme 1 A2: sichtbare Folge = DOM- und Tab-Folge wie am Desktop, kein Fokus-Rücksprung, wie #raas B04;
   Abweichung von Plan § 3.7 „Kopf · Liste · Anfrage“, Begründung im Bauprotokoll). */
.v5-faq-head h2{margin:0}
.v5-faq-cta{margin-top:28px}
.v5-faq-direct{margin:14px 0 0;max-width:none;font-size:.9rem;line-height:1.6;color:var(--mut)}
.v5-faq-direct a{padding-block:13px;   /* Trefferfläche ≥ 44 px ohne Layoutverschiebung (inline, wie 9.5) */
  color:var(--tx);text-decoration:underline;text-decoration-color:var(--hairline);text-decoration-thickness:1px;text-underline-offset:4px;white-space:nowrap}
.v5-faq-direct a:hover{color:var(--link-hover);text-decoration-color:currentColor}
#faq .v5-faq>.lp-faq{max-width:none;margin-top:0;border-top:1px solid var(--hairline)}
@media(min-width:1021px){
  #faq .v5-faq{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(40px,5vw,72px);align-items:start}
  .v5-faq-aside{grid-column:1;grid-row:1 / span 2;position:sticky;top:112px;align-self:start}
  #faq .v5-faq>.lp-faq{grid-column:2;grid-row:1}
  .v5-faq-more{grid-column:2;grid-row:2}
}
@media(max-width:1020px){
  #faq .v5-faq{display:flex;flex-direction:column}
  .v5-faq-aside{display:contents}
  .v5-faq-head{order:1}
  .v5-faq-cta{order:2}
  #faq .v5-faq>.lp-faq{order:3;margin-top:28px}
  .v5-faq-more{order:4}
}

/* 13.11 Breakpoints und Druck für 13.8–13.10 */
@media(max-width:1020px){
  .v5-fees tbody th,.v5-fees thead th[rowspan]{width:12rem}
  .v5-fees-dated td{padding-left:calc(12rem + 16px)}
  .v5-terms{grid-template-columns:minmax(0,1fr)}
  .v5-terms-l{padding:14px 0 0}
  .v5-terms li:first-child{border-left:0;padding-left:0}
}
@media(max-width:860px){
  .v5-fees th,.v5-fees td{padding-left:10px}
  .v5-fees tbody th{width:9.5rem;padding-left:0;padding-right:10px;font-size:1rem}
  .v5-fees thead th[rowspan]{width:9.5rem;padding-left:0}
  .v5-fees td.v5-pg,.v5-fees td.v5-fees-span{font-size:.9rem}
  .v5-fees-dated td{padding-left:calc(9.5rem + 10px)}
  .v5-terms ul{grid-template-columns:minmax(0,1fr)}
  .v5-terms li,.v5-terms li:first-child{padding:12px 0;border-left:0}
  .v5-terms li+li{border-top:1px solid var(--hairline)}
}
@media(max-width:640px){
  /* Preisraster als Blöcke: je Rolle Name (Serif) und der volle Wert rep_pt_* (B-E1 angepasst); NIS2, DGA, Art. 22 als Textzeile */
  .v5-fees,.v5-fees caption,.v5-fees tbody,.v5-fees tr,.v5-fees th,.v5-fees td{display:block}
  .v5-fees thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}   /* .v5-vh-Muster */
  .v5-fees caption{border-bottom:1px solid var(--v5-rule)}
  .v5-fees tbody tr{padding:14px 0;border-bottom:1px solid var(--hairline)}
  .v5-fees tbody th,.v5-fees td,.v5-fees td.v5-fees-span{width:auto;padding:0;border:0;text-align:left}
  .v5-fees tbody th{margin:0 0 4px;font-size:1.05rem}
  .v5-fees td.v5-pg{display:none}
  .v5-fees td.v5-pg-all{display:block;font-size:.92rem;line-height:1.5;color:var(--tx-body);text-wrap:pretty}
  .v5-fees tbody tr:has(+ .v5-fees-dated){padding-bottom:8px;border-bottom:0}
  .v5-fees tr.v5-fees-dated{padding-top:0}
  .v5-fees-dated td{padding:0}
  #preisliste{scroll-margin-top:100px}                            /* Wert wie site.css Z. 152 */
  #pricing .v5-cta-row{flex-direction:column;align-items:stretch}
  #pricing .v5-cta-row .btn{display:flex;width:100%;min-height:48px;justify-content:center;align-items:center;text-align:center}
  .v5-faq-cta .btn{display:flex;width:100%;min-height:48px;justify-content:center;align-items:center;text-align:center}
}
@media print{
  .v5-fees caption,.v5-fees th,.v5-fees td,.v5-fees-foot,.v5-terms-l,.v5-terms li,.v5-pr-foot,.v5-faq-direct{color:#000!important}
  .v5-fees th,.v5-fees td,.v5-terms,.v5-terms li{border-color:#999!important}
  .v5-faq-aside{position:static}
}

/* 13.12 Twin, seit R6 Teil III (AP5, Plan § 3.8–§ 3.17). Bildfenster aus 12.6; Werte und Messprotokoll im Bauprotokoll AP5.
   Lesbarkeitskaskade § 3.0: Wizard- und Funnel-Medium entfallen seit Fixer R1/R2 (Stufe 4, 13.19 a, 13.20 a); ihre Regeln hier
   (Darstellungsbreite 820/540 px, Stufe 3 aus AP5) in R2 AP10 gelöscht. Abstände oben seit D1 in 13.16 c. */
/* Bildband #poster-map: Fenster nur Graph (12.6, ≤ 640 eigenes Fenster); Höhe aus --ar (1440: 702 px wie bisher, 390: 312 px) */
#poster-map .v5-crop{width:100%}
/* 09 Substanz: Kennzahlen in der großen optischen Größe (Plan § 3.10, M18) */
#stats .kpi-num{font-weight:400;font-variation-settings:"opsz" 144;letter-spacing:-.03em}
/* 08 Twin: Split Text | Zitat (Plan § 3.9; seit Fixer R2 typografisch, 13.20 a) */
#twin .v5-twin-split .v5-twin-h{margin-top:0}
@media(min-width:1021px){
  #twin .v5-twin-split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,5vw,72px);align-items:center}
}
/* 11 Abdeckung: „Plus“-Zeilen als Faltblock (dt Mono, dd .9 rem) und Karte zweispaltig (Plan § 3.12) */
#regimes .v5-hooks-fold{margin-top:clamp(20px,3vw,28px)}
.v5-hooks{margin:0;border-top:1px solid var(--hairline)}
.v5-hooks>div{display:grid;grid-template-columns:6.5rem minmax(0,1fr);gap:16px;padding:12px 0;border-bottom:1px solid var(--hairline)}
.v5-hooks dt{margin:0;font:500 .72rem/1.65 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--tx)}
.v5-hooks dd{margin:0;max-width:72ch;font-size:.9rem;line-height:1.55;color:var(--tx-body);text-wrap:pretty}
#regimes .v5-map-txt>.sec-sub{margin-top:0}
#regimes .v5-map-split .map-figure{margin:24px 0 0}
@media(min-width:1021px){
  #regimes .v5-map-split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,5vw,72px);align-items:center}
  #regimes .v5-map-split .map-figure{margin:0}
}
/* 12 Cross-Regulation: Heatmap im Fenster; die 520-px-Kappung aus site.css („angeschnitten am Band-Rand“) gilt hier nicht (Plan § 3.13) */
#crossreg .crossreg-shotwrap .v5-heat-frame{max-height:none}
/* 13 Workflow + Cockpits: Workflow zuerst als sichtbarer Block mit H2, Cockpit-Faltblock danach mit Haarlinie (Plan § 3.14).
   Cockpit-Loop entfällt (kein sauberes Fenster); Standbild l4_vlop_dark im Fenster: Titel, Pflichtkarten Art. 34–38, Hinweis,
   Aktionszeile; ohne UI-Kopf (Altkopf), Banner und Fuß. --ar = .74 × 2400 / (.508 × 1500) */
.v5-crop--vlop{--x:.21;--y:.112;--w:.74;--h:.508;--ar:2.331;--src-ar:8/5}
#cockpits>#workflow{margin-top:0;padding-top:0;border-top:0}
#cockpits>.v5-cp-wrap>.v5-fold{padding-top:clamp(16px,2.4vw,24px);border-top:1px solid var(--hairline)}   /* Linie auf Inhaltsbreite, nicht über das Wrap-Padding */
/* Bildband #poster-art: anderer Ausschnitt als die Signac-Bühne in #kanzlei (D-E14): Band auf Bäume und Meer (rechts unten);
   die Bühne bleibt bei 50 % 30 % (Turm), weil signac_morph_live.js genau diesen Ausschnitt als Quellrechteck rechnet */
#poster-art .poster-img{object-position:100% 100%}

/* 13.13 Breakpoints und Druck für 13.12 */
@media(max-width:640px){
  .v5-hooks>div{grid-template-columns:minmax(0,1fr);gap:4px}
}
@media print{
  .v5-hooks dt,.v5-hooks dd{color:#000!important}
  .v5-hooks,.v5-hooks>div{border-color:#999!important}
}

/* 13.14 Herkunft/Vertrauen (seit R6 Teil II) und FAB (AP6, Plan § 3.18–§ 3.20, § 3.0 „Kontakt-FAB“, § 5.3). Jeder Selektor trägt #origin, #trust-teaser,
   #contact, #allpages, eine v5-Klasse oder den FAB-Bezug html.has-contact-fab/html.v5-fab-off (Harte Grenzen 1 und 2). */
/* Herkunft und Vertrauen, ein Band: Fakten-Raster als Liniengitter (border-top/left am Raster, right/bottom an den Zellen),
   eigene Icons 20 px in Creme, keine Siegel-Anmutung (R-E5, A7, C8); og_f2_v steht in EINER Zelle. Ersetzt das Inline-<style>. */
.v5-facts{list-style:none;margin:clamp(28px,3.5vw,40px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid var(--hairline);border-left:1px solid var(--hairline)}
.v5-facts>li{display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-width:0;margin:0;padding:24px;
  border-right:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.v5-facts .v5-ico{flex:none;display:block;width:20px;height:20px;color:var(--tx)}
.v5-facts .v5-k{font:500 .7rem/1.3 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.v5-facts .v5-v{font-size:.95rem;line-height:1.55;color:var(--tx);overflow-wrap:anywhere;text-wrap:pretty}
#origin .v5-v>.link-arrow{display:block;width:fit-content;margin:0 0 8px}
#origin .v5-v>.link-arrow:last-child{margin-bottom:0}
#origin .v5-og-fold{margin-top:20px}
#origin .v5-og-fold>.v5-fold-body{padding-top:12px}
#origin .og-body{max-width:74ch;margin:0;color:var(--tx-body);font-size:1rem;line-height:1.62;text-wrap:pretty}
/* #trust-teaser ist jetzt ein Block in #origin: Sektions-Padding aus site.css (#trust-teaser{padding:56px 0 12px}) aufheben;
   Anker mit den bestehenden Werten aus site.css Z. 151–152 (div fällt nicht unter section[id]) */
#origin .v5-trust{padding:0}
#trust-teaser{scroll-margin-top:76px}
#origin .v5-trust-h{margin:0;max-width:30ch;font-family:var(--font-serif);font-weight:450;font-variation-settings:"opsz" 72;
  font-size:clamp(1.4rem,2.4vw,1.8rem);line-height:1.2;letter-spacing:-.01em;color:var(--tx);text-wrap:balance}
.v5-facts--chips{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(20px,2.6vw,28px)}
.v5-facts--chips>li{flex-direction:row;align-items:center;gap:12px;padding:18px 20px;font-size:.92rem;line-height:1.4;color:var(--tx-body)}
.v5-facts--chips>li.v5-facts-go{justify-content:flex-start}
/* Schluss-Bühne #contact (§ 3.19): volles Sektionsmaß statt 56 px aus der Trust-Verschmelzung (site.css #contact.final-cta),
   Licht, Haarlinie und große H2 seit AP1 (12.1, 12.8); Notizen als ruhige Fußzeilen gleicher Größe */
#contact.final-cta{padding:clamp(96px,12vw,168px) 0 clamp(80px,10vw,136px)}
#contact .cta-note{max-width:62ch;font-size:.86rem;line-height:1.55}
#contact .hero-ctas + .cta-note{margin-top:clamp(28px,3vw,36px)}
#contact .cta-note + .cta-note{margin-top:8px}
/* Runde 7 (23.10.2026, Theo): zweites „Twin bauen“ in #contact als dezenter Textlink neben dem Primärknopf statt Ghost-Knopf
   (dasselbe Ziel /suite/, derselbe Key cta_launch). Gestalt „Link“ aus 13.20 c (Creme, 1-px-Linie, Gewicht 500, Hover Neon);
   die Linie als Unterstreichung am Text, damit sie bei 44 px Trefferhöhe nicht am Boxrand hängt; mobil so breit wie der Text, mittig. */
#contact .hero-ctas .v5-cta-twin{display:inline-flex;align-items:center;justify-content:center;min-height:44px;flex:0 0 auto;
  width:max-content;max-width:100%;align-self:center;padding-inline:4px;border-bottom:0;font-weight:500;color:var(--tx)}
#contact .hero-ctas .v5-cta-twin>span{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;
  text-decoration-color:var(--v5-link-line,rgba(242,240,234,.35))}
#contact .hero-ctas a.v5-cta-twin:hover{color:var(--link-hover)}
#contact .hero-ctas a.v5-cta-twin:hover>span{text-decoration-color:currentColor}
@media print{#contact .hero-ctas .v5-cta-twin>span{text-decoration-color:#999}}
/* Verzeichnis #allpages (§ 3.20): Faltblock im Maß von section.v5-folded (5), alle Links im DOM (G5) */
#allpages .v5-fold-body>.sec-sub{margin:0}
#allpages .idx-grid{margin-top:clamp(24px,3vw,34px)}
/* Kontakt-FAB (§ 3.0, § 5.3; D-E12). Runde 7 (23.10.2026, Theo): Erscheinung wie auf allen anderen Seiten (site.css
   .contact-fab: grüne beschriftete Pille); die Startseiten-Fassung (52-px-Kreis in Ink-Glas, Text nur für Screenreader) entfällt.
   Hier bleibt nur das Verhalten: Aus heißt immer opacity 0, pointer-events none und visibility hidden mit verzögertem
   visibility-Übergang, auch für das bestehende .is-hidden (über dem Hero, unter dem Wizard): die Tab-Taste erreicht den
   unsichtbaren FAB nie (WCAG 2.4.3/2.4.7). html.v5-fab-off setzt das v5-Skript (Observer). */
html.has-contact-fab .contact-fab{visibility:visible;
  transition:opacity .2s ease,transform .2s ease,box-shadow .15s ease,visibility 0s linear 0s}
html.v5-fab-off .contact-fab,html.has-contact-fab .contact-fab.is-hidden{opacity:0;pointer-events:none;transform:translateY(12px);visibility:hidden;
  transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}

/* 13.15 Breakpoints, Bewegung und Druck für 13.14 */
@media(max-width:860px){
  .v5-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v5-facts:not(.v5-facts--chips)>li:last-child:nth-child(odd){grid-column:1 / -1}   /* drei Fakten: dritte Zelle volle Breite statt Lücke */
  /* Touch-Ziele ≥ 44 px ohne Layoutverschiebung (Muster 9.5); Verzeichnis-Links mit padding-block 12 px (WCAG 2.5.8, P2-15) */
  #origin .v5-v>.link-arrow,#origin .v5-facts-go>.link-arrow{padding-top:20px;padding-bottom:4px}
  #allpages .idx-grid li{padding:0}
  #allpages .idx-grid li>a{display:block;padding-block:12px}
}
@media(max-width:640px){
  #trust-teaser{scroll-margin-top:100px}
  #contact.final-cta{padding:72px 0 56px}   /* mobil bestehendes Maß von .final-cta (site.css ≤ 640), Plan § 5.3 „Mobil: bestehend“ */
}
@media(max-width:480px){
  .v5-facts{grid-template-columns:minmax(0,1fr)}
  .v5-facts>li{padding:20px}
  .v5-facts--chips>li{padding:14px 18px}
}
@media(prefers-reduced-motion:reduce){
  html.has-contact-fab .contact-fab,html.v5-fab-off .contact-fab,html.has-contact-fab .contact-fab.is-hidden{transition:none}
}
@media print{
  .v5-facts,.v5-facts>li{border-color:#999!important}
  .v5-facts .v5-ico,.v5-facts .v5-k,.v5-facts .v5-v,#origin .v5-trust-h{color:#000!important}
}

/* 13.16 Höhenbudget und Struktur (AP9 D1, Plan § 2.2, § 8.3). Mittel nur Sektionsmaß, Abstände und Spalten; kein Text gekürzt,
   nichts gefaltet. Werte und Messung im Bauprotokoll „AP9 D1“. Jeder Selektor trägt main > section:not(.hero), eine Sektions-ID
   außer #top/#tour oder eine v5-Klasse (Harte Grenzen 1 und 2). */
/* a) Ein Sektionsmaß für alle Ink- und Papier-Bänder in main (vorher site.css clamp(72px,11vw,152px)); ausgenommen Hero,
      Bildbänder, gefaltete Sektionen (5) und die Schluss-Bühne #contact (§ 3.19, eigenes volles Maß). #raas behält nach dem Hero
      eine Stufe mehr Luft (site.css .hero + section), #stats verliert die Sonderregel ≤ 480 (site.css #stats{padding-top:56px}). */
main > section:not(.hero):not(.poster-band):not(.v5-folded):not(.final-cta){padding-block:clamp(48px,6.1vw,88px)}
main > #stats{padding-top:clamp(48px,6.1vw,88px)}
main > .hero + section#raas{padding-top:clamp(64px,7.2vw,104px)}
/* b) #raas: Intro-Raster 1fr | 1fr (Datenblatt-Werte brechen seltener), Sprungleiste mit Teil-Marke in der linken Spalte unter der
      Normzeile (füllt die Fläche neben dem längeren Datenblatt), Abstände zum Register enger, Brücke einzeilig */
#raas .v5-intro>.txt{min-width:0}                                  /* Wischzeile ≤ 640 darf die Rasterspalte nicht aufweiten */
#raas .v5-intro .v5-jumpbar{flex-direction:column;align-items:stretch;gap:10px;margin-top:20px;padding-top:16px}
#raas .v5-intro .v5-jumpbar .v5-part{max-width:none}
#raas .v5-roles-wrap{margin-top:clamp(40px,4vw,56px)}
#rollen .v5-roles-head{margin-bottom:24px}
#rollen .v5-roles-head .sec-sub{max-width:76ch}
#rollen .v5-bridge{margin-top:24px}
#rollen .v5-bridge p{max-width:none}
/* c) Abstände Teil I (Ledger, Ablauf, Tafel, Preise, Kanzlei) und Twin/Vision-Herkunft (Twin-Abschluss, Pläne, Vertrauen; R6: Twin = Teil III) */
#leistung .v5-ledger{margin-top:clamp(24px,2.4vw,28px)}
#leistung .v5-boundary{margin-top:clamp(24px,2.4vw,28px)}
#ablauf .lp-steps.v5-steps-3{margin-top:clamp(28px,2.6vw,32px)}
#ablauf .v5-route{margin-top:clamp(32px,2.8vw,40px)}
#ablauf .v5-cta-row{margin-top:32px}
.v5-route-track{margin-top:clamp(24px,2.4vw,32px)}
.v5-route-note{margin-top:clamp(20px,2vw,24px)}
.v5-fees-wrap{margin-top:clamp(28px,3vw,40px)}
#pricing .v5-cta-row,.v5-pr-foot{margin-top:clamp(24px,2.4vw,28px)}
#kanzlei .boundary-panel{margin-top:36px}
#kanzlei .signac-stage{margin-top:40px}
#kanzlei .v5-fold--doc{margin-top:clamp(28px,3vw,36px)}
#twin .v5-twin-split{margin-top:clamp(32px,2.8vw,40px)}
#regimes .v5-map-split{margin-top:clamp(36px,2.8vw,40px)}
#cockpits>.v5-cp-wrap{margin-top:clamp(40px,3.4vw,48px)}
#funnel .v5-twin-close{margin-top:clamp(40px,4vw,56px)}
#plans{margin-top:clamp(40px,4vw,56px)}
#origin .v5-trust{margin-top:clamp(48px,5vw,64px)}
@media(min-width:1021px){
  #raas .v5-intro{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .v5-roles{row-gap:16px}
  .v5-role{padding:22px 20px 14px}
  @supports (grid-template-rows:subgrid){.v5-role{row-gap:8px}}
  .v5-role-go,#rollen .v5-roles-links .link-arrow{min-height:36px}   /* Maus-Breite; ≤ 1020 bleiben 44 px (Touch) */
}
/* Ledger: die mittlere Spalte „Sie erhalten“ (sieben Zeilen mit Rollen-Tag) bestimmt die Höhe; sie bekommt mehr Breite */
@media(min-width:901px){
  .v5-ledger{grid-template-columns:minmax(0,.95fr) minmax(0,1.4fr) minmax(0,.85fr)}
}
@media(min-width:641px){
  #rollen .v5-bridge{padding:14px 20px}
  #ablauf .v5-route{padding:clamp(24px,3.4vw,48px)}
  #kanzlei .signac-stage{padding-top:clamp(84px,9vw,128px)}         /* site.css clamp(84px,16vw,210px): Baumkronen bleiben über der Karte */
  .v5-fees tbody th,.v5-fees tbody td{padding-block:10px}
  /* Bildband #poster-art (D-E14, Messung D1): flacher als 16:9, Ausschnitt bleibt unten rechts. Das Band zeigt Stadt, Meer und
     Stämme ohne die Baumkronen; die Bühne in #kanzlei zeigt am Desktop gerade die Kronen über der Gründerkarte */
  #poster-art .poster-img{aspect-ratio:12/5}
}
/* d) Mobil (§ 2.2 Nr. 1, 2, 4): Signac-Bühne kompakter, Ledger-, Tafel- und Kartenzeilen enger; Twin- und Workflow-Schritte als
      Wischleiste wie #ablauf, Suite und Abdeckung (.v5-rail, 8 · Breakpoints; Markup role="region", tabindex, rep_rail_steps_aria);
      Twin-Sprungleiste als eine Wischzeile wie in #raas (13.3) */
@media(max-width:640px){
  #kanzlei .signac-stage{padding-top:40px}
  #kanzlei .founder blockquote{font-size:1.04rem;line-height:1.48}
  .v5-led>li{padding-block:8px}
  .v5-led>li::before{top:11px}
  .v5-led--doc>li::before{top:9px}
  .v5-node{padding-bottom:12px}
  .v5-role{padding:16px 16px 8px}
  #raas .lp-glance dl>div{padding:7px 0}
  #faq .lp-faq summary{padding-block:12px}
  .v5-fees tbody tr{padding:12px 0}
  #twin .twin-steps.v5-rail,#workflow .steps-5.v5-rail{align-items:stretch}   /* gleich hohe Schrittkarten wie #ablauf (MOB-10 setzt flex-start) */
  #twin .v5-jump{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;
    margin-inline:-24px;padding:6px 24px;scroll-padding-inline:24px;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%)}
  #twin .v5-jump::-webkit-scrollbar{display:none}
  #twin .v5-jump>li{flex:0 0 auto;scroll-snap-align:start}
  #twin .v5-jump a{white-space:nowrap}
}
@media(max-width:480px){
  #twin .v5-jump{margin-inline:-16px;padding-inline:16px;scroll-padding-inline:16px;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 10px,#000 calc(100% - 10px),transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 10px,#000 calc(100% - 10px),transparent 100%)}
}

/* 13.17 Rhythmus und Glanz (AP9 D2, Plan § 3.0, § 5.6, § 8.3). Messung und Begründung im Bauprotokoll „AP9 D2“. Jeder Selektor
   trägt main > section:not(.hero), eine Sektions-ID außer #top/#tour oder eine v5-Klasse (Harte Grenzen 1 und 2). */
/* a) Licht (M01, D-E2): Vorher/Nachher bei 1440 px; #pricing und #twin (je ein Spot in der Ecke) kaum erkennbar → .15 statt .13.
      #raas ≤ 1020: die Ellipsen in Prozent der hohen Sektion liefen als senkrechte Lichtstreifen (mobil 4.400 px hoch) → feste Maße;
      ≤ 640 ohne Creme-Spot. #raas bleibt ohne position/isolation (AP1, Abweichung 2): nur background-image. */
#pricing,#twin{--v5-violet-glow:rgba(145,139,183,.15)}
@media(max-width:1020px){
  #raas{background-image:radial-gradient(720px 640px at 12% 0%,var(--v5-violet-glow),transparent 70%),radial-gradient(460px 520px at 92% 560px,var(--v5-cream-glow),transparent 72%)}
}
@media(max-width:640px){
  #raas{background-image:radial-gradient(440px 560px at 12% 0%,var(--v5-violet-glow),transparent 70%)}
}
/* b) Bildband-Captions ≤ 640 (12.4, D-P5, § 5.6): Teil-Marke unter #poster-art mobil 3,8:1 → dichterer Caption-Grund in beiden Bändern */
@media(max-width:640px){
  main > section.poster-band .poster-caption{background:linear-gradient(180deg,transparent,rgba(27,22,17,.74) 30%,rgba(27,22,17,.9))}
}
/* c) Akzent (M04, § 5.6): Neon nur Primärknopf, Fokus, Hover, FAB-Punkt. Listen-Chevrons in #crossreg, #cockpits, #funnel in Creme
      wie die Häkchen (12.3); Kante der Cockpit-Kennzeile violett wie Twin-Kante und Grenzbox; Wortmarke „RCS“ Creme → Violett */
main > section:not(.hero) .bullets li::before{background:var(--tx-body)}
#cockpits .inline-stat{border-left-color:var(--violet)}
#funnel .suite-mark{background-image:linear-gradient(90deg,var(--cream),var(--violet))}
/* d) Typografie (M18): große Serif-H3 wie H2 (450, opsz 72, −.015em); twin_engine in der Split-Spalte ruhiger (450 statt 600,
      kleiner, mehr Zeilenabstand): 6 → 4–5 Zeilen, Kante violett bleibt */
main > section:not(.hero) h3.v5-fold-h,#twin .v5-twin-h,#funnel .v5-twin-close-h{font-weight:450;font-variation-settings:"opsz" 72;letter-spacing:-.015em;text-wrap:balance}
#twin .v5-twin-split .twin-engine{margin:20px 0 0;font-size:clamp(1.06rem,1.4vw,1.2rem);font-weight:450;font-variation-settings:"opsz" 72;line-height:1.42;letter-spacing:-.005em}
/* e) Bündigkeit Rollen-Register: Preis oben im Fuß (eine Linie je Reihe, Subgrid), Aktions-Link unten (eine Linie je Reihe);
      DGA-Sprachhinweis steht im Markup vor dem Link */
@supports (grid-template-rows:subgrid){
  #rollen .v5-role-foot{align-self:stretch}
  #rollen .v5-role-go{margin-top:auto}
}
/* f) Workflow (§ 3.14): Schritt 5 „Mandat“ ist die Grenze („vier in der Software, der fünfte im Mandat“) und lief am Desktop als
      schmale 16-Zeilen-Spalte → ab 1021 px vier Software-Schritte in einer Reihe, Schritt 5 als breite Grenzzeile darunter
      (Titel links, Text rechts ≤ 78ch); 641–1020 zwei Spalten, Schritt 5 gestapelt. ≤ 640 bleibt die Wischleiste (13.16 d). */
@media(min-width:641px){
  #workflow .steps-5{grid-template-columns:repeat(4,minmax(0,1fr))}
  #workflow .steps-5>.step-final{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);grid-template-rows:auto 1fr;
    column-gap:clamp(24px,3vw,40px);align-items:start;padding-left:16px}            /* 3 px Kante + 16 = Textkante der Karten (1 + 18) */
  #workflow .steps-5>.step-final>.step-no{grid-column:1;grid-row:1;justify-self:start}
  #workflow .steps-5>.step-final>h3{grid-column:1;grid-row:2}
  #workflow .steps-5>.step-final>p{grid-column:2;grid-row:1 / span 2;max-width:78ch}
  @supports (grid-template-columns:subgrid){
    /* Spaltenkante: Text von Schritt 5 beginnt auf der Textkante von Karte 2 (Spuren aus dem Schritte-Raster, Versatz 1 + 18 px) */
    #workflow .steps-5>.step-final{grid-template-columns:subgrid;column-gap:normal}   /* normal = Abstand des Elternrasters, sonst Versatz */
    #workflow .steps-5>.step-final>p{grid-column:2 / -1;padding-left:19px}
  }
}
@media(min-width:641px) and (max-width:1020px){
  #workflow .steps-5{grid-template-columns:repeat(2,minmax(0,1fr))}
  #workflow .steps-5>.step-final{display:block}
  #workflow .steps-5>.step-final>p{padding-left:0}
}
/* g) Hover im Papier-Band: die ID-Regel 13.6 (#kanzlei … summary{color}) überdeckte den Hover des Faltblocks */
#kanzlei .v5-fold--doc>summary:hover{color:var(--link-hover)}

/* 13.18 Mobil, Bewegung, Druck, Tastatur (AP9 D3, Plan § 3.0, § 8.3). Messung und Begründung im Bauprotokoll „AP9 D3“. Jeder
   Selektor trägt main > section:not(.hero), eine Sektions-ID außer #top/#tour oder den FAB-Bezug html.has-contact-fab
   (Harte Grenzen 1 und 2). */
/* a) Tastatur, Sprungleisten mobil (13.3, 13.16 d): fokussierte Einträge am Rand blieben halb unter der Randmaske oder außerhalb
      der Zeile (Einrasten zog zurück). Solange der Fokus in der Zeile ist, kein Einrasten; das v5-Skript rollt den Eintrag frei. */
@media(max-width:640px){
  #raas .v5-jump:focus-within,#twin .v5-jump:focus-within{scroll-snap-type:none}
}
/* b) Tastatur und FAB (§ 3.0, D-E12): beim Weitertabben landete der Fokus mobil unter dem FAB (FAQ-Plus, Leisten). Solange der FAB
      sichtbar ist, bleibt der Bereich unten beim Einrollen frei (nur Scroll-Ausrichtung; keine Darstellung, Anker oben unverändert).
      Bis Runde 7 nur ≤ 860 px (am Desktop lag der 52-px-Kreis neben der Inhaltsspalte); seit der Pille (13.14, Runde 7) ragt der FAB
      bis etwa 1600 px Fensterbreite in die Spalte, daher auf allen Breiten. Nie über dem Hero (FAB .is-hidden) oder bei
      html.v5-fab-off: Hover und Fokus im Hero rollen wie bisher (Harte Grenze 1; ohne diese Bedingung verschob es den Hero-Fokus). */
html.has-contact-fab:not(.v5-fab-off):has(> body > .contact-fab:not(.is-hidden)){scroll-padding-bottom:88px}
/* c) Bewegung (§ 3.0 C7, reduce: „kein Lift“): Suite- und Abdeckungskarten, Entwicklerkarten und Primärknöpfe im Inhalt sprangen
      unter reduce beim Hover 1–2 px (site.css ohne reduce-Ausnahme) */
@media(prefers-reduced-motion:reduce){
  main > section:not(.hero) .glass-card.hoverable:hover,main > section:not(.hero) .int-card:hover,main > section:not(.hero) .btn.btn-primary:hover{transform:none}
}
/* d) Druck (§ 3.0 „Licht aus“): Creme-Text der Ink-Sektionen druckte Weiß auf Weiß (Datenblatt, Rollen-Register, Sprungleisten,
      FAQ-Fragen, Preiskopf, Pläne, Faltblock-Titel). Alle Inhaltssektionen schwarz auf Weiß, Nebentext grau, Kanten grau, ohne
      Schatten und Glas; Captions der Bildbänder unter dem Bild; FAQ ohne Marker; Schlüssel-Knoten der Tafel mit Kante statt Fläche.
      Kantenlicht (12.2, maskiertes ::before) aus: ohne „Hintergrundgrafiken“ verschluckte Chromium damit den ganzen Karteninhalt
      (Datenblatt und Rollenkarten druckten leer). Code-Beispiele in #radar brechen um statt abgeschnitten zu werden. Bilder in
      Faltblöcken (loading=lazy) lädt das v5-Skript beim Drucken nach; bis sie da sind, fehlt ihr Rahmen statt leer zu drucken. */
@media print{
  main > section:not(.hero) .v5-edge::before{display:none}
  #radar pre{white-space:pre-wrap;overflow-wrap:anywhere;overflow:visible}
  main > section:not(.hero) [data-v5-druck-leer]{display:none!important}   /* Bild noch nicht geladen (v5-Skript, beforeprint) */
  main > section:not(.hero){--tx:#000;--tx-body:#1b1b1b;--mut:#555;--hairline:#bbb;--card-glass-bd:#999;--v5-rule:#000;--link-hover:#000}
  main > section:not(.hero) *,main > section:not(.hero) *::before,main > section:not(.hero) *::after{color:#000!important;text-shadow:none!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  main > section:not(.hero) .v5-part,main > section:not(.hero) .v5-role-l,main > section:not(.hero) .v5-role-lang,main > section:not(.hero) .v5-fold-note,#raas .lp-glance dt,#suite .uc-chips-label{color:#555!important}
  main > section.poster-band .poster-caption{position:static;padding:10px 0 0;background:none!important}
  #faq .lp-faq summary::after{display:none}
  #ablauf .v5-node--key .v5-node-no{background:#fff!important;border:2px solid #000!important}
}

/* 13.19 Fixer R1 (Kritikrunde 1: Recht, Technik, Klarheit, Vertretung, Hochglanz; Vorrang in dieser Reihenfolge). Messung und
   Begründung im Bauprotokoll „Fixer R1“. Jeder Selektor trägt main > section:not(.hero), eine Sektions-ID außer #top/#tour oder
   eine v5-Klasse (Harte Grenzen 1 und 2). */
/* a) Medien im Twin-Teil (seit R6 Teil III), R-P5 in Gerätepixeln (Kritik Recht BL-1, BL-2, V-A2–V-A4). Sauber heißt: der sichtbare Ausschnitt enthält
      an keiner Breite (320–1920, DPR 2, 200 % Zoom) eine der verbotenen Zeilen; dann ist die Lesbarkeit ohne Belang.
      Twin-Fenster und Suite-Fenster dieser Runde: R2 AP10 gelöscht (Twin-Standbild entfällt seit Fixer R2, 13.20 a; die Suite-
      Fenster ersetzt 13.20 b, Grenzen im Bauprotokoll „Fixer R1“ und bau/huelle_grenzen.json).
      Floating-Karten: GPAI-Zeitleiste (überholte KI-VO-Daten) und CELEX-Karte („35“ nicht in der R8-Liste) ausgeblendet, im DOM. */
#cockpits .vis .floating-card,#crossreg .crossreg-shotwrap .floating-card{display:none}
/* Funnel (Kaskade Stufe 4, Hochglanz A „DRAFT/FINAL-Leiste als Bild“): Text | Schrittleiste CHECK · DRAFT · FINAL untereinander;
   die Leiste beginnt auf der Oberkante der H2 (Kicker-Zeile + 14 px). ≤ 1020 einspaltig wie .split. */
#funnel .v5-fn-ladder{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin:0}
#funnel .v5-fn-ladder>.step{display:grid;grid-template-columns:7.5rem minmax(0,1fr);column-gap:20px;align-items:baseline}
#funnel .v5-fn-ladder>.step>.step-no{grid-row:1 / span 2;justify-self:start;margin:0}
#funnel .v5-fn-ladder>.step>h3,#funnel .v5-fn-ladder>.step>p{grid-column:2}
@media(min-width:1021px){
  #funnel .v5-fn-split{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:start}
  #funnel .v5-fn-ladder{margin-top:34px}
}
@media(max-width:480px){
  #funnel .v5-fn-ladder>.step{display:block}
  #funnel .v5-fn-ladder>.step>.step-no{margin-bottom:10px}
}
/* b) Bildbehandlung für Produktmedien (Hochglanz A): kalte, blaugraue Screens auf warmem Ink → leichte Wärme, Ink-Multiply mit
      24-px-Auslauf unten, Kantenlicht als Rahmen; das Poster-Band mit warmer Randvignette. Senkt Kontrast und Sättigung, nie die
      Fenster (R-P5 bleibt gleich oder besser). Im Druck aus. */
main > section:not(.hero) .v5-media-warm{position:relative}
main > section:not(.hero) .v5-media-warm img,main > section:not(.hero) .v5-media-warm video,#poster-map .poster-img{filter:sepia(.12) saturate(.9)}
main > section:not(.hero) .v5-media-warm::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:1;
  background:linear-gradient(180deg,rgba(27,22,17,0) calc(100% - 24px),rgba(27,22,17,.42)),rgba(27,22,17,.08)}
main > section:not(.hero) .v5-media-warm::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;z-index:2;
  background:var(--v5-edge-grad);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
#poster-map .v5-crop::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 75% 70% at 50% 45%,transparent 55%,rgba(27,22,17,.5) 100%),linear-gradient(90deg,rgba(27,22,17,.28),transparent 18%,transparent 82%,rgba(27,22,17,.28))}
@media print{
  main > section:not(.hero) .v5-media-warm::before,main > section:not(.hero) .v5-media-warm::after,#poster-map .v5-crop::after{display:none}
  main > section:not(.hero) .v5-media-warm img,#poster-map .poster-img{filter:none}
}
/* c) Schritt-Nummern, eine Gestalt (Hochglanz A, D-E9): Mono 11,2 px, Pill 26 px, Haarlinie, Creme; Variante mit Label (Workflow,
      Funnel) ist dieselbe Pill. Twin-Kreis (34 px, Serif 17,9 px) und Ablauf-Zähler darauf; nur die Tafel-Knoten bleiben Kreise. */
#twin .twin-steps .step-no{display:inline-block;width:auto;height:auto;border-radius:999px;padding:3px 12px;font-family:var(--font-mono);
  font-size:.7rem;font-weight:400;letter-spacing:.14em;line-height:1.6;margin-bottom:10px}
#ablauf .lp-steps>li::before{font-family:var(--font-mono);font-size:.7rem;font-weight:400;letter-spacing:.14em;line-height:1.6;padding:3px 12px}
/* d) Zustellweg-Tafel als Bild (Hochglanz A, D-E4; weicht von § 3.4 „Mono-Kurzwort“ ab): Kopf, Knotenreihe und Fuß auf einer
      gemeinsamen Mittelachse; Knoten 56 px mit Kantenlicht, Kurzwort in Serif 450, Lichtlinie 2 px mit violettem Verlauf; der
      Lichtpunkt läuft weiter einmal in Höhe der Linie (Spur-Padding 10 + 27 px − 7). Höhe: Kopf und Fuß rücken enger.
      ≤ 860 senkrecht wie bisher (34-px-Knoten, Mono-Kurzwort): eine Serif-Fassung kostete mobil 20 px, Puffer Teil I mobil (§ 2.2). */
@media(min-width:861px){
  #ablauf .v5-route>.kicker,#ablauf .v5-route-h{text-align:center}
  #ablauf .v5-route-row::before{top:27px;height:2px;
    background:linear-gradient(90deg,rgba(145,139,183,0),rgba(145,139,183,.62) 12%,rgba(242,240,234,.5) 50%,rgba(145,139,183,.62) 88%,rgba(145,139,183,0))}
  #ablauf .v5-node-no{width:56px;height:56px;font-size:.86rem;border-color:rgba(242,240,234,.24);
    background:radial-gradient(circle at 50% 0%,rgba(242,240,234,.16),transparent 72%),var(--bg);
    box-shadow:inset 0 1px 0 rgba(242,240,234,.38),0 12px 26px -14px rgba(0,0,0,.95)}
  #ablauf .v5-node--key .v5-node-no{background:var(--cream);border-color:var(--cream);box-shadow:0 0 0 6px rgba(242,240,234,.07),0 0 30px rgba(145,139,183,.5)}
  #ablauf .v5-node-k{margin-top:16px;font:450 clamp(1.12rem,1.45vw,1.32rem)/1.25 var(--font-serif);font-variation-settings:"opsz" 72;letter-spacing:-.005em;text-transform:none}
  #ablauf .v5-node-d{margin-top:4px}
  #ablauf .v5-route-pulse{background-position:50% 30px}
  #ablauf .v5-route-track{margin-top:clamp(18px,1.8vw,24px)}
  #ablauf .v5-route-note{margin-top:clamp(14px,1.4vw,18px)}
}
/* e) Schluss-Bühne #contact (Hochglanz A; weicht von § 3.19 „bestehender Neon-Schimmer“ ab, Rückbau = diese zwei Regeln löschen):
      Neon-Schimmer (site.css .final-cta, rgba(188,255,27,.08)) über dem violetten ::before ergab eine olivstichige Lichtmitte
      (RGB 45/43/32) → Grund Ink, violettes Licht von oben bleibt, dazu ein schwacher Creme-Kern. Neon je Viewport damit überall 1.
      Kleingedrucktes (Hochglanz C): Leistungslink 24 px unter den Knöpfen, Haarlinie, dann Kontaktzeile und Rechtsberatungssatz. */
#contact.final-cta{background:var(--bg)}
#contact::before{background:radial-gradient(420px 240px at 50% 34%,rgba(242,240,234,.05),transparent 70%),radial-gradient(60% 70% at 50% 0%,rgba(145,139,183,.16),transparent 70%)}
#contact .hero-ctas + .cta-note{margin-top:24px}
#contact .cta-note.cta-phone{position:relative;margin-top:24px;padding-top:22px}
#contact .cta-note.cta-phone::before{content:"";position:absolute;top:0;left:50%;width:240px;max-width:60%;height:1px;transform:translateX(-50%);background:var(--v5-hair-fade)}
/* f) Sprungleisten (Technik B3, Hochglanz B, Klarheit A/C): Liste in nav[aria-label] (Landmarke; aria-Key wandert an das nav),
      #twin in der Gestalt von #raas: Teil-Marke als Kopf über der Zeile, Chips mit Nummer aus data-n (09–15).
      Mobil (Klarheit A): Chip 3 ragte bei 390 DE ganz aus dem Bild; engere Chips, damit am rechten Rand immer ein Eintrag anläuft. */
#raas .v5-jump-nav,#twin .v5-jump-nav{flex:1 1 auto;min-width:0}
#twin .v5-jumpbar--twin{flex-direction:column;align-items:stretch;gap:10px;margin-top:28px;padding-top:16px}
#twin .v5-jump{margin:0;gap:8px}
#twin .v5-jump a{display:inline-flex;align-items:center;gap:7px;letter-spacing:.04em}
#twin .v5-jump a::before{content:attr(data-n);color:var(--mut);letter-spacing:.06em}
@media(max-width:640px){
  #twin .v5-jumpbar--twin{gap:8px;margin-top:24px}
  #raas .v5-jump,#twin .v5-jump{gap:6px}
  #raas .v5-jump a,#twin .v5-jump a{padding:0 9px;gap:5px;letter-spacing:.02em}
  #raas .v5-jump-nav,#twin .v5-jump-nav{position:relative}
  #raas .v5-jump-nav.v5-mehr::after,#twin .v5-jump-nav.v5-mehr::after{content:"";position:absolute;top:6px;bottom:6px;right:-24px;width:52px;pointer-events:none;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F2F0EA' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.5 6.5 15 12l-5.5 5.5'/%3E%3C/svg%3E") no-repeat right 20px center/14px 14px,
      linear-gradient(90deg,rgba(27,22,17,0),var(--bg) 58%)}
}
@media(max-width:480px){
  #raas .v5-jump-nav.v5-mehr::after,#twin .v5-jump-nav.v5-mehr::after{right:-16px;background-position:right 12px center,0 0}
}
/* g) Links in Inhaltskarten und Linkzeilen (Hochglanz B, M04): 1 px Creme-Unterstrich statt 2 px Blau; Hover wie gehabt
      (--link-hover, --link-hover-bd). Das Blau bleibt für Fließtext-Links; Haus-Token unverändert. Persona-Einstiege in #raas. */
#rollen .v5-role .link-arrow,#rollen .v5-roles-links .link-arrow,#raas .v5-persona .link-arrow,#origin .link-arrow,#regimes .link-arrow{
  border-bottom-width:1px;border-bottom-color:rgba(242,240,234,.35)}
#rollen .v5-role a.link-arrow:hover,#rollen .v5-roles-links a.link-arrow:hover,#raas .v5-persona a.link-arrow:hover,#origin a.link-arrow:hover,#regimes a.link-arrow:hover{
  border-bottom-color:var(--link-hover-bd)}
#raas .v5-persona{margin:8px 0 0;font-size:.92rem;line-height:1.45}
#raas .v5-persona .link-arrow{display:table;margin:2px 0 0;padding-block:5px;font-weight:600;border-bottom:0;
  text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;text-decoration-color:rgba(242,240,234,.35)}
#raas .v5-persona a.link-arrow:hover{text-decoration-color:var(--link-hover-bd)}
@media(max-width:1020px){#raas .v5-persona .link-arrow{margin:0;padding-block:12px}}   /* Touch-Ziel ≥ 44 px (einzeilig 20 + 24) */
@media(max-width:640px){#raas .v5-persona{font-size:.875rem}}
@media print{#raas .v5-persona .link-arrow{text-decoration-color:#999}}
/* h) Kleinteile (Hochglanz C): Kopflinie des Datenblatts so lang wie die Zeilenlinien (max-width der p-Regel aufgehoben) */
#raas .lp-glance-h{max-width:none}
/* i) Preise (Technik B, Hochglanz B/C, Klarheit B, Vertretung B). Kein Preis-Text und kein Preis-Markup geändert (assert_preise --streng).
      ≤ 640: je Rolle die vorhandenen Zellen td.v5-pg als 2 × 2-Raster mit Band-Etikett statt des Sammelsatzes td.v5-pg-all
      (Umbruch „6.400 / €“ entfällt, kürzer). Die Etiketten sind die Bandköpfe rep_pg_c1–c4 (EN = DE „Micro · Small · Medium ·
      Large“) als CSS-Inhalt; ändert sich ein Bandkopf, hier mitziehen. Die Art.-11-Zeile von rep_pt_dsa steht wie am Desktop nur
      im Ledger (rep_in_6). Desktop: NIS2/DGA-Textzeilen rechtsbündig wie „Auf Anfrage“ in der Spalte Large; Kopfkarte rechts
      bündig auf der Large-Kante; Konditionen jetzt vier Zellen; Verweis auf die Preisliste unter dem Raster. */
.v5-fees td.v5-fees-span{text-align:right}
.v5-fees-foot .v5-fees-more{font-size:.86rem;white-space:nowrap}   /* Abstand, Gewicht, Linie und Trefferfläche seit Fixer R2 in 13.20 c */
@media(min-width:1021px){.v5-terms ul{grid-template-columns:minmax(0,1.1fr) minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr)}}
@media(min-width:861px){
  #pricing .price-firms .pf-cta{align-self:center;text-align:right;align-items:flex-end;margin-left:auto}
}
@media(min-width:861px) and (max-width:1020px){
  .v5-terms ul{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v5-terms li:nth-child(3){border-left:0;padding-left:0}
  .v5-terms li:nth-child(n+3){border-top:1px solid var(--hairline)}
}
@media(max-width:640px){
  .v5-fees tbody tr:not(.v5-fees-text):not(.v5-fees-dated){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px}
  .v5-fees tbody tr:not(.v5-fees-text):not(.v5-fees-dated)>th{grid-column:1 / -1}
  .v5-fees td.v5-pg{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:5px 0 0;font-size:.92rem;color:var(--tx-body);white-space:nowrap}
  .v5-fees td.v5-pg::before{font:500 .64rem/1.4 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
  .v5-fees td.v5-pg:nth-of-type(1)::before{content:"Micro"}
  .v5-fees td.v5-pg:nth-of-type(2)::before{content:"Small"}
  .v5-fees td.v5-pg:nth-of-type(3)::before{content:"Medium"}
  .v5-fees td.v5-pg:nth-of-type(4)::before{content:"Large"}
  .v5-fees td.v5-pg-all{display:none}
  .v5-fees td.v5-fees-span{text-align:left}
  .v5-terms li,.v5-terms li:first-child{padding-block:10px}
}
/* j) Bildband-Captions als Kapitelmoment (Hochglanz B, D-P5): Teil-Marke bleibt Versal-Mono, die Caption-Zeile (poster_*, Wortlaut
      unverändert) in Serif 450 mit opsz 72; unter #poster-map die Kurzzeile rep_part2_note (Klarheit B) in Sans. Kontrast neu gemessen. */
main > section.poster-band .poster-caption .kicker{font:450 clamp(1.45rem,2.4vw,2.1rem)/1.15 var(--font-serif);font-variation-settings:"opsz" 72;
  letter-spacing:-.01em;text-transform:none;color:var(--cream);max-width:30ch;text-wrap:balance}
main > section.poster-band .poster-caption .v5-part-note{display:block;margin:10px 0 0;max-width:62ch;font:400 .92rem/1.5 var(--font-sans);color:var(--cream);opacity:1}
/* die höhere Caption reicht weiter ins Bild: Teil-Marke unter #poster-art fiel auf 4,3:1 → dichterer Grund ab 641 px (wie 13.17 b mobil) */
main > section.poster-band .poster-caption{padding-top:clamp(48px,5vw,72px)}   /* Text beginnt im dichten Teil des Verlaufs */
@media(min-width:641px){
  main > section.poster-band .poster-caption{background:linear-gradient(180deg,transparent,rgba(27,22,17,.68) 30%,rgba(27,22,17,.9))}
}
/* k) Versal-Mono nur für Etiketten bis vier Wörter (Hochglanz B): Sätze in Sans 14 px, Satzschrift, --tx-body (nur CSS, kein Wortlaut) */
#suite .uc-note,#regimes .shot-caption,#crossreg .crossreg-stat-note{font-family:var(--font-sans);font-size:.875rem;line-height:1.5;letter-spacing:0;text-transform:none;color:var(--tx-body);max-width:72ch}
#regimes .map-facts{display:grid;gap:8px;margin-top:16px}
#regimes .map-facts li{position:relative;padding-left:18px;font-family:var(--font-sans);font-size:.875rem;line-height:1.5;letter-spacing:0;text-transform:none;color:var(--tx-body)}
#regimes .map-facts li::before{content:"";position:absolute;left:2px;top:.6em;width:6px;height:6px;border-top:1.5px solid var(--tx);border-right:1.5px solid var(--tx);transform:rotate(45deg)}
/* l) Abdeckungskarten mit klarer Abstufung (Hochglanz B): Titel · Leitsatz (Serif 450, opsz 72, Creme) · Text (400, --tx-body) · Detail 13 px */
#regimes .coverage-card .cov-twin{font-weight:400;color:var(--tx-body)}
#regimes .coverage-card .cov-tag{font-weight:450;font-variation-settings:"opsz" 72;letter-spacing:-.005em;color:var(--tx)}
#regimes .coverage-card p:not(.cov-twin):not(.cov-tag){font-size:.8125rem;line-height:1.5}
/* m) Karten-Hover einheitlich (Hochglanz B): Schatten eine Stufe tiefer, hellere Kante, 2 px Lift (unter reduce ohne Lift, 13.18 c);
      im Register trägt die Karte den Zustand, der Titel bleibt Creme (vorher Neon). */
main .dark-band,main .final-cta,main > section:not([class]){
  --card-glass-shadow-hover:inset 0 1px 0 rgba(242,240,234,.26),0 4px 12px rgba(0,0,0,.45),0 48px 88px -34px rgba(0,0,0,.92)}
@media(hover:hover){
  #rollen .v5-role:hover{--v5-edge-grad:linear-gradient(180deg,rgba(242,240,234,.62),rgba(242,240,234,.12) 42%,rgba(145,139,183,.42))}
  #rollen .v5-role-t a:hover{color:inherit}
  main > section:not(.hero) .glass-card.hoverable:hover{border-color:rgba(242,240,234,.24)}
}
/* n) #origin (Hochglanz B): Fakten- und Vertrauen-Raster ohne Kastengitter, nur innere Trennlinien und die auslaufende Haarlinie
      oben und unten (ein Linien-System mit den Sektionskanten); erste Spalte bündig mit der Textkante */
#origin .v5-facts{border:0;background-image:var(--v5-hair-fade),var(--v5-hair-fade);background-size:100% 1px;background-repeat:no-repeat;background-position:top center,bottom center}
#origin .v5-facts>li{border:0}
@media(min-width:861px){
  #origin .v5-facts>li+li{border-left:1px solid var(--hairline)}
  #origin .v5-facts>li:first-child{padding-left:0}
}
@media(min-width:481px) and (max-width:860px){
  #origin .v5-facts>li:nth-child(2n){border-left:1px solid var(--hairline)}
  #origin .v5-facts>li:nth-child(n+3){border-top:1px solid var(--hairline)}
  #origin .v5-facts>li:nth-child(2n+1){padding-left:0}
}
@media(max-width:480px){
  #origin .v5-facts>li{padding-left:0;padding-right:0}
  #origin .v5-facts>li+li{border-top:1px solid var(--hairline)}
}
@media print{#origin .v5-facts{background-image:none;border-top:1px solid #999;border-bottom:1px solid #999}}
/* o) Druck (Technik B): keine Überschrift allein am Seitenende, keine geteilten Karten, Schritte und Tabellenzeilen */
@media print{
  main > section:not(.hero) :is(h2,h3,.kicker){break-after:avoid}
  main > section:not(.hero) :is(.v5-role,.lp-steps>li,.step,.v5-edge,.lp-glance,.v5-fn-ladder,tr,.lp-faq details){break-inside:avoid}
}
/* p) Kleinteile (Technik C, Hochglanz C): Tap-Ziele 641–860 wie MOB-03 (≤ 640); Gründer-Caption mobil ohne Überlauf;
      Kooperationszeile #kanzlei so breit, dass „·“ nicht am Zeilenanfang steht; H2 #stats ohne Bruch nach „EU-“ */
@media(min-width:641px) and (max-width:860px){
  #suite a.suite-arrow{display:inline-grid;place-items:center;min-width:44px;min-height:44px;margin:-9px}
  #regimes .coverage-card>.link-arrow,#funnel .v5-twin-close .link-arrow{display:inline-flex;align-items:center;min-height:44px}
  #kanzlei .bp-card li>a{display:inline-block;padding-block:12px}
}
@media(max-width:400px){#kanzlei .founder figcaption{overflow-wrap:anywhere;letter-spacing:.04em}}
@media(min-width:861px){#stats h2{text-wrap:wrap;max-width:21em}}   /* balance brach nach „EU-“ (stats_h geteilt); seit R8-P2 rep_stats_h, Regel bleibt (schadet der kurzen Zeile nicht) */
html[lang="de"] #kanzlei .v5-coop{max-width:96ch}   /* DE: Bruch vor „· Rechtsberatung“ bei 1024–1920 → nach „keine“; zwei Zeilen wie bisher, EN unverändert */
@media(min-width:861px){#ablauf .v5-cta-row{justify-content:center}}   /* Knopf auf der Mittelachse der Tafel statt verwaist links (Hochglanz C) */
/* q) Höhenbudget Teil I (§ 2.2) nach den Ergänzungen dieser Runde (Frage 11, Konditionen-Zeile, Persona-Einstiege, Tafel):
      nur Abstände, kein Text gekürzt. FAQ-Zeilen 8 px flacher (Summary bleibt ≥ 44 px), Sprungleiste,
      Rollenkarten (Zeilenabstand 6 px), Signac-Bühne und Kanzlei-Listen mobil enger. */
#faq .lp-faq details{padding-block:2px}
#faq .lp-faq summary{padding-block:12px}
@media(max-width:640px){#faq .lp-faq summary{padding-block:10px}}
#raas .v5-intro .v5-jumpbar{margin-top:16px}
@media(min-width:1021px){@supports (grid-template-rows:subgrid){#rollen .v5-role{row-gap:6px}}}
@media(max-width:640px){
  #rollen .v5-role{row-gap:6px;gap:6px}
  #kanzlei .signac-stage{padding-top:28px}
  #kanzlei .signac-stage .founder{padding:20px 12px}
  #kanzlei .bp-card li{padding-block:6px}
}

/* 13.20 Fixer R2 (Kritikrunde 2: Recht, Technik, Klarheit, Vertretung, Hochglanz; Vorrang in dieser Reihenfolge). Messung und
   Begründung im Bauprotokoll „Fixer R2“. Jeder Selektor trägt main > section:not(.hero), eine Sektions-ID außer #top/#tour oder
   eine v5-Klasse (Harte Grenzen 1 und 2). Regeln aus 13.19, die hier überschrieben werden, sind genannt (Aufräumen AP10). */
/* a) #twin typografisch (Recht BL-1, Hochglanz B-1, Klarheit B2): Standbild entfällt (Stufe 4, Markup); links Frage und Absatz,
      rechts twin_engine als Serif-Zitat (450, opsz 72) in einer Glasfläche mit Kantenlicht, violette Kante wie bisher.
      Ersetzt 13.19 a „.v5-crop--twin“, 13.19 p „#twin … .twin-shot{display:none}“ (Regeln greifen ins Leere). */
#twin .v5-twin-split--typo .v5-twin-quote{margin:28px 0 0;padding:clamp(24px,2.8vw,40px) clamp(22px,3vw,44px);border-radius:18px}
#twin .v5-twin-split--typo .twin-engine{margin:0;max-width:none;padding-left:clamp(16px,1.6vw,22px);border-left:3px solid var(--violet);
  font-size:clamp(1.28rem,1.95vw,1.85rem);font-weight:450;font-variation-settings:"opsz" 72;line-height:1.3;letter-spacing:-.012em;color:var(--tx);text-wrap:pretty}
@media(min-width:1021px){
  #twin .v5-twin-split--typo{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start}
  #twin .v5-twin-split--typo .v5-twin-quote{margin:0}
}
@media(max-width:640px){   /* mobil eine Stufe kleiner: das Zitat war 7 Zeilen à 20,5 px in 24-px-Glasfläche */
  #twin .v5-twin-split--typo .v5-twin-quote{margin-top:22px;padding:18px 18px 20px}
  #twin .v5-twin-split--typo .twin-engine{font-size:1.14rem;line-height:1.34;padding-left:14px}
}
/* Klarheit B2 (2): ab 861 px Schritte 1–3 ohne Kartenfläche (offene Spalten unter einer Haarlinie), Schritt 4 „EU-Vertretung
   anfragen“ bleibt die einzige Karte und damit die Brücke zur Anfrage. ≤ 860 Wischleiste mit Karten wie bisher. */
@media(min-width:861px){
  #twin .twin-steps>.step:not(.v5-step-go){background:none;border:0;border-top:1px solid var(--hairline);border-radius:0;box-shadow:none;padding-left:0;padding-right:clamp(8px,1.4vw,20px)}
}
/* b) #suite: eine Fenster-Regel für alle sechs Vorschaubilder (Hochglanz A, Recht V-A1). Rahmen innen 150 px hoch (wie bisher).
      Das Bild hat eine feste Anzeigebreite --iw (= Quellbreite × Maßstab) und steht mit dem Quellpunkt (--ax, --ay) auf dem
      Rahmenpunkt (--fx, --fy); so bleibt der Maßstab über die Breiten gleich und das Fenster wächst um den Anker. Maßstab
      Karten 1–4 0,25–0,32 (Cmd-K 0,41 bei Rahmen > 336 px, Quelle nur 1.120 px breit). Karten 5 und 6 liegen höher (0,50–0,93
      bzw. 0,40–0,66): ihre zulässigen Bereiche (R1: KI y ≥ .447, x ≥ .355; Funnel y .30–.555) lassen kein kleineres sauberes
      Fenster zu (Recht vor Hochglanz). Jedes Fenster endet an einer UI-Kante oder in einer Lücke, nie in einer lesbaren Zeile;
      16 px Ink-Auslauf unten. Messung (suite.mjs, suite_pruef.py, 320–1920 in 5-px-Schritten) im Bauprotokoll.
      Ersetzt 13.19 a (--x/--w/--yc/--sar) und site.css .suite-thumb img (object-fit:cover) für #suite. */
#suite .suite-thumb.v5-thumb{position:relative;box-sizing:content-box;height:150px}
#suite .suite-thumb.v5-thumb>img{position:absolute;max-width:none;height:auto;object-fit:fill;margin:0;width:var(--iw);
  left:calc(var(--fx) * 100%);top:calc(var(--fy) * 100%);transform:translate(calc(var(--ax) * -100%),calc(var(--ay) * -100%))}
#suite .v5-thumb--map{--iw:648px;--fx:.5;--fy:.5;--ax:.5;--ay:.55}                 /* 0,27 · Graphmitte, Hülle x .153–.846 y .38–.72 */
#suite .v5-thumb--heat{--iw:600px;--fx:1;--fy:0;--ax:.999;--ay:.2286}              /* 0,25 · rechtsbündig ab Kopfkante: Zeilen AI 5–AI 16, alle Treffer */
#suite .v5-thumb--vlop{--iw:470.6px;--fx:0;--fy:0;--ax:0;--ay:0}                   /* 0,253 · volle Höhe (wie bisher cover) */
#suite .v5-thumb--cmdk{--iw:352.8px;--fx:0;--fy:0;--ax:0;--ay:.1815}               /* 0,315 · Subjects bis ECJ-Treffer, Auslauf in der Lücke */
#suite .v5-thumb--ai{--iw:max(650.5px,286.5%);--fx:0;--fy:.5;--ax:.6494;--ay:.7352}  /* Karte 3 ab der Lücke vor ihr, mit beiden Textzeilen */
#suite .v5-thumb--fn{--iw:max(min(1228.8px,510.64%),352.94%);--fx:0;--fy:.5;--ax:0;--ay:.4507}   /* Regime-Profil DSA mit Knöpfen, ohne Badge */
/*    R8-P0 (24.10.2026): Karten 5 und 6 bleiben Fenster (Quellen belastet, Tausch hiesse Dopplung oder fremdes Modul). Nachmessung
      320–1920 px / 5 px, EN+DE: KI x .355–1 · y .449–1, Funnel x 0–.284 · y .301–.554, nirgends Leerfläche. Anker nur mit
      neuer Messung aller Breiten ändern. */
@media(max-width:365px){
  #suite .v5-thumb--vlop{--iw:338.18%;--ax:.0323;--fy:1;--ay:1}   /* Rahmen < 226 px: Spalte Art. 34 / Art. 37 (x 60–610) statt angeschnittenem Titel */
  #suite .v5-thumb--fn{--iw:510.64%;--ax:.0117;--ay:.4267}          /* mit Kopfzeile ab der Wortlücke: „Regime-Profil“ statt des Quellanschnitts „hr …“ */
}
@media(min-width:506px) and (max-width:640px),(min-width:866px) and (max-width:1020px){#suite .v5-thumb--cmdk{--iw:459.2px;--ay:.2173}}
@media(min-width:456px) and (max-width:589px),(min-width:804px) and (max-width:989px){#suite .v5-thumb--ai{--iw:max(1034.9px,286.5%);--fy:1;--ay:.787}}   /* Ziffer und Titel */
@media(min-width:590px) and (max-width:640px),(min-width:990px) and (max-width:1020px){#suite .v5-thumb--ai{--iw:155.36%;--ax:.3547;--ay:.7241}}       /* Karten 2 und 3 */
main > section:not(.hero)#suite .suite-thumb.v5-media-warm::after{background:linear-gradient(180deg,rgba(27,22,17,0) calc(100% - 16px),rgba(27,22,17,.6)),rgba(27,22,17,.08)}
/* c) Link-System (Hochglanz B): zwei Gestalten in main. „Link“ = Creme mit 1-px-Linie rgba(242,240,234,.35), Hover Neon: in Karten,
      Streifen, Listen, Datenblatt (wie 13.19 g), dazu Datenblatt-Link, Twin-Streifen, Twin-Schritt 4; Persona-Einstiege und
      Preislisten-Link als Unterstreichung in Gewicht 500. „Abschluss-Link“ = 2 px Blau (Haus-Token, site.css) nur noch für den
      einen Schluss-Link je Sektion außerhalb von Karten (#pricing „Software-Pläne“, #faq, #funnel „Zurück“, #contact). */
main > section:not(.hero){--v5-link-line:rgba(242,240,234,.35)}
#raas .lp-glance-more,#rollen .v5-bridge .link-arrow,#twin .v5-step-go .link-arrow{border-bottom-width:1px;border-bottom-color:var(--v5-link-line)}
#raas a.lp-glance-more:hover,#rollen .v5-bridge a.link-arrow:hover,#twin .v5-step-go a.link-arrow:hover{border-bottom-color:var(--link-hover-bd)}
#raas .v5-persona .link-arrow{font-weight:500;text-wrap:balance}   /* Hochglanz C: DE „(EN) →“ nicht mehr allein in Zeile 2 */
/*    Preislisten-Link (Technik B-2, Vertretung C, Hochglanz C): eigene Zeile unter dem Bandsatz statt inline mit 12 px Padding;
      Linie 5 px unter dem Text, Trefferfläche 44 px über ein unsichtbares ::after (Fokusring nur um den Link, nicht über der
      Vorzeile). Ersetzt 13.19 i „.v5-fees-foot .v5-fees-more“. */
#pricing .v5-fees-foot .v5-fees-more{position:relative;display:table;margin:10px 0 0;padding-block:0;border-bottom:0;font-weight:500;
  text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;text-decoration-color:var(--v5-link-line)}
#pricing .v5-fees-foot .v5-fees-more::after{content:"";position:absolute;inset:-12px -4px}
#pricing .v5-fees-foot a.v5-fees-more:hover{text-decoration-color:var(--link-hover-bd)}
@media print{#pricing .v5-fees-foot .v5-fees-more{text-decoration-color:#999}}
/* d) Sprungleisten mobil (Technik B-1, Klarheit C2): der Pfeil nav.v5-mehr::after (13.19 f) deckt 52 px am Zeilenende; der
      fokussierte Chip rollt jetzt davor (das focusin-Skript liest scroll-padding-right). Twin-Leiste läuft wie #raas bis an den
      Rand (13.19 f „#twin .v5-jump{margin:0}“ hob den Auslauf aus 13.x auf): erster Chip bei 16 px statt 32 px. */
@media(max-width:640px){
  #raas .v5-jump,#twin .v5-jump{scroll-padding-inline-end:52px}
  #twin .v5-jump{margin-inline:-24px}
}
@media(max-width:480px){#twin .v5-jump{margin-inline:-16px}}
/* e) Persona-Einstiege: Touch-Ziel 44 px auch auf Tablets quer ab 1021 px (Technik C-1); Maus-Desktop unverändert */
@media(min-width:1021px) and (pointer:coarse){#raas .v5-persona .link-arrow{margin:0;padding-block:12px}}
/* f) Preisraster mobil (Technik C-2): Band-Etikett ohne zweite Ansage (CSS-Inhalt mit leerem Alternativtext; ältere Browser
      behalten die erste Angabe) */
@media(max-width:640px){
  .v5-fees td.v5-pg:nth-of-type(1)::before{content:"Micro";content:"Micro" / ""}
  .v5-fees td.v5-pg:nth-of-type(2)::before{content:"Small";content:"Small" / ""}
  .v5-fees td.v5-pg:nth-of-type(3)::before{content:"Medium";content:"Medium" / ""}
  .v5-fees td.v5-pg:nth-of-type(4)::before{content:"Large";content:"Large" / ""}
}
/* g) Druck (Technik B-3): Preis-Kopfkarte nicht über eine Seitengrenze */
@media print{#pricing .price-firms{break-inside:avoid}}
/* h) Bildband #poster-map wärmer (Hochglanz B; Vorschlag sepia(.22) saturate(.8) + .22 ergab noch B > R, gemessen): Bild sepia(.4) saturate(.75), Multiply-Fläche rgba(70,46,22,.34) über das ganze Band
      (vorher wirkte nur die Randvignette, unten); Ziel R ≥ B im Bild, Caption-Kontrast neu gemessen (Bauprotokoll). Druck aus. */
#poster-map .v5-crop{isolation:isolate}   /* Überlagerungen bleiben im Bildfenster, die Caption liegt darüber */
#poster-map .poster-img{filter:sepia(.4) saturate(.75)}
#poster-map .v5-crop::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:rgba(70,46,22,.34);mix-blend-mode:multiply}
#poster-map .v5-crop::after{z-index:2}
main > section.poster-band .poster-caption .v5-part-note{text-wrap:balance}
@media print{#poster-map .v5-crop::before{display:none}}
/* i) Ein Rahmen für alle Produktmedien im Twin-Teil (seit R6 Teil III) (Hochglanz B): Ink-Steg 10 px, Rand rgba(255,255,255,.12), Radius 18; Steg auf
      Ink (27/22/17) statt violett-navy (27/24/38, site.css .shot-frame--ink); #regimes bisher Glas-Karte */
#regimes .map-figure .shot-frame,#crossreg .shot-frame--ink,#cockpits .shot-frame--ink{background:var(--bg);border:1px solid rgba(255,255,255,.12);
  border-radius:18px;padding:10px;box-shadow:0 2px 3px rgba(26,24,23,.08),0 24px 60px -18px rgba(0,0,0,.5)}
/* j) #leistung (Hochglanz B): RDG-Kasten mit lesbarem Satzmaß (vorher 1.132 px, ≈ 150 Zeichen je Zeile); Wortlaut unverändert */
#leistung .v5-boundary{max-width:min(100%,780px)}
/* k) #pricing Kopfkarte (Hochglanz C): Häkchenliste 2 × 2 statt 3 + 1 (≤ 560 px einspaltig wie site.css) */
@media(min-width:561px){#pricing .price-firms .price-feats-row{display:grid;grid-template-columns:repeat(2,max-content);gap:6px 28px}}
/* l) #ablauf (Hochglanz C): eine Zählweise für alle Schritt-Pills („1“ wie #twin, #workflow; „01“ bleibt den Kapitelnummern);
      Tafel unten 16 px enger (Innenluft unter der Fußzeile war ≈ 56 px gegen ≈ 40 px über der H2) */
#ablauf .lp-steps>li::before{content:counter(lpstep)}
@media(min-width:861px){#ablauf .v5-route{padding-bottom:calc(clamp(24px,3.4vw,48px) - 16px)}}
/* m) #funnel Schluss (Hochglanz C): RCS-Satz mit Normzitaten ausgeglichen umbrochen; mobil linksbündig unter einer auslaufenden
      Haarlinie wie in #contact. „Zurück zur EU-Vertretung“ mobil nur so breit wie der Text (Unterstrich lief über 358 px). */
#funnel .v5-twin-close .cta-serious{text-wrap:balance}
@media(max-width:640px){
  #funnel .v5-twin-close .cta-serious{position:relative;text-align:left;margin-top:22px;padding-top:18px}
  #funnel .v5-twin-close .cta-serious::before{content:"";position:absolute;top:0;left:0;width:240px;max-width:70%;height:1px;background:var(--v5-hair-fade)}
  #funnel .v5-twin-close .hero-ctas .link-arrow{flex:0 0 auto;width:max-content;max-width:100%;align-self:center}
}
/* 13.21 Fixer R3 (Kritikrunde 3: Recht, Technik, Klarheit, Vertretung, Hochglanz; Vorrang in dieser Reihenfolge). Messung und
   Begründung im Bauprotokoll „Fixer R3“. Jeder Selektor trägt eine Sektions-ID außer #top/#tour oder main > section:not(.hero)
   (Harte Grenzen 1 und 2). Medienrahmen: weder --iw noch --fx/--fy/--ax/--ay noch die Rahmenhöhe geändert; Abnahme
   bau/huelle_pruef.mjs (Recht R3 V-A1). Kein Text, kein Preis-Markup. */
/* a) Druck (Technik B-1): Bandsatz mit Preislisten-Link und die Gegenüberstellung der zwei Rechtsträger je als Einheit */
@media print{
  #pricing .v5-fees-foot{break-inside:avoid}
  #kanzlei .boundary-panel{break-inside:avoid}
  #kanzlei{break-before:page}   /* Kapitel 06 auf neuer Seite: Kopf und Gegenüberstellung zusammen (break-after:avoid am H2 wirkt in Chromium nicht) */
}
/* b) #twin mobil (Klarheit B1, Recht V-B1 „zulässig, twin_note direkt darunter“): Schritt 4 „EU-Vertretung anfragen“ lag als
      vierte Karte der Wischleiste außer Sicht. ≤ 640 ist die Leiste ein Raster: Schritte 1–3 wischbar in Zeile 1 (86 % wie
      bisher), Schritt 4 in Zeile 2 über die volle Inhaltsbreite (100 % / .86 der ersten Spalte) und per sticky immer sichtbar.
      DOM- und Vorlesereihenfolge 1–2–3–4 bleiben; Schritt 4 nimmt nicht am Einrasten teil. */
@media(max-width:640px){
  #twin .twin-steps.v5-rail{display:grid;grid-template-columns:repeat(3,86%);grid-auto-rows:auto;column-gap:14px;row-gap:12px;align-items:stretch}
  #twin .twin-steps.v5-rail>.v5-step-go{grid-row:2;grid-column:1;justify-self:start;width:calc(100% / .86);box-sizing:border-box;
    position:sticky;left:0;scroll-snap-align:none;z-index:1}
}
/* c) Wischleisten #suite und #regimes gleich hoch (Hochglanz B-1, Recht V-B1): MOB-10 (10.13) setzt flex-start, 13.16 d nahm
      nur #twin/#workflow aus. Die Suite-Karte ist schon Spalte (site.css), das Vorschaubild sitzt mit margin-top:auto am Fuß;
      Rahmen 150 px und Anker unverändert. */
@media(max-width:640px){
  #suite .suite-grid.v5-rail,#regimes .coverage-grid.v5-rail{align-items:stretch}
  #suite .uc-chips-label{flex-basis:100%;margin-right:0}   /* Hochglanz C: Etikett in eigener Zeile, Chips danach paarweise */
}
/* d) #suite Bildkanten (Hochglanz B-2, Recht V-B1 „vorzugswürdig“): der Ink-Auslauf unten (13.20 b) läuft jetzt an allen vier
      Kanten; die Überlagerung blendet nur aus (kein neuer Bildinhalt, Hülle gleich). Karte 5 (KI): rechts breiterer Auslauf über
      dem Seitenrand hinter dem Modal. */
main > section:not(.hero)#suite .suite-thumb.v5-media-warm::after{background:
  linear-gradient(90deg,rgba(27,22,17,.84),rgba(27,22,17,0) var(--v5-fl,14px),rgba(27,22,17,0) calc(100% - var(--v5-fr,14px)),rgba(27,22,17,.84)),
  linear-gradient(180deg,rgba(27,22,17,.6),rgba(27,22,17,0) 12px,rgba(27,22,17,0) calc(100% - 16px),rgba(27,22,17,.66)),rgba(27,22,17,.08)}
#suite .v5-thumb--ai{--v5-fl:18px;--v5-fr:28px}
@media(min-width:1021px){#suite .v5-thumb--ai{--v5-fl:22px;--v5-fr:46px}}   /* Seitenbalken 1440: links ≈ 14, rechts ≈ 40 px */
/*    Hover (Hochglanz C): das Vorschaubild hellt leicht auf, Rahmen heller; keine Bewegung (13.18) */
#suite .suite-card.hoverable .suite-thumb.v5-media-warm>img{transition:filter .25s ease}
@media(hover:hover){
  #suite .suite-card.hoverable:hover .suite-thumb.v5-media-warm>img{filter:sepia(.12) saturate(1) brightness(1.08)}
  #suite .suite-card.hoverable:hover .suite-thumb{border-color:rgba(242,240,234,.22)}
}
/* e) Bildband #poster-map (Hochglanz B-3): statt der gleichmäßigen Multiply-Fläche (13.20 h) eine radiale warme Ink-Vignette
      (Mitte .16, Ränder .46); Bild mit mehr Kontrast, Wärme bleibt (R ≥ B gemessen). Fenster unverändert. Druck aus (13.20 h). */
#poster-map .poster-img{filter:sepia(.5) saturate(.8) contrast(1.15) brightness(1.06)}
#poster-map .v5-crop::before{background:radial-gradient(ellipse 72% 78% at 58% 42%,rgba(70,46,22,.16) 0,rgba(70,46,22,.26) 45%,rgba(70,46,22,.46) 100%)}
/* f) #pricing (Hochglanz B-4, C; Technik C-1). Konditionen ab 1021 px in vier gleichen Spalten (13.19 i: 1.1/1.5/1/1 fr).
      Kopfkarte ab 861: Preisblock oben auf der Titelachse, eine Haarlinie über die volle Innenhöhe trennt ihn vom Text
      (Zwei-Spalten-Blatt); Preis bleibt rechtsbündig auf der Large-Kante. Preislink: Fokusring 6 px vom Unterstrich weg. */
@media(min-width:1021px){   /* gleiche Spalten kosten Höhe (Rabattzeile schmaler): Innenabstand 16/20 → 14 px, Teil I Desktop +18 px statt +44 */
  #pricing .v5-terms ul{grid-template-columns:repeat(4,minmax(0,1fr))}
  #pricing .v5-terms li{padding:14px}
  #pricing .v5-terms-l{padding:14px 18px 14px 0}
}
@media(min-width:861px){
  #pricing .price-firms{align-items:stretch}
  #pricing .price-firms .pf-cta{display:flex;flex-direction:column;justify-content:flex-start;align-self:stretch;
    min-width:clamp(240px,24%,300px);padding-left:clamp(24px,3vw,40px);border-left:1px solid var(--hairline)}
}
#pricing .v5-fees-foot .v5-fees-more:focus-visible{outline-offset:6px}
/* g) Kleine Angleichungen (Hochglanz C): Twin-Zitat Radius 16 wie alle Glasflächen; „Das ganze Bild“ 500 wie die Registertitel;
      Vertrauensband ohne Waise; Kontaktangaben in #faq und #contact in einer Gestalt (Link-System 13.20 c: Creme, 1-px-Linie). */
#twin .v5-twin-split--typo .v5-twin-quote{border-radius:16px}
#regimes .coverage-card.link-card h3{font-weight:500}
#trust-teaser .v5-facts--chips>li{text-wrap:balance}
#faq .v5-faq-direct a,#contact .cta-note.cta-phone a{color:var(--tx);text-decoration:underline;text-decoration-color:var(--v5-link-line);
  text-decoration-thickness:1px;text-underline-offset:4px}
#faq .v5-faq-direct a:hover,#contact .cta-note.cta-phone a:hover{color:var(--link-hover);text-decoration-color:currentColor}
/* 13.22 Fixer R4 (Kritikrunde 4: Recht, Technik, Klarheit, Vertretung, Hochglanz; Vorrang in dieser Reihenfolge). Messung und
   Begründung im Bauprotokoll „Fixer R4“. Jeder Selektor trägt eine Sektions-ID außer #top/#tour (Harte Grenzen 1 und 2); einzige
   Ausnahme ist der Fuß im Druck (a). Medienrahmen: weder --iw noch --fx/--fy/--ax/--ay noch die Rahmenhöhe geändert; Abnahme
   bau/huelle_pruef.mjs. Kein Text, kein Preis-Markup. */
/* a) Druck (Technik R4 B-1, Folge von 13.21 a): die FAB-Reserve im Fuß (site.css 1141/1144, 98/106 px) galt auch im Druck und
      schob im EN-Druck eine leere Schlussseite an; die Gründerkarte in #kanzlei brach über zwei Seiten (leerer Rahmen unten). */
@media print{
  html.has-contact-fab footer.site-footer{padding-bottom:0}
  #kanzlei .founder{break-inside:avoid}
}
/* b) #suite (Hochglanz R4 A-1, Technik R4 C-2, Recht R4 V-B1): Hover und Licht gelten der ganzen Karte, also ist die ganze Karte
      der Link wie im Rollen-Register (12.x .v5-role-t a::after, Fokus per :has). Der vorhandene Pfeil-Link (/suite/, aria-label,
      im Markup aria-describedby auf die H3) wird per ::after über die Karte gestreckt: kein neuer Link, kein Text. Das ::after liegt
      am Link, nicht am Bildrahmen; z-index 3 über den Bild-Ebenen (.v5-media-warm ::after 1, ::before 2), die Auslauf-Überlagerung
      13.21 d bleibt. ≤ 640 liegt der Ring innen, weil die Wischleiste oben keinen Innenabstand hat (sonst beschnitten). */
#suite .suite-card{position:relative}
#suite .suite-card a.suite-arrow::after{content:"";position:absolute;inset:0;z-index:3;border-radius:16px}
#suite .suite-card:has(a.suite-arrow:focus-visible){outline:3px solid var(--focus-ctx);outline-offset:4px}
@supports selector(:has(*)){#suite .suite-card a.suite-arrow:focus-visible{outline:none}}
@media(max-width:640px){#suite .suite-card:has(a.suite-arrow:focus-visible){outline-offset:-3px}}
/* c) Lichtführung Twin-Teil, seit R6 Teil III (Hochglanz R4 A-2, Recht R4 V-B1 „z-index:-1, im Druck aus, cta_serious nicht schwächer“): M01 mit
      wechselnder Lage nach #twin (links): #suite rechts, #cockpits links, technisch wie #pricing/#twin (12.1). Die Schluss-Bühne
      des Twin-Teils bekommt ein schwaches Creme-Licht von oben über den ganzen Block (Twin-Satz und cta_serious gleich hell); Violett
      bleibt #contact als stärkster Bühne. Kein Neon, keine Höhenänderung. */
#suite,#cockpits{position:relative;isolation:isolate}
#suite::before,#cockpits::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none}
#suite::before{background:radial-gradient(60% 50% at 90% 0%,var(--v5-violet-glow),transparent 70%)}
#cockpits::before{background:radial-gradient(60% 50% at 10% 0%,var(--v5-violet-glow),transparent 70%)}
#funnel .v5-twin-close{--v5-cream-glow:rgba(242,240,234,.06);   /* Token lokal eine Stufe heller (Muster Z. 931); Text min. 6,3 : 1 */
  background-image:radial-gradient(70% 85% at 50% 0%,var(--v5-cream-glow),transparent 72%);background-repeat:no-repeat}
@media print{#suite::before,#cockpits::before{display:none}#funnel .v5-twin-close{background-image:none}}
/* d) #regimes (Hochglanz R4 B-1): Lift, hellere Kante und tieferer Schatten nur an der Link-Karte „Das ganze Bild“; die fünf
      Abdeckungskarten ohne Ziel bleiben beim Hover ruhig (ID schlägt 13.20 m und site.css .glass-card.hoverable:hover). */
@media(hover:hover){
  #regimes .coverage-card:not(.link-card):hover{transform:none;border-color:var(--card-glass-bd);box-shadow:var(--card-glass-shadow)}
}
/* e) #raas ≤ 380 px (Klarheit R4 B1): Runde 3 gelöscht. Die Anzeige-Reihenfolge per order/display:contents ist durch die
      DOM-Reihenfolge ersetzt (Codex design B04, 13.23 b: Datenblatt direkt unter den Knöpfen bis 1020 px, ohne Fokus-Rücksprung).
      Wortlaut der gelöschten Regel im Bauprotokoll „Runde 3 · Umsetzung Design und Hochglanz“. */
/* f) #leistung (Hochglanz R4 C-1): EN-Spaltenetikett „Included: the representative function“ brach in der 302-px-Box zweizeilig
      (Liste in Spalte 1 18 px tiefer als in Spalte 3). Begrenzt hat nicht max-width (schon none), sondern der rechte Innenabstand
      der Spalte (clamp 18–34 px, 12.x Z. 465): ab 1021 px darf das Etikett der ersten Spalte ihn bis auf 10 px vor der Haarlinie
      nutzen (1440: 326 statt 302 px). Liste und Lesemaß unverändert; DE einzeilig wie bisher. */
@media(min-width:1021px){#leistung .v5-ledger>.v5-ledger-col:first-child>.v5-ledger-h{margin-right:calc(10px - clamp(18px,2.4vw,34px))}}
/* g) Titelstufen (Hochglanz R4 C-3): Sans-700-Kartentitel in zwei Stufen, 16 px Schritte, 20 px Produkt- und Angebotskarten
      (Modul- und Regimekarten); Plankarten (site.css .price-name 1.1rem) und Angebots-Kopfkarten (.price-firms h3 1.2rem) folgen.
      Nur Größe, kein Text (Recht R4 V-B1). */
#funnel .price-card .price-name,#pricing .price-firms h3,#funnel .price-firms h3{font-size:1.25rem}

/* 13.23 Runde 3 · Codex design (konzept/r2/codex3/design/ENTSCHEID_design.md B01, B04, B06–B10, B15, B16; dazu
   codex3/vertretung/ENTSCHEID_vertretung.md B08, Markup #pricing). Messung und Begründung im Bauprotokoll „Runde 3 · Umsetzung
   Design und Hochglanz“. Jeder Selektor trägt eine Sektions-ID oder main > section:not(.hero) (Harte Grenzen 1 und 2); keine Regel
   auf .hero, header.topbar, Abschnitt K, :root. Kein Text, kein Preis-Markup geändert. */
/* a) Erklärkarten (B01, teilweise): ab 861 px stehen die Schritte in #ablauf und #workflow und die fünf Abdeckungskarten in #regimes
      als offene Spalten unter einer Haarlinie (Fortsetzung der Twin-Schritte, Klarheit B2 R2); Fläche behalten nur die Tafel
      .v5-route, die Mandatsgrenze .step-final und die Link-Karte „Das ganze Bild“. Bis 860 px bleiben die Wischleisten und
      Stapel Karten (ohne Kartenkante fehlt das Fortsetzungssignal). Ablauf-Pill (li::before) unverändert. */
@media(min-width:861px){
  #ablauf .lp-steps>li,#workflow .steps-5>.step:not(.step-final),#regimes .coverage-card:not(.link-card){
    background:none;border:0;border-top:1px solid var(--hairline);border-radius:0;box-shadow:none;
    -webkit-backdrop-filter:none;backdrop-filter:none;padding-left:0}
  /* Folge der breiteren Textspalte: rep_st3_from DE brach ab 1200 px nach „KI-“ (Zeile endet auf Bindestrich); ausgeglichener
     Umbruch hält „KI-VO:“ zusammen, Zeilenzahl und Kartenhöhe gemessen gleich (861–1920 px, DE/EN) */
  #ablauf .v5-step-io dd{text-wrap:balance}
}
@media(min-width:861px) and (hover:hover){
  #regimes .coverage-card:not(.link-card):hover{border-color:transparent;border-top-color:var(--hairline);box-shadow:none}
}
/* b) #raas Einstieg (B04): Normzeile, Persona-Einstiege und Sprungleiste stehen im Markup in .v5-intro-meta hinter dem Datenblatt.
      Ab 1021 px Raster wie bisher (Metagruppe links unter dem Text, Datenblatt rechts über beide Zeilen; auto 1fr verhindert eine
      Lücke, wenn das Datenblatt höher ist als Text und Metagruppe). Bis 1020 px Fluss Knöpfe → Datenblatt → Normzeile → Türen →
      Sprungleiste in DOM-, Vorlese- und Tab-Reihenfolge; ersetzt 13.22 e. #raas selbst bleibt ohne position (13.1). */
#raas .v5-intro-meta{display:flow-root;min-width:0}
@media(min-width:1021px){
  #raas .v5-intro{grid-template-rows:auto 1fr;row-gap:0}
  #raas .v5-intro>.txt{grid-column:1;grid-row:1}
  #raas .v5-intro>.lp-glance{grid-column:2;grid-row:1 / span 2}
  #raas .v5-intro-meta{grid-column:1;grid-row:2}
  #raas .v5-roles-wrap{margin-top:40px}
}
@media(max-width:1020px){
  #raas .v5-intro{display:flex;flex-direction:column;gap:20px}
  #raas .v5-intro>.txt{display:block}
  #raas .v5-intro>.lp-glance{margin:0}
  #raas .v5-intro-meta{width:100%}
  #raas .v5-roles-wrap{margin-top:32px}
}
/* c) #workflow (B06, teilweise): Schritt-Absätze 14 → 15 px in den schmalen Spalten (Lesegewinn; 1440/960 gleiche Zeilenzahl);
      wf_s5_p nur in der Größe. Erst ab 641 px: in der mobilen Wischleiste (86-%-Karten, nicht schmal) bräche wf_s5_p länger um
      und die Leiste würde höher (gemessen 390 EN +45, 360 DE +22 px). Die Regime-Detailzeile in #regimes bleibt 13 px (13.19 l). */
@media(min-width:641px){#workflow .steps-5>.step>p{font-size:.9375rem;line-height:1.5}}
/* d) #rollen (B07): Normetikett als ruhige Mono-Metazeile bündig mit dem Kartentitel statt Schaltflächen-Rahmen (Gestalt wie
      .v5-role-lang); --mut auf Ink 7,8 : 1. */
#rollen .v5-role-tag{border-color:transparent;border-radius:0;padding-inline:0;letter-spacing:.08em;color:var(--mut)}
/* e) #pricing Konditionen (B08): fest gesetztes Verhältnis 1 : 1,4 : 1 : 1 statt vier gleicher Spalten (13.21 f), die Rabattspalte
      ist die längste; Innenabstände 14 px aus 13.21 f bleiben. */
@media(min-width:1021px){#pricing .v5-terms ul{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr)}}
/*    Folge in #pricing (Codex vertretung B08, Markup): Raster und Konditionen vor der Preiskarte, Karte als Abschluss direkt über dem
      Anfrageknopf. H2 → Raster wie bisher H2 → Karte (32 px), Konditionen → Karte 32–40 px; Höhe 1440 ±0, 390 +4 px. */
#pricing h2+.v5-fees-wrap{margin-top:32px}
#pricing .v5-terms+#rep-pricing{margin-top:clamp(32px,2.8vw,40px)}
#rep-pricing{scroll-margin-top:76px}                              /* Deep-Link wie #preisliste (13.8): landete bisher ohne Rand unter der Kopfleiste */
@media(max-width:640px){#rep-pricing{scroll-margin-top:100px}}
/* f) #twin (B09, teilweise): Erklärsatz twin_engine ohne zweite Einfassung (Glas, Kantenlicht, Innenabstand); die violette Kante
      (12.3) steht bündig am Spaltenanfang. Ab 1021 px eine Stufe kleiner, damit der Satz nicht das stärkste Objekt ist.
      Mobiler Abstand zur Frage (margin-top) bleibt. */
#twin .v5-twin-split--typo .v5-twin-quote{background:none;border-color:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;padding:0}
#twin .v5-twin-split--typo .v5-twin-quote::before{display:none}
@media(min-width:1021px){#twin .v5-twin-split--typo .twin-engine{font-size:clamp(1.4rem,1.75vw,1.6rem);line-height:1.35}}
/* g) #funnel (B10, teilweise): CHECK → DRAFT → FINAL als Leiter offener Zeilen unter Haarlinien mit Schlusslinie; FINAL mit
      sichtbarer 2-px-Violettkante. Texte und fn_p unverändert; Druck: break-inside:avoid an .v5-fn-ladder (13.19) bleibt. */
#funnel .v5-fn-ladder{gap:0;border-bottom:1px solid var(--hairline)}
#funnel .v5-fn-ladder>.step{background:none;border:0;border-top:1px solid var(--hairline);border-radius:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
#funnel .v5-fn-ladder>.step-final{border-left:2px solid var(--violet);padding-left:16px}   /* 18 − 2 px: Nummern und Titel aller drei Zeilen auf einer Kante */
@media(max-width:1020px){#funnel .v5-fn-split{row-gap:28px}}
/* h) Große Faltblöcke (B15, teilweise): Plus-Kreis 34 → 36 px mit Creme-Ring .48 (≈ 4 : 1 auf Ink, WCAG 1.4.11) und leiser Füllung;
      trifft #crossreg, #cockpits, #radar, #plans und #allpages. Kleine Faltblöcke (.v5-fold--sm, 26 px) unverändert; Drehung
      und reduce-Regel aus 5/12.7 bleiben. */
main > section:not(.hero) .v5-fold:not(.v5-fold--sm)>summary .v5-fold-plus{width:36px;height:36px;border-color:rgba(242,240,234,.48);background:rgba(242,240,234,.04)}
/* i) #twin mobil (B16): Knopfbeschriftung mittig wie bei allen vollbreiten Knöpfen; Höhe unverändert, Hero-Knöpfe unberührt. */
@media(max-width:640px){#twin .v5-twin-cta .btn{display:flex;align-items:center;justify-content:center;text-align:center}}

/* ===== 14 · Aufräumen (Plan § 5.4; R2 AP10, 22.10.2026) =====
   Gelöscht in 0–13.19 (nicht hier überschrieben): (a) Regeln und Selektoren ohne einen einzigen Treffer im Markup (geprüft in allen
   Zuständen: DE/EN, 1440/960/390, Faltblöcke zu und offen, jede Scrollposition, Wizard je Regime, Druckvorbereitung) und
   (b) die im Bauprotokoll (AP2–AP6, D1, D2, Fixer R2) genannten überschriebenen Deklarationen. Liste mit Grund je Regel und
   Nachweis (Computed-Style-Diff ganze Seite = 0, Screenshots Desktop/Mobil) im Bauprotokoll „AP10“. Bewusst stehen geblieben:
   .light-band .legal-boundary (Rückfall Papier-Band #leistung, Plan § 3.3), die Rückbau-Anker der Fixer-Runden (z. B. 12.1
   #contact::before für 13.19 e) und die Schichtung 13.16–13.22 (überschriebene Werte dort sind dokumentierte Abweichungen). */

/* ===== 15 · Nachtrag · Kapitelleiste (22.10.2026, Auftrag Theo; Messung und Begründung im Bauprotokoll „Nachtrag · Kapitelleiste“) =====
   nav.v5-cl steht zwischen header.topbar und main, position:fixed ohne Layout-Höhe (Seitenhöhe und Höhenbudget § 2.2 unverändert,
   kein CLS: Lage nur per transform). z-index 99 unter dem Kopf (100; dessen Dropdown liegt darüber). Lage: translateY um die gemessene
   Kopfhöhe (--v5-cl-kopf setzt das Skript am nav), mit .nav-hidden des Kopfes (.v5-cl--hoch) im selben Takt (.25s ease) nach oben.
   An nur mit .v5-cl--an (kein Hero im Bild, Lesezeile in Teil I–III) oder solange der Fokus darin liegt; aus heißt opacity 0,
   visibility hidden, keine Klicks, kein Tab-Halt. Ink-Glas wie der Kopf (.85, AA auch über Papier-Band und Bildbändern), Haarlinie
   als Spur der Fortschrittslinie, Teil in Mono (wie .v5-part), Kapitel in Sans, Neon nur als 5-px-Punkt vor dem aktiven Kapitel (M04).
   Ohne JS hidden (Attribut im Markup), im Druck aus, bei reduce ohne Übergänge. Jeder Selektor trägt .v5-cl (Harte Grenzen 1 und 2).
   Feinschliff (Bauprotokoll „Nachtrag · Feinschliff“, Kritik Nachtrag): Nummern aus data-n wie die Sprungleisten (::before, Mono,
   gedämpft; der Aktiv-Punkt deshalb in ::after); sichtbar trotz „aus“ nur bei Tastaturfokus (:has(:focus-visible), ohne :has()
   :focus-within); die klebende FAQ-Spalte richtet sich nach Kopf und Leiste (top, im Raster, CLS 0); linker Auslauf der Wischzeile
   nur über dem Innenabstand (das Skript richtet den linken Rand auf eine Eintragsgrenze aus); kurze Fenster: Lage fest oben (das
   Skript zeigt die Leiste dort nur bei ausgeblendetem Kopf); Kontrastmodus: Aktiv-Punkt in CanvasText; Touch ab 861 px 44 px.
   Passt die Zeile eines Teils nicht (gemessen im Skript), erst die kurze Teil-Marke (.v5-cl-teil--kurz), dann ab 861 px dieselbe
   Wischzeile wie mobil (.v5-cl-w: Auslauf rechts 36 px, links 16 px, bis an den Rand der .wrap). */
.v5-cl{--v5-cl-kopf:0px;position:fixed;top:0;left:0;right:0;z-index:99;height:48px;margin:0;
  background:rgba(27,22,17,.85);border-bottom:1px solid rgba(242,240,234,.10);color:var(--cream);
  transform:translateY(var(--v5-cl-kopf));opacity:0;visibility:hidden;pointer-events:none;
  transition:transform .25s ease,opacity .2s ease,visibility 0s linear .2s}
@supports ((-webkit-backdrop-filter:blur(14px)) or (backdrop-filter:blur(14px))){
  .v5-cl{-webkit-backdrop-filter:blur(14px) saturate(1.15);backdrop-filter:blur(14px) saturate(1.15)}
}
.v5-cl[hidden]{display:none}
.v5-cl.v5-cl--hoch{transform:translateY(0)}
.v5-cl.v5-cl--an{opacity:1;visibility:visible;pointer-events:auto;transition:transform .25s ease,opacity .2s ease,visibility 0s}
.v5-cl:has(:focus-visible){opacity:1;visibility:visible;pointer-events:auto;transition:transform .25s ease,opacity .2s ease,visibility 0s}
@supports not selector(:has(*)){
  .v5-cl:focus-within{opacity:1;visibility:visible;pointer-events:auto;transition:transform .25s ease,opacity .2s ease,visibility 0s}
}
.v5-cl .v5-cl-in{height:100%}
.v5-cl .v5-cl-teil{display:none;align-items:center;gap:14px;height:100%}
.v5-cl[data-p="1"] .v5-cl-teil[data-cl-p="1"],.v5-cl[data-p="2"] .v5-cl-teil[data-cl-p="2"],.v5-cl[data-p="3"] .v5-cl-teil[data-cl-p="3"]{display:flex}
.v5-cl .v5-cl-part{flex:0 0 auto;margin:0;padding-right:16px;border-right:1px solid rgba(242,240,234,.16);
  font:500 .68rem/1.25 var(--font-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--muted-dark);white-space:nowrap}
.v5-cl .v5-cl-kurz{display:none}
.v5-cl .v5-cl-list{display:flex;align-items:center;gap:2px;flex:1 1 auto;min-width:0;height:100%;margin:0;padding:0;list-style:none;
  overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:none;scroll-padding-inline:16px}
.v5-cl .v5-cl-list::-webkit-scrollbar{display:none}
.v5-cl .v5-cl-list>li{flex:0 0 auto;margin:0;padding:0}
.v5-cl .v5-cl-list a{position:relative;display:flex;align-items:center;height:36px;padding:0 10px 0 19px;border-radius:8px;
  font:500 .84rem/1 var(--font-sans);letter-spacing:.005em;color:rgba(242,240,234,.68);text-decoration:none;white-space:nowrap;
  transition:color .2s ease}
.v5-cl .v5-cl-list a::after{content:"";position:absolute;left:8px;top:50%;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;
  background:var(--neon);opacity:0;transform:scale(.4);transition:opacity .2s ease,transform .2s ease}
.v5-cl .v5-cl-list a[data-n]::before{content:attr(data-n);flex:0 0 auto;margin-right:7px;font:500 .68rem/1 var(--font-mono);
  letter-spacing:.06em;font-variant-numeric:tabular-nums;color:var(--muted-dark)}          /* wie .v5-jump a::before (13.1, 13.12) */
.v5-cl .v5-cl-list a:hover,.v5-cl .v5-cl-list a[aria-current="location"]{color:var(--cream)}
.v5-cl .v5-cl-list a[aria-current="location"]::after{opacity:1;transform:none}
.v5-cl .v5-cl-list a:focus-visible{outline-offset:-3px}      /* Ring nach innen: die Wischzeile schneidet nichts ab */
.v5-cl .v5-cl-prog{position:absolute;left:0;right:0;bottom:-1px;height:1px;transform:scaleX(0);transform-origin:0 50%;pointer-events:none;
  background:linear-gradient(90deg,rgba(145,139,183,.45),rgba(242,240,234,.62))}
@media(min-width:1021px){             /* FAQ-Spalte (13.10 top:112px): unter Kopf + Leiste bzw. unter der Leiste, je 24 px Luft */
  .v5-cl.v5-cl--an~main .v5-faq-aside{top:calc(var(--v5-cl-kopf,65px) + 72px);transition:top .25s ease}
  .v5-cl.v5-cl--an.v5-cl--hoch~main .v5-faq-aside{top:72px}
}
@media(min-width:861px) and (pointer:coarse){.v5-cl .v5-cl-list a{height:44px}}   /* Tablet quer: Tap-Ziele 44 px wie darunter */
@keyframes v5-cl-ein{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:no-preference){.v5-cl .v5-cl-teil{animation:v5-cl-ein .3s ease both}}
@media(max-width:1179px){.v5-cl .v5-cl-lang{display:none}.v5-cl .v5-cl-kurz{display:inline}}
.v5-cl .v5-cl-teil--kurz .v5-cl-lang{display:none}
.v5-cl .v5-cl-teil--kurz .v5-cl-kurz{display:inline}
/* Codex-Zweitmeinung R4 (D7): Im Teil Vision/Herkunft nennt die lange Teil-Marke genau die Kapitel der Links daneben; dort deshalb
   immer die kurze Marke. clPasst() misst die lange Marke dann nicht (offsetWidth 0).
   R6 · Teile getauscht (23.10.2026): Vision/Herkunft ist jetzt Teil II („Teil II · Vision und Herkunft“), daher data-cl-p="2"
   (bis R6 "3"); der Twin (jetzt Teil III) hat wieder die normale Umschaltung lang ab 1180 px / kurz. */
.v5-cl .v5-cl-teil[data-cl-p="2"] .v5-cl-lang{display:none}
.v5-cl .v5-cl-teil[data-cl-p="2"] .v5-cl-kurz{display:inline}
@media(min-width:861px){               /* Wischzeile ab 861 px nur, wenn die Zeile auch mit kurzer Teil-Marke nicht passt (Skript) */
  .v5-cl .v5-cl-list.v5-cl-w{margin-right:-24px;padding-right:40px;scroll-padding-inline:16px 36px;
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent)}
  .v5-cl .v5-cl-list.v5-cl-w.v5-cl-l{-webkit-mask-image:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 36px),transparent);
    mask-image:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 36px),transparent)}
}
@media(max-width:860px){             /* Touch-Breiten: Wischzeile bis an den Rand, Auslauf rechts, Tap-Ziele 44 px */
  .v5-cl .v5-cl-teil{gap:4px}
  .v5-cl .v5-cl-part{padding-right:10px}
  .v5-cl .v5-cl-list{margin-right:-24px;padding-right:40px;scroll-padding-inline:16px 36px;
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent)}
  .v5-cl .v5-cl-list.v5-cl-l{-webkit-mask-image:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 36px),transparent);
    mask-image:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 36px),transparent)}   /* links weiter (Skript: scrollLeft > 2); 16 px = Innenabstand bis zum Punkt */
  .v5-cl .v5-cl-list a{height:44px;padding:0 9px 0 17px}
  .v5-cl .v5-cl-list a::after{left:7px}
}
@media(max-width:480px){.v5-cl .v5-cl-list{margin-right:calc(-1 * max(16px,env(safe-area-inset-right)));padding-right:max(40px,env(safe-area-inset-right))}}
@media(max-height:500px){.v5-cl,.v5-cl.v5-cl--hoch{transform:none}}   /* Skript: dort nur bei ausgeblendetem Kopf an; der Kopf schiebt sich darüber */
@media(forced-colors:active){.v5-cl .v5-cl-list a[aria-current="location"]::after{forced-color-adjust:none;background:CanvasText}}
@media(prefers-reduced-motion:reduce){.v5-cl,.v5-cl .v5-cl-list a,.v5-cl .v5-cl-list a::after,.v5-cl~main .v5-faq-aside{transition:none}.v5-cl .v5-cl-teil{animation:none}}
@media print{.v5-cl{display:none!important}}

/* ===== 16 · Runde 4 · Hero „Vertretung zuerst“ (22.10.2026, Theo-Auftrag 1; konzept/r4/hero_spec.md § 2.1, Bauprotokoll „Runde 4 · hero“) =====
   Hero-Knopfzeile mobil (Variante B): Primärknopf „EU-Vertretung anfragen“ voll, Zweitknopf „Twin bauen“ und Ton-Link teilen die zweite Zeile.
   Bewusste, auf #top begrenzte Ausnahme von Harter Grenze 1 (R2); gilt ab Runde 4 und löst die AP0-Hero-Baseline ab.
   #top-Präfix Pflicht: .hero-ctas steht auch in #raas, #pricing, #funnel und #contact. Spezifität (1,2,0) schlägt .hero-ctas .btn (0,2,0). */
@media (max-width:480px) and (orientation:portrait){
  #top .hero-ctas .btn-ghost{width:auto;flex:1 1 auto}
  #top .hero-ctas .link-arrow{flex:0 1 auto}
}
/* Kleine Telefone bis 400 px (Korrektur Kritik R4: Design A2, Technik A2; hero_spec § 3 Variante C, Theo-Entscheid e als Empfehlung):
   Kickerzeile mit 0,1 em statt 0,2 em Sperrung und H1 32 px statt 36 px, damit der Hauptknopf bei 360 × 740 im ersten Bildschirm steht.
   Nur #top; Text, Video, Poster, Sub, Teaser, Trustline und Ton bleiben. */
@media (max-width:400px){
  #top .kicker{letter-spacing:.1em}
  #top h1{font-size:32px}
}
/* Codex-Zweitmeinung R4 (D1, konzept/r4/codex/ENTSCHEID_r4.md): ab 1180 px Kickerzeile mit 0,12 em statt 0,2 em Sperrung, damit sie
   einzeilig steht (vorher brach „Act & GDPR“ bzw. „& DSGVO“ als kurzer Rest in Zeile 2 um; gemessen 1180–1920 EN/DE einzeilig,
   Reserve 76 bzw. 84 px bei 1180). Unter 1180 bleibt die Sperrung, die Zeile passt dort auch mit 0,12 em nicht. Nur #top. */
@media (min-width:1180px){#top .kicker{letter-spacing:.12em}}
/* R4-Nachtrag (23.10.2026, Theo): bis 640 px nur das erste Kicker-Segment (Vertretung); Teilung per Skript im v5-Block, ohne JS voller Text. */
@media (max-width:640px){#top .v5-kseg-rest{display:none}}

/* ===== 17 · Runde 4 · Icons (22.10.2026, Theo-Auftrag 2; konzept/r4/icons.md § 2, § 3, Bauprotokoll „Runde 4 · icons“) =====
   Website ohne Modul- und Regime-Icons; im Produkt /suite/ bleiben sie. #suite: Titel und Pfeil teilen die Kopfzeile, der Pfeil steht
   auf der Grundlinie der ersten Titelzeile (baseline statt center, sonst rutscht er bei zweizeiligem Titel in die Mitte). Kopfzeile und
   Pfeil bleiben ohne position, damit die Karte Bezugsrahmen von a.suite-arrow::after bleibt (13.22 b). #regimes: die 6 px oben
   (site.css .coverage-card h3) waren nur der Abstand zum Icon; das Normkürzel ist die Marke. site.css bleibt unberührt. */
#suite .suite-card-top{align-items:baseline;gap:8px}
#suite .suite-card-top>h3{flex:1 1 auto;min-width:0}
#regimes .coverage-card:not(.link-card) h3{margin-top:0}

/* ===== 18 · Runde 4 · Vision #vision (22.10.2026, Theo-Auftrag 3; konzept/r4/vision_design.md, Text vision_text.md Fassung B;
   Bauprotokoll „Runde 4 · vision“). Ink-Band (kein zweiter Papier-Moment); jede Regel traegt #vision (Harte Grenzen 1/2).
   Portraet RECHTS, Buerobild LAGARDE1 LINKS; Theos Blick nach links fuehrt in Ueberschrift und Text.
   Raster 12 Spalten (Desktop): Kopf 1–9 | drei Spalten (eigenes Raster in 1–9) unter der Blickachse | Portraet 10–12, so tief
   gesetzt, dass seine Augenhoehe (30 % der Bildhoehe = 0,375 × Bildbreite) auf der Blickachse liegt | Buerobild 1–6 unten links
   (2:1, hoechstens 600 px breit, Quelle 800 px, keine Hochskalierung der Datei). Diagonale Portraet oben rechts ↔ Buero unten links.
   Ohne display:contents (figure und ul behalten ihre Semantik); mobil ist die figure selbst ein kleines Raster. ===== */
#vision{--vi-face:clamp(220px,18.4vw,265px);padding:clamp(64px,6.6vw,96px) 0 clamp(56px,5vw,72px)}
#vision .v5-vi-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:start}
/* Blickachse: Pseudo-Element des Rasters = eigenes Rasterelement in Zeile 2, volle Breite, hinter dem Portraet; zum Portraet hin heller */
#vision .v5-vi-grid::before{content:"";grid-column:1 / -1;grid-row:2;align-self:start;height:1px;z-index:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(242,240,234,.10),var(--v5-rule) 70%);transform-origin:right center}
#vision .v5-vi-head{grid-column:1 / 10;grid-row:1;min-width:0;padding-bottom:clamp(28px,2.8vw,40px)}
#vision .v5-vi-head .kicker{margin-bottom:0}
#vision .v5-vi-h{margin:14px 0 0;font-size:clamp(30px,3.4vw,44px);line-height:1.08}
#vision .v5-vi-lede{margin:16px 0 0;max-width:56ch;font-size:clamp(1.02rem,1.3vw,1.15rem);line-height:1.55;color:var(--tx-body);text-wrap:pretty}
#vision .v5-vi-face{grid-column:10 / 13;grid-row:2 / 4;justify-self:end;width:var(--vi-face);margin:calc(var(--vi-face) * -.375) 0 0;position:relative;z-index:1}
#vision .v5-vi-frame{display:block;aspect-ratio:4 / 5;border-radius:var(--v5-r-md);overflow:hidden;
  box-shadow:0 0 0 1px rgba(242,240,234,.08),0 30px 60px -34px rgba(0,0,0,.85)}
#vision .v5-vi-frame>img{display:block;width:100%;height:100%;object-fit:cover}
#vision .v5-vi-face figcaption{display:flex;flex-direction:column;gap:4px;margin-top:14px}
#vision .v5-vi-name{font-family:var(--font-serif);font-weight:450;font-size:1.06rem;line-height:1.3;color:var(--tx)}
#vision .v5-vi-role{font:500 .66rem/1.5 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
#vision .v5-vi-lines{grid-column:1 / 10;grid-row:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;margin:0;padding:0;list-style:none}
#vision .v5-vi-lines>li{margin:0;padding:20px 0 0;min-width:0}
#vision .v5-vi-k{margin:0;font:500 .7rem/1.3 var(--font-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--mut)}
#vision .v5-vi-lines p{margin:10px 0 0;font-size:.95rem;line-height:1.6;color:var(--tx-body);text-wrap:pretty}
#vision .v5-vi-place{grid-column:1 / 7;grid-row:3;margin:clamp(36px,3.4vw,48px) 0 0;max-width:600px}
#vision .v5-vi-place>img{display:block;width:100%;height:auto;aspect-ratio:2 / 1;object-fit:cover;border-radius:var(--v5-r-md)}
#vision .v5-vi-place figcaption{margin-top:12px;font-size:.84rem;line-height:1.5;color:var(--mut);max-width:62ch}
/* Theo, 05.11.2026: Buerobild LAGARDE1 nur in EN und ZH (www und CN); in der deutschen Fassung ausgeblendet.
   Eigene Rasterzeile (Desktop Zeile 3, mobil Zeile 4): ohne das Bild entsteht keine Luecke, das Portraet rechts bleibt. */
html:lang(de) #vision .v5-vi-place{display:none}
#vision .v5-vi-cap-k{margin-right:8px;font:500 .66rem/1.5 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--tx)}
/* Bewegung nur mit JS und ohne Bewegungsreduktion: die Achse zieht von rechts (Portraet) nach links, das Buerobild oeffnet sich in
   Blickrichtung (von rechts nach links). Ohne :has() oder ohne JS bleibt die Achse einfach stehen und das Bild offen. */
@media (prefers-reduced-motion:no-preference){
  #vision .v5-vi-grid::before{transition:transform 1.1s var(--v5-ease) .2s}
  html.js #vision .v5-vi-grid:has(.v5-vi-face.reveal:not(.in))::before{transform:scaleX(0)}
  html.js #vision .v5-vi-place>img{transition:clip-path 1.1s var(--v5-ease)}
  html.js #vision .v5-vi-place.reveal:not(.in)>img{clip-path:inset(0 0 0 100% round 12px)}
}
/* Tablet 641–1020: Kopf und Spalten links (1–8; drei Spalten als 2 + 1), Portraet 9–12; Kopf endet vor dem Portraet,
   damit dessen negativer Versatz nie in die Lede ragt */
@media (max-width:1020px){
  #vision{--vi-face:clamp(180px,26vw,240px)}
  #vision .v5-vi-head{grid-column:1 / 9}
  #vision .v5-vi-lines{grid-column:1 / 9;grid-template-columns:repeat(2,minmax(0,1fr));row-gap:28px}
  #vision .v5-vi-lines>li:nth-child(3){grid-column:1 / -1;padding-top:0}
  #vision .v5-vi-face{grid-column:9 / 13}
  #vision .v5-vi-place{grid-column:1 / 9;margin-top:36px}
}
/* Mobil ≤ 640: Kopf · Blickzeile (Portraet rechts, Name und Rolle links auf der Achse: der Blick faellt auf den Namen) ·
   drei Spalten untereinander · Buerobild volle Breite mit Bildzeile */
@media (max-width:640px){
  #vision{--vi-face:42vw}
  #vision .v5-vi-grid{grid-template-columns:minmax(0,1fr)}
  #vision .v5-vi-grid::before{grid-column:1;margin-top:calc(var(--vi-face) * .375)}
  #vision .v5-vi-head{grid-column:1;padding-bottom:28px}
  #vision .v5-vi-face{grid-column:1;grid-row:2;justify-self:stretch;width:auto;margin:0;display:grid;
    grid-template-columns:minmax(0,1fr) var(--vi-face);column-gap:16px;align-items:start}
  #vision .v5-vi-frame{grid-column:2;grid-row:1}
  #vision .v5-vi-face figcaption{grid-column:1;grid-row:1;margin:calc(var(--vi-face) * .375 + 14px) 0 0}
  #vision .v5-vi-lines{grid-column:1;grid-row:3;grid-template-columns:minmax(0,1fr);row-gap:22px;margin-top:28px}
  #vision .v5-vi-lines>li{padding-top:0}
  #vision .v5-vi-place{grid-column:1;grid-row:4;margin-top:30px;max-width:none}
  #vision .v5-vi-cap-k{display:block;margin:0 0 8px}     /* Codex R4 D5: Ortsmarke eigene Zeile wie ab 641 px */
}
/* Bildzeile neben dem Buerobild (Korrektur Kritik R4: Design A3, Klarheit A6). Desktop ≥ 1021: die figure spannt die Spalten 1–9 als
   eigenes 9er-Raster (Spaltenmass wie aussen), Bild 1–6 wie bisher (hoechstens 554 px bei 1440), Bildzeile 7–9 an der Bildunterkante,
   die Ortsmarke als eigene Zeile darueber. Tablet 641–1020: Bild 1–8, Bildzeile 9–12 unter dem Portraet; das Portraet bleibt dort in
   Zeile 2, damit es die Bildzeile nie ueberdeckt. Kein Bild groesser als vorher, keine neuen Inhalte; mobil unveraendert. */
@media (min-width:1021px){
  #vision .v5-vi-place{grid-column:1 / 10;max-width:none;display:grid;grid-template-columns:repeat(9,minmax(0,1fr));column-gap:24px;align-items:end}
  #vision .v5-vi-place>img{grid-column:1 / 7;max-width:600px}
  #vision .v5-vi-place figcaption{grid-column:7 / 10;margin:0;max-width:28ch}
  #vision .v5-vi-cap-k{display:block;margin:0 0 8px}
}
@media (min-width:641px) and (max-width:1020px){
  #vision .v5-vi-face{grid-row:2}
  #vision .v5-vi-place{grid-column:1 / -1;max-width:none;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:end}
  #vision .v5-vi-place>img{grid-column:1 / 9;max-width:600px}
  #vision .v5-vi-place figcaption{grid-column:9 / 13;margin:0;max-width:28ch}
  #vision .v5-vi-cap-k{display:block;margin:0 0 8px}
}
/* Druck: Endzustand ohne Uebergang (eine Transition schlaegt !important; ohne transition:none liefe sie beim Medienwechsel an) */
@media print{#vision .v5-vi-grid::before{transform:none!important;transition:none!important}#vision .v5-vi-place>img{clip-path:none!important;transition:none!important}}

/* ===== 19 · Runde 8 · P2 (24.10.2026, Theo-Freigabe „alles wie empfohlen“; konzept/r8/KONZEPT_R8_MEDIEN.md Abschnitte 3, 4, 6).
   Jeder Selektor trägt #international, #twin, #funnel, .v5-cl oder eine v5-Klasse (Harte Grenzen 1 und 2); nichts erreicht .hero,
   #top oder header.topbar. Messung und Begründung im Bericht R8-P2 (Höhen vorher/nachher, Aufnahmen 1920/1440/1020/641/390). ===== */
/* a) Teil IV · International #international (Abschnitt 6, Entscheidung 7). Ink-Band zwischen #funnel und #contact (der einzige
      Papier-Moment bleibt #kanzlei); die Haarlinie oben kommt aus 12.1. Kopf wie die Bildband-Captions von Teil II/III: Teil-Marke
      (Mono, Creme) über dem Kapitel-Kicker 16, hier als Teilöffner mit auslaufender Linie, weil kein Bildband den Teil eröffnet.
      Drei gleich gebaute Glas-Karten in einer Reihe (Höhenregel 2), Karte 2 (Vertretung) mit Kantenlicht 12.2; Links am Kartenfuß
      bündig (Flex-Spalte, margin-top:auto). 641–1020: zwei Spalten, Karte 3 volle Breite; ≤ 640: untereinander. */
#international .v5-intl-head{max-width:880px}
#international .v5-intl-part{display:flex;align-items:center;gap:18px;margin:0 0 30px;color:var(--cream)}
#international .v5-intl-part::after{content:"";flex:1 1 auto;max-width:280px;height:1px;background:linear-gradient(90deg,var(--v5-rule),transparent)}
#international .v5-intl-h{margin:0}
#international .v5-intl-sub{margin:18px 0 0;max-width:62ch}
#international .v5-intl-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:clamp(32px,3.4vw,48px) 0 0;padding:0;list-style:none}
#international .v5-intl-card{display:flex;flex-direction:column;min-width:0;margin:0;padding:clamp(22px,2.2vw,30px)}
#international .v5-intl-t{margin:0;font-family:var(--font-serif);font-weight:450;font-variation-settings:"opsz" 72;font-size:1.32rem;
  line-height:1.25;letter-spacing:-.005em;color:var(--tx);text-wrap:balance}
#international .v5-intl-card p{margin:12px 0 0;font-size:.95rem;line-height:1.6;color:var(--tx-body)}
#international .v5-intl-card>p:not(:last-child){margin-bottom:18px}
#international .v5-intl-go{display:inline-flex;align-items:center;align-self:flex-start;min-height:44px;margin-top:auto;line-height:1.3}   /* Tap-Ziel 44 px wie 13.18 */
@supports (grid-template-rows:subgrid){   /* ab 1021: Titel, Text und Link der drei Karten je auf einer Linie (wie das Rollen-Register 13.2) */
  @media(min-width:1021px){
    #international .v5-intl-card{display:grid;grid-row:span 3;grid-template-rows:subgrid;row-gap:0}
    #international .v5-intl-t{align-self:end}          /* einzeilige Titel sitzen über dem Text, ein zweizeiliger wächst nach oben */
    #international .v5-intl-card>p{align-self:start}
    #international .v5-intl-go{align-self:end;justify-self:start}
  }
}
@media(max-width:1020px){
  #international .v5-intl-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  #international .v5-intl-card:nth-child(3){grid-column:1 / -1}
}
@media(max-width:640px){
  #international .v5-intl-part{margin-bottom:22px}
  #international .v5-intl-cards{grid-template-columns:minmax(0,1fr);gap:16px;margin-top:28px}
  #international .v5-intl-card:nth-child(3){grid-column:auto}
  #international .v5-intl-t{font-size:1.24rem}
}
@media print{#international .v5-intl-card{break-inside:avoid}}

/* b) Video-Plätze #twin und #funnel (Abschnitt 3 und 4): im Markup vorbereitet, bis zur Neuaufnahme hidden (kein leerer Rahmen, keine
      Netzlast: weder src noch Poster). R8-P7: Loops eingesetzt, hidden entfernt, Klassen am Split gesetzt; die Leiter im #funnel steht
      als Zeile darunter. Das Standbild img.poster steckt in picture.v5-pic (Art Direction: 640er Zuschnitt per source media, wie die
      Video-Quellen); picture ohne eigene Box (display:contents), die Regeln greifen am img. Rahmen wie 13.20 i (Ink-Steg 10 px, Rand rgba(255,255,255,.12), Radius 18), hier um #twin und
      #funnel erweitert. Das Layout mit Video schaltet erst die Klasse am Split um (v5-twin-split--vid, v5-fn-split--vid; setzt P7 zusammen
      mit dem Entfernen von hidden), damit es nicht an :has() hängt. */
main .v5-vid[hidden]{display:none}
.loop-frame picture.v5-pic{display:contents}
#twin .v5-vid,#funnel .v5-vid{margin:0;min-width:0}
#twin .v5-vid .shot-frame--ink,#funnel .v5-vid .shot-frame--ink{background:var(--bg);border:1px solid rgba(255,255,255,.12);
  border-radius:18px;padding:10px;box-shadow:0 2px 3px rgba(26,24,23,.08),0 24px 60px -18px rgba(0,0,0,.5)}
#twin .v5-vid-frame,#funnel .v5-vid-frame{aspect-ratio:16 / 9;overflow:hidden;border-radius:12px;background:var(--bg)}
#twin .v5-vid-frame>video,#funnel .v5-vid-frame>video,#twin .v5-vid-frame>picture>img,#funnel .v5-vid-frame>picture>img{width:100%;height:100%;object-fit:cover;border-radius:12px}
#twin .v5-vid-cap,#funnel .v5-vid-cap{line-height:1.5;text-transform:none;letter-spacing:.02em;font-size:.78rem;color:var(--tx-body)}   /* Kontrast ≥ 4,5:1 auf Ink */
@media(min-width:1021px){
  #twin .v5-twin-split--vid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:auto 1fr;grid-template-areas:"txt vid" "quote vid";align-items:start;row-gap:28px}
  #twin .v5-twin-split--vid>.v5-twin-txt{grid-area:txt}
  #twin .v5-twin-split--vid>.v5-twin-quote{grid-area:quote;margin:0}
  #twin .v5-twin-split--vid>.v5-vid{grid-area:vid}
  #twin .v5-twin-split--vid .twin-engine{font-size:clamp(1.12rem,1.35vw,1.26rem)}
  #funnel .v5-fn-split--vid{grid-template-columns:minmax(0,5fr) minmax(0,6fr);grid-template-areas:"txt vid" "lad lad";align-items:start}
  #funnel .v5-fn-split--vid>.txt{grid-area:txt}
  #funnel .v5-fn-split--vid>.v5-vid{grid-area:vid}
  #funnel .v5-fn-split--vid>.v5-fn-ladder{grid-area:lad;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;margin-top:8px}
  #funnel .v5-fn-split--vid>.v5-fn-ladder>.step{display:block}
  #funnel .v5-fn-split--vid>.v5-fn-ladder>.step>.step-no{margin-bottom:10px}
}
@media(max-width:1020px){                /* einspaltig: Frage, Text, Video, Bildtext, Zitat (Abschnitt 3) */
  #twin .v5-twin-split--vid{display:flex;flex-direction:column}
  #twin .v5-twin-split--vid>.v5-vid{order:2;margin-top:24px}
  #twin .v5-twin-split--vid>.v5-twin-quote{order:3}
}
/* b') R8 Erklaervideo #twin (Drehbuch v3.1 § 10, Layout M-a, E5; Datei konzept/r8/video/einbau_twin_video.css): Figur in eigener
      Zeile ueber die volle Split-Breite (Bildflaeche 1110 px ab 1280 px), nie beschnitten (eingebranntes Band und Datumsleiste:
      contain), bis 820 px 4:5-Rahmen fuer die 4:5-Fassung (dieselbe Grenze wie media="(max-width: 820px)" an der Quelle und das
      Poster im r4:perf-Skript), auf dem Handy ohne Steg (E5). display:block, weil das Video kein v5-loop mehr ist (sonst Inline-Zeile
      im Rahmen). Zwischen 821 und 1020 px laeuft der Split einspaltig (Frage, Text, Video, Zitat; Regeln oben). */
#twin .v5-vid--twin .v5-vid-frame>video,#twin .v5-vid--twin .v5-vid-frame>picture>img{object-fit:contain}
#twin .v5-vid--twin .v5-vid-frame>video{display:block}
@media(min-width:1021px){
  #twin .v5-twin-split--vid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:auto auto;grid-template-areas:"txt quote" "vid vid";align-items:start;row-gap:clamp(28px,2.8vw,40px)}
  #twin .v5-twin-split--vid>.v5-twin-quote{grid-area:quote;margin:0}
  #twin .v5-twin-split--vid>.v5-vid{grid-area:vid}
}
@media(max-width:820px){
  #twin .v5-vid--twin .v5-vid-frame{aspect-ratio:4 / 5}
  #twin .v5-vid--twin .shot-frame--ink{padding:0;border-width:0}
}
/* b'') Start-Knopf des Erklaervideos (r4:perf-Skript 4 b; nur mit JS, ohne JS bleibt die native Steuerleiste): Kreis in Ink-Glas
      mittig auf der Karte des Posters. Mitte bei 44 % der Bildhoehe: Datumsleiste oben bis 6,5 % (4:5: 12,5 %), Band ab 82 % (4:5:
      74,5 %), beide bleiben frei. Dreieck in der Akzentfarbe des Knopfs „Build your twin“ (--neon), darunter die Laenge in Creme.
      Rand Creme .48 (≥ 3 : 1, WCAG 1.4.11), Fokus Neon mit Abstand, Groesse 68 px (Handy) bis 96 px. Nach dem Start hat das Video
      den Fokus; der Ring liegt innen, weil der Rahmen overflow:hidden hat. */
#twin .v5-vid--twin .v5-vid-frame{position:relative}
#twin .v5-vid--twin .v5-vid-frame>video:focus-visible{outline-offset:-3px}
.v5-vid-start{position:absolute;left:50%;top:44%;z-index:2;transform:translate(-50%,-50%);display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:3px;width:clamp(68px,7.4vw,96px);height:clamp(68px,7.4vw,96px);margin:0;padding:4px 0 0;
  border-radius:50%;border:1px solid rgba(242,240,234,.48);background:rgba(27,22,17,.74);color:var(--neon);cursor:pointer;
  box-shadow:0 12px 32px -10px rgba(0,0,0,.6);transition:border-color .2s ease,background-color .2s ease}
.v5-vid-start[hidden]{display:none}
.v5-vid-start:hover{border-color:var(--neon);background:rgba(27,22,17,.9)}
.v5-vid-start:focus-visible{outline:3px solid var(--neon);outline-offset:3px;border-radius:50%}
.v5-vid-start-ico{display:block;width:36%;height:auto}
.v5-vid-start-t{font-family:var(--font-mono);font-size:clamp(.68rem,.8vw,.78rem);letter-spacing:.06em;line-height:1;color:var(--cream)}
@supports ((-webkit-backdrop-filter:blur(8px)) or (backdrop-filter:blur(8px))){.v5-vid-start{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}}
@media(forced-colors:active){.v5-vid-start{border-color:ButtonText;color:ButtonText;background:ButtonFace}.v5-vid-start-t{color:ButtonText}}
@media(prefers-reduced-motion:reduce){.v5-vid-start{transition:none}}
@media print{.v5-vid-start{display:none!important}}
/* R8-P7: Cockpit-Loop im Faltblock #cockpits (Abschnitt 4). Eigenes Fenster ohne Zuschnitt (16:9 = Quelle; der Loop ist so
   aufgenommen, dass jeder Frame sauber ist), Rahmen wie 13.20 i (#cockpits .shot-frame--ink), Bildtext wie #twin/#funnel. */
.v5-crop--vlopvid{--x:0;--y:0;--w:1;--h:1;--ar:16/9;--src-ar:16/9}
#cockpits .v5-cp-vid{margin:0;min-width:0}
#cockpits .v5-vid-cap{line-height:1.5;text-transform:none;letter-spacing:.02em;font-size:.78rem;color:var(--tx-body)}   /* Kontrast ≥ 4,5:1 */

/* c) Kapitelleiste Teil IV (Abschnitt 6): Gruppe data-cl-p="4" mit dem einen Eintrag 16. Wie Teil II immer die kurze Teil-Marke
      (Codex R4 D7: die lange nennt dasselbe wie der Eintrag daneben); clPasst() misst die lange dann nicht. */
.v5-cl[data-p="4"] .v5-cl-teil[data-cl-p="4"]{display:flex}
.v5-cl .v5-cl-teil[data-cl-p="4"] .v5-cl-lang{display:none}
.v5-cl .v5-cl-teil[data-cl-p="4"] .v5-cl-kurz{display:inline}

/* d) Loop-Regeln der Startseite (Abschnitt 3 „Technik“, Skript im v5-Inline-Block „Loop-Regeln“). Die Loops tragen v5-loop statt
      inline-loop; Grundregeln wie site.css „Inline loops“ in gleicher Spezifität (0,1,1), damit das Bildfenster 12.6 (0,2,1) gewinnt.
      Pause-Knopf (WCAG 2.2.2): 44-px-Kreis in Ink-Glas unten rechts im Rahmen, Creme-Glyphe, Ring .48 (≥ 3 : 1, WCAG 1.4.11),
      Fokus als Doppelring; nur sichtbar, solange ein Loop spielen darf (Skript; bei reduce, Save-Data und ohne JS bleibt er hidden). */
video.v5-loop{display:block;width:100%;height:auto;border-radius:14px}
.loop-frame.loop-static video.v5-loop{display:none}
@media (prefers-reduced-motion:reduce){.loop-frame video.v5-loop{display:none}.loop-frame img.poster{display:block}}
.v5-loop-host{position:relative}
.v5-loop-btn{position:absolute;right:18px;bottom:18px;z-index:3;display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;margin:0;padding:0;border-radius:50%;border:1px solid rgba(242,240,234,.48);background:rgba(27,22,17,.78);
  color:var(--cream);cursor:pointer;transition:border-color .2s ease,background-color .2s ease}
.v5-loop-btn[hidden]{display:none}
.v5-loop-btn:hover{border-color:var(--cream);background:rgba(27,22,17,.92)}
.v5-loop-btn:focus-visible{outline:2px solid var(--cream);outline-offset:2px;box-shadow:0 0 0 4px var(--ink)}
.v5-loop-btn .v5-loop-ico{display:block;width:18px;height:18px}
.v5-loop-btn .v5-loop-ico--play,.v5-loop-btn.v5-loop-btn--play .v5-loop-ico--pause{display:none}
.v5-loop-btn.v5-loop-btn--play .v5-loop-ico--play{display:block}
@supports ((-webkit-backdrop-filter:blur(8px)) or (backdrop-filter:blur(8px))){.v5-loop-btn{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}}
@media(max-width:640px){.v5-loop-btn{right:14px;bottom:14px}}
@media(forced-colors:active){.v5-loop-btn{border-color:ButtonText;color:ButtonText;background:ButtonFace}}
@media(prefers-reduced-motion:reduce){.v5-loop-btn{transition:none}}
@media print{.v5-loop-btn{display:none!important}}

/* ===== K · Kopf (Plan § 5.5, D-P7, R-E12): 10.11 und die Kopf-Regeln aus 10.13 (MOB-01, MOB-03) wortgleich verschoben.
   Keine neue Kopf-Regel. Bleibt der letzte Abschnitt von v5.css. ===== */
/* >>> KOPF-START · Startseite und Kontaktseite wortgleich; _baue_kontakt.py übernimmt diesen Block per Assert */
.topnav .btn{padding:8px 16px}
@media(max-width:860px){.nav-dd-top::after{content:none}}
@media(max-width:640px){
  .topbar-inner{position:relative}
  .topbar-inner .brand{min-height:52px}
  .topbar-inner .topnav>.btn{position:absolute;top:10px;right:16px;min-height:44px;max-width:min(200px,calc(100% - 172px));padding:0 14px;white-space:normal;text-align:center;line-height:1.15;font-size:.82rem}
  .topnav a,.lang-toggle button{min-height:44px}
  .lang-toggle button{min-width:44px}
}
/* <<< KOPF-ENDE */