@keyframes fadeInTop {
  0% {
    transform: translatey(-100%)
  }

  to {
    transform: translatey(0)
  }
}

@keyframes fadeOutTop {
  0% {
    transform: translatey(0)
  }

  to {
    transform: translatey(-200%)
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1
  }

  to {
    opacity: 0
  }
}

.container,
body {
  position: relative
}

.container {
  margin: 0 auto;
  width: 100%;
  max-width: 100vw
}

body {
  margin: 0;
  overflow-x: clip;
  font-family: 'Open Sans', sans-serif;
}

body.no-scroll {
  overflow-y: hidden
}

* {
  box-sizing: border-box;
  outline: 0
}

.select__input:focus,
:focus {
  outline: 0
}

sup {
  font-size: .5em
}

svg {
  transition: all .4s
}

a,
button,
fieldset,
figure,
iframe,
input,
li,
textarea {
  border: 0;
  text-decoration: none;
  color: inherit;
  background: 0 0
}

a,
button,
fieldset,
figure,
iframe,
li {
  padding: 0;
  margin: 0;
  cursor: pointer;
  font-family: inherit
}

a:active,
button:active,
fieldset:active,
figure:active,
iframe:active,
input:active,
li:active,
textarea:active {
  outline: 0
}

button {
  font-size: inherit
}

ul li {
  list-style: none;
  cursor: default
}

strong {
  font-family: 'Open Sans', sans-serif;
  font-weight: 600
}

input,
textarea {
  outline: 0;
  -webkit-appearance: none;
  appearance: none;
  font-family: 'Open Sans', sans-serif;
}

input::placeholder,
textarea::placeholder {
  color: inherit;
  font: inherit;
  transition: all .4s
}

textarea {
  resize: none;
  max-height: 100%;
  padding-right: 9px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-color: #ff687a #3e3e3e;
  scrollbar-width: thin
}

textarea::-webkit-scrollbar {
  width: 4px
}

textarea::-webkit-scrollbar-track {
  background: #3e3e3e
}

textarea::-webkit-scrollbar-thumb {
  background: #ff687a
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
  -webkit-appearance: none
}

input[type=number] {
  -moz-appearance: textfield
}

.wrapper,
body,
html {
  display: flex;
  flex-direction: column;
  min-height: 100%
}

.wrapper,
body {
  flex: 1 1 auto
}

body {
  padding-top: 100px;
  background: var(--bg)
}

.wrapper {
  overflow-x: clip
}

.wrapper>* {
  width: 100%
}

b {
  font-weight: 400
}

h1,
h2,
h3,
h4,
h5,
h6,
ol,
p,
ul {
  margin: 0;
  padding: 0;
  font-weight: 400;
  font-size: inherit
}

img,
small {
  max-width: 100%
}

img {
  object-fit: contain;
  border: 0
}

[height],
[width] {
  width: auto;
  height: auto
}

[class*=-img] picture,
[class*=__img] picture {
  width: 100%;
  height: 100%
}

small {
  display: block
}

input[type=button],
input[type=submit] {
  cursor: pointer
}

picture {
  display: flex;
  justify-content: center
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 1.5px solid #ff0220
}

.input-wrapper,
.input-wrapper p {
  display: grid
}

.logo {
  display: flex
}

.main {
  flex: 1 1 auto
}

.button,
.menu li,
.submit,
.tel,
a {
  transition: color .3s, background .3s, opacity .3s
}

.menu li:not(.menu-item-has-children) a {
  transition: none
}

.link-button {
  display: inline-flex;
  justify-content: center;
  align-items: center
}

.underline {
  position: relative
}

.select__value:after,
.underline:before {
  content: "";
  position: absolute;
  transition: all .4s
}

.underline:before {
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 1px;
  background: 0 0
}

.is-closing {
  z-index: 1 !important
}

[hidden] {
  display: none !important
}

.img-bg {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover
}

.ibg {
  position: relative
}

.ibg img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover
}

.more-line {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical
}

