/* GETALWIN v70: Gemeinsame Bausteine (Player, Consent, Burger, Formular,
   Mobile-Basis) + Legacy-Stützen für die noch nicht neu komponierten
   Unterseiten (dc-Export-Markup unter .sc-host). Die Startseite nutzt
   zusätzlich assets/home.css. */

/* Mobile: Nav-Links einklappen (Burger übernimmt ab derselben Breite) */
@media (max-width: 860px){
  header nav{ display: none !important; }
}

/* ---------- Video-Overlay (Dialog) ---------- */
#ga-player{position:fixed;inset:0;z-index:2147482000;background:rgba(4,5,8,.92);
  display:grid;place-items:center;padding:20px;animation:gaFade .2s ease}
#ga-player .vp-box{width:min(960px,96vw);position:relative}
#ga-player video{width:100%;border-radius:14px;border:1px solid rgba(255,255,255,.14);
  background:#000;box-shadow:0 30px 80px rgba(0,0,0,.6)}
#ga-player .vp-close{position:absolute;top:-54px;right:0;width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);color:#EEF1F6;
  border-radius:50%;font:400 17px/1 Manrope,sans-serif;cursor:pointer;
  transition:background .18s ease,border-color .18s ease,transform .18s ease}
#ga-player .vp-close:hover{background:rgba(77,224,199,.16);border-color:rgba(77,224,199,.5);transform:scale(1.06)}
#ga-player .vp-close:focus-visible{outline:2px solid rgba(77,224,199,.7);outline-offset:2px}
@keyframes gaFade{from{opacity:0}to{opacity:1}}

/* ---------- Formular-Feedback ----------
   Platz ist immer reserviert: Validierungsmeldungen erzeugen keinen
   Layout-Shift. Fehler nicht nur über Farbe (Text beschreibt das Problem). */
.ga-form-msg{margin:0;font:500 14px/1.5 Manrope,sans-serif;display:block;min-height:21px}
.ga-form-msg.ok{color:#4DE0C7}
.ga-form-msg.err{color:#ff8f8f}

/* Ziel-Chips aktiv */
.ga-chip-on{border-color:rgba(77,224,199,.6) !important;background:rgba(77,224,199,.14) !important;
  color:#4DE0C7 !important}

/* ---------- Cookie-Consent (dunkles Design) ---------- */
#ga-consent{position:fixed;left:12px;right:12px;bottom:12px;z-index:2147483000;animation:gacUp .3s ease}
#ga-consent .gac-box{max-width:720px;margin:0 auto;background:#0C0E14;border:1px solid rgba(255,255,255,.14);
  border-radius:14px;padding:16px 18px;box-shadow:0 20px 60px rgba(0,0,0,.55);
  font:400 13.5px/1.55 Manrope,sans-serif;color:#AEB6C6}
#ga-consent b{color:#EEF1F6}
#ga-consent a{color:#4DE0C7}
#ga-consent .gac-btns{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
#ga-consent button{font:600 13px Manrope,sans-serif;border-radius:9px;padding:9px 14px;cursor:pointer;
  border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);color:#DCE1EB}
#ga-consent button.gac-acc{background:#4DE0C7;border-color:#4DE0C7;color:#052019}
#ga-consent-modal{position:fixed;inset:0;z-index:2147483001;background:rgba(0,0,0,.6);
  display:grid;place-items:center;padding:18px;animation:gaFade .2s ease}
#ga-consent-modal .gac-m{width:min(520px,94vw);background:#0C0E14;border:1px solid rgba(255,255,255,.14);
  border-radius:14px;padding:20px;color:#AEB6C6;font:400 13.5px/1.6 Manrope,sans-serif}
#ga-consent-modal h3{color:#EEF1F6;font:600 17px 'Space Grotesk',sans-serif;margin-bottom:10px}
#ga-consent-modal .gac-row{display:flex;justify-content:space-between;gap:14px;align-items:center;
  border-top:1px solid rgba(255,255,255,.08);padding:12px 0}
#ga-consent-modal .gac-row b{color:#EEF1F6;font-weight:600}
#ga-consent-modal .gac-btns{display:flex;gap:8px;justify-content:flex-end;margin-top:14px}
#ga-consent-modal button{font:600 13px Manrope,sans-serif;border-radius:9px;padding:9px 14px;cursor:pointer;
  border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);color:#DCE1EB}
