/* Logo Colors: 
    1. #1c446c - Dark Blue
    2. #2cd4cc - Bright Aqua
    3. #24446c - Light Blue Primary
    4. #20446c - Lignt Blue Secondary
    5. #246c6c - Teal Blue
    6. #2468a0 - Cobalt Blue
*/


* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: "Urbanist", serif;
    font-optical-sizing: auto;
}

.container {
    max-width: 1280px;
    padding: 0px 20px;
    /* margin: 5px auto; */
}

.font-light {
    font-weight: 300;
}

.font-normal {
    font-weight: 400;
}

.font-medium {
    font-weight: 500;
}

.font-bold {
    font-weight: 700;
}

.font-bolder {
    font-weight: 800;
}

.font-black {
    font-weight: 900;
}

.text-blue {
    color: #1c446c;
}

.pb-30 {
    padding-bottom: 30px;
}

.mb-30 {
    margin-bottom: 30px;
}

header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
    color: #000;
}

.logo {
    font-size: 24px;
}

.nav {
    /* flex-grow: 1; */
    text-align: center;
}

.menu {
    list-style: none;
    display: flex;
    justify-content: center;
    position: relative;
    margin-bottom: 0;
}

.menu li {
    position: relative;
    margin: 0 10px;
}

.menu a {
    color: #000;
    text-decoration: none;
    padding: 10px;
    letter-spacing: 0.5px;
}

.menu-item-has-children {
    position: relative;
}

.dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    list-style: none;
    z-index: 1000;
    width: max-content;
    background-color: #fffcfa;
    border-radius: 0.75rem;
    box-shadow: -3px 3px 4px #0000000a, -2px 2px 3px #0000001f, -1px 1px 2px #00000024;
    margin: 16px 0;
    border: 1px solid black;
    opacity: 0; /* Start hidden */
    padding: 18px 0px;
}

.arrow {
    margin-left: 5px;
    transition: transform 0.3s;
}

.dropdown li {
    margin: 12px 15px 10px 16px;
}

.dropdown a {
    padding: 4px 20px;
    display: block;
    text-align: left;
}

.menu .main-menu:hover a ,
.menu .main-menu:active a {
    color: #211c78 !important;
    font-weight: 600;
}

.main-menu a {
    position: relative;
    text-decoration: none;
    color: #000;
}

.webMenu.active a {
    color: #211c78;
    font-weight: 600;
}
  
.main-menu a:hover::after {
    transform: translateX(-50%) scaleX(1);
}

.webMenu.active a::after {
    /* content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 70%;
    height: 2px;
    background-color: #211c78;
    transform: translateX(-50%) scaleX(1); */
}
  
.main-menu a::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%) scaleX(0);
    width: 70%;
    height: 2px;
    background-color: #211c78;
    transition: transform 0.3s ease;
}


  

.dropdown li a:hover {
    color: #211c78;
    font-weight: 600;
}

.dropdown li a::after {
    content: "";
    width: 0;
    height: 2px;
    background-color: #211c78;
    position: absolute;
    left: 0%;
    top: 50%;
    transition: width 400ms cubic-bezier(0.25, 0.46, 0.45, 0.5), opacity 400ms cubic-bezier(0.25, 0.46, 0.45, 0.5);
    opacity: 0; 
}
.dropdown li.active a::before {
    content: "";
    width: 10px;
    height: 2px;
    background-color: #211c78;
    position: absolute;
    left: 0%;
    top: 50%;
}
.mb-dropdown {
    color: #000;
    text-decoration: none;
}

.dropdown li:hover > a::after {
    opacity: 1;
    width: 10px;
}

.icon {
    font-size: 24px;
}

.menu-container {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 10px;
    position: relative;
}

.menu-toggle {
    cursor: pointer;
    font-size: 24px;
    z-index: 10;
    margin-right: 10px;
}

.user-icon {
    font-size: 24px;
    cursor: pointer;
    display: none;
}

.menu-item a {
    color: #000;
    text-decoration: none;
}

.mobile-menu {
    position: fixed;
    top: 0;
    right: -280px; /* Start off-screen on the right */
    width: 280px;
    height: 100%;
    background-color: white;
    color: black;
    box-shadow: -2px 0 5px rgba(0, 0, 0, 0.5);
    z-index: 5;
    display: flex;
    flex-direction: column;
    padding: 20px;
}

.menu-item {
    padding: 15px;
    cursor: pointer;
    opacity: 0;
    transform: translateY(-20px);
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-right: 15px;
}

.mobile-menu .menu-item a {
    position: relative;
    text-decoration: none;
}

.mobile-menu .menu-item a:hover {
    color: #093E8E;
    font-weight: 600;
}

.mobile-menu .menu-item a::after {
    content: "";
    position: absolute;
    top: 49%;
    right: 97%;
    transform: translateX(-50%) scaleX(0);
    width: 25%;
    height: 2px;
    background-color: #000;
    transition: transform 0.3s ease;
}

.mobile-menu .menu-item .mb-menu:hover::after {
    transform: translateX(-50%) scaleX(1);
}


.mobiledropdown-item {
    position: relative;
    padding-left: 20px; /* Add space for the line */
    color: #000; /* Default text color */
    transition: color 0.3s ease; /* Smooth color transition */
}

.mobiledropdown-item::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%; /* Full height of the item */
    width: 4px; /* Thickness of the line */
    background-color: transparent; /* Invisible by default */
    transition: background-color 0.3s ease; /* Smooth color transition */
}

.mobiledropdown-item:hover {
    color: #093E8E; /* Change text color on hover */
    font-weight: 600;
}

.mobiledropdown-item:hover::before {
    background-color: #093E8E; /* Change line color on hover */
}



.menu-item i {
    transition: transform 0.3s ease;
}

.menu-item.open i {
    transform: rotate(180deg); /* Up arrow */
}

.mobiledropdown {
    display: none;
    background-color: #f9f9f9;
    margin-top: 10px;
    padding: 10px;
}

/* On click, show the dropdown */
.menu-item.open .mobiledropdown {
    /* display: block; */
}

.mobiledropdown-item {
    padding: 10px;
    cursor: pointer;
    opacity: 1; /* Start hidden for animation */
    transform: translateY(-10px); /* Start slightly above */
}

@media (min-width: 1023px) {
    .menu-toggle {
        display: none;
    }

    .user-icon {
        display: block;
    }
    .mobile-menu {
        display: none;
    }
}

@media (max-width: 1023px) {
    .menu {
        display: none;
        flex-direction: column;
        width: 100%;
        position: absolute;
        top: 60px;
        left: 0;
        background-color: #333;
    }
}

@media (max-width: 768px) {
    
    .menu.active {
        display: flex;
    }

    .fa-user {
        display: none;
    }
}


/* --------------------- Newsletter -------------------- */
.subscribeNewsletter {
    width: 100%;
    background-color: #1E4256;
    overflow: hidden;
    border-bottom: 1px solid white;
    /* background-image: url(../images/background/ourStackBg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center; */
}
.subscribeNewsletterContent {
    margin-top: 4em;
    margin-bottom: 4em;
}

.subscribeNewsletter .container {
    margin: 4% auto;
    padding: 0 1rem;
    text-align: center;
}

.subscribeNewsletter h2 {
    color: white;
    font-size: 2.5rem;
    margin: 0 0 30px 0;
}

.subscribeNewsletter .form {
    background: transparent;
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 320px;
    text-align: center;
}

.subscribeNewsletter .form__label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    border: 0;
    clip: rect(0, 0, 0, 0);
}

.subscribeNewsletter .form__input {
    position: relative;
    top: 0px;
    padding: 0.4rem;
    border-radius: 9px;
    transform: scaleX(0);
    visibility: hidden;
    width: 341px;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.9;
    border-color: transparent;
    outline: none;
}

.subscribeNewsletter .form__input:focus {
    /* box-shadow: 1px 1px 3px #8bc34a inset; */
}

.subscribeNewsletter .form__button {
    text-align: center;
    border-radius: 4px;
    background-color: transparent;
    border: none;
    outline: none;
}

