/* ===== APLYITS shared stylesheet ===== */
:root{
  --bg:#08090d; --panel:#0f1017; --panel2:#12131c; --ink:#f6f7f9; --muted:#9aa1af; --faint:#697084;
  --line:rgba(255,255,255,.08); --line2:rgba(255,255,255,.14);
  --brand:#6d5efc; --brand2:#a855f7; --cyan:#22d3ee; --green:#34d399;
}
*{box-sizing:border-box; margin:0; padding:0}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
  background:var(--bg); color:var(--ink); line-height:1.65; -webkit-font-smoothing:antialiased; overflow-x:hidden}
a{color:inherit; text-decoration:none}
.wrap{max-width:1180px; margin:0 auto; padding:0 26px}
.narrow{max-width:860px}
.center{text-align:center}
.eyebrow{color:var(--brand2); font-weight:700; font-size:12.5px; text-transform:uppercase; letter-spacing:.15em; margin-bottom:14px}
h2{font-size:clamp(28px,4vw,44px); letter-spacing:-.03em; line-height:1.08; font-weight:800; margin-bottom:16px}
.lead{color:var(--muted); font-size:17px; max-width:64ch; margin-bottom:52px}
.center .lead{margin-left:auto; margin-right:auto}
section{padding:92px 0; border-top:1px solid var(--line)}
.nb{border-top:none}

