/* ============================================================
   PORTAL TEC – Estilo Grid / Moderno (Corregido + 3/2/1 columnas)
   - Misma altura para todas las tarjetas
   - Imágenes con tamaño uniforme
   - Botones más grandes
   - Solo afecta portada gracias a .page_index_site
   ============================================================ */

/* Fondo limpio */
.page_index_site {
    background: transparent !important;
    padding: 20px 0;
}

/* ===== GRID (máx 3 columnas centradas) ===== */
.page_index_site .media-list {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(260px, 1fr)) !important; /* 3 columnas */
    gap: 28px !important;
    padding: 0 !important;
    margin: 0 auto !important;          /* centra el grid */
    list-style: none !important;
    justify-content: center !important;  /* centra las columnas si falta espacio */
    max-width: 1200px !important;        /* ancho máximo del grid */
}

/* 2 columnas en pantallas medianas */
@media (max-width: 1100px) {
    .page_index_site .media-list {
        grid-template-columns: repeat(2, minmax(260px, 1fr)) !important;
        max-width: 820px !important;
    }
}

/* 1 columna en móviles */
@media (max-width: 640px) {
    .page_index_site .media-list {
        grid-template-columns: 1fr !important;
        max-width: 480px !important;
    }
}

/* ===== TARJETA ===== */
.page_index_site .media {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;

    background: #ffffff !important;
    border-radius: 16px !important;
    padding: 18px !important;
    border: 1px solid #e3e5e8 !important;
    box-shadow: 0 6px 20px rgba(0,0,0,0.08) !important;

    text-align: center !important;

    /* ✅ Misma altura para todas */
    height: 400px !important;

    overflow: hidden !important;

    /* Efecto hover suave */
    transition: all 0.3s ease !important;
}
.page_index_site .media:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.12) !important;
}

/* Bloquear márgenes heredados de Bootstrap (evita alturas raras en la 1ª) */
.page_index_site .media,
.page_index_site .media-list .media {
    margin: 0 !important;
}
.page_index_site .media-list > li:first-child,
.page_index_site .media:first-child {
    margin-top: 0 !important;
}

/* ===== IMÁGENES UNIFORMES ===== */
.page_index_site .media-left {
    margin-bottom: 12px !important;
    width: 100% !important;
}
.page_index_site .media-left img {
    display: block !important;
    margin: 0 auto 12px !important;

    max-height: 160px !important;
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;

    object-fit: contain !important; /* no estira, no hace crecer la tarjeta */
    border-radius: 10px !important;
    box-shadow: 0 3px 10px rgba(0,0,0,0.20) !important;
}

/* ===== TÍTULOS ===== */
.page_index_site .media-heading a {
    font-size: 1.45rem !important;
    font-weight: 700 !important;
    color: #111 !important;
    text-decoration: none !important;
    margin-bottom: 10px !important;
    display: block !important;

    /* Previene saltos de línea que cambien altura global */
    min-height: 48px !important;
    line-height: 1.25 !important;
}

/* ===== OCULTAR DESCRIPCIÓN ===== */
.page_index_site .media-body p,
.page_index_site .media-body .description {
    display: none !important;
}

/* ===== ESTRUCTURA ===== */
.page_index_site .media-body {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    width: 100% !important;
}

/* ===== BOTONES ===== */
.page_index_site .media-body .nav-pills {
    margin-top: auto !important;
    display: flex !important;
    justify-content: center !important;
    gap: 12px !important;
}

/* Tamaño más grande */
.page_index_site .media-body .nav-pills a {
    display: inline-block !important;
    padding: 10px 18px !important;     /* más grande */
    border-radius: 50px !important;
    font-weight: 600 !important;
    font-size: 1.2rem !important;      /* más grande */
    text-decoration: none !important;
    color: #ffffff !important;
    line-height: 1.2 !important;       /* mejora legibilidad */
}

/* Botón azul */
.page_index_site .media-body .nav-pills li.view a {
    background: #0d6efd !important;
}

/* Botón gris */
.page_index_site .media-body .nav-pills li.current a {
    background: #6c757d !important;
}

/* Hover */
.page_index_site .media-body .nav-pills a:hover {
    filter: brightness(0.92) !important;
}

/* ===== RESPONSIVE ajustes tarjeta ===== */
@media (max-width: 600px) {
    .page_index_site .media {
        height: auto !important;
        padding-bottom: 30px !important;
    }
    .page_index_site .media-left img {
        max-height: 130px !important;
    }
}