@charset "UTF-8";

@font-face {
  font-family: "Mulish";
  font-weight: 500;
  src: url(./../fonts/Mulish-Medium.woff2);
}

@font-face {
  font-family: "Mulish";
  font-weight: 400;
  src: url(./../fonts/Mulish-Regular.woff2);
}

@font-face {
  font-family: "Roboto";
  font-weight: 500;
  src: url(./../fonts/Roboto-Medium.woff2);
}

@font-face {
  font-family: "Roboto";
  font-weight: 700;
  src: url(./../fonts/Roboto-Bold.woff2);
}

:root {
  --red: #bf131b;
  --red80: #e81c23;
  --red60: #ea2e25;
  --red50: #c4262d;
  --red40: #f26e52;
  --redlight: #ffd8d9;
  --graylight: #f8f8f8;
  --white: #ffffff;
  --gray: #727171;
  --black: #000000;
}

* {
  margin: 0;
  border: 0;
  padding: 0;
  margin-block: 0;
}

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

::-webkit-scrollbar {
  width: 6px;
  height: 4px;
  background-color: #ffffff;
}

::-webkit-scrollbar-thumb {
  border-radius: 100px;
  background: linear-gradient(158.59deg,
      var(--red) -4.35%,
      var(--red80) 27.49%,
      var(--red60) 62.02%,
      var(--red40) 99.25%);
}

html,
body {
  background-color: var(--white);
  height: 100%;
  width: 100%;
  font-size: 10px;
  -ms-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  font-family: "Mulish", sans-serif;
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0em;
  line-height: 10px;
  cursor: default;
  position: relative;
  scroll-behavior: smooth;
}

:focus,
:active {
  outline: none;
}

a,
a:focus,
a:active {
  outline: none;
  text-decoration: none;
}

nav,
footer,
header,
aside {
  display: block;
}

.none {
  display: none;
}

input,
button,
textarea {
  font-family: inherit;
  line-height: inherit;
  font-size: 10px;
  background-color: inherit;
}

input::-ms-clear {
  display: none;
}

input[type="checkbox"] {
  display: none;
}

label {
  color: #000;
  cursor: default;
  vertical-align: middle;
  min-width: 18px;
  height: 18px;
  position: relative;
  text-align: center;
  text-indent: 0px;
  display: inline-block;
  background: #fff;
  border: 1px solid var(--black);
  border-image: initial;
  border-radius: 2px;
}

/* формируем внешний вид чекбокса в псевдоэлементе before */
/* вариации внешнего вида в зав-ти от статуса checkbox */
/* checked */
label.form-after-text:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80%;
  height: 70%;
  -webkit-clip-path: polygon(45% 64%, 84% 14%, 100% 28%, 47% 100%, 0 49%, 15% 32%);
  clip-path: polygon(45% 64%, 84% 14%, 100% 28%, 47% 100%, 0 49%, 15% 32%);
  -webkit-transform: translate(-50%, -50%) scale(0);
  transform: translate(-50%, -50%) scale(0);
  -webkit-transition: transform 0.3s;
  transition: transform 0.3s;
}

input[type="checkbox"]:checked+label:before {
  background: var(--white);
  -webkit-transform: scale(1);
  transform: translate(-50%, -50%) scale(1);
}

input[type="checkbox"]:checked+label {
  background: var(--red);
  border: 1px solid transparent;
}

/* disabled */
button {
  cursor: pointer;
  font-weight: 500;
  font-size: 14px;
  display: flex;
  gap: 8px;
  justify-content: center;
  text-align: center;
  align-items: center;
  border-radius: 100px;
  line-height: 1.42;
  transition: all ease 0.3s;
  height: fit-content;
  width: fit-content;
}

button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

ul li {
  list-style: none;
  text-decoration: none;
}

img {
  vertical-align: middle;
}

.title-main {
  font-family: "Roboto", sans-serif;
  line-height: 1.15;
  font-weight: 700;
  font-size: 45px;
  color: var(--black);
}

.title-main span {
  color: var(--red);
}

.title-submain {
  font-family: "Roboto", sans-serif;
  line-height: 1.22;
  font-weight: 500;
  font-size: 36px;
  color: var(--black);
  text-align: center;
}

.title-submain.text-28 {
  font-size: 28px;
}

.title-submain.text-22 {
  font-size: 22px;
}

.title-submain span {
  color: var(--red);
}

.left {
  text-align: left;
}

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

.title-mb-40 {
  margin-bottom: 40px;
}

.text-57 {
  font-size: 57px;
  line-height: 1.12;
}

.text-36 {
  font-size: 36px;
  line-height: 1.25;
}

.text-32 {
  font-size: 32px;
  line-height: 1.25;
}

.text-28 {
  font-size: 28px;
  line-height: 1.3;
}

.text-24 {
  font-size: 24px;
  line-height: 1.33;
}

.text-22 {
  font-size: 22px;
  line-height: 1.3;
}

.text-16 {
  font-size: 16px;
  line-height: 1.5;
}

.text-14 {
  font-size: 14px;
  line-height: 1.42;
}

.text-12 {
  font-size: 12px;
  line-height: 1.33;
}

.text-11 {
  font-size: 11px;
  line-height: 1.45;
}

.Black {
  color: var(--black);
}

.White {
  color: var(--white) !important;
}

.Red {
  color: var(--red);
}

.Red-light {
  color: var(--redlight);
}

.Gray {
  color: var(--gray);
}

.Gray-light {
  color: var(--graylight);
}

.redBG {
  background: linear-gradient(158.59deg,
      var(--red) -4.35%,
      var(--red80) 27.49%,
      var(--red60) 62.02%,
      var(--red40) 99.25%);
}

.whiteBG {
  background: var(--white);
  box-shadow: 0px 4px 4px 0px #00000040;
}

.grayBG {
  background-color: var(--graylight);
}

.w-700 {
  font-weight: 700;
}

.w-500 {
  font-weight: 500;
}

.block {
  margin-bottom: 76px;
}

.mx-auto {
  margin: 0 auto;
}

.p-76 {
  padding: 76px 0;
}

.p-40 {
  padding: 40px 0;
}

.mb-32 {
  margin-bottom: 32px;
}

.mb-16 {
  margin-bottom: 16px;
}

/* страница сайт мап */

.row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}

.justify-content-center {
  -webkit-box-pack: center !important;
  -ms-flex-pack: center !important;
  justify-content: center !important;
}

.pcNone {
  display: none;
}

.col-12 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
}

@media (min-width: 576px) {
  .col-sm-12 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}

@media (min-width: 768px) {
  .col-md-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
}

@media (min-width: 992px) {
  .col-lg-4 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
}

.site-card {
  position: relative;
  width: 100%;
  min-height: 1px;
  padding-right: 11px;
  padding-left: 11px;
}

/* Ограничения от КАРТИНОЧНОГО логотипа. С 27.08 лого текстовое (.logo--text в конце файла)
   и max-width там перебит на none; правила оставлены на случай возврата картинки. */
.header__logo {
  max-width: 140px;
}

.header__logo img {
  width: 100%;
  max-height: 60px;
}

.footer__logo {
  max-width: 140px;
}

.footer__logo img {
  width: 100%;
  max-height: 60px;
}

.site-card .front {
  padding: 14px;
  margin-bottom: 22px;
  border: 1px solid var(--red);
  border-radius: 8px;
  position: relative;
  cursor: pointer;
}

/* .site-card .front::before {
  content: '▼';
  position: absolute;
  width: 20px;
  height: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 10px;
  right: 14px;
  font-size: 13px;
  color: var(--red);
  transition: all .3s;
} */
.site-card a.title-type {
  font-weight: 500;
  font-size: 20px;
  position: relative;
  z-index: 1;
  cursor: pointer;
  color: var(--red);
}

/* .site-card .drop-model {
  display: none;
  padding: 14px 0 0 0;
}
.site-card .drop-model ul {
  padding: 16px;
  margin: 0;
  border-radius: 4px;
  border: 1px solid #e3e3e3;
  max-height: 300px;
} */
.site-card ul.ul-scroll {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: flex-start;
  gap: 10px;
  margin: 20px 0;
}

.site-card ul.ul-scroll li {
  flex: 0 0 15%;
}

.site-card ul.ul-scroll li a {
  color: #141414;
  font-size: 12px;
  position: relative;
  z-index: 1;
  line-height: 1.2;
}

.page-header {
  padding: 0px 0px 90px;
  border-bottom: 1px solid var(--red40);
  position: relative;
}

.page-content {
  padding: 30px 0px 78px;
}

.site-card .front.rotate-ul::before {
  transform: rotate(180deg);
}

.page-header__img {
  max-width: 485px;
  width: 100%;
  object-fit: cover;
  border-radius: 23px 23px 10px 10px;
  float: right;
  height: 350px;
  margin-top: 20px;
  clear: both;
}

.page-header-media {
  position: relative;
  height: 100%;
}

.sertificate-media {
  padding-top: 21px;
}

.page-header-media__label {
  background-color: rgb(255, 255, 255);
  position: absolute;
  padding: 16px 25px 8px 110px;
  width: 100%;
  height: 88px;
  border-radius: 7px;
  border: 1px solid rgb(242, 242, 242);
  max-width: 485px;
  background-image: url("/public/img/icons/tools.png");
  background-repeat: no-repeat;
  background-position: 7% 48%;
  background-size: 48px;
  bottom: 35px;
  right: 0px;
}

.page-header-media__label .price-bannner__title {
  font-size: 25px;
}

.next-block {
  width: 75px;
  height: 75px;
  position: absolute;
  bottom: -16px;
  display: flex;
  justify-content: center;
  align-items: center;
  transform: translate(-50%, 10px);
  left: 50%;
  background-color: white;
  border-radius: 13px;
}

.next-button {
  width: 75%;
  height: 75%;
  position: absolute;
  transform: translate(-49%, -1px);
  left: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 500;
  border-radius: 10px;
  border: 1px solid var(--red);
  font-size: 20px;
  font-family: "SF UI Text";
  color: var(--red);
  transition: all 0.3s ease-in-out 0s;
  background-color: white;
  padding: 0px;
}

.next-block__border {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0px;
  top: 0px;
  border: 1px solid var(--red40);
  border-radius: 13px;
  clip-path: inset(0px 0px 25px);
}

/* .next-button::before {
  content: "";
  width: 23px;
  height: 23px;
  background-image: url("/public/img/icons/arrow-down.svg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: all 0.3s ease 0s;
} */

.next-button:hover {
  background-color: var(--red);
}

.next-button:hover::before {
  filter: brightness(10);
}

/* страница сайт мап */

.colorBtn-red {
  color: var(--white);
  background-color: var(--red);
  padding: 10px 24px 10px 16px;
  transition: all ease 0.3s;
}

.colorBtn-red:hover {
  box-shadow: 0px 4px 4px 0px #00000040;
  transform: translateX(0.5px);
}

.defaultBtn {
  color: var(--red);
  background-color: var(--graylight);
  padding: 10px 12px 10px 12px;
}

.defaultBtn:hover {
  background: var(--redlight);
  transform: translateX(0.5px);
}

.defaultBtn-border {
  color: var(--red);
  border: 1px solid var(--gray);
  background-color: transparent;
  padding: 10px 24px;
}

.defaultBtn-border:hover {
  background: var(--redlight);
  transform: translateX(0.5px);
}

.logo-block {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 3px 10px;
}

.logo-block .city-changer {
  line-height: 1.21;
  flex: 1 0 100%;
  cursor: pointer;
  text-align: left;
  position: relative;
}

.logo-block .city-changer img {
  transition: all ease 0.3s;
}

.logo-block .city-changer:hover img {
  transform: translateY(2px);
}

.links-colored {
  display: flex;
  align-items: center;
  gap: 8px;
  transition: all ease 0.3s;
  flex-wrap: wrap;
}

.links-colored span {
  flex: 1 0 100%;
}

.links-colored:hover {
  color: var(--red);
}

.links-default {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.links-default span {
  flex: 1 0 auto;
}

.contact-block {
  box-shadow: 0px 1px 3px 1px #00000026;
  max-width: 396px;
  padding: 32px 24px;
  border-radius: 20px;
  background-color: var(--white);
}

.contact-block .contact-block-phone {
  margin-bottom: 12px;
  transition: all 0.3s ease;
}

.contact-block .contact-block-mail {
  margin: 32px 0;
  transition: all 0.3s ease;
}

.contact-block .contact-block-phone:hover {
  transform: translateX(3px);
}

.contact-block .contact-block-mail:hover {
  transform: translateX(3px);
}

.contact-block .contact-block-time {
  margin-top: 32px;
}

.contact-block .contact-block-time .time-title {
  margin-bottom: 12px;
}

.contact-block .contact-block-time .time-item {
  margin-bottom: 12px;
  margin-left: 34px;
}

.contact-block .contact-block-time .time-item:last-child {
  margin-bottom: 0;
}

.dropdown .dropdown-content {
  display: none;
  position: absolute;
  padding: 16px 24px;
  background-color: var(--redlight);
  border-radius: 20px 20px 20px 20px;
  z-index: 1;
  max-height: 180px;
  overflow-y: auto;
}

.dropdown .dropdown-content.footer {
  background-color: var(--white);
  box-shadow: 0px 1px 3px 1px #00000026;
}

.dropdown .dropdown-content a {
  line-height: 1.18;
  padding: 0 0 16px 0;
  text-decoration: none;
  display: block;
}

.dropdown .dropdown-content a:last-child {
  padding: 0;
}

.dropdown .dropdown-content.header {
  left: 65px;
  top: 20px;
  background-color: var(--white);
  box-shadow: 0px 1px 3px 1px #00000026;
}

.dropdown .dropbtn img {
  margin-left: 4px;
  transition: all ease 0.3s;
}

.dropdown:hover img {
  transform: translateY(2px);
}

.dropdown:hover .dropdown-content {
  display: block;
}

.cont {
  display: contents;
}

.form {
  padding: 32px 41px 22px 41px;
  max-width: 568px;
  border-radius: 20px;
  background-color: var(--graylight);
  display: flex;
  flex-wrap: wrap;
  gap: 16px 12px;
  justify-content: center;
  position: relative;
  z-index: 5;
}

.form.full {
  max-width: 100%;
  background-color: var(--red);
}

.form.full .input-1 {
  max-width: 100%;
  flex: 1 0 100%;
  padding: 10px 10px 10px 42px;
  border: 1px solid var(--gray);
  background-color: var(--white);
  border-radius: 100px;
  resize: inherit;
  max-height: 42px;
  overflow-y: hidden;
}

.form-text {
  line-height: 1.25;
  padding-bottom: 28px;
}

.form__input {
  border: 1px solid var(--gray);
  background-color: var(--white);
  border-radius: 100px;
  display: flex;
  gap: 8px;
  padding: 10px 10px 10px 42px;
  max-width: 206px;
  align-items: center;
}

.form__input.full {
  max-width: 100%;
  width: 100%;
}

.form__input-input {
  width: 100%;
}

.form .form__input-btn {
  max-width: 186px;
  width: 100%;
}

.form-after-text {
  line-height: 1.28;
}

.form .form__input-check {
  display: flex;
  align-items: center;
  gap: 8px;
}

.form.map-form {
  flex: 0 0 49%;
  max-height: 200px;
  align-items: center;
  align-content: center;
}

.achievement-cards {
  flex: 1 0 100%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 32px;
}

.achievement-cards .achievement-card {
  display: flex;
  align-items: center;
  flex: 1 0 25%;
  gap: 20px;
  border-radius: 20px;
  padding: 23px 23px;
  justify-content: center;
  background-color: var(--graylight);
}

.phone-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
  align-items: center;
  margin-bottom: 32px;
  justify-content: center;
  align-items: stretch;
}

