/*
 * V71 · Трофеи со старого vnish.global · r1
 * Приказ шефа 29.07: перенести со старого прода (V2, /assets/site-466b754a,
 * motion-collection-calm) три сцены + усилить финдер:
 *  1. КОКПИТ «The same cockpit on every screen» - фото 3 девайсов + световой
 *     проход (после дашборда telemetry, тема продолжается)
 *  2. АРМИЯ «Run a thousand machines like one» - miner-fans сцена, кроп
 *     УЖЕСТОЧЁН по приказу (scale 1.22 -> 1.5, пустой верх колонны срезан),
 *     10 канон-фанов внутри кропа едут вместе с картинкой, дебаг-лейблы скрыты
 *  3. АКТИВАЦИЯ «Ready when you are» - ЧЁРНЫЕ пустые CSS-двери ВЫБРОШЕНЫ,
 *     створки сделаны из самого фото (bg-слайсы, hinge по внешним кромкам,
 *     rotateY 52deg -> 0), тень проёма гаснет, bloom + лого канон
 *  4. Чипы моделей у финдера (мгновенный вход, идея старого конфигуратора)
 * Классы .vgo-* / .mf* - коллизий с канон-файлами v46 нет (проверено grep).
 * Откат: минус файл + v71-oldmine.js + вырезать три секции и чипы из index.
 */

/* ================= общий каркас сцен ================= */
.vgo-scene { position: relative; padding: clamp(56px, 9vh, 110px) 0; }
.vgo-shell { width: var(--shell); margin: 0 auto; }
.vgo-intro { margin-bottom: 30px; }
.vgo-kicker {
  color: var(--gold);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .3em;
  text-transform: uppercase;
  margin: 0 0 14px;
}
.vgo-title {
  font-size: clamp(32px, 3.4vw, 56px);
  font-weight: 620;
  letter-spacing: -.04em;
  line-height: 1;
  margin: 0;
  max-width: 18ch;
}
.vgo-copy { color: var(--muted); font-size: 15.5px; line-height: 1.6; margin: 14px 0 0; max-width: 52ch; }

.vgo-frame {
  position: relative;
  overflow: clip;
  border: 1px solid rgba(216, 183, 107, .18);
  border-radius: var(--radius-scene, 22px);
  background: #050506;
  box-shadow: 0 30px 90px rgba(0, 0, 0, .45);
}
.vgo-frame img.vgo-master { display: block; width: 100%; height: auto; }

/* ================= 1 · КОКПИТ ================= */
/* приказ 29.07: пустоту после дашборда срезать - кокпит подтянут вплотную */
.vgo-cockpit { padding-top: clamp(14px, 2.5vh, 34px); }
.vgo-cockpit .vgo-frame { aspect-ratio: 1672 / 941; }
.vgo-cockpit .vgo-frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* живость экранов: пульс-индикаторы LIVE на всех трёх устройствах */
.vgo-live-dot {
  position: absolute;
  z-index: 4;
  width: 0.65%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle at 34% 30%, #b8ffd6, #37c66f 70%);
  box-shadow: 0 0 10px rgba(95, 208, 138, 0.9), 0 0 22px rgba(95, 208, 138, 0.4);
  animation: vgoLivePulse 2.4s ease-in-out infinite;
  pointer-events: none;
}
.vgo-live-dot--laptop { left: 38.6%; top: 40.6%; }
.vgo-live-dot--phone { left: 12.2%; top: 43.6%; animation-delay: -.8s; }
.vgo-live-dot--tablet { left: 76.4%; top: 41.2%; animation-delay: -1.6s; }
@keyframes vgoLivePulse { 0%, 100% { opacity: .55; transform: scale(.9); } 50% { opacity: 1; transform: scale(1.15); } }
@media (prefers-reduced-motion: reduce) { .vgo-live-dot { animation: none; } }
.vgo-cockpit-light {
  position: absolute;
  inset: -30%;
  z-index: 3;
  background: linear-gradient(108deg, transparent 30%, rgba(240, 217, 157, .13), transparent 62%);
  transform: translateX(-65%);
  animation: vgoCockpitLight 11s ease-in-out infinite;
  pointer-events: none;
}
@keyframes vgoCockpitLight {
  0%, 30% { opacity: 0; transform: translateX(-65%); }
  55% { opacity: .55; }
  80%, 100% { opacity: 0; transform: translateX(65%); }
}

