/* ============================================
   XGEOSPACE - Global Responsive System
   Ensures ALL pages adapt to mobile & tablet
   WITHOUT changing any existing design
   ============================================ */

/* ── TABLET (1024px) ── */
@media (max-width: 1024px) {
    /* Force all inline 2-column grids to stack */
    [style*="grid-template-columns: 1fr 1fr"],
    [style*="grid-template-columns:1fr 1fr"],
    [style*="grid-template-columns: 1.1fr"],
    [style*="grid-template-columns: 1fr 400px"],
    [style*="grid-template-columns: 1fr 250px"],
    [style*="grid-template-columns:1fr 400px"],
    [style*="grid-template-columns:1fr 250px"] {
        grid-template-columns: 1fr !important;
    }

    /* Grids with repeat(4) or repeat(3) */
    [style*="grid-template-columns: repeat(4"],
    [style*="grid-template-columns:repeat(4"],
    [style*="grid-template-columns: repeat(3"],
    [style*="grid-template-columns:repeat(3"] {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    /* Inline grids used across service pages */
    .grid-services,
    .process-steps {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    }

    /* Page containers */
    .page-container {
        padding: 60px 20px !important;
    }

    /* Reduce large inline gaps */
    [style*="gap:4rem"],
    [style*="gap: 4rem"],
    [style*="gap:3rem"],
    [style*="gap: 3rem"] {
        gap: 2rem !important;
    }
}

/* ── MOBILE (768px) ── */
@media (max-width: 768px) {
    /* ===== FORCE ALL GRIDS TO SINGLE COLUMN ===== */
    [style*="grid-template-columns: 1fr 1fr"],
    [style*="grid-template-columns:1fr 1fr"],
    [style*="grid-template-columns: 1.1fr"],
    [style*="grid-template-columns: 1fr 400px"],
    [style*="grid-template-columns: 1fr 250px"],
    [style*="grid-template-columns:1fr 400px"],
    [style*="grid-template-columns:1fr 250px"],
    [style*="grid-template-columns: repeat(4"],
    [style*="grid-template-columns:repeat(4"],
    [style*="grid-template-columns: repeat(3"],
    [style*="grid-template-columns:repeat(3"],
    [style*="grid-template-columns: repeat(2"],
    [style*="grid-template-columns:repeat(2"] {
        grid-template-columns: 1fr !important;
    }

    /* Grids with high minmax values that overflow on mobile */
    [style*="minmax(380px"],
    [style*="minmax(350px"],
    [style*="minmax(340px"],
    [style*="minmax(320px"] {
        grid-template-columns: 1fr !important;
    }

    /* ===== HERO SECTIONS ===== */
    .service-hero {
        height: auto !important;
        min-height: 50vh;
        padding: 100px 20px 40px !important;
    }

    .service-hero .hero-title,
    .hero-title {
        font-size: clamp(2rem, 8vw, 3rem) !important;
    }

    .service-hero .hero-subtitle,
    .hero-subtitle {
        font-size: 1rem !important;
    }

    /* ===== PAGE CONTAINERS ===== */
    .page-container {
        padding: 40px 15px !important;
    }

    /* All grid-based layouts */
    .grid-services,
    .process-steps {
        grid-template-columns: 1fr !important;
    }

    /* ===== CARDS ===== */
    .service-card {
        padding: 2rem 1.5rem !important;
    }

    .service-card:hover {
        transform: translateY(-5px) scale(1) !important;
    }

    .step-item {
        padding: 2rem 1.5rem !important;
    }

    /* ===== TYPOGRAPHY ===== */
    .section-title h2 {
        font-size: clamp(1.5rem, 6vw, 2rem) !important;
    }

    /* ===== INLINE SECTIONS WITH HIGH PADDING ===== */
    [style*="padding: 100px"],
    [style*="padding:100px"],
    [style*="padding: 80px"],
    [style*="padding:80px"],
    [style*="padding: 120px"],
    [style*="padding:120px"] {
        padding: 40px 20px !important;
    }

    /* ===== FLEX LAYOUTS ===== */
    /* Two-column flex that should stack */
    [style*="display:flex"][style*="gap:4rem"],
    [style*="display: flex"][style*="gap: 4rem"],
    [style*="display:flex"][style*="gap:3rem"],
    [style*="display: flex"][style*="gap: 3rem"] {
        flex-wrap: wrap !important;
        gap: 1.5rem !important;
    }

    /* ===== ECOSYSTEM / WHY CARDS ===== */
    .ecosystem-card {
        padding: 30px 20px !important;
    }

    #whyGrid,
    #ecosystemGrid {
        grid-template-columns: 1fr !important;
    }

    /* ===== PROJECT CARDS ===== */
    .project-card {
        height: 350px !important;
    }

    /* ===== TABLES ===== */
    table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* ===== IMAGES ===== */
    img:not(.nav-logo img):not(.footer-logo-img):not([style*="border-radius: 50%"]) {
        max-width: 100%;
        height: auto;
    }

    /* ===== MOCKUPS ===== */
    .mockup-container {
        margin: 0 -10px;
    }

    /* ===== GLOBE (Contact page) ===== */
    #globe-container {
        height: 280px !important;
    }

    .globe-wrapper {
        margin-top: 1.5rem;
    }

    /* ===== FOOTER ===== */
    .footer {
        padding: 40px 0 20px !important;
    }

    .footer-social-icons {
        flex-wrap: wrap;
        justify-content: center;
    }

    .footer-legal-bar {
        flex-direction: column;
        text-align: center;
        gap: 10px !important;
    }

    /* ===== SCROLL INDICATOR ===== */
    .scroll-indicator {
        left: 50% !important;
        transform: translateX(-50%);
    }

    /* ===== PARTNERS MARQUEE ===== */
    .partner-logo {
        min-width: 100px !important;
        height: 60px !important;
    }

    .partner-logo img {
        height: 40px !important;
    }

    /* ===== INLINE FONT SIZE OVERRIDES ===== */
    [style*="font-size: 5rem"],
    [style*="font-size:5rem"],
    [style*="font-size: 4rem"],
    [style*="font-size:4rem"] {
        font-size: 2.5rem !important;
    }

    [style*="font-size: 3rem"],
    [style*="font-size:3rem"],
    [style*="font-size: 3.5rem"] {
        font-size: 2rem !important;
    }

    /* ===== INLINE WIDTH OVERRIDES ===== */
    [style*="width: 800px"],
    [style*="width:800px"],
    [style*="width: 700px"],
    [style*="width:700px"],
    [style*="width: 600px"],
    [style*="width:600px"],
    [style*="max-width: 800px"],
    [style*="max-width:800px"] {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* ===== LIVE / VIDEO PAGES ===== */
    iframe {
        width: 100% !important;
        max-width: 100%;
    }

    /* ===== SISTEMA SOLAR / UNIVERSO PAGES ===== */
    canvas {
        max-width: 100%;
    }
}

