:root {
    --green: #ADE800;
    --purple: #890df7;
    --white: #fff;
    --black: #222;
}

.header-sectionv2 {
    background-color: var(--green);
}

.header-section .brand-logo {
    max-width: 250px;
    width: 300px;
}

.btnConvierte {
    padding: 15px 30px !important;
    background-color: transparent;
    color: var(--purple) !important;
    border: 3px solid var(--green) !important;
    text-transform: none;
}

.contentBtnConvierte {
    margin-top: 120px;
}

.btnConvierte:hover {
    padding: 15px 30px !important;
    background-color: transparent;
    color: var(--purple) !important;
    border: 3px solid var(--purple) !important;
    text-transform: none;
}

.btnTitleAcordeon {
    padding: 13px 50px 10px 50px;
    line-height: 0;
    color: var(--purple) !important;
    font-size: 22px;
    font-weight: 600;
}

.accordion-button:not(.collapsed)::after,
.accordion-button::after {
    display: none;
}

.accordion-body {
    margin: 30px 20px;
}

.accordion-body span {
    color: var(--black);
    margin-top: 18px !important;
}

.contentTextAcordeon {
    padding: 0px 80px 0px 0px;
}

.contentTextAcordeon ul {
    margin-top: 20px;
}

.contentImageAcordeon img {
    border-radius: 20px;
    position: relative;
    z-index: 99;
}

.accordion-button {
    background-color: var(--white) !important;
}

.accordion-button:focus {
    box-shadow: 0 0 0;
}

.contentImageAcordeon {
    position: relative;
}

.contentImageAcordeon::after {
    content: '';
    position: absolute;
    height: 400px;
    width: 400px;
    /* background-color: var(--purple); */
    left: -20px;
    top: -30px;
    border-radius: 20px;
    border: 10px solid var(--purple);
    z-index: 0;
}

.contentImageAcordeon::before {
    content: '';
    position: absolute;
    height: 400px;
    width: 400px;
    /* background-color: var(--purple); */
    right: -20px;
    bottom: -30px;
    border-radius: 20px;
    border: 10px solid var(--green);
    z-index: 0;
}

.iconPlusAcordeon {
    background-color: var(--black);
    color: var(--green);
    padding: 12px;
    border-radius: 100px;
    position: absolute;
    right: 20px;
}

.service-tabing-wrap .accordion-single.active .accordion-btn::after {
    content: "\f068";
    font-family: "FontAwesome";
    color: var(--theme);
}

.pricing-title .radius-btn.style-2 {
    border: 1px solid var(--purple) !important;
}

.digital-marketing .comm .cmn-textslide:hover {
    color: #E3FF05;
}

.btnContent {
    text-align: center;
}

.pra-border {
    border: 1px solid var(--purple);
}

.sectionResources .stitle,
.sectionContact .stitle {
    font-size: 35px;
}

.theme-border {
    border: 1px solid var(--purple) !important;
}

.team-staft-slidewrap011 .comm .rot60 i {
    color: var(--purple);
}

.radius-btn.style-2:hover {
    border: 1px solid var(--purple) !important;
}

.testimonial-version011 .icon .theme-clr {
    color: var(--purple);
}

.d-inline-block i,
.rot60 i {
    color: var(--purple);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    text-transform: none;
}

.titleAboutHome {
    font-size: 30px !important;
}

.timelineSection .allyear-content {
    border-top: 1px solid var(--theme);
    padding-top: 45px;
}

.timelineSection .allyear-item {
    position: relative;
}

.allyear-content .allyear-item::before {
    position: absolute;
    left: 0;
    top: -45px;
    content: "";
    width: 15px;
    height: 16px;
    background: var(--theme);
    clip-path: polygon(48% 69%, 0 0, 100% 0);
}

.letsTalkSection a:hover {
    color: var(--green);
}

.mtitle a {
    color: var(--purple) !important;
}

.titleListServices {
    font-size: 20px !important;
}

.modern-list .titleListServices {
    margin-top: 50px;
    margin-bottom: 50px;
}

.subtitleSections {
    margin-top: 20px;
    font-size: 30px;
}

.btnConvierteTop {
    margin-top: 100px;
}

.team-staft {
    background: url(../images/team/team-stafbg) no-repeat center center !important;
    background-size: cover;
    background: var(--white) !important;
}


/* THEME */

h2,
h3,
h4,
h5,
h6,
p,
.white-clr {
    color: var(--black);
}

