/* KERNVARO — gemeinsame Produktseite nach der Kita-Vorlage (inc/produkt-vorlage.php), 05.11.2026.
   Baut auf stil.css, produkte.css und produkt-kita.css auf (Bühne, Zahlen, Bereiche, Band, Ablauf, Vertrauen, Steckbrief,
   Preis, Schluss). Hier nur, was die übrigen Produkte anders brauchen: ihre Produktfarbe statt Kita-Lila (Variablen je
   Produkt im style-Attribut von .kseite.pv, Werte in inc/produkt-vorlage-daten.php) und die Bausteine ohne Kita-Gegenstück.
   Gilt nur unter .kseite.pv — die Kita-Seite lädt diese Datei nicht. Keine fremden Schriften oder Skripte. */
.kseite.pv{--k-licht:#d9c7ff;--k-blass:#efe8ff;--k-band:var(--k);--k-schatten:76,29,149}

/* Lila-Töne aus produkt-kita.css in der Produktfarbe */
.pv .kstage-buehne{box-shadow:0 50px 90px -50px rgba(var(--k-schatten),.7)}
.pv .kbereich::after{background:radial-gradient(circle,rgba(var(--k-schatten),.13),transparent 70%)}
.pv .kband{background:linear-gradient(135deg,var(--k-nacht) 0%,var(--k-dunkel) 52%,var(--k-band) 100%)}
.pv .kband .pkicker,.pv .kvertrauen .pkicker{color:var(--k-licht)}
.pv .kband .pkicker::before,.pv .kvertrauen .pkicker::before{background:var(--k-licht)}
.pv .kband-absatz,.pv .kappliste span,.pv .kband-hinweis{color:var(--k-blass)}
.pv .kband .store-knopf.aus{color:var(--k-blass)}
.pv .kband-marken,.pv .khandys-text{color:var(--k-licht)}
.pv .kband .store-knoepfe .store-knopf:not(.aus){background:#fff;color:var(--k-nacht);border-color:#fff}
.pv .kband .store-knoepfe .store-knopf:not(.aus):hover{background:var(--k-hell);border-color:var(--k-hell)}
.pv .store-knopf:not(.aus):hover{background:var(--k);border-color:var(--k)}
.pv .kbefehl .mono,.pv .kbefehl code::before{color:var(--k-licht)}
.pv .kbefehl button:hover{background:var(--k-hell)}
.pv .ksicher-punkt svg{color:var(--k-licht)}
.kseite.pv .kvertrauen .btn.hell:hover{background:var(--k-hell);border-color:var(--k-hell);color:var(--k-nacht)}
.pv .kschluss .kstern{color:rgba(var(--k-schatten),.2)}
.pv .kschluss-giraffe{box-shadow:0 30px 60px -30px rgba(var(--k-schatten),.5)}
.pv .kblick dt,.pv .kpaket .mono{color:var(--k-tief)}
.pv .ktag li{border-top-color:var(--k)}
.pv :focus-visible{outline-color:var(--k)}

/* Bühne ohne Web-Bild: zwei ganze Handys in der Farbfläche (NFC) oder das Produktsymbol (ohne Bilder) */
.pv .kstage.nur-handys,.pv .kstage.ohne-bild{padding:0}
.kstage-handys{position:relative;z-index:2;display:flex;justify-content:center;gap:22px;align-items:flex-start}
.kstage-handy2{flex:0 1 44%;max-width:230px;border:7px solid #14110f;border-radius:38px;background:#14110f;overflow:hidden;
  box-shadow:0 40px 70px -30px rgba(20,17,15,.7)}
.kstage-handy2:nth-child(2){margin-top:48px}
.kstage-handy2 img{display:block;width:100%;height:auto;border-radius:31px;background:#f6f4f0}
.pv .kstage.nur-handys .kstage-buehne{padding:40px 32px 56px}
.kstage-symbol{position:relative;z-index:2;display:grid;place-items:center;min-height:320px}
.kstage-symbol img{width:180px;height:180px;border-radius:44px;background:#fff;box-shadow:0 30px 60px -30px rgba(0,0,0,.55)}
@media(max-width:560px){
  .pv .kstage.nur-handys .kstage-buehne{padding:22px 18px 34px}
  .kstage-handys{gap:12px}.kstage-handy2{border-width:5px;border-radius:26px}.kstage-handy2 img{border-radius:21px}
  .kstage-handy2:nth-child(2){margin-top:28px}
  .kstage-symbol{min-height:220px}.kstage-symbol img{width:120px;height:120px;border-radius:30px}
}

/* Vier Startschritte (Installation aus dem Katalog) */
.kablauf.vier{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1100px){.kablauf.vier{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.kablauf.vier{grid-template-columns:1fr}}

/* Bestellkasten (fester Monatspreis) — gleich groß wie der Leistungskasten, gestaltet wie der Kita-Rechner */
.kbestell{background:#fff;border:2px solid var(--k);border-radius:24px;padding:30px;display:flex;flex-direction:column;gap:12px;
  justify-content:center;min-width:0;box-shadow:0 30px 60px -40px rgba(var(--k-schatten),.5)}
.kbestell .mono{color:var(--k-tief)}
.kbestell .btn{align-self:flex-start;margin-top:6px}
.kbestell .store-knoepfe{margin-top:6px}
.kbestell .krechner-ergebnis b{font-size:clamp(40px,4.6vw,60px)}
.kaus{cursor:default;opacity:.75}
.kaus:hover{background:transparent!important;color:var(--tinte)!important}
.kpaket-zeile{margin:0;font-size:clamp(20px,2vw,24px);font-weight:900;letter-spacing:-.03em;line-height:1.2}
.kpaket-text{margin:0;font-size:15px;line-height:1.55;color:#3a3530}
.kpaket .kpaket-fuss{margin-top:auto;align-self:flex-start}
.kpaket h3{margin:0;font-size:22px;font-weight:900;letter-spacing:-.03em}

/* Preistafel mit drei Karten (Lesehöhle): Karten gleich hoch, die hervorgehobene weiß mit Rahmen in der Produktfarbe */
.kpreis.ktafel{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1100px){.kpreis.ktafel{grid-template-columns:1fr}}
.kpaket.hervor{background:#fff;border:2px solid var(--k);box-shadow:0 30px 60px -40px rgba(var(--k-schatten),.5)}
.kpaket .store-knoepfe{margin-top:auto}

/* Apps im Band (Lesehöhle: Schulportal, Kinder-App, Lehrer-App) */
.kappliste.kapps{grid-template-columns:1fr}
.kappliste.kapps li{padding:16px 18px}
.kappliste.kapps b{font-size:16px}
.kappliste.kapps .store-knoepfe{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}

/* Abschnitte aus dem Katalog (Lesehöhle: Klassen, Schulen) */
.ktext{margin-top:22px;max-width:70ch}
.ktext p{margin:0 0 12px;font-size:16.5px;line-height:1.6;color:#3a3530}
.kbereich p{margin:0;font-size:14.5px;line-height:1.55;color:#3a3530}
.kbereich h3+p{margin-top:0}
.kbereiche.mit-bild{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1100px){.kbereiche.mit-bild{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.kbereiche.mit-bild{grid-template-columns:1fr}}
.kbereich-bild{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:16px;margin-bottom:4px;position:relative;z-index:1}
.kbereiche.mit-bild .kbereich h3{margin-top:14px}
.kliste{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:10px;max-width:80ch}
.kliste li{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.5}
.kliste svg{flex:none;width:18px;height:18px;color:var(--k);stroke-width:3;margin-top:2px}
.kvertrauen-liste{margin:22px 0 0;padding:0 0 0 20px;color:#c9c1b6;font-size:14.5px;line-height:1.6;max-width:80ch}

/* 13.11.2026 (Friseur): Rechenbeispiel mit kleinem Rechner (nur im Browser) und Zusätze (Import KI-Tool, Server-Service) */
.pv-rb{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 40px;margin-top:30px;align-items:start}
@media(max-width:900px){.pv-rb{grid-template-columns:1fr}}
.pv-rb-text p{margin:0 0 12px;font-size:16px;line-height:1.6;color:#3a3530}
.pv-rb-kasten{background:#fff;border:2px solid var(--k);border-radius:24px;padding:22px 24px;min-width:0;box-shadow:0 30px 60px -40px rgba(var(--k-schatten),.5)}
.pv-rb-tabelle{width:100%;border-collapse:collapse;font-size:15px}
.pv-rb-tabelle caption{text-align:left;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--k-tief);padding-bottom:10px}
.pv-rb-tabelle th{text-align:left;font-weight:500;color:#4a443e;padding:9px 10px 9px 0;border-top:1px solid var(--linie);vertical-align:middle}
.pv-rb-tabelle td{text-align:right;padding:9px 0 9px 8px;border-top:1px solid var(--linie);white-space:nowrap;vertical-align:middle}
.pv-rb-tabelle input{width:4.6em;font:inherit;text-align:right;padding:5px 8px;border:1px solid var(--k-rand);border-radius:10px;background:var(--k-hell)}
.pv-rb-tabelle b{font-weight:800}
.pv-rb-ergebnis b{font-size:18px;color:var(--k-tief)}
.pv-rb-anmerkung{max-width:90ch;line-height:1.55}
@media(max-width:520px){.pv-rb-kasten{padding:16px 14px}.pv-rb-tabelle{font-size:14px}.pv-rb-tabelle th{padding-right:6px}.pv-rb-tabelle input{width:3.8em}}
.pv-optionen .kpaket{scroll-margin-top:96px}
.pv-optionen .kpaket .kfein{margin:0;line-height:1.5}
