/* ==========================================================================
   RESPONSIVE DESIGN (MEDIA QUERIES)
   Solvevare - Responsive Layout Adjustments
   ========================================================================== */

/* Breakpoint 1280px+ (Large Desktop) */
@media (min-width: 1280px) {
    .hero-container {
        gap: 8vh;
    }
}

/* Breakpoint 1024px (Tablet Landscape / Small Desktop) */
@media (max-width: 1024px) {
    .nav-container {
        height: 80px;
    }

    #desktop-nav-links {
        display: none;
    }

    .mega-menus-container {
        display: none !important;
    }

    .hero-content-row {
        gap: 4rem;
    }

    .hero-description {
        max-width: 100%;
    }
}

/* Breakpoint 768px (Tablet Portrait) */
@media (max-width: 768px) {

    /* Change hero grid layout to stack vertically */
    .hero-content-row {
        grid-template-columns: 1fr;
        gap: 3.5rem;
        align-items: stretch;
    }

    .hero-info-group {
        order: 1;
        /* Description & CTA on top */
    }

    .hero-capability-grid {
        order: 2;
        /* Capabilities below */
    }

    .hero-container {
        gap: 3.5rem;
    }

    .hero-title {
        margin-top: 1rem;
    }
}

/* Breakpoint 640px (Small Mobile / Large Phone) */
@media (max-width: 640px) {
    .nav-container {
        height: 70px;
    }

    /* Hide the right "Book a Meet" button in header on mobile to conserve space */
    .site-header .nav-actions .btn-nav-cta {
        display: none;
    }

    .hero-section {
        padding-top: 80px;
        padding-bottom: 2.5rem;
    }

    .hero-container {
        gap: 2.5rem;
    }

    .hero-cta-wrapper {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
        text-align: center;
    }

    .btn-hero-cta {
        justify-content: center;
        width: 100%;
    }

    .cta-subtext {
        text-align: center;
    }

    .capability-card {
        gap: 1.25rem;
        padding: 1.25rem 0;
    }
}

/* ==========================================================================
   HOMEPAGE EXPANSION RESPONSIVE
   ========================================================================== */

/* Breakpoint 1024px */
@media (max-width: 1024px) {
    .capability-columns {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .capabilities-list .capability-item {
        grid-template-columns: 1fr;
        gap: 2rem;
        padding: 3rem 0;
    }

    .cap-features {
        grid-template-columns: 1fr;
    }

    .feature-split-layout {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .feature-split-layout.reverse {
        direction: ltr;
    }

    .feature-visual {
        order: -1;
        /* Always show visual on top for mobile */
    }

    .process-timeline {
        grid-template-columns: 1fr 1fr;
    }

    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 2rem;
    }
}

/* Breakpoint 768px */
@media (max-width: 768px) {
    .split-header {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .solution-row {
        grid-template-columns: 40px 1fr 30px;
        gap: 1rem;
        padding: 2rem 0;
    }

    .industries-grid {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .proof-grid {
        grid-template-columns: 1fr;
    }

    .process-timeline {
        grid-template-columns: 1fr;
    }

    .flow-step {
        flex-direction: column;
        gap: 0.5rem;
        padding: 1.5rem 0;
    }
}

/* Breakpoint 640px */
@media (max-width: 640px) {
    .footer-grid {
        grid-template-columns: 1fr;
    }

    .capabilities-list .capability-item {
        padding: 2rem 0;
    }

    .solution-row {
        grid-template-columns: 1fr;
        padding: 2rem 0;
        gap: 0.5rem;
    }

    .solution-row .sol-arrow {
        display: none;
    }

    .proof-card {
        padding: 1.5rem;
    }
}