/*cambios christian Barra*/
:root {
    /* Estilos generales para la barra deslizadora */
    --scrollbar-width: 11px;
    --scrollbar-track-color:none;
    --scrollbar-thumb-color: #ABC775;
    --scrollbar-thumb-hover-color: #8AA95A; /* Un tono más oscuro para hover */
    --scrollbar-thumb-border-radius: 15px; /* Redondear los bordes */
}

/* WebKit (Chrome, Safari y otros navegadores basados en WebKit) */
::-webkit-scrollbar {
    width: var(--scrollbar-width); /* Ancho de la barra de desplazamiento */
    height: var(--scrollbar-width); /* Si aplicas también a barras horizontales */
}
::-webkit-scrollbar-corner {
    background-color: transparent; /* Evitar posibles renders en las esquinas */
}

/* Track de la barra de desplazamiento */
::-webkit-scrollbar-track {
    background: transparent; /* Track transparente */
}

/* Thumb de la barra de desplazamiento */
::-webkit-scrollbar-thumb {
    background: var(--scrollbar-thumb-color); /* Color de la barra de desplazamiento */
    border-radius: var(--scrollbar-thumb-border-radius); /* Bordes redondeados */
    border: 1px solid #f1f1f1; /* Bordes más gruesos y definidos */
    transition: background 0.3s ease; /* Suavidad en hover */
}

::-webkit-scrollbar-button {
    display: none;
    color:transparent;/* Ocultar las flechas en Chrome y otros navegadores basados en WebKit */
}

/* Para Edge (también basado en Chromium) */
::-webkit-scrollbar {
    -ms-overflow-style: none; /* Ocultar flechas de desplazamiento en Edge */
}
/* WebKit (Chrome, Safari y otros navegadores basados en WebKit) */
::-webkit-scrollbar-button {
    display: none; /* Ocultar las flechas arriba/abajo */
}


/* Cambia el color cuando el usuario pasa el mouse por encima */
::-webkit-scrollbar-thumb:hover {
    background: var(--scrollbar-thumb-hover-color); /* Color en hover */
}

/* Firefox */
* {
    scrollbar-width:initial; /* Definir como 'thin' para una barra más delgada */
    scrollbar-color: var(--scrollbar-thumb-color) var(--scrollbar-track-color);
}

/* Ocultar las barras deslizadoras en dispositivos móviles */
body {
    -ms-overflow-style: none; /* Internet Explorer 10+ */
    scrollbar-width: none; /* Firefox */
}

    body::-webkit-scrollbar {
        display: none; /* Safari y Chrome */
    }



/*Cambios christian*/


:root {
    --gris-textos: #848484;
    --color-encabezados: #ABC775;
    --verde-1: #CDDBA7;
    --verde-2: #E5EECE;
    --textos-oscuros: #242424;
    --texto-botones: #FFFFFF;
    --gris-inputs: #ACACAC;
    --color-fondo: #F3F9EF;
    --color-rojo: #D47777;
    --height-menu: 120px;
}

h1 {
    color: #A1C072;
    font-weight: 700;
    font-size: 3.5rem;
}

body {
    font-family: 'Montserrat alternates', sans-serif;
    overflow-x: hidden;
}

#navPrincipal {
    height: var(--height-menu);
}

.bg-gradiente-verde {
    background: linear-gradient(to bottom, rgba(180,207,124,1) 0%, rgba(242,244,234,1) 90%, rgba(255,255,255,1) 100%);
}

#seccionPrincipal {
    min-height: 100vh;
    color: white;
}

#contenidoSeccionPrincipal {
    min-height: calc(100% - var(--height-menu));
}
/*
#seccionProblemas {
    height: 100vh;
}
*/
#seccionIntroducirProductos {
    height: 370px;
    background: #D2E0B3;
}

@keyframes scale-contacto {
    0%, 100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.2);
    }
}