.flex {
  display: flex;
  flex-wrap: wrap
}

.justify-center {
  justify-content: center
}

.justify-end {
  justify-content: end
}

.justify-start {
  justify-content: start;
  justify-items: start
}

.justify-between {
  width: 100%;
  justify-content: space-between
}

.align-center {
  align-items: center
}

.align-start {
  align-items: start;
  align-content: start
}

.col {
  justify-items: start
}

.col,
.grid {
  display: grid;
  grid-template-columns: 100%
}

.hide-xs {
  display: block
}

.show-xs {
  display: none
}

.hide-sm {
  display: block
}

.show-sm {
  display: none
}

.hide-md {
  display: block
}

.show-md {
  display: none
}

.hide-xl {
  display: block
}

.show-xl {
  display: none
}

.select,
.select__body {
  position: relative
}

.select__body {
  font-size: 14px
}

.select__title {
  width: 100%
}

.select__value {
  display: flex;
  align-items: center;
  min-height: 2.5714285714em;
  padding: .5714285714em 1.1428571429em;
  gap: .625rem;
  background-color: #1e1e1e;
  border-radius: 5px;
  color: #fff;
  font-size: inherit;
  text-align: left
}

.select__value:after {
  right: 20px;
  top: 50%;
  transform: translatey(-50%);
  width: 13px;
  height: 13px;
  background: url(../img/arrow.webp) center/contain no-repeat;
  opacity: 0
}

.select_open .select__value:after {
  transform: translatey(-50%) rotate(-180deg)
}

.select__input {
  width: 100%;
  height: 100%;
  font-size: inherit
}

.select__scroll {
  max-height: 0;
  padding-right: 9px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-color: #ff687a #3e3e3e;
  scrollbar-width: thin
}

.select__scroll::-webkit-scrollbar {
  width: 4px
}

.select__scroll::-webkit-scrollbar-track {
  background: #3e3e3e
}

.select__scroll::-webkit-scrollbar-thumb {
  background: #ff687a
}

.select__options {
  position: absolute;
  top: 101%;
  left: 0;
  min-width: 100%;
  font-size: 1em
}

.select__option {
  width: 100%;
  padding: 1.0714285714em 1.4285714286em;
  text-align: left;
  transition: all .4s
}

.select_open {
  z-index: 5
}

.select_open .select__value {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0
}

.select_open .select__input::placeholder {
  opacity: .5
}

.crumbs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  column-gap: 25px;
  row-gap: 8px;
  letter-spacing: -.28px;
  line-height: 1.4285714286
}

.crumbs li:last-child {
  pointer-events: none
}

.crumbs li:last-child a {
  cursor: default
}

.crumbs li:not(:last-child) {
  position: relative;
  opacity: .4
}

.crumbs li:not(:last-child):after {
  content: "/";
  position: absolute;
  right: calc(0px - 12.5px);
  top: 50%;
  translate: 50% -50%
}

.menu-link {
  position: relative;
  order: 10;
  width: 25px;
  height: 25px
}

.menu-link_active .menu-lines {
  background: 0 0
}

.menu-link_active .menu-lines:after {
  top: 0;
  transform: rotate(-135deg)
}

.menu-link_active .menu-lines:before {
  top: 0;
  transform: rotate(135deg)
}

.menu-lines,
.menu-lines:after,
.menu-lines:before {
  position: absolute;
  width: 25px;
  height: 2px;
  background-color: #ff354d;
  transition: .4s;
  pointer-events: none
}

.menu-lines {
  top: 50%;
  right: 0;
  transform: translate(0, -50%)
}

.menu-lines:after,
.menu-lines:before {
  content: "";
  top: -7px;
  right: 0
}

.menu-lines:after {
  top: 7px
}

.switch {
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer
}

.switch__round {
  position: relative;
  display: flex
}

.switch__round:before {
  content: "";
  width: 40px;
  height: 20px;
  border-radius: 20px;
  background: #1e1e1e;
  border: 1px solid transparent;
  transition: all .4s;
  box-sizing: border-box
}

