/* premium-motion : collective border glow  (yewho-web-effects 2.3, Phase 9)
   Pairs with gridglow.js. Move the cursor over a card GRID and a soft glow
   travels along the borders of every nearby card — one shared light source,
   not per-card hover (the "Linear grid" look).

   Markup: add .md-gridglow to the GRID, nothing to the cards:
     <div class="grid md-gridglow" style="--gg-c:rgba(200,16,46,.85)">
       <div class="card">…</div> …
     </div>
   Cards need a border-radius for the ring to follow (inherit handles it).
   Tune: --gg-c (glow colour), --gg-r (reach, def 240px).
   Fine pointers + full tier only; elsewhere it's simply inert.
   ============================================================ */
@media (hover:hover) and (pointer:fine){
  .md-gridglow > *{ position:relative; }
  .md-gridglow > *::after{
    content:""; position:absolute; inset:-1px; border-radius:inherit; padding:1px;
    background: radial-gradient(var(--gg-r,240px) circle at var(--gx,-999px) var(--gy,-999px),
                var(--gg-c,rgba(200,16,46,.85)), transparent 70%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor; mask-composite: exclude;
    pointer-events:none; opacity:0;
    transition: opacity .35s var(--md-ease,cubic-bezier(.22,.61,.2,1));
  }
  .md-gridglow.gg-on > *::after{ opacity:1; }
  /* optional soft interior wash on the card actually under the cursor */
  .md-gridglow.wash > *::before{
    content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
    background: radial-gradient(calc(var(--gg-r,240px) * .8) circle at var(--gx,-999px) var(--gy,-999px),
                color-mix(in srgb, var(--gg-c,rgba(200,16,46,.85)) 10%, transparent), transparent 72%);
    opacity:0; transition: opacity .35s var(--md-ease,cubic-bezier(.22,.61,.2,1));
  }
  .md-gridglow.wash.gg-on > *::before{ opacity:1; }
}
:root[data-motion="lite"] .md-gridglow > *::after,
:root[data-motion="off"]  .md-gridglow > *::after,
:root[data-motion="lite"] .md-gridglow > *::before,
:root[data-motion="off"]  .md-gridglow > *::before{ display:none; }