/*--
Author: W3layouts
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
--*/

@font-face {
    font-family: 'Myriad Pro';
    src: url('../fonts/MyriadPro-Regular.otf');
}

@font-face {
    font-family: 'Myriad Pro Light';
    src: url('../fonts/MyriadPro-Light.otf');
}


* {
    /*   outline: 1px solid red; */
}

.footer_ais a {
    cursor: pointer !important;
}

.pointer {
    cursor: pointer;
}

.colaborador_nombre {
    position: absolute;
    top: 315px;
    width: 100%;
    font-weight: 400;
}

.colaborador_cargo {
    top: 343px;
    line-height: 21px;
    font-weight: 100;
}


.colaborador_descripcion_movil {
    display: none;
}

@media screen and (max-width: 1278px) {
    .colaborador_descripcion_web {
        display: none;
    }

    .colaborador_descripcion_movil {
        display: block;
    }
}



/************************************************/
/*------- Estilos de página index.php--------- */
.view {
    float: none;
    position: relative;
    text-align: center;
    padding: 0em;
    background: #fff;
    height: 230px;
}

.mask-prin {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 32px;
}

.mask-prin img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
}

#alwa__popup {
    width: 4em;
    height: 7em;
    padding: 0%;
    right: 15px !important;
    bottom: 0em !important;
    border-radius: 0px;
    background: rgba(250, 250, 250, 0);
    position: fixed;
    overflow: none;
    border-width: 0px;
    clear: both;
    color: white !important;
    transition: all 5s ease-in-out;
    margin: 0% auto;
    z-index: 9999 !important;
}

.active_ais {
    color: #96C238 !important;
}

.most_herr {
    display: none !important;
}

.letra2_servi {
    font-size: 18px !important;
}

@media screen and (max-width: 700px) {
    #popupBody {
        top: 350px !important;
    }

    .letra1_servi {
        font-size: 18px !important;
    }

    .letra2_servi {
        font-size: 16px !important;
    }
}

.testi_pc {
    display: block;
}

.testi_ce {
    display: none;
}

@media screen and (max-width: 800px) {
    #popupBody {
        top: 350px !important;
    }

    .testi_pc {
        display: none;
    }

    .testi_ce {
        display: block;
    }

    #divvalores img {
        width: 50vw;
    }
}

@media screen and (max-width: 768px) {
    .carousel-control-next {
        display: none;
    }

    .carousel-control-prev {
        display: none;
    }
}


/************************************************/

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

.button-conocenos {
    border-radius: 212px !important;
    font-weight: 500 !important;
    padding: 8px 33px 8px 33px !important;
    font-size: 20px !important;
}

.empresas-mobile {
    display: none;
}

.hoja-testimonio {
    border-radius: 80px 80px 0px 80px;
    background-color: #96c238;
    color: white;
}

/* Estilos para pantallas reducidas */
@media (max-width: 1300px) {
    .flex-control-nav {
        bottom: -4vh;
    }

    .prev1 {
        display: none !important;
    }

    .next1 {
        display: none !important;
    }

    .slide_cifras {
        background-position: center center;
    }

    .button-conocenos {
        border-radius: 212px !important;
        font-weight: 500 !important;
        padding: 8px 33px 8px 33px !important;
        font-size: 14px !important;
    }

    .flexslider .slides img {
        width: 171px;
    }

    .empresas-mobile {
        display: block;
    }

    .empresas-desktop {
        display: none;
    }

}


@media screen and (min-width: 360px) {
    .panel_servicio_fotter {
        margin-top: 60px !important;
    }

}

.mask-letraconsult p {
    margin-top: 14px;
    color: white;
    font-size: 16px;
    font-family: 'Myriad Pro Light';
}


html {
    overflow: overlay;
}

html,
body {
    margin: 0;
    font-family: 'Myriad Pro', sans-serif;
    background: #fff;
}

.aling-items-center {
    display: flex;
    align-items: center;
}

.pointer {
    cursor: pointer;
}

body {
    margin: 0;
    font-family: "Myriad Pro", "Arial", Helvetica, sans-serif;
    font-size: 20px;
}

.img_servicio {
    margin-bottom: 12px;
    color: black;
}

.topnav {
    /* overflow: hidden; */
    background-color: #ffffff;
    width: 100%;
}


