/* Pagorin design tokens. Derived from the Jelista house design language (same type, spacing,
   radius, shadow and neutral scale); the brand values (accent, banner, bg, tints) are Pagorin's
   own "deep teal" palette so the product reads as its own brand. Every colour, size, space and
   radius used on the site comes from here. */
:root {
  --font-family-sans: "Inter", "Segoe UI Variable Text", "Segoe UI", system-ui, "Noto Sans", sans-serif;
  --font-family-display: "Inter Display", "Inter", "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
  --font-family-mono: "JetBrains Mono", "Cascadia Mono", Consolas, "Noto Sans Mono", monospace;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  --size-xs: 13px;
  --size-sm: 14px;
  --size-md: 16px;
  --size-lg: 20px;
  --size-xl: 25px;
  --size-2xl: 31px;
  --size-3xl: 39px;
  --size-hero: 52px;
  --size-hero-sm: 36px;
  --leading-tight: 1.2;
  --leading-snug: 1.35;
  --leading-body: 1.5;
  --tracking-tight: -0.02em;
  --tracking-display: -0.03em;

  /* neutrals (slate) */
  --color-ink: #0F172A;
  --color-ink-2: #334155;
  --color-muted: #475569;
  --color-subtle: #5E6B80;
  --color-surface: #FFFFFF;
  --color-surface-2: #F8FAFC;
  --color-surface-3: #F1F5F9;
  --color-border: #E2E8F0;
  --color-border-strong: #CBD5E1;

  /* Pagorin brand: deep teal */
  --color-bg: #EFF4F5;
  --color-accent: #0C7489;
  --color-accent-hover: #095C6D;
  --color-accent-soft: #E6F3F6;
  --color-accent-ink: #FFFFFF;
  --color-focus: #0C7489;
  --color-selection: #CFE9EF;
  --color-banner: #0F2E36;
  --color-banner-ink: #FFFFFF;
  --color-banner-muted: #B5C9CE;
  --color-banner-line: #2A4A53;
  --color-brand-accent: #0C7489;
  --color-brand-accent-dark: #7FD4E4;
  --color-tint-panel: #DCEAED;
  --color-tint-soft: #F3F8F9;
  --color-tint-line: #C9DDE2;

  /* status (muted on purpose; always paired with a word or icon) */
  --color-ok: #15803D;
  --color-ok-soft: #ECF7EF;
  --color-fix: #B45309;
  --color-fix-soft: #FDF5E9;
  --color-info: #475569;
  --color-info-soft: #F1F5F9;
  --color-error: #B91C1C;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-sm: 4px;
  --radius-control: 6px;
  --radius-card: 8px;
  --radius-lg: 12px;
  --radius-pill: 999px;
  --shadow-card: 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 3px rgba(15, 23, 42, 0.06);
  --shadow-focus: 0 0 0 3px rgba(12, 116, 137, 0.32);

  --site-container: 1120px;
  --site-measure: 62ch;
  --site-gutter: var(--space-4);
  --site-section: var(--space-16);
  --site-header-h: 64px;
}