/* Hilfe-Seiten — ergänzt assets/style.css der Website (dieselben Farben und Abstände). */
.topics{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;margin-top:44px}
.topic{display:flex;flex-direction:column;gap:10px;border-radius:var(--r);padding:28px;background:var(--mist);min-height:180px;transition:transform 250ms var(--ease-out)}
.topic h3{font-size:23px;line-height:1.15;letter-spacing:-.3px}
.topic p{color:#3d5552;font-size:17px}
.topic .more{margin-top:auto;font-weight:800;color:var(--teal-d)}
.topic .more::before{content:"▶ "}
@media(hover:hover) and (pointer:fine){.topic:hover{transform:translateY(-4px)}}
.empty{margin-top:34px;font-size:19px;color:#3d5552}
.article{max-width:820px}
.player{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:var(--ink);margin:0 0 40px}
.player iframe,.player video{position:absolute;inset:0;width:100%;height:100%;border:0}
.body{font-size:19px;line-height:1.6;color:#22302e}
.body p+p,.body p+ol,.body p+ul,.body ol+p,.body ul+p{margin-top:16px}
.body ol,.body ul{padding-left:1.4em;display:grid;gap:8px}
.back{display:inline-block;margin-top:44px;font-weight:800;color:var(--teal-d)}
@media(max-width:560px){.topics{grid-template-columns:1fr}.body{font-size:17px}}
.login{display:grid;gap:22px;justify-items:start}
.login .empty{margin-top:0}
.error{color:#B42318;font-weight:700;font-size:17px}
.group+.group{margin-top:64px}
.group-title{font-size:clamp(26px,3vw,36px);letter-spacing:-.5px}
.group .topics{margin-top:22px}
.player-wrap{margin:0 0 40px}
.player-wrap .player{margin:0}
.video-nr{margin-top:10px;font-weight:800;color:var(--teal-d);font-size:15px}
body.embed{background:var(--ink);margin:0;min-height:100vh;display:grid;place-items:center;padding:0}
body.embed .player-wrap{margin:0;width:100%}
body.embed .player{border-radius:0}
body.embed .video-nr{color:#B9F3DF;padding:0 12px 8px}
body.embed .empty{color:#d8f1ea;padding:24px;text-align:center}
.body h3{font-size:23px;margin:32px 0 12px;letter-spacing:-.3px}
.hero-video-nr{display:inline-block;margin-top:14px;padding:6px 14px;border-radius:999px;background:rgba(255,255,255,.14);font-weight:800;font-size:15px}
.article .ricos-content{font-size:18px;color:#22302e}
.article .ricos-content,.article .ricos-content *{font-family:var(--font)!important}
.article .ricos-content p,.article .ricos-content li{font-size:18px;line-height:1.6}
body.guide{background:var(--paper);margin:0;padding:20px 20px 40px}
body.guide .guide-title{font-size:26px;line-height:1.15;letter-spacing:-.4px;margin:0 0 6px}
body.guide .video-nr{margin:0 0 14px}
body.guide .empty{text-align:center;margin-top:40px}
.article .ricos-content h2,.article .ricos-content h3{font-family:var(--font)!important;font-weight:800!important;font-size:22px!important;letter-spacing:-.3px;margin-top:22px!important}
.topic .published{align-self:flex-start;background:var(--coral);color:#fff;font-weight:800;font-size:13px;padding:4px 10px;border-radius:999px}
.published-hero{margin-left:8px;background:var(--coral)!important}
/* Im Fenster der Kasse (Info-Dialog, Neuigkeiten) etwas kleiner (Jani, 2026-10-24). */
body.guide .guide-title{font-size:21px}
body.guide .article .ricos-content,body.guide .article .ricos-content p,body.guide .article .ricos-content li{font-size:15px!important;line-height:1.5}
body.guide .article .ricos-content h2,body.guide .article .ricos-content h3{font-size:18px!important;margin-top:18px!important}
body.guide .video-nr{font-size:13px}
/* Im Fenster der Kasse ohne eigene Fläche: Es gilt die Farbe der Kachel bzw. des Dialogs dahinter. */
html:has(body.guide),body.guide{background:transparent!important}
/* Beitrag als fertiges HTML (lib/ricosHtml.ts) statt Wix-Viewer. */
.ricos-content p{margin:0 0 14px}
.ricos-content h2,.ricos-content h3,.ricos-content h4{font-weight:800;margin:26px 0 10px;line-height:1.2}
.ricos-content h2{font-size:22px}.ricos-content h3,.ricos-content h4{font-size:19px}
.ricos-content ol,.ricos-content ul{margin:0 0 16px;padding-left:1.4em}
.ricos-content li{margin:0 0 8px}
.ricos-content li p{margin:0}
.ricos-content a{color:var(--teal-d);font-weight:700}
.ricos-content blockquote{margin:0 0 16px;padding:10px 16px;border-radius:12px;background:rgba(0,0,0,.04)}
.ricos-content hr{border:0;height:1px;background:rgba(0,0,0,.12);margin:22px 0}
.ricos-content .rich-image{margin:0 0 18px}
.ricos-content .rich-image img{display:block;max-width:100%;height:auto;border-radius:14px}
.ricos-content figcaption{font-size:14px;opacity:.7;margin-top:6px}
body.guide .ricos-content h2{font-size:18px;margin-top:18px}
