/* Silver Kronos bear cutouts. Keep the current hero background untouched. */
.ks-logo img { width: 84px !important; height: 84px !important; }
.kx-steps .kx-step:last-child,
.kx-feats .kx-feat:last-child { overflow: hidden; }

.kx-steps .kx-step:last-child {
  min-height: 218px;
  padding-right: 128px;
}
.kx-steps .kx-step:last-child > * { position: relative; z-index: 1; }
.kx-steps .kx-step:last-child::after {
  content: "";
  position: absolute;
  z-index: 0;
  right: -7px;
  bottom: -10px;
  width: 126px;
  height: 194px;
  background: url("/assets/kronos-bear-gift.v2.webp?v=1") center bottom / contain no-repeat;
  filter: drop-shadow(0 8px 20px rgba(0,0,0,.45));
  transform-origin: 50% 100%;
  animation: kxm-bear-arrive 7s ease-in-out infinite;
  pointer-events: none;
}

.kx-feats .kx-feat:last-child {
  min-height: 174px;
  padding-right: 104px;
}
.kx-feats .kx-feat:last-child > * { position: relative; z-index: 1; }
.kx-feats .kx-feat:last-child::after {
  content: "";
  position: absolute;
  z-index: 0;
  right: -12px;
  bottom: -8px;
  width: 124px;
  height: 126px;
  background: url("/assets/kronos-bear-support.v2.webp?v=1") center bottom / contain no-repeat;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,.4));
  pointer-events: none;
}

.ksc-head .ksc-ava {
  background: #080a0b url("/assets/kronos-mascot-emblem.v2.webp?v=1") center / cover no-repeat;
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 50%;
}
.ksc-head .ksc-ava svg { display: none !important; }

@keyframes kxm-bear-arrive {
  0%, 84%, 100% { transform: translateY(0) rotate(0); }
  89% { transform: translateY(-5px) rotate(-1.2deg); }
  94% { transform: translateY(0) rotate(1deg); }
}

@media (max-width: 900px) {
  .kx-steps .kx-step:last-child { min-height: 204px; padding-right: 120px; }
  .kx-steps .kx-step:last-child::after { width: 116px; height: 178px; }
  .kx-feats .kx-feat:last-child { min-height: 164px; padding-right: 110px; }
}
@media (max-width: 560px) {
  .ks-logo img { width: 68px !important; height: 68px !important; }
  .kx-steps .kx-step:last-child { min-height: 184px; padding-right: 100px; }
  .kx-steps .kx-step:last-child::after { width: 98px; height: 150px; right: -6px; }
  .kx-feats .kx-feat:last-child { min-height: 150px; padding-right: 96px; }
  .kx-feats .kx-feat:last-child::after { width: 104px; height: 110px; right: -10px; }
}
@media (prefers-reduced-motion: reduce) {
  .kx-steps .kx-step:last-child::after { animation: none; }
}
