/* iSplash Sites - Animation CSS */

/* Entrance animation keyframes. Spatial magnitude is driven by the per-element
   --anim-intensity custom property (0-1, default 0.5). The defaults below
   resolve to the historical fixed values at 0.5 (30px / scale .8 / 90deg /
   180deg) so sites that never set an intensity publish byte-identically. G28. */
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes slideUp { from { opacity: 0; transform: translateY(calc(var(--anim-intensity, 0.5) * 60px)); } to { opacity: 1; transform: translateY(0); } }
@keyframes slideDown { from { opacity: 0; transform: translateY(calc(var(--anim-intensity, 0.5) * -60px)); } to { opacity: 1; transform: translateY(0); } }
@keyframes slideLeft { from { opacity: 0; transform: translateX(calc(var(--anim-intensity, 0.5) * 60px)); } to { opacity: 1; transform: translateX(0); } }
@keyframes slideRight { from { opacity: 0; transform: translateX(calc(var(--anim-intensity, 0.5) * -60px)); } to { opacity: 1; transform: translateX(0); } }
@keyframes zoomIn { from { opacity: 0; transform: scale(calc(1 - var(--anim-intensity, 0.5) * 0.4)); } to { opacity: 1; transform: scale(1); } }
@keyframes flipIn { from { opacity: 0; transform: perspective(400px) rotateY(calc(var(--anim-intensity, 0.5) * 180deg)); } to { opacity: 1; transform: perspective(400px) rotateY(0); } }
@keyframes rotateIn { from { opacity: 0; transform: rotate(calc(var(--anim-intensity, 0.5) * -360deg)); } to { opacity: 1; transform: rotate(0); } }

/* Hover animations */
:where([data-hover], [data-hover-animation]) { transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms cubic-bezier(0.22, 1, 0.36, 1), outline-color 220ms ease-out, outline-offset 220ms ease-out, filter 220ms ease-out; transform-origin: center center; backface-visibility: hidden; will-change: transform; }
:where([data-hover="zoom"], [data-hover-animation="zoom"]):hover { transform: scale(1.05) !important; }
:where([data-hover="scale"], [data-hover-animation="scale"]):hover { transform: scale(1.08) !important; }
:where([data-hover="shadow-lift"], [data-hover-animation="shadow-lift"]):hover { box-shadow: 0 10px 25px rgba(0,0,0,0.15) !important; transform: translateY(-3px) !important; }
:where([data-hover="glow"], [data-hover-animation="glow"]):hover { box-shadow: 0 0 20px color-mix(in srgb, var(--theme-primary, var(--color-primary, #2563eb)) 40%, transparent) !important; }
:where([data-hover="border-reveal"], [data-hover-animation="border-reveal"]):hover { outline: 2px solid var(--theme-primary, var(--color-primary, #2563eb)) !important; outline-offset: 2px; }
:where([data-hover="overlay"], [data-hover-animation="overlay"]):hover { filter: brightness(0.94) !important; }

/* Respect reduced motion preference */
@media (prefers-reduced-motion: reduce) {
  [data-animate-trigger] { opacity: 1 !important; animation: none !important; }
  :where([data-hover], [data-hover-animation]) { transition: none !important; will-change: auto; }
  :where([data-hover], [data-hover-animation]):hover { transform: none !important; box-shadow: none !important; filter: none !important; }
}
