/* Schriften lokal (SIL Open Font License 1.1, Inter Project Authors): keine Verbindung zu Google */
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url(/static/fonts/inter-latin.woff2) format("woff2-variations"),url(/static/fonts/inter-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter Tight";font-style:normal;font-weight:100 900;font-display:swap;src:url(/static/fonts/inter-tight-latin.woff2) format("woff2-variations"),url(/static/fonts/inter-tight-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Beweissiegel Design-System v1 (25.10.2026) - EINE Quelle fuer alle Seiten.
   Dunkel, warm-schwarz, Gold. Keine Blau- oder Grautoene.
   Geladen als letzte Stylesheet-Datei; ueberschreibt die Farben der alten Seiten-Variablen. */

/* 1. Tokens ------------------------------------------------------------ */
:root{
  --bs-bg:#0c0b09; --bs-bg-soft:#1b1810; --bs-panel:#15130e; --bs-panel-hi:#1d1a12;
  --bs-line:#2d2916; --bs-line-hi:#5c4d1d;
  --bs-text:#ece7dc; --bs-muted:#a39b8a;
  --bs-gold:#d4af37; --bs-gold-hi:#f6dfa8; --bs-gold-lo:#b8862a; --bs-on-gold:#1a1204;
  --bs-ok:#4ade80; --bs-err:#f87171; --bs-warn:#f9d153;
  --bs-r-sm:12px; --bs-r-md:20px; --bs-r-lg:28px; --bs-pill:999px;
  --bs-font:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --bs-font-head:'Inter Tight',Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --bs-foil:linear-gradient(100deg,#f6dfa8 0%,#d4af37 38%,#b8862a 62%,#f6dfa8 100%);
  --bs-btn:linear-gradient(180deg,#f9e6b4,#d4af37 70%,#b8862a);

  /* Alte Variablen der Einzelseiten auf die Tokens umbiegen */
  --bg:var(--bs-bg); --bg-soft:var(--bs-bg-soft); --panel:var(--bs-panel); --panel-hi:var(--bs-panel-hi);
  --border:var(--bs-line); --border-hi:var(--bs-line-hi);
  --text:var(--bs-text); --muted:var(--bs-muted);
  --accent:var(--bs-gold); --accent-soft:rgba(212,175,55,.12);
  --ok:var(--bs-ok); --ok-soft:rgba(74,222,128,.12);
  --err:var(--bs-err); --err-soft:rgba(248,113,113,.10); --warn:var(--bs-err);
  --card:var(--bs-panel); --gold:var(--bs-gold); --line:var(--bs-line); --mute:var(--bs-muted);
}
html{color-scheme:dark;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
::selection{background:var(--bs-gold);color:#0c0b09}

/* 2. Grundlagen --------------------------------------------------------- */
body{
  font-family:var(--bs-font);background-color:var(--bs-bg);color:var(--bs-text);
  background-image:radial-gradient(rgba(212,175,55,.055) 1px,transparent 0);background-size:24px 24px;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
h1,h2,h3{font-family:var(--bs-font-head);font-weight:700;letter-spacing:-.02em;color:var(--bs-text);text-wrap:balance}
p{text-wrap:pretty}
a{color:var(--bs-gold)}
:focus-visible{outline:3px solid var(--bs-gold-hi);outline-offset:3px;border-radius:6px}

/* 3. Seitenkopf (Hero) ---------------------------------------------------- */
header{
  background:radial-gradient(900px 380px at 50% -30%,rgba(212,175,55,.17),transparent 62%),var(--bs-bg);
  border-bottom:1px solid var(--bs-line);
}
header h1{
  font-weight:700;letter-spacing:-.035em;line-height:1.05;padding-bottom:.08em;
  background:var(--bs-foil);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
}
header p{color:var(--bs-muted)}
h2{border-left-color:var(--bs-gold)}

/* 4. Karten ------------------------------------------------------------------ */
.card,.who,.stat{
  background:linear-gradient(180deg,var(--bs-panel-hi),var(--bs-panel));
  border:1px solid var(--bs-line);border-radius:var(--bs-r-md);
  box-shadow:0 24px 48px -32px rgba(0,0,0,.8);
}
code{background:var(--bs-panel-hi);border:1px solid var(--bs-line);color:var(--bs-gold-hi)}

/* 5. Knoepfe ------------------------------------------------------------------- */
a.btn,button:not([class]){
  font-family:var(--bs-font);font-weight:600;color:var(--bs-on-gold);
  background:var(--bs-btn);border:0;border-radius:var(--bs-pill);
  box-shadow:0 1px 0 rgba(255,255,255,.55) inset,0 14px 28px -12px rgba(212,175,55,.55);
  transition:transform .1s ease-out,opacity .1s ease-out;-webkit-tap-highlight-color:transparent;
}
a.btn:active,button:not([class]):active{transform:scale(.97);opacity:.92}
@media (hover:hover){a.btn:hover,button:not([class]):hover{opacity:.92;transform:translateY(-1px)}}
a.btn.secondary,button.secondary{
  background:transparent;color:var(--bs-text);box-shadow:0 0 0 1px var(--bs-line-hi) inset;
}
a.btn.secondary:hover,button.secondary:hover{background:var(--bs-panel-hi)}
button:not([class]):disabled{opacity:.55;cursor:default;transform:none}

/* 6. Formulare ----------------------------------------------------------------- */
label{color:var(--bs-muted)}
input,select,textarea{
  font-family:var(--bs-font);color:var(--bs-text);background:#100f0b;
  border:1px solid var(--bs-line-hi);border-radius:var(--bs-r-sm);
}
input::placeholder,textarea::placeholder{color:#6f685a}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--bs-gold);box-shadow:0 0 0 3px rgba(212,175,55,.2)}

/* 7. Hinweise -------------------------------------------------------------------- */
.warn{background:#1c1a10;border:1px solid #8a6f2a;color:var(--bs-warn);border-radius:var(--bs-r-sm)}

/* 8. Fuss ------------------------------------------------------------------------- */
footer{border-top:1px solid var(--bs-line);color:var(--bs-muted);background:transparent}
footer a{color:var(--bs-muted)}

/* 9. Gemeinsame Kopfleiste (auf allen Seiten gleich) -------------------------------- */
.bs-top{
  display:flex;flex-wrap:wrap;gap:10px 24px;align-items:center;justify-content:space-between;
  padding:14px max(20px,calc((100% - 1180px)/2 + 20px));
  background:rgba(12,11,9,.72);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border-bottom:1px solid var(--bs-line);position:relative;z-index:20;font-family:var(--bs-font);
}
.bs-top.sticky{position:sticky;top:0}
.bs-top .bs-brand{display:flex;align-items:center;gap:12px;color:var(--bs-text);text-decoration:none;font-family:var(--bs-font-head);font-weight:700;font-size:1.25rem;letter-spacing:-.02em}
.bs-top .bs-brand img{width:40px;height:auto;display:block;filter:drop-shadow(0 6px 10px rgba(212,175,55,.35))}
.bs-top nav{display:flex;flex-wrap:wrap;gap:4px 22px;align-items:center;font-size:.9375rem;font-weight:500}
.bs-top nav a{color:var(--bs-text);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.bs-top nav a:hover{color:var(--bs-gold-hi)}
.bs-top nav a.bs-reg{color:var(--bs-on-gold);background:var(--bs-btn);padding:0 20px;min-height:40px;border-radius:var(--bs-pill);font-weight:600}
.bs-top nav a.bs-reg:hover{color:var(--bs-on-gold);opacity:.92}
@media (max-width:640px){.bs-top{padding-top:10px;padding-bottom:6px;gap:6px 12px}.bs-top nav{width:100%;flex-wrap:nowrap;overflow-x:auto;gap:0 18px;scrollbar-width:none;-webkit-overflow-scrolling:touch}.bs-top nav::-webkit-scrollbar{display:none}.bs-top nav a{flex:0 0 auto;min-height:40px}.bs-top nav a[data-bs]{order:-1}.bs-top nav a.bs-reg{min-height:36px;padding:0 16px}.bs-top .bs-brand img{width:34px}}

/* 10. Eingabe-Einstellungen des Geraets ------------------------------------------------ */
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}a.btn,button:not([class]){transition:none}a.btn:active,button:not([class]):active{transform:none}}
@media (prefers-reduced-transparency:reduce){.bs-top{background:var(--bs-bg);-webkit-backdrop-filter:none;backdrop-filter:none}}
@media (prefers-contrast:more){.card,.who,.stat{border-color:var(--bs-gold)}.bs-top{background:var(--bs-bg);-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom-color:var(--bs-gold)}}