.tile__image {
    display: none;
}

.tile {
    display: inline-block;
    padding: 20px 20px;
    background-color: white;
    border: 2px solid #e0e4ef;
    border-radius: 20px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
    color: #202020;
    text-align: center;
    text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s;
    width: 255px;
    box-sizing: border-box;
}

.tile:hover {
    background-color: white;
    box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.4);
    border: 2px solid #28A2C4;
}

.grid {
    display: flex;
    flex-wrap: wrap; /* Allow buttons to wrap onto the next line */
    justify-content: center; /* Center the buttons */
    gap: 20px; /* Space between buttons */
}

.vp-tree-item__header {
    border-bottom: 1px solid #9299AE;
    padding: 4px 16px 4px 16px !important;
    display: flex;
    flex-direction: row !important;
    justify-content: space-between;
    align-items: center;
    border-radius: 0px !important;
}

.vp-article {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

.vp-desktop-navigation__page-tree__collapser {
    display: none;
}

.vp-desktop-navigation__page-tree {
    padding: 0px !important;
    width: 400px;
}

.vp-article__aside-left {
    width: 400px;
}

.vp-tree-item {
    background-color: #F4F5F7;
    --_background-color-hovered: white;
    --_background-color-selected: #F4F5F7;
    --_background-color-pressed: #F4F5F7 !important;
}

.vp-tree {
    --_row-gap: 0px;
}

.article-header {
    margin: 0 !important;
}

#main-content {
    display: block !important; /* Asegura que se comporte como un bloque */
    text-align: left !important; /* Alinea todo el contenido de texto a la izquierda */
}

.vp-article {
    --_content-spread-width: none !important;
}

.top-bar {
    max-width: 100%;
}

.vp-breadcrumbs {
    margin: 0;
}

.vp-tree-item__header svg:not(button svg) {
    display: none !important;
}

.vp-tree-item__header__title {
    font-size: 16px !important;
}

figure.vp-image img {
    border: 0px !important;
}

.hc-portal-banner {
    height: 40vh;
    margin-bottom: 50px !important;
}

@media (max-width: 768px) {
    .tile {
        width: 45%;
    }
}

@media (max-width: 480px) {
    .tile {
        width: 90%;
    }
}

/* ----------------------------- */
/* NUEVO: Color personalizado para H3 */
/* ----------------------------- */

.vp-article h3 {
    color: #1458BC !important;
}
