@import 'reset';


@font-face {
    font-family: 'Tajawal';
    font-style: normal;
    font-weight: 400;
    src: url(/Tajawal-Regular.woff2) format('woff2');
    font-display: block;
}

:root {
    --content-size: 1.25rem;
    --content-size-sm: 1rem;
    --content-line-height: 1.4;
    --content-width: 52.5rem;
    --content-padding: 0.65rem;
    --content-color: #1e1e1e;
    --content-color-faded: #555;
    --primary-color: hsl(202deg 72% 28%);
    --primary-color-faded: hsl(202deg 14% 36%);
    --accent-color: hsl(0deg, 92%, 29%);
    --accent-color-faded: hsl(0deg, 25%, 55%);

    @media(max-width: 640px) {
        --content-line-height: 1.25;
        --content-size: 1.15rem;
        --content-size-sm: 0.9rem;
    }
}

body {
    font-family: 'Tajawal', sans-serif;
    font-size: var(--content-size);
    line-height: var(--content-line-height);
    letter-spacing: -0.005em;
    color: var(--content-color);

}