/* ==========================================================================
   CURALYS v2 – Design-Tokens und Schrift
   Reihenfolge: tokens.css → site.css
   ========================================================================== */

/* ---- Schrift: IBM Plex Sans Variable (SIL OFL 1.1), lokal aus /fonts ---- */
@font-face {
  font-family: "IBM Plex Sans Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 700;
  src: url("../fonts/ibm-plex-sans-latin-ext-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "IBM Plex Sans Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 700;
  src: url("../fonts/ibm-plex-sans-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Plex Fallback";
  src: local("Arial");
  ascent-override: 102.5%;
  descent-override: 27.5%;
  line-gap-override: 0%;
  size-adjust: 100%;
}

:root {
  color-scheme: light;

  /* Flächen */
  --bg: #fafbfb;
  --surface: #ffffff;
  --tint: #edf3f5;        /* deutlich von --bg unterscheidbar */
  --tint-2: #e3edf0;      /* Bildmulden auf Tint */

  /* Text */
  --ink: #0e1e25;
  --ink-2: #3f4f57;       /* Sekundärtext, 8,3:1 auf --bg */
  --ink-3: #5b6a71;       /* Hinweise, 5,6:1 auf Weiß */

  /* Marke */
  --petrol: #2e6275;      /* Aktion, 6,6:1 auf Weiß */
  --petrol-hover: #234f5f;
  --petrol-brand: #437a8f;
  --petrol-soft: #dce9ed;
  --night: #0f2a33;
  --night-2: #143541;     /* Flächen auf der Nacht */
  --night-line: rgba(255, 255, 255, 0.1);
  --on-night: #ffffff;
  --on-night-2: rgba(255, 255, 255, 0.74);
  --lime: #c7d401;        /* nur Akzent – nie Text auf Hell */
  --lime-soft: rgba(199, 212, 1, 0.16);

  --line: rgba(14, 30, 37, 0.08);
  --line-2: rgba(14, 30, 37, 0.14);
  --line-3: rgba(14, 30, 37, 0.24);
  --error: #b3261e;
  --success: #1b6e3a;

  /* Schrift */
  --font: "IBM Plex Sans Variable", "IBM Plex Sans", "Plex Fallback", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* Typo-Skala (fluid 375 → 1440 px) */
  --fs-display: clamp(2.5rem, 1.53rem + 4.13vw, 5.25rem);
  --fs-h2: clamp(2.125rem, 1.46rem + 2.82vw, 4rem);
  --fs-h2-sub: clamp(1.875rem, 1.4rem + 1.6vw, 2.75rem); /* Nebensektionen */
  --fs-statement: clamp(1.75rem, 1.2rem + 2.3vw, 3.25rem);
  --fs-h3: clamp(1.375rem, 1.2rem + 0.75vw, 1.875rem);
  --fs-lead: clamp(1.125rem, 1.06rem + 0.28vw, 1.3125rem);
  --fs-body: 1.0625rem;
  --fs-small: 0.9375rem;
  --fs-caption: 0.8125rem;
  --fs-tag: 0.71875rem;   /* 11,5 px, skaliert mit der Browserschrift */
  --fs-eyebrow: 0.75rem;

  /* Raster */
  --container: 1200px;
  --container-wide: 1320px;
  --gutter: clamp(16px, 4vw, 40px);
  --gap: clamp(16px, 2vw, 32px);
  --header-h: 68px;
  --sec-y: clamp(4.5rem, 2.6rem + 5vw, 8rem);

  /* Radien */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 20px;
  --r-pill: 999px;

  /* Schatten (mehrlagig, kühl) */
  --sh-1: 0 1px 1px rgba(14, 30, 37, 0.04), 0 2px 4px rgba(14, 30, 37, 0.04);
  --sh-2: 0 1px 2px rgba(14, 30, 37, 0.05), 0 4px 8px rgba(14, 30, 37, 0.04), 0 12px 24px -8px rgba(14, 30, 37, 0.08);
  --sh-3: 0 1px 2px rgba(14, 30, 37, 0.06), 0 8px 16px -4px rgba(14, 30, 37, 0.08), 0 24px 48px -12px rgba(14, 30, 37, 0.14);
  --sh-hero: 0 0 0 1px rgba(14, 30, 37, 0.06), 0 2px 4px rgba(14, 30, 37, 0.04), 0 12px 24px -6px rgba(14, 30, 37, 0.08), 0 40px 80px -20px rgba(14, 30, 37, 0.2), 0 80px 160px -40px rgba(46, 98, 117, 0.22);
  --sh-float: 0 0 0 1px rgba(14, 30, 37, 0.08), 0 2px 4px rgba(14, 30, 37, 0.05), 0 16px 32px -8px rgba(14, 30, 37, 0.18), 0 32px 64px -24px rgba(14, 30, 37, 0.22);
  --sh-night: 0 0 0 1px rgba(255, 255, 255, 0.08), 0 24px 48px -12px rgba(0, 0, 0, 0.55);
  --sh-frame: 0 0 0 1px rgba(14, 30, 37, 0.07), 0 2px 4px rgba(14, 30, 37, 0.03), 0 24px 56px -24px rgba(14, 30, 37, 0.22);

  /* Bewegung */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --dur: 0.5s;
}