/* Fahrer-App: Gestaltung im Stil der Startseite. Nutzt die Tokens aus site.css */
.fa-sec{padding:clamp(48px,6vw,96px) 0;border-top:1px solid var(--line)}
.fa-sec.fa-alt{background:var(--bg-2)}
.fa-head{max-width:760px;margin-bottom:clamp(28px,3.4vw,48px)}
.fa-head h2{font-family:var(--f-display);font-weight:600;font-size:clamp(32px,3.6vw,52px);line-height:1.02;letter-spacing:-.01em;margin:0 0 14px}
.fa-head p{color:var(--ink-muted);font-size:clamp(17px,1.25vw,20px);max-width:58ch;text-wrap:pretty}
.fa-head a,.fa-card a{color:var(--accent);text-underline-offset:3px}

/* Hero */
.fa-hero .hero-split{align-items:center}
.fa-hero .store-row{margin:4px 0 18px}
.fa-micro{font-size:15px;color:var(--ink-subtle);margin:0}
.fa-stage{position:relative;display:flex;justify-content:center;padding:clamp(8px,2vw,24px) 0}
.fa-stage::before{content:"";position:absolute;inset:6% 8%;background:radial-gradient(ellipse at 50% 40%,rgba(94,181,224,.22),transparent 68%);filter:blur(8px)}
.fa-bsp{position:absolute;top:0;right:6%;z-index:2;font-family:var(--f-label);font-weight:600;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-subtle);border:1px solid var(--line-strong);background:var(--bg);padding:3px 8px}
.fa-phone{position:relative;width:min(300px,78vw);aspect-ratio:9/18.4;border-radius:38px;padding:11px;background:linear-gradient(160deg,#1b2540,#0b1020);border:1px solid var(--line-strong);box-shadow:0 30px 70px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.03) inset}
.fa-screen{height:100%;border-radius:28px;background:var(--bg);display:flex;flex-direction:column;padding:34px 16px 16px;gap:12px;overflow:hidden;position:relative}
.fa-screen::before{content:"";position:absolute;top:10px;left:50%;width:84px;height:20px;border-radius:12px;background:#000;transform:translateX(-50%)}
.fa-push{display:flex;gap:10px;align-items:center;background:var(--surface-2);border:1px solid var(--line-strong);border-radius:12px;padding:9px 11px;font-size:12px;line-height:1.3;color:var(--ink-muted)}
.fa-push i{flex:none;width:26px;height:26px;border-radius:7px;background:var(--accent);display:grid;place-items:center}
.fa-push i svg{width:15px;height:15px;color:var(--accent-ink)}
.fa-push b{display:block;color:var(--ink);font-weight:600;font-size:12.5px}
.fa-job{background:var(--surface);border:1px solid var(--line-strong);border-radius:14px;padding:13px 14px}
.fa-job h4{font-family:var(--f-display);font-weight:600;font-size:21px;line-height:1.05;margin:0 0 2px}
.fa-job small{color:var(--ink-subtle);font-size:12px}
.fa-job dl{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;margin:10px 0 0;font-size:12px}
.fa-job dt{color:var(--ink-subtle)}
.fa-job dd{margin:0;color:var(--ink)}
.fa-go{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--accent);color:var(--accent-ink);font-family:var(--f-label);font-weight:600;font-size:15px;letter-spacing:.04em;border-radius:12px;padding:13px}
.fa-go svg{width:16px;height:16px}
.fa-log{margin:0;padding:0;list-style:none;display:grid;gap:7px;font-size:12px;color:var(--ink-muted)}
.fa-log li{display:grid;grid-template-columns:42px 1fr;gap:8px;align-items:center}
.fa-log time{font-variant-numeric:tabular-nums;color:var(--ink-subtle)}
.fa-log li::after{content:none}
.fa-log .on{color:var(--ink)}

/* Fakten-Leiste */
.fa-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border:1px solid var(--line-strong);background:var(--surface)}
.fa-fact{padding:22px 22px 24px;border-left:1px solid var(--line);min-width:0}
.fa-fact:nth-child(odd){border-left:0}
.fa-fact:nth-child(n+3){border-top:1px solid var(--line)}
.fa-fact svg{width:28px;height:28px;color:var(--accent);margin-bottom:14px}
.fa-fact b{display:block;font-family:var(--f-display);font-weight:600;font-size:24px;line-height:1.05;margin-bottom:4px}
.fa-fact span{color:var(--ink-muted);font-size:16px;line-height:1.4}
.fa-intro{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,80px);align-items:start}
.fa-intro .fa-head{margin-bottom:0}

