/* =========================================================
   INFRAESTRUTURA
========================================================= */

.infraestrutura {

    width: 100%;

    padding: 90px 0;

    background: #00263f;

    overflow: hidden;
}

.infra-container {

    width: 88%;

    max-width: 1500px;

    margin: 0 auto;
}

/* =========================================================
   TOPO
========================================================= */

.infra-topo {

    display: grid;

    grid-template-columns: 180px 1fr 1fr;

    gap: 50px;

    align-items: start;

    margin-bottom: 60px;
}

.infra-label {

    color: #c7a15e;

    font-family: 'HomepageBold', Arial, sans-serif;

    font-size: 13px;

    line-height: 1.4;

    letter-spacing: 5px;

    text-transform: uppercase;

    padding-top: 18px;
}

.infra-topo h2 {

    color: #f4ead6;

    font-family: 'Crosever', serif;

    font-size: 62px;

    line-height: 1.05;

    font-weight: normal;

    padding-left: 38px;

    border-left: 1px solid rgba(199,161,94,.7);

    margin: 0;
}

.infra-texto {

    padding-top: 10px;
}

.infra-texto p {

    color: rgba(255,255,255,.88);

    font-family: 'HomepageBook', Arial, sans-serif;

    font-size: 18px;

    line-height: 1.8;

    margin-bottom: 22px;
}

/* =========================================================
   CARDS
========================================================= */

.infra-cards {

    display: grid;

    grid-template-columns: repeat(6, 1fr);

    gap: 12px;

    margin-bottom: 45px;
}

.infra-card {

    background: #f4ead6;

    border-radius: 16px;

    padding: 30px 18px;

    text-align: center;

    min-height: 280px;
}

.infra-card img {

    width: 72px;

    height: 72px;

    object-fit: contain;

    margin-bottom: 20px;
}

.infra-card h3 {

    color: #00263f;

    font-family: 'HomepageBold', Arial, sans-serif;

    font-size: 15px;

    line-height: 1.3;

    letter-spacing: 2px;

    text-transform: uppercase;

    margin-bottom: 18px;
}

.infra-card h3:after {

    content: "";

    display: block;

    width: 34px;

    height: 3px;

    background: #c7a15e;

    margin: 14px auto 0 auto;
}

.infra-card p {

    color: #00263f;

    font-family: 'HomepageBook', Arial, sans-serif;

    font-size: 15px;

    line-height: 1.6;
}

/* =========================================================
   IMPLANTAÇÃO
========================================================= */

.infra-implantacao {

    width: 100%;

    margin-top: 40px;
}

.infra-implantacao img {

    width: 100%;

    display: block;

    border-radius: 18px;
}

.infra-faixa {

    width: 380px;

    margin: 35px auto 0 auto;

    background: #c7a15e;

    color: #00263f;

    text-align: center;

    padding: 18px 20px;

    font-family: 'HomepageBold', Arial, sans-serif;

    font-size: 18px;

    letter-spacing: 3px;

    text-transform: uppercase;
}

/* =========================================================
   TABLET
========================================================= */

@media screen and (max-width:1100px) {

    .infra-topo {

        grid-template-columns: 1fr;

        gap: 20px;
    }

    .infra-topo h2 {

        border-left: none;

        padding-left: 0;

        font-size: 42px;
    }

    .infra-label {

        padding-top: 0;
    }

    .infra-cards {

        grid-template-columns: repeat(3,1fr);
    }
}

/* =========================================================
   MOBILE
========================================================= */

@media screen and (max-width:768px) {

    .infraestrutura {

        padding: 70px 0;
    }

    .infra-container {

        width: 88%;
    }

    .infra-topo h2 {

        font-size: 34px;
    }

    .infra-texto p {

        font-size: 16px;
    }

    .infra-cards {

        grid-template-columns: repeat(2,1fr);

        gap: 12px;
    }

    .infra-card {

        min-height: 240px;

        padding: 22px 14px;
    }

    .infra-card img {

        width: 58px;

        height: 58px;
    }

    .infra-card h3 {

        font-size: 13px;
    }

    .infra-card p {

        font-size: 13px;
    }

    .infra-faixa {

        width: 100%;

        font-size: 14px;

        letter-spacing: 2px;
    }
}