/* ===== ТЕМА И КОНТЕЙНЕР ===== */
.ka-landing{
  --bg:#fff; --bg-soft:#f8fafc; --card:#fff;
  --text:#0f172a; --muted:#475569;
  --primary:#2563eb; --primary-2:#1d4ed8; --border:#e5e7eb;
  --radius:16px; --shadow:0 16px 40px rgba(2,6,23,.08);
}
.ka-container{max-width:1200px;margin:0 auto;padding:0 20px;width:100%;box-sizing:border-box}

/* ===== КНОПКИ ===== */
.ka-btn{display:inline-flex;gap:8px;align-items:center;justify-content:center;padding:14px 20px;border-radius:12px;border:1px solid transparent;font-weight:700;cursor:pointer;transition:.2s ease;white-space:normal;max-width:100%}
.ka-btn:focus-visible{outline:3px solid rgba(37,99,235,.35);outline-offset:2px}
.ka-btn-primary{background:linear-gradient(130deg,var(--primary),var(--primary-2));color:#fff;box-shadow:0 10px 24px rgba(37,99,235,.25)}
.ka-btn-outline{border-color:var(--border);color:var(--text);background:#fff}
.ka-btn-outline:hover{background:#f1f5f9}
.ka-btn-block{width:100%}
.ka-micro{font-size:12px;color:var(--muted)}

/* ===== HERO ===== */
.ka-hero{background:linear-gradient(180deg,var(--bg),var(--bg-soft))}
.ka-hero-wrap{display:grid;gap:40px;grid-template-columns:1fr;align-items:center;padding:36px 0 26px}
@media (min-width:992px){.ka-hero-wrap{grid-template-columns:1.05fr .95fr;padding:70px 0}}
.ka-h1{font-size:clamp(32px,5.2vw,62px);line-height:1.1;margin:0 0 12px;font-weight:900;letter-spacing:-.01em;overflow-wrap:anywhere}
.ka-lead{font-size:clamp(16px,2vw,20px);line-height:1.65;color:var(--muted);max-width:760px;margin:0 0 18px;overflow-wrap:anywhere}
.ka-cta{display:flex;gap:12px;flex-wrap:wrap}
.ka-footnote{margin-top:14px;color:var(--muted);font-size:13.5px}

/* ===== КАРТОЧКА И ФОРМА ===== */
.ka-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.ka-calc{padding:20px}
.ka-row{display:grid;gap:12px;grid-template-columns:1fr}
@media (min-width:768px){.ka-row{grid-template-columns:1fr 1fr}}
.ka-field{width:100%;padding:12px 14px;border-radius:12px;background:#fff;border:1px solid var(--border);color:var(--text);outline:none}
.ka-field:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(37,99,235,.18)}
.ka-result{margin-top:8px;padding-top:10px;border-top:1px solid var(--border)}
.ka-presets{margin-top:10px;display:flex;gap:8px;flex-wrap:wrap}

/* ===== TRUST ===== */
.ka-trust{padding:22px 0 8px}
.ka-trust-grid{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center}
@media (min-width:640px){.ka-trust-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ka-trust-item{border:1px dashed var(--border);border-radius:12px;padding:10px 12px;text-align:center;color:var(--muted);font-size:14px;background:#fff}

/* ===== ОБЩИЕ СЕКЦИИ ===== */
.ka-section{padding:52px 0;border-top:1px solid var(--border)}
.ka-title{font-size:clamp(24px,3.2vw,36px);margin:0 0 8px}
.ka-sub{color:var(--muted);margin:0 0 22px}

/* ===== ПРЕИМУЩЕСТВА ===== */
.ka-grid-3{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:768px){.ka-grid-3{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1100px){.ka-grid-3{grid-template-columns:repeat(3,1fr)}}
.ka-benefit{display:flex;gap:14px;padding:16px;border:1px solid var(--border);border-radius:14px;background:#fff}
.ka-ico{width:42px;height:42px;border-radius:12px;background:radial-gradient(circle at 30% 30%, #22c55e, transparent 60%), radial-gradient(circle at 70% 70%, var(--primary), transparent 60%);border:1px solid var(--border)}

/* ===== ЛЬГОТНЫЕ ПРОГРАММЫ (3 карточки, без господдержки) ===== */
.ka-cards{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:900px){.ka-cards{grid-template-columns:repeat(3,1fr)}}
.ka-program{padding:18px}
.ka-program h3{margin:0 0 6px}
.ka-pill{display:inline-block;border:1px solid var(--border);border-radius:999px;padding:4px 10px;font-size:12px;color:var(--muted);background:#f8fafc}
.ka-program ul{margin:10px 0 14px;padding-left:18px;color:var(--muted)}
.ka-program .ka-btn{width:100%}

/* ===== МОБИЛЬНЫЕ ДОРАБОТКИ ===== */
@media (max-width:640px){
  .ka-container{padding-inline:16px}
  .ka-hero-wrap{gap:24px;padding:26px 0 6px}
  .ka-cta .ka-btn{flex:1 0 auto;width:100%}
  .ka-card{border-radius:14px;box-shadow:0 8px 24px rgba(2,6,23,.06)}
  .ka-calc{padding:16px}
  .ka-program{padding:16px}
}

/* ===== АНТИ-ПЕРЕПОЛНЕНИЕ (без «срезов» справа) ===== */
html{scroll-padding-top:72px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
.ka-landing, .ka-landing *{box-sizing:border-box}
.ka-landing .ka-container, .ka-landing .ka-card, .ka-landing .ka-field, .ka-landing .ka-btn{max-width:100%;min-width:0}

/* Глобальные дефолты для переменных темы */
:root{
  --bg:#fff; --bg-soft:#f8fafc; --card:#fff;
  --text:#0f172a; --muted:#475569;
  --primary:#2563eb; --primary-2:#1d4ed8; --border:#e5e7eb;
  --radius:16px; --shadow:0 16px 40px rgba(2,6,23,.08);
}

/* Базовая типографика внутри наших секций */
.ka-landing, .ka-section{
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--text);
}
.ka-section .ka-title{font-weight:900; letter-spacing:-.01em;}
.ka-section h3{font-weight:800; margin:0 0 8px;}
.ka-micro{font-size:12px; color:var(--muted);}

/* Карточки/кнопки на случай, если секция вне ka-landing */
.ka-card{background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); box-shadow:var(--shadow);}
.ka-btn{display:inline-flex; gap:8px; align-items:center; justify-content:center;
  padding:14px 20px; border-radius:12px; border:1px solid transparent;
  font-weight:700; cursor:pointer; transition:.2s ease; white-space:normal; max-width:100%;}
.ka-btn-primary{background:linear-gradient(130deg,var(--primary),var(--primary-2)); color:#fff;}
/* ===== Case: принудительная сетка и косметика ===== */
.ka-section-case { border-top: none; }                    /* убираем разделительную линию у этой секции */
.ka-case{
  display: grid !important;
  grid-template-columns: 1fr;                             /* мобила по умолчанию — в столбик */
  gap: 16px;
  align-items: stretch;
}
@media (min-width: 980px){
  .ka-case{
    grid-template-columns: 1.2fr .8fr !important;         /* слева кейс, справа CTA */
  }
}

.ka-case .ka-card{ padding: 20px; }                       /* чтобы карточки не были «голыми» */
.ka-case-main .ka-title{ margin: 0 0 10px; }
.ka-case .ka-sub{ margin: 0 0 6px; color: var(--muted); }

/* Статистика в 3 колонки на десктопе, ужимается на мобиле */
.ka-stats{
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-top: 16px;
}
.ka-stat{
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fff;
  text-align: center;
}
.ka-stat b{ font-size: 22px; color: var(--text); }

@media (max-width: 640px){
  .ka-stats{ gap: 8px; }
  .ka-stat b{ font-size: 18px; }
}

/* Кнопка в CTA на всю ширину и аккуратные отступы */
.ka-case-cta{
  display: flex; flex-direction: column; justify-content: center;
  gap: 8px;
}
.ka-case-cta .ka-btn{ width: 100%; }

/* На всякий случай: обрезаем возможные переполнения внутри кейса */
.ka-case, .ka-case *{ max-width: 100%; min-width: 0; box-sizing: border-box; }

/* Чередование фона и реверс колонок */
.ka-section--alt{ background: var(--bg-soft); }
@media (min-width:980px){
  .ka-case--reverse{ grid-template-columns: .8fr 1.2fr !important; }
  .ka-case--reverse > .ka-case-main{ order:2; }
  .ka-case--reverse > .ka-case-cta{ order:1; }
}

/* ===== ШАГИ ===== */
.ka-steps{
  display:grid; gap:14px;
  grid-template-columns:1fr 1fr; /* на десктопе 2 колонки-сетки */
}
@media (max-width:900px){ .ka-steps{ grid-template-columns:1fr; } }

.ka-step{
  display:flex; gap:14px; align-items:flex-start;
  padding:16px; border:1px solid var(--border); border-radius:14px; background:#fff;
}
.ka-step-num{
  flex:0 0 40px; height:40px; display:grid; place-items:center;
  border-radius:12px; font-weight:800; color:#fff;
  background:linear-gradient(130deg,var(--primary),var(--primary-2));
  box-shadow:0 8px 20px rgba(37,99,235,.18);
}
.ka-step-body b{ display:block; margin-bottom:4px; }
.ka-steps-cta{ margin-top:18px; display:flex; justify-content:center; }
.ka-steps-cta .ka-btn{ min-width:260px; }

/* ===== FAQ ===== */
.ka-faq{ display:grid; gap:10px; }
.ka-faq-item{
  border:1px solid var(--border);
  border-radius:12px;
  background:#fff;
  padding:12px 14px;
}
.ka-faq-item[open]{ box-shadow:0 6px 16px rgba(2,6,23,.06); }

.ka-faq-item summary{
  cursor:pointer; font-weight:800; list-style:none; outline:0;
  display:flex; align-items:center; gap:10px;
}
.ka-faq-item summary::-webkit-details-marker{ display:none; }
.ka-faq-item summary::after{
  content:"+"; margin-left:auto; font-weight:800; color:var(--muted);
  transition:transform .2s ease;
}
.ka-faq-item[open] summary::after{ transform:rotate(45deg); }

.ka-faq-cta{ margin-top:16px; display:flex; justify-content:center; }
.ka-faq-cta .ka-btn{ min-width:260px; }

/* Мобилка: чуть компактнее */
@media (max-width:640px){
  .ka-faq-item{ padding:12px; }
}

/* ===== Кому подойдёт / когда не подойдёт ===== */
.ka-fitgrid{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:900px){.ka-fitgrid{grid-template-columns:1fr 1fr}}

.ka-fit, .ka-notfit{padding:18px}
.ka-fit-title{margin:0 0 10px}
.ka-fit-list, .ka-notfit-list{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.ka-fit-list li, .ka-notfit-list li{position:relative;padding-left:28px}

.ka-fit-list li::before,
.ka-notfit-list li::before{
  content:"";position:absolute;left:0;top:2px;width:18px;height:18px;border-radius:6px;border:1px solid var(--border);
  background:#fff;
}
.ka-fit-list li::after{
  content:"";position:absolute;left:4px;top:6px;width:10px;height:5px;border-left:3px solid #16a34a;border-bottom:3px solid #16a34a;transform:rotate(-45deg);
}
.ka-notfit-list li::before{background:#fff}
.ka-notfit-list li::after{
  content:"";position:absolute;left:4px;top:4px;width:10px;height:10px;border-right:3px solid #ef4444;border-top:3px solid #ef4444;transform:rotate(45deg);
}

.ka-notfit{background:#fff}
.ka-fit-cta{margin-top:16px;display:flex;justify-content:center}
.ka-fit-cta .ka-btn{min-width:260px}

/* ===== Партнёры (логотипы) ===== */
.ka-logos{display:grid;gap:18px}
.ka-logos-row{
  display:grid;gap:14px;align-items:center;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
@media(min-width:640px){.ka-logos-row{grid-template-columns:repeat(5,minmax(0,1fr))}}
.ka-logos-row img{
  width:100%; max-width:140px; height:48px; object-fit:contain; justify-self:center;
  filter:grayscale(100%); opacity:.9; transition:filter .2s ease, opacity .2s ease, transform .2s ease;
}
.ka-logos-row img:hover{filter:none; opacity:1; transform:translateY(-1px)}
.ka-partners-note{margin-top:8px}

/* ===== Финальный CTA ===== */
.ka-cta-final{background:var(--bg-soft)}
.ka-cta-final-wrap{
  display:flex; gap:12px; align-items:center; justify-content:center; flex-wrap:wrap;
}
.ka-cta-final-text{font-weight:800; font-size:clamp(18px,2.6vw,22px); text-align:center}
.ka-cta-final .ka-btn{min-width:220px}

.btn {
  background: #22c55e;
  color: #fff !important;
  font-weight: 700;
  border-radius: 14px;
  padding: 14px 18px;
  transition: .2s;
}
.btn:hover {
  background: #16a34a;
}

.btn.ghost {
  background: #1f2937;
  border: 1px solid rgba(255,255,255,.12);
  color: #fff !important;
}
.btn.ghost:hover {
  background: #374151;
  color: #fff !important;
}

/* Базово: белый текст и центрирование */
.btn{display:inline-flex;align-items:center;justify-content:center;color:#fff!important;line-height:1.15}

/* Кнопка в калькуляторе (блок результата) — не сжимается, не ломает строки */
#calc .result .btn{
  white-space:nowrap;
  padding:14px 16px;
  font-size: clamp(14px, 3.8vw, 16px);
  min-width: 220px;          /* чтобы «Оформить предзаявку» не ломался */
}

/* Таймер и финальный CTA: на мобилке — на всю ширину */
@media (max-width:640px){
  #urgency .btn,
  .final-cta .btn,            /* добавим класс ниже в разметку */
  .card.final-cta .btn{
    width:100% !important;
    display:flex; justify-content:center;
    white-space:nowrap;
    font-size:16px;
    padding:14px 18px;
  }

  /* В калькуляторе — столбцом и без «прижатия» */
  #calc .result{flex-direction:column;align-items:flex-start;gap:12px}
}

/* На очень узких экранах пусть кнопка может переходить в две строки, но аккуратно */
@media (max-width:360px){
  #calc .result .btn{white-space:normal;text-align:center}
}

.benefit .icon, .bonus .icon{flex:0 0 40px}
.testimonial, .card.testimonial{display:flex;gap:14px;align-items:center}

/* Базовые стили отзывов (если вдруг потерялись) */
.testimonial{display:flex;gap:14px;align-items:flex-start}
.avatar{width:46px;height:46px;border-radius:50%;border:2px solid var(--bg, #0b1224);object-fit:cover}

/* Грид и адаптив — чтобы карточки не исчезали/не улетали */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:960px){ .grid-3{grid-template-columns:1fr 1fr} }
@media (max-width:640px){ .grid-3{grid-template-columns:1fr} }

/* На всякий случай принудительно показываем секцию */
#reviews{display:block !important; opacity:1 !important; visibility:visible !important}

/* ===== 1) Спецусловия + таймер (id="urgency") ===== */
#urgency{display:flex;flex-wrap:wrap;align-items:center}
#urgency > div{flex:1 1 300px}

/* Мобилка: складываем в столбик, делаем кнопку на всю ширину */
@media (max-width:640px){
  #urgency{flex-direction:column;align-items:flex-start;gap:12px}
  #urgency > div:last-child{width:100%;text-align:left}
  #urgency #countdown{
    font-size:18px;            /* не «ломит» строку */
    line-height:1.2;
    white-space:normal;
    margin-bottom:8px;
  }
  #urgency .btn{
    width:100%;
    display:flex;justify-content:center;
  }
}

/* ===== 2) Финальный CTA (добавь ему класс .final-cta) ===== */
.card.final-cta{display:flex;align-items:center;gap:18px}
@media (max-width:640px){
  .card.final-cta{flex-direction:column;align-items:flex-start}
  .card.final-cta .btn{
    width:100%;
    display:flex;justify-content:center;
    margin-top:8px;
  }
  .card.final-cta h2{font-size:22px;line-height:1.25}
}

/* Дополнительно: кнопки всегда центрированы и не «ломаются» */
.btn{justify-content:center;white-space:nowrap;line-height:1.15;color:#fff!important}
@media (max-width:360px){ .btn{white-space:normal;text-align:center} }

/* Мобайл-фикс растяжения секции со спецусловиями */
@media (max-width:640px){
  #urgency{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start !important; /* перебиваем space-between */
    gap:12px;                               /* вместо пустоты */
    padding:16px;                           /* чуть компактнее */
  }
  #urgency > div{width:100%}
  #urgency #countdown{
    font-size:18px; line-height:1.2; margin:0 0 8px;
    white-space:normal;
  }
  #urgency .btn{
    width:100%; display:flex; justify-content:center;
  }
}

/* Мобайл-фикс секции со спецусловиями (#urgency) */
@media (max-width:640px){
  /* Перебиваем любые прошлые флексы/space-between */
  #urgency.strip.card{
    display: grid !important;
    grid-template-columns: 1fr !important;
    row-gap: 12px !important;
    align-content: start !important;
    justify-content: start !important;
    min-height: 0 !important;
    padding: 16px !important;
  }
  #urgency > div{width:100% !important; margin:0 !important; text-align:left !important;}
  #urgency #countdown{
    font-size:18px !important; line-height:1.2 !important;
    white-space:normal !important; margin:0 0 8px !important;
  }
  #urgency .btn{
    width:100% !important; display:flex !important; justify-content:center !important;
  }
}

/* calcpro.css */
.calcpro-section{background:#fff;padding:clamp(24px,6vw,56px) 0}
.calcpro-wrap{max-width:1200px;margin:0 auto;padding:0 clamp(16px,3vw,24px);display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(16px,2.5vw,28px);align-items:start}
.calcpro-head{text-align:center;grid-column:1 / -1;margin-bottom:4px}
.calcpro-eyebrow{display:inline-block;padding:6px 10px;border-radius:999px;background:rgba(34,197,94,.12);color:#166534;font-weight:700;font-size:12px}
.calcpro-h2{margin:10px 0 6px;font-size:clamp(22px,3.2vw,36px);line-height:1.15;color:#0a0a0b}
.calcpro-lead{color:#374151;opacity:.95;margin:0 auto;max-width:760px}

.calcpro-form{background:#f8faff;border:1px solid rgba(12,16,28,.06);border-radius:20px;box-shadow:0 4px 14px rgba(14,16,24,.08);padding:clamp(16px,2.5vw,24px)}
.calcpro-presets{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.calcpro-chip{background:#fff;border:1px solid rgba(12,16,28,.12);border-radius:999px;padding:8px 12px;font-weight:700;cursor:pointer;box-shadow:0 4px 14px rgba(14,16,24,.08)}
.calcpro-chip:focus{outline:3px solid rgba(79,70,229,.35);outline-offset:2px}
.calcpro-field{display:grid;gap:6px;margin-bottom:12px}
.calcpro-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.calcpro-inputrow{position:relative}
.calcpro-suffix{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:#6b7280;font-size:12px;font-weight:700}
.calcpro-form input[type="number"], .calcpro-form select{width:100%;height:48px;padding:10px 36px 10px 12px;border-radius:12px;border:1px solid rgba(12,16,28,.12);background:#fff;font:inherit;color:#111827;box-shadow:0 1px 0 rgba(12,16,28,.02) inset}
.calcpro-form input[type="range"]{width:100%}
.calcpro-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.calcpro-btn{--p:16px;--h:48px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:0 var(--p);height:var(--h);border-radius:14px;border:none;cursor:pointer;text-decoration:none;font-weight:800;letter-spacing:.2px;font-size:15px;line-height:1;white-space:nowrap;box-shadow:0 20px 60px rgba(14,16,24,.18),0 6px 18px rgba(14,16,24,.12);color:#fff;background:linear-gradient(135deg,#4f46e5,#06b6d4)}
.calcpro-help{margin-top:4px;color:#166534;font-weight:700;font-size:12px}
.calcpro-rules{margin-top:8px;color:#374151;font-size:13px}

.calcpro-result{background:#fff;border:1px solid rgba(12,16,28,.06);border-radius:20px;box-shadow:0 4px 14px rgba(14,16,24,.08);pad

/* Подгонка формы #rec1381059761 под стиль сайта */
#rec1381059761 .t-form{
  --accent: #4f46e5;       /* фирменный цвет (фиолетовый) */
  --danger: #ef4444;       /* цвет ошибки */
  --radius: 14px;          /* скругления */
  --shadow: 0 10px 30px rgba(0,0,0,.12);
}

/* ===== СЕТКА ПОЛЕЙ ===== */
#rec1381059761 .t-form__inputsbox{
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
@media (max-width: 640px){
  #rec1381059761 .t-form__inputsbox{ grid-template-columns: 1fr !important; }
}

/* === ОБЩЕЕ ОФОРМЛЕНИЕ === */
.uc-quiz-glass .t-quiz, 
.uc-quiz-glass .t-container{
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  background: rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.28);
  border-radius:16px;
  box-shadow: 0 18px 50px rgba(2,6,23,.12);
  padding: clamp(16px,3vw,28px);
}

/* === ЗАГОЛОВОК / ПРОГРЕСС === */
.uc-quiz-glass .t-quiz__title{
  font-weight:800; 
  font-size:22px;
  letter-spacing:-.02em;
  color:#0f172a;
  margin:0 0 6px;
}
.uc-quiz-glass .t-quiz__descr{ color:#475569; }

.uc-quiz-glass .t-quiz__progress{
  height:10px; 
  background: rgba(15,23,42,.08);
  border-radius:999px; 
  overflow:hidden; 
  margin:14px 0 20px;
}
.uc-quiz-glass .t-quiz__progressbar{
  height:100%; 
  background:#4f46e5; 
  border-radius:999px; 
  transition: width .3s ease;
}

/* === ВОПРОСЫ === */
.uc-quiz-glass .t-quiz__question{
  font-size:20px; 
  font-weight:700; 
  color:#0f172a; 
  margin-bottom:12px;
}

/* === СПИСОК ОТВЕТОВ КАРТОЧКАМИ === */
.uc-quiz-glass .t-quiz__answers-list{
  display:grid; 
  grid-template-columns: 1fr 1fr; 
  gap:12px;
}
@media (max-width:640px){
  .uc-quiz-glass .t-quiz__answers-list{ grid-template-columns: 1fr; }
}

/* прячем стандартные чекбоксы/радио */
.uc-quiz-glass .t-quiz__answers-item input{ 
  position:absolute; 
  opacity:0; 
  pointer-events:none; 
}

/* карточка */
.uc-quiz-glass .t-quiz__answers-item label{
  display:flex; 
  align-items:center; 
  gap:10px;
  background:#fff;
  border:1px solid rgba(15,23,42,.12);
  border-radius:14px;
  padding:14px 16px;
  cursor:pointer;
  transition:.25s;
  box-shadow: inset 0 1px 0 rgba(2,6,23,.04);
  color:#0f172a;
}
.uc-quiz-glass .t-quiz__answers-item label:before{
  content:"";
  width:18px; height:18px; 
  border:2px solid rgba(15,23,42,.3);
  border-radius:6px;
  transition:.25s;
}

/* выбранные */
.uc-quiz-glass .t-quiz__answers-item input:checked + label{
  border-color:#4f46e5;
  box-shadow: 0 0 0 4px rgba(79,70,229,.14);
}
.uc-quiz-glass .t-quiz__answers-item input:checked + label:before{
  border-color:#4f46e5;
  background:#4f46e5;
  box-shadow: inset 0 0 0 4px #fff;
}

/* === ПОЛЯ === */
.uc-quiz-glass .t-input, 
.uc-quiz-glass .t-input-phonemask, 
.uc-quiz-glass select{
  height:54px;
  border-radius:14px;
  border:1px solid rgba(15,23,42,.12);
  background:#fff;
  padding:14px 14px;
  font-size:16px;
  color:#0f172a;
  transition:.25s;
}
.uc-quiz-glass .t-input::placeholder{ color:#64748b; }
.uc-quiz-glass .t-input:focus, 
.uc-quiz-glass select:focus{
  outline:none;
  border-color:#4f46e5;
  box-shadow:0 0 0 4px rgba(79,70,229,.14);
}

/* === КНОПКИ === */
.uc-quiz-glass .t-quiz__btn,
.uc-quiz-glass .t-submit{
  height:56px; 
  border-radius:14px; 
  border:0;
  padding:0 20px;
  font-weight:700; 
  color:#fff; 
  background:#4f46e5;
  box-shadow:0 12px 24px rgba(79,70,229,.28);
  transition:.25s;
}
.uc-quiz-glass .t-quiz__btn:hover,
.uc-quiz-glass .t-submit:hover{
  transform: translateY(-1px);
  background:#5b54ee;
}
.uc-quiz-glass .t-quiz__btn.t-quiz__btn_prev{
  background:rgba(15,23,42,.6);
  box-shadow:none;
}
.uc-quiz-glass .t-quiz__btn[disabled]{ opacity:.55; cursor:not-allowed; }

/* === СПАСИБО === */
.uc-quiz-glass .t-form__successbox{
  background: linear-gradient(180deg,#fff,rgba(255,255,255,.9));
  border:1px solid rgba(34,197,94,.22);
  color:#065f46;
  border-radius:14px;
  padding:16px;
}

.visual-photo {
  width: 100%;
  height: auto;
  border-radius: 16px;
  object-fit: cover;
}

.visual-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
  border-radius: 16px;
}
.blob {
  position: relative;
  z-index: 2;
  opacity: 0.6;
}

.visual {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.visual-inner {
  position: relative;
  width: 100%;
  max-width: 500px; /* при необходимости */
  height: auto;
}

.visual-photo {
  width: 100%;
  height: auto;         /* важно! */
  object-fit: contain;  /* вместо cover */
  border-radius: 16px;
  display: block;
}

aside.right {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
}

.visual {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.visual-inner {
  position: relative;
  width: 100%;
  max-width: 600px; /* можешь поменять */
  height: auto;
  overflow: hidden;
}

.visual-photo {
  width: 100%;
  height: auto;
  object-fit: contain;       /* 👈 не обрезает фото */
  object-position: center;   /* выравнивает по центру */
  border-radius: 16px;
  display: block;
}

.map-pill {
  position: absolute;
  bottom: 15px;
  right: 15px;
  background: rgba(255,255,255,0.9);
  padding: 6px 12px;
  border-radius: 50px;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 6px;
}

aside.right {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  background: #fff;
}

.visual {
  position: relative;
  width: 100%;
  max-width: 1000px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.visual-photo {
  width: 100%;
  height: auto;           /* 👈 ключ */
  object-fit: contain;    /* 👈 не обрезает фото */
  object-position: center;
  display: block;
}

.map-pill {
  position: absolute;
  bottom: 15px;
  right: 15px;
  background: rgba(255,255,255,0.9);
  padding: 6px 12px;
  border-radius: 50px;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 6px;
}
/* 1) убираем обрезание высотой у контейнеров справа */
aside.right,
aside.right .visual {
  height: auto !important;
  min-height: unset !important;
  overflow: visible !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 2) сама картинка — без обрезки, пропорционально */
.visual-photo {
  max-width: 100%;
  max-height: min(72vh, 680px);  /* поместится целиком по высоте экрана */
  width: auto;
  height: auto;
  object-fit: contain;           /* показать целиком */
  object-position: center center;
  display: block;
  border-radius: 16px;
}

/* 3) если где-то выше задано фиксированное: height, overflow:hidden — снимаем */
.section, .container, .visual-inner, .right .visual-inner {
  height: auto !important;
  overflow: visible !important;
  min-height: unset !important;
}

/* 4) бейдж внизу — поверх изображения */
.map-pill {
  position: absolute;
  right: 16px;
  bottom: 16px;
  background: rgba(255,255,255,.9);
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 14px;
}

/* Снимаем жесткие высоты/обрезку у правого столбца */
aside.right {
  display: flex;
  align-items: center;
  justify-content: center;
  height: auto !important;
  min-height: unset !important;
  overflow: visible !important;
}

/* Карточка справа: фиксированная рамка, но фото внутри целиком */
.visual-card {
  position: relative;
  width: 100%;
  max-width: 560px;            /* подбери под макет */
  height: 560px;               /* карточка-квадрат */
  border-radius: 24px;
  background: #0d1320;         /* фон на случай узких экранов */
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;           /* не режем содержимое */
}

/* Картинка — без обрезки */
.visual-photo {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;         /* показать целиком */
  object-position: center;
  display: block;
  border-radius: 16px;
}

/* Бейдж — поверх фото */
.map-pill {
  position: absolute;
  right: 16px; bottom: 16px;
  background: rgba(255,255,255,.9);
  padding: 6px 12px; border-radius: 999px;
  font-size: 14px;
}

/* --- FIX: показываем фото целиком в правом блоке --- */

/* 1) справа ничего не обрезаем */
aside.right { overflow: visible !important; }

/* 2) карточка-рамка: центрируем содержимое */
.visual.visual-card{
  display: flex !important;
  align-items: center;
  justify-content: center;
  height: clamp(360px, 56vh, 560px); /* адаптивная высота без скролла */
  border-radius: var(--radius);
  background: linear-gradient(120deg, rgba(122,163,255,.18), rgba(59,223,179,.14));
  border: 1px solid var(--stroke);
  box-shadow: var(--shadow);
}

/* 3) само изображение — БЕЗ обрезки */
.visual-photo{
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;      /* показать фото целиком */
  object-position: center;
  display: block;
  border-radius: 18px;
}

/* 4) бейдж остаётся поверх фото */
.map-pill{
  position: absolute;
  right: 16px;
  bottom: 16px;
  background: rgba(255,255,255,.88);
  color: #0b1020;
  padding: 8px 12px;
  border-radius: 12px;
  font-size: 12px;
}

/* 5) мобильная подстройка: чуть выше карточку, чтобы фото не сжималось слишком сильно */
@media (max-width: 640px){
  .visual.visual-card{ height: clamp(380px, 64vh, 620px); }
}

/* не даём родителям резать содержимое */
.right, .visual { overflow: visible !important; }

/* карточка-рамка справа */
.visual-card{
  position: relative;
  width: 100%;
  max-width: 560px;
  height: clamp(380px, 56vh, 560px);   /* адаптивно, без скролла */
  border-radius: var(--radius);
  background: linear-gradient(120deg, rgba(122,163,255,.18), rgba(59,223,179,.14));
  border: 1px solid var(--stroke);
  box-shadow: var(--shadow);
}

/* фон-картинка: видно ВСЮ картинку */
.visual-bg{
  background-image: url('https://i.postimg.cc/hjBHKNzX/0-1.png');
  background-size: contain;         /* показать целиком */
  background-repeat: no-repeat;
  background-position: center center;
  /* полупрозрачная подложка уже задана выше в .visual-card */
}

.map-pill{
  position: absolute;
  right: 16px; bottom: 16px;
  background: rgba(255,255,255,.88);
  color: #0b1020;
  padding: 8px 12px;
  border-radius: 12px;
  font-size: 12px;
}

/* мобильная подстройка: можно дать побольше высоты */
@media (max-width:640px){
  .visual-card{ height: clamp(420px, 64vh, 620px); }
}

/* --- Только десктоп: левая сторона на весь экран --- */
@media (min-width: 1025px) {
  .hero {
    grid-template-columns: 1fr;        /* одна колонка */
    gap: 0;                            /* убираем промежуток */
  }

  .left.card {
    width: 100%;                       /* растягиваем текстовый блок */
    max-width: 1280px;                 /* можешь задать ограничение по желанию */
    margin: 0 auto;                    /* центрируем */
    padding: 48px 64px;                /* немного больше воздуха */
  }

  aside.right {
    display: none !important;          /* полностью убираем правый блок */
  }
}

/* --- Десктоп: левая сторона занимает всю высоту окна --- */
@media (min-width: 1025px) {
  body, html {
    height: 100%;
  }

  .container {
    height: 100%;
    display: flex;
    flex-direction: column;
  }

  .hero {
    flex: 1;
    display: flex;
    align-items: center;        /* центрируем вертикально */
    justify-content: center;    /* можно убрать, если не нужно центрировать по горизонтали */
    grid-template-columns: 1fr; /* только левая часть */
    padding-top: 0;
    padding-bottom: 0;
  }

  .left.card {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    padding: 60px 80px;
    background: rgba(14,21,48,.6);
    border: 1px solid var(--stroke);
    border-radius: var(--radius);
    backdrop-filter: blur(8px);
    box-shadow: var(--shadow);
  }

  aside.right {
    display: none !important;   /* скрываем правую часть */
  }
}

:root{ --header-h: 64px; }        /* реальную высоту хэдера можешь поправить */

body{ overflow-x: hidden; }        /* чтобы full-bleed не дал горизонтальный скролл */

/* --- ДЕСKTOP ONLY: левая колонка = один столбец + full-bleed + по высоте экрана --- */
@media (min-width:1025px){

  /* прячем правый столбец */
  aside.right{ display:none !important; }

  /* растягиваем секцию .hero на всю ширину окна, игнорируя .container */
  .hero{
    grid-template-columns: 1fr;        /* одна колонка */
    display: flex;
    align-items: center;                /* вертикальный центр */
    /* full-bleed: выходим за пределы .container */
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    /* делаем экранную высоту с учётом хэдера и внешних паддингов контейнера */
    min-height: calc(100vh - var(--header-h));
    padding-top: 0;
    padding-bottom: 0;
    gap: 0;
  }

  /* хедер зададим минимальную высоту, чтобы calc работал предсказуемо */
  .header{ min-height: var(--header-h); }

  /* сам левый блок — широкая карточка по центру */
  .left.card{
    width: min(1400px, 100%);          /* ограничитель, чтобы текст не расползался */
    margin: 0 auto;
    padding: 64px 72px;                 /* можно уменьшить/увеличить */
  }
}

/* ======= DESKTOP: левая колонка на весь экран, правая скрыта ======= */
@media (min-width:1025px){
  /* прячем правый столбец */
  aside.right{
    display: none !important;
  }

  /* растягиваем секцию hero на ширину окна и на высоту экрана */
  .hero{
    /* только один столбец — левая часть */
    grid-template-columns: 1fr !important;
    gap: 0 !important;

    /* full-bleed внутри .container */
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;

    /* полноэкранная высота и вертикальный центр */
    min-height: 100vh !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 !important;
  }

  /* сама карточка слева — широкая, но с ограничителем */
  .left.card{
    width: min(1200px, 100%) !important;
    margin: 0 auto !important;
    padding: 64px 80px !important; /* можно подправить под вкус */
  }
}

/* ====== Фикс для мобильных экранов (убираем лишнее место снизу) ====== */
@media (max-width: 768px) {
  html, body {
    height: auto !important;
  }

  .hero {
    min-height: auto !important;
    height: auto !important;
    padding-bottom: 0 !important;
  }

  .left.card {
    padding-bottom: 32px !important; /* просто небольшой внутренний отступ */
  }
}

/* === FIX: убираем лишнее пространство снизу на мобильных === */
@media (max-width: 768px) {
  /* 1) секция-герой не должна иметь фиксированную высоту */
  section.hero {
    min-height: auto !important;
    height: auto !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  /* 2) общий контейнер — минимум отступа снизу */
  .container {
    padding-bottom: 8px !important;
  }

  /* 3) последняя карточка и блоки внутри — без внешних отступов вниз */
  .left.card {
    margin-bottom: 0 !important;
    padding-bottom: 16px !important; /* небольшой внутренний отступ, чтобы кнопки не липли */
  }
  .steps { margin-bottom: 0 !important; }
  .trust { margin-bottom: 8px !important; }
}

/* На всякий случай: если где-то раньше задан 100vh — снимаем в мобилке */
@media (max-width: 768px) {
  .vh-100, .minvh-100, .fullvh, .hero.full {
    min-height: auto !important;
    height: auto !important;
  }
}

@media (max-width: 768px) {
  .container { padding-bottom: 0 !important; }
  .left.card { padding-bottom: 8px !important; }
}

/* Мобилка: скрыть правый столбец полностью и оставить одну колонку */
@media (max-width: 1024px) {
  aside.right { 
    display: none !important;
  }
  .hero {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
}

/* Доп. фиксы от «лишних высот» на телефонах */
@media (max-width: 768px) {
  /* если вдруг где-то задана фикс-высота секции — снимаем */
  .hero { 
    min-height: auto !important; 
    height: auto !important; 
    padding-bottom: 0 !important; 
    margin-bottom: 0 !important; 
  }
  /* убираем лишние нижние отступы */
  .container { 
    padding-bottom: 8px !important; 
  }
}


/* === Tilda mobile fix / scope === */
#kap { isolation:isolate; -webkit-text-size-adjust:100%; text-size-adjust:100%; }
#kap, #kap * { box-sizing:border-box; font-family: ui-sans-serif, -apple-system, Segoe UI, Roboto, Inter, "Helvetica Neue", Arial, "Noto Sans" !important; }
#kap img, #kap video { max-width:100%; height:auto; }

/* Сброс влияния тильдовских h1/h2/t-text на мобилке */
#kap h1, #kap h2, #kap h3, #kap p, #kap a, #kap span, #kap div { letter-spacing: normal; }
#kap h1 { margin: 14px 0 8px; line-height:1.08; font-weight:900; }
#kap a { text-decoration:none; }

/* Контейнер и отступы */
#kap .container { max-width:1180px; margin:0 auto; padding:24px; }
@media (max-width:640px){
  #kap .container{ padding:18px; }
  #kap .cta-row{ flex-direction:column; }
  #kap .cta-row .btn{ width:100%; min-height:56px; }
  #kap .badges, #kap .reviews, #kap .faq{ grid-template-columns:1fr !important; }
}

/* Коррекция размеров шрифтов на мобилке (Тильда любит их увеличивать) */
@media (max-width:480px){
  #kap h1{ font-size: clamp(26px, 8.5vw, 34px) !important; }
  #kap .sub{ font-size:15px !important; }
  #kap .btn{ font-size:16px !important; min-height:54px !important; }
  #kap .modal-card{ width:100% !important; max-width:none !important; margin:0 10px !important; border-radius:16px !important; padding:14px !important; }
  #kap form.quiz, #kap form.lead{ grid-template-columns:1fr !important; }
}

/* Док-панель снизу, чтобы не «уползала» под чужие блоки */
#kap .cta-dock{ position:fixed !important; left:0; right:0; bottom:0; z-index: 4000 !important; }

/* Модалка поверх всего и без влияния соседей */
#kap .modal{ position:fixed !important; inset:0; display:none; align-items:center; justify-content:center;
             background:rgba(0,0,0,.75); z-index: 5000 !important; }
#kap .modal[aria-hidden="false"]{ display:flex !important; }
#kap .modal-card{ background:#0f172a; border:1px solid rgba(255,255,255,.16); }

/* Декор не перехватывает клики */
#kap .card:before, #kap .stamp{ pointer-events:none; }


/* Убираем влияние внешних контейнеров на наш блок */
#allrecords, .t-container, .t-col, .t-row, .t-rec, .r {
  background: transparent !important;
}
#recXXXX, #kap-host { /* заменишь XXXX на id этого блока, если знаешь; иначе просто оставь */
  margin: 0 !important;
  padding: 0 !important;
}
body .t-rec_pt_0, body .t-rec_pb_0 { padding-top:0 !important; padding-bottom:0 !important; }

/* На мобиле Тильда иногда добавляет лишние отступы/масштаб */
@media (max-width: 480px){
  html, body { -webkit-text-size-adjust: 100% !important; text-size-adjust: 100% !important; }
  #kap-host iframe { min-height: 560px !important; }
}



/* Жёстко переопределяем тильдовские пресеты для только наших кнопок */
.t-container a.btn,
.t-rec a.btn,
a.btn{
  text-decoration: none !important;
  background-image: none !important; /* отключаем их градиенты */
}

/* Поднимаем специфичность — точно забираем цвет под себя */
header .cta a.btn.primary{
  background: linear-gradient(135deg, var(--accent-2), var(--accent)) !important;
  color:#fff !important;
}
header .cta a.btn.ghost{
  background:#F8FAFA !important;
  border:1px solid var(--stroke) !important;
  color:var(--accent) !important;
}

/* 🔧 Mobile polish (добавить в конец CSS) */
:root{
  /* лёгкая коррекция контраста на мобильных */
  --stroke:#E9EBEF;
}

/* 🧱 Полный анти-оверфлоу */
html, body {
  overflow-x: hidden !important;
  width: 100% !important;
  max-width: 100% !important;
  position: relative;
}

/* grid-элементы должны уметь сжиматься */
header,
header > *,
.visual,
.mock,
.mock-grid,
.mock .cell,
.thumb {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

/* Картинки и SVG не выталкивают ширину */
img, svg {
  max-width: 100% !important;
  height: auto !important;
  display: block;
}

/* Риббон и карточки подрезаем внутри контейнера */
.visual { overflow: hidden !important; }
.ribbon {
  position: relative !important;
  right: 0 !important;
  left: 0 !important;
  margin: 0 0 10px !important;
  display: inline-block;
  transform: none !important;
}

/* На мобильных всё строго в потоке */
@media (max-width: 900px){
  .mock, .thumb { width: 100% !important; max-width: 100% !important; }
  .mock-grid { grid-template-columns: 1fr !important; }
  header { padding-right: calc(18px + env(safe-area-inset-right)) !important; }
}

/* ✅ Не обрезаем текстовую колонку */
header > :first-child { 
  overflow: visible !important;   /* вернуть как было */
  padding-right: 2px;             /* анти sub-pixel клиппинг */
}

/* ✂️ Обрезание только справа у визуала (как и хотели) */
.visual { overflow: hidden !important; }

/* 🔤 Переносы для длинных русских слов в заголовке */
h1{
  overflow-wrap: anywhere;  /* переносит при необходимости */
  word-break: normal;
  hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  letter-spacing: -.3px;    /* чуть мягче на мобилке */
}

@media (max-width: 900px){
  h1{ letter-spacing: -.2px; }
}

a.btn.ghost {
  background: #F9FAF9;
  outline: 1px solid var(--stroke);
  color: var(--ink);
  box-shadow: 0 2px 6px rgba(0,0,0,.04);
  transition: .25s ease;
}

a.btn.ghost:hover {
  background: #E7F7F7;
  color: var(--accent);
  outline-color: #94DED9;
  box-shadow: 0 4px 10px rgba(14,165,164,.15);
}

/* заметная, но не кричит */
a.btn.ghost{
  background: linear-gradient(180deg,#F2FBFA 0%, #ECF7F6 100%);
  border: 1px solid #94A3B8;             /* более контрастная рамка */
  color: #0F172A;
  box-shadow: 0 2px 10px rgba(15, 23, 42, .06);
}
a.btn.ghost:hover{
  background: #E3F4F3;
  border-color: #0EA5A4;
  color: #0C948F;
  box-shadow: 0 4px 14px rgba(14,165,164,.18);
}
a.btn.ghost:focus-visible{
  outline: 3px solid rgba(14,165,164,.35);
  outline-offset: 2px;
}
a.btn.ghost:active{ transform: translateY(1px) scale(.99); }


/* --- FORCE GHOST BUTTON VISIBLE --- */
header .cta a.btn.ghost{
  background: linear-gradient(180deg,#F3F6F6 0%, #ECEFF0 100%) !important; /* светло-серый фон, не сливается */
  border: 2px solid #64748B !important;                                   /* контрастная рамка */
  color: #0F172A !important;                                              /* тёмный текст */
  box-shadow: 0 2px 10px rgba(2,6,23,.12) !important;                     /* лёгкая тень */
  background-clip: padding-box !important;
}
header .cta a.btn.ghost .ico{
  color: #0F172A !important; /* иконка видимая */
  stroke: currentColor !important;
}
header .cta a.btn.ghost:hover{
  background: #E7F7F7 !important;
  border-color: #0EA5A4 !important;
  color: #0C948F !important;
}
header .cta a.btn.ghost:active{
  transform: translateY(1px) scale(.99) !important;
}

/* на мобилке — во всю ширину */
@media (max-width:600px){
  header .cta a.btn.ghost{ width:100% !important; }
}


/* Удаляем вторую кнопку рядом с "Рассчитать дом" */
header .cta a.btn.ghost {
  display: none !important;
}