/* segmentos */

.segmentos {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .segmentos .container {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        grid-template-rows: repeat(3, 1fr);
        column-gap: var(--base-grid-spacing);
        row-gap: var(--spacing-40);
    }
    

        .segmentos .titulo-texto {
            display: flex;
            flex-direction: column;
            gap: var(--spacing-18);
            grid-column: 1/9;
            grid-row: 1/2;
        }

        .segmentos .img-container {
            grid-row: 1/3;
            grid-column: 9/13;
            background-image: url(../assets/img/segmentos-img.jpg);
            border-radius: 0 var(--main-border-radius);
        }

        .segmentos .grupo-segmento, .segmentos .grupo-segmento .icone-h2 {
            display: flex;
            flex-direction: column;
            gap: var(--spacing-14);
        }

            .segmentos .grupo-segmento p {
                color: var(--preto-950);
            }

        .segmentos .cultura {
            grid-column: 1/5;
            grid-row: 2/3;
        }

            .segmentos .cultura .icone-segmento {
                width: 2.75rem; /*44px*/
                height: 3rem; /*48px*/
            }

        .segmentos .criacoes-funcionais {
            grid-column: 5/9;
            grid-row: 2/3;
        }

            .segmentos .criacoes-funcionais .icone-segmento {
                width: 2.8125rem; /*45px*/
                height: 2.875rem; /*46px*/
            }

        .segmentos .tecnologia {
            grid-column: 1/5;
            grid-row: 3/4;
        }

            .segmentos .tecnologia .icone-segmento {
                width: 3.25rem; /*52px*/
                height: 2.71875rem; /*43.5px*/
            }

        .segmentos .midia {
            grid-column: 5/9;
            grid-row: 3/4;
        }

            .segmentos .midia .icone-segmento {
                width: 3.25rem; /*52px*/
                height: 2.76875rem; /*44.3px*/
            }


        .segmentos .gastronomia {
            grid-column: 9/13;
            grid-row: 3/4;
        }

            .segmentos .gastronomia .icone-segmento {
                width: 2.75rem; /*44px*/
                height: 2.9375rem; /*47px*/
            }

            .segmentos .seta-abrir-segmentos {
                width: 42px;
                height: 42px;
            }

        .segmentos .linha-cinza-segmentos-1, .segmentos .linha-cinza-segmentos-2,.segmentos .linha-cinza-segmentos-3,.segmentos .linha-cinza-segmentos-4 {
            width: 100%;
            height: 2px;
            background-color: #bdbdbd;
        }