.portfolio{background:#e7e4db;color:#17221e;--ink:#17221e;--paper:#e7e4db;--accent:#dd5639}.portfolio .studio-bar{position:fixed;z-index:20;top:0;width:100%;height:84px;background:#e7e4dbed;border-color:#17221e24;backdrop-filter:blur(12px);gap:24px}.studio-bar .wordmark img{filter:brightness(0);width:132px}.studio-bar nav{gap:24px;font-size:10px}.project-link{font-size:10px;font-weight:700;letter-spacing:1px;white-space:nowrap}.project-link span{margin-left:20px;color:#ba4027}.journey{position:relative}.world-stage{position:sticky;top:0;height:100svh;overflow:hidden;background:#e7e4db;pointer-events:none}.world-stage canvas{width:100%;height:100%;display:block}.chapters{position:relative;margin-top:-100svh}.chapter{height:100svh;min-height:650px;padding:110px 5% 65px;display:flex;align-items:end;position:relative;pointer-events:none}.chapter-copy{max-width:760px;pointer-events:auto;transition:opacity .25s;position:relative;z-index:3}.entry{align-items:start;padding-top:160px}.entry .chapter-copy{max-width:900px}.kicker{font-size:10px;font-weight:600;letter-spacing:1.4px;line-height:1.7;display:block}.portfolio h1{font-size:clamp(60px,7.7vw,124px);line-height:.91;letter-spacing:-.065em;margin:30px 0}.portfolio h2{font-size:clamp(45px,5.5vw,90px);line-height:.95;letter-spacing:-.055em}.portfolio h1 em,.portfolio h2 em{font-family:Georgia,serif;font-weight:400;font-style:italic;letter-spacing:-.07em}.chapter p{font-size:18px;line-height:1.5;margin:22px 0}.entry .disciplines{font-size:16px;margin-bottom:34px}.enter-link{font-size:10px;letter-spacing:1.4px;display:inline-flex;gap:40px;align-items:center}.enter-link span{font-size:24px;animation:invitation 2s ease-in-out infinite}@keyframes invitation{50%{transform:translateY(6px)}}.proof-plane{position:absolute;top:24%;left:50%;width:46%;height:46%;padding:10px;background:#17221e;box-shadow:0 25px 70px #18231e25;transform-origin:center;will-change:transform,opacity}.proof-plane video{width:100%;height:100%;object-fit:cover;object-position:center bottom}.proof-caption{position:absolute;bottom:16px;left:18px;font-size:8px;letter-spacing:1.2px;color:#fff;background:#141e18d9;padding:7px 10px}.scene-caption,.coordinate{position:absolute;bottom:22px;font-size:9px;letter-spacing:1.2px;color:#17221e88}.scene-caption{left:5%}.coordinate{right:5%}.scene-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.world-button{display:inline-block;background:var(--ink);color:#f2efe5;border:0;padding:17px 24px;font-size:10px;letter-spacing:1px;font-weight:bold}.world-text{font-size:10px;letter-spacing:1px;border:0;background:none;padding:9px 0;color:inherit;border-bottom:1px solid #17221e55;display:inline-block}.quiet-label{display:block;font-size:8px;letter-spacing:1px;line-height:1.7;max-width:380px;margin-top:20px;opacity:.7}.artifact{position:absolute;width:280px;height:385px;left:65%;top:20%;padding:26px;background:#df5639;color:#161f19;transform:rotate(8deg);box-shadow:15px 22px 0 #17221e18,0 35px 60px #17221e22;opacity:0;will-change:transform,opacity}.artifact img{filter:brightness(0);width:160px;margin:30px 0}.artifact-index,.artifact-bottom{font-size:8px;letter-spacing:1.2px;line-height:1.5}.artifact-title{font-size:46px;letter-spacing:-3px;font-weight:bold;line-height:1}.artifact-bottom{position:absolute;bottom:30px;left:26px}.artifact-notch{position:absolute;width:36px;height:36px;background:#e7e4db;border-radius:50%;right:-18px;top:50%;box-shadow:-2px 0 0 #17221e15}.studio-info,.studio-lab,.studio-project{padding:100px 5%;position:relative;z-index:4;border-top:1px solid #17221e30;background:#e7e4db}.studio-info{display:grid;grid-template-columns:1fr 1fr;gap:30px 10%}.studio-info>.kicker{grid-column:1/-1}.studio-info p,.studio-lab p,.studio-project p{font-size:17px;line-height:1.65;max-width:500px}.studio-lab{background:#17221e;color:#e7e4db}.studio-lab h2{margin:25px 0 40px}.lab-window{position:relative;display:block;width:100%;max-width:1000px}.lab-window img{width:100%;height:460px;object-fit:cover}.lab-window span{position:absolute;right:20px;bottom:20px;background:#e7e4db;color:#17221e;padding:18px;font-size:10px;letter-spacing:1px}.studio-project{display:grid;grid-template-columns:1fr 1fr;gap:10%}.studio-project h2{margin:25px 0}.studio-project input,.studio-project textarea{color:#17221e;border-color:#17221e66}.studio-project form{padding-top:20px}.studio-project #brief-status{font-size:11px}.portfolio footer{background:#17221e;color:#e7e4db;padding:45px 5%;gap:25px}.portfolio footer>span,.portfolio footer>a:last-of-type,.portfolio footer button{font-size:9px;letter-spacing:1px}.portfolio footer button{border:1px solid #e7e4db55;background:transparent;color:inherit;padding:10px}.portfolio dialog{background:#e7e4db;color:#17221e;max-width:1000px;width:90vw;max-height:92svh;padding:35px}.portfolio dialog h2{font-size:40px;margin:20px 0}.portfolio dialog p{font-size:14px;line-height:1.5}.dialog-close{position:absolute;right:14px;top:10px;border:0;background:transparent;font-size:32px}.portfolio iframe{width:100%;height:55svh;border:0;background:#111}.portfolio #proof-dialog img{width:100%;height:360px;object-fit:cover}.fallback-note{padding:20px 5%}.motion-paused .enter-link span{animation:none}.no-canvas .world-stage{background:radial-gradient(ellipse at center,#f9f6ee,#d6d8cd)}@media(max-width:700px){.portfolio .studio-bar{height:76px;padding:14px 5%;align-items:center;gap:12px}.studio-bar .wordmark img{width:93px}.studio-bar nav{display:none}.project-link{font-size:8px;margin-left:auto}.project-link span{margin-left:6px}.chapter{min-height:640px;padding:110px 6% 65px}.entry{padding-top:120px}.portfolio h1{font-size:12.7vw}.portfolio h2{font-size:12vw}.chapter p{font-size:15px}.entry .disciplines{font-size:13px}.proof-plane{top:49%;left:8%;width:84%;height:32%}.entry .enter-link{margin-top:5px}.proof-caption{font-size:6px;bottom:14px;left:14px}.quiet-label{font-size:7px}.scene-actions{gap:12px}.world-button{padding:15px 18px;font-size:9px}.world-text{font-size:8px}.artifact{left:44%;top:19%;width:185px;height:270px;padding:18px}.artifact img{width:110px;margin:24px 0}.artifact-title{font-size:32px;letter-spacing:-2px}.artifact-index,.artifact-bottom{font-size:6px}.artifact-bottom{left:18px;bottom:20px}.studio-info,.studio-project{grid-template-columns:1fr;gap:25px;padding:65px 6%}.studio-lab{padding:65px 6%}.lab-window img{height:260px}.lab-window span{font-size:8px;right:10px;bottom:10px;padding:12px}.studio-info p,.studio-lab p,.studio-project p{font-size:15px}.portfolio footer{flex-wrap:wrap}.portfolio dialog{padding:30px 20px}.portfolio dialog h2{font-size:28px}.portfolio #proof-dialog img{height:210px}.coordinate,.scene-caption{font-size:7px}.portfolio iframe{height:50svh}}@media(prefers-reduced-motion:reduce){.enter-link span{animation:none}.chapter-copy{transition:none}}@media(max-width:700px){.studio-bar nav.mobile-open{display:flex;position:absolute;top:76px;left:0;right:0;max-width:none;background:#e7e4db;padding:22px 6%;justify-content:space-between;border-bottom:1px solid #17221e22}.menu-toggle{border:0;background:none;padding:8px;font-size:8px;letter-spacing:1px}}@media(min-width:701px){.menu-toggle{display:none}}
.chapter-copy{color:var(--ink)}.portfolio .entry h1{font-size:clamp(60px,6.1vw,104px)}.portfolio[data-scene="1"] .proof-plane{top:12%;height:44%}.portfolio[data-scene="3"] .quiet-label,.portfolio[data-scene="3"] .scene-caption,.portfolio[data-scene="3"] .coordinate{color:#ece6d6}.portfolio[data-scene="2"] .chapter-copy{color:#ece6d6}@media(max-width:700px){.portfolio .entry h1{font-size:12.7vw}.proof-plane{top:60%;height:27%}.portfolio[data-scene="1"] .proof-plane{top:17%;height:33%}.portfolio[data-scene="1"] .chapter-copy{max-width:100%}.portfolio[data-scene="1"] h2{font-size:11vw}} 

.portfolio[data-scene="2"] .scene-caption,.portfolio[data-scene="2"] .coordinate{color:#ece6d699}.portfolio .entry .chapter-copy{max-width:650px}

/* Public product preview sits inside the existing campaign world. */
.hero-performance{position:absolute;right:5%;top:24%;width:36%;max-width:560px;background:#0a0e13e8;border:1px solid #e8e4da44;box-shadow:0 25px 70px #0008;z-index:2;color:#e8e4da;backdrop-filter:blur(8px)}
.hero-performance video{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;background:#05070a}
.preview-label{display:flex;justify-content:space-between;gap:12px;padding:13px 15px;border-bottom:1px solid #e8e4da33;font:9px monospace;letter-spacing:.1em}.preview-label span:last-child{color:#cba5ff}
.preview-note{padding:15px;font-size:10px;line-height:1.7;letter-spacing:.035em;border-top:1px solid #e8e4da33}
.portfolio .entry-save{font-size:12px;line-height:1.5;margin:14px 0 10px;color:#e8e4dacc}.preview-link{font:9px monospace;letter-spacing:.1em;color:#e8e4da;text-decoration:none;border-bottom:1px solid #e8e4da66;padding-bottom:4px}
@media(min-width:701px) and (max-width:1100px){.hero-performance{right:4%;width:34%;top:27%}.portfolio .entry .chapter-copy{max-width:58%}.portfolio .entry h1{font-size:7vw}.preview-note{font-size:9px}}
@media(max-width:700px){.hero-performance{position:relative;top:auto;right:auto;width:100%;max-width:none;margin-top:24px}.chapter.entry{display:block;padding-bottom:65px;min-height:900px}.portfolio .entry .chapter-copy{max-width:100%}.preview-note{font-size:9px}.portfolio .entry-save{font-size:12px}.studio-bar nav.mobile-open{flex-wrap:wrap;gap:15px}.preview-label{font-size:8px}}
.motion-paused .hero-performance video{visibility:hidden}.motion-paused .hero-performance{background:#0a0e13 url('assets/sluice9-runtime.png') center/contain no-repeat}

/* e-space studio is the maker; OPTIX is the product. Existing campaign art remains. */
.studio-name{display:block;flex-shrink:0;text-decoration:none;color:inherit;font:600 27px system-ui,sans-serif;letter-spacing:-.06em;line-height:1}.studio-name span{display:block;font:8px ui-monospace,monospace;letter-spacing:.13em;margin-top:7px}.portfolio .entry .enter-link{display:inline-flex;align-items:center;gap:16px;min-height:52px;padding:15px 20px;border:1px solid #d8f0a5;background:#d8f0a5;color:#15221d;font:600 12px system-ui,sans-serif;letter-spacing:.025em;text-decoration:none}.portfolio .entry .enter-link span{margin:0}.portfolio .entry .enter-link:focus-visible{outline:3px solid #fff;outline-offset:5px}.studio-bar .studio-name:focus-visible{outline:3px solid #cba5ff;outline-offset:5px}@media(max-width:700px){.studio-name{font-size:24px}.studio-name span{font-size:7px}.portfolio .entry .enter-link{font-size:12px;max-width:100%;gap:10px;padding:15px}.portfolio .entry .kicker{font-size:9px;letter-spacing:.12em}.studio-bar .project-link{font-size:9px}.studio-bar .menu-toggle{min-height:44px;min-width:44px}}