.btn-contacto {
    position: fixed;
    bottom: 30px;
    right: 35px;
    width: 80px;
    height: 80px;
    background-color: #ABC775;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
    font-size: 28px;
    text-decoration: none;
    z-index: 1000;
    transition: background-color 0.3s, transform 0.5s;
    animation: scale-contacto 2s infinite ease-in-out;
}

    .btn-contacto:hover {
        transform: scale(1.2);
        color: white;
        transition: all 0.5s;
        animation: none;
    }

    .btn-contacto i {
        font-size: 2.7rem;
    }

    /* Ocultar el icono del sobre abierto por defecto */
    .btn-contacto .fa-envelope-open {
        display: none;
    }

    /* Mostrar el sobre abierto en hover */
    .btn-contacto:hover .fa-envelope {
        display: none;
    }

    .btn-contacto:hover .fa-envelope-open {
        display: inline;
    }

.overflow-y-visible{
    overflow-y: visible !important;
}

.opcion-demo > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    /*transition: all 0.5s;*/
    filter: brightness(0.9) grayscale(0.5);
    z-index: 1;
    box-shadow: 2px 3px 5px 0px rgba(0,0,0,0.75);
}
/*
.opcion-demo:hover {
    cursor: pointer;
}

    .opcion-demo:hover > img {
        filter: none;
        transform: scale(1.01);
        z-index: 2;
    }
*/
.opcion-demo > .text-demo {
    position: absolute;
    top: 80%;
    left: 50%;
    transform: translateX(-50%);
    color: white;
    font-weight: 600;
    font-size: 1.5rem;
    font-family: 'Montserrat alternates', sans-serif;
    text-shadow: 2px 2px 6px rgba(0,0,0,0.4);
}

.opcion-demo > .text-demo:hover{
    transform: translateX(-50%) scale(1.1);
}

#icono-pidefacil {
    max-width: 80px;
}

.fw-500 {
    font-weight: 500;
}

.fw-600 {
    font-weight: 600;
}

.fw-700 {
    font-weight: 700;
}

.fw-800 {
    font-weight: 800;
}

.icono-small {
    max-width: 90px;
}

.img-portada {
    position: absolute;
    top: 0;
    right: 0;
    height: 95%;
    max-width: 95%;
    object-fit: contain;
}

.rounded-2 {
    border-radius: .25rem;
}

.letra-contador {
    color: #ABC775;
    font-size: 36px;
}

.sub-letra-contador {
    font-size: 20px;
}

.titulo-home {
    font-size: 2rem;
}

.subtitulo-home {
    font-weight: 500;
}

.texto-grande {
    font-size: 1.5rem;
}

.texto-medio {
    font-size: 1.1rem;
}

.btn_enviar, .btn_enviar2 {
    margin-top: 20px;
    margin-bottom: 10px;
    background-color: #ABC775;
    color: white;
    border: none;
    padding: 4px 15px;
    text-align: center;
    margin: 4px 2px;
    border-radius: 5px;
    transition: all 0.3s ease;
    box-shadow: 1px 1px 8px -3px rgba(0, 0, 0, 0.5);
}

.btn_enviar {
    font-size: 0.9rem;
}
.btn_enviar2 {
    font-size: 1.2rem;

}

    .btn_enviar:hover, .btn_enviar2:hover {
        transform: scale(1.1);
    }

.dibujito {
    max-width: 62px;
}

.text-gris {
    color: #999999;
}

.z-index-0 {
    z-index: 0;
}

.z-index-1 {
    z-index: 1;
}

.mw-lg-450-600 {
    max-width: 600px;
    min-width: 450px;
}

.img-portada-2 {
    display: none;
}

#chico-mareado {
    max-width: 110px;
    height: auto;
    margin-left: -10px;
}

#chico-mareado-2 {
    max-width: 120px;
    height: auto;
    display: none;
}

.color-encabezado {
    color: var(--color-encabezados);
}

.bg-fondo-verde {
    background-color: var(--color-fondo);
}

.fs-07 {
    font-size: 0.7rem;
}

