.btn-inicio{
    height: clamp(2.25rem, 2.0643rem + 0.7619vw, 2.75rem);
    background-color: #111842;
    border-radius: 24px;
    border: 1px solid #8E47FE;
    color: #FFFFFF;
    font-size: clamp(0.625rem, 0.5321rem + 0.381vw, 0.875rem);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: 600;
}

.btn-inicio2{
    height: clamp(2.25rem, 2.0643rem + 0.7619vw, 2.75rem);
    background-color: #FFFFFF;
    border-radius: 24px;
    border: 1px solid #8E47FE;
    color: #5858EE;
    font-size: clamp(0.625rem, 0.5321rem + 0.381vw, 0.875rem);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: 600;
    gap: 10px;
}

.btn-inicio21{
    height: clamp(2.25rem, 2.0643rem + 0.7619vw, 2.75rem);
    background-color: #FFFFFF;
    border-radius: 24px;
    border: 1px solid #8E47FE;
    color: #5858EE;
    font-size: clamp(0.625rem, 0.5321rem + 0.381vw, 0.875rem);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: 600;
    gap: 10px;
    margin-left: 10px !important;
}

.btn-inicio22{
    height: clamp(2.25rem, 2.0643rem + 0.7619vw, 2.75rem);
    background-color: #5858EE;
    border-radius: 24px;
    border: 1px solid #5858EE;
    color: white;
    font-size: clamp(0.625rem, 0.5321rem + 0.381vw, 0.875rem);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: 600;
    gap: 10px;
}

.btn-inicio:hover{
    background-color: #FFFFFF;
    border: 1px solid #8E47FE;
    color: #8E47FE;
}

.nav-link:hover,
.nav-link.active:hover {
    color: #8E47FE !important;
}

.navbar-nav .nav-link.active:hover::after,
.navbar-nav .nav-link:hover::after {
    background-color: #8E47FE !important;
}

.navInicio {
    background-color: transparent !important;
    transition: background-color 0.5s ease, color 0.5s ease;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
}

.navInicio.color-inicio {
    background-color: rgba(4, 10, 23, 0.3) !important;
}


.navInicio.color-beneficios {
    background-color: #161B22 !important; /* Ejemplo de color para la sección de beneficios */
}

.navInicio.color-caracteristicas {
    background-color: #0D1117 !important; /* Ejemplo de color para la sección de características */
}

.navInicio.color-testimonios {
    background-color: #0D1117 !important; /* Ejemplo de color para la sección de características */
}

.navInicio.color-planes {
    background-color: #0D1117 !important; /* Ejemplo de color para la sección de características */
}

.navInicio.color-contacto {
    background-color: #141920 !important; /* Ejemplo de color para la sección de características */
}

.navInicio.color-preguntas {
    background-color: #141920 !important; /* Ejemplo de color para la sección de características */
}

.navInicio.color-shows {
    background-color: #0D1117 !important; /* Ejemplo de color para la sección de características */
}

body {
    color: #FFFFFF;
    height: 100%;
    width: 100%;
}

.blancoFont {
    color: #FFFFFF !important;
}

.dropdown-item.blancoFont:hover {
    background-color: #50575e; /* Fondo al pasar el ratón para una mejor experiencia de usuario */
    color: white !important;
}

.navbar-nav .nav-link {
    padding: 0 10px; /* Ajuste del espaciado horizontal entre los enlaces */
}

/* Estilo para el enlace activo con una línea debajo */
.navbar-nav .nav-link.active {
    position: relative;
}

.navbar-nav .nav-link.active::after {
    content: "";
    position: absolute;
    bottom: -5px; /* Ajusta la distancia desde el texto hasta la línea */
    left: 25%; /* Centrar la línea al reducir su ancho */
    width: 50%; /* Ajusta el ancho de la línea para que sea menos ancha */
    height: 2px; /* Grosor de la línea */
    background-color: white; /* Color de la línea */
}

.nav_elements {
    justify-content: start !important;
    font-size: clamp(1rem, 0.9071rem + 0.381vw, 1.25rem);
}

.dropdown-menu {
    background-color: #161B22 !important;
}

/* Estilos para el elemento de alerta */
.alertHotmentor {
    width: 100% !important;
    border-radius: 0 !important;
    background-color: #30363D !important;
    font-size: clamp(13.23px, 1vw + 12px, 13.56px);
}

