/* Dokuschnitt V2: shared Reaktormap primitives with the site's amber identity. */
.ds-v2 {
  --txt: var(--text); --mut: var(--text-soft); --brd: var(--border);
  --acc: var(--amber); --acc-strong: var(--amber);
  --story-stripe-bg: #f4f1e9; --story-stripe-text: #20231f;
  --story-stripe-muted: #61635b; --story-stripe-line: #cecec0;
  --story-lime: #d9fa65; --story-sage: #b7d48a; --story-peach: #ffb99f;
  --story-lilac: #e1cff8; --story-orbit-highlight: #fcffc5;
  --muted: #a29d94; --radius: 24px; --ds-header-height: 76px;
  font-family: Arial, Helvetica, sans-serif;
}
.ds-v2::before { opacity: .45; }
.ds-v2 .shell { width: min(1440px, calc(100% - 2 * var(--v2-gutter))); }
.ds-v2 .shell--narrow { width: min(900px, calc(100% - 2 * var(--v2-gutter))); }
.ds-v2 .shell--left { margin-left: max(var(--v2-gutter), calc((100% - 1440px) / 2)); }
.ds-v2 .mono, .ds-v2 .kicker { font-family: Consolas, 'Courier New', monospace; }
.ds-v2 :is(input, textarea):focus-visible { outline: 3px solid var(--amber); outline-offset: 4px; }
.ds-v2 [id] { scroll-margin-top: calc(var(--ds-header-height) + 80px); }
.ds-v2 main:focus { outline: none; }
.ds-v2 .topbar { z-index: 1000; background: color-mix(in srgb, var(--bg) 94%, transparent); backdrop-filter: blur(18px); }
.ds-v2 .topbar-inner { min-height: 76px; gap: 24px; }
.ds-v2 .brand { gap: 8px; }
.ds-v2 .brand-name { font-size: 21px; font-weight: 800; letter-spacing: -.06em; }
.ds-v2 .brand svg { width: 32px; height: 32px; }
.ds-v2 .topnav { flex-wrap: nowrap; gap: 3px; }
.ds-v2 .topnav a { padding: 10px 13px; font-size: 12px; font-weight: 700; border-radius: 999px; white-space: nowrap; }
.ds-v2 .topnav a[href="/anfrage.html"] { border: 1px solid var(--border-strong); }
.ds-v2 .topnav a[aria-current="page"] { background: var(--amber-soft); }
.ds-v2 .hero { position: relative; isolation: isolate; padding-block: clamp(65px, 8vw, 120px); }
.ds-v2 .hero h1 {
  max-width: 18ch; font-family: var(--v2-display); font-weight: 900;
  font-size: clamp(52px, 6.8vw, 108px); line-height: .98; letter-spacing: -.065em;
  text-transform: uppercase; overflow-wrap: anywhere; margin-bottom: 32px;
}
.ds-v2 .hero .lead { max-width: 65ch; font-size: clamp(16px, 1.4vw, 20px); line-height: 1.65; }
.ds-v2 .kicker { font-size: 11px; font-weight: 700; letter-spacing: .13em; margin-bottom: 20px; }
.ds-v2 main > section:not(.hero):not(.worldview) { padding-block: clamp(64px, 8vw, 120px); }
.ds-v2 .section-head { max-width: 960px; margin-bottom: 44px; }
.ds-v2 .section-head h2 {
  font-family: var(--v2-display); font-size: clamp(34px, 4.3vw, 66px); font-weight: 900;
  letter-spacing: -.05em; line-height: 1.03; text-transform: uppercase; overflow-wrap: anywhere;
  margin-bottom: 24px;
}
.ds-v2 .section-head h2 > span { color: var(--story-lime); }
.ds-v2 .section-head > p:not(.kicker) { max-width: 66ch; color: var(--text-soft); }
.ds-v2 .btn {
  min-height: 48px; justify-content: space-between; gap: 24px; padding: 13px 22px;
  border-radius: 999px; background: transparent; font-size: 13px; font-weight: 700;
}
.ds-v2 .btn:hover { background: var(--surface-hover); transform: none; border-color: var(--amber); }
.ds-v2 .btn--primary { background: var(--amber); border-color: var(--amber); color: var(--bg-deep); }
.ds-v2 .btn--primary:hover { background: var(--story-peach); border-color: var(--story-peach); }
.ds-v2 .btn--small { min-height: 38px; padding: 8px 14px; gap: 8px; }
.ds-v2 .card { padding: clamp(24px, 3vw, 40px); background: color-mix(in srgb, var(--surface) 95%, transparent); }
.ds-v2 .card h3 { font-size: clamp(20px, 2vw, 28px); line-height: 1.15; letter-spacing: -.035em; }
.ds-v2 .card-num { font-family: Consolas, monospace; margin-bottom: 32px; }
.ds-v2 .grid { gap: 20px; }
.ds-v2 .grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ds-v2 .grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ds-v2 .note { padding: 24px 28px; }
.ds-v2 .stats { border-radius: 24px; }
.ds-v2 .stat { padding: 30px; }
.ds-v2 .stat-value { font-family: var(--v2-display); font-size: clamp(32px, 4.5vw, 66px); letter-spacing: -.055em; }
.ds-v2 .stat-label { color: var(--text-soft); }
.ds-v2 .track-step { padding: 0 0 32px 34px; }
.ds-v2 .track-step h3 { font-size: 23px; letter-spacing: -.025em; }
.ds-v2 .track-step p { max-width: 75ch; }
.ds-v2 .strip-cell { padding: 20px 14px; }
.ds-v2 .table-wrap { max-width: 100%; }
.ds-v2 footer { margin: 0; padding-block: 36px; }
.ds-v2 .footer-inner { font-size: 12px; gap: 16px 24px; }
.ds-motion { border: 0; background: transparent; color: var(--text-soft); font: inherit; font-size: 12px; cursor: pointer; padding: 8px 0; }
.ds-motion:hover { color: var(--amber); }
.ds-motion:disabled { cursor: default; }
.ds-v2 .v2-chapter-nav { top: var(--ds-header-height); }
.ds-v2 .v2-toc { gap: clamp(18px, 3vw, 42px); }
.ds-v2 .portal-shell { padding-block: 65px 90px; }
.ds-v2 .portal-shell > h1 { font-family: var(--v2-display); font-size: clamp(40px, 6vw, 76px); line-height: 1.05; letter-spacing: -.05em; overflow-wrap: anywhere; }
.ds-v2 .portal-gate h2 { font-size: 26px; letter-spacing: -.025em; }

