/* ==========================================================================
   3B-LAB — слой V2 «SaaS»
   --------------------------------------------------------------------------
   Светлый современный слой: мягкие градиентные пятна, карточки с тонкой
   рамкой, крупные радиусы, аккуратные тени. Акцент — индиго/фиолетовый,
   нейтральные микро-индикаторы.

   Блоки:
     .aud2 — аудит сайта

   Вёрстка — под десктоп (1280+), ниже 1100px блоки складываются в колонку.
   ========================================================================== */

:root{
  --s2-bg:#f6f7fb;
  --s2-ink:#0e1628;
  --s2-muted:#5a6478;
  --s2-soft:#8b94a7;
  --s2-line:rgba(15,23,42,.1);
  --s2-line-2:rgba(15,23,42,.07);
  --s2-primary:#4c5bf5;
  --s2-primary-2:#7c5cf6;
  --s2-primary-soft:#eef0ff;
  --s2-sky:#38bdf8;
  --s2-amber:#f59e0b;
  --s2-rose:#fb7185;
  --s2-radius:22px;
  --s2-shadow:0 1px 2px rgba(15,23,42,.04),0 24px 60px -32px rgba(15,23,42,.22);
  --s2-shadow-sm:0 1px 2px rgba(15,23,42,.05),0 12px 28px -20px rgba(15,23,42,.2);
}

/* ---------- каркас ---------- */
.s2{
  position:relative;isolation:isolate;overflow:hidden;
  background:var(--s2-bg);color:var(--s2-ink);
  padding:92px 0;
}
.s2--white{background:#fff}
.s2--last{padding-bottom:100px}
.s2 .container{position:relative;z-index:1;padding-inline:56px}
.s2::before{
  content:"";position:absolute;left:-8%;right:-8%;top:-240px;height:560px;z-index:0;
  pointer-events:none;
  background:
    radial-gradient(30% 58% at 16% 40%,rgba(76,91,245,.12),transparent 72%),
    radial-gradient(26% 52% at 84% 34%,rgba(124,92,246,.1),transparent 72%);
  filter:blur(6px);
}
.s2--plain::before{display:none}

/* ---------- типографика и общие элементы ---------- */
.s2-head{display:flex;align-items:flex-end;justify-content:space-between;gap:48px;margin-bottom:38px}
.s2-head--center{flex-direction:column;align-items:center;text-align:center;gap:16px}
.s2-head--center .s2-lead{margin-inline:auto}
.s2-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 12px;border-radius:999px;
  background:#fff;border:1px solid var(--s2-line);box-shadow:var(--s2-shadow-sm);
  font:600 10.5px/1 var(--site-font);letter-spacing:.14em;text-transform:uppercase;
  color:var(--s2-muted);
}
.s2-eyebrow::before{
  content:"";width:6px;height:6px;flex:none;border-radius:50%;
  background:linear-gradient(135deg,var(--s2-primary),var(--s2-primary-2));
}
.s2-title{
  margin-top:18px;
  font-family:var(--display);font-weight:600;
  font-size:clamp(34px,3.4vw,52px);line-height:1.04;letter-spacing:-.035em;
  text-wrap:balance;
}
.s2-title em{
  font-style:normal;
  background:linear-gradient(135deg,var(--s2-primary),var(--s2-primary-2));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.s2-lead{margin-top:14px;max-width:58ch;font-size:14.5px;line-height:1.68;color:var(--s2-muted)}
.s2-head-side{flex:none;text-align:right}
.s2-head-side b{
  display:block;font-family:var(--display);font-size:44px;font-weight:600;
  line-height:1;letter-spacing:-.04em;
}
.s2-head-side span{display:block;margin-top:8px;font-size:11px;line-height:1.5;color:var(--s2-muted);letter-spacing:.02em}

.s2-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:13px 20px;border-radius:12px;
  font:600 13px/1 var(--site-font);letter-spacing:-.01em;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.s2-btn svg{width:15px;height:15px;transition:transform .2s ease}
.s2-btn:hover{transform:translateY(-1px)}
.s2-btn:hover svg{transform:translateX(2px)}
.s2-btn--primary{
  background:linear-gradient(135deg,var(--s2-primary),var(--s2-primary-2));
  color:#fff;box-shadow:0 10px 26px -12px rgba(76,91,245,.8);
}
.s2-btn--primary:hover{box-shadow:0 16px 34px -14px rgba(76,91,245,.9)}
.s2-btn--ghost{background:#fff;border:1px solid var(--s2-line);color:var(--s2-ink);box-shadow:var(--s2-shadow-sm)}
.s2-btn--ghost:hover{border-color:rgba(76,91,245,.4)}
.s2-btn--dark{background:#0e1628;color:#fff}
.s2-btn--block{width:100%}

.s2-card{
  background:#fff;border:1px solid var(--s2-line-2);border-radius:var(--s2-radius);
  box-shadow:var(--s2-shadow-sm);
}



/* ==========================================================================
   Адаптив — базовая деградация (ПК-версия приоритетна)
   ========================================================================== */
@media (max-width:1180px){
  .s2 .container,.st2 .container{padding-inline:28px}
  .ft2-grid,.kit2-grid{grid-template-columns:repeat(2,1fr)}
  .prc2-grid{grid-template-columns:repeat(2,1fr)}
  .pr2-terms{grid-template-columns:repeat(2,1fr)}
  .es2-grid{grid-template-columns:1fr}
  .st2-grid{grid-template-columns:repeat(2,1fr);gap:20px 0}
  .st2-item:nth-child(3){padding-left:0;border-left:0}
  .fq2-grid,.car2-grid{grid-template-columns:1fr}
  .s2-head{flex-direction:column;align-items:flex-start;gap:20px}
  .s2-head-side{text-align:left}
  .st2-head{flex-direction:column;align-items:flex-start}
  .st2-note{text-align:left;max-width:none}
  .cmp2-table{grid-template-columns:1fr 1fr}
  .cmp2-head-cell:nth-child(4n+1){border-left:1px solid var(--s2-line-2)}
  .cmp2-head-cell:nth-child(4n+2){border-left:0}
}
@media (max-width:760px){
  .s2{padding:56px 0}
  .ft2-grid,.kit2-grid,.prc2-grid,.pr2-terms,.pr2-grid,.car2-grid{grid-template-columns:1fr}
  .st2-grid{grid-template-columns:1fr;gap:0}
  .st2-item{padding:18px 0;border-left:0;border-top:1px solid rgba(255,255,255,.12)}
  .st2-item:first-child{border-top:0}
  .cmp2-table{grid-template-columns:1fr}
  .cmp2-cell{border-left:0}
  .fq2-answer{padding-left:18px}
  .s2-title{font-size:30px}
}

@media (prefers-reduced-motion:reduce){
  .s2 *,.st2 *{transition:none!important;animation:none!important}
}
