/* ==========================================================================
   REDESIGN — FLEXIBLE-CONTENT-SEKTIONEN (page.php-Dispatcher, functions.php)
   Nur Wrapper-Rhythmus + Dark-Ground-Textfarbe. Die Komponenten selbst kommen aus
   redesign-detail.css (.wrap/.sec-head/.prose/.hero--detail/.cta-band/.stats/.faq-list).
   Laedt gegatet auf is_page() && !is_front_page(), nach detail.css, vor style.css.
   style.css: 0 Treffer auf .pdn-section / .pdn-section--dark / .prose / .sec-head.
   ========================================================================== */

/* Vertikalrhythmus NUR fuer die reskinnten .wrap-Typen (die tragen kein Eigen-Padding).
   96px 0 = section.block-Rhythmus (detail.css:146). Full-bleed-Typen (hero/cta) tragen
   ihr Padding selbst (.hero--detail 140px 0 150px; .cta-inner 90px 0) -> hier nichts.
   Noch-Legacy-Typen (timeline/certifications/tabs/form/pricing/cta_inline/…) haben ihr
   eigenes .pdn-container-Padding -> Wrapper bleibt 0 (kein Doppel-Padding). Doppelklasse
   .pdn-section.pdn-section--{t} analog redesign-home.css. */
.pdn-section.pdn-section--text,
.pdn-section.pdn-section--faq,
.pdn-section.pdn-section--stats,
.pdn-section.pdn-section--cards,
.pdn-section.pdn-section--process,
.pdn-section.pdn-section--solution,
.pdn-section.pdn-section--founder,
.pdn-section.pdn-section--comparison,
.pdn-section.pdn-section--pricing,
.pdn-section.pdn-section--map,
.pdn-section.pdn-section--tabs,
.pdn-section.pdn-section--cta_inline,
.pdn-section.pdn-section--certifications,
.pdn-section.pdn-section--timeline,
.pdn-section.pdn-section--form,
.pdn-section.pdn-section--video{padding:96px 0}

/* Hero-Wrapper: assets/css/style.css:9212 (.pdn-section--hero) erzwingt padding:120px 0 (0,1,0).
   Nach dem Wrapper-bg-Drop wuerden diese 120px oben/unten den hellen Body-Grund zeigen ->
   heller Streifen ueber/unter dem dunklen Hero. Auf 0 (0,2,0 schlaegt 0,1,0, laedt vor style.css);
   .hero--detail traegt sein Padding selbst (140/150). Analog redesign-home.css:9. */
.pdn-section.pdn-section--hero{padding:0}

/* stat-Reveal/Hover darf ueber den Panel-Rand animieren (analog redesign-home.css:73). */
.pdn-section--stats .pdn-section__content{overflow:visible}

/* Default (Stats folgt NICHT direkt auf einen Hero): symmetrisch 96/Panel/96. Das Hero-Overlap
   (.stats{margin-top:-90px;margin-bottom:90px}, detail.css:126) ist hier fehl am Platz. Wert 0
   (analog body.single-pdn_location .stats{margin-top:0}). */
.pdn-section--stats .stats{margin-top:0;margin-bottom:0}
/* Overlap (Dispatcher-Modifier, wenn Stats direkt auf einen Hero folgt): Panel ragt in den dunklen
   Hero wie auf den CPT-Detailseiten. Wrapper-Padding 0 (sonst verhindern die 96px den Overlap);
   Margins -90/90 1:1 aus detail.css:126. Gleiche Spezifitaet wie die Default-Regel -> muss danach stehen. */
.pdn-section.pdn-section--stats--overlap{padding:0}
/* margin-bottom:0 (nicht 90): den unteren Abstand liefert die naechste Sektion (96px padding-top).
   Sonst 90px (mb) + 96px (next) = 186px toter Weissraum. Oberer Overlap (mt:-90) unveraendert. */
.pdn-section--stats--overlap .stats{margin-top:-90px;margin-bottom:0}

/* cards:feature -> .pain-card (Icon+Titel+Text). columns=4 -> .cards--4: repeat(4,1fr) 1:1 aus
   Boilerplate Z.168 (.stats .panel), gap:24px aus .cards (detail.css). Mobile-Kollaps analog.
   FA-Icon (Feldwert) im .ic-Medaillon: Glyph-Groesse 24px = DQ pain-card .ic svg (Designquelle Z.665). */
