/* Acabamento de movimento: mantém a composição e respeita a pausa global. */
.js-motion .hero-copy>.eyebrow{animation:copy-arrive .6s .05s both}
.js-motion .hero-copy>h1{animation:copy-arrive .75s .12s both}
.js-motion .hero-description{animation:copy-arrive .7s .2s both}
.js-motion .hero-actions{animation:copy-arrive .7s .28s both}
.js-motion .proof{animation:copy-arrive .7s .36s both}
@keyframes copy-arrive{from{opacity:0;translate:0 11px}to{opacity:1;translate:0 0}}
.js-motion .hero[data-stage='2'] .finished-picture{animation:cap-breathe 7s ease-in-out infinite}
@keyframes cap-breathe{0%,100%{translate:0 0;rotate:0deg}50%{translate:0 -6px;rotate:.65deg}}
.js-motion .swatch{animation:swatch-drift 6.5s ease-in-out infinite}
.js-motion .swatch-orange{animation-delay:-2s}
.js-motion .swatch-leather{animation-delay:-4s}
@keyframes swatch-drift{0%,100%{translate:0 0}50%{translate:2px -5px}}
.js-motion .hero.motion-idle .finished-picture,.js-motion .hero.motion-idle .swatch,.js-motion .hero.motion-idle .stitch path{animation-play-state:paused}
.hero[data-stage='1'] .finished-picture:after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,transparent 39%,#fff7 50%,transparent 61%);mix-blend-mode:soft-light;pointer-events:none;animation:material-light 1.4s ease-out both}
@keyframes material-light{from{translate:-65% 0;opacity:0}30%{opacity:.65}to{translate:65% 0;opacity:0}}
.studio-stages:after{content:'';position:absolute;left:0;top:-10px;height:1px;width:var(--stage-progress,100%);background:linear-gradient(90deg,#ff690510,#ed6406aa);transition:width 1.1s cubic-bezier(.22,.61,.36,1)}
.studio-stages button{font-size:12px;transition:color .25s,translate .25s}
.studio-stages button:hover{color:#b94d0c;translate:0 -2px}
.motion-controls #motion span{display:inline}
.motion-controls button{font-size:11px}
.studio-stages button[aria-pressed=true]>span{display:grid;place-items:center;min-width:20px;height:20px;border-radius:50%;background:#fc650c12}
.button{position:relative;overflow:hidden;isolation:isolate;transition:transform .25s,box-shadow .25s,background .25s}
.button:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 20%,#ffffff24 50%,transparent 80%);translate:-130% 0;transition:translate .65s ease}
.button:hover:after,.button:focus-visible:after{translate:130% 0}
.button>span:not(.wa-icon){transition:translate .25s}
.button:hover>span:not(.wa-icon){translate:3px 0}
.button:active{transform:translateY(0) scale(.99)}
.model-art img,.approved-model-art{transition:transform .5s cubic-bezier(.22,.61,.36,1)}
.model-card:hover .model-art img,.model-card:hover .approved-model-art,.model-card:focus-visible .approved-model-art{transform:translateY(-2px) rotate(-3deg) scale(1.025)}
.model-card{border:1px solid transparent;transition:border-color .3s,transform .3s,box-shadow .3s}
.model-card:hover,.model-card:focus-visible{border-color:#edbe9e}
.feature{transition:transform .4s cubic-bezier(.22,.61,.36,1),box-shadow .4s,border-color .4s;transform-style:preserve-3d}
.feature .panel-art,.feature .process-art{transition:scale .65s cubic-bezier(.22,.61,.36,1),opacity .4s}
.feature h2:before{transition:width .4s}
.feature:hover h2:before,.feature:focus-within h2:before{width:40px}
.feature:hover .panel-art,.feature:hover .process-art{scale:1.035}
.feature:hover,.feature:focus-within{border-color:#d5bda5;box-shadow:0 10px 24px #152b3e0c}
.feature-link{font-size:12px;transition:color .2s,translate .3s}
.feature-link:hover{translate:3px 0}
.video-link .play{transition:box-shadow .3s,background .3s,scale .3s}
.video-link:hover .play{box-shadow:0 0 0 5px #f16b0b0d;background:#fff8;scale:1.06}
dialog{border-top:3px solid #f36a14;box-shadow:0 30px 100px #041d3b40}
.js-motion dialog[open]{animation:dialog-arrive .32s cubic-bezier(.2,.75,.25,1) both}
.js-motion dialog[open]::backdrop{animation:backdrop-arrive .3s ease both}
@keyframes dialog-arrive{from{opacity:0;translate:0 16px;scale:.985}to{opacity:1;translate:0 0;scale:1}}
@keyframes backdrop-arrive{from{opacity:0}to{opacity:1}}
.close{font-size:25px;transition:background .25s,rotate .3s}
.close:hover{rotate:90deg}
.dialog-product img{transition:scale .6s}
.dialog-product:hover img{scale:1.04}
.quote input,.quote textarea,.quote select{transition:border-color .2s,box-shadow .2s}
.quote input:focus,.quote textarea:focus,.quote select:focus{border-color:#e78e54;box-shadow:0 0 0 3px #ef96501a}
.js-motion .quote-result:not([hidden]){animation:copy-arrive .35s ease both}
.js-motion .faq details[open]>p{animation:copy-arrive .3s ease both}
footer{font-size:10px}
footer nav a,footer nav button{font-size:10px}
.footer-tagline{font-size:10px}
@media(hover:hover) and (pointer:fine){.js-motion .feature.visible:hover{transform:perspective(900px) translateY(-3px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg))}}
@media(max-width:900px){.studio-stages:after{top:-5px}.studio-stages button{font-size:10px}.feature-link{font-size:11px}footer nav a,footer nav button{font-size:11px}}
@media(prefers-reduced-motion:reduce){body:not(.js-motion) *,body:not(.js-motion) *:before,body:not(.js-motion) *:after{animation:none!important;transition:none!important}body:not(.js-motion) .finished-picture,body:not(.js-motion) .swatch{translate:none!important;rotate:none!important}}
.no-motion *,.no-motion *:before,.no-motion *:after{animation:none!important;transition:none!important}
.no-motion .finished-picture,.no-motion .swatch{translate:none!important;rotate:none!important}
.no-motion .feature:hover{transform:none!important}
