:root{--bg: #06080f;--ink: #eef2fb;--muted: #9aa7c2;--blue: #3b82f6;--blue-2: #2563eb;--cta: #f97316;--cta-2: #fb923c;--glass: rgba(9, 13, 24, .66);--border: rgba(255, 255, 255, .12);--ease: cubic-bezier(.16, .84, .3, 1);font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--ink);overflow-x:hidden;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}::selection{background:var(--blue);color:#fff}::-webkit-scrollbar{width:0;height:0}.bg3d{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0}.bg3d canvas{display:block}.scroll-spacer{position:relative;z-index:1;width:100%}.scrollbar-top{position:fixed;top:0;left:0;height:3px;width:0%;background:linear-gradient(90deg,var(--blue),var(--cta));z-index:60;box-shadow:0 0 12px #3b82f699;transition:width .1s linear}.nav{position:fixed;top:14px;left:50%;transform:translate(-50%);width:min(1180px,calc(100vw - 28px));z-index:40;display:flex;align-items:center;justify-content:space-between;padding:9px 12px 9px 14px;border-radius:14px;background:var(--glass);border:1px solid var(--border);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 10px 34px #0006}.brand{display:flex;align-items:center;gap:9px;font-weight:800;font-size:17px}.brand .logo{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(135deg,var(--blue),var(--blue-2));color:#fff;font-weight:900;box-shadow:0 0 16px #2563eb80}.brand b{color:var(--blue)}.nav-links{display:flex;gap:4px;align-items:center}.nav-links button{font:inherit;font-size:13.5px;font-weight:600;color:var(--muted);padding:8px 13px;border-radius:9px;transition:color .2s,background .2s;cursor:pointer;background:none;border:none}.nav-links button:hover,.nav-links button.active{color:var(--ink);background:#ffffff12}.nav-links button.active{color:var(--blue)}.btn{display:inline-flex;align-items:center;gap:8px;cursor:pointer;padding:11px 17px;border-radius:11px;border:none;font-weight:700;font-size:13.5px;transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .25s}.btn svg{width:16px;height:16px}.btn-primary{color:#0a1020;background:linear-gradient(135deg,var(--cta-2),var(--cta));box-shadow:0 8px 20px #f9731659}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 13px 28px #f9731680}.btn-ghost{color:var(--ink);background:#ffffff12;border:1px solid var(--border)}.btn-ghost:hover{transform:translateY(-2px);background:#ffffff21}.hint{position:fixed;top:68px;right:18px;z-index:30;display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--muted);padding:8px 13px;border-radius:30px;background:var(--glass);border:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.hint .dot{width:7px;height:7px;border-radius:50%;background:var(--cta);box-shadow:0 0 10px var(--cta);animation:pulse 1.8s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}.pop{position:fixed;z-index:20;width:min(330px,calc(100vw - 28px));padding:18px 20px;border-radius:16px;background:linear-gradient(180deg,#090d18d6,#090d188f);border:1px solid var(--border);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 22px 55px #0000008c;will-change:opacity,transform}.pop.intro{width:min(440px,calc(100vw - 28px))}.pop:after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;border-radius:4px 0 0 4px;background:linear-gradient(180deg,var(--blue),var(--cta))}.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--blue);margin-bottom:11px}.eyebrow:before{content:"";width:18px;height:2px;background:var(--blue);border-radius:2px}.pop h1{font-size:clamp(28px,4.2vw,42px);font-weight:900;line-height:1.02;letter-spacing:-1.4px}.pop h1 .grad{background:linear-gradient(120deg,var(--blue),#7cc4ff 45%,var(--cta));-webkit-background-clip:text;background-clip:text;color:transparent}.pop h3{font-size:17px;font-weight:700}.pop p{margin-top:10px;color:#c4cde0;font-size:14px;line-height:1.55}.pop .actions{margin-top:18px;display:flex;gap:10px;flex-wrap:wrap}.pop .stats{margin-top:16px;display:flex;gap:22px;flex-wrap:wrap}.pop .stats .s b{font-size:24px;font-weight:800;display:block;line-height:1}.pop .stats .s span{font-size:11.5px;color:var(--muted)}.svc-head{display:flex;align-items:center;gap:12px}.svc-head .ico{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#3b82f647,#2563eb1a);border:1px solid rgba(59,130,246,.35);flex:none}.svc-head .ico svg{width:23px;height:23px;stroke:var(--blue);fill:none;stroke-width:1.8}.svc-head .tag{font-size:10.5px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--cta)}.pop.work{padding:0;overflow:hidden}.pop.work:after{display:none}.pop .thumb{position:relative;width:100%;aspect-ratio:16 / 10}.pop .thumb .img{position:absolute;top:0;right:0;bottom:0;left:0}.pop .thumb .vgn{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,transparent 35%,rgba(4,6,12,.92))}.pop .thumb .meta{position:absolute;left:16px;right:16px;bottom:13px;z-index:2}.pop .thumb .meta .tag{font-size:10.5px;font-weight:700;letter-spacing:1.5px;color:var(--cta);text-transform:uppercase}.pop .thumb .meta h4{font-size:18px;font-weight:700;margin-top:3px}.field{margin-top:10px}.field label{display:block;font-size:12px;font-weight:600;color:#b9c4dc;margin-bottom:5px}.field input,.field textarea{width:100%;padding:10px 12px;border-radius:10px;font:inherit;font-size:14px;color:var(--ink);background:#0000004d;border:1px solid var(--border);transition:border-color .2s,box-shadow .2s}.field input:focus,.field textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px #3b82f62e}.field textarea{resize:vertical;min-height:66px}.ok{margin-top:11px;padding:10px;border-radius:10px;text-align:center;font-weight:600;font-size:13px;color:#7bdca0;background:#22c55e1f;border:1px solid rgba(34,197,94,.3)}.marquee{position:fixed;left:0;right:0;bottom:0;z-index:15;height:40px;display:flex;align-items:center;overflow:hidden;background:linear-gradient(0deg,rgba(4,6,12,.85),transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);pointer-events:none}.marquee-row{display:flex;width:max-content;gap:30px;animation:scrollX 40s linear infinite;padding-left:30px}.chip{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-weight:600;font-size:13px;color:#aeb9d2}.chip .dot{width:6px;height:6px;border-radius:50%;background:var(--blue)}@keyframes scrollX{0%{transform:translate(0)}to{transform:translate(-50%)}}.loader{position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;display:grid;place-items:center;background:var(--bg);transition:opacity .6s ease}.loader .ring{width:48px;height:48px;border:3px solid rgba(59,130,246,.2);border-top-color:var(--blue);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 720px){.nav-links,.hint{display:none}.pop,.pop.intro{width:calc(100vw - 24px)}}.lights-btn{position:fixed;right:18px;bottom:56px;z-index:30;display:inline-flex;align-items:center;gap:9px;cursor:pointer;padding:11px 18px;border-radius:30px;font:inherit;font-weight:700;font-size:13.5px;color:var(--ink);background:var(--glass);border:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 10px 30px #00000073;transition:transform .18s var(--ease),box-shadow .25s,background .25s,color .25s,border-color .25s}.lights-btn svg{width:18px;height:18px}.lights-btn:hover{transform:translateY(-2px)}.lights-btn.on{color:#0a1020;background:linear-gradient(135deg,#ffe24a,#f7a800);border-color:transparent;box-shadow:0 0 26px #ffd23c99,0 10px 30px #0006}@media (max-width: 720px){.lights-btn{bottom:50px;right:12px;padding:9px 14px;font-size:12.5px}}@media (max-width: 720px){.nav{top:8px;padding:7px 10px 7px 12px}.nav-links{display:none}.brand{font-size:15px}.brand .logo{width:27px;height:27px}.nav .btn-primary{padding:8px 12px;font-size:12px}.hint{display:none}.pop{left:10px!important;right:10px!important;top:auto!important;bottom:88px!important;width:auto!important;max-height:38vh;overflow-y:auto;padding:14px 16px}.pop.intro{width:auto!important}.pop h1{font-size:clamp(23px,7.4vw,31px)}.pop p{font-size:13.5px}.pop.work .thumb{aspect-ratio:16 / 7}.lights-btn{bottom:44px;right:10px;padding:9px 13px;font-size:12.5px}.marquee{height:32px}}@media (max-width: 720px){.bg3d{inset:0 0 auto 0;height:56vh;z-index:5;border-bottom:1px solid var(--border)}.scroll-spacer{display:none}.lights-btn{top:calc(56vh - 54px);bottom:auto;right:12px}.marquee{display:none}.m-flow{position:relative;z-index:2;margin-top:56vh;padding:16px 12px 40px;display:flex;flex-direction:column;gap:13px}.m-card{background:linear-gradient(180deg,#090d18eb,#090d18b8);border:1px solid var(--border);border-radius:16px;padding:16px 17px;box-shadow:0 14px 38px #00000080;opacity:0;transform:translateY(26px);transition:opacity .6s var(--ease),transform .6s var(--ease)}.m-card.in{opacity:1;transform:none}.m-card h1{font-size:clamp(26px,8vw,36px);font-weight:900;line-height:1.04;letter-spacing:-1px}.m-card h1 .grad{background:linear-gradient(120deg,var(--blue),#7cc4ff 45%,var(--cta));-webkit-background-clip:text;background-clip:text;color:transparent}.m-card h3{font-size:17px;font-weight:700}.m-card p{margin-top:9px;color:#c4cde0;font-size:14px;line-height:1.55}.m-card .actions{margin-top:16px;display:flex;gap:10px;flex-wrap:wrap}.m-card .stats{margin-top:14px;display:flex;gap:22px;flex-wrap:wrap}.m-card .stats .s b{font-size:24px;font-weight:800;display:block;line-height:1}.m-card .stats .s span{font-size:11.5px;color:var(--muted)}.m-works{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:12px}.mwork{position:relative;overflow:hidden;border-radius:11px;aspect-ratio:16 / 11;border:1px solid var(--border)}.mwork .img{position:absolute;top:0;right:0;bottom:0;left:0}.mwork .vgn{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,transparent 35%,rgba(4,6,12,.92))}.mwork .meta{position:absolute;left:9px;right:9px;bottom:7px;z-index:2}.mwork .meta .tag{font-size:8.5px;font-weight:700;letter-spacing:1px;color:var(--cta);text-transform:uppercase}.mwork .meta h4{font-size:11.5px;font-weight:700;margin-top:1px}}