.cards--4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
@media(max-width:980px){.cards--4{grid-template-columns:repeat(2,1fr)}}
.pdn-section--cards .pain-card .ic i{font-size:24px;line-height:1}

/* Dunkler Section-Grund (is_dark -> .pdn-section--dark am Wrapper): .prose/.sec-head erben
   sonst feste dunkle Farben (detail.css:203/205/206/149). Nur Farbe hell, Typografie unberuehrt.
   #fff / rgba(255,255,255,.85) = cta-inner-Kanon (Designquelle .cta-inner + .cta-inner p). */
.pdn-section--dark .sec-head h2,
.pdn-section--dark .prose,
.pdn-section--dark .prose h2,
.pdn-section--dark .prose h3{color:#fff}
.pdn-section--dark .sec-head p,
.pdn-section--dark .prose p,
.pdn-section--dark .prose li,
.pdn-section--dark .prose blockquote,
.pdn-section--dark .prose figcaption{color:rgba(255,255,255,.85)}
.pdn-section--dark .prose a{color:var(--orange-soft)}

/* solution-H2: bare <h2> (kein .sec-head-Scope) -> Heading-Falle (style.css h1..h6: System-Font + #010C80).
   Reassert nur font-family + Farbe, Werte aus .sec-head h2 (detail.css:149). Eng auf .solution-grid.
   Alle solution-Sektionen stehen real auf dunklem Grund (bg_accent) -> #fff greift. */
.solution-grid h2{font-family:var(--font-display);color:var(--navy)}
.pdn-section--dark .solution-grid h2{color:#fff}

/* Founder-Sektion (Variante B: Karte, Portrait links, strukturierter Text rechts).
   Die .founder-CSS war nie in die geladene CSS portiert -> Grid kollabierte (gestapelt) und die
   credential-Chips klebten unformatiert aneinander. Werte 1:1 aus Boilerplate Z.377-389.
   Zwei bewusste Vorgaben-Abweichungen (Token statt Boilerplate-Wert): .role --text-mute (BP: --orange),
   .li --blue (BP: #0A66C2). Karte + Portrait-img-Fill sind Zusatz zur Variante B. */
.founder{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:center;
  background:var(--paper-warm);border:1px solid var(--line);border-radius:var(--r);padding:34px}   /* Grid BP Z.377; Karte paper-warm/line/r; padding 34px = .serv-card (BP Z.248) */
.founder-photo{position:relative;aspect-ratio:3/4;border-radius:22px;overflow:hidden;
  background:linear-gradient(160deg,var(--navy),var(--blue) 70%,var(--blue-bright));
  display:grid;place-items:center;box-shadow:0 40px 80px -40px rgba(15,33,56,.5)}   /* BP Z.378 */
.founder-photo img{display:block;width:100%;height:100%;object-fit:cover}   /* echtes Portrait fuellt den 3/4-Rahmen (BP nutzte .ini) */
.founder-photo .ini{font-family:var(--font-display);font-size:80px;font-weight:800;color:rgba(255,255,255,.92)}   /* BP Z.381 */
.founder-text h3{font-size:30px;color:var(--navy);font-family:var(--font-display);display:flex;align-items:center;gap:12px;margin-bottom:4px}   /* BP Z.383 (+ Bricolage gegen Heading-Falle) */
.founder-text .role{font-family:var(--font-mono);font-size:13px;color:var(--text-mute);text-transform:uppercase;letter-spacing:.1em;margin-bottom:22px}   /* BP Z.384/385; Farbe --text-mute (Vorgabe) */
.founder-text p{color:var(--text-mute);margin-bottom:16px;font-size:16px}   /* BP Z.386 */
.founder-text .li{width:30px;height:30px;border-radius:8px;background:var(--blue);display:grid;place-items:center;color:#fff}   /* BP Z.387; Farbe --blue (Vorgabe) */
.badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}   /* BP Z.388 */
.badge{font-size:13px;font-weight:500;padding:8px 15px;border-radius:999px;background:rgba(46,80,144,.08);color:var(--navy);border:1px solid var(--line)}   /* BP Z.389 */
@media(max-width:980px){.founder{grid-template-columns:1fr;gap:34px}}   /* Mobile-Stack, BP Z.455 */

/* Standort/Karte (map-Typ): Weltkarte in getokter Karte, Einleitung + Regionen-Chips, alles zentriert.
   Karten-Werte #fff/1px --line/--r 1:1 aus .serv-card (Boilerplate Z.248); max-width 820px aus
   .faq-list (detail.css:356); padding 14px (Vorgabe). Chips reusen .badge (oben, BP Z.389). */
.map-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px;max-width:820px;margin:0 auto}
.map-card img{display:block;width:100%;height:auto}
.pdn-section--map .prose{margin-top:24px;text-align:center}   /* Einleitung zentriert unter der Karte, 24px-Rhythmus (.badges) */
.pdn-section--map .badges{justify-content:center}   /* Chips zentriert (Basis .badges: flex-wrap, gap:10px) */

/* cta_inline: kompakte Karten-Leiste (Mitten-Nudge). Fläche/Rahmen aus .serv-card (detail.css:372):
   #fff / 1px --line / --r / padding 34px. gap 24px aus .cards (detail.css:151). Umbruch auf schmal (flex-wrap). */
.cta-inline{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:34px}
.cta-inline p{margin:0;font-size:17px;font-weight:600;color:var(--text)}   /* 17px aus .prose p (detail.css:204); Nudge-Emphasis 600 wie .serv-card h3 */

/* certifications: zentrierte Trust-Badge-Reihe. gap:24px aus .cards (detail.css:151), Eintrag-gap:10px
   aus .badges (BP Z.388). Label 14.5px/--text-mute aus .serv-card p (BP Z.372). Bild max-height:64px
   (mechanisch, nicht-quadratisches Badge, kein Letterboxing). Icon-Fallback-Medaillon token-basiert
   (bg .badge Z.389, --navy) — real inaktiv (Bild gewinnt); 64px/28px mechanisch fuer den Fallback. */
.certs{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:24px}
.cert{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.cert img{display:block;max-height:64px;width:auto;height:auto;object-fit:contain}
.cert__label{font-size:14.5px;font-weight:500;color:var(--text-mute)}
.cert__ic{display:grid;place-items:center;width:64px;height:64px;border-radius:14px;background:rgba(46,80,144,.08);color:var(--navy)}
.cert__ic i{font-size:28px;line-height:1}

/* timeline (.timeline/.tl-item/.tl-marker/.tl-body) -> promotet nach redesign-detail.css
   (geteilt: Page-Dispatcher + CPT-Singles). Hier bewusst entfernt, nicht duplizieren. */

/* Tabs (tabs-Typ): Boilerplate-ARIA-Muster (Z.319-325), gescoped auf .pdn-section--tabs, um die
   Legacy-Regeln in style.css:8956 ([data-tab]{--pdn-text-secondary} + [data-tab].active{--pdn-primary}
   inkl. ::after) zu schlagen — main.js togglet .active, unsere Tabs tragen data-tab. 0,2,0/0,3,0 > Legacy.
   Aktiv via aria-selected -> --navy Text + oranger 2px-Unterstrich. Umschaltung: main.js initTabs(). */
.pdn-section--tabs .tabs{display:flex;flex-wrap:wrap;gap:30px;border-bottom:1px solid var(--line);margin-bottom:34px}   /* BP Z.319 */
.pdn-section--tabs .tab{position:relative;background:none;border:none;padding:0 0 14px;cursor:pointer;font-family:var(--font-body);font-size:15px;font-weight:600;color:var(--text-mute);transition:color .25s}   /* BP Z.320 (0,2,0 > [data-tab] 0,1,0) */
.pdn-section--tabs .tab:hover{color:var(--navy)}   /* BP Z.321 */
.pdn-section--tabs .tab[aria-selected="true"]{color:var(--navy)}   /* BP Z.322 (0,3,0 > [data-tab].active 0,2,0) */
.pdn-section--tabs .tab[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--orange)}   /* BP Z.323 */
.pdn-section--tabs .tab-panel:not(.active){display:none}   /* Angleich an main.js-.active-Toggle (BP nutzt [hidden]) */
.pdn-section--tabs .tab-panel p{font-size:17px;color:var(--text-mute)}   /* BP Z.325 */
.pdn-section--tabs .tab-panel h3{font-size:21px;color:var(--navy);font-family:var(--font-display);font-weight:600;margin-bottom:10px}   /* Subtitle-Heading: .serv-card h3-Werte (BP Z.253), gegen Heading-Falle */
.pdn-section--tabs .tab-panel img{display:block;max-width:100%;height:auto;border-radius:var(--r);margin-top:20px}   /* optionales Bild responsiv/getokt */
