/* ==========================================================================
   regiograph-schulung.de – Ergänzungen zu p17.css (Vorlage, unverändert übernommen)
   Nur Token aus p17.css verwenden. Eckig, keine Schatten, Farbmarkierung rechts.
   ========================================================================== */

/* --- Schriften: p17.css deklariert nur Oswald; Open Sans und Montserrat ergänzen --- */
@font-face{font-family:"Open Sans";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/open-sans-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Open Sans";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/open-sans-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Open Sans";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/open-sans-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/montserrat-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/montserrat-latin-700-normal.woff2") format("woff2")}

/* --- Font Awesome Pro Sharp Regular als Inline-SVG (fill=currentColor) --- */
.p17-icon[data-fa]{fill:currentColor;stroke:none}

/* --- Kopfzeile: Absender ist ein Link auf p17.de (L1) --- */
.p17-kopfzeile__absender a{color:inherit;text-decoration:none;display:inline-flex;align-items:inherit;gap:inherit}
.p17-kopfzeile__absender a:hover{text-decoration:underline;text-underline-offset:.2em}
.p17-kopfzeile__absender a:focus-visible{outline:3px solid currentColor;outline-offset:2px}
.p17-logo svg{display:block}
.p17-nav__eintrag,.p17-kopf__cta{white-space:nowrap}

/* --- Hero: Illustration rechts, kompakt bei geringer Höhe (CTA bei 1366×650 sichtbar) --- */
.p17-hero__bild{margin:0}
.p17-hero__bild img{display:block;width:100%;max-width:560px;height:auto;margin-inline:auto}
.p17-hero__bild figcaption{margin-top:.5rem;font-size:.8125rem;color:var(--p17-ink-muted);text-align:center}
@media (max-width: 749.98px){.p17-hero__bild{max-width:380px;margin-inline:auto}}
@media (min-width: 990px) and (max-height: 760px){
  .p17-hero>.container{padding-block:2rem}
  .p17-hero .p17-display--bereich{font-size:clamp(2.25rem,1.3rem + 2.4vw,3.25rem)}
  .p17-hero .p17-hero__text{gap:1rem}
  .p17-hero__bild img{max-width:420px}
}
.p17-hero--recht>.container{padding-block:3rem}
.p17-hero .breadcrumb{margin-bottom:1.5rem}

/* --- Das Wichtigste in Kürze: Kennzahlen mit Bezug --- */
.rs-kurz{margin-top:2.5rem}
.rs-kurz .p17-daten dd{font-size:1rem}

/* --- Editionen: Tabelle mit Shop-Link je Zeile --- */
.rs-editionen th[scope=row]{font-family:var(--p17-font-display);font-weight:500;font-size:1.25rem;white-space:nowrap}
.rs-editionen td ul{margin:0;padding-left:1.1rem}
.rs-editionen td a{white-space:nowrap}

/* --- Themenliste in zwei Spalten --- */
.rs-themen{display:grid;gap:0 2.5rem;grid-template-columns:repeat(auto-fit,minmax(min(22rem,100%),1fr));list-style:none;margin:0;padding:0}
.rs-themen li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.25rem .75rem;padding:1rem 0;border-top:1px solid var(--p17-line)}
.rs-themen li .p17-icon{grid-row:1/span 3;margin-top:.2rem;color:var(--p17-feld-strong)}
.rs-themen strong,.rs-themen span,.rs-themen small{grid-column:2}
.rs-themen strong{font-weight:600}
.rs-themen span{color:var(--p17-ink-muted)}
.rs-themen small{display:block;color:var(--p17-feld-strong);font-weight:600;font-size:.8125rem}

/* --- Schulungsformate als Liste mit Bezeichnung links --- */
.rs-formate{margin:0;display:grid;gap:0}
.rs-formate>div{display:grid;gap:.25rem 2rem;grid-template-columns:minmax(0,1fr);padding:1.25rem 0;border-top:1px solid var(--p17-line)}
.rs-formate>div:last-child{border-bottom:1px solid var(--p17-line)}
.rs-formate dt{font-family:var(--p17-font-display);font-weight:500;font-size:1.3125rem;line-height:1.3}
.rs-formate dt small{display:block;font-family:var(--p17-font-body);font-size:.875rem;font-weight:600;color:var(--p17-feld-strong);margin-top:.25rem}
.rs-formate dd{margin:0}
@media (min-width: 750px){.rs-formate>div{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}}

