/* /css/style.css */

/* Google Fonts - Inter for a clean, modern look */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

body {
    font-family: 'Inter', sans-serif;
    /* Tailwind's bg-gray-100 will handle the background */
    /* Tailwind's antialiased for smoother fonts */
}

/* Custom animations for a dynamic feel */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp {
    from { transform: translateY(20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

/* New Animations for "Wow" Factor */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(40px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes textFocusIn {
    0% { filter: blur(12px); opacity: 0; }
    100% { filter: blur(0); opacity: 1; }
}

@keyframes pulseLight {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.02); opacity: 0.95; }
}

@keyframes gradientShift {
    0% { background-position: 0% 50%; }
    100% { background-position: 100% 50%; }
}

/* Apply Animations */
.animate-fade-in {
    animation: fadeIn 1s ease-out forwards;
}

.animate-slide-up {
    animation: slideUp 1s ease-out forwards;
    animation-delay: 0.3s; /* Staggered effect */
}

/* New animation classes based on the index.html redesign */
.animate-fade-in-up {
    animation: fadeInUp 1s ease-out forwards;
}
.animate-fade-in-up-delay-1 {
    animation: fadeInUp 1s ease-out forwards;
    animation-delay: 0.5s;
}
.animate-fade-in-up-delay-2 {
    animation: fadeInUp 1s ease-out forwards;
    animation-delay: 0.8s;
}
.animate-fade-in-up-delay-3 {
    animation: fadeInUp 1s ease-out forwards;
    animation-delay: 1.1s;
}
.animate-fade-in-up-delay-4 {
    animation: fadeInUp 1s ease-out forwards;
    animation-delay: 1.4s; /* Adjusted delays slightly for full hero section load */
}
.animate-fade-in-up-delay-5 {
    animation: fadeInUp 1s ease-out forwards;
    animation-delay: 1.7s;
}

.animate-text-focus {
    animation: textFocusIn 1.2s cubic-bezier(0.550, 0.085, 0.680, 0.530) forwards;
}

.animate-pulse-light {
    animation: pulseLight 2s infinite ease-in-out;
}

.animate-gradient-shift {
    background-size: 200% 200%;
    animation: gradientShift 10s ease infinite alternate;
}


/* General card styling */
/* (Updated for rounded-2xl and more prominent shadows/hovers) */
.card {
    background-color: #ffffff;
    border-radius: 1rem; /* rounded-2xl */
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); /* shadow-xl */
    padding: 1.5rem; /* p-6 */
    transition: all 0.3s ease-in-out;
}

.card:hover {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.05); /* shadow-2xl */
    transform: translateY(-0.5rem); /* -translate-y-2 (increased for more "wow") */
}

/* Form input focus styles */
input:focus, textarea:focus {
    outline: none;
    border-color: #3b82f6; /* blue-500 */
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.5); /* ring-2 focus:ring-blue-500 */
}

/* Button hover effects */
button, a[role="button"], .glow-on-hover { /* Added glow-on-hover to general button transitions */
    transition: all 0.3s ease-in-out;
}

/* Custom glow effect for primary button */
.glow-on-hover {
    box-shadow: 0 0px 15px rgba(59, 130, 246, 0.6); /* Blue glow */
    position: relative;
    z-index: 1;
}

.glow-on-hover:hover {
    box-shadow: 0 0px 25px rgba(59, 130, 246, 0.8), 0 0px 40px rgba(59, 130, 246, 0.5); /* Stronger glow */
}

/* Ensure main content takes up available space */
.flex-grow {
    flex-grow: 1;
}

/* Utility for text that should wrap but not overflow */
.whitespace-pre-wrap {
    white-space: pre-wrap;
}

/* Utility for limiting lines of text */
.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Custom shadow for the hero section container to make it pop */
.shadow-3xl {
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25), 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}