.phone-cards .phone-card {
  background-image: linear-gradient(270deg,
      var(--graylight) 0,
      var(--graylight) 49.99%,
      var(--red) -4.35%,
      var(--red80) 27.49%,
      var(--red60) 62.02%,
      var(--red40) 99.25%);
  outline: 0;
  background-position: 80%;
  background-size: 300%;
  cursor: pointer;
  max-width: 268px;
  flex: 1 0 45%;
  position: relative;
  border-radius: 20px;
  padding: 24px 0 16px 0;
  align-items: center;
  transition: all ease 1s;
  min-height: 350px;
  max-height: 351px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.phone-cards :nth-child(n + 5) {
  display: none;
}

.phone-cards.open :nth-child(n + 5) {
  display: flex;
}

.phone-cards .phone-card .phone-card-info {
  padding: 0 24px;
  width: 100%;
}

.phone-cards .phone-card .phone-card-info .info-title {
  font-size: 18px;
  color: var(--gray);
  position: relative;
  margin-bottom: 32px;
  transition: all 0.6s ease;
  left: 50%;
  transform: translate(-50%, 0%);
  max-width: 190px;
  width: fit-content;
}

.phone-cards .phone-card .phone-card-info .info-text {
  visibility: hidden;
  font-size: 0;
  opacity: 0;
  margin-bottom: 0px;
  transition: 0.6s ease;
}

.phone-cards .phone-card .phone-card-crop {
  max-width: 238px;
  max-height: 135px;
  margin: 0 auto;
  margin-bottom: 42px;
  scale: 1;
  transition: all 0.6s ease;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}

.phone-cards .phone-card .phone-card-crop .card-crop-img {
  width: 65%;
  height: 100%;
  object-fit: contain;
  height: fit-content;
}

.phone-cards .phone-card .info-btn {
  transition: all 0.6s ease;
  width: 100%;
}

.phone-cards .phone-card .info-btn svg path {
  transition: all 0.6s ease;
}

.phone-cards .phone-card:hover {
  background-position: 0;
}

.phone-cards .phone-card:hover .phone-card-info .info-title {
  color: var(--white);
  transform: translate(0%, 0%);
  left: 0;
  margin-bottom: 6px;
}

.phone-cards .phone-card:hover .phone-card-info .info-text {
  color: var(--white);
  font-size: 16px;
  margin-bottom: 10px;
  opacity: 1;
  visibility: inherit;
}

.phone-cards .phone-card:hover .phone-card-info .info-list .list-link {
  color: var --graywhite;
}

.phone-cards .phone-card:hover .info-btn {
  background-color: var(--redlight);
  color: var(--red);
}

.phone-cards .phone-card:hover .info-btn svg path {
  fill: var(--red);
}

.phone-cards .phone-card:hover .phone-card-crop {
  scale: 1.3;
  max-height: 165px;
  margin-bottom: 35px;
}

.phone-cards .phone-card.product {
  min-height: 100%;
  transition: all ease 0.5s;
  background: var(--white);
  box-shadow: 0px 0px 10px rgba(114, 113, 113, 0.15);
}

.phone-cards .phone-card.product .phone-card-info .product-title {
  max-width: 235px;
  text-align: center;
  position: relative;
  margin-bottom: 32px;
  width: fit-content;
}

.phone-cards .phone-card.product .phone-card-crop {
  max-width: 180px;
  max-height: inherit;
  height: inherit;
  margin: auto auto;
  display: flex;
  align-items: center;
}

.phone-cards .phone-card.product:hover {
  background-position: 80% center;
  box-shadow: 0px 0px 10px var(--red);
  transform: translateY(-5px);
}

.phone-cards .phone-card.product:hover .phone-card-crop {
  max-width: 180px;
  max-height: inherit;
  height: inherit;
  margin: auto auto;
  display: flex;
  align-items: center;
  scale: 1.05;
}

/* .phone-cards .phone-card.whiteBg {
      background-image: linear-gradient(270deg, var(--white) 0, var(--white) 49.99%, var(--red) -4.35%, var(--red80) 27.49%, var(--red60) 62.02%, var(--red40) 99.25%); } */

.advantages-cards {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 32px;
}

.advantages-cards .advantages-card {
  flex: 1 0 100%;
  align-self: stretch;
  padding: 20px;
  border-radius: 20px;
  background-color: var(--white);
  box-shadow: 0px 0px 10px rgba(114, 113, 113, 0.15);
}

.advantages-cards .advantages-card .card-img {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 12px;
  font-size: 22px;
}

.advantages-cards .advantages-card .card-img h3{
  font-size: 22px;
  font-weight: 700;
}


.advantages-cards .advantages-card .card-img span{
  background: var(--red);
  color: white;
  height: 42px;
  width: 42px;
  min-width: 42px;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 20px;
  font-weight: 700;
}

.advantages-cards .advantages-card .advantages-card-info {
  line-height: 1.5;
  font-size: 22px;
}

.option__cards {
  display: flex;
  gap: 11px;
  flex-direction: column;
  max-height: 401px;
  min-height: 399px;
  width: 100%;
  padding: 5px;
  overflow: auto;
}

.option__cards.hide {
  display: none;
}

.option__cards.show {
  display: flex;
}

.option__cards .option__cards-item {
  display: flex;
  align-items: center;
  background-color: var(--graylight);
  border-radius: 20px;
  padding: 8px 12px 8px 32px;
  gap: 28px;
}

.option__cards .option__cards-item.whiteBg {
  background-color: var(--white);
}

.option__cards .option__cards-item .item-title {
  width: 30%;
}

.option__cards .option__cards-item .item-text {
  width: 17%;
  margin-left: auto;
}

.option__cards .option__cards-item .item-btn {
  padding: 12px 24px;
  border-radius: 13px;
  height: 40px;
  width: 40px;
  background-color: var(--red);
  transition: 0.3s ease;
}

.option__cards .option__cards-item .item-btn-arrow {
  transform: rotate(180deg) translateX(0px);
  transition: 0.3s ease;
}

.option__cards .option__cards-item .item-btn:hover {
  box-shadow: 0px 1px 2px 0px #0000004d;
}

.option__cards .option__cards-item .item-btn:hover .item-btn-arrow {
  transform: rotate(180deg) translateX(-4px);
}

.option__cards-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 12px;
  padding: 40px 24px;
  background-color: var(--graylight);
  border-radius: 13px;
}

.option__cards-empty-title {
  font-weight: 600;
}

.option__cards-empty-text {
  max-width: 480px;
}

.option__cards-empty-btn {
  margin-top: 8px;
  padding: 12px 28px;
  border-radius: 13px;
  cursor: pointer;
}

.plus-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
}

.plus-card {
  padding: 0 16px 24px 24px;
  border-radius: 20px;
  background-color: var(--graylight);
  flex: 1 0 20%;
  text-align: center;
}

.plus-card .card-title {
  margin-bottom: 20px;
}

.plus-card .card-img {
  position: relative;
  top: -32px;
}

.plus-card.whiteBg {
  background-color: var(--white);
}

.static-card {
  flex: 1 0 20%;
  text-align: center;
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.static-card .card-title {
  width: 146px;
  height: 146px;
  border-radius: 100%;
  font-size: 57px;
  background: linear-gradient(158.59deg,
      var(--red) -4.35%,
      var(--red80) 27.49%,
      var(--red60) 62.02%,
      var(--red40) 99.25%);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.static-card .card-text {
  margin-bottom: 20px;
}

.static-card .card-img {
  position: relative;
  top: -32px;
}

.swiper-button-next {
  width: 40px !important;
  height: 40px !important;
  background-color: var(--red);
  border-radius: 13px;
}

.swiper-button-next:after {
  content: "";
}

.swiper-button-prev {
  width: 40px !important;
  height: 40px !important;
  background-color: var(--red);
  border-radius: 13px;
}

.swiper-button-prev:after {
  content: "";
}

.swiper-button-prev {
  left: var(--swiper-navigation-sides-offset, 0px);
}

.swiper-button-next {
  transform: rotate(180deg);
  right: var(--swiper-navigation-sides-offset, 0px);
}

.swiper {
  padding: 0 65px;
  max-width: 1200px;
  margin: 0 auto;
  height: fit-content;
}

@media (max-width: 830px) {
  .swiper {
    padding: 0 24px;
  }
}

.swiper-wrapper {
  padding: 10px 0;
}

.swiper-wrapper .swiper-slide {
  opacity: 0;
  transition: 0.5s;
  cursor: grab;
}

.swiper-wrapper .swiper-slide .slider-item {
  flex: 0 0 50%;
  padding: 28px 36px;
  background-color: var(--white);
  transition: 200ms;
  border-radius: 20px;
  line-height: 1.25;
}

.swiper-wrapper .swiper-slide .slider-item.grayBG {
  background-color: var(--graylight);
}

.swiper-wrapper .swiper-slide .slider-item-profile {
  display: flex;
}

.swiper-wrapper .swiper-slide .slider-item-profile .profile-name {
  display: flex;
  flex-wrap: wrap;
  flex: 1 0 60%;
}

.swiper-wrapper .swiper-slide .slider-item-profile .profile-name .profile-name-crop {
  height: 68px;
  width: 68px;
  margin-right: 20px;
}

.swiper-wrapper .swiper-slide .slider-item-profile .profile-name .profile-name-crop .crop-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 100%;
}

.swiper-wrapper .swiper-slide .slider-item-profile .profile-name-item .title {
  margin-bottom: 4px;
}

.swiper-wrapper .swiper-slide .slider-item-profile .profile-star {
  margin-left: auto;
  text-align: end;
}

.swiper-wrapper .swiper-slide .slider-item-profile .profile-star .star-text {
  margin-bottom: 3px;
}

.swiper-wrapper .swiper-slide .slider-item-profile .profile-star ul {
  display: flex;
  gap: 3px;
}

.swiper-wrapper .swiper-slide .slider-item-profile .profile-star ul li {
  flex: 1 0 20%;
}

.swiper-wrapper .swiper-slide .slider-item-profile .profile-star ul li svg path {
  fill: var(--red);
}

.swiper-wrapper .swiper-slide .slider-item-text {
  margin-top: 24px;
  font-weight: 400;
  max-height: 145px;
  overflow: auto;
}

.swiper-wrapper .swiper-slide .slider-item.active {
  opacity: 1;
}

.swiper-wrapper .swiper-slide-active,
.swiper-wrapper .swiper-slide-next {
  opacity: 1;
}

@media (max-width: 830px) {
  .swiper-wrapper .swiper-slide-active {
    opacity: 1;
  }

  .swiper-wrapper .swiper-slide-next {
    opacity: 0;
  }
}

@media (max-width: 919px) {
  .mySwiper1 .swiper-slide {
    opacity: 0;
  }

  .mySwiper1 .swiper-slide .slider-item {
    padding: 20px 16px;
  }

  .mySwiper1 .swiper-slide-active {
    opacity: 1;
  }
}

.mySwiper2 {
  box-shadow: none;
  max-width: 1160px;
}

.mySwiper2 .slide-inner {
  border-radius: 20px;
  padding: 40px;
  margin: 0 auto;
  min-height: 435px;
  background-color: var(--graylight);
  display: flex;
  gap: 24px;
}

.mySwiper2 .slide-inner .img-btn {
  width: 100%;
  margin-top: 20px;
}

.mySwiper2 .slide-inner .img-btn.mobile {
  display: none;
}

.mySwiper2 .slide-inner .slide-block {
  flex: 1 0 45%;
}

.mySwiper2 .slide-inner .slide-block .block-list {
  display: flex;
  flex-wrap: wrap;
  width: 85%;
  position: relative;
}

.mySwiper2 .slide-inner .slide-block .block-model-svg {
  position: absolute;
  right: 65px;
  bottom: 10px;
}

.mySwiper2 .slide-inner .slide-block .block-title {
  margin-bottom: 20px;
}

.mySwiper2 .slide-inner .slide-block .block-model-crop {
  max-width: 242px;
  max-height: 170px;
  margin-bottom: 35px;
}

.block-model-crop.huge {
  max-width: 550px;
  max-height: 100%;
}

.block-model-crop.huge .crop-image {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 20px;
  box-shadow: 10px 10px rgb(0 0 0 / 5%);
}

.mySwiper2 .slide-inner .slide-block .block-model-crop .crop-image {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 20px;
}

.mySwiper2 .slide-inner .slide-block .block-model {
  margin-bottom: 20px;
}

.mySwiper2 .slide-inner .slide-block .block-price {
  margin-top: 56px;
}

.mySwiper2 .slide-inner .slide-block .block-star {
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  margin-bottom: 24px;
  padding: 7px 10px 8px 10px;
  display: flex;
  justify-content: space-between;
  flex: 1 0 45%;
}

.mySwiper2 .slide-inner .slide-block .block-star .star-list {
  display: flex;
}

.mySwiper2 .slide-inner .slide-block .block-text {
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  padding: 20px 22px 21px 24px;
}

.mySwiper2 svg:hover path {
  fill: var(--blue);
}

.mySwiper2 .good path {
  fill: var(--blue);
}

.text-cards {
    width: 100%;
    margin: 0 auto;
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(auto-fit, minmax(385px, 1fr));
    align-items: start
}

@media (max-width:992px) {
  .text-cards{
    grid-template-columns: repeat(auto-fit, minmax(335px, 1fr));
  }
}

.text-cards .text-cards-item {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  border-radius: 20px;
  box-shadow: 0px 0px 10px 0px #72717126;
  background-color: var(--white);
  padding: 22px 23px 22px 27px;
  transition: 300ms;
  position: relative;
  border: 1px solid transparent;
  cursor: pointer;
}

.text-cards .text-cards-item .item-title {
  font-weight: 400;
  line-height: 1.33;
}

.text-cards .text-cards-item .item-btn {
  margin-left: auto;
  background-color: var(--red);
  border-radius: 100%;
  padding: 9px;
  transition: 300ms;
}

.text-cards .text-cards-item .item-block {
  flex: 0 0 100%;
  margin-top: 30px;
  display: none;
}

.text-cards .text-cards-item .item-block-text {
  line-height: 1.25;
}

.text-cards .text-cards-item.active {
  border: 1px solid var(--red);
}

.text-cards .text-cards-item.active .item-block {
  display: block;
}

.text-cards .text-cards-item.active .item-btn {
  transform: rotate(135deg);
}

.idea-list {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
}

.idea-list .list-item {
  flex: 1 0 30%;
  padding: 36px 38px 28px 32px;
  border-radius: 20px;
  background-color: var(--white);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: column;
  min-height: 366px;
}

.burger-menu {
  display: none;
  padding: 18px 14px;
  border-radius: 100px;
  height: fit-content;
  align-self: flex-end;
}

.burger-menu .line {
  width: 22px;
  height: 2px;
  background-color: var(--white);
  border-radius: 100px;
}

@media (max-width: 830px) {
  .burger-menu {
    margin-bottom: auto;
    display: flex;
    gap: 4px;
    flex-direction: column;
    background-color: var(--red);
  }
}

.menu {
  display: none;
}

@media (max-width: 830px) {
  .p-76 {
    padding: 32px 0;
  }

  .menu {
    display: block;
    position: fixed;
    width: 100vw;
    z-index: 9999;
    visibility: hidden;
    height: 0;
    left: 0;
    background-color: var(--white);
    padding: 0;
    box-shadow: 0px 5px 4px 0px #72717126;
    border-radius: 0px 0px 10px 10px;
    transition: 750ms;
  }

  .menu .menu__inner {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .menu .menu__inner .menu__title {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
  }

  .menu .menu__inner .menu__title .menu__logo-block {
    justify-content: flex-start;
    flex: 1 0 85%;
  }

  .menu .menu__inner .menu__title .menu-close {
    min-width: 33px;
    height: 33px;
    border-radius: 100%;
    position: absolute;
    right: 15px;
    top: -45px;
    background-color: var(--red);
  }

  .menu .menu__inner .menu__title .menu-close-line {
    left: 50%;
    top: 15px;
    position: absolute;
    width: 15px;
    height: 2px;
    background-color: var(--white);
    border-radius: 100px;
  }

  .menu .menu__inner .menu__title .menu-close-line:nth-child(1) {
    transform: translate(-50%, 0) rotate(45deg);
  }

  .menu .menu__inner .menu__title .menu-close-line:nth-child(2) {
    transform: translate(-50%, 0) rotate(-45deg);
  }

  .menu .menu__inner .menu-btn {
    margin: 42px 0;
  }

  .menu .menu__inner .menu__nav .header__bottom-menu {
    display: flex;
    align-self: center;
    flex-direction: column;
    gap: 20px;
  }

  .menu.active {
    height: inherit;
    padding: 55px 0 65px 0;
    visibility: visible;
  }

  .menu.active .menu__inner {
    display: flex;
    align-items: flex-start;
  }
}

.footnote-block {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.footnote-block .footnote-block-item {
  display: flex;
  flex-direction: column;
  gap: 30px;
  flex: 0 0 44%;
}

.footnote-block .footnote-block-item h2 {
  margin-bottom: 20px;
  color: black;
}

.footnote-block .footnote-block-item p {
  margin-bottom: 32px;
}

.footnote-block .footnote-block-item p:last-child {
  margin-bottom: 0px;
}

.footnote-block.centered {
  justify-content: center;
  gap: 40px;
}

.footnote-block.centered .footnote-block-item {
  flex: 0 0 100%;
}

.footnote-block.centered .footnote-block-item.full {
  flex: 1 0 100%;
  /* max-width: 800px; */
  /* text-align: center; */
}

.footnote-block-item ol {
  padding-left: 18px;
}

.container {
  margin: 0 auto;
  position: relative;
  padding: 0px 1.5rem;
}

@media (min-width: 576px) {
  .container {
    max-width: 550px;
  }
}

@media (min-width: 830px) {
  .container {
    max-width: 800px;
  }
}

@media (min-width: 1050px) {
  .container {
    max-width: 1020px;
  }
}

@media (min-width: 1301px) {
  .container {
    max-width: 1200px;
  }
}

.header__top-mobile-phone {
  display: none;
}

.header__inner {
  position: relative;
  z-index: 1;
  padding-top: 11px;
}

.header__inner .header__top {
  align-items: center;
  display: flex;
  gap: 40px;
}

.header__inner .header__top .header__top-logo-block {
  flex: 0 0 23%;
}

.header__inner .header__top .header__top-phones {
  display: flex;
  gap: 12px;
  text-decoration: none;
  margin-right: 9px;
}

/* Подпись «Горячая линия» перед номером: перебиваем унаследованный flex:1 0 100% (иначе занимает всю строку и номер переносится), держим в одну строку с номером */
.header__inner .header__top .header__top-phone .header__top-phone-label {
  flex: 0 0 auto;
  display: inline;
  width: auto;
  white-space: nowrap;
}

.header__inner .header__top .header__top-right-side {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  flex: 0 0 37%;
}

.header__inner .header__top .header__top-right-side .right-side-btns {
  flex: 1 0 100%;
  display: flex;
  gap: 12px;
}

.header__inner .header__top .header__top-address {
  align-items: center;
  flex-wrap: nowrap;
}

.header__inner .header__top .header__top-address .right-side-address {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 0 0 auto;
}

.header__inner .header__top .header__top-address .right-side-address span {
  flex: 0 0 auto;
}

.header__inner .header__top .header__top-colorBtn {
  margin-left: 24px;
  flex-shrink: 0;
}

.header__inner .header__bottom {
  /* box-shadow: 0px 4px 4px 0px #00000040; */
  border-radius: 100px;
  background-color: var(--graylight);
  width: fit-content;
  margin: 0 auto;
  margin-top: 21px;
}

.header__inner .header__bottom .header__bottom-menu {
  justify-content: center;
  display: flex;
}

.header__inner .header__bottom .header__bottom-menu .menu-link {
  display: flex;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 100px;
}

.header__inner .header__bottom .header__bottom-menu .menu-link:hover {
  transition: 0.3s ease;
  background: var(--redlight);
}

.header__inner .header__bottom .header__bottom-menu .menu-item {
  border-radius: 100px;
}

.header__inner .header__bottom .header__bottom-menu .menu-item:hover {
  background-color: var(--redlight);
}

.header__inner .header__bottom .header__bottom-menu .menu-item.active {
  background-color: var(--redlight);
}

#main-header.sticky {
  position: fixed;
  z-index: 1;
  background: #fff;
  z-index: 999;
  width: 100%;
  height: unset;
  top: 0;
  padding-bottom: 0;
}

#main-header.sticky .header__inner {
  padding: 5px 0;
}

.ghostHeader {
  display: none;
}

.ghostHeader.show {
  display: block;
}

.bannner .bannner__inner {
  padding: 52px 0 0 0;
  display: grid;
  gap: 28px 32px;
  align-items: start;
  grid-template: "tit tit tit tit tit  ban ban ban ban ban" minmax(43px, auto) "text text text text text ban ban ban ban ban" minmax(43px,
      auto
    ) "num num num num num ban ban ban ban ban" minmax(43px, auto) "ach ach ach ach ach ach ach ach ach ach" minmax(43px,
      auto
    ) / 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}

.bannner .bannner__inner .bannner-seo {
  grid-area: text;
}

.bannner .bannner__inner .bannner-seo ul {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.bannner .bannner__inner .bannner-seo ul li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
}

.bannner .bannner__inner .bannner__info .bannner__info-h1 {
  margin-bottom: 24px;
}

.bannner .bannner__inner .bannner__info .bannner__info-form {
  padding: 32px;
}

.bannner .bannner__inner .bannner__info .bannner__info-form .bannner__info-form-text {
  line-height: 1.25;
  padding-bottom: 28px;
}

.bannner .bannner__inner .bannner-block {
  background: linear-gradient(158.59deg,
      var(--red) -4.35%,
      var(--red80) 27.49%,
      var(--red60) 62.02%,
      var(--red40) 99.25%);
  max-width: 570px;
  width: 100%;
  border-radius: 10px;
  position: relative;
  overflow: hidden;
  height: 100%;
}

.bannner .bannner__inner .bannner-block .bannner-crop {
  position: absolute;
  max-width: 420px;
  height: 100%;
  max-height: 315px;
  top: 0;
  right: 0px;
}

.bannner .bannner__inner .bannner-block .bannner-crop-text {
  position: absolute;
  z-index: 5;
  bottom: 40px;
  left: 40px;
}

.bannner .bannner__inner .bannner-block svg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
}

