/* ==========================================================
   KLŌV · temporadas decorativas (versión FESTIVA)
   Afecta: logo (nav, menú mobile, footer) + borde/esquinas del header
   + capa animada sobre el header (murciélagos / nieve).
   Se activa con <html data-season="halloween|navidad"> (ver themes.js)
   ========================================================== */

html[data-season] .nav-logo,
html[data-season] .nav-mini-logo,
html[data-season] a.footer-logo { position: relative; }
html[data-season] .nav-logo span,
html[data-season] .nav-mini-logo span,
html[data-season] a.footer-logo span { position: relative; display: inline-block; line-height: 1; vertical-align: baseline; }

/* Capa animada que cruza el header */
html[data-season]::after {
  content: ""; position: fixed; top: 0; left: 0; width: 100%; height: 64px;
  pointer-events: none; z-index: 101;
}

/* ───────────── HALLOWEEN ───────────── */
html[data-season="halloween"] {
  --season-accent: #FF8A2B;
  --season-glow:   255,138,43;
  --web-l: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg  fill='none' stroke='rgba(255,255,255,.30)' stroke-width='1' stroke-linecap='round'%3E%3Cpath d='M0 0 L100.0 0.0 M0 0 L92.4 38.3 M0 0 L70.7 70.7 M0 0 L38.3 92.4 M0 0 L0.0 100.0 M24.0 0.0 Q20.2 4.0 22.2 9.2 M22.2 9.2 Q17.2 11.5 17.0 17.0 M17.0 17.0 Q11.5 17.2 9.2 22.2 M9.2 22.2 Q4.0 20.2 0.0 24.0 M46.0 0.0 Q38.8 7.7 42.5 17.6 M42.5 17.6 Q32.9 22.0 32.5 32.5 M32.5 32.5 Q22.0 32.9 17.6 42.5 M17.6 42.5 Q7.7 38.8 0.0 46.0 M68.0 0.0 Q57.4 11.4 62.8 26.0 M62.8 26.0 Q48.6 32.5 48.1 48.1 M48.1 48.1 Q32.5 48.6 26.0 62.8 M26.0 62.8 Q11.4 57.4 0.0 68.0 M90.0 0.0 Q75.9 15.1 83.1 34.4 M83.1 34.4 Q64.4 43.0 63.6 63.6 M63.6 63.6 Q43.0 64.4 34.4 83.1 M34.4 83.1 Q15.1 75.9 0.0 90.0 '/%3E%3C/g%3E%3C/svg%3E");
  --web-r: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg transform='translate(100 0) scale(-1 1)' fill='none' stroke='rgba(255,255,255,.30)' stroke-width='1' stroke-linecap='round'%3E%3Cpath d='M0 0 L100.0 0.0 M0 0 L92.4 38.3 M0 0 L70.7 70.7 M0 0 L38.3 92.4 M0 0 L0.0 100.0 M24.0 0.0 Q20.2 4.0 22.2 9.2 M22.2 9.2 Q17.2 11.5 17.0 17.0 M17.0 17.0 Q11.5 17.2 9.2 22.2 M9.2 22.2 Q4.0 20.2 0.0 24.0 M46.0 0.0 Q38.8 7.7 42.5 17.6 M42.5 17.6 Q32.9 22.0 32.5 32.5 M32.5 32.5 Q22.0 32.9 17.6 42.5 M17.6 42.5 Q7.7 38.8 0.0 46.0 M68.0 0.0 Q57.4 11.4 62.8 26.0 M62.8 26.0 Q48.6 32.5 48.1 48.1 M48.1 48.1 Q32.5 48.6 26.0 62.8 M26.0 62.8 Q11.4 57.4 0.0 68.0 M90.0 0.0 Q75.9 15.1 83.1 34.4 M83.1 34.4 Q64.4 43.0 63.6 63.6 M63.6 63.6 Q43.0 64.4 34.4 83.1 M34.4 83.1 Q15.1 75.9 0.0 90.0 '/%3E%3C/g%3E%3C/svg%3E");
  --spider: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 62'%3E%3Cline x1='12' y1='0' x2='12' y2='40' stroke='rgba(255,255,255,.55)' stroke-width='1'/%3E%3Cpath d='M15 44 L23 38 L23.5 44 M15.5 47 L23.5 48 L22.5 55 M15 50 L21 57 M15 42 L20 34 L23 35' fill='none' stroke='%23FF8A2B' stroke-width='1.3' stroke-linecap='round'/%3E%3Cpath d='M9 44 L1 38 L0.5 44 M8.5 47 L0.5 48 L1.5 55 M9 50 L3 57 M9 42 L4 34 L1 35' fill='none' stroke='%23FF8A2B' stroke-width='1.3' stroke-linecap='round'/%3E%3Cellipse cx='12' cy='49' rx='5.2' ry='6.5' fill='%23FF8A2B'/%3E%3Ccircle cx='12' cy='41.5' r='3.4' fill='%23FF8A2B'/%3E%3C/svg%3E");
}
html[data-season="halloween"][data-theme="light"] {
  --season-accent: #D9620B;
  --season-glow:   217,98,11;
  --web-l: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg  fill='none' stroke='rgba(70,60,120,.32)' stroke-width='1' stroke-linecap='round'%3E%3Cpath d='M0 0 L100.0 0.0 M0 0 L92.4 38.3 M0 0 L70.7 70.7 M0 0 L38.3 92.4 M0 0 L0.0 100.0 M24.0 0.0 Q20.2 4.0 22.2 9.2 M22.2 9.2 Q17.2 11.5 17.0 17.0 M17.0 17.0 Q11.5 17.2 9.2 22.2 M9.2 22.2 Q4.0 20.2 0.0 24.0 M46.0 0.0 Q38.8 7.7 42.5 17.6 M42.5 17.6 Q32.9 22.0 32.5 32.5 M32.5 32.5 Q22.0 32.9 17.6 42.5 M17.6 42.5 Q7.7 38.8 0.0 46.0 M68.0 0.0 Q57.4 11.4 62.8 26.0 M62.8 26.0 Q48.6 32.5 48.1 48.1 M48.1 48.1 Q32.5 48.6 26.0 62.8 M26.0 62.8 Q11.4 57.4 0.0 68.0 M90.0 0.0 Q75.9 15.1 83.1 34.4 M83.1 34.4 Q64.4 43.0 63.6 63.6 M63.6 63.6 Q43.0 64.4 34.4 83.1 M34.4 83.1 Q15.1 75.9 0.0 90.0 '/%3E%3C/g%3E%3C/svg%3E");
  --web-r: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg transform='translate(100 0) scale(-1 1)' fill='none' stroke='rgba(70,60,120,.32)' stroke-width='1' stroke-linecap='round'%3E%3Cpath d='M0 0 L100.0 0.0 M0 0 L92.4 38.3 M0 0 L70.7 70.7 M0 0 L38.3 92.4 M0 0 L0.0 100.0 M24.0 0.0 Q20.2 4.0 22.2 9.2 M22.2 9.2 Q17.2 11.5 17.0 17.0 M17.0 17.0 Q11.5 17.2 9.2 22.2 M9.2 22.2 Q4.0 20.2 0.0 24.0 M46.0 0.0 Q38.8 7.7 42.5 17.6 M42.5 17.6 Q32.9 22.0 32.5 32.5 M32.5 32.5 Q22.0 32.9 17.6 42.5 M17.6 42.5 Q7.7 38.8 0.0 46.0 M68.0 0.0 Q57.4 11.4 62.8 26.0 M62.8 26.0 Q48.6 32.5 48.1 48.1 M48.1 48.1 Q32.5 48.6 26.0 62.8 M26.0 62.8 Q11.4 57.4 0.0 68.0 M90.0 0.0 Q75.9 15.1 83.1 34.4 M83.1 34.4 Q64.4 43.0 63.6 63.6 M63.6 63.6 Q43.0 64.4 34.4 83.1 M34.4 83.1 Q15.1 75.9 0.0 90.0 '/%3E%3C/g%3E%3C/svg%3E");
  --spider: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 62'%3E%3Cline x1='12' y1='0' x2='12' y2='40' stroke='rgba(70,60,120,.6)' stroke-width='1'/%3E%3Cpath d='M15 44 L23 38 L23.5 44 M15.5 47 L23.5 48 L22.5 55 M15 50 L21 57 M15 42 L20 34 L23 35' fill='none' stroke='%233B2A4D' stroke-width='1.3' stroke-linecap='round'/%3E%3Cpath d='M9 44 L1 38 L0.5 44 M8.5 47 L0.5 48 L1.5 55 M9 50 L3 57 M9 42 L4 34 L1 35' fill='none' stroke='%233B2A4D' stroke-width='1.3' stroke-linecap='round'/%3E%3Cellipse cx='12' cy='49' rx='5.2' ry='6.5' fill='%233B2A4D'/%3E%3Ccircle cx='12' cy='41.5' r='3.4' fill='%233B2A4D'/%3E%3C/svg%3E");
}

