:root{
--font-display:"Anton","Arial Narrow",Impact,sans-serif;
--font-body:"Montserrat","Helvetica Neue",Arial,sans-serif;
--font-mono:ui-monospace,"SFMono-Regular",Menlo,monospace;

--fw-thin:100; /* @kind font */
--fw-extralight:200; /* @kind font */
--fw-light:300; /* @kind font */
--fw-regular:400; /* @kind font */
--fw-medium:500; /* @kind font */
--fw-semibold:600; /* @kind font */
--fw-bold:700; /* @kind font */

--fs-display-1:112px;--fs-display-2:80px;--fs-display-3:56px;--fs-h1:40px;--fs-h2:30px;--fs-h3:22px;--fs-h4:17px;
--fs-body-lg:19px;--fs-body:16px;--fs-body-sm:14px;--fs-caption:12px;--fs-micro:11px;

--lh-display:0.92; /* @kind font */
--lh-heading:1.08; /* @kind font */
--lh-snug:1.35; /* @kind font */
--lh-body:1.65; /* @kind font */

/* Anton is drawn tight; body copy and eyebrows are the opposite — wide and thin */
--tracking-display:0.005em; /* @kind font */
--tracking-heading:0.01em; /* @kind font */
--tracking-body:0.005em; /* @kind font */
--tracking-label:0.18em; /* @kind font */
--tracking-eyebrow:0.32em; /* @kind font */

--text-display-1:var(--fw-regular) var(--fs-display-1)/var(--lh-display) var(--font-display);
--text-display-2:var(--fw-regular) var(--fs-display-2)/var(--lh-display) var(--font-display);
--text-display-3:var(--fw-regular) var(--fs-display-3)/var(--lh-heading) var(--font-display);
--text-h1:var(--fw-regular) var(--fs-h1)/var(--lh-heading) var(--font-display);
--text-h2:var(--fw-regular) var(--fs-h2)/var(--lh-heading) var(--font-display);
--text-h3:var(--fw-regular) var(--fs-h3)/var(--lh-snug) var(--font-display);
--text-body-lg:var(--fw-thin) var(--fs-body-lg)/var(--lh-body) var(--font-body);
--text-body:var(--fw-light) var(--fs-body)/var(--lh-body) var(--font-body);
--text-body-sm:var(--fw-light) var(--fs-body-sm)/var(--lh-snug) var(--font-body);
--text-label:var(--fw-semibold) var(--fs-micro)/1.2 var(--font-body);
}
