/* =========================================================
   SK SOLUTIONS LLC
   ========================================================= */

:root {
  /* ---- SURFACE ---- */
  --bp-base:      hsl(213, 58%, 15%);   /* page bg */
  --bp-base-2:    hsl(213, 55%, 12%);   /* darker panel bg */
  --bp-base-3:    hsl(213, 50%, 10%);   /* deepest */
  --bp-raised:    hsl(213, 48%, 19%);   /* card surface */

  /* ---- LINEWORK ---- */
  --ink:          hsl(190, 55%, 94%);           /* primary text */
  --ink-dim:      hsla(190, 40%, 88%, 0.62);    /* secondary text */
  --ink-faint:    hsla(190, 35%, 88%, 0.38);    /* tertiary text */
  --ink-ghost:    hsla(190, 60%, 92%, 0.09);    /* grid lines */
  --ink-ghost-2:  hsla(190, 60%, 92%, 0.16);    /* slightly stronger hairline */

  /* ---- ANNOTATION ---- */
  --amber:        hsl(38, 78%, 58%);
  --amber-dim:    hsla(38, 78%, 58%, 0.14);
  --amber-ink:    hsl(213, 58%, 12%);

  /* ---- STATUS STAMPS ---- */
  --stamp-live:    hsl(150, 45%, 55%);
  --stamp-shipped: hsl(190, 60%, 68%);
  --stamp-progress:hsl(38, 78%, 58%);

  /* ---- TYPE ---- */
  --ff-display: 'Space Grotesk', sans-serif;
  --ff-body:    'IBM Plex Sans', sans-serif;
  --ff-mono:    'IBM Plex Mono', monospace;

  --fs-9xl: clamp(56px, 8.5vw, 112px);
  --fs-7xl: clamp(38px, 5.5vw, 64px);
  --fs-5xl: clamp(28px, 3.4vw, 38px);
  --fs-3xl: 22px;
  --fs-xl:  18px;
  --fs-lg:  16px;
  --fs-md:  14px;
  --fs-sm:  13px;
  --fs-xs:  11px;

  /* ---- SPACING ---- */
  --sp-section: 120px;
  --sp-section-mobile: 64px;

  /* ---- SHAPE ---- */
  --radius-sm: 3px;
  --radius-md: 6px;

  /* ---- MOTION ---- */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --t-1: 0.2s ease;
  --t-2: 0.5s var(--ease);
}