.digital-marketing .comm .cmn-textslide {
    opacity: 70%;
    color: var(--black);
}

.scrolling-wrap .comm .text-custom-storke {
    -webkit-text-stroke: 1px var(--black);
    -webkit-text-fill-color: transparent;
}

.blackbg,
.team-staft-slidewrap011,
.testimonial-version01-section.testimonial-version022-section,
.bg1-clr,
.bg2-clr {
    background: var(--white) !important;
}

.cmn-border {
    border: 1px solid var(--purple) !important;
}

.theme-clr {
    color: var(--purple);
}

.textitalick a,
.text-custom-storke a,
.mtitle-ara span,
.service-tabing-wrap .modern-list li,
.contact-sub-info .msub {
    color: var(--black);
}

.footer-bottom-version-one {
    background-color: var(--purple) !important;
}

.preloader .loader .loader-section .bg {
    background-color: var(--white);
}

.titleAbout {
    color: var(--purple);
}

.scrolling-wrap {
    overflow: hidden;
    white-space: nowrap;
    display: flex;
    gap: 120px;
    height: 135px;
}

.tag-cmn {
    border: 1px solid var(--green);
}

.team-staf-item .thumb {
    width: 100%;
    height: auto;
    margin: 0px;
}

.team-staf-item {
    padding: 0 !important;
}

.breadcrumnd-banner .breadcrumnd li {
    text-transform: none;
}

#whatsapp-button {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background-color: #4DAE50;
    color: white;
    border-radius: 100px;
    padding: 15px;
    font-size: 24px;
    text-align: center;
    z-index: 1000;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    transition: transform 0.2s ease;
    width: 70px;
    height: 70px;
}


/* Icono */

#whatsapp-button i {
    font-size: 40px;
    pointer-events: none;
}


/* Burbuja de texto */

#whatsapp-text {
    position: fixed;
    bottom: 30px;
    right: 100px;
    background-color: white;
    color: black;
    padding: 10px 14px;
    border-radius: 15px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    font-size: 14px;
    max-width: 225px;
    opacity: 0;
    transform: scale(0.8);
    transition: opacity 0.3s ease, transform 0.3s ease;
    z-index: 999;
}


/* Animación de salto */

@keyframes bounce {
    0%,
    100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-15px);
    }
}

thead {
    background-color: var(--green);
}

tbody th {
    background-color: var(--purple) !important;
    color: var(--white);
}

.contentTextDetails p,
.contentTextDetails span {
    color: var(--black) !important;
}

.contentTextDetails h4 {
    font-size: 23px !important;
    color: var(--purple);
}

.listCases li {
    color: var(--black);
    margin-left: 30px;
}

.listCases {
    list-style: disc;
}

.pricing-list {
    margin-bottom: 4px;
    margin-top: 20px;
}

.timelineSectionMobile {
    display: none;
}

.timelineSectionMobile .card-header {
    background-color: var(--purple);
}

.testimonial-zero-oneitem .btnConvierte {
    margin-top: 10px;
    display: inline-block;
    padding: 10px 30px !important;
}

.pra-clr {
    color: var(--black) !important;
}

footer .pra-clr,
footer h5 {
    color: #ffffff !important;
}

.cmn-textslide a {
    color: #222;
}

.cmn-textslide a:hover {
    color: var(--green);
}

@media (max-width: 767px) {
    .hero-section-version2 .banner-v2-thumb img {
        display: block;
        margin-bottom: 30px;
    }
    .btnConvierte {
        display: block;
        border-radius: 10px;
        padding: 10px 0 !important;
    }
    .timelineSectionMobile {
        display: block;
    }
    .timelineSectionDesktop {
        display: none;
    }
    .btnContent {
        padding: 0 15px;
    }
    .testimonial-version01-section {
        padding-top: 0 !important;
    }
    .team-staft-slidewrap011 {
        padding-bottom: 0 !important;
    }
    .testimonial-version01-section .testimonial-zero-oneitem .thumb {
        width: 100%;
    }
    .btnConvierteTop {
        margin-top: 10px;
    }
    .btnTitleAcordeon {
        padding: 12px 15px 10px 15px;
        font-size: 18px;
        line-height: 25px;
    }
    .iconPlusAcordeon {
        padding: 5px;
        right: 8px;
    }
    .accordion-button {
        padding: 20px 8px;
    }
    .contentBtnConvierte {
        margin-top: 30px;
    }
}