/* Seasonal palette */
.halloween { --hw-play-state:running; --witch-play-state:var(--hw-play-state); --cat-play-state:var(--hw-play-state); }
.theme-toggle[aria-pressed="true"] { color:#ffe4bc; background:#142c46; border-color:#dba369; }
.hw-decor { display:none; position:absolute; inset:0; overflow:hidden; z-index:0; pointer-events:none; }
.hw-accent { position:absolute; width:48px; height:48px; animation-name:var(--accent-animation,none); animation-duration:8s; animation-timing-function:ease-in-out; animation-iteration-count:infinite; animation-direction:alternate; animation-play-state:var(--hw-play-state,running); }
.hw-accent--1 { top:8px; left:12px; transform:rotate(-9deg); }
.hw-accent--2 { top:8px; right:12px; transform:rotate(9deg); }
.halloween main > section { background:#142d46; border-color:#405770; }
.halloween .hero { background:linear-gradient(145deg,#122e4b,#203b53); }
.halloween .hero h1,.halloween .section-heading h2,.halloween #tips h2,.halloween #equipo h2,.halloween #faq h2 { color:#f1f6fb; }
.halloween .hero .hero-copy > p,.halloween .section-heading > p { color:#d5e3f0; }
.halloween .section-kicker { color:#e9c8a7; }
.halloween .hw-decor { display:block; }
.halloween .pet-motif--1,.halloween .pet-motif--2 { visibility:hidden; }
.halloween .pet-motif--3 { opacity:.6; }
.halloween footer { background:#10263d; border-top-color:#d99a56; }
.halloween .pet-footer .hw-accent { width:28px; height:28px; top:10px; }
.halloween :focus-visible { outline-color:var(--accent-orange); box-shadow:0 0 0 5px var(--surface); }
.halloween .hw-overlay :focus-visible,.halloween .app-nav :focus-visible { outline-color:#ffc484; box-shadow:0 0 0 5px var(--primary); }
/* Characters follow the reader throughout the page */
.hw-flying-witch { display:none; position:absolute; top:0; left:0; z-index:2; width:140px; height:105px; padding:0; border:0; background:transparent; cursor:help; border-radius:var(--radius-lg); pointer-events:none; will-change:transform; }
.hw-flying-witch svg { pointer-events:auto; }
.halloween .hw-flying-witch { display:block; }
.hw-flying-witch svg { width:100%; height:100%; filter:drop-shadow(0 5px 9px #08152438); }
.witch-search-beam { animation-name:var(--beam-animation,search-lantern); animation-duration:3s; animation-timing-function:ease-in-out; animation-iteration-count:infinite; animation-direction:alternate; animation-play-state:var(--witch-play-state,running); transform-origin:192px 92px; }
.hw-flying-witch.is-speaking { --witch-play-state:paused; }
.hw-flying-witch:focus-visible { outline:3px solid #ffd1a3; outline-offset:-4px; }
@media (hover:hover) and (pointer:fine) { .hw-flying-witch:hover { --witch-play-state:paused; } }
/* Cats at the viewport edges */
.hw-overlay { position:fixed; inset:0; z-index:40; overflow:hidden; pointer-events:none; }
.hw-peek-cat { position:absolute; top:58%; z-index:1; width:64px; height:80px; border:0; padding:0; background:transparent; border-radius:22px; pointer-events:auto; animation-duration:24s; animation-timing-function:ease-in-out; animation-iteration-count:infinite; animation-play-state:var(--cat-play-state,running); }
.hw-peek-cat svg { width:100%; height:100%; filter:drop-shadow(0 3px 5px #0003); }
.hw-peek-cat--left { left:-22px; }
.hw-peek-cat--right { right:-22px; }
.hw-peek-cat:focus-visible { animation-name:none; transform:none; outline-offset:-4px; background:transparent; }
@media (hover:hover) and (pointer:fine) { .hw-peek-cat:hover { --cat-play-state:paused; } }
/* Dialogue and reactions */
.hw-meow-bubble { position:fixed; z-index:70; left:50%; bottom:calc(var(--app-nav-space) + 12px); transform:translateX(-50%); max-width:calc(100vw - 24px); padding:12px 16px; border:1px solid #d8a971; border-radius:var(--radius-lg); background:#20364d; color:#ffe1b3; pointer-events:none; font-size:.875rem; font-weight:700; }
.hw-witch-dialogue { position:fixed; z-index:70; padding:14px 16px; border:1px solid #c8ad8a; border-radius:18px; background:#fff6e7; color:#263b50; box-shadow:0 5px 20px #091c2e26; width:min(290px,calc(100vw - 24px)); font-size:.875rem; line-height:1.5; pointer-events:none; }
.hw-cat-called .hw-flying-witch svg { filter:drop-shadow(0 0 14px #e7c39355); }
.hw-motion-paused,.hw-background-paused { --hw-play-state:paused; }
/* Choreography */
@keyframes search-lantern { to { opacity:.26; transform:rotate(5deg); } }
/* Mobile */
@media (max-width:767px) { .hw-accent { width:32px; height:32px; top:6px; } .hw-flight-lane { height:110px; } .hw-flying-witch { width:145px; height:105px; } .hw-flying-witch:focus-visible { outline:3px solid #ffd1a3; outline-offset:-4px; } }
/* Reduced motion */
@media (prefers-reduced-motion:reduce) { .halloween { --flight-animation:none; --left-cat-animation:none; --right-cat-animation:none; --beam-animation:none; --accent-animation:none; } }
/* Print */
@media print { .halloween .hw-decor,.halloween .hw-flying-witch,.hw-peek-cat,.hw-meow-bubble,.hw-witch-dialogue { display:none; } }

/* Gaze follows the witch while the original cat silhouette stays unchanged. */
.hw-cat-gaze { transform:translate(var(--cat-look-x, 0px),var(--cat-look-y, 0px)); }

/* The viewport edge becomes the ledge held by the cat's paws. */
.hw-peek-cat::before { content:""; position:absolute; top:16px; bottom:7px; left:22px; width:3px; border-radius:3px; background:#a4b9cb; box-shadow:2px 0 5px #08152466; }
.hw-peek-cat--right::before { left:auto; right:22px; box-shadow:-2px 0 5px #08152466; }
.hw-peek-cat--right > svg { transform:scaleX(-1); }

/* Peek horizontally from a fixed anchor; return through the same edge. */
.hw-peek-cat { pointer-events:none; transition:transform 280ms ease-out; }
.hw-peek-cat--left { transform:translateX(-110%); }
.hw-peek-cat--right { transform:translateX(110%); }
.hw-peek-cat--left.is-peeking { transform:translateX(calc(-1 * var(--cat-peek-offset,0px))); pointer-events:auto; }
.hw-peek-cat--right.is-peeking { transform:translateX(var(--cat-peek-offset,0px)); pointer-events:auto; }
@media (prefers-reduced-motion:reduce) { .hw-peek-cat { transition:none; } }

/* Waiting is a gentle hover in place, independent from the flight path. */
.hw-witch-idle { transform-box:fill-box; transform-origin:center; }
.hw-flying-witch.is-speaking .hw-witch-idle { animation:witch-waiting 2.4s ease-in-out infinite; }
.hw-dialogue-hint { display:block; margin-top:8px; color:#72553b; font-size:.75rem; font-weight:700; }
.hw-waiting-dots { display:inline-block; animation:witch-listening 1.6s ease-in-out infinite; }
@keyframes witch-waiting { 0%,100% { transform:translateY(0) rotate(-1deg); } 50% { transform:translateY(-7px) rotate(1deg); } }
@keyframes witch-listening { 50% { opacity:.35; } }
@media(prefers-reduced-motion:reduce) { .hw-flying-witch.is-speaking .hw-witch-idle,.hw-waiting-dots { animation:none; } }
.hw-background-paused .hw-witch-idle,.hw-background-paused .hw-waiting-dots { animation-play-state:paused; }
