/* ===========================================================================
   Cocoon — Typography tokens
   One voice: Signika throughout, warm and rounded. JetBrains Mono for code.
   Scale is gentle and editorial — generous line-height, restful rhythm.
   =========================================================================== */

:root {
  /* --- Families ----------------------------------------------------------- */
  --font-sans: "Signika", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* --- Weights ------------------------------------------------------------ */
  --weight-light:    300; /* @kind font */
  --weight-regular:  400; /* @kind font */
  --weight-medium:   500; /* @kind font */
  --weight-semibold: 600; /* @kind font */
  --weight-bold:     700; /* @kind font */

  /* --- Type scale (size / line-height / tracking) ------------------------- */
  /* Display — hero statements ("Grow with purpose.") */
  --display-size: 40px;
  --display-line: 1.1;       /* @kind font */
  --display-weight: 700;     /* @kind font */
  --display-track: -0.02em;  /* @kind font */

  /* Heading 1 */
  --h1-size: 28px;
  --h1-line: 1.2;            /* @kind font */
  --h1-weight: 600;         /* @kind font */
  --h1-track: -0.01em;      /* @kind font */

  /* Heading 2 */
  --h2-size: 22px;
  --h2-line: 1.25;          /* @kind font */
  --h2-weight: 600;         /* @kind font */
  --h2-track: -0.005em;     /* @kind font */

  /* Heading 3 */
  --h3-size: 18px;
  --h3-line: 1.35;          /* @kind font */
  --h3-weight: 500;         /* @kind font */
  --h3-track: 0;            /* @kind font */

  /* Heading 4 */
  --h4-size: 15px;
  --h4-line: 1.4;           /* @kind font */
  --h4-weight: 500;         /* @kind font */
  --h4-track: 0;            /* @kind font */

  /* Body large */
  --body-lg-size: 16px;
  --body-lg-line: 1.6;      /* @kind font */

  /* Body default */
  --body-size: 14px;
  --body-line: 1.65;        /* @kind font */

  /* Body small */
  --body-sm-size: 13px;
  --body-sm-line: 1.6;      /* @kind font */

  /* Caption — metadata, supporting */
  --caption-size: 11px;
  --caption-line: 1.55;     /* @kind font */

  /* Label — form labels, nav, status (uppercase) */
  --label-size: 11px;
  --label-line: 1.5;        /* @kind font */
  --label-weight: 600;      /* @kind font */
  --label-track: 0.06em;    /* @kind font */

  /* Eyebrow — small section labels in the guide */
  --eyebrow-size: 11px;
  --eyebrow-weight: 500;    /* @kind font */
  --eyebrow-track: 0.05em;  /* @kind font */

  /* Section kicker — bold tracked uppercase ("CORE COLORS") */
  --kicker-size: 13px;
  --kicker-weight: 700;     /* @kind font */
  --kicker-track: 0.08em;   /* @kind font */

  /* Code */
  --code-size: 13px;
  --code-line: 1.5;         /* @kind font */
}