:root {
    --bs-primary: #242F56 !important;
    --bs-secondary: #bd1824 !important;
    --bs-tertiary: #706F6F !important;
    --bs-primary-rgb: 36, 47, 86;
    --bs-secondary-rgb: 189, 24, 36;
    --bs-tertiary-rgb: 112, 111, 111;

}

html,
body,
section {
    scroll-margin-top: 72px;

}

@media (max-width:768px) {

    html,
    body,
    section {
        scroll-margin-top: 160px;

    }
}




/* .text-primary {
            --bs-text-opacity: 1;
            color: rgba(var(--bs-primary-rgb), var(--bs-text-opacity)) !important
        } */

.text-tertiary {
    color: var(--bs-tertiary) !important;
}

section {
    /* min-height: 25vh; */
    padding: 3rem 1rem 3rem 1rem;
}

#carousel-hero .carousel-inner {
    width: 100%;
    aspect-ratio: 30/10 !important;
    overflow: hidden;
}

@media (max-width:768px) {
    #carousel-hero .carousel-inner {
        width: 100%;
        aspect-ratio: 10/15 !important;
    }
}


#carousel-hero .carousel-item {
    /* background: red; */
    height: 100%;
    /* background: var(--bs-secondary); */

    z-index: 0;
}

#carousel-hero .carousel-image {
    object-fit: cover;
    object-position: center;
    filter: saturate(.5) blur(2px);
}

.bg-azul {

    /* background: red; */
    background: var(--bs-primary);
}

h1,
h2,
h3 {
    color: var(--bs-primary) !important;
}

body {
    color: var(--bs-tertiary) !important;


}



p {
    text-align: justify !important;
}

* li::marker {
    color: #bd1824;
    font-size: 1.5rem;
}

.bg-secondary-bg {
    background: var(--bs-secondary-bg);
}

.equipo-img {
    width: 100%;
    max-width: 75%;
    aspect-ratio: 1/1 !important;
    object-fit: cover;
    object-position: top;
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#valores img {
    max-height: 100px;
    ;
}


.btn-secondary {
    --bs-btn-color: #fff;
    --bs-btn-bg: rgb(163, 13, 23);
    --bs-btn-border-color: rgb(170, 11, 21);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #bd1824;
    --bs-btn-hover-border-color: #bd1824;
    --bs-btn-focus-shadow-rgb: 189, 24, 36;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #bd1824;
    --bs-btn-active-border-color: #bd1823;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(189, 24, 36, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: rgb(153, 26, 34);
    --bs-btn-disabled-border-color: rgb(148, 17, 26)
}


/* --- ESTILOS GENERALES PARA SECCIONES PARALLAX --- */
.parallax-section {
    position: relative;
    background-size: cover;
    background-position: center center;
    color: #fff;
    /* Texto blanco por defecto */
    overflow: hidden;
    /* Prevenir contenido desbordado */
    /* Establece una altura mínima o padding */
    min-height: 45vh;
    /* Ejemplo de altura, ajusta según necesites */
    padding: 6rem 0;


}

/* Overlay oscuro opcional para mejorar legibilidad */
.parallax-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* background-color: rgba(0, 0, 0, 0.55); */
    /* Ajusta la opacidad */
    z-index: 0;
}

/* Contenido sobre el overlay */
.parallax-section .container {
    position: relative;
    z-index: 1;
}


/* Sección Parallax Intermedia (CTA) */
.cta-parallax-bg {
    background-image: url('../images/carousel/carousel-2.png') !important;
    background-size: cover;
    background-position: center;
    /* <<--- NUEVA IMAGEN DE FONDO */
    /* Hereda los estilos comunes de .parallax-section */
    /* Puedes añadir estilos específicos aquí si es necesario */
    width: 100%;
    min-height: 40vh;
    object-fit: contain;
    object-position: center;
    filter: saturate(.5);
    /* Altura diferente si quieres */
    background-attachment: fixed;
}

