/* ==========================================================================
   Copy v2: Ergänzungen zu site.css (Stand 20.10.2026)
   Nur neue Klassen, nichts an bestehenden Regeln überschrieben.
   Review-Markierungen (.ph, .review-note) am 2026-11-11 vor dem Launch entfernt.
   ========================================================================== */

/* ---------- Silbentrennung für lange Einzelwörter ----------
   Behebt einen schon im Original vorhandenen Überlauf: „Kennenlernen“ (Schrittkarte, 1024 px)
   und „Suprakonstruktionen“ (Leistungskarte, 768 px). Greift nur, wenn ein Wort nicht passt. */
.step .h3, .card-big .h3 { hyphens: auto; -webkit-hyphens: auto; }

/* ---------- Mehrzeilige Häkchen-Listen (Karriereseite) ---------- */
.page-karriere .job li { align-items: flex-start; }
.page-karriere .job li .ico { flex: none; margin-top: 5px; }

/* ---------- Karriereseite: Himmel-Panel als Seitenkopf ---------- */
.page-karriere main { padding-top: 12px; }
.page-karriere .sky-panel { padding: 176px 0 104px; }
.page-karriere .sky-panel::before { height: 520px; }
.sky-panel h1 { text-align: center; }
.nowrap { white-space: nowrap; }
.sky-panel .kicker { display: flex; justify-content: center; margin-bottom: 24px; }
.sky-panel .kicker .tag { align-self: center; }
.sky-panel .hero-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 28px; }
.ccard.is-fact { min-height: 0; }
.ccard.is-fact ul { margin-top: 16px; }

@media (max-width: 767px) {
  .page-karriere .sky-panel { padding: 132px 0 48px; }
  .page-karriere .sky-panel h1 { padding: 0 16px; font-size: 40px; } /* „Zahntechniker/-in“ ist bei 54 px breiter als 375 px */
  .sky-panel .hero-actions { padding: 0 20px; }
  .sky-panel .hero-actions .btn { width: 100%; }
  .review-note { left: 8px; right: 8px; max-width: none; }
}