/* Custom backdrop blur for better browser support */
.backdrop-blur-sm {
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

/* Enhanced focus states */
input:focus,
textarea:focus {
    outline: none;
}

/* Custom font loading */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Crimson+Pro:wght@300;400;500;600;700&family=Roboto+Serif:wght@300;400;500;600;700&family=Funnel+Display:wght@300;400;500;600;700&display=swap');

/* Gradient border for contact section */
.gradient-border {
    background: linear-gradient(rgb(160, 86, 251), rgb(251, 127, 70));
    padding: 1px;
    border-radius: 16px;
    margin: 0 20px;
}

/* Smooth transitions for expand arrow */
.expand-arrow {
    transition: transform 0.3s ease-in-out;
}

/* Professional animations for feature cards */
.benefit-card {
    transition:
        transform 0.3s ease-out,
        box-shadow 0.3s ease-out;
    cursor: default;
}

.benefit-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
}

/* Image scaling effect on hover */
.benefit-card img {
    transition: transform 0.4s ease-out;
}

.benefit-card:hover img {
    transform: scale(1.02);
}

/* Initial state for text content */
.benefit-card h3,
.benefit-card p {
    opacity: 0;
    transform: translateY(20px);
    transition:
        opacity 0.6s ease-out,
        transform 0.6s ease-out;
}

/* Initial state for cards */
.benefit-card {
    opacity: 0;
    transform: translateX(-30px);
    transition:
        transform 0.3s ease-out,
        box-shadow 0.3s ease-out,
        opacity 0.8s ease-out;
}

.benefit-card:nth-child(even) {
    transform: translateX(30px);
}

/* Animated states when visible */
.benefit-card.animate h3 {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.1s;
}

.benefit-card.animate p {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.2s;
}

.benefit-card.animate {
    opacity: 1;
    transform: translateX(0);
}

.benefit-card.animate:nth-child(2) {
    transition-delay: 0.2s;
}

.benefit-card.animate:nth-child(3) {
    transition-delay: 0.4s;
}