body{margin:0}
.yl{--bg:#FFFFFF;--bg2:#F4F4F7;--card:#FFFFFF;--line:#E3E4EE;--ink:#07070B;--ink2:#3E4057;--ink3:#62657C;--blue:#4F6BFF;--bt:#3D58F2;--btn:#3D58F2;--glass:rgba(255,255,255,.78);--shadow:0 40px 80px -40px rgba(46,63,184,.45);font-family:Archivo,Arial,sans-serif;background:var(--bg);color:var(--ink);transition:background .6s,color .6s;position:relative;overflow:hidden;min-height:100vh}
.yl.dark{--bg:#000000;--bg2:#07070B;--card:#13131C;--line:#26263A;--ink:#F4F4F7;--ink2:#C9CADB;--ink3:#A6A8BC;--bt:#6D80FF;--glass:rgba(7,7,11,.72);--shadow:0 40px 80px -40px rgba(79,107,255,.6)}
.h{font-family:'Archivo Black','Arial Black',sans-serif;text-transform:uppercase;letter-spacing:-.015em;line-height:.94;margin:0;font-weight:400}
.k{font-weight:700;text-transform:uppercase;letter-spacing:.2em;font-size:12px;color:var(--bt);margin:0}
.b{color:var(--blue)}
.p{color:var(--ink2);font-size:18px;line-height:1.6;margin:0}
.yl a{color:var(--bt)} .yl a:hover{color:var(--blue)}
.wrap{max-width:1240px;margin:0 auto;padding:0 32px;box-sizing:border-box}
.yl .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 28px;border-radius:999px;background:var(--btn);color:#FFFFFF;font-weight:700;font-size:16px;text-decoration:none;border:0;cursor:pointer;font-family:inherit;transition:transform .35s cubic-bezier(.2,.9,.2,1),box-shadow .35s,opacity .3s;box-shadow:0 14px 34px -12px rgba(61,88,242,.75)}
.yl .btn:hover{transform:translateY(-3px) scale(1.04);color:#FFFFFF;box-shadow:0 22px 44px -14px rgba(61,88,242,.9)}
.yl .btn:disabled{opacity:.4;cursor:not-allowed;transform:none}
.yl .btn2{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 26px;border-radius:999px;background:transparent;color:var(--ink);font-weight:700;font-size:16px;text-decoration:none;border:1.5px solid var(--line);cursor:pointer;font-family:inherit;transition:border-color .3s,transform .3s}
.yl .btn2:hover{border-color:var(--blue);color:var(--ink);transform:translateY(-2px)}
.card{background:var(--card);border:1px solid var(--line);border-radius:28px;transition:transform .5s cubic-bezier(.2,.9,.2,1),box-shadow .5s,border-color .5s}
.card:hover{transform:translateY(-8px);box-shadow:var(--shadow);border-color:var(--blue)}
.flat:hover{transform:none;box-shadow:none;border-color:var(--line)}
.nl{display:flex;gap:30px;align-items:center}
.yl .nl a{color:var(--ink);text-decoration:none;font-weight:600;font-size:15px}
.yl .nl a:hover,.yl .nl a.on{color:var(--blue)}
.g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.heroh{font-size:clamp(52px,8vw,124px)}
.sh{font-size:clamp(40px,5.4vw,80px)}
@media(max-width:960px){.nl{display:none}.g2,.g3,.g4{grid-template-columns:minmax(0,1fr)}.stage{display:none}}
@keyframes up{from{opacity:0;transform:translateY(48px)}to{opacity:1;transform:none}}
.rv{animation:up 1s cubic-bezier(.2,.9,.2,1) both}
.d1{animation-delay:.12s}.d2{animation-delay:.24s}.d3{animation-delay:.36s}.d4{animation-delay:.48s}
@keyframes fa{0%,100%{transform:translate3d(0,0,0) rotate(-1.5deg)}50%{transform:translate3d(0,-22px,0) rotate(1.5deg)}}
@keyframes fb{0%,100%{transform:translate3d(0,-10px,0) rotate(2deg)}50%{transform:translate3d(0,16px,0) rotate(-1deg)}}
@keyframes fc{0%,100%{transform:translate3d(0,6px,0)}50%{transform:translate3d(8px,-14px,0)}}
.fa{animation:fa 7s ease-in-out infinite}.fb{animation:fb 8.5s ease-in-out infinite}.fc{animation:fc 6s ease-in-out infinite}
@keyframes mq{to{transform:translateX(-50%)}}
.mq{display:flex;gap:72px;width:max-content;animation:mq 34s linear infinite;align-items:center}
@keyframes spinY{to{transform:rotateY(360deg)}}
.spin{animation:spinY 9s linear infinite;transform-style:preserve-3d}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(79,107,255,.55)}100%{box-shadow:0 0 0 18px rgba(79,107,255,0)}}
.live{display:inline-block;width:10px;height:10px;border-radius:50%;background:#22C55E;animation:pulse 1.8s infinite;flex:none}
.cur{position:absolute;left:0;top:0;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#4F6BFF;pointer-events:none;z-index:200;transition:transform .06s linear}
.cur2{position:absolute;left:0;top:0;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;border:1.5px solid #4F6BFF;pointer-events:none;z-index:199;transition:transform .32s cubic-bezier(.2,.9,.2,1)}
.phone{width:230px;height:470px;border-radius:40px;background:#07070B;padding:9px;box-sizing:border-box;box-shadow:0 50px 90px -40px rgba(7,7,11,.6),0 0 0 1px rgba(255,255,255,.08) inset;flex:none}
.phone video,.phone img{width:100%;height:100%;object-fit:cover;border-radius:32px;display:block}
.chip{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:999px;background:var(--glass);backdrop-filter:blur(14px);border:1px solid var(--line);font-weight:700;font-size:14px;color:var(--ink);box-shadow:var(--shadow);white-space:nowrap}
.tog{width:64px;height:34px;border-radius:999px;border:1px solid var(--line);background:var(--bg2);position:relative;cursor:pointer;padding:0;flex:none}
.knob{position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;background:#4F6BFF;transition:transform .45s cubic-bezier(.2,.9,.2,1)}
.dark .knob{transform:translateX(30px)}
.faqq{width:100%;display:flex;justify-content:space-between;align-items:center;gap:24px;background:none;border:0;padding:26px 0;font:inherit;font-weight:700;font-size:20px;color:var(--ink);cursor:pointer;text-align:left}
.ph{border:2px dashed var(--line);border-radius:28px;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--ink3);font-weight:600;font-size:14px;padding:24px;box-sizing:border-box;background:var(--bg2)}
.grad{background:linear-gradient(135deg,#000000 0%,#4F6BFF 55%,#FFFFFF 100%)}
.tilt{transition:transform .6s cubic-bezier(.2,.9,.2,1)}
.tilt:hover{transform:perspective(900px) rotateY(-6deg) rotateX(4deg) scale(1.02)}
.fab{position:fixed!important;right:24px;bottom:24px;z-index:150}
.pill{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;border:1.5px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-weight:700;font-size:15px;cursor:pointer;transition:all .3s}
.pill.on{background:var(--btn);border-color:var(--btn);color:#FFFFFF}
.pill:hover{border-color:var(--blue)}
.tick{display:flex;gap:12px;align-items:flex-start;font-size:16px;line-height:1.5;color:var(--ink2)}
.tick::before{content:'';flex:none;width:7px;height:13px;margin:3px 7px 0 5px;border:solid #4F6BFF;border-width:0 3px 3px 0;transform:rotate(45deg)}
.vid{width:100%;height:100%;object-fit:cover;display:block}
input,textarea,select{font:inherit}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
