/* Scale derived from the 1440px Figma frame: h1 ≈ 64px, h2 ≈ 40px, body 16px,
   supporting text 14px. Display face is Playfair Display, UI face is Inter. */

:root {
    --step--2: 0.75rem;
    --step--1: var(--font-size-small);
    --font-size-paragraph: 1rem;
    --font-size-lead: 1.125rem;
    --font-size-h5: 1.125rem;
    --font-size-h4: clamp(1.25rem, 1.5vw, 1.5rem);
    --font-size-h3: clamp(1.5rem, 2.2vw, 2rem);
    --font-size-h2: clamp(2rem, 3.4vw, 2.75rem);
    --font-size-h1: clamp(2.5rem, 5.4vw, 4rem);
}

h1,
h2,
h3,
h4,
h5 {
    font-family: var(--font-display);
    font-weight: 700;
    line-height: 1.12;
    letter-spacing: -0.01em;
    text-wrap: balance;
    margin: 0;
    padding: 0;
    color: var(--clr-text);
}

h1 {
    font-size: var(--font-size-h1);
    letter-spacing: -0.02em;
}

h2 {
    font-size: var(--font-size-h2);
}

h3 {
    font-size: var(--font-size-h3);
}

h4 {
    font-size: var(--font-size-h4);
}

h5 {
    font-size: var(--font-size-h5);
}

p,
ul,
ol,
li,
th,
td {
    font-family: var(--font-regular);
    font-weight: 400;
    font-size: var(--font-size-paragraph);
    line-height: var(--line-height-normal);
}

p {
    text-wrap: pretty;
}

ul,
ol {
    list-style-position: outside;
}

/* Small caps label above a section heading — "Doświadczenie", "Liczby" */
.tagline {
    font-family: var(--font-regular);
    font-size: var(--font-size-small);
    font-weight: 600;
    color: var(--clr-text);
    margin: 0;
    margin-block-end: var(--space-normal);
}

.lead {
    font-size: var(--font-size-lead);
    line-height: 1.5;
    color: var(--clr-muted);
}