:root {
  --bg: #09090b;
  --panel: #111114;
  --text: #f4f1ea;
  --muted: #96969d;
  --line: rgba(255,255,255,.14);
  --lime: #b7ff6a;
  --purple: #ad82ff;
  --cyan: #78dfff;
  --orange: #ff7757;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body { margin: 0; overflow-x: hidden; color: var(--text); background: var(--bg); font-family: "Manrope", system-ui, sans-serif; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
::selection { color: #070708; background: var(--lime); }
.noise { position: fixed; inset: 0; z-index: 90; 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='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.cursor-glow { position: fixed; width: 30rem; height: 30rem; border-radius: 50%; background: radial-gradient(circle, rgba(164,122,255,.09), transparent 68%); pointer-events: none; z-index: 2; transform: translate(-50%,-50%); transition: opacity .3s; }
.page-loader { position: fixed; inset: 0; z-index: 200; background: var(--text); color: var(--bg); display: grid; place-content: center; gap: 1rem; transition: transform .9s cubic-bezier(.76,0,.24,1); }
.page-loader.loaded { transform: translateY(-105%); }
.page-loader span { font: 700 clamp(2rem,7vw,7rem)/1 "Manrope",sans-serif; letter-spacing: -.07em; }
.loader-track { width: min(60vw,32rem); height: 2px; background: rgba(0,0,0,.15); overflow: hidden; }
.loader-track i { display:block; width:100%; height:100%; background:#000; transform:translateX(-100%); animation: load 1.1s cubic-bezier(.77,0,.18,1) forwards; }
@keyframes load { to { transform: translateX(0); } }
.site-header { position: fixed; z-index: 50; top: 0; left: 0; width: 100%; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 1.25rem 2rem; mix-blend-mode: difference; color: #fff; }
.brand { display:flex; align-items:center; gap:.8rem; width:max-content; }
.brand-mark { font-weight:800; font-size:1.15rem; letter-spacing:-.06em; }
.brand-role { font: 400 .57rem/1.25 "DM Mono",monospace; letter-spacing:.06em; opacity:.72; }
nav { display:flex; gap:2rem; font:400 .72rem "DM Mono",monospace; text-transform:uppercase; }
nav a, footer a { position:relative; }
nav a:after, footer a:after { content:""; position:absolute; left:0; bottom:-.3rem; width:100%; height:1px; background:currentColor; transform:scaleX(0); transform-origin:right; transition:transform .35s; }
nav a:hover:after, footer a:hover:after { transform:scaleX(1); transform-origin:left; }
.availability { justify-self:end; display:flex; align-items:center; gap:.55rem; font:500 .62rem "DM Mono",monospace; border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:.65rem .85rem; backdrop-filter:blur(12px); }
.availability i { width:.42rem; height:.42rem; border-radius:50%; background:var(--lime); box-shadow:0 0 12px var(--lime); animation:pulse 2s infinite; }
@keyframes pulse { 50% { opacity:.35; } }
.hero { position:relative; min-height:100svh; display:flex; flex-direction:column; justify-content:flex-end; padding:8rem 2rem 2rem; overflow:hidden; }
#field { position:absolute; inset:0; width:100%; height:100%; opacity:.55; }
.hero:after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 38%,rgba(9,9,11,.25) 63%,var(--bg)); pointer-events:none; }
.hero-orb { position:absolute; left:53%; top:44%; width:min(42vw,37rem); aspect-ratio:1; transform:translate(-50%,-50%); border-radius:50%; background:conic-gradient(from 190deg,var(--purple),#6a4dff,var(--cyan),#efffaf,var(--orange),var(--purple)); filter:blur(1px); box-shadow:0 0 90px rgba(166,124,255,.32); animation:float 9s ease-in-out infinite; }
.hero-orb:before { content:""; position:absolute; inset:2px; border-radius:inherit; background:radial-gradient(circle at 63% 24%,rgba(255,255,255,.9),transparent 8%),radial-gradient(circle at 55% 55%,transparent 20%,rgba(8,8,10,.73) 72%); mix-blend-mode:overlay; }
.hero-orb:after { content:""; position:absolute; inset:-18%; border-radius:45% 55% 62% 38%; border:1px solid rgba(255,255,255,.16); animation:spin 16s linear infinite; }
.hero-orb span { position:absolute; inset:18%; border-radius:50%; border:1px solid rgba(255,255,255,.3); box-shadow:inset 0 0 30px rgba(255,255,255,.12); }
@keyframes float { 50% { transform:translate(-50%,-53%) rotate(4deg) scale(1.04); } }
@keyframes spin { to { transform:rotate(360deg); } }
.eyebrow,.hero-title,.hero-bottom { position:relative; z-index:3; }
.eyebrow { display:flex; justify-content:space-between; font:400 .65rem "DM Mono",monospace; letter-spacing:.08em; margin-bottom:1rem; }
.hero-title { margin:0; font-size:clamp(4.1rem,12.4vw,12.5rem); line-height:.76; letter-spacing:-.085em; font-weight:800; text-transform:uppercase; }
.hero-title .line { display:block; white-space:nowrap; }
.hero-title .line:last-child { text-align:right; }
.hero-title em { color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.72); font-style:normal; font-weight:500; }
.hero-bottom { display:flex; justify-content:space-between; align-items:flex-end; margin-top:3.5rem; }
.hero-bottom p { margin:0; max-width:35rem; color:#c4c3c7; font-size:clamp(.9rem,1.25vw,1.12rem); line-height:1.65; }
.hero-bottom strong { color:var(--text); }
.scroll-cue { display:flex; align-items:center; gap:1rem; font:400 .63rem "DM Mono",monospace; }
.scroll-cue b { display:grid; place-content:center; width:2.9rem; height:2.9rem; border:1px solid var(--line); border-radius:50%; transition:.3s; }
.scroll-cue:hover b { background:var(--text); color:var(--bg); transform:translateY(5px); }
.marquee { border-block:1px solid var(--line); padding:1rem 0; overflow:hidden; background:#0c0c0e; }
.marquee-track { display:flex; align-items:center; width:max-content; animation:marquee 23s linear infinite; font:500 .65rem "DM Mono",monospace; letter-spacing:.12em; color:#b9b9be; }
.marquee span { padding:0 2rem; }
.marquee b { color:var(--lime); }
@keyframes marquee { to { transform:translateX(-50%); } }
.section-pad { padding:8rem 2rem; }
.section-label { display:grid; grid-template-columns:4rem 1fr; gap:1rem; padding-bottom:1rem; border-bottom:1px solid var(--line); font:400 .65rem "DM Mono",monospace; letter-spacing:.08em; color:#9d9da3; }
.manifesto { min-height:95vh; display:flex; flex-direction:column; }
.manifesto-copy { margin:auto 0; padding:6rem 0; }
.display-copy { margin:0; max-width:91rem; font-size:clamp(2.7rem,6.7vw,7.5rem); font-weight:600; letter-spacing:-.065em; line-height:1.04; }
.display-copy.muted { color:#47474d; }
.word { display:inline-block; opacity:0; transform:translateY(1.1em); transition:opacity .65s, transform .8s cubic-bezier(.2,.7,.2,1); transition-delay:calc(var(--i) * 45ms); }
.visible .word { opacity:1; transform:none; }
.manifesto-foot { display:grid; grid-template-columns:minmax(0,38rem) auto; justify-content:end; align-items:center; gap:8vw; }
.manifesto-foot p { color:#adadb3; font-size:1rem; line-height:1.75; }
.mini-orbit { width:6rem; height:6rem; border:1px solid var(--line); border-radius:50%; display:grid; place-content:center; position:relative; font:400 .65rem "DM Mono"; }
.mini-orbit i { position:absolute; width:.55rem; height:.55rem; border-radius:50%; background:var(--cyan); top:calc(50% - .275rem); left:calc(50% - .275rem); animation:orbit 5s linear infinite; }
@keyframes orbit { from { transform:rotate(0) translateX(3rem); } to { transform:rotate(360deg) translateX(3rem); } }
.capabilities { background:var(--text); color:#111; border-radius:2.5rem 2.5rem 0 0; }
.capabilities .section-label { border-color:rgba(0,0,0,.2); color:#56565b; }
.cap-head { display:flex; justify-content:space-between; align-items:flex-end; gap:3rem; padding:5rem 0; }
.cap-head h2,.process h2 { margin:0; font-size:clamp(3rem,6vw,6.5rem); line-height:.95; letter-spacing:-.065em; }
.cap-head p { max-width:24rem; margin:0; color:#626268; line-height:1.6; }
.cap-item { display:grid; grid-template-columns:5rem 1.2fr 1fr auto; align-items:center; min-height:8rem; border-top:1px solid rgba(0,0,0,.18); position:relative; overflow:hidden; transition:color .35s,padding .35s; }
.cap-item:last-child { border-bottom:1px solid rgba(0,0,0,.18); }
.cap-item:before { content:""; position:absolute; inset:0; z-index:0; background:var(--accent); transform:translateY(101%); transition:transform .45s cubic-bezier(.25,.7,.2,1); }
.cap-item > * { position:relative; z-index:1; }
.cap-item > span,.cap-item > p { font:400 .67rem "DM Mono",monospace; }
.cap-item h3 { margin:0; font-size:clamp(1.7rem,3.4vw,3.8rem); letter-spacing:-.05em; }
.cap-item b { font-size:2rem; font-weight:400; transition:transform .35s; }
.cap-item:hover:before,.cap-item:focus:before { transform:none; }
.cap-item:hover b { transform:rotate(45deg); }
.cap-detail { position:absolute; right:4rem; bottom:.55rem; width:30%; font-size:.7rem; opacity:0; transform:translateY(8px); transition:.35s; }
.cap-item:hover .cap-detail { opacity:.7; transform:none; }
.practice { background:#0c0c0e; }
.practice-head { display:flex; justify-content:space-between; align-items:flex-end; padding:5rem 0 3rem; }
.practice-head h2 { margin:0; font-size:clamp(3rem,7vw,7.5rem); letter-spacing:-.075em; }
.practice-head p { max-width:25rem; margin:0 0 .8rem; color:var(--muted); line-height:1.6; }
.projects { display:grid; grid-template-columns:1fr 1fr; gap:5rem 1.5rem; }
.project-card { outline:none; }
.project-visual { min-height:37rem; border-radius:1.2rem; position:relative; overflow:hidden; background:#151519; transition:transform .65s cubic-bezier(.2,.7,.2,1),border-radius .45s; }
.project-card:hover .project-visual,.project-card:focus .project-visual { transform:scale(.985); border-radius:3rem; }
.visual-one { background:radial-gradient(circle at 65% 36%,rgba(172,126,255,.48),transparent 25%),radial-gradient(circle at 40% 70%,rgba(94,206,255,.2),transparent 28%),#121116; }
.visual-one:before { content:""; position:absolute; width:28rem; aspect-ratio:1; left:50%; top:50%; transform:translate(-50%,-50%); border:1px solid rgba(255,255,255,.14); border-radius:50%; box-shadow:0 0 0 4rem rgba(255,255,255,.015),0 0 0 8rem rgba(255,255,255,.015); }
.dialogue { position:absolute; z-index:2; padding:.9rem 1.1rem; border:1px solid rgba(255,255,255,.16); border-radius:999px; background:rgba(13,13,16,.64); backdrop-filter:blur(14px); font-size:.72rem; }
.d1 { top:24%; left:12%; }.d2 { top:48%; right:8%; }.d3 { bottom:18%; left:23%; color:var(--lime); }
.radar { position:absolute; left:50%; top:50%; width:6rem; aspect-ratio:1; border-radius:50%; background:conic-gradient(from 0deg,transparent,rgba(182,255,106,.8)); mask:radial-gradient(circle,transparent 0 30%,#000 31%); animation:spin 4s linear infinite; }
.visual-two { background:linear-gradient(145deg,#10171a,#102d35 55%,#17312c); }
.data-cloud { position:absolute; inset:10%; filter:blur(.2px); }
.data-cloud i { position:absolute; width:clamp(4rem,8vw,8rem); aspect-ratio:1; border-radius:50%; background:radial-gradient(circle at 35% 30%,#dcfff2,#4ee0ba 20%,#16584e 65%,transparent 67%); box-shadow:0 0 30px rgba(84,230,187,.25); animation:drift 7s ease-in-out infinite alternate; }
.data-cloud i:nth-child(1){left:8%;top:15%}.data-cloud i:nth-child(2){left:38%;top:5%;animation-delay:-2s}.data-cloud i:nth-child(3){right:3%;top:25%;animation-delay:-4s}.data-cloud i:nth-child(4){left:20%;bottom:4%;animation-delay:-3s}.data-cloud i:nth-child(5){left:53%;bottom:12%;animation-delay:-5s}.data-cloud i:nth-child(6){right:5%;bottom:-4%;animation-delay:-1s}.data-cloud i:nth-child(7){left:42%;top:41%;animation-delay:-6s}
@keyframes drift { to { transform:translate(1.2rem,-1.5rem) scale(1.08); } }
.visual-caption { position:absolute; z-index:2; inset:auto 1.3rem 1.3rem; display:flex; align-items:end; justify-content:space-between; font:400 .62rem "DM Mono"; }
.visual-caption strong { font-size:2.4rem; letter-spacing:-.08em; }
.project-meta { display:flex; justify-content:space-between; margin-top:1.1rem; font:400 .61rem "DM Mono"; color:#7f7f86; }
.project-card h3 { margin:.7rem 0 .45rem; font-size:clamp(1.6rem,2.8vw,3rem); letter-spacing:-.05em; }
.project-card > p { margin:0; color:var(--muted); line-height:1.6; max-width:36rem; }
.project-wide { grid-column:1/-1; }
.project-wide .project-visual { min-height:33rem; }
.visual-three { background:radial-gradient(circle at 50% 50%,rgba(255,130,96,.25),transparent 25%),#151315; }
.alignment-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size:5rem 5rem; mask:radial-gradient(circle,#000,transparent 72%); }
.align-copy { position:absolute; inset:0; display:flex; justify-content:center; align-items:center; gap:clamp(1rem,5vw,6rem); font:500 clamp(1rem,3vw,3.2rem) "DM Mono"; }
.align-copy b { color:var(--orange); font-size:4rem; text-shadow:0 0 35px var(--orange); animation:pulse 1.6s infinite; }
.wide-copy { display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:end; }
.wide-copy > p { color:var(--muted); max-width:28rem; justify-self:end; }
.process { background:var(--text); color:#111; }
.process .section-label { border-color:rgba(0,0,0,.2); color:#555; }
.process h2 { padding:5rem 0; }
.process-grid { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid rgba(0,0,0,.2); }
.process-grid li { min-height:23rem; padding:1.3rem; border-right:1px solid rgba(0,0,0,.2); display:flex; flex-direction:column; }
.process-grid li:last-child { border:0; }
.process-grid span { font:400 .65rem "DM Mono"; color:#666; }
.process-grid h3 { margin:auto 0 1rem; font-size:2rem; letter-spacing:-.05em; }
.process-grid p { margin:0; color:#666; font-size:.85rem; }
.contact { min-height:90vh; position:relative; overflow:hidden; display:flex; flex-direction:column; }
.contact-orb { position:absolute; width:42vw; height:42vw; right:-7%; top:8%; border-radius:50%; background:conic-gradient(from 140deg,var(--orange),var(--purple),var(--cyan),var(--lime),var(--orange)); filter:blur(50px); opacity:.32; animation:spin 18s linear infinite; }
.contact-kicker { position:relative; margin:auto 0 1.5rem; font:400 .7rem "DM Mono"; letter-spacing:.1em; color:var(--lime); }
.contact h2 { position:relative; margin:0; font-size:clamp(3.8rem,10vw,11rem); line-height:.84; letter-spacing:-.08em; }
.contact h2 em { font-style:normal; color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.65); }
.contact-bottom { position:relative; display:flex; justify-content:space-between; align-items:flex-end; margin-top:4rem; }
.contact-bottom p { color:#aaaab1; line-height:1.7; }.contact-bottom p span { color:#66666d; }
.contact-button { min-width:15rem; height:4.2rem; border:0; border-radius:999px; display:flex; justify-content:space-between; align-items:center; padding:0 1.5rem; cursor:pointer; background:var(--text); color:#111; transition:transform .3s,background .3s; }
.contact-button:hover { transform:scale(1.04); background:var(--lime); }
.contact-button b { font-size:1.5rem; font-weight:400; }
footer { border-top:1px solid var(--line); display:flex; justify-content:space-between; padding:1.5rem 2rem; color:#77777e; font:400 .6rem "DM Mono"; }
.toast { position:fixed; z-index:100; left:50%; bottom:2rem; transform:translate(-50%,5rem); opacity:0; padding:.8rem 1rem; background:var(--lime); color:#111; border-radius:999px; font:500 .7rem "DM Mono"; transition:.4s; }
.toast.show { transform:translate(-50%,0); opacity:1; }
.reveal { opacity:0; transform:translateY(2rem); transition:opacity .8s, transform .9s cubic-bezier(.2,.7,.2,1); }
.reveal.visible { opacity:1; transform:none; }
@media (max-width: 850px) {
  .site-header { padding:1rem; grid-template-columns:1fr auto; }.site-header nav{display:none}.brand-role{display:none}.hero{padding:7rem 1rem 1.5rem}.hero-title{font-size:clamp(3rem,13.2vw,6rem);line-height:.84}.hero-title .line:last-child{text-align:left}.hero-orb{width:70vw;left:57%;top:42%}.hero-bottom{display:block;margin-top:2.5rem}.scroll-cue{margin-top:1.5rem;justify-content:flex-end}.section-pad{padding:6rem 1rem}.manifesto-foot{grid-template-columns:1fr auto;gap:2rem}.capabilities{border-radius:1.5rem 1.5rem 0 0}.cap-head,.practice-head,.contact-bottom{display:block}.cap-head p,.practice-head p{margin-top:2rem}.cap-item{grid-template-columns:2.2rem 1fr auto;min-height:7rem}.cap-item>p{display:none}.cap-detail{display:none}.projects{grid-template-columns:1fr;gap:4rem}.project-wide{grid-column:auto}.project-visual{min-height:28rem}.wide-copy{grid-template-columns:1fr}.wide-copy>p{justify-self:start}.process-grid{grid-template-columns:1fr 1fr}.process-grid li{min-height:16rem;border-bottom:1px solid rgba(0,0,0,.2)}.contact-button{margin-top:2rem}.contact-orb{width:75vw;height:75vw}footer{gap:1rem;flex-wrap:wrap}footer span:nth-child(2){display:none}
}
@media (max-width: 520px) { .eyebrow span:last-child{display:none}.manifesto-foot{grid-template-columns:1fr}.mini-orbit{display:none}.process-grid{grid-template-columns:1fr}.process-grid li{min-height:12rem;border-right:0}.display-copy{font-size:2.65rem}.project-visual{min-height:24rem}.dialogue{font-size:.6rem}.d2{right:2%}.align-copy{flex-direction:column}.align-copy b{transform:rotate(90deg)} }
@media (prefers-reduced-motion: reduce) { *,*:before,*:after { animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important }.cursor-glow{display:none} }
