/* Theme for holiday pages (ev.theme == 'christmas'). Pure CSS; every animation is switched off under prefers-reduced-motion. */
.hx-hero--christmas::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 46px; z-index: 1; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='46'%3E%3Cpath d='M0 6 Q20 22 40 6 T80 6 T120 6 T160 6' fill='none' stroke='%231B2A22' stroke-opacity='.55' stroke-width='1.6'/%3E%3Ccircle cx='20' cy='23' r='5.5' fill='%23E63946'/%3E%3Ccircle cx='20' cy='23' r='10' fill='%23E63946' fill-opacity='.22'/%3E%3Ccircle cx='60' cy='23' r='5.5' fill='%23F6C445'/%3E%3Ccircle cx='60' cy='23' r='10' fill='%23F6C445' fill-opacity='.22'/%3E%3Ccircle cx='100' cy='23' r='5.5' fill='%232A9D5C'/%3E%3Ccircle cx='100' cy='23' r='10' fill='%232A9D5C' fill-opacity='.22'/%3E%3Ccircle cx='140' cy='23' r='5.5' fill='%234EA8DE'/%3E%3Ccircle cx='140' cy='23' r='10' fill='%234EA8DE' fill-opacity='.22'/%3E%3C/svg%3E") repeat-x left top / 160px 46px; animation: hx-lights 2.6s ease-in-out infinite alternate;
}
.hx-hero--christmas::after {
  content: ""; position: absolute; inset: -40px 0 0; z-index: -1; pointer-events: none; will-change: background-position;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='190'%3E%3Cg transform='translate%2860 70%29 rotate%2825%29 scale%281%29'%3E%3Cpath d='M0 -13C8 -9 9 5 0 13C-9 5 -8 -9 0 -13Z' fill='%23C8352B' fill-opacity='0.7'/%3E%3C/g%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='220'%3E%3Cg transform='translate%28150 90%29 rotate%28-35%29 scale%280.9%29'%3E%3Cpath d='M0 -13C8 -9 9 5 0 13C-9 5 -8 -9 0 -13Z' fill='%23E4572E' fill-opacity='0.62'/%3E%3C/g%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='210' height='200'%3E%3Cg transform='translate%28100 100%29 scale%281%29'%3E%3Cpath d='M0 -8L2 -2L8 0L2 2L0 8L-2 2L-8 0L-2 -2Z' fill='%23FFE08A' fill-opacity='.85'/%3E%3C/g%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='260'%3E%3Cg transform='translate%28200 150%29 scale%280.8%29'%3E%3Cpath d='M0 -8L2 -2L8 0L2 2L0 8L-2 2L-8 0L-2 -2Z' fill='%23FFE08A' fill-opacity='.85'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 170px 190px, 240px 220px, 210px 200px, 300px 260px;
  animation: hx-petals 18s linear infinite;
}
.hx-hero--christmas .hx-hero__in { text-shadow: 0 1px 14px rgba(0,0,0,.6); }
@keyframes hx-lights { from { filter: brightness(.7) saturate(.9); } to { filter: brightness(1.3) saturate(1.2); } }
@keyframes hx-petals { from { background-position: 0 0, 90px -40px, 30px -80px, 160px 20px; } to { background-position: 40px 560px, 30px 520px, 10px 620px, 150px 700px; } }

.hx-hero--christmas .hx-hero__img { filter: brightness(.66) saturate(1.1); animation: hx-zoom-christmas 26s ease-in-out infinite alternate; transform-origin: 55% 65%; }
@keyframes hx-zoom-christmas { from { transform: scale(1); } to { transform: scale(1.07); } }
.hx-hero--christmas .hx-hero__in > * { opacity: 0; transform: translateY(16px); animation: hx-rise .8s cubic-bezier(.2,.7,.2,1) forwards; }
.hx-hero--christmas .hx-hero__in > *:nth-child(2) { animation-delay: .12s; }
.hx-hero--christmas .hx-hero__in > *:nth-child(3) { animation-delay: .24s; }
@keyframes hx-rise { to { opacity: 1; transform: none; } }
.hx-count { display: inline-flex; align-items: center; gap: 8px; background: #FDECEA; color: #8C1F1F; border: 1px solid #F3B8B2; border-radius: 999px; padding: 6px 14px; font-weight: 700; font-size: .92rem; }
.hx-count__dot { width: 9px; height: 9px; border-radius: 50%; background: #D8382E; animation: hx-pulse 1.8s ease-out infinite; }
@keyframes hx-pulse { 0% { box-shadow: 0 0 0 0 rgba(216,56,46,.5); } 100% { box-shadow: 0 0 0 12px rgba(0,0,0,0); } }
@media (prefers-reduced-motion: reduce) {
  .hx-hero--christmas::before, .hx-hero--christmas::after { animation: none; }
  .hx-hero--christmas .hx-hero__img, .hx-hero--christmas .hx-hero__in > * { animation: none; opacity: 1; transform: none; }
  .hx-count__dot { animation: none; }
}