:root{--bg:#ecebe5;--ink:#0c0d10;--muted:#70736f;--line:rgba(12,13,16,.14);--blue:#3456ff;--dark:#0d0f14;--white:#fbfaf6;--sans:"Manrope",system-ui,sans-serif;--mono:"DM Mono",monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);overflow-x:hidden}a{color:inherit;text-decoration:none}.grain{position:fixed;inset:-20%;z-index:50;pointer-events:none;opacity:.03;background:repeating-radial-gradient(circle at 30% 30%,rgba(0,0,0,.5) 0 1px,transparent 1px 4px);mix-blend-mode:multiply}.nav{position:fixed;top:0;left:0;right:0;height:78px;z-index:40;padding:0 4vw;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;backdrop-filter:blur(12px);border-bottom:1px solid transparent}.nav.scrolled{background:rgba(236,235,229,.82);border-color:var(--line)}.logo{font-weight:800;letter-spacing:-.06em}.logo span{font-size:8px;vertical-align:top}.status{font:9px var(--mono);text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:8px}.status i{width:6px;height:6px;border-radius:50%;background:#31bd6a;box-shadow:0 0 0 4px rgba(49,189,106,.1)}.nav nav{display:flex;justify-content:flex-end;align-items:center;gap:26px;font-size:12px}.pill{display:inline-flex;gap:16px;align-items:center;border:1px solid var(--line);border-radius:999px;padding:12px 15px;font-size:12px;font-weight:700}.pill.dark{background:var(--dark);color:#fff;border-color:var(--dark)}.pill.light{background:#fff;border-color:#fff}.menu{display:none;background:none;border:0}.menu span{display:block;width:24px;height:1px;background:var(--ink);margin:6px}.hero{min-height:100svh;padding:150px 4vw 30px;display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:15px;position:relative}.eyebrow{font:10px var(--mono);text-transform:uppercase;letter-spacing:.11em;color:var(--muted)}.hero h1{font-size:clamp(65px,8.6vw,140px);line-height:.84;letter-spacing:-.075em;margin:30px 0}.hero em,.showcase em,.tile em,.statement em,.caps h3 em,.about em,.contact em{font-style:normal;color:var(--blue)}.hero p{max-width:540px;color:#535650;font-size:16px;line-height:1.7}.actions{display:flex;align-items:center;gap:25px;margin-top:28px}.textlink{font-size:12px;font-weight:700}.scene{height:min(680px,65vh);position:relative;transform-style:preserve-3d;perspective:1200px;transition:transform .2s}.grid{position:absolute;inset:12% 0 0;background:linear-gradient(rgba(12,13,16,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(12,13,16,.08) 1px,transparent 1px);background-size:52px 52px;transform:perspective(500px) rotateX(72deg) translateY(20%);opacity:.27}.orb{position:absolute;width:185px;height:185px;left:50%;top:45%;transform:translate(-50%,-50%) translateZ(80px);border-radius:50%;background:radial-gradient(circle at 30% 25%,#fff,#98aaff 13%,#4d6dff 42%,#182773 75%,#090b1c);box-shadow:0 60px 120px rgba(52,86,255,.3),inset -35px -40px 60px rgba(0,0,0,.34);animation:float 6s ease-in-out infinite}.ring{position:absolute;left:50%;top:45%;border:1px solid rgba(52,86,255,.34);border-radius:50%}.ra{width:480px;height:175px;transform:translate(-50%,-50%) rotateX(68deg) rotateZ(-15deg);animation:spin1 18s linear infinite}.rb{width:530px;height:245px;transform:translate(-50%,-50%) rotateY(70deg) rotateZ(15deg);animation:spin2 21s linear infinite}.rc{width:330px;height:330px;transform:translate(-50%,-50%) rotateX(65deg);animation:spin3 14s linear infinite reverse}.label{position:absolute;padding:7px 9px;border:1px solid var(--line);background:rgba(236,235,229,.65);backdrop-filter:blur(5px);font:9px var(--mono);color:var(--muted)}.la{left:7%;top:25%}.lb{right:6%;top:22%}.lc{right:4%;bottom:22%}.scene-card{position:absolute;z-index:3;display:flex;flex-direction:column;gap:4px;padding:12px 14px;border:1px solid rgba(12,13,16,.14);background:rgba(250,249,244,.78);backdrop-filter:blur(10px);box-shadow:0 25px 70px rgba(12,13,16,.12)}.scene-card small,.scene-card span{font:9px var(--mono);color:var(--muted)}.scene-card b{font-size:16px;letter-spacing:-.04em}.ca{left:2%;top:15%;transform:rotateY(16deg) rotateZ(-4deg)}.cb{right:0;top:45%;transform:rotateY(-17deg) rotateZ(4deg)}.cc{left:13%;bottom:8%;transform:rotateZ(4deg)}.center{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%) translateZ(120px);color:#fff;font-size:40px;font-weight:800;z-index:4}.hero-foot{position:absolute;bottom:28px;left:4vw;right:4vw;display:flex;justify-content:space-between;font:9px var(--mono);text-transform:uppercase;color:var(--muted)}@keyframes float{50%{transform:translate(-50%,-55%) translateZ(110px)}}@keyframes spin1{to{transform:translate(-50%,-50%) rotateX(68deg) rotateZ(345deg)}}@keyframes spin2{to{transform:translate(-50%,-50%) rotateY(70deg) rotateZ(375deg)}}@keyframes spin3{to{transform:translate(-50%,-50%) rotateX(65deg) rotateZ(-360deg)}}
.marquee{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);white-space:nowrap}.track{display:inline-flex;min-width:200%;gap:28px;padding:17px 0;font:10px var(--mono);letter-spacing:.08em;animation:marq 26s linear infinite}.track i{color:var(--blue);font-style:normal}@keyframes marq{to{transform:translateX(-50%)}}.section{padding:115px 4vw;border-bottom:1px solid var(--line)}.intro{display:grid;grid-template-columns:220px 1fr;gap:35px;margin-bottom:68px}.intro h2{font-size:clamp(56px,7vw,112px);line-height:.88;letter-spacing:-.07em;margin:0}.intro p{max-width:560px;color:var(--muted);line-height:1.7;font-size:15px}.meta,.meta2{display:grid;grid-template-columns:50px 1fr 1fr;font:9px var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:17px}.stage{height:clamp(460px,58vw,760px);position:relative;overflow:hidden;border:1px solid var(--line);perspective:1100px}.blue{background:radial-gradient(circle at 75% 32%,rgba(103,127,255,.6),transparent 31%),linear-gradient(135deg,#0d132b,#24389f 51%,#080c18)}.backwin,.midwin,.frontwin{position:absolute;border:1px solid rgba(255,255,255,.17);box-shadow:0 40px 100px rgba(0,0,0,.3)}.backwin{width:62%;height:58%;left:11%;top:20%;background:rgba(255,255,255,.04);transform:rotateY(26deg) rotateZ(-3deg) translateZ(-100px)}.midwin{width:65%;height:64%;left:23%;top:12%;background:rgba(255,255,255,.04);transform:rotateY(-18deg) rotateZ(3deg)}.frontwin{width:64%;height:68%;left:31%;top:11%;background:#f4f3ee;color:var(--ink);transform:rotateY(-8deg) rotateZ(1deg) translateZ(100px);overflow:hidden}.bar{height:28px;border-bottom:1px solid #ddd;display:flex;gap:5px;align-items:center;padding:0 10px}.bar span{width:6px;height:6px;border-radius:50%;background:#bbb}.bar small{margin-left:10px;font:8px var(--mono);color:#777}.mini{height:calc(100% - 28px);display:flex;flex-direction:column;justify-content:center;padding:55px}.mini small{font:8px var(--mono);color:#777;letter-spacing:.12em;margin-bottom:18px}.mini strong{font-size:clamp(36px,5vw,80px);line-height:.82;letter-spacing:-.07em}.mini em{color:var(--blue)}.mini i{display:block;width:80px;height:1px;background:#111;margin-top:45px}.stagetag{position:absolute;left:22px;bottom:20px;font:10px var(--mono);letter-spacing:.1em;color:#fff}.radiant{background:linear-gradient(140deg,#f4ead8,#cfd9f1 58%,#182343);display:grid;place-items:center}.sphere{width:270px;height:270px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#fff,#bbc5ff 18%,#5f78d9 45%,#21294b 75%,#0e121f);filter:drop-shadow(0 50px 100px rgba(19,25,58,.25));animation:float2 7s ease-in-out infinite}.radiant .lines{position:absolute;inset:0;background:repeating-linear-gradient(75deg,transparent 0 46px,rgba(255,255,255,.12) 47px,transparent 48px)}.radiant>strong{position:absolute;font-size:clamp(70px,10vw,150px);line-height:.78;letter-spacing:-.08em;text-align:center}.radiant>strong em{color:#253a84}.copy{display:flex;justify-content:space-between;align-items:end;gap:24px;padding-top:23px}.copy h3,.tilecopy h3{font-size:clamp(42px,5vw,84px);line-height:.86;letter-spacing:-.07em;margin:0 0 15px}.copy p,.tilecopy p{max-width:560px;color:var(--muted);font-size:14px;line-height:1.7;margin:0}.tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:18px}.tags span{border:1px solid var(--line);border-radius:999px;padding:7px 9px;font:8px var(--mono);text-transform:uppercase}.circle{width:78px;height:78px;border-radius:50%;background:var(--dark);color:#fff;display:grid;place-items:center;text-align:center;font:10px var(--mono);transform:rotate(-10deg);transition:.25s}.circle:hover{transform:rotate(0) scale(1.06)}.showcase+.showcase{margin-top:105px}.workgrid{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:105px;border-top:1px solid var(--line)}.tile{padding:20px 0 34px}.tile:nth-child(even){padding-left:24px;border-left:1px solid var(--line)}.tile-stage{height:420px;position:relative;overflow:hidden;border:1px solid var(--line)}.meta2{grid-template-columns:50px 1fr}.damp{background:radial-gradient(circle at 72% 28%,#7c8b4e,transparent 30%),linear-gradient(145deg,#151714,#51602e 54%,#1a1c14);display:grid;place-items:center}.damp>strong,.roof>strong,.yacht>strong{font-size:clamp(55px,7vw,100px);font-weight:800;line-height:.8;letter-spacing:-.07em;color:#fff;text-align:center}.damp em{color:#d4df9d}.tile-ring{position:absolute;width:300px;height:300px;border:1px solid rgba(255,255,255,.24);border-radius:50%;transform:rotateX(70deg) rotateZ(22deg);animation:spind 14s linear infinite}.tile-ring:after{content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:#fff;top:-5px;left:50%}@keyframes spind{to{transform:rotateX(70deg) rotateZ(382deg)}}.roof{background:linear-gradient(135deg,#d9d1c5,#9ea6ad 50%,#293038);display:grid;place-items:center}.roofcube{position:absolute;width:270px;height:270px;border:1px solid rgba(255,255,255,.42);transform:rotateX(65deg) rotateZ(45deg);box-shadow:0 40px 100px rgba(0,0,0,.24)}.roof em{color:#e0e9ef}.yacht{background:linear-gradient(180deg,#0a142f,#193f68 52%,#09273a);display:grid;place-items:center}.waves{position:absolute;inset:auto -20% 9%;height:55%;background:repeating-linear-gradient(8deg,transparent 0 24px,rgba(255,255,255,.1) 25px 26px);transform:rotate(-5deg)}.yacht em{color:#a9d7ff}.tilecopy{display:flex;justify-content:space-between;align-items:end;gap:24px;padding-top:20px}.tilecopy h3{font-size:clamp(38px,4vw,62px)}.tilecopy a,.coming{font:10px var(--mono);white-space:nowrap}.coming{color:var(--muted)}.archive{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;font:9px var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.archive strong{font-family:var(--sans);color:var(--ink);font-size:11px;text-transform:none;letter-spacing:0}.statement{background:var(--dark);color:#fff;padding:115px 4vw}.statement-inner{margin-left:220px;max-width:1200px}.statement-inner small{font:10px var(--mono);letter-spacing:.1em;color:rgba(255,255,255,.28)}.statement h2{font-size:clamp(60px,9vw,145px);line-height:.84;letter-spacing:-.08em;margin:22px 0}.statement p{max-width:540px;color:rgba(255,255,255,.62);font-size:16px;line-height:1.7}.caps{border-top:1px solid var(--line)}.caps>div{display:grid;grid-template-columns:55px 1.1fr 1fr 30px;gap:25px;align-items:center;padding:25px 0;border-bottom:1px solid var(--line)}.caps span,.caps b{font:10px var(--mono);color:var(--muted)}.caps h3{font-size:clamp(31px,4vw,60px);letter-spacing:-.06em;margin:0}.caps p{max-width:420px;color:var(--muted);font-size:13px;line-height:1.7}.process{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.process>div{min-height:270px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px;display:flex;flex-direction:column;justify-content:space-between}.process span{font:10px var(--mono);color:var(--muted)}.process h3{font-size:30px;letter-spacing:-.04em;margin:0}.process p{font-size:13px;color:var(--muted);line-height:1.7;max-width:240px}.about{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:end}.about h2{font-size:clamp(60px,8vw,130px);line-height:.82;letter-spacing:-.08em;margin:25px 0 0}.aboutcopy{max-width:620px}.aboutcopy p{color:var(--muted);font-size:16px;line-height:1.8}.aboutmeta{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}.aboutmeta span{border:1px solid var(--line);border-radius:999px;padding:8px 10px;font:9px var(--mono);text-transform:uppercase}.contact{position:relative;overflow:hidden;background:var(--blue);color:#fff}.contactinner{padding:115px 4vw;position:relative;z-index:2}.contact h2{font-size:clamp(65px,9vw,150px);line-height:.84;letter-spacing:-.08em;margin:25px 0;max-width:1200px}.contact p{max-width:500px;color:rgba(255,255,255,.75);font-size:16px;line-height:1.7}.contact .actions{margin-top:30px}.contact .actions>a:last-child{font:10px var(--mono);border-bottom:1px solid rgba(255,255,255,.55);padding-bottom:3px}.contactorb{position:absolute;width:620px;height:620px;right:-100px;top:-180px;border-radius:50%;border:1px solid rgba(255,255,255,.2);box-shadow:inset -70px -90px 110px rgba(18,31,145,.35);background:radial-gradient(circle at 32% 24%,rgba(255,255,255,.55),rgba(255,255,255,.08) 9%,transparent 48%)}footer{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;padding:24px 4vw;font:9px var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}footer nav{display:flex;gap:22px;justify-content:center}@media(max-width:1050px){.nav{grid-template-columns:1fr auto}.status,.nav nav{display:none}.menu{display:block}.hero{grid-template-columns:1fr;padding-top:125px}.scene{height:560px}.hero-foot{position:static;margin-top:-10px}.intro{grid-template-columns:1fr;gap:25px}.statement-inner{margin-left:0}.about{grid-template-columns:1fr}}@media(max-width:700px){.hero h1{font-size:59px}.scene{height:450px}.hero-foot{display:none}.actions{flex-direction:column;align-items:flex-start}.section{padding-top:80px;padding-bottom:80px}.showcase+.showcase{margin-top:70px}.stage{height:430px}.frontwin{transform:rotateY(-8deg) rotateZ(1deg) scale(.82) translateZ(80px)}.workgrid{grid-template-columns:1fr}.tile:nth-child(even){padding-left:0;border-left:0}.tile-stage{height:360px}.archive{grid-template-columns:1fr}.caps>div{grid-template-columns:35px 1fr 22px}.caps p{grid-column:2/-1}.process{grid-template-columns:1fr}.process>div{min-height:210px}.about h2{font-size:58px}.contact h2{font-size:60px}.contact .actions{align-items:flex-start}footer{grid-template-columns:1fr}footer nav{justify-content:flex-start}}
.cursor-dot,.cursor-ring{position:fixed;left:0;top:0;pointer-events:none;z-index:1000;border-radius:50%;transform:translate(-50%,-50%)}.cursor-dot{width:5px;height:5px;background:var(--ink)}.cursor-ring{width:34px;height:34px;border:1px solid rgba(12,13,16,.45);transition:width .2s,height .2s,border-color .2s}.cursor-ring.hot{width:54px;height:54px;border-color:var(--blue)}

/* V4: real project screenshots + outcome-led positioning */
.screenshot-stage{isolation:isolate}
.screenshot-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;transform:scale(1.015);transition:transform .8s cubic-bezier(.2,.7,.2,1),filter .5s ease}
.screenshot-stage:hover img{transform:scale(1.035)}
.stage-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.08),transparent 55%,rgba(0,0,0,.42));z-index:1;pointer-events:none}
.screenshot-stage .stage-tag{z-index:2}
.outcomes{background:#e1dfd7}
.outcome-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.outcome-grid>div{min-height:260px;padding:24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between}
.outcome-grid span{font:10px var(--mono);color:var(--muted)}
.outcome-grid strong{font-size:28px;letter-spacing:-.05em}
.outcome-grid p{margin:0;color:var(--muted);font-size:13px;line-height:1.7;max-width:280px}
@media(max-width:1050px){.outcome-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.outcome-grid{grid-template-columns:1fr}}

/* V5: supplied screenshots are the visual source of truth */
.screenshot-stage{isolation:isolate;background:#0f1117;overflow:hidden}
.screenshot-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transform:none;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.screenshot-stage:hover img{transform:scale(1.025)}
.stage-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.03),transparent 58%,rgba(0,0,0,.35));z-index:1;pointer-events:none}
.stage-overlay.dark{background:linear-gradient(180deg,rgba(0,0,0,.06),transparent 48%,rgba(0,0,0,.45))}
.screenshot-stage .stage-tag{z-index:2}
.tile-stage.screenshot-stage img{object-position:top center}

/* V6: project previews use the supplied real screenshots as the source of truth. */
.image-stage{
  position:relative;
  overflow:hidden;
  background:#111;
  isolation:isolate;
}
.image-stage img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:top center;
  z-index:0;
  transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .4s ease;
}
.image-stage:hover img{transform:scale(1.02)}
.image-shade{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.02) 48%,rgba(0,0,0,.48));
  z-index:1;
  pointer-events:none;
}
.image-shade.dark{
  background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.06) 48%,rgba(0,0,0,.55));
}
.image-stage .stagetag{z-index:2}
.flagship-image img{object-position:center top}