/* ==========================================================================
   LUMINOUS BUSINESS FIELD · СВЕТЛИННО БИЗНЕС ПОЛЕ — само /business-solutions/
   ==========================================================================

   ЗАЩО ОТДЕЛЕН ФАЙЛ
   Зарежда се САМО от входната страница (`core/business_solutions.html`).
   Всички правила са под `.page-business-gateway` — класът стои само на нейния
   `<body>`. Страниците на направленията зареждат business-solutions.css, но
   НЕ този файл, и не получават нито полето, нито светлия hero.

   КАКВО ПРАВИ (подробно: LUMINOUS-BUSINESS-FIELD-SPEC.md)
     1. Токени — изведени от гамата в styles.css, не нова палитра
     2. Повърхността на страницата
     3. Полето: порцелан, топография, вълна, сцени, лещи
     4. Светлият hero и командната конзола
     5. Signal Spine: мостът и маркерите на сцените
     6. Сцените 02–07 върху полето (тихи зони, конзоли, входни карти)
     7. Телефон — по-малко слоеве, не свит десктоп
     8. Скрит таб и намалено движение

   ⚠️ ПРОИЗВОДИТЕЛНОСТ. Движи се само `transform` и `opacity`; безкрайните
   движения са най-много три (дрейф на полето, една леща, един пакет в
   hero-то) и всички спират на скрит таб. Без `filter: blur` върху големи
   площи, без глобален `will-change`, без canvas/WebGL/видео.

   ⚠️ БЕЗ ИНЛАЙН СТИЛОВЕ — CSP е `style-src: self`.
   ========================================================================== */


/* ---------- 1. Токени ------------------------------------------------------ */

