:root {
  --font-family: "IBM Plex Mono", sans-serif;
}

@font-face {
  font-display: swap;
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/ibm-plex-mono/ibm-plex-mono-400.woff2') format('woff2'),
        url('../fonts/ibm-plex-mono/ibm-plex-mono-400.ttf') format('truetype');
}

@font-face {
  font-display: swap;
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/ibm-plex-mono/ibm-plex-mono-500.woff2') format('woff2'),
        url('../fonts/ibm-plex-mono/ibm-plex-mono-500.ttf') format('truetype');
}

@font-face {
  font-display: swap;
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/ibm-plex-mono/ibm-plex-mono-600.woff2') format('woff2'),
        url('../fonts/ibm-plex-mono/ibm-plex-mono-600.ttf') format('truetype');
}

@font-face {
  font-display: swap;
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/ibm-plex-mono/ibm-plex-mono-700.woff2') format('woff2'),
        url('../fonts/ibm-plex-mono/ibm-plex-mono-700.ttf') format('truetype');
}

html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
}

h1 {
  font-size: 2em;
  margin: .67em 0;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

a {
  background-color: transparent;
}

abbr[title] {
  border-bottom: none;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
}

b,strong {
  font-weight: bolder;
}

small {
  font-size: 87%;
}

sub,sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}

img {
  border-style: none;
}

button,input,optgroup,select,textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

button,input {
  overflow: visible;
}

button,select {
  text-transform: none;
}

[type="button"],[type="reset"],[type="submit"],button {
  -webkit-appearance: button;
}

[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner,button::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring,button:-moz-focusring {
  outline: 1px dotted ButtonText;
}

fieldset {
  padding: .35em .75em .625em;
}

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  white-space: normal;
  padding: 0;
}

progress {
  vertical-align: baseline;
}

textarea {
  overflow: auto;
}

[type="checkbox"],[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

summary {
  display: list-item;
}

* {
  box-sizing: border-box;
}

details,main {
  display: block;
}

code,kbd,pre,samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

[hidden],template {
  display: none;
}

a,button {
  -webkit-tap-highlight-color: transparent;
}

.link,a {
  text-decoration: none;
  transition: .2s;
}

.link:hover,a:hover {
}

html {
  font-size: 14px;
}

body {
  font-family: var(--font-family);
  color: #000;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.3;
  background: #f3f3f3;
}

.h1,.h2,.h3,.h4,.h5,h1,h2,h3,h4,h5 {
  color: #000;
  font-family: var(--font-family);
  font-weight: 600;
  margin-top: 0;
}

.h1,h1 {
  font-size: 2rem;
  line-height: 1;
  margin: 0 0 2rem;
}

.h2,h2 {
  font-size: 1.5rem;
  line-height: 1;
  margin: 0 0 1.5rem;
}

.h3,h3 {
  font-size: 1.25rem;
  line-height: 1.2;
  margin: 0 0 1.5rem;
}

.h4,h4 {
  font-size: 1.5rem;
  line-height: 1.1;
  margin: 0 0 1rem;
}

.text,p {
  color: #000;
  font-weight: 500;
  font-size: 1.25rem;
  line-height: 1.5;
  margin: 1rem 0;
}

ul:not([class]) {
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.5;
}

b,strong {
  font-weight: 700;
}

.text-uppercace {
  text-transform: uppercase;
}

.text-center {
  text-align: center;
}

.text-lg-center {
}

.container {
  margin-right: auto;
  margin-left: auto;
  padding: 0 0.75rem;
  max-width: 107.5rem;
}

.page-container {
  flex: 1 1 auto;
}

.btn {
  font-family: var(--font-family);
  color: #0098ff;
  font-weight: 700;
  font-size: 1.25rem;
  white-space: nowrap;
  line-height: unset;
  position: relative;
  text-decoration: none;
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 2.5rem;
  min-height: 3.5rem;
  transition: .4s;
  border-radius: 0.75rem;
  outline: 0;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 0.0625rem solid #0098ff;
}

.btn:hover:not(.btn--reset) {
}

.btn:active:not(.btn--reset) {
  color: #fff;
  background: #3478c6;
  border-color: #3478c6;
}

.btn--reset {
  margin: 0;
  padding: 0;
  outline: 0;
  border: 0;
  min-height: 0.0625rem;
  border-radius: 0;
  background-color: transparent;
  cursor: pointer;
}

.btn--accent {
  color: #fff;
  background: #0098ff;
  border-color: #0098ff;
}

.btn--light {
  color: #000;
  background: #fff;
  border: 0.0625rem solid #fff;
}

.btn--border-accent {
  color: #0098ff;
  background: #fff;
  border-color: #0098ff;
}

.btn--chevron-down:after {
  content: '';
  width: 1.5rem;
  height: 1.5rem;
  min-width: 1.5rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.btn--chevron-down:after {
  background-image: url('../img/icons/chevron-down.svg');
}

.list-reset {
  list-style: none;
  padding: 0;
  margin: 0;
}

.overflow-hidden {
  overflow: hidden;
}

.visibility-hidden {
  visibility: hidden;
}

img {
  display: block;
  max-width: 100%;
  width: auto;
  height: auto;
}

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

.img-cover--wrap {
  overflow: hidden;
  position: relative;
}

.hide-xl-down {
}

.hide-xl-only {
}

.hide-lg-down {
}

.hide-lg-up {
}

.hide-md-down {
}

.hide-md-up {
}

.hide-sm-down {
}

.hide-sm-only {
}

.btns-spacer {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: -0.75rem;
}

.btns-spacer > * {
  margin-right: 0.75rem;
  margin-bottom: 0.75rem;
}

.form__group {
  display: flex;
  flex-wrap: wrap;
  gap: 0 1.25rem;
}

.form__group > * {
  flex: 1 1 12.5rem;
}

.form__send {
  min-height: 3.5rem;
  padding: 0 2.5rem;
  border-radius: 0.75rem;
}

.form__agree {
  display: block;
  margin-top: 2rem;
  color: rgba(255, 255, 255, .25);
  font-weight: 500;
  font-size: 1rem;
}

.form__agree a:not([class]) {
  color: #fff;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.form__agree a:not([class]):hover {
}

.form__agree a:not([class]):active {
  -webkit-text-decoration-color: transparent;
  text-decoration-color: transparent;
}

.form__footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 2rem;
}

.input {
  margin-bottom: 1.25rem;
  display: block;
  position: relative;
}

.input--light .input__label {
  color: #fff;
}

.input--light .input__cell {
  border-color: #fff;
}

.input__label {
  color: #000;
  font-weight: 500;
  font-size: 1rem;
  display: inline-flex;
  align-items: center;
  margin: 0 0 0.375rem;
}

.input__label img {
  margin-right: 0.375rem;
}

.input__cell {
  position: relative;
  font-family: var(--font-family);
  color: #412920;
  font-weight: 500;
  font-size: 1.25rem;
  line-height: 1.5;
  background: #fff;
  border: 0.0625rem solid #000;
  border-radius: 0.75rem;
  min-height: 3.5rem;
  padding: 0 1.25rem;
  width: 100%;
  outline: none;
  transition: .2s;
  resize: none;
}

.input__cell::-webkit-inner-spin-button,.input__cell::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.input__cell:focus::-webkit-input-placeholder {
  color: transparent;
}

.input__cell:focus::-moz-placeholder {
  color: transparent;
}

.input__cell:focus::-ms-input-placeholder {
  color: transparent;
}

.input__cell:focus::placeholder {
  color: transparent;
}

.input__cell::-webkit-input-placeholder {
  color: rgba(0, 0, 0, 0.2);
}

.input__cell::-moz-placeholder {
  color: rgba(0, 0, 0, 0.2);
}

.input__cell::-ms-input-placeholder {
  color: rgba(0, 0, 0, 0.2);
}

.input__cell::placeholder {
  color: rgba(0, 0, 0, 0.2);
}

.input__checkbox {
  display: none;
}

.input__checkbox:checked ~ .input__checkbox-label:before {
  background-color: #fff;
  background-image: url('../img/icons/checkbox-active.svg');
}

.input__checkbox-label {
  cursor: pointer;
  position: relative;
  color: #000;
  padding-left: 2.5rem;
}

.input__checkbox-label:before {
  content: '';
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 0.25rem;
  border: 0.125rem solid #fff;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  position: absolute;
  top: -0.125rem;
  left: 0;
}

.input__radio {
  display: none;
}

.input__radio:checked ~ .input__radio-label:before {
  background: #0098ff;
  border-color: #0098ff;
}

.input__radio:checked ~ .input__radio-label:after {
  background: #fff;
}

.input__radio:checked ~ .input__radio-label:hover {
  color: rgba(51, 51, 51);
}

.input__radio:checked ~ .input__radio-label:hover:before {
  background: #5aabf8;
  border-color: #5aabf8;
}

.input__radio-label {
  cursor: pointer;
  position: relative;
  color: #000;
  font-weight: 500;
  font-size: 1.25rem;
  padding-left: 2.5rem;
  transition: .2s ease;
}

.input__radio-label:before {
  content: '';
  width: 1.625rem;
  height: 1.625rem;
  border-radius: 50%;
  border: 0.0625rem solid #0098ff;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  position: absolute;
  top: 0;
  left: 0;
  transition: .2s ease;
}

.input__radio-label:after {
  content: '';
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 50%;
  background: transparent;
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  transition: .2s ease;
}

.input__radio-label:hover {
  color: rgba(51, 51, 51);
  border-color: #5aabf8;
}

.slider-full {
  position: relative;
  width: 100vw;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  overflow: hidden;
}

.slider-pagination {
  display: flex;
  justify-content: center;
  margin-top: 1.5rem;
}

.slider-pagination .swiper-pagination-bullet {
  border-radius: 0.5rem;
  opacity: 1;
  width: 1.25rem;
  height: 0.5rem;
  background: #0098ff;
  margin: 0 0.625rem 0 0;
  transition: .2s ease;
}

.slider-pagination .swiper-pagination-bullet:last-child {
  margin: 0;
}

.slider-pagination .swiper-pagination-bullet-active {
  width: 2.5rem;
}

.slider-btn-next,.slider-btn-prev {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  background: #fff;
  border-radius: 50%;
  box-shadow: inset 0 -2px 6px 0 rgba(10, 37, 64, 0.35), 0 30px 60px -30px rgba(0, 0, 0, 0.3), 0 50px 100px -20px rgba(50, 50, 93, 0.25);
  position: absolute;
  /* .swiper-wrapper has z-index:1 (its own base rule); these buttons had
     z-index:auto, so the wrapper painted ON TOP of them at every breakpoint
     (confirmed with document.elementFromPoint() returning the card, not the
     button, at the button's own coordinates) — the arrows were technically
     in the DOM/visible by CSS properties but a card was drawn over them.
     z-index must beat the wrapper's 1. */
  z-index: 2;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  transition: .2s ease;
}

.slider-btn-next:before,.slider-btn-prev:before {
  content: '';
  width: 1.5rem;
  height: 1.5rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  transition: .2s ease;
}

.slider-btn-next:hover,.slider-btn-prev:hover {
}

.slider-btn-next:hover:before,.slider-btn-prev:hover:before {
}

.slider-btn-next:active,.slider-btn-prev:active {
  box-shadow: none;
  background: #3478c6;
}

.slider-btn-next:active:before,.slider-btn-prev:active:before {
  -webkit-filter: brightness(0) invert(1);
  filter: brightness(0) invert(1);
}

.slider-btn-prev {
  left: 0;
}

.slider-btn-prev:before {
  background-image: url('../img/icons/slider-prev.svg');
}

.slider-btn-next {
  right: 0;
}

.slider-btn-next:before {
  background-image: url('../img/icons/slider-next.svg');
}

.section {
  position: relative;
  margin-top: 3.75rem;
  margin-bottom: 3.75rem;
}

.section:first-child {
}

.section__head {
  margin-bottom: 2rem;
}

.section__title {
  text-align: left;
  margin-bottom: 0;
}

.section__footer {
  display: flex;
  justify-content: center;
  margin-top: 2rem;
}

.section--bg-blue {
  z-index: 1;
  background: #0098ff;
  padding: 3.75rem 0;
  margin: 0;
}

.section--bg-blue .section__title {
  color: #fff;
}

.section--bg-blue:before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 100vw;
  height: 100%;
  background: #0098ff;
  z-index: -1;
}

