@media screen and (max-width: 1200px) {
    .container {
        padding: 0 5.5rem;
    }

    .nav-secondary {
        padding: 0.75rem 5.5rem;
    }

    .nav-primary {
        padding: 1.5rem 5.5rem;
    }

    .about-content {
        gap: 5.5rem;
    }

    .artisans-grid {
        grid-template-columns: repeat(2, 1fr);
    }

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

    .news-img img {
        height: 600px;
    }

    .news-card {
        gap: 1.5rem;
    }

    .footer-top-content {
        gap: 4rem;
        flex-direction: column;
    }

    .artisans-page-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (max-width: 1024px) {
    .container {
        padding: 0 2rem;
    }

    .nav-primary ul {
        display: none;
    }

    .menu-mobile {
        display: flex;
    }

    .nav-secondary {
        padding: 0.75rem 2.5rem;
    }

    .nav-primary {
        padding: 1.5rem 2.5rem;
    }

    .valeurs-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .about-content {
        flex-direction: column;
        gap: 3rem;
    }

    .about-content-details {
        width: 100%;
    }

    .about .about-content:last-child {
        flex-direction: column;
    }

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

    .contact-page-content {
        grid-template-columns: repeat(1, 1fr);
        gap: 3rem;
    }

    .lieu-content {
        flex-direction: column;
        gap: 2rem;
    }

    .lieu-content .right{
        width: 100%;
    }

    .hero-content .titles p {
        width: 100%;
    }

    .background-image {
        height: 800px; 
    }

    .paragraph-intro {
        width: 100%;
    }
}

@media screen and (max-width: 768px) {
    h1 {
        font-size: 2.5rem !important;
    }

    h2 {
        font-size: 2rem !important;
    }

    h3 {
        font-size: 1.5rem !important;
    }

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

    .hero {
        padding: 5rem 0;
    }

    .line-decoration {
        display: none;
    }

    .footer-navigation, .footer-bottom-content, .footer-bottom-content .left, .footer-bottom-content .right ul {
        flex-direction: column;
    }

    .contact-details {
        flex-direction: column;
        gap: 3rem;
    }

    .footer-bottom-content {
        align-items: flex-start;
        gap: 2rem;
        flex-direction: column-reverse;
    }

    .valeurs, .about, .artisans, .news {
        padding: 5rem 0 5rem 0
    }

    .divider {
        margin: 3.25rem 0 3.25rem 0;
    }

    .news-img img {
        height: 450px;
    }

    .footer-top {
        padding: 5rem 0;
    }

    .artisans-page-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .artisans-works-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .artisans-works-img.large {
        grid-column: 1;
    }

    .artisans-works-img.large img {
        height: 400px;
    }

    .artisans-works-img img {
        height: 400px;
    }

    .one-artisans, .artisans-works, .one-evenements, .contact-page, .lieu {
        padding: 5rem 0 5rem 0;
    }

    .artisans-page, .news-page {
        padding-bottom: 5rem;
    }

    .one-evenements-content .details {
        padding: 3rem 0 3rem 0;
        flex-direction: column;
        gap: 1rem;
    }

    .one-evenements-content .middle img {
        object-fit: cover;
    }

    .one-evenements-content .bottom {
        grid-template-columns: repeat(1, 1fr);
        gap: 5rem;
    }

    .lieu-content .left img {
        height: 400px;
    }
}

@media screen and (max-width: 500px) {
    .container {
        padding: 0 1.5rem;
    }

    .nav-secondary {
        padding: 0.75rem 1.5rem;
    }

    .nav-primary {
        padding: 1.5rem 1.5rem;
    }

    .nav-secondary {
        justify-content: center;
    }

    .nav-secondary ul {
        justify-content: space-between;
        width: 100%;
    }

    .about-img img {
        height: 400px;
    }

    .news-card {
        gap: 1rem;
    }

    .news-img img {
        height: 350px;
    }

    .arrow {
        width: 3.25em;
        height: 3.25em;
    }

    .button-content {
        height: 3.25em;
        transform: translateX(-3.25em) rotate(0.001deg);
    }

    .button-content .button-text {
        padding: 0 1.5em;
    }

    .filters-tags {
        flex-wrap: wrap;
    }

    .contact-page-content .right {
        padding: 2.25rem;
    }

    .row {
        flex-direction: column;
    }

    .details-cell {
        width: 100%;
    }

    .contact-page-fast {
        flex-direction: column;
        gap: 3rem;
    }
}