/* ============================================================
   MAWERA LP „Restholz-zu-Energie" — Design-Tokens
   Abgeleitet aus mawera.com (Avada-Theme-Variablen + Fotoanalyse).
   Dokumentation: design/DESIGN-SYSTEM.md
   ============================================================ */

:root {
  /* ---- Farbe: Marke (exakte Werte von mawera.com) ---- */
  --c-green:        #014132;  /* Primär, dominante Fläche (awb-custom_color_1) */
  --c-orange:       #eb550a;  /* Handlungsfarbe — die Brennraumtür (awb-color5) */
  --c-leaf:         #65bc7b;  /* Sekundärsignal Öko/Erfolg */

  /* ---- Farbe: abgeleitete Abstufungen ---- */
  --c-green-deep:   #01251c;  /* dunkelste Fläche (Hero-Verankerung, Footer) */
  --c-green-soft:   #0b5140;  /* Linien/Karten auf Grün */
  --c-green-line:   #1c614f;  /* 1px-Linien auf Grün */
  --c-on-green:     #d9e5e0;  /* Fließtext auf Grün (WCAG AA: 9.2:1) */
  --c-on-green-dim: #9fbcb2;  /* Nebentext auf Grün (4.6:1) */
  --c-orange-hover: #c94708;  /* CTA-Hover */
  --c-leaf-dim:     #4a9a60;  /* Hellgrün gedimmt für helle Flächen */

  /* ---- Farbe: neutrale Flächen (warm, kein reines Weiß großflächig) ---- */
  --c-paper:        #f4f2ec;  /* helle Sektionsfläche, warmes Off-White */
  --c-paper-deep:   #eae7de;  /* zweite helle Fläche / Karten auf Paper */
  --c-white:        #ffffff;  /* nur kleinflächig (Karten, Formularfelder) */
  --c-anthrazit:    #212934;  /* Kesselkörper-Anthrazit (awb-color8) */
  --c-steel:        #4c5256;  /* Grauton der Marke (awb-color6) */
  --c-ink:          #1a2420;  /* Text auf hellen Flächen */
  --c-ink-dim:      #52605a;  /* Nebentext auf hellen Flächen */
  --c-line:         #d8d4c8;  /* 1px-Linien auf Paper */

  /* ---- Typografie ---- */
  --font-display: "Neue Faktum Extended", Arial, Helvetica, sans-serif;      /* nur ExtraBold 800 */
  --font-body:    "Roboto", Arial, Helvetica, sans-serif;
  --font-tech:    "Roboto Condensed", "Arial Narrow", sans-serif;            /* technische Werte, Labels, Captions */

  /* Skala: Sprung Display→Body ≥ 3× (Anti-Slop-Regel 4) */
  --fs-hero:    clamp(2.5rem, 6.5vw, 5.75rem);    /* H1 */
  --fs-display: clamp(2rem, 4.6vw, 3.75rem);      /* H2 / Sektions-Headline */
  --fs-title:   clamp(1.375rem, 2.4vw, 1.875rem); /* H3 */
  --fs-lead:    clamp(1.125rem, 1.5vw, 1.3125rem);/* Lead-Absätze */
  --fs-body:    1.0625rem;                        /* 17px Fließtext */
  --fs-small:   0.9375rem;
  --fs-micro:   0.8125rem;                        /* Kicker, Captions (einzige Caps-Ebene) */
  --fs-num-xl:  clamp(3.5rem, 9vw, 8.5rem);       /* freistehende Display-Kennzahl */

  --lh-display: 1.02;
  --lh-title:   1.2;
  --lh-body:    1.7;
  --ls-display: -0.01em;
  --ls-micro:   0.14em;   /* gesperrte Mikro-Label */

  /* ---- Spacing (4er-Basis) ---- */
  --sp-1: 0.5rem;   /* 8  */
  --sp-2: 1rem;     /* 16 */
  --sp-3: 1.5rem;   /* 24 */
  --sp-4: 2rem;     /* 32 */
  --sp-5: 3rem;     /* 48 */
  --sp-6: 4rem;     /* 64 */
  --sp-7: 6rem;     /* 96 */
  --sp-8: 8rem;     /* 128 */
  --sp-section: clamp(4.5rem, 11vw, 9.5rem);   /* vertikaler Sektionsabstand */
  --sp-gutter:  clamp(1.25rem, 3vw, 2.5rem);   /* Grid-Gutter / Seitenrand */

  /* ---- Form / Material ---- */
  --radius: 0px;          /* Industrie = kantig */
  --radius-s: 2px;        /* max. Radius für kleine Bedienelemente */
  --line: 1px;            /* die eine Linienstärke */
  --shadow-card: 0 24px 48px -24px rgba(1, 37, 28, 0.35);  /* einziger Schatten (Overlap-Karten) */

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-reveal: 0.8s;
  --dur-fast: 0.25s;

  /* ---- Layout ---- */
  --content-max: 82.5rem;   /* 1320px Satzspiegel */
  --measure: 65ch;          /* max. Zeilenlänge Fließtext */
}

/* ---- Fonts: lokal gehostet, font-display: swap (Agentur-Regel) ---- */
@font-face {
  font-family: "Neue Faktum Extended";
  src: url("../fonts/NeueFaktumExtended-ExtraBold.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Neue Faktum Extended";
  src: url("../fonts/NeueFaktumExtended-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto Condensed";
  src: url("../fonts/RobotoCondensed-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto Condensed";
  src: url("../fonts/RobotoCondensed-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}