/* ============================================================
   THÈME HALLOWEEN  —  s'active avec  <html data-theme="halloween">
   Pour le retirer : supprimez cet attribut (ou les 2 lignes
   halloween.css / halloween.js dans les pages).
   ============================================================ */
:root[data-theme="halloween"]{
  --cream:#FFF6EA;          /* parchemin */
  --cream-deep:#FBE3C8;
  --ink:#22112F;            /* nuit violette */
  --ink-soft:#5A4668;
  --red:#C2410C;            /* citrouille */
  --red-deep:#B93A08;
  --blush:#FFE2C8;
  --line:rgba(34,17,47,.15);
  --lune:#FF8A3D;
}
[data-theme="halloween"] svg [stroke="#D6213A"]{stroke:var(--red);}

/* Bandeau d'accueil */
.hw-bar{background:linear-gradient(90deg,#22112F,#3B1760 50%,#22112F); color:#FFD9B8; text-align:center; font-weight:600; font-size:.95rem; padding:9px 16px; line-height:1.35;}
.hw-bar a{color:#FF8A3D; font-weight:700; text-underline-offset:3px;}
.hw-bar a:hover{color:#fff;}

/* Bandeau noir : ciel d'orage, lune derrière le logo */
[data-theme="halloween"] .hero{background:radial-gradient(ellipse at 78% 30%, #55227F 0%, #2A1340 48%, #1B0C29 100%);}
[data-theme="halloween"] .hero .eyebrow, [data-theme="halloween"] .hero-content .eyebrow{color:#FFB070;}
[data-theme="halloween"] .hero-badge::before{content:""; position:absolute; inset:-16%; border-radius:50%; z-index:0;
  background:radial-gradient(circle, rgba(255,160,70,.95) 0, rgba(255,122,26,.65) 52%, rgba(255,122,26,0) 71%);}
[data-theme="halloween"] .hero-badge img.hero-logo{position:relative; z-index:1; box-shadow:0 0 0 2px var(--lune), 0 0 40px rgba(255,138,61,.55);}
[data-theme="halloween"] .hero-sticker{z-index:2; background:#6B2FA0; border:2px solid var(--lune);}
[data-theme="halloween"] .hero-sticker small{color:#FFD9B8;}

/* Toiles d'araignée dans les coins */
.hw-web{position:absolute; top:0; width:150px; height:150px; pointer-events:none; opacity:.5; z-index:1;}
.hw-web.l{left:0;} .hw-web.r{right:0; transform:scaleX(-1);}
@media (max-width:700px){.hw-web{width:96px;height:96px;}}

/* Chauves-souris */
.hw-bat{position:absolute; left:-70px; width:58px; height:32px; pointer-events:none; z-index:1; opacity:0; animation:hwVol linear infinite;}
.hw-bat svg{width:100%; height:100%; overflow:visible; animation:hwBat .28s ease-in-out infinite alternate; transform-origin:50% 50%;}
@keyframes hwVol{0%{transform:translate(0,0); opacity:0} 6%{opacity:.95} 50%{transform:translate(55vw,-26px)} 94%{opacity:.95} 100%{transform:translate(118vw,18px); opacity:0}}
@keyframes hwBat{from{transform:scaleY(1)} to{transform:scaleY(.45)}}

/* Piliers : citrouilles à la place des cœurs */
[data-theme="halloween"] .pillar::before{content:"🎃"; color:inherit; font-size:1.25rem; top:-17px;}

/* Boutons et blocs */
[data-theme="halloween"] .cta-banner{background:linear-gradient(120deg,#C2410C,#8F2D06);}
[data-theme="halloween"] .fold-dark{background:#2A1340; border-color:#2A1340;}
[data-theme="halloween"] .fold-dark.open{border-color:var(--lune);}
[data-theme="halloween"] .fold-dark .fold-icon{background:var(--red);}
[data-theme="halloween"] footer{background:#1B0C29;}
[data-theme="halloween"] .band-dark{background:#2A1340 !important;}
[data-theme="halloween"] .band-pink{background:#FFE2C8;}
[data-theme="halloween"] .urgence-box{background:#6B2FA0;}
[data-theme="halloween"] .eyebrow{color:var(--red-deep);}
[data-theme="halloween"] .pillar::before{background:var(--cream); padding:0 0 0 8px; line-height:1; font-size:1.35rem; top:-16px; z-index:1;}