/* 716 Spotlight - small touches, site-wide (Rich, 2026-10-15): a warm glow on cards you point at,
   a pulsing gold "Tonight" pill on tonight's events, and a light that sweeps across the logo now and
   then. Decorative only: no words change, and anyone who asks for less motion gets none. */

/* card hover glow - calendar cards glow in their own category colour, story cards in gold */
@media (hover:hover){
  .card{transition:transform .16s,border-color .16s,box-shadow .2s}
  .card:hover{box-shadow:0 14px 34px -12px color-mix(in srgb,var(--ac,#F5D33B) 70%,transparent),0 0 0 1px color-mix(in srgb,var(--ac,#F5D33B) 35%,transparent)}
  .story-card,.adv-story-card,.what-card{transition:transform .18s,box-shadow .2s}
  .story-card:hover,.adv-story-card:hover,.what-card:hover{transform:translateY(-3px);box-shadow:0 16px 36px -14px rgba(245,211,59,.6),0 0 0 1px rgba(245,211,59,.45)}
  /* the homepage list is rows, not cards: a gold bar lights up beside the row */
  .ev{position:relative}
  .ev::before{content:"";position:absolute;left:-14px;top:18px;bottom:18px;width:3px;border-radius:3px;background:#F5D33B;
    box-shadow:0 0 12px rgba(245,211,59,.8);opacity:0;transition:opacity .18s}
  .ev:hover::before{opacity:1}
}

/* "Tonight" pill */
.tn-pill{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  padding:5px 10px 5px 8px;border-radius:999px;background:#F5D33B;color:#001030;line-height:1;white-space:nowrap;
  box-shadow:0 0 0 0 rgba(245,211,59,.7);animation:tn-pulse 2.4s ease-out infinite}
.tn-pill::before{content:"";width:7px;height:7px;border-radius:50%;background:#001030;opacity:.85}
.thumb > .tn-pill{position:absolute;top:11px;right:13px;z-index:2}
.ev .t .tn-pill{margin-top:6px;align-self:flex-start;width:max-content}
@keyframes tn-pulse{0%{box-shadow:0 0 0 0 rgba(245,211,59,.7)}70%{box-shadow:0 0 0 9px rgba(245,211,59,0)}100%{box-shadow:0 0 0 0 rgba(245,211,59,0)}}

/* logo light sweep: a band of warm light crosses the logo itself (masked to its shape), every 12s */
.lg-sweep{position:absolute;pointer-events:none;z-index:1;
  -webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  background:linear-gradient(105deg,transparent 41%,rgba(255,206,64,.85) 46.5%,#fffbe8 50%,rgba(255,206,64,.85) 53.5%,transparent 59%) no-repeat;
  background-size:300% 100%;background-position:130% 0;animation:lg-sweep 12s 1.6s ease-in-out infinite}
@keyframes lg-sweep{0%{background-position:130% 0}11%{background-position:-30% 0}100%{background-position:-30% 0}}

@media (prefers-reduced-motion:reduce){
  .tn-pill{animation:none}
  .lg-sweep{display:none}
  .card:hover,.story-card:hover,.adv-story-card:hover,.what-card:hover{transform:none}
}