/* ================= 2 · АРМИЯ (sovereign array) ================= */
/* кроп по приказу: жирнее старого (1.22 -> 1.5), верх пустой колонны срезан */
.vgo-scenecrop {
  overflow: hidden;
  border-radius: var(--radius-scene, 22px);
  position: relative;
}
/* р7: кино-кадр 21:9 уже в файле; медленный кен-бёрнс всей сцены */
.vgo-scenecrop > * { transform: scale(1.02); transform-origin: 50% 62%; animation: vgoArrayKen 22s ease-in-out infinite alternate; }
@keyframes vgoArrayKen { from { transform: scale(1.02); } to { transform: scale(1.09); } }
@media (prefers-reduced-motion: reduce) { .vgo-scenecrop > * { animation: none; } }
.vgo-scenecrop::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 50% 78%, transparent 40%, rgba(4, 5, 6, .55) 100%),
    linear-gradient(rgba(4, 5, 6, .45), transparent 30%);
}

.mf { width: 100%; min-width: 0; }
.mf__scene {
  position: relative;
  width: 100%;
  aspect-ratio: var(--mf-aspect, 1672 / 941);
  overflow: hidden;
  isolation: isolate;
  background: #050506;
}
.mf__world, .mf__media, .mf__media img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}
.mf__media img { object-fit: cover; }
.mf__fan {
  position: absolute;
  z-index: 2;
  left: var(--x);
  top: var(--y);
  width: var(--w);
  height: var(--h);
  transform: translate(-50%, -50%) rotate(var(--angle));
  overflow: hidden;
  border-radius: 50%;
  clip-path: ellipse(48% 48% at 50% 50%);
  opacity: var(--opacity);
  pointer-events: none;
}
.mf__fan-blades, .mf__fan-sheen {
  position: absolute;
  display: block;
  border-radius: 50%;
  pointer-events: none;
}
.mf__fan-blades {
  inset: 5%;
  opacity: .66;
  background: center / 100% 100% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23434a50'/%3E%3Cstop offset='.24' stop-color='%231a1e22'/%3E%3Cstop offset='.76' stop-color='%2307090b'/%3E%3Cstop offset='1' stop-color='%232a3035'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill='url(%23g)' stroke='%23656d73' stroke-opacity='.38' stroke-width='.7'%3E%3Cpath d='M52 48C56 30 67 16 84 10C84 29 75 44 58 54C55 53 53 51 52 48Z'/%3E%3Cpath transform='rotate(51.43 50 50)' d='M52 48C56 30 67 16 84 10C84 29 75 44 58 54C55 53 53 51 52 48Z'/%3E%3Cpath transform='rotate(102.86 50 50)' d='M52 48C56 30 67 16 84 10C84 29 75 44 58 54C55 53 53 51 52 48Z'/%3E%3Cpath transform='rotate(154.29 50 50)' d='M52 48C56 30 67 16 84 10C84 29 75 44 58 54C55 53 53 51 52 48Z'/%3E%3Cpath transform='rotate(205.71 50 50)' d='M52 48C56 30 67 16 84 10C84 29 75 44 58 54C55 53 53 51 52 48Z'/%3E%3Cpath transform='rotate(257.14 50 50)' d='M52 48C56 30 67 16 84 10C84 29 75 44 58 54C55 53 53 51 52 48Z'/%3E%3Cpath transform='rotate(308.57 50 50)' d='M52 48C56 30 67 16 84 10C84 29 75 44 58 54C55 53 53 51 52 48Z'/%3E%3C/g%3E%3Ccircle cx='50' cy='50' r='16' fill='%23111519' stroke='%234d565d' stroke-width='2'/%3E%3Ccircle cx='50' cy='50' r='5' fill='%23050708'/%3E%3C/svg%3E");
  animation: vgoSpin var(--speed, 3s) linear var(--delay, 0s) infinite var(--direction, normal);
}
.mf__fan-sheen {
  inset: 0;
  background: radial-gradient(circle at 32% 30%, rgba(255, 255, 255, .14), transparent 46%);
  mix-blend-mode: screen;
}
/* дебаг-подписи Fan N на страницу не пускаем (канон 17.07) */
.mf__fan-label { display: none; }
@keyframes vgoSpin { to { rotate: 360deg; } }
@media (prefers-reduced-motion: reduce) { .mf__fan-blades { animation: none; } }