/* --- Ablauf mit Dauer je Schritt --- */
.rs-ablauf{list-style:none;counter-reset:rs-schritt;margin:0;padding:0;display:grid;gap:0}
.rs-ablauf li{counter-increment:rs-schritt;display:grid;grid-template-columns:3rem minmax(0,1fr);gap:.25rem 1rem;padding:1.25rem 0;border-top:1px solid var(--p17-line)}
.rs-ablauf li::before{content:counter(rs-schritt);grid-row:1/span 3;font-family:var(--p17-font-numeric);font-weight:700;font-size:1.5rem;color:var(--p17-feld-strong);font-variant-numeric:tabular-nums}
.rs-ablauf strong{font-weight:600;font-size:1.0625rem}
.rs-ablauf .rs-dauer{font-family:var(--p17-font-numeric);font-weight:600;font-size:.8125rem;letter-spacing:.06em;text-transform:uppercase;color:var(--p17-ink-muted)}

/* --- Video: eigenes Vorschaubild ohne Abruf bei YouTube --- */
.rs-videos{display:grid;gap:2.5rem 2rem;grid-template-columns:repeat(auto-fill,minmax(min(22rem,100%),1fr))}
.p17-video__vorschau{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-start;gap:.5rem;padding:1.25rem 7rem 1.5rem 1.5rem;background:var(--p17-anthrazit);border-right:var(--p17-edge-box) solid var(--p17-feld);color:#fff}
.p17-video__vorschau .p17-label{color:#fff;opacity:.85}
.p17-video__titel{font-family:var(--p17-font-display);font-weight:500;font-size:clamp(1.25rem,1rem + .8vw,1.625rem);line-height:1.15}
.p17-video .p17-video__start{align-items:flex-end;justify-content:flex-end;padding:1rem 1.25rem 1.25rem}
.p17-video .p17-video__start .p17-video__knopf{width:3.75rem;height:3.75rem}
.p17-video figcaption strong{color:var(--p17-ink);display:block;font-size:1rem;margin-bottom:.25rem}
.p17-video figcaption p{margin:0 0 .25rem}

/* --- Ansprechpartner-Bild, FAQ --- */
.rs-bild{margin:0}
.rs-bild img{display:block;width:100%;height:auto}
.rs-bild figcaption{margin-top:.5rem;font-size:.875rem;color:var(--p17-ink-muted)}
.p17-faq details>div{padding-bottom:1rem}
.p17-faq details>div>:last-child{margin-bottom:0}
.rs-stand{font-size:.875rem;color:var(--p17-ink-muted);margin:1rem 0 0}

/* --- Weiterführend als Liste --- */
.rs-weiter{list-style:none;margin:0;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(16rem,100%),1fr))}
.rs-weiter li{position:relative}
.rs-weiter p{margin:.25rem 0 0;color:var(--p17-ink-muted);font-size:.9375rem}

/* ==========================================================================
   Anfrage-Assistent (5 Schritte)
   ========================================================================== */
