/* ==========================================================================
   Boxen – Variante A "Liste statt Karten" (30.09.2026)
   Kurs-Karten Startseite (.sms-level-card) und Kursstufen Kursseite (.sms-klv):
   keine Kästen, kein Farbkeil. Pistenfarbe nur als feine Linie oben, große Nummer.
   Lädt nach stilkur.css und kurse*.css. Rollback: zsh _snapshot-boxen-2026-09-30/restore-boxen.sh
   ========================================================================== */

/* --- Startseite: "Welcher Kurs passt zu dir?" ---------------------------- */
.sms-level-grid { gap: 28px; }
.sms-level-card,
.sms-level-card.sms-lv-green {
  background: none;
  border: 0;
  border-left: 1px solid #C9D8DF;
  border-radius: 0;
  box-shadow: none;
  padding: 4px 0 4px 22px;
}
.sms-level-card .sms-lv-age,
.sms-level-card.sms-lv-green .sms-lv-age {
  order: -1;
  margin: 0;
  padding: 0;
  background: none;
  clip-path: none;
  color: var(--wp--preset--color--primary);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.13em;
  opacity: 1;
}
.sms-level-card h3 {
  margin: 8px 0 10px;
  font-weight: 900;
  font-size: 1.9rem;
  line-height: 1;
}
.sms-level-card p { font-size: 0.92rem; line-height: 1.6; opacity: 1; }
@media (max-width: 640px) {
  .sms-level-grid { gap: 0; }
  .sms-level-card,
  .sms-level-card.sms-lv-green { border-left: 0; border-top: 1px solid #C9D8DF; padding: 16px 0 18px; }
}

/* --- Kursseite: Kursstufen ------------------------------------------------ */
.sms-kurse .sms-klv-grid { gap: 48px 56px; }
.sms-kurse .sms-klv {
  display: flex;
  flex-direction: column;
  padding: 18px 0 0;
  border: 0;
  border-top: 3px solid var(--wp--preset--color--secondary);
  background: none;
}
.sms-kurse .sms-klv:has(.sms-ktag-b) { border-top-color: #0E6FB0; }
.sms-kurse .sms-klv:has(.sms-ktag-r) { border-top-color: #C7402E; }
.sms-kurse .sms-klv:has(.sms-ktag-k) { border-top-color: var(--wp--preset--color--contrast); }
.sms-kurse .sms-klv .sms-ktag {
  order: 2;
  align-self: flex-start;
  margin: 0 0 10px;
  padding: 0;
  background: none;
  clip-path: none;
  color: var(--wp--preset--color--muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.13em;
}
.sms-kurse .sms-klv h4 { order: 1; margin: 0 0 4px; font-size: 1.6rem; }
.sms-kurse .sms-klv p { order: 3; font-size: 0.95rem; max-width: 34ch; }
.sms-kurse .sms-klv-no {
  display: block;
  margin-bottom: 10px;
  font-weight: 900;
  font-size: 4rem;
  line-height: 0.9;
  color: var(--wp--preset--color--primary);
}
@media (max-width: 640px) {
  .sms-kurse .sms-klv-grid { gap: 28px; }
  .sms-kurse .sms-klv { display: grid; grid-template-columns: 56px minmax(0, 1fr); column-gap: 14px; padding-top: 14px; }
  .sms-kurse .sms-klv h4 { grid-column: 1 / -1; }
  .sms-kurse .sms-klv:has(.sms-klv-no) h4 { display: contents; }
  .sms-kurse .sms-klv:has(.sms-klv-no) .sms-klv-no { grid-row: 1 / span 3; font-size: 3.2rem; margin: 0; }
  .sms-kurse .sms-klv .sms-ktag, .sms-kurse .sms-klv p { grid-column: 2; }
  /* Stufen K1–K5 und Level-Check: normale Spalte statt 56-px-Raster (sonst fällt die Aufzählung in die schmale Spalte) */
  .sms-kurse .sms-klv-4 .sms-klv { display: flex; flex-direction: column; }
  .sms-kurse .sms-klv-4 .sms-klv .sms-ktag, .sms-kurse .sms-klv-4 .sms-klv p { grid-column: auto; }
  .sms-kurse .sms-klv-4 .sms-klv .sms-klv-list { padding-left: 20px; max-width: none; }
}

/* --- Google-Bewertungen: Sterne als Grafik statt Schriftzeichen (01.10.2026) ---
   Manrope hat kein ★, die Ersatzschrift zeigt je nach Browser Rauten (�). Text bleibt für Screenreader (aria-label). */
.sms-rvw .sms-rvw-stars {
  display: block;
  width: 110px;
  height: 18px;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  font-size: 0;
  letter-spacing: 0;
  color: transparent;
  background-color: var(--wp--preset--color--secondary);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 18'%3E%3Cdefs%3E%3Cpath id='s' d='M9 .6l2.6 5.4 5.9.8-4.3 4.2 1 5.9L9 14.1 3.8 16.9l1-5.9L.5 6.8l5.9-.8z'/%3E%3C/defs%3E%3Cuse href='%23s'/%3E%3Cuse href='%23s' x='23'/%3E%3Cuse href='%23s' x='46'/%3E%3Cuse href='%23s' x='69'/%3E%3Cuse href='%23s' x='92'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 18'%3E%3Cdefs%3E%3Cpath id='s' d='M9 .6l2.6 5.4 5.9.8-4.3 4.2 1 5.9L9 14.1 3.8 16.9l1-5.9L.5 6.8l5.9-.8z'/%3E%3C/defs%3E%3Cuse href='%23s'/%3E%3Cuse href='%23s' x='23'/%3E%3Cuse href='%23s' x='46'/%3E%3Cuse href='%23s' x='69'/%3E%3Cuse href='%23s' x='92'/%3E%3C/svg%3E") center / contain no-repeat;
}