/* Responsive Cards Styles */
@media (max-width: 992px) {
    .capabilities-grid {
        justify-content: flex-start !important;
        overflow-x: auto !important;
        padding: 0.5rem 0.5rem 1.5rem 0.5rem !important;
        scroll-behavior: smooth !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: thin !important;
        scrollbar-color: rgba(255, 51, 51, 0.5) rgba(15, 15, 15, 0.3) !important;
        gap: 0.8rem !important;
        margin-left: -0.5rem !important;
        margin-right: -0.5rem !important;
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
        position: relative !important;
        flex-wrap: nowrap !important;
    }
    
    .capabilities-grid::-webkit-scrollbar {
        height: 4px;
    }
    
    .capabilities-grid::-webkit-scrollbar-track {
        background: rgba(15, 15, 15, 0.3);
        border-radius: 4px;
    }
    
    .capabilities-grid::-webkit-scrollbar-thumb {
        background: rgba(255, 51, 51, 0.5);
        border-radius: 4px;
    }
    
    .capability-card {
        flex: 0 0 180px !important;
        max-width: 180px !important;
        margin-bottom: 0.5rem;
    }
    
    /* Add scroll indicator hint */
    .capabilities-grid::after {
        content: '';
        position: absolute;
        right: 0;
        top: 0;
        height: 100%;
        width: 30px;
        background: linear-gradient(to right, transparent, rgba(15, 15, 15, 0.7));
        pointer-events: none;
        opacity: 0.8;
        z-index: 1;
    }
    
    /* Ecosystem section cards */
    .ecosystem-section .capabilities-grid {
        justify-content: flex-start !important;
        overflow-x: auto !important;
        padding: 0.5rem 0.5rem 1.5rem 0.5rem !important;
        position: relative !important;
    }
    
    .ecosystem-section .capability-card {
        flex: 0 0 220px !important;
        max-width: 220px !important;
    }
    
    /* Industries section cards */
    .industries-grid {
        display: flex !important;
        flex-wrap: wrap !important;
        overflow-x: visible !important;
        gap: 1rem !important;
        padding: 0.5rem !important;
        position: relative !important;
        justify-content: center !important;
    }
    
    .industries-grid::-webkit-scrollbar {
        display: none;
    }
    
    /* Remove scroll indicator from industries grid */
    .industries-grid::after {
        display: none;
    }
    
    .industry-card {
        flex: 0 0 calc(25% - 1rem) !important;
        max-width: calc(25% - 1rem) !important;
        margin-bottom: 1rem;
    }
    
    /* Add media query for smaller screens */
    @media (max-width: 768px) {
        .industry-card {
            flex: 0 0 calc(50% - 1rem) !important;
            max-width: calc(50% - 1rem) !important;
        }
    }
    
    @media (max-width: 480px) {
        .industry-card {
            flex: 0 0 calc(100% - 1rem) !important;
            max-width: calc(100% - 1rem) !important;
        }
    }
    
    /* Add swipe hint */
    .card-container-hint {
        text-align: center;
        color: rgba(255, 255, 255, 0.6);
        font-size: 0.75rem;
        margin-top: -1rem;
        margin-bottom: 1.5rem;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
    }
    
    .card-container-hint i {
        font-size: 0.8rem;
        animation: swipeHint 1.5s infinite;
    }
    
    @keyframes swipeHint {
        0%, 100% { transform: translateX(0); }
        50% { transform: translateX(5px); }
    }
} 

/* Additional Footer Responsive Styles */
@media (max-width: 992px) {
    /* Fix footer contact row stacking issues */
    .footer-contact-row {
        flex-direction: column !important;
        gap: 20px !important;
    }
    
    .footer-contact-col {
        width: 100% !important;
    }
    
    .footer-contact-col:last-child {
        align-items: flex-start !important;
    }
    
    .social-icons {
        justify-content: flex-start !important;
        margin-top: 10px;
    }
    
    /* Ensure footer bottom elements stack properly */
    .footer-bottom {
        flex-direction: column !important;
        gap: 15px !important;
        text-align: center !important;
    }
    
    .footer-policies {
        justify-content: center !important;
        flex-wrap: wrap !important;
    }
}

@media (max-width: 768px) {
    /* Adjust grid layout for smaller screens */
    .footer-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 30px !important;
    }
    
    /* Company description and logo adjustments */
    .company-description {
        font-size: 0.8rem !important;
    }
    
    .footer-logo img {
        max-width: 150px !important;
    }
    
    /* Make contact information centered */
    .footer-contact {
        align-items: flex-start !important;
    }
    
    .footer-contact p {
        font-size: 0.85rem !important;
    }
    
    /* Fix social icons alignment */
    .social-icons {
        justify-content: flex-start !important;
    }
}

@media (max-width: 576px) {
    /* Stack all footer columns on smallest screens */
    .footer-grid {
        grid-template-columns: 1fr !important;
        gap: 25px !important;
    }
    
    /* Reduce padding to save space */
    .site-footer {
        padding: 40px 0 20px !important;
    }
    
    .footer-container {
        padding: 0 15px !important;
    }
    
    /* Fix spacing and alignment */
    .footer-col h4 {
        margin-bottom: 15px !important;
    }
    
    .footer-links li {
        margin-bottom: 8px !important;
    }
    
    /* Center social icons on smallest screens */
    .social-icons {
        justify-content: center !important;
        width: 100% !important;
    }
    
    /* Center footer policies */
    .footer-policies a {
        margin: 0 8px !important;
        font-size: 0.75rem !important;
    }
    
    /* Fix footer contact info alignment */
    .footer-contact p {
        margin-bottom: 8px !important;
    }
}