/* Vorführseite /so-funktionierts · baut auf loesung.css + theme-handwerk.css auf */
.vf main>section{max-width:1180px;margin:0 auto;padding:9vh 5vw 4vh}
.vf .hero{max-width:1180px}
.vf-clock{display:grid;grid-template-columns:repeat(4,1fr);margin-top:34px;max-width:1040px;border-top:3px solid var(--sig)}
.vf-clock div{padding:14px 14px 0 0;position:relative}
.vf-clock div::before{content:"";position:absolute;left:0;top:-9px;width:15px;height:15px;border-radius:50%;background:var(--sig);box-shadow:0 0 0 4px #1c1f21}
.vf-clock b{display:block;font:800 44px/1 'Barlow Cond',sans-serif;color:var(--sig);margin-top:12px}
.vf-clock span{display:block;color:#c3cac6;font-size:14px;margin-top:4px}
.vf-mess{margin-top:16px;font-size:13px;color:#8f9a95}
.vf-steps h2,.vf-daten h2,.vf-plan h2,.vf-probe h2{font-weight:800;font-size:clamp(38px,4.4vw,62px);line-height:1;max-width:18em}
.vf-step{display:grid;grid-template-columns:70px minmax(0,.9fr) minmax(0,1.1fr);gap:28px;padding:34px 0;border-bottom:2px dashed #c9cfcc;align-items:start}
.vf-step:first-of-type{margin-top:26px}
.vf-n{font:800 64px/0.9 'Barlow Cond',sans-serif;color:var(--sig-d)}
.vf-txt h3{font-size:28px;font-weight:800;margin-bottom:8px}
.vf-txt p{color:var(--muted);margin-bottom:10px}
.vf-dl{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-top:14px}
.vf-phone{background:#ece5dd radial-gradient(rgba(0,0,0,.05) 1px,transparent 1px) 0 0/12px 12px;border:9px solid #0d0f10;border-radius:26px;padding:0 14px 16px;max-width:400px;overflow:hidden}
.vf-phone-h{margin:0 -14px 14px;background:#1e5f4f;color:#fff;font-weight:700;padding:12px 16px}
.vf-phone audio{width:100%}
.vf-cap{font-size:12px;color:#5d6a63;margin-top:8px}
.vf-label{font:600 12px 'Plex Mono',monospace;color:var(--muted);margin-bottom:8px}
.vf-quote{background:#fff;border-left:5px solid var(--sig);padding:16px 18px;font:400 15px/1.6 'Plex Mono',monospace;color:#1c1f21;box-shadow:0 10px 22px -18px rgba(0,0,0,.5)}
.vf-map{width:100%;border-collapse:collapse;background:#fff;font-size:14px;box-shadow:0 10px 22px -18px rgba(0,0,0,.5)}
.vf-map th{font:600 11px 'Plex Mono',monospace;color:#6b736f;text-align:left;padding:10px 12px;border-bottom:2px solid #1c1f21}
.vf-map td{padding:10px 12px;border-bottom:1px solid #e3e6e4;vertical-align:top}
.vf-map td:first-child{color:#5d6a63;font-style:italic}
.vf-map b{font-family:'Plex Mono',monospace;font-weight:600}
.vf-map .r{text-align:right;white-space:nowrap}
.vf-pdf{display:block;border:1px solid #d1d6d3;box-shadow:0 24px 40px -26px rgba(0,0,0,.6);transform:rotate(.6deg);background:#fff}
.vf-pdf img{display:block;width:100%;height:auto}
.vf-checks{list-style:none;display:grid;gap:10px}
.vf-checks li{background:#fff;padding:14px 16px 14px 46px;position:relative;border-radius:2px;font-weight:600}
.vf-checks li::before{content:"✓";position:absolute;left:14px;top:11px;width:22px;height:22px;border-radius:3px;background:var(--sig);display:grid;place-items:center;font-weight:800}
.vf-tab{width:100%;border-collapse:collapse;margin-top:26px;background:#fff;font-size:15px}
.vf-tab th{text-align:left;font:600 12px 'Plex Mono',monospace;color:#6b736f;padding:12px 14px;border-bottom:2px solid #1c1f21}
.vf-tab td{padding:14px;border-bottom:1px solid #e3e6e4;vertical-align:top}
.vf-tab td:first-child{font-weight:800;font-family:'Barlow Cond',sans-serif;font-size:20px;white-space:nowrap}
.vf-kosten{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}
.vf-kosten div{background:#1c1f21;color:#c3cac6;padding:18px 20px;border-left:6px solid var(--sig)}
.vf-kosten b{display:block;font:800 23px 'Barlow Cond',sans-serif;color:#fff;margin-bottom:4px}
.vf-tl{list-style:none;margin-top:30px;border-left:4px solid #1c1f21;padding-left:0}
.vf-tl li{position:relative;padding:0 0 26px 34px;display:grid;grid-template-columns:120px 1fr auto;gap:4px 20px;align-items:baseline}
.vf-tl li::before{content:"";position:absolute;left:-12px;top:6px;width:20px;height:20px;background:var(--sig);border:4px solid #1c1f21;border-radius:3px}
.vf-tl time{font:800 24px 'Barlow Cond',sans-serif}
.vf-tl b{font:800 22px 'Barlow Cond',sans-serif;grid-column:2}
.vf-tl span{grid-column:2;color:var(--muted)}
.vf-tl em{grid-column:3;grid-row:1/span 2;font-style:normal;font-size:13px;font-weight:700;background:#fff;border:1.5px solid #c9cfcc;padding:4px 10px;border-radius:3px;white-space:nowrap}
.vf-probe{display:grid;grid-template-columns:1fr 200px;gap:40px;align-items:center;background:#1c1f21;color:#eef1ef;border-radius:4px;margin:6vh auto 10vh!important;padding:44px!important;box-shadow:inset 0 0 0 6px #1c1f21,inset 0 0 0 8px var(--sig)}
.vf-probe h2 em{font-style:normal;color:var(--sig)}
.vf-probe p{color:#c3cac6;margin-top:12px;max-width:60ch}
.vf-probe img{width:200px;height:200px;object-fit:cover;border:3px solid var(--sig);border-radius:4px}
.vf-probe .ghost-btn{background:transparent;color:#fff;border:2px solid #fff}
.vf-probe .ghost-btn:hover{background:#fff;color:#1c1f21}
.vf-small{font-size:13px}.vf-small a{color:#fff}
@media (max-width:900px){.vf-step{grid-template-columns:1fr;gap:12px}.vf-n{font-size:48px}.vf-kosten{grid-template-columns:1fr}.vf-probe{grid-template-columns:1fr}.vf-probe img{display:none}
  .vf-clock{grid-template-columns:1fr 1fr;row-gap:18px}.vf-tl li{grid-template-columns:1fr}.vf-tl b,.vf-tl span,.vf-tl em{grid-column:1;grid-row:auto}.vf-tl em{justify-self:start}}
@media (max-width:640px){.vf-tab td:first-child{white-space:normal}.vf-probe{padding:28px 20px!important}}
.vf-probe .eyebrow{color:var(--sig)}
/* Weitere Dokumente */
.vf-docs h2{font-weight:800;font-size:clamp(36px,4.2vw,58px);line-height:1;max-width:18em}
.vf-docgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}
.vf-docgrid article{background:#fff;padding:20px;border-top:5px solid var(--sig);display:flex;flex-direction:column;gap:12px;box-shadow:0 14px 26px -22px rgba(0,0,0,.6)}
.vf-docgrid h3{font:800 26px 'Barlow Cond',sans-serif}
.vf-docgrid p{color:var(--muted);font-size:14.5px}
.vf-docgrid audio{width:100%}
.vf-thumb{display:block;border:1px solid #d1d6d3;aspect-ratio:778/700;overflow:hidden;background:#fff}
.vf-thumb img{display:block;width:100%;height:auto}
.vf-docgrid .link{margin-top:auto;font-weight:700}
.vf-dark{color:var(--muted)!important;margin-top:18px}
@media (max-width:900px){.vf-docgrid{grid-template-columns:1fr}}
