/* ==========================================================
   SYLFOW MARKET
   CONTAINER
========================================================== */

/* ==========================================================
   CONTENEUR PRINCIPAL
========================================================== */

.sf-container {
    width: 100%;
    max-width: var(--sf-container);
    margin-inline: auto;
    padding-inline: 1.25rem;
}

/* ==========================================================
   VARIANTES
========================================================== */

.sf-container-sm {
    max-width: 720px;
}

.sf-container-md {
    max-width: 960px;
}

.sf-container-lg {
    max-width: 1140px;
}

.sf-container-fluid {
    max-width: 100%;
}

/* ==========================================================
   SECTIONS
========================================================== */

.sf-section {
    padding-block: var(--sf-space-10);
}

.sf-section-sm {
    padding-block: var(--sf-space-7);
}

.sf-section-lg {
    padding-block: 8rem;
}

/* ==========================================================
   TITRE DE SECTION
========================================================== */

.sf-section-header {
    text-align: center;
    max-width: 760px;
    margin: 0 auto var(--sf-space-8);
}

.sf-section-header h2 {
    margin-bottom: var(--sf-space-4);
}

.sf-section-header p {
    margin-bottom: 0;
    color: var(--sf-text-light);
}

/* ==========================================================
   ESPACEMENTS
========================================================== */

.mt-0 { margin-top: 0; }
.mt-1 { margin-top: .5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 1.5rem; }
.mt-4 { margin-top: 2rem; }
.mt-5 { margin-top: 3rem; }

.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: .5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }
.mb-4 { margin-bottom: 2rem; }
.mb-5 { margin-bottom: 3rem; }

.pt-0 { padding-top: 0; }
.pt-1 { padding-top: .5rem; }
.pt-2 { padding-top: 1rem; }
.pt-3 { padding-top: 1.5rem; }
.pt-4 { padding-top: 2rem; }

.pb-0 { padding-bottom: 0; }
.pb-1 { padding-bottom: .5rem; }
.pb-2 { padding-bottom: 1rem; }
.pb-3 { padding-bottom: 1.5rem; }
.pb-4 { padding-bottom: 2rem; }

/* ==========================================================
   RESPONSIVE
========================================================== */

@media (max-width: 1200px) {
    .sf-container {
        max-width: 1140px;
    }
}

@media (max-width: 992px) {
    .sf-container {
        max-width: 960px;
        padding-inline: 1rem;
    }

    .sf-section {
        padding-block: 5rem;
    }
}

@media (max-width: 768px) {
    .sf-container {
        padding-inline: .875rem;
    }

    .sf-section {
        padding-block: 4rem;
    }

    .sf-section-header {
        margin-bottom: 3rem;
    }
}