.bannner .bannner__inner .bannner-crop-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.bannner .bannner__inner .bannner-paragraf {
  width: 75%;
}

.bannner .bannner__inner .tit {
  grid-area: tit;
}

.bannner .bannner__inner .text {
  grid-area: text;
}

.bannner .bannner__inner .text ul {
  display: flex;
  flex-direction: column;
  gap: 12px;
  color: var(--black);
}

.bannner .bannner__inner .text ul li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
}

.bannner .bannner__inner .num {
  grid-area: num;
}

.bannner .bannner__inner .ach {
  grid-area: ach;
}

.bannner .bannner__inner .ban {
  grid-area: ban;
}

.bannner .bannner__inner.product {
  grid-template: "tit tit tit tit tit tit tit ban ban ban ban ban" minmax(43px, auto) "text text text text text text text ban ban ban ban ban" minmax(43px,
      auto
    ) "num num num num num num num ban ban ban ban ban" minmax(43px, auto) "num num num num num num num ban ban ban ban ban" minmax(43px,
      auto
    )
    /* "ach ach ach ach ach ach ach ban ban ban ban ban" minmax(43px, auto) / 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; */
  ;
  background: linear-gradient(158.59deg,
      var(--red) -4.35%,
      var(--red80) 27.49%,
      var(--red60) 62.02%,
      var(--red40) 99.25%);
  padding: 40px;
  border-radius: 20px;
  position: relative;
  align-items: end;
}

.bannner .bannner__inner.product .bannner-title {
  margin-bottom: 18px;
  width: 75%;
}

.bannner .bannner__inner.product .bannner__achievement-cards {
  align-items: start;
}

.bannner .bannner__inner.product .bannner-block {
  background: var(--white);
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  z-index: 3;
}

.bannner .bannner__inner.product .bannner-block .bannner-crop {
  top: 10px;
  position: relative;
  z-index: 0;
}
.huiSvg {
  width: 24px;
  height: 24px;
  min-width: 24px;
}
.huiSvg path{
  fill: white;
}
.huiSvg rect{
  fill: white;
}
.huiSvg polygon{
  fill: white;
}

.bannner .bannner__inner.product .bannner-block .bannner-crop-text {
  display: flex;
  gap: 10px;
  position: relative;
  z-index: 10;
  transform: translateY(-35px);
  margin: 0;
}

.heroAnchor{
  color: white;
  width: 100%;
  text-align: center;
  padding: 12px;
  background: var(--base-500);
  max-width: 200px;
  margin: 0 0 10px 0;
  font-size: 14px;
  border-radius: 100px;
}

.bannner .bannner__inner.product .bannner-block .bannner-crop-text .title-main {
  background: linear-gradient(158.59deg,
      var(--red) -4.35%,
      var(--red80) 27.49%,
      var(--red60) 62.02%,
      var(--red40) 99.25%);
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 86px;
  height: 86px;
}

.bannner .bannner__inner.product .bannner-block .bannner-crop-text .text-item {
  box-shadow: 0px 1px 3px 1px #00000026;
  background-color: var(--white);
  border-radius: 20px;
  padding: 10px;
  min-height: 92px;
  display: flex;
  align-items: center;
  max-width: 171px;
}

.bannner .bannner__inner.product .bannner-block .bannner-crop-line {
  position: relative;
  width: 100%;
  height: 1px;
  margin-bottom: 7px;
}

.bannner .bannner__inner.product .bannner-block .bannner-crop-end {
  display: flex;
  flex-direction: column;
  gap: 7px;
  text-align: center;
  position: relative;
}

.bannner .bannner__inner.product .bannner-block .bannner-crop-end .end-connect {
  position: absolute;
  width: 32px;
  height: 42px;
  right: -15px;
  top: 10px;
}

.bannner .bannner__inner.product .bannner-background {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 0;
}

.bannner .bannner__inner.spec .bannner-crop-img {
  position: absolute;
  bottom: 0;
  right: 0;
  max-width: 500px;
  max-height: 350px;
}

@media (max-width:830px) {
  .bannner .bannner__inner.spec .bannner-crop-img {
    display: none !important;
  }
}

.bannner .bannner__inner.inside {
  grid-template: "tit tit tit tit tit tit tit ban ban ban ban ban ban ban ban ban" minmax(43px, auto) "ach ach ach ach ach ach ach ban ban ban ban ban ban ban ban ban" minmax(43px,
      auto
    ) "btns btns btns btns btns btns btns ban ban ban ban ban ban ban ban ban" minmax(43px, auto) / 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  margin-bottom: 45px;
}

.bannner .bannner__inner.inside .seo-btns {
  grid-area: btns;
  display: flex;
  align-items: center;
  gap: 20px;
}

.bannner .bannner__inner.inside .seo-btns .defaultBtn {
  pointer-events: none;
}

.bannner .bannner__inner.inside .bannner-block {
  border-radius: 20px;
  background: var(--white);
  box-shadow: 0px 0px 10px var(--red);
  overflow: inherit;
  height: 100%;
}

.bannner .bannner__inner.inside .bannner-block .bannner-crop {
  position: relative;
  margin: 0 auto;
}

.model .model-btn {
  margin: 0 auto;
}

.type__inner {
  display: flex;
  flex-direction: column;
}

.type__inner .type-footnote {
  max-width: 783px;
  margin: 0 auto;
  text-align: center;
  margin-bottom: 40px;
}

.type__inner .type__switcher {
  display: flex;
  gap: 24px;
}

.type__inner .type__switcher-btns {
  display: flex;
  flex-direction: column;
  border-radius: 20px;
  background-color: var(--graylight);
  min-width: 168px;
  height: fit-content;
}

.type__inner .type__switcher-btns .type__switcher-btn {
  cursor: pointer;
  display: flex;
  align-items: center;
  padding: 16px 0;
  justify-content: center;
  text-align: center;
  transition: 300ms;
}

.type__inner .type__switcher-btns .type__switcher-btn:first-child {
  border-radius: 20px 20px 0 0;
}

.type__inner .type__switcher-btns .type__switcher-btn:last-child {
  border-radius: 0 0 20px 20px;
}

.type__inner .type__switcher-btns .type__switcher-btn.active {
  background-color: var(--red);
  color: var(--white);
}

.type__inner .type__switcher-btns .type__switcher-btn.active:hover {
  background-color: var(--red);
  color: var(--white);
}

.type__inner .type__switcher-btns .type__switcher-btn:hover {
  background-color: var(--redlight);
  color: var(--red);
}

.type__inner .cards-box {
  width: 100%;
}

.type__inner .cards-box-title {
  display: flex;
}

.type__inner .cards-box-title :nth-child(1) {
  width: 40%;
  text-align: left;
  padding-left: 32px;
}

.type__inner .cards-box-title :nth-child(2) {
  text-align: left;
  width: 35%;
}

.type__inner .box-title,
.type__inner .cards-box-title {
  margin-bottom: 24px;
  text-align: center;
}

.type__inner .type__switcher-option__cards {
  margin-bottom: 32px;
}

.type__inner .type__switcher-colorBtn-red {
  margin: 0 auto;
  padding: 10px 24px;
}

@media (max-width: 830px) {
  .phone-cards :nth-child(n + 5) {
    display: none;
  }

  .phone-cards.open :nth-child(n + 5) {
    display: flex;
  }

  .type__switcher-btns {
    overflow: auto;
  }

  .type__switcher-btns::-webkit-scrollbar {
    width: 0;
    height: 0;
  }
}

.consult__card {
  border-radius: 20px;
  padding: 52px;
  display: grid;
  gap: 0 32px;
  position: relative;
  grid-template: "tit tit tit tit tit tit tit ban ban ban" minmax(43px, auto) "num num num num num num num ban ban ban" minmax(43px,
      auto
    ) / 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  height: 374px;
}

.consult__card .consult__card-title {
  text-align: left;
  margin-bottom: 20px;
}

.consult__card .consult__card-text-block {
  grid-area: tit;
}

.consult__card .consult__card-form {
  grid-area: num;
  position: relative;
  z-index: 5;
}

.consult__card .consult__card-text {
  margin-bottom: 40px;
}

.consult__card .consult__card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  bottom: 0;
  left: 0;
}

.consult__card .consult__card-img {
  grid-area: ach;
  position: absolute;
  right: 35px;
}

.excellence .excellence-title {
  margin-bottom: 70px;
}

.reviews__slider {
  display: flex;
  align-items: center;
  overflow: hidden;
  position: relative;
}

.reviews__slider .slider-prev-btn {
  transform: rotate(180deg);
  position: absolute;
  left: 0;
  z-index: 3;
}

.reviews__slider .slider-next-btn {
  position: absolute;
  right: 0;
  z-index: 3;
}

.map #map {
  width: 100%;
  height: 454px;
  padding: 0;
  margin: 0;
  position: relative;
  border-radius: 20px;
  filter: drop-shadow(0px 8px 16px rgba(0, 0, 0, 0.15));
}

.map .ymaps-2-1-79-inner-panes,
.map .ymaps-2-1-79-map {
  border-radius: 20px;
}

.map.inside #map {
  margin-bottom: 32px;
}

.map .map-block {
  position: absolute;
  z-index: 99;
  margin: 45px;
}

.map .map-block.inside {
  max-width: 568px;
  position: relative;
  z-index: 1;
  margin: 0;
  background-color: var(--graylight);
  flex: 0 0 49%;
  padding: 28px 24px;
}

.map .map-block.inside .contact-block-nums {
  margin-bottom: 8px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.map .map-block.inside .contact-block-mail {
  margin: 15px 0;
}

.map .map-box {
  display: flex;
  gap: 32px;
  flex-wrap: wrap;
}

.popup {
  transform: translate(-50%, -50%) scale(0);
  position: fixed;
  top: 0;
  z-index: 1000;
  padding: 44px;
  display: flex;
  flex-direction: column;
  text-align: center;
  max-width: 593px;
  width: 100%;
  box-shadow: 0px 0px 10px 0px #72717126;
  background-color: var(--white);
  border-radius: 20px;
  /* position: relative; */
  left: 50%;
}

.popup .close {
  position: absolute;
  right: 20px;
  top: 20px;
}

.popup .popup-title {
  line-height: 1.2;
  margin-bottom: 32px;
}

.popup .popup-text {
  padding: 0 35px;
  line-height: 1.33;
  margin-bottom: 24px;
}

.popup form {
  display: flex;
  flex-direction: row;
  gap: 18px;
}

.popup form input {
  border: 1px solid var(--graywhite);
}

.popup form textarea {
  padding: 15px;
  border-radius: 100px;
  border: 1px solid var(--graywhite);
  margin-bottom: 24px;
  resize: none;
}

.popup .popup-colorBtn {
  margin: 0 auto;
}

.popup.active {
  transform: translate(-50%, 50%) scale(1);
  transition: 0.5s all;
}

@media (max-width: 992px) {
  .popup.active {
    transform: translate(-50%, 50%) scale(1);
  }
}

.popup__bg {
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.2);
  opacity: 0;
  pointer-events: none;
  transition: 0.5s all;
}

.popup__bg.active {
  opacity: 1;
  pointer-events: all;
  transition: 0.5s all;
}

.popup__address {
  padding: 46px 20px 20px 20px;
  max-width: 468px;
  box-shadow: 0px 0px 10px 0px #72717126;
  background-color: var(--graylight);
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  text-align: center;
  transform: translate(-50%, -50%) scale(0);
  position: relative;
  left: 50%;
  background-color: var(--white);
}

.popup__address .address-title {
  line-height: 1.17;
  margin-bottom: 32px;
  font-weight: 400;
}

.popup__address .close {
  position: absolute;
  right: 20px;
  top: 20px;
}

.popup__address.active {
  transform: translate(-50%, 50%) scale(1);
  transition: 0.5s all;
}

@media (max-width: 830px) {
  .popup__address.active {
    transform: translate(-50%, 50%) scale(1);
  }
}

.popup__address .form__input {
  padding: 10px 10px 10px 10px;
  justify-content: center;
  max-width: 186px;
  width: 100%;
}

.popup__address .form__input #order-input {
  text-align: center;
}

.popup__sert {
  padding: 46px 20px 20px 20px;
  max-width: 560px;
  box-shadow: 0px 0px 10px 0px #72717126;
  background-color: var(--graylight);
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  text-align: center;
  transform: translate(-50%, -50%) scale(0);
  position: relative;
  left: 50%;
  background-color: var(--white);
}

.popup__sert .address-title {
  line-height: 1.17;
  margin-bottom: 32px;
  font-weight: 400;
}

.popup__sert .close {
  position: absolute;
  right: 20px;
  top: 20px;
}

.popup__sert.active {
  transform: translate(-50%, 50%) scale(1);
  transition: 0.5s all;
}

@media (max-width: 830px) {
  .popup__sert.active {
    transform: translate(-50%, 50%) scale(1);
  }
}

.popup__sert .form__input {
  padding: 10px 10px 10px 10px;
  justify-content: center;
  max-width: 186px;
  width: 100%;
}

.popup__sert .form__input #order-input {
  text-align: center;
}

.popup-num-box {
  max-width: 335px;
  padding: 30px 40px;
  position: relative;
}

.popup-num-box .close-thanks {
  position: absolute;
  top: 20px;
  right: 20px;
}

.popup-num-box-text {
  padding: 32px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: var(--graylight);
  border-radius: 20px;
}

.popup-num-box-text .popup-title {
  margin-bottom: 16px;
}

.history {
  margin: 32px 0;
}

.history .history__inner {
  margin-bottom: 24px;
  word-wrap: break-word;
  display: inherit;
}

.history .history__inner svg {
  margin: 0 5px;
}

.history .history__inner a {
  min-width: fit-content;
}

.history .history__inner :last-child {
  display: inline-block;
}

.about__inner {
  display: flex;
  flex-wrap: wrap;
  gap: 58px;
  margin-bottom: 52px;
  align-items: center;
}

.about__inner .about__inner-block:nth-child(1) {
  line-height: 1.25;
  flex: 0 0 37%;
}

.about__inner .about__inner-block:nth-child(1) .block-crop {
  max-width: 410px;
  max-height: 368px;
  margin-top: -70px;
}

.about__inner .about__inner-block:nth-child(1) .block-crop .block-crop-img {
  width: 100%;
  height: fit-content;
  object-fit: contain;
}

.about__inner .about__inner-block:nth-child(2) {
  line-height: 1.43;
  flex: 1 0 41%;
}

.about__inner .about__inner-block .block-title {
  margin-bottom: 14px;
}

.about__inner .about__inner-block .block__list {
  gap: 42px 32px;
}

.about__inner .about__inner-block .block__list .block__list-item {
  flex: 1 0 35%;
}

.about__inner .about__inner-block .block__list .block__list-item .item {
  flex: 0 0 90%;
  padding: 15px 16px 15px 44px;
  display: flex;
  align-items: center;
}

