@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);

    --foreground-rgb: 0, 0, 0;
    --background-start-rgb: 214, 219, 220;
    --background-end-rgb: 255, 255, 255;
    --bs-white: #fff;
    --bs-body-font-family: var(--mw-font-family);
    --bs-body-font-size: 1rem;
    --bs-body-line-height: 21px;
    --bs-border-color: #dfe5eb;
    --bs-body-color: #111111;
    --bs-border-radius: 10px;
    --bs-primary: #05a6f0;
    --tw-ring-color: #05a6f0;
    --bs-secondary: #4c5773;
    --bs-success: #1faf5f;
    --bs-warning: #ff6600;
    --bs-danger: #dc3545;
    --bs-light: #f8f9fb;
    --bs-purple: #714b67;
    --bs-border-radius: 10px;
    --node-js: linear-gradient(270deg, rgba(128, 188, 0, 0.3) 0%, rgba(0, 117, 201, 0.3) 100%), #fff;
    --django: linear-gradient(270deg, rgba(33, 74, 53, 0.3) 0%, rgba(101, 178, 141, 0.3) 100%), #fff;
    --laravel: linear-gradient(270deg, rgba(249, 50, 44, 0.3) 1.28%, rgba(253, 129, 125, 0.3) 100%), #ffffff;
    --flutter: linear-gradient(270deg, rgba(105, 51, 238, 0.3) 1.28%, rgba(142, 104, 241, 0.3) 100%), #ffffff;
    --aiml: radial-gradient(78.24% 78.24% at 51.15% 42.34%, rgba(0, 122, 255, 0) 51.04%, rgba(0, 122, 255, 0.22) 94.27%), #fff;
    --android: linear-gradient(0deg, rgba(164, 198, 57, 0.3), rgba(164, 198, 57, 0.3)), #ffffff;
    --ios: linear-gradient(
            286.03deg,
            rgba(95, 201, 248, 0.3) 2.48%,
            rgba(254, 203, 46, 0.3) 21.32%,
            rgba(253, 148, 38, 0.3) 40.16%,
            rgba(252, 49, 88, 0.3) 59.01%,
            rgba(20, 126, 251, 0.3) 77.85%,
            rgba(83, 215, 105, 0.3) 96.69%
        ),
        #ffffff;
    --reactjs: linear-gradient(0deg, rgba(20, 158, 202, 0.3), rgba(20, 158, 202, 0.3)), #ffffff;
    --vuejs: linear-gradient(270deg, rgba(66, 184, 134, 0.3) 0%, rgba(100, 126, 255, 0.3) 100%), #fff;
    --angularjS: linear-gradient(270deg, rgba(226, 50, 55, 0.3) 0%, rgba(181, 46, 49, 0.3) 100%), #fff;
    --uiux: linear-gradient(135deg, rgba(104, 77, 210, 0.1) 0%, rgba(188, 90, 161, 0.2) 100%), #ffffff;
    --shopify: linear-gradient(270deg, rgba(149, 191, 70, 0.3) 0%, rgba(94, 142, 62, 0.3) 100%), #fff;
    --magento: linear-gradient(270deg, rgba(31, 110, 12, 0.3) 0%, rgba(110, 173, 95, 0.3) 100%), #fff;
    --woocommerce: linear-gradient(270deg, rgba(46, 170, 250, 0.09) 0%, rgba(31, 47, 152, 0.09) 100%), #fff;
    --opencart: linear-gradient(270deg, rgba(54, 194, 237, 0.15) 0%, rgba(155, 224, 246, 0.3) 100%), #fff;
    --wordpress: linear-gradient(0deg, rgba(177, 190, 198, 0.3) 0%, rgba(177, 190, 198, 0.3) 100%), #fff;
    --fullstack: linear-gradient(270deg, rgba(249, 200, 89, 0.23) 0%, rgba(90, 185, 206, 0.23) 100%), #fff;
    --meanstack: linear-gradient(0deg, #f8d1d0 0%, #f8d1d0 100%), #fff;
    --simpro: linear-gradient(270deg, rgba(0, 120, 218, 0.3) 0%, rgba(0, 212, 255, 0.3) 100%), #fff;
    --mobileapp: linear-gradient(270deg, rgba(212, 252, 121, 0.3) 0%, rgba(150, 230, 161, 0.3) 100%), #fff;
    --ionicapp: linear-gradient(270deg, rgba(132, 250, 176, 0.3) 0%, rgba(143, 211, 244, 0.3) 100%), #fff;
    --webapp: linear-gradient(270deg, rgba(242, 153, 74, 0.3) 0%, rgba(242, 201, 76, 0.3) 100%), #fff;
    --php: linear-gradient(270deg, rgba(74, 194, 154, 0.3) 0%, rgba(178, 254, 250, 0.3) 0.01%, rgba(14, 210, 247, 0.3) 100%), #fff;
    --codeigniter: linear-gradient(270deg, rgba(97, 144, 232, 0.3) 0%, rgba(167, 191, 232, 0.3) 100%), #fff;
    --jqueryapp: linear-gradient(270deg, rgba(255, 175, 189, 0.3) 0%, rgba(255, 195, 160, 0.3) 100%), #fff;
    --devops: linear-gradient(270deg, rgba(52, 148, 230, 0.3) 0%, rgba(236, 110, 173, 0.3) 100%), #fff;
    --iphoneapp: linear-gradient(270deg, rgba(41, 128, 185, 0.3) 0%, rgba(109, 213, 250, 0.3) 100%), #fff;
    --ipadeapp: linear-gradient(270deg, rgba(44, 125, 103, 0.3) 0%, rgba(153, 242, 200, 0.3) 100%), #fff;
    --hybridapp: linear-gradient(270deg, rgba(131, 96, 195, 0.3) 0%, rgba(46, 191, 145, 0.3) 100%), #fff;
    --yii: linear-gradient(270deg, rgba(0, 180, 219, 0.3) 0%, rgba(0, 131, 176, 0.3) 100%), #fff;
    --cakephp: linear-gradient(270deg, rgba(168, 192, 255, 0.3) 0%, rgba(63, 43, 150, 0.3) 100%), #fff;
    --symfony: linear-gradient(270deg, rgba(132, 16, 132, 0.3) 0%, rgba(255, 192, 203, 0.3) 100%), #fff;
    --zend: linear-gradient(270deg, rgba(77, 160, 176, 0.3) 0%, rgba(211, 157, 56, 0.3) 100%), #fff;
    --wearable: linear-gradient(270deg, rgba(212, 57, 58, 0.3) 0%, rgba(240, 203, 53, 0.3) 100%), #fff;
    --enterprise: linear-gradient(271deg, rgba(66, 184, 134, 0.3) 0.45%, rgba(100, 126, 255, 0.3) 98.49%), #fff;
    --xxl: 48px;
    --xxl-lnh: 64px;
    --xl: 36px;
    --xl-lnh: 50px;
    --lgxl: 30px;
    --lgxl-lnh: 40px;
    --lg: 24px;
    --lg-lnh: 36px;
    --mdlg: 20px;
    --mdlg-lnh: 30px;
    --md: 17px;
    --md-lnh: 25px;
    --sm: 14px;
    --sm-lnh: 20px;
    --xs: 12px;
    --xs-lnh: 16px;
    --xxs: 10px;
    --xs-lnh: 14px;
    --bs-btn-font-size: 17px;
}

@media (prefers-color-scheme: dark) {
    :root {
        --foreground-rgb: 255, 255, 255;
        --background-start-rgb: 0, 0, 0;
        --background-end-rgb: 0, 0, 0;
    }
}

.from-neutral-100 {
    --tw-gradient-from: #f8f9fb var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(245 245 245 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.bg-gradient-to-t {
    background-image: linear-gradient(to top, var(--tw-gradient-stops));
}

.bg-neutral-300 {
    --tw-bg-opacity: 1;
    background-color: rgb(212 212 212 / var(--tw-bg-opacity, 1));
}

html,
body {
    margin: 0;
    padding: 0;
    outline: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: var(--mw-font-family);
}
body {
    @apply text-body;
    line-height: var(--bs-body-line-height);
    font-weight: 400;
    overflow-x: hidden;
}
/*loader css start*/
#preloader {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 99999;
    overflow: hidden;
    background: white;
}
.lds-ripple {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
    left: 50%;
    top: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
.lds-ripple:before,
.lds-ripple:after {
    content: '';
    position: absolute;
    border: 4px solid var(--bs-primary);
    opacity: 1;
    border-radius: 50%;
    -webkit-animation: lds-ripple 2s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    animation: lds-ripple 2s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}
.lds-ripple:after {
    -webkit-animation-delay: -1s;
    animation-delay: -1s;
}
@-webkit-keyframes lds-ripple {
    0% {
        top: 36px;
        left: 36px;
        width: 0;
        height: 0;
        opacity: 1;
    }
    100% {
        top: 0px;
        left: 0px;
        width: 72px;
        height: 72px;
        opacity: 0;
    }
}
@keyframes lds-ripple {
    0% {
        top: 36px;
        left: 36px;
        width: 0;
        height: 0;
        opacity: 1;
    }
    100% {
        top: 0px;
        left: 0px;
        width: 72px;
        height: 72px;
        opacity: 0;
    }
}
/*loader css end*/
.link-whatsapp {
    color: #25d366;
}
.link-whatsapp:hover {
    color: #075e54;
    transition: all ease-in-out 0.2s;
    -webkit-transition: all ease-in-out 0.2s;
}
.link-footer:hover {
    color: rgb(5 166 240 / var(--tw-bg-opacity));
    transition: all ease-in-out 0.2s;
    -webkit-transition: all ease-in-out 0.2s;
}
.stretched-link::after {
    @apply absolute inset-0 z-[1];
    content: '';
}
a,
a:hover {
    transition: all 0.3s ease;
}
ul,
li {
    list-style-type: none;
}
ul.list {
    @apply pl-5;
}
ul.list,
ul.list li {
    list-style-type: disc;
}
ul.list-decimal,
ul.list-decimal li {
    list-style-type: decimal;
}
.row {
    @apply gap-10;
}
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700;
}
/* font size start */
h1,
.fs-xxl {
    font-size: var(--xxl);
    line-height: var(--xxl-lnh);
}
h2,
.fs-xl {
    font-size: var(--xl);
    line-height: var(--xl-lnh);
}
h3,
.fs-lg {
    font-size: var(--lg);
    line-height: var(--lg-lnh);
}
.fs-lgxl {
    font-size: var(--lgxl);
    line-height: var(--lgxl-lnh);
}
.fs-mdlg {
    font-size: var(--mdlg);
    line-height: var(--mdlg-lnh);
}
h4,
.fs-md {
    font-size: var(--md);
    line-height: var(--md-lnh);
}
h5,
.fs-sm {
    font-size: var(--sm);
    line-height: var(--sm-lnh);
}
h6,
.fs-xs {
    font-size: var(--xs);
    line-height: var(--xs-lnh);
}
.fs-xxs {
    font-size: var(--xxs);
    line-height: var(--xxs-lnh);
}
/* font size end */
/*font weight start*/
.font-regular,
.fw-400 {
    font-weight: 400 !important;
}
h1,
.font-bold,
.fw-700,
.fw-bold {
    font-weight: 700;
}
.font-semibold,
.fw-600 {
    font-weight: 600;
}
.fw-500,
.font-medium {
    font-weight: 500;
}
/*font weight end*/
/* background start */
.bg-purple {
    background-color: var(--bs-purple);
}
.bg-vuejs {
    background: var(--vuejs);
}
.bg-reactjs {
    background: var(--reactjs);
}
.bg-iosapp {
    background: var(--ios);
}
.bg-androidapp {
    background: var(--android);
}
.bg-flutterapp {
    background: var(--flutter);
}
.bg-aiml {
    background: var(--aiml);
}
.bg-laravel {
    background: var(--laravel);
}
.bg-nodejs {
    background: var(--node-js);
}
.bg-django {
    background: var(--django);
}
.bg-angular {
    background: var(--angularjS);
}
.bg-uiux {
    background: var(--uiux);
}
.bg-php {
    background: var(--php);
}
.bg-shopify {
    background: var(--shopify);
}
.bg-magento {
    background: var(--magento);
}
.bg-woo-commerce {
    background: var(--woocommerce);
}
.bg-opencart {
    background: var(--opencart);
}
.bg-wordpress {
    background: var(--wordpress);
}
.bg-fullstack {
    background: var(--fullstack);
}
.bg-meanstack {
    background: var(--meanstack);
}
.bg-simpro {
    background: var(--simpro);
}
.bg-mobileapp {
    background: var(--mobileapp);
}
.bg-ionicapp {
    background: var(--ionicapp);
}
.bg-webapp {
    background: var(--webapp);
}
.bg-codeigniter {
    background: var(--codeigniter);
}
.bg-jqueryapp {
    background: var(--jqueryapp);
}
.bg-devops {
    background: var(--devops);
}
.bg-yii {
    background: var(--yii);
}
.bg-cakephp {
    background: var(--cakephp);
}
.bg-grey {
    background-color: var(--bs-light);
}
.bg-enterprise {
    background-color: var(--bs-border-color);
}
.bg-symfony {
    background: var(--symfony);
}
.bg-zend {
    background: var(--zend);
}
.bg-wearable {
    background: var(--wearable);
}
.bg-iphoneapp {
    background: var(--iphoneapp);
}
.bg-ipadeapp {
    background: var(--ipadeapp);
}
.bg-hybridapp {
    background: var(--hybridapp);
}
.bg-enterprise-software {
    background: var(--enterprise);
}
.bg-hero {
    background: radial-gradient(78.23% 78.23% at 51.15% 42.34%, rgba(0, 122, 255, 0) 51.04%, rgba(0, 122, 255, 0.22) 94.27%),
        hsla(0, 0%, 100%, 0);
}
.bg-aiml-service {
    @apply bg-[url('/img/ai-ml-background.webp')];
}
.bg-python-service {
    @apply bg-[url('/img/python/webp/img-service-offered.webp')];
}
.bg-agriculture {
    @apply bg-primary_one;
}
/* background end */
p {
    @apply text-secondary dark:text-light text-xl mb-4;
}
hr {
    @apply my-4 h-px border-t-0;
}
.text-purple {
    color: var(--bs-purple);
}
.ic {
    @apply h-6 w-6 min-w-[24px];
}
.ic-m {
    @apply h-6 w-6;
    fill: currentColor;
}

svg {
    @apply inline;
    color: inherit;
}
svg.ic {
    fill: currentColor;
}
.ic-45 {
    @apply h-[45px] w-[45px];
}
.ic-49 {
    @apply h-[49px] w-[49px];
}
img,
svg {
    @apply inline align-middle;
}
.top-border-edge {
    @apply mb-[-1px] leading-none;
}
.top-border-edge svg,
.bottom-border-edge svg {
    @apply w-full h-auto;
    fill: inherit;
}
.bottom-border-edge {
    @apply mt-[-1px] leading-none;
}
.process-section {
    @apply mb-[-40px];
}
img {
    @apply max-w-none;
}
.img-fluid {
    @apply max-w-full h-auto;
}
.section-py {
    @apply py-[70px] lg:py-[100px];
}
.section-pt {
    @apply pt-[200px];
}
.section-pb {
    @apply pb-[100px];
}
.section-ptt {
    @apply pt-[100px];
}
.i {
    @apply h-6 w-6;
    fill: currentColor;
}
.btn:after {
    content: '';
    background: rgba(255, 255, 255, 0.5);
    transform: scale(1, 1) translate(-50%);
    transform-origin: 50% 50%;
    @apply absolute top-1/2 left-1/2 opacity-0 rounded-[100%] w-[5px] h-[5px]; /* position: absolute; top: 50%; left: 50%; width: 5px; height: 5px; */
}
.btn:hover:not(:active)::after {
    animation: ripple 1s ease-out;
}
@keyframes ripple {
    0% {
        transform: scale(0, 0);
        opacity: 1;
    }
    20% {
        transform: scale(25, 25);
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: scale(40, 40);
    }
}
.bs-border {
    border-color: var(--bs-border-color);
}
/*css for scrollbar Start*/
/* Styles for WebKit browsers (Chrome, Safari) */
@supports (-webkit-appearance: none) {
    *::-webkit-scrollbar {
        width: 5px;
        height: 5px;
    }

    *::-webkit-scrollbar-track {
        background-color: #f2f2f2;
    }

    *::-webkit-scrollbar-thumb {
        background-color: #d0d0d0;
        border-radius: 4px;
    }
}

