/* Anerkannte Qualifikationen (25. Oktober 2026): Liste aus Martinas PDF. Ruhig und lesbar: ein Block „Ja“ auf sandfarbener
   Fläche mit Berufen als Raster und zwei Karten für Prävention & Gesundheitsförderung, ein Block „Nein“ als schlichter Kasten,
   am Ende der Weg ins Kontaktformular. Mobile-first. */

.quali-hero .container > * + * { margin-top: var(--space-4); }
.quali-zurueck {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 44px;
  font-size: var(--fs-sm);
  font-weight: 500;
  color: var(--color-primary-dark);   /* 6.24:1 auf #FCF8EF */
  text-decoration: none;
}
/* Pfeil nach links als Gestaltung; der Text nennt das Ziel. */
.quali-zurueck::before {
  content: "";
  width: .5rem;
  height: .5rem;
  border-left: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
}
.quali-zurueck:hover { text-decoration: underline; text-underline-offset: .2em; }

/* Kleines Schild „Ja“ oder „Nein“ über der Überschrift. */
.quali-schild {
  display: inline-block;
  margin: 0 0 var(--space-3);
  padding: .2rem .8rem;
  border-radius: 999px;
  font-size: var(--fs-sm);
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.quali-schild--ja { background: var(--color-secondary-soft); color: var(--color-secondary-dark); }   /* 6.14:1, dunkel 7.77:1 */
.quali-schild--nein { background: var(--color-primary-soft); color: var(--color-primary-dark); }      /* 5.36:1, dunkel 7.16:1 */

.quali-ja h2 { margin: 0; }
.quali-label { margin: var(--space-3) 0 0; font-size: var(--fs-sm); font-weight: 600; color: var(--color-text-muted); }

/* Berufe als Raster kleiner Kacheln mit Häkchen: am Handy eine Spalte, ab 560 px zwei, ab 900 px drei. */
.quali-berufe {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2);
  margin: var(--space-4) 0 0;
  padding: 0;
  list-style: none;
}
.quali-berufe li,
.quali-punkte li {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  margin: 0;
  overflow-wrap: break-word;
  hyphens: auto;
}
.quali-berufe li {
  min-width: 0;
  padding: .6rem var(--space-4);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  font-weight: 500;
}
/* Häkchen als Gestaltung, wie im Vergleich Basis und Pro. */
.quali-berufe li::before,
.quali-punkte li::before {
  content: "";
  flex: none;
  width: .8rem;
  height: .42rem;
  margin-top: .45em;
  border-left: 2px solid var(--color-secondary-dark);
  border-bottom: 2px solid var(--color-secondary-dark);
  transform: rotate(-45deg);
}
@media (min-width: 560px) {
  .quali-berufe { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
  .quali-berufe li { padding: var(--space-3) var(--space-4); }
}
@media (min-width: 900px) {
  .quali-berufe { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.quali-ja .quali-praevention { margin-top: var(--space-8); }

/* Zwei Karten für Sport- und Ernährungswissenschaft, ab 760 px nebeneinander. */
.quali-karten { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-5); margin-top: var(--space-4); }
@media (min-width: 760px) {
  .quali-karten { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.quali-karte {
  min-width: 0;
  padding: var(--space-5);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}
@media (min-width: 640px) {
  .quali-karte { padding: var(--space-6); }
}
.quali-karte__name { margin: 0; font-size: var(--fs-lg); }
.quali-karte__note { margin: var(--space-2) 0 0; font-size: var(--fs-sm); font-style: italic; color: var(--color-primary-dark); }   /* 6.61:1 auf Weiß */
.quali-punkte {
  display: grid;
  gap: var(--space-2);
  margin: var(--space-4) 0 0;
  padding: var(--space-4) 0 0;
  list-style: none;
  border-top: 1px solid var(--color-border);
}
.quali-karte .quali-label + .quali-punkte { margin-top: var(--space-2); }
.quali-berufe--weitere { margin-top: var(--space-5); }

/* Nicht aufgenommen: schlichter Kasten mit gestrichelter Kante, damit er sich klar vom Ja-Block abhebt. */
.quali-nein__box {
  padding: var(--space-5);
  border: 1.5px dashed var(--color-border-strong);
  border-radius: var(--radius-lg);
}
@media (min-width: 640px) {
  .quali-nein__box { padding: var(--space-6) var(--space-8); }
}
.quali-nein__box h2 { margin: 0 0 var(--space-3); }
.quali-nein__box p:last-child { margin-bottom: 0; color: var(--color-text-muted); }

.quali-frage__text { margin: 0 auto; max-width: 34rem; font-size: var(--fs-lg); line-height: 1.5; text-wrap: balance; }
.quali-frage__knoepfe { justify-content: center; margin-top: var(--space-5); }