/* RightStack animated logo — extracted from rightstack-logo-v2.html. */

@keyframes rs-rise {
  0% { opacity: 0; transform: translateY(28px) scaleY(.5); }
  48% { opacity: 1; transform: translateY(-3px) scaleY(1.12); }
  66% { transform: translateY(1.5px) scaleY(.93); }
  80% { transform: translateY(-.8px) scaleY(1.04); }
  90% { transform: translateY(.3px) scaleY(.99); }
  100% { opacity: 1; transform: translateY(0) scaleY(1); }
}

@keyframes rs-land-flash {
  0% { opacity: .9; transform: scaleX(1) scaleY(1); }
  60% { opacity: 0; transform: scaleX(1.6) scaleY(.2); }
  100% { opacity: 0; }
}

@keyframes rs-stack-complete {
  0% { transform: scaleY(1) scaleX(1); }
  18% { transform: scaleY(1.55) scaleX(.92); }
  38% { transform: scaleY(.78) scaleX(1.08); }
  58% { transform: scaleY(1.14) scaleX(.96); }
  75% { transform: scaleY(.94) scaleX(1.02); }
  100% { transform: scaleY(1) scaleX(1); }
}

@keyframes rs-scan {
  0% { transform: translateX(0); opacity: 0; }
  8%, 92% { opacity: 1; }
  100% { transform: translateX(var(--rs-bar-w, 24px)); opacity: 0; }
}

@keyframes rs-wipe {
  0% { clip-path: inset(0 100% 0 0); opacity: 0; }
  12% { opacity: 1; }
  100% { clip-path: inset(0 0 0 0); opacity: 1; }
}

