@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Cal+Sans&family=Fira+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Inter+Tight:ital,wght@0,100..900;1,100..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('http://db.onlinewebfonts.com/c/1f8f37590762311c2122e0f9f7213954?family=Julietta+Messie'); 
@import url('https://fonts.googleapis.com/css2?family=Caveat+Brush&display=swap');

:root {
    /* Font */
    --priFont: "Fira Sans", sans-serif;
    --secFont: "Barlow", sans-serif;
    --thirdFont: "Julietta Messie";
    --fourthFont: "Caveat Brush", cursive;

    /* Color */
      --priColor: #6436C2;
      --secColor: #9F0BE9;
      --thirdColor: #2AACAD;
      --fourthColor: #46D75C;
    --fifthColor: #220210;
    --lightColor: #FFFEFEEB;
    --whiteColor: #fff;
    --textColor: #4A4A4A;
    --darkColor: #000;
    --borderColor: #BDBDBD94;
    --btnColor: linear-gradient(to right,#5c3f92,#38ddf9;);
    --btnArrowColor: linear-gradient(27deg,rgba(100, 54, 194, 1) 0%, rgba(159, 11, 233, 1) 29%, rgba(42, 172, 173, 1) 87%, rgba(70, 215, 92, 1) 100%);
    --textGradientColor: linear-gradient( 120deg, rgba(100, 54, 194, 1) 0%, rgba(159, 11, 233, 1) 29%, rgba(42, 172, 173, 1) 69%, rgba(70, 215, 92, 1) 100% );
    --gradientColor:linear-gradient( 120deg, rgba(100, 54, 194, 1) 0%, rgba(159, 11, 233, 1) 29%, rgba(42, 172, 173, 1) 69%, rgba(70, 215, 92, 1) 100% );;

    /* Others */
    --radious: 0.625rem;
    --radious-2: 1rem;
    --lHeight: calc(64 / 56);

}
/* CSS RESET */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
.subtitle { font-size: clamp(1.1rem, 1.0684rem + 0.1404vw, 1.2rem); color: var(--textColor);font-family: var(--priFont);margin: 0 0 .3rem;}
.subtitle span { font-size: clamp(2.3rem, 2.1421rem + 0.7018vw, 2.8rem);color: var(--priColor);}
strong { font-weight: 600; }

body{width: 100%; max-width: 1920px;  margin: 0 auto; padding: 0; position: relative; overflow-x: hidden; font-family: var(--priFont); color: var(--whiteColor);background: #F5F5F5;}
.wrapper {width: 100%; max-width: 1280px; margin: 0 auto; padding: 0; }
ol, ul { list-style: none; }
li { color: var(--darkColor); font-size: 1.1rem; font-weight: 600;line-height: 2;}
.bullet { margin: 0 0 1.2rem; }
a {text-decoration: none; cursor: pointer; font-family: var(--secFont);}
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
span { display: block; font-family: var(--thirdFont) ;font-size: clamp(1.4rem, 1.3053rem + 0.4211vw, 1.7rem);}
img, picture, video, canvas, svg { display: block; max-width: 100%; }
input, button, textarea, select { font: inherit; }
.button { background: var(--thirdColor); padding: 1.2rem 1.5rem 1.2rem 4.5rem; border-radius: 3rem; color: var(--whiteColor); text-transform: uppercase; display: flex; width: fit-content; margin: 2rem auto 0; position: relative; height: fit-content; font-size: clamp(0.9rem, 0.8684rem + 0.1404vw, 1rem);} .button::after { content: '➜ '; font-size: 1.4rem; left: 1rem; position: absolute; top: 50%; transform: translateY(-50%); background: var(--btnArrowColor);color: var(--priColor);padding: .3rem .5rem;border-radius: 50%;color: var(--whiteColor);}
.button-2::after {content: '➜ '; font-size: 1.4rem; right: 1rem; position: absolute; top: 50%; transform: translateY(-50%); color: var(--priColor);border-radius: var(--radious);}
.button-2 { padding: 0 4rem 0 0; border-radius: var(--radious); color: #000; text-transform: uppercase; display: flex; width: fit-content; margin: 2rem 0 0; position: relative; background: unset; font-size: .93rem;}
.sub_heading_bullet {position: relative;color: var(--priColor);padding: 0 0 0 2.5rem;margin: 0 0 1rem;width: fit-content;   color: transparent; background: linear-gradient( 120deg, rgba(100, 54, 194, 1) 0%, rgba(159, 11, 233, 1) 29%, rgba(42, 172, 173, 1) 69%, rgba(70, 215, 92, 1) 100% ); -webkit-background-clip: text; background-clip: text; line-height: 1.6; font-size: clamp(1.6rem, 1.4737rem + 0.5614vw, 2rem);;font-weight: 800;}
.sub_heading_bullet::after{ content: '★'; position: absolute; top: 60%; left: 0; transform: translateY(-50%); color: var(--priColor); font-size: 2rem; }


h1, h2, h3, h4, h5, h6 {font-family: var(--priFont); text-wrap: balance; color: var(--whiteColor);  line-height: var(--lHeight); color: var(--darkColor);font-weight: 800;}

h1 {font-size: clamp(3.5rem, 3.1842rem + 1.4035vw, 4.5rem);}
h2 {font-size: clamp(2.3rem, 1.9211rem + 1.6842vw, 3.5rem); margin: 0 0 2rem;}
h3 { font-size: clamp(1.5rem, 1.4211rem + 0.3509vw, 1.75rem); margin: 0 0 2rem;}
h4 {font-size: clamp(1.3rem, 1.2368rem + 0.2807vw, 1.5rem);}
h5 {font-size: 1.3rem;}
p {font-size: clamp(1.1rem, 1.0526rem + 0.2105vw, 1.25rem); line-height: 1.625; font-family: var(--secFont); color: var(--textColor);}

/* Header */
header {position: absolute;width: 1700px;max-width: 100%;left: 50%;transform: translateX(-50%);z-index: 990;top: 0;}
.head-wrapper { width: 100%; max-width: 1300px; margin: 0 auto; }
.header-con {display: flex;flex-wrap: wrap;align-items: center; background: var(--thirdColor);padding: 0 1.2rem 0 0;border-radius: 2.5rem; position: relative;gap: 9rem;/*! overflow: hidden; */}
.header-con::after { content: ''; position: absolute; top: 23%; left: 50%;  width: 94%; height: 100%; background: var(--btnArrowColor); border-radius: 2.5rem; z-index: -1;transform: translateX(-50%);}
.header-con .logo{width: 20rem;border-top-left-radius: 2.0rem;overflow: hidden;border-bottom-left-radius: 2.0rem;}
.header-con .logo figure{}
.header-con .logo figure img{}
.header-con .right-action{width: 15%;display: flex;justify-content: flex-end;align-items: center;}
.header_top_info { display: flex; justify-content: space-between; padding: .5rem 0; }
.header_top_info p { font-size: 1.3rem; color: var(--darkColor);font-weight: 600;}
.h_right_action {position: relative;}
.h_right_action::after {content: url('images/email_black.png'); position: absolute; top: 43%; left: -25%; width: 9%; height: 1em; transform: translateY(-50%);}
.h_right_action::before { content: ''; position: absolute; top: 50%; left: -30%; width: 2.5rem; height: 2.5rem; transform: translateY(-50%); background: var(--whiteColor); border-radius: 50%;}
.h_right_action h5 { margin: 0; font-weight: 500;color: var(--whiteColor);}
.h_right_action p { color: var(--textColor); line-height: 1;}
.h_right_action a { font-size: clamp(1.1rem, 1.0526rem + 0.2105vw, 1.25rem); color: var(--textColor); font-family: var(--secFont);}
.get-started-btn .button { margin: 0; }
/* Navigation Menu */

/* Navigation  */
nav {line-height: 5rem;}
#navigation-menu {width: fit-content;}
.nav-con { display: flex; justify-content: space-between; align-items: center;width: 100%;margin: 0 0 0 auto; flex-direction:column;}
#hamburger{ width: 50px; height: 46px; position: relative; margin: 0 auto; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; caret-color: transparent; position: relative; top: 1em;  z-index: 1001;display: none;}
#hamburger span { display: block; position: absolute; height: 4px; width: 67%; background: var(--whiteColor); border-radius: 9px; opacity: 1; right: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; }
#hamburger span:nth-child(1) { top: 0px; }
#hamburger span:nth-child(2),#hamburger span:nth-child(3) { top: 11px; width: 40%; right: 0; text-align: right; margin: 0 0 0 auto;}
#hamburger span:nth-child(4) { top: 23px; }
#hamburger.open span:nth-child(1) { top: 18px; width: 0%; left: 50%; }
#hamburger.open span:nth-child(2) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); width: 67%; }
#hamburger.open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); width: 67%; }
#hamburger.open span:nth-child(4) { top: 18px; width: 0%; left: 50%; }
#nav-menu { display: flex; justify-content: center; gap: 2.5rem; margin: 0 auto;backdrop-filter: blur(60px);border-radius: var(--radious);padding: 0 2.5rem;}
#nav-menu li{ position: relative;}
#nav-menu li a{ font-weight: 600; font-family: var(--secFont);font-size: 1.2rem;color: var(--whiteColor);}
#nav-menu .active a { color: var(--priColor); }
/* ----------- Desktop dropdown ----------- */
#nav-menu { position: relative; }
.sub-menu li { line-height: 3; padding: 0 1rem; }
#nav-menu li { position: relative; }
#nav-menu .sub-menu { display: none; position: absolute; top: 100%; left: 0; min-width: 250px; background: var(--whiteColor, #fff); padding: 0.5rem 0; z-index: 999; box-shadow: 0 4px 6px rgba(0,0,0,0.1); list-style: none; }
.search-container { position: relative; display: flex; align-items: center; background: white; border-radius: 50px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2); overflow: hidden; transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55); }
.search-container.collapsed {  height: 60px; width: 6%; background: transparent; box-shadow: none;position: absolute; right: 0; }
.search-container.expanded { width: 80%; height: 45px; position: absolute; right: 0; }
.search-btn { /*! width: 60px; */ /*! height: 60px; */ border: none; /*! background: transparent; */ border-radius: 50px; cursor: pointer; display: flex; align-items: center; justify-content: center; position: relative; z-index: 2; transition: all 0.3s ease; flex-shrink: 0; background: transparent;}
.search-btn:hover { transform: scale(1.1); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3); }
.search-btn:active { transform: scale(0.95); }
.search-icon { width: 35px; height: 35px; fill: var(--whiteColor);; transition: transform 0.3s ease; }
.expanded .search-icon { fill: var(--priColor); }
.search-container.expanded .search-icon { transform: rotate(90deg); }
.search-input { width: 100%; height: 46px; border: none; outline: none; font-size: 16px; padding: 0 20px; background: transparent; color: #333; opacity: 0; transform: translateX(-20px); transition: all 0.3s ease 0.1s; }
.search-container.expanded .search-input { opacity: 1; transform: translateX(0); }
.search-input::placeholder { color: #999; }
.search-form { display: flex; align-items: center; width: 100%; height: 100%; padding: 0;height: auto;}
.close-btn { position: absolute; right: 48px; top: 50%; transform: translateY(-50%); background: none; border: none; font-size: 24px; color: #999; cursor: pointer; opacity: 0; transition: all 0.3s ease; z-index: 3; }
.search-container.expanded .close-btn { opacity: 1; }
.close-btn:hover { color: #333; transform: translateY(-50%) scale(1.2); }
/* End of Menu */

/* Banner */
#banner {background: url('images/banner_bg.jpg');height: 60rem; position: relative;background-repeat: no-repeat;overflow: hidden;background-size: cover;background-attachment: fixed;}
#banner { /* Controls for the ::before transform via CSS variables */ --banner-before-tx: 0px; --banner-before-ty: 0px; --banner-before-rot: 0deg; }
#banner::before { content: url('images/shape-1.png'); position: absolute; top: 0; left: 0; width: 100%; height: 100%;   z-index: 1;     }
#banner::after {content: ''; position: absolute; bottom: -2%; right: 0; width: 100%; height: 100%; background: url('images/shape-2.png'); background-size: auto; background-size: contain; background-repeat: no-repeat;}
.banner-con{ position: relative;z-index: 100;padding: 14rem 0 0 0;display: flex;justify-content: space-between;align-items: center;}
.banner-info {width: 50%;}
.sub_heading {color: var(--textColor);font-family: var(--priFont);font-size: 1.2rem;}
.banner-info span { padding: 0 0 0 3rem; }
.banner-info h1{text-align: left;text-transform: capitalize;margin: 1rem 0 1.5rem;color: var(--darkColor);font-weight: 800;}
.banner-info p{font-size: clamp(1.1rem, 1.0526rem + 0.2105vw, 1.25rem);;color: var(--textColor);text-align: left;}
.banner-info a{margin: 2rem 0;padding: 1.2rem 1.5rem 1.2rem 4.5rem;}
.banner_sidebar_img {width: 47%;}
.banner_sidebar_img img { margin: 0 0 0 auto; }
/* End of Baner */

/* Middle */
#middle {position: relative;margin: 0 0 5rem;}
#middle::after { content: ''; position: absolute; width: 100%;height: 134%;top: -27%;left: 0;z-index: 0;background: url('images/section2.png');background-size: cover;background-position-x: 51%;}

.middle_services_section { display: flex; flex-wrap: wrap; justify-content: space-between;position: relative;}
.middle_services_section section {width: 32%;}
.middle_services_section .slick-slide { padding: 0 15px; margin: 0; }
.middle_services_section .slick-list { margin: 0 -15px; }
.middle_services_section img { border-top-left-radius: 12rem; border-bottom-left-radius: 3rem; border-top-right-radius: 3rem; border-bottom-right-radius: 3rem; height: 20rem;width: 100%;object-fit: cover;}
.middle_top_info { width: 50%; margin: 0 auto 5rem; text-align: center; }
.middle_top_info span { margin: 0 auto; }
.middle_services_section h3 { margin: 2rem 0 0; color: var(--whiteColor);text-align: left;}
.middle_services_section a { margin: 1rem 0 0; color: var(--whiteColor);}
.middle_services_section::after { content: ''; position: absolute;top: -34%;left: 50%;width: 110%;height: 80%;margin: 0 auto;background: var(--textGradientColor);transform: translateX(-50%);z-index: -1;border-radius: 20rem;}

.middle_con { position: relative; z-index: 1; padding: 2rem 0 0;}
.middle_con .slick-prev { right: 6%!important; left: -2% !important; z-index: 1; }
.middle_top_info h2 { color: var(--whiteColor); }
.middle_top_info p { color: var(--whiteColor); }
.middle_services_section p { color: #ACAAAA; margin: 1rem 0 0; }
.middle_services_section .slick-slide {position: relative;}
.middle_services_section figure { position: relative; }
.floating_icon {position: absolute !important; top: 0; left: 0; transition: all 0.5s ease; background: var(--whiteColor); box-sizing: border-box; padding: 16px; border-radius: 50%; width: fit-content;z-index: 2;}
.middle_services_section section:hover .floating_icon { top: 50%; left: 50%; transform: translate(-50%, -50%); background: linear-gradient(27deg,rgba(100, 54, 194, 1) 0%, rgba(159, 11, 233, 1) 29%, rgba(42, 172, 173, 1) 87%, rgba(70, 215, 92, 1) 100%); }
.middle_services_section section:hover .floating_icon img {mix-blend-mode: normal;}
.floating_icon img { mix-blend-mode: difference; }
.floating_icon img { width: fit-content; object-fit: none; height: fit-content; }
.heading_img { position: relative; }

/* Main */
main {overflow-x:hidden;}
.main_sidebar_image {width: 48%;}
.main_info {width: 48%;}
.main_top_con { display: flex; align-items: center; justify-content: space-between; margin: 5rem 0 0;}
.bottom_info { display: flex; align-items: center; margin: 3rem 0 0;border-bottom: 1px solid #BDBDBD94;padding: 0 0 2rem;}
.counting_skills { margin: 1.5rem 0 0; }
.count { width: 30%; position: relative;}
.counting_skills { width: 70%; }
.count h2 { margin: 0; display: flex;}
.count h2 span { color: var(--priColor); }
.count p { color: var(--priColor); font-weight: 600; }
.skill {  }
.content_info p { margin: 0 0 1rem; }
.skill_head { display: flex; justify-content: space-between;  margin: 0 0 2rem; align-items: flex-start;}
.skill_label { font-weight: 600; color: var(--darkColor); }
.skill_value { font-weight: 600; color: var(--darkColor); }
.skill_bar { width: 100%; height: 12px; background: #e9e9e9; border-radius: 999px; overflow: hidden; }
.skill_bar_fill { width: 0; height: 100%; background: var(--btnArrowColor); border-radius: 999px; transition: width .8s ease; }
main { margin: 5rem 0 0; }
.count::after { content:'' ; position: absolute;top: 0;right: 15%;border: 1px solid var(--borderColor);height: 138%;width: 1px;}
.main_lists { display: flex;  margin: 2.5rem 0 0;flex-wrap: wrap;gap: 1rem;}
.main_lists li { color: var(--darkColor); font-size: 1.1rem; font-weight: 600; position: relative;padding: 0 0 0 2rem;width: 48%;}
.main_lists li::after { content: url('images/check.png'); position: absolute; top: 10%; left: 0%; width: 10px; height: 10px;  border-radius: 50%; }
.main_lists li::before { /*! content: ''; */ position: absolute; top: 50%; right: -14%; width: 7px; height: 7px;  border-radius: 50%; background-color: var(--priColor); transform: translateY(-50%);}

.main_bottom_con { margin: 10rem 0 5rem; display: flex; justify-content: space-between; align-items: center; position: relative;display: none;}
.main_bottom_con::after { content: ''; position: absolute; bottom: 0; left: 50%; width: 2292px; height: 100%;  z-index: -1; /*! border-radius: 20rem; */ transform: translateX(-54%);/*! transform: scaleX(-1); */background: url('images/main_bottom_bg.jpeg');background-size: cover;/*! background-position-y: -42%; *//*! background-repeat: no-repeat; */}
.mb_sidebar_content { width: 48%; }
.mb_sidebar_image { width: 60%; }
.mb_sidebar_content .button { margin: 2rem 0 0; }
.mb_lists li { position: relative; padding: 0 0 0 2rem;}
.mb_lists li::after { content: url('images/check-2.png'); position: absolute;  left: 0; width: 7px; height: 7px;  border-radius: 50%;  }
.mb_lists { margin: 2rem 0 0; }
.mb_sidebar_image figure { position: relative; }
.mb_sidebar_image figure::after { content: 'Help you to grow your business'; position: absolute; top: 20%; right: 0;  height: fit-content; color: var(--darkColor);font-family: var(--fourthFont);font-size: 2.2rem;width: 34%;text-align: left;}
.mb_sidebar_image { position: relative; }
.mb_sidebar_image::after {content: url('images/graph.png'); position: absolute; bottom: 6%; left: -17%; width: fit-content; height: fit-content;}
.mb_sidebar_image::before {content: url('images/graph-2.png'); position: absolute; bottom: 10%; right: 0; width: fit-content; height: fit-content;z-index: 1;}
.logo_lists { display: flex; justify-content: space-between; }

/* Bottom  */
/* Portfolio */
#portfolio { display: none; }
.logo_lists li img { width: 80%; height: 50%; }
.p_heading_info { margin: 5rem 0; text-align: center; }
.p_heading_info span { margin: 0 auto 1rem; }
.p_heading_info h2 { width: 50%; margin: 0 auto; }

.portfolio_section {    display: grid; grid-template-columns: repeat(8, 1fr); grid-template-rows: repeat(8, 5vw); grid-gap: 3rem; }; 
.portfolio_section section { position: relative; }
.portfolio_section figure { width: 100%; height: 100%; }
.portfolio_section section img {  width: 100%;  height: 100%;  object-fit: cover; }
.portfolio_section section:nth-child(1) {     grid-column-start: 1; grid-column-end: 5; grid-row-start: 1; grid-row-end: 6;}
.portfolio_section section:nth-child(2) {  grid-column-start: 5; grid-column-end: 9; grid-row-start: 1; grid-row-end: 4; }
.portfolio_section section:nth-child(3) {     grid-column-start: 1; grid-column-end: 5; grid-row-start: 6; grid-row-end: 9; }
.portfolio_section section:nth-child(4) {   grid-column-start: 5; grid-column-end: 9; grid-row-start: 4; grid-row-end: 9; }

.portfolio_section section { position: relative; }
.p_floating_info { position: absolute; bottom: -7%; background: var(--whiteColor); padding: 1rem 2rem;box-sizing: border-box;left: 8%;border-radius: 20rem;box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);}

/* Client Feedback */
#client_feedback { margin: 5rem 0 0; }
.cf_con { display: flex; flex-wrap: wrap; align-items: center;}
.cf_sidebar_info { width: 50%; }
.cf_sidebar_image  {width: 46%; margin: 0 0 0 auto;}
.cf_sidebar_image img { margin: 0 0 0 auto; }
.testimonial_con h2, .testimonial_con p { text-align: left;}
.cf_bottom_info { display: flex; margin: 4rem 0 0; gap: 1rem; position: relative; }
.cf_bottom_info::after { content: ''; position: absolute; top: -42%; left: 0; width: 100%; height: 1px; background-color: var(--borderColor);}
.name_info { display: flex; flex-direction: column; position: relative;}
.name_info span { color: var(--textColor); font-family: var(--priFont); }
.name_info h3 { text-align: left; margin: 0; }
.cf_sidebar_image { position: relative; z-index: -1; }
.cf_sidebar_image::after { content: url('images/quote.png'); position: absolute; top: 11%; left: 0; width: 100%; height: 71%;background: var(--btnArrowColor);z-index: -1;border-radius: 50%;}

/* Slick arrows override for testimonial slider */
.testimonial_con .slick-prev,
.testimonial_con .slick-next { z-index: 5; width: 36px; height: 36px; border-radius: 50%; background: var(--btnArrowColor); pointer-events: auto; }
.testimonial_con .slick-prev { right: 7%; bottom: 0 !important; top: auto;}
.cf_bottom_info figure { width: 11%; border-radius: 50px; overflow: hidden; }
.testimonial_con .slick-next { right: -25px; bottom: 0 !important; top: auto;}
.slick-next:focus, .slick-next:hover, .slick-prev:focus, .slick-prev:hover { background: var(--priColor); }

/* pricing */
#pricing { position: relative;padding: 5rem 0;}
#pricing::after { content: ''; position: absolute; top: -16%; left: 50%; width: 1920px; height: 90%; transform: translateX(-50%); z-index: -1;background: url('images/section2.png');background-position-x: 0%;background-size: auto;background-size: cover;background-position-x: 51%;}
.pricint_top_info { text-align: center; }
.pricint_top_info .sub_heading_bullet { margin: 0 auto 1rem; }
.pricint_top_info h2 { color: var(--whiteColor); width: 50%; margin: 0 auto 2rem; }
.pricing_btm_info p { color: var(--whiteColor); margin: 0 0 1rem;}
.pricing_btn { display: flex; justify-content: center; }
.pricing_btn h3 { display: flex; gap: 1rem; }
.pricing_section { display: flex; justify-content: space-between; margin: 3rem 0 0;}
.pricing_section section { background: #202021; padding: 3rem; width: 31%; border-radius: 1rem; }
.pricing_section span { font-family: var(--secFont); font-weight: 600; }
.pricing_section section.gradient-border { position: relative; }
.pricing_section section.gradient-border::before { content: ''; position: absolute; inset: 0; padding: 2px; border-radius: 1rem; background: var(--btnArrowColor); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }

/* Pricing toggle control */
.pricing_btn { align-items: center; gap: 1rem; }
.pricing_btn .price_toggle { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pricing_btn .toggle { position: relative; width: 56px; height: 28px; background: #e9e9e9; border-radius: 999px; display: inline-block; cursor: pointer; }
.pricing_btn .toggle::after { content: ''; position: absolute; top: 3px; left: 3px; width: 22px; height: 22px; background: var(--btnArrowColor); border-radius: 50%; transition: left .2s ease; }
.pricing_btn .price_toggle:checked + .toggle { background: var(--whiteColor); }
.pricing_btn .price_toggle:checked + .toggle::after { left: 31px; }

@keyframes fadeUp {
  0% { opacity: 0; transform: translateY(16px); }
  100% { opacity: 1; transform: translateY(0); }
}
.pricing_section.animating section { animation: fadeUp 2s cubic-bezier(.22,.61,.36,1) both; will-change: opacity, transform; backface-visibility: hidden; }
.pricing_section.animating section:nth-child(2) { animation-delay: .08s; }
.pricing_section.animating section:nth-child(3) { animation-delay: .16s; }
.pricing_btn h3 { margin: 0; width: fit-content; color: transparent; background: linear-gradient( 120deg, rgb(100, 54, 194) 0%, rgb(159, 11, 233) 29%, rgb(42, 172, 173) 69%, rgb(70, 215, 92) 100% ); background-clip: border-box; -webkit-background-clip: text; background-clip: text; line-height: 1.6; font-size: clamp(1.2rem, 1.0263rem + 0.7719vw, 1.75rem);}
.pricing_section h2 { font-size: 4.2rem; color: var(--whiteColor); }
.pricing_section ul { margin: 2rem 0 0; }
.pricing_section .button { margin: 2rem 0; }
.pricing_section p { color: #FFFEFE94; margin: 1rem 0 0; }
.pricing_section ul li { color: var(--whiteColor); padding: 0 0 0 2rem; position: relative;}
.pricing_section ul li::before { content: url('images/check-3.png'); position: absolute; top: 0; left: 1%; transform: translateY(8%); width: fit-content; height: fit-content;  border-radius: 50%; z-index: 5;}
.pricing_section ul li::after { content:''; position: absolute; top: 0; left: 0; transform: translateY(30%); width: 1.34rem; height: 1.34rem;  border-radius: 50%; background: var(--btnArrowColor);}

/* Contact form */
#contact_us { position: relative; overflow: hidden;}
/* #contact_us::after { content: url('images/contact_bg.jpg'); position: absolute;  left: 0; width: 100%; height: fit-content; bottom: -7%;} */
.contact_us_con { position: relative; z-index: 1; padding: 5rem 0;}

.cu_top_info span { margin: 0px auto 1rem; }
.cu_top_info h2 { text-align: center; }
.cu_bottom_info { display: flex; flex-wrap: wrap; justify-content: space-between; margin: 5rem 0 0;}
.contact_sidebar_info { width: 45%; display: flex; flex-wrap: wrap; height: fit-content;gap: 2rem; margin: 2rem 0 0;}
.contact_sidebar_info h3 { margin: 0; }
.contact_sidebar_info ul li a { color: var(--textColor); }
.contact_sidebar_info li { width: 100%; font-weight: 300; position: relative;padding: 0 0 0 6rem;width: 90%;}
.contact_sidebar_info li::after { content: url('images/pin-location.png'); position: absolute; top: 50%; left: 1.2rem; transform: translateY(-50%); width: 1.34rem; height: 1.34rem;  border-radius: 50%; }
.contact_sidebar_info li:nth-child(2)::after { content: url('images/call.png');  }
.contact_sidebar_info li:nth-child(3)::after { content: url('images/email.png');  }
.contact_sidebar_info li::before { content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 4rem; height: 4rem;  border-radius: 1.3rem; background: var(--btnArrowColor);}
.form_row-2 .form_group { width: 100%; }
.contact_sidebar_info .sub_menu li::after { all: unset; }

.contact_sidebar_info .sub_menu li::before { all: unset; }
.sub_menu li { padding: 0; }
.contact_us_con .form { width: 50%; }
.contact-form { display: block; width: 50%;}
.form_row { display: flex; gap: 1rem; margin: 1.5rem 0; flex-wrap: wrap; justify-content: space-between;}
.form_group { width: 47%; }
.form_group.full { width: 100%; }
.form_group label { font-weight: 700; color: var(--darkColor); margin: 0 0 .6rem; display: block; display: flex;}
.form_group .req { color: var(--secColor); margin-left: .3rem; }
.form_group input,
.form_group select { width: 100%; height: 54px; border-radius: 2rem; border: 1px solid #D9D9E3; background: #fff; color: var(--darkColor); padding: 0 1.2rem; outline: none; transition: border-color .2s ease, box-shadow .2s ease; }
.form_group textarea { width: 100%; min-height: 180px; border-radius: 1.2rem; border: 1px solid #D9D9E3; background: #fff; color: var(--darkColor); padding: 1rem 1.2rem; outline: none; transition: border-color .2s ease, box-shadow .2s ease; resize: vertical; }
.form_group input::placeholder,
.form_group textarea::placeholder { color: #9AA0A6; }
.form_group input:focus,
.form_group select:focus,
.form_group textarea:focus { border-color: #B7B7C6; box-shadow: 0 4px 16px rgba(0,0,0,0.06); }
.select_wrap { position: relative; }
.select_wrap::after { content: '▾'; position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); color: #666; pointer-events: none; }
.contact_sidebar_info h4 { margin: 0 0 .5rem; }
.submit_btn { background: #fff; color: var(--darkColor); border: none; border-radius: 2rem; padding: 1rem 2rem; box-shadow: 0 10px 24px rgba(0,0,0,0.12); cursor: pointer; font-weight: 700; margin: 1rem 0 0; }

/* Work */
#work { padding: 5rem 0; position: relative;overflow: hidden;}
#work::after { content:''; position: absolute; top: 0; left: 0; width: 100%; height: 50%; background: #1A1A1A;z-index: -1;}
#work::before { content: url('images/focused-professional-working-night-office.webp'); position: absolute; bottom: 0; left: 50%; width: 1920px; height: 50%; background: #1A1A1A; z-index: -1; transform: translateX(-50%);}
.work_top_info h2 { text-align: center; color: var(--whiteColor);}
.work_top_info span { margin: 0 auto 1rem; }
.work_img { background: url('images/team-collaboration-meeting-modern-office.webp'); background-size: cover; background-position: center; background-repeat: no-repeat; width: 100%; height: 35rem; border-top-left-radius: 4rem;border-top-right-radius: 4rem;border-bottom-right-radius: 4rem;border-bottom-left-radius: 14rem;}
.work_img { display: flex; align-items: end; position: relative;overflow: hidden;}
.work_img::after { content: ''; width: 100%;height: 100%;position: absolute;background: rgba(0, 0, 0, 0.45);}

.work_content { padding: 0 0 3rem 9rem; position: relative;z-index: 1;}
.work_content .button { margin: 0; }
.work_content h3 { color: var(--whiteColor); width: 80%;line-height: 1.5;}
.work_content .button { margin: 0; background: var(--btnArrowColor); font-weight: 600; padding: 1.2rem 4rem 1.2rem; }
.work_content .button::after {all: unset;}
.work_count { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; margin: 5rem 0 0; position: relative;}
.work_count li {position: relative;}
.work_count li::after {content: url('images/star_counter.png'); position: absolute; top: 50%; right: -68%; transform: translateY(-50%); width: fit-content; animation: spin360 5s linear infinite; will-change: transform; transform-origin: 50% 50%; display: inline-block; }
@keyframes spin360 {
  from { transform: translateY(-50%) rotate(0deg); }
  to { transform: translateY(-50%) rotate(360deg); }
}
.work_count li::before {content: ''; position: absolute; top: 0; left: 0;  width: 2.7rem;  height: 2.7rem;background: var(--btnArrowColor);border-radius: 50%;z-index: -1;}
.work_count li h3 { font-size: clamp(3.5rem, 3.1842rem + 1.4035vw, 4.5rem); font-weight: 800; margin: 0;text-align: center;}
.work_count span { font-family: var(--secColor); font-size: 1.2rem; text-transform: uppercase; }
.work_count h3, .work_count span{ color: var(--whiteColor); }

/* Blog */
.blog {  margin: 5rem 0;}
.blog_top_info span { margin: 0 auto 1rem; }
.blog_top_info h2 { text-align: center;margin: 0 0 1rem; }
.blog_top_info p { text-align: center; }
.blog_top_info { margin: 0 0 5rem; }
.blog_posts_con { display: flex; flex-wrap: wrap; justify-content: space-between; }
.blog_post { width: 32%; padding: 0 15px;}
.blog_image img { width: 100%; height: 19rem; object-fit: cover; }
.blog_info a { color: var(--darkColor); }
.heading_blog_info .cat { width: fit-content; color: transparent; background: linear-gradient( 120deg, rgba(100, 54, 194, 1) 0%, rgba(159, 11, 233, 1) 29%, rgba(42, 172, 173, 1) 69%, rgba(70, 215, 92, 1) 100% ); background-clip: border-box; -webkit-background-clip: text; background-clip: text; line-height: 1.6; text-transform: uppercase; font-weight: 600;  position: relative; }
.heading_blog_info .cat::after { content: ''; position: absolute; top: 50%; right: -1.3rem; transform: translateY(-50%); width: .4rem; height: .4rem; background: var(--btnArrowColor); border-radius: 50px; }
.heading_blog_info { align-items: center; display: flex; gap: 2rem; align-items: center; }
.heading_blog_info span { font-size: clamp(1rem, 0.9684rem + 0.1404vw, 1.1rem); font-family: var(--secFont); }
.heading_blog_info .date { color: var(--textColor); }
.blog_post figure { border-radius: 1.5rem; overflow: hidden; }
.blog_info { padding: 2rem; }
.blog_info h3 { margin: 1rem 0 0; text-align: left; }
.blog_info .button-2 { color: var(--textColor); }
.blog_image { border-radius: 1rem; overflow: hidden; }


swiper-container { width: 100%; height: 100%; }
swiper-slide { text-align: center; font-size: 18px; background: #444; display: flex; justify-content: center; align-items: center; }
swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* Footer */
footer {position: relative;padding: 13rem 0 3rem;overflow: hidden;}
footer::after {content: '';   position: absolute;   top: 0;   left: 50%;   width: 1920px;   height: 100%;   transform: translateX(-50%);   z-index: -1;   background: url('images/section2.png');     background-position-x: 0%;     background-size: auto;   background-position-x: 0%;   background-size: auto;   background-size: cover;   background-position-x: 51%;}
.footer_top { display: flex; gap: 4rem;justify-content: space-between;}
.ftr_images {display: flex;gap: 0.7rem;}
.ftr_images img { height: 6rem; overflow: hidden; object-fit: cover; border-radius: .5rem;}
.footer_top section { width: 28%; }
.ftr_images figure { border-radius: .6rem; overflow: hidden; }
.footer_logo { width: 26% !important; }
#footer_menu { column-count: 2; gap: 11rem;}
#footer_menu li { color: var(--whiteColor); line-height: 2.8; position: relative;}
#footer_menu li a { color: var(--whiteColor); }
#footer_menu li::after { content: url('images/right-arrow.png'); position: absolute; top: 50%; left: -30%; transform: translateY(-50%); width: fit-content; height: fit-content;  border-radius: 50px; }
#footer_menu li::before { content: url('images/right-arrow-2.png'); position: absolute; top: 59%; left: -28%; transform: translateY(-50%); width: fit-content; height: fit-content;  border-radius: 50px; }
.footer_logo p { color: var(--lightColor); margin: 1rem 0; }
.ftr_contact_number { margin: 2rem 0 0; }
.ftr_contact_number li a { color: var(--lightColor); }
.ftr_contact_number li { line-height: 2.8; position: relative; padding: 0 0 0 3rem; }
.ftr_contact_number li::after {content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 2.2rem; height: 2.2rem;  border-radius: 50px; background: var(--btnArrowColor)}
.ftr_contact_number li::before {content: url('images/call-16.png'); position: absolute; top: 55%; left: 3%; transform: translateY(-50%); width: fit-content; height: fit-content;  border-radius: 50px; z-index: 1; }
.ftr_contact_number li:nth-child(2):before {content: url('images/email-16.png');  }
.ftr_social_media { display: flex; justify-content: space-between; background: #252628; padding: 3rem 5rem; border-radius: 9rem; margin: 5rem 0 0;display: none;}
.ftr_social_media li a { display: flex; gap: 0.8rem; align-items: center; }
.ftr_social_media li h4 {margin: 0;color: var(--whiteColor);}
.copyright { text-align: center; font-weight: 600; color: var(--whiteColor); margin: 3rem 0 0; }
.copyright span { color: var(--btnArrowColor); width: fit-content;color: transparent;background: linear-gradient( 120deg, rgba(100, 54, 194, 1) 0%, rgba(159, 11, 233, 1) 29%, rgba(42, 172, 173, 1) 69%, rgba(70, 215, 92, 1) 100% );background-clip: border-box;-webkit-background-clip: text;background-clip: text;display: inline;font-family: var(--secFont);font-size: inherit;}

/* Nonhome */
#nonhome { background: #F5F5F5; overflow: unset; }
#nh-bnr { background-repeat: no-repeat; background-size: cover; position: relative; height: 37rem; display: flex; align-items: end; background-position: center; overflow: hidden; position: relative;}
#nh-bnr::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7);  }
.nh-bnr-con h1 { font-size: clamp(3.3rem, 2.9211rem + 1.6842vw, 4.5rem); }
.header_top_info.nonhome p { color: var(--whiteColor); }
.nh-bnr-con {  display: flex; flex-direction: column;  height: 18rem; margin: 0 0 3rem; position: relative; gap: 2rem;}
#breadcrumbs { width: fit-content; border: 1px solid transparent; border-radius: 38rem; padding: .5rem 1.5rem; background: linear-gradient(var(--textColor), var(--textColor)) padding-box, linear-gradient( 120deg, rgba(100, 54, 194, 1) 0%, rgba(159, 11, 233, 1) 29%, rgba(42, 172, 173, 1) 69%, rgba(70, 215, 92, 1) 100% ) border-box; }
#breadcrumbs span { font-family: var(--secFont); font-size: 1.2rem; }
.heading-title { color: var(--whiteColor); }
#breadcrumbs span { display: flex; gap: 2rem; }
#breadcrumbs span, #breadcrumbs a { color: var(--whiteColor); }


/* backend */
#wp-admin-bar-my-account span { display: contents; }
