/* lc-codex.css - EIN Design-System fuer die oeffentlichen Loewen-Codex-Kundenseiten (LOG-0719, 2026-10-09).
   Quelle der Token-Palette und der Basiskomponenten: connect/index.html (THE LION KEY) - der hoechste,
   premium Schwarz/Gold-Stand (#070605). Diese Datei ist ab jetzt die EINE Quelle der Design-Tokens.
   Family A (index, einheiten/<slug>, einheiten/index, store, termin, Rechtstexte, magazin) laedt sie und
   hat ihre duplizierten :root-Token-Bloecke abgelegt. Keine Google-Fonts (System-Serif/Sans/Mono).

   AUFBAU:
   1) :root  - vollstaendige Token-Palette (Union aller Family-A-Tokens, Werte auf connect vereinheitlicht).
   2) .lc-codex ...  - Basiskomponenten aus connect, BEWUSST unter .lc-codex gescoped, damit sie NICHT
      mit den gleichnamigen Inline-Klassen bestehender Seiten (.btn/.card/...) kollidieren. Neue Seiten
      setzen class="lc-codex" auf <body> (oder einen Wrapper) und bekommen die Komponenten frei Haus. */

:root{
  /* --- Flaechen / Hintergrund (connect) --- */
  --bg:#070605; --bg2:#0d0b08; --bg3:#100d09;
  --card:#141009; --card2:#1a150c;
  --line:rgba(201,162,39,.16); --line2:rgba(201,162,39,.32);

  /* --- Gold --- */
  --gold1:#f4e2b0; --gold2:#c9a227; --gold3:#8a6a1b; --gold4:#5c4712;
  --gold4t:#a1802a;            /* lesbare Textfassung von --gold4 (>=4,5:1 auf jedem Grund) */
  --thin:#e3cf9a;             /* ruhiges Gold fuer H2 ohne Leuchten */

  /* --- Text (connect: minimal heller/premium, Kontrast steigt gegenueber dem alten Family-A-Stand) --- */
  --text:#ece6da; --muted:#b3a996; --dim:#948a7a;

  /* --- Status / Einheiten-Reife --- */
  --live:#63c07d; --beta:#d9a441; --aufbau:#8ea9cb; --konzept:#8b8378;
  --err:#ff8f7a; --ok:#9be29b;

  /* --- Schrift (keine Google-Fonts; fuellste Family-A/connect-Stacks) --- */
  --serif:'Iowan Old Style','Palatino Linotype',Palatino,Georgia,'Times New Roman',serif;
  --sans:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,'SF Mono',Menlo,Consolas,'Courier New',monospace;

  /* --- Abstandsskala (Viertelschritte von 4px) --- */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:72px; --s9:96px;

  /* --- Layout-Masse --- */
  --schacht:clamp(1080px, 88vw, 1440px);
  --rand:clamp(16px, 3.2vw, 44px);

  /* --- Lesebreiten --- */
  --mess:64ch; --mess-eng:56ch; --mess-weit:72ch;
}

/* ============================================================
   BASISKOMPONENTEN (aus connect/index.html), gescoped unter .lc-codex
   -> kollidieren NICHT mit den Inline-Klassen bestehender Seiten.
   ============================================================ */

.lc-codex .kicker{font:600 11px/1.4 var(--mono);letter-spacing:.34em;color:var(--gold2);text-transform:uppercase}
.lc-codex .claim{font:600 12.5px/1.6 var(--mono);letter-spacing:.26em;color:var(--gold2);text-transform:uppercase}

.lc-codex .btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:54px;
  padding:0 16px;border-radius:12px;font:600 15.5px/1.2 var(--sans);letter-spacing:.04em;text-decoration:none;
  border:1px solid var(--line2);color:var(--text);background:var(--card);cursor:pointer}
.lc-codex .btn.primary{min-height:60px;font-size:16.5px;letter-spacing:.07em;
  background:linear-gradient(180deg,#f0d684,var(--gold2));color:#140f04;border-color:var(--gold1);
  box-shadow:0 14px 34px -14px rgba(201,162,39,.65),inset 0 1px 0 rgba(255,255,255,.3)}
.lc-codex .btn.gold{border-color:var(--gold2);color:var(--gold1)}
.lc-codex .btn:focus-visible,
.lc-codex input:focus-visible,.lc-codex select:focus-visible,
.lc-codex textarea:focus-visible,.lc-codex summary:focus-visible{outline:2px solid var(--gold1);outline-offset:3px}

.lc-codex .card{position:relative;padding:22px 20px 24px;border:1px solid var(--line);border-radius:16px;
  background:linear-gradient(180deg,rgba(26,21,12,.78),rgba(16,12,7,.72))}

.lc-codex .sep{height:1px;background:linear-gradient(90deg,transparent,var(--line2),transparent);margin:30px 0}

.lc-codex .chk{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--muted)}
.lc-codex .chk input{width:22px;height:22px;margin:1px 0 0;flex:0 0 22px;accent-color:#c9a227}

.lc-codex .status{padding:12px 14px;border-radius:10px;font-size:14.5px;display:none}
.lc-codex .status.ok{display:block;border:1px solid rgba(155,226,155,.4);color:var(--ok);background:rgba(155,226,155,.06)}
.lc-codex .status.err{display:block;border:1px solid rgba(255,143,122,.45);color:var(--err);background:rgba(255,143,122,.06)}
.lc-codex .status.info{display:block;border:1px solid var(--line2);color:var(--muted)}

/* Reduzierte-Bewegung-Respekt fuer die gescopten Komponenten */
@media (prefers-reduced-motion:no-preference){
  .lc-codex .btn{transition:transform .15s ease,border-color .2s ease,box-shadow .2s ease}
  .lc-codex .btn:active{transform:scale(.985)}
}