/* ============================================================
   A1 landing v2 — кастомный слой ПОВЕРХ живого CSS optimism.ru.
   Все токены — из дизайн-системы optimism (design-system.md).
   Namespace .a1-*. Сквозная метафора «поток данных» (hero-пакеты,
   рельса степпера, полоска дашборда). Header/footer — нативные 1:1.
   ============================================================ */

:root{
  --a1-blue:#0ca1f5; --a1-blue-hover:#00BDFF; --a1-coral:#f75a53;
  --a1-ink:#022222; --a1-gray:#626262;
  --a1-field-h:60px;
  --a1-shadow:0 0 30px rgba(0,107,202,.05),0 0 50px rgba(2,34,34,.07);
  --a1-shadow-hover:0 0 30px rgba(0,189,255,.18),0 0 50px rgba(2,34,34,.10);
}
html{ scroll-behavior:smooth; }

.a1-section-intro{ max-width:900px; margin:0 auto 1.2em; }
.a1-center{ text-align:center; }

/* ---------- чек-лист с галочками ---------- */
.a1-check{ list-style:none; padding:0; margin:0 0 1.2em; }
.a1-check li{ position:relative; padding-left:1.7em; margin-bottom:.5em; line-height:1.45; }
.a1-check li::before{ content:"\2713"; position:absolute; left:0; top:0; color:var(--a1-blue); font-family:'DINPro-CondBold',sans-serif; font-weight:bold; }

/* ---------- HERO ---------- */
/* первый экран — целиком белый: hero заполняет вьюпорт, синие секции уходят под сгиб */
@media(min-width:1200px){ .panel-title{ min-height:calc(100vh - 90px); } .panel-title > .row{ min-height:calc(100vh - 90px); } }
.panel-title .title-one{ font-size:clamp(2.2rem,3.3vw,3.5rem) !important; line-height:1.05 !important; margin-bottom:.4em; }
.panel-title .main-desc .fz19{ font-size:1.12em; }
.a1-hero-proof{ color:var(--a1-gray); font-size:.95em; margin:0 0 1.1em; }

.a1-hero-visual{ position:relative; width:100%; max-width:540px; margin:0 auto; aspect-ratio:5/4; }
.a1-hero-svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.a1-packet{ fill:var(--a1-blue-hover); offset-rotate:0deg; animation:a1-flow 3.4s linear infinite; }
@keyframes a1-flow{ from{ offset-distance:0% } to{ offset-distance:100% } }

/* пульсирующие кольца за ядром */
.a1-rings{ position:absolute; left:50%; top:50%; width:230px; height:230px; transform:translate(-50%,-50%); pointer-events:none; z-index:1; }
.a1-rings::before,.a1-rings::after{ content:""; position:absolute; left:50%; top:50%; width:100%; height:100%; transform:translate(-50%,-50%); border:1px solid rgba(12,161,245,.35); border-radius:50%; animation:a1-ring 3.2s ease-out infinite; }
.a1-rings::after{ animation-delay:1.6s; }
@keyframes a1-ring{ 0%{ opacity:.55; transform:translate(-50%,-50%) scale(.55) } 100%{ opacity:0; transform:translate(-50%,-50%) scale(1.18) } }

/* ядро ROI */
.a1-core{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:48%; min-width:188px; z-index:3; padding:1.1em 1.2em; text-align:center; background:linear-gradient(160deg,rgba(0,143,224,.12),rgba(0,189,255,.03)); border:1px solid var(--a1-blue); box-shadow:0 0 55px rgba(0,189,255,.35); -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); }
.a1-core__live{ position:absolute; top:.7em; right:.8em; display:inline-flex; align-items:center; gap:.35em; font-family:'DINPro-CondBold',sans-serif; font-size:10px; letter-spacing:1px; color:var(--a1-blue); }
.a1-core__label{ font-family:'DINPro-CondBold',sans-serif; font-size:11px; letter-spacing:1.2px; color:var(--a1-blue); }
.a1-core__roi{ font-family:'DINPro-CondBlack','DINPro-CondBold',sans-serif; font-size:2.9rem; line-height:1; color:var(--a1-ink); margin:.05em 0 .15em; }
.a1-core__chips span{ display:block; font-family:'JoannaSansNova',sans-serif; font-size:12px; color:var(--a1-ink); line-height:1.5; }
.a1-core__spark{ display:block; width:100%; height:30px; margin-top:.5em; }

