/* ShipSimple — Typography tokens
   Brand face is Poppins: a geometric, friendly, lightly-rounded sans used for
   the marketing hero, headings and product UI alike. Heavy weights carry the
   bold "Instant Shipping Insurance" hero voice. */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

:root {
  /* ---- Families ---- */
  --font-display: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body:    'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:    ui-monospace, 'SFMono-Regular', 'Menlo', monospace;

  /* ---- Weights ---- */
  --fw-regular:  400; /* @kind font */
  --fw-medium:   500; /* @kind font */
  --fw-semibold: 600; /* @kind font */
  --fw-bold:     700; /* @kind font */
  --fw-black:    800; /* @kind font */

  /* ---- Type scale (clamped where it carries marketing impact) ---- */
  --fs-display:  clamp(40px, 6vw, 76px); /* @kind font */
  --fs-h1:       clamp(32px, 4vw, 48px); /* @kind font */
  --fs-h2:       clamp(26px, 3vw, 36px); /* @kind font */
  --fs-h3:       22px; /* @kind font */
  --fs-h4:       18px; /* @kind font */
  --fs-body-lg:  18px; /* @kind font */
  --fs-body:     16px; /* @kind font */
  --fs-body-sm:  14px; /* @kind font */
  --fs-caption:  13px; /* @kind font */
  --fs-overline: 12px; /* @kind font */

  /* ---- Line heights ---- */
  --lh-tight:   1.05; /* @kind font */
  --lh-snug:    1.2; /* @kind font */
  --lh-normal:  1.5; /* @kind font */
  --lh-relaxed: 1.65; /* @kind font */

  /* ---- Letter spacing ---- */
  --ls-tight:    -0.02em; /* @kind font */
  --ls-normal:   0; /* @kind font */
  --ls-overline: 0.12em; /* @kind font */

  /* ---- Semantic roles ---- */
  --text-display-font:  var(--font-display);
  --text-display-weight: var(--fw-bold);
  --text-heading-weight: var(--fw-semibold);
  --text-body-weight:    var(--fw-regular);
}