@font-face {
    font-family: "Golos Text Premium";
    src: url("GolosText-Cyrillic.woff2") format("woff2");
    font-style: normal;
    font-weight: 400 900;
    font-display: swap;
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
    font-family: "Golos Text Premium";
    src: url("GolosText-Latin.woff2") format("woff2");
    font-style: normal;
    font-weight: 400 900;
    font-display: swap;
    unicode-range: U+0000-024F, U+1E00-1EFF, U+20A0-20CF;
}

@font-face {
    font-family: "Playfair Display Premium";
    src: url("PlayfairDisplay-Cyrillic.woff2") format("woff2");
    font-style: normal;
    font-weight: 500 800;
    font-display: swap;
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
    font-family: "Playfair Display Premium";
    src: url("PlayfairDisplay-Latin.woff2") format("woff2");
    font-style: normal;
    font-weight: 500 800;
    font-display: swap;
    unicode-range: U+0000-024F, U+1E00-1EFF, U+20A0-20CF;
}

:root {
    --font-body-premium: "Golos Text Premium", "Segoe UI", Arial, sans-serif;
    --font-display-premium: "Playfair Display Premium", Georgia, serif;
    --sans: var(--font-body-premium);
    --font-sans: var(--font-body-premium);
    --serif: var(--font-display-premium);
}

html:root body,
html:root body button,
html:root body input,
html:root body select,
html:root body textarea {
    font-family: var(--font-body-premium) !important;
}

html:root body h1,
html:root body h2,
html:root body .section-title,
html:root body .display-title,
html:root body .hero-title,
html:root body .method-hero h1,
html:root body .procedure-hero h1,
html:root body .cta h2,
html:root body .footer-cta h2,
html:root body .quote-text {
    font-family: var(--font-display-premium) !important;
    font-weight: 600;
    letter-spacing: -0.025em;
    text-wrap: balance;
}

html:root body h3,
html:root body h4,
html:root body strong,
html:root body b {
    font-family: var(--font-body-premium) !important;
}

html:root body p,
html:root body li {
    text-wrap: pretty;
}

.copy-signal,
.procedure-card__signal,
.procedure-feature__signal {
    display: block;
    margin: 0;
    color: var(--ink, #182722);
    font-weight: 650;
    line-height: 1.5;
}

.copy-context,
.procedure-card__context,
.procedure-feature__context {
    display: block;
    margin: 0.65rem 0 0;
    color: var(--muted, #617069);
    font-weight: 450;
    line-height: 1.6;
}

.lead .copy-signal,
.hero-lead .copy-signal,
.display-copy .copy-signal {
    font-size: 1.04em;
    line-height: 1.45;
}

.lead .copy-context,
.hero-lead .copy-context,
.display-copy .copy-context {
    margin-top: 0.85rem;
}

.procedure-card__signal,
.procedure-card__context,
.procedure-feature__signal,
.procedure-feature__context {
    text-wrap: pretty;
}

.procedure-card .procedure-card__signal,
.procedure-feature .procedure-feature__signal {
    margin: 0;
}

.procedure-card .procedure-card__context,
.procedure-feature .procedure-feature__context {
    margin: 0.65rem 0 0;
}

@media (max-width: 640px) {
    html:root body h1,
    html:root body h2,
    html:root body .section-title,
    html:root body .display-title,
    html:root body .hero-title {
        letter-spacing: -0.018em;
    }

    .copy-context,
    .procedure-card__context,
    .procedure-feature__context {
        margin-top: 0.55rem;
    }
}