/* Shared modern effects for Omnira Soft templates.
   Loaded by every template — non-invasive: only opts in via [data-fx] or generic tags. */

/* ── Slow staggered entrance on load (all content) ──────────────── */
[data-fx-enter] {
  opacity: 0;
  transform: translate3d(0, 38px, 0);
  animation: fx-enter 1.25s cubic-bezier(.22,1,.36,1) forwards;
  animation-delay: var(--fx-enter-delay, 0s);
  will-change: opacity, transform;
}
[data-fx-enter][data-fx-enter-variant="left"]  { transform: translate3d(-42px, 0, 0); }
[data-fx-enter][data-fx-enter-variant="right"] { transform: translate3d(42px, 0, 0); }
[data-fx-enter][data-fx-enter-variant="scale"] { transform: scale(.92); }
[data-fx-enter][data-fx-enter-variant="blur"]  { filter: blur(14px); animation-name: fx-enter-blur; }
@keyframes fx-enter {
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes fx-enter-blur {
  to { opacity: 1; transform: translate3d(0, 0, 0); filter: blur(0); }
}

/* Base reveal-on-scroll (below-the-fold sections) */
[data-fx-reveal] {
  opacity: 0;
  transform: translate3d(0, 28px, 0);
  transition: opacity .9s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1);
  will-change: opacity, transform;
}
[data-fx-reveal].is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
[data-fx-reveal][data-fx-delay="1"] { transition-delay: .08s; }
[data-fx-reveal][data-fx-delay="2"] { transition-delay: .16s; }
[data-fx-reveal][data-fx-delay="3"] { transition-delay: .24s; }
[data-fx-reveal][data-fx-delay="4"] { transition-delay: .32s; }

/* Slow zoom on hero images */
[data-fx-zoom] {
  overflow: hidden;
  position: relative;
}
[data-fx-zoom]::after {
  content: "";
  position: absolute; inset: 0;
  background: inherit;
  background-size: cover;
  background-position: center;
  animation: fx-zoom 22s ease-in-out infinite alternate;
  pointer-events: none;
}
@keyframes fx-zoom {
  from { transform: scale(1); }
  to   { transform: scale(1.08); }
}

/* Ken-burns parallax on elements with data-fx-parallax (translated on scroll by JS) */
[data-fx-parallax] { will-change: transform; transition: transform .12s linear; }

/* Sheen: soft light sweep on hero images every ~12s */
[data-fx-sheen] { position: relative; overflow: hidden; }
[data-fx-sheen]::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(115deg, transparent 25%, rgba(255,255,255,.28) 46%, transparent 66%);
  transform: translateX(-120%);
  animation: fx-sheen 12s ease-in-out infinite;
  pointer-events: none;
  mix-blend-mode: overlay;
}
@keyframes fx-sheen {
  0%, 30%   { transform: translateX(-120%); }
  55%, 100% { transform: translateX(120%); }
}

/* Ambient floating orbs (opt-in via .fx-orbs container) */
.fx-orbs { position: relative; }
.fx-orbs::before,
.fx-orbs::after {
  content: "";
  position: absolute;
  width: 420px; height: 420px;
  border-radius: 50%;
  filter: blur(90px);
  opacity: .35;
  pointer-events: none;
  z-index: 0;
}
.fx-orbs::before { top: -120px; left: -140px; background: rgba(120, 180, 255, .55); animation: fx-drift 24s ease-in-out infinite; }
.fx-orbs::after  { bottom: -160px; right: -160px; background: rgba(232, 121, 249, .45); animation: fx-drift 30s ease-in-out infinite reverse; }
@keyframes fx-drift {
  0%,100% { transform: translate3d(0,0,0); }
  50%     { transform: translate3d(40px,-30px,0); }
}

/* Gentle text shimmer on gradient headings */
[data-fx-shine] {
  background-size: 220% auto !important;
  animation: fx-shine 8s linear infinite;
}
@keyframes fx-shine { to { background-position: 220% center; } }

/* Card hover lift when JS marks with data-fx-lift */
[data-fx-lift] {
  transition: transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s cubic-bezier(.22,1,.36,1);
}
[data-fx-lift]:hover {
  transform: translate3d(0,-6px,0);
  box-shadow: 0 30px 60px -30px rgba(0,0,0,.35);
}

@media (prefers-reduced-motion: reduce) {
  [data-fx-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }
  [data-fx-enter] { opacity: 1 !important; transform: none !important; filter: none !important; animation: none !important; }
  [data-fx-zoom]::after,
  [data-fx-sheen]::before,
  .fx-orbs::before,
  .fx-orbs::after,
  [data-fx-shine] { animation: none !important; }
}
