*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
    --pri:#6366f1;--pri-l:#818cf8;--pri-d:#4f46e5;
    --acc:#ec4899;--acc-l:#f472b6;
    --cyan:#06b6d4;--cyan-l:#22d3ee;
    --green:#10b981;--green-l:#34d399;
    --amber:#f59e0b;--amber-l:#fbbf24;
    --violet:#8b5cf6;--violet-l:#a78bfa;
    --orange:#f97316;--orange-l:#fb923c;
    --bg:#050507;--bg2:#0a0a0f;
    --card:rgba(20,20,30,.4);--card-h:rgba(30,30,44,.5);
    --tx:#fafafa;--tx2:#a1a1aa;--tx3:#71717a;
    --brd:rgba(99,102,241,.09);--brd-l:rgba(129,140,248,.22);
    --r:16px;--r-sm:10px;--r-xs:6px;
}
html{scroll-behavior:smooth}
::selection{background:rgba(99,102,241,.3);color:#fff}
body{
    font-family:'Inter','Noto Sans SC',-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;
    background:var(--bg);color:var(--tx);line-height:1.6;overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
}
body::after{
    content:'';position:fixed;inset:0;pointer-events:none;z-index:0;
    background:
        radial-gradient(ellipse 80% 50% at 50% 0%,rgba(99,102,241,.08),transparent),
        radial-gradient(ellipse 60% 40% at 75% 35%,rgba(139,92,246,.06),transparent),
        radial-gradient(ellipse 70% 50% at 25% 75%,rgba(6,182,212,.05),transparent),
        radial-gradient(ellipse 50% 40% at 20% 50%,rgba(236,72,153,.04),transparent),
        radial-gradient(ellipse 60% 30% at 80% 80%,rgba(16,185,129,.03),transparent);
}
#particles{position:fixed;inset:0;z-index:0;pointer-events:none}
#neural-net{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.85}
#math-curves{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:1}
.noise-overlay{
    position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.025;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ===== NAV ===== */
.navbar{
    position:fixed;top:0;width:100%;z-index:100;
    background:rgba(9,9,11,.35);backdrop-filter:blur(24px);
    border-bottom:1px solid transparent;
    transition:all .4s cubic-bezier(.16,1,.3,1);
}
.navbar.scrolled{background:rgba(9,9,11,.92);border-bottom-color:var(--brd)}
.nav-inner{max-width:1200px;margin:0 auto;padding:.85rem 2rem;display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:.65rem;text-decoration:none}
.logo span{font-size:1.05rem;font-weight:700;background:linear-gradient(135deg,#fff,#c7d2fe);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.nav-links{display:flex;list-style:none;gap:2rem}
.nav-links a{
    color:var(--tx3);text-decoration:none;font-size:.85rem;font-weight:500;
    transition:color .3s;position:relative;padding:.3rem 0;
}
.nav-links a:hover{color:var(--tx)}
.nav-links a::after{
    content:'';position:absolute;bottom:0;left:50%;width:0;height:2px;
    background:linear-gradient(90deg,var(--pri),var(--acc));
    transition:all .3s;transform:translateX(-50%);border-radius:1px;
}
.nav-links a:hover::after{width:100%}
.nav-right{display:flex;align-items:center;gap:.7rem}
.lang-switcher{display:flex;gap:.35rem}
.lang-btn{
    background:rgba(99,102,241,.03);border:1px solid rgba(99,102,241,.06);
    color:var(--tx3);padding:.3rem .65rem;border-radius:var(--r-xs);
    font-size:.72rem;cursor:pointer;transition:all .3s;font-family:inherit;font-weight:500;
    backdrop-filter:blur(6px);
}
.lang-btn:hover{background:rgba(99,102,241,.12);color:var(--tx2)}
.lang-btn.active{background:var(--pri);border-color:var(--pri);color:#fff}
.hamburger{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:4px}
.hamburger span{display:block;width:20px;height:2px;background:var(--tx);border-radius:2px;transition:.3s}

/* ===== HERO ===== */
.hero{min-height:100vh;display:flex;align-items:center;position:relative;overflow:hidden;padding:7rem 0 3rem}
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.grid-lines{
    position:absolute;inset:0;
    background-image:linear-gradient(rgba(99,102,241,.03) 1px,transparent 1px),
                      linear-gradient(90deg,rgba(99,102,241,.03) 1px,transparent 1px);
    background-size:50px 50px;
    mask-image:radial-gradient(ellipse at 40% 45%,#000 0%,transparent 60%);
    -webkit-mask-image:radial-gradient(ellipse at 40% 45%,#000 0%,transparent 60%);
}
.glow{position:absolute;border-radius:50%;filter:blur(120px);pointer-events:none;opacity:.3;will-change:transform,opacity}
.glow-1{width:600px;height:600px;background:var(--pri);top:-20%;right:-10%;animation:glowPulse 10s ease-in-out infinite}
.glow-2{width:400px;height:400px;background:var(--acc);bottom:0;left:5%;animation:glowPulse 10s ease-in-out 3s infinite}
.glow-3{width:300px;height:300px;background:var(--cyan);top:25%;left:40%;animation:glowPulse 10s ease-in-out 6s infinite}
@keyframes glowPulse{0%,100%{opacity:.25;transform:scale(1)}50%{opacity:.5;transform:scale(1.1)}}

.hero-inner{
    max-width:1200px;margin:0 auto;padding:0 2rem;width:100%;
    display:flex;align-items:center;justify-content:space-between;gap:4rem;
    position:relative;z-index:1;
}
.hero-left{max-width:540px;flex:1}
.hero-badge{
    display:inline-flex;align-items:center;gap:.5rem;
    padding:.4rem 1rem;background:rgba(99,102,241,.04);
    border:1px solid rgba(99,102,241,.1);border-radius:100px;
    font-size:.75rem;color:var(--pri-l);font-weight:600;letter-spacing:.5px;margin-bottom:2rem;
    backdrop-filter:blur(8px);
    position:relative;
}
.hero-badge::before{
    content:'';position:absolute;inset:-1px;border-radius:inherit;
    background:linear-gradient(90deg,var(--pri),var(--acc),var(--cyan));
    opacity:.3;z-index:-1;
    animation:borderGlow 4s ease-in-out infinite alternate;
}
@keyframes borderGlow{0%{opacity:.2;filter:hue-rotate(0deg)}100%{opacity:.4;filter:hue-rotate(20deg)}}
.badge-dot{width:6px;height:6px;border-radius:50%;background:var(--pri);animation:dotPulse 2s ease-in-out infinite}
@keyframes dotPulse{0%,100%{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.1)}}
.hero-h1{font-size:clamp(2.4rem,5.5vw,3.8rem);font-weight:900;line-height:1.05;margin-bottom:1.5rem;letter-spacing:-.03em}
.h1-line{display:block}
.h1-w{background:linear-gradient(135deg,#fff 0%,#d4d4fa 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.h1-g{background:linear-gradient(135deg,var(--pri) 0%,var(--acc) 50%,var(--cyan-l) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-desc{font-size:1.02rem;color:var(--tx2);margin-bottom:2.5rem;line-height:1.85;max-width:500px}
.hero-cta{display:flex;gap:1rem;flex-wrap:wrap}
.btn-p,.btn-g{padding:.8rem 1.8rem;border-radius:var(--r-sm);font-size:.88rem;font-weight:600;text-decoration:none;transition:all .35s cubic-bezier(.16,1,.3,1);cursor:pointer;display:inline-flex;align-items:center;gap:.45rem;border:none;font-family:inherit}
.btn-p{
    background:linear-gradient(135deg,var(--pri),var(--acc));color:#fff;
    box-shadow:0 4px 20px rgba(99,102,241,.3);position:relative;overflow:hidden;
}
.btn-p::before{
    content:'';position:absolute;inset:0;
    background:linear-gradient(135deg,rgba(255,255,255,.15),transparent 60%);
    opacity:0;transition:opacity .3s;
}
.btn-p:hover::before{opacity:1}
.btn-p:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(99,102,241,.5)}
.btn-g{background:rgba(255,255,255,.03);color:var(--tx2);border:1px solid var(--brd);position:relative;overflow:hidden}
.btn-g::before{
    content:'';position:absolute;inset:0;
    background:linear-gradient(135deg,rgba(99,102,241,.1),rgba(236,72,153,.05));
    opacity:0;transition:opacity .3s;
}
.btn-g:hover::before{opacity:1}
.btn-g:hover{color:var(--tx);border-color:var(--brd-l);background:rgba(99,102,241,.06)}

/* Hero cards */
.hero-right{flex:1;max-width:440px;position:relative}
.hero-cards{display:flex;flex-direction:column;gap:.85rem}
.hcard{
    display:flex;align-items:center;gap:1rem;
    background:rgba(10,10,20,.35);backdrop-filter:blur(32px) saturate(1.4);
    border:1px solid rgba(255,255,255,.1);border-radius:var(--r);
    padding:.95rem 1.25rem;text-decoration:none;color:inherit;
    transition:all .4s cubic-bezier(.22,1,.36,1);
    opacity:0;animation:hcardIn .8s ease forwards;position:relative;overflow:hidden;
    box-shadow:0 4px 20px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.08);
}
.hcard::before{
    content:'';position:absolute;inset:0;border-radius:var(--r);
    background:linear-gradient(135deg,rgba(99,102,241,.06),transparent 60%);
    opacity:0;transition:opacity .4s;pointer-events:none;
}
.hcard:hover::before{opacity:1}
.hcard:nth-child(1){animation-delay:.15s;transform:translateX(20px)}
.hcard:nth-child(2){animation-delay:.3s;transform:translateX(35px)}
.hcard:nth-child(3){animation-delay:.45s;transform:translateX(50px)}
.hcard:nth-child(4){animation-delay:.6s;transform:translateX(65px)}
@keyframes hcardIn{to{opacity:1;transform:translateX(0)}}
.hcard:hover{
    border-color:var(--brd-l);transform:translateX(6px) scale(1.015) !important;
    box-shadow:0 12px 40px rgba(0,0,0,.3),0 0 0 1px rgba(99,102,241,.1);
}
.hcard-1:hover{border-color:rgba(139,92,246,.4) !important;box-shadow:0 12px 40px rgba(0,0,0,.3),0 4px 20px rgba(139,92,246,.12) !important}
.hcard-2:hover{border-color:rgba(6,182,212,.4) !important;box-shadow:0 12px 40px rgba(0,0,0,.3),0 4px 20px rgba(6,182,212,.12) !important}
.hcard-3:hover{border-color:rgba(236,72,153,.4) !important;box-shadow:0 12px 40px rgba(0,0,0,.3),0 4px 20px rgba(236,72,153,.12) !important}
.hcard-4:hover{border-color:rgba(16,185,129,.4) !important;box-shadow:0 12px 40px rgba(0,0,0,.3),0 4px 20px rgba(16,185,129,.12) !important}
.hcard-2:hover{border-color:rgba(6,182,212,.3)}
.hcard-3:hover{border-color:rgba(236,72,153,.3)}
.hcard-4:hover{border-color:rgba(16,185,129,.3)}
.hcard-icon{flex-shrink:0;width:48px;height:48px}
.hcard-icon .pcard-icon-wrap{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center}
.hcard-1 .pcard-icon-wrap{background:rgba(139,92,246,.1)}
.hcard-2 .pcard-icon-wrap{background:rgba(6,182,212,.1)}
.hcard-3 .pcard-icon-wrap{background:rgba(236,72,153,.1)}
.hcard-4 .pcard-icon-wrap{background:rgba(16,185,129,.1)}
.hcard-text{flex:1;min-width:0}
.hcard-text strong{display:block;font-size:.9rem;font-weight:700;color:var(--tx);margin-bottom:1px}
.hcard-text small{font-size:.75rem;color:var(--tx3)}
.hcard-arrow{color:var(--pri-l);font-size:1rem;transition:transform .3s;flex-shrink:0}
.hcard:hover .hcard-arrow{transform:translateX(3px)}
.hcard-soon{
    font-size:.6rem;font-weight:600;color:var(--acc-l);
    background:rgba(236,72,153,.08);border:1px solid rgba(236,72,153,.15);
    padding:.2rem .5rem;border-radius:var(--r-xs);letter-spacing:.3px;
}
.hero-scroll{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);z-index:1}
.scroll-line{
    width:1px;height:40px;margin:0 auto;
    background:linear-gradient(to bottom,var(--pri-l),transparent);
    animation:scrollPulse 2.5s ease-in-out infinite;
}
@keyframes scrollPulse{0%,100%{opacity:.3;height:25px}50%{opacity:.7;height:40px}}
.scroll-label{
    display:block;text-align:center;font-size:.65rem;color:var(--tx3);
    margin-top:.5rem;letter-spacing:1px;text-transform:uppercase;
}

/* ===== SECTION DIVIDERS ===== */
.section-divider{height:1px;position:relative;z-index:1;overflow:visible}
.section-divider::after{
    content:'';position:absolute;left:0;right:0;top:0;height:1px;
    background:linear-gradient(90deg,transparent,var(--pri),var(--acc),var(--cyan),transparent);
    opacity:.25;
}
.section-divider.products-divider::after{
    background:linear-gradient(90deg,transparent,rgba(139,92,246,.6),rgba(6,182,212,.6),rgba(168,85,247,.6),transparent);
    opacity:.35;
}
.section-divider.about-divider::after{
    background:linear-gradient(90deg,transparent,rgba(236,72,153,.6),rgba(245,158,11,.6),rgba(236,72,153,.6),transparent);
    opacity:.35;
}
.section-divider.contact-divider::after{
    background:linear-gradient(90deg,transparent,var(--cyan),var(--pri),var(--acc),transparent);
    opacity:.35;
}

/* ===== SECTIONS ===== */
.sec-inner{max-width:1200px;margin:0 auto;padding:0 2rem;position:relative;z-index:1}
.sec-head{text-align:center;margin-bottom:4.5rem}
.sec-tag{
    display:inline-flex;align-items:center;gap:.5rem;
    font-size:.68rem;font-weight:700;color:var(--pri-l);
    letter-spacing:2.5px;text-transform:uppercase;margin-bottom:.8rem;
    padding:.35rem .9rem;border-radius:var(--r-xs);
    background:rgba(99,102,241,.03);border:1px solid rgba(99,102,241,.06);
    backdrop-filter:blur(8px);
}
.products .sec-tag{color:var(--cyan-l);background:rgba(6,182,212,.04);border-color:rgba(6,182,212,.08)}
.about .sec-tag{color:var(--acc-l);background:rgba(236,72,153,.04);border-color:rgba(236,72,153,.08)}
.contact .sec-tag{color:var(--green-l);background:rgba(16,185,129,.04);border-color:rgba(16,185,129,.08)}
.sec-title{
    font-size:clamp(1.8rem,3.8vw,2.8rem);font-weight:800;margin-bottom:.8rem;
    letter-spacing:-.02em;
    background:linear-gradient(135deg,#fff 0%,#a5b4fc 50%,#fff 100%);
    background-size:200% 100%;-webkit-background-clip:text;
    -webkit-text-fill-color:transparent;background-clip:text;
    animation:titleShimmer 6s ease-in-out infinite;
}
@keyframes titleShimmer{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.sec-sub{font-size:1.05rem;color:var(--tx2);max-width:600px;margin:0 auto}

/* ===== PRODUCTS ===== */
.products{padding:7rem 0;position:relative}
.products,.about,.contact{overflow:hidden}
.section-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.blob{position:absolute;border-radius:50%;filter:blur(140px);opacity:.35;will-change:transform}
.blob-p1{width:550px;height:550px;background:rgba(6,182,212,.12);top:5%;left:-8%;animation:blobFloat1 20s ease-in-out infinite}
.blob-p2{width:450px;height:450px;background:rgba(139,92,246,.12);bottom:5%;right:-5%;animation:blobFloat2 18s ease-in-out infinite}
.blob-p3{width:350px;height:350px;background:rgba(99,102,241,.08);top:45%;left:50%;animation:blobFloat3 15s ease-in-out infinite}
@keyframes blobFloat1{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(70px,-50px) scale(1.08)}66%{transform:translate(-30px,35px) scale(.95)}}
@keyframes blobFloat2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-60px,40px) scale(1.12)}}
@keyframes blobFloat3{0%,100%{transform:translate(0,0) scale(1)}25%{transform:translate(40px,25px) scale(1.06)}75%{transform:translate(-50px,-30px) scale(.94)}}

.pgrid{display:grid;gap:1.6rem}
.pgrid-4{grid-template-columns:repeat(2,1fr)}
.pcard{
    position:relative;background:rgba(10,10,20,.35);backdrop-filter:blur(32px) saturate(1.4);
    border:1px solid rgba(255,255,255,.1);border-radius:var(--r);padding:2rem;
    transition:all .45s cubic-bezier(.22,1,.36,1);overflow:hidden;
    text-decoration:none;color:inherit;display:flex;flex-direction:column;
    box-shadow:0 8px 32px rgba(0,0,0,.15),inset 0 1px 0 rgba(255,255,255,.08);
}
.pcard::before{
    content:'';position:absolute;inset:0;border-radius:var(--r);
    background:linear-gradient(160deg,rgba(255,255,255,.1),transparent 55%);
    pointer-events:none;z-index:1;
}
.pcard-glow{
    position:absolute;top:-60%;left:-60%;width:220%;height:220%;
    background:radial-gradient(circle,rgba(99,102,241,.08),transparent 70%);
    opacity:0;transition:opacity .4s;pointer-events:none;z-index:0;
}
.pcard:hover .pcard-glow{opacity:1}
.pcard:hover{
    transform:translateY(-6px);
    box-shadow:0 24px 64px rgba(0,0,0,.35),0 0 0 1px rgba(99,102,241,.08);
}
.pcard-hub:hover{border-color:rgba(139,92,246,.35);box-shadow:0 24px 64px rgba(0,0,0,.35),0 0 0 1px rgba(139,92,246,.15),0 12px 40px rgba(139,92,246,.08)}
.pcard-hub .pcard-glow{background:radial-gradient(circle,rgba(139,92,246,.1),transparent 70%)}
.pcard-wan:hover{border-color:rgba(6,182,212,.35);box-shadow:0 24px 64px rgba(0,0,0,.35),0 0 0 1px rgba(6,182,212,.15),0 12px 40px rgba(6,182,212,.08)}
.pcard-wan .pcard-glow{background:radial-gradient(circle,rgba(6,182,212,.1),transparent 70%)}
.pcard-comic:hover{border-color:rgba(236,72,153,.35);box-shadow:0 24px 64px rgba(0,0,0,.35),0 0 0 1px rgba(236,72,153,.15),0 12px 40px rgba(236,72,153,.08)}
.pcard-comic .pcard-glow{background:radial-gradient(circle,rgba(236,72,153,.1),transparent 70%)}
.pcard-train:hover{border-color:rgba(16,185,129,.35);box-shadow:0 24px 64px rgba(0,0,0,.35),0 0 0 1px rgba(16,185,129,.15),0 12px 40px rgba(16,185,129,.08)}
.pcard-train .pcard-glow{background:radial-gradient(circle,rgba(16,185,129,.1),transparent 70%)}

.pcard-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem;position:relative;z-index:2}
.pcard-icon-wrap{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;position:relative}
.pcard-icon-wrap::after{
    content:'';position:absolute;inset:-1px;border-radius:15px;
    background:linear-gradient(135deg,rgba(255,255,255,.1),rgba(255,255,255,.02));
    z-index:-1;
}
.pcard-icon-wrap::before{
    content:'';position:absolute;top:-3px;right:-3px;width:8px;height:8px;border-radius:50%;opacity:.7;
}
.pcard-hub .pcard-icon-wrap::before{background:rgba(139,92,246,.6);box-shadow:0 0 8px rgba(139,92,246,.4)}
.pcard-wan .pcard-icon-wrap::before{background:rgba(6,182,212,.6);box-shadow:0 0 8px rgba(6,182,212,.4)}
.pcard-comic .pcard-icon-wrap::before{background:rgba(236,72,153,.6);box-shadow:0 0 8px rgba(236,72,153,.4)}
.pcard-train .pcard-icon-wrap::before{background:rgba(16,185,129,.6);box-shadow:0 0 8px rgba(16,185,129,.4)}
.pcard-hub .pcard-icon-wrap{background:rgba(139,92,246,.12)}
.pcard-wan .pcard-icon-wrap{background:rgba(6,182,212,.12)}
.pcard-comic .pcard-icon-wrap{background:rgba(236,72,153,.12)}
.pcard-train .pcard-icon-wrap{background:rgba(16,185,129,.12)}
.pcard-url{
    font-size:.65rem;font-weight:600;color:var(--pri-l);
    background:rgba(99,102,241,.06);border:1px solid rgba(99,102,241,.1);
    padding:.28rem .65rem;border-radius:var(--r-xs);letter-spacing:.3px;
}
.pcard-coming{color:var(--acc-l) !important;background:rgba(236,72,153,.06) !important;border-color:rgba(236,72,153,.12) !important}
.pcard-service{color:var(--green-l) !important;background:rgba(16,185,129,.06) !important;border-color:rgba(16,185,129,.12) !important}
.pcard h3{font-size:1.35rem;font-weight:800;margin-bottom:.35rem;position:relative;z-index:2}
.pcard-tl{font-size:.8rem;color:var(--pri-l);font-weight:600;margin-bottom:1rem;position:relative;z-index:2}
.pcard-train .pcard-tl{color:var(--green-l)}
.pcard-desc{color:var(--tx2);font-size:.88rem;line-height:1.75;margin-bottom:1.4rem;flex:1;position:relative;z-index:2}
.pcard-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.6rem;position:relative;z-index:2}
.pcard-tags span{
    font-size:.68rem;font-weight:500;padding:.28rem .6rem;border-radius:var(--r-xs);
    background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);color:var(--tx3);
    transition:all .3s;
}
.pcard-hub:hover .pcard-tags span{background:rgba(139,92,246,.06);border-color:rgba(139,92,246,.12);color:var(--violet-l)}
.pcard-wan:hover .pcard-tags span{background:rgba(6,182,212,.06);border-color:rgba(6,182,212,.12);color:var(--cyan-l)}
.pcard-comic:hover .pcard-tags span{background:rgba(236,72,153,.06);border-color:rgba(236,72,153,.12);color:var(--acc-l)}
.pcard-train:hover .pcard-tags span{background:rgba(16,185,129,.06);border-color:rgba(16,185,129,.12);color:var(--green-l)}
.pcard-foot{
    display:flex;align-items:center;justify-content:space-between;
    padding-top:1.2rem;border-top:1px solid var(--brd);position:relative;z-index:2;
}
.pcard-foot span{font-size:.82rem;color:var(--pri-l);font-weight:600}
.pcard:hover .pcard-foot span{color:var(--tx)}
.pcard-foot svg{transition:transform .3s}
.pcard:hover .pcard-foot svg{transform:translate(2px,-2px)}

