html {
    font-size: 17px;
}

body {
    font-size: 17px;
    line-height: var(--lh-body);
}

h1,
.uk-h1,
.uk-heading-3xlarge,
.uk-heading-2xlarge,
.uk-heading-xlarge,
.uk-heading-large,
.uk-heading-medium {
    color: var(--text);
    font-family: var(--font-display) !important;
    font-size: clamp(30px, 4.5vw, 52px) !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.02em;
}

h2,
.uk-h2,
.uk-heading-small {
    color: var(--text);
    font-family: var(--font-display) !important;
    font-size: clamp(24px, 3.2vw, 38px) !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    letter-spacing: -0.02em;
}

h3,
.uk-h3 {
    color: var(--navy-700);
    font-family: var(--font-display) !important;
    font-size: clamp(18px, 2.2vw, 24px) !important;
    font-weight: 600 !important;
    line-height: 1.28 !important;
    letter-spacing: -0.02em;
}

h4,
h5,
h6,
.uk-h4,
.uk-h5,
.uk-h6 {
    color: var(--text);
    font-family: var(--font-display) !important;
    letter-spacing: -0.02em;
}

.hero h1 {
    color: #ffffff;
    font-size: clamp(28px, 4vw, 46px) !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
}

.hero h1 em {
    color: var(--amber-300);
}

.section__lead {
    font-size: 17px;
    line-height: 1.75;
}

.article-body,
.uk-article {
    font-size: 16.5px;
    line-height: 1.84;
}

.article-body h2,
.uk-article h2 {
    color: var(--text);
    font-size: clamp(24px, 3.2vw, 38px) !important;
}

.article-body h3,
.uk-article h3 {
    color: var(--navy-700);
    font-size: 19px !important;
}

@media (max-width: 639px) {
    .hero h1 {
        font-size: 24px !important;
        line-height: 1.22 !important;
    }

    h2,
    .uk-h2,
    .article-body h2,
    .uk-article h2 {
        font-size: 20px !important;
    }

    h3,
    .uk-h3 {
        font-size: 17px !important;
    }

    .article-body h3,
    .uk-article h3 {
        font-size: 16.5px !important;
    }

    .section__lead {
        font-size: 15px;
    }

    .article-body,
    .uk-article {
        font-size: 15.5px;
        line-height: 1.78;
    }
}

@media (max-width: 480px) {
    .hero h1 {
        font-size: 20px !important;
    }

    h2,
    .uk-h2,
    .article-body h2,
    .uk-article h2 {
        font-size: 18px !important;
    }

    h3,
    .uk-h3 {
        font-size: 15.5px !important;
    }

    .section__lead {
        font-size: 14px;
    }

    .article-body,
    .uk-article {
        font-size: 14.5px;
    }
}
