/* ============================================================
   Design-Tokens · projects.andi24.de
   Ausgerichtet auf die andi24-Designsprache (Grundtemplate):
   Cyan #6ab2cf auf Slate, Poppins (Headlines) + Inter (Text),
   Signatur-Buttonform 45px 0 45px 45px.
   Light = Standard; Dark via prefers-color-scheme ODER [data-theme].
   ============================================================ */

/* Lokal eingebettete Webfonts (kein CDN, kein local()-Fallback → deterministisch).
   Statische Gewichte als woff2: Inter 400/600/700, Poppins 500/600/700,
   JetBrains Mono (eine Datei, deckt den genutzten Mono-Bereich ab). */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/inter-400.woff2") format("woff2");}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;
  src:url("../fonts/inter-600.woff2") format("woff2");}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;
  src:url("../fonts/inter-700.woff2") format("woff2");}
@font-face{font-family:"Poppins";font-style:normal;font-weight:500;font-display:swap;
  src:url("../fonts/poppins-500.woff2") format("woff2");}
@font-face{font-family:"Poppins";font-style:normal;font-weight:600;font-display:swap;
  src:url("../fonts/poppins-600.woff2") format("woff2");}
@font-face{font-family:"Poppins";font-style:normal;font-weight:700;font-display:swap;
  src:url("../fonts/poppins-700.woff2") format("woff2");}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 700;font-display:swap;
  src:url("../fonts/jetbrains-mono-400.woff2") format("woff2");}

:root{
  /* Markenanker (aus Grundtemplate) */
  --brand-cyan:#6ab2cf;
  --brand-cyan-dark:#4a9bb8;
  --brand-slate:#0f172a;
  --brand-grad:linear-gradient(135deg,#6ab2cf 0%,#0f172a 100%);

  /* Flächen / Linien (Slate-Skala) */
  --bg:#ffffff;
  --bg-alt:#f7f7f7;
  --surface:#ffffff;
  --tint:#f1f5f9;
  --line:#e2e8f0;
  --line-strong:#cbd5e1;

  /* Text */
  --ink:#0f172a;
  --muted:#64748b;

  /* Akzente */
  --accent:#3f8aa6;            /* Cyan, dunkel genug für Text/Links auf Weiß */
  --accent-bright:#6ab2cf;     /* Füllungen, Verläufe, Dark-BG-Akzent */
  --accent-strong:#2c6075;
  --accent-soft:#e7f2f6;
  --accent-ink:#205063;
  --amber:#bb7a18; --amber-soft:#f7edd9; --amber-ink:#7a4f08;
  --live:#2f8f63; --live-soft:#e2f3ea; --live-ink:#13623f;
  --idle:#7c8186; --idle-soft:#eceeee; --idle-ink:#454a4e;
  --danger:#c0443a; --danger-soft:#f8e6e4; --danger-ink:#8a2a22;

  --shadow:0 8px 24px rgba(15,23,42,.08);
  --shadow-strong:0 14px 40px rgba(15,23,42,.14);

  /* Typo / Maße */
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-display:"Poppins","Inter",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --maxw:1200px;
  --r:16px; --r-sm:8px; --r-pill:999px;
  --r-andi:45px 0 45px 45px;     /* Signaturform */
  --r-andi-sm:24px 0 24px 24px;
  --header-h:90px;
  --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-6:24px; --sp-8:32px; --sp-12:48px; --sp-16:64px;
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0b1016; --bg-alt:#0f141b; --surface:#141a22; --tint:#1a2230;
    --line:#24303d; --line-strong:#32404f;
    --ink:#e8edf3; --muted:#94a3b8;
    --accent:#6ab2cf; --accent-bright:#6ab2cf; --accent-strong:#8fc8de;
    --accent-soft:#14323d; --accent-ink:#bfe3f0;
    --amber:#e0a868; --amber-soft:#3a2f1a; --amber-ink:#f3d6a8;
    --live:#5fbf8f; --live-soft:#173529; --live-ink:#bfe9d3;
    --idle:#9aa1a5; --idle-soft:#2a3032; --idle-ink:#cdd4d6;
    --danger:#e0796d; --danger-soft:#3a211e; --danger-ink:#f4c8c1;
    --shadow:0 8px 24px rgba(0,0,0,.40); --shadow-strong:0 16px 40px rgba(0,0,0,.5);
  }
}
[data-theme="dark"]{
  --bg:#0b1016; --bg-alt:#0f141b; --surface:#141a22; --tint:#1a2230;
  --line:#24303d; --line-strong:#32404f;
  --ink:#e8edf3; --muted:#94a3b8;
  --accent:#6ab2cf; --accent-bright:#6ab2cf; --accent-strong:#8fc8de;
  --accent-soft:#14323d; --accent-ink:#bfe3f0;
  --amber:#e0a868; --amber-soft:#3a2f1a; --amber-ink:#f3d6a8;
  --live:#5fbf8f; --live-soft:#173529; --live-ink:#bfe9d3;
  --idle:#9aa1a5; --idle-soft:#2a3032; --idle-ink:#cdd4d6;
  --danger:#e0796d; --danger-soft:#3a211e; --danger-ink:#f4c8c1;
  --shadow:0 8px 24px rgba(0,0,0,.40); --shadow-strong:0 16px 40px rgba(0,0,0,.5);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);
  line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4{font-family:var(--font-display);letter-spacing:-.5px}
.mono{font-family:var(--mono)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--sp-6)}
a{color:var(--accent)}