/* Motion has one owner (motion.js); the hero image is deliberately excluded. */
.nav a::after,.button,.button>span,.creative-invite b,.service-card,.service-card::after,.review-card,.work-mark,summary span{transition:transform .35s cubic-bezier(.2,.7,.2,1),background .35s,box-shadow .35s}
.nav a:hover::after{transform:scaleX(1)}
.button{transform:translate(var(--magnet-x,0px),var(--magnet-y,0px))}
.button:hover{box-shadow:0 9px 30px #9aca1729}.button:hover>span{transform:translate(3px,-3px)}
.creative-card{transform:scale(var(--stack-scale,1));filter:brightness(var(--stack-light,1));will-change:auto}
.creative-image{transform:perspective(1200px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .25s ease-out}
.creative-image img{transform:scale(var(--image-scale,1));transition:transform .2s linear}
.creative-card:hover .creative-invite b,.creative-card:focus-visible .creative-invite b{transform:rotate(45deg);background:#3d5226}
.service-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px #26380012}.service-card:hover::after{transform:rotateY(180deg)}
.service-card::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(260px circle at var(--pointer-x,50%) var(--pointer-y,50%),#fff9,transparent 75%);opacity:0;transition:opacity .3s}.service-card:hover::before{opacity:.7}.service-card>*{position:relative;z-index:1}
.work-row::before{content:"";position:absolute;inset:0 -14px;background:#e5ebd9;z-index:-1;transform:scaleY(0);transform-origin:bottom;transition:transform .4s cubic-bezier(.2,.7,.2,1)}.work-row:hover::before{transform:scaleY(1)}.work-row:hover .work-mark{transform:rotate(90deg)}
.review-card:hover{transform:translateY(-6px);box-shadow:0 16px 35px #26380012}
.process-grid strong{transition:background .4s,color .4s,transform .4s}.process-grid .step-active strong{background:var(--ink);color:var(--accent);transform:rotate(-8deg)}
.motion-ready .process-line span{transform:scaleX(var(--process-progress,0))}
.motion-ready .hero-star,.motion-ready .kinetic-symbol{animation:turn 24s linear infinite}
.motion-ready .cube{animation:cube-turn 15s linear infinite}
.motion-ready .floating-label{animation:float-label 6s ease-in-out infinite}.motion-ready .label-creative{animation-delay:-2s}
.motion-ready .scroll-cue>span:last-child{animation:scroll-cue 2s ease-in-out infinite}
.motion-ready .kinetic-track{transform:translateX(var(--ribbon-x,0px)) skewX(var(--ribbon-skew,0deg));transition:transform .25s ease-out}
.motion-ready .contact-symbol{transform:translateY(var(--contact-y,0px)) rotate(var(--contact-rotate,0deg));transition:transform .25s ease-out}
@keyframes turn{to{transform:rotate(360deg)}}
@keyframes cube-turn{from{transform:rotateX(-20deg) rotateY(30deg) rotateZ(10deg)}to{transform:rotateX(340deg) rotateY(390deg) rotateZ(10deg)}}
@keyframes float-label{0%,100%{translate:0 0}50%{translate:0 -14px}}
@keyframes scroll-cue{0%,100%{transform:translateY(-4px)}50%{transform:translateY(5px)}}
@media(max-width:620px){.motion-ready .process-line span{transform:scaleY(var(--process-progress,0))}}
html.motion-paused{scroll-behavior:auto}
html.motion-paused *,html.motion-paused *::before,html.motion-paused *::after{animation-play-state:paused!important;transition:none!important}
html.motion-paused :is(.creative-card,.creative-image,.creative-image img,.button,.contact-symbol,.kinetic-track){transform:none;filter:none}
html.motion-paused .process-line span{transform:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.creative-card,.creative-image,.creative-image img,.button,.contact-symbol,.kinetic-track{transform:none!important;filter:none!important}.process-line span{transform:none!important}.motion-toggle{display:none}}
.motion-word{display:inline-block}
/* Preserve the headline's original emphasis when words are wrapped in spans. */
.creative h2>.motion-word{color:inherit}
.contact h2>.motion-word{color:inherit}
/* Keyboard focus must stay visible even when portfolio cards overlap. */
.creative-panel:focus-within{z-index:3}
.creative-panel:focus-within .creative-card{transform:none;filter:none}
.motion-word{max-width:100%}
/* Signals around the actions move; essential copy stays still and readable. */
.motion-ready .hero-actions .button-dark>span{animation:action-arrow 3s ease-in-out infinite}
.motion-ready .service-card::after{animation:service-nod 7s ease-in-out infinite}
.motion-ready .service-card:nth-child(2)::after{animation-delay:-2s}
.motion-ready .service-card:nth-child(3)::after{animation-delay:-4s}
.request-intents label{transition:background .25s,border-color .25s,box-shadow .25s}
.request-submit::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:0 0 0 0 #9aca1733}
.motion-ready .request-submit::after{animation:request-ring 4s ease-out infinite}
.request-submit{transform:none!important}
.creative-card{transform:none;filter:none}
@keyframes action-arrow{0%,65%,100%{translate:0 0}78%{translate:4px -4px}88%{translate:0 0}}
@keyframes service-nod{0%,100%{rotate:-7deg}50%{rotate:7deg}}
@keyframes request-ring{0%,60%,100%{box-shadow:0 0 0 0 #9aca1700}70%{box-shadow:0 0 0 2px #9aca1740}90%{box-shadow:0 0 0 8px #9aca1700}}
@media(prefers-reduced-motion:reduce){.motion-ready .hero-actions .button-dark>span,.motion-ready .service-card::after,.motion-ready .request-submit::after{animation:none!important}}