.alertHotmentor .toast-body {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.alertHotmentor .toast-body a {
    margin-left: 5px;
    color: white; /* Cambiar el color del texto del enlace a blanco */
    text-decoration: underline; /* Opción para que se vea como un enlace */
}

@media (max-width: 992px) {
    .nav_elements {
        justify-content: space-between !important;
    }
}

/* Media query para pantallas de ancho máximo 390px */
@media (max-width: 390px) {
    .alertHotmentor .toast-body a {
        flex-basis: 100%;
        margin-left: 0;
        text-align: center;
    }
}

.pt-5-v2{
    padding-top: 7rem !important;
}

.pb-6{
    padding-bottom: 6rem !important;
}

@media (min-width: 992px) {
    .pt-lg-5-v2{
        padding-top: 13rem !important;
    }

    .pt-lg-5-v3{
        padding-top: 10rem !important;
    }

    .pt-lg-5-v4{
        padding-top: 7rem !important;
    }

    .pt-lg-5-v5{
        padding-top: 5rem !important;
    }

    .pb-lg-5-v2{
        padding-bottom: 13rem !important;
    }

    .pb-lg-6{
        padding-bottom: 6rem !important;
    }
}

.px-1-5{
    padding-inline: 1.5rem !important;
}

@media (min-width: 576px) and (max-width: 767.98px) {
    .px-sm-5-v2 {
        padding-right: 3rem !important;
        padding-left: 3rem !important;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .px-md-5-v2 {
        padding-right: 5rem !important;
        padding-left: 5rem !important;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .px-lg-5-v2 {
        padding-inline: 8rem !important;
    }
}

@media (min-width: 1200px) and (max-width: 1399.98px){
    .px-xl-5-v2 {
        padding-inline: 10rem !important;
    }
}

@media (min-width: 1400px)  and (max-width: 2099.98px){
    .px-xxl-5-v2 {
        padding-inline: 13rem !important;
    }
}

@media (min-width: 2100px) and (max-width: 2499.98px){
    .px-xxxl-5-v2 {
        padding-inline: 16rem !important;
    }
}

@media (min-width: 2500px){
    .px-xxxxl-5-v2 {
        padding-inline: 20rem !important;
    }
}

.text12{
    font-size: clamp(0.5rem, 0.4071rem + 0.381vw, 0.75rem);
}

.text12-v2{
    font-size: 12px;
}

.text16{
    font-size: clamp(0.75rem, 0.6571rem + 0.381vw, 1rem);
}

.text16-v2{
    font-size: 16px;
}

.text16-v3{
    font-size: clamp(0.875rem, 0.8286rem + 0.1905vw, 1rem);
}

.text18{
    font-size: 18px;
}

.text18-v2{
    font-size: clamp(0.75rem, 0.6107rem + 0.5714vw, 1.125rem);
}

.text18-v3{
    font-size: clamp(0.875rem, 0.7821rem + 0.381vw, 1.125rem);
}

.text96{
    font-size: clamp(2.5rem, 1.2rem + 5.3333vw, 6rem);
}

.text65{
    font-size: clamp(2.5rem, 1.9196rem + 2.381vw, 4.0625rem);
}

.text56{
    font-size: 56px;
}

.text48{
    font-size: clamp(1.75rem, 1.2857rem + 1.9048vw, 3rem);
}

.text40{
    font-size: clamp(1.5rem, 1.1286rem + 1.5238vw, 2.5rem);
}

.text40-24{
    font-size: clamp(1.5rem, 1.1286rem + 1.5238vw, 2.5rem) !important;
}

.text38{
    font-size: clamp(1.5rem, 1.175rem + 1.3333vw, 2.375rem);
}

.text36{
    font-size: clamp(1rem, 0.5357rem + 1.9048vw, 2.25rem);
}

.text36-v2{
    font-size: clamp(1.5rem, 1.2214rem + 1.1429vw, 2.25rem);
}

.text32{
    font-size: clamp(1.375rem, 1.1429rem + 0.9524vw, 2rem);
}

.text32-v2{
    font-size: clamp(1.125rem, 0.8rem + 1.3333vw, 2rem);
}

.text32-v3{
    font-size: clamp(1.375rem, 1.1429rem + 0.9524vw, 2rem);
}

.text32-v4{
    font-size: 32px;
}

.text28{
    font-size: clamp(1.5rem, 1.4071rem + 0.381vw, 1.75rem);
}

.text28-v2{
    font-size: clamp(0.75rem, 0.3786rem + 1.5238vw, 1.75rem);
}

.text24{
    font-size: 24px;
}

.text24clamp{
    font-size: clamp(1.125rem, 0.9857rem + 0.5714vw, 1.5rem);
}

.text24-v2{
    font-size: clamp(0.875rem, 0.6429rem + 0.9524vw, 1.5rem);
}

.text24-v3{
    font-size: clamp(1rem, 0.8143rem + 0.7619vw, 1.5rem);
}

.text22{
    font-size: clamp(1.125rem, 1.0321rem + 0.381vw, 1.375rem);
}

.text20{
    font-size: clamp(1.125rem, 1.0786rem + 0.1905vw, 1.25rem);
}

.text20-v2{
    font-size: clamp(0.875rem, 0.7357rem + 0.5714vw, 1.25rem);
}

.text20-v3{
    font-size: clamp(1rem, 0.9071rem + 0.381vw, 1.25rem);
}

.text18-12{
    font-size: clamp(0.75rem, 0.6107rem + 0.5714vw, 1.125rem);
}

.text14{
    font-size: 14px;
}

.text12-v2{
    font-size: clamp(0.625rem, 0.5321rem + 0.381vw, 0.875rem);
}

.text12{
    font-size: clamp(0.5rem, 0.4071rem + 0.381vw, 0.75rem);
}

.text11-4{
    font-size: 11.4px;
}

.line96 {
    line-height: clamp(44px, 4vw, 96px);
    letter-spacing: clamp(-1.2px, -0.1vw, -2.88px);
}

.line57-6 {
    line-height: clamp(33.6px, 4vw, 57.6px);
    letter-spacing: clamp(-0.56px, -0.1vw, -1.44px);
}

.line48 {
    line-height: clamp(28.8px, 4vw, 48px);
    letter-spacing: clamp(-0.48px, -0.1vw, -0.8px);
}

.line38-4{
    line-height: clamp(1.7875rem, 1.56rem + 0.9333vw, 2.4rem);
    letter-spacing: clamp(-0.01375rem, -0.0114rem + -0.0095vw, -0.02rem);
}

.line31-2 {
    line-height: 31.2px;
}

.line31-2-v2 {
    line-height: clamp(1.5rem, 1.3329rem + 0.6857vw, 1.95rem);
}

.line24{
    line-height: 24px;
}

.line12{
    line-height: 12px;
}

.weight-700{
    font-weight: 700;
}

/*cargando*/

#container3dmodel{
    width: 200px;
    height: 200px;
    position: fixed;
    z-index: 999999;
    margin-top: 0px;
}

.boxLoading {
    position: fixed; /* Fija el contenedor en toda la pantalla */
    top: 0;
    left: 0;
    height: 100vh; /* Asegura que ocupe todo el viewport */
    width: 100vw;
    z-index: 9999; /* Asegura que esté sobre todo el contenido */
    background-color: rgba(0, 0, 0, 0.8); /* Fondo semitransparente opcional */
    display: flex;
    justify-content: center;
    align-items: center;
    transition: opacity 0.5s ease-in-out; /* Transición suave */
}

.boxLoading.hidden {
    opacity: 0;
    pointer-events: none; /* Evita interacciones */
}

#mainContent {
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}

#mainContent[style="visibility: visible;"] {
    opacity: 1;
}

