/* Produktdetailseite, gemeinsame Regeln Kurs und Fernlehrgang (aus v92-gemeinsam.css, Stand 08.10.2026). */
/* Gemeinsame Bauteile V9.2 (Eigentümer: Kurs-Agent). FL-Agent bindet ein, ändert nicht.
   Quelle: PLAN-produktseite.md Teil 18 (03.10.2026). Nur Tokens der Seite (var(--...)), keine neuen Farben.
   Eingebunden per <link rel="stylesheet" href="v92-gemeinsam.css"> direkt vor </head>, kommt also NACH dem Inline-CSS
   #pdp-design und gewinnt bei gleicher Spezifität. Seitenspezifisches (Terminliste, Pakete) steht nicht hier.

   MARKUP-VERTRAG (damit beide Seiten dieselben Klassen nutzen)

   1 Erfahrungen-Bühne (R8, D31)
     <section id="Erfahrungen" class="pdp-s pdp-s--flaeche pdp-s--beige pdp-beweis">
       <div class="container">
         <div class="pdp-erfahrungen__kopf">
           <h2 class="pdp-titel pdp-titel--buehne">Das sagen Pflegekräfte, die es <span class="hb-mark">geschafft</span> haben</h2>
           <p class="pdp-erfahrungen__beleg"><span class="pdp-sterne-reihe">5 x .pdp-stern</span><span>4,8 von 5 · 2.774 Bewertungen auf fünf Portalen</span></p>
           <p class="pdp-erfahrungen__lead">Ein Satz ohne Namen.</p>
         </div>
         <p class="pdp-erfahrungen__label">optional: kleine Zeile über den Videos (z. B. „Absolventinnen im Fernlehrgang“)</p>
         <div class="pdp-beweis__reihe"> ...3 Videos (.pdp-videos)... </div>
         <ul class="pdp-stimmen"> ...Rezensionskarten... </ul>
         <div class="pdp-noten"> ...siehe 2... </div>
         <div class="pdp-ehrlich"><figure class="pdp-kritik"> ... </figure></div>
         <div class="pdp-siegel"> ... </div>
         <div class="pdp-beweis__aktionen"> ... </div>
       </div>
     </section>

   2 Notenkarte (R4): zweispaltig, links Zahl, Portale, Teilnoten, rechts Google-Verteilung, mobil einspaltig
     <div class="pdp-noten">
       <div class="pdp-noten__links">
         <div class="pdp-noten__gross"><p class="pdp-noten__zahl">4,8</p><div><span class="pdp-sterne-reihe">…</span><p class="pdp-klein">aus 2.774 Bewertungen auf fünf Portalen (Trustami)</p></div></div>
         <p class="pdp-noten__portal"><strong>Fernstudiumcheck</strong> 4,6 von 5 · …</p> (beliebig viele)
         <div class="pdp-noten__balken"><div class="pdp-noten__balken-zeile"><span>Flexibilität</span><span class="pdp-noten__balken-spur"><span style="width:98%"></span></span><span>4,9</span></div> … </div>
       </div>
       <div class="pdp-noten__rechts pdp-verteilung"><p class="pdp-verteilung__kopf"><strong>Google: 4,4 von 5</strong> aus 222 Rezensionen</p> 5 x .pdp-verteilung__zeile</div>
       <p class="pdp-klein pdp-noten__fuss">Stand …</p>
     </div>

   3 Arbeitgeber-Nachricht (18.4, R9)
     <details class="pdp-ag" id="arbeitgeber" data-ag data-ag-betreff="…" data-frist="28.11.2026">
       <summary class="button button_transparent icon-bg-yellow" data-messen="hoeher_pdp_arbeitgeber"><span>Nachricht an Deinen Arbeitgeber</span></summary>
       <div class="pdp-ag__box">
         <p class="pdp-ag__intro">…</p>
         <div class="pdp-ag__land"><label for="ag-land">Wo arbeitest Du? (freiwillig)</label><select id="ag-land" data-ag-land><option value="">Bitte wählen</option><option value="…" data-programm="Satz">…</option></select></div>
         <div class="pdp-ag__text" data-ag-text><p class="pdp-ag__betreff"><strong>Betreff:</strong> <span data-ag-betreff-text>…</span></p><p>…</p><p data-ag-programm hidden></p><p>…</p></div>
         <div class="pdp-ag__aktionen"><button type="button" class="button button_light" data-ag-kopieren><span>Text kopieren</span></button><a class="button button_light" data-ag-mail href="mailto:…"><span>Als E-Mail öffnen</span></a></div>
         <p class="pdp-ag__status pdp-klein" role="status" aria-live="polite"></p>
       </div>
     </details>

   4 Nicole-Zeile (R7, D38)  .pdp-callout.pdp-callout--zeile mit Desktop- und Mobil-Aktion
     <div class="pdp-callout__aktion">
       <div class="pdp-callout__desktop"><a class="pdp-callout__nummer" href="tel:…">03493 51560</a><a class="button button_light" href="https://www.hoeher-akademie.de/kursberatung/"><span>Beratung anfragen</span></a></div>
       <a class="button button_light pdp-callout__mobil" href="tel:…"><span>Nicole anrufen</span></a>
     </div>

   5 KI-Label per HTML (D22): im Bildcontainer (.pdp-motiv, position:relative) <span class="pdp-ki-label">KI-generiert</span>, Alt beginnt mit „KI-generiert:“. */

/* ---------- 0 Typografie und Rhythmus (18.5) ----------------------------------------------------------------- */
/* D06 Waisenzeilen: pretty für Fließtext, balance für Überschriften. :where() hält die Spezifität bei null,
   jede Klassenregel (z. B. .pdp-kaufbox__risiko) behält Vorrang. */
:where(.pdp) :where(p,li,dd,figcaption,summary){text-wrap:pretty}
:where(.pdp) :where(h1,h2,h3,h4,.pdp-band__f){text-wrap:balance}

/* D01 Hero-H1 Desktop eine Stufe größer (gemessen: 3 Zeilen), mobil bleibt --schrift-h2 */
@media (min-width:992px){
	.pdp .pdp-hero__titel{font-size:var(--schrift-h1);line-height:1.12;max-width:15em}
	/* D11 Text und Menschen-Zeile stehen als Block mittig zur Kaufbox, keine leere Fläche unter den Punkten */
	.pdp .pdp-hero__raster{align-items:center;grid-template-rows:1fr auto auto 1fr}
	.pdp .pdp-hero__text{grid-column:1;grid-row:2}
	.pdp .pdp-hero__folgt{align-self:start;grid-column:1;grid-row:3}
	.pdp .pdp-kaufbox{align-self:start;grid-column:2;grid-row:1 / span 4}
}

/* D09 Sektionsrhythmus: 96 px Desktop, 64 px mobil für Farbflächen, 48 px Weiß auf Weiß */
.pdp-s#Ablauf{padding-top:var(--pdp-luft)}
.pdp .pdp-band{padding-block:var(--pdp-luft)}
.pdp .pdp-faq.faq-mini-section{padding-top:calc(var(--pdp-luft) / 2)}
@media (max-width:767px){
	.pdp .pdp-band,.pdp .pdp-s--flaeche{padding-block:64px}
}

/* D32 Schlusssatz im Band ist der größte Satz der Sektion, die Größe trägt die Betonung (kein hb-mark mehr) */
.pdp .pdp-band__schluss{font-size:var(--schrift-h1);line-height:1.1;margin-top:32px}
.pdp .pdp-band__wende{max-width:600px;text-wrap:balance}

/* D02 Rowan nie unter 24 px: Xenia-Zitat 24, Stimme der Beratungsbox DM Sans 16/600 */
.pdp .pdp-band__zitat{max-width:420px}
.pdp .pdp-band__zitat p{font-size:var(--schrift-h4);line-height:1.35}
.pdp .pdp-beratung__stimme p{font-family:var(--font4);font-size:var(--schrift-16);font-weight:600;line-height:1.5}

/* D03 Fließtext nie unter 16 px: Zitate, Info-Karte, Gegenwert, Antwort auf Kritik. 14 px bleibt für Quelle, Datum, Meta. */
.pdp .pdp-stimmen .rez__zitat,.pdp .pdp-info__text p,.pdp .pdp-kaufbox__gegenwert,.pdp .pdp-termine__kein,.pdp .pdp-kritik__antwort p,.pdp .pdp-paket__hinweis,.pdp .pdp-vorteil p{font-size:var(--schrift-16);line-height:1.5}
.pdp .pdp-kritik__antwort .pdp-kritik__von{font-size:var(--schrift-14)}

/* D04/D05 Zeilenlängen: Freitext 20 px bei 700 px (ca. 75 Zeichen), Aufklapper 62ch, Transkript 70ch, Kritik 760 px */
@media (min-width:768px){
	.pdp .pdp-freitext__inhalt{max-width:700px}
	.pdp .pdp-freitext__inhalt :is(p,ul,ol,li,td,th){font-size:var(--schrift-20);line-height:1.6}
	.pdp .pdp-freitext__inhalt ul li::before{top:12px}
}
.pdp .pdp-auf__inhalt > *{max-width:62ch}
.pdp .pdp-transkript dd{max-width:70ch}
.pdp .pdp-kritik{max-width:760px}

/* D17 Bildunterschriften: eine weiße Pille (Radius 100, 14 px/500) statt Glas oder dunkler Pille */
.pdp .pdp-band__abspielen{background:var(--background-white);color:var(--typography-black)}
.pdp .pdp-band__abspielen .pdp-band__play{background:var(--typography-black)}
.pdp .pdp-band__abspielen .pdp-band__play svg{fill:var(--background-white)}

/* D13 Beratungsbox auf Orange 100 (Entscheidungsfläche) */
.pdp #Begleitung{--bg-color:var(--orange-100)}

/* D07 Aktionspreis: Rowan nie fett (Bestands-CSS setzt 700), Streichpreis in der Skala */
.pdp .hx-aktion-preis__neu{font-weight:400}
.pdp .hx-aktion-preis__alt{color:var(--typography-dark-grey);font-family:var(--font4);font-size:var(--schrift-16);font-weight:400;margin-left:.5em}
.pdp .pdp-paket__preis .hx-aktion-preis__alt{display:block;margin-left:0}

/* D37 Telefonlinks: mindestens 44 px Tippfläche. Im Fließtext wächst die Fläche, nicht die Zeile. */
.pdp .pdp-tel{align-items:center;display:inline-flex;min-height:44px}
.pdp .pdp-kaufbox__team .pdp-tel{min-height:44px}
.pdp .pdp-klein .pdp-tel{margin-block:-12px}
.pdp :is(.pdp-termine__kein,.pdp-band__aktion .pdp-klein,.pdp-info__text,.pdp-klein) a[href^="tel:"]:not(.button):not(.pdp-tel){display:inline-block;margin-block:-13px;padding-block:13px}

/* ---------- 1 Erfahrungen-Bühne (R8, D31) --------------------------------------------------------------------- */
.pdp .pdp-erfahrungen__kopf{margin:0 auto 56px;text-align:center}
.pdp .pdp-titel--buehne{font-size:var(--schrift-h1);line-height:1.12;margin-inline:auto;max-width:15em;text-wrap:balance}
.pdp .pdp-erfahrungen__beleg{align-items:center;color:var(--typography-black);display:flex;flex-wrap:wrap;font-family:var(--font4);font-size:var(--schrift-16);font-weight:600;gap:4px 10px;justify-content:center;margin:20px 0 0}
.pdp .pdp-erfahrungen__beleg .pdp-sterne-reihe{margin:0}
.pdp .pdp-erfahrungen__beleg .pdp-stern{height:18px;width:18px}
.pdp .pdp-erfahrungen__lead{color:var(--typography-dark-grey);font-family:var(--font4);font-size:var(--schrift-20);line-height:1.6;margin:12px auto 0;max-width:560px}
.pdp .pdp-erfahrungen__label{color:var(--typography-dark-grey);font-family:var(--font4);font-size:var(--schrift-16);line-height:1.5;margin:0 0 20px;text-align:center}
.pdp .pdp-erfahrungen__label strong{color:var(--typography-black);font-weight:600}
@media (max-width:767px){
	.pdp .pdp-erfahrungen__kopf{margin-bottom:28px}
	.pdp .pdp-erfahrungen__beleg{font-size:var(--schrift-14)}
	.pdp .pdp-erfahrungen__beleg .pdp-stern{height:16px;width:16px}
	.pdp .pdp-erfahrungen__lead{font-size:var(--schrift-16);line-height:1.5}
	.pdp .pdp-erfahrungen__label{margin-bottom:16px}
}

