.button {
  align-items: center;
  border: none;
  border-radius: 5rem;
  color: #fff;
  display: flex;
  font-family: 'Unbounded';
  gap: 0.75rem;
  justify-content: center;
  line-height: 1.1;
  padding: 0.75rem 1rem;
  text-align: center;
  transition: 0.4s ease;
  width: 100%;
}
.button:hover {
  text-decoration: none;
}
.button__blue-lilac,
.button__blue-pink,
.button__blue-purple {
  background-color: #180a73;
  color: #fff;
}
.button__blue-lilac:hover,
.button__blue-pink:hover,
.button__blue-purple:hover {
  color: #fff;
}
.button__blue-lilac svg [fill],
.button__blue-pink svg [fill],
.button__blue-purple svg [fill] {
  fill: #fff;
}
.button__blue-lilac svg [stroke],
.button__blue-pink svg [stroke],
.button__blue-purple svg [stroke] {
  stroke: #fff;
}
.button__blue-lilac:hover {
  background-color: #d55cf8;
}
.button__blue-pink:hover {
  background-color: #ff4f75;
}
.button__blue-purple:hover {
  background-color: #694aff;
}
.button__purple-blue {
  background-color: #694aff;
  color: #fff;
}
.button__purple-blue:hover {
  background-color: #180a73;
}
.button__white-blue,
.button__white-purple,
.button__white-turquoise {
  background-color: #fff;
  color: #180a73;
}
.button__white-blue {
  box-shadow: 0 0 0 2px #180a73 inset;
}
.button__white-blue:hover {
  background-color: #180a73;
  color: #fff;
}
.button__white-blue:hover svg [fill] {
  fill: #fff;
}
.button__white-blue:hover svg [stroke] {
  stroke: #fff;
}
.button__white-purple:hover {
  background-color: #694aff;
  color: #fff;
}
.button__white-purple:hover svg [fill] {
  fill: #fff;
}
.button__white-purple:hover svg [stroke] {
  stroke: #fff;
}
.button__white-turquoise:hover {
  background-color: #00D4C9;
  color: #180a73;
}
.button__white-turquoise:hover svg [fill] {
  fill: #180a73;
}
.button__white-turquoise:hover svg [stroke] {
  stroke: #180a73;
}
.button svg {
  flex-shrink: 0;
  height: 0.75rem;
  width: 0.75rem;
}
header {
  background-color: #fff;
  position: sticky;
  top: 0;
  z-index: 500;
}
.overflow {
  overflow: hidden;
}
@media (min-width: 992px) {
  .overflow {
    padding-right: 15px;
  }
}
.header {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 1rem;
  padding-top: 1rem;
  position: relative;
}
@media (min-width: 992px) {
  .header {
    padding-bottom: 1.75rem;
    padding-top: 1.75rem;
  }
}
.header-logo {
  align-content: center;
  flex-grow: 1;
  flex-shrink: 0;
  line-height: 0;
}
@media (min-width: 992px) {
  .header-logo {
    flex-grow: 0;
  }
}
.header-logo .logo svg:not(.first) {
  display: none;
}
@media (min-width: 1200px) {
  .header-logo .logo svg:not(.first) {
    display: block;
  }
}
.header-menu {
  background-color: #fff;
  display: flex;
  height: 100%;
  left: -1rem;
  max-width: 25rem;
  min-height: 100vh;
  overflow: auto;
  padding: 0 0 5rem;
  position: absolute;
  top: 0;
  transition: 0.4s ease;
  transform: translateX(-100%);
  width: 100vw;
  z-index: -1;
}
@media (min-width: 992px) {
  .header-menu {
    background-color: unset;
    flex-grow: 1;
    flex-shrink: 0;
    height: auto;
    max-width: unset;
    min-height: unset;
    overflow: unset;
    padding: 0;
    position: static;
    right: unset;
    top: unset;
    transform: none;
    width: unset;
    z-index: 5;
  }
}
.header-menu.active {
  left: calc(100% + 1rem);
}
.header-menu > div {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: 1fr repeat(3, auto) 1fr;
  grid-template-rows: 1fr auto;
  width: 100%;
}
@media (min-width: 992px) {
  .header-menu > div {
    display: flex;
    flex: 1 0 100%;
    grid-template-columns: unset;
    grid-template-rows: unset;
  }
}
.header-menu-search {
  display: flex;
  flex: 1 0 auto;
  grid-column: 1/6;
  padding: 3rem 0;
}
@media (min-width: 992px) {
  .header-menu-search {
    align-items: center;
    padding: 0;
  }
}
.header-menu-search > div {
  display: flex;
  flex-wrap: nowrap;
  overflow: hidden;
  width: 100%;
}
@media (min-width: 992px) {
  .header-menu-search > div {
    overflow: unset;
  }
}
.header-menu-search > div > * {
  flex: 1 0 100%;
  padding: 0 1rem;
  transition: 0.4s ease;
}
@media (min-width: 992px) {
  .header-menu-search > div > * {
    padding: 0;
  }
}
.header-menu__list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  list-style: none;
  margin: 0;
  text-align: center;
  transition: 0.4s ease;
}
@media (min-width: 992px) {
  .header-menu__list {
    flex-direction: row;
    gap: 0.5rem;
    justify-content: space-between;
  }
}
.header-menu__list.active {
  margin-left: -100%;
}
@media (min-width: 992px) {
  .header-menu__list.active {
    margin-left: 0;
  }
}
.header-menu__list ul {
  display: none;
  flex-direction: column;
  gap: 1rem;
  list-style: none;
  margin: 0;
  padding: 1rem 0;
  text-align: left;
  transition: 0.4s ease;
}
@media (min-width: 992px) {
  .header-menu__list ul {
    background-color: #fff;
    display: flex;
    left: -1rem;
    min-width: 12.5rem;
    position: absolute;
    top: 100%;
    transform: scale(1, 0);
    transform-origin: top center;
    width: max-content;
    z-index: -10;
  }
}
.header-menu__list ul > li {
  padding: 0 1rem;
}
.header-menu__list li {
  padding: 0.25rem 0;
}
.header-menu__list li.parent {
  display: flex;
  flex-direction: column;
  position: relative;
  row-gap: 1rem;
}
@media (min-width: 992px) {
  .header-menu__list li.parent:hover > div button {
    transform: scale(1, -1);
  }
  .header-menu__list li.parent:hover > div button:before {
    transform: translateY(-100%) rotate(-45deg);
  }
  .header-menu__list li.parent:hover > ul {
    transform: scale(1, 1);
    z-index: 5;
  }
}
.header-menu__list li.parent.active > div button {
  transform: scale(1, -1);
}
.header-menu__list li.parent.active > div button:before {
  transform: translateY(-100%) rotate(-45deg);
}
.header-menu__list li.parent > div {
  align-items: center;
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  position: relative;
}
.header-menu__list li.parent > div button {
  background: none;
  font-size: 0;
  height: 0;
  line-height: 0;
  padding: 0;
  position: relative;
  transition: 0.4s ease;
  width: 1rem;
}
.header-menu__list li.parent > div button:before {
  border-color: #180a73;
  border-style: solid;
  border-width: 0 0 1px 1px;
  content: '';
  left: 0;
  padding: 0.25rem;
  position: absolute;
  top: 50%;
  transform: translateY(-75%) rotate(-45deg);
}
.header-menu__list li a {
  color: #332784;
  font-weight: 600;
  line-height: 1.25;
  transition: 0.4s ease;
}
@media (min-width: 992px) {
  .header-menu__list li a {
    font-weight: 500;
  }
}
.header-menu__list li a:hover {
  color: #694aff;
  text-decoration: none;
}
.header-menu__list li a.selected {
  color: #ff4f75;
}
.header-menu__link--vk,
.header-menu__link--tg,
.header-menu__link--search {
  align-items: center;
  display: flex;
  justify-content: center;
}
.header-menu__link--vk > a,
.header-menu__link--tg > a,
.header-menu__link--search > a,
.header-menu__link--vk > button,
.header-menu__link--tg > button,
.header-menu__link--search > button {
  background-color: #f1f2f6;
  border-radius: 50%;
  padding: 1.75rem;
  transition: 0.4s ease;
}
@media (min-width: 992px) {
  .header-menu__link--vk > a:hover,
  .header-menu__link--tg > a:hover,
  .header-menu__link--search > a:hover,
  .header-menu__link--vk > button:hover,
  .header-menu__link--tg > button:hover,
  .header-menu__link--search > button:hover {
    background-color: #ff4f75;
  }
}
@media (min-width: 992px) {
  .header-menu__link--vk > a:hover svg [fill],
  .header-menu__link--tg > a:hover svg [fill],
  .header-menu__link--search > a:hover svg [fill],
  .header-menu__link--vk > button:hover svg [fill],
  .header-menu__link--tg > button:hover svg [fill],
  .header-menu__link--search > button:hover svg [fill] {
    fill: #fff;
  }
  .header-menu__link--vk > a:hover svg [stroke],
  .header-menu__link--tg > a:hover svg [stroke],
  .header-menu__link--search > a:hover svg [stroke],
  .header-menu__link--vk > button:hover svg [stroke],
  .header-menu__link--tg > button:hover svg [stroke],
  .header-menu__link--search > button:hover svg [stroke] {
    stroke: #fff;
  }
}
.header-menu__link--vk svg,
.header-menu__link--tg svg,
.header-menu__link--search svg {
  height: 1.5rem;
  width: 1.5rem;
}
.header-menu__link--vk {
  grid-column: 2/3;
}
@media (min-width: 992px) {
  .header-menu__link--vk {
    display: none;
  }
}
.header-menu__link--tg {
  grid-column: 3/4;
}
@media (min-width: 992px) {
  .header-menu__link--tg {
    display: none;
  }
}
.header-menu__link--tg a {
  border-radius: 1.5rem;
}
.header-menu__link--search {
  grid-column: 4/5;
}
.header-menu__link--search button {
  position: relative;
}
@media (min-width: 992px) {
  .header-menu__link--search button {
    padding: 0.75rem;
  }
}
.header-menu__link--search button.active {
  background-color: #180a73;
}
.header-menu__link--search button.active:before {
  opacity: 1;
}
.header-menu__link--search button.active svg [fill] {
  fill: #fff;
}
.header-menu__link--search button.active svg [stroke] {
  stroke: #fff;
}
.header-menu__link--search button:before {
  background-color: #f1f2f6;
  border-radius: 50%;
  content: url('data:image/svg+xml,<svg width=".5rem" height=".5rem" viewBox="0 0 42 43" fill="none" xmlns="http://www.w3.org/2000/svg"><line x1="1.29289" y1="41.2929" x2="41.2929" y2="1.29289" stroke="red" stroke-width="2"/><line x1="41.2929" y1="41.7071" x2="1.29289" y2="1.70711" stroke="red" stroke-width="2"/></svg>');
  line-height: 0;
  opacity: 0;
  padding: 0.5rem;
  position: absolute;
  right: 0;
  top: 0;
}
@media (min-width: 992px) {
  .header-menu__link--search button:before {
    padding: 0.25rem;
  }
}
@media (min-width: 992px) {
  .header-menu__link--search button svg {
    height: 1.5rem;
    width: 1.5rem;
  }
}
@media (min-width: 992px) {
  .header-search {
    background-color: #fff;
    left: 0;
    padding: 1rem 0;
    position: absolute;
    top: 100%;
    transform: scaleY(0);
    transform-origin: top;
    width: 100%;
  }
}
.header-search.active {
  transform: scaleY(1);
}
.header-mayor {
  align-items: center;
  display: none;
}
@media (min-width: 992px) {
  .header-mayor {
    display: flex;
  }
}
.header-personal {
  display: flex;
}
.header-personal a {
  font-family: 'TT Norms';
}
.header-button {
  display: flex;
}
@media (min-width: 992px) {
  .header-button {
    display: none;
  }
}
.header-button button {
  align-items: center;
  background-color: #fff;
  border: 1px solid #180a73;
  border-radius: 5rem;
  display: flex;
  justify-content: center;
  padding: 0.5rem 1.25rem;
}
.header-button button.active div:before,
.header-button button.active div:after {
  opacity: 1;
}
.header-button button.active span {
  opacity: 0;
}
.header-button button > div {
  align-items: center;
  display: flex;
  flex-direction: column;
  height: 1.25rem;
  justify-content: space-around;
  overflow: hidden;
  position: relative;
  width: 1.25rem;
}
.header-button button > div:before,
.header-button button > div:after {
  background-color: #000;
  content: '';
  height: 2px;
  left: 50%;
  opacity: 0;
  position: absolute;
  top: 50%;
  width: 100%;
}
.header-button button > div:after {
  transform: translate(-50%, -50%) rotate(-45deg);
}
.header-button button > div:before {
  transform: translate(-50%, -50%) rotate(45deg);
}
.header-button button span {
  background-color: #171718;
  height: 2px;
  width: 100%;
}
.logo {
  align-items: center;
  display: inline-flex;
  gap: 0.75rem;
  z-index: 10;
}
.logo .first {
  height: 3rem;
  width: 3rem;
}
.logo .second {
  height: 2rem;
}