.switch__round:after {
  content: "";
  position: absolute;
  left: 2px;
  top: 50%;
  width: min(16px, 18px);
  height: min(16px, 18px);
  max-height: calc(100% - 2px);
  transform: translatey(-50%);
  border-radius: 50%;
  background: #fff;
  transition: all .4s
}

.switch__input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  clip: rect(0 0 0 0);
  overflow: hidden
}

.switch__input:checked+span:before {
  background: #1e1e1e
}

.switch__input:checked+span:after {
  left: calc(100% - 2px);
  transform: translate(-100%, -50%)
}

.switch__input:disabled~span {
  cursor: not-allowed;
  opacity: .4
}

.switch__input:focus-visible+span:before {
  border-color: #000
}

html.light {
  --bg: #F0F1FC;
  --main-item-bg: #d7d8e1;
  --main-item-bottom-border: #1e1e1e;
  --icon-color: #1e1e1e;
  --dots-color: #1e1e1e
}

html.light .logo-dark {
  display: none
}

html.dark {
  --bg: #1e1e1e;
  --main-item-bg: #1e1e1e;
  --main-item-bottom-border: #fff;
  --icon-color: #fff;
  --dots-color: #fff
}

html.dark .card,
html.dark .page .header__top {
  color: #000
}

html.dark .main__top {
  z-index: 4
}

html.dark .main__text {
  position: relative;
  z-index: 2
}

html.dark .main__text:after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: -1;
  width: 100vw;
  height: 100%;
  background: #48484a
}

html.dark .header__top-wrapper,
html.dark .page .header__top-wrapper {
  background: 0 0;
  transition: all .4s
}

html.dark .header__top-wrapper_fixed,
html.dark .page .header__top-wrapper_fixed {
  background: #1e1e1e
}

html.dark,
html.dark .page .header__top-wrapper_fixed .header__top {
  color: #fff
}

html.dark .page .header__top-wrapper_fixed .logo-light {
  display: block
}

html.dark .logo-light,
html.dark .page .header__top-wrapper_fixed .logo-dark {
  display: none
}

html.dark .page .header .select__value {
  background: 0 0;
  color: #3e3e3e
}

html.dark .page .header__info {
  padding: 0;
  border: 1px solid #3e3e3e;
  background: 0 0
}

html.dark .page .header__theme {
  background: #3e3e3e
}

html.dark .page .crumbs {
  color: #1e1e1e
}

html.dark .section {
  position: relative;
  z-index: 1;
  background: #1e1e1e
}

html.dark .section:after {
  content: "";
  position: absolute;
  left: -10vw;
  top: 0;
  z-index: -1;
  width: 150vw;
  height: 100%;
  background: #1e1e1e
}

html.dark .header-bottom {
  background: #fff
}

html.dark .header-bottom .header__info {
  border: 0;
  background: #3e3e3e
}

html.dark .switch__round:before {
  background: #959595
}

html.dark .header__theme {
  background: #3e3e3e
}

.page {
  background: linear-gradient(180deg, #f7faf7 0, #f2e7f7 33%, #d6d5f9 70%, #c3bffa 88%, #ebeaff 99%)
}

.card {
  position: relative;
  display: block;
  border-radius: 4px;
  overflow: hidden;
  transition: all .4s
}

.card img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover
}

.card__label {
  display: none;
  position: absolute;
  right: 0;
  top: 20px;
  padding: 5px 8px;
  background: #fff url(../img/label-bg.webp) left bottom/50% no-repeat;
  font-size: 10px;
  letter-spacing: -.2px
}

.card__label:empty {
  display: none
}

.card__number {
  display: block;
  right: auto;
  top: auto;
  left: 0;
  bottom: 20px
}

.main,
.main__top {
  position: relative;
  z-index: 2
}

.main__top {
  z-index: 3;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px
}

.main__top .card {
  aspect-ratio: 378/480
}

