:root {
  --bg: #07070b;
  --surface: #0d0d13;
  --surface-2: #14141d;
  --text: #f3f1ed;
  --muted: #a4a1ab;
  --line: rgba(255,255,255,.13);
  --violet: #8f67ff;
  --cyan: #69e7ff;
  --lime: #d8ff6a;
  --pad: clamp(1.25rem, 4vw, 4.5rem);
  --header-h: 5.5rem;
}

* { box-sizing: border-box; }
html { scroll-behavior: auto; background: var(--bg); }
body { margin: 0; background: var(--bg); color: var(--text); font-family: "DM Sans", sans-serif; overflow-x: hidden; cursor: auto; }
body.has-custom-cursor { cursor: none; }
body.menu-open { overflow: hidden; }
::selection { background: var(--violet); color: white; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
canvas { display: block; }

.noise { position: fixed; inset: 0; z-index: 9998; 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='.95' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); }
.cursor-dot,.cursor-ring { position: fixed; top: 0; left: 0; z-index: 10000; pointer-events: none; border-radius: 50%; transform: translate(-50%,-50%); }
.cursor-dot { width: 6px; height: 6px; background: white; mix-blend-mode: difference; }
.cursor-ring { width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.65); transition: width .25s,height .25s,background .25s,border-color .25s; }
.cursor-ring.is-active { width: 56px; height: 56px; background: rgba(255,255,255,.12); border-color: transparent; backdrop-filter: blur(3px); }

