/* ═══════════════════════════════════════════════════
   Страницы услуг — дополняет style.css
   ═══════════════════════════════════════════════════ */

.page{background:var(--bg)}
.page .nav{background:rgba(6,6,8,.72);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);border-bottom-color:var(--line)}
.page .nav__links a i{font-style:normal}

/* ─── герой страницы ─── */
.phero{
  position:relative;overflow:hidden;isolation:isolate;
  padding:clamp(112px,17vh,172px) 0 clamp(52px,8vh,92px);
  border-bottom:1px solid var(--line);
}
.phero__bg{
  position:absolute;inset:-10%;z-index:-2;pointer-events:none;
  background:
    radial-gradient(58% 78% at 10% 0%,rgba(110,123,255,.38),transparent 62%),
    radial-gradient(48% 66% at 88% 14%,rgba(217,255,53,.20),transparent 64%),
    radial-gradient(72% 90% at 46% 108%,rgba(255,84,122,.12),transparent 66%);
  animation:pheroDrift 20s ease-in-out infinite alternate;
}
@keyframes pheroDrift{to{transform:scale(1.16) translate3d(-2%,-3%,0)}}
.phero__grid{
  position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.5;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:clamp(54px,6vw,92px) clamp(54px,6vw,92px);
  mask-image:radial-gradient(86% 78% at 30% 28%,#000 8%,transparent 76%);
  -webkit-mask-image:radial-gradient(86% 78% at 30% 28%,#000 8%,transparent 76%);
}
.phero__in{position:relative;z-index:1}

.crumbs{display:flex;align-items:center;gap:9px;font-family:var(--mono);font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;margin-bottom:clamp(18px,3vh,32px)}
.crumbs a{color:var(--mut);transition:color .3s}
.crumbs a:hover{color:var(--acc)}
.crumbs span{color:var(--mut-2)}
.crumbs b{color:var(--txt);font-weight:400}

.phero__num{display:block;color:var(--acc);margin-bottom:14px}
.phero__title{
  font-family:var(--dsp);font-weight:800;letter-spacing:-.045em;line-height:.98;
  font-size:clamp(32px,6.2vw,86px);max-width:20ch;
}
.phero__title em{font-style:normal;color:var(--acc)}
@media (min-width:901px){.phero__title em{white-space:nowrap}}
.phero__lead{
  margin-top:clamp(18px,2.6vh,28px);max-width:680px;
  color:#c3c7d0;font-size:clamp(15px,1.35vw,18.5px);line-height:1.62;
}
.phero__chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:clamp(20px,3vh,32px)}
.phero__chips li{
  font-family:var(--mono);font-size:11px;letter-spacing:.04em;color:var(--mut);
  padding:7px 13px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.03);
  transition:.35s var(--ease);
}
.phero__chips li:hover{color:var(--acc);border-color:rgba(217,255,53,.4);transform:translateY(-2px)}
.phero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(26px,4vh,40px)}

/* ─── секции ─── */
.psec{padding:clamp(64px,9vh,118px) 0}
.psec--alt{background:var(--bg-2);border-block:1px solid var(--line)}
.psec .sec-num{color:var(--acc)}
.psec .sec-title{font-size:clamp(28px,4.4vw,58px)}

/* ─── карточки «что входит» ─── */
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;perspective:1200px}
@media (max-width:980px){.pgrid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.pgrid{grid-template-columns:1fr}}
.pcard{
  position:relative;isolation:isolate;overflow:hidden;
  padding:clamp(22px,2.3vw,32px);border:1px solid var(--line);border-radius:var(--r);
  background:var(--surf);transition:transform .5s var(--ease),border-color .45s,background-color .45s;
}
.pcard::after{
  content:'';position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .45s;
  background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),rgba(217,255,53,.12),transparent 62%);
}
.pcard:hover{border-color:var(--line-2);background:var(--surf-2)}
.pcard:hover::after{opacity:1}
.pcard__n{display:block;color:var(--mut-2);margin-bottom:14px}
.pcard h3{font-family:var(--dsp);font-weight:600;font-size:clamp(17px,1.6vw,22px);letter-spacing:-.03em;line-height:1.16;margin-bottom:10px}
.pcard p{color:var(--mut);font-size:14.5px;line-height:1.6}

/* ─── шаги ─── */
.psteps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:900px){.psteps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.psteps{grid-template-columns:1fr}}
.pstep{position:relative;padding:clamp(20px,2.2vw,28px) 0 0;border-top:2px solid var(--line);transition:border-color .5s}
.pstep:hover{border-top-color:var(--acc)}
.pstep__n{display:block;color:var(--acc);margin-bottom:12px}
.pstep h3{font-family:var(--dsp);font-weight:600;font-size:clamp(17px,1.5vw,21px);letter-spacing:-.03em;margin-bottom:9px}
.pstep p{color:var(--mut);font-size:14px;line-height:1.55}

