:root{
  --bg:#0b0c10; --fg:#e6edf3; --muted:#9aa4ad; --accent:#67a2ff;
  --card:#12141a; --line:#20242b;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--fg);}

/* контейнер/секции */
.container{width:100%;max-width:1160px;margin:0 auto;padding:0 16px}
.section{padding:60px 0;border-top:1px solid var(--line)}
.section--alt{background:linear-gradient(180deg,#0b0c10 0%,#0d1016 100%)}
.section__title{font-size:28px;margin:0 0 24px;letter-spacing:-.01em}

/* шапка */
.nav{position:sticky;top:0;z-index:50;background:rgba(11,12,16,.6);backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid rgba(255,255,255,.06)}
.nav__inner{display:flex;align-items:center;justify-content:space-between;min-height:56px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--fg)}
.brand__text{font-weight:800;letter-spacing:.2px}
.menu{display:flex;gap:18px}
.menu__link{color:var(--fg);text-decoration:none;opacity:.85}
.menu__link:hover{opacity:1}

.burger{display:none;position:relative;width:40px;height:40px;border:1px solid var(--line);border-radius:10px;background:#12141a}
.burger span{position:absolute;left:9px;right:9px;height:2px;background:#e6edf3;border-radius:2px;transition:.2s}
.burger span:nth-child(1){top:12px}
.burger span:nth-child(2){top:18px}
.burger span:nth-child(3){top:24px}
.menu-open .burger span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-open .burger span:nth-child(2){opacity:0}
.menu-open .burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.mobile{display:none;flex-direction:column;gap:10px;padding:12px 16px;border-top:1px solid var(--line);background:#0b0c10}
.mobile__link{color:var(--fg);text-decoration:none;opacity:.9}

/* хиро */
.hero{padding:56px 0 24px;background:
  radial-gradient(1000px 500px at 20% -10%, #1b2030, transparent),
  radial-gradient(800px 400px at 100% 0%, #122036, transparent);}
.hero__inner{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}
.hero__title{font-size:46px;line-height:1.1;margin:0 0 12px;letter-spacing:-.02em}
.hero__subtitle{opacity:.88;font-size:18px;max-width:640px;margin:0 0 16px}
.hero__cta{margin-top:18px;display:flex;gap:12px;flex-wrap:wrap}
.hero__badges{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--line);font-size:12px;opacity:.9}
.hero__art{display:flex;justify-content:center}
.hero__img{max-width:520px;width:100%;filter:drop-shadow(0 10px 40px rgba(0,0,0,.5))}

/* карточки */
.grid-3{display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;min-height:140px}
.card__title{margin:0 0 8px;font-size:18px}
.card__text{margin:0;opacity:.9}

/* шаги/цитаты/cta/футер */
.steps{list-style:none;padding:0;margin:0;display:grid;gap:14px;grid-template-columns:repeat(3,1fr)}
.steps__item{display:flex;gap:12px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px}
.steps__num{flex:0 0 28px;height:28px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid var(--line);font-weight:700}
.quote__box{margin:0;background:#121722;border:1px solid var(--line);border-radius:18px;padding:18px;font-size:18px}
.quote__who{display:block;opacity:.65;margin-top:8px;font-size:14px}
.section--cta{background:linear-gradient(180deg,#0d1016 0%,#0b0c10 100%);padding:48px 0}
.cta{display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:18px}
.cta__text h2{margin:0 0 4px}
.cta__text p{margin:0;opacity:.85}
.footer{border-top:1px solid var(--line);padding:16px 0}
.footer__inner{display:flex;justify-content:space-between;opacity:.8;font-size:14px}

/* кнопки */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 18px;border-radius:12px;background:#1a1e26;border:1px solid var(--line);color:var(--fg);text-decoration:none;transition:transform .15s ease,opacity .15s ease}
.btn:hover{transform:translateY(-1px)}
.btn--ghost{background:transparent}
.btn--primary{background:var(--accent);color:#0b0c10;border-color:transparent;font-weight:700}
.btn--lg{height:54px;padding:0 22px;font-size:18px;border-radius:14px}

/* адаптив */
@media (max-width:1024px){
  .hero__title{font-size:40px}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:720px){
  .menu{display:none}
  .burger{display:block}
  .mobile{display:flex}
  .hero__inner{grid-template-columns:1fr}
  .hero__img{max-width:420px}
  .grid-3{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .cta{flex-direction:column;align-items:flex-start}
}
/* --- доп.правки для карточек отзывов и визуала --- */
.quote__box{margin:0;background:#121722;border:1px solid var(--line);border-radius:18px;padding:18px;font-size:18px}
.quote__who{display:block;opacity:.65;margin-top:8px;font-size:14px}
/* === FIX: мобильное меню показывает только при .menu-open === */
.mobile{
  display:none;
  position:fixed;
  top:56px;         /* высота шапки */
  left:0; right:0;
  z-index:40;
  background:#0b0c10;
  border-top:1px solid var(--line);
  padding:12px 16px;
  flex-direction:column;
  gap:10px;
}
.menu-open .mobile{ display:flex; }

/* Блокируем прокрутку страницы, когда меню открыто */
.menu-open{ overflow:hidden; }

/* Бургер показываем только на мобилках, десктопное меню скрываем */
@media (max-width:720px){
  .menu{ display:none; }
  .burger{ display:block; }
  /* ВАЖНО: НЕ назначаем display:flex напрямую на .mobile здесь,
     иначе меню будет всегда открыто и JS не поможет. */
}
