/* Hallmark · theme: cobalt · design tokens
   Cool cobalt-on-light, CRM / business management platform. Never pure white,
   never pure black. ONE electric cobalt signal accent; hairlines do the
   structural work. Adapted from the cobalt-01 reference token system. */

:root {
  /* ─── Colour ─────────────────────────────────────────────── */
  --color-paper:   oklch(98.5% 0.004 250);  /* cool engineered near-white — page ground */
  --color-paper-2: oklch(96.5% 0.005 252);  /* alt band / quiet inset */
  --color-paper-3: oklch(94% 0.006 254);    /* card tint / chip ground */

  --color-ink:     oklch(24% 0.02 258);     /* headlines + wordmark — cool charcoal */
  --color-ink-2:   oklch(34% 0.018 257);    /* body copy */
  --color-muted:   oklch(56% 0.013 255);    /* captions, meta, punctuation */
  --color-neutral: oklch(46% 0.015 255);    /* nav links, secondary text */

  --color-rule:    oklch(91% 0.008 255);    /* hairlines */
  --color-rule-2:  oklch(83% 0.011 255);    /* stronger hairline / hover rule */

  --color-accent:     oklch(58% 0.20 256);  /* electric cobalt — THE one signal */
  --color-accent-ink: oklch(99% 0.004 256); /* text on cobalt */
  --color-accent-dim: oklch(58% 0.20 256 / 0.10); /* cobalt wash / focus halo */
  --color-accent-2:   oklch(52% 0.19 256);  /* cobalt hover (slightly darker) */

  --color-focus:   oklch(58% 0.20 256);     /* focus ring */

  --color-graphite:   oklch(22% 0.016 260); /* dark code-card ground */
  --color-graphite-2: oklch(27% 0.018 260); /* code window bar */
  --color-graphite-3: oklch(34% 0.02 260);  /* code card hairline */

  /* text on the full-bleed dark band (light cool ink) */
  --color-dark-ink:   oklch(92% 0.01 255);   /* headings on dark */
  --color-dark-ink-2: oklch(80% 0.012 256);  /* body on dark */
  --color-dark-muted: oklch(64% 0.014 256);  /* labels on dark */

  /* ─── Type ───────────────────────────────────────────────── */
  --font-display: "Space Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* fluid scale */
  --step-hero:    clamp(2.6rem, 5.2vw + 0.8rem, 4.5rem);
  --step-section: clamp(1.9rem, 3.2vw, 2.75rem);
  --step-lede:    clamp(1.0625rem, 0.8vw + 0.7rem, 1.3125rem);
  --step-body:    1.0625rem;
  --step-small:   0.875rem;
  --step-mono:    0.75rem;

  --tracking-display: -0.03em;
  --tracking-snug:    -0.015em;
  --tracking-label:   0.06em;

  --weight-body:    400;
  --weight-medium:  500;
  --weight-semi:    600;

  --leading-tight:  1.04;
  --leading-snug:   1.18;
  --leading-body:   1.62;
  --measure:        62ch;

  /* ─── Space & layout — 4pt scale ─────────────────────────── */
  --space-3xs: 0.125rem;   /* 2px */
  --space-2xs: 0.25rem;    /* 4px */
  --space-xs:  0.5rem;     /* 8px */
  --space-sm:  0.75rem;    /* 12px */
  --space-md:  1rem;       /* 16px */
  --space-lg:  1.5rem;     /* 24px */
  --space-xl:  2rem;       /* 32px */
  --space-2xl: 3rem;       /* 48px */
  --space-3xl: 4rem;       /* 64px */
  --space-4xl: 6rem;       /* 96px */

  --gutter:     clamp(1.1rem, 4vw, 3.25rem);
  --maxw:       1200px;
  --section-y:  clamp(4rem, 8vw, 7rem);
  --rule:       1px;

  /* ─── Shape ──────────────────────────────────────────────── */
  --radius-btn:  6px;
  --radius-card: 10px;
  --radius-pill: 999px;
  --shadow-card: 0 1px 2px oklch(22% 0.016 260 / 0.08);
  --shadow-float: 0 4px 24px -8px oklch(22% 0.016 260 / 0.12);
  --shadow-pill: 0 2px 12px -4px oklch(22% 0.016 260 / 0.10);

  /* ─── Motion ─────────────────────────────────────────────── */
  --reveal-dist: 12px;
  --reveal-dur:  600ms;
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --t-quiet:     240ms cubic-bezier(0.4, 0, 0.2, 1);
  --t-fast:      150ms cubic-bezier(0.4, 0, 0.2, 1);

  /* ─── Z-index ────────────────────────────────────────────── */
  --z-sticky:    500;
  --z-overlay:   200;
}
