/* WVZ Site Audit — посадочная страница проверки сайта.
   Всё под .wsa-lp: тема сайта не задета, отчёт (wsa.css) не задет.
   Правило: страница обязана проходить собственный аудит —
   без горизонтального вылета, кнопки от 44px, контраст AA. */

.wsa-lp{
  --wsa-bg:#08090f;
  --wsa-bg2:#0c0e17;
  --wsa-card:rgba(255,255,255,.035);
  --wsa-card2:rgba(255,255,255,.055);
  --wsa-line:rgba(255,255,255,.09);
  --wsa-fg:#f2f5fa;
  --wsa-mut:#9aa4b8;
  --wsa-a1:#7c5cff;
  --wsa-a2:#38bdf8;
  --wsa-ok:#34d399;
  --wsa-warn:#fbbf24;
  --wsa-bad:#f87171;
  --wsa-r:16px;
  position:relative;
  box-sizing:border-box;
  max-width:1180px;
  margin:0 auto;
  padding:0 20px;
  color:var(--wsa-fg);
  font-size:17px;
  line-height:1.6;
  overflow-x:clip;
}
.wsa-lp *,.wsa-lp *:before,.wsa-lp *:after{box-sizing:border-box}
.wsa-lp p{color:var(--wsa-mut);margin:0 0 14px}
.wsa-lp b,.wsa-lp strong{color:var(--wsa-fg);font-weight:700}
.wsa-lp a{color:var(--wsa-a2);text-decoration:none}
.wsa-lp a:hover{text-decoration:underline}

/* Светлая тема — те же блоки, другие токены */
.wsa-lp.wsa-lp--light{
  --wsa-bg:#f7f9fc;--wsa-bg2:#fff;
  --wsa-card:#fff;--wsa-card2:#fff;
  --wsa-line:#e4e8f0;
  --wsa-fg:#0f172a;--wsa-mut:#51607a;
}

/* Во всю ширину экрана. Включается атрибутом bleed="1":
   даёт +-полосу прокрутки на темах без overflow-x:clip, поэтому не по умолчанию. */
.wsa-lp--bleed{max-width:none;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:0 max(20px,calc(50vw - 590px))}

/* Свечение за первым экраном */
.wsa-lp__glow{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden;border-radius:var(--wsa-r)}
.wsa-lp__glow i{position:absolute;display:block;border-radius:50%;filter:blur(90px);opacity:.5}
.wsa-lp__glow i:nth-child(1){width:520px;height:520px;top:-180px;left:-120px;background:rgba(124,92,255,.30)}
.wsa-lp__glow i:nth-child(2){width:460px;height:460px;top:-60px;right:-140px;background:rgba(56,189,248,.20)}
.wsa-lp.wsa-lp--light .wsa-lp__glow i{opacity:.22}
.wsa-lp>section{position:relative;z-index:1}

/* Типографика */
.wsa-lp .wsa-eyebrow{
  display:inline-flex;align-items:center;gap:9px;margin:0 0 18px;
  font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--wsa-a2)
}
.wsa-lp .wsa-eyebrow:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--wsa-a2);flex:0 0 auto}
.wsa-lp .wsa-t1{
  font-size:clamp(30px,4.6vw,54px);line-height:1.08;font-weight:800;letter-spacing:-.02em;
  margin:0 0 20px;color:var(--wsa-fg);overflow-wrap:break-word
}
.wsa-lp .wsa-t2{
  font-size:clamp(24px,3.1vw,36px);line-height:1.18;font-weight:800;letter-spacing:-.015em;
  margin:0 0 14px;color:var(--wsa-fg)
}
.wsa-lp .wsa-t3{font-size:19px;line-height:1.3;font-weight:700;margin:0 0 8px;color:var(--wsa-fg)}
.wsa-lp .wsa-grad{background:linear-gradient(96deg,var(--wsa-a1),var(--wsa-a2));-webkit-background-clip:text;background-clip:text;color:transparent}
.wsa-lp .wsa-lead{font-size:clamp(16px,1.5vw,19px);max-width:60ch}
.wsa-lp .wsa-sec-i{max-width:64ch;margin-bottom:32px}

.wsa-lp section{padding:56px 0}
.wsa-lp section:first-of-type{padding-top:44px}

/* ── Первый экран ─────────────────────────────────────── */
.wsa-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px;align-items:start}
.wsa-hero__side{min-width:0}

