/* ============================================================================
   SOCIAL CLUB HALLE · update.css
   ----------------------------------------------------------------------------
   EINE Datei für alle Ergänzungen zum Grundstylesheet. Sie ersetzt die früheren
   Dateien update-15.css und update-19.css, die es ab jetzt nicht mehr gibt.

   Warum zusammengelegt: Mit jedem Update kam eine neue Nummer dazu, beim
   Herunterladen entstanden Kopien wie update-15_1.css, und am Ende war nicht
   mehr erkennbar, welche Datei die Seite wirklich lädt. Ab jetzt gilt: immer
   dieselben zwei Zusatzdateien, update.css und update.js. Der Zwischenspeicher
   der Browser wird über die Nummer hinter dem Fragezeichen in der index.html
   gesteuert (?v=21), nicht über den Dateinamen.

   Ladereihenfolge in der index.html:
     1. vendor/fonts.css     Schriften
     2. styles.css           Grundgestaltung (enthält auch das Logo)
     3. update.css           diese Datei, ergänzt die beiden darüber

   WICHTIG für spätere Änderungen: styles.css enthält bereits Regeln für die
   Partner-Karten (Block "PARTNER (Update 12)"). Diese Datei ergänzt sie nur.
   Wer hier etwas überschreibt, das dort schon steht, riskiert Kombinationen
   wie heller Text auf hellem Grund. Im Zweifel dort erst nachsehen.

   Inhalt:
     Teil A  Ankündigung des Jahresprogramms (ehemals update-15.css)
     Teil B  Partner-Seite (ehemals update-15.css)
     Teil C  Ladeanzeigen, Benachrichtigungsfenster, Dashboard, Bereichsleiste,
             Zeichenzähler, Event-Karten, Diagnose (ehemals update-19.css)
============================================================================ */

/* ===================== TEIL A und B: aus update-15.css ==================== */

/* ==========================================================================
   1) ANKÜNDIGUNG DES JAHRESPROGRAMMS
   Sitzt direkt unter dem Hero. Ruhig, aber mit goldenem Akzent, damit sie
   auffällt, ohne wie ein Werbebanner zu wirken.
   ========================================================================== */

.announce{padding:34px 20px 6px}
.an-card{background:var(--felt-deep);color:var(--cream);border-radius:18px;
  border:1.5px solid rgba(227,197,95,.34);
  padding:26px 26px 24px;box-shadow:0 18px 50px rgba(12,28,20,.22)}

.an-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.an-flag{font-family:'Spline Sans Mono';font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  background:var(--gold);color:var(--felt-deep);border-radius:999px;padding:5px 13px;font-weight:700}
.an-flag.live{background:#7be3ae;color:#0d2a1c}
.an-when{font-family:'Spline Sans Mono';font-size:12px;color:var(--gold-soft);letter-spacing:.04em}

.an-card h2{font-family:'Bricolage Grotesque';font-weight:800;line-height:1.08;
  font-size:clamp(24px,4.6vw,38px);color:var(--cream);max-width:22ch}
.an-lead{font-size:15px;line-height:1.6;color:var(--cream-dim);margin-top:10px;max-width:68ch}

/* Countdown. Nutzt die Bausteine der Startseite (cd-unit, cd-num, cd-lab),
   nur die Farben werden für den dunklen Untergrund gedreht. */
.an-cd{display:flex;gap:22px;flex-wrap:wrap;margin-top:18px}
.an-cd .cd-num{color:var(--gold);font-size:30px}
.an-cd .cd-lab{color:var(--cream-dim)}
.an-cd:empty{display:none}

/* Monats-Highlights */
.an-months{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:22px}
.an-m{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);
  border-radius:12px;padding:14px 15px 15px}
.an-m-t{font-family:'Spline Sans Mono';font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold);margin-bottom:8px}
.an-m ul{list-style:none;display:grid;gap:6px}
.an-m li{font-size:13.5px;line-height:1.35;color:var(--cream-dim);padding-left:14px;position:relative;
  overflow-wrap:anywhere}
.an-m li::before{content:"";position:absolute;left:0;top:8px;width:5px;height:5px;border-radius:50%;
  background:var(--gold);opacity:.7}

