/* Страница услуги внедрения: образ авиации. Ночной аэродром вид сверху, один самолет летит по странице вместе с прокруткой (vnedrenie/js/main.js).
   План: VNEDRENIE-PAGE-PLAN.md. Читаемый исходник, без сборки. Шапка, меню, подвал, кнопки и окно формы общие (css/site-chrome.css, css/site-form.css), здесь тема страницы (vn-*), всё в слое page.
   Слои по высоте: фон экрана (поле, полоса, облака) < небо (самолет и след, fixed) < текст экрана (.vn-in). Секции не создают контекст наложения (без isolation, transform, filter).
   Логические свойства (inline, block): страница готова к RTL. */
@layer page {

body.vn {
  --site-bg: #08090c;           /* графит с синевой, ночное небо */
  --site-dim: rgba(226, 232, 240, 0.74);
  --site-line: rgba(255, 176, 96, 0.24);
  --site-accent: #ffb060;
  --site-accent-ink: #0b0c10;
  --site-signal: #ffb060;
  --site-wrap: 78rem;
  --bg-2: #101319;
  --amber: #ffb060;
  --amber-hi: #ffe1b8;
  --amber-lo: #c46a1c;
  --coral: #ff7a59;
  --ok: #5de08a;
  --ink: #0b0c10;
  --team-card: rgba(255, 176, 96, 0.06);
  --team-line: rgba(255, 176, 96, 0.25);
  --team-accent: var(--amber);
  --faq-accent: var(--amber);
  --faq-accent-ink: var(--ink);
  --faq-radius: 0.6rem;
  --faq-line-open: rgba(255, 176, 96, 0.6);
  --why-card: rgba(12, 15, 20, 0.72);
  --why-line: rgba(255, 176, 96, 0.24);
  --why-accent: var(--amber);
  --why-ink: #0b0c10;
}
html { scroll-behavior: smooth; }

/* ---------- каркас в теме страницы ---------- */
.site-head::before { background: linear-gradient(to bottom, rgba(8, 9, 12, 0.94) 55%, rgba(8, 9, 12, 0)); }
.site-head.is-scrolled::before { background: rgba(8, 9, 12, 0.9); }
.site-head__tag { position: relative; z-index: 2; }
.site-head__tag li:first-child { color: var(--amber-hi); }
.site-menu { background: rgba(8, 9, 12, 0.985); }
.site-menu__n { color: var(--amber); }
.site-menu__list a:hover { color: var(--amber-hi); }
.site-menu__list a[aria-current="page"] { color: var(--amber); }
.site-footer__col ul a:hover, .site-footer__col > p > a:hover { color: var(--amber-hi); }
.site-footer__col .site-footer__h { color: var(--amber); }
.site-top:hover { border-color: var(--amber); }
.site-head__lang { white-space: nowrap; }

.site-btn {
  min-height: 3.1rem; padding: 0 1.9rem; border: 1.5px solid transparent; border-radius: 3rem; background: none;
  transition: transform 0.25s, background-color 0.25s, border-color 0.25s, box-shadow 0.25s;
}
.site-btn:hover { border-color: transparent; }
.vn .site-btn--main { color: var(--ink); background: linear-gradient(180deg, var(--amber-hi), var(--amber) 60%, var(--amber-lo)); box-shadow: 0 0 0 0 rgba(255, 176, 96, 0.4); background-origin: border-box; }
.vn .site-btn--main:hover { box-shadow: 0 0 0 6px rgba(255, 176, 96, 0.14), 0 0 30px rgba(255, 176, 96, 0.3); }
.site-btn--main::after { content: none; }
.site-btn--ghost { border-color: rgba(255, 176, 96, 0.5); color: var(--site-fg); }
.site-btn--ghost:hover { border-color: var(--amber-hi); background: rgba(255, 176, 96, 0.08); }

.site-dialog { border-radius: 0.5rem; background: var(--bg-2); }
.site-dialog::backdrop { background: rgba(4, 5, 7, 0.82); }
.site-dialog__title { color: var(--amber-hi); }
.site-input { border-radius: 0.25rem; background: rgba(255, 176, 96, 0.06); }
.site-input:focus { border-color: var(--amber); }
.site-form__consent input { accent-color: var(--amber); }
.site-form__status[data-state="ok"] { color: var(--amber-hi); }

.crumbs { margin: 0 0 0.4rem; font-size: 0.85rem; }
.crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.5rem; margin: 0; padding: 0; list-style: none; color: var(--site-dim); }
.crumbs li + li::before { content: "/"; margin-inline-end: 0.5rem; color: rgba(226, 232, 240, 0.35); }
.crumbs a { display: inline-block; padding-block: 0.5rem; text-decoration: none; color: var(--site-dim); }
.crumbs a:hover { color: var(--amber-hi); text-decoration: underline; text-underline-offset: 0.2em; }
.crumbs [aria-current="page"] { color: var(--site-fg); }

/* ---------- общие элементы экранов ---------- */
.vn [hidden] { display: none !important; }
.vn main { overflow-x: clip; }
.vn-main { position: relative; }
.vn-in { position: relative; z-index: 3; }
.vn-h2 { margin: 0 0 1rem; font-family: var(--site-font-head); font-weight: 400; text-transform: uppercase; line-height: 1.02; font-size: clamp(1.9rem, 4.6vw, 3.4rem); color: var(--amber-hi); }
.vn-h3 { margin: 2rem 0 0.8rem; font-family: var(--site-font-head); font-weight: 400; font-size: 1.15rem; letter-spacing: 0.02em; text-transform: uppercase; color: var(--amber); }
.vn-lead { margin: 0 0 1.6rem; color: var(--site-dim); font-size: clamp(1rem, 1.6vw, 1.2rem); line-height: 1.6; }
.vn-actions { display: flex; flex-wrap: wrap; gap: 0.8rem; }
@keyframes vn-rise { from { opacity: 0; transform: translateY(1rem); } to { opacity: 1; transform: none; } }
.vn-rise { animation: vn-rise 0.8s ease both; animation-delay: calc(var(--i, 0) * 0.12s); }

