/* ============================================================
   Общая тема квиз-посадок Новастроя на движке НОВЫ.
   Подключается ПОСЛЕ site.css (взят с /nova-assets/ без правок).
   На <body>: theme-nova (раскладка nova-business) + theme-brand.
   Цвета, шрифты и графика проекта задаются переменными в brand.css,
   который подключается следом.
   ============================================================ */
body.theme-brand{font-weight:500}

/* ---------- логотипы ---------- */
.theme-brand .brand{align-items:center;gap:16px}
.brand__logo{height:var(--logo-h,64px);width:auto;flex:none}
.brand--compact .brand__logo{height:calc(var(--logo-h,64px) * .82)}
.theme-brand .brand__sub{color:var(--dim);font-weight:600}
.theme-brand .intro__dev-logo{height:20px}
.theme-brand .intro__official{color:var(--dim);font-weight:600}
@media(max-width:700px){
  .brand__logo{height:calc(var(--logo-h,64px) * .8)}
  .theme-brand .brand{align-items:flex-start;gap:6px}
  .theme-brand .intro__dev-logo{height:14px}
}

/* ---------- вязь: не под текстом ----------
   На первом экране — белым поверх угла видео; в квизе и форме —
   персиковым в свободном углу экрана (только на десктопе). */
.theme-brand .intro__content,
.theme-brand .screen--quiz,
.theme-brand .screen--form{position:relative;isolation:isolate;background-color:var(--bg)}
.theme-brand .intro__media::after{
  content:"";position:absolute;z-index:1;pointer-events:none;
  left:-46px;top:-34px;width:min(380px,58%);aspect-ratio:402/322;
  background:var(--deco-photo) no-repeat left top/contain;opacity:var(--deco-photo-opacity,.92);
}
@media (min-width:1100px){
  .theme-brand .screen--quiz::after,
  .theme-brand .screen--form::after{
    content:"";position:absolute;z-index:-1;pointer-events:none;
    right:-70px;bottom:-60px;width:min(340px,24vw);aspect-ratio:402/322;
    background:var(--deco-corner) no-repeat right bottom/contain;opacity:.55;
  }
}

/* ---------- типографика ---------- */
.theme-brand .slogan,
.theme-brand .eyebrow{color:var(--accent2);font-weight:700}
.theme-brand .intro__title,
.theme-brand .quiz__question,
.theme-brand .lead__title,
.theme-brand .plans-band__title,
.theme-brand .terms__title{font-weight:600;letter-spacing:-.025em}
/* ключевое слово — персиковым маркером */
.theme-brand .intro__title .accent,
.theme-brand .lead__title .accent{
  color:var(--paper);font-weight:600;background:var(--tint);padding:.02em .18em .06em;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
}

/* ---------- два оффера: выгода и семейная ипотека ---------- */
.offers{
  display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:stretch;
  gap:0;margin-top:clamp(16px,2.4vh,26px);max-width:720px;
}
.offer{
  background:var(--tint-soft);padding:clamp(12px,1.8vh,18px) clamp(14px,1.5vw,20px);
  display:flex;flex-direction:column;justify-content:center;gap:4px;min-width:0;
  container-type:inline-size;
}
.offer--main{background:var(--paper);color:#fff}
.offers__or{
  align-self:center;justify-self:center;z-index:1;margin:0 -13px;
  width:44px;height:44px;border-radius:50%;display:grid;place-content:center;
  background:#fff;border:1px solid var(--line);
  font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);
}
.offer__cap{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--accent2)}
.offer--main .offer__cap{color:var(--tint)}
.offer__big{
  font-family:var(--font-display);font-weight:600;letter-spacing:-.025em;line-height:1.05;white-space:nowrap;
  font-size:clamp(20px,2.05vw,29px);
}
/* ПСК и ставка — одним кеглем, ПСК выше */
.offer__law{
  font-family:var(--font-display);font-weight:600;letter-spacing:-.02em;line-height:1.18;
  font-size:clamp(11px,4.9cqw,16px);white-space:nowrap;
}
.offer__hl{background:var(--tint);color:var(--paper);padding:0 .22em}
.offer__sub{font-size:13.5px;font-weight:600;line-height:1.35;margin-top:3px}
.offer__sub b{font-family:var(--font-display);font-weight:600;letter-spacing:-.02em}
.offer__note{font-size:11.5px;line-height:1.35;color:var(--dim)}
.offer--main .offer__note{color:rgba(255,255,255,.72)}
.offer sup{font-size:.55em;line-height:0;vertical-align:super}
@media(max-width:700px){
  .offers{grid-template-columns:minmax(0,1fr);gap:0}
  .offers__or{margin:-13px 0;width:40px;height:40px}
  .offer__big{font-size:26px}
  .offer__law{font-size:clamp(12px,4.6cqw,16px)}
}