@keyframes rs-pulse-b {
  0%, 100% { background: #605d5d; }
  40% { background: #8a3020; }
  70% { background: #7d7979; }
}

@keyframes rs-pulse-m {
  0%, 100% { background: #c42000; }
  35% { background: #605d5d; }
  68% { background: #ec3013; }
}

@keyframes rs-pulse-t {
  0%, 100% { background: #ec3013; }
  30%, 85% { background: #ff563c; }
  62% { background: #7d2218; }
}

@keyframes rs-top-pop {
  0%, 60%, 100% { transform: scaleY(1) scaleX(1); }
  75% { transform: scaleY(1.5) scaleX(.93); }
  88% { transform: scaleY(.88) scaleX(1.04); }
}

.rs-logo {
  --rs-bar-w: 24px;
  --rs-bar-h: 5px;
  --rs-bar-gap: 3.5px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #f8f4f4;
  text-decoration: none;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
}

header .rs-logo { margin-right: auto; }

.rs-logo.rs-md { --rs-bar-w: 32px; --rs-bar-h: 6px; --rs-bar-gap: 4px; gap: 16px; }
.rs-logo.rs-lg { --rs-bar-w: 46px; --rs-bar-h: 9px; --rs-bar-gap: 6px; gap: 22px; }
.rs-logo.rs-xl { --rs-bar-w: 66px; --rs-bar-h: 13px; --rs-bar-gap: 8.5px; gap: 30px; }
.rs-logo.rs-compact { --rs-bar-w: 19px; --rs-bar-h: 4px; --rs-bar-gap: 2.5px; gap: 8px; }
.rs-logo.rs-compact .rs-wordmark { font-size: 19px; }
.rs-logo.rs-footer { --rs-bar-w: 20px; --rs-bar-h: 4px; --rs-bar-gap: 3px; gap: 10px; }
.rs-logo.rs-footer .rs-wordmark { font-size: 21px; }
.rs-logo.rs-auth { margin-bottom: 20px; }

.rs-logo .rs-icon {
  position: relative;
  width: var(--rs-bar-w);
  height: auto;
  display: flex;
  flex-direction: column-reverse;
  gap: var(--rs-bar-gap);
  flex-shrink: 0;
}

.rs-logo .rs-bar { position: relative; width: 100%; height: var(--rs-bar-h); opacity: 0; }
.rs-logo .rs-bar-b { background: #605d5d; transform-origin: center bottom; }
.rs-logo .rs-bar-m { background: #c42000; transform-origin: center bottom; }
.rs-logo .rs-bar-t { background: #ec3013; transform-origin: center; }

.rs-logo .rs-bar-b::after,
.rs-logo .rs-bar-m::after,
.rs-logo .rs-bar-t::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -3px;
  left: 0;
  height: 2px;
  background: rgba(236, 48, 19, .45);
  transform-origin: center;
  opacity: 0;
  pointer-events: none;
}

.rs-logo .rs-scanline {
  position: absolute;
  top: -3px;
  bottom: -3px;
  left: -1px;
  width: 1.5px;
  background: linear-gradient(to bottom, transparent 0%, rgba(236,48,19,.5) 18%, #ec3013 42%, #ff563c 50%, #ec3013 58%, rgba(236,48,19,.5) 82%, transparent 100%);
  box-shadow: 0 0 7px 1.5px rgba(236,48,19,.5);
  opacity: 0;
  pointer-events: none;
}

.rs-logo .rs-wordmark {
  font-weight: 800;
  font-size: 27px;
  letter-spacing: -.03em;
  white-space: nowrap;
  clip-path: inset(0 100% 0 0);
  opacity: 0;
}

.rs-logo.rs-md .rs-wordmark { font-size: 34px; }
.rs-logo.rs-lg .rs-wordmark { font-size: 50px; }
.rs-logo.rs-xl .rs-wordmark { font-size: 70px; }

.rs-logo--entering .rs-bar-b { animation: rs-rise .48s cubic-bezier(.34,1.56,.64,1) .1s both; }
.rs-logo--entering .rs-bar-b::after { animation: rs-land-flash .3s ease-out .3s both; }
.rs-logo--entering .rs-bar-m { animation: rs-rise .46s cubic-bezier(.34,1.56,.64,1) .3s both; }
.rs-logo--entering .rs-bar-m::after { animation: rs-land-flash .3s ease-out .48s both; }
.rs-logo--entering .rs-bar-t {
  animation: rs-rise .44s cubic-bezier(.34,1.56,.64,1) .5s both, rs-stack-complete .55s cubic-bezier(.34,1.56,.64,1) .82s both;
}
.rs-logo--entering .rs-bar-t::after { animation: rs-land-flash .3s ease-out .66s both; }
.rs-logo--entering .rs-scanline { animation: rs-scan .38s cubic-bezier(.4,0,.2,1) .76s both; }
.rs-logo--entering .rs-wordmark { animation: rs-wipe .48s cubic-bezier(.2,.7,.2,1) 1s both; }

.rs-logo--idle .rs-bar-b,
.rs-logo--idle .rs-bar-m,
.rs-logo--idle .rs-bar-t { opacity: 1; }
.rs-logo--idle .rs-scanline { display: none; }
.rs-logo--idle .rs-wordmark { clip-path: inset(0 0 0 0); opacity: 1; animation: none !important; }
.rs-logo--idle .rs-bar-b { background: #605d5d; animation: rs-pulse-b 3.6s ease-in-out 0s infinite; }
.rs-logo--idle .rs-bar-m { background: #c42000; animation: rs-pulse-m 3.6s ease-in-out .45s infinite; }
.rs-logo--idle .rs-bar-t {
  background: #ec3013;
  transform-origin: center;
  animation: rs-pulse-t 3.6s ease-in-out .9s infinite, rs-top-pop 3.6s ease-in-out 0s infinite;
}
.rs-logo--idle:hover .rs-bar-t {
  animation: rs-pulse-t 3.6s ease-in-out .9s infinite, rs-top-pop 1s ease-in-out 0s infinite !important;
}

@media (prefers-reduced-motion: reduce) {
  .rs-logo .rs-bar,
  .rs-logo .rs-wordmark { animation: none !important; }
  .rs-logo .rs-bar { opacity: 1; transform: none; }
  .rs-logo .rs-wordmark { clip-path: none; opacity: 1; }
}

@media (max-width: 820px) {
  .rs-logo:not(.rs-compact):not(.rs-footer):not(.rs-md):not(.rs-lg):not(.rs-xl) {
    --rs-bar-w: 20px;
    --rs-bar-h: 4px;
    --rs-bar-gap: 3px;
    gap: 9px;
  }
  .rs-logo:not(.rs-compact):not(.rs-footer):not(.rs-md):not(.rs-lg):not(.rs-xl) .rs-wordmark { font-size: 21px; }
  a.rs-logo { min-height: 48px; }
}