/* ============================================================
   Studio1 — Typography Tokens
   Poppins everywhere: geometric, clean, confident.
   Display = tight, heavy weights for big punchy headlines.
   ============================================================ */

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

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

  /* ---- Fluid display scale (hero / section headlines) ---- */
  --fs-display-xl: clamp(3rem, 6vw, 5.25rem); /* @kind font */
  --fs-display-lg: clamp(2.5rem, 4.5vw, 4rem); /* @kind font */
  --fs-display-md: clamp(2rem, 3.4vw, 3rem); /* @kind font */

  /* ---- Heading scale ---- */
  --fs-h1: 2.5rem; /* @kind font */
  --fs-h2: 2rem; /* @kind font */
  --fs-h3: 1.5rem; /* @kind font */
  --fs-h4: 1.25rem; /* @kind font */
  --fs-h5: 1.0625rem; /* @kind font */

  /* ---- Body / utility scale ---- */
  --fs-lg:    1.25rem; /* @kind font */
  --fs-base:  1rem; /* @kind font */
  --fs-sm:    0.875rem; /* @kind font */
  --fs-xs:    0.75rem; /* @kind font */

  /* ---- Line heights ---- */
  --lh-tight:   1.04; /* @kind other */
  --lh-snug:    1.15; /* @kind other */
  --lh-normal:  1.5; /* @kind other */
  --lh-relaxed: 1.7; /* @kind other */

  /* ---- Letter spacing ---- */
  --ls-tight:   -0.03em; /* @kind other */
  --ls-snug:    -0.015em; /* @kind other */
  --ls-normal:  0; /* @kind other */
  --ls-wide:    0.08em; /* @kind other */
  --ls-wider:   0.16em; /* @kind other */

  /* ---- Semantic roles ---- */
  --text-eyebrow-size:    var(--fs-xs);
  --text-eyebrow-spacing: var(--ls-wider);
  --text-eyebrow-weight:  var(--fw-semibold);

  --text-display-weight:  var(--fw-semibold);
  --text-heading-weight:  var(--fw-semibold);
  --text-body-weight:     var(--fw-regular);
  --text-button-weight:   var(--fw-semibold);
}