/* geo пересчитана под кино-кадр 1370x587 (р7) */
.mf-geo-array-0 { --mf-aspect: 1370 / 587; }
.mf-geo-array-1 { --x: 9.93%; --y: 53.83%; --w: 8.4%; --h: 19.59%; --angle: 0deg; --speed: 2.75s; --delay: -.8s; --direction: normal; --opacity: .8; }
.mf-geo-array-2 { --x: 9.93%; --y: 78.19%; --w: 8.4%; --h: 19.59%; --angle: 0deg; --speed: 3.18s; --delay: -1.9s; --direction: reverse; --opacity: .78; }
.mf-geo-array-3 { --x: 20.44%; --y: 52.3%; --w: 3.21%; --h: 8.18%; --angle: 0deg; --speed: 2.98s; --delay: -3s; --direction: reverse; --opacity: .66; }
.mf-geo-array-4 { --x: 20.44%; --y: 65.25%; --w: 3.21%; --h: 8.18%; --angle: 0deg; --speed: 3.31s; --delay: -4.1s; --direction: normal; --opacity: .64; }
.mf-geo-array-5 { --x: 20.44%; --y: 78.19%; --w: 3.21%; --h: 8.18%; --angle: 0deg; --speed: 3.08s; --delay: -5.2s; --direction: reverse; --opacity: .65; }
.mf-geo-array-6 { --x: 74.68%; --y: 53.83%; --w: 8.4%; --h: 19.59%; --angle: 0deg; --speed: 2.92s; --delay: -6.3s; --direction: reverse; --opacity: .8; }
.mf-geo-array-7 { --x: 74.68%; --y: 78.19%; --w: 8.4%; --h: 19.59%; --angle: 0deg; --speed: 3.28s; --delay: -7.4s; --direction: normal; --opacity: .78; }
.mf-geo-array-8 { --x: 84.67%; --y: 52.64%; --w: 3.21%; --h: 8.18%; --angle: 0deg; --speed: 3.12s; --delay: -8.5s; --direction: normal; --opacity: .66; }
.mf-geo-array-9 { --x: 84.67%; --y: 65.76%; --w: 3.21%; --h: 8.18%; --angle: 0deg; --speed: 2.88s; --delay: -9.6s; --direction: reverse; --opacity: .64; }
.mf-geo-array-10 { --x: 84.67%; --y: 78.36%; --w: 3.21%; --h: 8.18%; --angle: 0deg; --speed: 3.24s; --delay: -10.7s; --direction: normal; --opacity: .65; }

/* ================= 3 · АКТИВАЦИЯ (двери из фото) ================= */
.vgo-threshold .vgo-frame {
  aspect-ratio: 1672 / 941;
  perspective: 1500px;
}
.vgo-threshold .vgo-frame > picture img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* створки: слайсы САМОГО фото, только сами дверные полотна (24-44 и 56-76).
   Приказ 29.07: майнер в центре НЕ перекрывается никогда, старт с приоткрытых
   створок (26deg), никакой полной темноты */
