/* One continuous optical field, without section-sized masks. */
:root{--portal-accent:#abcfff;--portal-tint:#0b1321;--portal-red:#c4aaff;--portal-cyan:#86dfff}
body[data-portal-tone=stage]{--portal-accent:#c7a4ff;--portal-tint:#17132a;--portal-red:#ed9aff;--portal-cyan:#b1a8ff}
body[data-portal-tone=digital]{--portal-accent:#7be5d2;--portal-tint:#0a2024;--portal-red:#a0f3b9;--portal-cyan:#7ce9ff}
body{overflow-x:clip;background:#070910}.effect-defs{position:absolute;pointer-events:none;overflow:hidden}
.portal-surface{isolation:auto;overflow:visible;border:0!important;background:transparent!important}
.portal-surface:before,.portal-surface:after{display:none!important}
.portal-base{background:transparent}.portal-lit{position:absolute;inset:0 auto auto 0;z-index:2;width:100%;height:100dvh;overflow:hidden;pointer-events:none;background:var(--portal-tint);clip-path:circle(510px at 70% 48%);transition:background-color .65s;contain:paint;will-change:transform}
.portal-projection{position:absolute;left:0;top:0;width:100%;margin:0!important;pointer-events:none;will-change:transform}
.portal-projection>.portal-base{height:100%}
.portal-lit>.portal-projection h1,.portal-lit>.portal-projection h1 em,.portal-lit>.portal-projection h2,.portal-lit>.portal-projection h2 em{filter:none!important;-webkit-text-stroke:0!important;color:#edf5ff}
.portal-lit>.portal-projection h1 em,.portal-lit>.portal-projection h2 em{color:#9fc5ff}
.portal-global-outline{position:absolute;inset:0 auto auto 0;width:100%;height:100dvh;pointer-events:none;z-index:3;overflow:hidden;transition:color .65s;color:var(--portal-accent);will-change:transform}
.portal-global-outline>use{fill:none;stroke:currentColor;stroke-width:1.15;vector-effect:non-scaling-stroke}
.portal-global-outline .portal-halo{stroke-width:7;opacity:.18;filter:blur(5px)}
.portal-global-outline .portal-red{stroke:var(--portal-red);stroke-width:1.7}
.portal-global-outline .portal-cyan{stroke:var(--portal-cyan);stroke-width:1.7}
body.portal-holding,body.portal-holding *{user-select:none!important;-webkit-user-select:none!important;cursor:none!important}
.portal-surface:not(.portal-projection)>.portal-base h1,.portal-surface:not(.portal-projection)>.portal-base h2{color:#fff!important;-webkit-text-stroke:0!important;filter:url(#outline-text)}
.portal-surface:not(.portal-projection)>.portal-base h1 em,.portal-surface:not(.portal-projection)>.portal-base h2 em{color:inherit!important;-webkit-text-stroke:0!important}
.hero h1,.section-heading h2{font-weight:500;letter-spacing:-.033em}
.hero h1{font-size:clamp(51px,7.3vw,117px);line-height:1.08}
.hero>.portal-base{min-height:max(800px,96svh);padding-bottom:120px}
.hero-brand{margin-bottom:8vh}.hero-art{inset:-5% -4% -8% 30%;overflow:hidden;mask-image:linear-gradient(0deg,transparent,black 23%,black 76%,transparent)}
.hero-art img,.hero-art canvas{animation:none;mask-image:linear-gradient(90deg,transparent,black 20%,black 82%,transparent);filter:none}
.portal-projection .hero-art,.portal-projection .contact-visual img{opacity:1!important}
.hero-art canvas,.contact-visual canvas{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.hero-art.has-shader>img,.contact-visual.has-shader>img{opacity:0!important}
.hero-foot{border:0;color:#9bb0cc;padding-top:0;bottom:30px}.hero-meta{color:#9daeca}
.hero-foot .scroll-link{font-size:13px}.hero-foot .scroll-link span{display:none}
.directions>.portal-base{padding-top:100px;padding-bottom:115px}
.directions .section-heading{margin-bottom:72px}.directions h2{font-size:clamp(43px,5.6vw,86px);line-height:1.12}
.portal-lit .directions h2 em{color:var(--portal-accent);transition:color .65s}
.works,.process{position:relative;z-index:4;background:transparent!important;border:0!important}
.works{padding-top:110px;padding-bottom:100px}.process{padding-top:90px;padding-bottom:115px}
.gallery-heading{margin-top:40px}.gallery-heading h2{line-height:1.12;letter-spacing:-.033em}
.contact>.portal-base{padding-top:95px;padding-bottom:85px}.contact h2{letter-spacing:-.04em}
.contact-visual{border:0;background:transparent;overflow:hidden;mask-image:linear-gradient(0deg,transparent,black 15%,black 90%,transparent)}
.contact-visual img,.contact-visual canvas{animation:none;mask-image:linear-gradient(90deg,transparent,black 12%,black 90%,transparent)}
.contact-visual-word{color:#8fa8cb;-webkit-text-stroke:0;opacity:.38}
.portal-lit .contact-visual-word{opacity:1}.contact-card{border:0;background:transparent;padding-top:0;padding-bottom:0}
.portal-lit .contact-card{background:transparent;border:0}
footer{position:relative;z-index:4;border-top:1px solid #23304666}
/* Directions are open editorial compositions. Only the case link is actionable. */
.direction-studios{display:grid;grid-template-columns:1fr 1fr;gap:clamp(35px,6vw,100px);align-items:start}
.direction-studio{--direction-color:#c19aff;--direction-rgb:169,108,255;position:relative;min-width:0;perspective:1000px}
.direction-studio[data-direction=digital]{--direction-color:#76e6d0;--direction-rgb:53,211,181;margin-top:135px}
.direction-art{height:330px;position:relative;margin:0 -28px -55px;pointer-events:none;transform:rotate(-5deg);transition:transform 1s cubic-bezier(.22,1,.36,1);mask-image:linear-gradient(0deg,transparent,black 35%,black 72%,transparent)}
.direction-studio[data-direction=digital] .direction-art{transform:rotate(5deg)}
.direction-art img{width:100%;height:100%;object-fit:cover;opacity:.09;filter:grayscale(1);mix-blend-mode:screen;mask-image:linear-gradient(90deg,transparent,black 20%,black 80%,transparent)}
.direction-art:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse,rgba(var(--direction-rgb),.5),transparent 70%);mix-blend-mode:color}
/* Geometry is driven by one shared hover state, never separate native hover timelines. */
.direction-studio.is-pointed .direction-art{transform:rotate(0deg) scale(1.035)}
.portal-lit .direction-art img{opacity:.9;filter:saturate(.65);mix-blend-mode:luminosity}
.direction-scan{position:absolute;inset:20% 8%;border-top:1px solid rgba(var(--direction-rgb),.3);border-bottom:1px solid rgba(var(--direction-rgb),.15);transform:skewY(-8deg);transition:transform .8s}
.direction-studio[data-direction=digital] .direction-scan{transform:skewY(8deg)}
.direction-content{position:relative;z-index:1}.direction-number{font-size:13px;letter-spacing:2px;color:var(--direction-color);display:block;margin-bottom:24px}
.direction-studio h3{font-size:clamp(36px,4.1vw,65px);line-height:1.05;letter-spacing:-.04em;font-weight:500;color:var(--direction-color);margin-bottom:25px}
.direction-studio p{font-size:16px;line-height:1.65;color:#a2b2c9;max-width:480px}
.portal-lit .direction-studio p{color:#c9d8ee}
.direction-deliverables{list-style:none;display:flex;flex-wrap:wrap;gap:0;margin:25px 0 28px;padding:0}
.direction-deliverables li{font-size:13px;line-height:1.7;color:#8096b7;padding:3px 0;display:inline}
.direction-deliverables li:not(:last-child):after{content:'·';margin:0 10px;color:rgba(var(--direction-rgb),.6)}
.portal-lit .direction-deliverables li{color:#adcae6}
.direction-cta{display:inline-flex;align-items:center;gap:32px;padding:15px 0;font-size:16px;color:var(--direction-color);min-height:68px;font-weight:500}
.cta-orbit{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(var(--direction-rgb),.7);border-radius:50%;font-size:22px;font-weight:350;transition:background .3s,box-shadow .3s,transform .4s}
.direction-cta:hover .cta-orbit,.direction-cta:focus-visible .cta-orbit{background:var(--direction-color);color:#07111b;box-shadow:0 0 28px rgba(var(--direction-rgb),.3);transform:rotate(90deg)}
.portal-lit .direction-cta .cta-orbit{background:var(--direction-color);color:#08101b}
.direction-studio.is-pointed .cta-orbit{box-shadow:0 0 26px rgba(var(--direction-rgb),.2)}
/* Gallery filters carry the same color into every component and project details. */
.works,.case-dialog{--case-accent:#a4caff;--case-rgb:124,167,231;--case-dark:#182b49}
.works[data-tone=stage],.case-dialog[data-tone=stage]{--case-accent:#c4a0ff;--case-rgb:169,112,246;--case-dark:#2c2148}
.works[data-tone=digital],.case-dialog[data-tone=digital]{--case-accent:#7ce6d1;--case-rgb:68,209,181;--case-dark:#123b38}
.works h2 em{color:var(--case-accent);transition:color .5s}
.case-filters button{transition:background-color .4s,border-color .4s,color .4s;position:relative}
.case-filters button[data-filter=stage]{--filter-color:#c4a0ff;--filter-rgb:169,112,246}
.case-filters button[data-filter=digital]{--filter-color:#7ce6d1;--filter-rgb:68,209,181}
.case-filters button[data-filter=all]{--filter-color:#a4caff;--filter-rgb:124,167,231}
.case-filters button:hover{color:var(--filter-color);border-color:rgba(var(--filter-rgb),.7)}
.case-filters button[aria-pressed=true]{background:rgba(var(--filter-rgb),.2);border-color:var(--filter-color);color:var(--filter-color);box-shadow:0 0 27px rgba(var(--filter-rgb),.1)}
.works .case-card{background:linear-gradient(145deg,rgba(var(--case-rgb),.12),transparent),#0e1827;border-color:rgba(var(--case-rgb),.3);transition:transform .6s,opacity .5s,background .5s,border-color .5s,box-shadow .5s}
.works .case-card.is-active{border-color:rgba(var(--case-rgb),.85);box-shadow:0 20px 100px rgba(var(--case-rgb),.13)}.works .case-counter b,.works .round-button{color:var(--case-accent)}.works .round-button{border-color:rgba(var(--case-rgb),.65)}
.works .round-button:hover{background:rgba(var(--case-rgb),.2)}
.case-dialog{border-color:rgba(var(--case-rgb),.65)}
.case-dialog .eyebrow,.case-dialog .project-tags span{color:var(--case-accent)}
.case-dialog .project-tags span{border-color:rgba(var(--case-rgb),.5)}
.case-dialog .button.primary{background:var(--case-accent);border-color:var(--case-accent);color:#08121d}
@media(max-width:1150px){.hero h1{font-size:7.1vw}.hero>.portal-base{min-height:790px}.direction-studios{gap:40px}.direction-art{height:270px}.direction-studio h3{font-size:42px}.direction-studio[data-direction=digital]{margin-top:105px}}
@media(max-width:760px){.hero h1{font-size:clamp(29px,7.45vw,55px);letter-spacing:-.025em}.hero>.portal-base{min-height:840px;padding-bottom:125px}.hero-brand{margin-bottom:77px}.hero-art{inset:130px -40% -20px -10%;mask-image:linear-gradient(0deg,transparent,black 27%,black 65%,transparent)}.hero-foot{bottom:68px}.hero-foot .scroll-link{display:none}.directions>.portal-base{padding-top:45px;padding-bottom:65px}.directions .section-heading{margin-bottom:30px}.directions h2{font-size:clamp(35px,8.5vw,58px);line-height:1.12;letter-spacing:-.026em}.direction-studios{grid-template-columns:1fr;gap:55px}.direction-studio[data-direction=digital]{margin-top:0}.direction-art{height:260px;margin:0 -12px -35px}.direction-studio h3{font-size:45px;letter-spacing:-.03em;margin-bottom:22px}.direction-number{margin-bottom:19px}.direction-studio p{font-size:16px}.direction-deliverables{margin:22px 0}.direction-deliverables li{font-size:14px}.direction-cta{font-size:16px;gap:32px}.works{padding-top:65px;padding-bottom:65px}.process{padding-top:55px;padding-bottom:65px}.contact>.portal-base{padding-top:55px;padding-bottom:65px}.contact h2{letter-spacing:-.03em}.section-heading h2{letter-spacing:-.03em}}
@media(prefers-reduced-motion:reduce){.portal-lit{clip-path:none!important;mask:none!important;-webkit-mask:none!important}.portal-global-outline{display:none}.portal-surface:not(.portal-projection)>.portal-base h1,.portal-surface:not(.portal-projection)>.portal-base h2{filter:none;color:#dceaff!important}.direction-art{transform:none!important}}
@media(forced-colors:active){.portal-lit,.portal-global-outline{display:none}.portal-surface:not(.portal-projection)>.portal-base h1,.portal-surface:not(.portal-projection)>.portal-base h2{filter:none!important;color:CanvasText!important}}
