/* Homepage soft 3D depth — desktop only */

html.has-home-3d {
  --depth-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

html.has-home-3d main {
  perspective: 1600px;
  perspective-origin: 50% 42%;
}

html.has-home-3d .home-depth {
  position: relative;
  transform-style: preserve-3d;
  transform-origin: 50% 50%;
  will-change: transform, opacity;
  backface-visibility: hidden;
  transition: none;
}

html.has-home-3d .home-depth::before {
  content: none;
  display: none;
}

html.has-home-3d .home-principles {
  overflow: visible;
}

html.has-home-3d .home-principles__stack,
html.has-home-3d .home-principles__layout {
  transform-style: preserve-3d;
}

html.has-home-3d .home-hero.home-depth,
html.has-home-3d .home-features.home-depth {
  transform-style: flat;
}

html.has-home-3d .home-principles__row {
  transform: translateZ(0) scale(0.985);
  transform-style: preserve-3d;
}

html.has-home-3d .home-principles__row.is-active {
  transform: translateZ(28px) scale(1) !important;
  box-shadow: 0 22px 48px rgba(0, 0, 0, 0.38);
}

html.has-home-3d .home-principles__sticky {
  transform: translateZ(18px);
}

/* Flat, clean mobile UI — no 3D transforms */
@media (max-width: 991px) {
  html.has-home-3d main {
    perspective: none !important;
  }

  html.has-home-3d .home-depth,
  html.has-home-3d .home-principles__row,
  html.has-home-3d .home-principles__row.is-active,
  html.has-home-3d .home-principles__sticky {
    transform: none !important;
    opacity: 1 !important;
    filter: none !important;
    will-change: auto !important;
  }

  html.has-home-3d .home-depth::before {
    display: none !important;
  }

  html.has-home-3d .home-principles {
    overflow: clip;
  }

  html.has-home-3d .home-principles__row.is-active {
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28);
  }
}

@media (prefers-reduced-motion: reduce) {
  html.has-home-3d main {
    perspective: none;
  }

  html.has-home-3d .home-depth,
  html.has-home-3d .home-principles__row,
  html.has-home-3d .home-principles__row.is-active,
  html.has-home-3d .home-principles__sticky {
    transform: none !important;
    filter: none !important;
  }

  html.has-home-3d .home-depth::before {
    display: none;
  }
}