@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=DM+Sans:wght@400;450;500;550;600;650;700&family=Space+Mono:wght@400&display=swap');
:root{color-scheme:dark;--bg:#080a0b;--text:#f0f0ea;--muted:#989d9b;--line:#ffffff20;--green:#c1e9bb;--mono:'Space Mono',monospace}*{box-sizing:border-box}html{scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:2px solid var(--green);outline-offset:7px}.skip{position:fixed;left:20px;top:-70px;z-index:20;background:var(--text);color:#111;padding:15px}.skip:focus{top:15px}.header{height:96px;position:absolute;top:0;left:0;width:100%;z-index:5;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;gap:12px;align-items:center;font-size:22px;font-weight:650;letter-spacing:-1px}.brand-icon{font-size:36px;width:45px;height:45px;display:grid;place-items:center;border:1px solid #c5ccc44f;border-radius:50%;background:linear-gradient(140deg,#a6aaa83b,#141717 60%,#6c727146);box-shadow:inset 1px 1px 5px #ffffff25}.brand-caption{display:block;font:8px var(--mono);letter-spacing:1.4px;margin-top:3px}nav{display:flex;gap:35px;align-items:center;font-size:13px}nav>a:hover{color:var(--green)}.nav-contact{padding:12px 17px;border:1px solid var(--line);border-radius:4px}.nav-contact span{margin-left:20px}.hero{height:100svh;min-height:720px;max-height:1200px;position:sticky;top:0;overflow:hidden;background:#060809;isolation:isolate}.hero-grid{position:absolute;inset:96px 0 0;background-image:linear-gradient(#ffffff03 1px,transparent 1px),linear-gradient(90deg,#ffffff03 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(black,transparent)}.hero-copy{position:absolute;top:31%;left:7%;z-index:2;pointer-events:none}.hero-copy a{pointer-events:auto}.eyebrow,.small-note,.hero-bottom,.artifact-label,.tag,.index,.status,.footer-bottom{font:10px var(--mono);letter-spacing:1.3px}.eyebrow{display:flex;align-items:center;gap:11px}.status-dot{width:6px;height:6px;background:var(--green);border-radius:50%;display:inline-block;box-shadow:0 0 12px #c1e9bb55}h1{font-size:clamp(58px,6.5vw,106px);font-weight:450;line-height:1.02;letter-spacing:-.065em;margin:28px 0}h1 span{color:#aaaead}.hero-description{font-size:16px;line-height:1.7;color:#a9aeaa;margin-bottom:30px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:42px;padding:17px 22px;border:1px solid #ffffff38;border-radius:4px;font-size:13px;transition:background .2s,transform .2s}.button:hover{background:#ffffff20;transform:translateY(-2px)}.glass{background:linear-gradient(120deg,#ffffff19,#ffffff05);backdrop-filter:blur(20px);box-shadow:inset 0 1px #ffffff20}.artifact{position:absolute;right:-6%;top:11%;width:61%;height:78%}canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;mix-blend-mode:screen}.orbit{position:absolute;width:72%;aspect-ratio:1;top:50%;left:50%;transform:translate(-50%,-50%);border:1px solid #ffffff0e;border-radius:50%;background:radial-gradient(ellipse,#c1dbdd14,transparent 66%)}.orbit:after{content:'+';position:absolute;left:14%;top:14%;font:20px var(--mono);color:#606562}.artifact-label{position:absolute;bottom:0;left:27%;right:20%;display:flex;justify-content:space-between;gap:25px;color:#7d8381;font-size:8px}.hero-bottom{position:absolute;bottom:28px;left:5%;right:5%;display:flex;justify-content:space-between;gap:16px;color:#959b98;font-size:9px}.hero-bottom button{font:inherit;color:inherit;background:none;border:0;padding:0}.hero-bottom a:hover,.hero-bottom button:hover{color:white}main{position:relative;z-index:3;background:#101313;border-top:1px solid #ffffff45;box-shadow:0 -30px 100px #0007}.section{padding:65px 7% 100px;scroll-margin-top:0}.section-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:58px}.small-note{color:#8a9390;letter-spacing:0}.company{background:radial-gradient(ellipse at 0 0,#35403930,transparent 45%),#111514}.company-layout{display:grid;grid-template-columns:1.3fr 1fr;gap:9%}h2{font-size:clamp(32px,3.3vw,55px);font-weight:450;letter-spacing:-.055em;line-height:1.14;margin:0}h2 span{color:#88938d}.body-copy{font-size:16px;line-height:1.8;color:#aeb7b1}.body-copy p:first-child{margin-top:0}.body-copy strong{font-weight:500;color:var(--text)}.signature{display:inline-block;color:var(--text);font-size:21px;letter-spacing:-1px;margin-top:20px}.signature>span{margin-left:35px;color:#a3b09f}.signature small{display:block;font:8px var(--mono);letter-spacing:1px;margin-top:8px;color:#82907f}.disciplines{margin-top:80px;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #ffffff26;background:linear-gradient(125deg,#ffffff05,transparent);border-radius:5px;overflow:hidden}.disciplines article{padding:27px 30px 32px;position:relative}.disciplines article+article{border-left:1px solid var(--line)}.index{color:#839081}.mini-art{height:150px;display:flex;align-items:center;justify-content:center;position:relative;margin:10px 0 15px}.mini-art i{display:block;position:absolute;background:linear-gradient(145deg,#edf4e51f,#808e8922 40%,#060b0bb3);border:1px solid #d9e7dc55;box-shadow:inset 2px 2px 10px #ffffff14,12px 18px 30px #0005;backdrop-filter:blur(5px)}.art-software i{height:78px;width:110px;transform:rotate(-28deg) skew(12deg);border-radius:6px}.art-software i:nth-child(1){translate:-15px -18px}.art-software i:nth-child(3){translate:15px 18px}.art-experiments i{width:96px;height:96px;border-radius:50%;background:radial-gradient(circle at 25% 20%,#d6e0d76b,#54625b21 45%,#091511 70%,#ced5cc6b);box-shadow:inset 0 0 15px #d8e2cc2e,6px 10px 25px #0004}.art-experiments i:nth-child(2){transform:translate(42px,20px) scale(.6)}.art-experiments i:nth-child(3){transform:translate(-40px,25px) scale(.35)}.art-products i{width:91px;height:91px;border:18px solid #b8c3b8;border-radius:23px;transform:rotate(-24deg);background:transparent;box-shadow:inset 3px 4px 8px #000,3px 3px 0 #677168,6px 7px 0 #2b3930,9px 12px 18px #0008;border-color:#d0d6cf #6d786e #455047 #aab5a8}.disciplines h3{font-size:21px;letter-spacing:-.6px;font-weight:500;margin:16px 0}.disciplines p{color:#9ea9a2;font-size:14px;line-height:1.75;max-width:310px}.tag{display:block;margin-top:30px;font-size:8px;color:#b9c5b9;letter-spacing:1px}.approach{background:#0b0e0d;border-top:1px solid var(--line)}.approach-layout{display:grid;grid-template-columns:1fr 1.15fr;gap:12%}.principles article{display:flex;gap:24px;padding:26px 0;border-top:1px solid var(--line)}.principles article>span{font:10px var(--mono);color:#879487}.principles article>span:last-child{margin-left:auto}.principles h3{font-size:21px;font-weight:450;margin:-5px 0 12px;letter-spacing:-.5px}.principles p{font-size:14px;line-height:1.75;color:#959f99;max-width:350px;margin:0}.seal{width:146px;height:146px;border:1px solid #99a18f55;border-radius:50%;margin-top:60px;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(-15deg);color:#9aab96;background:repeating-linear-gradient(0deg,#aebda305 0 1px,transparent 1px 3px);outline:1px solid #99a18f26;outline-offset:-7px}.seal span{font:7px var(--mono);letter-spacing:1px}.seal b{font-size:60px;font-weight:500;line-height:1.4}.contact{position:relative;overflow:hidden;border-top:1px solid #ffffff25;background:linear-gradient(115deg,#1c2520,#101513);padding-bottom:95px}.contact-glow{position:absolute;right:-200px;top:-140px;width:700px;height:700px;border:70px solid #9baa8b0a;border-radius:50%;box-shadow:0 0 90px #bbd5b00a,inset 0 0 80px #bbcfa90c;pointer-events:none}.status{font-size:8px;display:flex;align-items:center;gap:10px;color:#b4c6b1}.contact-intro{color:#a6b2a9;font-size:14px;margin:4px 0 25px}.contact h2{font-size:clamp(45px,6vw,90px);position:relative}.contact em{font-family:Georgia,serif;font-weight:400;color:#c4d2bf}.contact-button{margin-top:36px;background:#d5e1ce;color:#172016;border-color:#e4eddc;min-width:235px}.contact-button:hover{background:#eff9e9}.contact-note{font-size:11px;color:#9aa798;margin:20px 0 0}#email-result{margin-top:15px}#email-result:empty{display:none}#email-result a{font-size:22px;text-decoration:underline;text-underline-offset:5px}#email-result button{margin-left:20px;border:1px solid var(--line);border-radius:4px;padding:8px 13px;background:#ffffff0a;font-size:12px}footer{padding:55px 7% 28px;background:#090c0b}.footer-wordmark{display:block;font-size:clamp(65px,16vw,250px);font-weight:550;letter-spacing:-.075em;line-height:1.1;color:#d1d7ce}.footer-wordmark>span{font:16px var(--mono);vertical-align:top;display:inline-block;margin:2% 0 0 15px;letter-spacing:-1px}.footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding-top:26px;margin-top:40px;color:#8f9a90;font-size:8px}
@media(min-width:1600px){.hero-copy{left:10%}.section,footer{padding-left:10%;padding-right:10%}}@media(max-width:900px){h1{font-size:65px}.hero-copy{left:6%;top:29%}.artifact{right:-19%;width:78%;opacity:.8}.hero-copy h1{text-shadow:0 4px 30px #0008}.company-layout{gap:6%}.disciplines article{padding:22px}.approach-layout{gap:7%}.artifact-label{display:none}.hero-bottom{font-size:8px}.hero-bottom>span{max-width:170px}.section{padding-left:6%;padding-right:6%}}@media(max-width:600px){.header{height:80px;padding:0 6%}.brand{font-size:19px}.brand-icon{width:36px;height:36px;font-size:29px}.brand-caption{font-size:6px}nav{gap:17px;font-size:11px}.nav-contact{border:0;padding:8px 0}.nav-contact span{margin-left:4px}.hero{min-height:790px;max-height:950px}.hero-copy{top:145px;left:7%;right:7%}.hero .eyebrow{font-size:8px;letter-spacing:1px}h1{font-size:clamp(47px,10.9vw,65px);margin:24px 0 18px}.hero-description{font-size:14px;line-height:1.65;margin-bottom:23px}.button{padding:14px 18px;font-size:12px}.artifact{width:100%;height:47%;top:auto;bottom:43px;right:-15%;opacity:.85;z-index:-1}.orbit{width:70%}.hero-bottom{left:7%;right:7%;bottom:22px;align-items:flex-end}.hero-bottom>span{max-width:125px;line-height:1.6}.hero-bottom>a{max-width:90px;line-height:1.6}.hero-bottom button{font-size:8px}.section{padding:35px 7% 60px}.section-top{padding-bottom:35px;align-items:flex-start;gap:20px}.section-top .eyebrow{font-size:8px}.small-note{font-size:8px;text-align:right;max-width:125px;line-height:1.5}.company-layout,.approach-layout{grid-template-columns:1fr;gap:30px}h2{font-size:34px}.body-copy{font-size:14px}.signature{margin-top:8px}.disciplines{grid-template-columns:1fr;margin-top:45px}.disciplines article{padding:25px}.disciplines article+article{border-left:0;border-top:1px solid var(--line)}.mini-art{position:absolute;right:10px;top:16px;width:110px;height:90px;transform:scale(.65);transform-origin:center}.disciplines h3{margin-top:48px}.disciplines p{max-width:100%;font-size:14px}.tag{margin-top:20px}.seal{display:none}.principles article{gap:18px}.principles h3{font-size:20px}.contact .section-top{gap:10px}.status{font-size:6px;letter-spacing:.7px}.contact h2{font-size:44px}.contact-intro{font-size:12px}.contact-note{font-size:10px}.contact-glow{right:-400px}.footer-bottom{flex-wrap:wrap;font-size:7px;gap:16px}.footer-bottom>span:nth-child(2){order:3;width:100%}.footer-bottom a{margin-left:auto}footer{padding:35px 7% 24px}.footer-wordmark{font-size:19vw}.footer-wordmark>span{font-size:10px;margin-left:5px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}}
.little-fake{position:absolute;left:calc(5% + 6px);bottom:-23px;width:32px;height:32px;padding:0;border:0;background:transparent;z-index:-1;transform:translateY(-29px);opacity:0;transition:transform .45s steps(5),opacity .2s;image-rendering:pixelated}.little-fake svg{width:32px;height:32px;filter:drop-shadow(0 2px 7px #278edd33)}.little-fake.peeking{transform:translateY(0);opacity:1}.little-fake.shy{transform:translateY(-29px);opacity:0}.little-fake:focus-visible{transform:translateY(0);opacity:1}@media(max-width:600px){.little-fake{left:calc(6% + 3px)}}

/* Editorial serif alongside the precise sans-serif identity. */
h1 span,h2 span{font-family:'Instrument Serif',Georgia,serif;font-weight:400;letter-spacing:-.025em}h1 span{font-style:italic}.contact em{font-family:'Instrument Serif',Georgia,serif}.disciplines h3{font-family:'Instrument Serif',Georgia,serif;font-size:30px;font-weight:400}.brand{font-size:26px}.little-fake{position:fixed;left:6%;top:auto;bottom:0;width:48px;height:48px;z-index:10;transform:translateY(46px);transition:transform .45s steps(6),opacity .25s}.little-fake svg{width:48px;height:48px}.little-fake.peeking,.little-fake:focus-visible{transform:translateY(4px)}.little-fake.shy{transform:translateY(46px)}.cat-tail{transform-origin:18px 19px;animation:tail-twitch 2.4s steps(3) infinite}.cat-eyes{transform-origin:0 11px;animation:cat-blink 4s steps(1) infinite}@keyframes tail-twitch{0%,70%,100%{transform:rotate(0)}80%{transform:rotate(-18deg)}90%{transform:rotate(8deg)}}@keyframes cat-blink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.25)}}
@media(max-width:600px){.header{height:66px}.brand{font-size:24px}.hero{height:100svh;min-height:0;max-height:none;display:flex;flex-direction:column;padding:88px 7% 50px}.hero-copy{position:relative;top:auto;left:auto;right:auto;flex:0 0 auto}.hero h1{font-size:clamp(36px,10.5vw,60px);margin:0 0 14px}.hero-description{font-size:13px;margin:0 0 16px}.hero .button{padding:11px 15px}.artifact{position:relative;inset:auto;flex:1 1 auto;min-height:0;width:100%;opacity:1;z-index:0}.artifact .orbit{width:auto;height:85%;max-width:100%}.hero-bottom{bottom:14px}.disciplines h3{margin-top:70px;font-size:29px}}
@media(max-width:600px) and (max-height:650px){.hero{padding-top:77px;padding-bottom:39px}.hero h1{font-size:34px;margin-bottom:8px}.hero-description{font-size:12px;margin-bottom:9px}.hero .button{padding:8px 12px}.hero-bottom{font-size:6px;bottom:8px}}
@media(max-height:480px) and (orientation:landscape){.hero{height:100svh;min-height:0}.header{height:58px}.hero-copy{position:absolute;top:85px;left:6%;width:50%}.hero h1{font-size:37px;margin:0 0 10px}.hero-description{font-size:12px;margin:0 0 12px}.artifact{position:absolute;left:auto;right:0;top:65px;bottom:35px;width:45%;height:auto}.hero-bottom{bottom:12px}.hero .button{padding:9px 13px}}
@media(prefers-reduced-motion:reduce){.cat-tail,.cat-eyes{animation:none}}

/* Thin-film glass on the objects themselves. The pointer supplies the light. */
.button,.nav-contact,.mini-art i,#email-result button{--light-x:30%;--light-y:20%;--light-angle:125deg;--light-strength:.4;position:relative;isolation:isolate;background:radial-gradient(ellipse at var(--light-x) var(--light-y),#ffffff35,transparent 65%),linear-gradient(135deg,#dce9ed1c,#ffffff04 55%,#c4d8de12);border:1px solid #d7e5ec55;box-shadow:inset 0 1px 1px #ffffff5c,inset 0 -1px 1px #bed6e530,0 8px 24px #0003;backdrop-filter:blur(14px) saturate(1.3);color:var(--text)}
.button:before,.nav-contact:before,.mini-art i:before,#email-result button:before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;background:conic-gradient(from var(--light-angle) at var(--light-x) var(--light-y),#9bfaff00,#7adfff88,#aaa3ff88,#ff8acf77,#ffc78a88,#ebffa088,#88ffcc77,#80bdff88,#9bfaff00);mask-image:radial-gradient(ellipse at var(--light-x) var(--light-y),#000, #0009 35%,transparent 80%);opacity:var(--light-strength);mix-blend-mode:screen}
.button:after,.nav-contact:after,.mini-art i:after,#email-result button:after{content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:conic-gradient(from var(--light-angle),#ffffff18,#94eaff,#c0a1ff,#ffa5ce,#ffe8a6,#b2ffdb,#ffffff18);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none;opacity:var(--light-strength)}
.button:hover,.nav-contact:hover{background:radial-gradient(ellipse at var(--light-x) var(--light-y),#ffffff40,transparent 65%),#e2eef00b;color:#fff}.mini-art i{position:absolute}.art-experiments i{background:radial-gradient(circle at var(--light-x) var(--light-y),#ffffff99,#b1c7da18 23%,#111a192b 60%,#d2e1ec55 95%);box-shadow:inset 2px 2px 7px #fff5,inset -5px -7px 15px #b2c4e326,8px 12px 25px #0004}.art-products i{border:1px solid #d7e5ec66;background:radial-gradient(ellipse at var(--light-x) var(--light-y),#ffffff85,#bdd7e922 45%,#d2e1ec44);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;padding:18px;box-shadow:inset 2px 2px 6px #fff8}.contact-button{color:var(--text)}
/* Quiet, flat panels; all optical effects stay on individual objects. */
.company{background:#111514}.contact{background:#141b17}.disciplines,.disciplines article{background:transparent;backdrop-filter:none;box-shadow:none}
.shader-control,.shader-control:hover{background:#a9c9db0a;color:#f0f4f3;border-color:#d7e5ec66;overflow:hidden;box-shadow:inset 0 1px #ffffff55,0 6px 18px #0003}.shader-control:before,.shader-control:after{display:none}.button-shader{position:absolute;inset:0;width:100%;height:100%;z-index:-1;border-radius:inherit;pointer-events:none;mix-blend-mode:normal}.hero{filter:blur(var(--hero-blur,0px))}
@media(prefers-reduced-motion:reduce){.hero{filter:none}}
.button,.nav-contact,.shader-control{border-radius:12px}.button{gap:24px;white-space:nowrap;max-width:100%}.button>span{flex-shrink:0}.shader-control{min-width:0}.contact-button{min-width:210px}
@media(max-width:600px){.hero .button,.contact-button{font-size:13px;padding:13px 17px;gap:20px;min-height:44px}.contact-button{min-width:0;width:auto}.nav-contact{padding:10px 12px;gap:10px;font-size:11px;white-space:nowrap}.nav-contact span{margin-left:5px}nav{gap:12px}.hero .button{max-width:100%}.brand{font-size:22px}}
@media(max-width:360px){nav{gap:9px}.nav-contact{padding:9px;font-size:10px}.brand{font-size:20px}.hero .button{font-size:12px}}
/* Upstream LiquidGlass owns the optical rendering. Native CSS is the quiet fallback. */
.glass-control-root{display:inline-flex;position:relative;max-width:100%;isolation:isolate;pointer-events:auto}.button,.button:hover,.nav-contact,.nav-contact:hover{background:#ffffff08;border:1px solid #ffffff28;border-radius:12px;box-shadow:inset 0 1px #ffffff15;backdrop-filter:blur(12px);color:#eff1ee;transform:none}.button:before,.button:after,.nav-contact:before,.nav-contact:after{display:none}.glass-control-root canvas{mix-blend-mode:normal}.hero-copy .glass-control-root{pointer-events:auto}.contact .glass-control-root{margin-top:36px}.contact .contact-button{margin-top:0}
.glass-control-root .glass-backdrop{position:absolute;inset:0;width:100%;height:100%;border-radius:12px;z-index:-1;mix-blend-mode:normal}
.glass-control-root{overflow:clip;overflow-clip-margin:6px}
.glass-control-root .glass-backdrop{opacity:.55}.glass-control-root .button,.glass-control-root .nav-contact{background:transparent;border-color:#dceaf254;box-shadow:inset 0 1px #f0faff60,inset 0 -1px #d8eaf326;backdrop-filter:none;text-shadow:0 1px 3px #0009}
.glass-control-root .button,.glass-control-root .nav-contact{box-shadow:none}

/* Simple controls with a tapered underline. */
.button,.button:hover,.nav-contact,.nav-contact:hover,#email-result button{position:relative;isolation:auto;overflow:visible;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;color:var(--text);text-shadow:none;transform:none;padding:12px 0;min-width:0;gap:28px;transition:color .2s}
.button:before,.nav-contact:before,#email-result button:before{display:none}
.button:after,.nav-contact:after,#email-result button:after{content:'';display:block;position:absolute;inset:auto 0 0;height:2px;padding:0;border:0;border-radius:0;background:linear-gradient(90deg,#ecf0e5,#c2cebe 60%,#c2cebe00);clip-path:polygon(0 0,100% 35%,78% 100%,0 100%);mask:none;opacity:.65;pointer-events:none;transition:opacity .2s}
.button:hover,.nav-contact:hover,#email-result button:hover{color:#fff}.button:hover:after,.nav-contact:hover:after,#email-result button:hover:after{opacity:1}.contact-button{margin-top:36px}.hero .button{padding:12px 0}.nav-contact span{margin-left:14px}
@media(max-width:600px){.hero .button,.contact-button{padding:12px 0;min-height:44px}.nav-contact{padding:10px 0}.nav-contact span{margin-left:8px}}