:root {
  --bg: #07060a; --surface: #0d0b12; --surface-2: #12101a;
  --line: rgba(255, 255, 255, .11); --line-hot: rgba(219, 77, 255, .42);
  --text: #f7f4fa; --muted: #96919e; --violet: #a855f7;
  --pink: #f044ff; --cyan: #69f6d2;
  color-scheme: dark;
  font-family: "Bahnschrift", "Aptos Display", "Trebuchet MS", sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scrollbar-color: #5c327c #09070d; }
body { margin: 0; min-width: 320px; overflow-x: hidden; color: var(--text); background: var(--bg); }
a { color: inherit; }
.ambient { position: fixed; inset: 0; z-index: -3; pointer-events: none; background: radial-gradient(circle at 72% 9%, rgba(83,20,115,.25), transparent 31%), radial-gradient(circle at 12% 66%, rgba(58,16,78,.18), transparent 25%), linear-gradient(180deg,#08070b,#050507); }
.ambient::after { content: ""; position: absolute; inset: 0; opacity: .16; background-image: linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(90deg,transparent,#000 45%,#000 75%,transparent); }
.topbar { position: sticky; top: 14px; z-index: 50; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; width: min(1100px,calc(100% - 30px)); min-height: 60px; margin: 14px auto 0; padding: 8px 10px 8px 18px; border: 1px solid var(--line); border-radius: 19px; background: rgba(10,8,14,.78); box-shadow: 0 20px 60px rgba(0,0,0,.35); backdrop-filter: blur(22px); }
.brand { display: inline-flex; align-items: center; gap: 9px; width: max-content; color: var(--text); font-size: 14px; font-weight: 850; letter-spacing: .05em; text-decoration: none; }
.brand img { width: 32px; height: 32px; object-fit: contain; filter: drop-shadow(0 0 11px rgba(231,66,255,.65)); }
.brand b { color: var(--cyan); }
.topbar nav { display: flex; gap: 31px; }
.topbar nav a { color: var(--muted); font-size: 11px; font-weight: 750; letter-spacing: .045em; text-decoration: none; transition: color .2s; }
.topbar nav a:hover { color: var(--text); }
.nav-cta { justify-self: end; display: inline-flex; align-items: center; gap: 24px; padding: 13px 17px; border-radius: 13px; color: #09070d; background: var(--cyan); font-size: 12px; font-weight: 850; text-decoration: none; }
main, footer { width: min(1200px,calc(100% - 44px)); margin-inline: auto; }
.hero { display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; min-height: 750px; padding: 70px 0 90px; }
.hero-copy { position: relative; z-index: 3; padding-left: 24px; }
.kicker { color: var(--cyan); font-size: 11px; font-weight: 850; letter-spacing: .18em; }
.kicker i { display: inline-block; width: 7px; height: 7px; margin-right: 9px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 16px var(--cyan); }
h1 { margin: 24px 0 23px; max-width: 730px; font-size: clamp(55px,6.4vw,91px); line-height: .94; letter-spacing: -.067em; }
h1 em, h2 em { color: var(--pink); font-style: normal; text-shadow: 0 0 35px rgba(240,68,255,.2); }
.hero-copy > p { max-width: 555px; margin: 0; color: var(--muted); font-size: 18px; line-height: 1.58; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 31px; }
.button { display: inline-flex; align-items: center; justify-content: space-between; gap: 30px; min-width: 176px; padding: 16px 18px; border-radius: 13px; font-size: 13px; font-weight: 850; text-decoration: none; transition: transform .2s,border-color .2s,box-shadow .2s; }
.button:hover { transform: translateY(-3px); }
.button.primary { color: #09070d; background: linear-gradient(100deg,var(--cyan),#baffb6); box-shadow: 0 16px 42px rgba(105,246,210,.13); }
.button.secondary { border: 1px solid var(--line); background: rgba(255,255,255,.035); }
.button.secondary:hover { border-color: var(--line-hot); }
.metrics { display: flex; gap: 12px; margin-top: 40px; }
.metrics div { min-width: 120px; padding: 15px 18px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.025); }
.metrics strong, .metrics span { display: block; }
.metrics strong { color: var(--cyan); font-size: 26px; line-height: 1; }
.metrics span { margin-top: 7px; color: #6f6a76; font-size: 10px; }
.visual-stage { position: relative; min-height: 650px; margin-right: -125px; perspective: 1200px; }
#network-canvas { position: absolute; inset: -110px -35px -95px -85px; width: calc(100% + 120px); height: calc(100% + 205px); filter: drop-shadow(0 0 28px rgba(201,69,255,.18)); }
.glass { border: 1px solid var(--line); background: rgba(12,10,17,.74); box-shadow: 0 24px 70px rgba(0,0,0,.42); backdrop-filter: blur(17px); }
.status-console { position: absolute; z-index: 4; right: 95px; bottom: 76px; width: 340px; padding: 17px 19px; border-radius: 17px; transform: rotateY(-4deg) rotateX(2deg); }
.console-head { display: flex; justify-content: space-between; padding-bottom: 12px; border-bottom: 1px solid var(--line); color: #8e8995; font-size: 10px; }
.console-head i { display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 10px var(--cyan); }
.status-console code { display: block; margin-top: 13px; color: #6d6872; font-size: 11px; }
.status-console code b { color: var(--cyan); font-weight: 500; }
.orbit-chip { position: absolute; z-index: 2; padding: 9px 12px; border: 1px solid var(--line-hot); border-radius: 99px; color: #cdbfd6; background: rgba(16,10,22,.76); font-size: 9px; font-weight: 750; letter-spacing: .12em; backdrop-filter: blur(10px); animation: float 5s ease-in-out infinite; }
.orbit-chip span { margin-left: 9px; color: var(--cyan); }
.chip-a { top: 135px; right: 165px; }
.chip-b { bottom: 185px; left: 55px; animation-delay: -2.1s; }
@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-13px); } }
.section { padding: 105px 0 38px; }
.section-heading { display: grid; grid-template-columns: .75fr 1.1fr .75fr; align-items: end; gap: 32px; margin-bottom: 40px; }
.section-heading .kicker { align-self: start; margin-top: 10px; }
.section-heading h2, .download h2 { margin: 0; font-size: clamp(42px,5vw,67px); line-height: .96; letter-spacing: -.058em; }
.section-heading > p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.58; }
.bento { display: grid; grid-template-columns: 1.12fr .88fr .72fr; grid-auto-rows: minmax(225px,auto); gap: 14px; }
.feature { position: relative; overflow: hidden; padding: 27px; border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.012)); transition: border-color .35s,box-shadow .35s; }
.feature:hover { border-color: var(--line-hot); }
.feature-wide { grid-column: span 2; }
.privacy { grid-column: span 2; }
.feature-title { display: flex; align-items: flex-start; gap: 15px; }
.feature h3 { margin: 0 0 5px; font-size: 21px; }
.feature p { margin: 0; color: #77717f; font-size: 13px; line-height: 1.48; }
.line-icon { position: relative; flex: 0 0 auto; display: grid; place-items: center; width: 47px; height: 47px; border: 1px solid rgba(105,246,210,.28); border-radius: 14px; background: linear-gradient(145deg,rgba(105,246,210,.13),rgba(105,246,210,.035)); box-shadow: inset 0 0 18px rgba(105,246,210,.05),0 8px 24px rgba(0,0,0,.22); }
.line-icon svg { width: 25px; height: 25px; overflow: visible; fill: none; stroke: var(--cyan); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 7px rgba(105,246,210,.35)); }
.tile-scene { position: relative; height: 170px; margin: 5px -8px -18px; overflow: hidden; perspective: 720px; }
.tile-scene::before { content: ""; position: absolute; right: 9%; bottom: -45px; left: 9%; height: 125px; border-radius: 50%; background: radial-gradient(ellipse,rgba(168,85,247,.2),transparent 68%); filter: blur(12px); }
.tile-field { position: absolute; right: 8%; bottom: -47px; left: 8%; display: grid; grid-template-columns: repeat(10,1fr); gap: 7px; height: 165px; padding: 13px; transform: rotateX(58deg); transform-origin: center bottom; transform-style: preserve-3d; }
.tile-field i { --lift: 24px; --delay: 0s; position: relative; min-width: 0; transform-style: preserve-3d; }
.tile-field i:nth-child(2n) { --lift: 38px; --delay: -.7s; }.tile-field i:nth-child(3n) { --lift: 17px; --delay: -1.8s; }.tile-field i:nth-child(4n) { --lift: 48px; --delay: -2.6s; }.tile-field i:nth-child(5n) { --lift: 29px; --delay: -3.4s; }.tile-field i:nth-child(7n) { --lift: 55px; --delay: -1.1s; }.tile-field i:nth-child(11n) { --lift: 10px; --delay: -3.8s; }
.tile-field i span { position: absolute; display: block; animation-duration: 4.8s; animation-timing-function: cubic-bezier(.45,0,.2,1); animation-iteration-count: infinite; animation-delay: var(--delay); }
.tile-top { inset: 0; border: 1px solid #a855f7; border-radius: 6px; background: linear-gradient(145deg,#873ac4,#482267 64%,#193f48); box-shadow: inset 0 0 13px rgba(240,68,255,.28),0 7px 18px rgba(0,0,0,.48); transform: translateZ(2px); animation-name: tileTopRise; }
.tile-top::after { content: ""; position: absolute; inset: 4px; border-radius: 3px; background: linear-gradient(135deg,rgba(255,255,255,.13),transparent 56%); }
.tile-front { top: 100%; right: 1px; left: 1px; height: var(--lift); transform: rotateX(90deg) scaleY(.04); transform-origin: top; background: linear-gradient(180deg,#286d72,#46145f 70%,#230c32); border: 1px solid #438d91; animation-name: tileFrontGrow; }
.tile-side { top: 1px; bottom: 1px; left: 100%; width: var(--lift); transform: rotateY(-90deg) scaleX(.04); transform-origin: left; background: linear-gradient(90deg,#a12eb8,#501269 68%,#260b34); border: 1px solid #b33ac9; animation-name: tileSideGrow; }
.tile-scan { position: absolute; z-index: 3; right: 8%; bottom: 40px; left: 8%; height: 1px; background: linear-gradient(90deg,transparent,var(--cyan),transparent); box-shadow: 0 0 16px rgba(105,246,210,.7); animation: tileScan 4.8s ease-in-out infinite; }
.security-caption { position: absolute; z-index: 4; right: 13px; bottom: 8px; color: rgba(105,246,210,.55); font: 700 8px/1 monospace; letter-spacing: .1em; }
@keyframes tileTopRise { 0%,14%,100% { transform: translateZ(2px); filter: brightness(.72); } 46%,68% { transform: translateZ(var(--lift)); filter: brightness(1.18) drop-shadow(0 0 7px rgba(105,246,210,.24)); } }
@keyframes tileFrontGrow { 0%,14%,100% { transform: rotateX(90deg) scaleY(.04); opacity: 1; } 46%,68% { transform: rotateX(90deg) scaleY(1); opacity: 1; } }
@keyframes tileSideGrow { 0%,14%,100% { transform: rotateY(-90deg) scaleX(.04); opacity: 1; } 46%,68% { transform: rotateY(-90deg) scaleX(1); opacity: 1; } }
@keyframes tileScan { 0%,100% { transform: translateY(38px); opacity: 0; } 25%,70% { opacity: .75; } 50% { transform: translateY(-58px); opacity: 1; } }
.feature-index { position: absolute; top: 24px; right: 25px; color: #49444e; font: 10px monospace; }
.speed { background: radial-gradient(circle at 80% 85%,rgba(105,246,210,.11),transparent 40%),var(--surface); }
.speed h3, .compact h3 { margin-top: 24px; }
.speed-scene { position: absolute; right: -12px; bottom: -12px; width: 160px; height: 160px; opacity: .48; }
.speed-scene i { position: absolute; inset: 50%; border: 1px solid rgba(105,246,210,.28); border-radius: 50%; transform: translate(-50%,-50%); animation: speedPulse 2.8s ease-out infinite; }
.speed-scene i:nth-child(2) { animation-delay: -.9s; }.speed-scene i:nth-child(3) { animation-delay: -1.8s; }
.speed-scene span { position: absolute; top: 49%; left: 49%; width: 8px; height: 8px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 18px var(--cyan); }
@keyframes speedPulse { from { width: 12px; height: 12px; opacity: 1; } to { width: 145px; height: 145px; opacity: 0; } }
.signal { position: absolute; right: 25px; bottom: 25px; left: 25px; display: flex; align-items: center; gap: 12px; color: var(--cyan); font-size: 11px; }
.signal span { height: 4px; flex: 1; overflow: hidden; border-radius: 99px; background: #202027; }
.signal span::after { content: ""; display: block; width: 84%; height: 100%; background: linear-gradient(90deg,var(--violet),var(--cyan)); box-shadow: 0 0 15px var(--cyan); }
.compact { text-align: center; }
.compact .line-icon { margin: auto; }
.flag-icon { overflow: hidden; background: #f6f8ff; }
.flag-icon::before, .flag-icon::after { content: ""; position: absolute; z-index: 2; background: #2f5ca8; }
.flag-icon::before { top: 0; bottom: 0; left: 15px; width: 7px; }
.flag-icon::after { top: 19px; right: 0; left: 0; height: 7px; }
.location-radar { position: absolute; top: 23px; left: 50%; width: 88px; height: 88px; transform: translateX(-50%); pointer-events: none; }
.location-radar i { position: absolute; inset: 50%; border: 1px solid rgba(105,246,210,.2); border-radius: 50%; transform: translate(-50%,-50%); animation: locationPing 3s ease-out infinite; }
.location-radar i:nth-child(2) { animation-delay: -1.5s; }
.location-radar b { position: absolute; top: 50%; left: 50%; width: 5px; height: 5px; transform: translate(-50%,-50%); border-radius: 50%; background: var(--cyan); box-shadow: 0 0 10px var(--cyan); }
@keyframes locationPing { from { width: 8px; height: 8px; opacity: .9; } to { width: 88px; height: 88px; opacity: 0; } }
.compact strong { display: block; margin-top: 20px; color: var(--cyan); font-size: 39px; }
.compact h3 { margin: 0 0 5px; }
.privacy-row { position: absolute; right: 26px; bottom: 25px; left: 26px; display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.privacy-row span { padding: 12px; border: 1px solid rgba(255,255,255,.07); border-radius: 10px; color: #756f7b; background: rgba(0,0,0,.17); font-size: 10px; text-align: center; }
.clients-section .section-heading { grid-template-columns: .55fr 1.45fr; }
.clients-section .section-heading h2 { grid-column: 2; }
.client-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.client-card { position: relative; min-height: 330px; padding: 23px; border: 1px solid var(--line); border-radius: 20px; background: var(--surface); transition: transform .25s,border-color .25s; }
.client-card:hover { transform: translateY(-6px); border-color: var(--line-hot); }
.client-card.featured { background: radial-gradient(circle at 28% 20%,rgba(240,68,255,.18),transparent 38%),#120b19; border-color: rgba(240,68,255,.34); }
.client-number { position: absolute; top: 24px; right: 22px; color: #4e4853; font-size: 10px; }
.client-symbol { display: grid; place-items: center; width: 59px; height: 59px; margin-top: 7px; border: 1px solid var(--line); border-radius: 17px; background: rgba(255,255,255,.035); }
.client-symbol img { width: 48px; height: 48px; object-fit: contain; }
.vendor-symbol { overflow: hidden; }
.vendor-symbol img { width: 42px; height: 42px; }
.happ-symbol { background: linear-gradient(145deg,#2b2361,#11101a); box-shadow: inset 0 0 22px rgba(129,105,255,.2); }
.happ-symbol img { width: 30px; height: 38px; filter: drop-shadow(0 0 8px rgba(255,255,255,.32)); }
.incy-symbol { background: linear-gradient(145deg,#123c32,#0c1714); box-shadow: inset 0 0 22px rgba(38,211,157,.16); }
.amnezia-symbol { background: linear-gradient(145deg,#33343b,#121318); }
.text-symbol { color: var(--cyan); font-size: 25px; font-weight: 900; }
.client-card h3 { margin: 32px 0 12px; font-size: 20px; }
.client-card p { min-height: 78px; margin: 0 0 24px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.client-card a { display: flex; justify-content: space-between; padding-top: 15px; border-top: 1px solid var(--line); color: var(--cyan); font-size: 11px; font-weight: 800; text-decoration: none; }
.flow { display: grid; grid-template-columns: auto 1fr auto 1fr auto; align-items: center; gap: 18px; margin-top: 20px; padding: 20px 25px; border: 1px solid var(--line); border-radius: 18px; }
.flow div { display: flex; align-items: center; gap: 10px; font-size: 12px; }
.flow b { color: var(--pink); font-size: 19px; }
.flow i { height: 1px; background: linear-gradient(90deg,var(--line-hot),rgba(105,246,210,.18)); }
.partners-section { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; padding-top: 130px; }
.partners-section .section-heading { display: block; margin: 0; }
.partners-section .section-heading h2 { margin: 16px 0; }
.partner-list { display: grid; gap: 11px; }
.partner { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px; padding: 13px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.024); text-decoration: none; transition: transform .25s,border-color .25s; }
.partner:hover { transform: translateX(7px); border-color: var(--line-hot); }
.partner img { width: 72px; height: 72px; border-radius: 15px; object-fit: cover; }
.partner small, .partner b { display: block; }
.partner small { margin-bottom: 6px; color: #68636e; font-size: 9px; letter-spacing: .1em; }
.partner b { font-size: 16px; }
.partner > strong { margin-right: 12px; color: var(--cyan); font-size: 22px; }
.download { position: relative; display: grid; grid-template-columns: 1.15fr .85fr; align-items: center; gap: 60px; overflow: hidden; margin-top: 135px; padding: 55px; border: 1px solid rgba(240,68,255,.3); border-radius: 29px; background: #100a17; }
.download-glow { position: absolute; top: -170px; right: -100px; width: 520px; height: 520px; border: 1px solid rgba(240,68,255,.25); border-radius: 50%; box-shadow: inset 0 0 100px rgba(168,85,247,.13),0 0 90px rgba(240,68,255,.09); }
.download-copy, .download-action { position: relative; z-index: 2; }
.download h2 { margin: 15px 0 18px; }
.download p { max-width: 610px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.55; }
.download-copy > small { display: block; max-width: 600px; margin-top: 15px; color: #6e6874; font-size: 10px; line-height: 1.45; }
.download-action { display: grid; gap: 12px; }
.download-button { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px; border-radius: 17px; color: #09070d; background: linear-gradient(105deg,var(--cyan),#baffb6); text-decoration: none; box-shadow: 0 20px 55px rgba(105,246,210,.12); transition: transform .2s; }
.download-button:hover { transform: translateY(-4px); }
.download-button span b, .download-button span small { display: block; }
.download-button span b { font-size: 14px; }
.download-button span small { margin-top: 5px; color: rgba(9,7,13,.58); font-size: 10px; }
.download-button > strong { font-size: 31px; }
.bot-link { padding: 12px; color: var(--muted); font-size: 11px; text-align: center; text-decoration: none; }
.bot-link span { color: var(--cyan); }
footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 85px; padding: 24px 0 40px; border-top: 1px solid var(--line); color: #65606a; font-size: 10px; letter-spacing: .08em; }
footer > a:last-child { color: var(--cyan); text-decoration: none; }
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1); }
.reveal.visible { opacity: 1; transform: translateY(0); }
@media (max-width: 980px) {
  .topbar { grid-template-columns: 1fr auto; } .topbar nav { display: none; }
  .hero { grid-template-columns: 1fr; padding-top: 105px; } .hero-copy { padding-left: 0; }
  .visual-stage { min-height: 560px; margin: -35px -80px 0; }
  .section-heading { grid-template-columns: .5fr 1.5fr; } .section-heading h2,.section-heading > p { grid-column: 2; }
  .bento { grid-template-columns: 1fr 1fr; } .feature-wide,.privacy { grid-column: span 2; }
  .client-grid { grid-template-columns: 1fr 1fr; }
  .partners-section { grid-template-columns: 1fr; gap: 34px; }
  .download { grid-template-columns: 1fr; }
}
@media (max-width: 650px) {
  main, footer { width: min(100% - 28px,1200px); }
  .topbar { top: 8px; width: calc(100% - 18px); margin-top: 8px; } .nav-cta { gap: 9px; padding: 12px 14px; }
  .hero { min-height: auto; padding: 84px 0 55px; } h1 { font-size: clamp(46px,14vw,66px); }
  .hero-copy > p { font-size: 15px; } .hero-actions .button { width: 100%; }
  .metrics { gap: 7px; } .metrics div { min-width: 0; flex: 1; padding: 12px 9px; } .metrics strong { font-size: 21px; }
  .visual-stage { min-height: 470px; margin: -5px -110px -25px; }
  #network-canvas { inset: -65px -10px; width: calc(100% + 20px); height: calc(100% + 130px); }
  .status-console { right: 112px; bottom: 30px; width: min(310px,calc(100vw - 36px)); }
  .chip-a { right: 120px; } .chip-b { left: 105px; bottom: 150px; }
  .section { padding-top: 82px; } .section-heading,.clients-section .section-heading { display: block; }
  .section-heading h2,.clients-section .section-heading h2 { margin: 15px 0; } .section-heading > p { font-size: 13px; }
  .bento { display: block; } .feature { min-height: 230px; margin-top: 10px; } .privacy { min-height: 270px; }
  .cipher-grid { width: 90%; } .client-grid { grid-template-columns: 1fr; }
  .client-card { min-height: 285px; } .client-card p { min-height: 0; }
  .flow { grid-template-columns: 1fr; } .flow i { height: 28px; width: 1px; margin-left: 10px; }
  .partner img { width: 59px; height: 59px; }
  .download { margin-top: 90px; padding: 30px 23px; }
  footer { align-items: flex-start; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}