/* ==========================================================================
   custom.css — авторские стили сайта (собственные блоки + адаптив)
   ========================================================================== */

/* ==========================================================================
   1. Cookie-уведомление
   Стили вынесены в /css/cookie.css
   ========================================================================== */

/* ==========================================================================
   2. Видео-фон
   ========================================================================== */
.videoBackground { position: relative; width: 100%; height: 100%; }
.videoBackground > video {
  padding: 0;
  object-fit: cover;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  background-color: #000;
}
@media (max-width: 768px) {
  .videoBackground > video { display: none; }
  .videoBackground {
    background-image: url("/images/tilda/tild3536-3735-4165-a230-353030306532_1618460222_37-p-fon-.jpg");
    background-size: cover;
    background-position: center center;
  }
}

/* Фото руководителя в первом экране (поверх видео-фона, прижато к низу секции,
   вмещается в 1 экран и всплывает снизу вверх через fadeinup) */
#rec456855153 .tn-elem[data-elem-id="1654785931201"],
#rec456881443 .tn-elem[data-elem-id="1654785931201"] {
  display: none !important;
}

#rec456855153 .tn-elem[data-elem-id="1654439646219"] {
  z-index: 8 !important;
  top: auto !important;
  bottom: 0 !important;
  left: auto !important;
  right: max(4%, calc(50% - 580px)) !important;
  width: clamp(240px, min(25vw, 44vh), 460px) !important;
  pointer-events: none;
}

#rec456855153 .tn-elem[data-elem-id="1654439646219"] .tn-atom__img,
#rec456881443 .tn-elem[data-elem-id="1654439646219"] .tn-atom__img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 85vh;
  object-fit: contain;
  object-position: bottom center;
}

@media screen and (max-width: 1199px) {
  #rec456855153 .tn-elem[data-elem-id="1654439646219"] {
    right: max(2%, calc(50% - 470px)) !important;
    width: clamp(220px, min(28vw, 42vh), 360px) !important;
  }
}

#rec456881443 .tn-elem[data-elem-id="1654439646219"] {
  z-index: 6 !important;
  top: auto !important;
  bottom: 0 !important;
  left: auto !important;
  right: 4% !important;
  width: min(35vw, 300px) !important;
  pointer-events: none;
}

@media screen and (max-width: 959px) {
  #rec456881443 .tn-elem[data-elem-id="1654439646219"] {
    right: 4% !important;
    width: min(38vw, 260px) !important;
  }
}

@media screen and (max-width: 639px) {
  #rec456881443 .tn-elem[data-elem-id="1654439646219"] {
    left: 0 !important;
    right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: min(56vw, 220px) !important;
  }
}

@media screen and (max-width: 479px) {
  #rec456881443 .tn-elem[data-elem-id="1654439646219"] {
    width: 210px !important;
  }
}

/* ==========================================================================
   3. Сетка отзывов
   ========================================================================== */
/* Отзывы — широкие скриншоты переписок, поэтому всегда в одну колонку */
.otzyv_spisok {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  width: 100%;
  max-width: 820px;
  margin: 0 auto;
  padding: 0 15px;
  box-sizing: border-box;
}
/* Артборд отзывов подстраивается под фактическое содержимое */
#rec456888923 .t396__artboard {
  height: auto !important;
  min-height: 0 !important;
  padding: 10px 0 0;
  box-sizing: border-box;
}
#rec456888923 .t396__carrier,
#rec456888923 .t396__filter { display: none; }

.otzyv_spisok .t396__elem {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  height: auto !important;
  display: block;
  cursor: zoom-in;
}
.otzyv_spisok .tn-atom__img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  transition: transform 0.2s ease;
}
.otzyv_spisok .t396__elem:hover .tn-atom__img { transform: translateY(-3px); opacity: 0.9; }

@media (max-width: 640px) {
  .otzyv_spisok { gap: 16px; padding: 0 10px; }
}

.show_review_next {
  margin: 4em auto 1em auto;
  width: 100%;
  display: flex;
  height: fit-content;
  justify-content: center;
  font-size: 1.2rem;
}