/*
    Politicas
*/
.politica-header {
    background-color: #A1C072;
    color: white;
    padding: 40px 20px;
    text-align: center;
}
.politica-header h1 {
    margin: 0;
    font-size: 2.5rem;
}
.politica-container {
    margin: 40px auto;
    max-width: 800px;
}
.politica-card {
    background-color: white;
    border: 1px solid #e3e3e3;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
.politica-card h2 {
    font-size: 1.8rem;
    margin-bottom: 20px;
    color: #A1C072;
}
.politica-card ul {
    list-style: none;
    padding-left: 0;
}
.politica-card ul li {
    padding: 10px 0;
    font-size: 1.1rem;
}
.politica-card ul li i {
    color: #A1C072;
    margin-right: 10px;
}
.politica-tag {
    font-size: 1.3rem;
    color: #A1C072;
}

.footer-note {
    font-size: 0.9rem;
    color: #6c757d;
    margin-top: 20px;
}
/* 
    FIN POLITICAS
*/

.h-fit-content{
    height: fit-content;
}

.splide {
    height: fit-content;
    padding: 0 60px;
}

.splide__list{
    padding-top: 5px !important;
}

.splide__arrow {
    width: 40px;
    height: 40px;
}
.splide__slide{
    min-height: 240px;
}

.splide__slide h5 {
    font-size: 1rem;
}
.splide__slide .card-body{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.splide__slide .card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.splide__slide .card:hover {
    transform: translateY(-5px);
}

.fs-15px {
    font-size: 15px;
}

.text-verde {
    color: #ABC775 !important;
}

.h-50px-md-40px{
    height: 50px;
}

.icon-footer{
    width: 40px;
    height: 40px;
}

.w-lg-auto-100 {
    width: auto;
}

.text-justify{
    text-align: justify;
}

/* LG */
@media (max-width: 991.98px) {
    /*#seccionProblemas {
        height: auto;
    }
*/
    .img-portada {
        display: none;
    }

    .img-portada-2 {
        display: block;
        position: absolute;
        right: 0;
        top: 0;
        opacity: 0.8;
    }

    .icono-small, #chico-mareado {
        display: none;
    }

    #chico-mareado-2 {
        display: block;
    }

    .mw-lg-450-600 {
        max-width: unset;
        min-width: unset;
    }

    .subtitulo-home {
        text-shadow: 0px 2px 2px #A3BD72;
    }

    .texto-grande {
        font-size: 1rem;
    }

    .texto-medio {
        font-size: 0.8rem;
    }

    .letra-contador {
        font-size: 30px;
    }

    .sub-letra-contador {
        font-size: 16px;
    }

    .btn_enviar, .btn_enviar2 {
        margin-bottom: 5px;
    }
    .btn_enviar {
        font-size: 0.9rem;
    }
    .btn_enviar2 {
        font-size: 1.2rem;
    }


    .w-lg-auto-100 {
        width: 100%;
    }
}


/* XXL */
@media (max-width: 1399.98px) {
    .img-portada{
        height: 65%;
    }
}

/* XL */
@media (max-width: 1199.98px) {

    .titulo-home {
        font-size: 30px;
    }

    .icon-footer{
        width: 35px;
        height: 35px;
    }


    footer #icono-pidefacil{
        max-width: 65px;
    }

    footer #titulo-pidefacil {
        font-size: 2rem;
        text-align: start;
    }

    footer #subtitulo-pidefacil {
        font-size: 0.8rem;
        white-space: nowrap;
    }
}

/* MD */
@media (max-width: 767.98px) {
    #icono-pidefacil {
        max-width: 60px;
    }

    .h-50px-md-40px{
        height: 40px;
    }

    .splide{
        padding: 0px 18px;
    }

    .splide__arrow--prev {
        left: 0px !important;
        transform: scale(0.7) translateX(-20px) translateY(-50%) !important;
    }

    .splide__arrow--next {
        right: 0px !important;
        transform: scale(0.7) translateX(20px) translateY(-50%) !important;
    }

    footer {
        font-size: 0.9rem;
        margin: 0px;
    }

    #titulo-pidefacil {
        font-size: 1.8rem
    }

    #subtitulo-pidefacil {
        font-size: 0.8rem
    }

    #caja-preguntas {
        max-width: calc(100vw - 100px);
    }
    
    .titulo-home {
        font-size: 1.2rem;
        margin-top: -2px !important;
        
    }

    h2 {
        font-size: 1.25rem;
    }

    h1 {
        font-size: 2rem
    }

    .btn_enviar2{
        font-size: 1rem;
    }
}


/* SM */
@media (max-width: 575.98px) {
}

@media (min-width: 1920px) {

    .texto-grande {
        font-size: 24px;
    }
    .texto-medio{
        font-size:18px;
    }
    
}