/* ─── стек ─── */
.pstack{display:flex;flex-wrap:wrap;gap:8px}

/* ─── FAQ ─── */
.pfaq{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,72px);align-items:start}
@media (max-width:900px){.pfaq{grid-template-columns:1fr}}
.pfaq__left{position:sticky;top:110px}
@media (max-width:900px){.pfaq__left{position:static}}
.pfaq__left p{color:var(--mut);margin-bottom:22px;max-width:360px}

/* ─── призыв ─── */
.pcta{
  position:relative;overflow:hidden;text-align:center;
  padding:clamp(70px,11vh,130px) 0;border-block:1px solid var(--line);
  background:
    radial-gradient(62% 130% at 18% 50%,rgba(110,123,255,.20),transparent 62%),
    radial-gradient(58% 120% at 84% 50%,rgba(217,255,53,.14),transparent 64%),
    var(--bg-2);
}
.pcta__in{display:flex;flex-direction:column;align-items:center}
.pcta h2{
  font-family:var(--dsp);font-weight:700;letter-spacing:-.045em;line-height:1.02;
  font-size:clamp(30px,5.4vw,68px);
}
.pcta h2 em{font-style:normal;color:var(--acc)}
.pcta p{color:var(--mut);max-width:560px;margin:clamp(16px,2.4vh,26px) auto clamp(24px,3.4vh,36px);font-size:clamp(14.5px,1.3vw,17px)}
.pcta__note{display:flex;align-items:center;gap:9px;color:rgba(255,255,255,.62);margin-top:26px}

