/* =========================================================
   MC2 DELIVERY
   FOOTER
========================================================= */


/* =========================================================
   ESTRUTURA DO FOOTER
========================================================= */

html,
body {

    min-height: 100%;

    margin: 0;

}


body {

    min-height: 100vh;

    display: flex;

    flex-direction: column;

}


.site-wrapper {

    flex: 1 0 auto;

    width: 100%;

}


/* =========================================================
   FOOTER PRINCIPAL
========================================================= */

.site-footer {

    width: 100%;

    margin-top: auto;

    background: #f7f7f7;

    border-top: 1px solid #eeeeee;

    box-sizing: border-box;

}


/* =========================================================
   CONTAINER
========================================================= */

.footer-container {

    width: 100%;

    max-width: 1320px;

    margin: 0 auto;

    padding:
        45px 24px 25px;

    box-sizing: border-box;

}


/* =========================================================
   COLUNAS
========================================================= */

.footer-columns {

    display: grid;

    grid-template-columns:
        minmax(220px, 1.4fr)
        repeat(3, minmax(160px, 1fr));

    gap: 45px;

}


/* =========================================================
   MARCA
========================================================= */

.footer-brand {

    display: flex;

    flex-direction: column;

    align-items: flex-start;

}


.footer-logo {

    display: inline-block;

    margin-bottom: 12px;

    color: #ea1d2c;

    font-size: 22px;

    font-weight: 800;

    line-height: 1.2;

    text-decoration: none;

}


.footer-brand p {

    max-width: 230px;

    margin: 0;

    color: #777777;

    font-size: 14px;

    line-height: 1.5;

}


/* =========================================================
   COLUNA
========================================================= */

.footer-column {

    display: flex;

    flex-direction: column;

    align-items: flex-start;

}


.footer-column h3 {

    margin: 0 0 16px;

    color: #222222;

    font-size: 16px;

    font-weight: 700;

    line-height: 1.3;

}


.footer-column a {

    margin-bottom: 10px;

    color: #666666;

    font-size: 14px;

    line-height: 1.4;

    text-decoration: none;

    transition:
        color 0.2s ease;

}


.footer-column a:hover {

    color: #ea1d2c;

}


/* =========================================================
   DIVISOR
========================================================= */

.footer-divider {

    width: 100%;

    height: 1px;

    margin:
        32px 0;

    background: #e3e3e3;

}


/* =========================================================
   INFORMAÇÕES DA EMPRESA
========================================================= */

.footer-company {

    display: flex;

    flex-direction: column;

    gap: 7px;

    text-align: center;

}


.footer-social-title {

    margin-bottom: 5px;

    color: #222222;

    font-size: 15px;

    font-weight: 700;

}


.footer-company p {

    margin: 0;

    color: #777777;

    font-size: 13px;

    line-height: 1.5;

}


/* =========================================================
   LINKS LEGAIS
========================================================= */

.footer-legal {

    display: flex;

    align-items: center !important;

    justify-content:  center !important;

    flex-wrap: wrap;

    gap: 20px;

}


.footer-legal a {

    color: #666666;

    font-size: 13px;

    text-decoration: none;

}


.footer-legal a:hover {

    color: #ea1d2c;

    text-decoration: underline;

}


/* =========================================================
   FOOTER MOBILE
========================================================= */

@media screen and (max-width: 700px) {


    .site-footer {
        
        display: none;


    }



/* =========================================================
   CELULAR PEQUENO
========================================================= */

@media screen and (max-width: 430px) {


    .site-footer {
        
        display: none;


    }

}