.topnav a {
    float: left;
    display: block;
    text-align: center;
    color: black;
    font-family: 'Myriad Pro Light';
    margin-top: 26px;
    padding: 0px 1.5vw;
    text-decoration: none;
    font-size: 16px;
    background-color: rgba(255, 255, 255, 1);
}

.topnav a:hover:not(:first-child) {
    color: #96C238;
    opacity: 0.8;
}

.active_ais {
    color: #96C238 !important;
}

.topnav .icon {
    display: none;
}

.green_dark_ais {
    background-color: #607C29 !important;
}

@media screen and (max-width: 700px) {
    .topnav a:first-child {
        height: 80px;
    }

    .topnav img {
        width: 150px;
        background-color: rgba(250, 250, 250, 0.0);
    }
}

@media screen and (max-width: 790px) {

    .hamburger_content {
        display: block !important;
    }

    .topnav {
        background-color: rgba(250, 250, 250, 0.5);
    }

    .topnav a:not(:first-child) {
        display: none;
        margin-top: 5px;
        background-color: rgba(250, 250, 250, 0.3);
    }

    .topnav a.icon {
        float: right;
        display: block;
        margin-top: 20px;
        background-color: rgba(250, 250, 250, 0.0);
    }

    .topnav a:first-child {
        height: 30px;
    }

    .topnav img {
        width: 150px;
        background-color: transparent;
    }
}

@media screen and (max-width: 1300px) {
    .topnav.responsive {
        position: relative;
    }

    .topnav.responsive .icon {
        position: absolute;
        right: 0;
        top: 0;
    }

    .topnav img {
        width: 150px;
    }
}

@media screen and (max-width: 790px) {
    .topnav.responsive a {
        float: none;
        display: block;
        font-size: 17px;
        font-weight: 500;
    }

    .topnav a {
        padding: 10px 1.5vw;
    }
}

.topnav.responsive {
    position: absolute;
}

/* Estilos para pantallas grandes */
@media (min-width: 790px) {
    .float-right_menu {
        float: right !important;
    }
}

/* Estilos para pantallas reducidas */
@media (max-width: 790px) {
    .text-left_menu {
        display: flex;
        flex-direction: column-reverse;
        margin-top: 10px;
    }
}

.logo_header {
    height: 60px !important;
    margin-top: 1.5px !important;
    /*padding-top: 5px !important;
    padding-right: 0px !important;*/
    padding-left: 20px !important;
    /*width: 323px !important;
    margin-left: -22px;
    background-color: transparent;*/
}

@media (max-width: 1300px) {
    .logo_header {
        margin-left: -22px;
        padding-left: 0px !important;
    }
}


.form-text-area {
    height: 170px;
    resize: none;
}

body a {
    text-decoration: none;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
}

a:hover {
    text-decoration: none;
}

input[type="button"],
input[type="submit"] {
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
}

.font-light {
    font-family: 'Myriad Pro Light', sans-serif !important;
}

.font-bold {
    font-family: 'Myriad Pro' !important;
}

.fw-500 {
    font-weight: 500;
}

.fw-600 {
    font-weight: 600;
}

.fw-700 {
    font-weight: 700;
}

.text-black {
    color: black !important;
}

p {
    margin: 0;
}

ul {
    margin: 0;
    padding: 0;
}

label {
    margin: 0;
}

.logo-empresa {
    width: 120px;
}

.letra1_servi {
    font-size: 20px !important;
}


.letra1_servi,
.letra2_servi {
    color: black !important;
}

/*-- Navbar --*/
.navbar {
    position: fixed;
    z-index: 99999;
    width: 100%;
    max-height: 10%;
    background-color: rgba(255, 255, 255, 0.19);
    border: 0px solid red;
    border-radius: 0;
    text-align: center;
    margin: 0;
    top: 1%;
}

.navbar-right {
    float: none !important;
}

.navbar-nav>li {
    float: none;
    margin: 0 0.3vw !important;
}

.navbar-nav {
    float: none;
}

/*-- Slider --*/

.logo {
    position: absolute;
    margin: auto 1px auto 1px;
    width: 187px;
    height: 68px;
    max-height: 68px;
    max-width: 187px;
}


.banner_conocenos {
    background: url(../images/im-nosotros.jpeg) 0px 0px;
    background-repeat: no-repeat;
}


.banner_conocenos-wrapper::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(rgba(0, 0, 0, 0) 0%,
            rgba(0, 0, 0, 0.37) 90%);
    z-index: 1;
    pointer-events: none;
}

.banner_text_conocenos {
    z-index: 2;
    position: relative;
}

