/* DynaQ – Unser Datenversprechen („Nur Zahlen. Keine Namen.“)
   Startseiten-Abschnitt (.dv), Zeile in der Fußzeile (.dvf) und Siegel-Kasten für Unterseiten (.dvb).
   Alle Klassen beginnen mit dv, damit nichts mit site.css kollidiert. Schrift: Source Sans 3 (lokal, 400/700/900). */

.dv,.dvf,.dvb{--dv-navy:#13365A;--dv-green:#79B141;--dv-green-head:#5E9A2E;--dv-green-text:#4E7D24;--dv-cream:#FBFAF6;--dv-paper:#fff;--dv-ink:#1E2B3A;--dv-muted:#5B6675;--dv-line:#E4E1D8;--dv-navy-soft:#C9D3DF}
.dv *,.dvf *,.dvb *{box-sizing:border-box}
.dv-seal svg,.dvf-seal svg,.dvb-seal svg{display:block;width:100%;height:auto}

/* ---------- Startseite: Abschnitt ---------- */
.dv{background:var(--dv-cream);color:var(--dv-ink);scroll-margin-top:80px}
.dv-wrap{display:grid;gap:clamp(36px,5vw,56px)}
.dv-head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(20px,4vw,48px);align-items:center}
.dv-seal{width:clamp(128px,17vw,184px);max-width:100%}
.dv-eyebrow{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--dv-muted)}
.dv-eyebrow::before{content:"";flex:none;width:28px;height:3px;border-radius:2px;background:var(--dv-green)}
.dv h2{margin:0;font-size:clamp(36px,5.6vw,64px);line-height:1;font-weight:900;letter-spacing:-.015em;color:var(--dv-navy);text-wrap:balance}
.dv h2 span{color:var(--dv-green-head)}
.dv-lead{margin:18px 0 0;max-width:58ch;font-size:clamp(18px,2vw,21px);line-height:1.5}
.dv-lead strong{color:var(--dv-navy)}

.dv-flow{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:stretch}
.dv-card{min-width:0;border-radius:14px;padding:clamp(20px,3vw,28px);display:flex;flex-direction:column;gap:18px}
.dv-in{background:var(--dv-paper);border:1px solid var(--dv-line)}
.dv-out{background:var(--dv-navy);color:#fff}
.dv-label{margin:0;font-size:13px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--dv-muted)}
.dv-out .dv-label{color:var(--dv-navy-soft)}
.dv-rows{list-style:none;margin:0;padding:0;display:grid}
.dv-rows li{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;align-items:baseline;margin:0;padding:11px 0;border-top:1px solid var(--dv-line)}
.dv-rows li::before{content:none}
.dv-rows li:first-child{border-top:0;padding-top:0}
.dv-k{font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--dv-muted)}
.dv-v{font-size:18px;font-weight:700;color:var(--dv-navy);overflow-wrap:anywhere}
.dv-gone{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.dv-gone li{margin:0;font-size:15px;color:var(--dv-navy-soft);text-decoration:line-through;text-decoration-color:var(--dv-green);text-decoration-thickness:2px;padding:4px 10px;border:1px dashed rgba(201,211,223,.45);border-radius:999px}
.dv-gone li::before{content:none}
.dv-nums{margin:0;display:grid}
.dv-nums div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:10px 0;border-top:1px solid rgba(255,255,255,.14)}
.dv-nums div:first-child{border-top:0;padding-top:0}
.dv-nums dt{font-size:17px;color:#E8EDF3}
.dv-nums dd{margin:0;font-size:24px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap}
.dv-note{margin:auto 0 0;font-size:14px;line-height:1.45;color:var(--dv-muted)}
.dv-out .dv-note{color:var(--dv-navy-soft)}
.dv-gate{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:0 clamp(12px,2vw,22px);color:var(--dv-green-text)}
.dv-gate svg{width:44px;height:20px;flex:none}
.dv-gate span{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-align:center;line-height:1.25;max-width:7em}

.dv-promises{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3.5vw,44px)}
.dv-promises h3{margin:0 0 8px;font-size:clamp(22px,2.4vw,26px);font-weight:900;line-height:1.1;color:var(--dv-navy)}
.dv-promises h3::before{content:"";display:block;width:28px;height:3px;border-radius:2px;background:var(--dv-green);margin-bottom:14px}
.dv-promises p{margin:0;font-size:17px;line-height:1.55;max-width:38ch}

