/* VertoDigital design tokens -- copied from the shared Verto design system
   (colors, spacing, typography). If Verto's tokens change, update here. */

:root {
  /* ---- Primary blues ---- */
  --color-blue: #0099FF;
  --color-blue-dark: #0066CC;
  --color-blue-light: #66CCFF;

  /* ---- Neutrals ---- */
  --color-navy: #060026;
  --color-cool-gray: #B4D9C0;
  --color-surface: #d9f0ff;
  --color-white: #ffffff;
  --color-black: #000000;

  /* ---- Accents ---- */
  --color-accent-purple: #8B57F4;
  --color-accent-cyan: #43E5FF;
  --color-accent-lime: #E1F77E;

  /* ---- Semantic aliases ---- */
  --text-strong: var(--color-navy);
  --text-body: rgba(6, 0, 38, 0.80);
  --text-muted: rgba(6, 0, 38, 0.55);
  --text-on-dark: var(--color-white);
  --text-on-dark-muted: var(--color-cool-gray);
  --text-link: var(--color-blue);

  --surface-page: var(--color-white);
  --surface-card: var(--color-white);
  --surface-panel: var(--color-surface);
  --surface-signature: var(--color-blue-light);
  --surface-dark: var(--color-navy);

  --border-subtle: rgba(6, 0, 38, 0.08);
  --border-on-dark: rgba(255, 255, 255, 0.10);

  --action-primary: var(--color-blue);
  --action-primary-hover: var(--color-navy);
  --action-accent: var(--color-accent-lime);
  --action-accent-hover: #d4eb6e;

  --focus-ring: var(--color-blue);

  /* ---- Status colors (this app's own additions -- not in the base kit) ---- */
  --color-danger: #E0556B;
  --color-danger-bg: rgba(224, 85, 107, 0.1);
  --color-success: #1FA97A;
  --color-success-bg: rgba(31, 169, 122, 0.1);

  /* ---- Spacing scale (4px base) ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;

  --content-max: 1200px;
  --container-pad: 1.5rem;
  --container-pad-md: 3rem;

  /* ---- Radii ---- */
  --radius-sm: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-2xl: 1rem;
  --radius-pill: 9999px;

  /* ---- Elevation ---- */
  --shadow-overlay: 0 12px 32px -12px rgba(6, 0, 38, 0.18);
  --shadow-focus: 0 0 0 3px rgba(0, 153, 255, 0.35);

  /* ---- Motion ---- */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 150ms;
  --dur-base: 200ms;

  /* ---- Typography ----
     Geist is Verto's brand typeface; this internal tool falls back to the
     system sans-serif stack rather than self-hosting the webfont files. */
  --font-sans: 'Geist', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --weight-regular: 400;
  --weight-medium: 500;

  --fs-h1: clamp(1.5rem, 1.1rem + 1.6vw, 2rem);
  --fs-h2: clamp(1.25rem, 1.05rem + 0.8vw, 1.5rem);
  --fs-h3: 1.125rem;
  --fs-lg: 1.125rem;
  --fs-base: 1rem;
  --fs-sm: 0.875rem;
  --fs-xs: 0.75rem;
  --fs-eyebrow: 0.6875rem;

  --leading-heading: 1.2;
  --leading-body: 1.5;

  --tracking-heading: -0.025em;
  --tracking-tight: -0.015em;
  --tracking-eyebrow: 0.2em;
}