/* 2.79.1 Seite „Rehasport verordnet, und jetzt?“ im Kompass-Design (Variablen und Knöpfe aus kassen.css) und das A4-Blatt „Deine erste Stunde“ */
.sbvo-schritte { list-style: none; margin: 0 0 calc(24 * var(--sb-ab, 1px)); padding: 0; display: grid; gap: calc(14 * var(--sb-ab, 1px)); }
.sbvo-schritte > li { display: flex; gap: calc(18 * var(--sb-ab, 1px)); align-items: flex-start; margin: 0; padding: calc(20 * var(--sb-ab, 1px)) calc(24 * var(--sb-ab, 1px)); background: var(--sb-c-basis, #fff); border: 1.5px solid var(--sx-line, var(--sb-c-linie, #dfe6e6)); border-radius: calc(14 * var(--sb-rk, 1px)); }
.sbvo-schritte > li::before { content: none; }
.sbvo-nr { flex: none; width: 44px; height: 44px; border-radius: 50%; background: var(--sx-petrol-ink, var(--sb-c-akzent, #2c6b6b)); color: #fff; font-weight: 700; font-size: calc(1.25 * var(--sb-rem, 16px)); display: inline-flex; align-items: center; justify-content: center; }
.sbvo-schritte h2 { font-size: calc(1.35 * var(--sb-rem, 16px)) !important; margin: calc(6 * var(--sb-ab, 1px)) 0 calc(6 * var(--sb-ab, 1px)) !important; }
.sbvo-schritte p { margin: 0; font-size: calc(1.15 * var(--sb-rem, 16px)); line-height: 1.55; }
.sbvo-schritte .sbvo-knopf { margin-top: calc(14 * var(--sb-ab, 1px)); }
.sbvo .kk-hinweis { margin: 0 0 calc(8 * var(--sb-ab, 1px)); }
.sbvo-fragen { display: grid; gap: calc(10 * var(--sb-ab, 1px)); margin: 0 0 calc(28 * var(--sb-ab, 1px)); }
.sbvo-fragen details { background: var(--sb-c-basis, #fff); border: 1.5px solid var(--sx-line, var(--sb-c-linie, #dfe6e6)); border-radius: calc(12 * var(--sb-rk, 1px)); padding: 0 calc(20 * var(--sb-ab, 1px)); }
.sbvo-fragen summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: calc(12 * var(--sb-ab, 1px)); align-items: center; min-height: 58px; font-weight: 700; font-size: calc(1.15 * var(--sb-rem, 16px)); color: var(--sx-fg, var(--sb-c-schrift, #2f3434)); }
.sbvo-fragen summary::-webkit-details-marker { display: none; }
.sbvo-fragen summary::after { content: "+"; font-size: calc(1.5 * var(--sb-rem, 16px)); color: var(--sx-petrol-ink, var(--sb-c-akzent, #2c6b6b)); }
.sbvo-fragen details[open] summary::after { content: "–"; }
.sbvo-fragen details p { margin: 0 0 calc(18 * var(--sb-ab, 1px)); font-size: calc(1.125 * var(--sb-rem, 16px)); line-height: 1.55; }
.sbvo-blatt { display: grid; gap: calc(24 * var(--sb-ab, 1px)); align-items: start; margin: calc(30 * var(--sb-ab, 1px)) 0 0; padding: calc(26 * var(--sb-ab, 1px)); background: var(--sx-soft, color-mix(in srgb, var(--sb-c-hell, #419595) 9%, var(--sb-c-basis, #fff))); border-radius: calc(16 * var(--sb-rk, 1px)); }
.sbvo-blatt h2 { margin-top: 0 !important; }
.sbvo-blatt-text p { font-size: calc(1.15 * var(--sb-rem, 16px)); line-height: 1.55; }
.sbvo-knoepfe { display: flex; flex-wrap: wrap; gap: calc(12 * var(--sb-ab, 1px)); margin: calc(18 * var(--sb-ab, 1px)) 0 !important; }
.sbvo-klein { font-size: calc(1 * var(--sb-rem, 16px)) !important; color: var(--sx-muted, var(--sb-c-leise, #5f6b6b)); }
.sbvo-vorschau { container-type: inline-size; min-width: 0; }
.sbvo-papier { background: var(--sb-c-basis, #fff); border-radius: calc(6 * var(--sb-rk, 1px)); box-shadow: 0 6px 24px rgba(0, 0, 0, .12); overflow: hidden; aspect-ratio: 210 / 297; position: relative; }
.sbvo-papier .sbvo-a4 { position: absolute; top: 0; left: 0; transform-origin: 0 0; transform: scale(calc(100cqi / 794px)); }
@supports not (width: 1cqi) { .sbvo-papier { aspect-ratio: auto; } .sbvo-papier .sbvo-a4 { position: static; transform: none; width: auto; } }
@container kk (min-width: 860px) { .sbvo-blatt { grid-template-columns: minmax(0, 1fr) minmax(0, 360px); } }
@container kk (max-width: 600px) { .sbvo-schritte > li { padding: calc(16 * var(--sb-ab, 1px)); gap: calc(12 * var(--sb-ab, 1px)); } .sbvo-nr { width: 36px; height: 36px; font-size: calc(1.05 * var(--sb-rem, 16px)); } .sbvo-blatt { padding: calc(18 * var(--sb-ab, 1px)); } .sbvo-knoepfe .kk-btn { width: 100%; } }

/* Das Blatt selbst: feste A4-Breite (794 px = 210 mm bei 96 dpi), damit Vorschau, Druck und PDF gleich aussehen */
.sbvo-a4 { box-sizing: border-box; width: 794px; min-height: 1123px; padding: 56px 64px; background: #fff; color: #2f3434; font: 17px/1.5 "Source Sans 3", "Segoe UI", Arial, sans-serif; text-align: left; }
.sbvo-a4 * { box-sizing: border-box; }
.sbvo-a4-kopf { border-bottom: 4px solid #2c6b6b; padding-bottom: 16px; margin-bottom: 20px; }
.sbvo-a4-marke { margin: 0 0 6px !important; color: #9a5a1a; font-weight: 700; font-size: 14px !important; letter-spacing: .08em; text-transform: uppercase; }
.sbvo-a4 h2 { font: 700 34px/1.15 "Barlow Semi Condensed", "Arial Narrow", Arial, sans-serif !important; margin: 0 0 6px !important; color: #1f5252 !important; }
.sbvo-a4-unter { margin: 0 !important; color: #5f6b6b; font-size: 18px !important; }
.sbvo-felder { display: grid; grid-template-columns: 1fr 1fr; gap: calc(16 * var(--sb-ab, 1px)) calc(28 * var(--sb-ab, 1px)); margin: 0 0 calc(8 * var(--sb-ab, 1px)); padding: calc(18 * var(--sb-ab, 1px)) calc(20 * var(--sb-ab, 1px)); background: #f2f8f8; border-radius: calc(10 * var(--sb-rf, 1px)); }
.sbvo-f { display: flex; gap: calc(10 * var(--sb-ab, 1px)); align-items: flex-end; }
.sbvo-f span { white-space: nowrap; font-weight: 700; font-size: calc(15 * var(--sb-px, 1px)); }
.sbvo-f i { flex: 1; border-bottom: 1.5px solid #8a9696; height: 22px; }
.sbvo-a4 h3 { font: 700 21px/1.2 "Barlow Semi Condensed", "Arial Narrow", Arial, sans-serif !important; color: #1f5252 !important; margin: 24px 0 8px !important; }
.sbvo-a4 ul { margin: 0 !important; padding: 0 0 0 22px !important; }
.sbvo-a4 li { margin: 4px 0 !important; padding: 0 !important; font-size: 17px; list-style: disc !important; }
.sbvo-a4 li::before { content: none !important; }
.sbvo-a4-fuss { margin: 28px 0 0 !important; padding-top: 10px; border-top: 1px solid #dfe6e6; color: #6b7575; font-size: 13px !important; }

/* Eigene Druckseite (?blatt=1) */
.sbvo-druckseite { margin: 0; background: #e9eeee; }
.sbvo-druckseite .sbvo-a4 { margin: 0 auto 30px; box-shadow: 0 6px 24px rgba(0, 0, 0, .12); }
.sbvo-druck-leiste { text-align: center; margin: 0; padding: 14px; }
.sbvo-druck-leiste button { font: 700 17px/1 Arial, sans-serif; padding: 12px 28px; border: 0; border-radius: 10px; background: #2c6b6b; color: #fff; cursor: pointer; }
@media (max-width: 820px) { .sbvo-druckseite .sbvo-a4 { width: 100%; min-height: 0; padding: 28px 20px; } .sbvo-druckseite .sbvo-felder { grid-template-columns: 1fr; } }
@media print {
	@page { size: A4; margin: 0; }
	.sbvo-druckseite { background: var(--sb-c-basis, #fff); }
	.sbvo-druck-leiste { display: none; }
	.sbvo-druckseite .sbvo-a4 { width: 210mm; min-height: 0; height: 297mm; margin: 0; padding: 14mm 16mm; box-shadow: none; overflow: hidden; }
	.sbvo-druckseite .sbvo-felder { grid-template-columns: 1fr 1fr; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	.sbvo-blatt .kk-btn, .sbvo-knoepfe { display: none; }
}