/* Optionally, you can include specific Firefox styles if you need */
@supports (-moz-appearance: none) {
    * {
        scrollbar-width: thin;
        scrollbar-color: #d0d0d0 #f2f2f2;
    }
}

/*css for scrollbar End*/
/* -----------animation css start--------------- */
.mw_move_y {
    -webkit-animation: mw_move_y 1s infinite alternate;
    animation: mw_move_y 1s infinite alternate;
}
/* mw move */
@keyframes mw_move_y {
    0% {
        transform: translateY(-10px);
        -webkit-transform: translateY(-10px);
    }
    to {
        transform: translateY(10px);
        -webkit-transform: translateY(10px);
    }
}
@-webkit-keyframes mw_move_y {
    0% {
        transform: translateY(-10px);
        -webkit-transform: translateY(-10px);
    }
    to {
        transform: translateY(10px);
        -webkit-transform: translateY(10px);
    }
}
@-moz-keyframes mw_move_y {
    0% {
        transform: translateY(-10px);
        -webkit-transform: translateY(-10px);
    }
    to {
        transform: translateY(10px);
        -webkit-transform: translateY(10px);
    }
}
/* -----------animation css end--------------- */

/* nav tabs Technology Stack case study css start */

.tab-items button {
    font-size: var(--md);
        line-height: var(--md-lnh);
        color: var(--bs-body-color);
    @apply focus:outline-none focus:shadow-none focus:ring-0 bg-transparent py-[10px] px-[15px] font-bold border-b-4 border-transparent dark:text-white;
   
}
.tab-items button.active {
    border-color: var(--bs-primary);
    box-shadow: none !important;
}
.tech-box {
    border: 1px solid var(--bs-border-color);
    @apply flex flex-col rounded-10 bg-white dark:bg-[#3C45611A] justify-center items-center w-[178px] h-[120px] mt-[18px] dark:border-[#ffffff33] dark:border dark:border-solid;
   
}
.tech-box p {
    color: var(--bs-body-color);
    @apply dark:text-white;
}
.tech-box:hover {
    border-color: var(--bs-primary);
    box-shadow: 0px 0px 0px 1px var(--bs-primary);
    transition: all ease-in-out 0.2s !important;
}
.bg-casestudy {
    @apply bg-transparent;
}
.stack-border {
    @apply mt-0 mb-3;
    color: var(--bs-secondary);
    background-color: currentColor;
}

/* case study */

.case-study-slider {
    @apply bg-[#f5f6f9] border border-[#d7dee5] dark:bg-black;
}

.case-study-slider .card-description {
    @apply py-[40px] pr-[20px] pl-[40px];
}

.slick-prev,
.slick-next {
    @apply text-[17px] text-black;
}

.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
    @apply text-black;
}

.case-study-slider-img .slick-arrow {
    @apply !cursor-pointer;
}

.case-study-slider-img .slick-prev {
    @apply !cursor-pointer;
}

.case-study-slider-img .slick-arrow.slick-prev {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUgMTJIMTlNNSAxMkw5IDE2TTUgMTJMOSA4IiBzdHJva2U9IiMxMTExMTEiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=) !important;
    background-size: 24px 24px !important;
    text-indent: -9999px; /* Hides the "Next" text */
    background: none;
    @apply inline-block !w-[50px] h-[50px] !bg-no-repeat !bg-center rounded-[50%] !border-2 border-[#111111] !border-solid dark:border-white;
}

.dark .case-study-slider-img .slick-arrow.slick-prev {@apply !bg-[url('/img/llms-aiml/svg/icon-left-arrow.svg')]; }

.case-study-slider-img .slick-arrow.slick-next {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjUiIHZpZXdCb3g9IjAgMCAyNCAyNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUgMTIuNUgxOU0xOSAxMi41TDE1IDE2LjVNMTkgMTIuNUwxNSA4LjUiIHN0cm9rZT0iIzExMTExMSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==) !important;
    background-size: 24px 24px !important;
    text-indent: -9999px; /* Hides the "Next" text */
    background: none;
    @apply inline-block !w-[50px] h-[50px] !bg-no-repeat !bg-center rounded-[50%] !border-2 border-[#111111] !border-solid dark:border-white;
}

.dark .case-study-slider-img .slick-arrow.slick-next {@apply !bg-[url('/img/llms-aiml/svg/icon-right-arrow.svg')]}

.case-study-slider-img .slick-arrow {
    @apply top-[105%] z-10;
}

.case-study-slider-img .slick-prev {
    @apply !left-auto right-[70px];
}

.case-study-slider-img .slick-dots li button {
    @apply w-full border border-[#d7dee5] border-solid rounded-none bg-[#d7dee5] p-0 h-[6px];
}
.case-study-slider-img .slick-dots li.slick-active button {
    @apply bg-primary_one opacity-100 border-transparent indent-[-100000px] dark:bg-primary;
}
.case-study-slider-img .slick-dots li {
    @apply h-2 m-0 flex-1;
}

/* Testimonial slider with white arrows */
.testimonial-slider-img .slick-arrow {
    @apply !cursor-pointer top-[105%] z-10;
}

.testimonial-slider-img .slick-prev {
    @apply !cursor-pointer !left-auto right-[70px];
}

.testimonial-slider-img .slick-arrow.slick-prev {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUgMTJIMTlNNSAxMkw5IDE2TTUgMTJMOSA4IiBzdHJva2U9IiNmZmZmZmYiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=) !important;
    background-size: 24px 24px !important;
    text-indent: -9999px; /* Hides the "Prev" text */
    background: none;
    @apply inline-block !w-[50px] h-[50px] !bg-no-repeat !bg-center rounded-[50%] !border-2 border-white !border-solid;
}

.testimonial-slider-img .slick-arrow.slick-next {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjUiIHZpZXdCb3g9IjAgMCAyNCAyNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUgMTIuNUgxOU0xOSAxMi41TDE1IDE2LjVNMTkgMTIuNUwxNSA4LjUiIHN0cm9rZT0iI2ZmZmZmZiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==) !important;
    background-size: 24px 24px !important;
    text-indent: -9999px; /* Hides the "Next" text */
    background: none;
    @apply inline-block !w-[50px] h-[50px] !bg-no-repeat !bg-center rounded-[50%] !border-2 border-white !border-solid;
}

.case-study-img {
    @apply rounded-tr-[10px] rounded-br-[10px];
}

.case-study-slider-img .slick-dots li:last-child button {
    @apply rounded-tr-[10px] rounded-br-[10px];
}

.case-study-slider-img .slick-dots li:first-child button {
    @apply rounded-tl-[10px] rounded-bl-[10px];
}

.case-study-slider-img .slick-track {
    @apply mb-[30px];
}

.case-study-slider-img .slick-dots {
    @apply !flex justify-between mt-0 bottom-0 top-[110%] !w-[calc(100%-154px)];
}

.case-study-slider-img .slick-dots li button:before {
    @apply border-none;
}

.slick-dots li.slick-active button:before {
    background: none !important;
}

.testimonail-slider-card {
    @apply p-5 bg-white;
}

.case-study-slider.testimonail-slider-card .card-description {
    @apply p-0;
}