.wsa-chips{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0;list-style:none}
.wsa-chips li{
  display:flex;align-items:center;gap:7px;padding:8px 14px;font-size:14px;color:var(--wsa-mut);
  background:var(--wsa-card);border:1px solid var(--wsa-line);border-radius:999px
}
.wsa-chips li:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--wsa-ok);flex:0 0 auto}

/* Карточка с формой */
.wsa-panel{
  background:linear-gradient(180deg,var(--wsa-card2),var(--wsa-card));
  border:1px solid var(--wsa-line);border-radius:20px;padding:26px;
  box-shadow:0 24px 60px rgba(0,0,0,.35)
}
.wsa-lp--light .wsa-panel{box-shadow:0 18px 44px rgba(15,23,42,.08)}
.wsa-panel__t{font-size:20px;font-weight:700;margin:0 0 6px}
.wsa-panel__s{font-size:14px;color:var(--wsa-mut);margin:0 0 18px}
.wsa-panel__f{margin-top:16px;font-size:13px;color:var(--wsa-mut);line-height:1.5}

/* Форма внутри лендинга: перекрываем светлые стили wsa.css.
   :not(.wsa-hp) обязателен. Honeypot — тоже input[type=text], и без исключения
   он получал размеры настоящего поля: браузер начинал считать его видимым,
   заполнял автозаполнением, сервер отбивал заявку как спам (регресс 1.14.0). */
.wsa-lp .wsa-form{max-width:none;margin:0}
.wsa-lp .wsa-row{flex-direction:column;gap:10px}
.wsa-lp .wsa-form input[type=text]:not(.wsa-hp),
.wsa-lp .wsa-form input[type=email]:not(.wsa-hp){
  width:100%;flex:1 1 auto;min-height:52px;padding:14px 16px;font-size:16px;
  background:rgba(255,255,255,.05);border:1px solid var(--wsa-line);border-radius:12px;
  color:var(--wsa-fg);transition:border-color .15s,background .15s
}
.wsa-lp--light .wsa-form input[type=text]:not(.wsa-hp),
.wsa-lp--light .wsa-form input[type=email]:not(.wsa-hp){background:#fff}

/* Honeypot остаётся нулевым при любых стилях темы и лендинга.
   Ловушка работает, только пока браузер её не видит. */
.wsa-lp .wsa-hp,
.wsa-lp .wsa-form .wsa-hp{
  position:absolute!important;left:-9999px!important;top:auto!important;
  width:0!important;height:0!important;min-height:0!important;max-height:0!important;
  padding:0!important;margin:0!important;border:0!important;opacity:0!important;
  pointer-events:none!important;z-index:-1!important
}

/* Автозаполнение: браузер силой красит поле в белый и ломает тёмную форму.
   Перебивается только внутренней тенью — свойство background он игнорирует. */
.wsa-lp .wsa-form input:-webkit-autofill,
.wsa-lp .wsa-form input:-webkit-autofill:hover,
.wsa-lp .wsa-form input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--wsa-fg);
  -webkit-box-shadow:0 0 0 1000px #13151f inset;
  box-shadow:0 0 0 1000px #13151f inset;
  caret-color:var(--wsa-fg);
  border:1px solid var(--wsa-line);
  transition:background-color 600000s 0s
}
.wsa-lp--light .wsa-form input:-webkit-autofill,
.wsa-lp--light .wsa-form input:-webkit-autofill:hover,
.wsa-lp--light .wsa-form input:-webkit-autofill:focus{
  -webkit-text-fill-color:#0f172a;
  -webkit-box-shadow:0 0 0 1000px #fff inset;
  box-shadow:0 0 0 1000px #fff inset
}
.wsa-lp .wsa-form input::placeholder{color:#7c88a0;opacity:1}
.wsa-lp .wsa-form input:focus{outline:none;border-color:var(--wsa-a2);background:rgba(56,189,248,.07)}
.wsa-lp .wsa-consent{
  display:flex;gap:10px;align-items:flex-start;margin:14px 0;
  font-size:14px;line-height:1.45;color:var(--wsa-mut);cursor:pointer
}
.wsa-lp .wsa-consent input{width:18px;height:18px;margin:2px 0 0;flex:0 0 auto;accent-color:var(--wsa-a1)}
.wsa-lp .wsa-btn{
  display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:56px;
  padding:16px 26px;font-size:17px;font-weight:700;border:0;border-radius:12px;cursor:pointer;
  color:#fff!important;background:linear-gradient(96deg,var(--wsa-a1),var(--wsa-a2));
  box-shadow:0 10px 30px rgba(124,92,255,.32);transition:transform .12s,box-shadow .12s
}
.wsa-lp .wsa-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 14px 36px rgba(124,92,255,.42)}
.wsa-lp .wsa-btn:disabled{opacity:.65;cursor:wait;box-shadow:none;transform:none}
.wsa-lp .wsa-msg{margin-top:12px;font-size:15px;color:var(--wsa-mut);min-height:0}
.wsa-lp .wsa-msg.err{color:var(--wsa-bad)}
.wsa-lp .wsa-cf{margin:14px 0 0;min-height:0}
.wsa-lp .wsa-staff{
  margin-top:12px;font-size:13px;color:var(--wsa-a2);background:rgba(56,189,248,.10);
  border:1px solid rgba(56,189,248,.22);border-radius:10px;padding:8px 12px;display:block
}

