/* ==========================================================================
   Valentis design tokens
   Source of truth: logo colours #283090 (indigo) and #00A8E8 (cyan).
   ========================================================================== */
@font-face {
  font-family: "Sora";
  src: url("../fonts/sora-latin-wght-normal.woff2") format("woff2");
  font-weight: 100 800;
  font-display: swap;
}
@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("../fonts/plus-jakarta-sans-latin-wght-normal.woff2") format("woff2");
  font-weight: 200 800;
  font-display: swap;
}

:root {
  /* Brand */
  --indigo: #283090;
  --indigo-700: #1f2778;
  --indigo-500: #3a44b8;
  --cyan: #00a8e8;
  --cyan-400: #4fcbf7;
  --cyan-700: #0077a8;          /* cyan for text on white (AA) */

  /* Neutrals (cool, derived from the indigo) */
  --ink: #0e1235;
  --ink-2: #1b2160;
  --body: #444d6e;
  --muted: #646d8c;
  --line: #e3e9f5;
  --mist: #f3f6fc;
  --sky: #e6f5fd;
  --white: #ffffff;

  /* Status */
  --ok: #1e7b4a;
  --ok-bg: #e7f7ee;
  --warn: #a26a00;
  --warn-bg: #fff4dc;

  /* Gradients */
  --grad-brand: linear-gradient(120deg, var(--indigo) 0%, #2a57c7 52%, var(--cyan) 100%);
  --grad-ink: radial-gradient(120% 90% at 85% 0%, #2b3aa8 0%, var(--ink-2) 38%, var(--ink) 78%);

  /* Type */
  --font-display: "Sora", "Plus Jakarta Sans", system-ui, sans-serif;
  --font-body: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fs-display: clamp(2.5rem, 1.6rem + 3.8vw, 4.5rem);
  --fs-h2: clamp(1.85rem, 1.3rem + 2.1vw, 3rem);
  --fs-h3: 1.25rem;
  --fs-lead: clamp(1.0625rem, 1rem + .3vw, 1.1875rem);
  --fs-body: 1rem;
  --fs-small: .875rem;

  /* Radii: hierarchy, not one value for everything */
  --r-xs: 8px;
  --r-sm: 12px;
  --r-md: 16px;
  --r-lg: 24px;
  --r-xl: 32px;
  --r-pill: 999px;

  /* Elevation */
  --sh-1: 0 1px 2px rgba(40, 48, 144, .06), 0 10px 28px -14px rgba(40, 48, 144, .22);
  --sh-2: 0 2px 4px rgba(40, 48, 144, .06), 0 24px 56px -20px rgba(40, 48, 144, .32);
  --sh-pop: 0 36px 90px -24px rgba(14, 18, 53, .38), 0 10px 28px -14px rgba(14, 18, 53, .16);

  /* Layout */
  --container: 1200px;
  --gutter: clamp(1rem, 4vw, 2rem);
  --header-h: 76px;
  --section-y: clamp(4.5rem, 3rem + 6vw, 8rem);

  /* Motion */
  --ease: cubic-bezier(.22, .8, .24, 1);
  --t-fast: .18s;
  --t-med: .32s;
}