/* Responsive CSS */

/* Mobile-First Responsive Design Improvements */
@media (max-width: 1024px) {
    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    
    .grid-cols-3 {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .text-5xl {
        font-size: 2.5rem;
        line-height: 1.2;
    }
    
    .text-4xl {
        font-size: 2rem;
        line-height: 1.3;
    }
}

@media (max-width: 768px) {
    /* Section Spacing */
    .py-24 {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }
    
    .py-20 {
        padding-top: 2.5rem;
        padding-bottom: 2.5rem;
    }
    
    /* Ensure Hero Section Text is Visible - EXCEPT main title */
    .hero-bg p,
    .hero-bg .text-gray-100,
    .hero-bg .text-gray-300,
    .hero-bg .text-egypt-gold,
    .hero-bg .text-3xl,
    .hero-bg .text-sm,
    .hero-bg .hero-subtitle,
    .hero-bg .hero-content,
    .hero-bg .hero-buttons {
        color: #1F2937 !important;
        text-shadow: 0 2px 4px rgba(255, 255, 255, 0.5);
    }
    

    

    
    /* Hero main title should be GOLD on mobile */
    .hero-bg h1,
    .hero-bg .hero-title {
        color: #D4AF37 !important;
    }
    
    /* Ensure Hero Section Text is Always White on Mobile - EXCEPT main title */
    .hero-bg p,
    .hero-bg span:not(.hero-title),
    .hero-bg div:not(.hero-title),
    .hero-bg h2,
    .hero-bg h3,
    .hero-bg h4,
    .hero-bg h5,
    .hero-bg h6 {
        color: #FFFFFF !important;
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    }
    
    /* Hero main title should be GOLD on mobile */
    .hero-bg h1,
    .hero-bg .hero-title,
    .hero-bg .premium-text {
        color: #D4AF37 !important;
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.7);
    }
    
    /* Force Hero Section Content to be Visible */
    .hero-bg .text-center {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    .hero-bg .text-center *:not(.hero-title):not(h1) {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        color: #FFFFFF !important;
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    }
    
    .hero-bg .text-center h1,
    .hero-bg .text-center .hero-title {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        color: #D4AF37 !important;
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.7);
    }
    
    /* Ensure Hero Content is Not Hidden */
    .hero-bg .mobile-fade-in,
    .hero-bg .mobile-slide-left,
    .hero-bg .mobile-scale-in {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        transform: none !important;
    }
    
    /* Ensure Section Titles are Visible */
    .gradient-text {
        background: linear-gradient(135deg, #D4AF37, #B8860B);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        text-shadow: none;
    }
    
    /* Ensure Text in Sections is Visible */
    .text-gray-300 {
        color: #374151 !important;
    }
    
    .text-gray-400 {
        color: #6B7280 !important;
    }
    
    /* Ensure Section Content is Visible */
    .bg-gradient-to-br.from-soft-black.via-matte-black.to-warm-gray .text-gray-300,
    .bg-gradient-to-b.from-soft-black.via-matte-black.to-warm-gray .text-gray-300 {
        color: #374151 !important;
    }
    
    .bg-gradient-to-br.from-soft-black.via-matte-black.to-warm-gray .text-gray-400,
    .bg-gradient-to-b.from-soft-black.via-matte-black.to-warm-gray .text-gray-400 {
        color: #6B7280 !important;
    }
    
    /* Ensure Explore Our Trips Section Text is Visible */
    .bg-gradient-to-br.from-soft-black.via-matte-black.to-warm-gray .text-gray-300,
    .bg-gradient-to-b.from-soft-black.via-matte-black.to-warm-gray .text-gray-300 {
        color: #374151 !important;
        text-shadow: none;
    }
    
    .bg-gradient-to-br.from-soft-black.via-matte-black.to-warm-gray .text-gray-400,
    .bg-gradient-to-b.from-soft-black.via-matte-black.to-warm-gray .text-gray-400 {
        color: #6B7280 !important;
        text-shadow: none;
    }
    
    /* Ensure Card Text is Visible */
    .card-hover .text-gray-300 {
        color: #374151 !important;
    }
    
    .card-hover .text-gray-400 {
        color: #6B7280 !important;
    }
    
    /* Ensure Explore Our Trips Section is Fully Visible on Mobile */
    .bg-gradient-to-br.from-soft-black.via-matte-black.to-warm-gray,
    .bg-gradient-to-b.from-soft-black.via-matte-black.to-warm-gray {
        background: linear-gradient(135deg, #F8F9FA, #FFFFFF, #E9ECEF) !important;
    }
    
    .bg-gradient-to-br.from-soft-black.via-matte-black.to-warm-gray .text-gray-300,
    .bg-gradient-to-b.from-soft-black.via-matte-black.to-warm-gray .text-gray-300 {
        color: #374151 !important;
        text-shadow: none;
    }
    
    .bg-gradient-to-br.from-soft-black.via-matte-black.to-warm-gray .text-gray-400,
    .bg-gradient-to-b.from-soft-black.via-matte-black.to-warm-gray .text-gray-400 {
        color: #6B7280 !important;
        text-shadow: none;
    }
    
    .bg-gradient-to-br.from-soft-black.via-matte-black.to-warm-gray .text-egypt-gold,
    .bg-gradient-to-b.from-soft-black.via-matte-black.to-warm-gray .text-egypt-gold {
        color: #B8860B !important;
    }
    
    /* Text Sizing */
    .text-6xl {
        font-size: 2.5rem;
        line-height: 1.2;
    }
    
    .text-5xl {
        font-size: 2rem;
        line-height: 1.3;
    }
    
    .text-4xl {
        font-size: 1.75rem;
        line-height: 1.4;
    }
    
    .text-3xl {
        font-size: 1.5rem;
        line-height: 1.4;
    }
    
    .text-2xl {
        font-size: 1.25rem;
        line-height: 1.5;
    }
    
    .text-xl {
        font-size: 1.125rem;
        line-height: 1.5;
    }
    
    /* Grid Improvements */
    .grid-cols-1.md\\:grid-cols-2.lg\\:grid-cols-3 {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .grid-cols-1.lg\\:grid-cols-2 {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    /* Stats Grid Mobile */
    .grid-cols-3 {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    /* Card Improvements */
    .card-hover {
        margin-bottom: 1rem;
    }
    
    .card-hover .p-8 {
        padding: 1.5rem;
    }
    
    /* Gallery Mobile */
    #galleryContainer {
        padding: 0 1rem;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    #galleryLeft,
    #galleryRight {
        display: block !important;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 10;
        background: rgba(0, 0, 0, 0.7);
        border: none;
        color: white;
        padding: 0.5rem;
        border-radius: 50%;
        width: 40px;
        height: 40px;
    }
    
    #galleryLeft {
        left: 0.5rem;
    }
    
    #galleryRight {
        right: 0.5rem;
    }
    
    .gallery-scroll {
        scroll-snap-type: x mandatory;
    }
    
    .gallery-card {
        min-width: 280px;
        width: 280px;
        height: 200px;
        scroll-snap-align: start;
    }
    
    /* Contact Form Mobile */
    .contact-form {
        padding: 1.5rem;
    }
    
    /* Footer Mobile */
    .grid-cols-1.md\\:grid-cols-2.lg\\:grid-cols-4 {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .lg\\:col-span-2 {
        grid-column: 1;
    }
    
    /* Language Dropdown Mobile */
    .language-dropdown {
        background: #FFFFFF !important;
        border: 1px solid #D1D5DB !important;
    }
    
    .language-dropdown button {
        color: #374151 !important;
    }
    
    .language-dropdown button:hover {
        background: rgba(184, 134, 11, 0.05) !important;
        color: #B8860B !important;
    }
    
    /* Hero Section Mobile Fixes */
    .hero-bg {
        min-height: 100vh !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: relative !important;
    }
    
    .hero-bg .text-center {
        position: relative !important;
        z-index: 10 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Force All Hero Text to be Visible - EXCEPT main title */
    .hero-bg h2,
    .hero-bg h3,
    .hero-bg p,
    .hero-bg span:not(.hero-title),
    .hero-bg div:not(.hero-title) {
        color: #FFFFFF !important;
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5) !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* Hero main title should be GOLD on mobile */
    .hero-bg h1,
    .hero-bg .hero-title,
    .hero-bg .premium-text {
        color: #D4AF37 !important;
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.7) !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

@media (max-width: 480px) {
    /* Extra Small Mobile Improvements */
    /* Navigation Logo */
    .text-2xl {
        font-size: 1.25rem;
    }
    
    /* Section Headers */
    .text-4xl {
        font-size: 1.5rem;
    }
    
    .text-3xl {
        font-size: 1.25rem;
    }
    
    /* Card Content */
    .p-8 {
        padding: 1rem;
    }
    
    /* Gallery Cards */
    .w-80 {
        width: 260px;
    }
    
    .h-64 {
        height: 200px;
    }
    
    /* Contact Form */
    .space-y-6 > * + * {
        margin-top: 1rem;
    }
    
    /* Footer */
    .flex.flex-col.items-center.gap-6 {
        gap: 1rem;
    }
    
    .flex.items-center.gap-6 {
        gap: 1rem;
        flex-wrap: wrap;
        justify-content: center;
    }
}

/* Landscape Mobile Improvements */
@media (max-width: 768px) and (orientation: landscape) {
    .py-24 {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
}

/* Accessibility Improvements */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    
    .floating-animation,
    .pyramid-rotate,
    .pyramid-float,
    .symbol-float-1,
    .symbol-float-2,
    .symbol-float-3,
    .patternFloat {
        animation: none;
    }
}

/* Print Styles */
@media print {
    .hero-bg {
        background: none !important;
        color: #000 !important;
    }
    
    nav,
    footer,
    .gallery-scroll,
    button {
        display: none !important;
    }
    
    * {
        background: white !important;
        color: black !important;
    }
}