.loader { position: fixed; inset: 0; z-index: 9999; background: #050507; display: grid; place-items: center; }
.loader__inner { width: min(500px, calc(100vw - 3rem)); }
.loader__brand { display: block; font: 600 clamp(2.2rem,8vw,5rem)/1 "Space Grotesk"; letter-spacing: -.07em; margin-bottom: 2rem; }
.loader__track { height: 1px; background: rgba(255,255,255,.14); overflow: hidden; }
.loader__bar { display: block; height: 100%; width: 0; background: linear-gradient(90deg,var(--violet),var(--cyan)); }
.loader__meta { display:flex; justify-content:space-between; padding-top:.75rem; font-size:.65rem; letter-spacing:.16em; color:var(--muted); }
.loader__value { color: var(--text); font-weight: 500; }

.site-header { position: fixed; z-index: 1000; top: 0; left: 0; width: 100%; height: var(--header-h); padding: 0 var(--pad); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; border-bottom: 1px solid transparent; transition: background .35s,border-color .35s,transform .35s; }
.site-header.is-scrolled { background: rgba(7,7,11,.76); border-color: var(--line); backdrop-filter: blur(18px); }
.site-header.is-hidden { transform: translateY(-100%); }
.brand { display:inline-flex; align-items:center; gap:.8rem; width:max-content; font:600 .9rem/1 "Space Grotesk"; letter-spacing:.12em; }
.brand__mark { position:relative; width:25px; height:25px; display:inline-block; transform:rotate(45deg); }
.brand__mark i { position:absolute; inset:0; border:1px solid currentColor; border-radius:4px; }
.brand__mark i:last-child { transform:scale(.52); background:currentColor; }
.desktop-nav { display:flex; gap:2.5rem; font-size:.78rem; }
.desktop-nav a { color:var(--muted); transition:color .25s; }
.desktop-nav a:hover { color:var(--text); }
.header-cta { justify-self:end; display:flex; align-items:center; gap:1.1rem; padding:.75rem .8rem .75rem 1.15rem; border:1px solid var(--line); border-radius:100px; font-size:.75rem; overflow:hidden; }
.header-cta i { width:28px; height:28px; display:grid; place-items:center; background:var(--text); color:var(--bg); border-radius:50%; font-style:normal; }
.menu-toggle { display:none; justify-self:end; width:45px; height:45px; padding:0; border:1px solid var(--line); border-radius:50%; background:transparent; color:white; position:relative; z-index:2; }
.menu-toggle span { position:absolute; width:16px; height:1px; background:currentColor; left:14px; transition:transform .35s,top .35s; }
.menu-toggle span:first-child { top:18px; }.menu-toggle span:last-child{top:25px;}
.menu-toggle[aria-expanded="true"] span:first-child { top:22px; transform:rotate(45deg); }.menu-toggle[aria-expanded="true"] span:last-child{top:22px; transform:rotate(-45deg);}
.mobile-menu { position:fixed; inset:0; z-index:900; background:#09090e; display:none; flex-direction:column; justify-content:center; padding:8rem var(--pad) 3rem; clip-path:inset(0 0 100% 0); }
.mobile-menu nav { display:flex; flex-direction:column; }
.mobile-menu nav a { display:flex; align-items:start; gap:1rem; font:500 clamp(2.8rem,12vw,5rem)/1.15 "Space Grotesk"; letter-spacing:-.06em; border-bottom:1px solid var(--line); padding:.35rem 0; }
.mobile-menu nav span { font:500 .65rem/1 "DM Sans"; color:var(--violet); padding-top:.65rem; letter-spacing:.1em; }
.mobile-menu>p { margin-top:auto; color:var(--muted); font-size:.75rem; }

.hero { min-height:100svh; position:relative; overflow:hidden; display:flex; flex-direction:column; padding:calc(var(--header-h) + 4vh) var(--pad) 3.5rem; isolation:isolate; }
.webgl { position:absolute; inset:0; width:100%; height:100%; z-index:-2; }
.hero__glow { position:absolute; width:55vw; height:55vw; min-width:550px; min-height:550px; right:-13vw; top:3vh; border-radius:50%; background:radial-gradient(circle,rgba(143,103,255,.2),rgba(105,231,255,.05) 42%,transparent 70%); filter:blur(30px); z-index:-3; }
.hero__eyebrow { display:flex; align-items:center; gap:.75rem; text-transform:uppercase; font-size:.64rem; letter-spacing:.18em; color:var(--muted); }
.pulse-dot { width:7px; height:7px; border-radius:50%; background:var(--lime); box-shadow:0 0 0 0 rgba(216,255,106,.5); animation:pulse 2s infinite; }
@keyframes pulse { 70%{box-shadow:0 0 0 10px rgba(216,255,106,0)}100%{box-shadow:0 0 0 0 rgba(216,255,106,0)}}
.hero__content { margin:auto 0; padding-top:6vh; }
.hero__title { margin:0; font:600 clamp(4.25rem,12.5vw,13rem)/.78 "Space Grotesk"; letter-spacing:-.085em; text-transform:uppercase; max-width:92vw; }
.title-line { display:block; overflow:hidden; padding-right:.08em; }
.title-line>span { display:block; transform:translateY(110%); }
.title-line--outline { color:transparent; -webkit-text-stroke:1px rgba(243,241,237,.55); margin-left:12.5vw; }
.hero__bottom { display:grid; grid-template-columns:minmax(230px,440px) auto; justify-content:space-between; align-items:end; margin-top:clamp(2.5rem,6vh,5rem); padding-left:13vw; }
.hero__bottom p { color:var(--muted); line-height:1.6; margin:0; font-size:clamp(.9rem,1.2vw,1.1rem); }
.round-link { width:105px; height:105px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; gap:.8rem; text-transform:uppercase; font-size:.62rem; letter-spacing:.1em; transition:background .3s,color .3s,border-color .3s; }
.round-link i { font-style:normal; font-size:1.1rem; }
.round-link:hover { background:var(--text); color:var(--bg); border-color:var(--text); }
.hero__rail { display:flex; align-items:center; justify-content:space-between; gap:1rem; font-size:.56rem; letter-spacing:.13em; color:rgba(255,255,255,.42); white-space:nowrap; }
.hero__rail i { height:1px; background:var(--line); flex:1; }

.section-pad { padding:clamp(7rem,13vw,13rem) var(--pad); }
.section-pad-x { padding-left:var(--pad); padding-right:var(--pad); }
.section-kicker { display:grid; grid-template-columns:3rem auto; align-items:center; margin-bottom:clamp(3rem,7vw,7rem); text-transform:uppercase; font-size:.65rem; letter-spacing:.14em; color:var(--muted); }
.section-kicker span { color:var(--violet); }
.section-kicker p { margin:0; }
.intro { border-top:1px solid var(--line); }
.intro__grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(240px,28%); gap:clamp(3rem,8vw,10rem); align-items:end; }
.statement { margin:0; max-width:1000px; font:500 clamp(2.25rem,5.4vw,6.4rem)/1.04 "Space Grotesk"; letter-spacing:-.055em; }
.line-mask { display:block; overflow:hidden; padding-bottom:.07em; }
.line-inner { display:block; transform:translateY(105%); }
.intro__aside p { margin:0 0 2rem; color:var(--muted); line-height:1.7; }
.text-link { display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); padding-bottom:.75rem; font-size:.78rem; }
.text-link span { font-size:1rem; }

