/* Coop's standing decisions on the Heat-map neon pack (25 Oct 2026). Loaded after css/heatmap-neon.css, which is the pack file
   unchanged. Both sections are Myself (Individual) only: [data-ind hidden], shown by js/site.js. */

/* The benefit band after the neon sign drops its inline 72px top margin, so the sign meets it edge to edge. */
.hm-neon-sign:not([hidden]) + .band-white{margin-top:0!important}

/* Neon sign: a clear gap between the CTA and the disclaimer (about 48px on desktop, 32px on phones). */
.hm-neon-sign-note{margin-top:clamp(32px,3.4vw,48px)}

/* Hot spots: the disclaimer sits under the example document (right column; straight after the document on phones). */
.hm-hotspots-stage{flex-direction:column;align-items:center}
.hm-hotspots-stage>.hm-hotspots-note{width:100%;max-width:560px;margin:30px 0 0;padding:0 6px}
@media (max-width:600px){.hm-hotspots-stage>.hm-hotspots-note{margin-top:22px;padding:0 2px}}

/* Hot spots: every flag in the example document glows and pulses slowly. Red (higher) strongest and fastest, orange (medium)
   next, yellow (lower) gentlest, with orange and yellow clearly visible on the paper. Slow swells only (2.4-4.6 s, no flashes,
   WCAG 2.3.1), staggered. Ink #1D1D1F stays >= 9:1 on the brightest fill. Reduced motion: steady glow, no pulse. */
@keyframes hm-hs-glow-h{0%,100%{background-color:rgba(239,46,39,.16);box-shadow:0 0 8px 2px rgba(239,46,39,.38),0 0 22px 8px rgba(239,46,39,.22)}
  50%{background-color:rgba(239,46,39,.36);box-shadow:0 0 14px 5px rgba(239,46,39,.75),0 0 44px 20px rgba(255,70,40,.5)}}
@keyframes hm-hs-glow-m{0%,100%{background-color:rgba(255,138,0,.2);box-shadow:0 0 8px 3px rgba(255,138,0,.5),0 0 22px 9px rgba(255,138,0,.28)}
  50%{background-color:rgba(255,138,0,.34);box-shadow:0 0 12px 5px rgba(255,138,0,.88),0 0 38px 17px rgba(255,120,0,.55)}}
@keyframes hm-hs-glow-l{0%,100%{background-color:rgba(255,212,0,.32);box-shadow:0 0 8px 3px rgba(255,212,0,.6),0 0 20px 8px rgba(255,176,0,.26)}
  50%{background-color:rgba(255,212,0,.5);box-shadow:0 0 11px 5px rgba(255,212,0,.95),0 0 32px 14px rgba(255,170,0,.5)}}
.hm-hotspots .hm-hotspots-flag--higher{animation:hm-hs-glow-h 2.4s ease-in-out infinite}
.hm-hotspots .hm-hotspots-flag--medium{animation:hm-hs-glow-m 3.4s ease-in-out infinite}
.hm-hotspots .hm-hotspots-flag--lower{animation:hm-hs-glow-l 4.6s ease-in-out infinite}
.hm-hotspots .hm-hotspots-doc-body p:nth-child(2) .hm-hotspots-flag--higher{animation-delay:-1.2s}
.hm-hotspots .hm-hotspots-doc-body p:nth-child(2) .hm-hotspots-flag--medium{animation-delay:-1.1s}
.hm-hotspots .hm-hotspots-doc-body p:nth-child(3) .hm-hotspots-flag--medium{animation-delay:-2.3s}
.hm-hotspots .hm-hotspots-doc-body p:nth-child(4) .hm-hotspots-flag--lower:nth-of-type(2){animation-delay:-1.5s}
.hm-hotspots .hm-hotspots-doc-body p:nth-child(1) .hm-hotspots-flag--lower{animation-delay:-3.1s}
.hm-hotspots.hm-wait .hm-hotspots-flag{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){
  .hm-hotspots .hm-hotspots-flag{animation:none}
  .hm-hotspots .hm-hotspots-flag--higher{background-color:rgba(239,46,39,.28);box-shadow:0 0 12px 4px rgba(239,46,39,.6),0 0 34px 14px rgba(255,70,40,.36)}
  .hm-hotspots .hm-hotspots-flag--medium{background-color:rgba(255,138,0,.28);box-shadow:0 0 10px 4px rgba(255,138,0,.72),0 0 30px 13px rgba(255,120,0,.42)}
  .hm-hotspots .hm-hotspots-flag--lower{background-color:rgba(255,212,0,.42);box-shadow:0 0 10px 4px rgba(255,212,0,.8),0 0 26px 11px rgba(255,170,0,.38)}}
