/* ============================================================
   DESIGN-VARIANTE: GRÜN
   Interne Bezeichnung, keine Firmennamen im Code. Überschreibt
   Farb-/Typo-Tokens von app.css. Nach app.css geladen.
   ============================================================ */

:root {
  --brand: #00a650;
  --brand-dark: #4e6d43;
  --brand-darker: #33472c;
  --brand-soft: #e3f5e9;
  --brand-softer: #f2faf4;

  --ink: #212934;
  --ink-2: #333333;

  --amber: #c0830b;
  --amber-soft: #fbf0dc;
  --sage: #99d424;
  --sage-soft: #f2f9e0;
  --rose: #9d1111;
  --rose-soft: #fbe7e7;

  --sh-focus: 0 0 0 3px rgba(0, 166, 80, 0.28);

  --font-display: 'Sen', Arial, sans-serif;
  --font-body: 'Roboto', Arial, sans-serif;
}

html[data-theme="dark"] {
  --brand: #3ecb7e;
  --brand-dark: #00a650;
  --brand-soft: rgba(62, 203, 126, 0.14);
  --brand-softer: rgba(62, 203, 126, 0.07);
  --ink: #eef2ee;
  --ink-2: #d3d8d3;

  --amber: #d8a23a;
  --amber-soft: rgba(216, 162, 58, 0.14);
  --sage: #99d424;
  --sage-soft: rgba(153, 212, 36, 0.14);
}

#login {
  --lg2-bg1: #ffffff; --lg2-bg2: #f4f8f3;
  --lg2-aside: #f7faf6; --lg2-aside-line: #dde7dc;
  --lg2-card: #ffffff; --lg2-card-brd: #dde7dc;
  --lg2-ink: #212934; --lg2-muted: #5a625b;
  --lg2-line: #00a650; --lg2-line-soft: rgba(0, 166, 80, .38);
  --lg2-glow: rgba(0, 166, 80, .14);
  --lg2-chip-bg: rgba(255,255,255,.95); --lg2-chip-brd: #dde7dc;
}

body { font-family: var(--font-body); }

.lg2-title,
.lg2-card-hd h2 {
  font-weight: 800;
  letter-spacing: -0.01em;
  font-variation-settings: normal;
}

.lg2-eyebrow,
.lg2-feat-h,
.lg2-metric-l {
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: 0.04em;
}

.lg-feat-h,
.section-title,
h1, h2, h3 {
  font-variation-settings: normal;
}

button, .btn, .app-iconbtn, input[type="submit"] {
  font-family: var(--font-body);
}
.btn-primary, button[type="submit"], .lg2-cta {
  font-weight: 700;
  letter-spacing: 0.02em;
}
