/* ============================================================
   Randori-Pro · AUSBILDUNG
   1. Block „Ausbildung mit System" (Masterbriefing 6.1) — steht auf
      Startseite, Standort-, Sportarten- und Kinderseiten. Immer
      sichtbar, nie eingeklappt, nie im Footer (Briefing 6.1, 9.5).
      Erkennungsmerkmal für das Prüfskript: data-ausbildung-anker="true".
   2. Seiten unter /ausbildung/ (Briefing Teil 7)
   3. Druckansicht — die Ausbildungsseiten werden ausgedruckt (Teil 7)
   Farben und Schriften aus tokens.css, mit Rückfallwerten, weil
   einige Seiten eigene Token-Sätze mitbringen.
   ============================================================ */

/* ── 1 · Block „Ausbildung mit System" ─────────────────────── */
.rp-ausb {
  background: #fff;
  color: var(--rp-tiefschwarz, #1A1414);
  padding: clamp(64px, 9vw, 120px) clamp(20px, 4vw, 40px);
  font-family: var(--font-body, "Plus Jakarta Sans", system-ui, sans-serif);
}
.rp-ausb__card {
  max-width: 1200px;
  margin: 0 auto;
  background: var(--rp-beige-deep, #ede4d2);
  border-radius: 28px;
  padding: clamp(32px, 5vw, 72px);
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: clamp(28px, 5vw, 80px);
  align-items: start;
}
.rp-ausb__kicker {
  font-family: var(--font-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--rp-rot-anker, #6D1723);
  margin: 0 0 22px;
  display: flex;
  align-items: center;
  gap: 14px;
}
.rp-ausb__kicker::before { content: ""; width: 40px; height: 1px; background: currentColor; }
.rp-ausb__h {
  font-family: var(--font-display, "Geist", system-ui, sans-serif);
  font-weight: 800;
  font-size: clamp(34px, 4.6vw, 64px);
  line-height: 0.96;
  letter-spacing: -0.03em;
  margin: 0;
  color: var(--rp-tiefschwarz, #1A1414);
  text-wrap: balance;
}
.rp-ausb__h em {
  font-family: var(--font-serif, "Source Serif 4", Georgia, serif);
  font-style: italic;
  font-weight: 400;
  color: var(--rp-rot-anker, #6D1723);
}
.rp-ausb__body p {
  font-size: 17px;
  line-height: 1.65;
  margin: 0 0 16px;
  color: #3A3333;
  max-width: 60ch;
}
.rp-ausb__body p:first-child { font-size: 19px; line-height: 1.55; color: var(--rp-tiefschwarz, #1A1414); }
.rp-ausb__steps {
  list-style: none;
  margin: 26px 0 30px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.rp-ausb__steps li {
  font-family: var(--font-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 11.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--rp-rot-anker, #6D1723);
  border: 1px solid rgba(109, 23, 35, 0.28);
  border-radius: 999px;
  padding: 8px 14px;
  background: rgba(255, 255, 255, 0.55);
}
/* Die Stufen führen auf die passende Stelle unter /ausbildung (Übergabe B4).
   Der Link füllt die ganze Pille, damit die Klickfläche der sichtbaren
   Fläche entspricht; Farbe und Form bleiben die der Pille. */
.rp-ausb__steps li:has(> a) { padding: 0; }
.rp-ausb__steps a.rp-ausb__step {
  display: block;
  padding: 8px 14px;
  border-radius: inherit;
  color: inherit;
  text-decoration: none;
  transition: background 200ms, color 200ms;
}
.rp-ausb__step:hover,
.rp-ausb__step:focus-visible { background: var(--rp-rot-anker, #6D1723); color: #fff; }
.rp-ausb__link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-display, "Geist", system-ui, sans-serif);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--rp-rot-anker, #6D1723);
  text-decoration: none;
  border: 1.5px solid var(--rp-rot-anker, #6D1723);
  border-radius: 999px;
  padding: 16px 28px;
  transition: background 200ms, color 200ms;
}
.rp-ausb__link:hover { background: var(--rp-rot-anker, #6D1723); color: #fff; }
@media (max-width: 860px) {
  .rp-ausb__card { grid-template-columns: 1fr; border-radius: 22px; }
  .rp-ausb__body p:first-child { font-size: 17.5px; }
}

/* ── 2 · Seiten unter /ausbildung/ ─────────────────────────── */
.az-page {
  margin: 0;
  background: #fff;
  color: var(--rp-tiefschwarz, #1A1414);
  font-family: var(--font-body, "Plus Jakarta Sans", system-ui, sans-serif);
  font-size: 17px;
  line-height: 1.65;
}
/* Grundlage wie css/site.css der übrigen Seiten, hier auf /ausbildung/ begrenzt */
.az-page *, .az-page *::before, .az-page *::after { box-sizing: border-box; }
.az-page a { color: inherit; text-decoration: none; }
.az-wrap { max-width: 1200px; margin: 0 auto; padding: 0 clamp(20px, 4vw, 40px); }
.az-narrow { max-width: 760px; }

.az-hero {
  background: var(--rp-tiefschwarz, #1A1414);
  color: #fff;
  padding: clamp(150px, 16vw, 210px) 0 clamp(64px, 8vw, 104px);
}
.az-crumbs {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.6);
  margin: 0 0 28px;
}
.az-crumbs a { color: rgba(255, 255, 255, 0.78); text-decoration: none; }
.az-crumbs a:hover { color: #fff; text-decoration: underline; }
.az-kicker {
  font-family: var(--font-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--rp-beige, #D4C9B5);
  margin: 0 0 24px;
  display: flex;
  align-items: center;
  gap: 14px;
}
.az-kicker::before { content: ""; width: 40px; height: 1px; background: var(--rp-rot-akzent, #DC0D1D); }
.az-hero h1 {
  font-family: var(--font-display, "Geist", system-ui, sans-serif);
  font-weight: 800;
  font-size: clamp(40px, 6.4vw, 92px);
  line-height: 0.95;
  letter-spacing: -0.035em;
  margin: 0 0 28px;
  max-width: 16ch;
  text-wrap: balance;
}
.az-hero h1 em { font-family: var(--font-serif, "Source Serif 4", Georgia, serif); font-style: italic; font-weight: 400; color: var(--rp-beige, #D4C9B5); }
.az-lede { font-size: clamp(18px, 1.6vw, 21px); line-height: 1.55; color: rgba(255, 255, 255, 0.86); max-width: 58ch; margin: 0; }
.az-lede + .az-lede { margin-top: 18px; }
.az-meta {
  margin: 36px 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 28px;
  font-size: 13.5px;
  color: rgba(255, 255, 255, 0.62);
}
.az-meta b { color: rgba(255, 255, 255, 0.9); font-weight: 600; }

.az-sec { padding: clamp(64px, 8vw, 112px) 0; }
.az-sec--beige { background: var(--rp-beige-deep, #ede4d2); }
.az-sec--dark { background: var(--rp-rot-anker, #6D1723); color: #fff; }
.az-sec + .az-sec:not(.az-sec--beige):not(.az-sec--dark) { padding-top: 0; }
/* Nach einer farbigen Sektion braucht die weiße Folgesektion ihren Abstand oben,
   sonst klebt der Kicker an der Farbkante */
.az-sec--beige + .az-sec:not(.az-sec--beige):not(.az-sec--dark),
.az-sec--dark + .az-sec:not(.az-sec--beige):not(.az-sec--dark) { padding-top: clamp(64px, 8vw, 112px); }
.az-h2 {
  font-family: var(--font-display, "Geist", system-ui, sans-serif);
  font-weight: 800;
  font-size: clamp(30px, 3.8vw, 52px);
  line-height: 1;
  letter-spacing: -0.03em;
  margin: 0 0 24px;
  text-wrap: balance;
}
.az-h2 em { font-family: var(--font-serif, "Source Serif 4", Georgia, serif); font-style: italic; font-weight: 400; color: var(--rp-rot-anker, #6D1723); }
.az-sec--dark .az-h2 em { color: var(--rp-beige, #D4C9B5); }
.az-h3 {
  font-family: var(--font-display, "Geist", system-ui, sans-serif);
  font-weight: 700;
  font-size: clamp(20px, 1.8vw, 24px);
  line-height: 1.2;
  letter-spacing: -0.015em;
  margin: 0 0 10px;
}
.az-sec p { margin: 0 0 16px; max-width: 68ch; }
/* Die Kicker-Zeile ist auch ein <p>: 68ch in Monoschrift sind nur ~490px —
   „Prüfungsprogramm Farbgurt · Stand Februar 2024" brach am Desktop um (07.10.2026). */
.az-sec p.az-kicker { max-width: none; }
.az-lead { font-size: 19px; line-height: 1.6; }
.az-sec--dark p { color: rgba(255, 255, 255, 0.88); }

/* Stufen (6.7) */
.az-steps { list-style: none; margin: 36px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; counter-reset: az; }
.az-steps li { background: #fff; border: 1px solid #E3DDD1; border-radius: 22px; padding: 26px 26px 24px; counter-increment: az; }
.az-sec--beige .az-steps li { border-color: transparent; }
.az-steps li::before { content: counter(az, decimal-leading-zero); display: block; font-family: var(--font-mono, "JetBrains Mono", monospace); font-size: 12px; letter-spacing: 0.18em; color: var(--rp-rot-akzent, #DC0D1D); margin-bottom: 14px; }
.az-steps li p { margin: 0; font-size: 16px; line-height: 1.55; color: #3A3333; }

/* Kacheln / Listen */
.az-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 32px; }
.az-card { display: block; background: #fff; border: 1px solid #E3DDD1; border-radius: 22px; padding: 28px; text-decoration: none; transition: transform 200ms, box-shadow 200ms; }
.az-card:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(26, 20, 20, 0.10); }
.az-card p { margin: 0; font-size: 15.5px; line-height: 1.55; color: #4A4343; }
.az-card .az-more { display: inline-block; margin-top: 14px; font-size: 13px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--rp-rot-anker, #6D1723); }
.az-list { list-style: none; margin: 28px 0 0; padding: 0; border-top: 1px solid rgba(26, 20, 20, 0.12); }
.az-list li { border-bottom: 1px solid rgba(26, 20, 20, 0.12); }
/* li a[href] wie in polish.css, damit die Liste dort nicht unterstrichen wird */
.az-list li a[href] { display: flex; justify-content: space-between; gap: 20px; padding: 18px 0; text-decoration: none; font-family: var(--font-display, "Geist", system-ui, sans-serif); font-weight: 600; font-size: clamp(17px, 1.5vw, 20px); }
.az-list a span { color: var(--rp-rot-anker, #6D1723); font-weight: 700; }
.az-list a:hover { color: var(--rp-rot-anker, #6D1723); }
.az-bullets { margin: 12px 0 20px; padding-left: 22px; }
.az-bullets li { margin: 0 0 8px; max-width: 64ch; }
.az-modules { columns: 2; column-gap: 40px; margin: 20px 0 0; padding-left: 22px; }
.az-modules li { margin: 0 0 8px; break-inside: avoid; }

/* Tabellen */
.az-table { width: 100%; max-width: 820px; border-collapse: collapse; margin: 18px 0 28px; font-size: 15.5px; }
.az-table caption { text-align: left; font-weight: 700; margin-bottom: 8px; }
.az-table th, .az-table td { text-align: left; padding: 12px 14px; border-bottom: 1px solid rgba(26, 20, 20, 0.12); vertical-align: top; }
.az-table thead th { font-family: var(--font-mono, "JetBrains Mono", monospace); font-size: 11.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--rp-rot-anker, #6D1723); font-weight: 500; border-bottom: 1.5px solid var(--rp-rot-anker, #6D1723); }
.az-table td.num, .az-table th.num { text-align: right; white-space: nowrap; }

/* Berufsbilder */
.az-beruf { padding: 40px 0; border-top: 1px solid rgba(26, 20, 20, 0.12); scroll-margin-top: 110px; }
.az-beruf:first-of-type { border-top: 0; }
.az-beruf__n { font-family: var(--font-mono, "JetBrains Mono", monospace); font-size: 12px; letter-spacing: 0.18em; color: var(--rp-rot-akzent, #DC0D1D); margin: 0 0 10px; }
.az-beruf h2 { font-family: var(--font-display, "Geist", system-ui, sans-serif); font-weight: 800; font-size: clamp(24px, 2.6vw, 34px); line-height: 1.1; letter-spacing: -0.02em; margin: 0 0 16px; max-width: 30ch; }
.az-beruf h3 { font-family: var(--font-display, "Geist", system-ui, sans-serif); font-size: 18px; margin: 22px 0 8px; }
.az-note { font-size: 14.5px; color: #5A5252; }

/* Schluss-CTA */
.az-cta { background: var(--rp-tiefschwarz, #1A1414); color: #fff; padding: clamp(72px, 9vw, 128px) 0; text-align: center; }
.az-cta .az-h2 { color: #fff; }
.az-cta .az-h2 em { color: var(--rp-beige, #D4C9B5); }
.az-cta p { margin: 0 auto 32px; max-width: 52ch; color: rgba(255, 255, 255, 0.82); }
.az-btn { display: inline-flex; align-items: center; gap: 10px; background: var(--rp-rot-akzent, #DC0D1D); color: #fff; font-family: var(--font-display, "Geist", system-ui, sans-serif); font-weight: 700; font-size: 14px; letter-spacing: 0.1em; text-transform: uppercase; padding: 22px 40px; border-radius: 999px; text-decoration: none; }
.az-btn:hover { background: #c40b1a; }
/* Handy: Text und Pfeil mittig in einer Zeile — vorher brach „Probetraining
   vereinbaren" bei 390px um und der Pfeil stand allein rechts (07.10.2026). */
@media (max-width: 480px) { .az-btn { justify-content: center; text-align: center; padding: 20px 22px; letter-spacing: 0.06em; } }
.az-cta .az-sub { margin-top: 20px; font-size: 14px; color: rgba(255, 255, 255, 0.6); }
.az-cta .az-sub a { color: rgba(255, 255, 255, 0.85); }

@media (max-width: 980px) {
  .az-steps, .az-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .az-steps, .az-grid { grid-template-columns: 1fr; }
  .az-modules { columns: 1; }
  .az-table { font-size: 14.5px; }
  .az-table th, .az-table td { padding: 10px 8px; }
  .az-table thead th { font-size: 10.5px; letter-spacing: 0.06em; }
  .az-table th.num { white-space: normal; }
  .az-table th { hyphens: manual; }
}
@media (max-width: 380px) {
  .az-table td.num { white-space: normal; }
  .az-table th, .az-table td { padding: 9px 5px; }
}

/* Markenname nicht am Bindestrich trennen („Randori-/Pro" am Zeilenende) */
.az-nw { white-space: nowrap; }

/* ── 3 · Druckansicht ──────────────────────────────────────── */
@media print {
  .rp-gnav, .rp-drawer, .rp-gfoot, .s-sticky, .rp-consent, noscript, .az-cta, .rp-ausb__link { display: none !important; }
  .az-page, .rp-ausb { background: #fff !important; color: #000 !important; font-size: 11pt; }
  .az-hero { background: #fff !important; color: #000 !important; padding: 0 0 12pt; border-bottom: 1.5pt solid #6D1723; }
  .az-hero h1, .az-lede, .az-meta, .az-meta b, .az-crumbs, .az-crumbs a, .az-kicker { color: #000 !important; }
  .az-hero h1 { font-size: 28pt; max-width: none; }
  .az-hero h1 em { color: #6D1723 !important; }
  .az-sec, .az-sec--beige, .az-sec--dark { background: #fff !important; color: #000 !important; padding: 14pt 0 !important; }
  .az-sec--dark p, .az-sec--dark .az-h2 em { color: #000 !important; }
  .az-h2 { font-size: 19pt; }
  .az-steps, .az-grid { grid-template-columns: repeat(2, 1fr); }
  .az-steps li, .az-card, .az-beruf, .az-table tr { break-inside: avoid; }
  .az-kicker, .az-h2, .az-h3, .az-beruf__n, .az-beruf h2 { break-after: avoid; page-break-after: avoid; }
  .az-card, .az-steps li { border: 0.6pt solid #999 !important; box-shadow: none !important; }
  .rp-ausb__card { background: #fff !important; border: 0.8pt solid #999; }
  a[href^="/"]::after { content: " (randori-pro.de" attr(href) ")"; font-size: 8.5pt; color: #555; }
  .az-list a::after, .az-crumbs a::after, .az-card::after, .rp-ausb__step::after { content: none !important; }
  @page { margin: 16mm 15mm; }
}