/* =====================================================
   MODE NOËL
   Actif uniquement quand <html> a la classe "noel"
   (ajoutée par noel.js, du 2 novembre au 6 janvier).
   ===================================================== */

html.noel .ticker-track span::after{ content:"❄"; opacity:0.8; }

/* ---------- NEIGE ---------- */
.xm-snow{ position:fixed; inset:0; pointer-events:none; z-index:40; overflow:hidden; }
.xm-flake{
  position:absolute; top:-12px; border-radius:50%; background:#fff;
  box-shadow:0 0 4px rgba(255,255,255,0.7);
  animation:xmFall linear infinite; will-change:transform;
}
@keyframes xmFall{
  0%{ transform:translate3d(0,-12px,0); opacity:0; }
  10%{ opacity:var(--o, .9); }
  50%{ transform:translate3d(var(--sway, 20px),50vh,0); }
  90%{ opacity:var(--o, .9); }
  100%{ transform:translate3d(0,105vh,0); opacity:0; }
}
/* sur fond clair, flocons légèrement bleutés pour rester visibles */
.xm-flake--soft{ background:#dfe9f2; box-shadow:0 0 3px rgba(120,150,180,0.5); }

/* ---------- DÉCOR DES EN-TÊTES ---------- */
.xm-decor{ position:absolute; inset:0; pointer-events:none; z-index:3; }

/* guirlande lumineuse */
.xm-garland{
  position:absolute; top:0; left:0; right:0; height:34px;
  display:flex; overflow:hidden;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='34'%3E%3Cpath d='M0 4 Q40 30 80 4' fill='none' stroke='%23060f0a' stroke-width='2'/%3E%3C/svg%3E") repeat-x;
}
.xm-bulb{
  width:9px; height:14px; border-radius:50% 50% 50% 50% / 40% 40% 60% 60%;
  margin-top:15px; position:relative;
  background:var(--c); box-shadow:0 0 10px 2px var(--c);
  animation:xmBlink 1.6s ease-in-out infinite; animation-delay:var(--d, 0s);
}
.xm-bulb::before{ content:""; position:absolute; top:-4px; left:2px; width:5px; height:5px; background:#3b3b33; border-radius:1px; }
@keyframes xmBlink{ 0%,100%{ opacity:1; } 50%{ opacity:0.35; box-shadow:0 0 2px 0 var(--c); } }

/* une ampoule au creux de chaque arc (80px) */
.xm-cell{ flex:0 0 80px; display:flex; justify-content:center; }

/* sapin + cadeaux */
.xm-tree{ position:absolute; bottom:0; right:6%; width:118px; }
.xm-tree .xm-star{ transform-origin:60px 14px; animation:xmStar 2.4s ease-in-out infinite; }
@keyframes xmStar{ 0%,100%{ transform:scale(1); filter:drop-shadow(0 0 3px #f6d365); } 50%{ transform:scale(1.15); filter:drop-shadow(0 0 9px #f6d365); } }
.xm-tree .xm-ball{ animation:xmBlink 2s ease-in-out infinite; }
.xm-tree .xm-ball:nth-child(2n){ animation-delay:-.7s; }
.xm-tree .xm-ball:nth-child(3n){ animation-delay:-1.3s; }
.xm-gifts{ position:absolute; bottom:0; right:calc(6% + 104px); width:74px; }

/* bonhomme de neige */
.xm-snowman{
  position:absolute; bottom:0; left:4%; width:72px;
  transform-origin:50% 100%; animation:xmWobble 4s ease-in-out infinite;
}
@keyframes xmWobble{ 0%,100%{ transform:rotate(-2deg); } 50%{ transform:rotate(2deg); } }

/* tapis de neige en bas de l'en-tête */
.xm-ground{
  position:absolute; left:0; right:0; bottom:-1px; height:18px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='18'%3E%3Cpath d='M0 10 Q25 2 50 9 T100 8 T150 10 T200 9 V18 H0Z' fill='%23f6f8fb'/%3E%3C/svg%3E") repeat-x;
}

/* bonnet de Noël sur le logo */
html.noel .brand{ position:relative; }
.xm-hat{ position:absolute; left:-7px; top:-13px; width:26px; transform:rotate(-18deg); pointer-events:none; }

.xm-badge{
  display:inline-block; margin-left:10px; padding:2px 10px; border-radius:20px;
  background:rgba(200,49,47,0.22); color:#ffd9d6; font-size:0.78rem;
}

@media (max-width:820px){
  .xm-tree{ width:84px; }
  .xm-gifts{ right:calc(6% + 74px); width:54px; }
  .xm-snowman{ width:54px; }
}
@media (max-width:480px){
  html.noel .eyebrow-tag{ flex-wrap:wrap; }
  .xm-badge{ margin-left:0; }
  .xm-gifts{ display:none; }
}
@media (prefers-reduced-motion: reduce){
  .xm-snow{ display:none; }
  .xm-bulb, .xm-tree .xm-star, .xm-tree .xm-ball, .xm-snowman{ animation:none; }
}