/* ============================================================
   /services/nova/ - «Нова: голосовой ИИ-бот на входящих звонках»
   Палитра §1 design-system. Холст 1564px, секции full-bleed.
   Всё скоуплено под #nvx (изоляция от темы Aspro).
   ============================================================ */

#nvx{
  --green:#6bb476; --green-dk:#4d9659; --green-lt:#edf6ef;
  --forest:#0d1f1a; --ink:#1F2A24; --gray:#6b7280; --border:#e5e7eb;
  --canvas:#FAFAF7; --card:#ffffff; --coral:#E8665A; --mint:#8AD8A8;
  --ink-on-dark:#d7e2db;
  --page:1564px; --pad:32px; --rhythm:64px; --r-card:18px; --r-lg:24px; --r-sm:12px;
  background:var(--canvas); color:var(--ink);
  font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased;
}
#nvx *{box-sizing:border-box; font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif !important}
#nvx .container::before,#nvx .container::after{display:none !important}
#nvx section, #nvx [class*="nvx-"]{content-visibility:visible !important; contain:none !important}
#nvx p{margin:.5rem 0}
#nvx a{text-decoration:none}
#nvx img{max-width:100%; height:auto}
#nvx em{font-style:normal !important}

/* закон холста */
#nvx .nvx-sec{width:100%; padding:var(--rhythm) 0; margin:0}
#nvx .nvx-wrap{max-width:var(--page); margin:0 auto; padding:0 var(--pad)}
#nvx .nvx-sec--soft{background:var(--green-lt)}
#nvx .nvx-sec--dark{background:var(--forest); color:var(--ink-on-dark)}
#nvx .nvx-sec--hero{background:linear-gradient(180deg,var(--green-lt),rgba(237,246,239,0)); padding-top:48px}

/* типографика */
#nvx .nvx-eyebrow{font-size:.78rem; letter-spacing:.09em; text-transform:uppercase; color:var(--green-dk); font-weight:700; display:inline-flex; align-items:center; gap:.5em}
#nvx .nvx-eyebrow::before{content:""; width:.5em; height:.5em; border-radius:999px; background:var(--green)}
#nvx h1.nvx-h1{font-size:clamp(2.1rem,4.8vw,3.7rem); line-height:1.12; margin:.6rem 0 0; font-weight:800; letter-spacing:-.015em; color:var(--ink)}
#nvx .nvx-h1 em{color:var(--green-dk)}
#nvx h2.nvx-h2{font-size:clamp(1.5rem,3vw,2.1rem); line-height:1.15; margin:0 0 .3rem; font-weight:800; letter-spacing:-.01em; color:var(--ink)}
#nvx .nvx-h2 em{color:var(--green-dk)}
#nvx .nvx-sec--dark h2.nvx-h2{color:#fff}
#nvx h3.nvx-h3{font-size:1.1rem; margin:0 0 .35rem; font-weight:700; color:var(--ink)}
#nvx .nvx-lead{font-size:clamp(1.05rem,2vw,1.25rem); color:var(--ink); max-width:44rem}
#nvx .nvx-muted{color:var(--gray)}