.banner_servicios {
    background: url(../images/s-01.jpg) 0px 0px;
    background-repeat: no-repeat;
}

.banner_proyectos {
    background: url(../images/p-01.png) 0px 0px;
    background-repeat: no-repeat;
}


@media (max-width: 767.98px) {

    .banner_conocenos {
        background: url(../images/cn-01-2025.jpg) 0px 0px;
        background-repeat: no-repeat;
        background-position: center !important;
    }

    .banner_proyectos {
        background: url(../images/proyectos-mobil.jpg) 0px 0px;
        background-repeat: no-repeat;
    }
}


.slide_cifras {
    background: url(../images/cifras01.jpg)0px 0px;
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
}

.banner,
.banner_servicios,
.slide-2019-6,
.slide-2019-7 {
    background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    -moz-background-size: cover;
    /*   min-height: 460px; */
    height: 550px;
    width: 100vw;
    min-width: 200px;
    display: block;
    width: 100%;
    overflow: hidden;
    background-size: cover;
    background-position: center center;
}

.banner_conocenos {
    background-position: center calc(12% - -14px);
}

.banner_text {
    bottom: 37px;
    left: 46px;
    position: absolute;
}

.img-servicios {
    /*   width: 100px; */
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.letra-vermas-servicios {
    text-decoration: none;
    font-size: 14px;
}

.layer h3 {
    font-size: 3em;
    letter-spacing: 2px;
    font-weight: 500;
    padding-left: 13%;
}

.layer p1 {
    font-size: 1.5vw;
    font-weight: 300;
    color: #fff;
    letter-spacing: 1px;
    padding-left: 13%;
    font-weight: 600;
}

.color-letra-verde {
    color: #96c238 !important;
    font-size: 19px;
}

.modal-content img {
    width: 100%;
}

.modal-content h4 {
    color: #000;
    text-align: center;
    font-size: 35px;
    letter-spacing: 1px;
    margin-bottom: .5em;
    /*   text-transform: capitalize;*/
    font-family: 'Poiret One', cursive;
}

.modal-content h5 {
    color: #00affe;
    padding-top: 15px;
    line-height: 30px;
    font-size: 28px;
    letter-spacing: 0.8px;
    font-weight: 500;
}

.modal-content p {
    color: #636363;
    font-size: 15px;
    letter-spacing: 0.5px;
    line-height: 30px;
    padding-top: 5px;
}

.modal-header {
    padding: 30px;
}

.gallery,
.team,
.testimonials,
.sevices-w3layouts,
.about,
.footer {
    padding: 5em 0em;
}

.white-w3layouts {
    color: #fff !important;
}

.button-w3ls a {
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    letter-spacing: 2px;
    padding: 0.6em 2em;
    background: #fff;
    color: #000;
}

.know-more {
    background: #ffd11a !important;
    /* color del boton nosotros*/
    color: #fff !important;
    border-radius: 5px 5px 5px 5px !important;
    text-shadow: 1px 1px 1px rgba(100, 100, 100, 1);
    box-shadow: 2px 3px 2px rgba(158, 156, 156, 0.59);
}

.button-w3ls a:hover,
.know-more:hover {
    text-decoration: none !important;
    background: #55c6ff !important;
    color: #fff !important;
}

.view-tenth img {
    -moz-transform: scaleY(1);
    -o-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -moz-transition: all 0.7s ease-in-out;
    -o-transition: all 0.7s ease-in-out;
    -ms-transition: all 0.7s ease-in-out;
    width: 100%;
    border-radius: 5px;
    border: 0px solid #9a999e;
    display: block;
    position: relative;
}

.view-tenth .mask {
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    -ms-transition: all 0.5s linear;
    transition: all 0.5s linear;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0.05;
    border-radius: 5px 5px 5px 5px;
}

.view-tenth img {
    filter: alpha(opacity=1);
    opacity: 1;
}

.view-tenth:hover .mask {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
    background-color: #f0f0f0;
    border-radius: 30px;
    z-index: 3;
    vertical-align: middle;
}

.mask {
    padding-left: 10px;
    padding-right: 10px;
    height: 348px;
}

.mask img {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
    padding: 10px;
    top: -50px;
    border-radius: 100px;
    max-height: 150px;
    min-height: 150px;
    max-width: 150px;
    min-width: 150px;
    border: 0px;
}

.mask h1 {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
    padding: 10px;
    top: -10px;
    font-size: 20px;

}

.view-tenth:hover .mask img {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
    background-color: #f0f0f0;
    padding: 10px;
    border-radius: 100px;
    max-height: 150px;
    min-height: 150px;
    max-width: 150px;
    min-width: 150px;
    top: -66px;
    z-index: 9999;
    position: relative;
    vertical-align: middle;
}

.view-tenth:hover .mask .mask-letra {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=1);
    opacity: 1;
    padding-top: 65px;
    margin-top: -130px;
    overflow: hidden;
}

