/* A tactile motion layer for Xigen. Content remains readable without motion. */
:root{--motion-ease:cubic-bezier(.16,1,.3,1)}
.reading-progress{position:fixed;inset:0 0 auto;height:3px;background:var(--orange);z-index:1100;transform:scaleX(0);transform-origin:left;pointer-events:none}
main [id]{scroll-margin-top:110px}
.btn,.circle-link{transition:background .3s,color .3s,border-color .3s,box-shadow .3s,translate .45s var(--motion-ease)}
.btn:hover{box-shadow:0 8px 24px #17180f12;translate:0 -2px}
.btn .arrow,.btn>span:last-child,.opening-caption>span,.cover-arrow{transition:translate .45s var(--motion-ease)}
.btn:hover .arrow,.opening-pane:hover .opening-caption>span{translate:3px -3px}
.circle-link{translate:var(--magnet-x,0px) var(--magnet-y,0px)}
.circle-link:hover{background:var(--ink);color:var(--paper)}
.opening-pane,.feature-cover,.case-cover,.dimension-stage{transform:perspective(1100px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .65s var(--motion-ease)}
.opening-pane:hover img{transform:scale(1.065)}
.opening-pane img{transition:transform 1.2s var(--motion-ease),filter .7s}
.opening-pane:hover img{filter:saturate(1.1)}
.illustrated-capability{transition:box-shadow .5s,background .5s}
.illustrated-capability:hover{background:#dfdacd;box-shadow:0 15px 35px #16170f0c}
.illustrated-capability:hover .service-card-image{transform:scale(1.045)}
.service-card-image{transition:transform 1s var(--motion-ease)!important}
.front-hero .spark{animation:spark-turn 18s linear infinite}
@keyframes spark-turn{to{rotate:360deg}}
.dimension-gallery{margin-top:3rem;color:var(--paper);background:#191a15;padding:clamp(22px,3vw,45px);position:relative;isolation:isolate}
.dimension-header{display:flex;justify-content:space-between;align-items:end;gap:2rem;margin-bottom:2rem}
.dimension-header h3{font-size:clamp(1.7rem,3.2vw,3.6rem);letter-spacing:-.05em;line-height:1.1;max-width:18ch;font-weight:500}
.dimension-header .eyebrow{color:#c0c2b5;font-size:.55rem;margin-bottom:1rem}
.dimension-count{font-family:var(--font-mono);font-size:.65rem;color:#c0c2b5;white-space:nowrap}
.dimension-tabs{display:flex;gap:0;border-block:1px solid #ffffff29;margin-bottom:1.5rem}
.dimension-tab{flex:1;display:flex;gap:12px;align-items:center;padding:18px 12px;font-size:.75rem;position:relative;color:#c4c6b9;transition:color .25s,background .25s}
.dimension-tab>span{font-family:var(--font-mono);font-size:.5rem;color:#b8baa8}
.dimension-tab:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--motion-ease)}
.dimension-tab:hover,.dimension-tab[aria-selected=true]{color:white;background:#ffffff06}
.dimension-tab[aria-selected=true]:after{transform:scaleX(1)}
.dimension-stage{position:relative;overflow:hidden;background:#d7cdb9;aspect-ratio:16/9;max-height:min(560px,62vw)}
.dimension-stage:after{content:'';pointer-events:none;position:absolute;inset:0;opacity:0;transition:opacity .6s;background:radial-gradient(650px circle at var(--pointer-x,50%) var(--pointer-y,50%),#fff2,transparent 65%);mix-blend-mode:screen}
.dimension-stage:hover:after{opacity:1}
.dimension-panel{position:relative;margin:0;height:100%}
.dimension-panel[hidden]{display:none!important}
.dimension-panel img{width:100%;height:100%;object-fit:cover;object-position:center 42%;display:block;transition:transform 1.2s var(--motion-ease)}
.dimension-stage:hover .dimension-panel img{transform:scale(1.025)}
.dimension-panel figcaption{position:absolute;inset:auto 0 0;padding:65px 30px 28px;background:linear-gradient(transparent,#111c);color:white;display:flex;justify-content:space-between;align-items:end;gap:2rem}
.dimension-panel figcaption strong{font-size:clamp(1.2rem,2vw,2rem);font-weight:500;letter-spacing:-.04em;display:block;margin-bottom:.5rem}
.dimension-panel figcaption p{font-size:.75rem;line-height:1.7;margin:0;max-width:42ch;color:#eee}
.dimension-panel figcaption>a{font-size:.65rem;display:flex;align-items:center;gap:1rem;white-space:nowrap;border-bottom:1px solid #ffffff70;padding-bottom:6px}
.dimension-panel figcaption>a span{font-size:1.5rem}
.dimension-note{font-family:var(--font-mono);font-size:.48rem;text-transform:uppercase;letter-spacing:.04em;line-height:1.6;color:#b9bcac;padding-top:1rem;margin:0}
.dimension-gallery:not(.is-interactive) .dimension-tab:after{display:none}
.dimension-gallery:not(.is-interactive) .dimension-panel{margin-bottom:1.5rem}
.copy-disclosure{margin-block:1.3rem;border-top:1px solid var(--line)}
.copy-disclosure summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem;padding:1rem 0;font-size:.7rem}
.copy-disclosure summary:after{content:'+';font-size:1.1rem;color:#ad4708}
.copy-disclosure[open] summary:after{content:'−'}
.copy-disclosure summary::-webkit-details-marker{display:none}
.copy-disclosure p{font-size:.85rem;color:var(--muted)}
.manifesto>div{gap:4rem}.manifesto .about-panel{padding-top:0}.manifesto .about-stat{padding-block:1.3rem}.manifesto .about-copy h2{margin-bottom:1.4rem}
.more-work{border-top:1px solid var(--line);margin-top:2rem;padding-top:1rem}.more-work>summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;font-size:.8rem;padding:.5rem 0}.more-work>summary:after{content:'+';font-size:1.6rem;color:#a94300}.more-work[open]>summary:after{content:'−'}.more-work>summary::-webkit-details-marker{display:none}.more-work .featured-work-grid{margin-top:2rem}
.front-work .featured-work-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}.front-work .feature-cover{min-height:230px;aspect-ratio:1.3}.front-work .feature-name{font-size:clamp(1.8rem,2.8vw,3.2rem)}.front-work .feature-caption{display:block}.front-work .feature-caption h3{margin-block:.5rem}.front-work .feature-caption .tag{font-size:.48rem}
.compact-process{display:grid;grid-template-columns:.9fr 1.1fr;gap:4rem;align-items:start}.process-visual{margin:0;position:relative;overflow:hidden}.process-visual img{width:100%;height:470px;object-fit:cover}.process-visual figcaption{font-family:var(--font-mono);font-size:.5rem;color:var(--muted);text-transform:uppercase;margin-top:1rem;line-height:1.6}.compact-process .process-steps{display:block;counter-reset:process}.compact-process details.process-step{padding:0;counter-increment:process;border-top:1px solid var(--line)}.compact-process .process-step:before{display:none}.process-step>summary{display:flex;gap:1.5rem;align-items:center;cursor:pointer;list-style:none;padding:1.2rem 0}.process-step>summary:before{content:'0' counter(process);font-family:var(--font-mono);font-size:.6rem;color:#ad4708}.process-step>summary:after{content:'+';font-size:1.2rem;margin-left:auto;color:#ad4708}.process-step[open]>summary:after{content:'−'}.process-step>summary::-webkit-details-marker{display:none}.process-step>summary h3{margin:0;font-size:1.35rem}.compact-process .process-step>p{padding:0 0 1.4rem 2.5rem;margin:0;font-size:.8rem}
.studio-principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:min(calc(100% - 112px),var(--max));margin:0 auto 3rem;border-block:1px solid var(--line)}.studio-principles .editorial-row{width:auto;display:block;padding:2rem;border-top:0;border-right:1px solid var(--line)}.studio-principles .editorial-row:last-child{border-right:0}.studio-principles .row-body h2{font-size:1.5rem;line-height:1.4;max-width:none}.studio-principles .row-body p{font-size:.75rem}.studio-principles .row-index{display:none}.studio-direction-photo{margin:2rem 0}.studio-direction-photo img{width:100%;height:400px;object-fit:cover}.studio-direction-photo figcaption{font-family:var(--font-mono);font-size:.5rem;margin-top:.8rem;color:var(--muted);text-transform:uppercase}
.page-services #boundary{padding-block:2rem}.page-services #pillars{padding-block:2.5rem}.page-services #pillars .section-head{margin-bottom:1.6rem}.page-services #pillars .section-head h2{font-size:clamp(1.8rem,3.5vw,3rem)}.page-services #pillars .scale-card{padding-top:1rem}.page-services #pillars .scale-card h3{font-size:1.25rem}.page-services .image-service-row{padding-block:2rem}.page-services .service-row-photo img{height:300px}.page-services .image-service-row .row-body h2{font-size:clamp(1.8rem,2.7vw,3rem)}
.section-index a{border-radius:30px;padding:9px 14px;background:#e8e4d9;transition:color .3s,background .3s}.section-index a:hover{color:var(--paper);background:var(--ink)}
@media(min-width:901px){.page-home .section{padding-block:70px}.page-home .section-head{margin-bottom:2.5rem}.page-home .illustrated-capability .service-card-image{height:250px}.page-home .brand-story{padding-block:65px}.page-home .story-sticky img{margin-top:1.5rem}.page-home .story-chapter{padding-block:1.35rem}}
@media(max-width:900px){.dimension-stage{max-height:min(420px,68vw)}.dimension-tab{font-size:.68rem;padding:16px 10px;gap:8px}.dimension-panel figcaption{padding:55px 22px 22px}.compact-process{gap:2rem}.process-visual img{height:420px}.studio-principles{width:calc(100% - 48px)}.studio-principles .editorial-row{padding:1.3rem}.studio-principles .row-body h2{font-size:1.15rem}.front-work .featured-work-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.manifesto>div{gap:2rem}}
@media(max-width:560px){main [id]{scroll-margin-top:90px}.dimension-gallery{padding:18px;margin-top:2rem}.dimension-header{gap:1rem;margin-bottom:1.5rem}.dimension-header h3{font-size:1.9rem}.dimension-header .eyebrow{font-size:.45rem}.dimension-count{font-size:.5rem}.dimension-tabs{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-bottom:1rem}.dimension-tab{min-height:48px;font-size:.67rem;padding:12px 6px}.dimension-tab>span{font-size:.45rem}.dimension-stage{max-height:min(360px,78vw);aspect-ratio:4/3}.dimension-panel img{object-position:center 38%}.dimension-panel figcaption{display:block;padding:75px 18px 20px}.dimension-panel figcaption strong{font-size:1.45rem}.dimension-panel figcaption p{font-size:.67rem;line-height:1.65}.dimension-panel figcaption>a{margin-top:1rem;width:max-content;font-size:.6rem}.dimension-note{font-size:.4rem}.front-work .featured-work-grid{grid-template-columns:1fr;gap:1.7rem}.front-work .feature-cover{min-height:230px;aspect-ratio:1.5}.front-work .feature-name{font-size:2.6rem}.front-work .section-heading>h2{font-size:2.3rem}.more-work{margin-top:1.5rem}.compact-process{grid-template-columns:1fr;gap:1.5rem}.process-visual img{height:260px}.process-step>summary{padding:1.1rem 0}.process-step>summary h3{font-size:1.2rem}.studio-principles{width:calc(100% - 36px);grid-template-columns:1fr}.studio-principles .editorial-row{padding:1.5rem 0;border-right:0;border-bottom:1px solid var(--line)}.studio-principles .editorial-row:last-child{border-bottom:0}.studio-principles .row-body h2{font-size:1.5rem;max-width:26ch}.studio-direction-photo img{height:280px}.manifesto>div{gap:1.4rem}.manifesto .about-stat{padding-block:1.1rem}.copy-disclosure p{font-size:.78rem}.page-services .service-row-photo img{height:225px}.section-index{gap:.5rem}.section-index a{padding:9px 11px}.page-services #pillars .scale-grid{grid-template-columns:1fr 1fr;gap:1.2rem}.page-services #pillars .scale-card h3{font-size:1rem}.page-services #pillars .scale-card p{font-size:.65rem}}
@media(prefers-reduced-motion:no-preference){@view-transition{navigation:auto}::view-transition-old(root){animation:180ms ease-out both page-away}::view-transition-new(root){animation:300ms var(--motion-ease) both page-arrive}@keyframes page-away{to{opacity:0}}@keyframes page-arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}.front-hero .spark{animation:none}.opening-pane,.feature-cover,.case-cover,.dimension-stage,.circle-link{transform:none!important;translate:none!important}.btn,.circle-link,.opening-pane img,.dimension-panel img,.service-card-image,.dimension-tab:after{transition:none!important}.btn:hover{translate:none}.opening-pane:hover img,.dimension-stage:hover img,.illustrated-capability:hover .service-card-image{transform:none!important}::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}
