@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;
  }
}

/* Этапы: своя иконка на каждый этап вместо одного фото main_img (01.10.2026, stage-block.php).
   Видна только .stage-visual.active, переключает тот же JS, что и текст этапа. */
.stages .stages-visuals {
  position: relative;
  display: block;
  min-height: 0;
  max-height: none;
  height: 100%;
  border: 1px solid color-mix(in srgb, var(--red) 14%, #fff);
  border-radius: 16px;
  background: #fff;
  background: radial-gradient(70% 70% at 50% 38%, color-mix(in srgb, var(--red) 10%, #fff) 0%, #fff 100%);
}
.stages .stage-visual {
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  min-height: 320px;
  height: 100%;
  padding: 40px 32px 32px;
  text-align: center;
}
.stages .stage-visual.active {
  display: flex;
  animation: stageVisualIn .35s ease;
}
@keyframes stageVisualIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}
.stages .stage-visual__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 112px;
  height: 112px;
  margin-bottom: 36px;
  border-radius: 50%;
  background: var(--red);
  color: #fff;
  box-shadow: 0 0 0 14px color-mix(in srgb, var(--red) 14%, transparent), 0 0 0 28px color-mix(in srgb, var(--red) 6%, transparent);
}
.stages .stage-visual__icon svg {
  width: 52px;
  height: 52px;
}
.stages .stage-visual__info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.stages .stage-visual__num {
  font-size: 13px;
  line-height: 1.3;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--red);
}
.stages .stage-visual__label {
  font-size: 24px;
  line-height: 1.25;
  font-weight: 700;
  color: #1a1a1a;
}
.stages .stage-visual__bar {
  display: block;
  width: 100%;
  max-width: 260px;
  height: 6px;
  margin-top: 22px;
  border-radius: 6px;
  background: color-mix(in srgb, var(--red) 12%, #fff);
  overflow: hidden;
}
.stages .stage-visual__bar i {
  display: block;
  height: 100%;
  border-radius: 6px;
  background: var(--red);
}
@media (max-width: 768px) {
  /* мобилка: компактная строка «иконка + этап», полоса прогресса под ней */
  .stages .stage-visual {
    display: none;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    min-height: 0;
    padding: 16px;
    gap: 14px 16px;
    text-align: left;
  }
  .stages .stage-visual.active {
    display: flex;
  }
  .stages .stage-visual__icon {
    flex: none;
    width: 56px;
    height: 56px;
    margin: 0;
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--red) 12%, transparent);
  }
  .stages .stage-visual__icon svg {
    width: 28px;
    height: 28px;
  }
  .stages .stage-visual__info {
    flex: 1;
    min-width: 0;
    align-items: flex-start;
    gap: 2px;
  }
  .stages .stage-visual__num {
    font-size: 11px;
  }
  .stages .stage-visual__label {
    font-size: 18px;
  }
  .stages .stage-visual__bar {
    max-width: none;
    height: 4px;
    margin-top: 0;
  }
}

/* ============================================================
   Блок «Кейсы / Примеры работ» (теги 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);
}

/* футер ТЗ янв-26 */
/* Заголовки колонок футера стали <h3> — сбрасываем умолчания браузера, чтобы вид остался как у прежних div.text-24 */
footer .footer__inner .footer__nav .footer__nav-card h3.card-text {
  margin-top: 0;
  margin-left: 0;
  margin-right: 0;
  font-weight: inherit;
  font-family: inherit;
}
/* Колонка филиалов: длинные «Ремонт … в …» переносятся, не распирая сетку */
footer .footer__inner .footer__nav .footer__nav-card {
  min-width: 0;
}
footer .footer__inner .footer__nav .footer__nav-card ul.menu-city-link a {
  overflow-wrap: anywhere;
}

/* Нижняя строка: рейтинг, сайт производителя, шеринг */
footer .footer__inner .footer-extra {
  flex: 1 0 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 40px;
  padding-top: 24px;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}