.subscribeNewsletter .form__send-button {
    padding: 6px 15px;
    position: absolute;
    top: 51%;
    right: -8px;
    transform: translateY(-49%);
    font-size: 15px;
    font-weight: 500;
    background-color: lighten(#8bc34a, 5);
    color: #fff;
    cursor: pointer;
    transition: all 0.2s;
    visibility: hidden;
    background: #28a745
}

.subscribeNewsletter .form__send-button:hover,
.subscribeNewsletter .form__send-button:focus {
    background-color: #8bc34a;
    color: white;
}

.subscribeNewsletter .form__outer-button {
    position: absolute;
    top: 60%;
    left: 50%;
    transform: translate(-50%, -60%);
    width: 55%;
    padding: 0.5rem;
    font-size: 1.3rem;
    font-weight: 700;
    background-color: white;
    color: #093E8E;
    cursor: pointer;
    box-shadow: 1px 3px 0px rgba(0, 0, 0, 0.5);
    transition: color 0.2s;
}

.subscribeNewsletter .form__outer-button:hover,
.subscribeNewsletter .form__outer-button:focus {
    color: darken(#8bc34a, 10);
}

.subscribeNewsletter .form__thank-you-label {
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    padding: 0.7rem;
    text-align: center;
    font-size: 1.5rem;
    font-weight: 800;
    border-radius: 25px;
    background-color: white;
    color: #8bc34a;
    visibility: hidden;
}

.subscribeNewsletter .form__error-label {
    position: absolute;
    width: 100%;
    text-align: left;
    font-size: 18px;
    font-weight: 800;
    color: #ff0000;
    visibility: hidden;
    margin-top: 10px;
}
@media (max-width: 768px) {
    .subscribeNewsletter .container {
        margin: 8% auto !important;
    }
}
/* -------------------- Footer --------------------------*/
.footer {
    /* background-image: url('.images/footer-bg.webp'); */
    color: #4c5166;
    padding: 45px 15px 0 15px;
    background: #1E4256;
    /* background-image: url('../images/footer-bg.webp'); */
    background-repeat: no-repeat; /* Prevent repeating the image */
    background-size: cover; /* Scale the image to cover the entire container */
    background-position: center; /* Center the image */
    width: 100%; /* Full width */
    /* height: 400px; */
}
.footer .container {
    margin-bottom: 0;
}
.footer-content {
    margin-bottom: 45px;
}
.footer-text {
    font-size: 17px;
    color: rgb(236, 236, 236);
    font-weight: 600;
    line-height: 28px;
    margin-top: 20px;
}
.hidden {
    display: none;
}
.footer-row {
    display: flex;
    flex-wrap: wrap;
    /* gap: 30px; */
}
.footer-column {
    flex: 1;
    min-width: 250px;
}
.footer-logo {
    margin: auto;
}
.footer-about,
.footer-links,
.footer-contact {
    margin-bottom: 30px;
}
.footer-about h3,
.footer-links h3,
.footer-contact h3 {
    font-size: 30px;
    color: rgb(255, 255, 255);
    font-weight: 800;
    line-height: 1.2;
    margin-top: 37px;
    margin-bottom: 27px;
}
.footer-links a,
.footer-links p {
    margin-bottom: 10px;
    display: block;
    color: rgb(203, 203, 203);
    text-decoration: none;
    transition: 0.3s;
    font-size: 17px;
}
.footer-links a:hover {
    color: rgb(236, 236, 236);
    font-weight: 600;
    font-size: 15px;
}
.footer-links a:hover {
    font-weight: 600;
}
.footer-menu {
    text-align: center;
    padding: 10px 0;
    border-top: 1px solid rgba(255, 255, 255);
    border-bottom: 1px solid rgba(255, 255, 255);
}
.f-menu a {
    margin: 0 15px;
    color: rgb(203, 203, 203);
    text-transform: capitalize;
}
.f-menu a:hover {
    color: #fff;
    font-weight: 600;
    text-decoration: none;
}
.footer-copyright {
    text-align: center;
    /* padding: 30px 15px; */
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.footer-copyright p {
    margin: 0;
    padding-top: 7px;
}
.footer-copyright a {
    color: rgb(203, 203, 203);
    text-decoration: none;
    font-weight: 500;
}
.copyright-content {
    color: rgb(203, 203, 203);
}
.footer-copyright a:hover {
    color: #fff;
}
.social {
    display: flex;
    align-items: center;
    justify-content: center;
    justify-self: center;
    gap: 10px;
}
.social-icon {
    width: 50px;
    min-width: 50px;
    height: 50px;
    min-height: 50px;
    border-radius: 50%;
    background-color: var(--btn-social-bg-color);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.social-icon .icon {
    transition: transform 0.3s ease, color 0.3s ease;
    position: relative;
    z-index: 1;
}
.social img {
    width: 26px;
    height: 26px;
}
@media (max-width: 768px) {
    .footer-row {
      flex-direction: column;
    }
}
@media (max-width: 1023px) {
    .footer-column {
        padding: 0px 20px;
    }
}
@media (min-width: 1441px) {
    .footer-column-2 {
        margin-left: 50px;
    }
    .footer-row {
        gap: 30px;
    }
}


/* Intro Banner */
.introBanner {
    background: linear-gradient(4deg, rgba(59, 130, 246, 0.00) 12.42%, rgba(59, 130, 246, 0.10) 63.32%), #FFF;
}
.introBannerRow {
    max-width: 1245px;
    margin: 0 auto;
    padding: 16px 15px 50px 15px;
    display: flex;
    align-items: center;
    gap: 25px;
}
.introBannerCols {
    margin-top: 32px;
}
.introBannerTagline {
    padding: 8px 16px;
    color: #093E8E;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: 0.32px;
    width: fit-content;
    margin-bottom: 24px;
    text-transform: uppercase;
    border-radius: 29px;
    background: #FFF;
}
.introBannerTitle {
    color: #101012;
    font-size: 54px;
    font-weight: 700;
    line-height: 68px;
    margin-bottom: 16px;
    letter-spacing: 1px;
}

.introBannerTitle #heroTextAnim {
    color: #093E8E;
    font-size: 54px;
    font-weight: 700;
    line-height: 68px;
    margin-bottom: 16px;
    letter-spacing: 1px;
    position: relative;
    overflow: hidden;
    background: linear-gradient(90deg, #093E8E, #093E8E, #093E8E);
    background-repeat: no-repeat;
    background-size: 80%;
    animation: animate 3s linear infinite;
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgba(255, 255, 255, 0);
}

@keyframes animate {
    0% {
      background-position: -500%;
    }
    100% {
      background-position: 500%;
    }
}

.introBannerContent {
    color: #101012;
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
    max-width: 560px;
}


@media (max-width: 321px) {
    .introBannerTitle #heroTextAnim {
        font-size: 44px;
    }
}

@media (max-width: 950px) {
    .introBannerRow {       
        display: block;
    }
    .introBannerImage {
        width: 85vw;
    }
}

@media (max-width: 665px) {
    .introBannerTitle,
    .introBannerTitle #heroTextAnim {
        line-height: 56px;
        font-size: 40px;
    }
    .container {
        margin: 5px auto;
    }
    .subscribeNewsletter h2 {
        font-size: 30px;
    }
}
@media (min-width: 1023px) {
    .introBannerCols {
        max-width: 654px;
        width: 654px;
    }
}


/* Button Animation */

.getInTouch {
    display: inline-block;
    color: #000;
    min-width: 154px;
    text-decoration: none;
    margin-right: 50px;
    padding: 20px;
    position: relative;
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    letter-spacing: -0.2px
}
.getInTouch:active {
    border: 1px solid #fff !important;
}
.getInTouch:hover .button-stroke:nth-child(2) {
    stroke-dashoffset: 0;
}
.getInTouch .button-stroke {
    display: block;
    width: calc(100% - 40px);
    height: 20px;
    stroke: #2ed3c7;
    position: absolute;
    left: 20px;
    bottom: -10px;
    stroke-width: 4;
}
.getInTouch .button-stroke:nth-child(2) {
    stroke-dasharray: 650px;
    stroke-dashoffset: 650px;
    stroke: #093E8E;
    stroke-width: 5;
    transition: stroke-dashoffset 800ms ease-out;
}
  

/* Why Choose Us */
.whyChooseUs {
    background-image: url('../images/background/why_choose_us.webp');
    padding: 30px 15px;
    /* background-image: linear-gradient(90deg, #5cc29329, #3477aa21); */
    padding: 15px;
    /* background: #1E4256; */
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width: 100%
    /* height: 400px; */
}
.choose_title {
    font-size: 40px;
    font-weight: 600;
    color: white;
}
.choose_text {
    /* margin: 64px 0; */
    /* margin-top: 64px; */
}
.choose_title .span-green-light {
    color: #2ed3c7;
}
.choose_content-item {
    border-left: 4px solid #2ed3c7;
    flex-flow: column;
    padding-left: 24px;
    display: flex;
}
.choose_content_title {
    color: white;
    font-size: 24px;
    font-weight: 600;
    line-height: 120%;
}
.choose_content_para {
    color: #fff;
    font-size: 18px;
    font-weight: 400;
}
.choose_content {
    gap: 15px;
    display: grid;
    margin: 40px 0;
}
.choose_section {
    margin-top: 4em;
    margin-bottom: 4em;
}

@media (min-width: 950px) {
    .choose_content {
        grid-column-gap: 80px;
        grid-row-gap: 80px;
        flex-flow: row;
        grid-template-rows: auto;
        grid-template-columns: 1fr 1fr 1fr;
        grid-auto-columns: 1fr;
        width: 100%;
        display: grid;
    }
    .choose_title {        
        max-width: 47%;
    }
}

/* Our Services */
.multiColorText {
    text-align: center;
    font-size: 48px;
    font-weight: 700;
    background: linear-gradient(181deg, #2ed3c7, #093E8E);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.ourServicesList {
    margin-top: 4em;
    margin-bottom: 4em;
}
.ourServiceTitle span {
    color: #093E8E;
}
.OurServicesPara {
    font-size: 18px;
    font-weight: 400;
}
.OurServicesPara {
    font-size: 18px;
    font-weight: 400;
    margin: 22px auto;
    text-align: center;
}
.ourServicesCard a {
    text-decoration: none;
}
.ourServicesCardTitle {
    font-size: 24px;
    font-weight: 600;
    line-height: 32px;
    color: #000;
}
.divide {
    /* background-color: #2ed3c7; */
    height: 2px;
    margin: 8px 0;
    width: 54px;
    background-color: #006B94;
}
.divide2 {
    height: 2px;
    margin: 8px 0;
    width: 12%;
    background-color: #006B94;
    display: block;
    margin: auto;
}
.divide3 {
    height: 4px;
    margin: 8px 0;
    width: 21%;
    background-color: #000000;
    display: block;
    margin: 20px auto;
}
.ourServicesCardPara {
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    color: #000;
    display: -webkit-box;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    overflow: hidden;
    margin: 8px 0;
}
.ourServicesCard {
    background-color: #f7f7f7;
    border: 1px solid #e5e5e5;
    border-radius: 12px;
    padding: 32px;
}
.ourServicesCards a:hover .ourServicesCard {
    background: linear-gradient(181deg, #2ed3c7, #093E8E);
}
.ourServicesCards a:hover .ourServicesCard .ourServicesCardTitle,
.ourServicesCards a:hover .ourServicesCardPara,
.ourServicesCards a:hover .read-more-link {
    color: white;
}
.ourServicesCards a:hover .ourServicesCard .divide {
    background-color: #fff;
}

@media (max-width: 665px) {
    .multiColorText {
        font-size: 38px;
    }
    .OurServicesPara {
        /* max-width: 82vw; */
    }
    .digitalTransformation h1 {
        font-size: 28px !important;
        /* margin-top: 45px !important; */
    }
    .choose_section {
        /* margin-top: -30px; */
    }
    .choose_title {
        font-size: 30px;
        padding-bottom: 18px;
    }
    .ourTechTitle {
        font-size: 35px !important;
    }
    .subscribeNewsletter .form__outer-button {
        width: 50%;
        padding: 5px;
    }
    .subscribeNewsletter .form__input {
        width: 340px;
    }
    .subscribeNewsletter .form__send-button {
        width: 60px;
    }
    .subscribeNewsletter .form__send-button{ 
        padding: 8px;
        position: absolute;
        top: 51%;
        right: 0px;
        width: 60px;
    }
    .subscribeNewsletter .form__input {
        position: relative;
        top: 0px;
        padding: 10px;
        border-radius: 9px;        
        width: 330px;
        font-size: 17px;
        font-weight: 700;
        line-height: 1.9;
        border-color: transparent;
        outline: none;
    }
}
@media (min-width: 665px) {
    .OurServicesPara {
        max-width: 60vw;
    }
   
}
@media (max-width: 1023px) {
    .ourServicesCard {
        margin: 20px;
    }
}
@media (min-width: 1023px) {
    .ourServicesCards {
        margin: 16px 5px;
    }   
}
.ourServicesCard {
    height: 232px;
    max-height: 232px;
}
/* @media (min-width: 1441px) {
    .ourServicesCard {
        height: 232px;
        max-height: 232px;
        width: 349px;
        max-width: 349px;
    }
} */
/* Our Tech Stack */
.ourTechStack {
    background: linear-gradient(4deg, rgba(59, 130, 246, 0.00) 12.42%, rgba(59, 130, 246, 0.10) 63.32%), #FFF;
}
.ourTechStackContent {
    padding-top: 4em;
    padding-bottom: 4em;
}
.ourTechStackTitle {
    text-align: center;
    
}
.ourTechAnimate {
    display: flex;
}
.ourTechTitle {
    display: flex;
    margin: auto;
    padding: 0 1rem 1rem;
    position: relative;
    font-size: 45px;
    font-weight: 700;
    line-height: 110%;
    text-align: center;
}
.ourTechTitle:before {
    content: "";
    width: 70%;
    background: #000000;
    opacity: 0.8;
    bottom: 0;
    height: 2px;
    left: 60px;
    position: absolute;
}
.ourTechTitle .letter {
    display: inline-block;
    opacity: 0;
    transform: scale(0.9);
}
.ourTechStack .row {
    margin: 0 auto;
    /* padding: 16px 15px 50px 15px; */
    padding: 15px;
}
.ourTechStackIcons {
    /* border: 1px solid #000;
    border-radius: 4px; */
}
.ourTechStack .row h3 {
    font-size: 20px;
    line-height: 1.6;
    font-weight: 400;
    letter-spacing: 0.00735em;
    margin: 10px 0;
    font-weight: 600;
}
.ourTechStack .row p {
    font-weight: 400;
    letter-spacing: 0.00938em;
    font-size: 1rem;
    line-height: 1.625rem;
    min-height: 24px;
}
.techLogoPics {
    /* height: auto;
    max-width: 80%; */
    border-radius: 15px;
}
.ourTechStackCard .ourTechStackBg {
    background: #fff;
    padding: 35px;
    border-radius: 10px;
}

.read-more-link {
    text-decoration: none;
    color: #000; /* Black color for text */
    font-weight: 400;
    display: inline-flex;
    align-items: center;
    font-size: 16px;
    transition: color 0.2s ease;
}

  .read-more-link:hover {
    color: #000; /* Optional: Change color on hover */
    font-weight: 600;
    text-decoration: underline;
  }

.read-more-link .arrow {
    position: relative;
    display: inline-block;
    margin-left: 5px; /* Spacing between text and arrow */
    width: 1em;
    height: 1em;
}

.read-more-link .arrow::before, .read-more-link .arrow::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    display: inline-block;
    text-align: center;
    line-height: 1em;
    opacity: 0;
    transform: scale(0.9);
    transition: opacity 0.3s ease, transform 0.3s ease;
  }

  .read-more-link .arrow::before {
    content: "\f105"; /* Right arrow (default state) */
    opacity: 1; /* Visible initially */
    transform: scale(1); /* No scaling */
  }

  .ourServicesCards a:hover .arrow::before {
    opacity: 0; /* Fade out */
    transform: scale(1.1); /* Slight zoom out */
  }

  .read-more-link .arrow::after {
    content: "\f061"; /* Forward arrow (hover state) */
    opacity: 0; /* Hidden initially */
    transform: scale(0.9); /* Slight zoom in */
  }

  .ourServicesCards a:hover .arrow::after {
    opacity: 1; /* Fade in */
    transform: scale(1); /* Normal size */
  }
@media (max-width: 700px) {
	.tabs {
		/* transform: scale(0.6); */
	}
}

@media screen and (max-width: 767px) {
    .ourTechTabs {
        grid-column-gap: 0px;
        grid-row-gap: 0px;
        margin-top: 32px;
    }
}


/* Digital Transformattion */
.digitalTransformation {
    text-align: center;
}
.digitalTransformationContent {
    padding-top: 4em;
    padding-bottom: 4em;
    margin-bottom: 4em !important;
}

.digitalTransformation h1 {
    opacity: 0;
    transform: translateY(-50px);
    font-size: 2.5em;
    color: #2c3e50;
    position: relative;
    display: inline-block;
    /* margin: 0 0 30px 0; */
    margin-bottom: 35px;
}
/* Initial border bottom */
.digitalTransformation h1::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 100%;
    height: 4px;
    background-color: #093E8E;
    transform: scaleX(0);
    transform-origin: bottom right;
    transition: transform 0.6s ease;
}
/* Wave animation for the border */
@keyframes wave {
    0% {
      transform: scaleX(0);
    }
    50% {
      transform: scaleX(1);
      transform-origin: center;
    }
    100% {
      transform: scaleX(0);
    }
  }

/* Apply wave animation */
.wave-border::after {
    animation: wave 2s infinite ease-in-out;
}
.digitalTransformation .digitalTransformationContent {
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    background-color: #F4F6FA; /* Light gray background */
}

.point {
    position: relative;
    font-size: 20px;
    color: #000; /* White text for contrast */
    text-align: center;
    padding: 15px 25px;
    width: 240px;
    margin: 15px 0;
    opacity: 0; /* Hidden initially */
    border-radius: 8px;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1);
  }

  /* First Point - Soft Gradient 1 */
  .point.left {
    background: linear-gradient(135deg, #D4E9FB, #B0C9E0);
  }

  .point.left::before {
    content: '';
    position: absolute;
    top: 50%;
    left: -20px;
    margin-top: -10px;
    border-style: solid;
    border-width: 10px 20px 10px 0;
    border-color: transparent #D4E9FB transparent transparent;
  }

  /* Second Point - Soft Gradient 2 */
  .point.right {
    background: linear-gradient(135deg, #B9D3C2, #D9E8D8);
  }

  .point.right::before {
    content: '';
    position: absolute;
    top: 50%;
    right: -20px;
    margin-top: -10px;
    border-style: solid;
    border-width: 10px 0 10px 20px;
    border-color: transparent transparent transparent #B9D3C2;
  }

  /* Third Point - Soft Gradient 3 */
  .point.third {
    background: linear-gradient(135deg, #F1D3D3, #F7C6C6);
  }

  .point.third::before {
    content: '';
    position: absolute;
    top: 50%;
    left: -20px;
    margin-top: -10px;
    border-style: solid;
    border-width: 10px 20px 10px 0;
    border-color: transparent #F1D3D3 transparent transparent;
  }

  /* Fourth Point - Soft Gradient 4 */
  .point.fourth {
    background: linear-gradient(135deg, #E0C9F7, #D1B8F7);
  }

  .point.fourth::before {
    content: '';
    position: absolute;
    top: 50%;
    right: -20px;
    margin-top: -10px;
    border-style: solid;
    border-width: 10px 0 10px 20px;
    border-color: transparent #E0C9F7 transparent;
  }

  /* Fifth Point - Soft Gradient 5 */
  .point.fifth {
    background: linear-gradient(135deg, #F5E1A4, #F1D77A);
  }

  .point.fifth::before {
    content: '';
    position: absolute;
    top: 50%;
    left: -20px;
    margin-top: -10px;
    border-style: solid;
    border-width: 10px 20px 10px 0;
    border-color: transparent #F5E1A4 transparent transparent;
  }

  /* Sixth Point - Soft Gradient 6 */
  .point.sixth {
    background: linear-gradient(135deg, #D8E2D8, #B6C2A1);
  }

  .point.sixth::before {
    content: '';
    position: absolute;
    top: 50%;
    right: -20px;
    margin-top: -10px;
    border-style: solid;
    border-width: 10px 0 10px 20px;
    border-color: transparent #D8E2D8 transparent;
  }

  /* Seventh Point - Soft Gradient 7 */
  .point.seventh {
    background: linear-gradient(135deg, #C9D6E3, #A6B9C4);
  }

  .point.seventh::before {
    content: '';
    position: absolute;
    top: 50%;
    left: -20px;
    margin-top: -10px;
    border-style: solid;
    border-width: 10px 20px 10px 0;
    border-color: transparent #C9D6E3 transparent transparent;
}
@media (min-width: 665px) {
    .point.seventh,
    .point.sixth,
    .point.fifth,
    .point.fourth,
    .point.third,
    .point.right,
    .point.left  {
        width: 42%;
    }
}

/* Testimonial */
.testimonial .testiContainer {
    max-width: 84rem;
    margin-left: auto;
    margin-right: auto;
    padding-left: 7.5vw;
    padding-right: 7.5vw;
    position: relative;
}
.testimonialContent  {
    margin-top: 4em;
    margin-bottom: 4em;
}
.testiContainer h2 {
    margin-bottom: 32px;
    font-size: 40px;
    font-weight: 500;
    line-height: 1.2;
}
.testimonial-slider-component {
    /* background-color: #f7e1d2; */
    background: #1e426c;
    background-image: url('../images/background/testimonial_scribble1.svg'), url('../images/background/testimonial_scribble2.svg');
    background-position: 104% 0, 0 0;
    background-repeat: no-repeat, no-repeat;
    background-size: auto, auto;
    border-radius: 20px;
    padding-top: 40px;
    padding-bottom: 40px;
    position: relative;
}
.testiContainer .swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
    box-sizing: content-box;
}
.swiper-slide.testimonial-slide.w-dyn-item.swiper-slide-duplicate.swiper-slide-prev {
    flex: none;
    align-self: center;
    width: 100%;
    /* height: auto; */
    height: 45px;
    padding: 1.5rem 3.5rem;
}
.testional-slide-inner {
    text-align: center;
    max-width: 45rem;
    margin-left: auto;
    margin-right: auto;
}
.testimonial-slider-quote {
    margin-bottom: 40px;
    font-weight: 400;
    color: #fff;
}
blockquote {
    border-left: 0 #0000;
    margin-bottom: 1rem;
    padding: 0;
    font-size: 22px;
    font-style: italic;
    font-weight: 300;
    line-height: 1.5;
}
.heading-6 {
    letter-spacing: 0;
    text-transform: none;
    margin-bottom: 16px;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
    white-space: normal;
    margin-bottom: 0;
    color: #fff;
}
.paragraph-small {
    text-transform: none;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.7;
    color: #ffffff;
    margin: 0 17px;
}
.testimonial-slider-controls {
    z-index: 2;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding-left: 56px;
    padding-right: 56px;
    display: flex;
    margin-top: 33px;
}
.swiper-pagination-wrapper {
    grid-column-gap: .5rem;
    grid-row-gap: .25rem;
    flex-wrap: wrap;
    flex: none;
    justify-content: center;
    align-items: center;
    display: flex;
    position: relative;
    transform: translateY(8px);
}
.pagination-dot.is--active {
    background-color: #0c3a23;
}
.pagination-dot {
    background-color: #bfc1b9;
    cursor: pointer;
    border-radius: 50%;
    flex: none;
    width: .5rem;
    height: .5rem;
    transition: background-color .3s;
}
.pagination-dot.is--active {
    background-color: #000;
}
.testimonial-line {
    background-color: #bfc1b9;
    flex: 1;
    height: 1px;
    margin-left: 3.5rem;
    margin-right: 3.5rem;
}
.slider-button-wrapper {
    display: flex;
}
.slider-button {
    background-color: #ffffff;
    color: #000000;
    cursor: pointer;
    border-top-left-radius: 48px;
    border-bottom-left-radius: 48px;
    justify-content: center;
    align-items: center;
    height: 2.5rem;
    margin-left: 0;
    margin-right: 0;
    padding: .53125rem .875rem .59375rem 1.375rem;
    transition: all .5s;
    display: flex;
}
.slider-button:hover {
    color: white;
    background: black;
}
.slider-button.next-slide {
    border-radius: 0 48px 48px 0;
    padding-left: .875rem;
    padding-right: 1.375rem;
}
@media (max-width: 665px) {
    .testiContainer h2 {
        font-size: 33px;
    }
    }
@media only screen and (min-width: 992px) {
    .testimonial-slider-component .swiper-pagination-bullets.swiper-pagination-horizontal {
        width: auto;
    }
}
@media screen and (max-width: 1023px) {
    .testimonial-line {
        display: none;
    }
    .hide-on-mobile {
        display: none;
    }
    .testimonial-slider-controls {
        justify-content: center;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    blockquote {
        font-size: 1.25rem;
    }
    .testimonial-slider-component {
        background-image: url('../images/background/mbtestimonial_scribble1.svg'), url('../images/background/mbtestimonial_scribble2.svg');
        background-position: 100% 100%, 0 100%;
        background-repeat: no-repeat, no-repeat;
        background-size: auto, auto;
        padding-top: 3.5rem;
        padding-bottom: 3.5rem;
    }
}


/* Our Customized Approach */
.ourCustomizedApproach {
    background-position: revert-layer;
    background-repeat: no-repeat, no-repeat;
    background-size: auto, auto;
    background-color: #f8fcff;
}
.ourCustomizedApproachTwoColumn {
    grid-column-gap: 7.5vw;
    grid-row-gap: 3.5rem;
    display: flex;
    padding-top: 4em;
    /* padding-bottom: 4em; */
}
.ourCustomizedApproach h2 {
    font-size: 2.5rem;
    line-height: 3.125rem;
    font-weight: 600;
    text-align: center;
}
.ourCustomizedApproachcontent {
    padding-top: 4em;
    padding-bottom: 4em;
}
.ocrtabs p {
    font-size: 1.125rem;
    line-height: 1.75rem;
}

.ocrcolumn1,
.ocrcolumn2 {
    flex: 1;
}
.ocrcolumn1 div {
    flex: 1;
    max-width: 32.5rem;
    margin-left: auto;
    margin-right: auto;
}
.ocrcolumn1 div h2 {
    font-size: 3.75rem;
    font-weight: 600;
    line-height: 1.2;
    transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg); 
    transform-style: preserve-3d; 
    opacity: 1;
    margin-top: 0;
    margin-bottom: 1rem;
}
.ocrcolumn1 div p {
    opacity: 1; 
    transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg); 
    transform-style: preserve-3d;
    font-size: 1.25rem;
    line-height: 1.6;
}
.ocrcolumn2 .ocrtabs h3 {
    margin-bottom: 1.5rem;
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 1.5;
}
.ocrtabs .step-tabs {
    flex-direction: column;
    display: flex;
}
.ocrtabs .steps-tabs-menu {
    grid-column-gap: .5rem;
    margin-bottom: 2.5rem;
    display: flex;
}
.ocrtabs .steps-tab-link.primary {
    background-color: #fff;    
}
.steps-tab-link {
    background-color: #fffcfa33;
    box-shadow: -3px 3px 6px #00000012, -2px 2px 4px #00000012, -1px 1px 2px #00000012;
    border-radius: 2rem;
    flex: 1;
    justify-content: center;
    align-items: center;
    padding: .25rem 1rem .25rem 1em;
    font-size: 1rem;
    line-height: 1.7;
    display: flex;
    color: #222;
    text-decoration: none;
}
.steps-tab-pane-block {
    grid-column-gap: 1.5rem;
    align-items: flex-start;
    padding-bottom: 1.25rem;
    display: flex;
    position: relative;
}
.steps-tab-marker {
    z-index: 5;
    background-color: #fff;
    border-radius: 400px;
    flex: none;
    justify-content: center;
    align-items: center;
    width: 2rem;
    height: 2rem;
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.4;
    display: flex;
    position: relative;
    border: 1px solid black;
}


.tabs-container {
    width: 100%;
    max-width: 700px;
    height: auto; /* Make the height flexible */
    /* background-color: white;
    border-radius: 20px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15); */
    overflow: hidden;
    position: relative;
}
  
  
.tab-links {
    display: flex;
    margin-bottom: 1.5rem;
    gap: 25px;
    /* justify-content: space-between; */
    /* border-bottom: 1px solid #f0f0f0; */
}
  
.tab-link {
    background: none;
    border: none;
    color: #564e4e;
    cursor: pointer;
    position: relative;
    transition: color 0.3s ease;
    border-radius: 2rem;
    padding: .30rem 1rem .30rem 1em;
    font-size: 1rem;
    line-height: 1.7;
    display: flex;
    flex: 1;
    vertical-align: middle;
    justify-content: center;
    align-items: center;
    background-color: #fffcfa33;
    box-shadow: -3px 3px 6px #00000012, -2px 2px 4px #00000012, -1px 1px 2px #00000012;
}
  
  .tab-link.active {
    background-color: #000;
    color: #fff;
    box-shadow: -3px 3px 6px #00000012, -2px 2px 4px #00000012, -1px 1px 2px #00000012;
  }

  .tab-link i {
    margin-right: 10px;
  }
  
  .tab-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 3px;
    bottom: -1px;
    left: 50%;
    /* background: linear-gradient(45deg, #006B94, #006B94); */
    transition: all 0.4s ease;
  }
  
  .tab-link.active::after {
    width: 100%;
    left: 0;
  }
  
  .tab-content {
    display: none;
    animation: fadeInUp 0.5s ease;
    padding: 5px 10px 15px 10px;
  }
  
  .tab-content p {
    margin: auto 0;
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
  .tab-content.active {
    display: block;
  }
  
  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translateY(20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  /* Buttons */
  /* .cta-btn {
    display: inline-block;
    padding: 12px 25px;
    background: linear-gradient(45deg, #006B94, #006B94);
    color: white;
    border: none;
    border-radius: 50px;
    cursor: pointer;
    transition: background 0.4s ease;
    font-weight: 500;
    margin-top: 20px;
  }
  
  .cta-btn:hover {
    background: linear-gradient(45deg, #006B94, #006B94);
  }
   */


/* Expert Strategy */
.expertStrategy {
    background-repeat: no-repeat, no-repeat;
    background-size: auto, auto;
    background-color: #F6FBFE;
}
.expertStrategyContent {
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.expertStrategyContent .title-inner span {
    color: #093E8E;
    font-weight: bold;
    font-size: 18px;
    text-transform: uppercase;
}

.expertStrategyContent .title-inner .title {
    font-weight: 600;
    line-height: 1.3em;
    color: #111111;
    font-size: 36px;
    padding: 18px 0;
}
.expertStrategyServices {
    margin: 20px 0;
    display: flex;
}
.icon--pulse {
    animation: 0.9s iconpulse linear infinite;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #E2E2E2;
    border-radius: 50% 50% 50% 50% !important;
    color: #368DF0 !important;
    min-width: 50px;
    height: 50px;
}
@keyframes iconpulse {
    0%, 100% { transform: scale(1); }
    25% { transform: scale(1.2); }
}

.expertStrategyServices .services-icon .strategyIcons {
    text-align: center;
    margin: 19% auto;
    display: block;
    width: 23px;
    height: 23px;
}
.expertStrategyServices .services-text {
    margin-left: 33px;
}
.expertStrategyServices .services-title .title {
    font-size: 22px;
    font-weight: 600;
    line-height: 30px;
    color: #111111;
}
.expertStrategyServices .services-title .services-txt {
    color: #666666;
}
.expertStrategyServices .services-txt {
    color: #666;
    max-width: 62%;
}
.expertStrategy .rs-animation-shape-image {
    position: relative;
}
.expertStrategy .rs-animation-shape-image .pattern {
    left: 2%;
    position: absolute;
    top: 75%;
}
.expertStrategy .rs-animation-shape-image .pattern .scale2 {
    animation: scale2 2s alternate infinite;
    /* -webkit-animation: scale2 2s alternate; */
}

@keyframes scale2 {
    0% {
        transform: scale(.8);
        -webkit-transform: scale(.8);
    }
    100% {
        transform: scale(1);
        -webkit-transform: scale(1);
    }
}


.expertStrategy .rs-animation-shape-image .shape {
    position: absolute;
    right: 6%;
    top: 15%;
}
.expertStrategy .rs-animation-shape-image .shape img {
    animation: dance 4s alternate infinite;
    /* -webkit-animation: scale2 2s alternate; */
}

@keyframes dance {
    0% {
        transform: translate3d(0, 0, 0);
        -webkit-transform: translate3d(0, 0, 0);
    }
    50% {
        transform: translate3d(15px, -15px, 0);
        -webkit-transform: translate3d(15px, -15px, 0);
    }
    100% {
        transform: translate3d(0, -15px, 15px);
        -webkit-transform: translate3d(0, -15px, 15px);
    }
}

.strategyImage {
    width: 98%;
    height: auto;
    margin-top: 61px;
}
@media (min-width: 665px) {
    .expertStrategyContent .title-inner .title {
        max-width: 78%;
    }
}
@media (max-width: 665px) {
    .rs-animation-shape-image .middle-image img {
        width: 93%;
    }
}






  /* Form Styles */
  .contact-form {
    display: flex;
    flex-direction: column;
  }
  
  .contact-form label {
    margin-bottom: 5px;
    font-weight: 500;
  }
  
  .contact-form input,
  .contact-form textarea {
    padding: 12px 15px; /* Increased padding for inputs */
    margin-bottom: 15px;
    border: 1px solid #ddd;
    border-radius: 10px;
    transition: border 0.3s ease;
  }
  
  .contact-form input:focus,
  .contact-form textarea:focus {
    border-color: #006B94;
    outline: none;
  }
  
  /* FAQ List */
  .faq-list {
    padding: 0;
    list-style: none;
  }
  
  .faq-list li {
    margin-bottom: 10px;
  }
  
  .faq-list li strong {
    font-weight: 600;
  }
  
  .view-details {
    border: 1px solid #0c3a23;
    background-color: #0c3a23;
    width: 100%;
    color: #FFFCFA;
    text-align: center;
    border-radius: 68px;
    justify-content: center;
    align-items: center;
    padding: .75rem 1.5rem;
    font-family: tenon, sans-serif;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.4;
    transition: color .2s, background-color .2s, border-color .2s;
    position: relative;
}
#viewDetails {
    margin: 45px 0;
    grid-column-gap: 2rem;
    background-color: #2b2c30;
    color: #FFFCFA;
    text-align: center;
    object-fit: fill;
    border-radius: 4.25rem;
    flex-direction: row;
    flex: 0 auto;
    order: 1;
    justify-content: space-between;
    align-items: center;
    padding: .5rem .5rem .5rem 1.5rem;
    font-family: ivypresto-headline, sans-serif;
    font-size: 1.215rem;
    font-weight: 500;
    line-height: 1.4;
    transition: all .5s;
    /* display: none; */
    position: relative;
    text-decoration: none;
}
#viewDetails:hover, #viewDetails:focus {
    border: 1px solid #000;
    background: none;
    color: #000;
}
.viewDetailsWrapper {
    background-color: #FFFCFA;
    color: #EE4B4A;
    border-radius: 48px;
    flex: none;
    justify-content: center;
    align-items: center;
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    overflow: hidden;
}
@media screen and (max-width: 767px) {
    blockquote {
        font-size: 16px;
        margin: 0 17px;
    }
}
  /* Responsive Design */
  @media screen and (max-width: 600px) {
    .tab-links {
      flex-direction: column;
      align-items: center;
    }
  
    .tab-link {
      text-align: center;
      width: 100%;
      padding: 15px 0;
    }
  }


  @media only screen and (min-width: 992px) {
    #viewDetails {
        display: inline-flex;
    }
  }

  @media screen and (max-width: 991px) {
    .ourCustomizedApproachTwoColumn {
        flex-direction: column;
    }
    #viewDetails {
        object-fit: fill;
        justify-content: space-between;
        transition: all .5s;
        display: flex;
        position: relative;
        width: 100%;
    }
    .ocrcolumn1 div h2 {
        font-size: 33px;
    }
}



/* About Page */
/* Intro Section */
.aboutIntro {
    background: linear-gradient(3.82deg, rgba(59, 130, 246, 0) 12.42%, rgba(59, 130, 246, 0.1) 63.32%);
}
.aboutIntroContent {
    padding-top: 4rem;
    padding-bottom: 4rem;
}
.aboutIntroColContent h1 {
    margin-bottom: 16px;
    color: #101012;
    font-size: 56px;
    font-weight: 700;
    line-height: 68px;
    letter-spacing: -1.12px;
    margin-top: -20px;
}
.aboutIntroColContent p {
    letter-spacing: 0.24px;
    color: #101012;
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 60px;
}
.aboutIntroButton {
    margin: 0;
    border-radius: 8px;
    background: #0063C1;
    width: fit-content;
    padding: 18px 32px;
    text-transform: none;
    box-sizing: border-box;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    letter-spacing: -0.2px;
    color: #fff;
    display: flex;
    align-items: center;
    text-decoration: none;
}
.aboutIntroColContent1 {
    margin-bottom: 76px;
    margin-top: 76px;
}
.aboutIntroColContentCol1 {
    margin: auto;
}

@media only screen and (max-width: 992px) {
   .aboutIntroColContentCol1 img {
        max-width: 90vw;
        display: block;
        margin: 45px 0 0 0;
   } 
   .aboutIntroColContent p {
        margin-bottom: 22px;
    }
}
@media only screen and (min-width: 992px) {
    .aboutIntroColContent img {
        max-width: 469px;
    } 
 }



/* About - Locations */
.aboutLocationsContent {
    margin: 0 auto;
    padding-bottom: 4rem;
    /* padding: 0px 15px 144px 15px; */
}
.aboutLocationsTitle h2 {
    color: #000000;
    margin-bottom: 16px;
    font-size: 44px;
    font-weight: 700;
    line-height: 56px;
}
.aboutLocationsTitle p {
    color: #2F3241;
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
}
.aboutLocationsTitle {
    margin-bottom: 56px;
}
.aboutLocationsAddress {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-column-gap: 20px;
    grid-row-gap: 20px;
}
.aboutLocationsAddressBox {
    border-radius: 24px;
    border: 1px solid #DBDDE0;
    background: #FFF;
    padding: 32px;
}
.aboutLocationsAddressCountry {
    display: flex;
    align-items: center;
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    margin-bottom: 8px;
}
.aboutLocationsAddressBox h2 {
    color: #101012;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
}
.aboutLocationsAddressCountryImage img {
    border-radius: 73%;
    margin-bottom: 5px;
}
.aboutLocationsAddresses {
    color: #101012;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 8px;
}
.aboutLocationsTel a {
    color: #2F3241;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
}
.aboutLocationsAddressCountryName h5 {
    color: #101012;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
}
@media screen and (max-width: 500px) {
    .aboutLocationsAddress {
        grid-template-columns: repeat(1, 1fr);
    }
}
@media screen and (max-width: 990px) {
    .aboutLocationsAddress {
        grid-template-columns: repeat(1, 1fr);
    }
}


/* Meet our team */
.aboutMeetOurTeamContent {
    padding-top: 3rem;
    padding-bottom: 3rem;
}
.aboutMeetOurTeamTitle h2 {
    color: #000000;
    margin-bottom: 16px;
    font-size: 44px;
    font-weight: 700;
    line-height: 56px;
    letter-spacing: -0.44px;
}
.aboutMeetOurTeamTitle p {
    color: #2F3241;
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
    max-width: 820px;
    margin: auto;
}
.aboutMeetOurTeamTitle {
    /* max-width: 820px; */
    margin-bottom: 56px;
}
.aboutMeetOurTeamGrid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-column-gap: 17px;
    grid-row-gap: 36px;
    text-align: center;
}
.aboutMeetOurTeamName {
    color: #101012;
    text-align: center;
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
    margin: 15px 0 0 0;
}
.aboutMeetOurTeamPost {
    color: #2F3241;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
}
.aboutOurTeamContentBox {
    border-radius: 24px;
    background: #EEF4FE;
    max-width: 247px;
    margin: 0 auto;
    height: 100%;
    padding: 40px 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.aboutOurTeamContent {
    color: #101012;
    text-align: center;
    font-size: 18px;
    font-style: italic;
    font-weight: 700;
    line-height: 24px;
}
.aboutOurTeamContent span {
    color: #0063C1;
}
.aboutOurTextSubText {
    color: #2F3241;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    letter-spacing: -0.12px;
}

@media screen and (max-width: 500px) {
    .aboutMeetOurTeamGrid {
        grid-template-columns: repeat(1, 1fr);
    }
}
@media screen and (min-width: 500px) and (max-width: 1023px) {
    .aboutMeetOurTeamGrid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (min-width: 1023px) {
    .aboutMeetOurTeamGrid {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* Our Core Values */
.ourCoreValuesContent {
    padding-top: 4rem;
    padding-bottom: 4rem;
}
.ourCoreValuesTitle {
    margin-bottom: 56px;
}
.ourCoreValuesTitle h2 {
    color: #000000;
    margin-bottom: 16px;
    font-size: 44px;
    font-weight: 700;
    line-height: 56px;
    letter-spacing: -0.44px;
}
.ourCoreValuesTitle p {
    color: #2F3241;
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
}
.ourCoreValuesPoints {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-column-gap: 17px;
    grid-row-gap: 17px;
    text-align: center;
}
.ourCoreValuesItems img {
    margin-bottom: 16px;
}
.ourCoreValuesItems p {
    color: #101012;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
}
.ourCoreValuesItems {
    padding: 15px;
}
@media screen and (max-width: 600px) {
    .ourCoreValuesPoints {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (min-width: 600px) and (max-width: 990px) {
    .ourCoreValuesPoints {
        grid-template-columns: repeat(3, 1fr);
    }
}


/* Our Customers */
.bg-dark-blue {
    background-color: #091924;
    color: #fff;
}
.ctaContent {
    padding-top: 4rem;
    padding-bottom: 4rem;
    grid-column-gap: 80px;
    grid-row-gap: 66px;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    display: flex;
    max-width: 1440px;
}
.ctaContent h3 {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 40px;
    font-weight: 600;
    line-height: 120%;
    text-align: center;
    color: #fff;
    max-width: 1440px;
    width: 1056px;
}
.span-green-light {
    color: #6ee7d4;
}
.ctaContent .wrapper-cta-btn {
    grid-column-gap: 35px;
    grid-row-gap: 35px;
    justify-content: space-between;
    display: flex;
}
.ctaContent .cta-btn {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    flex-flow: column;
    display: flex;
}
.ctaContent .wrapper-flex {
    justify-content: center;
    align-items: center;
    display: flex;
}
.ctaContent .cta-icon {
    margin-right: 24px;
}
.cta-btn-silver {
    color: #091924;
    cursor: pointer;
    background-color: #fff;
    border-radius: 50px;
    justify-content: center;
    align-items: center;
    min-width: 288px;
    max-width: 288px;
    height: 56px;
    min-height: 56px;
    font-weight: 500;
    line-height: 120%;
    text-decoration: none;
    display: flex;
    position: relative;
    overflow: hidden;
}
.ctaContent .cta-contact .btn-link:hover {
    color: white;
    text-decoration: none;
}
.ctaContent .cta-meeting .btn-link:hover {
    color: black;
    text-decoration: none;
}
.ctaContent .cta-btn-dark:hover {
    color: #fff !important;
    text-decoration: none;
}
.ctaContent .btn-link {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    justify-content: center;
    align-items: center;
    line-height: 120%;
    display: flex;
}
.ctaContent .btn-link-content-before, .ctaContent .btn-link-content-after {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    white-space: nowrap;
    justify-content: center;
    align-items: center;
    width: auto;
    display: flex;
    position: relative;
    inset: 0%;
}
.line-40px {
    background-color: #f0f0f0;
    width: 1px;
    min-width: 1px;
    max-width: 1px;
    height: 40px;
    min-height: 40px;
    max-height: 40px;
}
.cta-btn-dark {
    color: #fff;
    cursor: pointer;
    border: 1px solid #fff;
    border-radius: 50px;
    justify-content: center;
    align-items: center;
    min-width: 288px;
    max-width: 288px;
    height: 56px;
    min-height: 56px;
    font-weight: 500;
    line-height: 120%;
    text-decoration: none;
    display: flex;
    position: relative;
    overflow: hidden;
}
@media screen and (max-width: 767px) {
    .wrapper-cta-btn {
        grid-column-gap: 40px;
        grid-row-gap: 40px;
        flex-flow: column;
        align-items: center;
    }
}
@media screen and (max-width: 991px) {
    .cta-section-text h3 {
        font-size: 25px;
        max-width: 255px;
    }
}
@media screen and (max-width: 767px) {
    .line-40px {
        background-color: #384249;
        width: 260px;
        min-width: 260px;
        max-width: 260px;
        height: 1px;
        min-height: 1px;
        max-height: 1px;
    }
}

/* Services */
.aboutGalleryContent {
    padding-top: 4rem;
    padding-bottom: 4rem;
}


/* Breadcrumbs */
.servicesHero {
    /* background-image: url(../images/background/serviesbg.webp); */
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.servicesHero {
    background-image: url(../images/background/serviesbg.webp);
}
.servicesDetail {
    background-image: url(../images/background/digital-trans-bg.jpeg);
}
.breadcrumb-wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 8px;
    padding-top: 50px;
}

.breadcrumb-link {
    font-size: 16px;
    white-space: nowrap;
    text-decoration: none;
    color: #fff;
}

.breadcrumb-icon {
    font-size: 9px;
    color: #fff;
    font-weight: bold;
}

.current-page {
    font-weight: bold;
    color: #6ee7d4;
}

@media (max-width: 768px) {
    .breadcrumb-link {
        font-size: 14px;
    }
}

.servicesHeroHeading {
    color: #fff;
    /* text-transform: uppercase; */
    margin-bottom: 0;
    font-size: 80px;
    font-weight: 600;
    line-height: 120%;
}

/* Get In Touch Button */
.getInTouchButton {
    position: relative;
    display: inline-block;
    border-radius: 30px;
    background-color: #fcfcfc;
    color: #000;
    text-align: left;
    font-size: 18px;
    padding: 9px 36px;
    transition: all 0.3s;
    padding-right: 40px;
    margin: 20px 5px;
    box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.06);    
}
.getInTouchButton .btn-icon {
    background-color: #ffa000;
    width: 92px;
    height: 45px;
    float: right;
    position: absolute;
    border-radius: 30px 30px 30px 0;
    right: 0px;
    top: 0px;
    transition: all 0.3s;
}
.buttonGetInTouch {
    position: relative;
    z-index: 9999;
}
.getInTouchButton .btn-icon::after {
    content: "";
    width: 0;
    height: 0;
    border-top: 45px solid #fcfcfc;
    border-right: 40px solid transparent;
    position: absolute;
    top: 0px;
    left: 0px;
}
.getInTouchButton:hover .btn-icon {
    width: 100%;
    border-radius: 30px;
}
.getInTouchButton:hover .btn-icon::after {
    display: none;
    opacity: 0.1;
}
.getInTouchButton .btn-icon i {
    position: absolute;
    right: 25px;
    top: 15px;
    color: #fff;
}
.getInTouchButton:hover {
    color: #fff!important;
}
.getInTouchButton .heart {
    background-color: #2ed3c7 !important;
}
.servicesHeroSection {
    padding-top: 270px;
    padding-bottom: 70px;
}
.servicesDetailSection {
    /* padding-top: 70px;
    padding-bottom: 70px; */
}

@media screen and (max-width: 426px) {
    .getInTouchButton {
        width: 80%;
    }
}
@media screen and (min-width: 426px) and (max-width: 769px) {
    .getInTouchButton {
        width: 50%;
    }
}
@media screen and (min-width: 769px) {
    .getInTouchButton {
        width: 25%;
    }
}

@media screen and (max-width: 991px) {
    .servicesHeroHeading {
        font-size: 42px;
    }
    .servicesHeroPara {
        color: #fff;
        font-size: 18px;
        margin: 20px 0;
    }   
    .servicesHeroSection {
        padding-top: 70px;
        padding-bottom: 70px;
    } 
}
@media screen and (min-width: 991px) {
    .servicesHeroHeading {
        font-size: 78px;
        max-width: 78%;
    }
    .servicesHeroPara {
        color: #fff;
        width: 50%;
        font-size: 18px;
        margin-top: 22px;
        margin-bottom: 22px;
    }
    .servicesHeroSection {
        padding-top: 270px;
        padding-bottom: 70px;
    }
}

/* Services We Offer */
.servicesWeOfferContent {
    margin-top: 4rem;
    margin-bottom: 4rem;
}
.servicesWeOfferContent h2 {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 48px;
    font-weight: 600;
    line-height: 110%;
    text-align: center;
}

/* Services We Offer Card */
.servicesWeOfferCard .card-content {
    position: relative;
    padding: 20px;
    height: 100%;
    overflow: hidden;
}

.servicesWeOfferCard .card-title {
    position: relative;
    top: 50%;
    transition: top 1s;
    font-size: 22px;
    font-weight: bold;
    text-align: left;
    margin: 27px 0 27px 16px;
    /* margin: 17px; */
    color: white;
}

.servicesWeOfferCard .card-description {
    position: absolute;
    bottom: 0%;
    width: 100%;
    opacity: 0;
    transition: opacity 1s, bottom 1s;
    color:white;
    /* margin: 17px; */
    margin: 0 37px;
}

.servicesWeOfferCard .list-slide-services {
    list-style: none;
    padding: 0;
}

.servicesWeOfferCard .list-item-slide-services {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 1s, transform 1s;
    list-style-type: square;
    text-align: left;
}

.servicesWeOfferCard .card:hover .card-title {
    /* top: 10%; */
    top: 35%;
}

.servicesWeOfferCard .card:hover .card-description {
    opacity: 1;
    /* bottom: 30%; */
    top: 55%;
    margin: 0 37px;
    max-width: 218px;
}

.servicesWeOfferCard .card:hover .list-item-slide-services {
    opacity: 1;
    transform: translateY(0);
}

/* Services Card New Hover effect */
.servicesWeOfferCard {
    display: flex;
    justify-content: center;
    align-items: center;
}
.servicesWeOfferCard {
    /* width: 100%;
    display: inline-block;
    overflow: hidden; */
}

.servicesWeOfferCard .card-container {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    max-width: 1200px;
    width: 100%;
    flex-wrap: wrap;
    padding: 20px;
}

.servicesWeOfferCard .card-container {
    /* display: flex;
    justify-content: center;
    align-items: center; */
    /* height: 300px; */
}

.servicesWeOfferCard .card {
    position: relative;
    width: 100%;
    max-width: 345px;
    height: 400px;    
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.4s ease, height 0.4s ease;
    border: 1px solid #fff;
}

.data-services {
    background: linear-gradient(#00000000, #0000002b), 
    url(../images/sections/dataservice.png) no-repeat center/cover;
}



.digital-transformation {
    /* background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.8)), 
    url(../images/sections/digital.png) no-repeat center/cover; */
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.8)), url(../images/sections/digital.png) no-repeat center / cover;
}

.ai-ml {
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.8)), 
    url(../images/sections/ai-ml.png) no-repeat left/cover;
}

.cloud-devops {
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.8)), 
    url(../images/sections/cloud-devops.png) no-repeat center/cover;
}

.robotic {
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.8)), 
    url(../images/sections/rpa.jpg) no-repeat center/cover;
}

.custom-app {
    background: linear-gradient(#0000,#000), url(../images/sections/custom-app.webp);
    background-repeat: no-repeat;
    background-position: top;
    object-fit: cover;
}

.iot {
    background: linear-gradient(#0000,#000), url(../images/sections/iot.png);
    background-repeat: no-repeat;
    background-position: center;
    object-fit: contain;
}

.mobile-apps {
    background: linear-gradient(#0000,#000), url(../images/sections/mobile-apps.webp);
    background-repeat: no-repeat;
    background-position: center;
    object-fit: contain;
}

.servicesWeOfferCard .card:hover {
    transform: translateY(-20px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

@media (max-width: 768px) {
    .servicesWeOfferCard .card-container {
        flex-direction: column;
        align-items: center;
    }
    .servicesWeOfferCard .card-title {
        font-size: 23px;
    }
    .servicesWeOfferContent h2 {
        font-size: 33px;
    }
}

.readMoreHover {
    list-style-type: none;
    text-align: left;
    position: absolute;
    bottom: 25px;
    left: 6px;
}
.the-arrow {
    width: 1px;
    transition: all 0.2s;
  }
  .the-arrow.-left {
    position: absolute;
    top: 60%;
    left: 0;
  }
  .the-arrow.-left > .shaft {
    width: 0;
    background-color: #4c4c4c;
  }
  .the-arrow.-left > .shaft:before, .the-arrow.-left > .shaft:after {
    width: 0;
    background-color: #4c4c4c;
  }
  .the-arrow.-left > .shaft:before {
    transform: rotate(0);
  }
  .the-arrow.-left > .shaft:after {
    transform: rotate(0);
  }
  .the-arrow.-right {
    top: 3px;
  }
  .the-arrow.-right > .shaft {
    width: 1px;
    transition-delay: 0.2s;
  }
  .the-arrow.-right > .shaft:before, .the-arrow.-right > .shaft:after {
    width: 8px;
    transition-delay: 0.3s;
    transition: all 0.5s;
  }
  .the-arrow.-right > .shaft:before {
    transform: rotate(40deg);
  }
  .the-arrow.-right > .shaft:after {
    transform: rotate(-40deg);
  }
  .the-arrow > .shaft {
    background-color: #fff;
    display: block;
    height: 1px;
    position: relative;
    transition: all 0.2s;
    transition-delay: 0;
    will-change: transform;
  }
  .the-arrow > .shaft:before, .the-arrow > .shaft:after {
    background-color: #fff;
    content: "";
    display: block;
    height: 1px;
    position: absolute;
    top: 0;
    right: 0;
    transition: all 0.2s;
    transition-delay: 0;
  }
  .the-arrow > .shaft:before {
    transform-origin: top right;
  }
  .the-arrow > .shaft:after {
    transform-origin: bottom right;
  }
  
  .animated-arrow {
    display: inline-block;
    color: #fff;
    font-size: 1.25em;
    font-style: italic;
    text-decoration: none;
    position: relative;
    transition: all 0.2s;
  }
  .animated-arrow:hover {
    color: #fff;
  }
  .animated-arrow:hover > .the-arrow.-left > .shaft {
    width: 64px;
    transition-delay: 0.1s;
    background-color: #fff;
  }
  .animated-arrow:hover > .the-arrow.-left > .shaft:before, .animated-arrow:hover > .the-arrow.-left > .shaft:after {
    width: 8px;
    transition-delay: 0.1s;
    background-color: #fff;
  }
  .animated-arrow:hover > .the-arrow.-left > .shaft:before {
    transform: rotate(40deg);
  }
  .animated-arrow:hover > .the-arrow.-left > .shaft:after {
    transform: rotate(-40deg);
  }
  .animated-arrow:hover > .main {
    transform: translateX(17px);
    transform: translateX(80px);
  }
  .animated-arrow:hover > .main > .the-arrow.-right > .shaft {
    width: 0;
    transform: translateX(200%);
    transition-delay: 0;
  }
  .animated-arrow:hover > .main > .the-arrow.-right > .shaft:before, .animated-arrow:hover > .main > .the-arrow.-right > .shaft:after {
    width: 0;
    transition-delay: 0;
    transition: all 0.1s;
  }
  .animated-arrow:hover > .main > .the-arrow.-right > .shaft:before {
    transform: rotate(0);
  }
  .animated-arrow:hover > .main > .the-arrow.-right > .shaft:after {
    transform: rotate(0);
  }
  .animated-arrow > .main {
    display: flex;
    align-items: center;
    transition: all 0.2s;
  }
  .animated-arrow > .main > .text {
    margin: 0 16px 0 0;
    line-height: 1;
  }
  .animated-arrow > .main > .the-arrow {
    position: relative;
  }

@media (min-width: 773px) {
    .servicesWeOfferCard .card {
        width: 31.33%;
    }
}

@media (max-width: 773px) {
    .card-last-hidden {
        display: none;
    }
}
@media (min-width: 1220px) {
    .servicesWeOfferCard .card-container {
        gap: 60px;
    }
}



/* Our Team Slider */
.ourTeam {
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    background-color: #f4f4f4;
    overflow-x: auto; /* Enable horizontal scrolling */
}
.ourTeam .slider {
    width: 80%;
    max-width: 600px;
    height: 400px;
    overflow: hidden;
    position: relative;
    border: 2px solid #ccc;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    display: flex; /* Align images in a row */
    flex-direction: row;
}
.ourTeam .slider img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 100%;
}
.ourTeam .slider img.active {
    left: 0;
}
/* Custom scrollbar */
.ourTeam::-webkit-scrollbar {
    height: 8px; /* Scrollbar height */
}

.ourTeam::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 4px;
}

.ourTeam::-webkit-scrollbar-track {
    background-color: #f4f4f4;
}

/* Digital Transformation */

.servicesDetailPage {
    overflow: hidden;
}

.servicesDetailContent {
    margin-top: 4rem;
    margin-bottom: 4rem; 
}

.digitalTranswhyContent {
    padding-top: 4rem;
    padding-bottom: 4rem; 
}

.servicesDetailContent h2 {
    font-size: 40px;
    font-weight: 600;
}
.servicesDetailContent p {
    font-size: 1.125rem;
    line-height: 1.75rem;
    border-left: 1px solid #2b2b2b;
    color: #2b2b2b;
    padding-left: 36px;
    border-left: 10px solid;
    border-image-slice: 1;
    border-width: 2px;
    border-image-source: linear-gradient(to top, #6befdf, #005baa);
}
.textFirstletter::first-letter {
    font-size: 200%;
    font-weight: bold;
    color: #093E8E;
}
.textFirstletter {
    font-size: 20px;
    font-weight: bold;
    letter-spacing: 2px;
    text-align: center;
    margin: 50px 0;
}
.bg-lightblue {
    opacity: 1;
    background-color: rgba(243, 247, 251);
    border-radius: .75rem;
    margin-top: 1rem;
    padding: 4rem;
}
.digitalTransServicesContent h2 {
    font-size: 2.5rem;
    line-height: 3.125rem;
    font-weight: 600;
    color: #000;
}
.digitalTransServicesContent p {
    font-size: 18px;
    padding: 10px 0;
    color: #2b2b2b;
}
.digitalTransServicesContent a {
    color: #093E8E;
    /* text-decoration: none; */
    font-weight: bold;
    font-size: 18px;
}
.digitalTransformationPoints {
    background-color: rgba(27, 28, 84);
    /* background: linear-gradient(4deg, rgba(59, 130, 246, 0.00) 12.42%, rgba(59, 130, 246, 0.10) 63.32%), #FFF; */
}
.digitalTranswhyContent {
    padding: 50px 0;
}
.digitalTranswhyContent h2 {
    text-align: center;
    font-size: 40px;
    font-weight: bold;
    color: #FFF;
}
.backCircle {
    padding: 15px;
    border: 2px solid #fff;
    border-radius: 70%;
    height: max-content;
}

.backCircle svg {
    width: 30px;
    height: 30px;
}

.backCircle:hover {
    background: #fff;
}

.backCircle:hover svg path {
    fill: rgba(27, 28, 84);
}

.whyTealorcaPoints {
    margin-left: 20px;
}
.whyTealorcaPoints h3 {
    font-weight: bold;
    color: #fff;
}
.whyTealorcaSectionPoints {
    margin: 30px auto;
    color: #fff;
}

.whatWeOfferContent {
    margin-top: 4rem;
    margin-bottom: 4rem;
    /* background: #eee; */
}
.dividerWhite {
    width: 147px;
    border: 1px solid #fff;
    display: block;
    margin: 14px auto;
}
  
.whatWeOfferContent h1 {
    color: #4ab19e;
    font-size: 42px;
    padding: 20px 0px;
    margin: 0;
    text-align: center;
    background: #fff;
}
  
.whatWeOfferContent .panel {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
    padding: 0px 0px 60px 0px;
}
  
.whatWeOfferContent .WhatWeofferContentBlock {
    position: relative;
    display: flex;
    flex-direction: column;
    /* justify-content: center; */
    align-items: center;
    margin: 0 20px;
}


.WhatWeofferContentBlock .image {
    height: 125px;
    width: 125px;
    border-radius: 50%;
    background: #052c65;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    border: 10px solid #eeeeee;
    bottom: -60px;
    z-index: 1;
  }
.WhatWeofferContentBlock .image .fa {
    font-size: 40px;
  }
  .WhatWeofferContentBlock .content {
    margin-top: 27px;
    background: #093E8E;
    color: #222;
    text-align: center;
    width: 250px;
    max-width: 100%;
    height: max-content;
    padding: 38px 20px 20px 20px;
    border-radius: 10px;
    position: relative;
    opacity: 1; /* Make the card visible by default */
    -webkit-transform: rotateX(0); /* Make sure the card is in normal position initially */
    -webkit-transform-origin: 0 0;
    -webkit-transition: -webkit-transform 0.5s linear, opacity 0.5s linear; /* Add transition for opacity */
    /* height: 265px; */
    /* min-height: 270px; */
    /* min-height: 250px; */
    max-height: 265px;
    min-height: 265px;
}

.WhatWeofferContentBlock:hover .content {
    -webkit-transform: rotateX(95deg); /* Apply rotation on hover */
    opacity: 0; /* Hide the card on hover */
    display: block;
}

/* 
.WhatWeofferContentBlock .content {
    margin-top: 27px;
    background: #093E8E;
    color: #222;
    text-align: center;
    width: 250px;
    max-width: 100%;
    height: max-content;
    padding: 50px 20px 20px 20px;
    border-radius: 10px;
    position: relative;
    opacity: 0;
    -webkit-transform: rotateX(95deg);
    -webkit-transform-origin: 0 0;
    -webkit-transition: -webkit-transform 0.5s linear;
  } 
    .WhatWeofferContentBlock:hover .content {
    -webkit-transform: rotateX(0);
    opacity: 1;
    display: block;
  }
    */
.WhatWeofferContentBlock .content h2 {
    color: #f4f4f4;
    font-size: 20px;
    margin: 15px;
    font-weight: bold;
  }



.icon-diamond {
    margin-bottom: 15px;
    display: inline-block;
    animation: rotating 3s linear infinite backwards;
}

@keyframes rotating {
    0% {
        transform: rotate(0deg);
    }
    50% {
        transform: rotate(360deg);
    }
    100% {
        transform: rotate(0deg);
    }
}

.businessOfferingContent {
    padding-top: 3rem;
    padding-bottom: 3rem;
}
.textCustomBlue {
    background: linear-gradient(175deg, #0f5dfb 0%, #010c7a 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.businessOfferings h5 {
    font-size: 15px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 1.3;
    margin-bottom: 5px;   
    margin-bottom: 5px;
}

.businessOfferings h1 {
    font-size: 45px;
    font-weight: bold;
    margin: 20px;
}

.businessOfferingsBox {
    margin: 44px 0;
}

.businessOfferingsBox .card-img img {
    border-radius: 30px;
    overflow: hidden;
}

.businessOfferingsCard .card-img img {
    transition: all 0.6s ease;
    width: 90%;
    margin: auto;
    display: block;
}
.businessOfferingsCard:hover .card-img img {
    transform: rotate(-4deg) scale(1.1);
}
.businessOfferingsCard .content .icon {
    border-radius: 50%;
    background: linear-gradient(175deg, #0f5dfb 0%, #010c7a 100%);
    width: 79px;
    height: 79px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}
.businessOfferingsCard .content {
    margin-top: -50px;
    position: relative;
    text-align: center;
    padding: 0 35px;
}
.icon:hover .iconBlink {
    animation: bounceIn 0.8s linear;
}
@keyframes bounceIn {
    0%, 20%, 40%, 60%, 80%, 100% {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);
    }
    40% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03);
    }
    80% {
        -webkit-transform: scale3d(0.97, 0.97, 0.97);
        transform: scale3d(0.97, 0.97, 0.97);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.businessOfferingsCard .content .title {
    font-size: 27px;
    font-weight: 900;
    color: rgb(28, 28, 28);
    line-height: 1.25;
    margin-top: 20px;
}
.businessOfferingsCard .content .para {
    font-size: 18px;
    font-weight: 500;
    line-height: 20px;
    margin-bottom: 0;
    color: rgb(115, 115, 115);
    margin-top: 8px;
}

@media (max-width: 1024px) {
    .servicesImage {
        max-width: inherit;
    }
    .bg-lightblue {
        padding: 2rem;
    }
    .businessOfferingsBox .card-img img {
       width: inherit;
    }
    
}
@media (min-width: 1024px) {
    .textFirstletter {
        max-width: 70%;
    }
    .WhatWeofferContentBlock:nth-child(2)::before,
    .WhatWeofferContentBlock:nth-child(2)::after {
        content: "";
        position: absolute;
        top: 27%;
        transform: translateY(-50%);
        width: 50%;
        height: 2px;
        /* background-color: #052c65; */
        border-top: 2px dashed #052c65; /* Dashed line */
    }

    .WhatWeofferContentBlock:nth-child(2)::before {
        left: -112px;
    }

    .WhatWeofferContentBlock:nth-child(2)::after {
        right: -110px;
    }

    .WhatWeofferContentBlock {
        position: relative;
    }
}

.ourApproachDigital {
    background: #f8f8f8;
}

.ourApproachDigitalContent {
    padding-top: 3rem;
    padding-bottom: 3rem;
}


.scrollTrigger {
    max-width:1312px;
    margin: 0 auto;
}
   
.scrollTrigger h2 {
    font-size: 60px;
    font-weight: bold;    
    margin: 35px auto;
}
.ourApproachDigitalBoxLeft img {
    width: 100%;
    display: block;
    margin: auto;
    border-radius: 35px;
    height: 807px;
    object-fit: cover;
}
.ourApproachServicesCard {
    transform-origin: 50% 50%; 
    translate: none; 
    rotate: none; 
    scale: none; 
    transform: translate(0px, 0px); 
    opacity: 1;
}

.ourApproachServicesList .left {
    display: grid;
    grid-template-columns: auto auto auto;
    /* padding: 10px; */
}
.ourApproachServicesList .left .icon {
    width: 79px;
    height: 79px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 70px;
    background-color: rgb(235, 245, 255);
    margin: auto 16px;
}
.ourApproachServicesList .left .icon img {
    max-width: 100%;
    border: none;
    border-radius: 0;
    box-shadow: none;
}
.ourApproachServicesListCard.animate .title {
    color: #052c65;
}
.ourApproachServicesListCard {
    background: white;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}


@media (min-width: 426px) {
    .scrollTrigger h2 {
        max-width: 80%;
    }
    .ourApproachServicesList .left .icon img {
        height: auto;
    }
}

@media (max-width: 426px) {
    .ourApproachDigitalBox .ourApproachDigitalBoxLeft img {
        width: inherit;
        height: 433px;
    }
    .ourApproachServicesList .left .icon img {
        height: 35px;
    }
    .ourApproachServicesList .left {
        display: unset !important;
        text-align: center;
    }
    .ourApproachServicesList .left .icon {
        margin: auto;
    }
    .ourApproachServicesListCard {
        margin: 15px;
    }
}

@media (min-width: 426px) {
  .ourApproachServicesListCard {
    opacity: 0;
    transform: translateX(100%);
    transition: transform 0.8s ease, opacity 0.8s ease;
  }

  .ourApproachServicesListCard.animate {
    opacity: 1;
    transform: translateX(0);
  }

  .ourApproachServicesListCard .title {
    color: black;
    transition: color 0.5s ease;
  }

  .ourApproachServicesListCard .disc {
    color: #555;
    transition: color 0.5s ease;
  }

  .ourApproachServicesListCard.animate .disc {
    color: #000;
    margin-bottom: 0;
  }

  .ourApproachServicesListCard {
    margin: 20px auto;
    width: 80%;
    max-width: 600px;
    background: white;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  }

  .ourApproachServicesListCard .icon img {
    width: 40px;
    height: 40px;
  }

  .ourApproachServicesListCard .content {
    margin-left: 10px;
  }
  .faqDigitalTransContent .col-right {
    padding-left: 50px;
  }
}
/* FAQ */
.faqDigitalTransContent {
    margin-top: 4rem;
    margin-bottom: 4rem; 
}
.weAreMoving {
    background: url(https://themexriver.com/wp/cantia/wp-content/uploads/2024/10/f1-a-bg.png);
    padding: 84px 50px 44px 50px;
    border-radius: 30px;
}
.weAreMoving .title {
    font-size: 40px;
    color: rgb(255, 255, 255);
    font-weight: 800;
    line-height: 1.125;
}
.weAreMoving .para {
    font-size: 16px;
    color: rgb(255, 255, 255);
    font-weight: 600;
    line-height: 1.5;
    margin-top: 10px;
}
.weAreMoving .btn-wrap,
.weAreMovingContact .btn-wrap {
    margin-top: 30px;
}
.weAreMoving .learnMore,
.weAreMovingContact .callNow {
    width: 100%;
    height: 100%;
    border-radius: 100px;
    background: linear-gradient(175deg, #0f5dfb 0%, #010c7a 100%);
    transition: all 0.4s ease;
    width: 100%;
    height: 100%;
    font-size: 14px;
    text-transform: uppercase;
    color: #fff;
    font-weight: 800;
    position: relative;
    z-index: 2;
    transition: all 0.4s ease;
    padding: 18px 38px;
    text-decoration: none;
}
.weAreMovingContact {
    border: 4px solid rgba(228, 228, 227, 0.43);
    border-radius: 30px;
    padding: 40px 0 33px 0;
    text-align: center;
    margin: 45px 0;
}
.weAreMovingContact h4 {
    font-size: 28px;
    color: rgb(2, 16, 129);
    line-height: 1.3;
    font-weight: 900;
    margin-top: 6px;
}
.weAreMovingContact p {
    font-size: 16px;
    margin-top: 12px;
    line-height: 1.25;
    color: rgb(96, 101, 105);
    max-width: 220px;
    margin: 0 auto;
    text-align: center;
}
.faqDigitalTransContent .ct-bg-text {
    font-size: 130px;
    color: rgba(0, 0, 0, 0);
    line-height: 0.8;
    text-transform: uppercase;
    font-weight: 900;
    -webkit-text-stroke-width: 3px;
    stroke-width: 3px;
    -webkit-text-stroke-color: #f4f4f4;
    stroke: #f4f4f4;
    /* position: absolute;
    top: -22px;
    left: 0; */
    z-index: -1;
    margin-bottom: 0;
    position: absolute;
    letter-spacing: -17px;
}
.faqDigitalTransContent .ct-bg-text .split-line {
    overflow: hidden;
    display: block;
    text-align: left;
    position: relative;
}
.faqDigitalTransContent .ct-bg-text .split-line div div {
    transform: translateY(100px);
    transition: all 0.8s ease;
}
.faqDigitalTransContent .ct-bg-text:is(.active) .split-line div div {
    transform: translateY(0px);
}

.faqDigitalTransContent .col-right h1 {
    font-size: 60px;
    font-weight: 900;
}
.accordion-button:focus {
    box-shadow: none;
}


/* Case Studies Page */
.caseStudies small {
    font-size: 16px;
    margin-left: 10px;
}

.caseStudiesContent {
    margin-top: 3rem;
    margin-bottom: 3rem;
}
.caseStudiesContent .heading1 {
    font-size: 60px;
    line-height: 1em;
    /* color: #015EEA; */
    color: #093E8E;
    font-weight: 700;
    position: relative;
    margin: 20px 0;
}
.caseStudiesContent .heading2 {
    font-size: 42px;
    line-height: 1em;
    font-weight: 700;
    margin: 20px 0;
}
.caseStudiesContent p {
    font-size: 20px;
    font-weight: 400;
    color: #111111;
    margin: 25px 0;
}
.getStartedNow {
    margin: 0;
    border-radius: 8px;
    width: fit-content;
    padding: 18px 32px;
    text-transform: none;
    box-sizing: border-box;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    letter-spacing: -0.2px;
    color: #fff;
    display: flex;
    align-items: center;
    text-decoration: none;
    background-color: transparent;
    background-image: linear-gradient(340deg, #015EEA 23%, #02A3F4 98%);
}
.caseStudies .waveImage1{
    text-align: center;
    margin-left: 45%;
    display: block;
    animation-duration: 35s;
    animation-name: horizontal;
    animation-timing-function: linear;
    animation-duration: 12s;
    animation-iteration-count: infinite;
    display: none;
}
.caseStudies .waveImage2{
    text-align: center;
    margin-left: 65%;
    display: block;
    animation-duration: 45s;
    animation-name: horizontal;
    animation-timing-function: linear;
    animation-duration: 12s;
    animation-iteration-count: infinite;
    margin-top: 45px;
    display: none;
}

@keyframes horizontal {
    0% {
        transform: translateX(0);
    }
    50% {
        transform: translateX(100px);
    }
    100% {
        transform: translateX(0);
    }
    
}
@media (max-width: 1023px) {
    .caseStudiesContent .heading1 {
        font-size: 37px;
    }
    .caseStudiesContent .heading2 {
        font-size: 28px;
    }
}
@media (min-width: 1023px) {
    .bgRight {
        background-image: url(https://agency.reobiztheme.com/wp-content/uploads/2023/07/banner_shape_right.png);
        background-position: top right;
        background-repeat: no-repeat;
        background-size: contain;
        padding: 176px 0px 135px 0px;
    }
    .caseStudies .waveImage1,
    .caseStudies .waveImage2 {
        display: block;
    }
    
}

/* Slick slider */  
.caseStudiesSliderCard .slider {
    margin: 50px auto;
    overflow: hidden;
}
.caseStudiesSliderCard {
    background: linear-gradient(255deg, #015EEA 23%, #02A3F4 98%);
}
.caseStudiesSliderCard .slider__row {
    display: flex;
    position: relative;
    left: 0;
    width: 1536px;
    overflow: hidden;
    transition: transform 0.5s ease;
    width: max-content;
}
.caseStudiesSliderCard .slider img {
    width: 30px;
    height: 30px;
    display: block;
    margin: auto;
}
.caseStudiesSliderCard .slider h1 {
    font-size: 24px;
    font-weight: 700;
    margin: 0;
    text-align: center;
    color: #fff;
}
.caseStudiesSliderCard .row__item {
    padding: 20px;
    flex: 0 0 auto; /* Prevent shrinking */
    width: 128px; /* Match the width of each slide */
    margin: auto;
}


/* Case Studies Card */
.caseStudyCardContent {
    margin-top: 3rem;
    margin-bottom: 3rem;
}
.caseStudyCardItemBlock {
    display: flex;
    border-radius: 24px;
    border: 2px solid #DBDDE0;
    margin-bottom: 60px;
    justify-content: space-between;
}
.caseStudyCardItemBlock .caseStudyCardItemBlockImage img {
    max-width: 488px;
    max-height: 488px;
    margin: 17px;
    border-radius: 23px;
}
.caseStudyCardItemBlockContent {
    width: 680px;
    padding: 36px 36px 0 36px;
}
.caseStudyCardItemBlockContentFilter {
    display: flex;
    grid-column-gap: 16px;
    grid-row-gap: 21px;
    margin-bottom: 36px;
}
.caseStudyFilterCategory {
    display: inline-block;
    color: #2F3241;
    padding: 8px 16px;
    border-radius: 32px;
    border: 1px solid #DBDDE0;
    background: rgba(255, 255, 255, 0.20);
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}
.caseStudyCardItemBlockTitle {
    color: #101012;
    font-size: 32px;
    font-weight: 800;
    line-height: 40px;
    margin-bottom: 36px;
    height: 120px;
    display: flex;
    align-items: center;
}
.caseStudyCardTechnologyTitle {
    color: #101012;
    font-size: 22px;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: 0.22px;
    text-transform: uppercase;
    margin-bottom: 12px;
}
.caseStudyCardTechnologyItemList {
    display: flex;
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    margin-bottom: 32px;
}
.caseStudyDetails {
    color: #0063C1;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: -0.16px;
    border-radius: 8px;
    border: 2px solid #0063C1;
    background: #FFF;
    padding: 18px 32px;
    display: block;
    text-align: center;
    text-decoration: none;
}
.caseStudyDetailsButton {
    display: flex;
    justify-content: space-between;
    height: 120px;
    align-items: center;
}
.caseStudyCardTechnologyItemListIcon {
    border-radius: 7.735px;
    background: #FFF;
    box-shadow: 0px 2.04301px 8.17204px 0px rgba(197, 209, 222, 0.60);
    display: inline-block;
    width: 60px;
    height: 60px;
    padding: 5px;
}

@media screen and (max-width: 1023px) {
    .caseStudyCardItemBlock {
        flex-wrap: wrap;
    }
}

@media screen and (max-width: 1220px) {
    .caseStudyCardItemBlockContent {
        width: 100%;
        padding: 24px;
    }
    .caseStudyCardItemBlockTitle {
        height: auto;
    }
}
@media screen and (max-width: 580px) {
    .caseStudyCardItemBlockImage {
        width: 100%;
        margin: 0 auto;
    }
    .caseStudyCardItemBlockImage img {
        margin: 0 !important;
        max-width: inherit;
        max-height: inherit;
        width: inherit;
        height: inherit;
    }
    .caseStudyCardItemBlockContentFilter {
        flex-wrap: wrap;
        grid-row-gap: 10px;
        margin-bottom: 16px;
    }
    .caseStudyCardTechnologyItemList {
        flex-wrap: wrap;
    }
}

@media screen and (max-width: 990px) {
    .caseStudyCardTechnologyTitle {
        font-size: 24px;
        line-height: 34px;
        margin-bottom: 15px;
    }
    .caseStudyCardItemBlockTitle {
        font-size: 24px;
        line-height: 26px;
    }
    .caseStudyDetailsButton {
        flex-wrap: wrap;
    }
}


/* Case Studies Detail */
.caseStudiesDetailPage {
    overflow-x: hidden;
}
section.caseStudiesDetail {
    background: linear-gradient(3.82deg, rgba(59, 130, 246, 0) 12.42%, rgba(59, 130, 246, 0.1) 63.32%);
}
.caseStudiesDetailContent {
    padding-top: 4rem;
    padding-bottom: 4rem;
}
.caseStudiesDetailContent h1 {
    color: #000;
    font-weight: 800;
    text-align: center;
    line-height: inherit;
    font-size: 56px;
    margin-bottom: 34px;
}
.caseStudiesDetail img {
    max-width: 814px;
    height: auto;
    vertical-align: top;
    text-align: center;
    margin: auto;
}
@media screen and (max-width: 990px) {
    .caseStudiesDetailContent h1 {
        font-size: 33px;
    }
}

/* Case Study Key Points */
.caseStudiesKey {
    background: linear-gradient(180deg, transparent 0, transparent 52%, #F6F7F8 0, #F6F7F8 100%);
}
.caseStudiesCard {
    background: #FFFFFF;
    box-shadow: 0px 4px 60px rgb(213 213 213 / 40%);
    border-radius: 24px;
    min-height: 202px;
    padding: 40px 75px;
    margin: 55px 5px;
}
.caseStudiesCard .services_title {
    font-weight: 700;
    font-size: 18px;
    line-height: 24px;
    text-align: center;
    color: #000000;
    max-width: inherit;
    margin-top: 15px;
    margin-bottom: 2px;
}
.caseStudiesCard .services_icon {
    text-align: center;
}
.caseStudiesCard .services_content {
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #616161;
    margin: 0;
}

@media screen and (max-width: 1023px) {
    .caseStudiesCard {
        margin: 55px auto;
        width: 90%;
    }
}

@media screen and (min-width: 990px) {
    .caseStudiesDetailKey {
        display: flex;
        justify-content: space-evenly;
    }
}


/* Case Studies laravel Detail */
.caseStudiesLaravel {
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.caseStudiesLaravelContent {
    padding-top: 4rem;
    padding-bottom: 4rem;
}
.caseStudiesLaravelDetail {
    background-color: #F6F7F8;
}
.caseStudiesLaravel:nth-child(odd) {
    /* background-color: #f4f4f4; */
}
.caseStudiesLaravel:nth-child(even) {
    /* background-color: #ddd; */
}
.caseStudiesLaravel .content {
    flex: 1;
    padding: 20px;
    opacity: 0;
    transform: translateX(-50px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}
.caseStudiesLaravel .image {
    flex: 1;
    padding: 20px;
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 0.5s ease, transform 0.5s ease;
    text-align: center;
}
.caseStudiesLaravel img {
    max-width: 100%;
    height: auto;
}
.caseStudiesLaravel .content h1 {
    color: #232323;
    font-weight: 800;
    font-size: 42px;
}
.caseStudiesLaravel .content p {
    color: #616161;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    letter-spacing: 1px;
}
.caseStudiesSolutionsContent h2 {
    color: #232323;
    font-weight: 800;
    font-size: 42px;
    margin-left: 25px;
    margin-top: 2px;
}
.caseStudiesLaravel .content h3 {
    font-size: 19px;
    margin: 23px 0;
    line-height: 31px;
    /* letter-spacing: 1px; */
    font-weight: 400;
}
.caseStudiesSolutions {
    display: flex;
    margin: .67em 0;
}
.caseStudiesSolutionContent {
    margin-top: 4rem;
    margin-bottom: 4rem;
}
.fa-check:before {
    content: "\f00c";
    color: #1c446c;
    font-size: 21px;
}
.solutionsList li {
    color: #616161;
    font-weight: 400;
    /* padding-left: 37px; */
    padding-bottom: 16px;
    font-size: 18px;
    letter-spacing: 0.8px;
    margin-left: 23px;
}
.caseStudiesLaravel .content h5 {
    /* font-size: 15px; */
    color: #616161;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    letter-spacing: 1px;
}
.solutionsSubList {
    margin-left: 20px;
    margin-top: 15px;
}

.caseStudyCards .paginationWrapper {
    display: flex;
    justify-content: center;
    margin: 40px 0;
}

.caseStudyCards .pagination {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
}

.caseStudyCards .paginationLink {
    padding: 10px 20px;
    background-color: #f1f1f1;
    border-radius: 5px;
    text-decoration: none;
    color: #333;
    font-weight: bold;
    transition: background-color 0.3s ease;
}

.caseStudyCards .paginationLink:hover {
    background-color: #ddd;
}

.caseStudyCards .paginationLink.prev, .paginationLink.next {
    font-size: 1.1rem;
}

.caseStudyCards .paginationLink.active {
    background-color: #007BFF;
    color: white;
}

/* Responsive Design */
@media (max-width: 768px) {
    .caseStudyCards .paginationLink {
        padding: 8px 16px;
    }
}

@media (max-width: 480px) {
    .caseStudyCards .paginationLink {
        padding: 6px 12px;
    }
}

@media screen and (min-width: 990px) {
    .caseStudyCards .caseStudiesLaravel {
        display: flex;
    }
    .caseStudyCards .caseStudiesLaravel .content {
        margin-left: 75px;
    }
    .caseStudiesLaravel {
        display: flex;
    }
}



/* Contact Page */
.contactIntroContent {
    margin-top: 4rem;
    margin-bottom: 4rem;
}
#contactIntro .sec-title {
    max-width: 790px;
    position: relative;
    padding-top: 16px;
    margin: 0 auto;
}
#contactIntro .sec-title .watermark {
    position: absolute;
    top: -64px;
    left: 26%;
    font-size: 100px;
    font-weight: 800;
    color: transparent;
    opacity: 0.08;
    -webkit-text-stroke: 2px #1a73e9;
    text-stroke: 2px #1a73e9;
    line-height: 1;
}
#contactIntro .sec-title h2 {
    font-size: 48px;
    line-height: 1.26;
    font-weight: 800;
    color: #00204a;
    margin: 0 0 26px;
}
#contactIntro .sec-title h2 .primary-color {
    color: #0063C1;
}
#contactIntro .sec-title .desc {
    font-size: 17px;
    line-height: 29px;
    color: #656567;
    font-weight: 600;
    letter-spacing: 1px;
}
#contactIntro .check-list li {
    border: 1px solid #0063C1;
    box-shadow: 0px 4px 15px rgba(11, 30, 45, 0.05);
    border-radius: 4px;
    background: #ffffff;
    font-size: 17px;
    padding: 7px 20px;
    color: #1E4256;
    margin: 0 0 20px;
    display: inline-block;
    margin: 0 20px 0 0;
    font-weight: 700;
}

@media only screen and (max-width: 480px) {
    #contactIntro .sec-title .watermark {
        font-size: 35px;
    }
    #contactIntro .check-list li {
        padding: 7px 20px;
        width: 100%;
        margin-left: 0 !important;
        margin-right: 0 !important;
        font-size: 15px;
    }
    #contactIntro .sec-title h2 {
        font-size: 26px;
    }
}

@media only screen and (max-width: 767px) {
    #contactIntro .sec-title .watermark {
        font-size: 55px;
        left: 0;
        right: 0;
        top: -10px;
    }
}

@media only screen and (max-width: 1270px) {
    #contactIntro .check-list li {
        display: inline-block;
        margin: 0 10px 20px !important;
    }
}


/* Contact Page Form */
.contactUsFormContent {
    margin-top: 4rem;
    margin-bottom: 4rem;
}
.contactusForm .contact_form_title {
    color: #101012;
    text-align: center;
    font-size: 52px;
    font-weight: 700;
    line-height: 64px;
    margin-bottom: 16px;
}
.contactusForm  .contact_form_subtext {
    color: #2F3241;
    font-size: 20px;
    font-weight: 500;
    line-height: 28px;
    text-align: center;
    margin-bottom: 56px;
}
.contactusForm .contact_form_container_main {
    border-radius: 36px;
    border: 1px solid rgba(176, 187, 199, 0.20);
    background: #FFF;
    box-shadow: 0px 4px 16px 0px rgba(56, 81, 120, 0.10);
    padding: 32px 36px;
    max-width: 800px;
}
.contactusForm .contact_form_personal_info {
    margin-bottom: 40px;
}
.contactusForm  .contact_form_personal_info_main_text {
    color: #2F3241;
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    margin-bottom: 20px;
    text-align: center;
}
.contactusForm #fullName,
.contactusForm #workEmail,
.contactusForm #workPhone {
    border-radius: 8px;
    border: 1px solid #E2E6EB;
    background: #FBFBFB;
    padding: 12px 16px;
    color: #7F8287;
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
}
.contactusForm .form-control:focus {
    border: 1px solid #0063C1 !important;
    box-shadow: none;
}
.contactusForm .contact_form_what_you_interest,
.contactusForm .contact_form_budget,
.contactusForm .contact_form_industry,
.contactusForm .contact_form_message  {
    color: #2F3241;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    margin-bottom: 20px;
    text-align: center;
    margin-top: 20px;
}
.contactusForm .contact_form_what_you_interest_fields ,
.contactusForm .contact_form_budget_fields ,
.contactusForm .contact_form_industry_fields {
    text-align: center;
    display: block;
}
.contactusForm .roundedLabel {
    border-radius: 32px;
    border: 1px solid #0063C1;
    background: rgba(255, 255, 255, 0.20);
    padding: 6px 14px 6px 8px;
    color: #2F3241;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    margin: 8px;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    position: relative;
}
.contactusForm .roundedLabel:hover {
    background: rgba(0, 96, 255, 0.04);
    color: #093E8E;
}
.roundedLabel span {
    padding-left: .5em;
}
.contact_form .roundedLabel::before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid #0063C1;
    border-radius: 50%;
    margin-right: 2px;
    background-color: #fff;
}
.contact_form .roundedLabel:hover::before {
    line-height: 1;
    width: 16px;
    position: relative;
    height: 16px;
    border: 2px solid #0063C1;
    border-radius: 50%;
    content: '';
    background: url(/assets/images/icons/check-w.svg) no-repeat, #0063c1;
    /* background-position: 2px 2.5px; */
}
.contact_form .roundedLabel input[type="checkbox"]:checked + span::before {
    background-color: #0063c1;
    border-color: #0063c1;
    border-radius: 5px;
    width: 16px;
    height: 16px;
    position: absolute;
    top: 50%;
    left: 18px;
    transform: translate(-50%, -50%);
}
.contact_form .roundedLabel input[type="checkbox"] {
    display: none;
}
.contact_form textarea {
    border-radius: 16px !important;
    border: 1px solid #E2E6EB !important;
    background: #FBFBFB !important;
    color: #7F8287 !important;
    width: 100%;
    max-width: 100%;
    height: auto;
    box-sizing: border-box;
    padding: 10px;
    font-size: 16px; 
    font-weight: 400;
}
.contactusForm {
    background: linear-gradient(184deg, #EBF3FE 1.98%, #FFF 95.73%);
    padding: 7px 15px 0px;
}
.contact_btn {
    display: flex;
    justify-content: center;
}
.btn_contact_get_in_touch {
    width: 350px;
    padding: 18px 32px;
    height: 64px;
    background: #0063C1;
    border-radius: 8px;
    border: 0;
    letter-spacing: -0.01em;
    margin: 38px;
    min-width: inherit;
    color: #FFF;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    padding: 18px 32px;
    padding-top: 18px;
    padding-bottom: 18px;
    height: inherit;
}
@media (max-width: 768px) {
    .contact_form textarea {
      font-size: 14px;
      padding: 8px;
    }
}

@media (max-width: 480px) {
    .contact_form textarea {
      font-size: 12px;
      padding: 6px; 
    }
}


/*  Contact - Meet Our Team */
.contact_carousel {
    max-width: 370px;
    /* margin: 69px 0; */
    display: block;
    margin: 36px auto;
}
.contact_meet_tealorca {
    border-radius: 24px;
    border: 2px solid #71B3F1;
    background: #FAFCFF;
    box-shadow: 0px 4px 16px 0px rgba(56, 81, 120, 0.10);
    padding: 28px 32px 32px;
    max-width: 370px;
    display: block;
    margin: 36px auto;
}
.contact_meet_tealorca h4 {
    color: #101012;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    margin-bottom: 20px;
    position: relative;
    left: -8px;
}
.contact_carousel .carousel-inner {
    border-radius: 24px;
}
.contact_info_tealorca {
    background: #aacceb47;
    /* padding: 19px; */
    padding: 28px 32px 32px;
    max-width: 370px;
    border-radius: 25px;
    display: block;
    margin: 36px auto;
}
.contactUsAddressContent {
    /* margin-top: 4rem;
    margin-bottom: 4rem; */
}
.contactUsAddress {
    background-color: #070F3A;
    background-image: url(https://itsolutions.reobiztheme.com/wp-content/uploads/2023/07/address2.png);
    background-position: top left;
    background-size: cover;
    padding: 70px 50px 50px 50px;
}
.contactUsAddress .title {
    font-weight: 700;
    color: #FFFFFF;
    text-align: center;
    font-size: 40px;
}
.contactUsAddress .contactIcon {
    border-radius: 73%;
}
.contactUsAddress .contactDistrict {
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    color: #fff;
    margin: 15px 0;
}
.contactUsAddress .contactLocation {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 8px;
    color: #fff;
}
.contactUsAddress .address {
    border: 1px solid #fff;
    border-radius: 16px;
    padding: 42px;
    text-align: center;
}
.contactUsAddress .contactCards {
    margin: 42px 0;
}
.contactSingleCard {
    margin: 24px 0;
    padding: 3px 24px;
}

@media (max-width: 480px) {
    .contactUsAddress .title {
        font-size: 32px;
        padding-top: 54px;
    }
    .contactUsAddress {
        padding: 0;
    }
    .btn_contact_get_in_touch {
        margin: 19px 1px;
    }
}
@media (max-width: 1020px) {
    .contactUsAddress .contactSingleCard {
        padding: 2px 10px;
    }
}


/* Industries */
.industriesIntro {
    background-image: url(../images/background/industriesIntroBg.jpeg);
}
.industriesIntro .industriesHeroHeading {
    font-size: 54px;
    line-height: 64px;
    font-weight: 600;
    margin: 10px;
}
.industriesHeroPara {
    padding: 12px 0 12px 0;
    font-weight: 600;
    font-size: 18px;
}

@media (max-width: 576px) {
    .industriesIntro .industriesHeroHeading {
        font-size: 38px;
        line-height: 50px;
    }
}


.ourClientsJourneys-textbut{
    border-bottom: 2px solid #ffffff40;
    padding-bottom: 20px;
    margin-bottom: 20px;
}
.ourClientsJourneys-block{
    padding: 32px;
    border-radius: 24px;
    background: #0063C1;
}
.ourClientsJourneys-btn{
    background: #FFF;
    color: #0063C1;
    border: 2px solid #0063C1;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: -0.16px;
    border-radius: 8px;
    padding: 12px 20px;
    width: fit-content;
    text-decoration: none;
    display: inline-block;
}
.ourClientsJourneys-block_subtext p{
    margin-bottom: 10px;
    color: #FFF;
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
}
.whoWeAre-block-r{
    display: flex;
    flex-wrap: wrap;
    grid-column-gap: 20px;
    grid-row-gap: 20px;
}
.whoWeAre-skilled-professionals_img-block{
    width: fit-content;
    height: fit-content;
}
.whoWeAre-skilled-professionals_img-block img{
    width: 100%;
}
.whyChoose-block{
    border-radius: 24px;
    background: linear-gradient(256deg, #DDEAFF 6.88%, #C3DDFA 96.25%);
    padding: 28px 30px;
    width: 100%;
}
.whyChoose-list-img{
    display: flex;
    align-items: center;
    margin-bottom: 16px;
    justify-content: space-between;
    height: 17px;
}
.whyChoose-block h2{
    color: #093E8E;
    font-size: 24px;
    font-weight: 800;
    line-height: 32px;
}
.whyChoose-item-list{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 2px 16px;
    height: 41px;
    border-radius: 9.016px;
    background: #F1F7FF;
}
.whyChoose-item_text{
    color: #101012;
    font-size: 16px;
    font-weight: 500;
    line-height: 27.047px;
}
.whyChoose-list-block{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: 8px;
    grid-row-gap: 8px;
}
.whyChoose-item_number{
    color: #093E8E;
    font-size: 22px;
    font-weight: 800;
    line-height: 36.063px;
}
@media screen and (max-width: 650px) {
    .whyChoose-list-block {
        grid-template-columns: repeat(1, 1fr);
    }
}
.ourClients-block{
    margin: 0 auto;
    padding: 42px;
    background: #C6DAF8;
    border-radius: 24px;
}
.caseStudies{
    margin-bottom: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.caseStudies h2{
    color: #101012;
    font-size: 32px;
    font-weight: 700;
    line-height: 40px;
}
.link_casestud{
    color: #0063C1;
    display: inline-block;
    margin-right: 40px;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    letter-spacing: -0.2px;
    text-decoration-line: underline;
}
.swiper-controls-case-studies{
    display: flex;
    align-items: center;
}
#swiper-previous-case,
#swiper-next-case{
    background: #FFFFFF;
    box-shadow: 0px 4px 16px rgb(213 213 213 / 40%);
    border-radius: 8px;
    margin-right: 16px;
    width: 48px;
    display: flex;
    align-items: center;
    height: 48px;
    justify-content: center;
    cursor: pointer;
}

.caseStudies-img{
    border-radius: 10px;
    border: 2.041px solid #FFF;
    box-shadow: 0px 4.081px 16.325px 0px rgba(78, 99, 153, 0.25);
    width: 100%;
}
@media screen and (max-width: 600px) {
    .caseStudies {
        flex-wrap: wrap;
    }
}
@media screen and (max-width: 600px) {
    .caseStudies h2 {
        margin-bottom: 15px;
    }
}

@media screen and (max-width: 990px) {
    .ourClients-block {
        padding: 20px;
    }
}

.header{
    height: 60px;
}


.tealorcaGallery{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    max-width: 1120px;
}
.tealorcaGallery a{
}
.tealorcaGallery img{
    width: 125px;
    height: 125px;
    border-radius: 10px 0px;
    object-fit: cover;
}

.gallery-heading{
    color: #000000;
    margin-bottom: 16px;
    font-size: 44px;
    font-weight: 700;
    line-height: 56px;
    letter-spacing: -0.44px;
}

.aboutgallerycontent {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.contact_form .roundedLabel input[type="radio"]{
    display: none;
  }
  .contactusForm .roundedLabel.active {
      background: rgba(0, 96, 255, 0.04);
      color: #093E8E;
  }
  .contact_form .roundedLabel.active::before{
    line-height: 1;
    width: 16px;
    position: relative;
    height: 16px;
    border: 2px solid #0063C1;
    border-radius: 50%;
    content: '';
    background: url(//gloriumtech.com/wp-content/uploads/2024/12/check-w.svg) no-repeat, #0063c1;
  }