/* DomainWache „Scheckheft“ – öffentlicher Auftritt (gebaut aus design/dw-signal.css + design/dw-public.css, Claude 2026-10-05). */
/* ==========================================================================
   DomainWache „Scheckheft“ – Designsystem 2026-10-05 (Claude, nach Claude Design).
   Leitidee: Das Scheckheft für Ihre Website. Papier, Tinte und Plakettengelb.
   Gelb nur als Fläche (Plakette, Hauptaktion, Markierung), nie als Textfarbe auf Papier.
   Zustände immer mit Wort, Text mindestens 4,5:1 (tests/token-contrast.test.js).
   Nur transform/opacity animiert, prefers-reduced-motion vollständig respektiert.
   ========================================================================== */
/* Bricolage Grotesque + IBM Plex Mono (SIL OFL 1.1, /dw-fonts-OFL.txt), selbst gehostet, Latin */
@font-face{font-family:"Bricolage Grotesque";src:url("/dw-bricolage.woff2") format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("/dw-plex-mono-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("/dw-plex-mono-500.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("/dw-plex-mono-600.woff2") format("woff2");font-weight:600 700;font-display:swap}

:root{
  /* Papier und Linien */
  --s-bg:#f2eee5; --s-bg-sunken:#e8e3d8; --s-surface:#fffcf6; --s-surface-2:#f8f4ec; --s-raised:#fffcf6;
  --s-line:#dfd7c6; --s-line-strong:#b9ae97; --s-field-line:#8a7f6a; --s-overlay:rgb(22 25 29/.45);
  /* Tinte */
  --s-ink:#16191d; --s-ink-2:#3a3f45; --s-muted:#62666b; --s-faint:#62666b; --s-on-ink:#f2eee5; --s-placeholder:#6b6e72;
  /* Plakettengelb (Fläche) und Zustände (Wort + Farbe) */
  --s-signal:#f5c431; --s-signal-ink:#5a4300; --s-signal-soft:#fbefc4; --s-signal-glow:rgb(245 196 49/.4);
  --s-ok:#1e7a46; --s-ok-soft:#dcefe2; --s-ok-ink:#1a6e3f;
  --s-warn:#c98a00; --s-warn-soft:#fbebc5; --s-warn-ink:#8f5800;
  --s-crit:#b3261e; --s-crit-soft:#f8ddd8; --s-crit-ink:#b3261e;
  --s-info:#2350a8; --s-info-soft:#dfe7f7; --s-info-ink:#2350a8;
  --s-neutral-soft:#e8e3d8; --s-neutral-ink:#3a3f45;
  /* Nachtflächen (Tinte als Hintergrund, in beiden Themen dunkel) */
  --s-night:#16191d; --s-night-2:#1f2328; --s-night-line:rgb(242 238 229/.14); --s-night-ink:#f2eee5; --s-night-muted:#cfc8ba; --s-night-accent:#f5c431;
  /* Form */
  --s-r-xs:6px; --s-r-sm:10px; --s-r:12px; --s-r-lg:16px; --s-r-xl:22px; --s-r-pill:999px;
  --s-shadow-1:0 1px 0 rgb(22 25 29/.04),0 1px 2px rgb(22 25 29/.06);
  --s-shadow-2:0 1px 2px rgb(22 25 29/.06),0 10px 24px -12px rgb(22 25 29/.25);
  --s-shadow-3:0 2px 6px rgb(22 25 29/.06),0 24px 48px -24px rgb(22 25 29/.35);
  --s-offset:4px 4px 0;
  /* Fokus: gelber Hof, Tintenring – sichtbar auf Papier und auf Tinte */
  --s-focus:0 0 0 3px var(--s-signal),0 0 0 5px var(--s-ink);
  /* Schrift */
  --s-sans:"Bricolage Grotesque",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --s-display:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;
  --s-mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;
  /* Bewegung */
  --s-ease:cubic-bezier(.2,.7,.2,1); --s-ease-out:cubic-bezier(.16,1,.3,1); --s-spring:cubic-bezier(.2,1.3,.35,1);
  --s-fast:.16s; --s-med:.26s; --s-slow:.6s;
  /* Raster */
  --s-sidebar:256px; --s-sidebar-mini:72px; --s-topbar:64px; --s-content:1320px;
  color-scheme:light;
}
/* Abgeleitete Nachtpalette: Tinte als Fläche, Papier als Schrift, Gelb unverändert */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --s-bg:#16191d; --s-bg-sunken:#101316; --s-surface:#1f2328; --s-surface-2:#252a30; --s-raised:#2a2f36;
  --s-line:#33383f; --s-line-strong:#4a5059; --s-field-line:#857f73; --s-overlay:rgb(0 0 0/.6);
  --s-ink:#f2eee5; --s-ink-2:#d6d0c3; --s-muted:#a8a296; --s-faint:#9c968a; --s-on-ink:#16191d; --s-placeholder:#9c968a;
  --s-signal:#f5c431; --s-signal-ink:#f5c431; --s-signal-soft:rgb(245 196 49/.14); --s-signal-glow:rgb(245 196 49/.4);
  --s-ok:#4cc27e; --s-ok-soft:rgb(76 194 126/.14); --s-ok-ink:#7fd6a0;
  --s-warn:#f0b44c; --s-warn-soft:rgb(240 180 76/.14); --s-warn-ink:#f5c77a;
  --s-crit:#ff7b72; --s-crit-soft:rgb(255 123 114/.14); --s-crit-ink:#ff9f98;
  --s-info:#7fa6f0; --s-info-soft:rgb(127 166 240/.14); --s-info-ink:#a9c3f5;
  --s-neutral-soft:#2a2f36; --s-neutral-ink:#cfc9bc;
  --s-night:#101316; --s-night-2:#1f2328;
  --s-shadow-1:0 1px 0 rgb(0 0 0/.3); --s-shadow-2:0 1px 2px rgb(0 0 0/.4),0 10px 30px -12px rgb(0 0 0/.7); --s-shadow-3:0 2px 8px rgb(0 0 0/.5),0 30px 80px -24px rgb(0 0 0/.85);
  color-scheme:dark;
}}
:root[data-theme="dark"]{
  --s-bg:#16191d; --s-bg-sunken:#101316; --s-surface:#1f2328; --s-surface-2:#252a30; --s-raised:#2a2f36;
  --s-line:#33383f; --s-line-strong:#4a5059; --s-field-line:#857f73; --s-overlay:rgb(0 0 0/.6);
  --s-ink:#f2eee5; --s-ink-2:#d6d0c3; --s-muted:#a8a296; --s-faint:#9c968a; --s-on-ink:#16191d; --s-placeholder:#9c968a;
  --s-signal:#f5c431; --s-signal-ink:#f5c431; --s-signal-soft:rgb(245 196 49/.14); --s-signal-glow:rgb(245 196 49/.4);
  --s-ok:#4cc27e; --s-ok-soft:rgb(76 194 126/.14); --s-ok-ink:#7fd6a0;
  --s-warn:#f0b44c; --s-warn-soft:rgb(240 180 76/.14); --s-warn-ink:#f5c77a;
  --s-crit:#ff7b72; --s-crit-soft:rgb(255 123 114/.14); --s-crit-ink:#ff9f98;
  --s-info:#7fa6f0; --s-info-soft:rgb(127 166 240/.14); --s-info-ink:#a9c3f5;
  --s-neutral-soft:#2a2f36; --s-neutral-ink:#cfc9bc;
  --s-night:#101316; --s-night-2:#1f2328;
  --s-shadow-1:0 1px 0 rgb(0 0 0/.3); --s-shadow-2:0 1px 2px rgb(0 0 0/.4),0 10px 30px -12px rgb(0 0 0/.7); --s-shadow-3:0 2px 8px rgb(0 0 0/.5),0 30px 80px -24px rgb(0 0 0/.85);
  color-scheme:dark;
}

/* ---------- Basis ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--s-bg);color:var(--s-ink);font:400 15px/1.55 var(--s-sans);-webkit-font-smoothing:antialiased;font-optical-sizing:auto}
img,svg,video{display:block;max-width:100%}
a{color:inherit;text-decoration-thickness:1.5px;text-underline-offset:3px}
:focus-visible{outline:none;box-shadow:var(--s-focus);border-radius:var(--s-r-sm)}
::selection{background:var(--s-signal);color:#16191d}
::placeholder{color:var(--s-placeholder);opacity:1}
.s-mono,code,kbd,samp{font-family:var(--s-mono);font-feature-settings:"zero","tnum"}
.s-num{font-variant-numeric:tabular-nums}
.s-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
h1,h2,h3,h4{margin:0;font-family:var(--s-display);font-weight:750;color:var(--s-ink);letter-spacing:-.025em;line-height:1.12;text-wrap:balance}
h1{font-weight:800;letter-spacing:-.04em}

/* ---------- Typografie-Skala ---------- */
.s-eyebrow{font:500 12px/1.2 var(--s-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--s-muted)}
.s-title-xl{font:800 clamp(42px,5.6vw,92px)/.95 var(--s-display);letter-spacing:-.04em}
.s-title-l{font:800 clamp(30px,3.6vw,48px)/1.02 var(--s-display);letter-spacing:-.035em}
.s-title-m{font:750 22px/1.2 var(--s-display);letter-spacing:-.02em}
.s-title-s{font:700 16px/1.3 var(--s-display);letter-spacing:-.01em}
.s-lead{font-size:18px;line-height:1.55;color:var(--s-ink-2);text-wrap:pretty}
.s-small{font-size:13px;color:var(--s-muted)}
/* Gelbe Markierung unter einem Wort (Leitidee „Scheckheft“) */
.s-mark{background-image:linear-gradient(transparent 58%,var(--s-signal) 58%,var(--s-signal) 92%,transparent 92%);background-repeat:no-repeat;background-size:100% 100%;-webkit-box-decoration-break:clone;box-decoration-break:clone}
:root[data-theme="dark"] .s-mark{background-image:none;color:var(--s-signal-ink)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .s-mark{background-image:none;color:var(--s-signal-ink)}}

/* ---------- Buttons ----------
   Standard: Papier mit Tintenrand. Primär: Tinte, beim Zeigen gelber Versatzschatten.
   Signal: Plakettengelb mit Tintenrand (Hauptaktion einer Seite), Tintenschatten. */
.s-btn{--b-bg:var(--s-surface);--b-fg:var(--s-ink);--b-bd:var(--s-ink);--b-shadow:var(--s-ink);
  appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:var(--s-r-sm);
  border:2px solid var(--b-bd);background:var(--b-bg);color:var(--b-fg);font:650 15px/1 var(--s-sans);letter-spacing:-.005em;text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:background var(--s-fast),border-color var(--s-fast),color var(--s-fast),transform .2s var(--s-ease),box-shadow .2s var(--s-ease)}
.s-btn:hover{transform:translate(-2px,-2px);box-shadow:var(--s-offset) var(--b-shadow)}
.s-btn:active{transform:none;box-shadow:0 0 0 var(--b-shadow)}
.s-btn svg{width:16px;height:16px;flex:none}
.s-btn--primary{--b-bg:var(--s-ink);--b-fg:var(--s-on-ink);--b-bd:var(--s-ink);--b-shadow:var(--s-signal)}
.s-btn--signal{--b-bg:var(--s-signal);--b-fg:#16191d;--b-bd:#16191d;--b-shadow:#16191d}
.s-btn--ghost{--b-bg:transparent;--b-bd:transparent}
.s-btn--ghost:hover{--b-bg:var(--s-neutral-soft);transform:none;box-shadow:none}
.s-btn--danger{--b-bg:var(--s-crit);--b-fg:var(--s-on-ink);--b-bd:var(--s-crit);--b-shadow:var(--s-ink)}
.s-btn--danger-quiet{--b-bg:transparent;--b-fg:var(--s-crit-ink);--b-bd:transparent}
.s-btn--danger-quiet:hover{--b-bg:var(--s-crit-soft);transform:none;box-shadow:none}
.s-btn--sm{min-height:36px;padding:0 12px;font-size:13.5px;border-width:1.5px;border-radius:var(--s-r-xs)}
.s-btn--lg{min-height:56px;padding:0 26px;font-size:17px;border-radius:var(--s-r)}
.s-btn[disabled],.s-btn[aria-disabled="true"]{opacity:.5;pointer-events:none}
@media (pointer:coarse){.s-btn--sm{min-height:44px}}

/* ---------- Formulare ---------- */
.s-field{display:grid;gap:6px}
.s-label{font:650 13.5px/1.3 var(--s-sans);color:var(--s-ink-2)}
.s-hint{font-size:13px;color:var(--s-muted)}
.s-input,.s-select,.s-textarea{width:100%;min-height:44px;padding:10px 14px;border-radius:var(--s-r-sm);border:1.5px solid var(--s-field-line);background:var(--s-surface);color:var(--s-ink);font:400 15px/1.4 var(--s-sans);transition:border-color var(--s-fast),box-shadow var(--s-fast)}
.s-input:hover,.s-select:hover,.s-textarea:hover{border-color:var(--s-ink)}
.s-input:focus,.s-select:focus,.s-textarea:focus{outline:none;border-color:var(--s-ink);box-shadow:0 0 0 3px var(--s-signal)}
.s-input[aria-invalid="true"]{border-color:var(--s-crit);box-shadow:0 0 0 3px var(--s-crit-soft)}

/* ---------- Karten und Flächen ---------- */
.s-card{background:var(--s-surface);border:1px solid var(--s-line);border-radius:var(--s-r-lg);box-shadow:var(--s-shadow-1)}
.s-card__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid var(--s-line)}
.s-card__body{padding:18px}
.s-card--interactive{transition:border-color var(--s-med),box-shadow var(--s-med),transform var(--s-med) var(--s-ease)}
.s-card--interactive:hover{border-color:var(--s-line-strong);box-shadow:var(--s-shadow-2);transform:translateY(-1px)}

/* ---------- Kennzahlen ---------- */
.s-kpi{position:relative;display:grid;gap:4px;padding:16px 18px;background:var(--s-surface);border:1px solid var(--s-line);border-radius:var(--s-r-lg)}
.s-kpi__label{font-size:12.5px;color:var(--s-muted)}
.s-kpi__value{font:800 30px/1.05 var(--s-display);letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.s-kpi__meta{font-size:12.5px;color:var(--s-muted)}
.s-kpi[data-tone="crit"] .s-kpi__value{color:var(--s-crit-ink)}
.s-kpi[data-tone="warn"] .s-kpi__value{color:var(--s-warn-ink)}

/* ---------- Status ---------- */
.s-badge{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:var(--s-r-pill);font:600 12px/1 var(--s-sans);background:var(--s-neutral-soft);color:var(--s-neutral-ink);white-space:nowrap}
.s-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.85}
.s-badge--ok{background:var(--s-ok-soft);color:var(--s-ok-ink)}
.s-badge--warn{background:var(--s-warn-soft);color:var(--s-warn-ink)}
.s-badge--crit{background:var(--s-crit-soft);color:var(--s-crit-ink)}
.s-badge--info{background:var(--s-info-soft);color:var(--s-info-ink)}
.s-badge--plain::before{display:none}
.s-dot{position:relative;display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--s-ok)}
.s-dot--live::after{content:"";position:absolute;inset:0;border-radius:50%;background:inherit;animation:s-breathe 2.2s var(--s-ease-out) infinite}
@keyframes s-breathe{0%{transform:scale(1);opacity:.6}100%{transform:scale(3);opacity:0}}

/* ---------- Tabellen ---------- */
.s-table-wrap{overflow:auto;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface)}
.s-table{width:100%;border-collapse:separate;border-spacing:0;font-size:14px}
.s-table th{position:sticky;top:0;z-index:1;background:var(--s-surface-2);text-align:left;font:600 12px/1.2 var(--s-sans);color:var(--s-muted);padding:10px 14px;border-bottom:1px solid var(--s-line);white-space:nowrap}
.s-table td{padding:12px 14px;border-bottom:1px solid var(--s-line);vertical-align:middle}
.s-table tr:last-child td{border-bottom:0}
.s-table tbody tr{transition:background var(--s-fast)}
.s-table tbody tr:hover{background:var(--s-surface-2)}
.s-table .s-actions{text-align:right;white-space:nowrap}

/* ---------- Tabs ---------- */
.s-tabs{display:flex;gap:2px;border-bottom:1px solid var(--s-line)}
.s-tab{position:relative;appearance:none;border:0;background:none;padding:10px 12px;font:600 14px/1 var(--s-sans);color:var(--s-muted);cursor:pointer;display:inline-flex;gap:8px;align-items:center}
.s-tab:hover{color:var(--s-ink)}
.s-tab[aria-selected="true"]{color:var(--s-ink)}
.s-tab[aria-selected="true"]::after{content:"";position:absolute;left:8px;right:8px;bottom:-1px;height:2px;border-radius:2px;background:var(--s-ink);animation:s-grow var(--s-med) var(--s-ease-out)}
@keyframes s-grow{from{transform:scaleX(.3);opacity:0}}
.s-count{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:var(--s-r-pill);background:var(--s-neutral-soft);color:var(--s-neutral-ink);font:600 11.5px/1 var(--s-sans)}

/* ---------- Leere Zustände und Puls ---------- */
.s-empty{display:grid;justify-items:center;gap:10px;padding:44px 20px;text-align:center;color:var(--s-muted)}
.s-empty h3{font-size:17px}
.s-pulse{width:120px;height:36px;color:var(--s-signal-ink)}
.s-pulse path{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:240;stroke-dashoffset:240;animation:s-trace 2.4s var(--s-ease) infinite}
@keyframes s-trace{0%{stroke-dashoffset:240}55%{stroke-dashoffset:0}100%{stroke-dashoffset:-240}}

/* ---------- Toast und Dialog ---------- */
.s-toast{position:fixed;right:20px;bottom:20px;z-index:80;display:flex;gap:10px;align-items:flex-start;max-width:420px;padding:12px 14px;border-radius:var(--s-r);background:var(--s-ink);color:var(--s-on-ink);box-shadow:var(--s-shadow-3);animation:s-rise .38s var(--s-spring)}
@keyframes s-rise{from{opacity:0;transform:translateY(10px) scale(.98)}}
.s-skeleton{background:linear-gradient(90deg,var(--s-neutral-soft) 0,var(--s-surface-2) 50%,var(--s-neutral-soft) 100%);background-size:200% 100%;animation:s-shimmer 1.4s linear infinite;border-radius:var(--s-r-xs)}
@keyframes s-shimmer{to{background-position:-200% 0}}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* ==========================================================================
   DomainWache „Scheckheft“ – öffentlicher Auftritt (Claude, 2026-10-05, nach Claude Design W1–W4).
   Wird hinter dw-signal.css zu public/dw-public.css gebaut.
   Papier, Tinte und Plakettengelb. Gelb nur als Fläche, Zustände immer mit Wort.
   ========================================================================== */
body{font:16px/1.6 var(--s-sans)}
body.dw-public{background:var(--s-bg);color:var(--s-ink);-webkit-font-smoothing:antialiased}
html{scroll-padding-top:96px}
.p-wrap{width:min(1328px,calc(100% - 112px));margin-inline:auto}
.skip-link{position:absolute;left:16px;top:-60px;z-index:100;padding:10px 14px;border-radius:var(--s-r-sm);background:var(--s-ink);color:var(--s-bg);font-weight:600;transition:top var(--s-fast)}
.skip-link:focus{top:12px}
:focus-visible{outline:none;box-shadow:var(--s-focus);border-radius:6px}
a{color:inherit}
.s-ic{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
[hidden]{display:none!important}

/* ---------- Kopf (W1): Papier, Plakette „DW“, Navigation, Hauptaktion, Lesefortschritt ---------- */
.site-header{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--s-bg) 92%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--s-line);color:var(--s-ink)}
.site-header .p-wrap{position:relative;display:flex;align-items:center;gap:20px;height:76px}
.p-brand{display:flex;align-items:center;gap:12px;min-height:44px;color:var(--s-ink);text-decoration:none;flex:none}
.p-brand__mark{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--s-signal);color:#16191d;box-shadow:inset 0 0 0 2px #16191d;flex:none;font:600 10px/1 var(--s-mono);letter-spacing:0;transition:transform var(--s-med) var(--s-spring)}
.p-brand:hover .p-brand__mark{transform:rotate(-8deg) scale(1.06)}
.p-brand__mark .s-ic{width:16px;height:16px;stroke-width:2.2}
.p-brand b{font:800 21px/1 var(--s-display);letter-spacing:-.02em}
.p-brand small{display:none}
.site-header nav{display:flex;align-items:center;gap:4px;flex:1;min-width:0}
.site-header nav[hidden],.public-menu-toggle[hidden]{display:none}
.site-header nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:var(--s-r-sm);color:var(--s-ink);font:500 16px/1 var(--s-sans);text-decoration:none;white-space:nowrap;transition:background var(--s-fast),color var(--s-fast)}
.site-header nav a:first-child{margin-left:auto}
.site-header nav a:hover{background:var(--s-bg-sunken)}
.site-header nav a[aria-current="page"]{background:var(--s-bg-sunken);font-weight:650}
.site-header nav .p-login{margin-left:auto}
.site-header nav .p-nav-cta{margin-left:6px;padding:0 20px;border:2px solid var(--s-ink);background:var(--s-ink);color:var(--s-on-ink);font-weight:650;font-size:15px;transition:transform .2s var(--s-ease),box-shadow .2s var(--s-ease)}
.site-header nav .p-nav-cta:hover{background:var(--s-ink);transform:translate(-2px,-2px);box-shadow:var(--s-offset) var(--s-signal)}
.p-icon-btn{display:inline-grid;place-items:center;width:44px;height:44px;flex:none;border:1.5px solid var(--s-line-strong);border-radius:var(--s-r-sm);background:transparent;color:var(--s-ink);cursor:pointer;transition:border-color var(--s-fast),transform var(--s-fast) var(--s-spring)}
.p-icon-btn:hover{border-color:var(--s-ink)}
.p-icon-btn:active{transform:scale(.94)}
.theme-ic--light{display:none}
html[data-theme=dark] .theme-ic--light{display:block}
html[data-theme=dark] .theme-ic--dark{display:none}
.public-menu-toggle{min-height:44px;margin-left:auto;padding:0 16px;white-space:nowrap;border:1.5px solid var(--s-ink);border-radius:var(--s-r-sm);background:transparent;color:var(--s-ink);font:600 15px/1 var(--s-sans);cursor:pointer}
@supports (animation-timeline:scroll()){
  .site-header::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--s-signal);transform-origin:left center;transform:scaleX(0);animation:p-progress linear both;animation-timeline:scroll(root)}
  @keyframes p-progress{to{transform:scaleX(1)}}
}
@media (max-width:1180px){.site-header nav a{padding:0 10px}.site-header nav .p-nav-cta{padding:0 14px}}
@media (max-width:1040px){
  .site-header .p-wrap{height:64px}
  .site-header nav{position:absolute;top:64px;left:-32px;right:-32px;flex-direction:column;align-items:stretch;gap:2px;padding:12px 32px 20px;background:var(--s-bg);border-bottom:1px solid var(--s-line);box-shadow:0 30px 60px -30px rgb(22 25 29/.35);animation:p-drop .32s var(--s-ease-out)}
  .site-header nav a,.site-header nav a:first-child,.site-header nav .p-login{margin-left:0;min-height:48px;padding:0 12px;font-size:17px}
  .site-header nav .p-nav-cta{margin:8px 0 0;justify-content:center}
  .p-brand b{font-size:19px}
}
@keyframes p-drop{from{opacity:0;transform:translateY(-8px)}}