.mask-letra {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
    padding-top: 65px;
    margin-top: -130px;
    height: 300px;
    overflow: hidden;
}

.mask-letra {
    height: 250px;
}

.view-tenth:hover img,
.view-tenth:hover span {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=10)";
    filter: alpha(opacity=1);
    opacity: 0.01;
}

.view {
    float: none;
    position: relative;
    text-align: center;
    padding: 0em;
    background: #fff;
    min-height: 350px;
    height: 350px;
}

.view-letra {
    float: none;
    position: relative;
    text-align: center;
    padding: 2px 2px 2px 2px;
    background: rgba(250, 250, 250, 0);
    border-radius: 0px;
    min-height: 30px;
    height: 30px;
}

.view .mask,
.view .content {
    position: absolute;
    top: 0;
    left: 0;
}

.view img {
    display: block;
    position: relative;
    background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    -moz-background-size: cover;
    background-position: center center;
}

.agile_text_box p,
.team-left-wthree p {
    line-height: 1.8em;
    width: 95%;
    margin: 0 auto 0.5em;
    font-size: 15px;
    letter-spacing: 0.5px;
    color: #111;
    box-shadow: 1px 1px 1px, #63b32e;
}

.team-left-wthree p1 {
    line-height: 1.8em;
    width: 89%;
    margin: 0 auto 2em;
    font-size: 15px;
    letter-spacing: 0.5px;
    color: #e6e6e6;
}


.agile_text_box h3 {
    line-height: 1.5em;
    margin: 0.5em 0 0em;
    font-weight: 500;
    font-size: 1.7em;
    letter-spacing: 1px;
    color: #607c29;
}


.c2 {
    background: #55c6ff;
    /* Old browsers */
    background: -moz-linear-gradient(45deg, #55c6ff 2%, #80d4ff 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(45deg, #55c6ff 2%, #80d4ff 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(45deg, #55c6ff 2%, #80d4ff 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#55c6ff', endColorstr='#80d4ff', GradientType=1);
    /* IE6-9 fallback on horizontal gradient */
}

.center-block {
    display: block;
    margin-right: auto;
    margin-left: auto
}


.client h5 {
    font-size: 22px;
    color: #ffffff;
    float: left;
    letter-spacing: 2px;
    margin-top: 1.7em;
    text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.59);
    font-weight: 400;
}

.client h3 {
    font-size: 25px;
    color: #ffffff;
    float: left;
    letter-spacing: 2px;
    margin-top: 1.7em;
    text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.59);
    font-weight: 400;
}

.client {
    margin-top: 2em;
}

.test-w3 {
    color: transparent !important;
    text-align: center;
    align-items: center;
}

.test-w3 h2 {
    font-size: 20px;
    color: #ffffff;
    letter-spacing: 2px;
    margin-top: 1.7em;
    text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.59);
    font-weight: 400;
}

.test-w3 h3 {
    font-size: 22px;
    color: #ffffff;
    letter-spacing: 2px;
    margin-top: 0.2em;
    text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.59);
    font-weight: 400;
}

.input-w3ls {
    width: 49%;
    float: left;
}

.input-w3ls:nth-child(1) {
    margin-right: 10px;
}

input[type="text"]:focus,
input[type="email"]:focus {
    outline: none;
}

textarea:focus {
    outline: none;
}

.footer {
    padding-top: 15em !important;
}

.footer h4 {
    margin: 0 0 .5em;
}

.footer h3 {
    color: #55c6ff;
    font-size: 2em;
    letter-spacing: 1px;
    margin: 0em 0 .5em;
    /*  text-transform: capitalize;*/
}


@media(max-width:991px) {

    .flex-active-slide p {
        margin-top: 2em;
    }

    .flex-direction-nav a {
        top: 9%;
    }

    .flex-active-slide p:before {
        width: 30em;
        top: -33%;
    }

    li.flex-active-slide p:after {
        top: -53%;
        left: 61%;
    }

    .client {
        margin-top: 1.3em;
    }

    .w3_agile_gallery_grid {
        float: left;
        width: 33.33%;
    }


    .footer h3 {
        font-size: 1.6em;
    }
}

