/*
* Reflink-Topbar + schwebende Kontakt-Icons + Scroll-to-Top (CLIS-Auftrag
* 31.07.2026, docs/CLIS_auftrag_topbar_kontaktseite.md, Abschnitt 1).
* Identisch auf chance.8xregio.com, der Eroeffnungsseite, kontakt.html und
* den Rechtsseiten -- deshalb eine gemeinsame Datei statt Kopien je Seite.
*
* Korrektur 31.07.2026 (Franz-Feedback nach Live-Review): Topbar-Inhalte
* rechtsbuendig statt linksbuendig, kein hartcodierter "8XREGIO"-Platzhalter
* mehr -- der Name-Span bleibt leer/versteckt, bis ein echter Reflink einen
* Namen liefert (siehe refTopbar.js loadReflinkInfo).
*/
.ref-topbar{
  position:fixed; top:0; left:0; right:0; z-index:70;
  background:#00081a;
  border-bottom:1px solid rgba(201,166,87,0.25);
  transition:transform .3s ease;
}
.ref-topbar.ref-topbar-hidden{ transform:translateY(-100%); }
.ref-topbar-inner{
  max-width:1180px; margin:0 auto; padding:8px 24px;
  display:flex; align-items:center; justify-content:flex-end; gap:22px;
  font-size:12.5px; line-height:1.65; color:#c2ced8;
}
.ref-topbar-name{ font-weight:700; color:#c9a657; }
.ref-topbar-name:empty{ display:none; }
.ref-topbar-link{ color:#c2ced8; text-decoration:none; }
.ref-topbar-link:hover{ color:#c9a657; }

/* Bestehenden Seiten-Header unter die Topbar ruecken... kontakt.html hat keins.
   Korrektur 31.07.2026 (Franz-Feedback): beim Runterscrollen verschwindet nur
   die Topbar, der Header soll dabei nach oben andocken statt die Luecke stehen
   zu lassen -- body.ref-topbar-collapsed wird vom Scroll-Handler in
   refTopbar.js zeitgleich mit .ref-topbar-hidden gesetzt. */
:root{ --ref-topbar-h:37px; }
header{ margin-top:var(--ref-topbar-h); transition:margin-top .3s ease; }
body.ref-topbar-collapsed header{ margin-top:0; }

.ref-floating-icons{
  position:fixed; right:18px; top:45%; transform:translateY(-50%);
  z-index:55; display:flex; flex-direction:column; gap:10px;
}
.ref-float-icon{
  width:44px; height:44px; border-radius:50%;
  background:rgba(0,15,41,0.85); border:1px solid rgba(201,166,87,0.4);
  color:#c9a657; display:flex; align-items:center; justify-content:center;
  font-size:18px; text-decoration:none; box-shadow:0 6px 18px rgba(0,0,0,0.35);
}
.ref-scrolltop{
  position:fixed; right:18px; bottom:24px; z-index:55;
  width:44px; height:44px; border-radius:50%;
  background:#c9a657; color:#00081a; border:none; display:flex; align-items:center; justify-content:center;
  font-size:18px; cursor:pointer; box-shadow:0 6px 18px rgba(0,0,0,0.35);
  opacity:0; pointer-events:none; transition:opacity .25s ease;
}
.ref-scrolltop.ref-scrolltop-visible{ opacity:1; pointer-events:auto; }
@media(max-width:600px){
  :root{ --ref-topbar-h:33px; }
  .ref-topbar-inner{ padding:8px 16px; gap:12px; font-size:11px; }
  .ref-floating-icons{ right:12px; gap:8px; }
  .ref-float-icon{ width:38px; height:38px; font-size:16px; }
  .ref-scrolltop{ right:12px; bottom:16px; width:38px; height:38px; font-size:16px; }
}