.main__item,
.main__items {
  display: grid;
  align-items: start
}

.main__items {
  grid-template-columns: repeat(3, 1fr)
}

.main__item {
  grid-template-rows: auto 1fr auto;
  justify-items: start;
  align-content: start;
  height: 100%;
  background: var(--main-item-bg)
}

.main__item>* {
  position: relative;
  z-index: 3
}

.main__item-title {
  position: relative;
  padding-bottom: 10px;
  margin-bottom: 15px;
  line-height: 1.16;
  letter-spacing: -.48px;
  border-bottom: 1px solid #7a7a7a
}

.main__item ul {
  display: grid;
  gap: 12px;
  line-height: 1.3333333333
}

.main__item ul a {
  font-size: 14px;
}

.main__item-new {
  position: relative
}

.main__item-new a {
  display: block;
  /*max-width: 80%*/
}

.main__item-new:after {
  content: "";
  font-weight: bold;
  position: absolute;
  left: -10px;
  top: 5px;
  width: 7px;
  height: 7px;
  background: #ff354d;
  border-radius: 50%;
  color: #fff;
  font-size: 10px;
  font-family: 'Open Sans', sans-serif;
  letter-spacing: -.2px
}

.main__item ul,
.main__item-bottom {
  font-size: 12px;
  letter-spacing: -.24px
}

.main__item-bottom {
  margin-top: 12px;
  padding: 8px 13px;
  border: 1px solid var(--main-item-bottom-border);
  border-radius: 4px;
  opacity: .6
}

.main__text {
  font-size: 14px;
  line-height: 1.4285714286;
  letter-spacing: -.28px
}

.main__text:before {
  display: none
}

.cards {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  column-gap: 16px
}

.cards .card {
  aspect-ratio: 181/230;
  opacity: 0
}

.cards .card.loaded,
.header__theme img.active {
  opacity: 1
}

.dates,
.dates a {
  align-items: center;
  justify-content: center
}

.dates {
  position: fixed;
  font-weight: 500;
  right: 16px;
  z-index: 3;
  display: grid;
  gap: 8px;
  font-family: 'Open Sans', sans-serif;
  letter-spacing: -1px
}

.dates a {
  display: flex
}

.dates svg {
  width: 18px;
  height: 18px
}

.arrow-next,
.arrow-prev,
.cards .card {
  transition: all .4s
}

.arrow-next.disabled,
.arrow-prev.disabled {
  opacity: .4
}

.arrow-next svg,
.arrow-prev svg {
  fill: var(--icon-color)
}

.input {
  width: 100%;
  border: 1px solid #ccc;
  border-radius: 6px
}

.input-file {
  position: relative;
  width: 100%;
  pointer-events: none
}

.input-file input,
.input-file-text {
  width: 100%;
  height: 100%;
  cursor: pointer
}

.input-file input {
  opacity: 0;
  pointer-events: auto
}

.input-file-text {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  padding-left: 30px;
  background: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTYgMTYiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMTYgMTYiPjxwYXRoIGQ9Im03LjY0NiAxMy42NDYuNzA3LjcwNyA2LTZhNC4wNCA0LjA0IDAgMCAwIDAtNS43MDcgNC4wMzkgNC4wMzkgMCAwIDAtNS43MDcgMGwtNi41IDYuNWEzLjMzMiAzLjMzMiAwIDAgMCAwIDQuNzA3Yy42NDguNjQ4IDEuNTAxLjk3NCAyLjM1NC45NzRzMS43MDUtLjMyNSAyLjM1NC0uOTc0bDYtNmMuNDk1LS40OTUuNzY3LTEuMTUzLjc2Ny0xLjg1M3MtLjI3Mi0xLjM1OC0uNzY4LTEuODU0Yy0uOTktLjk5LTIuNzE3LS45OS0zLjcwNyAwbC01LjUgNS41LjcwNy43MDcgNS41LTUuNWMuNjExLS42MTEgMS42ODItLjYxMSAyLjI5MyAwIC4zMDYuMzA2LjQ3NS43MTMuNDc1IDEuMTQ3cy0uMTY5Ljg0MS0uNDc1IDEuMTQ2bC02IDZjLS45MDguOTA4LTIuMzg1LjkwOC0zLjI5MyAwcy0uOTA4LTIuMzg1IDAtMy4yOTNsNi41LTYuNWMxLjE4NC0xLjE4NCAzLjEwOS0xLjE4NCA0LjI5MyAwczEuMTg0IDMuMTA5IDAgNC4yOTNsLTYgNnoiIGZpbGw9IiM5NTk1OTciIGNsYXNzPSJmaWxsLTAwMDAwMCI+PC9wYXRoPjwvc3ZnPg==) 8px center/17px no-repeat;
  color: #959597;
  font-size: 14px
}