#ga-consent-modal button.gac-acc{background:#4DE0C7;border-color:#4DE0C7;color:#052019}
#ga-consent-modal input[type="checkbox"]{accent-color:#4DE0C7;width:18px;height:18px}
@keyframes gacUp{from{transform:translateY(14px);opacity:0}to{transform:none;opacity:1}}
@media (max-width:760px){#ga-consent{bottom:calc(12px + env(safe-area-inset-bottom))}}

/* ---------- Menü-Button (Basis; Gestaltung des Panels: assets/mobile.css) ---------- */
#ga-burger{display:none;background:transparent;border:1px solid rgba(255,255,255,.16);border-radius:10px;
  width:42px;height:38px;cursor:pointer;padding:9px 10px;flex-direction:column;justify-content:space-between}
#ga-burger span{display:block;height:2px;background:#EEF1F6;border-radius:2px;transition:transform .25s,opacity .2s}
#ga-burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
#ga-burger.open span:nth-child(2){opacity:0}
#ga-burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media (max-width:860px){
  header a[href="login.html"]{display:none !important}
  header a[href="#kontakt"]{display:none !important}
  #ga-burger{display:flex}
}

/* ---------- Gemeinsame Basis ---------- */
html, body{overflow-x:clip}
section[id]{scroll-margin-top:78px}
.ga-m-only{display:none}
@media (max-width: 860px){
  .ga-d-only{display:none}
  .ga-m-only{display:inline}
}

/* ---------- Legacy-Unterseiten (dc-Export unter .sc-host) ---------- */
/* Sticky-Header + Full-bleed: der 1200px-Wrapper darf nicht clippen */
.sc-host div[style*="max-width: 1200px"][style*="overflow: hidden"]{overflow:visible !important}

/* Eine Designsprache: Unterseiten tragen dasselbe EINE Material über die
   volle Viewport-Breite (tiefes Blau-Schwarz, Nadelstreifen-Grid, Korn,
   Kopflicht) — identisch zur Startseite. Die Haarlinien der Bühne markieren
   den Inhalt, nicht das Ende des Materials. */
