/* Raster animation sequences: eight detailed poses, composited with short dissolves. */
.catalog-stage{position:relative;max-width:1180px;margin-inline:auto}
.catalog-scenes,.catalog-motion-toggle{display:none}
@media(min-width:1536px){
  .catalog-scenes{display:block;position:absolute;inset:0;pointer-events:none;z-index:0}
  .catalog-scene-group{position:absolute;left:0;right:0;height:380px;pointer-events:none}
  .catalog-scene-group[hidden]{display:none}
  .catalog-scene-group--battle{top:24px}
  .catalog-scene-group--football{top:784px}
  .catalog-scene-group--blocks{top:1544px}
  .catalog-scene{position:absolute;top:0;width:clamp(138px,calc((100vw - 1180px)/2 - 40px),250px);overflow:clip;contain:paint}
  .catalog-scene--left{right:calc(100% + 24px)}
  .catalog-scene--right{left:calc(100% + 24px)}
  .catalog-scene-caption{display:flex;align-items:center;justify-content:center;gap:7px;min-height:32px;color:#777176;font-size:9px;font-weight:700;letter-spacing:1.4px;white-space:nowrap}
  .catalog-scene-caption>span{width:5px;height:5px;background:#d52134;border-radius:50%}
  .catalog-motion-toggle{display:block;position:absolute;right:0;top:-34px;padding:4px 8px;color:#777078;font-size:11px;border:1px solid #e9e4e6;border-radius:20px;background:#fff;z-index:1}
  .catalog-motion-toggle:hover{color:#c80020;border-color:#e3abb3}
  .catalog-motion-toggle[hidden]{display:none}
  .catalog-scene-group--battle.is-loaded .cs-frame{background-image:url('/assets/scenes/battle-v2.webp')}
  .catalog-scene-group--football.is-loaded .cs-frame{background-image:url('/assets/scenes/football-v2.webp')}
  .catalog-scene-group--blocks.is-loaded .cs-frame{background-image:url('/assets/scenes/blocks-v2.webp')}
}
.catalog-vignette{position:relative;isolation:isolate;aspect-ratio:3/4}
.catalog-film{position:absolute;inset:0;z-index:1;clip-path:inset(2%);transform:translate3d(0,0,0);animation:cs-cinematic-drift 6s ease-in-out infinite}
.cs-frame{position:absolute;inset:0;opacity:0;background-size:400% 200%;background-repeat:no-repeat;animation-duration:4s;animation-timing-function:linear;animation-iteration-count:infinite}
.cs-frame:first-child{opacity:1}
.cs-ground-glow{position:absolute;inset:auto 15% 5%;height:8%;background:radial-gradient(ellipse,rgba(171,20,35,.15),transparent 70%);z-index:0}
.catalog-scene--battle .catalog-vignette{animation:cs-battle-left 12s ease-in-out infinite}
.catalog-scene--battle.catalog-scene--right .catalog-vignette{animation-name:cs-battle-right}
.catalog-scene--battle.catalog-scene--right .catalog-film{scale:-1 1}
.catalog-scene--football .cs-frame{animation-duration:5s}
.catalog-scene--football.catalog-scene--right .cs-frame{animation-delay:-2.5s}
.catalog-scene--blocks .cs-frame{animation-duration:4.5s}
.catalog-scene--blocks.catalog-scene--right .cs-frame{animation-delay:-2.25s}
@keyframes cs-cinematic-drift{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(0,-3px,0) scale(1.018)}}
@keyframes cs-battle-left{0%,40%{opacity:1;transform:translate3d(0,0,0)}48%,94%{opacity:0;transform:translate3d(28px,0,0)}95%{opacity:0;transform:translate3d(-28px,0,0)}100%{opacity:1;transform:translate3d(0,0,0)}}
@keyframes cs-battle-right{0%,44%{opacity:0;transform:translate3d(-28px,0,0)}52%,90%{opacity:1;transform:translate3d(0,0,0)}98%,100%{opacity:0;transform:translate3d(28px,0,0)}}
.catalog-scene-group:not(.is-in-view) *, .catalog-scenes.is-paused *{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){
  .catalog-scenes.is-paused .catalog-film,.catalog-scenes.is-paused .catalog-vignette,.catalog-scenes.is-paused .cs-frame{animation:none!important}
  .catalog-scenes.is-paused .cs-frame{opacity:0}
  .catalog-scenes.is-paused .cs-frame:first-child{opacity:1}
}
.cs-frame:nth-child(1){background-position:0% 0%;animation-name:cs-pose-0}
@keyframes cs-pose-0{0%,26%{opacity:1}27.2%,88%{opacity:0}89.2%,100%{opacity:1}}
.cs-frame:nth-child(2){background-position:33.333333333333336% 0%;animation-name:cs-pose-1}
@keyframes cs-pose-1{0%,26%{opacity:0}27.2%,32%{opacity:1}33.2%,100%{opacity:0}}
.cs-frame:nth-child(3){background-position:66.66666666666667% 0%;animation-name:cs-pose-2}
@keyframes cs-pose-2{0%,32%{opacity:0}33.2%,38%{opacity:1}39.2%,100%{opacity:0}}
.cs-frame:nth-child(4){background-position:100% 0%;animation-name:cs-pose-3}
@keyframes cs-pose-3{0%,38%{opacity:0}39.2%,44%{opacity:1}45.2%,100%{opacity:0}}
.cs-frame:nth-child(5){background-position:0% 100%;animation-name:cs-pose-4}
@keyframes cs-pose-4{0%,44%{opacity:0}45.2%,51%{opacity:1}52.2%,100%{opacity:0}}
.cs-frame:nth-child(6){background-position:33.333333333333336% 100%;animation-name:cs-pose-5}
@keyframes cs-pose-5{0%,51%{opacity:0}52.2%,69%{opacity:1}70.2%,100%{opacity:0}}
.cs-frame:nth-child(7){background-position:66.66666666666667% 100%;animation-name:cs-pose-6}
@keyframes cs-pose-6{0%,69%{opacity:0}70.2%,79%{opacity:1}80.2%,100%{opacity:0}}
.cs-frame:nth-child(8){background-position:100% 100%;animation-name:cs-pose-7}
@keyframes cs-pose-7{0%,79%{opacity:0}80.2%,88%{opacity:1}89.2%,100%{opacity:0}}