/* ===== MARQUEE ===== */
.marquee-wrap{
    padding:2.5rem 0;overflow:hidden;position:relative;z-index:1;
}
.marquee-wrap::before,.marquee-wrap::after{
    content:'';position:absolute;left:0;right:0;height:1px;opacity:.35;
}
.marquee-wrap::before{
    top:0;background:linear-gradient(90deg,transparent,rgba(139,92,246,.7),rgba(236,72,153,.7),rgba(6,182,212,.7),rgba(16,185,129,.7),transparent);
}
.marquee-wrap::after{
    bottom:0;background:linear-gradient(90deg,transparent,rgba(6,182,212,.7),rgba(99,102,241,.7),rgba(236,72,153,.7),rgba(245,158,11,.7),transparent);
}
.marquee-wrap::before{opacity:.4}
.marquee-wrap::after{opacity:.4}
.marquee{
    display:flex;gap:2rem;white-space:nowrap;
    animation:mq 30s linear infinite;
    font-size:1.1rem;font-weight:700;color:rgba(165,180,252,.55);
    letter-spacing:1.5px;text-transform:uppercase;
}
@keyframes mq{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.marquee i{font-style:normal;padding:0 .5rem}
.marquee i:nth-child(4n+1){color:rgba(139,92,246,.3)}
.marquee i:nth-child(4n+2){color:rgba(236,72,153,.3)}
.marquee i:nth-child(4n+3){color:rgba(6,182,212,.3)}
.marquee i:nth-child(4n){color:rgba(245,158,11,.3)}
.marquee span:nth-child(8n+1){color:rgba(165,180,252,.6)}
.marquee span:nth-child(8n+2){color:rgba(244,114,182,.55)}
.marquee span:nth-child(8n+3){color:rgba(34,211,238,.55)}
.marquee span:nth-child(8n+4){color:rgba(165,180,252,.5)}
.marquee span:nth-child(8n+5){color:rgba(52,211,153,.55)}
.marquee span:nth-child(8n+6){color:rgba(251,191,36,.5)}
.marquee span:nth-child(8n+7){color:rgba(165,180,252,.45)}
.marquee span:nth-child(8n){color:rgba(244,114,182,.5)}

/* ===== ABOUT ===== */
.about{padding:7rem 0}
.blob-a1{width:500px;height:500px;background:rgba(236,72,153,.1);top:10%;right:-5%;animation:blobFloat2 18s ease-in-out infinite}
.blob-a2{width:400px;height:400px;background:rgba(245,158,11,.08);bottom:5%;left:-5%;animation:blobFloat1 16s ease-in-out infinite}
.about-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:3.5rem;align-items:start}
.about-p{color:var(--tx2);font-size:1rem;line-height:1.85;margin-bottom:1.2rem}
.about-vals{display:flex;flex-direction:column;gap:1.2rem;margin-top:2.5rem}
.aval{
    display:flex;gap:1rem;align-items:flex-start;
    padding:1rem 1.2rem;border-radius:var(--r-sm);
    background:rgba(255,255,255,.01);border:1px solid rgba(255,255,255,.03);
    backdrop-filter:blur(12px);
    transition:all .35s;
}
.aval:hover{background:rgba(99,102,241,.04);border-color:var(--brd-l)}
.aval-ico{
    flex-shrink:0;width:40px;height:40px;border-radius:var(--r-sm);
    background:rgba(99,102,241,.05);border:1px solid rgba(99,102,241,.08);
    display:flex;align-items:center;justify-content:center;
    transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s;
}
.aval:hover .aval-ico{transform:rotate(8deg) scale(1.05);box-shadow:0 4px 16px rgba(99,102,241,.2)}
.aval:nth-child(1):hover .aval-ico{background:rgba(139,92,246,.1);border-color:rgba(139,92,246,.2);box-shadow:0 4px 16px rgba(139,92,246,.25)}
.aval:nth-child(2):hover .aval-ico{background:rgba(6,182,212,.1);border-color:rgba(6,182,212,.2);box-shadow:0 4px 16px rgba(6,182,212,.25)}
.aval:nth-child(3):hover .aval-ico{background:rgba(236,72,153,.1);border-color:rgba(236,72,153,.2);box-shadow:0 4px 16px rgba(236,72,153,.25)}
.aval h4{font-size:.95rem;font-weight:700;margin-bottom:.1rem}
.aval p{color:var(--tx3);font-size:.82rem}
.about-side{display:flex;flex-direction:column;gap:1rem}
.stat{
    background:rgba(20,20,30,.3);backdrop-filter:blur(20px);
    border:1px solid rgba(99,102,241,.06);
    padding:1.8rem;text-align:center;transition:all .35s;position:relative;overflow:hidden;
}
.stat::before{
    content:'';position:absolute;inset:0;
    background:linear-gradient(160deg,rgba(99,102,241,.04),transparent 50%);
    pointer-events:none;
}
.stat:hover{border-color:var(--brd-l);transform:translateY(-3px);box-shadow:0 12px 40px rgba(0,0,0,.25)}
.stat-v{font-size:2.5rem;font-weight:900;letter-spacing:-.02em;margin-bottom:.25rem;position:relative;background:linear-gradient(135deg,var(--pri),var(--acc));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.stat-l{color:var(--tx3);font-size:.85rem;font-weight:500}

/* ===== CONTACT ===== */
.contact{padding:7rem 0}
.blob-c1{width:450px;height:450px;background:rgba(99,102,241,.08);top:15%;left:10%;animation:blobFloat3 19s ease-in-out infinite}
.blob-c2{width:350px;height:350px;background:rgba(6,182,212,.08);bottom:10%;right:10%;animation:blobFloat1 15s ease-in-out infinite}
.cgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;max-width:860px;margin:0 auto}
.ccard{
    background:rgba(15,15,25,.22);backdrop-filter:blur(20px);
    border:1px solid rgba(99,102,241,.06);border-radius:var(--r);
    padding:2.2rem;text-align:center;transition:all .4s;
    position:relative;overflow:hidden;
}
.ccard::before{
    content:'';position:absolute;inset:-1px;border-radius:calc(var(--r) + 1px);
    padding:1px;background:linear-gradient(135deg,transparent,transparent);
    -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
    -webkit-mask-composite:xor;mask-composite:exclude;
    opacity:0;transition:opacity .4s;z-index:0;pointer-events:none;
}
.ccard:hover::before{
    background:linear-gradient(135deg,var(--pri),var(--acc),var(--cyan));
    opacity:1;animation:borderShift 4s linear infinite;
}
@keyframes borderShift{0%,100%{filter:hue-rotate(0deg)}50%{filter:hue-rotate(30deg)}}
.ccard:hover{transform:translateY(-4px);box-shadow:0 16px 48px rgba(0,0,0,.3)}
.ccard svg{margin-bottom:.9rem;position:relative;z-index:1}
.ccard h3{font-size:.95rem;font-weight:700;margin-bottom:.4rem;position:relative;z-index:1}
.ccard p{color:var(--tx2);font-size:.85rem;position:relative;z-index:1}
.ccard a{color:var(--pri-l);text-decoration:none;transition:color .3s}
.ccard a:hover{color:var(--tx)}

