/* Content stays visible without JavaScript. Only observed elements receive a pending state. */
.motion-reveal{opacity:0;transform:translateY(20px);transition:opacity 700ms cubic-bezier(.22,.61,.36,1) var(--motion-delay,0ms),transform 700ms cubic-bezier(.22,.61,.36,1) var(--motion-delay,0ms),translate 300ms ease,box-shadow 300ms ease}
.motion-reveal.motion-visible{opacity:1;transform:none}

.button{position:relative;overflow:hidden;isolation:isolate;transition:transform 220ms ease,filter 220ms ease,box-shadow 220ms ease}
.button::after{content:"";position:absolute;z-index:2;pointer-events:none;top:-70%;bottom:-70%;left:-65%;width:34%;background:linear-gradient(90deg,transparent,#ffffff80,transparent);transform:translateX(0) rotate(19deg);opacity:0}
.button:is(:hover,:focus-visible){transform:translateY(-3px);box-shadow:0 7px 18px #001a1429}
.button:is(:hover,:focus-visible)::after{animation:collection-button-shine 850ms ease-out both}
.button>.icon{transition:transform 220ms ease}
.button:is(:hover,:focus-visible)>.icon{transform:rotate(-4deg) scale(1.035)}
.legend-sheet{transition:translate 300ms ease,box-shadow 300ms ease}
.legend-sheet.motion-reveal{transition:opacity 700ms cubic-bezier(.22,.61,.36,1) var(--motion-delay,0ms),transform 700ms cubic-bezier(.22,.61,.36,1) var(--motion-delay,0ms),translate 300ms ease,box-shadow 300ms ease}
.legend-sheet:is(:hover,:focus-within){translate:0 -4px;box-shadow:0 18px 45px #0004}
.neymar-picture.motion-visible{animation:collection-gentle-float 8s ease-in-out infinite;animation-delay:calc(var(--motion-delay,0ms) + 700ms)}

.motion-has-ambient{isolation:isolate}
.video-section.motion-has-ambient>.container{position:relative;z-index:1}
.motion-ambient-light{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 17% 18%,#ffe9a134,transparent 39%),radial-gradient(ellipse at 82% 47%,#75d8bc1c,transparent 44%);mix-blend-mode:screen;opacity:.22;animation:collection-ambient-light 10s ease-in-out infinite alternate}

@keyframes collection-button-shine{0%{transform:translateX(0) rotate(19deg);opacity:0}20%{opacity:.65}100%{transform:translateX(520%) rotate(19deg);opacity:0}}
@keyframes collection-gentle-float{0%,100%{translate:0 0}50%{translate:0 -4px}}
@keyframes collection-ambient-light{from{opacity:.18}to{opacity:.38}}

@media(prefers-reduced-motion:reduce){
  .motion-reveal,.motion-reveal.motion-visible{opacity:1!important;transform:none!important;transition:none!important}
  .button,.button>.icon,.legend-sheet,.neymar-picture,.motion-ambient-light{animation:none!important;transition:none!important;translate:none!important}
  .button:is(:hover,:focus-visible),.button:is(:hover,:focus-visible)>.icon{transform:none!important}
  .button::after{display:none!important;animation:none!important}
  .motion-ambient-light{opacity:.18}
}
