/* =====================================================================
   HotKittyAria · Halloween kit v2
   Todo va bajo html.hk-on → el 1 de noviembre la web vuelve a ser la normal.
   ===================================================================== */

/* Lo marcado con data-halloween solo se ve durante Halloween */
html:not(.hk-on) [data-halloween]{display:none !important;}

/* ---------- NOCHE DE FONDO ---------- */
html.hk-on{
  background:#0e0617 radial-gradient(ellipse at 15% 0%,#3a1658 0%,#1a0a2b 38%,#0e0617 75%) fixed;
  cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='20' viewBox='0 0 100 50'%3E%3Cpath fill='%23ff8a1f' stroke='%23200a2e' stroke-width='3' d='M50 22C40 10 25 8 4 14c8 4 10 10 8 17 6-5 12-3 14 4 4-7 12-7 19-4zM50 22c10-12 25-14 46-8-8 4-10 10-8 17-6-5-12-3-14 4-4-7-12-7-19-4z'/%3E%3Cellipse cx='50' cy='26' rx='6' ry='10' fill='%23200a2e'/%3E%3C/svg%3E") 17 10, auto;
}
html.hk-on body{background:transparent;color:#efe4fb;}

.hk-sky,.hk-moon,.hk-trees,.hk-fog{position:fixed;pointer-events:none;z-index:-1;}
.hk-sky{inset:0;
  background-image:
    radial-gradient(1.5px 1.5px at 20px 30px,#fff,transparent),
    radial-gradient(1px 1px at 80px 120px,#fff,transparent),
    radial-gradient(1.5px 1.5px at 150px 60px,#ffe9b0,transparent),
    radial-gradient(1px 1px at 210px 190px,#fff,transparent),
    radial-gradient(1px 1px at 260px 20px,#fff,transparent);
  background-size:300px 240px;opacity:.7;animation:hk-twinkle 4s ease-in-out infinite alternate;}
@keyframes hk-twinkle{from{opacity:.35;}to{opacity:.85;}}

.hk-moon{top:95px;left:5%;width:130px;height:130px;border-radius:50%;
  background:radial-gradient(circle at 62% 38%,rgba(0,0,0,.08) 0 9%,transparent 10%),
             radial-gradient(circle at 38% 64%,rgba(0,0,0,.07) 0 7%,transparent 8%),
             radial-gradient(circle at 30% 30%,#fffbea,#ffe7a3 55%,#f3c766);
  box-shadow:0 0 40px 12px rgba(255,214,120,.35),0 0 120px 40px rgba(255,170,60,.15);
  animation:hk-moonglow 6s ease-in-out infinite alternate;}
@keyframes hk-moonglow{from{box-shadow:0 0 30px 8px rgba(255,214,120,.3),0 0 100px 30px rgba(255,170,60,.12);}
  to{box-shadow:0 0 50px 16px rgba(255,214,120,.45),0 0 140px 50px rgba(255,170,60,.2);}}

.hk-trees{left:0;right:0;bottom:0;height:170px;}
.hk-trees svg{width:100%;height:100%;display:block;}

.hk-fog{left:-50%;right:-50%;bottom:0;height:140px;opacity:.55;
  background:radial-gradient(ellipse at 20% 80%,rgba(200,180,230,.35),transparent 60%),
             radial-gradient(ellipse at 60% 90%,rgba(200,180,230,.3),transparent 55%),
             radial-gradient(ellipse at 90% 85%,rgba(200,180,230,.3),transparent 60%);
  animation:hk-fogmove 28s linear infinite alternate;}
@keyframes hk-fogmove{from{transform:translateX(-8%);}to{transform:translateX(8%);}}

/* ---------- LEGIBILIDAD SOBRE FONDO OSCURO ---------- */
html.hk-on header{background:rgba(18,7,30,.82);box-shadow:0 2px 20px rgba(0,0,0,.4);}
html.hk-on nav{background:#1f0d31;box-shadow:0 8px 25px rgba(0,0,0,.45),0 0 0 1px rgba(255,140,0,.25);}
html.hk-on nav a,html.hk-on .dropdown-toggle{color:#e9dcf7;}
html.hk-on nav a:hover,html.hk-on .dropdown:hover .dropdown-toggle{background:rgba(255,140,0,.15);color:#ffb35c;}
html.hk-on nav a.active{background:linear-gradient(135deg,#ff4f8b,#ff7a1a);}
html.hk-on .dropdown-menu{background:#1f0d31;box-shadow:0 20px 60px rgba(0,0,0,.6),0 0 0 1px rgba(255,140,0,.2);}
html.hk-on .dropdown-menu a{color:#efe4fb !important;}
html.hk-on .dropdown-menu a:hover{background:rgba(255,140,0,.15);color:#ffb35c !important;}

html.hk-on .profile p,html.hk-on .about-home-intro,html.hk-on .shop-description,
html.hk-on .doll-content p,html.hk-on .about-separator,html.hk-on .brand-tag{color:#cdb8e2;}
html.hk-on [style*="color:#666"]{color:#cdb8e2 !important;}
html.hk-on [style*="background:white"]{background:rgba(42,16,62,.78) !important;
  box-shadow:0 15px 35px rgba(0,0,0,.4),0 0 0 1px rgba(255,140,0,.25) !important;}
html.hk-on .about-card{border-bottom-color:rgba(255,255,255,.08);}
html.hk-on .doll-card{background:#1f0d31;box-shadow:0 10px 30px rgba(0,0,0,.45),0 0 0 1px rgba(255,140,0,.2);}
html.hk-on .site-footer,html.hk-on .site-footer a{color:#a995bf;}
html.hk-on .site-footer a:hover{color:#ffb35c;}
html.hk-on strong{color:#fff;}

/* ---------- VELAS JUNTO A LOS TÍTULOS ---------- */
html.hk-on .profile h1::before,html.hk-on .profile h1::after,
html.hk-on .shop-title::before,html.hk-on .shop-title::after{
  content:"🕯️";display:inline-block;margin:0 .35em;font-size:.9em;
  animation:hk-candle 1.8s ease-in-out infinite;filter:drop-shadow(0 0 8px rgba(255,180,60,.8));}
html.hk-on .profile h1::after,html.hk-on .shop-title::after{animation-delay:-.9s;}
@keyframes hk-candle{0%,100%{transform:rotate(-2deg);opacity:1;}30%{opacity:.75;}50%{transform:rotate(2deg);}70%{opacity:.9;}}

/* ---------- BOTONES ---------- */
html.hk-on .shop-button,html.hk-on .buy-button,html.hk-on .about-card-button{
  background:linear-gradient(135deg,#ff4f8b 0%,#ff7a1a 100%);}
.shop-button,.buy-button,.coupon-banner,.about-card-button{animation:hk-pulse 2.6s ease-in-out infinite;}
@keyframes hk-pulse{0%,100%{box-shadow:0 8px 24px rgba(255,79,139,.3);}50%{box-shadow:0 8px 30px rgba(255,140,0,.6);}}

html.hk-on .link-card{background:linear-gradient(135deg,#2a1240,#43195a);color:#fff;
  box-shadow:0 8px 25px rgba(0,0,0,.4),0 0 0 1px rgba(255,140,0,.45);}
html.hk-on .link-card:hover{box-shadow:0 18px 40px rgba(255,120,0,.3),0 0 0 2px rgba(255,140,0,.8);}
html.hk-on .link-card::after{position:absolute;right:22px;top:50%;transform:translateY(-50%);font-size:1.2rem;opacity:.9;}
html.hk-on .links .link-card:nth-child(1)::after{content:"🦇";}
html.hk-on .links .link-card:nth-child(2)::after{content:"🕸️";}
html.hk-on .links .link-card:nth-child(3)::after{content:"👻";}
html.hk-on .links .link-card:nth-child(4)::after{content:"🎃";}
html.hk-on .link-card img[alt="X"]{filter:invert(1);}

/* ---------- IMÁGENES SINIESTRAS + TELARAÑA ---------- */
html.hk-on .about-media::after,html.hk-on .hero::after,html.hk-on .doll-image::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;border-radius:inherit;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 150'%3E%3Cg stroke='%23ffffff' stroke-opacity='.7' stroke-width='1' fill='none'%3E%3Cpath d='M150 0L0 0M150 0L20 75M150 0L75 130M150 0L150 150M150 0L60 20M150 0L110 110'/%3E%3Cpath d='M120 0q8 10 30 30M85 0q17 22 65 65M50 0q26 34 100 100M15 0q33 48 135 140'/%3E%3C/g%3E%3C/svg%3E") top right/120px no-repeat,
    linear-gradient(180deg,rgba(40,0,70,.28) 0%,rgba(20,0,35,.05) 45%,rgba(90,30,0,.30) 100%);
  box-shadow:inset 0 0 80px rgba(20,0,35,.65);}
html.hk-on .about-media img,html.hk-on .hero-slide,html.hk-on .doll-image img{filter:contrast(1.06) saturate(1.05) brightness(.93);}
html.hk-on .about-media:hover img{filter:contrast(1.06) saturate(1.1) brightness(1);}
html.hk-on .about-content{z-index:2;}
html.hk-on .gallery-arrow,html.hk-on .gallery-dots{z-index:3;}

/* ---------- EFECTOS ---------- */
.hk-fx{position:fixed;inset:0;pointer-events:none;z-index:9998;overflow:hidden;}
.hk-bat{position:absolute;left:0;top:0;width:70px;height:35px;will-change:transform;filter:drop-shadow(0 0 6px rgba(255,140,0,.35));}
.hk-bat svg{width:100%;height:100%;overflow:visible;}
.hk-bat .wing{transform-box:view-box;transform-origin:50px 24px;animation:hk-flap .16s ease-in-out infinite alternate;}
@keyframes hk-flap{from{transform:scaleY(1);}to{transform:scaleY(.2);}}

.hk-ghost{position:absolute;bottom:22%;width:90px;opacity:.85;transition:transform 1.4s ease;}
.hk-ghost.left{left:-100px;}.hk-ghost.right{right:-100px;}
.hk-ghost.left.peek{transform:translateX(130px) rotate(12deg);}
.hk-ghost.right.peek{transform:translateX(-130px) rotate(-12deg) scaleX(-1);}
.hk-ghost svg{width:100%;animation:hk-float 2s ease-in-out infinite;}
@keyframes hk-float{0%,100%{translate:0 0;}50%{translate:0 -10px;}}

.hk-pumpkin{position:fixed;bottom:10px;width:74px;pointer-events:none;z-index:9997;
  animation:hk-bob 3.2s ease-in-out infinite;filter:drop-shadow(0 6px 14px rgba(255,120,0,.5));}
.hk-pumpkin.left{left:12px;}.hk-pumpkin.right{right:12px;width:58px;animation-delay:-1.4s;}
.hk-pumpkin .glow{animation:hk-flicker 2.4s infinite;}
@keyframes hk-bob{0%,100%{transform:translateY(0) rotate(-2deg);}50%{transform:translateY(-6px) rotate(2deg);}}
@keyframes hk-flicker{0%,100%{opacity:1;}8%{opacity:.55;}12%{opacity:1;}47%{opacity:.8;}52%{opacity:1;}70%{opacity:.6;}74%{opacity:1;}}

.hk-web{position:absolute;top:0;right:0;width:150px;pointer-events:none;z-index:2;opacity:.5;}
.hk-spider{position:absolute;top:0;right:58px;width:2px;pointer-events:none;z-index:3;animation:hk-drop 16s ease-in-out infinite;}
.hk-spider::before{content:"";position:absolute;left:0;top:0;width:1px;height:100%;background:rgba(220,220,220,.5);}
.hk-spider svg{position:absolute;bottom:-22px;left:-14px;width:30px;}
@keyframes hk-drop{0%,15%{height:30px;}35%,60%{height:190px;}80%,100%{height:30px;}}

/* ---------- PANTALLA DE CARGA ---------- */
html.hk-on body::after{content:"🎃";position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;
  font-size:84px;background:#0e0617;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .5s,visibility .5s;}
html.hk-on.hk-loading body::after{opacity:1;visibility:visible;animation:hk-bounce .8s ease-in-out infinite alternate;}
@keyframes hk-bounce{from{text-shadow:0 0 20px rgba(255,140,0,.4);}to{text-shadow:0 0 50px rgba(255,140,0,.9);}}

/* ---------- OFERTA, ETIQUETAS, CUENTA ATRÁS, TRUCO O TRATO ---------- */
.hk-offer{background:linear-gradient(135deg,#2b0f3a 0%,#5b1f6b 45%,#ff6a00 100%);color:#fff;
  padding:24px;border-radius:30px;text-align:center;margin-bottom:24px;position:relative;overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.45),0 0 0 1px rgba(255,140,0,.35);}
.hk-offer h2{margin:0 0 8px;font-size:26px;color:#fff;}
.hk-offer .code{display:inline-block;background:#fff;color:#5b1f6b;font-weight:800;letter-spacing:3px;padding:6px 16px;border-radius:12px;margin:0 4px;}
.hk-offer p{margin:6px 0 0;}
.hk-badge{position:absolute;top:14px;left:14px;z-index:5;color:#fff;font-weight:800;font-size:13px;padding:7px 12px;border-radius:999px;
  background:linear-gradient(135deg,#ff6a00,#ff4f8b);box-shadow:0 4px 12px rgba(0,0,0,.35);}
.hk-badge.purple{background:linear-gradient(135deg,#5b1f6b,#8e2fa8);}

.hk-countdown{display:block;margin:12px auto 0;font-weight:800;letter-spacing:1px;color:#ffd9a8;font-size:15px;}
.hk-countdown b{display:inline-block;min-width:2.1em;padding:3px 6px;margin:0 2px;border-radius:8px;background:rgba(0,0,0,.35);color:#fff;}

.hk-mini-link{display:block;text-align:center;margin:12px auto 0;color:#ffb35c;font-weight:700;text-decoration:none;}
.hk-mini-link:hover{text-decoration:underline;}

.hk-treat-wrap{text-align:center;margin:28px auto;}
.hk-treat{border:0;background:none;cursor:pointer;font-size:74px;line-height:1;filter:drop-shadow(0 0 18px rgba(255,140,0,.6));
  animation:hk-bob 2.4s ease-in-out infinite;}
.hk-treat.shake{animation:hk-shake .5s ease-in-out;}
@keyframes hk-shake{0%,100%{transform:rotate(0);}20%{transform:rotate(-14deg);}40%{transform:rotate(12deg);}60%{transform:rotate(-8deg);}80%{transform:rotate(6deg);}}
.hk-treat-hint{color:#ffcf99;font-weight:700;margin-top:6px;}
.hk-treat-box{display:none;margin:14px auto 0;max-width:420px;padding:20px;border-radius:22px;color:#fff;
  background:linear-gradient(135deg,#3b1450,#ff6a00);box-shadow:0 10px 30px rgba(0,0,0,.45);}
.hk-treat-box.show{display:block;animation:hk-pop .45s cubic-bezier(.2,1.6,.4,1);}
@keyframes hk-pop{from{transform:scale(.6);opacity:0;}to{transform:scale(1);opacity:1;}}
.hk-treat-box .code{font-size:30px;font-weight:900;letter-spacing:6px;display:block;margin:6px 0 12px;}
.hk-treat-box button,.hk-treat-box a{display:inline-block;margin:4px;padding:10px 18px;border-radius:999px;border:0;font-weight:800;cursor:pointer;text-decoration:none;font-size:14px;}
.hk-treat-box button{background:#fff;color:#5b1f6b;}
.hk-treat-box a{background:#1f0d31;color:#fff;}
.hk-candy{position:fixed;z-index:9999;pointer-events:none;font-size:26px;}

@media(max-width:768px){
  .hk-bat{width:48px;height:24px;}
  .hk-pumpkin{width:40px;opacity:.85;bottom:6px;}.hk-pumpkin.left{left:6px;}.hk-pumpkin.right{width:34px;right:6px;}
  .hk-web{width:100px;}
  .hk-moon{width:74px;height:74px;top:80px;left:auto;right:8%;}
  .hk-trees{height:100px;}
  .hk-ghost{width:60px;}
  .hk-offer h2{font-size:20px;}
  html.hk-on .link-card::after{right:16px;}
}
@media (prefers-reduced-motion:reduce){
  .hk-bat,.hk-spider,.hk-ghost{display:none;}
  .hk-pumpkin,.hk-pumpkin .glow,.shop-button,.buy-button,.coupon-banner,.about-card-button,.hk-sky,.hk-moon,.hk-fog,.hk-treat{animation:none;}
}