:root{--navy:#0A1830; --navy2:#102650; --deep:#07101A; --blue:#2F86E0; --sky:#7EC0FF; --paper:#F3F6F9; --slate:#4B5B6B; --ink:#0E1A24; --line:#D5DEE7;
  --display:"Archivo","Arial Narrow",Arial,sans-serif; --body:"Public Sans","Segoe UI",system-ui,sans-serif; --mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  --gut:max(20px,5vw)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0; font:16px/1.6 var(--body); color:var(--ink); background:var(--paper)}
img{max-width:100%; display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--display); margin:0; text-wrap:balance; line-height:1.1}
p{margin:0}
.wrap{max-width:1200px; margin:0 auto; padding-inline:var(--gut)}
.k{font:500 .74rem/1 var(--mono); letter-spacing:.14em; text-transform:uppercase; color:var(--blue)}
.btn{display:inline-block; font-weight:600; font-size:.95rem; padding:13px 22px; border-radius:4px; text-decoration:none; background:var(--blue); color:#fff; white-space:nowrap; border:1px solid var(--blue); transition:background .15s}
.btn:hover{background:#1f6fc2}
.btn.ghost{background:transparent; border-color:#3B5068}
.btn.ghost:hover{border-color:var(--sky)}
.btn:focus-visible,a:focus-visible{outline:2px solid var(--sky); outline-offset:2px}

/* header */
header{position:sticky; top:0; z-index:10; background:rgba(10,24,48,.96); backdrop-filter:blur(6px); color:#fff; border-bottom:1px solid #16294a}
.nav{display:flex; align-items:center; justify-content:space-between; gap:16px; padding-block:14px}
.logo{display:flex; align-items:center; gap:12px; text-decoration:none; font:700 1.25rem/1 var(--display)}
.mark{flex:none; width:46px; height:44px; border-radius:50%; overflow:hidden; position:relative; background:#16366E}
.mark img{position:absolute; width:98px; max-width:none; height:auto; left:-25px; top:-4px}
.logo .v{color:#4FA8F2}
.logo small{display:block; font:500 .6rem/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:#9FB6D3; margin-top:6px}
nav.links{display:flex; align-items:center; gap:22px; font-size:.92rem; color:#C9D6E3}
nav.links a{white-space:nowrap}
@media (max-width:1100px){nav.links{gap:16px; font-size:.86rem}}
nav.links a:not(.btn){text-decoration:none}
nav.links a:not(.btn):hover{color:#fff}

/* hero */
.hero{background:var(--navy); color:#fff; position:relative; overflow:hidden}
.hero::after{content:""; position:absolute; inset:auto -10% -60% 40%; height:120%; background:radial-gradient(closest-side,rgba(47,134,224,.28),transparent); pointer-events:none}
.hero .wrap{display:grid; grid-template-columns:1.2fr 1fr; gap:56px; align-items:center; padding-block:80px 88px; position:relative; z-index:1}
.tag{font:500 .78rem/1 var(--mono); letter-spacing:.14em; text-transform:uppercase; color:var(--sky); display:block; margin-bottom:18px}
.hero h1{font-size:clamp(2.5rem,6vw,4.4rem); font-weight:800; font-stretch:78%; letter-spacing:-.015em; line-height:1.02}
.hero h1 em{font-style:normal; color:var(--sky)}
.hero p.sub{color:#B8C7D6; font-size:1.1rem; margin-top:22px; max-width:50ch}
.ctas{display:flex; flex-wrap:wrap; gap:12px; margin-top:32px}
.note{font:400 .76rem/1.4 var(--mono); color:#7F93A8; margin-top:18px; letter-spacing:.04em}
.globe{justify-self:center; width:min(420px,100%); aspect-ratio:1; border-radius:50%; overflow:hidden; position:relative; box-shadow:0 0 80px rgba(79,168,242,.25)}
.globe img{position:absolute; width:198%; max-width:none; left:-50%; top:-6%}

/* partners */
.partners{background:#fff; border-bottom:1px solid var(--line)}
.partners .wrap{display:flex; flex-wrap:wrap; align-items:center; gap:14px 28px; padding-block:22px}
.partners span.l{font:500 .74rem/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:#8594A3}
.partner{font:800 1.15rem/1 var(--display); color:var(--ink); border:1px solid #C9D4DF; padding:10px 16px; border-radius:4px; text-decoration:none}
.partner:hover{border-color:var(--blue); color:var(--blue)}
.pt-sec{background:#fff}
.pt{display:grid; grid-template-columns:1fr 1fr; gap:24px}
.pt .card{border:1px solid var(--line); border-radius:6px; padding:30px; display:grid; gap:12px; align-content:start; background:var(--paper)}
.pt .card h3{font-size:1.5rem; font-weight:800; font-stretch:90%}
.pt .card a.more{display:block; font-weight:600; color:var(--blue); text-decoration:none}
.pt .card a.more:hover{text-decoration:underline}
.person a{color:var(--blue); text-decoration:none; font-size:.95rem; word-break:break-all}
.person a:hover{text-decoration:underline}
.person .em{margin-top:10px}

/* sections */
section{padding-block:84px}
section .wrap{display:grid; gap:32px}
section h2{font-size:clamp(1.8rem,4vw,2.7rem); font-weight:750; font-stretch:85%; letter-spacing:-.01em; max-width:24ch}
.head{display:grid; gap:14px}
.lede{color:var(--slate); max-width:62ch; font-size:1.05rem}
.card h3{font-size:1.15rem; font-weight:700; font-stretch:95%}
.card p{font-size:.95rem; color:var(--slate)}
.code{font:500 .72rem/1 var(--mono); letter-spacing:.1em; color:var(--blue)}

.svc{display:grid; grid-template-columns:repeat(5,1fr); gap:14px}
.svc .card{background:#fff; border:1px solid var(--line); border-radius:6px; padding:24px; display:grid; gap:12px; align-content:start}
.svc a.inl{display:block; margin-top:10px; color:var(--blue); font-weight:600; text-decoration:none}
@media (max-width:1100px){.svc{grid-template-columns:repeat(3,1fr)}}
@media (max-width:720px){.svc{grid-template-columns:1fr 1fr}}

.ind-sec{background:#fff}
.ind{display:grid; grid-template-columns:repeat(4,1fr); gap:18px}
.ind .card{border-top:3px solid var(--blue); background:var(--paper); padding:24px; display:grid; gap:10px; align-content:start}

.dlv-sec{background:var(--navy2); color:#fff}
.dlv-sec h2{color:#fff}
.dlv-sec .lede{color:#B8C7D6}
.dlv{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.dlv .card{border:1px solid #2A4058; border-radius:6px; padding:26px; display:grid; gap:10px; align-content:start}
.dlv .card p{color:#B8C7D6}
.dlv .code{color:var(--sky)}
.dlv .card.mix{background:var(--blue); border-color:var(--blue)}
.dlv .card.mix p,.dlv .card.mix .code{color:#E6F0FC}

.how-sec{background:var(--paper)}
.how{display:grid; grid-template-columns:repeat(3,1fr); gap:32px}
.how .card{border-top:2px solid var(--ink); padding-top:18px; display:grid; gap:8px}
.how .n{font:700 .8rem/1 var(--mono); color:var(--blue)}

.team{display:grid; grid-template-columns:1fr 1fr; gap:24px}
.person{background:var(--paper); border:1px solid var(--line); border-radius:6px; padding:28px; display:grid; grid-template-columns:88px 1fr; gap:22px; align-items:center}
.avatar{width:88px; height:88px; border-radius:50%; background:var(--navy); color:var(--sky); display:grid; place-items:center; font:800 1.6rem/1 var(--display); font-stretch:90%}
.role{font:500 .78rem/1 var(--mono); letter-spacing:.08em; text-transform:uppercase; color:var(--blue); margin-top:8px}

.cta-sec{background:var(--navy); color:#fff}
.cta-sec .wrap{grid-template-columns:1.2fr 1fr; align-items:center; gap:48px}
.cta-sec h2{color:#fff}
.cta-sec .lede{color:#B8C7D6; margin-top:14px}
.box{background:var(--navy2); border:1px solid #22364A; border-radius:8px; padding:30px; display:grid; gap:16px}
.box .mail{font:500 1.05rem/1.3 var(--mono); color:#fff; word-break:break-all}
.box .small{font-size:.9rem; color:#B8C7D6}

footer{background:var(--deep); color:#7F93A8; font-size:.88rem}
footer .wrap{display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 28px; padding-block:30px}
footer a{color:#B8C7D6}

@media (max-width:980px){
  .ind{grid-template-columns:1fr 1fr}
  .pt{grid-template-columns:1fr}
  .hero .wrap,.cta-sec .wrap{grid-template-columns:1fr}
  .globe{width:min(300px,80%)}
  .dlv,.how,.team{grid-template-columns:1fr}
}
@media (max-width:900px){
  nav.links a:not(.btn){display:none}
  .logo small{display:none}
}
@media (max-width:520px){
  .svc,.ind{grid-template-columns:1fr}
  section{padding-block:60px}
  .hero .wrap{padding-block:52px 60px}
  .person{grid-template-columns:64px 1fr; padding:22px}
  .avatar{width:64px; height:64px; font-size:1.2rem}
  nav.links .btn{padding:10px 12px; font-size:.82rem}
}

/* AI & data */
.ai-sec{background:var(--navy); color:#fff}
.ai-sec h2{color:#fff}
.ai-sec .lede{color:#B8C7D6}
.ai{display:grid; grid-template-columns:repeat(4,1fr); gap:18px}
.ai .card{background:var(--navy2); border:1px solid #22364A; border-radius:6px; padding:24px; display:grid; gap:10px; align-content:start}
.ai .card p{color:#B8C7D6}
.ai .code{color:var(--sky)}
@media (max-width:980px){.ai{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.ai{grid-template-columns:1fr}}
/* footer links */
footer nav{display:flex; flex-wrap:wrap; gap:18px}
/* legal pages */
.legal{background:#fff; padding-block:64px 88px}
.legal .wrap{max-width:820px}
.legal h1{font-size:clamp(2rem,5vw,3rem); font-weight:800; font-stretch:85%; margin-bottom:28px}
.legal h2{font-size:1.3rem; font-weight:700; margin:34px 0 10px}
.legal p,.legal li{color:#33414F}
.legal p{margin:0 0 12px}
.legal ul{margin:0 0 12px; padding-left:22px; display:grid; gap:6px}
.legal .back{display:inline-block; margin-bottom:24px; color:var(--blue); text-decoration:none; font-weight:600}

/* ===== polish ===== */
header{transition:box-shadow .2s, background .2s}
header.scrolled{box-shadow:0 8px 24px -12px rgba(0,0,0,.6)}
.hero{background:radial-gradient(1200px 600px at 80% 20%, #13305e 0%, var(--navy) 60%)}
#net{position:absolute; inset:0; width:100%; height:100%; z-index:0}
.hero .wrap{z-index:1}
.chips{list-style:none; padding:0; margin:26px 0 0; display:flex; flex-wrap:wrap; gap:10px}
.chips li{display:inline-flex; align-items:center; gap:8px; font-size:.84rem; color:#C9D6E3; background:rgba(16,38,80,.7); border:1px solid #22406a; border-radius:999px; padding:7px 14px}
.chips svg{width:15px; height:15px; color:var(--sky)}
.globe-wrap{position:relative; justify-self:center; width:min(440px,100%); aspect-ratio:1; display:grid; place-items:center}
.globe-wrap .globe{width:84%; justify-self:auto}
.orbit{position:absolute; inset:0; border-radius:50%; border:1px dashed rgba(126,192,255,.28)}
.orbit.o2{inset:7%; border-style:solid; border-color:rgba(126,192,255,.12)}
@media (prefers-reduced-motion:no-preference){ .orbit.o1{animation:spin 60s linear infinite} }
@keyframes spin{to{transform:rotate(360deg)}}

.ic{display:inline-grid; place-items:center; width:46px; height:46px; border-radius:10px; background:linear-gradient(135deg,#E6F0FC,#D3E5FA); color:var(--blue); margin-bottom:4px}
.ic svg{width:24px; height:24px}
.dlv-sec .ic,.ai-sec .ic{background:linear-gradient(135deg,rgba(47,134,224,.25),rgba(126,192,255,.12)); color:var(--sky); border:1px solid rgba(126,192,255,.25)}
.dlv .card.mix .ic{background:rgba(255,255,255,.18); color:#fff; border-color:rgba(255,255,255,.3)}
.card{transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease}
.svc .card:hover,.ind .card:hover,.pt .card:hover{transform:translateY(-3px); box-shadow:0 14px 30px -18px rgba(14,26,36,.45); border-color:#b9cde2}
.ai .card:hover,.dlv .card:hover{transform:translateY(-3px); box-shadow:0 16px 34px -20px rgba(0,0,0,.8)}
@media (prefers-reduced-motion:reduce){ .card{transition:none} .card:hover{transform:none} }

section{position:relative}
.ai-sec,.dlv-sec{background-image:linear-gradient(rgba(126,192,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(126,192,255,.05) 1px,transparent 1px); background-size:44px 44px}
.ai-sec{background-color:var(--navy)} .dlv-sec{background-color:var(--navy2)}
.head h2{position:relative}
.head .k{display:inline-flex; align-items:center; gap:10px}
.head .k::before{content:""; width:22px; height:2px; background:currentColor; display:inline-block}

.partners .l{display:inline-flex; align-items:center; gap:8px}
.partners .l svg{width:16px; height:16px}

.how{position:relative}
.how .card{border-top:0; padding-top:0; gap:10px}
.stepic{display:grid; place-items:center; width:56px; height:56px; border-radius:50%; background:#fff; border:2px solid var(--blue); color:var(--blue); position:relative; z-index:1}
.stepic svg{width:24px; height:24px}
@media (min-width:981px){ .how::before{content:""; position:absolute; left:28px; right:28px; top:28px; height:2px; background:linear-gradient(90deg,var(--blue),var(--sky)); opacity:.35} }

.avatar{background:linear-gradient(135deg,var(--navy),#1b3f7a); box-shadow:0 0 0 3px #fff, 0 0 0 5px rgba(47,134,224,.45)}
.person .em{display:flex; align-items:center; gap:8px}
.person .em svg{width:16px; height:16px; color:var(--blue)}
.person{transition:box-shadow .18s} .person:hover{box-shadow:0 14px 30px -20px rgba(14,26,36,.5)}

.box .mail{display:flex; align-items:flex-start; gap:10px}
.box .mail svg{width:20px; height:20px; color:var(--sky); margin-top:2px; flex:none}
.box .btn{display:inline-flex; align-items:center; justify-content:center; gap:8px}
.box .btn svg{width:18px; height:18px}
.cta-sec{background:radial-gradient(900px 500px at 10% 100%, #13305e 0%, var(--navy) 65%)}

footer .fgrid{display:grid; grid-template-columns:1.4fr 1fr 1.2fr 1fr; gap:32px; padding-block:52px 34px}
footer h4{font:500 .72rem/1 var(--mono); letter-spacing:.14em; text-transform:uppercase; color:#9FB6D3; margin:0 0 14px}
footer nav{display:grid; gap:10px; align-content:start}
footer nav a{color:#B8C7D6; text-decoration:none}
footer nav a:hover{color:#fff}
footer .fbrand{display:grid; gap:12px; align-content:start}
footer .fbrand .logo{color:#fff}
footer .fbar{display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; border-top:1px solid #16243a; padding-block:20px; font-size:.82rem}
@media (max-width:860px){ footer .fgrid{grid-template-columns:1fr 1fr} }
@media (max-width:520px){ footer .fgrid{grid-template-columns:1fr} }

.box .mail{word-break:normal; overflow-wrap:anywhere; font-size:1rem}
.box .mail .who{display:block; font:400 .85rem/1.4 var(--body); color:#B8C7D6; margin-top:4px}

.pt .card .tagline{font:600 1.15rem/1.35 var(--display); font-stretch:92%; color:var(--ink); border-left:3px solid var(--blue); padding-left:14px; margin:4px 0}

.dlv.four{grid-template-columns:repeat(4,1fr)}
@media (max-width:1100px){.dlv.four{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.dlv.four{grid-template-columns:1fr}}

.hero h1.quote em{display:block; font-size:.62em; line-height:1.1; margin-top:.35em; letter-spacing:0; font-weight:700}
.hero h1.quote .qo{display:inline-block; width:.42em; margin-left:-.42em; text-align:right; color:var(--sky)}
.hero h1.quote .qc{color:var(--sky)}