/* Additional Custom Styles */
/* Base styles and overrides */
body {
    font-family: 'Outfit', sans-serif;
}

.font-serif {
    font-family: 'Playfair Display', serif;
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

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

::-webkit-scrollbar-track {
    background: #1E272E;
}

::-webkit-scrollbar-thumb {
    background: #FF6B6B;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: #E85D5D;
}

/* Animation delays for staggered reveals */
.reveal:nth-child(1) {
    transition-delay: 0.1s;
}

.reveal:nth-child(2) {
    transition-delay: 0.2s;
}

.reveal:nth-child(3) {
    transition-delay: 0.3s;
}

.reveal:nth-child(4) {
    transition-delay: 0.4s;
}

.reveal:nth-child(5) {
    transition-delay: 0.5s;
}

.reveal:nth-child(6) {
    transition-delay: 0.6s;
}

/* Focus styles for accessibility */
button:focus,
a:focus,
input:focus,
textarea:focus,
select:focus {
    outline: 2px solid #FF6B6B;
    outline-offset: 2px;
}

/* Print styles */
@media print {
    .navbar,
    .mobile-menu,
    .btn-primary,
    .btn-secondary {
        display: none;
    }
    
    body {
        color: #000;
        background: #fff;
    }
    
    .charcoal-bg {
        background: #fff;
    }
    
    .text-white,
    .text-gray-300,
    .text-gray-400 {
        color: #000;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .service-card {
        border: 2px solid #000;
    }
    
    .form-input {
        border: 2px solid #000;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    
    html {
        scroll-behavior: auto;
    }
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
    .geo-shape-1,
    .geo-shape-2 {
        display: none;
    }
    
    .text-5xl {
        font-size: 2.5rem;
    }
    
    .text-4xl {
        font-size: 2rem;
    }
    
    .mb-16 {
        margin-bottom: 2rem;
    }
}

/* Tablet adjustments */
@media (min-width: 769px) and (max-width: 1024px) {
    .container {
        max-width: 768px;
    }
}

/* Large screen optimizations */
@media (min-width: 1921px) {
    .container {
        max-width: 1600px;
    }
    
    .text-7xl {
        font-size: 5rem;
    }
}

/* Background pattern for sections */
.bg-pattern {
    background-image: radial-gradient(circle at 25% 25%, rgba(255, 107, 107, 0.1) 0%, transparent 50%),
                      radial-gradient(circle at 75% 75%, rgba(30, 39, 46, 0.1) 0%, transparent 50%);
}

/* Hover effects for interactive elements */
.hover-lift {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-lift:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
}

/* Gradient text effect */
.gradient-text {
    background: linear-gradient(135deg, #FF6B6B 0%, #E85D5D 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Glass morphism effect */
.glass {
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

/* Pulse animation for CTAs */
@keyframes pulse-coral {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(255, 107, 107, 0.7);
    }
    50% {
        box-shadow: 0 0 0 15px rgba(255, 107, 107, 0);
    }
}

.pulse-animation {
    animation: pulse-coral 2s infinite;
}

/* Shimmer effect for loading states */
@keyframes shimmer {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

.shimmer {
    background: linear-gradient(90deg, 
        rgba(255, 255, 255, 0) 0%, 
        rgba(255, 255, 255, 0.3) 50%, 
        rgba(255, 255, 255, 0) 100%);
    background-size: 200% 100%;
    animation: shimmer 2s infinite;
}