.input-date {
  position: relative
}

.input-date,
.input-date input {
  cursor: pointer
}

.input-date input::-webkit-calendar-picker-indicator {
  width: 22px;
  height: 22px;
  background: url(../img/calendar.svg) center/contain no-repeat;
  cursor: pointer
}

.input-date input::-webkit-datetime-edit {
  color: transparent;
  opacity: 0
}

.input-date input:focus::-webkit-datetime-edit {
  color: #1e1e1e;
  opacity: 1
}

.input-date span {
  position: absolute;
  top: 50%;
  transform: translatey(-50%);
  z-index: 1;
  color: #bbb;
  font-family: 'Open Sans', sans-serif;
  pointer-events: none
}

.input-date.active input::-webkit-datetime-edit {
  color: #1e1e1e;
  opacity: 1
}

.form__icon {
  flex-grow: 0;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  margin-right: 10px;
  border: 1px solid #777
}

.form__icon.active {
  background: url(../img/check.svg) center/10px no-repeat
}

.form__check {
  display: flex;
  align-items: center;
  width: 100%;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  color: #252525;
  line-height: 1.6153846154
}

.form__check a:hover {
  text-decoration: underline
}

.form__check.error .form__icon {
  border-color: #c00
}

.form__check.error .form__text,
.form__check.error .form__text a {
  color: #c00
}

.popup,
.popup__dialog {
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center
}

.popup {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 11;
  display: none;
  overflow: hidden;
  background: rgba(0, 0, 0, .7)
}

.popup__dialog {
  display: flex;
  flex-direction: column;
  cursor: pointer
}

.popup__content {
  position: relative;
  width: 400px;
  max-width: 96%;
  max-height: 90vh;
  background: #fff;
  overflow-y: auto;
  transition: all .4s;
  text-align: center;
  cursor: default;
  border-radius: 6px
}

.popup__title {
  line-height: 1.3035714286;
  font-family: 'Open Sans', sans-serif;
}

.popup__form form {
  display: grid;
  justify-content: center;
  grid-template-columns: 100%
}

.popup__form .input-wrapper {
  gap: 10px
}

.popup__close {
  position: absolute;
  cursor: pointer;
  transition: all .4s
}

.popup__close svg {
  fill: #3e3e3e
}

.popup-thank .popup__content {
  display: grid;
  min-width: 280px;
  justify-items: center;
  background: #fff;
  color: #1e1e1e
}

.popup-thank .popup__subtitle,
.popup-thank .popup__title {
  margin: 0
}

.popup-thank img {
  object-fit: contain
}

.header__top {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: center;
  gap: 10px;
  justify-content: space-between;
  color: #fff
}

.header__top-wrapper {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 4;
  width: 100%;
  padding: 20px 0;
  min-height: 100px;
  background: #1e1e1e
}

.header__info,
.header__theme {
  display: flex;
  align-items: center
}

.header__info {
  position: relative;
  z-index: 2;
  justify-content: space-between;
  padding: 2px 3px;
  justify-self: end;
  border-radius: 3px;
  background: #3e3e3e
}

.header__theme {
  gap: 12px;
  justify-content: center;
  padding: 8px 16px
}

