/* Diese Datei wird aus index.html gespeist: Grundgeruest, Kopfzeile und
   Fusszeile sind woertlich von dort uebernommen, damit die Rechtsseiten
   nicht auseinanderlaufen. Bei Aenderungen an index.html hier nachziehen. */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#FAFAFA;color:#09090B;
  font-family:'Geist',-apple-system,'Helvetica Neue',Arial,sans-serif;
  font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:clip}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
p{margin:0}

:root{
  --dark:#08090A;        --light:#FAFAFA;       --yellow:#F2FF00;
  --ink:#09090B;         --card-dark:#0F0F0F;   --line-dark:#2A2A2B;
  --line-badge:#1F1F1F;  --line-light:#E1E1E1;  --line-step:#DADADA;
  --muted-dark:#9A9A9A;  --muted-1:#585A64;     --muted-2:#62666D;
  --muted-foot:#9CA1AB;  --placeholder:#A3AAB6;
  --pad:120px; --r:8px; --rc:10px;
  --tight:-.008em;                       /* Laufweite der Display-Schrift */
}

.wrap{width:100%;max-width:calc(1440px + 2*var(--pad));margin:0 auto;padding:0 var(--pad)}

/* ---------- Bausteine --------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;
  height:46px;border-radius:var(--r);
  font-size:13px;font-weight:500;letter-spacing:.07em;text-transform:uppercase;
  white-space:nowrap;transition:opacity .2s}
.btn:hover{opacity:.82}
.btn svg{flex:none;width:14px;height:13px}
.btn--dark{background:#000;color:#FAFAFA}
.btn--light{background:#F4F6F6;color:var(--dark)}

.badge{display:inline-flex;align-items:center;gap:9px;height:35px;padding:0 14px;
  border-radius:6px;font-size:11.5px;font-weight:500;letter-spacing:.06em;
  text-transform:uppercase;vertical-align:top}
.badge::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--yellow);flex:none}
/* Der Punkt schlaegt langsam — wie eine Live-Anzeige. Auf hellen Abzeichen
   orange, auf dunklen im Signalgelb. */
