/* nav tabs style */
.nav-tabs-style { position: relative; border: 0; background: var(--white); }
.nav-tabs-style.scrollable { -ms-overflow-style: inherit; scrollbar-width: inherit; }
.nav-tabs-style.scrollable::-webkit-scrollbar { width: 0.5rem; height: 0.5 !important; cursor: pointer !important; }
.nav-tabs-style .nav-item { background: none; border: 0; width: 100%; }
.nav-tabs-style .nav-item .nav-link {
    position: relative;
    width: 100%;
    border-radius: 0;
    border: 0;
    background: none;
    display: inline-block;
    font-weight: 600;
    font-size: 1rem;
    color: var(--text2);
    text-align: center;
    padding: 0.625rem 1.25rem;
    transition: .125s;
    margin-bottom: 0.313rem;
}
.nav-tabs-style .nav-item .nav-link:before { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; background: var(--accent); visibility: hidden; opacity: 0; }
.nav-tabs-style .nav-item .nav-link.active { color: var(--accent); }
.nav-tabs-style .nav-item .nav-link.active:before { visibility: visible; opacity: 1; }

@media (max-width: 768px) {
    .nav-tabs-style .nav-item .nav-link { padding: 0.5rem 2rem; font-size: 0.938rem; } 
    .nav-tabs-style .nav-item .nav-link.active:before { visibility: hidden; opacity: 0; }
}

@media (max-width: 480px) {
    .nav-tabs-style .nav-item .nav-link { padding: 0.5rem 1.25rem; } 
}


.nav-tabs-style.nav-tabs-style-2 { background: none; }
.nav-tabs-style.nav-tabs-style-2 .nav-item .nav-link { font-weight: 500; color: var(--text1); padding: 0.625rem 0.625rem; border-radius: 1.25rem; }
.nav-tabs-style.nav-tabs-style-2 .nav-item .nav-link.active { background: var(--accent); color: var(--white); }
.nav-tabs-style.nav-tabs-style-2 .nav-item .nav-link:before { visibility: hidden; opacity: 0; transition: visibility 0.4s linear, opacity 0.4s ease-in-out linear; }

