@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--bg:#08090b;--ink:#eeeae2;--muted:#a9a6ad;--acid:#bca3ee;--brand:#2c087c;--lavender:#f5f2fa;--pink:#fb2882;--line:#ffffff2a}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--acid);outline-offset:5px}::selection{background:var(--acid);color:#111}p{font-size:15px;line-height:1.8;color:var(--muted)}h1,h2,h3,p{margin-top:0}h1,h2{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-weight:600;line-height:.91;letter-spacing:-.02em}h1 i,h2 i,.outro i{font-style:normal;color:var(--acid)}h2{font-size:clamp(50px,7.2vw,108px);margin-bottom:45px}h3{font-weight:500}header{height:104px;display:flex;align-items:center;justify-content:space-between;padding:0 4%;position:absolute;inset:0 0 auto;z-index:10;border-bottom:1px solid var(--line)}header img{width:136px;height:auto}nav{display:flex;gap:32px;font-size:12px}nav a:hover{color:var(--acid)}.nav-cta{border:1px solid var(--line);padding:13px 19px;border-radius:3px;font-size:12px}.nav-cta span{margin-left:25px}#menu{display:none;background:none;border:0;color:white;font-size:26px}.skip{position:absolute;top:-80px;z-index:99;background:white;color:black;padding:15px}.skip:focus{top:0}.label{font-size:9px;letter-spacing:1.8px;line-height:1.7;display:inline-block}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--acid);margin-right:9px;box-shadow:0 0 14px #bca3ee}.hero{position:relative;height:100svh;min-height:820px;max-height:1200px;padding:140px 4% 35px;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;background:radial-gradient(ellipse at 50% 40%,#201326,#08090b 70%)}.hero-top{display:flex;justify-content:space-between;position:relative;z-index:2}.hero-title{position:relative;z-index:2;pointer-events:none;text-align:center;margin-top:180px}.hero h1{font-size:clamp(90px,13.6vw,210px);letter-spacing:-.025em;margin:0;text-shadow:0 3px 35px #0008}.hero h1 i{color:transparent;-webkit-text-stroke:1.5px #f5eee2}.hero-foot{position:relative;z-index:3;display:flex;align-items:flex-end;justify-content:space-between;margin-top:45px}.hero-foot p{font-size:12px;line-height:1.7;margin:0;color:#c3bcc8}.hero-foot strong{font-weight:500;color:white}.round-link{width:66px;height:66px;border:1px solid #ffffff80;border-radius:50%;display:grid;place-items:center;font-size:28px;background:#15101955;transition:.3s}.round-link:hover{background:var(--acid);color:black;transform:rotate(45deg)}.hero-tools{text-align:right}.hero-tools .label{display:block;font-size:8px}.hero-tools button{display:block;background:none;border:0;color:#a79caf;font-size:8px;letter-spacing:1px;margin:15px 0 0 auto;padding:7px 0}#portal{position:absolute;inset:15px 0 0;z-index:1}#portal canvas{width:100%;height:100%;display:block}.portal-fallback{width:450px;height:450px;position:absolute;left:calc(50% - 225px);top:17%;border:25px solid #9b66e3;border-radius:50%;box-shadow:0 0 70px #e62997,inset 0 0 90px #751be7;transform:rotateY(25deg)}.discipline-bar{padding:28px 4%;display:flex;justify-content:space-between;align-items:center;gap:30px;border-block:1px solid var(--line);font-size:11px;letter-spacing:3px;overflow:hidden;white-space:nowrap}.discipline-bar b{font-size:26px;color:var(--acid);font-weight:400}.wrap{padding:105px 6%}.intro{background:#f5f2fa;color:#16141a}.intro h2{font-family:'DM Sans',Arial,sans-serif;font-size:clamp(37px,5.4vw,80px);font-weight:400;line-height:1.1;letter-spacing:-.05em;margin:35px 0 50px}.intro h2 i{color:#817a87}.intro-bottom{display:grid;grid-template-columns:1fr 1.3fr 1fr;align-items:center;gap:50px}.asterisk{font-size:100px;line-height:1;color:#5f287f}.intro-bottom p{color:#5c5661;font-size:14px;max-width:430px;margin:0}.underlink{border-bottom:1px solid #29232e;padding-bottom:10px;font-size:12px;justify-self:end}.section-head{display:flex;justify-content:space-between;gap:30px;align-items:center;margin-bottom:40px}.section-head a,.section-head>span:last-child{font-size:9px;letter-spacing:1px}.work h2 i{color:#9c91a7}.projects{display:grid;grid-template-columns:1fr 1fr;gap:35px}.project:nth-child(2){margin-top:110px}.project-image{height:570px;overflow:hidden;background:#113c53;position:relative;border:1px solid #ffffff15}.project-image img{width:100%;height:100%;object-fit:cover;object-position:center 25%;transition:transform .8s}.chapter .project-image{background:#26221b;padding:35px}.chapter .project-image img{object-fit:contain;transform:rotate(5deg);filter:drop-shadow(12px 15px 12px #0009)}.project:hover img{transform:scale(1.04)}.project-meta{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1px;margin:24px 0 16px;color:#b7adbc}.project h3{font-size:30px;letter-spacing:-1px;margin:0 0 10px}.project p{font-size:12px}.expertise{background:#151317}.service-row{display:grid;grid-template-columns:.25fr 1.5fr 1fr .2fr;gap:20px;align-items:center;padding:38px 0;border-top:1px solid var(--line)}.service-row:last-child{border-bottom:1px solid var(--line)}.service-row h3{font-family:'Barlow Condensed',Impact,sans-serif;font-size:55px;line-height:.95;letter-spacing:-.5px;margin:0}.service-row p{font-size:11px;line-height:1.9;margin:0}.service-row b{font-weight:400;font-size:35px;justify-self:end;color:var(--acid)}.service-row:hover h3{color:var(--acid)}.manifesto{position:relative;background:radial-gradient(ellipse at 100% 70%,#42283b55,transparent 70%);display:grid;grid-template-columns:1fr 2fr;column-gap:50px}.manifesto h2{font-size:clamp(65px,8vw,125px);margin:0}.manifesto p{grid-column:2;max-width:430px;margin:35px 0 0}.outro{padding:65px 6% 80px;background:var(--acid);color:#211038}.outro>a{font-family:'Barlow Condensed',Impact,sans-serif;display:block;font-size:clamp(80px,13vw,190px);line-height:.86;letter-spacing:-3px;margin-top:28px;position:relative;font-weight:600}.outro i{color:#211038}.outro b{position:absolute;right:2%;top:0;font-size:.8em;font-weight:400}footer{display:flex;justify-content:space-between;gap:30px;align-items:center;padding:40px 6%;font-size:11px}footer span{line-height:1.7;color:var(--muted)}footer small{color:var(--muted);font-size:9px}.page-hero,.case-hero{padding-top:185px;padding-bottom:80px;background:radial-gradient(ellipse at 90% 30%,#42214455,transparent 70%)}.page-hero h1,.case-hero h1{font-size:clamp(70px,10vw,145px);margin:32px 0}.page-hero>p,.case-hero>p{max-width:650px;font-size:17px}.light{background:#f5f2fa;color:#17141b}.light h2{margin-top:30px}.capabilities{display:grid;grid-template-columns:1fr 1fr;gap:25px}.capabilities article{border-top:1px solid #19111e40;padding:30px 0}.capabilities span{font-size:11px;color:#746875}.capabilities h3{font-size:26px;max-width:350px;margin:25px 0 0}.capabilities p{color:#5c5661;margin:20px 0 0}.detail-copy{display:grid;grid-template-columns:1fr 1fr;gap:80px}.detail-copy h2{font-size:70px}.detail-copy h3{font-size:22px;margin:30px 0 10px}.detail-copy p{font-size:15px}.button{background:var(--acid);border:0;padding:17px 25px;color:#211038;display:inline-block;font-size:12px;cursor:pointer;margin-top:15px}.button:hover{background:#d7c4f5}.case-body{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:8%;padding-top:20px}.poster{width:100%;height:auto}.case-body h2{font-size:65px;margin-top:25px}.case-body h3{font-size:22px;margin-top:35px}.case-body dl{border-top:1px solid var(--line);padding-top:30px;margin-top:35px}.case-body dt{font-size:9px;letter-spacing:1.5px;color:var(--acid);margin-bottom:10px}.case-body dd{margin:0 0 25px;font-size:13px}.note{font-size:11px!important;line-height:1.7}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:8%;padding-top:15px}.contact-link{display:block;font-size:25px;margin:22px 0}.contact-grid h3{margin-top:45px}.contact-grid label{display:block;font-size:12px;margin-top:25px}input,select,textarea{display:block;margin-top:10px;padding:14px;width:100%;color:white;background:#131217;border:1px solid #514956;border-radius:0}textarea{resize:vertical}.contact-grid form .note{margin-top:20px}.download{background:none;color:#cfc5d3;border:0;border-bottom:1px solid #777;padding:8px 0;font-size:12px}#status{color:var(--acid);font-size:12px}@media(min-width:1700px){.wrap{padding-inline:max(6%,calc((100vw - 1500px)/2))}}@media(max-width:1000px){.hero{min-height:780px}.hero-title{margin-top:130px}.hero h1{font-size:14vw}.project-image{height:450px}.intro-bottom{grid-template-columns:.4fr 1fr;gap:25px}.underlink{grid-column:2;justify-self:start}.service-row{grid-template-columns:.2fr 1.3fr 1fr .2fr}.service-row h3{font-size:45px}.detail-copy h2{font-size:55px}.wrap{padding-block:80px}.page-hero,.case-hero{padding-top:160px}.case-body h2{font-size:50px}.case-body{padding-top:15px}.contact-grid{padding-top:15px}.manifesto{grid-template-columns:.7fr 2fr}}@media(max-width:600px){header{height:82px;padding:0 6%}header img{width:105px}.nav-cta{margin-left:auto;font-size:10px;padding:10px}.nav-cta span{margin-left:8px}#menu{display:block;margin-left:13px}nav{display:none;position:absolute;top:82px;left:0;right:0;padding:25px 6%;background:#131015;border-bottom:1px solid var(--line);flex-direction:column;gap:25px}nav.open{display:flex}.hero{padding:112px 6% 30px;min-height:740px;height:100svh;max-height:950px}.hero-top .label{font-size:7px;letter-spacing:1px}.location{display:none}.hero-title{margin-top:180px}.hero h1{font-size:16vw;line-height:.98}.hero h1 i{-webkit-text-stroke:1px #f5eee2}.hero-foot{gap:20px;align-items:center;flex-wrap:wrap;margin-top:40px}.hero-foot p{font-size:11px}.round-link{width:50px;height:50px;font-size:25px}.hero-tools{display:flex;justify-content:space-between;align-items:center;flex-basis:100%;margin-top:12px}.hero-tools .label{font-size:7px}.hero-tools button{margin:0;font-size:7px}#portal{inset:30px -30% 120px}.portal-fallback{width:260px;height:260px;left:calc(50% - 130px);top:22%;border-width:15px}.discipline-bar{justify-content:flex-start;gap:25px;font-size:9px;padding:20px 6%;letter-spacing:2px}.wrap{padding:65px 6%}.intro h2{font-size:38px}.intro-bottom{grid-template-columns:.25fr 1fr;gap:20px}.asterisk{font-size:52px}.intro-bottom p{font-size:12px}.section-head{margin-bottom:30px;align-items:start}.section-head a,.section-head>span:last-child{font-size:7px;letter-spacing:.6px}.label{font-size:8px;letter-spacing:1px}h2{font-size:54px}.projects{grid-template-columns:1fr;gap:42px}.project:nth-child(2){margin-top:0}.project-image{height:440px}.project h3{font-size:26px}.chapter .project-image{padding:30px}.service-row{grid-template-columns:.2fr 1fr .15fr;padding:28px 0;gap:12px}.service-row h3{font-size:40px}.service-row p{display:none}.service-row b{font-size:28px}.manifesto{grid-template-columns:1fr;gap:30px}.manifesto h2{font-size:66px}.manifesto p{grid-column:1;font-size:13px;margin:0}.outro{padding:45px 6% 55px}.outro>a{font-size:19vw;letter-spacing:-2px}.outro b{font-size:.65em;right:0;top:15%}footer{flex-wrap:wrap;padding:30px 6%;gap:25px}footer img{width:100px;height:auto}footer>span{margin-left:auto;font-size:10px}footer small{margin-left:auto;font-size:8px}footer>a{font-size:10px}.page-hero,.case-hero{padding-top:140px;padding-bottom:45px}.page-hero h1,.case-hero h1{font-size:66px}.page-hero>p,.case-hero>p{font-size:14px}.capabilities{grid-template-columns:1fr;gap:10px}.capabilities h3{font-size:24px;margin-top:16px}.detail-copy{grid-template-columns:1fr;gap:0}.detail-copy h2{font-size:55px}.case-body{grid-template-columns:1fr;gap:45px;padding-top:0}.case-body h2{font-size:55px}.case-body p{font-size:14px}.contact-grid{grid-template-columns:1fr;gap:40px;padding-top:0}.contact-link{font-size:24px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