.badge--light::before{background:#FF6200;animation:puls-orange 1.5s ease-out infinite}
.badge--dark::before{animation:puls-gelb 1.5s ease-out infinite}
@keyframes puls-orange{
  0%{box-shadow:0 0 0 0 rgba(255,98,0,.55)}
  60%{box-shadow:0 0 0 7px rgba(255,98,0,0)}
  100%{box-shadow:0 0 0 0 rgba(255,98,0,0)}
}
@keyframes puls-gelb{
  0%{box-shadow:0 0 0 0 rgba(242,255,0,.50)}
  60%{box-shadow:0 0 0 7px rgba(242,255,0,0)}
  100%{box-shadow:0 0 0 0 rgba(242,255,0,0)}
}
.badge--dark{background:#000;border:1px solid var(--yellow);color:var(--yellow)}
.badge--light{background:#fff;border:1px solid var(--line-light);color:var(--ink)}

h1,h2,h3{margin:0;font-weight:300;letter-spacing:var(--tight)}
.h-display{font-size:112px;line-height:111px}     /* Hero + Partner-Sektion */
.h-section{font-size:70px;line-height:84px}       /* Sektions-Überschriften */
.lede{font-size:19.5px;line-height:26px}


/* ---------- Bausteine --------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;
  height:46px;border-radius:var(--r);
  font-size:13px;font-weight:500;letter-spacing:.07em;text-transform:uppercase;
  white-space:nowrap;transition:opacity .2s}
.btn:hover{opacity:.82}
.btn svg{flex:none;width:14px;height:13px}
.btn--dark{background:#000;color:#FAFAFA}
.btn--light{background:#F4F6F6;color:var(--dark)}

.badge{display:inline-flex;align-items:center;gap:9px;height:35px;padding:0 14px;
  border-radius:6px;font-size:11.5px;font-weight:500;letter-spacing:.06em;
  text-transform:uppercase;vertical-align:top}
.badge::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--yellow);flex:none}
/* Der Punkt schlaegt langsam — wie eine Live-Anzeige. Auf hellen Abzeichen
   orange, auf dunklen im Signalgelb. */
.badge--light::before{background:#FF6200;animation:puls-orange 1.5s ease-out infinite}
.badge--dark::before{animation:puls-gelb 1.5s ease-out infinite}
@keyframes puls-orange{
  0%{box-shadow:0 0 0 0 rgba(255,98,0,.55)}
  60%{box-shadow:0 0 0 7px rgba(255,98,0,0)}
  100%{box-shadow:0 0 0 0 rgba(255,98,0,0)}
}
@keyframes puls-gelb{
  0%{box-shadow:0 0 0 0 rgba(242,255,0,.50)}
  60%{box-shadow:0 0 0 7px rgba(242,255,0,0)}
  100%{box-shadow:0 0 0 0 rgba(242,255,0,0)}
}
.badge--dark{background:#000;border:1px solid var(--yellow);color:var(--yellow)}
.badge--light{background:#fff;border:1px solid var(--line-light);color:var(--ink)}


/* ---------- Kopfzeile --------------------------------------------------- */
.header{position:sticky;top:0;z-index:200;background:var(--light);
  transition:background .28s ease,box-shadow .28s ease,backdrop-filter .28s ease}
/* Erste Stufe: Milchglas, sobald die Seite bewegt wird. */
.header.glas{background:rgba(250,250,250,.72);
  backdrop-filter:saturate(1.4) blur(16px);-webkit-backdrop-filter:saturate(1.4) blur(16px);
  box-shadow:0 1px 0 rgba(9,9,11,.07)}
/* Zweite Stufe: deckendes Weiss, sobald die Buehne durchgelaufen ist. */
.header.fest{background:#FFFFFF;backdrop-filter:none;-webkit-backdrop-filter:none;
  box-shadow:0 1px 0 rgba(9,9,11,.09)}
.header-inner{max-width:1680px;margin:0 auto;padding:0 100px;height:80px;
  display:flex;align-items:center}
.header-logo{height:21.6px;width:auto}
.header-nav{margin-left:auto;display:flex;align-items:center;gap:26px;font-size:16px}
.burger{display:none;margin-left:auto;width:44px;height:44px;
  flex-direction:column;align-items:center;justify-content:center;gap:5px}
.burger span{display:block;width:22px;height:1.5px;background:var(--ink);border-radius:1px;
  transition:transform .25s ease,opacity .2s ease}
.header.offen .burger span:nth-child(1){transform:translateY(3.25px) rotate(45deg)}
.header.offen .burger span:nth-child(2){transform:translateY(-3.25px) rotate(-45deg)}
.menue{position:absolute;left:0;right:0;top:100%;display:none;flex-direction:column;
  background:#fff;border-top:1px solid var(--line-light);
  box-shadow:0 18px 44px rgba(9,9,11,.12);padding:8px var(--pad) 28px}
.header.offen .menue{display:flex}
.menue a:not(.btn){font-size:17px;line-height:24px;padding:16px 2px;
  border-bottom:1px solid var(--line-light)}
.header .menue .btn{margin-top:24px;margin-left:0;align-self:flex-start;
  width:auto;padding:0 22px}
.header-nav a:hover{opacity:.6}
.header .btn{margin-left:41px;width:188px}


/* ---------- Footer ------------------------------------------------------- */
.footer{background:var(--dark);color:#fff;padding-top:80.9px}
.footer-inner{max-width:1680px;margin:0 auto;padding:0 152px}
.footer-cols{display:grid;grid-template-columns:554px 439px 1fr}
.footer h4{margin:0;font-size:17.5px;line-height:24px;font-weight:400;letter-spacing:var(--tight)}
.footer-text{font-size:14px;line-height:22.5px;color:var(--muted-foot);max-width:340px}
.col-adm .footer-text{margin-top:23.5px;max-width:345px}
.col-adm .btn{margin-top:32.6px;width:188px}
.sprache{position:relative;display:inline-block;margin-top:23.2px}
.lang{display:inline-flex;align-items:center;gap:12px;width:202px;height:48px;
  padding:0 18px;background:#191919;border-radius:var(--r);font-size:16px}
.lang .arr{margin-left:auto;display:flex;transition:transform .18s ease;
  transform:rotate(90deg)}
.sprache.offen .lang .arr{transform:rotate(-90deg)}
.sprache-liste{position:absolute;left:0;top:calc(100% + 8px);width:202px;
  background:#191919;border:1px solid #2A2A2B;border-radius:var(--r);padding:6px 0;
  box-shadow:0 14px 34px rgba(0,0,0,.45)}
.sprache-liste[hidden]{display:none}
.sprache-liste button{display:flex;align-items:center;gap:12px;width:100%;
  padding:11px 18px;font-size:16px;color:#fff;text-align:left;cursor:pointer}
.sprache-liste button:hover:not([disabled]){background:#232325}
.sprache-liste button[disabled]{color:var(--muted-foot);cursor:default}
.sprache-liste .aw-marke{margin-left:auto;background:#2A2A2B;color:var(--muted-foot)}
.footer-contact{margin-top:24.3px;font-size:14.7px;color:#fff}
.footer-contact .adr{line-height:24px}
.footer-contact .mail{margin-top:13px;line-height:35px}
.footer-contact .tel{margin-top:7px;line-height:24px;display:flex;align-items:center}
.footer-contact a:hover{color:var(--muted-foot)}
.tag{display:inline-flex;align-items:center;height:24px;padding:0 8px;margin-left:11px;
  border:1px solid var(--yellow);border-radius:4px;
  font-family:'Geist Mono',monospace;font-size:11px;letter-spacing:.1em;color:var(--yellow)}
.footer-logo{margin-top:120px;height:43.7px;width:auto}
.footer-rule{margin-top:35.5px;height:1px;background:rgba(255,255,255,.14)}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;
  padding:22px 0 56px;font-size:10.5px;line-height:16px;color:var(--muted-foot)}
.footer-bottom nav{display:flex;gap:28px}
.footer-bottom a:hover{color:#fff}



/* ---------- Kleinere Bildschirme ---------------------------------------- */
@media (max-width:1560px){
  :root{--pad:64px}
  .header-inner,.footer-inner{padding:0 64px}
  .footer-cols{grid-template-columns:1fr 1fr 1fr}
}
@media (max-width:1100px){
  :root{--pad:28px}
  .header-inner,.footer-inner{padding:0 28px}
  .header-nav{display:none}
  .header-inner > .btn{display:none}
  .burger{display:flex}
  .footer-cols{grid-template-columns:1fr;gap:56px}
  .footer-text br{display:none}
  .footer-logo{margin-top:64px}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:20px;
    padding:24px 0 48px}
  .footer-bottom nav{flex-wrap:wrap;gap:18px 26px}
}
@media (prefers-reduced-motion:reduce){
  .badge--light::before,.badge--dark::before{animation:none}
}