.showcase { padding:clamp(5rem,10vw,10rem) 0 0; background:#ecebe8; color:#0c0c10; overflow:hidden; }
.showcase .section-kicker { color:#68666c; }
.showcase__head h2 { margin:0 0 clamp(4rem,8vw,8rem); font:500 clamp(3rem,8.5vw,9rem)/.92 "Space Grotesk"; letter-spacing:-.07em; }
.showcase__head em { font-weight:400; color:#7153d9; }
.horizontal-wrap { width:100%; overflow:hidden; }
.horizontal-track { display:flex; gap:2vw; width:max-content; padding:0 var(--pad) clamp(6rem,10vw,10rem); }
.project-card { width:min(72vw,950px); flex:0 0 auto; outline:none; }
.project-card__visual { height:min(62vw,680px); min-height:430px; position:relative; overflow:hidden; display:grid; place-items:center; background:#111; border-radius:2px; transform:translateZ(0); }
.project-card__visual::after { content:""; position:absolute; inset:0; border:1px solid rgba(255,255,255,.1); pointer-events:none; }
.project-index { position:absolute; left:1.5rem; top:1.5rem; color:rgba(255,255,255,.7); font-size:.6rem; letter-spacing:.13em; }
.project-card__meta { display:flex; align-items:start; justify-content:space-between; padding-top:1.25rem; }
.project-card__meta p { margin:0 0 .5rem; color:#76737b; font-size:.68rem; text-transform:uppercase; letter-spacing:.11em; }
.project-card__meta h3 { margin:0; font:600 clamp(1.4rem,2.5vw,2.8rem)/1 "Space Grotesk"; letter-spacing:-.04em; }
.project-card__meta>span { font-size:.7rem; color:#76737b; }
.project-card--one .project-card__visual { background:radial-gradient(circle at 65% 40%,#3e2369,#100c1a 58%,#09090c); }
.orb { position:absolute; border-radius:50%; filter:blur(1px); }
.orb--a { width:44%; aspect-ratio:1; background:radial-gradient(circle at 32% 28%,#f3d8ff,#9d61ff 28%,#31206a 65%,#08090c 72%); box-shadow:0 0 80px rgba(144,88,255,.4); left:15%; top:24%; }
.orb--b { width:20%; aspect-ratio:1; background:radial-gradient(circle at 30% 25%,white,#77eaff 20%,#237692 62%,#0c1419 72%); right:14%; top:17%; }
.object-helix { width:48%; height:58%; position:relative; transform:rotate(-20deg); z-index:2; }
.object-helix i { position:absolute; inset:0; border:clamp(12px,2vw,28px) solid rgba(255,255,255,.86); border-left-color:transparent; border-radius:50%; transform:rotateX(65deg) rotateZ(var(--r)); box-shadow:0 0 26px rgba(255,255,255,.24); }
.object-helix i:nth-child(1){--r:0deg}.object-helix i:nth-child(2){--r:60deg;transform:translateY(18%) rotateX(65deg) rotateZ(var(--r))}.object-helix i:nth-child(3){--r:120deg;transform:translateY(36%) rotateX(65deg) rotateZ(var(--r))}
.project-card--two .project-card__visual { background:linear-gradient(145deg,#17191b,#050506); perspective:900px; }
.grid-surface { position:absolute; inset:-35%; background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px); background-size:38px 38px; transform:rotateX(62deg) rotateZ(-18deg); mask-image:radial-gradient(circle,#000 10%,transparent 63%); }
.chrome-ring { width:52%; aspect-ratio:1; border:clamp(22px,4vw,56px) solid #c7c9cc; border-radius:50%; transform:rotateX(62deg) rotateZ(-28deg); box-shadow:inset 15px 8px 18px white,inset -18px -16px 25px #25272b,0 35px 80px rgba(0,0,0,.7); position:relative; }
.chrome-ring i { position:absolute; inset:-20%; border:1px solid rgba(105,231,255,.65); border-radius:50%; }
.project-card--three .project-card__visual { background:linear-gradient(135deg,#d9ff69,#7fe5ba 50%,#637fff); }
.liquid-core { width:46%; aspect-ratio:1; border-radius:47% 53% 56% 44%/55% 40% 60% 45%; background:radial-gradient(circle at 30% 25%,#fff,#b4a1ff 18%,#5535cc 46%,#16112d 74%); box-shadow:inset -20px -26px 55px rgba(0,0,0,.55),0 35px 80px rgba(27,16,95,.42); animation:morph 7s ease-in-out infinite; }
@keyframes morph{50%{border-radius:61% 39% 36% 64%/38% 58% 42% 62%;transform:rotate(22deg) scale(1.06)}}
.project-word { position:absolute; font:700 clamp(7rem,20vw,20rem)/1 "Space Grotesk"; letter-spacing:-.12em; color:rgba(255,255,255,.34); mix-blend-mode:overlay; }
.project-card--four .project-card__visual { background:radial-gradient(circle at center,#3e3a68,#141223 52%,#08080b); perspective:900px; }
.prism { width:42%; aspect-ratio:1; position:relative; transform-style:preserve-3d; transform:rotateX(58deg) rotateZ(45deg); }
.prism i { position:absolute; inset:0; border:2px solid rgba(255,255,255,.75); background:linear-gradient(135deg,rgba(143,103,255,.36),rgba(105,231,255,.06)); backdrop-filter:blur(3px); box-shadow:0 0 35px rgba(143,103,255,.18); }
.prism i:nth-child(2){transform:translateZ(70px)}.prism i:nth-child(3){transform:translateZ(140px)}

.services__head { display:grid; grid-template-columns:1fr minmax(250px,28%); gap:4rem; align-items:end; margin-bottom:clamp(5rem,10vw,10rem); }
.services__head h2 { margin:0; max-width:1000px; font:500 clamp(3rem,7vw,8rem)/.95 "Space Grotesk"; letter-spacing:-.07em; }
.services__head>p { color:var(--muted); line-height:1.7; margin:0; }
.service-list { border-top:1px solid var(--line); }
.service-row { display:grid; grid-template-columns:5% 43% 1fr auto; align-items:center; min-height:clamp(110px,11vw,160px); border-bottom:1px solid var(--line); position:relative; overflow:hidden; transition:padding .35s; }
.service-row::before { content:""; position:absolute; inset:100% 0 0; background:var(--text); transition:inset .4s cubic-bezier(.2,.8,.2,1); z-index:-1; }
.service-row:hover { color:var(--bg); padding:0 1.5rem; }
.service-row:hover::before { inset:0; }
.service-row__num { font-size:.65rem; color:var(--violet); }
.service-row h3 { margin:0; font:500 clamp(1.5rem,3vw,3.3rem)/1 "Space Grotesk"; letter-spacing:-.045em; }
.service-row p { margin:0; color:var(--muted); font-size:.78rem; }
.service-row:hover p,.service-row:hover .service-row__num { color:#5d5962; }
.service-row>i { font-style:normal; font-size:1.4rem; }

.impact { position:relative; overflow:hidden; min-height:85vh; display:flex; flex-direction:column; background:#0b0912; }
.impact__halo { position:absolute; width:65vw; aspect-ratio:1; border-radius:50%; left:-18vw; top:10%; background:radial-gradient(circle at 55% 50%,rgba(105,231,255,.12),rgba(143,103,255,.24) 30%,transparent 68%); filter:blur(30px); }
.impact__content { position:relative; display:grid; grid-template-columns:1fr .85fr; gap:6vw; align-items:end; margin-top:auto; }
.impact h2 { margin:0; font:500 clamp(3.7rem,8.8vw,10rem)/.86 "Space Grotesk"; letter-spacing:-.075em; }
.impact h2 em { color:var(--violet); font-weight:400; }
.stats { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }
.stat { padding:1.6rem 1rem 0 0; border-right:1px solid var(--line); }
.stat:last-child { border-right:0; padding-left:1rem; }
.stat:nth-child(2){padding-left:1rem}
.stat strong { display:block; font:500 clamp(2.4rem,4vw,5rem)/1 "Space Grotesk"; letter-spacing:-.06em; }
.stat strong::after { content:"+"; color:var(--violet); font-size:.5em; vertical-align:top; }
.stat:nth-child(3) strong::after { content:"/100"; }
.stat span { display:block; margin-top:1rem; color:var(--muted); font-size:.68rem; line-height:1.4; }

.marquee { overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:2rem 0; }
.marquee__track { display:flex; width:max-content; align-items:center; gap:2rem; animation:marquee 26s linear infinite; font:500 clamp(3rem,7vw,7rem)/1 "Space Grotesk"; letter-spacing:-.06em; white-space:nowrap; }
.marquee__track i { color:var(--violet); font-style:normal; font-size:.5em; }
@keyframes marquee{to{transform:translateX(-50%)}}

.contact { min-height:88vh; display:flex; flex-direction:column; justify-content:center; }
.contact__eyebrow { color:var(--muted); text-transform:uppercase; letter-spacing:.17em; font-size:.65rem; margin:0 0 3rem; }
.contact__link { display:block; font:600 clamp(3.5rem,10.5vw,11.5rem)/.86 "Space Grotesk"; letter-spacing:-.08em; }
.contact__line { display:block; overflow:hidden; }
.contact__line>span { display:block; transform:translateY(105%); }
.contact__line--accent { color:var(--violet); }
.contact__footer { display:flex; align-items:center; justify-content:space-between; margin-top:5rem; padding-top:1.5rem; border-top:1px solid var(--line); font-size:.75rem; }
.contact__footer p { color:var(--muted); }
.site-footer { padding:2rem var(--pad); border-top:1px solid var(--line); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; font-size:.68rem; }
.site-footer>div { display:flex; gap:2rem; color:var(--muted); }
.site-footer>p { justify-self:end; color:var(--muted); }

@media (max-width: 900px) {
  body { cursor:auto; }
  .cursor-dot,.cursor-ring { display:none; }
  .desktop-nav,.header-cta { display:none; }
  .site-header { grid-template-columns:1fr auto; }
  .menu-toggle,.mobile-menu { display:flex; }
  .hero__title { font-size:clamp(4rem,16vw,8rem); }
  .title-line--outline { margin-left:0; }
  .hero__bottom { padding-left:0; }
  .hero__rail span:nth-of-type(n+3),.hero__rail i:nth-of-type(n+2){display:none}
  .intro__grid,.services__head,.impact__content { grid-template-columns:1fr; }
  .intro__aside,.services__head>p { max-width:520px; margin-left:auto; }
  .project-card { width:82vw; }
  .service-row { grid-template-columns:8% 1fr auto; padding:1.5rem 0; }
  .service-row p { grid-column:2; margin-top:.8rem; }.service-row>i{grid-column:3;grid-row:1}
  .impact__content { margin-top:4rem; }.stats{margin-top:4rem}
}

@media (max-width: 600px) {
  :root { --header-h:4.6rem; }
  .loader__brand{letter-spacing:-.05em}
  .hero { padding-bottom:1.5rem; min-height:100svh; }
  .hero__content { padding-top:8vh; }
  .hero__title { font-size:clamp(3.55rem,18vw,6.5rem); line-height:.82; }
  .hero__bottom { grid-template-columns:1fr auto; gap:1rem; align-items:end; margin-top:3rem; }
  .hero__bottom p { font-size:.8rem; max-width:230px; }
  .round-link { width:78px;height:78px;font-size:.52rem; }
  .hero__rail { display:none; }
  .section-kicker { margin-bottom:3rem; }
  .statement { font-size:2.35rem; }
  .intro__aside { margin:0; }
  .showcase__head h2 { font-size:3.6rem; }
  .horizontal-track { gap:1rem; }
  .project-card { width:88vw; }
  .project-card__visual { min-height:430px; height:120vw; }
  .services__head { gap:2rem; margin-bottom:4rem; }
  .services__head h2 { font-size:3.3rem; }
  .service-row { grid-template-columns:12% 1fr auto; }
  .service-row h3 { font-size:1.6rem; }
  .service-row p { font-size:.69rem; }
  .impact { min-height:auto; }
  .impact h2 { font-size:4rem; }
  .stats { grid-template-columns:1fr; }
  .stat,.stat:nth-child(2),.stat:last-child { border-right:0; border-bottom:1px solid var(--line); padding:1.4rem 0; display:grid; grid-template-columns:1fr 1fr; align-items:end; }
  .stat span { margin:0; }
  .contact { min-height:75vh; }
  .contact__link { font-size:3.4rem; line-height:.9; }
  .contact__footer { align-items:flex-end; gap:1rem; }
  .contact__footer p { max-width:170px; }
  .site-footer { grid-template-columns:1fr auto; row-gap:2rem; }
  .site-footer>div { display:none; }.site-footer>p{grid-column:2;grid-row:1}
}

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