/* ═════════════ Card glow layer (all pages) — loads last ═════════════
   Every card gets a coloured rim + soft halo in its own accent colour
   (--c when the card has one, otherwise a rotating brand colour).
   Desktop: glows breathe gently and brighten on hover.
   Phones / reduced-motion: steady glow, no animation (smooth scrolling). */

:is(.cat-card,.prod,.feat,.trust,.card,.spot,.how-step,.note,.pep,.coa,.dl,.t-sec,.quick a,.res,.app-card,.why-media,.video-frame,.info-tile,.how-panel,.empty,.disclaimer,.cta-band,.factory,.pipeline,.steps,.fact,.bd){
  --gfall:#ff0066;
  --gc:var(--c,var(--gfall));
  box-shadow:
    0 0 0 1px color-mix(in srgb,var(--gc) 32%,transparent),
    0 0 28px -8px color-mix(in srgb,var(--gc) 55%,transparent),
    0 16px 40px -18px rgba(0,0,0,.7);
  transition:box-shadow .35s ease,transform .35s cubic-bezier(.22,1,.36,1);
}
:is(.cat-card,.prod,.feat,.card,.spot,.how-step,.note,.pep,.coa,.dl,.t-sec,.quick a,.res,.fact,.bd):nth-child(4n+2){--gfall:#00e5ff;}
:is(.cat-card,.prod,.feat,.card,.spot,.how-step,.note,.pep,.coa,.dl,.t-sec,.quick a,.res,.fact,.bd):nth-child(4n+3){--gfall:#b65cff;}
:is(.cat-card,.prod,.feat,.card,.spot,.how-step,.note,.pep,.coa,.dl,.t-sec,.quick a,.res,.fact,.bd):nth-child(4n){--gfall:#ffb800;}

/* hover: brighter rim + bigger halo */
:is(.cat-card,.prod,.feat,.card,.spot,.how-step,.pep,.coa,.dl,.t-sec,.quick a,.res,.info-tile,.why-media,.video-frame):hover{
  box-shadow:
    0 0 0 1.5px color-mix(in srgb,var(--gc) 70%,transparent),
    0 0 48px -6px color-mix(in srgb,var(--gc) 75%,transparent),
    0 24px 50px -20px rgba(0,0,0,.8);
}

/* desktop: gentle breathing glow (staggered so cards don't pulse in sync) */
@media (hover:hover) and (min-width:900px) and (prefers-reduced-motion:no-preference){
  @keyframes cardBreathe{
    0%,100%{box-shadow:0 0 0 1px color-mix(in srgb,var(--gc) 30%,transparent),0 0 24px -8px color-mix(in srgb,var(--gc) 45%,transparent),0 16px 40px -18px rgba(0,0,0,.7);}
    50%{box-shadow:0 0 0 1px color-mix(in srgb,var(--gc) 50%,transparent),0 0 40px -6px color-mix(in srgb,var(--gc) 70%,transparent),0 16px 40px -18px rgba(0,0,0,.7);}
  }
  :is(.cat-card,.prod,.feat,.spot,.how-step,.dl,.t-sec,.quick a,.res,.why-media,.video-frame,.trust,.pipeline,.factory,.cta-band):not(:hover){animation:cardBreathe 5s ease-in-out infinite;}
  :is(.cat-card,.prod,.feat,.spot,.how-step,.dl,.t-sec,.quick a,.res):nth-child(2){animation-delay:-1.2s;}
  :is(.cat-card,.prod,.feat,.spot,.how-step,.dl,.t-sec,.quick a,.res):nth-child(3){animation-delay:-2.4s;}
  :is(.cat-card,.prod,.feat,.spot,.how-step,.dl,.t-sec,.quick a,.res):nth-child(4){animation-delay:-3.6s;}
  :is(.cat-card,.prod,.feat,.spot,.how-step,.dl,.t-sec,.quick a,.res):nth-child(5){animation-delay:-.6s;}
  :is(.cat-card,.prod,.feat,.spot,.how-step,.dl,.t-sec,.quick a,.res):nth-child(6){animation-delay:-1.8s;}
  :is(.cat-card,.prod,.feat,.spot,.how-step,.dl,.t-sec,.quick a,.res):nth-child(7){animation-delay:-3s;}
}

/* light theme: softer halos */
[data-theme="light"] :is(.cat-card,.prod,.feat,.trust,.card,.spot,.how-step,.note,.pep,.coa,.dl,.t-sec,.quick a,.app-card,.info-tile,.how-panel,.empty,.disclaimer,.fact,.bd){
  box-shadow:0 0 0 1px color-mix(in srgb,var(--gc) 30%,transparent),0 0 22px -10px color-mix(in srgb,var(--gc) 45%,transparent),0 12px 28px -16px rgba(40,16,64,.25);
}