@media(max-width:900px) {
    .footer {
        padding-top: 20em !important;
    }
}




@media(max-width:667px) {
    .layer h3 {
        font-size: 2em;
    }
}


/************************************************/
/*-------------------Hamburger---------------- */
.hamburger_content {
    display: none;
}

.hamburger_main__label {
    display: flex;
    height: 1.75rem;
    width: 1.75rem;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 10px;
    top: 22px;
    z-index: 200;
}

.hamburger_main__checkbox:checked~label span {
    background-color: transparent;
}

.hamburger_main__span {
    position: relative;
    display: block;
    width: 2.75rem;
    cursor: pointer;
    --tw-bg-opacity: 1;
    background-color: black;
    border-radius: 172px;
    height: 3px;
}

.hamburger_main__checkbox:checked~label span:after,
.hamburger_main__checkbox:checked~label span:before {
    top: 0px;
}

.hamburger_main__checkbox:checked~label span:after,
.hamburger_main__checkbox:checked~label span:before {
    top: 0px;
}

.hamburger_main__checkbox:checked~label span:after {
    --tw-rotate: 45deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.hamburger_main__checkbox:checked~label span:before {
    --tw-rotate: -45deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.hamburger_main__span:before {
    position: absolute;
    top: 0.5rem;
    display: block;
    height: 100%;
    width: 100%;
    --tw-bg-opacity: 1;
    background-color: black;
    border-radius: 172px;
    content: "";
    transition: all .2s ease-in-out;
}

.hamburger_main__span:after {
    position: absolute;
    top: -0.5rem;
    display: block;
    height: 100%;
    width: 100%;
    --tw-bg-opacity: 1;
    background-color: black;
    border-radius: 172px;
    content: "";
    transition: all .2s ease-in-out;
}

.header_main__nav {
    position: fixed;
    left: 0px;
    right: 0px;
    bottom: 0px;
    top: 4rem;
    z-index: 10;
    display: none;
    width: 100vw;
    --tw-bg-opacity: 1;
    background-color: rgb(0 47 161 / var(--tw-bg-opacity));
}

*,
::before,
::after {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
}

::before,
::after {
    --tw-content: '';
}


/************************************************/

.killa-button {

    padding: 0px 0.5vw !important;
}

/* Contenedor del tooltip */
.tooltip-killa {
    position: relative;
    display: inline-block;
    height: 50px;
    /* mismo alto que la imagen */
}

/* Imagen de Killa */
.killa-img {
    height: 50px;
    width: 50px !important;
    cursor: pointer;
    position: relative;
}

/* Solo escritorio y tablet */
@media (min-width: 768px) {
    .killa-img {
        top: -11px;
    }
}

/* Texto del tooltip */
.tooltip-killa .tooltiptext {
    visibility: hidden;
    width: 148px;
    background-color: rgba(0, 0, 0, 0.95);
    /* 🔹 casi negro sólido */
    color: #fff;
    /* texto blanco */
    text-align: center;
    border-radius: 10px;
    padding: 6px 8px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    /* borde un poco más visible */
    position: absolute;
    z-index: 99999;
    top: 84%;
    left: 89%;
    transform: translateX(-50%);
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.35);
    /* sombra más marcada */
    font-weight: 500;
    font-size: 14px;
    transition: opacity 0.2s ease-in-out;
    opacity: 0;
}

/* Flecha apuntando hacia arriba */
.tooltip-killa .tooltiptext::after {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 20%;
    margin-left: -5px;
    border-width: 8px;
    border-style: solid;
    border-color: transparent transparent rgba(0, 0, 0, 0.95) transparent;
    /* 🔹 flecha casi sólida */
}

/* Mostrar tooltip con transición */
.tooltip-killa:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}

/* ANIVERSARIO - Cierre rápido */
@keyframes fadeOutScale {
    from {
        opacity: 1;
        transform: scale(1);
    }

    to {
        opacity: 0;
        transform: scale(0.95);
    }
}

/* KILLA - Cierre rápido */
@keyframes killaFadeOutScale {
    from {
        opacity: 1;
        transform: scale(1);
    }

    to {
        opacity: 0;
        transform: scale(0.95);
    }
}