/* The finale only animates transforms and opacity; no canvas, video or particle loop. */
.sync-symbols{--sync-gap:clamp(18px,4vw,60px);gap:var(--sync-gap)}
.sync-symbol{--merge-x:0px}
.sync-symbol:first-child{--merge-x:calc(100% + var(--sync-gap))}
.sync-symbol:last-child{--merge-x:calc(-100% - var(--sync-gap))}
.sync-finale{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2;opacity:0}
.sync-glow{position:absolute;inset:5% 12%;background:radial-gradient(ellipse,#ff692b38,transparent 66%);opacity:0;transform:scale(.5)}
.sync-flare{position:absolute;left:5%;right:5%;top:50%;height:2px;background:linear-gradient(90deg,transparent,#ff592f,#fff6d9,#ff592f,transparent);box-shadow:0 0 16px 3px #ff713c70;opacity:0;transform:scaleX(.04)}
.sync-ring{position:absolute;left:50%;top:50%;width:270px;height:270px;border-radius:50%;border:1px solid #ff8953a6;opacity:0;transform:translate(-50%,-50%) scale(.15)}
.sync-ring-two{width:350px;height:350px;border-color:#fff1c951}
.sync-rays{position:absolute;left:50%;top:50%}
.sync-rays i{position:absolute;width:3px;height:3px;background:#ffd0a0;border-radius:50%;opacity:0;transform:rotate(calc(var(--ray)*45deg)) translateX(20px)}
.sync-logo{position:absolute;inset:72px 50px 82px;z-index:3;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;pointer-events:none;opacity:0;visibility:hidden;transform:translateY(12px) scale(.88)}
.sync-logo-overline{font-size:10px;letter-spacing:.22em;color:#d9b49c;line-height:1.7;text-align:center}
.sync-logo-art{position:relative;display:grid;place-items:center;max-width:100%;overflow:hidden;padding:8px 28px 14px}
.sync-logo-art>img{width:auto;max-width:min(340px,100%);height:auto;max-height:170px;object-fit:contain}
.sync-logo-art [hidden]{display:none!important}
.sync-logo-default{display:flex;flex-direction:column;align-items:center;color:#fff5de}
.sync-logo-number{font-family:var(--display);font-size:170px;line-height:.8;letter-spacing:-.035em;font-weight:700;position:relative;padding-right:9px}
.sync-logo-number>span{position:absolute;right:-24px;top:1px;color:var(--sync-orange)}
.sync-logo-number svg{width:27px;height:27px}
.sync-logo-club{font-size:17px;letter-spacing:.36em;padding-left:.36em;margin-top:20px;font-weight:600}
.sync-logo-tagline{font-size:10px;letter-spacing:.3em;color:#b2b3a4}
.sync-logo-sheen{position:absolute;inset:-20%;background:linear-gradient(112deg,transparent 40%,#fff3cf38 50%,transparent 60%);opacity:0;transform:translateX(-100%)}
#ritim[data-state=complete] .sync-symbols{animation:none!important}
#ritim[data-state=complete] .sync-symbol{opacity:0}
#ritim[data-state=complete] .sync-ghost,#ritim[data-state=complete] .sync-symbol-index{visibility:hidden}
#ritim[data-state=complete] .sync-burst{animation:none!important;opacity:0}
#ritim[data-state=complete] .sync-finale{opacity:1}
#ritim[data-state=complete] .sync-glow{opacity:1;transform:scale(1)}
#ritim[data-state=complete] .sync-logo{opacity:1;visibility:visible;transform:none}
#ritim[data-state=complete] .sync-center-cue,#ritim[data-state=complete] .sync-input-hint{opacity:0}
#ritim[data-state=complete] .sync-target-line{opacity:.25}
#ritim[data-state=complete] .sync-halo{opacity:.4}
#ritim[data-state=complete] .sync-light{opacity:.35}
#ritim .sync-moving{will-change:auto}
#ritim[data-state=active][data-motion=full] .sync-moving{will-change:transform}
#ritim[data-motion=full][data-state=complete] .sync-symbol{animation:sync-gather .9s cubic-bezier(.65,0,.2,1) both!important}
#ritim[data-motion=full][data-state=complete] .sync-glow{animation:sync-afterglow 2.1s ease-out both!important}
#ritim[data-motion=full][data-state=complete] .sync-flare{animation:sync-flare-open 1.6s .36s cubic-bezier(.16,1,.3,1) both!important}
#ritim[data-motion=full][data-state=complete] .sync-ring-one{animation:sync-ring-open 1.6s .42s cubic-bezier(.16,1,.3,1) both!important}
#ritim[data-motion=full][data-state=complete] .sync-ring-two{animation:sync-ring-open 1.8s .6s cubic-bezier(.16,1,.3,1) both!important}
#ritim[data-motion=full][data-state=complete] .sync-rays i{animation:sync-spark-out 1.25s .55s cubic-bezier(.16,1,.3,1) both!important}
#ritim[data-motion=full][data-state=complete] .sync-logo{animation:sync-logo-arrive 1.35s .65s cubic-bezier(.16,1,.3,1) both!important}
#ritim[data-motion=full][data-state=complete] .sync-logo-sheen{animation:sync-logo-sheen 1.1s 1.1s ease-out both!important}
#ritim:not(.is-in-view) *,body.page-is-hidden #ritim *{animation-play-state:paused!important}
@keyframes sync-gather{0%,12%{opacity:1;transform:translateX(0) scale(1)}65%{opacity:1;transform:translateX(var(--merge-x)) scale(.6)}100%{opacity:0;transform:translateX(var(--merge-x)) scale(.12)}}
@keyframes sync-afterglow{0%{opacity:0;transform:scale(.3)}40%{opacity:1;transform:scale(1.12)}100%{opacity:1;transform:scale(1)}}
@keyframes sync-flare-open{0%{opacity:0;transform:scaleX(.04)}20%{opacity:1}65%{opacity:.65;transform:scaleX(1)}100%{opacity:0;transform:scaleX(1)}}
@keyframes sync-ring-open{0%{opacity:0;transform:translate(-50%,-50%) scale(.15)}18%{opacity:.9}100%{opacity:0;transform:translate(-50%,-50%) scale(2.15)}}
@keyframes sync-spark-out{0%{opacity:0;transform:rotate(calc(var(--ray)*45deg)) translateX(20px) scale(.5)}20%{opacity:1}100%{opacity:0;transform:rotate(calc(var(--ray)*45deg)) translateX(190px) scale(.3)}}
@keyframes sync-logo-arrive{0%{opacity:0;transform:translateY(12px) scale(.65)}60%{opacity:1;transform:translateY(0) scale(1.025)}100%{opacity:1;transform:none}}
@keyframes sync-logo-sheen{0%{opacity:0;transform:translateX(-100%)}30%{opacity:.75}100%{opacity:0;transform:translateX(100%)}}
@media(max-width:1100px){.sync-symbols{--sync-gap:35px}.sync-logo{inset:65px 35px 75px;gap:16px}.sync-logo-number{font-size:155px}}
@media(max-width:850px){.sync-symbols{--sync-gap:25px}.sync-logo-number{font-size:145px}}
@media(max-width:650px){
  .sync-symbols{--sync-gap:9px}
  .sync-logo{inset:62px 15px 78px;gap:16px}
  .sync-logo-overline{font-size:8px;letter-spacing:.12em}
  .sync-logo-art{padding:6px 24px 10px}
  .sync-logo-art>img{max-width:100%;max-height:125px}
  .sync-logo-number{font-size:124px}
  .sync-logo-number>span{right:-19px}.sync-logo-number svg{width:20px;height:20px}
  .sync-logo-club{font-size:13px;margin-top:15px}
  .sync-logo-tagline{font-size:9px}
  .sync-ring{width:170px;height:170px}.sync-ring-two{width:220px;height:220px}
  .sync-rays i:nth-child(even){display:none}
  #ritim .sync-moving,#ritim .sync-moving>svg{filter:none}
  #ritim .sync-symbol-trail{display:none}
  #ritim .sync-depth-grid{animation:none!important}
  #ritim .sync-light{box-shadow:none}
  .sync-glow{inset:12% 0}
}
@media(max-width:360px){.sync-symbols{--sync-gap:8px}.sync-logo-number{font-size:112px}.sync-logo-overline{font-size:7px}}
