/* Holgo · визуальные решения в блоках страниц.
   Слой добавляет иллюстрации в существующие блоки и не меняет их тексты.
   01 — /ai-audit, «Что вы получите на выходе»: стопка документов-результатов.
   04 — /services, шапка «Все услуги»: колода из десяти направлений. */

html.orbit{--hv-ease:cubic-bezier(.22,1,.36,1);
  /* --hv-ease стартует на максимальной скорости: хорошо для «раздачи» колоды,
     но при наведении читается как рывок. Для отклика на курсор — мягкий разгон. */
  --hv-soft:cubic-bezier(.32,.08,.24,1);
  --hv-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");
  --hv-plaster:radial-gradient(120% 110% at 26% -10%, #ffffff 0%, #f8f6f2 38%, #e6e1d7 76%, #d2ccbf 100%);
  --hv-plaster-flat:linear-gradient(180deg,#fbfaf7,#ded9ce)}
html.orbit[data-orbit-theme=dark]{
  --hv-plaster:radial-gradient(120% 110% at 26% -10%, #4a4c55 0%, #3d3f47 38%, #2c2e35 76%, #232429 100%);
  --hv-plaster-flat:linear-gradient(180deg,#44464f,#26272c)}

/* ─────────────────────────────────────────────────────────────
   01 · Стопка результатов аудита
   ───────────────────────────────────────────────────────────── */

html.orbit .hv-audit-layout{display:grid;gap:3rem;align-items:start;
  grid-template-columns:minmax(0,1fr) minmax(0,.92fr)}
@media (max-width:1023px){html.orbit .hv-audit-layout{grid-template-columns:1fr;gap:2.25rem}}

html.orbit .hv-stack{position:relative;height:430px;perspective:1400px;perspective-origin:58% 40%}
@media (max-width:1023px){html.orbit .hv-stack{height:340px;perspective-origin:50% 40%}}
@media (max-width:520px){html.orbit .hv-stack{height:290px}}

html.orbit .hv-stack-inner{position:absolute;inset:0;transform-style:preserve-3d;
  transform:rotateX(var(--rx,40deg)) rotateZ(var(--rz,-22deg));
  transition:transform 1.1s var(--hv-ease)}

html.orbit .hv-sheet{position:absolute;left:50%;top:50%;width:300px;height:392px;
  margin:-196px 0 0 -150px;transform-style:preserve-3d;background:var(--card);
  border:1px solid var(--border);
  box-shadow:0 1px 1px #191a1c14, 0 10px 22px -12px #191a1c3d, 0 26px 46px -28px #191a1c47;
  transform:translate3d(var(--x,0),var(--y,0),var(--z,0)) rotate(var(--r,0deg));
  transition:transform .72s var(--hv-ease), box-shadow .72s var(--hv-ease);
  padding:18px 18px 14px;overflow:hidden}
@media (max-width:520px){html.orbit .hv-sheet{width:216px;height:282px;margin:-141px 0 0 -108px;padding:13px}}

html.orbit .hv-sheet::after{content:"";position:absolute;inset:0;background-image:var(--hv-grain);
  mix-blend-mode:multiply;opacity:.16;pointer-events:none}
html.orbit[data-orbit-theme=dark] .hv-sheet::after{mix-blend-mode:screen;opacity:.07}
html.orbit .hv-sheet::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(142deg,#ffffff4d 0%,#ffffff00 34%,#19191a0e 100%)}
html.orbit[data-orbit-theme=dark] .hv-sheet::before{
  background:linear-gradient(142deg,#ffffff14 0%,#ffffff00 40%,#0000002e 100%)}

html.orbit .hv-sheet.is-lift{
  box-shadow:0 2px 2px #191a1c1a, 0 22px 34px -14px #191a1c4d, 0 52px 74px -34px #191a1c4d}

html.orbit .hv-sheet-head{display:flex;align-items:baseline;justify-content:space-between;gap:.5rem;
  padding-bottom:9px;border-bottom:1px solid var(--border)}
html.orbit .hv-sheet-no{font-size:9px;font-weight:700;letter-spacing:.14em;color:var(--primary)}
html.orbit .hv-sheet-kind{font-size:8px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted-foreground)}
html.orbit .hv-sheet-title{margin-top:10px;font-size:12.5px;line-height:1.3;font-weight:600;
  color:var(--foreground);letter-spacing:-.01em}
@media (max-width:520px){html.orbit .hv-sheet-title{font-size:11px}}
html.orbit .hv-sheet-body{margin-top:12px;display:grid;gap:7px}

html.orbit .hv-map{width:100%;height:auto;display:block}
html.orbit .hv-rule{height:5px;background:var(--border)}
html.orbit .hv-rule.w80{width:80%}
html.orbit .hv-rule.w45{width:45%}
html.orbit .hv-row{display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:5px 0;border-bottom:1px solid var(--border);font-size:8.5px;color:var(--muted-foreground)}
html.orbit .hv-row b{color:var(--foreground);font-weight:600}
html.orbit .hv-row .num{color:var(--primary);font-weight:700;font-variant-numeric:tabular-nums}
html.orbit .hv-bars{display:grid;gap:5px}
html.orbit .hv-bars i{display:block;height:6px;background:var(--accent);position:relative}
html.orbit .hv-bars i::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--v);
  background:var(--primary)}
html.orbit .hv-gantt{display:grid;gap:6px}
html.orbit .hv-gantt i{display:block;height:7px;background:var(--accent);margin-left:var(--o);width:var(--w)}
html.orbit .hv-gantt i.b{background:var(--primary)}
html.orbit .hv-cross{display:flex;align-items:center;gap:6px;font-size:8.5px;
  color:var(--muted-foreground);padding:4px 0}
html.orbit .hv-cross em{font-style:normal;color:var(--primary);font-weight:700}
html.orbit .hv-sum{display:flex;align-items:baseline;gap:6px;margin-top:4px}
html.orbit .hv-sum b{font-size:19px;font-weight:700;letter-spacing:-.02em;color:var(--foreground)}
html.orbit .hv-sum span{font-size:8px;color:var(--muted-foreground)}

/* Строки списка управляют стопкой. */
html.orbit .hv-linked li{transition:color .3s var(--hv-ease)}
html.orbit .hv-linked li[data-hv-on=true]{color:var(--primary)}
html.orbit .hv-hint{margin-top:1.1rem;font-size:.72rem;color:var(--muted-foreground);
  max-width:46ch;line-height:1.55}

/* ─────────────────────────────────────────────────────────────
   04 · Веер направлений
   ───────────────────────────────────────────────────────────── */

html.orbit .hv-fan{position:relative;margin:.5rem 0 clamp(2rem,4vw,3.2rem);height:206px;
  perspective:1600px;perspective-origin:50% 90%}
@media (max-width:900px){html.orbit .hv-fan{height:170px}}
@media (max-width:560px){html.orbit .hv-fan{height:148px}}

html.orbit .hv-fan-deck{position:absolute;inset:0;transform-style:preserve-3d;
  transition:transform .5s var(--hv-ease)}

/* Селектор длиннее, чем кажется нужным, и это намеренно. В focus.css есть
   html.orbit :is(a[href], button…, [role="button"]…) с собственным transition,
   и оно сильнее короткого html.orbit .hv-plate. Из-за этого возврат карточки
   шёл вообще без анимации — мгновенным скачком, пока подъём плавно работал.
   Полный путь .hv-fan .hv-fan-deck .hv-plate выигрывает при любом порядке файлов. */
html.orbit .hv-fan .hv-fan-deck .hv-plate{position:absolute;top:0;left:var(--x);width:var(--w);height:176px;
  transform:rotate(var(--a)) translateY(var(--y)) translateZ(var(--z));
  /* Возврат заметно длиннее подъёма — так карточка «оседает», а не отскакивает.
     z-index держится до конца движения: иначе на уводе курсора карточка мгновенно
     уходит за соседние, ещё не опустившись, и это читается как скачок. */
  transition:left .75s var(--hv-ease) var(--d), transform .82s var(--hv-soft),
             box-shadow .82s var(--hv-soft), filter .3s linear, z-index 0s linear .82s;
  background:var(--hv-plaster),var(--hv-plaster-flat);
  box-shadow:inset 0 1px 0 #fff, inset 0 -16px 24px -18px #57524899,
             -1px 0 0 #191a1c14, 0 16px 26px -18px #101018a6;
  color:var(--foreground);text-decoration:none;display:block;padding:14px 13px;overflow:hidden}
html.orbit[data-orbit-theme=dark] .hv-plate{
  box-shadow:inset 0 1px 0 #ffffff1f, inset 0 -16px 24px -18px #00000099,
             -1px 0 0 #ffffff14, 0 16px 26px -18px #000000cc}
@media (max-width:900px){html.orbit .hv-plate{height:140px;padding:10px 9px}}
@media (max-width:560px){html.orbit .hv-plate{height:120px;padding:8px 7px}}

html.orbit .hv-plate::after{content:"";position:absolute;inset:0;background-image:var(--hv-grain);
  mix-blend-mode:multiply;opacity:.1;pointer-events:none}
html.orbit[data-orbit-theme=dark] .hv-plate::after{mix-blend-mode:screen;opacity:.05}

html.orbit .hv-plate-no{display:block;font-size:9px;font-weight:700;letter-spacing:.16em;
  color:var(--primary)}
html.orbit .hv-plate-name{display:block;margin-top:10px;font-size:12px;line-height:1.26;
  font-weight:600;letter-spacing:-.01em;max-width:15ch}
/* Веер живёт от 1000 px. До 1280 px полоса пластины узкая — уменьшаем кегль,
   иначе название обрезается соседней пластиной. */
@media (min-width:1000px) and (max-width:1279px){
  html.orbit .hv-plate-name{font-size:10.5px;margin-top:7px}}
@media (max-width:560px){html.orbit .hv-plate-name{font-size:9px}}
html.orbit .hv-plate-foot{position:absolute;left:13px;right:13px;bottom:12px;font-size:8.5px;
  color:var(--muted-foreground);border-top:1px solid #191a1c1f;padding-top:7px;display:grid;gap:2px}
html.orbit[data-orbit-theme=dark] .hv-plate-foot{border-top-color:#ffffff26}
html.orbit .hv-plate-foot b{font-weight:600;color:var(--foreground);font-size:9.5px}
@media (max-width:900px){html.orbit .hv-plate-foot{display:none}}

html.orbit .hv-fan .hv-fan-deck .hv-plate:hover,
html.orbit .hv-fan .hv-fan-deck .hv-plate:focus-visible{outline:none;z-index:40;
  transition:left .75s var(--hv-ease) var(--d), transform .58s var(--hv-soft),
             box-shadow .58s var(--hv-soft), filter .3s linear, z-index 0s;
  transform:rotate(0deg) translateY(calc(var(--y) - 16px)) translateZ(52px);
  box-shadow:inset 0 1px 0 #fff, inset 0 -16px 24px -18px #57524899, 0 34px 44px -20px #101018b8}

/* Веер показываем только там, где десять пластин читаются разом. Узкий экран
   режет названия — там блок остаётся без иллюстрации: раскладка сама это меряет
   и ставит флаг. Сложенная стопка, что была здесь для телефона, убрана. */
html.orbit .hv-fan.hv-off{display:none}

/* Зов: пока по вееру не водили мышью, веер тихо колышется — волна пробегает
   по пластинам. Под курсором колыхание встаёт на паузу: там своя раскладка. */
@keyframes hv-fan-call{
  /* Спокойное колыхание: пластина чуть выпрямляется, приподнимается и выходит
     вперёд — движение того же рода, что при наведении, но вполсилы. Идёт всегда,
     а не один раз до первого касания мышью: веер должен выглядеть живым. */
  0%,100%{transform:rotate(var(--a)) translateY(var(--y)) translateZ(var(--z))}
  50%{transform:rotate(calc(var(--a) * .62)) translateY(calc(var(--y) - 7px))
      translateZ(calc(var(--z) + 14px))}
}
html.orbit .hv-fan.hv-call .hv-fan-deck .hv-plate{
  /* Задержка по номеру пластины — волна идёт слева направо, а не дышит разом. */
  animation:hv-fan-call 4.2s var(--hv-soft) infinite;
  animation-delay:calc(var(--i,0) * 150ms)}
/* Под курсором колыхание не нужно: там своя раскладка веера, и два движения
   разом дают дрожь. Пауза снимается, как только курсор ушёл. */
html.orbit .hv-fan.hv-call:hover .hv-fan-deck .hv-plate,
html.orbit .hv-fan.hv-call:focus-within .hv-fan-deck .hv-plate{animation-play-state:paused}
html.orbit .hv-fan .hv-fan-deck .hv-plate:hover,
html.orbit .hv-fan .hv-fan-deck .hv-plate:focus-visible{animation:none}

/* ───────────────────────────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  html.orbit .hv-stack-inner,html.orbit .hv-sheet,html.orbit .hv-plate,
  html.orbit .hv-fan-deck,html.orbit .hv-linked li{
    transition-duration:.01ms!important;transition-delay:0s!important}
  html.orbit .hv-fan .hv-fan-deck .hv-plate{animation:none!important}
}

/* ═══════════════════════════════════════════════════════════════
   05 · Что остаётся после встречи
   Главная, блок «Первый шаг — разговор на 40 минут»: справа от текста
   композиция из трёх артефактов — расшифровка, вынутые задачи, оценка эффекта.
   ═══════════════════════════════════════════════════════════════ */

html.orbit .hv-meet{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);
  gap:clamp(2rem,3vw,3.5rem);align-items:start}
@media (max-width:1023px){html.orbit .hv-meet{grid-template-columns:1fr;gap:2.5rem}}

html.orbit .hv-scene{position:relative;min-height:700px;padding-top:.4rem}
@media (max-width:1023px){html.orbit .hv-scene{min-height:660px}}

html.orbit .hv-mcard{position:absolute;background:var(--card);border:1px solid var(--border);
  box-shadow:0 1px 1px #191a1c0f, 0 14px 28px -18px #101018a1;
  opacity:0;transform:translateY(16px);
  transition:opacity .6s var(--hv-ease), transform .8s var(--hv-ease);
  transition-delay:var(--d)}
html.orbit .hv-scene.hv-in .hv-mcard{opacity:1;transform:translateY(0)}

/* 1 · Расшифровка разговора */
html.orbit .hv-transcript{left:0;top:0;width:min(55%,404px);padding:18px 19px 16px}
html.orbit .hv-thead{display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding-bottom:9px;border-bottom:1px solid var(--border);
  font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted-foreground)}
html.orbit .hv-thead b{color:var(--primary);font-weight:700;letter-spacing:.13em}
html.orbit .hv-line{display:grid;grid-template-columns:40px 1fr;gap:11px;margin-top:11px;
  font-size:13px;line-height:1.5;color:var(--muted-foreground)}
html.orbit .hv-line time{font-variant-numeric:tabular-nums;font-size:11px;padding-top:1px;opacity:.75}
html.orbit .hv-line p{margin:0}
html.orbit .hv-line mark{color:var(--foreground);font-weight:600;padding:0 2px;background-color:transparent;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
  background-image:linear-gradient(var(--accent),var(--accent));
  background-repeat:no-repeat;background-position:left 0.92em;background-size:0% 0.72em;
  transition:background-size .75s var(--hv-ease);transition-delay:var(--hd)}
html.orbit .hv-scene.hv-in .hv-line mark{background-size:100% 0.72em}

/* 2 · Задачи, вынутые из разговора */
html.orbit .hv-task{right:0;width:min(39%,286px);padding:14px 17px 16px}
html.orbit .hv-task[data-i="0"]{top:0}
html.orbit .hv-task[data-i="1"]{top:158px}
@media (min-width:1201px){
  html.orbit .hv-task{right:-18px}
  html.orbit .hv-task[data-i="0"]{top:-44px}
}
/* На узкой колонке карточки шире в долях — поджимаем расшифровку. */
@media (max-width:1200px){html.orbit .hv-transcript{width:min(52%,404px)}}
html.orbit .hv-task-top{display:flex;align-items:center;justify-content:space-between;gap:8px;
  font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-foreground)}
html.orbit .hv-task-name{margin-top:9px;font-size:16px;font-weight:600;letter-spacing:-.01em;line-height:1.3}
html.orbit .hv-task-how{margin-top:8px;font-size:12px;line-height:1.45;color:var(--muted-foreground)}
html.orbit .hv-task-meta{margin-top:11px;padding-top:10px;border-top:1px solid var(--border);
  display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--muted-foreground)}
html.orbit .hv-task-meta b{color:var(--primary);font-weight:700;font-variant-numeric:tabular-nums}

/* 3 · Ожидаемый эффект */
html.orbit .hv-verdict{left:0;bottom:0;width:min(72%,460px);padding:17px 19px 18px;
  background:var(--foreground);color:#f4f3ee;border-color:transparent}
html.orbit[data-orbit-theme=dark] .hv-verdict{background:#0d0e10}
html.orbit .hv-verdict .hv-thead{border-color:#ffffff2e;color:#ffffffa6}
html.orbit .hv-verdict .hv-thead b{color:#a3aaff}
html.orbit .hv-vnum{margin-top:13px;font-size:38px;font-weight:600;letter-spacing:-.04em;line-height:1}
html.orbit .hv-vrows{margin-top:13px;display:grid;gap:6px}
html.orbit .hv-vrows div{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
  font-size:12.5px;color:#ffffffa1;border-top:1px solid #ffffff1f;padding-top:7px}
html.orbit .hv-vrows b{color:#fff;font-weight:600;font-size:14px;white-space:nowrap;
  font-variant-numeric:tabular-nums}
html.orbit .hv-vbar{margin-top:14px;height:5px;background:#ffffff26;position:relative;overflow:hidden}
html.orbit .hv-vbar i{position:absolute;inset:0 auto 0 0;width:0;background:#a3aaff;
  transition:width 1.5s var(--hv-ease);transition-delay:2.35s}
html.orbit .hv-scene.hv-in .hv-vbar i{width:68%}

/* Нить от подсвеченной фразы к появившейся задаче */
html.orbit .hv-wire{position:absolute;inset:0;pointer-events:none;overflow:visible}
html.orbit .hv-wire path{fill:none;stroke:var(--primary);stroke-width:1.4;opacity:.55;
  stroke-dasharray:var(--len);stroke-dashoffset:var(--len);
  transition:stroke-dashoffset .9s var(--hv-ease);transition-delay:var(--d)}
html.orbit .hv-scene.hv-in .hv-wire path{stroke-dashoffset:0}
html.orbit .hv-wire .hv-tip{stroke-dasharray:none;stroke-dashoffset:0;stroke-linecap:round;
  stroke-linejoin:round;opacity:0;transition:opacity .28s var(--hv-ease);transition-delay:var(--d)}
html.orbit .hv-scene.hv-in .hv-wire .hv-tip{opacity:.55}

/* Строка над сценой снимает возражение «у нас не так» до того, как человек
   начнёт читать цифры. Абсолютная: карточки в сцене тоже абсолютные,
   и отступ в потоке их не сдвинет. */
html.orbit .hv-lead{position:absolute;left:0;bottom:100%;margin-bottom:.5rem;
  font-size:.8rem;line-height:1.4;color:var(--muted-foreground)}
html.orbit .hv-cap{position:absolute;left:0;right:0;top:100%;margin-top:.75rem;
  font-size:.8rem;line-height:1.4;color:var(--muted-foreground)}

/* Телефон: коллаж раскладывается в столбец. Композиция держится на том, что
   карточки лежат внахлёст в фиксированной сцене; на 390 px чёрная карточка
   закрывала расшифровку целиком, а вторая задача уходила под неё. */
@media (max-width:620px){
  html.orbit .hv-scene{min-height:0;padding-top:0;display:grid;gap:12px}
  html.orbit .hv-mcard{position:static;width:auto;max-width:none}
  html.orbit .hv-task[data-i="0"],html.orbit .hv-task[data-i="1"]{top:auto;right:auto}
  html.orbit .hv-task{padding:13px 15px 14px}
  html.orbit .hv-line{grid-template-columns:38px 1fr}
  html.orbit .hv-verdict{padding:15px 16px 16px}
  html.orbit .hv-vnum{font-size:30px}
  /* Линии рисуются по координатам карточек в сцене — в столбце теряют смысл. */
  html.orbit .hv-wire{display:none}
  html.orbit .hv-cap{position:static;margin-top:2px;max-width:none}
  html.orbit .hv-lead{position:static;margin-bottom:2px;order:-1}
}

@media (prefers-reduced-motion:reduce){
  html.orbit .hv-mcard{opacity:1!important;transform:none!important}
  html.orbit .hv-line mark{background-size:100% 0.7em!important}
  html.orbit .hv-wire path{stroke-dashoffset:0!important}
  html.orbit .hv-wire .hv-tip{opacity:.55!important}
  html.orbit .hv-vbar i{width:68%!important}
}

/* ═══════════════════════════════════════════════════════════════
   Данные за цифрами (вариант 14)
   Главная, блок «Сначала экономика. Затем технология.»: пустое поле
   карточки со статистикой становится самим числом. Третью карточку
   («37%») занимает фигура из focus.css — сюда она не попадает.
   ═══════════════════════════════════════════════════════════════ */

html.orbit .hv-plot{position:relative;margin-top:10px;pointer-events:none;
  opacity:0;transform:translateY(8px);
  transition:opacity .6s var(--hv-ease),transform .8s var(--hv-ease)}
html.orbit .focus-research-source-card.hv-in .hv-plot{opacity:1;transform:none}

/* 1 · Сто квадратов: двадцать шесть компаний из ста. */
html.orbit .hv-hundred{position:absolute;left:0;bottom:0;display:grid;
  grid-template-columns:repeat(20,7px);gap:3px}
html.orbit .hv-hundred i{width:7px;height:7px;background:var(--border);opacity:0;
  transition:opacity .3s linear;transition-delay:calc(var(--i) * 7ms + .25s)}
html.orbit .hv-hundred i[data-on=true]{background:var(--primary)}
html.orbit .focus-research-source-card.hv-in .hv-hundred i{opacity:1}
@media (max-width:1100px){
  html.orbit .hv-hundred{grid-template-columns:repeat(20,5px);gap:2px}
  html.orbit .hv-hundred i{width:5px;height:5px}
}
/* Полоса под график вышла низкой — сетка мельче, иначе пять рядов не встают. */
html.orbit .hv-plot.hv-tight .hv-hundred{grid-template-columns:repeat(20,5px);gap:2px}
html.orbit .hv-plot.hv-tight .hv-hundred i{width:5px;height:5px}

/* 2 · Воронка: из ста пилотов до работы доходят девять. */
html.orbit .hv-funnel{position:absolute;left:0;right:0;bottom:0;height:100%;
  display:flex;align-items:flex-end;gap:3px}
html.orbit .hv-funnel i{flex:1;background:var(--accent);height:5px;
  transition:height .7s var(--hv-ease);transition-delay:calc(var(--i) * 44ms + .25s)}
html.orbit .hv-funnel i.hv-last{background:var(--primary)}
html.orbit .focus-research-source-card.hv-in .hv-funnel i{height:var(--h)}

@media (prefers-reduced-motion:reduce){
  html.orbit .hv-plot{opacity:1!important;transform:none!important}
  html.orbit .hv-hundred i{opacity:1!important}
  html.orbit .hv-funnel i{height:var(--h)!important}
}