/* ==========================================================================
   base.css — сброс стилей + дизайн-токены
   Токены выгружены из Figma (переменные библиотеки "Ui kit")
   ========================================================================== */

:root {
    /* --- Цвета --- */
    --c-black: #0d0d0d;
    --c-dark: #111111;
    --c-gray-800: #151515;
    --c-grey-800: #2b2b2b;
    --c-grey-500: #878787;
    --c-grey-400: #bdbdbd;
    --c-grey-300: #e8e8e8;
    --c-grey-200: #f5f5f5;
    --c-gray-300: #dfdfdf;
    --c-gray-200: #f1f1f1;
    --c-white: #fbfbfb;
    --c-red-500: #cc1d23;
    --c-red-400: #de5d5d;
    /* Dark-blue 800 — встречается только в документах товара и реквизитах */
    --c-dark-blue-800: #1d2835;

    /* Состояния кнопок (Ui kit → Button) */
    --c-red-hover: #b21d22;
    --c-grey-800-hover: #3f3f3f;
    --c-brown-800: #261100;

    /* Служебные (взяты из макета напрямую) */
    --c-header-topbar: #141414;
    /* Фон страницы в макете белый: узоры на блоках без своей заливки
       нарисованы цветом Grey 200 и должны быть темнее фона, а не светлее.
       #efefef — это заливка только первого экрана главной, см. hero.css */
    --c-page-bg: #ffffff;

    /* --- Типографика --- */
    --font-main: "Roboto", "Helvetica Neue", Arial, sans-serif;

    /* --- Сетка --- */
    --container-width: 1440px;
    --container-pad: 60px;
    /* Расстояние от края экрана до края контейнера: на экранах уже макета — 0.
       Нужно декору, который лежит вне контейнера (узоры, фотографии внахлёст):
       без этой поправки на широких экранах он отрывается от текста и уезжает
       к краю окна, а в макете отмерян от края контейнера. */
    --container-offset: calc((100% - min(100%, var(--container-width))) / 2);
    --radius-sm: 4px;

    /* --- Прочее --- */
    --transition: 0.25s ease;
}

/* Боковые отступы страницы по контрольным точкам */
@media (max-width: 1199px) {
    :root {
        --container-pad: 32px;
    }
}

@media (max-width: 1023px) {
    :root {
        --container-pad: 16px;
    }
}

/* --------------------------------------------------------------------------
   Сброс
   -------------------------------------------------------------------------- */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    text-size-adjust: 100%;
    /* На мобильных горизонтальные ленты (объекты, новости и т. п.) при свайпе
       не должны утаскивать всю страницу вбок и показывать белое поле */
    overflow-x: hidden;
}

body {
    margin: 0;
    font-family: var(--font-main);
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
    color: var(--c-grey-800);
    background-color: var(--c-page-bg);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
blockquote,
dl,
dd {
    margin: 0;
}

ul,
ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

a {
    color: inherit;
    text-decoration: none;
}

img,
svg,
video {
    display: block;
    max-width: 100%;
}

button,
input,
select,
textarea {
    font: inherit;
    color: inherit;
    margin: 0;
}

button {
    padding: 0;
    border: none;
    background: none;
    cursor: pointer;
}

input::-webkit-search-decoration,
input::-webkit-search-cancel-button {
    -webkit-appearance: none;
}

/* Для пользователей, отключивших анимации */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}