/* Code-driven scene choreography. Native scrolling and static content remain primary. */
:root{--motion-curve:cubic-bezier(.16,.72,.13,1)}
.archive-scene-stage{display:contents}
#systems-canvas{display:none;position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.systems-ready #systems-canvas{display:block}
.systems-ready .orbit,.systems-ready .orbit-core,.systems-ready .orbit-node{visibility:hidden}
.discipline-map{background:radial-gradient(ellipse at 50% 48%,#6aafb00c,transparent 64%)}
.orbit-graphic{width:100%;max-width:570px;aspect-ratio:1.12;margin:auto;overflow:hidden}
.map-caption{margin-top:15px;letter-spacing:.16em}
.hero-portrait>a{transform-origin:center;backface-visibility:hidden}
.epic-motion .hero-portrait>a{animation:portrait-aperture 1.8s var(--motion-curve) both .38s}
@keyframes portrait-aperture{0%{clip-path:inset(0 0 100% 0);filter:brightness(.6);transform:translateY(24px)}100%{clip-path:inset(0);filter:brightness(1);transform:translateY(0)}}
.epic-motion .hero-portrait::before{animation:portrait-frame 2s var(--motion-curve) both .55s}
@keyframes portrait-frame{from{opacity:0;transform:translate(12px,12px)}to{opacity:1;transform:none}}
.epic-motion .hero-role{letter-spacing:.035em}
.film-visual .cinema-vignette{background:radial-gradient(ellipse at 66% 42%,transparent 20%,#03070b10 55%,#03070b8c 100%)}
.film-visual .cinema-bloom{opacity:.8}
.epic-motion .archive-scene{height:180svh;min-height:0;max-height:none;display:block;padding:0;overflow:visible;background:#060b10}
.epic-motion .archive-scene::after{content:none}
.epic-motion .archive-scene-stage{position:sticky;top:0;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-start;height:100svh;min-height:0;padding:185px var(--pad) 135px;overflow:hidden;clip-path:inset(var(--frame-inset,0px) round var(--frame-radius,0px));will-change:clip-path}
.epic-motion .archive-scene-stage::after{content:'';position:absolute;z-index:1;inset:0;border-top:clamp(16px,2.4svh,28px) solid #060b10;border-bottom:clamp(16px,2.4svh,28px) solid #060b10;pointer-events:none}
.epic-motion .archive-scene-photo{transform:scale(calc(1.025 + var(--archive-progress,0)*.1)) translate3d(0,calc((var(--archive-progress,0) - .5)*-2.3%),0);filter:saturate(.7) contrast(1.1) brightness(var(--photo-exposure,.87))}
.epic-motion .archive-scene-copy{transform:translate3d(0,calc(var(--archive-progress,0)*-42px),0);opacity:var(--archive-type-opacity,1);will-change:transform}
.epic-motion .archive-scene-copy h2{font-size:clamp(77px,7.6vw,125px);letter-spacing:-.07em}
.epic-motion .archive-frame-line{height:calc(35px + var(--archive-progress,0)*90px);opacity:.65}
.epic-motion .archive-scene-top{top:118px;transform:translateY(calc(var(--frame-inset,0px)*.5))}
.archive-scene-bottom a{position:relative;z-index:4}
.motion-heading{--word-step:155ms;--word-duration:1000ms;--word-lead:90ms}
.film-panel .motion-heading{--word-step:175ms}
.hero .motion-heading{--word-step:300ms;--word-duration:1200ms;--word-lead:140ms}
.motion-heading .word-mask{display:inline-block;overflow:clip;vertical-align:bottom;padding:.1em .1em .18em;margin:-.1em -.1em -.18em}
.motion-heading .word-inner{display:inline-block;transform-origin:left bottom;white-space:pre}
.epic-motion .motion-heading.is-heading-pending .word-inner{transform:translate3d(0,90%,0);opacity:0}
.epic-motion .motion-heading.is-heading-playing .word-inner{animation:word-arrival var(--word-duration) var(--motion-curve) both;animation-delay:calc(var(--word-lead) + var(--word-index,0)*var(--word-step))}
@keyframes word-arrival{0%{transform:translate3d(0,90%,0) rotate(1.2deg);filter:blur(7px);opacity:0}45%{opacity:1}100%{transform:translateZ(0);filter:blur(0);opacity:1}}
/* Two purposeful pauses: the personal monogram and entering Inside the system. */
.has-title-preface{--title-hold:2000ms}
.title-initial,.title-rest{display:inline-block;vertical-align:baseline}
.epic-motion .motion-heading.has-title-preface.is-heading-playing .word-inner{animation-delay:calc(var(--title-hold) + var(--word-lead) + var(--word-index,0)*var(--word-step))}
.epic-motion .motion-heading.has-title-preface.is-heading-playing .word-inner.has-initial{animation:none;opacity:1;transform:none;filter:none}
.epic-motion .has-title-preface.is-heading-playing .title-initial{animation:initial-arrival .8s var(--motion-curve) both;animation-delay:var(--word-lead)}
.epic-motion .has-title-preface.is-heading-playing .title-rest{animation:title-resolution var(--word-duration) var(--motion-curve) both;animation-delay:calc(var(--title-hold) + var(--word-lead) + var(--word-index,0)*var(--word-step))}
@keyframes initial-arrival{from{opacity:0;filter:blur(5px);transform:translate3d(0,.3em,0)}to{opacity:1;filter:blur(0);transform:none}}
@keyframes title-resolution{from{opacity:0;filter:blur(6px);transform:translate3d(.13em,0,0)}to{opacity:1;filter:blur(0);transform:none}}
/* Let the words own the entrance rather than fading their entire container. */
.epic-motion .section-heading.reveal,.epic-motion .publication-copy.reveal,.epic-motion .human-note.reveal,.epic-motion .contact h2.reveal{filter:none!important;transform:none;opacity:1;transition:none}
.metrics>div{position:relative;border-top-color:#a5cbd024}
.metrics>div::before{content:'';position:absolute;left:0;top:-1px;height:1px;width:100%;background:linear-gradient(90deg,#c1e8ef,#91cad426);transform-origin:left;transform:scaleX(1)}
.epic-motion .perspective.is-cinema-in .metrics>div::before{animation:metric-rule 1.6s var(--motion-curve) both .25s}
.epic-motion .perspective.is-cinema-in .metrics>div:nth-child(2)::before{animation-delay:.4s}
.epic-motion .perspective.is-cinema-in .metrics>div:nth-child(3)::before{animation-delay:.55s}
@keyframes metric-rule{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.archive-figure>a,.hero-portrait>a{--pointer-x:50%;--pointer-y:40%}
.archive-figure>a::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at var(--pointer-x) var(--pointer-y),#d5f1ff17,transparent 60%);opacity:0;transition:opacity .6s ease;pointer-events:none}
.archive-figure>a:hover::after,.archive-figure>a:focus-visible::after{opacity:1}
.career-list{position:relative}
.career-list::before,.career-list::after{content:'';position:absolute;left:-20px;top:0;bottom:0;width:1px;background:#b7eaf014;pointer-events:none}
.career-list::after{background:linear-gradient(#cae9ed,#7ba6b34a);transform:scaleY(var(--career-read,0));transform-origin:top}
.career-item{position:relative}
.career-item::before{content:'';position:absolute;left:-23px;top:42px;width:7px;height:7px;border:1px solid #8cb7c759;border-radius:50%;background:#0a1117}
.career-item[open]::before{border-color:#b9e5ee;background:#a7d8e3;box-shadow:0 0 14px #afe0ee32}
.epic-motion .contact-orbit{animation:horizon-turn 35s linear infinite;animation-play-state:paused;transform-origin:center;will-change:transform}
.epic-motion .contact.is-contact-in .contact-orbit{animation-play-state:running}
@keyframes horizon-turn{from{transform:rotate(-15deg) scaleX(.92)}50%{transform:rotate(12deg) scaleX(1)}to{transform:rotate(-15deg) scaleX(.92)}}
.epic-motion .contact::before{transform:translate3d(calc(var(--contact-shift,0)*-10px),0,0) scale(1.035);transition:none}
.epic-motion .work-item[open] .work-body,.epic-motion .career-item[open] .career-body{animation:case-arrival .7s var(--motion-curve) both}
@keyframes case-arrival{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.motion-off .motion-heading .word-inner{transform:none!important;filter:none!important;opacity:1!important;animation:none!important}
.motion-off .title-initial,.motion-off .title-rest{transform:none!important;filter:none!important;opacity:1!important;animation:none!important}
.motion-off .archive-scene-stage{clip-path:none!important}
.motion-off .hero-portrait>a,.motion-off .hero-portrait::before,.motion-off .contact-orbit{animation:none!important}
.motion-off .career-list::after{transform:scaleY(1)}
@media(min-width:1600px){.epic-motion .archive-scene-stage{padding-left:max(var(--pad),calc((100vw - 1400px)/2));padding-right:max(var(--pad),calc((100vw - 1400px)/2))}}
@media(max-width:1050px){.epic-motion .archive-scene-copy h2{font-size:90px}.epic-motion .archive-scene-stage{padding-bottom:125px}.orbit-graphic{max-width:520px}}
@media(max-width:760px){
  .motion-heading,.film-panel .motion-heading{--word-step:125ms;--word-duration:850ms;--word-lead:60ms}
  .hero .motion-heading{--word-step:250ms;--word-duration:1050ms;--word-lead:100ms}
  .epic-motion .archive-scene{height:155svh}
  .epic-motion .archive-scene-stage{padding:157px var(--pad) 117px}
  .epic-motion .archive-scene-top{top:105px}
  .epic-motion .archive-scene-copy h2{font-size:clamp(59px,12.6vw,90px)}
  .epic-motion .archive-scene-copy{transform:translate3d(0,calc(var(--archive-progress,0)*-24px),0)}
  .epic-motion .archive-scene-photo{object-position:51% 45%;transform:scale(calc(1.025 + var(--archive-progress,0)*.065))}
  .hero-portrait>a{animation-delay:.25s!important}
  .orbit-graphic{width:100%;max-width:390px;aspect-ratio:1.06}
  .map-caption{font-size:7px;letter-spacing:.11em}.map-caption span{font-size:6px}
  .career-list::before,.career-list::after{left:-13px}.career-item::before{left:-16px;top:47px}
}
@media(max-height:600px) and (min-width:761px){.epic-motion .archive-scene-stage{padding-top:90px;padding-bottom:100px}.epic-motion .archive-scene-copy h2{font-size:70px}.archive-scene-copy>p:last-child{font-size:10px;margin-top:15px}.archive-scene-copy>.eyebrow{margin-bottom:16px}}
@media(prefers-reduced-motion:reduce){.motion-heading .word-inner{opacity:1!important;transform:none!important;filter:none!important;animation:none!important}.hero-portrait>a,.hero-portrait::before{animation:none!important}.career-list::after{transform:scaleY(1)}.archive-figure>a::after{display:none}.contact-orbit{animation:none!important}}
@media print{#systems-canvas{display:none}.motion-heading .word-inner{opacity:1!important;transform:none!important;filter:none!important;animation:none!important}.career-list::before,.career-list::after,.career-item::before{display:none}.archive-scene-stage{display:contents!important}.epic-motion .archive-scene{height:auto!important}}
@media(prefers-reduced-motion:reduce){.title-initial,.title-rest{opacity:1!important;transform:none!important;filter:none!important;animation:none!important}}
@media print{.title-initial,.title-rest{opacity:1!important;transform:none!important;filter:none!important;animation:none!important}}