.testimonail-slider-text {
    @apply text-[22px] border-b-2 border-solid border-[#d7dee5];
}

.testimonial-slider-img.case-study-slider-img .slick-dots li button {
    @apply border border-solid border-white bg-[#d7dee5];
}

.testimonial-slider-img.case-study-slider-img .slick-dots li.slick-active button {
    @apply bg-black border-transparent opacity-100 indent-[-100000px] dark:bg-primary;
}

.testimonial-client-img {
    @apply rounded-10;
}

.ai-enabled-slider.case-study-slider-img .slick-dots {
    @apply top-[112%];
}
.ai-enabled-slider.case-study-slider-img .slick-dots li.slick-active button {
    @apply bg-[#00B050];
}

/* nav tabs Technology Stack case study css end */
.card {
    border: 1px solid var(--bs-border-color);
}
.card:hover {
    border-color: var(--bs-primary);
    box-shadow: 0px 0px 0px 1px var(--bs-primary);
    -webkit-box-shadow: 0px 0px 0px 1px var(--bs-primary);
    -moz-box-shadow: 0px 0px 0px 1px var(--bs-primary);
    transition: all ease-in-out 0.2s;
    -webkit-transition: all ease-in-out 0.2s;
    -moz-transition: all ease-in-out 0.2s;
    -o-transition: all ease-in-out 0.2s;
}
.nav-item {
    @apply px-[15px] py-5;
}
.work-nav .dropdown-item {
    @apply font-medium;
}
.dropdown-item {
    @apply py-[0.65rem] px-[1.25rem];
    transition: all 0.3s ease;
}
.dropdown-item:hover {
    color: var(--bs-primary);
}
/* header */
header {
    background: rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(7.5px);
    box-sizing: border-box;
}
.shine {
    @apply relative overflow-hidden cursor-pointer;
}
.shine::before {
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
    transform: skewX(-25deg);
    @apply content-[''] absolute top-0 left-[-75%] w-[50%] h-full z-[2] block;
}
@-webkit-keyframes shine {
    100% {
        left: 125%;
    }
}
@keyframes shine {
    100% {
        left: 125%;
    }
}
.shine:hover::before {
    -webkit-animation: shine 0.85s;
    animation: shine 0.85s;
}
.menu-button {
    @apply text-body leading-25 font-bold border-b border-light pb-4 pt-30;
}
.dark .menu-button { --tw-border-opacity: 70%;}
.menu-body a {
    @apply text-body leading-25 font-medium;
}
.sub-menu {
    @apply lg:px-3;
}
@media screen and (min-width: 992px) {
    .has-menu {
        @apply relative;
    }
    .sub-menu {
        @apply flex fixed bg-white left-0 right-0 overflow-auto rounded-10 lg:px-0 h-0 m-auto translate-x-[-30px] skew-x-2;
    }
    .sub-menu {
        transition: 0.4s ease all;
        transform: translateX(-30px) skewX(2deg);
        filter: drop-shadow(0px 4px 20px rgba(0, 0, 0, 0.1));
        @apply max-h-[100vh] opacity-0 max-w-[1440px];
    }
    .dark .sub-menu {
    filter: 
        drop-shadow(0px 4px 20px rgba(255, 255, 255, 0.05))     /* bottom */
        drop-shadow(0px -4px 20px rgba(255, 255, 255, 0.05))    /* top */
        drop-shadow(4px 0px 20px rgba(255, 255, 255, 0.05))     /* right */
        drop-shadow(-4px 0px 20px rgba(255, 255, 255, 0.05));   /* left */
}

    .has-menu.open-megamenu .sub-menu {
        @apply h-auto min-h-[520px] opacity-100 p-0;
    }
    .has-menu.open-megamenu .sub-menu.service-menu {
        @apply h-auto min-h-[415px] opacity-100 p-0 top-20;
    }
    .has-menu.open-megamenu .sub-menu {
        @apply top-20 z-[100];
        transform: translateX(0) skew(0deg);
        transition: 0.4s ease all;
    }
    .sub-menu ul,
    .sub-menu li:not(.social-mail) {
        list-style-type: none;
        @apply p-0 text-left;
    }
    .sub-menu > li:not(.social-mail) {
        @apply pr-[40px] flex-1;
    }
    .sub-menu > li.social-mail {
        width: calc(100% - 290px);
    }
    .sub-menu > li.owner-box {
        flex-grow: initial;
        flex-basis: 330px;
    }
    .dark .social-mail {--tw-border-opacity: 70%;}
}
/* header end */
/* hero section css start */
.custom-hero-height {
    @apply !min-h-[705px];
}

.hero {
    @apply relative overflow-hidden min-h-[660px] max-h-[900px] flex flex-col;
}

.hero .top-hero {
    @apply flex-1;
}

.home-hero::after {
    @apply content-none;
}
.hero-row {
    @apply grid-cols-[repeat(2,1fr)];
}
.hero-content {
    @apply relative py-20 px-0 z-20;
}
.home-hero {
    @apply text-[15px];
}
.slide-title {
    @apply leading-[50px];
}
.hero-dashboard-img {
    @apply grid gap-4 w-[670px] absolute h-full top-2.5;
}
.hero-dashboard-img img.dashboard-img {
    @apply w-auto h-[700px];
    aspect-ratio: 1686 / 960;
    transform: translate(53px, -4px);
}
picture.pic-bg img {
    @apply absolute top-0 w-auto h-[950px] z-[-1];
    aspect-ratio: 1032 / 1021;
    transform: translate(-40px, -22%);
}
picture.pic-bg.red img {
    aspect-ratio: 1021 / 983;
    transform: translate(-25px, -22%);
}
picture.pic-bg.green img {
    aspect-ratio: 1021 / 933;
}
picture.pic-bg.orange img {
    aspect-ratio: 1021 / 915;
}
picture.pic-bg.yellow img {
    aspect-ratio: 1021 / 847;
}
.hero-vue-img {
    @apply h-full w-auto;
}
.hero-tech-img {
    @apply absolute h-[550px] top-5;
}
.odoo-baneer-img-height .hero-vue-img img {
    @apply h-[500px] w-auto;
}
.hero-app-img {
    @apply absolute top-0 lg:top-2/4 right-0;
    transform: translateY(-50%);
}
@media only screen and (min-width: 1024px) and (orientation: portrait) {
    .hero {
        @apply h-auto;
    }
    .hero-dashboard-img img.dashboard-img {
        @apply h-[55vh];
    }
}
/* hero section css end */
/* Vue-js-application */
.video-main {
    @apply text-center ml-[-40px];
}
.application-video-one video {
    @apply rounded-10 w-[34rem];
    max-width: calc(100% - 55px);
    filter: drop-shadow(0px 4px 10px rgba(0, 0, 0, 0.2));
}
.application-video-two {
    @apply static;
    transform: translateX(40px);
    margin-top: calc(-69% + 100px);
}

.project-logo img {
filter: brightness(0);
    transition: filter 500ms linear;
    @apply cursor-pointer;

}
.dark .project-logo img {
    filter: brightness(0) invert(0.9) ;
}
.project-logo {
    transition: opacity 500ms linear; /* Apply transitions to opacity */
    @apply py-[5px] px-[25px] h-auto;
}

/* Adjust opacity instead of scale */
.client-logo-listing:hover .project-logo {
    @apply opacity-[0.8];
}

.client-logo-listing .project-logo:hover {
    @apply opacity-100;
}

/* Use opacity for image filter effects */
.client-logo-listing .project-logo:hover img {
    filter: grayscale(0);
    transition: filter 500ms linear;
}

.client-carousel:after,
.client-carousel:before {
    @apply absolute right-0 top-0 bottom-0 w-[170px] z-[1] content-[''];
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 42%, rgb(255 255 255) 100%);
}
.client-carousel:before {
    @apply right-auto	left-0;
    background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(2, 0, 36, 0) 100%);
}
.dark .client-carousel:after {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 42%, rgb(0 0 0) 100%);
}
.dark .client-carousel:before {
    background: linear-gradient(90deg, rgb(0 0 0) 0%, rgba(2, 0, 36, 0) 100%);
}
.splide__list {
    @apply items-center;
}
.splide__slide {
    @apply text-center;
}
/* client logo css end */
.cs-card > div {
    @apply overflow-hidden relative;
}
.cs-video {
    -o-object-fit: cover;
    @apply object-cover bg-transparent w-full;
}
/* service list css start */
.services-listing {
    @apply relative mt-50 z-10;
}
.services-listing:before {
    @apply absolute w-full left-1 right-0 top-[87px] content-[''];
    border-bottom: 2px dashed #6b7c93;
}
.dark .services-listing:before {
    border-bottom: 2px dashed white;
}
.service-card .service-title {
    @apply relative inline-block ml-2 align-middle mb-50 py-[10px] px-[15px] bg-[#111111] dark:bg-secondary;
    
    color: var(--bs-white);
    border-radius: 10px 10px 10px 0px;
    transition: all ease-in-out 0.2s;
    -webkit-transition: all ease-in-out 0.2s;
    -moz-transition: all ease-in-out 0.2s;
    -ms-transition: all ease-in-out 0.2s;
}

.service-card .service-title > * {
    @apply m-0 font-bold;
    color: var(--bs-heading-color);
    font-size: var(--md);
    line-height: var(--md-lnh);
}
.service-card .service-title:before,
.service-card .star-stat:after {
    @apply absolute inline-block content-[''];
    transition: all ease-in-out 0.2s;
    -webkit-transition: all ease-in-out 0.2s;
    -moz-transition: all ease-in-out 0.2s;
    -ms-transition: all ease-in-out 0.2s;
}
.service-card .service-title:before {
    @apply left-0 bottom-[-14px];
    border-bottom: 15px solid transparent;
    border-left: 15px solid var(--bs-body-color);
}
.dark .service-card .service-title:before {
    border-left: 15px solid var(--bs-secondary);}
.service-card .star-stat:after {
    @apply w-4 h-4 rounded-full left-[-7px] bottom-[-50px] bg-[#1a192c] dark:bg-secondary;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
}
.service-card .service-list {
    @apply p-0 mt-5;
}
.service-card .service-list li {
    @apply cursor-pointer list-none font-semibold;
    line-height: var(--md-lnh);
    font-size: var(--md);
    text-decoration: none;
    transition: all ease-in-out 0.2s;
    -webkit-transition: all ease-in-out 0.2s;
    -moz-transition: all ease-in-out 0.2s;
    -ms-transition: all ease-in-out 0.2s;
}
.service-card .service-list li:hover {
    color: var(--bs-success);
}
.service-card:hover .service-title {
    background-color: var(--bs-success);
}
.service-card:hover .service-title:after {
    background-color: var(--bs-success);
}
.service-card:hover .service-title:before {
    border-left-color: var(--bs-success);
}
/* service list css end */
/* serving css start */
.serving-bg {
    border-width: 1px 0px;
    border-style: solid;
    border-color: var(--bs-border-color);
    background: linear-gradient(
        180deg,
        rgba(223, 229, 235, 0) 0%,
        rgba(223, 229, 235, 0.5) 39.58%,
        rgba(223, 229, 235, 0.5) 64.06%,
        rgba(223, 229, 235, 0) 100%
    );
}
.dark .serving-bg {
    border-width: 0px ;

    background: linear-gradient(180deg,
            rgba(223, 229, 235, 0) 0%,
            #0F1534 39.58%,
                #0F1534 64.06%,
            rgba(223, 229, 235, 0) 100%);;
}

.img-serving-bg {
    @apply absolute top-1/2 left-1/2 w-full h-auto;
    transform: translate(-50%, -50%);
}
.serving-content {
    @apply px-0 py-[173px];
}
.serving__logo {
    @apply w-[85px] h-[85px] absolute bg-white  p-2.5 flex items-center justify-center 
    rounded-[50%];
    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.1);
}
.serving__logo img {
    @apply block w-9 h-9;
}
.serving__logo1 {
    animation-delay: 1s;
    @apply top-[8%] left-[9%];
}
.serving__logo2 {
    animation-delay: 1.2s;
    @apply top-[31%] left-[16%];
}
.serving__logo3 {
    animation-delay: 1.8s;
    @apply top-[57%] left-[4%];
}
.serving__logo4 {
    animation-delay: 1.6s;
    @apply top-[75%] left-[15%];
}
.serving__logo5 {
    animation-delay: 1.8s;
    @apply top-[18%] right-[15%];
}
.serving__logo6 {
    animation-delay: 2s;
    @apply top-[38%] right-[5%];
}
.serving__logo7 {
    animation-delay: 1.5s;
    @apply top-[53%] right-[17%];
}
.serving__logo8 {
    animation-delay: 1.9s;
    @apply top-[72%] right-[9%];
}
/* client testimonial css start */
.client-testimonial .card {
    @apply inline-block;
    break-inside: avoid-column;
}
.project-testimonial .card-description {
    @apply max-h-[227px] min-h-[227px];
}
.slick-slide {
    @apply py-px;
}
.slick-dots {
    @apply top-auto !bottom-[-73px];
}
.slick-dots li {
    @apply w-5 h-5 m-0 text-center ml-[5px];
}
.slick-dots li button {
    @apply w-5 h-5 p-0 m-auto;
}
.slick-dots li button:before {
    @apply !opacity-100 bg-transparent !w-3 !h-3 rounded-full left-[5px] !content-[''];
    border: 2px solid var(--bs-secondary);
}
.slick-dots li.slick-active button:before {
    @apply !opacity-100;
    background: var(--bs-secondary);
}
.client-testimonial-slider .slick-slider:before,
.client-testimonial-slider .slick-slider:after {
    @apply absolute top-0 w-[100px] h-full z-10 max-w-[10%] content-[''];
}
.client-testimonial-slider .slick-slider:before {
    @apply left-0;
    background-image: linear-gradient(-90deg, rgba(248, 249, 251, 0) 0%, #f8f9fb 100%);
    -webkit-background-image: linear-gradient(-90deg, rgba(248, 249, 251, 0) 0%, #f8f9fb 100%);
    -moz-background-image: linear-gradient(-90deg, rgba(248, 249, 251, 0) 0%, #f8f9fb 100%);
    -ms-background-image: linear-gradient(-90deg, rgba(248, 249, 251, 0) 0%, #f8f9fb 100%);
}
.client-testimonial-slider .slick-slider:after {
    @apply right-0;
    background-image: linear-gradient(90deg, rgba(248, 249, 251, 0) 0%, #f8f9fb 100%);
    -moz-background-image: linear-gradient(90deg, rgba(248, 249, 251, 0) 0%, #f8f9fb 100%);
    -webkit-background-image: linear-gradient(90deg, rgba(248, 249, 251, 0) 0%, #f8f9fb 100%);
    -ms-background-image: linear-gradient(90deg, rgba(248, 249, 251, 0) 0%, #f8f9fb 100%);
}
.client-testimonial-slider.yellow-overlay .slick-slider:before {
    @apply left-0;
    background-image: linear-gradient(-90deg, rgba(248, 249, 251, 0) 0%, #ffd828 100%);
    -webkit-background-image: linear-gradient(-90deg, rgba(248, 249, 251, 0) 0%, #ffd828 100%);
    -moz-background-image: linear-gradient(-90deg, rgba(248, 249, 251, 0) 0%, #ffd828 100%);
    -ms-background-image: linear-gradient(-90deg, rgba(248, 249, 251, 0) 0%, #ffd828 100%);
}
.client-testimonial-slider.yellow-overlay .slick-slider:after {
    @apply right-0;
    background-image: linear-gradient(90deg, rgba(248, 249, 251, 0) 0%, #ffd828 100%);
    -moz-background-image: linear-gradient(90deg, rgba(248, 249, 251, 0) 0%, #ffd828 100%);
    -webkit-background-image: linear-gradient(90deg, rgba(248, 249, 251, 0) 0%, #ffd828 100%);
    -ms-background-image: linear-gradient(90deg, rgba(248, 249, 251, 0) 0%, #ffd828 100%);
}
.slick-arrow {
    @apply h-auto max-h-full top-0 bottom-0 !w-[100px] z-[99];
    transform: none;
    cursor:
        url("data:image/svg+xml,%3Csvg width='42' height='24' viewBox='0 0 42 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M36.5 12L5 12M36.5 12L27.5 3M36.5 12L27.5 21' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A")
            21 12,
        e-resize !important;
    cursor: url("data:image/svg+xml,%3Csvg width='42' height='24' viewBox='0 0 42 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M36.5 12L5 12M36.5 12L27.5 3M36.5 12L27.5 21' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A"),
        e-resize !important;
}
.slick-prev {
    @apply !left-0 right-auto text-[0];
    cursor:
        url("data:image/svg+xml,%3Csvg width='42' height='24' viewBox='0 0 42 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12H36.5M5 12L14 21M5 12L14 3' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A")
            21 12,
        e-resize;
    cursor: url("data:image/svg+xml,%3Csvg width='42' height='24' viewBox='0 0 42 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12H36.5M5 12L14 21M5 12L14 3' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A"),
        e-resize !important;
}

.slick-next {
    @apply left-auto right-0 text-[0];
}
.slick-next:before {
    @apply !content-none;
}
.slick-prev:before {
    @apply !content-none;
}

/* client testimonial css end */
.color-transparent {
    @apply text-transparent;
}
/* aiml start */
.service-offered-tabs {
    @apply p-0 border-solid border-[#d7dee5] h-[550px] overflow-y-scroll;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.service-offered-tabs li {
    @apply justify-start border-b border-solid px-5 py-[15px] text-xl font-semibold text-white text-start;
    background: #11111180;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.services-offered-bg {
    background: #11111180;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.service-tabs-header {
    @apply rounded-10;
}
.service-offered-listing li::before {
    @apply bg-[url('/img/icons/ic-square-rounded-check.svg')] bg-contain bg-no-repeat inline-block w-6 h-6 mr-2 align-middle content-[''];
}
.service-active-li .bg-white {
    @apply rounded-none bg-[#05a6f0];
}

.service-active-li {
    @apply !text-white;
}
.technologies-tools-tab .tech-box {
    @apply w-[140px];
}

.technologies-tools-tab .tech-box img {
    @apply w-auto h-11;
}
.technologies-tools-tab .tech-box {
    @apply text-center px-[5px];
}
.technologies-tools-tab .tech-box.tech-box-lg {
    @apply w-[180px];
}
.technologies-tools-tab .tech-box.tech-box-xl {
    @apply w-[200px];
}
.technologies-tools-tab .tab-items button {
    @apply font-semibold;
}
.industry-wise-call {
    @apply rounded-10;
    background:
        linear-gradient(#0b1324, #0b1324) padding-box,
        linear-gradient(90deg, #05a6f0 0%, #ffa500 80%) border-box;
    border: 1px solid transparent;
    backdrop-filter: blur(10px);
}
.industrywise-cases {
    @apply bg-white border border-solid border-[#d7dee5] min-h-[662px];
}
.industrywise-case-heading {
    @apply flex items-center h-[122px] rounded-t-[10px] bg-[url('/img/ai-ml-background.webp')] bg-no-repeat bg-center px-[30px] py-[25px];
}
.python-indus-heading {
    @apply bg-[url('/img/python/webp/img-e-commerce.webp')] h-[100px];
}
.text-grey {
    @apply text-[#d7dee5];
}
.aimlvideo {
    @apply absolute right-0 bottom-0 min-h-full object-cover;
}
.bg-video-gradient{
    background: linear-gradient(180deg,
                black 0%,
                rgba(17, 17, 17, 0) 29.56%,
                rgba(17, 17, 17, 0) 86.02%,
                black 100%);
}
.counter-overlay {
    background: #000000b2;
    inset: 0;
    position: absolute;
}

.case-study-slider-aiml.case-study-slider-img .slick-dots li {
    @apply w-[12%];
}

.case-study-slider-aiml.case-study-slider-img .slick-dots {
    width: calc(100% - 132px) !important;
    @apply top-[108%];
}

/* Work css start */
.reset a {
    color: var(--bs-secondary);
    font-size: var(--md);
    line-height: var(--md-lnh);
    transition: all ease-in-out 0.2s;
    -webkit-transition: all ease-in-out 0.2s;
    @apply font-medium;
}
.reset a:hover {
    color: var(--bs-primary);
}
.work-height {
    @apply h-[374px] min-h-[374px];
}
.top-work {
    height: calc(100% - 65px);
    @apply min-h-[374px];
}
.hero-Work-img {
    @apply absolute w-[555px] ml-[-7rem] translate-y-[-50%];
}
.filters-open {
    transform: translate3d(0px, 11px, 0px);
    font-size: var(--md);
    line-height: var(--md-lnh);
    background-color: var(--bs-white);
    @apply absolute m-0 w-[93%] rounded-10;
}
.filters-open .accordion-button {
    @apply font-medium;
}
.filters-open .accordion-button:not(.collapsed) {
    color: var(--theme-clr);
    @apply bg-[#d7e8ff];
}
.filters-open .accordion-button:focus {
    @apply shadow-none;
}
.blog-card {
    @apply gap-2.5;
    --bs-card-border-width: 0;
    --bs-card-spacer-x: 0;
    --bs-card-spacer-y: 0;
}
.blog-card .card-img-top {
    @apply rounded-10;
}
.blog-card:hover {
    --bs-card-border-width: 0;
    @apply shadow-none;
}
.card.blog-card:hover .card-img-top {
    filter: brightness(75%);
}
.blog-card .card-title {
    font-size: var(--lg);
    line-height: var(--lg-lnh);
}
.chip {
    font-size: var(--md);
    line-height: var(--md-lnh);
    color: var(--bs-body-color);
    border: 1px solid var(--bs-secondary);
    @apply min-h-[35px] font-semibold py-1 px-[15px];
}
/* Work css end */

/* dedicated */
.model-working-in .card-text {
    @apply relative pl-30;
}
.model-working-in .card-text .ic {
    @apply absolute left-0;
}
.dedicated-content li {
    @apply pl-30;
}
.dedicated-content li svg {
    @apply absolute left-0;
}
/* dedicated */
/* hire vue js start */
.custom-min-height {
    @apply min-h-[60px];
}
.process-list {
    /* display: grid; grid-template-columns:repeat(5, 1fr); */
    --item-w: 212px;
    max-width: calc(var(--item-w) * 5);
    @apply flex justify-center relative mx-auto;
}
.process-item {
    width: var(--item-w);
    @apply relative mt-[50px] max-w-[222px] flex-1;
}
.process-icon {
    /* border: 2px dashed var(--bs-body-color); */
    aspect-ratio: 1 /1;
    @apply relative h-[120px] place-items-center;
}
.process-icon:before {
    height: calc(100% - 0px);
    width: calc(100% - 0px);
    border: 2px dashed var(--bs-body-color);
    animation: spin 10s linear infinite;
    @apply absolute rounded-[50%] content-[''];
}
.circle {
    --left: 145px;
    --circle-w: 8.4rem;
    --top: auto;
    position: relative;
    border-radius: 50%;
    width: var(--circle-w);
    height: 1.2rem;
    border-radius: calc(var(--circle-w) + 2px) calc(var(--circle-w) + 2px) 0 0;
    overflow: hidden;
    margin-top: 80px;
    position: absolute;
    left: var(--left);
    top: var(--top);
    flex: 1;
}
.circle:before {
    @apply absolute top-0 left-0 rounded-[50%] content-[''];
    height: calc(var(--circle-w) - 1px);
    width: calc(var(--circle-w) - 1px);
    border: 2px dashed var(--bs-body-color);
    animation: spin 10s linear infinite;
}
.circle-white:before {
    border: 2px dashed var(--bs-white);
}
.circle-reverse {
    transform: rotate(180deg);
    transform-origin: center bottom;
}
.circle-reverse:before {
    animation: spin-reverse 10s linear infinite;
}
.circle-2 {
    left: calc(var(--left) + var(--item-w));
}
.circle-3 {
    left: calc(var(--left) + var(--item-w) * 2);
}
.circle-4 {
    left: calc(var(--left) + var(--item-w) * 3);
}
.circle-5 {
    left: calc(var(--left) + var(--item-w) * 4);
}
.process-list-about {
    max-width: calc(var(--item-w) * 6);
}
.process-list-digital {
    max-width: calc(var(--item-w) * 3);
}
.process-list-aiml {
    max-width: calc(var(--item-w) * 4);
}
.process-list-python {
    max-width: calc(var(--item-w) * 5);
}
.hovertext:hover {
    color: var(--bs-secondary);
    transition: all ease-in-out 0.2s;
    -webkit-transition: all ease-in-out 0.2s;
}

/* fintech */
.process-list-fintech .circle {
    --left: 68px;
    --circle-w: 29rem;
}

.process-list-fintech.process-list {
    --item-w: 300px;
}

.process-list-fintech .process-item {
    @apply max-w-[300px];
}

.process-list-fintech .circle-reverse:before {
    animation: spin-reverse 30s linear infinite;
}

.process-list-fintech .circle:before {
    animation: spin 30s linear infinite;
}

/* fintech */
@keyframes spin {
    100% {
        transform: rotateZ(360deg);
    }
}
@keyframes spin-reverse {
    100% {
        transform: rotateZ(-360deg);
    }
}
.process-icon-white svg {
    color: var(--bs-white);
}
.process-icon.process-icon-white:before {
    border: 2px dashed var(--bs-white);
}
.process-icon svg {
    aspect-ratio: 1/1;
    @apply h-[56px];
}
/* hire vue js end */
.hire-section {
    @apply sticky top-20;
}
.hire-team {
    background:
        radial-gradient(78.23% 78.23% at 51.15% 42.34%, rgba(0, 122, 255, 0) 51.04%, rgba(0, 122, 255, 0.22) 94.27%)
            /* warning: gradient uses a rotation that is not supported by CSS and may not behave as expected */,
        #ffffff;
    @apply row-[2] col-[3];
}
.hire-box {
    @apply h-full text-center place-content-center place-items-center px-5 py-[30px];
}
.symbol-group {
    @apply flex items-center flex-wrap ml-5;
}
.symbol-group .symbol {
    @apply relative ml-[-20px];
    transition: all 0.3s ease;
}
.symbol-group .symbol-jainam{z-index: 3;}
.symbol-group .symbol-deep{z-index: 2;}
.symbol-group .symbol-kaushal{z-index: 1;}
.symbol-group .symbol-deep:hover {z-index: 3;}
.symbol-group .symbol-kaushal:hover{z-index: 2;}

.symbol.symbol-80px > img {
    @apply h-20 w-20;
}
.symbol-group .symbol:hover {
    transition: all 0.3s ease;
}
.symbol-group.symbol-hover .symbol {
    @apply cursor-pointer;
}
.dedicated-dev {
    @apply row-[4] col-[1];
}
.dedicated-box {
    @apply px-5 py-[30px];
}
.dedicated-points {
    @apply leading-9;
}
/* outsource start */
.sticky-list {
    @apply top-[100px];
}
.sticky-list .active {
    color: var(--bs-primary);
}
.sticky-content li.active .card {
    border-color: var(--bs-primary);
    @apply border-[2px];
}
/* outsource end */
/* Projectdetail css start */
.product-min-height {
    @apply min-h-[339px];
}
.technology-stack {
    filter: grayscale(100%);
    @apply cursor-pointer;
}
.technology-stack:hover {
    filter: grayscale(0);
    @apply cursor-pointer;
}
.product-min-height {
    @apply min-h-[339px];
}
.project-detail {
    @apply absolute w-[963px];
    transform: translateY(-50%);
}
.project-detail-img img {
    border-radius: calc(var(--bs-border-radius) + 7px);
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
    @apply p-[7px];
}
/* Projectdetail css end */
/* Life at Moweb Technology */
.moweb-life-main {
    @apply mx-auto my-0;
}
.moweb-life-box {
    @apply relative w-full pb-[60%];
}
.moweb-life-items .moweb-life-items_item div {
    @apply absolute w-full h-full block left-0 top-0;
}
.moweb-life-items .moweb-life-items_item img {
    @apply object-cover w-full h-full;
    border: 20px solid var(--bs-white);
}
.moweb-life-items .moweb-life-items_item:nth-child(1) {
    @apply absolute pb-[30.95%] pl-[22.7%] top-[-2.104235%] left-[8.957654723127036%];
}
.moweb-life-items .moweb-life-items_item:nth-child(2) {
    @apply absolute pl-[19.6%] pb-[19.22%] top-[46%] left-[8.81%];
}
.moweb-life-items .moweb-life-items_item:nth-child(3) {
    @apply absolute pl-[31.3%] pb-[21.6%] top-[6.7%] left-[30.2%];
}
.moweb-life-items .moweb-life-items_item:nth-child(4) {
    @apply absolute pl-[43.2%] pb-[25.5%] top-[40.7%] left-[26.71%] z-[9];
}
.moweb-life-items .moweb-life-items_item:nth-child(5) {
    @apply absolute pl-[31.3%] pb-[22.66%] top-[10.6%] left-[59.95%];
}
.moweb-life-items .moweb-life-items_item:nth-child(6) {
    @apply absolute pl-[32.6%] pb-[23.9%] top-[45.42%] left-[68.3%];
}
.line-wrap .line-1 {
    @apply absolute top-[83.2%] left-[12%];
}
.line-wrap .line-2 {
    @apply absolute top-[1.3%] left-[32.2%];
}
.moweb-life-titles_title {
    @apply absolute;
}
.moweb-life-titles_title:nth-child(1) {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    transform: rotate(-180deg);
    @apply left-[4%] top-[29.459283%];
}
.moweb-life-titles_title:nth-child(2) {
    @apply left-[78.5%] top-[2%];
}
/* Life at Moweb Technology */
.our-team-success {
    @apply w-full pb-[100%];
}
.our-team-success_item a {
    @apply absolute w-full h-full block left-0 top-0;
}
.our-team-success_item img {
    @apply w-full h-full object-cover;
    border: 5px solid var(--bs-white);
}
.our-team-success_item:nth-child(1) {
    @apply absolute pl-[30%] pb-[30%] top-[8%] left-[13%];
}
.our-team-success_item_in {
    @apply absolute w-full h-full block left-0 top-0;
}
.our-team-success_item:nth-child(2) {
    @apply absolute pl-[47.1%] pb-[36.5%] top-[27.5%] left-[0%];
}
.our-team-success_item:nth-child(3) {
    @apply absolute pl-[50.5%] pb-[51.6%] top-[15.6%] left-[47.1%] z-[9];
    border: 4px solid var(--bs-white);
}
.our-team-success_item:nth-child(4) {
    @apply absolute pl-[55.5%] pb-[30.8%] top-[64.2%] left-[11%];
}
.year-success {
    background-color: var(--bs-primary);
    @apply pt-[15px] pr-[10px] pb-[90px] pl-[15px];
}
.year-success::before {
    @apply absolute w-full h-full left-[-10px] top-[-10px] content-[''];
    border: 1px solid var(--bs-secondary);
}
.fifteen-sec span {
    @apply h-0.5 block max-w-[30px];
    background-color: var(--bs-white);
}
.success-main {
    @apply mb-[-38px] ml-[-5px];
}
.success-main p {
    color: var(--bs-body-color);
}
/* using row */
.session-time {
    @apply relative;
}
.session-time img.img-fluid {
    @apply absolute bottom-[-22px] left-[-5px];
}
/*  privacy start */
.policy-height {
    @apply !h-[294px] min-h-[294px];
}
/* privacy end */
/* odoo page start */
.odoo-develop-video {
    border: 10px solid var(--bs-border-color);
    @apply rounded-10;
}

.odoo-imp-table tr th {
    background-color: var(--bs-primary);
    border-right: 1px solid var(--bs-border-color);
    @apply p-[15px] text-white text-2xl font-bold;
}
.odoo-imp-table tr td {
    @apply p-[15px];
    border: 1px solid var(--bs-border-color);
}
.odoo-imp-table tr td.py-10 {
    @apply !py-10;
}
.odoo-imp-table table {
    @apply w-full;
}
.empty-text {
    @apply !bg-transparent !border-0;
}
.rounded-top {
    @apply rounded-tl-10;
}
.rounded-end {
    @apply rounded-tr-10;
}
.border-r-end {
    @apply !border-r-0;
}
.returning-border {
    @apply !border-l-0 !border-b-0;
}
.new-customers-border {
    @apply !border-l-0 !border-b-0 !border-t-0;
}
.table-responsive {
    -webkit-overflow-scrolling: touch;
    @apply overflow-x-auto;
}
.odoo-img-fluid {
    @apply h-auto max-w-full;
}
.odoo-service .img-thumbnail {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
    @apply p-[0.75rem] bg-white border-0 rounded-[0.25rem] max-w-full h-auto;
}
.odoo-service figure img {
    transition: 0.1s ease;
}
.odoo-service figcaption {
    @apply text-sm;
}
.odoo-service figure img:hover {
    transform: translateY(-3px);
}
.odd-with-position {
    @apply relative;
}
.odd-without-position img {
    transform: translate(-50%, -50%);
    @apply absolute left-[50%] top-[60%] z-[2] pointer-events-none;
}
.corner-heighlight {
    @apply relative;
}
.corner-heighlight::after {
    @apply absolute top-[-40px] left-[-40px] bottom-auto right-auto bg-[url('/img/odoo/corner.svg')] bg-no-repeat bg-contain bg-center h-18 w-[60px] content-[''];
}
.corner-heighlight .peer:checked ~ .peer-checked\:after\:border-white::after {
    @apply left-[9px];
}
.corner-heighlight .peer:checked ~ .peer-checked\:bg-blue-600 {
    background-color: var(--bs-purple);
}
.corner-heighlight .after\:w-5::after {
    content: var(--tw-content);
    @apply w-[1.1rem];
}
.corner-heighlight .after\:h-5::after {
    content: var(--tw-content);
    @apply h-[1.1rem];
}

/* new odoo */

#main {
    @apply w-[100vw] min-h-[100vh] bg-white;
}

.content h1 {
    @apply text-center;
}

.img-div {
    @apply flex items-center justify-center w-full h-full relative overflow-hidden;
}

.img {
    transform: skew(0deg, 0deg);
    @apply w-[7%] h-[5%];
}
.horizontal-main {
    @apply relative;
}
.text {
    transform: translate(-50%, -50%);
    transition: opacity 0.5s;
    @apply absolute opacity-0 whitespace-nowrap;
}
.text p {
    @apply text-[70px] font-semibold text-[black];
}
.hidden_header p {
    line-height: normal;
    @apply text-[45px] font-semibold text-[black] hidden px-5;
}
.from-left {
    @apply left-[-100%] top-[50%];
}
.from-right {
    @apply right-[-100%] top-[50%];
}
.from-top {
    @apply left-[50%] top-[-100%];
}
.img-hidden {
    @apply hidden w-full;
}
.vid-text p {
    @apply text-center mb-0;
}
.vid-text {
    @apply mt-[-115px] px-[290px];
}
.from-bottom {
    @apply left-[50%] bottom-[-100%];
}
.ii a[href] {
    @apply !text-white;
}
/* cursor hover */
.cursor {
    transform: translate(-50%, -50%);
    transition: opacity 0.2s; /* Handle opacity transition */
    @apply fixed pointer-events-none rounded-[50%] w-[100px] h-[100px] z-[1000] opacity-0;
}

/* Cursor text */
.cursor-text {
    transform: translate(-50%, -50%);
    @apply absolute text-black text-xs font-bold whitespace-nowrap pointer-events-none;
}
/* Enlarged cursor effect */

/* cursor hover end */

/* video for popup */
.video-modal {
    background: rgba(256, 256, 256, 0.8);
    transition: opacity 0.5s ease;
    @apply hidden opacity-0 fixed top-0 left-0 w-full h-full justify-center items-center z-[1032];
}
.video-modal-content {
    transform: translate(-50%, -50%); /* Center and scale */
    background: rgba(256, 256, 256, 0.8);
    box-shadow: 2px 4px 10px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease; /* Transition for scaling */
    @apply absolute w-[65%] top-[50%] left-[50%] rounded-10;
}

.video-modal.show .video-modal-content {
    transform: translate(-50%, -50%); /* Scale to normal size */
    @apply opacity-[1];
}
.video-modal video {
    box-shadow: 2px 4px 10px rgba(0, 0, 0, 0.2);
    @apply rounded-10 w-full;
}
.close-modal {
    transform: translate(90%, -90%); /* Reset any translation */
    @apply absolute top-0 right-0 bg-black border-0 text-[24px] cursor-pointer rounded-10 flex items-center justify-center p-[10px];
}

.close-modal-icon {
    @apply w-6 h-6;
}

@media (max-width: 766px) {
    .video-modal-content {
        @apply w-[90%];
    }
    .close-modal {
        transform: translate(20%, -199%);
        @apply absolute top-0 right-0;
    }
}

@media (min-width: 768px) and (max-width: 1025px) {
    .video-modal-content {
        @apply w-[80%];
    }
}

@media (min-width: 1266px) {
    .close-modal {
        @apply absolute top-0 right-0;
        transform: translate(124%, -13%);
    }
}

/* end of video for popup */
/* ribbon  */
/* styles.css */

.horizontal-main {
    @apply relative overflow-hidden h-[360px];
}
.for_ribbon {
    @apply mt-[-285px];
}
.ribbon {
    @apply absolute left-0 w-[111%] py-10 overflow-hidden flex items-center justify-center text-[20px] font-bold whitespace-nowrap;
}

.yellow-ribbon {
    transform: rotate(7deg);
    @apply top-[175px] bg-[#1FAF5F] text-black ml-[-12px];
}
.yellow-item {
    @apply bg-[#1FAF5F] text-black text-[36px];
}
.blue-ribbon {
    transform: rotate(-7deg);
    @apply ml-[-12px] top-[160px] bg-[#05a6f0] text-white;
}
.yellow-list {
    @apply flex gap-[40px];
}
.blue-list {
    @apply flex gap-[40px];
}

.blue-item {
    @apply text-white text-[36px] bg-[#05a6f0];
}

/* ribbon end */
@media (min-width: 1440px) {
    .horizontal-main {
        @apply h-[550px];
    }
}
@media (max-width: 1200px) {
    .from-left {
        @apply pr-[150px];
    }
    .from-right {
        @apply pl-5;
    }
    .vid-text {
        @apply px-[100px];
    }
    .for_ribbon {
        @apply mt-[-200px];
    }
}
@media (max-width: 900px) {
    .text,
    .from-left,
    .from-right,
    .from-top,
    .from-bottom {
        @apply hidden;
    }
    .img-hidden {
        @apply block;
    }
    .hidden_header p {
        @apply block pt-5;
    }
    .img-div {
        @apply block h-full;
    }
    .img {
        @apply hidden;
    }
    #main {
        @apply min-h-full;
    }
    .vid-text p {
        @apply text-left;
    }
    .vid-text {
        @apply mt-0 px-5;
    }
    .yellow-item {
        @apply text-[24px];
    }
    .blue-item {
        @apply text-[24px];
    }
    .yellow-list {
        @apply gap-[30px];
    }
    .blue-list {
        @apply gap-[30px];
    }
    .ribbon {
        @apply py-[30px];
    }
}
@media (max-width: 500px) {
    .hidden_header p {
        @apply text-[30px];
    }
    .yellow-item {
        @apply text-[20px];
    }
    .blue-item {
        @apply text-[20px];
    }
    .yellow-list {
        @apply gap-5;
    }
    .blue-list {
        @apply gap-5;
    }
    .ribbon {
        @apply py-5;
    }
    .horizontal-main {
        @apply h-[300px];
    }
    .for_ribbon {
        @apply mt-[-210px];
    }
    .blue-ribbon {
        @apply top-[84px];
    }
    .yellow-ribbon {
        @apply top-[86px];
    }
}
/* new odoo */
/* odoo page end */
/* cookie css start*/
.toast-container {
    @apply absolute max-w-full pointer-events-none;
    --bs-toast-zindex: 1090;
    z-index: var(--bs-toast-zindex);
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
}
.cookie {
    background: linear-gradient(180deg, var(--bs-white) 76.56%, var(--bs-border-color) 100%);
    border: 1px solid var(--bs-border-color);
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
    @apply rounded-10 p-5 max-w-[21.9rem];
}
.dark .cookie {
    background:
        linear-gradient(rgba(0, 0, 0, 0.10)),
        linear-gradient(90deg, #05a6f0 15%, #00b050 55% , #ffa500 100%);
    border: 1px solid #121212;
    backdrop-filter: blur(70px);
}
.cookie-img {
    @apply absolute bottom-[-20px] right-[-40px] z-[1];
}
.cookie-toast {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}
/* cookie css end */
.grecaptcha-badge {
    @apply z-[22];
}
/*  404 error start */
.errorpage-height {
    @apply !h-[648px] min-h-[648px];
}
/* 404 error end */
/* apply career popup start */
.apply-box {
    background: var(--bs-white);
}
.address-box {
    background: var(--bs-light);
}
.address-box-spacing {
    @apply py-[50px] px-[40px];
}
.address-box-spacing a:hover {
    color: var(--bs-primary);
    transition: all ease-in-out 0.2s;
    -webkit-transition: all ease-in-out 0.2s;
}
.project-testimonial {
    @apply !mx-[1.25rem];
}
/* apply career popup end */

/* tanzenia landing ppage */
.bg-usa-cta {
    @apply bg-[url('/img/img-tnz-cta.webp')] bg-no-repeat bg-cover bg-center;
}

.divider-section {
    @apply border-b border-solid border-[#d7dee5];
}

.bg-sessions-usa {
    @apply bg-[url('/img/img-hero-tnz.webp')] bg-no-repeat bg-cover bg-center;
}

.sessions-border-b {
    @apply border-b border-solid border-[#f5f6f9];
}

.usa-contact-border {
    @apply border border-solid border-[#d7dee5];
}

.datepicker-img {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjUiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNSAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzUwOV8zNjQpIj4KPHBhdGggZD0iTTAuOTcwMjE1IDAuNUgyMy45NzAyVjIzLjVIMC45NzAyMTVWMC41WiIgc3Ryb2tlPSJ3aGl0ZSIvPgo8cGF0aCBkPSJNNC40NzAyMSA3QzQuNDcwMjEgNi40Njk1NyA0LjY4MDkzIDUuOTYwODYgNS4wNTYgNS41ODU3OUM1LjQzMTA3IDUuMjEwNzEgNS45Mzk3OCA1IDYuNDcwMjEgNUgxOC40NzAyQzE5LjAwMDYgNSAxOS41MDk0IDUuMjEwNzEgMTkuODg0NCA1LjU4NTc5QzIwLjI1OTUgNS45NjA4NiAyMC40NzAyIDYuNDY5NTcgMjAuNDcwMiA3VjE5QzIwLjQ3MDIgMTkuNTMwNCAyMC4yNTk1IDIwLjAzOTEgMTkuODg0NCAyMC40MTQyQzE5LjUwOTQgMjAuNzg5MyAxOS4wMDA2IDIxIDE4LjQ3MDIgMjFINi40NzAyMUM1LjkzOTc4IDIxIDUuNDMxMDcgMjAuNzg5MyA1LjA1NiAyMC40MTQyQzQuNjgwOTMgMjAuMDM5MSA0LjQ3MDIxIDE5LjUzMDQgNC40NzAyMSAxOVY3WiIgc3Ryb2tlPSIjM0M0NTYxIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMTYuNDcwMiAzVjciIHN0cm9rZT0iIzNDNDU2MSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTguNDcwMjEgM1Y3IiBzdHJva2U9IiMzQzQ1NjEiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik00LjQ3MDIxIDExSDIwLjQ3MDIiIHN0cm9rZT0iIzNDNDU2MSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTguNDcwMjEgMTVIMTAuNDcwMlYxN0g4LjQ3MDIxVjE1WiIgc3Ryb2tlPSIjM0M0NTYxIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzUwOV8zNjQiPgo8cmVjdCB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9IndoaXRlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjQ3MDIxNSkiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K);
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
}

.africa-work-chip {
    @apply rounded-[20px] border border-solid border-[#4c5773] py-1 px-[15px];
}
.africa-work-chip p {
    @apply text-[17px] leading-6;
}
.tnz-video-play {
    @apply absolute top-[39%] left-[42%];
}

.tzn-text-lh {
    @apply leading-[30px];
}

/* new member */

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.8);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.board-member-page {
    @apply flex flex-col items-center bg-[#f5f6f9] min-h-[100vh] py-[100px] px-5;
}

.container-member {
    animation: fadeInUp 0.6s ease forwards;
    animation-delay: 0.2s;
    @apply max-w-[620px] w-full mx-auto my-0 opacity-0;
}

.profile {
    @apply mb-[30px] text-center;
}

.profile-img {
    animation: scaleIn 0.6s ease forwards;
    animation-delay: 0.4s;
    @apply w-[150px] h-[150px] rounded-[50%] opacity-0;
}

.profile-name {
    @apply text-[#111111] text-2xl font-bold mt-[10px] mb-[5px] opacity-0;
    animation: fadeInUp 0.6s ease forwards;
    animation-delay: 0.6s;
}

.profile-description {
    @apply text-[#3c4561] text-xl mb-[30px] opacity-0;
    animation: fadeInUp 0.6s ease forwards;
    animation-delay: 0.8s;
}

.links {
    @apply flex gap-5 flex-col;
}

.link {
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    animation: fadeInUp 0.6s ease forwards;
    @apply bg-[#FFFFFFF2] py-[11px] px-5 rounded-10 no-underline text-[#111111] text-left border-2 border-solid border-transparent flex items-center justify-between gap-[15px] opacity-0 font-semibold text-[17px] leading-6;
}

.links .link:nth-child(1) {
    animation-delay: 1s;
}
.links .link:nth-child(2) {
    animation-delay: 1.2s;
}
.links .link:nth-child(3) {
    animation-delay: 1.4s;
}
.links .link:nth-child(4) {
    animation-delay: 1.6s;
}
.links .link:nth-child(5) {
    animation-delay: 1.8s;
}

.link:hover {
    transform: translateY(-2px) !important;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    @apply bg-white border-[#05a6f0];
}

.link-icon {
    @apply w-9 h-9 flex-shrink-0;
}

/* Animación inicial del fondo */
@keyframes gradientAnimation {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.board-member-page {
    background-size: 200% 200%;
    animation: gradientAnimation 15s ease infinite;
}

/*  */

/* iPadPRO landscape style here */
@media only screen and (min-device-width: 1000px) and (max-device-width: 1100px) {
    .odd-without-position {
        @apply hidden;
    }
    .corner-heighlight {
        @apply hidden;
    }
    .btn {
        @apply py-[10px] px-[25px];
    }
    .project-testimonial .card-description {
        @apply max-h-[265px] min-h-[265px];
    }

    .tech-box {
        @apply w-[150px];
    }
}
@media (max-width: 1300px) {
    .process-list-about.process-list {
        --item-w: 180px;
    }
    .process-list-about .process-item {
        @apply max-w-[180px];
    }
    .process-list-about .process-icon {
        @apply h-[100px];
    }
    .process-list-about .process-icon svg {
        @apply h-[45px];
    }
    .process-list-about .circle {
        --left: 132px;
        --circle-w: 6rem;
        @apply h-[1.2rem];
    }
    .process-list-fintech .process-item {
        @apply max-w-[277px];
    }
    .process-list-fintech.process-list {
        --item-w: 277px;
    }
    .process-list-fintech .circle {
        --left: 59px;
        --circle-w: 27rem;
    }
}
@media (max-width: 1099.98px) {
    .process-list {
        --item-w: 178px;
    }
    .process-item {
        max-width: var(--item-w);
    }
    .process-icon {
        @apply h-[100px];
    }
    .process-icon svg {
        @apply h-[46px];
    }
    .circle {
        --left: 126px;
        --circle-w: 6.4rem;
        @apply mt-[75px];
    }
    .process-item p {
        @apply text-[18px];
    }
    .agriculture-animation .process-item p {
        @apply text-[14px] min-h-[auto];
    }

    /* about */
    .process-list-about.process-list {
        --item-w: 154px;
    }
    .process-list-about .process-item {
        @apply max-w-[160px];
    }
    .process-list-about .process-icon {
        @apply h-20;
    }
    .process-list-about .process-icon svg {
        @apply h-9;
    }
    .process-list-about .circle {
        --left: 117px;
        --circle-w: 4.5rem;
    }
    .video-main {
        @apply ml-0;
    }
    .process-list-fintech .circle {
        --left: 100px;
        --circle-w: 17rem;
    }
    .process-list-fintech .process-item {
        @apply max-w-[250px];
    }
    .process-list-fintech.process-list {
        --item-w: 250px;
    }
}

@media (max-width: 991.98px) {
    .tnz-video-play img {
        @apply w-[60px] h-[60px];
    }
    .odd-without-position {
        @apply hidden;
    }
    .corner-heighlight {
        @apply hidden;
    }
    .odoo-service-row.row {
        @apply gap-y-0;
    }
    .odoo-imp-table table {
        @apply w-auto;
    }
    header {
        backdrop-filter: none;
        background-color: var(--bs-white);
        @apply dark:!bg-black;
    }
    .service-menu .menu-body {
        @apply !mb-0;
    }
    .hero {
        @apply h-auto max-h-none;
    }
    .hero-dashboard-img {
        @apply block max-w-full text-center relative h-[310px];
        top: initial;
    }
    picture.pic-bg img {
        transform: translate(-41px, -8%) rotate(90deg);
        @apply left-0 h-[800px];
    }
    .hero-dashboard-img img.dashboard-img {
        @apply absolute left-[30%] h-[450px] top-[-9%] mx-auto my-0;
        transform: translateX(-24%);
    }
    .hero-content {
        @apply py-30 px-0;
    }
    .hero-tech-img {
        @apply block max-w-full text-center relative h-[310px];
        top: initial;
    }
    .hero-tech-app-img {
        @apply h-[400px];
        top: initial;
    }
    picture.pic-bg.red img {
        transform: translate(-25px, -8%);
    }
    .hero-vue-img {
        @apply absolute left-[30%] h-[450px] top-[-9%] my-0 mx-auto;
        transform: translateX(-24%);
    }
    .odoo-baneer-img-height .hero-vue-img img {
        @apply left-[20%];
    }
    .odoo-baneer-img-height .hero-vue-img img {
        @apply h-[330px];
    }
    .comp-start:after {
        @apply hidden;
    }
    .img-serving-bg {
        @apply h-full w-auto;
    }
    .serving {
        @apply px-[50px] py-0;
    }
    .serving-bg {
        @apply px-[50px] py-[70px];
    }
    .serving__logo {
        @apply w-[76px] h-[76px];
    }
    .process-list {
        --item-w: 170px;
    }
    .process-icon {
        @apply h-[90px];
    }
    .process-icon svg {
        @apply h-9;
    }
    .circle {
        --left: 118px;
        @apply mt-[70px];
    }
    .video-main {
        @apply text-center ml-[-40px];
    }
    .application-video-one video {
        max-width: calc(100% - 55px - 80px);
        @apply mx-auto;
    }
    .application-video-two {
        transform: translateX(40px);
        margin-top: calc(-69% + 100px);
        @apply static;
    }
    .line-wrap {
        @apply hidden;
    }

    .moweb-life-items .moweb-life-items_item img {
        @apply border-4 border-solid border-[#fff];
    }
    .moweb-life-titles li.moweb-life-titles_title {
        @apply text-[25px];
    }
    .project-detail {
        @apply static max-w-[662px] transform-none;
    }
    .product-min-height {
        @apply min-h-[auto];
    }
    .hero-Work-img {
        @apply ml-0 relative z-[9] w-full transform-none;
    }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
    /* about */
    /* .process-list-about .process-item{  --item-w: 135px;max-width: 135px;} */
    .process-list-about.process-list {
        --item-w: auto;
        --item-h: 100px;
        @apply inline-block;
    }
    .process-list-about .process-item {
        --item-w: 100%;
        --top: 70px;
        margin-bottom: var(--top);
        @apply max-w-[570px] flex items-center mt-0;
    }
    .process-list-about .process-icon {
        @apply mb-0 h-[100px];
    }
    .process-list-about .process-item p:first-of-type {
        @apply min-w-[180px] min-h-[auto] mb-0 text-left flex-auto;
    }
    .process-list-about .process-item p + p {
        @apply mb-0 text-left flex-auto;
    }
    .process-list-about .process-icon svg {
        @apply h-9;
    }
    .process-list-about .circle {
        --left: 30px;
        --top: 70px;
        --circle-w: 1.2rem;
        --circle-h: 4.5rem;
        height: var(--circle-h);
        top: calc(var(--item-h) - var(--circle-h));
        @apply mt-0;
    }
    .process-list-about .circle:before {
        height: calc(var(--circle-h) - 1px);
        width: calc(var(--circle-h) - 1px);
        @apply left-[-51px];
    }
    .process-list-about .circle-2 {
        top: calc(var(--top) + var(--item-h) * 2);
        @apply left-[42px];
    }
    .process-list-about .circle-3 {
        top: calc(var(--top) + var(--item-h) * 3);
        @apply left-[42px];
    }
    .process-list-about .circle-4 {
        top: calc(var(--top) * 3 + var(--item-h) * 4);
        @apply left-[42px];
    }
    .process-list-about .circle-5 {
        top: calc(var(--top) * 3 + var(--item-h) * 5);
        @apply left-[42px];
    }
    .process-list-aiml .process-item {
        @apply max-w-[675px];
    }
    .process-list-fintech .circle.fitech-circle {
        @apply top-[46px];
    }
    .process-list-fintech .process-item p:first-of-type {
        @apply min-w-[195px];
    }
    .process-list-fintech .circle {
        --top: 93px;
    }
    .process-list-fintech .process-item {
        @apply max-w-[675px];
        --top: 54px;
    }
    .process-list-agriculture .process-item {
        --top: 70px;
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    .project-testimonial .card-description {
        @apply max-h-[227px] min-h-[255px];
    }
    .post-description {
        @apply h-50;
    }
    .pe-responsive {
        @apply pl-0;
    }
    .serving-content {
        @apply py-[315px] px-[0];
    }
    .serving__logo1 {
        @apply top-[3%] left-[36%];
    }
    .serving__logo2 {
        @apply left-auto top-[7%] right-[16%];
    }
    .serving__logo3 {
        @apply left-[23%] top-[16%];
    }
    .serving__logo4 {
        @apply left-auto top-[16%] right-[38%];
    }
    .serving__logo5 {
        @apply top-auto right-auto left-[22%] bottom-[3%];
    }
    .serving__logo6 {
        @apply top-auto right-auto bottom-[15%] left-[36%];
    }
    .serving__logo7 {
        @apply top-auto left-auto right-[34%] bottom-[3%];
    }
    .serving__logo8 {
        @apply top-[76%] right-[21%];
    }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 1) and (orientation: portrait) {
    .hero .top-hero {
        @apply flex items-center;
    }
}

/* form css start */
.form-control {
    border-color: var(--bs-border-color);
    @apply bg-transparent mt-1 block w-full min-h-[2.8125rem] ring-0 focus:ring-0 border dark:border-[#3C4561] dark:focus:border-blue focus:border-blue rounded-[10px] dark:bg-[#3C456133];
  
}
.form-select {
    border-color: var(--bs-border-color);
    @apply bg-transparent mt-1 block w-full min-h-[2.8125rem] ring-0 focus:ring-0 border dark:border-[#3C4561] dark:focus:border-blue focus:border-blue rounded-[10px] dark:bg-[#3C456133];
   
}
.react-tel-input .form-control {
    border-color: rgb(223 229 235);
    @apply dark:!bg-[#3C456133] dark:border-[#3C4561] dark:text-[#D7DEE5];
}
.react-tel-input {
    font-family: inherit;
    @apply text-[17px];
}
.react-tel-input .form-control:focus {
    border-color: var(--bs-primary);
    @apply shadow-none;
}
.react-tel-input .selected-flag:focus:before,
.react-tel-input .selected-flag.open:before {
    border-color: var(--bs-primary);
    @apply shadow-none;
}
.react-tel-input .selected-flag:before {
    @apply top-0 bottom-0 rounded-tl-[10px] rounded-tr-[0px] rounded-br-[0px] rounded-bl-[10px] shadow-none;
}
label span {
    @apply text-[17px] leading-6;
}

/* upload img css start */
.upldimg input[type='file'] {
    @apply hidden;
}
.upldimg .custom-file-upload {
    color: var(--bs-secondary);
    @apply inline-block	text-center cursor-pointer text-[17px] leading-6 font-normal dark:text-[#D7DEE5];
    
}
.upldimg {
    @apply flex flex-col items-center justify-center opacity-50 rounded-10 py-[6px] px-[7px] border-dashed border border-[#4c5773] bg-[#f8f9fb] dark:bg-[#3C456133] dark:border-[#3c4561] dark:border-[1.5px] dark:opacity-100;
}
.react-select__menu {
    @apply dark:!bg-black dark:!text-[#D7DEE5];
}
.react-tel-input .country-list {
    @apply dark:bg-black dark:text-[#D7DEE5];
}
.react-tel-input .country-list .search {
    @apply dark:bg-black dark:text-[#D7DEE5];
}
.react-tel-input .country-list .search-box {
    @apply dark:bg-black;
}

.react-select__control--is-focused {
    border-color: #05A6F0 !important; 
}

/* When clicked / focused */
.react-select-container .react-select__control--is-focused {
    border-color: #05A6F0 !important; /* blue-600 */
}


/* upload img css end */
/* form css end */
/* accordion css start */
.accordion-border {
    @apply border-0;
}
.accordion-title {
    box-shadow: none !important;
    background-color: var(grey) !important;
}
/*  accordion css end */
.breadcumb-pages ol {
    @apply flex-wrap py-6;
}
.breadcumb-pages ol li {
    @apply py-0;
}
.hover-effect {
    @apply inline-block bg-transparent bg-no-repeat;
    background-image: linear-gradient(180deg, transparent, transparent),
        linear-gradient(180deg, var(--bs-primary), var(--bs-primary));
    background-origin: content-box;
    background-position:
        100% 100%,
        100% 100%;
    background-size:
        100% 1px,
        0 1px;
    transition:
        background-size 0.6s cubic-bezier(0.165, 0.84, 0.44, 1),
        color 0.3s ease;
}
.hover-effect:hover {
    color: var(--bs-primary);
    background-position:
        100% 100%,
        0 100%;
    background-size:
        100% 1px,
        100% 1px;
}

.work-nav .react-select-container .react-select__control {@apply border-0;}

/* footer css start */
.footer-nav .nav-link {
    @apply inline-block bg-transparent bg-no-repeat font-medium;
    font-size: var(--md);
    line-height: var(--md-lnh);
    background-image: linear-gradient(180deg, transparent, transparent),
        linear-gradient(180deg, var(--bs-primary), var(--bs-primary));
    background-origin: content-box;
    background-position:
        100% 100%,
        100% 100%;
    background-size:
        100% 1px,
        0 1px;
    transition:
        background-size 0.6s cubic-bezier(0.165, 0.84, 0.44, 1),
        color 0.3s ease;
}
.footer-nav .nav-link:hover {
    color: var(--bs-primary);
    background-position:
        100% 100%,
        0 100%;
    background-size:
        100% 1px,
        100% 1px;
}
.footer-nav {
    @apply mb-0 pl-0 flex flex-col gap-2.5;
}
.footer-title {
    @apply mb-0 font-bold text-[17px] leading-[25px];
}
.footer-hr {
    @apply mt-2.5 mb-2.5;
}
.footer-hr-spacing {
    @apply mt-9 mb-[46px];
}
.socialclr a {
    @apply inline-flex items-center justify-center rounded-[50%] p-[5px] h-8 w-8 dark:!text-[#DFE5EB] dark:!border-[#DFE5EB];
    color: var(--bs-body-color);
    border: 1px solid var(--bs-body-color);
}
.socialclr ul {
    @apply flex pl-0 mb-0;
    list-style-type: none;
}
.socialclr ul li:hover {
    transform: translate(0, -3px);
    transition: 0.3s ease-in-out;
}
.socialclr ul li {
    transition: 0.3s ease-in-out;
}
.socialfb:hover {
    @apply text-[#3874cb] border border-solid border-[#3874cb] dark:!border-[#3874cb] dark:!text-[#3874cb];
}
.socialtw:hover {
    @apply text-[#03a9f4] border border-solid border-[#03a9f4] dark:!border-[#03a9f4] dark:!text-[#03a9f4];
}
.socialln:hover {
    @apply text-[#0077b5] border border-solid border-[#0077b5] dark:!border-[#0077b5] dark:!text-[#0077b5];
}
.socialinsta:hover {
    @apply text-[#f14c5d] border border-solid border-[#f14c5d] dark:!border-[#f14c5d] dark:!text-[#f14c5d];
}
.error .cookie-toast {
    @apply !hidden;
}
/* react select css start */
.react-select-container .react-select__control {
    border-color: var(--bs-border-color);
    @apply bg-transparent rounded-10 min-h-[36px] shadow-none dark:border-[#3C4561] dark:bg-[#3C456133] dark:text-[#D7DEE5];
   
}
.react-select-container .react-select__control:hover {
    border-color: var(--bs-border-color);
    @apply cursor-pointer dark:border-[#3C4561] dark:bg-[#3C456133];
}

.react-tel-input .country-list .country.highlight {
    @apply dark:text-light dark:bg-[#3C456133];
}
.react-select-container .react-select__indicator {@apply dark:!text-[#D7DEE5];}
.react-tel-input .country-list .country:hover {
    @apply dark:text-light dark:bg-[#3C456133];
}
.react-tel-input .selected-flag .arrow {
    @apply dark:border-t-[#D7DEE5];
}
.react-tel-input .selected-flag .arrow.up {
    @apply dark:border-b-[#D7DEE5];
}
.css-1dimb5e-singleValue {
    @apply dark:!text-[#D7DEE5];
}

/* .react-select-container .react-select__control:hover {
    border-color: var(--bs-border-color);
} */
.react-select-container .react-select__control .react-select__input-container {
    color: var(--bs-body-color);
}
.react-select-container .react-select__control.react-select__control--is-focused {
    border-color: var(--bs-light);
}
.react-select-container .react-select__control .react-select__value-container {
    @apply pl-2.5 pr-1 pt-[11px] pb-[10px];
}
.work-nav .react-select-container .react-select__control .react-select__value-container {
    @apply pl-2.5 pr-1 pt-3 pb-3;
}
.work-nav .react-select-container .react-select__control .react-select__value-container {
    @apply py-[17px];
}
.work-nav .react-select-container .react-select__control .react-select__value-container .react-select__placeholder {
    color: var(--bs-body-color);
}
.work-nav
    .react-select-container
    .react-select__control.react-select__control--is-focused
    .react-select__value-container
    .react-select__placeholder {
    color: var(--bs-primary);
}
.work-nav
    .react-select-container
    .react-select__control.react-select__control--is-focused
    .react-select__value-container
    .react-select__single-value {
    color: var(--bs-primary);
    @apply dark:!text-[#D7DEE5];
}
.react-select-container .react-select__indicator {
    color: var(--bs-secondary);
    @apply !pt-[7px] !pr-[6px] !pb-[5px] !pl-0 !transition-none;
}
.react-select-container .react-select__control.react-select__control--is-focused .react-select__indicator {
    color: var(--bs-secondary);
}
.react-select-container .react-select__indicator:hover {
    color: var(--bs-secondary); @apply dark:!text-[#D7DEE5];
}
.react-select-container .react-select__indicator:focus {
    color: var(--bs-secondary); @apply dark:!text-[#D7DEE5];
}
.react-select-container .react-select__indicator:active {
    color: var(--bs-secondary); @apply dark:!text-[#D7DEE5];
}
.react-select-container .react-select__indicator-separator {
    @apply hidden;
}
.react-select-container .react-select__loading-indicator {
    @apply !hidden;
}
.react-select-container .react-select__multi-value {
    background-color: var(--bs-light);
    @apply rounded-[0.42rem] flex-row-reverse;
}
.react-select-container .react-select__multi-value .react-select__multi-value__label {
    @apply pl-0 pr-2.5;
}
.react-select-container .react-select__multi-value .react-select__multi-value__remove:hover {
    @apply bg-transparent;
    color: inherit;
}
.react-select-container .react-select__menu {
    box-shadow: 0px 0px 50px 0px rgb(82 63 105 / 15%);
    @apply mt-[5px] text-[1.0625rem] z-[999] leading-[1.5625rem];
}
.react-select-container .react-select__menu .react-select__menu-list {
    @apply p-0 text-[1.0625rem] leading-[1.5625rem];
}
.react-select-container .react-select__menu .react-select__menu-list .react-select__option {
    @apply cursor-pointer text-[1.0625rem] leading-[1.5625rem] py-[0.65rem] px-5;
}
.react-select-container .react-select__menu .react-select__menu-list .react-select__option:first-child {
    @apply rounded-tl-10 rounded-tr-10;
}
.react-select-container .react-select__menu .react-select__menu-list .react-select__option:last-child {
    @apply rounded-bl-10 rounded-br-10;
}
.react-select-container .react-select__menu .react-select__menu-list .react-select__option.react-select__option--is-selected {
    color: var(--bs-primary);
    @apply bg-transparent;
   
}
.react-select-container .react-select__menu .react-select__menu-list .react-select__option.react-select__option--is-focused,
.react-select-container .react-select__menu .react-select__menu-list .react-select__option:hover {
    @apply bg-transparent;
}
.react-select-container
    .react-select__menu
    .react-select__menu-list
    .react-select__option.react-select__option--is-focused:active,
.react-select-container .react-select__menu .react-select__menu-list .react-select__option:active {
    color: var(--bs-primary);
}
.react-select-container
    .react-select__menu
    .react-select__menu-list
    .react-select__option.react-select__option--is-selected:active {
    color: var(--bs-white);
}
.react-select__input:focus {
    @apply outline-none;
}

/* No border styles for react-select */
.react-select-container.no-border .react-select__control {
    @apply border-0 shadow-none;
}
.react-select-container.no-border .react-select__control:hover {
    @apply border-0 shadow-none;
}
.react-select-container.no-border .react-select__control.react-select__control--is-focused {
    @apply border-0 shadow-none;
}
[type='text']:focus {
    box-shadow: none;
}



/* react select end */
/* footer css end */
/* get in touch start */
.get-touch-section a:hover {
    color: var(--bs-primary);
    transition: all ease-in-out 0.2s;
    -webkit-transition: all ease-in-out 0.2s;
}
.get-touch-section p {
    font-size: var(--md);
    line-height: var(--md-lnh);
}
.get-touch-background {
    background-position: right top;
    @apply bg-no-repeat;
}
/* get in touch end */
.comp-start:after {
    @apply absolute m-auto top-0 bottom-0 uppercase text-[100px] left-[130px] font-bold leading-[0];
    content: 'comparision';

    transform: rotate(-90deg);
    color: var(--bs-border-color);
}
.comparision th {
    border-left: 1px solid var(--bs-border-color);
    @apply py-[15px] pr-[15px] pl-[30px];
}
.comparision th h3 {
    @apply m-0;
}
.comparision h3 img {
    @apply mr-15;
}
.comparision td {
    border-top: 1px solid var(--bs-border-color);
    border-left: 1px solid var(--bs-border-color);
    background-position: 20px center;
    @apply py-[23px] pr-[20px] pl-[85px] bg-no-repeat leading-[27px];
}

.navbar-toggler {
    @apply p-0 text-[20px] relative h-4 w-[18px] flex justify-around m-0;
    transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -ms-flex-direction: column;
    -ms-flex-pack: distribute;
}
.navbar-toggler span.icon-bar {
    transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    background: var(--bs-body-color);
    @apply w-[18px] h-[2px] block text-right ml-auto opacity-[0.8] dark:bg-white;
}
.navbar-toggler span.icon-bar.bottom-bar {
    @apply mb-0;
}
.navbar-toggler.cross .icon-bar {
    transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
}
.navbar-toggler.cross .top-bar {
    @apply absolute top-2;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.navbar-toggler.cross .middle-bar {
    @apply opacity-0;
}
.navbar-toggler.cross .bottom-bar {
    @apply absolute top-2 !w-[18px];
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.back-icon {
    @apply uppercase flex items-center top-0 z-[1] !sticky py-[13px] px-5 font-semibold dark:bg-black dark:text-light;
    color: var(--bs-secondary);
    background: var(--bs-light);
    border-bottom: 1px solid var(--bs-border-color);
    font-size: var(--sm);
    line-height: var(--sm-lnh);
}
/* range slider */
.horizontal-slider {
    @apply h-[50px] mt-[5px];
}
.range-thumb {
    background-color: var(--bs-black);
    color: var(--bs-white);
    box-sizing: border-box;
    @apply text-[0.9em] text-center cursor-pointer;
}
.range-thumb.active {
    background-color: var(--bs-primary);
}
.thumb-label {
    transform: translateX(-10%);
}
.thumb-label:focus,
.range-thumb:focus {
    @apply outline-none;
}
.range-track {
    @apply relative;
    background: var(--bs-primary);
}
.horizontal-slider .range-track.range-track-1 {
    @apply bg-[#ddd] top-[30px] h-[3px] rounded-[2px] shadow-none;
}
.horizontal-slider .range-track {
    @apply top-[30px] h-[3px] rounded-[2px] shadow-none;
}
.horizontal-slider .range-thumb {
    background-color: var(--bs-primary) !important;
    border: 2px solid var(--bs-border-color);
    background-image: none !important;
    @apply top-[22px] w-[17px] h-[17px] leading-[46px] rounded-[50%];
}

@media (max-width: 992px) {
    .menu-button {
        @apply py-3 px-5 leading-[26px] mb-0;
    }
    #navbarNav {
        @apply bg-grey dark:bg-black fixed block w-full left-0 bottom-0 justify-center overflow-y-auto z-[11] top-[60px] overflow-hidden;
        height: calc(100vh - 60px);
        transform: translateX(-100%);
        transition: 0.3s;
    }
    #navbarNav.navShow {
        transform: translateX(0);
        transition: 0.3s;
    }

    body:has(.navShow) {
        @apply overflow-hidden;
    }
    .sub-menu {
        @apply fixed left-0 bottom-0 top-0 right-0 flex flex-col max-w-full z-[1045] transition-all overflow-y-auto;
        height: calc(100vh - 60px);
        transition-duration: 0.3s;
        transform: translateX(100%);
        background-clip: padding-box;
    }
    .sub-menu.open {
        @apply w-full transform-none;
    }
    .hero-app-img {
        transform: translateY(0) translateX(-50%);
        @apply left-[50%];
    }
}
@media (max-width: 900px) {
    .process-list {
        --item-w: calc(calc(100vw - 42px) / 5);
    }
    .circle {
        --circle-w: 9vw;
        --left: 14.5vw;
    }
}
@media (max-width: 767.98px) {
    .board-member-page {
        @apply py-[50px] px-5;
    }
    .links {
        @apply gap-[10px];
    }
    .testimonial-card-width.case-study-slider-img .slick-dots {
        @apply top-[108%];
    }
    .font-size-res {
        @apply text-[15px];
    }
    .breadcumb-pages ol li {
        @apply mb-2;
    }
    :root {
        --lg: 20px;
        --lg-lnh: 30px;
        --xxl: 36px;
        --xxl-lnh: 42px;
        --xl: 26px;
        --xl-lnh: 34px;
    }
    p {
        @apply text-base;
    }
    .slide-title {
        @apply leading-[34px];
    }
    .logo {
        @apply w-auto h-30;
    }
    .hero-dashboard-img img.dashboard-img {
        transform: translateX(-18%);
        @apply h-[440px];
    }
    .hero-tech-img .hero-vue-img {
        transform: translateX(-18%);
        @apply h-[340px];
    }
    .odoo-baneer-img-height .hero-vue-img img {
        @apply h-[332px];
    }
    /* .hero-tech-img .hero-vue-img{ height: 440px;transform: translateX(-18%);} */
    .client-carousel:after,
    .client-carousel:before {
        @apply w-100;
    }
    .client-testimonial-slider .slick-slider:after {
        @apply bg-none;
    }
    .client-testimonial-slider .slick-slider:before {
        @apply bg-none;
    }
    .pe-responsive {
        @apply pl-0;
    }
    .project-testimonial .card-description {
        @apply max-h-none mb-5 min-h-[auto];
    }
    .variable-width .slick-track {
        @apply !flex;
    }
    .variable-width .slick-track .slick-slide {
        height: inherit !important;
    }
    .variable-width .slick-track .slick-slide > div {
        @apply !h-full;
    }
    .variable-width .slick-track .slick-slide > div > div {
        @apply !h-full;
    }
    .post-description {
        @apply h-50;
    }
    .moweb-life-titles li.moweb-life-titles_title {
        @apply text-[14px];
    }
    .moweb-life-titles_title:nth-child(1) {
        @apply left-[-15px];
    }
    .moweb-life-titles_title:nth-child(2) {
        @apply top-[-25px];
    }
    .our-team-success_item:nth-child(1) {
        @apply pl-[35%] top-[0%] left-[8%];
    }
    .project-detail {
        @apply max-w-full;
    }
    /* service list start */
    .services-listing:before {
        @apply border-b-0 right-0 left-2 top-[32px];
        border-left: 2px dashed #6b7c93;
        height: calc(100% - 40px);
    }
    .services-listing {
        @apply mt-9;
    }
    .service-card .service-title {
        @apply mt-0 md:mt-10 ml-10 mb-0 rounded-10;
    }
    .service-card .star-stat:after {
        @apply bottom-3.5 left-[-40px];
    }
    .service-card .service-list {
        @apply mt-5 mr-0 mb-0 ml-10;
    }
    .service-card .service-title:before {
        @apply border-b-0 left-[-14px] bottom-[17px];
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid var(--bs-body-color);
        rotate: 90deg;
    }
    .service-card:hover .service-title:before {
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid var(--bs-success);
    }
    .dark .service-card .service-title:before {border-left: 10px solid transparent; border-top: 10px solid var(--bs-secondary);}
    .dark .services-listing:before {
    border-bottom: 0;
}
    /* service list end */

    /* serving css start */
    .serving-bg {
        @apply py-[70px] px-[30px];
    }
    .serving {
        @apply p-0;
    }
    .serving__logo {
        @apply h-14 w-14;
    }
    .serving__logo img {
        @apply h-[26px] w-[26px];
    }
    .serving__logo1 {
        @apply top-[3%] left-[36%];
    }
    .serving__logo2 {
        @apply left-auto top-[7%] left-[16%];
    }
    .serving__logo3 {
        @apply top-[16%] left-[23%];
    }
    .serving__logo4 {
        @apply left-auto top-[16%] right-[38%];
    }
    .serving__logo5 {
        @apply top-auto right-auto left-[22%] bottom-[3%];
    }
    .serving__logo6 {
        @apply top-auto right-auto bottom-[15%] left-[36%];
    }
    .serving__logo7 {
        @apply top-auto left-auto right-[34%] bottom-[3%];
    }
    .serving__logo8 {
        @apply top-[76%] right-[21%];
    }
    /* serving css end */

    .process-list,
    .process-list-about.process-list {
        @apply flex-col justify-center items-center mt-50;
        --item-w: calc(calc(100vw - 42px));
        --item-h: 400px;
    }
    .process-list-about.process-list {
        @apply flex-col justify-center items-center mt-50;
        --item-w: calc(calc(100vw - 42px));
        --item-h: 400px;
    }
    .process-item,
    .process-list-about .process-item {
        @apply max-w-full mt-0;
        min-height: var(--item-h);
    }
    .process-item:last-child,
    .process-list-about .process-item:last-child {
        @apply mb-5 min-h-[auto];
    }
    .process-icon,
    .process-list-about .process-icon {
        @apply h-[110px];
    }
    .process-icon svg,
    .process-list-about .process-icon svg {
        @apply h-[46px] w-[46px];
    }
    .circle,
    .process-list-about .circle {
        --left: auto;
        --circle-w: 8.4rem;
        --circle-h: 8.4rem;
        --top: 150px;
        height: var(--circle-h);
        transform: rotate(180deg) translateX(-9px);
        @apply w-[1.2rem] mt-0;
    }
    .process-list-about .circle {
        --top: 245px;
    }
    .process-list-aiml .circle {
        --top: 260px;
    }
    .process-list-digital .circle {
        --top: 245px;
    }
    .process-list-python .circle {
        --top: 260px;
    }
    .circle-reverse,
    .process-list-about .circle-reverse {
        transform: rotate(360deg) translateX(9px);
    }
    .circle-2,
    .circle-3,
    .circle-4,
    .process-list-about .circle-2,
    .process-list-about .circle-3,
    .process-list-about .circle-4,
    .process-list-about .circle-5 {
        @apply left-auto;
    }
    .circle-2,
    .process-list-about .circle-2 {
        top: calc(var(--top) + var(--item-h));
    }
    .circle-3,
    .process-list-about .circle-3 {
        top: calc(var(--top) + var(--item-h) * 2);
    }
    .circle-4,
    .process-list-about .circle-4 {
        top: calc(var(--top) + var(--item-h) * 3);
    }
    .process-list-about .circle-5 {
        top: calc(var(--top) + var(--item-h) * 4);
    }

    /* about us page css start */
    .about-us-animation .custom-min-height {
        @apply min-h-[auto];
    }
    /* about us page css end */
    .application-video-one video,
    .application-video-two video {
        @apply max-w-[80%];
    }
    .nav.work-nav {
        @apply absolute hidden top-full	z-[1];
    }
    .nav.work-nav.show {
        @apply block;
    }
    .work-nav button {
        @apply w-full;
    }
    /* footer css */
    .row.get-touch-section {
        @apply gap-30;
    }
    .project-logo {
        @apply py-[5px] px-[30px];
    }
    picture.pic-bg img {
        @apply left-0 h-[600px];
        transform: translate(-41px, -8%) rotate(90deg);
    }
    .app-img-wrapper {
        @apply h-[370px];
    }
    .top-border-edge,
    .bottom-border-edge {
        @apply max-w-full overflow-hidden;
    }
    .top-border-edge svg,
    .bottom-border-edge svg {
        @apply h-10 w-auto object-cover;
    }
    .process-list-fintech .circle {
        --top: 283px;
    }
}

@media (max-width: 575.98px) {
    /* serving css start */
    .serving-content {
        @apply pt-[250px] pb-[230px] px-0;
    }
    .serving-bg {
        @apply py-[70px] px-0;
    }
    .serving__logo1 {
        @apply top-[3%] left-[22%];
    }
    .serving__logo2 {
        @apply left-auto top-[4%] right-[16%];
    }
    .serving__logo3 {
        @apply top-[16%] left-[12%];
    }
    .serving__logo4 {
        @apply left-auto top-[14%] right-[29%];
    }
    .serving__logo5 {
        @apply top-auto right-auto left-[11%] bottom-[4%];
    }
    .serving__logo6 {
        @apply top-auto right-auto left-[26%] bottom-[14%];
    }
    .serving__logo7 {
        @apply top-auto left-auto right-[34%] bottom-[3%];
    }
    .serving__logo8 {
        @apply top-[79%] right-[12%];
    }
    /* serving css end */
}
.mobile-carousel {
    -webkit-overflow-scrolling: touch;
}
/* project slider css */
/* .video-frame .slick-slide {transition:.3s ease filter;cursor: pointer;}
.video-frame .slick-slide:hover {transition:.3s ease filter, .3s ease opacity;filter: blur(1px);opacity:.85} */
.app-item img {
    @apply rounded-[14px];
}
.app-img-wrapper {
    @apply h-[460px];
}
.app-img-wrapper img {
    @apply max-h-full h-full w-auto max-w-none;
}
.video-frame .slick-slide {
    @apply cursor-pointer;
}
/* .video-frame .slick-slide:hover {transition:.3s ease filter, .3s ease opacity;filter: blur(1px);opacity:.85} */

.carousel.slick-slider ul.slick-dots {
    @apply mt-6 !flex;
}
@media only screen and (min-width: 576px) {
    .carousel.slick-slider ul.slick-dots {
        @apply mt-8;
    }
}
@media only screen and (min-width: 1200px) {
    .carousel.slick-slider ul.slick-dots {
        @apply mt-12;
    }
}
.carousel.slick-slider ul.slick-dots li {
    @apply mr-8;
}
.carousel.slick-slider ul.slick-dots li:last-child {
    @apply mr-0;
}
.carousel.slick-slider ul.slick-dots li button {
    @apply block w-[1.2rem] h-[1.2rem] text-[0] bg-none rounded-full;
    border: 1px solid var(--grey70);
}
.carousel.slick-slider ul.slick-dots li button:before {
    @apply top-[-4px] left-[-4px] !content-[''];
}
.carousel.slick-slider ul.slick-dots li.slick-active button {
    border: 1px solid var(--primary);
    background: var(--primary);
}
.section-slider-screens {
    @apply overflow-hidden z-[1] w-full;
}
.section-slider-screens .slick-prev {
    @apply !hidden;
}
.section-slider-screens .slick-next {
    @apply !hidden;
}
@media only screen and (min-width: 576px) and (max-width: 640px) {
    .section-slider-screens {
        @apply pt-0 mb-2.5;
    }
}
@media only screen and (min-width: 601px) and (max-width: 767px) {
    .section-slider-screens {
        @apply pt-0 mb-30;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .section-slider-screens {
        @apply pt-[70px] pb-[70px];
    }
}
.section-slider-screens .ipad-frame-box {
    @apply relative flex flex-row items-center z-[2] w-[62.75vw] h-[39.56vw] mx-auto my-0;
}
.section-slider-screens .ipad-frame-box .ipad-frame-main {
    background-color: var(--bs-border-color);
        border: solid 1px var(--bs-border-color);
        -webkit-transition: ease-in-out all 0.3s;
        transition: ease-in-out all 0.3s;
    @apply absolute top-0 rounded-[40px] w-[60.8vw] h-[39.67vw];
   
}
.section-slider-screens .ipad-frame-box .ipad-frame-main img {
    @apply relative rounded-[40px] p-[1px] z-[2] w-[60.677vw] h-[39.667vw];
}
.section-slider-screens .ipad-frame-box .video-frame {
    @apply absolute top-3 items-center w-[60.677vw] h-[38.67vw];
}
.section-slider-screens .slide-one {
    transform: scale(0.8);
        transition: all 0.5s ease-in;
    @apply text-center	relative mt-4;
   
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .section-slider-screens .slide-one {
        @apply rounded-[10px];
    }
}
.section-slider-screens .slide-one img {
    aspect-ratio: auto 1067/669;
    @apply h-auto max-w-full rounded-[18px] w-[1067px];
   
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .jobapplyimgres {
        @apply absolute bottom-[-2%];
    }
    .address-box {
        @apply !h-full;
    }
    .btn {
        @apply py-[0.625rem] px-4;
    }
    .cs-card img {
        @apply !h-full;
    }
    .section-slider-screens .slide-one img {
        @apply rounded-[10px];
    }
}
.section-slider-screens .slick-list {
    overflow: inherit;
}
.section-slider-screens .slick-list .slick-current .slide-one {
    transform: scale(1);
    transition: all 0.9s ease-in;
}
.section-slider-screens .slick-next,
.section-slider-screens .slick-prev {
    @apply hidden z-[5];
}
.section-slider-screens .slick-next:before,
.section-slider-screens .slick-prev:before {
    @apply bg-transparent text-[0];
    color: var(--bs-black);
}

@media only screen and (min-device-width: 1000px) and (max-device-width: 1100px) and (orientation: portrait) {
    .testimonial-client-img {
        @apply object-cover;
    }
}

@media only screen and (min-width: 811px) and (max-width: 991px) {
    .case-study-slider-img .slick-dots {
        @apply !bottom-[-71px] top-[108%]; 
    }

    .testimonial-slider-img.case-study-slider-img .slick-dots {
        @apply !bottom-[-90px] top-[110%];
    }
    .case-study-img {
        @apply rounded-tr-[0] rounded-br-[0];
    }
}

@media only screen and (min-width: 768px) and (max-width: 810px) {
    .case-study-slider-img .slick-dots {
        @apply !bottom-[-71px] top-[108%];
    }

    .testimonial-slider-img.case-study-slider-img .slick-dots {
        @apply !bottom-[-90px] top-[110%];
    }

    .case-study-img {
        @apply rounded-tr-[0] rounded-br-[0];
    }
}

@media only screen and (min-device-width: 1000px) and (max-device-width: 1100px) and (orientation: portrait) {
    .testimonail-slider-card .card-text-description {
        @apply min-h-[175px];
    }
    .testimonail-slider-text {
        @apply min-h-[85px];
    }
    .testimonial-client-img {
        @apply object-cover;
    }
}

@media only screen and (min-width: 811px) and (max-width: 991px) {
    .case-study-img {
        @apply rounded-bl-[10px] rounded-br-[10px] rounded-tr-[0] w-full;
    }

    .case-study-slider .card-description {
        @apply p-5;
    }

    .card-text-des {
        @apply min-h-[75px];
    }
}

@media only screen and (min-width: 768px) and (max-width: 830px) {
    .aiml-hero-section .hero-row {
        @apply grid-cols-[repeat(1,1fr)];
    }
    .service-offered-tabs {
        @apply w-[15rem];
    }
    .card-text-des {
        @apply min-h-[75px];
    }

    .case-study-img {
        @apply rounded-tr-[0] rounded-br-[10px] rounded-bl-[10px] w-full;
    }

    .case-study-slider .card-description {
        @apply p-5;
    }
}

@media only screen and (max-width: 767px) {
    .service-tabs-header {
        @apply flex-wrap;
    }
    .service-offered-tabs {
        @apply flex-row overflow-scroll flex-nowrap w-[25rem] h-[125px];
    }
    .service-offered-tabs li {
        @apply py-[30px] px-[15px];
    }
    .service-tab-size > div:first-child {
        /* Your CSS styles */
        @apply w-[14em];
    }
    .aiml-hero-section .hero-row {
        @apply grid-cols-[repeat(1,1fr)];
    }
    .case-study-img {
        @apply rounded-tr-[0] rounded-bl-[10px];
    }

    .case-study-slider-img .slick-dots {
        @apply !bottom-[-68px] top-[109%];
    }

    .case-study-slider .card-description {
        @apply p-[15px];
    }

    .case-study-slider .card-body {
        @apply min-h-[540px];
    }

    .testimonail-slider-card {
        @apply p-[15px];
    }

    .testimonail-slider-card .card-body {
        @apply min-h-[645px];
    }

    .testimonial-client-img {
        @apply object-cover;
    }
    .case-study-img {
        @apply rounded-tr-[0] rounded-bl-[10px];
    }

    .ic-45 {
        @apply h-6 w-6;
    }
    .sticky-content .card-body {
        @apply p-5;
    }
    .mb-res2 {
        @apply mb-0;
    }
    .mb-res5 {
        @apply mb-[5rem];
    }
    .section-slider-screens .ipad-frame-box .video-frame {
        @apply top-0;
    }
    .section-slider-screens .ipad-frame-box .ipad-frame-main img,
    .section-slider-screens .ipad-frame-box .ipad-frame-main {
        @apply rounded-[20px];
    }
    .section-slider-screens .ipad-frame-box .ipad-frame-main {
        @apply top-1.5;
    }
}
@media only screen and (min-width: 1920px) {
    .section-slider-screens .ipad-frame-box .ipad-frame-main {
        @apply w-[58.8vw] h-[38vw];
    }
    .section-slider-screens .ipad-frame-box .ipad-frame-main img {
        @apply w-[60.677vw] h-[38vw];
    }
}
@media only screen and (min-width: 2200px) {
    .section-slider-screens .ipad-frame-box .ipad-frame-main img {
        @apply w-[57.677vw] h-[28.5vw];
    }
    .section-slider-screens .ipad-frame-box .ipad-frame-main {
        @apply w-[43.8vw] h-[28.5vw];
    }
    .section-slider-screens .ipad-frame-box {
        @apply w-[47.75vw] h-[31.56vw];
    }
    .section-slider-screens .ipad-frame-box .video-frame {
        @apply w-[43.677vw] h-[27.67vw];
    }
}

.invalid,
.invalid:focus {
    border: 1px solid var(--bs-danger);
}

/* pashwa */
.sec-pashwa .hero-tech-img {
    @apply right-[-8rem] sm:right-0 lg:right-[-21rem] top-0 sm:h-[370px] md:h-[480px] lg:top-8;
}
.sec-pashwa h1 {
    @apply sm:text-[28px] md:text-[48px] sm:leading-[40px] md:leading-[64px];
}
.sec-pashwa {
    background: radial-gradient(
        50% 50% at 50% 50%,
        rgba(113, 75, 103, 0.02) 0%,
        rgba(113, 75, 103, 0.08) 46.5%,
        rgba(113, 75, 103, 0.12) 100%
    );
}
.custom-list li::marker {
    @apply text-[0.8rem];
}
.custom-image {
    @apply bg-purperl_new rounded-[50%] p-[10px] inline-block;
}
.custom-chevron .text-primary {
    @apply !text-[#714b67];
}
/* video popup */
.cookie-toast-two {
    box-shadow: 0px 4px 14px 0px #00000040;
    z-index: 100;
}
.cookie-toast-border {
    @apply border-[1.8px] border-white border-solid;
}
.video-container {
    @apply relative w-full h-full overflow-hidden;
}

.overlay {
    background: rgba(0, 0, 0, 0.3); /* Semi-transparent black overlay */
    @apply absolute top-0 left-0 right-0 bottom-0 z-[1];
}

.proximanovacond {
    font-family: '__proximanovacond_19ffc0';
    font-display: swap;
    font-style: normal;
    @apply font-bold;
}

.bg-supplychain-changing img {
    @apply right-0 bottom-[-120px] absolute min-h-full w-full opacity-10;
}

.bg-agriculture-numbers img {
    @apply right-0 top-0 absolute min-h-full w-full object-cover z-0;
}
.bg-gradient-ai-ml{
    background:
            linear-gradient(to bottom,
                black 0%,
                rgba(17, 17, 17, 0.1) 40%,
                rgba(17, 17, 17, 0.1) 60%,
                black 100%);
                background-size: cover;
                    background-position: center;
}
.bg-livestock-management {
    @apply bg-[url('/img/agriculture-industry/webp/img-livestock-management.webp')];
}
.bg-farm-management {
    @apply bg-[url('/img/agriculture-industry/webp/img-agriculture-farm.webp')];
}
.bg-smart-farm-management {
    @apply bg-[url('/img/agriculture-industry/webp/img-smart-arming.webp')];
}
.bg-farm-accounting-management {
    @apply bg-[url('/img/agriculture-industry/webp/img-farm-accounting.webp')];
}
.bg-aquaculture-software-management {
    @apply bg-[url('/img/agriculture-industry/webp/img-aquaculture-software.webp')];
}
.bg-custom-farm-management {
    @apply bg-[url('/img/agriculture-industry/webp/img-custom-agriculture-drone.webp')];
}
.bg-ai-solution-management {
    @apply bg-[url('/img/agriculture-industry/webp/img-ai-solutions.webp')];
}
.bg-intelligent-farm-management {
    @apply bg-[url('/img/agriculture-industry/webp/img-intelligent-chemical.webp')];
}
.bg-intelligent-management {
    @apply bg-[url('/img/agriculture-industry/webp/img-intelligent-agriculture.webp')];
}
.bg-ai-driven-crop-management {
    @apply bg-[url('/img/agriculture-industry/webp/img-ai-driven-crop.webp')];
}
.bg-machine-learning-management {
    @apply bg-[url('/img/agriculture-industry/webp/img-machine-learning.webp')];
}
.bg-smart-agriculture-management {
    @apply bg-[url('/img/agriculture-industry/webp/img-smart-agriculture.webp')];
}
.bg-smart-iot-management {
    @apply bg-[url('/img/agriculture-industry/webp/img-smart-iot.webp')];
}
.bg-drone-management {
    @apply bg-[url('/img/agriculture-industry/webp/img-drone-automation.webp')];
}

.voice-generator-box {
    @apply flex items-center justify-center rounded-10 w-12 h-12 bg-[#05A6F01A];
}

.scm-software-dev-tab-items {
    @apply !border-b !border-[#D7DEE5];
}

.scm-software-dev-tab-items button {
    @apply font-bold text-[20px] leading-[30px] text-[#111111] h-[86px] rounded-none;
    border-right: 1px solid #d7dee5;
}
.scm-software-dev-tab-items button.active {
    @apply bg-[#FFD100] border-b-0;
}
.scm-software-dev-tab-items button:hover {
    @apply bg-[#FFD100] border-b-0;
}

/* fintech */
.fintech-hero-section.hero {
    @apply min-h-[700px];
}
.bg-finTech-solutions {
    @apply bg-[url('/img/fintech-industry/webp/img-ai-enabled-fintech.webp')];
}
.bg-robotic-process {
    @apply bg-[url('/img/fintech-industry/webp/img-robotic-process.webp')];
}
.bg-custom-financial {
    @apply bg-[url('/img/fintech-industry/webp/img-custom-financial-software.webp')];
}
.bg-legacy-system {
    @apply bg-[url('/img/fintech-industry/webp/img-legacy-system.webp')];
}
.bg-fintech-app-dev {
    @apply bg-[url('/img/fintech-industry/webp/img-fintech-app-development.webp')];
}
.bg-payment-processing {
    @apply bg-[url('/img/fintech-industry/webp/img-payment-processing.webp')];
}
.bg-compliance-first {
    @apply bg-[url('/img/fintech-industry/webp/img-compliance-first.webp')];
}
.bg-fintech-software {
    @apply bg-[url('/img/fintech-industry/webp/img-fintech-software.webp')];
}
.bg-cross-border {
    @apply bg-[url('/img/fintech-industry/webp/img-cross-border.webp')];
}
.bg-advanced-risk {
    @apply bg-[url('/img/fintech-industry/webp/img-advanced-risk-analytics.webp')];
}
.bg-fraud-detection {
    @apply bg-[url('/img/fintech-industry/webp/img-fraud-detection.webp')];
}
.bg-financial-transaction {
    @apply bg-[url('/img/fintech-industry/webp/img-financial-transaction.webp')];
}
.bg-improving-efficiency {
    @apply bg-[url('/img/fintech-industry/webp/img-improving-efficiency.webp')];
}
.bg-ai-enabled-customer {
    @apply bg-[url('/img/fintech-industry/webp/img-ai-enabled-customer.webp')];
}
.bg-navigating-complexity {
    @apply bg-[url('/img/fintech-industry/webp/img-navigating-the-complexity.webp')];
}
.bg-mobile-accounting {
    @apply bg-[url('/img/fintech-industry/webp/img-mobile-accounting.webp')];
}
.bg-risk-management {
    @apply bg-[url('/img/fintech-industry/webp/img-risk-management.webp')];
}
.bg-financial-planning {
    @apply bg-[url('/img/fintech-industry/webp/img-financial-planning.webp')];
}
.bg-financial-analysis {
    @apply bg-[url('/img/fintech-industry/webp/img-financial-analysis.webp')];
}
.bg-cloud-based {
    @apply bg-[url('/img/fintech-industry/webp/img-cloud-based.webp')];
}
.aienabled-fintech-slider.case-study-slider-img .slick-dots {
    @apply top-[112%];
}
.python-card {
    @apply max-h-[350px] min-h-[350px];
}

.python-enabled-slider.case-study-slider-img .slick-dots {
    @apply top-[112%];
}
.bg-why-choose {
    @apply bg-[url('/img/python/webp/img-cta.webp')];
}

.aiml-chip {
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 10px 20px;
    display: inline-block;
    width: fit-content;
}

.gradient-text {
    background: linear-gradient(90deg, #05a6f0 31.73%, #ffa500 75%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.btn-gradient-border {
    position: relative;
    border-radius: 10px;
    background: transparent;
    backdrop-filter: blur(10px); 
    z-index: 1;
}
.btn-gradient-b {
    color: #ffffff;
    border-radius: 10px;
    background: linear-gradient(90deg, #05a6f0 0%, #ffa500 80%) border-box;
    border: 1px solid transparent;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding-inline: 5px !important;
}


.btn-gradient-border::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 10px;
    padding: 1.5px;
    background: linear-gradient(90deg, #05a6f0 31.73%, #ffa500 75%);
    -webkit-mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    z-index: -1;
}

.btn-gradient-border.btn {border: none;}


.glass-effect-aiml {
    background: #11111166;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.bg-ready-transform {
    @apply bg-[url('/img/llms-aiml/webp/img_discoverydesign_2x.webp')] bg-no-repeat bg-center bg-cover;
}

.bg-ready-transform .counter-overlay {
    @apply bg-[#00000066] rounded-10;
}

.counter-overlay-value {
    opacity: 0.1;
    background: linear-gradient(180deg, #111 0%, rgba(17, 17, 17, 0) 33.9%, rgba(17, 17, 17, 0) 75.2%, #111 86.24%);
}

.technical-approach-slider.case-study-slider-img .slick-dots li.slick-active button {
    @apply bg-[#05A6F0];
}

.technical-approach-slider.case-study-slider-img .slick-arrow.slick-prev {
    @apply !bg-[url('/img/llms-aiml/svg/icon-left-arrow.svg')] border-2 border-white border-solid;
}

.technical-approach-slider.case-study-slider-img .slick-arrow.slick-next {
    @apply !bg-[url('/img/llms-aiml/svg/icon-right-arrow.svg')] border-2 border-white border-solid;
}

.bg-discovery-design {
    @apply bg-[url('/img/llms-aiml/webp/img_discoverydesign.webp')] bg-cover bg-center;
}

.bg-deployment-monitoring {
    @apply bg-[url('/img/llms-aiml/webp/img_deploymentmonitoring.webp')] bg-cover bg-center;
}

.bg-integration-testing {
    @apply bg-[url('/img/llms-aiml/webp/img_integrationtesting.webp')] bg-cover bg-center;
}

.bg-fine-tuning {
    @apply bg-[url('/img/llms-aiml/webp/img_finetuning.webp')] bg-cover bg-center;
}

.bg-prompt-engineering {
    @apply bg-[url('/img/llms-aiml/webp/img_promptengineering.webp')] bg-cover bg-center;
}

.bg-rag-architecture {
    @apply bg-[url('/img/llms-aiml/webp/img_ragarchitecture.webp')] bg-cover bg-center;
}

.bg-data-preparation {
    @apply bg-[url('/img/llms-aiml/webp/img_datapreparation.webp')] bg-cover bg-center;
}

.aiml-banner-video .hero-content {
    padding-top: 9rem;
}

.llms-banner-video .hero-content {
    padding-top: 9rem;
}

.bg-aiml-service-offer{
background:
  linear-gradient(
  to bottom,
  black 0%,                 
  rgba(17, 17, 17, 0.1) 40%,   
  rgba(17, 17, 17, 0.1) 60%,   
  black 100%               
),
  url('/img/img_service_offered.webp');
background-size: cover;
background-position: center;

}

.service-tabs-header ::-webkit-scrollbar {
    width: 3px;
}

.service-tabs-header ::-webkit-scrollbar-track {
    background: #3c4561; /* track color */
}

.service-tabs-header ::-webkit-scrollbar-thumb {
    background: #ffffff; /* scrollbar color */
    border-radius: 0;
}

.bg-aiml-faq {
    @apply bg-[url('/img/img_aiml_cta.webp')] bg-cover bg-center text-white;
}

.bg-aiml-faq p {
    @apply text-white;
}

.counter-overlay-value11 {
    background: linear-gradient(180deg, #111 0%, rgba(17, 17, 17, 0) 33%, rgba(17, 17, 17, 0) 88%, #111 100%);
}
.aiml-menu-head .menu-body a {
    @apply font-bold text-textcolor hover:text-blue transition-all dark:text-light dark:hover:text-blue;
}

.has-menu.open-megamenu .sub-menu.service-menu.aiml-menu {
    @apply min-h-[580px];
}

.pmigjc-anantam-section img {@apply max-w-full;}

.has-menu.open-megamenu .sub-menu.service-menu.work-menu {
    @apply min-h-[315px];
}

@media only screen and (min-device-width: 1000px) and (max-device-width: 1100px) {
    .aiml-banner-video .hero-content {
        padding-top: 5rem;
    }

    .llms-banner-video .hero-content {
    padding-top: 5rem;
}
.sepecification-pmigjc img {@apply h-[50px] max-w-[75px] w-auto object-contain}
}

@media (max-width: 991.98px) {
     .cursor-pointer.link-whatsapp img {height: 34px;}
     .cursor-pointer.link-whatsapp svg {height: 34px; width: 34px;}
     .cursor-pointer.link-footer svg { width: 34px;height: 34px;}
     .order-responsive-pmigjc {@apply order-2}
}

@media only screen and (min-device-width: 768px) and (max-device-width: 992px){
    .logo-responsive {margin-left: 80px;}
    .sepecification-pmigjc img {@apply h-[65px] max-w-full w-auto object-contain}
}

@media only screen and (max-width: 767px) {
    .project-management-img {@apply h-[59px];}
    .anantam-img {@apply h-[65px];}
    .sepecification-pmigjc img {@apply h-[50px] max-w-[75px] w-auto object-contain}
    .logo-responsive {margin-left: 35px;}
    .scm-software-dev-tab-items button {
        @apply text-[13px] leading-[20px];
    }
    .res-display span {
        @apply hidden;
    }
    .res-display {
        @apply px-[8px];
    }
    .aiml-banner-video .hero-content {padding-top: 5rem;}
    .aiml-menu-head .menu-body a {padding-bottom: 6px; padding-top: 24px;}
     .aiml-menu-head .menu-body p {
    padding-right: 15px;}
    .aiml-banner-video.hero { min-height: 539px;}
    .llms-banner-video .hero-content {
    padding-top: 6rem;
}

.aiagent-banner.llms-banner-video .hero-content {
    padding-top: 9rem;
}
   
}

/* al&ml animation css */
.display-card {
    background:
        linear-gradient(to right, rgba(229, 231, 235, 0.4), #ffffff) padding-box,
        linear-gradient(to right, #d1d5db, #ffffff) border-box;
    border: 2px solid transparent;
}

.display-card:hover {
    background:
        linear-gradient(to right, rgba(229, 231, 235, 0.4), #ffffff) padding-box,
        transparent border-box;
}

@media only screen and (max-width: 767px) {
    .display-card,
    .display-card:hover {
        border: 2px solid rgba(229, 231, 235, 0.4);
    }
}

.aiml-submenu.sub-menu > li.social-mail {
    @apply w-full;
}
.border-border_new{
    border: 1px solid #3C4561;
  
}