/* Kacheln */
.fa-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.fa-card{background:var(--surface);border:1px solid var(--line-strong);padding:26px 24px 28px;transition:border-color .25s,transform .25s var(--ease)}
.fa-card:hover{border-color:var(--accent);transform:translateY(-3px)}
.fa-card svg.fa-ic{width:32px;height:32px;color:var(--accent);margin-bottom:18px}
.fa-card h3{font-family:var(--f-display);font-weight:600;font-size:26px;line-height:1.05;margin:0 0 10px}
.fa-card p{color:var(--ink-muted);font-size:16.5px;line-height:1.5;text-wrap:pretty}
.fa-card p+p{margin-top:8px}
.fa-card.fa-wide{grid-column:span 2}
.fa-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.fa-chips span{font-family:var(--f-label);font-weight:600;font-size:13px;letter-spacing:.06em;color:var(--ink);border:1px solid var(--line-strong);padding:5px 10px}

/* Ablauf */
.fa-flow{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,5vw,88px);align-items:start}
.fa-tl{list-style:none;margin:0;padding:0;position:relative}
.fa-tl::before{content:"";position:absolute;left:23px;top:10px;bottom:10px;width:2px;background:repeating-linear-gradient(to bottom,var(--accent) 0 10px,transparent 10px 18px);opacity:.55}
.fa-tl li{position:relative;display:grid;grid-template-columns:48px 1fr;gap:20px;padding:0 0 34px}
.fa-tl li:last-child{padding-bottom:0}
.fa-n{position:relative;z-index:1;width:48px;height:48px;background:var(--bg);border:1px solid var(--accent);color:var(--accent);display:grid;place-items:center;font-family:var(--f-display);font-weight:600;font-size:24px}
.fa-alt .fa-n{background:var(--bg-2)}
.fa-tl h3{font-family:var(--f-display);font-weight:600;font-size:clamp(24px,2vw,30px);line-height:1.05;margin:6px 0 8px}
.fa-tl p{color:var(--ink-muted);font-size:17px;line-height:1.5;text-wrap:pretty}
.fa-side{position:sticky;top:96px;display:grid;gap:14px}
.fa-ask{background:var(--surface);border:1px solid var(--line-strong);padding:20px 20px 22px;position:relative}
.fa-ask .fa-bsp{top:-12px;right:14px}
.fa-ask h4{font-family:var(--f-display);font-weight:600;font-size:24px;line-height:1.05;margin:0 0 6px}
.fa-ask p{color:var(--ink-muted);font-size:15.5px;margin-bottom:14px}
.fa-ask .fa-opt{display:grid;gap:8px}
.fa-ask .fa-opt span{display:flex;justify-content:space-between;gap:10px;border:1px solid var(--line-strong);padding:11px 14px;font-family:var(--f-label);font-weight:600;font-size:16px;color:var(--ink)}
.fa-ask .fa-opt span.fa-sel{border-color:var(--accent);background:rgba(94,181,224,.1)}
.fa-ask .fa-opt em{font-style:normal;color:var(--ink-subtle);font-weight:500;font-size:14px}
.fa-morning{border:1px solid var(--line-strong);border-left:3px solid var(--accent);background:var(--surface);padding:16px 20px}
.fa-morning b{display:block;font-family:var(--f-label);font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:6px}
.fa-morning p{margin:0;color:var(--ink-muted);font-size:16px}

/* Einrichtung */
.fa-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fa-seealso{margin-top:28px;color:var(--ink-muted);font-size:16.5px}
.fa-seealso a{color:var(--accent);text-underline-offset:3px}
.fa-end{max-width:var(--max-text);margin:0 auto;padding:clamp(40px,5vw,72px) var(--gut) 24px}
.fa-end h2{font-family:var(--f-display);font-weight:600;font-size:clamp(30px,3vw,42px);line-height:1.05;margin:2.2em 0 .6em}
.fa-end h2:first-child{margin-top:0}