/* приказ р5: никаких створок-слайсов. Спокойное премиальное открытие:
   медленный наезд камеры (кен-бёрнс), свет в проёме разгорается, знак
   проявляется в глубине. Физике ничего не противоречит: двери уже
   распахнуты на самом кадре */
.vgo-threshold .vgo-frame > picture img {
  transform: scale(1.06);
  transform-origin: 50% 46%;
  filter: brightness(.9) saturate(1.04);
}
.is-run .vgo-threshold .vgo-frame > picture img,
.vgo-threshold.is-run .vgo-frame > picture img {
  animation: vgoThresholdKen 9s cubic-bezier(.25, .1, .2, 1) .3s both;
}
@keyframes vgoThresholdKen {
  from { transform: scale(1.06); filter: brightness(.82) saturate(1); }
  to { transform: scale(1); filter: brightness(1.02) saturate(1.08); }
}

.vgo-threshold-bloom {
  position: absolute;
  inset: 0;
  z-index: 2;
  opacity: 0;
  background: radial-gradient(circle at 50% 54%, rgba(240, 217, 157, .42), rgba(216, 183, 107, .08) 20%, transparent 55%);
  pointer-events: none;
}
.is-run .vgo-threshold-bloom { animation: vgoBloom 7.5s ease .5s both; }
@keyframes vgoBloom { 0%, 35% { opacity: 0; } 68% { opacity: .86; } 100% { opacity: .4; } }