/* ---------- небо: самолет и след (слой fixed между фоном и текстом) ---------- */
/* ворота (огни и пунктир) лежат на отдельном холсте под текстом: самолет и след могут быть поверх текста, а огни текст не перекрывают */
.vn-gates { position: fixed; inset: 0; z-index: 1; inline-size: 100%; block-size: 100%; pointer-events: none; opacity: 0; transition: opacity 0.6s; }
.vn-js .vn-gates { opacity: 1; }
.vn-gates.is-away { opacity: 0; }
html:not(.vn-js) .vn-gates, .vn-still .vn-gates { display: none; }
.vn-sky { position: fixed; inset: 0; z-index: 1; pointer-events: none; opacity: 0; transition: opacity 0.6s; }
.vn-js .vn-sky { opacity: 1; }
.vn-sky.is-away { opacity: 0; }
.vn-trail { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; }
.vn-plane { position: absolute; inset-block-start: 0; inset-inline-start: 0; inline-size: clamp(6rem, 14vw, 14rem); will-change: transform; contain: layout style; }
.vn-plane img { display: block; inline-size: 100%; block-size: auto; }
.vn-plane__img { position: relative; filter: brightness(0.84) contrast(1.06); }
.vn-plane__sh { position: absolute; inset: 0; filter: brightness(0) blur(5px); opacity: 0.5; transform: translate(var(--sx, 5px), var(--sy, 9px)) scale(var(--ss, 0.96)); transform-origin: 50% 50%; }
.vn-plane__nav { position: absolute; inline-size: 0.3rem; block-size: 0.3rem; border-radius: 50%; transform: translate(-50%, -50%); }
.vn-plane__nav--l { inset-inline-start: 1.3%; inset-block-start: 61.9%; background: #ff4a3d; box-shadow: 0 0 0.7rem 0.2rem rgba(255, 74, 61, 0.75); }
.vn-plane__nav--r { inset-inline-start: 98.6%; inset-block-start: 61.9%; background: #4dff8a; box-shadow: 0 0 0.7rem 0.2rem rgba(77, 255, 138, 0.75); }
.vn-plane__nav--b { inset-inline-start: 50%; inset-block-start: 44.3%; inline-size: 0.34rem; block-size: 0.34rem; background: #ff3b30; box-shadow: 0 0 0.9rem 0.25rem rgba(255, 59, 48, 0.8); animation: vn-strobe 2.4s steps(1) 0.8s infinite; }
.vn-plane__nav--t { inset-inline-start: 50%; inset-block-start: 99.2%; inline-size: 0.36rem; block-size: 0.36rem; background: #fff; box-shadow: 0 0 0.9rem 0.25rem rgba(255, 255, 255, 0.85); animation: vn-strobe 1.6s steps(1) infinite; }
@keyframes vn-strobe { 0%, 88% { opacity: 0; } 90%, 100% { opacity: 1; } }

/* без скрипта и при «меньше движения»: самолет стоит на полосе, след не рисуется */
html:not(.vn-js) .vn-sky, .vn-still .vn-sky { display: none; }
.vn-fly-toggle { position: fixed; inset-block-end: 1rem; inset-inline-start: 1rem; z-index: 50; inline-size: 2.6rem; block-size: 2.6rem; padding: 0; border: 1px solid rgba(255, 176, 96, 0.4); border-radius: 50%; background: rgba(8, 9, 12, 0.8); color: var(--site-dim); cursor: pointer; display: grid; place-items: center; }
.vn-fly-toggle:hover { color: var(--amber-hi); border-color: var(--amber-hi); }
.vn-fly-ico { display: block; inline-size: 0.8rem; block-size: 0.9rem; border-inline: 3px solid currentColor; box-sizing: border-box; }   /* пауза: две полоски, анимация идет */
.vn-fly-toggle[aria-pressed="true"] .vn-fly-ico { border: 0; inline-size: 0.95rem; block-size: 1.05rem; background: currentColor; clip-path: polygon(0 0, 100% 50%, 0 100%); transform: translateX(0.14rem); }   /* воспроизведение: треугольник, центр тяжести по центру круга */

/* ---------- V1. Первый экран ---------- */
.vn-hero { position: relative; min-block-size: 100vh; min-block-size: 100svh; padding: 7.2rem var(--site-gutter) 4.5rem; display: flex; flex-direction: column; justify-content: center; }
.vn-field { position: absolute; inset: 0; z-index: 0; pointer-events: none; -webkit-mask-image: linear-gradient(to bottom, #000 78%, transparent 100%); mask-image: linear-gradient(to bottom, #000 78%, transparent 100%); }
.vn-field::before { content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(60% 40% at 82% 8%, rgba(255, 122, 89, 0.14), transparent 70%),
    linear-gradient(180deg, #0c1016 0%, #08090c 70%); }
.vn-runway { position: absolute; inset-block-start: 12vh; inset-inline-end: 7%; inline-size: clamp(10rem, 27vw, 24rem);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 5%, #000 82%, transparent 100%), linear-gradient(to right, transparent 0, #000 22%, #000 78%, transparent 100%);
  -webkit-mask-composite: source-in; mask-image: linear-gradient(to bottom, transparent 0, #000 5%, #000 82%, transparent 100%), linear-gradient(to right, transparent 0, #000 22%, #000 78%, transparent 100%); mask-composite: intersect; }
.vn-runway__end { position: absolute; inset-inline: 0; inset-block-end: 14%; block-size: 1px; }
.vn-runway__img { display: block; inline-size: 100%; block-size: auto; opacity: 0.92; }   /* картинка полосы уже вытянута на 30 процентов в самом файле: длинный разбег */
.vn-cloud { position: absolute; border-radius: 50%; background: radial-gradient(closest-side, rgba(255, 226, 214, 0.2), rgba(255, 226, 214, 0)); filter: blur(10px); }
.vn-cloud--1 { inset-block-start: 62%; inset-inline-start: 4%; inline-size: 30rem; block-size: 11rem; }
.vn-cloud--2 { inset-block-start: 70%; inset-inline-start: 46%; inline-size: 36rem; block-size: 12rem; opacity: 0.8; }
.vn-hero__in { inline-size: 100%; }
.vn-intro { max-inline-size: 41rem; }
.vn-h1 { margin: 0 0 1.1rem; font-family: var(--site-font-head); font-weight: 400; text-transform: uppercase; line-height: 1.02; font-size: clamp(2rem, 5.2vw, 4rem); color: var(--amber-hi); }
.vn-h1 span:first-child { display: block; }
.vn-h1 span:last-child { color: var(--site-fg); font-size: 0.62em; letter-spacing: 0.01em; }
.vn-sub { margin: 0 0 1.4rem; max-inline-size: 36rem; color: var(--site-dim); font-size: clamp(1.02rem, 1.7vw, 1.25rem); line-height: 1.55; }
.vn-proof { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0 0 1.6rem; padding: 0; list-style: none; }
.vn-type { display: grid; align-content: start; gap: 0.35rem; min-block-size: 4rem; margin: 0 0 0.7rem; }
.vn-type__l { font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--amber); }
.vn-type__t { font-family: var(--site-font-head); font-size: clamp(1.5rem, 3vw, 2.1rem); line-height: 1.15; text-transform: uppercase; color: var(--amber-hi); overflow-wrap: anywhere; }
.vn-type__c { display: inline-block; inline-size: 0.12em; block-size: 0.95em; margin-inline-start: 0.12em; vertical-align: -0.1em; background: var(--amber); animation: vn-caret 1s steps(1) infinite; }
@keyframes vn-caret { 0%, 55% { opacity: 1; } 56%, 100% { opacity: 0; } }
.vn-more { position: relative; z-index: 6; margin: 0 0 1.4rem; }
.vn-more summary { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.3rem 0; list-style: none; cursor: pointer; font-size: 0.92rem; color: var(--site-dim); }
.vn-more summary::-webkit-details-marker { display: none; }
.vn-more summary::after { content: ""; inline-size: 0.5rem; block-size: 0.5rem; border-inline-end: 1.5px solid currentColor; border-block-end: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform 0.25s; }
.vn-more[open] summary::after { transform: rotate(-135deg) translateY(-2px); }
.vn-more summary:hover { color: var(--site-fg); }
.vn-more__l { position: absolute; inset-block-start: 100%; inset-inline-start: 0; inline-size: min(34rem, 100%); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.45rem 1.4rem; margin: 0.3rem 0 0; padding: 1rem 1.2rem; list-style: none; border: 1px solid var(--site-line); border-radius: 0.7rem; background: #0a0c11; box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.5); }
.vn-more__l li { position: relative; padding-inline-start: 1rem; font-size: 0.93rem; line-height: 1.35; color: var(--site-dim); }
.vn-more__l li::before { content: ""; position: absolute; inset-inline-start: 0; inset-block-start: 0.55em; inline-size: 0.4rem; block-size: 0.18rem; background: var(--amber); }
.vn-proof { margin: 1.8rem 0 0; gap: 0.5rem 1.4rem; }
.vn-proof li { position: relative; padding-inline-start: 1rem; color: var(--site-dim); font-size: 0.9rem; }
.vn-proof li::before { content: ""; position: absolute; inset-inline-start: 0; inset-block-start: 0.5em; inline-size: 0.4rem; block-size: 0.4rem; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0.5rem rgba(93, 224, 138, 0.7); }

/* ---------- V2. Коротко ---------- */
.vn-short { position: relative; padding: 0 var(--site-gutter) 5rem; }
.vn-strip { position: relative; block-size: 7rem; }
.vn-strip--end { block-size: 9rem; }
.vn-short__col { position: relative; max-inline-size: 44rem; }
/* опорные точки ворот: невидимые, сами ворота рисует main.js; положение задает --bx (сдвиг вправо от колонки) */
.vn-beacon { position: absolute; inset-inline-start: calc(100% + var(--bx, 3rem)); inset-block-start: 50%; inline-size: 1px; block-size: 1px; pointer-events: none; }
.vn-lead, .vn-card, .vn-h3 { position: relative; }
.vn-switch { display: inline-flex; padding: 0.25rem; margin-block-end: 1rem; border: 1px solid var(--site-line); border-radius: 3rem; background: rgba(8, 9, 12, 0.6); }
.vn-switch__b { min-block-size: 2.6rem; padding: 0 1.3rem; border: 0; border-radius: 3rem; background: none; color: var(--site-dim); font: inherit; font-size: 0.95rem; cursor: pointer; transition: background-color 0.25s, color 0.25s; }
.vn-switch__b[aria-pressed="true"] { background: linear-gradient(180deg, var(--amber-hi), var(--amber) 60%, var(--amber-lo)); background-origin: border-box; color: var(--ink); }
.vn-card { padding: 1.4rem 1.6rem; border: 1px solid var(--site-line); border-radius: 0.8rem; background: rgba(12, 15, 20, 0.72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.vn-list { display: grid; gap: 0.7rem; margin: 0; padding: 0; list-style: none; }
.vn-list li { position: relative; padding-inline-start: 1.5rem; line-height: 1.45; }
.vn-list li::before { content: ""; position: absolute; inset-inline-start: 0; inset-block-start: 0.55em; inline-size: 0.7rem; block-size: 0.18rem; border-radius: 1px; background: var(--amber); }
.vn-list[data-pane="buy"] li::before { background: rgba(226, 232, 240, 0.4); }
.vn-for { display: grid; gap: 0.6rem; margin: 0; padding: 0; list-style: none; }
.vn-for li { padding: 0.8rem 1rem; border-inline-start: 2px solid var(--amber); background: rgba(12, 15, 20, 0.6); line-height: 1.45; }

/* планшет и телефон: свободных полей мало, самолет летит поверх текста (он не ловит нажатия и быстро проходит) */
@media (max-width: 62rem) {
  .vn-sky { z-index: 3; }
}
/* ---------- телефон: самолет меньше, свободных полей нет ---------- */
@media (max-width: 43.75rem) {
  .vn-plane { inline-size: 3.5rem; }
  .vn-hero { padding-block: 6rem 5.5rem; }
    .vn-runway { inset-block-start: 12vh; inset-inline-end: -4%; inline-size: 46vw; opacity: 0.55; }
  .vn-actions .site-btn { inline-size: 100%; }
  .vn-more__l { grid-template-columns: 1fr; }
  .vn-type { min-block-size: 5.4rem; }
  .vn-strip { block-size: 4rem; }
  .vn-beacon { inset-inline-start: auto; inset-inline-end: 2.6rem; }
}
/* ---------- общие части экранов V3-V6 ---------- */
.vn-sec { position: relative; padding: 0 var(--site-gutter) 5rem; }
.vn-sec__col { position: relative; max-inline-size: 48rem; }
.vn-sec__col--wide { max-inline-size: 56rem; }
.vn-sr { position: absolute; inline-size: 1px; block-size: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.vn-note { margin: 1rem 0 0; font-size: 0.85rem; color: var(--site-dim); }
.vn-sit, .vn-tabs, .vn-step { position: relative; }
.vn-beacon--top { inset-block-start: 1.75rem; }
.vn-facts { display: grid; gap: 0.7rem; margin: 1.1rem 0 1.3rem; }
.vn-facts div { display: grid; gap: 0.15rem; }
.vn-facts dt { font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--amber); }
.vn-facts dd { margin: 0; line-height: 1.45; }

/* ---------- V3. Ситуации ---------- */
.vn-sit { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.7rem; }
.vn-sit__b { min-block-size: 3.6rem; padding: 0.7rem 1rem; text-align: start; border: 1px solid var(--site-line); border-radius: 0.6rem; background: rgba(12, 15, 20, 0.6); color: var(--site-fg); font: inherit; line-height: 1.3; cursor: pointer; transition: border-color 0.25s, background-color 0.25s, transform 0.25s; }
.vn-sit__b:hover { border-color: var(--amber); transform: translateY(-2px); }
.vn-sit__b[aria-pressed="true"] { border-color: var(--amber); background: rgba(255, 176, 96, 0.14); }
.vn-sit__res { margin-block-start: 1rem; }
.vn-sit__p { padding: 1.2rem 1.4rem; border: 1px solid var(--site-line); border-inline-start: 3px solid var(--amber); border-radius: 0.6rem; background: rgba(12, 15, 20, 0.72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.vn-sit__lab { margin: 0 0 0.4rem; font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--amber); }
.vn-sit__t { margin: 0 0 0.9rem; line-height: 1.55; }
.vn-sit__ex { margin: 0 0 1.1rem; padding: 0.75rem 0.95rem; border-radius: 0.5rem; background: rgba(255, 176, 96, 0.08); line-height: 1.5; font-size: 0.95rem; color: var(--site-dim); }
.vn-sit__ex b { color: var(--amber-hi); font-weight: 600; }

/* ---------- V4 и V5. Вкладки, панели, полосы ---------- */
.vn-tabs { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-block-end: 1rem; }
.vn-tab { min-block-size: 2.7rem; padding: 0 1.1rem; border: 1px solid var(--site-line); border-radius: 3rem; background: rgba(12, 15, 20, 0.6); color: var(--site-dim); font: inherit; font-size: 0.95rem; cursor: pointer; transition: background-color 0.25s, color 0.25s, border-color 0.25s; }
.vn-tab:hover { border-color: var(--amber); color: var(--site-fg); }
.vn-tab[aria-selected="true"] { border-color: transparent; background: linear-gradient(180deg, var(--amber-hi), var(--amber) 60%, var(--amber-lo)); background-origin: border-box; color: var(--ink); }
.vn-panel { padding: 1.4rem 1.5rem; border: 1px solid var(--site-line); border-radius: 0.8rem; background: rgba(12, 15, 20, 0.72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.vn-lanes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.vn-lane { padding-block-start: 0.2rem; }
.vn-lane__h { position: relative; margin: 0 0 0.6rem; padding-inline-start: 1.1rem; font-family: var(--site-font-head); font-weight: 400; font-size: 1rem; letter-spacing: 0.03em; text-transform: uppercase; color: var(--site-fg); }
.vn-lane__h::before { content: ""; position: absolute; inset-inline-start: 0; inset-block-start: 0.35em; inline-size: 0.55rem; block-size: 0.55rem; border-radius: 50%; background: var(--amber); box-shadow: 0 0 0.6rem currentColor; color: var(--amber); }
.vn-lane--auto .vn-lane__h::before { background: var(--ok); color: var(--ok); }
.vn-lane--hand .vn-lane__h::before { background: rgba(226, 232, 240, 0.55); color: rgba(226, 232, 240, 0.4); }
.vn-lane ul { display: grid; gap: 0.55rem; margin: 0; padding: 0; list-style: none; }
.vn-lane li { padding-inline-start: 1.1rem; line-height: 1.4; font-size: 0.95rem; color: var(--site-dim); }
.vn-panel .site-btn { margin-block-start: 0.2rem; }
.vn-sol__w { margin: 0 0 1.1rem; font-size: 1.05rem; line-height: 1.55; }
.vn-sol__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.vn-sol__cols > section:first-child .vn-lane__h::before { background: var(--ok); color: var(--ok); }
.vn-sol__cols > section:last-child .vn-lane__h::before { background: rgba(226, 232, 240, 0.55); color: rgba(226, 232, 240, 0.4); }
.vn-list--no li::before { background: rgba(226, 232, 240, 0.4); }
.vn-sol__cols .vn-list li { color: var(--site-dim); font-size: 0.95rem; }

/* ---------- V6. Шаги ---------- */
.vn-steps { display: grid; gap: 0.7rem; margin: 0; padding: 0; list-style: none; }
.vn-step { border: 1px solid var(--site-line); border-radius: 0.8rem; background: rgba(12, 15, 20, 0.7); transition: border-color 0.4s, background-color 0.4s; }
.vn-step__sum { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 0.9rem; padding: 0.95rem 1.2rem; list-style: none; cursor: pointer; }
.vn-step__sum::-webkit-details-marker { display: none; }
.vn-step__n { display: grid; place-items: center; inline-size: 2.1rem; block-size: 2.1rem; border: 1.5px solid var(--amber); border-radius: 50%; font-family: var(--site-font-head); color: var(--amber-hi); transition: background-color 0.4s, border-color 0.4s, color 0.4s; }
.vn-step__t { font-size: 1.05rem; line-height: 1.3; }
.vn-step__time { padding: 0.25rem 0.7rem; border: 1px solid var(--site-line); border-radius: 2rem; font-size: 0.82rem; color: var(--site-dim); white-space: nowrap; }
.vn-step__b { padding: 0 1.2rem 1.1rem 4.2rem; }
.vn-step__b p { margin: 0; line-height: 1.55; }
.vn-step.is-passed { border-color: rgba(93, 224, 138, 0.5); }
.vn-step.is-passed .vn-step__n { border-color: var(--ok); background: rgba(93, 224, 138, 0.18); color: #d7ffe4; }

@media (max-width: 62rem) {
  .vn-lanes, .vn-sol__cols { grid-template-columns: 1fr; }
}
@media (max-width: 43.75rem) {
  .vn-sit { grid-template-columns: 1fr; }
  .vn-step__sum { grid-template-columns: auto 1fr; }
  .vn-step__time { grid-column: 2; justify-self: start; }
  .vn-step__b { padding-inline-start: 1.2rem; }
  .vn-beacon--top { inset-block-start: 1.6rem; }
}

/* ---------- зеркальные экраны: текст справа, самолет слева (V4, V9) ---------- */
.vn-sec--r .vn-sec__col { margin-inline-start: auto; }
.vn-sec--r .vn-beacon { inset-inline-start: auto; inset-inline-end: calc(100% + var(--bx, 3rem)); }
.vn-defs { position: absolute; inline-size: 0; block-size: 0; overflow: hidden; }

/* ---------- тучи: над самолетом, под текстом; самолет залетает под них ---------- */
.vn-cloud-up { position: absolute; z-index: 2; pointer-events: none; inline-size: calc(var(--s, 1) * 18rem); block-size: calc(var(--s, 1) * 8rem);
  background:
    radial-gradient(closest-side at 28% 55%, rgba(214, 222, 236, 0.2), transparent 72%),
    radial-gradient(closest-side at 55% 42%, rgba(214, 222, 236, 0.26), transparent 70%),
    radial-gradient(closest-side at 78% 58%, rgba(214, 222, 236, 0.18), transparent 74%); }

/* ---------- наземные объекты: под самолетом, он пролетает над ними ---------- */
.vn-obj { position: absolute; z-index: 0; pointer-events: none; display: block; transform: rotate(var(--a, 0deg)); }
svg.vn-obj { inline-size: calc(var(--s, 1) * 6rem); block-size: auto; overflow: visible; }
.vn-obj--tanks { inline-size: calc(var(--s, 1) * 8rem); }
.vn-sh { fill: rgba(0, 0, 0, 0.55); filter: blur(3px); }
.vn-sh2 { stroke: rgba(0, 0, 0, 0.5); stroke-width: 3; filter: blur(2px); }
.vn-sweep { transform-origin: 50px 50px; animation: vn-spin 6s linear infinite; }
.vn-rot { transform-origin: 50px 50px; animation: vn-spin 3.4s linear infinite; }
.vn-blink { animation: vn-blink 1.8s steps(1) infinite; }
@keyframes vn-spin { to { transform: rotate(360deg); } }
@keyframes vn-blink { 0%, 70% { opacity: 1; } 71%, 100% { opacity: 0.15; } }
.vn-obj--turbine { filter: drop-shadow(0.55rem 0.8rem 0.45rem rgba(0, 0, 0, 0.6)); }
.vn-obj--hangar { inline-size: calc(var(--s, 1) * 9rem); block-size: calc(var(--s, 1) * 5.5rem); border-radius: 0.3rem;
  background: repeating-linear-gradient(90deg, #2d3441 0 0.5rem, #252b36 0.5rem 1rem);
  box-shadow: 0.7rem 0.9rem 1.4rem rgba(0, 0, 0, 0.6), inset 0 0 0 1px rgba(255, 255, 255, 0.09), inset 0 0.3rem 0.5rem rgba(255, 255, 255, 0.07); }
.vn-obj--hangar::after { content: ""; position: absolute; inset-block-start: 0.4rem; inset-inline-end: 0.4rem; inline-size: 0.35rem; block-size: 0.35rem; border-radius: 50%; background: #ff3b30; box-shadow: 0 0 0.6rem 0.15rem rgba(255, 59, 48, 0.7); animation: vn-blink 2.2s steps(1) infinite; }
.vn-obj--dc { inline-size: calc(var(--s, 1) * 11rem); block-size: calc(var(--s, 1) * 6.5rem); border-radius: 0.3rem;
  background: radial-gradient(circle, rgba(93, 224, 138, 0.85) 0 0.1rem, transparent 0.14rem) 0 0 / 0.8rem 0.8rem, linear-gradient(180deg, #1d2430, #141922);
  box-shadow: 0.7rem 0.9rem 1.4rem rgba(0, 0, 0, 0.6), 0 0 0 0.3rem rgba(255, 255, 255, 0.04), inset 0 0 0 1px rgba(93, 224, 138, 0.3); animation: vn-led 3.2s ease-in-out infinite; }
@keyframes vn-led { 0%, 100% { filter: brightness(0.8); } 50% { filter: brightness(1.15); } }
.vn-obj--apron { inline-size: calc(var(--s, 1) * 6rem); filter: brightness(0.5) contrast(1.05) drop-shadow(0.4rem 0.6rem 0.4rem rgba(0, 0, 0, 0.6)); }
.vn-apron__img { display: block; inline-size: 100%; block-size: auto; }
.vn-obj--corr { inline-size: calc(var(--s, 1) * 16rem); block-size: 7rem; transform: rotate(var(--a, 0deg)); }
.vn-obj--corr i { position: absolute; inset-inline: 0; block-size: 2px; background: repeating-linear-gradient(90deg, rgba(255, 176, 96, 0.55) 0 0.8rem, transparent 0.8rem 1.6rem); animation: vn-flow 1.6s linear infinite; }
.vn-obj--corr i:nth-child(1) { inset-block-start: 0; }
.vn-obj--corr i:nth-child(2) { inset-block-start: 3rem; opacity: 0.8; }
.vn-obj--corr i:nth-child(3) { inset-block-start: 6rem; opacity: 0.6; }
@keyframes vn-flow { to { background-position: 1.6rem 0; } }
.vn-hmap { display: grid; grid-template-columns: repeat(3, 5rem); gap: 0.9rem; transform: rotate(var(--a, 0deg)); }
.vn-hg { display: block; inline-size: 5rem; block-size: 3.2rem; border-radius: 0.25rem; background: repeating-linear-gradient(90deg, #2b323f 0 0.4rem, #232933 0.4rem 0.8rem); box-shadow: 0.4rem 0.6rem 0.9rem rgba(0, 0, 0, 0.55), inset 0 0 0 1px rgba(255, 255, 255, 0.08); opacity: 0.8; transition: box-shadow 0.4s, opacity 0.4s, background-color 0.4s; }
.vn-hmap[data-active="sales"] .vn-hg[data-k="sales"], .vn-hmap[data-active="support"] .vn-hg[data-k="support"], .vn-hmap[data-active="docs"] .vn-hg[data-k="docs"],
.vn-hmap[data-active="marketing"] .vn-hg[data-k="marketing"], .vn-hmap[data-active="hr"] .vn-hg[data-k="hr"], .vn-hmap[data-active="management"] .vn-hg[data-k="management"] {
  opacity: 1; box-shadow: 0.4rem 0.6rem 0.9rem rgba(0, 0, 0, 0.55), 0 0 1.4rem 0.2rem rgba(255, 176, 96, 0.55), inset 0 0 0 1.5px var(--amber); }

/* ---------- V7. Паспорт ---------- */
.vn-pass { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.2rem; align-items: start; }
.vn-pass__form { display: grid; gap: 0.9rem; }
.vn-fld { display: grid; gap: 0.35rem; }
.vn-fld span { font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--amber); }
.vn-fld__row { display: grid; grid-template-columns: minmax(0, 1fr) 6.5rem; gap: 0.5rem; }
.vn-ef__sub { font-size: 0.86rem; color: var(--site-dim); }
.vn-fld select, .vn-fld input { inline-size: 100%; min-block-size: 3rem; padding: 0 0.9rem; border: 1px solid var(--site-line); border-radius: 0.5rem; background: rgba(12, 15, 20, 0.7); color: var(--site-fg); font: inherit; }
.vn-fld select:focus, .vn-fld input:focus { outline: none; border-color: var(--amber); box-shadow: 0 0 0 3px rgba(255, 176, 96, 0.18); }
.vn-pass__card { position: relative; padding: 1.2rem 1.3rem; border: 1px solid var(--site-line); border-radius: 0.8rem; background: rgba(12, 15, 20, 0.78); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.vn-pass__h { margin: 0 0 0.8rem; font-family: var(--site-font-head); font-size: 1.1rem; letter-spacing: 0.03em; text-transform: uppercase; color: var(--amber-hi); }
.vn-pass__card dl { display: grid; gap: 0.55rem; margin: 0 0 1rem; }
.vn-pass__card dl div { display: grid; grid-template-columns: 7.5rem 1fr; gap: 0.6rem; }
.vn-pass__card dt { color: var(--site-dim); font-size: 0.9rem; }
.vn-pass__card dd { margin: 0; line-height: 1.4; }
.vn-pass__card dd[data-bad="true"] { color: var(--coral); }

/* ---------- V9. Контуры ---------- */
.vn-cts { display: grid; gap: 0.6rem; margin: 0; padding: 0; list-style: none; }
.vn-ct { display: grid; grid-template-columns: 9.5rem 1fr; gap: 0.2rem 1rem; align-items: start; padding: 0.8rem 1rem; border: 1px solid var(--site-line); border-inline-start-width: 4px; border-radius: 0.6rem; }
.vn-ct__st { grid-row: span 2; align-self: center; font-size: 0.8rem; letter-spacing: 0.05em; text-transform: uppercase; }
.vn-ct__n { font-weight: 600; }
.vn-ct__d { color: var(--site-dim); font-size: 0.92rem; }
.vn-ct--ok { border-color: rgba(93, 224, 138, 0.4); background: rgba(93, 224, 138, 0.07); }
.vn-ct--ok .vn-ct__st { color: var(--ok); }
.vn-ct--cond { border-color: rgba(255, 176, 96, 0.45); background: rgba(255, 176, 96, 0.07); }
.vn-ct--cond .vn-ct__st { color: var(--amber); }
.vn-ct--no { border-color: rgba(226, 232, 240, 0.18); background: rgba(226, 232, 240, 0.03); opacity: 0.7; }
.vn-ct--no .vn-ct__st { color: rgba(226, 232, 240, 0.6); }

/* ---------- V10. Модели ---------- */
.vn-facts--first { margin-block-start: 0; }
.vn-lead--tight { margin-block-end: 1rem; }
.vn-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }
.vn-chips li { padding: 0.4rem 0.9rem; border: 1px solid var(--site-line); border-radius: 2rem; background: rgba(12, 15, 20, 0.6); font-size: 0.92rem; }

/* телефон и планшет: самолет поверх текста, но в помеченных экранах (data-under) уходит под него, как под тучи */
.vn-sky.is-under { z-index: 1; }
@media (max-width: 62rem) {
  .vn-pass { grid-template-columns: 1fr; }
  .vn-obj { opacity: 0.55; }
}
@media (max-width: 43.75rem) {
  .vn-obj:not(.vn-cloud-up) { display: none; }
  .vn-cloud-up { inline-size: calc(var(--s, 1) * 11rem); block-size: calc(var(--s, 1) * 5rem); }
  .vn-ct { grid-template-columns: 1fr; }
  .vn-ct__st { grid-row: auto; }
  .vn-pass__card dl div { grid-template-columns: 6.5rem 1fr; }
  .vn-sec--r .vn-beacon { inset-inline-end: 2.6rem; }
}

/* ---------- V11. Цена ---------- */
.vn-panel--table { padding: 0.4rem 0.6rem 0.8rem; overflow-x: auto; }
.vn-table { inline-size: 100%; border-collapse: collapse; font-size: 0.97rem; }
.vn-table th, .vn-table td { padding: 0.85rem 0.8rem; text-align: start; vertical-align: top; border-block-end: 1px solid rgba(255, 176, 96, 0.14); }
.vn-table thead th { font-size: 0.78rem; font-weight: 400; letter-spacing: 0.06em; text-transform: uppercase; color: var(--amber); }
.vn-table tbody th { font-weight: 400; }
.vn-table td { color: var(--site-dim); white-space: nowrap; }
.vn-table td[data-price] { color: var(--site-fg); font-weight: 600; }
.vn-table__n { display: inline-grid; place-items: center; inline-size: 1.7rem; block-size: 1.7rem; margin-inline-end: 0.7rem; border: 1.5px solid var(--amber); border-radius: 50%; font-size: 0.85rem; color: var(--amber-hi); }
.vn-table tfoot th, .vn-table tfoot td { border-block-end: 0; padding-block-start: 1.1rem; color: var(--amber-hi); font-weight: 600; }
.vn-notes { display: grid; gap: 0.4rem; margin: 1rem 0 0; padding: 0; list-style: none; font-size: 0.88rem; color: var(--site-dim); }
.vn-notes li::before { content: "·"; margin-inline-end: 0.5rem; color: var(--amber); }

/* ---------- V12 и V13. Ползунок, карточка расчета ---------- */
.vn-range { inline-size: 100%; accent-color: var(--amber); block-size: 2rem; padding: 0 !important; min-block-size: 0 !important; border: 0 !important; background: none !important; }
.vn-fld b { color: var(--amber-hi); font-weight: 600; letter-spacing: 0; text-transform: none; }
.vn-pass__card dd b { font-family: var(--site-font-head); font-weight: 400; font-size: 1.35rem; color: var(--amber-hi); }
.vn-roi { display: grid; gap: 0.8rem; margin: 0 0 1.2rem; padding: 0; list-style: none; }
.vn-roi li { display: grid; grid-template-columns: auto 1fr; gap: 1rem; padding: 0.9rem 1.1rem; border: 1px solid var(--site-line); border-radius: 0.7rem; background: rgba(12, 15, 20, 0.6); }
.vn-roi__n { display: grid; place-items: center; inline-size: 2rem; block-size: 2rem; border: 1.5px solid var(--amber); border-radius: 50%; font-family: var(--site-font-head); color: var(--amber-hi); }
.vn-roi__t { margin: 0 0 0.25rem; font-size: 1.02rem; font-weight: 600; }
.vn-roi li p { margin: 0; color: var(--site-dim); line-height: 1.5; font-size: 0.95rem; }
.vn-roi__ex { position: relative; display: grid; gap: 0.8rem; }
.vn-roi__row { display: flex; justify-content: space-between; gap: 1rem; margin: 0; }
.vn-roi__row b { color: var(--amber-hi); }
.vn-roi__res { margin: 0; font-size: 1.1rem; }
.vn-roi__res b { font-family: var(--site-font-head); font-weight: 400; font-size: 1.9rem; color: var(--ok); }
.vn-no__close { margin: 1.2rem 0 0; font-size: 1.05rem; color: var(--amber-hi); }

/* ---------- новые объекты ---------- */
.vn-cloud-up--storm { background:
    radial-gradient(closest-side at 30% 55%, rgba(70, 82, 104, 0.5), transparent 72%),
    radial-gradient(closest-side at 58% 40%, rgba(54, 64, 84, 0.6), transparent 70%),
    radial-gradient(closest-side at 80% 60%, rgba(70, 82, 104, 0.45), transparent 74%); animation: vn-flash 7s steps(1) infinite; }
@keyframes vn-flash { 0%, 91%, 95%, 100% { filter: none; } 92%, 94% { filter: brightness(1.8); } }
.vn-obj--truck { inline-size: calc(var(--s, 1) * 9rem); filter: drop-shadow(0.4rem 0.6rem 0.4rem rgba(0, 0, 0, 0.55)); }
.vn-obj--wind { inline-size: calc(var(--s, 1) * 6rem); }
.vn-sway { transform-origin: 50px 50px; animation: vn-sway 5s ease-in-out infinite alternate; }
@keyframes vn-sway { from { transform: rotate(-14deg); } to { transform: rotate(16deg); } }
.vn-obj--rl { display: flex; gap: 2.2rem; inline-size: auto; }
.vn-obj--rl i { inline-size: 0.5rem; block-size: 0.5rem; border-radius: 50%; background: var(--amber); box-shadow: 0 0 0.9rem 0.25rem rgba(255, 176, 96, 0.7); animation: vn-run 1.8s linear infinite; }
.vn-obj--rl i:nth-child(2) { animation-delay: 0.3s; } .vn-obj--rl i:nth-child(3) { animation-delay: 0.6s; } .vn-obj--rl i:nth-child(4) { animation-delay: 0.9s; } .vn-obj--rl i:nth-child(5) { animation-delay: 1.2s; } .vn-obj--rl i:nth-child(6) { animation-delay: 1.5s; }
@keyframes vn-run { 0%, 60%, 100% { opacity: 0.25; } 20% { opacity: 1; } }
@media (max-width: 43.75rem) {
  .vn-table { font-size: 0.88rem; }
  .vn-table th, .vn-table td { padding: 0.7rem 0.5rem; }
  .vn-table td[data-price] { white-space: normal; }
  .vn-table tbody td:nth-child(2), .vn-table thead th:nth-child(2) { display: none; }
  .vn-table tfoot th { inline-size: auto; }
  .vn-switch { display: flex; flex-direction: column; inline-size: 100%; border-radius: 1.2rem; }
  .vn-switch__b { inline-size: 100%; min-block-size: 2.8rem; }
  .vn-table__n { margin-inline-end: 0.5rem; }
}

/* ---------- V8. Образцы: лист бумаги с пометкой «Пример» ---------- */
.vn-eyebrow { margin: 0 0 0.6rem; font-size: 0.82rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--amber); }
.vn-sm { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); gap: 1.6rem; align-items: start; }
.vn-sheet { position: relative; min-block-size: 14rem; padding: 1.2rem 1.3rem 1.4rem; border-radius: 0.4rem; background: linear-gradient(180deg, #f1eee7, #e3dfd6); color: #1f232b; transform: rotate(-1.2deg); box-shadow: 0.6rem 1rem 1.8rem rgba(0, 0, 0, 0.55); }
.vn-sheet__stamp { position: absolute; inset-block-start: 0.9rem; inset-inline-end: 1rem; padding: 0.15rem 0.6rem; border: 1.5px solid var(--coral); border-radius: 0.3rem; font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--coral); transform: rotate(6deg); }
.vn-sheet__t { margin: 0 0 1rem; padding-inline-end: 5rem; font-family: var(--site-font-head); font-size: 1.05rem; letter-spacing: 0.04em; text-transform: uppercase; color: #1f232b; }
.vn-sheet__bar { display: block; inline-size: var(--w, 80%); block-size: 0.6rem; margin-block: 0.65rem; border-radius: 0.3rem; background: rgba(31, 35, 43, 0.2); }
.vn-sheet__flow { display: flex; flex-wrap: wrap; gap: 0.7rem 1.1rem; align-items: center; margin-block-end: 1rem; }
.vn-sheet__node { position: relative; padding: 0.35rem 0.7rem; border: 1.5px solid #1f232b; border-radius: 0.3rem; font-size: 0.85rem; background: #fff; }
.vn-sheet__node:not(:last-child)::after { content: ""; position: absolute; inset-inline-start: calc(100% + 0.15rem); inset-block-start: 50%; inline-size: 0.8rem; block-size: 1.5px; background: #1f232b; }
.vn-sheet__node--auto { background: #d6f3df; border-color: #1f7a45; }
.vn-sheet__node--check { background: #fde7c9; border-color: #b36a12; }
.vn-sheet__node--hand { background: #e5e7eb; border-color: #5a6270; }
.vn-sheet__kv { display: grid; gap: 0; margin: 0; }
.vn-sheet__kv div { display: grid; grid-template-columns: 7.5rem 1fr; gap: 0.6rem; padding: 0.5rem 0; border-block-end: 1px solid rgba(31, 35, 43, 0.18); }
.vn-sheet__kv dt { font-size: 0.82rem; color: #5a6270; }
.vn-sheet__kv dd { margin: 0; font-weight: 600; }
.vn-sheet__chart { position: relative; display: flex; align-items: flex-end; gap: 0.7rem; block-size: 7.5rem; padding-block-end: 1.2rem; border-block-end: 1.5px solid #1f232b; }
.vn-sheet__chart span { position: relative; flex: 1; block-size: var(--h); border-radius: 0.2rem 0.2rem 0 0; background: #b36a12; }
.vn-sheet__chart em { position: absolute; inset-inline: 0; inset-block-end: -1.2rem; font-size: 0.78rem; font-style: normal; text-align: center; color: #5a6270; }
.vn-sheet__thr { position: absolute; inset-inline: 0; inset-block-end: calc(40% * 0.84 + 1.2rem); border-block-start: 1.5px dashed #c0392b; }
.vn-sheet__thr b { position: absolute; inset-inline-end: 0; inset-block-end: 0.15rem; font-size: 0.75rem; font-weight: 400; color: #c0392b; }
.vn-sheet__cap { margin: 0.6rem 0 0; font-size: 0.8rem; color: #5a6270; }
.vn-sheet__res { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.6rem; margin-block-end: 1rem; }
.vn-sheet__res span { display: grid; gap: 0.1rem; padding: 0.6rem; border: 1.5px solid #1f232b; border-radius: 0.3rem; background: #fff; font-size: 0.78rem; }
.vn-sheet__res b { font-family: var(--site-font-head); font-weight: 400; font-size: 1.7rem; }
.vn-sheet__res .is-ok { background: #d6f3df; border-color: #1f7a45; }

/* ---------- V15. Кейсы ---------- */
.vn-slots { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.8rem; margin-block-end: 0.4rem; }
.vn-slot { display: grid; place-items: center; min-block-size: 7rem; padding: 1rem; border: 1.5px dashed rgba(255, 176, 96, 0.4); border-radius: 0.7rem; background: rgba(12, 15, 20, 0.5); text-align: center; color: var(--site-dim); font-size: 0.92rem; }
.vn-actions--top { margin-block-start: 1.4rem; }
.vn-sec__col > .vn-beacon { inset-block-start: 40%; }

/* ---------- V17. Карточки после запуска, V18. Смежные услуги ---------- */
.vn-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.8rem; margin: 0; padding: 0; list-style: none; }
.vn-card2 { padding: 1.2rem 1.3rem; border: 1px solid var(--site-line); border-radius: 0.8rem; background: rgba(12, 15, 20, 0.72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.vn-card2 h3 { margin: 0 0 0.4rem; font-family: var(--site-font-head); font-weight: 400; font-size: 1.1rem; letter-spacing: 0.03em; text-transform: uppercase; color: var(--amber-hi); }
.vn-card2 p { margin: 0; line-height: 1.5; color: var(--site-dim); font-size: 0.95rem; }
.vn-card2__a { display: inline-flex; align-items: center; min-block-size: 2.75rem; margin-block-start: 0.2rem; color: var(--amber); text-decoration: underline; text-underline-offset: 0.2em; font-size: 0.92rem; }
.vn-card2__a:hover { color: var(--amber-hi); }
.vn-rel { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.8rem; margin: 0; padding: 0; list-style: none; }
.vn-rel a { display: grid; gap: 0.4rem; align-content: start; block-size: 100%; padding: 1.2rem 1.3rem; border: 1px solid var(--site-line); border-radius: 0.8rem; background: rgba(12, 15, 20, 0.72); text-decoration: none; color: var(--site-fg); transition: border-color 0.25s, transform 0.25s; }
.vn-rel a:hover { border-color: var(--amber); transform: translateY(-3px); }
.vn-rel h3 { margin: 0; font-family: var(--site-font-head); font-weight: 400; font-size: 1.1rem; letter-spacing: 0.03em; text-transform: uppercase; color: var(--amber-hi); }
.vn-rel span { color: var(--site-dim); font-size: 0.95rem; line-height: 1.45; }
.vn-rel em { font-style: normal; font-size: 0.88rem; color: var(--amber); }

/* ---------- V16 и V19. Команда и вопросы на общих блоках ---------- */
.vn #team .site-team { margin-block-start: 1.6rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }   /* восемь карточек: две строки по четыре */
@media (max-width: 62rem) { .vn #team .site-team { grid-template-columns: repeat(auto-fill, minmax(min(100%, 13.5rem), 1fr)); } }
.vn #faq .site-faq { margin-block-start: 1rem; }

/* ---------- V20. Финал и посадка ---------- */
.vn-end { padding-block: 2rem 6rem; min-block-size: 36rem; }
.vn-end__rw { position: absolute; inset-block: 0; inset-inline-end: 7%; inline-size: clamp(10rem, 27vw, 24rem); overflow: hidden; z-index: 0; pointer-events: none;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 12%, #000 88%, transparent 100%), linear-gradient(to right, transparent 0, #000 22%, #000 78%, transparent 100%); -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to bottom, transparent 0, #000 12%, #000 88%, transparent 100%), linear-gradient(to right, transparent 0, #000 22%, #000 78%, transparent 100%); mask-composite: intersect; }
.vn-end__rwi { position: absolute; inset-block-start: 40%; inline-size: 100%; block-size: 1px; }
.vn-end__rw .vn-runway__img { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; object-fit: cover; object-position: 50% 0; opacity: 0.92; }
.vn-ticks { display: grid; gap: 0.6rem; margin: 0 0 1.5rem; padding: 0; list-style: none; }
.vn-ticks li { position: relative; padding-inline-start: 1.5rem; line-height: 1.45; }
.vn-ticks li::before { content: ""; position: absolute; inset-inline-start: 0; inset-block-start: 0.5em; inline-size: 0.5rem; block-size: 0.5rem; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0.5rem rgba(93, 224, 138, 0.7); }
.vn-nums { display: flex; flex-wrap: wrap; gap: 0.6rem 1.8rem; margin: 1.8rem 0 0; padding: 0; list-style: none; font-family: var(--site-font-head); font-size: 1.25rem; color: var(--amber-hi); }

@media (max-width: 62rem) {
  .vn-sm { grid-template-columns: 1fr; }
  .vn-rel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 43.75rem) {
  .vn-slots, .vn-cards, .vn-rel { grid-template-columns: 1fr; }
  .vn-sheet__kv div { grid-template-columns: 6rem 1fr; }
  .vn-end__rw { inline-size: 46vw; inset-inline-end: -4%; opacity: 0.5; }
  .vn-crowd { grid-template-columns: repeat(10, minmax(0, 1fr)); max-inline-size: 13rem; }
}

/* ---------- Крупные процессы: точки-люди и грузовой терминал ---------- */
.vn-big { position: relative; display: grid; gap: 0.9rem; }
.vn-big .site-btn { justify-self: start; }
.vn-crowd { display: grid; grid-template-columns: repeat(25, minmax(0, 1fr)); gap: 0.3rem; max-inline-size: 32rem; }
.vn-crowd i { display: block; aspect-ratio: 1; border-radius: 50%; background: rgba(226, 232, 240, 0.28); transition: background-color 0.35s, box-shadow 0.35s, transform 0.35s; }
.vn-crowd i.is-free { background: var(--ok); box-shadow: 0 0 0.5rem rgba(93, 224, 138, 0.7); transform: scale(1.1); }
.vn-big__res { margin: 0; font-size: 1.1rem; }
.vn-big__res b { font-family: var(--site-font-head); font-weight: 400; font-size: 1.9rem; color: var(--ok); }
.vn-obj--cargo { display: grid; grid-template-columns: repeat(4, 2.2rem); gap: 0.35rem; transform: rotate(var(--a, 0deg)); }
.vn-obj--cargo i { display: block; inline-size: 2.2rem; block-size: 1.2rem; border-radius: 0.15rem; background: linear-gradient(180deg, #3a4252, #262c38); box-shadow: 0.25rem 0.35rem 0.5rem rgba(0, 0, 0, 0.55), inset 0 0 0 1px rgba(255, 255, 255, 0.1); }
.vn-obj--cargo i:nth-child(3n) { background: linear-gradient(180deg, #8a5a22, #5e3c14); }
.vn-obj--cargo i:nth-child(5n) { background: linear-gradient(180deg, #2f6b4a, #1f4a33); }

@media (prefers-reduced-motion: reduce) {
  .vn-rise { animation: none; }
  .vn-plane__nav--t, .vn-plane__nav--b { animation: none; opacity: 1; }
  .vn-cloud-up--storm, .vn-sway, .vn-obj--rl i, .vn-sweep, .vn-rot, .vn-blink, .vn-obj--dc, .vn-obj--corr i, .vn-obj--hangar::after { animation: none; }
}
}