/* =========================================================
   EIKO CRÉATION — lien et bandeau « Édition Noël »
   ---------------------------------------------------------
   Chargé sur les pages du site principal (thème « mur de nuit »)
   pour annoncer la version saisonnière /noel/ et l'offre
   vitrines pour les commerces.

   Fichier autonome : le retirer des pages et supprimer les deux
   entrées HTML (lien de navigation et bandeau) suffit à faire
   disparaître l'annonce après les fêtes.
   ========================================================= */

/* Lien de navigation : une pastille or, visible sans crier. */
.nav-links a.nav-noel {
  color: #ffd479;
  border: 1px solid rgba(255, 212, 121, .45);
  border-radius: 8px;
  padding: 4px 10px;
  font-size: .8rem;
  letter-spacing: .7px;
  box-shadow: 0 0 16px rgba(255, 212, 121, .12);
}
.nav-links a.nav-noel:hover { color: #07100b; background: #ffd479; text-shadow: none; }
.nav-links a.nav-noel::after { display: none; }

/* Bandeau saisonnier. */
.xmas-teaser { margin: 46px 0; }
.xmas-teaser-in {
  position: relative;
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 30px;
  align-items: center;
  padding: 32px 34px;
  border: 1px solid rgba(255, 212, 121, .38);
  border-radius: 20px;
  background:
    radial-gradient(120% 160% at 0% 0%, rgba(255, 91, 87, .13), transparent 55%),
    radial-gradient(120% 160% at 100% 100%, rgba(93, 219, 143, .09), transparent 55%),
    linear-gradient(180deg, rgba(27, 23, 41, .92), rgba(17, 14, 27, .92));
  box-shadow: 0 0 46px rgba(255, 91, 87, .12), 0 18px 50px rgba(0, 0, 0, .55);
}
/* Guirlande accrochée au haut du bandeau. */
.xmas-teaser-in::before {
  content: "";
  position: absolute;
  left: 20px;
  right: 20px;
  top: -11px;
  height: 12px;
  pointer-events: none;
  background-repeat: repeat-x;
  background-image:
    radial-gradient(circle at 7px 5px, #fff3c9 0 2.2px, rgba(255, 214, 128, .55) 3px, transparent 5px),
    radial-gradient(circle at 25px 5px, #ff6b67 0 2.2px, rgba(255, 107, 103, .5) 3px, transparent 5px),
    radial-gradient(circle at 43px 5px, #7ef0ac 0 2.2px, rgba(126, 240, 172, .5) 3px, transparent 5px),
    linear-gradient(180deg, rgba(74, 108, 88, .9) 0 1.5px, transparent 1.5px);
  background-size: 54px 12px, 54px 12px, 54px 12px, 100% 12px;
  filter: drop-shadow(0 0 7px rgba(255, 201, 120, .55));
}
.xmas-teaser-kicker {
  font-family: 'Space Mono', monospace;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #ffd479;
  margin-bottom: 9px;
}
.xmas-teaser h2 {
  font-family: 'Bangers', cursive;
  font-size: clamp(1.7rem, 3.6vw, 2.4rem);
  font-weight: 400;
  letter-spacing: .6px;
  line-height: 1.04;
  color: #f2eefb;
  margin-bottom: 10px;
}
.xmas-teaser h2 em { font-style: normal; color: #ffd479; }
.xmas-teaser p { font-size: .95rem; font-weight: 500; color: #c9c2de; max-width: 66ch; }
.xmas-teaser-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; }
.xmas-teaser .btn { font-size: 1.1rem; padding: 10px 18px; }
.xmas-teaser .btn-primary {
  background: linear-gradient(120deg, #ffd479, #f0b64c);
  color: #07100b;
  border-color: #ffd479;
  box-shadow: 0 0 22px rgba(255, 212, 121, .32);
}
.xmas-teaser .btn-primary:hover { border-color: #fff3c9; box-shadow: 0 0 32px rgba(255, 212, 121, .55); }
.xmas-teaser .btn-ghost { border-color: rgba(255, 212, 121, .5); color: #e0d3c0; }
.xmas-teaser .btn-ghost:hover { border-color: #ffd479; color: #fdf6ea; box-shadow: 0 0 22px rgba(255, 212, 121, .3); }

@media (max-width: 880px) {
  .xmas-teaser-in { grid-template-columns: 1fr; padding: 26px 22px; gap: 18px; }
  .xmas-teaser-actions { justify-content: flex-start; }
}
@media (max-width: 960px) {
  .nav-links a.nav-noel { display: inline-block; padding: 6px 12px; }
}
/* Entre le tiroir mobile (≤ 960 px) et la largeur confortable, la
   barre est chargée par l'entrée saisonnière : on resserre les liens
   plutôt que de laisser « CRÉATION » toucher « RÉALISATIONS ». */
@media (min-width: 961px) and (max-width: 1040px) {
  .nav-links { gap: 13px; }
  .nav-links a { font-size: .8rem; letter-spacing: .2px; }
  .nav-links a.nav-noel { padding: 4px 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .xmas-teaser-in::before { filter: none; }
}