/* Farbwelt der FIR-Folien: FIR-Blau, Hellblau-Abstufungen, Grau, Grün als Akzent. */
:root {
  color-scheme: light;
  --primary: #00549c;
  --primary-dark: #003f75;
  --primary-mid: #438cd4;
  --primary-light: #e8f1fa;
  --primary-soft: #8ebae5;
  --primary-pale: #bbd7ef;
  --accent: #57ab27;
  --accent-bg: #e2efda;
  --ink: #00549c;
  --ink-2: #0a5797;
  --text: #1f1f1f;
  --muted: #595959;
  --line: #d9d9d9;
  --line-soft: #ececec;
  --grey: #a6a6a6;
  --grey-light: #f2f2f2;
  --surface: #fff;
  --background: #fff;
  --high: #c00000;
  --high-bg: #f8e1e1;
  --medium: #c55a11;
  --medium-bg: #fbe5d6;
  --low: #3b7d1c;
  --low-bg: #e2efda;
  --s-P: #00549c;
  --s-R: #438cd4;
  --s-U: #57ab27;
  --s-M: #595959;
  --fir-magenta: #dc1968; /* Magenta des FIR-Logos (assets/fir-aachen.png) */
  --revenue: #3b7d1c; --revenue-bg: #e2efda;
  --cost: #404040; --cost-bg: #ededed;
  --availability: #00549c; --availability-bg: #e8f1fa;
  --radius: 0;
  --gutter: clamp(1rem, 2vw, 1.75rem); /* seitlicher Rand: ca. 24-28 px auf Desktop */
  --shadow: 0 0 0 transparent;
}
* { box-sizing: border-box; }
html { min-width: 320px; background: var(--background); }
body { margin: 0; color: var(--text); background: var(--background); font: 16px/1.55 Arial, "Helvetica Neue", Helvetica, sans-serif; min-height: 100vh; display: flex; flex-direction: column; }
button { font: inherit; cursor: pointer; }
[hidden] { display: none !important; }
h1, h2, h3, h4, h5 { text-wrap: balance; }
p { text-wrap: pretty; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: .6rem; left: .6rem; z-index: 20; padding: .65rem 1rem; color: #fff; background: var(--ink); transform: translateY(-180%); }
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 3px solid var(--primary); outline-offset: 3px; }
main:focus, h2:focus { outline: none; }
.muted { color: var(--muted); }
.small { font-size: .875rem; }
.print-only { display: none; }

