/* =============================================================================
   page-gruenstromspeicher.css  —  Seitenspezifische Komponenten der
   Grünstromspeicher-Vertiefungsseite
   -----------------------------------------------------------------------------
   Laedt KONDITIONAL nur auf page-gruenstromspeicher.php (zentrales Enqueue).
   Tokens (--green, --green-deep, --ink, --paper, --line, --shadow, --ease …),
   Basis-Primitive (.btn, .kicker, .reveal, .field, .leadbox, .num-tag, .t-h2)
   + Reveal-System kommen aus projecta-system.css — hier NICHT neu definiert.
   Hier NUR die seiten-eigenen Bausteine. Quelle: Mockup v1.1.0 (konsolidiert).
   ============================================================================= */

/* Lokale Akzent-Tokens (Warn-Rot fuer §51 — nicht im System-CSS, nur hier) */
.pds .ghero,
.pds .statstrip,
.pds .section.flowsec,
.pds .compare,
.pds .final { --warn:#e0533d; --warn-soft:#fbe7e2; --warn-ink:#a3331f; }

/* Breite Variante fuer das Hero-Diagramm (sprengt den Standard-wrap) */
.pds .wrap-wide { width:min(100% - 40px, 1480px); margin-inline:auto; }

/* === Buttons: Pfeil-Mikrointeraktion (Basis .btn kommt aus System) === */
.pds .btn-arrow svg { transition:transform .3s var(--ease); }
.pds .btn:hover .btn-arrow svg { transform:translateX(5px); }
.pds .btn-ghost { background:rgba(255,255,255,.72); backdrop-filter:blur(8px); }

/* === Badges (persona) === */
.pds .badge { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; padding:5px 12px; border-radius:var(--r-pill); }
.pds .badge-invest { background:var(--invest-soft); color:var(--invest); }
.pds .badge-owner { background:var(--paper-3); color:var(--green-ink); }

/* =============================================================================
   HERO — full-width Daten-Diagramm
   ============================================================================= */
.pds .ghero { position:relative; padding:158px 0 60px; overflow:hidden; background:
  radial-gradient(60% 50% at 80% 0%, rgba(116,183,42,.10), transparent 60%),
  radial-gradient(50% 40% at 6% 30%, rgba(224,83,61,.06), transparent 60%),
  linear-gradient(180deg, var(--paper) 0%, var(--paper-2) 100%); }
.pds .ghero .grid-tex { position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.7;
  background-image:radial-gradient(rgba(90,144,35,.10) 1.1px, transparent 1.1px);
  background-size:24px 24px; -webkit-mask-image:radial-gradient(90% 80% at 50% 30%,#000,transparent 88%); mask-image:radial-gradient(90% 80% at 50% 30%,#000,transparent 88%); }
.pds .ghero-head { position:relative; z-index:2; max-width:1080px; margin:0 auto 14px; text-align:center; }
.pds .ghero-tag { display:inline-flex; align-items:center; gap:10px; font-size:12px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--green-deep); background:#fff; border:1px solid var(--line); padding:8px 18px; border-radius:var(--r-pill); box-shadow:0 10px 30px -18px rgba(40,90,30,.35); margin-bottom:26px; }
.pds .ghero-tag .pdot { width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 0 0 rgba(116,183,42,.55); }
html.js .pds .ghero-tag .pdot { animation:gsLivepulse 2.2s infinite; }
@keyframes gsLivepulse { 0%{box-shadow:0 0 0 0 rgba(116,183,42,.5)} 70%{box-shadow:0 0 0 9px rgba(116,183,42,0)} 100%{box-shadow:0 0 0 0 rgba(116,183,42,0)} }
.pds .ghero h1 { font-size:clamp(42px,6.6vw,92px); letter-spacing:-.045em; font-weight:900; color:var(--ink); }
.pds .ghero h1 .ln { display:block; overflow:hidden; }
.pds .ghero h1 .ln > span { display:block; transform:translateY(112%); }
html.js .pds .ghero h1 .ln > span { animation:gsLineUp 1.05s var(--ease) forwards; }
html.js .pds .ghero h1 .ln:nth-child(1) > span { animation-delay:.22s; }
html.js .pds .ghero h1 .ln:nth-child(2) > span { animation-delay:.36s; }
@keyframes gsLineUp { to { transform:translateY(0); } }
.pds .ghero h1 .hl { color:var(--green-deep); }
.pds .ghero .sub { position:relative; z-index:2; max-width:680px; margin:24px auto 0; text-align:center; font-size:clamp(17px,1.6vw,20px); color:var(--muted); line-height:1.6; font-weight:500; }
html.js .pds .ghero .sub { opacity:0; animation:gsFadeUp .9s var(--ease) .7s forwards; }
@keyframes gsFadeUp { from{opacity:0;transform:translateY(18px)} to{opacity:1;transform:none} }
.pds .ghero-cta { position:relative; z-index:2; display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:30px; }
html.js .pds .ghero-cta { opacity:0; animation:gsFadeUp .9s var(--ease) .85s forwards; }

/* =============================================================================
   EIN TAG AM STROMMARKT — interaktives Tagesmarkt-Diagramm (namespaced .tagm)
   Ersetzt das alte statische Hero-Chart-Panel. Segmented-Control "Mit/Ohne
   Speicher" + GSAP-Reveal. Alle Klassen/IDs mit tagm-Prefix (Kollisionsschutz).
   ============================================================================= */
.pds .tagm { --sun:#e8a317; --sun-ink:#a9781a; --loss:#c0492f; max-width:1120px; margin-inline:auto; }
.pds .tagm .tagm-eyebrow { display:inline-flex; align-items:center; gap:12px; font-size:12px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--green-ink); }
.pds .tagm .tagm-eyebrow::before { content:""; width:26px; height:1.5px; background:currentColor; opacity:.55; }
.pds .tagm h2 { font-size:clamp(34px,4.6vw,54px); letter-spacing:-.034em; line-height:1.04; font-weight:800; color:var(--ink); margin:20px 0 0; max-width:15ch; }
.pds .tagm h2 .tagm-hl { color:var(--green-ink); }
.pds .tagm .tagm-lead { font-size:17.5px; line-height:1.6; color:var(--muted); max-width:54ch; margin:18px 0 0; font-weight:400; }
.pds .tagm .tagm-lead b { color:var(--ink); font-weight:600; }
/* ---- 3-Phasen-Erzaehlung (entkastet, keine Karten) ---- */
.pds .tagm .tagm-phases { display:grid; grid-template-columns:repeat(3,1fr); align-items:start; column-gap:0; position:relative; margin-top:42px; }
.pds .tagm .tagm-phase { flex:1; display:flex; flex-direction:column; gap:12px; }
.pds .tagm .tagm-pic { width:48px; height:48px; border-radius:50%; display:grid; place-items:center; flex:0 0 auto; }
.pds .tagm .tagm-pic svg { width:26px; height:26px; fill:#fff; }
.pds .tagm .tagm-pic.gold { background:var(--sun); } .pds .tagm .tagm-pic.green { background:var(--green-deep); } .pds .tagm .tagm-pic.dark { background:var(--ink); }
.pds .tagm .tagm-phase h4 { font-size:15px; font-weight:800; color:var(--ink); margin:0; letter-spacing:-.01em; }
.pds .tagm .tagm-phase h4 b { color:var(--green-ink); font-weight:800; }
.pds .tagm .tagm-phase p { font-size:13.5px; line-height:1.5; color:var(--muted); margin:0; max-width:30ch; }
.pds .tagm .tagm-parr { position:absolute; top:13px; color:var(--line-2); }
.pds .tagm .tagm-parr:nth-child(2) { left:calc(16.666% + 13px); }
.pds .tagm .tagm-parr:nth-child(4) { left:calc(50% + 13px); }
.pds .tagm .tagm-parr svg { width:22px; height:22px; fill:currentColor; }
/* ---- Segmented-Control Toggle ---- */
.pds .tagm .tagm-seg { position:relative; display:inline-flex; background:var(--paper-2); border:1px solid var(--line); border-radius:100px; padding:5px; margin-top:34px; user-select:none; }
.pds .tagm .tagm-segbg { position:absolute; top:5px; bottom:5px; left:5px; border-radius:100px; background:#fff; box-shadow:0 4px 12px -4px rgba(40,90,30,.28); z-index:0; }
.pds .tagm .tagm-segbtn { position:relative; z-index:1; appearance:none; background:none; border:none; padding:11px 26px; font-family:inherit; font-size:14.5px; font-weight:700; color:var(--muted); cursor:pointer; transition:color .3s var(--ease); white-space:nowrap; display:inline-flex; align-items:center; gap:9px; }
.pds .tagm .tagm-segbtn .tagm-dot { width:8px; height:8px; border-radius:50%; background:currentColor; opacity:.4; transition:all .3s var(--ease); }
.pds .tagm .tagm-segbtn.active { color:var(--green-ink); } .pds .tagm .tagm-segbtn.active .tagm-dot { opacity:1; background:var(--green); }
.pds .tagm.is-ohne .tagm-segbtn.active { color:var(--loss); } .pds .tagm.is-ohne .tagm-segbtn.active .tagm-dot { background:var(--loss); }
/* ---- Chart ---- */
.pds .tagm .tagm-chart { margin-top:40px; position:relative; }
.pds .tagm .tagm-plab { display:flex; align-items:center; gap:9px; font-size:14px; font-weight:800; color:var(--ink); }
.pds .tagm .tagm-plab>span { font-size:12.5px; font-weight:500; color:var(--muted-2); letter-spacing:.01em; }
.pds .tagm .tagm-plab.sun { color:var(--sun-ink); }
.pds .tagm .tagm-ind { flex:0 0 auto; display:inline-block; }
.pds .tagm .tagm-ind.tagm-sunind { width:18px; height:13px; border-radius:3px; background:linear-gradient(180deg,rgba(214,162,40,.6),rgba(214,162,40,.12)); }
.pds .tagm .tagm-ind.tagm-lineind { width:18px; height:3.5px; border-radius:2px; background:var(--ink); }
.pds .tagm .tagm-status { position:absolute; top:1px; right:0; font-size:13px; font-weight:800; height:18px; }
.pds .tagm .tagm-status span { position:absolute; right:0; top:0; white-space:nowrap; display:inline-flex; align-items:center; gap:8px; transition:opacity .4s var(--ease); }
.pds .tagm .tagm-status span::before { content:""; width:9px; height:9px; border-radius:50%; background:currentColor; flex:0 0 auto; }
.pds .tagm.is-mit .tagm-status .ohne-only, .pds .tagm.is-ohne .tagm-status .mit-only { opacity:0; }
.pds .tagm.is-mit .tagm-status .mit-only { color:var(--green-ink); } .pds .tagm.is-ohne .tagm-status .ohne-only { color:var(--loss); }
.pds .tagm .tagm-svgwrap { position:relative; margin-top:6px; }
.pds .tagm .tagm-svg { width:100%; aspect-ratio:1000/500; height:auto; display:block; overflow:visible; }
.pds .tagm .tagm-svg text { font-variant-numeric:tabular-nums; letter-spacing:.01em; }
.pds .tagm .mit-only { transition:opacity .5s var(--ease); } .pds .tagm.is-ohne .mit-only { opacity:0; }
.pds .tagm .ohne-only { opacity:0; transition:opacity .5s var(--ease); } .pds .tagm.is-ohne .ohne-only { opacity:1; }
.pds .tagm .tagm-anno { position:absolute; transform:translateX(-50%); display:inline-flex; align-items:center; gap:7px; font-size:12.5px; font-weight:800; white-space:nowrap; pointer-events:none; }
.pds .tagm .tagm-anno.mit-only { color:var(--green-ink); } .pds .tagm .tagm-anno.ohne-only { color:var(--loss); }
.pds .tagm .tagm-anno.sun { color:var(--sun-ink); font-size:12px; }
.pds .tagm .tagm-bat { position:relative; width:14px; height:22px; border:2px solid currentColor; border-radius:4px; flex:0 0 auto; }
.pds .tagm .tagm-bat::after { content:""; position:absolute; top:-5px; left:50%; transform:translateX(-50%); width:7px; height:3px; background:currentColor; border-radius:2px 2px 0 0; }
.pds .tagm .tagm-bat i { position:absolute; left:1.5px; right:1.5px; bottom:1.5px; background:currentColor; border-radius:1px; height:55%; }
.pds .tagm .tagm-verdict { display:flex; gap:15px; align-items:flex-start; margin-top:34px; padding-top:26px; border-top:1px solid var(--line); }
.pds .tagm .tagm-verdict .tagm-vi { width:26px; height:26px; flex:0 0 auto; color:var(--green-ink); }
.pds .tagm.is-ohne .tagm-verdict .tagm-vi { color:var(--loss); }
.pds .tagm .tagm-verdict .tagm-vi svg { width:100%; height:100%; fill:currentColor; }
.pds .tagm .tagm-verdict h3 { font-size:18.5px; font-weight:800; letter-spacing:-.01em; margin:1px 0 5px; color:var(--ink); }
.pds .tagm .tagm-verdict p { font-size:14.5px; line-height:1.55; color:var(--muted); margin:0; max-width:62ch; }
.pds .tagm.is-ohne .v-mit { display:none; } .pds .tagm.is-mit .v-ohne { display:none; }
.pds .tagm .tagm-foot { margin-top:22px; font-size:11.5px; color:var(--muted-2); }
@media(max-width:760px){
  .pds .tagm .tagm-phases { display:flex; flex-direction:column; gap:22px; } .pds .tagm .tagm-parr { position:static; left:auto; top:auto; align-self:center; margin:0; transform:rotate(90deg); } .pds .tagm .tagm-phase p { max-width:none; }
  .pds .tagm .tagm-status { position:static; height:auto; margin:16px 0 -4px; font-size:12.5px; } .pds .tagm .tagm-status span { position:static; }
  .pds .tagm.is-mit .tagm-status .ohne-only, .pds .tagm.is-ohne .tagm-status .mit-only { display:none; }
  .pds .tagm .tagm-plab { flex-wrap:wrap; gap:2px 11px; } .pds .tagm .tagm-svg { aspect-ratio:auto; height:380px; }
  .pds .tagm h2 { font-size:clamp(30px,8vw,40px); }
}

/* =============================================================================
   STAT-STREIFEN
   ============================================================================= */
.pds .statstrip { background:linear-gradient(180deg,var(--paper-2),var(--paper-3)); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.pds .statstrip .wrap { display:grid; grid-template-columns:repeat(3,1fr); gap:0; }
.pds .stat-cell { padding:42px 30px; border-left:1px solid var(--line); text-align:center; position:relative; overflow:hidden; }
.pds .stat-cell:first-child { border-left:0; }
.pds .stat-cell .n { font-weight:900; font-size:clamp(34px,3.6vw,52px); letter-spacing:-.05em; line-height:1; color:var(--green-deep); font-variant-numeric:tabular-nums; }
.pds .stat-cell .n.warn { color:var(--warn); }
.pds .stat-cell .n .suffmin { font-size:.5em; font-weight:800; }
.pds .stat-cell .l { font-size:14px; color:var(--muted); margin-top:12px; max-width:260px; margin-inline:auto; line-height:1.5; }

/* =============================================================================
   3 ERLÖSQUELLEN — editorial split-rows
   ============================================================================= */
.pds .rev-intro { max-width:760px; margin-bottom:18px; }
.pds .rev-intro .num-tag { display:flex; align-items:center; gap:12px; margin-bottom:20px; color:var(--muted-2); letter-spacing:.18em; }
.pds .rev-intro .num-tag::before { content:""; width:30px; height:1.5px; background:var(--line-2); }
.pds .rev-intro h2 { font-size:clamp(34px,4.6vw,60px); letter-spacing:-.045em; }
.pds .rev-intro p { color:var(--muted); font-size:18px; line-height:1.6; margin-top:18px; max-width:620px; }

.pds .splitrow { display:grid; grid-template-columns:auto 1fr auto; gap:46px; align-items:center; padding:46px 0; border-top:1px solid var(--line); }
.pds .splitrow:last-child { border-bottom:1px solid var(--line); }
.pds .splitrow .bignum { font-size:clamp(74px,9vw,150px); font-weight:900; letter-spacing:-.06em; line-height:.8; background-image:linear-gradient(180deg,var(--green-soft),var(--green-deep)); -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; flex:0 0 auto; min-width:1.4ch; }
.pds .splitrow:nth-child(even) .bignum { background-image:linear-gradient(180deg,#9fcf6c,var(--green-deep)); }
.pds .splitrow .scopy { max-width:680px; }
.pds .splitrow .scopy .lab { display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--green-ink); margin-bottom:14px; }
.pds .splitrow .scopy .lab svg { opacity:.85; }
.pds .splitrow .scopy h3 { font-size:clamp(24px,2.6vw,34px); letter-spacing:-.03em; margin-bottom:12px; }
.pds .splitrow .scopy p { color:var(--muted); font-size:16px; line-height:1.7; max-width:600px; }
.pds .splitrow .vis { flex:0 0 auto; width:160px; height:130px; position:relative; }
.pds .mini { width:100%; height:100%; }
.pds .mini .ax { stroke:var(--line); stroke-width:1.4; }
.pds .mini .area { fill:rgba(116,183,42,.12); }
.pds .mini .ln { fill:none; stroke:var(--green); stroke-width:2.6; stroke-linecap:round; stroke-dasharray:100; stroke-dashoffset:100; transition:stroke-dashoffset 1.5s var(--ease-2) .25s; }
.pds .splitrow.in .mini .ln { stroke-dashoffset:0; }
.pds .mini .current { fill:none; stroke:#a6e05a; stroke-width:3.2; stroke-linecap:round; stroke-dasharray:9 91; stroke-dashoffset:100; opacity:0; filter:drop-shadow(0 0 3px #8bc34a) drop-shadow(0 0 7px rgba(116,183,42,.6)); }
.pds .splitrow.in .mini .current { opacity:1; animation:gsFlowcur 2.6s linear 1.4s infinite; }
@keyframes gsFlowcur { from{stroke-dashoffset:100} to{stroke-dashoffset:0} }
.pds .mini .bb { fill:var(--green); opacity:.85; transform-box:fill-box; transform-origin:bottom; transform:scaleY(0); transition:transform .8s var(--ease-2); }
.pds .mini .bb.lo { fill:var(--mint-3); }
.pds .splitrow.in .mini .bb { transform:scaleY(1); }
.pds .splitrow.in .mini .bb:nth-of-type(2) { transition-delay:.07s; }
.pds .splitrow.in .mini .bb:nth-of-type(3) { transition-delay:.14s; }
.pds .splitrow.in .mini .bb:nth-of-type(4) { transition-delay:.21s; }
.pds .splitrow.in .mini .bb:nth-of-type(5) { transition-delay:.28s; }
.pds .mini .pt { fill:var(--green-deep); transform-box:fill-box; transform-origin:center; }
.pds .splitrow.in .mini .pt { filter:drop-shadow(0 0 4px var(--green)); animation:gsPtpulse 2.2s var(--ease) 1.4s infinite; }
@keyframes gsPtpulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.35)} }

/* =============================================================================
   VORHER / HEUTE / NACHHER
   ============================================================================= */
.pds .compare { display:grid; grid-template-columns:1fr 1fr 1.12fr; gap:0; background:#fff; border:1px solid var(--line); border-radius:26px; overflow:hidden; box-shadow:var(--shadow-soft); }
.pds .cmp { padding:42px 36px; position:relative; border-left:1px solid var(--line); }
.pds .cmp:first-child { border-left:0; }
.pds .cmp.win { background:linear-gradient(180deg,#fbfff5,#f1f9e6); }
.pds .cmp .ph { font-size:11.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; margin-bottom:6px; }
.pds .cmp.past .ph { color:var(--muted-2); }
.pds .cmp.now .ph { color:var(--warn); }
.pds .cmp.win .ph { color:var(--green-deep); }
.pds .cmp .hd { font-size:20px; letter-spacing:-.02em; margin-bottom:22px; color:var(--ink); }
.pds .cmp .big { display:flex; align-items:baseline; gap:8px; margin-bottom:6px; }
.pds .cmp .big .v { font-weight:900; letter-spacing:-.05em; line-height:1; font-variant-numeric:tabular-nums; }
.pds .cmp.past .v { font-size:46px; color:var(--muted-2); }
.pds .cmp.now .v { font-size:54px; color:var(--warn); }
.pds .cmp.win .v { font-size:62px; color:var(--green-deep); }
.pds .cmp .big .u { font-size:15px; font-weight:700; color:var(--muted); }
.pds .cmp .cap { font-size:13.5px; color:var(--muted); line-height:1.55; margin-bottom:20px; max-width:280px; }
/* Bezugsgröße der 7–10 % direkt an der Zahl (nicht nur in der Fußnote) — löst den 6–9-vs-7–10-Lese-Konflikt zur Startseite */
.pds .cmp .big-sub { font-size:12px; font-weight:800; letter-spacing:.02em; color:var(--green-ink); margin:-2px 0 8px; }
.pds .cmp .barwrap { height:8px; border-radius:6px; background:var(--paper-3); overflow:hidden; margin-bottom:18px; }
.pds .cmp .barfill2 { height:100%; border-radius:6px; width:0; transition:width 1.1s var(--ease-2); }
.pds .compare.in .cmp.past .barfill2 { width:78%; }
.pds .compare.in .cmp.now .barfill2 { width:46%; }
.pds .compare.in .cmp.win .barfill2 { width:100%; }
.pds .cmp.past .barfill2 { background:linear-gradient(90deg,#cbd9bb,#a9bd92); }
.pds .cmp.now .barfill2 { background:linear-gradient(90deg,#f3a08e,#e0533d); }
.pds .cmp.win .barfill2 { background:linear-gradient(90deg,var(--green-soft),var(--green-deep)); }
.pds .cmp .tline { display:flex; gap:9px; align-items:flex-start; font-size:13px; color:var(--ink-2); font-weight:500; }
.pds .cmp .tline svg { flex:0 0 auto; margin-top:2px; }
.pds .cmp .ribbon { position:absolute; top:18px; right:-1px; background:var(--green); color:#08240a; font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; padding:6px 14px 6px 16px; border-radius:100px 0 0 100px; }
.pds .cmp .arrow-dn { position:absolute; top:50%; right:-13px; z-index:4; width:26px; height:26px; border-radius:50%; background:#fff; border:1px solid var(--line); display:grid; place-items:center; transform:translateY(-50%); }
.pds .compare-foot { text-align:center; margin-top:26px; color:var(--ink); font-size:16px; font-weight:600; }
.pds .compare-foot b { color:var(--green-deep); }
.pds .cmp-foot { font-size:12px; color:var(--muted-2); line-height:1.55; padding:0 4px; margin-top:18px; }

/* =============================================================================
   SO FUNKTIONIERT ES — Energiefluss
   ============================================================================= */
.pds .flowsec { position:relative; }
.pds .flowrow { position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:26px; align-items:stretch; margin-top:14px; }
.pds .flow-svg { position:absolute; top:60px; left:8%; right:8%; height:50px; z-index:0; pointer-events:none; }
.pds .flow-svg svg { width:100%; height:100%; overflow:visible; }
.pds .flow-svg path { fill:none; stroke:var(--line-2); stroke-width:2; }
.pds .flow-svg .draw { stroke:var(--green); stroke-width:2.6; stroke-dasharray:1400; stroke-dashoffset:1400; transition:stroke-dashoffset 2.4s var(--ease-2); }
.pds .flowrow.in .flow-svg .draw { stroke-dashoffset:0; }
.pds .flow-svg .pulse { fill:var(--green); filter:drop-shadow(0 0 6px rgba(116,183,42,.8)); }
.pds .fstep { position:relative; z-index:1; background:#fff; border:1px solid var(--line); border-radius:22px; padding:34px 30px; transition:.4s var(--ease); }
.pds .fstep:hover { transform:translateY(-7px); box-shadow:var(--shadow); }
.pds .fstep .top { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.pds .fstep .num { font-weight:800; font-size:16px; color:#fff; width:46px; height:46px; border-radius:14px; background:linear-gradient(135deg,var(--green),var(--green-deep)); display:grid; place-items:center; box-shadow:0 12px 26px -12px rgba(116,183,42,.7); font-variant-numeric:tabular-nums; }
.pds .fstep:hover .num { transform:scale(1.08) rotate(-4deg); }
.pds .fstep h3 { font-size:20px; margin-bottom:10px; letter-spacing:-.02em; }
.pds .fstep p { color:var(--muted); font-size:14.5px; line-height:1.6; }
.pds .flow-tip { display:inline-flex; align-items:center; gap:11px; margin:38px auto 0; background:linear-gradient(135deg,var(--paper-2),var(--mint)); border:1px solid var(--line-2); padding:14px 26px; border-radius:var(--r-pill); color:var(--green-ink); font-weight:700; font-size:14.5px; }
.pds .flow-tip svg { color:var(--green-deep); }

/* =============================================================================
   MARKENKOMPONENTEN (Logo-Grid)
   ============================================================================= */
.pds .logogrid-sec { background:linear-gradient(180deg,var(--paper-3),var(--mint)); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:64px 0; }
.pds .logogrid-sec .t { text-align:center; color:var(--muted); font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:700; margin-bottom:34px; }
.pds .logogrid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; max-width:760px; margin:0 auto; }
.pds .lcell { background:rgba(255,255,255,.7); border:1px solid var(--line); border-radius:18px; height:96px; display:grid; place-items:center; transition:.35s var(--ease); backdrop-filter:blur(6px); }
.pds .lcell:hover { transform:translateY(-5px); box-shadow:var(--shadow-soft); border-color:var(--line-2); background:#fff; }
.pds .lcell .txtlogo { font-weight:800; font-size:21px; color:#9aa890; letter-spacing:-.02em; transition:.3s; }
.pds .lcell:hover .txtlogo { color:var(--green-deep); }
.pds .logogrid-note { text-align:center; color:var(--muted-2); font-size:12.5px; margin-top:24px; }

/* =============================================================================
   ZWEI WEGE — Double-Persona
   ============================================================================= */
.pds .persona { display:grid; grid-template-columns:1fr 1fr; gap:26px; }
.pds .pcard { position:relative; border-radius:26px; padding:42px 38px; overflow:hidden; transition:.45s var(--ease); }
.pds .pcard:hover { transform:translateY(-8px); }
.pds .pcard.owner { background:linear-gradient(150deg,#f4fbe9,#e7f4d4); border:1px solid var(--line-2); }
.pds .pcard.invest { background:linear-gradient(150deg,#eef5e3,#dcefc4); border:1px solid #cbd9bb; }
.pds .pcard .badge { margin-bottom:18px; }
.pds .pcard h3 { font-size:clamp(24px,2.4vw,32px); letter-spacing:-.03em; margin-bottom:12px; color:var(--ink); }
.pds .pcard p { font-size:15.5px; line-height:1.65; margin-bottom:22px; max-width:430px; }
.pds .pcard.owner p { color:#3f5538; }
.pds .pcard.invest p { color:var(--ink-2); }
.pds .pcard ul { list-style:none; display:grid; gap:11px; margin-bottom:28px; }
.pds .pcard ul li { display:flex; gap:11px; align-items:flex-start; font-size:14.5px; font-weight:500; color:var(--ink-2); }
.pds .pcard ul .ck { width:24px; height:24px; border-radius:8px; display:grid; place-items:center; flex:0 0 auto; }
.pds .pcard.owner ul .ck { background:var(--green); box-shadow:0 8px 18px -8px rgba(116,183,42,.8); }
.pds .pcard.invest ul .ck { background:var(--invest); box-shadow:0 8px 18px -8px rgba(58,98,18,.7); }
.pds .pcard .btn-go { display:inline-flex; align-items:center; gap:9px; font-weight:700; font-size:15px; }
.pds .pcard.owner .btn-go { color:var(--green-deep); }
.pds .pcard.invest .btn-go { color:var(--invest); }
.pds .pcard .btn-go svg { transition:transform .3s var(--ease); }
.pds .pcard:hover .btn-go svg { transform:translateX(6px); }
.pds .pcard .corner { position:absolute; right:-50px; top:-50px; width:170px; height:170px; border-radius:50%; opacity:.6; }
.pds .pcard.owner .corner { background:radial-gradient(circle,rgba(116,183,42,.18),transparent 70%); }
.pds .pcard.invest .corner { background:radial-gradient(circle,rgba(58,98,18,.16),transparent 70%); }

/* =============================================================================
   FINAL CTA + LEAD (Basis .leadbox/.field aus System-CSS)
   ============================================================================= */
.pds .final { position:relative; padding:108px 0; background:linear-gradient(135deg,#3d6b18,#4f841f 60%,#46791d); overflow:hidden; }
.pds .final::before { content:""; position:absolute; inset:0; pointer-events:none; background:
  radial-gradient(40% 50% at 12% 10%,rgba(255,255,255,.28),transparent 60%),
  radial-gradient(40% 50% at 90% 90%,rgba(58,98,18,.4),transparent 62%); }
.pds .final::after { content:""; position:absolute; inset:0; opacity:.5; pointer-events:none; background-image:radial-gradient(rgba(255,255,255,.18) 1.2px,transparent 1.2px); background-size:28px 28px; -webkit-mask-image:radial-gradient(85% 95% at 50% 0%,#000,transparent 80%); mask-image:radial-gradient(85% 95% at 50% 0%,#000,transparent 80%); }
.pds .final-grid { position:relative; display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; z-index:2; }
.pds .final .kicker { color:#fff; }
.pds .final .kicker .dot { background:#fff; box-shadow:0 0 0 4px rgba(255,255,255,.2); }
.pds .final h2 { color:#fff; font-size:clamp(32px,4vw,52px); margin:20px 0 18px; letter-spacing:-.04em; }
.pds .final p { color:rgba(255,255,255,.94); font-size:18px; margin-bottom:24px; max-width:480px; line-height:1.6; }
.pds .final .trustrow { display:flex; flex-direction:column; gap:14px; color:#fff; font-weight:600; font-size:15px; }
.pds .final .trustrow span { display:flex; align-items:center; gap:10px; }
.pds .final .trustrow .ck { width:24px; height:24px; border-radius:8px; background:rgba(255,255,255,.22); display:grid; place-items:center; flex:0 0 auto; }
.pds .final .leadbox { position:relative; box-shadow:0 50px 100px -40px rgba(0,0,0,.55); }
.pds .final .leadbox::before { content:""; position:absolute; top:-1px; left:24px; right:24px; height:3px; background:linear-gradient(90deg,var(--green),var(--green-soft)); border-radius:3px; }
.pds .final .leadbox h3 { font-size:23px; margin-bottom:7px; letter-spacing:-.02em; }
.pds .final .leadbox .lsub { color:var(--muted); font-size:14px; margin-bottom:22px; }
.pds .final .leadbox .field input, .pds .final .leadbox .field select { width:100%; }
.pds .final .leadbox .btn-cta { width:100%; justify-content:center; margin-top:8px; }
.pds .final .leadbox #lead-msg { margin-top:14px; text-align:center; line-height:1.55; }

/* =============================================================================
   RESPONSIVE (vereinheitlicht: 1080 / 860 / 540)
   ============================================================================= */
@media (max-width:1080px){
  .pds .splitrow { grid-template-columns:auto 1fr; gap:30px; }
  .pds .splitrow .vis { display:none; }
  .pds .compare { grid-template-columns:1fr; }
  .pds .cmp { border-left:0; border-top:1px solid var(--line); }
  .pds .cmp:first-child { border-top:0; }
  .pds .cmp .arrow-dn { display:none; }
  .pds .final-grid { grid-template-columns:1fr; gap:40px; }
  .pds .persona { grid-template-columns:1fr; }
}
@media (max-width:860px){
  .pds .ghero { padding:130px 0 50px; }
  .pds .statstrip .wrap { grid-template-columns:1fr; }
  .pds .stat-cell { border-left:0; border-top:1px solid var(--line); padding:34px 24px; }
  .pds .stat-cell:first-child { border-top:0; }
  .pds .splitrow { grid-template-columns:1fr; gap:14px; padding:38px 0; }
  .pds .splitrow .bignum { font-size:84px; }
  .pds .flowrow { grid-template-columns:1fr; }
  .pds .flow-svg { display:none; }
  .pds .logogrid { grid-template-columns:1fr; max-width:360px; }
}
@media (max-width:540px){
  .pds .ghero-cta { flex-direction:column; align-items:stretch; }
  .pds .ghero-cta .btn { width:100%; justify-content:center; }
}

/* =============================================================================
   MOTION / A11Y
   ============================================================================= */
@media (prefers-reduced-motion:reduce){
  .pds .ghero h1 .ln > span, .pds .ghero .sub, .pds .ghero-cta { opacity:1 !important; transform:none !important; animation:none !important; }
  .pds .mini .current { display:none; }
  .pds .mini .ln { transition:none; stroke-dashoffset:0; }
  .pds .mini .bb { transition:none; transform:none; }
  .pds .splitrow.in .mini .pt { animation:none; }
  .pds .ghero-tag .pdot { animation:none; }
}

/* Icon-Farb-Fix Phosphor-Migration (22.06.) */
.pds .pcard.owner ul .ck, .pds .pcard.invest ul .ck { color:#fff; }