.problem .problem__block {
  display: flex;
  gap: 0 20px;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.problem .problem__block .block__list {
  flex: 1 0 45%;
  line-height: 1.18;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: center;
}

.problem .problem__block .block__list .block__list-item {
  list-style: inherit;
}

.block-list {
  margin: 12px 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.block-list-item {
  list-style: inherit;
  margin-left: 2rem;
}

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

.quantity__inner-list {
  display: flex;
  gap: 42px;
  align-items: flex-end;
}

.quantity__inner-list .list-item {
  flex: 1 0 13%;
  line-height: 1.16;
}

.quantity__inner-list .list-item:nth-child(1) .item-block {
  height: calc(1 * 280px);
}

.quantity__inner-list .list-item:nth-child(2) .item-block {
  height: calc(0.42 * 280px);
}

.quantity__inner-list .list-item:nth-child(3) .item-block {
  height: calc(0.37 * 280px);
}

.quantity__inner-list .list-item:nth-child(4) .item-block {
  height: calc(0.57 * 280px);
}

.quantity__inner-list .list-item:nth-child(5) .item-block {
  height: calc(0.9 * 280px);
}

.quantity__inner-list .list-item:nth-child(6) .item-block {
  height: calc(1 * 280px);
}

.quantity__inner-list .list-item .item-block {
  background: linear-gradient(158.59deg,
      var(--red) -4.35%,
      var(--red80) 27.49%,
      var(--red60) 62.02%,
      var(--red40) 99.25%);
  padding-top: 25px;
  text-align: center;
  border-radius: 20px 20px 0 0;
}

.quantity__inner-list .list-item .item-text {
  margin-top: 20px;
  text-align: center;
}

.calc-slide {
  background-color: var(--graylight);
  padding: 44px;
  border-radius: 20px;
  min-height: 420px;
  position: relative;
  display: flex;
  flex-direction: column;
  max-width: 1200px;
  margin: 0 auto;
}

.calc-slide .slide-title {
  margin-bottom: 12px;
}

.calc-slide .slide-text {
  margin-bottom: 32px;
}

.calc-slide .slide-check {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  max-width: 450px;
  justify-content: flex-start;
  margin-bottom: 20px;
}

.calc-slide .slide-label {
  background-color: var(--white);
  border: 1px solid var(--gray);
  flex: 0 0 20%;
  min-width: 135px;
  width: fit-content;
  border-radius: 20px;
  min-height: 40px;
  height: auto !important;
  padding: 8px 14px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  cursor: pointer;
  position: relative;
}

.calc-slide .slide-label:hover {
  background-color: var(--redlight);
}

.calc-slide .slide-label.active {
  background-color: var(--red);
  border: 1px solid transparent;
}

.calc-slide .slide-label.active:hover {
  background-color: var(--red);
}

.calc-slide .slide-label.active .radio-text {
  color: var(--white);
}

.calc-slide .radio-text {
  text-align: center;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: auto;
  line-height: 1.2;
}

.calc-slide input[type="radio"]:checked~.check {
  border: 2px solid #c1c1c1;
}

.calc-slide input[type="radio"] {
  position: absolute;
  visibility: hidden;
}

.calc-slide .check {
  display: block;
  position: absolute;
  border: 2px solid #c1c1c1;
  border-radius: 100%;
  height: 18px;
  width: 18px;
  top: 0px;
  z-index: 5;
  transition: border 0.25s linear;
  -webkit-transition: border 0.25s linear;
}

.calc-slide input[type="radio"]:checked~.check::before {
  background: #4990e2;
}

.calc-slide ul li .check::before {
  display: block;
  position: absolute;
  content: "";
  border-radius: 100%;
  height: 10px;
  width: 10px;
  top: 2px;
  left: 2px;
  transition: 0.25s linear;
  -webkit-transition: 0.25s linear;
}

.calc-slide .slide-btn {
  justify-items: flex-start;
  margin-top: auto;
}

.calc-slide .slide-btn svg {
  transform: rotate(180deg);
}

.calc-slide .displayedImage-crop {
  position: absolute;
  bottom: 0;
  right: 0;
  max-width: 566px;
  max-height: 300px;
  display: flex;
  justify-content: flex-end;
}

.calc-slide .displayedImage-crop .displayedImage {
  width: 70%;
  object-fit: contain;
  height: auto;
}

.calc-slide .slide-btns {
  display: flex;
  gap: 20px;
  margin-top: auto;
  align-items: center;
}

.calc-slide .slide-form {
  background-color: var(--white);
  justify-content: flex-start;
  max-width: 505px;
  position: absolute;
  right: 44px;
  bottom: 44px;
}

.calc-slide .slide-form .slide-form-title {
  max-width: 315px;
}

.calc-slide .slide-price {
  color: var(--white);
  background-color: var(--red);
  padding: 10px 24px 10px 16px;
  border-radius: 20px;
  width: fit-content;
}

.calc-slide .slide-total {
  border-radius: 20px;
  background-color: var(--white);
  padding: 16px 20px;
  margin-bottom: 12px;
  max-width: 450px;
  width: fit-content;
}

.calc-slide .slide-total:last-child {
  margin-bottom: 0;
}

.calc-slide .calc-slide-steps {
  position: absolute;
  right: 44px;
  top: 44px;
  display: flex;
  flex-direction: column;
  align-items: start;
  max-width: 392px;
  width: 100%;
}

.calc-slide .calc-slide-steps .steps-text {
  margin-bottom: 8px;
}

.calc-slide .calc-slide-steps .steps-box {
  width: 100%;
  height: 6px;
  border-radius: 50px;
  background-color: var(--gray);
}

.calc-slide .calc-slide-steps .steps-box .steps-box-item {
  height: 6px;
  width: 0;
  border-radius: 50px;
  background: linear-gradient(158.59deg,
      var(--red) -4.35%,
      var(--red80) 27.49%,
      var(--red60) 62.02%,
      var(--red40) 99.25%);
}

#slide2 .slide-title,
#slide3 .slide-title {
  margin-bottom: 32px;
}

#slide2 .calc-slide-select,
#slide3 .calc-slide-select {
  max-width: 526px;
  width: 100%;
  height: 56px;
  border-radius: 20px;
  padding: 16px 32px;
  background-color: var(--white);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

#slide2 .calc-select-box,
#slide3 .calc-select-box {
  position: relative;
  display: inline-block;
  max-width: 526px;
}

#slide2 .calc-select-box:after,
#slide3 .calc-select-box:after {
  content: "▼";
  padding: 0 8px;
  color: var(--gray);
  font-size: 12px;
  position: absolute;
  right: 35px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  text-align: center;
  width: 14px;
  height: 10px;
  pointer-events: none;
  box-sizing: border-box;
}

footer {
  position: relative;
}

footer .footer__inner {
  padding: 38px 0 67px 0;
  display: flex;
  gap: 50px;
  flex-wrap: wrap;
}

footer .footer__inner .footer__info {
  flex: 0 0 34%;
}

footer .footer__inner .footer__info .footer__info-text {
  margin: 14px 0 27px 0;
  line-height: 1.28;
}

footer .footer__inner .footer__info .footer__top-logo-block {
  margin-bottom: 40px;
}

footer .footer__inner .footer__nav {
  margin-left: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
  flex:1;
}

footer .footer__inner .footer__nav .footer__nav-card {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
}

footer .footer__inner .footer__nav .footer__nav-card:nth-child(1) {
  flex: 1 0 35%;
}

footer .footer__inner .footer__nav .footer__nav-card:nth-child(2) {
  flex: 1 0 35%;
}

footer .footer__inner .footer__nav .footer__nav-card:nth-child(3) {
  flex: 1 0 100%;
}

footer .footer__inner .footer__nav .footer__nav-card .card-text {
  flex: 1 0 100%;
  margin-bottom: 20px;
}

footer .footer__inner .footer__nav .footer__nav-card ul {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: fit-content;
  margin-right: auto;
}

footer .footer__inner .footer__nav .footer__nav-card ul li {
  transition: all 0.3s ease;
}

footer .footer__inner .footer__nav .footer__nav-card ul li:hover {
  transform: translateX(3px);
}

.footer__contacts {
  display: flex;
  gap: 35px;
  flex-wrap: wrap;
}

.footer__contacts .footer__contacts-link {
  display: flex;
  flex-direction: column;
  gap: 13px;
}

.footer__contacts .address-links-btns {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
}

@media (max-width: 1300px) {
  .form {
    padding: 32px 15px 22px 15px;
  }

  .header__inner {
    position: relative;
    z-index: 1;
    padding-top: 12px;
  }

  .header__inner .header__top {
    flex-wrap: wrap;
    gap: 20px;
  }

  .header__inner .header__top .header__top-logo-block {
    flex: 1 0 22%;
  }

  .header__inner .header__top .header__top-phones {
    flex-direction: column;
  }

  .header__inner .header__top .header__top-right-side {
    flex: 0 0 43%;
  }

  .bannner .bannner__inner {
    padding: 20px 0 0 0;
    display: grid;
    gap: 20px 20px;
    align-items: end;
    grid-template: "tit tit tit tit tit  ban ban ban ban ban" minmax(43px, auto) "text text text text text ban ban ban ban ban" minmax(43px,
        auto
      ) "num num num num num ban ban ban ban ban" minmax(43px, auto) "ach ach ach ach ach ach ach ach ach ach" minmax(43px,
        auto
      ) / 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  }

  .bannner .bannner__inner .bannner__info .bannner__info-h1 {
    margin-bottom: 24px;
  }

  .bannner .bannner__inner .bannner__info .bannner__info-form {
    padding: 32px;
  }

  .bannner .bannner__inner .bannner__info .bannner__info-form .bannner__info-form-text {
    line-height: 1.25;
    padding-bottom: 28px;
  }

  .bannner .bannner__inner .bannner-block {
    max-width: 570px;
    width: 100%;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
  }

  .bannner .bannner__inner .bannner-block .bannner-crop {
    position: absolute;
    max-width: 470px;
    max-height: 420px;
    top: 0;
    right: 0px;
  }

  /* .bannner .bannner__inner .bannner-block .bannner-crop-text {
    position: relative;
    z-index: 5;
    margin: 253px 0 42px 40px;
  } */

  .bannner .bannner__inner .bannner-block svg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
  }

  .bannner .bannner__inner .bannner-crop-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .bannner .bannner__inner .bannner-paragraf {
    width: 75%;
  }

  .bannner .bannner__inner.product {
    grid-template: "tit tit tit tit tit tit ban ban ban ban ban" minmax(43px, auto) "text text text text text text ban ban ban ban ban" minmax(43px,
        auto
      ) "num num num num num num ban ban ban ban ban" minmax(43px, auto) "num num num num num num ban ban ban ban ban" minmax(43px,
        auto
      ) "ach ach ach ach ach ach ban ban ban ban ban" minmax(43px, auto) / 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    align-items: center;
    padding: 20px 12px;
    border-radius: 20px;
    position: relative;
  }

  .bannner .bannner__inner.product .bannner-title {
    margin-bottom: 18px;
    width: 90%;
  }

  .bannner .bannner__inner.product .bannner__achievement-cards {
    align-items: start;
    flex-direction: column;
  }

  .bannner .bannner__inner.product .bannner__achievement-cards .achievement-card {
    padding: 10px;
  }

  .bannner .bannner__inner.product .bannner-block {
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .bannner .bannner__inner.product .bannner-block .bannner-crop {
    top: 10px;
    position: relative;
    z-index: 0;
  }

  .bannner .bannner__inner.product .bannner-block .bannner-crop-text {
    display: flex;
    gap: 10px;
    position: relative;
    z-index: 10;
    transform: translateY(-35px);
    margin: 0;
  }

  .bannner .bannner__inner.product .bannner-block .bannner-crop-text .title-main {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 86px;
    height: 86px;
  }

  .bannner .bannner__inner.product .bannner-block .bannner-crop-text .text-item {
    border-radius: 20px;
    padding: 10px;
    min-height: 92px;
    display: flex;
    align-items: center;
    max-width: 171px;
  }

  .bannner .bannner__inner.product .bannner-block .bannner-crop-line {
    position: relative;
    width: 100%;
    height: 1px;
    margin-bottom: 7px;
  }

  .bannner .bannner__inner.product .bannner-block .bannner-crop-end {
    display: flex;
    flex-direction: column;
    gap: 7px;
    text-align: center;
    position: relative;
  }

  .bannner .bannner__inner.product .bannner-block .bannner-crop-end .end-connect {
    position: absolute;
    width: 32px;
    height: 42px;
    right: -15px;
    top: 10px;
  }

  .bannner .bannner__inner.product .bannner-background {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
  }

  .bannner .bannner__inner.inside .bannner-crop {
    top: 50%;
    transform: translateY(-50%);
  }
}

@media (min-width: 1201px) {
  .mySwiper2 .slide-inner .slide-crop {
    width: 368px;
    height: 295px;
    margin: 0 auto;
  }

  .mySwiper2 .slide-inner .slide-crop .crop-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
  }
}

@media (max-width: 1200px) {

  .mySwiper2 .swiper-button-next,
  .mySwiper2 .swiper-button-prev {
    top: var(--swiper-navigation-top-offset, 25%);
  }

  .mySwiper2 .slide-inner {
    padding: 20px;
    margin: 0 auto;
    min-height: 435px;
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .mySwiper2 .slide-inner .img-btn {
    width: 100%;
    margin-top: 20px;
    display: none;
  }

  .mySwiper2 .slide-inner .img-btn.mobile {
    display: flex;
    margin: 0;
  }

  .mySwiper2 .slide-inner .slide-crop {
    max-width: 368px;
    max-height: 295px;
    margin: 0 auto;
  }

  .mySwiper2 .slide-inner .slide-crop .crop-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 20px;
  }

  .mySwiper2 .slide-inner .slide-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .mySwiper2 .slide-inner .slide-block .block-list {
    width: 100%;
  }

  .mySwiper2 .slide-inner .slide-block .block-model-svg {
    display: none;
  }

  .mySwiper2 .slide-inner .slide-block .block-title {
    margin-bottom: 20px;
    font-size: 16px;
  }

  .mySwiper2 .slide-inner .slide-block .block-model-crop {
    margin: 0 auto;
    margin-bottom: 12px;
    max-width: 270px;
  }

  .mySwiper2 .slide-inner .slide-block .block-model {
    margin-bottom: 0px;
  }

  .mySwiper2 .slide-inner .slide-block .block-price {
    margin-top: 56px;
  }

  .mySwiper2 .slide-inner .slide-block .block-star {
    border-radius: 6px;
    margin-bottom: 24px;
    padding: 7px 10px 8px 10px;
    display: flex;
    justify-content: space-between;
    flex: 1 0 45%;
  }

  .mySwiper2 .slide-inner .slide-block .block-star .star-list {
    display: flex;
  }

  .mySwiper2 .slide-inner .slide-block .block-text {
    border-radius: 6px;
    padding: 20px 22px 21px 24px;
  }
}

@media (max-width: 1050px) {
  .form {
    padding: 28px 28px 20px 28px;
  }

  .form__input {
    max-width: 100%;
    width: 100%;
    padding: 10px 25%;
  }

  .form .form__input-btn {
    max-width: 100%;
    width: 100%;
  }

  .form.map-form {
    flex: 1 0 49%;
    max-height: 200px;
    align-items: center;
    align-content: center;
  }

  .header__inner {
    position: relative;
    z-index: 1;
    padding-top: 12px;
  }

  .header__inner .header__top {
    flex-wrap: wrap;
    justify-content: center;
  }

  .header__inner .header__top .header__top-logo-block {
    flex: 1 0 65%;
  }

  .header__inner .header__top .header__top-phones {
    flex: 1 0 27%;
  }

  .header__inner .header__top .header__top-right-side {
    flex: 0 0 60%;
  }

  .bannner .bannner__inner {
    padding: 20px 0 0 0;
    display: grid;
    gap: 20px 20px;
    align-items: start;
    grid-template: "tit tit tit tit tit  tit tit tit tit tit" minmax(43px, auto) "text text text text text ban ban ban ban ban" minmax(43px,
        auto
      ) "num num num num num ban ban ban ban ban" minmax(43px, auto) "ach ach ach ach ach ach ach ach ach ach" minmax(43px,
        auto
      ) / 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  }

  .bannner .bannner__inner .bannner__info .bannner__info-h1 {
    margin-bottom: 24px;
  }

  /* .bannner .bannner__inner .bannner-block .bannner-crop-text {
    margin: 200px 0 42px 40px;
  } */

  .bannner .bannner__inner.product {
    grid-template: "tit tit tit tit tit tit tit tit tit tit tit" minmax(43px, auto) "text text text text text text ban ban ban ban ban" minmax(43px,
        auto
      ) "num num num num num num ban ban ban ban ban" minmax(43px, auto) "num num num num num num ban ban ban ban ban" minmax(43px,
        auto
      ) "ach ach ach ach ach ach ban ban ban ban ban" minmax(43px, auto) / 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  }

  .plus-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 40px 20px;
  }

  .plus-card {
    padding: 0 25px 20px 25px;
    flex: 1 0 45%;
  }

  .calc-slide {
    padding: 32px 20px;
    min-height: 420px;
    position: relative;
    display: flex;
    flex-direction: column;
  }

  .calc-slide .slide-title {
    margin-bottom: 20px;
  }

  .calc-slide .slide-text {
    margin-bottom: 32px;
  }

  .calc-slide .slide-check {
    justify-content: flex-start;
    margin-bottom: 20px;
  }

  .calc-slide .slide-label {
    background-color: var(--white);
    border: 1px solid var(--gray);
    flex: 0 0 20%;
    min-width: 135px;
    width: fit-content;
    border-radius: 20px;
    min-height: 40px;
    height: auto !important;
    padding: 8px 14px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    cursor: pointer;
    position: relative;
  }

  .calc-slide .slide-label:hover {
    background-color: var(--redlight);
  }

  .calc-slide .slide-label.active {
    background-color: var(--red);
    border: 1px solid transparent;
  }

  .calc-slide .slide-label.active:hover {
    background-color: var(--red);
  }

  .calc-slide .slide-label.active .radio-text {
    color: var(--white);
  }

  .calc-slide .radio-text {
    margin-left: 8px;
  }

  .calc-slide input[type="radio"]:checked~.check {
    border: 2px solid #c1c1c1;
  }

  .calc-slide input[type="radio"] {
    position: absolute;
    visibility: hidden;
  }

  .calc-slide .check {
    display: block;
    position: absolute;
    border: 2px solid #c1c1c1;
    border-radius: 100%;
    height: 18px;
    width: 18px;
    top: 0px;
    z-index: 5;
    transition: border 0.25s linear;
    -webkit-transition: border 0.25s linear;
  }

  .calc-slide input[type="radio"]:checked~.check::before {
    background: #4990e2;
  }

  .calc-slide ul li .check::before {
    display: block;
    position: absolute;
    content: "";
    border-radius: 100%;
    height: 10px;
    width: 10px;
    top: 2px;
    left: 2px;
    transition: 0.25s linear;
    -webkit-transition: 0.25s linear;
  }

  .calc-slide .slide-btn {
    justify-items: flex-start;
    margin-top: auto;
  }

  .calc-slide .slide-btn svg {
    transform: rotate(180deg);
  }

  .calc-slide .displayedImage-crop {
    display: none;
  }

  .calc-slide .slide-btns {
    margin-top: 32px;
  }

  .calc-slide .slide-form {
    background-color: var(--white);
    justify-content: flex-start;
    max-width: 505px;
    position: absolute;
    right: 44px;
    bottom: 44px;
  }

  .calc-slide .slide-form .slide-form-title {
    max-width: 315px;
  }

  .calc-slide .slide-price {
    color: var(--white);
    background-color: var(--red);
    padding: 10px 24px 10px 16px;
    border-radius: 20px;
    width: fit-content;
  }

  .calc-slide .slide-total {
    border-radius: 20px;
    background-color: var(--white);
    padding: 16px 20px;
    margin-bottom: 12px;
    max-width: 450px;
    width: fit-content;
  }

  .calc-slide .slide-total:last-child {
    margin-bottom: 0;
  }

  .calc-slide .calc-slide-steps {
    position: absolute;
    right: 20px;
    bottom: 32px;
    display: flex;
    flex-direction: column;
    align-items: start;
    max-width: 212px;
    width: 100%;
    justify-content: flex-end;
  }

  .calc-slide .calc-slide-steps .steps-text {
    margin-bottom: 8px;
  }

  .calc-slide .calc-slide-steps .steps-box {
    width: 100%;
    height: 6px;
    border-radius: 50px;
    background-color: var(--gray);
  }

  .calc-slide .calc-slide-steps .steps-box .steps-box-item {
    height: 6px;
    width: 0;
    border-radius: 50px;
    background: linear-gradient(158.59deg,
        var(--red) -4.35%,
        var(--red80) 27.49%,
        var(--red60) 62.02%,
        var(--red40) 99.25%);
  }

  #slide3 {
    min-height: 677px;
  }

  #slide3 .slide-form {
    position: relative;
    right: 0;
    bottom: 0;
  }

  #slide3 .slide-title {
    margin-bottom: 32px;
  }

  #slide3 .calc-slide-steps {
    display: none;
  }

  #slide3 .slide-btns {
    gap: 12px;
    flex-direction: column;
  }

  #slide3 .slide-btns .slide-price {
    width: 100%;
    justify-content: center;
  }

  #slide3 .slide-btns .slide-price {
    width: 100%;
  }

  #slide3 .calc-slide-select {
    max-width: 526px;
    width: 100%;
    height: 56;
    border-radius: 20px;
    padding: 16px 32px;
    background-color: var(--white);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }

  #slide3 .calc-select-box {
    position: relative;
    display: inline-block;
    max-width: 526px;
  }

  #slide3 .calc-select-box:after {
    content: "▼";
    padding: 0 8px;
    color: var(--gray);
    font-size: 12px;
    position: absolute;
    right: 35px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
    text-align: center;
    width: 14px;
    height: 10px;
    pointer-events: none;
    box-sizing: border-box;
  }

  .consult__card {
    padding: 28px 0px 0px 0px;
    display: flex;
    flex-direction: column;
    gap: 0;
    height: inherit;
  }

  .consult__card .consult__card-title {
    position: relative;
    z-index: 1;
    text-align: left;
    margin-bottom: 12px;
    padding-left: 20px;
  }

  .consult__card .consult__card-text-block {
    grid-area: tit;
  }

  .consult__card .consult__card-form {
    order: 3;
    grid-area: num;
    align-self: center;
  }

  .consult__card .consult__card-text {
    position: relative;
    padding-left: 20px;
    z-index: 1;
    margin-bottom: 0px;
  }

  .consult__card .consult__card-back {
    position: absolute;
    width: 100%;
    height: inherit;
    top: 0;
    left: 0;
    z-index: 0;
  }

  .consult__card .consult__card-img {
    align-self: center;
    padding-left: 20px;
    order: 2;
    grid-area: ach;
    position: relative;
    right: 35px;
    max-width: 370px;
  }

  .contact-block {
    max-width: 396px;
    padding: 20px 34px 20px 16px;
  }

  .contact-block .contact-block-phone {
    margin-bottom: 12px;
  }

  .contact-block .contact-block-mail {
    margin: 20px 0;
  }

  .contact-block .contact-block-time {
    margin-top: 32px;
  }

  .contact-block .contact-block-time .time-title {
    margin-bottom: 12px;
  }

  .contact-block .contact-block-time .time-item {
    margin-bottom: 12px;
    margin-left: 34px;
  }

  .contact-block .contact-block-time .time-item:last-child {
    margin-bottom: 0;
  }

  .about__inner {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    margin-bottom: 76px;
    align-items: center;
  }

  .about__inner .about__inner-block:nth-child(1) {
    line-height: 1.25;
    flex: 0 0 40%;
  }

  .about__inner .about__inner-block:nth-child(1) .block-crop {
    max-width: 468px;
    max-height: 368px;
    margin-top: inherit;
  }

  .about__inner .about__inner-block:nth-child(1) .block-crop .block-crop-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .about__inner .about__inner-block:nth-child(2) {
    line-height: 1.43;
    flex: 1 0 41%;
  }

  .about__inner .about__inner-block .block-title {
    margin-bottom: 14px;
  }

  .about__inner .about__inner-block .block__list {
    gap: 42px 32px;
  }

  .about__inner .about__inner-block .block__list .block__list-item {
    flex: 1 0 35%;
  }

  .about__inner .about__inner-block .block__list .block__list-item .item {
    flex: 0 0 90%;
    padding: 15px 16px 15px 44px;
    display: flex;
    align-items: center;
  }
}