/* Модальное окно просмотра отзыва */
.review-modal {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background-color: rgba(0, 0, 0, 0.9);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 99999999;
  opacity: 0;
  transition: opacity 0.3s ease;
  cursor: pointer;
}
.review-modal.active { opacity: 1; }
.review-modal img {
  max-width: 90vw;
  max-height: 90vh;
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
  cursor: default;
}
.review-modal-close {
  position: absolute;
  top: 20px; right: 30px;
  font-size: 40px;
  color: #fff;
  cursor: pointer;
  line-height: 1;
  text-shadow: 0 0 5px #000;
}

/* ==========================================================================
   4. Калькулятор стоимости (quiz)
   ========================================================================== */
.open-quiz-btn {
  padding: 15px 30px;
  background: #f37021;
  color: #fff;
  border: none;
  cursor: pointer;
  font-size: 16px;
  font-weight: bold;
  border-radius: 4px;
  text-transform: uppercase;
}
.quiz-overlay {
  display: none;
  position: fixed;
  top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0, 0, 0, 0.75);
  z-index: 9999;
  justify-content: center;
  align-items: center;
  padding: 20px;
  box-sizing: border-box;
}
.quiz-close-container { position: absolute; top: 20px; right: 30px; z-index: 10001; }
.quiz-close-outside {
  font-size: 36px;
  color: #fff;
  cursor: pointer;
  opacity: 0.8;
  transition: opacity 0.2s;
  line-height: 1;
}
.quiz-close-outside:hover { opacity: 1; }

/* Крестик внутри окна: подложка + тёмный цвет, иначе на белом
   модале белый «×» не виден */
.quiz-modal .quiz-close-container { top: 8px; right: 8px; }
.quiz-modal .quiz-close-outside {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  font-size: 26px;
  color: #333;
  background: #f0f0f0;
  border-radius: 50%;
  opacity: 1;
  transition: background-color 0.2s, transform 0.2s;
}
.quiz-modal .quiz-close-outside:hover {
  background: #e2e2e2;
  transform: rotate(90deg);
  opacity: 1;
}

