/* Bausteine des RP Webseiten-Editors.
   Diese Datei wird vom Editor gepflegt und bei jedem Öffnen erneuert – eigene Anpassungen
   bitte in die Stil-Datei der Seite schreiben (die wird danach geladen und gewinnt).
   Farben: --rb-akzent, --rb-akzent-text, --rb-karte, --rb-linie, --rb-radius */

:root{
  --rb-akzent-w: var(--rb-akzent, var(--akzent, #43b04a));
  --rb-akzent-text-w: var(--rb-akzent-text, #0b1a08);
  --rb-karte-w: var(--rb-karte, var(--card, rgba(127,127,127,.12)));
  --rb-linie-w: var(--rb-linie, var(--line, rgba(127,127,127,.3)));
  --rb-radius-w: var(--rb-radius, var(--r, 14px));
  --rb-breite-w: var(--rb-breite, var(--wrap, 1140px));
}

/* Abschnitt mit Innenbreite */
.rb-abschnitt{padding:48px 0}
.rb-innen{max-width:var(--rb-breite-w);margin:0 auto;padding:0 20px}
.rb-abschnitt.rb-hell{background:var(--rb-karte-w)}

/* Spalten */
.rb-spalten{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.rb-spalten.rb-3{grid-template-columns:repeat(3,1fr)}
.rb-spalten.rb-mitte-v{align-items:center}

/* Bild */
.rb-bild{margin:0 0 1.2em}
.rb-bild img{max-width:100%;height:auto;display:block;border-radius:var(--rb-radius-w)}
.rb-bild figcaption,.rb-video figcaption,.rb-videodatei figcaption{font-size:.88em;opacity:.75;margin-top:.5em}

/* Galerie */
.rb-galerie{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin:0 0 1.2em}
.rb-galerie a{display:block;border-radius:10px;overflow:hidden;aspect-ratio:1}
.rb-galerie img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.rb-galerie a:hover img{transform:scale(1.05)}
.rb-galerie.rb-gross{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}

/* YouTube-Video (lädt erst nach Klick – Datenschutz) */
.rb-video{margin:0 0 1.2em}
.rb-video-start{position:relative;display:block;width:100%;padding:0;border:0;background:#000;cursor:pointer;border-radius:var(--rb-radius-w);overflow:hidden;aspect-ratio:16/9}
.rb-video-start img{width:100%;height:100%;object-fit:cover;display:block;opacity:.9;transition:opacity .3s}
.rb-video-start:hover img{opacity:1}
.rb-play{position:absolute;left:50%;top:50%;width:72px;height:72px;margin:-36px 0 0 -36px;border-radius:50%;background:rgba(0,0,0,.6);border:2px solid rgba(255,255,255,.85)}
.rb-play::after{content:"";position:absolute;left:28px;top:21px;border-style:solid;border-width:15px 0 15px 24px;border-color:transparent transparent transparent #fff}
.rb-video-start:hover .rb-play{background:var(--rb-akzent-w);border-color:var(--rb-akzent-w)}
.rb-video-hinweis{position:absolute;left:0;right:0;bottom:0;padding:6px 10px;font:12px/1.3 system-ui,sans-serif;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.75));text-align:left}
.rb-video iframe{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:var(--rb-radius-w)}
.rb-videodatei{margin:0 0 1.2em}
.rb-videodatei video{width:100%;display:block;border-radius:var(--rb-radius-w);background:#000}

/* Knopf */
.rb-knopf{display:inline-block;background:var(--rb-akzent-w);color:var(--rb-akzent-text-w)!important;font-weight:600;text-decoration:none;padding:12px 24px;border-radius:999px;transition:filter .2s,transform .2s}
.rb-knopf:hover{filter:brightness(1.12);transform:translateY(-1px)}
.rb-knopf.rb-rahmen{background:transparent;color:inherit!important;border:1.5px solid var(--rb-linie-w)}

/* Karten */
.rb-karten{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px;margin:0 0 1.2em}
.rb-karte{background:var(--rb-karte-w);border:1px solid var(--rb-linie-w);border-radius:var(--rb-radius-w);padding:20px;overflow:hidden}
.rb-karte > img:first-child{margin:-20px -20px 14px;width:calc(100% + 40px);max-width:none;aspect-ratio:16/10;object-fit:cover}
.rb-karte h3{margin-top:0}
.rb-karte p:last-child{margin-bottom:0}

/* Termin */
.rb-termin{display:grid;grid-template-columns:180px 1fr;gap:18px;padding:16px 0;border-top:1px solid var(--rb-linie-w)}
.rb-termin-datum{font-weight:700;color:var(--rb-akzent-w)}
.rb-termin h3{margin:0 0 .25em}
.rb-termin p{margin:0;opacity:.85}

/* Zitat, Linie, Abstand */
.rb-zitat{margin:0 0 1.2em;padding:.6em 0 .6em 1.2em;border-left:3px solid var(--rb-akzent-w);font-size:1.12em}
.rb-zitat p{margin:0 0 .4em}
.rb-zitat cite{font-size:.85em;opacity:.75;font-style:normal}
.rb-linie{border:0;border-top:1px solid var(--rb-linie-w);margin:2em 0}
.rb-abstand{height:48px}

/* Ausrichtung, Breite, Abstände (vom Editor gesetzt) */
.rb-links{text-align:left!important}
.rb-mitte{text-align:center!important}
.rb-rechts{text-align:right!important}
img.rb-mitte,figure.rb-mitte img,.rb-mitte > img{margin-left:auto!important;margin-right:auto!important}
img.rb-rechts,figure.rb-rechts img{margin-left:auto!important}
.rb-b-25{max-width:25%!important}.rb-b-33{max-width:33.333%!important}.rb-b-50{max-width:50%!important}
.rb-b-66{max-width:66.666%!important}.rb-b-75{max-width:75%!important}.rb-b-100{max-width:100%!important;width:100%!important}
figure.rb-mitte,.rb-b-25.rb-mitte,.rb-b-33.rb-mitte,.rb-b-50.rb-mitte,.rb-b-66.rb-mitte,.rb-b-75.rb-mitte{margin-left:auto!important;margin-right:auto!important}
.rb-o-0{margin-top:0!important}.rb-o-1{margin-top:12px!important}.rb-o-2{margin-top:28px!important}.rb-o-3{margin-top:56px!important}.rb-o-4{margin-top:96px!important}
.rb-u-0{margin-bottom:0!important}.rb-u-1{margin-bottom:12px!important}.rb-u-2{margin-bottom:28px!important}.rb-u-3{margin-bottom:56px!important}.rb-u-4{margin-bottom:96px!important}

/* Nur auf Desktop / nur auf dem Handy zeigen */
@media (max-width:760px){
  html .rb-nur-desktop{display:none!important}
  .rb-spalten,.rb-spalten.rb-3{grid-template-columns:1fr;gap:24px}
  .rb-termin{grid-template-columns:1fr;gap:4px}
  .rb-b-25,.rb-b-33,.rb-b-50,.rb-b-66{max-width:100%!important}
  .rb-abschnitt{padding:32px 0}
}
@media (min-width:761px){html .rb-nur-handy{display:none!important}}

/* Bildanzeige groß (Galerie) */
.rb-lb{position:fixed;inset:0;z-index:9999;background:rgba(5,5,8,.94);display:flex;align-items:center;justify-content:center}
.rb-lb img{max-width:92vw;max-height:88vh;border-radius:6px}
.rb-lb button{position:absolute;background:rgba(255,255,255,.1);border:0;color:#fff;font-size:28px;width:52px;height:52px;border-radius:50%;cursor:pointer}
.rb-lb button:hover{background:var(--rb-akzent-w);color:var(--rb-akzent-text-w)}
.rb-lb .rb-lb-x{top:16px;right:16px;font-size:20px}
.rb-lb .rb-lb-p{left:16px}.rb-lb .rb-lb-n{right:16px}
