/* Visual scale is independent of heading semantics, color and weight. */
:root {
    --type-display: clamp(2.5rem, 1.14rem + 5.58vw, 7rem);
    --type-h1: clamp(2.5rem, 1.44rem + 4.34vw, 6rem);
    --type-h2: clamp(2rem, 1.395rem + 2.48vw, 4rem);
    --type-h3: clamp(1.5rem, 1.349rem + .62vw, 2rem);
    --type-h4: clamp(1.25rem, 1.174rem + .31vw, 1.5rem);
    --type-h5: clamp(1.125rem, 1.087rem + .155vw, 1.25rem);
    --type-description-lg: clamp(1.25rem, 1.174rem + .31vw, 1.5rem);
    --type-description-md: clamp(1rem, .962rem + .155vw, 1.125rem);
    --type-description-sm: clamp(.875rem, .837rem + .155vw, 1rem);
    --type-meta: clamp(.8125rem, .794rem + .0775vw, .875rem);
}

body { font-size: var(--type-description-md); }

.heading-display, .heading-h1, .heading-h2, .heading-h3, .heading-h4, .heading-h5 {
    overflow-wrap: anywhere;
    text-wrap: balance;
}
.heading-display { font-size: var(--type-display); line-height: 1.06; letter-spacing: -.055em; }
.heading-h1 { font-size: var(--type-h1); line-height: 1.1; letter-spacing: -.05em; }
.heading-h2 { font-size: var(--type-h2); line-height: 1.14; letter-spacing: -.04em; }
.heading-h3 { font-size: var(--type-h3); line-height: 1.25; letter-spacing: -.025em; }
.heading-h4 { font-size: var(--type-h4); line-height: 1.3; letter-spacing: -.02em; }
.heading-h5 { font-size: var(--type-h5); line-height: 1.35; letter-spacing: -.01em; }

.description-sm, .description-md, .description-lg {
    overflow-wrap: anywhere;
    text-wrap: pretty;
}
.description-sm { font-size: var(--type-description-sm); line-height: 1.65; }
.description-md { font-size: var(--type-description-md); line-height: 1.75; }
.description-lg { font-size: var(--type-description-lg); line-height: 1.6; }
.text-meta { font-size: var(--type-meta); line-height: 1.5; }

/* Card titles follow the space available to them, including intermediate widths. */
.type-card { container: type-card / inline-size; }
@container type-card (max-width: 22rem) {
    .heading-h2 { font-size: var(--type-h3); }
    .heading-h3 { font-size: var(--type-h4); }
}
@container type-card (max-width: 14rem) {
    .heading-h3, .heading-h4 { font-size: var(--type-h5); }
}

/* Editorial copy keeps a comfortable line length inside the existing layout. */
.journal-reader-section > .description-md,
.pd-about-story > .description-md,
.company-story-copy > .description-md,
.careers-description > .description-md {
    max-inline-size: 72ch;
}