/* Ō = calabaza con brillo de vela */
html[data-season="halloween"] .nav-logo span,
html[data-season="halloween"] .nav-mini-logo span,
html[data-season="halloween"] a.footer-logo span {
  color: var(--season-accent);
  text-shadow: 0 0 16px rgba(var(--season-glow),.75), 0 0 38px rgba(var(--season-glow),.45);
  animation: candle 3.2s infinite;
}
html[data-season="halloween"] .nav-logo span::before,
html[data-season="halloween"] .nav-mini-logo span::before,
html[data-season="halloween"] a.footer-logo span::before {
  content: ""; position: absolute; left: 50%; top: -0.17em;
  width: 0.13em; height: 0.17em; margin-left: -0.05em;
  background: #5FA03A; border-radius: 45% 45% 15% 15%;
  transform: rotate(14deg);
  box-shadow: 0.06em 0.02em 0 -0.01em #7BC24F;
}
@keyframes candle {
  0%,100% { text-shadow: 0 0 16px rgba(var(--season-glow),.75), 0 0 38px rgba(var(--season-glow),.45); }
  18%     { text-shadow: 0 0 10px rgba(var(--season-glow),.55), 0 0 26px rgba(var(--season-glow),.28); }
  32%     { text-shadow: 0 0 20px rgba(var(--season-glow),.9),  0 0 46px rgba(var(--season-glow),.55); }
  55%     { text-shadow: 0 0 12px rgba(var(--season-glow),.6),  0 0 30px rgba(var(--season-glow),.32); }
  78%     { text-shadow: 0 0 18px rgba(var(--season-glow),.85), 0 0 42px rgba(var(--season-glow),.5); }
}