/* Kopf */
.brand-header { background: #fff; }
.brand-header { display: flex; align-items: stretch; position: sticky; top: 0; z-index: 40; background: var(--primary); } /* blaue Leiste mit Navigation; Logos und Titel stehen in der Fußzeile */
.brand-logos { margin: 0; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; gap: .6rem 1.75rem; }
.brand-logos img { display: block; object-fit: contain; height: auto; }
.logo-pair { display: flex; align-items: center; gap: 1.25rem; }
.fir-logo { width: 130px; max-width: 40%; }
.spc-logo { width: 150px; max-width: 45%; }
.project-banner { flex: 1; min-width: 0; min-height: 4.4rem; display: flex; align-items: center; padding: 0 var(--gutter); background: var(--primary); }
.banner-inner { width: 100%; margin: 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.header-button, .home-button { display: inline-flex; align-items: center; gap: .45rem; flex-shrink: 0; min-height: 2.3rem; padding: 0 .9rem; border: 1px solid rgb(255 255 255 / 45%); border-radius: 0; background: transparent; color: #fff; font-size: .875rem; font-weight: 700; cursor: pointer; }
.header-button[hidden] { display: none; }
.header-button:hover:not([aria-disabled="true"]), .home-button:hover { background: rgb(255 255 255 / 14%); border-color: #fff; }
.header-button[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }
.header-button svg, .home-button svg { width: 1.05rem; height: 1.05rem; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.banner-inner .header-tools { margin-left: auto; } /* Hauptmenü und DE/EN rechts, auch ohne Titel in der Leiste */
}
.language-switch { display: flex; border: 1px solid rgb(255 255 255 / 45%); border-radius: 0; padding: 3px; flex-shrink: 0; }
.language-switch button { min-width: 2.75rem; min-height: 2.3rem; border: 0; border-radius: 0; color: #fff; background: transparent; font-size: .875rem; font-weight: 700; cursor: pointer; }
.language-switch button[aria-pressed="true"] { color: var(--primary); background: #fff; }

/* Layout */
.app-shell { flex: 1; width: 100%; padding: 2rem var(--gutter) 3rem; }
.view { width: 100%; margin: 0; }
.view.wide { width: 100%; }
/* Zwei Layout-Wrapper, beide linksbündig an derselben Kante: Einleitung und Fragenbereich nutzen die volle Breite;
   nur die Antwortraster bleiben kompakt (siehe .prefilter-options / #question-host). */
.full-width-introduction { width: 100%; max-width: none; padding-inline: 0; box-sizing: border-box; } /* gleiche Innenkante wie der Fragenbereich (Kartenrand + Polster) */
.full-width-introduction > :is(h2, p) { max-width: none; margin-inline: 0; } /* gemeinsamer, zentrierter Inhaltscontainer: Überschrift, Beschreibung und Fragen beginnen an derselben linken Kante */
/* Überschrift bündig mit der Frage in der Karte: Kartenrand + Kartenpolster + Zentrierung des Frageninhalts (max. 1100 px) */

.assessment-container { width: 100%; max-width: none; margin-left: 0; margin-right: 0; }
.eyebrow { margin: 0 0 .45rem; color: var(--accent); font-size: .8rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.display { margin: 0; color: var(--ink); font-size: clamp(2rem, 2.8vw, 2.6rem); font-weight: 700; line-height: 1.15; letter-spacing: normal; max-width: none; }
.hero-line { display: inline; }
.hero-line + .hero-line::before { content: ' '; }
.hero-lead { max-width: none; margin: .9rem 0 0; font-size: 1.125rem; line-height: 1.5; letter-spacing: normal; color: var(--text); }
@media (min-width: 1600px) { .hero-lead { white-space: nowrap; } } /* eine Zeile, wo die Breite reicht; darunter natürlicher Umbruch */
.hero-photo { position: relative; width: 100%; height: clamp(150px, 24vw, 380px); margin-top: 1rem; overflow: hidden; border-radius: var(--radius); } /* breites Banner über die volle Inhaltsbreite */
.hero-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 60%; display: block; }
.landing .process-steps { margin-top: 1.25rem; }
.landing .actions { margin-top: .9rem; }
/* Startseite füllt die Bildschirmhöhe: das Bild nimmt die verbleibende Höhe, die Buttons stehen knapp über dem Footer */
body { min-height: 100dvh; }
.app-shell { display: flex; flex-direction: column; }
#app-views { flex: 1; display: flex; flex-direction: column; min-height: 0; }
#intro-view:not([hidden]) { flex: 1; display: flex; flex-direction: column; }
.landing .hero-photo { flex: 1 1 auto; height: auto; min-height: clamp(150px, 24vw, 380px); }
.section-title { margin: 0; color: var(--ink); font-size: clamp(1.4rem,3vw,1.9rem); line-height: 1.2; letter-spacing: -.01em; }
.lead { font-size: 1.075rem; color: var(--muted); max-width: 62ch; margin: .8rem 0 0; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-top: 1.75rem; }
.primary-button, .secondary-button, .text-button { min-height: 3rem; display: inline-flex; align-items: center; justify-content: center; gap: .55rem; padding: .7rem 1.25rem; border-radius: 0; font-size: .9375rem; font-weight: 700; }
.primary-button { border: 1px solid var(--primary); background: var(--primary); color: #fff; }
.primary-button:hover:not(:disabled) { background: var(--primary-dark); border-color: var(--primary-dark); }
.secondary-button { border: 1px solid var(--primary); background: #fff; color: var(--primary); }
.secondary-button:hover:not(:disabled) { background: var(--primary-light); }
.text-button { border: 0; background: transparent; color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.text-button:hover { color: var(--primary); }
button:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; }
.primary-button svg, .secondary-button svg { width: 1.1rem; height: 1.1rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.icon svg, .chip-icon svg, .sprint-icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* Einstieg */
.process-steps { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: .6rem; max-width: none; margin: 0; padding: 0; list-style: none; counter-reset: st; }
.process-steps li { counter-increment: st; position: relative; display: flex; flex-direction: row; gap: .55rem; align-items: center; justify-content: center; min-height: 3.1rem; padding: .35rem 1.4rem; text-align: center; font-weight: 700; font-size: .875rem; line-height: 1.25; color: #fff; background: var(--primary-soft); --tip: 1.1rem; padding-inline: calc(var(--tip) + .6rem); clip-path: polygon(0 0, calc(100% - var(--tip)) 0, 100% 50%, calc(100% - var(--tip)) 100%, 0 100%, var(--tip) 50%); } /* Pfeilform (Chevron): Spitze rechts, Kerbe links */
.process-steps li:first-child { clip-path: polygon(0 0, calc(100% - var(--tip)) 0, 100% 50%, calc(100% - var(--tip)) 100%, 0 100%); padding-left: .9rem; } /* erster Schritt: links gerade */
.process-steps li:last-child { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, var(--tip) 50%); padding-right: .9rem; } /* letzter Schritt: rechts gerade */
.process-steps { gap: .3rem; }
.process-steps li:nth-child(2) { background: #bfbfbf; }
.process-steps li:nth-child(3) { background: var(--primary-mid); }
.process-steps li:nth-child(4) { background: var(--primary-pale); color: var(--primary); }
.process-steps li:nth-child(5) { background: var(--primary); }
.process-steps li::before { content: counter(st); flex: none; display: grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: #fff; color: var(--primary); font-size: .8rem; }

/* Sprintthemen */
.sprint-cards { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; margin-top: 1.1rem; }
#select-view .actions { margin-top: 1.75rem; }
#sec-need > .result-heading { margin-bottom: 1.1rem; } /* Ergebnis-Karte direkt unter der Überschrift (ca. 18 px) */
.sprint-card { --c: var(--primary); text-align: left; display: flex; flex-direction: column; gap: .35rem; padding: 1.25rem 1.3rem; background: #fff; border: 1.5px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); color: var(--text); transition: border-color 120ms, box-shadow 120ms, transform 120ms; }
.sprint-card.is-selected { border-color: var(--c); box-shadow: 0 0 0 3px color-mix(in srgb, var(--c) 18%, transparent), var(--shadow); }
.sprint-card h3 { margin: .4rem 0 0; font-size: 1.15rem; color: var(--ink); }
.sprint-card p { margin: 0; }
.sprint-card .card-reason { margin-top: .35rem; padding-top: .5rem; border-top: 1px solid var(--line); font-size: .875rem; color: var(--text); }
.sprint-card.is-low { opacity: .85; }
.prefilter-progress { margin: .55rem 0 .9rem; }
.step-label { margin: 0 0 .5rem; font-size: 1rem; font-weight: 700; color: var(--text); }
.step-bar { display: flex; gap: 6px; }
.step-seg { flex: 1; height: 6px; border-radius: 0; background: #e4e7ea; transition: background 200ms; }
.step-seg.is-done { background: var(--accent); }
.step-seg.is-current { background: var(--primary); }
.prefilter-questions { margin: 0; }
#prefilter-view .full-width-introduction { margin-top: -.6rem; } /* Überschrift etwas höher, bündig mit der Fortschrittsanzeige */
.prefilter-card { min-width: 0; padding: .2rem 1.5rem 0; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow); }
.prefilter-question { min-width: 0; margin: 0; padding: 0; border: 0; border-top: 1px solid transparent; min-height: 5.25rem; display: flex; align-items: center; }
.prefilter-question + .prefilter-question { border-top-color: var(--line-soft); }
.prefilter-question.is-missing { box-shadow: inset 4px 0 0 var(--high); padding-left: .75rem; }
.prefilter-question.is-missing .q-title { color: var(--high); }
.prefilter-missing { max-width: none; margin: .9rem 0 0; color: var(--high); font-weight: 600; }
.prefilter-missing:empty { display: none; }
.question-inner { width: 100%; max-width: none; margin: 0; display: grid; grid-template-columns: minmax(0, 1fr) clamp(330px, 23vw, 400px); column-gap: 1.5rem; align-items: center; } /* links Frage, rechts Slider */
.prefilter-question .q-title { text-wrap: wrap; width: 100%; max-width: none; padding: 0; margin: 0; font-size: .975rem; font-weight: 700; line-height: 1.35; letter-spacing: normal; color: var(--ink); }
/* Slider mit vier festen Positionen: Fortschritt blau, Rest hellgrau, Marken auf der Linie, gewählte Antwort darüber */
.pf-slider { min-width: 0; padding: .35rem 1.6rem; }
.pf-slider-value { display: block; min-height: 1.3rem; margin-bottom: .1rem; text-align: center; font-size: .95rem; font-weight: 700; color: var(--primary); }
.pf-slider-box { --p: 0; position: relative; height: 3.3rem; }
.pf-slider input[type="range"] { position: absolute; left: 0; top: 0; width: 100%; height: 24px; margin: 0; padding: 0; background: transparent; cursor: pointer; -webkit-appearance: none; appearance: none; }
.pf-slider input[type="range"]::-webkit-slider-runnable-track { height: 6px; border-radius: 0; background: linear-gradient(to right, var(--primary) calc(12px + (100% - 24px) * var(--p)), #dde1e5 0); }
.pf-slider input[type="range"]::-moz-range-track { height: 6px; border-radius: 0; background: linear-gradient(to right, var(--primary) calc(12px + (100% - 24px) * var(--p)), #dde1e5 0); }
.pf-slider input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 24px; height: 24px; margin-top: -9px; border-radius: 50%; border: 4px solid #fff; background: var(--primary); box-shadow: 0 0 0 2px var(--primary), 0 1px 4px rgb(0 0 0 / 25%); box-sizing: border-box; }
.pf-slider input[type="range"]::-moz-range-thumb { width: 24px; height: 24px; border-radius: 50%; border: 4px solid #fff; background: var(--primary); box-shadow: 0 0 0 2px var(--primary), 0 1px 4px rgb(0 0 0 / 25%); box-sizing: border-box; }
.pf-slider.is-unset input[type="range"]::-webkit-slider-runnable-track { background: #dde1e5; }
.pf-slider.is-unset input[type="range"]::-moz-range-track { background: #dde1e5; }
.pf-slider.is-unset input[type="range"]::-webkit-slider-thumb { opacity: 0; }
.pf-slider.is-unset input[type="range"]::-moz-range-thumb { opacity: 0; }
.pf-slider input[type="range"]:focus-visible { outline: none; }
.pf-slider input[type="range"]:focus-visible::-webkit-slider-thumb { outline: 3px solid color-mix(in srgb, var(--primary) 35%, transparent); outline-offset: 2px; }
.pf-slider input[type="range"]:focus-visible::-moz-range-thumb { outline: 3px solid color-mix(in srgb, var(--primary) 35%, transparent); outline-offset: 2px; }
.pf-tick { position: absolute; top: 7px; left: calc(12px + (100% - 24px) * var(--i)); width: 10px; height: 10px; margin-left: -5px; border-radius: 50%; box-sizing: border-box; background: #fff; border: 2px solid #b9c0c7; pointer-events: none; }
@media (min-width: 1560px) { /* Fragen links; die Slider beginnen dort, wo der dritte grüne Fortschrittsbalken beginnt (Hälfte der Breite + 3 px) und reichen bis zum rechten Rand */
  .question-inner { grid-template-columns: calc(50% + 3px) minmax(0, 1fr); column-gap: 0; }
  .prefilter-question .q-title { padding-right: 1.5rem; font-size: 1rem; line-height: 1.4; }
  .pf-slider { padding-inline: 0 2.5rem 0 0; }
  .pf-slider-value { font-size: 1.1rem; min-height: 1.5rem; }
  .pf-tick-label { font-size: .9rem; }
}
.pf-tick.is-filled { border-color: var(--primary); }
.pf-tick.is-current { visibility: hidden; }
.pf-tick-label { white-space: nowrap; position: absolute; top: 30px; left: calc(12px + (100% - 24px) * var(--i)); width: calc((100% - 24px) / 3 - 6px); max-width: 7rem; transform: translateX(-50%); text-align: center; font-size: .8rem; line-height: 1.2; color: var(--muted); cursor: pointer; }
.pf-tick-label.is-current { color: var(--primary); font-weight: 700; }
@media (max-width: 760px) {
  .prefilter-question { padding: .9rem 0 .5rem; }
  .prefilter-question .q-title { font-size: 1rem; }
  .question-inner { grid-template-columns: minmax(0, 1fr); row-gap: .4rem; }
  .pf-slider { padding-inline: 1.2rem; }
  .pf-tick-label { font-size: .72rem; white-space: normal; }
}
.prefilter-actions { width: 100%; max-width: none; margin: .25rem 0 0; padding: 1rem 0 1.25rem; border-top: 1px solid var(--line-soft); justify-content: space-between; } /* Zurück links, Zur Auswertung rechts, eine Linie */
.logo-fallback { font-weight: 700; font-size: .9rem; color: var(--primary); }
@keyframes pf-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (max-width: 560px) { .prefilter-actions { flex-direction: column-reverse; } }
.sprint-card-top { display: flex; justify-content: space-between; align-items: center; }
.sprint-icon { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; padding: .55rem; border-radius: 50%; background: color-mix(in srgb, var(--c) 12%, #fff); color: var(--c); }
.select-badge { padding: .25rem .7rem; border-radius: 0; border: 1px solid var(--line); font-size: .8rem; font-weight: 700; color: var(--muted); }
.is-selected .select-badge { background: var(--c); border-color: var(--c); color: #fff; }
.sprint-card.sprint-U { --c: var(--fir-magenta); }
.sprint-P { --c: var(--s-P); } .sprint-R { --c: var(--s-R); } .sprint-U { --c: var(--s-U); } .sprint-M { --c: var(--s-M); }
.sprint-chip { --c: var(--primary); display: inline-flex; align-items: center; gap: .4rem; padding: .25rem .65rem .25rem .45rem; border-radius: 0; background: color-mix(in srgb, var(--c) 10%, #fff); color: var(--c); font-size: .82rem; font-weight: 700; white-space: nowrap; }
.chip-icon { display: inline-block; width: 1rem; height: 1rem; }

/* Fragen */
.question-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: clamp(1.2rem,3vw,1.75rem); }
.question-meta { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.linear-progress { height: 6px; margin-top: 1rem; background: var(--line-soft); border-radius: 0; overflow: hidden; }
.linear-progress span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--primary), var(--primary-dark)); transition: width 220ms ease; }
.question-prompt { margin: .2rem 0 .45rem; color: var(--muted); font-size: .9rem; }
.question-card h2 { margin: 0; color: var(--ink); font-size: 1.3rem; font-weight: 700; line-height: 1.35; }
.question-meta { margin-bottom: .9rem; } .question-meta[hidden] { display: none; }
.question-prompt:empty { display: none; }
.question-meta:empty { display: none; }
.answer-options { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .75rem; border: 0; padding: 0; margin: 1.6rem 0 0; }
.answer-option { position: relative; display: flex; align-items: center; gap: .8rem; min-height: 4.4rem; padding: .85rem 1rem; border: 1.5px solid var(--line); border-radius: 0; background: #fff; cursor: pointer; transition: border-color 120ms, background 120ms; }
.answer-option:hover { border-color: var(--primary-soft); background: var(--primary-light); }
.answer-option:has(input:checked) { border-color: var(--primary); background: var(--primary-light); }
.answer-option:has(input:focus-visible) { outline: 3px solid var(--primary); outline-offset: 3px; }
.answer-option input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.choice-icon { display: grid; place-items: center; width: 1.9rem; height: 1.9rem; flex-shrink: 0; color: var(--muted); border: 1.5px solid var(--line); border-radius: 50%; font-weight: 700; }
.answer-option:has(input:checked) .choice-icon { background: var(--primary); color: #fff; border-color: var(--primary); }
.choice-copy { display: grid; line-height: 1.35; }
.choice-copy small { margin-top: .15rem; color: var(--muted); font-size: .85rem; }
.question-actions { display: flex; justify-content: space-between; gap: .75rem; margin-top: 1.6rem; }

/* Ergebnis */
.result-section { margin-top: 2rem; }
.back-to-questions { min-height: 2.5rem; margin-bottom: 1rem; padding: .4rem .9rem; }
.back-to-questions[hidden] { display: none; }
.result-layout { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 1.5rem; align-items: start; }
.result-panels > .result-section:first-child, .result-panels > .result-section:not(.is-tab-hidden) { margin-top: 0; }
.result-section.is-tab-hidden { display: none; }
.result-tabs { position: sticky; top: 1rem; display: flex; flex-direction: column; gap: .3rem; padding: .5rem; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.result-tab { text-align: left; padding: .65rem .8rem; border: 0; border-left: 4px solid transparent; border-radius: 0; background: transparent; color: var(--text); font: inherit; font-size: .9rem; font-weight: 600; cursor: pointer; }
.result-tab:hover { background: var(--primary-light); }
.result-tab.is-active { border-left-color: var(--primary); background: var(--primary-light); color: var(--primary); font-weight: 700; }
@media (min-width: 861px) and (max-width: 1050px) { /* fünf Pfeile nebeneinander: etwas kompakter, lange Wörter dürfen getrennt werden */
  .process-steps li { gap: .4rem; --tip: .9rem; padding-inline: calc(var(--tip) + .4rem); font-size: .8rem; hyphens: auto; -webkit-hyphens: auto; overflow-wrap: break-word; }
  .process-steps li::before { width: 1.3rem; height: 1.3rem; font-size: .72rem; }
}
@media (max-width: 860px) {
  .result-layout { display: block; }
  .result-tabs { position: static; flex-direction: row; overflow-x: auto; margin-bottom: 1rem; padding: .35rem; }
  .result-tab { flex: 0 0 auto; white-space: nowrap; border-left: 0; border-bottom: 3px solid transparent; }
  .result-tab.is-active { border-bottom-color: var(--primary); }
}
.result-heading { display: flex; align-items: center; gap: .8rem; margin: 0 0 .9rem; color: var(--primary); font-size: 1.25rem; }
.result-heading::after { content: ""; flex: 1; height: 2px; background: var(--primary); }
.section-copy { margin: -.4rem 0 1rem; max-width: 70ch; }
.status-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 1rem; }
.status-card { --c: var(--primary); display: flex; flex-direction: column; align-items: center; gap: .8rem; padding: 1.2rem; background: var(--primary-light); border: 0; border-top: 4px solid var(--c); border-radius: var(--radius); box-shadow: var(--shadow); }
.status-top { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: .5rem; }
.ring { --p: 0; --rc: var(--primary); position: relative; display: grid; place-items: center; width: 118px; height: 118px; border-radius: 50%; background: conic-gradient(var(--rc) calc(var(--p) * 1%), var(--line-soft) 0); }
.ring::after { content: ''; position: absolute; inset: 13px; border-radius: 50%; background: #fff; }
.ring span { position: relative; z-index: 1; font-size: 1.45rem; font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; }
.ring.need-high { --rc: var(--high); } .ring.need-medium { --rc: var(--medium); } .ring.need-low { --rc: var(--low); }
.need-badge { padding: .28rem .75rem; border-radius: 0; font-size: .8rem; font-weight: 700; }
.need-badge.need-high { background: var(--high-bg); color: var(--high); }
.need-badge.need-medium { background: var(--medium-bg); color: var(--medium); }
.need-badge.need-low { background: var(--low-bg); color: var(--low); }
.confidence-badge { padding: .22rem .65rem; border-radius: 0; font-size: .74rem; font-weight: 600; background: var(--grey-light); color: var(--muted); }
.confidence-badge.confidence-high { background: var(--low-bg); color: var(--low); }
.confidence-badge.confidence-medium { background: var(--medium-bg); color: var(--medium); }
.confidence-badge.confidence-low { background: var(--grey-light); color: var(--muted); border: 1px dashed var(--grey); }

/* Blockfragen: gebündelte Skalenzeilen, Mehrfachauswahl, Einfachauswahl */
/* Fragenbereich nur so breit wie die Antwortfelder: Karte, Fortschritt, Antworten und Zurück/Weiter teilen dieselben Außenkanten */
#question-view .assessment-container { max-width: calc(1100px + 2 * clamp(1.2rem, 3vw, 1.75rem) + 2px); }
#question-host { max-width: none; }
.scale-block { display: grid; gap: 1rem; margin-top: 1.4rem; }
.scale-row { padding-bottom: 1rem; border-bottom: 1px solid var(--line-soft); }
.scale-row:last-child { border-bottom: 0; padding-bottom: 0; }
.scale-row-label { margin: 0 0 .6rem; font-weight: 600; color: var(--text); }
.scale-row-options { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: .5rem; }
.answer-option.compact { min-height: 3.2rem; padding: .5rem .6rem; gap: .5rem; }
.answer-option.compact .choice-icon { width: 1.5rem; height: 1.5rem; font-size: .8rem; }
.answer-option.compact strong { font-size: .85rem; font-weight: 600; }

.multi-block { margin-top: .8rem; }
.option-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .6rem; }
.option-chip { position: relative; display: flex; align-items: center; gap: .6rem; padding: .7rem .85rem; border: 1.5px solid var(--line); border-radius: 0; background: #fff; cursor: pointer; }
.option-chip:hover { border-color: var(--primary-soft); background: var(--primary-light); }
.option-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.option-check { display: grid; place-items: center; width: 1.35rem; height: 1.35rem; flex-shrink: 0; border: 1.5px solid var(--line); border-radius: 0; color: transparent; font-size: .85rem; font-weight: 800; }
.option-chip:has(input:checked) { border-color: var(--primary); background: var(--primary-light); }
.option-chip:has(input:checked) .option-check { background: var(--primary); border-color: var(--primary); color: #fff; }
.option-label { font-size: .9rem; }
.option-meta-row { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: .8rem; }
.option-chip.meta { background: var(--grey-light); font-weight: 600; }
.choice-block { display: grid; gap: .6rem; margin-top: 1rem; }
.choice-option { min-height: 3.6rem; }

.market-notice { padding: 1.1rem 1.3rem; background: var(--medium-bg); border-left: 4px solid var(--medium); border-radius: 0; }
.market-notice strong { display: block; color: var(--ink); }
.market-notice p { margin: .5rem 0 0; }
.market-cards { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; margin-top: 1rem; }
.market-card { padding: 1.1rem 1.2rem; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); }
.market-card h4 { margin: 0 0 .4rem; color: var(--ink); }

.status-table { display: none; width: 100%; border-collapse: collapse; margin-top: 1rem; font-size: .92rem; }
.status-table th, .status-table td { text-align: left; padding: .5rem .7rem; border-bottom: 1px solid var(--line); }
.status-table th { color: var(--muted); font-weight: 600; font-size: .82rem; }
.status-table .num { font-variant-numeric: tabular-nums; font-weight: 700; }

.need-highlight { display: grid; grid-template-columns: minmax(0, 220px) 1fr; gap: 1.5rem; padding: 1.4rem; border-radius: var(--radius); background: var(--primary); color: #fff; }
.need-left { display: flex; flex-direction: column; align-items: flex-start; gap: .5rem; }
.need-left .sprint-chip { background: rgb(255 255 255 / 15%); color: #fff; }
.need-pct { margin: 0; font-size: 2.6rem; font-weight: 800; line-height: 1; }
.need-right > p { margin: 0; color: rgb(255 255 255 / 85%); }
.start-with { margin-top: 1rem; padding: 1rem 1.1rem; border-radius: 0; background: rgb(255 255 255 / 10%); border: 1px solid rgb(255 255 255 / 18%); }
.start-with .start-label { display: block; font-size: .78rem; font-weight: 700; letter-spacing: .05em; color: var(--primary-pale); }
.start-with strong { display: block; margin-top: .2rem; font-size: 1.1rem; }
.start-with p { margin: .35rem 0 0; color: rgb(255 255 255 / 75%) !important; }

.roadmap { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1rem; }
.road-col { padding: 1rem; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); display: flex; flex-direction: column; gap: .55rem; }
.road-head { display: flex; flex-direction: column; align-items: center; text-align: center; padding: .6rem 1.4rem; margin: -.2rem -.2rem .3rem; background: var(--wave); color: #fff; clip-path: polygon(6% 0, 100% 0, 94% 100%, 0 100%); }
.road-head strong { color: #fff; font-size: 1.05rem; }
.road-head .muted { color: rgb(255 255 255 / 88%); }
.wave-now { --wave: var(--primary); } .wave-next { --wave: var(--primary-mid); } .wave-later { --wave: var(--grey); }
.road-tile { display: block; padding: .6rem .7rem; border-radius: 0; background: var(--primary-light); color: inherit; text-decoration: none; border: 1px solid transparent; }
.road-tile:hover { border-color: var(--primary); }
button.road-tile { width: 100%; text-align: left; cursor: pointer; font: inherit; }
.measure-dialog { width: min(720px, calc(100vw - 2rem)); max-height: calc(100vh - 2rem); padding: 1rem; border: 0; border-radius: var(--radius); box-shadow: 0 20px 60px rgb(0 0 0 / 30%); }
.measure-dialog::backdrop { background: rgb(0 0 0 / 50%); }
.measure-dialog-head { display: flex; justify-content: flex-end; margin-bottom: .6rem; }
.measure-card.in-dialog { box-shadow: none; }
.measure-card.in-dialog .measure-details summary { display: none; }
.measure-card.in-dialog .measure-details { border-top: 0; padding-top: 0; }
.road-line { display: flex; gap: .55rem; align-items: baseline; }
.road-title { font-weight: 700; font-size: .92rem; color: var(--ink); line-height: 1.35; }
.road-meta { display: block; margin: .2rem 0 0 2.05rem; font-size: .78rem; color: var(--muted); }
.prio-num { display: inline-grid; place-items: center; min-width: 2rem; height: 2rem; padding: 0 .3rem; border-radius: 50%; background: var(--ink); color: #fff; font-weight: 800; font-size: .95rem; flex-shrink: 0; }
.prio-num.small { min-width: 1.5rem; height: 1.5rem; font-size: .78rem; }

.measure-list { display: grid; gap: 1rem; }
.measure-card { padding: 1.3rem 1.4rem; background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--wave); border-radius: var(--radius); box-shadow: var(--shadow); scroll-margin-top: 1rem; }
.measure-head { display: flex; gap: .9rem; align-items: flex-start; }
.measure-head .prio-num { min-width: 2.4rem; height: 2.4rem; font-size: 1.1rem; }
.tag-row { display: flex; flex-wrap: wrap; gap: .4rem; }
.wave-tag, .cat-tag { padding: .2rem .6rem; border-radius: 0; font-size: .75rem; font-weight: 700; }
.wave-tag { background: color-mix(in srgb, var(--wave) 14%, #fff); color: var(--wave); }
.wave-tag.wave-later { color: var(--muted); }
.cat-tag { background: var(--background); color: var(--ink); border: 1px solid var(--line); }
.cat-tag.cat-quick { background: var(--low-bg); border-color: transparent; color: var(--low); }
.measure-title { margin: .45rem 0 0; color: var(--ink); font-size: 1.15rem; line-height: 1.3; }
.meters { display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; margin: 1rem 0 0; padding: .7rem .9rem; border-radius: 0; background: var(--grey-light); }
.meter { display: flex; align-items: center; gap: .45rem; font-size: .85rem; }
.meter-label { color: var(--muted); }
.meter-value { font-weight: 700; color: var(--ink); }
.meter-dots { display: inline-flex; gap: 3px; }
.meter-dots i { width: 9px; height: 9px; border-radius: 0; background: var(--line); }
.meter-impact .meter-dots i.on { background: var(--primary); }
.meter-effort .meter-dots i.on { background: var(--primary-mid); }
.meter-time .meter-dots i.on { background: var(--muted); }
.reason-list { display: flex; flex-wrap: wrap; gap: .4rem; margin: .8rem 0 0; padding: 0; list-style: none; }
.reason-list li { padding: .2rem .6rem; border-radius: 0; background: var(--primary-light); color: var(--primary-dark); font-size: .8rem; font-weight: 600; }
.measure-desc { margin: .8rem 0 0; color: var(--text); }
.bp-label { padding: .15rem .5rem; border-radius: 0; background: var(--primary); color: #fff; font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.measure-details { margin-top: .9rem; border-top: 1px solid var(--line-soft); padding-top: .6rem; }
.measure-details summary { cursor: pointer; color: var(--primary); font-weight: 700; font-size: .9rem; }
.details-body h5 { margin: 1rem 0 .4rem; font-size: .85rem; color: var(--ink); text-transform: uppercase; letter-spacing: .04em; }
.goal-tags { display: flex; flex-wrap: wrap; gap: .4rem; }
.goal-tag { padding: .22rem .65rem; border-radius: 0; font-size: .8rem; font-weight: 700; background: var(--availability-bg); color: var(--availability); }
.goal-tag.goal-revenue { background: var(--revenue-bg); color: var(--revenue); }
.goal-tag.goal-cost { background: var(--cost-bg); color: var(--cost); }
.outcome-list, .plain-list { margin: .5rem 0 0; padding-left: 1.2rem; }
.outcome-list li, .plain-list li { margin: .15rem 0; }
.first-step { margin: 0; padding: .8rem 1rem; border-left: 3px solid var(--accent); background: var(--primary-light); border-radius: 0; font-weight: 600; }
.effort-note { margin: .9rem 0 0; }
.bp { margin-top: 1rem; padding: 1rem 1.1rem; border-radius: 0; background: var(--grey-light); border-left: 4px solid var(--primary); }
.bp-head { display: flex; align-items: center; gap: .6rem; }
.bp-company { color: var(--ink); }
.bp-title { margin: .45rem 0 0; font-weight: 700; color: var(--primary-dark); }
.bp-facts { display: grid; grid-template-columns: max-content 1fr; gap: .35rem 1rem; margin: .7rem 0 0; font-size: .9rem; }
.bp-facts dt { color: var(--muted); font-weight: 600; }
.bp-facts dd { margin: 0; }
.bp-relation { margin: .6rem 0 0; }

.matrix { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; padding: 1.5rem 0 1.5rem 1.8rem; }
.axis { position: absolute; font-size: .78rem; font-weight: 700; color: var(--muted); }
.axis-y { left: -1.6rem; top: 50%; transform: rotate(-90deg); transform-origin: center; white-space: nowrap; }
.axis-x { bottom: 0; left: 50%; transform: translateX(-50%); }
.quad { min-height: 110px; padding: .9rem 1rem; border-radius: var(--radius); border: 1px solid var(--line); background: #fff; }
.quad strong { display: block; font-size: .9rem; color: var(--ink); }
.quad-quick { background: var(--low-bg); border-color: transparent; }
.quad-strategic { background: var(--primary-light); border-color: transparent; }
.quad-low { background: var(--grey-light); border-color: transparent; }
.quad-longterm { background: #fff; border-color: var(--line); }
.quad-chips { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .6rem; }
.quad-chip { display: grid; place-items: center; min-width: 1.8rem; height: 1.8rem; border-radius: 50%; background: var(--ink); color: #fff; font-size: .8rem; font-weight: 700; }

.target-bars { display: grid; gap: 1rem; padding: 1.2rem 1.3rem; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.target-head { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: .35rem; font-size: .92rem; }
.target-head strong { font-variant-numeric: tabular-nums; color: var(--ink); }
.target-bar { position: relative; height: 12px; border-radius: 0; background: var(--line-soft); overflow: hidden; }
.target-bar span { position: absolute; left: 0; top: 0; bottom: 0; border-radius: inherit; }
.target-fill { background: var(--primary-soft); }
.current-fill { background: var(--primary); }
.target-legend { display: flex; gap: 1.2rem; margin-top: .6rem; }
.lg::before { content: ''; display: inline-block; width: .8rem; height: .8rem; margin-right: .4rem; border-radius: 0; vertical-align: -1px; }
.lg-now::before { background: var(--primary); } .lg-target::before { background: var(--primary-soft); }
.empty-note { padding: 1rem 1.2rem; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); }
.pdf-compact-only { display: none; }
.compact-list { margin: .4rem 0 0; padding-left: 1.3rem; }
.compact-list li { margin: .35rem 0; }

.export-panel { margin-top: 2.5rem; padding: 1.4rem 1.5rem; background: var(--primary-light); border: 1px solid var(--primary-pale); border-radius: var(--radius); box-shadow: var(--shadow); }
.export-panel h3 { margin: 0 0 .8rem; color: var(--ink); font-size: 1.1rem; }
.check-row { display: flex; gap: .8rem; align-items: flex-start; cursor: pointer; }
.check-row input { width: 1.25rem; height: 1.25rem; margin-top: .15rem; accent-color: var(--primary); flex-shrink: 0; }
.check-row span { display: grid; }
.check-row small { color: var(--muted); font-size: .85rem; }
.export-panel .actions { margin-top: 1.2rem; }

.site-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .8rem 2rem; padding: 1.2rem var(--gutter); border-top: 1px solid var(--line-soft); background: #fff; }
.site-footer p { margin: 0; color: var(--muted); font-size: .85rem; }
.site-footer .footer-brand { margin-left: auto; } /* Logos unten rechts */

.status-top { flex-wrap: wrap; row-gap: .25rem; }
.status-top .muted { white-space: nowrap; }
/* Übersicht (Orientierung) */
.sprint-none { --c: var(--muted); }
.question-card:focus { outline: none; }
/* Fortschrittsanzeige bleibt beim Scrollen direkt unter dem fixierten Header sichtbar (Header-Höhe per JS in --header-h) */
.question-progress { position: sticky; top: var(--header-h, 71px); z-index: 30; margin: 0 0 .75rem; padding: .45rem 0; background: var(--background); }
.question-progress + .eyebrow { margin-top: 0; }
.intro-copy { max-width: none; margin: .4rem 0 0; text-wrap: balance; font-size: 1rem; line-height: 1.55; color: var(--text); }
@media (min-width: 1560px) { .intro-copy { white-space: nowrap; } } /* auf breiten Bildschirmen einzeilig, sonst natürlicher Umbruch */
#select-title { font-size: clamp(1.1rem, 1.8vw, 1.35rem); max-width: none; text-wrap: wrap; } /* beide Sätze füllen die Zeile, erst dann Umbruch */
.select-intro { box-sizing: border-box; width: 100%; margin: .45rem 0 0; padding: 0; border: 0; background: none; color: var(--text); }
.select-intro p { margin: 0 0 .3rem; font-size: .95rem; line-height: 1.5; }
.select-intro p:last-child { margin-bottom: 0; }
.rail-total { display: grid; grid-template-columns: minmax(0, 1fr) 3rem; align-items: center; column-gap: 1rem; }
.rail-line { height: 4px; border-radius: 0; background: var(--line-soft); overflow: hidden; }
.rail-line-fill { display: block; height: 100%; background: var(--primary); transition: width 300ms ease; }
.rail-ring { --p: 0; width: 3rem; height: 3rem; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--primary) calc(var(--p) * 1%), #e4e7ea 0); }
.rail-pct { display: grid; place-items: center; width: calc(100% - 7px); height: calc(100% - 7px); border-radius: 50%; background: #fff; font-size: .66rem; font-weight: 700; color: var(--primary); font-variant-numeric: tabular-nums; }



@media (max-width: 860px) {
  .process-steps { grid-template-columns: 1fr; } /* fünf Schritte: unter 860 px untereinander statt ungleich verteilt */
  .roadmap { grid-template-columns: 1fr; }
  .need-highlight { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .question-card h2 { font-size: 1.15rem; }
  .display { font-size: 1.55rem; overflow-wrap: anywhere; }
  .landing .primary-button { white-space: normal; text-align: center; }
  .process-steps li { padding-inline: calc(var(--tip) + .6rem); font-size: .85rem; }
  .logo-pair { gap: .8rem; }
  .fir-logo { width: 95px; } .spc-logo { width: 110px; }
  .brand-header { flex-wrap: wrap; position: relative; } /* scrollt mit, bleibt aber Bezugsrahmen für das Hintergrundbild */
  .question-progress { top: 0; }
  .project-banner { flex-basis: 100%; min-height: 0; padding: .8rem 1rem; }
  .banner-inner { flex-wrap: wrap; row-gap: .6rem; }
  .site-footer { padding: 1rem; }  .app-shell { padding: 1.2rem 1rem 2rem; }
  .process-steps, .sprint-cards, .prefilter-question .prefilter-options, .answer-options, .scale-row-options, .option-grid, .overview-cols, .market-cards, .status-grid { grid-template-columns: 1fr; }
  .need-highlight { grid-template-columns: 1fr; }
  .question-actions button { flex: 1; }
  .actions { flex-direction: column; align-items: stretch; }
  .matrix { grid-template-columns: 1fr; padding-left: 0; }
  .axis { display: none; }
  .bp-facts { grid-template-columns: 1fr; }
  .measure-card { padding: 1.1rem; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; } }

@media print {
  @page { margin: 14mm; }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  html, body { background: #fff; }
  body { display: block; font-size: 11pt; }
  .result-layout { display: block; }
  .result-section.is-tab-hidden { display: block; } /* PDF enthält immer alle Abschnitte */
  .no-print, .skip-link, .brand-header, #intro-view, #select-view, #question-view { display: none !important; } /* Kopfleiste enthält nur Navigation; Logos und Titel kommen aus der Fußzeile */
  .print-only { display: block; }
  .site-footer { padding: .8rem 0 0; }
  .app-shell { display: block; padding: .8rem 0 0; }
  #overview { display: none !important; }
  .view.wide { width: 100%; }
  .print-header { margin-bottom: .5rem; }
  .pdf-kind { margin: .1rem 0 .2rem; font-size: 1.2rem; font-weight: 700; color: var(--ink); }
  .status-card, .road-col, .measure-card, .target-bars, .quad, .need-highlight, .bp { box-shadow: none; break-inside: avoid; }
  .result-section { margin-top: 1.2rem; break-inside: auto; }
  .result-heading { break-after: avoid; }
  /* Ihr aktueller Stand: Karten breit genug für lange Zielnamen; Chip und Prioritätszeile dürfen umbrechen */
  .status-grid { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; }
  .status-card { min-width: 0; padding: 12px 14px; box-sizing: border-box; }
  .status-top { flex-direction: column; align-items: center; gap: 4px; max-width: 100%; text-align: center; }
  .status-card .sprint-chip { max-width: 100%; white-space: normal; text-align: left; align-items: center; }
  .status-top .muted { white-space: normal; }
  .status-card .need-badge, .status-card .confidence-badge { max-width: 100%; white-space: normal; text-align: center; }
  .status-card .chip-icon { flex: none; }
  .status-card .need-badge, .status-card .confidence-badge { overflow-wrap: anywhere; box-sizing: border-box; }
  .ring { width: 90px; height: 90px; } .ring span { font-size: 1.1rem; }
  .measure-details summary { display: none; }
  .road-tile { break-inside: avoid; }
  /* Best Practices: volle Breite, kompakte Karten, nicht über Seiten zerschnitten */
  .market-cards { grid-template-columns: 1fr; gap: .7rem; }
  .market-card { break-inside: avoid; padding: .8rem 1rem; }
  .bp { margin-top: .6rem; padding: .7rem .9rem; font-size: 10pt; line-height: 1.4; }
  .bp-head, .bp-title { break-after: avoid; }
  .bp-facts { grid-template-columns: 8.5em minmax(0, 1fr); gap: .25rem .8rem; font-size: 10pt; }
  .bp-facts dt { font-weight: 700; color: var(--primary-dark); }
  .bp-relation { margin: .4rem 0 0; }
  /* Gesamtbild im PDF: höchstens zwei Spalten, Karten wachsen mit dem Inhalt, kein Zerschneiden einzelner Einträge */
  body[data-pdf="compact"] .pdf-full-only { display: none !important; }
  body[data-pdf="compact"] .pdf-compact-only { display: block; }
  body[data-pdf="compact"] .status-grid { display: none; }
  body[data-pdf="compact"] .status-table { display: table; }
  body[data-pdf="compact"] #sec-roadmap, body[data-pdf="compact"] #sec-target, body[data-pdf="compact"] #sec-clarify,
  body[data-pdf="compact"] #sec-overview, body[data-pdf="compact"] .market-cards { display: none; }
  body[data-pdf="full"] #sec-measures { break-before: page; }
}
/* ---------- PDF-Download: Export-Container (nur zum Rendern, außerhalb des sichtbaren Bereichs) ---------- */
.pdf-export-root { position: absolute; left: 0; top: 0; z-index: -1; width: 1000px; padding: 0; background: #fff; color: var(--text); pointer-events: none; }
.pdf-export-root .pdf-block { margin: 0; }
.pdf-export-root .pdf-title-block { padding-bottom: .4rem; }
.pdf-export-root .pdf-logos { display: flex; align-items: center; gap: 20px; padding: 0 0 10px; }
.pdf-export-root .pdf-logos img { display: block; height: auto; }
.pdf-export-root .pdf-banner { margin: 0 0 14px; padding: 14px 16px; border-radius: 0; background: var(--primary); color: #fff; font-size: 1.5rem; font-weight: 700; }
.pdf-export-root .pdf-eyebrow { margin: 0; color: var(--accent); font-size: .8rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.pdf-export-root .pdf-kind { margin: .1rem 0 .2rem; font-size: 1.4rem; font-weight: 700; color: var(--ink); }
.pdf-export-root .pdf-date { margin: 0; font-size: .85rem; color: var(--muted); }
.pdf-export-root .result-section { margin-top: 22px; display: block; }
.pdf-export-root .pdf-compact-only { display: block; }
.pdf-export-root[data-pdf="full"] .pdf-compact-only { display: none; }
.pdf-export-root[data-pdf="compact"] .status-grid, .pdf-export-root[data-pdf="compact"] .market-cards { display: none; }
.pdf-export-root[data-pdf="compact"] .status-table { display: table; }
/* html2canvas kennt color-mix() nicht → feste Ersatzfarben */
.pdf-export-root .sprint-chip { background: #e8f1fa; }
.pdf-export-root .need-left .sprint-chip { background: rgb(255 255 255 / 18%); color: #fff; }
.pdf-export-root .wave-tag { background: #e9eef4; }
.pdf-export-root .sprint-icon { background: #e8f1fa; }
.pdf-export-root .market-cards { grid-template-columns: 1fr; }
.pdf-export-root .status-grid { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; }
.pdf-export-root .status-top { flex-direction: column; text-align: center; }
.pdf-export-root .status-card .sprint-chip { max-width: 100%; white-space: normal; }
.pdf-export-root .status-top .muted { white-space: normal; }
.pdf-export-root .ring::after { inset: 13px; }

/* Kopf: Seitentitel links, Hauptmenü + Sprachwahl rechts (blauer Bereich) */
html { scroll-padding-top: 9rem; }
.header-tools { display: flex; align-items: center; gap: .75rem; flex-shrink: 0; }

/* Ihre Priorisierung (Drag & Drop) */
.visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.priority-panel { max-width: 760px; margin: 1.6rem 0 0; }
.priority-title { margin: 0 0 .6rem; font-size: 1.05rem; color: var(--ink); }
.priority-list { margin: 0; padding: 0; list-style: none; display: grid; gap: .45rem; }
.priority-list.is-sorting { user-select: none; -webkit-user-select: none; }
.priority-item { --c: var(--s-P); position: relative; display: flex; align-items: center; gap: .75rem; padding: .5rem .5rem .5rem .8rem; border: 1px solid transparent; border-radius: 0; background: #f2f7fc; cursor: grab; touch-action: pan-y; }
.priority-item.sprint-U { --c: var(--fir-magenta); }
.priority-item:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.priority-item.is-grabbed { border-color: var(--primary); background: #fff; box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 18%, transparent); }
.priority-item.is-dragging { z-index: 5; cursor: grabbing; border-color: var(--primary); background: #fff; box-shadow: 0 6px 18px rgb(0 84 156 / 22%); }
.priority-handle { flex: none; display: grid; place-items: center; width: 1.1rem; color: #8a97a5; touch-action: none; cursor: grab; }
.priority-handle svg { width: .7rem; height: 1.05rem; fill: currentColor; }
.priority-num { flex: none; width: 1.1rem; text-align: center; font-weight: 700; color: var(--primary); }
.priority-icon { flex: none; width: 1.9rem; height: 1.9rem; padding: .4rem; }
.priority-name { flex: 1; min-width: 0; font-weight: 600; color: var(--ink); }
.priority-remove { flex: none; display: grid; place-items: center; width: 1.9rem; height: 1.9rem; border: 0; border-radius: 0; background: transparent; color: var(--muted); cursor: pointer; }
.priority-remove svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; }
.priority-remove:hover:not([aria-disabled="true"]) { background: #dfeaf5; color: var(--primary); }
.priority-remove[aria-disabled="true"] { opacity: .35; cursor: not-allowed; }
.priority-item.sprint-R { --c: var(--s-R); } .priority-item.sprint-M { --c: var(--s-M); }
@media (max-width: 560px) { .priority-panel { max-width: none; } }
.priority-placeholder { list-style: none; border: 1px dashed var(--primary); border-radius: 0; background: rgb(0 84 156 / 5%); }
.sprint-card.is-addable { cursor: pointer; }
.sprint-card.is-addable:hover { border-color: var(--c); box-shadow: 0 0 0 3px color-mix(in srgb, var(--c) 12%, transparent); }
.sprint-card.is-addable:focus-visible { outline: 2px solid var(--c); outline-offset: 2px; }
/* Kernaussage der Ergebnisse: Handlungsbedarf, zusätzliche Potenziale, nicht beurteilbar */
.ring.need-unclear { --rc: #9aa3ab; }
.need-badge.need-unclear { background: #eceff1; color: var(--muted); }
.need-highlight.need-low, .need-highlight.need-unclear { grid-template-columns: 1fr; }
.need-categories { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: .75rem; margin-top: .9rem; }
.need-cat { padding: .8rem 1rem; border: 1px solid var(--line); border-top: 4px solid var(--primary); border-radius: var(--radius); background: #fff; }
.need-cat-potential { border-top-color: var(--s-R); }
.need-cat-unclear { border-top-color: #9aa3ab; }
.need-cat h4 { margin: 0 0 .45rem; font-size: .95rem; color: var(--ink); }
.need-cat p { margin: 0; }
.need-cat .plain-list { margin: 0; padding-left: 1.1em; }

/* ===== Ergebnis in fünf Bereichen ===== */
.result-tabs { counter-reset: tab; }
.result-tab::before { counter-increment: tab; content: counter(tab); display: inline-grid; place-items: center; width: 1.4rem; height: 1.4rem; margin-right: .5rem; border-radius: 50%; background: var(--primary-light); color: var(--primary); font-size: .78rem; font-weight: 700; }
.result-tab.is-active::before { background: var(--primary); color: #fff; }
.result-summary { padding: 1rem 1.2rem; border-radius: var(--radius); background: var(--primary-light); border-left: 5px solid var(--primary); }
.result-summary.need-high { border-left-color: var(--high); }
.result-summary.need-medium { border-left-color: var(--medium); }
.result-summary.need-low { border-left-color: var(--low); }
.result-summary.need-unclear { border-left-color: #9aa3ab; }
.summary-title { margin: 0 0 .3rem; font-size: 1.15rem; color: var(--ink); }
.summary-copy { margin: 0; }
.goal-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .9rem; margin-top: 1rem; }
.goal-card { --c: var(--primary); display: flex; flex-direction: column; align-items: flex-start; gap: .55rem; min-width: 0; padding: 1rem 1.1rem; background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--c); border-radius: var(--radius); }
.goal-card.sprint-P { --c: var(--s-P); } .goal-card.sprint-R { --c: var(--s-R); } .goal-card.sprint-U { --c: var(--s-U); } .goal-card.sprint-M { --c: var(--s-M); }
.goal-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; width: 100%; }
.goal-pct { margin: 0; font-size: 1.8rem; font-weight: 700; line-height: 1; color: var(--ink); }
.goal-bar { width: 100%; height: 10px; border-radius: 0; background: #e4e7ea; overflow: hidden; }
.goal-fill { display: block; height: 100%; border-radius: 0; background: var(--primary); }
.goal-card.need-high .goal-fill { background: var(--high); } .goal-card.need-medium .goal-fill { background: var(--medium); } .goal-card.need-low .goal-fill { background: var(--low); }
.goal-copy { margin: 0; font-size: .88rem; }
.need-badge.need-potential { background: var(--primary-light); color: var(--primary); white-space: normal; }
details.result-more { margin-top: 1.1rem; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.result-more > summary { padding: .7rem 1rem; cursor: pointer; font-weight: 700; color: var(--primary); }
.result-more-body { padding: 0 1rem 1rem; }
.result-more-body h4 { margin: 1rem 0 .5rem; color: var(--ink); }
.measure-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: .9rem; }
button.measure-tile { display: flex; flex-direction: column; gap: .55rem; width: 100%; padding: .9rem 1rem; background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--wave, var(--primary)); border-radius: var(--radius); text-align: left; cursor: pointer; font: inherit; }
button.measure-tile:hover { border-color: var(--primary); box-shadow: 0 2px 10px rgb(0 84 156 / 12%); }
.tile-head { display: flex; align-items: flex-start; gap: .55rem; }
.tile-tags { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.tile-block { display: block; }
.tile-block strong { display: block; margin-bottom: .1rem; font-size: .78rem; color: var(--muted); }
.tile-text { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; font-size: .88rem; line-height: 1.4; color: var(--text); }
.tile-more { margin-top: auto; font-size: .82rem; font-weight: 700; color: var(--primary); }
.step-flow { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; counter-reset: stepn; }
.step-item { counter-increment: stepn; position: relative; padding: .9rem 1rem .9rem 3.3rem; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); }
.step-item::before { content: counter(stepn); position: absolute; left: .95rem; top: .9rem; display: grid; place-items: center; width: 1.7rem; height: 1.7rem; border-radius: 50%; background: var(--primary); color: #fff; font-weight: 700; }
.step-label { margin: 0 0 .35rem; font-size: .95rem; color: var(--ink); }
.step-text { margin: .3rem 0 0; font-size: .92rem; }
.step-item .plain-list { margin: .3rem 0 0; }
.step-link { padding: 0; border: 0; background: none; font: inherit; font-weight: 700; color: var(--primary); text-align: left; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.matrix-legend { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1.2rem; margin-bottom: .8rem; font-size: .85rem; }
.matrix-legend-title { color: var(--ink); }
.legend-item { display: inline-flex; align-items: center; gap: .4rem; }
.legend-swatch { display: inline-block; flex: none; width: .9rem; height: .9rem; border: 1px solid var(--line); border-radius: 0; }
.quad-list { display: grid; gap: .3rem; margin-top: .6rem; }
.quad-item { display: flex; align-items: center; gap: .5rem; padding: .25rem .3rem; border: 0; border-radius: 0; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.quad-item:hover { background: rgb(255 255 255 / 70%); }
.quad-title { font-size: .88rem; font-weight: 600; color: var(--ink); }
.matrix-hint { margin: .6rem 0 0; }
.bp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: .9rem; }
button.bp-card { display: flex; flex-direction: column; gap: .4rem; padding: .9rem 1rem; background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--primary); border-radius: var(--radius); text-align: left; font: inherit; cursor: pointer; }
button.bp-card:hover { border-color: var(--primary); box-shadow: 0 2px 10px rgb(0 84 156 / 12%); }
.bp-card-company { color: var(--ink); }
.bp-card-title { font-size: .92rem; font-weight: 700; color: var(--primary-dark); }
.bp-card-for { font-size: .78rem; color: var(--muted); }
.bp-card-short { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: .86rem; line-height: 1.4; }
.bp-details { display: none; }
.practice-view .bp { margin-top: 0; }
@media (max-width: 560px) { .measure-grid, .bp-grid { grid-template-columns: 1fr; } }
/* PDF */
.pdf-export-root .goal-cards, .pdf-export-root .measure-grid, .pdf-export-root .bp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pdf-export-root .tile-text, .pdf-export-root .bp-card-short { display: block; overflow: visible; -webkit-line-clamp: unset; }
.pdf-export-root .tile-more { display: none; }
.pdf-export-root .result-more > summary { list-style: none; }
.pdf-export-root summary { display: block; list-style: none; } /* kein Aufklapp-Symbol (html2canvas zeichnet es sonst als „1.“) */
.pdf-export-root summary::-webkit-details-marker { display: none; }
.pdf-export-root[data-pdf="full"] .bp-details { display: grid; grid-template-columns: 8.5em minmax(0, 1fr); gap: .25rem .8rem; margin: .4rem 0 0; font-size: .85rem; }
.pdf-export-root .bp-details dt { font-weight: 700; color: var(--primary-dark); }
.pdf-export-root .bp-details dd { margin: 0; }
.pdf-export-root .quad-item, .pdf-export-root button.measure-tile, .pdf-export-root button.bp-card { cursor: default; }
/* Navigation der Ergebnisse: jeder Menüpunkt einzeilig, die Leiste wird so breit wie der längste Eintrag */
.result-tab { white-space: nowrap; }
/* FIR-Magenta (Logo) für Hauptmenü sowie Fortsetzen / Von vorn beginnen */
/* Voraussetzungen-Check */
.prereq-check { margin-top: 1.4rem; padding: 1.1rem 1.2rem; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.prereq-title { margin: 0 0 .3rem; font-size: 1.05rem; color: var(--ink); }
.ladder-title { display: block; margin: .9rem 0 .4rem; color: var(--ink); font-size: .9rem; }
.stage-ladder { display: grid; gap: .5rem; }
.stage-row { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; }
.stage-goal { min-width: 11rem; font-weight: 700; color: var(--ink); font-size: .9rem; }
.stage-pills, .stage-legend { display: inline-flex; flex-wrap: wrap; gap: .4rem; }
.stage-pill { display: inline-flex; align-items: center; gap: .15rem; padding: .25rem .7rem; border: 1px solid transparent; border-radius: 0; font: inherit; font-size: .82rem; font-weight: 700; }
button.stage-pill { cursor: pointer; }
button.stage-pill:hover { box-shadow: 0 0 0 2px rgb(0 84 156 / 20%); }
.stage-sym { font-weight: 800; }
.stage-met, .prereq-badge.st-met { background: var(--low-bg); color: var(--low); }
.stage-open, .prereq-badge.st-open { background: var(--high-bg); color: var(--high); }
.stage-unknown, .prereq-badge.st-unknown { background: #eceff1; color: var(--muted); }
.prereq-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: .75rem; margin-top: .9rem; }
.prereq-row { padding: .8rem .95rem; border: 1px solid var(--line); border-left: 4px solid #9aa3ab; border-radius: var(--radius); background: #fff; }
.prereq-row.status-met { border-left-color: var(--low); } .prereq-row.status-open { border-left-color: var(--high); }
.prereq-row p { margin: .25rem 0 0; }
.prereq-head { display: flex; flex-direction: column; align-items: flex-start; gap: .3rem; }
.prereq-badge { padding: .15rem .55rem; border-radius: 0; font-size: .78rem; font-weight: 700; }
.prereq-for { font-size: .85rem; }
.prereq-empty { margin: .9rem 0 0; font-weight: 600; color: var(--ink); }
.prereq-focus { margin-top: .9rem; padding: .8rem 1rem; border-left: 5px solid var(--primary); border-radius: var(--radius); background: var(--primary-light); }
.prereq-focus p { margin: .2rem 0 0; }
.pdf-export-root .prereq-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pdf-export-root button.stage-pill { cursor: default; }
/* Startseite: Fortsetzen / Von vorn beginnen direkt auf dem Bild, im hellen linken Bereich */
.hero-stage { position: relative; flex: 1 1 auto; display: flex; margin-top: 1rem; min-height: clamp(280px, 24vw, 380px); }
.landing .hero-stage .hero-photo { flex: 1 1 auto; margin-top: 0; }
.hero-actions { position: absolute; left: 0; top: 50%; transform: translateY(-50%); z-index: 2; max-width: 46%; margin: 0 !important; flex-wrap: wrap; row-gap: .8rem; }
.hero-actions .primary-button, .hero-actions .secondary-button { min-height: clamp(3.4rem, 5vw, 4.4rem); padding: .9rem clamp(1.4rem, 2.6vw, 2.4rem); font-size: clamp(1rem, 1.4vw, 1.2rem); background: var(--primary); border-color: var(--primary); color: #fff; box-shadow: 0 6px 18px rgb(0 84 156 / 25%); }
.hero-actions .primary-button:hover:not(:disabled), .hero-actions .secondary-button:hover:not(:disabled) { background: var(--primary-dark); border-color: var(--primary-dark); transform: translateY(-1px); }
.hero-actions .primary-button svg, .hero-actions .secondary-button svg { width: 1.3rem; height: 1.3rem; }
/* Bild bildschirmfüllend: über die volle Fensterbreite (ohne Seitenrand) bis zum unteren Fensterrand, ohne Rundung */
.landing .hero-stage { margin: 1rem calc(-1 * var(--gutter)) -3rem; }
.landing .hero-stage .hero-photo { border-radius: 0; }
.landing .hero-actions { left: var(--gutter); }
@media (max-width: 860px) {
  .hero-stage { display: block; min-height: 0; }
  .landing .hero-stage { margin-bottom: 0; }
  .hero-actions { position: static; transform: none; max-width: none; margin: .9rem var(--gutter) 0 !important; }
  .landing .hero-stage .hero-photo { height: clamp(150px, 40vw, 260px); }
}
/* Voraussetzungen-Check (kompakt) */
.prereq-lead { margin: .2rem 0 .8rem; font-weight: 600; color: var(--ink); }
.prereq-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.prereq-more .prereq-steps { margin-top: .6rem; }
.prereq-step { position: relative; padding: .7rem .9rem .7rem 3rem; border: 1px solid var(--line); border-left: 4px solid #9aa3ab; border-radius: var(--radius); background: #fff; }
.prereq-step.status-open { border-left-color: var(--high); }
.prereq-num { position: absolute; left: .85rem; top: .7rem; display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--primary); color: #fff; font-size: .85rem; font-weight: 700; }
.prereq-head { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .7rem; }
.prereq-name { font-size: 1rem; }
.prereq-why { margin: .25rem 0 0; font-size: .88rem; color: var(--text); }
details.prereq-more { margin-top: .7rem; }
.prereq-more > summary { cursor: pointer; font-weight: 700; color: var(--primary); }
.prereq-step .prereq-head { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-start; text-align: left; gap: .3rem .7rem; }
.prereq-step .prereq-name { text-align: left; }
/* Gesamtbild: Statusübersicht mit kompakten, nicht interaktiven Kacheln */
.overview-cols { display: grid; gap: .7rem; }
.overview-col { --tint: var(--line-soft); --ink-s: var(--ink); padding: .7rem .9rem; border: 1px solid var(--tint); border-radius: var(--radius); background: #fff; }
.overview-col.is-empty { padding: .4rem .9rem; background: #fafbfc; }
.overview-strong { --tint: var(--low-bg); --ink-s: var(--low); }
.overview-partial { --tint: var(--medium-bg); --ink-s: var(--medium); }
.overview-missing { --tint: var(--high-bg); --ink-s: var(--high); }
.overview-unclear { --tint: #eceff1; --ink-s: var(--muted); }
.overview-head { display: flex; flex-wrap: wrap; align-items: center; gap: .15rem .55rem; }
.overview-head h4 { margin: 0; font-size: .95rem; color: var(--ink); }
.overview-sym { display: grid; place-items: center; width: 1.45rem; height: 1.45rem; border-radius: 50%; background: var(--tint); color: var(--ink-s); font-size: .85rem; font-weight: 800; }
.overview-count { font-size: .85rem; color: var(--muted); }
.overview-col p { margin: .4rem 0 0; }
.overview-tiles { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .6rem; }
.overview-tile { padding: .35rem .75rem; border-radius: 0; background: var(--tint); color: var(--ink); font-size: .85rem; font-weight: 600; line-height: 1.3; cursor: default; user-select: text; }
.sprint-card-top .select-badge { margin-left: auto; } /* ohne Ziel-Icon steht das Prioritätslabel weiterhin rechts */

/* ---------- Einstieg: fünf Use-Case-Karten (Seite „Ihr Einstieg ins strategische Ersatzteilmanagement“) ---------- */
/* Gestaltung nach FIR-/RWTH-Master: Arial, FIR-Blau #00549C, Hellblau #8EBAE5, Text #5A5A5A, Linien #D9E6F2; eckig, ohne Schatten und Verläufe */
.usecase-cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .75rem; margin: 1.1rem 0 .9rem; font-family: Arial, Helvetica, sans-serif; }
.usecase-card { position: relative; display: grid; grid-template-rows: subgrid; grid-row: span 4; min-width: 0; /* Kopf, Ziel, „Details anzeigen“ und Button liegen in allen Karten einer Reihe auf gleicher Höhe */ box-sizing: border-box; cursor: pointer; background: #fff; border: 1px solid #d9e6f2; border-radius: 0; box-shadow: none; color: #5a5a5a; }
.usecase-card.is-selected { border-color: #00549c; outline: 1px solid #00549c; outline-offset: -2px; }
.usecase-card:has(.usecase-input:focus-visible) { outline: 3px solid #8ebae5; outline-offset: 2px; }
.usecase-input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.usecase-head { position: relative; display: block; min-height: 4.4rem; padding: .8rem 3.2rem .85rem .9rem; overflow: hidden; background: #00549c; color: #fff; }
.usecase-deco { position: absolute; width: 34px; height: 34px; background: #8ebae5; opacity: .35; }
.usecase-deco-a { right: 14px; top: -6px; }
.usecase-deco-b { right: -6px; top: 14px; }
.usecase-no { position: relative; display: block; margin-bottom: .2rem; font-size: .82rem; font-weight: 700; color: #8ebae5; }
.usecase-title { position: relative; display: block; font-size: 1rem; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; hyphens: auto; }
.usecase-body { display: contents; } /* Ziel und „Details anzeigen“ sind eigene Zeilen des Karten-Rasters (Subgrid) */
.usecase-goal { padding: .85rem .9rem 0; }
.usecase-details { align-self: start; margin: .8rem .9rem 0; } /* oben in seiner Zeile: alle „Details anzeigen“-Felder auf einer Linie, unabhängig von der Textlänge */
.usecase-goal, .usecase-foot, .usecase-more, .usecase-metric { display: block; }
.usecase-label { display: block; margin: 0 0 .2rem; font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #00549c; }
.usecase-text { display: block; font-size: .875rem; line-height: 1.5; color: #5a5a5a; }
.usecase-small { font-size: .8rem; }
.usecase-summary { display: flex; align-items: center; justify-content: space-between; padding: .5rem 0; border-top: 1px solid #d9e6f2; border-bottom: 1px solid #d9e6f2; list-style: none; cursor: pointer; font-size: .875rem; font-weight: 700; color: #00549c; }
.usecase-summary::-webkit-details-marker { display: none; }
.usecase-summary::marker { content: ''; }
.usecase-chevron { width: 1rem; height: 1rem; flex: none; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: square; transition: transform 150ms; }
.usecase-details[open] .usecase-chevron { transform: rotate(180deg); }
.usecase-more { padding-top: .65rem; }
.usecase-more > .usecase-label { margin-bottom: .55rem; }
.usecase-metric { margin-bottom: .65rem; padding: .25rem 0 .25rem .65rem; border-left: 3px solid #00549c; }
.usecase-value { display: block; font-size: 1.35rem; font-weight: 700; line-height: 1.2; color: #00549c; }
.usecase-extra { margin-bottom: .2rem; }
.usecase-level { display: flex; align-items: center; gap: 3px; margin: .25rem 0; }
.usecase-sq { display: inline-block; flex: none; width: 12px; height: 12px; background: #d9e6f2; border-radius: 0; }
.usecase-sq.is-on { background: #00549c; }
.usecase-level-text { margin-left: .35rem; font-size: .875rem; font-weight: 700; color: #00549c; }
.usecase-select { align-self: end; display: flex; align-items: center; justify-content: center; gap: .4rem; margin: .9rem; padding: .55rem .5rem; border: 1.5px solid #00549c; border-radius: 0; background: #fff; color: #00549c; font-size: .875rem; font-weight: 700; text-align: center; transition: background 120ms, color 120ms; }
.usecase-card:hover .usecase-select, .usecase-card.is-selected .usecase-select { background: #00549c; color: #fff; }
.usecase-check { display: none; width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: square; }
.usecase-card.is-selected .usecase-check { display: block; }
.usecase-legend-row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .75rem; margin-top: .8rem; font-family: Arial, Helvetica, sans-serif; font-size: .75rem; color: #5a5a5a; }
.usecase-note { max-width: 34rem; margin: 0; }
.usecase-legend { display: flex; flex-wrap: wrap; gap: .9rem; margin: 0; }
.usecase-legend-item { display: inline-flex; align-items: center; gap: 3px; }
.usecase-legend-item > span:last-child { margin-left: .25rem; }
/* „Weiter“ nach der Use-Case-Auswahl: zwei dezente Pulse (max. 3 % größer, sanfter blauer Leuchtrand), ca. 2 s; transform/box-shadow verschieben nichts */
@keyframes next-pulse {
  0%, 100% { transform: scale(1); box-shadow: 0 0 0 0 rgb(0 84 156 / 0%); }
  50% { transform: scale(1.03); box-shadow: 0 0 0 6px rgb(0 84 156 / 18%), 0 0 14px 2px rgb(0 84 156 / 28%); }
}
#prefilter-suggest.is-pulsing:not(:disabled) { animation: next-pulse 1s ease-in-out 2; }
@media (prefers-reduced-motion: reduce) { #prefilter-suggest.is-pulsing { animation: none; } }
.usecase-hint { margin: .9rem 0 0; }
.usecase-hint[hidden] { display: none; }
@media (max-width: 1180px) { .usecase-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .usecase-cards { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Ergebnisübersicht: einheitliche Formatierung (gilt auch im PDF, da dort die Abschnitte geklont werden) ----------
   Zwischenüberschriften 1rem · Maßnahmentitel .95rem fett FIR-Blau · Beschreibungstexte .95rem/1.45 · keine Aufzählungszeichen */
.result-section :is(.step-label, .need-cat h4, .prereq-title, .result-more-body h4, .quad > strong) { margin: 0 0 .45rem; font-size: 1rem; font-weight: 700; line-height: 1.3; color: var(--ink); }
.result-section :is(.step-link, .step-measure, .prereq-name, .road-title, .quad-title, .bp-card-title) { font-size: .95rem; font-weight: 700; line-height: 1.35; color: var(--primary); }
.result-section :is(.step-measure, strong.prereq-name) { text-decoration: none; } /* nicht anklickbar: gleiche Schrift, aber nicht wie ein Link */
.result-section .step-link { text-decoration: underline; text-underline-offset: 3px; }
.result-section :is(.summary-copy, .step-text, .prereq-why, .prereq-lead, .tile-text, .bp-card-short, .goal-copy, .need-cat li, .plain-list li) { font-size: .95rem; line-height: 1.45; color: var(--text); }
.result-section .prereq-lead { font-weight: 600; }
.result-section .plain-list { list-style: none; margin: .4rem 0 0; padding: 0; } /* keine Aufzählungszeichen, keine Einrückung */
.result-section .plain-list li { margin: 0 0 .35rem; }
.result-section .plain-list li:last-child { margin-bottom: 0; }
.result-section .need-cat .plain-list { margin: 0; padding: 0; }
.result-section .step-text { margin: .35rem 0 0; }
.result-section .step-item > .step-link { display: inline-block; }
.result-section .step-item > .muted.small { margin: .5rem 0 0; }

/* ---------- Kopfleiste: einfarbig sanftes Blau; links Menü-Symbol, Hauptmenü, ggf. Zurück zu den Fragen / Zur Auswertung; rechts DE/EN ---------- */
.brand-header { background: #dce9f6; border-bottom: 1px solid #c6dbef; } /* Position (sticky, mobil mitscrollend) aus den Grundregeln */
.brand-header .project-banner { min-height: 4.5rem; padding: .85rem var(--gutter); background: transparent; }
.brand-header .banner-inner { justify-content: flex-start; gap: .6rem; }
.brand-header .header-button { min-height: 2.75rem; padding: 0 1rem; border: 0; border-radius: 0; background: var(--primary); color: #fff; font-size: .95rem; font-weight: 700; box-shadow: 0 1px 3px rgb(0 40 90 / 18%); transition: background-color 150ms; }
.brand-header .header-button:hover:not([aria-disabled="true"]) { background: var(--primary-dark); border-color: transparent; }
.brand-header .header-button:focus-visible { outline: 3px solid color-mix(in srgb, var(--primary) 40%, transparent); outline-offset: 2px; }
.brand-header .menu-button { width: 2.75rem; padding: 0; justify-content: center; }
.brand-header .menu-button svg { width: 1.5rem; height: 1.5rem; stroke-width: 2.4; }
.brand-header .back-to-questions { margin: 0; }
.brand-header .header-brand { margin-left: auto; margin-right: 1.25rem; flex: none; } /* Logos rechts oben, links neben DE/EN */
.brand-header .header-brand .logo-pair { gap: 1.5rem; }
.brand-header .header-brand { margin-block: -.4rem; } /* Logos nutzen die volle Höhe der blauen Leiste, ohne sie zu vergrößern */
.brand-header .header-brand img { width: auto; max-width: none; height: 3.55rem; mix-blend-mode: multiply; } /* beide Logos gleich hoch; weißer Bildhintergrund verschmilzt mit dem Hellblau */
@media (max-width: 1050px) { /* mittlere Breite: Logos kleiner, damit DE/EN in der Leiste bleibt */
  .brand-header .header-brand { margin: 0 .5rem 0 auto; }
  .brand-header .header-brand .logo-pair { gap: 1rem; }
  .brand-header .header-brand img { height: 2.5rem; }
}
@media (max-width: 800px) { /* schmal: Logos in eigener Zeile unter den Buttons, rechtsbündig */
  .brand-header .banner-inner { flex-wrap: wrap; row-gap: .6rem; }
  .brand-header .header-brand { order: 4; width: 100%; margin: 0; justify-content: flex-end; }
}
.brand-header .language-switch { margin-left: 0; padding: 0; gap: 0; border: 1px solid var(--primary); border-radius: 0; overflow: hidden; background: #fff; box-shadow: 0 1px 3px rgb(0 40 90 / 18%); }
.brand-header .language-switch button { min-width: 3.1rem; min-height: calc(2.75rem - 2px); border-radius: 0; color: var(--primary); background: #fff; font-size: .95rem; }
.brand-header .language-switch button[aria-pressed="true"] { color: #fff; background: var(--primary); }
.brand-header .language-switch button:not([aria-pressed="true"]):hover { background: var(--primary-light); }
@media (max-width: 800px) { .brand-header .language-switch { margin-left: auto; } } /* Logos in eigener Zeile: DE/EN bleibt rechts */
@media (max-width: 560px) { /* Zeile 1: Menü + Hauptmenü links, DE/EN rechts; weitere Buttons darunter */
  .brand-header .project-banner { min-height: 0; padding: .7rem 1rem; }
  .brand-header .banner-inner { flex-wrap: wrap; row-gap: .6rem; }
  .brand-header :is(#to-results, #back-to-questions) { order: 3; }
  .brand-header .header-button { padding: 0 .8rem; }
  .brand-header .menu-button { padding: 0; }
  .brand-header .language-switch { margin-left: auto; }
  .brand-header .header-brand { order: 4; width: 100%; margin: 0; justify-content: flex-end; } /* schmal: Logos in eigener Zeile darunter, rechtsbündig */
  .brand-header .header-brand .logo-pair { justify-content: flex-end; gap: 1rem; }
  .brand-header .header-brand img { height: 2.35rem; }
}

/* ---------- Fußzeile: weiß; Projekttitel (groß) etwa ab der Mitte, direkt links neben den Logos ---------- */
.site-footer { flex-wrap: nowrap; justify-content: flex-end; align-items: center; gap: 2.5rem; }
.site-footer .footer-brand { flex: none; margin-left: 0; }
.site-footer .logo-pair { gap: 1.75rem; }
.site-footer .footer-brand img { width: auto; max-width: none; height: 2.75rem; } /* beide Logos gleich hoch */
@media (max-width: 560px) { /* schmal: Titel und Logos zentriert untereinander */
  .site-footer { flex-wrap: wrap; justify-content: center; gap: .8rem 1.25rem; }
  .site-footer .logo-pair { gap: 1rem; }
  .site-footer .footer-brand img { height: 2rem; }
}

/* ---------- Seitennavigation (Hamburger-Menü): ca. 300 px, weiß, dunkelblaue Schrift, sanftes Ein-/Ausblenden ---------- */
dialog.nav-menu { position: fixed; inset: 0 auto 0 0; width: min(300px, 86vw); max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; border-right: 1px solid var(--line); background: #fff; color: var(--ink); box-shadow: 6px 0 24px rgb(0 40 90 / 18%); animation: nav-in 220ms ease-out; }
dialog.nav-menu::backdrop { background: rgb(0 30 60 / 35%); animation: nav-fade 220ms ease-out; }
dialog.nav-menu.is-closing { animation: nav-out 180ms ease-in forwards; }
dialog.nav-menu.is-closing::backdrop { animation: nav-fade-out 180ms ease-in forwards; }
@keyframes nav-in { from { transform: translateX(-100%); } to { transform: none; } }
@keyframes nav-out { from { transform: none; } to { transform: translateX(-100%); } }
@keyframes nav-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes nav-fade-out { from { opacity: 1; } to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { dialog.nav-menu, dialog.nav-menu::backdrop { animation: none; } }
.nav-menu-inner { display: flex; flex-direction: column; gap: 1.1rem; min-height: 100%; padding: 1rem 1rem 1.5rem; box-sizing: border-box; }
.nav-menu-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding-bottom: .8rem; border-bottom: 1px solid var(--line-soft); }
.nav-menu-title { margin: 0; font-size: 1.1rem; font-weight: 700; color: var(--primary); }
.nav-menu-close { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; padding: 0; border: 1px solid var(--line); border-radius: 0; background: #fff; color: var(--primary); cursor: pointer; }
.nav-menu-close:hover { background: var(--primary-light); }
.nav-menu-close svg { width: 1.2rem; height: 1.2rem; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; }
.nav-section-label { margin: 0 0 .45rem; font-size: .78rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.nav-steps { list-style: none; margin: -.6rem 0 0; padding: 0; display: grid; gap: .25rem; }
.nav-step-button { display: flex; align-items: center; gap: .7rem; width: 100%; min-height: 2.9rem; padding: .45rem .6rem; border: 0; border-radius: 0; background: transparent; color: var(--ink); font: inherit; font-size: .95rem; font-weight: 700; text-align: left; cursor: pointer; }
.nav-step-button:hover:not(:disabled) { background: var(--primary-light); }
.nav-step-button:focus-visible, .nav-action:focus-visible, .nav-menu-close:focus-visible { outline: 3px solid color-mix(in srgb, var(--primary) 40%, transparent); outline-offset: 1px; }
.nav-step-mark { flex: none; display: grid; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--primary-light); color: var(--primary); font-size: .78rem; font-weight: 800; }
.nav-step-mark svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.nav-step.is-done .nav-step-mark { background: var(--low-bg); color: var(--low); }
.nav-step.is-current .nav-step-button { background: #dce9f6; box-shadow: inset 4px 0 0 var(--primary); }
.nav-step.is-current .nav-step-mark { background: var(--primary); color: #fff; }
.nav-step.is-locked .nav-step-button { color: #9aa3ab; cursor: not-allowed; }
.nav-step.is-locked .nav-step-mark { background: #eef0f2; color: #9aa3ab; }
.nav-progress { padding: .85rem .9rem; border-radius: 0; background: var(--primary-light); }
.nav-progress-text { margin: 0 0 .55rem; font-size: .92rem; font-weight: 600; color: var(--ink); }
.nav-progress-bar { height: 8px; border-radius: 0; background: #fff; overflow: hidden; }
.nav-progress-fill { display: block; height: 100%; border-radius: 0; background: var(--primary); }
.nav-extra { display: grid; gap: .45rem; }
.nav-action { min-height: 2.7rem; padding: .45rem .9rem; border: 1px solid var(--primary); border-radius: 0; background: #fff; color: var(--primary); font: inherit; font-size: .92rem; font-weight: 700; text-align: left; cursor: pointer; }
.nav-action:hover:not(:disabled) { background: var(--primary-light); }
.nav-action:disabled { border-color: var(--line); color: #9aa3ab; cursor: not-allowed; }
.nav-action-restart { margin-top: .3rem; border-color: var(--line); color: var(--text); }

/* ---------- Fortschritt: Segment-Tabs (abgerundete Balken, eine je Frageseite, ohne Beschriftung) + Prozentkreis ---------- */
.page-tabs { position: relative; display: flex; gap: clamp(.5rem, 1.6vw, 1.75rem); min-width: 0; padding: 2px 2px 6px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; border-bottom: 1px solid #e6edf6; }
.page-tab { position: relative; flex: 1 0 2.2rem; height: 1.6rem; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; cursor: pointer; } /* große Klickfläche, sichtbar ist der Balken */
.page-tab::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: .8rem; transform: translateY(-50%); border-radius: 0; background: #cfdff2; transition: background-color 150ms; }
.page-tab.is-done:hover::before, .page-tab:not(.is-locked):not(.is-active):hover::before { background: #b5cdeb; }
.page-tab.is-active { cursor: default; }
.page-tab.is-active::before { background: #0a5bc2; }
.page-tab.is-locked { cursor: not-allowed; }
.page-tab.is-locked::before { background: #e1e9f5; }
.page-tab:focus-visible { outline: 3px solid color-mix(in srgb, var(--primary) 40%, transparent); outline-offset: 1px; }
.page-return { display: inline-flex; align-items: center; margin: .45rem 0 0; padding: 0; border: 0; background: none; color: var(--primary); font: inherit; font-size: .9rem; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.page-return::before { content: "↩"; margin-right: .35rem; text-decoration: none; }
@media (max-width: 560px) { .page-tabs { gap: .45rem; } .page-tab { flex-basis: 1.9rem; } }
/* ---------- Ergebnis: „Ihre Grundlagen“ (Fortschritt + aufklappbare Kategorien, ersetzt die Text-Kacheln des Gesamtbilds) ---------- */
.found-panel { margin: .3rem 0 1.2rem; padding: 1.1rem 1.25rem .9rem; border: 1px solid var(--line); border-radius: 0; background: #fff; }
.found-head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.result-section .found-panel .found-title { margin: 0; font-size: 1.15rem; font-weight: 700; color: var(--ink); }
.found-count { font-size: .95rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.found-bar { height: 10px; margin: .7rem 0 .4rem; border-radius: 0; background: #e8eef6; overflow: hidden; }
.found-fill { display: block; height: 100%; border-radius: 0; background: var(--primary); transition: width 300ms ease; }
.found-cat { border-top: 1px solid var(--line-soft); }
.found-cat-head { display: flex; align-items: center; gap: .8rem; padding: .8rem 0; cursor: pointer; list-style: none; }
.found-cat-head::-webkit-details-marker { display: none; }
.found-cat-head:focus-visible { outline: 3px solid color-mix(in srgb, var(--primary) 40%, transparent); outline-offset: 2px; border-radius: 0; }
.found-icon { flex: none; display: grid; place-items: center; width: 1.6rem; height: 1.6rem; color: var(--primary); }
.found-icon svg, .found-chevron svg, .found-mark svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.found-cat-name { flex: 1; min-width: 0; font-size: 1.02rem; font-weight: 600; color: var(--text); }
.found-badge { flex: none; min-width: 1.8rem; padding: .1rem .55rem; border-radius: 0; background: var(--primary-light); color: var(--primary-dark); font-size: .85rem; font-weight: 700; text-align: center; font-variant-numeric: tabular-nums; }
.found-badge.is-zero { background: #f1f3f5; color: var(--muted); }
.found-chevron { flex: none; width: 1.2rem; height: 1.2rem; color: var(--muted); transition: transform 150ms; }
.found-cat[open] .found-chevron { transform: rotate(180deg); }
.found-list { list-style: none; margin: 0; padding: 0 0 .8rem 2.4rem; display: grid; gap: .55rem; }
.found-item { display: flex; align-items: flex-start; gap: .6rem; font-size: .95rem; line-height: 1.4; color: var(--text); }
.found-mark { flex: none; display: grid; place-items: center; width: 1.05rem; height: 1.05rem; margin-top: .15rem; border-radius: 50%; border: 1.5px solid #9aa3ab; box-sizing: border-box; color: #fff; font-size: .65rem; font-weight: 800; line-height: 1; }
.is-met > .found-mark { border-color: var(--primary); background: var(--primary); }
.is-met > .found-mark svg { stroke-width: 3; width: .75rem; height: .75rem; }
.is-partial > .found-mark { border-color: var(--primary); background: linear-gradient(90deg, var(--primary) 50%, #fff 50%); }
.is-unclear > .found-mark { border-style: dashed; color: var(--muted); }
.found-legend { display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; margin: .2rem 0 0; padding-top: .7rem; border-top: 1px solid var(--line-soft); font-size: .82rem; color: var(--muted); }
.found-legend-item { display: inline-flex; align-items: center; gap: .4rem; }
.found-legend-item .found-mark { margin-top: 0; }
.pdf-export-root .found-cat-head { display: flex; cursor: default; } /* gegen die allgemeine PDF-Regel summary { display: block } */
.pdf-export-root .found-cat-name { flex: 0 1 auto; }
.pdf-export-root .found-chevron { display: none; }
@media (max-width: 560px) { .found-panel { padding: .9rem .9rem .7rem; } .found-list { padding-left: 2.1rem; } }

/* ---------- Neue Auswertung (etm-logic-v2): Kernmaßnahmen und Roadmap nach Wellen ---------- */
.v2-subtitle { margin: 1.3rem 0 .2rem; font-size: 1rem; color: var(--ink); }
.v2-kern-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: .9rem; margin-top: .6rem; }
.v2-kern { --c: var(--primary); display: flex; flex-direction: column; align-items: flex-start; gap: .4rem; min-width: 0; padding: 1rem 1.1rem; background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--c); border-radius: var(--radius); }
.v2-kern.need-high { --c: var(--high); } .v2-kern.need-low { --c: var(--low); } .v2-kern.need-unclear { --c: #9aa3ab; } .v2-kern.need-potential { --c: var(--s-R); }
.v2-kern-name { margin: .1rem 0 0; font-size: 1rem; color: var(--ink); line-height: 1.3; }
.v2-kern .plain-list { margin: 0; padding-left: 1.1rem; font-size: .88rem; }
.v2-label { margin: .35rem 0 0; font-size: .74rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.v2-hint { margin: .3rem 0 0; }
.v2-roadmap { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: .9rem; align-items: start; }
.v2-wave { display: grid; gap: .6rem; min-width: 0; }
.v2-wave-title { margin: 0; padding-bottom: .35rem; border-bottom: 3px solid var(--primary); font-size: .95rem; color: var(--ink); }
.v2-step { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); }
.v2-step.kind-prep, .v2-step.kind-clarify { border-style: dashed; background: var(--grey-light); }
.v2-step.is-core { border-color: var(--primary); box-shadow: inset 4px 0 0 var(--primary); }
.v2-step-head { display: grid; gap: .35rem; padding: .75rem .9rem; cursor: pointer; list-style: none; }
.v2-step-head::-webkit-details-marker { display: none; }
.v2-tags { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; }
.v2-kind { font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--primary); }
.v2-step .need-badge { padding: .12rem .55rem; font-size: .72rem; }
.v2-step-name { font-weight: 700; color: var(--text); line-height: 1.3; }
.v2-enables { line-height: 1.35; }
.v2-step-body { padding: 0 .9rem .8rem; }
.v2-step-body p { margin: .2rem 0 0; }
.pdf-export-root .v2-roadmap { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pdf-export-root .v2-step-head { cursor: default; }

/* ---------- Neue Frageformate (etm-logic-v2): Bildkarten, Leiter, Stufen-Track, Kacheln, Kartenstapel ---------- */
:root { --t-P: #00549c; --t-R: #8db8e5; --t-M: #57ab27; --t-U: #dc1968; }
.v2-block { display: grid; gap: .7rem; }
.v2-dk { justify-self: start; padding: .2rem 0; border: 0; background: none; font: inherit; font-size: .88rem; color: var(--muted); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.v2-dk.is-on { color: var(--primary); font-weight: 700; }
.v2-dk:focus-visible { outline: 3px solid var(--primary); outline-offset: 2px; }
.v2-key { justify-self: start; padding: 0 .35rem; border: 1px solid var(--line); border-radius: 0; font-size: .7rem; color: var(--muted); }
.v2-why { margin-top: 1rem; font-size: .9rem; }
.v2-why summary { display: inline-flex; gap: .4rem; align-items: center; color: var(--primary); font-weight: 700; cursor: pointer; }
.v2-why p { margin: .5rem 0 0; padding: .65rem .8rem; background: var(--primary-light); border-radius: var(--radius); }
.v2-missing-note { margin: .8rem 0 0; color: var(--high); font-weight: 700; font-size: .9rem; }
.is-missing { outline: 2px solid var(--high); outline-offset: 3px; border-radius: var(--radius); }

.v2-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .75rem; }
.v2-card { display: grid; gap: .45rem; align-content: start; justify-items: start; padding: 1rem; text-align: left; background: #fff; border: 1.5px solid var(--line); border-radius: 0; font: inherit; color: var(--text); cursor: pointer; transition: border-color .15s, background .15s; }
.v2-card:hover { border-color: var(--primary-soft); background: var(--primary-light); }
.v2-card.is-on { border-color: var(--primary); background: var(--primary-light); box-shadow: inset 0 0 0 1px var(--primary); }
.v2-card:focus-visible { outline: 3px solid var(--primary); outline-offset: 2px; }
.v2-card-icon svg { width: 44px; height: 44px; fill: none; stroke: var(--primary); stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; }
.v2-card-title { color: var(--ink); font-size: 1rem; }
.v2-card-text { font-size: .84rem; color: var(--muted); line-height: 1.35; }

.v2-ladder { display: grid; border: 1px solid var(--line); border-radius: 0; overflow: hidden; }
.v2-rung { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .9rem; align-items: center; padding: .8rem 1rem; border: 0; border-bottom: 1px solid var(--line); background: #fff; font: inherit; text-align: left; color: var(--text); cursor: pointer; }
.v2-rung:last-child { border-bottom: 0; }
.v2-rung:hover { background: var(--primary-light); }
.v2-rung.is-on { background: var(--primary-light); box-shadow: inset 4px 0 0 var(--primary); font-weight: 700; color: var(--ink); }
.v2-rung:focus-visible { outline: 3px solid var(--primary); outline-offset: -3px; }
.v2-level { display: flex; align-items: flex-end; gap: 3px; height: 28px; }
.v2-level i { width: 7px; border-radius: 0; background: var(--line); }
.v2-rung.is-on .v2-level i.is-fill, .v2-rung.is-below .v2-level i.is-fill { background: var(--primary); }

.v2-tracks { display: grid; gap: .9rem; }
.v2-track-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 360px); gap: .5rem 1rem; align-items: center; padding: .5rem 0; border-bottom: 1px solid var(--line-soft); }
.v2-track-label { margin: 0; font-weight: 700; line-height: 1.35; }
.v2-goal-dot { display: inline-block; width: .6rem; height: .6rem; margin-right: .45rem; border-radius: 50%; background: var(--grey); vertical-align: .05em; }
.v2-goal-dot.goal-Z-PL { background: var(--t-P); } .v2-goal-dot.goal-Z-RE { background: var(--t-R); } .v2-goal-dot.goal-Z-MP { background: var(--t-M); } .v2-goal-dot.goal-Z-US { background: var(--t-U); }
.v2-track-ctrl { display: grid; gap: .3rem; }
.v2-track { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; }
.v2-seg { padding: .55rem .3rem; border: 1px solid var(--line); background: var(--grey-light); font: inherit; font-size: .8rem; color: var(--muted); cursor: pointer; }
.v2-seg:first-child { border-radius: 0 0 0 999px; } .v2-seg:last-child { border-radius: 0 999px 999px 0; }
.v2-track.lvl-1 .v2-seg:nth-child(-n+1), .v2-track.lvl-2 .v2-seg:nth-child(-n+2), .v2-track.lvl-3 .v2-seg:nth-child(-n+3) { background: var(--primary); border-color: var(--primary); color: #fff; }
.v2-seg.is-on { font-weight: 700; }
.v2-seg:focus-visible { outline: 3px solid var(--primary); outline-offset: 2px; position: relative; }

.v2-tri { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.v2-tri-btn { min-width: 5.5rem; padding: .45rem .8rem; border: 1.5px solid var(--line); border-radius: 0; background: #fff; font: inherit; font-size: .88rem; cursor: pointer; }
.v2-tri-btn:hover { border-color: var(--primary-soft); }
.v2-tri-btn.is-on.v-yes { background: var(--low); border-color: var(--low); color: #fff; }
.v2-tri-btn.is-on.v-partial { background: var(--medium); border-color: var(--medium); color: #fff; }
.v2-tri-btn.is-on.v-no { background: var(--high); border-color: var(--high); color: #fff; }
.v2-tri-btn:focus-visible { outline: 3px solid var(--primary); outline-offset: 2px; }
.v2-tri .v2-dk { margin-left: .4rem; }

.v2-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: .8rem; }
.v2-tile { display: grid; gap: .5rem; align-content: start; padding: 1rem; background: #fff; border: 1.5px solid var(--line); border-radius: 0; }
.v2-tile.is-answered { border-color: var(--primary-soft); }
.v2-tile-title { color: var(--ink); }
.v2-tile-text { margin: 0; font-size: .88rem; color: var(--muted); line-height: 1.4; }
.v2-tile .v2-tri-btn { min-width: 0; padding: .35rem .7rem; font-size: .82rem; }

.v2-stack { display: grid; gap: .8rem; }
.v2-dots { display: flex; flex-wrap: wrap; gap: .4rem; }
.v2-dot { width: 28px; height: 8px; padding: 0; border: 0; border-radius: 0; background: var(--line-soft); cursor: pointer; }
.v2-dot.is-current { background: var(--primary-pale); outline: 2px solid var(--primary); outline-offset: 1px; }
.v2-dot.a-yes { background: var(--low); } .v2-dot.a-partial { background: var(--medium); } .v2-dot.a-no { background: var(--high); } .v2-dot.a-unknown { background: var(--grey); }
.v2-stack-card { display: grid; gap: .8rem; padding: 1.3rem; background: var(--primary-light); border-radius: 0; animation: v2-slide .25s ease; }
@keyframes v2-slide { from { transform: translateX(14px); opacity: .5; } to { transform: none; opacity: 1; } }
.v2-stack-count { font-size: .78rem; color: var(--muted); font-weight: 700; }
.v2-stack-text { margin: 0; font-size: 1.08rem; font-weight: 700; color: var(--text); line-height: 1.4; }
.v2-tri-big .v2-tri-btn { min-width: 7rem; padding: .7rem 1rem; font-weight: 700; }
.v2-stack-done { margin: 0; padding: 1rem; background: var(--accent-bg); border-radius: var(--radius); color: var(--low); font-weight: 700; }

/* Turm */
.v2-tower { display: flex; flex-direction: column-reverse; gap: 3px; }
.v2-floor { position: relative; display: flex; align-items: center; justify-content: space-between; gap: .4rem; min-height: 30px; padding: .25rem .5rem; overflow: hidden; border-radius: 0; background: var(--c); color: #fff; font-size: .72rem; font-weight: 700; line-height: 1.2; }
.v2-floor.goal-P { --c: var(--t-P); } .v2-floor.goal-R { --c: var(--t-R); color: #0b2a4a; } .v2-floor.goal-M { --c: var(--t-M); } .v2-floor.goal-U { --c: var(--t-U); }
.v2-floor.is-gap { background: transparent; border: 1.5px dashed var(--line); color: var(--muted); font-weight: 400; justify-content: center; }
.v2-floor-label { position: relative; }
.v2-tower.is-mini .v2-floor { background: var(--grey-light); color: var(--muted); border: 1px solid var(--line); min-height: 22px; font-size: .68rem; }
.v2-tower.is-mini .v2-floor-fill { position: absolute; inset: 0 auto 0 0; background: var(--c); opacity: .4; transition: width .35s ease; }
.v2-tower.is-mini .v2-floor.goal-P .v2-floor-fill ~ .v2-floor-label, .v2-tower.is-mini .v2-floor.goal-M .v2-floor-fill ~ .v2-floor-label, .v2-tower.is-mini .v2-floor.goal-U .v2-floor-fill ~ .v2-floor-label { mix-blend-mode: normal; }
.v2-progress { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 1rem; align-items: end; margin-bottom: .6rem; }
.v2-progress-text p { margin: 0; }
.v2-progress-chapter { font-weight: 700; color: var(--ink); }
.v2-progress-meta { font-size: .86rem; color: var(--muted); }
.v2-chapter-done { margin-top: .45rem !important; padding: .4rem .7rem; background: var(--accent-bg); border-radius: var(--radius); color: var(--low); font-size: .86rem; font-weight: 700; }
.v2-chapter-done::before { content: "✓ "; }
.v2-chapter-done.is-new { animation: v2-slide .3s ease; }
.rail-total.is-compact .page-tab { height: 5px; }
.usecase-card:has(.usecase-tower) { grid-row: span 5; }
.usecase-tower { display: grid; gap: .35rem; align-self: end; padding: .85rem .9rem 0; }
.v2-tower.is-card .v2-floor { min-height: 24px; font-size: .64rem; justify-content: center; text-align: center; }
.usecase-meta { font-size: .76rem; font-weight: 700; color: var(--primary); }
.v2-result-top { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 1rem; align-items: start; }
.v2-result-tower { display: grid; gap: .4rem; padding: .8rem; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.v2-result-tower .v2-label { margin: 0; }
.v2-tower.is-result .v2-floor { min-height: 44px; flex-direction: column; align-items: flex-start; justify-content: center; font-size: .8rem; }
.v2-floor-state { position: relative; padding: .05rem .45rem; border-radius: 0; background: #fff; font-size: .68rem; font-weight: 700; }
.v2-floor-state.st-high { color: var(--high); } .v2-floor-state.st-unclear { color: var(--muted); } .v2-floor-state.st-low, .v2-floor-state.st-done { color: var(--low); } .v2-floor-state.st-none { color: var(--muted); }
@media (max-width: 760px) {
  .v2-track-row { grid-template-columns: minmax(0, 1fr); }
  .v2-progress { grid-template-columns: 110px minmax(0, 1fr); }
  .v2-result-top { grid-template-columns: minmax(0, 1fr); }
  .v2-tri-big .v2-tri-btn { min-width: 0; flex: 1 1 30%; }
}
@media (prefers-reduced-motion: reduce) { .v2-stack-card, .v2-chapter-done.is-new { animation: none; } .v2-tower.is-mini .v2-floor-fill { transition: none; } }
.pdf-export-root .v2-result-top { grid-template-columns: minmax(0, 1fr) 220px; }

/* ===================== FIR-Stil (23.10.2026) =====================
 * Einheitliches Erscheinungsbild nach FIR-Corporate-Design: FIR-Blau als Leitfarbe, Magenta nur als Akzent,
 * rechteckige Formen, ruhige Flächen, Überschriften in Satzschreibweise statt Versalien. */
.eyebrow, .usecase-label, .nav-section-label, .v2-label, .v2-kind, .details-body h5, .bp-label, .pdf-export-root .pdf-eyebrow { text-transform: none; letter-spacing: 0; }
.v2-label { font-size: .82rem; color: var(--text); }
.v2-kind { font-size: .8rem; }
/* Startseite: Prozessschritte in einer Farbfamilie */
.process-steps li, .process-steps li:nth-child(n) { background: var(--primary); color: #fff; }
.process-steps li:nth-child(even) { background: var(--primary-dark); }
.process-steps li::before { border-radius: 0; }
/* Status-Kennzeichnung: kleine rechteckige Marke statt Pillen */
.need-badge { padding: .2rem .5rem; font-size: .78rem; border: 1px solid currentColor; background: #fff !important; }
.v2-step .need-badge { padding: .08rem .4rem; font-size: .72rem; }
/* Kernmaßnahmen: eine Kartenform, Status als linker Balken (wie Best-Practice-Karten) */
.v2-kern { border: 1px solid var(--line); border-left: 4px solid var(--c); border-top-width: 1px; border-top-color: var(--line); }
.v2-kern-grid { align-items: stretch; }
.result-summary { border-left-width: 4px; }
/* Roadmap: alle Schritte als weiße Karten; Art des Schritts über den linken Balken */
.v2-step { border-left: 4px solid var(--primary); }
.v2-step.kind-prep { border-style: solid; border-left-color: var(--primary-soft); background: #fff; }
.v2-step.kind-clarify { border-style: solid; border-left-color: var(--grey); background: #fff; }
.v2-step.is-core { border-color: var(--line); border-left-color: var(--primary); box-shadow: none; }
.v2-step.is-core .v2-step-name { color: var(--ink); }
.v2-wave-title { border-bottom-width: 2px; }
/* Abschnittsüberschriften: Linie in FIR-Blau, Akzent in Magenta */
.result-section-title::after, .section-rule { background: var(--primary); }
.result-tab.is-active, .result-tab[aria-selected="true"] { border-left-color: var(--fir-magenta); }
/* Nummernmarken quadratisch */
.result-tab-num, .step-num, .step-item::before { border-radius: 0 !important; }
.result-tab::before, .nav-step-mark { border-radius: 0; }
@media (min-width: 861px) { .process-steps:has(> li:nth-child(4):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); } } /* neuer Ablauf: vier Schritte über die volle Breite */
.page-tab, .page-tab::before { border-radius: 999px; } /* Fortschrittsbalken der Fragen wie bisher */

/* ===================== Designsystem Redesign (nur neuer Ablauf: body.is-v2) =====================
 * Vorläufige Werte; nach Prüfung am FIR-Corporate-Design hier zentral anpassen. */
.is-v2 {
  --ds-blue: var(--primary); --ds-blue-dark: var(--primary-dark); --ds-blue-50: #eef4fa; --ds-blue-100: #dbe7f3;
  --ds-accent: var(--fir-magenta); --ds-text: #1f2a33; --ds-muted: #55606b; --ds-line: #d5dde5;
  --ds-ok: #2f7a1f; --ds-warn: #b00020; --ds-neutral: #6b7680;
  --ds-s1: .5rem; --ds-s2: 1rem; --ds-s3: 1.5rem; --ds-s4: 2.5rem; --ds-s5: 4rem;
  --ds-max: 1200px;
}
.is-v2 .app-shell { max-width: calc(var(--ds-max) + 2 * var(--gutter)); margin-inline: auto; }

/* Startseite */
.is-v2 #intro-view.landing:not([hidden]) { display: grid; flex: none; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); column-gap: var(--ds-s4); align-items: start;
  grid-template-areas: "kicker photo" "title photo" "lead photo" "actions photo" "more more"; padding-top: var(--ds-s3); }
.is-v2 .landing .process-steps { display: none; }
.is-v2 .landing .hero-stage { display: contents; }
.is-v2 .v2-kicker { grid-area: kicker; margin: 0 0 var(--ds-s1); color: var(--ds-blue); font-weight: 700; font-size: .95rem; }
.is-v2 #intro-title { grid-area: title; font-size: clamp(1.9rem, 3vw, 2.6rem); }
.is-v2 #intro-title .hero-line { display: block; }
.is-v2 #intro-title .hero-line + .hero-line::before { content: none; }
.is-v2 .landing .hero-lead { grid-area: lead; max-width: 38rem; white-space: normal; color: var(--ds-text); }
.is-v2 .landing .hero-actions { grid-area: actions; position: static; transform: none; max-width: none; margin: var(--ds-s3) 0 0 !important; }
.is-v2 .landing .hero-actions .primary-button, .is-v2 .landing .hero-actions .secondary-button { min-height: 3.2rem; font-size: 1.05rem; padding: .8rem 1.8rem; }
.is-v2 .landing .hero-actions .secondary-button { background: #fff; color: var(--ds-blue); }
.is-v2 .landing .hero-photo { grid-area: photo; position: relative; margin: 0; height: 100%; min-height: 300px; max-height: 380px; }
.is-v2 .v2-intro { grid-area: more; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ds-s4); margin-top: var(--ds-s5); padding-bottom: var(--ds-s4); }
.is-v2 .v2-intro-block.is-flow { grid-column: 1 / -1; }
.is-v2 .v2-intro-title { margin: 0 0 var(--ds-s2); padding-bottom: var(--ds-s1); border-bottom: 2px solid var(--ds-blue); color: var(--ds-blue); font-size: 1.3rem; }
.is-v2 .v2-flow { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--ds-s2); margin: 0; padding: 0; list-style: none; }
.is-v2 .v2-flow-step { display: grid; gap: .35rem; align-content: start; padding: var(--ds-s2); background: var(--ds-blue-50); border-top: 4px solid var(--ds-blue); }
.is-v2 .v2-flow-step strong { color: var(--ds-blue); font-size: 1.05rem; }
.is-v2 .v2-flow-step span:last-child { color: var(--ds-muted); font-size: .95rem; }
.is-v2 .v2-flow-no { display: grid; place-items: center; width: 2rem; height: 2rem; background: var(--ds-blue); color: #fff; font-weight: 700; }
.is-v2 .v2-benefits, .is-v2 .v2-results { display: grid; gap: var(--ds-s2); margin: 0; padding: 0; list-style: none; }
.is-v2 .v2-benefit { display: grid; gap: .2rem; padding-left: var(--ds-s2); border-left: 3px solid var(--ds-blue-100); }
.is-v2 .v2-benefit strong { color: var(--ds-text); }
.is-v2 .v2-benefit span { color: var(--ds-muted); }
.is-v2 .v2-results { gap: .55rem; }
.is-v2 .v2-results li { position: relative; padding-left: 1.6rem; }
.is-v2 .v2-results li::before { content: ""; position: absolute; left: 0; top: .45em; width: .7rem; height: .7rem; background: var(--ds-blue); }
.is-v2 .v2-privacy { margin: var(--ds-s3) 0 0; padding: var(--ds-s2); background: var(--ds-blue-50); color: var(--ds-muted); font-size: .9rem; }
@media (max-width: 900px) {
  .is-v2 #intro-view.landing:not([hidden]) { grid-template-columns: minmax(0, 1fr); grid-template-areas: "kicker" "title" "lead" "actions" "photo" "more"; }
  .is-v2 .landing .hero-photo { margin-top: var(--ds-s3); min-height: 180px; height: 220px; }
  .is-v2 .v2-intro { grid-template-columns: minmax(0, 1fr); margin-top: var(--ds-s4); }
  .is-v2 .v2-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) { .is-v2 .v2-flow { grid-template-columns: minmax(0, 1fr); } }

/* Use-Case-Auswahl */
.is-v2 .usecase-cards { grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); gap: var(--ds-s2); }
.is-v2 .usecase-card { display: flex; flex-direction: column; grid-row: auto; }
.is-v2 .usecase-body { display: flex; flex-direction: column; gap: var(--ds-s2); flex: 1; padding: var(--ds-s2); }
.is-v2 .v2-uc-goal { color: var(--ds-text); line-height: 1.5; }
.is-v2 .v2-uc-label { display: block; margin-bottom: .35rem; color: var(--ds-muted); font-size: .8rem; font-weight: 700; }
.is-v2 .v2-uc-tags { display: flex; flex-wrap: wrap; gap: .35rem; }
.is-v2 .v2-goal-tag { padding: .15rem .5rem; border: 1px solid var(--ds-blue-100); background: var(--ds-blue-50); color: var(--ds-blue); font-size: .8rem; font-weight: 700; }
.is-v2 .v2-uc-practice { display: grid; gap: .45rem; padding-top: var(--ds-s2); border-top: 1px solid var(--ds-line); }
.is-v2 .v2-uc-metric { display: grid; grid-template-columns: minmax(6.5rem, auto) minmax(0, 1fr); gap: .6rem; align-items: baseline; }
.is-v2 .v2-uc-value { color: var(--ds-blue); font-weight: 700; white-space: nowrap; }
.is-v2 .v2-uc-mtext { color: var(--ds-muted); font-size: .88rem; line-height: 1.4; }
.is-v2 .v2-uc-meta { margin-top: auto; color: var(--ds-muted); font-size: .85rem; }
.is-v2 .usecase-select { margin: 0 var(--ds-s2) var(--ds-s2); }

/* Assessment */
.is-v2 .v2-context { margin: 0 0 var(--ds-s1); color: var(--ds-muted); font-size: .9rem; }
.is-v2 .v2-context strong { color: var(--ds-text); }
.is-v2 .v2-qmeta { margin: 0 0 var(--ds-s1); color: var(--ds-blue); font-size: .9rem; font-weight: 700; }
.is-v2 .v2-next-hint { margin: var(--ds-s1) 0 0; color: var(--ds-muted); font-size: .88rem; text-align: right; }
.is-v2 .v2-next-hint:empty { display: none; }

/* Ergebnis: Kennzahlen */
.is-v2 .v2-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ds-s2); margin: var(--ds-s2) 0 var(--ds-s3); }
.is-v2 .v2-kpi { display: grid; gap: .2rem; padding: var(--ds-s2); background: #fff; border: 1px solid var(--ds-line); border-left: 4px solid var(--ds-neutral); }
.is-v2 .v2-kpi.kpi-low { border-left-color: var(--ds-ok); } .is-v2 .v2-kpi.kpi-high { border-left-color: var(--ds-warn); }
.is-v2 .v2-kpi-value { color: var(--ds-text); font-size: 2rem; font-weight: 700; line-height: 1; }
.is-v2 .v2-kpi-label { color: var(--ds-muted); font-size: .92rem; }
@media (max-width: 600px) { .is-v2 .v2-kpis { grid-template-columns: minmax(0, 1fr); } .is-v2 .v2-kpi { grid-template-columns: auto 1fr; align-items: center; gap: .8rem; } .is-v2 .v2-kpi-value { font-size: 1.5rem; } }

/* Ergebnis: Roadmap-Matrix */
.is-v2 .v2-matrix-copy { margin: 0 0 var(--ds-s2); }
.is-v2 .v2-matrix-wrap { overflow-x: auto; margin-bottom: var(--ds-s4); border: 1px solid var(--ds-line); }
.is-v2 .v2-matrix { width: 100%; min-width: 640px; border-collapse: collapse; font-size: .9rem; }
.is-v2 .v2-matrix th, .is-v2 .v2-matrix td { padding: .6rem .7rem; border-bottom: 1px solid var(--ds-line); text-align: left; vertical-align: top; }
.is-v2 .v2-matrix thead th { background: var(--ds-blue); color: #fff; font-weight: 700; white-space: nowrap; }
.is-v2 .v2-matrix td + td, .is-v2 .v2-matrix th + td, .is-v2 .v2-matrix thead th + th { border-left: 1px solid var(--ds-line); }
.is-v2 .v2-matrix-name { width: 26%; background: var(--ds-blue-50); }
.is-v2 .v2-matrix-name > span:first-child { display: block; margin-bottom: .35rem; color: var(--ds-text); font-weight: 700; }
.is-v2 .v2-matrix tr.is-core .v2-matrix-name { box-shadow: inset 4px 0 0 var(--ds-blue); }
.is-v2 .v2-matrix .need-badge { font-size: .72rem; padding: .05rem .35rem; }
.is-v2 .v2-cell { display: grid; gap: .1rem; margin-bottom: .4rem; padding: .35rem .5rem; background: #fff; border: 1px solid var(--ds-line); border-left: 3px solid var(--ds-blue-100); }
.is-v2 .v2-cell.kind-clarify { border-left-color: var(--ds-neutral); }
.is-v2 .v2-cell.kind-measure { border-left-color: var(--ds-blue); }
.is-v2 .v2-cell.is-target { border: 1px solid var(--ds-blue); border-left-width: 3px; background: var(--ds-blue-50); font-weight: 700; color: var(--ds-blue); }
.is-v2 .v2-cell-kind { color: var(--ds-muted); font-size: .72rem; font-weight: 700; }
.is-v2 .v2-bp-group { margin-top: var(--ds-s3); }
.is-v2 .v2-subtitle { color: var(--ds-blue); }
.pdf-export-root .v2-matrix-wrap { overflow: visible; }

/* ===================== FIR-Erscheinungsbild (nur neuer Ablauf: body.is-v2) =====================
 * Abgeleitet aus den Referenz-Screenshots der FIR-Website (Seiten „Beratung“ und „Über uns“):
 * weiße Kopfzeile mit Logo links, Navigation in grauen Versalien, aktive Sprache als blaues Quadrat;
 * Vollbreites Titelbild mit grauer, halbtransparenter Titelbox; Brotkrumen-Zeile; leichte, graue Überschriften;
 * Fließtext grau im Blocksatz; Karten mit dunkelblauem Fußbalken in weißen Versalien.
 * Schrift: Source Sans (falls installiert), sonst Segoe UI / Open Sans; keine externen Schriftdateien. */
body.is-v2 {
  --primary: #0067a6; --primary-dark: #011834; --ink: #333; --text: #4a4a4a; --muted: #6b6b6b;
  --ds-blue: #0067a6; --ds-blue-dark: #011834; --ds-blue-50: #f3f6f9; --ds-blue-100: #d5e2ec;
  --ds-text: #333; --ds-muted: #6b6b6b; --ds-line: #e1e1e1;
  --fir-navy: #011834; --fir-charcoal: #333; --fir-box: rgb(62 68 74 / 84%); --fir-nav: #555560;
  font-family: "Source Sans 3", "Source Sans Pro", "Segoe UI", "Open Sans", Arial, sans-serif;
  color: var(--text); overflow-x: clip;
}
.is-v2 .usecase-cards, .is-v2 .usecase-legend-row { font-family: inherit; }

/* Kopfzeile */
.is-v2 .brand-header { background: #fff; border-bottom: 1px solid #ececec; box-shadow: 0 1px 8px rgb(0 0 0 / 5%); }
.is-v2 .brand-header .project-banner { min-height: 5.2rem; padding-block: .6rem; }
.is-v2 .brand-header .banner-inner { max-width: var(--ds-max); margin-inline: auto; gap: .25rem; }
.is-v2 .brand-header .header-brand { order: -1; margin: 0 auto 0 0; }
.is-v2 .brand-header .header-brand img { height: 3.3rem; mix-blend-mode: normal; }
.is-v2 .brand-header .header-button { min-height: 2.5rem; padding: 0 .75rem; background: transparent; box-shadow: none; color: var(--fir-nav); font-size: .88rem; font-weight: 400; letter-spacing: .02em; text-transform: uppercase; }
.is-v2 .brand-header .header-button:hover:not([aria-disabled="true"]) { background: transparent; color: var(--fir-magenta); }
.is-v2 .brand-header .header-button:focus-visible { outline: 2px solid var(--primary); outline-offset: 0; }
.is-v2 .brand-header .menu-button { width: 2.5rem; padding: 0; }
.is-v2 .brand-header .menu-button svg { stroke-width: 2; }
.is-v2 .language-switch { gap: 3px; margin-left: .6rem; padding: 0; border: 0; }
.is-v2 .language-switch button { min-width: 2.15rem; min-height: 2.15rem; padding: 0; background: var(--fir-charcoal); color: #fff; font-size: .85rem; font-weight: 700; }
.is-v2 .language-switch button[aria-pressed="true"] { background: var(--primary); color: #fff; }
.is-v2 .language-switch button:hover { background: var(--primary-dark); }

/* Überschriften und Text */
.is-v2 :is(.display, .section-title, .question-card h2, .v2-intro-title) { color: #333; font-weight: 400; letter-spacing: 0; }
.is-v2 .section-title { font-size: clamp(1.5rem, 2.6vw, 1.9rem); }
.is-v2 .question-card h2 { font-size: 1.45rem; line-height: 1.3; }
.is-v2 :is(.measure-title, .summary-title, .priority-title, .export-panel h3) { color: #333; font-weight: 600; }

/* Schaltflächen */
.is-v2 :is(.primary-button, .secondary-button) { min-height: 2.9rem; padding: .65rem 1.4rem; box-shadow: none; font-size: .85rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }
.is-v2 .primary-button { background: var(--primary); border-color: var(--primary); }
.is-v2 .primary-button:hover:not(:disabled) { background: var(--fir-navy); border-color: var(--fir-navy); transform: none; }
.is-v2 .secondary-button { background: #fff; border: 1px solid var(--primary); color: var(--primary); }
.is-v2 .secondary-button:hover:not(:disabled) { background: var(--ds-blue-50); }

/* Startseite: Titelbild über die volle Breite mit Titelbox, darunter Brotkrumen und Einleitung */
.is-v2 #intro-view.landing:not([hidden]) { grid-template-columns: minmax(0, 1fr); column-gap: 0; padding-top: 0; margin-top: -2rem;
  grid-template-areas: "hero" "kicker" "lead" "actions" "more"; }
.is-v2 .landing .hero-photo { grid-area: hero; width: 100vw; max-height: none; min-height: 0; height: clamp(240px, 32vw, 470px); margin: 0 0 0 calc(50% - 50vw); }
.is-v2 .landing .hero-photo img { object-position: 60% 55%; }
.is-v2 #intro-title { grid-area: hero; z-index: 1; align-self: end; justify-self: start; max-width: min(40rem, 100%); margin: 0 0 clamp(1rem, 3vw, 2.2rem); padding: .9rem 1.5rem 1rem; background: var(--fir-box); color: #fff; font-size: clamp(1.45rem, 2.6vw, 2.25rem); font-weight: 300; line-height: 1.25; }
.is-v2 .v2-kicker { margin: 1.1rem 0 2.2rem; color: #8a8a8a; font-size: .8rem; font-weight: 400; }
.is-v2 .landing .hero-lead { max-width: none; color: var(--text); font-size: 1.05rem; line-height: 1.75; text-align: justify; hyphens: auto; }
.is-v2 .landing .hero-actions { margin: 1.6rem 0 0 !important; }
.is-v2 .landing .hero-actions :is(.primary-button, .secondary-button) { min-height: 3rem; font-size: .9rem; padding: .7rem 1.8rem; box-shadow: none; }
.is-v2 .landing .hero-actions .secondary-button { color: var(--primary); background: #fff; }
.is-v2 .v2-intro { margin-top: var(--ds-s4); }
.is-v2 .v2-intro-title { padding-bottom: .5rem; border-bottom: 1px solid var(--ds-line); font-size: 1.4rem; }
.is-v2 .v2-flow-step { background: #f5f5f5; border-top: 3px solid var(--primary); }
.is-v2 .v2-flow-step strong { color: #333; font-weight: 600; }
.is-v2 .v2-flow-no { background: var(--fir-navy); font-weight: 600; }
.is-v2 .v2-benefit { border-left-color: var(--primary); }
.is-v2 .v2-benefit strong { font-weight: 600; }
.is-v2 :is(.v2-benefit span, .v2-results li) { line-height: 1.6; }
.is-v2 .v2-results li::before { width: .55rem; height: .55rem; top: .55em; background: var(--fir-magenta); }
.is-v2 .v2-privacy { background: #f5f5f5; }
@media (max-width: 900px) {
  .is-v2 #intro-view.landing:not([hidden]) { grid-template-areas: "hero" "kicker" "lead" "actions" "more"; }
  .is-v2 .landing .hero-photo { margin-top: 0; height: clamp(220px, 46vw, 340px); }
}
@media (max-width: 760px) { .is-v2 #intro-view.landing:not([hidden]) { margin-top: -1.2rem; } .is-v2 .landing .hero-lead { text-align: left; } }

/* Use-Case-Karten nach dem Muster der FIR-Teaser: dunkle Titelfläche, dunkelblauer Fußbalken */
.is-v2 .usecase-card { border: 1px solid var(--ds-line); color: var(--text); transition: box-shadow 150ms; }
.is-v2 .usecase-card:hover { box-shadow: 0 4px 16px rgb(0 0 0 / 10%); }
.is-v2 .usecase-card.is-selected { border-color: var(--primary); outline: 2px solid var(--primary); outline-offset: -2px; }
.is-v2 .usecase-head { min-height: 0; padding: 1rem 1.1rem 1.05rem; background: #42484e; }
.is-v2 .usecase-deco { display: none; }
.is-v2 .usecase-no { color: rgb(255 255 255 / 70%); font-weight: 400; font-size: .8rem; }
.is-v2 .usecase-title { font-size: 1.12rem; font-weight: 400; }
.is-v2 .usecase-body { padding: 1.1rem; }
.is-v2 .v2-uc-label { color: #8a8a8a; font-weight: 600; font-size: .75rem; letter-spacing: .04em; text-transform: uppercase; }
.is-v2 .v2-goal-tag { border-color: var(--ds-blue-100); background: var(--ds-blue-50); color: var(--primary); font-weight: 600; }
.is-v2 .v2-uc-value { color: var(--primary); font-weight: 600; }
.is-v2 .usecase-select { margin: 0; padding: .8rem 1rem; border: 0; background: var(--fir-navy); color: #fff; font-size: .78rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.is-v2 .usecase-card:hover .usecase-select { background: #0d2c52; color: #fff; }
.is-v2 .usecase-card.is-selected .usecase-select { background: var(--primary); color: #fff; }

/* Assessment */
.is-v2 .v2-qmeta { color: var(--primary); font-weight: 600; }
.is-v2 .question-card { border-color: var(--ds-line); }

/* Ergebnis */
.is-v2 .v2-kpi-value { font-weight: 300; font-size: 2.3rem; }
.is-v2 .v2-matrix thead th { background: var(--fir-navy); font-weight: 600; }
.is-v2 .v2-matrix-name { background: #f5f5f5; }
.is-v2 .v2-matrix-name > span:first-child { font-weight: 600; }
.is-v2 .v2-subtitle { color: #333; font-weight: 600; }
.is-v2 .result-heading { color: #333; font-size: 1.45rem; font-weight: 400; }
.is-v2 .result-heading::after { height: 1px; background: var(--ds-line); }
.is-v2 .result-summary { background: #f5f5f5; }
.is-v2 .result-tab.is-active { background: #f5f5f5; color: #333; }
.is-v2 .export-panel { background: #f5f5f5; border-color: var(--ds-line); }

/* Nach Referenz „FIR-Konferenzzentrum“: graue Inhaltsflächen #e7e7e7, dunkelblaue Schaltflächen, runde graue Aufzählungspunkte */
.is-v2 { --fir-panel: #e7e7e7; }
.is-v2 .primary-button { background: var(--fir-navy); border-color: var(--fir-navy); }
.is-v2 .primary-button:hover:not(:disabled) { background: var(--primary); border-color: var(--primary); }
.is-v2 .landing .hero-actions .primary-button { background: var(--fir-navy); border-color: var(--fir-navy); }
.is-v2 .landing .hero-actions .primary-button:hover { background: var(--primary); border-color: var(--primary); }
.is-v2 .v2-intro-block { padding: clamp(1.25rem, 3vw, 2.2rem); background: var(--fir-panel); }
.is-v2 .v2-intro-title { border-bottom: 0; padding-bottom: 0; margin-bottom: 1.2rem; }
.is-v2 .v2-flow-step { background: #fff; }
.is-v2 .v2-benefit { border-left-color: var(--fir-navy); }
.is-v2 .v2-results li::before { width: .38rem; height: .38rem; top: .62em; left: .3rem; border-radius: 50%; background: #555; }
.is-v2 .v2-privacy { background: #fff; }
.is-v2 .question-card { background: var(--fir-panel); border-color: var(--fir-panel); }
.is-v2 .result-summary, .is-v2 .export-panel { background: var(--fir-panel); border-color: var(--fir-panel); }

/* PDF im FIR-Erscheinungsbild (neuer Ablauf): Logos über einer feinen Linie, graue Titelbox wie auf der FIR-Website,
 * leichte graue Überschriften; die Inhaltsbereiche übernehmen die Regeln oben (graue Flächen, dunkelblaue Akzente). */
.is-v2 .pdf-export-root { font-family: inherit; color: var(--text); }
.is-v2 .pdf-export-root .pdf-logos { padding: 0 0 14px; border-bottom: 1px solid var(--ds-line); }
.is-v2 .pdf-export-root .pdf-banner { margin: 18px 0 14px; padding: 18px 22px; background: #4d5257; color: #fff; font-size: 1.65rem; font-weight: 300; }
.is-v2 .pdf-export-root .pdf-eyebrow { color: #8a8a8a; font-size: .8rem; font-weight: 400; }
.is-v2 .pdf-export-root .pdf-kind { color: #333; font-size: 1.5rem; font-weight: 400; }
.is-v2 .pdf-export-root .pdf-date { color: #8a8a8a; }
.is-v2 .pdf-export-root .result-heading { margin-top: 6px; }
.is-v2 .pdf-export-root .sprint-chip, .is-v2 .pdf-export-root .sprint-icon { background: var(--ds-blue-50); }
.is-v2 .pdf-export-root .wave-tag { background: var(--fir-panel); }

/* Klickbares wie auf der FIR-Website: beim Überfahren und bei Auswahl Magenta (#dc1968), auch bei Tastaturfokus.
 * Use-Case-Karten als blaue FIR-Kacheln (#0067a6) mit dunkelblauem Fußbalken (Referenz „Informationstechnologien“). */
.is-v2 { --fir-pink: var(--fir-magenta); --fir-pink-50: #fdeef4; }
.is-v2 :is(a, button, .answer-option, .option-chip, .usecase-card) { transition: background-color 140ms, border-color 140ms, color 140ms; }
.is-v2 :is(button, a, [tabindex]):focus-visible { outline: 2px solid var(--fir-pink); outline-offset: 2px; }
.is-v2 :is(.answer-option, .option-chip, .usecase-card):has(input:focus-visible) { outline: 2px solid var(--fir-pink); outline-offset: 2px; }

/* Schaltflächen */
.is-v2 .primary-button:hover:not(:disabled), .is-v2 .landing .hero-actions .primary-button:hover:not(:disabled) { background: var(--fir-pink); border-color: var(--fir-pink); }
.is-v2 .secondary-button:hover:not(:disabled) { background: #fff; border-color: var(--fir-pink); color: var(--fir-pink); }
.is-v2 :is(.text-button, .step-link):hover { color: var(--fir-pink); }
.is-v2 .language-switch button:not([aria-pressed="true"]):hover { background: var(--fir-pink); }

/* Antworten */
.is-v2 :is(.answer-option, .option-chip):hover { border-color: var(--fir-pink); background: #fff; }
.is-v2 :is(.answer-option, .option-chip):has(input:checked) { border-color: var(--fir-pink); background: var(--fir-pink-50); }
.is-v2 .answer-option:has(input:checked) .choice-icon, .is-v2 .option-chip:has(input:checked) .option-check { background: var(--fir-pink); border-color: var(--fir-pink); color: #fff; }
.is-v2 :is(.answer-option, .option-chip):hover :is(.choice-icon, .option-check) { border-color: var(--fir-pink); }

/* Use-Case-Kacheln */
.is-v2 .usecase-head { background: var(--primary); }
.is-v2 .usecase-title { font-size: 1.2rem; }
.is-v2 .usecase-card:hover { border-color: var(--fir-pink); box-shadow: none; }
.is-v2 .usecase-card:hover .usecase-head, .is-v2 .usecase-card.is-selected .usecase-head { background: var(--fir-pink); }
.is-v2 .usecase-card:hover .usecase-select, .is-v2 .usecase-card.is-selected .usecase-select { background: var(--fir-pink); }
.is-v2 .usecase-card.is-selected { border-color: var(--fir-pink); outline-color: var(--fir-pink); }

/* Navigation und Ergebnis */
.is-v2 .result-tab:hover { background: #f5f5f5; color: var(--fir-pink); }
.is-v2 .result-tab.is-active { color: var(--fir-pink); }
.is-v2 :is(.nav-step-button, .nav-action):hover:not(:disabled) { background: var(--fir-pink-50); color: var(--fir-pink); }
.is-v2 :is(button.measure-tile, button.bp-card, .road-tile):hover { border-color: var(--fir-pink); box-shadow: none; }
.is-v2 :is(button.measure-tile, button.bp-card):hover :is(.measure-title, .bp-card-title, .road-title) { color: var(--fir-pink); }
.is-v2 .v2-matrix tbody tr:hover .v2-matrix-name { box-shadow: inset 4px 0 0 var(--fir-pink); }
.is-v2 summary:hover { color: var(--fir-pink); }

/* Nach Referenz FIR-Broschüre: Aufzählungszeichen als schräger Magenta-Balken (wie im Logo), blaue Kastenüberschriften,
 * Ablauf als Bänder von Dunkelblau zu FIR-Blau mit Ziffernkreisen. Gilt auch im PDF. */
.is-v2 { --band-1: #1c2d4f; --band-2: #173f6d; --band-3: #0f528c; --band-4: #0067a6; }
.is-v2 :is(.v2-results, .plain-list) li { position: relative; padding-left: 1.35rem; }
.is-v2 :is(.v2-results, .plain-list) li::before { content: ""; position: absolute; left: .25rem; top: .38em; width: .28rem; height: .78em; border-radius: 0; background: var(--fir-magenta); transform: skewX(-18deg); }
.is-v2 .v2-intro-title { color: var(--primary); font-weight: 400; }
.is-v2 .result-summary .summary-title { color: var(--primary); font-weight: 500; }
.is-v2 .v2-subtitle { color: var(--primary); font-weight: 500; }

/* Ablauf auf der Startseite als Bänder */
.is-v2 .v2-flow { gap: 0; }
.is-v2 .v2-flow-step { position: relative; display: block; padding: 0; background: #fff; border-top: 0; }
.is-v2 .v2-flow-step strong { display: block; min-height: 3.1rem; padding: .8rem 1rem .8rem 3.3rem; background: var(--band, var(--band-4)); color: #fff; font-size: 1rem; font-weight: 600; line-height: 1.35; }
.is-v2 .v2-flow-no { position: absolute; left: .85rem; top: .7rem; width: 1.75rem; height: 1.75rem; border: 2px solid #fff; border-radius: 50%; background: transparent; color: #fff; font-size: .85rem; font-weight: 600; }
.is-v2 .v2-flow-step span:last-child { display: block; padding: .85rem 1rem 1rem; }
.is-v2 .v2-flow-step:nth-child(1) { --band: var(--band-1); }
.is-v2 .v2-flow-step:nth-child(2) { --band: var(--band-2); }
.is-v2 .v2-flow-step:nth-child(3) { --band: var(--band-3); }
.is-v2 .v2-flow-step:nth-child(4) { --band: var(--band-4); }
@media (max-width: 900px) { .is-v2 .v2-flow { gap: 2px; } }

/* Roadmap-Matrix: Wellen von Dunkelblau zu FIR-Blau */
.is-v2 .v2-matrix thead th:nth-child(1) { background: var(--band-1); }
.is-v2 .v2-matrix thead th:nth-child(2) { background: var(--band-2); }
.is-v2 .v2-matrix thead th:nth-child(3) { background: var(--band-3); }
.is-v2 .v2-matrix thead th:nth-child(n+4) { background: var(--band-4); }
.is-v2 .v2-intro .v2-intro-title { color: var(--primary); }

/* Roadmap nach FIR-Flyer „Smart Maintenance Roadmap“ (Grafik und Schrittkarten) */
.rm-chart { margin: 0 0 var(--ds-s4, 2.5rem); }
.rm-scroll { overflow-x: auto; }
.rm-svg { display: block; width: 100%; min-width: 720px; height: auto; }
.rm-node { cursor: pointer; outline: none; }
.rm-node .rm-dot { transition: stroke 140ms, stroke-width 140ms; }
.rm-node:hover .rm-dot, .rm-node:focus-visible .rm-dot { stroke: var(--fir-magenta); stroke-width: 3.5; }
.rm-legend { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .4rem 1.4rem; margin-top: .7rem; font-size: .88rem; color: var(--text); }
.rm-legend-item { display: inline-flex; align-items: center; gap: .45rem; }
.rm-legend-dot { width: 1rem; height: 1rem; border: 1.5px solid; border-radius: 50%; }
.rm-legend-dot.is-core { width: 1.25rem; height: 1.25rem; background: #fff; border: 3px solid #555; }

/* Schrittkarten wie die Maßnahmenkarten im Flyer: farbiger Kopf mit Nummernkreis, helle Fläche darunter */
.is-v2 { --k-measure: #5b8fd6; --k-measure-bg: #e6eef9; --k-prep: #3fa77a; --k-prep-bg: #e2f2ea; --k-clarify: #f0ad1c; --k-clarify-bg: #fdf2dc; }
.is-v2 .v2-roadmap { display: block; }
.is-v2 .v2-wave { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 265px), 1fr)); gap: 1.6rem 1rem; margin-bottom: 2rem; }
.is-v2 .v2-wave-title { grid-column: 1 / -1; margin: 0; padding: .55rem .9rem; border: 0; background: var(--band-2); color: #fff; font-size: 1rem; font-weight: 600; }
.is-v2 .v2-wave:nth-child(1) .v2-wave-title { background: var(--band-1); }
.is-v2 .v2-wave:nth-child(3) .v2-wave-title { background: var(--band-3); }
.is-v2 .v2-wave:nth-child(n+4) .v2-wave-title { background: var(--band-4); }
.is-v2 .v2-step { --k: var(--k-measure); --kb: var(--k-measure-bg); position: relative; margin-top: .9rem; border: 0; border-left: 0; background: var(--kb); box-shadow: none; transition: box-shadow 140ms; }
.is-v2 .v2-step.kind-prep { --k: var(--k-prep); --kb: var(--k-prep-bg); }
.is-v2 .v2-step.kind-clarify { --k: var(--k-clarify); --kb: var(--k-clarify-bg); }
.is-v2 .v2-step-head { position: static; gap: .3rem; padding: 1.15rem 1rem .85rem; background: var(--k); color: #fff; }
.is-v2 .v2-step-no { position: absolute; left: -.55rem; top: -.95rem; display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border: 2px solid var(--k); border-radius: 50%; background: #fff; color: var(--k); font-size: .9rem; font-weight: 700; }
.is-v2 .v2-step.is-core .v2-step-no { background: var(--k); color: #fff; border-color: #fff; box-shadow: 0 0 0 2px var(--k); }
.is-v2 .v2-step-head .v2-kind { color: rgb(255 255 255 / 85%); }
.is-v2 .v2-step-head .need-badge { background: #fff; }
.is-v2 .v2-step-head .v2-prio { color: rgb(255 255 255 / 85%); }
.is-v2 .v2-step-name { color: #fff; font-size: 1.05rem; font-weight: 500; }
.is-v2 .v2-step.is-core .v2-step-name { color: #fff; font-weight: 700; }
.is-v2 .v2-step-head .v2-enables { color: rgb(255 255 255 / 88%); }
.is-v2 .v2-step-body { padding: .7rem 1rem 1rem; }
.is-v2 .v2-step-body .v2-label { margin-top: .6rem; color: var(--primary); font-weight: 600; }
.is-v2 .v2-step:hover { box-shadow: 0 0 0 2px var(--fir-magenta); }
.is-v2 .v2-step:hover .v2-step-no { border-color: var(--fir-magenta); }
.is-v2 .v2-step-head:hover { color: #fff; }
.is-v2 .v2-step.is-flash { box-shadow: 0 0 0 3px var(--fir-magenta); }
.is-v2 .v2-step-head::after { content: "+"; position: absolute; right: .8rem; top: .55rem; font-size: 1.3rem; font-weight: 300; color: #fff; }
.is-v2 .v2-step[open] .v2-step-head::after { content: "–"; }
.is-v2 .pdf-export-root .v2-step-head::after { content: none; }
.is-v2 { --k-measure: #4a7fc8; --k-prep: #2f8f63; --k-clarify: #f2b230; }
.is-v2 .v2-step.kind-clarify .v2-step-head, .is-v2 .v2-step.kind-clarify .v2-step-name, .is-v2 .v2-step.kind-clarify .v2-step-head::after { color: #2b2b2b; }
.is-v2 .v2-step.kind-clarify .v2-step-head :is(.v2-kind, .v2-prio, .v2-enables) { color: #4a3a10; }
.is-v2 .v2-step.kind-clarify .v2-step-no { color: #8a5d00; }

/* PDF wie die FIR-Flyer: randlose Titelseite (Foto oben, Titel rechtsbündig in FIR-Blau, Logos unten rechts),
 * Kapitelüberschriften als hellblaues Band mit leichter blauer Schrift. Seitenband und Fußzeile setzt js/pdf-export.js. */
.pdf-export-root .pdf-cover { position: relative; display: block; padding: 0; overflow: hidden; background: #fff; }
.pdf-cover-photo { aspect-ratio: 1672 / 941; overflow: hidden; background: #e8f0f9; }
.pdf-cover-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 65% 55%; }
.pdf-cover-text { padding: 110px 70px 0 120px; text-align: right; }
.pdf-export-root .pdf-cover .pdf-eyebrow { margin: 0 0 18px; color: #8a8a8a; font-size: 1rem; font-weight: 400; }
.pdf-export-root .pdf-cover .pdf-banner { margin: 0; padding: 0; background: none; color: #0067a6; font-size: 3.4rem; font-weight: 300; line-height: 1.12; }
.pdf-export-root .pdf-cover .pdf-kind { margin: 18px 0 0; color: #555; font-size: 1.55rem; font-weight: 300; }
.pdf-export-root .pdf-cover .pdf-date { margin: 14px 0 0; color: #8a8a8a; font-size: 1rem; }
.pdf-cover-logos { position: absolute; right: 70px; bottom: 70px; display: flex; align-items: center; gap: 30px; }
.pdf-cover-logos img { display: block; height: 62px; width: auto; }
.is-v2 .pdf-export-root .result-heading { margin: 0 0 22px; padding: 20px 22px; background: linear-gradient(90deg, #e3ecf7 0%, #eef3fa 60%, #fff 100%); color: #0067a6; font-size: 2rem; font-weight: 300; }
.is-v2 .pdf-export-root .result-heading::after { content: none; }
.is-v2 .pdf-export-root .section-copy, .is-v2 .pdf-export-root .result-section > p { text-align: justify; }
.is-v2 .pdf-export-root .rm-svg { min-width: 0; }
.is-v2 .pdf-export-root .v2-step-body p.small { font-size: .9rem; }
.is-v2 .pdf-export-root :is(.v2-step-name, .v2-enables, .v2-tags) { display: block; margin-top: 4px; }
.is-v2 .pdf-export-root .v2-tags > * { margin-right: 6px; }
.pdf-export-root .rm-click-hint { display: none; }
.is-v2 .v2-flow-step:nth-child(5) { --band: #0a7bc2; }
.is-v2 .v2-flow-step strong { display: flex; align-items: center; min-height: 4rem; }

/* PDF näher an den FIR-Flyern (Supply-Chain-Assessment, Predictive Maintenance, Referenzen):
 * Kapitel mit Nummer in Magenta im offenen blauen Kreis, Überschrift FIR-Blau; Fließtext im Blocksatz; Abschlusskasten mit Kontakt. */
.is-v2 .pdf-export-root .result-heading { display: flex; align-items: center; gap: 16px; margin: 6px 0 20px; padding: 0; background: none; color: #0067a6; font-size: 1.85rem; font-weight: 500; }
.is-v2 .pdf-export-root .pdf-chap-no { display: grid; place-items: center; flex: none; width: 58px; height: 58px; border: 5px solid #0067a6; border-top-color: transparent; border-radius: 50%; color: var(--fir-magenta); font-size: 2.1rem; font-weight: 700; line-height: 1; }
.is-v2 .pdf-export-root .result-section { margin-top: 34px; }
.is-v2 .pdf-export-root .result-section > p, .is-v2 .pdf-export-root .summary-copy, .is-v2 .pdf-export-root .step-text { text-align: justify; hyphens: auto; }
.is-v2 .pdf-export-root .v2-kpi-value { color: #0067a6; }
.is-v2 .pdf-export-root .v2-kpi { border: 0; border-left: 4px solid var(--ds-neutral); background: #f2f2f2; }
.is-v2 .pdf-export-root .v2-kpi.kpi-low { border-left-color: var(--ds-ok); } .is-v2 .pdf-export-root .v2-kpi.kpi-high { border-left-color: var(--ds-warn); }
.pdf-export-root .pdf-contact { margin-top: 40px; }
.pdf-contact-box { padding: 26px 30px; background: #ececec; border-bottom: 8px solid var(--fir-magenta, #dc1968); }
.pdf-contact-box h3 { margin: 0 0 8px; color: #0067a6; font-size: 1.5rem; font-weight: 500; }
.pdf-contact-box p { margin: 0; color: #4a4a4a; font-size: 1rem; }
.pdf-contact-foot { display: flex; justify-content: space-between; align-items: flex-end; padding: 22px 30px 0; }
.pdf-contact-foot p { margin: 0; color: #4a4a4a; font-size: .95rem; line-height: 1.55; }
.pdf-contact-foot .pdf-contact-label { margin-bottom: 8px; color: #0067a6; font-size: 1.35rem; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; }
.pdf-contact-foot img { height: 70px; width: auto; }
.is-v2 .step-item::before { border-radius: 50% !important; background: #fff; border: 2px solid var(--primary); color: var(--primary); }

/* ===================== Startseite und Use Cases nach Annas Rückmeldung (23.10.) =====================
 * Titelbild füllt die erste Bildschirmseite über die volle Breite, Titel und Start darauf; Schritte 1 bis 5 als Band ohne Erklärtexte. */
.is-v2 #intro-view.landing:not([hidden]) { grid-template-areas: "hero" "steps" "kicker" "lead" "more"; }
.is-v2 .landing .hero-photo { height: clamp(380px, calc(100vh - 5.2rem - 6.5rem), 760px); }
.is-v2 #intro-title { align-self: end; margin-bottom: clamp(6.5rem, 9vw, 8rem); padding: 1.1rem 1.8rem 1.25rem; font-size: clamp(1.8rem, 3.4vw, 3rem); animation: fir-slide-in .8s cubic-bezier(.2, .7, .2, 1) both; }
.is-v2 .landing .hero-actions { grid-area: hero; z-index: 1; align-self: end; justify-self: start; margin: 0 0 clamp(2rem, 3vw, 2.6rem) !important; animation: fir-slide-in .8s .15s cubic-bezier(.2, .7, .2, 1) both; }
.is-v2 .landing .hero-actions .primary-button { min-height: 3.4rem; padding: .8rem 2.2rem; font-size: 1rem; box-shadow: 0 10px 24px rgb(1 24 52 / 35%); }
.is-v2 .landing .hero-photo img { animation: fir-kenburns 24s ease-in-out infinite alternate; transform-origin: 65% 55%; }
.is-v2 .v2-steps { grid-area: steps; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); width: 100vw; margin: 0 0 0 calc(50% - 50vw); padding: 0; list-style: none; }
.is-v2 .v2-steps-item { display: flex; align-items: center; gap: .9rem; min-height: 6.5rem; padding: 1rem clamp(1rem, 2.4vw, 2.2rem); background: var(--band-5, #0a7bc2); color: #fff; font-size: 1.15rem; font-weight: 500; line-height: 1.3; animation: fir-rise .6s calc(.25s + var(--i, 0) * .08s) cubic-bezier(.2, .7, .2, 1) both; transition: filter .2s; }
.is-v2 .v2-steps-item:nth-child(1) { background: var(--band-1); } .is-v2 .v2-steps-item:nth-child(2) { background: var(--band-2); }
.is-v2 .v2-steps-item:nth-child(3) { background: var(--band-3); } .is-v2 .v2-steps-item:nth-child(4) { background: var(--band-4); }
.is-v2 .v2-steps-item:hover { filter: brightness(1.12); }
.is-v2 .v2-steps-no { display: grid; place-items: center; flex: none; width: 2.6rem; height: 2.6rem; border: 2px solid #fff; border-radius: 50%; font-size: 1.15rem; font-weight: 600; }
.is-v2 .v2-kicker { margin-top: 1.4rem; }
@media (max-width: 900px) {
  .is-v2 .v2-steps { grid-template-columns: minmax(0, 1fr); }
  .is-v2 .v2-steps-item { min-height: 4rem; }
  .is-v2 .landing .hero-photo { height: clamp(360px, 80vh, 560px); }
}

/* Use-Case-Seite über die ganze Breite: fünf Kacheln nebeneinander auf breiten Bildschirmen */
.is-v2 .usecase-cards { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .75rem; }
@media (max-width: 1400px) { .is-v2 .usecase-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 960px) { .is-v2 .usecase-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .is-v2 .usecase-cards { grid-template-columns: minmax(0, 1fr); } }
.is-v2 .usecase-head { min-height: 6.4rem; }

/* Bewegung beim Überfahren und Klicken (Anregung: Stanford-Website), sparsam und schnell */
@keyframes fir-slide-in { from { opacity: 0; transform: translateX(-28px); } to { opacity: 1; transform: none; } }
@keyframes fir-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes fir-kenburns { from { transform: scale(1); } to { transform: scale(1.08); } }
@keyframes fir-pop { 0% { transform: scale(.97); } 60% { transform: scale(1.015); } 100% { transform: scale(1); } }
.is-v2 .rv { opacity: 0; transform: translateY(22px); transition: opacity .55s calc(var(--rv, 0) * 60ms) ease, transform .55s calc(var(--rv, 0) * 60ms) cubic-bezier(.2, .7, .2, 1), box-shadow .25s, border-color .2s; }
.is-v2 .rv.is-in { opacity: 1; transform: none; }
.is-v2 :is(.usecase-card, .v2-step, button.bp-card, button.measure-tile, .v2-kern, .step-item, .sprint-card, .v2-intro-block) { transition: transform .25s cubic-bezier(.2, .7, .2, 1), box-shadow .25s, border-color .2s, opacity .55s; }
.is-v2 :is(.usecase-card, .v2-step, button.bp-card, button.measure-tile, .sprint-card):hover { transform: translateY(-6px); box-shadow: 0 16px 32px rgb(1 24 52 / 16%); }
.is-v2 :is(.v2-kern, .step-item, .v2-intro-block):hover { transform: translateY(-3px); box-shadow: 0 10px 22px rgb(1 24 52 / 10%); }
.is-v2 .usecase-card.is-selected { animation: fir-pop .35s ease; }
.is-v2 :is(.answer-option, .option-chip) { transition: transform .18s, box-shadow .18s, border-color .15s, background-color .15s; }
.is-v2 :is(.answer-option, .option-chip):hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgb(1 24 52 / 10%); }
.is-v2 :is(.answer-option, .option-chip):has(input:checked) { animation: fir-pop .3s ease; }
.is-v2 :is(.primary-button, .secondary-button, .usecase-select) { transition: background-color .2s, border-color .2s, color .2s, transform .15s, box-shadow .2s; }
.is-v2 :is(.primary-button, .secondary-button):active:not(:disabled) { transform: scale(.97); }
.is-v2 :is(.primary-button, .secondary-button, .usecase-select) svg { transition: transform .2s; }
.is-v2 :is(.primary-button, .secondary-button):hover:not(:disabled) svg { transform: translateX(4px); }
.is-v2 #prefilter-back:hover svg, .is-v2 .back-to-questions:hover svg { transform: translateX(-4px); }
.is-v2 .result-panels > .result-section:not(.is-tab-hidden) { animation: fir-rise .4s cubic-bezier(.2, .7, .2, 1); }
.is-v2 .rm-node { transform-box: fill-box; transform-origin: center; animation: fir-node .45s calc(var(--n, 0) * 40ms) cubic-bezier(.2, .9, .3, 1.3) both; transition: transform .15s; }
.is-v2 .rm-node:hover { transform: scale(1.18); }
@keyframes fir-node { from { opacity: 0; transform: scale(.4); } to { opacity: 1; transform: none; } }
.is-v2 .brand-header .header-button { position: relative; }
.is-v2 .brand-header .header-button::after { content: ""; position: absolute; left: .75rem; right: .75rem; bottom: .2rem; height: 2px; background: var(--fir-magenta); transform: scaleX(0); transform-origin: left; transition: transform .25s; }
.is-v2 .brand-header .header-button:hover:not([aria-disabled="true"])::after { transform: scaleX(1); }
.is-v2 .brand-header .menu-button::after { content: none; }
/* PDF und „Bewegung reduzieren“: alles sofort sichtbar und ruhig */
.pdf-export-root .rv, .pdf-export-root .rv.is-in { opacity: 1 !important; transform: none !important; }
.pdf-export-root *, .pdf-export-root *::before, .pdf-export-root *::after { animation: none !important; transition: none !important; }
@media (prefers-reduced-motion: reduce) {
  .is-v2 *, .is-v2 *::before, .is-v2 *::after { animation: none !important; transition: none !important; }
  .is-v2 .rv { opacity: 1; transform: none; }
  .is-v2 :is(.usecase-card, .v2-step, button.bp-card, button.measure-tile, .sprint-card, .v2-kern, .step-item, .v2-intro-block, .answer-option, .option-chip):hover { transform: none; }
}

/* Mindestschriftgröße 12 pt (16 px) im neuen Ablauf: alle kleineren Texte auf 1rem angehoben (geprüft per Skript über alle Ansichten) */
body.is-v2 :is(.rail-pct, .need-badge, .v2-uc-label, .nav-step-mark, .nav-section-label, .usecase-select, .select-badge, .v2-kicker, .usecase-no,
  .choice-icon, .v2-kind, .v2-label, .tile-more, .primary-button, .secondary-button, .text-button, .language-switch button, .option-check, .choice-copy strong,
  .choice-copy small, .export-panel small, .small, .muted, .rm-click-hint, .v2-matrix-copy, .v2-prio, .v2-enables, .header-button, .v2-uc-mtext, .v2-next-hint,
  .rm-legend, .rm-legend-item, .v2-privacy, .question-prompt, .v2-qmeta, .v2-context, .v2-context *, .option-label, .result-tab, .v2-step-no, .nav-action,
  .nav-progress-text, .v2-kpi-label, .select-intro p, .nav-step-label, .summary-copy, .plain-list li, .step-text, .bp-card-short, .bp-card-title,
  .bp-card-company, .bp-label, .v2-cell-kind, .v2-hint, .usecase-text, .usecase-summary, .prereq-name, .step-label, .v2-uc-value) { font-size: 1rem !important; }
body.is-v2 .rail-ring { width: 3.6rem; height: 3.6rem; }
.is-v2 #intro-title { max-width: min(60rem, 92%); }
.is-v2 .v2-uc-metric { grid-template-columns: minmax(0, 1fr); gap: .1rem; }
.is-v2 .v2-uc-value { font-size: 1.35rem !important; }
@media print { .is-v2 .rv { opacity: 1 !important; transform: none !important; } }

/* Handy: Hero-Titel ohne Silbentrennung mitten im Wort */
@media (max-width: 600px) {
  .is-v2 #intro-title { max-width: 100%; font-size: clamp(1.35rem, 6.4vw, 1.8rem); overflow-wrap: normal; word-break: normal; hyphens: manual; padding: .9rem 1.1rem 1rem; }
}

/* Eine gemeinsame Führungslinie: Kopfzeile, Titelbox im Bild, Use Cases, Fragen und Ergebnis beginnen an derselben linken Kante und sind gleich breit */
.is-v2 { --ds-max: 1640px; }
.is-v2 #question-view .assessment-container { max-width: none; }
.is-v2 .usecase-card .usecase-head, .is-v2 .usecase-card .usecase-body { padding-inline: clamp(.9rem, 1.1vw, 1.25rem); }
.is-v2 .rail-total { grid-template-columns: minmax(0, 1fr) 3.6rem; }
/* Schrittband 1–5 auf der Inhaltsbreite: beginnt an der Kante des FIR-Logos und endet bei DE/EN */
.is-v2 .v2-steps { width: 100%; margin: 0; }
/* Bild, Schrittband und Kopfzeile teilen beide Kanten: links Logo, rechts DE/EN */
.is-v2 .landing .hero-photo { width: 100%; margin: 0; }
.is-v2 #intro-title, .is-v2 .landing .hero-actions { margin-left: clamp(1rem, 2.5vw, 2.5rem) !important; }

/* ===== Ergebnis-Tabs auf schmalen Bildschirmen: umbrechen statt seitlich abschneiden ===== */
@media (max-width: 860px) {
  .result-tabs { flex-wrap: wrap; overflow-x: visible; }
  .result-tab { flex: 1 1 auto; white-space: normal; }
}

/* ===== Rechtliches: Fußzeile, Impressum/Datenschutz, Einwilligung ===== */
.site-footer { display: flex; justify-content: center; padding: 1.25rem 1rem 1.75rem; border-top: 1px solid var(--line); background: #fff; }
.site-footer nav { display: flex; flex-wrap: wrap; justify-content: center; gap: .25rem 1.25rem; }
.site-footer .text-button { min-height: 2.5rem; padding: .4rem .25rem; font-size: .875rem; font-weight: 600; }
.legal-dialog { width: min(760px, calc(100vw - 2rem)); max-height: calc(100vh - 2rem); padding: 1.25rem 1.5rem 1.5rem; border: 0; border-radius: var(--radius); color: var(--text); box-shadow: 0 20px 60px rgb(0 0 0 / 30%); }
.legal-dialog::backdrop { background: rgb(0 0 0 / 50%); }
.legal-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; }
.legal-head h2 { margin: 0; font-size: 1.4rem; color: var(--primary); }
.legal-body h3 { margin: 1.25rem 0 .35rem; font-size: 1.05rem; }
.legal-body p { margin: 0 0 .6rem; line-height: 1.55; overflow-wrap: anywhere; }
.legal-ph { padding: 0 .25em; background: #fff3b0; color: #1f1f1f; }
.consent-banner { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; padding: 1rem max(1rem, calc((100vw - 1100px) / 2)); border-top: 4px solid var(--primary); background: #fff; color: var(--text); box-shadow: 0 -8px 30px rgb(0 0 0 / 18%); }
.consent-banner[hidden] { display: none; }
.consent-copy { flex: 1 1 28rem; }
.consent-copy h2 { margin: 0 0 .25rem; font-size: 1.05rem; }
.consent-copy p { margin: 0 0 .25rem; font-size: .9rem; line-height: 1.5; }
.consent-copy .text-button { min-height: 2rem; padding: .2rem 0; font-size: .875rem; }
.consent-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.consent-actions button { flex: 1 1 10rem; }
body.has-consent-banner { padding-bottom: 12rem; }
@media print { .consent-banner, .site-footer, .legal-dialog { display: none !important; } }

/* Startseite: das Bild füllt weiterhin das Fenster, die Fußzeile liegt darunter */
body[data-view="intro"] > main.app-shell { flex: 1 0 auto; min-height: calc(100dvh - var(--header-h, 0px)); }

/* ===== PDF-Export: Randsicherheit, Plaketten und Blocksatz ===== */
/* Ränder: Rahmen und Kreise am Blockrand wurden beim Rendern angeschnitten */
.pdf-export-root > .pdf-block:not(.pdf-cover):not(.pdf-contact):not(.pdf-imprint) { box-sizing: border-box; padding: 6px 10px 14px; }
.pdf-export-root > .pdf-contact { padding-bottom: 26px; }
/* Plaketten (z. B. „Vorbereitung nötig“) nicht über Zeilen umbrechen: html2canvas zeichnete sonst eine weiße Fläche über dem Nachbartext */
.pdf-export-root :is(.need-badge, .v2-kind, .v2-prio, .sprint-chip, .wave-tag) { display: inline-block; white-space: nowrap; vertical-align: middle; line-height: 1.45; }
/* Blocksatz mit Silbentrennung führte zu zerrissenen Wörtern („Vorauss etzung“) */
.is-v2 .pdf-export-root :is(.result-section > p, .summary-copy, .step-text, .section-copy) { text-align: left; hyphens: manual; -webkit-hyphens: manual; }
/* Impressum auf dem Handy: mehr Breite, damit jeder Geschäftsführer-Name in eine Zeile passt */
@media (max-width: 480px) { .legal-dialog { width: calc(100vw - .75rem); max-width: none; padding-inline: .8rem; } .legal-names { font-size: min(1rem, 3.75vw); } }
/* Logos führen zum Hauptmenü; der eigene Button „Hauptmenü“ entfällt im neuen Ablauf */
.is-v2 #home-button { display: none !important; }
.is-v2 .logo-pair.is-home-link { cursor: pointer; transition: opacity .15s ease, transform .15s ease; }
.is-v2 .logo-pair.is-home-link:hover { opacity: .8; }
.is-v2 .logo-pair.is-home-link:active { transform: scale(.98); }
.is-v2 .logo-pair.is-home-link:focus-visible { outline: 3px solid #dc1968; outline-offset: 4px; }
/* Navigation öffnet rechts, beim Menü-Symbol und DE/EN */
.is-v2 dialog.nav-menu { inset: 0 0 0 auto; border-right: 0; border-left: 1px solid var(--line); box-shadow: -6px 0 24px rgb(0 40 90 / 18%); animation-name: nav-in-right; }
.is-v2 dialog.nav-menu.is-closing { animation-name: nav-out-right; }
@keyframes nav-in-right { from { transform: translateX(100%); } to { transform: none; } }
@keyframes nav-out-right { from { transform: none; } to { transform: translateX(100%); } }
/* Antwortsymbole als Grafik: bleiben beim Auswählen unverändert (keine Füllung, kein Rahmen) */
.is-v2 .choice-icon.is-svg, .is-v2 .answer-option:has(input:checked) .choice-icon.is-svg, .is-v2 .answer-option:hover .choice-icon.is-svg { width: 2.4rem; height: 2.4rem; padding: 0; border: 0; border-radius: 0; background: none; }
.is-v2 .answer-option.compact .choice-icon.is-svg { width: 2.2rem; height: 2.2rem; }
.is-v2 .choice-icon.is-svg svg { display: block; width: 100%; height: 100%; }
/* Haken in der Mehrfachauswahl als Grafik: gerade und mittig */
.is-v2 .option-check.is-svg { width: 1.45rem; height: 1.45rem; padding: 0; color: transparent; }
.is-v2 .option-chip:has(input:checked) .option-check.is-svg { color: #fff; }
.is-v2 .option-check.is-svg svg { display: block; width: 100%; height: 100%; }
/* Schrittkarten: nur die angeklickte Karte wächst, die Nachbarn in derselben Reihe behalten ihre Höhe */
.is-v2 .v2-wave { align-items: start; }
/* Alle Schrittkarten gleich viel Farbe: der farbige Kopf ist überall gleich hoch; der helle Bereich mit dem Text erscheint erst beim Öffnen */
.is-v2 .v2-step-head { display: flex; flex-direction: column; justify-content: flex-start; box-sizing: border-box; min-height: 13rem; }
.is-v2 .v2-step:not([open]) :is(.v2-step-name, .v2-enables) { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
.is-v2 .v2-step:not([open]) .v2-step-name { -webkit-line-clamp: 3; }
.is-v2 .v2-step:not([open]) .v2-enables { -webkit-line-clamp: 2; }
.is-v2 .pdf-export-root .v2-step-head { display: block; min-height: 0; }
.is-v2 .pdf-export-root .v2-step :is(.v2-step-name, .v2-enables) { display: block; -webkit-line-clamp: unset; overflow: visible; }
/* Use-Case-Karten: Kopf, Ziel, „Ergebnisse aus der Praxis“ und Button liegen in einer Reihe auf gleicher Höhe (Subgrid) */
.is-v2 .usecase-card { display: grid; grid-template-rows: subgrid; grid-row: span 4; row-gap: 0; }
.is-v2 .usecase-body { display: contents; }
.is-v2 .v2-uc-goal { padding: 1.1rem 1.1rem 0; }
.is-v2 .v2-uc-practice { align-self: start; margin: 1.1rem 1.1rem 0; }
.is-v2 .usecase-select { align-self: end; }
.is-v2 .v2-uc-label { white-space: nowrap; letter-spacing: 0; } /* „Ergebnisse aus der Praxis“ in einer Zeile */
.is-v2 .v2-uc-practice { margin-bottom: 1.1rem; }
/* Impressum im PDF: kompakt nach dem Kontaktkasten */
.pdf-export-root > .pdf-imprint { margin-top: 34px; padding: 18px 30px 10px; border-top: 1px solid #d0d0d0; color: #4a4a4a; }
.pdf-imprint h3 { margin: 0 0 12px; color: #0067a6; font-size: 1.15rem; font-weight: 500; }
.pdf-imprint dl { display: grid; grid-template-columns: 15rem minmax(0, 1fr); gap: 8px 20px; margin: 0; font-size: .9rem; line-height: 1.45; }
.pdf-imprint dt { font-weight: 700; }
.pdf-imprint dd { margin: 0; white-space: pre-line; }
/* Roadmap-Grafik auf schmalen Bildschirmen: Hinweis aufs seitliche Wischen */
.rm-swipe-hint { margin: 0 0 .5rem; color: var(--ds-blue, #00549c); font-size: 1rem; font-weight: 700; }
.rm-swipe-hint[hidden], .pdf-export-root .rm-swipe-hint { display: none; }