.quiz-modal {
  background: #fff;
  width: 100%;
  max-width: 750px;
  max-height: calc(100vh - 40px);
  margin: auto;
  position: relative;
  border-radius: 12px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.quiz-header-wrapper { background: #f8f8f8; border-bottom: 1px solid #e5e5e5; }
.quiz-header-content {
  padding: 25px 35px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.quiz-offer-container {
  display: flex;
  gap: 15px;
  font-size: 14px;
  line-height: 1.5;
  color: #555;
  max-width: 88%;
}
.offer-icon { font-size: 22px; color: #f37021; flex-shrink: 0; margin-top: 2px; }
.quiz-offer-container p { margin: 0; }
.quiz-counter { font-weight: bold; font-size: 16px; color: #333; padding-top: 5px; }

.progress-bar-bg { height: 4px; background: #e0e0e0; width: 100%; position: relative; }
.progress-bar-fill { height: 100%; background: #f37021; width: 50%; transition: width 0.3s ease; }

.quiz-step { display: none; padding: 40px 35px 35px; }
.quiz-step.active { display: block; }
.quiz-step.final-step-padding { padding-top: 30px; }
.quiz-title { font-size: 24px; margin-top: 0; margin-bottom: 35px; font-weight: 500; color: #222; }

.quiz-options { display: flex; flex-direction: column; gap: 18px; margin-bottom: 45px; }
.quiz-radio { display: flex; align-items: center; cursor: pointer; font-size: 16px; color: #444; }
.quiz-radio input { display: none; }
.checkmark {
  height: 22px; width: 22px;
  border: 2px solid #f37021;
  border-radius: 50%;
  margin-right: 12px;
  position: relative;
  box-sizing: border-box;
  flex-shrink: 0;
}
.quiz-radio input:checked ~ .checkmark { background: #f37021; }
.quiz-radio input:checked ~ .checkmark::after {
  content: "";
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 8px; height: 8px;
  background: #fff;
  border-radius: 50%;
}
.quiz-radio:hover .checkmark { background: rgba(243, 112, 33, 0.1); }
.quiz-radio input:checked:hover ~ .checkmark { background: #f37021; }

.quiz-inputs label { display: block; margin-bottom: 8px; color: #888; font-size: 14px; }
.quiz-inputs input {
  width: 100%;
  padding: 12px 0;
  margin-bottom: 25px;
  border: none;
  border-bottom: 1px solid #ddd;
  outline: none;
  font-size: 16px;
  color: #333;
  border-radius: 0;
  background: transparent;
}
.quiz-inputs input:focus { border-bottom: 2px solid #f37021; }
.quiz-inputs input::placeholder { color: #ccc; }

.quiz-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 20px;
  padding-top: 20px;
}
.btn-back {
  background: #cdcdcd;
  color: #fff;
  border: none;
  padding: 14px 28px;
  cursor: pointer;
  font-weight: bold;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  transition: background 0.2s;
}
.btn-back:hover:not(:disabled) { background: #bbb; }
.btn-back:disabled { opacity: 0.6; cursor: default; background: #e0e0e0; color: #999; }

.btn-next, .btn-submit {
  background: #f37021;
  color: #fff;
  border: none;
  padding: 14px 35px;
  cursor: pointer;
  font-weight: bold;
  text-transform: uppercase;
  font-size: 13px;
  letter-spacing: 0.5px;
  box-shadow: 0 2px 5px rgba(243, 112, 33, 0.3);
  transition: background 0.2s, box-shadow 0.2s;
}
.btn-next:hover, .btn-submit:hover { background: #e06315; box-shadow: 0 4px 8px rgba(243, 112, 33, 0.4); }

.quiz-success { display: none; text-align: center; padding: 60px 40px; }
.success-icon-wrapper { width: 80px; height: 80px; margin: 0 auto 30px; }
.success-tick {
  width: 80px; height: 80px;
  border-radius: 50%;
  display: block;
  stroke-width: 2;
  stroke: #fff;
  stroke-miterlimit: 10;
  box-shadow: inset 0 0 0 #4cd964;
  animation: fill 0.4s ease-in-out 0.4s forwards, scale 0.3s ease-in-out 0.9s both;
}
.success-circle {
  stroke-dasharray: 166; stroke-dashoffset: 166;
  stroke-width: 2; stroke-miterlimit: 10;
  stroke: #4cd964; fill: #4cd964;
  animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}
.success-check {
  transform-origin: 50% 50%;
  stroke-dasharray: 48; stroke-dashoffset: 48;
  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}
.success-title { font-size: 20px; color: #333; line-height: 1.4; margin-bottom: 30px; font-weight: 500; }
.btn-continue {
  background: #000;
  color: #fff;
  border: none;
  padding: 15px 50px;
  font-size: 16px;
  border-radius: 5px;
  cursor: pointer;
  font-weight: bold;
  margin-bottom: 20px;
}
.auto-close-text { color: #999; font-size: 14px; }
#success-timer {
  display: inline-block;
  width: 20px; height: 20px;
  line-height: 20px;
  border: 1px solid #999;
  border-radius: 50%;
  font-size: 12px;
}

@keyframes stroke { 100% { stroke-dashoffset: 0; } }
@keyframes scale { 0%, 100% { transform: none; } 50% { transform: scale3d(1.1, 1.1, 1); } }
@keyframes fill { 100% { fill: #4cd964; } }

@media (max-width: 600px) {
  /* Отступы остаются — по ним видно затемнение фона,
     и понятно, что это всплывающее окно, а не отдельная страница */
  .quiz-overlay {
    padding: 16px;
    align-items: flex-start;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .quiz-modal {
    max-width: 100%;
    /* margin:auto центрирует по вертикали и не обрезает верх,
       когда содержимое не помещается по высоте */
    margin: auto;
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  }
  .quiz-header-content { padding: 20px 15px 20px 20px; }
  .quiz-offer-container { max-width: 80%; font-size: 12px; }
  .offer-icon { font-size: 18px; }
  .quiz-step { padding: 25px 20px; }
  .quiz-title { font-size: 20px; margin-bottom: 25px; }
  .quiz-footer { flex-direction: column-reverse; gap: 15px; align-items: stretch; }
  .btn-back, .btn-next, .btn-submit { width: 100%; padding: 15px; text-align: center; }
  .quiz-header-wrapper { padding-right: 40px; }
  .quiz-success { padding: 40px 20px; }
}

/* ==========================================================================
   5. Фирменные цвета кнопок/ссылок
   ========================================================================== */
.t-btn.t-btn_md { background-color: #B22222 !important; color: #fff !important; }
.t-btn.t-btn_md:hover { background-color: #8B0000 !important; }
.t-btn.t-btn_sm { background-color: #B22222 !important; color: #fff !important; }
.t-btn.t-btn_sm:hover { background-color: #8B0000 !important; }

.t190__button path { fill: #B22222 !important; transition: fill 0.3s ease; }
.t190__button:hover path { fill: #8B0000 !important; }

a.footer_phone {
  color: #B22222 !important;
  transition: color 0.3s ease;
  font-size: 1.5rem;
  font-weight: 700;
  text-decoration: none;
}
a.footer_phone:hover { color: #8B0000 !important; }
a.footer_email { color: #B22222 !important; transition: color 0.3s ease; }
a.footer_email:hover { color: #8B0000 !important; }

#rec457249655 .tn-elem[data-elem-id="1654869719941"] .tn-atom {
  background-color: #B22222 !important;
  transition: background-color 0.3s ease;
}
#rec457249655 .tn-elem[data-elem-id="1654869719941"] .tn-atom:hover { background-color: #8B0000 !important; }

#rec456881443 .tn-elem[data-elem-id="1654071871798"] .tn-atom { background-color: #B22222 !important; }
#rec456881443 .tn-elem[data-elem-id="1654071871798"] .tn-atom:hover { background-color: #8B0000 !important; }
#rec456855153 .tn-elem[data-elem-id="1654071871798"] .tn-atom { background-color: #B22222 !important; }
#rec456855153 .tn-elem[data-elem-id="1654071871798"] .tn-atom:hover { background-color: #8B0000 !important; }

/* ==========================================================================
   6. Футер (rec456855196) — абсолютные координаты Tilda → адаптив
   ========================================================================== */
.social_icons_footer {
  display: flex;
  flex-wrap: nowrap;
  gap: 14px;
  justify-content: center;
  align-items: center;
}
.social_icons_footer img { width: 40px; height: 40px; object-fit: contain; }
/* Каждая иконка — фиксированного размера, иначе во flex-контейнере
   со 100%-шириной они растягиваются и уезжают в столбик */
.social_icons_footer .social_icon {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  display: block;
  line-height: 0;
  transition: transform 0.2s ease;
}
.social_icon:hover { transform: translateY(-3px); }

/* Подвал: запись не имеет потокового содержимого (все элементы внутри
   артборда абсолютные), поэтому задаём ей размер и контекст явно —
   иначе она схлопывалась по контенту и уезжала вбок/вниз. */
#rec456855196 {
  display: flow-root;
  width: 100%;
  overflow: hidden;
}

/* ≥992px: подвал-строка, как задумано в макете */
@media (min-width: 992px) {
  #rec456855196 {
    height: 110px;
  }
  #rec456855196 .t396__artboard {
    position: relative;
    height: 110px !important;
    min-height: 110px !important;
    display: block !important;
  }
  #rec456855196 .t396__filter,
  #rec456855196 .t396__carrier {
    height: 110px !important;
  }
  #rec456855196 .tn-elem__45685519616503756571661 { top: 18px !important; left: 100px !important; width: 65px !important; }
  #rec456855196 .tn-elem__4568551961650376464935 {
    top: auto !important;
    right: 0 !important;
    bottom: 9px !important;
    left: 0 !important;
    width: auto !important;
    padding: 0 20px;
    text-align: center !important;
  }
  #rec456855196 .tn-elem__4568551961650376182293 { top: 20px !important; left: auto !important; right: 250px !important; width: auto !important; }
  #rec456855196 .social_icons_footer {
    position: absolute;
    top: 30px;
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
  }
  .t527__container.t-list__container_inrow2 { display: flex; justify-content: center; }
}

/* Логотип в подвале: графика чёрная, подвал тоже чёрный —
   без подложки логотип не виден. Кладём его на белую карточку. */
#rec456855196 .tn-elem__45685519616503756571661 .tn-atom {
  display: inline-block;
  width: auto;
  background-color: #fff;
  border-radius: 8px;
  padding: 8px 12px;
  line-height: 0;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}
#rec456855196 .tn-elem__45685519616503756571661 .tn-atom__img {
  width: 100%;
  height: auto;
  max-height: 58px;
  object-fit: contain;
  display: block;
}

/* < 992px: подвал превращаем в вертикальный блок */
@media (max-width: 991px) {
  #rec456855196 .t396__artboard,
  #rec456855196 .t396__filter,
  #rec456855196 .t396__carrier {
    height: auto !important;
    min-height: 0 !important;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 28px 20px;
    box-sizing: border-box;
  }
  #rec456855196 .t396__carrier { background-image: none !important; }
  #rec456855196 .t396__filter { display: none; }

  #rec456855196 .t396__elem {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: 100% !important;
    height: auto !important;
    transform: none !important;
    display: block;
    text-align: center;
    margin: 0 0 14px;
  }
  /* Соцсети остаются горизонтальными — flex нельзя гасить общим правилом выше */
  #rec456855196 .social_icons_footer {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: 100% !important;
    height: auto !important;
    transform: none !important;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 14px;
    text-align: center;
    margin: 6px 0 14px;
  }
  #rec456855196 .tn-elem__45685519616503756571661 { order: 1; }
  #rec456855196 .tn-elem__45685519616503756571661 img { width: 66px !important; height: auto !important; }
  #rec456855196 .tn-elem__4568551961650376464935 { order: 2; font-size: 15px; }
  #rec456855196 .footer-legal { gap: 5px 14px; font-size: 12px; }
  #rec456855196 .tn-elem__4568551961650376182293 { order: 4; margin: 0; }
  #rec456855196 .tn-elem__4568551961650376182293 .tn-atom { text-align: center; }
  a.footer_phone { font-size: 1.35rem; }
  /* раскладку карточки персонала на мобильном задаёт base.css */
}

/* Подвал чёрный — правовые ссылки без своего цвета сливались с фоном */
#rec456855196 .footer-legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 6px 20px;
  color: #b9b9b9;
  font-size: 12.5px;
  line-height: 1.4;
}
#rec456855196 .footer-legal a,
#rec456855196 .footer-legal .tcs-cookie-settings {
  color: #b9b9b9;
  text-decoration: none;
  transition: color 0.2s ease;
}
#rec456855196 .footer-legal a:hover,
#rec456855196 .footer-legal .tcs-cookie-settings:hover {
  color: #fff;
  text-decoration: underline;
}

/* ==========================================================================
   7. Общие адаптивные правки zero-блоков
   ========================================================================== */

/* --- rec456855155: кнопка подарка не влезала в экран (nowrap + смещение) --- */
#rec456855155 .tn-elem[data-elem-id="1649930817692"] {
  left: 50% !important;
  transform: translateX(-50%);
  width: 400px !important;
  max-width: calc(100% - 30px) !important;
}
#rec456855155 .tn-elem[data-elem-id="1649930817692"] .t-btn {
  display: block;
  width: 100%;
  box-sizing: border-box;
  white-space: normal;
  line-height: 1.3;
  text-align: center;
  padding: 16px 20px;
}
@media screen and (max-width: 479px) {
  #rec456855155 .tn-elem[data-elem-id="1649930817692"] { width: calc(100% - 30px) !important; }
}

/* --- rec457202187: заголовок налезал на первый пункт списка ---
   !important обязателен: инлайновые <style> блоков идут после custom.css
   и при равной специфичности перебивают его. */
#rec457202187 .tn-elem[data-elem-id="1654865641409"] { top: 305px !important; }
#rec457202187 .tn-elem[data-elem-id="1654866478089"] { top: 311px !important; }
#rec457202187 .tn-elem[data-elem-id="1654865560378"] { top: 571px !important; }
#rec457202187 .tn-elem[data-elem-id="1654866905112"] { top: 578px !important; }
#rec457202187 .tn-elem[data-elem-id="1654865525440"] { top: 452px !important; }
#rec457202187 .tn-elem[data-elem-id="1654866346375"] { top: 458px !important; }
/* На телефонах фотография перекрывала заголовок, а список — саму фотографию.
   У блока в разметке стоит top:...!important, поэтому поднимаем
   специфичность селектора (body + id), иначе правило блока побеждает.
   Высота картинки ~400px при ширине 320px — список начинаем ниже неё. */
@media screen and (max-width: 639px) {
  /* Центрируем через left/right + auto-отступы: transform здесь
     перебивается правилом анимации (transform: none !important) */
  body #rec457202187 .tn-elem[data-elem-id="1654863560314"] {
    top: 300px !important;
    left: 0 !important;
    right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 320px !important;
    max-width: calc(100% - 30px) !important;
  }
  #rec457202187 .tn-elem[data-elem-id="1654865641409"] { top: 760px !important; }
  #rec457202187 .tn-elem[data-elem-id="1654866478089"] { top: 766px !important; }
  #rec457202187 .tn-elem[data-elem-id="1654865560378"] { top: 900px !important; }
  #rec457202187 .tn-elem[data-elem-id="1654866905112"] { top: 906px !important; }
  #rec457202187 .tn-elem[data-elem-id="1654865525440"] { top: 1030px !important; }
  #rec457202187 .tn-elem[data-elem-id="1654866346375"] { top: 1036px !important; }
}

/* --- rec456855174: заголовок налезал на подпись на узких экранах --- */
@media screen and (max-width: 959px) {
  #rec456855174 .tn-elem[data-elem-id="1649930707223"] .tn-atom {
    font-size: 42px !important;
    line-height: 1.15 !important;
  }
  #rec456855174 .tn-elem[data-elem-id="1649930577536"] { top: 150px !important; }
}
/* --- rec456881443: телефон в мобильном герое подходил к заголовку вплотную --- */
@media screen and (min-width: 481px) and (max-width: 980px) {
  #rec456881443 .tn-elem[data-elem-id="1654876738453"] { top: 26px !important; }
}
@media screen and (max-width: 480px) {
  #rec456881443 .tn-elem[data-elem-id="1654876738453"] { top: 26px !important; }
}

/* ==========================================================================
   Промежуточные брейкпоинты для блоков, у которых в разметке есть
   только сетка 1200px и ≤479px. На планшетах контент уезжал за края.
   Центрируем через left/right + auto-отступы (transform здесь
   перебивается правилом анимации: transform: none !important).
   ========================================================================== */

/* --- Заголовки «Более 500 довольных клиентов» / «Отвечаем за сервис» --- */
@media screen and (max-width: 1199px) {
  #rec456855191 .tn-elem[data-elem-id="1649930707223"],
  #rec457260204 .tn-elem[data-elem-id="1649930707223"] {
    left: 0 !important;
    right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 823px !important;
    max-width: calc(100% - 30px) !important;
  }
  #rec456855191 .tn-elem[data-elem-id="1649930707223"] .tn-atom,
  #rec457260204 .tn-elem[data-elem-id="1649930707223"] .tn-atom {
    font-size: 40px !important;
    line-height: 1.2 !important;
  }
}

/* --- Блок «Рассчитайте стоимость штукатурки и получите» --- */
@media screen and (max-width: 1199px) {
  #rec457249655 .tn-elem[data-elem-id="1649927196208"],
  #rec457249655 .tn-elem[data-elem-id="1649927196218"],
  #rec457249655 .tn-elem[data-elem-id="1654869719941"] {
    left: 0 !important;
    right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  #rec457249655 .tn-elem[data-elem-id="1649927196208"] {
    width: 959px !important;
    max-width: calc(100% - 40px) !important;
    text-align: center;
  }
  #rec457249655 .tn-elem[data-elem-id="1649927196208"] .tn-atom { font-size: 40px !important; line-height: 1.2 !important; }
  #rec457249655 .tn-elem[data-elem-id="1649927196218"] {
    width: 911px !important;
    max-width: calc(100% - 40px) !important;
    text-align: center;
  }
  #rec457249655 .tn-elem[data-elem-id="1654869719941"] { width: 230px !important; }
}
/* Заголовок в 2–5 строк — разводим пункты списка и кнопку ниже него */
@media screen and (min-width: 640px) and (max-width: 1199px) {
  #rec457249655 .tn-elem[data-elem-id="1649927196218"] { top: 240px !important; }
  #rec457249655 .tn-elem[data-elem-id="1654869719941"] { top: 340px !important; }
}
@media screen and (min-width: 480px) and (max-width: 639px) {
  #rec457249655 .tn-elem[data-elem-id="1649927196208"] .tn-atom { font-size: 34px !important; }
  #rec457249655 .tn-elem[data-elem-id="1649927196218"] { top: 310px !important; }
  #rec457249655 .tn-elem[data-elem-id="1654869719941"] { top: 455px !important; }
}
@media screen and (max-width: 479px) {
  #rec457249655 .tn-elem[data-elem-id="1649927196208"] .tn-atom { font-size: 30px !important; }
}

/* --- Блок «В 3-4 раза быстрее и дешевле»: стопка и на планшете --- */
/* Список на 480–639px: у блока нет своего брейкпоинта, берём координаты из сетки 1200 */
@media screen and (min-width: 480px) and (max-width: 639px) {
  #rec457202187 .tn-elem[data-elem-id="1654865641409"],
  #rec457202187 .tn-elem[data-elem-id="1654865560378"],
  #rec457202187 .tn-elem[data-elem-id="1654865525440"] {
    left: 0 !important;
    right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 520px !important;
    max-width: calc(100% - 90px) !important;
  }
  #rec457202187 .tn-elem[data-elem-id="1654866478089"],
  #rec457202187 .tn-elem[data-elem-id="1654866905112"],
  #rec457202187 .tn-elem[data-elem-id="1654866346375"] { left: 30px !important; }
  #rec457202187 .tn-elem[data-elem-id="1654865271772"] {
    left: 0 !important; right: 0 !important;
    margin-left: auto !important; margin-right: auto !important;
    width: 539px !important; max-width: calc(100% - 40px) !important;
  }
  #rec457202187 .tn-elem[data-elem-id="1654865271772"] .tn-atom { font-size: 36px !important; line-height: 1.2 !important; }
}
@media screen and (min-width: 640px) and (max-width: 1199px) {
  body #rec457202187 .tn-elem[data-elem-id="1654863560314"] {
    top: 300px !important;
    left: 0 !important;
    right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 480px !important;
    max-width: calc(100% - 40px) !important;
  }
  #rec457202187 .tn-elem[data-elem-id="1654865271772"] {
    left: 0 !important; right: 0 !important;
    margin-left: auto !important; margin-right: auto !important;
    width: 539px !important; max-width: calc(100% - 40px) !important;
  }
  #rec457202187 .tn-elem[data-elem-id="1654865271772"] .tn-atom { font-size: 40px !important; line-height: 1.2 !important; }
  #rec457202187 .tn-elem[data-elem-id="1654865641409"] { top: 960px !important; }
  #rec457202187 .tn-elem[data-elem-id="1654866478089"] { top: 966px !important; }
  #rec457202187 .tn-elem[data-elem-id="1654865560378"] { top: 1110px !important; }
  #rec457202187 .tn-elem[data-elem-id="1654866905112"] { top: 1116px !important; }
  #rec457202187 .tn-elem[data-elem-id="1654865525440"] { top: 1250px !important; }
  #rec457202187 .tn-elem[data-elem-id="1654866346375"] { top: 1256px !important; }
  /* пункты списка выравниваем по левому краю колонки */
  #rec457202187 .tn-elem[data-elem-id="1654865641409"],
  #rec457202187 .tn-elem[data-elem-id="1654865560378"],
  #rec457202187 .tn-elem[data-elem-id="1654865525440"] {
    left: 0 !important; right: 0 !important;
    margin-left: auto !important; margin-right: auto !important;
    width: 520px !important; max-width: calc(100% - 120px) !important;
  }
  #rec457202187 .tn-elem[data-elem-id="1654866478089"],
  #rec457202187 .tn-elem[data-elem-id="1654866905112"],
  #rec457202187 .tn-elem[data-elem-id="1654866346375"] {
    left: 40px !important;
  }
}
@media screen and (max-width: 639px) {
  #rec456855174 .tn-elem[data-elem-id="1649930707223"] .tn-atom { font-size: 34px !important; }
  #rec456855174 .tn-elem[data-elem-id="1649930577536"] { top: 175px !important; }
}
@media screen and (max-width: 479px) {
  #rec456855174 .tn-elem[data-elem-id="1649930707223"] .tn-atom { font-size: 29px !important; }
  #rec456855174 .tn-elem[data-elem-id="1649930577536"] { top: 165px !important; }
}

