/* Vyrsa — shared brand elements. Part of the site (unlike assets/review.*). */

/* Footer sign-off: the scatter idea at its smallest scale.
   Nine parts, nothing discarded — signal at the centre, gold at the last vertex. */
.vy-sign{
  --vy-sign-cell:7px;
  --vy-sign-gap:3px;
  display:grid;
  grid-template-columns:repeat(3,var(--vy-sign-cell));
  grid-template-rows:repeat(3,var(--vy-sign-cell));
  gap:var(--vy-sign-gap);
  width:calc((var(--vy-sign-cell) * 3) + (var(--vy-sign-gap) * 2));
  height:calc((var(--vy-sign-cell) * 3) + (var(--vy-sign-gap) * 2));
  line-height:0;
  flex:0 0 auto;
}
.vy-sign span{
  display:block;width:var(--vy-sign-cell);height:var(--vy-sign-cell);border-radius:1.5px;
  background:currentColor;opacity:.38;transform:none;
}
.vy-sign.in span{animation:none}
.vy-sign span:nth-child(5){background:#12B5C4}
.vy-sign span:nth-child(9){background:#B8912F}
.vy-sign span:nth-child(5),
.vy-sign span:nth-child(9){opacity:1}
@keyframes vySettle{to{opacity:.38;transform:none}}
.vy-sign.in span:nth-child(5),
.vy-sign.in span:nth-child(9){animation-name:vySettleLit}
@keyframes vySettleLit{to{opacity:1;transform:none}}

.vy-sign span:nth-child(1){--dx:-9px;--dy:6px;--dr:20deg}
.vy-sign span:nth-child(2){--dx:6px;--dy:-7px;--dr:-14deg;animation-delay:.05s}
.vy-sign span:nth-child(3){--dx:-5px;--dy:-8px;--dr:10deg;animation-delay:.1s}
.vy-sign span:nth-child(4){--dx:9px;--dy:5px;--dr:-16deg;animation-delay:.15s}
.vy-sign span:nth-child(5){--dx:-10px;--dy:-4px;--dr:12deg;animation-delay:.2s}
.vy-sign span:nth-child(6){--dx:5px;--dy:9px;--dr:-10deg;animation-delay:.25s}
.vy-sign span:nth-child(7){--dx:8px;--dy:-7px;--dr:14deg;animation-delay:.3s}
.vy-sign span:nth-child(8){--dx:-4px;--dy:9px;--dr:-12deg;animation-delay:.35s}
.vy-sign span:nth-child(9){--dx:9px;--dy:7px;--dr:16deg;animation-delay:.4s}

.vy-sign span{opacity:.38!important;transform:none!important;animation:none!important}
.vy-sign span:nth-child(5),
.vy-sign span:nth-child(9){opacity:1!important}

@media(prefers-reduced-motion:reduce){
  .vy-sign span{animation:none!important;opacity:.38;transform:none}
  .vy-sign span:nth-child(5),.vy-sign span:nth-child(9){opacity:1}
}