body.xmas {
  --xmas-red: #E5383B;
  --xmas-green: #2BB673;
  --xmas-gold: #F6C85F;
  --xmas-ice: #DDEBFF;
}

.xmas-snow {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 40;
}

.xmas-lights {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -14px;
  height: 18px;
  display: flex;
  justify-content: space-between;
  padding: 0 12px;
  pointer-events: none;
}

.xmas-lights::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 6px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 0 0 50% 50% / 0 0 100% 100%;
}

.xmas-lights i {
  position: relative;
  top: 4px;
  width: 7px;
  height: 11px;
  border-radius: 50% 50% 50% 50% / 40% 40% 60% 60%;
  background: var(--c);
  box-shadow: 0 0 8px 1px var(--c);
  animation: xmas-twinkle 1.8s ease-in-out infinite;
  animation-delay: var(--d);
}

.xmas-lights i::before {
  content: "";
  position: absolute;
  top: -3px;
  left: 1.5px;
  width: 4px;
  height: 3px;
  border-radius: 1px;
  background: #3A3A40;
}

.xmas-lights i {
  transition: transform 0.25s var(--ease), box-shadow 0.25s, filter 0.25s;
}

.xmas-lights i.lit {
  animation: none;
  opacity: 1;
  transform: scale(calc(1 + var(--p) * 0.45));
  filter: brightness(calc(1.15 + var(--p) * 0.9)) saturate(calc(1 + var(--p) * 0.6));
  box-shadow:
    0 0 calc(6px + var(--p) * 14px) calc(1px + var(--p) * 3px) var(--c),
    0 0 calc(var(--p) * 34px) calc(var(--p) * 8px) var(--c);
}

.xmas-lights.near i:not(.lit) {
  animation-duration: 0.9s;
}

@keyframes xmas-twinkle {
  0%, 100% { opacity: 1; filter: brightness(1.1); }
  50% { opacity: 0.35; filter: brightness(0.7); box-shadow: none; }
}

body.xmas .brand {
  position: relative;
}

body.xmas .brand::before {
  content: "";
  position: absolute;
  left: -9px;
  top: -13px;
  width: 30px;
  height: 26px;
  transform: rotate(-24deg);
  pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 52'%3E%3Cpath d='M8 40 C14 16 30 4 46 6 C52 7 55 12 54 20 C50 14 44 14 40 18 C46 24 48 32 48 40 Z' fill='%23E5383B'/%3E%3Crect x='4' y='38' width='48' height='12' rx='6' fill='%23F4F4F6'/%3E%3Ccircle cx='54' cy='22' r='6' fill='%23F4F4F6'/%3E%3C/svg%3E") no-repeat center / contain;
  filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.5));
}

.xmas-greeting {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 auto 14px;
  padding: 7px 14px 7px 10px;
  border-radius: 99px;
  font-size: 13px;
  font-weight: 600;
  color: var(--soft);
  background: linear-gradient(90deg, rgba(229, 56, 59, 0.16), rgba(43, 182, 115, 0.16));
  border: 1px solid rgba(246, 200, 95, 0.35);
  box-shadow: 0 0 24px rgba(229, 56, 59, 0.15);
}

.xmas-greeting .xmas-tree {
  font-size: 16px;
  line-height: 1;
}

.xmas-greeting b {
  color: var(--xmas-gold);
  font-weight: 800;
  white-space: nowrap;
}

.xmas-greeting-wrap {
  display: flex;
  justify-content: center;
}

body.xmas .hero h1 .grad-text,
body.xmas .hero h1 [data-i18n="hero_h1_shine"] {
  text-shadow: 0 0 28px rgba(246, 200, 95, 0.18);
}

body.xmas .site-footer {
  border-top: 1px solid rgba(229, 56, 59, 0.25);
  background-image: radial-gradient(ellipse at 50% 0%, rgba(43, 182, 115, 0.08), transparent 60%);
}

@media (max-width: 640px) {
  .xmas-lights i:nth-child(even) {
    display: none;
  }
  .xmas-greeting {
    font-size: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .xmas-lights i {
    animation: none;
  }
  .xmas-snow {
    display: none;
  }
}