:root {
  --bg: #04060a;
  --panel: #08111a;
  --panel-2: #0e1b28;
  --line: #182b3b;
  --blue: #4baeff;
  --blue-2: #00cfff;
  --green: #46e08e;
  --white: #f4f8fb;
  --soft: #b5c4cf;
  --muted: #72899b;
  --dim: #435a6c;
  --display: "Orbitron", sans-serif;
  --body: "Manrope", sans-serif;
  --max: 1320px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; overflow-x: hidden; }
body { margin: 0; overflow-x: hidden; background: var(--bg); color: var(--white); font-family: var(--body); }
body.locked { overflow: hidden; }
button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
img { display: block; max-width: 100%; }

.noise { position: fixed; inset: 0; z-index: 100; pointer-events: none; opacity: .035; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E"); }
.progress-line { position: fixed; z-index: 110; left: 0; top: 0; width: 100%; height: 2px; pointer-events: none; }
.progress-line span { display: block; width: 0; height: 100%; background: linear-gradient(90deg,var(--blue),var(--blue-2)); box-shadow: 0 0 12px var(--blue); }

.announcement { height: 36px; display: flex; align-items: center; justify-content: center; gap: 11px; background: #070b11; border-bottom: 1px solid #111b27; color: #8399aa; font: 600 9px/1 var(--display); letter-spacing: .15em; text-transform: uppercase; }
.announcement a { margin-left: 16px; color: var(--white); }.announcement a span { margin-left: 5px; color: var(--blue); }
.status-dot { width: 6px; height: 6px; display: inline-block; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px var(--green); animation: pulse 2s infinite; }

.site-header { width: min(calc(100% - 48px),var(--max)); height: 78px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 40; transition: height .3s,background .3s; }
.site-header.scrolled { position: fixed; top: 0; left: 50%; width: 100%; height: 68px; padding: 0 max(24px,calc((100vw - var(--max))/2)); transform: translateX(-50%); background: rgba(4,6,10,.83); border-bottom: 1px solid rgba(38,58,75,.55); backdrop-filter: blur(18px); }
.brand { display: inline-flex; align-items: center; gap: 12px; flex-shrink: 0; }
.brand-mark { width: 3px; height: 35px; border-radius: 3px; background: var(--blue); box-shadow: 0 0 14px rgba(75,174,255,.6); position: relative; }
.brand-mark::after { content: ""; position: absolute; left: 8px; top: 16px; width: 6px; height: 3px; border-radius: 3px; background: var(--blue); }
.brand-copy { display: grid; line-height: 1; }.brand-copy strong { font: 700 15px/1 var(--display); letter-spacing: .28em; }.brand-copy small { color: var(--blue); font: 700 7px/1 var(--display); letter-spacing: .7em; margin-top: 6px; }
.desktop-nav { display: flex; align-items: center; gap: 31px; margin-left: auto; margin-right: 45px; }
.desktop-nav > a { color: #8195a5; font-size: 11px; transition: color .25s; }.desktop-nav > a:hover { color: var(--white); }
.desktop-nav .shop-link { padding-left: 23px; border-left: 1px solid #1d2b37; display: flex; gap: 7px; align-items: center; color: var(--white); }.shop-link i { min-width: 17px; height: 17px; display: grid; place-items: center; border-radius: 50%; background: var(--blue); color: #03111c; font: normal 700 6px/1 var(--display); }
.contact-trigger { min-height: 40px; padding: 0 15px; border: 1px solid #234159; border-radius: 4px; background: rgba(8,17,26,.5); color: #c4d1da; cursor: pointer; font: 700 8px/1 var(--display); letter-spacing: .11em; text-transform: uppercase; transition: .25s; }.contact-trigger:hover { border-color: var(--blue); background: rgba(75,174,255,.07); }.contact-trigger span { margin-left: 9px; color: var(--blue); font-size: 13px; }
.menu-button { display: none; width: 42px; height: 42px; border: 1px solid #1d3447; border-radius: 4px; background: transparent; cursor: pointer; }.menu-button span { display: block; width: 16px; height: 1px; margin: 5px auto; background: var(--white); transition: .25s; }
.mobile-menu { display: none; }

.hero { min-height: calc(100vh - 114px); width: min(calc(100% - 48px),var(--max)); margin: 0 auto; padding: 70px 0 90px; position: relative; display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; }
.hero::before { content: ""; position: absolute; left: 50%; bottom: 0; width: 100vw; height: 1px; transform: translateX(-50%); background: linear-gradient(90deg,transparent,#1a3043 30%,#1a3043 70%,transparent); }
.hero-grid { position: absolute; z-index: -1; inset: 0 -15%; opacity: .18; background-image: linear-gradient(#174565 1px,transparent 1px),linear-gradient(90deg,#174565 1px,transparent 1px); background-size: 76px 76px; mask-image: radial-gradient(ellipse at 71% 49%,black,transparent 61%); }
.hero-aura { position: absolute; z-index: -1; right: -80px; top: 48%; width: 680px; height: 680px; transform: translateY(-50%); border-radius: 50%; background: radial-gradient(circle,rgba(25,108,172,.2),transparent 66%); filter: blur(8px); }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; color: #71899c; font: 700 8px/1 var(--display); letter-spacing: .23em; text-transform: uppercase; }.eyebrow i { width: 24px; height: 2px; display: inline-block; background: var(--blue); box-shadow: 0 0 9px rgba(75,174,255,.55); }
.hero h1 { margin: 28px 0 25px; font: 700 clamp(56px,6.8vw,98px)/.98 var(--display); letter-spacing: -.065em; }.hero h1 span,.contact h2 span,.approach h2 span,.section-head h2 span,.manifesto h2 span,.why-copy h2 span { color: transparent; -webkit-text-stroke: 1px #445969; }
.hero-subtitle { min-height: 62px; margin: 0; color: #8ba0b0; font-size: 16px; line-height: 1.8; }.hero-subtitle strong { color: var(--blue); font-weight: 600; position: relative; }.hero-subtitle strong::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 1px; background: var(--blue); opacity: .45; }
.hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 36px; }
.button { min-height: 49px; padding: 0 23px; display: inline-flex; align-items: center; justify-content: center; gap: 25px; border: 0; border-radius: 4px; cursor: pointer; font: 700 9px/1 var(--display); letter-spacing: .1em; text-transform: uppercase; transition: .25s; }
.button-primary { background: linear-gradient(115deg,#238cdd,#4baeff); color: #03111b; box-shadow: 0 0 0 1px rgba(161,220,255,.25) inset,0 16px 34px rgba(40,138,216,.16); }.button-primary:hover { transform: translateY(-2px); box-shadow: 0 0 0 1px rgba(195,232,255,.4) inset,0 20px 40px rgba(40,138,216,.27); }
.button-secondary { border: 1px solid #29465e; background: transparent; color: var(--white); }.button-secondary:hover { border-color: var(--blue); background: rgba(75,174,255,.06); }
.text-link { color: #b9c8d2; font-size: 11px; }.text-link span { width: 28px; height: 28px; margin-left: 8px; display: inline-grid; place-items: center; border: 1px solid #284257; border-radius: 50%; color: var(--blue); }
.hero-proof { display: grid; grid-template-columns: repeat(3,1fr); gap: 0; margin-top: 64px; max-width: 610px; }.hero-proof > div { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 12px; padding-right: 19px; margin-right: 19px; border-right: 1px solid #1c2b37; }.hero-proof > div:last-child { border: 0; margin: 0; }.hero-proof strong { color: var(--white); font: 700 17px/1 var(--display); }.hero-proof span { color: #5b7183; font-size: 7px; line-height: 1.55; text-transform: uppercase; letter-spacing: .1em; }

.system-visual { height: 590px; position: relative; display: grid; place-items: center; }
.system-halo { position: absolute; border: 1px solid rgba(75,174,255,.13); border-radius: 50%; }.halo-one { width: 445px; height: 445px; animation: spin 30s linear infinite; }.halo-two { width: 310px; height: 310px; border-style: dashed; animation: spinReverse 24s linear infinite; }
.system-halo::before,.system-halo::after { content: ""; position: absolute; width: 6px; height: 6px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 12px var(--blue); }.halo-one::before { left: 68px; top: 43px; }.halo-one::after { right: 22px; bottom: 118px; }.halo-two::before { left: 145px; top: -3px; background: var(--green); box-shadow: 0 0 12px var(--green); }.halo-two::after { left: 27px; bottom: 55px; }
.system-core { width: 145px; aspect-ratio: 1; position: relative; z-index: 3; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid #3a7199; border-radius: 50%; background: radial-gradient(circle at 45% 35%,#132e43,#060b11 68%); box-shadow: 0 0 60px rgba(75,174,255,.13),0 28px 60px #000; }.system-core::before { content: ""; position: absolute; inset: 10px; border: 1px dashed #254d6a; border-radius: 50%; }.system-core span { font: 700 42px/1 var(--display); text-shadow: 0 0 20px rgba(75,174,255,.4); }.system-core small { margin-top: 9px; color: #6d8ba1; font: 700 5px/1 var(--display); letter-spacing: .25em; }.system-core b { margin-top: 8px; color: var(--green); font: 700 5px/1 var(--display); letter-spacing: .2em; }.core-pulse { position: absolute; inset: -1px; border: 1px solid var(--blue); border-radius: 50%; animation: corePulse 2.8s ease-out infinite; }
.system-node { width: 150px; position: absolute; z-index: 4; padding: 13px 14px; border: 1px solid #1f3d54; border-radius: 4px; background: rgba(7,14,22,.88); backdrop-filter: blur(12px); box-shadow: 0 16px 35px rgba(0,0,0,.38); }.system-node::after { content: ""; position: absolute; height: 1px; background: linear-gradient(90deg,#315b78,transparent); transform-origin: left center; }.system-node > i { position: absolute; top: 16px; right: 13px; width: 5px; height: 5px; border-radius: 50%; background: var(--green); box-shadow: 0 0 9px var(--green); }.system-node small { color: #4f6e85; font: 700 5px/1 var(--display); letter-spacing: .16em; }.system-node b { display: block; margin: 8px 0 5px; font: 700 9px/1 var(--display); letter-spacing: .05em; }.system-node span { color: #688094; font-size: 7px; }
.node-ai { left: 3%; top: 20%; }.node-ai::after { width: 115px; right: -103px; bottom: -15px; transform: rotate(25deg); }.node-auto { right: 0; top: 21%; }.node-auto::after { width: 118px; left: -105px; bottom: -16px; transform: rotate(155deg); }.node-app { left: 5%; bottom: 18%; }.node-app::after { width: 118px; right: -105px; top: -12px; transform: rotate(-24deg); }.node-data { right: 3%; bottom: 16%; }.node-data::after { width: 120px; left: -106px; top: -12px; transform: rotate(204deg); }
.data-packet { position: absolute; z-index: 5; width: 4px; height: 4px; border-radius: 50%; background: var(--blue-2); box-shadow: 0 0 9px var(--blue-2); }.packet-one { animation: packetOne 4s ease-in-out infinite; }.packet-two { animation: packetTwo 5s ease-in-out infinite 1s; }.packet-three { animation: packetThree 4.6s ease-in-out infinite .5s; }
.hero-footer { position: absolute; left: 0; right: 0; bottom: 24px; display: flex; align-items: center; gap: 14px; color: #3e5669; font: 700 6px/1 var(--display); letter-spacing: .19em; }.hero-line { flex: 1; height: 1px; background: linear-gradient(90deg,#172d3d,transparent 70%); }

.section { width: min(calc(100% - 48px),var(--max)); margin: 0 auto; padding: 145px 0; }
.manifesto { display: grid; grid-template-columns: .32fr 1.68fr; gap: 70px; border-bottom: 1px solid #152532; }
.manifesto-label { display: flex; align-items: flex-start; gap: 17px; padding-top: 10px; }.manifesto-label > span { color: var(--blue); font: 700 8px/1 var(--display); }.manifesto-label p { margin: 0; color: #506779; font-size: 9px; line-height: 1.55; text-transform: uppercase; letter-spacing: .14em; }.manifesto-label b { color: #9bacb8; font-weight: 600; }
.manifesto h2 { max-width: 1000px; margin: 0; font: 600 clamp(35px,4.4vw,61px)/1.25 var(--display); letter-spacing: -.045em; }.manifesto h2 span { white-space: nowrap; }
.manifesto-text { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; margin-top: 65px; padding-left: 34%; }.manifesto-text p { margin: 0; color: #7a90a1; font-size: 12px; line-height: 1.8; }

.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 60px; margin-bottom: 75px; }.section-head h2 { margin: 25px 0 0; font: 700 clamp(37px,4.5vw,62px)/1.14 var(--display); letter-spacing: -.05em; }.section-head > p { max-width: 430px; margin: 0 0 6px; color: #71889a; font-size: 12px; line-height: 1.8; }
.service-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.service-card { min-height: 600px; position: relative; overflow: hidden; display: flex; flex-direction: column; padding: 31px; border: 1px solid #172c3e; border-radius: 7px; background: #07101a; transition: border-color .3s,transform .3s; }.service-card:hover { transform: translateY(-4px); border-color: #2c536e; }
.service-card::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(130deg,rgba(255,255,255,.025),transparent 24%); }
.service-top { display: flex; justify-content: space-between; color: #597287; font: 700 7px/1 var(--display); letter-spacing: .16em; }.service-top i { font-style: normal; color: #315f7f; }
.service-copy { margin-top: auto; position: relative; z-index: 2; }.service-copy h3 { margin: 0 0 17px; font: 600 26px/1.15 var(--display); letter-spacing: -.03em; }.service-copy p { max-width: 500px; margin: 0; color: #748a9b; font-size: 11px; line-height: 1.75; }.service-copy > span { display: block; margin-top: 20px; color: #456176; font: 600 7px/1.5 var(--display); letter-spacing: .1em; text-transform: uppercase; }
.service-ai { background: radial-gradient(circle at 72% 33%,rgba(33,100,151,.16),transparent 35%),#07101a; }
.agent-demo { width: 82%; margin: 45px auto 40px; }.chat { max-width: 76%; padding: 14px 16px; border: 1px solid #1d3b52; border-radius: 5px; background: rgba(8,18,28,.9); box-shadow: 0 15px 30px rgba(0,0,0,.25); }.chat small { color: #4e7189; font: 700 5px/1 var(--display); letter-spacing: .18em; }.chat p { margin: 7px 0 0; color: #a7b8c4; font-size: 9px; line-height: 1.5; }.chat-agent { margin-left: auto; border-color: #28628b; background: rgba(13,41,60,.75); }.chat-agent small { color: var(--blue); }.thinking { display: flex; align-items: center; gap: 5px; margin: 16px 0 16px 18%; color: #486477; }.thinking span { width: 4px; height: 4px; border-radius: 50%; background: var(--blue); animation: think 1.2s infinite; }.thinking span:nth-child(2){animation-delay:.15s}.thinking span:nth-child(3){animation-delay:.3s}.thinking b { margin-left: 6px; font-size: 6px; font-weight: 500; text-transform: uppercase; letter-spacing: .12em; }
.service-auto { background: radial-gradient(circle at 50% 33%,rgba(30,125,126,.12),transparent 39%),#061016; }
.flow-demo { display: flex; align-items: center; justify-content: center; margin: 95px 0 100px; }.flow-node { width: 105px; min-height: 76px; padding: 14px; border: 1px solid #1b3a4c; border-radius: 4px; background: #08131c; }.flow-node b { width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: #132a3a; color: #648297; font: 700 5px/1 var(--display); }.flow-node span { display: block; margin-top: 12px; color: #8fa4b2; font-size: 8px; }.flow-node.active { border-color: var(--green); box-shadow: 0 0 30px rgba(70,224,142,.08); }.flow-node.active b { background: rgba(70,224,142,.13); color: var(--green); }.flow-demo > i { width: 33px; height: 1px; background: #244a60; position: relative; }.flow-demo > i::after { content: ""; position: absolute; right: 0; top: -2px; width: 5px; height: 5px; border-top: 1px solid var(--blue); border-right: 1px solid var(--blue); transform: rotate(45deg); }
.service-web { background: radial-gradient(circle at 60% 30%,rgba(104,68,170,.13),transparent 36%),#080d16; }
.browser-demo { width: 84%; margin: 49px auto 43px; border: 1px solid #20394d; border-radius: 6px; overflow: hidden; background: #05090d; box-shadow: 0 25px 50px rgba(0,0,0,.34); transform: perspective(800px) rotateY(-4deg) rotateX(2deg); }.browser-bar { height: 29px; display: flex; align-items: center; gap: 5px; padding: 0 10px; background: #0b141d; border-bottom: 1px solid #1b2e3d; }.browser-bar i { width: 4px; height: 4px; border-radius: 50%; background: #314a5d; }.browser-bar span { margin-left: 9px; color: #3f5b6e; font-size: 5px; }.browser-content { height: 180px; position: relative; overflow: hidden; padding: 37px 29px; background: radial-gradient(circle at 75% 60%,rgba(75,174,255,.14),transparent 33%),#05090d; }.browser-content > div { width: 22px; height: 2px; background: var(--blue); }.browser-content h4 { margin: 16px 0; font: 700 23px/1.06 var(--display); letter-spacing: -.05em; }.browser-content h4 span { color: transparent; -webkit-text-stroke: 1px #496478; }.browser-content b { display: block; width: 82px; height: 20px; background: var(--blue); border-radius: 2px; }
.service-app { background: radial-gradient(circle at 60% 32%,rgba(31,112,170,.13),transparent 39%),#071018; }
.app-demo { width: 82%; height: 225px; margin: 45px auto; display: grid; grid-template-columns: 48px 1fr; border: 1px solid #1d3a50; border-radius: 6px; overflow: hidden; background: #070d13; box-shadow: 0 25px 50px rgba(0,0,0,.3); }.app-sidebar { display: flex; flex-direction: column; align-items: center; gap: 18px; padding-top: 17px; background: #0b151f; border-right: 1px solid #1b2d3b; }.app-sidebar span { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 4px; background: var(--blue); color: #06131d; font: 700 9px/1 var(--display); }.app-sidebar i { width: 15px; height: 3px; border-radius: 3px; background: #263d4e; }.app-sidebar i:nth-of-type(1){background:var(--blue)}.app-main { padding: 22px; }.app-main > small { color: #4e697d; font: 700 5px/1 var(--display); letter-spacing: .17em; }.app-number { margin-top: 11px; font: 500 29px/1 var(--body); }.app-number em { color: var(--blue); font-size: 9px; font-style: normal; }.app-chart { height: 63px; margin-top: 14px; border-bottom: 1px solid #1e3445; position: relative; background: linear-gradient(155deg,transparent 0 25%,rgba(75,174,255,.1) 25% 37%,transparent 37% 50%,rgba(75,174,255,.1) 50% 68%,transparent 68%); }.app-chart i { position: absolute; left: 0; bottom: 13px; width: 100%; height: 1px; background: linear-gradient(90deg,var(--blue),var(--blue-2)); transform: rotate(-8deg); box-shadow: 0 0 7px var(--blue); }.app-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; margin-top: 16px; }.app-stats span { height: 24px; border: 1px solid #172b3a; border-radius: 3px; background: #0a151e; }

.approach { width: 100%; background: #070b10; border-top: 1px solid #152837; border-bottom: 1px solid #152837; }.approach-inner { display: grid; grid-template-columns: .7fr 1.3fr; gap: 120px; }.approach-intro { position: sticky; top: 120px; align-self: start; }.approach h2 { margin: 28px 0; font: 700 clamp(42px,5vw,66px)/1.12 var(--display); letter-spacing: -.05em; }.approach-intro > p { max-width: 320px; color: #6d8496; font-size: 11px; line-height: 1.7; }.process-list { border-top: 1px solid #203240; }.process-step { padding: 29px 0; border-bottom: 1px solid #203240; cursor: pointer; }.step-head { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; }.step-head span { color: #4d687c; font: 700 7px/1 var(--display); }.step-head h3 { margin: 0; color: #8296a5; font: 600 18px/1.3 var(--display); transition: color .25s; }.step-head b { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid #263f52; border-radius: 50%; color: #658196; font-weight: 400; transition: .25s; }.process-step p { max-width: 570px; max-height: 0; overflow: hidden; margin: 0 45px; color: #6a8193; font-size: 11px; line-height: 1.75; opacity: 0; transition: max-height .45s,margin .45s,opacity .35s; }.process-step.active p { max-height: 150px; margin-top: 22px; margin-bottom: 2px; opacity: 1; }.process-step.active .step-head h3 { color: var(--white); }.process-step.active .step-head span { color: var(--blue); }.process-step.active .step-head b { color: var(--blue); border-color: var(--blue); transform: rotate(-45deg); }

.projects { padding-bottom: 160px; }.featured-project { min-height: 670px; display: grid; grid-template-columns: 1.25fr .75fr; border: 1px solid #1b3041; border-radius: 7px; overflow: hidden; background: #070d13; transition: border-color .3s,transform .3s; }.featured-project:hover { border-color: #315b78; transform: translateY(-4px); }.project-photo { min-height: 670px; position: relative; overflow: hidden; }.project-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(4,7,10,.05),rgba(7,13,19,.16) 70%,#070d13); }.project-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 83%; filter: saturate(.73) contrast(1.13) brightness(.66); transition: transform .7s; }.featured-project:hover .project-photo img { transform: scale(1.025); }.project-tag { position: absolute; z-index: 2; left: 25px; bottom: 24px; padding: 11px 14px; border: 1px solid rgba(83,135,173,.35); border-radius: 3px; background: rgba(5,11,17,.75); backdrop-filter: blur(12px); color: #8da3b2; font: 600 7px/1 var(--display); letter-spacing: .12em; text-transform: uppercase; }.project-tag i { width: 6px; height: 6px; display: inline-block; margin-right: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 8px var(--green); }
.project-content { min-width: 0; display: flex; flex-direction: column; padding: 37px 40px 31px; background: radial-gradient(circle at 50% 50%,rgba(24,86,132,.11),transparent 43%); }.project-index { margin-left: auto; color: #425b6e; font: 700 6px/1 var(--display); letter-spacing: .2em; }.project-content > div:nth-child(2) { margin: auto 0; }.project-content h3 { margin: 24px 0 23px; font: 700 clamp(42px,4.6vw,65px)/1.02 var(--display); letter-spacing: -.055em; }.project-content p { max-width: 390px; color: #748a9b; font-size: 11px; line-height: 1.8; }.project-bottom { min-height: 52px; padding-top: 20px; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #1d3141; color: #a6b7c3; font: 700 8px/1 var(--display); letter-spacing: .12em; text-transform: uppercase; }.project-bottom b { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid #2a485e; border-radius: 50%; color: var(--blue); font-size: 14px; transition: transform .25s; }.featured-project:hover .project-bottom b { transform: rotate(45deg); }

.why-us { display: grid; grid-template-columns: .78fr 1.22fr; gap: 95px; border-top: 1px solid #162634; }.why-copy h2 { margin: 26px 0 0; font: 700 clamp(35px,3.5vw,49px)/1.2 var(--display); letter-spacing: -.045em; }.why-grid { border-top: 1px solid #1c2e3b; }.why-grid article { min-height: 150px; display: grid; grid-template-columns: 45px .7fr 1.3fr; align-items: start; gap: 18px; padding: 31px 0; border-bottom: 1px solid #1c2e3b; }.why-grid article > span { color: var(--blue); font: 700 7px/1 var(--display); }.why-grid h3 { margin: 0; color: #b4c2cc; font: 600 13px/1.45 var(--display); }.why-grid p { margin: 0; color: #657d90; font-size: 10px; line-height: 1.75; }

.contact { width: 100%; max-width: none; min-height: 650px; position: relative; overflow: hidden; display: flex; align-items: center; padding: 100px max(24px,calc((100vw - var(--max))/2)); background: radial-gradient(circle at 76% 50%,rgba(30,111,170,.21),transparent 28%),#05090e; border-top: 1px solid #183044; }.contact-grid { position: absolute; inset: 0; opacity: .14; background-image: linear-gradient(#1f587e 1px,transparent 1px),linear-gradient(90deg,#1f587e 1px,transparent 1px); background-size: 62px 62px; mask-image: radial-gradient(circle at 76% 50%,black,transparent 58%); }.contact-copy { position: relative; z-index: 3; }.contact h2 { margin: 28px 0 42px; font: 700 clamp(44px,5.7vw,76px)/1.12 var(--display); letter-spacing: -.055em; }.contact-orbit { position: absolute; right: 9%; top: 50%; width: 410px; height: 410px; display: grid; place-items: center; transform: translateY(-50%); border: 1px solid rgba(75,174,255,.2); border-radius: 50%; }.contact-orbit::before,.contact-orbit::after { content: ""; position: absolute; border: 1px dashed rgba(75,174,255,.18); border-radius: 50%; }.contact-orbit::before { inset: 48px; }.contact-orbit::after { inset: 104px; border-style: solid; }.contact-orbit span { font: 700 90px/1 var(--display); opacity: .12; text-shadow: 0 0 40px var(--blue); }.contact-orbit i { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 11px var(--blue); }.contact-orbit i:nth-of-type(1){left:45px;top:82px}.contact-orbit i:nth-of-type(2){right:26px;top:210px;background:var(--green);box-shadow:0 0 11px var(--green)}.contact-orbit i:nth-of-type(3){left:190px;bottom:-3px}

footer { width: min(calc(100% - 48px),var(--max)); margin: 0 auto; padding: 80px 0 24px; }.footer-main { display: grid; grid-template-columns: .7fr 1fr .8fr; gap: 75px; align-items: start; padding-bottom: 75px; }.footer-main > div:first-child > p { margin: 23px 0 0; color: #465e70; font: 600 7px/1.7 var(--display); letter-spacing: .15em; }.footer-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 45px; }.footer-nav > div { display: flex; flex-direction: column; gap: 13px; }.footer-nav b { margin-bottom: 7px; color: #95a8b6; font-size: 8px; text-transform: uppercase; letter-spacing: .15em; }.footer-nav a { color: #5f7688; font-size: 10px; transition: color .2s; }.footer-nav a:hover { color: var(--blue); }.footer-cta { min-height: 105px; padding: 0 25px; display: flex; align-items: center; justify-content: space-between; border: 1px solid #25445b; border-radius: 5px; background: #08111a; cursor: pointer; transition: border-color .25s,background .25s; }.footer-cta:hover { border-color: var(--blue); background: rgba(75,174,255,.06); }.footer-cta span { font: 700 10px/1 var(--display); letter-spacing: .12em; }.footer-cta b { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 50%; background: var(--blue); color: #04111b; font-size: 16px; }.footer-bottom { height: 58px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #182936; color: #405769; font: 600 6px/1 var(--display); letter-spacing: .16em; }.footer-bottom a { color: #6f8698; }

.overlay { position: fixed; inset: 0; z-index: 70; background: rgba(0,0,0,.7); backdrop-filter: blur(6px); opacity: 0; visibility: hidden; transition: .35s; }.overlay.active { opacity: 1; visibility: visible; }
.contact-panel { position: fixed; z-index: 80; top: 0; right: 0; width: min(610px,100%); height: 100dvh; display: grid; grid-template-rows: auto 1fr; background: #070d13; border-left: 1px solid #1d3548; visibility: hidden; transform: translateX(100%); transition: transform .42s cubic-bezier(.2,.75,.2,1),visibility 0s linear .42s; }.contact-panel.active { visibility: visible; transform: none; transition-delay: 0s; }.panel-head { padding: 32px 36px 28px; display: flex; align-items: flex-start; justify-content: space-between; border-bottom: 1px solid #1a2d3d; }.panel-head h2 { margin: 16px 0 0; font: 700 31px/1 var(--display); }.panel-head > button { width: 38px; height: 38px; border: 1px solid #294256; border-radius: 50%; background: transparent; cursor: pointer; font-size: 20px; }.panel-body { overflow-y: auto; padding: 31px 36px 40px; }.panel-body > p { max-width: 480px; margin: 0 0 30px; color: #71889a; font-size: 11px; line-height: 1.75; }.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }.panel-body label { display: grid; gap: 8px; }.panel-body label > span,.panel-body legend { color: #677f91; font-size: 7px; text-transform: uppercase; letter-spacing: .14em; }.panel-body input,.panel-body textarea { width: 100%; border: 1px solid #203649; border-radius: 4px; outline: 0; background: #0a131c; color: var(--white); font-size: 11px; transition: border-color .2s,box-shadow .2s; }.panel-body input { height: 48px; padding: 0 13px; }.panel-body textarea { padding: 13px; resize: vertical; }.panel-body input:focus,.panel-body textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(75,174,255,.06); }.panel-body input::placeholder,.panel-body textarea::placeholder { color: #3a5061; }.panel-body fieldset { margin: 28px 0; padding: 0; border: 0; }.panel-body legend { margin-bottom: 11px; }.service-options { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.service-options label { display: block; }.service-options input { position: absolute; opacity: 0; pointer-events: none; }.service-options span { height: 42px; display: flex; align-items: center; justify-content: center; border: 1px solid #1e3446; border-radius: 4px; color: #71899b; cursor: pointer; font-size: 9px; text-transform: none; letter-spacing: 0; transition: .2s; }.service-options input:checked + span { border-color: var(--blue); color: var(--white); background: rgba(75,174,255,.08); }.panel-body form > .button { width: 100%; margin-top: 21px; justify-content: space-between; }.panel-body form > small { display: block; margin-top: 11px; color: #445b6d; font-size: 7px; }.panel-success { align-self: center; padding: 40px; text-align: center; }.panel-success > span { width: 78px; height: 78px; margin: 0 auto 28px; display: grid; place-items: center; border: 1px solid var(--green); border-radius: 50%; color: var(--green); font-size: 27px; box-shadow: 0 0 36px rgba(70,224,142,.1); }.panel-success h2 { font: 700 27px/1.2 var(--display); }.panel-success p { max-width: 430px; margin: 0 auto 25px; color: #6d8496; font-size: 10px; line-height: 1.7; }

.reveal { opacity: 0; transform: translateY(25px); transition: opacity .8s ease,transform .8s cubic-bezier(.2,.75,.2,1); }.reveal.visible { opacity: 1; transform: none; }
@keyframes pulse { 0%,100%{opacity:.55;box-shadow:0 0 4px currentColor}50%{opacity:1;box-shadow:0 0 13px currentColor} }
@keyframes spin { to{transform:rotate(360deg)} } @keyframes spinReverse { to{transform:rotate(-360deg)} }
@keyframes corePulse { 0%{transform:scale(1);opacity:.7}100%{transform:scale(1.55);opacity:0} }
@keyframes think { 0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-2px)} }
@keyframes packetOne { 0%,15%{left:20%;top:27%;opacity:0}25%{opacity:1}70%{left:49%;top:48%;opacity:1}80%,100%{opacity:0} }
@keyframes packetTwo { 0%,15%{right:17%;top:30%;opacity:0}25%{opacity:1}70%{right:49%;top:49%;opacity:1}80%,100%{opacity:0} }
@keyframes packetThree { 0%,15%{left:22%;bottom:25%;opacity:0}25%{opacity:1}70%{left:49%;bottom:48%;opacity:1}80%,100%{opacity:0} }

.project-photo img { object-position: center bottom; }

@media (max-width: 1100px) {
  .desktop-nav { gap: 20px; margin-right: 25px; }.hero { grid-template-columns: 1fr 1fr; }.system-visual { height: 520px; }.halo-one { width: 390px; height: 390px; }.halo-two { width: 270px; height: 270px; }.system-node { width: 130px; }.node-ai,.node-app{left:-1%}.node-auto,.node-data{right:-1%}.system-node::after{display:none}.manifesto { grid-template-columns: .25fr 1.75fr; }.manifesto-text { padding-left: 20%; }.service-card { min-height: 570px; }.approach-inner { gap: 70px; }.featured-project { grid-template-columns: 1.12fr .88fr; }.why-us { gap: 55px; }.contact-orbit { right: 2%; opacity: .7; }
}

@media (max-width: 860px) {
  .announcement { justify-content: flex-start; padding: 0 16px; font-size: 7px; }.announcement a { margin-left: auto; }
  .site-header { width: calc(100% - 32px); height: 68px; }.site-header.scrolled { padding: 0 16px; }.desktop-nav,.contact-trigger { display: none; }.menu-button { display: block; }
  .mobile-menu { display: block; position: fixed; z-index: 35; inset: 104px 0 0; background: rgba(4,6,10,.98); backdrop-filter: blur(17px); opacity: 0; visibility: hidden; transform: translateY(-14px); transition: .3s; }.site-header.scrolled + .mobile-menu { inset: 68px 0 0; }.mobile-menu.active { opacity: 1; visibility: visible; transform: none; }.mobile-menu nav { display: flex; flex-direction: column; padding: 32px 24px; }.mobile-menu a { padding: 19px 4px; border-bottom: 1px solid #192b39; color: #bac8d2; font: 600 14px/1 var(--display); }.mobile-menu a span { margin-right: 18px; color: var(--blue); font-size: 7px; }.mobile-menu .button { margin-top: 28px; }.menu-button.active span:first-child { transform: translateY(3px) rotate(45deg); }.menu-button.active span:last-child { transform: translateY(-3px) rotate(-45deg); }
  .hero { min-height: auto; width: calc(100% - 32px); grid-template-columns: 1fr; padding: 70px 0 90px; }.hero-copy { position: relative; z-index: 6; }.hero h1 { font-size: clamp(53px,12vw,82px); }.system-visual { height: 560px; margin-top: 20px; }.hero-footer { bottom: 21px; }
  .section { width: calc(100% - 32px); padding: 100px 0; }.manifesto { grid-template-columns: 1fr; gap: 38px; }.manifesto-text { padding-left: 0; }.section-head { align-items: flex-start; flex-direction: column; margin-bottom: 55px; }.section-head > p { max-width: 600px; }.service-card { min-height: 560px; }
  .approach-inner { grid-template-columns: 1fr; }.approach-intro { position: static; }.featured-project { grid-template-columns: 1fr; }.project-photo { min-height: 580px; }.project-photo::after { background: linear-gradient(180deg,transparent 60%,#070d13); }.project-content { min-height: 440px; }.why-us { grid-template-columns: 1fr; }.why-grid article { grid-template-columns: 40px .8fr 1.2fr; }
  .contact { min-height: 610px; padding: 90px 24px; }.contact-orbit { width: 350px; height: 350px; right: -90px; opacity: .32; }.footer-main { grid-template-columns: 1fr 1fr; }.footer-cta { grid-column: 1 / -1; }.footer-nav { gap: 25px; }
}

@media (max-width: 560px) {
  .announcement > span:nth-child(2) { max-width: 185px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.announcement a { font-size: 0; }.announcement a span { font-size: 14px; }
  .brand-copy strong { font-size: 13px; }.brand-copy small { font-size: 6px; }
  .hero { padding-top: 52px; }.hero h1 { font-size: 48px; }.hero-subtitle { font-size: 13px; }.hero-actions { align-items: flex-start; flex-direction: column; gap: 19px; }.hero-proof { grid-template-columns: 1fr 1fr; gap: 20px 0; margin-top: 48px; }.hero-proof > div { margin: 0; }.hero-proof > div:nth-child(2) { border: 0; padding-left: 18px; }.hero-proof > div:last-child { grid-column: 1 / -1; }
  .system-visual { height: 430px; margin-left: -10px; margin-right: -10px; }.halo-one { width: 320px; height: 320px; }.halo-two { width: 230px; height: 230px; }.system-core { width: 112px; }.system-core span { font-size: 32px; }.system-node { width: 115px; padding: 10px; }.system-node span { font-size: 6px; }.node-ai { top: 12% }.node-auto { top: 14% }.node-app { bottom: 10% }.node-data { bottom: 8% }.hero-footer { font-size: 5px; }
  .manifesto h2 { font-size: 31px; }.manifesto h2 span { white-space: normal; }.manifesto-text { grid-template-columns: 1fr; gap: 20px; margin-top: 40px; }.section-head h2 { font-size: 34px; }.service-grid { grid-template-columns: 1fr; }.service-card { min-height: 520px; padding: 24px; }.agent-demo,.browser-demo,.app-demo { width: 100%; }.flow-demo { margin: 75px -8px 85px; }.flow-node { width: 90px; padding: 11px; }.flow-demo > i { width: 18px; }
  .approach h2 { font-size: 42px; }.step-head { grid-template-columns: 32px 1fr auto; }.step-head h3 { font-size: 14px; }.process-step p { margin-left: 32px; }.project-photo { min-height: 480px; }.project-photo img { object-position: 53% 83%; }.project-content { min-height: 390px; padding: 27px 24px; }.project-content h3 { font-size: 43px; }.why-grid article { grid-template-columns: 30px 1fr; gap: 15px; }.why-grid article p { grid-column: 2; }.contact h2 { font-size: 40px; }.contact-orbit { width: 300px; height: 300px; right: -135px; }.footer-main { grid-template-columns: 1fr; }.footer-cta { grid-column: auto; }.footer-bottom span:nth-child(2) { display: none; }.field-row { grid-template-columns: 1fr; }.panel-head,.panel-body { padding-left: 21px; padding-right: 21px; }.service-options { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; } *,*::before,*::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }.reveal { opacity: 1; transform: none; }
}
