:root {
    --font-size-xl: clamp(1.5rem, 5vw, 3.4rem);
    --font-size-lg: clamp(25px, 4vw, 35px);
    --font-size-md: clamp(16px, 2vw, 25px);
    --font-size-base: clamp(16px, 2vw, 20px);
    --font-size-sm: clamp(12px, 1.5vw, 16px);
}

@font-face {
    font-family: 'Avenir';
    src: url("/assets/fonts/avenir-bold.ttf");
    font-weight: 900;
}

@font-face {
    font-family: 'Avenir';
    src: url("/assets/fonts/avenir-regular.ttf");
    font-weight: 400;
}

* {
    font-family: 'Avenir', Arial;
    font-weight: 400;
    line-height: 1.75;
}

p, li {
    font-size: var(--font-size-base);
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 800;
    line-height: 1.25;
}

h1 { font-size: var(--font-size-xl); }
h2 { font-size: var(--font-size-lg); }
h3, h4, h5, h6 { font-size: var(--font-size-md); }

h1 span,
h2 span,
h3 span,
h4 span,
h5 span,
h6 span {
    font-size: var(--font-size-sm);
}

p strong {
    font-weight: 800;
}

p a {
    text-decoration: underline;
}

p a:hover {
    font-weight: 800;
    text-decoration: none;
}

footer p {
    font-size: var(--font-size-sm);
}

.text-align-right {
    text-align: right;
}