/* Halloween 2026 campaign layer (scoped to body.pp-season-halloween). See docs/halloween-2026/SPEC.md.
   CHROME surfaces: shared tokens + components (code chip, countdown, pumpkin) and the global chrome
   (promo bar, menu item, mega card, basket nudge, FAQ row, footer night scene).
   Motion is transform / opacity / filter only; all decorative motion stops under reduced motion. */

/* ---------- tokens ---------- */
body.pp-season-halloween{
  /* one navy (brand audit 2026-10-11): the night IS the brand navy, so campaign and evergreen surfaces never seam */
  --hw-night:var(--pp-navy,#032139); --hw-night-2:var(--pp-navy-2,#08304F);
  --hw-pumpkin:#FF7A1A; --hw-pumpkin-deep:#E5600A; --hw-pumpkin-ink:#B54700;
  --hw-moon:#FFF3DC;
  --hw-candle:#FFD27A; /* jack-o'-lantern face light (decorative fills only) */
}

/* ---------- pumpkin icon (pp_pumpkin_svg) ---------- */
body.pp-season-halloween .pp-pumpkin{display:inline-block;flex:0 0 auto;width:1.15em;height:1.15em;vertical-align:-.2em;overflow:visible}

/* ---------- countdown (pp_campaign_countdown) — tabular digits so ticking never shifts layout ---------- */
body.pp-season-halloween .pp-countdown{display:inline-block;white-space:nowrap;font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;letter-spacing:.01em}

/* ---------- code chip (pp_campaign_code_chip) — tap to copy; .is-copied swaps label for "Copied" ---------- */
body.pp-season-halloween .pp-codechip{
  /* night (default): pumpkin tint over a near-opaque night fill, so the #FF7A1A code keeps >= 6:1 on dark bands
     and photos alike (a bare 10% tint let bright photo areas drop it under 4.5:1) */
  --chip-fg:var(--hw-moon,#FFF3DC); --chip-code:var(--hw-pumpkin,#FF7A1A);
  --chip-bg:linear-gradient(rgba(255,122,26,.1),rgba(255,122,26,.1)),rgba(3,33,57,.86);
  --chip-bg-hover:linear-gradient(rgba(255,122,26,.2),rgba(255,122,26,.2)),rgba(3,33,57,.86);
  --chip-bd:rgba(255,122,26,.8); --chip-done:#CBFF00; --chip-ring:#CBFF00;
  position:relative;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;
  margin:0;padding:.32em .78em;border:1.5px dashed var(--chip-bd);border-radius:var(--pp-radius-pill,999px);
  background:var(--chip-bg);color:var(--chip-fg);font:inherit;font-weight:700;line-height:1.2;white-space:nowrap;
  cursor:pointer;-webkit-tap-highlight-color:transparent;
  transition:background-color var(--pp-dur) var(--pp-ease),border-color var(--pp-dur) var(--pp-ease),transform var(--pp-dur) var(--pp-ease),box-shadow var(--pp-dur) var(--pp-ease)
}
body.pp-season-halloween .pp-codechip:hover{background:var(--chip-bg-hover);transform:translateY(-1px);box-shadow:0 4px 14px rgba(255,122,26,.18)}
body.pp-season-halloween .pp-codechip:active{transform:scale(.95)}
body.pp-season-halloween .pp-codechip:focus-visible{outline:2px solid var(--chip-ring);outline-offset:2px}
body.pp-season-halloween .pp-codechip__label{display:inline-flex;align-items:center;gap:.42em;transition:opacity var(--pp-dur) var(--pp-ease)}
body.pp-season-halloween .pp-codechip__code{color:var(--chip-code);font-weight:800;letter-spacing:.06em}
body.pp-season-halloween .pp-codechip__ic{flex:0 0 auto;width:1em;height:1em;opacity:.85}
body.pp-season-halloween .pp-codechip__done{position:absolute;inset:0;display:inline-flex;align-items:center;justify-content:center;gap:.3em;white-space:nowrap;color:var(--chip-done);font-weight:800;opacity:0;transform:translateY(3px);pointer-events:none;transition:opacity var(--pp-dur) var(--pp-ease),transform var(--pp-dur) var(--pp-ease)}
body.pp-season-halloween .pp-codechip.is-copied{border-style:solid;border-color:var(--chip-done)}
body.pp-season-halloween .pp-codechip.is-copied .pp-codechip__label{opacity:0}
body.pp-season-halloween .pp-codechip.is-copied .pp-codechip__done{opacity:1;transform:none}
/* on white / light surfaces: ink-pumpkin code (>=4.5:1 on the cream fill), green "Copied" */
body.pp-season-halloween .pp-codechip--light{--chip-fg:var(--hw-night,#032139);--chip-code:var(--hw-pumpkin-ink,#B54700);--chip-bg:#FFF4EA;--chip-bg-hover:#FFE8D4;--chip-bd:var(--hw-pumpkin-ink,#B54700);--chip-done:var(--pp-success,#0E7C57);--chip-ring:var(--hw-pumpkin-ink,#B54700)}
/* pumpkin fill with night text (7.3:1) — badges / stickers */
body.pp-season-halloween .pp-codechip--pumpkin{--chip-fg:var(--hw-night,#032139);--chip-code:var(--hw-night,#032139);--chip-bg:var(--hw-pumpkin,#FF7A1A);--chip-bg-hover:#FF8B38;--chip-bd:rgba(3,33,57,.55);--chip-done:var(--hw-night,#032139);--chip-ring:var(--hw-moon,#FFF3DC)}
body.pp-season-halloween .pp-codechip--pumpkin.is-copied{border-color:var(--hw-night,#032139)}

/* ---------- chrome-only cartoon moves (pumpkins use the shared halloween-motion.css modifiers) ---------- */
@keyframes pp-hwc-blink{0%,90%,100%{transform:scaleY(1)}93%{transform:scaleY(.12)}96%{transform:scaleY(1)}}
@keyframes pp-hwc-swing{0%,100%{transform:rotate(-10deg)}50%{transform:rotate(12deg)}}
@keyframes pp-hwc-peek{0%,6%{transform:translateY(66px) rotate(0)}16%{transform:translateY(2px) rotate(-6deg)}24%{transform:translateY(6px) rotate(4deg)}34%{transform:translateY(3px) rotate(-3deg)}44%{transform:translateY(5px) rotate(2deg)}54%,100%{transform:translateY(66px) rotate(0)}}
@keyframes pp-hwc-glow{0%,100%{opacity:.72}50%{opacity:1}}

/* ---------- promo bar (header.php, campaign branch) ---------- */
body.pp-season-halloween .pp-promo--hw{
  --pp-accent:var(--hw-pumpkin,#FF7A1A);
  position:relative;overflow:hidden;isolation:isolate;
  background:linear-gradient(90deg,var(--hw-night,#032139) 0%,var(--hw-night-2,#08304F) 50%,var(--hw-night,#032139) 100%);
  border-bottom:1px solid rgba(255,122,26,.3);color:var(--hw-moon,#FFF3DC)
}
/* candle glow pooled under the offer */
body.pp-season-halloween .pp-promo--hw::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(42% 160% at 50% 135%,rgba(255,122,26,.26),transparent 70%)}
body.pp-season-halloween .pp-promo--hw .pp-promo__in{position:relative;z-index:1;min-height:44px;gap:.6rem;flex-wrap:nowrap}
/* Owner (2026-10-11): night-court motion to match the hero, kept calm. 1) the candle glow breathes like a
   lantern (opacity only, never a flash); 2) a band of mist drifts through; 3) one bat silhouette flits across
   now and then. All transform/opacity; reduced motion = still bar. */
body.pp-season-halloween .pp-promo--hw::after{animation:pp-promo-candle 5.2s ease-in-out infinite}
@keyframes pp-promo-candle{0%,100%{opacity:1}18%{opacity:.78}24%{opacity:.95}46%{opacity:.84}60%{opacity:1}78%{opacity:.8}84%{opacity:.92}}
body.pp-season-halloween .pp-promo__mist{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
body.pp-season-halloween .pp-promo__mist::before{content:"";position:absolute;top:-30%;bottom:-30%;left:0;width:200%;opacity:.55;
  background:
    radial-gradient(18% 70% at 10% 70%,rgba(190,210,230,.16),transparent 70%),
    radial-gradient(14% 60% at 32% 40%,rgba(190,210,230,.12),transparent 70%),
    radial-gradient(20% 75% at 60% 68%,rgba(190,210,230,.15),transparent 70%),
    radial-gradient(15% 60% at 84% 45%,rgba(190,210,230,.12),transparent 70%);
  animation:pp-promo-mist 38s linear infinite;will-change:transform}
@keyframes pp-promo-mist{from{transform:translateX(0)}to{transform:translateX(-50%)}}
body.pp-season-halloween .pp-promo__bat{position:absolute;top:6px;left:0;z-index:0;width:22px;pointer-events:none;opacity:0;
  animation:pp-promo-bat 18s linear 3s infinite}
body.pp-season-halloween .pp-promo__bat svg{display:block;width:100%;height:auto;overflow:visible;fill:#04111F;filter:drop-shadow(0 0 3px rgba(255,122,26,.55))}
body.pp-season-halloween .pp-promo__wing{transform-origin:32px 14px;animation:pp-promo-flap .22s ease-in-out infinite alternate}
@keyframes pp-promo-flap{from{transform:scaleY(1)}to{transform:scaleY(.35)}}
@keyframes pp-promo-bat{
  0%{opacity:0;transform:translate(-40px,14px) rotate(6deg)}
  2%{opacity:1}
  10%{transform:translate(30vw,2px) rotate(-6deg)}
  20%{transform:translate(62vw,16px) rotate(5deg)}
  30%{opacity:1;transform:translate(calc(100vw + 40px),4px) rotate(-4deg)}
  31%,100%{opacity:0;transform:translate(calc(100vw + 40px),4px)}}
body.pp-season-halloween .pp-promo--hw .pp-promo__tag{color:#fff}
@media (prefers-reduced-motion:reduce){
  body.pp-season-halloween .pp-promo--hw::after,body.pp-season-halloween .pp-promo__mist::before{animation:none}
  body.pp-season-halloween .pp-promo__bat{display:none}
}
body.pp-season-halloween .pp-promo--hw .pp-promo__pumpkin{width:24px;height:24px;filter:drop-shadow(0 0 6px rgba(255,122,26,.55))}
body.pp-season-halloween .pp-promo__hw{margin:0;max-width:none;display:inline-flex;align-items:center;flex-wrap:wrap;justify-content:center;gap:.25rem .5rem;color:var(--hw-moon,#FFF3DC);font-weight:600}
/* the offer ("Halloween Sale · UP TO 70% OFF") links to the sale; the code chip is a sibling button */
body.pp-season-halloween .pp-promo__link{display:inline-flex;align-items:center;gap:inherit;color:inherit;text-decoration:none;border-radius:4px;-webkit-tap-highlight-color:transparent}
body.pp-season-halloween .pp-promo__link:is(:hover,:focus-visible) :is(.pp-promo__tag,.pp-promo__big){text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}
body.pp-season-halloween .pp-promo__link:focus-visible{outline:2px solid var(--hw-pumpkin,#FF7A1A);outline-offset:2px}
body.pp-season-halloween .pp-promo__tag{font-size:.78em;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--hw-pumpkin,#FF7A1A)}
body.pp-season-halloween .pp-promo__big{font-family:var(--pp-font-display);font-size:1.12em;font-weight:800;letter-spacing:.01em;text-transform:uppercase;color:#fff;text-shadow:0 0 18px rgba(255,122,26,.45)}
body.pp-season-halloween .pp-promo__plus{color:rgba(255,243,220,.88)}
body.pp-season-halloween .pp-promo__dot{color:rgba(255,243,220,.42)}
body.pp-season-halloween .pp-promo__ends{display:inline-flex;align-items:baseline;gap:.35em;color:rgba(255,243,220,.88)}
body.pp-season-halloween .pp-promo__cd{color:var(--hw-pumpkin,#FF7A1A);font-weight:800}
body.pp-season-halloween .pp-promo--hw .pp-codechip{font-size:.92em;padding:.16em .62em}
/* invisible >= 44px-tall tap target for the short chip (kept narrow sideways so it never covers the offer link) */
body.pp-season-halloween .pp-promo--hw .pp-codechip::after{content:"";position:absolute;inset:-13px -4px}
/* desktop / mobile copy variants (display:none keeps the hidden variant out of the a11y tree) */
body.pp-season-halloween .pp-promo--hw .pp-promo__only-m{display:none}
body.pp-season-halloween .pp-promo--hw:not(.pp-promo--final) .pp-promo__only-final{display:none!important}
body.pp-season-halloween .pp-promo--final .pp-promo__not-final{display:none!important}
/* final 48h: the pool of light burns hotter and the clock breathes */
body.pp-season-halloween .pp-promo--final::after{background:radial-gradient(55% 190% at 50% 130%,rgba(255,122,26,.4),transparent 72%)}
body.pp-season-halloween .pp-promo--final .pp-promo__cd{animation:pp-hwc-glow 1.6s ease-in-out infinite}
/* phone: the calm bar ("HALLOWEEN SALE · UP TO 70% OFF") stays on one line; 44px tap target */
@media (max-width:600px){
  body.pp-season-halloween .pp-promo--hw{font-size:.76rem}
  body.pp-season-halloween .pp-promo--hw .pp-promo__in{min-height:44px;padding-block:.32rem;padding-inline:0}
  body.pp-season-halloween .pp-promo__link{padding-block:.3rem;white-space:nowrap}
  body.pp-season-halloween .pp-promo__big{font-size:1.06em;letter-spacing:0}
}
@media (max-width:359px){
  body.pp-season-halloween .pp-promo--hw{font-size:.64rem}
  body.pp-season-halloween .pp-promo--hw .pp-promo__plus{display:none}
}
/* ---------- chrome bat flock (footer sign-off) ----------
   Self-contained: the shared flock in halloween-motion.css deliberately excludes .pp-bats--footer. Per-bat tunables: --w wingspan, --y height in the box, --x0/--x1 start/end (vw),
   --dy arc, --r0/--r1 bank, --dur/--delay loop (flight = first 30%, then the sky stays clear). */
body.pp-season-halloween .pp-bats--footer{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
body.pp-season-halloween .pp-bats--footer .pp-bat{position:absolute;left:0;top:var(--y,50%);display:block;width:var(--w,24px);margin:calc(var(--w,24px) / -4) 0 0 calc(var(--w,24px) / -2);opacity:0;will-change:transform;animation:pp-hwc-fly var(--dur,19s) linear var(--delay,0s) infinite both}
body.pp-season-halloween .pp-bats--footer .pp-bat__svg{display:block;width:100%;height:auto;overflow:visible;fill:#0B0B12;filter:drop-shadow(0 0 1px rgba(203,255,0,.7)) drop-shadow(0 0 5px rgba(203,255,0,.22));animation:pp-hwc-lift .3s ease-in-out infinite alternate}
body.pp-season-halloween .pp-bats--footer .pp-bat__wing{transform-box:view-box;transform-origin:32px 14px;animation:pp-hwc-flap-l var(--flap,.16s) ease-in-out infinite alternate}
body.pp-season-halloween .pp-bats--footer .pp-bat__wing--r{animation-name:pp-hwc-flap-r}
@keyframes pp-hwc-fly{
  0%{transform:translateX(var(--x0,-4vw)) translateY(0) rotate(var(--r0,8deg));opacity:0}
  3%,27%{opacity:1}
  15%{transform:translateX(calc((var(--x0,-4vw) + var(--x1,104vw)) / 2)) translateY(var(--dy,-6px)) rotate(0deg)}
  30%,100%{transform:translateX(var(--x1,104vw)) translateY(0) rotate(var(--r1,-8deg));opacity:0}
}
@keyframes pp-hwc-lift{from{transform:translateY(8%)}to{transform:translateY(-8%)}}
@keyframes pp-hwc-flap-l{from{transform:rotate(20deg) scaleY(1)}to{transform:rotate(-16deg) scaleY(.5)}}
@keyframes pp-hwc-flap-r{from{transform:rotate(-20deg) scaleY(1)}to{transform:rotate(16deg) scaleY(.5)}}

/* ---------- primary menu: "Halloween Sale" (header, mobile drawer, footer column) ---------- */
body.pp-season-halloween .pp-nav__list .pp-nav__hw>a{display:inline-flex;align-items:center;gap:.4rem;color:var(--hw-pumpkin-ink,#B54700);font-weight:700;border-radius:var(--pp-radius-pill);transition:color var(--pp-dur) var(--pp-ease),background-color var(--pp-dur) var(--pp-ease)}
body.pp-season-halloween .pp-nav__list .pp-nav__hw>a:hover,body.pp-season-halloween .pp-nav__list .pp-nav__hw.current-menu-item>a{color:var(--hw-pumpkin-ink,#B54700);background:rgba(255,122,26,.12)}
/* shared wobble, slowed so the nav only twitches every ~7s; hover jelly comes from the motion layer */
body.pp-season-halloween .pp-nav__pumpkin{width:1.3em;height:1.3em;animation-duration:7.2s;--pp-pumpkin-delay:1.2s}
@media (min-width:1081px){
  /* pill hover without shifting the row: padding is paid back with negative margin */
  body.pp-season-halloween .pp-nav__list .pp-nav__hw>a{padding-inline:.7rem;margin-inline:-.7rem}
}
@media (max-width:1080px){
  body.pp-season-halloween .pp-nav__list>.pp-nav__hw>a{display:flex;border-radius:10px}
}
body.pp-season-halloween .pp-footer__list .pp-nav__hw>a{display:inline-flex;align-items:center;gap:.45rem;color:var(--hw-pumpkin,#FF7A1A);font-weight:700}
body.pp-season-halloween .pp-footer__list .pp-nav__hw>a:hover{color:#FFB27A}

/* ---------- mega-menu feature card (campaign art + pumpkin sticker) ---------- */
body.pp-season-halloween .pp-nav__list .pp-mega__card--hw{background:var(--hw-night,#032139);box-shadow:inset 0 0 0 1px rgba(255,122,26,.28)}
body.pp-season-halloween .pp-nav__list .pp-mega__card--hw::before{background:linear-gradient(to top,rgba(3,33,57,.97),rgba(3,33,57,.55) 54%,rgba(3,33,57,.04))}
body.pp-season-halloween .pp-nav__list .pp-mega__card--hw .pp-mega__eyebrow{color:var(--hw-pumpkin,#FF7A1A);font-size:.72rem;text-shadow:0 0 2px rgba(3,33,57,.95),0 1px 6px rgba(3,33,57,.9)} /* tight halo keeps >= 4.5:1 over the lit pumpkin glow */
body.pp-season-halloween .pp-nav__list .pp-mega__card--hw .pp-mega__title{color:var(--hw-moon,#FFF3DC);white-space:normal;text-wrap:balance}
body.pp-season-halloween .pp-nav__list .pp-mega__card--hw .pp-mega__eyebrow,body.pp-season-halloween .pp-nav__list .pp-mega__card--hw .pp-mega__cta{white-space:normal}
body.pp-season-halloween .pp-nav__list .pp-mega__sticker{position:absolute;top:.75rem;right:.75rem;z-index:2;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:rgba(3,33,57,.6);box-shadow:0 0 0 1px rgba(255,122,26,.45),0 0 22px rgba(255,122,26,.45)}
body.pp-season-halloween .pp-nav__list .pp-mega__pumpkin{width:27px;height:27px}

/* ---------- basket drawer + basket page: HALLOWEEN15 nudge ---------- */
body.pp-season-halloween .pp-hwnudge{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.4rem .7rem;margin:0 0 var(--pp-space-4);padding:.62rem .75rem;border:1px solid rgba(181,71,0,.24);border-radius:calc(var(--pp-radius) + 2px);background:linear-gradient(135deg,#FFF7EF,#FFEBDA)}
body.pp-season-halloween .pp-hwnudge__pumpkin{width:28px;height:28px;flex:0 0 auto;--pp-pumpkin-delay:.8s}
body.pp-season-halloween .pp-hwnudge__txt{min-width:0;max-width:none;margin:0;font-size:.85rem;line-height:1.38;color:var(--pp-ink,#15161A)}
body.pp-season-halloween .pp-hwnudge__txt strong{color:var(--hw-pumpkin-ink,#B54700);font-weight:800}
body.pp-season-halloween .pp-hwnudge__txt .pp-hwnudge__amt,body.pp-season-halloween .pp-hwnudge__txt .pp-hwnudge__amt .woocommerce-Price-amount{color:var(--pp-ink,#15161A);white-space:nowrap}
body.pp-season-halloween .pp-hwnudge .pp-codechip{font-size:.8rem}
body.pp-season-halloween .pp-hwnudge--applied{grid-template-columns:auto minmax(0,1fr);background:linear-gradient(135deg,#F1FBF6,#E4F6EC);border-color:rgba(14,124,87,.3)}
body.pp-season-halloween .pp-hwnudge--applied .pp-hwnudge__txt strong{color:var(--pp-success,#0E7C57)}
body.pp-season-halloween .pp-cart-shipbar .pp-hwnudge{margin:var(--pp-space-3) 0 0}
body.pp-season-halloween .pp-drawer .pp-hwnudge{margin:0 0 var(--pp-space-3);grid-template-columns:auto minmax(0,1fr)}
/* narrow drawer: pumpkin spans both rows, chip sits under the line it completes */
body.pp-season-halloween .pp-drawer .pp-hwnudge__pumpkin{grid-row:span 2}
body.pp-season-halloween .pp-drawer .pp-hwnudge .pp-codechip{grid-column:2;justify-self:start}
body.pp-season-halloween .pp-drawer .pp-hwnudge--applied .pp-hwnudge__pumpkin{grid-row:auto}
@media (max-width:600px){
  body.pp-season-halloween .pp-cart-shipbar .pp-hwnudge{grid-template-columns:auto minmax(0,1fr)}
  body.pp-season-halloween .pp-cart-shipbar .pp-hwnudge__pumpkin{grid-row:span 2}
  body.pp-season-halloween .pp-cart-shipbar .pp-hwnudge .pp-codechip{grid-column:2;justify-self:start}
  body.pp-season-halloween .pp-cart-shipbar .pp-hwnudge--applied .pp-hwnudge__pumpkin{grid-row:auto}
}

/* ---------- FAQ: campaign row (home/PDP accordion + FAQ page) ---------- */
body.pp-season-halloween .pp-faq__item--hw{border-color:rgba(255,122,26,.5);background:linear-gradient(180deg,#FFF7EF,var(--pp-surface,#fff) 72%);box-shadow:0 0 0 3px rgba(255,122,26,.09)}
body.pp-season-halloween .pp-faq__item--hw .pp-faq__q{justify-content:flex-start;gap:.65rem}
body.pp-season-halloween .pp-faq__item--hw .pp-faq__q::after{margin-left:auto;color:var(--hw-pumpkin-ink,#B54700)}
body.pp-season-halloween .pp-faq__pumpkin{width:1.45em;height:1.45em;animation-duration:6s}
/* keyboard focus: the item's overflow:hidden clips an outside outline, so draw the ring inside the row */
body.pp-season-halloween .pp-faq__q:focus-visible{outline-offset:-3px;border-radius:inherit}
body.pp-season-halloween .pp-faq__item--hw .pp-faq__q:focus-visible{outline:2px solid var(--hw-pumpkin-ink,#B54700)}

/* ---------- footer night scene ---------- */
/* (the EKG spark's lime -> pumpkin tint lives in halloween-motion.css) */
/* a ghost (with a lime padel bat) peeks over the newsletter field */
body.pp-season-halloween .pp-footer__cta-form{position:relative}
body.pp-season-halloween .pp-hwpeek{position:absolute;right:clamp(1.4rem,5vw,3rem);bottom:100%;width:82px;height:66px;overflow:hidden;pointer-events:none}
body.pp-season-halloween .pp-hwpeek__ghost{position:absolute;left:4px;top:4px;width:70px;height:70px;transform:translateY(8px);transform-origin:50% 100%;animation:pp-hwc-peek 8s var(--pp-ease) 1.5s infinite both}
body.pp-season-halloween .pp-cghost__eyes{transform-origin:37.5px 32px;animation:pp-hwc-blink 3.6s linear infinite}
body.pp-season-halloween .pp-cghost__bat{transform-origin:61px 50px;animation:pp-hwc-swing 1.6s ease-in-out infinite}
@media (max-width:980px){ body.pp-season-halloween .pp-footer__cta{row-gap:3.6rem} }
/* sign-off: a moon rises behind the wordmark, bats cross it, jack-o'-lanterns line the bottom */
body.pp-season-halloween .pp-footer__sign{padding-top:clamp(2.6rem,6.5vw,6rem)}
body.pp-season-halloween .pp-footer__sign>span{-webkit-text-stroke:1.4px rgba(255,214,170,.17);text-stroke:1.4px rgba(255,214,170,.17)}
/* glow kept inside the sign's top padding so the overflow clip never shows an edge */
/* sized so it sets above the letters' cap line (it never sits on an outline) */
body.pp-season-halloween .pp-hwmoon{position:absolute;z-index:-1;top:clamp(1.1rem,2vw,1.8rem);left:71%;width:clamp(52px,5.9vw,85px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle at 36% 62%,rgba(196,150,92,.26) 0 8%,transparent 9%),radial-gradient(circle at 63% 34%,rgba(196,150,92,.22) 0 11%,transparent 12%),radial-gradient(circle at 70% 70%,rgba(196,150,92,.18) 0 6%,transparent 7%),radial-gradient(circle at 32% 30%,#FFFBF1 0,#FFF0D2 46%,#F4DAA8 82%,#E9C98F 100%);
  box-shadow:0 0 14px 3px rgba(255,226,170,.28),0 0 30px 8px rgba(255,160,70,.12);opacity:.9}
/* bats cross the moon. The footer's `.pp-footer__sign span` rule (giant wordmark) also matches the
   bat spans, so its type settings are reset here (its transform is replaced by the flight). */
body.pp-season-halloween .pp-footer__sign .pp-bats--footer .pp-bat{font-size:0;line-height:0;letter-spacing:0;white-space:normal;text-align:left;color:inherit;-webkit-text-stroke:0;text-stroke:0;
  --w:38px;--y:34%;--x0:50vw;--x1:104vw;--dy:-26px;--dur:16s;--delay:1s;--r0:10deg;--r1:-8deg}
body.pp-season-halloween .pp-footer__sign .pp-bats--footer .pp-bat--2{--w:27px;--y:20%;--x0:100vw;--x1:58vw;--dy:18px;--delay:2.2s;--r0:-8deg;--r1:9deg;--flap:.14s}
body.pp-season-halloween .pp-footer__sign .pp-bats--footer .pp-bat--3{--w:19px;--y:12%;--x0:60vw;--x1:104vw;--dy:-12px;--delay:3.4s;--flap:.12s}
/* jack-o'-lantern rows */
body.pp-season-halloween .pp-hwpatch{position:absolute;bottom:0;z-index:2;display:flex;align-items:flex-end;gap:clamp(.1rem,.6vw,.45rem);pointer-events:none}
body.pp-season-halloween .pp-hwpatch::before{content:"";position:absolute;left:-18%;right:-18%;bottom:-16px;height:34px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,122,26,.42),transparent);z-index:-1}
body.pp-season-halloween .pp-hwpatch--l{left:clamp(.6rem,1.4vw,1.2rem)} /* tucked left so the smallest pumpkin clears the "H" */
body.pp-season-halloween .pp-hwpatch--r{right:clamp(.6rem,5vw,4.5rem)}
body.pp-season-halloween .pp-hwpatch__p{--s:clamp(30px,3.8vw,56px);width:var(--s);height:var(--s);filter:drop-shadow(0 0 12px rgba(255,140,40,.5))}
body.pp-season-halloween .pp-hwpatch--l .pp-hwpatch__p--2{--s:clamp(40px,5.2vw,76px);--pp-pumpkin-delay:1.1s;--pp-flicker-delay:-1.4s}
body.pp-season-halloween .pp-hwpatch--l .pp-hwpatch__p--3{--s:clamp(24px,2.8vw,40px);--pp-pumpkin-delay:2s;--pp-flicker-delay:-.7s}
body.pp-season-halloween .pp-hwpatch--r .pp-hwpatch__p--1{--s:clamp(26px,3vw,44px);--pp-pumpkin-delay:3.1s;--pp-flicker-delay:-2.2s}
body.pp-season-halloween .pp-hwpatch--r .pp-hwpatch__p--2{--s:clamp(36px,4.6vw,66px);--pp-pumpkin-delay:.4s;--pp-flicker-delay:-2.9s}
/* 561-1399px: the wordmark scales at ~76vw and leaves only ~12vw each side, so the rows and the moon size in vw
   too (the desktop sizes above would reach the "H" / final "L" and the moon would touch the cap line) */
@media (min-width:561px) and (max-width:1399px){
  body.pp-season-halloween .pp-hwmoon{top:clamp(.6rem,1.6vw,1.8rem);width:clamp(40px,5.9vw,85px)}
  body.pp-season-halloween .pp-hwpatch{gap:.35vw}
  body.pp-season-halloween .pp-hwpatch--l{left:1vw}
  body.pp-season-halloween .pp-hwpatch--r{right:1.2vw}
  body.pp-season-halloween .pp-hwpatch--l .pp-hwpatch__p--1{--s:clamp(18px,3vw,56px)}
  body.pp-season-halloween .pp-hwpatch--l .pp-hwpatch__p--2{--s:clamp(24px,4.2vw,76px)}
  body.pp-season-halloween .pp-hwpatch--l .pp-hwpatch__p--3{--s:clamp(14px,2.3vw,40px)}
  body.pp-season-halloween .pp-hwpatch--r .pp-hwpatch__p--1{--s:clamp(18px,3vw,44px)}
  body.pp-season-halloween .pp-hwpatch--r .pp-hwpatch__p--2{--s:clamp(24px,4.4vw,66px)}
}
@media (max-width:560px){
  /* small moon above the cap line; two jack-o'-lanterns per side on a strip below the wordmark, not on its letters */
  body.pp-season-halloween .pp-hwmoon{left:82%;top:.2rem;width:40px}
  body.pp-season-halloween .pp-footer__sign{padding-bottom:38px}
  body.pp-season-halloween .pp-hwpatch{bottom:-6px}
  body.pp-season-halloween .pp-hwpatch--l{left:clamp(.6rem,5vw,4.5rem)}
  body.pp-season-halloween .pp-hwpatch--l .pp-hwpatch__p--3{display:none}
  body.pp-season-halloween .pp-hwpatch .pp-hwpatch__p--1{--s:26px}
  body.pp-season-halloween .pp-hwpatch .pp-hwpatch__p--2{--s:32px}
  body.pp-season-halloween .pp-footer__sign .pp-bats--footer .pp-bat{--w:24px;--x0:40vw;--x1:104vw;--dy:-14px}
  body.pp-season-halloween .pp-footer__sign .pp-bats--footer .pp-bat--2{--w:17px;--x0:104vw;--x1:48vw;--dy:10px}
  body.pp-season-halloween .pp-footer__sign .pp-bats--footer .pp-bat--3{display:none}
  body.pp-season-halloween .pp-hwpeek{width:66px;height:54px}
  body.pp-season-halloween .pp-hwpeek__ghost{width:58px;height:58px}
}

/* ---------- reduced motion: everything decorative holds still (pumpkins + bats: halloween-motion.css) ---------- */
@media (prefers-reduced-motion:reduce){
  body.pp-season-halloween .pp-promo--final .pp-promo__cd,
  body.pp-season-halloween .pp-hwpeek__ghost,
  body.pp-season-halloween .pp-cghost__eyes,
  body.pp-season-halloween .pp-cghost__bat{animation:none!important}
  body.pp-season-halloween .pp-footer__sign .pp-bats--footer{display:none}
  body.pp-season-halloween .pp-hwpeek__ghost{transform:translateY(6px)}
  body.pp-season-halloween .pp-codechip,
  body.pp-season-halloween .pp-codechip__label,
  body.pp-season-halloween .pp-codechip__done{transition:none}
}

/* ---------- ghost rail (pp_campaign_ghostline) — replaces the EKG pulse line in the hero + footer ----------
   A faint court baseline; three small ghosts hide behind it and take turns peeking over it (one at a time,
   12s cycle, 4s apart), eyes blinking, padel bat swinging — the newsletter peeker's family. The rail clips
   them at the line, so a hidden ghost is simply below it. */
body.pp-season-halloween .pp-ghostline{position:relative;z-index:2;height:42px;clip-path:inset(-90px -60px 0 -60px);pointer-events:none;line-height:0} /* clips only BELOW the line, so the lunge can rise above it */
body.pp-season-halloween .pp-ghostline::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent 0,rgba(255,243,220,.18) 8%,rgba(255,243,220,.18) 92%,transparent 100%)}
body.pp-season-halloween .pp-ghostline__g{position:absolute;bottom:0;width:40px;height:40px;transform:translateY(100%);transform-origin:50% 100%;
  animation:pp-ghostline-peek 12s cubic-bezier(.22,1,.36,1) var(--gd,0s) infinite both}
body.pp-season-halloween .pp-ghostline__g--1{left:16%;--gd:0s}
body.pp-season-halloween .pp-ghostline__g--2{left:54%;--gd:4s}
body.pp-season-halloween .pp-ghostline__g--3{left:84%;--gd:8s}
body.pp-season-halloween .pp-ghostline__svg{display:block;width:40px;height:40px;transform-origin:50% 100%}
/* the scare: it peeks, looks left-right… then the eyes flare ember-red, a pumpkin glow flashes behind it and it
   lunges up at you, then drops back behind the line. Eyes + glow share the ghost's own delay (--gd). */
@keyframes pp-ghostline-peek{
  0%,6%{transform:translateY(100%) scale(1) rotate(0)}
  12%{transform:translateY(30%) scale(1) rotate(-6deg)}
  17%{transform:translateY(32%) scale(1) rotate(6deg)}
  22%{transform:translateY(30%) scale(1) rotate(0)}
  24%{transform:translateY(36%) scale(.96,1.04) rotate(0)}
  26.5%{transform:translateY(-8%) scale(1.32) rotate(0)}
  29%{transform:translateY(0) scale(1.24) rotate(-2deg)}
  33%{transform:translateY(28%) scale(1) rotate(0)}
  38%,100%{transform:translateY(100%) scale(1) rotate(0)}}
body.pp-season-halloween .pp-ghostline .pp-cghost__eyes{animation:pp-ghostline-eyes 12s linear var(--gd,0s) infinite both}
@keyframes pp-ghostline-eyes{
  0%,23.5%{fill:#032139;filter:none}
  25%,31%{fill:#FF3B1A;filter:drop-shadow(0 0 3px #FF3B1A) drop-shadow(0 0 7px rgba(255,59,26,.8))}
  33%,100%{fill:#032139;filter:none}}
body.pp-season-halloween .pp-ghostline__g::before{content:"";position:absolute;left:50%;bottom:10%;width:90px;height:60px;transform:translateX(-50%);
  border-radius:50%;background:radial-gradient(closest-side,rgba(255,122,26,.55),rgba(255,59,26,0));opacity:0;
  animation:pp-ghostline-flare 12s linear var(--gd,0s) infinite both;pointer-events:none;z-index:-1}
@keyframes pp-ghostline-flare{0%,23.5%{opacity:0}26.5%{opacity:1}31%{opacity:.6}35%,100%{opacity:0}}
body.pp-season-halloween .pp-ghostline--hero{height:36px}
body.pp-season-halloween .pp-ghostline--hero .pp-ghostline__g,
body.pp-season-halloween .pp-ghostline--hero .pp-ghostline__svg{width:34px;height:34px}
@media (max-width:600px){
  body.pp-season-halloween .pp-ghostline__g--1{left:10%}
  body.pp-season-halloween .pp-ghostline__g--3{left:80%}
}
/* still (reduced motion or "Pause animations"): one ghost peeks, the others stay behind the line */
@media (prefers-reduced-motion:reduce){
  body.pp-season-halloween .pp-ghostline__g{animation:none;transform:translateY(100%)}
  body.pp-season-halloween .pp-ghostline__g::before,body.pp-season-halloween .pp-ghostline .pp-cghost__eyes{animation:none}
  body.pp-season-halloween .pp-ghostline__g--2{transform:translateY(25%)}
}
body.pp-season-halloween.pp-motion-paused .pp-ghostline__g{animation:none;transform:translateY(100%)}
body.pp-season-halloween.pp-motion-paused .pp-ghostline__g::before,body.pp-season-halloween.pp-motion-paused .pp-ghostline .pp-cghost__eyes{animation:none}
body.pp-season-halloween.pp-motion-paused .pp-ghostline__g--2{transform:translateY(25%)}
/* paused footer peeker: rest where it is visible, not frozen mid-cycle below the form */
body.pp-season-halloween.pp-motion-paused .pp-hwpeek__ghost{animation:none;transform:translateY(8px)}
body.pp-season-halloween .pp-footer__cta-pk{width:16px;height:16px}
body.pp-season-halloween .pp-faqsec__pk{width:16px;height:16px} /* help card kicker: static pumpkin in place of the pulse (campaign) */
/* help card (home + PDP): landscape shop photo — keep the assistant (right third) in frame on the near-square desktop
   card, and darken the left so the copy sits on the navy wall, not on him */
body.pp-season-halloween .pp-faqsec__card{background-position:80% center}
body.pp-season-halloween .pp-faqsec__card::after{background:
  linear-gradient(90deg,rgba(3,33,57,.88) 0%,rgba(3,33,57,.6) 38%,rgba(3,33,57,.1) 62%,rgba(3,33,57,0) 80%),
  linear-gradient(180deg,rgba(3,33,57,0) 45%,rgba(3,33,57,.55) 78%,rgba(3,33,57,.88) 100%)}