/* A source sheet and a film frame: a schematic, not an invented work sample. */
.ds-home .ds-intro { padding-block: 42px 36px; }
.ds-hero-top { display: flex; justify-content: space-between; gap: 20px; align-items: center; padding-bottom: 38px; }
.ds-hero-top .kicker { margin: 0; }
.ds-hero-top > span { color: var(--text-soft); font-size: 11px; }
.ds-hero-grid { display: grid; grid-template-columns: 1.2fr 1fr; align-items: center; gap: clamp(30px, 5vw, 80px); }
.ds-home .hero h1 { font-size: clamp(60px, 6.2vw, 96px); line-height: .94; letter-spacing: -.075em; margin-bottom: 28px; }
.ds-home .hero h1 > span { color: var(--amber); }
.ds-home .hero .lead { max-width: 50ch; font-size: 16px; }
.ds-home .hero .actions { margin-top: 25px; }
.ds-home .hero-meta { gap: 12px 24px; margin-top: 46px; padding-top: 24px; border-top: 1px solid var(--border); }
.ds-home .chip { padding: 0; border: 0; background: transparent; font-size: 11px; }
.ds-cut { min-width: 0; margin: 0; padding: 24px; border: 1px solid var(--border-strong); border-radius: 24px; background: color-mix(in srgb, var(--surface) 88%, transparent); transform: rotate(2deg); }
.ds-cut-meta { display: flex; justify-content: space-between; color: var(--text-soft); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.ds-cut-stage { position: relative; height: 310px; margin-block: 24px; }
.ds-source { position: absolute; inset: 0 auto auto 2%; width: 61%; padding: 23px; background: var(--story-stripe-bg); color: var(--story-stripe-text); transform: rotate(-9deg); border-radius: 4px; }
.ds-source > span { font-size: 8px; letter-spacing: .1em; }
.ds-source strong { display: block; font-size: 27px; line-height: 1.1; letter-spacing: -.05em; margin-block: 22px; }
.ds-source i { display: block; height: 3px; margin-bottom: 8px; background: var(--story-stripe-line); }
.ds-source i:nth-of-type(2) { width: 83%; }
.ds-source i:nth-of-type(4) { width: 72%; background: var(--story-stripe-muted); }
.ds-source small { display: block; font-size: 8px; margin-top: 18px; color: var(--story-stripe-muted); }
.ds-frame { position: absolute; right: 0; bottom: 0; width: 76%; border: 1px solid var(--amber-line); border-radius: 10px; padding: 18px; background: var(--bg-deep); color: var(--amber); transform: rotate(3deg); box-shadow: var(--shadow); }
.ds-frame > span { font-size: 8px; letter-spacing: .09em; }
.ds-frame svg { display: block; width: 100%; height: 145px; }
.ds-frame strong { display: block; color: var(--text); font-size: 18px; letter-spacing: -.04em; }
.ds-frame small { font-size: 9px; color: var(--text-soft); }
.ds-edit { position: relative; padding: 12px 0; border-top: 1px solid var(--border); }
.ds-edit::after { content: ''; position: absolute; top: 10px; bottom: 10px; width: 1px; left: 60%; background: var(--text); animation: ds-playhead 12s ease-in-out infinite alternate; }
.ds-edit-ruler { display: flex; justify-content: space-between; font-size: 8px; color: var(--text-soft); margin-bottom: 9px; }
.ds-edit-track { display: grid; grid-template-columns: 1fr 1.4fr .8fr 1.2fr 1fr; gap: 3px; }
.ds-edit-track i { height: 19px; border-radius: 3px; background: var(--amber); opacity: .7; }
.ds-edit-track i:nth-child(2n) { background: var(--story-sage); }
.ds-edit-track i:nth-child(3) { background: var(--story-lilac); }
.ds-edit-audio { margin-top: 6px; height: 14px; background: repeating-linear-gradient(90deg, var(--slate) 0 2px, transparent 2px 5px); opacity: .6; clip-path: polygon(0 35%, 8% 5%, 16% 30%, 24% 0, 31% 40%, 42% 10%, 50% 35%, 63% 0, 72% 30%, 81% 5%, 93% 35%, 100% 10%, 100% 90%, 93% 65%, 81% 95%, 72% 70%, 63% 100%, 50% 65%, 42% 90%, 31% 60%, 24% 100%, 16% 70%, 8% 95%, 0 65%); }
.ds-cut figcaption { margin-top: 8px; font-size: 10px; color: var(--text-soft); }
@keyframes ds-playhead { from { left: 8%; } to { left: 92%; } }
.ds-home .worldview { background: var(--story-stripe-bg); color: var(--story-stripe-text); padding: 38px 0; }
.ds-home .worldview-inner { width: 100%; padding-left: 0; border: 0; }
.ds-home .worldview-label, .ds-home .worldview figcaption { color: var(--story-stripe-muted); }
.ds-home .worldview blockquote { color: var(--story-stripe-text); font-weight: 700; font-size: clamp(22px, 3.2vw, 44px); letter-spacing: -.045em; }
.ds-home .worldview .link { color: inherit; border-color: var(--story-stripe-line); }
.ds-home .section-head { max-width: none; }
.ds-home .section-head h2 { font-size: clamp(38px, 5.4vw, 82px); line-height: .98; }
.ds-home .audience-grid .card { border: 0; min-height: 290px; color: var(--story-stripe-text); background: var(--story-sage); }
.ds-home .audience-grid .card:nth-child(2) { background: var(--story-peach); }
.ds-home .audience-grid .card:nth-child(3) { background: var(--story-lilac); }
.ds-home .audience-grid :is(.card-num, .card p) { color: var(--story-stripe-text); }
.ds-home #ergebnis .card { border-radius: 0; border: 0; border-top: 1px solid var(--border-strong); background: transparent; padding-inline: 0; }
.ds-home #ergebnis .grid { gap: 40px; }
.ds-home #ergebnis .card-num { font-family: var(--v2-display); font-size: 52px; line-height: 1; letter-spacing: -.06em; color: var(--story-peach); }
.ds-home #ablauf .track-list { counter-reset: steps; }
.ds-home #ablauf .track-step { counter-increment: steps; padding: 24px 0 28px 100px; border-left: 0; border-top: 1px solid var(--border); }
.ds-home #ablauf .track-step::before { content: '0' counter(steps); left: 0; top: 24px; width: auto; height: auto; border: 0; background: none; color: var(--amber); font-family: var(--v2-display); font-size: 38px; line-height: 1; letter-spacing: -.06em; }
.ds-home #ablauf .track-step:nth-child(3) { border-color: var(--amber-line); background: linear-gradient(90deg, transparent, var(--amber-soft)); }
.ds-home #arbeitsprobe { background: var(--surface); }
.ds-home #arbeitsprobe .stat { background: var(--bg); }
.ds-home #anfrage { background: var(--story-peach); color: var(--story-stripe-text); }
.ds-home #anfrage .shell { width: min(1440px, calc(100% - 2 * var(--v2-gutter))); margin-inline: auto; }
.ds-home #anfrage :is(.kicker, h2 > span, .soft, .note, .note strong) { color: var(--story-stripe-text); }
.ds-home #anfrage .note { max-width: 75ch; background: transparent; border-color: color-mix(in srgb, var(--story-stripe-text) 25%, transparent); }
.ds-home #anfrage .btn--primary { color: var(--story-stripe-bg); background: var(--story-stripe-text); border-color: var(--story-stripe-text); }
.ds-home #anfrage .btn--primary:hover { color: var(--story-stripe-text); background: var(--story-stripe-bg); }
.ds-home #anfrage .ds-quiet-link { margin-top: 14px; color: var(--story-stripe-muted); }
.ds-home #anfrage .ds-quiet-link .link { color: inherit; border-bottom-color: currentColor; }
@media (max-width: 1050px) {
  .ds-v2 .topbar-inner { flex-wrap: wrap; padding-block: 14px 0; gap: 6px; }
  .ds-v2 .topnav { width: 100%; overflow-x: auto; scrollbar-width: none; padding-block: 4px 8px; }
  .ds-v2 .topnav a { flex: none; }
  .ds-hero-grid { gap: 32px; grid-template-columns: 1.1fr 1fr; }
  .ds-home .hero h1 { font-size: clamp(44px, 6vw, 68px); }
  .ds-cut { padding: 18px; }
  .ds-source { width: 73%; }
  .ds-frame { width: 87%; }
  .ds-v2 .grid--3 { gap: 14px; }
}
@media (max-width: 760px) {
  .ds-v2 .grid--2, .ds-v2 .grid--3 { grid-template-columns: minmax(0, 1fr); }
  .ds-hero-grid { grid-template-columns: minmax(0, 1fr); gap: 38px; }
  .ds-home .hero h1 { font-size: clamp(40px, 11.6vw, 80px); }
  .ds-hero-top { align-items: start; flex-direction: column; gap: 6px; padding-bottom: 30px; }
  .ds-cut { width: min(460px, 96%); margin: 0 auto; }
  .ds-cut-stage { height: 295px; }
  .ds-source { width: 65%; }
  .ds-frame { width: 75%; }
  .ds-home .hero-meta { margin-top: 36px; gap: 12px; }
  .ds-home .audience-grid .card { min-height: 0; }
  .ds-home .worldview { padding-block: 30px; }
  .ds-home #ablauf .track-step { padding-left: 60px; }
  .ds-home #ablauf .track-step::before { font-size: 28px; }
  .ds-v2 .stat { padding: 24px; }
  .ds-v2 .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ds-v2 .section-head { margin-bottom: 30px; }
  .ds-v2 .v2-toc-label { display: none; }
  .ds-v2 .v2-toc { gap: 24px; }
  .ds-v2 .note { padding: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .ds-v2 *, .ds-v2 *::before, .ds-v2 *::after { animation: none !important; }
}
