/* ===========================
   ZAAVV Corporate Design
   =========================== */

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;900&display=swap');

:root {
  /* Primärfarbe 1 – #AB1643 */
  --color-primary-1: #AB1643;
  --color-primary-1-90: #B33A5E;
  --color-primary-1-80: #BB5D79;
  --color-primary-1-70: #C38194;
  --color-primary-1-60: #CCA5AF;
  --color-primary-1-50: #D4C9CA;
  --color-primary-1-40: #DCDDD5;
  --color-primary-1-30: #E5D6DA;
  --color-primary-1-20: #EEDFE0;
  --color-primary-1-10: #F6E8E8;

  /* Primärfarbe 2 – #EA5656 */
  --color-primary-2: #EA5656;
  --color-primary-2-90: #ED6D6D;
  --color-primary-2-80: #EF8484;
  --color-primary-2-70: #F29B9B;
  --color-primary-2-60: #F4B2B2;
  --color-primary-2-50: #F7C9C9;
  --color-primary-2-40: #F9E0E0;
  --color-primary-2-30: #FBE6E6;
  --color-primary-2-20: #FCEDED;
  --color-primary-2-10: #FEF4F4;

  /* Primärfarbe 3 – #3C3C3B */
  --color-primary-3: #3C3C3B;
  --color-primary-3-90: #565656;
  --color-primary-3-80: #707070;
  --color-primary-3-70: #8A8A8A;
  --color-primary-3-60: #A3A3A3;
  --color-primary-3-50: #BDBDBD;
  --color-primary-3-40: #D7D7D7;
  --color-primary-3-30: #E1E1E1;
  --color-primary-3-20: #EBEBEB;
  --color-primary-3-10: #F5F5F5;

  /* Akzentfarbe 1 – #6D1229 */
  --color-accent-1: #6D1229;
  --color-accent-1-90: #822B41;
  --color-accent-1-80: #96435A;
  --color-accent-1-70: #AB5C72;
  --color-accent-1-60: #BF758B;
  --color-accent-1-50: #D48DA3;
  --color-accent-1-40: #E8A6BC;
  --color-accent-1-30: #F0BECF;
  --color-accent-1-20: #F7D7E1;
  --color-accent-1-10: #FEEFF3;

  /* Schriftarten */
  --font-regular: 'Roboto', sans-serif;
  --font-light: 'Roboto', sans-serif;
  --font-black: 'Roboto', sans-serif;
}

/* Beispielverwendung */
body {
  font-family: var(--font-regular);
  color: var(--color-primary-3);
  background-color: var(--color-primary-3-10);
}

h1, h2, h3 {
  font-family: var(--font-black);
  color: var(--color-primary-1);
}

p, li {
  font-family: var(--font-light);
  color: var(--color-primary-3-80);
}