/* ========================================
   MOBILE RESPONSIVENESS FIXES
   Galaxy Asset Investment
   ======================================== */

/* Small Mobile Devices (320px - 480px) */
@media (max-width: 480px) {

    /* Hero Section */
    #home h1 {
        font-size: 1.75rem !important;
        line-height: 1.3;
    }

    #home h2 {
        font-size: 1.25rem !important;
    }

    #home p {
        font-size: 0.9rem;
    }

    #home .flex.gap-4 {
        flex-direction: column;
        gap: 0.75rem;
    }

    #home a {
        width: 100%;
        text-align: center;
    }

    /* About Section Video */
    #about .aspect-square {
        aspect-ratio: auto !important;
        height: auto !important;
        min-height: 250px;
    }

    /* Vision & Mission Cards */
    .holographic-card {
        padding: 1.5rem !important;
    }

    .holographic-card h3 {
        font-size: 1.75rem !important;
    }

    .holographic-card p {
        font-size: 0.95rem !important;
    }

    /* Services Donut Chart */
    .donut-chart {
        width: 280px !important;
        height: 280px !important;
    }

    #donut-hint {
        display: flex !important;
        top: -1.5rem !important;
        width: 100% !important;
        left: 0 !important;
        transform: none !important;
        justify-content: center !important;
    }

    .service-glass-panel .p-12 {
        padding: 1rem !important;
    }

    /* Service Modal */
    #service-modal .relative {
        min-height: auto !important;
        max-height: 85vh;
    }

    /* Show Navigation Arrows on Mobile */
    #prev-service,
    #next-service {
        display: flex !important;
        width: 2.5rem !important;
        height: 2.5rem !important;
        padding: 0.5rem !important;
        background: rgba(255, 255, 255, 0.1) !important;
        z-index: 70 !important;
    }

    #prev-service {
        left: 0.5rem !important;
    }

    #next-service {
        right: 0.5rem !important;
    }

    #modal-title {
        font-size: 1.5rem !important;
    }

    #modal-list {
        font-size: 0.9rem !important;
    }

    .lg\:p-12 {
        padding: 1.5rem !important;
    }

    /* Building Showcase */
    #building-showcase h2 {
        font-size: 1.75rem !important;
    }

    #building-showcase h3 {
        font-size: 0.9rem !important;
    }

    /* Client Stories Cards */
    .client-story-card {
        width: 280px !important;
        padding: 1.5rem !important;
    }

    .client-story-card h4 {
        font-size: 0.8rem !important;
    }

    .client-story-card p {
        font-size: 0.85rem !important;
    }

    /* Contact Form */
    #contact h2 {
        font-size: 1.75rem !important;
    }

    .form-control {
        padding: 0.75rem 1rem !important;
        font-size: 0.9rem !important;
    }

    /* Stats Section */
    .counter {
        font-size: 3rem !important;
    }

    .glass-morphic {
        padding: 1.5rem !important;
    }

    /* Vision Section Title */
    .vision-hero-title {
        font-size: 1.5rem !important;
        letter-spacing: 0.2em !important;
    }

    .vision-hero-sub {
        font-size: 0.9rem !important;
    }
}

/* Mobile Devices (481px - 767px) */
@media (min-width: 481px) and (max-width: 767px) {

    /* Hero Section */
    #home h1 {
        font-size: 2rem !important;
    }

    #home h2 {
        font-size: 1.5rem !important;
    }

    /* Services Donut */
    .donut-chart {
        width: 350px !important;
        height: 350px !important;
    }

    #donut-hint span {
        font-size: 0.65rem !important;
    }

    /* Vision & Mission */
    .holographic-card {
        padding: 2rem !important;
    }

    .holographic-card h3 {
        font-size: 2rem !important;
    }

    /* Client Stories */
    .client-story-card {
        width: 320px !important;
    }
}

/* Tablet Devices (768px - 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {

    /* Services Donut */
    .donut-chart {
        width: 400px !important;
        height: 400px !important;
    }

    #donut-hint {
        top: -2rem !important;
    }

    #donut-hint span {
        font-size: 0.7rem !important;
    }

    /* Vision & Mission Cards */
    .holographic-card {
        padding: 2.5rem !important;
    }

    /* Service Modal */
    #service-modal .relative {
        max-width: 90vw !important;
    }

    /* Building Showcase */
    .marquee-wrapper {
        min-height: 450px !important;
    }
}