/* ---------- Buttons im öffentlichen Auftritt ---------- */
.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 24px;border-radius:var(--s-r-sm);border:2px solid transparent;font:650 16px/1.15 var(--s-sans);text-align:center;text-decoration:none;cursor:pointer;transition:transform .2s var(--s-ease),background var(--s-fast),border-color var(--s-fast),box-shadow .2s var(--s-ease),color var(--s-fast)}
.button:hover{transform:translate(-2px,-2px)}
.button:active{transform:none;box-shadow:none}
.button-primary{background:var(--s-ink);border-color:var(--s-ink);color:var(--s-on-ink)}
.button-primary:hover{box-shadow:var(--s-offset) var(--s-signal)}
.button-signal{background:var(--s-signal);border-color:#16191d;color:#16191d}
.button-signal:hover{box-shadow:var(--s-offset) #16191d}
.button-quiet{background:transparent;border-color:var(--s-ink);color:var(--s-ink)}
.button-quiet:hover{box-shadow:var(--s-offset) var(--s-ink)}
.p-dark .button-primary{background:#f5c431;border-color:#f5c431;color:#16191d}
.p-dark .button-primary:hover{background:#f5c431;box-shadow:var(--s-offset) #f2eee5}
.p-dark .button-quiet{background:transparent;border-color:rgb(242 238 229/.6);color:#f2eee5}
.p-dark .button-quiet:hover{background:rgb(255 255 255/.07);box-shadow:var(--s-offset) #f5c431}
.text-link{display:inline-flex;align-items:center;gap:6px;color:var(--s-ink);font-weight:650;text-decoration:none;border-bottom:2px solid var(--s-signal);padding-bottom:2px;transition:border-color var(--s-fast),gap var(--s-med) var(--s-spring)}
.text-link:hover{border-color:var(--s-ink);gap:10px}
.text-link{position:relative}
.text-link::before{content:"";position:absolute;inset:-8px -4px}

/* ---------- Gemeinsame Abschnitts-Bausteine ---------- */
.p-section{padding:112px 0}
.p-section--sunken{background:var(--s-bg-sunken)}
.p-kicker,.p-eyebrow{margin:0 0 16px;font:500 14px/1.3 var(--s-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--s-ink-2)}
.p-sechead{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:24px 64px;align-items:end;margin-bottom:52px}
.p-sechead h2,.p-report h2{font:800 clamp(36px,4.4vw,56px)/1 var(--s-display);letter-spacing:-.03em}
.p-sechead p:not(.p-kicker){margin:0;color:var(--s-ink-2);font-size:18px;line-height:1.6}
.p-live{position:relative;width:8px;height:8px;border-radius:50%;background:var(--s-ok);box-shadow:0 0 0 4px var(--s-ok-soft);flex:none}
.p-hero__notes{display:flex;flex-wrap:wrap;gap:8px 20px;margin:22px 0 0;padding:0;list-style:none;color:var(--s-ink-2);font-size:14.5px}
.p-hero__notes li{display:flex;align-items:center;gap:8px}
.p-hero__notes .s-ic{width:15px;height:15px;color:var(--s-ok);stroke-width:2.2}
.small-note{margin:0;font-size:14px;line-height:1.5;color:var(--s-ink-2)}
.utility{margin:0}
.badge-row{display:flex;flex-wrap:wrap;gap:8px}

/* Zustands-Plaketten (Wort + Farbe) */
.s-badge{height:auto;min-height:24px;padding:4px 10px;font:600 13px/1.2 var(--s-sans)}
.s-badge::before{display:none}
.s-badge--plain{background:var(--s-neutral-soft);color:var(--s-neutral-ink)}

/* ---------- Startseite: Hero mit Schnellcheck (W1 + W2) ---------- */
.p-hero{position:relative;padding:96px 0 112px;scroll-margin-top:76px}
.p-hero__grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:64px;align-items:center}
.p-hero__copy{display:flex;flex-direction:column;gap:28px;min-width:0}
.p-hero__copy .p-eyebrow{margin:0}
.p-hero h1{margin:0;font:800 clamp(50px,6.6vw,92px)/.95 var(--s-display);letter-spacing:-.04em;color:var(--s-ink);text-wrap:balance}
.p-hero__lead{margin:0;max-width:600px;font-size:clamp(18px,1.6vw,22px);line-height:1.5;color:var(--s-ink-2);text-wrap:pretty}
.js .p-hero h1 .s-mark{background-size:0 100%;animation:p-sweep .9s .45s cubic-bezier(.65,0,.35,1) forwards}
@keyframes p-sweep{to{background-size:100% 100%}}

/* Formular (Hooks: #public-check-form, .input-row, #hostname, #hostname-help) */
.check-form{max-width:620px}
.input-row{display:flex;gap:10px}
.input-row input{flex:1;min-width:0;height:64px;padding:0 20px;border:2px solid var(--s-ink);border-radius:var(--s-r);background:var(--s-surface);color:var(--s-ink);font:500 18px/1 var(--s-mono);transition:box-shadow var(--s-fast)}
.input-row input:focus{outline:none;box-shadow:0 0 0 3px var(--s-signal),0 0 0 5px var(--s-ink)}
.input-row input[aria-invalid="true"]{border-color:var(--s-crit);box-shadow:0 0 0 3px var(--s-crit-soft)}
.input-row input:disabled{opacity:1;background:var(--s-surface-2);cursor:not-allowed}
.input-row button{flex:none;height:64px;min-height:64px;padding:0 26px;border-radius:var(--s-r);font-size:18px;font-weight:700}
.input-row button::after{content:"→";font-weight:600}
.input-row button:disabled{opacity:.6;cursor:progress;transform:none;box-shadow:none}
.field-help{margin:12px 0 0;font-size:15px;color:var(--s-ink-2)}
.limits{max-width:620px;border-top:1px solid var(--s-line)}
.limits summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:8px 0 0;cursor:pointer;list-style:none;font:600 15px/1.3 var(--s-sans);color:var(--s-ink)}
.limits summary::-webkit-details-marker{display:none}
.limits summary::after{content:"+";display:grid;place-items:center;width:28px;height:28px;flex:none;border:1.5px solid var(--s-ink);border-radius:50%;font:500 16px/1 var(--s-mono);transition:transform var(--s-med) var(--s-spring),background var(--s-fast)}
.limits[open] summary::after{transform:rotate(45deg);background:var(--s-signal);color:#16191d}
.limits p{margin:10px 0 0;font-size:14.5px;line-height:1.6;color:var(--s-ink-2)}
.check-offer-bridge{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 16px;max-width:620px;padding:14px 18px;border:1.5px solid var(--s-line-strong);border-radius:var(--s-r);color:var(--s-ink);text-decoration:none;transition:border-color var(--s-fast),transform .2s var(--s-ease),box-shadow .2s var(--s-ease)}
.check-offer-bridge span:first-child{font-size:14px;color:var(--s-ink-2)}
.check-offer-bridge strong{grid-column:1;font:700 16px/1.3 var(--s-display)}
.check-offer-bridge span:last-child{grid-row:1/3;grid-column:2;font-size:20px;transition:transform var(--s-med) var(--s-spring)}
.check-offer-bridge:hover{border-color:var(--s-ink);transform:translate(-2px,-2px);box-shadow:var(--s-offset) var(--s-ink)}
.check-offer-bridge:hover span:last-child{transform:translateX(4px)}

/* Prüfkarte (Hooks: #website-check, #check-progress, #check-status, #check-fallback) */
.check-shell{position:relative;min-width:0}
.check-tag{position:absolute;top:-16px;right:24px;z-index:2;padding:5px 10px;border-radius:var(--s-r-xs);background:var(--s-ink);color:var(--s-on-ink);font:500 12px/1.2 var(--s-mono)}
.check-card{position:relative;overflow:hidden;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);box-shadow:0 24px 48px -24px rgb(22 25 29/.35);transform:rotate(1.4deg);transition:transform .6s var(--s-ease)}
.check-shell[aria-busy="true"] .check-card,.check-shell.is-complete .check-card,.check-shell.is-error .check-card{transform:none}
.js .check-card{animation:p-settle 1s .15s var(--s-ease) backwards}
@keyframes p-settle{from{opacity:0;transform:translateY(48px) rotate(-6deg)}}
.check-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:24px 28px;border-bottom:2px dashed var(--s-line)}
.check-heading>div{display:flex;flex-direction:column;gap:6px;min-width:0}
.check-heading .utility{font:500 12px/1.3 var(--s-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--s-muted)}
.check-host{margin:0;font:500 17px/1.3 var(--s-mono);letter-spacing:0;color:var(--s-ink);overflow-wrap:anywhere}
.check-stamp{position:relative;display:grid;place-items:center;flex:none;width:96px;height:96px;border-radius:50%;background:#f5c431;color:#16191d;box-shadow:inset 0 0 0 2.5px #16191d;text-align:center;line-height:1}
.check-stamp::before{content:"";position:absolute;inset:6px;border-radius:50%;background:repeating-conic-gradient(#16191d 0deg 1.6deg,transparent 1.6deg 30deg);-webkit-mask:radial-gradient(circle,transparent 34px,#000 35px);mask:radial-gradient(circle,transparent 34px,#000 35px)}
.check-stamp b{display:block;font:800 30px/1 var(--s-display);letter-spacing:-.03em}
.check-stamp small{display:block;margin-top:2px;font:500 10px/1 var(--s-mono)}
.js .check-stamp{animation:p-stamp .76s .9s cubic-bezier(.3,.6,.2,1) backwards}
@keyframes p-stamp{0%{opacity:0;transform:scale(1.7) rotate(-18deg)}62%{opacity:1;transform:scale(.92) rotate(4deg)}82%{transform:scale(1.03) rotate(-1deg)}100%{transform:none}}
.check-progress{height:4px;background:var(--s-bg-sunken);overflow:hidden}
.check-progress i{display:block;height:100%;width:100%;background:var(--s-ink);transform-origin:left center;transform:scaleX(0);transition:transform .45s var(--s-ease)}
.check-shell.is-complete .check-progress i,.check-shell.is-error .check-progress i{transform:scaleX(1)}
.check-shell[aria-busy="true"] .check-progress i{width:38%;transform:none;animation:p-indeterminate 1.3s var(--s-ease) infinite}
@keyframes p-indeterminate{from{transform:translateX(-100%)}to{transform:translateX(270%)}}
.check-rows{margin:0;padding:0;list-style:none}
.check-rows li{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px 28px;border-bottom:1px solid color-mix(in srgb,var(--s-line) 65%,var(--s-surface))}
.check-rows b{font:600 17px/1.25 var(--s-display);letter-spacing:-.01em}
.check-rows span{font-size:15px;line-height:1.4;color:var(--s-ink-2);min-width:0}
.check-rows em{padding:5px 10px;border-radius:var(--s-r-pill);background:var(--s-neutral-soft);color:var(--s-neutral-ink);font:600 13px/1.2 var(--s-sans);font-style:normal;white-space:nowrap}
.check-rows [data-tone="ok"] em{background:var(--s-ok-soft);color:var(--s-ok-ink)}
.check-rows [data-tone="warn"] em{background:var(--s-warn-soft);color:var(--s-warn-ink)}
.check-rows [data-tone="crit"] em{background:var(--s-crit-soft);color:var(--s-crit-ink)}
.check-rows [data-tone="info"] em{background:var(--s-info-soft);color:var(--s-info-ink)}
.check-live [data-tone="busy"] em{animation:p-blink 1.1s ease-in-out infinite}
.check-live li:nth-child(2) em{animation-delay:.12s}.check-live li:nth-child(3) em{animation-delay:.24s}.check-live li:nth-child(4) em{animation-delay:.36s}
.check-live li:nth-child(5) em{animation-delay:.48s}.check-live li:nth-child(6) em{animation-delay:.6s}.check-live li:nth-child(7) em{animation-delay:.72s}.check-live li:nth-child(8) em{animation-delay:.84s}
.check-live li{padding:12px 28px}
.check-live li:not([data-tone]) b,.check-live [data-tone="busy"] b{color:var(--s-ink-2)}
.check-live li[data-tone]:not([data-tone="busy"]){animation:p-rowin .4s var(--s-ease-out)}
@keyframes p-blink{50%{opacity:.45}}
@keyframes p-rowin{from{opacity:.4;transform:translateX(-6px)}}
.check-sum{margin:0;padding:18px 28px 6px;font-size:15px;line-height:1.5;color:var(--s-ink-2)}
.check-sum strong{color:var(--s-ink);font-weight:700}
.check-sum a{font-weight:650;color:var(--s-ink)}
.status-row{padding:6px 28px 20px}
.status{margin:0;font-size:14px;line-height:1.5;color:var(--s-ink-2)}
.status.is-error{color:var(--s-crit-ink)}
.availability-fallback{margin:0 20px 20px;padding:20px;border-radius:var(--s-r);background:var(--s-bg-sunken)}
.availability-fallback .utility{font:500 12px/1.3 var(--s-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--s-ink-2)}
.availability-fallback h3{margin:6px 0 8px;font:700 19px/1.25 var(--s-display)}
.availability-fallback p{margin:0;font-size:15px;color:var(--s-ink-2)}
.result-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}

/* Ergebnis in Klartext (W2, Hooks: #check-result, #result-findings, #station-panel, #copy-proof, #result-to-149) */
.result{margin-top:88px;padding:56px 0 0;border-top:1.5px solid var(--s-ink);outline:none;animation:p-swap .5s var(--s-ease-out)}
.result-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px 48px;align-items:end;padding-bottom:40px;border-bottom:1.5px solid var(--s-ink)}
.result-head__copy{display:flex;flex-direction:column;gap:16px;min-width:0}
.result-head .utility{font:500 14px/1.3 var(--s-mono);color:var(--s-ink-2)}
.result-head h2{max-width:900px;font:800 clamp(34px,4.8vw,68px)/1 var(--s-display);letter-spacing:-.035em}
.result-host{margin:0;font:500 20px/1.3 var(--s-mono);overflow-wrap:anywhere}
.result-counts{display:flex;gap:12px;margin:0}
.result-counts div{display:flex;flex-direction:column-reverse;gap:4px;min-width:120px;padding:18px 22px;border-radius:14px}
.result-counts dt{font:600 15px/1.2 var(--s-sans)}
.result-counts dd{margin:0;font:800 40px/1 var(--s-display);font-variant-numeric:tabular-nums}
.result-counts [data-tone="crit"]{background:var(--s-crit-soft);color:var(--s-crit-ink)}
.result-counts [data-tone="warn"]{background:var(--s-warn-soft);color:var(--s-warn-ink)}
.result-counts [data-tone="ok"]{background:var(--s-ok-soft);color:var(--s-ok-ink)}
.result-body{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:56px;align-items:start;padding-top:48px}
.result-main{display:flex;flex-direction:column;gap:16px;min-width:0}
.result-state{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.result-findings{display:flex;flex-direction:column;gap:16px;margin:0;padding:0;list-style:none}
.result-finding{display:grid;grid-template-columns:140px minmax(0,1fr);gap:24px;padding:28px 32px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);transition:transform .25s var(--s-ease),box-shadow .25s}
.result-finding:hover{transform:translateY(-3px);box-shadow:0 18px 32px -18px rgb(22 25 29/.4)}
.result-finding__meta{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.result-finding__area{font:500 13px/1.3 var(--s-mono);color:var(--s-muted)}
.result-finding__body{display:flex;flex-direction:column;gap:12px;min-width:0}
.result-finding h3{font:700 clamp(21px,2vw,26px)/1.2 var(--s-display);letter-spacing:-.02em}
.result-finding p{margin:0;font-size:17px;line-height:1.55;color:var(--s-ink-2);text-wrap:pretty}
.result-finding__todo{display:flex;gap:10px;padding:12px 16px;border-radius:var(--s-r-sm);background:var(--s-bg);color:var(--s-ink)!important;font-size:16px!important}
.result-finding__todo b{flex:none;font-weight:700}
.result-ok{border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface)}
.result-ok summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:44px;padding:24px 32px;cursor:pointer;list-style:none;font:700 22px/1.2 var(--s-display)}
.result-ok summary::-webkit-details-marker{display:none}
.result-ok__more{font:500 15px/1 var(--s-sans);text-decoration:underline;text-underline-offset:3px}
.result-ok[open] .result-ok__more{display:none}
.result-ok ul{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0 32px 28px;list-style:none}
.result-ok li{padding:7px 12px;border-radius:var(--s-r-pill);background:var(--s-ok-soft);color:var(--s-ok-ink);font-size:15px;font-weight:500}
.result-ok li::before{content:"✓ "}
.result-note{margin:8px 0 0;max-width:760px;font-size:15px;line-height:1.55;color:var(--s-ink-2)}
.result-tech{border-top:1.5px solid var(--s-ink)}
.result-tech summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:56px;padding:12px 0;cursor:pointer;list-style:none;font:650 17px/1.3 var(--s-sans)}
.result-tech summary::-webkit-details-marker{display:none}
.result-tech summary::after{content:"+";display:grid;place-items:center;width:32px;height:32px;flex:none;border:1.5px solid var(--s-ink);border-radius:50%;font:500 18px/1 var(--s-mono);transition:transform var(--s-med) var(--s-spring),background var(--s-fast)}
.result-tech[open] summary::after{transform:rotate(45deg);background:var(--s-signal);color:#16191d}
.result-tech__body{display:flex;flex-direction:column;gap:14px;padding-bottom:8px}
.station-rail{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.station-step{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-width:0;min-height:44px;padding:12px;border:1.5px solid var(--s-line);border-radius:var(--s-r);background:var(--s-surface);color:var(--s-ink);font:inherit;text-align:left;cursor:pointer;overflow:hidden;transition:border-color var(--s-med),transform var(--s-fast) var(--s-spring)}
.station-step:hover{border-color:var(--s-line-strong)}
.station-step.is-current{border-color:var(--s-ink)}
.station-step::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--s-signal);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--s-ease-out)}
.station-step.is-current::after{transform:scaleX(1)}
.station-index{font:600 11px/1 var(--s-mono);color:var(--s-muted)}
.station-name{max-width:100%}
.station-name b{display:block;font:700 15px/1.15 var(--s-display)}
.station-name small{display:block;margin-top:3px;font-size:12.5px;color:var(--s-ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.station-step em{font:600 12px/1 var(--s-mono);font-style:normal;color:var(--s-ink-2)}
.station-step.is-ok em{color:var(--s-ok-ink)}
.station-step.is-warning em{color:var(--s-warn-ink)}
.station-step.is-failed em{color:var(--s-crit-ink)}
.station-panel{padding:20px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);outline:none}
.station-panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:14px}
.station-panel .utility{margin:0 0 4px;font:500 12px/1.3 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--s-ink-2)}
.station-panel h3{font:700 19px/1.25 var(--s-display);letter-spacing:-.02em}
.station-verdict{flex:none;padding:5px 10px;border-radius:var(--s-r-pill);background:var(--s-neutral-soft);color:var(--s-neutral-ink);font:600 12px/1.2 var(--s-mono);white-space:nowrap}
.station-verdict.is-ok{background:var(--s-ok-soft);color:var(--s-ok-ink)}
.station-verdict.is-warning{background:var(--s-warn-soft);color:var(--s-warn-ink)}
.station-verdict.is-failed{background:var(--s-crit-soft);color:var(--s-crit-ink)}
.station-reading{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0}
.station-reading p{margin:0;padding:12px;border-radius:var(--s-r-sm);background:var(--s-bg)}
.station-reading span{display:block;margin-bottom:6px;font:500 11.5px/1.2 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--s-ink-2)}
.station-reading strong{display:block;font:500 14px/1.45 var(--s-sans)}
.p-swap{animation:p-swap .38s var(--s-ease-out)}
@keyframes p-swap{from{opacity:0;transform:translateY(6px)}}
.result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0}
.result-grid div{padding:12px;border-radius:var(--s-r-sm);background:var(--s-surface);border:1px solid var(--s-line)}
.result-grid dt{font:500 11.5px/1.2 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--s-ink-2)}
.result-grid dd{margin:6px 0 0;font:700 15px/1.3 var(--s-display);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.result-detail{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px}
.result-detail p{margin:0;font-size:14px;color:var(--s-ink-2);overflow-wrap:anywhere}
.result-detail strong{display:block;font:500 11.5px/1.4 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--s-ink)}
.result-next{position:sticky;top:100px;display:flex;flex-direction:column;gap:16px}
.result-next__card{display:flex;flex-direction:column;gap:18px;padding:28px;border-radius:var(--s-r-lg);background:var(--s-night);color:var(--s-night-ink)}
.result-next__card h3{font:700 26px/1.2 var(--s-display);letter-spacing:-.02em;color:var(--s-night-ink)}
.result-option{display:flex;flex-direction:column;gap:6px;padding:16px;border:1px solid var(--s-night-line);border-radius:var(--s-r)}
.result-option p{margin:0;font-size:15px;line-height:1.5;color:var(--s-night-muted)}
.result-option p:first-child{display:flex;justify-content:space-between;gap:12px;color:var(--s-night-ink);font:700 18px/1.3 var(--s-display)}
.result-next .result-actions{flex-direction:column;margin-top:0}
.result-next .button{width:100%;min-height:54px}
.result-next__card .button-quiet{border-color:var(--s-night-ink);color:var(--s-night-ink)}
.result-next__card .button-quiet:hover{box-shadow:var(--s-offset) var(--s-signal)}
.result-next .button-signal:hover{box-shadow:var(--s-offset) var(--s-night-ink)}
.result-share{display:flex;flex-direction:column;gap:12px;padding:24px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface)}
.result-share h3{font:700 20px/1.2 var(--s-display)}
.result-share p{margin:0;font-size:15px;line-height:1.5;color:var(--s-ink-2)}