.page-business-gateway {
    /* Основа: порцеланово бяло, топло бяло, лавандулово-сиво, ледено-сиво. */
    --gw-porcelain: #fbfbfd;
    --gw-warm: #fcfbf8;
    --gw-lavender: #f4f2fc;
    --gw-ice: #eef3fa;
    /* Мастило: най-тъмното е --color-navy (#1e1b3a), изтеглено към синьо-черно. */
    --gw-ink: #15142b;
    --gw-ink-soft: #3b3857;
    --gw-muted: #5f5c7a;
    /* Сигнали: индиго и виолетово от марката; циан само в дигиталното,
       кехлибар само при срок в застраховането. Тук са по-тъмни варианти на
       --bs-cy / --bs-amb, защото стоят върху светло, не върху мастило. */
    --gw-indigo: #4f46e5;
    --gw-violet: #7c3aed;
    --gw-cyan: #1aa6d6;
    --gw-amber: #e39a2d;
    /* Инструментите (тъмните повърхности). */
    --gw-console: linear-gradient(158deg, #1d1a38 0%, #15132d 50%, #0f0d22 100%);
    --gw-console-edge: rgba(196, 181, 253, 0.28);
    --gw-console-depth: 0 1px 0 rgba(255, 255, 255, 0.06) inset,
                        0 44px 80px -40px rgba(21, 20, 43, 0.55),
                        0 18px 40px -26px rgba(49, 40, 140, 0.4);
    --gw-quiet: 251, 251, 253;
    --gw-field-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --gw-scene: 1.4s;
}


/* ---------- 2. Повърхността ----------------------------------------------- */

/* ⚠️ ФОНЪТ Е НА `body`, НЕ НА `html`. Така браузърът го пренася върху
   платното (най-долния слой) и полето с `z-index: -1` застава НАД него.
   Фон на `html` би бил нарисуван като фон на кутията на `body` — върху полето. */
body.page-business-gateway { background-color: #fbfbfd; }

.page-business-gateway .bs-band-field { background: transparent; }
/* Хоризонтално се реже (без хоризонтален скрол), вертикално не — маркерите
   на Signal Spine излизат нагоре в предишната сцена, без шев. */
.page-business-gateway .bs-scene { overflow: clip visible; }


/* ---------- 3. Полето ------------------------------------------------------ */

.page-business-gateway .bs-global-field {
    position: fixed;
    inset: 0;
    z-index: -1;
    overflow: hidden;
    pointer-events: none;
    /* Нищо вътре не влияе на подредбата или рисуването на страницата. */
    contain: strict;
}

/* СЛОЙ 1 — порцелановата повърхност: мека дълбочина, не чисто бяло. */
.page-business-gateway .bsf-porcelain {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(58% 52% at 74% 36%, rgba(241, 238, 252, 0.95) 0%, rgba(241, 238, 252, 0) 72%),
        radial-gradient(55% 60% at 10% 90%, rgba(232, 240, 250, 0.9) 0%, rgba(232, 240, 250, 0) 72%),
        radial-gradient(70% 60% at 38% 18%, rgba(252, 251, 248, 1) 0%, rgba(252, 251, 248, 0) 70%),
        linear-gradient(170deg, #fcfcfe 0%, #f7f6fc 48%, #f1f3fa 100%);
}

/* СЛОЙ 2 — топографията.
   ⚠️ Контурите са с `vector-effect: non-scaling-stroke`: при `slice` мащабът
   се мени с екрана, а линията трябва да остане 1px. Прозрачността идва от
   променливи, за да може яркото копие на вълната (`<use>`) да я усили —
   CSS правилата не стигат вътре в клонирано `<use>` съдържание, а
   наследените променливи стигат. */
.page-business-gateway .bsf-topo {
    position: absolute;
    left: -3%;
    top: -3%;
    width: 106%;
    height: 106%;
    overflow: visible;
}
.page-business-gateway .bsf-c {
    fill: none;
    stroke: var(--bsf-ink, #4f46e5);
    stroke-opacity: calc(var(--bsf-a, 0.14) * var(--bsf-gain, 1));
    stroke-width: var(--bsf-w, 1);
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
}
.page-business-gateway .bsf-c1 { --bsf-a: 0.1; }
.page-business-gateway .bsf-c2 { --bsf-a: 0.15; }
.page-business-gateway .bsf-c3 { --bsf-a: 0.21; }
.page-business-gateway .bsf-strong { --bsf-ink: #7c3aed; --bsf-a: 0.3; --bsf-w: 1.3; }
.page-business-gateway .bsf-nodes circle { fill: #7c3aed; fill-opacity: 0.42; }

/* Дрейфът — изключително бавен, пинг-понг (`alternate`), затова никога не
   „започва отначало“ видимо. Движи се SVG-то като кутия → композитор. */
.page-business-gateway .bsf-topo-base {
    transform-origin: 64% 50%;
    animation: bsf-drift 28s var(--gw-field-ease) infinite alternate;
    transition: opacity var(--gw-scene) ease;
}
@keyframes bsf-drift {
    from { transform: translate3d(0, 0, 0) scale(1) rotate(0deg); }
    to   { transform: translate3d(-1.2%, 0.9%, 0) scale(1.035) rotate(-0.6deg); }
}

/* ВЪЛНАТА (0,15–1,1 s, веднъж): прозорец 40% от ширината, който минава
   отляво надясно; вътре яркото копие е изместено обратно и остава на място.
   Числата по-долу са сметнати: 40% прозорец, 106% поле → 265%/37.7%/94.3%. */
.page-business-gateway .bsf-wave {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 40%;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 42%, #000 58%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0%, #000 42%, #000 58%, transparent 100%);
    transform: translateX(250%);
    animation: bsf-wave-window 0.95s cubic-bezier(0.45, 0.05, 0.3, 1) 0.15s backwards;
}
.page-business-gateway .bsf-topo-bright {
    left: -7.5%;
    width: 265%;
    transform: translateX(-94.3%);
    animation: bsf-wave-content 0.95s cubic-bezier(0.45, 0.05, 0.3, 1) 0.15s backwards;
}
/* ⚠️ Клонираното `<use>` съдържание НЕ получава класовите правила по-горе
   (Chrome) — само атрибутите от шаблона (`fill="none"`,
   `stroke="currentColor"`) и наследените свойства на самия `<use>`. */
.page-business-gateway .bsf-topo-bright use {
    color: #6d5df6;
    stroke-opacity: 0.5;
    stroke-width: 1.4;
}
@keyframes bsf-wave-window { from { transform: translateX(-100%); } }
@keyframes bsf-wave-content { from { transform: translateX(37.7%); } }

/* СЦЕНИТЕ — видима е само геометрията на текущия режим. Смяната е
   кръстосано избледняване на целия SVG (композитор); неактивните са
   `visibility: hidden` и не се рисуват изобщо. */
.page-business-gateway .bsf-scene {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--gw-scene) ease, visibility 0s linear var(--gw-scene);
}
.page-business-gateway [data-bs-field-mode="directions"] .bsf-scene-directions,
.page-business-gateway [data-bs-field-mode="navigator"] .bsf-scene-navigator,
.page-business-gateway [data-bs-field-mode="digital"] .bsf-scene-digital,
.page-business-gateway [data-bs-field-mode="eu"] .bsf-scene-eu,
.page-business-gateway [data-bs-field-mode="insurance"] .bsf-scene-insurance,
.page-business-gateway [data-bs-field-mode="contact"] .bsf-scene-contact {
    opacity: 1;
    visibility: visible;
    transition: opacity var(--gw-scene) ease, visibility 0s;
}
/* Когато сцената има собствена геометрия, общите контури отстъпват. */
.page-business-gateway [data-bs-field-mode="digital"] .bsf-topo-base,
.page-business-gateway [data-bs-field-mode="eu"] .bsf-topo-base,
.page-business-gateway [data-bs-field-mode="insurance"] .bsf-topo-base { opacity: 0.45; }
.page-business-gateway [data-bs-field-mode="navigator"] .bsf-topo-base,
.page-business-gateway [data-bs-field-mode="contact"] .bsf-topo-base { opacity: 0.7; }

.page-business-gateway .bsf-scene path,
.page-business-gateway .bsf-scene ellipse,
.page-business-gateway .bsf-scene rect,
.page-business-gateway .bsf-converge-ring {
    fill: none;
    vector-effect: non-scaling-stroke;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.page-business-gateway .bsf-route {
    stroke: #6d5df6;
    stroke-opacity: 0.32;
    stroke-width: 1.3;
    transition: stroke-opacity 0.5s ease, stroke-width 0.5s ease;
}
.page-business-gateway .bsf-scene .bsf-node { fill: #7c3aed; fill-opacity: 0.55; transition: fill-opacity 0.5s ease; }

/* 02 — ствол (връзката с ядрото) и четири маршрута към картите. */
.page-business-gateway .bsf-trunk { stroke-dasharray: 2 7; stroke-opacity: 0.4; }
.page-business-gateway [data-bsf-focus] .bsf-scene-directions .bsf-route:not(.bsf-trunk) { stroke-opacity: 0.1; }
.page-business-gateway [data-bsf-focus] .bsf-scene-directions .bsf-node { fill-opacity: 0.2; }
.page-business-gateway [data-bsf-focus="accounting"] .bsf-scene-directions .bsf-r-accounting,
.page-business-gateway [data-bsf-focus="digital"] .bsf-scene-directions .bsf-r-digital,
.page-business-gateway [data-bsf-focus="eu"] .bsf-scene-directions .bsf-r-eu,
.page-business-gateway [data-bsf-focus="insurance"] .bsf-scene-directions .bsf-r-insurance {
    stroke-opacity: 0.78;
    stroke-width: 2;
    fill-opacity: 1;
}

/* 03 — маршрутизиране към конзолата; изборът подчертава своя вход. */
.page-business-gateway [data-bsf-nav] .bsf-scene-navigator .bsf-route { stroke-opacity: 0.12; }
.page-business-gateway [data-bsf-nav="1"] .bsf-scene-navigator .bsf-n-1,
.page-business-gateway [data-bsf-nav="2"] .bsf-scene-navigator .bsf-n-2,
.page-business-gateway [data-bsf-nav="3"] .bsf-scene-navigator .bsf-n-3,
.page-business-gateway [data-bsf-nav="4"] .bsf-scene-navigator .bsf-n-4,
.page-business-gateway [data-bsf-nav] .bsf-scene-navigator .bsf-n-out {
    stroke-opacity: 0.62;
    stroke-width: 1.9;
}

/* 04 — пътища за данни. Циан само като акцент: една лента и възлите. */
.page-business-gateway .bsf-lane { stroke: #4f46e5; stroke-opacity: 0.2; stroke-width: 1.25; }
.page-business-gateway .bsf-lane:nth-child(2) { stroke: var(--gw-cyan); stroke-opacity: 0.36; }
.page-business-gateway .bsf-lane-faint { stroke-opacity: 0.11; }
.page-business-gateway .bsf-scene .bsf-node-cy { fill: var(--gw-cyan); fill-opacity: 0.8; }

/* 05 — възходящ път с етапи. */
.page-business-gateway .bsf-rise { stroke: #7c3aed; stroke-opacity: 0.34; stroke-width: 1.4; }
.page-business-gateway .bsf-rise-soft { stroke-opacity: 0.15; }
.page-business-gateway .bsf-scene .bsf-milestone { fill: #fff; fill-opacity: 1; stroke: #7c3aed; stroke-width: 1.6; vector-effect: non-scaling-stroke; }

/* 06 — пръстени на покритието; една кехлибарена точка, не мигаща. */
.page-business-gateway .bsf-coverage { stroke: #7c3aed; stroke-opacity: 0.22; stroke-width: 1.2; stroke-dasharray: 3 6; }
.page-business-gateway .bsf-coverage-faint { stroke-opacity: 0.12; }
.page-business-gateway .bsf-orbit { stroke: #4f46e5; stroke-opacity: 0.2; stroke-width: 1.2; }
.page-business-gateway .bsf-asset { stroke: #7c3aed; stroke-opacity: 0.4; stroke-width: 1.2; }
.page-business-gateway .bsf-scene .bsf-node-amb { fill: var(--gw-amber); fill-opacity: 0.95; }

/* 07 — четирите маршрута се събират в една точка. */
.page-business-gateway .bsf-converge { stroke-opacity: 0.3; }
.page-business-gateway .bsf-converge-ring { stroke: #7c3aed; stroke-opacity: 0.3; stroke-width: 1.2; }
.page-business-gateway .bsf-scene .bsf-point { fill: #7c3aed; fill-opacity: 0.9; }
/* Контактът е най-спокойната сцена — полето спира да се движи. */
.page-business-gateway [data-bs-field-mode="contact"] .bsf-topo-base,
.page-business-gateway [data-bs-field-mode="contact"] .bsf-lens > i { animation-play-state: paused; }

/* СЛОЙ 3 — светлинните лещи. Градиент + маска на тънък призматичен пръстен;
   без `filter: blur`. Позицията за режима е в `--lx/--ly` и се сменя с
   преход на `transform`; дрейфът е на вътрешния елемент, за да не спорят. */
.page-business-gateway .bsf-lens {
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 50%;
    transform: translate3d(calc(var(--lx) - 50%), calc(var(--ly) - 50%), 0);
    transition: transform 2.6s var(--gw-field-ease), opacity 1.6s ease;
}
.page-business-gateway .bsf-lens > i {
    position: absolute;
    inset: 0;
    border-radius: 50%;
}
.page-business-gateway .bsf-lens > i::before,
.page-business-gateway .bsf-lens > i::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    -webkit-mask-image: radial-gradient(closest-side, transparent 0 87%, #000 88.5%, #000 90.5%, transparent 92%);
    mask-image: radial-gradient(closest-side, transparent 0 87%, #000 88.5%, #000 90.5%, transparent 92%);
}
.page-business-gateway .bsf-lens > i::before { inset: 0; }
.page-business-gateway .bsf-lens > i::after { inset: 13%; opacity: 0.6; }

.page-business-gateway .bsf-lens-violet { width: 62vmax; height: 62vmax; --lx: 72vw; --ly: 40vh; }
.page-business-gateway .bsf-lens-violet > i {
    background: radial-gradient(closest-side, rgba(124, 58, 237, 0.11) 0%, rgba(124, 58, 237, 0.045) 48%, rgba(124, 58, 237, 0) 72%);
    animation: bsf-lens-drift 32s ease-in-out infinite alternate;
}
.page-business-gateway .bsf-lens-violet > i::before {
    background: conic-gradient(from 200deg, transparent 0 6%, rgba(79, 70, 229, 0.3) 14%, rgba(167, 139, 250, 0.36) 22%, rgba(91, 208, 245, 0.2) 30%, transparent 40% 100%);
}
.page-business-gateway .bsf-lens-violet > i::after {
    background: conic-gradient(from 20deg, transparent 0 8%, rgba(124, 58, 237, 0.22) 18%, rgba(79, 70, 229, 0.14) 26%, transparent 36% 100%);
}
.page-business-gateway .bsf-lens-ice { width: 50vmax; height: 50vmax; --lx: 10vw; --ly: 90vh; }
.page-business-gateway .bsf-lens-ice > i {
    background: radial-gradient(closest-side, rgba(56, 189, 248, 0.1) 0%, rgba(56, 189, 248, 0.04) 50%, rgba(56, 189, 248, 0) 72%);
}
.page-business-gateway .bsf-lens-ice > i::before {
    background: conic-gradient(from 120deg, transparent 0 10%, rgba(56, 189, 248, 0.26) 20%, rgba(129, 140, 248, 0.2) 30%, transparent 42% 100%);
}
.page-business-gateway .bsf-lens-amber { width: 40vmax; height: 40vmax; --lx: 34vw; --ly: 56vh; opacity: 0; }
.page-business-gateway .bsf-lens-amber > i {
    background: radial-gradient(closest-side, rgba(227, 154, 45, 0.12) 0%, rgba(227, 154, 45, 0.04) 50%, rgba(227, 154, 45, 0) 72%);
}
.page-business-gateway .bsf-lens-amber > i::before {
    background: conic-gradient(from 300deg, transparent 0 12%, rgba(227, 154, 45, 0.3) 22%, transparent 34% 100%);
}
@keyframes bsf-lens-drift {
    to { transform: translate3d(3%, -2.5%, 0) rotate(10deg) scale(1.04); }
}

/* Лещите по режими — далеч от дългите текстове, до съответния инструмент. */
.page-business-gateway [data-bs-field-mode="directions"] .bsf-lens-violet { --lx: 16vw; --ly: 28vh; }
.page-business-gateway [data-bs-field-mode="directions"] .bsf-lens-ice    { --lx: 88vw; --ly: 76vh; }
.page-business-gateway [data-bs-field-mode="navigator"] .bsf-lens-violet { --lx: 8vw;  --ly: 52vh; }
.page-business-gateway [data-bs-field-mode="navigator"] .bsf-lens-ice    { --lx: 94vw; --ly: 36vh; }
.page-business-gateway [data-bs-field-mode="digital"] .bsf-lens-violet   { --lx: 12vw; --ly: 84vh; }
.page-business-gateway [data-bs-field-mode="digital"] .bsf-lens-ice      { --lx: 82vw; --ly: 22vh; }
.page-business-gateway [data-bs-field-mode="eu"] .bsf-lens-violet        { --lx: 80vw; --ly: 16vh; }
.page-business-gateway [data-bs-field-mode="eu"] .bsf-lens-ice           { --lx: 10vw; --ly: 92vh; }
.page-business-gateway [data-bs-field-mode="insurance"] .bsf-lens-violet { --lx: 88vw; --ly: 26vh; }
.page-business-gateway [data-bs-field-mode="insurance"] .bsf-lens-ice    { --lx: 18vw; --ly: 16vh; opacity: 0.4; }
.page-business-gateway [data-bs-field-mode="insurance"] .bsf-lens-amber  { opacity: 1; }
.page-business-gateway [data-bs-field-mode="contact"] .bsf-lens-violet   { --lx: 60vw; --ly: 58vh; }
.page-business-gateway [data-bs-field-mode="contact"] .bsf-lens-ice      { --lx: 16vw; --ly: 24vh; }


/* ---------- 4. Светлият hero и командната конзола ------------------------ */

.page-business-gateway .bs-hero {
    background: transparent;
    color: var(--gw-ink);
    border-radius: 0;
    overflow: clip visible;
    padding: clamp(2.25rem, 1.2rem + 3vw, 4rem) 0 clamp(4.75rem, 2.5rem + 6vw, 7.5rem);
}
/* Текстът е НАД геометрията около ядрото (иначе пръстените минават през
   заглавието), а тихата зона зад него е част от полето, не бяла карта. */
.page-business-gateway .bs-hero-copy {
    position: relative;
    z-index: 2;
}
.page-business-gateway .bs-hero-copy::before {
    content: "";
    position: absolute;
    inset: -3.5rem -5rem -3rem -7rem;
    z-index: -1;
    border-radius: 50%;
    background: radial-gradient(closest-side, rgba(var(--gw-quiet), 0.94) 38%, rgba(var(--gw-quiet), 0.6) 66%, rgba(var(--gw-quiet), 0) 100%);
    pointer-events: none;
}
.page-business-gateway .bs-eyebrow {
    border: 1px solid rgba(124, 58, 237, 0.16);
    background: rgba(239, 237, 253, 0.92);
    color: var(--color-primary-dark);
}
.page-business-gateway .bs-h1 { color: var(--gw-ink); }
.page-business-gateway .bs-lume {
    background: linear-gradient(96deg, #4f46e5 0%, #7c3aed 58%, #9b5cf2 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.page-business-gateway .bs-hero-sub { color: var(--gw-ink-soft); }
.page-business-gateway .bs-hero .bs-btn-ghost {
    border-color: rgba(21, 20, 43, 0.22);
    background: rgba(255, 255, 255, 0.6);
    color: var(--gw-ink);
}
.page-business-gateway .bs-hero .bs-btn-ghost:hover { border-color: rgba(21, 20, 43, 0.5); background: #fff; }
.page-business-gateway .bs-hero-trust { color: var(--gw-muted); }

/* Колоната на схемата: пръстените зад конзолата, конзолата отгоре. */
.page-business-gateway .bs-hero-visual {
    position: relative;
    display: grid;
    isolation: isolate;
}
.page-business-gateway .bs-core-field {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 1600px;
    height: 1100px;
    translate: -50% -50%;
    z-index: -1;
    overflow: visible;
    pointer-events: none;
    -webkit-mask-image: radial-gradient(closest-side, #000 50%, transparent 100%);
    mask-image: radial-gradient(closest-side, #000 50%, transparent 100%);
    /* Полето „се събира“ около ядрото: 0,5–1,4 s. */
    animation: bsf-gather 0.9s cubic-bezier(0.2, 0.7, 0.2, 1) 0.5s backwards;
}
@keyframes bsf-gather { from { opacity: 0; transform: scale(1.14); } }
.page-business-gateway .bsf-ring { fill: none; stroke: #6d5df6; stroke-width: 1; }
.page-business-gateway .bsf-ring-1 { stroke-opacity: 0.3; }
.page-business-gateway .bsf-ring-2 { stroke-opacity: 0.25; }
.page-business-gateway .bsf-ring-3 { stroke-opacity: 0.21; }
.page-business-gateway .bsf-ring-4 { stroke-opacity: 0.17; }
.page-business-gateway .bsf-ring-5 { stroke-opacity: 0.13; }
.page-business-gateway .bsf-ring-6 { stroke-opacity: 0.09; }
/* Четирите посоки се виждат още преди въведението — бледо. */
.page-business-gateway .bsf-cr { fill: none; stroke: #7c3aed; stroke-opacity: 0.16; stroke-width: 1.2; stroke-linecap: round; }
/* 0,9–1,8 s: маршрутите се активират; 1,8–2,6 s: успокояват се. */
.page-business-gateway .bsf-crl {
    fill: none;
    stroke: #6d5df6;
    stroke-opacity: 0.28;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-dasharray: 100;
    stroke-dashoffset: 0;
    animation: bsf-route-live 1.6s cubic-bezier(0.3, 0.6, 0.2, 1) backwards;
}
.page-business-gateway .bsf-crl-1 { animation-delay: 0.9s; }
.page-business-gateway .bsf-crl-2 { animation-delay: 1.05s; }
.page-business-gateway .bsf-crl-3 { animation-delay: 1.2s; }
.page-business-gateway .bsf-crl-4 { animation-delay: 1.35s; }
@keyframes bsf-route-live {
    0%   { stroke-dashoffset: 100; stroke-opacity: 0.7; }
    45%  { stroke-dashoffset: 0;   stroke-opacity: 0.7; }
    100% { stroke-dashoffset: 0;   stroke-opacity: 0.28; }
}
/* Един пакет данни от време на време (9 s цикъл, пътува ~1,6 s). САМО в
   режим hero — при друг режим анимацията изобщо не тече. */
.page-business-gateway .bsf-packet {
    fill: none;
    stroke: #7c3aed;
    stroke-width: 2.6;
    stroke-linecap: round;
    stroke-dasharray: 5 95;
    stroke-dashoffset: 5;
    opacity: 0;
}
.page-business-gateway .bs-global-field[data-bs-field-mode="hero"] ~ .bs-hero .bsf-packet {
    animation: bsf-packet 9s linear 3s infinite;
}
@keyframes bsf-packet {
    0%        { stroke-dashoffset: 5;   opacity: 0; }
    3%        { opacity: 0.9; }
    17%       { stroke-dashoffset: -95; opacity: 0.9; }
    19%, 100% { stroke-dashoffset: -95; opacity: 0; }
}

/* Пречупената светлина около конзолата: мести се с показалеца най-много
   ~10px, само `transform` (композитор). Без показалец стои в центъра. */
.page-business-gateway .bs-refract {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 0;
    width: calc(100% + 8rem);
    aspect-ratio: 1;
    translate: -50% -50%;
    border-radius: 50%;
    pointer-events: none;
    opacity: 0.6;
    background: conic-gradient(from 210deg, transparent 0 9%, rgba(124, 58, 237, 0.24) 19%, rgba(91, 208, 245, 0.18) 27%, transparent 37% 58%, rgba(79, 70, 229, 0.18) 70%, transparent 81% 100%);
    -webkit-mask-image: radial-gradient(closest-side, transparent 0 86%, #000 89%, #000 92.5%, transparent 96%);
    mask-image: radial-gradient(closest-side, transparent 0 86%, #000 89%, #000 92.5%, transparent 96%);
    transform: translate3d(calc(var(--bsf-px, 0) * 10px), calc(var(--bsf-py, 0) * 10px), 0);
    transition: transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1);
}

/* Командната конзола — инструмент върху светлата страница. */
.page-business-gateway .bs-console {
    position: relative;
    z-index: 1;
    isolation: isolate;
    overflow: hidden;
    border: 1px solid var(--gw-console-edge);
    border-radius: var(--radius-lg);
    background: var(--gw-console);
    background-clip: padding-box;
    box-shadow: var(--gw-console-depth);
    color: #fff;
}
/* Собствената светлинна логика на конзолата: фина мрежа + два отблясъка. */
.page-business-gateway .bs-console::before,
.page-business-gateway .bs-console::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
}
.page-business-gateway .bs-console::before {
    background-image:
        linear-gradient(to right, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
    background-size: 36px 36px;
    -webkit-mask-image: radial-gradient(80% 70% at 50% 45%, #000 0%, transparent 85%);
    mask-image: radial-gradient(80% 70% at 50% 45%, #000 0%, transparent 85%);
}
.page-business-gateway .bs-console::after {
    background:
        radial-gradient(70% 50% at 84% 0%, rgba(124, 58, 237, 0.34) 0%, rgba(124, 58, 237, 0) 70%),
        radial-gradient(60% 50% at 0% 100%, rgba(79, 70, 229, 0.24) 0%, rgba(79, 70, 229, 0) 70%);
}
.page-business-gateway .bs-console :focus-visible { outline-color: #fff; }

.page-business-gateway .bs-mapwrap { padding: clamp(1rem, 0.55rem + 1.4vw, 1.75rem); }
.page-business-gateway .bs-console-bar {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0 0 var(--space-4);
    padding-bottom: var(--space-3);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.page-business-gateway .bs-console-dots { display: inline-flex; gap: 5px; }
.page-business-gateway .bs-console-dots i { width: 7px; height: 7px; border-radius: 50%; background: rgba(255, 255, 255, 0.2); }
.page-business-gateway .bs-console-dots i:first-child { background: var(--color-accent-soft); }
.page-business-gateway .bs-console .bs-map-caption { margin: 0; color: rgba(255, 255, 255, 0.62); }
.page-business-gateway .bs-console-status {
    margin-left: auto;
    font-size: 0.625rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    white-space: nowrap;
    color: rgba(196, 181, 253, 0.85);
}
.page-business-gateway .bs-console-foot {
    display: flex;
    justify-content: space-between;
    gap: var(--space-3);
    margin: var(--space-4) 0 0;
    padding-top: var(--space-3);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 0.5625rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.32);
}
/* Безкрайните импулси вътре в схемата (V3) тук не текат: сигналът на
   системата е ЕДИН — пакетът по десния маршрут навън, в полето. */
.page-business-gateway .bs-flows { display: none; }

/* Изходящият маршрут — вече върху светло; началото на Signal Spine. */
.page-business-gateway .bs-exit-path { stroke-width: 1.6; }


/* ---------- 5. Signal Spine: мостът и маркерите ---------------------------- */

.page-business-gateway .bs-directions { background: transparent; }
.page-business-gateway .bs-bridge-node {
    position: relative;
    overflow: hidden;
    border-color: rgba(124, 58, 237, 0.24);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 10px 26px -14px rgba(49, 40, 140, 0.45);
    color: var(--gw-ink);
}
.page-business-gateway .bs-bridge-dot { background: var(--gw-violet); box-shadow: 0 0 0 4px rgba(124, 58, 237, 0.16); }
.page-business-gateway .bs-bridge-label { color: var(--gw-ink-soft); }
/* Сигналът стига до моста: светлина минава веднъж през възела. */
.page-business-gateway .bs-bridge-node .bs-spine-pulse {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(167, 139, 250, 0) 0%, rgba(167, 139, 250, 0.45) 50%, rgba(167, 139, 250, 0) 100%);
    transform: translateX(-100%);
    opacity: 0;
}
.page-business-gateway .bs-bridge-node.is-live .bs-spine-pulse { animation: bsf-bridge-sweep 1.1s cubic-bezier(0.4, 0, 0.2, 1); }
@keyframes bsf-bridge-sweep {
    0%   { transform: translateX(-100%); opacity: 1; }
    100% { transform: translateX(100%); opacity: 1; }
}

/* Маркерът на сцена: къс отрязък над въведението, еднаква дебелина, еднакъв
   възел и еднакъв импулс на всяка сцена — затова се чете като ЕДИН маршрут,
   без да е буквално непрекъсната линия. */
.page-business-gateway .bs-intro { position: relative; isolation: isolate; }
.page-business-gateway .bs-spine {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 0.35rem);
    width: 2px;
    height: clamp(3rem, 2rem + 3vw, 4.75rem);
    translate: -50% 0;
    background: linear-gradient(to bottom, rgba(124, 58, 237, 0), rgba(124, 58, 237, 0.4));
    pointer-events: none;
}
.page-business-gateway .bs-spine-node {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 9px;
    height: 9px;
    translate: -50% 50%;
    border: 2px solid var(--gw-violet);
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 5px rgba(124, 58, 237, 0.1);
}
.page-business-gateway .bs-spine .bs-spine-pulse {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 40%;
    background: linear-gradient(to bottom, rgba(124, 58, 237, 0), var(--gw-violet));
    opacity: 0;
}
.page-business-gateway .bs-spine.is-live .bs-spine-pulse { animation: bsf-spine-run 1.1s cubic-bezier(0.4, 0, 0.2, 1); }
.page-business-gateway .bs-spine.is-live .bs-spine-node { animation: bsf-node-hit 0.9s ease 0.75s; }
@keyframes bsf-spine-run {
    0%   { transform: translateY(-40%); opacity: 0; }
    20%  { opacity: 1; }
    85%  { opacity: 1; }
    100% { transform: translateY(250%); opacity: 0; }
}
@keyframes bsf-node-hit {
    40% { background: var(--gw-violet); box-shadow: 0 0 0 9px rgba(124, 58, 237, 0.2); }
}


/* ---------- 6. Сцените върху полето --------------------------------------- */

/* Тихите зони: зад заглавието и водещия абзац полето избледнява мека
   елипса — част от светлината, не бяла карта. */
.page-business-gateway .bs-intro-title { position: relative; color: var(--gw-ink); }
.page-business-gateway .bs-intro-title::before {
    content: "";
    position: absolute;
    inset: -2.5rem -14% -7rem;
    z-index: -1;
    border-radius: 50%;
    background: radial-gradient(closest-side, rgba(var(--gw-quiet), 0.92) 30%, rgba(var(--gw-quiet), 0.55) 62%, rgba(var(--gw-quiet), 0) 100%);
    pointer-events: none;
}
.page-business-gateway .bs-intro-lead { color: var(--gw-ink-soft); }
.page-business-gateway .bs-intro-label { color: var(--gw-muted); }

/* 02 — картите са бели и непрозрачни: геометрията минава ПОД тях, не през
   текста. */
.page-business-gateway .bs-dir { background: linear-gradient(180deg, #fff 0%, #fdfcff 100%); }

/* 03 — конзолата на решението. */
.page-business-gateway .bs-nav.bs-console {
    margin: 0;
    padding: clamp(1.1rem, 0.6rem + 2vw, 2.5rem);
    border: 1px solid var(--gw-console-edge);
}
@media (max-width: 56.24rem) {
    .page-business-gateway .bs-nav-panel { position: relative; }
}
/* Широк екран: опциите стоят плътно горе, а панелът с резултата заема и
   последния, гъвкав ред — иначе редовете се разтягат по височината му и
   опциите се разпиляват. */
@media (min-width: 56.25rem) {
    .page-business-gateway .bs-nav.bs-console { grid-template-rows: repeat(4, auto) 1fr; }
}
/* Сигналът на избора: точка по кабела, после светлина по ръба на панела. */
.page-business-gateway .bs-nav-panel { overflow: hidden; }
.page-business-gateway .bs-nav-panel::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 2px;
    background: linear-gradient(90deg, rgba(167, 139, 250, 0), #a78bfa 35%, #fff 50%, #a78bfa 65%, rgba(167, 139, 250, 0));
    transform: translateX(100%);
    animation: gw-panel-sweep 0.9s cubic-bezier(0.4, 0, 0.2, 1) 0.45s backwards;
    pointer-events: none;
}
@keyframes gw-panel-sweep { from { transform: translateX(-100%); } }
@media (min-width: 56.25rem) {
    .page-business-gateway .bs-nav-link::after {
        content: "";
        position: absolute;
        left: 0;
        top: 50%;
        width: 7px;
        height: 7px;
        translate: -50% -50%;
        border-radius: 50%;
        background: #fff;
        box-shadow: 0 0 0 4px rgba(167, 139, 250, 0.35);
        opacity: 0;
    }
    .page-business-gateway .bs-nav-input:nth-of-type(1):checked ~ .bs-nav-opt:nth-of-type(1) .bs-nav-link::after,
    .page-business-gateway .bs-nav-input:nth-of-type(2):checked ~ .bs-nav-opt:nth-of-type(2) .bs-nav-link::after,
    .page-business-gateway .bs-nav-input:nth-of-type(3):checked ~ .bs-nav-opt:nth-of-type(3) .bs-nav-link::after,
    .page-business-gateway .bs-nav-input:nth-of-type(4):checked ~ .bs-nav-opt:nth-of-type(4) .bs-nav-link::after {
        animation: gw-nav-signal 0.7s cubic-bezier(0.4, 0, 0.2, 1) 0.1s;
    }
    @keyframes gw-nav-signal {
        0%   { transform: translateX(0); opacity: 0; }
        20%  { opacity: 1; }
        85%  { opacity: 1; }
        100% { transform: translateX(var(--space-7)); opacity: 0; }
    }
}

/* 04 — четирите области с по едно изречение под таблото. */
.page-business-gateway .bs-dq {
    list-style: none;
    display: grid;
    gap: var(--space-5);
    margin: 0;
    padding: 0;
}
@media (min-width: 47.5rem) { .page-business-gateway .bs-dq { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 68rem) { .page-business-gateway .bs-dq { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.page-business-gateway .bs-dq-item {
    position: relative;
    padding-top: var(--space-4);
    border-top: 1px solid rgba(21, 20, 43, 0.12);
}
.page-business-gateway .bs-dq-item::before {
    content: "";
    position: absolute;
    left: 0;
    top: -1px;
    width: 2.5rem;
    height: 2px;
    background: var(--gw-cyan);
}
.page-business-gateway .bs-dq-no {
    margin: 0 0 0.35rem;
    font-family: var(--font-display);
    font-size: 0.9375rem;
    font-weight: 600;
    color: #1685ad;
}
.page-business-gateway .bs-dq-name {
    margin: 0 0 0.35rem;
    font-family: var(--font-display);
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1.25;
    color: var(--gw-ink);
}
.page-business-gateway .bs-dq-text { margin: 0; line-height: 1.55; color: var(--gw-ink-soft); }

/* 05 — възходящата повърхност: четири етапа, всеки малко по-високо. */
.page-business-gateway .bs-rise {
    margin: 0 0 0;
    padding: clamp(1.5rem, 1rem + 2vw, 3rem) clamp(1.25rem, 0.8rem + 2vw, 3rem);
}
.page-business-gateway .bs-rise-list {
    position: relative;
    list-style: none;
    display: grid;
    gap: var(--space-5);
    margin: 0;
    padding: 0;
}
.page-business-gateway .bs-rise-stage { position: relative; padding-left: 2rem; }
.page-business-gateway .bs-rise-stage:not(:last-child)::before {
    content: "";
    position: absolute;
    left: 0.42rem;
    top: 1.2rem;
    bottom: calc(-1 * var(--space-5));
    width: 1px;
    background: rgba(196, 181, 253, 0.34);
}
.page-business-gateway .bs-rise-node {
    position: absolute;
    left: 0;
    top: 0.25rem;
    width: 0.9rem;
    height: 0.9rem;
    border: 2px solid var(--color-accent-soft);
    border-radius: 50%;
    background: #14122b;
    transition: background var(--bs-medium) var(--bs-ease);
}
.bs-js .page-business-gateway .bs-rise.bs-in .bs-rise-node { background: var(--color-accent-soft); }
.bs-js .page-business-gateway .bs-rise.bs-in li:nth-child(2) .bs-rise-node { transition-delay: 0.18s; }
.bs-js .page-business-gateway .bs-rise.bs-in li:nth-child(3) .bs-rise-node { transition-delay: 0.36s; }
.bs-js .page-business-gateway .bs-rise.bs-in li:nth-child(4) .bs-rise-node { transition-delay: 0.54s; }
.page-business-gateway .bs-rise-no {
    margin: 0 0 0.2rem;
    font-size: 0.625rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    color: var(--color-accent-soft);
}
.page-business-gateway .bs-rise-name {
    margin: 0 0 0.35rem;
    font-family: var(--font-display);
    font-size: 1.35rem;
    font-weight: 600;
    line-height: 1.2;
    color: #fff;
}
.page-business-gateway .bs-rise-text { margin: 0; max-width: 26ch; font-size: 0.9375rem; line-height: 1.5; color: rgba(255, 255, 255, 0.74); }
@media (min-width: 56.25rem) {
    .page-business-gateway .bs-rise-list {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        align-items: start;
        column-gap: var(--space-5);
    }
    /* Всеки етап започва 1,5rem по-високо от предишния — пътят нагоре е
       самата идея. Отместването е по горния ръб (възела), затова не зависи
       от дължината на текста. */
    .page-business-gateway .bs-rise-stage { padding-left: 0; padding-top: 1.75rem; }
    .page-business-gateway .bs-rise-stage:nth-child(1) { margin-top: 4.5rem; }
    .page-business-gateway .bs-rise-stage:nth-child(2) { margin-top: 3rem; }
    .page-business-gateway .bs-rise-stage:nth-child(3) { margin-top: 1.5rem; }
    .page-business-gateway .bs-rise-stage:not(:last-child)::before { display: none; }
    .page-business-gateway .bs-rise-node { top: 0; }
    /* Възходящата линия минава през центровете на четирите възела: диагонал
       в кутия от първия (долу вляво) до последния (горе вдясно). Десният
       ръб: 25% − ¾ от междината (1,5rem) − половин възел.
       ⚠️ `to bottom right`: при посока към ъгъл линията на 50% минава през
       ДРУГИТЕ два ъгъла — тоест от долния ляв към горния десен. */
    .page-business-gateway .bs-rise-list::before {
        content: "";
        position: absolute;
        left: 0.45rem;
        right: calc(25% - 1.575rem);
        top: 0.45rem;
        height: 4.5rem;
        background: linear-gradient(to bottom right, transparent calc(50% - 1px), rgba(196, 181, 253, 0.55) 50%, transparent calc(50% + 1px));
        pointer-events: none;
    }
}

/* 06 — трите входни карти към котвите на /insurance/. */
.page-business-gateway .bs-gates {
    list-style: none;
    display: grid;
    gap: var(--space-4);
    margin: 0;
    padding: 0;
}
@media (min-width: 56.25rem) { .page-business-gateway .bs-gates { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.page-business-gateway .bs-gate {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: var(--space-5);
    border: 1px solid var(--bs-hairline);
    border-radius: var(--bs-r);
    background: #fff;
    background-clip: padding-box;
    box-shadow: var(--bs-depth-1);
    transition: border-color var(--bs-fast) var(--bs-ease), box-shadow var(--bs-fast) var(--bs-ease), translate var(--bs-fast) var(--bs-ease);
}
.page-business-gateway .bs-gate:hover,
.page-business-gateway .bs-gate:focus-within {
    border-color: rgba(124, 58, 237, 0.3);
    box-shadow: var(--bs-depth-3);
    translate: 0 -2px;
}
.page-business-gateway .bs-gate:focus-within { outline: 3px solid var(--color-primary); outline-offset: 2px; }
.page-business-gateway .bs-gate-no { margin: 0 0 0.5rem; font-family: var(--font-display); font-size: 0.9375rem; font-weight: 600; color: var(--color-accent); }
.page-business-gateway .bs-gate-care .bs-gate-no { color: #b8740f; }
.page-business-gateway .bs-gate-title { margin: 0 0 0.5rem; font-family: var(--font-display); font-size: 1.2rem; font-weight: 600; line-height: 1.25; }
.page-business-gateway .bs-gate-link { color: var(--gw-ink); text-decoration: none; }
.page-business-gateway .bs-gate-link:focus-visible { outline: none; }
/* Цялата карта е целта за клик; достъпното име остава краткото заглавие. */
.page-business-gateway .bs-gate-link::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.page-business-gateway .bs-gate-text { margin: 0 0 var(--space-4); font-size: 0.9375rem; line-height: 1.55; color: var(--gw-ink-soft); }
.page-business-gateway .bs-gate-more {
    margin-top: auto;
    font-weight: 700;
    color: var(--color-primary-dark);
    transition: transform var(--bs-fast) var(--bs-ease);
}
.page-business-gateway .bs-gate:hover .bs-gate-more { transform: translateX(4px); }
.page-business-gateway .bs-ins-overview { margin-bottom: var(--space-7); }

/* Сцените върху полето завършват с по-плътен въздух, защото няма смяна на
   лентата, която да отдели следващата. */
.page-business-gateway .bs-band-field.bs-scene { padding-block: clamp(4rem, 2.8rem + 3.5vw, 6.5rem); }
.page-business-gateway .bs-directions.bs-band-field { padding-top: 0; }


/* ---------- 7. Телефон — по-малко слоеве, не свит десктоп ----------------- */

@media (max-width: 47.5rem) {
    /* Половината контури, без възлите, една леща, без постоянен дрейф. */
    .page-business-gateway .bsf-alt,
    .page-business-gateway .bsf-nodes,
    .page-business-gateway .bsf-lens-ice,
    .page-business-gateway .bsf-lens-amber { display: none; }
    .page-business-gateway .bsf-topo-base,
    .page-business-gateway .bsf-lens > i { animation: none; }
    .page-business-gateway .bsf-lens-violet { width: 90vmax; height: 90vmax; }

    /* Геометрията около ядрото — по-малка и с три пръстена. */
    .page-business-gateway .bs-core-field { width: 900px; height: 620px; }
    .page-business-gateway .bsf-ring-4,
    .page-business-gateway .bsf-ring-5,
    .page-business-gateway .bsf-ring-6,
    .page-business-gateway .bsf-packet,
    .page-business-gateway .bs-refract { display: none; }
    .page-business-gateway .bs-hero-copy::before { inset: -2rem -1.5rem -2rem -1.5rem; }
    .page-business-gateway .bs-console-foot span:last-child { display: none; }
    .page-business-gateway .bs-console-status { display: none; }
    .page-business-gateway .bs-band-field.bs-scene { padding-block: 3.5rem; }
    .page-business-gateway .bs-directions.bs-band-field { padding-top: 0; }
}


/* ---------- 8. Скрит таб и намалено движение ------------------------------ */

/* Скрит таб: всичко безкрайно в полето спира. */
.bs-hidden .page-business-gateway .bs-global-field *,
.bs-hidden .page-business-gateway .bs-core-field * {
    animation-play-state: paused !important;
}

/* Намалено движение: business-solutions.css вече изключва всички анимации
   и преходи на страницата; скриптът не сменя режимите. Тук се махат само
   елементите, които имат смисъл единствено в движение — финалната статична
   композиция остава: светло поле, ясни линии, активно ядро. */
@media (prefers-reduced-motion: reduce) {
    .page-business-gateway .bsf-wave,
    .page-business-gateway .bs-spine-pulse,
    .page-business-gateway .bsf-packet,
    .page-business-gateway .bs-refract,
    .page-business-gateway .bs-nav-panel::before,
    .page-business-gateway .bs-nav-link::after { display: none; }
}