/* Quizergebnis teilen (Prototyp): Dialog nach der Auswertung und Ergebnisseiten; Erzeuger Prototypen/build-quiz-teilen.py. */

/* Dialog auf dunklem Grund (innerhalb .qv-quiz) */
.qt-teilen{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:26px;align-items:start;margin-top:26px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12);animation:qt-ein .5s var(--ease)}
.qt-vorschau{display:block;text-decoration:none;color:#9ccbea;font-size:.82rem}
.qt-vorschau img{display:block;width:100%;height:auto;border-radius:12px;border:1px solid rgba(255,255,255,.14);box-shadow:0 18px 40px rgba(0,0,0,.35);transition:transform .25s var(--ease)}
.qt-vorschau:hover img{transform:translateY(-3px)}
.qt-vorschau span{display:block;margin-top:8px}
.qt-vorschau a{color:#fff}
.qt-erkl{color:#b9cddb;font-size:.9rem;max-width:40em;margin:0 0 14px}
.qt-anlegen[disabled]{opacity:.6;cursor:wait}
.qt-label{display:block;font-family:var(--display);font-weight:600;font-size:1.35rem;color:#fff;margin-bottom:12px}
.qt-knoepfe{display:flex;flex-wrap:wrap;gap:8px}
.qt-k{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.05);color:#fff;font:inherit;font-weight:600;font-size:.92rem;text-decoration:none;cursor:pointer;transition:background .2s,border-color .2s}
.qt-k:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.4)}
.qt-k:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.qt-k svg{width:17px;height:17px;flex:none}
.qt-k.qt-linkedin{background:#0a66c2;border-color:#0a66c2}
.qt-k.qt-linkedin:hover{background:#0b5cad}
.qt-text{display:block;margin-top:16px}
.qt-text span{display:block;color:#9fb7c8;font-size:.82rem;margin-bottom:6px}
.qt-text textarea{width:100%;box-sizing:border-box;resize:vertical;min-height:84px;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:#03131f;color:#e6f0f7;font:inherit;font-size:.92rem;line-height:1.5}
.qt-text textarea:focus{outline:2px solid var(--orange);outline-offset:1px}
.qt-zeile{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:10px}
.qt-zeile small{color:#9fb7c8;font-size:.8rem;max-width:34em}
.qt-status{min-height:1.4em;margin:10px 0 0;color:#7fd1a8;font-size:.88rem}
.qt-fein{margin:4px 0 0;color:#7f98aa;font-size:.78rem}
.qt-lokal{margin:4px 0 8px;padding:8px 12px;border-radius:10px;background:rgba(240,125,26,.12);border:1px dashed rgba(240,125,26,.5);color:#f6c08f;font-size:.8rem}
@keyframes qt-ein{from{opacity:0;transform:translateY(8px)}}
@media (max-width:900px){.qt-teilen{grid-template-columns:minmax(0,1fr)}.qt-rechts{order:-1}.qt-vorschau{max-width:420px}.qt-text textarea{min-height:128px}}
@media (prefers-reduced-motion:reduce){.qt-teilen{animation:none}.qt-vorschau img{transition:none}}

/* Ergebnisseite */
.qt-seite{background:var(--navy);color:#e6f0f7;padding:150px 0 90px;position:relative;overflow:hidden}
.qt-seite::before{content:"";position:absolute;inset:auto -10% -40% auto;width:60vw;height:60vw;border-radius:50%;background:radial-gradient(circle,rgba(0,97,137,.45),transparent 65%);pointer-events:none}
.qt-seite .wrap{position:relative}
main:has(.qt-seite)+.site-footer{margin-top:0;border-top:1px solid rgba(255,255,255,.08)}
.qt-seite .crumbs,.qt-seite .crumbs a{color:#9ccbea}
.qt-seite .eyebrow{color:#9ccbea}
.qt-gross{font-family:var(--display);font-weight:600;line-height:.95;margin:10px 0 6px;color:#fff;font-size:clamp(3.4rem,10vw,7.5rem)}
.qt-gross b{color:var(--orange);font-weight:600}
.qt-seite h1{font-size:clamp(1.5rem,3.2vw,2.4rem);color:#fff;margin:0 0 14px;max-width:24em}
.qt-punkte{display:flex;gap:8px;list-style:none;padding:0;margin:18px 0 24px}
.qt-punkte li{width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,255,255,.35)}
.qt-punkte li.ok{background:var(--orange);border-color:var(--orange)}
.qt-seite .lead{color:#c9dbe7;max-width:40em}
.qt-aktionen{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.qt-aktionen .btn-line{color:#fff}
.qt-seite .qt-fein{margin-top:26px;color:#7f98aa}
@media (max-width:700px){.qt-seite{padding:120px 0 70px}}