/* Brand refinement: invoice purple and lavender; compact first viewport. */
header nav{margin-left:auto;align-items:center;gap:34px}
nav a[aria-current="page"]{color:var(--acid)}
.nav-cta{background:var(--brand);border-color:#8060ae;color:#fff}
.hero{height:calc(100svh - 84px);min-height:580px;max-height:1000px;padding-top:128px;padding-bottom:24px}
.hero-top{justify-content:flex-end}
.hero-title{margin-top:0}
.hero h1{font-size:clamp(78px,12.4vw,182px)}
.hero-foot{margin-top:0}
.discipline-bar{height:84px;padding-block:18px}
.outro{background:var(--brand);color:var(--lavender)}
.outro i{color:#c9afea}
.asterisk{color:var(--brand)}
.button{background:var(--brand);color:#fff;border:1px solid #8e6cb5}
.button:hover{background:#48208e}
.round-link:hover{background:var(--brand);color:white}
.inner .page-hero,.inner .case-hero{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 85% 45%,#2c087c55,transparent 70%)}
.inner .page-hero> :not(#portal),.inner .case-hero> :not(#portal){position:relative;z-index:2}
.inner #portal{inset:0 0 0 43%;opacity:.5;z-index:0;pointer-events:none}
.inner #portal .portal-fallback{width:300px;height:300px;left:calc(50% - 150px);top:20%}
.inner-motion{display:block;background:#100b19aa;color:#cec0db;border:1px solid #716079;padding:10px 13px;font-size:8px;letter-spacing:1px;margin-top:25px}
.inner .page-hero p,.inner .case-hero p{max-width:620px}
@media(max-width:600px){
header nav{align-items:stretch;margin:0;gap:22px}
header .nav-cta{margin:0;width:fit-content;padding:12px 20px;font-size:12px}
#menu{margin-left:auto}
.hero{height:calc(100svh - 64px);min-height:510px;max-height:900px;padding-top:103px;padding-bottom:20px}
.hero-title{margin-top:70px}
.hero h1{font-size:15.6vw}
.hero-top{min-height:0}
.hero-foot{margin-top:15px;gap:14px}
.hero-tools{margin-top:8px}
.hero #portal{inset:0 -25% 80px}
.discipline-bar{height:64px;gap:14px;padding:15px 5%;font-size:7px;letter-spacing:1px;justify-content:space-between}
.discipline-bar b{font-size:16px}
.inner #portal{inset:10% -40% 5% 20%;opacity:.28}
}
@media(max-height:720px) and (min-width:601px){.hero{min-height:440px;padding-top:115px}.hero h1{font-size:clamp(65px,10.5vw,145px)}.hero-foot p{font-size:10px}.round-link{width:48px;height:48px}.hero-tools .label{font-size:7px}}
@media(max-height:620px) and (max-width:600px){.hero{min-height:460px}.hero-title{margin-top:25px}.hero h1{font-size:14vw}.hero-foot p{font-size:10px}}
/* Cinematic motion system and poster-based holographic portrait scenes. */
nav a,button,.button,.underlink,.nav-cta,.section-head a,footer a{text-transform:uppercase;letter-spacing:.08em}
.hero-tools button,.inner-motion{position:relative;z-index:5}
.inner #portal{opacity:.72;inset:0 0 0 30%}
.inner .page-hero:after,.inner .case-hero:after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#08090b85 10%,transparent 80%)}
.hero-title{filter:drop-shadow(0 5px 18px #000a)}
.project-image,.chapter .project-image{padding:0;background:#090811}
.hologram{height:100%;min-height:440px;position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,#51208f80,transparent 65%),linear-gradient(160deg,#110b1c,#030408);perspective:1000px}
.hologram:before{content:'';position:absolute;inset:0;background-image:linear-gradient(#aa79e50b 1px,transparent 1px),linear-gradient(90deg,#aa79e50b 1px,transparent 1px);background-size:35px 35px;mask-image:linear-gradient(transparent,#000);pointer-events:none}
.holo-aura{position:absolute;width:110%;height:90%;left:-5%;top:0;background:conic-gradient(from 45deg,transparent,#9b65fb40,transparent,#dcbbff30,transparent);filter:blur(35px);animation:aura-turn 16s linear infinite}
.holo-floor{position:absolute;left:12%;bottom:11%;width:76%;height:26%;border:1px solid #bc8aff80;border-radius:50%;box-shadow:0 0 30px #9e62e94d,inset 0 0 30px #7b4bdd55;transform:rotateX(65deg);background:repeating-radial-gradient(ellipse,transparent 0 20px,#9460d633 21px 22px);animation:floor-pulse 5s ease-in-out infinite}
.holo-stage{position:absolute;width:72%;height:75%;left:14%;top:4%;transform-style:preserve-3d;animation:holo-orbit 12s ease-in-out infinite;will-change:transform}
.holo-portrait{position:absolute;inset:0;border-radius:40% 40% 7% 7%;background-repeat:no-repeat;transform:translateZ(36px);filter:saturate(.55) contrast(1.1);mask-image:linear-gradient(#000 70%,transparent 100%);box-shadow:0 0 50px #b680ff30}
.spice-hologram .holo-portrait{background-image:url('/assets/spice.jpg');background-size:220% auto;background-position:75% 9%}
.jose-hologram .holo-portrait{background-image:url('/assets/final-chapter.jpg');background-size:190% auto;background-position:90% 0}
.holo-glass{position:absolute;inset:0;transform:translateZ(43px);background:repeating-linear-gradient(0deg,transparent 0 3px,#b69afa18 3px 4px),linear-gradient(120deg,#b480ff30,transparent 40%,#602cb344);border-radius:40% 40% 7% 7%;mix-blend-mode:screen;mask-image:linear-gradient(#000 65%,transparent)}
.holo-scan{position:absolute;left:-8%;right:-8%;height:7%;top:0;background:linear-gradient(transparent,#d8c3ff55,transparent);box-shadow:0 8px 30px #bd83ff35;transform:translateZ(65px);animation:holo-scan 5.5s ease-in-out infinite;pointer-events:none}
.holo-outline{position:absolute;inset:6% -6%;border:1px solid #bc8aff35;clip-path:polygon(0 0,18% 0,18% 1%,1% 1%,1% 18%,0 18%,0 0,100% 0,100% 18%,99% 18%,99% 1%,82% 1%,82% 0,100% 0,100% 100%,82% 100%,82% 99%,99% 99%,99% 82%,100% 82%,100% 100%,0 100%,0 82%,1% 82%,1% 99%,18% 99%,18% 100%,0 100%)}
.holo-outline.rear{transform:translateZ(-35px) scale(1.1)}.holo-outline.front{transform:translateZ(80px)}
.holo-caption{position:absolute;bottom:6%;left:7%;right:7%;display:flex;flex-direction:column;gap:8px;z-index:5;text-align:center;pointer-events:none;text-shadow:0 2px 12px black}
.holo-caption span{font-size:7px;letter-spacing:1.6px;color:#c7afd9}.holo-caption strong{font-family:'Barlow Condensed',Impact,sans-serif;font-size:42px;line-height:1;color:#f5f2fa;font-weight:500;letter-spacing:1px}
.case-art>.hologram{height:640px}.case-art details{margin-top:20px;border-top:1px solid #76528c55;padding-top:17px}.case-art summary{cursor:pointer;font-size:10px;letter-spacing:1px;color:#cbb5e7}.case-art details img{margin-top:20px}
.hologram.interacting .holo-stage{animation:none;transition:transform .2s ease-out}
.motion-paused .hologram *{animation-play-state:paused!important}
.motion-global{position:fixed;bottom:18px;right:18px;z-index:40;border:1px solid #7f5ea5;background:#100b1de8;color:#e6d9fa;font-size:8px;padding:11px 13px;backdrop-filter:blur(12px);box-shadow:0 3px 20px #0005}
@keyframes holo-orbit{0%,100%{transform:rotateY(-12deg) rotateX(3deg) translateY(0)}25%{transform:rotateY(5deg) rotateX(-3deg) translateY(-12px)}50%{transform:rotateY(12deg) rotateX(2deg) translateY(0)}75%{transform:rotateY(-3deg) rotateX(-2deg) translateY(-8px)}}
@keyframes holo-scan{0%,100%{top:0;opacity:0}10%{opacity:.8}80%{opacity:.8}90%{top:85%;opacity:0}}
@keyframes aura-turn{to{transform:rotate(360deg)}}
@keyframes floor-pulse{0%,100%{opacity:.4;transform:rotateX(65deg) scale(.95)}50%{opacity:1;transform:rotateX(65deg) scale(1.05)}}
@media(max-width:600px){.inner #portal{inset:5% -30% 0 10%;opacity:.48}.hologram{min-height:440px}.holo-stage{width:78%;left:11%}.case-art>.hologram{height:490px}.holo-caption strong{font-size:36px}.holo-caption span{font-size:6px;letter-spacing:1px}.motion-global{bottom:10px;right:10px;font-size:7px}.hero-tools button{font-size:8px}}
@media(prefers-reduced-motion:reduce){.hologram *{animation:none!important}.holo-stage{transform:rotateY(-5deg)}.holo-scan{display:none}}