.section--bg-light {
  background: #fff;
  padding: 3.75rem 0;
  margin: 0;
}

.section--bg-light:before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 100vw;
  height: 100%;
  background: #fff;
  z-index: -1;
}

.section-bg-triangle {
  width: 32.5rem;
  height: 32.5rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../img/bgs/triangle-light.svg');
  position: absolute;
  z-index: -1;
}

.section-bg-triangle.-pos-bottom-left- {
  left: -1.5rem;
  bottom: 0;
}

.section-bg-triangle.-pos-bottom-right- {
  right: -1.5rem;
  bottom: 0;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.section-bg-triangle.-pos-top-right- {
  right: -1.5rem;
  top: 0;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.social {
  display: flex;
  align-items: center;
}

.social__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 1rem;
  border: 0.125rem solid #000;
  border-radius: 50%;
}

.social__link:hover {
}

.social__link:active {
  opacity: .5;
}

.social__link:last-child {
  margin: 0;
}

.social__link:before {
  content: '';
  width: 3rem;
  height: 3rem;
  min-width: 3rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.social--light .social__link {
  border-color: #fff;
}

.social--light .social__link--fb:before {
  background-image: url('../img/icons/social/fb-light.svg');
}

.social--light .social__link--x:before {
  background-image: url('../img/icons/social/x-light.svg');
}

.social--light .social__link--vk:before {
  background-image: url('../img/icons/social/vk-light.svg');
}

.social--light .social__link--yb:before {
  background-image: url('../img/icons/social/yb-light.svg');
}

.social--light .social__link--tg:before {
  background-image: url('../img/icons/social/tg-light.svg');
}

.social--light .social__link--rb:before {
  background-image: url('../img/icons/social/rb-light.svg');
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.pagination {
  display: flex;
  justify-content: center;
  margin-top: 3.25rem;
}

.pagination__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: nowrap;
  border: 0.0625rem solid #cfcfcf;
  border-radius: 0.5rem;
  overflow: hidden;
}

.pagination__item {
  border-left: 1px solid #cfcfcf;
}

.pagination__item.is-selected .pagination__link {
  cursor: default;
  color: #fff;
  background: #0098ff;
}

.pagination__item:first-child {
  border: none;
}

.pagination__link {
  color: #000;
  font-weight: 500;
  font-size: 1.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 3.625rem;
  height: 3.625rem;
  min-width: 3.625rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

a.pagination__link:hover {
}

.header {
  position: sticky;
  top: 0;
  z-index: 99;
  background: #fff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.16);
  padding: 0.75rem 0;
}

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

.header__logo {
  display: flex;
  align-items: center;
}

.header__logo-link {
  display: block;
  min-width: 12.5rem;
  width: 12.5rem;
}

.header__logo-img {
  width: 100%;
}

.header__logo-text {
  color: #0098ff;
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 2.2;
  white-space: nowrap;
  text-transform: lowercase;
  padding-left: 1rem;
  margin-left: 1rem;
  border-left: 1px solid #0098ff;
}

.header__panel {
  border-radius: 0.75rem;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  background: #fff;
  padding: 0.625rem;
  padding-left: 1.25rem;
  display: flex;
  align-items: center;
  margin-left: 0;
}

.header__panel-title {
  color: #0098ff;
  font-weight: 700;
  font-size: 1.25rem;
  margin-right: 1.5rem;
}

.header__contacts {
  display: flex;
  gap: 0.75rem;
}

.header__contacts-messanger,.header__contacts-phone {
  border: 0.0625rem solid #f1f1f1;
  border-radius: 0.75rem;
  min-height: 3.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.header__contacts-messanger:hover,.header__contacts-phone:hover {
}

.header__contacts-messanger:active,.header__contacts-phone:active {
  color: #0098ff;
  border-color: #0098ff;
}

.header__contacts-phone {
  color: #000;
  font-weight: 500;
  font-size: 1.125rem;
  white-space: nowrap;
  padding: 0 2.5rem;
}

.header__contacts-messanger {
  min-width: 4.125rem;
  width: 4.125rem;
}

.header__contacts-messanger:before {
  content: '';
  width: 1.875rem;
  height: 1.875rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.header__contacts-messanger.-wa-:before {
  background-image: url('../img/icons/header-wa.svg');
}

.header__contacts-messanger.-tg-:before {
  background-image: url('../img/icons/header-tg.svg');
}

.header__menu {
  display: none;
  justify-content: flex-end;
  background: #fff;
  padding: 0.75rem;
}

.header__nav {
}

.header__nav-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.header__nav-item {
  position: relative;
  margin: 0;
  border-bottom: 1px solid #a1a1a1;
}

.header__nav-item:last-child {
  border: none;
  margin: 0;
}

.header__nav-item--active .header__nav-child-list {
}

.header__nav-item--active .header__nav-toggle:after {
}

.header__nav-item:hover .header__nav-name {
}

.header__nav-item:hover .header__nav-toggle:after {
}

.header__nav-item:hover .header__nav-child-list {
}

.header__nav-name {
  cursor: pointer;
  display: flex;
  align-items: center;
}

.header__nav-toggle {
}

.header__nav-toggle:after {
  transition: .2s ease;
}

.header__nav-link {
  color: #000;
  font-weight: 600;
  font-size: 1.25rem;
  display: inline-flex;
  align-items: center;
  min-height: 4.5rem;
  width: 100%;
}

.header__nav-link:hover {
  color: #000;
}

.header__nav-child-list {
  list-style: none;
  padding: 0 0 1.5rem;
  margin: 0.5rem 0 0;
  display: none;
}

.header__nav-child-item {
  margin-bottom: 1.5rem;
}

.header__nav-child-item:last-child {
  margin: 0;
}

.header__nav-child-link {
  color: #000;
  font-weight: 500;
  font-size: 1.125rem;
}

.header__nav-child-link:hover {
}

.header__auth {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}

.header__auth .btn {
  width: 100%;
  min-height: 3.5rem;
  padding: 0 2.5rem;
}

.header__burger {
  margin-left: auto;
}

.header__burger:before {
  content: '';
  width: 4.5rem;
  height: 4.5rem;
  min-width: 4.5rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url('../img/icons/menu-burger.svg');
  transition: .2s;
}

.header__burger.btn--cross:before {
  background-image: url('../img/icons/menu-close.svg');
}

.header__city {
  position: relative;
}

.header__city.is-active .header__city-btn:after {
  -webkit-transform: rotate(-180deg);
  transform: rotate(-180deg);
}

.header__city.is-active .header__city-menu {
  display: block;
  -webkit-animation: fadeIn .2s forwards;
  animation: fadeIn .2s forwards;
}

.header__city-btn {
  font-weight: 500;
  font-size: 1.25rem;
  background: #fff;
  border-radius: 0.75rem;
  border: 0.0625rem solid #f3f3f3;
  display: block;
  align-items: center;
  min-height: 3.5rem;
  padding: 0 2.5rem 0 1.25rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}

.header__city-btn:after {
  position: absolute;
  right: 1rem;
  transition: .2s ease;
}

.header__city-caption {
  color: #0098ff;
  font-weight: 500;
  font-size: 1.25rem;
  margin: 0 0 1.25rem;
}

.header__city-input {
  background: #f5f5f5;
  border-color: #f5f5f5;
  margin-bottom: 1.25rem;
  width: 100%;
}

.header__city-menu {
  position: absolute;
  top: 100%;
  left: -6.5625rem;
  box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  border: 0.0625rem solid #f3f3f3;
  border-radius: 0.75rem;
  background: #fff;
  z-index: 99;
  padding: 1.25rem;
  margin-top: 1.625rem;
  width: 22.5rem;
  display: none;
}

.header__city-list {
  list-style: none;
  padding: 0 1.5rem 1.25rem 0;
  margin: 0 -1.1875rem 0 0;
  overflow: auto;
  max-height: 12.5rem;
}

.header__city-list::-webkit-scrollbar {
  width: 1.125rem;
}

.header__city-list::-webkit-scrollbar-track {
  background: #f5f5f5;
  border-radius: 2rem;
  margin-bottom: 2.25rem;
}

.header__city-list::-webkit-scrollbar-thumb {
  background-color: #0098ff;
  border-radius: 2rem;
}

.header__city-item {
  margin-bottom: 0.75rem;
}

.header__city-item--current .header__city-link {
  pointer-events: none;
  color: #fff;
  border-color: #0098ff;
  background: #0098ff;
}

.header__city-item:last-child {
  margin-bottom: 0;
}

.header__city-link {
  color: #000;
  font-weight: 500;
  font-size: 1.25rem;
  width: 100%;
  display: inline-flex;
  align-items: center;
  border: 0.0625rem solid #f5f5f5;
  border-radius: 0.75rem;
  min-height: 3.5rem;
  padding: 0 1.25rem;
}

.header__city-link:hover {
}

.header-mobile-menu .header__menu {
}

.hero {
  margin-right: -0.75rem;
  margin-bottom: -3.75rem;
  margin-left: -0.75rem;
  padding: 2rem 0.75rem;
}

.hero__row {
}

.hero__main {
  width: 100%;
}

.hero__aside {
  margin: 3rem 0 0;
}

.hero__info {
}

.hero__title {
  margin-bottom: 1.5rem;
}

.hero__text {
  font-weight: 500;
}

.hero__actions {
  margin-top: 2.25rem;
}

.hero__actions .btn {
  border-radius: 0.75rem;
}

.hero__img {
  width: 100%;
}

.hero__img--wrap {
  border-radius: 2rem;
  overflow: hidden;
}

.breadcrumbs {
  margin: 2.5rem 0;
}

.breadcrumbs__list {
  list-style: none;
  padding: 0;
  margin: 0 0 -1rem;
  display: flex;
  flex-wrap: wrap;
}

.breadcrumbs__list-item {
  position: relative;
  padding-left: 1rem;
  margin-right: 1rem;
  margin-bottom: 1rem;
}

.breadcrumbs__list-item:before {
  content: '';
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 50%;
  background: #000;
  position: absolute;
  top: 50%;
  left: -0.1875rem;
}

.breadcrumbs__list-item:first-child {
  padding-left: 0;
}

.breadcrumbs__list-item:first-child::before {
  display: none;
}

.breadcrumbs__list-link {
  color: #000;
  font-weight: 500;
  font-size: 1.25rem;
}

a.breadcrumbs__list-link {
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

a.breadcrumbs__list-link:hover {
  -webkit-text-decoration-color: transparent;
  text-decoration-color: transparent;
}

.feedback {
  margin-right: -0.75rem;
  margin-left: -0.75rem;
}

.feedback__main {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.feedback__aside {
  position: relative;
  z-index: 2;
}

.feedback__aside:after,.feedback__aside:before {
  content: '';
  width: 32.5rem;
  height: 32.5rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  z-index: -1;
}

.feedback__aside:before {
  background-image: url('../img/bgs/triangle-top-right.svg');
  top: -15.625rem;
  right: 0;
  -webkit-transform: rotate(-27deg);
  transform: rotate(-27deg);
}

.feedback__aside:after {
  background-image: url('../img/bgs/triangle-bottom-left.svg');
  left: 0;
  bottom: -15rem;
  -webkit-transform: rotate(-27deg);
  transform: rotate(-27deg);
}

.feedback__title {
  color: #fff;
  margin-bottom: 2rem;
}

.feedback__text {
  color: #fff;
  font-weight: 500;
  margin: 0;
}

.feedback__img--wrap {
  width: 89%;
  margin-left: 5.25rem;
}

.feedback__form {
  margin-top: 2rem;
}

.feedback__form .form__send {
}

.service.service--home .service-feed {
  gap: 1.25rem;
}

.service.service--home .service-post {
  width: auto;
  min-height: 9.375rem;
  flex: 1 1 11.25rem;
}

.service.service--home .service-tabs {
}

.service.service--home .service-tabs__item--active .service-tabs__btn {
}

.service.service--home .service-tabs__btn {
}

.service.service--home .service-tabs__btn:active:not(.btn--reset) {
}

.service-tabs {
  margin-bottom: 2rem;
}

.service-tabs__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.service-tabs__item {
  flex: 1;
  margin: 0 0 0.75rem;
}

.service-tabs__item:last-child {
  margin: 0;
}

.service-tabs__item--active .service-tabs__btn {
  color: #fff;
  background: #3478c6;
  border-color: transparent;
  pointer-events: none;
}

.service-tabs__btn {
  color: #000;
  font-weight: 700;
  font-size: 1.25rem;
  text-align: center;
  width: 100%;
  min-height: 3.5rem;
  background: #fff;
  padding: 0 1rem;
  border-radius: 0.75rem;
  border: none;
}

.service-info {
  margin: 0 0 2.5rem;
}

.service-info__title {
  margin: 0;
}

.service-info__text {
  margin: 1.5rem 0 0;
}

.service-section {
  display: none;
}

.service-section--active {
  display: block;
  -webkit-animation: fadeIn .2s forwards;
  animation: fadeIn .2s forwards;
}

.service-feed {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
}

.service-post {
  position: relative;
  width: 100%;
  background: #fff;
  border-radius: 1rem;
  padding: 1.25rem;
  transition: .2s ease;
}

.service-post__name {
  color: #000;
  font-weight: 600;
  font-size: 1.5rem;
  display: flex;
  justify-content: space-between;
  padding-right: 3.25rem;
  max-width: 45rem;
}

.service-post:after {
  content: '';
  width: 2rem;
  height: 2rem;
  background: url('../img/icons/service-arrow.svg') no-repeat center / contain;
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
}

.service-post:hover {
}

.benefits-feed {
  position: relative;
}

.benefits-feed__slider {
  padding-top: 1.25rem;
  transition: .2s ease;
}

.benefits-feed .slider-btn-prev {
  top: 6.25rem;
  -webkit-transform: none;
  transform: none;
}

.benefits-feed .slider-btn-next {
  top: 6.25rem;
  -webkit-transform: none;
  transform: none;
}

.benefit-post {
  min-width: 21.5625rem;
  max-width: 21.5625rem;
}

.benefit-post:before {
  content: '';
  position: absolute;
  top: -0.75rem;
  right: -0.75rem;
  bottom: -0.75rem;
  left: -0.75rem;
  border-radius: 1.25rem 1.25rem 0 0;
  background: #0098ff;
  z-index: -9;
  display: none;
}

.benefit-post.swiper-slide-active:before {
  display: block;
  -webkit-animation: fadeIn .4s forwards;
  animation: fadeIn .4s forwards;
}

.benefit-post.swiper-slide-active .benefit-post__child {
  display: block;
  -webkit-animation: fadeIn .4s forwards;
  animation: fadeIn .4s forwards;
}

.benefit-post__main {
  background: #fff;
  border-radius: 1rem;
  padding: 1.25rem;
  min-height: 12.5rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.benefit-post__name {
  font-weight: 600;
  font-size: 1.5rem;
}

.benefit-post__icon--wrap {
  margin-left: auto;
  width: 4rem;
  max-width: 4rem;
}

.benefit-post__child {
  display: none;
  position: relative;
  max-width: 107.5rem;
  width: 100vw;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  top: 100%;
  padding: 0 0.75rem;
  margin-top: 0.75rem;
  position: absolute;
}

.benefit-post__child-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
  background: #0098ff;
  border-radius: 1.25rem;
  padding: 0.75rem;
}

.benefit-post__child-item {
  font-weight: 500;
  font-size: 1.25rem;
  line-height: 1.5;
  background: #fff;
  border-radius: 1rem;
  min-height: 9.625rem;
  padding: 1.25rem;
  flex: 1 1 11.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.sms-calc {
}

.sms-calc__info {
}

.sms-calc__title {
  color: #fff;
}

.sms-calc__text {
  color: #fff;
  font-weight: 500;
  margin: 2rem 0 0;
}

.sms-calc__main {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
  margin: 1.25rem 0 0;
}

.sms-calc__headline {
  font-weight: 600;
  font-size: 1.375rem;
  margin-bottom: 1.25rem;
}

.sms-calc__headline.-border- {
  padding-bottom: 1.25rem;
  border-bottom: 1px solid rgba(0, 0, 0, .2);
}

.sms-calc__headline.text-center {
}

.sms-calc__field {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  border: 0.0625rem solid #efefef;
  border-radius: 1rem;
  background: #fff;
  padding: 1.25rem;
  flex: 1 1 20rem;
}

.sms-calc__input {
  background: #f3f3f3;
  border-radius: 0.75rem;
  display: flex;
}

.sms-calc__input .input__cell {
  background: #f3f3f3;
  border: none;
}

.sms-calc__input-caption {
  font-weight: 500;
  font-size: 1.25rem;
  text-align: center;
  padding: 0 1.5rem;
  display: inline-flex;
  align-items: center;
  min-height: 3.5rem;
  border-left: 1px solid #c2c2c2;
}

.sms-calc__radios {
  display: flex;
  gap: 1.25rem;
}

.sms-calc__radios .input {
  margin: 0;
}

.sms-calc__slider {
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  position: relative;
  z-index: 2;
  width: 100%;
}

.sms-calc__slider-range {
  width: 100%;
  margin: 1.25rem 0 0;
}

.sms-calc__slider-input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: none;
  height: 3rem;
  width: 100%;
}

.sms-calc__slider-input::-webkit-slider-runnable-track {
  box-sizing: border-box;
  height: 0.75rem;
  background-color: #f3f3f3;
  border-radius: 1.3125rem;
}

.sms-calc__slider-input::-moz-range-track {
  box-sizing: border-box;
  height: 0.75rem;
  background-color: #f3f3f3;
  border-radius: 1.3125rem;
}

.sms-calc__slider-input::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 3rem;
  height: 3rem;
  margin-top: -1.1875rem;
  border-radius: 50%;
  background: #0098ff;
  border: 0.5rem solid #fff;
  transition: 300ms;
}

.sms-calc__slider-input::-moz-range-thumb {
  width: 1.5rem;
  height: 1.5rem;
  margin-top: -1.1875rem;
  border: none;
  border-radius: 50%;
  background: #0098ff;
  border: 0.5rem solid #fff;
  transition: 300ms;
}

.sms-calc__slider-input::-moz-range-progress {
  height: 0.75rem;
  border-radius: 0.625rem;
  background-color: #f3f3f3;
}

.sms-calc__slider-captions {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.sms-calc__slider-original {
  color: #fff;
  font-weight: 400;
  font-size: 1.375rem;
}

.sms-calc__actions {
  width: 100%;
  display: flex;
  justify-content: flex-end;
}

.sms-calc__send {
}

.clients-feed__slider {
  padding-bottom: 0.625rem;
  margin-bottom: -0.625rem;
}

.clients-feed__slider.slider-full {
  width: auto;
  left: auto;
  -webkit-transform: none;
  transform: none;
}

.clients-feed .slider-btn-prev {
}

.clients-feed .slider-btn-next {
}

.client-post {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  background: #fff;
  border-radius: 1.25rem;
  height: auto;
}

.client-post__img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.client-post__img--wrap {
  position: relative;
  padding-top: 53.5%;
  overflow: hidden;
  border-radius: 1.25rem 1.25rem 0 0;
  display: block;
}

.client-post__img--wrap[data-sub-html] {
  cursor: pointer;
}

.client-post__img--wrap[data-sub-html]:hover .client-post__play {
}

.client-post__img--wrap[data-sub-html]:active .client-post__play {
  background: rgba(230, 230, 230, .5);
}

.client-post__info {
  padding: 1.25rem;
}

.client-post__title {
  font-size: 1.5rem;
  text-align: center;
  margin-bottom: 0.5rem;
}

.client-post__post {
  font-weight: 500;
  font-size: 1rem;
  text-align: center;
  margin-bottom: 1.25rem;
}

.client-post__quote {
  font-size: 1.125rem;
  text-align: center;
  margin: 0;
}

.client-post__quote:before {
  content: '«… ';
}

.client-post__quote:after {
  content: ' …»';
}

.client-post__panel {
  padding: 0.875rem;
  border-radius: 0.75rem;
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.24), 0 1px 2px 0 rgba(0, 0, 0, 0.12);
  background: #f3f3f3;
  font-weight: 500;
  font-size: 0.875rem;
  display: inline-block;
  max-width: 15rem;
  width: 100%;
}

.client-post__panel span {
  font-size: 1.0625rem;
  display: block;
  margin-top: 0.875rem;
}

.client-post__panel.-accent- {
  color: #fff;
  max-width: 100%;
  padding: 1.25rem;
  border-radius: 1rem;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  background: #0098ff;
}

.client-post__actions {
  display: flex;
  justify-content: center;
  margin-top: 1.25rem;
}

.client-post__actions .btn--accent {
  border-radius: 0.75rem;
}

.client-post__play {
  width: 5rem;
  height: 5rem;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background: rgba(230, 230, 230, .3);
  transition: .2s ease;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.client-post__play:before {
  content: '';
  width: 2rem;
  height: 2rem;
  background: url('../img/icons/video-play.svg') no-repeat center / contain;
}

.home-faq {
  max-width: 67.75rem;
  margin-right: auto;
  margin-left: auto;
}

.home-faq__item {
  padding: 1.25rem;
  background: #fff;
  border-radius: 0.5rem;
  margin-bottom: 1rem;
}

.home-faq__item:last-child {
  margin-bottom: 0;
}

.home-faq__btn {
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 1.3;
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid transparent;
  transition: .2s ease;
}

.home-faq__btn:after {
  content: '';
  width: 2rem;
  height: 2rem;
  min-width: 2rem;
  background: url('../img/icons/acc-chevron-down.svg') no-repeat center / contain;
  transition: .2s ease;
}

.home-faq__btn[aria-expanded="true"] {
  padding-bottom: 1.25rem;
  margin-bottom: 1.25rem;
  border-color: #dfdfdf;
}

.home-faq__btn[aria-expanded="true"]:after {
  -webkit-transform: rotate(-180deg);
  transform: rotate(-180deg);
}

.home-faq__content {
  transition: .2s ease;
  height: 0;
  overflow: hidden;
}

.home-faq__content > *:last-child {
  margin-bottom: 0;
}

.home-faq__content > *:first-child {
  margin-top: 0;
}

.home-faq__content p:not([class]) {
}

.entry__group {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -0.625rem;
  margin-bottom: -1.25rem;
}

.entry__card {
  width: 100%;
  padding: 0 0.625rem;
  margin-bottom: 1.25rem;
}

.entry__card-inner {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  background: #fff;
  border-radius: 1.25rem;
  padding: 1.25rem;
  display: block;
}

.entry__card-inner:hover .btn--accent {
}

.entry__card-inner:active .btn--accent {
  color: #fff;
  background: #3478c6;
  border-color: #3478c6;
}

.entry__card-ava {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%);
  transform: translate(-50%);
}

.entry__card-ava--wrap {
  position: relative;
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  margin-bottom: 2rem;
  background-color: #eaeaea;
  background-image: url('../img/icons/no-avatar.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50%;
}

.entry__card-date {
  color: #0098ff;
  font-weight: 700;
  font-size: 1.125rem;
  margin-bottom: 0.5rem;
}

.entry__card-title {
  color: #000;
  font-weight: 700;
  font-size: 1.5rem;
  margin-bottom: 0;
}

.entry__card-text {
  margin: 2rem 0 0;
}

.entry__card-text p:not([class]) {
  margin: 0;
}

.entry__card-quote {
  margin: 2rem 0 0;
}

.entry__card-quote p:not([class]) {
  margin: 0;
}

.entry__card-quote:before {
  content: '«… ';
}

.entry__card-quote:after {
  content: ' …»';
}

.entry__card-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 3.25rem;
}

.partners {
  position: relative;
}

.partners__slider {
  padding-top: 1.25rem;
  transition: .2s ease;
}

.partners .slider-btn-prev {
  top: 6.25rem;
  -webkit-transform: none;
  transform: none;
}

.partners .slider-btn-next {
  top: 6.25rem;
  -webkit-transform: none;
  transform: none;
}

.partners__card {
  min-width: 21.5625rem;
  max-width: 21.5625rem;
  background: #fff;
  border-radius: 1rem;
  padding: 1.25rem;
  min-height: 12.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.partners__card-img--wrap {
  max-width: 70%;
  margin: 0 auto;
}

.contacts__group {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -0.625rem;
  margin-bottom: -1.25rem;
}

.contacts__card {
  width: 100%;
  padding: 0 0.625rem;
  margin-bottom: 1.25rem;
}

.contacts__card-inner {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  background: #fff;
  border-radius: 1.25rem;
  padding: 1.25rem;
  display: block;
}

.contacts__card-title {
  font-size: 1.5rem;
  margin-bottom: 2rem;
}

.contacts__card-list {
  list-style: none;
  padding: 2rem;
  margin: 0;
  border: 0.25rem solid rgba(0, 152, 255, 0.35);
  background: #f0f9ff;
  border-radius: 1.25rem;
}

.contacts__card-item {
  padding: 2rem 0;
  border-bottom: 1px solid #0098ff;
  text-align: left;
}

.contacts__card-item:first-child {
  padding-top: 0;
}

.contacts__card-item:last-child {
  padding-bottom: 0;
  border-bottom: none;
}

.contacts__card-name {
  font-weight: 600;
  font-size: 1.25rem;
  display: inline-flex;
}

.contacts__card-name.-address-:before,.contacts__card-name.-phone-:before,.contacts__card-name.-time-:before {
  content: '';
  width: 1.75rem;
  height: 1.75rem;
  min-width: 1.75rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  margin-right: 0.75rem;
}

.contacts__card-name.-phone-:before {
  background-image: url('../img/icons/contacts-phone.png');
}

.contacts__card-name.-time-:before {
  background-image: url('../img/icons/contacts-time.png');
}

.contacts__card-name.-address-:before {
  background-image: url('../img/icons/contacts-address.png');
}

.contacts__card-text {
  display: block;
  margin: 0.5rem 0 0;
}

.contacts__card-text br {
}

.contacts__card-text[href^="tel:"] {
  white-space: nowrap;
}

.contacts__address-nowrap {
  white-space: nowrap;
}

a.contacts__card-text {
  color: #000;
}

a.contacts__card-text:hover {
}

.contacts__card-link-map {
  margin-left: auto;
  color: #0098ff;
  font-weight: 500;
  font-size: 1.25rem;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
  margin-top: 1.25rem;
  display: inline-flex;
}

.contacts__card-link-map:before {
  content: '';
  width: 1.75rem;
  height: 1.75rem;
  min-width: 1.75rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url('../img/icons/contacts-map.png');
  margin-right: 0.75rem;
}

.contacts__card-link-map:hover {
}

.tariffs__group {
  display: flex;
  flex-wrap: wrap;
  margin-right: -0.75rem;
  margin-left: -0.75rem;
}

.tariffs__card {
  flex: 1 1 26.25rem;
  padding: 0 0.75rem;
  margin-bottom: 2rem;
}

.tariffs__card-inner {
  color: #000;
  border: 0.4375rem solid #fff;
  background: #f8f8f8;
  height: 100%;
  border-radius: 1.25rem;
  padding: 2rem;
  display: flex;
  flex-direction: column;
}

.tariffs__card-head {
  margin-bottom: 1.5rem;
}

.tariffs__card-name {
  font-weight: 500;
  font-size: 2rem;
}

.tariffs__card-price {
  font-weight: 600;
  font-size: 2rem;
  margin: 0.5rem 0 0;
}

.tariffs__card-panel {
  padding: 1.25rem;
  background: #fff;
  border-radius: 1rem;
  color: #000;
  font-weight: 700;
  font-size: 1.5rem;
  margin-bottom: 2rem;
}

.tariffs__card-panel span {
  color: #0098ff;
}

.tariffs__card-list {
  list-style: none;
  padding: 1.5rem;
  margin: 0 0 2.5rem;
  background: #fff;
  border-radius: 1.25rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2rem;
}

.tariffs__card-list-item {
  flex: 1 1 15rem;
  color: #000;
  font-weight: 500;
  font-size: 1rem;
  display: inline-flex;
  align-items: flex-start;
}

.tariffs__card-list-icon {
  min-width: 1.75rem;
  width: 1.75rem;
  margin-right: 0.75rem;
}

.tariffs__card-actions {
  display: flex;
  justify-content: center;
  margin-top: auto;
}

.tariffs__card-actions .btn {
  width: 100%;
  max-width: 28.75rem;
}

.tariffs__card:nth-child(1) .tariffs__card-inner {
  background: linear-gradient(180deg, #83cdff 0%, #6db3e3 100%);
}

.tariffs__card:nth-child(2) .tariffs__card-inner {
  color: #fff;
  background: linear-gradient(180deg, #64abdc 0%, #5c94ba 100%);
}

.tariffs__card:nth-child(3) .tariffs__card-inner {
  background: #f8f8f8;
}

.tariffs__card:nth-child(4) .tariffs__card-inner {
  color: #fff;
  background: linear-gradient(180deg, #2972a5 0%, #2e5e7f 100%);
}

.tariffs__card:nth-child(5) .tariffs__card-inner {
  color: #fff;
  background: linear-gradient(204deg, #0098ff 0%, #226fa4 100%);
}

.footer {
  color: #fff;
  background: #000;
  padding: 1.5rem 0 1rem;
}

.footer__nav {
}

.footer__nav-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer__nav-item {
  width: 100%;
}

.footer__nav-item.is-active .footer__nav-toggle:after {
  -webkit-transform: rotate(-180deg);
  transform: rotate(-180deg);
}

.footer__nav-item.is-active .footer__nav-child-list {
}

.footer__nav-name {
  display: flex;
  align-items: center;
}

.footer__nav-toggle {
  width: 2.625rem;
  height: 4.5rem;
  min-width: 2.625rem;
}

.footer__nav-toggle:after {
  background-image: url('../img/icons/chevron-down-light.svg');
  transition: .2s ease;
}

.footer__nav-link {
  color: #fff;
  font-weight: 500;
  font-size: 1.25rem;
  display: inline-flex;
  align-items: center;
  min-height: 4.5rem;
  width: 100%;
}

.footer__nav-child-list {
  list-style: none;
  padding: 0 0 1.5rem;
  margin: 0.5rem 0 0;
}

.footer__nav-child-item {
  margin-bottom: 1.5rem;
}

.footer__nav-child-item:last-child {
  margin-bottom: 0;
}

.footer__nav-child-link {
  color: #fff;
  font-weight: 400;
  font-size: 1.125rem;
}

.footer__row {
}

.footer__col {
}

.footer__col.-wide- {
}

.footer__col.is-active .footer__col-title:after {
  -webkit-transform: rotate(-180deg);
  transform: rotate(-180deg);
}

.footer__col.is-active .footer__col-content {
}

.footer__col-title {
  font-weight: 500;
  font-size: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.footer__col-title:after {
  content: '';
  width: 2.625rem;
  height: 4.5rem;
  min-width: 2.625rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 24px;
  background-image: url('../img/icons/chevron-down-light.svg');
  transition: .2s ease;
}

.footer__col-content {
  margin-top: 0.5rem;
  padding-bottom: 1.5rem;
}

.footer__col:last-child {
  border: none;
}

.footer__col:last-child .footer__col-content {
  padding-bottom: 0;
}

.footer__social {
  margin: 1rem 0 1.25rem;
}

.footer__textarea > *:last-child {
  margin-bottom: 0;
}

.footer__textarea > *:first-child {
  margin-top: 0;
}

.footer__textarea p {
  color: #fff;
  margin: 1.5rem 0;
}

.footer__textarea ul {
  list-style: none;
  padding: 0;
  margin: 1.5rem 0;
}

.footer__textarea ul li {
  color: #fff;
  font-weight: 400;
  font-size: 1.125rem;
  margin-bottom: 1.5rem;
}

.footer__textarea ul li a {
  color: #fff;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

.footer__textarea ul li a:hover {
}

.footer__textarea ul li:last-child {
  margin-bottom: 0;
}

.footer__logo {
  display: flex;
  align-items: center;
  margin: 0 0 0.25rem;
}

.footer__logo-link {
  display: block;
  min-width: 12.5rem;
  width: 12.5rem;
}

.footer__logo-link img {
  width: 100%;
}

.footer__logo-text {
  color: #0098ff;
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 2.2;
  text-transform: lowercase;
  padding-left: 1rem;
  margin-left: 1rem;
  border-left: 1px solid #0098ff;
}

.footer__phones {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  margin: 1.25rem 0 0;
}

.footer__phones-name {
  color: #fff;
  font-weight: 700;
  font-size: 1.5rem;
  white-space: nowrap;
  margin-bottom: 0.75rem;
}

.footer__phones-caption {
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 1.5;
  margin-top: 0.5rem;
}

.footer__service {
}

.footer__service-list a:not([class]) {
  color: #fff;
  font-weight: 400;
  font-size: 1.125rem;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
  margin-right: 0.625rem;
}

.footer__service-list a:not([class]):hover {
}

.footer__service-list a:not([class]):after {
  content: ',';
  pointer-events: none;
}

.footer__service-list a:not([class]):last-child:after {
  display: none;
}

.footer__service-form {
  margin-top: 2.5rem;
}

.footer__service-input {
  position: relative;
  font-family: var(--font-family);
  color: #000;
  font-weight: 500;
  font-size: 1.25rem;
  line-height: 1.3;
  background: #fff;
  border: 0.0625rem solid #fff;
  border-radius: 0.75rem;
  min-height: 3.5rem;
  padding: 0 1.25rem;
  width: 100%;
  outline: none;
  transition: .2s;
  resize: none;
}

.footer__service-input:focus::-webkit-input-placeholder {
  color: transparent;
}

.footer__service-input:focus::-moz-placeholder {
  color: transparent;
}

.footer__service-input:focus::-ms-input-placeholder {
  color: transparent;
}

.footer__service-input:focus::placeholder {
  color: transparent;
}

.footer__service-input::-webkit-input-placeholder {
  color: rgba(0, 0, 0, 0.2);
}

.footer__service-input::-moz-placeholder {
  color: rgba(0, 0, 0, 0.2);
}

.footer__service-input::-ms-input-placeholder {
  color: rgba(0, 0, 0, 0.2);
}

.footer__service-input::placeholder {
  color: rgba(0, 0, 0, 0.2);
}

.footer__copy {
  text-align: center;
  margin-right: auto;
  margin-left: auto;
  margin-top: 2rem;
  max-width: 12.5rem;
}

.footer__copy p {
  color: #fff;
  font-weight: 500;
  font-size: 0.75rem;
}

@media (min-width: 580px) {
  .container {
    padding: 0 1.5rem;
  }

  .hide-sm-only {
    display: none;
  }

  .header {
    padding: 1.5rem 0;
  }

  .header__menu {
    padding: 1.5rem;
  }

  .header__auth {
    flex-wrap: nowrap;
  }

  .hero {
    margin-right: -1.5rem;
    margin-left: -1.5rem;
    padding-right: 1.5rem;
    padding-left: 1.5rem;
  }

  .feedback {
    margin-right: -1.5rem;
    margin-left: -1.5rem;
  }

  .benefits-feed .slider-btn-prev {
    left: calc(50% - 21.5625rem / 2 - 2.75rem - 2.15rem);
  }

  .benefits-feed .slider-btn-next {
    right: calc(50% - 21.5625rem / 2 - 2.75rem - 2.15rem);
  }

  .benefit-post {
    min-width: 20.25rem;
    max-width: 20.25rem;
  }

  .benefit-post__child {
    margin-top: 1.2rem;
  }



  .client-post__panel {
    max-width: 17.5rem;
  }

  .client-post__play {
    width: 6.25rem;
    height: 6.25rem;
  }

  .client-post__play:before {
    width: 2.5rem;
    height: 2.5rem;
  }

  .partners .slider-btn-prev {
    left: calc(50% - 21.5625rem / 2 - 2.75rem - 2.15rem);
  }

  .partners .slider-btn-next {
    right: calc(50% - 21.5625rem / 2 - 2.75rem - 2.15rem);
  }

  .partners__card {
    min-width: 24.25rem;
    max-width: 24.25rem;
  }

  /* Contacts card values (phone/time/address) are stacked left-aligned
     below their label at every width (see the unscoped .contacts__card-item/
     -name/-text rules above) — this used to switch to a label-left,
     value-right flex row here, which looked fine for the single-line phone
     number but broke badly once time/address could wrap to multiple lines
     (each wrapped line re-centered/right-aligned on its own, with no shared
     left edge). Removed rather than patched, so all fields share one layout. */

  .contacts__card-link-map {
    margin-top: 2.5rem;
  }

  .footer__textarea p {
    margin: 2.5rem 0;
  }

  .footer__textarea ul {
    margin: 2.5rem 0;
  }

  .footer__textarea ul li {
    font-size: 1.25rem;
  }

  .footer__logo-link {
    min-width: 16.4375rem;
    width: 16.4375rem;
  }

  .footer__logo-text {
    font-size: 1.25rem;
    padding-left: 1.5rem;
    margin-left: 1.5rem;
  }

  .footer__service-list a:not([class]) {
    font-size: 1.25rem;
  }
}

@media (min-width: 768px) {
  html {
    font-size: 1vw;
  }

  .h1,h1 {
    font-size: 3rem;
  }

  .h2,h2 {
    font-size: 2rem;
  }

  .h3,h3 {
    font-size: 1.5rem;
  }

  .hide-md-up {
    display: none;
  }

  .section__head {
    margin-bottom: 3.25rem;
  }

  .section__title {
    text-align: center;
  }

  .social__link:before {
    width: 4rem;
    height: 4rem;
    min-width: 4rem;
  }

  .pagination {
    justify-content: flex-end;
  }

  .header {
    border-radius: 1rem;
  }

  .header__row {
    flex-wrap: nowrap;
  }

  .header__panel {
    margin-left: 1.25rem;
  }

  .header__panel-title {
    margin-right: 2rem;
  }

  .header__city-btn {
    padding: 0 4rem 0 2.5rem;
  }

  .header__city-btn:after {
    right: 2rem;
  }

  .header__city-menu {
    left: 0;
    padding: 1.25rem 2.5rem 0;
  }

  .header__city-list {
    margin: 0 -2.4375rem 0 0;
  }

  .hero {
    margin: 0;
    padding: 0;
  }

  .hero__row {
    display: flex;
    align-items: center;
  }

  .hero__aside {
    min-width: 41.625rem;
    max-width: 41.625rem;
    margin: 0 0 0 2rem;
  }

  .hero__info {
    border-radius: 2rem;
    padding: 3.75rem;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.24),0 1px 3px 0 rgba(0, 0, 0, 0.12);
    background: #fff;
  }

  .hero__title {
    margin-bottom: 1.25rem;
  }

  .feedback {
    display: flex;
    max-width: 85rem;
    margin-right: auto;
    margin-left: auto;
  }

  .feedback__aside {
    min-width: 32.75rem;
    max-width: 32.75rem;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.24),0 1px 3px 0 rgba(0, 0, 0, 0.12);
    background: #0098ff;
    margin-left: 5.375rem;
    padding: 2.5rem;
    border-radius: 2rem;
    overflow: hidden;
  }

  .feedback__title {
    color: #000;
  }

  .service.service--home .service-post {
    min-height: 12.5rem;
  }

  .service-tabs {
    margin-bottom: 4rem;
  }

  .service-tabs__list {
    display: flex;
    flex-wrap: nowrap;
    border-radius: 1rem;
    overflow: hidden;
  }

  .service-tabs__item {
    margin: 0;
  }

  .service-tabs__btn {
    border-radius: 0;
  }

  .service-feed {
    gap: 2rem;
  }

  .service-post {
    width: calc(50% - 1rem);
    min-height: 8.25rem;
  }

  .benefits-feed .slider-btn-prev {
    left: calc(50% - 21.5625rem / 2 - 2.75rem * 2);
  }

  .benefits-feed .slider-btn-next {
    right: calc(50% - 21.5625rem / 2 - 2.75rem * 2);
  }

  .benefit-post:before {
    top: -1.25rem;
    right: -1.25rem;
    bottom: -1.25rem;
    left: -1.25rem;
    border-radius: 2rem 2rem 0 0;
  }

  .benefit-post__child {
    padding: 0 2.5rem;
  }

  .benefit-post__child-list {
    gap: 1rem;
    border-radius: 1.5rem;
    padding: 1.5rem;
  }

  .sms-calc {
    display: flex;
    align-items: center;
    max-width: 85rem;
    margin: 0 auto;
  }

  .sms-calc__info {
    min-width: 26.25rem;
    width: 26.25rem;
    margin-right: 8.25rem;
  }

  .sms-calc__text {
    margin: 1.25rem 0 0;
  }

  .sms-calc__main {
    background: #fff;
    border-radius: 2rem;
    padding: 2.25rem 3.25rem;
    gap: 2rem;
    margin: 0;
  }

  .sms-calc__headline {
    font-size: 1.5rem;
  }

  .sms-calc__field {
    flex: 1 1 15rem;
  }

  .sms-calc__slider-input::-webkit-slider-thumb {
    background: #fff;
    border: 0.75rem solid #0098ff;
  }

  .sms-calc__slider-input::-moz-range-thumb {
    background: #fff;
    border: 0.75rem solid #0098ff;
  }

  .sms-calc__slider-original {
    color: #000;
  }

  .client-post__quote {
    font-size: 1.25rem;
  }

  .home-faq__item {
    border-radius: 0.75rem;
    margin-bottom: 0.75rem;
  }

  .entry__card {
    width: 50%;
  }

  .partners {
    margin-bottom: 3.25rem;
  }

  .partners .slider-btn-prev {
    left: calc(50% - 21.5625rem / 2 - 3.25rem * 2);
  }

  .partners .slider-btn-next {
    right: calc(50% - 21.5625rem / 2 - 3.25rem * 2);
  }

  .contacts__card {
    width: 50%;
  }

  .tariffs__group {
    margin-right: -1rem;
    margin-left: -1rem;
  }

  .tariffs__card {
    padding: 0 1rem;
  }

  .tariffs__card-head {
    display: flex;
    justify-content: space-between;
  }

  .tariffs__card-price {
    text-align: right;
    margin: 0 0 0 1.25rem;
  }

  .footer {
    padding: 6.25rem 0 3rem;
  }

  .footer__nav {
    margin-bottom: 4rem;
  }

  .footer__nav-list {
    margin: 0 -1rem;
    display: flex;
    flex-wrap: nowrap;
  }

  .footer__nav-item {
    padding: 0 1rem;
  }

  .footer__nav-toggle {
    display: none;
  }

  .footer__nav-link {
    font-size: 1.5rem;
    min-height: 0.0625rem;
    width: auto;
  }

  .footer__nav-child-list {
    padding: 0;
    margin: 2.5rem 0 0;
  }

  .footer__nav-child-item {
    margin-bottom: 1.25rem;
  }

  .footer__nav-child-link {
    font-size: 1.25rem;
  }

  .footer__row {
    display: flex;
    justify-content: space-between;
  }

  .footer__col {
    width: 24%;
  }

  .footer__col.-wide- {
    width: 33.3%;
  }

  .footer__col-title {
    font-size: 1.5rem;
    margin-bottom: 2.5rem;
  }

  .footer__col-title:after {
    display: none;
  }

  .footer__col-content {
    margin-top: 0;
    padding-bottom: 0;
  }

  .footer__logo {
    margin: 1.25rem 0 0;
  }

  .footer__phones-name {
    font-size: 2rem;
  }

  .footer__phones-caption {
    font-size: 1.25rem;
  }

  .footer__service {
    margin-top: -1.25rem;
  }

  .footer__copy {
    margin-top: 5rem;
  }
}

@media (min-width: 1024px) {
  .link:hover,a:hover {
    color: #0098ff;
  }

  html {
    font-size: .85vw;
  }

  .text-lg-center {
    text-align: center;
  }

  .container {
    padding: 0 2.5rem;
  }

  .btn:hover:not(.btn--reset) {
    color: #fff;
    background: #5aabf8;
    border-color: #5aabf8;
  }

  .btn:active:not(.btn--reset) {
    color: #fff;
    background: #3478c6;
    border-color: #3478c6;
  }

  .hide-lg-up {
    display: none;
  }

  .form__agree a:not([class]):hover {
    -webkit-text-decoration-color: transparent;
    text-decoration-color: transparent;
  }

  .slider-pagination {
    margin-top: 2.5rem;
  }

  .slider-btn-next:hover,.slider-btn-prev:hover {
    box-shadow: none;
    background: #5aabf8;
  }

  .slider-btn-next:hover:before,.slider-btn-prev:hover:before {
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
  }

  .slider-btn-next:active,.slider-btn-prev:active {
    box-shadow: none;
    background: #3478c6;
  }

  .slider-btn-next:active:before,.slider-btn-prev:active:before {
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
  }

  .section-bg-triangle.-pos-bottom-left- {
    left: calc((100vw - 107.5rem + 5rem) / 2 * -1);
  }

  .section-bg-triangle.-pos-bottom-right- {
    right: calc((100vw - 107.5rem + 3rem) / 2 * -1);
    right: calc((100vw - 107.5rem + 5rem) / 2 * -1);
  }

  .section-bg-triangle.-pos-top-right- {
    right: calc((100vw - 107.5rem + 3rem) / 2 * -1);
    right: calc((100vw - 107.5rem + 5rem) / 2 * -1);
  }

  .social__link:hover {
    opacity: .7;
  }

  .social__link:active {
    opacity: .5;
  }

  a.pagination__link:hover {
    color: #fff;
    background: rgb(90, 171, 248);
  }

  .header {
    padding: 2rem 0;
    margin: 0.75rem;
  }

  .header__row {
    justify-content: space-between;
  }

  /* Was margin-right:auto on .header__logo, which pushed EVERYTHING after
     it (city selector + phones + messenger icons) into one cluster on the
     far right, leaving "Город" drifting away from the logo on wide
     headers. Moving the auto-margin onto the city panel instead keeps
     logo+city together on the left, with contacts/messengers on the right.
     .header__panel is shared by both the city selector and the contacts
     block - :not(.hide-lg-down) is what the contacts block always carries
     (the city panel never does), so this targets only the city panel. */
  .header__panel:not(.hide-lg-down) {
    margin-right: auto;
  }

  .header__contacts-messanger:hover,.header__contacts-phone:hover {
    color: #0098ff;
    border-color: #0098ff;
  }

  .header__menu {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    margin-top: 1rem;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.24),0 1px 3px 0 rgba(0, 0, 0, 0.12);
    border: 0.0625rem solid #f3f3f3;
    border-radius: 0.75rem;
    padding: 1rem;
    position: sticky;
    top: 0.75rem;
  }

  .header__nav {
    padding: 0 1.5rem;
  }

  .header__nav-list {
    display: flex;
  }

  .header__nav-item {
    margin: 0 4rem 0 0;
    border-bottom: none;
  }

  .header__nav-item:hover .header__nav-name {
    position: relative;
    z-index: 2;
  }

  .header__nav-item:hover .header__nav-toggle:after {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
  }

  .header__nav-item:hover .header__nav-child-list {
    display: flex;
    -webkit-animation: fadeIn .2s forwards;
    animation: fadeIn .2s forwards;
  }

  .header__nav-toggle {
    margin-left: 0.5rem;
  }

  .header__nav-link {
    font-weight: 500;
    min-height: 0.0625rem;
    width: auto;
  }

  .header__nav-child-list {
    padding: 3.75rem 2.5rem 2.5rem;
    margin: 0;
    position: absolute;
    top: -0.75rem;
    left: -2.5rem;
    width: 45.75rem;
    border: 0.0625rem solid #f3f3f3;
    border-radius: 0.75rem;
    box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.24),0 1px 3px 0 rgba(0, 0, 0, 0.12);
    background: #fff;
    z-index: 1;
    flex-wrap: wrap;
    gap: 0.75rem;
  }

  .header__nav-child-item {
    width: calc(50% - 0.375rem);
    margin-bottom: 0;
  }

  .header__nav-child-link {
    display: inline-flex;
    align-items: center;
    padding: 0 1.25rem;
    border: 0.0625rem solid #f5f5f5;
    border-radius: 0.75rem;
    min-height: 3.25rem;
    width: 100%;
  }

  .header__nav-child-link:hover {
    color: #000;
    border-color: #33adff;
  }

  .header__auth {
    margin-bottom: 0;
  }

  .header__auth .btn {
    width: auto;
  }

  .header__burger {
    display: none;
  }

  .header__city-link:hover {
    color: #000;
    border-color: #33adff;
  }

  .service-post:hover {
    -webkit-transform: scaleY(1.05);
    transform: scaleY(1.05);
  }

  .benefit-post__child-list {
    border-radius: 2rem;
    padding: 2.5rem;
  }



  .client-post__img--wrap[data-sub-html]:hover .client-post__play {
    background: rgba(230, 230, 230, .4);
  }

  .client-post__img--wrap[data-sub-html]:active .client-post__play {
    background: rgba(230, 230, 230, .5);
  }

  .client-post__info {
    padding: 2rem 2.5rem 3.25rem;
  }

  .client-post__post {
    margin-bottom: 2rem;
  }

  .client-post__actions {
    margin-top: 2rem;
  }

  .client-post__play {
    width: 8rem;
    height: 8rem;
  }

  .client-post__play:before {
    width: 3rem;
    height: 3rem;
  }

  .entry__group {
    margin-right: -1rem;
    margin-left: -1rem;
    margin-bottom: -2rem;
  }

  .entry__card {
    padding: 0 1rem;
    margin-bottom: 2rem;
  }

  .entry__card-inner {
    padding: 1.75rem;
  }

  .entry__card-inner:hover .btn--accent {
    color: #fff;
    background: #5aabf8;
    border-color: #5aabf8;
  }

  .entry__card-inner:active .btn--accent {
    color: #fff;
    background: #3478c6;
    border-color: #3478c6;
  }

  .contacts__group {
    margin-right: -1rem;
    margin-left: -1rem;
    margin-bottom: -2rem;
  }

  .contacts__card {
    padding: 0 1rem;
    margin-bottom: 2rem;
  }

  .contacts__card-inner {
    padding: 1.75rem;
  }

  a.contacts__card-text:hover {
    color: #0098ff;
  }

  .contacts__card-link-map:hover {
    -webkit-text-decoration-color: transparent;
    text-decoration-color: transparent;
  }

  .footer__textarea ul li a:hover {
    color: #0098ff;
    -webkit-text-decoration-color: transparent;
    text-decoration-color: transparent;
  }

  .footer__service-list a:not([class]):hover {
    color: #0098ff;
    -webkit-text-decoration-color: transparent;
    text-decoration-color: transparent;
  }
}

@media (min-width: 1260px) {
  .hide-xl-only {
    display: none;
  }

  .entry__card {
    width: 33.3%;
  }

  .contacts__card {
    width: 33.3%;
  }
}

@media (min-width: 1640px) {
  html {
    font-size: 14px;
  }

  .benefit-post {
    min-width: 24.25rem;
    max-width: 24.25rem;
  }
}

@media (min-width: 1920px) {
  .container {
    max-width: 94.5rem;
  }
}


@media (min-width: 2000px) {
  html {
    /* font-size: 0.85vw; */
  }
}



@media (max-width: 1259px) {
  .hide-xl-down {
    display: none;
  }
}

@media (max-width: 1023px) {
  .hide-lg-down {
    display: none;
  }

  .header__menu {
    position: fixed;
    top: 6.875rem;
    left: 0;
    width: 100%;
    height: calc(100% - 6.875rem);
    z-index: 99;
    overflow: auto;
  }

  .header__nav-item--active .header__nav-child-list {
    display: block;
    -webkit-animation: fadeIn .2s forwards;
    animation: fadeIn .2s forwards;
  }

  .header__nav-item--active .header__nav-toggle:after {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
  }

  .header__nav-toggle {
    width: 4.5rem;
    height: 4.5rem;
  }

  .header-mobile-menu .header__menu {
    display: block;
    -webkit-animation: fadeIn .2s forwards;
    animation: fadeIn .2s forwards;
  }
}

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

  .section:first-child {
    margin-top: 0;
  }

  .section-bg-triangle {
    display: none;
  }

  .header__logo {
    width: 100%;
    order: 3;
    margin: 1.25rem 0 0;
  }

  .hero {
    background: #fff;
  }

  .hero__actions .btn {
    width: 100%;
  }

  .feedback {
    background: #0098ff;
    padding: 1.875rem 1.5rem;
  }

  .feedback__aside:after,.feedback__aside:before {
    display: none;
  }

  .feedback__img--wrap {
    display: none;
  }

  .feedback__form .form__send {
    width: 100%;
  }

  .service.service--home .service-tabs {
    border-color: #fff;
  }

  .service.service--home .service-tabs__item--active .service-tabs__btn {
    color: #0098ff;
    background: #fff;
    border-color: #fff;
  }

  .service.service--home .service-tabs__btn {
    color: #fff;
    background: transparent;
    border-radius: 0.75rem;
    border: 0.0625rem solid #fff;
  }

  .service.service--home .service-tabs__btn:active:not(.btn--reset) {
    color: #0098ff;
    background: #fff;
    border-color: #fff;
  }

  .service-tabs {
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #000;
  }

  .sms-calc__headline.text-center {
    color: #fff;
    font-weight: 500;
    font-size: 1.25rem;
    text-align: left;
  }

  .sms-calc__send {
    width: 100%;
    color: #000;
    background: #fff;
    border: 0.0625rem solid #fff;
  }

  .home-faq__content p:not([class]) {
    font-size: 1.125rem;
  }

  .footer__nav-item {
    border-bottom: 1px solid #a1a1a1;
  }

  .footer__nav-item.is-active .footer__nav-child-list {
    display: block;
    -webkit-animation: fadeIn .2s forwards;
    animation: fadeIn .2s forwards;
  }

  .footer__nav-child-list {
    display: none;
  }

  .footer__col {
    border-bottom: 1px solid #a1a1a1;
  }

  .footer__col.is-active .footer__col-content {
    display: block;
    -webkit-animation: fadeIn .2s forwards;
    animation: fadeIn .2s forwards;
  }

  .footer__col-content {
    display: none;
  }
}

@media (max-width: 579px) {
  .hide-sm-down {
    display: none;
  }

  .header__menu {
    top: 6.25rem;
    height: calc(100% - 6.25rem);
  }

  .header__city {
    max-width: calc(100vw - 8.625rem - 4.5rem);
  }

  .contacts__card-text br {
    display: none;
  }

  .footer__textarea p {
    font-size: 1.125rem;
  }
}

/* Partners slider: Swiper controls slide widths at every breakpoint. */
.section--partners {
  min-height: 0;
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

.section--partners .section__head {
  margin-bottom: 1.875rem;
}

.section--partners .partners__slider {
  width: calc(100% - 180px);
  max-width: 1700px;
  margin: 0 auto;
  padding-top: 0;
  overflow: hidden;
}

.section--partners .partners__card {
  min-width: 0 !important;
  max-width: none !important;
  min-height: 6.875rem;
  height: auto;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
}

.section--partners .partners__card-img--wrap {
  width: 100%;
  max-width: 100%;
  height: 5.625rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
}

.section--partners .partners__card-img {
  width: auto;
  max-width: 100%;
  max-height: 5.625rem;
  object-fit: contain;
}

.section--partners .slider-pagination {
  margin-top: 1.25rem;
}

.section--partners .slider-nav {
  position: absolute;
  top: 3.4375rem;
  left: 0;
  right: 0;
  width: 100%;
  height: 0;
  margin: 0;
  z-index: 10;
  pointer-events: none;
}

.section--partners .slider-btn-prev,
.section--partners .slider-btn-next {
  top: 0;
  margin: 0;
  pointer-events: auto;
}

.section--partners .slider-btn-prev {
  left: 1.25rem;
}

.section--partners .slider-btn-next {
  right: 1.25rem;
}

.section--partners .section__footer {
  margin-top: 1.875rem;
}

@media (max-width: 575px) {
  .section--partners {
    padding-top: 1.875rem;
    padding-bottom: 1.875rem;
  }

  .section--partners .section__head {
    margin-bottom: 1.25rem;
  }

  .section--partners .partners__slider {
    width: calc(100% - 5.625rem);
  }

  .section--partners .partners__card {
    min-height: 6.25rem;
  }

  .section--partners .slider-nav {
    top: 3.125rem;
  }

  .section--partners .slider-btn-prev {
    left: 0.3125rem;
  }

  .section--partners .slider-btn-next {
    right: 0.3125rem;
  }

  .section--partners .section__footer {
    margin-top: 1.25rem;
  }
}

@media (max-width: 767px) {
  .table-responsive {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x;
  }
  .table-responsive th img {
    object-fit: contain;
  }
}

.table-responsive {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Способы оплаты: restored payment logos (footer) */
.footer__payment {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0 0 1.25rem;
  padding: 0;
  max-width: 100%;
}

.footer__payment-item {
  flex: 0 0 33.333%;
  max-width: 33.333%;
  padding: 0.3rem;
  box-sizing: border-box;
}

.footer__payment-img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
}

@media (max-width: 575px) {
  .footer__payment-item {
    flex: 0 0 33.333%;
    max-width: 33.333%;
    padding: 0.2rem;
  }
}


/* Кейсы клиентов / Видеоотзывы: восстановление позиционирования стрелок навигации
   (.clients-feed не имел position:relative — стрелки .slider-btn-prev/-next
   позиционировались абсолютно относительно случайного дальнего предка) */
.clients-feed {
  position: relative;
}

/* Широкие экраны (2K+): контейнер сайта зафиксирован на 94.5rem даже на очень
   широких экранах, из-за чего оставались пустые поля. Точечно расширяем именно
   блок карточек (не общий .container) и показываем 5 карточек вместо 3.
   ВАЖНО: width:100vw + max-width:Npx + margin:calc(50%-50vw) НЕ центрирует —
   margin-left в такой формуле всегда прижимает левый край к 0, а max-width
   обрезает только правую сторону (проверено Playwright: было rect.left=0,
   right=2000 на viewport 2560 — блок был прижат влево). Верная схема: внешняя
   обёртка .clients-feed делает настоящий edge-to-edge 100vw bleed (без
   max-width на ней самой), а внутренние .clients-feed__slider и .slider-nav
   получают max-width + margin:auto и центрируются уже относительно этого
   viewport-wide родителя. */
@media (min-width: 2100px) {
  .clients-feed {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
  }

  /* width:100% (not the default/inherited auto) is required here — CSS only
     distributes auto margins to center a box when its own width is a
     definite value; with width:auto the auto margins simply resolve to 0
     and nothing centers. .slider-full already sets width:auto with equal
     selector specificity, so this rule must repeat that class to win by
     source order. */
  .clients-feed__slider.slider-full {
    width: 100%;
    max-width: 2000px;
    margin-left: auto;
    margin-right: auto;
  }

  /* .slider-nav must stretch to the FULL height of .clients-feed (top:0;
     bottom:0), not just wrap its (absolutely positioned, height-0) button
     children — otherwise it collapses to zero height at the pagination row's
     Y position and the buttons' top:50% ends up landing ON TOP of the
     pagination dots instead of centered on the card row (found via
     Playwright: arrow rect overlapped pagination rect at 2560px). Centering
     an absolutely positioned box at a fixed width uses left:0;right:0 +
     width + margin:auto (over-constrained resolution), not a plain block
     margin:auto. pointer-events:none/auto keeps the (now full-height,
     full-width-capped) overlay from blocking clicks on the cards under it. */
  .clients-feed .slider-nav {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 2000px;
    max-width: 100%;
    margin: 0 auto;
    pointer-events: none;
  }

  .clients-feed .slider-nav > * {
    pointer-events: auto;
  }
}

/* === "Кейсы клиентов" / "Видео отзывы": normal-sized, clearly visible side
   arrows, positioned outside the card group instead of overlapping the
   first/last card, centered on the card row (not the row+pagination). ===
   Scoped to .clients-feed only — partners/benefits-feed sliders use the
   shared .slider-btn-* base rule and are intentionally left untouched. */
.clients-feed .slider-btn-prev,
.clients-feed .slider-btn-next {
  width: 44px;
  height: 44px;
  border: 2px solid #0098ff;
  background: #fff;
  /* previously top:50% centered on the WHOLE .clients-feed box, which also
     includes the pagination row below the cards, so the arrow ended up
     ~15-20px lower than the true card-row center (measured with Playwright:
     cardVerticalCenter vs the arrow's own center). Shifting up compensates. */
  margin-top: -15px;
}

.clients-feed .slider-btn-prev:hover,
.clients-feed .slider-btn-next:hover {
  background: #0098ff;
  cursor: pointer;
}

.clients-feed .slider-btn-prev:hover:before,
.clients-feed .slider-btn-next:hover:before {
  -webkit-filter: brightness(0) invert(1);
  filter: brightness(0) invert(1);
}

/* Disabled ("nothing more to page to") must look visibly disabled, not just
   silently stop working — dimmed + default cursor, but still shown (never
   display:none) so users understand navigation exists. */
.clients-feed .slider-btn-prev.swiper-button-lock,
.clients-feed .slider-btn-next.swiper-button-lock {
  display: none;
}

@media (min-width: 1024px) {
  /* Below 1024px there isn't enough side margin around the card group
     (as little as ~11px) to push a 44px button further out without it
     running off the edge of the viewport — measured leftGap/rightGap at
     768px and 390px is only ~11px, so this is desktop-only. From 1366px up
     the measured gap is 88px+, comfortably enough for a 44px button plus a
     28px breathing gap outside the first/last card (88 > 44+28=72). */
  .clients-feed .slider-btn-prev {
    left: -72px;
  }

  .clients-feed .slider-btn-next {
    right: -72px;
  }
}


/* ==========================================================================
   HOMEPAGE-ONLY WIDE LAYOUT: on 2K/4K, scale the ENTIRE main page width
   (header, hero, free-access, Наши услуги, преимущества, тарифы,
   калькулятор, кейсы/отзывы, FAQ, новости, партнёры, footer), not just the
   header. Gated by body.home-page (set only for "/" in header.php), so
   /services/, /prices/ and every other page keep the untouched shared
   .container rule above.

   NO width:100vw / negative 50vw margins anywhere here. Most sections below
   (hero, "Наши услуги", "Наши преимущества", the tariffs table, "Актуальные
   новости", partners) have no max-width of their own - they simply fill
   whatever their ambient parent gives them, so widening that one shared
   ambient wrapper (.page-container.container, opened in header.php /
   closed in footer.php) is enough to widen all of them together. A few
   sections DO have their own independent max-width (feedback, sms-calc,
   home-faq, the tariffs section's own nested .container) and need their own
   .home-page override alongside it. header__container / footer__container
   sit outside that ambient wrapper as their own boxes and already/also get
   an explicit override.

   .clients-feed (Кейсы клиентов / Видео отзывы) is intentionally left as-is
   - it already has its own considered wide-screen behavior (a documented
   width:100vw breakout + a 2000px inner cap starting at 2100px, added
   separately to show 5 cards instead of 3), so it isn't touched here to
   avoid conflicting with that existing, already-wide design. */
@media (min-width: 1920px) {
  /* --- boxes outside the ambient .page-container.container --- */
  .home-page .header__container,
  .home-page .footer__container {
    max-width: clamp(107.5rem, 83vw, 160rem);
  }

  /* --- the shared ambient wrapper itself: widening this alone carries
     hero, "Наши услуги", "Наши преимущества", "Актуальные новости" and
     "партнёры" along with it, since none of them have their own cap --- */
  .home-page .page-container.container {
    max-width: clamp(107.5rem, 83vw, 160rem);
  }

  /* the tariffs section's own nested <div class="container"> (a second,
     independent .container inside .section, not page-container) */
  .home-page .section > .container {
    max-width: clamp(107.5rem, 83vw, 160rem);
  }

  /* --- sections with their own independent max-width --- */
  .home-page .feedback,
  .home-page .sms-calc {
    max-width: clamp(107.5rem, 83vw, 160rem);
  }

  /* FAQ intentionally widens less aggressively than the rest - an
     accordion of question/answer text becomes hard to read as a very long
     line, so this keeps it comfortably wider without matching full page
     width. */
  .home-page .home-faq {
    max-width: clamp(67.75rem, 45vw, 100rem);
  }

  /* --- hero proportions (same 58/40 split proven out earlier) --- */
  .home-page .hero__main {
    flex: 0 1 58%;
    min-width: 0;
  }

  .home-page .hero__aside {
    flex: 0 1 40%;
    max-width: 40%;
    min-width: 0;
  }

  .home-page .hero__text {
    max-width: 37.5rem;
  }

  /* --- free-access proportions, mirroring hero --- */
  .home-page .feedback__main {
    flex: 0 1 58%;
    min-width: 0;
  }

  /* Matches .hero__aside's own flex:0 1 40%/max-width:40% exactly (not its
     own independent 36rem cap as before) so item 2 (video) and item 4
     (form card) share the same left edge, width and right edge - the
     "2x2 grid" client request needs both right-column items to line up as
     one column, not two differently-sized boxes. */
  .home-page .feedback__aside {
    flex: 0 1 40%;
    max-width: 40%;
    min-width: 0;
  }

  /* The card itself now matches the video's width (up to ~868px content
     area on 4K), but a flat max-width:28rem (392px) pinned the form to a
     fixed width regardless - fine on 1920 where the card is narrower than
     that, but on 2560/3840 it left a growing empty gap on the right
     (measured: 182px at 1920, up to 441px at 3840) since the form never
     grew and was never centered. width:100% lets it fill the available
     card content width up to a wider cap, and margin:auto centers it so
     any leftover space split evenly left/right instead of only appearing
     on the right - inputs get noticeably wider without becoming absurd
     full-bleed bars, and the left/right inner gaps stay visually equal at
     every width. */
  .home-page .feedback__form {
    width: 100%;
    max-width: 44rem;
    margin-left: auto;
    margin-right: auto;
  }

  /* feedback__aside's own base rule uses margin-left:5.375rem (75px),
     while hero__aside uses margin:0 0 0 2rem (28px) - two different
     column-gaps for what should read as the same 2x2 grid. Matching it to
     hero__aside's exact gap is what item 1<->2 and item 3<->4 need to look
     like one consistent grid rather than two separately-spaced rows. */
  .home-page .feedback__aside {
    margin-left: 2rem;
  }

  /* .hero__row defaulted to align-items:center, which vertically centers
     the text card against the video instead of lining up their top edges -
     since the two have different heights depending on viewport, "top
     line" between item 1 and item 2 wasn't consistent. flex-start pins
     both to the same top line, which is what a real 2x2 grid needs for
     row 1. */
  .home-page .hero__row {
    align-items: flex-start;
  }

  /* Consecutive .section elements normally collapse to a 3.75rem gap
     between them (each contributes margin-top/bottom:3.75rem) - almost
     double the 2rem column-gap between hero__main and hero__aside, which
     is why row 1 and row 2 read as two disconnected blocks instead of one
     2x2 grid. Pulling .feedback up by the difference (3.75rem - 2rem)
     makes the row-gap match the column-gap.

     align-items was left at its default (stretch) here, which force-grew
     .feedback__aside (the blue card) to match .feedback__main's taller
     natural height (the heading + illustration column) - the card's own
     text+form only filled a fraction of that, leaving a huge empty blue
     area below the submit button. flex-start makes both columns use their
     own natural content height instead, while still starting item 3 and
     item 4 on the same top line (cross-axis start, not stretch). */
  .home-page .feedback {
    margin-top: -1.75rem;
    align-items: flex-start;
  }

  /* --- calculator: .sms-calc__main (the white card) had no flex-grow of
     its own, so widening .sms-calc alone would have just left empty space
     after the card instead of the card itself growing. .sms-calc__info
     (the label text) intentionally keeps its original fixed width. --- */
  .home-page .sms-calc__main {
    flex: 1;
    min-width: 0;
  }

  /* Decorative background triangles (z-index:-1, purely cosmetic) use a
     desktop rule elsewhere in this file that positions them with
     calc((100vw - 107.5rem ...) / 2 * -1) - a formula hardcoded to assume
     the shared .container's original width. Widening the homepage's
     ambient container above makes that formula push the triangles far
     past the edge of the viewport, which was producing real horizontal
     page overflow (verified: a 2560px viewport measured a 2870px
     scrollWidth, exactly matching this triangle's overflow). Since these
     are just cosmetic bleed, the safe fix on the homepage is to keep them
     hugging the section edge instead of trying to re-derive the formula
     for a container width that now varies by viewport. */
  .home-page .section-bg-triangle.-pos-bottom-left- {
    left: -1.5rem;
  }

  .home-page .section-bg-triangle.-pos-bottom-right- {
    right: -1.5rem;
  }

  .home-page .section-bg-triangle.-pos-top-right- {
    right: -1.5rem;
  }
}