/* В этом файле будут храниться все значения переменных в исходном состоянии, а так же их изменения в зависимости от ширины устройства */

:root {
    /* Шрифты */
    --main-font: 'Inter', sans-serif;
    --accent-font: 'Press Start 2P', fantasy;

    /* Веса шрифтов */
    --font-weight-normal: 400;
    --font-weight-bold: 700;

    /* Размеры шрифтов */
    --font-logo-size: clamp(3.0625rem, 2.7104rem + 1.5023vw, 4.0625rem);
    --font-title-size: clamp(0.875rem, 0.6769rem + 0.8451vw, 1.4375rem);

    /* Цвета */
    --bg-color: #fff;
    --text-color: #000;
    --accent-color: #000;
    --contour-color: #000;
    --animation-fill-color: #f00;
    --label-stroke-color: #fff;

    /* Размеры */
    --content-width: clamp(23.4375rem, 16.2852rem + 30.5164vw, 43.5rem);
    --header-width: clamp(23.4375rem, 16.2852rem + 30.5164vw, 43.5rem);

    /* Фон */
    --bg-image: repeating-linear-gradient(90deg,
            #d3d3d3 0 2px,
            transparent 2px 4px),
        repeating-linear-gradient(180deg,
            #d3d3d3 0 2px,
            transparent 2px 4px),
        linear-gradient(180deg, #e7e7e7 0.01%, #1a1a1a 100%);
}

@media (width <=375px) {
    :root {
        --content-width: 100%;
        --header-width: 100%;
    }
}