.vgo-threshold-logo {
  position: absolute;
  left: 50%;
  top: 36%;
  z-index: 3;
  width: clamp(110px, 16vw, 230px);
  opacity: 0;
  transform: translate(-50%, -50%) scale(.55);
}
.vgo-threshold-logo img { width: 100%; height: auto; display: block; filter: drop-shadow(0 0 26px rgba(231, 199, 125, .3)); }
.is-run .vgo-threshold-logo { animation: vgoThLogo 7.5s cubic-bezier(.2, .75, .2, 1) .5s both; }
@keyframes vgoThLogo {
  0%, 42% { opacity: 0; transform: translate(-50%, -50%) scale(.55); }
  72%, 100% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

.vgo-threshold-copy {
  position: absolute;
  left: clamp(20px, 5vw, 72px);
  bottom: clamp(20px, 4vw, 56px);
  z-index: 5;
}
.vgo-threshold-copy .vgo-kicker { margin-bottom: 8px; }
.vgo-threshold-copy h2 {
  font-size: clamp(28px, 2vw + 16px, 62px);
  font-weight: 600;
  letter-spacing: -.045em;
  line-height: 1;
  margin: 0;
  max-width: 17ch;
  text-shadow: 0 3px 30px #000;
}

@media (prefers-reduced-motion: reduce) {
  .vgo-threshold-bloom { opacity: .4; animation: none !important; }
  .vgo-threshold-logo { opacity: 1; transform: translate(-50%, -50%) scale(1); animation: none !important; }
  .vgo-cockpit-light { animation: none; opacity: 0; }
}

/* шаги safe-install теперь ведут в живые разделы (приказ 29.07) */
.safe-install li .safe-step-link {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1;
  color: inherit;
  text-decoration: none;
}
.safe-install li .safe-step-link em {
  margin-left: auto;
  font-style: normal;
  color: rgba(231, 199, 125, 0);
  transition: color .25s ease, transform .25s ease;
}
.safe-install li:hover .safe-step-link em { color: var(--gold, #e7c77d); transform: translateX(3px); }
.safe-install li:hover strong { color: var(--gold-bright, #f4dda4); }

/* ================= 4 · чипы моделей у финдера ================= */
.finder-model-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 18px;
}
.finder-model-chips b {
  flex-basis: 100%;
  color: var(--muted);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: .24em;
}
.finder-model-chip {
  padding: 9px 16px;
  border: 1px solid rgba(232, 207, 153, .22);
  border-radius: 999px;
  background: linear-gradient(165deg, rgba(23, 27, 28, .8), rgba(9, 11, 12, .9));
  color: var(--ivory);
  font-size: 12px;
  font-weight: 660;
  letter-spacing: .04em;
  cursor: pointer;
  transition: border-color .25s ease, transform .25s var(--ease), box-shadow .25s ease;
}
.finder-model-chip:hover {
  border-color: rgba(231, 199, 125, .55);
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(0, 0, 0, .4);
}

/* ================= мобилка ================= */
@media (max-width: 760px) {
  .vgo-scene { padding: 44px 0; }
  .vgo-scenecrop > * { transform-origin: 50% 62%; }
  .vgo-threshold-copy h2 { font-size: 24px; }
  .vgo-threshold-logo { width: 108px; }
  .vgo-cockpit .vgo-frame, .vgo-threshold .vgo-frame { border-radius: 14px; }
}

/* ================= р7: АКТИВАЦИЯ - световая перекомпоновка ================= */
.vgo-th-beams { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.vgo-th-beams i {
  position: absolute;
  top: -4%;
  width: 16%;
  height: 74%;
  background: conic-gradient(from 180deg at 50% 0%, transparent 40%, rgba(255, 216, 140, 0.22) 49%, rgba(255, 232, 170, 0.34) 50%, rgba(255, 216, 140, 0.22) 51%, transparent 60%);
  filter: blur(8px);
  mix-blend-mode: screen;
  animation: vgoThBeam 5.6s ease-in-out infinite;
}
.vgo-th-beams i:nth-child(1) { left: 12%; animation-delay: -1.4s; }
.vgo-th-beams i:nth-child(2) { left: 42%; width: 18%; height: 82%; animation-delay: 0s; }
.vgo-th-beams i:nth-child(3) { right: 12%; animation-delay: -2.8s; }
@keyframes vgoThBeam { 0%, 100% { opacity: .4; } 50% { opacity: .95; } }

.vgo-threshold-bloom {
  background:
    radial-gradient(ellipse at 50% 56%, rgba(255, 220, 150, 0.4), rgba(216, 183, 107, 0.1) 26%, transparent 56%);
  animation: vgoThWarm 6s ease-in-out infinite !important;
  opacity: 1 !important;
}
@keyframes vgoThWarm { 0%, 100% { opacity: .5; } 50% { opacity: 1; } }

.vgo-th-path {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 34%;
  height: 34%;
  transform: translateX(-50%) perspective(700px) rotateX(58deg);
  transform-origin: 50% 100%;
  background:
    linear-gradient(0deg, rgba(255, 214, 130, 0.24), transparent 70%),
    repeating-linear-gradient(0deg, rgba(255, 226, 160, 0.4) 0 2px, transparent 2px 26px);
  -webkit-mask: linear-gradient(0deg, black 30%, transparent);
  mask: linear-gradient(0deg, black 30%, transparent);
  mix-blend-mode: screen;
  animation: vgoThPath 3.4s linear infinite;
  pointer-events: none;
}
@keyframes vgoThPath { from { background-position: 0 0, 0 0; } to { background-position: 0 0, 0 -26px; } }

.vgo-th-dust {
  position: absolute;
  inset: 12% 26% 26%;
  z-index: 2;
  background-image:
    radial-gradient(circle, rgba(255, 236, 180, 0.9) 0 1px, transparent 2px),
    radial-gradient(circle, rgba(255, 214, 130, 0.65) 0 1px, transparent 2px);
  background-size: 210px 170px, 150px 130px;
  background-position: 20% 30%, 70% 60%;
  mix-blend-mode: screen;
  animation: vgoDustTwinkle2 4.6s ease-in-out infinite alternate;
  pointer-events: none;
}
@keyframes vgoDustTwinkle2 { from { opacity: .2; } to { opacity: .75; } }