/* На узких экранах горизонтальный скролл zero-блоков недопустим */
@media (max-width: 480px) {
  .t396__artboard { max-width: 100vw; }
  .t396__elem { max-width: 100vw; }
  a.tn-atom { padding: 16px 18px; font-size: 14px; }
  .t776__textwrapper { padding: 14px 14px 8px; }
  .t776__btn-wrapper { padding: 6px 14px 16px; }
  .t776__title { font-size: 17px; }
}

/* Кнопки-ссылки в zero-блоках не должны «разъезжаться» */
.t396__elem[data-elem-type="button"] .tn-atom { text-align: center; }

/* Кнопки в zero-блоках: правильный курсор и отсутствие подчёркивания */
a.tn-atom { text-decoration: none; }
a.tn-atom:hover { text-decoration: none; }

/* На мобильных отключаем hover-трансформации карточек */
@media (hover: none) {
  .t776__col:hover .t776__content { transform: none; box-shadow: 0 2px 14px rgba(0, 0, 0, 0.08); }
  .social_icon:hover { transform: none; }
  .cookie-btn:hover { transform: none; }
}

/* ==========================================================================
   7b. Согласие на обработку персональных данных в формах
   ========================================================================== */
.tcs-lead__consent-wrap {
  clear: both;
  margin: 4px 0 18px;
}