.p17-person img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;object-position:68% 30%}
.rs-fortschritt{list-style:none;margin:0 0 1.75rem;padding:0;display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;font-size:.875rem;color:var(--p17-ink-muted);counter-reset:rs-fs}
.rs-fortschritt li{counter-increment:rs-fs;display:flex;align-items:center;gap:.5rem;padding-bottom:.375rem;border-bottom:2px solid transparent}
.rs-fortschritt li::before{content:counter(rs-fs);font-family:var(--p17-font-numeric);font-weight:700;display:inline-grid;place-items:center;width:1.5rem;height:1.5rem;border:1px solid var(--p17-line-strong);font-size:.75rem}
.rs-fortschritt li[aria-current=step]{color:var(--p17-ink);font-weight:600;border-bottom-color:var(--p17-feld)}
.rs-fortschritt li[aria-current=step]::before{background:var(--p17-ink);border-color:var(--p17-ink);color:var(--p17-paper)}
.rs-fortschritt li.erledigt::before{content:"✓";border-color:var(--p17-ink);color:var(--p17-ink)}
.js .rs-schritt:not(.aktiv){display:none}
.rs-schritt{border:0;margin:0;padding:0;min-width:0}
.rs-schritt+.rs-schritt{margin-top:2.5rem}
.js .rs-schritt+.rs-schritt{margin-top:0}
.rs-schritt>legend{font-family:var(--p17-font-display);font-weight:500;font-size:clamp(1.375rem,1.2rem + .8vw,1.75rem);line-height:1.2;margin-bottom:.5rem;float:none;width:auto;padding:0}
.rs-schritt__hilfe{color:var(--p17-ink-muted);margin:0 0 1.25rem}
.rs-gruppe{border:0;margin:1.5rem 0 0;padding:0;min-width:0}
.rs-gruppe>legend,.rs-gruppe__label{font-weight:600;font-size:1rem;margin-bottom:.5rem;float:none;width:auto;padding:0}
.rs-gruppe small{display:block;font-weight:400;color:var(--p17-ink-muted);font-size:.875rem}
/* Mehrfachauswahl: Kästchen bleibt sichtbar, damit klar ist, dass mehrere gehen */
.rs-mehrfach .p17-wahl__optionen input{position:static;opacity:1;width:1.25rem;height:1.25rem;flex:none;accent-color:var(--p17-ink);margin:0}
.rs-mehrfach .p17-wahl__optionen label{align-items:flex-start}
.rs-mehrfach .p17-wahl__optionen--klein{grid-template-columns:repeat(auto-fill,minmax(min(10rem,100%),1fr))}
.rs-mehrfach .p17-wahl__optionen--klein label{min-height:3rem;align-items:center}
.p17-wahl__optionen label b{font-weight:600}
.rs-zahl{max-width:9rem}
.rs-hinweis{margin-top:1.25rem}
.rs-hinweis--warnung{background:var(--p17-surface);border:1px solid var(--p17-line-strong);border-right:var(--p17-edge-box) solid var(--p17-feld)}
.rs-hinweis .p17-icon{color:var(--p17-feld-strong);margin-right:.25rem}
.rs-navigation{display:flex;flex-wrap:wrap;gap:1rem 1.5rem;align-items:center;margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--p17-line)}
.rs-navigation__abstand{flex:1 1 auto}
.no-js .rs-navigation [data-rs-weiter],.no-js .rs-navigation [data-rs-zurueck]{display:none}
.rs-navigation [hidden]{display:none!important}
.rs-feldfehler{color:var(--p17-feld-strong);font-size:.875rem;font-weight:600;margin:.5rem 0 0}
.rs-feldfehler .p17-icon{margin-right:.25rem}
.p17-formular__danke:not([hidden]){display:grid;gap:.75rem}
.rs-anfrage[aria-busy=true] [type=submit]{opacity:.7;pointer-events:none}
.rs-anfrage .p17-formular__abschluss p{font-size:.875rem;color:var(--p17-ink-muted);margin:0}
.p17-honig{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ==========================================================================
   Einwilligung (Cookie-Einstellungen) als Modal – <dialog>
   Gleichwertige Buttons „Alle ablehnen“ / „Alle akzeptieren“ in der Feldfarbe.
   ========================================================================== */
.rs-consent{max-width:min(40rem,calc(100vw - 2rem));max-height:calc(100svh - 2rem);padding:0;border:1px solid var(--p17-line-strong);border-right:var(--p17-edge-box) solid var(--p17-feld);background:var(--p17-surface);color:var(--p17-ink);overflow:auto}
.rs-consent::backdrop{background:rgba(12,13,15,.5)}
.rs-consent__innen{padding:clamp(1.25rem,1rem + 1vw,2rem);display:grid;gap:1rem}
.rs-consent h2{font-size:clamp(1.375rem,1.2rem + .8vw,1.75rem);margin:0}
.rs-consent p{margin:0;font-size:.9375rem;line-height:1.55}
.rs-consent__knoepfe{display:flex;flex-wrap:wrap;gap:.75rem}
.rs-consent__knoepfe .btn{flex:1 1 12rem;justify-content:center}
.rs-consent .btn-consent{background:var(--p17-feld);color:var(--p17-on-feld);border:2px solid var(--p17-feld);font-weight:600;min-height:3rem}
.rs-consent .btn-consent:hover{background:var(--p17-feld-strong);border-color:var(--p17-feld-strong);color:var(--p17-on-feld)}
.rs-consent .btn-consent-einst{background:transparent;color:var(--p17-ink);border:2px solid var(--p17-line-strong);font-weight:600;min-height:3rem}
.rs-consent .btn-consent-einst:hover{border-color:var(--p17-ink)}
.rs-consent__links{font-size:.875rem;display:flex;gap:1rem;flex-wrap:wrap}
.rs-consent__kategorien{display:grid;gap:0;margin:0;padding:0;border:0}
.rs-consent__kategorie{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.25rem .75rem;padding:.875rem 0;border-top:1px solid var(--p17-line)}
.rs-consent__kategorie input{width:1.25rem;height:1.25rem;margin:.15rem 0 0;accent-color:var(--p17-ink)}
.rs-consent__kategorie label{font-weight:600}
.rs-consent__kategorie p{grid-column:2;font-size:.875rem;color:var(--p17-ink-muted)}
.rs-consent [hidden]{display:none!important}

/* --- Druck --- */
@media print{
  .p17-kopfzeile,.p17-kopf,.p17-telleiste,.p17-offcanvas,.rs-consent,.p17-hero__bild,.rs-videos{display:none!important}
}

/* ==========================================================================
   Hero mit Anfrageformular (das Formular ist das zentrale Element der Seite)
   ========================================================================== */
.rs-hero__raster{display:grid;gap:2.5rem;align-items:start}
@media (min-width: 990px){
  .rs-hero__raster{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:3rem}
  .rs-hero .p17-hero__text{position:sticky;top:calc(var(--p17-chrome-h, 5rem) + 1.5rem)}
}
.rs-hero .p17-display--bereich{font-size:clamp(2.25rem,1.4rem + 2.6vw,3.75rem)}
.rs-hero .p17-haken{gap:.5rem}
.rs-hero__tel .p17-tel{display:inline-flex}
.rs-hero__formular{scroll-margin-top:calc(var(--p17-chrome-h, 5rem) + 1rem)}
.rs-anfrage__titel{font-size:clamp(1.25rem,1.1rem + .5vw,1.5rem);margin:0 0 1rem}
@media (min-width: 990px) and (max-height: 760px){
  .rs-hero .p17-display--bereich{font-size:clamp(2rem,1.3rem + 2vw,2.75rem)}
  .rs-hero .p17-lead{font-size:1.0625rem;line-height:1.55}
  .rs-hero>.container{padding-block:1.5rem}
  .rs-hero__formular{padding:1.5rem 2rem}
  .rs-hero__formular .rs-anfrage__titel{margin-bottom:.5rem}
  .rs-hero__formular .rs-fortschritt{margin-bottom:1rem}
  .rs-hero__formular .rs-schritt__hilfe{margin-bottom:.75rem}
  .rs-hero__formular .rs-navigation{margin-top:1.25rem;padding-top:1rem}
}

/* --- Excel-Tipps --- */
.rs-videos--klein{grid-template-columns:repeat(auto-fill,minmax(min(17rem,100%),1fr));gap:2rem 1.5rem}
.rs-videos--klein .p17-video__titel{font-size:1.25rem}
.rs-videos--klein .p17-video__vorschau{padding:1rem 5rem 1rem 1.25rem}
.rs-videos--klein .p17-video .p17-video__start .p17-video__knopf{width:3rem;height:3rem}
.rs-beispiel td,.rs-beispiel th{white-space:nowrap;font-variant-numeric:tabular-nums}
.rs-beispiel caption{caption-side:top;font-size:.875rem;color:var(--p17-ink-muted);padding:0 0 .5rem}
#excel-daten h3{margin-top:2rem}
#excel-daten h3:first-child{margin-top:0}
#excel-daten .p17-tabelle-rahmen{margin-block:1rem 1.5rem}
code{font-size:.9375em;background:var(--p17-surface);border:1px solid var(--p17-line);padding:.05em .3em;color:var(--p17-ink)}

/* --- Editionen-Tabelle mobil: vier Spalten als Block je Edition (p17-tabelle--stapeln ist nur für drei Spalten gebaut) --- */
@media (max-width: 749.98px){
  .rs-editionen tr{display:block;padding-block:1rem}
  .rs-editionen th[scope=row]{display:block;padding:0 0 .5rem;white-space:normal}
  .rs-editionen td,.rs-editionen td:nth-child(2){display:block;grid-row:auto;padding:.25rem 0;font-size:1rem;color:var(--p17-ink)}
  .rs-editionen td::before{content:attr(data-label);display:block;font-family:var(--p17-font-numeric);font-weight:600;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--p17-ink-muted)}
  .rs-editionen td + td{margin-top:.5rem}
}