.cta-parallax-bg img {
    filter: saturate(.5);
}


/* --- FIN ESTILOS GENERALES PARALLAX --- */


.cookie-notice {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #333;
    color: #fff;
    padding: 10px;
    text-align: center;
}

.btn-cookie-accept {
    /* background-color: #4CAF50; */
    color: #fff;
    padding: 8px 16px;
    border: none;
    cursor: pointer;
    margin-top: 5px;
}

.btn-cookie-accept:hover {
    /* background-color: #45a049; */
}


#whatsappBtn {
    position: fixed;
    bottom: 10px;
    right: 30px;
    z-index: 99;
    width: 50px;
    height: 50px;
    background-color: #25D366;
    color: white;
    border: none;
    outline: none;
    border-radius: 50%;
    cursor: pointer;
}

#whatsappBtn:hover {
    background-color: #128C7E;
}

#whatsappBtn i {
    margin-top: 23px;
}


#scrollToTopBtn {

    display: none;
    position: fixed;
    bottom: 70px;
    right: 30px;
    z-index: 99;
    width: 50px;
    height: 50px;
    /* background-color: #555; */
    color: white;
    border: none;
    outline: none;
    border-radius: 50%;
    cursor: pointer;

}

#scrollToTopBtn:hover {
    /* background-color: #333; */
}

#carousel-logos .carousel-inner {
    /* width: 100%; */
    /* padding: 0 10rem 0 10rem; */
}

#carousel-logos .carousel-item {
    /* width: 100%; */
    padding: 0 10rem 0 10rem;
}

@media (max-width:768px) {
    #carousel-logos .carousel-item {
        /* width: 100%; */
        padding: 0 1rem 0 1rem;
    }
}

.carousel-control-next,
.carousel-control-prev {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 15%;
    padding: 0;
    color: #fff;
    text-align: center;
    background: 0 0;
    filter: var(--bs-carousel-control-icon-filter);
    border: 0;
    opacity: .75;
    transition: opacity .15s ease;
    margin-left: -1rem;
    margin-right: -1rem;
}

@media (prefers-reduced-motion:reduce) {

    .carousel-control-next,
    .carousel-control-prev {
        transition: none
    }
}

.carousel-control-next:focus,
.carousel-control-next:hover,
.carousel-control-prev:focus,
.carousel-control-prev:hover {
    color: #fff;
    text-decoration: none;
    outline: 0;
    opacity: .9
}

.carousel-control-prev {
    left: 0
}

.carousel-control-next {
    right: 0
}


#carousel-logos img {
    width: 100%;
    max-width: 200px;
    /* filter: saturate(0); */
}

#carousel-logos .carousel-control-next-icon,
#carousel-logos .carousel-control-prev-icon {
    display: inline-block;
    width: 2rem;
    height: 2rem;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 100% 100%
}

#carousel-logos .carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0'/%3e%3c/svg%3e");
    filter: invert(100%);
}

#carousel-logos .carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708'/%3e%3c/svg%3e");
    filter: invert(100%);
}

#servicios img {
    filter: saturate(.55) hue-rotate(0deg);
    ;
    object-fit: cover;
}

#porque img {
    max-width: 150px;
    aspect-ratio: 1;
}

blockquote {
    font-family: Georgia, serif;
    font-size: 1rem;
    font-style: italic;
    /* width: 500px; */
    margin: 0.25em 0;
    padding: 0.35em 40px;
    /* line-height: 1; */
    position: relative;
    color: #383838;
}

blockquote:before {
    display: block;
    padding-left: 10px;
    content: "\201C";
    font-size: 80px;
    position: absolute;
    left: -20px;
    top: -20px;
    /* color: #7a7a7a; */
}

blockquote cite {
    /* color: #999999; */
    font-size: 14px;
    display: block;
    margin-top: 5px;
}

blockquote cite:before {
    /* content: "\2014 \2009"; */
}