/* XYSHIMA Stage 4: animated homepage sections */

/* Reveal sections when entering viewport */
.xy-public-3d .xy-section-reveal {
  opacity: 0;
  transform: translateY(22px);
  transition:
    opacity .65s ease,
    transform .65s cubic-bezier(.2,.75,.2,1);
  transition-delay: var(--xy-reveal-delay, 0ms);
}

.xy-public-3d .xy-section-reveal.xy-section-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Enhanced depth for informational cards */
.xy-public-3d .solution-item,
.xy-public-3d .identity-grid .card,
.xy-public-3d .contrast article,
.xy-public-3d .content-card {
  transition:
    transform .3s cubic-bezier(.2,.8,.2,1),
    box-shadow .3s ease,
    border-color .3s ease;
}

/* 3D movement only on hover-capable devices */
@media (hover: hover) and (pointer: fine) {
  .xy-public-3d .solution-item:hover,
  .xy-public-3d .identity-grid .card:hover,
  .xy-public-3d .contrast article:hover,
  .xy-public-3d .content-card:hover {
    transform:
      perspective(900px)
      translateY(-6px)
      rotateX(2deg);

    box-shadow:
      0 24px 48px rgba(8,76,66,.13),
      0 6px 14px rgba(8,76,66,.05);

    border-color: rgba(13,122,107,.35);
  }
}

/* Refined appearance of the feature cards */
.xy-public-3d .identity-grid .card {
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(73,217,194,.10),
      transparent 48%
    ),
    #ffffff;
}

/* Enhanced focus for keyboard navigation */
.xy-public-3d .card a:focus-visible,
.xy-public-3d .content-card a:focus-visible {
  outline: 2px solid #0d9488;
  outline-offset: 4px;
}

/* Accessible reduced-motion behavior */
@media (prefers-reduced-motion: reduce) {
  .xy-public-3d .xy-section-reveal,
  .xy-public-3d .xy-section-reveal.xy-section-visible {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .xy-public-3d .solution-item:hover,
  .xy-public-3d .identity-grid .card:hover,
  .xy-public-3d .contrast article:hover,
  .xy-public-3d .content-card:hover {
    transform: none;
    transition: none;
  }
}