/* MORIZ · Design Tokens
   Einzige Quelle für Farben, Schriften, Abstände und Bewegung.
   Werte aus den MORIZ Brand Guidelines 2026. */

@font-face { font-family: "PP Telegraf"; src: url("../assets/fonts/PPTelegraf-Light.woff2") format("woff2"); font-weight: 300; font-display: swap; }
@font-face { font-family: "PP Telegraf"; src: url("../assets/fonts/PPTelegraf-Regular.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "PP Telegraf"; src: url("../assets/fonts/PPTelegraf-Bold.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "PP Cirka"; src: url("../assets/fonts/PPCirka-Light.woff2") format("woff2"); font-weight: 300; font-display: swap; }
@font-face { font-family: "PP Cirka"; src: url("../assets/fonts/PPCirka-Regular.woff2") format("woff2"); font-weight: 400; font-display: swap; }

/* Übergangslösung: Telegraf Medium (500) und Semibold (600) fehlen noch.
   500 nutzt vorerst die Regular-, 600 die Bold-Datei. Sobald die echten
   Schnitte da sind, nur die zwei Dateinamen unten austauschen. */
@font-face { font-family: "PP Telegraf"; src: url("../assets/fonts/PPTelegraf-Regular.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "PP Telegraf"; src: url("../assets/fonts/PPTelegraf-Bold.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "PP Cirka"; src: url("../assets/fonts/PPCirka-Bold.woff2") format("woff2"); font-weight: 700; font-display: swap; }

:root {
  /* Farbe */
  --c-green:  #4A784D;   /* MORIZ Green, Primärfarbe */
  --c-creme:  #FBF7EF;   /* zentrale helle Fläche */
  --c-forest: #101A10;   /* Text, dunkle Flächen */
  --c-rust:   #93381A;   /* Akzent, sparsam */
  --c-line:   rgba(16, 26, 16, .16);
  --c-line-light: rgba(251, 247, 239, .22);
  --c-muted:  rgba(16, 26, 16, .64);

  /* Schrift */
  --f-display: "PP Cirka", Didot, "Bodoni 72", Georgia, serif;
  --f-text:    "PP Telegraf", "Helvetica Neue", Arial, sans-serif;

  --t-hero:  clamp(2.8rem, 6vw, 6rem);
  --t-statement: clamp(1.5rem, 2.6vw, 2.4rem);
  --t-h2:    clamp(2.2rem, 5vw, 4.4rem);
  --t-h3:    clamp(1.5rem, 2.6vw, 2.2rem);
  --t-lead:  clamp(1.15rem, 1.5vw, 1.4rem);
  --t-body:  1.0625rem;
  --t-small: .8125rem;

  /* Abstand: feste Skala */
  --s-1: .5rem;
  --s-2: 1rem;
  --s-3: 1.5rem;
  --s-4: 2.5rem;
  --s-5: 4rem;
  --s-6: clamp(5rem, 11vw, 9.5rem);   /* Abstand zwischen Sections */

  /* Grid */
  --gutter: clamp(1rem, 4vw, 3.5rem);
  --max: 1440px;
  --header-h: 76px;

  /* Bewegung: ein gemeinsames Timing für die ganze Seite */
  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --d-fast: 220ms;     /* Hover */
  --d-reveal: 700ms;   /* Text, Werte */
  --d-image: 1400ms;   /* Bild-Reveal */
}