@media (max-width:980px){
  .fa-grid{grid-template-columns:1fr 1fr}
  .fa-card.fa-wide{grid-column:span 2}
  .fa-intro,.fa-flow,.fa-two{grid-template-columns:1fr}
  .fa-side{position:static}
}
@media (max-width:620px){
  .fa-facts,.fa-grid{grid-template-columns:1fr}
  .fa-card.fa-wide{grid-column:auto}
  .fa-fact{border-left:0;border-top:1px solid var(--line)}
  .fa-fact:first-child{border-top:0}
  .fa-tl::before{left:19px}
  .fa-tl li{grid-template-columns:40px 1fr;gap:14px}
  .fa-n{width:40px;height:40px;font-size:20px}
}
@media (prefers-reduced-motion:reduce){.fa-card{transition:none}.fa-card:hover{transform:none}}
.fa-tl p+p{margin-top:8px}
.fa-card.fa-wide:last-child{grid-column:1/-1}

/* Modulseiten: Kontrollansicht (KI), Listen, kleine Kacheln */
.fa-check{position:relative;width:min(520px,100%);background:var(--surface);border:1px solid var(--line-strong);box-shadow:0 30px 70px rgba(0,0,0,.5)}
.fa-check .fa-bsp{top:-12px;right:14px}
.fa-check-h{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line);font-family:var(--f-label);font-weight:600;font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted)}
.fa-check-b{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
.fa-pdf{padding:16px;border-right:1px solid var(--line);display:grid;gap:8px;align-content:start}
.fa-pdf small,.fa-det small{font-family:var(--f-label);font-weight:600;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-subtle);margin-bottom:2px}
.fa-pdf i{display:block;height:7px;background:var(--line-strong);border-radius:2px}
.fa-pdf i.hl{background:rgba(94,181,224,.55)}
.fa-det{padding:16px;display:grid;gap:10px;align-content:start}
.fa-det div{border:1px solid var(--line);padding:8px 10px;font-size:14px;line-height:1.25;display:grid;gap:2px}
.fa-det div span{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-subtle);font-family:var(--f-label);font-weight:600}
.fa-det div b{font-weight:500;color:var(--ink)}
.fa-det .fa-ok{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-family:var(--f-label);font-weight:600;font-size:15px;letter-spacing:.04em;padding:11px}
.fa-det .fa-ok svg{width:16px;height:16px}
.fa-list{margin:14px 0 0;padding:0;list-style:none;display:grid;gap:8px}
.fa-list li{position:relative;padding-left:22px;color:var(--ink-muted);font-size:16.5px;line-height:1.4}
.fa-list li::before{content:"";position:absolute;left:0;top:.62em;width:12px;height:2px;background:var(--accent)}
.fa-note{max-width:760px;margin:0 0 28px;padding:16px 20px;border:1px solid var(--line-strong);border-left:3px solid var(--signal);background:var(--surface);color:var(--ink-muted);font-size:16.5px}
.fa-grid.fa-mini .fa-card{padding:22px 22px 24px}
.fa-grid.fa-mini .fa-card h3{font-size:23px}
.fa-grid.fa-mini .fa-card p,.fa-grid.fa-mini .fa-card li{font-size:16px}
.fa-grid.fa-three{grid-template-columns:repeat(3,1fr)}
@media (max-width:980px){.fa-grid.fa-three{grid-template-columns:1fr}.fa-check-b{grid-template-columns:1fr}.fa-pdf{border-right:0;border-bottom:1px solid var(--line)}}
.fa-rows{padding:16px;display:grid;gap:10px}
.fa-row{display:flex;justify-content:space-between;gap:12px;border:1px solid var(--line);padding:11px 14px;font-size:15px}
.fa-row span{color:var(--ink-muted)}
.fa-row b{font-weight:500;color:var(--ink);text-align:right}
.fa-rows .fa-ok{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--accent);color:var(--accent-ink);font-family:var(--f-label);font-weight:600;font-size:15px;letter-spacing:.04em;padding:12px}
.fa-rows .fa-ok svg{width:16px;height:16px}