.dv-foot{display:grid;gap:18px;padding-top:clamp(24px,3vw,32px);border-top:1px solid var(--dv-line)}
.dv-rule{margin:0;font-size:18px;line-height:1.5;max-width:70ch}
.dv-rule strong{color:var(--dv-navy)}
.dv-facts{display:flex;flex-wrap:wrap;gap:10px 22px;margin:0;padding:0;list-style:none}
.dv-facts li{display:flex;align-items:center;gap:8px;margin:0;font-size:16px;font-weight:700;color:var(--dv-navy)}
.dv-facts li::before{content:"";flex:none;width:16px;height:16px;border-radius:50%;background:var(--dv-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.3 2.3 4.7-4.9' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
.dv-demo{margin:0;font-size:14px;line-height:1.5;color:var(--dv-muted);max-width:80ch}
.dv-demo strong{color:var(--dv-ink)}
.dv-more{font-size:16px;font-weight:700;color:var(--dv-navy);text-decoration:none;border-bottom:2px solid var(--dv-green);padding-bottom:2px;justify-self:start}
.dv-more:hover,.dv-more:focus-visible{color:var(--dv-green-text)}
.dv-more:focus-visible{outline:2px solid var(--dv-navy);outline-offset:4px}

@media (prefers-reduced-motion:no-preference){.dv-gate svg{animation:dv-nudge 2.4s ease-in-out infinite}}
@keyframes dv-nudge{0%,100%{translate:0 0}50%{translate:4px 0}}

@media (max-width:860px){
  .dv-flow{grid-template-columns:minmax(0,1fr)}
  .dv-gate{flex-direction:row;padding:14px 0}
  .dv-gate svg{transform:rotate(90deg)}
  .dv-gate span{max-width:none}
  .dv-promises{grid-template-columns:minmax(0,1fr)}
  @keyframes dv-nudge{0%,100%{translate:0 0}50%{translate:0 4px}}
}
@media (max-width:560px){
  .dv-head{grid-template-columns:minmax(0,1fr)}
  .dv-seal{width:136px}
  .dv-rows li{grid-template-columns:minmax(0,1fr);gap:2px}
}

/* ---------- Fußzeile: Datenversprechen auf jeder Seite ---------- */
.dvf{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(16px,3vw,28px);align-items:center;margin:44px 0 0;padding-top:28px;border-top:1px solid #2E5074;color:#C9D3DE}
.dvf + .base{margin-top:28px}
.dvf-seal{display:block;width:96px;flex:none}
.dvf-seal:hover{text-decoration:none}
.dvf-kicker{margin:0 0 6px;font-size:13px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--dv-navy-soft)}
.dvf-line{margin:0;font-size:16px;line-height:1.6;color:#C9D3DE}
.dvf-line b{color:#fff;font-weight:700}
.dvf-line a{color:#fff;font-weight:700;text-decoration:none;border-bottom:2px solid var(--dv-green);white-space:nowrap}
.dvf-line a:hover,.dvf-line a:focus-visible{color:var(--dv-green)}
@media (max-width:560px){.dvf{grid-template-columns:minmax(0,1fr)}.dvf-seal{width:88px}}

/* ---------- Unterseiten: Siegel-Kasten ---------- */
.dvb{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(18px,3.5vw,40px);align-items:center;margin:clamp(32px,5vw,48px) 0 0;padding:clamp(20px,3vw,32px);border-radius:14px;background:var(--dv-cream);border:1px solid var(--dv-line);color:var(--dv-ink)}
.dvb-seal{width:clamp(108px,13vw,140px)}
.dvb-eyebrow{margin:0 0 8px;font-size:13px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--dv-muted)}
.dvb h3{margin:0;font-size:clamp(26px,3.2vw,36px);line-height:1.05;font-weight:900;color:var(--dv-navy)}
.dvb h3 span{color:var(--dv-green-head)}
.dvb p.dvb-text{margin:12px 0 0;font-size:17px;line-height:1.55;max-width:62ch}
.dvb p.dvb-text strong{color:var(--dv-navy)}
.dvb-more{display:inline-block;margin-top:14px;font-size:16px;font-weight:700;color:var(--dv-navy);text-decoration:none;border-bottom:2px solid var(--dv-green);padding-bottom:2px}
.dvb-more:hover,.dvb-more:focus-visible{color:var(--dv-green-text)}
/* auf dunklem Hintergrund (s-navy) */
.dvb.dvb-dark{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:#E8EDF3}
.dvb.dvb-dark .dvb-eyebrow{color:var(--dv-navy-soft)}
.dvb.dvb-dark h3{color:#fff}
.dvb.dvb-dark h3 span{color:var(--dv-green)}
.dvb.dvb-dark p.dvb-text strong{color:#fff}
.dvb.dvb-dark .dvb-more{color:#fff}
@media (max-width:560px){.dvb{grid-template-columns:minmax(0,1fr)}.dvb-seal{width:112px}}