/* nav */
header{position:sticky; top:0; z-index:40; background:rgba(8,9,13,.72); backdrop-filter:saturate(160%) blur(18px); border-bottom:1px solid var(--line)}
nav{display:flex; align-items:center; justify-content:space-between; height:72px}
.brand{display:flex; align-items:center; gap:11px; font-weight:700; font-size:18px; letter-spacing:-.01em}
.logo{width:34px; height:34px; border-radius:10px; background:linear-gradient(135deg,var(--brand),var(--brand2)); display:grid; place-items:center; color:#fff; font-weight:800; box-shadow:0 6px 18px rgba(109,94,252,.45)}
.navlinks{display:flex; gap:30px; font-size:14.5px; color:var(--muted)}
.navlinks a:hover,.navlinks a.active{color:var(--ink)}
.navcta{border:1px solid var(--line2); padding:9px 17px; border-radius:10px; font-size:14px; font-weight:600; transition:.15s}
.navcta:hover{background:#fff; color:#08090d}
@media(max-width:860px){.navlinks{display:none}}

/* page hero (sub pages) */
.phero{position:relative; padding:96px 0 60px; border-top:none}
.phero::before{content:""; position:absolute; inset:0; z-index:-1; background:
  radial-gradient(760px 320px at 50% -60px, rgba(109,94,252,.24), transparent 70%),
  radial-gradient(540px 280px at 85% 20%, rgba(34,211,238,.10), transparent 70%)}
.phero h1{font-size:clamp(34px,5.6vw,56px); line-height:1.04; letter-spacing:-.035em; font-weight:800; max-width:20ch; margin-bottom:18px}
.phero h1 .g{background:linear-gradient(110deg,var(--brand) 10%,var(--brand2) 55%,var(--cyan)); -webkit-background-clip:text; background-clip:text; color:transparent}
.phero p{font-size:18px; color:var(--muted); max-width:60ch}

/* home hero */
.hero{position:relative; padding:130px 0 84px; text-align:center; border-top:none}
.hero::before{content:""; position:absolute; inset:0; z-index:-1; background:
  radial-gradient(760px 340px at 50% -60px, rgba(109,94,252,.30), transparent 70%),
  radial-gradient(560px 300px at 84% 12%, rgba(34,211,238,.12), transparent 70%),
  radial-gradient(560px 300px at 12% 26%, rgba(168,85,247,.16), transparent 70%)}
.tagpill{display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line2); background:rgba(255,255,255,.03); color:var(--muted); font-size:12.5px; padding:7px 15px; border-radius:30px; margin-bottom:28px}
.dot{width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 10px var(--green)}
.hero h1{font-size:clamp(38px,6.2vw,70px); line-height:1.03; letter-spacing:-.04em; font-weight:800; max-width:17ch; margin:0 auto 22px}
.hero h1 .g{background:linear-gradient(110deg,var(--brand) 8%,var(--brand2) 52%,var(--cyan)); -webkit-background-clip:text; background-clip:text; color:transparent}
.hero .sub{font-size:19px; color:var(--muted); max-width:62ch; margin:0 auto 36px}

/* buttons */
.btns{display:flex; gap:13px; flex-wrap:wrap}
.center .btns{justify-content:center}
.btn{padding:14px 26px; border-radius:12px; font-weight:600; font-size:15px; transition:.15s; display:inline-block}
.btn.primary{background:linear-gradient(135deg,var(--brand),var(--brand2)); color:#fff; box-shadow:0 10px 30px rgba(109,94,252,.4)}
.btn.primary:hover{transform:translateY(-1px)}
.btn.ghost{border:1px solid var(--line2)}
.btn.ghost:hover{background:rgba(255,255,255,.05)}

/* stats */
.stats{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,255,255,.015)}
.stats .grid{display:grid; grid-template-columns:repeat(4,1fr)}
@media(max-width:760px){.stats .grid{grid-template-columns:repeat(2,1fr)}}
.stat{padding:38px 20px; text-align:center; border-left:1px solid var(--line)}
.stat:first-child{border-left:none}
@media(max-width:760px){.stat:nth-child(3){border-left:none}}
.stat .num{font-size:34px; font-weight:800; letter-spacing:-.02em; background:linear-gradient(120deg,#fff,#b9becb); -webkit-background-clip:text; background-clip:text; color:transparent}
.stat .cap{font-size:13.5px; color:var(--muted); margin-top:6px}

/* capability cards */
.caps{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
@media(max-width:900px){.caps{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.caps{grid-template-columns:1fr}}
.cap{border:1px solid var(--line); border-radius:18px; padding:28px; background:linear-gradient(180deg,var(--panel),#0b0c12); transition:.18s}
.cap:hover{border-color:var(--line2); transform:translateY(-2px)}
.cap .ic{width:46px; height:46px; border-radius:12px; background:rgba(109,94,252,.14); display:grid; place-items:center; font-size:22px; margin-bottom:16px}
.cap h3{font-size:18px; margin-bottom:8px; letter-spacing:-.01em}
.cap p{color:var(--muted); font-size:14.5px}

/* products */
.products{display:grid; grid-template-columns:1fr 1fr; gap:24px}
@media(max-width:860px){.products{grid-template-columns:1fr}}
.product{position:relative; border:1px solid var(--line); border-radius:22px; padding:40px 36px; background:linear-gradient(180deg,var(--panel),#0b0c12); overflow:hidden}
.product::after{content:""; position:absolute; top:-40%; right:-30%; width:60%; height:120%; background:radial-gradient(circle, rgba(109,94,252,.16), transparent 60%); pointer-events:none}
.product.nd::after{background:radial-gradient(circle, rgba(34,211,238,.14), transparent 60%)}
.product .top{display:flex; align-items:center; gap:15px; margin-bottom:20px; position:relative}
.picon{width:56px; height:56px; border-radius:15px; display:grid; place-items:center; color:#fff; font-weight:800; font-size:24px; flex:0 0 auto}
.picon.tw{background:linear-gradient(135deg,var(--brand),var(--brand2)); box-shadow:0 8px 22px rgba(109,94,252,.4)}
.picon.nd{background:linear-gradient(135deg,var(--cyan),var(--green)); box-shadow:0 8px 22px rgba(34,211,238,.35)}
.product h3{font-size:25px; letter-spacing:-.01em}
.product .tagline{font-size:12.5px; color:var(--brand2); font-weight:700; letter-spacing:.06em}
.product.nd .tagline{color:var(--cyan)}
.product p{color:var(--muted); font-size:15.5px; margin-bottom:20px; position:relative}
.feats{list-style:none; margin:0 0 22px; position:relative}
.feats li{color:var(--muted); font-size:14.5px; padding:5px 0 5px 24px; position:relative}
.feats li::before{content:"→"; position:absolute; left:0; color:var(--brand2)}
.product.nd .feats li::before{color:var(--cyan)}
.prow{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; position:relative}
.status{display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:600; color:var(--muted); border:1px solid var(--line2); border-radius:30px; padding:7px 14px}
.status .d{width:7px; height:7px; border-radius:50%; background:var(--green)}
.status.soon .d{background:var(--cyan)}
.plink{font-size:14px; font-weight:600; color:var(--brand2)}
.product.nd .plink{color:var(--cyan)}
.plink:hover{opacity:.75}

/* approach */
.approach{display:grid; grid-template-columns:repeat(2,1fr); gap:22px}
@media(max-width:820px){.approach{grid-template-columns:1fr}}
.astep{border:1px solid var(--line); border-radius:18px; padding:30px; background:rgba(255,255,255,.015)}
.astep .n{font-size:13px; color:var(--faint); font-weight:700; letter-spacing:.12em; margin-bottom:14px}
.astep h4{font-size:19px; margin-bottom:8px; letter-spacing:-.01em}
.astep p{color:var(--muted); font-size:14.5px}

/* tech */
.tech{display:grid; grid-template-columns:1.1fr 1fr; gap:44px; align-items:center}
@media(max-width:860px){.tech{grid-template-columns:1fr}}
.tech ul{list-style:none; margin-top:24px}
.tech li{display:flex; gap:13px; padding:12px 0; border-top:1px solid var(--line); font-size:15px; color:var(--muted)}
.tech li:first-child{border-top:none}
.tech li b{color:var(--ink); font-weight:600}
.tech .chk{color:var(--green); flex:0 0 auto; font-weight:800}
.techcard{border:1px solid var(--line); border-radius:22px; padding:36px; background:linear-gradient(180deg,var(--panel),#0b0c12)}
.techcard .badge{display:flex; align-items:center; gap:12px; padding:14px 0; border-bottom:1px solid var(--line)}
.techcard .badge:last-child{border-bottom:none}
.techcard .bi{width:38px; height:38px; border-radius:10px; background:rgba(52,211,153,.14); display:grid; place-items:center; font-size:18px}
.techcard .bt{font-weight:600; font-size:15px}
.techcard .bs{font-size:12.5px; color:var(--faint)}

/* vision / values */
.quote{font-size:clamp(24px,3.6vw,38px); font-weight:700; letter-spacing:-.02em; line-height:1.26; max-width:22ch; margin:0 auto; text-align:center}
.quote .g{background:linear-gradient(110deg,var(--brand2),var(--cyan)); -webkit-background-clip:text; background-clip:text; color:transparent}
.vals{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:60px}
@media(max-width:820px){.vals{grid-template-columns:1fr}}
.val{border:1px solid var(--line); border-radius:18px; padding:28px; background:rgba(255,255,255,.015)}
.val .n{font-size:13px; color:var(--faint); font-weight:700; letter-spacing:.1em; margin-bottom:14px}
.val h4{font-size:18px; margin-bottom:8px}
.val p{color:var(--muted); font-size:14.5px}

/* company info box */
.company{display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center}
@media(max-width:860px){.company{grid-template-columns:1fr}}
.company p{color:var(--muted); font-size:16px; margin-bottom:16px}
.infobox{border:1px solid var(--line); border-radius:18px; overflow:hidden}
.inforow{display:flex; justify-content:space-between; gap:16px; padding:16px 22px; border-bottom:1px solid var(--line); font-size:14.5px}
.inforow:last-child{border-bottom:none}
.inforow .k{color:var(--faint)}
.inforow .v{color:var(--ink); font-weight:600; text-align:right}

/* team */
.team{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
@media(max-width:760px){.team{grid-template-columns:1fr}}
.member{border:1px solid var(--line); border-radius:18px; padding:34px 28px; text-align:center; background:linear-gradient(180deg,var(--panel),#0b0c12); transition:.18s}
.member:hover{border-color:var(--line2); transform:translateY(-2px)}
.avatar{width:78px; height:78px; border-radius:50%; margin:0 auto 18px; display:grid; place-items:center; font-weight:800; font-size:25px; color:#fff; background:linear-gradient(135deg,var(--brand),var(--brand2)); box-shadow:0 8px 22px rgba(109,94,252,.4)}
.avatar.d{background:linear-gradient(135deg,var(--cyan),var(--green)); box-shadow:0 8px 22px rgba(34,211,238,.35)}
.m-name{font-size:18.5px; font-weight:700; letter-spacing:-.01em}
.m-role{font-size:13px; color:var(--brand2); font-weight:700; letter-spacing:.05em; text-transform:uppercase; margin-top:6px}
.member .d ~ .m-role{color:var(--cyan)}

/* contact */
.contact-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
@media(max-width:820px){.contact-grid{grid-template-columns:1fr}}
.cc{border:1px solid var(--line); border-radius:18px; padding:28px; text-align:center; background:rgba(255,255,255,.015)}
.cc .lbl{font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--faint); margin-bottom:8px}
.cc .v{font-weight:600; font-size:15.5px; word-break:break-word}
.cc .v a{color:var(--ink)}
.cc .sub{font-size:12.5px; color:var(--faint); margin-top:4px}

/* CTA band */
.ctaband{border:1px solid var(--line); border-radius:24px; padding:56px 40px; text-align:center; background:linear-gradient(180deg,var(--panel),#0b0c12); position:relative; overflow:hidden}
.ctaband::before{content:""; position:absolute; inset:0; background:radial-gradient(600px 240px at 50% 0, rgba(109,94,252,.18), transparent 70%); pointer-events:none}
.ctaband h2{position:relative}
.ctaband p{color:var(--muted); font-size:17px; max-width:52ch; margin:0 auto 28px; position:relative}
.ctaband .btns{position:relative; justify-content:center}

/* legal pages */
.legal{padding:20px 0 90px}
.legal .blk{padding:26px 0; border-top:1px solid var(--line)}
.legal h2{font-size:21px; letter-spacing:-.01em; margin-bottom:12px}
.legal p,.legal li{color:var(--muted); font-size:15.5px}
.legal p{margin-bottom:14px}
.legal ul{margin:0 0 14px; padding-left:22px}
.legal li{margin-bottom:8px}
.legal b{color:var(--ink); font-weight:600}
.updated{color:var(--faint); font-size:14px}
.promise{margin:26px 0 6px; padding:24px 26px; border:1px solid rgba(52,211,153,.3); background:rgba(52,211,153,.06); border-radius:16px}
.promise .t{display:flex; align-items:center; gap:10px; font-weight:700; font-size:16px; margin-bottom:8px}
.promise .t .ic{color:var(--green)}
.promise p{color:var(--muted); font-size:15px; margin:0}

/* footer */
footer{border-top:1px solid var(--line); padding:64px 0 40px; color:var(--faint); font-size:14px}
.fgrid{display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:36px; margin-bottom:44px}
@media(max-width:820px){.fgrid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.fgrid{grid-template-columns:1fr}}
.fcol h5{font-size:13px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); margin-bottom:16px; font-weight:700}
.fcol a{display:block; color:var(--faint); padding:5px 0}
.fcol a:hover{color:var(--ink)}
.fabout{max-width:34ch; color:var(--faint)}
.fabout .brand{margin-bottom:16px; color:var(--ink)}
.fbottom{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; padding-top:28px; border-top:1px solid var(--line)}