.hidden-section {
  display: none;
  opacity: 0;
  transition: opacity 0.5s ease;
}

.hidden-section.visible {
  display: block;
  opacity: 1;
}

.trigger-hover {
  position: relative;
  display: inline-block;
  cursor: pointer;
  overflow: hidden; /* Prevent effects from spilling out */
  /* box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);  Subtle shadow */
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.trigger-hover:hover {
  transform: scale(1.1); /* Slight zoom */
  /* box-shadow: 0 8px 16px rgba(0, 128, 255, 0.5); Glowing shadow */
}

.trigger-hover::before {
  content: "";
  position: absolute;
  animation: multi-stagger-clippath 3s infinite linear;
  z-index: -1; /* Keep behind the content */
}

@keyframes multi-stagger-clippath {
  0%, 100% {
      clip-path: inset(50% 100% 95% 0); /* Full box */
  }
  15% {
      clip-path: inset(0 0 80% 0); /* First inward clipping */
  }
  30% {
      clip-path: inset(0 0 65% 0); /* Second inward clipping */
  }
  45% {
      clip-path: inset(0 0 50% 0); /* Third inward clipping */
  }
  60% {
      clip-path: inset(0 0 40% 0); /* Fourth inward clipping */
  }
  75% {
      clip-path: inset(0 0 20% 0); /* Fifth inward clipping */
  }
  90% {
      clip-path: inset(0 0 1% 0); /* Sixth inward clipping */
  }
}