/* узлы-агенты */
.a1-node{ position:absolute; transform:translate(-50%,-50%); z-index:3; display:flex; align-items:center; gap:.45em; background:#fff; border:1px solid #e3edf6; box-shadow:var(--a1-shadow); padding:.5em .7em; white-space:nowrap; }
.a1-node i{ color:var(--a1-blue); font-size:1.05em; }
.a1-node span{ font-family:'DINPro-CondBold',sans-serif; text-transform:uppercase; font-size:.74rem; letter-spacing:.3px; color:var(--a1-ink); }
.a1-node .a1-dot{ width:.42em; height:.42em; }

/* ---------- полоса-якорь статистики ---------- */
.a1-statsband{ padding:3.4em 0; }
.a1-stats-bar{ display:flex; flex-wrap:wrap; align-items:center; }
@media(max-width:767px){ .a1-statsband{ padding:2.2em 0; } }
.a1-stat{ flex:1 1 0; text-align:center; padding:.3em 1.5em; border-left:1px solid rgba(255,255,255,.25); }
.a1-stat:first-child{ border-left:0; }
.a1-stat__num{ font-family:'DINPro-CondBold',sans-serif; font-size:3em; line-height:1; color:#fff; }
.a1-stat__unit{ font-size:.5em; }
.a1-stat__label{ color:rgba(255,255,255,.9); font-size:.95em; line-height:1.4; margin-top:.5em; }
.a1-arrow{ color:var(--a1-coral); }
@media(max-width:767px){ .a1-stat{ flex:1 1 100%; border-left:0; padding:.9em 0; } .a1-stat+.a1-stat{ border-top:1px solid rgba(255,255,255,.2); } }
/* светлый вариант полосы статистики (блок «Что меняется в цифрах») */
.a1-stats-bar--light .a1-stat{ border-left-color:rgba(2,34,34,.10); }
.a1-stats-bar--light .a1-stat__num{ color:var(--a1-ink); }
.a1-stats-bar--light .a1-stat__label{ color:var(--a1-gray); }
@media(max-width:767px){ .a1-stats-bar--light .a1-stat+.a1-stat{ border-top-color:rgba(2,34,34,.12); } }

/* фон-точки для синих секций (рифма с hero) — ОВЕРЛЕЙ через ::before, не затирает градиент секции */
.a1-dots{ position:relative; }
.a1-dots::before{ content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(255,255,255,.08) 1px,transparent 1px); background-size:22px 22px; pointer-events:none; z-index:0; }
.a1-dots > .container{ position:relative; z-index:1; }

/* ---------- карточки ---------- */
.a1-card{ background:#fff; border-radius:0; box-shadow:var(--a1-shadow); padding:2em 1.6em; height:100%; text-align:left; transition:box-shadow .25s ease,transform .25s ease; }
.a1-card:hover{ box-shadow:var(--a1-shadow-hover); transform:translateY(-3px); }
a.a1-card{ color:var(--a1-ink); text-decoration:none; display:block; }
.a1-card__icon{ font-size:2.4em; color:var(--a1-blue); line-height:1; margin-bottom:.25em; }
.a1-card__title{ font-family:'DINPro-CondBold',sans-serif; font-size:1.5em; line-height:1.1; text-transform:uppercase; color:var(--a1-ink); margin:.15em 0 .45em; }
.a1-card__text{ color:var(--a1-ink); line-height:1.55; }
.a1-card__metric{ color:var(--a1-blue); font-family:'DINPro-CondBold',sans-serif; }
.a1-card--hub{ border:1px solid var(--a1-blue); }

/* карточки на синих секциях — белый текст */
.blue-grad .a1-card,.type-diagonalgr .a1-card{ background:rgba(255,255,255,.10); }
.blue-grad .a1-card__title,.type-diagonalgr .a1-card__title,
.blue-grad .a1-card__text,.type-diagonalgr .a1-card__text,
.blue-grad .a1-card__icon,.type-diagonalgr .a1-card__icon{ color:#fff; }

/* иконки болей: FA-глиф поверх шаблонного .items-icon — белые, крупнее */
.list-fourth .item .items-icon.fa{ background:none !important; width:auto; height:auto; color:#fff; font-size:2.4em; line-height:1; display:inline-block; margin-bottom:.25em; }

/* ---------- мини-дашборд «вау» ---------- */
.a1-card--dash{ display:flex; flex-direction:column; }
.a1-dashboard{ margin:.4em 0 .8em; }
.a1-dashboard__row{ display:flex; align-items:center; gap:.6em; padding:.35em 0; }
.a1-dashboard__name{ font-family:'DINPro-CondBold',sans-serif; text-transform:uppercase; font-size:.8em; color:var(--a1-ink); white-space:nowrap; }
.a1-dot{ width:.6em; height:.6em; border-radius:50%; background:var(--a1-blue); flex:0 0 auto; }
.a1-dot--live{ animation:a1-pulse 1.6s ease-in-out infinite; }
.a1-dashboard__bar{ flex:1; height:.5em; background:linear-gradient(90deg,var(--a1-blue),rgba(12,161,245,.15)); }
@keyframes a1-pulse{ 0%,100%{ opacity:.4; transform:scale(.85) } 50%{ opacity:1; transform:scale(1.1) } }

/* ---------- степпер с рельсой ---------- */
.a1-step{ position:relative; }
.a1-step__num{ display:inline-flex; align-items:center; justify-content:center; width:2em; height:2em; border-radius:0; background:var(--a1-blue); color:#fff; font-family:'DINPro-CondBold',sans-serif; font-size:1.4em; line-height:1; margin-bottom:.5em; }
@media(min-width:992px){
  .a1-steps{ position:relative; }
  .a1-steps > [class*="col-"]{ position:relative; }
  .a1-steps > [class*="col-"]:not(:last-child) .a1-step::after{ content:""; position:absolute; top:1.4em; left:calc(100% - 1em); width:2em; height:2px; background:linear-gradient(90deg,var(--a1-blue),rgba(12,161,245,.2)); z-index:1; }
}

/* ---------- тарифы ---------- */
.a1-tariff{ display:flex; flex-direction:column; background:#fff; border-radius:0; box-shadow:var(--a1-shadow); padding:2em 1.6em; height:100%; border-top:4px solid transparent; position:relative; transition:box-shadow .25s ease; }
.a1-tariff:hover{ box-shadow:var(--a1-shadow-hover); }
.a1-tariff--featured{ border:2px solid var(--a1-blue); border-top-width:4px; box-shadow:0 0 40px rgba(0,189,255,.22); }
@media(min-width:992px){ .a1-tariff--featured{ transform:translateY(-12px); } }
.a1-tariff__badge{ position:absolute; top:-.95em; left:50%; transform:translateX(-50%); background:var(--a1-coral); color:#fff; font-family:'DINPro-CondBold',sans-serif; text-transform:uppercase; font-size:.8em; letter-spacing:.04em; padding:.2em .8em; white-space:nowrap; }
.a1-tariff__name{ font-family:'DINPro-CondBold',sans-serif; font-size:1.85em; line-height:1; text-transform:uppercase; color:var(--a1-blue); margin:0; }
.a1-tariff__who{ color:var(--a1-gray); margin:.35em 0 1em; min-height:2.6em; line-height:1.4; }
.a1-tariff .a1-check{ flex:1 1 auto; }
.a1-tariff__price{ font-family:'DINPro-CondBold',sans-serif; font-size:1.55em; color:var(--a1-ink); margin:.3em 0 .1em; }
.a1-tariff__price small{ display:block; font-family:'JoannaSansNova',sans-serif; font-size:.5em; color:var(--a1-gray); text-transform:none; line-height:1.4; margin-top:.3em; }
.a1-nw{ white-space:nowrap; }
.a1-tariff .btn{ margin-top:auto; width:100%; }
@media(max-width:991px){ .a1-tariff__who{ min-height:0; } }

/* ---------- Знаем / Умеем / Сделаем (grid-фикс) ---------- */
.a1-guarant-grid{ display:grid; grid-template-columns:minmax(0,4fr) minmax(0,8fr); grid-template-rows:repeat(3,auto); align-items:center; row-gap:1.6em; column-gap:2.2em; }
.a1-guarant-word{ text-align:left; align-self:center; font-family:'DINPro-CondBlack','DINPro-CondBold',sans-serif !important; font-size:clamp(2.6rem,5vw,4.6rem) !important; line-height:.92; color:var(--a1-blue); }
.a1-guarant-text{ align-self:center; color:var(--a1-ink); line-height:1.4; }
@media(max-width:767px){
  .a1-guarant-grid{ grid-template-columns:1fr; row-gap:.4em; }
  .a1-guarant-word{ text-align:left; font-size:clamp(2.2rem,12vw,3rem) !important; margin-top:.6em; }
  .a1-guarant-text{ margin-bottom:.6em; }
}

/* ---------- кейс-плейсхолдер + чипы ---------- */
.a1-case{ background:#fff; border-radius:0; box-shadow:var(--a1-shadow); border-left:4px solid var(--a1-blue); padding:1.8em; }
.a1-case__head{ display:flex; align-items:center; flex-wrap:wrap; gap:.8em; margin-bottom:.6em; }
.a1-case__title{ font-family:'DINPro-CondBold',sans-serif; font-size:1.5em; text-transform:uppercase; color:var(--a1-ink); }
.a1-case__badge{ background:var(--a1-coral); color:#fff; font-family:'DINPro-CondBold',sans-serif; text-transform:uppercase; font-size:.75em; padding:.2em .7em; letter-spacing:.04em; }
.a1-case__chips{ display:flex; flex-wrap:wrap; gap:.6em; }
.a1-chip{ display:inline-flex; align-items:center; gap:.35em; background:#ebf8ff; color:var(--a1-ink); padding:.35em .8em; font-size:.9em; }

/* ---------- материалы ---------- */
.a1-doc{ display:block; background:#fff; border-radius:0; padding:1.1em 1.3em; box-shadow:var(--a1-shadow); color:var(--a1-ink); height:100%; }
.a1-doc i{ color:var(--a1-blue); margin-right:.5em; }
.a1-doc--soon{ opacity:.7; }
.a1-doc__tag{ color:var(--a1-gray); font-size:.85em; }

/* ---------- формы (выравнивание инпут = кнопка) ---------- */
.a1-form{ max-width:560px; margin:0 auto; display:flex; flex-direction:column; gap:.9em; }
.a1-form .crm-form-input,
.a1-form input[type="text"],.a1-form input[type="tel"],.a1-form input[type="email"]{
  height:var(--a1-field-h); line-height:normal; box-sizing:border-box; width:100%;
  padding:0 1em; border:1px solid #cfd8dc; border-radius:0; background:#fff;
  font-family:'JoannaSansNova',sans-serif; font-size:1.5em; color:var(--a1-ink); margin:0;
}
.a1-form .crm-form-input:focus{ outline:none; border-color:var(--a1-blue); box-shadow:0 0 0 .2rem rgba(12,161,245,.25); }
.a1-form .btn{ height:var(--a1-field-h); line-height:normal; box-sizing:border-box; display:flex; width:100%; margin:0; align-self:stretch; align-items:center; justify-content:center; border-radius:0; }
.a1-consent{ display:flex; align-items:flex-start; gap:.6em; margin:.2em 0 .2em; text-align:left; }
.a1-consent input{ margin-top:.3em; flex:0 0 auto; }
.a1-consent label{ font-size:.9em; line-height:1.4; color:#fff; }
.type-graypale .a1-consent label,.type-white .a1-consent label{ color:var(--a1-gray); }
.a1-form__success{ display:none; padding:1em; background:#ebf8ff; color:#0771ad; font-family:'DINPro-CondBold',sans-serif; }
.a1-form__success.is-shown{ display:block; }

/* ---------- мобильная sticky CTA ---------- */
.a1-sticky-cta{ display:none; }
@media(max-width:991px){
  .a1-sticky-cta.is-visible{ display:flex; position:fixed; left:0; right:0; bottom:0; z-index:60; gap:0; box-shadow:0 -4px 16px rgba(2,34,34,.18); }
  .a1-sticky-cta .btn{ flex:1; min-height:52px; border-radius:0; display:inline-flex; align-items:center; justify-content:center; }
  .a1-sticky-cta__tel{ flex:0 0 64px !important; }
  body{ }
}

/* ---------- CTA-строка в блоке болей (чтобы кнопка не «сиротела») ---------- */
.a1-cta-block{ margin-top:1em; }
.a1-cta-line{ font-size:1.6em; line-height:1.15; color:#fff; margin:0 auto .9em; max-width:18em; }

/* ---------- фикс нативной формы аудита в футере (поле = высоте кнопки) ---------- */
.footer .sec-intro_wrapp{ align-items:stretch; }
.footer .sec-intro__input_wrapper{ flex:1 1 auto; display:flex; }
.footer .sec-intro__input{ height:51px; width:100%; box-sizing:border-box; font-size:24px; line-height:normal; }

/* ---------- FAQ: уже + стабильные колонки (перебиваем 3-классовые !important шаблона) ---------- */
.faq-section .faq-section__container.container{ max-width:1080px !important; width:auto !important; }
.faq-section .faq-section__list .faq-section__items{ display:grid !important; grid-template-columns:1fr 1fr !important; column-count:1 !important; column-gap:44px; align-items:start; }
.faq-section .faq-section__list .faq-section__item{ break-inside:auto; width:auto !important; }
@media(max-width:767px){ .faq-section .faq-section__list .faq-section__items{ grid-template-columns:1fr !important; } }

/* ---------- доступность анимаций ---------- */
@media(prefers-reduced-motion:reduce){
  .a1-packet,.a1-svg-node,.a1-dot--live,.btn-pulse{ animation:none !important; }
  html{ scroll-behavior:auto; }
}