/* ── Макет отчёта (та самая «красивая картинка») ───────── */
.wsa-mock{
  margin-top:16px;
  background:linear-gradient(180deg,var(--wsa-card2),var(--wsa-card));
  border:1px solid var(--wsa-line);border-radius:20px;padding:22px;
  box-shadow:0 24px 60px rgba(0,0,0,.35)
}
.wsa-lp--light .wsa-mock{box-shadow:0 18px 44px rgba(15,23,42,.08)}
.wsa-mock__bar{display:flex;align-items:center;gap:7px;margin-bottom:18px}
.wsa-mock__bar i{width:10px;height:10px;border-radius:50%;background:var(--wsa-line);display:block}
.wsa-mock__bar span{margin-left:8px;font-size:12px;color:var(--wsa-mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wsa-mock__top{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.wsa-dial{width:104px;height:104px;flex:0 0 auto;position:relative}
.wsa-dial svg{width:100%;height:100%;transform:rotate(-90deg)}
.wsa-dial__v{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:28px;font-weight:800;color:var(--wsa-fg)
}
.wsa-dial__v small{font-size:13px;font-weight:600;color:var(--wsa-mut);margin-left:1px}
.wsa-mock__sum{min-width:0;flex:1 1 150px}
.wsa-mock__sum b{display:block;font-size:15px;margin-bottom:4px}
.wsa-mock__sum span{font-size:13px;color:var(--wsa-mut)}
.wsa-mock__list{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:8px}
.wsa-mock__list li{
  display:flex;align-items:flex-start;gap:10px;padding:11px 13px;font-size:14px;line-height:1.4;
  background:rgba(255,255,255,.04);border:1px solid var(--wsa-line);border-radius:11px;color:var(--wsa-fg)
}
.wsa-lp--light .wsa-mock__list li{background:#f8fafc}
.wsa-mock__list li:before{content:"";width:8px;height:8px;border-radius:50%;margin-top:6px;flex:0 0 auto;background:var(--wsa-mut)}
.wsa-mock__list li.c:before{background:var(--wsa-bad)}
.wsa-mock__list li.m:before{background:var(--wsa-warn)}
.wsa-mock__list li.g:before{background:var(--wsa-ok)}
.wsa-mock__list li em{font-style:normal;color:var(--wsa-mut);display:block;font-size:13px;margin-top:2px}
.wsa-mock__cap{margin:14px 0 0;font-size:12px;color:var(--wsa-mut);text-align:center}

/* ── Сетки и карточки ─────────────────────────────────── */
.wsa-grid{display:grid;gap:16px;margin:0;padding:0;list-style:none}
.wsa-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.wsa-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.wsa-c{
  min-width:0;background:var(--wsa-card);border:1px solid var(--wsa-line);
  border-radius:var(--wsa-r);padding:24px 22px;transition:border-color .15s,transform .15s
}
.wsa-c:hover{border-color:rgba(124,92,255,.4);transform:translateY(-2px)}
.wsa-c__n{
  display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:28px;padding:0 10px;
  margin-bottom:14px;font-size:13px;font-weight:700;color:var(--wsa-a2);
  background:rgba(56,189,248,.12);border:1px solid rgba(56,189,248,.24);border-radius:999px
}
.wsa-c p{margin:0;font-size:15px}
.wsa-c ul{margin:10px 0 0;padding:0 0 0 18px;font-size:14.5px;color:var(--wsa-mut);line-height:1.65}
.wsa-c li{margin:3px 0}

/* Шаги */
.wsa-steps-l{counter-reset:s;display:grid;gap:16px;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0;list-style:none}
.wsa-steps-l li{
  min-width:0;position:relative;padding:24px 22px;background:var(--wsa-card);
  border:1px solid var(--wsa-line);border-radius:var(--wsa-r)
}
.wsa-steps-l li:before{
  counter-increment:s;content:counter(s);
  display:flex;align-items:center;justify-content:center;width:38px;height:38px;margin-bottom:14px;
  font-size:16px;font-weight:800;color:#fff;border-radius:12px;
  background:linear-gradient(140deg,var(--wsa-a1),var(--wsa-a2))
}

/* Что в отчёте */
.wsa-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px;align-items:center}
.wsa-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.wsa-list li{position:relative;padding-left:32px;font-size:16px;color:var(--wsa-mut);line-height:1.5}
.wsa-list li b{display:block;color:var(--wsa-fg);font-weight:600;margin-bottom:1px}
.wsa-list li:before{
  content:"";position:absolute;left:0;top:3px;width:20px;height:20px;border-radius:50%;
  background:rgba(52,211,153,.14);border:1px solid rgba(52,211,153,.4)
}
.wsa-list li:after{
  content:"";position:absolute;left:6.5px;top:9px;width:7px;height:4px;
  border-left:2px solid var(--wsa-ok);border-bottom:2px solid var(--wsa-ok);transform:rotate(-45deg)
}

/* FAQ */
.wsa-faq{display:grid;gap:12px;max-width:860px}
.wsa-faq details{background:var(--wsa-card);border:1px solid var(--wsa-line);border-radius:14px;overflow:hidden}
.wsa-faq summary{
  list-style:none;cursor:pointer;padding:18px 52px 18px 22px;position:relative;
  font-size:17px;font-weight:600;color:var(--wsa-fg);min-height:56px;display:flex;align-items:center
}
.wsa-faq summary::-webkit-details-marker{display:none}
.wsa-faq summary:after{
  content:"";position:absolute;right:24px;top:50%;width:9px;height:9px;
  border-right:2px solid var(--wsa-a2);border-bottom:2px solid var(--wsa-a2);
  transform:translateY(-70%) rotate(45deg);transition:transform .18s
}
.wsa-faq details[open] summary:after{transform:translateY(-30%) rotate(-135deg)}
.wsa-faq details[open] summary{border-bottom:1px solid var(--wsa-line)}
.wsa-faq .wsa-faq__a{padding:16px 22px 20px}
.wsa-faq .wsa-faq__a p:last-child{margin-bottom:0}

/* Финальный призыв */
.wsa-final{
  position:relative;overflow:hidden;text-align:center;padding:48px 28px;border-radius:22px;
  background:linear-gradient(150deg,rgba(124,92,255,.16),rgba(56,189,248,.10));
  border:1px solid var(--wsa-line)
}
.wsa-final .wsa-t2{margin-bottom:12px}
.wsa-final p{margin:0 auto 24px;max-width:56ch}
.wsa-final__btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:16px 34px;
  font-size:17px;font-weight:700;border-radius:12px;color:#fff!important;text-decoration:none!important;
  background:linear-gradient(96deg,var(--wsa-a1),var(--wsa-a2));box-shadow:0 10px 30px rgba(124,92,255,.32)
}
.wsa-final__btn:hover{transform:translateY(-1px)}
.wsa-final__alt{margin:16px 0 0;font-size:15px}

/* Проза для поиска */
.wsa-prose{max-width:78ch}
.wsa-prose p{font-size:16.5px}

/* ── Адаптив ──────────────────────────────────────────── */
@media(max-width:1000px){
  .wsa-hero{grid-template-columns:minmax(0,1fr);gap:36px}
  .wsa-grid--4,.wsa-steps-l{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wsa-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wsa-two{grid-template-columns:minmax(0,1fr);gap:28px}
}
@media(max-width:640px){
  .wsa-lp{font-size:16px;padding:0 16px}
  .wsa-lp section{padding:40px 0}
  .wsa-grid--3,.wsa-grid--4,.wsa-steps-l{grid-template-columns:minmax(0,1fr)}
  .wsa-panel,.wsa-mock{padding:20px}
  .wsa-final{padding:36px 20px}
  .wsa-faq summary{font-size:16px;padding:16px 46px 16px 18px}
  .wsa-faq .wsa-faq__a{padding:14px 18px 18px}
}
@media(prefers-reduced-motion:reduce){
  .wsa-lp *{transition:none!important;animation:none!important}
}