.sc-host > div[style*="background: rgb(6, 7, 10)"]{
  background:
    radial-gradient(1100px 620px at 50% -140px, rgba(255,255,255,.035), transparent 70%) 0 0/100% 100% no-repeat,
    linear-gradient(90deg, rgba(255,255,255,.024) 1px, transparent 1px) calc(50% - 30px) 0/60px 100%,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E"),
    #080A0F !important}

/* Bühne der Unterseiten: kein eigener Materialwechsel, nur Haarlinien */
.sc-host div[style*="max-width: 1200px"]{
  background:transparent !important;
  border-left-color:rgba(255,255,255,.07) !important;
  border-right-color:rgba(255,255,255,.07) !important}
/* Header-Glasleiste scrollbar-sicher über die volle sichtbare Breite
   (--ga-sbw wird von site.js gesetzt; 100vw allein versetzt den Inhalt
   auf Windows um die halbe Scrollbar-Breite) */
.sc-host header{width:calc(100vw - var(--ga-sbw, 0px));
  margin-left:calc(50% - 50vw + (var(--ga-sbw, 0px) / 2))}
.sc-host header > div{max-width:1200px;margin-left:auto;margin-right:auto}

/* ---------- FAQ: Hover, Fokus ---------- */
@media (hover: hover) and (pointer: fine){
  .ga-faq-q:hover{background:rgba(77,224,199,.05)}
}
.ga-faq-btn:focus-visible{outline:2px solid rgba(77,224,199,.7);outline-offset:3px;border-radius:6px}

/* Reduzierte Bewegung: endlose Inline-Animationen stilllegen (Legacy-Seiten) */
@media (prefers-reduced-motion: reduce){
  [style*="infinite"]{animation:none !important}
}

/* ---------- Qualitätsblock: Rechts-TOC, Hilfe-Pills/CTAs, Kaufen-Zustände ---------- */
/* AGB/Datenschutz-Inhaltsverzeichnis: keine Doppelnummerierung */
ol[style*="minmax(240px"]{list-style:none;padding-left:0 !important}
/* Hilfe: Kategorie-Anker unter Sticky-Header */
h2[id^="hilfe-"]{scroll-margin-top:88px}
/* Pills (Sprungnavigation) */
.ga-pill{transition:border-color .18s ease,background .18s ease,color .18s ease}
@media (hover:hover) and (pointer:fine){
  .ga-pill:hover{border-color:rgba(77,224,199,.5) !important;color:#EEF1F6 !important}
}
/* Sekundäre CTAs (WhatsApp, E-Mail) und Kontakt-Karten */
.ga-cta-sec, .ga-card-cta{transition:border-color .18s ease,background .18s ease}
@media (hover:hover) and (pointer:fine){
  .ga-cta-sec:hover{border-color:rgba(77,224,199,.45) !important;background:rgba(77,224,199,.05) !important}
  .ga-card-cta:hover{border-color:rgba(77,224,199,.5) !important;background:rgba(77,224,199,.09) !important}
}
/* Kaufen: Abrechnungskarten */
.ga-bill-card{transition:border-color .18s ease,background .18s ease}
@media (hover:hover) and (pointer:fine){
  .ga-bill-card:hover{border-color:rgba(77,224,199,.35) !important}
}
/* Konsistente Fokus-Ringe */
.ga-pill:focus-visible, .ga-cta-sec:focus-visible, .ga-card-cta:focus-visible,
.ga-bill-card:focus-visible, a.scp1:focus-visible{outline:2px solid rgba(77,224,199,.7);outline-offset:2px}

/* Scrollspy: aktiver Nav-Punkt */
header nav a.ga-nav-active{color:#4DE0C7 !important}

/* ---------- Footer-Linkzustände (alle Seiten) ----------
   Ruhezustand: gedämpftes Hellgrau (kommt aus home.css bzw. Inline-Styles);
   Teal ist Bedeutungsträger: Hover, Fokus und aktuelle Seite.
   !important nötig, um Inline-Farben der Legacy-Unterseiten zu übersteuern. */
footer a:hover{color:#4DE0C7 !important}
footer a:focus-visible{color:#4DE0C7 !important}
footer a.ga-current{color:#4DE0C7 !important}

/* ---------- Vorbereitete Social-Kanäle (noch ohne echte Profile) ---------- */
.ga-soon{cursor:pointer;opacity:.45}
.ga-soon:hover,.ga-soon:focus-visible{opacity:.75}
#ga-soon-toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));
  transform:translateX(-50%);z-index:2147483100;background:#0C0E14;
  border:1px solid rgba(255,255,255,.16);color:#DCE1EB;
  font:500 13px/1.4 Manrope,sans-serif;padding:9px 14px;border-radius:9px;
  box-shadow:0 12px 30px rgba(0,0,0,.5);pointer-events:none;white-space:nowrap;
  animation:gaFade .2s ease}

/* ---------- Mobile-Basis (gemeinsam, kein finales Mobil-Design) ---------- */
@media (max-width: 860px){
  header > div{height:56px !important;padding:0 16px !important}
  header a[href="#top"]{font-size:18px !important}
  section{padding-block:42px !important}
  section h2{font-size:clamp(27px, 7.6vw, 34px) !important}
  a.ga-menu-cta, #ga-submit{width:100%;justify-content:center}
  footer a{display:inline-flex;align-items:center;min-height:40px}
  #ga-player .vp-close{width:44px;height:44px;top:-54px}
  /* Legacy-Footer (Inline-Styles): Markenblock volle Breite, Linkgruppen zweispaltig */
  footer div[style*="min-width: 220px"]{grid-column:1 / -1;min-width:0 !important;text-align:center}
  footer div[style*="min-width: 220px"] div[style*="gap: 10px"]{justify-content:center}
  footer div[style*="flex-direction: column"][style*="gap: 10px"]{
    display:grid !important;grid-template-columns:1fr 1fr;gap:2px 18px !important}
  footer{padding:34px 18px calc(84px + env(safe-area-inset-bottom)) !important;font-size:13.5px}
  #kontakt input, #kontakt textarea, #kontakt select{font-size:16px !important}
}

/* ---------- Dünne Sticky-CTA-Leiste unten (mobil) ---------- */
#ga-ctabar{position:fixed;left:14px;right:14px;bottom:calc(10px + env(safe-area-inset-bottom));
  z-index:2147479000;transform:translateY(150%);transition:transform .3s ease;pointer-events:none}
#ga-ctabar.on{transform:none;pointer-events:auto}
#ga-ctabar a{display:flex;align-items:center;justify-content:center;height:46px;width:100%;
  background:#4DE0C7;color:#052019;font:600 15px Manrope,sans-serif;border-radius:12px;
  box-shadow:0 14px 34px rgba(0,0,0,.5)}
@media (min-width: 861px){
  #ga-ctabar{display:none}
}

/* Consent v2: Ablehnen und Akzeptieren gleichwertig, keine Dark Patterns */
.gac-btns button{min-height:40px}
.gac-btns button:not(.gac-acc){border:1px solid rgba(255,255,255,.28);color:var(--ink,#EDF1F7)}
.gac-note{margin-top:12px;font-size:12px;color:#8891A3}
.gac-note a{color:#4DE0C7}