/* Seção Soluções Corporativas (home).
   Cards = mini-card com foto (css/home-sections.css). No celular eles viram
   "objeto de mídia" (regra compartilhada .vitrine-mini--foto); a partir de
   576 px ficam em pé: foto 3:2 em cima, texto embaixo e a dica no rodapé.
   O card inteiro é clicável: o link do título cobre o card (::after em
   .vitrine-mini__link). Carregado de dentro do template, depois do <head>. */

.section-unified-bg.home-bloco--corp {
    background:
        radial-gradient(40% 42% at 12% 32%, rgba(0, 255, 234, 0.08) 0%, rgba(0, 255, 234, 0) 70%),
        radial-gradient(36% 40% at 90% 70%, rgba(0, 140, 255, 0.07) 0%, rgba(0, 140, 255, 0) 70%);
    scroll-margin-top: 80px;
}

.corp-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.corp-card {
    position: relative;
}

/* Dica "Conhecer ... →": só visual (aria-hidden); reage ao hover/foco do card.
   Em bloco, não em inline-flex (o de .vitrine__more): no flex, quando o texto
   quebrava (992–1199 px, "Conhecer Internet / Dedicada") ele virava um item da
   largura da linha e empurrava a seta para a borda do card. Em bloco a seta
   segue a última palavra (.corp-card__dica-fim não quebra). O padding de
   0.7rem mantém os 44 px de altura da dica de uma linha (line-height 21,6 px)
   e deixa a última linha das quatro dicas na mesma altura, mesmo quando uma
   delas tem duas linhas. */
.corp-card__dica {
    display: block;
    min-height: 0;
    padding: 0.7rem 0.4rem 0.7rem 0;
    pointer-events: none;
}

.corp-card__dica-fim {
    white-space: nowrap;
}

.corp-card__dica .bi {
    margin-left: 0.35rem;
}

.corp-card:hover .corp-card__dica,
.corp-card:focus-within .corp-card__dica {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.corp-card__seta {
    display: none;
    margin-left: 0.45rem;
    font-size: 0.9em;
}

body.dark-theme .home-bloco .corp-card__seta {
    color: var(--vn-neon-blue, #00ffea) !important;
}

@media (min-width: 576px) {
    .corp-card {
        flex-direction: column;
        flex: none;
        min-height: 0;
    }

    .corp-card .vitrine-mini__media {
        flex: none;
        min-height: 0;
        aspect-ratio: 3 / 2;
    }

    .corp-card .vitrine-mini__panel {
        flex: 1 1 auto;
        justify-content: flex-start;
        padding: 1rem 1.15rem 0.6rem;
    }

    /* Dica sempre no pé do card, alinhada entre os quatro. */
    .corp-card__dica {
        margin-top: auto;
    }
}

@media (max-width: 991.98px) {
    .corp-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Celular: sem a linha da dica (o card fica ~60 px mais curto); a seta vai
   para o fim do título, que é o link. */
@media (max-width: 575.98px) {
    .corp-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.85rem;
    }

    .corp-card__dica {
        display: none;
    }

    .corp-card__seta {
        display: inline-block;
    }

    .corp-card.vitrine-mini--foto {
        padding-bottom: 1rem;
        grid-template-columns: 112px minmax(0, 1fr);
    }

    .corp-card.vitrine-mini--foto .vitrine-mini__media {
        width: 112px;
        aspect-ratio: 4 / 3;
    }
}