/* =====================================================
   BADLANDS — decoración de Halloween
   Solo se carga cuando la decoración está encendida.
   ===================================================== */

:root[data-deco="halloween"]{
  --naranja:#ff7518;
  --morado:#5b2a86;
}

/* el rojo de la casa se tiñe de naranja quemado */
[data-deco="halloween"] .titulo-seccion{
  text-shadow:0 0 18px rgba(255,117,24,.55);
}
[data-deco="halloween"] .btn-rojo{
  background:linear-gradient(180deg,#ff7518,#c14a00);
  border-color:#1a0d00;
}
[data-deco="halloween"] header.cabecera,
[data-deco="halloween"] .cabecera{
  box-shadow:inset 0 -6px 0 rgba(255,117,24,.35);
}

/* telarañas en las esquinas de arriba */
[data-deco="halloween"] body::before,
[data-deco="halloween"] body::after{
  content:"";position:fixed;top:0;width:150px;height:150px;
  z-index:2;pointer-events:none;opacity:.5;
  background-repeat:no-repeat;background-size:contain;
}
[data-deco="halloween"] body::before{
  left:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='none' stroke='%23f3eee0' stroke-width='1.1' opacity='.85'%3E%3Cpath d='M0 0 L100 60 M0 0 L60 100 M0 0 L85 85 M0 0 L30 100 M0 0 L100 30'/%3E%3Cpath d='M22 5 Q14 14 5 22 M42 10 Q26 26 10 42 M62 16 Q39 39 16 62 M82 22 Q52 52 22 82'/%3E%3C/g%3E%3C/svg%3E");
}
[data-deco="halloween"] body::after{
  right:0;transform:scaleX(-1);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='none' stroke='%23f3eee0' stroke-width='1.1' opacity='.85'%3E%3Cpath d='M0 0 L100 60 M0 0 L60 100 M0 0 L85 85 M0 0 L30 100 M0 0 L100 30'/%3E%3Cpath d='M22 5 Q14 14 5 22 M42 10 Q26 26 10 42 M62 16 Q39 39 16 62 M82 22 Q52 52 22 82'/%3E%3C/g%3E%3C/svg%3E");
}

/* la niebla del suelo */
.niebla-hw{
  position:fixed;left:0;right:0;bottom:0;height:120px;z-index:1;pointer-events:none;
  background:linear-gradient(0deg,rgba(91,42,134,.35),transparent);
  animation:vaiven-niebla 9s ease-in-out infinite alternate;
}
@keyframes vaiven-niebla{from{transform:translateX(-3%)}to{transform:translateX(3%)}}

/* murciélagos: cruzan la pantalla y se les puede dar */
.murcielago{
  position:fixed;z-index:340;cursor:pointer;pointer-events:auto;
  width:38px;height:24px;color:#1a1014;
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.6));
  transition:transform .15s ease;
}
.murcielago svg{width:100%;height:100%;display:block}
.murcielago .ala{transform-origin:50% 50%;animation:aletea .28s ease-in-out infinite alternate}
.murcielago .ala.d{animation-delay:.02s}
@keyframes aletea{from{transform:scaleY(1) skewY(0deg)}to{transform:scaleY(.45) skewY(-8deg)}}
.murcielago:hover{transform:scale(1.25)}
.murcielago.tocado{animation:espanta .55s ease-out forwards}
@keyframes espanta{
  0%{transform:scale(1.4) rotate(0)}
  100%{transform:scale(.2) rotate(140deg) translateY(-70px);opacity:0}
}

/* calabaza fija abajo a la izquierda: se le da y se ríe */
.calabaza-hw{
  position:fixed;left:16px;bottom:16px;z-index:345;cursor:pointer;
  font-size:2.3rem;line-height:1;background:none;border:0;padding:0;
  filter:drop-shadow(0 0 14px rgba(255,117,24,.75));
  animation:late-calabaza 2.6s ease-in-out infinite;
}
@keyframes late-calabaza{0%,100%{transform:scale(1) rotate(-4deg)}50%{transform:scale(1.12) rotate(4deg)}}
.calabaza-hw.rie{animation:rie-calabaza .5s ease-in-out 3}
@keyframes rie-calabaza{0%,100%{transform:scale(1.2) rotate(-14deg)}50%{transform:scale(1.35) rotate(14deg)}}
@media (max-width:640px){ .calabaza-hw{font-size:1.9rem;left:12px;bottom:70px} }

/* la chapa de "esto solo lo ves tú" */
.chapa-deco{
  position:fixed;top:0;left:50%;transform:translateX(-50%);z-index:360;
  background:#5b2a86;color:#fff;border:2px solid #1a0d00;border-top:0;
  font-family:'Anton',sans-serif;letter-spacing:.08em;font-size:.6rem;
  padding:.2em .7em;
}

/* la calavera y la calabaza en el tablero, que se vean */
[data-deco="halloween"] .objeto{filter:drop-shadow(0 0 8px rgba(255,117,24,.8))}