/**
 * LS Entreprises - Layout Fixes
 * Additional fixes for alignment and overflow issues
 */

/* Prevent horizontal overflow */
html, body {
    max-width: 100%;
    overflow-x: hidden;
}

/* Ensure all sections stay within viewport */
.section,
.hero,
.site-header,
.site-footer {
    max-width: 100vw;
    overflow-x: hidden;
}

/* Fix hero content centering */
.hero-content {
    width: 100%;
    max-width: 100%;
}

.hero-title,
.hero-subtitle {
    max-width: 100%;
    word-wrap: break-word;
}

/* Grid container fixes */
.grid {
    max-width: 100%;
    overflow: visible;
}

/* Card improvements */
.card {
    max-width: 100%;
    box-sizing: border-box;
}

.card-title,
.card-description {
    word-break: break-word;
    hyphens: auto;
}

/* Button text wrap prevention */
.btn {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Footer contact list alignment */
.footer-contact li {
    word-break: break-word;
}

/* Stats grid spacing fix */
.stats-grid {
    max-width: 100%;
}

/* Ensure container padding is correct on all devices */
@media (max-width: 768px) {
    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    
    /* Fix hero padding on mobile */
    .hero-content {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    
    /* Adjust grid gap for mobile */
    .grid {
        gap: 1rem;
    }
    
    /* Fix card padding on small screens */
    .card {
        padding: 1.5rem;
    }
}

@media (max-width: 480px) {
    .container {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
    
    .hero-content {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
    
    .card {
        padding: 1rem;
    }
    
    .grid {
        gap: 0.75rem;
    }
}

/* Fix long words breaking layout */
p, li, span, div {
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* Ensure images don't overflow */
img {
    max-width: 100%;
    height: auto;
}

/* Fix navigation overflow on very small screens */
@media (max-width: 360px) {
    .logo {
        font-size: 1.1rem;
    }
    
    .nav-link {
        font-size: 0.85rem;
        padding: 0.4rem 0.6rem;
    }
}

/* Hero section responsive improvements */
.hero {
    width: 100%;
    max-width: 100vw;
}

/* Stat numbers should not wrap */
.stat-number {
    white-space: nowrap;
}

/* Footer grid responsive */
.footer-grid {
    width: 100%;
    max-width: 100%;
}

/* Ensure form elements are responsive */
.form-input,
.form-select,
.form-textarea {
    max-width: 100%;
    box-sizing: border-box;
}

/* Fix testimonial cards */
.testimonial-card {
    width: 100%;
    max-width: 100%;
}

/* Swiper container fixes (if using carousels) */
.swiper-container,
.swiper-wrapper {
    width: 100%;
    max-width: 100%;
}

/* Blog content responsive */
.blog-content {
    max-width: 100%;
    overflow-wrap: break-word;
}

.blog-content img {
    max-width: 100%;
    height: auto;
}

.blog-content pre {
    overflow-x: auto;
    max-width: 100%;
}

/* Table responsive */
table {
    max-width: 100%;
    overflow-x: auto;
    display: block;
}

/* Fix sticky elements on mobile */
@media (max-width: 768px) {
    .sticky-cta {
        left: 1rem;
        right: 1rem;
        width: auto;
    }
    
    .sticky-cta .btn {
        width: 100%;
    }
}