/* Global Custom Styles */

/* Hover Underline Animation */
.hover-underline-animation {
    display: inline-block;
    position: relative;
    color: #1a1a1a;
}

.hover-underline-animation::after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: #1a1a1a;
    transform-origin: bottom right;
    transition: transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
}

.hover-underline-animation:hover::after {
    transform: scaleX(1);
    transform-origin: bottom left;
}

/* Image Hover Zoom */
.image-hover-zoom {
    transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.group:hover .image-hover-zoom {
    transform: scale(1.05);
}

/* Fade In Up Animation */
.fade-in-up {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 0.8s ease-out forwards;
}

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

/* Timeline specific (from proceso.html) */
.timeline-line::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 15px; /* Center with the circle w-8 (32px) -> approx 15-16px */
    width: 1px;
    background-color: #E5E7EB; /* gray-200 */
    z-index: 0;
}

/* Staggered Delays */
.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
.delay-300 { animation-delay: 0.3s; }

/* Masonry override if needed */
.case-card {
    break-inside: avoid;
}