/* hero */
#nvx .nvx-hero-grid{display:grid; gap:40px; align-items:center}
@media(min-width:960px){#nvx .nvx-hero-grid{grid-template-columns:1.02fr .98fr}}
#nvx .nvx-trust{display:flex; flex-wrap:wrap; gap:.5rem 1.3rem; margin-top:1.3rem; font-size:.84rem; color:var(--gray)}
#nvx .nvx-trust span{display:inline-flex; align-items:center; gap:.45em}
#nvx .nvx-trust span::before{content:""; width:.5em; height:.5em; border-radius:999px; background:var(--green); flex:none}

/* кнопки */
#nvx .nvx-btn{display:inline-flex; align-items:center; gap:.5em; font-weight:700; font-size:1rem; padding:.85em 1.5em; border-radius:var(--r-sm); border:1.5px solid transparent; cursor:pointer; transition:transform .12s, background .12s; line-height:1.2}
#nvx .nvx-btn:hover{transform:translateY(-1px)}
#nvx .nvx-btn--green{background:var(--green-dk); color:#fff}
#nvx .nvx-btn--green:hover{background:#3C6440; color:#fff}
#nvx .nvx-btn--ghost{background:transparent; color:var(--green-dk); border-color:var(--border)}
#nvx .nvx-sec--dark .nvx-btn--ghost{color:var(--mint); border-color:rgba(255,255,255,.25)}
#nvx .nvx-cta-row{display:flex; flex-wrap:wrap; gap:12px; margin-top:1.5rem}
#nvx .nvx-btn:focus-visible{outline:2px solid var(--green-dk); outline-offset:3px}

/* карточки и сетки */
#nvx .nvx-grid{display:grid; gap:16px}
@media(min-width:640px){#nvx .nvx-g2{grid-template-columns:1fr 1fr} #nvx .nvx-g3{grid-template-columns:repeat(3,1fr)}}
@media(min-width:960px){#nvx .nvx-g4{grid-template-columns:repeat(4,1fr)}}
#nvx .nvx-card{background:var(--card); border:1px solid var(--border); border-radius:var(--r-card); padding:26px; box-shadow:0 1px 2px rgba(17,31,26,.04); transition:transform .12s, box-shadow .12s}
#nvx .nvx-card:hover{transform:translateY(-2px); box-shadow:0 18px 44px rgba(107,180,118,.13)}
#nvx .nvx-ic{width:40px; height:40px; border-radius:10px; background:var(--green-lt); color:var(--green-dk); display:grid; place-items:center; font-weight:800; margin-bottom:.6rem}
#nvx .nvx-ic svg{width:22px; height:22px; fill:var(--green-dk)}

/* диалог-виджет в hero (постановочный пример разговора) */
#nvx .nvx-call{background:var(--card); border:1px solid var(--border); border-radius:var(--r-lg); padding:24px 24px 20px; box-shadow:0 22px 54px -34px rgba(17,31,26,.4)}
#nvx .nvx-call__head{display:flex; align-items:center; justify-content:space-between; gap:10px; padding-bottom:14px; border-bottom:1px solid var(--border); margin-bottom:16px}
#nvx .nvx-call__num{font-weight:800; font-size:.95rem}
#nvx .nvx-call__status{display:inline-flex; align-items:center; gap:8px; background:var(--green-lt); color:var(--green-dk); font-weight:700; font-size:.78rem; padding:5px 12px; border-radius:999px; white-space:nowrap}
#nvx .nvx-call__status::before{content:""; width:8px; height:8px; border-radius:999px; background:var(--green)}
#nvx .nvx-msgs{display:grid; gap:10px}
#nvx .nvx-msg{max-width:85%; padding:10px 14px; border-radius:14px; font-size:.92rem; line-height:1.5}
#nvx .nvx-msg--bot{background:var(--green-lt); color:var(--ink); justify-self:start; border-bottom-left-radius:4px}
#nvx .nvx-msg--client{background:#e5e7eb; color:var(--ink); justify-self:end; border-bottom-right-radius:4px}
#nvx .nvx-msg .nvx-who{display:block; font-size:.78rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--green-dk); margin-bottom:2px}
#nvx .nvx-msg--client .nvx-who{color:var(--gray)}
#nvx .nvx-call__foot{display:flex; align-items:center; gap:8px; margin-top:16px; font-size:.8rem; color:var(--gray)}
#nvx .nvx-call__foot b{color:var(--ink)}

/* шаги «как подключаем» */
#nvx .nvx-steps{display:grid; gap:16px; counter-reset:step}
@media(min-width:960px){#nvx .nvx-steps{grid-template-columns:repeat(4,1fr)}}
@media(min-width:640px) and (max-width:959px){#nvx .nvx-steps{grid-template-columns:1fr 1fr}}
#nvx .nvx-step{position:relative; background:var(--card); border:1px solid var(--border); border-radius:var(--r-card); padding:26px}
#nvx .nvx-step::before{counter-increment:step; content:counter(step); display:grid; place-items:center; width:40px; height:40px; border-radius:999px; background:var(--forest); color:var(--mint); font-weight:800; margin-bottom:.7rem}

/* пакеты цен */
#nvx .nvx-price{display:grid; gap:16px; margin-top:1.8rem}
@media(min-width:960px){#nvx .nvx-price{grid-template-columns:repeat(3,1fr)}}
#nvx .nvx-plan{background:var(--card); border:1px solid var(--border); border-radius:var(--r-card); padding:28px; display:flex; flex-direction:column; gap:0}
#nvx .nvx-plan--hit{border-color:var(--green-dk); border-width:2px; position:relative}
#nvx .nvx-plan__flag{position:absolute; top:-13px; left:24px; background:var(--green-dk); color:#fff; font-size:.72rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; padding:4px 12px; border-radius:999px}
#nvx .nvx-plan__name{font-weight:800; font-size:1.15rem}
#nvx .nvx-plan__for{color:var(--gray); font-size:.88rem; margin-top:2px; min-height:2.6em}
#nvx .nvx-plan__price{font-size:1.9rem; font-weight:800; margin-top:14px; letter-spacing:-.01em}
#nvx .nvx-plan__price span{font-size:.9rem; font-weight:700; color:var(--gray)}
#nvx .nvx-plan__note{font-size:.82rem; color:var(--gray); margin-top:2px}
#nvx .nvx-plan ul{list-style:none; margin:16px 0 0; padding:0; display:grid; gap:9px; font-size:.92rem}
#nvx .nvx-plan ul li{padding-left:26px; position:relative}
#nvx .nvx-plan ul li::before{content:""; position:absolute; left:0; top:.32em; width:16px; height:16px; border-radius:999px; background:var(--green-lt) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z" fill="%234d9659"/></svg>') center/10px no-repeat}
#nvx .nvx-plan__cta{margin-top:auto; padding-top:20px}
#nvx .nvx-plan__cta .nvx-btn{width:100%; justify-content:center}
#nvx .nvx-setup{background:var(--card); border:1px solid var(--border); border-radius:var(--r-card); padding:28px; margin-top:16px; display:grid; gap:18px; align-items:center}
@media(min-width:960px){#nvx .nvx-setup{grid-template-columns:1.4fr .8fr auto}}
#nvx .nvx-setup__price{font-size:1.7rem; font-weight:800; white-space:nowrap}
#nvx .nvx-setup__price span{display:block; font-size:.82rem; font-weight:700; color:var(--gray)}

/* тёмная плашка */
#nvx .nvx-plate{text-align:center; font-size:clamp(1.3rem,2.6vw,1.9rem); font-weight:800; line-height:1.25; max-width:46rem; margin:0 auto; color:var(--ink-on-dark)}
#nvx .nvx-plate em{color:var(--mint)}
#nvx .nvx-plate-sub{text-align:center; color:var(--ink-on-dark); max-width:44rem; margin:14px auto 0; font-size:1rem}

/* скриншот-доказательство */
#nvx figure.nvx-shot{margin:1.8rem auto 0; max-width:960px; background:var(--card); border:1px solid var(--border); border-radius:var(--r-card); overflow:hidden; box-shadow:0 22px 54px -34px rgba(17,31,26,.4)}
#nvx figure.nvx-shot img{display:block; width:100%; height:auto}
#nvx figure.nvx-shot figcaption{padding:16px 22px; font-size:.92rem; line-height:1.55; color:var(--gray); border-top:1px solid var(--border)}
#nvx figure.nvx-shot figcaption b{color:var(--ink); font-weight:800}

/* FAQ */
#nvx .nvx-faq{max-width:900px; margin:1.6rem auto 0; display:grid; gap:10px}
#nvx .nvx-faq details{background:var(--card); border:1px solid var(--border); border-radius:var(--r-sm); padding:0}
#nvx .nvx-faq summary{cursor:pointer; font-weight:700; padding:16px 20px; list-style:none; position:relative; padding-right:44px}
#nvx .nvx-faq summary::-webkit-details-marker{display:none}
#nvx .nvx-faq summary::after{content:"+"; position:absolute; right:18px; top:50%; transform:translateY(-50%); font-size:1.3rem; font-weight:700; color:var(--green-dk)}
#nvx .nvx-faq details[open] summary::after{content:"-"}
#nvx .nvx-faq details p{padding:0 20px 16px; margin:0; color:var(--gray)}

/* сравнение Нова / Роботелс */
#nvx .nvx-two{display:grid; gap:16px; margin-top:1.8rem}
@media(min-width:820px){#nvx .nvx-two{grid-template-columns:1fr 1fr}}

/* проявление (JS добавляет .nvx-js на #nvx; без JS всё видно) */
#nvx.nvx-js .nvx-rv{opacity:0; transform:translateY(14px); transition:opacity .5s ease, transform .5s ease}
#nvx.nvx-js .nvx-rv.nvx-on{opacity:1; transform:none}
@media(prefers-reduced-motion:reduce){#nvx.nvx-js .nvx-rv{opacity:1 !important; transform:none !important; transition:none !important}}

/* мобильные */
@media(max-width:959px){#nvx .nvx-plan--hit{order:-1}}
@media(max-width:900px){
  #nvx{--rhythm:56px; --pad:20px}
  #nvx .nvx-msg{max-width:94%}
  #nvx .nvx-setup{grid-template-columns:1fr}
}

/* тап-мишени вторичных ссылок >= 44px (финал-совет UX) */
#nvx .nvx-two a, #nvx .nvx-plate-sub a, #nvx .nvx-call__foot a, #nvx .nvx-lead a{display:inline-block; padding:.55em 0}
@media(max-width:640px){
  #nvx .nvx-call__foot{display:block}
  #nvx figure.nvx-shot{margin-left:-20px; margin-right:-20px; border-radius:0}
}

/* кнопки-попапы (button) наследуют вид ссылок-кнопок */
#nvx button.nvx-btn{appearance:none; -webkit-appearance:none; font-size:1rem; line-height:1.2}