/* ---------- чипы, кнопки ---------- */
.theme-brand .chip{background:var(--bg-2);border-color:transparent;font-weight:600;color:var(--paper)}
.theme-brand .btn{color:var(--accent);font-family:var(--font-display);font-weight:600;letter-spacing:.08em}
.theme-brand .btn--primary,.theme-brand .btn--submit{color:#fff}
.theme-brand .btn--primary::before,.theme-brand .btn--submit::before{background:var(--accent2)}
.theme-brand .btn--ghost{color:var(--dim);border-color:var(--line);font-family:var(--font-ui);letter-spacing:.14em}
.theme-brand .btn--ghost::before{background:var(--bg-2)}
.theme-brand .hint-quiz{color:var(--dim)}
.theme-brand .hint-quiz::before{background:var(--tint)}

/* ---------- видео: без затемнения ---------- */
.theme-brand .intro__photo{filter:none}
.theme-brand .intro__scrim{background:none}
.intro__mark{
  position:absolute;right:12px;top:12px;z-index:2;font-size:10.5px;font-weight:600;
  background:rgba(255,255,255,.86);color:var(--paper);padding:4px 8px;letter-spacing:.02em;
}

/* ---------- плашка «О проекте»: три равные колонки, текст не выходит за края ---------- */
.theme-brand .fact-card{
  container-type:inline-size;
  left:50%;right:auto;transform:translateX(-50%);
  width:min(520px,calc(100% - 2 * clamp(18px,3vw,40px)));max-width:none;
  background:rgba(255,255,255,.94);border-color:transparent;
  padding:clamp(14px,2vh,22px) clamp(16px,2vw,26px);
}
.theme-brand .fact-card__label{color:var(--accent2);margin-bottom:10px}
.theme-brand .fact-card__grid{display:grid;grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr) 1px minmax(0,1fr);gap:0 clamp(10px,3cqw,20px);align-items:start}
.theme-brand .fact-card__rule{align-self:stretch}
.theme-brand .fact-card__num{
  font-weight:600;white-space:nowrap;
  font-size:clamp(14px,4.3cqw,21px);
}
.theme-brand .fact-card__cap{font-weight:600;font-size:clamp(9px,2.3cqw,10.5px);line-height:1.35}
.theme-brand .fact-card__num--text{white-space:nowrap}
@media(max-width:960px){
  .theme-brand .metrics{container-type:inline-size;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .theme-brand .metrics__num{font-weight:600;font-size:clamp(12px,4.2cqw,16px);white-space:nowrap}
  .theme-brand .metrics__cap{font-weight:600;line-height:1.35}
}

/* ---------- квиз ---------- */
.theme-brand .progress{background:var(--bg-3);height:3px}
.theme-brand .progress__fill{background:var(--paper)}
.theme-brand .option{background:#fff;font-weight:600;color:var(--paper);border-color:var(--line)}
.theme-brand .option:hover{border-color:var(--paper)}
.theme-brand .option.is-selected{background:var(--tint-soft);border-color:var(--paper)}
.theme-brand .usp{background:var(--bg-2);border-color:transparent}
.theme-brand .usp__text{opacity:1;font-weight:600}
.theme-brand .quiz__counter,.theme-brand .quiz__hint{color:var(--dim);font-weight:600}

/* ---------- форма ---------- */
.theme-brand .form-card{box-shadow:0 26px 60px -36px rgba(var(--ink-rgb),.5);border-color:var(--line)}
.theme-brand .form__title{font-weight:600}
.theme-brand .field__input{background:#fff;color:var(--paper);font-weight:500}
.theme-brand .channel span:last-child{background:#fff;font-weight:600}
.theme-brand .channel input:checked ~ span:last-child{color:#fff;background:var(--accent);border-color:var(--accent)}
.theme-brand .check a{color:var(--paper)}
.theme-brand .lead__usps li{color:var(--paper);font-weight:600}
.theme-brand .lead__usps li::before{background:var(--tint)}
.theme-brand .lead__lede{font-weight:500}
.theme-brand .lead__legal{color:var(--dim)}
.theme-brand .field__err,.theme-brand .form__senderr,.theme-brand .consents.is-invalid .check{color:#A8322B}
.theme-brand .field.is-invalid .field__input{border-color:#A8322B}

/* ---------- планировки: 3D на цветном поле, выгода крупнее цены ---------- */
.theme-brand .plans-band{background:var(--bg-2)}
.theme-brand .plan{border-color:transparent;background:#fff}
.theme-brand .plan__fig{background:var(--tint-soft);aspect-ratio:16/11;overflow:hidden}
.theme-brand .plan:nth-child(2) .plan__fig{background-color:var(--tint-mid)}
.theme-brand .plan:nth-child(3) .plan__fig{background-color:var(--tint)}
.theme-brand .plan__img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:34px 18px 14px;filter:drop-shadow(0 14px 18px rgba(var(--ink-rgb),.22))}
.theme-brand .plan__meta{color:var(--paper);font-weight:600}
.theme-brand .plan__body{gap:5px;padding:14px 16px 16px}
.theme-brand .plan__type{order:0;color:var(--dim);font-weight:700}
.theme-brand .plan__gain{
  order:1;font-family:var(--font-display);font-weight:600;font-size:clamp(16px,1.45vw,21px);line-height:1.1;
  letter-spacing:-.02em;color:var(--paper);
}
.theme-brand .plan__gain::first-letter{text-transform:uppercase}
.theme-brand .plan__old{order:2;color:var(--dim);font-weight:500;margin-top:4px}
.theme-brand .plan__new{order:3;font-size:15px;font-weight:600;align-self:flex-start;background:var(--tint-soft);padding:6px 9px}
.theme-brand .plan__tag{order:4;color:var(--dim);font-weight:600;margin-top:2px}
.theme-brand .lead__plans .plan__gain{font-size:14.5px}
.theme-brand .lead__plans .plan__new{font-size:13px}
.theme-brand .lead__plans .plan__type{font-size:10.5px;letter-spacing:.08em}
.theme-brand .lead__plans .plan__img{padding:26px 8px 8px}
@media (min-width:961px){
  .theme-brand .plans-band .plans{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* ---------- подвал, диалог, предупреждение ---------- */
.theme-brand .disclaimer{background:var(--bg-2)}
.theme-brand .disclaimer__legal,.theme-brand .credit__label{color:var(--dim)}
.theme-brand .credit__mark{color:var(--accent2)}
.theme-brand .terms__box{background:#fff}
.theme-brand .terms__eyebrow{color:var(--accent2)}
.theme-brand .terms::backdrop{background:rgba(var(--ink-rgb),.6)}
.theme-brand .risk-note{background:#fff;border-left-color:var(--paper);box-shadow:0 22px 50px -24px rgba(var(--ink-rgb),.7)}
.theme-brand .risk-note__text{font-weight:600}

/* ---------- размеры первого экрана ---------- */
/* Unbounded шире Montserrat — заголовок чуть мельче, чем у НОВЫ */
@media (min-width:961px){
  .theme-brand .intro__title{font-size:clamp(28px,3vw,44px);line-height:1.12;margin-top:14px}
  .theme-brand .intro__pitch{max-width:min(760px,100%)}
  .theme-brand .chips{margin-top:clamp(14px,2.2vh,24px);gap:8px}
  .theme-brand .chip{font-size:13.5px;padding:8px 15px}
  .theme-brand .intro__cta{margin-top:clamp(18px,2.8vh,34px)}
}
@media (min-width:961px) and (max-height:880px){
  .theme-brand .intro__title{font-size:clamp(22px,3.9vh,36px);margin-top:10px}
  .brand__logo{height:calc(var(--logo-h,64px) * .88)}
  .theme-brand .chips{margin-top:14px;gap:6px}
  .theme-brand .chip{font-size:12.5px;padding:6px 12px}
  .offer{padding:11px 15px}
  .offer__big{font-size:clamp(19px,3.1vh,26px)}
  .offer__sub{font-size:12.5px}
  .offer__note{font-size:11px}
  .theme-brand .fact-card__num{font-size:clamp(14px,4.3cqw,21px)}
}
@media (min-width:961px) and (max-height:700px){
  .theme-brand .chip:nth-child(n+5){display:none}
  .theme-brand .hint-quiz{display:none}
  .brand__logo{height:calc(var(--logo-h,64px) * .74)}
}
@media(max-width:960px){
  .theme-brand .intro__title{font-size:clamp(22px,6.4vw,32px)}
}

/* ============================================================
   ТЕЛЕФОН (до 960 px)
   Кнопка квиза всегда под рукой, первый экран короче,
   ничего не выходит за края при ширине от 320 px.
   ============================================================ */
@media(max-width:960px){
  .theme-brand .intro__media{min-height:0;height:36svh;max-height:340px}
  .theme-brand .intro__content{padding-top:16px;padding-bottom:0;gap:18px;overflow:visible}
  .theme-brand .intro__head{align-items:center}
  .theme-brand .brand{flex-direction:row;align-items:center;gap:10px}
  .brand__logo{height:calc(var(--logo-h,64px) * .72)}
  .theme-brand .brand__sub{font-size:10px;letter-spacing:.1em;white-space:nowrap}
  .theme-brand .slogan{font-size:12px;letter-spacing:.12em}
  .theme-brand .intro__title{margin-top:8px;line-height:1.12}
  .offers{margin-top:16px}
  .offer{padding:14px 16px}
  .theme-brand .chips{margin-top:16px;gap:6px}
  .theme-brand .chip{font-size:12px;padding:6px 11px}
  .theme-brand .metrics{margin-top:16px;padding-top:14px}
  /* кнопка прилипает к низу экрана, пока человек читает первый экран */
  .theme-brand .intro__cta{
    position:sticky;bottom:0;z-index:20;align-items:stretch;gap:0;
    margin:0 calc(-1 * var(--pad));padding:10px var(--pad) calc(10px + env(safe-area-inset-bottom));
    background:rgba(255,255,255,.96);border-top:1px solid var(--line);
  }
  .theme-brand .intro__cta .btn{width:100%;padding:16px 12px;font-size:13px}
  .theme-brand .intro__cta .hint-quiz{display:none}
  /* предупреждение о рисках — над кнопкой, а не поверх неё */
  .theme-brand[data-view="intro"] .risk-note{bottom:calc(84px + env(safe-area-inset-bottom))}
  /* в квизе и форме — сверху, чтобы не закрывать «Назад» и кнопку отправки */
  .theme-brand[data-view="quiz"] .risk-note,
  .theme-brand[data-view="form"] .risk-note{bottom:auto;top:calc(8px + env(safe-area-inset-top))}
  /* планировки листаются пальцем: видно, что справа есть ещё */
  .theme-brand .plans-band{padding-top:26px;padding-bottom:26px}
  .theme-brand .plans-band__head{margin-bottom:14px}
  .theme-brand .plans-band__head .btn{display:none}
  .theme-brand .plans{grid-auto-columns:78%;gap:10px;margin-right:calc(-1 * var(--pad));padding-right:var(--pad)}
  .theme-brand .lead__plans .plans{grid-auto-columns:62%}
  .theme-brand .plan__gain{font-size:18px}
  /* квиз и форма */
  .theme-brand .quiz{padding-top:14px}
  .theme-brand .quiz__question{font-size:22px}
  .theme-brand .option{padding:15px 16px}
  .theme-brand .usps{gap:8px}
  .theme-brand .usp{flex:1 1 100%;padding:8px 12px 8px 8px}
  .theme-brand .usp__img{width:52px;height:52px}
  .theme-brand .lead{padding-top:20px;gap:22px}
  .theme-brand .form-card{padding:18px 16px}
  /* длинный юрблок в подвале — в прокручиваемом окне, полный текст по ссылке */
  .theme-brand .disclaimer__legal--full{display:block;max-height:calc(7 * 1.6em);overflow-y:auto;padding-right:6px}
  .theme-brand .disclaimer{padding-bottom:calc(16px + env(safe-area-inset-bottom))}
}
@media(max-width:360px){
  .offer__big{font-size:23px}
  .theme-brand .intro__title{font-size:21px}
  .theme-brand .brand__sub{display:none}
}