/* Type scale. Display + headings are uppercase Archivo with negative tracking;
   body copy is Hanken Grotesk at normal case. Mobile sizes are clamped so the
   scale never drops below 14px on a 360px viewport. */
:root{
  --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 */

  --lh-tight:1.02; /* @kind font */ --lh-snug:1.12; /* @kind font */ --lh-heading:1.2; /* @kind font */ --lh-normal:1.5; /* @kind font */ --lh-relaxed:1.6; /* @kind font */
  --tracking-tighter:-.03em; /* @kind font */ --tracking-tight:-.015em; /* @kind font */ --tracking-normal:0; /* @kind font */
  --tracking-wide:.04em; /* @kind font */ --tracking-wider:.08em; /* @kind font */ --tracking-widest:.16em; /* @kind font */

  /* Font sizes */
  --fs-display-xl:clamp(2.75rem,7vw,5.5rem); /* @kind font */
  --fs-display-lg:clamp(2.25rem,5.4vw,4rem); /* @kind font */
  --fs-h1:clamp(1.875rem,3.6vw,3rem); /* @kind font */
  --fs-h2:clamp(1.5rem,2.6vw,2.25rem); /* @kind font */
  --fs-h3:clamp(1.25rem,1.9vw,1.625rem); /* @kind font */
  --fs-h4:1.125rem; /* @kind font */
  --fs-body-lg:1.0625rem; /* @kind font */
  --fs-body:1rem; /* @kind font */
  --fs-body-sm:.875rem; /* @kind font */
  --fs-caption:.75rem; /* @kind font */
  --fs-label:.75rem; /* @kind font */
  --fs-button:.875rem; /* @kind font */
  --fs-nav:.8125rem; /* @kind font */
  --fs-price:1.125rem; /* @kind font */
  --fs-price-lg:1.5rem; /* @kind font */
  --fs-product-title:.9375rem; /* @kind font */

  /* Composite text roles */
  --text-display-xl:var(--fw-black) var(--fs-display-xl)/var(--lh-tight) var(--font-display); /* @kind font */
  --text-display-lg:var(--fw-extrabold) var(--fs-display-lg)/var(--lh-snug) var(--font-display); /* @kind font */
  --text-h1:var(--fw-extrabold) var(--fs-h1)/var(--lh-snug) var(--font-display); /* @kind font */
  --text-h2:var(--fw-bold) var(--fs-h2)/var(--lh-heading) var(--font-display); /* @kind font */
  --text-h3:var(--fw-bold) var(--fs-h3)/var(--lh-heading) var(--font-display); /* @kind font */
  --text-h4:var(--fw-semibold) var(--fs-h4)/var(--lh-heading) var(--font-display); /* @kind font */
  --text-body-lg:var(--fw-regular) var(--fs-body-lg)/var(--lh-relaxed) var(--font-body); /* @kind font */
  --text-body:var(--fw-regular) var(--fs-body)/var(--lh-normal) var(--font-body); /* @kind font */
  --text-body-sm:var(--fw-regular) var(--fs-body-sm)/var(--lh-normal) var(--font-body); /* @kind font */
  --text-caption:var(--fw-regular) var(--fs-caption)/1.4 var(--font-body); /* @kind font */
  --text-label:var(--fw-bold) var(--fs-label)/1.2 var(--font-display); /* @kind font */
  --text-button:var(--fw-bold) var(--fs-button)/1 var(--font-display); /* @kind font */
  --text-nav:var(--fw-bold) var(--fs-nav)/1 var(--font-display); /* @kind font */
  --text-price:var(--fw-bold) var(--fs-price)/1.2 var(--font-numeric); /* @kind font */
  --text-product-title:var(--fw-semibold) var(--fs-product-title)/1.35 var(--font-body); /* @kind font */
}