/* ---- Display: font2, uppercase ---- */

:root {
    --t-display-3xl: 400 clamp(64px, 12vw, 180px)/1 var(--font2);
    --t-display-2xl: 400 clamp(38px, 4.7vw, 86px)/0.95 var(--font2);
    --t-display-xl:  400 clamp(28px, 3.2vw, 58px)/1 var(--font2);
    --t-display-lg:  400 clamp(26px, 2.6vw, 48px)/1 var(--font2);
    --t-display-md:  400 clamp(24px, 2.3vw, 40px)/1 var(--font2);
    --t-display-sm:  400 clamp(20px, 2vw, 36px)/1.05 var(--font2);
    --t-display-xs:  400 clamp(16px, 1.4vw, 24px)/1 var(--font2);
}

/* ---- Text: font1 ---- */

:root {
    --t-headline-lg: 600 clamp(17px, 1.3vw, 22px)/1.3 var(--font1);
    --t-headline:    600 clamp(14px, 1vw, 18px)/1.3 var(--font1);
    --t-headline-sm: 600 13px/1.3 var(--font1);
    --t-intro:       300 clamp(13px, 1.02vw, 17px)/1.5 var(--font1);
    --t-dek-lg:      var(--t-intro);
    --t-series-intro: var(--t-intro);
    --t-dek-feature: var(--t-intro);
    --t-dek:         300 clamp(12px, 0.85vw, 15px)/1.55 var(--font1);
    --t-dek-sm:      300 clamp(12px, 0.8vw, 14px)/1.6 var(--font1);
    --t-byline:      600 clamp(11px, 0.75vw, 13px)/1.4 var(--font1);
    --t-meta-xl:     300 clamp(11px, 0.88vw, 17px)/1 var(--font1);
    --t-meta-lg:     300 clamp(11px, 0.78vw, 13px)/1.4 var(--font1);
    --t-meta:        300 clamp(10px, 0.7vw, 12px)/1 var(--font1);
    --t-kicker:      700 clamp(12px, 0.85vw, 15px)/1 var(--font1);
    --t-label:       600 clamp(11px, 0.8vw, 13px)/1 var(--font1);
    --t-quote:       500 clamp(18px, 1.3vw, 24px)/1.4 var(--font4);
    --t-caption:     300 clamp(12px, 0.97vw, 19px)/1.1 var(--font1);
    --t-ui:          400 clamp(14px, 1.11vw, 21px)/1.6 var(--font1);
    --t-field:       300 clamp(14px, 1.11vw, 21px)/1.6 var(--font1);
}

/* ---- Emphasis ---- */

:root {
    --t-emph-strong: 1;
    --t-emph: 0.75;
    --t-emph-soft: 0.6;
    --t-emph-faint: 0.5;

    --t-dim-intro: var(--t-emph-strong);
}

/* ---- Tracking ---- */

:root {
    --t-track-tight: -0.02em;
    --t-track-normal: 0;
    --t-track-label: 0.06em;
    --t-track-label-wide: 0.08em;
    --t-track-caps: 0.04em;
}

/* ---- Numerals ---- */

:root {
    --t-nums-text: proportional-nums;
    --t-nums-data: tabular-nums;
}

/* ---- Rendering defaults ---- */

html {
    font-optical-sizing: auto;
    font-synthesis: none;
    font-kerning: normal;
    font-variant-ligatures: common-ligatures contextual;
    font-variant-numeric: var(--t-nums-text);
}

.uh-card-date,
.uh-podcast-date,
.uh-related-date,
.uh-page-hero-date,
.uh-podcast-latest-date,
.uh-podcast-item-label,
.uh-author-count,
.uh-series-row-meta,
.grid-small-card .small-card-small-text,
.date-small-text,
.post-tag {
    font-variant-numeric: var(--t-nums-data);
}

/* ---- Chrome ---- */

:root {
    --t-nav: 400 clamp(20px, 1.39vw, 27px)/1 var(--font2);
    --t-nav-mobile: 400 clamp(22px, 5vw, 24px)/1.2 var(--font2);
    --t-nav-sub: 400 clamp(20px, 4.5vw, 22px)/1.5 var(--font2);
    --t-wordmark: 400 clamp(32px, 3.19vw, 61px)/0.8 var(--font4);
    --t-chrome-lg: 300 clamp(14px, 1.11vw, 21px)/1.4 var(--font1);
}

/* ---- Article ---- */

:root {
    --t-article-title: 400 clamp(36px, 5vw, 96px)/1 var(--font2);
    --t-article-title-narrow: 400 clamp(36px, 4.31vw, 83px)/1 var(--font2);
    --t-article-tag: 400 clamp(18px, 1.53vw, 29px)/1 var(--font2);
    --t-article-tag-narrow: 400 clamp(18px, 1.39vw, 27px)/1 var(--font2);
    --t-body: 300 clamp(16px, 1.25vw, 24px)/1.5 var(--font1);
    --t-dropcap: 300 clamp(44px, 3.55vw, 68px)/1 var(--font4);
    --t-cta-title: 400 clamp(36px, 4.31vw, 83px)/1.2 var(--font2);
    --t-share-heading: 700 clamp(16px, 1.25vw, 24px)/1.6 var(--font1);
}

/* ---- Document scale ---- */

:root {
    --t-h1: 400 clamp(36px, 5vw, 96px)/1.3 var(--font2);
    --t-h2: 400 clamp(28px, 2.92vw, 56px)/1.3 var(--font2);
    --t-h3: 400 clamp(26px, 2.64vw, 51px)/1.3 var(--font2);
    --t-h4: 400 clamp(24px, 2.36vw, 45px)/1.3 var(--font2);
    --t-h5: 400 clamp(22px, 2.08vw, 40px)/1.3 var(--font2);
    --t-h6: 400 clamp(20px, 1.81vw, 35px)/1.3 var(--font2);
    --t-root: 300 clamp(14px, 1.11vw, 21px)/1.35 var(--font1);
    --t-prose: 300 clamp(14px, 1.11vw, 21px)/1.5 var(--font1);
    --t-text-lg: 500 clamp(24px, 2.22vw, 43px)/1.2 var(--font1);
    --t-text-md: 700 clamp(24px, 1.67vw, 32px)/1.2 var(--font3);
    --t-text-sm: 700 clamp(20px, 1.38vw, 26px)/1.2 var(--font3);
    --t-section-bar: 400 clamp(20px, 1.39vw, 27px)/1 var(--font2);
    --t-chrome: 300 clamp(12px, 0.97vw, 19px)/1.2 var(--font1);
}