[data-rp-theme="year-end"] {
  --rp-accent: #8a233b;
  --rp-accent-dark: #92374b;
  --rp-highlight: #f8d998;
  --rp-hero-tint: #183e35;
}

.rp-year-end-banner { display: none; }

html[data-rp-theme="year-end"] .rp-year-end-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: .55rem 1rem;
  padding: .75rem 1rem;
  border-block-end: 1px solid #be975a;
  background: linear-gradient(110deg, #62192d, #87263e 50%, #62192d);
  color: #fff4de;
  text-align: center;
}

.rp-year-end-banner a {
  padding: .3rem .8rem;
  border-radius: .65rem;
  background: #f8d998;
  color: #481c27;
  font-weight: 700;
}

.rp-year-end-banner a:hover { background: #ffebbe; }
.rp-year-end-banner a:focus-visible { outline: 2px solid white; outline-offset: 3px; }

html[data-rp-theme="year-end"] {
  --rp-hero-grid: radial-gradient(circle, #f8d99888 1.2px, transparent 1.8px) 12px 14px / 91px 77px,
    radial-gradient(circle, #fff6d76b 1px, transparent 1.6px) 37px 31px / 59px 63px;
}

#offers { scroll-margin-block-start: 5.5rem; }

.rp-hero-cube { position: relative; }

html[data-rp-theme="year-end"] .rp-hero-cube::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset-block-start: -24%;
  inset-inline-start: 12%;
  width: 65%;
  aspect-ratio: 96 / 66;
  background: url("/assets/rp-santa-hat.svg") center / contain no-repeat;
  filter: drop-shadow(0 3px 4px #0006);
  pointer-events: none;
}

html[data-rp-theme="year-end"] .rp-mobile-hero::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  z-index: 15;
  height: 58px;
  background: url("/assets/rp-holiday-lights.svg") top center / 240px 58px repeat-x;
  pointer-events: none;
}

@media (prefers-reduced-motion: no-preference) {
  html[data-rp-theme="year-end"] .rp-mobile-hero::after {
    content: "";
    position: absolute;
    inset: -10rem 0 0;
    z-index: 16;
    background:
      radial-gradient(circle, #fff 1.5px, transparent 2.5px) 0 0 / 117px 149px,
      radial-gradient(circle, #fffbd5 1px, transparent 2px) 53px 37px / 89px 109px,
      radial-gradient(circle, #fff 2px, transparent 3px) 28px 18px / 197px 167px;
    animation: rp-year-end-snow 4s ease-out both;
    pointer-events: none;
  }
}

@keyframes rp-year-end-snow {
  0% { transform: translateY(-3rem); opacity: 0; }
  18% { opacity: .8; }
  65% { opacity: .6; }
  100% { transform: translateY(9rem); opacity: 0; }
}