/* ── SMALL MOBILE (480px) ── */
@media (max-width: 480px) {
    .service-hero {
        padding: 90px 15px 30px !important;
    }

    .service-hero .hero-title,
    .hero-title {
        font-size: clamp(1.8rem, 8vw, 2.5rem) !important;
    }

    .hero-eyebrow {
        font-size: 0.6rem !important;
        padding: 6px 14px !important;
        letter-spacing: 2px !important;
    }

    .page-container {
        padding: 30px 12px !important;
    }

    .service-card {
        padding: 1.5rem 1rem !important;
    }

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

    .step-item {
        padding: 1.5rem 1rem !important;
    }

    .step-content h4 {
        font-size: 0.95rem !important;
    }

    .cta-button {
        padding: 12px 20px !important;
        font-size: 0.7rem !important;
        width: 100%;
        text-align: center;
        justify-content: center;
    }

    .project-card {
        height: 300px !important;
    }

    .contact-info-title {
        font-size: 1.5rem !important;
    }

    .ecosystem-card {
        padding: 25px 15px !important;
    }

    .footer-social-icon {
        width: 44px !important;
        height: 68px !important;
    }

    .step-number {
        font-size: 3.5rem !important;
    }

    /* Capacitacion / Educacion cards with high minmax */
    [style*="minmax(300px"],
    [style*="minmax(280px"],
    [style*="minmax(250px"] {
        grid-template-columns: 1fr !important;
    }

    /* All inline large padding */
    [style*="padding: 60px"],
    [style*="padding:60px"],
    [style*="padding: 50px"],
    [style*="padding:50px"] {
        padding: 30px 15px !important;
    }
}

/* ── LANDSCAPE MOBILE FIX ── */
@media (max-height: 500px) and (orientation: landscape) {
    .service-hero {
        height: auto !important;
        min-height: auto !important;
        padding: 80px 20px 30px !important;
    }

    .hero {
        height: auto !important;
        min-height: 100vh;
    }
}

/* ── TOUCH DEVICE OPTIMIZATIONS ── */
@media (hover: none) and (pointer: coarse) {
    /* Disable hover transforms on touch */
    .service-card:hover {
        transform: none !important;
    }

    /* Make tap targets larger */
    .cta-button {
        min-height: 48px;
    }

    .mega-item {
        padding: 12px 0 !important;
    }

    /* Show descriptions always on touch */
    .svc-desc {
        max-height: 100px !important;
        opacity: 0.8 !important;
    }

    .svc-top-line {
        transform: scaleX(1) !important;
    }
}