/* EZplus Kundenformular – Design-Tokens (Spezifikation Abschnitt 3)
   Alle Farben, Abstände und Radien ausschließlich über diese Variablen. */

@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/montserrat-latin-500-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/montserrat-latin-600-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/montserrat-latin-700-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/poppins-latin-400-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/poppins-latin-500-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/poppins-latin-600-normal.woff2") format("woff2");
}

:root {
  /* Farben (EZplus CI) */
  --blau:        #0f618a;
  --blau-hover:  #0b4c6d;
  --hellblau:    #74a8d7;
  --hellblau-20: #eef4fa;
  --grau:        #f6f6f6;
  --dunkelgrau:  #333333;   /* Info-Kachel, weiße Schrift 12,6:1 */
  --schwarz:     #000000;
  --weiss:       #ffffff;
  --orange:      #ff8700;
  --gruen:       #93bc18;
  --gelb:        #fcbc40;
  --rahmen:      #dedede;
  --rahmen-input:#9a9a9a;
  --text-sekundaer: #4a4a4a;
  --placeholder: #6b6b6b;
  --fehler:      #b3261e;

  /* Schrift */
  --font-display: Montserrat, "Segoe UI", system-ui, sans-serif;
  --font-body:    Poppins, "Segoe UI", system-ui, sans-serif;

  /* Abstände (8er-Raster) */
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-5: 40px;

  /* Radien */
  --radius-0:    0px;
  --radius-s:    4px;
  --radius-voll: 999px;

  /* Schatten */
  --schatten-box: 0 3px 6px rgba(0, 0, 0, 0.16);

  /* Layout */
  --inhalt-breite: 1120px;
  --seitenrand: 24px;
}