/* NEW HOME */


:root {
    --primary: #1476F2;
    --dark: #0b101a;
    --text-light: #ffffff;
    --text-dark: #222;
    --muted: #666;
    --primary-light-color : #E1EEF9;
    --white-color-20: #FFFFFF33;
    --white-color-30: #FFFFFF4D;
    --theme-border-color : #E6F3FF;
    --blue-color : #25395C;
    --blue-border-color : #25395C1A;
    --color-black : #000000;
    --radius: 40px;
    --spacing: 1.2rem;
    --container-width: 1320px;
}

body { background: #F7F7F8; color: var(--text-dark); line-height: 1.6; }
.header-main { position: absolute; top: 0; right: 0; left: 0; background:#fff; border-bottom: 1px solid #FFFFFF29; width: 100%; }
.header-main.sticky-header { background: var(--color-white); animation: slideDown 0.35s ease-out; position: fixed; box-shadow: 10px 9px 50px rgb(13 28 62 / 10%); }
.header-main .navbar-toggler .navbar-toggler-icon{ background-color: var(--color-blue); }
.header-main.sticky-header .navbar-toggler .navbar-toggler-icon{ background-color: var(--color-black); }
body.home .header-main.sticky-header .nav-link{ color: var(--color-black) !important; }
body.home .header-main:not(.sticky-header) .nav-link::after { filter: invert(1); }
body.home .header-main .nav-link { color: var(--color-white) !important; }
.header-main .nav-item:not(:last-child)::after{ filter: invert(1); }
.header-main.sticky-header .nav-item:not(:last-child)::after{ filter: invert(0); }
body.home .header-logo .logo-1 { display: none; }
body.home .header-logo .logo-2 { display: block; }
body.home .header-main.sticky-header .header-logo .logo-1 { display: block; }
body.home .header-main.sticky-header .header-logo .logo-2 { display: none;  }

.tab_nav .nav-card {background-color: transparent;}


.btn {color: var(--color-white); box-shadow: 0px 4px 15px 0px #1D190E1A;}
.btn1  {font-size: var(--font-20); line-height: 24px;}

.section-spacing { padding: 100px 0;}
.section-inner-head h2, .bold-title{ color: var(--color-black);}
.section-inner-head h2{ font-weight: var(--fw-700); user-select: none; margin-bottom: 10px;}
.sub-heading {
	font-size: 20px;
	line-height: 28px;
	font-weight: 500;
	padding-bottom: 5px;
	margin-bottom: 10px;
	display: inline-flex;
	position: relative;
	letter-spacing: 18%;
	text-transform: uppercase;
}
sub-heading::after {content: ''; height: 3px; width: 32px; border-radius: 2px; background-color: var(--primary); position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
.sub-heading.start::after {left: 0%; transform: translateX(0%);}
h2, .bold-title{ line-height: 53px; font-weight: 400; color: #1D1D1F;}
.bold-title { font-size: var(--font-48); font-weight: 900;}
.mab-60 {margin-bottom: 60px;}
h4 {font-weight: 700;}
a:hover{color: var(--primary-color);}

h3 {
    color: var(--color-black);
    line-height: 40px;
}

p {
    font-size: 18px;
    line-height: 28px;
    font-weight: 300;
}


.py-100 {
    padding: 100px 0;
}

.py-80 {
    padding: 80px 0;
}

.body-container {
	padding: 0 50px;
}

.ai-btn {
	position: relative;
	display: inline-block;
	text-decoration: none;
	border-radius: 60px;
	overflow: hidden;
	top: 5px;
}

/* Rotating Gradient Border */
.ai-btn::before{
    content:"";
    position:absolute;
    inset:-150%;

    background:conic-gradient(
        from 0deg,
        #1e90ff,
        #00c853,
        #ff9800,
        #ff4d4d,
        #1e90ff
    );

    animation:rotateGradient 2s linear infinite;
}

/* White Background Area */
.ai-btn .content{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    gap:14px;
    margin:2px;
    padding:11px 10px;
    width: 211px;
    background:#fff;
    border-radius:60px;
    font-size:17px;
    font-weight:600;
    color:#222;
    transition:all .4s ease;
}

.header-logo {
	padding-bottom: 8px;
}

/* Icon */
.ai-btn svg{
    flex-shrink:0;
}

/* Hover Effect */
.ai-btn:hover{
    transform:translateY(-3px);
    transition:.4s ease;
}

.ai-btn:hover::before{
    animation-duration:1.2s;
}

.ai-btn:hover .content{
    box-shadow:
        0 0 15px rgba(30,144,255,.25),
        0 0 35px rgba(0,200,83,.15),
        0 0 60px rgba(255,152,0,.15);
}

/* Text Gradient on Hover */
.ai-btn:hover .content span{
    background:linear-gradient(
        90deg,
        #1e90ff,
        #00c853,
        #ff9800
    );

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

/* Rotation Animation */
@keyframes rotateGradient{
    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }
}
/* Hero */
.hero {
    min-height: calc(100vh - 64px);
    background: linear-gradient(105deg, var(--blue-dark) 0%, #0d3080 38%, #8fa8c8 68%, #c8d4e0 85%, #d8dfe8 100%);
    display: flex;
    align-items: center;
    padding: 80px 80px;
    position: relative;
    overflow: hidden;
}
.hero__wrapper {min-height: 100vh;display: flex;padding: 305px 0 210px;
    background: linear-gradient(105deg, #00387E 0%, #00387E 8%, #8fa8c8 68%, #c8d4e0 85%, #d8dfe8 100%);color: var(--text-light);position: relative;/*! overflow: hidden; */}
.hero__wrapper .btn {box-shadow: rgb(242 168 67 / 44%) 0px 7px 29px 0px;}
.hero__wrapper .container-fluid {position: relative;z-index: 9;}
.hero__subtitle {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px dashed #FFFFFF33;
    padding: 4px 8px;
    width: fit-content;
    margin: 0 auto 24px;
    list-style: none;
}
.hero__subtitle li:not(:last-child) {padding-right: 22px; position: relative;}
.hero__subtitle li:not(:last-child)::after {content: ''; width: 6px; height: 6px; border-radius: 50%; background-color: var(--color-white); position: absolute; top: 50%; transform: translateY(-50%); right: 8px;}

.hero__title {
	font-size: 72px;
	line-height: 90px;
	margin: 1.5rem 0;
	font-weight: normal;
}

.hero__description {
    margin-bottom: 0;
}

.stats {
    display: flex;
    justify-content: space-between;
    background: #fff;
}

.stats__item {
    text-align: center;
}

.stats .stats__item {
    display: flex;
    text-align: left;
    gap: 22px;
    align-items: center;
    padding: 30px 10px 29px 60px;
    border-right: 1px solid #F3F3F6;
    width: 100%;
}

.stats .stats__item:first-child {
    /*! border-left: 0; */
    /*! border-right: 0; */
}

.stats .stats__item:last-child {
    border-left: 0;
    border-right: 0;
}

.stats .stats__item .stats__content h2 {
    font-size: 48px;
}
.stats .stats__item .stats__content p {
    font-weight: 500;
}

.status__icon {
	background: rgba(20,118,242, 0.1);
	border-radius: 66px;
	width: 74px;
    min-width: 74px;
	height: 74px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.hero__content {
    max-width: 835px;
}

.hero__content .hero__btn {
    margin: 60px 0;
}
.hero__btn .btn--primary-outline {
    border-color: var(--primary);
    color: var(--primary);
    box-shadow: none;
}
.hero__content > *:not(.btn) {color: var(--color-white);}

.hero__video {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: translate(-50%, -50%);
    z-index: 0;
}

.hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(rgba(0, 0, 0, 0.7),
            rgba(0, 0, 0, 0.5));
    
    z-index: 1;
}

.hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,rgba(0, 56, 126, 0.93) 0%, rgba(0, 0, 0, 0) 100%);
    
}

.hero__wrapper::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*! background: radial-gradient(circle at left center, rgb(1 37 55 / 88%), transparent 70%); */
    /*! filter: blur(50px); */
    z-index: 1;
    pointer-events: none;
}

.hero__wrapper::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    /*! height: 100%; */
    /*! background: radial-gradient(circle at right center, rgb(255 200 0 / 25%), transparent 70%); */
    filter: blur(50px);
    z-index: 1;
    pointer-events: none;
}

.brands{text-align: center;padding: 3rem 0;background: #fafafa;}
.brands__grid{display: flex;gap: 2rem;justify-content: center;margin-top: 1.5rem;}
.hero__wrapper .btn--primary::before, .hero__wrapper .btn--primary::after {
    background: #FFFFFF1A;
}
.hero__wrapper .btn--primary-outline::before, .hero__wrapper .btn--primary-outline::after {
    background: #1476f2;
}
.hero__wrapper .btn--primary-outline:hover {
    border-color: #1375f1;
}
/* end */

/* What-We-Do Section */
.what-we-do .section-inner-head{max-width: 935px;}
.what-we-group .what-we-box:nth-child(1) > span{
    background:#DCA1A1;
}

.what-we-group .what-we-box:nth-child(2) > span{
    background:#BFDAA4;
}

.what-we-group .what-we-box:nth-child(3) > span{
    background:#F4F08C;
}

.what-we-group .what-we-box:nth-child(4) > span{
    background:#FFA756;
}
.what-we-do .sub-heading::after{left: 0;transform: inherit;}
.what-we-group{display: grid;grid-template-columns: repeat(4, 1fr);gap: 30px;}
.what-we-box {
	border: 1px solid rgba(71, 80, 103, 0.2);
	border-radius: 18px;
	background: #fff;
	padding: 20px;
}
.what-we-box>span{width: 54px;height: 54px;display: flex;align-items: center;justify-content: center;border-radius: 50px;background-color: rgb(20, 118, 242, 0.5);font-size: var(--font-20);line-height: 28px;color: var(--color-black);transition: all 350ms ease-in-out;}
.what-we-box h3{font-size: var(--font-22);line-height: 28px;margin-top: 20px;margin-bottom: 14px; font-weight: 500; color: var(--color-black);}
.what-we-box p{color: var(--color-black);}
.what-we-box:hover>span{box-shadow: 7px 9px 20px rgb(20, 118, 242, 0.5);background-color: var(--primary) !important;color: var(--color-white);}
.btn-arrow svg{ fill:#000;
    transform: rotate(-45deg);    transition: all ease-in-out .3s !important;
margin: auto;
}
/* .service-cards-wrapper {
	background: #fff;
	border-radius: 16px;
	border: 1px solid rgba(71, 80, 103, 0.2);
} */
.btn-arrow:hover svg{   
    transform: rotate(-0deg);
    fill: #000;
}

/* clients */
.client-logo-wrapper {
	background: #fff;
	height: 100px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}
.clients-section {padding: 60px 0;}
.overlaylogo {background-image: url("../images/client-bg.png");}
.client-text {text-align: center;margin-bottom: 30px; font-size: 24px; line-height: 32px;}
.clients-section .clients-slider {position: relative;}
.clients-section .clients-slider::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 320px;
    /* adjust as needed */
    height: 100%;
    pointer-events: none;
    background: linear-gradient(90deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
    z-index: 5;
}

.clients-section .clients-slider::after {
	content: "";
	position: absolute;
	right: 0;
	top: 0;
	width: 320px;
	height: 100%;
	pointer-events: none;
	background: linear-gradient(266deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
	z-index: 5;
}

.overlaylogo{position:relative;}
.overlaylogo:before {
    position: absolute;
    top: 0; content: "";
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../images/logo-bg.png") no-repeat center center;
    z-index: 1;
}

/* end  */

/* service */

.service-card {
    border-radius: 16px;
    padding: 28px 26px 28px 32px;
    height: 100%;
    position: relative;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.service-card::before {
    content: "";
    position: absolute;
    left: -13px;
    top: 18px;
    bottom: 18px;
    width: 2px;
    border-radius: 999px;
    background: linear-gradient(to bottom,
            rgba(148, 163, 184, 0), rgb(223 223 223 / 70%), rgba(148, 163, 184, 0));
}

.service-card::after {
    content: "";
    position: absolute;
    left: 0;
    top: -18px;
    width: 100%;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(to right, rgba(148, 163, 184, 0), rgb(223 223 223 / 70%), rgba(148, 163, 184, 0));
}

.service-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12);
}

.service-card:hover .service-dot {
    transform: scale(1.06);
}

.col-md-6.col-lg-4:nth-child(1) .service-card::after,
.col-md-6.col-lg-4:nth-child(2) .service-card::after,
.col-md-6.col-lg-4:nth-child(3) .service-card::after {
    opacity: 0;
}

.col-md-6.col-lg-4:nth-child(1) .service-card::before,
.col-md-6.col-lg-4:nth-child(4) .service-card::before {
    opacity: 0;
}

.service-dot {
    width: 60px;
    height: 60px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    transition: transform 0.25s ease;
}


.service-title {
    font-size: 24px;
    line-height: 32px;
    font-weight: 500;
    color: var(--color-black);
    margin-bottom: 8px;
    position: relative;
}

.service-title::before {
    content: '';
    width: 2px;
    height: 100%;
    position: absolute;
    left: -45px;
    background-color: var(--primary);
}

.col-md-6.col-lg-4:nth-child(1) .service-title::before,
.col-md-6.col-lg-4:nth-child(4) .service-title::before {
    opacity: 0;
}

.service-text {
    font-size: 20px;
    line-height: 28px;
    /*! color: var(--color-black); */
    margin: 0;
}

/* end */

/* metrics */

.metrics-section {
    padding: 0 0 100px;
}

.metrics-card {
    border-radius: 18px;
    border: 0;
    overflow: hidden;
    background: linear-gradient(180deg, #fdf6ed 0%, #eaf3ff 100%);
    border: 1px solid rgb(242 168 67 / 18%);
}

.metrics-card-inner {
    padding: 40px;
}

.metrics-tagline {
    font-size: 13px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #6b7280;
}

.metrics-heading {
    font-weight: 700;
    font-size: 35px;
    line-height: 53px;
}

.metrics-subheading {
    font-size: 20px;
    line-height: 28px;
    color: var(--color-black);
    margin-top: 12px;
}

.metrics-card-group {
    margin-top: 50px;
    padding-top: 50px;
    border-top: 1px solid var(--blue-border-color);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 100px;
}

.metric-value {
    font-size: 50px;
    font-weight: 700;
    line-height: 65px;
    margin-bottom: 24px;
    position: relative;
}

.metric-value::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 30px;
    height: 5px;
    background-color: var(--color-black);
}

.metric-title {
    font-size: 20px;
    line-height: 28px;
    font-weight: 600;
    color: var(--color-black);
}

.metric-text {
    font-size: 20px;
    line-height: 28px;
    color: var(--secondary);
    margin: 0;
}

.metrics-badge-area {
    font-size: 40px;
    font-weight: 700;
    color: #1f2937;
}

.metrics-footer {
    padding: 60px 0 0;
}
.metrics-footer img {object-fit: contain;}
.metrics-footer .swiper-wrapper {align-items: center;}
.metrics-footer .swiper-slide {display: flex; align-items: center; justify-content: center; padding: 20px;}

.metrics-logo {
    height: 60px;
    object-fit: contain;
    transition: transform 0.2s ease, filter 0.2s ease;
}

.metrics-logo:hover {
    transform: translateY(-4px);
    filter: drop-shadow(0 6px 12px rgba(15, 23, 42, 0.18));
}

/* end */

/* developement  */

/* Industries Section  */
.industries-section{background-color: #E9F3FF;}
.industries-group{display: flex;align-items: flex-start;flex-wrap: wrap;}
.industries-group .sub-heading::after{left: 0;transform: inherit;}

.machine-learning-img img{width: 100%;height: 100%;object-fit: cover;}

.left-side{flex: 0 0 53%;max-width: 53%;height: 100vh;position: sticky;top: 98px;}
.right-side{flex: 0 0 47%;max-width: 47%;padding-top: 80px; padding-left: 60px;padding-bottom: 80px;padding-right: calc((100% - 1356px) / 11);}
/* .industries-head-sticky{padding-top: 80px;position: sticky;top: 60px;z-index: 1;background-color: #F8F7F3;} */
.expertise-card{border-top: 1px solid #e5e6e6;padding: 20px;transition: all ease-in-out 0.3s;position: relative;}
.expertise-card:first-child{border-top: transparent;}
.expertise-card:hover{background-color: var(--color-white);border-top: transparent;border-radius: 20px;}
.expertise-card:hover + .expertise-card{border-top: transparent;}
.expertise-card::before{content: '';width: 3px;height: 38px;position: absolute;top: 40px;left: 0;background-color: var(--primary);border-radius: 0 4px 4px 0;opacity: 0;visibility: hidden;transition: all ease-in-out 0.3s;}
.expertise-card:hover::before{visibility: visible;opacity: 1;}
.expertise-card .title{font-size: var(--font-20);line-height: 28px;margin-bottom: 4px;margin-top: 10px;}

/* end */

/* cta-ai-section */

.cta-ai-section {
    /* padding-left: calc((100% - 1380px)/2); */
    padding-block: 151px;
    background-image: url("../images/future-bg.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom right;
    background-color: var(--primary);
}
.cta-ai-section .section-inner-head {max-width: 868px;}

.cat-subtitle {
    color: #fff;
    display: flex;
    align-items: center;
    /*! gap: 10px; */
    /*! border: 1px dashed #fad7a2; */
    /*! padding: 4px 8px; */
    /*! width: fit-content; */
    /*! margin-bottom: 40px; */
}

.cta-ai-section .cta-title {
    font-size: 42px;
    line-height: 57px;
    color: #fff;
    margin-bottom: 12px;
    font-weight: 500;
}

.cta-subtext {
    font-size: 20px;
    line-height: 28px;
    color: #fff;
}

.cta-ai-section .btn-dark-outline {
    margin-top: 40px;
}
.cta-ai-section .btn-dark-outline::before, .cta-ai-section .btn-dark-outline::after{
    background: #FFFFFF1A;
}

.btn-dark-outline {
    background-color: transparent;
    border-color: var(--color-black);
}
/* end */

/* Featured Section */
.featured-section{background-color: #F8F7F3;padding-top: 50px;padding-bottom: 50px;padding-left: calc((100% - 1356px) / 2);}
.featured-area{display: flex;align-items: center;gap: 60px;}
.featured-area h2{color: var(--color-black);}
.featured-slider{flex: 1;}
.featured-slider .swiper-slide{background-color: var(--color-white);min-height: 152px;border-radius: 18px;display: flex;align-items: center;justify-content: center;padding: 10px;}

.related-project-wrapper.design-secondary{
    overflow: hidden;
}

.related-project-wrapper.design-secondary .related-project-slider{
    overflow: hidden;
}

.related-project-wrapper.design-secondary .slider-wrapper{
    will-change: transform;
}

@media screen and (max-width: 1441px) {
    .btn1, .btn{font-size: 18px; line-height: 20px;}
    /* Hero */
    .hero__wrapper {padding: 142px 0 1px;min-height: auto;}
    .client-text {font-size: 22px; line-height: 30px;}
    
    .section-spacing{
        padding: 80px 0;
    }

    .metrics-section{
        padding-bottom: 80px;
    }
    .metrics-card-group {gap: 40px;}

    .py-80 {
        padding: 60px 0;
    }

    .list li::before{
        width: 20px;
        height: 20px;
        position: absolute;
        left: 0;
        top: 4px;
        background-size: 20px;
    }

    .list li{
        padding-left: 30px;
    }

    .stats-card p {
        font-size: 16px;
        line-height: 27px;
    }

    p {
        font-size: 18px;
        line-height: 27px;
    }



    .arrow-btn {
        width: 50px;
        height: 50px;
    }

    .mab-60 {
        margin-bottom: 40px;
    }
    .cta-ai-section {
        background-position: 65% 100%;
        padding-block: 70px;
    }
    .cat-subtitle {margin-bottom: 20px;}
    .cta-ai-section .btn-dark-outline {margin-top: 20px;}

    /* Featured Section  */
    .featured-section{padding-left: calc((100% - 1150px) / 2);}

    /* Industries Section  */
    .left-side{top: 75px;}
    .right-side{padding-right: calc((100% - 1150px) / 2);}

}

@media screen and (max-width:1199px) {
    /* .header-main .navbar-collapse {
        padding: 84px 30px 30px;
        background-color: rgb(0 0 0 / 50%);
        backdrop-filter: blur(15px);
        position: fixed;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        transform: translateX(-100%);
        overflow: hidden auto;
        transition: none;
    }
    .header-main .navbar-collapse.show {
        transform: translateX(0);
    }
    
    .header-main {padding: 0px;}
    .header-main>div{padding: 0px;}
    .header-logo-group { display: flex; align-items: center; justify-content: space-between; flex: 1; position: relative; z-index: 100; padding: 15px 25px}
    .header-logo-group{background-color: transparent; backdrop-filter: blur(15px);}
    body.overflow-hidden .header-main.sticky-header .logo-1 {display: none !important;}
    body.overflow-hidden .header-main.sticky-header .logo-2 {display: block !important;}
    
    .menu-card-inner .menu-card-left ul li a {color: var(--color-white);}
    .menu-card-inner .menu-card-left ul li a:hover {color: var(--primary) !important;}
    p , .btn, .btn1{
        font-size: 16px;
        line-height: 26px;
    }
    
    .header-main .nav-item:not(:last-child)::after{ filter: invert(1) brightness(100) !important; }
    .header-main .navbar-toggler {z-index: 100;}
    body.overflow-hidden .header-main .navbar-toggler .navbar-toggler-icon {background-color: var(--color-white) !important;} */
    body.home .header-main.sticky-header .nav-link {color: var(--color-white) !important;}

    .client-text {font-size: 20px; line-height: 28px;}

    .section__title,
    .metrics-heading,
    .section-title,
    .cta-ai-section .cta-title{
        font-size: 26px;
        line-height: 40px;
    }
    .cta-ai-section {background-position: 80% 100%;}
    .cta-ai-section .section-inner-head {max-width: 500px;}

    .metrics-card-group {margin-top: 40px; padding-top: 40px; gap: 30px;}

    .metric-title{
        font-size: 18px;
        line-height: 27px;
    }

    .metric-text{
        font-size: 16px;
        line-height: 26px;
    }

    .metric-value{
        font-size: 45px;
        line-height: 55px;
        margin-bottom: 15px;
    }

    .stats-box h2{
        font-size: 45px;
    }
    
    .stats-box span,
    .list li{
        font-size: 16px;
        line-height: 26px;
    }

    .list{
        gap: 15px;
        row-gap: 10px;
        margin: 1rem 0 30px;
    }


    h2, .bold-title {
        line-height: 40px;
    }

    
    .resources-link {font-size: var(--font-16); line-height: 27px;}

    .arrow-btn {
        width: 45px;
        height: 45px;
    }

    .cta-ai-section .btn-dark-outline{
        margin-top: 20px;
    }

    /* Featured Section */
    .featured-section{padding-left: 25px;}
    .featured-area{gap: 30px;}

    /* Industries Section */
    .right-side{padding:0  25px 40px;}
    .industries-head-sticky{
        padding-top: 40px;
        top: 60px;
    }

}

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

    /* Stats Section */
    .stats-card{
        flex-wrap: wrap;
    }

    .py-100{
        padding: 60px 0;
    }

    .cta-ai-section {
        padding: 60px 0;
    }
}

@media screen and (max-width: 991px) {
    .col-md-6.col-lg-4:nth-child(3) .service-card::after, .col-md-6.col-lg-4:nth-child(4) .service-card::before, .col-md-6.col-lg-4:nth-child(4) .service-title::before{
        opacity: 1;
    }
    .col-md-6.col-lg-4:nth-child(3) .service-card::before, .col-md-6.col-lg-4:nth-child(3) .service-title::before,
    .col-md-6.col-lg-4:nth-child(5) .service-card::before, .col-md-6.col-lg-4:nth-child(5) .service-title::before{
        opacity: 0;
    }

    .metrics-card-group {grid-template-columns: 1fr 1fr;}
    .cta-ai-section .section-inner-head {max-width: 100%;}

    /* What We Do Section */
    .what-we-group{grid-template-columns: repeat(2, 1fr);}

    /* Industries Section  */
    .left-side{flex: 0 0 100%;max-width: 100%;height: auto;position: relative;top: inherit;}
    .right-side{flex: 0 0 100%;max-width: 100%;padding-bottom: 80px;padding-top: 40px;}
    .industries-head-sticky{
        padding-top: 0;
        position: inherit;
    }
}

@media(max-width: 768px){
    /* What We Do Section */
    .what-we-group{grid-template-columns: repeat(1, 1fr);}

    .metric-value,
    .stats-box h2{
        font-size: 35px;
        line-height: 50px;
    }

    .hero__title{
        font-size: 36px;
       
    }
.body-container {
	padding: 0 0;
}
    .list li{
        font-size: 16px;
        line-height: 27px;
    }

    .cta-ai-section {text-align: center;}
    .cat-subtitle {margin-inline: auto;}
    /* Featured Section */
    .featured-area{flex-wrap: wrap;}
    .featured-slider{flex: 0 0 100%;max-width: 100%;}


}

@media (max-width: 767.98px) {
    .stats {
        flex-wrap: wrap;
    }

    .stats .stats__item{
        border-left: none;
        border-right: none;
    }
    .service-card{
        padding: 25px 15px;
    }

    /* .service-card::before,
    .service-card::after,
    .service-title::before{
        display: none;
    } */
     .service-card::after {opacity: 1 !important; top: -0.75rem;}
    .service-card::before, .service-title::before, .col-md-6.col-lg-4:nth-child(1) .service-card::after{
        display: none;
    }
    .clients-section .clients-slider::before, .clients-section .clients-slider::after{width: 50px;}

}

@media screen and (max-width:576px) {
.clients-section .clients-slider::before, .clients-section .clients-slider::after {display: none;}
    .metrics-card-inner {padding: 30px;}
    .metrics-card-group {grid-template-columns: 1fr; text-align: center;}
    .metric-value::before {left: calc(50% - 30px);}
}

/* Related slider Project Section */
.project_group {display: grid; grid-template-columns: 1fr 1fr; gap: 30px; font-size: 16px; line-height: 28px;}
.project_left_panel {display: flex; flex-direction: column; gap: 30px;}
.project_top_panel, .project_right_panel {border: 1px solid #25395C1A;}
.project_top_panel {padding: 24px; border-radius: 16px;}
.project_top_panel p {margin-bottom: 24px;}
.project_badge {display: inline-block; padding: 4px 14px; border-radius: 30px; border: 1px solid #ECECEC; color: var(--color-black);}
.project_title {margin: 17px 0px;font-size: 24px;font-weight: 600;} 
.project_btn {display: inline-flex; align-items: end; gap: 10px;}
.project_btn span {display: inline-block; border-bottom: 1px solid var(--color-black);}
.project_btn, .project_btn * {transition: all ease-in-out 0.3s;}
.project_btn:hover span {border-color: var(--primary);}
.project_btn:hover svg path {fill: var(--primary);}
.project_btn:hover svg { transform: rotate(45deg);}
.project_bottom_panel {margin-top: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 30px;}
.project_bottom_panel > div, .project_right_panel > div {
	background-color: #F4F2EC;
	border-radius: 16px;
	display: flex;
	align-items: end;
	justify-content: center;
	padding: 28px;
}
.project_right_panel {padding: 10px; border-radius: 12px;}

.related-project-slider {overflow: hidden;}
.slider-wrapper {will-change: transform;}
.process-slider-arrow {display: flex; align-items: center; justify-content: center; gap: 30px;}
.process-slider-arrow .swiper-button-arrow {position: unset; margin: 0px; width: 58px; height: 58px; border: 1px solid var(--color-black); border-radius: 50%;}
.process-slider-arrow .swiper-button-arrow , .process-slider-arrow .swiper-button-arrow svg path {transition: all ease-in-out 0.3s;}
.process-slider-arrow .swiper-button-arrow:hover svg path {stroke: var(--color-white);}
.process-slider-arrow .swiper-button-arrow:hover {border-color: var(--primary); background-color: var(--primary);}
.process-slider-arrow .swiper-button-arrow::after {display: none;}
.process-slider-arrow .swiper-button-arrow svg {flex: 0 0 auto;}
.process-slider-nav {position: relative;width: 100%;display: flex; flex-direction: column; align-items: end; justify-content: space-between;}
.mab-40 {margin-bottom: 40px;}
 
.testimonial-section {
	background: #E9F3FF;
}
/* card */
.t-card{
  background:#fff;
  border-radius:16px;
  padding:32px 28px 28px;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
 
/* quote mark */
.quote-mark{
  font-size:4.5rem;
  font-weight:900;
  color:#1a6ef5;
  line-height:.6;
  margin-bottom:18px;
  font-family:Georgia,serif;
  letter-spacing:-2px;
}
 
/* review text */
.t-text {
	font-size: 18px;	
	margin-bottom: 28px;
}
 
/* author row */
.t-author{display:flex;align-items:center;gap:14px}
.t-avatar{
  width:48px;height:48px;border-radius:50%;
  object-fit:cover;flex-shrink:0;
  background:#ddd;
}
.t-name{font-size:16px;font-weight:500;}
.t-loc{font-size:.76rem;color:#888;font-weight:400}
 
/* swiper pagination */
.swiper-pagination{margin-top:28px;position:static!important;text-align:center}
.swiper-pagination-bullet{background:#b0bcd0;opacity:1;width:8px;height:8px;transition:all .3s}
.swiper-pagination-bullet-active{background:#1a6ef5;width:24px;border-radius:4px}
 
/* grab cursor */
.swiper{cursor:grab}
.swiper:active{cursor:grabbing}

/* ── Header row ── */
.section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin-bottom:28px;
}
.head-left{}
.head-label{
  font-size:.72rem;font-weight:600;
  letter-spacing:2.5px;text-transform:uppercase;
  color:#888;margin-bottom:8px;
}
.head-title{
  font-size:2.15rem;font-weight:700;
  color:#111;letter-spacing:-.5px;line-height:1.2;
}
.btn-view-all{
  display:inline-flex;align-items:center;gap:8px;
  border:1.5px solid #222;color:#111;
  border-radius:50px;padding:10px 22px;
  font-size:.85rem;font-weight:600;
  text-decoration:none;white-space:nowrap;
  transition:background .2s,color .2s;
  background:#fff;
}
.btn-view-all:hover{background:#111;color:#fff}
.btn-view-all .arr{font-size:.8rem}
 
/* ── Cards grid ── */
.cards-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
 
/* ── Single card ── */
.blog-card{
  background:#fff;
  border-radius:16px;
  overflow:hidden;
  border:1.5px solid #e8e8e8;
  transition:transform .28s ease, box-shadow .28s ease;
  cursor:pointer;
  text-decoration:none;
  display:block;
  color:inherit;
  padding: 14px;
}
.blog-card:hover{
  transform:translateY(-6px);
  box-shadow:0 16px 48px rgba(0,0,0,.12);
  color:inherit;
  text-decoration:none;
}
 
/* image */
.card-img-wrap{
  width:100%;
  aspect-ratio:16/10;
  overflow:hidden;
  position:relative;
  border-radius: 16px;
}
.card-img-wrap img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  transition:transform .38s ease;
  border-radius: 16px;
}
.blog-card:hover .card-img-wrap img{
  transform:scale(1.05);
}
 
/* body */
.card-body-custom{padding:20px 0px 24px;}
 
/* meta row */
.card-meta{
  display:flex;align-items:center;gap:10px;
  margin-bottom:14px;flex-wrap:wrap;
}
.tag-pill{
  background:#E7F1FE;
  color:#444;
  font-size:12px;font-weight:500;
  border-radius:50px;padding:4px 12px;
  letter-spacing:.2px;
}
.meta-dot{color:#ccc;font-size:.75rem}
.meta-read{font-size:18px;color:#212121;font-weight:400;}
.meta-date{font-size:18px;color:#AAACAD;}
 
/* title */
.card-title-text{
  font-size:24px;font-weight:400;
  color:#111;line-height:1.45;
  transition:color .2s;
}
.blog-card:hover .card-title-text{color:#1a6ef5;text-decoration: underline;}

.redblackbg {
	background: rgb(229,22,53);
	background: url(../images/redblackbg.png) no-repeat;
	width: 100%;
	background-size: contain;
	overflow: hidden;
	border-radius: 24px;
	height: 354px;
}

.cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
 .bg-bllue-light{background:#E9F3FF}
/* LEFT */
.big-heading{font-size:clamp(2.4rem,5vw,4.6rem);font-weight:600;/*! color:#111; */line-height:1.12;letter-spacing:-1.5px;margin-bottom:18px}
.big-heading .blue-q{color:#1a6ef5}
.sub-text{font-size:24px;/*! color:#555; */margin-bottom:36px;line-height:1.6;}
.cta-card{background:linear-gradient(90deg,rgba(12, 68, 140, 1) 0%, rgba(20, 118, 242, 1) 100%);border-radius:24px;padding:32px 28px 28px;position:relative;overflow:hidden}
.cta-card::before{content:'';position:absolute;width:100px;height:100px;border-radius:50%;border:22px solid rgba(255,255,255,.13);bottom:16px;right:28px;pointer-events:none}
.cta-card::after{content:'';position:absolute;width:31px;height:31px;border-radius:50%;background:rgba(255,255,255,.1);bottom:118px;right:26px;pointer-events:none}
.cta-card-title{font-size:36px;font-weight:500;color:#fff;margin-bottom:10px}
.cta-card-text{font-size:30px;color:#fff;line-height:1.6;margin-bottom:24px;/*! max-width:280px */font-weight: 300;}
.btn-talk{display:inline-flex;align-items:center;gap:8px;background:#fff;color:#111;border-radius:50px;padding:10px 22px;font-size:.84rem;font-weight:700;text-decoration:none;transition:background .2s,transform .2s}
.btn-talk:hover{background:#f0f0f0;transform:translateY(-1px);color:#111}
 
/* FORM CARD */
.form-card{background:#fff;border-radius:24px;padding:36px 36px 32px;border:2px solid #DADDE1;/*! box-shadow:0 8px 40px rgba(0,0,0,.07) */}
.form-title{font-size:48px;font-weight:400;/*! color:#111; *//*! letter-spacing:-.4px; */margin-bottom:14px;}
.field-group{margin-bottom:22px}
.underline-input{width:100%;border:none;border-bottom:1px solid #DADDE1;background:transparent;outline:none;/*!  */font-size:18px;color:#475467;padding:6px 0 10px;transition:border-color .2s}
.underline-input:focus{border-bottom-color:#1a6ef5}
.underline-input::placeholder{color:#bbb}
.underline-textarea {
	width: 100%;
	border: none;
	border-bottom: 1.5px solid #ddd;
	background: transparent;
	outline: none;
	
	color: #111;
	padding: 6px 0 10px;
	resize: none;
	transition: border-color .2s;
}
.underline-textarea:focus{border-bottom-color:#1a6ef5}
.underline-textarea::placeholder{color:#bbb}
.underline-select{width:100%;border:none;border-bottom:1px solid #DADDE1;background:transparent;outline:none;/*!  */font-size:18px;color:#DADDE1;padding:6px 0 10px;appearance:none;-webkit-appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23999' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 4px center;transition:border-color .2s}
.underline-select:focus{border-bottom-color:#1a6ef5;color:#111}
.underline-select option{color:#111}
 
/* PHONE ROW */
.phone-row{display:flex;align-items:center;gap:0;border-bottom:1.5px solid #ddd;padding-bottom:10px;transition:border-color .2s;position:relative}
.phone-row:focus-within{border-bottom-color:#1a6ef5}
.country-trigger{display:flex;align-items:center;gap:5px;padding-right:10px;flex-shrink:0;cursor:pointer;user-select:none}
.flag-emoji{font-size:1.15rem;line-height:1}
.ccode{font-size:.88rem;color:#333;font-weight:500}
.chevron{font-size:.5rem;color:#888;margin-left:1px;transition:transform .2s;display:inline-block}
.chevron.open{transform:rotate(180deg)}
.phone-divider{width:1px;height:18px;background:#ddd;margin-right:12px;flex-shrink:0}
.phone-input{flex:1;border:none;outline:none;background:transparent;padding:0}
.phone-input::placeholder{color:#bbb}
 
/* COUNTRY DROPDOWN */
.country-dropdown{display:none;position:absolute;top:calc(100% + 10px);left:0;width:300px;background:#fff;border:1.5px solid #e0e4ee;border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,.14);z-index:9999;overflow:hidden}
.country-dropdown.open{display:block}
.cd-search{padding:10px 12px;border-bottom:1px solid #eee}
.cd-search input{width:100%;border:1.5px solid #e0e4ee;border-radius:8px;padding:7px 12px;font-size:.82rem;outline:none;color:#111}
.cd-search input:focus{border-color:#1a6ef5}
.cd-list{max-height:220px;overflow-y:auto}
.cd-list::-webkit-scrollbar{width:4px}
.cd-list::-webkit-scrollbar-thumb{background:#ddd;border-radius:4px}
.cd-item{display:flex;align-items:center;gap:10px;padding:9px 14px;cursor:pointer;font-size:.84rem;color:#222;transition:background .15s}
.cd-item:hover{background:#f5f7ff}
.cd-item.selected{background:#eef2ff;font-weight:600}
.cd-item .ci-flag-img{width:24px;height:16px;border-radius:3px;object-fit:cover;flex-shrink:0}
.cd-item .ci-name{flex:1}
.cd-item .ci-dial{color:#888;font-size:.78rem}
 
/* SUBMIT */
.btn3{background:#F77B31; color:#fff;transition:background .2s}
.whitearrow.btn3{fill:#fff}

@media(max-width:880px){.cta-grid{ display: block; grid-template-columns:1fr;gap:36px}.form-card{padding:28px 22px}}
 /* ============= Footer ============= */
footer {
  background: var(--themecolor2);
}
.copyRright {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  text-align: center;
}
form .form-control {
  border-radius: 0;
  box-shadow: none;
  border: none;
  border-bottom: 0px solid #EBEFF6;
  padding: 6px 0 6px 37px;
  color: var(--themecolor8);
  font-size: 16px;text-transform: uppercase;
  font-weight: 400; height: calc(2.2em + 0.75rem + 9px);
  font-family: var(--font-face1);
}
.form-control::placeholder {
  color: var(--themecolor8);
 opacity: 1;
}
.form-box .line {
border-bottom: 1px solid #EBEFF6;
position: relative;
}
.bor_bottom {
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.form-box .line::before {
content: "";
position: absolute;
left: 0;
bottom: 0px;
width: 0;
height: 1px;
background-color: var(--themecolor2);;
-webkit-transition: 1.3s;
-moz-transition: 1.3s;
-ms-transition: 1.3s;
-o-transition: 1.3s;
transition: 1.3s;
z-index: 1;
}
textarea:focus-visible{outline: none;}

.form-box .line:hover::before {
width: 100%;
}


form .submitBtn {
  background: none;
  border: 1px solid var(--themecolor3);
  border-radius: 0;
  padding: 7px 20px;
  color: var(--themecolor3);
  text-transform: uppercase;
  font-family: var(--font-face1);
  font-size: 14px;
  font-weight: 600;
  transition: all 0.3s ease-in;
}
form .submitBtn:hover {
  color: var(--themecolor3);
  background: var(--themecolor1);
  border: 1px solid var(--themecolor1);
}
.socialLink {
  margin: 35px 0;
}
.paddingtop-200{padding-top: 200px;}
.socialLink a {
border: 2px solid #27292E;
width: 44px;
height: 44px;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 24px;
color: var(--themecolor3);
transition: all 0.3s ease-in;
margin-left: 5px;
}
.socialLink a:hover {
	background: var(--bs-blue);
	border: 2px solid var(--bs-blue);
}

.contactpage .socialLink a {
background: var(--primary);
}
.contactpage .socialLink a:hover {
background: var(--primary);

}



.f_link li {
  line-height: 36px; position:relative;
}
.f_link li a {
color:#fff;

font-size: 16px;
font-weight: 400;
transition: all 0.3s ease-in;
position: relative;
}

footer h4 {
	font-weight: 400;
	text-transform: uppercase;
	color: #80848A;
}
.quick-links li {padding-right: 3%;
display: inline-block;    line-height: 1 !important;
  color: var(--themecolor8);
}
.f_link li a::before {
content: '';
position: absolute;
width: 0;
height: 1px;
background-color: var(--primary);
bottom: -2px;
transition: 0.6s;
left: 0;

}
.f_link li a:hover {
text-decoration: underline;
}

.f_link li a:hover::before {
width: 0%;
left: 0;
}
.form-control:focus {
  border-color: #192020;
}
.quick-links li a{
  color: #9B9A9F;transition: all 0.3s ease-in;
}
.quick-links li{
  position: relative;
}
.quick-links li::after {
content: "";
width: 1px;
background-color: var(--themecolor3);
opacity: 0.3;
position: absolute;
left: -13px;
height: 26px;
top: calc(64% - 15px);
}
.quick-links li:first-child::after{display: none;}

.text272A2E{background: #272A2E;}
.line-h{line-height: 1;}
.iconshow{padding-right: 14px; padding-top: 5px; padding-bottom: 5px;
  border-right: 1px solid #ccc;}

.white-icon{    
    background-color:#fff;
    border-color: #fff;
    height: 40px;
    width: 40px;
    border-radius: 50%;
    border: solid 1px #fff;
    background-position: top 11px left -27px!important;
    background-repeat: no-repeat!important;
    transition: var(--ease-in-out);
    z-index: 1;
   
    display: flex;
}
.btn1:hover .white-icon{
    background-color: var(--primary);
    border-color: var(--primary);
   
}

.btn1:hover svg{
    fill: #ffffff;
   
}

.blue-icon{
    background-color:#1a6ef5;
    border-color: #1a6ef5;
    height: 40px;
    width: 40px;
    border-radius: 50%;
    border: solid 1px #1a6ef5;
    background-position: top 11px left -27px!important;
    background-repeat: no-repeat!important;
    transition: var(--ease-in-out);
    z-index: 1;
   
    display: flex;
}
.cta-btn:hover .blue-icon{
    background-color: #fff;
    border-color: #fff;
}
.cta-btn:hover .blue-icon svg{
    fill: var(--primary);
}

.blackarrow svg{
    fill: #000;
    transition: var(--ease-in-out);
}

/* responsive */
@media(max-width:900px){.cards-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:580px){
  .cards-grid{grid-template-columns:1fr}
  .section-head{flex-direction:column;align-items:flex-start;gap:16px}
  .head-title{font-size:1.65rem}
}


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

    .design-primary .slider-item .img-block {width: 550px;}

   
    .design-secondary .project_group {font-size: 18px;}

    .project_group {font-size: 18px;}
}

@media screen and (max-width : 1199px) {
    
   
    .design-secondary .project_group {font-size: 16px;}
    .design-secondary .project_top_panel p {margin-bottom: 15px;}

    .project_group {font-size: 16px;}
    .project_top_panel p {margin-bottom: 15px;}
}

@media screen and (max-width : 991px) {
    /* Primary Design Related Project Section */
    .design-primary .slider-item{display: flex;flex-direction: column-reverse;}
    .design-primary .slider-item .img-block {width: 100%;}
    .design-primary .project-list .project-item{min-width: auto;}
}

@media screen and (max-width : 768px) {    
    /* Secondary Design Related Project Section */
    .design-secondary .project_group {grid-template-columns: 1fr;}

    .project_group {grid-template-columns: 1fr;}
    .form-title {
	font-size: 30px;
}
.right-side2 {
	overflow: hidden;
}
}
@media screen and (max-width : 576px) {    
    
    
    .design-primary .slider-item{grid-template-columns: 1fr;}
    .design-primary .slider-item .img-block {width: 100%;}

    /* Secondary Design Related Project Section */
    .design-secondary .project_group, .design-secondary .project_left_panel, .design-secondary .project_bottom_panel {gap: 24px;}
    
   
    .project_group, .project_left_panel, .project_bottom_panel {gap: 24px;}
}

.hero-slider,
.hero-slider .carousel-item {
    height: 84vh;
    position: relative;
}

.hero__video {
    width: 100%;
    height: 100vh;
    object-fit: cover;
}



.carousel-caption {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    left: 55px;
}


.hero__description {
	margin-bottom: 48px;
}
.carousel-indicators {

	z-index: 99;

}



@media(max-width:768px){
    .hero__title{
        font-size:40px;
    }
}

.btn-insight {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 7px 11px 7px 20px;
  border-radius: 50px;
  border: 1px solid var(--primary);
  background: transparent;
  color: #fff;
  font-size: var(--font-20);
  line-height: 24px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: color 0.35s ease;
}
.btn-insight:hover {
  border: 1px solid #fff;
  color: #fff;
  
}
.btn-insight::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--primary);
  border-radius: 50px;
  transform: scaleX(1);
  transform-origin: left center;
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
}
.btn-insight:hover::before {
  transform: scaleX(0);
  transform-origin: right center;
}
.btn-insight:hover {
  color: #fff !important;
}
.btn-insight {
  color: #fff;
}
.btn-insight span.label {
  position: relative;
  z-index: 1;
}
.btn-insight .arrow-wrap {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px; transform: rotate(-45deg);
  border-radius: 50%;
  background:#fff;
  transition: background 0.35s ease, transform 0.35s ease;
  flex-shrink: 0;
}
.btn-insight:hover .arrow-wrap {
  background: rgba(255,255,255,1);
  transform: rotate(-0deg);
}
.btn-insight .arrow-wrap svg {
  fill: #000;
}





.btn-insight-white {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 7px 11px 7px 20px;
  border-radius: 50px;
  border: 1px solid #fff;
  background: transparent;
  color: #000;
  font-size: var(--font-20);
  line-height: 24px;
  text-decoration: none;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: color 0.35s ease;
}
.btn-insight-white:hover {
  border: 1px solid #fff;
  color: #000;
  
}
.btn-insight-white::before {
  content: '';
  position: absolute;
  inset: 0;
  background: #fff;
  border-radius: 50px;
  transform: scaleX(1);
  transform-origin: left center;
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
}
.btn-insight-white:hover::before {
  transform: scaleX(0);
  transform-origin: right center;
}
.btn-insight-white:hover {
  color: #fff !important;
}
.btn-insight-white {
  color: #000;
}
.btn-insight-white span.label {
  position: relative;
  z-index: 1;
}
.btn-insight-white .arrow-wrap {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px; transform: rotate(-45deg);
  border-radius: 50%;
  background: var(--primary);
  transition: background 0.35s ease, transform 0.35s ease;
  flex-shrink: 0;
}
.btn-insight-white:hover .arrow-wrap {
  background: rgba(255,255,255,1);
  transform: rotate(-0deg);
}
.btn-insight-white .arrow-wrap svg {
  fill: #fff;
}

.btn-insight-white:hover .arrow-wrap svg {
  fill: #000;
}




.btn-insight-sub {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 7px 11px 7px 20px;
  border-radius: 50px;
  border: 1px solid #F77B31;
  background: transparent;
  color: #fff;
  font-size: var(--font-20);
  line-height: 24px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: color 0.35s ease;
}
.btn-insight-sub:hover {
  border: 1px solid #F77B31;
  color: #fff;
  
}
.btn-insight-sub::before {
  content: '';
  position: absolute;
  inset: 0;
  background: #F77B31;
  border-radius: 50px;
  transform: scaleX(1);
  transform-origin: left center;
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
}
.btn-insight-sub:hover::before {
  transform: scaleX(0);
  transform-origin: right center;
}
.btn-insight-sub:hover {
  color: #000 !important;
}
.btn-insight-sub {
  color: #fff;
}
.btn-insight-sub span.label {
  position: relative;
  z-index: 1;
}
.btn-insight-sub .arrow-wrap {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px; transform: rotate(-45deg);
  border-radius: 50%;
  background:#fff;
  transition: background 0.35s ease, transform 0.35s ease;
  flex-shrink: 0;
}
.btn-insight-sub:hover .arrow-wrap {
  background: #F77B31;
  transform: rotate(-0deg);
}
.btn-insight-sub .arrow-wrap svg {
  fill: #000;
}
.btn-insight-sub:hover .arrow-wrap svg {
  fill: #fff;
}