/* Handy mit Karte */
.fa-phone .fa-bsp{top:-12px;right:22px}
.fa-screen{padding:0;gap:0;position:relative}
.fa-mapbox{position:absolute;inset:0 0 auto 0;height:66%}
.fa-map{width:100%;height:100%}
.fa-screen::before{z-index:3}
.fa-screen .fa-push{position:absolute;top:36px;left:12px;right:12px;z-index:2;background:rgba(20,29,53,.92);backdrop-filter:blur(6px)}
.fa-dest{position:absolute;z-index:2;right:12px;top:38%;font-family:var(--f-label);font-weight:600;font-size:12px;letter-spacing:.04em;color:var(--signal-ink);background:var(--signal);padding:4px 9px;border-radius:999px;box-shadow:0 4px 14px rgba(0,0,0,.4)}
.fa-sheet{position:absolute;z-index:2;left:0;right:0;bottom:0;background:var(--surface);border-top:1px solid var(--line-strong);border-radius:22px 22px 0 0;padding:16px 16px 18px;display:grid;gap:10px;box-shadow:0 -14px 30px rgba(0,0,0,.35)}
.fa-sheet h4{font-family:var(--f-display);font-weight:600;font-size:22px;line-height:1.05;margin:0}
.fa-sheet small{color:var(--ink-subtle);font-size:12.5px;margin-top:-6px}
.fa-route{stroke-dasharray:3 9;animation:fa-flow 2.2s linear infinite}
.fa-pulse{transform-origin:center;transform-box:fill-box;animation:fa-pulse 2s ease-out infinite}
@keyframes fa-flow{to{stroke-dashoffset:-48}}
@keyframes fa-pulse{0%{transform:scale(.6);opacity:1}100%{transform:scale(2);opacity:0}}
@media (prefers-reduced-motion:reduce){.fa-route,.fa-pulse{animation:none}}
.fa-prose{max-width:68ch}
.fa-prose p{color:var(--ink-muted);font-size:18px;line-height:1.6;text-wrap:pretty}
.fa-prose p+p{margin-top:14px}
.fa-row b:empty{display:none}
/* Ablauf-Mock: Schritte laufen nacheinander durch */
.fa-auto{position:relative;width:min(520px,100%);background:var(--surface);border:1px solid var(--line-strong);box-shadow:0 30px 70px rgba(0,0,0,.5)}
.fa-auto .fa-bsp{top:-12px;right:14px}
.fa-auto-b{padding:18px 16px 16px;display:grid;gap:0}
.fa-st{position:relative;display:grid;grid-template-columns:34px 1fr auto;gap:14px;align-items:start;padding:0 0 22px;opacity:.38;animation:fa-st 12s infinite}
.fa-st:last-child{padding-bottom:0}
.fa-st::before{content:"";position:absolute;left:16px;top:34px;bottom:2px;width:2px;background:var(--line-strong)}
.fa-st:last-child::before{display:none}
.fa-st:nth-child(2){animation-delay:2.4s}.fa-st:nth-child(3){animation-delay:4.8s}.fa-st:nth-child(4){animation-delay:7.2s}
.fa-st i{width:34px;height:34px;border:1px solid var(--line-strong);background:var(--bg);display:grid;place-items:center;color:var(--accent)}
.fa-st i svg{width:18px;height:18px}
.fa-st b{display:block;font-family:var(--f-display);font-weight:600;font-size:21px;line-height:1.1;color:var(--ink)}
.fa-st small{display:block;margin-top:4px;color:var(--ink-muted);font-size:14.5px;line-height:1.35}
.fa-st em{font-style:normal;font-family:var(--f-label);font-weight:600;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-subtle);border:1px solid var(--line-strong);padding:3px 8px;margin-top:3px;white-space:nowrap;animation:fa-tag 12s infinite}
.fa-st:nth-child(2) em{animation-delay:2.4s}.fa-st:nth-child(3) em{animation-delay:4.8s}.fa-st:nth-child(4) em{animation-delay:7.2s}
@keyframes fa-st{0%{opacity:.38}6%,82%{opacity:1}94%,100%{opacity:.38}}
@keyframes fa-tag{0%,4%{color:var(--ink-subtle);border-color:var(--line-strong)}9%,82%{color:var(--accent-ink);background:var(--accent);border-color:var(--accent)}94%,100%{color:var(--ink-subtle);background:transparent;border-color:var(--line-strong)}}
@media (prefers-reduced-motion:reduce){.fa-st{animation:none;opacity:1}.fa-st em{animation:none;color:var(--accent-ink);background:var(--accent);border-color:var(--accent)}}
@media (max-width:480px){.fa-st{grid-template-columns:34px 1fr}.fa-st em{display:none}}
.fa-grid.fa-four{grid-template-columns:repeat(2,1fr)}
@media (max-width:980px){.fa-grid.fa-four{grid-template-columns:1fr}}
.fa-checklist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.fa-checklist li{display:grid;grid-template-columns:34px 1fr;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--line-strong);padding:14px 16px;font-size:17px;color:var(--ink)}
.fa-checklist svg{width:34px;height:34px;padding:7px;border:1px solid var(--line-strong);background:var(--bg);color:var(--accent)}
@media (max-width:760px){.fa-checklist{grid-template-columns:1fr}}
.fa-src{margin-top:26px;color:var(--ink-subtle);font-size:15px}
.fa-src ul{margin:8px 0 0;padding-left:18px}
.fa-src li{margin:4px 0}
.fa-src a{color:var(--accent);text-underline-offset:3px}
.fa-shots{margin-top:36px}
/* Blog: Inhaltskarte im Hero und Zwischen-CTA */
.fa-toc{list-style:none;margin:0;padding:8px 8px 10px;counter-reset:toc}
.fa-toc li{counter-increment:toc}
.fa-toc a{display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:baseline;padding:10px 12px;color:var(--ink);text-decoration:none;font-size:16.5px;line-height:1.3;border:1px solid transparent;transition:border-color .2s,background .2s}
.fa-toc a::before{content:counter(toc,decimal-leading-zero);font-family:var(--f-label);font-weight:600;font-size:14px;letter-spacing:.08em;color:var(--accent)}
.fa-toc a:hover{border-color:var(--line-strong);background:var(--bg)}
.fa-toc-live a{pointer-events:auto}
.art-inline{margin:38px 0;padding:22px 24px;border:1px solid var(--line-strong);border-left:3px solid var(--accent);background:var(--surface);display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.art-inline p{margin:0;color:var(--ink);font-size:17.5px;max-width:46ch}
.art-inline p b{display:block;font-family:var(--f-display);font-weight:600;font-size:24px;line-height:1.1;margin-bottom:4px}
.art-inline .btn{flex:none}
.cta-box .btn.btn-ghost{color:var(--ink);background:transparent}
/* Pipeline: Eingabe, Ergebnis, Zusatz */
.fa-pipe{display:grid;grid-template-columns:minmax(0,.8fr) 44px minmax(0,1.3fr) 44px minmax(0,1fr);align-items:stretch;gap:0}
.fa-pipe-c{background:var(--surface);border:1px solid var(--line-strong);padding:24px 22px 26px;min-width:0}
.fa-pipe-c.fa-hi{border-color:var(--accent);box-shadow:0 0 0 1px rgba(94,181,224,.25),0 24px 60px rgba(0,0,0,.35)}
.fa-pipe-c small{display:block;font-family:var(--f-label);font-weight:600;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-subtle);margin-bottom:12px}
.fa-pipe-c svg.fa-ic{width:34px;height:34px;color:var(--accent);margin-bottom:14px}
.fa-pipe-c b{display:block;font-family:var(--f-display);font-weight:600;font-size:26px;line-height:1.05;margin-bottom:6px}
.fa-pipe-c p{color:var(--ink-muted);font-size:16px;line-height:1.45}
.fa-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.fa-chips span{border:1px solid var(--line-strong);background:var(--bg);padding:7px 11px;font-size:15.5px;color:var(--ink)}
.fa-pipe-a{display:grid;place-items:center;color:var(--accent)}
.fa-pipe-a svg{width:26px;height:26px}
.fa-pipe-note{margin-top:18px;display:flex;flex-wrap:wrap;gap:10px 28px;color:var(--ink-muted);font-size:16px}
.fa-pipe-note b{color:var(--ink);font-weight:500}
@media (max-width:980px){.fa-pipe{grid-template-columns:1fr}.fa-pipe-a{height:40px}.fa-pipe-a svg{transform:rotate(90deg)}}
.fa-role{display:inline-block;margin:2px 0 0;font-style:normal;font-family:var(--f-label);font-weight:600;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);border:1px solid var(--line-strong);padding:3px 9px}
.fa-tl .fa-list{margin-top:10px}
.fa-tl .fa-list li{display:block;grid-template-columns:none;gap:0;padding:0 0 0 22px;position:relative}
.fa-tl~.fa-note{margin-top:44px;max-width:none;text-wrap:pretty}
.fa-tl .fa-list li{max-width:80ch}