:root {
    --line-width: 2px;
    --line-color: black;

    --color: black;
    --background: white;

    --color-hover: white;
    --background-hover: #111;

    --font-family: 'Virgil', sans-serif;
}

* {
    box-sizing: border-box;
    min-width: 0;
}

@font-face {
    font-family: 'Virgil';
    src: url('https://salteadorneo.github.io/wireframes/fonts/Virgil.woff2') format('woff2'),
        url('https://salteadorneo.github.io/wireframes/fonts/Virgil.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-family);
    font-size: 2rem;
    color: var(--line-color, black);
    text-wrap: balance;
    margin: .5rem 0;

    &.sm {
        font-size: 1.5rem;
    }

    &.lg {
        font-size: 2.5rem;
    }

    &.xl {
        font-size: 3rem;
    }
}