/* Murciélago grande aleteando junto al logo */
html[data-season="halloween"] .nav-logo::after,
html[data-season="halloween"] .nav-mini-logo::after,
html[data-season="halloween"] a.footer-logo::after {
  content: ""; position: absolute; top: -0.3em; right: -1.15em;
  width: 1.05em; height: 0.55em;
  background: var(--season-accent);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 16'%3E%3Cpath d='M16 3 L17.5 5.5 C19.5 4.5 22 4 25 5 C27 3.5 29.5 2.5 32 2.5 C31 4 30.5 6 31 8 C29 7.5 27.5 8 26.5 9.5 C25 8.5 23.5 9 22.5 10.5 C21 9.5 19.5 10 18.5 12 L16 14.5 L13.5 12 C12.5 10 11 9.5 9.5 10.5 C8.5 9 7 8.5 5.5 9.5 C4.5 8 3 7.5 1 8 C1.5 6 1 4 0 2.5 C2.5 2.5 5 3.5 7 5 C10 4 12.5 4.5 14.5 5.5 Z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 16'%3E%3Cpath d='M16 3 L17.5 5.5 C19.5 4.5 22 4 25 5 C27 3.5 29.5 2.5 32 2.5 C31 4 30.5 6 31 8 C29 7.5 27.5 8 26.5 9.5 C25 8.5 23.5 9 22.5 10.5 C21 9.5 19.5 10 18.5 12 L16 14.5 L13.5 12 C12.5 10 11 9.5 9.5 10.5 C8.5 9 7 8.5 5.5 9.5 C4.5 8 3 7.5 1 8 C1.5 6 1 4 0 2.5 C2.5 2.5 5 3.5 7 5 C10 4 12.5 4.5 14.5 5.5 Z'/%3E%3C/svg%3E") center / contain no-repeat;
  pointer-events: none; transform-origin: 50% 60%;
  animation: batFlap 1.8s ease-in-out infinite;
}
@keyframes batFlap {
  0%,100% { transform: translateY(0) rotate(-8deg) scaleY(1); }
  25%     { transform: translateY(-3px) rotate(-8deg) scaleY(.55); }
  50%     { transform: translateY(-1px) rotate(-8deg) scaleY(1); }
  75%     { transform: translateY(-4px) rotate(-8deg) scaleY(.6); }
}

