:root { --ink:#060606; --panel:#0b0b0c; --panel-2:#101113; --paper:#e8e5df; --muted:#9c9b99; --line:rgba(232,229,223,.16); --blue:#92baff; --serif: Iowan Old Style, Baskerville, Georgia, serif; --sans: Inter, Avenir Next, Helvetica Neue, Arial, sans-serif; --mono: SFMono-Regular, Consolas, Liberation Mono, monospace; }
* { box-sizing:border-box; }
html { background:var(--ink); scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--paper); font-family:var(--sans); font-size:16px; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
.grain { position:fixed; inset:0; pointer-events:none; z-index:12; opacity:.055; 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='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E"); mix-blend-mode:soft-light; }
.cursor-glow { position:fixed; width:35rem; height:35rem; left:var(--mouse-x,50%); top:var(--mouse-y,50%); transform:translate(-50%,-50%); pointer-events:none; z-index:0; border-radius:50%; background:radial-gradient(circle,rgba(69,112,181,.10),transparent 65%); transition:opacity .4s; }
.progress { position:fixed; z-index:20; top:0; left:0; width:100%; height:2px; background:rgba(255,255,255,.06); }
.progress span { display:block; height:100%; width:var(--scroll,0%); background:var(--paper); }
.loader { position:fixed; inset:0; z-index:100; background:#060606; display:grid; place-items:center; color:var(--paper); font-size:12px; letter-spacing:.18em; transition:opacity .85s cubic-bezier(.22,1,.36,1), visibility .85s; }
.loader span:after { content:''; display:block; width:100%; height:1px; margin-top:10px; background:var(--paper); transform-origin:left; animation:load 1.1s ease-out forwards; }
.loader.is-gone { opacity:0; visibility:hidden; } @keyframes load { from { transform:scaleX(0); } to { transform:scaleX(1); } }
.site-header { position:absolute; z-index:10; top:0; left:0; width:100%; padding:29px clamp(24px,4vw,64px); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; font-size:10px; letter-spacing:.1em; text-transform:uppercase; }
.wordmark { font-weight:700; font-size:12px; letter-spacing:.13em; width:max-content; }.wordmark span { font-size:7px; vertical-align:top; margin-left:2px; }
.header-meta { display:flex; gap:30px; color:var(--muted); }.header-contact { justify-self:end; padding-bottom:5px; border-bottom:1px solid rgba(232,229,223,.55); transition:border-color .3s,color .3s; }.header-contact:hover { color:var(--blue); border-color:var(--blue); }.header-contact i { font-style:normal; margin-left:4px; }
.section { position:relative; z-index:1; padding-inline:clamp(24px,4vw,64px); }.eyebrow { margin:0; color:var(--muted); font-family:var(--mono); font-size:10px; letter-spacing:.04em; text-transform:uppercase; }
.hero { min-height:100svh; padding-top:clamp(150px,24vh,280px); overflow:hidden; isolation:isolate; }.hero-grid { position:absolute; inset:0; z-index:-2; opacity:.45; background:linear-gradient(90deg,transparent 49.95%,rgba(255,255,255,.06) 50%,transparent 50.05%), linear-gradient(0deg,transparent 49.9%,rgba(255,255,255,.04) 50%,transparent 50.1%); background-size:clamp(160px,25vw,380px) clamp(160px,25vw,380px); mask-image:linear-gradient(to bottom,black,transparent 88%); }.hero-orb { position:absolute; width:70vw; height:70vw; min-width:680px; min-height:680px; border:1px solid rgba(154,190,255,.16); right:-20vw; top:8vh; z-index:-1; border-radius:50%; box-shadow:inset 0 0 80px rgba(92,133,194,.06),0 0 150px rgba(39,80,144,.07); animation:breathe 9s ease-in-out infinite; }.hero-orb:before,.hero-orb:after { content:''; position:absolute; border-radius:inherit; border:1px solid rgba(154,190,255,.10); inset:10%; }.hero-orb:after { inset:27%; border-color:rgba(232,229,223,.12); } @keyframes breathe { 50%{ transform:scale(1.07) translate(-2%,-1%); opacity:.72; } }
.hero-copy { margin-top:clamp(58px,13vh,150px); }.hero-title { max-width:1350px; margin:0; font-size:clamp(3.8rem,8.1vw,9.4rem); font-weight:400; letter-spacing:-.075em; line-height:.88; }.hero-title span,.statement h2 span,.contact-title span { display:block; }.hero-title .indent { margin-left:clamp(28px,12vw,225px); }.hero-bottom { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; max-width:780px; margin-top:clamp(48px,10vh,130px); margin-left:clamp(28px,12vw,225px); }.hero-bottom p { max-width:270px; margin:0; color:#b9b7b3; font-size:13px; line-height:1.55; }.scroll-cue { display:flex; align-items:center; gap:9px; color:var(--muted); font-family:var(--mono); font-size:10px; white-space:nowrap; }.scroll-cue span { width:30px; height:1px; background:var(--muted); position:relative; }.scroll-cue span:after { content:''; position:absolute; right:0; top:-2px; width:5px; height:5px; border-top:1px solid var(--muted); border-right:1px solid var(--muted); transform:rotate(45deg); }.hero-index { position:absolute; right:clamp(24px,4vw,64px); bottom:30px; margin:0; color:var(--muted); font-family:var(--mono); font-size:10px; }.hero-index i { margin:0 5px; font-style:normal; }
.intro { min-height:94vh; padding-top:clamp(120px,19vh,250px); padding-bottom:80px; background:#0a0a0b; display:flex; flex-direction:column; }.intro-layout { display:grid; grid-template-columns:1fr minmax(220px,320px); align-items:end; gap:40px; margin-top:auto; }.display { margin:0; font-size:clamp(3rem,6.3vw,7.7rem); font-weight:400; line-height:.93; letter-spacing:-.07em; }.display em,.statement em,.about h2 em,.igrix h3 em,.device-study h3 em { color:#8e9bb4; font-family:var(--serif); font-weight:400; }.intro-note { margin:0 0 9px; color:#b7b5b1; font-size:14px; line-height:1.55; }.intro-number { align-self:flex-end; margin:clamp(50px,10vh,130px) 0 0; color:var(--muted); font-family:var(--mono); font-size:10px; }
.project { padding-top:clamp(100px,16vw,250px); padding-bottom:clamp(110px,16vw,260px); background:var(--panel); }.project-heading { display:grid; grid-template-columns:1fr minmax(230px,320px); gap:50px; align-items:end; }.project-name { margin:20px 0 0; font-size:clamp(5rem,14vw,16rem); font-weight:400; letter-spacing:-.105em; line-height:.72; }.project-name>span { color:var(--blue); font-family:var(--serif); font-weight:400; }.project-summary { margin:0 0 5px; color:#bebcb8; font-size:15px; line-height:1.55; }.visual-shell { border:1px solid var(--line); overflow:hidden; }.yug-stage { height:clamp(460px,56vw,850px); margin-top:clamp(70px,12vw,180px); padding:clamp(18px,2.1vw,32px); display:flex; align-items:center; justify-content:center; background:radial-gradient(circle at 61% 40%,rgba(83,133,209,.25),transparent 31%),linear-gradient(140deg,#14171e 0%,#0b0b0d 64%); }.stage-label { position:absolute; top:22px; left:22px; color:#8992a3; font-family:var(--mono); font-size:9px; letter-spacing:.06em; }.dashboard { display:grid; grid-template-columns:clamp(38px,4vw,58px) 1fr; width:min(89%,1080px); height:min(75%,600px); margin-top:20px; border:1px solid rgba(202,218,246,.2); border-radius:7px; overflow:hidden; background:#101318; box-shadow:0 37px 70px rgba(0,0,0,.52),0 0 0 9px rgba(233,242,255,.025); transform:perspective(1100px) rotateX(5deg) rotateY(-8deg); transition:transform 1s cubic-bezier(.22,1,.36,1); }.yug-stage:hover .dashboard { transform:perspective(1100px) rotateX(2deg) rotateY(-3deg) scale(1.02); }.dash-rail { display:flex; flex-direction:column; align-items:center; gap:clamp(16px,2vw,26px); padding-top:16px; background:#0c0f13; border-right:1px solid rgba(255,255,255,.075); }.dash-rail b { color:#a7c9ff; font-family:var(--serif); font-size:20px; }.dash-rail span { width:5px; height:5px; background:#4f5359; border-radius:50%; }.dash-rail .rail-active { width:6px; height:19px; background:#a7c9ff; border-radius:8px; }.dash-rail i { margin-top:auto; margin-bottom:15px; width:13px; height:13px; border:1px solid #6a717c; border-radius:50%; }.dash-main { display:flex; flex-direction:column; padding:clamp(15px,2.2vw,30px); min-width:0; }.dash-top { display:flex; justify-content:space-between; align-items:flex-start; }.dash-top small,.metric small,.chart-title small { display:block; color:#8b939e; font-size:clamp(7px,.7vw,10px); }.dash-top strong { display:block; margin-top:5px; color:#e2e7ef; font-size:clamp(12px,1.5vw,20px); font-weight:500; }.top-avatars { display:flex; align-items:center; }.top-avatars i { display:grid; place-items:center; width:20px; height:20px; margin-left:-4px; color:#dfe8fa; font-size:6px; font-style:normal; border:1px solid #313b4a; border-radius:50%; background:#1c2940; }.top-avatars i:last-child { background:#18202b; }.dash-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(6px,1.4vw,16px); margin-top:clamp(20px,3vw,42px); }.metric { position:relative; padding:clamp(9px,1.5vw,18px); border:1px solid rgba(210,221,239,.1); border-radius:3px; background:#15191f; overflow:hidden; }.metric:after { content:''; position:absolute; bottom:0; left:0; width:45%; height:1px; background:#79a9f7; }.metric strong { display:block; margin-top:clamp(6px,1vw,12px); color:#edf3fd; font-size:clamp(16px,2.2vw,28px); font-weight:400; letter-spacing:-.06em; }.metric strong span { font-size:.56em; }.metric em { display:block; margin-top:5px; color:#79acff; font-size:clamp(6px,.65vw,9px); font-style:normal; }.dash-chart { flex:1; min-height:80px; margin-top:clamp(14px,2.5vw,30px); padding:clamp(10px,1.5vw,17px); border:1px solid rgba(210,221,239,.1); border-radius:3px; background:#13171d; }.chart-title { display:flex; justify-content:space-between; color:#cbd2dd; font-size:clamp(7px,.75vw,10px); }.chart-title small { font-size:inherit; }.dash-chart svg { display:block; width:100%; height:calc(100% - 20px); margin-top:8px; overflow:visible; }.gridline { stroke:rgba(210,221,239,.08); stroke-width:1; }.area { fill:url(#area); }.line { fill:none; stroke:#8db9ff; stroke-width:2.5; vector-effect:non-scaling-stroke; }.dash-foot { display:flex; justify-content:space-between; margin-top:clamp(12px,1.6vw,20px); color:#8b939e; font-size:clamp(7px,.75vw,10px); }.dash-foot b { color:#a7c9ff; }.pulse { display:inline-block; width:5px; height:5px; margin-right:4px; border-radius:50%; background:#8db9ff; box-shadow:0 0 8px #8db9ff; animation:pulse 2s infinite; } @keyframes pulse { 50%{ opacity:.35; box-shadow:none; } }
.project-detail-grid { display:grid; grid-template-columns:1.1fr 1fr .8fr; gap:clamp(20px,4vw,80px); margin-top:clamp(75px,12vw,165px); }.detail-block { min-height:210px; padding-top:14px; border-top:1px solid var(--line); }.detail-block>span,.principle>span,.capability>span { color:var(--muted); font-family:var(--mono); font-size:10px; }.detail-block h3 { margin:46px 0 0; font-family:var(--serif); font-size:clamp(2rem,3.4vw,4.7rem); font-weight:400; letter-spacing:-.07em; line-height:.88; }.detail-copy p { max-width:310px; margin:42px 0 0; color:#bbb9b5; font-size:14px; line-height:1.58; }.text-link { display:inline-block; margin-top:30px; padding-bottom:5px; font-size:11px; border-bottom:1px solid var(--muted); }.text-link i { color:var(--blue); font-style:normal; }.detail-block ul { padding:33px 0 0; margin:0; list-style:none; }.detail-block li { padding:9px 0; color:#c8c6c2; font-size:12px; border-bottom:1px solid rgba(232,229,223,.11); }.device-study { display:grid; grid-template-columns:1fr 1fr; align-items:center; min-height:720px; margin:clamp(90px,13vw,180px) calc(clamp(24px,4vw,64px) * -1) 0; padding-left:clamp(24px,12vw,190px); background:#111216; overflow:hidden; }.study-copy h3 { margin:28px 0 0; font-size:clamp(2.6rem,4.5vw,6rem); font-weight:400; letter-spacing:-.07em; line-height:.89; }.phone-wrap { display:flex; align-items:flex-end; justify-content:center; align-self:stretch; padding-top:100px; background:radial-gradient(circle at 58% 49%,rgba(100,142,213,.26),transparent 33%),linear-gradient(135deg,#10151f,#090a0c); }.phone { position:relative; width:clamp(220px,24vw,360px); height:clamp(450px,48vw,700px); border:7px solid #20242b; border-bottom:0; border-radius:38px 38px 0 0; background:#111722; box-shadow:0 0 0 1px rgba(225,238,255,.25),-28px 35px 100px rgba(0,0,0,.5); overflow:hidden; }.phone-island { position:absolute; z-index:2; top:9px; left:50%; width:31%; height:20px; transform:translateX(-50%); border-radius:12px; background:#030405; }.phone-ui { height:100%; padding:43px 20px 22px; background:radial-gradient(circle at 70% 35%,rgba(105,164,255,.22),transparent 21%),linear-gradient(155deg,#171f2e,#0e1118 75%); }.phone-ui small { color:#8e9eb7; font-family:var(--mono); font-size:7px; }.phone-ui h4 { margin:18px 0 0; font-size:clamp(24px,2.8vw,40px); font-weight:400; letter-spacing:-.08em; line-height:.85; }.mini-orbit { position:relative; width:100%; aspect-ratio:1; margin:18px 0; border:1px solid rgba(166,199,248,.25); border-radius:50%; }.mini-orbit:before,.mini-orbit:after { content:''; position:absolute; inset:18%; border:1px solid rgba(166,199,248,.17); border-radius:50%; }.mini-orbit:after { inset:36%; }.mini-orbit span,.mini-orbit i,.mini-orbit b { position:absolute; display:block; border-radius:50%; background:#a7cbff; box-shadow:0 0 12px #a7cbff; }.mini-orbit span { width:6px; height:6px; left:15%; top:26%; }.mini-orbit i { width:4px; height:4px; right:12%; bottom:30%; }.mini-orbit b { width:11px; height:11px; left:48%; top:48%; transform:translate(-50%,-50%); }.phone-ui>p { margin:5px 0 0; color:#aeb7c7; font-size:9px; }.phone-card { display:flex; flex-direction:column; gap:7px; padding:13px; margin-top:15px; background:rgba(200,220,255,.08); border:1px solid rgba(200,220,255,.16); border-radius:7px; }.phone-card span { color:#91b6f0; font-size:7px; }.phone-card strong { font-size:10px; font-weight:400; line-height:1.3; }.phone-card em { color:#b7cbea; font-size:8px; font-style:normal; }
.statement { min-height:100svh; display:flex; flex-direction:column; justify-content:center; padding-top:90px; padding-bottom:70px; overflow:hidden; background:#e6e4df; color:#111; }.statement .eyebrow { color:#5d5c59; }.statement h2 { margin:clamp(35px,8vh,90px) 0 0; font-size:clamp(5rem,14vw,17rem); font-weight:400; letter-spacing:-.105em; line-height:.72; }.statement h2 .indent-sm { margin-left:clamp(35px,14vw,250px); }.statement h2 em { color:#8c99b0; }.statement-foot { margin:clamp(60px,12vh,160px) 0 0 auto; color:#5b5a57; font-size:13px; }
.igrix { background:#08090b; }.igrix-header { display:flex; align-items:center; justify-content:space-between; }.igrix-header>span { color:var(--muted); font-family:var(--mono); font-size:10px; }.igrix-title-line { display:grid; grid-template-columns:1fr minmax(215px,290px); gap:40px; align-items:end; margin-top:clamp(42px,7vw,100px); }.igrix-title-line .project-name { margin:0; }.igrix-title-line .project-name small { color:#8c9bb5; font-family:var(--serif); font-size:.5em; font-weight:400; letter-spacing:-.08em; }.igrix-title-line p { margin:0; color:#bebcb8; font-size:14px; line-height:1.5; }.blueprint { height:clamp(470px,58vw,800px); margin-top:clamp(60px,10vw,150px); background:radial-gradient(circle at 52% 51%,rgba(76,127,211,.17),transparent 25%),#0c1017; }.blueprint-top { position:absolute; z-index:1; top:20px; left:22px; right:22px; display:flex; justify-content:space-between; color:#92a2bb; font-family:var(--mono); font-size:9px; }.blueprint-lines { position:absolute; inset:0; background-image:linear-gradient(rgba(133,170,227,.075) 1px,transparent 1px),linear-gradient(90deg,rgba(133,170,227,.075) 1px,transparent 1px); background-size:35px 35px; mask-image:radial-gradient(circle at center,black,transparent 75%); }.blueprint:before,.blueprint:after { content:''; position:absolute; width:42%; height:1px; top:50%; left:29%; background:linear-gradient(90deg,transparent,#7eabea,transparent); transform:rotate(27deg); opacity:.7; }.blueprint:after { transform:rotate(-29deg); }.bp-node { position:absolute; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; width:clamp(105px,13vw,175px); aspect-ratio:1; padding:12px; text-align:center; border:1px solid rgba(162,194,242,.42); border-radius:50%; background:rgba(16,27,44,.75); box-shadow:0 0 30px rgba(81,139,222,.08),inset 0 0 18px rgba(118,168,244,.08); }.bp-node strong { color:#e2ebfc; font-size:clamp(9px,1vw,14px); font-weight:500; }.bp-node span { margin-top:5px; color:#9cabbe; font-size:clamp(6px,.65vw,9px); }.node-core { width:clamp(145px,19vw,250px); left:50%; top:50%; transform:translate(-50%,-50%); background:radial-gradient(circle,rgba(108,166,255,.25),rgba(14,25,41,.92) 60%); animation:core-pulse 4s ease-in-out infinite; }.node-core strong { color:#bcd7ff; font-size:clamp(15px,2vw,28px); letter-spacing:.1em; }.node-core i { position:absolute; inset:-13px; border:1px solid rgba(148,184,242,.17); border-radius:50%; }.node-one { left:13%; top:22%; }.node-two { right:13%; top:19%; }.node-three { left:17%; bottom:14%; }.node-four { right:15%; bottom:17%; } @keyframes core-pulse { 50%{ box-shadow:0 0 65px rgba(81,139,222,.28),inset 0 0 28px rgba(118,168,244,.13); } }.bp-status { position:absolute; right:22px; bottom:20px; color:#95a3b6; font-family:var(--mono); font-size:9px; }.bp-status span { display:inline-block; width:5px; height:5px; border-radius:50%; background:#a9ceff; box-shadow:0 0 8px #a9ceff; }.igrix-body { display:grid; grid-template-columns:1fr 1.1fr; gap:clamp(55px,12vw,190px); margin-top:clamp(110px,16vw,230px); }.igrix-sticky { align-self:start; position:sticky; top:80px; }.igrix h3 { margin:35px 0 0; font-size:clamp(2.8rem,4.3vw,6rem); font-weight:400; letter-spacing:-.075em; line-height:.87; }.principles { border-top:1px solid var(--line); }.principle { padding:25px 0 42px; border-bottom:1px solid var(--line); }.principle h4 { margin:48px 0 0; font-size:clamp(1.6rem,2.8vw,3.6rem); font-weight:400; letter-spacing:-.065em; line-height:.9; }.principle p { max-width:300px; margin:20px 0 0; color:#aaa8a4; font-size:13px; line-height:1.55; }
.engineering { padding-top:clamp(120px,17vw,250px); padding-bottom:clamp(110px,15vw,230px); background:#0d0d0f; }.engineering-intro { display:grid; grid-template-columns:.6fr 1.4fr; }.capabilities { display:grid; grid-template-columns:repeat(3,1fr); margin-top:clamp(100px,15vw,210px); border-top:1px solid var(--line); }.capability { min-height:clamp(220px,23vw,340px); padding:18px clamp(13px,2vw,30px) 22px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); transition:background .5s; }.capability:nth-child(3n) { border-right:0; }.capability:hover { background:#14171d; }.capability h3 { margin:clamp(72px,10vw,135px) 0 0; font-size:clamp(1.55rem,2.6vw,3.3rem); font-weight:400; letter-spacing:-.06em; line-height:.93; }.capability p { margin:13px 0 0; color:#9d9c99; font-size:12px; line-height:1.4; }
.about { display:grid; grid-template-columns:1fr 1fr; min-height:100vh; padding-top:clamp(100px,15vw,210px); padding-bottom:clamp(80px,12vw,160px); background:#e5e3de; color:#101010; overflow:hidden; }.about-mark { position:relative; align-self:center; width:min(33vw,500px); aspect-ratio:1; margin-left:clamp(-30px,-3vw,-6px); color:#14171d; border:1px solid rgba(14,15,17,.17); border-radius:50%; }.about-mark:before,.about-mark:after { content:''; position:absolute; border:1px solid rgba(14,15,17,.17); border-radius:inherit; inset:18%; }.about-mark:after { inset:36%; }.about-mark span { position:absolute; top:50%; left:50%; transform:translate(-50%,-53%); font-family:var(--serif); font-size:clamp(8rem,19vw,23rem); letter-spacing:-.17em; }.about-mark i { position:absolute; z-index:1; width:9px; height:9px; top:24%; right:17%; border-radius:50%; background:#7688a6; box-shadow:0 0 20px #7688a6; }.about-copy { align-self:end; }.about .eyebrow { color:#5a5956; }.about h2 { margin:32px 0 0; font-size:clamp(3.3rem,5.3vw,7rem); font-weight:400; letter-spacing:-.08em; line-height:.87; }.about-copy>p:not(.eyebrow) { max-width:360px; margin:36px 0 0; color:#545351; font-size:14px; line-height:1.6; }.magnetic-btn { display:flex; align-items:center; justify-content:space-between; width:190px; margin-top:45px; padding:14px 2px 14px 14px; color:#e8e6e1; font-size:11px; background:#111215; border-radius:40px; transition:transform .35s cubic-bezier(.22,1,.36,1); }.magnetic-btn:hover { transform:translateY(-4px); }.magnetic-btn i { display:grid; place-items:center; width:29px; height:29px; color:#111; font-style:normal; border-radius:50%; background:#e7e5e0; }
.contact { min-height:100svh; padding-top:clamp(130px,21vh,250px); padding-bottom:28px; display:flex; flex-direction:column; background:#080809; }.contact-title { margin:clamp(55px,10vh,125px) 0 0; font-size:clamp(3.9rem,9vw,12rem); font-weight:400; letter-spacing:-.095em; line-height:.8; }.contact-title a { margin-left:clamp(24px,11vw,180px); color:#8e9bb4; font-family:var(--serif); transition:color .35s; }.contact-title a:hover { color:#c4d8fb; }.contact-title i { font-family:var(--sans); font-size:.45em; font-style:normal; vertical-align:top; }.contact-bottom { display:grid; grid-template-columns:1.1fr .8fr 1fr auto; gap:20px; margin-top:auto; padding-top:80px; color:var(--muted); font-family:var(--mono); font-size:9px; letter-spacing:.02em; }.contact-bottom a { color:#d2d0cb; transition:color .25s; }.contact-bottom a:hover { color:var(--blue); }
.reveal,.reveal-line { opacity:0; transform:translateY(26px); filter:blur(8px); transition:opacity .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1),filter .9s cubic-bezier(.22,1,.36,1); }.reveal.is-visible,.reveal-line.is-visible { opacity:1; transform:none; filter:none; }.reveal-line:nth-child(2) { transition-delay:.08s; }.reveal-line:nth-child(3) { transition-delay:.16s; }.capability:nth-child(2),.principle:nth-child(2) { transition-delay:.08s; }.capability:nth-child(3),.principle:nth-child(3) { transition-delay:.16s; }
@media (max-width:760px) { .site-header { grid-template-columns:1fr auto; padding-top:23px; }.header-meta { display:none; }.header-contact { font-size:9px; }.cursor-glow { display:none; }.hero { padding-top:170px; }.hero-title { font-size:clamp(3.45rem,15vw,6rem); line-height:.89; }.hero-title .indent { margin-left:0; }.hero-bottom { display:block; margin-left:0; margin-top:65px; }.scroll-cue { margin-top:36px; }.hero-orb { min-width:540px; min-height:540px; top:19vh; right:-70vw; }.intro { min-height:78svh; }.intro-layout,.project-heading,.igrix-title-line { grid-template-columns:1fr; }.intro-note { max-width:290px; margin-top:26px; }.project-summary { max-width:280px; }.project-name { font-size:clamp(5rem,25vw,8rem); }.yug-stage { height:440px; margin-inline:-24px; }.dashboard { width:107%; height:72%; transform:perspective(800px) rotateX(6deg) rotateY(-11deg) translateX(-3%); }.stage-label { top:13px; left:14px; }.project-detail-grid { grid-template-columns:1fr; gap:15px; }.detail-block { min-height:auto; padding-bottom:26px; }.detail-copy p { margin-top:27px; }.detail-block h3 { margin-top:30px; }.detail-block ul { padding-top:18px; }.device-study { grid-template-columns:1fr; min-height:810px; margin-left:-24px; margin-right:-24px; padding:75px 24px 0; }.phone-wrap { margin:60px -24px 0; padding-top:55px; }.phone { width:235px; height:465px; }.statement { min-height:80svh; }.statement h2 { font-size:clamp(4.8rem,20vw,8rem); }.statement h2 .indent-sm { margin-left:0; }.statement-foot { margin-top:80px; }.igrix-title-line p { max-width:240px; }.blueprint { height:500px; margin-inline:-24px; }.blueprint-top { top:14px; left:14px; right:14px; font-size:7px; }.node-one { left:4%; top:18%; }.node-two { right:4%; top:18%; }.node-three { left:6%; bottom:16%; }.node-four { right:6%; bottom:16%; }.node-core { width:130px; }.bp-node:not(.node-core) { width:89px; }.bp-node span { font-size:6px; }.bp-status { bottom:14px; right:14px; font-size:7px; }.igrix-body,.about { grid-template-columns:1fr; }.igrix-body { gap:80px; }.igrix-sticky { position:static; }.engineering-intro { grid-template-columns:1fr; gap:35px; }.capabilities { grid-template-columns:1fr 1fr; margin-top:65px; }.capability:nth-child(3n) { border-right:1px solid var(--line); }.capability:nth-child(2n) { border-right:0; }.capability { min-height:200px; }.capability h3 { margin-top:75px; font-size:1.7rem; }.about { min-height:auto; gap:90px; padding-top:95px; }.about-mark { width:76vw; margin-left:-9vw; }.about-copy { align-self:auto; }.contact { min-height:86svh; }.contact-title { font-size:clamp(3.6rem,16vw,6rem); }.contact-title a { margin-left:0; }.contact-bottom { grid-template-columns:1fr 1fr; gap:18px; padding-top:90px; }.contact-bottom a:last-child { text-align:right; } }
@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; } }

::selection { color:#090909; background:#c9d9f2; }
body.intro-is-playing { overflow:hidden; }
.site-header { position:fixed; transition:background .5s ease, border-color .5s ease, padding .5s cubic-bezier(.22,1,.36,1); }
.site-header.is-scrolled { padding-top:18px; padding-bottom:18px; background:rgba(6,6,6,.82); border-bottom:1px solid rgba(232,229,223,.08); }
.site-nav { display:flex; align-items:center; justify-content:center; gap:clamp(15px,2.4vw,34px); }
.site-nav a { position:relative; padding:7px 0; color:var(--muted); font-family:var(--mono); font-size:9px; letter-spacing:.07em; text-transform:uppercase; transition:color .35s ease; }
.site-nav a:after { content:''; position:absolute; left:0; right:0; bottom:1px; height:1px; background:var(--paper); transform:scaleX(0); transform-origin:right; transition:transform .45s cubic-bezier(.22,1,.36,1); }
.site-nav a:hover,.site-nav a[aria-current] { color:var(--paper); }
.site-nav a:hover:after,.site-nav a[aria-current]:after { transform:scaleX(1); transform-origin:left; }
.visual-shell { will-change:clip-path,transform; backface-visibility:hidden; }
.project-name,.display,.hero-title,.statement h2,.contact-title { text-wrap:balance; }
.intro-loader { display:block; overflow:hidden; font-size:initial; letter-spacing:normal; background:#020202; cursor:pointer; isolation:isolate; transition:opacity .68s cubic-bezier(.22,1,.36,1),visibility .68s,filter .68s cubic-bezier(.22,1,.36,1); }
.intro-loader:before { content:''; position:absolute; z-index:-3; inset:-20%; opacity:0; background:radial-gradient(circle at 50% 50%,rgba(78,110,157,.12),transparent 28%),radial-gradient(circle at 50% 50%,rgba(235,233,227,.04),transparent 48%); transition:opacity 1.3s ease; }
.intro-content { position:absolute; z-index:2; top:50%; left:50%; width:min(88vw,760px); text-align:center; transform:translate(-50%,-50%); }
.intro-kicker,.intro-tagline,.intro-system { margin:0; font-family:var(--mono); font-size:10px; letter-spacing:.07em; text-transform:uppercase; }
.intro-kicker { color:#8c939d; }
.intro-word { display:flex; justify-content:center; margin:18px 0 28px; color:#e9e7e0; font-family:var(--sans); font-size:clamp(2.25rem,6.7vw,6.5rem); font-weight:600; letter-spacing:.19em; line-height:1; text-indent:.19em; white-space:nowrap; }
.intro-word span { display:inline-block; will-change:transform,opacity,filter; }
.intro-loader .intro-word span:after,.intro-loader .intro-system span:after { content:none; }
.intro-system { display:flex; flex-direction:column; align-items:center; gap:7px; color:#7f8a99; line-height:1.2; }
.intro-system p { margin:0 0 7px; color:#a5a9aa; }
.intro-system span { color:#92a6be; }
.intro-tagline { margin-top:34px; color:#d0cec8; font-family:var(--sans); font-size:11px; letter-spacing:.13em; }
.intro-grid { position:absolute; z-index:-2; inset:-25%; opacity:0; background-image:linear-gradient(rgba(145,173,214,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(145,173,214,.11) 1px,transparent 1px); background-size:58px 58px; mask-image:radial-gradient(circle at center,black 3%,transparent 57%); transform:perspective(700px) rotateX(65deg) translateY(-10%); transform-origin:center; }
.intro-pulse { position:absolute; z-index:-1; top:50%; left:50%; width:min(70vw,700px); aspect-ratio:1; border:1px solid rgba(165,192,232,.38); border-radius:50%; opacity:0; transform:translate(-50%,-50%); box-shadow:inset 0 0 45px rgba(97,146,220,.08),0 0 90px rgba(98,144,216,.08); }
.intro-pulse:before,.intro-pulse:after { content:''; position:absolute; inset:14%; border:1px solid rgba(165,192,232,.16); border-radius:inherit; }.intro-pulse:after { inset:31%; }
.intro-sweep { position:absolute; z-index:3; top:0; bottom:0; left:50%; width:20vw; min-width:190px; opacity:0; pointer-events:none; background:linear-gradient(100deg,transparent 18%,rgba(255,255,255,.01) 34%,rgba(231,239,250,.58) 50%,rgba(255,255,255,.01) 66%,transparent 82%); filter:blur(10px); mix-blend-mode:screen; }
.intro-skip { position:absolute; z-index:3; left:50%; bottom:27px; margin:0; color:rgba(232,229,223,.28); font-family:var(--mono); font-size:8px; letter-spacing:.09em; text-transform:uppercase; transform:translateX(-50%); transition:color .25s ease; }.intro-loader:hover .intro-skip { color:rgba(232,229,223,.62); }
.intro-loader.is-dismissing { opacity:0; filter:blur(10px); pointer-events:none; }
.intro-loader.is-active:before,.intro-loader.is-gsap-active:before { opacity:1; }.intro-loader.is-active .intro-kicker { animation:introFade .35s .14s both; }.intro-loader.is-active .intro-word { animation:introTracking 1.08s .32s cubic-bezier(.16,1,.3,1) both; }.intro-loader.is-active .intro-word span { animation:introLetter .68s cubic-bezier(.16,1,.3,1) both; }.intro-loader.is-active .intro-word span:nth-child(1){animation-delay:.30s}.intro-loader.is-active .intro-word span:nth-child(2){animation-delay:.355s}.intro-loader.is-active .intro-word span:nth-child(3){animation-delay:.41s}.intro-loader.is-active .intro-word span:nth-child(4){animation-delay:.465s}.intro-loader.is-active .intro-word span:nth-child(5){animation-delay:.52s}.intro-loader.is-active .intro-word span:nth-child(6){animation-delay:.575s}.intro-loader.is-active .intro-word span:nth-child(7){animation-delay:.63s}.intro-loader.is-active .intro-word span:nth-child(8){animation-delay:.685s}.intro-loader.is-active .intro-grid { animation:introGrid 1.05s .94s both; }.intro-loader.is-active .intro-pulse { animation:introPulse .76s 1.28s ease-out both; }.intro-loader.is-active .intro-sweep { animation:introSweep 1.18s .72s ease-in-out both; }.intro-loader.is-active .intro-system { animation:introFade .34s 1.58s both; }.intro-loader.is-active .intro-system span { animation:introModule .28s both; }.intro-loader.is-active .intro-system span:nth-of-type(1){animation-delay:1.77s}.intro-loader.is-active .intro-system span:nth-of-type(2){animation-delay:1.88s}.intro-loader.is-active .intro-system span:nth-of-type(3){animation-delay:1.99s}.intro-loader.is-active .intro-system span:nth-of-type(4){animation-delay:2.1s}.intro-loader.is-active .intro-tagline { animation:introFade .52s 2.3s both; }
@keyframes introFade { from { opacity:0; transform:translateY(14px); filter:blur(7px); } to { opacity:1; transform:none; filter:none; } }
@keyframes introLetter { from { opacity:0; transform:translateY(26px); filter:blur(12px); } to { opacity:1; transform:none; filter:none; } }
@keyframes introTracking { from { letter-spacing:.62em; } to { letter-spacing:.19em; } }
@keyframes introGrid { from { opacity:0; transform:perspective(700px) rotateX(65deg) translateY(-10%) scale(.96); } to { opacity:.48; transform:perspective(700px) rotateX(65deg) translateY(-10%) scale(1); } }
@keyframes introPulse { 0% { opacity:0; transform:translate(-50%,-50%) scale(.18); } 18% { opacity:.72; } 100% { opacity:0; transform:translate(-50%,-50%) scale(1.34); } }
@keyframes introSweep { 0% { opacity:0; transform:translateX(-170%); } 10% { opacity:.82; } 90% { opacity:.82; } 100% { opacity:0; transform:translateX(170%); } }
@keyframes introModule { from { opacity:0; transform:translateX(-8px); } to { opacity:1; transform:none; } }
.capability { will-change:transform; }.capability:before { content:''; display:block; width:0; height:1px; background:var(--blue); transition:width .55s cubic-bezier(.22,1,.36,1); }.capability:hover:before { width:30px; }.capability:hover h3 { color:#c8d9f8; }
.yug-stage:after,.blueprint:after { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(105deg,transparent 35%,rgba(191,218,255,.06) 50%,transparent 65%); transform:translateX(-120%); transition:transform 1.25s cubic-bezier(.22,1,.36,1); }.yug-stage:hover:after,.blueprint:hover:after { transform:translateX(120%); }
.project-detail-grid .detail-block,.principle { transition:border-color .45s ease; }.project-detail-grid .detail-block:hover,.principle:hover { border-color:rgba(146,186,255,.45); }
@media (max-width:760px) { .site-header { grid-template-columns:1fr auto; }.site-nav { justify-self:end; gap:13px; }.site-nav a { font-size:8px; }.header-contact { display:none; }.intro-word { margin:16px 0 25px; font-size:clamp(1.85rem,10.3vw,3.2rem); }.intro-system { font-size:8px; }.intro-tagline { margin-top:28px; font-size:9px; }.intro-skip { bottom:20px; font-size:7px; white-space:nowrap; }.intro-grid { background-size:38px 38px; }.intro-pulse { width:95vw; } }
@media (prefers-reduced-motion:reduce) { .intro-loader { display:none; }.site-header { transition:none; }.capability:before { transition:none; } }