#divChatBot {
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}

#divChatBot[style="visibility: visible;"] {
    opacity: 1;
}

.loading{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ring{
    width: 200px;
    height: 200px;
    border: 0px solid #011015;
    border-radius: 50%;
    position: absolute;
}

.ring:nth-child(1){
    border-bottom-width: 8px;
    border-color: #5858ED;
    animation: rotate1 2s linear infinite;
}

.ring:nth-child(2){
    border-right-width: 8px;
    border-color: #5858ED;
    animation: rotate2 2s linear infinite;
}

.ring:nth-child(3){
    border-top-width: 8px;
    border-color: #5858ED;
    animation: rotate3 2s linear infinite;
}

.loadingText{
    color: white;
    margin-top: 80px;
}

@keyframes rotate1{
    0%{
        transform: rotatex(35deg) rotateY(-45deg) rotateZ(0deg);
    }
    100%{
        transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
    }
}

@keyframes rotate2{
    0%{
        transform: rotatex(50deg) rotateY(10deg) rotateZ(0deg);
    }
    100%{
        transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
    }
}

@keyframes rotate3{
    0%{
        transform: rotatex(35deg) rotateY(55deg) rotateZ(0deg);
    }
    100%{
        transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
    }
}

.flex{
    display: flex;
}

/* Small (SM) >= 576px */
@media (min-width: 576px) {
    .w-sm-25 {
        width: 25% !important;
    }
    .w-sm-50 {
        width: 50% !important;
    }
    .w-sm-75 {
        width: 75% !important;
    }
    .w-sm-100 {
        width: 100% !important;
    }
}

/* Medium (MD) >= 768px */
@media (min-width: 768px) {
    .w-md-25 {
        width: 25% !important;
    }
    .w-md-50 {
        width: 50% !important;
    }
    .w-md-75 {
        width: 75% !important;
    }
    .w-md-100 {
        width: 100% !important;
    }
}

/* Large (LG) >= 992px */
@media (min-width: 992px) {
    .w-lg-25 {
        width: 25% !important;
    }
    .w-lg-50 {
        width: 50% !important;
    }
    .w-lg-75 {
        width: 75% !important;
    }
    .w-lg-100 {
        width: 100% !important;
    }
}

/* Extra Large (XL) >= 1200px */
@media (min-width: 1200px) {
    .w-xl-25 {
        width: 25% !important;
    }
    .w-xl-50 {
        width: 50% !important;
    }
    .w-xl-75 {
        width: 75% !important;
    }
    .w-xl-100 {
        width: 100% !important;
    }
}

/* Extra Extra Large (XXL) >= 1400px (Bootstrap 5 en adelante) */
@media (min-width: 1400px) {
    .w-xxl-25 {
        width: 25% !important;
    }
    .w-xxl-50 {
        width: 50% !important;
    }
    .w-xxl-75 {
        width: 75% !important;
    }
    .w-xxl-100 {
        width: 100% !important;
    }
}

.cursor-pointer{
    cursor: pointer;
}