/* --- Überschriften: Silbentrennung nur bei langen Wörtern (Chrome auf Android trennt sonst auch kurze Wörter) --- */
h1,h2,h3,.p17-display{hyphenate-limit-chars:12 5 5}
.p17-label{overflow-wrap:normal}

/* --- Abstand zwischen Überschrift und folgendem Text in Spalten ohne Abschnittskopf --- */
.col-lg-7>.p17-label+h2,.col-lg-5>.p17-label+h2{margin-top:.5rem}
.col-lg-7>h2+p,.col-lg-5>h2+p{margin-top:.75rem}
.rs-beispiel__titel{font-size:.875rem;color:var(--p17-ink-muted);margin:1.5rem 0 .5rem}
#excel-daten .rs-beispiel__titel+.p17-tabelle-rahmen{margin-top:0}
@media (min-width: 750px){.rs-wischen{display:none}}

/* --- Anfrageformular mobil einspaltig: lange Begriffe passen in die Kacheln, Antippen ist eindeutiger --- */
@media (max-width: 749.98px){
  .rs-anfrage .p17-wahl .p17-wahl__optionen,
  .rs-anfrage .p17-wahl .p17-wahl__optionen--klein{grid-template-columns:minmax(0,1fr);gap:.5rem}
  .rs-anfrage .p17-wahl__optionen label{min-height:3rem}
}