/* Landscape Mobile Fix */
@media (max-height: 500px) and (orientation: landscape) {

    #home {
        min-height: 100vh;
        padding: 2rem 0;
    }

    .full-screen-track {
        height: 200vh !important;
    }

    #service-modal .relative {
        max-height: 90vh;
        overflow-y: auto;
    }
}

/* Touch Device Optimizations */
@media (hover: none) and (pointer: coarse) {

    /* Larger touch targets */
    button,
    a {
        min-height: 44px;
        min-width: 44px;
    }

    /* Remove hover effects on touch devices */
    .glass-morphic:hover {
        transform: none;
    }

    .product-card:hover {
        transform: none;
    }

    /* Disable custom cursor on touch */
    .cursor-ring,
    .cursor-dot {
        display: none !important;
    }

    body {
        cursor: auto !important;
    }
}

/* Fix for very small screens */
@media (max-width: 360px) {

    .container {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    /* Reduce all heading sizes */
    h1 {
        font-size: 1.5rem !important;
    }

    h2 {
        font-size: 1.25rem !important;
    }

    h3 {
        font-size: 1.1rem !important;
    }

    /* Donut Chart */
    .donut-chart {
        width: 240px !important;
        height: 240px !important;
    }

    /* Modal */
    #service-modal .p-8 {
        padding: 1rem !important;
    }

    /* Cards */
    .client-story-card {
        width: 260px !important;
        padding: 1rem !important;
    }
}

/* Fix horizontal overflow issues */
@media (max-width: 768px) {

    body {
        overflow-x: hidden !important;
    }

    * {
        max-width: 100vw;
    }

    /* Prevent text overflow */
    .whitespace-nowrap {
        white-space: normal !important;
    }

    /* Fix tracking/letter-spacing on mobile */
    .tracking-widest {
        letter-spacing: 0.1em !important;
    }

    /* Tailwind tracking classes handled inline */

    /* Service Modal Mobile Optimization */
    #service-modal .flex-col {
        flex-direction: column !important;
    }

    /* Modal heights handled by flex-col */

    /* Map Section */
    #dubai-map {
        height: 400px !important;
    }

    #map-info-panel {
        width: 90% !important;
        right: 5% !important;
        top: 1rem !important;
    }

    /* Vision Section Background */
    .bg-vision-fixed {
        background-attachment: scroll !important;
        background-position: center center !important;
        background-size: cover !important;
    }

    /* Reduce padding on sections */
    .py-24 {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important;
    }

    .py-32 {
        padding-top: 4rem !important;
        padding-bottom: 4rem !important;
    }

    .py-48 {
        padding-top: 5rem !important;
        padding-bottom: 5rem !important;
    }

    /* Fix gap spacing */
    .gap-12 {
        gap: 2rem !important;
    }

    .gap-16 {
        gap: 2.5rem !important;
    }
}

/* iPhone SE and similar small devices */
@media (max-width: 375px) {

    /* Header Logo */
    #main-header img {
        height: 1.5rem !important;
    }

    #main-header .text-xl {
        font-size: 0.9rem !important;
    }

    /* Buttons */
    .py-4 {
        padding-top: 0.75rem !important;
        padding-bottom: 0.75rem !important;
    }

    .px-10 {
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important;
    }

    /* Text sizes */
    .text-4xl {
        font-size: 1.5rem !important;
    }

    .text-5xl {
        font-size: 1.75rem !important;
    }

    .text-6xl {
        font-size: 2rem !important;
    }
}

/* Prevent zoom on input focus (iOS) */
@media (max-width: 768px) {

    input[type="text"],
    input[type="email"],
    textarea,
    select {
        font-size: 16px !important;
    }
}

/* Mobile Menu Customization */
.mobile-menu-custom {
    background: linear-gradient(to bottom, #000000 85%, #8b5cf6 100%) !important;
}

.mobile-nav-link {
    font-family: 'Poppins', sans-serif !important;
    font-size: 1.5rem !important;
    font-weight: 500 !important;
}

.mobile-service-item {
    font-family: 'Poppins', sans-serif !important;
    font-size: 1.1rem !important;
    font-weight: 500 !important;
}

/* Vision & Mission Cards - Equal Heights */
.holographic-card-container {
    height: 100%;
}

.holographic-card {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.holographic-card>div:not(.absolute) {
    flex: 1;
    display: flex;
    flex-direction: column;
}