.t-form__inputsbox_inrow .tcs-lead__consent-wrap {
  padding: 0 10px;
}

.tcs-lead__consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  color: #555;
  font-family: "Roboto", Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
  text-align: left;
  cursor: pointer;
}

.tcs-lead__consent input[type="checkbox"] {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 2px 0 0;
  padding: 0;
  background: #fff;
  border: 1px solid #b3b3b3;
  border-radius: 3px;
  accent-color: #B22222;
  cursor: pointer;
}

.tcs-lead__consent span {
  display: inline;
}

.tcs-lead__consent a {
  color: #B22222;
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.tcs-lead__consent a:hover {
  color: #8B0000;
}

.tcs-lead__consent-error {
  display: block;
  margin: 7px 0 0 28px;
  color: #B22222;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
}

.tcs-lead__consent-error[hidden] {
  display: none;
}

.tcs-consent-invalid {
  outline: 2px solid #B22222;
  outline-offset: 2px;
}

.quiz-inputs .tcs-lead__consent-wrap {
  margin: 0 0 20px;
}

.quiz-inputs .tcs-lead__consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  color: #555;
  font-size: 12.5px;
}

.quiz-inputs .tcs-lead__consent input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 2px 0 0;
  padding: 0;
  background: #fff;
  border: 1px solid #b3b3b3;
  border-radius: 3px;
}

.quiz-inputs .tcs-lead__consent-error {
  margin-left: 28px;
}

@media (max-width: 560px) {
  .t-form__inputsbox_inrow .tcs-lead__consent-wrap {
    padding: 0;
  }

  .tcs-lead__consent {
    font-size: 12px;
  }

  .quiz-inputs .tcs-lead__consent {
    font-size: 11.5px;
  }
}

/* ==========================================================================
   8. Фокус и доступность
   ========================================================================== */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 2px solid #B22222;
  outline-offset: 2px;
}
.t-menuburger:focus-visible { outline: 2px solid #B22222; outline-offset: 4px; }

.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Печать */
@media print {
  .t-animate { opacity: 1 !important; }
  .cookie-notification, .quiz-overlay, .t190, .t-popup { display: none !important; }
}