.an-cta{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap}
.an-note{margin-top:16px;font-size:13px;line-height:1.55;color:var(--cream-dim);max-width:74ch}
.an-note a{color:var(--gold-soft);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.an-note a:hover{color:var(--gold)}

@media (max-width:900px){ .an-months{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:560px){
  .announce{padding:24px 14px 4px}
  .an-card{padding:20px 18px 20px;border-radius:15px}
  .an-months{grid-template-columns:1fr;gap:10px}
  .an-cd{gap:16px}
  .an-cd .cd-num{font-size:25px}
  .an-cta .btn{width:100%;text-align:center}
}

/* ==========================================================================
   2) PARTNER-SEITE
   Sie liegt im Fenster über der Seite (staticOverlay) und wird Unternehmen
   geschickt. Sie muss deshalb für sich allein stehen können und beim ersten
   Blick nach Ordnung aussehen, nicht nach Bastelei.

   WICHTIG für spätere Änderungen: In styles.css steht bereits ein Block
   „PARTNER (Update 12)" mit den Grundregeln der Stufen-Karten (Rahmen,
   Hintergrund, Name, Preis, Merker, hervorgehobene Karte). Diese Datei
   ERGÄNZT ihn nur und überschreibt bewusst nichts davon. Sonst arbeiten die
   beiden Dateien gegeneinander, und je nach Reihenfolge der Regeln entsteht
   heller Text auf hellem Grund. Neue Regeln hier deshalb immer prüfen: Gibt
   es die Eigenschaft in styles.css schon?
   ========================================================================== */

/* Kennzahlenreihe über den Karten */
.pt-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:18px}
.pt-fact{background:var(--paper);border:1.5px solid var(--line);border-radius:12px;
  padding:12px 10px;text-align:center}
.pt-fact b{display:block;font-family:'Bricolage Grotesque';font-weight:800;font-size:22px;color:var(--felt)}
.pt-fact span{display:block;font-size:11.5px;color:#7a847d;margin-top:3px;line-height:1.3}

/* Die vier Stufen. Die Karten selbst kommen aus styles.css, hier steht nur,
   was Update 15 neu hinzugefügt hat: der Stufen-Kicker, die Hervorhebung
   einzelner Punkte und der Nutzensatz am Fuß.

   Feste zwei Spalten statt automatischer Verteilung: Im Fenster der
   Partner-Seite ergäbe die automatische Verteilung je nach Breite mal drei,
   mal zwei Spalten, und bei vier Karten sieht drei plus eins unordentlich
   aus. Stufe 3 und der Gründungskreis laufen über die volle Breite, dadurch
   lesen sich die Karten als Treppe. */
#staticPartner .partner-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
#staticPartner .partner-grid > .pt-card:nth-of-type(3),
#staticPartner .partner-grid > .pt-card.pt-featured{grid-column:1 / -1}

.pt-card .pt-kicker{font-family:'Spline Sans Mono';font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:#7a847d;overflow-wrap:anywhere;line-height:1.4}
.pt-card.pt-featured .pt-kicker{color:#8a6d16}
.pt-card .pt-list li{overflow-wrap:anywhere}
.pt-card .pt-list li.pt-key{font-weight:600;color:var(--ink)}
.pt-card .pt-list li.pt-off{color:#9aa39d}
.pt-card .pt-why{margin-top:auto;padding-top:12px;font-size:13px;line-height:1.5;
  color:#5b665f;font-style:italic}
.pt-card.pt-featured .pt-why{color:#6b5b1e;font-style:normal;font-weight:600}
/* Steht ein Nutzensatz davor, braucht die Fußnote keinen zweiten Abstandhalter */
.pt-card .pt-why + .pt-note{margin-top:10px}

/* Vergleichstabelle */
.pt-compare-wrap{overflow-x:auto;margin-top:12px;border:1.5px solid var(--line);border-radius:12px;
  -webkit-overflow-scrolling:touch}
.pt-compare{border-collapse:collapse;width:100%;min-width:720px;background:#fff;font-size:13px}
.pt-compare thead th{background:var(--felt-deep);color:var(--cream);font-family:'Instrument Sans';
  font-weight:600;font-size:12.5px;text-align:left;padding:11px 12px;white-space:nowrap}
.pt-compare thead th.pt-c-gold{background:#1c3a2a;color:var(--gold)}
.pt-compare tbody th{text-align:left;font-weight:600;font-size:13px;color:var(--ink);
  padding:10px 12px;background:var(--paper);white-space:normal;min-width:180px}
.pt-compare td{padding:10px 12px;color:#4a564f;border-left:1px solid var(--line);vertical-align:top}
.pt-compare tbody tr{border-top:1px solid var(--line)}
.pt-compare td.no{color:#9aa39d}
.pt-compare td.top{color:var(--ink);font-weight:600;background:#f6f9f6}
.pt-compare tbody tr td:last-child{background:#f3f7f2}
.pt-scroll-hint{font-size:12px;color:#9aa39d;margin-top:6px}
@media (min-width:900px){ .pt-scroll-hint{display:none} }

/* Klarstellung, was eine Kooperation ist und was nicht */
.pt-clear{margin-top:20px;background:var(--paper);border:1.5px solid var(--line);
  border-left:4px solid var(--gold);border-radius:0 12px 12px 0;padding:14px 16px;
  font-size:13.5px;line-height:1.55;color:#3c4741}

@media (max-width:760px){
  .pt-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  #staticPartner .partner-grid{grid-template-columns:1fr}
  .pt-card{padding:16px 15px 18px}
  .pt-card .pt-price{font-size:23px}
  /* Am Handy sitzt der Merker sonst halb außerhalb der schmalen Karte */
  .pt-card .pt-flag{right:10px;font-size:10px;padding:3px 10px}
}

/* ======================= TEIL C: aus update-19.css ======================== */
   Fehler, Wiederholen. Eine Ladeanzeige, die sich bewegt, sagt „es läuft
   noch". Steht sie still, hält man die Seite für kaputt – zu Recht. */
.sc19-load{display:flex;align-items:center;gap:10px;font-size:13.5px;color:#7a847d;
  font-style:italic;padding:10px 2px}
.sc19-spin{width:15px;height:15px;flex:none;border-radius:50%;
  border:2px solid var(--line);border-top-color:var(--felt);
  animation:sc19turn .8s linear infinite}
@keyframes sc19turn{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){ .sc19-spin{animation-duration:2.4s} }

.sc19-retry{background:var(--paper);border:1.5px solid var(--line);
  border-left:4px solid var(--gold);border-radius:12px;padding:14px 16px}
.sc19-retry-h{font-family:'Bricolage Grotesque';font-weight:700;font-size:15.5px;margin-bottom:4px}
.sc19-retry p{font-size:13.5px;color:#4a564f;margin:0 0 10px;max-width:56ch}
.sc19-retry .form-actions{margin:0}

/* ---------------------------------------------------------- 2) Glocke:
   Benachrichtigungsfenster. Bewusst schmal und ruhig: zwei Meldungen, klare
   Handlung je Meldung, alles Weitere auf Wunsch. */
.nb-modal{max-width:520px}
.nb-list{display:grid;gap:10px}
.nb-item{display:flex;align-items:flex-start;gap:11px;position:relative;
  background:var(--paper);border:1.5px solid var(--line);border-radius:12px;padding:12px 40px 12px 12px}
.nb-item.fresh{border-left:4px solid var(--gold);background:#fff}
.nb-body{min-width:0;flex:1}
.nb-label{font-family:'Spline Sans Mono';font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;color:#7a847d}
.nb-title{font-weight:600;font-size:15px;line-height:1.3;margin-top:2px;overflow-wrap:anywhere}
.nb-text{font-size:13.5px;color:#4a564f;margin-top:3px;overflow-wrap:anywhere}
.nb-act{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}
.nb-act .chip{padding:7px 14px;font-size:12.5px}
.nb-x{position:absolute;top:8px;right:8px;width:28px;height:28px;border-radius:50%;
  border:1.5px solid var(--line);background:#fff;color:#9aa39d;font-size:12px;cursor:pointer;
  display:grid;place-items:center;line-height:1}
.nb-x:hover{color:var(--red);border-color:var(--red)}
.nb-ico{width:34px;height:34px;flex:none;border-radius:50%;display:grid;place-items:center;
  background:var(--felt);color:var(--cream);font-size:14px}
.nb-ico-news{background:var(--gold);color:var(--felt-deep)}
.nb-ico-eigene{background:#e8e3d6;color:#5b665f}
.nb-foot{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:14px;padding-top:12px;
  border-top:1px dashed var(--line)}
.nb-foot .chip{padding:8px 14px;font-size:12.5px}
.nb-fold summary{cursor:pointer;font-size:12.5px;color:var(--felt);font-weight:600;
  text-decoration:underline;text-underline-offset:3px;list-style:none}
.nb-fold summary::-webkit-details-marker{display:none}
.nb-fold summary::before{content:"› ";display:inline-block;transition:transform .15s}
.nb-fold[open] summary::before{content:"⌄ "}
.nb-fold-body{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}
.sc19-clean{text-align:center;padding:18px 4px 10px}
.sc19-clean-ico{width:46px;height:46px;border-radius:50%;margin:0 auto 10px;display:grid;
  place-items:center;background:#e7f2ea;color:#2C5A34;font-size:22px}
.sc19-clean p{font-size:14px;color:#4a564f}

/* ------------------------------------------------- 3) Dashboard entzerren.
   Am Handy bleibt alles untereinander, das ist dort richtig. Erst ab
   1040 Pixeln lohnt eine zweite Spalte; darunter würden die Karten zu schmal
   und die Zeilen brechen unschön um. Begrüßung, Orga-Streifen und die
   Partner-Karte laufen über beide Spalten, damit die Seite oben ruhig bleibt. */
@media (min-width:1040px){
  .sc19-start{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0 18px;align-items:start}
  .sc19-start > .ma-hello,
  .sc19-start > .ma-orga-strip,
  .sc19-start > .ma-partner{grid-column:1 / -1}
  .sc19-start > *{min-width:0}
}
.sc19-hide{display:none !important}
.sc19-more{margin-top:8px}

/* --------------------------------------------------- 4) Feste Bereichsleiste
   für Business und Partner. Sie sitzt direkt unter der Kopfzeile und ist
   damit auf jedem Bildschirm sichtbar, ohne einen der fünf Plätze in der
   unteren Leiste zu verbrauchen. */
.sc-areas{display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  background:var(--felt-deep);border-top:1px solid rgba(255,255,255,.08);
  padding:9px 16px;padding-left:max(16px,env(safe-area-inset-left,0px))}
.sc-areas-lab{font-family:'Spline Sans Mono';font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--cream-dim);margin-right:2px}
.sc-areas button{background:rgba(255,255,255,.07);color:var(--cream);
  border:1.5px solid rgba(227,197,95,.35);border-radius:999px;
  padding:7px 15px;font-family:'Instrument Sans';font-size:13px;font-weight:600;
  cursor:pointer;min-height:36px}
.sc-areas button:hover{background:rgba(227,197,95,.16);border-color:var(--gold)}
.sc-areas button[aria-current="page"]{background:var(--gold);color:var(--felt-deep);
  border-color:var(--gold)}
@media (min-width:900px){
  .sc-areas{padding-left:24px}
  .sc-areas-lab{margin-right:6px}
}

/* ------------------------------------------------------- 5) Zeichenzähler.
   Steht unter dem Feld, nicht daneben: So sieht man beim Tippen am Handy,
   wie viel Platz noch da ist, statt erst beim Speichern eine Fehlermeldung
   zu bekommen. */
.sc19-cnt{display:block;margin-top:4px;font-family:'Spline Sans Mono';
  font-size:11px;color:#9aa39d;text-align:right}
.sc19-cnt.warn{color:#B0692C}
.sc19-cnt.full{color:var(--red);font-weight:600}

/* Mehr Luft für die längeren Texte im Firmenprofil */
#bzDesc{min-height:120px;line-height:1.5}

/* ------------------------------------------- 6) Event-Karten aufgeräumt.
   Eine Karte kann bis zu fünf Merker tragen: angemeldet, Zielgruppe, heute,
   Restplätze, Anmeldeschluss. Bisher standen Datum und Merker in einer Zeile
   und die Merker waren rechtsbündig. Sobald es mehr als zwei wurden, entstand
   eine ausgefranste Treppe, die von rechts nach links ins Nichts läuft.

   Jetzt bekommt das Datum eine eigene Zeile und die Merker stehen als ruhiger,
   linksbündiger Block darunter. Das gilt auf jedem Gerät, damit eine Karte am
   Laptop und am Handy gleich aussieht. Das !important ist nötig, weil die
   Rechtsbündigkeit direkt im Markup steht und sonst gewinnt. */
.t-date{flex-direction:column;align-items:flex-start;gap:7px}
.t-date > span:last-child{justify-content:flex-start !important;width:100%}
.t-badge{letter-spacing:.1em}
.t-note{display:block}
@media (max-width:560px){
  .t-top{padding:16px 16px 14px}
  .t-foot{padding:12px 16px}
  .t-title{font-size:19px}
  /* Die Knöpfe füllen die Zeile gleichmäßig, statt am Rand zu kleben */
  .t-actions{width:100%}
  .t-actions .chip{flex:1 1 auto;text-align:center;justify-content:center}
}

/* ------------------------------------- 7) Zwei echte Layoutfehler am Handy.

   a) Die QR-Karte im Bereich „Weitersagen" schob die Seite seitlich aus dem
      Bild. Ursache: In styles.css gibt es zweimal eine Regel für .qr-card.
      Die zweite, jüngere stammt aus Update 11 und gehört zur Flyer-Ansicht.
      Sie macht aus der Karte eine Zeile aus Bild und Text nebeneinander. Auf
      der Startseite trifft sie aber dieselbe Klasse: Das Bild nimmt die volle
      Breite, der Text daneben rutscht hinaus, und die ganze Seite ließ sich
      um rund 40 Pixel zur Seite schieben. Genau das fällt beim Zoomen am
      Handy als Verrutschen auf. Hier wird die Startseiten-Karte wieder zu
      dem, was sie sein soll: Bild oben, Text darunter.

   b) Der Menüknopf war 35 Pixel hoch. Alles unter 40 trifft man am Handy
      unzuverlässig, gerade in Bewegung. */
#weitersagen .qr-card{display:block;max-width:320px;width:100%;padding:20px}
#weitersagen .qr-card img{width:100%;height:auto;display:block;border-radius:8px}
#weitersagen .qr-card .qr-note{margin-top:10px;text-align:center;font-size:12.5px;color:#5b665f}
#burgerBtn{min-height:40px;min-width:44px}

/* ------------------------------------------------------------ 8) Diagnose.
   Bewusst nüchtern: eine Zeile je Prüfpunkt, Ergebnis links, damit man mit
   einem Blick die Zeile findet, die NEIN sagt. */
.dg-row{display:flex;align-items:baseline;gap:10px;padding:7px 0;
  border-bottom:1px dashed var(--line);font-size:13.5px;flex-wrap:wrap}
.dg-row:last-child{border-bottom:none}
.dg-ok,.dg-bad{font-family:'Spline Sans Mono';font-size:11px;font-weight:700;
  border-radius:999px;padding:2px 9px;flex:none;min-width:52px;text-align:center}
.dg-ok{background:#e7f2ea;color:#2C5A34}
.dg-bad{background:#fbe6ea;color:var(--red)}
.dg-ms{font-family:'Spline Sans Mono';font-size:12px;color:#7a847d}
.dg-note{color:#7a847d;font-size:12.5px;overflow-wrap:anywhere;flex:1;min-width:120px}
#dgReport{border:1.5px solid var(--line);border-radius:10px;padding:10px;background:#fff;
  color:#4a564f;resize:vertical}

/* ==========================================================================
   TEIL D · Business Club, Zugangssteuerung und Partner-Bereich (Update 21)
   --------------------------------------------------------------------------
   Ergänzt nur. Die Partner-Regeln aus styles.css (Update 12) und aus Teil B
   dieser Datei bleiben unangetastet, damit die Gründungskreis-Karte nicht
   wieder hellen Text auf hellem Grund bekommt.
   ========================================================================== */

/* --- Verwaltung: Reiter Zugang --------------------------------------------
   Die drei Stellungen des Hebels liegen als Karten nebeneinander statt als
   Auswahlliste. Eine Entscheidung, die man selten trifft und die viel
   bewirkt, soll man sehen und nicht aufklappen müssen. */
.zg-modes{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-top:10px}
.zg-mode{text-align:left;background:#fff;border:1.5px solid var(--line);border-radius:12px;
  padding:14px 16px;cursor:pointer;display:flex;flex-direction:column;gap:6px;transition:border-color .15s,box-shadow .15s}
.zg-mode:hover{border-color:var(--gold)}
.zg-mode.on{border-color:var(--gold);border-width:2px;box-shadow:0 6px 20px rgba(201,162,39,.18);background:#fffdf5}
.zg-mode-t{font-family:'Bricolage Grotesque';font-weight:700;font-size:15px;color:var(--ink)}
.zg-mode.on .zg-mode-t::after{content:" ✓";color:var(--gold)}
.zg-mode-s{font-size:13px;color:#4a564f;line-height:1.5}

.zg-rule.off{opacity:.5}
.zg-list{margin-top:10px;font-size:13.5px;line-height:1.6;background:#fff;border:1.5px solid var(--line);
  border-left:4px solid var(--gold);border-radius:10px;padding:10px 14px}
.zg-list.warn{border-left-color:var(--red)}
.zg-list small{color:#7a847d}
.zg-tgroup{margin-top:16px;padding-top:12px;border-top:1.5px solid var(--line)}
.zg-tgroup:first-of-type{border-top:0}
.zg-tgroup textarea,.zg-tgroup input{width:100%}

.sc21-eilt{border-left:4px solid var(--red)}
.sc21-zugang input[type=date]{width:100%}

/* --- Business Club: gesperrte Ansicht -------------------------------------
   Kein Fehlerbild, sondern eine Erklärung. Wer hier landet, soll verstehen,
   warum zu ist, und sehen, was drin liegt. */
.bc-lock{display:flex;gap:16px;align-items:flex-start;margin-top:16px;
  background:var(--felt-deep);color:var(--cream);border:1.5px solid rgba(227,197,95,.34);
  border-radius:16px;padding:20px 22px}
.bc-lock-ico{font-size:26px;line-height:1;flex:0 0 auto;margin-top:2px}
.bc-lock h3{font-family:'Bricolage Grotesque';font-weight:800;font-size:19px;line-height:1.25;margin:0;color:var(--cream)}
.bc-lock p{margin:8px 0 0;font-size:14.5px;line-height:1.6;color:var(--cream-dim)}

.bc-benefits{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));margin-top:10px}
.bc-benefits>div{background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:13px 15px}
.bc-benefits b{display:block;font-family:'Bricolage Grotesque';font-size:14.5px;margin-bottom:4px}
.bc-benefits span{font-size:13px;color:#4a564f;line-height:1.55}

/* --- Business Club: Statusleiste ----------------------------------------- */
.bc-status{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 4px}
.bc-chip{font-family:'Spline Sans Mono';font-size:11px;letter-spacing:.06em;
  background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:5px 12px;color:#4a564f}
.bc-chip.on{background:#123b2a;border-color:#1f6b48;color:#7be3ae;font-weight:600}

/* --- Partner-Bereich: eigene Linie --------------------------------------- */
.pt-line{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:#fff;border:1.5px solid var(--line);border-left:4px solid var(--gold);
  border-radius:10px;padding:12px 14px}
.pt-line-note{font-size:13px;color:#4a564f}

@media(max-width:640px){
  .bc-lock{flex-direction:column;gap:10px;padding:18px}
  .zg-modes{grid-template-columns:1fr}
}

/* --- Nachtrag: seitliches Verschieben am kleinen Handy ---------------------
   Gefunden beim Nachmessen bei 320 Pixeln, dem schmalsten Gerät, das noch
   verbreitet ist: Die Event-Karten stehen in einem Raster, dessen kleinste
   Spalte mit festen 320 Pixeln angegeben ist. Ist der Bildschirm selbst nur
   320 Pixel breit, bleiben nach den Rändern 280 übrig, die Spalte besteht
   aber auf 320. Ergebnis: Die ganze Seite lässt sich um rund 20 Pixel zur
   Seite schieben. Mit min() nimmt die Spalte die volle Breite, wenn sie
   enger als 320 ist, und bleibt sonst wie bisher. */
.grid{grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr))}
.rec-grid,.voice-grid{grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr))}
.partner-grid{grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr))}
@media (min-width:760px){ #maEvents .grid{grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr))} }

/* ==========================================================================
   TEIL E · Der eingeloggte Business Club auf business.html (Update 22)
   --------------------------------------------------------------------------
   Aufbau nach dem, was sich bei Arbeitsplattformen durchgesetzt hat: eine
   feste Menüspalte links, am Handy stattdessen eine feste Leiste unten im
   Daumenbereich, oben eine schmale Kopfzeile mit Suche und Zugang. Keine
   Pop-ups, keine Fenster im Fenster.

   Alle Klassen beginnen mit scb-, damit sie nichts auf der Startseite treffen.
   ========================================================================== */

body.scb-on{background:#F2EFE6}
/* Ist der Club offen, hat er seine eigene Kopfzeile. Die Kopfzeile der
   Verkaufsseite und der Hinweis für Angemeldete ohne Freigabe verschwinden,
   sonst stehen zwei Kopfzeilen übereinander. */
body.scb-on .bh-head,body.scb-on #bhLoginHinweis,body.scb-on #bhBar{display:none}
.scb-shell{min-height:100vh;display:flex;flex-direction:column}

/* ---- Kopfzeile der Anwendung ---- */
.scb-topbar{background:var(--felt-deep);color:var(--cream);position:sticky;top:0;z-index:40;
  border-bottom:1px solid rgba(227,197,95,.25)}
.scb-topbar-in{max-width:1240px;margin:0 auto;padding:10px 20px;display:flex;align-items:center;
  gap:16px;justify-content:space-between}
.scb-search{display:flex;align-items:center;gap:9px;background:rgba(244,238,223,.08);
  border:1.5px solid rgba(227,197,95,.22);border-radius:999px;padding:8px 16px;flex:1;max-width:520px}
.scb-search .scb-ico{width:17px;height:17px;color:var(--gold-soft);flex:none}
.scb-search input{flex:1;min-width:0;background:transparent;border:0;outline:0;color:var(--cream);
  font-family:'Instrument Sans';font-size:14px}
.scb-search input::placeholder{color:rgba(231,223,201,.6)}
.scb-who{display:flex;align-items:center;gap:10px;min-width:0}
.scb-av{width:36px;height:36px;border-radius:9px;flex:none;overflow:hidden;background:var(--gold);
  color:var(--felt-deep);display:grid;place-items:center;font-family:'Bricolage Grotesque';
  font-weight:800;font-size:13px}
.scb-av img{width:100%;height:100%;object-fit:cover}
.scb-who-t{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.scb-who-t b{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scb-who-t small{font-size:11px;color:var(--gold-soft)}
@media(max-width:700px){ .scb-who-t{display:none} }

/* ---- Rahmen: Seitenleiste und Inhalt ---- */
.scb-body{flex:1;max-width:1240px;width:100%;margin:0 auto;display:grid;
  grid-template-columns:236px 1fr;gap:26px;padding:22px 20px 40px;align-items:start}
.scb-side{position:sticky;top:78px;display:flex;flex-direction:column;gap:3px}
.scb-side button,.scb-side .scb-side-link{display:flex;align-items:center;gap:11px;width:100%;
  background:transparent;border:0;border-radius:10px;padding:11px 13px;cursor:pointer;
  font-family:'Instrument Sans';font-size:14.5px;font-weight:500;color:#2a3630;text-align:left;
  text-decoration:none;position:relative}
.scb-side button:hover,.scb-side .scb-side-link:hover{background:rgba(20,32,26,.06)}
.scb-side button[aria-current="page"]{background:var(--felt-deep);color:var(--cream);font-weight:600}
.scb-side button[aria-current="page"] .scb-ico{color:var(--gold-soft)}
.scb-side .scb-side-link{margin-left:0}
.scb-side-rule{height:1px;background:var(--line);margin:10px 4px}
.scb-side-out{margin-top:4px;color:#8a4a4a!important;font-size:13.5px!important}
.scb-ico{width:19px;height:19px;flex:none}
.scb-dot{margin-left:auto;background:var(--gold);color:var(--felt-deep);border-radius:999px;
  min-width:20px;height:20px;display:grid;place-items:center;font-size:11.5px;font-weight:800;padding:0 5px}

.scb-main{min-width:0}
.scb-view{display:block}
/* „Weitere Bereiche" gibt es nur am Handy, wo unten fünf Plätze sind. Am
   Laptop stehen alle Bereiche ohnehin in der Seitenleiste. */
.scb-more{display:none;margin-top:18px}
@media(max-width:980px){ .scb-more{display:block} }
.scb-more-lab{font-family:'Spline Sans Mono';font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;color:#7a847d;margin-bottom:8px}
.scb-more-btn{display:flex;align-items:center;gap:10px;width:100%;background:#fff;
  border:1.5px solid var(--line);border-radius:11px;padding:12px 14px;margin-bottom:8px;
  font-family:'Instrument Sans';font-size:14.5px;cursor:pointer;text-align:left}
/* styles.css färbt jedes footer-Element dunkel ein. Hier steht die Fußzeile
   im hellen Arbeitsbereich, deshalb wird das gezielt zurückgenommen. */
.scb-main .scb-foot{margin-top:26px;padding:16px 0 0;background:transparent;
  border-top:1.5px solid var(--line);display:flex;gap:16px;flex-wrap:wrap;
  align-items:center;font-size:13px;color:#7a847d}
.scb-foot a{color:#4a564f;text-decoration:none;border-bottom:1px solid var(--line)}
.scb-foot a:hover{color:var(--ink)}

/* ---- Untere Leiste am Handy ---- */
.scb-tabs{display:none}
@media(max-width:980px){
  .scb-body{grid-template-columns:1fr;padding:16px 14px 92px}
  .scb-side{display:none}
  .scb-tabs{display:grid;position:fixed;left:0;right:0;bottom:0;z-index:50;
    grid-auto-flow:column;grid-auto-columns:1fr;background:var(--felt-deep);
    border-top:1px solid rgba(227,197,95,.3);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .scb-tabs button{display:flex;flex-direction:column;align-items:center;gap:3px;background:transparent;
    border:0;color:rgba(244,238,223,.72);font-family:'Instrument Sans';font-size:10.5px;
    padding:7px 2px;cursor:pointer;border-radius:9px;min-height:48px;position:relative}
  .scb-tabs button[aria-current="page"]{color:var(--gold-soft);background:rgba(227,197,95,.12)}
  .scb-tabs .scb-dot{position:absolute;top:2px;right:calc(50% - 20px);margin:0}
  .scb-tabs .scb-ico{width:20px;height:20px}
}

/* ---- Bausteine ---- */
.scb-hello{margin-bottom:18px}
.scb-hello-sub{font-family:'Spline Sans Mono';font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;color:#7a847d}
.scb-hello h1{font-family:'Bricolage Grotesque';font-weight:800;font-size:clamp(24px,3.4vw,34px);
  line-height:1.1;margin:6px 0 0;color:var(--ink)}
.scb-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}
.scb-chip{font-family:'Spline Sans Mono';font-size:11px;letter-spacing:.05em;background:#fff;
  border:1.5px solid var(--line);border-radius:999px;padding:5px 12px;color:#4a564f}
.scb-chip.on{background:#123b2a;border-color:#1f6b48;color:#7be3ae;font-weight:600}
.scb-chip.gold{background:var(--gold);border-color:var(--gold);color:var(--felt-deep);font-weight:700}

.scb-page-h{margin-bottom:18px}
.scb-page-h h1{font-family:'Bricolage Grotesque';font-weight:800;font-size:clamp(24px,3.2vw,32px);
  line-height:1.12;margin:0;color:var(--ink)}
.scb-page-h p{font-size:15px;line-height:1.6;color:#4a564f;margin:8px 0 0;max-width:74ch}

.scb-card{background:#fff;border:1.5px solid var(--line);border-radius:14px;
  padding:20px 22px;margin-bottom:16px}
.scb-card-h{display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex-wrap:wrap;margin-bottom:12px}
.scb-card-h h2{font-family:'Bricolage Grotesque';font-weight:700;font-size:17px;margin:0;color:var(--ink)}
.scb-note{font-size:13.5px;line-height:1.6;color:#6b756e;margin:8px 0 0}
.scb-empty{font-size:14px;color:#7a847d;background:#faf8f2;border:1.5px dashed var(--line);
  border-radius:11px;padding:16px;margin:0}
.scb-sub-h{font-family:'Bricolage Grotesque';font-weight:700;font-size:14.5px;margin:18px 0 8px;color:var(--ink)}

.scb-cols{display:grid;grid-template-columns:1.35fr .85fr;gap:16px;align-items:start}
@media(max-width:1080px){ .scb-cols{grid-template-columns:1fr} }
.scb-split{display:grid;grid-template-columns:1.25fr .75fr;gap:16px;align-items:start}
@media(max-width:1080px){ .scb-split{grid-template-columns:1fr} }
.scb-grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
@media(max-width:640px){ .scb-grid2{grid-template-columns:1fr} }

/* Profilstärke */
.scb-meter{display:flex;align-items:center;gap:14px}
.scb-meter-bar{flex:1;height:10px;border-radius:999px;background:#eee9dc;overflow:hidden}
.scb-meter-bar span{display:block;height:100%;background:linear-gradient(90deg,#C9A227,#7be3ae);
  border-radius:999px;transition:width .4s ease}
.scb-meter-n{font-family:'Bricolage Grotesque';font-weight:800;font-size:19px;color:var(--ink)}
.scb-listed{margin-top:12px;font-size:13.5px;line-height:1.55;border-radius:10px;padding:11px 14px}
.scb-listed.on{background:#eef7f1;border:1.5px solid #b9dcc7;color:#1f5138}
.scb-listed.off{background:#fdf6ee;border:1.5px solid #e8d3b4;color:#7a5a25}

/* Nächste Schritte */
.scb-steps{display:grid;gap:9px}
.scb-step{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  background:#faf8f2;border:1.5px solid var(--line);border-left:4px solid var(--gold);
  border-radius:11px;padding:13px 15px}
.scb-step b{display:block;font-size:14.5px;color:var(--ink)}
.scb-step span{display:block;font-size:13px;color:#6b756e;margin-top:3px;line-height:1.5}

/* Kennzahlen */
.scb-kpis{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.scb-kpi{background:#faf8f2;border:1.5px solid var(--line);border-radius:11px;padding:13px 14px}
.scb-kpi b{display:block;font-family:'Bricolage Grotesque';font-weight:800;font-size:24px;color:var(--ink)}
.scb-kpi span{display:block;font-size:12px;color:#6b756e;margin-top:2px;line-height:1.35}
.scb-kpi.warn{border-color:#e8d3b4;background:#fdf6ee}

/* Zeilen und Listen */
.scb-list{display:grid;gap:8px}
.scb-row{display:flex;align-items:center;gap:12px;background:#faf8f2;border:1.5px solid var(--line);
  border-radius:11px;padding:11px 14px;flex-wrap:wrap}
.scb-row .grow{flex:1;min-width:140px}
.scb-row .t{font-size:14.5px;font-weight:600;color:var(--ink)}
.scb-row .s{font-size:12.5px;color:#6b756e;margin-top:2px;line-height:1.45}
.scb-row-d{width:44px;flex:none;text-align:center;background:var(--felt-deep);color:var(--cream);
  border-radius:9px;padding:6px 0}
.scb-row-d b{display:block;font-family:'Bricolage Grotesque';font-weight:800;font-size:17px;line-height:1}
.scb-row-d span{display:block;font-family:'Spline Sans Mono';font-size:9.5px;color:var(--gold-soft);
  text-transform:uppercase;letter-spacing:.1em;margin-top:2px}

/* Knöpfe */
.scb-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;
  background:var(--gold);color:var(--felt-deep);border:2px solid var(--gold);border-radius:999px;
  padding:11px 22px;font-family:'Instrument Sans';font-weight:700;font-size:14.5px;
  cursor:pointer;text-decoration:none;white-space:nowrap}
.scb-btn:hover{background:var(--gold-soft);border-color:var(--gold-soft)}
.scb-btn.small{padding:8px 15px;font-size:13.5px}
.scb-btn.ghost{background:transparent;color:#3c4a42;border-color:var(--line)}
.scb-btn.ghost:hover{background:rgba(20,32,26,.05);border-color:var(--gold)}
.scb-btn:disabled{opacity:.6;cursor:default}
.scb-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.scb-link{background:transparent;border:0;color:#4a564f;font-family:'Instrument Sans';font-size:13.5px;
  cursor:pointer;padding:4px 8px;border-radius:7px;text-decoration:none}
.scb-link:hover{background:rgba(20,32,26,.06);color:var(--ink)}
.scb-link.on{background:var(--felt-deep);color:var(--cream)}

/* Formularfelder */
.scb-field{display:block;margin-top:14px}
.scb-field>span{display:block;font-size:13px;color:#7a847d;margin-bottom:5px}
.scb-field input,.scb-field textarea,.scb-field select{width:100%;border:1.5px solid var(--line);
  border-radius:10px;padding:11px 14px;font-size:14.5px;font-family:'Instrument Sans';
  background:#fff;color:var(--ink)}
.scb-field input:focus,.scb-field textarea:focus,.scb-field select:focus{outline:2px solid var(--gold);
  outline-offset:1px;border-color:var(--gold)}
.scb-field textarea{resize:vertical}
.scb-count{display:block;font-style:normal;font-size:11.5px;color:#9aa39d;margin-top:4px}
.scb-count.warn{color:#B0692C;font-weight:600}
.scb-switch{display:flex;gap:11px;align-items:flex-start;margin-top:18px;background:#faf8f2;
  border:1.5px solid var(--line);border-radius:11px;padding:14px 16px}
.scb-switch input{margin-top:3px;width:18px;height:18px;flex:none;accent-color:var(--gold)}
.scb-switch label{font-size:13.5px;line-height:1.55;color:#3c4a42}
.scb-msg{display:none;margin-top:12px;font-size:14px;border-radius:10px;padding:11px 14px;line-height:1.5}
.scb-msg:not(:empty){display:block;background:#eef7f1;border:1.5px solid #b9dcc7;color:#1f5138}
.scb-msg.bad:not(:empty){background:#fdeef0;border-color:#e8b4bc;color:#8a2a3d}

/* Logo */
.scb-logo{width:76px;height:76px;flex:none;border-radius:14px;background:var(--felt);
  color:var(--gold-soft);display:grid;place-items:center;overflow:hidden;
  font-family:'Bricolage Grotesque';font-weight:800;font-size:22px}
.scb-logo img{width:100%;height:100%;object-fit:cover}
.scb-logo.sm{width:52px;height:52px;border-radius:11px;font-size:15px}
.scb-logo.xs{width:38px;height:38px;border-radius:9px;font-size:12px}
.scb-logo-row{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}

/* Firmenkarten im Marktplatz */
.scb-cards{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(340px,100%),1fr))}
.scb-firma{background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:18px 20px;
  display:flex;flex-direction:column;gap:10px}
.scb-firma.vorschau{border-style:dashed;background:#faf8f2}
.scb-firma-top{display:flex;gap:13px;align-items:flex-start}
.scb-firma-top .grow{min-width:0}
.scb-firma h3{font-family:'Bricolage Grotesque';font-weight:700;font-size:16.5px;margin:0;
  color:var(--ink);line-height:1.25}
.scb-mine{font-family:'Spline Sans Mono';font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
  background:var(--felt-deep);color:var(--gold-soft);border-radius:999px;padding:3px 8px;
  vertical-align:middle;margin-left:6px}
.scb-firma-sub{font-size:12.5px;color:#7a847d;margin-top:3px}
.scb-firma-leistung{font-size:14px;color:var(--ink);font-weight:600;line-height:1.45}
.scb-firma-desc{font-size:13.5px;color:#4a564f;line-height:1.55;margin:0}
.scb-firma-foot{margin-top:auto;padding-top:10px;border-top:1.5px solid var(--line)}
.scb-nokontakt{font-size:13px;color:#9aa39d}
.scb-kontakt{font-size:13.5px;color:#3c4a42}
.scb-mini{display:flex;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}
.scb-mini:last-child{border-bottom:0}
.scb-mini b{display:block;font-size:13.5px;color:var(--ink)}
.scb-mini span{display:block;font-size:12px;color:#7a847d}
.scb-mini .grow{min-width:0}

/* Vorschau des eigenen Eintrags */
.scb-preview{position:sticky;top:78px}
.scb-preview-lab{font-family:'Spline Sans Mono';font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;color:#7a847d;margin-bottom:9px}

/* Suche und Filter */
.scb-searchbar{display:flex;align-items:center;gap:10px;border:1.5px solid var(--line);
  border-radius:999px;padding:10px 16px;background:#faf8f2}
.scb-searchbar .scb-ico{width:18px;height:18px;color:#7a847d;flex:none}
.scb-searchbar input{flex:1;min-width:0;border:0;background:transparent;outline:0;
  font-family:'Instrument Sans';font-size:15px;color:var(--ink)}
.scb-x{background:transparent;border:0;color:#7a847d;font-size:15px;cursor:pointer;padding:2px 6px}
.scb-filters{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin-top:12px}
.scb-flab{font-family:'Spline Sans Mono';font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:#9aa39d;margin-right:2px}
.scb-fchip{background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:6px 13px;
  font-family:'Instrument Sans';font-size:13px;cursor:pointer;color:#3c4a42}
.scb-fchip:hover{border-color:var(--gold)}
.scb-fchip.on{background:var(--felt-deep);border-color:var(--felt-deep);color:var(--cream);font-weight:600}
.scb-resultbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  margin-top:14px;padding-top:12px;border-top:1.5px solid var(--line);font-size:13.5px;color:#6b756e}

/* Merker */
.scb-badge{font-family:'Spline Sans Mono';font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;
  border-radius:999px;padding:5px 11px;font-weight:700;white-space:nowrap}
.scb-badge.ok{background:#eef7f1;color:#1f5138;border:1.5px solid #b9dcc7}
.scb-badge.wait{background:#fdf6ee;color:#7a5a25;border:1.5px solid #e8d3b4}
.scb-badge.no{background:#f2f2f0;color:#6b756e;border:1.5px solid #dcdcd6}

/* Das exklusive Recht */
.scb-recht{display:flex;gap:16px;align-items:flex-start;background:var(--felt-deep);
  border-color:rgba(227,197,95,.34);color:var(--cream)}
.scb-recht h2{color:var(--cream);margin:0 0 10px;font-family:'Bricolage Grotesque';font-weight:800;font-size:19px}
.scb-recht .scb-note{color:var(--cream-dim);opacity:.9}
.scb-recht-ico{font-size:24px;color:var(--gold-soft);flex:none;line-height:1;margin-top:2px}
.scb-liste{margin:0;padding-left:20px;display:grid;gap:7px}
.scb-liste li{font-size:14.5px;line-height:1.55;color:var(--cream-dim)}

/* Partner */
.scb-tier{display:flex;gap:16px;align-items:flex-start}
.scb-tier-badge{font-size:30px;line-height:1;flex:none}
.scb-tier-n{font-family:'Bricolage Grotesque';font-weight:800;font-size:19px;color:var(--ink)}
.scb-tier-u{font-size:13px;color:#7a847d;margin-top:2px}
.scb-line{display:flex;gap:14px;align-items:center;flex-wrap:wrap;background:#faf8f2;
  border:1.5px solid var(--line);border-left:4px solid var(--gold);border-radius:11px;padding:13px 15px}
.scb-line span{font-size:13.5px;color:#4a564f}
.scb-bericht{background:#faf8f2;border:1.5px solid var(--line);border-radius:12px;
  padding:15px 17px;margin-bottom:10px}
.scb-bericht-h{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:7px}
.scb-bericht-h b{font-family:'Bricolage Grotesque';font-size:15px;color:var(--ink)}
.scb-bericht-h span{font-size:12.5px;color:#7a847d}
.scb-bericht p{font-size:14px;line-height:1.6;color:#3c4a42;margin:0;white-space:pre-line}
.scb-fotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px;margin-top:11px}
.scb-fotos img{width:100%;height:88px;object-fit:cover;border-radius:9px;cursor:zoom-in}
.scb-fotos img.gross{grid-column:1/-1;height:auto;max-height:70vh;object-fit:contain;
  background:#000;cursor:zoom-out}

/* Neuigkeiten */
.scb-news h2{font-family:'Bricolage Grotesque';font-weight:800;font-size:18px;margin:4px 0 8px;color:var(--ink)}
.scb-news p{font-size:14.5px;line-height:1.6;color:#3c4a42;margin:0;white-space:pre-line}
.scb-news-d{font-family:'Spline Sans Mono';font-size:11px;color:#9aa39d;letter-spacing:.06em}
.scb-news-mini{padding:9px 0;border-bottom:1px solid var(--line)}
.scb-news-mini:last-child{border-bottom:0}
.scb-news-mini b{display:block;font-size:13.5px;color:var(--ink)}
.scb-news-mini span{display:block;font-size:12.5px;color:#6b756e;margin-top:2px;line-height:1.45}

/* Skelett statt Kreisel */
.scb-skel-wrap{display:grid;gap:10px}
.scb-skel{height:16px;border-radius:8px;background:linear-gradient(90deg,#f0ece1,#f7f4ec,#f0ece1);
  background-size:200% 100%;animation:scbShimmer 1.4s linear infinite}
.scb-skel:nth-child(2){width:80%}
.scb-skel:nth-child(3){width:62%}
@keyframes scbShimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
@media(prefers-reduced-motion:reduce){ .scb-skel{animation:none} }

/* Meldung am unteren Rand */
.scb-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:9000;
  padding:11px 20px;border-radius:11px;font-size:14px;font-weight:600;max-width:92vw;
  background:#123b2a;color:#7be3ae;border:1.5px solid #1f6b48;opacity:0;pointer-events:none;
  transition:opacity .3s ease}
.scb-toast.on{opacity:1}
.scb-toast.bad{background:#4a1420;color:#ff9db0;border-color:#8a2a3d}
@media(max-width:980px){ .scb-toast{bottom:88px} }

/* Eingereichte Veranstaltung eines Kooperationspartners in der Verwaltung */
.sc22-promo{border-left:4px solid var(--gold);background:#fffdf5}