@media (max-width: 768px) {
    .nav-tabs-style.nav-tabs-style-2 .nav-item .nav-link { padding: 0.625rem 0.825rem; }
}
@media (max-width: 480px) {
    .nav-tabs-style.nav-tabs-style-2 .nav-item .nav-link { font-size: 0.875rem; }
}


    .services-excellent { position: relative; overflow: hidden; z-index: 4; }
    .services-excellent .description { position: relative; color: var(--text1); line-height: 165%; z-index: 2; }
    .services-excellent .wrap-content { max-width: 700px; }
    .services-excellent .wrap-content .flex-col { margin-bottom: 0.625rem; }
    .services-excellent .wrap-thumbnails { margin-top: 1.825rem; }
    .services-excellent .wrap-thumbnails .img-thumbnails { position: relative; overflow: hidden; object-fit: contain; width: 100%; max-width: 100%; border-radius: 0.625rem; z-index: 2; }
    .services-excellent .wrap-thumbnails .pattern-dots { position: absolute; bottom: -29%; right: -23%; max-width: 450px; z-index: -1; }
    /*.services-excellent .wrap-thumbnails .img-thumbnails:not(:last-child) { margin-bottom: 1.25rem; }*/

    .services-excellent .card-excellent.style-2 { height: 4.688rem; }
    .services-excellent .card-excellent.style-2:after { 
        content: '';
        background-image: url(../img/icon/chevron-right.svg) !important;
        background-size: 1.063rem !important;
        background-position: center !important;
        background-repeat: no-repeat !important;
        position: absolute;
        top: 40%; 
        right: 1.25rem; 
        width: 1.125rem; 
        height: 1.125rem;
        z-index: 2;
        background: transparent;
        border-radius: 0;
    }
    .services-excellent .card-excellent.style-2 .text { font-size: 0.815rem !important; }

    .services-excellent .nav-tabs-style.nav-tabs-style-2 .nav-item .nav-link { min-width: 150px; }

    @media (max-width: 992px) {
        .services-excellent .wrap-content { margin-bottom: 2.5rem; }

        .services-excellent .wrap-thumbnails { text-align: center; }
        .services-excellent .wrap-thumbnails .img-thumbnails { max-width: 85%; }
        .services-excellent .wrap-thumbnails .pattern-dots { bottom: -25%; right: -18%; max-width: 400px; }
        /*.services-excellent .wrap-thumbnails .img-thumbnails:not(:last-child) { margin-right: 0.625rem; margin-bottom: 1.25rem; }*/
    }
    @media (max-width: 768px) {
        .services-excellent { padding-top: 5rem; padding-bottom: 5rem; }
        .services-excellent .wrap-thumbnails { margin-top: 0rem; }
        .services-excellent .wrap-thumbnails .pattern-dots { bottom: -25%; right: -18%; max-width: 350px; }
    }
    @media (max-width: 480px) {
        .services-excellent .wrap-thumbnails .img-thumbnails { max-width: 100%; }
        .services-excellent .wrap-thumbnails .pattern-dots { bottom: -25%; right: -18%; max-width: 300px; }
        /*.services-excellent .wrap-thumbnails .img-thumbnails:not(:last-child) { margin-right: 0; }*/
    }



    .card-excellent { position: relative; overflow: hidden; height: 4.688rem; display: flex; align-items: center; flex-direction: row; background: var(--white); padding: 0.625rem 1.25rem; border-radius: 0.625rem; }
    .card-excellent:before {
        content: '';
        position: absolute;
        top: 40%;
        right: 1.28rem;
        width: 1rem; 
        height: 1rem;
        border-radius: 50%;
        background: var(--yellow);
        transform: scale(1);
        transform-origin: 50% 50%;
        transition: transform 0.3s ease-out;
        visibility: hidden;
        opacity: 0;
        z-index: 1;
    }
    .card-excellent:hover:before { visibility: visible; opacity: 1; transform: scale(35); transition: transform 0.5s ease-out, visibility 0.1s linear, opacity 0.1s linear; }
    .card-excellent .text { z-index: 2; font-weight: bold; font-size: 0.815rem; line-height: 1.4; color: var(--second2); text-transform: uppercase; max-width: 86%; margin-bottom: 0; }
    .card-excellent:after {
        content: '';
        background-image: url(../img/icon/chevron-right.svg);
        background-size: 1.063rem;
        background-position: center;
        background-repeat: no-repeat;
        position: absolute;
        top: 40%; 
        right: 1.25rem; 
        width: 1.125rem; 
        height: 1.125rem;
        z-index: 2;
    }

    .card-excellent.style-2 { height: 6.25rem; flex-direction: column; align-items: flex-start; justify-content: center; }
    .card-excellent.style-2:before { background: #E7F5FF; }
    .card-excellent.style-2 .pattern-1 {
        content: '';
        background-image: url(../img/excellent-pattern.png);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        position: absolute;
        top: 0; 
        left: 0; 
        width: 155px;
        height: 100%;
        opacity: 0.5;
        z-index: 2;
        -webkit-filter: grayscale(1);
        filter: grayscale(1);
        -webkit-transition: filter 0.4s opacity 0.4s ease-in-out; -moz-transition: filter 0.4s opacity 0.4s ease-in-out; -ms-transition: filter 0.4s opacity 0.4s ease-in-out; -o-transition: filter 0.4s opacity 0.4s ease-in-out; transition: filter 0.4s opacity 0.4s ease-in-out;
    }
    .card-excellent.style-2:after {
        content: '\f067';
        background-image: var;
        font-family: 'Font Awesome 5 Free';
        font-style: normal;
        font-weight: 900;
        font-size: 0.725rem;
        color: var(--white);
        background: var(--accent);
        border-radius: 50%;
        line-height: 1.25rem;
        text-align: center;
        width: 1.25rem; 
        height: 1.25rem;
    }
    .card-excellent.style-2 .text { font-weight: bold; font-size: 1rem; color: var(--dark) !important; margin-bottom: 0; transition: all 0.3s ease-in-out; }
    .card-excellent.style-2 .next-desc { z-index: 2; font-weight: normal; font-size: 0.813rem; color: var(--dark) !important; width: 100%; margin-top: 0.313rem; margin-bottom: -1.25rem; opacity: 0; visibility: hidden; transition-delay: 0s, 0s, 0.3s; }
    
    .card-excellent.style-2[aria-expanded="true"] { background: #E7F5FF; }
    .card-excellent.style-2[aria-expanded="true"]:after { content: '\f068'; }
    .card-excellent.style-2:hover:before, .card-excellent.style-2[aria-expanded="true"]:before { transform: scale(43); }
    .card-excellent.style-2:hover .pattern-1, .card-excellent.style-2[aria-expanded="true"] .pattern-1 { opacity: 1; -webkit-filter: grayscale(0); filter: grayscale(0); -webkit-transition: filter 1s opacity 1s ease-in-out; -moz-transition: filter 1s opacity 1s ease-in-out; -ms-transition: filter 1s opacity 1s ease-in-out; -o-transition: filter 1s opacity 1s ease-in-out; transition: filter 1s opacity 1s ease-in-out; }
    .card-excellent.style-2:hover .next-desc, .card-excellent.style-2[aria-expanded="true"] .next-desc { margin-bottom: 0; opacity: 1; visibility: visible; transition: all 0.3s ease-in-out; }