@font-face { font-family: 'Fixel Display'; src: url('fonts/FixelDisplay-Regular.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Fixel Display'; src: url('fonts/FixelDisplay-Medium.woff2') format('woff2'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Fixel Display'; src: url('fonts/FixelDisplay-SemiBold.woff2') format('woff2'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Fixel Display'; src: url('fonts/FixelDisplay-Bold.woff2') format('woff2'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Raleway'; src: url('fonts/Raleway-cyrillic-400.woff2') format('woff2'); font-weight: 400; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Raleway'; src: url('fonts/Raleway-latin-400.woff2') format('woff2'); font-weight: 400; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
    --grad-a: #30c7e8;
    --grad-b: #0759f8;
    --grad-c: #de6bf9;
    --glass-bg: rgba(7, 89, 248, 0.15);
    --glass-border: rgba(255, 255, 255, 0.05);
    --glass-glow: inset 0 0 40px 0 rgba(255, 255, 255, 0.2);
    --text-btn: #f0fefd;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(100vw * 98 / 1440); }
html, body { margin: 0; padding: 0; }
body.lp {
    background: #000;
    color: #fff;
    font-family: 'Fixel Display', system-ui, sans-serif;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
:where(.lp) :where(h1, h2, h3, p, ul, ol) { margin: 0; padding: 0; font-weight: inherit; }
:where(.lp) :where(ul, ol) { list-style: none; }
:where(.lp) :where(a) { color: inherit; text-decoration: none; }
:where(.lp) :where(button) { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
:where(.lp) :where(img) { display: block; max-width: none; }

/* Полотно макета: координати з Figma як є, масштаб під ширину вікна (landing.js) */
.fit {
    position: relative;
    width: 100%;
    aspect-ratio: var(--w) / var(--h);
    overflow: hidden;
}
.canvas {
    position: absolute;
    left: 0;
    top: 0;
    width: calc(var(--w) * 1px);
    height: calc(var(--h) * 1px);
    transform-origin: top left;
}
.canvas > * { position: absolute; }
.fit--bar { position: fixed; left: 0; top: 0; z-index: 50; overflow: visible; pointer-events: none; }
.fit--bar .menu { pointer-events: auto; }
[aria-hidden="true"] { pointer-events: none; }

/* ---------- Кнопки ---------- */
.btn-grad {
    display: block;
    height: 55px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: inset 0 0 8px 1px rgba(255, 255, 255, 0.75);
    transition: filter .2s ease;
}
.btn-grad:hover { filter: brightness(1.12); }
.btn-flow { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; pointer-events: none; opacity: 0; transition: opacity .6s ease; }
.btn-flow.is-on { opacity: 1; }
.btn-flow canvas { display: block; width: 100%; height: 100%; }
.btn-flow::after { content: ''; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 8px 1px rgba(255, 255, 255, 0.75); }
.glint {
    position: absolute;
    width: 92.001px;
    height: 90.586px;
    display: flex;
    align-items: center;
    justify-content: center;
    mix-blend-mode: plus-lighter;
    pointer-events: none;
}
.glint::before {
    content: '';
    flex: none;
    width: 35.906px;
    height: 93.222px;
    border-radius: 126.563px;
    filter: blur(15px);
    transform: rotate(-134deg);
    background: linear-gradient(263.09deg, #fff 52.92%, rgba(255, 255, 255, 0) 53.57%);
}
.glint--wide {
    width: 125.276px;
    height: 122.72px;
    top: calc(50% + 0.14px);
    transform: translateY(-50%);
}
.glint--wide::before {
    height: 139.48px;
    background: linear-gradient(265.37deg, #fff 52.92%, rgba(255, 255, 255, 0) 53.57%);
}
.btn-label {
    position: absolute;
    top: 18px;
    transform: translateX(-50%);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--text-btn);
    white-space: nowrap;
}
.arrow {
    position: absolute;
    width: 22px;
    height: 22px;
    top: 15.63px;
    transform: rotate(-90deg) scaleY(-1);
}
.btn-ghost { display: block; height: 55px; border-radius: 14px; transition: opacity .2s ease; }
.btn-ghost:not([data-drum]):hover { opacity: .75; }
.btn-white {
    height: 48px;
    padding: 12px 20px;
    border-radius: 14px;
    background: #fff;
    color: #000;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    transition: background-color .2s ease;
}
.btn-white:hover { background: #e6ecff; }
.liquid-host { isolation: isolate; overflow: hidden; }
.liquid-fill {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    z-index: -1;
    color: #fff;
    pointer-events: none;
    transform: translateY(calc(100% + 14px));
    transition: transform .7s cubic-bezier(.65, 0, .35, 1);
}
.liquid-wave { position: absolute; left: 0; bottom: 100%; width: 200%; height: 16px; animation: liquid-wave .9s linear infinite paused; }
.liquid-body { position: absolute; left: 0; right: 0; top: -1px; bottom: -14px; background: currentColor; }
@keyframes liquid-wave { to { transform: translateX(-50%); } }
.btn-white .liquid-fill { color: var(--grad-b, #0759f8); }
.btn-grad .btn-label, .btn-grad .arrow, .btn-white { transition: color .45s ease .1s, filter .45s ease .1s, background-color .2s ease; }
@media (hover: hover) {
    .liquid-host:hover .liquid-fill { transform: translateY(-14px); }
    .liquid-host:hover .liquid-wave { animation-play-state: running; }
    .btn-grad.liquid-host:hover { filter: none; }
    .btn-grad.liquid-host:hover .btn-label { color: #060e28; }
    .btn-grad.liquid-host:hover .arrow { filter: brightness(0); }
    .btn-white.liquid-host:hover { background: #fff; color: #fff; }
}
@media (prefers-reduced-motion: reduce) {
    .liquid-wave { animation: none; }
}

/* ---------- Меню і повторювані елементи меню/підвалу ---------- */
.menu {
    left: 12px;
    top: 12px;
    width: 1416px;
    height: 74px;
    border: 1px solid var(--glass-border);
    border-radius: 20px;
    background: var(--glass-bg);
    box-shadow: var(--glass-glow);
    z-index: 10;
}
.menu__bar {
    position: absolute;
    left: 7px;
    right: 7px;
    top: 5px;
    height: 62px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 20px;
    background: rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
}
.menu__bar > * { position: absolute; transition: opacity .4s ease-out; }
.intro .menu {
    width: 78px;
    overflow: hidden;
    transform: translateX(669px) scale(0);
    transition: transform .35s cubic-bezier(.34, 1.56, .64, 1);
}
.intro.intro-pop .menu { transform: translateX(669px) scale(1); }
.intro.intro-expand .menu {
    width: 1416px;
    transform: translateX(0) scale(1);
    transition: width .7s cubic-bezier(.22, 1, .36, 1), transform .7s cubic-bezier(.22, 1, .36, 1);
}
.intro .menu__bar > :not(.menu__logo), .intro .menu__logo span { opacity: 0; }
.rv-mask { overflow: clip; }
.rv { display: inline-block; }
.lang > button > .rv { display: flex; align-items: center; gap: 6px; }
.hdr-in .rv { animation: rv-up .5s cubic-bezier(.22, 1, .36, 1) calc(var(--i) * .06s) both; }
.hdr-in .pop { animation: pop-in .45s cubic-bezier(.34, 1.56, .64, 1) calc(var(--i) * .08s + .1s) both; }
@keyframes rv-up { from { transform: translateY(100%); opacity: 0; } }
@keyframes pop-in { from { transform: scale(0); } }
.menu__logo img { position: absolute; left: 16px; top: 16px; width: 30px; height: 30px; object-fit: cover; }
.menu__logo img { transition: opacity .6s ease; }
.menu__logo.is-3d img { opacity: 0; }
.menu__logo-3d { position: absolute; left: 12.19px; top: 11.31px; width: 40px; height: 40px; pointer-events: auto; cursor: grab; touch-action: pan-y; user-select: none; }
.menu__logo-3d.is-dragging { cursor: grabbing; }
.menu__logo, .menu__logo img { -webkit-user-drag: none; }
.menu__logo-3d canvas { display: block; width: 100%; height: 100%; opacity: 0; transition: opacity .6s ease; }
.menu__logo-3d.is-ready canvas { opacity: 1; }
.menu__logo span {
    position: absolute;
    left: 54px;
    top: 21px;
    font-size: 20px;
    font-weight: 700;
    line-height: .95;
    letter-spacing: -0.4px;
    white-space: nowrap;
    transition: opacity .4s ease-out;
}
.menu__nav {
    left: calc(50% - 241.5px);
    top: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    gap: 40px;
    font-family: 'Raleway', sans-serif;
    font-size: 14px;
    line-height: 1.3;
    white-space: nowrap;
}
.menu__nav a, .footer__links a { transition: opacity .2s ease; }
.menu__nav a:not([data-drum]):hover { opacity: .7; }

.theme-switch {
    position: absolute;
    height: 48px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 20px;
}
.theme-switch img { width: 24px; height: 24px; }
.theme-switch button { display: block; width: 24px; height: 24px; transition: opacity .2s ease; }
.theme-switch button:hover { opacity: .7; }
.theme-switch__divider { width: 1px; height: 23px; background: rgba(255, 255, 255, 0.2); }
.lang { position: absolute; }
.lang > button { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; line-height: 1.2; white-space: nowrap; transition: opacity .2s ease; }
.lang > button:hover { opacity: .7; }
.lang img { width: 12px; height: 12px; transition: transform .25s cubic-bezier(.22, 1, .36, 1); }
.lang.is-open img { transform: rotate(180deg); }
.auth-login { position: absolute; transform: translateX(-50%); }
.auth-login > button { display: block; font-size: 14px; font-weight: 600; line-height: 1.2; white-space: nowrap; transition: opacity .2s ease; }
.auth-login > button:not([data-drum]):hover, .auth-login.is-open > button, .lang.is-open > button { opacity: .7; }
.auth-register { position: absolute; }

.dropdown {
    --dx: 0px;
    --dy: -8px;
    position: absolute;
    top: calc(100% + 14px);
    right: 0;
    z-index: 20;
    min-width: 176px;
    padding: 6px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(24, 38, 86, 0.88), rgba(8, 14, 36, 0.94));
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(7, 89, 248, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(30px) saturate(1.3);
    -webkit-backdrop-filter: blur(30px) saturate(1.3);
    transform-origin: 50% 0;
    opacity: 0;
    visibility: hidden;
    transform: translate(var(--dx), var(--dy)) scale(.96);
    transition: opacity .18s ease, transform .3s cubic-bezier(.22, 1, .36, 1), visibility .18s;
}
.auth-login .dropdown, .lang .dropdown { --dx: -50%; right: auto; left: 50%; top: calc(100% + 22px); }
.is-open > .dropdown { opacity: 1; visibility: visible; transform: translate(var(--dx), 0) scale(1); }
.dropdown a, .dropdown button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 11px 14px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    text-align: left;
    transition: background .2s ease, color .2s ease;
}
.dropdown a::after {
    content: '';
    width: 6px;
    height: 6px;
    border-top: 1.5px solid currentColor;
    border-right: 1.5px solid currentColor;
    opacity: 0;
    transform: translateX(-6px) rotate(45deg);
    transition: opacity .2s ease, transform .25s cubic-bezier(.22, 1, .36, 1);
}
.dropdown a:hover, .dropdown button:hover { background: linear-gradient(90deg, rgba(7, 89, 248, 0.5), rgba(7, 89, 248, 0.14)); }
.dropdown a:hover::after { opacity: 1; transform: translateX(0) rotate(45deg); }
.dropdown small { font-size: 12px; font-weight: 600; opacity: .45; }
.dropdown button.is-active { background: rgba(255, 255, 255, 0.06); }
.dropdown button.is-active small { opacity: 1; color: #6fa0ff; }

/* ---------- Скляні картки ---------- */
.card {
    width: 321px;
    height: 197px;
    border: 1px solid var(--glass-border);
    border-radius: 20px;
    background: var(--glass-bg);
    box-shadow: var(--glass-glow);
}
.card > * { position: absolute; }
.card__icon { left: 31px; top: 31px; width: 42px; height: 42px; }
.card h3 { left: 31px; top: 98px; width: 257px; font-size: 20px; font-weight: 600; line-height: 1; white-space: nowrap; }
.card p { left: 31px; top: 128px; width: 257px; font-size: 14px; font-weight: 500; line-height: 1.3; opacity: .5; }
.card--why { width: 318px; height: 217px; }
.card--why p { top: 148px; }

/* ---------- Перший екран ---------- */
.hero-graphic { left: 0; top: 0; width: 1440px; height: 780px; }
.hero-graphic > * { position: absolute; }
.hg-glow {
    left: 647px;
    top: -1px;
    width: 793px;
    height: 780px;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to right, transparent 18px, #000 125px), linear-gradient(to bottom, #000 72%, transparent 97%);
    -webkit-mask-composite: source-in;
    mask-image: linear-gradient(to right, transparent 18px, #000 125px), linear-gradient(to bottom, #000 72%, transparent 97%);
    mask-composite: intersect;
}
.hg-glow img { position: absolute; left: -18.16%; top: -1.41%; width: 149.81%; height: 101.54%; }
.hg-fx { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; mix-blend-mode: screen; }
.hg-pic { left: 874.94px; top: 233.39px; width: 334.745px; height: 334.745px; }
.hg-3d { left: 782.31px; top: 140.76px; width: 520px; height: 520px; pointer-events: auto; cursor: grab; touch-action: pan-y; user-select: none; }
.hg-3d.is-dragging { cursor: grabbing; }
.hg-3d canvas { display: block; width: 100%; height: 100%; opacity: 0; transition: opacity .6s ease; filter: drop-shadow(0 0 36px rgba(70, 110, 255, 0.5)); }
.hg-3d.is-ready canvas { opacity: 1; }
.hg-pic { transition: opacity .6s ease; }
.is-3d > .hg-pic { opacity: 0; }
@keyframes hg-pop { from { scale: 0; } to { scale: 1; } }
.hg-wait > .hg-pic, .hg-wait > .hg-3d { scale: 0; }
.hg-wait.hg-in > .hg-pic, .hg-wait.hg-in > .hg-3d { animation: hg-pop .9s cubic-bezier(.34, 1.56, .64, 1) both; }

.hero-effect {
    left: 0;
    top: -1px;
    width: 1440px;
    height: 1600px;
    -webkit-mask-image: linear-gradient(to right, #000 387px, rgba(0, 0, 0, .45) 531px, transparent 649px);
    mask-image: linear-gradient(to right, #000 387px, rgba(0, 0, 0, .45) 531px, transparent 649px);
}
.hero-effect > * { position: absolute; }
.hero-effect--baked { -webkit-mask-image: none; mask-image: none; }
.hero-effect--baked > img { left: 0; top: 1px; width: 648px; height: 1456px; }
.hero-flow { left: 0; top: -1px; width: 620px; height: 560px; overflow: hidden; pointer-events: none; }
.hero-flow > * { position: absolute; }
.hero-flow .fg-flow {
    -webkit-mask-image: radial-gradient(110% 100% at 0 0, #000 20%, rgba(0, 0, 0, .5) 50%, transparent 80%);
    mask-image: radial-gradient(110% 100% at 0 0, #000 20%, rgba(0, 0, 0, .5) 50%, transparent 80%);
}
.he-fill--1 { background: #101e3d; filter: blur(161.923px); left: -389.27px; top: -35.75px; width: 846.492px; height: 534.047px; }
.he-fill--2 { background: #0b162f; filter: blur(275.282px); left: -615px; top: -35.75px; width: 1072.223px; height: 675.817px; }
.he-fill--3 { background: #163681; filter: blur(275.282px); mix-blend-mode: saturation; left: -615px; top: -35.75px; width: 1072.223px; height: 196.827px; }
.he-fill--4 { background: #163681; filter: blur(275.282px); mix-blend-mode: saturation; left: -615px; top: 0.03px; width: 1072.223px; height: 701.969px; }
.he-ray {
    width: 452.691px;
    height: 439.797px;
    display: flex;
    align-items: center;
    justify-content: center;
    mix-blend-mode: plus-lighter;
}
.he-ray img { flex: none; width: 114.375px; height: 636.806px; transform: rotate(-134deg); }
.he-ray--1 { left: -283.7px; top: -75px; }
.he-ray--2 { left: -79.22px; top: -200px; }
.he-beam, .he-spark, .fx { display: flex; align-items: center; justify-content: center; }
.he-beam > div, .he-spark > div, .fx > div { flex: none; }
.he-beam > div { transform: rotate(-47.63deg); }
.he-beam--1 { left: -403.03px; top: -94.94px; width: 413.863px; height: 439.27px; }
.he-beam--1 > div { width: 497.713px; height: 106.179px; background: rgba(165, 243, 252, 0.25); filter: blur(81.293px); }
.he-beam--2 { left: -283.59px; top: -55.12px; width: 355.496px; height: 386.03px; mix-blend-mode: plus-lighter; }
.he-beam--2 > div { width: 497.713px; height: 27.177px; border-radius: 232.5px; opacity: .79; filter: blur(50px); background: linear-gradient(-0.998deg, #6dc5d8 40.06%, #6a77e8 48.11%); }
.he-beam--3 { left: -95.21px; top: -55.12px; width: 346.886px; height: 376.59px; mix-blend-mode: plus-lighter; }
.he-beam--3 > div { width: 484.937px; height: 27.177px; border-radius: 232.5px; opacity: .79; filter: blur(50px); background: linear-gradient(0.117deg, #6dc5d8 28.444%, #6a77e8 35.123%); }
.he-spark { left: -51px; top: -38.51px; width: 130.663px; height: 128.683px; mix-blend-mode: plus-lighter; }
.he-spark > div { width: 51.592px; height: 131.822px; border-radius: 126.563px; filter: blur(15px); transform: rotate(-134deg); background: linear-gradient(262.98deg, #fff 52.92%, rgba(255, 255, 255, 0) 53.57%); }

.hero-title { left: 60px; top: 202px; width: 575px; font-size: 72px; font-weight: 700; line-height: .95; letter-spacing: -1.44px; }
html[lang="ru"] .hero-title { width: 620px; }
.hero-lead { left: 60px; top: 430px; width: 445px; font-size: 16px; line-height: 1.3; }
.hero-cta {
    left: 60px;
    top: 516px;
    width: 186px;
    background: linear-gradient(185.68deg, var(--grad-a) 15.744%, var(--grad-b) 46.475%, var(--grad-c) 72.42%);
}
.hero-cta .btn-label { left: 74px; }
.hero-cta .arrow { left: 139px; }
.hero-cta2 { left: 260px; top: 516px; width: 186px; }
.hero-cta2 .btn-label { left: 75px; }
.hero-cta2 .arrow { left: 140px; top: 16.63px; }

.hero-features { left: 60px; top: 688px; display: flex; gap: 40px; }
.hero-features li { display: flex; align-items: center; gap: 14px; }
.hero-features img { width: 32px; height: 32px; flex: none; opacity: 0; }
.hero-features.is-in img { opacity: 1; animation: pop-in .4s cubic-bezier(.34, 1.56, .64, 1) both; }
.hero-features.is-in li:nth-child(2) img { animation-delay: .06s; }
.hero-features.is-in li:nth-child(3) img { animation-delay: .12s; }
.hero-features.is-in li:nth-child(4) img { animation-delay: .18s; }
.hero-features li > span { width: 112px; font-size: 12px; font-weight: 600; line-height: 1.3; }

/* ---------- Для мерчантів / трейдерів ---------- */
.audience { left: 0; top: 833px; width: 1440px; height: 780px; }
.audience > * { position: absolute; }
.audience .tabs { left: 50%; top: 37px; transform: translateX(-50%); display: flex; gap: 14px; z-index: 1; }
.tab {
    height: 48px;
    padding: 12px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 14px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    transition: color .45s ease .1s, background-color .2s ease;
}
.tab img { width: 12px; height: 12px; display: none; }
.tab.is-active { background: #fff; color: #000; }
.tab.is-active img { display: block; }
.tab .liquid-fill { color: var(--grad-b, #0759f8); }
.tab.is-active .drum .drum-roller { transform: translateZ(calc(-1 * var(--drum-r))) rotateX(0deg); transition: none; }
@media (hover: hover) {
    .tab.is-active:hover { color: #fff; }
    .tab:not(.is-active):hover .liquid-fill { transform: translateY(calc(100% + 14px)); }
    .tab:not(.is-active):hover .liquid-wave { animation-play-state: paused; }
}

.panel { inset: 0; }
.panel[hidden] { display: none; }
.panel > * { position: absolute; }

.blob {
    width: 495.783px;
    height: 527.566px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.blob > div { position: relative; flex: none; width: 399.696px; height: 443.479px; transform: rotate(14.12deg) scaleY(-1); }
.blob img { position: absolute; left: -75.06%; top: -67.65%; width: 250.12%; height: 235.3%; }

.dashboard { left: 728px; top: 109px; width: 652px; height: 405px; overflow: hidden; }
.dashboard img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.dashboard--traders { height: 406px; }
.dashboard img, .m-dashboard img { transition: opacity .5s ease; }
.dashboard img.lang-img-in, .dashboard img.lang-img-out, .m-dashboard img.lang-img-in, .m-dashboard img.lang-img-out { opacity: 0; }
.dashboard img.lang-img-out, .m-dashboard img.lang-img-out { transition: opacity .3s ease .5s; }

.steps-title { left: 60px; top: 554px; font-size: 24px; font-weight: 600; line-height: 1; white-space: nowrap; }
.steps { left: 60px; top: 602px; height: 62px; display: flex; align-items: center; gap: 134px; }
.steps li { position: relative; display: flex; gap: 24px; align-items: flex-start; }
.steps li + li::before {
    content: '';
    position: absolute;
    left: -67px;
    top: 50%;
    width: 1px;
    height: 62px;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.2);
}
.steps__num {
    flex: none;
    margin-top: 6px;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--glass-border);
    border-radius: 100px;
    background: #000;
    box-shadow: inset 0 0 16px 0 rgba(255, 255, 255, 0.2);
    font-size: 24px;
    font-weight: 600;
    line-height: 1;
}
.steps__num i {
    font-style: normal;
    color: transparent;
    background: linear-gradient(220deg, var(--grad-a) 9.93%, var(--grad-b) 49.5%, var(--grad-c) 82.9%);
    -webkit-background-clip: text;
    background-clip: text;
}
.steps li > div { width: 160px; display: flex; flex-direction: column; gap: 4px; }
.steps b { font-size: 16px; font-weight: 600; line-height: 1; }
.steps li > div > span { font-size: 14px; font-weight: 500; line-height: 1.3; opacity: .5; }

.steps-cta {
    left: 60px;
    top: 688px;
    width: 1320px;
    background: linear-gradient(181.17deg, var(--grad-a) 2.054%, var(--grad-b) 49.106%, var(--grad-c) 88.829%);
}
.steps-cta .btn-label { left: 640.5px; }
.steps-cta .arrow { left: 716px; }

/* ---------- Чому обирають LumaPay ---------- */
.why-effect { left: 0; top: 2048px; width: 1440px; height: 501px; overflow: hidden; -webkit-mask-image: linear-gradient(#000 60%, transparent); mask-image: linear-gradient(#000 60%, transparent); }
.why-effect video { position: absolute; left: -21%; top: -14.37%; width: 142%; height: 143.31%; object-fit: cover; }
.why-title {
    left: 427px;
    top: 1726px;
    width: 586px;
    text-align: center;
    font-size: 46px;
    font-weight: 700;
    line-height: .95;
    letter-spacing: -0.92px;
    white-space: nowrap;
}
.why-lines { left: 217px; top: 1900px; width: 1006px; height: 179px; overflow: visible; }
.why-ring { left: 614px; top: 1760px; width: 212px; height: 212px; }
.why-logo {
    left: 674px;
    top: 1820px;
    width: 91.145px;
    height: 91.145px;
    border: 1.07px solid rgba(255, 255, 255, 0.2);
    border-radius: 100px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(12.837px);
    -webkit-backdrop-filter: blur(12.837px);
    box-shadow: inset 0 4.279px 12.837px 0 rgba(255, 255, 255, 0.25);
}
.why-logo > div {
    position: absolute;
    left: calc(50% + 3.06px);
    top: calc(50% - 0.92px);
    width: 46px;
    height: 52px;
    transform: translate(-50%, -50%);
    overflow: hidden;
}
.why-logo img { position: absolute; left: -16.28%; top: -6.42%; width: 123.26%; height: 110.42%; }

/* ---------- Партнерська програма ---------- */
.partner-graphic { left: 772px; top: 2617px; width: 608px; height: 421px; }
.partner-graphic > * { position: absolute; }
.pg-pic { left: 0; top: 0; width: 608px; height: 322px; overflow: hidden; }
.pg-pic { pointer-events: auto; }
.pg-fade { pointer-events: none; }
.pg-tilt {
    position: absolute;
    left: -16.28%;
    top: -16.14%;
    width: 123.15%;
    height: 116.14%;
    transition: filter .5s ease;
}
.pg-tilt > * { position: absolute; inset: 0; width: 100%; height: 100%; }
.pg-tilt video { object-fit: cover; opacity: 0; transition: opacity .3s ease; }
.pg-light {
    opacity: 0;
    mix-blend-mode: screen;
    background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 50%), rgba(120, 140, 255, 0.28), rgba(170, 90, 255, 0.1) 45%, rgba(0, 0, 0, 0) 70%);
    -webkit-mask-image: linear-gradient(to right, transparent 14%, #000 32%, #000 78%, transparent 94%), linear-gradient(to bottom, transparent 16%, #000 34%, #000 64%, transparent 84%);
    -webkit-mask-composite: source-in;
    mask-image: linear-gradient(to right, transparent 14%, #000 32%, #000 78%, transparent 94%), linear-gradient(to bottom, transparent 16%, #000 34%, #000 64%, transparent 84%);
    mask-composite: intersect;
    transition: opacity .4s ease;
}
.is-video .pg-tilt img { opacity: 0; }
.is-video .pg-tilt video { opacity: 1; }
.partner-graphic.is-hover .pg-tilt { filter: brightness(1.12) saturate(1.1); }
.partner-graphic.is-hover .pg-light { opacity: 1; }
.pg-fade { left: 0; top: 223px; width: 608px; height: 99px; background: linear-gradient(to top, #000 31.604%, rgba(0, 0, 0, 0)); }

.blur-partner { left: -244.35px; top: 3033px; width: 832.501px; height: 487.465px; }
.blur-partner img { position: absolute; left: -33.21%; top: -47.94%; width: 169.2%; height: 203.39%; }

.partner-title { left: 60px; top: 2496px; font-size: 72px; font-weight: 700; line-height: .95; letter-spacing: -1.44px; white-space: nowrap; }
.partner-lead { left: 60px; top: 2656px; font-size: 16px; line-height: 1.3; white-space: nowrap; }
.label {
    height: 38px;
    border: 1px solid var(--glass-border);
    border-radius: 12px;
    background: rgba(7, 89, 248, 0.05);
    box-shadow: inset 0 0 20px 0 rgba(255, 255, 255, 0.2);
}
.label img { position: absolute; left: 11px; top: 8px; width: 20px; height: 20px; }
.label span { position: absolute; left: 41px; top: 10px; font-size: 12px; font-weight: 500; line-height: 1.3; white-space: nowrap; }
.partner-cta {
    left: 60px;
    top: 2855px;
    width: 207px;
    background: linear-gradient(185.11deg, var(--grad-a) 15.744%, var(--grad-b) 46.475%, var(--grad-c) 72.42%);
}
.partner-cta .btn-label { left: 84.5px; }
.partner-cta .arrow { left: 160px; }

/* ---------- Зв'язок ---------- */
.blur-cta { left: 932px; top: 3120.818px; width: 467px; height: 395.515px; }
.blur-cta img { position: absolute; left: -81.23%; top: -79.44%; width: 266.02%; height: 258.2%; }

.contact {
    left: 60px;
    top: 3060px;
    width: 1320px;
    height: 554px;
    border: 1px solid var(--glass-border);
    border-radius: 20px;
    background: var(--glass-bg);
    box-shadow: var(--glass-glow);
}
.contact__inner {
    position: absolute;
    left: 7px;
    right: 7px;
    top: 7px;
    height: 538px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 20px;
    background: rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
}
.contact__inner > *, .contact__form > * { position: absolute; }
.contact__form { inset: 0; pointer-events: none; }
.contact__form > * { pointer-events: auto; }
.hp-field { left: -9999px; width: 1px; height: 1px; opacity: 0; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.contact__title { left: 39px; top: 39px; font-size: 46px; font-weight: 700; line-height: .95; letter-spacing: -0.92px; white-space: nowrap; }
.contact__lead { left: 39px; top: 97px; font-size: 16px; line-height: 1.3; white-space: nowrap; }
.field-label { left: 59px; font-size: 14px; font-weight: 500; line-height: 1.3; white-space: nowrap; }
.field {
    left: 39px;
    width: 524px;
    height: 56px;
    padding: 0 19px;
    border: 1px solid var(--glass-border);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.05);
    box-shadow: inset 0 0 8px 0 rgba(255, 255, 255, 0.15);
    color: #fff;
    font: 500 14px/1.3 'Fixel Display', system-ui, sans-serif;
    outline: none;
    transition: border-color .2s ease;
}
.field::placeholder { color: rgba(255, 255, 255, 0.5); opacity: 1; }
.field:focus { border-color: rgba(255, 255, 255, 0.3); }
.field.is-invalid { border-color: rgba(255, 99, 125, 0.75); }
.field-label.is-replaced { visibility: hidden; }
.field-error { color: #ff7d93; }
.contact__form > .fm, .m-contact__form > .fm { pointer-events: none; }
.fm {
    border-radius: 12px;
    opacity: 0;
    transition: opacity .35s ease;
}
.fm--reflect {
    transform: scaleY(-1);
    -webkit-mask-image: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.18) 45%, transparent 75%);
    mask-image: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.18) 45%, transparent 75%);
}
.fm--reflect.is-on { opacity: .58; }
.contact-cta {
    left: 39px;
    top: 442px;
    width: 524px;
    background: linear-gradient(182.02deg, var(--grad-a) 15.744%, var(--grad-b) 46.475%, var(--grad-c) 72.42%);
}
.contact-cta .btn-label { left: 243.5px; }
.contact-cta .arrow { left: 313px; }
.contact__direct { left: 660px; top: 182px; font-size: 20px; font-weight: 600; line-height: 1; white-space: nowrap; }
.contact__note { left: 660px; top: 216px; font-size: 14px; font-weight: 500; line-height: 1.3; opacity: .5; white-space: nowrap; }
.contact__icon { top: 286px; width: 32px; height: 32px; }
.contact__handle { top: 294px; font-size: 16px; font-weight: 600; line-height: 1; text-decoration: underline !important; white-space: nowrap; }

/* ---------- Підвал ---------- */
.footer-glow { left: 785px; top: 3664px; width: 655px; height: 413px; overflow: hidden; }
.footer-glow > * { position: absolute; }
.fg-baked { left: 0; top: 0; width: 655px; height: 413px; }
.fg-1 { left: 216.36px; top: 167.9px; width: 781.768px; height: 559.345px; }
.fg-1 > div { width: 720.878px; height: 454.798px; background: #101e3d; filter: blur(137.894px); transform: rotate(8.77deg); }
.fg-ray { width: 427.937px; height: 321.212px; mix-blend-mode: plus-lighter; }
.fg-ray img { flex: none; width: 97.4px; height: 542.3px; transform: rotate(-125.23deg); }
.fg-ray--1 { left: 327.62px; top: 202.42px; }
.fg-ray--2 { left: 515.95px; top: 123.75px; }
.fg-2 { left: 7.97px; top: 138.6px; width: 990.156px; height: 707.963px; }
.fg-2 > div { width: 913.113px; height: 575.531px; background: #0b162f; filter: blur(234.432px); transform: rotate(8.77deg); }
.fg-3 { left: 70.14px; top: 138.6px; width: 927.991px; height: 304.816px; mix-blend-mode: saturation; }
.fg-3 > div { width: 913.113px; height: 167.619px; background: #163681; filter: blur(234.432px); transform: rotate(8.77deg); }
.fg-4 { left: -0.07px; top: 168.72px; width: 993.55px; height: 729.974px; mix-blend-mode: saturation; }
.fg-4 > div { width: 913.113px; height: 597.802px; background: #163681; filter: blur(234.432px); transform: rotate(8.77deg); }
.fg-5 { left: 234.05px; top: 159.83px; width: 386.768px; height: 336.366px; }
.fg-5 > div { width: 423.856px; height: 90.423px; background: rgba(165, 243, 252, 0.25); filter: blur(69.23px); transform: rotate(-38.86deg); }
.fg-6 { left: 329.41px; top: 208.85px; width: 344.552px; height: 283.98px; mix-blend-mode: plus-lighter; }
.fg-6 > div { width: 423.856px; height: 23.144px; border-radius: 198px; opacity: .79; filter: blur(42.58px); transform: rotate(-38.86deg); background: linear-gradient(-0.998deg, #6dc5d8 40.06%, #6a77e8 48.11%); }
.fg-7 { left: 489.18px; top: 232.18px; width: 336.08px; height: 277.153px; mix-blend-mode: plus-lighter; }
.fg-flow {
    inset: 0;
    width: 100%;
    height: 100%;
    mix-blend-mode: screen;
    opacity: 0;
    transition: opacity 1.2s ease;
    pointer-events: none;
    -webkit-mask-image: radial-gradient(120% 110% at 100% 100%, #000 25%, rgba(0, 0, 0, .5) 55%, transparent 85%);
    mask-image: radial-gradient(120% 110% at 100% 100%, #000 25%, rgba(0, 0, 0, .5) 55%, transparent 85%);
}
.fg-flow.is-on { opacity: .8; }
.fg-fade {
    inset: 0;
    background:
        linear-gradient(to right, #000, rgba(0, 0, 0, .6) 18%, rgba(0, 0, 0, 0) 55%),
        linear-gradient(to bottom, #000, rgba(0, 0, 0, .6) 18%, rgba(0, 0, 0, 0) 60%);
}
.fg-7 > div { width: 412.975px; height: 23.144px; border-radius: 198px; opacity: .79; filter: blur(42.58px); transform: rotate(-38.86deg); background: linear-gradient(0.117deg, #6dc5d8 28.444%, #6a77e8 35.123%); }

.footer { left: 0; top: 0; width: 1440px; height: 4077px; pointer-events: none; }
.footer > * { position: absolute; pointer-events: auto; }
.footer__logo { left: 60px; top: 3759px; width: 202px; height: 50px; }
.footer__logo > div { position: absolute; left: 0; top: 0; width: 41px; height: 50px; overflow: hidden; }
.footer__logo img { position: absolute; left: -14.69%; top: 0; width: 121.64%; height: 99.74%; }
.footer__logo span {
    position: absolute;
    left: 57.12px;
    top: 8.31px;
    font-size: 33.233px;
    font-weight: 700;
    line-height: .95;
    letter-spacing: -0.6647px;
    white-space: nowrap;
}
.footer__hand { left: 60px; top: 3849px; width: 24px; height: 24px; }
.footer__mail { left: 96px; top: 3853px; font-size: 16px; font-weight: 600; line-height: 1; text-decoration: underline !important; white-space: nowrap; }
.footer__head { top: 3775px; font-size: 16px; font-weight: 600; line-height: 1; white-space: nowrap; }
.footer__links {
    top: 3819px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    font-family: 'Raleway', sans-serif;
    font-size: 14px;
    line-height: 1.3;
    white-space: nowrap;
}
.footer__links a { opacity: .5; }
.footer__links a:hover { opacity: 1; }
.footer__social { top: 3819px; width: 32px; height: 32px; transition: opacity .2s ease; }
.footer__social:hover { opacity: .7; }
.footer__social img { width: 32px; height: 32px; }
.footer__line { left: 60px; top: 4011px; width: 1320px; height: 1px; background: rgba(255, 255, 255, 0.2); }
.footer__small { top: 4035px; font-size: 14px; font-weight: 500; line-height: 1.3; opacity: .5; white-space: nowrap; }
.footer__legal { right: 78.2px; top: 4035px; display: flex; gap: 40px; }
.footer__legal .footer__small { position: static; }
a.footer__small:hover { opacity: 1; }
.footer .dropdown { --dy: 8px; top: auto; bottom: calc(100% + 14px); transform-origin: 50% 100%; }
.footer .auth-login .dropdown, .footer .lang .dropdown { top: auto; bottom: calc(100% + 22px); }

/* ---------- Мобільне полотно 375 ---------- */
.fit--mobile { display: none; }
@media (max-width: 767px) {
    .fit--desktop { display: none; }
    .fit--mobile { display: block; }
    html { scroll-padding-top: calc(100vw * 86 / 375); }
}
.fx > div { position: relative; }

.m-menu { left: 10px; top: 10px; width: 355px; height: auto; padding-top: 64px; }
.m-menu .menu__bar { left: 5px; right: 5px; top: 5px; height: 54px; border-radius: 14px; }
.m-menu .menu__logo img { top: 12px; }
.m-menu .menu__logo-3d { top: 7.31px; }
.m-menu .menu__logo span { top: 20px; font-size: 16px; letter-spacing: -0.32px; }
.m-burger { left: 302px; top: 14px; width: 24px; height: 24px; }
.m-burger img { width: 24px; height: 24px; }
.intro .fit--mobile .menu { width: 76px; transform: translateX(139.5px) scale(0); }
.intro.intro-pop .fit--mobile .menu { transform: translateX(139.5px) scale(1); }
.intro.intro-expand .fit--mobile .menu { width: 355px; transform: translateX(0) scale(1); }
.m-menu.is-open {
    backdrop-filter: blur(80px) saturate(1.2);
    -webkit-backdrop-filter: blur(80px) saturate(1.2);
}
.m-drawer {
    display: grid;
    grid-template-rows: 0fr;
    visibility: hidden;
    transition: grid-template-rows .4s cubic-bezier(.22, 1, .36, 1), visibility .4s;
}
.m-drawer__in {
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 0 15px;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity .25s ease, transform .4s cubic-bezier(.22, 1, .36, 1), padding .4s cubic-bezier(.22, 1, .36, 1);
}
.m-menu.is-open .m-drawer { grid-template-rows: 1fr; visibility: visible; }
.m-menu.is-open .m-drawer__in {
    opacity: 1;
    transform: translateY(0);
    padding: 16px 15px 15px;
    transition: opacity .3s ease .1s, transform .4s cubic-bezier(.22, 1, .36, 1), padding .4s cubic-bezier(.22, 1, .36, 1);
}
.m-drawer__nav { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; font-family: 'Raleway', sans-serif; font-size: 16px; line-height: 1.3; }
.m-burger, .m-drawer__btn { transition: opacity .2s ease, border-color .2s ease, background-color .2s ease; }
@media (hover: hover) {
    .m-burger:hover { opacity: .7; }
    .m-drawer__btn:hover { border-color: rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.04); }
}
.m-drawer__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.m-drawer__lang { display: flex; gap: 4px; }
.m-drawer__lang button { height: 32px; min-width: 40px; padding: 0 8px; border: 1px solid transparent; border-radius: 10px; font-size: 13px; font-weight: 600; line-height: 1; opacity: .5; transition: opacity .2s ease, border-color .2s ease, background-color .2s ease; }
.m-drawer__lang button.is-active { opacity: 1; border-color: rgba(255, 255, 255, 0.14); background: rgba(255, 255, 255, 0.04); }
@media (hover: hover) {
    .m-drawer__lang button:not(.is-active):hover { opacity: .8; }
}
.m-drawer__auth { display: flex; flex-direction: column; gap: 10px; }
.m-drawer__btn { height: 44px; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 14px; font-size: 14px; font-weight: 600; }
.m-drawer__reg { display: flex; align-items: center; justify-content: center; height: 44px; padding: 0 20px; }

.m-rest { left: 0; top: calc(var(--hh, 824) * 1px - 824px); width: 375px; height: 4874px; }
.m-rest > * { position: absolute; }
.m-hero { left: 0; top: 0; width: 375px; height: calc(var(--hh, 824) * 1px); }
.m-hero > * { position: absolute; }
.m-hero-stage {
    left: 0;
    top: 0;
    width: 375px;
    height: 800px;
    transform: translateY(calc(var(--sy, 0) * 1px));
}
.m-hero-stage > * { position: absolute; }
.mhg-glow {
    left: -32.06px;
    top: 354px;
    width: 439.125px;
    height: 431.926px;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to bottom, transparent, #000 19%, #000 86%, transparent), linear-gradient(to right, transparent, #000 13%);
    -webkit-mask-composite: source-in;
    mask-image: linear-gradient(to bottom, transparent, #000 19%, #000 86%, transparent), linear-gradient(to right, transparent, #000 13%);
    mask-composite: intersect;
}
.mhg-glow img { position: absolute; left: -18.16%; top: -1.41%; width: 149.81%; height: 101.54%; }
.m-hero-stage .hg-pic { left: 58.75px; top: 441.25px; width: 257.5px; height: 257.5px; }
.m-hero-stage .hg-3d { left: -12.5px; top: 370px; width: 400px; height: 400px; }
.m-hero-stage .hg-3d canvas { filter: drop-shadow(0 0 28px rgba(70, 110, 255, 0.5)); }
.vh-probe { position: fixed; left: 0; top: 0; width: 0; height: 100vh; height: 100svh; visibility: hidden; pointer-events: none; }

.m-hero-effect { left: 0; top: 0; width: 260px; height: 410px; }
.m-hero-effect > * { position: absolute; }
.mhe-fill--1 { background: #101e3d; filter: blur(92.122px); left: -221.47px; top: -20.34px; width: 481.593px; height: 303.834px; }
.mhe-fill--2 { background: #0b162f; filter: blur(156.616px); left: -349.89px; top: -20.34px; width: 610.018px; height: 384.491px; }
.mhe-fill--3 { background: #163681; filter: blur(156.616px); mix-blend-mode: saturation; left: -349.89px; top: -20.34px; width: 610.018px; height: 111.98px; }
.mhe-fill--4 { background: #163681; filter: blur(156.616px); mix-blend-mode: saturation; left: -349.89px; top: 0.02px; width: 610.018px; height: 399.37px; }
.mhe-ray { width: 257.549px; height: 250.213px; mix-blend-mode: plus-lighter; }
.mhe-ray img { flex: none; width: 65.071px; height: 362.296px; transform: rotate(-134deg); }
.mhe-ray--1 { left: -161.4px; top: -42.67px; }
.mhe-ray--2 { left: -45.06px; top: -113.79px; }
.mhe-beam > div { transform: rotate(-47.63deg); }
.mhe-beam--1 { left: -229.3px; top: -54.01px; width: 235.458px; height: 249.913px; }
.mhe-beam--1 > div { width: 283.163px; height: 60.408px; background: rgba(165, 243, 252, 0.25); filter: blur(46.25px); }
.mhe-beam--2 { left: -161.34px; top: -31.36px; width: 202.252px; height: 219.623px; mix-blend-mode: plus-lighter; }
.mhe-beam--2 > div { width: 283.163px; height: 15.462px; border-radius: 132.276px; opacity: .79; filter: blur(28.446px); background: linear-gradient(-0.998deg, #6dc5d8 40.06%, #6a77e8 48.11%); }
.mhe-beam--3 { left: -54.17px; top: -31.36px; width: 197.353px; height: 214.253px; mix-blend-mode: plus-lighter; }
.mhe-beam--3 > div { width: 275.894px; height: 15.462px; border-radius: 132.276px; opacity: .79; filter: blur(28.446px); background: linear-gradient(0.117deg, #6dc5d8 28.444%, #6a77e8 35.123%); }
.mhe-spark { left: -29.02px; top: -21.91px; width: 74.338px; height: 73.211px; mix-blend-mode: plus-lighter; }
.mhe-spark > div { width: 29.352px; height: 74.997px; border-radius: 72.005px; filter: blur(8.534px); transform: rotate(-134deg); background: linear-gradient(262.98deg, #fff 52.92%, rgba(255, 255, 255, 0) 53.57%); }

.m-hero-title { left: 16px; top: 136px; width: 343px; font-size: 46px; font-weight: 700; line-height: .95; letter-spacing: -0.92px; }
html[lang="ru"] .m-hero-title { font-size: 40px; }
.m-hero-lead { left: 16px; top: 282px; width: 343px; font-size: 14px; line-height: 1.3; }
.m-hero-cta {
    left: 16px;
    top: 368px;
    width: 168px;
    background: linear-gradient(186.28deg, var(--grad-a) 15.744%, var(--grad-b) 46.475%, var(--grad-c) 72.42%);
}
.m-hero-cta .btn-label { left: 66px; }
.m-hero-cta .arrow { left: 129px; }
.m-hero-cta2 { left: 196px; top: 368px; width: 150px; }
.m-hero-cta2 .btn-label { left: 75px; }
.m-hero-features { left: 16px; top: calc(var(--hh, 824) * 1px - 106px); display: grid; grid-template-columns: 150px 150px; column-gap: 27px; row-gap: 10px; }
.m-hero-features li { display: flex; align-items: center; gap: 14px; }
.m-hero-features img { width: 24px; height: 24px; flex: none; opacity: 0; }
.m-hero-features.is-in img { opacity: 1; animation: pop-in .4s cubic-bezier(.34, 1.56, .64, 1) both; }
.m-hero-features.is-in li:nth-child(2) img { animation-delay: .06s; }
.m-hero-features.is-in li:nth-child(3) img { animation-delay: .12s; }
.m-hero-features.is-in li:nth-child(4) img { animation-delay: .18s; }
.m-hero-features li > span { width: 112px; font-size: 12px; font-weight: 600; line-height: 1.3; }

.m-audience { left: 16px; top: 912px; width: 343px; height: 1087px; }
.m-audience > * { position: absolute; }
.m-tabs { position: absolute; left: 50%; top: 0; transform: translate(-50%, var(--stick-y, 0px)); display: flex; gap: 14px; z-index: 2; }
.m-tabs.is-stuck { top: 84px; transform: translateX(-50%); pointer-events: auto; }
.m-tabs::before { content: ""; position: absolute; inset: -5px; z-index: -1; border: 1px solid var(--glass-border); border-radius: 18px; background: rgba(4, 8, 26, 0.85); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); opacity: 0; transition: opacity .25s ease; pointer-events: none; }
.m-tabs.is-stuck::before { opacity: 1; }
.m-card {
    width: 166px;
    height: 186px;
    border: 1px solid var(--glass-border);
    border-radius: 12px;
    background: var(--glass-bg);
    box-shadow: var(--glass-glow);
}
.m-card > * { position: absolute; }
.m-card__icon { left: 15px; top: 15px; width: 32px; height: 32px; }
.m-card h3 { left: 15px; top: 71px; width: 134px; font-size: 18px; font-weight: 600; line-height: 1; }
.m-card p { left: 15px; top: 115px; width: 134px; font-size: 14px; font-weight: 500; line-height: 1.3; opacity: .5; }
.m-dashboard { left: 0; top: 460px; width: 342px; height: 213px; overflow: hidden; }
.m-dashboard img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.m-steps-title { left: 0; top: 713px; width: 343px; font-size: 20px; font-weight: 600; line-height: 1; }
.m-steps-track { left: 20px; top: 797px; width: 4px; height: 181px; border-radius: 46px; background: rgba(255, 255, 255, 0.15); overflow: hidden; }
.m-steps-track > div { width: 4px; height: 86px; border-radius: 46px; background: linear-gradient(113.87deg, #0759f8 0%, #de6bf9 43.576%); }
.m-steps { left: 0; top: 757px; display: flex; flex-direction: column; gap: 25px; }
.m-steps li { display: flex; align-items: flex-start; gap: 25px; }
.m-steps .steps__num { margin-top: 0; width: 44px; height: 44px; font-size: 20px; }
.m-steps .steps__num i { background-image: linear-gradient(230.37deg, var(--grad-a) 9.93%, var(--grad-b) 49.5%, var(--grad-c) 82.9%); }
.m-steps li:first-child .steps__num { position: relative; border-color: transparent; background: none; box-shadow: none; }
.m-steps li:first-child .steps__num::before { content: ""; position: absolute; inset: -5px; z-index: -1; border-radius: 50%; background: linear-gradient(206deg, var(--grad-a) 0%, var(--grad-b) 45%, var(--grad-c) 85%); filter: blur(17px); }
.m-steps li:first-child .steps__num::after { content: ""; position: absolute; inset: -1px; border: .75px solid rgba(255, 255, 255, 0.2); border-radius: 50%; background: rgba(255, 255, 255, 0.1); -webkit-backdrop-filter: blur(9px) saturate(.75) brightness(.8); backdrop-filter: blur(9px) saturate(.75) brightness(.8); box-shadow: inset 0 3px 9px 0 rgba(255, 255, 255, 0.25); }
.m-steps li:first-child .steps__num i { position: relative; z-index: 1; background-image: linear-gradient(230.37deg, #98e3f3 9.93%, #83acfb 49.5%, #eeb5fc 82.9%); }
.m-steps li > div { width: 273px; margin-top: 4px; display: flex; flex-direction: column; gap: 4px; }
.m-steps b { font-size: 16px; font-weight: 600; line-height: 1; }
.m-steps li > div > span { font-size: 14px; font-weight: 500; line-height: 1.3; opacity: .5; }
.m-steps-cta {
    left: 0;
    top: 1032px;
    width: 343px;
    background: linear-gradient(183.09deg, var(--grad-a) 15.744%, var(--grad-b) 46.475%, var(--grad-c) 72.42%);
}
.m-steps-cta .btn-label { left: 153.5px; }
.m-steps-cta .arrow { left: 227px; }

.m-blob { width: 268.702px; height: 285.928px; }
.m-blob img { position: absolute; left: -115.41%; top: -104.01%; width: 330.82%; height: 308.02%; }

.m-why-title { left: 16px; top: 2119px; width: 343px; text-align: center; font-size: 36px; font-weight: 700; line-height: .95; letter-spacing: -0.72px; }
.m-why-ring { left: -10.82px; top: 2192.18px; width: 147.643px; height: 147.643px; }
.m-why-bar { left: 84px; top: 2264px; width: 306px; height: 4px; border-radius: 46px; background: rgba(255, 255, 255, 0.15); }
.m-why-bar > div { position: absolute; left: 8px; top: 0; width: 140px; height: 4px; border-radius: 46px; background: linear-gradient(109.21deg, #0759f8 3.789%, #de6bf9 96.211%); }
.m-why-logo {
    left: 30.96px;
    top: 2233.96px;
    width: 63.476px;
    height: 63.476px;
    border: .745px solid rgba(255, 255, 255, 0.2);
    border-radius: 69.643px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(8.94px);
    -webkit-backdrop-filter: blur(8.94px);
    box-shadow: inset 0 2.98px 8.94px 0 rgba(255, 255, 255, 0.25);
}
.m-why-logo > div {
    position: absolute;
    left: calc(50% + 2.23px);
    top: calc(50% - 0.75px);
    width: 32.239px;
    height: 35.988px;
    transform: translate(-50%, -50%);
    overflow: hidden;
}
.m-why-logo img { position: absolute; left: -16.28%; top: -6.42%; width: 123.26%; height: 110.42%; }
.m-why-cards {
    left: 0;
    top: 2337px;
    width: 375px;
    height: 170px;
    padding: 0 16px;
    display: flex;
    gap: 10px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scroll-padding: 0 16px;
    scrollbar-width: none;
}
.m-why-cards::-webkit-scrollbar { display: none; }
.m-why-cards::after { content: ''; flex: none; width: 6px; }
.m-card--why { position: relative; flex: none; width: 225px; height: 170px; scroll-snap-align: start; }
.m-card--why h3 { width: 193px; }
.m-card--why p { top: 117px; width: 193px; }
.m-why-effect { left: 0; top: 2421px; width: 375px; height: 218px; overflow: hidden; -webkit-mask-image: linear-gradient(#000 60%, transparent); mask-image: linear-gradient(#000 60%, transparent); }
.m-why-effect > div { position: absolute; left: 0; top: 0; width: 626.587px; height: 218px; overflow: hidden; }
.m-why-effect video { position: absolute; left: -21%; top: -14.37%; width: 142%; height: 143.31%; object-fit: cover; }

.m-partner-title { left: 16px; top: 2627px; font-size: 46px; font-weight: 700; line-height: .95; letter-spacing: -0.92px; white-space: nowrap; }
.m-partner-lead { left: 16px; top: 2729px; font-size: 14px; line-height: 1.3; white-space: nowrap; }
.fit--mobile .partner-graphic { left: 16px; top: 2789px; width: 343px; height: 182px; }
.fit--mobile .pg-pic { width: 342.614px; height: 181.655px; }
.fit--mobile .pg-fade { top: 125.8px; width: 343px; height: 55.85px; }
.fit--mobile .m-partner-cta { left: 16px; top: 3161px; }
.m-blur-partner { left: 0; top: 3285px; width: 375px; height: 482px; }
.m-blur-partner > .fx { position: absolute; left: -194.1px; top: -99.68px; width: 642.2px; height: 581.708px; }
.m-blur-partner .fx > div { width: 531.993px; height: 362.33px; transform: rotate(-30.4deg); }
.m-blur-partner img { position: absolute; left: -31.6%; top: -43.12%; width: 165.79%; height: 170.5%; }
.m-blur-cta { left: 36px; top: 3783.29px; width: 303px; height: 256.617px; }
.m-blur-cta img { position: absolute; left: -81.23%; top: -79.44%; width: 266.02%; height: 258.2%; }

.m-contact {
    left: 10px;
    top: 3336px;
    width: 355px;
    height: 781px;
    border: 1px solid var(--glass-border);
    border-radius: 20px;
    background: var(--glass-bg);
    box-shadow: var(--glass-glow);
}
.m-contact__inner {
    position: absolute;
    left: 5px;
    right: 5px;
    top: 5px;
    height: 769px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 14px;
    background: rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
}
.m-contact__inner > *, .m-contact__form > * { position: absolute; }
.m-contact__form { inset: 0; pointer-events: none; }
.m-contact__form > * { pointer-events: auto; }
.m-contact__title { left: 23px; top: 23px; width: 295px; font-size: 36px; font-weight: 700; line-height: .95; letter-spacing: -0.72px; }
.m-contact__lead { left: 23px; top: 105px; width: 295px; font-size: 14px; line-height: 1.3; }
.m-contact__form .field-label { left: 43px; }
.m-contact__form .field { left: 23px; width: 295px; }
.m-contact-cta {
    left: 23px;
    top: 457px;
    width: 295px;
    background: linear-gradient(183.59deg, var(--grad-a) 15.744%, var(--grad-b) 46.475%, var(--grad-c) 72.42%);
}
.m-contact-cta .btn-label { left: 129.5px; }
.m-contact-cta .arrow { left: 199px; }
.m-contact__direct { left: 23px; top: 552px; font-size: 20px; font-weight: 600; line-height: 1; white-space: nowrap; }
.m-contact__note { left: 23px; top: 586px; width: 295px; font-size: 14px; font-weight: 500; line-height: 1.3; opacity: .5; }
.m-contact__icon { left: 23px; width: 24px; height: 24px; }
.m-contact__handle { left: 61px; font-size: 16px; font-weight: 600; line-height: 1; text-decoration: underline !important; white-space: nowrap; }

.m-foot-glow { left: 0; top: 4530px; width: 375px; height: 344px; overflow: hidden; }
.m-foot-glow > * { position: absolute; }
.mfg-1 { left: 92.64px; top: 93.96px; width: 580.862px; height: 415.599px; }
.mfg-1 > div { width: 535.62px; height: 337.92px; background: #101e3d; filter: blur(102.457px); transform: rotate(8.77deg); }
.mfg-ray { width: 317.962px; height: 238.664px; mix-blend-mode: plus-lighter; }
.mfg-ray img { flex: none; width: 72.371px; height: 402.941px; transform: rotate(-125.23deg); }
.mfg-ray--1 { left: 175.3px; top: 119.61px; }
.mfg-ray--2 { left: 315.23px; top: 61.16px; }
.mfg-2 { left: -62.2px; top: 72.2px; width: 735.696px; height: 526.024px; }
.mfg-2 > div { width: 678.452px; height: 427.625px; background: #0b162f; filter: blur(174.185px); transform: rotate(8.77deg); }
.mfg-3 { left: -16.01px; top: 72.2px; width: 689.508px; height: 226.482px; mix-blend-mode: saturation; }
.mfg-3 > div { width: 678.452px; height: 124.543px; background: #163681; filter: blur(174.185px); transform: rotate(8.77deg); }
.mfg-4 { left: -68.17px; top: 94.58px; width: 738.218px; height: 542.378px; mix-blend-mode: saturation; }
.mfg-4 > div { width: 678.452px; height: 444.173px; background: #163681; filter: blur(174.185px); transform: rotate(8.77deg); }
.mfg-5 { left: 105.78px; top: 87.97px; width: 287.372px; height: 249.923px; }
.mfg-5 > div { width: 314.929px; height: 67.185px; background: rgba(165, 243, 252, 0.25); filter: blur(51.438px); transform: rotate(-38.86deg); }
.mfg-6 { left: 176.63px; top: 124.39px; width: 256.006px; height: 211px; mix-blend-mode: plus-lighter; }
.mfg-6 > div { width: 314.929px; height: 17.196px; border-radius: 147.115px; opacity: .79; filter: blur(31.638px); transform: rotate(-38.86deg); background: linear-gradient(-0.998deg, #6dc5d8 40.06%, #6a77e8 48.11%); }
.mfg-7 { left: 295.34px; top: 141.72px; width: 249.711px; height: 205.927px; mix-blend-mode: plus-lighter; }
.mfg-7 > div { width: 306.845px; height: 17.196px; border-radius: 147.115px; opacity: .79; filter: blur(31.638px); transform: rotate(-38.86deg); background: linear-gradient(0.117deg, #6dc5d8 28.444%, #6a77e8 35.123%); }

.mfg-fade {
    inset: 0;
    background:
        linear-gradient(to right, #000, rgba(0, 0, 0, .6) 18%, rgba(0, 0, 0, 0) 55%),
        linear-gradient(to bottom, #000, rgba(0, 0, 0, .6) 18%, rgba(0, 0, 0, 0) 60%);
}

.m-footer { left: 0; top: 0; width: 375px; height: 4874px; pointer-events: none; }
.m-footer > * { position: absolute; pointer-events: auto; }
.m-footer__logo { left: 16px; top: 4246px; width: 108px; height: 30px; }
.m-footer__logo img { position: absolute; left: 0; top: 0; width: 30px; height: 30px; object-fit: cover; }
.m-footer__logo span { position: absolute; left: 38px; top: 8px; font-size: 16px; font-weight: 700; line-height: .95; letter-spacing: -0.32px; white-space: nowrap; }
.m-auth-login > button { display: block; font-size: 14px; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.m-auth-login .dropdown { --dx: -50%; right: auto; left: 50%; top: calc(100% + 22px); }
.m-footer .lang .dropdown { --dx: 0px; left: 0; }
.m-footer__line { left: 16px; width: 343px; height: 1px; background: rgba(255, 255, 255, 0.2); }
.m-footer__hand { left: 16px; top: 4412px; width: 24px; height: 24px; }
.m-footer__mail { left: 52px; top: 4416px; font-size: 16px; font-weight: 600; line-height: 1; text-decoration: underline !important; white-space: nowrap; }
.m-footer__head { top: 4476px; font-size: 16px; font-weight: 600; line-height: 1; white-space: nowrap; }
.m-footer__links { top: 4516px; }
.m-footer__social { top: 4680px; width: 32px; height: 32px; }
.m-footer__social img { width: 32px; height: 32px; }
.m-footer__small { left: 16px; font-size: 14px; font-weight: 500; line-height: 1.3; opacity: .5; white-space: nowrap; }
.m-footer__small--link { text-decoration: underline !important; }

.sent-pop { position: fixed; inset: 0; z-index: 100; display: flex; align-items: center; justify-content: center; }
.sent-pop[hidden] { display: none; }
.sent-pop__back { position: absolute; inset: 0; background: rgba(0, 0, 0, .4); opacity: 0; transition: opacity .3s ease; }
.sent-pop__card {
    --s: 1;
    position: relative;
    flex: none;
    width: 531px;
    height: 410px;
    border: 1px solid rgba(255, 255, 255, .05);
    border-radius: 20px;
    overflow: hidden;
    isolation: isolate;
    background: linear-gradient(200.45deg, #30c7e8 9.93%, #0759f8 49.5%, #de6bf9 82.9%);
    box-shadow: inset 0 0 40px 1px rgba(255, 255, 255, .2);
    opacity: 0;
    transform: scale(calc(var(--s) * .9));
    transition: opacity .3s ease, transform .4s cubic-bezier(.2, .9, .3, 1.2);
}
.sent-pop.is-open .sent-pop__back { opacity: 1; }
.sent-pop.is-open .sent-pop__card { opacity: 1; transform: scale(var(--s)); }
.sent-pop__glow {
    position: absolute;
    left: -134.78px;
    top: -45.66px;
    width: 774.112px;
    height: 452.264px;
    display: flex;
    align-items: center;
    justify-content: center;
    mix-blend-mode: plus-lighter;
    pointer-events: none;
    z-index: -1;
}
.sent-pop__glow > div {
    flex: none;
    width: 165.478px;
    height: 770.45px;
    border-radius: 126.563px;
    background: linear-gradient(266.13deg, #fff 52.92%, rgba(255, 255, 255, 0) 53.57%);
    filter: blur(75px);
    transform: rotate(-67.1deg);
}
.sent-pop__art { position: absolute; left: 189px; top: 59px; width: 150px; height: 150px; }
.sent-pop__pic { position: absolute; inset: 0; width: 100%; height: 100%; transition: opacity .6s ease; }
.sent-pop__art.is-3d > .sent-pop__pic { opacity: 0; }
.sent-pop__3d { position: absolute; inset: -43%; pointer-events: auto; cursor: grab; touch-action: none; user-select: none; }
.sent-pop__3d.is-dragging { cursor: grabbing; }
.sent-pop__3d canvas { display: block; width: 100%; height: 100%; opacity: 0; transition: opacity .6s ease; filter: drop-shadow(0 0 20px rgba(70, 110, 255, 0.5)); }
.sent-pop__3d.is-ready canvas { opacity: 1; }
.sent-pop.is-open .sent-pop__art { animation: hg-pop .9s cubic-bezier(.34, 1.56, .64, 1) .1s both; }
.sent-pop.is-open .sent-pop__close { animation: pop-in .45s cubic-bezier(.34, 1.56, .64, 1) .3s both; }
.sent-pop__close { position: absolute; left: 486px; top: 19px; width: 24px; height: 24px; }
.sent-pop__close img { width: 24px; height: 24px; }
.sent-pop__close:focus { outline: none; }
.sent-pop__close:focus-visible { outline: 1.5px solid rgba(255, 255, 255, .6); outline-offset: 2px; border-radius: 6px; }
.sent-pop__title {
    position: absolute;
    left: 0;
    right: 0;
    top: 249px;
    text-align: center;
    font-size: 46px;
    font-weight: 700;
    line-height: .95;
    letter-spacing: -0.92px;
}
.sent-pop__text { position: absolute; left: 0; right: 0; top: 307px; text-align: center; font-size: 16px; line-height: 1.3; }
.sent-pop__br--m { display: none; }
@media (max-width: 767px) {
    .sent-pop__card { width: 343px; height: 396px; background: linear-gradient(209.15deg, #30c7e8 9.93%, #0759f8 49.5%, #de6bf9 82.9%); }
    .sent-pop__art { left: 100.5px; top: 39px; width: 140px; height: 140px; }
    .sent-pop__close { left: 298px; }
    .sent-pop__title { left: 23px; right: auto; width: 295px; top: 219px; font-size: 36px; letter-spacing: -0.72px; }
    .sent-pop__text { left: 23px; right: auto; width: 295px; top: 301px; font-size: 14px; }
    .sent-pop__br--m { display: inline; }
    .sent-pop__br--d { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .sent-pop__back, .sent-pop__card { transition: none; }
    .sent-pop.is-open .sent-pop__art, .sent-pop.is-open .sent-pop__close { animation: none; }
}

/* ---------- Легкий режим ---------- */
html.lp-lite [data-hero-3d], html.lp-lite .fg-flow { display: none; }
html.lp-lite *, html.lp-lite *::before, html.lp-lite *::after { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
html.lp-lite .hg-fx { mix-blend-mode: normal; }
html.lp-lite .why-pulse path { filter: none; }
html.lp-lite:not([data-theme="light"]) :is(.menu__bar, .m-menu.is-open) { background: rgba(30, 47, 104, 0.82); }
html.lp-lite:not([data-theme="light"]) :is(.contact__inner, .m-contact__inner) { background: radial-gradient(70% 90% at 22% 55%, rgba(84, 92, 172, 0.9), rgba(28, 38, 94, 0.88) 75%); }
html.lp-lite[data-theme="light"] :is(.menu__bar, .contact__inner, .m-menu.is-open) { background: rgba(249, 251, 255, 0.92); }

/* ---------- iOS до 27: без filter ---------- */
html.lp-noblur .glint::before, html.lp-noblur .m-steps li:first-child .steps__num::before, html.lp-noblur :is([class*="he-fill--"], .he-beam > div, .mhe-beam > div, .he-spark > div, .mhe-spark > div, [class^="fg-"] > div, [class*=" fg-"] > div, [class*="mfg-"] > div, .sent-pop__glow > div) { filter: none; -webkit-mask-image: radial-gradient(closest-side, #000, rgba(0, 0, 0, .45) 55%, transparent); mask-image: radial-gradient(closest-side, #000, rgba(0, 0, 0, .45) 55%, transparent); }
html.lp-noblur [class*="he-fill--"] { scale: 1.7; }
html.lp-noblur :is(.fg-1, .fg-2, .fg-3, .fg-4, .mfg-1, .mfg-2, .mfg-3, .mfg-4) > div { transform: rotate(8.77deg) scale(1.7); }
html.lp-noblur :is(.hg-3d canvas, .sent-pop__3d canvas) { filter: none; }
html.lp-noblur :is(.he-spark > div, .mhe-spark > div, .sg-spark > div) { opacity: .45; }
html.lp-noblur .why-pulse, html.lp-lite .why-pulse { filter: none; }