.header__theme img {
  opacity: .5;
  transition: all .4s
}

.header__logo,
.header__title {
  justify-self: center
}

.header__title {
  font-family: 'Open Sans', sans-serif;
  line-height: 1.25;
  letter-spacing: -.64px;
  font-size: clamp(8px, -.5884691849px + 2.3856858847vw, 32px);
  text-align: center
}

.header-bottom {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 3;
  width: 100%;
  padding: 12px 20px;
  display: flex;
  justify-content: center;
  background: #1e1e1e
}

.page .header__top {
  grid-template-columns: auto 1fr auto
}

.footer__text {
  padding: 8px 0;
  color: #fff;
  background: #1e1e1e;
  letter-spacing: -.28px;
  text-align: center
}

@media (min-width:576px) {
  .main__text {
    grid-column: span 2
  }
}

@media (min-width:768px) {
  .container {
    padding-left: clamp(30px, 13.8461538462px + 4.4871794872vw, 100px);
    padding-right: clamp(30px, 13.8461538462px + 4.4871794872vw, 100px)
  }

  html.light .main__items>:nth-child(3n+1) {
    position: relative;
    z-index: 3
  }

  html.light .main__items>:nth-child(3n+1):before {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
    height: 100%;
    width: 100vw;
    background: var(--main-item-bg)
  }

  html.light .main__items>:nth-child(3n) {
    background: 0 0
  }

  html.light .main__items>:nth-child(3n):before {
    display: none
  }

  html.light .main__items>:last-child {
    background: 0 0
  }

  html.light .main__items>:last-child:before {
    display: none
  }

  html.light .main__items>:nth-child(2) {
    position: relative;
    z-index: 2
  }

  html.light .main__items>:nth-child(2):after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: -1;
    width: 100vw;
    height: 50vh;
    background: var(--main-item-bg);
    pointer-events: none
  }

  html.dark .main__items>:nth-child(3n) {
    position: relative
  }

  html.dark .main__items>:nth-child(3n)>* {
    position: relative;
    z-index: 4
  }

  html.dark .main__items>:nth-child(3n):after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 3;
    width: 100vw;
    height: 350vh;
    background: #48484a;
    pointer-events: none
  }

  .dates span {
    writing-mode: vertical-lr;
    rotate: 180deg
  }

  .header-bottom {
    display: none
  }
}

@media (min-width:992px) {
  .menu-link {
    display: none
  }
}

@media (min-width:1200px) {
  .container {
    min-width: 1166px
  }

  .section-bg+.section-bg {
    margin-top: -20px
  }

  .flex,
  .popup-thank .popup__content {
    gap: 20px
  }

  .grid {
    gap: 12px
  }

  .crumbs {
    margin-bottom: 40px;
    font-size: 14px
  }

  .main,
  .section {
    padding-top: 40px
  }

  .section {
    padding-bottom: 40px
  }

  .logo img {
    width: 164px;
    height: 60px
  }

  .main__items {
    margin: 60px -20px 10px
  }

  .main__item {
    padding: 30px 20px
  }

  .main__item-title {
    font-size: 24px
  }

  .main__text {
    padding: 30px 20px
  }

  .cards {
    row-gap: 40px
  }

  .dates {
    top: 260px;
    font-size: 15px
  }

  .input {
    height: 60px;
    padding-left: 25px;
    padding-right: 25px
  }

  .input-date input {
    padding-right: 20px
  }

  .input-date span {
    left: 27px;
    font-size: 14px
  }

  .form__check {
    font-size: 13px
  }

  .popup__content {
    padding: 28px 30px
  }

  .popup__title {
    margin-bottom: 15px;
    font-size: 28px
  }

  .popup__close {
    right: 15px;
    top: 15px
  }

  .popup__close svg {
    width: 25px;
    height: 25px
  }

  .popup-thank img {
    width: 161px;
    height: 161px
  }

  .header__theme img {
    width: 16px;
    height: 16px
  }

  .footer__text {
    min-height: 36px;
    font-size: 14px
  }
}

