:root{
    --primary-color: #0D0D0D;
    --secondary-color: #2561A1;
    --theme-color: #9BA1A7;
    --primary-font: 'Urbanist', sans-serif;
    --secondary-font: 'Inter', sans-serif;
}
* {
    margin:0px;
    padding:0px;
    border:none;
    outline:none;
}
body {
    font-size:20px;    
    line-height:32px;
    font-weight:400;
    color: #6A6A6A;
    background-size:cover;
    font-style: normal;
    font-family: var(--secondary-font);
    background-repeat:no-repeat;
    background-position:center top;
    -webkit-font-smoothing: antialiased;
}
.boxed_wrapper {
    position: relative;
    overflow-x: hidden;
    margin: 0 auto;
    width: 100%;
    background-color: #ffffff;
    min-width: 300px;
}
.container-fulid{
    max-width: 1920px;
    width: 100%;
    margin: 0 auto;
}
.container{
    margin-top: 20px;
    max-width: 1320px;
    width: 100%;
}
a{
    text-decoration:none;
    transition:all 500ms ease;
    -moz-transition:all 500ms ease;
    -webkit-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
    -o-transition:all 500ms ease;
}  
a:hover{
    text-decoration:none;
    outline:none;
}  
input,button,select,textarea{
    font-weight: 400;
    font-size: 14px;
    background: transparent;
}  
::-webkit-input-placeholder {
    color: inherit;
}  
::-moz-input-placeholder {
    color: inherit;
}  
::-ms-input-placeholder {
    color: inherit;
}
ul,li{
    list-style:none;
    padding:0px;
    margin:0px; 
}
button:focus,
input:focus,
textarea:focus{
    outline: none;
    box-shadow: none;
}  
p{  
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    margin: 0;
    color: var(--primary-color);
    font-family: var(--secondary-font);
}  
h1,h2,h3,h4,h5,h6{
    margin: 0;
    color: var(--primary-color);
    font-family: var(--primary-font);
}
h1{
    font-size: 64px;
    line-height: 74px;
    font-weight: 700;
}
h2{
    font-size: 48px;
    line-height: 56px;
    font-weight: 700;
}
h3{
    font-size: 32px;
    line-height: 42px;
    font-weight: 700;
}
h4{
    font-size: 24px;
    line-height: 30px;
    font-weight: 700;
}
h5{
    font-size: 20px;
    line-height: 30px;
}
h6{
    font-size: 16px;
    line-height: 28px;
}
.centred{
    text-align: center;
}
figure{
    margin: 0px;
}
img {
    display: inline-block;
    max-width: 50%;
    margin-left: 20px;
    height: auto;
    transition-delay: .1s;
    transition-timing-function: ease-in-out;
    transition-duration: .7s;
    transition-property: all;
}

/** Defult Form **/
.form-group{
    position: relative;
    display: block;
    margin-bottom: 30px;
}
.form-group input,
.form-group textarea{
    position: relative;
    display: block;
    width: 100%;
    height: 60px;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    border-radius: 5px;
    padding: 10px 30px;
    font-family: var(--secondary-font);
    transition:all 500ms ease;
    -moz-transition:all 500ms ease;
    -webkit-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
    -o-transition:all 500ms ease;
}  
.form-group textarea{
    height: 170px;
    resize: none;
}  
.form-group input:focus,
.form-group textarea:focus{
    border-color: var(--secondary-color);
}
/** End Defult Form **/

