/* KI-Redaktionssystem – Produktseite und Redaktionstag im Soft-Minimal-Look von moess.de
   Baut auf /aus-der-praxis/praxis.css auf (Farben, Kopfleiste, Fußzeile, Buttons).
   Die alten Farbnamen bleiben als Alias erhalten und zeigen auf die neue Farbwelt;
   der Block „Soft-Minimal“ am Ende setzt Rundungen, Etiketten und Flächen. */
:root { --ink-rgb: 26,26,24; --cream: var(--karte); --sand: var(--flaeche); --ink: var(--tinte); --cream-text: #F6F5F1; --water-deep: #24394A;
  --orange-deep: var(--orange); --orange-text: #B8391A; --mono: "Bricolage Grotesque", system-ui, sans-serif; }
html { scroll-behavior: smooth; scroll-padding-top: 20px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { font-size: 16px; line-height: 1.6; }

.wrap { max-width: 1120px; margin: 0 auto; padding: 0 20px; }
.band { padding: 80px 0; }
.band + .band { border-top: 1px solid rgba(var(--ink-rgb),.2); }
.band.cream { background: var(--cream); border-top: 0; }
.band.water { background: var(--tinte); color: var(--cream-text); border-top: 0; }

.label { display: flex; align-items: center; gap: 14px; margin: 0 0 26px; }
.label::after { content: ""; flex: 1; height: 2px; background: var(--orange); opacity: .8; }
.water .label { color: var(--cream-text); }
.water .label::after { background: var(--cream-text); opacity: .45; }
.title { font-weight: 600; font-size: clamp(28px, 4.4vw, 50px); line-height: 1.12; text-wrap: balance; margin: 0 0 18px; max-width: 22ch; }
.lede { font-size: 19px; max-width: 60ch; margin: 0 0 40px; }
.water .lede { opacity: .92; }
.mini { font-family: var(--mono); font-size: 12px; letter-spacing: .6px; text-transform: uppercase; }
.dev { display: inline-block; vertical-align: middle; margin-left: 6px; padding: 1px 8px; border: 1.5px dashed currentColor; font-family: var(--mono); font-size: 10.5px; font-weight: 400; letter-spacing: .6px; text-transform: uppercase; white-space: nowrap; opacity: .75; }

/* Kopfleiste: Anker dieser Seite */
.cta-ghost { display: inline-flex; align-items: center; min-height: 48px; padding: 0 20px; border: 1px solid var(--linie); color: var(--ink); font-weight: 600; font-size: 16px; text-decoration: none; background: transparent; transition: background .15s, color .15s; }
.cta-ghost:hover { background: var(--ink); color: var(--cream); }
.cta-ghost:focus-visible, .cta-btn:focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
.cta-btn { min-height: 48px; font-size: 16px; }

/* ── Hero ── */
.hero { background: var(--cream); padding: 64px 0 72px; }
.hero .wrap { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 56px; align-items: center; }
.hero h1 { font-weight: 600; font-size: clamp(32px, 4.4vw, 58px); hyphens: manual; -webkit-hyphens: manual; line-height: 1.12; margin: 0 0 24px; text-wrap: balance; }
.hero h1 em { font-style: normal; color: var(--orange-deep); }
.hero .lede { margin-bottom: 30px; max-width: 46ch; }
.cta-row { display: flex; flex-wrap: wrap; gap: 12px 14px; align-items: center; }
.proofline { margin: 22px 0 0; font-family: var(--mono); font-size: 12.5px; letter-spacing: .5px; text-transform: uppercase; display: flex; align-items: center; gap: 10px; }
.proofline::before { content: ""; width: 10px; height: 10px; background: var(--water-deep); flex: none; }
@media (max-width: 1080px) { .hero .wrap { grid-template-columns: 1fr; gap: 40px; } .hero .fahne, .hero .setup { max-width: 640px; } }

/* Korrekturfahne mit Stempel */
.fahne { position: relative; margin: 0; background: var(--karte); border: 1px solid rgba(var(--ink-rgb),.3); padding: 22px 24px 96px; display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: 0 20px; }
.fahne-head { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 12px; padding-bottom: 10px; margin-bottom: 16px; border-bottom: 1px solid rgba(var(--ink-rgb),.25); color: var(--orange-text); }
.fahne h3, .fahne h4, .fahne .fahne-titel { font-weight: 600; font-size: 22px; line-height: 1.2; margin: 0 0 12px; }
.fahne p { margin: 0 0 10px; font-size: 16.5px; line-height: 1.55; }
.hl { background: var(--blau); box-shadow: inset 0 -2px 0 var(--water-deep); padding: 0 2px; }
.hl.x { background: rgba(255,92,52,.14); box-shadow: inset 0 -2px 0 var(--orange-deep); text-decoration: line-through; text-decoration-color: var(--orange-deep); text-decoration-thickness: 2px; }
.rand { border-left: 1.5px dashed rgba(var(--ink-rgb),.35); padding-left: 14px; display: flex; flex-direction: column; gap: 14px; font-family: var(--mono); font-size: 11.5px; line-height: 1.45; }
.rand b { display: block; font-weight: 500; font-size: 10.5px; letter-spacing: .6px; text-transform: uppercase; color: var(--water-deep); }
.rand .w b { color: var(--orange-text); }
.stempel { position: absolute; right: 22px; bottom: 20px; transform: rotate(-7deg); border: 3px solid var(--orange-text); color: var(--orange-text); padding: 8px 14px 7px; text-align: center; line-height: 1.15; font-family: var(--mono); animation: stempel .55s cubic-bezier(.2,1.4,.4,1) .5s both; }
.stempel strong { display: block; font-size: 19px; letter-spacing: 3px; font-weight: 500; }
.stempel small { font-size: 10.5px; letter-spacing: 1px; text-transform: uppercase; }
@keyframes stempel { from { transform: rotate(-12deg) scale(1.35); opacity: 0; } to { transform: rotate(-7deg) scale(1); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .stempel { animation: none; } }
@media (max-width: 560px) { .fahne { grid-template-columns: 1fr; padding: 18px 18px 92px; } .rand { border-left: 0; border-top: 1.5px dashed rgba(var(--ink-rgb),.35); padding: 12px 0 0; margin-top: 8px; } }

/* ── Kennzahlen ── */
.stats { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(246,245,241,.25); border-bottom: 1px solid rgba(246,245,241,.25); }
.stats div { padding: 22px 18px 20px 0; display: flex; flex-direction: column; gap: 6px; }
.stats div + div { border-left: 1.5px solid rgba(246,245,241,.25); padding-left: 18px; }
.stats b { font-weight: 600; font-size: clamp(34px, 5vw, 56px); line-height: 1.12; color: var(--orange); font-variant-numeric: tabular-nums; }
.stats span { font-size: 14.5px; line-height: 1.4; }
.stats-note { margin: 14px 0 0; font-size: 13.5px; opacity: .8; }
@media (max-width: 860px) { .stats { grid-template-columns: 1fr 1fr; } .stats div:nth-child(3) { border-left: 0; padding-left: 0; } .stats div:nth-child(n+3) { border-top: 1.5px solid rgba(246,245,241,.25); } }

/* ── Nutzen ── */
.gains { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.gain { background: var(--cream); padding: 24px 22px 24px; display: flex; flex-direction: column; gap: 10px; }
.gain h3 { font-weight: 600; font-size: 22px; line-height: 1.1; margin: 0; }
.gain p { margin: 0; font-size: 16px; }
@media (max-width: 860px) { .gains { grid-template-columns: 1fr; } }

/* ── Ablauf: Schritte links, Laufzettel rechts ── */
.journey { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .82fr); gap: 56px; }
.steps { list-style: none; margin: 0; padding: 0; position: relative; }
.step:not(:last-child)::before { content: ""; position: absolute; left: 21px; top: 50px; bottom: 6px; width: 2px; background: rgba(var(--ink-rgb),.2); }
.step { position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 18px; padding-bottom: 38px; transition: opacity .4s; }
.step:last-child { padding-bottom: 0; }
.steps.live .step:not(.is-current):not(.is-past) { opacity: .42; }
.mk { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--sand); border: 2px solid rgba(var(--ink-rgb),.5); font-family: var(--mono); font-size: 12px; position: relative; z-index: 1; transition: background .3s, color .3s, border-color .3s; }
.step.agent .mk { background: var(--cream); }
.step.is-current .mk { border-color: var(--orange); background: var(--orange); color: #fff; }
.step.gate .mk { border-radius: 6px; transform: rotate(45deg) scale(.86); border: 2px dashed var(--orange-deep); background: var(--sand); color: var(--orange-text); }
.step.gate .mk span { transform: rotate(-45deg); font-weight: 500; }
.step.gate.is-current .mk, .step.gate.is-past .mk { border-style: solid; background: var(--orange-deep); color: #fff; }
.who { font-family: var(--mono); font-size: 12px; letter-spacing: .6px; text-transform: uppercase; color: var(--orange-text); padding-top: 11px; margin-bottom: 4px; }
.step h3 { font-weight: 600; font-size: clamp(20px, 2.2vw, 25px); line-height: 1.12; margin: 0 0 8px; }
.step p { margin: 0; max-width: 58ch; }
.step.gate .card { border: 2px dashed var(--orange-deep); background: rgba(255,92,52,.07); padding: 18px 20px 20px; }
.step.gate .who { padding-top: 0; }
.more-note { margin-top: 14px; padding-top: 14px; border-top: 1.5px dashed rgba(255,92,52,.5); font-size: 15.5px; }
.snip { margin-top: 14px; background: var(--cream); border: 1px solid rgba(var(--ink-rgb),.25); padding: 14px 16px; font-family: var(--mono); font-size: 13px; line-height: 1.7; overflow-x: auto; }
.snip ul { margin: 0; padding-left: 18px; }
.snip .k { opacity: .7; }
.snip .ok { color: var(--water-deep); font-weight: 500; }
.snip .no { color: var(--orange-text); font-weight: 500; }

.laufzettel-wrap { position: sticky; top: 24px; align-self: start; }
.laufzettel { position: relative; margin: 0; border: 1px solid rgba(var(--ink-rgb),.25); background-color: var(--karte); background-image: radial-gradient(rgba(var(--ink-rgb),.2) 1px, transparent 1.3px); background-size: 18px 18px; padding: 26px 22px 22px; }
.lz { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; position: relative; }
.lz li + li::before { content: ""; position: absolute; left: 18px; top: -9px; width: 2px; height: 7px; background: rgba(var(--ink-rgb),.3); }
.lz li { position: relative; display: flex; align-items: center; gap: 12px; min-height: 36px; background: var(--cream); border: 1px solid rgba(var(--ink-rgb),.3); padding: 6px 12px 6px 6px; transition: border-color .35s, background .35s, color .35s, opacity .35s, box-shadow .35s; }
.lz li .i { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; flex: none; background: rgba(var(--ink-rgb),.08); transition: background .35s, color .35s; }
.lz li .i svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.lz li b { font-size: 15px; font-weight: 600; line-height: 1.15; }
.lz li em { margin-left: auto; font-style: normal; font-family: var(--mono); font-size: 10.5px; letter-spacing: .5px; text-transform: uppercase; opacity: .75; white-space: nowrap; }
.lz li.g { background: transparent; border-style: dashed; border-color: rgba(255,92,52,.7); }
.lz li.g .i { border-radius: 5px; transform: rotate(45deg) scale(.78); background: transparent; border: 2px dashed var(--orange-deep); color: var(--orange-text); font-family: var(--mono); font-size: 13px; }
.lz li.g .i span { transform: rotate(-45deg); }
.lz li.opt { border-style: dashed; }
.lz li.pending { opacity: .5; }
.step.opt .mk { border-style: dashed; background: var(--sand); }
.lz li.active { border-color: var(--orange); box-shadow: 0 0 0 4px rgba(255,92,52,.16); opacity: 1; }
.lz li.active .i { background: var(--orange); color: #fff; }
.lz li.done { border-color: rgba(var(--ink-rgb),.6); }
.lz li.done .i { background: var(--ink); color: var(--cream); }
.lz li.g.done { border-style: solid; border-color: var(--orange-deep); background: rgba(255,92,52,.1); }
.lz li.g.done .i, .lz li.g.active .i { background: var(--orange-deep); border-style: solid; color: #fff; }
.lz li.live.done { background: var(--water-deep); border-color: var(--water-deep); color: var(--cream-text); }
.lz li.live.done .i { background: var(--orange); color: #fff; }
.laufzettel { padding-right: 44px; }
.schleife { position: absolute; right: 16px; width: 18px; border: 1.5px dashed rgba(var(--ink-rgb),.35); border-left: 0; transition: border-color .35s; }
.schleife.on { border-color: var(--orange-deep); animation: dash 1s linear infinite; }
@keyframes dash { 50% { border-color: rgba(255,92,52,.45); } }
.lz-cap { margin: 12px 0 0; }
@media (prefers-reduced-motion: reduce) { .lz li, .lz li .i, .step, .mk { transition: none; } .schleife.on { animation: none; } }
@media (max-width: 900px) { .journey { grid-template-columns: 1fr; gap: 32px; } .laufzettel-wrap { position: static; order: -1; } }

/* ── Leitplanken ── */
.rails { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--linie); }
.rail { padding: 24px 24px 28px 0; border-bottom: 1px solid rgba(var(--ink-rgb),.2); display: flex; flex-direction: column; gap: 10px; }
.rail:not(:nth-child(3n+1)) { padding-left: 24px; border-left: 1px solid rgba(var(--ink-rgb),.2); }
.rail .mini { color: var(--orange-text); }
.rail h3 { font-weight: 600; font-size: 21px; line-height: 1.12; margin: 0; }
.rail p { margin: 0; font-size: 16px; }
@media (max-width: 900px) { .rails { grid-template-columns: 1fr 1fr; } .rail:not(:nth-child(3n+1)) { padding-left: 0; border-left: 0; } .rail:nth-child(2n) { padding-left: 24px; border-left: 1px solid rgba(var(--ink-rgb),.2); } }
@media (max-width: 600px) { .rails { grid-template-columns: 1fr; } .rail:nth-child(2n) { padding-left: 0; border-left: 0; } }

/* ── Datenschutz ── */
.privacy { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.pcol { background: var(--cream); padding: 24px 24px 26px; display: flex; flex-direction: column; gap: 16px; }
.pcol.next { background: transparent; border: 1.5px dashed rgba(var(--ink-rgb),.35); }
.pcol .mini { color: var(--water-deep); font-weight: 500; }
.pcol.next .mini { color: var(--orange-text); }
.plist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.plist li { font-size: 16px; line-height: 1.55; }
.plist strong { display: block; font-weight: 600; }
@media (max-width: 800px) { .privacy { grid-template-columns: 1fr; } }

/* ── Kosten ── */
.costs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: start; }
.log { background: var(--cream); border: 1px solid rgba(var(--ink-rgb),.3); margin: 0; }
.log-head { display: flex; justify-content: space-between; gap: 12px; padding: 12px 18px; border-bottom: 1px solid rgba(var(--ink-rgb),.2); color: var(--orange-text); }
.log-scroll { overflow-x: auto; }
.log table { width: 100%; border-collapse: collapse; font-family: var(--mono); font-size: 13px; font-variant-numeric: tabular-nums; }
.log th { font-weight: 400; text-align: left; padding: 10px 18px 4px; font-size: 11px; letter-spacing: .6px; text-transform: uppercase; opacity: .75; white-space: nowrap; }
.log td { padding: 6px 18px 14px; white-space: nowrap; }
.log .r { text-align: right; }
.pill { display: inline-block; padding: 1px 8px; border: 1.5px solid currentColor; font-size: 11px; letter-spacing: .5px; text-transform: uppercase; color: var(--orange-text); }
.log-note { margin: 0; padding: 14px 18px 16px; border-top: 1.5px dashed rgba(var(--ink-rgb),.3); font-size: 15px; }
.types { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 32px; margin-top: 52px; border-top: 1px solid var(--linie); }
.type { display: flex; flex-direction: column; gap: 6px; padding-top: 22px; }
.type .price { order: -1; font-weight: 600; font-size: 34px; line-height: 1.1; color: var(--orange-deep); font-variant-numeric: tabular-nums; }
.type strong { font-weight: 600; font-size: 17px; }
.type p { margin: 4px 0 0; font-size: 15.5px; }
.facts { margin: 12px 0 0; padding-left: 14px; border-left: 3px solid var(--orange); display: flex; flex-direction: column; gap: 10px; }
.facts dt { font-family: var(--mono); font-size: 11px; letter-spacing: .6px; text-transform: uppercase; color: var(--orange-text); }
.facts dd { margin: 0; font-size: 14.5px; line-height: 1.5; }
.fine { font-size: 14px; max-width: 72ch; margin: 16px 0 0; opacity: .85; }
@media (max-width: 900px) { .costs { grid-template-columns: 1fr; } .types { grid-template-columns: 1fr; } .type { padding-bottom: 22px; border-bottom: 1px solid rgba(var(--ink-rgb),.2); } }

/* ── Ausblick ── */
.plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.plan { border: 1.5px dashed rgba(var(--ink-rgb),.35); padding: 22px 20px 24px; display: flex; flex-direction: column; gap: 10px; }
.plan h3 { font-weight: 600; font-size: 19px; line-height: 1.15; margin: 0; }
.plan p { margin: 0; font-size: 15.5px; }
.status { align-self: flex-start; font-family: var(--mono); font-size: 11px; letter-spacing: .6px; text-transform: uppercase; padding: 2px 8px; border: 1.5px solid currentColor; }
.status.konzept { color: var(--orange-text); }
.status.geplant { color: var(--water-deep); }
.status.idee { opacity: .7; border-style: dashed; }
@media (max-width: 900px) { .plans { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .plans { grid-template-columns: 1fr; } }

/* ── Pilot ── */
.pilot { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; counter-reset: p; }
.pilot li { counter-increment: p; padding: 4px 24px 8px 0; }
.pilot li + li { border-left: 1px solid rgba(var(--ink-rgb),.25); padding-left: 24px; }
.pilot li::before { content: "Schritt " counter(p); font-family: var(--mono); font-size: 13px; letter-spacing: .6px; color: var(--orange-text); text-transform: uppercase; }
.pilot h3 { font-weight: 600; font-size: clamp(20px, 2.3vw, 26px); margin: 6px 0 10px; line-height: 1.1; }
.pilot p { margin: 0; font-size: 16px; max-width: 34ch; }
@media (max-width: 760px) { .pilot { grid-template-columns: 1fr; } .pilot li + li { border-left: 0; padding-left: 0; border-top: 1px solid rgba(var(--ink-rgb),.25); padding-top: 18px; } .pilot li { padding-bottom: 20px; } }

/* ── Fragen ── */
.faq { border-top: 1px solid var(--linie); }
.faq details { border-bottom: 1px solid rgba(var(--ink-rgb),.25); }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 18px; min-height: 64px; padding: 14px 0; font-weight: 600; font-size: 19px; line-height: 1.3; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-family: var(--mono); font-size: 24px; font-weight: 400; color: var(--orange-deep); flex: none; transition: transform .2s; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq summary:focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }
.faq .a { padding: 0 0 20px; max-width: 70ch; }
.faq .a p { margin: 0 0 10px; }

/* ── Redaktionstag ── */
.setup { background: var(--karte); border: 1px solid rgba(var(--ink-rgb),.3); padding: 22px 24px; }
.setup dl { margin: 12px 0 0; }
.setup dl div { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 14px; padding: 10px 0; border-top: 1px solid rgba(var(--ink-rgb),.18); }
.setup dt { font-family: var(--mono); font-size: 11px; letter-spacing: .6px; text-transform: uppercase; color: var(--orange-text); padding-top: 3px; }
.setup dd { margin: 0; font-size: 15.5px; }
.hinweis { margin: 26px 0 0; padding: 14px 18px; border: 1.5px dashed rgba(var(--ink-rgb),.35); font-size: 15px; max-width: 60ch; }
.day { list-style: none; margin: 0; padding: 0; }
.slot { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 40px; padding: 36px 0; border-top: 1px solid rgba(var(--ink-rgb),.22); }
.slot:first-child { border-top: 1px solid var(--linie); }
.when { position: sticky; top: 24px; align-self: start; display: flex; flex-direction: column; gap: 2px; }
.when b { font-weight: 600; font-size: 32px; line-height: 1.12; font-variant-numeric: tabular-nums; }
.when span { font-family: var(--mono); font-size: 11.5px; letter-spacing: .6px; text-transform: uppercase; color: var(--orange-text); }
.what { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.what h3 { font-weight: 600; font-size: clamp(21px, 2.4vw, 27px); line-height: 1.1; margin: 0; }
.what > p { margin: 0; max-width: 64ch; }
.agents { display: flex; flex-wrap: wrap; gap: 8px; }
.agents span { font-family: var(--mono); font-size: 11.5px; letter-spacing: .5px; text-transform: uppercase; padding: 3px 9px; background: var(--ink); color: var(--cream); }
.gatebox { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 16px; align-items: center; border: 2px dashed var(--orange-deep); background: rgba(255,92,52,.07); padding: 16px 18px; }
.gatebox .dia { grid-row: span 2; width: 30px; height: 30px; margin: 0 6px; background: var(--orange-deep); transform: rotate(45deg); display: grid; place-items: center; }
.gatebox .dia span { transform: rotate(-45deg); color: #fff; font-family: var(--mono); font-size: 13px; }
.gatebox b { font-family: var(--mono); font-size: 11.5px; font-weight: 500; letter-spacing: .6px; text-transform: uppercase; color: var(--orange-text); }
.gatebox p { margin: 0; font-size: 16px; }
@media (max-width: 760px) { .slot { grid-template-columns: 1fr; gap: 12px; } .when { position: static; flex-direction: row; align-items: baseline; gap: 12px; } }
.tablewrap { overflow-x: auto; background: var(--cream); border: 1px solid rgba(var(--ink-rgb),.3); }
.tablewrap table { width: 100%; min-width: 620px; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.tablewrap th { font-family: var(--mono); font-weight: 400; font-size: 11px; letter-spacing: .6px; text-transform: uppercase; text-align: left; padding: 14px 18px 8px; border-bottom: 1px solid rgba(var(--ink-rgb),.2); color: var(--orange-text); }
.tablewrap td { padding: 13px 18px; border-bottom: 1px solid rgba(var(--ink-rgb),.14); font-size: 15.5px; vertical-align: top; }
.tablewrap td small { display: block; font-size: 13.5px; opacity: .75; }
.tablewrap .r { text-align: right; white-space: nowrap; }
.tablewrap tfoot td { border-bottom: 0; font-weight: 600; }
.outcome { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.olist { list-style: none; margin: 0; padding: 0; }
.olist li { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 14px; align-items: baseline; padding: 14px 0; border-top: 1px solid rgba(var(--ink-rgb),.22); }
.olist b { font-weight: 600; font-size: 32px; color: var(--orange-deep); font-variant-numeric: tabular-nums; }
@media (max-width: 800px) { .outcome { grid-template-columns: 1fr; gap: 20px; } }

/* ── Abschluss & Kontakt ── */
.closing { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 48px; align-items: center; }
.closing .title { color: var(--cream-text); }
.closing .title em { font-style: normal; color: var(--orange); }
.kcard { background: var(--cream); color: var(--ink); padding: 26px; display: flex; flex-direction: column; gap: 16px; }
.kcard .person { font-weight: 600; font-size: 24px; }
.kcard ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; font-size: 15.5px; }
.kcard li { display: flex; gap: 10px; }
.kcard li::before { content: ""; flex: none; width: 7px; height: 7px; margin-top: 9px; background: var(--orange); transform: rotate(45deg); }
.kcard .row { display: flex; flex-wrap: wrap; gap: 10px; }
.kcard .direct { margin: 0; font-size: 15px; }
.kcard .direct a { color: var(--orange-text); }
@media (max-width: 900px) { .closing { grid-template-columns: 1fr; } }
.water .cta-ghost { color: var(--cream-text); border-color: var(--cream-text); }
.water .cta-ghost:hover { background: var(--cream-text); color: var(--ink); }
.water a:focus-visible { outline-color: var(--cream-text); }
.chat { display: flex; flex-direction: column; gap: 10px; background: var(--cream); border: 1px solid rgba(var(--ink-rgb),.25); padding: 16px; }
.msg { max-width: 88%; padding: 10px 14px; font-size: 15.5px; line-height: 1.5; border: 1px solid rgba(var(--ink-rgb),.2); }
.msg.me { align-self: flex-end; background: rgba(255,92,52,.12); border-color: transparent; }
.msg.ai { align-self: flex-start; background: var(--karte); }
.msg small { display: block; font-family: var(--mono); font-size: 10.5px; letter-spacing: .6px; text-transform: uppercase; color: var(--orange-text); margin-bottom: 4px; }
.msg ul { margin: 6px 0 0; padding-left: 18px; }

/* ── Soft-Minimal: Flächen, Rundungen, Etiketten ── */
.wrap { max-width: none; padding: 0 clamp(22px, 6vw, 88px); }
.band { padding: 72px 0; }
.band + .band, .band.cream, .hero + .band { border-top: 1px solid #E3E1DB; }
.band.cream { background: transparent; }
.hero { background: var(--flaeche); }
.hero .wrap, .seitenlinks .wrap { width: min(1120px, calc(100% - 32px)); margin-inline: auto; }
.seitenlinks { background: var(--flaeche); padding-bottom: 22px; }
.seitenlinks .wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; padding-top: 14px; border-top: 1px solid #E3E1DB; font-size: 13.5px; }
.seitenlinks span { font-size: 11.5px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--grau); margin-right: 8px; }
.seitenlinks a { padding: 6px 10px; border-radius: 8px; font-weight: 500; color: var(--text2); text-decoration: none; }
.seitenlinks a:hover { background: var(--blau); color: var(--tinte); }
.band.water { background: var(--tinte); border-top: 0; }

.label { display: block; margin: 0 0 6px; }
.label::after { display: none; }
.water .label { color: #B9B7AF; }
.title { font-size: clamp(26px, 3.4vw, 38px); line-height: 1.18; letter-spacing: -.015em; max-width: 26ch; margin-bottom: 18px; }
.lede { font-size: 17px; line-height: 1.65; color: var(--text2); }
.water .lede { color: #D9D7D0; opacity: 1; }
.mini, .who, .rand b, .setup dt, .facts dt, .tablewrap th, .log th, .when span, .gatebox b, .msg small, .lz li em, .status, .pill, .dev, .agents span, .proofline, .pilot li::before { letter-spacing: .08em; font-weight: 500; }
.setup dt, .facts dt, .tablewrap th, .fahne-head, .log-head, .when span, .pilot li::before, .msg small, .who { color: #6F6E69; }
.step.gate .who { color: var(--orange-text); }

.hero { padding: 36px 0 48px; }
.hero h1 { font-size: clamp(34px, 5vw, 56px); line-height: 1.12; letter-spacing: -.015em; }
.hero h1 em { color: #7F7E79; }
.proofline::before { background: var(--akzent); border-radius: 50%; }
.cta-btn { min-height: 0; font-size: 14px; }
.cta-ghost { min-height: 0; padding: 10px 20px; border: 1px solid var(--linie); border-radius: 8px; background: var(--karte); color: var(--tinte); font-weight: 500; font-size: 14px; transition: background .18s, color .18s, border-color .18s; }
.cta-ghost:hover { background: var(--blau); border-color: var(--blau); color: var(--tinte); }
.cta-ghost:focus-visible, .cta-btn:focus-visible, .faq summary:focus-visible { outline: 2px solid var(--orange); outline-offset: 3px; }
.water .cta-ghost { background: transparent; color: var(--cream-text); border-color: rgba(246,245,241,.4); }
.water .cta-ghost:hover { background: var(--cream-text); border-color: var(--cream-text); color: var(--tinte); }

.fahne, .setup, .log, .tablewrap, .laufzettel, .kcard, .gain, .pcol, .plan, .chat { border-radius: 24px; }
.fahne, .setup, .log, .tablewrap, .laufzettel, .chat { border-color: var(--linie); }
.log, .tablewrap { overflow: hidden; }
.snip, .hinweis, .gatebox, .step.gate .card, .msg { border-radius: 16px; }
.lz li { border-radius: 12px; }
.pill, .status, .dev { border-radius: 999px; border-width: 1px; padding: 2px 10px; }
.agents span { border-radius: 999px; background: var(--blau); color: #24394A; padding: 5px 12px; }
.stempel { border-radius: 8px; }
.hl { border-radius: 3px; }

.stats b { color: var(--akzent); }
.stats span { color: #D9D7D0; }
.gain { padding: 26px; }
.gain h3, .rail h3, .plan h3, .step h3, .pilot h3, .what h3 { line-height: 1.25; letter-spacing: -.01em; }
.gain p, .rail p, .plan p, .pilot p, .type p, .plist li { color: var(--text2); }
.step.is-current .mk { color: var(--tinte); }
.step.gate.is-current .mk, .step.gate.is-past .mk, .lz li.active .i, .lz li.g.done .i, .lz li.g.active .i, .lz li.live.done .i, .gatebox .dia span { color: var(--tinte); }
.lz li.active { box-shadow: 0 0 0 4px rgba(255,92,52,.18); }
.lz li.live.done { background: var(--tinte); border-color: var(--tinte); }
.rails, .types, .faq, .slot:first-child { border-top-color: var(--linie); }
.type .price, .olist b { color: var(--tinte); }
.faq summary { font-weight: 600; font-size: 17px; }
.faq summary::after { width: 36px; height: 36px; border-radius: 50%; background: var(--karte); border: 1px solid var(--linie); display: grid; place-items: center; font-size: 18px; color: var(--text2); }
.faq summary:hover::after { background: var(--akzent); border-color: var(--akzent); color: var(--tinte); }
.closing .title { max-width: 20ch; }
.closing .title em { color: var(--akzent); }
.kcard { padding: 28px; }
.kcard .person { font-size: 22px; }
.kcard li::before { border-radius: 50%; transform: none; }
.kcard .direct a { color: var(--tinte); text-decoration-color: var(--orange); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.msg.me { background: var(--blau); }
.msg.ai { background: var(--flaeche); }