@media (min-width:1361px) {
  .header__title {
    font-size: 32px
  }
}

@media (max-width:1199px) {

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    text-wrap: balance
  }

  .main__item-title {
    font-weight: 600;
  }

  .section-bg+.section-bg {
    margin-top: clamp(-20px, -7.6923076923px + -.641025641vw, -10px)
  }

  .flex,
  .popup-thank .popup__content {
    gap: clamp(10px, 7.6923076923px + .641025641vw, 20px)
  }

  .grid {
    gap: clamp(8px, 7.0769230769px + .2564102564vw, 12px)
  }

  .hide-xl {
    display: none
  }

  .show-xl {
    display: block
  }

  .crumbs {
    margin-bottom: clamp(20px, 15.3846153846px + 1.2820512821vw, 40px);
    font-size: clamp(10px, 9.0769230769px + .2564102564vw, 14px)
  }

  .main {
    padding-top: clamp(20px, 15.3846153846px + 1.2820512821vw, 40px)
  }

  .section {
    padding-bottom: clamp(24px, 20.3076923077px + 1.0256410256vw, 40px);
    padding-top: clamp(24px, 20.3076923077px + 1.0256410256vw, 40px)
  }

  .logo img {
    width: clamp(120px, 109.8461538462px + 2.8205128205vw, 164px);
    height: clamp(44px, 40.3076923077px + 1.0256410256vw, 60px)
  }

  .main__items {
    margin: clamp(20px, 10.7692307692px + 2.5641025641vw, 60px) clamp(-20px, -4.6153846154px + -.8012820513vw, -7.5px) clamp(-7.5px, -11.5384615385px + 1.1217948718vw, 10px)
  }

  .main__item {
    padding: clamp(12px, 7.8461538462px + 1.1538461538vw, 30px) clamp(7.5px, 4.6153846154px + .8012820513vw, 20px)
  }

  .main__item-title {
    font-size: clamp(14px, 11.6923076923px + .641025641vw, 24px)
  }

  .main__text {
    padding: clamp(12px, 7.8461538462px + 1.1538461538vw, 30px) clamp(7.5px, 4.6153846154px + .8012820513vw, 20px)
  }

  .cards {
    row-gap: clamp(20px, 15.3846153846px + 1.2820512821vw, 40px);
    grid-template-columns: repeat(auto-fill, minmax(186px, 1fr))
  }

  .dates {
    top: clamp(200px, 186.1538461538px + 3.8461538462vw, 260px);
    font-size: clamp(14px, 13.7692307692px + .0641025641vw, 15px)
  }

  .input {
    height: clamp(50px, 47.6923076923px + .641025641vw, 60px);
    padding-left: clamp(10px, 6.5384615385px + .9615384615vw, 25px);
    padding-right: clamp(10px, 6.5384615385px + .9615384615vw, 25px)
  }

  .input-date input {
    padding-right: clamp(10px, 7.6923076923px + .641025641vw, 20px)
  }

  .input-date span {
    left: clamp(10px, 6.0769230769px + 1.0897435897vw, 27px);
    font-size: clamp(12px, 11.5384615385px + .1282051282vw, 14px)
  }

  .form__check {
    font-size: clamp(11px, 10.5384615385px + .1282051282vw, 13px)
  }

  .popup__content {
    padding: clamp(20px, 18.1538461538px + .5128205128vw, 28px) clamp(15px, 11.5384615385px + .9615384615vw, 30px)
  }

  .popup__title {
    margin-bottom: clamp(10px, 8.8461538462px + .3205128205vw, 15px);
    font-size: clamp(22px, 20.6153846154px + .3846153846vw, 28px)
  }

  .popup__close {
    right: clamp(10px, 8.8461538462px + .3205128205vw, 15px);
    top: clamp(10px, 8.8461538462px + .3205128205vw, 15px)
  }

  .popup__close svg {
    width: clamp(15px, 12.6923076923px + .641025641vw, 25px);
    height: clamp(15px, 12.6923076923px + .641025641vw, 25px)
  }

  .popup-thank img {
    width: clamp(100px, 85.9230769231px + 3.9102564103vw, 161px);
    height: clamp(100px, 85.9230769231px + 3.9102564103vw, 161px)
  }

  .header__theme img {
    width: clamp(14px, 13.5384615385px + .1282051282vw, 16px);
    height: clamp(14px, 13.5384615385px + .1282051282vw, 16px)
  }

  .footer__text {
    min-height: clamp(32px, 31.0769230769px + .2564102564vw, 36px);
    font-size: clamp(10px, 9.0769230769px + .2564102564vw, 14px)
  }
}