/* Araña colgando del hilo */
html[data-season="halloween"] .nav-logo::before,
html[data-season="halloween"] a.footer-logo::before {
  content: ""; position: absolute; left: 24%; top: -0.95em;
  width: 0.62em; height: 1.55em;
  background: var(--spider) center top / 100% 100% no-repeat;
  pointer-events: none; transform-origin: 50% 0;
  animation: spiderSwing 4.5s ease-in-out infinite;
}
@keyframes spiderSwing {
  0%,100% { transform: rotate(-7deg); }
  50%     { transform: rotate(7deg); }
}

/* Telarañas en las esquinas del header */
html[data-season="halloween"] nav::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: var(--web-l) left top / 96px 96px no-repeat, var(--web-r) right top / 96px 96px no-repeat;
}
/* Borde inferior naranja → violeta con resplandor */
html[data-season="halloween"] nav::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--season-accent) 22%, #7F77DD 50%, var(--season-accent) 78%, transparent 100%);
  box-shadow: 0 0 14px rgba(var(--season-glow),.55);
  pointer-events: none;
}
/* Murciélagos cruzando el header */
html[data-season="halloween"]::after {
  height: 30px; background: var(--season-accent); opacity: .6;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 420 30'%3E%3Cg transform='translate(40 5) scale(.9)'%3E%3Cpath d='M16 3 L17.5 5.5 C19.5 4.5 22 4 25 5 C27 3.5 29.5 2.5 32 2.5 C31 4 30.5 6 31 8 C29 7.5 27.5 8 26.5 9.5 C25 8.5 23.5 9 22.5 10.5 C21 9.5 19.5 10 18.5 12 L16 14.5 L13.5 12 C12.5 10 11 9.5 9.5 10.5 C8.5 9 7 8.5 5.5 9.5 C4.5 8 3 7.5 1 8 C1.5 6 1 4 0 2.5 C2.5 2.5 5 3.5 7 5 C10 4 12.5 4.5 14.5 5.5 Z'/%3E%3C/g%3E%3Cg transform='translate(175 14) scale(.55)'%3E%3Cpath d='M16 3 L17.5 5.5 C19.5 4.5 22 4 25 5 C27 3.5 29.5 2.5 32 2.5 C31 4 30.5 6 31 8 C29 7.5 27.5 8 26.5 9.5 C25 8.5 23.5 9 22.5 10.5 C21 9.5 19.5 10 18.5 12 L16 14.5 L13.5 12 C12.5 10 11 9.5 9.5 10.5 C8.5 9 7 8.5 5.5 9.5 C4.5 8 3 7.5 1 8 C1.5 6 1 4 0 2.5 C2.5 2.5 5 3.5 7 5 C10 4 12.5 4.5 14.5 5.5 Z'/%3E%3C/g%3E%3Cg transform='translate(305 2) scale(.75)'%3E%3Cpath d='M16 3 L17.5 5.5 C19.5 4.5 22 4 25 5 C27 3.5 29.5 2.5 32 2.5 C31 4 30.5 6 31 8 C29 7.5 27.5 8 26.5 9.5 C25 8.5 23.5 9 22.5 10.5 C21 9.5 19.5 10 18.5 12 L16 14.5 L13.5 12 C12.5 10 11 9.5 9.5 10.5 C8.5 9 7 8.5 5.5 9.5 C4.5 8 3 7.5 1 8 C1.5 6 1 4 0 2.5 C2.5 2.5 5 3.5 7 5 C10 4 12.5 4.5 14.5 5.5 Z'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 420px 30px repeat-x;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 420 30'%3E%3Cg transform='translate(40 5) scale(.9)'%3E%3Cpath d='M16 3 L17.5 5.5 C19.5 4.5 22 4 25 5 C27 3.5 29.5 2.5 32 2.5 C31 4 30.5 6 31 8 C29 7.5 27.5 8 26.5 9.5 C25 8.5 23.5 9 22.5 10.5 C21 9.5 19.5 10 18.5 12 L16 14.5 L13.5 12 C12.5 10 11 9.5 9.5 10.5 C8.5 9 7 8.5 5.5 9.5 C4.5 8 3 7.5 1 8 C1.5 6 1 4 0 2.5 C2.5 2.5 5 3.5 7 5 C10 4 12.5 4.5 14.5 5.5 Z'/%3E%3C/g%3E%3Cg transform='translate(175 14) scale(.55)'%3E%3Cpath d='M16 3 L17.5 5.5 C19.5 4.5 22 4 25 5 C27 3.5 29.5 2.5 32 2.5 C31 4 30.5 6 31 8 C29 7.5 27.5 8 26.5 9.5 C25 8.5 23.5 9 22.5 10.5 C21 9.5 19.5 10 18.5 12 L16 14.5 L13.5 12 C12.5 10 11 9.5 9.5 10.5 C8.5 9 7 8.5 5.5 9.5 C4.5 8 3 7.5 1 8 C1.5 6 1 4 0 2.5 C2.5 2.5 5 3.5 7 5 C10 4 12.5 4.5 14.5 5.5 Z'/%3E%3C/g%3E%3Cg transform='translate(305 2) scale(.75)'%3E%3Cpath d='M16 3 L17.5 5.5 C19.5 4.5 22 4 25 5 C27 3.5 29.5 2.5 32 2.5 C31 4 30.5 6 31 8 C29 7.5 27.5 8 26.5 9.5 C25 8.5 23.5 9 22.5 10.5 C21 9.5 19.5 10 18.5 12 L16 14.5 L13.5 12 C12.5 10 11 9.5 9.5 10.5 C8.5 9 7 8.5 5.5 9.5 C4.5 8 3 7.5 1 8 C1.5 6 1 4 0 2.5 C2.5 2.5 5 3.5 7 5 C10 4 12.5 4.5 14.5 5.5 Z'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 420px 30px repeat-x;
  animation: batsCross 45s linear infinite;
}
@keyframes batsCross {
  from { -webkit-mask-position: 0 0;     mask-position: 0 0; }
  to   { -webkit-mask-position: 420px 0; mask-position: 420px 0; }
}

