/* Grid Layout Fixes and Improvements */

/* General Grid System */
.container {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding);
    width: 100%;
}

/* Features Grid */
.features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    margin-top: 3rem;
}

@media (max-width: 1024px) {
    .features-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .features-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
}

/* Industries Grid */
.industries-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    margin-top: 3rem;
}

@media (max-width: 1024px) {
    .industries-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .industries-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}

/* Options Grid */
.options-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    margin-top: 2rem;
}

@media (max-width: 1024px) {
    .options-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .options-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}

/* Testimonials Grid */
.testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    margin-top: 3rem;
}

@media (max-width: 1024px) {
    .testimonials-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .testimonials-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
}

/* Plans Grid (if needed) */
.plans-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    margin-top: 3rem;
}

@media (max-width: 1024px) {
    .plans-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .plans-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
}

/* Utility Grid Classes */
.grid-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
}

.grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.grid-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

@media (max-width: 768px) {
    .grid-2,
    .grid-3,
    .grid-4 {
        grid-template-columns: 1fr;
    }
}

/* Flexbox Fallback for older browsers */
@supports not (display: grid) {
    .features-grid,
    .industries-grid,
    .options-grid,
    .testimonials-grid,
    .plans-grid {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    
    .feature-card,
    .industry-card,
    .option-card,
    .testimonial-card,
    .plan-card {
        flex: 0 1 calc(33.333% - 1rem);
        margin-bottom: 2rem;
    }
    
    @media (max-width: 1024px) {
        .feature-card,
        .industry-card,
        .option-card,
        .testimonial-card,
        .plan-card {
            flex: 0 1 calc(50% - 1rem);
        }
    }
    
    @media (max-width: 768px) {
        .feature-card,
        .industry-card,
        .option-card,
        .testimonial-card,
        .plan-card {
            flex: 0 1 100%;
        }
    }
}
