:root{
  --bg:#080c14;
  --bg2:#0c1018;
  --blue:#4778bc;
  --blue-l:#6fa3e8;
  --blue-glow:rgba(71,120,188,0.25);
  --white:#ffffff;
  --dim:rgba(255,255,255,0.58);
  --dim2:rgba(255,255,255,0.25);
  --line:rgba(255,255,255,0.07);
  --fh:'Space Grotesk',sans-serif;
  --fb:'DM Sans',sans-serif;
  --ease:cubic-bezier(0.16,1,0.3,1);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
#starfield{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
html{scroll-behavior:smooth}
body{font-family:var(--fb);background:var(--bg);color:var(--white);overflow-x:hidden;cursor:default;-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit}
ul{list-style:none}
img{display:block;max-width:100%}

/* ━━ LOADER ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#loader{position:fixed;inset:0;z-index:9999;background:var(--bg);display:flex;align-items:center;justify-content:center;transition:opacity .8s var(--ease),visibility .8s;will-change:opacity}
#loader.gone{opacity:0;visibility:hidden;pointer-events:none}
.ld-inner{display:flex;flex-direction:column;align-items:center;gap:28px}
.ld-b{width:72px;height:72px;filter:drop-shadow(0 0 18px rgba(71,120,188,.5))}
.ld-p{opacity:0}
.p1{animation:ldIn .5s var(--ease) .15s forwards}
.p2{animation:ldIn .5s var(--ease) .35s forwards}
.p3{animation:ldIn .5s var(--ease) .25s forwards}
@keyframes ldIn{from{opacity:0;transform:scale(.7) translateY(8px)}to{opacity:1;transform:none}}
.ld-progress{width:160px;height:1.5px;background:rgba(255,255,255,.08);border-radius:2px;overflow:hidden}
.ld-bar{height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--blue-l));border-radius:2px;transition:width .04s linear}
.ld-label{font-family:var(--fb);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--dim2)}

/* ━━ CURSOR ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#cur-dot{position:fixed;top:0;left:0;z-index:9990;pointer-events:none;width:10px;height:10px;border-radius:50%;background:var(--blue);transform:translate(-50%,-50%);transition:width .2s,height .2s,background .2s;mix-blend-mode:normal;display:none;}
#cur-ring{position:fixed;top:0;left:0;z-index:9989;pointer-events:none;width:60px;height:60px;border-radius:50%;border:2px solid var(--blue-l);box-shadow:0 0 12px var(--blue-l);transform:translate(-50%,-50%);transition:width .4s var(--ease),height .4s var(--ease),border-color .3s,opacity .3s;display:none;}
#cur-label{position:fixed;top:0;left:0;z-index:9991;pointer-events:none;font-family:var(--fb);font-size:.65rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--white);background:var(--blue);padding:4px 10px;border-radius:100px;transform:translate(16px,-50%);opacity:0;transition:opacity .2s;white-space:nowrap;display:none;}
body.cursor-hover #cur-ring{width:70px;height:70px;border-color:var(--blue-l);background:rgba(71,120,188,.12)}
body.cursor-hover #cur-dot{width:8px;height:8px;background:var(--white)}
body.cursor-label #cur-label{opacity:1}

/* ━━ NAV ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#nav{position:fixed;inset:0 0 auto 0;z-index:1000;padding:0 52px;border-bottom:1px solid transparent;transition:background .4s,border-color .4s,backdrop-filter .4s}
#nav.scrolled{background:rgba(8,12,20,.88);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-color:var(--line)}
.nav-in{max-width:1320px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:72px}
#nav-brand{display:flex;align-items:center;gap:10px;height:100%;text-decoration:none;transition:opacity .3s}
#nav-brand:hover{opacity:.85}
.nav-logo-icon{width:36px;height:36px;flex-shrink:0;filter:drop-shadow(0 0 8px rgba(71,120,188,.3))}
.nav-logo-text{display:flex;flex-direction:column;font-family:var(--fh);line-height:1;gap:1px;font-size:1.35rem;font-weight:700;color:var(--white);letter-spacing:-0.03em}
.nav-logo-be{color:var(--blue-l)}
.nav-logo-tech{font-size:.58rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);margin-top:2px}
#nav-menu{display:flex;align-items:center;gap:4px}
#nav-menu a{font-family:var(--fb);font-size:.875rem;font-weight:500;color:var(--dim);padding:8px 16px;border-radius:100px;transition:color .2s,background .2s}
#nav-menu a:hover{color:var(--white);background:rgba(255,255,255,.05)}
.nc-cta{background:var(--blue)!important;color:var(--white)!important;font-weight:600!important}
.nc-cta:hover{filter:brightness(1.1);background:var(--blue)!important}
#nav-tog{display:none;background:none;border:none;flex-direction:column;gap:6px;padding:4px;cursor:pointer}
#nav-tog span{display:block;width:22px;height:1.5px;background:var(--white);border-radius:2px;transition:.3s}

/* ━━ HERO ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;padding-top:72px}
.hero-split{max-width:1320px;margin:0 auto;padding:80px 52px 60px;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;min-height:calc(100vh - 72px)}
.hero-l{display:flex;flex-direction:column;align-items:flex-start}
.hero-tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--fb);font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--blue-l);margin-bottom:28px;opacity:0;animation:fu .7s var(--ease) 2.3s forwards}
.htag-dot{width:6px;height:6px;background:var(--blue-l);border-radius:50%;animation:blink 2s ease infinite}
@keyframes blink{0%,100%{opacity:.3}50%{opacity:1;box-shadow:0 0 6px var(--blue-l)}}
h1{font-family:var(--fh);font-size:clamp(3rem,5.5vw,5.2rem);font-weight:700;line-height:1.06;letter-spacing:-1.5px;margin-bottom:28px}
.hl{display:block;opacity:0;transform:translateY(20px)}
.hl-blue{background:linear-gradient(120deg,var(--blue-l) 0%,var(--blue) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-body{font-size:1.05rem;color:var(--dim);line-height:1.8;margin-bottom:36px;max-width:440px;opacity:0;animation:fu .7s var(--ease) 2.7s forwards}
.hero-btns{display:flex;align-items:center;gap:16px;opacity:0;animation:fu .7s var(--ease) 2.9s forwards}
.hero-r{display:flex;align-items:center;justify-content:center;position:relative}
#sphere-canvas{border-radius:50%;display:block}
.hero-scroll-hint{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:3px;opacity:0;animation:fu .7s var(--ease) 3.4s forwards}
.hero-scroll-hint span{display:block;width:1px;height:40px;background:linear-gradient(to bottom,transparent,var(--dim2));animation:scrollDown 2s ease-in-out infinite}
@keyframes scrollDown{0%,100%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}}

/* ━━ BUTTONS ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.btn-prim{display:inline-flex;align-items:center;gap:8px;font-family:var(--fb);font-size:.9rem;font-weight:600;padding:13px 26px;background:var(--blue);color:var(--white);border-radius:100px;border:none;transition:filter .2s,transform .2s,box-shadow .2s;cursor:pointer}
.btn-prim:hover{filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 8px 28px rgba(71,120,188,.4)}
.btn-prim svg{width:17px;height:17px;transition:transform .2s}
.btn-prim:hover svg{transform:translateX(4px)}
.btn-prim.btn-sm{padding:10px 20px;font-size:.82rem}
.btn-prim.btn-full{width:100%;justify-content:center}
.btn-ghost{display:inline-flex;align-items:center;gap:6px;font-family:var(--fb);font-size:.875rem;font-weight:500;color:var(--dim);padding:10px 0;border-bottom:1px solid var(--line);transition:color .2s,border-color .2s;cursor:pointer}
.btn-ghost:hover{color:var(--white);border-color:var(--dim2)}

/* ━━ TICKER ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.ticker-wrap{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0;background:rgba(255,255,255,.018)}
.ticker-track{display:flex;gap:36px;width:max-content;animation:ticker 30s linear infinite}
.ticker-track:hover{animation-play-state:paused}
.ticker-track span{font-family:var(--fb);font-size:.72rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--dim2);white-space:nowrap}
.ticker-track i{color:var(--blue);font-style:normal;font-size:.55rem;display:flex;align-items:center}
@keyframes ticker{to{transform:translateX(-50%)}}

/* ━━ SECTIONS ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sec{padding:110px 0}
.sec-dim{background:var(--bg2)}
.wrap{max-width:1320px;margin:0 auto;padding:0 52px}
.kicker{font-family:var(--fb);font-size:.7rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--blue-l);margin-bottom:20px}
.sec-h2{font-family:var(--fh);font-size:clamp(2.2rem,3.8vw,3rem);font-weight:700;line-height:1.15;letter-spacing:-.5px;margin-bottom:56px}
.sec-h2 em{font-style:italic;color:var(--blue-l)}
h2{font-family:var(--fh);font-size:clamp(2.2rem,4vw,3.2rem);font-weight:700;line-height:1.1;letter-spacing:-.5px}

/* ━━ ABOUT ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.about-g{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start;margin-bottom:72px}
.about-hl{font-size:clamp(2rem,3.5vw,2.8rem)}
.about-body p{color:var(--dim);font-size:1rem;line-height:1.85;margin-bottom:18px}
.stat-row{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.stat-line{width:1px;background:var(--line)}
.stat{padding:44px 36px;text-align:center;transition:background .3s}
.stat:hover{background:rgba(255,255,255,.02)}
.sn{font-family:var(--fh);font-size:clamp(2.4rem,4vw,3.4rem);font-weight:700;color:var(--white);line-height:1}
.stat sup{font-family:var(--fh);font-size:1.2rem;color:var(--blue-l);font-weight:700;vertical-align:super;margin-left:2px}
.stat p{font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--dim2);margin-top:12px}

/* ━━ SERVICES ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.svc-g{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.svc-card{padding:40px 32px;position:relative;border-right:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;transition:background .3s}
.svc-card:nth-child(3n){border-right:none}
.svc-card:nth-child(4),.svc-card:nth-child(5),.svc-card:nth-child(6){border-bottom:none}
.svc-card::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at top left,rgba(71,120,188,.08),transparent 60%);opacity:0;transition:opacity .4s}
.svc-card:hover{background:rgba(255,255,255,.025)}
.svc-card:hover::after{opacity:1}
.svc-n{font-family:var(--fb);font-size:.65rem;font-weight:700;letter-spacing:.2em;color:var(--blue);margin-bottom:20px;display:block}
.svc-ico{width:40px;height:40px;color:var(--blue-l);margin-bottom:18px}
.svc-ico svg{width:100%;height:100%}
.svc-card h3{font-family:var(--fh);font-size:1rem;font-weight:600;color:var(--white);margin-bottom:10px}
.svc-card p{font-size:.875rem;color:var(--dim);line-height:1.72}
/* .svc-arr rule removed */
/* .svc-arr hover rule removed */

/* ━━ PRIVACY ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.priv-block{display:grid;grid-template-columns:1fr 1.5fr;gap:80px;align-items:start;padding:64px 56px;border:1px solid var(--line);border-radius:20px}
.priv-l{display:flex;flex-direction:column;gap:28px}
.priv-r p{color:var(--dim);font-size:1rem;line-height:1.82;margin-bottom:16px}
.priv-list{display:flex;flex-direction:column;gap:12px;margin-top:28px}
.priv-list li{display:flex;align-items:center;gap:10px;font-family:var(--fb);font-size:.875rem;font-weight:500;color:var(--dim)}
.priv-list li svg{flex-shrink:0;width:16px;height:16px}

/* ━━ CONTACT ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.contact-g{display:grid;grid-template-columns:1fr 1.4fr;gap:80px;align-items:start}
.contact-l h2{margin-bottom:18px}
.contact-sub{color:var(--dim);font-size:1rem;line-height:1.8;margin-bottom:36px}
.contact-info{display:flex;flex-direction:column;gap:18px}
.ci-row{display:flex;align-items:flex-start;gap:12px;font-size:.875rem;color:var(--dim);line-height:1.7}
.ci-row svg{width:17px;height:17px;flex-shrink:0;color:var(--blue-l);margin-top:1px}
.ci-row a{color:var(--dim);transition:color .2s}
.ci-row a:hover{color:var(--blue-l)}
/* form */
form{display:flex;flex-direction:column;gap:14px}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fg{display:flex;flex-direction:column;gap:5px}
.fg label{font-family:var(--fb);font-size:.68rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--dim2)}
.fg input,.fg select,.fg textarea{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:10px;color:var(--white);font-family:var(--fb);font-size:.9rem;padding:12px 15px;outline:none;transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
.fg select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236fa3e8' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-color:rgba(255,255,255,.04);padding-right:36px}
.fg input::placeholder,.fg textarea::placeholder{color:rgba(255,255,255,.18)}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(71,120,188,.16)}
.fg select option{background:#0c1018;color:var(--white)}
.fe{font-size:.72rem;color:#f87171;min-height:14px}
.f-note{font-size:.7rem;color:var(--dim2);text-align:center;margin-top:4px}
.f-ok{display:none;align-items:center;gap:12px;padding:18px;border-radius:10px;background:rgba(71,120,188,.08);border:1px solid rgba(71,120,188,.22);margin-bottom:14px}
.f-ok svg{width:20px;height:20px;color:#4ade80;flex-shrink:0}
.f-ok strong{display:block;font-size:.9rem;color:var(--white)}
.f-ok span{font-size:.8rem;color:var(--dim)}
[data-fs-success]:not([data-fs-success-visible]){display:none!important}
.f-err-g{font-size:.8rem;color:#f87171;min-height:0;margin-bottom:8px}

/* ━━ FOOTER ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#footer{padding:80px 0 40px;border-top:1px solid var(--line)}
.ft-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:64px;gap:40px}
.ft-cta-block{display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.ft-h2{font-size:clamp(2rem,3.5vw,2.8rem);color:var(--white)}
.ft-logo-block{flex-shrink:0;max-width:90px}
.ft-logo-svg{width:90px;height:auto;display:block}
.ft-bot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:24px}
.ft-bot p{font-size:.75rem;color:var(--dim2)}
.ft-nav{display:flex;gap:28px}
.ft-nav a{font-size:.78rem;color:var(--dim2);transition:color .2s}
.ft-nav a:hover{color:var(--white)}

/* ━━ REVEAL ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
@keyframes fu{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ━━ RESPONSIVE ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media(max-width:1024px){
  .hero-split{grid-template-columns:1fr;padding:60px 36px 40px;gap:40px}
  .hero-r{order:-1;height:300px}
  #sphere-canvas{width:300px!important;height:300px!important}
  .about-g{grid-template-columns:1fr;gap:40px}
  .contact-g{grid-template-columns:1fr;gap:48px}
  .priv-block{grid-template-columns:1fr;padding:44px 32px;gap:40px}
  .ft-top{flex-direction:column;align-items:flex-start}
}
@media(max-width:768px){
  #nav{padding:0 24px}
  .wrap{padding:0 24px}
  .sec{padding:80px 0}
  .hero-split{padding:48px 24px 32px}
  h1{font-size:clamp(2.4rem,9vw,3.2rem);letter-spacing:-1px}
  .svc-g{grid-template-columns:1fr;border-radius:12px}
  .svc-card{border-right:1px solid var(--line)!important;border-bottom:1px solid var(--line)!important}
  .svc-card:last-child{border-bottom:none!important}
  .stat-row{grid-template-columns:1fr;border-radius:12px}
  .stat-line{height:1px;width:100%}
  #nav-menu{display:none;flex-direction:column;position:fixed;inset:72px 0 0 0;background:rgba(8,12,20,.97);padding:28px 24px;gap:4px;backdrop-filter:blur(24px)}
  #nav-menu.open{display:flex}
  #nav-menu a{font-size:1rem;padding:14px 0;border-bottom:1px solid var(--line);border-radius:0}
  .nc-cta{margin-top:12px;border-radius:100px!important;border-bottom:none!important;text-align:center;justify-content:center}
  #nav-tog{display:flex}
  .nav-logo-text{font-size:1.1rem} .nav-logo-icon{width:30px;height:30px} .f-row{grid-template-columns:1fr}
  .ft-bot{flex-direction:column;gap:16px;align-items:flex-start}
}