/* Custom styles for Cultural Data Insights */

/* Navigation styles */
.nav-link {
    @apply text-gray-700 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium transition-colors duration-200;
}

.nav-link:hover {
    @apply bg-gray-50;
}

.mobile-nav-link {
    @apply text-gray-700 hover:text-primary-600 hover:bg-gray-50 block px-3 py-2 rounded-md text-base font-medium transition-colors duration-200;
}

/* Button styles */
.btn-primary {
    @apply inline-flex items-center px-6 py-3 border border-transparent text-base font-medium rounded-lg text-white bg-primary-500 hover:bg-primary-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500 transition-all duration-200 transform hover:scale-105;
}

.btn-secondary {
    @apply inline-flex items-center px-6 py-3 border border-transparent text-base font-medium rounded-lg text-primary-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500 transition-all duration-200 transform hover:scale-105;
}

.btn-outline {
    @apply inline-flex items-center px-6 py-3 border-2 border-white text-base font-medium rounded-lg text-white hover:bg-white hover:text-primary-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-white transition-all duration-200;
}

/* Card styles */
.feature-card {
    @apply bg-white rounded-xl shadow-lg p-8 text-center hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1;
}

.feature-icon {
    @apply w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-6;
}

.industry-card {
    @apply bg-white rounded-xl shadow-lg p-8 hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1 cursor-pointer;
}

.insight-card {
    @apply bg-white rounded-xl shadow-lg p-6 hover:shadow-xl transition-all duration-300;
}

.article-card {
    @apply bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1;
}

.practice-card {
    @apply bg-white rounded-xl shadow-lg p-6 hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1;
}

.metric-card {
    @apply bg-white rounded-xl shadow-lg p-6 text-center hover:shadow-xl transition-all duration-300;
}

.team-card {
    @apply bg-white rounded-xl shadow-lg p-8 text-center hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1;
}

.case-study-card {
    @apply bg-white rounded-xl shadow-lg p-6 hover:shadow-xl transition-all duration-300 border-l-4 border-primary-500;
}

/* Typography enhancements */
h1, h2, h3, h4, h5, h6 {
    @apply font-bold;
}

.text-gradient {
    background: linear-gradient(135deg, #0d9488, #0891b2);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Hover effects */
.hover-lift {
    @apply transition-all duration-300 transform hover:-translate-y-1 hover:shadow-xl;
}

/* Animation classes */
.fade-in {
    animation: fadeIn 0.6s ease-in-out;
}

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

.slide-in-left {
    animation: slideInLeft 0.6s ease-in-out;
}

@keyframes slideInLeft {
    from {
        opacity: 0;
        transform: translateX(-30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.slide-in-right {
    animation: slideInRight 0.6s ease-in-out;
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    @apply bg-gray-100;
}

::-webkit-scrollbar-thumb {
    @apply bg-primary-500 rounded-full;
}

::-webkit-scrollbar-thumb:hover {
    @apply bg-primary-600;
}

/* Responsive improvements */
@media (max-width: 768px) {
    .btn-primary,
    .btn-secondary,
    .btn-outline {
        @apply w-full justify-center;
    }
    
    .feature-card,
    .industry-card,
    .insight-card {
        @apply p-6;
    }
    
    .team-card {
        @apply p-6;
    }
}

/* Loading animation for charts */
.chart-loading {
    @apply animate-pulse bg-gray-200 rounded-lg;
}

/* Focus styles for accessibility */
*:focus {
    @apply outline-none ring-2 ring-primary-500 ring-opacity-50;
}

/* Print styles */
@media print {
    .no-print {
        display: none !important;
    }
    
    body {
        @apply text-black bg-white;
    }
    
    .bg-gradient-to-r,
    .bg-gradient-to-br {
        background: #0d9488 !important;
        color: white !important;
    }
}