/* Halloween decorations (seasonal; delete this file + inc/halloween.php + shared/halloween.html to remove) */
.afd-hw{position:fixed;top:0;left:0;width:100%;height:100vh;pointer-events:none;z-index:1;overflow:hidden;contain:strict;transform:translate3d(0,0,0);-webkit-transform:translate3d(0,0,0);will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden}
/* 1.0.6: the layer is promoted to its own GPU layer so the browser keeps painting it while the page scrolls (previously it was dropped during scroll and only repainted when scrolling stopped). */
.afd-hw *{pointer-events:none}
.afd-hw svg{shape-rendering:geometricPrecision;overflow:visible}
.afd-hw{--g:300px}
.afd-hw-web{position:absolute;top:0;left:0;width:var(--g);height:var(--g)}
.afd-hw-spider{position:absolute;top:70px;left:calc(var(--g) * .3);width:40px;height:40px;animation:afd-hw-drop 7s ease-in-out infinite}
.afd-hw-spider svg{display:block;width:40px;height:40px}
.afd-hw-thread{position:absolute;bottom:28px;left:19px;width:1.5px;height:600px;background:#c8d0da;box-shadow:0 0 0 .5px rgba(10,22,40,.35)}
@keyframes afd-hw-drop{0%,100%{transform:translateY(0)}50%{transform:translateY(140px)}}
.afd-hw-pumpkin{position:absolute;left:8px;bottom:12px;width:160px;height:160px;}
.afd-hw-flame{filter:drop-shadow(0 0 3px rgba(255,150,30,.9));transform-origin:32px 52px;animation:afd-hw-flick .45s ease-in-out infinite alternate}
.afd-hw-mouth{animation:afd-hw-glow 1.8s ease-in-out infinite alternate}
@keyframes afd-hw-flick{0%{transform:scale(1,.85);opacity:.85}100%{transform:scale(1.08,1.15);opacity:1}}
@keyframes afd-hw-glow{0%{fill:#ffb52e}100%{fill:#ffe27a}}
@media (prefers-reduced-motion:reduce){.afd-hw-spider,.afd-hw-flame,.afd-hw-mouth{animation:none}}
@media print{.afd-hw{display:none}}
@media (max-width:767px){.afd-hw{--g:180px}.afd-hw-pumpkin{width:100px;height:100px}.afd-hw-spider{top:44px}}
/* Header (sticky, z-index:80, opaque white) always covers the decorations; web starts at 0,0 and hides behind header/logo. */
/* Background layer: decorations sit above section backgrounds but under all text, media and controls */
body :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,blockquote,figcaption,label,a,button,input,select,textarea,img,picture,video,svg,figure,form,table,.stat):not(.afd-hw *):not(.site-header *):not(.yt-embed iframe):not(.sr-only):not(.yt-play-icon):not(.safety-bg):not(.hero-overlay){position:relative;z-index:2}
/* Photo sections without their own background colour: drop isolation so decorations sit between the photo (z<0) and the text (z:2) */
body :is(.hero,.page-hero,.freight-band){isolation:auto}
/* Dark bands that paint their own background: the whole band goes in front of the decorations */
body :is(.steps-band,.stats,.safety-band){position:relative;z-index:2}
/* Animated/transformed text wrappers create stacking contexts; lift them (transparent boxes, so decorations still show in the gaps) */
body :is(.hero-content,.reveal,.form-card,.step-num):not(.afd-hw *){position:relative;z-index:2}