/* ==========================================================================
   PlanSig – Design Tokens
   Gemeinsame Basis für Karriere-Microsite und Unternehmenswebsite.
   Markenfarben aus dem Logo (PlanSig30_Logo.svg): #008a89 / #60b5b6
   ========================================================================== */

@font-face {
  font-family: "Geist";
  src: url("../fonts/Geist-Variable-latin.woff2") format("woff2");
  font-weight: 300 600;
  font-display: swap;
}

:root {
  /* Marke */
  --brand: #008a89;          /* Logo-Teal – Flächen, große Elemente, Linien */
  --brand-strong: #007a79;   /* Buttons / Text auf Weiß (5.2:1) */
  --brand-deep: #005f5e;     /* Hover */
  --brand-light: #60b5b6;    /* Zweitfarbe Logo – nur auf Dunkel oder dekorativ */

  /* Neutrale */
  --ink: #0f1c1d;            /* dunkle Sektionen */
  --ink-2: #172728;
  --text: #16292a;
  --muted: #5b6b6c;
  --muted-on-dark: #b3c3c3;
  --line: #e1e7e7;
  --line-strong: #c3cfcf;
  --line-dark: #2c3f40;
  --white: #ffffff;

  /* Signalfarben (sparsam: Status, Funnel) */
  --sig-green: #1fc46f;
  --sig-yellow: #e0a800;
  --sig-red: #d9443e;

  /* Typografie – eine Familie, max. 600 */
  --font-body: "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: var(--font-body);

  --fs-xs: 0.8125rem;
  --fs-sm: 0.9375rem;
  --fs-base: 1.0625rem;
  --fs-md: 1.1875rem;
  --fs-lg: clamp(1.25rem, 1.15rem + 0.4vw, 1.5rem);
  --fs-xl: clamp(1.6rem, 1.3rem + 1.1vw, 2.2rem);
  --fs-2xl: clamp(2rem, 1.5rem + 2vw, 3.1rem);
  --fs-3xl: clamp(2.5rem, 1.7rem + 3.4vw, 4.4rem);

  /* Abstände */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;
  --space-9: 6rem;
  --section: clamp(5rem, 3rem + 7vw, 10rem);

  /* Layout */
  --container: 1200px;
  --gutter: clamp(1.25rem, 0.5rem + 3vw, 3rem);
  --header-h: 76px;

  /* Form */
  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 16px;
  --shadow-pop: 0 24px 60px -20px rgba(15, 28, 29, 0.35);
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}
