.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-10465 .elementor-element.elementor-element-52d67e2{text-align:center;}.elementor-10465 .elementor-element.elementor-element-52d67e2 .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:44px;font-weight:600;color:#000000;}.elementor-widget-posts .elementor-post__title, .elementor-widget-posts .elementor-post__title a{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-posts .elementor-post__meta-data{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-posts .elementor-post__excerpt p{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-posts a.elementor-post__read-more{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-posts .elementor-post__card .elementor-post__badge{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-posts .elementor-pagination{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-posts .elementor-button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-posts .e-load-more-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-10465 .elementor-element.elementor-element-181bbd3{--grid-row-gap:50px;--grid-column-gap:50px;}.elementor-10465 .elementor-element.elementor-element-181bbd3 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.66 * 100% );}.elementor-10465 .elementor-element.elementor-element-181bbd3:after{content:"0.66";}.elementor-10465 .elementor-element.elementor-element-181bbd3 .elementor-post__thumbnail__link{width:100%;margin-bottom:calc(34px / 2);}.elementor-10465 .elementor-element.elementor-element-181bbd3 .elementor-post__meta-data span + span:before{content:"•";}.elementor-10465 .elementor-element.elementor-element-181bbd3 .elementor-post__text{margin-top:20px;}.elementor-10465 .elementor-element.elementor-element-181bbd3 .elementor-post:hover .elementor-post__thumbnail img{filter:brightness( 100% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate( 0deg );}.elementor-10465 .elementor-element.elementor-element-181bbd3 .elementor-post__badge{right:0;}.elementor-10465 .elementor-element.elementor-element-181bbd3 .elementor-post__card .elementor-post__badge{border-radius:0px;font-size:50px;}.elementor-10465 .elementor-element.elementor-element-181bbd3 .elementor-post__avatar{top:calc(-34px / 2);}.elementor-10465 .elementor-element.elementor-element-181bbd3 .elementor-post__avatar img{width:34px;height:34px;}.elementor-widget-image .widget-image-caption{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-10465 .elementor-element.elementor-element-3336f3d{margin-top:50px;margin-bottom:50px;}.elementor-10465 .elementor-element.elementor-element-a1602a3{text-align:center;}.elementor-10465 .elementor-element.elementor-element-a1602a3 .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:44px;font-weight:600;color:#000000;}.elementor-10465 .elementor-element.elementor-element-bfe04d2{--grid-row-gap:50px;--grid-column-gap:50px;}.elementor-10465 .elementor-element.elementor-element-bfe04d2 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.66 * 100% );}.elementor-10465 .elementor-element.elementor-element-bfe04d2:after{content:"0.66";}.elementor-10465 .elementor-element.elementor-element-bfe04d2 .elementor-post__thumbnail__link{width:100%;}.elementor-10465 .elementor-element.elementor-element-bfe04d2 .elementor-post__meta-data span + span:before{content:"•";}.elementor-10465 .elementor-element.elementor-element-bfe04d2 .elementor-post__text{margin-top:20px;}.elementor-10465 .elementor-element.elementor-element-bfe04d2 .elementor-post__badge{right:0;}.elementor-10465 .elementor-element.elementor-element-bfe04d2 .elementor-post__card .elementor-post__badge{margin:20px;}@media(max-width:767px){.elementor-10465 .elementor-element.elementor-element-181bbd3 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.5 * 100% );}.elementor-10465 .elementor-element.elementor-element-181bbd3:after{content:"0.5";}.elementor-10465 .elementor-element.elementor-element-181bbd3 .elementor-post__thumbnail__link{width:100%;}.elementor-10465 .elementor-element.elementor-element-bfe04d2 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.5 * 100% );}.elementor-10465 .elementor-element.elementor-element-bfe04d2:after{content:"0.5";}.elementor-10465 .elementor-element.elementor-element-bfe04d2 .elementor-post__thumbnail__link{width:100%;}}/* Start custom CSS for posts, class: .elementor-element-181bbd3 */.cards {
  @apply flex flex-wrap justify-between gap-6 p-6 bg-gray-50 
         perspective-1000 overflow-hidden;
}

.card {
  @apply relative w-full md:w-[calc(33.333%-1.5rem)] 
         bg-white rounded-2xl shadow-lg 
         transform transition-all duration-700 ease-out
         hover:z-50 
         will-change-transform 
         origin-center;
}

.card-wrapper {
  @apply relative transform transition-all duration-700 
         group-hover:scale-105 
         group-hover:rotate-3 
         group-hover:shadow-2xl
         origin-bottom;
}

.card-image {
  @apply w-full h-64 object-cover 
         rounded-t-2xl 
         transform transition-transform duration-700 
         group-hover:scale-110;
}

.card-content {
  @apply p-6 relative z-10;
}

.card-title {
  @apply text-2xl font-bold text-red-600 
         mb-4 text-center 
         transform transition-all duration-500 
         group-hover:scale-105 
         group-hover:text-red-700;
}

.card-description {
  @apply text-gray-700 text-base 
         line-clamp-4 
         opacity-80 
         transform transition-all duration-700 
         group-hover:opacity-100 
         group-hover:translate-y-[-10px];
}

/* Scroll-Triggered Pop-Out Effect */
.card {
  opacity: 0;
  transform: translateY(50px) scale(0.9);
  transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.card.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* Staggered Animation */
.card:nth-child(1) { transition-delay: 0.1s; }
.card:nth-child(2) { transition-delay: 0.2s; }
.card:nth-child(3) { transition-delay: 0.3s; }

/* Parallax Mouse Move Effect */
.card-wrapper {
  @apply transition-all duration-300 ease-out;
}

.card-parallax {
  @apply absolute inset-0 z-0 
         opacity-0 
         bg-gradient-to-br from-red-100/20 to-yellow-100/20 
         transition-all duration-500 
         group-hover:opacity-100;
}

/* Advanced Hover Effect */
.card:hover {
  @apply shadow-2xl;
}

.card:hover .card-wrapper {
  transform: 
    rotateX(5deg) 
    rotateY(-5deg) 
    translateZ(50px) 
    scale(1.05);
}

/* Scroll Trigger JavaScript Enhancement */
<script>
document.addEventListener('DOMContentLoaded', function() {
  const cards = document.querySelectorAll('.card');
  
  const observerOptions = {
    root: null,
    rootMargin: '0px',
    threshold: 0.1
  };
  
  const observer = new IntersectionObserver((entries) => {
    entries.forEach(entry => {
      if (entry.isIntersecting) {
        entry.target.classList.add('is-visible');
      }
    });
  }, observerOptions);
  
  cards.forEach(card => {
    observer.observe(card);
  });
});
</script>

/* Additional Hover Mouse Move Effect */
<script>
document.addEventListener('DOMContentLoaded', function() {
  const cards = document.querySelectorAll('.card');
  
  cards.forEach(card => {
    card.addEventListener('mousemove', (e) => {
      const { left, top, width, height } = card.getBoundingClientRect();
      const x = (e.clientX - left) / width * 2 - 1;
      const y = (e.clientY - top) / height * 2 - 1;
      
      card.style.transform = `
        perspective(1000px)
        rotateX(${-y * 10}deg)
        rotateY(${x * 10}deg)
      `;
    });
    
    card.addEventListener('mouseleave', () => {
      card.style.transform = 'perspective(1000px) rotateX(0) rotateY(0)';
    });
  });
});
</script>/* End custom CSS */