/**
  Нормализация блочной модели
 */
*,
*::before,
*::after {
    box-sizing: border-box;
}

/**
   Убираем внутренние отступы слева тегам списков
  */
:where(ul, ol) {
    padding-left: 0;
}

/**
   Убираем внешние отступы body и двум другим тегам
  */
body,
:where(blockquote, figure) {
    margin: 0;
}

/**
   Убираем внешние отступы вертикали нужным тегам
  */
:where(h1, h2, h3, h4, h5, h6, p, ul, ol, dl, hr) {
    margin-block: 0;
}

:where(dd) {
    margin-left: 0;
}

:where(fieldset) {
    margin-left: 0;
    padding: 0;
    border: none;
}

/**
   Убираем стандартный маркер маркированному списку
  */
:where(ul) {
    list-style: none;
}

/**
   Упрощаем работу с изображениями
  */
img {
    display: block;
    max-width: 100%;
}

/**
   Наследуем свойства шрифт для полей ввода
  */
input,
textarea,
select,
button {
    color: inherit;
    font: inherit;
}

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

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

html {
    /**
       Пригодится в большинстве ситуаций
       (когда, например, нужно будет "прижать" футер к низу сайта)
      */
    height: 100%;

    /**
       Плавный скролл
      */
    scroll-behavior: smooth;
}

/**
   Чиним баг задержки смены цвета при взаимодействии с svg-элементами
  */
svg * {
    transition-property: fill, stroke;
}

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