@view-transition { navigation: none; }

/* The page enters without a blocking overlay, scroll replacement or click delay. */
.motion-on main { animation: page-arrive .48s ease-out both; }
@keyframes page-arrive { from { opacity: .18; } to { opacity: 1; } }
@keyframes hero-reveal { from { opacity: 0; transform: translateY(22px); filter: blur(4px); } to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes orbit-breathe { 0%,100% { transform: scale(.96) rotate(-7deg); opacity: .35; } 50% { transform: scale(1.05) rotate(7deg); opacity: .8; } }
@keyframes moving-sheen { 0%,100% { background-position: 0 50%; } 50% { background-position: 100% 50%; } }
@keyframes motion-spin { to { transform: rotate(360deg); } }
@keyframes panel-enter { from { opacity: .15; filter: blur(3px); } to { opacity: 1; filter: blur(0); } }

.motion-on .hero h1 { animation: hero-reveal .9s .12s both; }
.motion-on .hero-content>.eyebrow { animation: hero-reveal .7s both; }
.motion-on .hero-content>p:not(.eyebrow) { animation: hero-reveal .8s .3s both; }
.motion-on .hero-content>.actions { animation: page-arrive .75s .45s both; }
.motion-on .cinematic-hero h1,.motion-on .portfolio-hero h1,.motion-on .project-hero h1 { animation: hero-reveal .85s .1s both; }
.motion-on .hero-orbit { animation: orbit-breathe 14s ease-in-out infinite; }
.motion-on .word-band { background: linear-gradient(110deg,#754595,#432659,#9763b5,#754595); background-size: 250% 100%; animation: moving-sheen 15s ease-in-out infinite; }
.motion-on .word-band i { display: inline-block; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.motion-on .word-band:hover i { transform: rotate(180deg); }

/* Individual transforms compose with original artwork rotations. */
.motion-on [data-parallax] { translate: var(--parallax-x,0px) var(--parallax-y,0px); }
.parallax-active>[data-parallax] { will-change: translate; }
.parallax-window { overflow: hidden; }
.cinematic-hero,.method-art,.recurring-image,.portrait-art,.manifesto-visual,.service-detail-art { overflow: hidden; }
.motion-on [data-parallax=photo] { scale: 1.14; transform-origin: center; }
.motion-on [data-parallax=hero],.motion-on [data-parallax=cinematic] { scale: 1.15; transform-origin: center; }
.motion-on .founder-photo img { transition: filter .6s; }
.motion-on .founder-photo:hover img { transform: none; }
.motion-on .project-art img,.motion-on .portfolio-hero-collage img { transition: transform .7s cubic-bezier(.2,.65,.2,1); }
.motion-on [data-tilt] { transition: transform .45s cubic-bezier(.2,.65,.2,1); }
.reading-progress { height: 2px; position: absolute; bottom: -1px; left: 0; width: 100%; background: linear-gradient(90deg,#754595,#d7a9f4,#f9f6ef); transform: scaleX(var(--page-progress,0)); transform-origin: left; pointer-events: none; }

.reveal-ready { transition: opacity .8s cubic-bezier(.18,.8,.25,1) var(--reveal-delay,0ms), translate .9s cubic-bezier(.18,.8,.25,1) var(--reveal-delay,0ms); }
.motion-on .reveal-ready:not(.revealed) { opacity: .02; translate: 0 30px; }
.motion-on .revealed { opacity: 1; translate: 0 0; }
.motion-on .project-card.reveal-ready,.motion-on .video-grid figure.reveal-ready,.motion-on .project-gallery-grid figure.reveal-ready { translate: none; }
.motion-on .section-heading h2 em,.motion-on .collection-heading h2 em { position: relative; }
.motion-on .section-heading h2 em:after,.motion-on .collection-heading h2 em:after { content: ''; height: 1px; position: absolute; left: 4%; right: 3%; bottom: .06em; background: currentColor; opacity: .25; transform: scaleX(0); transform-origin: left; transition: transform 1.1s .35s cubic-bezier(.2,.7,.2,1); }
.motion-on .revealed h2 em:after { transform: scaleX(1); }
.motion-on .button { position: relative; overflow: hidden; transition: transform .3s,box-shadow .3s,background .3s; }
.motion-on .button:after { content: ''; position: absolute; inset: -50% auto -50% -70%; width: 38%; background: linear-gradient(90deg,transparent,#ffffff26,transparent); transform: skewX(-20deg); transition: left .7s; pointer-events: none; }
.motion-on .button:hover:after { left: 140%; }
.motion-on .button:hover { box-shadow: 0 13px 24px #2f113625; }
.motion-on .text-link span,.motion-on .header-contact span,.motion-on .project-meta>span,.motion-on .project-next>a b { display: inline-block; transition: transform .4s cubic-bezier(.2,.7,.2,1); }
.motion-on .text-link:hover span,.motion-on .header-contact:hover span,.motion-on .project-card-link:hover .project-meta>span,.motion-on .project-next>a:hover b { transform: translate(5px,-5px); }
.motion-on .round-arrow { transition: background .45s,color .45s,box-shadow .45s; }
.motion-on .round-arrow:hover { box-shadow: 0 0 0 12px #bc90d320; }
.motion-on .project-open { backdrop-filter: blur(10px); }
.motion-on .project-card-link:focus-visible .project-cover { outline: 3px solid #a776c4; outline-offset: 5px; }
.motion-on .portfolio-filters button { transition: background .25s,color .25s,border-color .25s; }
.motion-on .service-panel:not([hidden]),.motion-on dialog[open] { animation: panel-enter .35s ease-out both; }
.motion-on .out-of-view,.motion-on .out-of-view * { animation-play-state: paused!important; }

.motion-toggle { position: fixed; bottom: 18px; right: 18px; z-index: 35; display: flex; align-items: center; gap: 8px; border: 1px solid #bfa2cf; background: #130c1beb; color: #f9f6ef; border-radius: 30px; padding: 10px 15px; min-height: 44px; font: 700 10px Lato; box-shadow: 0 4px 16px #0002; cursor: pointer; backdrop-filter: blur(12px); }
.motion-symbol { width: 12px; height: 12px; border: 1px solid #c6a5d9; border-radius: 50%; display: inline-block; position: relative; }
.motion-symbol:after { content: ''; position: absolute; width: 4px; height: 4px; background: #d6a9f0; top: -2px; left: 3px; border-radius: 50%; }
.motion-on .motion-symbol { animation: motion-spin 4s linear infinite; }
.motion-toggle[aria-pressed=true] .motion-symbol { border-radius: 2px; }
.motion-toggle[aria-pressed=true] .motion-symbol:after { display: none; }
.motion-toggle:disabled { cursor: default; }

.motion-off *,.motion-off *:before,.motion-off *:after { animation: none!important; transition: none!important; scroll-behavior: auto!important; }
.motion-off .reveal-ready { opacity: 1!important; translate: none!important; }
.motion-off [data-parallax] { translate: none!important; scale: none!important; }
.motion-off [data-tilt] { transform: none!important; }
@media(max-width:600px) {
  .motion-toggle { bottom: 12px; right: 12px; padding: 8px 11px; font-size: 9px; }
  .motion-on [data-parallax=photo] { scale: 1.07; }
  .motion-on [data-parallax=hero],.motion-on [data-parallax=cinematic] { scale: 1.08; }
  .reveal-ready { transition-duration: .6s; transition-delay: 0ms; }
  .motion-on .reveal-ready:not(.revealed) { translate: 0 16px; }
  .motion-on .project-card.reveal-ready,.motion-on .video-grid figure.reveal-ready,.motion-on .project-gallery-grid figure.reveal-ready { translate: none; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto!important; }
  *,*:before,*:after { animation: none!important; transition: none!important; }
  .reveal-ready { opacity: 1!important; translate: none!important; }
  [data-parallax] { translate: none!important; scale: none!important; }
}