/* NordVaekst.net SAFE dynamic layer */

:root {
  --nv-safe-ease: cubic-bezier(.16, 1, .3, 1);
}

/* Ambient background disabled for performance.
   Dynamic feel comes from scroll reveal + hover, not GPU-heavy fixed blur.
*/

/* Initial reveal state: only elements marked by JS */
html.nv-safe-dynamic [data-nv-safe-animate] {
  opacity: 0;
  will-change: opacity, transform;
  transition:
    opacity 620ms var(--nv-safe-ease),
    transform 620ms var(--nv-safe-ease);
}

html.nv-safe-dynamic [data-nv-safe-animate="left"] {
  transform: translate3d(-72px, 18px, 0) scale(.982);
}

html.nv-safe-dynamic [data-nv-safe-animate="right"] {
  transform: translate3d(72px, 18px, 0) scale(.982);
}

html.nv-safe-dynamic [data-nv-safe-animate="up"] {
  transform: translate3d(0, 34px, 0) scale(.986);
}

html.nv-safe-dynamic [data-nv-safe-animate].nv-safe-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

html.nv-safe-dynamic [data-nv-safe-delay="1"] { transition-delay: 70ms; }
html.nv-safe-dynamic [data-nv-safe-delay="2"] { transition-delay: 140ms; }
html.nv-safe-dynamic [data-nv-safe-delay="3"] { transition-delay: 210ms; }

/* Hover only on confirmed safe cards */
@media (hover: hover) and (pointer: fine) {
  html.nv-safe-dynamic [data-nv-safe-hover="card"] {
    transition:
      opacity 620ms var(--nv-safe-ease),
      transform 190ms var(--nv-safe-ease),
      border-color 220ms ease,
      box-shadow 220ms ease,
      filter 220ms ease !important;
  }

  html.nv-safe-dynamic [data-nv-safe-hover="card"].nv-safe-visible:hover {
    transform: translateY(-7px) scale(1.012) !important;
    border-color: rgba(94, 234, 212, .46) !important;
    box-shadow:
      0 24px 70px rgba(0, 0, 0, .38),
      0 0 0 1px rgba(94, 234, 212, .16),
      0 0 42px rgba(51, 230, 160, .13) !important;
    filter: saturate(1.05);
  }
}

/* Button shine inside safe cards */
html.nv-safe-dynamic [data-nv-safe-hover="card"] a,
html.nv-safe-dynamic [data-nv-safe-hover="card"] button {
  position: relative;
  overflow: hidden;
}

html.nv-safe-dynamic [data-nv-safe-hover="card"] a::after,
html.nv-safe-dynamic [data-nv-safe-hover="card"] button::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  transform: translateX(-140%);
  transition: transform 620ms var(--nv-safe-ease);
  background: linear-gradient(110deg, transparent, rgba(255,255,255,.16), transparent);
}

html.nv-safe-dynamic [data-nv-safe-hover="card"] a:hover::after,
html.nv-safe-dynamic [data-nv-safe-hover="card"] button:hover::after {
  transform: translateX(140%);
}

/* Protect graph/mockup/floating widgets */
[data-nv-safe-protect],
[data-nv-safe-protect] *,
[class*="whatsapp"],
[class*="WhatsApp"],
[class*="help"],
[class*="Help"],
.nv-bot,
.whatsapp,
.whatsapp-float {
  animation: none !important;
}

/* Keep icons visible */
html.nv-safe-dynamic [data-nv-safe-hover="card"] [class*="icon"],
html.nv-safe-dynamic [data-nv-safe-hover="card"] img,
html.nv-safe-dynamic [data-nv-safe-hover="card"] svg {
  position: relative;
  z-index: 5;
  opacity: 1;
  visibility: visible;
}

@media (max-width: 760px) {
  html.nv-safe-dynamic [data-nv-safe-animate="left"],
  html.nv-safe-dynamic [data-nv-safe-animate="right"],
  html.nv-safe-dynamic [data-nv-safe-animate="up"] {
    transform: translate3d(0, 24px, 0) scale(.988);
  }

  html.nv-safe-dynamic [data-nv-safe-animate].nv-safe-visible {
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  html.nv-safe-dynamic body::after {
    animation: none !important;
  }

  html.nv-safe-dynamic [data-nv-safe-animate] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* =========================================================
   Guide hub boost: more visible but still smooth
   Only applies on guides pages
   ========================================================= */

html.nv-safe-dynamic body.nv-guides-page [data-nv-guide-animate] {
  opacity: 0;
  will-change: opacity, transform;
  transition:
    opacity 720ms var(--nv-safe-ease),
    transform 720ms var(--nv-safe-ease),
    border-color 220ms ease,
    box-shadow 220ms ease,
    filter 220ms ease;
}

html.nv-safe-dynamic body.nv-guides-page [data-nv-guide-animate="left"] {
  transform: translate3d(-110px, 24px, 0) scale(.965);
}

html.nv-safe-dynamic body.nv-guides-page [data-nv-guide-animate="right"] {
  transform: translate3d(110px, 24px, 0) scale(.965);
}

html.nv-safe-dynamic body.nv-guides-page [data-nv-guide-animate="up"] {
  transform: translate3d(0, 54px, 0) scale(.972);
}

html.nv-safe-dynamic body.nv-guides-page [data-nv-guide-animate].nv-guide-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

html.nv-safe-dynamic body.nv-guides-page [data-nv-guide-delay="1"] { transition-delay: 90ms; }
html.nv-safe-dynamic body.nv-guides-page [data-nv-guide-delay="2"] { transition-delay: 180ms; }
html.nv-safe-dynamic body.nv-guides-page [data-nv-guide-delay="3"] { transition-delay: 270ms; }

@media (hover: hover) and (pointer: fine) {
  html.nv-safe-dynamic body.nv-guides-page [data-nv-guide-animate].nv-guide-visible:hover {
    transform: translateY(-8px) scale(1.014) !important;
    border-color: rgba(94, 234, 212, .50) !important;
    box-shadow:
      0 26px 78px rgba(0, 0, 0, .40),
      0 0 0 1px rgba(94, 234, 212, .18),
      0 0 46px rgba(51, 230, 160, .14) !important;
  }
}

@media (max-width: 760px) {
  html.nv-safe-dynamic body.nv-guides-page [data-nv-guide-animate="left"],
  html.nv-safe-dynamic body.nv-guides-page [data-nv-guide-animate="right"],
  html.nv-safe-dynamic body.nv-guides-page [data-nv-guide-animate="up"] {
    transform: translate3d(0, 34px, 0) scale(.982);
  }

  html.nv-safe-dynamic body.nv-guides-page [data-nv-guide-animate].nv-guide-visible {
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  html.nv-safe-dynamic body.nv-guides-page [data-nv-guide-animate] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}