/* Spartan Intelligence · MARKE (gemeinsame Bausteine für alle Seiten: Hauptseite, /james/, Hub, Sicherheits-Check, Danke- und Rechtsseiten)
   Stil: modern, klar, hochwertig, ohne Neon (Marineblau, Blau-Akzent, neutrales Grau-Weiß). Variablennamen --si-gold* bezeichnen den Blau-Akzent, --si-schwarz das Marineblau. Nur Systemschriften (CSP). Version 2026-10-10.
   Regeln: ALLE Klassen und Variablen tragen das Präfix si-. Keine Element-Regeln (body, h1–h4, section, a, span, img), keine Layout-Klassen.
   Belegte Klassen: si-logo, si-kopfleiste, si-kopf, si-nav, si-navlink, si-menue-knopf, si-handy-menue, si-knopf (+ si-s, si-g, si-o, si-klein, si-voll),
   si-ic, si-icbox, si-kicker, si-link-gold, si-karte, si-fuss, si-fcols, si-frecht. Weitere Bausteine nur nach Absprache mit dem Chat "Website-Architektur". */
:root{
  --si-bg:#f2f3f5; --si-weiss:#fff; --si-alt:#e8eaed;
  --si-text:#0f1b2d; --si-grau:#586272; --si-linie:#dfe2e6; --si-linie2:#c8cdd4;
  --si-schwarz:#0e2744; --si-gold:#4d94e8; --si-gold2:#2f6fbd; --si-goldt:#eceff3;
  --si-gold-text:#1f5aa3; /* goldene SCHRIFT auf hellem Grund (Kontrast >= 5:1); Flächen und Linien bleiben --si-gold */
  --si-gruen:#0f8f5f;
  --si-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,Roboto,"Helvetica Neue",Arial,sans-serif;
  --si-mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
}
/* Logo: Helm als Bild, Wortmarke als Text */
.si-logo{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--si-schwarz);font:600 14px var(--si-mono);letter-spacing:.2em;white-space:nowrap}
.si-logo img{height:40px;width:auto;display:block}
.si-logo b{font-weight:600;color:inherit}
@media(max-width:380px){.si-logo{font-size:12px;letter-spacing:.14em;gap:9px}.si-logo img{height:34px}}
/* Kopf */
.si-kopfleiste{position:sticky;top:0;z-index:50;background:rgba(242,243,245,.97);border-bottom:1px solid var(--si-linie);font-family:var(--si-sans)}
.si-kopf{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 20px;position:relative;max-width:1360px;margin:0 auto}
.si-nav{display:flex;align-items:center;gap:28px;font-size:14.5px}
.si-navlink{text-decoration:none;color:var(--si-text);padding:6px 0;border-bottom:2px solid transparent;white-space:nowrap}
.si-navlink:hover{border-bottom-color:var(--si-gold)}
.si-navlink[aria-current]{border-bottom-color:var(--si-text);font-weight:600}
.si-menue-knopf{display:none;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--si-linie2);border-radius:8px;background:#fff;color:var(--si-text);cursor:pointer}
.si-menue-knopf svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;pointer-events:none}
.si-menue-knopf .zu{display:none}
.si-menue-knopf[aria-expanded="true"] .auf{display:none}
.si-menue-knopf[aria-expanded="true"] .zu{display:block}
.si-handy-menue{position:absolute;left:12px;right:12px;top:calc(100% + 4px);z-index:60;background:#fff;border:1px solid var(--si-linie2);border-radius:12px;box-shadow:0 24px 60px rgba(0,0,0,.16);padding:8px;display:flex;flex-direction:column}
.si-handy-menue[hidden]{display:none}
.si-handy-menue a{display:flex;justify-content:space-between;align-items:center;min-height:50px;padding:0 14px;border-radius:8px;text-decoration:none;font-weight:600;font-size:17px;color:var(--si-text)}
.si-handy-menue a::after{content:"→";color:var(--si-grau);font-weight:400}
.si-handy-menue a:hover{background:var(--si-bg)}
.si-handy-menue .si-knopf{margin-top:6px;color:#fff;justify-content:center}.si-handy-menue .si-knopf::after{content:none}
@media(max-width:1080px){.si-nav .si-navlink,.si-nav>.si-knopf{display:none}.si-menue-knopf{display:inline-flex}}
@media(min-width:1081px){.si-handy-menue{display:none!important}}
/* Knöpfe */
.si-knopf{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:6px;padding:13px 24px;font:600 15px var(--si-sans);text-decoration:none;border:1.5px solid transparent;cursor:pointer;white-space:nowrap}
.si-knopf.si-s{background:var(--si-schwarz);color:#fff}
.si-knopf.si-s:hover{background:#17375d}
.si-knopf.si-g{background:var(--si-gold2);color:#fff}
.si-knopf.si-g:hover{background:#255a99}
.si-knopf.si-o{background:transparent;color:var(--si-text);border-color:var(--si-text)}
.si-knopf.si-o:hover{background:#fff}
.si-knopf.si-klein{padding:9px 18px;font-size:14px}
.si-knopf.si-voll{width:100%}
.si-knopf:focus-visible,.si-navlink:focus-visible,.si-menue-knopf:focus-visible{outline:2px solid var(--si-gold2);outline-offset:2px}
/* Symbole */
.si-ic{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.si-icbox{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:var(--si-schwarz);color:var(--si-gold);box-shadow:0 8px 20px rgba(0,0,0,.18);flex:none}
/* Goldene Schrift auf hellem Grund */
.si-kicker{font:600 11.5px/1.4 var(--si-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--si-gold-text)}
.si-link-gold{color:var(--si-gold-text);text-decoration:underline;text-underline-offset:3px}
/* Karte */
.si-karte{background:#fff;border:1px solid var(--si-linie);border-radius:12px;padding:26px}
/* Fuß */
.si-fuss{background:var(--si-schwarz);color:#c9d1db;padding:52px 0 26px;font:14.5px/1.6 var(--si-sans)}
.si-fuss a{color:#c9d1db;text-decoration:none}.si-fuss a:hover{color:#fff;text-decoration:underline}
.si-fuss .si-logo{color:#fff}.si-fuss .si-logo b{color:inherit}
.si-fuss>div{max-width:1360px;margin:0 auto;padding:0 20px}
.si-fcols{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:28px}
@media(max-width:900px){.si-fcols{grid-template-columns:1fr 1fr}.si-fcols>div:first-child{grid-column:1/-1}}
.si-fcols h4{color:#fff;font-size:13px;letter-spacing:.08em;text-transform:uppercase;margin:0 0 12px}
.si-fcols ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.si-frecht{margin-top:36px;padding-top:20px;border-top:1px solid rgba(255,255,255,.14);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;font-size:13px;color:#93a0b2}
@media print{.si-kopfleiste{position:static}}