/** Button Style One **/
.btn_style_one{
    position: relative;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px;
    z-index: 1;
    display: inline-block;
    border-radius: 60px;
    color: var(--bs-white);
    overflow: hidden;
    padding: 10px 25px 10px 25px;
    font-family: var(--primary-font);
background: -webkit-linear-gradient(-45deg, #4FC3F7 0%, #1565C0 55%, #455A64 100%);
background: linear-gradient(-45deg, #4FC3F7 0%, #1565C0 55%, #455A64 100%);
    transition: all 900ms ease;
    -moz-transition: all 900ms ease;
    -webkit-transition: all 900ms ease;
    -ms-transition: all 900ms ease;
    -o-transition: all 900ms ease;
}
.btn_style_one::before{
    position: absolute;
    top: 0;
    left: 0;
    width: 0%;
    height: 100%;
    content: '';
    z-index: -1;
  background: -webkit-linear-gradient(-45deg, #6EC6FF 0%, #3B82F6 45%, #64748B 100%);
background: linear-gradient(-45deg, #6EC6FF 0%, #3B82F6 45%, #64748B 100%);
    transition: all 900ms ease;
    -moz-transition: all 900ms ease;
    -webkit-transition: all 900ms ease;
    -ms-transition: all 900ms ease;
    -o-transition: all 900ms ease;
}
.btn_style_one:hover:before{
    width: 100%;
}

/** End Button Style One **/

.btn_style_two{
    position: relative;
    display: flex;
    padding: 10px 25px 10px 25px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    font-family: var(--primary-font);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px;
    border-radius: 60px;
    z-index: 1;
    overflow: hidden;
    background: transparent;
    border: 1px solid #E871C2;
    transition: all 900ms ease;
    -moz-transition: all 900ms ease;
    -webkit-transition: all 900ms ease;
    -ms-transition: all 900ms ease;
    -o-transition: all 900ms ease;
}
.btn_style_two span{
    border-radius: 60px;
   background: -webkit-linear-gradient(-45deg, #6EC6FF 0%, #3B82F6 45%, #64748B 100%);
background: linear-gradient(-45deg, #6EC6FF 0%, #3B82F6 45%, #64748B 100%);  
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.btn_style_two:before{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0%;
    content: '';
    z-index: -1;
    background: -webkit-linear-gradient(-45deg, #6EC6FF 0%, #3B82F6 45%, #64748B 100%);
background: linear-gradient(-45deg, #6EC6FF 0%, #3B82F6 45%, #64748B 100%);
    transition: all 900ms ease;
    -moz-transition: all 900ms ease;
    -webkit-transition: all 900ms ease;
    -ms-transition: all 900ms ease;
    -o-transition: all 900ms ease;
}
.btn_style_two:hover:before{
    height: 100%;
}
.btn_style_two:hover span{
    background: #ffffff;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.tabs-box .tab{
    position:relative;
    display:none;
    transition: all 900ms ease;
    -moz-transition: all 900ms ease;
    -webkit-transition: all 900ms ease;
    -ms-transition: all 900ms ease;
    -o-transition: all 900ms ease;
}  
.tabs-box .tab.active-tab{
    display:block;  
}  
.tabs-box .tab{
    transform:scale(0.9,0.9) translateY(0px);
}  
.tabs-box .tab.active-tab{
    transform:scale(1) translateY(0px);
}

.float-bob-y {
    animation-name: float-bob-y;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: float-bob-y;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: float-bob-y;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: float-bob-y;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: float-bob-y;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
  }
  
  .float-bob-x{
    animation-name: float-bob-x;
    animation-duration: 15s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: float-bob-x;
    -webkit-animation-duration: 15s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: float-bob-x;
    -moz-animation-duration: 15s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: float-bob-x;
    -ms-animation-duration: 15s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: float-bob-x;
    -o-animation-duration: 15s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
  }

  /* faq */
  .faq-wrapper{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:50px;
    margin-top:50px;
}

.faq-left{
    flex:0 0 60%;
    max-width:60%;
}

.faq-right{
    flex:0 0 40%;
    max-width:40%;
    text-align:center;
}

.faq-right img{
    max-width:120%;
    height:auto;
    display:block;
    margin:auto;
}

@media (max-width:991px){

    .faq-wrapper{
        flex-direction:column;
    }

    .faq-left,
    .faq-right{
        flex:0 0 100%;
        max-width:100%;
    }

    .faq-right{
        margin-top:30px;
    }

    .faq-right img{
        max-width:80%;
        margin-top: auto;
    }

}
  @-webkit-keyframes ripple {
    70% {
      -webkit-box-shadow: 0 0 0 30px rgba(255, 255, 255, 0);
              box-shadow: 0 0 0 30px rgba(255, 255, 255, 0);
    }
    100% {
      -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
              box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
  }
  @keyframes ripple {
    70% {
      -webkit-box-shadow: 0 0 0 30px rgba(255, 255, 255, 0);
              box-shadow: 0 0 0 30px rgba(255, 255, 255, 0);
    }
    100% {
      -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
              box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
  }
  

/* Preloader */
.handle-preloader {
    align-items: center;
    -webkit-align-items: center;
    display: flex;
    display: -ms-flexbox;
    height: 100%;
    justify-content: center;
    -webkit-justify-content: center;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    background: -webkit-linear-gradient(-45deg, #6EC6FF 0%, #3B82F6 45%, #64748B 100%);
background: linear-gradient(-45deg, #6EC6FF 0%, #3B82F6 45%, #64748B 100%);
    z-index: 9999999;
}  
.preloader-close{
    position: fixed;
    z-index: 99999999;
    font-size: 18px;
    background: #fff;
    width: 30px;
    height: 30px;
    line-height: 26px;
    text-align: center;
    cursor: pointer;
    right: 15px;
    top: 15px;
    border-radius: 50%;
}  
.handle-preloader .animation-preloader {
    position: absolute;
    z-index: 100;
}  
.handle-preloader .animation-preloader .spinner{
    animation: spinner 1s infinite linear;
    border-radius: 50%;
    height: 150px;
    margin: 0 auto 45px auto;
    width: 150px;
}  
.handle-preloader .animation-preloader .txt-loading {
    text-align: center;
    user-select: none;
}  
.handle-preloader .animation-preloader .txt-loading .letters-loading:before{
    animation: letters-loading 4s infinite;
    content: attr(data-text-preloader);
    left: 0;
    opacity: 0;
    top:0;
    position: absolute;
}  
.handle-preloader .animation-preloader .txt-loading .letters-loading{
    font-family: 'Lexend', sans-serif;
    font-weight: 500;
    letter-spacing: 15px;
    display: inline-block;
    position: relative;
    font-size: 70px;
    line-height: 70px;
    text-transform: uppercase;
    color: transparent;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: rgba(255, 255, 255, 0.30);
}  
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(2):before {animation-delay: 0.2s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(3):before {animation-delay: 0.4s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(4):before {animation-delay: 0.6s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(5):before {animation-delay: 0.8s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(6):before { animation-delay: 1s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(7):before { animation-delay: 1.2s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(8):before { animation-delay: 1.4s;}
.handle-preloader .loader-section {
    background-color: #ffffff;
    height: 100%;
    position: fixed;
    top: 0;
    width: calc(50% + 1px);
}  
.preloader .loaded .animation-preloader {
    opacity: 0;
    transition: 0.3s ease-out;
}  
.handle-preloader .animation-preloader .txt-loading .letters-loading{
    
}  
.handle-preloader .animation-preloader .txt-loading .letters-loading:before{
    color: #ffffff;
}  
.handle-preloader .animation-preloader .spinner{
    border: 3px solid #ffffff;
    border-top-color: rgba(255, 255, 255, 0.5); 
}  
/* Animación del preloader */
@keyframes spinner {
    to {
        transform: rotateZ(360deg);
    }
}
@keyframes letters-loading {
    0%,
    75%,
    100% {
        opacity: 0;
        transform: rotateY(-90deg);
    }  
    25%,
    50% {
        opacity: 1;
        transform: rotateY(0deg);
    }
}
@media screen and (max-width: 767px) {
    .handle-preloader .animation-preloader .spinner {
        height: 8em;
        width: 8em;
    }
}
@media screen and (max-width: 500px) {
    .handle-preloader .animation-preloader .spinner {
        height: 7em;
        width: 7em;
    }
    .handle-preloader .animation-preloader .txt-loading .letters-loading {
        font-size: 30px; 
        letter-spacing: 10px;
    }
}

.social-links{
    display: flex;
    align-items: center;
    gap: 8px;
}
.social-links li a{
    display: inline-block;
    font-size: 15px;
    width: 44px;
    height: 44px;
    line-height: 44px;
    text-align: center;
    border-radius: 30px;
    border: 1px solid rgba(255, 255, 255, 0.35);
    transition: all 900ms ease;
    -moz-transition: all 900ms ease;
    -webkit-transition: all 900ms ease;
    -ms-transition: all 900ms ease;
    -o-transition: all 900ms ease;
}
.social-links li a:hover{
    border-color: #E770C1;
}
.social-links li a i{
    font-size: 24px;
    line-height: 43px;
    color: rgba(255, 255, 255, 0.5);
    transition: all 900ms ease;
    -moz-transition: all 900ms ease;
    -webkit-transition: all 900ms ease;
    -ms-transition: all 900ms ease;
    -o-transition: all 900ms ease;   
}
.social-links li a:hover i{
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
  background: -webkit-linear-gradient(-45deg, #6EC6FF 0%, #3B82F6 45%, #64748B 100%);
background: linear-gradient(-45deg, #6EC6FF 0%, #3B82F6 45%, #64748B 100%);
}
.mb_30{
    margin-bottom: 30px;
}
.mb_40{
    margin-bottom: 40px;
}
.mb_50{
    margin-bottom: 50px;
}
.mb_60{
    margin-bottom: 60px;
}
.pt_150{
    padding-top: 150px;
}
.pb_150{
    padding-bottom: 150px;
}
.pb_100{
    padding-bottom: 100px;
}
.pb_120{
    padding-bottom: 120px;
}
.tag_text {
    text-align: center;
    border-radius: 50px;
    display: inline-block;
    padding: 5px 18px;
    margin-bottom: 12px;
    background: rgb(159 112 253 / 10%);
}
.tag_text h6{
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0.35px;
    font-family: var(--primary-font);
    text-transform: uppercase;
   background: -webkit-linear-gradient(-45deg, #6EC6FF 0%, #3B82F6 45%, #64748B 100%);
background: linear-gradient(-45deg, #6EC6FF 0%, #3B82F6 45%, #64748B 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.section_title{
    margin-bottom: 50px;
}
.section_title h2{
    color: var(--primary-color);
    font-family: var(--primary-font);
    font-size: 48px;
    font-style: normal;
    font-weight: 700;
    line-height: 58px;
    text-transform: capitalize;
}
.section_title.light h2{
    color: var(--bs-white);
}
.owl-dots-none .owl-dots,
.owl-nav-none .owl-nav{
  display: none !important;
}

.owl-theme.owl-dots-one .owl-dots{
    display: flex;
    gap: 5px;
    align-items: center;
    justify-content: center;
}
.owl-theme.owl-dots-one .owl-dot{
    position: relative;
}
.owl-theme.owl-dots-one .owl-dot span{
    width: 14px;
    height: 14px;
    display: block;
    margin: 0px;
    border-radius: 50%;
    border: 1.5px solid #0D0D0D;
    background: #FFF;
    transition: opacity 200ms ease 0s;
}
.owl-theme.owl-dots-one .owl-dot.active span{
    width: 22px;
    height: 22px;
    text-align: center;
    border-radius: 50%;
    border-color: #9F70FD;
    background: #ffffff;
}
.owl-theme.owl-dots-one .owl-dot:before{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 14px;
    height: 14px;
    content: '';
    text-align: center;
    border-radius: 50%;
    background-color: #9F70FD;
    visibility: hidden;
}
.owl-theme.owl-dots-one .owl-dot.active:before{
    position: absolute;
    top: 4px;
    left: 4px;
    visibility: visible;
}
.owl-theme.nav-style-one .owl-nav{
    display: flex;
    align-items: center;
    gap: 10px;
}
.owl-theme.nav-style-one .owl-nav button{
    width: 60px;
    height: 60px;
    font-size: 16px;
    line-height: 60px;
    border-radius: 60px;
    text-align: center;
    color: #0D0D0D;
    border: 1px solid #0D0D0D;
    background: #FFF;
    transition:all 500ms ease;
    -moz-transition:all 500ms ease;
    -webkit-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
    -o-transition:all 500ms ease;
}
.owl-theme.nav-style-one .owl-nav button:hover{
    color: #9F70FD;
    border: 1px solid #9F70FD;
}
.owl-theme.nav-style-one .owl-nav button.owl-prev{
    transform: rotate(180deg);
}
.accordion_box .block .acc-content{
    display:none;
}  
.accordion_box .block .acc-content.current{
    display:block;  
}

.pagination{
	position:relative;
	display:block;
}
.pagination li{
	position: relative;
    display: inline-block;
    margin: 0px;
}
.pagination li a, 
.pagination li span{
	position: relative;
    display: inline-block;
    font-size: 18px;
    height: 46px;
    width: 46px;
    line-height: 50px;
    background: #fff;
    font-weight: 600;
    border-radius: 50%;
    text-align: center;
    color: #1d165c;
    box-shadow: 0 0px 30px 5px rgb(228 228 238 / 0%);
    transition: all 500ms ease;
}
.pagination li a:focus, 
.pagination li a:hover, 
.pagination li span:focus, 
.pagination li span:hover, 
.pagination li span.current{
	color: #ffffff;
   background: -webkit-linear-gradient(-45deg, #6EC6FF 0%, #3B82F6 45%, #64748B 100%);
background: linear-gradient(-45deg, #6EC6FF 0%, #3B82F6 45%, #64748B 100%);
}

/*=============================================
  Site-wide Typography — Professional Scale
  Paste this at the very END of your main
  stylesheet (after the career page overrides
  is fine too — order between them doesn't matter).
=============================================*/

/* ---- Base scale ---- */
body{
    font-size: 16px;
    line-height: 26px;
}

h1{
    font-size: 40px;
    line-height: 50px;
}
h2{
    font-size: 30px;
    line-height: 40px;
}
h3{
    font-size: 22px;
    line-height: 30px;
}
h4{
    font-size: 18px;
    line-height: 26px;
}
h5{
    font-size: 17px;
    line-height: 26px;
}
h6{
    font-size: 15px;
    line-height: 24px;
}

p{
    font-size: 15px;
    line-height: 24px;
}

/* ---- Section titles (override the 48px hardcode) ---- */
.section_title h2{
    font-size: 32px;
    line-height: 42px;
}

/* ---- Hero banners (override 64-72px hardcodes) ---- */
.banner_style_one .banner_content h1,
.banner_style_two .banner_content h1,
.banner_style_three .banner_content h1,
.banner_style_five .banner_content h1{
    font-size: 40px;
    line-height: 50px;
}
.banner_style_four .banner_content h1{
    font-size: 42px;
    line-height: 1.2;
}
.banner_style_one .banner_content p,
.banner_style_two .banner_content p,
.banner_style_three .banner_content p,
.banner_style_four .banner_content p,
.banner_style_five .banner_content p{
    font-size: 16px;
    line-height: 26px;
}

/* ---- Feature / why-choose / service blocks ---- */
.feature_block_one h3{
    font-size: 22px;
    line-height: 30px;
}
.why_choose_left h2{
    font-size: 32px;
    line-height: 42px;
}
.why_choose_block_one h4,
.why_choose_block_two h4,
.service_block_one h4,
.process_block_one h4,
.content_item_one .icon_content h4,
.feature_block_two .feature_content h4{
    font-size: 19px;
    line-height: 26px;
}

/* ---- Testimonials ---- */
.testimonial_block_three p{
    font-size: 20px;
    line-height: 32px;
}
.testimonial_block_one .author_info h5{
    font-size: 17px;
}

/* ---- CTA / App promo ---- */
.cta_inner h3{    
    font-size: 26px;
    line-height: 34px;
}
.app_outer_box .content_box h2{
    font-size: 32px;
    line-height: 42px;
}

/* ---- Breadcrumb / page headers ---- */
.breadcrumb_title{
    font-size: 40px;
    line-height: 50px;
}

/* ---- Blog ---- */
.news_block_one h3{
    font-size: 19px;
    line-height: 27px;
}

/* ---- Error / misc large headings ---- */
.error_content h2,
.error_content h2 span{
    font-size: 30px;
}
.project_details_section h2,
H2.service_details_title{
    font-size: 32px;
    line-height: 42px;
}

.client_logo {
    background: #f8fbff;
}

.client_logo_box_row {
    justify-content: center;
    row-gap: 30px;
}

.client_logo_boxs{
    display:flex;
    justify-content:center;
    align-items:center;
}

.client_logo_boxs img{
    width:100%;
    max-width:170px;
    height:90px;
    object-fit:contain;

    background:#fff;
    padding:18px;
    border-radius:12px;

    border:1px solid #ececec;

    box-shadow:0 6px 20px rgba(0,0,0,.05);

    transition:.35s ease;
}

.client_logo_boxs img:hover{

    transform:translateY(-8px) scale(1.05);

    box-shadow:0 18px 35px rgba(0,0,0,.12);

    border-color:#0d6efd;

    background:#ffffff;
}

.client_logo_boxs{
    margin-bottom:30px;
}

.client_logo_boxs img{

    width:100%;
    height:110px;

    object-fit:contain;

    background:#fff;

    padding:20px;

    border-radius:15px;

    border:1px solid #eef1f4;

    transition:.4s;

    box-shadow:0 8px 24px rgba(0,0,0,.05);
}

.client_logo_boxs img:hover{

    transform:translateY(-10px);

    box-shadow:0 18px 40px rgba(13,110,253,.18);

    border-color:#0d6efd;

    background:linear-gradient(180deg,#ffffff,#f6faff);
}
/* FAQ */

.accordion-item{

border:none;

margin-bottom:20px;

border-radius:15px;

overflow:hidden;

box-shadow:0 10px 30px rgba(0,0,0,.08);

}

.accordion-button{

padding:22px;
margin-top: 10px;
font-size:18px;

font-weight:600;

}

.accordion-button:not(.collapsed){

background:var(--theme-color);

color:#fff;

}

.accordion-body{

padding:25px;

line-height:30px;

}

/* CTA */

.cta-area{

padding:100px 0;

}

.cta-box{

background:linear-gradient(135deg,var(--theme-color),#6a8dff);

padding:60px;

border-radius:25px;

color:#fff;

}

.cta-box h2{

font-size:42px;

margin-bottom:15px;

color:#fff;

}

.cta-box p{

color:#fff;

margin:0;

}

/* Partner */

.partner-area{

background:#f8fbff;

}

.partner-area img{

max-height: 100px;

opacity:.8;

transition:.3s;

}

.partner-area img:hover{

opacity:1;

transform:scale(1.1);

}

/* Contact */

.contact-banner{

padding:100px 0;

}

.contact-box{

background:#fff;

padding:60px;

text-align:center;

border-radius:20px;

box-shadow:0 20px 50px rgba(0,0,0,.08);

}

.contact-box h2{

font-size:42px;

margin-bottom:15px;

}

.contact-box p{

margin-bottom:30px;

}

.theme-btn-two{

display:inline-block;

margin-left:15px;

padding:14px 35px;

border:2px solid var(--theme-color);

border-radius:50px;

color:var(--theme-color);

font-weight:600;

transition:.3s;

text-decoration:none;

}

.theme-btn-two:hover{

background:var(--theme-color);

color:#fff;

}
.choose-box{

background:#fff;

padding:45px 30px;

border-radius:18px;

text-align:center;

box-shadow:0 10px 35px rgba(0,0,0,.08);

transition:.4s;

height:100%;
margin-top: 10px;

}

.choose-box:hover{

transform:translateY(-10px);

}

.choose-box h3{

font-size:48px;

color:var(--theme-color);

margin-bottom:10px;

font-weight:700;

}

.choose-box p{

margin:0;

font-size:17px;

font-weight:600;

}
.service-details-area{

position:relative;

}

.gray-bg{

background:#f8fbff;

}

.service-content{

padding-left:30px;
margin-top: 5px;

}

.service-tag{

display:inline-block;

padding:8px 20px;

border-radius:30px;

background:rgba(108,99,255,.1);

color:var(--theme-color);

font-weight:600;

margin-bottom:18px;

}

.service-content h2{

font-size:42px;

margin-bottom:20px;

font-weight:700;

}

.service-content p{

font-size:16px;

line-height:30px;

margin-bottom:25px;

color:#666;

}

.service-list{

padding:0;

margin:0;

list-style:none;

}

.service-list li{

position:relative;

padding-left:28px;

margin-bottom:15px;

font-size:16px;

font-weight:500;

}

.service-list li:before{

content:"✔";

position:absolute;

left:0;

top:0;

color:var(--theme-color);

font-weight:bold;

}

.service-details-area img{

border-radius:20px;
max-width: 70%;
transition:.4s;

}

.service-details-area img:hover{

transform:scale(1.02);

}

@media(max-width:991px){

.service-content{

padding-left:0;

margin-top:35px;

}

.service-content h2{

font-size:30px;

}

}
.services-overview{

background:#f8fbff;

}

.section-title{

max-width:760px;

margin:auto;

}

.sub-title{
margin-top: 5px;
display:inline-block;

background:rgba(111,66,193,.12);

color:var(--theme-color);

padding:8px 18px;

border-radius:30px;

font-weight:600;

margin-bottom:15px;

}

.service-card{

background:#fff;
margin-top: 15px;
border-radius:18px;

padding:35px 30px;

height:100%;

transition:.4s;

box-shadow:0 10px 35px rgba(0,0,0,.06);

border:1px solid #eee;

}

.service-card:hover{

transform:translateY(-10px);

box-shadow:0 20px 45px rgba(0,0,0,.12);

}

.service-card .icon{

width:75px;

height:75px;

border-radius:18px;

background:linear-gradient(135deg,var(--theme-color),#6a8dff);

display:flex;

align-items:center;

justify-content:center;

font-size:30px;

color:#fff;

margin-bottom:25px;

}

.service-card h3{

font-size:24px;

margin-bottom:15px;

}

.service-card p{

margin-bottom:20px;

}

.service-card ul{

padding:0;

margin:0 0 25px;

list-style:none;

}

.service-card ul li{

padding:8px 0;

border-bottom:1px dashed #ddd;

}

.service-card ul li:last-child{

border-bottom:none;

}

.service-card ul li:before{

content:"✔";

color:var(--theme-color);

margin-right:10px;

}

.theme-btn{

display:inline-block;

padding:12px 30px;

background:var(--theme-color);

color:#fff;

border-radius:40px;

text-decoration:none;

transition:.3s;

}

.theme-btn:hover{

transform:translateY(-3px);

color:#fff;

}
/*=========================================
        OUR PARTNERS
==========================================*/

.partner-section{

    background:#f8fbff;

}

.partner-grid{

    display:grid;

    grid-template-columns:repeat(8,1fr);

    gap:18px;

}

.partner-item{

    background:#fff;

    border:1px solid #ececec;

    border-radius:12px;

    height:90px;

    display:flex;

    justify-content:center;

    align-items:center;

    padding:12px;

    transition:.35s;

}

.partner-item img{

    max-width: 100%;
    margin-left:auto;
    border-radius: 10px;
    object-fit: fill;

    transition:.35s;

    filter:grayscale(15%);

}

.partner-item:hover{

    transform:translateY(-6px);

    border-color:var(--theme-color);

    box-shadow:0 12px 30px rgba(0,0,0,.08);

}

.partner-item:hover img{

    filter:none;

    transform:scale(1.05);

}

/* 7 logos */

@media(max-width:1400px){

.partner-grid{

grid-template-columns:repeat(7,1fr);

}

}

/* 6 logos */

@media(max-width:1200px){

.partner-grid{

grid-template-columns:repeat(6,1fr);

}

}

/* 5 logos */

@media(max-width:992px){

.partner-grid{

grid-template-columns:repeat(5,1fr);

}

.partner-item{

height:80px;

}

}

/* 4 logos */

@media(max-width:768px){

.partner-grid{

grid-template-columns:repeat(4,1fr);

}

.partner-item{

height:75px;

padding:10px;

}

.partner-item img{

height:45px;

}

}

/* 3 logos */

@media(max-width:576px){

.partner-grid{

grid-template-columns:repeat(3,1fr);

gap:12px;

}

.partner-item{

height:70px;

padding:8px;

}

.partner-item img{

height:38px;

}

}/* =========================================================
   SERVICE DETAILS PAGE - COMPLETE CSS
========================================================= */

/* ---------------------------------------------------------
   BREADCRUMB / PAGE TITLE
--------------------------------------------------------- */

.service-details-breadcrumb {
    width: 100%;
    padding: 90px 0 70px;
    background: #f8f8f8;
}

.service-details-breadcrumb .container {
    width: 100%;
}

.service-details-breadcrumb-content {
    width: 100%;
    text-align: center;
}

.service-details-breadcrumb-content h1 {
    margin: 0 0 15px;
    padding: 0;
    font-size: 40px;
    line-height: 1.3;
    font-weight: 700;
    color: #222222;
}

.service-details-breadcrumb-content .bread-crumb {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.service-details-breadcrumb-content .bread-crumb li {
    position: relative;
    margin: 0;
    padding: 0;
    font-size: 15px;
    color: #666666;
}

.service-details-breadcrumb-content .bread-crumb li:not(:last-child)::after {
    content: "/";
    margin-left: 8px;
    color: #999999;
}

.service-details-breadcrumb-content .bread-crumb li a {
    color: #7a2d9e;
    text-decoration: none;
}

.service-details-breadcrumb-content .bread-crumb li a:hover {
    color: #E770C1;
}


/* =========================================================
   MAIN SERVICE DETAILS AREA
========================================================= */

.service-details-area {
    width: 100%;
    padding: 80px 0 70px;
    background: #ffffff;
}

.service-details-area .container {
    width: 100%;
}

.service-details-wrapper {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}


/* =========================================================
   SERVICE TITLE
========================================================= */

.service-details-header {
    width: 100%;
    margin: 0 0 35px;
    padding: 0;
    text-align: center;
}

.service-details-tag {
    display: inline-block;
    margin: 0 0 15px;
    padding: 7px 20px;
    border-radius: 30px;
    background: rgba(122, 45, 158, 0.08);
    color: #7a2d9e;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 600;
}

.service-details-header h2 {
    margin: 0;
    padding: 0;
    font-size: 34px;
    line-height: 1.35;
    font-weight: 700;
    color: #222222;
}


/* =========================================================
   SERVICE CONTENT BOX
========================================================= */

.service-details-content {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 40px 45px;
    background: #ffffff;
    border: 1px solid #eeeeee;
    border-radius: 10px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.06);

    font-size: 16px;
    line-height: 1.8;
    color: #555555;

    text-align: left;

    overflow: hidden;
}


/* =========================================================
   PARAGRAPHS
========================================================= */

.service-details-content p {
    margin: 0 0 20px;
    padding: 0;
    color: #555555;
    font-size: 16px;
    line-height: 1.8;
}

.service-details-content p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   HEADINGS INSIDE CKEDITOR CONTENT
========================================================= */

.service-details-content h1,
.service-details-content h2,
.service-details-content h3,
.service-details-content h4,
.service-details-content h5,
.service-details-content h6 {
    margin-right: 0;
    margin-left: 0;
    color: #222222;
    font-weight: 700;
    line-height: 1.4;
}

.service-details-content h1 {
    margin-top: 30px;
    margin-bottom: 18px;
    font-size: 30px;
}

.service-details-content h2 {
    margin-top: 30px;
    margin-bottom: 18px;
    font-size: 27px;
}

.service-details-content h3 {
    margin-top: 28px;
    margin-bottom: 15px;
    font-size: 22px;
}

.service-details-content h4 {
    margin-top: 25px;
    margin-bottom: 14px;
    font-size: 20px;
}

.service-details-content h5 {
    margin-top: 22px;
    margin-bottom: 12px;
    font-size: 18px;
}

.service-details-content h6 {
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 16px;
}


/* =========================================================
   LISTS
========================================================= */

.service-details-content ul {
    display: block;
    margin: 15px 0 25px;
    padding-left: 25px;
    list-style-type: disc;
}

.service-details-content ol {
    display: block;
    margin: 15px 0 25px;
    padding-left: 25px;
    list-style-type: decimal;
}

.service-details-content ul li,
.service-details-content ol li {
    display: list-item;
    margin: 0 0 10px;
    padding: 0;
    color: #555555;
    font-size: 16px;
    line-height: 1.7;
}

.service-details-content ul li:last-child,
.service-details-content ol li:last-child {
    margin-bottom: 0;
}


/* =========================================================
   BOLD / ITALIC / UNDERLINE
========================================================= */

.service-details-content strong,
.service-details-content b {
    color: #222222;
    font-weight: 700;
}

.service-details-content em,
.service-details-content i {
    font-style: italic;
}

.service-details-content u {
    text-decoration: underline;
}


/* =========================================================
   LINKS
========================================================= */

.service-details-content a {
    color: #7a2d9e;
    text-decoration: none;
}

.service-details-content a:hover {
    color: #E770C1;
    text-decoration: underline;
}


/* =========================================================
   BLOCKQUOTE
========================================================= */

.service-details-content blockquote {
    margin: 25px 0;
    padding: 15px 20px;
    border-left: 4px solid #7a2d9e;
    background: #f8f8f8;
    color: #555555;
    font-size: 16px;
}


/* =========================================================
   TABLES INSIDE SERVICE CONTENT
========================================================= */

.service-details-content table {
    width: 100%;
    margin: 25px 0;
    border-collapse: collapse;
}

.service-details-content table th,
.service-details-content table td {
    padding: 12px 15px;
    border: 1px solid #dddddd;
    text-align: left;
    vertical-align: top;
}

.service-details-content table th {
    background: #f7f7f7;
    color: #222222;
    font-weight: 700;
}

.service-details-content table td {
    color: #555555;
}


/* =========================================================
   IMAGES - OPTIONAL
========================================================= */

.service-details-content img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 20px auto;
    border-radius: 6px;
}


/* =========================================================
   CONTACT SECTION
========================================================= */

.service-details-contact {
    width: 100%;
    padding: 20px 0 80px;
    background: #ffffff;
}

.service-details-contact .container {
    width: 100%;
}

.service-contact-box {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 45px 40px;
    text-align: center;

    border-radius: 12px;

   background: -webkit-linear-gradient(-45deg, #4FC3F7 0%, #1565C0 55%, #455A64 100%);
background: linear-gradient(-45deg, #4FC3F7 0%, #1565C0 55%, #455A64 100%);

    box-shadow: 0 8px 30px rgba(122, 45, 158, 0.15);
}

.service-contact-box h2 {
    margin: 0 0 12px;
    padding: 0;
    color: #ffffff;
    font-size: 28px;
    line-height: 1.4;
    font-weight: 700;
}

.service-contact-box p {
    margin: 0 0 25px;
    padding: 0;
    color: #ffffff;
    font-size: 16px;
    line-height: 1.7;
}


/* =========================================================
   CONTACT BUTTONS
========================================================= */

.service-contact-buttons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    flex-wrap: wrap;
}

.service-contact-buttons .theme-btn,
.service-contact-buttons .theme-btn-two {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-width: 130px;
    min-height: 48px;
    padding: 12px 25px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    transition: all 0.3s ease;
}

.service-contact-buttons .theme-btn {
    color: #ffffff;
    background: #222222;
}

.service-contact-buttons .theme-btn:hover {
    color: #ffffff;
    background: #111111;
}

.service-contact-buttons .theme-btn-two {
    color: #222222;
    background: #ffffff;
}

.service-contact-buttons .theme-btn-two:hover {
    color: #222222;
    background: #f2f2f2;
}


/* =========================================================
   RESPONSIVE - TABLET
========================================================= */

@media only screen and (max-width: 991px) {

    .service-details-breadcrumb {
        padding: 70px 0 55px;
    }

    .service-details-breadcrumb-content h1 {
        font-size: 34px;
    }

    .service-details-area {
        padding: 60px 0 55px;
    }

    .service-details-wrapper {
        max-width: 100%;
    }

    .service-details-content {
        padding: 35px 30px;
    }

    .service-contact-box {
        padding: 40px 30px;
    }

}


/* =========================================================
   RESPONSIVE - MOBILE
========================================================= */

@media only screen and (max-width: 767px) {

    .service-details-breadcrumb {
        padding: 50px 0 40px;
    }

    .service-details-breadcrumb-content h1 {
        font-size: 28px;
    }

    .service-details-breadcrumb-content .bread-crumb li {
        font-size: 14px;
    }

    .service-details-area {
        padding: 45px 0 45px;
    }

    .service-details-header {
        margin-bottom: 25px;
    }

    .service-details-tag {
        margin-bottom: 12px;
        padding: 6px 16px;
        font-size: 13px;
    }

    .service-details-header h2 {
        font-size: 27px;
    }

    .service-details-content {
        padding: 25px 20px;
        border-radius: 8px;
        font-size: 15px;
        line-height: 1.7;
    }

    .service-details-content p {
        font-size: 15px;
        line-height: 1.7;
    }

    .service-details-content h1 {
        font-size: 26px;
    }

    .service-details-content h2 {
        font-size: 24px;
    }

    .service-details-content h3 {
        font-size: 20px;
    }

    .service-details-content h4 {
        font-size: 18px;
    }

    .service-details-content ul,
    .service-details-content ol {
        padding-left: 22px;
    }

    .service-details-content ul li,
    .service-details-content ol li {
        font-size: 15px;
    }

    .service-details-contact {
        padding: 10px 0 50px;
    }

    .service-contact-box {
        padding: 35px 20px;
        border-radius: 10px;
    }

    .service-contact-box h2 {
        font-size: 23px;
    }

    .service-contact-box p {
        font-size: 15px;
    }

    .service-contact-buttons {
        flex-direction: column;
        width: 100%;
        gap: 12px;
    }

    .service-contact-buttons .theme-btn,
    .service-contact-buttons .theme-btn-two {
        width: 100%;
        max-width: 220px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media only screen and (max-width: 480px) {

    .service-details-breadcrumb {
        padding: 40px 0 30px;
    }

    .service-details-breadcrumb-content h1 {
        font-size: 25px;
    }

    .service-details-area {
        padding: 35px 0 35px;
    }

    .service-details-header h2 {
        font-size: 24px;
    }

    .service-details-content {
        padding: 22px 16px;
    }

    .service-contact-box {
        padding: 30px 16px;
    }

    .service-contact-box h2 {
        font-size: 21px;
    }

}