/* ---------- 2 Notenkarte (R4) -------------------------------------------------------------------------------- */
.pdp .pdp-noten{background:var(--background-white);border-radius:20px;column-gap:56px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin-top:40px;padding:40px;row-gap:24px}
.pdp .pdp-noten__links{display:flex;flex-direction:column;gap:12px}
.pdp .pdp-noten__gross{align-items:center;display:flex;gap:20px}
.pdp .pdp-noten__gross .pdp-sterne-reihe{margin:0 0 6px}
.pdp .pdp-noten__zahl{color:var(--typography-black);font-family:var(--font3);font-size:var(--schrift-h1);font-weight:400;line-height:1;margin:0}
.pdp .pdp-noten__portal{color:var(--typography-dark-grey);font-family:var(--font4);font-size:var(--schrift-16);line-height:1.5;margin:0}
.pdp .pdp-noten__portal strong{color:var(--typography-black);font-weight:600}
.pdp .pdp-noten__balken{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.pdp .pdp-noten__balken-zeile{align-items:center;display:grid;gap:10px;grid-template-columns:96px minmax(0,1fr) 32px}
.pdp .pdp-noten__balken-zeile span:first-child{color:var(--typography-dark-grey);font-family:var(--font4);font-size:var(--schrift-14)}
.pdp .pdp-noten__balken-zeile span:last-child{color:var(--typography-black);font-family:var(--font4);font-size:var(--schrift-14);font-weight:600;text-align:right}
.pdp .pdp-noten__balken-spur{background:var(--background-borders);border-radius:100px;display:block;height:6px;overflow:hidden}
.pdp .pdp-noten__balken-spur span{background:var(--orange-300);border-radius:100px;display:block;height:100%}
.pdp .pdp-noten__rechts.pdp-verteilung{background:none;border-left:var(--pdp-linie);border-radius:0;padding:0 0 0 56px}
.pdp .pdp-noten__rechts .pdp-verteilung__kopf{font-size:var(--schrift-16);margin-bottom:16px}
.pdp .pdp-noten__fuss{grid-column:1 / -1;margin:0}
@media (max-width:991px){
	.pdp .pdp-noten{column-gap:32px;padding:32px 28px}
	.pdp .pdp-noten__rechts.pdp-verteilung{padding-left:32px}
}
@media (max-width:767px){
	.pdp .pdp-noten{grid-template-columns:minmax(0,1fr);margin-top:24px;padding:22px 20px;row-gap:20px}
	.pdp .pdp-noten__rechts.pdp-verteilung{border-left:0;border-top:var(--pdp-linie);padding:20px 0 0}
	.pdp .pdp-noten__balken-zeile{grid-template-columns:104px minmax(0,1fr) 32px}
}

/* ---------- 3 Arbeitgeber-Nachricht (18.4) ------------------------------------------------------------------- */
.pdp .pdp-ag{min-width:0}
.pdp .pdp-ag > summary{cursor:pointer;display:inline-flex;list-style:none;margin:0}
.pdp .pdp-ag > summary::-webkit-details-marker{display:none}
.pdp .pdp-ag > summary::after{content:none}
.pdp .pdp-ag[open] > summary span:before{transform:translateY(-50%) rotate(90deg)}
.pdp .pdp-ag > summary:focus-visible{outline:2px solid var(--typography-black);outline-offset:2px}
.pdp .pdp-ag__box{background:var(--background-white);border-radius:20px;margin-top:16px;padding:24px}
.pdp .pdp-ag__intro{color:var(--typography-dark-grey);font-family:var(--font4);font-size:var(--schrift-16);line-height:1.5;margin:0 0 16px;max-width:62ch}
.pdp .pdp-ag__land{align-items:center;display:flex;flex-wrap:wrap;gap:8px 12px;margin:0 0 20px}
.pdp .pdp-ag__land label{color:var(--typography-black);font-family:var(--font4);font-size:var(--schrift-16);font-weight:600}
.pdp .pdp-ag__land select{
	appearance:none;background:var(--background-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='9' viewBox='0 0 15 9' fill='none'%3E%3Cpath d='M1.5 1.2l5.7 6 6.3-6' stroke='%237C7C7C' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 16px center;
	border:1px solid var(--background-borders);border-radius:100px;color:var(--typography-black);cursor:pointer;font-family:var(--font4);font-size:var(--schrift-16);height:44px;max-width:100%;padding:0 44px 0 18px;
}
.pdp .pdp-ag__land select:hover{background-color:var(--orange-100);border-color:var(--primary-300)}
.pdp .pdp-ag__land select:focus-visible{outline:2px solid var(--typography-black);outline-offset:2px}
.pdp .pdp-ag__text{background:var(--background-light-beige);border-radius:16px;color:var(--typography-black);font-family:var(--font4);font-size:var(--schrift-16);line-height:1.6;padding:20px 22px;white-space:pre-line}
.pdp .pdp-ag__text p{margin:0}
.pdp .pdp-ag__text p + p{margin-top:12px}
.pdp .pdp-ag__text [hidden]{display:none}
.pdp .pdp-ag__text a{color:inherit;text-decoration:underline;text-decoration-color:var(--orange-400);text-decoration-thickness:2px;text-underline-offset:3px}
.pdp .pdp-ag__aktionen{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.pdp .pdp-ag__aktionen .button{margin:0;width:auto}
/* <button class="button button_light"> wird vom Theme grau und fett gestylt, <a class="button button_light"> korrekt: Button wie der Link */
.pdp .pdp-ag__aktionen button.button.button_light{background:var(--background-white);border:1px solid var(--background-borders);border-radius:24px;color:var(--typography-black);cursor:pointer;font-family:var(--font8);font-size:var(--schrift-14);font-weight:400;letter-spacing:-.02em;line-height:16px;padding:0 24px;text-transform:uppercase}
.pdp .pdp-ag__aktionen button.button.button_light:hover{background:var(--orange-100);border-color:var(--primary-300)}
.pdp .pdp-ag__status{margin:8px 0 0;min-height:1.5em}
.pdp .pdp-ag__status:empty{margin:0;min-height:0}
@media (max-width:767px){
	.pdp .pdp-ag__box{padding:18px 16px}
	.pdp .pdp-ag__text{padding:16px}
	.pdp .pdp-ag__aktionen .button{width:100%}
	.pdp .pdp-ag__land select{width:100%}
}

/* ---------- 4 Nicole-Zeile (R7, D38) -------------------------------------------------------------------------- */
/* Zeile unverändert aus fernlehrgang-design.html V9.1 (.pdp-callout--zeile), dazu die Umschaltung Desktop/Mobil */
.pdp-kauf .pdp-callout.pdp-callout--zeile{background:none;border-radius:0;border-top:1px solid var(--orange-200);gap:12px 16px;grid-template-areas:none;grid-template-columns:48px minmax(0,1fr) auto;margin-top:32px;padding:24px 0 0}
.pdp-callout--zeile > div:not(.pdp-callout__aktion){display:block}
.pdp-callout--zeile .pdp-callout__frage{font-family:var(--font4);font-size:var(--schrift-16);grid-area:auto;line-height:1.45}
.pdp-callout--zeile .pdp-callout__frage strong{font-weight:600}
.pdp-callout--zeile .pdp-callout__meta{grid-area:auto;margin:2px 0 0}
.pdp .pdp-callout--zeile .pdp-callout__bild{grid-area:auto;height:48px;width:48px}
.pdp-callout--zeile .pdp-callout__aktion{grid-area:auto}
@media (max-width:991px){
	.pdp-kauf .pdp-callout.pdp-callout--zeile{grid-template-columns:48px minmax(0,1fr)}
	.pdp-callout--zeile .pdp-callout__aktion{grid-column:1 / -1}
}
@media (max-width:767px){
	.pdp-kauf .pdp-callout.pdp-callout--zeile{margin-top:20px;padding-top:16px}
	.pdp-callout--zeile .pdp-callout__meta{display:none}
}
/* Desktop: Nummer als Link 20/600 plus „Beratung anfragen“. Mobil (hover:none oder unter 768 px): ein Knopf „Nicole anrufen“. */
.pdp .pdp-callout__desktop{align-items:center;display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:flex-end}
.pdp .pdp-callout__aktion .pdp-callout__mobil{display:none}
.pdp a.pdp-callout__nummer{align-items:center;display:inline-flex;font-size:var(--schrift-20);font-weight:600;min-height:44px;text-decoration:underline;text-decoration-color:var(--orange-400);text-decoration-thickness:2px;text-underline-offset:4px}
@media (hover:none),(max-width:767px){
	.pdp .pdp-callout__aktion .pdp-callout__desktop{display:none}
	.pdp .pdp-callout__aktion .pdp-callout__mobil{display:inline-flex;width:100%}
	.pdp .pdp-callout--zeile .pdp-callout__aktion{width:100%}
}

/* ---------- 5 KI-Label per HTML (D22) ------------------------------------------------------------------------- */
.pdp .pdp-ki-label{
	background:var(--background-white);border-radius:100px;bottom:12px;color:var(--typography-black);font-family:var(--font4);
	font-size:var(--schrift-12);font-weight:500;left:12px;line-height:1;padding:6px 12px;pointer-events:none;position:absolute;z-index:2;
}

/* ---------- 6 Freitext mobil: Aufklapper-Optik wie FAQ, erste zwei Abschnitte offen (C32, D18) ------------------ */
/* Verhalten: Theme-Skript MobileAccordion. Im Theme den Selektor von h2 auf h2,h3 erweitern, weil die WBÜ-Zwischenüberschriften
   im DOM h3 sind (S-05). Optik hier an .pdp-auf angeglichen (Hellbeige, Radius 20, DM Sans 16/600, Plus und Kreuz). */
.pdp .pdp-freitext__inhalt .pdp-fh{
	color:var(--typography-black);font-family:var(--font3);font-size:var(--schrift-h4);font-weight:400;line-height:1.3;
	margin:32px 0 10px;hyphens:auto;overflow-wrap:break-word;
}
.pdp .pdp-freitext__inhalt .pdp-fh:first-child{margin-top:0}
@media (max-width:767px){
	.pdp .pdp-freitext__inhalt .accordion-header{
		background:var(--background-light-beige);border:0;border-radius:20px;cursor:pointer;font-family:var(--font4);font-size:var(--schrift-16);font-weight:600;
		hyphens:none;line-height:1.5;margin:0 0 12px!important;min-height:56px;padding:14px 52px 14px 16px;position:relative;
	}
	.pdp .pdp-freitext__inhalt .accordion-header.active{border-radius:20px 20px 0 0;margin-bottom:0!important}
	.pdp .pdp-freitext__inhalt .accordion-header:after{background:url(https://www.hoeher-akademie.de/wp-content/themes/hoher/frontend/src/icons/plus.svg) no-repeat 50%;content:"";height:16px;position:absolute;right:20px;top:50%;transform:translateY(-50%);width:16px}
	.pdp .pdp-freitext__inhalt .accordion-header.active:after{background-image:url(https://www.hoeher-akademie.de/wp-content/themes/hoher/frontend/src/icons/xmark.svg)}
	.pdp .pdp-freitext__inhalt .accordion-content{background:var(--background-light-beige);border:0;border-radius:0 0 20px 20px;margin:0 0 12px;overflow:hidden;padding:0 16px}
	.pdp .pdp-freitext__inhalt .accordion-content.open{padding-bottom:20px}
	.pdp .pdp-freitext__inhalt .accordion-content:last-child{border-bottom:0;margin-bottom:0}
}

/* ===== V9.3 (03.10.2026) ===== */
/* 1 Siegelband mit sechs Einträgen (Kurs): auf Desktop zu breit für Bild und Text nebeneinander, deshalb ab 768 px
   sechs gleiche Spalten (Bild über Text, Text darf umbrechen), eine Zeile. Mobil bleibt es bei zwei Spalten in drei Reihen. */
@media (min-width:768px){
	.pdp-siegelband__liste:has(> li:nth-child(6)){display:grid;grid-template-columns:repeat(6,minmax(0,1fr))}
	.pdp-siegelband__liste:has(> li:nth-child(6)) .pdp-siegelband__item{flex-direction:column;gap:8px;padding:4px 12px;text-align:center}
	.pdp-siegelband__liste:has(> li:nth-child(6)) .pdp-siegelband__text{align-items:center}
	.pdp-siegelband__liste:has(> li:nth-child(6)) .pdp-siegelband__text strong,.pdp-siegelband__liste:has(> li:nth-child(6)) .pdp-siegelband__text span{white-space:normal}
}

/* 4 Kritische Stimme: Karte links (7/12), echtes Foto rechts (5/12), gleiche Höhe. Mobil Bild unter der Karte, 200 px hoch. */
.pdp .pdp-ehrlich .pdp-kritik{max-width:none}
.pdp .pdp-ehrlich__bild{border-radius:20px;margin:0;min-height:240px;overflow:hidden;position:relative}
.pdp .pdp-ehrlich__bild img{display:block;height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}
.pdp .pdp-ehrlich__bildtext{
	background:var(--background-white);border-radius:100px;bottom:16px;color:var(--typography-black);font-family:var(--font4);font-size:var(--schrift-14);
	font-weight:500;left:16px;line-height:1.3;max-width:calc(100% - 32px);padding:8px 16px;position:absolute;
}
@media (min-width:768px){
	.pdp .pdp-ehrlich{align-items:stretch;gap:12px 24px;grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
	.pdp .pdp-ehrlich__kopf{grid-column:1 / -1}
}
@media (max-width:767px){
	.pdp .pdp-ehrlich{gap:12px}
	.pdp .pdp-ehrlich__bild{height:200px;min-height:0}
	.pdp .pdp-ehrlich__bildtext{bottom:12px;font-size:var(--schrift-12);left:12px;max-width:calc(100% - 24px)}
}

/* 5 Beratungsbox: Heartbeat-Scribble (Asset scribble-orange.svg, Orange 300 auf Orange 100) liegend hinter dem Freisteller, links und oben angeschnitten,
   Textseite frei. Gleiches Bauteil wie in der Team-Bühne (.pdp-scribble). */
.pdp #Begleitung > .container{position:relative;z-index:1}
@media (max-width:991px){
}
@media (max-width:767px){
}

/* 7 Zeitleiste: Team der Schulung (Kursbetreuung bzw. Abteilung Fernstudium) als Freisteller auf Orange 100, Satz oben, Namenspillen
   über der Schnittkante unten (Foto am Hüftansatz beschnitten). Pillen je Person, Rolle in der zweiten Zeile. Mobil nach der Zeitleiste. */
.pdp .pdp-ablauf__team{
	align-items:center;align-self:center;background:var(--orange-100);border-radius:20px;display:flex;flex-direction:column;
	margin:0;overflow:hidden;padding:32px 24px 0;position:relative;
}
.pdp .pdp-ablauf__satz{color:var(--typography-black);font-family:var(--font4);font-size:var(--schrift-16);line-height:1.5;margin:0 0 24px;max-width:420px;text-align:center}
.pdp .pdp-ablauf__team img{display:block;height:auto;max-width:440px;width:100%}
.pdp .pdp-ablauf__team--kurs img{max-width:290px}
/* Heartbeat-Scribble (Asset scribble-orange.svg, Orange 300 auf Orange 100) liegend hinter den Freistellern, rechts angeschnitten; Satz, Foto und Namenspillen liegen darüber. */
.pdp .pdp-ablauf__satz,.pdp .pdp-ablauf__team img:not(.pdp-scribble){position:relative;z-index:1}
.pdp .pdp-ablauf__namen{z-index:2}
.pdp .pdp-ablauf__team .pdp-ablauf__scribble{bottom:auto;left:auto;max-width:none;right:-250px;top:70px;transform:rotate(14deg);width:520px}
.pdp .pdp-ablauf__namen{bottom:16px;display:flex;gap:8px;justify-content:center;left:16px;list-style:none;margin:0;padding:0;position:absolute;right:16px}
.pdp .pdp-ablauf__namen li{
	background:var(--background-white);border-radius:18px;color:var(--typography-black);flex:1 1 0;font-family:var(--font4);font-size:var(--schrift-14);
	line-height:1.3;max-width:200px;min-width:0;padding:8px 12px;text-align:center;
}
.pdp .pdp-ablauf__namen strong{display:block;font-weight:600}
.pdp .pdp-ablauf__namen span{color:var(--typography-dark-grey);display:block;font-size:var(--schrift-12)}
.pdp .pdp-ablauf__team--kurs .pdp-ablauf__namen{left:50%;right:auto;transform:translateX(-50%);width:min(100% - 32px,420px)}
@media (min-width:768px) and (max-width:991px){
	.pdp .pdp-ablauf__team{order:-1}
}
@media (max-width:767px){
	.pdp .pdp-ablauf__team{padding-top:24px}
	.pdp .pdp-ablauf__team img{max-width:360px}
	.pdp .pdp-ablauf__team--kurs img{max-width:250px}
	.pdp .pdp-ablauf__team .pdp-ablauf__scribble{right:-230px;top:110px;width:440px}
	.pdp .pdp-ablauf__namen li{font-size:var(--schrift-12);padding:6px 8px}
	.pdp .pdp-ablauf__namen span{font-size:var(--schrift-12)}
}

/* 8 Videos in den Erfahrungen: Block hoeher-video-testimonials als wischbare Reihe (scroll-snap, ohne JS wischbar), Punkte aus reihe.js.
   Desktop drei Karten sichtbar, Tablet zwei, mobil eine Karte plus Anschnitt der nächsten. */
.pdp .pdp-beweis__reihe.vt--js{gap:0}
.pdp .pdp-beweis__reihe.vt--js .video-testimonials__grid{
	display:flex;gap:24px;margin:0;overflow-x:auto;padding:4px 4px 16px;scroll-padding-inline:4px;scroll-snap-type:x mandatory;width:100%;
}
.pdp .pdp-beweis__reihe.vt--js .vt-card{flex:0 0 min(84vw,340px);min-width:min(84vw,340px);scroll-snap-align:start}
@media (min-width:768px){
	.pdp .pdp-beweis__reihe.vt--js .vt-card{flex-basis:calc((100% - 40px) / 2);min-width:calc((100% - 40px) / 2)}
}
@media (min-width:992px){
	.pdp .pdp-beweis__reihe.vt--js .vt-card{flex-basis:calc((100% - 56px) / 3);min-width:calc((100% - 56px) / 3)}
}
.pdp .pdp-beweis__reihe .hb-reihe-nav{margin-top:16px}
.pdp .vt-card__wer{color:var(--typography-black);font-family:var(--font4);font-size:var(--schrift-16);font-weight:600;line-height:1.4;margin:0}
.pdp .vt-card__wer span{color:var(--typography-dark-grey);display:block;font-size:var(--schrift-14);font-weight:400}
.pdp .vt-card{gap:10px}

/* 6 Siegelwand unten in den Erfahrungen: als Gruppe mittig, Abstand 40 px, mobil umbrechen und zentriert */
.pdp .pdp-siegel__logos{gap:16px 40px;justify-content:center}
@media (max-width:767px){
	.pdp .pdp-siegel__logos{flex-wrap:wrap;gap:16px 24px;justify-content:center}
}

/* ===== V9.3 Schlussdurchgang (Hauptsitzung, 03.10.2026) =====
   1 Bühnen-Headline nie trennen („ge-schafft“ mobil); 2 Arbeitgeber-Link in der Info-Karte mobil wirklich aus
   (Theme-.button überstimmte die V9.2-Regel); 3 Video-Vorschau als Gesichtsausschnitt 4:5 wie V9.2: die
   YouTube-Bilder tragen links eingebrannten Text, der mit dem Play-Kreis kollidierte. */
.pdp .pdp-titel--buehne,.pdp .pdp-titel--buehne .hb-mark{hyphens:manual;-webkit-hyphens:manual;overflow-wrap:normal;word-break:normal}
@media (max-width:991px){.pdp .pdp-kaufbox--info [data-ag-oeffnen]{display:none !important}}
.pdp .vt-card__thumb{aspect-ratio:4/5;overflow:hidden}
.pdp .vt-card__thumb img{height:100%;object-fit:cover;object-position:100% 30%;transform:scale(1.3);transform-origin:100% 40%;width:100%}

/* ---------- 6 Video-Overlay (V9.4, Denis 03.10.2026: Videos spielen innerhalb der Seite) ---------------------------------
   Markup-Vertrag: <a href="https://www.youtube.com/watch?v=ID" target="_blank" rel="noopener" data-messen="hoeher_pdp_video" data-ort="hero|band|erfahrungen" data-video-id="ID" aria-label="Video auf YouTube ansehen: …">
   Ein kleines Inline-Skript (je Seite gleicher Code) setzt beim Klick <div class="pdp-vo" role="dialog"> mit dem Iframe youtube-nocookie.com/embed/ID?autoplay=1 ein.
   Ohne JavaScript bleibt der Link zu YouTube. Hintergrund: Token --typography-black abgedunkelt, Schließen-Knopf = .button button_light. */
html.pdp-vo-offen{overflow:hidden}
.pdp-vo{align-items:center;display:flex;inset:0;justify-content:center;padding:24px;position:fixed;z-index:100010}
.pdp-vo::before{background:var(--typography-black);content:"";inset:0;opacity:.86;position:absolute}
.pdp-vo__fenster{display:flex;flex-direction:column;gap:12px;max-width:min(1040px,calc((100vh - 130px) * 16 / 9));position:relative;width:100%}
.pdp-vo__kopf{align-items:center;display:flex;gap:16px;justify-content:space-between}
.pdp-vo__titel{color:var(--background-white);font-family:var(--font4);font-size:var(--schrift-16);font-weight:600;line-height:1.4;margin:0;min-width:0}
.pdp-vo__kopf .button{flex:0 0 auto}
.pdp-vo__rahmen{aspect-ratio:16/9;background:var(--typography-black);border-radius:12px;overflow:hidden;width:100%}
.pdp-vo__rahmen iframe{border:0;display:block;height:100%;width:100%}
@media (max-width:767px){
	.pdp-vo{padding:0}
	.pdp-vo__fenster{gap:10px;max-width:none}
	.pdp-vo__kopf{padding:0 16px}
	.pdp-vo__titel{-webkit-box-orient:vertical;-webkit-line-clamp:2;display:-webkit-box;font-size:var(--schrift-14);overflow:hidden}
	.pdp-vo__rahmen{border-radius:0}
}

/* =====================================================================
   V9.5 Feinschliff (03.10.2026, Denis: „nicht die Farben, aber Abstände, welche Höhe, nochmal drüber polishen“).
   Nur Abstände, Höhen, Radien, Ausrichtung, Zeilenlängen, Tippflächen. Keine Farben, Texte, Schriften, Bilder.
   Maßstab: ux-standards.md Kap. 15 und 8-px-Raster (8/16/24/32/40/48/64/96).
   Token-Regeln:
   --pdp-h2-luft   Titel(gruppe) zu Inhalt: 40 px Desktop, 28 px mobil, überall gleich
   --pdp-feld      Sektion mit eigener Fläche bzw. Weiß neben Fläche: 96 px Desktop, 64 px mobil
   --pdp-pad-s/m/l Kartenpaddings: Desktop 24/40/64, Tablet 24/32/40, mobil 20/24/32 (s: Kaufbox, Info, Datenblatt, Rezension,
                   Kritik, Arbeitgeber-Box; m: Termin-/Notenkarte, Transkript; l: Bühnen)
   ===================================================================== */
.pdp{--pdp-h2-luft:40px;--pdp-feld:96px;--pdp-pad-s:24px;--pdp-pad-m:40px;--pdp-pad-l:64px}
@media (max-width:991px){.pdp{--pdp-pad-m:32px;--pdp-pad-l:40px}}
@media (max-width:767px){.pdp{--pdp-h2-luft:28px;--pdp-feld:64px;--pdp-pad-s:20px;--pdp-pad-m:24px;--pdp-pad-l:32px}}

/* 1 Titelgruppe: Titel plus Lead 24 px (mobil 16), Gruppe zum Inhalt --pdp-h2-luft */
.pdp .pdp-kopf,.pdp .pdp-kauf__kopf,.pdp .pdp-erfahrungen__kopf{margin-bottom:var(--pdp-h2-luft)}
.pdp .pdp-lead,.pdp .pdp-kauf .pdp-lead,.pdp .pdp-fakt,.pdp .pdp-faktensatz{margin-top:24px}
.pdp .pdp-erfahrungen__beleg{margin-top:16px}
.pdp .pdp-erfahrungen__lead{margin-top:16px}
.pdp .pdp-erfahrungen__label{margin-bottom:24px}
.pdp .pdp-band__zweifel{gap:16px;margin-top:var(--pdp-h2-luft)}
.pdp .pdp-band__wende{margin-top:32px}
.pdp .pdp-vorteile__liste{margin-top:var(--pdp-h2-luft)}
.pdp .pdp-foerderung__schritte{margin:var(--pdp-h2-luft) 0 32px}
@media (max-width:767px){
	.pdp .pdp-lead,.pdp .pdp-kauf .pdp-lead,.pdp .pdp-fakt,.pdp .pdp-faktensatz,.pdp .pdp-kauf__preiszeile{margin-top:16px}
	.pdp .pdp-erfahrungen__label{margin-bottom:16px}
	.pdp .pdp-foerderung__schritte{margin-bottom:24px}
}

/* 2 Sektionsrhythmus: Flächen und Weiß neben Fläche 96 (mobil 64); Weiß auf Weiß 48 plus 48 (mobil 24 plus 24);
   die Förder-Bühne steht als Bühne zwischen zwei Flächen mit 48 (mobil 32) */
.pdp .pdp-passt{padding-bottom:var(--pdp-feld)}
.pdp .pdp-kauf{padding-block:var(--pdp-feld)}
.pdp .pdp-foerderung{padding-block:48px}
.pdp .pdp-marke{padding-bottom:var(--pdp-feld)}
.pdp-s#Ablauf{padding-top:var(--pdp-feld)}
@media (min-width:992px){.pdp .pdp-hero__raster{padding-bottom:64px}}
@media (max-width:767px){
	.pdp .pdp-foerderung{padding-block:32px}
	.pdp .pdp-hero.course-hero-section{padding-top:32px}
}

/* 3 Karten: drei Paddings je Breite, Radien Karte 20 / Bühne 32 / Pille 100 */
.pdp .pdp-kaufbox,.pdp .pdp-kaufbox--info,.pdp .pdp-datenblatt,.pdp .pdp-stimmen .rez__karte,.pdp .pdp-kritik,.pdp .pdp-ag__box,.pdp .pdp-band__zitat{padding:var(--pdp-pad-s)}
.pdp .pdp-kauf__karte{padding:var(--pdp-pad-m)}
.pdp .pdp-noten,.pdp .pdp-nachlesen{padding:var(--pdp-pad-m)}
.pdp .pdp-buehne{padding:var(--pdp-pad-l)}
.pdp .pdp-foerderung__buehne{border-radius:32px;grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.pdp .pdp-foerderung__zahl{padding:var(--pdp-pad-l)}
.pdp .pdp-foerderung__inhalt{padding:var(--pdp-pad-l) var(--pdp-pad-l) var(--pdp-pad-l) 40px}
.pdp .pdp-freitext .pdp-gilt{border-radius:20px;padding:16px var(--pdp-pad-s)}
.pdp #Begleitung{border-radius:32px}
.pdp .pdp-band__foto{border-radius:20px}
.pdp .pdp-band__foto img{border-radius:12px}
.pdp .pdp-ablauf__team{padding:var(--pdp-pad-m) var(--pdp-pad-s) 0}
@media (max-width:991px){
	.pdp .pdp-buehne{padding:var(--pdp-pad-l) var(--pdp-pad-s)}
	.pdp .pdp-foerderung__buehne{grid-template-columns:minmax(0,1fr)}
	.pdp .pdp-foerderung__zahl{padding:var(--pdp-pad-l) var(--pdp-pad-s) 0}
	.pdp .pdp-foerderung__inhalt{padding:var(--pdp-pad-l) var(--pdp-pad-s)}
	.pdp .pdp-noten__rechts.pdp-verteilung{padding-left:var(--pdp-pad-m)}
}
@media (max-width:767px){
	.pdp .pdp-kauf__karte{padding:var(--pdp-pad-s)}
	.pdp .pdp-foerderung__buehne,.pdp #Begleitung{border-radius:20px}
	.pdp .pdp-foerderung__zahl{padding:var(--pdp-pad-l) var(--pdp-pad-s) 0}
	.pdp .pdp-foerderung__inhalt{padding:var(--pdp-pad-m) var(--pdp-pad-s) var(--pdp-pad-l)}
	.pdp .pdp-noten__rechts.pdp-verteilung{padding-left:0}
}

/* 4 Spalten: Datenblatt (Inhalte) und Info-Karte (Kauf) rechts gleich breit, gleiche linke Kante;
   Zeitleiste und Team-Karte oben bündig, die Karte klebt beim Scrollen */
@media (min-width:1200px){.pdp .pdp-freitext{grid-template-columns:minmax(0,1fr) 380px}}
@media (min-width:992px){.pdp .pdp-ablauf__team{align-self:start;position:sticky;top:24px}}
.pdp .pdp-ablauf__team--kurs img{max-width:380px}
.pdp .pdp-ablauf__team:not(.pdp-ablauf__team--kurs) img:not(.pdp-scribble){max-width:500px}
@media (max-width:767px){.pdp .pdp-ablauf__team--kurs img{max-width:250px}.pdp .pdp-ablauf__team:not(.pdp-ablauf__team--kurs) img:not(.pdp-scribble){max-width:360px}}
.pdp .pdp-zeit{padding-bottom:32px}
.pdp .pdp-zeit:last-child{padding-bottom:0}

/* 5 Siegelband: Texte aller Einträge starten auf einer Linie, Trennlinien gleich hoch */
.pdp .pdp-siegelband__liste{align-items:stretch;padding-block:24px}
@media (max-width:767px){.pdp .pdp-siegelband__liste{padding-block:8px}}
@media (max-width:1379px){.pdp .pdp-siegelband__item{justify-content:flex-start}}
@media (min-width:768px){.pdp .pdp-siegelband__liste:has(> li:nth-child(6)) .pdp-siegelband__item{justify-content:flex-start}}

/* 6 Kaufbox (Desktop) und Hero links: Abstände auf dem Raster */
@media (min-width:992px){
	.pdp .pdp-kaufbox__preis{margin-top:16px}
	.pdp .pdp-kaufbox__start{margin:12px 0 16px}
	.pdp .pdp-kaufbox__risiko{margin-top:16px}
	.pdp .pdp-hero__menschen{margin-top:40px}
}

/* 7 Terminliste: Monatszeile 40 oben, 16 unten; Filter 16 */
.pdp .pdp-termine__filter{margin-bottom:16px}
.pdp .pdp-terminliste .pdp-termin__monat{padding:40px 0 16px}
.pdp .pdp-terminliste .pdp-termin__monat:first-child{padding-top:8px}
@media (max-width:991px){
	.pdp .pdp-terminliste .pdp-termin__monat{padding:24px 0 8px}
	.pdp .pdp-terminliste .pdp-termin__monat:first-child{padding-top:8px}
}

/* 8 Erfahrungen: Blöcke 40 px auseinander, Raster 24 px (mobil 16) */
.pdp .pdp-stimmen{gap:24px}
.pdp .pdp-noten__links{gap:16px}
.pdp .pdp-ehrlich{margin-top:40px}
.pdp .pdp-siegel{margin-top:40px;padding-top:40px}
.pdp .pdp-beweis__reihe .hb-punkte{gap:32px;margin-top:0}
.pdp .pdp-beweis__reihe .hb-reihe-nav{margin-top:8px}
@media (max-width:767px){
	.pdp .pdp-stimmen{gap:16px}
	.pdp .pdp-ehrlich{margin-top:24px}
}

/* 9 Aufklapper (FAQ): 16 px Abstand Desktop, 8 px mobil */
.pdp .pdp-faq .faq-mini__faq-holder .pdp-auf{margin-bottom:16px}
.pdp .pdp-standzeile{margin-top:24px}
@media (max-width:767px){.pdp .pdp-faq .faq-mini__faq-holder .pdp-auf{margin-bottom:8px}}

/* 10 Zeilenlängen (60 bis 75 Zeichen): Fließtext 16 px 560 px, Kleintext 14 px 520 px */
.pdp .pdp-auf__inhalt > *,.pdp .pdp-foerderung__bedingung,.pdp .pdp-foerderung__frist,.pdp .pdp-ag__intro,.pdp .pdp-nachlesen .pdp-text{max-width:560px}
.pdp .pdp-standzeile,.pdp .pdp-noten__fuss{max-width:520px}
.pdp .pdp-transkript dd{max-width:640px}

/* 11 Tippflächen: Etikett der Auswahlliste (44 px), Pager-Punkte mit 44 px Trefferfläche (Theme-::before) ohne Überlappung */
.pdp .pdp-ag__land label{align-items:center;display:inline-flex;min-height:44px}
.pdp .pdp-foerderung__scribble{max-width:none}
.pdp .pdp-kaufbox--info .pdp-kaufbox__preis{margin-top:0}

/* Mobil: Kartenpadding 20 lässt den drei Filtern keinen Platz, deshalb laufen sie bis zum Kartenrand (kein Abschneiden der Beschriftung);
   die Info-Karte beginnt ohne verwaiste Trennlinie, solange der Preis in ihr ausgeblendet ist */
@media (max-width:767px){
	.pdp .pdp-termine__filter{flex-wrap:nowrap;gap:8px;margin-inline:calc(var(--pdp-pad-s) * -1);overflow-x:auto;padding-inline:var(--pdp-pad-s);scrollbar-width:none}
	.pdp .pdp-termine__filter > *{flex:0 0 auto}
	.pdp .pdp-termine__filter .dates-table__filter-btn{gap:4px;padding-inline:10px;width:auto}
	.pdp .pdp-termin{column-gap:12px;grid-template-areas:"datum datum knopf" "format ort knopf"}
	.pdp .pdp-terminliste .pdp-termin .pdp-termin__knopf.button{padding:0 8px 0 14px}
	.pdp .pdp-termin__ort strong{overflow-wrap:anywhere}
}
@media (max-width:991px){
	.pdp .pdp-kaufbox--info .pdp-info__text{border-top:0;margin-top:0;padding-top:0}
}
@media (max-width:767px){.pdp .pdp-zeit{padding-bottom:24px}.pdp .pdp-zeit:last-child{padding-bottom:0}}

/* Fernlehrgang: Paketkarten (m), Info- und Basiskästen (s) auf die Kartenpaddings */
.pdp .pdp-paket{padding:var(--pdp-pad-m)}
.pdp .pdp-infokasten,.pdp .pdp-basis{padding:var(--pdp-pad-s)}
@media (max-width:767px){.pdp .pdp-paket{padding:var(--pdp-pad-s)}}

/* Notenkarte: Google-Verteilung verteilt sich auf die Höhe der linken Spalte statt oben zu kleben */
@media (min-width:768px){
	.pdp .pdp-noten__rechts .pdp-verteilung__zeile{margin:14px 0}
	.pdp .pdp-noten__rechts .pdp-verteilung__kopf{margin-bottom:12px}
}

/* Transkript-Karte: Titel zum Text 16; mobil Karte s (20) und Beratungsbox-Text bündig, damit alle Kartentitel mobil bei 36 px beginnen */
.pdp .pdp-nachlesen{row-gap:16px}
@media (max-width:767px){
	.pdp .pdp-nachlesen{padding:var(--pdp-pad-s)}
	.pdp #Begleitung .media-text__content-holder{padding-inline:4px}
}

/* ===== V9.5 Impeccable-Polish (03.10.2026, Detector plus Craft-Floor; Farben, Schriften, Texte unverändert) =====
   1 „Unsere Antwort“: kein dicker Seitenstrich mehr (Side-tab), die Antwort trägt sich über Fläche und Label.
   2 Pillen auf Farbe: Text in Tinte statt Grau (gray-on-color).
   3 Eyebrow über der Team-Bühne entfällt, die Überschrift trägt allein (Craft-Floor-Verbot, wie in den Erfahrungen).
   4 Browser-Oberflächen aus der Palette: Markierung, Caret, gleich breite Ziffern in Daten und Preisen.
   5 Mobil: Kaufsektion 48 statt 64 Luft (Kaufbereich wieder kürzer, Denis „mobil kurz“). */
.pdp .pdp-kritik__antwort{border-left:0;border-radius:12px;padding:16px 20px}
.pdp .course-card__tag_popular,.pdp .course-card__tag_refinanceable{color:var(--typography-black)}
.pdp .pdp-marke__buehne .pdp-eyebrow{display:none}
.pdp ::selection{background:var(--orange-200);color:var(--typography-black)}
.pdp input,.pdp textarea{caret-color:var(--orange-400)}
.pdp .pdp-termin time,.pdp .pdp-kaufbox__preis,.pdp .pdp-kaufbox__rate,.pdp .pdp-paket__preis,.pdp .pdp-paket__rate,
.pdp .pdp-noten,.pdp .pdp-verteilung,.pdp .pdp-foerderung__zahl{font-variant-numeric:tabular-nums}
@media (max-width:767px){.pdp #Starttermine.pdp-s{padding-top:48px;padding-bottom:48px}}

/* ---------- V9.6 Teamfoto (Gemini-Komposit aus echten Porträts, generiert 21.09.2026, Wasserzeichen entfernt) --------------------
   Art. 50 KI-VO: nach dem 02.08.2026 erzeugt, daher sichtbares Label je Bild. Dezente Form wie in der FL-Broschüre (Denis 01.10.2026):
   ohne Kasten, klein, oben rechts in der Teamkarte. Mobil 12px mehr Luft oben, damit der Satz nicht unter das Label läuft. */
.pdp .pdp-ablauf__team .pdp-ki-label{background:none;bottom:auto;color:var(--typography-dark-grey);left:auto;padding:0;right:16px;top:12px}
@media (max-width:767px){.pdp .pdp-ablauf__team{padding-top:36px}}

/* ---------- V9.7 Team-Scribble mittig hinter der Gruppe (Denis 05.10.2026): liegend, leicht gedreht, links und rechts von der Karte
   angeschnitten, Zacken beginnen unter dem Satz und stehen hinter Köpfen und Schultern. */
.pdp .pdp-ablauf__team .pdp-ablauf__scribble{left:50%;right:auto;top:130px;transform:translateX(-50%) rotate(-8deg);width:700px}
@media (max-width:767px){.pdp .pdp-ablauf__team .pdp-ablauf__scribble{right:auto;top:115px;width:540px}}

/* ======================================================================================================================
   V9.8 (06.10.2026): V9.7 bleibt Basis (Hero, Reihenfolge). Übernommen aus V10: Fehlerkorrekturen F2/F4, geschärftes Band, Beratungsblock mit
   den zwei Zeilen der aufgelösten Bühne, Callout ohne Gesicht. Dazu Zusatz Denis: Freitext-Aufklapper auch am Desktop, breitere Textspalte.
   Alles unter .pdp-v98 (Klasse an <main>), weil v92-gemeinsam.css auch von den V10- und Hero-Mockups geladen wird. Nur Tokens, keine neuen Farben.
   ====================================================================================================================== */

/* F2: Terminliste ohne automatische Silbentrennung und ohne Umbruch mitten im Wort („Braunschwei g“; Ursache war overflow-wrap:anywhere) */
.pdp-v98 .pdp-terminliste,.pdp-v98 .pdp-terminliste *{hyphens:manual;-webkit-hyphens:manual}
.pdp-v98 .pdp-termin__ort strong{overflow-wrap:break-word}

/* F4: Leiste unten mobil mit Preis (Preis oben, Start darunter; die Sternzahl steht im Hero) */
@media (max-width:991px){
	.pdp-v98 .pdp-leiste__preis{display:block}
	.pdp-v98 .pdp-leiste__preis strong{font-weight:600}
	.pdp-v98 .pdp-leiste__rate,.pdp-v98 .pdp-leiste__start,.pdp-v98 .pdp-leiste__stern{display:none}
	.pdp-v98 .pdp-leiste__kurz{display:block;font-weight:400}
	.pdp-v98 .pdp-leiste .button{flex:1 1 auto;min-width:0}
}

/* Band: je Frage erst die sachliche Antwort (weiße Blase), dann das Zitat; Weiche zum Fernlehrgang */
.pdp-v98 .pdp-band__paar .pdp-band__a--fakt{align-self:flex-start;background:var(--background-white);border-radius:20px 20px 20px 4px;margin:0 56px 0 0}
.pdp-v98 .pdp-band__weiche{color:var(--typography-black);font-family:var(--font4);font-size:var(--schrift-14);line-height:1.45;margin:0 0 0 18px}
.pdp-v98 .pdp-band__weiche a{color:inherit;font-weight:600;text-decoration:underline;text-decoration-color:var(--orange-400);text-decoration-thickness:2px;text-underline-offset:3px}
@media (max-width:767px){.pdp-v98 .pdp-band__paar .pdp-band__a--fakt{margin-right:24px}.pdp-v98 .pdp-band__weiche{margin-left:18px}}

/* Callout an den Terminen ohne Gesicht und ohne Nummer, ein Beratungsknopf */
.pdp-v98 .pdp-kauf .pdp-callout.pdp-callout--zeile.pdp-callout--ohnebild{align-items:center;grid-template-columns:minmax(0,1fr) auto}
.pdp-v98 .pdp-callout--zeile.pdp-callout--ohnebild .pdp-callout__aktion{grid-column:auto}
@media (max-width:991px){.pdp-v98 .pdp-kauf .pdp-callout.pdp-callout--zeile.pdp-callout--ohnebild{grid-template-columns:minmax(0,1fr)}.pdp-v98 .pdp-callout--zeile.pdp-callout--ohnebild .pdp-callout__aktion{grid-column:1 / -1}}

/* Beratungsblock: zwei Zeilen aus der Bühne, Telefon mit Zeiten (die einzige Stelle der Seite außerhalb des Heros) */
.pdp-v98 .pdp-beratung__zeilen{margin:0 0 20px}
.pdp-v98 .pdp-beratung__zeilen li{color:var(--typography-black)}
.pdp-v98 .pdp-beratung__zeilen strong{font-weight:600}
.pdp-v98 .pdp-beratung__tel{margin:16px 0 0}
.pdp-v98 .pdp-beratung__tel a{color:var(--typography-black);font-weight:600;text-decoration:underline;text-decoration-color:var(--orange-400);text-decoration-thickness:2px;text-underline-offset:3px}

/* Fernlehrgang: „Wichtige Informationen“ im Kasten als Aufklapper, in allen Breiten zu */
.pdp-v98 .pdp-infokasten .pdp-auf{background:none;border-radius:0}
.pdp-v98 .pdp-infokasten .pdp-auf > summary{font-size:var(--schrift-20);min-height:0;padding:0 36px 0 0}
.pdp-v98 .pdp-infokasten .pdp-auf > summary::after{right:0}
.pdp-v98 .pdp-infokasten .pdp-auf > summary h3{margin:0}
.pdp-v98 .pdp-infokasten .pdp-auf__inhalt{padding:12px 0 0}
.pdp-v98 .pdp-infokasten .pdp-auf__inhalt > *{max-width:none}
.pdp-v98 .pdp-infokasten .pdp-auf__inhalt p{margin:0 0 12px}
.pdp-v98 .pdp-infokasten .pdp-auf__inhalt p:last-child{margin-bottom:0}

/* Freitext (WBÜ-Abschnitte): Aufklapper in allen Breiten, Optik wie .pdp-auf (Desktop 20/500, mobil 16/600), ohne JavaScript steht alles offen.
   Die Textspalte nutzt die ganze Spalte neben der Karte, die Zeilenlänge begrenzen die Absätze selbst (ca. 75 Zeichen bei 20 px, gemessen 70 bis 76 bei 700 px). */
.pdp-v98 .pdp-freitext__inhalt .accordion-header{background:var(--background-light-beige);border:0;border-radius:20px;color:var(--typography-black);cursor:pointer;font-family:var(--font4);font-size:var(--schrift-20);font-weight:500;hyphens:none;line-height:1.5;margin:0 0 12px!important;min-height:56px;padding:14px 60px 14px 20px;position:relative}
.pdp-v98 .pdp-freitext__inhalt .accordion-header.active{border-radius:20px 20px 0 0;margin-bottom:0!important}
.pdp-v98 .pdp-freitext__inhalt .accordion-header:after{background:url(https://www.hoeher-akademie.de/wp-content/themes/hoher/frontend/src/icons/plus.svg) no-repeat 50%;content:"";height:16px;position:absolute;right:24px;top:50%;transform:translateY(-50%);width:16px}
.pdp-v98 .pdp-freitext__inhalt .accordion-header.active:after{background-image:url(https://www.hoeher-akademie.de/wp-content/themes/hoher/frontend/src/icons/xmark.svg)}
.pdp-v98 .pdp-freitext__inhalt .accordion-content{background:var(--background-light-beige);border:0;border-radius:0 0 20px 20px;margin:0 0 12px;overflow:hidden;padding:0 20px}
.pdp-v98 .pdp-freitext__inhalt .accordion-content.open{padding-bottom:20px}
.pdp-v98 .pdp-freitext__inhalt .accordion-content:last-child{border-bottom:0;margin-bottom:0}
@media (max-width:767px){
	.pdp-v98 .pdp-freitext__inhalt .accordion-header{font-size:var(--schrift-16);font-weight:600;padding:14px 52px 14px 16px}
	.pdp-v98 .pdp-freitext__inhalt .accordion-header:after{right:20px}
	.pdp-v98 .pdp-freitext__inhalt .accordion-content{padding:0 16px}
	.pdp-v98 .pdp-freitext__inhalt .accordion-content.open{padding-bottom:20px}
}
@media (min-width:768px){
	.pdp-v98 .pdp-freitext__inhalt{max-width:none}
	.pdp-v98 .pdp-freitext__inhalt .accordion-content > *,.pdp-v98 .pdp-freitext__inhalt > :is(p,ul,ol){max-width:700px}
	.pdp-v98 .pdp-freitext > .pdp-kopf .pdp-fakt,.pdp-v98 .pdp-freitext > .pdp-kopf .pdp-faktensatz{max-width:700px}
}

/* ---------- V9.8 Glätten (impeccable polish/layout, gemessen mit v98bau/messen.py bei 1440 und 390 px) ----------
   Befunde vorher: Bild oder Motiv beginnt in zweispaltigen Sektionen deutlich unter der Überschrift der Nachbarspalte (Band: Xenia 81 bis 175 px,
   Beratung 264 px), Text klebt an der Zeile darüber (Rhythmus-Satz im Datenblatt 2 px über dem Knopf), farbiger 3-px-Seitenstrich am Zitat im
   Beratungsblock. Behoben mit wenigen allgemeinen Regeln statt Einzelkorrekturen. */

/* 1 Zweispaltig: das Motiv beginnt oben, bündig mit der Überschrift der Nachbarspalte. Die Spalte mit dem Motiv klebt beim Scrollen
   (wie die Team-Karte im Ablauf), damit neben den langen Bubbles keine leere Fläche bleibt. */
@media (min-width:992px){
	.pdp-v98 .pdp-band__raster{align-items:start}
	.pdp-v98 .pdp-band__xenia{position:sticky;top:24px}
	/* Beratungsblock: das Porträt nimmt die Kartenhöhe unter dem Innenabstand (40 px, wie der Textblock), seine Oberkante liegt damit bündig mit der
	   Überschrift, egal wie lang der Text daneben ist; es steht weiter unten auf dem Kartenrand. Absolut gesetzt, damit das Bild die Kartenhöhe
	   nicht selbst bestimmt (sonst wächst die Karte auf die Bildhöhe); in der Breite begrenzt die Spalte, das Bild steht dann unten auf dem Rand. */
	.pdp-v98 #Begleitung .media-text__media-holder{align-self:stretch}
	.pdp-v98 #Begleitung .media_image{bottom:0;left:-16px;position:absolute;top:40px;width:calc(100% + 16px)}
	.pdp-v98 #Begleitung .media_image img{display:block;height:100%;max-width:none;object-fit:contain;object-position:left bottom;width:100%}
}

/* 2 Zusammengehöriges eng, Getrenntes großzügig: Hinweistext und Knopf im Datenblatt standen 2 px auseinander */
.pdp-v98 .pdp-datenblatt .pdp-rhythmus{margin:16px 0}

.pdp-v98 .pdp-datenblatt .pdp-zfu{margin-bottom:16px}
.pdp-v98 .pdp-pakete__zeile + .pdp-klein{margin-top:8px}

/* 3 Zitat im Beratungsblock ohne farbigen Seitenstrich (Craft-Floor-Verbot), stattdessen Fläche wie die Zitate im Band */
.pdp-v98 .pdp-beratung__stimme{background:var(--background-white);border-left:0;border-radius:20px;padding:16px 20px}

/* 4 Mobil: die Abschnittsmarke (Prüfhilfe des Mockups) lag links oben über Überschriften und Pillen; sie sitzt jetzt rechts oben in der Ecke */
@media (max-width:767px){.pdp-v98 .pdp-tag{left:auto;right:8px;top:8px}}

/* V9.8b Band (Denis 07.10.2026: „das mit dem Space hat nicht gepasst“): Xenia läuft beim Scrollen neben den Fragen mit.
   overflow:hidden am Band verhinderte position:sticky; clip schneidet genauso ab, ohne Scroll-Container zu sein.
   Abstand oben unter die feste Kopfzeile (69 px) plus Luft. */
.pdp-v98 .pdp-band{overflow:clip}
@media (min-width:992px){.pdp-v98 .pdp-band__xenia{top:104px}}
/* Ursache: Theme setzt html und body auf overflow-x:hidden. Damit wird body ein Scroll-Container, der nie scrollt,
   und kein position:sticky auf der Seite greift (Xenia, Teamkarte). clip schneidet seitlich ab, ohne Scroll-Container zu sein.
   Im Theme nur auf Produktseiten (body.single-product) übernehmen, Rest der Website vorher testen. */
body:has(.pdp-v98){overflow-x:clip;overflow-y:visible}
/* Xenia samt Zitat passt bei 900 px Fensterhöhe zwischen Kopfzeile und Kaufleiste */
@media (min-width:992px){.pdp-v98 .pdp-band__xenia{justify-self:end;max-width:440px;top:96px;width:100%}}

/* V9.9 Band zweispaltig, freigegeben von Denis 07.10.2026 */
@media (min-width:992px){
 .pdp .pdp-b2.pdp-band__raster{display:block}
 .pdp .pdp-b2 .pdp-band__spalte{display:block}
 .pdp .pdp-b2 .pdp-band__zweifel{align-items:start;display:grid;gap:28px 48px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:48px}
 .pdp .pdp-b2 .pdp-band__zweifel li.pdp-band__paar{max-width:none}
 .pdp .pdp-b2 .pdp-band__zweifel:has(> li:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 32px}
 .pdp .pdp-b2 .pdp-band__ende{align-items:center;display:grid;gap:64px;grid-template-columns:minmax(0,7fr) minmax(0,5fr);margin-top:80px}
 .pdp .pdp-b2 .pdp-band__xenia{justify-self:center;max-width:420px;position:relative;top:auto;width:100%}
}
.pdp .pdp-b2 .pdp-band__kicker{color:var(--typography-black);font-family:var(--font4);font-size:var(--schrift-20);font-weight:700;line-height:1.4;margin:0}
.pdp .pdp-b2 .pdp-band__gross{color:var(--typography-black);font-family:var(--font3);font-size:var(--schrift-h1);font-weight:400;line-height:1.12;margin:16px 0 0;max-width:15em;text-wrap:balance}
.pdp .pdp-b2 .pdp-band__beleg{color:var(--typography-black);font-family:var(--font4);font-size:var(--schrift-16);line-height:1.6;margin:20px 0 0;max-width:none;width:auto}
.pdp .pdp-b2 .pdp-band__beleg strong{font-weight:600}
.pdp .pdp-b2 .pdp-band__sterne{align-items:center;color:var(--typography-black);display:flex;font-family:var(--font4);font-size:var(--schrift-14);gap:6px;margin:12px 0 0}
.pdp .pdp-b2 .pdp-band__sterne svg{height:16px;width:16px}
.pdp .pdp-b2 .pdp-band__aktion{margin-top:28px}
@media (max-width:991px){
 .pdp .pdp-b2 .pdp-band__ende{display:flex;flex-direction:column;order:9;width:100%}
 .pdp .pdp-b2 .pdp-band__xenia{margin:40px auto 0;max-width:420px;order:-1;width:100%}
 .pdp .pdp-b2 .pdp-band__botschaft{margin-top:40px}
 .pdp .pdp-b2 .pdp-band__gross{font-size:var(--schrift-h2)}
}
/* Ruhigere Blasen: je Zweifel eine weiße Karte, Frage als Kopf, Antwort und Stimme ohne eigene Kästen, alles bündig links */
.pdp .pdp-b2 .pdp-band__zweifel li.pdp-band__paar{background:var(--background-white);border-radius:24px;gap:0;padding:22px 26px 24px}
.pdp .pdp-b2 .pdp-band__f{background:none;border-radius:0;font-size:var(--schrift-20);margin:0;padding:0}
.pdp .pdp-b2 .pdp-band__a,.pdp .pdp-b2 .pdp-band__a--fakt,.pdp .pdp-b2 .pdp-band__paar .pdp-band__a--fakt{background:none;border-radius:0;box-shadow:none;margin:12px 0 0;max-width:none;padding:0}
.pdp .pdp-b2 .pdp-band__a--fakt{color:var(--typography-black);font-weight:500}
.pdp .pdp-b2 blockquote.pdp-band__a{border-top:1px solid var(--background-borders);margin-top:16px;padding-top:14px}
.pdp .pdp-b2 blockquote.pdp-band__a p{color:var(--typography-dark-grey);font-style:italic}
.pdp .pdp-b2 .pdp-band__weiche{margin:10px 0 0}
@media (min-width:992px){.pdp .pdp-b2 .pdp-band__zweifel{align-items:stretch;gap:20px}}


/* V9.9b (Denis 07.10.2026): PDF-Download als Theme-Bauteil course-description__download oben in der Seitenleiste */
.pdp .pdp-datenblatt .course-description__download{background:url(pdp/bg-download.svg) no-repeat 50%;background-size:cover;border-radius:20px;margin:0 0 24px}
.pdp .pdp-datenblatt .course-description__download a{display:flex;flex-direction:column;padding:20px 84px 22px 20px;position:relative}
.pdp .pdp-datenblatt .course-description__download .icon-circle{height:52px;left:auto;right:20px;top:50%;transform:translateY(-50%);width:52px}
.pdp .pdp-datenblatt .course-description__download-title{color:var(--typography-black);font-family:var(--font4);font-size:var(--schrift-20);font-weight:500;line-height:1.35;margin:0 0 4px}
.pdp .pdp-datenblatt .course-description__download-text{color:var(--typography-dark-grey);font-family:var(--font4);font-size:var(--schrift-14);line-height:1.6}


/* Zitat in der Karte immer volle Breite und linksbündig (kurze Zitate rutschten sonst nach rechts) */
.pdp .pdp-b2 blockquote.pdp-band__a{align-self:stretch;margin-left:0;margin-right:0;padding-left:0;padding-right:0;text-align:left}

/* V9.9c (Denis 07.10.2026): Beratungszeile am Ende der Kaufsektion mit drei Vertriebsgesichtern (Bestand .pdp-team__gesichter), kein neues Element */
.pdp .pdp-callout__mitgesichtern{align-items:center;display:flex;gap:16px}
.pdp .pdp-callout__mitgesichtern .pdp-team__gesichter img{height:44px;width:44px}
@media (max-width:767px){.pdp .pdp-callout__mitgesichtern{align-items:flex-start;flex-direction:column;gap:10px}}
.pdp .pdp-callout--zeile > div.pdp-callout__mitgesichtern{display:flex}
@media (max-width:767px){.pdp .pdp-callout--zeile > div.pdp-callout__mitgesichtern{display:flex;flex-direction:column}}

/* V9.9d PDF-Karte unter dem Datenblatt (Denis 07.10.2026: auffälliger). Lead-Magnet-Muster: Titelseite als Vorschau, leicht gedreht wie Papier,
   Titel in Rowan, Umfang und Größe angesagt, ganze Karte klickbar. Flache Orange-100-Fläche, Hover Orange 200. */
.pdp .pdp-pdf{background:var(--orange-100);border-radius:20px;margin:16px 0 0;overflow:hidden;transition:background-color .2s ease}
.pdp .pdp-pdf:hover{background:var(--orange-200)}
.pdp .pdp-pdf a{align-items:center;color:var(--typography-black);display:flex;gap:20px;padding:20px 22px;text-decoration:none}
.pdp .pdp-pdf__cover{border-radius:4px;box-shadow:0 6px 18px rgba(39,37,42,.18);flex:0 0 auto;height:auto;transform:rotate(-4deg);transition:transform .25s ease;width:78px}
.pdp .pdp-pdf a:hover .pdp-pdf__cover{transform:rotate(-1deg) translateY(-3px)}
.pdp .pdp-pdf__text{display:flex;flex:1 1 auto;flex-direction:column;min-width:0}
.pdp .pdp-pdf__titel{font-family:var(--font3);font-size:var(--schrift-h4);line-height:1.2}
.pdp .pdp-pdf__meta{color:var(--typography-black);font-family:var(--font4);font-size:var(--schrift-14);font-weight:600;margin-top:6px}
.pdp .pdp-pdf__fuer{color:var(--typography-dark-grey);font-family:var(--font4);font-size:var(--schrift-14);line-height:1.45;margin-top:2px}
.pdp .pdp-pdf__knopf{align-items:center;display:inline-flex;font-family:var(--font4);font-size:var(--schrift-14);font-weight:600;gap:10px;letter-spacing:.02em;margin-top:12px;text-transform:uppercase}
.pdp .pdp-pdf .icon-circle{align-items:center;background:var(--primary-300);border-radius:50%;display:flex;flex:0 0 auto;height:36px;justify-content:center;position:static;transform:none;transition:transform .2s ease;width:36px}
.pdp .pdp-pdf .icon-circle svg{height:18px;width:18px}
.pdp .pdp-pdf a:hover .icon-circle{transform:translateY(2px)}
.pdp .pdp-pdf a:focus-visible{border-radius:20px;outline:2px solid var(--typography-black);outline-offset:2px}

/* V9.9e Menschen-Zeile mobil nebeneinander (Denis 07.10.2026): kompakter, linke Kante wie Titel und Haken */
@media (max-width:767px){
	.pdp .pdp-hero__menschen{flex-wrap:nowrap;gap:12px}
	.pdp .pdp-hero__menschen .hero-search__faces img{height:40px}
	.pdp .pdp-hero__menschen .pdp-klein{font-size:var(--schrift-14);line-height:1.4;margin-top:0}
}

/* V9.9f (Denis 07.10.2026): Xenia nur mit Abspielknopf, keine Textpille; Knopf wie die übrigen Videokreise (52px, schwarz), oben links, frei von der Zitatkarte */
.pdp .pdp-band__abspielen{background:none;gap:0;left:20px;padding:0;top:20px}
.pdp .pdp-band__abspielen .pdp-band__play{box-shadow:0 4px 16px rgba(39,37,42,.28);height:52px;width:52px}
.pdp .pdp-band__abspielen .pdp-band__play svg{height:20px;width:20px}

/* V9.9g A (Denis 07.10.2026): Passt gegliedert. Inhalte als zweispaltige Häkchenliste (Icon = Sprite bullet-primary als
   Datei-URI, damit das Theme keine SVG je Punkt ausgeben muss), Modulzeilen als Zwischentitel, Voraussetzungen im
   beigen Kasten mit normalen Punkten (keine Häkchen: 104 von 125 Produkten nennen Alternativen mit „oder“). */
.pdp .pdp-freitext__inhalt .pdp-inhalte{column-count:2;column-gap:32px;list-style:none;margin:8px 0 16px;max-width:700px;padding:0} /* Spalten statt Raster: jeder Punkt so hoch wie sein Text, keine Lücke neben zweizeiligen Nachbarn (Denis 07.10.2026) */
.pdp .pdp-freitext__inhalt .pdp-inhalte li{border-top:1px solid var(--background-borders);break-inside:avoid;margin:0;padding:10px 0 10px 30px;position:relative}
.pdp .pdp-freitext__inhalt .pdp-inhalte li::before{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19 20' fill='none'%3E%3Crect x='.908' y='.9' width='18' height='18.2' rx='9' fill='%23FAE0B0'/%3E%3Cpath d='m7.034 10.079 2.988 3.011 2.772-6.167' stroke='%2327252A' stroke-width='1.125' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;content:"";height:20px;left:0;position:absolute;top:12px;width:20px}
.pdp .pdp-freitext__inhalt .pdp-zwischentitel{color:var(--typography-black);font-weight:600;margin:20px 0 0}
.pdp .pdp-freitext__inhalt .pdp-passtwenn{margin:8px 0 28px}
/* Denis 08.10.2026: Desktop ohne Klappkasten -> Voraussetzungen im beigen Kasten (Plan Teil 23); am Handy im Klappkasten ohne zweiten Farbton */
@media (min-width:768px){.pdp .pdp-freitext__inhalt .pdp-passtwenn{background:var(--background-beige);border-radius:20px;max-width:700px;padding:20px 24px}}
.pdp .pdp-freitext__inhalt .pdp-passtwenn > :first-child{margin-top:0}
.pdp .pdp-freitext__inhalt .pdp-passtwenn > :last-child{margin-bottom:0}
@media (max-width:767px){.pdp .pdp-freitext__inhalt .pdp-inhalte{column-count:1}}

/* V9.9g B (Denis 07.10.2026, Vorbild Teachable „Why 150,000 …“): Vorteile als Karte auf großem Motiv. Motiv je Format
   (Kurs: Gruppe mit Dozentin, Fernlehrgang: Zertifikat), KI-Hinweis steht im Bild. */
.pdp .pdp-vorteile--foto{margin-top:var(--pdp-luft);position:relative} /* Luft über dem Bild wie vor jeder Sektion (Denis 07.10.2026) */
.pdp .pdp-vorteile__bild{border-radius:20px;margin:0;overflow:hidden}
.pdp .pdp-vorteile__bild img{display:block;height:520px;object-fit:cover;object-position:50% 40%;width:100%}
.pdp .pdp-vorteile--foto .pdp-vorteile{background:var(--background-white);border-radius:20px;box-shadow:var(--pdp-schatten);margin:-160px 40px 0;padding:40px 44px 32px;position:relative}
@media (max-width:767px){.pdp .pdp-vorteile__bild img{height:300px}.pdp .pdp-vorteile--foto .pdp-vorteile{margin:-60px 12px 0;padding:28px 20px 20px}}

/* V9.9h Ablauf (Denis 07.10.2026): zwei Ebenen je Station, Zeitpunkt fett im Text; Teambild so hoch wie die Zeitleiste,
   Personen unten, Satz oben (statt mitlaufend). */
.pdp .pdp-zeit__wann{color:var(--typography-black);font-weight:600}
@media (min-width:992px){
	.pdp .pdp-ablauf{align-items:stretch}
	.pdp .pdp-ablauf__team{align-items:center;align-self:stretch;display:flex;flex-direction:column;position:relative;top:auto}
	.pdp .pdp-ablauf__team > img:not(.pdp-scribble){margin-top:auto}
}

/* V9.9h Terminliste mobil ruhiger (Denis 07.10.2026: sieht unruhig aus). Live-Muster (eine große Karte je Termin) wäre bei
   68 Terminen zu lang, deshalb bleibt die Zeile, aber mit festem Raster: oben Datum und ggf. Nächster Start, darunter
   Format und Ort als schlichter Text, rechts ein gleich hoher Knopf. Filter wie live: zwei Knöpfe je Reihe. */
@media (max-width:767px){
	.pdp .pdp-terminliste .pdp-termin{align-items:center;column-gap:10px;grid-template-areas:"hinweis hinweis hinweis knopf" "aktion aktion aktion knopf" "datum datum datum knopf" "format ort ort knopf";grid-template-columns:auto auto minmax(0,1fr) auto;row-gap:2px}
	.pdp .pdp-termin__aktion{grid-area:aktion}
	.pdp .pdp-termin__ort{display:contents}
	.pdp .pdp-termin__ort > strong{align-self:center;font-size:var(--schrift-14);grid-area:ort;min-width:0;overflow-wrap:break-word}
	.pdp .pdp-termin__hinweis{grid-area:hinweis;justify-self:start;margin-bottom:4px}
	.pdp .pdp-termin__format{align-self:center}
	.pdp .pdp-termin .pdp-format{background:none;border:0;color:var(--typography-dark-grey);font-size:var(--schrift-14);gap:4px;height:auto;padding:0}
	.pdp .pdp-terminliste .pdp-termin__knopf.button{align-self:center;height:40px;min-height:40px;padding-inline:16px;white-space:nowrap;width:auto}
	.pdp .pdp-termine__filter{flex-wrap:wrap;gap:8px}
	.pdp .pdp-termine__filter .dates-table__filter{flex:1 1 calc(50% - 4px);min-width:0}
	.pdp .pdp-termine__filter .dates-table__filter-btn{padding-inline:12px;width:100%}
}
/* Kleine Handys (360 px): Ort unter das Format, sonst bricht „Live via Microsoft Teams“ in drei Zeilen */
@media (max-width:420px){
	.pdp .pdp-terminliste .pdp-termin{grid-template-areas:"hinweis hinweis hinweis knopf" "aktion aktion aktion knopf" "datum datum datum knopf" "format format format knopf" "ort ort ort knopf"}
	.pdp .pdp-termin__ort > strong{align-self:start}
}

/* V9.9i (Denis 08.10.2026): Bestandsblock partners-carousel (Startseite) über dem Vorteile-Motiv. Abstand nach unten über
   die Block-Variante --bottom-64, darum hier kein eigener Abstand am Motiv. Logos grau und leiser, beim Zeigen farbig. */
.pdp #Warum .partners-carousel{margin-top:var(--pdp-luft)}
.pdp #Warum .partners-carousel + .pdp-vorteile--foto{margin-top:0}
.pdp #Warum .partners-carousel__logo{filter:grayscale(1);opacity:.6;transition:filter .3s ease,opacity .3s ease}
.pdp #Warum .partners-carousel__logo:hover{filter:none;opacity:1}

/* V9.9i (Denis 08.10.2026): Vorteile-Karte auf dem Motiv zentriert, Desktop und mobil (Überschrift, Icon über dem Titel, Text) */
.pdp .pdp-vorteile--foto .pdp-marke__titel{text-align:center}
.pdp .pdp-vorteile--foto .pdp-vorteil{text-align:center}
.pdp .pdp-vorteile--foto .pdp-vorteil__icon{margin-inline:auto}
.pdp .pdp-vorteile--foto .pdp-vorteil p{margin-inline:auto}
@media (max-width:767px){
	.pdp .pdp-vorteile--foto .pdp-vorteil{display:block}
	.pdp .pdp-vorteile--foto .pdp-vorteil__icon{margin:0 auto 12px}
}

/* V9.9k (Denis 08.10.2026): Studienpreis wieder im Siegelband, fünf Siegel. Unter 1440 px darf der Titel umbrechen,
   sonst läuft der Titel des Studienpreises über die Trennlinie. */
.pdp .pdp-siegelband__text span{max-width:190px;text-wrap:balance;white-space:normal}
@media (max-width:1439px){.pdp .pdp-siegelband__text strong{text-wrap:balance;white-space:normal}}

/* V9.9l (Denis 08.10.2026): Siegelband mobil als wischbare Reihe wie Videos, Vorteile und Stimmen. Läuft nicht von selbst
   (taste-und-emotion 3.6: Autolauf nur für Zitate), das nächste Siegel ragt angeschnitten herein. */
@media (max-width:767px){
	.pdp .pdp-siegelband__liste{display:flex;gap:0;grid-template-columns:none;justify-content:flex-start;margin-right:-16px;overflow-x:auto;padding:10px 16px 10px 0;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
	.pdp .pdp-siegelband__liste::-webkit-scrollbar{display:none}
	.pdp .pdp-siegelband__item{border-top:0;flex:0 0 auto;max-width:72%;padding:6px 16px;scroll-snap-align:start}
	.pdp .pdp-siegelband__item:first-child{padding-left:0}
	.pdp .pdp-siegelband__item + .pdp-siegelband__item,.pdp .pdp-siegelband__item:nth-child(even){border-left:var(--pdp-linie);padding-left:16px}
	.pdp .pdp-siegelband__item:last-child:nth-child(odd){grid-column:auto;justify-content:flex-start}
	.pdp .pdp-siegelband__text strong,.pdp .pdp-siegelband__text span{white-space:nowrap}
	.pdp .pdp-siegelband__text span{max-width:none}
}

/* V9.9l (Denis 08.10.2026): Band-Botschaft mobil zentriert (Kicker, Überschrift, Beleg, Sterne, Knopf) */
@media (max-width:767px){
	.pdp .pdp-band__botschaft{text-align:center}
	.pdp .pdp-band__sterne{justify-content:center}
	.pdp .pdp-band__aktion{display:flex;justify-content:center}
}

/* V9.9l: zwei Tertiärknöpfe nebeneinander unter der Siegelreihe */
.pdp .pdp-beweis__aktionen{display:flex;flex-wrap:wrap;gap:12px 32px}

/* V9.9m Farbrhythmus (Denis 08.10.2026, „wir haben ja noch die Sekundärfarben“): Farbe nach Bedeutung.
   Orange = Handeln und Geld (Hero, Kauf, Förderung, Teamkasten Ablauf, Knöpfe). Lila-100 = Menschen und Gefühl
   (Band mit Fragen und Xenia, Beratung mit Brit), mit Abstand zueinander. Grün bleibt nur Pille (Review: nie Fläche). */
.pdp .pdp-band{background:var(--lila-100)}
/* Beratung mit Brit wieder im Primaerton wie live, das orange Scribble passt nur dort (Denis 08.10.2026) */

/* V9.9n Abschnittsnavigation (Denis 08.10.2026): fünf Einträge, Pillen 44 px (Fingertipp-Mindestmaß), mobil bündig mit dem Text */
.pdp .pdp-nav .course-navigation a.tc__chip{height:44px}
@media (max-width:767px){.pdp .pdp-nav .course-navigation ul{padding-left:0;padding-right:16px;scrollbar-width:none}.pdp .pdp-nav .course-navigation ul::-webkit-scrollbar{display:none}}

/* Aktionspreis in der Terminzeile (aus mockups/zustaende.html, nur bei laufender Aktion) */
.pdp-termin__aktion{font-family:var(--font4);font-size:var(--schrift-16);line-height:1.4;margin-left:auto}
.pdp-termin__aktion .hx-aktion-preis__alt{font-size:var(--schrift-14)}
@media (max-width:991px){.pdp-termin__aktion{margin-left:0}}

/* Hero-Pillen = Bausteine der Weiterbildungs-Übersicht (hx-uebersicht-status, hx-uebersicht-eyebrow aus shared.css), Denis 08.10.2026 */
.pdp .pdp-hero__marken{align-items:center}
.pdp .pdp-hero__marken .hx-uebersicht-eyebrow,.pdp .pdp-hero__marken .hx-uebersicht-status{margin:0}


/* Eigene Videodateien im Overlay (Denis 08.10.2026: Videos von der Website, groß) */
.pdp-vo__fenster{max-width:min(1200px,calc((100vh - 130px) * 16 / 9))}
.pdp-vo__rahmen video{background:var(--typography-black);display:block;height:100%;object-fit:contain;width:100%}

/* ===================================================================================================================
   4b Förderung als Rechner-Karte (Entwurf Variante B, freigegeben 08.10.2026: baupläne/produktseite/mockups/foerderung-entwurf.html)
   Bestand statt neu: Ergebnisfläche wie Ersparnis-Rechner der Premium-Seite (Orange 100, Zahl Rowan H1), Bundesland-Auswahl
   .pdp-ag__land, Paket-Pillen .tc__chip, Zahlenkreise wie .pdp-foerderung__schritte (32 px, Orange 300), Knopfzeile
   .pdp-foerderung__aktionen, Heartbeat-Scribble .pdp-scribble. Nur var(--…). Bewegung nur mit .ist-bewegt (pdp.js, ohne reduced motion).
   Desktop: Text und Knöpfe links, Rechner rechts. Mobil: Überschrift, Rechner, Knöpfe (Zahl vor Handlung). */
.pdp .pdp-foe{column-gap:clamp(32px,5vw,80px);display:grid;grid-template-areas:". rechner" "text rechner" "tun rechner" ". rechner";grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:1fr auto auto 1fr}
.pdp .pdp-foe__text{align-self:end;grid-area:text}
.pdp .pdp-foe__rechner{grid-area:rechner}
.pdp .pdp-foe__tun{align-items:flex-start;align-self:start;flex-direction:column;grid-area:tun;margin-top:32px}
.pdp .pdp-foe__tun > .pdp-ag[open]{width:100%}
@media (max-width:1000px){
	.pdp .pdp-foe{grid-template-areas:"text" "rechner" "tun";grid-template-columns:minmax(0,1fr);grid-template-rows:none;row-gap:28px}
	.pdp .pdp-foe__tun{margin-top:0}
}
@media (max-width:767px){
	.pdp .pdp-foe__tun{align-items:stretch;gap:12px}
	.pdp .pdp-foe__tun > .button,.pdp .pdp-foe__tun > .pdp-ag,.pdp .pdp-foe__tun > .pdp-ag > summary{justify-content:center;width:100%}
}

/* Drei Wege mit Zahlenkreis (Kreis wie .pdp-foerderung__schritte li::before) */
.pdp .pdp-foe__wege{counter-reset:weg;display:flex;flex-direction:column;gap:14px;list-style:none;margin:28px 0 0;padding:0}
.pdp .pdp-foe__wege li{align-items:center;color:var(--typography-dark-grey);counter-increment:weg;display:flex;font-family:var(--font4);font-size:var(--schrift-16);gap:12px;line-height:1.5}
.pdp .pdp-foe__wege li::before{align-items:center;background:var(--primary-300);border-radius:50%;color:var(--typography-black);content:counter(weg);display:flex;flex:0 0 32px;font-size:var(--schrift-14);font-weight:600;height:32px;justify-content:center}
.pdp .pdp-foe__wege strong{color:var(--typography-black);font-weight:600}

/* Karte */
.pdp .pdp-foe__rechner{background:var(--orange-100);border-radius:32px;isolation:isolate;min-width:0;overflow:hidden;padding:clamp(24px,3.4vw,44px);position:relative}
.pdp .pdp-foe__rechner > *{position:relative;z-index:1}
.pdp .pdp-foe__rechner > .pdp-foe__scribble{max-width:none;position:absolute;right:-118px;top:-150px;transform:rotate(-12deg);width:300px;z-index:0}
@media (max-width:767px){
	.pdp .pdp-foe__rechner{border-radius:20px;padding:24px 20px}
	.pdp .pdp-foe__rechner > .pdp-foe__scribble{right:-128px;top:-128px;width:220px}
}
.pdp .pdp-foe__klein{color:var(--typography-black);font-family:var(--font4);font-size:var(--schrift-16);line-height:1.4;margin:0}
.pdp .pdp-foe__klein:empty{display:none}
.pdp .pdp-foe__zahl{color:var(--typography-black);font-family:var(--font3);font-size:var(--schrift-h1);font-variant-numeric:tabular-nums;font-weight:400;letter-spacing:-.02em;line-height:1.05;margin:2px 0 8px}
.pdp .pdp-foe__satz{color:var(--typography-black);font-family:var(--font4);font-size:var(--schrift-16);line-height:1.5;margin:0;max-width:46ch}
.pdp .pdp-foe__hinweis{border-top:1px solid var(--orange-200);color:var(--typography-dark-grey);font-family:var(--font4);font-size:var(--schrift-14);line-height:1.5;margin:20px 0 0;padding-top:12px}
.pdp .pdp-foe__ergebnis.ist-neu{animation:pdp-foe-ein .32s ease-out}
@keyframes pdp-foe-ein{from{opacity:.25;transform:translateY(4px)}to{opacity:1;transform:none}}

/* Aufteilung Land/Agentur und Du */
.pdp .pdp-foe__split{background:var(--background-white);border-radius:100px;display:flex;height:14px;margin-top:18px;overflow:hidden}
.pdp .pdp-foe__split-land{background:var(--primary-300);border-radius:100px;display:block;height:100%;transform:scaleX(var(--s,0));transform-origin:left center;transition:transform .7s cubic-bezier(.2,.7,.2,1);width:100%}
.pdp .pdp-foe__legende{color:var(--typography-black);display:flex;flex-wrap:wrap;font-family:var(--font4);font-size:var(--schrift-14);gap:6px 20px;justify-content:space-between;line-height:1.4;margin-top:10px}
.pdp .pdp-foe__legende b{font-weight:600}
.pdp .pdp-foe__punkt{background:var(--background-white);border:1px solid var(--background-borders);border-radius:50%;display:inline-block;height:10px;margin-right:6px;width:10px}
.pdp .pdp-foe__punkt--land{background:var(--primary-300);border-color:var(--primary-300)}

/* Auswahl: Paket (Pillen .tc__chip) und Bundesland (.pdp-ag__land) */
.pdp .pdp-foe__steuer{display:grid;gap:16px 24px;grid-template-columns:auto minmax(0,1fr);margin-top:24px}
.pdp .pdp-foe__steuer > :only-child{grid-column:1 / -1}
.pdp .pdp-foe__label{color:var(--typography-black);font-family:var(--font4);font-size:var(--schrift-14);font-weight:600;line-height:1.4;margin:0 0 8px;padding:0}
.pdp .pdp-foe__paket{border:0;display:flex;flex-wrap:wrap;gap:8px;margin:0;min-width:0;padding:0}
.pdp .pdp-foe__paket legend{float:left;width:100%}
.pdp .pdp-foe__paket input{opacity:0;pointer-events:none;position:absolute}
.pdp .pdp-foe__paket .tc__chip{position:relative}
.pdp .pdp-foe__paket .tc__chip:has(input:checked){border-color:var(--typography-black);box-shadow:inset 0 0 0 1px var(--typography-black);font-weight:600}
.pdp .pdp-foe__paket .tc__chip:has(input:focus-visible){outline:2px solid var(--typography-black);outline-offset:2px}
.pdp .pdp-foe__wo{align-self:end;margin:0}
.pdp .pdp-foe__wo label{font-size:var(--schrift-14);min-height:0}
.pdp .pdp-foe__wo select{width:100%}
/* Bundesland als Dropdown der Terminfilter (Denis 09.10.2026: kein natives select): volle Breite, Liste scrollt */
.pdp .pdp-foe__label{color:var(--typography-black);display:block;font-family:var(--font4);font-size:var(--schrift-14);font-weight:600;margin-bottom:8px}
.pdp .pdp-foe__filter{display:block;margin:0}
/* Die Terminfilter-Leiste scrollt mobil quer (overflow-x:auto) und schnitt das Panel ab: Knopf und Liste waren weg */
.pdp .pdp-termine__filter.pdp-foe__filter{display:block;flex-wrap:nowrap;margin:0;overflow:visible;padding:0}
.pdp .pdp-foe__filter .dates-table__filter{position:relative;width:100%}
.pdp .pdp-foe__filter .dates-table__filter-btn{justify-content:space-between;width:100%}
/* Liste mindestens so breit wie der längste Eintrag, ohne Umbruch, rechtsbündig unter dem Knopf; der Kasten schneidet
   nicht mehr ab (overflow:hidden stammte vom entfernten Scribble). Fokus als helle Hinterlegung statt schwarzem Ring. */
.pdp .pdp-foe__rechner{overflow:visible}
/* Alle Kinder des Kastens stehen auf z-index 1, der spätere Quellentext malte sich über die offene Liste */
.pdp .pdp-foe__steuer{align-items:start;z-index:5}
/* Dropdown-Panel als EINE weiße Karte (Suchfeld oben, darunter eine einzige scrollende Liste). Basis bleibt
   _course-dates.scss (.dates-table__filter-panel/-list/-suche); dort war die Liste die Karte und das Suchfeld
   schwebte darüber. Gilt für alle Filter der PDP, damit Termin- und Förderfilter gleich aussehen. */
.pdp .dates-table__filter-panel{background:var(--background-white);border-radius:16px;box-shadow:0 8px 28px rgba(39,37,42,.14);padding:10px}
.pdp .dates-table__filter-panel .dates-table__filter-list{background:none;border-radius:0;box-shadow:none;max-height:264px;padding:2px 0}
.pdp .dates-table__filter-panel .dates-table__filter-suche{margin:0 0 6px}
.pdp .pdp-foe__filter .dates-table__filter-panel{left:auto;min-width:max(100%,240px);right:0;z-index:30}
.pdp .pdp-foe__filter li[role="option"]{border-radius:8px;white-space:nowrap}
.pdp .pdp-foe__filter li[role="option"]:hover,.pdp .pdp-foe__filter li[role="option"]:focus{background:var(--orange-100);outline:0}
.pdp .pdp-foe__filter li[role="option"]:focus-visible{box-shadow:inset 0 0 0 2px var(--primary-300)}
.pdp .pdp-foe__filter li[aria-selected="true"]{font-weight:600}
.pdp .pdp-foe__filter li[hidden]{display:none}
.pdp .pdp-foe__filter .dates-table__filter-suche{box-sizing:border-box;width:100%}
.pdp .dates-table__filter-panel .dates-table__filter-list{overflow-x:hidden}
/* Liste klappt im Fluss auf (volle Breite unter dem Knopf). Als Overlay ragte sie mobil über den Rand und am Desktop
   über die Sektionskante, die seitlich clippt (gesehen 09.10.2026 mit Playwright, 390 und 1440 px). */
.pdp .pdp-foe__wo{display:block}
.pdp .pdp-foe__filter .dates-table__filter{display:block}
.pdp .pdp-foe__filter .dates-table__filter-btn{width:100%}
/* Lange Einträge („Alle Bundesländer (Qualifizierungschancengesetz)“) liefen mobil über den Knopf, Pfeil verschwand */
.pdp .pdp-foe__filter .dates-table__filter-btn > span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pdp .pdp-foe__filter .dates-table__filter-btn > svg{flex-shrink:0}
.pdp .pdp-foe__filter .dates-table__filter-panel{margin-top:8px;max-width:none;min-width:0;position:static;width:100%}
@media (max-width:767px){.pdp .pdp-foe__steuer{grid-template-columns:minmax(0,1fr)}}

/* Balken je Landesprogramm: ohne JavaScript voll gezeichnet, mit Bewegung füllen sie sich beim Einscrollen */
.pdp .pdp-foe__titel{margin-top:28px}
.pdp .pdp-foe__laender{display:flex;flex-direction:column;gap:6px;list-style:none;margin:0;padding:0}
.pdp .pdp-foe__land{align-items:center;background:transparent;border:1px solid transparent;border-radius:16px;color:var(--typography-black);column-gap:16px;cursor:default;display:grid;font-family:var(--font4);grid-template-areas:"name balken wert";grid-template-columns:minmax(0,13rem) minmax(0,1fr) auto;min-height:56px;padding:8px 12px;text-align:left;transition:background .2s,border-color .2s;width:100%}
.pdp .ist-js .pdp-foe__land{cursor:pointer}
.pdp .ist-js .pdp-foe__land:hover{background:var(--background-white)}
.pdp .pdp-foe__land:focus-visible{outline:2px solid var(--typography-black);outline-offset:2px}
.pdp .pdp-foe__land[aria-pressed="true"]{background:var(--background-white);border-color:var(--background-borders)}
.pdp .pdp-foe__land-name{display:flex;flex-direction:column;grid-area:name;line-height:1.3;min-width:0}
.pdp .pdp-foe__land-name strong{font-size:var(--schrift-16);font-weight:600}
.pdp .pdp-foe__land-name span{color:var(--typography-light-grey);font-size:var(--schrift-14)}
.pdp .pdp-foe__land-wert{font-size:var(--schrift-14);grid-area:wert;text-align:right;white-space:nowrap}
.pdp .pdp-foe__land-wert b{font-size:var(--schrift-16);font-variant-numeric:tabular-nums;font-weight:600}
.pdp .pdp-foe__balken{background:var(--background-white);border-radius:100px;display:block;grid-area:balken;height:10px;overflow:hidden}
.pdp .pdp-foe__land[aria-pressed="true"] .pdp-foe__balken{background:var(--orange-100)}
.pdp .pdp-foe__balken-f{background:var(--primary-300);border-radius:100px;display:block;height:100%;transform:scaleX(var(--s,0));transform-origin:left center;transition:transform .8s cubic-bezier(.2,.7,.2,1);width:100%}
@media (max-width:767px){
	.pdp .pdp-foe__land{grid-template-areas:"name wert" "balken balken";grid-template-columns:minmax(0,1fr) auto;padding:10px;row-gap:8px}
}
.pdp .pdp-foe__fuss{margin-top:20px}

/* Kurs mit QCG: Fristleiste (Muster Zeitleiste, waagerecht; mobil senkrecht) */
.pdp .pdp-foe__frist{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr));list-style:none;margin:0;padding:0;position:relative}
.pdp .pdp-foe__frist::before,.pdp .pdp-foe__frist::after{background:var(--background-white);content:"";height:3px;left:8px;position:absolute;right:calc(33.3% - 8px);top:7px}
.pdp .pdp-foe__frist::after{background:var(--primary-300);right:auto;transform-origin:left center;transition:transform 1.1s cubic-bezier(.2,.7,.2,1);width:calc(66.6% - 8px)}
.pdp .pdp-foe__frist li{color:var(--typography-black);display:flex;flex-direction:column;font-family:var(--font4);font-size:var(--schrift-14);gap:2px;line-height:1.4;position:relative}
.pdp .pdp-foe__frist strong{font-size:var(--schrift-16);font-weight:600;margin-top:12px}
.pdp .pdp-foe__frist span:not(.pdp-foe__frist-punkt){color:var(--typography-dark-grey)}
.pdp .pdp-foe__frist-punkt{background:var(--primary-300);border:3px solid var(--orange-100);border-radius:50%;box-sizing:content-box;height:10px;width:10px}
@media (max-width:767px){
	.pdp .pdp-foe__frist{gap:18px;grid-template-columns:minmax(0,1fr);padding-left:28px}
	.pdp .pdp-foe__frist::before,.pdp .pdp-foe__frist::after{bottom:8px;height:auto;left:7px;right:auto;top:8px;width:3px}
	.pdp .pdp-foe__frist::after{height:calc(100% - 16px);transform-origin:center top;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
	.pdp .pdp-foe__frist-punkt{left:-28px;position:absolute;top:2px}
	.pdp .pdp-foe__frist strong{margin-top:0}
}

/* Bewegung (pdp.js setzt .ist-bewegt nur ohne prefers-reduced-motion): vor dem Einscrollen leer */
.pdp .ist-bewegt .pdp-foe__laender:not(.ist-sichtbar) .pdp-foe__balken-f,.pdp .ist-bewegt .pdp-foe__split:not(.ist-sichtbar) .pdp-foe__split-land{transform:scaleX(0)}
.pdp .ist-bewegt .pdp-foe__frist:not(.ist-sichtbar)::after{transform:scaleX(0)}
@media (max-width:767px){.pdp .ist-bewegt .pdp-foe__frist:not(.ist-sichtbar)::after{transform:scaleY(0)}}
@media (prefers-reduced-motion:reduce){
	.pdp .pdp-foe__balken-f,.pdp .pdp-foe__split-land,.pdp .pdp-foe__frist::after{transition:none}
	.pdp .pdp-foe__ergebnis.ist-neu{animation:none}
}

/* hidden schlägt die eigenen display-Werte (Theme-Regel 5) */
.pdp .pdp-foe [hidden]{display:none}

/* Foerder-Rechner schlank (Denis 09.10.2026): kleinere Zahl, weniger Innenabstand, Laenderliste zugeklappt */
.pdp .pdp-foe__rechner{padding:clamp(20px,2.4vw,32px)}
.pdp .pdp-foe__zahl{font-size:var(--schrift-h3);margin:0 0 4px}
/* Keine Überzeile (Denis 09.10.2026: „Texte klatschen aneinander“): „Zuschuss bis zu“ bzw. „ab“ steht in der Zeile
   des Betrags, der Satz darunter bekommt Luft und tritt in Grau zurück, die Legende danach Abstand. */
.pdp .pdp-foe__klein{display:inline-block;margin-right:8px}
.pdp .pdp-foe__zahl{display:inline-block;margin:0}
.pdp .pdp-foe__satz{color:var(--typography-dark-grey);margin-top:12px}
.pdp .pdp-foe__split{margin-top:20px}
.pdp .pdp-foe__alle{margin-top:20px}
.pdp .pdp-foe__alle > summary{list-style:none}
.pdp .pdp-foe__alle > summary::-webkit-details-marker{display:none}
.pdp .pdp-foe__alle[open] > summary{margin-bottom:12px}
/* Kaufleiste auf kleinen Handys: „Termin wählen“ statt „Termin wählen und buchen“, sonst ragt der Text aus dem Knopf */
.pdp .pdp-leiste__lang{font-weight:inherit}
@media (max-width:420px){.pdp .pdp-leiste .button .pdp-leiste__lang{display:none}}
/* Abschnittsüberschriften nur an Wortgrenzen umbrechen (mobil trennte der Browser „Pre-mium“ und die Markierung „Pa-ket“) */
.pdp .pdp-titel{-webkit-hyphens:manual;hyphens:manual;overflow-wrap:break-word}
.pdp .pdp-titel .hb-mark{white-space:nowrap}
/* „In beiden Paketen“ auf kleinen Handys einspaltig, zwei Spalten à 144 px trennten „ei-nem“ und „zugelasse-ner“ */
@media (max-width:420px){.pdp .pdp-basis__liste{grid-template-columns:minmax(0,1fr)}}
/* Faktensatz wie der Fließtext darunter (Denis 09.10.2026: „unterscheiden sich von Größe und Farbe“): gleiches Grau, Kurs und Fernlehrgang */
.pdp .pdp-faktensatz{color:var(--typography-dark-grey);font-family:var(--font4);font-size:var(--schrift-20);line-height:1.6}
@media (max-width:767px){.pdp .pdp-faktensatz{font-size:var(--schrift-16);line-height:1.5}}
/* Mitlaufende Kästen unter Header (--hh, Theme) UND fixierter Kapitel-Navigation (ca. 69px), plus Luft.
   Vorher top:24px: der Kaufkasten rutschte unter die Navigation (Denis 09.10.2026). */
.pdp{--pdp-sticky:calc(var(--hh,0px) + 82px)}
.pdp .pdp-kauf__seite{top:var(--pdp-sticky)}
/* Xenia nur dort, wo sie mitläuft (ab 992 px). Mobil ist sie position:relative, dort schob top das Bild 162 px über
   die Überschrift „Über 150.000 Pflegekräfte“ (Denis 09.10.2026). */
@media (min-width:992px){.pdp-v98 .pdp-band__xenia{top:var(--pdp-sticky)}}
/* Teamkarte im Ablauf nicht mitlaufen lassen: sie ist fast so hoch wie die Sektion, mit dem groesseren Abstand
   ragte das Foto unten heraus (Denis 09.10.2026: „zerschossen“). */
@media (min-width:992px){.pdp .pdp-ablauf__team{position:relative;top:auto}}
/* Sprungnavigation wie auf den Hubs (Denis 09.10.2026). Regeln 1:1 aus assets/hoeher/hubs.css (.sn, Block
   acf-blocks/hoeher-sprungnav), hier kopiert, weil hubs.css nur auf den Hubs laedt. */
.sn{position:sticky;top:var(--hh,64px);z-index:900;background:var(--background-white);border-bottom:1px solid var(--background-borders)}
.sn__inner{display:grid;grid-template-columns:repeat(12,1fr);grid-gap:24px;align-items:center;height:58px}
.sn__links{grid-column:1 / span 7;display:flex;align-items:center;gap:1.75rem;overflow-x:auto;scrollbar-width:none;white-space:nowrap;flex:1;min-width:0}
.sn__links::-webkit-scrollbar{display:none}
.sn__link{position:relative;font-family:var(--font4);font-size:var(--schrift-16);line-height:1;color:var(--typography-dark-grey);text-decoration:none;padding:6px 0;border-bottom:2px solid transparent;transition:color .15s ease,border-color .15s ease}
.sn__link::after{content:"";position:absolute;left:-6px;right:-6px;top:50%;height:44px;transform:translateY(-50%)}
.sn__link:hover{color:var(--typography-black)}
.sn__link[aria-current="true"]{color:var(--typography-black);border-bottom-color:var(--primary-300)}
.sn__cta{grid-column:8 / span 5;display:flex;align-items:center;justify-content:flex-end;gap:32px;justify-self:stretch}
.sn__cta .button{white-space:nowrap;flex:0 0 auto;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.sn__trust{flex:0 1 auto;overflow:hidden;display:flex;align-items:baseline;gap:6px;white-space:nowrap}
.sn__trust-wert{font-family:var(--font4);font-weight:600;font-size:var(--schrift-16);color:var(--typography-black)}
.sn__stern{width:15px;height:15px;display:block;color:var(--primary-300);align-self:center}
.sn__trust-text{font-family:var(--font4);font-size:var(--schrift-14);color:var(--typography-dark-grey)}
@media (max-width:1150px){.sn__trust-text{display:none}}
/* PDP hat 7 Ziele statt der Hub-Auswahl: bis 1280px schnitt „Erfahrungen“ ab (Playwright 1037px, 09.10.2026).
   Dort fällt der Beleg weg und die Links rücken enger, der CTA bleibt. */
@media (min-width:901px) and (max-width:1279px){.pdp .sn__trust{display:none}.pdp .sn__links{gap:1.1rem;grid-column:1 / span 8}.pdp .sn__cta{grid-column:9 / span 4}.pdp .sn__link{font-size:var(--schrift-14)}}
@media (max-width:900px){.sn__cta{display:none}.sn__inner{height:52px}.sn .container{position:relative}
	.sn .container::after{content:"";position:absolute;top:0;bottom:1px;right:0;width:44px;pointer-events:none;background:linear-gradient(to right,rgba(255,255,255,0),var(--background-white))}}
/* Sprungziele nicht unter Header + Leiste */
.pdp [id]{scroll-margin-top:calc(var(--hh,64px) + 74px)}
/* Am Desktop traegt die Leiste oben den CTA, die Kaufleiste unten waere eine zweite mitlaufende Wiederholung */
@media (min-width:901px){.pdp .sticky-button-wrapper.pdp-leiste{display:none}}

/* Gelbes Siegel hinter der Bescheinigung, Bild 1:1 aus dem Checkout (frontend/src/styles/layout/_woocommerce.scss, data-value=abschlussbescheinigung) */
.pdp .pdp-siegel-ico{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAHoSURBVHgBnZTPLwNBFMe/s9l2kYhK3Ejswd2PuAgHDlxxdVBuUk04u1SPbn5z4z8of4C0l8ZFqETiaEUkDhL1s0xXx5tt1tpuu9v6XnZ25s1n3nvz3jAESFwsR1DgUTCRx6d2zMbW8372ahAQH/wAAlMAA0LFDM2M+ZkzjzdvZl/5KNOAqcyRRcK1QyAJtXSIkhLBt9AREjk2tG94gOJ0QSejNG3Q0YgYDPBwv50K5XfBVPWGYWWPdWhfvfavA1RKefxXwnz2AnnYqGMrXj9M3D9+uiebw09eoMqXESAJmkqcIb515V54F/O/GOtm34sp8ns0CLh9ZFjQ6EyPe4EqQWRjvRTlvEJ1tlQJe6Gw4ptXODl/dMFS2QdEJ7owO97lPU3WaqiYUGp5c333hkUKTUKkV9vHBjo7mhCf1OEnJtIUctjuBkcSMruWs76tLeWGOkoOWtDqEhkUtWmnsLOxBEFXa0FXKG9VQ7Xcwiob3k2WhzZQdsq3clPNXpaK7WVVtTCdDezcyqGTQ9mbNeQLkyrwdntYFzBYoW4v0FRzlEMDjUru4aVL+9f9fKUpjxrrtnpTtlNBzFVelLwANLNDK0ymtuFLu/z76LJAB7KxlFNSIsNG9nwf2OAXm9oJGs8QNAKubQSZ/wBCEctYSnUfUQAAAABJRU5ErkJggg==);background-repeat:no-repeat;background-size:20px 20px;display:inline-block;height:20px;margin-left:6px;vertical-align:-4px;width:20px}

/* Beratungs-Band in der Kaufsektion: dasselbe Bauteil wie auf /weiterbildungen/ (hoeher_band_html, Stil _expert-contact.scss).
   Abweichung nur im Rahmen: die Sektion bringt Breite und Rand schon mit, das Band fuellt die Spalte. */
.pdp .pdp-beraterband{background:none;margin:24px 0 0;padding:0}
.pdp .pdp-beraterband .expert-contact--band__container{max-width:none;width:100%}
@media (max-width:767px){.pdp .pdp-beraterband .expert-contact--band__cta,.pdp .pdp-beraterband .expert-contact--band__cta .button{width:100%}}
/* Auf der cremefarbenen Kaufsektion (Fernlehrgang) weisse Karte statt Beige auf Creme (Denis 09.10.2026: Farbe in Farbe) */
.pdp .pdp-beraterband--weiss .expert-contact--band__container{background:var(--background-white)}
.pdp .pdp-beraterband--weiss .expert-contact--band__gesicht{border-color:var(--background-white)}

/* Mobil-Feinschliff nach Denis' iPhone-Screenshots (09.10.2026) */
/* Kaufleiste über dem festen Trustami-Rahmen (Höhe misst pdp.js in --pdp-unten), auch beim Wegschieben */
body .pdp .sticky-button-wrapper.pdp-leiste{bottom:var(--pdp-unten,0px)}
body .pdp .sticky-button-wrapper.pdp-leiste.ist-verdeckt{transform:translateY(calc(110% + var(--pdp-unten,0px)))}
/* Bundesland-Feld neutral weiß wie die Paketwahl, auch nach der Wahl und nach dem Tippen (iOS hält :hover fest) */
.pdp .pdp-foe__filter .dates-table__filter-btn,.pdp .pdp-foe__filter .dates-table__filter-btn.is-active,.pdp .pdp-foe__filter .dates-table__filter-btn:hover{background:var(--background-white);border-color:var(--background-borders)}
@media (max-width:767px){
	/* Kaufbox: Start als graue Metazeile unter der Rate, Hinweis linksbündig und kleiner statt zentriertem Block */
	.pdp .pdp-kaufbox .pdp-kaufbox__start{color:var(--typography-dark-grey);font-size:var(--schrift-14);margin:4px 0 16px}
	.pdp .pdp-kaufbox .pdp-kaufbox__risiko{font-size:var(--schrift-14);line-height:1.45;margin-top:12px;text-align:left;text-wrap:pretty}
	/* Förderrechner: erst wählen (Paket, Bundesland), das Ergebnis steht direkt darunter. Vorher lag der Zuschuss nach
	   der Wahl oberhalb des Bildschirms, und der Kasten wuchs nach oben weg. */
	.pdp .pdp-foe__rechner{display:flex;flex-direction:column}
	.pdp .pdp-foe__steuer{margin:0 0 24px;order:-1}
	/* Siegelband als Laufband (Klone setzt pdp.js), Pause beim Berühren */
	.pdp .pdp-siegelband{overflow:hidden}
	.pdp .pdp-siegelband__liste--lauf{animation:pdp-siegel-lauf 38s linear infinite;margin-right:0;overflow:visible;padding-right:0;scroll-snap-type:none;width:max-content}
	.pdp .pdp-siegelband:active .pdp-siegelband__liste--lauf{animation-play-state:paused}
	.pdp .pdp-siegelband__liste--lauf .pdp-siegelband__item,.pdp .pdp-siegelband__liste--lauf .pdp-siegelband__item:first-child{border-left:var(--pdp-linie);max-width:none;padding:6px 20px}
}
@keyframes pdp-siegel-lauf{to{transform:translateX(-50%)}}/* Sprungnav mobil: ohne Kauf-Spalte nimmt die Linkleiste die volle Breite (wie hubs.css Z. 402). Vorher stand sie auf 7 von 12 Spalten, sichtbar waren nur Inhalte und Voraussetzungen (Denis 09.10.2026) */
@media (max-width:900px){.pdp .sn__links{grid-column:1 / -1}}
/* Mobil weniger feste Fläche oben (Denis 09.10.2026: Kopf plus Sprungnav, Kaufleiste und Trustami verdecken zu viel).
   Kopf: Logo und Menü brauchen 64 px, das Theme erzwang 80 (min-height 5rem plus 1rem Innenabstand unten); das
   Mobilmenü klappt schon bei 64 px auf. --hh misst stickyHeader.js aus offsetHeight, Sprungnav und Anker ziehen mit. */
@media (max-width:767px){
	.pdp .sn__inner{height:44px}
}
/* Video der Kaufbox läuft im Kasten (pdp.js imKasten, Denis 09.10.2026): Player in Kastenbreite, 16:9, Ecken wie das Vorschaubild */
.pdp .pdp-motiv--spielt{position:relative}
.pdp .pdp-motiv--spielt video{aspect-ratio:16/9;background:var(--typography-black);border-radius:inherit;display:block;height:auto;object-fit:contain;width:100%}.pdp .pdp-kaufbox .pdp-motiv--spielt{aspect-ratio:auto;background:transparent;height:auto}
/* Vertrauenszeile direkt unter dem Kaufknopf (Frühbucher-Designkonzept, Denis 15.10.2026): Bewertung und
   „Rechnung erst zum Start“ am Ort der Entscheidung. Teile umbrechen nur als Ganzes. */
.pdp .pdp-kaufbox__vertrauen{margin:10px 0 0;color:var(--typography-dark-grey);font-size:var(--schrift-14);line-height:1.45;text-align:center}
.pdp .pdp-kaufbox__vertrauen span{white-space:nowrap}