/* ============================================================================
   CANOPUS.LK – MODERN MINIMAL ANIMATIONS
   ============================================================================ */

.fade-in {
  opacity: 0;
  transform: translateY(10px);
  transition: 0.8s ease;
}
.fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}

.slide-up {
  opacity: 0;
  transform: translateY(25px);
  transition: 0.8s cubic-bezier(0.23,1,0.32,1);
}
.slide-up.visible {
  opacity: 1;
  transform: translateY(0);
}

.slide-left {
  opacity: 0;
  transform: translateX(-30px);
  transition: 0.9s ease;
}
.slide-left.visible {
  opacity: 1;
  transform: translateX(0);
}

.slide-right {
  opacity: 0;
  transform: translateX(30px);
  transition: 0.9s ease;
}
.slide-right.visible {
  opacity: 1;
  transform: translateX(0);
}

.zoom-in {
  opacity: 0;
  transform: scale(0.97);
  transition: 0.9s ease;
}
.zoom-in.visible {
  opacity: 1;
  transform: scale(1);
}

.fade-rise {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

.fade-rise.visible {
  opacity: 1;
  transform: translateY(0);
}

.card-hover {
  transition: transform 0.28s ease, box-shadow 0.28s ease;
}
.card-hover:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 28px rgba(0,0,0,0.12);
}

.img-zoom {
  transition: transform 0.35s ease;
}
.img-zoom:hover {
  transform: scale(1.04);
}

.btn-animate {
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.btn-animate:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(0,0,0,0.18);
}

.hero-fade {
  opacity: 0;
  animation: heroFade 1.4s ease forwards;
}
@keyframes heroFade {
  0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); }
}

.stagger > * {
  opacity: 0;
  transform: translateY(18px);
  transition: 0.6s ease;
}
.stagger.visible > * {
  opacity: 1;
  transform: translateY(0);
}
.stagger.visible > *:nth-child(1) { transition-delay: 0.1s; }
.stagger.visible > *:nth-child(2) { transition-delay: 0.25s; }
.stagger.visible > *:nth-child(3) { transition-delay: 0.4s; }
.stagger.visible > *:nth-child(4) { transition-delay: 0.55s; }
.stagger.visible > *:nth-child(5) { transition-delay: 0.7s; }

.reveal {
  opacity: 0;
  transition: opacity 1s ease;
}
.reveal.visible {
  opacity: 1;
}

/* FINAL FIX: Ensure hero content is always visible */
.hero-content.fade-rise {
    opacity: 1 !important;
    transform: translateY(0) !important;
}