@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;0,700;0,900;1,400&family=Roboto+Mono:wght@400;500&display=swap');

:root{
--font-sans:'Roboto','Helvetica Neue',Arial,sans-serif; /* @kind font */
--font-mono:'Roboto Mono',ui-monospace,SFMono-Regular,Menlo,monospace; /* @kind font */

--fw-light:300; /* @kind font */
--fw-regular:400; /* @kind font */
--fw-medium:500; /* @kind font */
--fw-bold:700; /* @kind font */
--fw-black:900; /* @kind font */

/* Display / headline scale (desktop) */
--fs-display-1:clamp(44px,5.6vw,88px); /* @kind font */
--fs-display-2:clamp(36px,4.2vw,64px); /* @kind font */
--fs-h1:clamp(32px,3.2vw,48px); /* @kind font */
--fs-h2:clamp(26px,2.4vw,36px); /* @kind font */
--fs-h3:22px; /* @kind font */
--fs-h4:18px; /* @kind font */
--fs-body-lg:19px; /* @kind font */
--fs-body:16px; /* @kind font */
--fs-body-sm:14px; /* @kind font */
--fs-caption:13px; /* @kind font */
--fs-eyebrow:12px; /* @kind font */

--lh-tight:1.04; /* @kind other */
--lh-snug:1.18; /* @kind other */
--lh-heading:1.25; /* @kind other */
--lh-body:1.6; /* @kind other */
--lh-loose:1.75; /* @kind other */

--ls-display:-.03em; /* @kind other */
--ls-heading:-.015em; /* @kind other */
--ls-body:0; /* @kind other */
--ls-eyebrow:.16em; /* @kind other */

/* Semantic type roles */
--type-display:var(--fw-light) var(--fs-display-1)/var(--lh-tight) var(--font-sans); /* @kind font */
--type-h1:var(--fw-light) var(--fs-h1)/var(--lh-snug) var(--font-sans); /* @kind font */
--type-h2:var(--fw-regular) var(--fs-h2)/var(--lh-heading) var(--font-sans); /* @kind font */
--type-h3:var(--fw-medium) var(--fs-h3)/var(--lh-heading) var(--font-sans); /* @kind font */
--type-body:var(--fw-regular) var(--fs-body)/var(--lh-body) var(--font-sans); /* @kind font */
--type-body-lg:var(--fw-light) var(--fs-body-lg)/var(--lh-loose) var(--font-sans); /* @kind font */
--type-label:var(--fw-medium) var(--fs-body-sm)/1.3 var(--font-sans); /* @kind font */
--type-eyebrow:var(--fw-medium) var(--fs-eyebrow)/1.3 var(--font-sans); /* @kind font */
}
