/* ============================================================
   VIMAB REVEAL — frontend.css
   Blur-fokus reveal när element scrollas in i viewport.
   ============================================================ */


/* ---- vm-reveal: enskilt element fadar/fokuserar in ---- */
.vm-reveal {
  opacity: 0;
  filter: blur(18px);
  /* will-change förbereder GPU-compositing — slänger blur snabbare på mobil */
  will-change: filter, opacity;
}
.vm-reveal.is-revealed {
  opacity: 1;
  filter: blur(0);
  transition: filter 850ms cubic-bezier(0.16, 1, 0.3, 1),
              opacity 650ms ease-out;
}


/* ---- vm-reveal-stagger: barn-element staggrar in ---- */
/* JS taggar de faktiska barnen med .vm-reveal-child + sätter inline
   transition-delay per barn. Det hanterar både egna grids OCH
   BB-strukturer (fl-row → fl-col, fl-col → fl-module). */
.vm-reveal-child {
  opacity: 0;
  filter: blur(14px);
  will-change: filter, opacity;
}
.vm-reveal-stagger.is-revealed .vm-reveal-child {
  opacity: 1;
  filter: blur(0);
  transition: filter 700ms cubic-bezier(0.16, 1, 0.3, 1),
              opacity 500ms ease-out;
  /* transition-delay sätts inline av JS per barn (i * 80ms) */
}


/* ---- BB-editor failsafe ---- */
/* Om scriptet trots PHP-guard ändå laddas i BB-editor (t.ex. via cachad bundle),
   se till att inga element är dolda. Annars verkar editorn trasig. */
.fl-builder-edit .vm-reveal,
.fl-builder-edit .vm-reveal-child {
  opacity: 1 !important;
  filter: none !important;
  transition: none !important;
}


/* ---- Reduced motion respekteras ---- */
@media (prefers-reduced-motion: reduce) {
  .vm-reveal,
  .vm-reveal-child {
    opacity: 1 !important;
    filter: none !important;
    transition: none !important;
  }
}