.hero {
    background: var(--cor-cinza-claro);
    padding-block: var(--espaco-5) var(--espaco-6);
}

.hero__grid {
    display: grid;
    gap: var(--espaco-4);
    align-items: center;
}

.hero__imagem {
    background: var(--cor-branco);
    border-radius: var(--raio-borda-grande);
    box-shadow: var(--sombra-card);
    padding: var(--espaco-4);
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero__imagem img {
    width: 100%;
    height: auto;
    max-height: 480px;
    object-fit: contain;
}

/* Foto (não recorte de produto): preenche o card de ponta a ponta, sem padding branco */
.hero__imagem--foto {
    padding: 0;
    overflow: hidden;
}

.hero__imagem--foto img {
    max-height: none;
    aspect-ratio: 10 / 11;
    object-fit: cover;
    border-radius: var(--raio-borda-grande);
}

.grid-diferenciais {
    display: grid;
    gap: var(--espaco-4);
    grid-template-columns: 1fr;
    margin-top: var(--espaco-3);
}

.lista-segmentos {
    display: grid;
    gap: var(--espaco-2);
    grid-template-columns: 1fr;
    margin-top: var(--espaco-3);
}

.lista-segmentos li {
    background: var(--cor-cinza-claro);
    padding: var(--espaco-2);
    border-radius: var(--raio-borda);
    font-weight: var(--peso-medio);
    color: var(--cor-azul-marinho);
}

.lista-processo {
    display: grid;
    gap: var(--espaco-3);
    margin-top: var(--espaco-3);
}

.lista-processo li {
    display: flex;
    gap: var(--espaco-2);
    align-items: flex-start;
}

.lista-processo__numero {
    font-family: var(--fonte-titulos);
    font-weight: var(--peso-bold);
    font-size: 1.5rem;
    color: var(--cor-laranja);
    flex-shrink: 0;
}

@media (min-width: 640px) {
    .grid-diferenciais {
        grid-template-columns: repeat(2, 1fr);
    }

    .lista-segmentos {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .hero__grid {
        grid-template-columns: 1fr 1fr;
    }

    .grid-diferenciais {
        grid-template-columns: repeat(3, 1fr);
    }

    .lista-segmentos {
        grid-template-columns: repeat(3, 1fr);
    }

    .lista-processo {
        grid-template-columns: repeat(5, 1fr);
    }

    .lista-processo li {
        flex-direction: column;
    }
}
