:root {
    /* --primary: #004386;
--secondary: #004992;
--dark: #013966;
--bs-blue: #0d6efd;
--bs-indigo: #6610f2;
--bs-cyan: #0dcaf0;
--bs-primary: #00D1F9;
--bs-secondary: #19 09A;
--bs-info: #0dcaf0;
--bs-dark: #001442;
--light: #AEDFF2;
--bs-light: #F2F9F9; */
    --primary: #004386;
    /* Azul oscuro profesional */
    --secondary: #0055A4;
    /* Azul más brillante pero firme */
    --bs-primary: #00B8E6;
    /* Cian moderno para acentos */
    --bs-secondary: #3366CC;
    /* Azul institucional más claro */
    --bs-info: #33CCFF;
    /* Azul claro informativo */
    --bs-cyan: #0dcaf0;
    /* Lo mantenemos, encaja bien */
    --light: #D6F1FA;
    /* Celeste muy claro */
    --bs-light: #F2FAFD;
    /* Blanco azulado más sutil */
    --dark: #012B50;
    /* Azul navy muy profundo */
    --bs-dark: #001B33;
    /* Casi negro, tono frío */
    --bs-blue: #1976D2;
    /* Azul medio, de alto contraste */
    --bs-indigo: #3F51B5;
    /* Azul violáceo sobrio */
    /* Morados / Púrpuras (Purple / Pink): */
    --bs-purple: #6f42c1;
    --bs-pink: #d63384;
    /* Rojos (Red / Danger): */
    --bs-red: #dc3545;
    --bs-danger: #dc3545;
    /* Naranjas / Amarillos (Orange / Yellow / Warning): */
    --bs-orange: #fd7e14;
    --bs-yellow: #ffc107;
    --bs-warning: #ffc107;
    /* Verdes (Green / Success / Teal): */
    --bs-green: #198754;
    --bs-success: #198754;
    --bs-teal: #20c997;
    /* Grises / Neutros: */
    --bs-gray: #6c757d;
    --bs-gray-dark: #343a40;
    --bs-white: #fff
}


.icon-circle {
    width: 36px;
    height: 36px;
    border: 2px solid white;
    border-radius: 50%;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

.footer {
    font-size: 14px;
}

.footer-link {
    color: #ccc;
    text-decoration: none;
}

.footer-link:hover {
    text-decoration: underline;
    color: #fff;
}

.social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background-color: #333;
    border-radius: 50%;
    color: white;
    font-size: 14px;
    text-decoration: none;
}

.social-icon:hover {
    background-color: #555;
    color: #fff;
}


.footer-link {
    color: #ccc;
    text-decoration: none;
}

.footer-link:hover {
    text-decoration: underline;
    color: #fff;
}

.social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background-color: #333;
    border-radius: 50%;
    color: white;
    font-size: 14px;
    text-decoration: none;
}

.social-icon:hover {
    background-color: #555;
    color: #fff;
}

.footer h6 {
    letter-spacing: 0.5px;
}


.footer-link {
    color: #ffffff;
    text-decoration: none;
}

.footer-link:hover {
    text-decoration: underline;
    color: #ffffff;
}

.social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background-color: transparent;
    border: 1px solid #ffffff;
    border-radius: 50%;
    color: white;
    font-size: 14px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.social-icon:hover {
    background-color: #ffffff;
    color: #000000;
}

.footer h6 {
    color: #ffffff !important;
}

#map {
    height: 100%;
}

html,
body {
    height: 100%;
    margin: 0;
    padding: 0;
}

#map {
    height: 400px;
    /* The height is 400 pixels */
    width: 100%;
    /* The width is the width of the web page */
}

.map-icons-container {
    text-align: center;
    margin-top: 40px;
}

.map-icon {
    display: inline-block;
    margin: 0 15px;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s;
}

.map-icon:hover {
    transform: scale(1.1);
}

.map-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.bg-breadcrumb .overlay {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* negro con opacidad 50% */
    z-index: 1;
}

.carousel-item {
    position: relative;
}

.carousel-item.dark-overlay::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    /* negro con opacidad */
    z-index: 1;
}

.carousel-caption-1,
.carousel-caption-2 {
    position: relative;
    z-index: 2;
    /* asegura que el texto esté encima del overlay */
}

.carousel-control-prev, .carousel-control-next {
    z-index: 3;
}
.fontsize_comollegar {
        font-size: calc(1.525rem + 3.3vw);
}

.bg-breadcrumb .overlay {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* negro con opacidad 50% */
    z-index: 1;
}

.carousel-item {
    position: relative;
}

.carousel-item.dark-overlay::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    /* negro con opacidad */
    z-index: 1;
}

.carousel-caption-1,
.carousel-caption-2 {
    position: relative;
    z-index: 2;
    /* asegura que el texto esté encima del overlay */
}

.carousel-control-prev, .carousel-control-next {
    z-index: 3;
}