/* ===== FOOTER ===== */
.footer{
    padding:2.5rem 0;position:relative;z-index:1;
    background:linear-gradient(180deg,transparent,rgba(99,102,241,.02));
}
.footer::before{
    content:'';position:absolute;top:0;left:0;right:0;height:1px;
    background:linear-gradient(90deg,transparent,rgba(139,92,246,.5),rgba(236,72,153,.5),rgba(6,182,212,.5),rgba(16,185,129,.5),transparent);
    opacity:.4;
}
.foot-inner{
    max-width:1200px;margin:0 auto;padding:0 2rem;
    display:flex;flex-direction:column;align-items:center;gap:.5rem;
}
.foot-brand{display:flex;align-items:center;gap:.6rem}
.foot-brand span{font-size:.82rem;font-weight:600;background:linear-gradient(135deg,var(--tx3),var(--pri-l));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.foot-copy{color:var(--tx3);font-size:.75rem;text-align:center}
.beian-link{color:var(--tx3);text-decoration:none;transition:color .25s}
.beian-link:hover{color:var(--pri-l)}

/* ===== REVEAL ANIMATIONS ===== */
.reveal-up{opacity:0;transform:translateY(35px);transition:all .8s cubic-bezier(.16,1,.3,1)}
.reveal-up.visible{opacity:1;transform:translateY(0)}
.reveal-scale{opacity:0;transform:scale(.9);transition:all .8s cubic-bezier(.16,1,.3,1)}
.reveal-scale.visible{opacity:1;transform:scale(1)}
.reveal-left{opacity:0;transform:translateX(-40px);transition:all .8s cubic-bezier(.16,1,.3,1)}
.reveal-left.visible{opacity:1;transform:translateX(0)}
.reveal-right{opacity:0;transform:translateX(40px);transition:all .8s cubic-bezier(.16,1,.3,1)}
.reveal-right.visible{opacity:1;transform:translateX(0)}
.reveal{opacity:0;transform:translateY(25px);transition:all .7s cubic-bezier(.16,1,.3,1)}
.reveal.visible{opacity:1;transform:translateY(0)}

/* ===== RESPONSIVE ===== */
@media(max-width:960px){
    .hero-inner{flex-direction:column;text-align:center;gap:3rem;padding-top:2rem}
    .hero-left{max-width:100%}
    .hero-right{max-width:100%;width:100%}
    .hero-cards{max-width:440px;margin:0 auto}
    .hero-desc{margin:0 auto 2.5rem}
    .hero-cta{justify-content:center}
    .hcard:nth-child(1),.hcard:nth-child(2),.hcard:nth-child(3),.hcard:nth-child(4){transform:translateX(0)}
    @keyframes hcardIn{to{opacity:1;transform:translateX(0)}}
    .hero-scroll{display:none}
    .about-grid{grid-template-columns:1fr;gap:2.5rem}
    .about-side{flex-direction:row}
    .about-side .stat{flex:1}
    .pgrid-4{grid-template-columns:1fr 1fr}
    .cgrid{grid-template-columns:1fr;max-width:380px}
    .nav-links{display:none}
    .hamburger{display:flex}
    .foot-inner{text-align:center}
    .sec-head{margin-bottom:3.5rem}
}
@media(max-width:600px){
    .nav-inner{padding:.75rem 1.2rem}
    .hero{padding:5.5rem 0 2rem}
    .hero-h1{font-size:2rem}
    .hero-desc{font-size:.92rem}
    .sec-inner{padding:0 1.2rem}
    .pgrid-4{grid-template-columns:1fr}
    .pcard{padding:1.6rem}
    .stat{padding:1.3rem}
    .stat-v{font-size:2rem}
    .ccard{padding:1.6rem}
    .products,.about,.contact{padding:5rem 0}
    .about-vals{gap:1rem}
    .aval{padding:.8rem 1rem}
}

/* ===== REDUCED MOTION ===== */
@media(prefers-reduced-motion:reduce){
    .blob,.sec-title,.marquee{animation:none !important}
    .reveal-up,.reveal-scale,.reveal-left,.reveal-right,.reveal{transition:opacity .3s ease !important;transform:none !important}
    .hcard{animation:none !important;opacity:1 !important;transform:none !important}
    .glow{animation:none !important}
}

/* ===== MOBILE: lighter background ===== */
@media(max-width:768px){
    #neural-net{opacity:.5}
    #particles{opacity:.4}
    #math-curves{opacity:.35}
    .blob{opacity:.5 !important}
    .noise-overlay{opacity:.015}
    body::after{opacity:.6}
}