/* =============================
   GLOBAL ANIMATION BASE
============================= */
section,
.feature-card,
.service-card,
.product-card,
.testimonial,
.blog-grid img,
.project-grid img {
  opacity: 0;
  transform: translateY(40px);
  transition: all 0.9s cubic-bezier(.19,1,.22,1);
}

.reveal {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* =============================
   NAVBAR SCROLL EFFECT
============================= */
.header.scrolled {
  background: rgba(123,114,140,0.85);
  backdrop-filter: blur(14px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}

/* =============================
   BUTTON MICRO INTERACTIONS
============================= */
button,
.btn {
  transition: all 0.35s cubic-bezier(.19,1,.22,1);
}

button:hover,
.btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 15px 40px rgba(0,0,0,0.25);
}

/* =============================
   CARD PREMIUM HOVER
============================= */
.feature-card,
.service-card,
.product-card,
.testimonial {
  transition: all 0.5s cubic-bezier(.19,1,.22,1);
}

.feature-card:hover,
.service-card:hover,
.product-card:hover,
.testimonial:hover {
  transform: translateY(-10px) scale(1.02);
  box-shadow: 0 30px 60px rgba(0,0,0,0.15);
}

/* =============================
   IMAGE PREMIUM HOVER
============================= */
.project-grid img,
.blog-grid img {
  transition: all 0.8s cubic-bezier(.19,1,.22,1);
}

.project-grid img:hover,
.blog-grid img:hover {
  transform: scale(1.05);
}

/* =============================
   HERO TEXT FADE-IN
============================= */
.hero h1,
.hero p,
.hero .hero-actions {
  opacity: 0;
  transform: translateY(30px);
  animation: heroFade 1.4s cubic-bezier(.19,1,.22,1) forwards;
}

.hero p { animation-delay: .2s; }
.hero .hero-actions { animation-delay: .4s; }

@keyframes heroFade {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* =============================
   STATS COUNTER STYLE
============================= */
.stats-grid div {
  font-size: 28px;
  font-weight: 600;
}