
/* Motion original: 14s, apresentação / scroll / branco / assinatura. */
.aprova-cover,.project:first-child .aprova-cover{height:520px;background:#f4f6fa;border-color:#ddd;perspective:none}
.aprova-motion{display:block;position:absolute;inset:0;overflow:hidden;background:#f4f6fa;color:#000c29;font-family:'Segoe UI',sans-serif}
.aprova-motion span{max-width:none;font-family:inherit}
.showcase-scene{display:block;position:absolute;inset:0;overflow:hidden;background:#eef2f6;animation:scene-fade 14s ease both infinite}
.showcase-scroll{display:block!important;position:absolute;top:0;left:0;width:100%;animation:showcase-scroll 14s cubic-bezier(.35,0,.25,1) infinite;will-change:transform}
.showcase-scroll img{display:block;width:100%;height:auto}
.motion-outro{position:absolute;inset:0;background:#fff;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;animation:outro-fade 14s ease infinite;opacity:0}
.motion-outro img{display:block;width:55%;max-width:280px;height:auto;animation:brand-arrive 14s cubic-bezier(.22,1,.36,1) infinite}
.motion-outro>span{font-size:clamp(15px,1.6vw,22px)!important;font-weight:400;letter-spacing:-.4px;color:#000c29!important;animation:caption-arrive 14s ease infinite}
.motion-progress{position:absolute;bottom:0;left:0;height:2px;width:100%;transform-origin:left;background:#1b229f;z-index:4;animation:motion-progress 14s linear infinite}
.aprova-project .project-meta{position:relative;inset:auto;padding:22px 4px 2px;background:none;border-radius:0;pointer-events:none}
.aprova-project .project-meta h3{font-family:'Segoe UI',sans-serif}
.aprova-project{box-shadow:none!important}.aprova-project:hover .cover{border-color:#a3afd0}
.aprova-project .project-expand{z-index:5;background:#ffffffd9;border:1px solid #0001;right:16px;top:16px;color:#000c29!important}
.motion-toggle{position:absolute;right:17px;top:465px;z-index:6;width:36px;height:36px;border-radius:50%;background:#fff9;border:1px solid #0002;color:#000c29;font:16px sans-serif;backdrop-filter:blur(5px)}
.motion-paused .aprova-motion *,.motion-offscreen .aprova-motion *{animation-play-state:paused!important}
@keyframes scene-fade{0%,53%{opacity:1}64%,94%{opacity:0}100%{opacity:1}}
@keyframes outro-fade{0%,56%{opacity:0;visibility:hidden}66%,91%{opacity:1;visibility:visible}99%,100%{opacity:0;visibility:hidden}}
@keyframes brand-arrive{0%,60%{transform:translateY(14px) scale(.97);opacity:0}72%,94%{transform:none;opacity:1}100%{opacity:0}}
@keyframes caption-arrive{0%,67%{transform:translateY(8px);opacity:0}77%,94%{transform:none;opacity:1}100%{opacity:0}}
@keyframes motion-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}

@media(max-width:700px){.aprova-cover,.project:first-child .aprova-cover{height:auto;aspect-ratio:1}.motion-toggle{top:auto;bottom:82px}.pending-cover{height:300px}.motion-outro>span{font-size:18px!important}}
.aprova-motion,.aprova-motion span{font-family:'Segoe UI',sans-serif!important;text-align:left;max-width:none!important}.motion-outro>span{text-align:center}
.showcase-scroll{width:100%;left:0;animation:showcase-scroll 22s linear infinite}
.showcase-scroll img{width:100%;max-width:none;height:auto;margin:0;border-radius:0}
.showcase-dark{position:absolute;inset:0;animation:theme-reveal 22s ease infinite;opacity:0}
.aprova-motion *{animation-duration:22s}
@keyframes showcase-scroll{0%,7%{transform:translateY(0)}14%{transform:translateY(-3%)}62%,96%{transform:translateY(-28%)}100%{transform:translateY(0)}}
@keyframes theme-reveal{0%,30%{opacity:0}37%,96%{opacity:1}100%{opacity:0}}
@keyframes scene-fade{0%,63%{opacity:1}70%,96%{opacity:0}100%{opacity:1}}
@keyframes outro-fade{0%,64%{opacity:0;visibility:hidden}72%,94%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}
@keyframes brand-arrive{0%,68%{transform:translateY(14px) scale(.97);opacity:0}76%,95%{transform:none;opacity:1}100%{opacity:0}}
@keyframes caption-arrive{0%,73%{transform:translateY(8px);opacity:0}81%,95%{transform:none;opacity:1}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.aprova-motion *{animation:none!important}.showcase-dark,.motion-outro,.motion-toggle,.motion-progress{display:none}}

/* Three full-width page strips move in alternating directions. */
.showcase-columns{position:absolute;inset:0;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:0 12px}
.showcase-column{display:block!important;min-width:0;align-self:start;animation:column-up 14s linear infinite;will-change:transform;box-shadow:0 0 0 1px #0b173410}
.showcase-column img{display:block;width:100%;height:auto;max-width:none;border-radius:0}
.column-1{animation-name:column-down}.column-2{animation-name:column-up-offset}
.aprova-motion *{animation-duration:14s}
@keyframes column-up{0%{transform:translateY(0)}65%,96%{transform:translateY(-48%)}100%{transform:translateY(0)}}
@keyframes column-down{0%{transform:translateY(-48%)}65%,96%{transform:translateY(0)}100%{transform:translateY(-48%)}}
@keyframes column-up-offset{0%{transform:translateY(-12%)}65%,96%{transform:translateY(-60%)}100%{transform:translateY(-12%)}}
@media(prefers-reduced-motion:reduce){.showcase-column{animation:none!important}.column-1{transform:translateY(-15%)}.column-2{transform:translateY(-30%)}}
