.sold-out-badge {
  position: fixed;
  top: 50%;
  right: -1px;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 99;

  /* hidden state: pushed off to the right */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(100%, -50%);
  transition:
    transform 0.4s cubic-bezier(0.2, 0.9, 0.3, 1),
    opacity 0.3s ease,
    visibility 0s linear 0.4s; /* hide after the slide-out finishes */
}

/* visible state, added by JS */
.sold-out-badge.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(0, -50%);
  transition-delay: 0s;
}

@media (prefers-reduced-motion: reduce) {
  .sold-out-badge {
    transition: none;
  }
}
        .sold-out-badge p{
              
               
               
                z-index: 10;
                background: #9b0d0d;
                color: #fff;
                padding: 8px 0;
                text-align: center;
                font-size: 15px;
                font-weight: 700;
                border: 2px solid #ffffff;
                text-transform: uppercase;
                

                color: #fff;
                border-radius: 0px 6px 6px 0px;
                text-align: center;
                writing-mode: vertical-rl;
                font-size: 17px;
    padding: 28px 7px;
                z-index: 1111;
                margin-bottom: 10px;
                transform: rotate(180deg);
                letter-spacing: 0.80px;
        }
        @media (min-width:768px){
            .sold-out-badge p{
                    font-size: 22px;
    padding: 33px 7px;
            }
        }
      .left-side-sticky{
        display: none;
      }
.sold-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 999;
  overflow: hidden; /* keeps the big starting scale from spilling outside the card */
}

.sold-overlay span {
  /* min, preferred, max */
  font-size: clamp(22px, 7vw, 37px);
  font-weight: 800;
  letter-spacing: 0.15em;
  padding: 0.3em 1.5em;
  border: 0.08em solid rgb(251 246 240);
  border-radius: 0.12em;

  color: rgb(249 244 238);
  background: #9b0d0d;
  white-space: nowrap;
  max-width: 90%;
  box-sizing: border-box;

  /* final resting state */
  opacity: 0.8;
  transform: rotate(-20deg);

  animation: sold-stamp 0.7s cubic-bezier(0.2, 0.9, 0.3, 1) 0.4s both;
}

/* phones */
@media (max-width: 480px) {
  .sold-overlay span {
    font-size: clamp(18px, 6vw, 28px);
    letter-spacing: 0.1em;
    padding: 0.3em 1em;
  }
}

@keyframes sold-stamp {
  0% {
    opacity: 0;
    transform: rotate(-35deg) scale(2.2); /* reduced from 3.2 so it doesn't overflow on small screens */
    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.5);
  }
  55% {
    opacity: 0.95;
    transform: rotate(-18deg) scale(0.92);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
  }
  75% {
    opacity: 0.85;
    transform: rotate(-21deg) scale(1.04);
  }
  100% {
    opacity: 0.8;
    transform: rotate(-20deg) scale(1);
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .sold-overlay span {
    animation: none;
  }
}
 .sold-overlay{
        position: fixed !important;
    }
    .sold-out-badge.is-visible{
        opacity: 0 !important;
    }