:root{
  --ink:#0D1B16;
  --ink-2:#4B5B54;
  --ink-3:#62726B;
  --green:#0BA069;
  --green-dark:#087A52;
  --mint:#EAF6F2;
  --paper:#FBFBF9;
  --panel:#F4F6F4;
  --line:#E3E8E5;
  --purple:#2A1E54;
  --font-display:'Onest', system-ui, sans-serif;
  --font-text:'Golos Text', system-ui, sans-serif;
  --container:1240px;
  --pad:32px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-text);
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--green);text-decoration:none}
a:hover{color:var(--green-dark)}
h1,h2,h3{font-family:var(--font-display);margin:0;letter-spacing:-0.025em;line-height:1.08}
p{margin:0;text-wrap:pretty}
ul{margin:0;padding:0;list-style:none}

.lp-container{max-width:var(--container);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.lp-section{padding-top:104px}
.lp-eyebrow{font-family:var(--font-display);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--green)}

/* Кнопки */
.lp-btn{display:inline-block;font-size:17px;font-weight:600;padding:15px 32px;border-radius:6px;transition:background .18s ease,color .18s ease}
.lp-btn--primary{background:var(--green);color:#fff}
.lp-btn--primary:hover{background:var(--green-dark);color:#fff}
.lp-btn--ink{background:var(--ink);color:var(--paper)}
.lp-btn--ink:hover{background:var(--green);color:#fff}
.lp-btn--light{background:var(--paper);color:var(--purple);font-size:15px;padding:13px 26px}
.lp-btn--light:hover{background:#fff;color:var(--purple)}
.lp-btn--sm{font-size:15px;padding:11px 22px}
.link-underline{font-size:16px;font-weight:600;color:var(--ink);border-bottom:1px solid #C9D6D0;padding-bottom:2px}
.link-underline:hover{color:var(--green);border-bottom-color:var(--green)}

/* Шапка */
.header{position:sticky;top:0;z-index:30;background:rgba(251,251,249,.88);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.header__inner{display:flex;align-items:center;gap:40px;padding-top:16px;padding-bottom:16px}
.header__logo{height:24px;width:auto}
.nav{display:flex;gap:28px;font-size:15px;flex:1;flex-wrap:wrap}
.nav a{color:var(--ink-2)}
.nav a:hover{color:var(--green)}
.header__actions{display:flex;align-items:center;gap:20px}
.header__login{font-size:15px;font-weight:600;color:var(--ink)}

/* Первый экран */
.hero{padding-top:88px}
.hero__title{font-weight:800;font-size:clamp(30px,3.9vw,50px);line-height:1.06;letter-spacing:-.03em;margin-top:20px;max-width:39ch}
.hero__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:48px;align-items:end;margin-top:36px}
.hero__lead{font-size:18px;color:var(--ink-2);max-width:52ch}
.hero__cta{display:flex;flex-wrap:wrap;align-items:center;gap:24px;margin-top:28px}
.hero__note{font-size:14px;color:var(--ink-3);margin-top:16px}
.hero__shot{margin-top:56px}
.hero__frame{background:var(--ink);border-radius:18px;padding:28px 28px 0;overflow:hidden}
.hero__frame img{border-radius:10px 10px 0 0;width:100%}

/* Строка преимуществ */
.trust{display:flex;flex-wrap:wrap;gap:14px 36px;align-items:center;justify-content:space-between;padding-top:36px}
.trust__item{display:flex;gap:10px;align-items:center}
.trust__item svg{flex:none}
.trust__item span{font-size:15px;font-weight:500;white-space:nowrap}

/* Заголовок секции */
.lp-section-head{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:40px;align-items:start}
.lp-section-head__title{display:flex;gap:16px;align-items:baseline}
.lp-section-head__num{font-family:var(--font-display);font-size:13px;font-weight:700;color:var(--green)}
.lp-section-head h2{font-weight:800;font-size:clamp(28px,3.2vw,40px)}
.lp-section-head p{font-size:17px;color:var(--ink-2);max-width:56ch}

/* Шаблоны */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;margin-top:44px}
.lp-card{background:var(--panel);border-radius:14px;padding:30px 28px 26px;display:flex;flex-direction:column;gap:12px;transition:background .18s ease}
.lp-card:hover{background:var(--mint)}
.lp-card__icon{width:28px;height:28px}
.lp-card h3{font-weight:700;font-size:19px;letter-spacing:-.01em;margin-top:8px}
.lp-card p{font-size:15px;color:var(--ink-2);flex:1}
.lp-card__link{font-size:14px;font-weight:600;margin-top:10px}

/* Сравнение */
.compare{display:flex;flex-direction:column;gap:14px;margin-top:40px}
.compare__row{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:28px 48px;background:var(--panel);border-radius:14px;padding:28px 30px}
.compare__row p{font-size:16px;color:#5C6B64;margin-top:12px}
.compare__row .compare__new p{color:var(--ink);font-weight:500}
.compare__row p.compare__label{font-family:var(--font-display);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#626E68;margin-top:0}
.compare__row .compare__new p.compare__label--new{color:var(--green)}

/* Блок CRM */
.feature{background:var(--mint);border-radius:18px;padding:clamp(32px,4vw,56px);display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:48px;align-items:center;margin-top:96px}
.feature h2{font-weight:800;font-size:clamp(26px,3vw,36px)}
.feature p{font-size:16.5px;color:#3E534A;margin-top:18px}
.checklist{display:flex;flex-direction:column;gap:14px;margin-top:26px}
.checklist li{display:flex;gap:12px;font-size:16px;color:#14261F}
.checklist li::before{content:"✓";color:var(--green);font-weight:700;flex:none}
.shot{border-radius:12px;box-shadow:0 24px 48px -26px rgba(13,27,22,.4);width:100%}

/* Шаги */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:44px 40px;margin-top:48px}
.step{display:flex;flex-direction:column}
.step__num{font-family:var(--font-display);font-weight:800;font-size:44px;line-height:1;letter-spacing:-.04em;color:#648F7A}
.step h3{font-weight:700;font-size:20px;letter-spacing:-.015em;margin-top:14px}
.step p{font-size:15.5px;color:var(--ink-2);margin-top:10px;flex:1}
.step img{margin-top:22px;border-radius:10px;border:1px solid var(--line);width:100%}

/* Роли */
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:56px;align-items:center}
.split h2{font-weight:800;font-size:clamp(26px,3vw,38px);max-width:18ch}
.split p{font-size:16.5px;color:var(--ink-2);margin-top:18px}
.pills{display:flex;flex-direction:column;gap:8px;margin-top:24px}
.pills li{font-size:16px;color:#14261F;background:var(--panel);border-radius:10px;padding:13px 18px}

/* Тёмный блок */
.dark{background:var(--ink);margin-top:104px}
.dark__inner{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:48px;padding-top:80px;padding-bottom:80px}
.dark h2{font-weight:800;font-size:clamp(26px,3vw,38px);color:var(--paper);max-width:15ch}
.dark ul{display:flex;flex-direction:column;gap:10px}
.dark li{display:flex;gap:14px;font-size:16px;color:#C6D4CE;background:#17271F;border-radius:10px;padding:15px 20px}
.dark li::before{content:"✓";color:#3FD69A;font-weight:700;flex:none}

/* Партнёрский блок */
.partner{background:var(--purple);border-radius:18px;padding:clamp(32px,4vw,52px);display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:44px;align-items:center;margin-top:88px}
.partner .lp-eyebrow{color:#A79BE8}
.partner__logo{height:34px;width:auto;margin-top:20px}
.partner__text{font-size:17px;color:#DAD4F5;margin-top:22px;max-width:54ch}
.partner .lp-btn{margin-top:26px}
.partner__services{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:12px}
.partner__service{background:#fff;border-radius:12px;height:76px;display:flex;align-items:center;justify-content:center;padding:14px}
.partner__service img{max-height:40px;width:auto}

/* Вопросы */
.lp-faq{display:flex;flex-direction:column}
.lp-faq details{border-bottom:1px solid var(--line);padding:20px 0}
.lp-faq summary{list-style:none;cursor:pointer;display:flex;gap:24px;align-items:baseline;justify-content:space-between;font-family:var(--font-display);font-weight:700;font-size:17px;letter-spacing:-.01em;color:var(--ink)}
.lp-faq summary::-webkit-details-marker{display:none}
.lp-faq__sign{color:var(--green);font-size:20px;line-height:1;flex:none;transition:transform .2s ease}
.lp-faq details[open] .lp-faq__sign{transform:rotate(45deg)}
.lp-faq p{font-size:15.5px;color:var(--ink-2);margin-top:14px;padding-right:44px}

/* Финальный призыв */
.cta{background:var(--green-dark);border-radius:18px;padding:clamp(40px,5vw,72px);text-align:center;margin-top:96px}
.cta h2{font-weight:800;font-size:clamp(28px,3.8vw,46px);letter-spacing:-.03em;color:#fff;max-width:18ch;margin:0 auto;text-wrap:balance}
.cta p{font-size:17px;color:#fff;margin:20px auto 0;max-width:48ch}
.cta__row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:24px;margin-top:32px}
.cta .lp-btn--ink:hover{background:#fff;color:var(--ink)}
.cta .link-underline{color:#fff;border-bottom-color:rgba(255,255,255,.5)}
.cta .link-underline:hover{color:#fff;border-bottom-color:#fff}

/* Подвал */
.footer{padding-top:72px;padding-bottom:64px}
.footer__inner{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:32px;align-items:start;border-top:1px solid var(--line);padding-top:32px}
.footer__logo{height:22px;width:auto}
.footer__legal{font-size:13.5px;color:var(--ink-3);margin-top:16px;line-height:1.7}
.footer a.footer__policy{font-size:13.5px;color:var(--ink-3)}
.footer__nav{display:flex;gap:28px;font-size:14px;flex-wrap:wrap;justify-content:flex-end}
.footer__nav a{color:var(--ink-2)}

@media (max-width:760px){
  :root{--pad:20px}
  .lp-section{padding-top:72px}
  .hero{padding-top:56px}
  .hero__frame{padding:14px 14px 0;border-radius:14px}
  .trust{justify-content:flex-start;gap:12px 24px}
  .trust__item span{white-space:normal}
  .footer__nav{justify-content:flex-start}
  .lp-faq p{padding-right:0}
}
/* ── Шапка на телефоне ────────────────────────────────────────────────────
   В макете мобильной версии шапки не было: пункты меню просто переносились
   на вторую строку и наезжали на кнопки. Ниже 760px прячем меню и показываем
   бургер из прежней шапки — разметка и скрипт те же (partials/mobile-menu.php,
   site.js), меняется только точка переключения. */
.burger{display:none}
@media (max-width:760px){
  .header__inner{gap:16px}
  .header__actions{gap:12px;margin-left:auto}
  .nav{display:none}
  .burger{display:inline-flex}
  .header__login{display:none}
}