@media (max-width:991px) {
  .hide-md {
    display: none
  }

  .show-md {
    display: block
  }

  body {
    padding-top: 84px
  }

  .cards {
    grid-template-columns: repeat(4, 1fr)
  }

  .header__top-wrapper {
    min-height: 84px
  }
}

@media (max-width:767px) {
  .container {
    padding: 0 24px
  }

  .hide-sm {
    display: none
  }

  .show-sm {
    display: block
  }

  html.light .main__items {
    margin-bottom: 0
  }

  html.light .main__items>* {
    position: relative
  }

  html.light .main__items>:after {
    content: "";
    position: absolute;
    left: -24px;
    top: 0;
    width: 100vw;
    height: 100%;
    z-index: -1;
    background: var(--main-item-bg)
  }

  html.light .main__items>:nth-child(n+7) {
    background: 0 0
  }

  html.light .main__items>:nth-child(n+7):after {
    display: none
  }

  html.dark .main__items {
    margin-bottom: 0
  }

  html.dark .main__text {
    grid-column: auto
  }

  html.dark .main__text:after {
    display: none
  }

  .main__items {
    grid-template-columns: repeat(2, 1fr)
  }

  .cards {
    grid-template-columns: repeat(3, 1fr)
  }

  .dates {
    display: flex;
    position: static;
    justify-content: flex-end;
    justify-self: end;
    color: #fff
  }

  .dates svg {
    fill: #fff
  }

  .arrow-next,
  .arrow-prev {
    rotate: -90deg
  }

  .header__title,
  .home .header__top>span {
    display: none
  }

  .home .header__top {
    grid-template-columns: auto 1fr
  }
}

@media (max-width:575px) {
  .container {
    padding: 0 12px
  }

  .hide-xs {
    display: none
  }

  .show-xs,
  html.dark .main__text:after {
    display: block
  }

  html.dark .main__items>:nth-child(7),
  html.dark .main__items>:nth-child(8),
  html.dark .main__items>:nth-child(9) {
    background: #484848
  }

  html.dark .main__text {
    order: 1
  }

  body {
    padding-top: 68px
  }

  .main__items {
    grid-template-columns: 100%;
    align-items: start
  }

  .main__top {
    display: flex;
    overflow-x: auto
  }

  .main__top .card {
    flex: 1 0 232px
  }

  .cards {
    grid-template-columns: 1fr 1fr
  }

  .popup__dialog {
    width: 400px;
    max-width: 100%;
    padding: 0 10px;
    margin: 0 auto
  }

  .header__top-wrapper {
    min-height: 68px;
    padding: 12px 0
  }
}

@media (min-width:768px) and (max-width:991px) {
  html.light .main__items>:nth-child(2):after {
    height: 40vh
  }
}

@media not all and (-webkit-min-device-pixel-ratio:0),
not all and (min-resolution:.001dpcm) {
  input {
    -webkit-appearance: none;
    appearance: none;
    font-size: 16px
  }
}

@media (any-hover:hover) {
  .hover-active:hover {
    color: #ff354d
  }

  .underline:hover:before {
    background: #ff354d
  }

  .crumbs li:not(:last-child):hover {
    color: #ff354d
  }

  .popup__close svg:hover {
    fill: #ff354d
  }
}