/* ───────────── NAVIDAD ───────────── */
html[data-season="navidad"] {
  --season-accent: #E9C46A;
  --season-glow:   233,196,106;
  --snow: rgba(255,255,255,.95);
}
html[data-season="navidad"][data-theme="light"] {
  --season-accent: #B02A3B;
  --season-glow:   176,42,59;
  --snow: rgba(120,160,225,.85);
}
html[data-season="navidad"] .nav-logo span,
html[data-season="navidad"] .nav-mini-logo span,
html[data-season="navidad"] a.footer-logo span {
  color: var(--season-accent);
  text-shadow: 0 0 16px rgba(var(--season-glow),.7), 0 0 36px rgba(var(--season-glow),.4);
  animation: xmasPulse 3s ease-in-out infinite;
}
@keyframes xmasPulse {
  0%,100% { text-shadow: 0 0 12px rgba(var(--season-glow),.55), 0 0 30px rgba(var(--season-glow),.3); }
  50%     { text-shadow: 0 0 20px rgba(var(--season-glow),.9),  0 0 44px rgba(var(--season-glow),.55); }
}
/* Gorro de Papá Noel sobre la K */
html[data-season="navidad"] .nav-logo::before,
html[data-season="navidad"] .nav-mini-logo::before,
html[data-season="navidad"] a.footer-logo::before {
  content: ""; position: absolute; left: -0.26em; top: -0.34em;
  width: 1.05em; height: 0.86em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 36'%3E%3Cpath d='M6 29 C7 13 17 4 28 5 C33 5.500 37 9 36.500 15 C36 20 37 25 39 29 Z' fill='%23D64550'/%3E%3Cpath d='M6 29 C7 20 11 12 17 8 C12 14 11 22 12 29 Z' fill='%23B3303B'/%3E%3Crect x='3' y='26' width='38' height='8' rx='4' fill='%23FFFFFF'/%3E%3Ccircle cx='37' cy='9' r='5' fill='%23FFFFFF'/%3E%3C/svg%3E") center / contain no-repeat;
  transform: rotate(-16deg); transform-origin: 20% 90%;
  pointer-events: none;
  filter: drop-shadow(0 2px 3px rgba(0,0,0,.35));
}
/* Destello dorado junto a la V */
html[data-season="navidad"] .nav-logo::after,
html[data-season="navidad"] .nav-mini-logo::after,
html[data-season="navidad"] a.footer-logo::after {
  content: ""; position: absolute; top: -0.2em; right: -0.85em;
  width: 0.6em; height: 0.6em;
  background: #E9C46A;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0 L14 10 L24 12 L14 14 L12 24 L10 14 L0 12 L10 10 Z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0 L14 10 L24 12 L14 14 L12 24 L10 14 L0 12 L10 10 Z'/%3E%3C/svg%3E") center / contain no-repeat;
  pointer-events: none;
  animation: twinkle 2.4s ease-in-out infinite;
}
@keyframes twinkle {
  0%,100% { transform: scale(.6) rotate(0deg);  opacity: .55; }
  50%     { transform: scale(1.05) rotate(45deg); opacity: 1; }
}
/* Guirnalda de luces colgando del header (2 tandas que titilan alternadas) */
html[data-season="navidad"] nav::before,
html[data-season="navidad"] nav::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -17px; height: 18px;
  background-repeat: repeat-x; background-size: 72px 18px;
  pointer-events: none;
}
html[data-season="navidad"] nav::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72 18'%3E%3Cpath d='M0 3 Q18 8 36 3 Q54 8 72 3' fill='none' stroke='%236b6b78' stroke-width='1'/%3E%3Crect x='7.5' y='5.4' width='3' height='3' fill='%23555'/%3E%3Cellipse cx='9' cy='11.4' rx='3.2' ry='4.4' fill='%23FF4D5E'/%3E%3Cellipse cx='8' cy='9.9' rx='.9' ry='1.4' fill='%23fff' opacity='.55'/%3E%3Crect x='43.5' y='5.4' width='3' height='3' fill='%23555'/%3E%3Cellipse cx='45' cy='11.4' rx='3.2' ry='4.4' fill='%234ADE80'/%3E%3Cellipse cx='44' cy='9.9' rx='.9' ry='1.4' fill='%23fff' opacity='.55'/%3E%3C/svg%3E");
  animation: bulbsA 2.2s ease-in-out infinite;
  filter: drop-shadow(0 0 3px rgba(255,255,255,.35));
}
html[data-season="navidad"] nav::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72 18'%3E%3Crect x='25.5' y='5.4' width='3' height='3' fill='%23555'/%3E%3Cellipse cx='27' cy='11.4' rx='3.2' ry='4.4' fill='%23FFD166'/%3E%3Cellipse cx='26' cy='9.9' rx='.9' ry='1.4' fill='%23fff' opacity='.55'/%3E%3Crect x='61.5' y='5.4' width='3' height='3' fill='%23555'/%3E%3Cellipse cx='63' cy='11.4' rx='3.2' ry='4.4' fill='%235EB6FF'/%3E%3Cellipse cx='62' cy='9.9' rx='.9' ry='1.4' fill='%23fff' opacity='.55'/%3E%3C/svg%3E");
  animation: bulbsB 2.2s ease-in-out infinite;
  filter: drop-shadow(0 0 3px rgba(255,255,255,.35));
}
@keyframes bulbsA { 0%,100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes bulbsB { 0%,100% { opacity: .35; } 50% { opacity: 1; } }
/* Nieve cayendo sobre el header */
html[data-season="navidad"]::after {
  height: 90px;
  background-image:
    radial-gradient(2.5px 2.5px at 20px 12px, var(--snow) 50%, transparent 52%),
    radial-gradient(2px 2px at 90px 44px, var(--snow) 50%, transparent 52%),
    radial-gradient(2.5px 2.5px at 140px 24px, var(--snow) 50%, transparent 52%),
    radial-gradient(2px 2px at 60px 60px, var(--snow) 50%, transparent 52%);
  background-size: 170px 90px, 210px 180px, 150px 90px, 130px 180px;
  animation: snowFall 9s linear infinite;
  -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent 100%);
          mask-image: linear-gradient(180deg, #000 55%, transparent 100%);
}
@keyframes snowFall {
  from { background-position: 0 0, 0 0, 0 0, 0 0; }
  to   { background-position: 0 90px, 0 180px, 0 90px, 0 180px; }
}

/* ───────────── Accesibilidad / mobile ───────────── */
/* la araña no va dentro del menú mobile */
html[data-season] .nav-mini-logo::before { }
html[data-season="halloween"] .nav-mini-logo::before { display: none; }
@media (prefers-reduced-motion: reduce) {
  html[data-season] *, html[data-season]::after, html[data-season] nav::before, html[data-season] nav::after,
  html[data-season] .nav-logo::before, html[data-season] .nav-logo::after,
  html[data-season] .nav-mini-logo::after, html[data-season] a.footer-logo::after { animation: none !important; }
  html[data-season]::after { display: none; }
}
@media (max-width: 768px) {
  html[data-season="halloween"] nav::before { background-size: 64px 64px, 64px 64px; }
  html[data-season="halloween"]::after { height: 30px; opacity: .45; }
  html[data-season] .nav-logo::after { right: -0.9em; }
}
