/* ============================================================
   GRAMY WROCŁAW — ruch w wypożyczalni (ten sam język wiązek)
   Nowość pod reflektorem, follow spot na kartach, światło do koszyka.
   Wymaga assets/css/motion.css (wiązki .spot-beam). Klasę rm-ready
   ustawia assets/js/rental-motion.js — bez skryptu nic nie jest przygaszone.
   ============================================================ */

/* ---------- 1. Nowości: produkt pod reflektorem ---------- */
/* Zarejestrowane kąty, żeby wiązki płynnie zbiegały się na aktywnej nowości. */
@property --rest{syntax:'<angle>';inherits:false;initial-value:0deg}
@property --range{syntax:'<angle>';inherits:false;initial-value:7deg}
.rental-new-image .spot-rig{inset:-70% -45% -14%;overflow:visible;border-radius:0}
.rental-new-image .spot-beam{
  opacity:.3;
  transition:opacity .8s var(--ease),--rest .7s var(--ease),--range .7s var(--ease);
}
.rental-new-card.is-lit .spot-beam{opacity:.95;--range:1.5deg}
.rental-new-card.is-lit .spot-beam.s1{--rest:-19deg}
.rental-new-card.is-lit .spot-beam.s2{--rest:0deg}
.rental-new-card.is-lit .spot-beam.s3{--rest:19deg}
.rm-ready .rental-new-image img{
  filter:drop-shadow(0 14px 20px rgba(0,0,0,.5)) brightness(.7) saturate(.85);
  transition:filter .8s var(--ease);
}
.rm-ready .rental-new-card.is-lit .rental-new-image img{filter:drop-shadow(0 14px 20px rgba(0,0,0,.5)) brightness(1.08) saturate(1)}

/* ---------- 2. Karty produktów: follow spot ---------- */
.rm-ready .prod{position:relative}
.rm-ready.reveal-ready .prod.rv{transition:opacity .5s var(--ease),transform .4s var(--ease),border-color .4s,box-shadow .4s}
.rm-ready .prod::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;
  background:radial-gradient(300px circle at var(--mx,50%) var(--my,22%),rgba(244,244,245,.11),rgba(165,23,51,.07) 45%,transparent 70%);
  mix-blend-mode:screen;transition:opacity .4s var(--ease);
}
.rm-ready .prod-ico{transition:color .3s,border-color .4s var(--ease),box-shadow .4s var(--ease)}
.rm-ready .prod-thumb{transition:filter .45s var(--ease),transform .45s var(--ease)}
.rm-ready .prod.is-spot::after{opacity:1}
.rm-ready .prod.is-spot .prod-ico{border-color:rgba(244,244,245,.34);box-shadow:0 0 22px rgba(244,244,245,.14)}
.rm-ready .prod.is-spot .prod-thumb{filter:brightness(1.18);transform:scale(1.06)}
@media(hover:hover) and (pointer:fine){
  .rm-ready .prod:hover::after{opacity:1}
  .rm-ready.reveal-ready .prod.rv.in:hover{transform:translateY(-3px)}
  .rm-ready .prod:hover .prod-ico{border-color:rgba(244,244,245,.34);box-shadow:0 0 22px rgba(244,244,245,.14)}
  .rm-ready .prod:hover .prod-thumb{filter:brightness(1.18);transform:scale(1.06)}
}

/* Filtr kategorii: wybrany przycisk zapala się jak cue. */
.rm-ready .filters .chip.active{animation:rm-chip .6s var(--ease)}
@keyframes rm-chip{
  0%{box-shadow:0 0 0 0 rgba(165,23,51,0)}
  40%{box-shadow:0 0 26px 2px rgba(165,23,51,.75)}
  100%{box-shadow:0 0 0 0 rgba(165,23,51,0)}
}

/* ---------- 3. „Dodaj": światło leci do koszyka ---------- */
.rm-spark{position:fixed;left:0;top:0;z-index:95;width:0;height:0;pointer-events:none}
.rm-spark b{
  position:absolute;left:-6px;top:-6px;width:12px;height:12px;border-radius:50%;background:#fff;
  box-shadow:0 0 0 3px rgba(244,244,245,.22),0 0 18px 6px rgba(165,23,51,.9),0 0 46px 14px rgba(165,23,51,.45);
}

@media(prefers-reduced-motion:reduce){
  .rental-new-image .spot-beam{transition:none}
  .rm-ready .prod::after{display:none}
  .rm-ready .filters .chip.active{animation:none}
}