/* ============================================================
   season-halloween.css — Mrs Makeup Halloween Theme
   Loaded automatically when config.php has:
     define('SEASON', 'halloween');
   To revert after Halloween:
     define('SEASON', 'default');
   ============================================================ */

:root {
  --accent:       #5e2ca5;   /* deep witch purple          */
  --accent-light: #ede8f7;   /* soft lavender tint         */
  --accent-dark:  #4a1f87;   /* deeper purple — hover/focus */
}

/* ── Hero: stacking context for the witch + Halloween background ── */
.hero {
  position:            relative;
  overflow:            hidden;
  background-image:    url('../images/halloween-hero.webp');
  background-size:     cover;
  background-position: center;
}

/* Container sits above the witch */
.hero .container { position: relative; z-index: 2; }

/* ── Hovering witch — large, behind the h1 ── */
#mm-witch {
  position:       absolute;
  top:            50%;
  left:           8%;
  transform:      translateY(-50%);
  width:          360px;
  height:         360px;
  pointer-events: none;
  z-index:        1;
  opacity:        0.9;
}

@media (max-width: 900px) {
  #mm-witch { width: 220px; height: 220px; left: 4%; opacity: 0.7; }
}

@media (max-width: 640px) {
  #mm-witch { width: 160px; height: 160px; left: 0; top: auto; bottom: 0; transform: none; opacity: 0.6; }
}