@media all and (min-width: 1300px) {
    :root {
        --hs-width: 1900px;
        --hg-3: 3;
    }
} @media all and (max-width: 1300px) and (min-width: 800px) {
    :root {
        --hs-width: 1900px;
        --hg-3: 3;
    }
} @media all and (max-width: 800px) {
    :root {
        --hs-width: 1850px;
        --hg-3: 1;
    }
}

.home-section {
    display: grid;
    gap: var(--px-30);

    position: relative;
    z-index: 50;
    
    height: var(--hs-width);

    margin-top: calc(var(--hs-width) * -1);
}

.home-offers {
    display: grid;
    grid-template-columns: repeat(var(--hg-3), 1fr);
    gap: var(--px-20);

    max-width: 1200px;
    margin: 10px auto;

    justify-items: center;
    align-items: center;
}

    .home-offers .sur-mesure {
        grid-column: 2 span;

        padding: 20px 20px 20px 30px;

        display: grid;
        grid-template-columns: repeat(4, 1fr);
        border-radius: 30px;

        justify-items: center;
        align-items: center;
    }
        .home-offers .sur-mesure .label {
            grid-column: 3 span;
        }
            .home-offers .sur-mesure .label .title {
                line-height: 30px;
                font-size: 35px;
            }
            .home-offers .sur-mesure .label .subtitle {
                margin-top: 15px;
                font-size: 14px;
                opacity: .7;
            }