/* ---------- Laufband „Was DomainWache prüft“ (Startseite Live) ---------- */
.p-strip{border-bottom:1px solid var(--s-line);background:var(--s-surface)}
.p-strip ul{display:grid;grid-template-columns:repeat(4,1fr);margin-block:0;padding:0;list-style:none}
.p-strip li{display:flex;align-items:center;gap:14px;padding:24px 20px;border-left:1px solid var(--s-line);font-size:14px;line-height:1.45;color:var(--s-ink-2)}
.p-strip li:first-child{border-left:0;padding-left:0}
.p-strip .s-ic{width:22px;height:22px;color:var(--s-ink)}
.p-strip b{display:block;color:var(--s-ink);font:650 15px/1.25 var(--s-display)}
.p-strip:has(>.p-ticker){border:0;background:transparent}
.p-ticker{overflow:hidden;padding:18px 0 40px}
.p-ticker__band{position:relative;overflow:hidden;background:#f5c431;color:#16191d;border-block:2px solid #16191d;transform:rotate(-1.2deg) scale(1.03)}
.p-ticker__track{display:flex;width:max-content;animation:p-ticker 48s linear infinite}
.p-ticker__band:hover .p-ticker__track,.p-ticker.is-paused .p-ticker__track{animation-play-state:paused}
.p-ticker ul{display:flex;grid-template-columns:none;margin:0;padding:14px 0;list-style:none}
.p-ticker li{display:flex;align-items:center;gap:18px;padding:0 18px;border:0;font:700 clamp(18px,2vw,24px)/1.2 var(--s-display);letter-spacing:-.01em;color:#16191d;white-space:nowrap}
.p-ticker li:first-child{padding-left:18px}
.p-ticker li::after{content:"";width:10px;height:10px;border-radius:50%;border:2px solid #16191d}
@keyframes p-ticker{to{transform:translateX(-50%)}}
.p-ticker__toggle{position:absolute;right:max(32px,4vw);top:50%;z-index:2;transform:translateY(-50%) rotate(1.2deg);min-height:44px;padding:0 14px;border:1.5px solid #16191d;border-radius:var(--s-r-pill);background:#fffcf6;color:#16191d;font:600 12px/1 var(--s-mono);cursor:pointer}

/* ---------- Vier Fragen (Tinte) ---------- */
.p-questions{padding:104px 0;background:var(--s-night);color:var(--s-night-ink)}
.p-questions__head{display:flex;justify-content:space-between;align-items:flex-end;gap:48px;margin-bottom:64px}
.p-questions h2{max-width:720px;font:800 clamp(38px,4.6vw,64px)/1 var(--s-display);letter-spacing:-.03em;color:var(--s-night-ink)}
.p-questions__head p{max-width:460px;margin:0;font-size:19px;line-height:1.55;color:var(--s-night-muted)}
.p-questions__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0;list-style:none;border-top:1px solid var(--s-night-line)}
.p-questions__grid li{display:flex;flex-direction:column;gap:16px;padding:32px 32px 0 0}
.p-questions__grid span{font:500 14px/1 var(--s-mono);color:var(--s-night-accent)}
.p-questions__grid h3{font:700 clamp(22px,2vw,28px)/1.15 var(--s-display);letter-spacing:-.02em;color:var(--s-night-ink)}
.p-questions__grid p{margin:0;font-size:17px;line-height:1.55;color:var(--s-night-muted)}

/* ---------- Mehr als eine Ampel (Funktionen) ---------- */
.p-features__grid{display:grid;grid-template-columns:420px minmax(0,1fr);gap:80px;align-items:start}
.p-features__intro{position:sticky;top:116px;display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.p-features__intro .p-kicker{margin:0}
.p-features h2,.p-klartext h2,.p-booklet h2,.p-prices h2,.p-person h2,.p-faq h2{font:800 clamp(36px,4.4vw,56px)/1 var(--s-display);letter-spacing:-.03em;text-wrap:balance}
.p-features__intro>p:not(.p-kicker){margin:0;font-size:19px;line-height:1.55;color:var(--s-ink-2);text-wrap:pretty}
.p-features__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;margin:0;padding:0;list-style:none}
.p-features__list li{display:flex;flex-direction:column;gap:10px;padding:28px 0;border-top:1.5px solid var(--s-ink)}
.p-features__list span{font:500 14px/1 var(--s-mono);color:var(--s-muted)}
.p-features__list h3{font:700 clamp(21px,1.9vw,25px)/1.2 var(--s-display);letter-spacing:-.02em}
.p-features__list p{margin:0;font-size:17px;line-height:1.55;color:var(--s-ink-2);text-wrap:pretty}

/* ---------- Klartext-Schalter (Beispiel) ---------- */
.p-klartext{padding-top:24px}
.p-klartext__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:clamp(32px,5vw,72px);align-items:center}
.p-klartext__intro{display:flex;flex-direction:column;gap:18px}
.p-klartext__intro .p-kicker{margin:0}
.p-klartext__intro>p:not(.p-kicker){margin:0;font-size:19px;line-height:1.55;color:var(--s-ink-2)}
.kx-tabs{display:none;flex-wrap:wrap;gap:8px}
.kx-tabs button{min-height:44px;padding:0 16px;border:1.5px solid var(--s-ink);border-radius:var(--s-r-pill);background:transparent;color:var(--s-ink);font:600 15px/1 var(--s-sans);cursor:pointer;transition:background .2s,color .2s}
.kx-tabs button[aria-pressed="true"]{background:var(--s-ink);color:var(--s-on-ink)}
.kx{display:flex;flex-direction:column;gap:14px;min-width:0}
.kx-mode{display:none;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:var(--s-r);background:color-mix(in srgb,var(--s-bg-sunken) 70%,var(--s-line-strong))}
.kx-mode button{min-height:46px;border:0;border-radius:9px;background:transparent;color:var(--s-ink);font:600 15px/1.2 var(--s-sans);cursor:pointer;transition:background .3s var(--s-ease),color .3s}
.kx-mode button[aria-pressed="true"]{background:var(--s-ink);color:var(--s-on-ink)}
.kx-item{display:grid;gap:14px}
.kx-raw{margin:0;padding:28px;border-radius:var(--s-r-lg);background:var(--s-night);color:#e8e3d8;font:400 15px/1.75 var(--s-mono);white-space:pre-wrap;overflow-wrap:anywhere}
.kx-raw span{display:block;margin-bottom:10px;color:var(--s-night-accent)}
.kx-plain{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:28px;border:1.5px solid var(--s-ink);border-radius:var(--s-r-lg);background:var(--s-surface)}
.kx-plain p{margin:0;font:600 clamp(19px,2vw,24px)/1.4 var(--s-sans);text-wrap:pretty}
.kx-plain .kx-todo{display:flex;gap:10px;align-self:stretch;padding:12px 16px;border-radius:var(--s-r-sm);background:var(--s-bg);font:400 16px/1.5 var(--s-sans)}
.kx-todo b{flex:none;font-weight:700}
.kx.is-enhanced .kx-mode{display:grid}
.p-klartext:has(.kx.is-enhanced) .kx-tabs{display:flex}
.kx.is-enhanced .kx-item{display:none}
.kx.is-enhanced .kx-item.is-active{display:grid;grid-template-areas:"panel";animation:p-swap .45s var(--s-ease-out)}
.kx.is-enhanced .kx-item .kx-raw,.kx.is-enhanced .kx-item .kx-plain{grid-area:panel}
.kx.is-enhanced[data-mode="plain"] .kx-raw,.kx.is-enhanced[data-mode="raw"] .kx-plain{visibility:hidden}

/* ---------- Plaketten-Sammelheft (Beispiel) ---------- */
.p-booklet__head{display:flex;flex-direction:column;gap:16px;max-width:760px;margin-bottom:36px}
.p-booklet__head .p-kicker{margin:0}
.p-booklet__head p:not(.p-kicker){margin:0;font-size:19px;line-height:1.55;color:var(--s-ink-2)}
.p-booklet__months{display:grid;grid-template-columns:repeat(auto-fill,minmax(max(96px,calc((100% - 70px) / 6)),1fr));gap:14px;margin:0 0 28px;padding:0;list-style:none}
.p-booklet__months button{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;min-height:44px;padding:8px 4px;border:0;border-radius:var(--s-r);background:transparent;color:var(--s-ink);font:inherit;cursor:pointer}
.p-plaque{position:relative;display:grid;place-items:center;width:76px;height:76px;border-radius:50%;background:#7fc79a;color:#16191d;box-shadow:inset 0 0 0 2px #16191d;font:800 22px/1 var(--s-display);transition:transform .3s cubic-bezier(.3,1.4,.5,1),box-shadow .25s}
.p-plaque::before{content:"";position:absolute;inset:5px;border-radius:50%;background:repeating-conic-gradient(#16191d 0deg 1.6deg,transparent 1.6deg 30deg);-webkit-mask:radial-gradient(circle,transparent 26px,#000 27px);mask:radial-gradient(circle,transparent 26px,#000 27px)}
[data-tone="warn"] .p-plaque{background:#f5c431}
[data-tone="crit"] .p-plaque{background:#f2998c}
[data-tone="none"] .p-plaque{background:transparent;color:var(--s-ink-2);box-shadow:inset 0 0 0 2px var(--s-line-strong)}
[data-tone="none"] .p-plaque::before{background:repeating-conic-gradient(var(--s-line-strong) 0deg 1.6deg,transparent 1.6deg 30deg)}
.p-booklet__months button:hover .p-plaque{transform:translateY(-6px) rotate(-8deg)}
.p-booklet__months button[aria-pressed="true"] .p-plaque{transform:translateY(-6px);box-shadow:inset 0 0 0 2px #16191d,0 0 0 4px var(--s-ink)}
.p-booklet__name{font:500 13px/1 var(--s-mono)}
.p-booklet__months button[aria-pressed="true"] .p-booklet__name{font-weight:700}
.p-booklet__verdict{font-size:12.5px;line-height:1.25;color:var(--s-ink-2);text-align:center}
.p-booklet__detail{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;padding:24px 28px;border:1.5px solid var(--s-ink);border-radius:var(--s-r-lg);background:var(--s-surface)}
.p-booklet__detail>div{display:flex;flex:1 1 280px;flex-direction:column;gap:4px}
.p-booklet__detail h3{font:700 22px/1.25 var(--s-display)}
.p-booklet__detail p{margin:0;font-size:17px;line-height:1.5;color:var(--s-ink-2)}
.p-booklet__rule{margin:18px 0 0;font-size:15px;line-height:1.55;color:var(--s-ink-2)}
.p-booklet__rule b{color:var(--s-ink)}

/* ---------- Preise (W3 als Abschnitt) ---------- */
.p-prices__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 32px;margin-bottom:36px}
.p-prices__head .p-kicker{margin-bottom:16px}
.p-prices__group{margin:0 0 20px;font:500 14px/1.3 var(--s-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--s-ink-2)}
.p-offers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-bottom:64px}
.p-offer{display:flex;flex-direction:column;gap:18px;padding:32px;border:1.5px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);transition:transform .25s var(--s-ease),box-shadow .25s var(--s-ease)}
.p-offer:hover{transform:translateY(-3px);box-shadow:0 18px 32px -18px rgb(22 25 29/.4)}
.p-offer--main{border:2px solid var(--s-ink);box-shadow:6px 6px 0 var(--s-ink)}
.p-offer--main:hover{transform:translate(-3px,-3px);box-shadow:9px 9px 0 var(--s-ink)}
.p-offer__top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.p-offer h3{font:700 22px/1.2 var(--s-display);letter-spacing:-.01em}
.p-offer__tag{flex:none;padding:4px 8px;border-radius:var(--s-r-xs);background:var(--s-bg-sunken);color:var(--s-ink);font:500 12px/1.2 var(--s-mono)}
.p-offer__tag--signal{background:#f5c431;color:#16191d}
.p-offer__price,.p-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0}
.p-offer__price strong,.p-price strong{font:800 48px/1 var(--s-display);letter-spacing:-.03em;color:inherit}
.p-offer__price span,.p-price span{font-size:15px;color:var(--s-ink-2)}
.p-offer>p:not([class]){margin:0;min-height:52px;font-size:17px;line-height:1.55;color:var(--s-ink-2)}
.p-offer ul{display:flex;flex-direction:column;gap:10px;margin:0;padding:20px 0 0;border-top:1px solid color-mix(in srgb,var(--s-line) 65%,var(--s-surface));list-style:none;font-size:16px;line-height:1.4}
.p-offer li{display:flex;gap:10px;align-items:flex-start}
.p-offer li .s-ic{width:17px;height:17px;margin-top:2px;color:var(--s-ok-ink);stroke-width:2.4}
.p-offer .button{margin-top:auto;width:100%}
.p-offer .small-note{font-size:13.5px}
.p-ongoing{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:32px 56px;align-items:center;padding:40px;border-radius:var(--s-r-lg);background:var(--s-night);color:var(--s-night-ink)}
.p-ongoing h3{font:800 clamp(26px,2.6vw,36px)/1.1 var(--s-display);letter-spacing:-.03em;color:var(--s-night-ink)}
.p-ongoing p{margin:14px 0 0;font-size:17px;line-height:1.6;color:var(--s-night-muted)}
.p-ongoing .p-note{padding:12px 16px;border:1px solid var(--s-night-line);border-radius:var(--s-r-sm);color:var(--s-night-ink)}
.p-ongoing__actions{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.p-ongoing .button-primary{background:#f5c431;border-color:#f5c431;color:#16191d}
.p-ongoing .button-primary:hover{box-shadow:var(--s-offset) var(--s-night-ink)}
.p-ongoing .text-link{color:var(--s-night-ink)}
.p-ongoing .text-link:hover{border-color:var(--s-night-ink)}
.p-ongoing .small-note{color:var(--s-night-muted)}
.p-ongoing .small-note a{color:var(--s-night-ink)}
.svc-price .p-price strong{color:#fff}

/* ---------- Wer dahinter steht ---------- */
.p-person{padding-top:0}
.p-person__grid{display:grid;grid-template-columns:380px minmax(0,1fr);gap:64px;align-items:center;padding-top:56px;border-top:1.5px solid var(--s-ink)}
.p-person__photo img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:var(--s-r-lg);background:var(--s-bg-sunken)}
.p-person__copy{display:flex;flex-direction:column;gap:24px;max-width:680px}
.p-person__copy .p-kicker{margin:0}
.p-person__copy>p:not(.p-kicker){margin:0;font-size:20px;line-height:1.55;color:var(--s-ink-2);text-wrap:pretty}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}

/* ---------- Schritte, Musterbericht, Grenzen (auch Unterseiten) ---------- */
.p-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:0;padding:0;list-style:none}
.p-step{position:relative;padding:28px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface)}
.p-step__num{display:flex;align-items:center;gap:12px;margin:0 0 30px;font:500 13px/1 var(--s-mono);letter-spacing:.06em;color:var(--s-ink-2)}
.p-step__num::after{content:"";flex:1;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--s-ink) 0 var(--p-fill),var(--s-line) var(--p-fill))}
.p-step.is-in .p-step__num::after{animation:p-fill 1.2s var(--s-ease-out) forwards}
.p-step:nth-child(2).is-in .p-step__num::after{animation-delay:.2s}.p-step:nth-child(3).is-in .p-step__num::after{animation-delay:.4s}
@property --p-fill{syntax:"<percentage>";inherits:false;initial-value:0%}
@keyframes p-fill{to{--p-fill:100%}}
.p-step h3{margin-bottom:10px;font:700 22px/1.2 var(--s-display);letter-spacing:-.02em}
.p-step p{margin:0;color:var(--s-ink-2);font-size:16px;line-height:1.6}
.p-report{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:72px;align-items:center}
.p-report h2 span{color:var(--s-muted)}
.p-report>div>p{margin:20px 0 26px;color:var(--s-ink-2);font-size:17px;line-height:1.65}
.sample-note{position:relative;padding:28px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);box-shadow:var(--s-shadow-3);transform:rotate(-1.2deg);transition:transform .8s var(--s-ease-out)}
.sample-note:hover{transform:rotate(0) translateY(-4px)}
.sample-note .utility{display:inline-flex;margin:0 0 14px;padding:5px 10px;border-radius:var(--s-r-xs);background:var(--s-ink);color:var(--s-on-ink);font:500 12px/1.2 var(--s-mono)}
.sample-note h3{margin-bottom:8px;font:500 20px/1.2 var(--s-mono)}
.sample-note>div{display:grid;grid-template-columns:130px 1fr;gap:16px;padding:16px 0;border-top:1px solid var(--s-line)}
.sample-note>div span{font:500 12px/1.5 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--s-ink-2)}
.sample-note>div p{margin:0;font-size:15px}
.p-bounds{display:flex;flex-direction:column;gap:12px;margin-top:32px;padding:28px;border:2px dashed var(--s-line-strong);border-radius:var(--s-r-lg)}
.p-bounds h3{font:700 22px/1.2 var(--s-display);letter-spacing:-.02em}
.p-bounds p{margin:0;color:var(--s-ink-2);font-size:16px;line-height:1.65}

/* ---------- Häufige Fragen ---------- */
.p-faq{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:32px 80px;align-items:start}
.p-faq>div:last-child,.p-faq__list{border-top:1.5px solid var(--s-ink)}
.p-faq details{border-bottom:1px solid var(--s-line)}
.p-faq summary{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:64px;padding:18px 0;cursor:pointer;list-style:none;font:700 clamp(17px,1.5vw,20px)/1.35 var(--s-display);letter-spacing:-.01em}
.p-faq summary::-webkit-details-marker{display:none}
.p-faq summary::after{content:"+";display:grid;place-items:center;flex:none;width:32px;height:32px;border:1.5px solid var(--s-ink);border-radius:50%;font:500 18px/1 var(--s-mono);color:var(--s-ink);transition:transform .35s var(--s-ease),background var(--s-fast)}
.p-faq details[open] summary::after{transform:rotate(45deg);background:var(--s-signal);color:#16191d}
.p-faq details p{margin:0 0 22px;max-width:680px;font-size:17px;line-height:1.6;color:var(--s-ink-2)}
:root{interpolate-size:allow-keywords}
.p-faq details::details-content{block-size:0;overflow:hidden;transition:block-size .4s var(--s-ease),content-visibility .4s allow-discrete}
.p-faq details[open]::details-content{block-size:auto}

/* ---------- Abschluss (Unterseiten: Tinte · Startseite: Plakettengelb) ---------- */
.p-cta{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:32px;align-items:end;padding:56px;border-radius:22px;background:var(--s-night);color:var(--s-night-ink)}
.p-cta h2{font:800 clamp(32px,4vw,52px)/1.03 var(--s-display);letter-spacing:-.035em;color:var(--s-night-ink)}
.p-cta p:not(.p-kicker){margin:18px 0 0;max-width:36em;color:var(--s-night-muted);font-size:17px;line-height:1.6}
.p-cta .closing-actions{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.p-cta .text-link{color:var(--s-night-ink);border-color:var(--s-night-accent)}
.p-pulse{display:block;width:100%;max-width:340px;height:60px;margin-bottom:8px}
.p-pulse path{fill:none;stroke:#f5c431;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:420;stroke-dashoffset:420}
.p-cta.is-in .p-pulse path{animation:p-draw 2.4s .3s var(--s-ease-out) forwards}
@keyframes p-draw{to{stroke-dashoffset:0}}
.p-closing{padding-top:0}
.p-section--sunken+.p-closing{padding-top:clamp(56px,6vw,96px)}
.p-closing__band{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:32px;align-items:center;padding:clamp(28px,5vw,56px);border:2px solid #16191d;border-radius:22px;background:#f5c431;color:#16191d;box-shadow:8px 8px 0 #16191d}
.p-closing__band h2{font:800 clamp(32px,4vw,56px)/1 var(--s-display);letter-spacing:-.035em;color:#16191d}
.p-closing__band p{margin:12px 0 0;font-size:18px;line-height:1.5}
.p-closing__actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px}
.p-closing .button-primary{background:#16191d;border-color:#16191d;color:#f2eee5}
.p-closing .button-primary:hover{box-shadow:var(--s-offset) #fffcf6}
.p-closing .button-quiet{border-color:#16191d;color:#16191d}
.p-closing .button-quiet:hover{box-shadow:var(--s-offset) #16191d}
.p-closing__more{margin:28px 0 0;text-align:center;font-size:16px;color:var(--s-ink-2)}
.p-closing__more a{color:var(--s-ink);font-weight:600}

/* ---------- Fuß: Tinte mit gelber Plakette (in beiden Themen dunkel) ---------- */
.site-footer{padding:64px 0 calc(40px + env(safe-area-inset-bottom));background:var(--s-night);color:var(--s-night-muted);font-size:16px}
.site-footer .p-wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px 48px}
.footer-brand{display:inline-flex;align-items:center;gap:12px;color:var(--s-night-ink);font:800 21px/1 var(--s-display);letter-spacing:-.02em;text-decoration:none}
.site-footer__brand p{max-width:320px;margin:16px 0 0;line-height:1.5}
.site-footer nav{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.site-footer__title{margin:0 0 8px;color:var(--s-night-ink);font-weight:600}
.site-footer nav a{display:inline-flex;align-items:center;min-height:44px;color:var(--s-night-muted);text-decoration:none;transition:color var(--s-fast)}
.site-footer nav a:hover{color:var(--s-night-ink);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}
.site-footer nav a[aria-current="page"]{color:var(--s-night-ink);text-decoration:underline}
.site-footer :focus-visible{box-shadow:0 0 0 3px var(--s-signal)}
@media (pointer:coarse){.site-footer nav a{min-height:44px}}

/* ---------- Einblenden (nur mit JS, siehe dw-public.js) ---------- */
.js .p-reveal{opacity:0;transform:translateY(18px);transition:opacity .56s var(--s-ease),transform .56s var(--s-ease)}
.js .p-reveal.is-in{opacity:1;transform:none}
.js .p-features__list .p-reveal:nth-child(even),.js .p-questions__grid .p-reveal:nth-child(2){transition-delay:.07s}
.js .p-questions__grid .p-reveal:nth-child(3){transition-delay:.14s}.js .p-questions__grid .p-reveal:nth-child(4){transition-delay:.21s}
.js .p-offers .p-reveal:nth-child(2){transition-delay:.07s}.js .p-offers .p-reveal:nth-child(3){transition-delay:.14s}
.js .p-hero__copy>*{animation:p-rise .56s var(--s-ease) backwards}
.js .p-hero__copy>:nth-child(2){animation-delay:.07s}.js .p-hero__copy>:nth-child(3){animation-delay:.14s}.js .p-hero__copy>:nth-child(4){animation-delay:.21s}.js .p-hero__copy>:nth-child(5){animation-delay:.28s}.js .p-hero__copy>:nth-child(6){animation-delay:.35s}
@keyframes p-rise{from{opacity:0;transform:translateY(18px)}}

/* ---------- Responsiv ---------- */
@media (max-width:1180px){.p-wrap{width:calc(100% - 64px)}.p-features__grid{grid-template-columns:320px minmax(0,1fr);gap:56px}.result-body{grid-template-columns:minmax(0,1fr) 360px;gap:40px}}
@media (max-width:1040px){
  .p-hero__grid{grid-template-columns:1fr;gap:56px}
  .check-shell{max-width:640px}
  .p-questions__head{flex-direction:column;align-items:flex-start;gap:20px}
  .p-questions__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .p-features__grid{grid-template-columns:1fr;gap:40px}
  .p-features__intro{position:static}
  .p-offers{grid-template-columns:1fr;max-width:640px}
  .result-head{grid-template-columns:1fr}
  .result-body{grid-template-columns:1fr}
  .result-next{position:static}
  .p-strip ul{grid-template-columns:1fr 1fr}.p-strip li:nth-child(3){border-left:0;padding-left:0}.p-strip li:nth-child(n+3){border-top:1px solid var(--s-line)}
}
@media (max-width:860px){
  .p-section{padding:80px 0}
  .p-sechead,.p-report,.p-faq,.p-cta,.p-ongoing,.p-person__grid{grid-template-columns:1fr}
  .p-steps{grid-template-columns:1fr}
  .p-report{gap:48px}.sample-note{transform:none}
  .p-person__photo{max-width:380px}
  .site-footer .p-wrap{grid-template-columns:1fr 1fr}
  .site-footer__brand{grid-column:1/-1}
}
@media (max-width:640px){
  .p-wrap{width:calc(100% - 40px)}
  .site-header nav{left:-20px;right:-20px;padding:12px 20px 20px}
  .p-hero{padding:36px 0 56px}
  .p-hero__copy{gap:20px}
  .p-hero h1{font-size:clamp(42px,12.8vw,52px)}
  .p-eyebrow,.p-kicker{font-size:12px}
  .input-row{flex-direction:column}
  .input-row input,.input-row button{height:56px;min-height:56px}
  .input-row button{width:100%;font-size:17px}
  .check-card{transform:none}
  .check-tag{top:-12px;right:16px}
  .check-heading{padding:16px 18px}
  .check-host{font-size:14px}
  .check-stamp{width:64px;height:64px}
  .check-stamp::before{-webkit-mask:radial-gradient(circle,transparent 22px,#000 23px);mask:radial-gradient(circle,transparent 22px,#000 23px)}
  .check-stamp b{font-size:20px}
  .check-rows li,.check-live li{grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding:13px 18px}
  .check-rows span{grid-column:1/-1;grid-row:2;font-size:14px}
  .check-rows b{font-size:16px}
  .check-rows em{font-size:12px}
  .check-sum{padding:16px 18px 4px}
  .status-row{padding:6px 18px 18px}
  .result{margin-top:56px;padding-top:32px}
  .result-head{padding-bottom:24px}
  .result-head h2{font-size:clamp(30px,9vw,36px)}
  .result-host{font-size:15px}
  .result-counts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
  .result-counts div{min-width:0;padding:12px}
  .result-counts dd{font-size:28px}
  .result-counts dt{font-size:13px}
  .result-body{padding-top:24px}
  .result-finding{grid-template-columns:1fr;gap:10px;padding:18px}
  .result-finding__meta{flex-direction:row;justify-content:space-between;align-items:center}
  .result-finding h3{font-size:20px}
  .result-finding p{font-size:15px}
  .result-ok summary{padding:18px;font-size:19px}
  .result-ok ul{padding:0 18px 18px}
  .station-rail{gap:4px}
  .station-step{padding:10px 8px}
  .station-name small{display:none}
  .result-grid{grid-template-columns:1fr 1fr}
  .result-detail{grid-template-columns:1fr}
  .result-next__card{padding:20px}
  .p-questions{padding:48px 0}
  .p-questions__head{margin-bottom:28px}
  .p-questions h2{font-size:38px}
  .p-questions__grid{grid-template-columns:1fr}
  .p-questions__grid li{gap:8px;padding:20px 0;border-top:1px solid var(--s-night-line)}
  .p-questions__grid li:first-child{border-top:0}
  .p-features h2,.p-klartext h2,.p-booklet h2,.p-prices h2,.p-person h2,.p-faq h2{font-size:clamp(30px,9vw,38px)}
  .p-features__list{grid-template-columns:1fr}
  .p-features__list li{padding:18px 0}
  .p-features__list h3{font-size:20px}
  .p-features__list p{font-size:16px}
  .kx-raw,.kx-plain{padding:20px}
  .kx-mode button{font-size:14px}
  .p-booklet__months{grid-template-columns:repeat(3,minmax(0,1fr))}
  .p-booklet__detail{padding:20px}
  .p-offer{padding:22px}
  .p-offer__price strong,.p-price strong{font-size:40px}
  .p-ongoing{padding:26px 22px}
  .p-person__grid{gap:28px;padding-top:40px}
  .p-person__copy>p:not(.p-kicker){font-size:17px}
  .p-cta{padding:36px 24px}
  .p-closing__actions{justify-content:flex-start}
  .p-bounds{padding:22px}
  .p-strip ul{grid-template-columns:1fr}.p-strip li,.p-strip li:nth-child(3){border-left:0;padding-left:0}.p-strip li+li{border-top:1px solid var(--s-line)}
  .p-ticker ul{display:flex}.p-ticker li+li{border-top:0}
  .sample-note>div{grid-template-columns:1fr;gap:6px}
  .site-footer .p-wrap{gap:28px 20px}
}
@media(max-width:450px){.input-row{flex-wrap:wrap}.input-row input{padding:0 16px;font-size:17px}.input-row button{width:100%;justify-content:center}.station-reading{grid-template-columns:1fr}.p-brand b{font-size:18px}.site-footer .p-wrap{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.js .p-reveal{opacity:1;transform:none}.js .p-hero h1 .s-mark{background-size:100% 100%}.p-step__num::after{--p-fill:100%}.p-pulse path{stroke-dashoffset:0}.check-shell[aria-busy="true"] .check-progress i{width:100%;transform:none;opacity:.5}.site-header::after{display:none}.p-ticker__toggle{display:none}}
@media print{.site-header,.p-cta,.p-closing,.p-ticker,.check-offer-bridge{display:none}.p-hero{padding:24px 0}.check-card{transform:none;box-shadow:none}}

/* ==========================================================================
   Unterseiten-Bausteine (Claude, 2026-10). Alle öffentlichen Seiten nutzen dieselbe Shell
   wie index.html (site-header, main#main, site-footer) und nur diese Klassen.
   Wird hinter dw-public.css in public/dw-public.css gebaut.
   ========================================================================== */
/* Seitenkopf: Papier, große Tintenüberschrift, Brotkrumen in Mono (Scheckheft W4) */
.p-pagehead{position:relative;padding:72px 0 56px;background:var(--s-bg);color:var(--s-ink);border-bottom:1px solid var(--s-line)}
.p-pagehead__grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:40px 64px;align-items:end}
.p-pagehead__grid--single{grid-template-columns:minmax(0,1fr)}
.p-pagehead h1{margin:0;font:800 clamp(42px,5.4vw,80px)/.98 var(--s-display);letter-spacing:-.04em;color:var(--s-ink)}
.p-pagehead h1 em{font-style:normal;background-image:linear-gradient(transparent 58%,var(--s-signal) 58%,var(--s-signal) 92%,transparent 92%);-webkit-box-decoration-break:clone;box-decoration-break:clone}
:root[data-theme="dark"] .p-pagehead h1 em{background-image:none;color:var(--s-signal-ink)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .p-pagehead h1 em{background-image:none;color:var(--s-signal-ink)}}
.p-pagehead .p-kicker{color:var(--s-ink-2)}
.p-pagehead__lead{margin:22px 0 0;max-width:36em;font-size:20px;line-height:1.5;color:var(--s-ink-2);text-wrap:pretty}
.p-pagehead__aside{display:grid;gap:10px;padding:22px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);font-size:15px;color:var(--s-ink-2);box-shadow:var(--s-shadow-1)}
.p-pagehead__aside strong{color:var(--s-ink)}
.p-pagehead .actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:30px}
.p-pagehead .button-primary{background:var(--s-signal);border-color:#16191d;color:#16191d}
.p-pagehead .button-primary:hover{box-shadow:var(--s-offset) #16191d}
.p-pagehead .p-hero__notes{color:var(--s-ink-2)}
.p-pagehead .p-hero__notes .s-ic{color:var(--s-ok)}
.p-auth__brand .button-primary{background:#f5c431;border-color:#f5c431;color:#16191d}
.p-auth__brand .button-primary:hover{background:#f8d35e;box-shadow:var(--s-offset) #f2eee5}
.p-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 30px;padding:0;list-style:none;font:500 13px/1.2 var(--s-mono);color:var(--s-muted)}
.p-crumbs li+li::before{content:"/";margin-right:6px;color:var(--s-line-strong)}
.p-crumbs a{color:var(--s-ink-2);text-decoration:underline;text-decoration-color:var(--s-line-strong)}
.p-crumbs a:hover{color:var(--s-ink);text-decoration-color:var(--s-ink)}
.p-crumbs [aria-current]{color:var(--s-ink)}
.js .p-pagehead__grid>*{animation:p-rise .9s var(--s-ease-out) backwards}
.js .p-pagehead__grid>:nth-child(2){animation-delay:.12s}

/* Karten und Raster */
.p-grid{display:grid;gap:16px}
.p-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.p-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.p-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.p-card{position:relative;display:flex;flex-direction:column;gap:12px;padding:26px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);transition:transform var(--s-med) var(--s-ease),box-shadow var(--s-med),border-color var(--s-med)}
a.p-card{color:inherit;text-decoration:none}
a.p-card:hover,.p-card--hover:hover{transform:translateY(-3px);box-shadow:var(--s-shadow-3);border-color:var(--s-line-strong)}
.p-card h3{font:720 21px/1.2 var(--s-display);letter-spacing:-.025em}
.p-card p:not(.p-kicker){margin:0;color:var(--s-ink-2);font-size:15px;line-height:1.65}
.p-card__icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--s-signal-soft);color:var(--s-signal-ink)}
.p-card__icon .s-ic{width:21px;height:21px}
.p-card__meta{margin-top:auto;padding-top:10px;font:600 12px/1.3 var(--s-mono);letter-spacing:.04em;color:var(--s-muted)}
.p-card--dark{background:#16191d;border-color:#16191d;color:#f2eee5}
.p-card--dark h3{color:#fff}.p-card--dark p:not(.p-kicker){color:#cfc8ba}
html[data-theme=dark] .p-card--dark{border-color:var(--s-line-strong)}
.p-badge{display:inline-flex;align-items:center;gap:6px;width:fit-content;height:24px;padding:0 10px;border-radius:var(--s-r-pill);background:var(--s-neutral-soft);color:var(--s-neutral-ink);font:600 12px/1 var(--s-sans)}
.p-badge--signal{background:var(--s-signal-soft);color:var(--s-signal-ink)}
.p-badge--warn{background:var(--s-warn-soft);color:var(--s-warn-ink)}

/* Häkchen-Liste ohne zusätzliche SVGs */
.p-checklist{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.p-checklist li{position:relative;padding-left:30px;color:var(--s-ink-2);line-height:1.55}
.p-checklist li::before{content:"";position:absolute;left:0;top:2px;width:20px;height:20px;border-radius:50%;background:var(--s-signal-soft)}
.p-checklist li::after{content:"";position:absolute;left:5px;top:7px;width:10px;height:10px;background:var(--s-signal-ink);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat}
.p-checklist--x li::before{background:var(--s-neutral-soft)}
.p-checklist--x li::after{background:var(--s-muted);-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E")}
.p-dark .p-checklist li,.p-card--dark .p-checklist li{color:#cfc8ba}
.p-dark .p-checklist li::before,.p-card--dark .p-checklist li::before{background:rgb(245 196 49/.16)}
.p-dark .p-checklist li::after,.p-card--dark .p-checklist li::after{background:#f5c431}

/* Hinweisflächen */
.p-callout{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;padding:18px 20px;border-radius:16px;border:1px solid var(--s-line);background:var(--s-surface-2);font-size:15px;line-height:1.6;color:var(--s-ink-2)}
.p-callout>.s-ic{grid-row:1/3;width:20px;height:20px;margin-top:2px;color:var(--s-info)}
.p-callout strong{color:var(--s-ink)}
.p-callout p{margin:0}
.p-callout--warn{background:var(--s-warn-soft);border-color:transparent}.p-callout--warn>.s-ic{color:var(--s-warn-ink)}
.p-callout--signal{background:var(--s-signal-soft);border-color:transparent}.p-callout--signal>.s-ic{color:var(--s-signal-ink)}

/* Zweispaltig: Text + Begleitspalte */
.p-split{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:48px 72px;align-items:start}
.p-sticky{position:sticky;top:96px}

/* Fließtext (Rechtliches, Ratgeber, Musterbericht) */
.p-doc{display:grid;grid-template-columns:240px minmax(0,1fr);gap:56px;align-items:start}
.p-doc>*{min-width:0}
.p-toc{position:sticky;top:96px;display:grid;gap:2px;padding:0;margin:0;list-style:none;font-size:14px}
.p-toc p{margin:0 0 10px;font:600 11.5px/1.2 var(--s-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--s-muted)}
.p-toc a{display:block;padding:8px 12px;border-left:2px solid var(--s-line);color:var(--s-ink-2);text-decoration:none;transition:color var(--s-fast),border-color var(--s-fast),background var(--s-fast)}
.p-toc a:hover,.p-toc a[aria-current]{color:var(--s-ink);border-color:var(--s-ink);background:var(--s-surface)}
.p-prose{max-width:72ch;font-size:16.5px;line-height:1.75;color:var(--s-ink-2)}
.p-prose>*+*{margin-top:1.05em}
.p-prose h2{margin-top:2.4em;font:700 30px/1.15 var(--s-display);letter-spacing:-.03em;color:var(--s-ink);scroll-margin-top:96px}
.p-prose h3{margin-top:1.9em;font:660 20px/1.3 var(--s-display);letter-spacing:-.015em;color:var(--s-ink);scroll-margin-top:96px}
.p-prose h4{margin-top:1.6em;font:640 16.5px/1.4 var(--s-sans);color:var(--s-ink)}
.p-prose>:first-child{margin-top:0}
.p-prose a{color:var(--s-ink);text-decoration:underline;text-decoration-color:var(--s-signal);text-decoration-thickness:2px;text-underline-offset:.18em}
.p-prose a:hover{color:var(--s-signal-ink)}
.p-prose ul,.p-prose ol{padding-left:1.3em}
.p-prose li+li{margin-top:.4em}
.p-prose li::marker{color:var(--s-signal-ink)}
.p-prose strong{color:var(--s-ink)}
.p-prose code{padding:2px 6px;border-radius:6px;background:var(--s-neutral-soft);font:500 .88em var(--s-mono)}
.p-prose blockquote{margin-left:0;padding:4px 0 4px 20px;border-left:3px solid var(--s-signal);color:var(--s-ink)}
.p-prose section{scroll-margin-top:96px}
.p-prose section+section{margin-top:3em;padding-top:2.2em;border-top:1px solid var(--s-line)}
.p-prose section>h2:first-child{margin-top:0}

/* Tabellen */
.p-table-wrap{overflow-x:auto;border:1px solid var(--s-line);border-radius:16px;background:var(--s-surface)}
.p-table{width:100%;border-collapse:collapse;font-size:14.5px}
.p-table th{padding:12px 16px;border-bottom:1px solid var(--s-line);background:var(--s-surface-2);font:600 12px/1.3 var(--s-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--s-muted);text-align:left;white-space:nowrap}
.p-table td{padding:14px 16px;border-bottom:1px solid var(--s-line);color:var(--s-ink-2);vertical-align:top}
.p-table tr:last-child td{border-bottom:0}
.p-table tbody tr{transition:background var(--s-fast)}
.p-table tbody tr:hover{background:var(--s-surface-2)}

/* Formulare (Kontakt, Kompass, Login) */
.p-form{display:grid;gap:18px}
.p-form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.p-field{display:grid;gap:7px}
.p-field>label,.p-field>legend,.p-label{font:600 14px/1.3 var(--s-sans);color:var(--s-ink)}
.p-field small,.p-help{font-size:13px;line-height:1.5;color:var(--s-muted)}
.p-input,.p-select,.p-textarea,.p-form input[type=text],.p-form input[type=email],.p-form input[type=url],.p-form input[type=tel],.p-form input[type=password],.p-form select,.p-form textarea{width:100%;min-height:48px;padding:12px 14px;border:1px solid var(--s-line-strong);border-radius:12px;background:var(--s-surface);color:var(--s-ink);font:400 16px/1.4 var(--s-sans);transition:border-color var(--s-fast),box-shadow var(--s-fast),background var(--s-fast)}
.p-form textarea,.p-textarea{min-height:140px;resize:vertical}
.p-form select,.p-select{appearance:none;padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237d828d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:18px}
.p-form input:hover,.p-form select:hover,.p-form textarea:hover{border-color:var(--s-muted)}
.p-form input:focus,.p-form select:focus,.p-form textarea:focus,.p-input:focus,.p-select:focus,.p-textarea:focus{outline:none;border-color:var(--s-ink);box-shadow:0 0 0 4px var(--s-signal-soft)}
.p-form input[aria-invalid=true],.p-form textarea[aria-invalid=true]{border-color:var(--s-crit)}
.p-form fieldset{margin:0;padding:0;border:0;display:grid;gap:10px}
.p-consent{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;padding:14px 16px;border:1px solid var(--s-line);border-radius:14px;background:var(--s-surface-2);font-size:14px;line-height:1.55;color:var(--s-ink-2);cursor:pointer}
.p-consent input,.p-form input[type=checkbox],.p-form input[type=radio]{width:20px;height:20px;min-height:0;margin:1px 0 0;accent-color:var(--s-ink);box-shadow:none}
.p-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px}
.p-choice{position:relative;display:flex;align-items:center;gap:10px;padding:13px 14px;border:1px solid var(--s-line-strong);border-radius:12px;background:var(--s-surface);font-size:14.5px;cursor:pointer;transition:border-color var(--s-fast),background var(--s-fast)}
.p-choice:has(input:checked){border-color:var(--s-ink);background:var(--s-signal-soft)}
.p-status{margin:0;padding:12px 14px;border-radius:12px;background:var(--s-neutral-soft);font-size:14px;color:var(--s-ink-2)}
.p-status:empty{display:none}
.p-status.is-error,.p-status[data-state=error]{background:var(--s-crit-soft);color:var(--s-crit-ink)}
.p-status.is-success,.p-status[data-state=success]{background:var(--s-signal-soft);color:var(--s-signal-ink)}
.p-form .button{min-height:50px;padding:0 22px;font-size:15px}
.p-form button:disabled{opacity:.55;cursor:not-allowed}

/* Login: geteilte Fläche */
.p-auth{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:100dvh}
.p-auth__brand{position:relative;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;justify-content:space-between;gap:40px;padding:40px clamp(24px,5vw,72px);background:#16191d;color:#f2eee5}
.p-auth__brand::before{content:"";position:absolute;bottom:-300px;left:-200px;width:800px;height:800px;border-radius:50%;background:radial-gradient(circle,rgb(245 196 49/.18),transparent 60%);z-index:-1;animation:p-glow 12s ease-in-out infinite alternate}
.p-auth__brand h1,.p-auth__brand h2{font:800 clamp(34px,3.8vw,54px)/1.04 var(--s-display);letter-spacing:-.045em;color:#fff}
.p-auth__brand p{max-width:30em;color:#cfc8ba;line-height:1.6}
.p-auth__panel{display:grid;place-items:center;padding:40px clamp(20px,5vw,72px);background:var(--s-bg)}
.p-auth__card{width:min(440px,100%)}
.p-auth__card h1,.p-auth__card h2{font:760 32px/1.1 var(--s-display);letter-spacing:-.035em}
.p-auth__card>p{color:var(--s-ink-2)}
.p-auth .p-pulse path{animation:p-draw 2.4s .4s var(--s-ease-out) forwards}

/* Zahlen-Kacheln */
.p-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.p-fact{padding:18px;border:1px solid var(--s-line);border-radius:16px;background:var(--s-surface)}
.p-fact b{display:block;font:760 28px/1 var(--s-display);letter-spacing:-.035em;color:var(--s-ink)}
.p-fact span{display:block;margin-top:6px;font-size:13px;color:var(--s-muted)}
.p-dark .p-fact{background:rgb(255 255 255/.04);border-color:rgb(255 255 255/.1)}
.p-dark .p-fact b{color:#fff}

@media (max-width:1040px){.p-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}.p-doc{grid-template-columns:1fr}.p-toc{position:static;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:4px}}
@media (max-width:860px){.p-pagehead__grid,.p-split,.p-auth{grid-template-columns:1fr}.p-grid--2,.p-grid--3{grid-template-columns:1fr}.p-sticky{position:static}.p-auth__brand{padding-bottom:48px}.p-form-row{grid-template-columns:1fr}}
@media (max-width:640px){.p-pagehead{padding:40px 0 48px}.p-pagehead__lead{font-size:16.5px}.p-grid--4{grid-template-columns:1fr}.p-card{padding:22px}.p-prose{font-size:16px}.p-prose h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){.p-auth .p-pulse path{stroke-dashoffset:0}}

/* ===== auth.css ===== */
/* Gruppe „auth“: Login (login.html) und Fehlerseite (404.html). Claude, 2026-10. */

/* ---------- Login: Markenfläche ---------- */
.p-auth__brand::after{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgb(255 255 255/.035) 1px,transparent 1px),linear-gradient(90deg,rgb(255 255 255/.035) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 30% 70%,#000 10%,transparent 72%);mask-image:radial-gradient(ellipse 70% 60% at 30% 70%,#000 10%,transparent 72%)}
.auth-bar{display:flex;align-items:center;gap:12px}
.auth-bar .p-brand{margin-right:auto}
.p-auth__brand .p-brand{color:#f2eee5}
.p-auth__brand .p-brand small{color:#cfc8ba}
.p-auth__brand .p-icon-btn{color:#f2eee5;border-color:rgb(242 238 229/.35)}
.p-auth__brand .p-icon-btn:hover{border-color:#f2eee5}
.auth-back{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid rgb(255 255 255/.12);border-radius:var(--s-r-sm);color:#cfc8ba;font:500 14px/1 var(--s-sans);text-decoration:none;transition:color var(--s-fast),border-color var(--s-fast),background var(--s-fast)}
.auth-back:hover{color:#fff;border-color:rgb(255 255 255/.28);background:rgb(255 255 255/.05)}
.auth-back .s-ic{width:16px;height:16px;transition:transform var(--s-med) var(--s-spring)}
.auth-back:hover .s-ic{transform:translateX(-3px)}
.auth-story{max-width:520px}
.p-auth__brand .p-kicker{color:#f5c431}
.p-auth__brand h1 em{font-style:normal;background:linear-gradient(100deg,#f5c431 10%,#fadb7a 50%,#f5c431 90%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:p-sheen 6s ease-in-out infinite}
.p-auth__brand .auth-lead{margin:22px 0 0;font-size:17px}
.p-auth__brand .p-pulse{margin:28px 0 12px}
.auth-points{display:grid;gap:4px;margin:0;padding:0;list-style:none}
.auth-points li{display:flex;align-items:flex-start;gap:14px;padding:14px 0;border-top:1px solid rgb(255 255 255/.08)}
.auth-points li:first-child{border-top:0}
.auth-points__icon{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:10px;background:rgb(245 196 49/.12);color:#f5c431}
.auth-points strong{display:block;color:#fff;font:650 15.5px/1.3 var(--s-display);letter-spacing:-.01em}
.p-auth__brand .auth-points p{margin:3px 0 0;font-size:14px;color:#a8a296}
.p-auth__brand .auth-access{margin:0;max-width:none;padding-top:20px;border-top:1px solid rgb(255 255 255/.08);font-size:14px;color:#a8a296}
.auth-access strong{color:#f2eee5}
.auth-access a{color:#f2eee5;font-weight:600;text-decoration:underline;text-decoration-color:#f5c431;text-underline-offset:.2em}
.auth-access a:hover{color:#f5c431}

/* ---------- Login: Formularkarte ---------- */
.p-auth__panel{grid-template-columns:minmax(0,1fr);grid-template-rows:1fr auto;gap:32px}
.p-auth__card{align-self:center;padding:36px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);box-shadow:var(--s-shadow-2)}
.p-auth__card .p-kicker{margin-bottom:12px}
.p-auth__card>.auth-intro{margin:10px 0 24px;font-size:15.5px;line-height:1.55}
#login-error{margin-bottom:18px}
#login-form{display:grid;grid-template-columns:minmax(0,1fr);gap:18px}
#login-form .p-field{grid-template-columns:minmax(0,1fr)}
.input-shell{position:relative;display:flex;align-items:center;gap:10px;min-height:52px;padding:0 6px 0 14px;border:1px solid var(--s-line-strong);border-radius:14px;background:var(--s-surface);transition:border-color var(--s-fast),box-shadow var(--s-fast)}
.input-shell:hover{border-color:var(--s-muted)}
.input-shell:focus-within{border-color:var(--s-ink);box-shadow:0 0 0 4px var(--s-signal-soft)}
.input-shell>.s-ic{color:var(--s-faint);transition:color var(--s-fast)}
.input-shell:focus-within>.s-ic{color:var(--s-signal-ink)}
.input-shell input{flex:1;width:100%;min-width:0;min-height:50px;padding:0 8px 0 0;border:0;background:transparent;color:var(--s-ink);font:400 16px/1.4 var(--s-sans);outline:none;box-shadow:none}
.input-shell input:focus,.input-shell input:focus-visible{outline:none;box-shadow:none}
.password-toggle{flex:none;min-height:44px;min-width:44px;padding:0 12px;border:0;border-radius:10px;background:var(--s-neutral-soft);color:var(--s-ink-2);font:600 13.5px/1 var(--s-sans);cursor:pointer;transition:background var(--s-fast),color var(--s-fast)}
.password-toggle:hover{background:var(--s-line);color:var(--s-ink)}
.password-toggle[aria-pressed=true]{background:var(--s-signal-soft);color:var(--s-signal-ink)}
.button-block{width:100%}
#login-form .button{min-height:52px;margin-top:4px;font-size:15.5px}
#login-form button:disabled{opacity:.6;cursor:progress}
.p-auth__card .fine-print{margin:20px 0 0;font-size:13.5px;line-height:1.6;color:var(--s-muted)}
.p-auth__card a:not(.auth-secondary-link){color:var(--s-ink);text-decoration:underline;text-decoration-color:var(--s-signal);text-underline-offset:.18em}
.login-recovery{margin-top:14px;border:1px solid var(--s-line);border-radius:14px;background:var(--s-surface-2)}
.login-recovery summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:0 16px;cursor:pointer;list-style:none;font:600 14px/1.3 var(--s-sans);color:var(--s-ink)}
.login-recovery summary::-webkit-details-marker{display:none}
.login-recovery summary::after{content:"+";font:500 18px/1 var(--s-mono);color:var(--s-muted);transition:transform var(--s-med) var(--s-spring)}
.login-recovery[open] summary::after{transform:rotate(45deg)}
.login-recovery p{margin:0 16px 14px;font-size:13.5px;line-height:1.6;color:var(--s-ink-2)}
.auth-help{display:grid;margin-top:22px;border-top:1px solid var(--s-line)}
.auth-secondary-link{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;border-bottom:1px solid var(--s-line);color:var(--s-ink);font-size:14.5px;font-weight:550;text-decoration:none;transition:color var(--s-fast)}
.auth-secondary-link .s-ic{width:16px;height:16px;color:var(--s-muted);transition:transform var(--s-med) var(--s-spring),color var(--s-fast)}
.auth-secondary-link:hover{color:var(--s-signal-ink)}
.auth-secondary-link:hover .s-ic{transform:translateX(3px);color:var(--s-signal-ink)}
.auth-note{display:flex;align-items:flex-start;gap:10px;margin:20px 0 0;font-size:13px;line-height:1.55;color:var(--s-muted)}
.auth-note .s-ic{width:16px;height:16px;margin-top:1px;color:var(--s-signal-ink)}
.auth-footer{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;width:min(440px,100%);font-size:13px;color:var(--s-muted)}
.auth-footer a{display:inline-flex;align-items:center;min-height:44px;color:var(--s-ink-2);text-decoration:none}
.auth-footer a:hover{color:var(--s-signal-ink)}
.js .p-auth__card{animation:p-rise .8s .1s var(--s-ease-out) backwards}
.js .auth-story>*{animation:p-rise .9s var(--s-ease-out) backwards}
.js .auth-story>:nth-child(2){animation-delay:.06s}.js .auth-story>:nth-child(3){animation-delay:.12s}.js .auth-story>:nth-child(5){animation-delay:.2s}

@media (min-width:861px){.p-auth__brand{min-height:100dvh;height:auto;align-self:stretch}}
@media (max-width:860px){
  .p-auth{min-height:0}
  .p-auth__brand{gap:28px;padding:20px 20px 36px}
  .p-auth__brand h1{font-size:clamp(32px,8.6vw,42px)}
  .p-auth__brand .auth-lead{margin-top:14px;font-size:15.5px}
  .p-auth__brand .p-pulse{max-width:240px;height:44px;margin:18px 0 0}
  .auth-points,.p-auth__brand .auth-access{display:none}
  .p-auth__panel{padding:28px 16px 32px}
}
@media (max-width:480px){
  .auth-back span{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
  .auth-back{width:44px;padding:0;justify-content:center}
  .p-auth__card{padding:26px 20px;border-radius:var(--s-r-lg)}
  .p-auth__card h2{font-size:28px}
}

/* ---------- 404 ---------- */
.p-error__head{padding:88px 0 96px}
.p-error__head .p-pagehead__grid{align-items:center}
.p-error__signal{display:grid;justify-items:start;gap:4px;padding:28px 32px 26px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);color:var(--s-ink);box-shadow:0 24px 48px -24px rgb(22 25 29/.35);transform:rotate(1.4deg)}
.p-error__code{margin:0;font:800 clamp(96px,13vw,184px)/.9 var(--s-display);letter-spacing:-.07em;color:var(--s-ink)}
.p-error__pulse{max-width:none;height:auto;aspect-ratio:340/60;margin:10px 0 6px}
.p-error__pulse path{stroke:var(--s-ink)}
.p-error__pulse path{animation:p-draw 2.2s .3s var(--s-ease-out) forwards}
.p-error__pulse .p-error__gap{stroke:var(--s-crit);stroke-dasharray:4 9;stroke-dashoffset:0;opacity:0;animation:p-fade .6s 1.8s ease forwards}
@keyframes p-fade{to{opacity:.9}}
.p-error__trace{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;font:500 13px/1.3 var(--s-mono);color:var(--s-ink-2)}
.p-error__trace span{padding:4px 8px;border-radius:6px;background:var(--s-neutral-soft);color:var(--s-ink)}
.p-error__trace b{padding:3px 8px;border-radius:999px;background:var(--s-crit-soft);font-weight:600;color:var(--s-crit-ink)}
.p-error .p-card__meta{display:inline-flex;align-items:center;gap:6px;color:var(--s-ink);font:600 14px/1.3 var(--s-sans);letter-spacing:0}
.p-error .p-card__meta .s-ic{width:16px;height:16px;transition:transform var(--s-med) var(--s-spring)}
.p-error a.p-card:hover .p-card__meta .s-ic{transform:translateX(4px)}
@media (max-width:860px){.p-error__head{padding:48px 0 56px}.p-error__signal{padding:22px 22px 20px;transform:none}}
@media (prefers-reduced-motion:reduce){.p-auth__brand h1 em{animation:none}.p-error__pulse path{animation:none;stroke-dashoffset:0}.p-error__pulse .p-error__gap{animation:none;opacity:.9}}
/* Dunkelmodus: Flächen sauber voneinander absetzen */
html[data-theme=dark] .p-auth__panel{border-left:1px solid var(--s-line);background:var(--s-bg-sunken)}
html[data-theme=dark] .p-error__head{border-bottom:1px solid var(--s-line)}
@media (max-width:860px){html[data-theme=dark] .p-auth__panel{border-left:0;border-top:1px solid var(--s-line)}}

/* ===== guides.css ===== */
/* Gruppe „guides“: Ratgeber-Übersicht, Ratgeber-Artikel und Website-Kompass (Claude, 2026-10). */

/* Seitenkopf: Themenliste / Zusagen rechts */
.g-topics,.g-promises{margin:0;padding:22px;list-style:none;gap:0}
.g-topics li,.g-promises li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;align-items:start;padding:14px 0;line-height:1.5}
.g-topics li+li,.g-promises li+li{border-top:1px solid var(--s-line)}
.g-topics li:first-child,.g-promises li:first-child{padding-top:0}.g-topics li:last-child,.g-promises li:last-child{padding-bottom:0}
.g-topics .s-ic,.g-promises .s-ic{width:36px;height:36px;padding:8px;border-radius:10px;background:var(--s-signal-soft);color:var(--s-signal-ink)}
.g-topics strong{display:block;margin-bottom:2px;font:700 15px/1.3 var(--s-display);color:var(--s-ink)}
.g-promises span{padding-top:7px;color:var(--s-ink-2)}

/* Kartenfuß mit Leselink */
.g-cardfoot{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--s-line);padding-top:16px;margin-top:auto}
.g-more{display:inline-flex;align-items:center;gap:6px;font:600 13.5px/1 var(--s-sans);letter-spacing:0;color:var(--s-ink);transition:gap var(--s-med) var(--s-spring)}
.g-more .s-ic{width:16px;height:16px;color:var(--s-signal-ink)}
a.p-card:hover .g-more{gap:10px}
.p-card>.p-kicker{margin:4px 0 -4px}
.g-guides .p-card h2{font:720 22px/1.22 var(--s-display);letter-spacing:-.025em}
.g-guides .p-card{padding:30px}
.g-guides .p-card>p:not(.p-kicker){flex:1}

/* Ratgeber-Artikel */
.g-articlehead h1{font-size:clamp(34px,4.2vw,56px);line-height:1.05}
.g-articlehead h1 em{display:block}
.g-byline{gap:0;margin:0;padding:6px 22px}
.g-byline div{display:grid;grid-template-columns:84px minmax(0,1fr);gap:12px;padding:12px 0;align-items:baseline}
.g-byline div+div{border-top:1px solid var(--s-line)}
.g-byline dt{font:600 11.5px/1.3 var(--s-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--s-ink-2)}
.g-byline dd{margin:0;color:var(--s-ink);font-size:14.5px}
.g-docsection{padding:88px 0 112px}
.g-toc{counter-reset:g-toc}
.g-toc a{counter-increment:g-toc;display:grid;grid-template-columns:26px minmax(0,1fr);gap:4px;line-height:1.4}
.g-toc a::before{content:counter(g-toc,decimal-leading-zero);font:600 11.5px/1.75 var(--s-mono);color:var(--s-faint)}
.g-toc a:hover::before{color:var(--s-signal-ink)}
.p-prose .g-numbered{display:grid;gap:10px;padding:0;list-style:none;counter-reset:g-n}
.p-prose .g-numbered>li{counter-increment:g-n;position:relative;margin:0;padding:14px 18px 14px 58px;border:1px solid var(--s-line);border-radius:14px;background:var(--s-surface);line-height:1.6}
.p-prose .g-numbered>li::before{content:counter(g-n,decimal-leading-zero);position:absolute;left:16px;top:15px;display:grid;place-items:center;width:28px;height:24px;border-radius:7px;background:var(--s-signal-soft);color:var(--s-signal-ink);font:650 12px/1 var(--s-mono)}
.p-prose .g-template{margin-block:1.6em;padding:22px 24px}
.g-template strong{font:650 16.5px/1.4 var(--s-display);color:var(--s-ink)}
.g-template .p-checklist{margin-top:12px;gap:8px}
.g-template .p-checklist li{margin:0;font-size:15.5px;color:var(--s-ink-2)}
.g-template .p-checklist li::marker{content:none}
.p-prose .g-table{margin-block:1.6em}
.g-table td:first-child{font:600 13.5px/1.6 var(--s-mono);color:var(--s-ink);white-space:nowrap}
.p-prose .g-source{font-weight:600;white-space:nowrap}
.g-related .p-card h3{font-size:19px}
.g-cta{margin-top:56px}
.p-sechead .text-link{font-size:15px}

/* Website-Kompass */
.g-compass{padding-top:88px}
.g-compass .p-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px 56px}
.g-inputs__head h2,.g-plan h2{font:800 clamp(28px,3vw,38px)/1.06 var(--s-display);letter-spacing:-.04em}
.g-inputs__head>p:last-child{margin:14px 0 0;max-width:34em;color:var(--s-ink-2);font-size:16px;line-height:1.6}
.g-progress{display:flex;align-items:center;gap:14px;margin:28px 0 16px}
.g-progress p{margin:0;font:600 12.5px/1.2 var(--s-mono);letter-spacing:.04em;color:var(--s-muted)}
.g-meter{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;width:132px;flex:none}
.g-meter i{height:6px;border-radius:99px;background:var(--s-line-strong);transition:background var(--s-med),transform var(--s-med) var(--s-spring)}
.g-inputs:has(#compass-impact:valid) .g-meter i:nth-child(1),.g-inputs:has(#compass-changes:valid) .g-meter i:nth-child(2),.g-inputs:has(#compass-owner:valid) .g-meter i:nth-child(3),.g-inputs:has(#compass-backup:valid) .g-meter i:nth-child(4),.g-inputs:has(#compass-updates:valid) .g-meter i:nth-child(5),.g-inputs:has(#compass-monitor:valid) .g-meter i:nth-child(6){background:var(--s-signal);transform:scaleY(1.35)}
.g-questions{gap:12px}
.p-form .g-q{display:block;padding:18px 20px 20px;border:1px solid var(--s-line);border-radius:18px;background:var(--s-surface);transition:border-color var(--s-fast),box-shadow var(--s-med)}
.g-q:hover{border-color:var(--s-line-strong)}
.g-q:focus-within{border-color:var(--s-ink);box-shadow:0 0 0 4px var(--s-signal-soft)}
.g-q legend{float:left;display:flex;align-items:flex-start;gap:12px;width:100%;margin:0 0 14px;padding:0;font:620 16px/1.4 var(--s-display);letter-spacing:-.01em;color:var(--s-ink)}
.g-q legend span{display:grid;place-items:center;flex:none;width:30px;height:24px;border-radius:7px;background:var(--s-neutral-soft);color:var(--s-muted);font:650 12px/1 var(--s-mono);letter-spacing:0;transition:background var(--s-med),color var(--s-med)}
.g-q:has(select:valid) legend span{background:var(--s-signal);color:#16191d}
.p-form .g-q select{clear:both;font-size:15px;background-color:var(--s-surface-2)}
.p-form .g-q select:invalid{color:var(--s-muted)}
.g-q option{color:var(--s-ink);background:var(--s-surface)}
.p-form .g-q select:focus{box-shadow:none}
.g-save{display:grid;gap:12px;margin-top:20px}
.g-save .p-consent strong{color:var(--s-ink)}
.g-save__row{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.g-save__row p{margin:0}
.g-save__row .button .s-ic{width:16px;height:16px}

.g-plan{padding:30px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);box-shadow:var(--s-shadow-2)}
.g-plan [hidden]{display:none!important}
.g-plan__head{display:flex;align-items:flex-start;gap:16px}
.g-plan__head .p-kicker{margin-bottom:10px}
.g-plan__empty{margin:22px 0 0;color:var(--s-ink-2);font-size:15.5px;line-height:1.6}
.g-ghost{display:grid;gap:10px;margin:22px 0 0;padding:0;list-style:none}
.g-ghost li{display:grid;grid-template-columns:36px 1fr;gap:8px 14px;padding:18px;border:1px dashed var(--s-line-strong);border-radius:16px}
.g-ghost span{grid-row:1/3;display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:var(--s-neutral-soft);color:var(--s-faint);font:650 12px/1 var(--s-mono)}
.g-ghost i{height:10px;border-radius:99px;background:linear-gradient(90deg,var(--s-neutral-soft) 30%,var(--s-line) 50%,var(--s-neutral-soft) 70%) 0 0/300% 100%;animation:g-shimmer 2.4s ease-in-out infinite}
.g-ghost i+i{width:62%;height:8px;animation-delay:.2s}
.g-plan:has(#compass-placeholder[hidden]) .g-ghost{display:none}
@keyframes g-shimmer{from{background-position:100% 0}to{background-position:0 0}}
.g-plan__body{display:grid;gap:16px;margin-top:22px}
.g-plan__body:not([hidden])>*{animation:p-rise .7s var(--s-ease-out) backwards}
.g-plan__body>:nth-child(2){animation-delay:.06s}.g-plan__body>:nth-child(3){animation-delay:.12s}.g-plan__body>:nth-child(n+4){animation-delay:.18s}
.g-context{margin:0;padding:14px 16px;border-left:3px solid var(--s-signal);border-radius:4px 12px 12px 4px;background:var(--s-signal-soft);color:var(--s-ink);font-size:14.5px;line-height:1.55}
.g-reco{margin:0;color:var(--s-ink);font-size:16px;line-height:1.62}
.g-actions{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.g-actions li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:6px 14px;padding:18px;border:1px solid var(--s-line);border-radius:16px;background:var(--s-surface-2)}
.g-actions li>*{grid-column:2;margin:0}
.g-actions .compass-step-number{grid-column:1;grid-row:1/span 5;display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--s-ink);color:var(--s-bg);font:650 12.5px/1 var(--s-mono)}
.g-actions li:first-child .compass-step-number{background:var(--s-signal);color:#16191d}
.g-actions h3{font:660 17px/1.3 var(--s-display);letter-spacing:-.015em}
.g-actions p{font-size:14.5px;line-height:1.58;color:var(--s-ink-2)}
.g-actions .compass-reason{font-size:13.5px;color:var(--s-muted)}
.g-actions .compass-done{margin-top:4px;padding:10px 12px;border-radius:10px;background:var(--s-surface);border:1px solid var(--s-line);font-size:13.5px}
.g-actions .compass-done strong{color:var(--s-signal-ink)}
.g-actions .text-link{justify-self:start;margin-top:4px;font-size:13.5px}
.g-answers{border:1px solid var(--s-line);border-radius:14px;background:var(--s-surface-2)}
.g-answers summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 16px;font:600 14px/1.35 var(--s-sans);cursor:pointer;list-style:none}
.g-answers summary::-webkit-details-marker{display:none}
.g-answers summary::after{content:"";flex:none;width:8px;height:8px;margin-top:-4px;border-right:2px solid var(--s-muted);border-bottom:2px solid var(--s-muted);transform:rotate(45deg);transition:transform var(--s-med)}
.g-answers[open] summary::after{transform:rotate(-135deg);margin-top:4px}
.g-answers dl{display:grid;gap:4px;margin:0;padding:0 16px 14px}
.g-answers dt{margin-top:8px;font-size:12.5px;color:var(--s-muted)}
.g-answers dd{margin:0;font-size:14px;color:var(--s-ink)}
.g-review{margin:0}
.g-plan__actions{display:flex;flex-wrap:wrap;gap:10px}
.g-plan__actions .s-ic{width:16px;height:16px}
.g-plan__body>.p-help{margin:0}
.g-noscript{margin-top:24px}
.g-bridge{margin-top:16px;padding:20px 22px}
.g-bridge p{margin:0}
.g-bridge a{color:var(--s-ink);font-weight:600;text-decoration-color:var(--s-signal);text-underline-offset:.18em}

@media (max-width:1040px){.g-compass .p-split{grid-template-columns:minmax(0,1fr) minmax(0,.95fr);gap:40px}.p-doc .g-toc{display:grid}}
@media (max-width:860px){.g-compass .p-split{grid-template-columns:1fr}.g-docsection{padding:56px 0 80px}.g-compass{padding-top:64px}}
@media (max-width:640px){.g-guides .p-card{padding:24px}.g-plan{padding:22px;border-radius:var(--s-r-lg)}.g-actions li{grid-template-columns:1fr;padding:16px}.g-actions li>*,.g-actions .compass-step-number{grid-column:1;grid-row:auto}.g-actions .compass-step-number{width:30px;height:30px}.p-prose .g-numbered>li{padding:14px 16px 14px 52px}.g-table table{min-width:560px}.g-progress{flex-wrap:wrap;gap:10px}.g-byline{padding:4px 18px}.g-topics,.g-promises{padding:18px}.p-form .g-q{padding:16px}.g-cta{margin-top:40px}}
@media print{
  .no-print{display:none!important}
  .p-pagehead{padding:0 0 18px;background:none;color:#000}
  .p-pagehead::before,.p-pagehead::after,.g-promises,.g-topics{display:none}
  .p-pagehead h1,.p-pagehead h1 em,.p-pagehead__lead,.g-byline dd,.g-byline dt{color:#000}
  .g-byline{border-color:#ccc}
  .p-section{padding:16px 0}
  .p-split,.p-doc{display:block}
  .p-sticky{position:static}
  .g-plan{padding:0;border:0;box-shadow:none}
  .g-plan__body>*{animation:none}
  .g-actions li{break-inside:avoid}
}

/* Kicker gegen die allgemeinen Absatzregeln von .p-sechead p, .p-card p und .p-cta p absichern (nur diese Gruppe) */
.g-sechead .p-kicker,.g-cta .p-kicker,.p-card>.p-kicker,.g-inputs__head .p-kicker,.g-plan .p-kicker{margin:0 0 14px;max-width:none;font:600 12px/1.2 var(--s-mono);letter-spacing:.08em;color:var(--s-signal-ink)}
.p-card>.p-kicker{margin:4px 0 -2px}
.g-cta .p-kicker{margin-top:22px;color:#f5c431}
.g-cta--flush{margin-top:0}

/* ===== legal.css ===== */
/* Gruppe „legal“ (Claude, 2026-10): Rechtstexte (legal, agb, avv, unterauftragnehmer) und Musterbericht.
   Nur Ergänzungen zu dw-public-pages.css; Signal-Tokens, hell/dunkel, mobil ab 360 px, sauberer Druck. */

/* ---------- Rechtstexte nach W4: Inhaltsliste links, Text rechts (Text selbst wortgleich) ---------- */
.p-section--doc{padding:72px 0 120px}
.p-section--doc .p-doc{grid-template-columns:260px minmax(0,720px);gap:96px}
.p-doc__main .p-crumbs{margin-bottom:24px}
.p-doc__head{display:flex;flex-direction:column;gap:16px;margin-bottom:48px;padding-bottom:32px;border-bottom:1.5px solid var(--s-ink)}
.p-doc__head .p-kicker{margin:0}
.p-doc__head h1{font:800 clamp(38px,4.6vw,64px)/1 var(--s-display);letter-spacing:-.035em;hyphens:manual}
.p-doc__lead{margin:0;max-width:44em;font-size:18px;line-height:1.55;color:var(--s-ink-2)}

/* ---------- Inhaltsverzeichnis: Rechtsdokumente, Abschnitte, PDF ---------- */
.p-toc{max-height:calc(100dvh - 120px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.p-toc .p-toc__docs a{padding:10px 14px;border:0;border-radius:8px;font-size:17px;font-weight:500;color:var(--s-ink)}
.p-toc .p-toc__docs a:hover{background:var(--s-bg-sunken)}
.p-toc .p-toc__docs a[aria-current]{background:color-mix(in srgb,var(--s-bg-sunken) 60%,var(--s-line-strong));font-weight:700}
.p-print{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-top:20px;padding:0 14px;border:0;background:none;color:var(--s-ink-2);font:500 15px/1.2 var(--s-sans);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.p-print:hover{color:var(--s-ink)}
.p-print .s-ic{width:16px;height:16px}
.p-toc nav{display:grid;gap:2px}
.p-toc nav+nav{margin-top:28px}
.p-toc a{display:flex;gap:10px;align-items:baseline;line-height:1.4}
.p-toc a span{flex:none;min-width:2.2em;font:600 12px/1.4 var(--s-mono);color:var(--s-faint);transition:color var(--s-fast)}
.p-toc a:hover span,.p-toc a[aria-current] span{color:var(--s-signal-ink)}
.p-toc a.p-toc__sub{padding-left:calc(12px + 2.2em + 10px);font-size:13.5px;color:var(--s-muted)}
.p-toc a[aria-current]{font-weight:600}

/* ---------- Fließtext der Rechtstexte (17 px, Zeilenhöhe 1,65, max. 68 Zeichen) ---------- */
.p-legal{max-width:68ch;font-size:17px;line-height:1.65}
.p-legal section:target>h2:first-child{box-shadow:inset 0 -.32em 0 var(--s-signal-soft)}
.p-legal p{margin:0}
.p-legal section>*+*{margin-top:1em}
.p-legal section>h3{margin-top:2.1em}
.p-legal section>.p-kicker{margin:0}
.p-legal section>.p-kicker+h2{margin-top:10px}
.p-legal section>h2:first-child+*{margin-top:1.2em}
.p-legal h2{font:700 clamp(24px,2.4vw,28px)/1.2 var(--s-display);letter-spacing:-.02em;overflow-wrap:break-word}
.p-legal code{overflow-wrap:anywhere}
.p-legal-id{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.p-legal .p-legal-id p{margin:0;padding:20px 22px;border:1px solid var(--s-line);border-radius:16px;background:var(--s-surface);line-height:1.7}
.p-legal-parties{padding:20px 22px;border:1px solid var(--s-line);border-left:3px solid var(--s-signal);border-radius:16px;background:var(--s-surface);scroll-margin-top:96px}
.p-legal-stand{margin-top:3em!important;padding-top:20px;border-top:1px solid var(--s-line);font:500 12.5px/1.4 var(--s-mono);letter-spacing:.04em;color:var(--s-muted)}

/* Nummerierte Absätze: (1) in AGB, 01 als Hauptziffer im AVV */
.p-clauses{display:grid;gap:14px;margin:0;padding:0;list-style:none;counter-reset:p-clause}
.p-prose .p-clauses li+li{margin-top:0}
.p-clauses>li{position:relative;padding-left:46px;counter-increment:p-clause;scroll-margin-top:96px}
.p-clauses>li::before{content:"(" counter(p-clause) ")";position:absolute;left:0;top:.2em;min-width:34px;font:600 13px/1.5 var(--s-mono);color:var(--s-muted)}
.p-clauses--main{gap:0;margin-top:1.6em!important;border-top:1px solid var(--s-line)}
.p-clauses--main>li{padding:18px 0 18px 58px;border-bottom:1px solid var(--s-line)}
.p-clauses--main>li::before{content:counter(p-clause,decimal-leading-zero);top:19px;color:var(--s-signal-ink);font-size:13.5px}
.p-clauses--main>li:target{background:linear-gradient(90deg,var(--s-signal-soft),transparent 70%)}
.p-legal-toms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:14px 0 0;padding:0;list-style:none}
.p-prose .p-legal-toms li+li{margin-top:0}
.p-legal-toms li{position:relative;padding:12px 14px 12px 36px;border:1px solid var(--s-line);border-radius:12px;background:var(--s-surface);font-size:15px;line-height:1.5}
.p-legal-toms li::before{content:"";position:absolute;left:14px;top:19px;width:8px;height:8px;border-radius:50%;background:var(--s-signal);box-shadow:0 0 0 4px var(--s-signal-soft)}
.p-legal .p-table-wrap{scroll-margin-top:96px}
.p-legal .p-table td:first-child{color:var(--s-ink);font-weight:550}
.p-legal .p-callout{scroll-margin-top:96px}

/* ---------- Musterbericht: dunkler Kopf, darüber ein druckbares Dokument ---------- */
.p-pagehead--report{padding:48px 0 152px}
.p-pagehead--report .p-pagehead__lead{max-width:40em}
.p-pagehead .button[hidden]{display:none}
.p-report-stage{position:relative;z-index:1;margin-top:-104px}
.p-paper{max-width:1040px;margin:0 auto;padding:clamp(22px,4.6vw,60px);border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);box-shadow:var(--s-shadow-3)}
html[data-theme=dark] .p-paper{border-color:var(--s-line-strong)}
.p-paper__bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:20px;margin-bottom:32px;border-bottom:1px dashed var(--s-line-strong)}
.p-paper__brand{display:inline-flex;align-items:center;gap:10px;font:700 15px/1 var(--s-display);letter-spacing:-.02em;color:var(--s-ink)}
.p-paper__brand .p-brand__mark{width:28px;height:28px}
.p-paper__brand .p-brand__mark .s-ic{width:17px;height:17px}
.p-paper__stamp{padding:5px 10px;border:1.5px solid var(--s-signal-ink);border-radius:6px;color:var(--s-signal-ink);font:700 12px/1 var(--s-mono);letter-spacing:.14em;text-transform:uppercase;transform:rotate(-3deg)}
.p-paper__head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 32px;align-items:end}
.p-paper__head h2{font:800 clamp(30px,4vw,46px)/1.05 var(--s-display);letter-spacing:-.04em;overflow-wrap:break-word}
.p-paper__head .p-kicker{margin-bottom:10px}
.p-paper__sub{margin:10px 0 0;color:var(--s-ink-2);font-size:16.5px}
.p-verdict{display:grid;gap:6px;min-width:220px;padding:16px 18px;border-radius:16px;background:var(--s-warn-soft);border:1px solid color-mix(in srgb,var(--s-warn) 30%,transparent)}
.p-verdict span{font:600 12px/1 var(--s-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--s-warn-ink)}
.p-verdict strong{display:flex;align-items:center;gap:8px;font:700 19px/1.2 var(--s-display);letter-spacing:-.02em;color:var(--s-ink)}
.p-verdict strong::before{content:"";flex:none;width:9px;height:9px;border-radius:50%;background:var(--s-warn);box-shadow:0 0 0 4px color-mix(in srgb,var(--s-warn) 22%,transparent)}
.p-paper__meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:32px 0 0;border:1px solid var(--s-line);border-radius:16px;background:var(--s-surface-2)}
.p-paper__meta div{padding:14px 18px;min-width:0}
.p-paper__meta div+div{border-left:1px solid var(--s-line)}
.p-paper__meta dt{font:600 12px/1.2 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--s-muted)}
.p-paper__meta dd{margin:6px 0 0;font-size:14.5px;font-weight:550;color:var(--s-ink);overflow-wrap:anywhere}
.p-paper__meta div:first-child dd{font-family:var(--s-mono);font-size:13.5px}

.p-rsec{margin-top:56px;scroll-margin-top:96px}
.p-rsec__head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:start;margin-bottom:22px}
.p-rsec__head>span{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--s-ink);color:var(--s-bg);font:700 14px/1 var(--s-mono)}
.p-rsec__head .p-kicker{margin:2px 0 6px}
.p-rsec__head h3{font:700 clamp(21px,2.3vw,27px)/1.18 var(--s-display);letter-spacing:-.028em;scroll-margin-top:96px}
.p-rsum{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:24px 40px;align-items:center}
.p-rsum>p{margin:0;font-size:18px;line-height:1.65;color:var(--s-ink-2)}
.p-rsum .p-facts{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.p-fact{position:relative;overflow:hidden}
.p-fact--warn,.p-fact--info,.p-fact--ok{padding-top:22px}
.p-fact--warn::before,.p-fact--info::before,.p-fact--ok::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:var(--s-ok)}
.p-fact--warn::before{background:var(--s-warn)}.p-fact--warn b{color:var(--s-warn-ink)}
.p-fact--info::before{background:var(--s-info)}.p-fact--info b{color:var(--s-info-ink)}
.p-fact--ok b{color:var(--s-ok-ink)}
.p-rsum .p-fact b{font-size:34px}

.p-findings{display:grid;gap:14px}
.p-finding{display:grid;grid-template-columns:150px minmax(0,1fr);border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);overflow:hidden}
.p-finding__sev{display:flex;flex-direction:column;gap:12px;padding:22px;background:var(--s-warn-soft);border-right:1px solid var(--s-line)}
.p-finding__sev span{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--s-warn);color:#16191d;font:700 16px/1 var(--s-mono)}
.p-finding__sev strong{font:650 15px/1.2 var(--s-display);color:var(--s-warn-ink)}
.p-finding--info .p-finding__sev{background:var(--s-info-soft)}
.p-finding--info .p-finding__sev span{background:var(--s-info);color:var(--s-on-ink)}
.p-finding--info .p-finding__sev strong{color:var(--s-info-ink)}
.p-finding__body{display:grid;gap:16px;align-content:start;padding:22px 24px}
.p-finding__body h4{font:720 20px/1.25 var(--s-display);letter-spacing:-.02em}
.p-finding__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.p-finding__grid p{margin:0;padding:14px 16px;border-radius:12px;background:var(--s-surface-2);border:1px solid var(--s-line);font-size:14.5px;line-height:1.6;color:var(--s-ink-2)}
.p-finding__grid strong{display:block;margin-bottom:6px;font:600 12px/1.2 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--s-muted)}
.p-finding__grid p:last-child{background:var(--s-signal-soft);border-color:transparent}
.p-finding__grid p:last-child strong{color:var(--s-signal-ink)}
.p-finding .text-link{justify-self:start;font-size:14px}

.p-evidence caption{caption-side:top;padding:12px 16px;border-bottom:1px solid var(--s-line);font:600 12px/1.3 var(--s-mono);letter-spacing:.04em;color:var(--s-muted);text-align:left}
.p-evidence th[scope=row]{padding:14px 16px;border-bottom:1px solid var(--s-line);font:600 13px/1.5 var(--s-mono);color:var(--s-ink);white-space:nowrap;text-align:left;vertical-align:top}
.p-evidence th[scope=row]::before{content:"";display:inline-block;width:8px;height:8px;margin:0 10px 1px 0;border-radius:50%;background:var(--s-ok)}
.p-evidence tr.is-warn th[scope=row]::before{background:var(--s-warn)}
.p-evidence tr.is-info th[scope=row]::before{background:var(--s-info)}
.p-evidence tr:last-child th{border-bottom:0}
.p-evidence td:nth-child(3){color:var(--s-ink);font-weight:550;white-space:nowrap}
.p-evidence tbody tr{scroll-margin-top:110px}
.p-evidence tbody tr:target{background:var(--s-warn-soft)}
.p-evidence tbody tr.is-info:target{background:var(--s-info-soft)}
.p-evidence-note{margin-top:14px}
.p-evidence-note code{overflow-wrap:anywhere}

.p-limits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.p-limits article{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;padding:18px 20px;border:1px dashed var(--s-line-strong);border-radius:16px}
.p-limits .s-ic{grid-row:1/3;width:36px;height:36px;padding:8px;border-radius:10px;background:var(--s-neutral-soft);color:var(--s-ink-2)}
.p-limits strong{font:650 16px/1.3 var(--s-display);color:var(--s-ink)}
.p-limits p{margin:0;font-size:14.5px;line-height:1.6;color:var(--s-ink-2)}

.p-paper__foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 24px;margin-top:56px;padding-top:20px;border-top:1px dashed var(--s-line-strong);font:500 12.5px/1.5 var(--s-mono);color:var(--s-muted)}
.p-paper__foot p{margin:0}
.p-paper__foot strong{color:var(--s-ink)}
.p-report-cta{padding:88px 0 112px}

/* ---------- Responsiv ---------- */
@media (max-width:1040px){
  .p-section--doc .p-doc{grid-template-columns:1fr;gap:28px}
  .p-toc .p-toc__docs{display:flex;flex-wrap:wrap;gap:6px}
  .p-toc .p-toc__docs p{flex-basis:100%}
  .p-toc .p-toc__docs a{padding:8px 12px;font-size:15px;border:1.5px solid var(--s-line-strong)}
  .p-toc .p-toc__docs a[aria-current]{border-color:var(--s-ink)}
  .p-print{margin-top:8px;padding:0}
  .p-toc{max-height:none;overflow:visible;padding:18px;border:1px solid var(--s-line);border-radius:18px;background:var(--s-surface);align-items:start}
  .p-toc nav+nav{margin-top:0}
  .p-toc a:hover,.p-toc a[aria-current]{background:var(--s-surface-2)}
}
@media (max-width:860px){
  .p-paper__head,.p-rsum{grid-template-columns:1fr}
  .p-verdict{justify-self:start}
  .p-paper__meta{grid-template-columns:repeat(2,minmax(0,1fr))}
  .p-paper__meta div:nth-child(3){border-left:0}
  .p-paper__meta div:nth-child(n+3){border-top:1px solid var(--s-line)}
  .p-finding{grid-template-columns:1fr}
  .p-finding__sev{flex-direction:row;align-items:center;padding:14px 20px;border-right:0;border-bottom:1px solid var(--s-line)}
  .p-finding__sev span{width:32px;height:32px;font-size:14px}
  .p-finding__grid{grid-template-columns:1fr}
  .p-legal-toms{grid-template-columns:1fr}
}
@media (max-width:640px){
  .p-pagehead--legal{padding:32px 0 40px}
  .p-pagehead--legal .p-pagehead__lead{font-size:16px}
  .p-section--doc{padding:28px 0 72px}
  .p-doc__head{margin-bottom:32px;padding-bottom:24px}
  .p-legal{font-size:16px}
  .p-doc{gap:36px}
  .p-toc{padding:14px}
  .p-toc a{padding:7px 10px;font-size:14px}
  .p-legal-id{grid-template-columns:1fr}
  .p-clauses>li{padding-left:40px}
  .p-clauses--main>li{padding-left:44px}
  .p-pagehead--report{padding:36px 0 112px}
  .p-report-stage{margin-top:-80px}
  .p-report-stage .p-wrap{width:calc(100% - 24px)}
  .p-paper{border-radius:var(--s-r-lg)}
  .p-paper__bar{margin-bottom:24px}
  .p-rsec{margin-top:44px}
  .p-rsec__head{gap:14px}
  .p-rsec__head>span{width:38px;height:38px;font-size:13px}
  .p-rsum>p{font-size:16.5px}
  .p-rsum .p-facts{gap:8px}
  .p-rsum .p-fact{padding:18px 12px 14px}
  .p-rsum .p-fact b{font-size:28px}
  .p-limits{grid-template-columns:1fr}
  /* Belegtabelle wird zur Kartenliste */
  .p-evidence,.p-evidence tbody,.p-evidence tr,.p-evidence td,.p-evidence th[scope=row]{display:block}
  .p-evidence thead{display:none}
  .p-evidence caption{display:block}
  .p-evidence tbody tr{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;padding:14px 16px;border-bottom:1px solid var(--s-line)}
  .p-evidence tbody tr:last-child{border-bottom:0}
  .p-evidence th[scope=row],.p-evidence td{padding:0;border:0}
  .p-evidence td:nth-child(2){align-self:center;font:600 12px/1.3 var(--s-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--s-muted)}
  .p-evidence td:nth-child(3),.p-evidence td:nth-child(4){grid-column:1/-1;white-space:normal}
  .p-evidence td:nth-child(3){margin-top:4px}
  .p-paper__foot{flex-direction:column}
  .p-report-cta{padding:56px 0 72px}
}

/* ---------- Druck: Musterbericht und Rechtstexte ---------- */
@media print{
  @page{size:A4;margin:14mm 14mm 16mm}
  body[data-page=beispielbericht],body:has(.p-legal){--s-bg:#fff;--s-bg-sunken:#fff;--s-surface:#fff;--s-surface-2:#f8f4ec;--s-ink:#16191d;--s-ink-2:#3a3f45;--s-muted:#62666b;--s-faint:#66696e;--s-line:#dfd7c6;--s-line-strong:#b9ae97;--s-neutral-soft:#e8e3d8;--s-signal:#f5c431;--s-signal-ink:#5a4300;--s-signal-soft:#fbefc4;--s-ok:#1e7a46;--s-ok-ink:#1a6e3f;--s-ok-soft:#dcefe2;--s-warn:#c98a00;--s-warn-soft:#fbebc5;--s-warn-ink:#8f5800;--s-crit:#b3261e;--s-crit-soft:#f8ddd8;--s-crit-ink:#b3261e;--s-info:#2350a8;--s-info-soft:#dfe7f7;--s-info-ink:#2350a8;background:#fff;color:#16191d;font-size:10.5pt}
  body[data-page=beispielbericht] *,body:has(.p-legal) *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  body[data-page=beispielbericht] .no-print,body:has(.p-legal) .no-print,.p-pagehead--report .actions,.p-pagehead--legal .p-crumbs,.p-doc__main .p-crumbs,.p-pagehead--report .p-crumbs,.p-toc,.p-print,.skip-link,.cc{display:none!important}
  .p-pagehead--report,.p-pagehead--legal{padding:0 0 8mm;background:none;color:#16191d;overflow:visible}
  .p-pagehead--report::before,.p-pagehead--report::after,.p-pagehead--legal::before,.p-pagehead--legal::after{display:none}
  .p-pagehead--report .p-wrap,.p-pagehead--legal .p-wrap,.p-report-stage .p-wrap,.p-section--doc .p-wrap{width:auto}
  .js .p-pagehead__grid>*{animation:none}
  .p-pagehead--report h1,.p-pagehead--legal h1{font-size:24pt;color:#16191d}
  .p-pagehead--report h1 em,.p-pagehead--legal h1 em{color:#5a4300}
  .p-pagehead--report .p-kicker,.p-pagehead--legal .p-kicker{color:#5a4300}
  .p-pagehead--report .p-pagehead__lead,.p-pagehead--legal .p-pagehead__lead{margin-top:3mm;font-size:10.5pt;color:#3a3f45}
  .p-report-stage{margin:0}
  .p-paper{max-width:none;padding:0;border:0;border-radius:0;box-shadow:none}
  .p-paper__head{grid-template-columns:minmax(0,1fr) auto}
  .p-paper__meta{grid-template-columns:repeat(4,minmax(0,1fr))}
  .p-paper__meta div:nth-child(n){border-top:0}
  .p-paper__meta div+div{border-left:1px solid var(--s-line)}
  .p-rsec{margin-top:9mm}
  .p-rsec__head{break-after:avoid}
  .p-rsum{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
  .p-finding{grid-template-columns:120px minmax(0,1fr)}
  .p-finding__sev{flex-direction:column;align-items:flex-start;border-right:1px solid var(--s-line);border-bottom:0}
  .p-finding__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .p-limits{grid-template-columns:repeat(2,minmax(0,1fr))}
  .p-finding,.p-limits article,.p-fact,.p-verdict,.p-paper__meta,.p-evidence tr,.p-evidence-note,.p-paper__foot,.p-legal-id p,.p-clauses>li,.p-legal-toms li{break-inside:avoid}
  .p-table-wrap{overflow:visible}
  .p-evidence tbody tr:target{background:none}
  .p-paper a,.p-legal a{color:inherit;text-decoration:none}
  .p-section--doc{padding:0}
  .p-doc{display:block}
  .p-legal{max-width:none;font-size:10.5pt;line-height:1.6}
  .p-doc__head{margin-bottom:6mm;padding-bottom:4mm;border-bottom:1px solid #16191d}
  .p-doc__head h1{font-size:24pt;color:#16191d}
  .p-doc__head .p-kicker{color:#5a4300}
  .p-doc__lead{font-size:10.5pt;color:#3a3f45}
  .p-legal h2,.p-legal h3{break-after:avoid}
  .p-legal section+section{margin-top:8mm;padding-top:6mm}
}

/* Nachträge: Rasterspalten dürfen schrumpfen; Tabelle der Unterauftragnehmer mobil als Karte */
.p-section--doc .p-doc>*{min-width:0}
@media (max-width:640px){
  .p-legal .p-table thead{display:none}
  .p-legal .p-table,.p-legal .p-table tbody,.p-legal .p-table tr,.p-legal .p-table td{display:block}
  .p-legal .p-table td{padding:12px 16px 0;border:0}
  .p-legal .p-table td:last-child{padding-bottom:16px}
  .p-legal .p-table td[data-label]::before{content:attr(data-label);display:block;margin-bottom:4px;font:600 12px/1.3 var(--s-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--s-muted)}
}
.p-evidence th[scope=row]{background:none;text-transform:none;letter-spacing:0}
@media (max-width:1040px){.p-toc{row-gap:20px}}
/* Mobil: Inhaltsverzeichnis als kompakte Chip-Leisten statt langer Liste */
@media (max-width:640px){
  .p-toc:not(.g-toc){gap:14px;padding:14px 0 14px 14px}
  .p-toc nav{display:flex;gap:6px;overflow-x:auto;padding:0 14px 4px 0;scroll-snap-type:x proximity;scrollbar-width:none}
  .p-toc nav::-webkit-scrollbar{display:none}
  .p-toc nav[aria-label=Rechtliches]{flex-wrap:wrap;overflow:visible}
  .p-toc nav p{flex:0 0 100%;margin:0 0 4px}
  .p-toc nav[aria-label=Inhaltsverzeichnis] p{position:sticky;left:0;flex:none;align-self:center;margin:0 4px 0 0;writing-mode:horizontal-tb}
  .p-toc:not(.g-toc) a,.p-toc:not(.g-toc) a.p-toc__sub{flex:none;padding:8px 12px;border:1px solid var(--s-line);border-radius:999px;background:var(--s-surface-2);font-size:13.5px;white-space:nowrap;scroll-snap-align:start}
  .p-toc:not(.g-toc) a:hover,.p-toc:not(.g-toc) a[aria-current]{border-color:var(--s-ink);background:var(--s-signal-soft)}
  .p-toc a span{min-width:0}
}
@media (max-width:640px){
  .p-toc nav[aria-label=Inhaltsverzeichnis] p{z-index:1;margin:0;padding:10px 10px 10px 0;background:linear-gradient(90deg,var(--s-surface) 85%,transparent);line-height:1.2}
}
@media print{.p-finding .text-link{display:none}}
@media print{.p-paper__meta div:nth-child(n+2){border-left:1px solid var(--s-line)}.p-rsum .p-fact{padding:16px 12px 12px}.p-rsum .p-fact b{font-size:26px}}
@media (max-width:640px){.p-toc nav{scroll-snap-type:none}.p-toc nav[aria-label=Inhaltsverzeichnis] p{position:static;background:none}}

/* ===== offers.css ===== */
/* Gruppe „offers“ (Claude, 2026-10): Betreuung, LinkWerk, IT-Service Essen, Microsoft 365.
   Nur Ergänzungen zu dw-public.css/dw-public-pages.css. Präfix .o-, dazu .project-note (Test-Hook). */

/* ---------- Seitenkopf ---------- */
.p-pagehead__grid.o-center{align-items:center}
.p-pagehead .p-hero__notes{margin-top:26px}
.o-frame{display:grid;gap:16px;padding:26px;border:1px solid rgb(255 255 255/.1);border-radius:var(--s-r-lg);background:linear-gradient(180deg,rgb(22 25 31/.9),rgb(14 16 20/.9));box-shadow:0 40px 100px -40px rgb(0 0 0/.9),inset 0 1px 0 rgb(255 255 255/.06)}
.o-frame__kicker{display:flex;align-items:center;gap:8px;margin:0;font:600 12px/1.2 var(--s-mono);letter-spacing:.08em;text-transform:uppercase;color:#f5c431}
.o-frame__kicker .s-ic{width:16px;height:16px}
.o-frame h2{font:700 24px/1.15 var(--s-display);letter-spacing:-.03em;color:#fff}
.o-frame dl{display:grid;margin:0}
.o-frame dl>div{display:grid;grid-template-columns:120px 1fr;gap:12px;padding:13px 0;border-top:1px solid rgb(255 255 255/.08)}
.o-frame dt{font:600 12px/1.5 var(--s-mono);letter-spacing:.05em;text-transform:uppercase;color:#9b9588}
.o-frame dd{margin:0;font-size:14.5px;line-height:1.5;color:#e8e3d8}
.o-frame__note{display:flex;gap:10px;margin:0;padding:12px 14px;border-radius:12px;background:rgb(245 196 49/.08);border:1px solid rgb(245 196 49/.2);font-size:13.5px;line-height:1.5;color:#e2dccf}
.o-frame__note .s-ic{width:16px;height:16px;margin-top:2px;color:#f5c431}

/* ---------- Karten, Abstände ---------- */
.o-gap{margin-top:16px}
.o-stack{display:grid;gap:16px;align-content:start}
.o-level__top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}
.o-level__tag{margin:0;font:600 12px/1.2 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--s-muted)}
.o-note-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;margin-top:16px}
.o-note-row .p-callout{flex:1 1 520px}
.o-audience h3{max-width:18em}
.o-level .p-card__meta{border-top:1px solid var(--s-line);padding-top:14px;font:500 13.5px/1.5 var(--s-sans);letter-spacing:0}
.o-start{gap:14px;padding:28px;overflow:hidden;isolation:isolate}
.o-start::after{content:"";position:absolute;right:-90px;top:-90px;z-index:-1;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgb(245 196 49/.22),transparent 65%);pointer-events:none}
.o-start .p-kicker{margin:0;color:#f5c431}
.o-start h3{font:700 23px/1.2 var(--s-display);letter-spacing:-.03em}
.o-start .button{align-self:flex-start;margin-top:6px;background:#f5c431;color:#16191d}
.o-start .button:hover{background:#f8d35e}
.o-muted{color:var(--s-muted)}

/* Freigabe-Pfad: drei Stationen mit Verbindungslinie */
.o-track{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none;counter-reset:o-track}
.o-track::before{content:"";position:absolute;top:47px;left:48px;right:calc((100% - 32px)/3 - 48px);height:2px;background:linear-gradient(90deg,var(--s-line-strong),var(--s-signal));border-radius:2px}
.o-track li{position:relative;display:flex;flex-direction:column;gap:8px;padding:26px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface)}
.o-track__icon{position:relative;z-index:1;display:grid;place-items:center;width:44px;height:44px;margin-bottom:8px;border:1px solid var(--s-line-strong);border-radius:50%;background:var(--s-surface);color:var(--s-ink-2);box-shadow:0 0 0 6px var(--s-surface)}
.o-track__icon .s-ic{width:20px;height:20px}
.o-track__icon--signal{border-color:transparent;background:var(--s-signal);color:#16191d;box-shadow:0 0 0 6px var(--s-surface),0 0 0 7px var(--s-signal-soft),0 10px 30px -8px var(--s-signal-glow)}
.o-track__step{margin:0;font:600 12px/1.2 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--s-signal-ink)}
.o-track h3{font:720 20px/1.2 var(--s-display);letter-spacing:-.025em}
.o-track li>p:last-child{margin:0;color:var(--s-ink-2);font-size:15px;line-height:1.65}

/* ---------- LinkWerk: Prinzip-Demo im Seitenkopf ---------- */
.o-demo{position:relative;isolation:isolate;display:grid;gap:12px;padding:20px;border:1px solid rgb(255 255 255/.1);border-radius:var(--s-r-lg);background:linear-gradient(180deg,rgb(22 25 31/.94),rgb(14 16 20/.94));box-shadow:0 50px 120px -40px rgb(0 0 0/.9),inset 0 1px 0 rgb(255 255 255/.06);color:#e2dccf}
/* Papierlage dahinter; scroll-story.js verschiebt sie über --dw-detail-shift/-rotate */
.o-demo::after{content:"";position:absolute;inset:10px -8px -10px 8px;z-index:-1;border:1px solid rgb(255 255 255/.07);border-radius:inherit;background:rgb(255 255 255/.025);pointer-events:none;transform:translateY(var(--dw-detail-shift,0px)) rotate(var(--dw-detail-rotate,0deg));transform-origin:50% 80%}
.o-demo__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;font:500 12px/1.3 var(--s-mono);color:#9b9588}
.o-demo__label{display:inline-flex;align-items:center;gap:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#f5c431}
.o-demo__printed{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;padding:14px;border:1px solid rgb(255 255 255/.08);border-radius:16px;background:rgb(255 255 255/.03)}
.o-flyer{position:relative;display:grid;gap:5px;width:92px;padding:9px 9px 10px;border-radius:8px;background:#f2eee5;box-shadow:0 14px 30px -10px rgb(0 0 0/.8);transform:rotate(-4deg);transition:transform var(--s-slow) var(--s-spring)}
.o-demo:hover .o-flyer{transform:rotate(0) scale(1.03)}
.o-flyer__bar{height:5px;width:46%;border-radius:3px;background:#f5c431}
.o-flyer__line{height:4px;border-radius:2px;background:#dfd7c6}
.o-flyer__line--short{width:62%}
.o-qr{position:relative;width:100%;height:auto;fill:#16191d;shape-rendering:crispEdges}
.o-qr__eye{fill-rule:evenodd}
.o-flyer::after{content:"";position:absolute;left:6px;right:6px;top:18px;height:2px;border-radius:2px;background:#f5c431;box-shadow:0 0 12px 2px rgb(245 196 49/.7);animation:o-scan 3.2s var(--s-ease) infinite}
@keyframes o-scan{0%,100%{transform:translateY(0);opacity:0}12%,88%{opacity:1}50%{transform:translateY(70px)}}
.o-demo__copy span,.o-demo__eyebrow{display:block;margin:0;font:500 12px/1.3 var(--s-mono);letter-spacing:.05em;text-transform:uppercase;color:#9b9588}
.o-demo__copy strong{display:block;margin-top:4px;font:650 16px/1.25 var(--s-display);color:#fff}
.o-demo__copy p{margin:3px 0 0;font-size:13.5px;color:#b3ac9e}
.o-chip{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:var(--s-r-pill);font:600 12px/1 var(--s-mono);white-space:nowrap}
.o-chip .s-ic{width:13px;height:13px;stroke-width:2.2}
.o-chip--still{background:rgb(255 255 255/.08);color:#e2dccf}
.o-chip--change{background:rgb(245 196 49/.14);color:#f5c431}
.o-demo__route{display:flex;align-items:center;gap:10px;padding:0 18px}
.o-demo__route i{flex:1;height:2px;background:repeating-linear-gradient(90deg,#f5c431 0 6px,transparent 6px 12px);background-size:24px 2px;animation:o-flow 1.2s linear infinite;opacity:.7}
@keyframes o-flow{to{background-position:24px 0}}
.o-demo__route strong{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border:1px solid rgb(245 196 49/.35);border-radius:var(--s-r-pill);background:rgb(245 196 49/.08);font:650 13px/1 var(--s-display);color:#fff}
.o-demo__route .s-ic{width:15px;height:15px;color:#f5c431}
.o-demo__dest{position:relative;padding:18px;border:1px solid rgb(245 196 49/.28);border-radius:16px;background:radial-gradient(120% 140% at 100% 0,rgb(245 196 49/.12),transparent 55%),rgb(255 255 255/.03)}
.o-demo__dest h2{margin:6px 0 8px;font:700 24px/1.15 var(--s-display);letter-spacing:-.03em;color:#fff}
.o-demo__url{margin:0 0 12px;font:500 13.5px/1.4 var(--s-mono);color:#fadb7a;overflow-wrap:anywhere}
.o-demo__dest .o-chip{position:absolute;top:16px;right:16px}
.o-demo__controls{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;border:1px solid rgb(255 255 255/.08);border-radius:14px;background:rgb(0 0 0/.25)}
.o-demo__controls button{min-height:44px;padding:0 10px;border:0;border-radius:10px;background:transparent;color:#cfc8ba;font:600 14px/1 var(--s-sans);cursor:pointer;transition:background var(--s-fast),color var(--s-fast),transform var(--s-fast) var(--s-spring)}
.o-demo__controls button:hover{background:rgb(255 255 255/.06);color:#fff}
.o-demo__controls button:active{transform:scale(.97)}
.o-demo__controls button[aria-pressed=true]{background:#f5c431;color:#16191d}
.o-demo__note{margin:0;font-size:12.5px;line-height:1.5;color:#9b9588}

/* Prinzip als Fluss: gedruckt → bleibt → änderbar */
.o-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.o-flow li{position:relative;display:flex;flex-direction:column;gap:8px;padding:28px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface)}
.o-flow li:not(:last-child)::after{content:"";position:absolute;top:50px;right:-13px;z-index:1;width:10px;height:10px;border-top:2px solid var(--s-ink);border-right:2px solid var(--s-ink);transform:rotate(45deg)}
.o-flow li:nth-child(2){border-color:var(--s-ink);box-shadow:0 0 0 4px var(--s-signal-soft)}
.o-flow__icon{display:grid;place-items:center;width:48px;height:48px;margin-bottom:8px;border-radius:14px;background:var(--s-neutral-soft);color:var(--s-ink-2)}
.o-flow__icon .s-ic{width:22px;height:22px}
.o-flow__icon--signal{background:var(--s-signal);color:#16191d}
.o-flow__kicker{margin:0;font:600 12px/1.2 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--s-signal-ink)}
.o-flow h3{font:720 22px/1.2 var(--s-display);letter-spacing:-.025em}
.o-flow li>p:last-child{margin:0;color:var(--s-ink-2);font-size:15px;line-height:1.65}
.o-usecase .o-level__tag{margin-top:6px}

/* Abschluss mit Leistungsumfang */
.o-cta-scope{align-items:center}
.o-cta-scope .closing-actions{margin-top:28px}
.o-cta-scope__aside{display:grid;gap:16px;padding:26px;border:1px solid rgb(255 255 255/.1);border-radius:var(--s-r-lg);background:rgb(255 255 255/.04)}
.o-cta-scope__aside h3{font:720 19px/1.2 var(--s-display);letter-spacing:-.02em;color:#fff}
.p-cta .o-cta-scope__fine{margin:0;padding-top:14px;border-top:1px solid rgb(255 255 255/.1);font-size:13px;line-height:1.6;color:#a8a296}

/* ---------- IT-Service / Microsoft 365 ---------- */
.project-note{max-width:38em;margin:24px 0 0;padding:12px 16px;border-left:3px solid var(--s-signal);border-radius:0 12px 12px 0;background:var(--s-surface);font-size:14.5px;line-height:1.6;color:var(--s-ink-2)}
.project-note a{color:var(--s-ink);text-decoration:underline;text-decoration-color:var(--s-signal);text-decoration-thickness:2px;text-underline-offset:.2em}
.project-note a:hover{text-decoration-color:var(--s-ink)}
.o-board{display:grid;gap:4px;padding:20px;border:1px solid rgb(255 255 255/.1);border-radius:var(--s-r-lg);background:linear-gradient(180deg,rgb(22 25 31/.94),rgb(14 16 20/.94));box-shadow:0 50px 120px -40px rgb(0 0 0/.9),inset 0 1px 0 rgb(255 255 255/.06)}
.o-board__head,.o-board__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;font:500 12px/1.3 var(--s-mono);letter-spacing:.05em;text-transform:uppercase;color:#9b9588}
.o-board__head strong{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 10px;border-radius:var(--s-r-pill);background:rgb(245 196 49/.12);color:#f5c431;font-weight:600;text-transform:none;letter-spacing:0}
.o-board__head strong i{width:6px;height:6px;border-radius:50%;background:currentColor;animation:p-blink 1.6s steps(2) infinite}
.o-board__foot{padding-top:12px;border-top:1px solid rgb(255 255 255/.08)}
.o-board__core{position:relative;width:min(100%,340px);aspect-ratio:1;margin:8px auto}
.o-board__rings{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:rgb(255 255 255/.1);stroke-width:1}
.o-board__rings path{stroke:rgb(245 196 49/.35);stroke-dasharray:3 5}
.o-board__rings .o-board__orbit{stroke:rgb(245 196 49/.45);stroke-dasharray:4 10;transform-origin:150px 150px;animation:o-spin 40s linear infinite}
@keyframes o-spin{to{transform:rotate(360deg)}}
.o-board__hub{position:absolute;left:50%;top:50%;display:grid;place-items:center;align-content:center;width:31%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgb(245 196 49/.28),rgb(245 196 49/.06) 70%);box-shadow:0 0 0 1px rgb(245 196 49/.4),0 0 50px -6px rgb(245 196 49/.55);transform:translate(-50%,-50%);font:800 20px/1 var(--s-display);letter-spacing:-.02em;color:#fff;text-align:center}
.o-board__hub small{display:block;margin-top:4px;font:600 12px/1 var(--s-mono);letter-spacing:.06em;color:#f5c431}
.o-board__node{position:absolute;padding:7px 11px;border:1px solid rgb(255 255 255/.14);border-radius:var(--s-r-pill);background:#1f2328;font:600 12px/1 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:#e8e3d8;white-space:nowrap;transform:translate(-50%,-50%);box-shadow:0 10px 24px -10px rgb(0 0 0/.8)}
.o-board__node::before{content:"";display:inline-block;width:6px;height:6px;margin-right:7px;border-radius:50%;background:#f5c431;vertical-align:1px}
.o-board__node--a{left:50%;top:4%}
.o-board__node--b{left:88%;top:50%}
.o-board__node--c{left:50%;top:96%}
.o-board__node--d{left:12%;top:50%}
.o-lead h2{font:800 clamp(32px,3.6vw,48px)/1.04 var(--s-display);letter-spacing:-.045em}
.o-lead>p:not(.p-kicker){margin:18px 0 26px;color:var(--s-ink-2);font-size:17px;line-height:1.65}
.o-details{display:grid;gap:12px}
.o-detail{scroll-margin-top:96px}
.o-detail__top{display:flex;align-items:center;justify-content:space-between}
.o-detail__num{font:600 13px/1 var(--s-mono);letter-spacing:.06em;color:var(--s-muted)}
.o-detail:target{border-color:var(--s-ink);box-shadow:0 0 0 4px var(--s-signal-soft)}
.o-tags{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 0;padding:0;list-style:none}
.o-tags li{display:inline-flex;align-items:center;height:26px;padding:0 10px;border:1px solid var(--s-line);border-radius:var(--s-r-pill);background:var(--s-surface-2);font:500 12.5px/1 var(--s-mono);color:var(--s-ink-2)}
.p-steps.o-steps--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.o-steps--4 .p-step:nth-child(4).is-in .p-step__num::after{animation-delay:.6s}
.o-entry__label{display:flex;align-items:center;gap:10px;margin:0 0 6px;font:600 12px/1.2 var(--s-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--s-muted)}
.o-entry__label span{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:var(--s-ink);color:var(--s-bg);font:700 15px/1 var(--s-display);letter-spacing:0}

/* ---------- Responsiv ---------- */
@media (max-width:1040px){.p-steps.o-steps--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){
  .o-track,.o-flow{grid-template-columns:1fr}
  .o-track::before{top:26px;bottom:26px;left:48px;right:auto;width:2px;height:auto;background:linear-gradient(180deg,var(--s-line-strong),var(--s-signal))}
  .o-flow li:not(:last-child)::after{top:auto;right:auto;bottom:-13px;left:50px;transform:rotate(135deg)}
  .o-cta-scope .closing-actions{margin-top:20px}
  .o-board{max-width:520px}
}
@media (max-width:640px){
  .o-frame,.o-demo,.o-board{padding:16px;border-radius:var(--s-r-lg)}
  .o-frame dl>div{grid-template-columns:1fr;gap:4px}
  .o-demo__printed{grid-template-columns:auto 1fr;gap:12px}
  .o-demo__printed .o-chip{grid-column:2;justify-self:start}
  .o-flyer{width:76px}
  .o-demo__dest .o-chip{position:static;margin-top:2px}
  .o-demo__dest h2{font-size:21px}
  .o-track li,.o-flow li,.o-start,.o-cta-scope__aside{padding:22px}
  .o-track::before{left:44px}
  .p-steps.o-steps--4{grid-template-columns:1fr}
  .o-board__node{padding:6px 8px;letter-spacing:.02em}
  .o-board__hub{font-size:17px}
}
@media print{.o-demo__controls,.o-flyer::after{display:none}}

/* ===== operator.css ===== */
/* Gruppe „operator“: Betreiber-Anmeldung /betrieb/anmelden (Admin Login L1, L3, L4). Claude, 2026-10-05.
   Nur Passwort: keine Passkey- oder Code-Schritte, kein Dienststatus vor der Anmeldung. */
.op-login{--op-stage:#16191d;--op-stage-ink:#f2eee5;--op-panel:var(--s-bg);--op-field:var(--s-surface);background:var(--op-stage)}
html[data-theme=dark] .op-login{--op-panel:var(--s-surface);--op-field:var(--s-bg)}
.op-auth{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,560px);min-height:100dvh}

/* ---------- Bühne (dunkel, mit feinem Raster) ---------- */
.op-auth__stage{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:40px;padding:56px;background-color:var(--op-stage);background-image:linear-gradient(rgb(242 238 229/.04) 1px,transparent 1px),linear-gradient(90deg,rgb(242 238 229/.04) 1px,transparent 1px);background-size:32px 32px;color:var(--op-stage-ink)}
.op-brand{display:inline-flex;align-items:center;gap:12px;align-self:flex-start;min-height:44px;color:var(--op-stage-ink);text-decoration:none}
.op-brand .p-brand__mark{width:32px;height:32px}
.op-brand b{font:800 21px/1 var(--s-display);letter-spacing:-.02em}
.op-chip{padding:3px 8px;border:1px solid #3a3f45;border-radius:6px;color:#c9c3b6;font:500 12px/1.2 var(--s-mono)}
.op-auth__claim{margin:0;font:800 clamp(64px,7.4vw,96px)/.92 var(--s-display);letter-spacing:-.05em;color:var(--op-stage-ink)}
.op-auth__claim em{font-style:normal;color:#f5c431}
.op-auth__notice{margin:0;max-width:34em;font-size:14px;line-height:1.5;color:#a8a296}

/* ---------- Formularseite ---------- */
.op-auth__panel{display:flex;flex-direction:column;justify-content:center;padding:56px;background:var(--op-panel);color:var(--s-ink)}
html[data-theme=dark] .op-auth__panel{border-left:1px solid var(--s-line)}
.op-card{display:flex;flex-direction:column;gap:22px;width:100%;max-width:448px}
.op-step{display:flex;flex-direction:column;gap:22px}
.op-step[hidden],.op-lock__ring[hidden]{display:none}
.op-kicker{margin:0 0 -12px;font:500 13px/1.3 var(--s-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--s-ink-2)}
.op-kicker[data-tone="crit"]{color:var(--s-crit-ink)}
.op-kicker[data-tone="ok"]{color:var(--s-ok-ink)}
.op-card h1{margin:0;font:800 44px/1 var(--s-display);letter-spacing:-.035em;color:var(--s-ink)}
.op-card h1:focus{outline:none;box-shadow:none}
.op-text{margin:0;font-size:17px;line-height:1.55;color:var(--s-ink-2)}
.op-text:empty{display:none}
.op-form{display:grid;gap:22px}
.op-field{display:grid;gap:8px}
.op-field label{font:600 15px/1.3 var(--s-sans);color:var(--s-ink)}
/* Anzeigen steht optisch neben „Passwort“, folgt in der Tab-Reihenfolge aber dem Feld. */
.op-field--password{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"label toggle" "input input";align-items:center}
.op-field--password label{grid-area:label}
.op-field--password input{grid-area:input}
.op-field--password .op-toggle{grid-area:toggle;justify-self:end}
.op-field input{width:100%;min-height:52px;padding:0 16px;border:1.5px solid var(--s-ink);border-radius:10px;background:var(--op-field);color:var(--s-ink);font:400 17px/1.3 var(--s-sans)}
.op-field input:focus-visible{border-color:var(--s-ink);box-shadow:0 0 0 4px var(--s-signal);border-radius:10px}
.op-toggle{min-height:44px;margin:-12px -8px;padding:0 8px;border:0;background:none;color:var(--s-ink);font:500 15px/1 var(--s-sans);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.op-toggle[aria-pressed=true]{text-decoration-color:var(--s-signal);text-decoration-thickness:2px}
.op-submit{display:grid;place-items:center;min-height:54px;padding:0 18px;border:0;border-radius:10px;background:var(--s-ink);color:var(--s-on-ink);font:600 17px/1.2 var(--s-sans);text-align:center;text-decoration:none;cursor:pointer}
.op-submit:disabled{opacity:.6;cursor:progress}
.op-danger{min-height:52px;padding:0 16px;border:2px solid var(--s-crit-ink);border-radius:10px;background:transparent;color:var(--s-crit-ink);font:600 16px/1.2 var(--s-sans);cursor:pointer;transition:background var(--s-fast),color var(--s-fast)}
.op-danger:hover{background:var(--s-crit);color:var(--s-surface)}
.op-danger[hidden]{display:none}
.op-links{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:8px 20px;font-size:15px}
.op-links a,.op-recovery summary{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--s-ink);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px;cursor:pointer}
.op-links a:hover,.op-recovery summary:hover{color:var(--s-signal-ink)}
.op-recovery{flex:1 1 220px}
.op-recovery summary{list-style:none}
.op-recovery summary::-webkit-details-marker{display:none}
.op-recovery p{margin:4px 0 0;font-size:14px;line-height:1.55;color:var(--s-ink-2)}
#login-error{margin:0}

/* ---------- L3: vorübergehend gesperrt ---------- */
.op-lock__ring{position:relative;display:grid;place-items:center;width:120px;height:120px}
.op-lock__ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.op-lock__ring circle{fill:none;stroke-width:12}
.op-lock__track{stroke:var(--s-bg-sunken)}
.op-lock__left{stroke:var(--s-crit);transition:stroke-dasharray 1s linear}
.op-lock__ring span{position:relative;font:600 24px/1 var(--s-mono);font-variant-numeric:tabular-nums;color:var(--s-ink)}

/* ---------- L4: Sicherheitsblick ---------- */
.op-sessions{display:grid;margin:0;padding:0;list-style:none;border-top:1.5px solid var(--s-ink)}
.op-sessions li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--s-line)}
.op-sessions li>div{display:grid;gap:3px;min-width:0}
.op-sessions strong{font:600 16px/1.3 var(--s-sans)}
.op-sessions li>div>span{font:400 13px/1.4 var(--s-mono);color:var(--s-ink-2)}
.op-tag{padding:4px 9px;border-radius:999px;background:var(--s-neutral-soft);color:var(--s-ink-2);font:600 12px/1.2 var(--s-sans);white-space:nowrap}
.op-tag--ok{background:var(--s-ok-soft);color:var(--s-ok-ink)}
.op-glance__actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.op-glance__actions .op-submit{min-height:52px;font-size:16px}

@media (prefers-reduced-motion:no-preference){
  .op-submit{transition:transform .2s cubic-bezier(.2,.7,.2,1),box-shadow .2s}
  .op-submit:not(:disabled):hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--s-signal)}
  .op-card,.op-step:not([hidden]){animation:p-rise .6s var(--s-ease-out) backwards}
}
@media (prefers-reduced-motion:reduce){.op-lock__left{transition:none}}

/* ---------- Mobil: dunkles Band oben, Formular darunter ---------- */
@media (max-width:860px){
  .op-auth{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr}
  .op-auth__stage{gap:20px;padding:max(16px,env(safe-area-inset-top)) 22px 28px}
  .op-brand b{font-size:19px}
  .op-brand .p-brand__mark{width:28px;height:28px}
  .op-auth__claim{font-size:48px}
  .op-auth__claim br{display:none}
  .op-auth__notice{font-size:13px}
  .op-auth__panel{justify-content:flex-start;padding:24px 22px max(32px,env(safe-area-inset-bottom))}
  html[data-theme=dark] .op-auth__panel{border-left:0;border-top:1px solid var(--s-line)}
  .op-card,.op-step{gap:18px}
  .op-card{max-width:none}
  .op-card h1{font-size:clamp(30px,8.4vw,36px)}
  .op-field input{min-height:50px;font-size:16px}
  .op-submit{min-height:52px;font-size:16px}
  .op-lock__ring{width:110px;height:110px}
  .op-lock__ring span{font-size:22px}
}
@media (max-width:380px){.op-glance__actions{grid-template-columns:1fr}}

/* ===== service.css ===== */
/* Gruppe „service“: Kontakt, Leistungen, Betriebscheck, Website-Betrieb (Claude, 2026-10).
   Nur Ergänzungen zu dw-public.css und dw-public-pages.css, Präfix .svc-. */

/* Pagehead-Begleiter: Preis-Kachel (Leistungen, Website-Betrieb) */
.svc-price{position:relative;display:grid;gap:12px;padding:28px;border:1px solid rgb(255 255 255/.12);border-radius:var(--s-r-lg);background:linear-gradient(180deg,rgb(22 25 31/.92),rgb(14 16 20/.92));box-shadow:0 40px 100px -40px rgb(0 0 0/.9),inset 0 1px 0 rgb(255 255 255/.06);overflow:hidden}
.svc-price::after{content:"";position:absolute;right:-110px;top:-110px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgb(245 196 49/.2),transparent 65%);pointer-events:none}
.svc-price__kicker{display:inline-flex;align-items:center;gap:10px;margin:0;font:600 12px/1.2 var(--s-mono);letter-spacing:.08em;text-transform:uppercase;color:#f5c431}
.svc-price .p-price{margin:6px 0 4px;padding:0 0 18px;border-top:0;border-bottom:1px solid rgb(255 255 255/.1)}
.svc-price .p-price span{flex-basis:100%;color:#b3ac9e}
.svc-price h2{font:700 24px/1.15 var(--s-display);letter-spacing:-.025em;color:#fff}
.svc-price>p:not([class]){margin:0;color:#cfc8ba;font-size:15px;line-height:1.6}
.svc-price .text-link{justify-self:start;margin-top:6px;color:#f2eee5;border-color:rgb(255 255 255/.25)}
.svc-price .text-link:hover{border-color:#f5c431}

/* Pagehead-Begleiter Kontakt: vier Angaben */
.svc-four{gap:14px;padding:26px}
.svc-four__kicker{margin:0;font:500 12px/1.2 var(--s-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--s-ink-2)}
.svc-four h2{font:800 22px/1.2 var(--s-display);letter-spacing:-.025em;color:var(--s-ink)}
.svc-four>p:not([class]){margin:0;font-size:15px;color:var(--s-ink-2)}
.svc-four ol{display:grid;gap:0;margin:4px 0 0;padding:0;list-style:none}
.svc-four li{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--s-line);font-size:14.5px;line-height:1.5;color:var(--s-ink-2)}
.svc-four li span{font:600 12px/1.6 var(--s-mono);color:var(--s-signal-ink)}
.svc-four li strong{display:block;font:700 15px/1.3 var(--s-display);color:var(--s-ink)}

/* Kontakt: Formularkarte */
.svc-contact .p-split{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:40px 48px}
.svc-formcard{display:grid;gap:18px;padding:36px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);box-shadow:var(--s-shadow-2)}
.svc-formcard__head h2{font:800 clamp(30px,3.4vw,44px)/1.05 var(--s-display);letter-spacing:-.04em}
.svc-formcard__head h2 span{color:var(--s-muted)}
.svc-formcard__head p:not(.p-kicker){margin:14px 0 0;color:var(--s-ink-2);line-height:1.65}
.svc-status{display:flex;align-items:flex-start;gap:10px;line-height:1.5}
.svc-status::before{content:"";flex:none;width:8px;height:8px;margin-top:6px;border-radius:50%;background:var(--s-muted)}
.svc-status[data-state=info]::before{background:var(--s-signal)}
.svc-status[data-state=error]::before{background:var(--s-crit)}
.svc-status[data-state=success]::before{background:var(--s-signal)}
.svc-status:focus{outline:none}
.svc-status:focus-visible{box-shadow:var(--s-focus)}
.p-form[hidden]{display:none}
.svc-form{padding-top:6px;border-top:1px solid var(--s-line)}
.p-form .svc-fields{gap:18px;min-width:0}
.svc-fields:disabled{opacity:.6}
.svc-req,.svc-opt{font-weight:500;font-size:13px;color:var(--s-muted)}
.svc-sr-only,.intake-honeypot{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.svc-submit{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.svc-submit .button::after{content:"";width:16px;height:16px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform var(--s-med) var(--s-spring)}
.svc-submit .button:hover::after{transform:translateX(3px)}
.p-consent a,.svc-formcard .p-help a{color:var(--s-ink);text-decoration-color:var(--s-signal);text-underline-offset:.18em}

/* Briefing-Assistent (project-brief.js) */
.svc-brief{border:1px solid var(--s-line);border-radius:18px;background:var(--s-surface-2);transition:border-color var(--s-fast)}
.svc-brief[open]{border-color:var(--s-line-strong)}
.svc-brief summary{display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 16px;cursor:pointer;list-style:none;font:650 15px/1.3 var(--s-display);color:var(--s-ink)}
.svc-brief summary::-webkit-details-marker{display:none}
.svc-brief summary:hover .svc-brief__title{color:var(--s-signal-ink)}
.svc-brief__icon{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:10px;background:var(--s-signal-soft);color:var(--s-signal-ink)}
.svc-brief__title{flex:1;transition:color var(--s-fast)}
.svc-brief__chev{color:var(--s-muted);transition:transform var(--s-med) var(--s-spring)}
.svc-brief[open] .svc-brief__chev{transform:rotate(180deg)}
.svc-brief__body{gap:14px;padding:4px 16px 18px}
.svc-brief__body textarea{min-height:96px}
.svc-brief__body .p-status{background:var(--s-surface)}
.p-form .svc-brief__output{font:500 13.5px/1.55 var(--s-mono);background:var(--s-bg)}
.svc-brief__actions{display:flex;flex-wrap:wrap;gap:8px}
.svc-brief .button{min-height:44px;font-size:14px}
.svc-brief .button .s-ic{width:16px;height:16px}

/* Kontakt: Begleitspalte */
.svc-aside{display:grid;gap:16px}
.svc-panel{display:grid;gap:14px;padding:26px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface)}
.svc-panel .p-kicker{margin:0}
.svc-panel h2{font:700 24px/1.15 var(--s-display);letter-spacing:-.025em}
.svc-panel>p:not([class]){margin:0;color:var(--s-ink-2);font-size:15px;line-height:1.6}
.contact-options{display:grid;gap:8px}
.contact-options a{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--s-line);border-radius:14px;background:var(--s-surface-2);color:var(--s-ink);text-decoration:none;transition:border-color var(--s-fast),background var(--s-fast),transform var(--s-fast) var(--s-spring)}
.contact-options a:hover{border-color:var(--s-ink);background:var(--s-surface)}
.contact-options a:active{transform:scale(.99)}
.svc-co-ic{display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:var(--s-signal-soft);color:var(--s-signal-ink)}
.contact-options div{display:grid;gap:2px;min-width:0}
.contact-options strong{font:650 15px/1.3 var(--s-display);overflow-wrap:anywhere}
.contact-options div span{font-size:13px;line-height:1.45;color:var(--s-muted)}
.contact-options i{font-style:normal;color:var(--s-muted);transition:transform var(--s-med) var(--s-spring),color var(--s-fast)}
.contact-options a:hover i{color:var(--s-signal-ink);transform:translate(2px,-2px)}
.intake-direct{justify-self:start;color:var(--s-ink);font-weight:600;font-size:14.5px;text-decoration:none;border-bottom:1px solid var(--s-line-strong);padding-bottom:2px;transition:border-color var(--s-fast)}
.intake-direct:hover{border-color:var(--s-ink)}
.svc-aside .p-callout{font-size:14px}
.svc-aside .p-callout a{color:var(--s-ink)}
.svc-next{display:grid;gap:0;margin:0;padding:0;list-style:none}
.svc-next li{position:relative;display:grid;grid-template-columns:28px 1fr;gap:12px;padding:0 0 16px;font-size:14px;line-height:1.55;color:var(--s-ink-2)}
.svc-next li:last-child{padding-bottom:0}
.svc-next li:not(:last-child)::before{content:"";position:absolute;left:13px;top:30px;bottom:4px;width:2px;border-radius:2px;background:var(--s-line)}
.svc-next li>span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--s-signal-soft);color:var(--s-signal-ink);font:650 12.5px/1 var(--s-mono)}
.svc-next strong{display:block;font:650 15px/1.35 var(--s-display);color:var(--s-ink)}

/* Leistungen / Website-Betrieb */
.svc-steplink{font-size:14.5px}
.svc-scope{display:grid;grid-template-columns:1fr 1fr;margin-top:16px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);overflow:hidden}
.svc-scope>div{display:grid;align-content:start;gap:16px;padding:28px}
.svc-scope>div+div{border-left:1px solid var(--s-line);background:var(--s-surface-2)}
.svc-scope h3{font:720 18px/1.25 var(--s-display);letter-spacing:-.015em}
.svc-scope .p-checklist li{font-size:15px}
.p-grid--4 .p-card h3{font-size:19px}
.p-card p.svc-label:not(.p-kicker){margin:0;font:600 12px/1.35 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--s-muted)}
.p-card--dark p.svc-label:not(.p-kicker){color:#f5c431}
.svc-more{display:inline-flex;align-items:center;gap:6px;color:var(--s-ink);font:600 14px/1.3 var(--s-sans);letter-spacing:0}
.svc-more .s-ic{width:16px;height:16px;transition:transform var(--s-med) var(--s-spring)}
a.p-card:hover .svc-more .s-ic{transform:translateX(4px)}
.p-card--dark .svc-more{color:#fff}
.p-card--dark .p-card__icon{background:rgb(245 196 49/.14);color:#f5c431}
.svc-badge--dark{background:rgb(255 255 255/.08);color:#e2dccf}
.svc-tile--main{overflow:hidden}
.svc-tile--main::after{content:"";position:absolute;right:-90px;top:-90px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgb(245 196 49/.22),transparent 65%);pointer-events:none}
.svc-splithead{display:grid;gap:18px;justify-items:start}
.svc-splithead .p-kicker{margin:0}
.svc-splithead h2{font:800 clamp(34px,4.2vw,52px)/1.02 var(--s-display);letter-spacing:-.045em}
.svc-splithead p:not(.p-kicker){margin:0;color:var(--s-ink-2);font-size:17px;line-height:1.65}
.svc-rows{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.svc-rows li{display:grid;grid-template-columns:56px 1fr;gap:18px;padding:26px;border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface)}
.svc-rows__num{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--s-bg-sunken);font:650 14px/1 var(--s-mono);color:var(--s-signal-ink)}
.svc-rows h3{margin-bottom:8px;font:720 20px/1.25 var(--s-display);letter-spacing:-.02em}
.svc-rows p{margin:0;color:var(--s-ink-2);font-size:15px;line-height:1.65}

/* Betriebscheck */
.svc-projectnote{max-width:38em;margin:26px 0 0;padding:4px 0 4px 16px;border-left:3px solid var(--s-signal);font-size:14.5px;line-height:1.6;color:var(--s-ink-2)}
.svc-projectnote a{color:var(--s-ink);text-decoration-color:var(--s-signal);text-decoration-thickness:2px;text-underline-offset:.18em}
.svc-board{display:grid;gap:16px;padding:22px;border:1px solid rgb(255 255 255/.1);border-radius:var(--s-r-lg);background:linear-gradient(180deg,rgb(22 25 31/.92),rgb(14 16 20/.92));box-shadow:0 40px 100px -40px rgb(0 0 0/.9),inset 0 1px 0 rgb(255 255 255/.06);font-size:14px;color:#cfc8ba}
.svc-board__head{display:flex;justify-content:space-between;align-items:center;gap:12px;font:600 12px/1.2 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:#a8a296}
.svc-board__head b{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 10px;border-radius:var(--s-r-pill);background:rgb(245 196 49/.12);color:#f5c431;font-weight:600;text-transform:none;letter-spacing:0}
.svc-board__head i{width:6px;height:6px;border-radius:50%;background:currentColor}
.svc-board__steps{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:0;padding:0;list-style:none}
.svc-board__steps li{display:grid;gap:8px;padding:12px 11px;border:1px solid rgb(255 255 255/.08);border-radius:14px;background:rgb(255 255 255/.03);font:650 14.5px/1.15 var(--s-display);color:#fff}
.svc-board__steps span{font:600 12px/1 var(--s-mono);color:#948e82}
.svc-board__plan{padding:16px;border-radius:16px;background:rgb(0 0 0/.24);border:1px solid rgb(255 255 255/.06)}
.svc-board__plan p{margin:0 0 12px;font:600 12px/1.2 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:#a8a296}
.svc-board__bars{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.svc-board__bars i{height:8px;border-radius:4px;background:#f5c431;transform-origin:left;animation:svc-grow 1.2s var(--s-ease-out) backwards}
.svc-board__bars i:nth-child(2){opacity:.6;animation-delay:.2s}
.svc-board__bars i:nth-child(3){opacity:.3;animation-delay:.4s}
@keyframes svc-grow{from{transform:scaleX(0)}}
.svc-board__plan ul{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:10px 0 0;padding:0;list-style:none;font-size:13px;color:#a8a296}
.svc-board__plan b{font:760 24px/1 var(--s-display);letter-spacing:-.03em;color:#fff}
.svc-board__foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 16px;padding-top:2px;font:500 12px/1.4 var(--s-mono);color:#a8a296}
.svc-offer{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);border:1px solid var(--s-line);border-radius:var(--s-r-lg);background:var(--s-surface);overflow:hidden;box-shadow:var(--s-shadow-2)}
.svc-offer__main{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:40px;background:#16191d;color:#f2eee5;overflow:hidden;isolation:isolate}
.svc-offer__main::after{content:"";position:absolute;right:-120px;bottom:-140px;width:340px;height:340px;z-index:-1;border-radius:50%;background:radial-gradient(circle,rgb(245 196 49/.2),transparent 65%)}
.svc-offer__main .p-kicker{margin:0;color:#f5c431}
.svc-offer__main h2{font:760 clamp(28px,3vw,36px)/1.08 var(--s-display);letter-spacing:-.035em;color:#fff}
.svc-offer__main>p:not([class]){margin:0;color:#cfc8ba;line-height:1.65}
.svc-offer__price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;width:100%;margin:auto 0 0;padding-top:20px;border-top:1px solid rgb(255 255 255/.1)}
.svc-offer__price strong{font:800 44px/1 var(--s-display);letter-spacing:-.045em;color:#fff}
.svc-offer__price span{font-size:13.5px;color:#a8a296}
.svc-offer__main .button-primary{background:#f5c431;color:#16191d}
.svc-offer__main .button-primary:hover{background:#f8d35e;box-shadow:0 12px 30px -12px rgb(245 196 49/.6)}
html[data-theme=dark] .svc-offer__main{border-right:1px solid var(--s-line)}
.svc-offer__lists{display:grid;align-content:center;gap:28px;padding:40px}
.svc-offer__lists>div{display:grid;gap:14px}
.svc-offer__lists>div+div{padding-top:28px;border-top:1px solid var(--s-line)}
.svc-offer__lists h3{font:720 18px/1.25 var(--s-display);letter-spacing:-.015em}
.svc-steps--4{grid-template-columns:repeat(4,1fr)}
.svc-steps--4 .p-step:nth-child(4).is-in .p-step__num::after{animation-delay:.6s}
.svc-steps--4 .p-step h3{font-size:20px}
.svc-sample>div span{overflow-wrap:anywhere}
.svc-faqlead{margin:18px 0 0;max-width:22em;color:var(--s-ink-2);font-size:17px;line-height:1.6}

@media (max-width:1040px){
  .svc-steps--4{grid-template-columns:repeat(2,1fr)}
  .svc-offer{grid-template-columns:1fr}
}
@media (max-width:860px){
  .svc-contact .p-split{grid-template-columns:1fr}
  .svc-scope{grid-template-columns:1fr}
  .svc-scope>div+div{border-left:0;border-top:1px solid var(--s-line)}
  .svc-splithead{position:static}
}
@media (max-width:640px){
  .svc-formcard{padding:22px 18px;border-radius:var(--s-r-lg)}
  .svc-panel{padding:22px}
  .svc-price,.svc-four{padding:22px}
  .svc-price .p-price strong{font-size:46px}
  .svc-steps--4{grid-template-columns:1fr}
  .svc-offer__main,.svc-offer__lists{padding:26px 22px}
  .svc-rows li{grid-template-columns:1fr;gap:14px;padding:22px}
  .svc-scope>div{padding:22px}
  .svc-board{padding:16px}
  .svc-board__steps{grid-template-columns:repeat(2,1fr)}
  .svc-brief summary{padding:10px 12px}
  .svc-brief__body{padding:4px 12px 14px}
  .contact-options a{grid-template-columns:36px minmax(0,1fr) auto;padding:12px}
  .svc-co-ic{width:36px;height:36px}
}
@media(prefers-reduced-motion:reduce){.svc-board__bars i{animation:none}}
.p-pagehead__grid:has(.svc-four){align-items:center}
.p-step:has(.svc-steplink){display:flex;flex-direction:column}
.p-step:has(.svc-steplink)>p:not(.p-step__num){margin-bottom:18px}
.p-step .svc-steplink{align-self:flex-start;margin-top:auto}
.svc-form .p-form-row{align-items:start}
.p-grid--4 .p-card--dark p:not(.p-kicker,.svc-label){color:#cfc8ba}

/* ===== zz-taste-pass.css ===== */
/* ==========================================================================
   Feinschliff nach taste-skill, redesign-skill und Vercel Web Interface Guidelines (Claude, 2026-10-04).
   Liegt bewusst zuletzt im Bundle und gilt für alle öffentlichen Seiten.
   ========================================================================== */
h1,h2,h3{text-wrap:balance}
p,li{text-wrap:pretty}
a,button,summary,label,select{touch-action:manipulation;-webkit-tap-highlight-color:transparent}

/* Scheckheft: Tintenflächen bleiben flach – keine Lichtkreise, keine Rasterlinien */
.p-hero::after,.p-hero::before,.p-offer--main::after,.p-cta::before,.p-auth__brand::before,.o-start::after,.svc-price::after,.svc-tile--main::after,.svc-offer__main::after{display:none}

/* Akzent als Farbe, nicht als Verlaufsschrift */
.p-hero h1 em{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#f5c431;animation:none}

/* Scheckheft: Augenbrauen in Mono-Versalien wie im Entwurf (ruhig, Tinte 2) */
.p-kicker{font:500 13px/1.35 var(--s-mono);letter-spacing:.08em;text-transform:uppercase}
.p-eyebrow{font:500 13px/1.3 var(--s-mono);letter-spacing:.04em}
.p-eyebrow .p-live,.check-heading .p-live{display:none}

/* Abschnittskopf gestapelt: eine Aussage, Text darunter */
.p-sechead{display:block;max-width:780px;margin-bottom:48px}
.p-sechead p:not(.p-kicker){margin-top:18px;max-width:62ch}

/* Ablauf als ruhige Zeilen statt drei gleicher Karten */
.p-steps{grid-template-columns:1fr;gap:0;border-top:1px solid var(--s-line)}
.p-step{display:grid;grid-template-columns:minmax(150px,.32fr) minmax(0,1fr);column-gap:48px;padding:30px 0;border:0;border-bottom:1px solid var(--s-line);border-radius:0;background:none}
.p-step::before{content:"";position:absolute;left:0;top:-1px;width:0;height:2px;background:var(--s-signal);transition:width 1.1s var(--s-ease-out)}
.p-step.is-in::before{width:96px}
.p-step:nth-child(2)::before{transition-delay:.15s}.p-step:nth-child(3)::before{transition-delay:.3s}.p-step:nth-child(4)::before{transition-delay:.45s}
.p-step .p-step__num{grid-row:1/3;margin:0;font:800 20px/1.25 var(--s-display);letter-spacing:-.02em;color:var(--s-ink);text-transform:none}
.p-step__num::after{display:none}
.p-step h3{margin:0 0 8px}
.p-step p{max-width:60ch}
.p-section--sunken .p-step{background:none}

/* Drei Karten: asymmetrisches Trio statt drei gleicher Spalten */
.p-grid--3:has(>:first-child:nth-last-child(3)){grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
.p-grid--3>:first-child:nth-last-child(3){grid-row:span 2}

/* Stationsnummern sind Funktion, keine Dekoration */
.station-index{display:none}

/* Inhaltsverzeichnis-Labels ebenfalls ruhig */
.p-toc p{font:500 13px/1.3 var(--s-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--s-ink-2)}

@media (max-width:860px){
  .p-step{grid-template-columns:1fr;row-gap:6px}
  .p-step .p-step__num{grid-row:auto}
  .p-grid--3:has(>:first-child:nth-last-child(3)){grid-template-columns:1fr}
  .p-grid--3>:first-child:nth-last-child(3){grid-row:auto}
}
@media(prefers-reduced-motion:reduce){.p-step::before{width:96px}}

/* Hero: Überschrift auf zwei Zeilen, Raum für die Messstation */
@media (min-width:1041px){.p-hero__grid{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)}}
.p-hero h1{font-size:clamp(40px,4.4vw,64px);line-height:1.04;letter-spacing:-.045em}
.p-hero__lead{max-width:30em}
.p-pagehead h1{font-size:clamp(40px,5vw,72px);line-height:1}

/* 404: drei gleich breite Wege statt Bento (Scheckheft, 2026-10-05) */
@media (min-width:861px){.p-error .p-grid--3:has(>:first-child:nth-last-child(3)){grid-template-columns:repeat(3,minmax(0,1fr))}.p-error .p-grid--3>:first-child:nth-last-child(3){grid-row:auto}}

/* ===== zzz-review.css ===== */
/* Review-Nachträge (Claude, 2026-10-05): Reflow bei 320 px, mobile Verdichtung von W1/W4, Zielgrößen 44 px. */

/* Kopf bis 360 px: Marke, „Menü“ und Farbschema passen ohne seitliches Scrollen (WCAG 1.4.10). */
@media (max-width:360px){
  .site-header .p-wrap{width:calc(100% - 24px);gap:10px}
  .site-header .p-brand{gap:8px}
  .site-header .p-brand b{font-size:16px}
  .public-menu-toggle{padding:0 12px}
}

/* Eigenständige Text-Links: Trefferfläche mindestens 44 px, Optik unverändert. */
.text-link::before{inset:-10px -4px}

/* Inhaltsverzeichnisse (Rechtstexte, Ratgeber): jede Zeile mindestens 44 px. */
.p-toc a{min-height:44px;align-items:center}
.g-toc a{align-content:center}

/* Laufband: sichtbar beschriftet, damit es nicht als Umfang des Schnellchecks gelesen wird. */
.p-ticker__label{margin:0 0 16px;font:600 13px/1.4 var(--s-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--s-ink-2)}
.p-ticker__label span{letter-spacing:0;text-transform:none;font-weight:500}

/* „Alle 8 Funktionen“ gibt es nur mobil. */
.p-features__more{display:none}

@media (max-width:640px){
  /* W1-410: vier Funktionen, der Rest auf Wunsch */
  .p-features__more{display:flex;width:100%;margin-top:4px}
  .p-features__list.is-collapsible:not(.is-open) li:nth-child(n+5){display:none}

  /* W1-410: kompakte Angebotskarten, Preis in der Titelzeile, Merkmalslisten erst ab Tablet */
  .p-offers{gap:14px;margin-bottom:40px}
  .p-offer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;align-items:center;padding:20px}
  .p-offer>*{grid-column:1/-1}
  .p-offer__top{grid-column:1;grid-row:1;flex-wrap:wrap;justify-content:flex-start;gap:6px 10px}
  .p-offer__price,.p-offer .p-price{display:contents}
  .p-offer__price strong,.p-offer .p-price strong{grid-column:2;grid-row:1;justify-self:end;font-size:28px}
  .p-offer__price span,.p-offer .p-price span{grid-column:1/-1;font-size:14px}
  .p-offer>p:not([class]){min-height:0;font-size:15.5px;line-height:1.5}
  .p-offer ul{display:none}
  .p-offer:not(.p-offer--main) .small-note{display:none}
  .p-offer .button{margin-top:6px}
  .p-offer h3{font-size:20px;white-space:nowrap}
  .p-offer__price strong{font-size:24px}

  /* Kürzere Abstände und ein kleineres Porträt, damit die Startseite mobil kompakt bleibt. */
  .p-section:is(.p-features,.p-klartext,.p-booklet,.p-prices,.p-person,#fragen){padding:60px 0}
  .p-person__photo{max-width:240px}

  /* Fußzeile als kompakte Linkzeilen; Gruppen bleiben als benannte Navigationen erhalten. */
  .site-footer{padding-top:36px}
  .site-footer .p-wrap{display:flex;flex-direction:column;gap:14px}
  .site-footer__brand p{margin-top:8px}
  .site-footer nav{flex-direction:row;flex-wrap:wrap;gap:0 18px;padding-top:6px;border-top:1px solid var(--s-night-line)}
  .site-footer__title{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

  /* W4-410: Dokumentwahl als eine Zeile, Überschrift direkt darunter, Inhaltsverzeichnis und Drucken nach der Überschrift.
     Nur Anordnung; der Rechtstext selbst bleibt unverändert. */
  .p-doc:has(.p-toc__docs){display:flex;flex-direction:column;align-items:stretch;gap:18px}
  .p-doc:has(.p-toc__docs)>.p-toc,.p-doc:has(.p-toc__docs)>.p-doc__main{display:contents}
  .p-doc:has(.p-toc__docs) .p-toc__docs{order:1}
  .p-doc:has(.p-toc__docs) .p-doc__head{order:2;margin:0;padding-bottom:18px}
  .p-doc:has(.p-toc__docs) nav[aria-label=Inhaltsverzeichnis]{order:3;min-width:0;margin:0}
  .p-doc:has(.p-toc__docs) .p-print{order:4;align-self:flex-start;margin:0}
  .p-doc:has(.p-toc__docs) .p-legal{order:5}
  .p-doc:has(.p-toc__docs) .p-doc__main>.p-crumbs{display:none}
  .p-doc .p-toc nav.p-toc__docs{flex-wrap:nowrap;overflow-x:auto;margin:0 -20px;padding:0 20px 2px;scrollbar-width:none}
  .p-doc .p-toc nav.p-toc__docs::-webkit-scrollbar{display:none}
  .p-doc .p-toc nav.p-toc__docs p{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .p-doc .p-toc nav.p-toc__docs a{flex:none;min-height:44px;padding:0 14px;border:1.5px solid var(--s-line-strong);border-radius:999px;font-size:15px;white-space:nowrap}
  .p-doc .p-toc nav.p-toc__docs a[aria-current]{border-color:var(--s-ink);background:var(--s-signal-soft)}
  .p-section--doc:has(.p-toc__docs){padding-top:20px}

  /* Musterbericht: Hostname bricht nur an der vorgesehenen Stelle (nach „musteragentur.“). */
  .p-paper__head h2{font-size:clamp(26px,7.4vw,34px)}
}

/* Sehr schmale Bildschirme: lange deutsche Wörter in großen Überschriften dürfen trennen statt die Seite zu verbreitern. */
.p-pagehead__grid>*{min-width:0}
@media (max-width:400px){
  .p-pagehead h1,.p-hero h1,.p-section h2{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}
}