/* ─── другие направления ─── */
.plinks{display:grid;gap:1px;background:var(--line);border-block:1px solid var(--line)}
.plink{
  position:relative;display:grid;grid-template-columns:52px 1fr 40px;align-items:center;gap:16px;
  background:var(--bg);padding:clamp(17px,2vw,24px) 0;overflow:hidden;
  transition:padding .5s var(--ease);
}
.plink::before{
  content:'';position:absolute;inset:0;z-index:0;
  background:linear-gradient(90deg,rgba(217,255,53,.09),transparent 62%);
  transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease);
}
.plink:hover{padding-left:18px;padding-right:18px}
.plink:hover::before{transform:scaleX(1)}
.plink > *{position:relative;z-index:1}
.plink__n{color:var(--mut-2);transition:color .35s}
.plink:hover .plink__n{color:var(--acc)}
.plink__t{font-family:var(--dsp);font-weight:600;font-size:clamp(16px,1.7vw,24px);letter-spacing:-.03em}
.plink__go{
  width:40px;height:40px;border-radius:50%;border:1px solid var(--line);
  display:grid;place-items:center;color:var(--mut);transition:.5s var(--ease);
}
.plink:hover .plink__go{background:var(--acc);border-color:var(--acc);color:#07080a;transform:rotate(-45deg)}

@media (prefers-reduced-motion:reduce){
  .phero__bg{animation:none}
}

/* ═══════════════════════════════════════════════════
   КОНВЕРСИОННЫЕ БЛОКИ СТРАНИЦ УСЛУГ
   ═══════════════════════════════════════════════════ */
/* «Узнаёте себя?» — боль клиента и что меняется */
.pains{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media (max-width:760px){.pains{grid-template-columns:1fr}}
.pain{
  display:grid;gap:16px;padding:clamp(22px,2.4vw,30px);border:1px solid var(--line);border-radius:var(--r);
  background:var(--surf);transition:border-color .45s,transform .5s var(--ease);
}
.pain:hover{border-color:rgba(217,255,53,.3);transform:translateY(-3px)}
.pain__p{position:relative;padding-left:36px;color:var(--mut);font-size:15px;line-height:1.55}
.pain__p::before{
  content:'✕';position:absolute;left:0;top:0;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;
  font-size:10.5px;color:#ff8fa3;background:rgba(255,93,122,.12);border:1px solid rgba(255,93,122,.35);
}
.pain__s{position:relative;padding:15px 0 0 36px;border-top:1px dashed var(--line-2);color:var(--txt);font-weight:500;font-size:15.5px;line-height:1.45}
.pain__s::before{
  content:'→';position:absolute;left:0;top:15px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;
  font-size:12px;font-weight:700;color:#07080a;background:var(--acc);
}

/* кейс-доказательство */
.proof{
  position:relative;overflow:hidden;display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(24px,4vw,64px);align-items:center;
  padding:clamp(28px,4vw,58px);border-radius:calc(var(--r) * 1.4);border:1px solid rgba(217,255,53,.28);
  background:
    radial-gradient(80% 120% at 0% 0%,rgba(217,255,53,.14),transparent 60%),
    radial-gradient(70% 100% at 100% 100%,rgba(110,123,255,.2),transparent 62%),
    var(--surf);
}
@media (max-width:860px){.proof{grid-template-columns:1fr}}
.proof__num{display:flex;flex-direction:column;gap:12px}
.proof__v{font-family:var(--dsp);font-weight:800;font-size:clamp(58px,9vw,132px);line-height:.9;letter-spacing:-.06em;color:var(--acc);text-shadow:0 0 70px rgba(217,255,53,.25)}
.proof__v--txt{font-size:clamp(26px,3.3vw,44px);line-height:1.08;letter-spacing:-.04em}
.proof__l{font-size:clamp(14px,1.3vw,17px);color:#c3c7d0;max-width:26ch;line-height:1.4}
.proof__body .sec-num{color:var(--acc)}
.proof__body h2{font-family:var(--dsp);font-weight:600;font-size:clamp(22px,2.6vw,36px);letter-spacing:-.035em;line-height:1.1;margin:10px 0 12px}
.proof__body p{color:var(--mut);font-size:clamp(14.5px,1.2vw,16.5px);line-height:1.6;max-width:52ch}
.proof__cta{display:flex;align-items:center;flex-wrap:wrap;gap:14px 22px;margin-top:22px}
.proof__more{
  display:inline-flex;align-items:center;gap:9px;color:var(--acc);font-size:14.5px;font-weight:500;
  border-bottom:1px solid rgba(217,255,53,.3);padding-bottom:3px;transition:gap .35s var(--ease),border-color .35s;
}
.proof__more:hover{gap:15px;border-color:var(--acc)}
.proof__more i{font-style:normal}
.proof__tg{
  display:inline-flex;align-items:center;gap:8px;padding:9px 17px;border-radius:99px;border:1px solid var(--line-2);
  font-size:13.5px;font-weight:500;color:var(--txt);transition:background-color .35s,border-color .35s,color .35s,transform .45s var(--ease);
}
.proof__tg:hover{background:var(--acc);border-color:var(--acc);color:#07080a;transform:translateY(-2px)}

/* стек под шагами */
.psteps + .pstack{margin-top:clamp(30px,4vw,48px)}

/* текст под поисковые запросы — оформлен как короткая статья */
.pseo__in{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,72px);align-items:start}
@media (max-width:900px){.pseo__in{grid-template-columns:1fr}}
.pseo__h{font-family:var(--dsp);font-weight:600;font-size:clamp(24px,2.8vw,40px);letter-spacing:-.04em;line-height:1.08;position:sticky;top:110px}
@media (max-width:900px){.pseo__h{position:static}}
.pseo__txt{display:grid;gap:16px;padding-left:clamp(0px,2vw,28px);border-left:1px solid var(--line)}
@media (max-width:900px){.pseo__txt{padding-left:0;border-left:0}}
.pseo__txt p{color:var(--mut);font-size:clamp(14.5px,1.15vw,16.5px);line-height:1.75;max-width:68ch}
.pseo__txt p:first-child{color:#c3c7d0}

/* финальный призыв: доводы доверия по центру */
.pcta .trust{justify-content:center;margin-top:26px}
.pcta .quick{max-width:760px}

/* все услуги */
.plinks__all{
  display:inline-flex;align-items:center;gap:9px;margin-top:24px;color:var(--acc);font-weight:500;
  border-bottom:1px solid rgba(217,255,53,.3);padding-bottom:3px;transition:gap .35s var(--ease),border-color .35s;
}
.plinks__all:hover{gap:15px;border-color:var(--acc)}
.plinks__all i{font-style:normal}

/* каталог /uslugi */
.hubgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.hubcard{
  position:relative;display:flex;flex-direction:column;gap:12px;padding:clamp(22px,2.3vw,30px);
  border:1px solid var(--line);border-radius:var(--r);background:var(--surf);
  transition:transform .5s var(--ease),border-color .4s,background-color .4s;
}
.hubcard:hover{transform:translateY(-4px);border-color:rgba(217,255,53,.35);background:var(--surf-2)}
.hubcard__n{color:var(--acc)}
.hubcard h3{font-family:var(--dsp);font-weight:600;font-size:clamp(18px,1.7vw,23px);letter-spacing:-.03em;line-height:1.15}
.hubcard p{color:var(--mut);font-size:14px;line-height:1.55;flex:1}
.hubcard__go{display:inline-flex;gap:8px;color:var(--acc);font-size:14px;font-weight:500;transition:gap .35s var(--ease)}
.hubcard:hover .hubcard__go{gap:14px}
.hubcard__go i{font-style:normal}
