/* elator drive – Design-Tokens und Grundstile
   Quellen: Kit 6 (_elementor_global_variables, _elementor_css),
   design-system-sync.css und das Theme hello-elementor.

   VIER EBENEN, alle noetig:
     1. Reset            box-sizing, margin, Grundmasse
     2. Grundfarben      --Himbeer
     3. v4-Zuordnung     --e-global-color-v4-himbeer -> var(--Himbeer)
     4. Grundstile       Schrift, Hintergrund, Ueberschriftenfarben
   Der Reset steht bewusst VOR den Grundstilen: das Theme setzt einen
   weissen Hintergrund, den das Kit anschliessend ueberschreibt. */

/* ---------- 1 · Reset ---------- */

html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}

*, ::after, ::before { box-sizing: border-box; }

body {
  margin: 0;
  font-weight: 400;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1 { font-size: 2.5rem; }
h2 { font-size: 2rem; }
h3 { font-size: 1.75rem; }
h4 { font-size: 1.5rem; }
p  { margin-block-start: 0; margin-block-end: .9rem; }
hr { box-sizing: content-box; height: 0; overflow: visible; }
a  { background-color: transparent; text-decoration: none; }
img { border-style: none; height: auto; max-width: 100%; }

/* ---------- 2 und 3 · Variablen ---------- */

:root {
  --Schwarzbeer: #1E1414;
  --Brombeer: #370A2D;
  --Himbeer: #691446;
  --Erdbeer: #F5505F;
  --Puder: #F5F0F0;
  --Weiss: #ffffff;
  --Durchsichtig: #ffffff00;

  /* Display-Schrift. Im Bestand stand hier please-display-vf, wurde aber
     nie ausgeliefert – Besucher sahen die Systemschrift. Ersetzt durch
     Lilita One (SIL Open Font License), selbst gehostet.
     Entscheidung 02.09.2026. Aendern reicht hier: alle Ueberschriften
     laufen ueber diese eine Variable. */
  --font-display: "Lilita One", Sans-serif;
  --font-text: "Atkinson Hyperlegible Next", Sans-serif;
  --font-mono: "Atkinson Hyperlegible Mono", monospace;
  --head-please-black: "Lilita One", Sans-serif;

  --e-global-color-v4-schwarzbeer:var(--Schwarzbeer);
  --e-global-color-v4-brombeer:var(--Brombeer);
  --e-global-color-v4-himbeer:var(--Himbeer);
  --e-global-color-v4-erdbeer:var(--Erdbeer);
  --e-global-color-v4-puder:var(--Puder);
  --e-global-color-v4-weiss:var(--Weiss);
  --e-global-typography-v4-head-please-xl-font-family:var(--font-display);
  --e-global-typography-v4-head-please-xl-font-size:11rem;
  --e-global-typography-v4-head-please-xl-font-weight:900;
  --e-global-typography-v4-head-please-xl-line-height:0.9em;
  --e-global-typography-v4-head-please-l-font-family:var(--head-please-black);
  --e-global-typography-v4-head-please-l-font-size:8rem;
  --e-global-typography-v4-head-please-l-font-weight:900;
  --e-global-typography-v4-head-please-l-line-height:1em;
  --e-global-typography-v4-head-atk-4-font-family:Atkinson Hyperlegible Next;
  --e-global-typography-v4-head-atk-4-font-size:3rem;
  --e-global-typography-v4-text-plus-font-family:Atkinson Hyperlegible Next;
  --e-global-typography-v4-text-plus-font-size:1.6rem;
  --e-global-typography-v4-text-plus-font-weight:600;
  --e-global-typography-v4-head-please-m-font-family:var(--font-display);
  --e-global-typography-v4-head-please-m-font-size:6rem;
  --e-global-typography-v4-head-please-m-font-weight:900;
  --e-global-typography-v4-head-please-m-line-height:1em;
  --e-global-typography-v4-text-standard-font-family:Atkinson Hyperlegible Next;
  --e-global-typography-v4-text-standard-font-size:1.2rem;
  --e-global-typography-v4-text-feature-font-family:Atkinson Hyperlegible Next;
  --e-global-typography-v4-text-feature-font-size:2rem;
  --e-global-typography-v4-text-feature-font-weight:400;

  --e-global-color-primary:#F5505F;
  --e-global-color-secondary:#1E1414;
  --e-global-color-text:#370A2D;
  --e-global-color-accent:#691446;
  --e-global-typography-primary-font-family:var(--font-display);
  --e-global-typography-primary-font-weight:bold;
  --e-global-typography-secondary-font-family:"Atkinson Hyperlegible Next";
  --e-global-typography-secondary-font-weight:bold;
  --e-global-typography-text-font-family:"Atkinson Hyperlegible Next";
  --e-global-typography-text-font-weight:400;
  --e-global-typography-accent-font-family:"Atkinson Hyperlegible Mono";
  --e-global-typography-accent-font-weight:500;
}

@media (max-width: 1024px) {
  :root {
    --e-global-typography-v4-head-please-xl-font-size:8.5rem;
    --e-global-typography-v4-head-please-l-font-family:var(--font-display);
    --e-global-typography-v4-head-please-l-font-size:6rem;
    --e-global-typography-v4-head-please-l-font-weight:900;
    --e-global-typography-v4-head-atk-4-font-size:2.4rem;
    --e-global-typography-v4-text-plus-font-size:1.4rem;
    --e-global-typography-v4-head-please-m-font-size:4.8rem;
    --e-global-typography-v4-text-standard-font-size:1.1rem;
    --e-global-typography-v4-text-feature-font-size:1.6rem;
  }
}

@media (max-width: 767px) {
  :root {
    --e-global-typography-v4-head-please-xl-font-size:6rem;
    --e-global-typography-v4-head-please-l-font-size:3.2rem;
    --e-global-typography-v4-head-atk-4-font-size:1.8rem;
    --e-global-typography-v4-text-plus-font-size:1.2rem;
    --e-global-typography-v4-head-please-m-font-size:2.4rem;
    --e-global-typography-v4-text-standard-font-size:0.9rem;
    --e-global-typography-v4-text-feature-font-size:1.2rem;
  }
}

/* ---------- 4 · Grundstile ----------
   Im Bestand an der Klasse .elementor-kit-6 auf dem <body>. */

body {
  background-color:var( --e-global-color-v4-puder );
  color:var( --e-global-color-v4-brombeer );
  font-family:"Atkinson Hyperlegible Next", Sans-serif;
  font-size:1.2rem;
}
body a {
  color:var( --e-global-color-v4-himbeer );
}
body a:hover {
  color:var( --e-global-color-v4-erdbeer );
}
body h1 {
  color:var( --e-global-color-v4-himbeer );
}
body h2 {
  color:var( --e-global-color-v4-himbeer );
}
body h3 {
  color:var( --e-global-color-v4-himbeer );
}
body h4 {
  color:var( --e-global-color-v4-himbeer );
}
body button,body input[type="button"],body input[type="submit"],body .elementor-button {
  color:var( --e-global-color-v4-weiss );
}
body button:hover,body button:focus,body input[type="button"]:hover,body input[type="button"]:focus,body input[type="submit"]:hover,body input[type="submit"]:focus,body .elementor-button:hover,body .elementor-button:focus {
  color:var( --e-global-color-v4-weiss );
}

@media (max-width: 1024px) {
  body {
    font-size:1.1rem;
  }
}

@media (max-width: 767px) {
  body {
    font-size:1rem;
  }
}