.footer-rating {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.footer-rating__stars {
  color: #f5b301;
  font-size: 20px;
  line-height: 1;
  letter-spacing: 2px;
}
.footer-rating__value {
  font-weight: 700;
}
.footer-official {
  line-height: 1.4;
}
.footer-official a {
  color: var(--red, #bf131b);
  text-decoration: underline;
}
.footer-official a:hover {
  text-decoration: none;
}
.footer-share {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-left: auto;
}
.footer-share__list {
  display: inline-flex;
  gap: 10px;
}
.footer-share__btn {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.footer-share__btn:hover {
  transform: translateY(-2px);
  opacity: 0.9;
  color: #fff;
}
.footer-share__btn svg {
  display: block;
}
.footer-share__btn--vk { background: #0077ff; }
.footer-share__btn--ok { background: #ee8208; }
.footer-share__btn--tg { background: #26a5e4; }
.footer-share__btn--wa { background: #25d366; }
/* «Мы в соц. сетях» — наши сообщества (06.10.2026, php_blocks/inc/social.php); кнопки те же, что у шеринга */
.footer-social {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.footer-share__btn--dzen { background: #000; }

@media (max-width: 830px) {
  footer .footer__inner .footer-extra {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .footer-share {
    margin-left: 0;
  }
}

/* блоки страниц ТЗ янв-26 */

/* «Преимущества»: h2 + подзаголовок «Мы сервисный центр REC-<Бренд> в <городе> — …» */
.excellence .excellence-title.excellence-title--sub {
  margin-bottom: 16px;
}

.excellence .excellence-subtitle {
  max-width: 820px;
  margin: 0 auto 56px;
  text-align: center;
  line-height: 1.4;
}

@media (max-width: 768px) {
  .excellence .excellence-subtitle {
    margin-bottom: 32px;
  }
}

/* Калькулятор (php_blocks/calc-block.php): список устройств — <ul><li> без визуальных изменений.
   ul/li «растворяются» (display: contents), label остаются flex-элементами .slide-check. */
.calc-slide .slide-check .slide-check-list,
.calc-slide .slide-check .slide-check-item {
  display: contents;
  list-style: none;
  margin: 0;
  padding: 0;
}

/* FAQ: вопрос — h3, ответ — p. Сброс браузерных стилей, чтобы вид не изменился. */
.text-cards .text-cards-item h3.item-title {
  margin: 0;
  font-family: inherit;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
}

.text-cards .text-cards-item p.item-block-text {
  margin: 0;
}

/* Блок «Модели <Бренд>, которые мы ремонтируем» (php_blocks/models-block.php) */
.models-block__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.models-block__item {
  list-style: none;
  min-width: 0;
}

.models-block__grid.is-collapsed .models-block__item--more {
  display: none;
}

.models-block__link {
  display: flex;
  align-items: center;
  height: 100%;
  min-height: 48px;
  padding: 10px 16px;
  border: 1px solid #e3e3e3;
  border-radius: 12px;
  background: var(--white, #fff);
  color: var(--black, #1b1b1b);
  text-decoration: none;
  line-height: 1.25;
  overflow-wrap: anywhere;
  transition: border-color 0.2s, color 0.2s, box-shadow 0.2s;
}

.models-block__link:hover,
.models-block__link:focus-visible {
  border-color: var(--red, #bf131b);
  color: var(--red, #bf131b);
  box-shadow: 0 0 10px 0 #72717126;
}

.models-block__more {
  display: flex;
  justify-content: center;
  margin-top: 24px;
}

.models-block__btn {
  border-radius: 20px;
  padding: 10px 24px;
  cursor: pointer;
}

@media (max-width: 1050px) {
  .models-block__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .models-block__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .models-block__link {
    min-height: 44px;
    padding: 8px 12px;
    font-size: 14px;
    border-radius: 10px;
  }
}

/* техничка ТЗ янв-26 */
/* Прайс таблицей (php_blocks/switcher.php): <table class="option__cards"> выглядит как прежние
   div-карточки — таблица остаётся flex-колонкой (правило .option__cards), tbody «растворяется»,
   строки tr.option__cards-item — flex-ряды, ячейки td — flex-элементы. */
table.option__cards { border-collapse: separate; border-spacing: 0; table-layout: auto; position: relative; }
table.option__cards > tbody { display: contents; }
table.option__cards > .t69-price-table__head {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
table.option__cards td { padding: 0; border: 0; vertical-align: middle; text-align: left; }
table.option__cards td.t69-price-table__btn-cell { display: flex; flex: none; }

/* Контакты: ссылки на страницы контактов в других городах (interface/contact.php) */
.contacts-cities { margin-top: 20px; padding: 20px 24px; background: var(--graylight, #f5f5f5); border-radius: 16px; }
.contacts-cities__title { margin-bottom: 10px; }
.contacts-cities__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 24px; }
.contacts-cities__link { text-decoration: underline; text-underline-offset: 3px; transition: color .2s ease; }
.contacts-cities__link:hover { color: var(--red); }
@media (max-width: 767px) {
  .contacts-cities { padding: 16px; border-radius: 14px; }
  .contacts-cities__list { grid-template-columns: 1fr; }
}

/* Шапка (01.10.2026): «в <городе> ▾» — неразрывным блоком. Раньше при длинном «Сервисный центр REC-<Бренд>»
   на вторую строку уезжала одна стрелочка; теперь переносится «в Москве ▾» целиком, а если влезает — остаётся в строке. */
.header__city-changer .pc-city > a {
  display: inline-block;
  white-space: nowrap;
}

/* УТП баннера из тега в формате «idx*Заголовок*Подзаголовок» (08.10): на десктопе `.name-adv br` скрыт
   (custom.css, ≥768px) — под короткие пары «Гарантия сервисного центра — до 3 лет», — и подпись клеилась
   к заголовку одной жирной строкой («Бесплатная диагностика находим причину…»). Пункты с подписью получают
   .name-adv--split: заголовок жирный, подпись — отдельной строкой обычным начертанием, как на мобилке. */
.name-adv.name-adv--split br { display: none; }
.name-adv.name-adv--split span { display: block; }
@media (min-width: 769px) {
  .name-adv.name-adv--split span {
    margin-top: 2px;
    font-weight: 400;
    font-size: 0.875em;
    line-height: 1.35;
    opacity: 0.85;
  }
}

/* === Planfix 1222: блок «Техника, которую мы ремонтируем» как на 137 === */
.device-types {
  padding: 40px 0;
}
.device-types__title {
  text-align: center;
  font-size: 24px;
  line-height: 1.25;
  font-weight: 700;
  color: #2b2b2b;
  margin: 0 0 28px 0;
}
.device-types__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.device-types__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: #f5f6f8;
  border-radius: 12px;
  padding: 28px 20px;
  text-decoration: none;
  transition: box-shadow .25s ease, transform .25s ease;
}
.device-types__card:hover {
  box-shadow: 0 8px 22px rgba(0, 0, 0, .10);
  transform: translateY(-2px);
}
.device-types__icon {
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}
.device-types__icon img {
  max-height: 64px;
  max-width: 90px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.device-types__name {
  font-size: 16px;
  font-weight: 700;
  color: #2b2b2b;
  margin-bottom: 10px;
}
.device-types__meta {
  font-size: 12px;
  line-height: 17px;
  color: #9a9a9a;
}
@media (max-width: 992px) {
  .device-types__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 680px) {
  .device-types__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .device-types__title {
    font-size: 20px;
  }
  .device-types__card {
    padding: 20px 14px;
  }
}
.device-types__card--hidden { display: none; }
.device-types__grid.open .device-types__card--hidden { display: flex; }
.device-types__more { text-align: center; margin-top: 20px; }
.device-types__more button {
  border: 1px solid var(--red, #d33); background: #fff; color: var(--red, #d33);
  border-radius: 8px; padding: 10px 28px; font-size: 15px; cursor: pointer;
  display: block; margin: 0 auto;
}
.device-types__more button:hover { background: var(--red, #d33); color: #fff; }

/* === Страница главного мастера (Planfix 1291), префикс .cm- + ссылка .t69-chief-link === */
/* line-height задан явно везде: платформенный CSS ставит body { line-height: 10px } */
.t69-chief-link { color: inherit; text-decoration: underline; text-decoration-color: rgba(0,0,0,.25); text-underline-offset: 3px; }
.t69-chief-link:hover { color: var(--red); text-decoration-color: var(--red); }
.cm { padding-bottom: 56px; }
.cm .cm-hero { display: flex; flex-wrap: wrap; gap: 48px; align-items: flex-start; }
.cm-hero__photo { flex: 0 1 380px; min-width: 260px; }
.cm-hero__photo img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 15%; border-radius: 24px; background: #eef0f6; }
.cm-hero__online { display: flex; align-items: center; gap: 10px; margin-top: 14px; font-size: 15px; line-height: 1.4; color: #3a3d47; }
.cm-dot { flex: none; width: 12px; height: 12px; border-radius: 50%; background: #3cc35a; }
.cm-hero__body { flex: 999 1 520px; min-width: 0; display: flex; flex-direction: column; gap: 22px; }
.cm-kicker { font-size: 15px; line-height: 1.3; font-weight: 700; color: var(--red); text-transform: uppercase; letter-spacing: .06em; }
.cm-h1 { margin: 6px 0 0; font-size: 44px; line-height: 1.15; font-weight: 800; color: var(--black); }
.cm-lead { margin: 10px 0 0; font-size: 18px; line-height: 1.55; color: #3a3d47; }
.cm-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.cm-fact { background: #f5f6fa; border-radius: 16px; padding: 18px 20px; }
.cm-fact__l { font-size: 14px; line-height: 1.3; color: #6b6f7b; }
.cm-fact__v { margin-top: 4px; font-size: 17px; line-height: 1.35; font-weight: 700; color: var(--black); }
.cm-fact__v--big { font-size: 22px; font-weight: 800; }
.cm-btns { display: flex; flex-wrap: wrap; gap: 12px; }
.cm-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 28px; border: 0; border-radius: 14px; font-size: 16px; line-height: 1.2; font-weight: 800; font-family: inherit; cursor: pointer; text-decoration: none; }
.cm-btn--main { background: var(--red); color: #fff; }
.cm-btn--soft { background: var(--redlight); color: var(--red); }
.cm-btn--white { background: #fff; color: var(--red); }
.cm-sec { margin-top: 56px; }
.cm-h2 { margin: 0 0 20px; font-size: 32px; line-height: 1.2; font-weight: 800; color: var(--black); }
.cm-h3 { margin: 0 0 16px; font-size: 24px; line-height: 1.25; font-weight: 800; color: var(--black); }
.cm-card { border: 1px solid #e6e8ef; border-radius: 20px; padding: 24px; background: #fff; }
.cm-about { display: flex; flex-wrap: wrap; gap: 32px; }
.cm-about__text { flex: 999 1 520px; min-width: 0; font-size: 17px; line-height: 1.65; color: #2a2d36; }
.cm-about__text p { margin: 0 0 14px; font-size: 17px; line-height: 1.65; }
.cm-about__tags { flex: 1 1 300px; min-width: 0; background: #f5f6fa; border: 0; display: flex; flex-direction: column; gap: 14px; align-self: flex-start; }
.cm-card__t { font-size: 18px; line-height: 1.3; font-weight: 800; color: var(--black); }
.cm-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.cm-chips span { background: #fff; border: 1px solid #dfe2ec; border-radius: 999px; padding: 6px 14px; font-size: 14px; line-height: 1.3; font-weight: 600; color: var(--black); }
.cm-about__more { font-size: 14px; line-height: 1.4; font-weight: 700; color: var(--red); }
.cm-case { display: flex; flex-wrap: wrap; gap: 32px; background: #f5f6fa; border-radius: 24px; padding: 32px; }
.cm-case__img { flex: 1 1 280px; min-width: 0; width: 100%; max-width: 420px; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 16px; }
.cm-case__body { flex: 999 1 420px; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.cm-case__t { font-size: 20px; line-height: 1.3; font-weight: 800; color: var(--black); }
.cm-case__body p { margin: 0; font-size: 17px; line-height: 1.65; color: #2a2d36; }
.cm-case__meta { display: flex; flex-wrap: wrap; gap: 24px; font-size: 15px; line-height: 1.4; }
.cm-case__meta span { color: #6b6f7b; }
.cm-tips { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.cm-tip { display: flex; flex-direction: column; gap: 10px; }
.cm-tip__n { width: 40px; height: 40px; border-radius: 12px; background: var(--redlight); color: var(--red); display: flex; align-items: center; justify-content: center; font-weight: 800; line-height: 1; }
.cm-tip__t { font-size: 18px; line-height: 1.3; font-weight: 800; color: var(--black); }
.cm-tip p { margin: 0; font-size: 16px; line-height: 1.55; color: #3a3d47; }
.cm-hobby { display: flex; flex-wrap: wrap; gap: 32px; align-items: center; background: #f5f6fa; border-radius: 24px; padding: 32px; }
.cm-hobby__body { flex: 999 1 460px; min-width: 0; }
.cm-hobby__body p { margin: 0 0 12px; font-size: 17px; line-height: 1.65; color: #2a2d36; }
.cm-hobby__q { font-style: italic; }
.cm-hobby__img { flex: 1 1 260px; min-width: 0; max-width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 16px; }
.cm-arts { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.cm-art { display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: var(--black); }
.cm-art__d { font-size: 13px; line-height: 1.3; color: #6b6f7b; }
.cm-art__t { font-size: 17px; line-height: 1.35; font-weight: 800; }
.cm-soc { display: flex; flex-wrap: wrap; gap: 12px; }
.cm-soc__a { display: inline-flex; align-items: center; min-height: 48px; padding: 0 20px; border: 1px solid #dfe2ec; border-radius: 14px; font-size: 16px; line-height: 1.2; font-weight: 700; color: var(--black); text-decoration: none; }
.cm-cta { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; justify-content: space-between; border-radius: 24px; padding: 36px 32px; color: #fff; background: var(--red); background: linear-gradient(135deg, color-mix(in srgb, var(--red) 62%, #000) 0%, var(--red) 100%); }
.cm-cta__who { display: flex; align-items: center; gap: 20px; min-width: 0; flex: 1 1 380px; }
.cm-cta__who img { flex: none; width: 88px; height: 88px; border-radius: 50%; object-fit: cover; object-position: top; background: rgba(255,255,255,.2); }
.cm-cta__t { font-size: 26px; line-height: 1.25; font-weight: 800; color: #fff; }
.cm-cta__s { margin-top: 6px; font-size: 16px; line-height: 1.4; color: rgba(255,255,255,.85); }
@media (max-width: 767px) {
  .cm .cm-hero { gap: 24px; }
  .cm-hero__photo { flex-basis: 100%; }
  .cm-hero__photo img { aspect-ratio: 1 / 1; object-position: 50% 12%; }
  .cm-h1 { font-size: 30px; }
  .cm-lead { font-size: 16px; }
  .cm-facts { grid-template-columns: 1fr; }
  .cm-btn { width: 100%; }
  .cm-sec { margin-top: 40px; }
  .cm-h2 { font-size: 24px; }
  .cm-case, .cm-hobby { padding: 20px; }
  .cm-cta { padding: 24px 20px; }
  .cm-cta__t { font-size: 20px; }
  .cm-cta__who img { width: 64px; height: 64px; }
}

/* === Этапы с переключателем режима (Planfix 1245), .smx === */
.smx__sub { margin: -20px 0 24px; max-width: 760px; font-size: 16px; line-height: 1.5; color: #6b6b6b; }
.smx__modes { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 28px; }
.smx__modes-l { margin-right: 8px; font-size: 14px; line-height: 1.3; color: #6b6b6b; }
.smx__mode { padding: 10px 20px; border: 1px solid #dcdcdc; border-radius: 999px; background: #fff; color: var(--black); font-size: 15px; line-height: 1.2; font-weight: 600; font-family: inherit; cursor: pointer; }
.smx__mode.is-active { background: var(--red); border-color: var(--red); color: #fff; }
.smx__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.smx__step { display: flex; gap: 18px; align-items: flex-start; }
.smx__num { flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--red); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 17px; line-height: 1; font-weight: 800; }
.smx__card { flex: 1 1 auto; min-width: 0; background: #fff; border-radius: 16px; padding: 20px 24px; }
.smx__head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-bottom: 8px; }
.smx__t { margin: 0; font-size: 20px; line-height: 1.3; font-weight: 800; color: var(--black); }
.smx__badge { padding: 4px 12px; border-radius: 999px; background: var(--redlight); color: var(--red); font-size: 12px; line-height: 1.3; font-weight: 700; }
.smx__p { margin: 0; max-width: 780px; font-size: 16px; line-height: 1.55; color: #3a3d47; }
.smx__p[hidden] { display: none; }
.smx__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.smx__chips span { padding: 5px 12px; border-radius: 8px; background: #f3f3f3; font-size: 13px; line-height: 1.3; font-weight: 600; color: #4a4a4a; }
@media (max-width: 767px) {
  .smx__sub { margin-top: -12px; font-size: 14px; }
  .smx__mode { flex: 1 1 auto; padding: 10px 14px; font-size: 14px; }
  .smx__step { gap: 12px; }
  .smx__num { width: 32px; height: 32px; font-size: 15px; }
  .smx__card { padding: 16px; }
  .smx__t { font-size: 17px; }
  .smx__p { font-size: 15px; }
}

/* === Работы до/после (Planfix 1246), .wba === */
.wba__sub { margin: -20px 0 24px; font-size: 16px; line-height: 1.5; color: #6b6b6b; }
.wba__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.wba-card { background: #fff; border: 1px solid #ececec; border-radius: 16px; padding: 14px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.wba-card__pics { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.wba-card__pic { position: relative; margin: 0; aspect-ratio: 1 / 1; border-radius: 10px; overflow: hidden; background: #eceef3; }
.wba-card__pic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.wba-card__ph { position: absolute; inset: 0; background: repeating-linear-gradient(135deg, #eceef3 0 10px, #e3e6ee 10px 20px); }
.wba-card__pic figcaption { position: absolute; left: 6px; top: 6px; padding: 3px 8px; border-radius: 6px; background: rgba(0,0,0,.65); color: #fff; font-size: 11px; line-height: 1.2; font-weight: 700; letter-spacing: .04em; }
.wba-card__pic--b figcaption { background: var(--red); }
.wba-card__t { margin: 0; font-size: 16px; line-height: 1.35; font-weight: 700; color: var(--black); }
.wba-card__chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; }
.wba-card__chips span { padding: 4px 10px; border-radius: 8px; background: #f3f3f3; font-size: 12px; line-height: 1.3; font-weight: 600; color: #4a4a4a; }
@media (max-width: 1100px) { .wba__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .wba__sub { margin-top: -12px; font-size: 14px; } .wba__grid { grid-template-columns: 1fr; } }

/* 1298: перелинковка в подвале (тег footer_xlinks) */
.footer-xlinks { margin-top: 12px; }
.footer-xlinks a { color: inherit; text-decoration: underline; }

/* ===== Новый первый блок (шапка rh-* + первый экран rx-*) — редизайн из local-preview, 19.10.2026 =====
   Классы уникальные: стили действуют только когда включён флаг (тег rx_first_block, php_blocks/inc/rx.php) и в разметке
   есть эти классы; без флага вид сайта не меняется. Нижняя панель (rb-*) и плашка отзовиков (/sc) в боевой шаблон НЕ переносились. */
/* Редизайн шапки и первого блока temp69 — черновик на локальном стенде (local-preview, 06.10.2026).
   Подключается последним после style.css/custom.css, поэтому перебивает их.
   Когда дизайн утвердим — переносим в public/css/style.css (+ разметку в php_blocks/header.php и interface/index.php). */

/* ================= ШАПКА — вариант 5 «Кнопка-каталог» =================
   Классы rh-* (класс «menu» нельзя: mainScript.js берёт document.querySelectorAll(".menu")[0] под мобильное меню).
   ⚠️ Платформенный CSS: body { font-size: 10px; line-height: 10px } — размеры и line-height задаём явно. */
.rh {
  --rh-ink: #15171a;
  --rh-muted: #6b7076;
  --rh-line: #e7e9eb;
  --rh-soft: #f4f5f6;
  --rh-tint: color-mix(in srgb, var(--red) 11%, #fff);
  --rh-deep: color-mix(in srgb, var(--red) 72%, #000);
  position: relative;
  z-index: 60;
  background: #fff;
  font-family: "Mulish", sans-serif;
  font-size: 15px;
  line-height: 1.4;
  color: var(--rh-ink);
}
.rh a { color: inherit; text-decoration: none; }
.rh button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
.rh .rh-i { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.rh .rh-i--chev { width: 12px; height: 12px; }
.rh-row { display: flex; align-items: center; }

/* --- верхняя полоса: часы · адрес · статус ремонта --- */
.rh-util { border-bottom: 1px solid var(--rh-line); font-size: 13px; color: var(--rh-muted); }
.rh-util .rh-row { gap: 22px; height: 36px; }
.rh-util__it { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.rh-util__it .rh-i { width: 15px; height: 15px; }
.rh .rh-util__status { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; color: var(--rh-ink); font-weight: 500; white-space: nowrap; }
.rh .rh-util__status:hover { color: var(--rh-deep); }
.rh-util__status .rh-i { width: 16px; height: 16px; }

/* --- основная строка --- */
.rh-main .rh-row { gap: 18px; height: 88px; }
.rh-brand { display: flex; flex-direction: column; gap: 4px; flex: none; }
.rh-logo { font: 700 30px/1 "Roboto", sans-serif; letter-spacing: -.01em; white-space: nowrap; }
.rh-logo span { color: var(--red); }
.rh .rh-city__btn { display: block; max-width: 175px; text-align: left; font-size: 12px; font-weight: 500; line-height: 1.3; color: var(--rh-muted); }
.rh .rh-city__btn:hover, .rh-city.is-open .rh-city__btn { color: var(--rh-deep); }
.rh-city__btn .rh-i--chev { display: inline-block; vertical-align: -1px; width: 11px; height: 11px; margin-left: 3px; transition: transform .15s; }
.rh-city.is-open .rh-i--chev { transform: rotate(180deg); }

.rh .rh-cat { display: inline-flex; align-items: center; gap: 10px; flex: none; padding: 13px 18px; border-radius: 12px; background: var(--red); color: #fff; font-weight: 500; white-space: nowrap; transition: background .15s; }
.rh .rh-cat:hover, .rh .rh-cat[aria-expanded="true"] { background: var(--rh-deep); }

.rh-nav { display: flex; align-items: center; gap: 13px; flex: 1; min-width: 0; font-size: 14px; font-weight: 500; }
.rh .rh-nav__link { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; padding: 8px 0; }
.rh .rh-nav__link:hover, .rh-dd.is-open > .rh-nav__link { color: var(--rh-deep); }
.rh-dd.is-open > .rh-nav__link .rh-i--chev { transform: rotate(180deg); }
.rh-nav__link .rh-i--chev { transition: transform .15s; }

/* выпадашки: «О нас», «Ещё», город */
.rh-dd { position: relative; }
.rh-dd__panel {
  position: absolute; top: calc(100% + 8px); left: -14px; z-index: 5;
  min-width: 220px; padding: 8px; border-radius: 12px; background: #fff;
  box-shadow: 0 12px 32px rgba(20, 24, 28, .14), 0 0 0 1px var(--rh-line);
  display: none; flex-direction: column;
}
.rh-dd__panel--end { left: auto; right: -14px; }
/* «мостик» над панелью: курсор идёт от кнопки к списку через зазор 8px и не теряет наведение */
.rh-dd__panel::before { content: ""; position: absolute; left: 0; right: 0; top: -10px; height: 10px; }
.rh-dd.is-open > .rh-dd__panel { display: flex; }
.rh-dd__panel > a { padding: 10px 12px; border-radius: 8px; font-size: 14px; font-weight: 500; white-space: nowrap; }
.rh-dd__panel > a:hover { background: var(--rh-tint); color: var(--rh-deep); }
.rh-narrow { display: none; }
/* город — длинный список в 2 колонки */
.rh-city__panel { left: 0; width: 360px; max-height: 420px; overflow: auto; }
.rh-city__panel ul { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 4px; }
.rh-city__panel li { break-inside: avoid; }
.rh-city__panel a { display: block; padding: 8px 10px; border-radius: 8px; font-size: 14px; font-weight: 500; }
.rh-city__panel a:hover { background: var(--rh-tint); color: var(--rh-deep); }
.rh-city__panel a.is-cur { color: var(--rh-deep); }

.rh-right { display: flex; align-items: center; gap: 14px; flex: none; }
.rh-phone { display: flex; flex-direction: column; }
.rh-phone__num { font: 500 18px/1.2 "Roboto", sans-serif; white-space: nowrap; }
.rh-phone__num:hover { color: var(--rh-deep); }
.rh-phone__cap { font-size: 12px; color: var(--rh-muted); }
.rh .rh-call { display: inline-flex; align-items: center; justify-content: center; padding: 12px 18px; border-radius: 10px; border: 1px solid var(--red); color: var(--rh-deep); font-weight: 500; white-space: nowrap; transition: background .15s, color .15s; }
.rh .rh-call:hover { background: var(--red); color: #fff; }
.rh .rh-call--full { width: 100%; background: var(--red); color: #fff; border-color: var(--red); }
.rh .rh-call--full:hover { background: var(--rh-deep); }
.rh-ic, .rh .rh-burger { display: none; }

/* --- каталог «Ремонт устройств» --- */
.rh-mega { position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-top: 1px solid var(--rh-line); box-shadow: 0 24px 40px -20px rgba(0, 0, 0, .25); }
.rh-mega[hidden] { display: none; }
.rh-mega__in { display: grid; grid-template-columns: 1fr 280px; gap: 30px; padding-top: 22px; padding-bottom: 26px; }
.rh-mega__title { margin: 0 0 10px; font-size: 13px; font-weight: 500; color: var(--rh-muted); text-transform: uppercase; letter-spacing: .04em; }
.rh-mega__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.rh-mega__item { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; font-weight: 500; }
.rh-mega__item:hover { background: var(--rh-tint); color: var(--rh-deep); }
.rh-mega__item img { width: 56px; height: 44px; object-fit: contain; flex: none; }
.rh-mega__all { display: inline-flex; align-items: center; gap: 8px; margin: 12px 12px 0; font-weight: 500; color: var(--rh-deep); }
.rh-mega__all .rh-i { width: 16px; height: 16px; }
.rh-mega__promo { align-self: start; display: flex; flex-direction: column; gap: 10px; padding: 20px; border-radius: 14px; background: var(--rh-tint); }
.rh-mega__promo b { font: 700 18px/1.25 "Roboto", sans-serif; }
.rh-mega__promo span { font-size: 14px; color: var(--rh-muted); }

/* --- 1050–1300: «Гарантии» и «Срочный ремонт» уходят в «Ещё» --- */
@media (max-width: 1300px) {
  .rh .rh-wide { display: none; }
  .rh .rh-narrow { display: block; }
  .rh-main .rh-row { gap: 14px; }
  .rh .rh-cat { padding: 13px 16px; }
}

/* --- < 1050: мобильный режим (бургер открывает родное мобильное меню сайта) --- */
@media (max-width: 1049px) {
  .rh-nav, .rh-phone, .rh-right > .rh-call, .rh-hide-tab { display: none !important; }
  .rh-main .rh-row { height: 72px; gap: 10px; }
  .rh-right { margin-left: auto; gap: 6px; }
  .rh-ic, .rh .rh-burger { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 10px; }
  .rh-ic .rh-i { width: 22px; height: 22px; }
  .rh .rh-burger { flex-direction: column; gap: 5px; cursor: pointer; }
  /* платформенный CSS обнуляет высоту .line — фиксируем жёстко */
  .rh .rh-burger .line { flex: none; width: 22px !important; height: 2px !important; min-height: 2px; border-radius: 2px; background: var(--rh-ink) !important; margin: 0 !important; }
  .rh .rh-cat { padding: 11px 13px; }
  .rh-mega__in { grid-template-columns: 1fr; }
}
/* мобильная шапка (< 1050): одна строка — логотип с подписью, номер текстом, бургер.
   Верхней полосы и кнопки каталога нет: «Статус ремонта» — в мобильном меню (бургер), типы — в ряду плашек ниже */
.rh-mphone { display: none; }
@media (max-width: 1049px) {
  .rh-util, .rh .rh-cat, .rh-ic--phone { display: none !important; }
  .rh-mphone { display: block; font: 700 15px/1.2 "Roboto", sans-serif; white-space: nowrap; color: var(--rh-ink); }
  .rh-main .rh-row { height: 64px; }
}
@media (max-width: 380px) {
  .rh-mphone { font-size: 14px; }
  .rh-right { gap: 2px; }
  .rh .rh-burger { width: 36px; }
}
@media (max-width: 829px) {
  .rh-util .rh-row { justify-content: space-between; }
  .rh-logo { font-size: 24px; }
  .rh .rh-city__btn { font-size: 11px; max-width: 160px; }
  .rh .rh-cat__txt { display: none; }
  .rh-mega { max-height: calc(100vh - 120px); overflow: auto; }
  .rh-mega__in { padding-top: 14px; padding-bottom: 18px; gap: 16px; }
  .rh-mega__grid { grid-template-columns: 1fr 1fr; }
  .rh-mega__item { padding: 8px; gap: 8px; font-size: 14px; }
  .rh-mega__item img { width: 44px; height: 36px; }
  .rh-city__panel { width: min(340px, calc(100vw - 30px)); }
}

/* ================= ПЕРВЫЙ ЭКРАН — одна плашка: слева текст/преимущества/форма, справа слайдер цен =================
   Классы rx-*. Форма внутри — оригинальная .bannner-form (обработчики и проверка не тронуты), перекрашена здесь.
   Высота подобрана под ноутбук 1366×768: шапка + первый экран помещаются целиком. */
.rx {
  --rx-ink: #15171a; --rx-muted: #62676d; --rx-line: #e7e9eb; --rx-soft: #f4f5f6;
  --rx-tint: color-mix(in srgb, var(--red) 11%, #fff);
  --rx-deep: color-mix(in srgb, var(--red) 72%, #000);
  padding: 22px 0 32px;
  font-family: "Mulish", sans-serif; font-size: 15px; line-height: 1.45; color: var(--rx-ink);
}
/* табы quick-nav и следующий блок — ниже сгиба: секция занимает высоту окна под шапкой, плашка своего размера,
   под ней просто отступ. --rx-top (отступ блока от верха страницы) ставит redesign.js */
@media (min-width: 1050px) {
  .rx { min-height: calc(100vh - var(--rx-top, 215px)); }
}
.rx .rx-i { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.rx-box { display: grid; grid-template-columns: 1.1fr .9fr; border-radius: 26px; background: #fff; box-shadow: 0 0 0 1px var(--rx-line), 0 20px 60px rgba(20, 24, 28, .08); overflow: hidden; }
.rx-left { display: grid; gap: 16px; align-content: start; padding: 32px 40px 24px; }
.rx-h1 { margin: 0; font: 700 44px/1.08 "Roboto", sans-serif; letter-spacing: -.015em; color: var(--rx-ink); }
.rx-h1 span { color: var(--red); }
.rx-sub { margin: 0; max-width: 560px; font-size: 16px; line-height: 1.5; color: var(--rx-muted); }
.rx-sub b { font-weight: 700; color: var(--rx-deep); }
.rx-facts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 20px; }
.rx-facts li { display: flex; gap: 10px; align-items: center; }
.rx-fact__ic { width: 38px; height: 38px; flex: none; border-radius: 10px; background: var(--rx-tint); color: var(--rx-deep); display: inline-flex; align-items: center; justify-content: center; }
.rx-facts b { display: block; font-weight: 500; font-size: 15px; line-height: 1.25; }
.rx-facts small { display: block; font-size: 13px; line-height: 1.3; color: var(--rx-muted); }
.rx-disc { margin: 0; font-size: 12px; line-height: 1.4; color: #8a8f95; }

/* форма: строка «оператор ··· скидка+таймер», заголовок, телефон + кнопка в строку, галочка */
.rx-formbox { position: relative; display: grid; gap: 10px; padding: 16px 18px; border-radius: 18px; background: var(--rx-soft); }
.rx .bannner-form { display: grid; grid-template-columns: 1fr auto; gap: 12px; margin: 0; padding: 0; width: auto; max-width: none; background: none; box-shadow: none; position: static; }
.rx .bannner-form .block-master-avatar { order: 1; grid-column: 1 / -1; margin: 0; padding: 0 250px 0 0; justify-content: flex-start; min-height: 42px; }
/* заголовок формы прячем визуально (остаётся для скринридеров): строка оператора + кнопка и так говорят, что это заявка */
.rx .bannner-form .title--all_form { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.rx .bannner-form .block-master-avatar .left { display: flex; align-items: center; gap: 10px; }
.rx .bannner-form .block-master-avatar .img { position: relative; width: 42px; height: 42px; flex: none; overflow: visible !important; border-radius: 0; }
.rx .bannner-form .block-master-avatar .img img { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; }
/* точка «на связи» у фото оператора: тема её обрезала/сдвигала — ставим ровно в правый нижний угол фото */
.rx .bannner-form .block-master-avatar .succ-green { position: absolute; right: 2px; bottom: 4px; left: auto; top: auto; width: 12px; height: 12px; margin: 0; border-radius: 50%; background: #2fbf4a; box-shadow: 0 0 0 2px var(--rx-soft); transform: none; animation: none; }
.rx .bannner-form .block-master-avatar .succ-green::before, .rx .bannner-form .block-master-avatar .succ-green::after { display: none; }
.rx .bannner-form .block-master-avatar .name p { margin: 0; line-height: 1.3; }
.rx .bannner-form .name1 { font-size: 14px; font-weight: 500; color: var(--rx-ink); }
.rx .bannner-form .name2 { font-size: 12px; color: var(--rx-muted); }
.rx .bannner-form .form__input { order: 3; position: relative; display: flex; align-items: center; width: 100% !important; max-width: none !important; min-width: 0 !important; height: 52px; margin: 0; padding: 0 16px; border: 1px solid var(--rx-line); border-radius: 12px; background: #fff; }
.rx .bannner-form .form__input:focus-within { border-color: var(--red); box-shadow: 0 0 0 3px var(--rx-tint); }
.rx .bannner-form .form__input svg { flex: none; margin-right: 10px; }
.rx .bannner-form .form__input-input { flex: 1; width: auto; height: 100%; border: 0; outline: none; background: none; padding: 0; font-size: 16px; line-height: 1; color: var(--rx-ink); }
.rx .bannner-form .form__input-btn { order: 4; width: auto !important; max-width: none !important; height: 52px; margin: 0; padding: 0 26px; border: 0; border-radius: 12px; background: var(--red); color: #fff; font: 500 16px/1 "Mulish", sans-serif; white-space: nowrap; cursor: pointer; transition: background .15s, opacity .15s; }
.rx .bannner-form .form__input-btn:hover { background: var(--rx-deep); }
.rx .bannner-form .form__input-btn[disabled] { opacity: .6; cursor: not-allowed; }
.rx .bannner-form .form__input-btn::before, .rx .bannner-form .form__input-btn::after { display: none !important; }  /* «- 25%» темы на мобилке */
.rx .bannner-form .form__input-check { order: 5; grid-column: 1 / -1; margin: 0; align-items: flex-start; gap: 8px; }
.rx .bannner-form .check-label-text, .rx .bannner-form .check-label-text a { font-size: 12px; line-height: 1.4; text-align: left; }
/* подсказки mainScript «Сообщение не заполнено / можно отправить» во время ввода — не показываем: состояние и так видно по кнопке */
.rx .smsNo, .rx .smsYes { display: none !important; }
/* скидка + таймер — справа на уровне строки оператора */
/* скидка + таймер — компактный чип в строке оператора, справа */
.rx-promo { position: absolute; top: 20px; right: 18px; display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 12px; border-radius: 999px; background: var(--rx-tint); white-space: nowrap; }
.rx-promo b { font: 700 16px/1 "Roboto", sans-serif; color: var(--rx-deep); }
.rx-promo__t { color: var(--rx-muted); font-size: 12px; line-height: 1; }
.rx-timer { font: 500 17px/1 "Roboto", sans-serif; font-variant-numeric: tabular-nums; letter-spacing: .02em; color: var(--rx-ink); }

/* слайдер цен (сдвиг transform; свайп — pointer-события в redesign.js) */
.rx-slider { position: relative; display: flex; flex-direction: column; overflow: hidden; background: radial-gradient(120% 90% at 50% 35%, #fff 0, var(--rx-tint) 70%); padding: 22px 24px 16px; min-width: 0; }
.rx-badge { position: absolute; top: 18px; left: 18px; z-index: 2; display: inline-flex; align-items: center; gap: 10px; padding: 6px 6px 6px 14px; border-radius: 12px; background: var(--red); color: #fff; font: 700 22px/1 "Roboto", sans-serif; }
.rx-badge small { font: 500 12px/1.2 "Mulish", sans-serif; opacity: .95; }
.rx-badge__t { display: inline-flex; align-items: baseline; gap: 6px; margin-left: 2px; padding: 6px 10px; border-radius: 8px; background: rgba(255, 255, 255, .22); font: 500 14px/1 "Mulish", sans-serif; }
.rx-badge .rx-timer { color: #fff; font-size: 20px; }
.rx-track { flex: 1; display: flex; transition: transform .45s ease; touch-action: pan-y; cursor: grab; }
.rx-track.is-drag { transition: none; cursor: grabbing; }
.rx-slide { flex: 0 0 100%; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 4px; padding: 56px 10px 0; color: var(--rx-ink); user-select: none; -webkit-user-drag: none; }
.rx-slide:hover { color: var(--rx-ink); }
.rx-slide img { -webkit-user-drag: none; pointer-events: none; }
.rx-slide__img { width: 100%; height: 250px; display: flex; align-items: center; justify-content: center; margin-bottom: 10px; }
.rx-slide__img img { max-width: 90%; max-height: 100%; object-fit: contain; filter: drop-shadow(0 22px 26px rgba(0, 0, 0, .16)); }
.rx-slide__name { font: 500 20px/1.2 "Roboto", sans-serif; }
.rx-slide__price { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.rx-slide__from { font: 700 50px/1.05 "Roboto", sans-serif; letter-spacing: -.02em; color: var(--rx-deep); }
/* старая цена — зачёркнута заметно: толстая тёмная линия поверх серого текста */
.rx-slide__old { position: relative; display: inline-block; font: 500 18px/1.2 "Roboto", sans-serif; color: #8d9399; text-decoration: none; }
.rx-slide__old::after { content: ""; position: absolute; left: -3px; right: -3px; top: 52%; height: 2px; background: #3b3f44; transform: rotate(-6deg); }
.rx-slide__svc { font-size: 15px; color: var(--rx-muted); }
.rx-ctrl { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 12px; }
.rx .rx-arr { width: 38px; height: 38px; border-radius: 50%; background: #fff; border: 1px solid var(--rx-line); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; color: var(--rx-ink); }
.rx .rx-arr:hover { border-color: var(--red); color: var(--rx-deep); }
.rx-dots { display: flex; gap: 6px; }
.rx .rx-dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 999px; background: color-mix(in srgb, var(--rx-ink) 18%, transparent); cursor: pointer; transition: width .2s, background .2s; }
.rx .rx-dot.is-on { width: 24px; background: var(--red); }
.rx-note { margin: 10px 0 0; text-align: center; font-size: 12px; line-height: 1.4; color: var(--rx-muted); }

@media (max-width: 1300px) {
  .rx-left { padding: 28px 30px 22px; }
  .rx-h1 { font-size: 38px; }
  .rx-slide__img { height: 225px; }
  .rx-slide__from { font-size: 44px; }
  .rx .bannner-form .block-master-avatar { padding-right: 0; }
  .rx-promo { position: static; justify-self: start; }
}
@media (max-width: 1049px) {
  .rx-box { grid-template-columns: 1fr; }
  .rx-slider { order: -1; padding: 16px 16px 12px; }
  .rx-slide__img { height: 190px; }
}
@media (max-width: 829px) {
  .rx { padding: 12px 0 22px; }
  .rx-box { border-radius: 20px; }
  .rx-left { padding: 20px 16px 18px; gap: 14px; }
  .rx-h1 { font-size: 30px; }
  .rx-facts { grid-template-columns: 1fr; gap: 8px; }
  .rx-formbox { padding: 14px; }
  .rx .bannner-form { grid-template-columns: 1fr; }
  .rx .bannner-form .form__input-btn { width: 100% !important; }
  .rx-badge { font-size: 16px; flex-wrap: wrap; right: 16px; }
  .rx-slide { padding-top: 50px; }
  .rx-slide__img { height: 160px; margin-bottom: 6px; }
  .rx-slide__from { font-size: 36px; }
  .rx-promo { flex-wrap: wrap; }
}

/* ================= МОБИЛКА (≤ 829): первый экран «сторис с ценами» + компактная форма ================= */
.rx-bars, .rx-tap { display: none; }
@media (max-width: 829px) {
  .rx { padding: 0 0 22px; }
  .rx > .container { padding: 0; }
  .rx-box { border-radius: 0; box-shadow: none; }
  /* сторис */
  .rx-slider { padding: 10px 0; background: linear-gradient(180deg, var(--rx-tint), #fff); }
  .rx-bars { display: flex; gap: 4px; margin: 0 14px 8px; }
  .rx-bar { flex: 1; height: 3px; border-radius: 3px; background: rgba(0, 0, 0, .12); overflow: hidden; }
  .rx-bar i { display: block; height: 100%; width: 0; background: var(--red); }
  .rx-bar.is-done i { width: 100%; }
  .rx-bar.is-on i { animation: rxbar 5s linear forwards; }
  .rx-slider:hover .rx-bar.is-on i { animation-play-state: paused; }
  @keyframes rxbar { from { width: 0; } to { width: 100%; } }
  /* значок на фото — компактно в 2 строки: «−25%» и под ним таймер */
  .rx .rx-badge { left: auto; right: 12px; top: 22px; flex-direction: column; align-items: center; gap: 2px; padding: 5px 9px 6px; border-radius: 10px; font-size: 16px; line-height: 1; }
  .rx-badge__t { margin: 0; padding: 0; background: none; font-size: 0; }   /* слово «ещё» прячем */
  .rx-badge .rx-timer { font-size: 11px; font-weight: 500; opacity: .95; letter-spacing: .01em; }
  .rx-tap { display: block; position: absolute; top: 21px; height: 150px; z-index: 2; width: 34%; padding: 0; border: 0; background: transparent; -webkit-tap-highlight-color: transparent; cursor: pointer; }
  .rx-tap--prev { left: 0; } .rx-tap--next { right: 0; width: 40%; top: 60px; height: 112px; }  /* правая зона ниже значка −25% */
  .rx-slide { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "img img" "name svc" "price svc"; align-items: end; justify-items: start; gap: 0 10px; padding: 0 16px; text-align: left; }
  .rx-slide__img { grid-area: img; justify-self: center; height: 140px; margin: 2px 0 8px; }
  .rx-slide__name { grid-area: name; font-size: 15px; }
  .rx-slide__price { grid-area: price; flex-direction: row; align-items: baseline; gap: 8px; }
  .rx-slide__from { font-size: 30px; }
  .rx-slide__old { font-size: 14px; }
  .rx-slide__svc { grid-area: svc; justify-self: end; max-width: 130px; text-align: right; font-size: 12px; line-height: 1.3; padding-bottom: 4px; }
  .rx-ctrl { display: none; }
  .rx-note { margin: 6px 16px 0; font-size: 10px; text-align: left; }
  /* текст и форма */
  .rx-left { gap: 12px; padding: 16px 16px 14px; }
  .rx-h1 { font-size: 26px; }
  .rx-sub { font-size: 14px; line-height: 1.45; }
  .rx-facts { display: none; }
  .rx-formbox { gap: 8px; padding: 12px; border-radius: 16px; }
  .rx .bannner-form { grid-template-columns: 1fr auto; gap: 8px; }
  .rx .bannner-form .block-master-avatar { padding-right: 0; min-height: 34px; }
  .rx .bannner-form .block-master-avatar .img, .rx .bannner-form .block-master-avatar .img img { width: 34px; height: 34px; }
  .rx .bannner-form .name1 { font-size: 13px; }
  .rx .bannner-form .name2 { font-size: 11px; }
  .rx-promo { position: absolute; top: 14px; right: 12px; height: 28px; padding: 0 9px; gap: 5px; }
  .rx-promo b { font-size: 14px; }
  .rx-promo__t { display: none; }
  .rx-promo .rx-timer { font-size: 14px; }
  .rx .bannner-form .form__input, .rx .bannner-form .form__input-btn { height: 48px; }
  .rx .bannner-form .form__input { padding: 0 10px; }
  .rx .bannner-form .form__input svg { margin-right: 6px; }
  .rx .bannner-form .form__input-input { font-size: 15px; }
  .rx .bannner-form .form__input-btn { width: auto !important; padding: 0 14px; font-size: 14px; }
  .rx .bannner-form .check-label-text, .rx .bannner-form .check-label-text a { font-size: 10.5px; }
  .rx-disc { font-size: 10px; }
  /* нижняя панель: прячется, пока форма первого экрана на экране */
}

/* Planfix 102 [i]: прайс страницы устройства — таблица (как на главной); название и стрелка — ссылка на услугу, растянутая на всю строку */
table.option__cards > tbody > tr.option__cards-item { position: relative; }
.t69-price-table__link { color: inherit; text-decoration: none; }
.t69-price-table__link::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.t69-price-table .visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Planfix 102 [j]: поиск города в списке «Контакты в других городах» */
.contacts-cities__search { display: block; box-sizing: border-box; width: 100%; max-width: 320px; margin: 0 0 12px; padding: 10px 14px; border: 1px solid #dcdcdc; border-radius: 12px; background: #fff; font-family: inherit; line-height: 1.3; color: inherit; }
.contacts-cities__search:focus { outline: none; border-color: var(--red); }
.contacts-cities__empty { margin-top: 8px; }
.contacts-cities__item[hidden], .contacts-cities__empty[hidden] { display: none; }

/* Planfix 1172: название услуги в прайсе типа - кнопка-попап (раньше ссылка), растянута на строку */
button.t69-price-table__link { background: none; border: 0; padding: 0; margin: 0; font: inherit; text-align: left; cursor: pointer; }

/* ТЗ 1322: валидность - div заменены на span, вид прежний */
.menu-close-line, .calc-slide .radio-text { display: block; }

/* Planfix 1328 (22.10): услуги в тексте модели — кнопка-попап вместо ссылки на страницу поломки */
button.t69-link-btn { background: none; border: 0; padding: 0; margin: 0; font: inherit; color: inherit; text-decoration: underline; cursor: pointer; display: inline; text-align: left; }