@media (max-width: 830px) {
  ::-webkit-scrollbar {
    width: 3px;
  }

  .bannner .bannner__inner.inside .bannner-crop {
    transform: translateY(0%);
  }

  .calc-slide .radio-text {
    margin-left: 0px;
    font-size: 12px;
    line-height: 1.15;
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  body,
  html {
    overflow-x: hidden;
  }

  .container {
    padding: 0px 1rem;
  }

  .title-main {
    font-size: 28px;
    line-height: 1.3;
  }

  .bannner .bannner__inner .bannner-block .bannner-crop {
    position: absolute;
    max-width: 210px;
    max-height: 210px;
    top: 0;
    right: 0px;
  }

  .bannner-crop-text {
    text-shadow:
      0px 1px 3px rgba(0, 0, 0, 0.3),
      0px 4px 8px rgba(0, 0, 0, 0.15);
  }

  /* @keyframes scroll {
    from {
      transform: translateX(0);
    }
    to {
      transform: translateX(calc(-100% - 20px));
    }
  }

  .calc-slide .radio-text{
    margin-left: 0;
    animation: scroll 20s linear infinite;
  }
  .slide-label:hover .radio-text {
    animation-play-state: paused;
  }
  .calc-slide .slide-label {
    overflow: hidden;
  } */

  .type__inner {
    display: flex;
    flex-direction: column;
  }

  .type__inner .type-footnote {
    max-width: 783px;
    margin: 0 auto;
    text-align: center;
    margin-bottom: 40px;
  }

  .type__inner .type__switcher {
    display: flex;
    gap: 20px;
    flex-direction: column;
  }

  .type__inner .type__switcher-btns {
    display: flex;
    flex-direction: row;
    border-radius: 20px;
    background-color: var(--graylight);
    min-width: 168px;
    height: fit-content;
  }

  .type__inner .type__switcher-btns .type__switcher-btn {
    cursor: pointer;
    display: flex;
    align-items: center;
    padding: 16px 0;
    justify-content: center;
    transition: 300ms;
    min-width: 200px;
  }

  .type__inner .type__switcher-btns .type__switcher-btn:first-child {
    border-radius: 20px 0px 0px 20px;
  }

  .type__inner .type__switcher-btns .type__switcher-btn:last-child {
    border-radius: 0 20px 20px 0px;
  }

  .type__inner .type__switcher-btns .type__switcher-btn.active {
    background-color: var(--red);
    color: var(--white);
  }

  .type__inner .type__switcher-btns .type__switcher-btn.active:hover {
    background-color: var(--red);
    color: var(--white);
  }

  .type__inner .type__switcher-btns .type__switcher-btn:hover {
    background-color: var(--redlight);
    color: var(--red);
  }

  .type__inner .cards-box {
    width: 100%;
  }

  .type__inner .cards-box-title {
    display: flex;
    justify-content: space-between;
  }

  .type__inner .cards-box-title :nth-child(1) {
    width: inherit;
    text-align: left;
    padding-left: 32px;
  }

  .type__inner .cards-box-title :nth-child(2) {
    display: none;
  }

  .type__inner .cards-box-title :nth-child(3) {
    padding-right: 23%;
  }

  .type__inner .box-title,
  .type__inner .cards-box-title {
    margin-bottom: 12px;
    text-align: left;
  }

  .type__inner .type__switcher-option__cards {
    margin-bottom: 32px;
  }

  .type__inner .type__switcher-colorBtn-red {
    margin: 0 auto;
  }

  .option__cards {
    display: flex;
    gap: 11px;
    flex-direction: column;
    max-height: 450px;
    min-height: 0px;
    width: 100%;
    padding: 5px;
    overflow: auto;
  }

  .option__cards.hide {
    display: none;
  }

  .option__cards.show {
    display: flex;
  }

  .option__cards .option__cards-item {
    display: flex;
    align-items: center;
    background-color: var(--graylight);
    border-radius: 20px;
    padding: 8px 7px 8px 18px;
    gap: 12px;
  }

  .option__cards .option__cards-item :nth-child(2) {
    display: none;
  }

  .option__cards .option__cards-item.whiteBg {
    background-color: var(--white);
  }

  .option__cards .option__cards-item .item-title {
    width: 60%;
  }

  .option__cards .option__cards-item .item-text {
    width: 25%;
    margin-left: auto;
  }

  .option__cards .option__cards-item .item-btn {
    padding: 12px 24px;
    border-radius: 13px;
    height: 40px;
    width: 40px;
    background-color: var(--red);
    transition: 0.3s ease;
  }

  .option__cards .option__cards-item .item-btn-arrow {
    transform: rotate(180deg) translateX(0px);
    transition: 0.3s ease;
  }

  .option__cards .option__cards-item .item-btn:hover {
    box-shadow: 0px 1px 2px 0px #0000004d;
  }

  .option__cards .option__cards-item .item-btn:hover .item-btn-arrow {
    transform: rotate(180deg) translateX(-4px);
  }

  .idea-list {
    gap: 20px;
  }

  .idea-list .list-item {
    flex: 1 0 100%;
    padding: 28px;
    border-radius: 20px;
  }

  .header__inner {
    position: relative;
    z-index: 1;
    padding-top: 12px;
  }

  .header__inner .header__top {
    flex-wrap: wrap;
    justify-content: center;
  }

  .header__inner .header__top .header__top-right-side {
    flex: 1 0 100%;
  }

  .header__inner .header__top .header__top-right-side .right-side-btns {
    display: none;
  }

  .header__inner .header__top .header__top-right-side .right-side-text {
    display: none;
  }

  .header__inner .header__top .header__top-logo-block {
    flex: 1 0 65%;
  }

  .header__inner .header__top .header__top-phones {
    flex: 1 0 27%;
    display: none;
  }

  .header__inner .header__top .header__top-phones.mobile {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .header__inner .header__top .header__bottom {
    margin-top: 0px;
    width: 100%;
    display: none;
    border-radius: 100px;
    padding: 24px;
  }

  .header__inner .header__top .header__bottom.active {
    display: block;
    position: absolute;
    top: 120px;
    left: 0;
  }

  .header__inner .header__top .header__bottom .header__bottom-menu {
    justify-content: center;
    display: flex;
    flex-direction: column;
    gap: 32px;
  }

  .header__inner .header__top .header__bottom .header__bottom-menu .menu-link {
    display: inline-block;
    transition: 0.3s ease;
    font-weight: 700;
    font-size: 20px;
  }

  .right-side-btns {
    display: none;
  }

  .right-side-btns.mobile {
    display: flex;
    margin: 0 auto;
    margin-top: 20px;
    gap: 20px;
    flex: 1 0 100%;
    flex-direction: column-reverse;
    align-items: center;
  }

  .right-side-btns.mobile .right-side-defaultBtn {
    width: 100%;
  }

  .right-side-btns.mobile .right-side-colorBtn {
    width: 100%;
  }

  .header__top-phones.mobile {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 32px;
  }

  .bannner .bannner__inner {
    padding: 0;
    display: grid;
    gap: 20px 20px;
    align-items: start;
    grid-template: "tit tit tit tit tit tit tit tit tit tit" minmax(43px, auto) "num num num num num num num num num num" minmax(43px,
        auto
      ) "ban ban ban ban ban ban ban ban ban ban" minmax(43px, auto) "ach ach ach ach ach ach ach ach ach ach" minmax(43px,
        auto
      ) "text text text text text text text text text text" minmax(43px, auto) / 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  }

  .bannner .bannner__inner .bannner__info .bannner__info-h1 {
    margin-bottom: 24px;
  }

  .bannner .bannner__inner .bannner-block .bannner-crop-text {
    /* margin: 190px 0 20px 10px; */
    bottom: 20px;
    left: 10px;
  }

  .pcNone {
    display: block;
    margin: 0 auto;
    margin-top: 12px;
  }

  .pcNone path {
    fill: var(--red);
  }

  .bannner .bannner__inner .bannner__achievement-cards {
    align-items: start;
    flex-direction: column;
  }

  .bannner .bannner__inner .bannner__achievement-cards .achievement-card {
    flex: 1 0 100%;
    width: 100%;
    justify-content: flex-start;
  }

  .bannner .bannner__inner.product {
    grid-template: "tit tit tit tit tit tit tit tit tit tit tit tit" minmax(43px, auto) "num num num num num num num num num num num num" minmax(43px,
        auto
      ) "ban ban ban ban ban ban ban ban ban ban ban ban" minmax(43px, auto) "text text text text text text text text text text text text" minmax(43px,
        auto
      ) "ach ach ach ach ach ach ach ach ach ach ach ach" minmax(43px, auto) / 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    padding: 20px 12px;
    border-radius: 20px;
    position: relative;
  }

  .bannner .bannner__inner.product .bannner-title {
    margin-bottom: 18px;
    width: 90%;
  }

  .bannner .bannner__inner.product .bannner__achievement-cards {
    align-items: start;
    flex-direction: column;
  }

  .bannner .bannner__inner.product .bannner__achievement-cards .achievement-card {
    padding: 10px;
  }

  .bannner .bannner__inner.product .bannner-block {
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .bannner .bannner__inner.product .bannner-block .bannner-crop {
    top: 10px;
    position: relative;
    z-index: 0;
  }

  .bannner .bannner__inner.product .bannner-block .bannner-crop-text {
    display: flex;
    gap: 10px;
    position: relative;
    z-index: 10;
    transform: translateY(-35px);
    margin: 0;
  }

  .bannner .bannner__inner.product .bannner-block .bannner-crop-text .title-main {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 86px;
    height: 86px;
  }

  .bannner .bannner__inner.product .bannner-block .bannner-crop-text .text-item {
    border-radius: 20px;
    padding: 10px;
    min-height: 92px;
    display: flex;
    align-items: center;
    max-width: 171px;
  }

  .bannner .bannner__inner.product .bannner-block .bannner-crop-line {
    position: relative;
    width: 100%;
    height: 1px;
    margin-bottom: 7px;
  }

  .bannner .bannner__inner.product .bannner-block .bannner-crop-end {
    display: flex;
    flex-direction: column;
    gap: 7px;
    text-align: center;
    position: relative;
  }

  .bannner .bannner__inner.product .bannner-block .bannner-crop-end .end-connect {
    position: absolute;
    width: 32px;
    height: 42px;
    right: -15px;
    top: 10px;
  }

  .bannner .bannner__inner.product .bannner-background {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
  }

  .bannner .bannner__inner.inside {
    grid-template: "tit tit tit tit tit tit tit " minmax(43px, auto) "ban ban ban ban ban ban ban " minmax(43px, auto) "btns btns btns btns btns btns btns " minmax(43px,
        auto
      ) "ach ach ach ach ach ach ach " minmax(43px, auto) / 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    margin-bottom: 0px;
  }

  .bannner .bannner__inner.inside .seo-btns {
    justify-content: center;
  }

  .bannner .bannner__inner.inside .bannner-block {
    border-radius: 20px;
    background: linear-gradient(158.59deg,
        var(--red) -4.35%,
        var(--red80) 27.49%,
        var(--red60) 62.02%,
        var(--red40) 99.25%);
    overflow: inherit;
    height: 100%;
  }

  .bannner .bannner__inner.inside .bannner-block .bannner-crop {
    position: relative;
    margin: 0 auto;
  }

  .bannner .bannner__inner.inside .bannner-paragraf {
    text-align: center;
    width: 100%;
  }

  .bannner .bannner__inner.inside .bannner-title {
    text-align: center;
  }

  .advantages-cards {
    gap: 20px;
  }

  .advantages-cards .advantages-card {
    flex: 1 0 100%;
  }

  .plus-card {
    flex: 1 0 100%;
  }

  .map #map {
    height: fit-content;
  }

  .map .ymaps-2-1-79-inner-panes,
  .map .ymaps-2-1-79-map {
    height: 380px !important;
  }

  .map.inside #map {
    margin-bottom: 32px;
  }

  .map .map-block {
    position: relative;
    z-index: 99;
    margin: 0 auto;
    margin-bottom: 32px;
  }

  .map .map-block.inside {
    max-width: 568px;
    position: relative;
    z-index: 1;
    margin: 0;
    flex: 1 0 49%;
    padding: 28px 24px;
  }

  .map .map-block.inside .contact-block-nums {
    margin-bottom: 8px;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
  }

  .map .map-block.inside .contact-block-mail {
    margin: 15px 0;
  }

  .map .map-box {
    display: flex;
    gap: 32px;
    flex-wrap: wrap;
  }

  .footnote-block {
    flex-direction: column;
  }

  footer {
    position: relative;
  }

  footer .footer__inner {
    flex-direction: column;
    padding: 40px 0 76px 0;
    display: flex;
    gap: 40px;
  }

  footer .footer__inner .footer__info {
    flex: 0 0 34%;
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
  }

  footer .footer__inner .footer__info .footer__info-text {
    margin: 14px 0 27px 0;
    line-height: 1.28;
  }

  footer .footer__inner .footer__info .footer__top-logo-block {
    margin: 0;
    flex: 1 0 70%;
  }

  footer .footer__inner .footer__nav {
    gap: 40px;
    flex-direction: column;
  }

  footer .footer__inner .footer__nav .footer__nav-card {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
  }

  footer .footer__inner .footer__nav .footer__nav-card:nth-child(1) {
    flex: 1 0 35%;
  }

  footer .footer__inner .footer__nav .footer__nav-card:nth-child(2) {
    flex: 1 0 35%;
    order: 3;
  }

  footer .footer__inner .footer__nav .footer__nav-card:nth-child(3) {
    order: 2;
    flex: 1 0 100%;
    flex-direction: column;
    gap: 20px;
  }

  footer .footer__inner .footer__nav .footer__nav-card .card-text {
    flex: 1 0 100%;
    margin-bottom: 20px;
  }

  footer .footer__inner .footer__nav .footer__nav-card ul {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: fit-content;
    margin-right: auto;
  }

  .footer__contacts {
    display: flex;
    gap: 35px;
    flex-wrap: wrap;
  }

  .footer__contacts .footer__contacts-link {
    display: flex;
    flex-direction: column;
    gap: 13px;
  }

  .footer__contacts .address-links-btns {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
  }

  .info__inner {
    flex-wrap: wrap;
    gap: 40px;
  }

  .static-card {
    flex: 1 0 100%;
    text-align: center;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .static-card .card-img {
    position: relative;
    top: -32px;
  }

  .quantity__inner-list {
    display: flex;
    gap: 20px;
    align-items: flex-end;
    flex-wrap: wrap;
  }

  .quantity__inner-list .list-item {
    flex: 1 0 25%;
  }

  .quantity__inner-list .list-item:nth-child(1) .item-block {
    height: calc(1 * 165px);
  }

  .quantity__inner-list .list-item:nth-child(2) .item-block {
    height: calc(0.42 * 165px);
  }

  .quantity__inner-list .list-item:nth-child(3) .item-block {
    height: calc(0.37 * 165px);
  }

  .quantity__inner-list .list-item:nth-child(4) .item-block {
    height: calc(0.57 * 165px);
  }

  .quantity__inner-list .list-item:nth-child(5) .item-block {
    height: calc(0.9 * 165px);
  }

  .quantity__inner-list .list-item:nth-child(6) .item-block {
    height: calc(1 * 165px);
  }

  .quantity__inner-list .list-item .item-block {
    display: flex;
    padding: 0;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 20px 20px 0 0;
  }

  .quantity__inner-list .list-item .item-text {
    margin-top: 20px;
    text-align: center;
  }

  .about__inner {
    display: inherit;
    margin-bottom: 76px;
  }

  .about__inner .about__inner-block:nth-child(1) {
    float: left;
    line-height: 1.25;
    margin: 0 20px;
    flex: 0 0 10%;
    position: relative;
    max-width: 122px;
  }

  .about__inner .about__inner-block:nth-child(2) {
    line-height: 1.43;
    flex: 1 0 41%;
  }

  .about__inner .about__inner-block .block-title {
    margin-bottom: 30px;
  }

  .about__inner .about__inner-block .block__list {
    gap: 42px 32px;
  }

  .about__inner .about__inner-block .block__list .block__list-item {
    flex: 1 0 35%;
  }

  .about__inner .about__inner-block .block__list .block__list-item .item {
    flex: 0 0 90%;
    padding: 15px 16px 15px 44px;
    display: flex;
    align-items: center;
  }

  .popup {
    padding: 30px 0px 0px 0px;
    max-width: 335px;
  }

  .popup .popup-title {
    padding: 0 20px;
  }

  .popup form {
    flex-direction: row;
  }

  .popup .close {
    right: 10px;
    top: 10px;
  }

  header {
    box-shadow: 0px 1px 3px 1px #00000026;
  }

  .header__top-mobile-phone {
    display: flex;
    gap: 6px;
  }

  .header__top-mobile-phone a {
    color: var(--red);
    font-size: 12px;
    font-weight: 500;
  }

  .header__top-mobile-phone span {
    display: block;
    color: var(--gray);
    font-size: 12px;
    font-weight: 500;
  }

  .history {
    margin: 12px 0 16px 0;
  }

  .history .history__inner {
    margin-bottom: 0px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    overflow: auto;
  }

  .history .history__inner a {
    min-width: fit-content;
  }

  .history .history__inner svg {
    margin: 0 5px;
    flex: 1 0 2%;
  }

  .history .history__inner :last-child {
    flex: 1 0 101%;
    display: inline-block;
  }

  .header__inner {
    position: relative;
    z-index: 1;
    padding-top: 4px;
    padding-bottom: 6px;
  }

  .header__inner .header__top {
    flex-wrap: wrap;
    gap: 6px 9px;
    justify-content: flex-start;
  }

  .header__inner .header__top .header__top-phone {
    flex: 1 0 100%;
    margin: 0;
    margin-right: 0;
    margin-bottom: 28px;
    margin-top: 20px;
    text-decoration: none;
  }

  .header__inner .header__top .header__top-address {
    flex: 0 0 20%;
    margin-left: 45px;
  }

  .header__inner .header__top .address-btn {
    line-height: 1.18;
    display: none;
  }

  .header__inner .header__top .address-btn-img {
    margin-right: 10px;
  }

  .header__inner .header__top .header__top-colorBtn {
    flex-shrink: 0;
  }

  .header__inner .header__bottom {
    margin-top: 0px;
    width: 100%;
    display: none;
    border-radius: 100px;
    padding: 24px;
  }

  .header__inner .header__bottom.active {
    display: block;
    position: absolute;
    top: 120px;
    left: 0;
  }

  .header__inner .header__bottom .header__bottom-menu {
    justify-content: center;
    display: flex;
    flex-direction: column;
    gap: 32px;
  }

  .header__inner .header__bottom .header__bottom-menu .menu-link {
    display: inline-block;
    transition: 0.3s ease;
    font-weight: 700;
    font-size: 20px;
  }
}

@media (max-width: 520px) {
  .bannner {
    margin-bottom: 32px;
  }

  .bannner .bannner__inner .bannner_img {
    opacity: 0.7;
    width: 289px;
  }

  .phone-cards {
    gap: 20px;
  }

  .phone-cards .phone-card {
    max-width: 100%;
    flex: 1 0 100%;
  }
}

@media (max-width: 520px) {
  header {
    z-index: 99;
    background: var(--white);
    position: sticky;
    top: 0px;
  }

  .modal_menu {
    z-index: 1000;
  }
}

/*# sourceMappingURL=style.css.map */

.sale_block-modal {
  background-color: var(--red);
  position: fixed;
  bottom: 0px;
  color: var(--white);
  z-index: 95;
  width: 100%;
  padding-top: 10px;
  padding-bottom: 10px;
}

.sale_block-modal.hide {
  opacity: 0;
  pointer-events: none;
}

.sale_block-modal .form {
  padding: 0;
  background: none;
  background-color: none;
  flex-wrap: nowrap;
}

.sale_block-modal .form .form__input-btn {
  min-width: fit-content;
}

.sale_block-modal .form .form__input {
  min-width: fit-content;
  padding: 10px;
  border: none;
}

.sale_block-modal .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

@media (max-width: 1050px) {
  .sale_block-modal {
    display: none;
  }
}

.text-preloder {
  display: flex;
  flex-direction: column;
}

.text-preloder span {
  display: block;
  width: 100%;
  text-align: center;
  padding: 30px 0 0 0;
  font-size: 20px;
  font-weight: 600;
}

.text-preloder img {
  width: 100%;
  height: 240px;
  object-fit: contain;
}

.text-cards .text-cards-item .item-title {
  width: calc(100% - 45px);
}

.type__footer {
  flex-direction: row !important;
  flex-wrap: wrap;
}

.type__footer li {
  margin-right: 15px;
  flex: 0 0 30%;
}

.lines-block {
  overflow: auto;
  display: flex;
  align-items: center;
  gap: 15px;
  padding-bottom: 5px;
  margin-bottom: 16px;
}

.lines-block .lines-block__item {
  max-width: 160px;
  width: fit-content;
  min-width: fit-content;
  font-size: 14px;
  border-radius: 100px;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.style-text h2 {
  color: var(--black);
  margin-top: 20px;
  margin-bottom: 20px;
  font-family: "Roboto", sans-serif;
  line-height: 1.22;
  font-weight: 500;
  font-size: 36px;
  color: var(--black);
  text-align: center;
}

.style-text p {
  font-weight: 500;
  color: var(--gray);
  font-size: 16px;
  line-height: 1.5;
}

.style-text span {
  color: var(--red);
}

.style-text ol {
  padding-left: 26px;
  margin-bottom: 26px;
}
.style-text ul {
  padding-left: 26px;
  margin-bottom: 26px;
}

.style-text li {
  font-weight: 500;
  color: var(--gray);
  font-size: 16px;
  line-height: 1.5;
  margin-bottom: 10px;
  list-style-type: disc;
}

.error_box {
  display: flex;
  gap: 25px;
  align-items: baseline;
  justify-content: center;
  padding-top: 91px;
  flex-wrap: wrap;
}

.error-title {
  color: var(--red);
  font-weight: 700;
  font-size: 215px;
  line-height: 1.075;
}

.error-text {
  font-size: 57px;
  font-weight: 700;
  color: var(--gray);
  line-height: 1.12;
}

.error-foornote {
  margin: 44px auto;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  max-width: 500px;
  text-align: center;
}

.error-btn {
  display: block;
  margin: 0 auto;
  text-align: center;
  align-items: center;
  border-radius: 100px;
  height: fit-content;
  width: fit-content;
}

@media (max-width: 1050px) {
  .error_box {
    gap: 15px;
    padding-top: 72px;
  }

  .error-title {
    font-size: 100px;
  }

  .error-text {
    font-size: 36px;
  }

  .error-foornote {
    font-size: 16px;
  }
}

.title--all_form {
  margin-bottom: 6px;
  font-size: 21px;
  font-weight: 700;
  line-height: 27px;
  color: var(--red);
}

.consult__card .consult__card-form {
  padding: 10px 41px 20px 41px;
}

.job_box {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
}

.job-card {
  flex: 1 0 30%;
  max-width: 386px;
  border-radius: 20px;
  background-color: var(--graylight);
  padding: 20px 24px 28px;
  position: relative;
  min-height: 366px;
  display: flex;
  flex-direction: column;
}

@media (max-width: 1050px) {
  .job-card {
    flex: 1 0 45%;
  }
}

@media (max-width: 830px) {
  .job-card {
    flex: 1 0 100%;
  }

  .job_box {
    justify-content: center;
    gap: 20px;
  }
}

.job-card .title-submain {
  font-size: 22px;
  line-height: 28px;

  font-weight: 400;
  text-align: center;
  max-width: 251px;
  margin: 0 auto;
  margin-bottom: 20px;
  /* margin-bottom: 36px; */
}

.job-card-status {
  text-align: right;
  font-size: 14px;
  font-weight: 500;
  color: var(--red);
  margin-bottom: 18px;
}

.job-card-search {
  max-width: 251px;
  font-size: 14px;
  font-weight: 500;

  line-height: 1.4;
  text-align: center;
  margin: 0 auto;
  margin-bottom: 24px;
  margin-top: auto;
}

.job-card-search span {
  color: var(--red);
}

.job-card-price {
  max-width: 210px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  text-align: center;
  margin: 0 auto;
  margin-bottom: 36px;
}

.job-card-price span {
  color: var(--red);
}

.job_seo-text {
  font-size: 16px;
  font-weight: 500;
  max-width: 766px;
  margin: 0 auto;
  text-align: center;
  line-height: 1.5;
  margin-top: 40px;
}

.popup.popup-job {
  padding: 32px;
  max-width: 736px;
  max-height: 660px;
  overflow: auto;
}

.popup.popup-job.active {
  transform: translate(-50%, 5%) scale(1);
}

@media (max-width: 830px) {
  .popup.popup-job {
    max-height: 550px;
    padding: 10px;
  }
}

.popup .item-block-text {
  display: flex;
  flex-direction: column;
}

.popup .popup-job-title {
  font-size: 22px;
  font-weight: 400;
  margin-bottom: 24px;
  text-align: left;
}

.popup .item-block-text p {
  text-align: left;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  margin-bottom: 24px;
}

.popup .item-block-text p.price {
  color: var(--red);
}

.popup .item-block-text h3 {
  text-align: left;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
}

.popup .item-block-text ul {
  text-align: left;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  margin-bottom: 24px;
}

.job-form .consult__card .consult__card-title {
  margin-bottom: 0;
}

@media (min-width: 992px) {
  .job-form .consult__card .consult__card-img {
    right: 113px;
    top: 0;
    bottom: 0;
    margin: auto;
  }
}

.job-form .consult__card .consult__card-form {
  padding: 32px;
}

.content_form {
  width: 100%;
  display: flex;
}

.content_form input {
  width: 100%;
  height: 40px;
  padding: 12px 24px;
  border-radius: 100px;
  border: 1px solid #727171;
  color: var(--black);
  font-size: 12px;
}

.content_form div.left,
.content_form div.right {
  width: 100%;
}

.content_form div.left {
  padding-right: 12px;
  position: relative;
}

.content_form div.right {
  padding-left: 12px;
}

.job-form .consult__card {
  height: auto;
}

.job-form .form .form__input-btn {
  max-width: inherit;
}

.content_form div.right .form__input-check {
  height: 40px;
}

.content_form div.right .form__input-check .check-label-text {
  font-weight: 400;
  line-height: 16px;
  font-size: 12px;
}

.content_form div.right .form__input-check .check-label-text a:hover {
  color: var(--black);
  text-decoration: underline;
}

.vakancii {
  position: absolute;
  z-index: 5;
  top: 100%;
  width: calc(100% - 12px);
  display: flex;
  flex-direction: column;
  border: 1px solid #c8c8c8;
  border-radius: 6px 0 0 6px;
  max-height: 155px;
  overflow-y: auto;
  background-color: white;
}

.vakancii span {
  font-size: 12px;
  cursor: pointer;
  padding: 6px 24px;
}

.vakancii span:hover {
  background-color: #e3e3e3;
}

.vakancii span:last-child {
  margin-bottom: 0;
}

.vakancii {
  display: none;
}

.vakancii.active {
  display: flex;
}

[name="work_input"] {
  cursor: pointer;
}

[name="work_input"]::after {
  content: ">";
  position: absolute;
  right: 15px;
}

.left.click_vak {
  position: relative;
}

.left.click_vak::after {
  content: "";
  position: absolute;
  top: 18px;
  right: 37px;
  border: 5px solid transparent;
  border-top: 5px solid rgb(47, 47, 47);
}

@media (max-width: 768px) {
  .content_form {
    flex-direction: column;
  }

  .content_form div.left,
  .content_form div.right {
    padding: 0;
  }

  .content_form div.left {
    margin-bottom: 14px;
  }

  .vakancii {
    width: 100%;
  }
}

.icon-flag {
  position: relative;
}

.icon-flag::after {
  content: "";
  background-image: url(/public/images/flag.png);
  position: absolute;
  width: 20px;
  height: 20px;
  z-index: 5;
  left: 50px;
  top: 9px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.icon-flag input {
  padding-left: 68px;
}

.title-haracteristiks {
  font-size: 24px;
  font-weight: 700;
  /* padding: 0 0px 15px 0px; */
  border-bottom: 1px solid var(--red);
  padding-bottom: 10px;
  flex: 1 0 100%;
}

.card__haract .cell-1 {
  width: 50%;
}

.card__haract div:last-child {
  text-align: right;
  line-height: 1.2;
  word-wrap: break-word;
  width: 50%;
}

.model-charact--decription {
  line-height: 1.3;
  display: flex;
  gap: 20px 10px;
  /* flex-direction: column; */
  max-height: 401px;
  flex-wrap: wrap;
  min-height: 399px;
  width: 100%;
  padding: 5px;
  overflow: auto;
  justify-content: center;
}

.model-charact {
  flex: 0 0 32%;
  display: flex;
  gap: 11px;
  /* flex-direction: column; */
  flex-wrap: wrap;
}

.card__haract {
  padding: 12px;
  display: flex;
  align-items: center;
  border-radius: 20px;
  font-size: 16px;
  width: 100%;
  /* max-width: 320px; */
}

@media (max-width: 1050px) {
  .model-charact {
    flex: 1 0 45%;
  }

  .card__haract {
    max-width: 100%;
  }
}

@media (max-width: 830px) {
  .model-charact {
    flex: 1 0 100%;
  }

  .no-overflow-mobile {
    max-height: none;
    overflow: inherit;
  }
}

.payment {
  margin-top: 32px;
}

.payment img {
  width: 100%;
  height: 100%;
  max-height: 100px;
  object-fit: contain;
  object-position: left;
}

.section_mafunction {
  padding: 50px 0 80px;
}

.card__mulfunction {
  padding: 6px 14px;
  box-shadow: 0 5px 10px rgb(0 0 0 / 20%);
  border-radius: 6px;
  transition: all 0.3s;
  cursor: pointer;
}

.card__mulfunction:hover {
  box-shadow: 0 5px 10px rgb(0 0 0 / 40%);
}

.garmoshka {
  display: none;
  font-size: 18px;
  padding-top: 14px;
  font-weight: 500;
}

.colorShow {
  color: var(--color_brand);
}

@media (max-width: 992px) {
  .section_mafunction {
    padding: 20px 0;
  }
}

.title_mulfunction {
  display: flex;
}

.title_mulfunction div {
  width: 85%;
  display: flex;
  align-items: center;
  transition: all 0.3s;
  padding-left: 4px;
}

.title_mulfunction.colorShow div {
  width: 100%;
  background: var(--red);
  color: white;
  border-radius: 4px 0 0 4px;
  justify-content: center;
  padding: 0 4px;
  text-transform: uppercase;
}

.title_mulfunction button {
  background-color: var(--red);
  height: 36px;
  width: 15%;
  margin-left: auto;
  border: 1px solid var(--red);
  border-radius: 4px;
  padding: 2px;
}

.title_mulfunction.colorShow button {
  width: 0%;
  border-radius: 0 4px 4px 0;
}

.title_mulfunction button svg {
  width: 100%;
  height: 100%;
}

.title_mulfunction button svg path {
  stroke: white;
}

.malfunction.box_show {
  width: 100%;
  background: white;
  border: none;
  text-align: start;
  display: block;
  font-size: 16px;
  margin-bottom: 8px;
}

.malfunction.box_show:hover {
  color: var(--red);
}

.all_row {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  padding: 0 12px;
}

@media (max-width: 992px) {
  .all_row {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 578px) {
  .all_row {
    grid-template-columns: repeat(1, 1fr);
  }
}

@media (min-width: 831px) {
  .all-service {
    display: none;
  }
}

@media (max-width: 830px) {
  .pc-popup {
    display: none;
  }

  .header__inner .header__top {
    gap: 0px;
  }

  main {
    margin-top: 12px;
  }

  .bannner-block.ban {
    display: none;
  }

  .bannner .bannner__inner .text {
    order: 10;
  }

  .bannner .bannner__inner {
    display: flex;
    flex-direction: column;
  }

  .phone-cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }

  .bannner .bannner__inner .bannner__achievement-cards {
    width: 100%;
  }

  .achievement-cards {
    gap: 20px;
  }

  .phone-cards .phone-card {
    min-height: inherit;
    height: 165px;
  }

  .phone-cards .info-btn {
    display: none;
  }

  .phone-cards .phone-card .phone-card-info {
    display: flex;
    justify-content: center;
  }

  .phone-cards .phone-card .phone-card-info .info-title {
    margin-bottom: 0;
    left: 0;
    transform: translateX(0);
  }

  .phone-cards .phone-card .phone-card-crop {
    margin-bottom: 8px;
  }

  .button-card {
    grid-template-columns: repeat(1, 1fr);
  }

  .option__cards {
    max-height: 285px;
  }

  .list-item-img {
    display: none;
  }

  .idea-list .list-item {
    min-height: inherit;
  }

  .list-item .list-item-text {
    margin-bottom: 20px;
  }

  .consult__card .consult__card-img {
    display: none;
  }

  .consult__card .consult__card-text {
    margin-bottom: 20px;
  }

  .option__cards {
    overflow-y: hidden;
    max-height: inherit;
  }

  .cards-box .option__cards .option__cards-item:nth-child(n + 5) {
    display: none;
  }

  .cards-box .option__cards.active .option__cards-item:nth-child(n + 5) {
    display: flex;
  }
}

.phone-cards .phone-card {
  min-height: 250px;
  max-height: 250px;
}

.phone-cards .phone-card .phone-card-info {
  display: flex;
  justify-content: center;
}

.phone-cards .phone-card .phone-card-info .info-title {
  width: 100%;
  display: flex;
  justify-content: center;
}

.text-style-price {
  font-size: 15px;
  line-height: 1.2;
}

.phone-cards .phone-card .phone-card-info {
  flex-direction: column;
}

.phone-cards .phone-card.product .phone-card-info .product-title {
  margin-bottom: 10px;
}

.type__inner .type__switcher-btns {
  max-height: 401px;
  min-height: 399px;
  overflow: auto;
  padding-right: 10px;
}

.type__inner .type__switcher-btns {
  background-color: white;
  gap: 10px;
}

.type__inner .type__switcher-btns .type__switcher-btn {
  background-color: var(--graylight);
}

@media (max-width: 992px) {
  .bannner .bannner__inner form.form.num {
    order: 11;
  }

  .bannner .bannner__inner.product .bannner-block {
    order: 12;
  }
}



@media (min-width: 831px) {
  .pc-none {
    display: none;
  }

  .header__inner .header__top {
    justify-content: space-between;
  }
}

@media (max-width: 830px) {
  .mobile-none {
    display: none;
  }

  .burger-menu {
    background-color: white;
  }

  .burger-menu .line {
    background-color: #333;
  }

  .logo-block {
    width: 130px;
    padding-top: 1px;
  }

  .logo-block .city-changer {
    line-height: 0;
    font-size: 10px;
    color: #333;
    padding-top: 3px;
    text-align: center;
  }

  .header__top-mobile-phone {
    margin: auto 0 auto auto;
    width: 170px;
    gap: 0;
    flex-direction: column;
  }

  .burger-menu {
    order: 10;
    padding: 18px 4px;
    margin: auto 0 auto auto;
  }

  .header__inner .header__top .header__top-logo-block {
    flex: inherit
  }

  .header__inner .header__top .header__top-right-side {
    display: none;
  }

  .header__inner .header__top {
    gap: 0px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }

  .header__top-mobile-phone a {
    font-size: 18px;
    font-weight: 700;
    line-height: 22px;
  }

  .dropdown .dropbtn img {
    display: none;
  }

  .logo-block .city-changer button a {
    text-transform: uppercase;
    font-size: 10px;
    line-height: 0;
  }

  header {
    box-shadow: 0px 0px 0px 0px #00000026;
    border-bottom: 1px solid #eee;
  }

  .header__top-mobile-phone span {
    font-size: 11px;
    text-align: center;
  }
}

@media (min-width: 831px) {
  .mobila-city {
    display: none;
  }
}


@media (max-width: 830px) {
  .pc-city {
    display: none !important;
  }

  .dropdown.cont .dropbtn {
    font-size: 9px;
  }

  .cont {
    display: contents;
    line-height: 12px;
  }

  .logo-block .city-changer {
    font-size: 9px;
    line-height: 12px;
  }

  .type__inner .type__switcher-btns {
    min-height: inherit;
  }

  footer .footer__top-logo-block,
  footer .top.burger-menu {
    display: none;
  }
}




.form__input {
  position: relative;
}

.clickOff {
  pointer-events: none;
  opacity: .8;
}

.smsYes,
.smsNo {
  opacity: 0;
  position: absolute;
  top: -19px;
  left: 0;
  right: 0;
  margin: auto;
  border: 1px solid;
  padding: 8px;
  width: fit-content;
  background: white;
  border-radius: 4px;
  z-index: 10;
}

.smsYes.green {
  opacity: 1 !important;
  border-color: green;
  color: green;
  z-index: 10;
}

.smsNo.red {
  opacity: 1 !important;
  border-color: red;
  z-index: 5;
  color: red;
}

.page-spec .list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.page-spec .list .line-descr {
  display: flex;
  align-items: center;
  font-size: 16px;
  line-height: 1.2;
  gap: 8px;
}

.schema.page-spec .container {
  display: flex;
  align-items: center;
}

.schema.page-spec .container .left,
.schema.page-spec .container .right {
  width: 50%;
}

.schema.page-spec .container .right h2 {
  /* padding-top: 30px; */
  font-family: "Roboto", sans-serif;
  line-height: 1.22;
  font-weight: 500;
  font-size: 36px;
  margin-bottom: 32px;
}

.schema.page-spec .container .right p {
  color: #373737;
  font-weight: 400;
  font-size: 16px;
  line-height: 28px;
  letter-spacing: 1.1px;
}

.plus.page-spec {
  margin-bottom: 88px;
  padding: 24px 0;
}

.plus.page-spec .container h2 {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 42px;
  margin-bottom: 32px;
  text-align: center;
}

.plus.page-spec .container p {
  color: #373737;
  font-weight: 400;
  font-size: 16px;
  line-height: 28px;
  margin-bottom: 32px;
  letter-spacing: 1.1px;
}

.advantages-cards.spec {
  display: flex;
  flex-wrap: wrap;

}

.advantages-cards.spec .advantages-card {
  flex: 1 0 45%;
  min-width: 320px;
  max-width: 564px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.spec-page .defaultBtn {
  max-width: 350px;
  cursor: pointer;
  font-weight: 500;
  font-size: 14px;
  display: flex;
  gap: 8px;
  justify-content: center;
  text-align: center;
  align-items: center;
  border-radius: 100px;
  line-height: 1.42;
  transition: all ease 0.3s;
  height: fit-content;
}

@media (max-width:1050px) {
  .schema.page-spec .container {
    flex-direction: column-reverse;
  }

  .schema.page-spec .container .left,
  .schema.page-spec .container .right {
    width: 100%;
  }
}

/* ===== Хедер: адрес отдельным блоком (лого | адрес | телефон), кнопки строкой ниже ===== */
@media (min-width: 831px) {
  .header__inner .header__top {
    flex-wrap: wrap;
    align-items: flex-start;
    column-gap: 24px;
    row-gap: 14px;
  }

  .header__inner .header__top .header__top-logo-block {
    flex: 0 0 auto;
  }

  /* лого-блок в колонку: при wrap-раскладке max-content считается как «лого + текст в одну
     строку» (~360px) и блок резервирует пустые ~150px справа, отжимая адрес/телефон от лого */
  .header__inner .header__top .logo-block {
    flex-direction: column;
    align-items: flex-start;
  }

  .header__inner .header__top .logo-block .city-changer {
    flex: 0 0 auto;
  }

  .header__inner .header__top .header__top-address {
    flex: 0 0 auto;
  }

  .header__inner .header__top .header__top-phones {
    flex: 0 0 auto;
    margin-right: 0;
  }

  .header__inner .header__top .header__top-right-side {
    flex: 1 0 100%;
    margin-left: 0;
  }

  .header__inner .header__top .header__top-right-side .right-side-btns {
    flex: 1 0 100%;
    justify-content: flex-end;
  }
}

/* ПК (≥1201px): кнопки «Статус ремонта / Заказать звонок» идут отдельной строкой под «Горячей линией» —
   подтягиваем их ближе, убирая лишний вертикальный зазор (его создаёт высокий лого-блок в первом ряду): ~56px → ~12px */
@media (min-width: 1201px) {
  .header__inner .header__top .header__top-right-side {
    margin-top: -44px;
  }
}

@media (max-width: 830px) {
  .header__inner .header__top .header__top-address {
    display: none;
  }
}

/* === Этапы работы (степпер) — контентный тег «Этапы главная» / stageswork_main === */
.stages .steps-nav {
  display: flex;
  align-items: center;
  margin-bottom: 32px;
  flex-wrap: wrap;
  gap: 16px 0;
}
.stages .step-number {
  width: 48px;
  height: 48px;
  background-color: var(--red);
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 1.1rem;
  transition: background-color 0.3s;
}
.stages .arrow {
  width: 16px;
  height: 2px;
  background-color: #d1d5db;
  margin: 0 16px;
}
.stages .step-buttons {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.stages .step-button {
  padding: 8px 16px;
  border: 1px solid var(--red);
  color: var(--red);
  background-color: transparent;
  border-radius: 6px;
  cursor: pointer;
  transition: 0.2s;
  font-size: 0.9rem;
}
.stages .step-button:hover {
  background-color: var(--redlight);
}
.stages .step-button.active {
  background-color: var(--red);
  color: #fff;
}
.stages .content-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start;
}
.stages .image-placeholder {
  background-color: #f3f4f6;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 300px;
  max-height: 420px;
}
.stages .image-placeholder img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.stages .content-text {
  padding: 20px;
}
.stages .content-text h3 {
  font-size: 1.25rem;
  margin-bottom: 16px;
  color: #1a1a1a;
}
.stages .content-text p {
  margin-bottom: 16px;
  color: #4b5563;
  line-height: 1.4;
  font-size: 18px;
}
.stages .content-text ul {
  padding-left: 20px;
  margin-bottom: 24px;
}
.stages .content-text li {
  margin-bottom: 8px;
}
@media (max-width: 768px) {
  .stages .content-grid {
    grid-template-columns: 1fr;
  }
  .stages .image-placeholder {
    min-height: 220px;
  }
}

/* ============================================================
   Блок «Кейсы / Примеры работ» (теги cases_main / cases_dev)
   Контентщик вставляет в тег ту же HTML-разметку <article class="case">…</article>
   (классы не трогает) — формат тега НЕ менялся.

   30.07: карточка переделана на компактную (было ~800–1000px высоты, стало ~340px):
     .case__grid = [ aside.case__rail | div.case__main ]
     rail  — цветная плашка итога: модель, фото (если есть <img>), цена крупно,
             срок/гарантия, плашки «бесплатно/скидка», кнопка заявки;
     main  — заголовок (суть после «—» подсвечена маркером), лид-абзац,
             «Что сделали» в 2 колонки, вывод, «Подробнее».
   Длинное полотно текста скрыто до клика: .case.is-open снимает обрезку
   и раскрывает .case__collapse. Разметку собирает php_blocks/cases-slider.php.
   Тема — var(--red) (в синих сетках подменяется автоматически).
   ============================================================ */
.cases__list { display: block; }
/* Слайд кейса всегда видим. У шаблона есть общее правило для слайдеров
   `.swiper-wrapper .swiper-slide-next { opacity: 0 }` (эффект «подглядывания» соседнего
   слайда), а Swiper вешает свои классы -active/-next и на наши слайды (slideClass: 'case').
   Когда кейс на странице ОДИН, он при loop получает сразу оба класса — и на мобилке
   (≤830px, где -next перебивает -active) карточка пропадала целиком. Правка 07.08.2026. */
.casesSwiper .swiper-wrapper .case { opacity: 1; }
.case {
  font-family: inherit;
  background: #fff;
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 16px;
  overflow: hidden;
  margin: 0 0 24px;
  box-shadow: 0 6px 26px rgba(16,24,64,.07);
}
.case:last-child { margin-bottom: 0; }
.case__grid {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  align-items: stretch;
}

/* ——— левая плашка: главное, за что цепляется глаз ——— */
.case__rail {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 26px 24px;
  background: linear-gradient(155deg, var(--red, #bf131b) 0%, var(--red80, #e81c23) 100%);
  color: #fff;
  overflow: hidden;
}
.case__rail::after { /* блик, чтобы плашка не была плоской */
  content: '';
  position: absolute;
  right: -70px;
  top: -70px;
  width: 210px;
  height: 210px;
  border-radius: 50%;
  background: rgba(255,255,255,.10);
}
.case__rail::before { /* второй блик снизу — плашка не выглядит пустой, когда чипов мало */
  content: '';
  position: absolute;
  left: -50px;
  bottom: -60px;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: rgba(255,255,255,.07);
}
.case__rail > * { position: relative; z-index: 1; }
.case__label {
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  opacity: .72;
}
.case__badge {
  align-self: flex-start;
  margin-top: -6px;
  padding: 6px 12px;
  border-radius: 9px;
  background: rgba(255,255,255,.18);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.25;
}
.case__photo {
  margin: 0;
  border-radius: 12px;
  overflow: hidden;
}
.case__photo img { display: block; width: 100%; height: 130px; object-fit: cover; }
/* margin-bottom:auto — цена держится сверху, срок/гарантия/кнопка уходят к низу плашки */
.case__price { display: flex; flex-direction: column; gap: 3px; margin-bottom: auto; }
.case__price b {
  font-size: 32px;
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -.01em;
  white-space: nowrap;
}
.case__price span {
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
  opacity: .72;
}
.case__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  margin: 0;
  padding: 14px 0 0;
  list-style: none;
  border-top: 1px solid rgba(255,255,255,.24);
}
.case__stats li { display: flex; flex-direction: column; gap: 2px; }
.case__stats b { font-size: 16px; font-weight: 700; line-height: 1.1; }
.case__stats span {
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
  opacity: .72;
}
.case__pills { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.case__pills li {
  position: relative;
  padding: 5px 11px 5px 25px;
  border-radius: 20px;
  background: rgba(255,255,255,.15);
  font-size: 12.5px;
  line-height: 1.35;
}
.case__pills li::before { content: '✓'; position: absolute; left: 10px; font-weight: 700; }
.case__order {
  display: block;
  width: 100%;
  margin-top: auto;
  padding: 13px 18px;
  border: none;
  border-radius: 10px;
  background: #fff;
  color: var(--red, #bf131b);
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease;
}
.case__order:hover { transform: translateY(-1px); box-shadow: 0 8px 18px rgba(0,0,0,.2); }
.case__order--foot { display: none; } /* дубль кнопки для мобилки — включается в медиа */

/* ——— правая часть: суть кейса ——— */
.case__main { padding: 26px 30px 24px; min-width: 0; }
.case__main .case__head { padding: 0; background: none; border: none; }
.case__head h3 {
  margin: 0 0 12px;
  font-size: 21px;
  font-weight: 700;
  line-height: 1.35;
  color: #15172b;
}
.case__accent { /* «маркером» — самое интересное: в чём была причина */
  color: var(--red, #bf131b);
  background: linear-gradient(to top, var(--redlight, #ffd8d9) 34%, transparent 34%);
  padding: 0 1px;
}
.case__body { padding: 0; }
.case__body p { margin: 0 0 14px; font-size: 14.5px; line-height: 1.7; color: #4c4d5c; }
.case__lead {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.case.is-open .case__lead { display: block; overflow: visible; }
.case.is-open .case__price { margin-bottom: 0; } /* в раскрытом кейсе не растягиваем плашку по вертикали */
.case__subtitle {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--red, #bf131b);
}
.case__list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px 24px;
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}
.case__list li {
  position: relative;
  padding: 2px 0 2px 25px;
  font-size: 13.5px;
  line-height: 1.5;
  color: #3a3b47;
  border: none;
}
.case__list li::before {
  content: '✓';
  position: absolute;
  left: 0;
  top: 2px;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: var(--redlight, #ffd8d9);
  color: var(--red, #bf131b);
  font-size: 10px;
  font-weight: 700;
  line-height: 17px;
  text-align: center;
}
/* в свёрнутом виде показываем максимум 4 пункта — остальное по «Подробнее» */
.case__list--clamp li:nth-child(n+5) { display: none; }
.case.is-open .case__list--clamp li:nth-child(n+5) { display: block; }
.case__takeaway {
  margin: 0;
  padding: 12px 16px 12px 17px;
  border-left: 3px solid #1fa273;
  border-radius: 0 10px 10px 0;
  background: #f0faf5;
  font-size: 13.5px;
  line-height: 1.6;
  color: #1a6b52;
}
.case__cut { /* обрезка вывода до 2 строк (обёртка — чтобы клип не «протекал» в паддинг) */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.case__cut::before { /* метка вывода — сразу капсом в content, без text-transform */
  content: 'ВЫВОД: ';
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
}
.case.is-open .case__cut { display: block; overflow: visible; }
.case__more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 14px 0 0;
  padding: 0;
  border: none;
  background: none;
  color: var(--red, #bf131b);
  font-size: 13.5px;
  font-weight: 700;
  cursor: pointer;
}
.case__more::after { /* шеврон, переворачивается в открытом состоянии */
  content: '';
  width: 7px;
  height: 7px;
  margin-top: -3px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform .2s ease;
}
.case.is-open .case__more::after { margin-top: 2px; transform: rotate(-135deg); }
.case__more:hover { opacity: .8; }
.case__collapse { display: none; margin-top: 14px; }
.case.is-open .case__collapse, .case__collapse.open { display: block; }
.case__collapse .case__subtitle { margin-top: 18px; }
.case__collapse .case__list { margin-bottom: 4px; }
/* чипы: остаются только если скрипт не сработал (без JS) — простые плашки */
.case__chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.case__chip {
  padding: 6px 12px;
  border-radius: 8px;
  background: var(--redlight, #ffd8d9);
  color: var(--red, #bf131b);
  font-size: 13px;
  font-weight: 600;
}
@media (max-width: 1100px) {
  .case__grid { grid-template-columns: 258px minmax(0, 1fr); }
  .case__rail { padding: 22px 20px; }
  .case__main { padding: 22px 22px 20px; }
  .case__price b { font-size: 28px; }
}
@media (max-width: 900px) {
  /* мобилка: плашка итога — компактной шапкой сверху, кнопка уезжает в конец карточки */
  .case__grid { grid-template-columns: 1fr; }
  .case__rail {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: start;
    align-items: end;
    gap: 10px 20px;
    padding: 16px 18px;
  }
  .case__label { display: none; }
  .case__badge { grid-column: 1 / -1; justify-self: start; margin-top: 0; }
  .case__photo { grid-column: 1 / -1; }
  .case__photo img { height: 150px; }
  .case__price { grid-column: 1; margin: 0; }
  .case__price b { font-size: 26px; }
  .case__stats { grid-column: 2; padding-top: 0; border-top: none; gap: 6px 18px; }
  .case__stats b { font-size: 14px; }
  .case__pills { grid-column: 1 / -1; }
  .case__order--rail { display: none; }
  .case__order--foot { display: block; margin-top: 18px; background: var(--red, #bf131b); color: #fff; }
  .case__main { padding: 20px 18px 20px; }
  .case__head h3 { font-size: 18px; }
  .case__list { grid-template-columns: 1fr; gap: 6px; }
  .case__list--clamp li:nth-child(n+4) { display: none; }
  .case.is-open .case__list--clamp li:nth-child(n+4) { display: block; }
  .case__lead { -webkit-line-clamp: 3; }
}

/* — Слайдер кейсов (Swiper): 1 карточка на всю ширину, бесконечный loop, навигация снизу (стрелки + точки).
   Контейнер без класса .swiper (чтобы серверный swiper.js не перехватил) — базовые свойства задаём тут.
   1 кейс → навигация скрыта (watchOverflow), обычная карточка. — */
.casesSwiper { position: relative; overflow: hidden; }
/* flex-shrink:0 ОБЯЗАТЕЛЕН: слайды — это .case (а не .swiper-slide), правило бандла на них не действует,
   без этого два слайда сжимаются в ширину контейнера и видно сразу два. */
.casesSwiper .case { margin: 0; height: auto; flex-shrink: 0; box-sizing: border-box; }
/* нижняя панель: [‹]  • • •  [›] по центру */
.casesSwiper .cases-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 18px;
}
.casesSwiper .cases-nav .swiper-button-prev,
.casesSwiper .cases-nav .swiper-button-next {
  position: static;
  margin: 0;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 10px rgba(0,0,0,.14);
  color: var(--red, #bf131b);
}
/* свой глиф стрелок: на сайте дефолтный swiper-icons обнулён глобально (content:"") */
.casesSwiper .cases-nav .swiper-button-prev::after,
.casesSwiper .cases-nav .swiper-button-next::after { font-family: inherit; font-size: 20px; font-weight: 700; line-height: 1; }
.casesSwiper .cases-nav .swiper-button-prev::after { content: '❮'; }
.casesSwiper .cases-nav .swiper-button-next::after { content: '❯'; }
/* на сайте .swiper-button-next глобально повёрнут на 180° (один значок на обе стрелки) — отменяем, иначе наш ❯ зеркалится в ❮ */
.casesSwiper .cases-nav .swiper-button-next { transform: none; }
.casesSwiper .swiper-pagination { position: static; width: auto; }
.casesSwiper .swiper-pagination-bullet-active { background: var(--red, #bf131b); }
@media (max-width: 600px) {
  .casesSwiper .cases-nav .swiper-button-prev,
  .casesSwiper .cases-nav .swiper-button-next { display: none; } /* на мобиле — свайп + точки */
}


/* ===== ШАПКА: контакты в 2 строки + блоки лого/адрес/телефон слева (стиль конкурента) ===== */
/* телефон повторяет адрес: иконка + колонка (номер сверху подчёркнут, подпись снизу) */
.header__inner .header__top .header__top-phones .right-side-address {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 0 0 auto;
}
/* подчёркиваем значение адреса и номер телефона */
.header__inner .header__top .right-side-address__value {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
/* номер телефона — тем же серым, что и адрес (без ссылочного цвета) */
.header__inner .header__top .header__top-phone a.right-side-address__value {
  color: var(--gray);
}
/* широкий десктоп (>=1301): лого/адрес/телефон + кнопки в ОДНОМ ряду; блоки слева, кнопки справа */
/* nowrap + сжимаемый логоблок, чтобы всё влезло в строку контейнера 1200px; обнуляем зашитый margin-top:-44 у кнопок */
@media (min-width: 1301px) {
  .header__inner .header__top {
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    gap: 12px;
  }
  .header__inner .header__top .header__top-logo-block { flex: 0 1 auto; }
  /* auto-отступы и у адреса, и у кнопок: свободное место делится пополам,
     группа адрес+телефон висит посредине между лого и кнопками */
  .header__inner .header__top .header__top-address { flex: 0 0 auto; margin-left: auto; }
  .header__inner .header__top .header__top-phones { flex: 0 0 auto; margin-right: 0; align-items: center; }
  .header__inner .header__top .header__top-phone { align-items: center; }
  .header__inner .header__top .header__top-right-side { margin-left: auto; margin-top: 0; flex: 0 0 auto; }
  .header__inner .header__top .header__top-right-side .right-side-btns { flex: 0 0 auto; }
}

/* ===== Контактные блочки «иконка в кружке + подпись + значение» (эталон заказчика, 22.07) =====
   Карточка на карте: страница контактов (contact.php) и главная (index.php). Раскладка вертикальная.
   Цвета — брендовые CSS-переменные (base.php переопределяет --red/--redlight на цвета бренда).
   line-height везде явный: сайт даёт глобальный line-height:10px, без явного текст налезает сам на себя. */
.contacts-card { display: flex; flex-direction: column; gap: 10px; padding: 16px; max-width: 380px; }
.contacts-card .cc-item { display: flex; align-items: flex-start; gap: 12px; padding: 12px 14px; border-radius: 12px; background: var(--white, #fff); border: 1px solid #f0f0f2; }
.contacts-card .cc-item--accent { background: var(--redlight, #ffd8d9); border-color: transparent; }
.contacts-card .cc-item__ico { flex: 0 0 38px; width: 38px; height: 38px; border-radius: 50%; background: var(--redlight, #ffd8d9); display: flex; align-items: center; justify-content: center; }
.contacts-card .cc-item--accent .cc-item__ico { background: var(--white, #fff); }
.contacts-card .cc-item__ico svg { width: 19px; height: 19px; color: var(--red, #bf131b); }
.contacts-card .cc-item__badge { display: inline-block; margin: 0 0 6px; font-size: 11px; font-weight: 700; letter-spacing: .04em; line-height: 1.2; text-transform: uppercase; color: var(--red, #bf131b); }
.contacts-card .cc-item__label { margin: 0 0 4px; font-size: 15px; font-weight: 700; line-height: 1.25; color: #222; }
.contacts-card .cc-item__label--brand { color: var(--red, #bf131b); }
.contacts-card .cc-item__value { display: block; font-size: 14px; line-height: 1.4; color: #444; }
.contacts-card a.cc-item__value { text-decoration: underline; color: #333; }
.contacts-card a.cc-item__value:hover { text-decoration: none; }

/* ===== Текстовый лого-локап «REC-<Бренд>» — шапка и подвал (27.08) =====
   До 27.08 рядом с текстовым «REC-» стояла картинка из тега админки logo: она приходила
   в фирменной гарнитуре и цвете ПРОИЗВОДИТЕЛЯ и у каждого бренда сетки была своего
   размера — локап читался двумя разными шрифтами и разъезжался от датасета к датасету.
   Теперь логотип целиком текстовый: «REC-» брендовым цветом (--red переопределяет base.php
   под каждый бренд), название бренда — тёмным.
   Roboto 700 — единственный самохостящийся жирный (у Mulish только 400/500, был бы фейк-болд).
   line-height явный: глобальный line-height:10px иначе схлопывает строку. */
.logo.logo--text {
  display: inline-flex;
  align-items: baseline;
  /* перебиваем .header__logo / .footer__logo { max-width: 140px } — локап шире картинки */
  max-width: none;
  /* даём связке сжиматься: на мобилке рядом стоят телефон и бургер */
  min-width: 0;
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-size: 30px;
  line-height: 1.05;
  letter-spacing: -0.02em;
  /* «REC-» и название — одно слово: перенос между ними и по дефису запрещён */
  white-space: nowrap;
  text-decoration: none;
}

.logo.logo--text .logo-txt__rec {
  color: var(--red);
}

.logo.logo--text .logo-txt__brand {
  color: #1a1a1a;
  transition: color 0.25s ease;
}

.logo.logo--text:hover .logo-txt__brand {
  color: var(--red);
}

/* Длинные названия («REC-Electrolux», «REC-Panasonic») — ступенька мельче,
   иначе в шапке локап упирается в адрес (класс вешает PHP по длине строки) */
.logo.logo--text.logo--text-long {
  font-size: 24px;
}

/* Подпись адреса в подвале и в блоках контактов на карте (21.08) — как в шапке:
   значение сверху, «Адрес сервисного центра REC-<Бренд>» под ним.
   .footer-address — подвал, .sc-address — блоки контактов на карте (php_blocks/inc/sc-brand.php) */
/* «REC-<Бренд>» не должен рваться по дефису (на мобилке ловилось «REC-» / «Dyson») */
.sc-nobr {
  white-space: nowrap;
}

.contact-block .contact-block-address .footer-address,
.contact-block .contact-block-address .sc-address {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1 1 auto;
}
.contact-block .contact-block-address .footer-address__value,
.contact-block .contact-block-address .sc-address__value {
  flex: 0 0 auto;
  line-height: 1.3;
}
.contact-block .contact-block-address .footer-address__caption,
.contact-block .contact-block-address .sc-address__caption {
  flex: 0 0 auto;
  line-height: 1.3;
}

/* до 1300px шапка перестраивается и логоблок становится узким — уменьшаем локап,
   иначе он упирается в адрес и телефон */
@media (max-width: 1300px) {
  .logo.logo--text {
    font-size: 24px;
  }

  .logo.logo--text.logo--text-long {
    font-size: 20px;
  }
}

/* мобилка: в одной строке с логотипом стоят телефон и бургер */
@media (max-width: 830px) {
  .logo.logo--text {
    font-size: 22px;
  }

  .logo.logo--text.logo--text-long {
    font-size: 19px;
  }
}

/* узкие телефоны (iPhone SE и уже) — иначе локап выдавливает бургер за экран */
@media (max-width: 380px) {
  .logo.logo--text {
    font-size: 19px;
  }

  .logo.logo--text.logo--text-long {
    font-size: 17px;
  }
}

/* ---------------------------------------------------------------------------
   Карточка мастера (блок «Наши мастера»): строки фактов — стаж, выполнено
   ремонтов, специализация, образование. Разметка/данные — php_blocks/inc/master-facts.php.
   .block-list — flex-wrap, поэтому каждая строка принудительно на всю ширину,
   иначе короткие строки встают в один ряд с сертификатом.
   --------------------------------------------------------------------------- */
.mySwiper2 .slide-inner .slide-block .block-model.mf-row {
  flex: 1 0 100%;
  margin-bottom: 10px;
  line-height: 1.35;
}

/* последняя строка фактов — отбивка до сертификата */
.mySwiper2 .slide-inner .slide-block .block-model.mf-row:last-of-type {
  margin-bottom: 20px;
}

@media (max-width: 1200px) {
  /* мобилка: карточка по центру, отбивки чуть меньше (специфичность выше правила .block-model) */
  .mySwiper2 .slide-inner .slide-block .block-model.mf-row {
    margin-bottom: 8px;
  }

  .mySwiper2 .slide-inner .slide-block .block-model.mf-row:last-of-type {
    margin-bottom: 14px;
  }
}

/* Десктоп: связка «фото + данные» стоит по центру карточки, а не прижата влево
   (раньше .slide-block растягивался на всё свободное место — справа зияла пустота),
   фото с кнопкой выровнено по середине высоты. ТОЛЬКО ≥1201px: ниже .slide-inner
   переключается на flex-direction: column, и flex-basis там задаёт ВЫСОТУ. */
@media (min-width: 1201px) {
  .mySwiper2 .slide-inner {
    justify-content: center;
    align-items: center;
  }

  .mySwiper2 .slide-inner .slide-block {
    flex: 0 1 480px;
  }

  .mySwiper2 .slide-inner .slide-block .block-list {
    width: 100%;
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   ЮР-ПРАВКИ ПО ТАБЛИЦЕ «Ш1» (03.09.2026)
   ───────────────────────────────────────────────────────────────────────────── */

/* Пометка о предварительном характере цен над таблицей на /tseny (Ш1_05 №12).
   ЗоЗПП ст. 10, ГК РФ ст. 437 п. 2 — на странице цен она обязана быть на виду,
   а не только мелким текстом в подвале. Серая плашка: заметно, но не спорит
   с заголовком таблицы. */
.price-disclaimer {
  margin: -16px 0 28px;
  padding: 12px 16px;
  background: var(--graylight, #f5f5f5);
  border-radius: 10px;
  line-height: 1.45;
}

@media (max-width: 767px) {
  .price-disclaimer {
    margin: -8px 0 20px;
    padding: 10px 12px;
  }
}

/* Строка о независимости сервиса на ПЕРВОМ ЭКРАНЕ, под H1 (Ш1_03 №33, Ш1_04 №36).
   Раньше дисклеймер жил только в подвале, куда пользователь не доходит, — а при
   споре оценивают первое впечатление потребителя (ФЗ-38 ст. 5 ч. 3 п. 20).
   Баннер тёмный, поэтому текст белый с приглушённой прозрачностью: читается,
   но не перетягивает внимание с H1 и формы. */
.hero-independence {
  margin: 10px 0 0;
  opacity: 0.75;
  line-height: 1.4;
}

@media (max-width: 767px) {
  .hero-independence {
    margin-top: 8px;
    font-size: 12px;
  }
}

/* Аватар отзыва — кружок с инициалами вместо фотографии человека (Ш1_03 №23, Ш1_07 №10).
   Фото в карточках отзывов подбирались из датасета ПО ПОЛУ, то есть к конкретному отзыву
   человек на фото отношения не имел: ГК РФ ст. 152.1 (охрана изображения гражданина),
   а для стоковых фото ещё и лицензия обычно запрещает выдавать модель за клиента.

   Оттенок кружка задаётся инлайном через --rev-ava-hue и стабилен для одного имени,
   чтобы аватары не мигали разными цветами при каждой перезагрузке. Размер наследуется
   от родительской обёртки (.profile-name-crop и аналоги), поэтому кружок встаёт ровно
   на место прежней картинки и вёрстку не двигает. */
.rev-ava {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-width: 44px;
  min-height: 44px;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: hsl(var(--rev-ava-hue, 210), 45%, 92%);
  color: hsl(var(--rev-ava-hue, 210), 55%, 32%);
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  user-select: none;
}

/* В слайдере отзывов обёртка задаёт свой размер — кружок просто её заполняет. */
.profile-name-crop .rev-ava,
.slider-item-profile .rev-ava {
  min-width: 0;
  min-height: 0;
}

@media (max-width: 767px) {
  .rev-ava {
    font-size: 14px;
  }
}

/* Сведения об исполнителе и порядок подачи претензий на странице контактов
   (Ш1_08 №7 и №8: ЗоЗПП ст. 9 и ст. 31). Раньше реквизиты были только в подвале,
   а блока претензий не было вовсе. Оформлены как карточка на сером — те же 16px
   и радиус, что у соседней карточки контактов, чтобы не выбиваться из страницы. */
.contacts-legal {
  margin-top: 20px;
  padding: 20px 24px;
  background: var(--graylight, #f5f5f5);
  border-radius: 16px;
}

.contacts-legal__title {
  margin-bottom: 10px;
}

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

.contacts-legal__list li + li {
  margin-top: 6px;
}

.contacts-legal--claims p {
  margin: 0;
  line-height: 1.45;
}

@media (max-width: 767px) {
  .contacts-legal {
    padding: 16px;
    border-radius: 14px;
  }
}

/* Пояснение под заголовком блока метро (Ш1_03 №28). Список из десятков линий и сотен
   станций читался как сеть точек приёма, хотя приём техники идёт по одному адресу,
   а по станциям работают курьер и выезд мастера (ЗоЗПП ст. 10; КоАП ст. 14.7).
   Строка идёт сразу под H2 и ДО ряда веток, чтобы её прочли раньше списка. */
.metro-block__note {
  margin: -20px 0 24px;
  line-height: 1.45;
}

@media (max-width: 767px) {
  .metro-block__note {
    margin: -12px 0 18px;
  }
}

/* «показана часть отзывов» рядом со счётчиками (Ш1_07 №9): на странице выводится
   несколько карточек при заявленных тысячах отзывов — без пояснения это читается
   как несоответствие заявленному количеству (ФЗ-38 ст. 5 ч. 3). */
.reviews-part {
  display: block;
  margin-top: 4px;
  opacity: 0.75;
}

/* ── Плашка скидки внизу экрана: согласие на ПДн и ссылка на правила акции ──────
   Плашка — узкая фиксированная полоса, `.sale_block-modal .container` это flex со
   space-between. Поэтому ссылка «условия» живёт ВНУТРИ текста плашки, а не отдельным
   элементом ряда: пятый элемент в ряду ломал раскладку. Кликабельных элементов в
   плашке ровно два — таймер и кнопка «Оставить заявку». */
.sale-modal__terms {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Строка согласия встаёт ПОД поле и кнопку, а не третьим элементом в их ряду:
   у `.sale_block-modal .form` стоит flex-wrap: nowrap, здесь его перебиваем. */
.sale_block-modal .form {
  flex-wrap: wrap;
}

.sale_block-modal .pd-consent {
  flex: 1 0 100%;
  margin-top: 6px;
  align-items: center;
}

.sale_block-modal .pd-consent .check-label-text {
  font-size: 11px;
  line-height: 1.2;
  color: #fff;
}

.sale_block-modal .pd-consent__label,
.sale_block-modal .pd-consent .check-label-text a {
  color: #fff;
}

/* Подсветка «поставьте галку» на красном фоне красным не видна — берём белую рамку. */
.sale_block-modal .pd-consent.is-required-hint .check-label-text {
  color: #fff;
}

.sale_block-modal .pd-consent.is-required-hint .form-after-text {
  outline: 2px solid #fff;
}

/* Состояние галки на КРАСНОЙ плашке скидки.
   Глобально снятая галка это белый квадрат, а поставленная — квадрат цвета --red
   с белой «птичкой». На красной полосе поставленная галка сливалась бы с фоном
   и выглядела бы наоборот — как снятая. Поэтому здесь состояния инвертированы:
   снятая — белый пустой квадрат, поставленная — белый квадрат с красной «птичкой». */
.sale_block-modal .pd-consent input[type="checkbox"]:checked + .form-after-text {
  background: #fff;
  border: 1px solid #fff;
}

.sale_block-modal .pd-consent input[type="checkbox"]:checked + .form-after-text:before {
  background: var(--red, #bf131b);
}