@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

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, 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-weight: 400; font-family: "Inter", sans-serif; vertical-align: baseline;}
*, *::before, *::after {box-sizing: border-box;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}
a {text-decoration: none; outline: none; margin: 0;}
.card {border: 0; border-radius: 0;}

:root{
  --main_color :#9b1b34;
  --text-color :#161519;
  --black : #000;
  --white : #FFF;
  --section_bg : #EEEEEE;
  --text-mute : #ffffffcc;
  --gray-border: #7070708c;
  --badge-bg: #fdf4f8;
  --gray:#6b7280;
  --gray-light:#9ca3af;
  --maroon-dark:#7a1730;
  --blue:#2952cc;
  --green:#1f8a5a;
  --pink-bg:#fdecec;
  --pink-border:#f4c7cb;
  --green-bg:#eafaf2;
  --green-border:#bfe9d3;
  --text-dark:#1f2430;
  --text-muted:#5a6270;
}
.section_bg{background-color:#EEEEEE !important;}
img{width: 100%;height:auto;max-width:100%;}
/* CLS Prevention - Ensure images maintain aspect ratio */
img[width][height] {height: auto;}

body:has(.sidebar.active){overflow:hidden;}
.button,.button:focus,.button:active{display: inline-flex;align-items: center;justify-content: center;gap: 10px;font-size: 14px;font-weight: 600;line-height: 1;text-decoration: none;text-transform: uppercase;text-align: center;border: none;border-radius: 0;color: var(--white);background: var(--main_color) !important;padding: 13px 25px 12px;outline: none;cursor: pointer;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-ms-transition: all 0.3s ease;-o-transition: all 0.3s ease;}
.button:hover{background: var(--main_color) !important;color: var(--white);transform: scale(0.95);transition: all 0.3s ease;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-ms-transition: all 0.3s ease;-o-transition: all 0.3s ease;}

.secondry-btn,.secondry-btn:focus,.secondry-btn:active{display: inline-flex;align-items: center;justify-content: space-between;gap: 10px;font-size: 14px;font-weight: 600;line-height: 1;text-decoration: none;text-transform: uppercase;text-align: center;border-radius: 0;color: var(--text-color);background: var(--white) !important;padding: 13px 25px 12px;outline: none;cursor: pointer;border: 1px solid var(--gray-border);-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-ms-transition: all 0.3s ease;-o-transition: all 0.3s ease;}
.secondry-btn:hover{background: var(--text-color) !important;color: var(--white);transform: scale(0.95);transition: all 0.3s ease;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-ms-transition: all 0.3s ease;-o-transition: all 0.3s ease;}

h1 {display: block; font-size: 42px;margin: 0; font-weight: 800; text-transform: capitalize; color: #000000; text-align: center;padding-bottom: 20px; position: relative;}
h1::after {content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); display: block; width: 100px; height: 4px; background-color: var(--main_color);}
.title {padding-bottom: 40px;}

/* Header */
.header{display:block;width:100%;margin:0;padding:0;box-shadow:0px 0px 10px -3px #000000;position:relative;z-index:2;}
.header .head_top{display: block;width: 100%;background-color:var(--main_color);padding:8px 0;margin:0;}
.header .head_top .content{display:flex;align-items:center;gap:20px;width:100%;padding:0px 0;margin:0;}
.header .head_top .content a,
.header .head_top .content a:focus{display:block;width:auto;text-decoration:none;outline:none;box-shadow:none;border:0;margin:0;padding:0;font-family:"Inter", Sans-serif;font-size:14px;font-weight:500;line-height:1.7;letter-spacing:1px;color:var(--white);}
.header .head_top .content a:hover,
.header .head_top .content a:active{text-decoration:none;outline:none;box-shadow:none;border:0;text-shadow:0 0 0px var(--white);}
.header .stickyHeader{position:fixed;top:0;left:0;z-index:123;width:100%;box-shadow:0 0 10px -3px transparent;border-radius:0 0 20px 20px;animation:slideDown 0.35s ease-out;}
.header .main_head{display:block;width:100%;background-color: var(--white); border-bottom: 1px solid #ccc;}
.header .main_head .navbar{padding:11px 0;width:100%;}
.header .main_head .navbar-brand{max-width:208px;height:auto;}
.header .main_head .navbar-brand img{max-width:208px;height:auto;}
.header .main_head ul.main-nav{display:flex;gap:0px;align-items:center;flex-wrap:wrap;justify-content:center;list-style:none;padding:0;margin:0;}
.header .main_head ul.main-nav li{padding:0px 15px; margin-bottom: 0;}
.header .main_head ul.main-nav li a.nav-link{color: var(--text-color);font-size:16px;text-decoration:none;font-weight:600;padding: 0;}
.header .main_head ul.main-nav li a.nav-link:hover{color: var(--main_color);}
.header .main_head ul.main-nav li.active a.nav-link{color:var(--text-color) !important;text-shadow: 0 0 1px transparent !important;}
.header .main_head ul.main-nav li.active a.nav-link.active{color: var(--main_color) !important;}
.header .main_head ul.main-nav li.active > a.nav-link, .header .main_head ul.main-nav li.active > a.nav-link.show, .header .main_head ul.main-nav li.active > a.nav-link.active {color: var(--main_color) !important;}
.header .main_head .quote-btn {background-color: var(--main_color); color: var(--white); padding: 10px 23px 10px; border: none; font-weight: 600; text-decoration: none; border-radius: 2px; font-size: 13px; align-items: center; justify-content: space-between;}
.header .main_head .quote-btn:hover {color: var(--white); transform: scale(0.95); transition: all 0.3s ease;}
.header .main_head .hamburger{display: none;cursor: pointer;}
.header .main_head .hamburger i{font-size:28px;color:#000;}
.header .sidebar{position: fixed; top: 0; left: -360px; width:360px; height: 100%; background-color: #121212; padding: 40px 20px;display: flex; flex-direction: column; gap: 20px; transition: left 0.3s ease; z-index: 1000;overflow:scroll;}
.header .sidebar a {color: var(--white); font-size: 18px; text-decoration: none; font-weight: 500;}
.header .sidebar .close-btn {position: absolute; top: 15px; right: 15px; color: var(--main_color); font-size: 24px; cursor: pointer;}
.header .sidebar.active {left: 0;}
.header .sidebar.active .service:focus{box-shadow: none;}
.header .main_head .main-nav .dropdown-menu {border-radius: 0px 0px 20px 20px; border: none; box-shadow: 0px 10px 10px -3px #BDBDBD; width: 100%;}
.header .main_head .main-nav .dropdown-menu .mega-content .title a {font-size: 20px; font-weight: 600; color: var(--main_color);}
.header .main_head .main-nav .dropdown-menu .mega-content .title-2 a {font-size: 20px; font-weight: 600; color: var(--main_color);}
.header .main_head .main-nav .dropdown-menu .mega-content .title-2 {margin-top: 40px;}
.header .main_head .main-nav .dropdown-menu .mega-content .list-group {margin-top: 20px; gap: 13px; font-weight: 0;}
.header .main_head .main-nav .dropdown-menu .mega-content .list-group a {color: var(--text-color); font-size: 16px; font-weight: 500; line-height: 1em;}
.header .main_head .main-nav .dropdown-menu .mega-content .list-group a:hover {text-shadow: 0 0 1px #000 !important;}
.header .main_head .main-nav .dropdown-menu .mega-content .dash-main {background-color: #000; width: 50px; height: 2px; margin-top: 20px;}

/* Hero Banner Home page */
.slider-wrapper {display: block;width: 100%;max-width:1366px;margin:0 auto;padding:40px 0;position: relative;background: #f8f8f8;}
.slider-wrapper .hero_banner {overflow: hidden; max-height: 450px;}
.slider-wrapper .hero_banner:not(.slick-initialized) .slide:not(:first-child) { display: none; }
/*.hero_banner.slick-initialized {opacity: 1;}*/
.slider-wrapper .hero_banner .slide {display:flex;align-items:center;justify-content:space-between;gap:50px;flex-wrap:wrap;padding:40px 0 0 0;}
.slider-wrapper .hero_banner .slide .slide-text {flex: 1;min-width: 300px;padding:0 0px;}
.slider-wrapper .hero_banner .slide .slide-text h1{display: block;width: 100%;font-size: 37px;font-weight: 800;line-height: 1.3;color: var(--text-color);margin-bottom: 0;position: relative;text-align: left;}
.slider-wrapper .hero_banner .slide .slide-text h1::after{display: none;}
.slider-wrapper .hero_banner .slide .slide-text h1 strong{color: var(--main_color);font-weight: 800;}
.slider-wrapper .hero_banner .slide-text h2 strong{color:var(--main_color);font-weight:800;}
.slider-wrapper .hero_banner .slide-text p{display: block;width: 100%;font-size:20px;font-weight: 400;line-height: 1.3;color: var(--dark);margin-bottom:25px;}
.slider-wrapper .slide img {max-width:500px;width:100%;height:auto;}
.slider-wrapper .arrow-container {display:flex;justify-content:center;align-items:center;gap:20px;padding-bottom:20px;}
.slider-wrapper .arrow-container button{display:block;width:auto;background:var(--text-color);color:var(--white);border:none;font-size:15px;width:30px;height:30px;display:flex;justify-content:center;align-items:center;}
.slider-wrapper .arrow-container button:hover {background:var(--main_color);}

/* Slider 2 home page */
.showcase_projects{display:block;width:100%;margin:0;padding:40px 0;background-color:var(--section_bg);}
.showcase_projects .description{text-align: left;background-color: var(--main_color);padding: 30px;font-weight: 600;line-height: 1.5;color: var(--white);}
.showcase_projects .headtitle{display:block;width:100%;text-align:center;padding:0px 0 20px;margin-bottom:30px;position:relative;font-family: "Inter", Sans-serif; font-size: 42px;font-weight: 800;text-transform: capitalize;line-height: 1.2em;color:var(--text-color);}
.showcase_projects p{display:block;width:100%;text-align:left;padding:0px 0 0;margin-bottom:20px;position:relative;font-family: "Inter", Sans-serif;font-size:16px;font-weight:400;line-height: 1.5em;color:var(--text-color);}
.showcase_projects .more-btn{ display: flex; justify-content: center;}
.showcase_projects .headtitle::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:block;width:100px;
height:4px;background-color:var(--main_color);}
.showcase_projects .project_slider{display: block;width:100%;overflow:hidden;position:relative;padding:0;margin:20px auto 0 auto; max-height: 400px;}
.showcase_projects .project_slider .projects{display:block;width:100%;position:relative;padding:0 0;margin:0;}
.showcase_projects .project_slider .projects .slick-track{display: flex !important;align-items: stretch;}
.showcase_projects .project_slider .projects .slick-list {overflow:visible;margin:0 -15px;}
.showcase_projects .project_slider .button{padding:10px 18px;font-size:20px;border-radius:5px;font-weight:bold;cursor:pointer;position:absolute;top:55%;transform:translateY(-50%);z-index:1;}
.showcase_projects .project_slider .button.prev_btn{left:0;}
.showcase_projects .project_slider .button.next_btn{right:0;}
.showcase_projects .project_slider .button.prev_btn,
.showcase_projects .project_slider .button.next_btn{margin:0 10px;}
.showcase_projects .projects .custom-slide-two{display:block;background:var(--white);padding:0 0;margin:0 15px;box-shadow:0 5px 20px rgba(0,0,0,0.1);overflow:hidden;position: relative;height: auto;}
.showcase_projects .projects .custom-slide-two .slide-inner{display:flex;padding:30px 50px;flex-direction:row;gap:20px;align-items:center;position:relative;z-index:1;}
.showcase_projects .projects .custom-slide-two.decorated-slide::before {content: "";position: absolute;top: 0;left: 0;width: 180px;height: 180px;background-image: url('../images/ball-top-left-a.webp'); background-repeat: no-repeat;background-size: contain;z-index: 0;}
.showcase_projects .projects .custom-slide-two.decorated-slide::after {content: "";position: absolute;bottom: 0;left: 40px;width: 185px;height: 40px;background-image: url('../images/dots-top-right.webp'); background-repeat: no-repeat;background-size: contain;z-index: 0;}
.showcase_projects .projects .custom-slide-two.decorated-slide .slide-inner::before {content: "";position: absolute;top: 0;right: 5px;width: 56px;height: 73px;background-image: url('../images/dots-top-right.webp'); background-repeat: no-repeat;background-size: contain;z-index: 0;}
.showcase_projects .projects .custom-slide-two.decorated-slide .slide-inner::after {content: "";position: absolute;bottom: 0;right: 0;width: 89px; height: 180px;background-image: url('../images/ball-bot-right-a.webp'); background-repeat: no-repeat;background-size: contain;z-index: 0;}

.showcase_projects .projects .custom-slide-two.decorated-slide .slide-left {flex:1;text-align:center;}
.showcase_projects .projects .custom-slide-two.decorated-slide .slide-left img {max-width:100%;height:auto;}
.showcase_projects .projects .custom-slide-two.decorated-slide .slide-right {flex:2;background-color:#F9F9F9;padding:20px;}
.showcase_projects .projects .custom-slide-two.decorated-slide .slide-tags {color:var(--main_color);font-weight:bold;font-size:17px;}
.showcase_projects .projects .custom-slide-two.decorated-slide .slide-right h3 {font-weight:500;font-size:25px;margin-top:10px;}
.showcase_projects .projects .custom-slide-two.decorated-slide .subtitle {font-size:16px;color:black;margin-top:10px;font-weight:400;}
.showcase_projects .projects .custom-slide-two.decorated-slide .desc {font-size:14px;margin-top:13px;color:black;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;}
.showcase_projects .projects .custom-slide-two.decorated-slide .button.inner_btn{padding:9px 25px;font-size:13px;text-decoration:none;margin-top:10px;font-weight:bold;outline:none;box-shadow:none;border:none;position: unset;transform:none;border-radius:0;}
.tech-tags {margin-top:10px;}
.tech-tags span {background-color:#444;color:var(--white);padding:3px 17px;margin:10px 10px 0 0;display:inline-block;font-size:13px;}


/* Slide 2 - custom background decorations */
.showcase_projects .projects .custom-slide-two.decorated-slide-2::before {background-image: url('../images/ball-top-left-f.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-2::after {background-image: url('../images/dots-top-right.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-2 .slide-inner::before {background-image: url('../images/dots-top-right.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-2 .slide-inner::after {background-image: url('../images/ball-bot-right-f.webp');}

/* Slide 3 - custom background decorations */
.showcase_projects .projects .custom-slide-two.decorated-slide-3::before {background-image: url('../images/ball-top-left-b.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-3::after {background-image: url('../images/dots-top-right.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-3 .slide-inner::before {background-image: url('../images/dots-top-right.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-3 .slide-inner::after {background-image: url('../images/ball-bot-right-b.webp');}

/* Slide 4 - custom background decorations */
.showcase_projects .projects .custom-slide-two.decorated-slide-4::before {background-image: url('../images/ball-top-left-c.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-4::after {background-image: url('../images/dots-top-right.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-4 .slide-inner::before {background-image: url('../images/dots-top-right.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-4 .slide-inner::after {background-image: url('../images/ball-bot-right-c.webp');}

/* Slide 5 - custom background decorations */
.showcase_projects .projects .custom-slide-two.decorated-slide-5::before {background-image: url('../images/ball-top-left-d.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-5::after {background-image: url('../images/dots-top-right.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-5 .slide-inner::before {background-image: url('../images/dots-top-right.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-5 .slide-inner::after {background-image: url('../images/ball-bot-right-d.webp');}

/* Slide 6 - custom background decorations */
.showcase_projects .projects .custom-slide-two.decorated-slide-6::before {background-image: url('../images/ball-top-left-e.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-6::after {background-image: url('../images/dots-top-right.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-6 .slide-inner::before {background-image: url('../images/dots-top-right.webp');}
.showcase_projects .projects .custom-slide-two.decorated-slide-6 .slide-inner::after {background-image: url('../images/ball-bot-right-e.webp');}


.team-section{display:block;width:100%;margin: 0;padding:40px 0 60px 0; background-color: var(--section_bg);}
.team-section .description{text-align: left;background-color: var(--main_color);padding: 30px;font-weight: 600;line-height: 1.5;color: var(--white);}
.team-section .headtitle{display:block;width:100%;text-align:center;padding:0px 0 20px;margin-bottom: 30px;position:relative;font-family: "Inter", Sans-serif; font-size: 42px;font-weight: 800;text-transform: capitalize;line-height: 1.2em;color:var(--text-color);}
.team-section .headtitle::after{    content: '';position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);display: block;width: 100px;height: 4px;background-color: var(--main_color);}
.team-section .team-image img{width:100%;display:block;border-radius: 15px;}
.team-section .expect-card{ gap: 40px; background:var(--white);padding:30px;border-radius:10px;height:100%;}
.team-section .expect-card h3{font-size:30px;font-weight:700;line-height:1.3;margin-bottom:25px;color:var(--text-color);}
.team-section .expect-card .expect-list{list-style:none;margin:0;padding:0;}
.team-section .expect-card .expect-list li{display:flex;align-items: center;gap:15px;margin-bottom:18px;font-size:17px;font-weight:500;color: var(--text-muted);}
.team-section .expect-card .expect-list li i{color:var(--main_color);font-size:20px;margin-top:2px;flex-shrink:0;}
.team-section .expect-card .content{display: flex;flex-direction: column;justify-content: space-evenly;height: 100%;}
.team-section .expect-card .content .button{width: fit-content;}

.technology{background-color: var(--white) !important;}
.technology.about-tech{padding: 60px 0 40px 0;}
.technology .description{text-align: left;background-color: var(--main_color);padding: 30px;font-weight: 600;line-height: 1.5;color: var(--white);}
.technology.about-tech .tech_used .tech_icons_container.right-border{border-right: 2px solid var(--main_color);}
.technology.about-tech .tech_used .tech_icons_container.right{margin-left: 20px;}
.technology.about-tech .tech_icons_container .technology-title {color: var(--text-color) !important;text-transform: uppercase;font-size: 16px;font-weight: 700 !important;padding-bottom: 5px;width: fit-content;border-bottom: 2px solid var(--main_color);margin-bottom: 15px;}
.technology.about-tech .tech_used .tech-card::before{display: none;}
.technology.about-tech .tech_used .tech-card{border: none; box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;}


.testimonial_section{display:block;width:100%;padding:80px 0;margin:0;background-color:var(--white);}
.testimonial_section .headtitle{display:block;width:100%;text-align:center;padding:0px 0 20px;margin-bottom:20px;position:relative;font-family: "Inter", Sans-serif; font-size: 42px;font-weight: 800;text-transform: capitalize;line-height: 1.2em;color:var(--text-color);}
.testimonial_section .headtitle::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:block;width:100px;height:4px;background-color:var(--main_color);}
.testimonial_section .testimonial-card{display:block;position:relative;width:100%;max-width:354px;margin:20px auto 0 auto;padding:0;background-color:var(--white);border:1px solid #ddd;box-shadow:0 2px 10px rgba(0, 0, 0, 0.05);}
.testimonial_section .testimonial-card .testimonial_top{display:block;width:100%;padding:20px 20px;margin:0;}
.testimonial_section .testimonial-card .testimonial_top .company-logo{display: block;width:110px;height: auto;margin-bottom:20px;}
.testimonial_section .testimonial-card .testimonial_top .person-image{display: block;width:254px;max-width:100%;height:auto;margin:0 auto 20px auto;}
.testimonial_section .testimonial-card .testimonial_top .person-name{display: block;width:100%;margin:0;padding:0;font-family:"Inter", Sans-serif;font-size:24px;font-weight:600;color:var(--text-color);text-align:center;}
.testimonial_section .testimonial-card .person-role-wrapper{display:block;width:100%;margin:0;padding:20px 40px;position:relative;background-color:var(--main_color);}
.testimonial_section .testimonial-card .person-role-wrapper .person-role{display:block;width:100%;text-align:center;color:var(--white);font-size:18px; font-weight:500;text-transform:uppercase;}

.tstm-section {display: block;width:100%;position:relative;padding:60px 0 30px;}
.tstm-slider .tstm-card-wrapper{display: flex;height: 100%;margin: 0 10px; }
.tstm-section .tstm-card-wrapper .tstm-card {background:#fff;padding:30px 30px;margin-bottom:30px;border-radius:12px;min-height:226px;box-shadow: 0px 5px 5px 0px #0000001A;height: 100%;display: flex;flex-direction: column;justify-content: space-between;transition: transform 0.3s ease, box-shadow 0.3s ease;}
.tstm-section .tstm-card-wrapper .tstm-card .testimonial-img {width: 80px !important;  height: 80px !important;  border-radius: 50%;  margin: 0% !important;object-fit: cover;   margin-right: 16px;  }
.tstm-section .tstm-card-wrapper .tstm-card .tstm-text { font-size:20px; color: var(--text-color);line-height: 1.6;margin-bottom: 20px; }
.tstm-section .tstm-card-wrapper .tstm-card .tstm-client-name {font-size: 23px; font-weight: 700;color: var(--text-color);margin-bottom: 0;}
.tstm-section .tstm-card-wrapper .tstm-card .tstm-client-location { font-size: 20px; color: gray;}
.tstm-section .tstm-carousel-control-prev,
.tstm-section .tstm-carousel-control-next {width: 40px;height: 40px;border-radius: 50%;background-color: #000;display: flex;justify-content: center;align-items: center;position: absolute;top: 50%;transform: translateY(-50%);opacity: 0.9;transition: background-color 0.3s ease;z-index: 1;color: #fff;font-size: 18px; border: none; cursor: pointer;}
.tstm-section .tstm-carousel-control-prev:hover,
.tstm-section .tstm-carousel-control-next:hover {background-color: #000;}
.tstm-section .tstm-carousel-control-prev { left: 0px; }
.tstm-section .tstm-carousel-control-next {right: 0px;}

.expertise-section{display:block;width:100%;margin: 0;padding:40px 0;}
.expertise-section .headtitle{display:block;width:100%;text-align:center;padding:0px 0 20px;margin-bottom:30px;position:relative;font-family: "Inter", Sans-serif; font-size: 42px;font-weight: 800;text-transform: capitalize;line-height: 1.2em;color:var(--text-color);}
.expertise-section .headtitle::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:block;width:100px;height:4px;background-color:var(--main_color);}
.expertise-section .row_gap{row-gap:60px;margin-top:100px;}
.expertise-section .service-card{ display:flex;flex-direction:column;justify-content:space-between;width:100%;padding:30px 30px;margin:0 0 60px 0; background:var(--section_bg);transition:transform 0.3s ease-in-out;position:relative;box-shadow:rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;}
.expertise-section .description{text-align: left;background-color: var(--main_color);padding: 30px;font-weight: 600;line-height: 1.5;color: var(--white);}
.expertise-section .service-card .icon-boxs{content:'';position:absolute;top:-60px;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;width:130px;height:130px;box-shadow:rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;background-color:var(--text-color);}
.expertise-section .service-card .icon-boxs img{max-width:120px;height: auto;}
.expertise-section .service-card .icon-boxs{content:'';position:absolute;top:-60px;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;width:130px;height:130px;box-shadow:rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;background-color:var(--text-color);padding: 30px;}
.expertise-section .service-card .icon-boxs i{font-size: 50px;color:  var(--white);}
.expertise-section .service-card .icon-boxs.bg_red{background-color:var(--main_color);}
.expertise-section .service-card .service_bot{display:flex;justify-content:center;align-items:center;flex-direction:column;padding-top:60px;gap:20px;}
.expertise-section .service-card .service_bot h4{display:block;width:100%;margin:0;padding:0;font-family:"Inter", Sans-serif;font-size:24px;font-weight:800;text-transform:capitalize;line-height:1.2;letter-spacing:1px;color:var(--text-color);text-align:center;}
.expertise-section .service-card .service_bot p{min-height: 65px; display:block;width:100%;margin:0;padding:0;font-family:"Inter", Sans-serif;font-size:16px;font-weight:400;line-height:22px;color:var(--text-color);text-align:center;}

.why_us{display: block;width: 100%;margin: 0;padding:80px 0;background-color:#FFFFFF;background-image:url(../images/subtle-white-feathers.webp);background-size:cover;background-position:center;background-repeat:no-repeat;position: relative;}
.why_us .technology_part{margin:0 0 0 -60px;}
.why_us .tech_used{display:block;width:100%;margin:0;padding:40px 40px;background:var(--white);box-shadow:rgba(0, 0, 0, 0.24) 0px 3px 8px;}
.why_us .tech_used h5.title{display:block;width:100%;margin:0 0 10px;padding: 0;font-size:30px;line-height:1.2;color:var(--text-color);font-family:"Inter",sans-serif;font-weight:600;}
.why_us .tech_used .tech_icons_container{display:flex;justify-content:space-between;align-items:flex-start;margin:0;width: 100%;gap:10px;}
.why_us .tech_used .tech_icons_container .tech_icon{display:flex;width:100%;justify-content:flex-start;align-items:center;flex-direction:row;flex-wrap:wrap;gap:10px;}
.why_us .tech_used .tech_icons_container .tech_icon .icon{display:flex;width:auto;flex:0 0 calc(33.333% - 20px);justify-content:flex-start;align-items:center;padding:10px;gap:20px 20px;}
.why_us .tech_used .tech_icons_container .tech_icon .icon img{width:50px;max-width:50px;height:50px;object-fit:contain;object-position:center center;}
.why_us .tech_used .tech_icons_container .tech_icon .icon span{display:block;font-family:"Inter", Sans-serif;font-size:16px;font-weight:600;line-height:1;color:var(--text-color);}
.why_us .why_us_content{display:flex;flex-direction:column;justify-content:center;gap:20px;background-color:var(--main_color);color:var(--white);padding:40px 20px 40px 40px;margin:0;}
.why_us .why_us_content .listing{display: block;width:100%;max-width:70%;margin: 0;padding:10px;}
.why_us .why_us_content .listing ul{margin:0px;padding: 0;}
.why_us .why_us_content .listing ul li{display:flex;justify-content:flex-start;align-items:flex-start;gap:10px;font-family:"Inter", Sans-serif;}
.why_us .why_us_content .listing ul li:not(:last-child){padding-bottom:26px;}
.why_us .why_us_content .listing ul li:not(:first-child){margin-top:0;}
.why_us .why_us_content .listing ul li span{display:block;font-family: "Inter", Sans-serif;font-size:16px;font-weight: 600;line-height: 1.3;color:var(--white);margin:0;padding:0;}
.why_us .why_us_content .listing ul li i{font-size:20px;line-height: 1.3;color:var(--white);margin:0;padding:0;}
.why_us .why_us_content h4{display:block;width:100%;font-family:"Inter", Sans-serif;font-size:30px;font-weight:600;line-height:1.2;text-transform:capitalize;color:var(--white);margin: 0;padding: 0;}

.our_process{padding: 40px 0px; background-color: var(--text-color);}
.our_process .description{text-align: left;background-color: var(--main_color);padding: 30px;font-weight: 600;line-height: 1.5;color: var(--white);}
.our_process .headtitle{display: block;width: 100%;text-align: center;padding: 0px 0 20px;margin-bottom: 20px;position: relative;font-family: "Inter", Sans-serif;font-size: 42px;font-weight: 800;text-transform: capitalize;line-height: 1.2em; color: var(--white);}
.our_process .headtitle::after{content: '';position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);display: block;width: 100px;height: 4px;background-color: var(--main_color);}
.our_process .roadmap{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;position:relative;}
.our_process .roadmap::before{content:"";position:absolute;top:20%;left:8%;width:84%;height:4px;background: var(--main_color);z-index:0;}
.our_process .roadmap::after{content:"";position:absolute;bottom:20%;left:8%;width:84%;height:4px;background: var(--main_color);z-index:0;}
.our_process .roadmap .step{position:relative;background: var(--section_bg);padding:35px 20px;border-radius:18px;text-align:center;transition:.3s;z-index:1;}
.our_process .roadmap .step .number{  margin-bottom: 15px;  display: flex;gap: 10px;align-items: center;}
.our_process .roadmap .step .number span{    background: var(--main_color);padding: 5px 13px;border-radius: 18px;color: var(--bs-white);}
.our_process .roadmap .step p{text-align: left;}
.our_process .roadmap .step:hover{transform:translateY(-8px);}
.our_process .roadmap .step .circle{width:75px;height:75px;background: var(--main_color);color: var(--white);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:auto;margin-top:-70px;margin-bottom:20px;font-size:28px;border:6px solid var(--white);box-shadow:0 10px 20px rgba(179,18,59,.35);}
.our_process .roadmap .step h3{font-size:18px;color: var(--text-color);font-weight:600; line-height: 1.3; text-align: left;}
.our_process .roadmap .step:nth-child(4),.roadmap .step:nth-child(5),.roadmap .step:nth-child(6){margin-top:50px;}
.our_process .view-more{display: flex; justify-content: center; margin-top: 30px;}



.trusted_clients{display:block;width:100%;background-color:var(--section_bg);padding:80px 0px;margin: 0;max-height: 417px; overflow: hidden;}
.trusted_clients .headtitle{display:block;width:100%;text-align:center;padding:0px 0 20px;margin-bottom:20px;position:relative;font-family: "Inter", Sans-serif; font-size: 42px;font-weight: 800;text-transform: capitalize;line-height: 1.2em;color:var(--text-color);}
.trusted_clients .headtitle::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:block;width:100px;
height:4px;background-color:var(--main_color);}
.trusted_clients .autoplay{display:block;width:100%;margin:10px 0 0;padding: 0; opacity: 0;visibility: hidden;transition: opacity 0.3s ease;}
.trusted_clients .autoplay .client-card {background: var(--white); padding: 0px 25px; margin: 10px; height: 135px; min-height: 135px; display: flex; align-items: center; justify-content: center; box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px !important;}
.trusted_clients .autoplay .client-card img {max-width: 100%; max-height: 80px; object-fit: contain; min-height: 80px;}
.trusted_clients .autoplay.slick-initialized {opacity: 1;visibility: visible;}

.experiences{display:block;width:100%;margin:0;padding:80px 0;}
.experiences .headtitle{display:block;width:100%;text-align:center;padding:0px 0 20px;margin-bottom:20px;position:relative;font-family: "Inter", Sans-serif; font-size: 42px;font-weight: 800;text-transform: capitalize;line-height: 1.2em;color:var(--text-color);}
.experiences .headtitle::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:block;width:100px;
height:4px;background-color:var(--main_color);}
.experiences .counter_box{display:flex;justify-content:center;align-items:center;flex-direction:column;gap:20px;width:100%;margin:20px 0 0 0;padding:40px 20px;background-color:#FFFFFF;border: none;box-shadow:rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;}
.experiences .counter_num{color:var(--text-color);font-family: "Inter", Sans-serif;font-size:70px;font-weight:700;line-height:1;}
.experiences .counter_num .suffix{font-family:"Inter", Sans-serif;font-size:70px;font-weight:700;line-height:1;color:var(--main_color);}
.experiences .counter_label{color:var(--text-color);font-family: "Inter", Sans-serif;font-size: 22px;font-weight: 800;line-height:1;}

/* How we work page */

.how_work{display: block;width: 100%;margin: 0;padding:80px 0 0 0;}
.how_work .headtitle{display:block;width:100%;text-align:center;padding:0px 0 20px;margin-bottom:60px;position:relative;font-family: "Inter", Sans-serif; font-size: 42px;font-weight: 800;text-transform: capitalize;line-height: 1.2em;color:var(--text-color);}
.how_work .headtitle::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:block;width:100px;
height:4px;background-color:var(--main_color);}
.how_work .transform{display: block;width: 100%;padding:40px 40px;margin:0 0 60px;text-align:center;background-color:var(--section_bg)}
.how_work .transform .main_service_para{display: block;width:100%;text-align:center;font-size:18px;font-weight:400;line-height: 24px;color:#212529;}
.how_work h2{display:block;width:100%;text-align:center;font-size:32px;font-weight:600;color:var(--text-color);line-height:1.2;margin-bottom:20px;}
/* .how_work p{display: block;width:100%;text-align:center;font-size:18px;font-weight:400;line-height: 24px;color:#212529;} */

/*.how_work .step_box{display:flex;justify-content:space-between;align-items:stretch;gap:20px;width:100%;margin:0;padding:0;height:100%;}*/

.how_work .step_box{padding: 40px; display:flex;justify-content:space-between;align-items:stretch;gap:20px;width:100%;margin:0;height:100%;}
.how_work .step_box .step_status{display:flex;justify-content:space-around;align-items:center;flex-direction:column;background-color:#000;padding:10px 10px;flex:0 0 130px;}
.how_work .step_box .step_status .arrow_icon{width:100%;max-width:100%;height:auto;margin: 0;}
.how_work .step_box .step_status .step_count{display:flex;justify-content:center;align-items:center;width: 100%;margin: 0;padding:0;gap:0;}
.how_work .step_box .step_status .step_count span{display:inline;width:auto;margin: 0;padding: 0;font-size:64px;font-weight:600;color:#FFF;line-height:1;}
.how_work .step_box .step_content{gap:30px; display:flex;justify-content:space-between;align-items:center;width: 100%;margin: 0;padding:0 0;flex:1;}
.how_work .step_box .step_content img.step_image{width:350px;max-width:100%;height:auto;flex:0 0 350px;}
.how_work .step_box .step_content .content_wrapper{display:flex;flex-direction:column;justify-content:center;height:100%;}
/*.how_work .step_box .step_content .content_wrapper .step_title{font-size:26px;font-weight:700;margin-bottom:20px;color:#212529;line-height:1.3;}
.how_work .step_box .step_content .content_wrapper .step_description{display:block;width:100%;font-size:16px;font-weight:400;line-height:22.4px;color:var(--text-color);margin-bottom: 0;text-align:left;}*/

.how_work .step_box .step_content .content_wrapper ul li{font-weight: 700; list-style: disc;}
.how_work .step_box .step_content .content_wrapper .step_title{text-align: left; font-size:26px;font-weight:700;margin-bottom:20px;color:#212529;line-height:1.3;}
.how_work .step_box .step_content .content_wrapper .step_description{display:block;width:100%;font-size:16px;font-weight:400;line-height:22.4px;color:var(--text-color);margin-bottom: 10px;text-align:left;}
.how_work .step_box.gray-bg{ padding: 40px;background: #F0F0F0;}

.form_upload_group{max-width:100%;margin:0 auto;}
.form_upload_group .file-upload-wrapper{ display: flex; align-items: stretch; border:1px solid var(--main_color); background-color: #fff;overflow: hidden;position:relative;}
.form_upload_group .upload{display:inline-flex;justify-content:center;align-items:center;background-color:var(--main_color);color:#FFF;padding:12px 12px;font-size:14px;font-weight: 600;line-height:1;cursor:pointer;transition:background-color 0.3s ease; flex-shrink: 0; -webkit-transition: background-color 0.3s ease; -moz-transition: background-color 0.3s ease; -ms-transition: background-color 0.3s ease; -o-transition: background-color 0.3s ease;}
.form_upload_group .upload:hover{background-color:#8a1929;}
.form_upload_group .upload:active {background-color:var(--main_color);}
.form_upload_group .file-name{flex: 1;padding:6px 12px;font-size: 14px;color: #666;background-color: #fff;display: flex;align-items: center;}
.form_upload_group input[type="file"] {position: absolute;left: 0;top: 0;width: 100%;height: 100%;opacity: 0;cursor: pointer;}

.how_work.our-development .transform{background-color: var(--main_color);padding: 30px;}
.how_work.our-development .transform .main_service_para{text-align: left; font-weight: 600; line-height: 1.5; color: var(--white);}
.how_work .development-services-area{padding: 40px; background-color: var(--section_bg); margin: 0;max-width: 100%;}
.how_work .development-services-area .service-card{display:block;text-align:center;text-decoration:none;background-color: var(--white);border:1px solid transparent;border-radius:16px;padding:30px;height:100%;transition:.35s;box-shadow:0 8px 25px rgba(0,0,0,.05);}
.how_work .development-services-area .service-card:hover{transform:translateY(-6px);box-shadow:0 18px 45px rgba(0,0,0,.12);border-color:var(--main_color);}
.how_work .development-services-area .service-card .service-img{width: 100px;height: 100px;object-fit: contain;margin-bottom: 15px;}
.how_work .development-services-area .service-card h3{font-size: 20px;color: var(--text-color);font-weight: 700;margin-bottom: 10px;line-height: 1.35;}
.how_work .development-services-area .service-card p{color: #666;font-size: 15px;line-height: 1.7;margin: 0;}
.how_work .development-cta{background-color: var(--main_color); padding: 40px 0;}
.how_work .development-cta img {width: 200px;object-fit: contain;}
.how_work .development-cta .description h2{display: block;width: 100%;text-align: left;font-size: 32px;font-weight: 700;color: var(--white);line-height: 1.2;margin-bottom: 10px;}
.how_work .development-cta .description p{color: var(--white);font-size: 16px;margin: 0;margin-bottom: 10px;}
.how_work .development-cta a{border: 0 !important;}
/* How we work page */

.footer_form{display:block;width:100%;margin:0;padding:80px 0;position:relative;}
.footer_form::before{content:"";background-image:url("../images/banner-bg-left.png");background-repeat:no-repeat;
background-position:top left;background-size:contain;position:absolute;left:0;top:0;width:100%;height:100%;z-index:-1;opacity:0.5;}
.footer_form::after{content:"";background-image:url("../images/background-img.png");background-repeat:no-repeat;background-position:right bottom;background-size:contain;position:absolute;right:0;bottom:0;width:100%;height:438px;z-index:-1;opacity:0.5;}
.footer_form h3{display:block;width:100%;margin:0 0 20px;padding:0 0 30px 0;font-size:30px;color:var(--text-color);font-weight:600;line-height:1.2;}
.footer_form .reason-card{display:flex;justify-content:center;align-items:center;gap:20px;flex-direction:column;width:100%;margin:0;background-color:var(--white);border-radius:0px;padding:20px 20px;text-align: center;box-shadow:rgba(0, 0, 0, 0.24) 0px 3px 8px;height: 100%;}
.footer_form .reason-card p{display:block;font-family:"Inter", Sans-serif;font-size:14px;font-weight:400;line-height:1.3;color:var(--text-color);margin: 0;padding: 0;}
.footer_form .reason_box{display:flex;align-items:center;justify-content:center;max-width:60px;width: 60px;min-height:60px;height:60px;box-shadow:0px 4px 15px 4px rgba(17.999999999999996, 25.999999999999993, 31, 0.2);padding:10px 10px;line-height:0;}
.footer_form .reason_box img{width:50px;height:auto;box-shadow:none;}
.footer_form .quote_box{display:block;width:100%;margin:0;padding:40px 40px;background-color:var(--section_bg);box-shadow:none;border:0;}
.footer_form .quote_box h4{display:block;width:100%;text-align:center;color:var(--text-color);margin-bottom:20px;padding:0;font-size:30px;font-weight:600;line-height:1.2;}
.footer_form .quote_box .g-recaptcha{margin-bottom:20px;}
.footer_form .quote_box .form_group{display:block;width:100%;margin:0 0 20px;padding:0;}
.footer_form .quote_box .form_group .form_label{display:flex;font-size: 14px;font-weight: 600;line-height: 1;margin-bottom: 10px;padding: 0;color:var(--text-color);}
.footer_form .quote_box .form_group .form_label .required{display:inline;font-size: 14px;font-weight: 600;line-height: 1;margin-bottom: 10px;padding: 0;color:var(--main_color);}
.footer_form .quote_box .form_group .error-text{font-family:"Inter",Sans-serif;}
.footer_form .quote_box .form_group .form_drop {font-size: 14px;}
.footer_form .quote_box .form_group .form_drop:focus{border-color: black!important;}
.form_drop{background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath fill='black' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E");background-repeat: no-repeat;background-position: right 20px center;cursor: pointer;}

.footer{display:block;width:100%;background-color:#1c1c1c;color: var(--white);padding:60px 0px 0;}
.footer .footer_top{display:block;width:100%;margin:0;padding:0 0 30px;}
.footer .footer_links{display:block;width: 100%;margin: 0;padding: 0;}
.footer .footer_links h5{display:block;color:var(--section_bg);margin-bottom:20px;font-size:22px;line-height:35px;}
.footer .footer_links ul{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:10px;list-style:none;margin:0px !important;padding: 0;}
.footer .footer_links ul li{line-height:1;padding:0;}
.footer .footer_links ul li a{display:inline-flex;align-items:flex-start;justify-content:flex-start;gap:10px;color:#B4B4B4;line-height:1.5;font-size:14px;}
.footer .footer_links ul li a:hover{color:var(--white);transition:all .2s linear;text-decoration:none;}
.footer .footer_links ul li img {width: 20px;}
.footer .social_info{display: block;width:100%;padding:0 0;margin:20px 0 0;}
.footer .social_info ul.social{display:flex;align-items:center;justify-content:flex-start;gap:20px;padding:0;margin:0;}
.footer .social_info ul.social li{list-style: none;padding-bottom: 0;}
.footer .social_info ul.social li a{display: inline-flex;align-items:center;justify-content:flex-start;gap:20px;}
.footer .social_info ul.social li a img{width:20px;height: 20px;}
.footer .border_top{border-top:1px solid #404040;}
.footer .copyright{display: block;width: 100%;text-align:center;margin: 0;padding:20px 0 20px;}
.footer .copyright p{display:block;width:100%;margin:0 auto;padding:0;text-align:center;color:#b4b4b4;font-size: 16px;line-height: 1.5;}

.mainservices{display: block;width: 100%;margin: 0;padding:80px 0 0 0;}
.mainservices.main_blog{padding: 0 !important;}
.mainservices .headtitle{display:block;width:100%;text-align:center;padding:0px 0 20px;margin-bottom:20px;position:relative;font-family: "Inter", Sans-serif; font-size: 42px;font-weight: 800;text-transform: capitalize;line-height: 1.2em;color:var(--text-color);}
.mainservices .headtitle::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:block;width:100px;
height:4px;background-color:var(--main_color);}
.mainservices .comman_section{display: block;width: 100%;margin: 0;padding:40px 0 40px 0;}
.mainservices .bg-color{background-color: var(--section_bg);}
.mainservices .comman_section .button{margin-top:20px;}
.mainservices .comman_section p{display:block;width:100%;margin: 0;padding: 0;display: -webkit-box;overflow: hidden;-webkit-line-clamp: 5;-webkit-box-orient: vertical;font-size: 18px;font-family: "Inter", Sans-serif;font-size: 18px;font-weight: 400;line-height: 1.6em;color:var(--text-color);}
.mainservices .backend-img img {border-radius:20px;}

.quote-section {background-color: var(--white); padding: 40px 0 60px 0;}

.quote-line {position: relative;}
.quote-text { font-size: 33px;font-weight:600;color:#212529;padding:0 30px;max-width:100%;line-height:1.3;flex:1;}
.quote-icon {font-size: 60px;color: #8B0015;line-height: 0;}
.quote-icon-right{font-size: 60px;color: #8B0015;line-height: 0;position: absolute;bottom: 0;right: 0;}
.left-quote {margin-right: 10px;}
.right-quote {margin-left: 10px;}
.btn-quote {background-color: #8B0015;color: var(--white);font-weight: 600;padding: 0.5rem 1.5rem;border-radius: 0;text-transform: uppercase;font-size: 0.875rem;letter-spacing: 0.5px;border: none;}
.btn-quote:hover {background-color: #a31525;color: var(--white);}

.mainservices img {position:sticky;top:0;}
.mainservices h2 {font-size: 40px; font-weight: 600; color: var(--main_color); padding-bottom: 20px;}
.mainservices .main_service_title {font-size: 42px; font-weight: 800; text-transform: capitalize; color: #000000; text-align: center; padding-top: 95px; padding-bottom: 20px; position: relative;}
.mainservices b {font-weight: 700;}
.mainservices .container .img-radius {border-radius: 50% 50% 50% 50%;}
.mainservices button {margin-top: 10px; text-decoration: none; text-transform: uppercase; text-align: center; border: none; border-radius: 0; color: var(--white); background-color: var(--main_color); padding: 8px 25px; cursor: pointer; transition: all 0.3s ease;}
.mainservices button:hover {transform: scale(0.95);}
.mainservices button a {color: var(--white); font-size: 14px; font-weight: 600;}
.mainservices button a:hover {color: var(--white); text-decoration: none;}
.mainservices-content {width: 100%; padding-bottom: 80px; min-height: 400px;}
.mainservices .react-content{background: linear-gradient(180deg, var(--white) 0%, var(--section_bg) 100%);}
.mainservices .wp-service {padding-bottom: 80px;}
.mainservices .wordpress img {display: flex; border-radius: 20px; height: auto;}
.mainservices .wordpress-content h2 {font-weight: 600; color: #000000;}
.mainservices .wordpress-content p {display: block;}
.mainservices .wordpress-content b {font-weight: 700;}

.main_service_para {font-size: 18px; font-weight: 400; margin-bottom: 4px; line-height: 1.6em;}
.card-body {padding: 2rem 0;}
.frontend-services {display: block; margin: 0%; line-height: 1.6em;}
.frontend-services img {position: sticky;}
.grad-color {background: linear-gradient(180deg, var(--white) 0%, var(--section_bg) 100%);}
.frontend-services-content {width: 100%; background-color: #eeeeee; padding-bottom: 80px;}
.development {display: block; padding-top: 80px;}
.development h3 {font-size: 30px; font-weight: 600; color: var(--main_color); margin-bottom: 30px;}
.development p{margin-bottom:20px;}
.development ul{padding: 0;}
.development ul li span {font-size: 18px; line-height: 1.5;}
.development ul li span strong {font-weight: 800;}
.development .list ul li {padding-bottom: 10px;}
.development .list-other ul li {padding-bottom: 10px;}
.list-other{display: block;width: 100%;position:sticky;top: 0;}
.list-other ul li a {font-size: 20px; font-weight: 600; position: relative; display: block; padding: 10px 20px; color: #000000; text-decoration: none;}
.list-other li a::after {content: ""; position: absolute; top: 0; left: 0; background-color: var(--main_color); width: 5px; height: 45px;}
.list-other li a:hover, .list-other ul li a.active {color: var(--main_color);}
.related-projects {display: block;padding-top: 10px;}
.related-projects h2{display:block;width:100%;text-align:left !important;font-size:28px;font-weight:600;line-height:1.2;color:#151619;display:-webkit-box;line-clamp:1;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;padding:0;margin-bottom:20px;}
.project-details {display: block; width: 100%; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5); padding: 20px;}
.projectimg img {border-radius: 0;}
.project-data a i {background-color: var(--main_color); color: var(--white); border-radius: 50%; display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; font-size: 12px;}
.project-details h3{display:block;font-size:18px;font-weight:600;line-height:1.2;display:-webkit-box;line-clamp:1;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;padding:0;margin:0 0 10px 0;}
.project-details p{display:block;font-size:14px;line-height:1.5;color: var(--text-color); font-weight:400;padding:0px;display:-webkit-box;line-clamp:3;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:20px;min-height:63px;}
.titles {display:flex;justify-content:flex-start;align-items:flex-start;width:100%;gap:10px;margin-bottom:20px;flex-wrap:wrap;min-height: 66px;}
.htmltitle {background-color: #574E50; padding: 05px 10px; width: max-content;}
.htmltitle span{display: block;font-size:12px;font-weight:500;color:var(--white);padding-bottom: 0;}
.project-details button{margin-top:0px;}
.faq .accordion button:hover {transform: none;}
.faq {padding:50px 0 80px 0;}
.faq.home-page{padding: 40px 0px !important;}
.faq img {border-radius: 0;}
.faq .accordion-item {border: none;}
.faq .accordion-button {padding: 13px 30px 13px 30px; background-color: var(--white); color: #000000; font-weight: 700; font-size: 16px; border: solid var(--main_color) 1px; text-transform: none; margin-top: 10px; text-align: left; border-radius: 0 !important;}
.faq .accordion-body {background-color: var(--white); color: #000000; font-size: 16px; border: solid var(--main_color) 1px; border-top: 0; will-change: height;}
.faq .accordion h2 {padding: 0%;}
.faq .accordion-button:focus {box-shadow: none;}
.faq .accordion-button:hover {color: var(--main_color);}
.faq .accordion-button::after {background-image: url(../images/Vector.svg);  height: 0.9rem;}
.faq .accordion-button:not(.collapsed)::after {transform: rotate(-50%);}
.faq .headtitle{display: block;width: 100%;text-align: center;padding: 0px 0 20px;position: relative;font-family: "Inter", Sans-serif;font-size: 42px;font-weight: 800;text-transform: capitalize;line-height: 1.2em;color: var(--text-color);}
.faq .headtitle::after{content: '';position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);display: block;width: 100px;height: 4px;background-color: var(--main_color);}
.ourwork h2 {text-align: center; padding-bottom: 50px;}
.ourwork-details {display: block; background-color: #eeeeee; padding: 40px;}
.ourprojects {display: block; margin-top: 40px; margin-bottom: 40px; height: 100%;}
.projectimg { align-items: center;width: 100%; height: 100%; position: relative; margin:0 0 20px 0;padding:0 0;}
.projectimg img {padding: 0 !important; position: relative; display: flex; justify-content: center; align-items: center;}
.projectimg .ribbon { position: absolute;left: -10px;background: #f4b400; color: white;font-weight: bold;font-size: 14px;padding: 6px 15px;border-radius: 2px 2px 2px 0;font-family: Arial, sans-serif;box-shadow: 0 2px 4px rgba(0,0,0,0.2); content:'';top: 0 !important;}
.projectimg .ribbon::after{content: "";position: absolute;bottom: -8px;left: 0;width: 0;height: 0;border-top: 8px solid #d49a00; border-left: 10px solid transparent;}
.projectimg .ribbon:hover{transform: none !important;}
.projectimg .ribbon2:hover{transform: none !important;}
.projectimg .ribbon2 {position: absolute;top: 0;right: -10px; background: #f4b400; color: white;font-weight: bold;font-size: 14px;padding: 6px 15px;border-radius: 2px 2px 0 2px; font-family: Arial, sans-serif;box-shadow: 0 2px 4px rgba(0,0,0,0.2); content: '';}
.projectimg .ribbon2::after{content: "";position: absolute;bottom: -8px;right: 0; width: 0;height: 0; border-top: 8px solid #d49a00;border-right: 10px solid transparent; }
.projectimg .project_name::after {position: absolute;top:29px;left:7px; content: attr(data-title); font-weight: 600; display: block; width: 100%;margin: 0; padding: 0; font-size: 15px; color: var(--white); line-height: 1.4; transform: rotate(-48deg); letter-spacing: 0.6px;}
.projectimg .project_name2 {display: flex; justify-content: center; align-items: center; position: relative; font-weight: 600; display: block; width: auto; margin: 0; padding: 0; font-size: 18px; color: #000; line-height: 1.4;}
.projectimg .project_name2::after {position: absolute; top: 60px; right: 14px; content: attr(data-title); font-weight: 600; display: block; width: auto; margin: 0; padding: 0; font-size: 15px; color: var(--white); line-height: 1.4; transform: rotate(47deg); letter-spacing: 0.6px;text-transform:capitalize;}
.ourprojects .chatdocx {position: relative;}
.ourprojects .nutrify {position: relative;}
.ourprojects .chatdocx {background: linear-gradient(80.65deg, #BACCE9 -0.38%, #BDDDEC 33.06%, #BFE6EE 49.77%, #E6F2F2 66.49%); background-size: 70%; position: relative; transform: rotate(0deg); background-repeat: no-repeat;}
.data {display:block;width:100%;backdrop-filter: blur(20px); padding:30px 50px;height: 100%;}
.data h2 {color: #000000; font-weight: 600; font-size: 36px;}
.data h5 {color: #000000; font-weight: 500; font-size: 20px; padding-bottom: 20px;}
.data p {display: block; padding-bottom: 20px;}
.nutrify-btn button a {color: var(--text-color);}
.nutrify-btn button a:hover {color: var(--text-color);}
.ourprojects .nutrify {background: linear-gradient(80.65deg, #BACCE9 -0.38%, #BDDDEC 33.06%, #BFE6EE 49.77%, #E6F2F2 66.49%); position: relative; top: 0px; right: 0; background: linear-gradient(80.65deg, #f6fbf6, #ebf5eb 50%, #e6f1e6 75%, #e1eee0); background-size: 70%; transform: rotate(0deg); background-repeat: no-repeat; background-position: right;}
.webproducts {display: block; margin-top: 40px; margin-bottom: 40px; height: 100%;}
.greybg {background-image: url(../images/wp-bg-grey.webp); background-repeat: no-repeat; background-size: cover; background-position: center; position: relative;}
.web-data {display: block; padding-left: 50px; padding-right: 50px; padding-top: 30px; padding-bottom: 30px; flex-direction: column;}
.web-data h2 {color: #000000; font-weight: 600; font-size: 28px; margin-bottom: 20px;}
.web-data h5 {color: #000000; font-weight: 500; font-size: 20px; padding-bottom: 20px;}
.web-data p {display: block; padding-bottom: 20px;}
.web-data p:first-of-type{display: block; padding-bottom: 0px !important;}

.skills { display: flex; flex-wrap: wrap; gap: 10px; padding: 30px 0px; }
.skill-title { display: block; width: 100%; margin: 0 0 0; padding: 0;}
.skill-title h3{font-weight: 600; font-size: 18px;}
.skills span { display: inline-flex; justify-content: center; align-items: center; gap: 2px; padding: 8px 20px; border: 0; text-decoration: none; background: rgba(255, 255, 255, 0.2); border-radius: 8px; box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); backdrop-filter: blur(5px); border: 1px solid rgba(255, 255, 255, 0.3);  color: rgba(0, 0, 0, 0.8); font-size: 14px; font-weight: 600; letter-spacing: 2px; cursor: pointer; text-transform: capitalize; line-height: 1.2;}
.skills span svg{min-width: 18px  !important;margin-top: 2px;}
.skills span:hover { background-color: rgba(255,255,255,0.4); cursor:default; }

/* .web-data .skill-section{display: flex; gap: 7px; flex-wrap: wrap;padding-top: 20px;}
.web-data .skill-section .skill{padding: 4px 13px; font-size: 13px; color: #F3F4F6; background: linear-gradient(135deg, #6B7280, #374151);justify-content: center;align-items: center;display: flex;border-radius: 5px;} */
.webproducts2 {display: block; margin-top: 40px; margin-bottom: 40px; height: 100%;}
.webproducts2 .web-data{margin-top: 35px;}
.redbg {background-image: url(../images/wp-bg-red.webp); background-repeat: no-repeat; background-size: cover; background-position: center; position: relative;}
.number .pagination .page-link {display: flex; align-items: center; justify-content: center; padding: 10px 10px; margin: 0; border: 1px solid #ddd; border-radius: 5px; text-decoration: none; width: 36px; height: 36px; outline: none; font-size: 18px; font-weight: 600; line-height: 1.2; cursor: pointer;}
.number .page-item {display: flex; gap: 10px;}
.number .pagination .page-link {color: #000000; font-weight: 600;}
.number .pagination .active {background-color: var(--main_color); color: var(--white); font-weight: 900;}
.number .pagination .page-link:hover {background-color: var(--main_color); color: var(--white); font-weight: 900;}
.project-pro {display: contents; width: 100%;}
.php-development {display: block; padding-bottom: 80px;}
.php-img img {border-radius: 0px;}
.php-development p {display: block; font-size: 18px;}
.why-php {display: block; background-color: #eeeeee; padding: 40px 40px 40px 40px;}
.why-php h2 {color: #000000; font-size: 42px; font-weight: 800;}
.php-content {position: relative;}
.php-content h2::after {content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); display: block; width: 100px; height: 4px; background-color: var(--main_color);}
.php-p {width: 50%;}
.p-data {width: 40%; display: block;}
.php-p p {padding-top: 20px; display: block;}
.full-container {display: block; background-color: var(--white); padding: 20px; min-height: 200px;}
.gif-img img {width: 30px; height: 30px; border-radius: 0px;}
.full-container .head-line h2 {font-size: 22px; color: var(--main_color); padding-top: 10px; padding-bottom: 10px;}
.full-container .head-line a {color: var(--main_color);}
.head-line p {display: block;}
.tags {display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px;}
.tagname p {padding: 5px 10px 5px 10px; background-color: #574E50; color: var(--white); width: 100%;}
.custom {background-color: var(--main_color); color: var(--white);}
.custom {background-color: var(--main_color); color: var(--white); padding: 30px;}
.custom h5, .custom2 h5 {font-weight: 600; font-size: 22px; padding-bottom: 15px;}
.custom ul, .custom2 ul{padding: 0;}
.custom p,.custom ul li, .custom2 ul li, .custom2 p {font-size: 14px; padding-bottom: 10px;}
.custom ul li span strong, .custom2 ul li span strong {font-weight: 700;}
.custom ul li span, .custom2 ul li span{position:relative;padding-left:14px;}
.custom ul li span::after {content: ''; position: absolute;top:7px;left:0; transform: translateX(-50%); display: block; width: 8px; height: 8px; background-color: var(--white); border-radius: 100%;}
.custom2 {border: #000000 solid 2px; padding: 30px;background-color: #FFFFFF;}
.custom2 ul li span::after{content: '';position:absolute;top:7px;left:4px; transform:translateX(-50%);display:block;width:8px;height:8px;background-color: #000000; border-radius: 100%; -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); }
.other-services {position: sticky; top: 100px;}
.other-services h3 {color: var(--main_color); font-size: 30px; font-weight: 600; padding-bottom: 20px;}
.other-services .other-list ul li {padding-bottom: 15px;}
.other-services ul{padding: 0;}
.project-data a i:hover {background-color: #000000;}
.other-services ul li a {font-size: 20px; font-weight: 600; position: relative; display: block; padding: 10px 20px; color: #000000; text-decoration: none;}
.other-services li a::after {content: ""; position: absolute; top: 0; left: 0; background-color: var(--main_color); width: 5px; height: 45px;}
.other-services li a:hover, .other-services ul li a.active {color: var(--main_color);}
.why-choose-section {background-image: url("../images/subtle-white-feathers.webp"); position: relative;}
.bg-maroon {background-color: #800000;}
.why-choose {display: block; position: relative; margin-bottom: 30px;}
.why-choose h3 {font-size: 26px; font-weight: 600; padding-bottom: 10px;}
.divide {width: 100%; border: #000000 solid 1px;}
.why-numeric {position: absolute; right: 0; bottom: -30px;}
.why-numeric span {font-size: 100px; font-weight: 600; color: #1615190f;}
.why-choose-2 {margin: 0;}
.whychoose-img {position: sticky; top: 100px; display: flex;}
.transflo {background-image: linear-gradient(90deg, #8801FF 0%, #000000 100%);}
.bmi {background-color: #7B9B9B;}
.transflo-details, .bmi-details {min-height: 690px;}
.bottom-line {font-weight: 900; font-size: 12px; line-height: 18px; margin-top: 40px; text-align: center;}
.main_contact{padding:80px 0}
.contact {display: block; position: relative;}
.contact::after{position: absolute; content: ''; background-image: url("../images/contact-bg.svg"); background-repeat: no-repeat; background-position: right bottom ; background-size: 100%; bottom: -16px; right: 40px; width: 300px; height: 100%; z-index: -1;}
.contact-form {padding: 40px; background-color: #eee; min-height: 590px;}

.pagination_bar{display: block;width: 100%;margin: 0 0 40px;}
.pagination_bar .pagination{justify-content: center;}
.pagination_bar .pagination .page-item{padding:0 0;margin:0 4px;line-height:1;width: 30px;height: 30px; }
.pagination_bar .pagination .page-link{color: #000;background-color:#fff;border: 1px solid #dee2e6; margin:0;display:flex;justify-content:center;align-items:center;padding:10px 10px;border-radius:4px;-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;line-height:1;font-size: 16px;width:32px;height: 32px;}
.pagination_bar .pagination .page-item.active .page-link {z-index: 0; background-color: #8B1C2B !important;border-color: #8B1C2B !important;color: #fff !important;font-weight: bold;box-shadow: none !important;}
.pagination_bar .pagination .page-link:hover,
.pagination_bar .pagination .page-link:active,
.pagination_bar .pagination .page-link:focus{background-color:#f0f0f0;color: #000;box-shadow: none;outline: none;}

.contact-form h2 {font-size: 28px; font-weight: 800; color: #000000; line-height: 1em;}
.contact-form .asterisk{color: #9b1b34;}
.contact .form-part{padding-bottom: 255px; justify-content: space-between;}
.contact .form-label {font-weight: 600; font-size: 15px;}
.col-half {width: 50%; max-width: 100%;}
.contact textarea {width: 100%; border: 1px solid var(--main_color); border-radius: 0px; height: auto;}
.contact input {width: 100%; border: 1px solid var(--main_color); border-radius: 0px;}
.contact .form-control:focus {box-shadow: none; border: #000000 solid 1px;}
.contact-btn button {width: 100%;}
.con-data {background-color: #000000; padding: 40px; margin-bottom: 50px;}
.con-data h2 {font-size: 28px; font-weight: 800; line-height: 1em; color: var(--section_bg);margin-bottom: 20px;}
.con-data span {font-size: 17px; font-weight: 400; line-height: 1.6em; color: #B4B4B4;}
.con-icon {display: flex; margin-bottom: 20px;}
.con-icon i, .con-social i {color: var(--main_color); margin-right: 20px;}
.con-icon a {color: #000000; font-size: 14px; font-weight: 500; line-height: 1.5;}
.con-icon a:hover {color: var(--main_color);}
.con-social {margin-top: 50px;}
.con-social h2 {font-size: 24px; font-weight: 800; line-height: 1em; color: #000000;}
.map {background-color: #eee; padding-top: 40px; padding-bottom: 40px;}
iframe {border-radius: 0;width: 100%;}
.ast-row {margin-bottom: 40px; margin-top: 40px;}
.blogs {background-color: #eee; padding:80px 0}
.blog-details {background-color: var(--white); margin-bottom: 28px;}
.blog-text {padding: 21px;}
.blog-text p {overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; text-overflow: ellipsis; margin-bottom: 20px; white-space: normal;}
.blog-details .blog-text h2 {font-size: 18px;}
.blog-details .blog-text h2 a {font-weight: 600; color: #000000;}
.blog-details .blog-text h2 a:hover {color: var(--main_color);}
.blog-details .readmore a {color: var(--main_color);}
.blog-details .readmore a:hover {color: #B4B4B4;}
.blog-img {text-align: center;}
.blog-details .blog-img img {border-radius: 0px !important; width: 100%; opacity: 1; display: block; transition: .5s ease; backface-visibility: hidden; object-fit: inherit;}
.blog-details .blog-img img:hover {transform: scale(1.05); opacity: 0.8;}
.recent-post {display: block; padding: 36px; background-color: var(--white); margin-top: 80px; margin-bottom: 80px; position: sticky; top: 100px;}
.recent-post h2 {font-size: 1.7rem; color: #000000; font-weight: 800; margin-bottom: 20px;}
.recent-post ul{padding: 0;;}
.recent-post ul li {position: relative; padding-left: 20px; margin-bottom: 25px; padding-bottom: 0;}
.recent-post ul li a {font-size: 14px; line-height: 1; margin-bottom: 0; color: #000000;}
.recent-post ul li::before {content: ""; position: absolute; left: 0; top: 0; height: 100%; width: 4px; background: var(--main_color);}
.bg-row {background-color: var(--white); padding: 40px; margin-top: 80px; margin-bottom: 80px;}
.bg-row h1 {font-size: 24px !important; font-weight: 600; color: #000000; text-align: left; padding: 0;}
.bg-row h1::after {content: none;}
.bg-row img {width: 100%; height: 400px; margin-bottom: 28px;}
.bg-text p {margin-bottom: 1.6em; font-size: 14px; font-weight: 400; line-height: 1.85714285714286;}
.bg-text p a {color: var(--main_color);}
.bg-text p b {font-weight: 700;}
.prenext-btn {display: flex;}
.bg-row .pre-btn a, .next-btn a {color: var(--main_color);}
.next-btn {text-align: right;}

.wordpress-data {background-color: #eee; padding-bottom: 40px; padding-top: 40px;}
.wp-theme {flex-wrap: wrap; background-color: var(--white); padding-top: 40px; padding-bottom: 60px; padding-left: 20px; padding-right: 20px; position: relative; height: 245px;}
.wp-theme h2 {font-size: 22px; font-weight: 700; padding: 0;}
.wp-theme p {display: block; font-size: 14px; line-height: normal;}
.wp-number {position: absolute; bottom: 0; right: 0;}
.wpline {border: #000000 solid 1px; margin-top: 10px; margin-bottom: 10px;}
.wp-number h2 {font-size: 100px; font-weight: 600; color: #CB0B320D;}
.why-cumulative img {border-radius: 0;}
.php-text a, .flutter-content a {color: var(--main_color);}
.mob-ios {padding-bottom: 20px;}
.ios-content .ios-img img {border-radius: 0;}
.ios-content h3 {font-weight: 600; font-size: 30px; line-height: 36px; padding-bottom: 20px;}
.ios-content p {font-size: 18px; display: block;}
.project-show {background-color: #eee; padding-bottom: 40px; padding-top: 40px; margin-top: 80px;}
.project-show h1 {padding-top: 0;}
.showcase-details {padding: 40px; background-color: #dddddd;}
.showcase-details h3 {font-size: 30px; font-weight: 600; text-align: center;}
.project-show .card {display: block; padding: 20px; margin-top: 20px;}
.project-show .card p {display: block;}
.project-show .card .image-box {display: flex;gap:20px;justify-content:flex-start;}
.project-show .card .image-box img { border-radius:0; margin:0px; position:unset; max-width:45px; max-height: 45px; height:auto;}
.project-show .card .data-box h5 {color: var(--main_color); font-size: 20px; font-weight: 600; margin-bottom: 10px;}
.project-show .card .data-box p {font-size: 14px; font-weight: 400; line-height: 18px; color: var(--text-color);}
.de {display: flex; flex-direction: column; justify-content: center;}
.ios .title {width: 70%; margin: auto;}
.ios-1, .ios-2 {height: 100%;}
.ios-1 ul, .ios-2 ul{margin-bottom:0;}

.cumulative-app {background-color: #000000; padding: 30px; text-align: center; color: var(--white);}
.android-title {width: 100%; text-align: center; padding-bottom: 20px;}
.ai-data {display: flex; margin-bottom: 40px;flex-wrap: wrap;}
.ai-data img {border-radius: 0;}
.ai-data p {font-size: 18px;}
.api-development{padding-bottom: 40px;}
.how-ai {background-color: #eee; padding-top: 40px; padding-bottom: 40px;}
.how-ai .title {padding-bottom: 40px;}
.how-ai .title h1 {padding-top: 0; margin-bottom: 15px;}
.how-ai .title p {text-align: center; width: 59%; margin: auto;}
.how-ai .title p a {color: var(--main_color);}
.ai-development {display: flex; flex-wrap: wrap;}
.card-ai {padding: 40px; position: relative; margin-bottom: 20px; min-height: 200px; max-height: 100%;}
.number-ai {position: absolute; padding: 10px 14px 10px 14px; background-color: #000000; top: 10px; right: 10px;}
.number-ai p {font-weight: 900; color: var(--white);}
.card-ai-details h4 {margin-bottom: 10px; color: var(--main_color); font-weight: 600; font-size: 26px;}
.card-ai2 {width: 50%; margin: auto;}
.text-editor {width: 40%; margin: auto; padding-top: 20px; text-align: center;}
.nutrition-project {background-color: transparent; background-image: linear-gradient(90deg, #FF841C 0%, #B0FFB8 100%);}
.chat-docx {background-color: transparent; background-image: linear-gradient(90deg, #05204A 0%, #04A9AE 100%);}
.ainutrify-project, .aichat-project {min-height: auto;}
.chatgpt {row-gap: 20px;}
.chatgpt-data {height: 100%;}
.chatgpt-data ul{padding:0px;margin: 0;}
.custom ul li span{color: var(--white);}
.custom2 ul li span{color: var(--text-color);}

.laravel-custom ul{padding: 5px;margin: 0;}
.laravel-custom{min-height: 415px;}
.otherservices {margin-bottom: 80px;}
.other-data p {display: block; font-size: 18px;}
.other-img {display: flex; margin: auto;}
.other-img img {border-radius: 40px;}
.other-details {display: flex; align-items: center;}
.api-content {display: flex; flex-wrap: wrap; justify-content: center; row-gap: 20px;}
.api-services {background-color: var(--white); padding: 20px; height: 220px;}
.api-services h2 {font-size: 22px;}
.api-services p {font-size: 20px;}
.api-number p {background-color: #000000; color: var(--white); padding: 10px 14px 10px 14px; font-weight: 900; width: fit-content; margin-bottom: 10px; font-size: 14px;}
.api-services p a {color: var(--main_color);}
.api-services-2 {margin: auto;}
.fuct {display: flex; align-items: center; background-color: var(--white); padding: 10px; border: solid 2px black; margin-bottom: 20px;}
.fuct-num p {background-color: #000000; color: var(--white); padding: 10px 14px 10px 14px; font-weight: 900; width: fit-content; margin-right: 20px;}
.fuct h5 {font-size: 22px; font-weight: 600;}
.fuct-p {margin-bottom: 40px;}
.related-service h3 {text-align: center; font-size: 30px; font-weight: 600; padding-bottom: 30px;}
.apps-otherservice {display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; text-align: center; width: 80%; margin: auto;}
.apps-otherservice .otherservice-name {background-color: var(--main_color); padding: 5px 10px 5px 10px;}
.apps-otherservice .otherservice-name:hover {background-color: #000000; transition: all 0.3s ease;}
.apps-otherservice .otherservice-name.active {background-color: #000000;}
.apps-otherservice .otherservice-name span a {font-size: 16px; font-weight: 600; color: var(--white);}
.cicd-service {margin-top: 40px;}
.ci-cd {background-color:var(--white);padding: 30px; box-shadow: 0px 1px 16px 8px rgba(17, 17, 26, 0.1);height:318px;}
.ci-cd h2 {color: var(--main_color); font-weight: 700; font-size: 22px; text-align: left;}
.ci-cd-content {display: flex; gap: 10px; text-align: left;}
.cicd-faq li {position: relative; padding-left: 15px;}
.cicd-faq li::after {position: absolute; content: ""; top: 9px; left: 0; width: 5px; height: 5px; background-color: #000000; border-radius: 100%; transform: translateX(-50%);}
.cicd-line {text-align: center; font-size: 12px; margin-top: 40px; line-height: normal;}
.top-logo {display: flex; justify-content: center; flex-direction: row; gap: 20px; margin-bottom: 70px;}
.other-logo {display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 20px; border: solid 2px black; width: 100%;}
.host-logo {display: flex; gap: 20px; justify-content: center; flex-direction: row;}
.widely-logo {display: flex; align-items: center; justify-content: center; flex-direction: column; background-color: var(--white); box-shadow: 0px 1px 16px 8px rgba(17, 17, 26, 0.1); padding: 30px; width: 100%;}
.laravel-container {height: 230px;}
.laravel-details, .code-details {min-height: auto;}
.node-details {min-height: 652px;}
.node-custom {min-height: 449px;}
.benefits-node {position: relative; min-height: 210px; text-align: left;}
.benefits-node h3 {font-size: 22px; font-weight: 600; color: var(--text-color); margin-bottom: 10px;}
.benefits-node .divide {border: solid 1px #000000;}
.node-number {position: absolute; right: 0px; bottom: 0px;}
.node-number span {font-size: 100px; font-weight: 600; color: #1615190f;}
.e-commerce {padding: 30px; background-color: #000000; color: var(--white); text-align: left;}
.e-commerce h5 {padding-bottom: 20px; font-weight: 600; font-size: 22px;}
.e-commerce p {font-size: 14px; padding-bottom: 20px;}
.project-line p {position: relative; padding-left: 15px;}
.project-line p::after {content: ""; position: absolute; top: 8px; left: 0; width: 8px; height: 8px; background-color: var(--white); border-radius: 100%;}
.development-use {margin-bottom: 20px;}
.maintain {background-color: var(--main_color); color: var(--white); padding: 40px; text-align: left;}
.maintain img, .maintain2 img {display: block; margin: 0; padding-top: 10px; position: unset;}
.maintain2 ul li span .cancel-icon{height: 27px !important;}
.maintain h5 {font-size: 22px; font-weight: 600; margin-bottom: 20px;}
.maintain2 {background-color: var(--white); color: #000000; padding: 40px;}
.maintain2 h5 {font-size: 22px; font-weight: 600; margin-bottom: 20px;}
.app-data {height: 494px;}
.app-data ul{padding: 0px;line-height: 1.7;}
.chatdx {background-image: linear-gradient(90deg, #05204A 0%, #04A9AE 100%);}
.seyferry {background-image: linear-gradient(90deg, #E99F00 0%, #001F40 100%);}
.website-content {display: block; padding: 20px; background-color: var(--main_color); text-align: left; color: var(--white); height: 230px;}
.website-content .website-number span {background-color: var(--text-color); padding: 10px 14px 10px 14px; font-weight: 900;}
.website-content h2 {color: var(--white); font-size: 22px !important; font-weight: 700; padding-top: 15px; padding-bottom: 15px;}
.website-content p {font-size: 20px;}
.website-content-white {background-color: var(--white); color: #000000;}
.website-content-white h2 {color: var(--main_color);}
.website-number2 {color: var(--white);}
.website-content-black {background-color: #000000;}
.website-content .website-number3 span {background-color: var(--main_color);}
.service-include {padding: 20px; border: 2px black solid; height: 254px; text-align: left;}
.service-include h2 {font-size: 22px !important; font-weight: 700; color: var(--main_color); padding-bottom: 15px; padding-top: 15px;}
.service-include p {font-size: 20px;}
.service-include .service-number span {background-color: var(--text-color); padding: 10px 14px 10px 14px; font-weight: 900; color: var(--white);}
.how-ai2 .related-service {margin-top: 0;}
.payment-gateway {background-color: var(--white); padding: 20px; height: 375px;}
.payment-img {text-align: left; margin-bottom: 10px;}
.payment-gateway img, .crypto-payment img {border-radius: 0;width:auto;}
.payment-gateway .ci-cd-content, .crypto-payment .ci-cd-content {font-size: 14px;}
.crypto-payment {background-color: #eee; padding: 20px; height: 380px;}

.we-work {padding-top: 80px; padding-bottom: 60px;}

/* sidebar services style */
/* header end  */
/* slider start  */
.custom-slider {position: relative; width: 100%; background-image: url('../images/banner-bg-left.webp'); background-repeat: no-repeat; background-position: center center; background-size: cover; overflow: hidden; display: flex; align-items: center; justify-content: center;}
.custom-slider .slide {position: absolute; opacity: 0; transition: opacity 1s ease-in-out; width: 100%; display: flex; justify-content: center; align-items: center;}
.custom-slider .slide.active {opacity: 1; position: relative;}
.custom-slider .slide .slide-content {width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 0px 30px 40px 55px; background: rgba(255, 255, 255, 0.95); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);}
.custom-slider .slide .slide-content .text {flex: 1.3;}
.slider_img {display: block; width: 100%;position: relative; z-index: 1; min-height: 100%;}
.slider_img::before {position: absolute; content: ''; background-image: url("../images/banner-bg-left.webp"); background-repeat: no-repeat; background-position: top left; background-size: contain; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;}
.slider_img::after {position: absolute; content: ''; background-image: url("../images/background-img.webp"); background-repeat: no-repeat; background-position: bottom right; background-size: contain; bottom: 0; right: 0; width: 40%; height: 100%; z-index: -1;}

.custom-slider .slide .slide-content .text h2 {display: block; width: 100%; font-size: 40px; font-weight: 800; line-height: 1.3;}
.custom-slider .slide .slide-content .text h2 strong {color: var(--main_color); font-weight: 800; font-size: 40px; line-height: 1.3; display: block;}
.custom-slider .slide .slide-content .text p {font-size: 20px; color: #444; margin: 20px 0; line-height: 1.6; font-weight: 400;}
.custom-slider .slide .slide-content .text p b {font-weight: 700;}
.hello {background-color: var(--main_color); color: var(--white); padding: 13px 25px 12px; font-weight: 600; text-decoration: none; border-radius: 2px; font-size: 14px; align-items: center; justify-content: space-between; border: none;}
.hello:hover {color: var(--white); transform: scale(0.95); transition: all 0.3s ease;}
.custom-slider .slide .slide-content .text button {background-color: var(--main_color); color: var(--white); padding: 13px 25px 12px; font-weight: 600; text-decoration: none; border-radius: 2px; font-size: 14px; align-items: center; justify-content: space-between; border: none;}
.custom-slider .slide .slide-content .text button:hover {color: var(--white); transform: scale(0.95); transition: all 0.3s ease;}
.custom-slider .slide .slide-content .image {flex: 1; text-align: right;}
.custom-slider .slide .slide-content .image img {max-width: 100%; height: 470px; margin-top: 30px; width: 100%; opacity: 0; transition: opacity 10s ease-in-out;}
.custom-slider .slide.active .image img {opacity: 1;}
.custom-slider .slider-controls {position: absolute; bottom: 80px; left: 50%; transform: translateX(-50%);}
.custom-slider .slider-controls button {background: #000; color: var(--white); border: none; padding: 6px 12px; margin: 0 5px; cursor: pointer; font-size: 20px; border-radius: 4px;}
.text.fade-in-up {opacity: 0; transform: translateY(30px); animation: fadeInUp 2s forwards ease;}
.text.fade-out-down {opacity: 1; transform: translateY(0); animation: fadeOutDown 0.8s forwards ease;}

.section-title {font-family: "Inter", Sans-serif; font-size: 42px; font-weight: 800; text-transform: capitalize; padding: 70px;}



.play-button-box {position: absolute; right: 0; bottom: 0%; top: -75px; transform: translate(50%, 50%); width: 80px; height: 80px; background-color: var(--white); border-radius: 20px; display: flex; justify-content: center; align-items: center; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);}
.play-button {width: 40px; height: 40px; background-color: #111; border-radius: 50%; display: flex; justify-content: center; align-items: center; cursor: pointer; position: relative;}
.play-button i {color: var(--white); font-size: 20px; margin-left: 2px;}
.video-modal {display: none; position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0, 0, 0, 0.8);}
.video-content {position: relative; margin: 5% auto; width: 80%; max-width: 800px;}
.embed-responsive {position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;}
.embed-responsive iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.close {position: fixed; top: 20px; right: 20px; width: 40px; height: 40px; background-color: #000; color: var(--white); font-size: 24px; line-height: 40px; text-align: center; border-radius: 50%; cursor: pointer; z-index: 1050; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); transition: background-color 0.3s ease;}
.close:hover {background-color: #444;}
.section-title {font-size: 2rem; font-weight: bold;}
.underline {width: 80px; height: 3px; background-color: var(--main_color); margin: 10px auto 0;}
.main {background-color: var(--section_bg);}
.expertise-card {background-color: var(--white); box-shadow: 0px 4px 10px rgba(0,0,0,0.1); transition: transform 0.3s ease-in-out;}

.heading h2 {font-weight: bold; font-size: 42px; line-height: 1.2em;}
.expertise-card:hover {transform: translateY(-5px);}
.btn-danger {background-color: var(--main_color); border: none;}
.btn-danger:hover {background-color: var(--main_color);}

.underline {width: 60px; height: 4px; background: var(--main_color);}


.icon-box img {width: 50%; height: 75%; object-fit: contain; border-radius: 50%; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);}

.service-card h4 {font-size: 30px; font-weight: 800;}
.icon-box i {font-size:30px;}
.btn-custom {display: block; width: max-content; padding: 10px 25px; background-color: var(--main_color); color: var(--white); font-size: 15px; font-weight: bold; text-transform: uppercase; white-space: nowrap; border: none; margin: 15px auto 0 auto; text-align: center;}
.btn-custom:hover {background-color: var(--main_color); color: var(--white);}
.icon-circle {padding:15px;width: 60px; height: 60px; background-color: var(--main_color); color: var(--white); display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 28px;}

.underline {width: 100px; height: 3px; background-color: var(--main_color);}
.process-icon {width: 40px; height: 40px; background-color: var(--main_color); color: var(--white); display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 20px;}
.devider {border-color: var(--main_color) !important;}

.truster-global {background-color: var(--section_bg);}

.title {font-size: 30px; font-weight: 700;}
.list-unstyled {padding: 10px 10px;}
.clients-section {padding: 60px 0; text-align: center;}
.clients-section h2 {font-weight: bold; margin-bottom: 20px;}
.underline {width: 80px; height: 4px; background-color: var(--main_color); margin: 0 auto 40px; border-radius: 2px;}
.carousel-item img {max-height: 120px; margin: auto; object-fit: contain; filter: grayscale(20%); transition: transform 0.3s, filter 0.3s;}
.carousel-item img:hover {transform: scale(1.05); filter: grayscale(0%);}
.underline {width: 100px; height: 3px; background-color: var(--main_color);}


.form {padding: 0% 0px;}

.form-control, .input-group-text, .form-label {border-color:var(--main_color);border-radius:0;}
.form-control:focus {box-shadow: none; border-color: var(--main_color);}
.upload-btn {background-color: var(--main_color); color: var(--white); cursor: pointer;}
.upload-btn:hover {background-color: #7b0b1f;}
.submit-btn {background-color: var(--main_color); color: var(--white); border: none;}
.footer-contact {color: var(--white);}
.footer-details {background-color: black; padding:20px 20px !important;margin: 0;}
.footer-contact a {color: var(--white); text-decoration: none;}
.footer-contact a:hover {text-decoration: underline;}
.custom-close-button {background-color: #000; color: var(--white); border: none; border-radius: 50%; width: 32px; height: 32px; font-size: 20px; line-height: 24px; text-align: center; padding: 0; cursor: pointer;}
.custom-close-button:hover {background-color: #333;}
.cont-form{padding:30px;}
.modal-footer{padding: 30px 0px 0px 0px !important;}
/* About Section */
.about-section {margin-top: 20px;}
.content-text { padding-top: 40px;}
.about-title {color: var(--main_color);}
.section-title {font-size: 2.5rem;font-weight: 700;text-transform: uppercase; margin-bottom: 20px; color: #000;}
.main-heading { font-size: 62px;line-height: 1.3;font-weight: 800;font-family: "Inter", Sans-serif;color: var(--main_color);padding-left: 100px;margin: 0;padding-top: 20px;padding-bottom: 20px;  text-transform: capitalize;}
.paragraph-block {margin-bottom: 40px;padding: 0% 100px;}
.working-box{width: 220px;}
.title-underline {width: 80px;height: 4px;}
.section-divider { height: 1px; background-color: #d3d3d3; /* Light gray */ width: 100%;}
.icon-container { width: 90px; height: 90px; transition: transform 0.3s ease; display: flex; align-items: center;justify-content: center;margin-top: -90px;}
.icon-container i {font-size: 1.5rem;}
.service-title {font-size: 17px;font-weight: bold;}
.ecommerce-bg {background-color: #a71e34;}
.b2b-bg {background-color: #333;}
.automobile-bg {background-color: #a71e34;}
.healthcare-bg {background-color: #333;}
.sports-bg {background-color: #a71e34;}
.hotel-bg {background-color: #333;}
.education-bg {background-color: #a71e34;}
.travel-bg { background-color: #333;}
.realestate-bg { background-color: #a71e34;}

/* About redesign */
.about_section {padding:80px 0px;}
.about_section .headtitle{display:block;width:100%;text-align:center;padding:0px 0 20px;margin-bottom:20px;position:relative;font-family: "Inter", Sans-serif; font-size: 42px;font-weight: 800;text-transform: capitalize;line-height: 1.2em;color:var(--text-color);}
.about_section .headtitle::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:block;width:100px;
height:4px;background-color:var(--main_color);}
.about_section .about_img {position: relative;}
.about_section .about_img .about_us_image {transform: rotate(-2deg);transition: transform 0.5s;}
.about_section .about_img .about_us_image:hover {transform: rotate(0deg) scale(1.05);}
/* Floating Circles inside Image Wrapper */
.about_section .about_img .floating_circle {position: absolute;border-radius: 50%;opacity: 0.15;}
.about_section .about_img .circle-top-left {width: 120px;height: 120px;top: -20px;left: -20px;background-color: #0d6efd;}
.about_section .about_img .circle-bottom-right {width: 80px;height: 80px;bottom: -10px;right: -10px;background-color: #6c757d;opacity: 0.1;}
.about_section .about_us_content .about_us_title {font-weight: 700;margin-bottom: 24px;line-height: 1.2;font-size: 32px;}
.about_section .about_us_content {padding:40px;}
.about_section .about_us_content .about_us_title span {color: #9b1b34;font-weight: 600;}
.about_section .about_us_content .about_us_text {font-size: 17px;color: #555;margin-bottom: 16px; font-family:"Inter", Sans-serif;}
.our_mission{display: block;width: 100%;background-color:#EEEEEE;position: relative;z-index: 1;padding:60px 0px;margin: 0;}
.our_mission .our_card {background: #fff;border-radius: 22px;box-shadow: 0 6px 20px rgba(0,0,0,0.1);transition: all 0.4s ease;position:relative; overflow:hidden;height:100%;padding:30px;}
.our_mission .our_card p{font-size:18px;margin-top:23px;font-family:"Inter", Sans-serif; color:var(--text-color);}
.our_mission .our_card:hover {transform: translateY(-10px);box-shadow: 0 15px 40px rgba(140, 29, 47, 0.25);}
.our_mission .our_card::before {content: "";position: absolute;inset: 0;border-radius: 22px;padding: 2px;background: linear-gradient(45deg, #8c1d2f, #ff4d6d, #8c1d2f);-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);-webkit-mask-composite: xor;mask-composite: exclude;opacity: 0;transition: opacity 0.5s ease;}
.our_mission .our_card:hover::before {opacity: 1;}
.our_mission .our_card .our_title {font-size:30px; font-weight:500; justify-content:center;display:flex; font-family:"Inter", Sans-serif;}
.our_mission .our_card .mission_list{list-style:none;padding:0; margin-top:20px; justify-content:center;display:grid}
.our_mission .our_card .mission_list li{display:flex; font-family:"Inter", Sans-serif;align-items: flex-start;margin-bottom: 10px;font-size: 18px;}
.our_mission .our_card .mission_list li i{color:#9b1b34; margin-right:8px; margin-top:3px}
.our_mission .icon_circle {width: 90px;height: 90px;border-radius: 50%;background: linear-gradient(135deg,#9b1b34,#ff4d6d);color: #fff;display: flex;align-items: center;justify-content: center;margin: auto;font-size: 30px; box-shadow: 0 8px 18px rgba(126, 20, 38, 0.73);}
.pulse {animation: pulseAnim 2s infinite;}

.about-hero{padding: 40px 0px;background: var(--bs-dark);}
.about-hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:45px 45px;opacity:.4;}
.about-hero .about-tag{padding-bottom: 3px; color: var(--badge-bg);font-size: 16px;text-transform: uppercase;letter-spacing: 3px;font-weight: 700;border-bottom: 2px solid var(--main_color);}
.about-hero .about-title{display: block;width: 100%;font-size: 37px;font-weight: 800;line-height: 1.3;margin-bottom: 20px;}
.about-hero .about-title span{color: var(--white);font-weight: 800;}
.about-hero .about-desc{color:var(--section_bg);font-size:20px;line-height:1.8; }
.about-hero .team-image{border:2px solid var(--gray-light);padding:10px;}
.about-hero .team-image img{width:100%;display:block;}

.about-tech{background:#EEEEEE;padding: 40px 0;}
.about-tech h2{display: block;width: 100%;text-align: center;padding: 0px 0 20px;margin-bottom: 20px;position: relative;font-family: "Inter", Sans-serif;font-size: 42px;font-weight: 800;text-transform: capitalize;line-height: 1.2em;color: var(--text-color);}
.about-tech h2::after {content: '';position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);display: block;width: 100px;height: 4px;background-color: var(--main_color);}
.about-tech .tech_used .tech_icons_container{padding-bottom: 30px}
.about-tech .tech_used .tech_icons_container .technology-title{color: var(--main_color);text-transform: uppercase;font-size: 16px;font-weight: 600;margin-bottom: 25px;}
.about-tech .tech_used .tech-card{background:var(--white);border:1px solid var(--bs-gray);border-radius:10px;padding:25px;height:100%;transition:.35s ease;position:relative;overflow:hidden;box-shadow:0 10px 25px rgba(0,0,0,.05);}
.about-tech .tech_used .tech-card::before{content:"";position:absolute;left:0;top:0;width:5px;height:100%;background:var(--main_color);transition:.35s;}
.about-tech .tech_used .tech-card:hover{border-color:var(--main_color);}
.about-tech .tech_used .tech_icons_container .tech_icon{display:flex;flex-wrap:wrap;gap:10px;}
.about-tech .tech_used .tech_icons_container .tech_icon .icon{display:flex;align-items:center;gap:10px;padding:8px 10px;background:#F8FAFC;border:1px solid #D8DEE8;border-radius:8px;transition:.3s;width: calc(33% - 10px);}
.about-tech .tech_used .tech_icons_container .tech_icon .icon:hover{background:var(--main_color);border-color: var(--main_color);}
.about-tech .tech_used .tech_icons_container .tech_icon .icon:hover span{color: var(--white);}
.about-tech .tech_used .tech_icons_container .tech_icon .icon img{object-fit: contain;min-width: 35px;max-width: 50px;height: 35px;}
.about-tech .tech_used .tech_icons_container .tech_icon .icon span{color:#1F2937;font-size:13px;font-weight:600;}
/* --- Expertise Section --- */



@keyframes pulseAnim {
  0% { box-shadow: 0 0 0 0 rgba(140,29,47,0.6); }
  70% { box-shadow: 0 0 0 25px rgba(140,29,47,0); }
  100% { box-shadow: 0 0 0 0 rgba(140,29,47,0); }
}
/* About redesign */

.slide-arrow {background-color:black;color:var(--white);}
.slide img {max-width: 500px;width: 100%;height: auto;}
.slick-prev, .slick-next { background: #000;border: none;font-size: 16px;width: 36px;height: 36px;position: absolute;bottom: -50px;transform: translateY(100%);z-index: 10;}
.slick-prev {left: 45%;}
.slick-next {right: 48%;}
.slick-dots {margin-top: 60px;text-align: center;}
.slick-dots li button:before { font-size: 12px; color: #999;}
.slick-dots li.slick-active button:before {color: #b03c50;}


.slick-prev,.slick-next {display:none !important;}
.slick-dots {margin-top:15px;text-align:center;}
.slick-dots li button:before {font-size:12px;color:#999;}
.slick-dots li.slick-active button:before {color:#b03c50;}

.cont-no {display: flex;flex-wrap: wrap;gap:15px;align-items: center;}
.cont-no a {font-size:13px;color:#FFF;}
.cont-no a:hover{text-decoration: none;}
.cont-no img{width: 20px; height:20px;}
.con-no .phone_link{display: inline-flex;align-items: center;gap: 6px;text-decoration: none;color: inherit;}
.cont-no .flag_icon{width: 22px;height: 22px;object-fit: contain;vertical-align: middle;}
.cont-no span {color:red;}
.email a {color:#FFF;}
.email a:hover{text-decoration: none;}
.cont_model {background-color:var(--section_bg);}
.custom-modal-close {display:none;position:absolute;top:-5px;right:-50px;z-index:1055;width:40px;height:40px;background-color:#000;color:var(--white);border:none;border-radius:50%;font-size:1.5rem;line-height:1;text-align:center;padding:0;cursor:pointer;}
.custom-modal-close span {display:inline-block;width:100%;height:100%;line-height:40px;}
.video-modal-clean {background:none !important;border:none !important;border-radius:0 !important;box-shadow:none !important;}
.video-wrapper {aspect-ratio:16/9;width:100%;box-shadow:0 10px 25px rgba(0,0,0,0.6);overflow:hidden;}
.video-wrapper iframe {width:100%;height:100%;border:none;display:block;border-radius:0;}

/* services sidebar */
.sidebar #servicesAccordionWrapper .custom-accordion-button {background-color: #121212; color: #BFBFBF;border: none;width: 100%;padding: 15px 27px 15px 35px;text-align: left;display: flex;justify-content: space-between;align-items: center;cursor: pointer;font-size: 1rem;transition: background-color 0.3s ease;}
.sidebar #servicesAccordionWrapper .custom-accordion-button span{font-weight: 600;}
.sidebar #servicesAccordionWrapper .accordion-item:has(.show)  .custom-accordion-button span{color:#FFF;}
.sidebar #servicesAccordionWrapper .custom-accordion-button i{color: #BFBFBF;}
.sidebar #servicesAccordionWrapper .accordion-item .accordion-header a { padding: 8px 8px 8px 12px;width: 100%; background-color:#121212;}
.sidebar #servicesAccordionWrapper .side_arrow{flex: 1; display:flex;}

.sidebar .accordion .accordion-item .accordion-collapse .accordion-body{padding: 0;}
.sidebar .accordion .accordion-item .accordion-collapse .accordion-body .list-unstyled{padding: 0;margin: 0;}
.sidebar .accordion .accordion-item .accordion-collapse .accordion-body .list-unstyled li{padding: 10px 0px 10px 45px; margin-bottom: 0;}
.sidebar .accordion .accordion-item .accordion-collapse .accordion-body .list-unstyled li a{font-size: 16px; font-weight: 200;}
.sidebar .accordion .accordion-item .accordion-collapse .accordion-body .list-unstyled li a.current{color:#FFF;font-weight:500;}
.sidebar .services_drop { margin-left: -25px; margin-right: -25px;}
.custom-accordion-button:focus {box-shadow: none;outline: none;}
.custom-icon {color: var(--white);transition: transform 0.3s ease;}
.servicesAccordionWrapper{background-color: #121212 !important;}
.lang_list{background-color: #121212;}
.lang_list ul li a { color: #666666;}
.lang_list ul li {border-bottom: 1px solid #666666;}
.custom-accordion-button[aria-expanded="true"] .custom-icon {transform: rotate(180deg);}

/* Nilam css start */

.hero_section .hero_img {position: relative;width: 100%;height: auto;display: flex;justify-content: center;align-items: center;}
.hero_section .top_features img {height: auto;max-width: 100%;}
.hero_section .right_content h4{font-size: 30px; font-weight: 500;}
.hero_section  .top_features .phone-img {max-height: 350px;width: auto;object-fit: contain;}
.hero_section .hero_img .banner-img {width: 100%;height: auto;display: block;}
.hero_section .right_content p strong{font-size: 18px; font-weight: 800; }
.hero_section .right_content p{margin: 20px 0}
.hero_section .top_features .user_side {padding: 20px;}
.hero_section .top_features .user_side h3{font-size: 2rem; font-weight: 500;}
.hero_section .top_features .user_side .badge-group {display: flex;flex-wrap: wrap;justify-content: center;gap: 10px;margin-bottom: 15px;}
.hero_section .top_features .user_side .badge-group .custom-badge {background-color: #000;color: var(--white);padding: 9px 15px;font-size: 16px;border-radius: 10px;cursor: pointer;}
.hero_section .top_features .user_side .badge-group {display: flex;flex-wrap: wrap;gap: 8px;justify-content: center;}
.hero_section .top_features .user_side .badge-group .custom_diet {white-space: normal !important; text-align: center;line-height: 1.3;}
.laptop::after {content: "";position: absolute;bottom: 0;left: 0;width: 100%;height: 50%;background: linear-gradient(to top, rgba(255,255,255,1), rgba(255,255,255,0));opacity: 0;transition: opacity 0.4s ease-in-out;pointer-events: none; z-index: 1;}
.hero_section .more_screens .laptop {overflow: hidden;max-width: 420px;flex: 1 1 300px;position: relative;  background: linear-gradient(to top, rgba(255, 255, 255, 0.7), transparent); margin-bottom: 20px;}
.hero_section .more_screens .laptop:hover::after {opacity: 1;}
.hero_section .more_screens .laptop img {width: 100%;display: block;}
.hero_section .more_screens .laptop .screen {position: absolute;top: 11%;left: 12%;width: 76%;height: 65%;border-radius: 4px;z-index: 2;display: flex;align-items: center;justify-content: center;overflow: hidden;cursor: pointer;}
.hero_section .more_screens .laptop .screen img {width: 100%;height: 100%;object-fit: contain;object-position: center;transition: transform 0.3s ease, filter 0.3s ease;}
.hero_section .more_screens .laptop .screen .search-icon{background-color:black;color: var(--white);border-radius: 50%;padding: 10px;font-size: 20px;display: inline-flex;justify-content: center;align-items: center;position: absolute;top: 100%;left: 50%;transform: translate(-50%, -50%);opacity: 0;transition: all 0.4s ease; z-index: 2;}
.hero_section .more_screens .laptop .screen:hover .search-icon { top: 50%; opacity: 1;}
.hero_section .more_screens .laptop .screen:hover::before,.screen:hover::after { opacity: 3; }
.hero_section .more_screens .custom-modal .modal-content {background: transparent;border: none; box-shadow: none;}
.hero_section .more_screens .custom-modal .modal-content.outside-arrow {font-size: 3rem;padding: 0.5rem 1rem;z-index: 10;}
#prevBtn{left: -80px; color: var(--white); font-size: 35px;}
 #nextBtn { right: -80px; color: var(--white); font-size: 35px;}
#imageModal .btn-close {color: var(--white); font-size: 15px;}
.hero_section .more_screens .custom-modal .modal-content {background: transparent;border: none;box-shadow: none;}
.hero_section .more_screens .custom-modal .outside-arrow {font-size: 1.5rem;color: var(--white);position: absolute;top: 50%;transform: translateY(-50%);z-index: 10;cursor: pointer;background: none;border: none; }
#imageCaption {font-size: 20px; }
.model_head #imageCaption {padding: 0}
.hero_section .choose-languages .content_list{padding: 10px 15px;}
.hero_section .choose-languages .content_list h6{font-size: 23px; font-weight:700}
.hero_section .choose-languages .content_list .custom p, ul li, .custom2 ul li, .custom2 p{font-size: 15px;}
.hero_section .choose-languages .About_development{font-size: 30px;}
.hero_section .choose-languages .all-logos{box-shadow: 0px 0px 10px 0px;}
.hero_section .choose-languages .main_content{background-color: #1b1b1b;}
.hero_section .hero_img .ai-model-img {position: absolute;top: 12%;left: 8%;width: 100%;max-width: 478px;z-index: 2;}
.hero_section .title .headtitle{padding-top: 80px;}
/* chatdocs Page */
.main_chantdocx {padding: 80px 0 0 0;}
.main_chantdocx .bmi_content{padding: 0px 0 60px;}
.main_chantdocx .hero_banner img{width: 100%;}
.main_chantdocx .About_content{font-size: 30px; font-weight: 600;}
.main_chantdocx .hero_banner img{width: 100%;}
.main_chantdocx .chatdocx_content{padding:0 0 40px 0}
.main_chantdocx .chatdocx_content h2{font-size: 30px; font-weight: 600;}
.main_chantdocx .chatdocx_content strong{font-size: 18px;}
.main_chantdocx .chatdocx_content p{font-size: 18px;font-weight: 400;line-height: normal;}
.main_chantdocx .assistent_feature{padding:40px 0}
.main_chantdocx .assistent_feature h2{font-size: 30px; font-weight: 600;}
.main_chantdocx .assistent_feature .feature-list .custom-check{ color: #1abc9c; font-size: 30px}
.main_chantdocx .assistent_feature .feature-list li {border-bottom: 1px solid #ddd; padding: 0.3px 0%;}
.main_chantdocx .top_features .user_side .badge-group {display: flex;flex-wrap: wrap;gap: 8px;justify-content: center;}
.main_chantdocx .top_features .user_side .badge-group .custom-badge {background-color: #000;color: var(--white);padding: 10px 15px;font-size: 12px;white-space: normal; border-radius: 10px;justify-content: center; align-items: center; display: flex;}

.main_chantdocx .top_features.projects{padding: 40px 0;}
.main_chantdocx .top_features.projects .title h1::after{display: none;}
.main_chantdocx .top_features.projects .title p{font-size: 15px; font-weight: 500;}
.main_chantdocx .top_features.projects .title h1{text-align: start; font-size: 33px; padding-bottom: 0;}
.main_chantdocx .top_features.projects .title h1 span{font-weight: 800; color: var(--main_color);}

.main_chantdocx .top_features.projects .title p{color: var(--main_color);letter-spacing: 1px;}
.main_chantdocx .top_features.projects .title p.description{color: var(--text-color);}
.main_chantdocx .top_features.projects .user_side{background-color: var(--white); height: 100%; padding: 30px;}
.main_chantdocx .top_features.projects .user_side .title{padding-bottom: 10px;display: flex;justify-content: space-between;text-align: start; flex-wrap: wrap;}
.main_chantdocx .top_features.projects .user_side .title p{font-size: 12px; color: #0000008c; font-weight: 500; margin-bottom: 5px;;}
.main_chantdocx .top_features.projects .user_side p{color: #0000008c; font-weight: 500;}
.main_chantdocx .top_features.projects .user_side .badge-group{display: flex; flex-wrap: wrap; gap: 10px;margin-top: 15px;justify-content: flex-start;align-items: center;}
.main_chantdocx .top_features.projects .user_side .badge-group .custom-badge{ font-weight: 600;color: var(--text-color);border: 1px solid var(--text-color);padding: 5px 10px;border-radius: 0px; font-size: 14px; background-color: var(--white);}
.main_chantdocx .top_features.projects .user_side .badge-group .custom-badge:hover{background-color: var(--main_color); border: 1px solid transparent !important; color: var(--white);}
.main_chantdocx .top_features.projects .user_side.admin{background-color: var(--black);}
.main_chantdocx .top_features.projects .user_side.admin .title{color: var(--white); padding-bottom: 10px;display: flex;justify-content: space-between;text-align: start;}
.main_chantdocx .top_features.projects .user_side.admin p{color: var(--white);}
.main_chantdocx .top_features.projects .user_side.admin .badge-group .custom-badge{background-color: #1d1d23 ; font-weight: 600;color: var(--text-mute);border: 1px solid var(--text-mute);padding: 5px 10px; font-size: 14px;}
.main_chantdocx .top_features.projects .user_side.admin .badge-group .custom-badge:hover{background-color: var(--main_color) ; border: 1px solid transparent !important;}



.main_chantdocx .top_features .user_side h3{font-size: 2rem; font-weight: 500;}


.main_chantdocx .custom_story h2{display: block;font-size:34px;margin: 0;font-weight: 800;text-transform: capitalize;color:var(--black);text-align:center;padding-bottom:20px;position:relative;}
.main_chantdocx .custom_story h2::after {content: '';position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);display: block;width: 100px;height: 4px;background-color: var(--main_color);}
.main_chantdocx .custom_story li,
.main_chantdocx .custom_story p{font-size: 16px; font-weight: 400;line-height: 1.4;}
.main_chantdocx .why-us .content_list{padding: 10px 15px;}
.main_chantdocx .why-us .why_us_content .content_list h6{font-size: 23px; font-weight:700}
.main_chantdocx.choose-languages .content_list .custom p, ul li, .custom2 ul li, .custom2 p{font-size: 16px;}
.main_chantdocx .custom_story ul.seyferry-list{list-style-type:disc;padding-left: 14px;}
.main_chantdocx .custom_story .ferry-img{display: block;border-radius:20px;width: 100%;height: auto;}
.main_chantdocx .ferry_customer .ferry-img{position:sticky;top:130px;}
.main_chantdocx .we_deliver{display: block;width: 100%;padding:40px 0;background-color:var(--black);}
.main_chantdocx .we_deliver .sub-title h2{display: block;font-size:18px;margin: 0;font-weight:600;text-transform: capitalize;color:var(--main_color);text-align:left;padding-bottom:10px;position: relative;}
.main_chantdocx .we_deliver .sub-title span{display: block;font-size:40px;margin: 0;font-weight:600;color:var(--white);text-align:left;padding-bottom:10px;line-height: 1.2;}
.main_chantdocx .we_deliver .sub-title span b{color:var(--main_color);line-height: 1.2;font-weight:600;}

.main_chantdocx .we_deliver p{width:100%;font-size:16px;font-weight:400;line-height:1.5;color:var(--text-mute);}
.main_chantdocx .we_deliver ol{list-style-type:none;padding-left:0;}
.main_chantdocx .we_deliver ol li{display: flex;gap:30px;width: 100%;justify-content:flex-start;align-items:center;color:var(--white);font-size: 18px;font-weight: 500;line-height: 1.2;border-top:1px solid var(--text-mute);padding:14px 0;}
.main_chantdocx .we_deliver ol li .text-move{flex: inherit; text-align: left; color:var(--white);font-size: 18px;font-weight: 500;line-height: 1.2;transition-property: transform;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);transition-duration: 300ms;will-change: transform;}
.main_chantdocx .we_deliver ol li:hover .text-move{transform:translateX(0.5rem);}
.main_chantdocx .we_deliver ol li:first-child{border-top:1px solid var(--text-mute);border-bottom:0px;}
.main_chantdocx .we_deliver ol li:last-child{border-bottom:1px solid var(--text-mute);border-top:1px solid var(--text-mute);}
.main_chantdocx .we_deliver ol li span{color:var(--main_color);font-weight: 600;flex:0 0 auto;}

.main_chantdocx .testimonial{display: block;width: 100%;margin: 0;padding:40px 0;background-color:var(--white);}
.main_chantdocx .testimonial h2{display: block;width: 100%;margin:0 0 50px;font-size: 37px;font-weight: 800;text-transform: capitalize;color:var(--black);line-height: 1.3;text-align: center;}
.main_chantdocx .testimonial h2 span{color:var(--main_color);}
.main_chantdocx .testimonial .testimonial-content i{font-size: 80px;color:#9b1b3454;line-height:1;margin-bottom:6px;}
.main_chantdocx .testimonial .testimonial-content p{display: block;width:100%;margin:0 0 10px; font-size:16px;font-weight:400;color:var(--black);line-height: 1.4;text-align: left;}
.main_chantdocx .testimonial .testimonial-content p b{font-weight:600;}
.main_chantdocx .testimonial .video-card {position: sticky;top:120px;width: 100%;max-width: 460px;aspect-ratio: 16 / 9;border-radius: 16px;overflow: hidden;}
.main_chantdocx .testimonial .video-thumb,
.main_chantdocx .testimonial .video-card iframe {position: absolute;inset: 0;width: 100%;height: 100%;object-fit: cover;border: none;}
.main_chantdocx .testimonial .video-overlay {position:absolute;inset: 0;background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.1) 50%, rgba(0,0,0,0.3) 100%); pointer-events: none;}
.main_chantdocx .testimonial .play-btn {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 60px;height: 60px;border-radius: 50%;background:var(--main_color); border: none;color: #fff;font-size: 20px;display: flex;align-items: center;justify-content: center;cursor: pointer;transition: transform 0.3s ease;}
.main_chantdocx .testimonial .play-btn:hover {transform: translate(-50%, -50%) scale(1.1);}
.main_chantdocx .testimonial .seferry-video{min-height: 315px; background: #9b1b3454;display: flex;justify-content: center;align-items: center;height: 100%;border-radius: 10px;}
.main_chantdocx .testimonial .seferry-video .video-card{top: 0px !important;position: relative !important;}

.main_chantdocx.choose-languages .tech_used{display:block;width:100%;margin:0;padding:40px 40px;background:var(--white);box-shadow:rgba(0, 0, 0, 0.24) 0px 3px 8px;}
.main_chantdocx.choose-languages .tech_used h5.title{display:block;width:100%;margin:0 0 10px;padding: 0;font-size:30px;line-height:1.2;color:var(--text-color);font-family:"Inter",sans-serif;font-weight:600;}
.main_chantdocx.choose-languages .tech_used .tech_icons_container{display:flex;justify-content:space-between;align-items:flex-start;margin:0;width: 100%;gap:10px;}
.main_chantdocx.choose-languages .tech_used .tech_icons_container .tech_icon{display:flex;width:100%;justify-content:center;align-items:flex-start;flex-direction:column;gap:10px;}
.main_chantdocx.choose-languages .tech_used .tech_icons_container .tech_icon .icon{display:flex;width:100%;justify-content:flex-start;align-items:center;padding:10px;gap:20px 20px;}
.main_chantdocx.choose-languages .tech_used .tech_icons_container .tech_icon .icon img{width:50px;max-width:50px;height:50px;object-fit:contain;object-position:center center;}
.main_chantdocx.choose-languages .tech_used .tech_icons_container .tech_icon .icon span{display:block;font-family:"Inter", Sans-serif;font-size:16px;font-weight:600;line-height:1;color:var(--text-color);}

.main_chantdocx.choose-languages .About_development{font-size: 30px;}
.main_chantdocx.choose-languages .all-logos{box-shadow: 0px 0px 10px 0px;}
.main_chantdocx .choose-languages .main_content{background-color: #08AAAF;}
.laptop::after {content: "";position: absolute;bottom: 0;left: 0;width: 100%;height: 50%;background: linear-gradient(to top, rgba(255,255,255,1), rgba(255,255,255,0));opacity: 0;transition: opacity 0.4s ease-in-out; pointer-events: none;  z-index: 1;}

.main_chantdocx .more_screens .laptop {overflow: hidden;max-width: 420px;flex: 1 1 300px;position: relative;  background: linear-gradient(to top, rgba(255, 255, 255, 0.7), transparent);}
.main_chantdocx .more_screens .laptop:hover::after {opacity: 1;}
.main_chantdocx .more_screens .laptop img {width: 100%;display: block;}
.main_chantdocx .more_screens .laptop .screen {position: absolute;top: 11%;left: 12%;width: 76%;height: 65%;border-radius: 4px;z-index: 2;display: flex;align-items: center;justify-content: center;overflow: hidden;cursor: pointer;}
.main_chantdocx.more_screens .laptop .screen i {width: 100%;height: 100%; color:var(--white); object-position: center;transition: transform 0.3s ease, filter 0.3s ease;}
.main_chantdocx .more_screens .laptop .screen .search-icon {background-color: black;color: var(--white);border-radius: 50%;padding: 10px;font-size: 20px;display: inline-flex;justify-content: center;align-items: center;position: absolute;top: 100%;left: 50%;transform: translate(-50%, -50%);opacity: 0; transition: all 0.4s ease; z-index: 2;}
.main_chantdocx .more_screens .laptop .screen:hover .search-icon {top: 50%;opacity: 1;}
.main_chantdocx .more_screens .laptop .screen:hover::before,.screen:hover::after{opacity:3;}
.main_chantdocx .more_screens .custom-modal .modal-content {background: transparent;border: none; box-shadow: none;}
.main_chantdocx .more_screens .custom-modal .modal-content.outside-arrow {font-size: 2rem;padding: 0.5rem 1rem;z-index: 10;}
#prevBtn{left: -80px; color: var(--white); font-size: 35px;}
#nextBtn { right: -80px; color: var(--white); font-size: 35px;}
.main_chantdocx .more_screens .custom-modal .modal-content {background: transparent;border: none;box-shadow: none;}
.main_chantdocx .more_screens .custom-modal .outside-arrow {font-size: 1.5rem;color: var(--white);position: absolute;top: 50%;transform: translateY(-50%);z-index: 10;cursor: pointer;background: none;border: none; }
#imageCaption {font-size: 20px; }
.model_head #imageCaption {padding: 0}
.phone_mockup img{object-fit: cover;object-position: top;height: 330px;width: 450px;}
.phone-mockup{height: 350px;overflow: hidden;}

.main_chantdocx .top_features{background-color: var(--section_bg); padding: 40px 0;}


/* bmi-page */
.bmi_boutique {padding: 80px 0;}
.understanding-content {padding: 60px 0; background-color: var(--section_bg);}
.bmi_boutique .bmi_content {padding: 0px 0 60px;}
.bmi_boutique .bmi_content h2{font-size: 30px; font-weight: 600;}
.bmi_boutique .bmi_content p{font-size: 17px; font-weight: 500;}
.bmi_boutique .bmi_content .bmi_about{padding: 0px 25px;}
.bmi_boutique .bmi_content .top_features button{background-color: #D9EBEB; color: black;font-size: 19px;font-weight: 600;}
.bmi_boutique .choose-languages .content_list{padding: 10px 15px;}
.bmi_boutique .choose-languages .content_list h6{font-size: 23px; font-weight:700}
.bmi_boutique .choose-languages .content_list .custom p, ul li, .custom2 ul li, .custom2 p{font-size: 16px;}
.bmi_boutique .choose-languages .About_development{font-size: 30px;}
.bmi_boutique .choose-languages .all-logos{box-shadow: 0px 0px 10px 0px;}
.bmi_boutique .choose-languages .main_content{background-color: #86CACA;}
.bmi_boutique .bmi_content .top_features .phone-mockup {margin-top: 20px;}
.bmi_boutique .more_screens .laptop img {width: 100%;display: block;}
.bmi_boutique .more_screens .laptop .screen {position: absolute;top: 11%;left: 12%;width: 76%;height: 65%;border-radius: 4px;z-index: 2;display: flex;align-items: center;justify-content: center;overflow: hidden;cursor: pointer;}
.bmi_boutique .more_screens .laptop .screen img {width: 100%;height: 100%;object-fit: contain;object-position: center;transition: transform 0.3s ease, filter 0.3s ease;}
.bmi_boutique .more_screens .laptop .screen .search-icon {background-color: black; color: var(--white); border-radius: 50%;padding: 10px;font-size: 20px; display: inline-flex;justify-content: center;align-items: center;position: absolute; top: 100%;left: 50%;transform: translate(-50%, -50%);opacity: 0;transition: all 0.4s ease; z-index: 2;}
.bmi_boutique .more_screens .laptop .screen:hover .search-icon { top: 50%; opacity: 1;}
.bmi_boutique .more_screens .laptop:hover::after{opacity:1;}
.bmi_boutique .more_screens .laptop {overflow: hidden;max-width: 420px;flex: 1 1 300px;position: relative;  background: linear-gradient(to top, rgba(255, 255, 255, 0.7), transparent);}
.bmi_boutique .more_screens .laptop .screen:hover::before,.screen:hover::after{ opacity: 3; }
.bmi_boutique .more_screens .custom-modal .modal-content {background: transparent;border: none; box-shadow: none;}
.bmi_boutique .more_screens .custom-modal .modal-content.outside-arrow {font-size: 2rem;padding: 0.5rem 1rem;z-index: 10;}
#prevBtn{left: -80px; color: var(--white); font-size: 35px;}
 #nextBtn { right: -80px; color: var(--white); font-size: 35px;}
.bmi_boutique .more_screens .custom-modal .modal-content {background: transparent;border: none;box-shadow: none;}
.bmi_boutique .more_screens .custom-modal .outside-arrow {font-size: 1.5rem;color: var(--white);position: absolute;top: 50%;transform: translateY(-50%);z-index: 10;cursor: pointer;background: none;border: none; }
#imageCaption {font-size: 20px; }
.model_head #imageCaption{padding: 0}
/* Nilam css end */

/* shiftwizard  */
.shiftwizard{margin: 50px 0 ;}
.shiftwizard .shiftwizard-card{width: 100%;background: var(--white);padding: 30px 30px; box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;}
.shiftwizard .minHeight{min-height: 367px;}
.solution_content{padding: 60px 0;}
.solution_content .full-container{box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;margin-bottom: 20px; display: flex; min-height: 90px !important; height: fit-content !important;}
.solution_content .laravel-container .gif-img {display: flex; align-items: center; justify-content: center; gap: 5px;}
.bmi_boutique .main_chantdocx{background-color: var(--section_bg);}
.main_chantdocx .main_chantdocx.hej-hus{background-color: var(--section_bg);}
.main_chantdocx .main_chantdocx.hej-hus .assistent_feature{padding: 60px 0;}

/* hej hus  */
.main_chantdocx .bmi_content .hero-images .home-img{width: 65% !important;}
.main_chantdocx .bmi_content .hero-images .manage-availibility{ top: 110px;  right: 0; position: absolute; width: 60% !important;}


/* @media (min-width:1025px){.right-box{position:absolute;top:40%;left:37%;transform:translateY(-50%);width:55%;}} */


.form-submit-message{display: none;padding: 15px;background-color: #d4edda;color: #155724;border-radius: 4px;margin-bottom: 20px;font-size: 16px;font-weight: bold;}
.SwiftWizard-list{list-style-type: disc;}
.brief-title{font-size: 30px; font-weight: 600;}


.whatsapp-btn {position: fixed;right:30px;bottom:30px;z-index: 50;display: flex;flex-direction: column;align-items: center;gap: 0.5rem;text-decoration: none;cursor:pointer;}
.whatsapp-icon-wrap {position: relative;width:3rem;height:3rem;display: grid;place-items: center;border-radius: 50%;background-color: #25D366;color: #fff;box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);transition: transform 0.2s ease;}
.whatsapp-icon-wrap i {font-size: 1.6rem;line-height: 1;}
.whatsapp-btn:hover .whatsapp-icon-wrap {transform: scale(1.1);}
.whatsapp-ping {position: absolute;inset: 0;border-radius: 50%;background-color: rgba(37, 211, 102, 0.45);animation: wa-ping 1.4s cubic-bezier(0, 0, 0.2, 1) infinite;}
@keyframes wa-ping {
  0%       { transform: scale(1); opacity: 0.8; }
  75%, 100% { transform: scale(2); opacity: 0; }
}
.whatsapp-label {background-color: #25D366;color: #fff;font-size: 0.72rem;font-weight: 600;padding: 0.25rem 0.75rem;border-radius: 999px;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);white-space: nowrap;
}


/* New Mega Menu Design */

.mega-menu {background:#fff;border-radius:0 0 10px 10px;overflow:hidden;box-shadow:0 10px 40px rgba(0,0,0,.08);}
.mega-menu .mega-sidebar {background:var(--section_bg);min-height:450px;display:flex;flex-direction:column;}
.mega-menu .menu-title {padding:25px;font-size:12px;font-weight:700;letter-spacing:1px;color:#8892a0;}
.mega-menu .service-tabs .nav-link {border:none;border-radius:0 !important;background:transparent;color:var(--text-color) !important;display:flex !important;align-items:center !important;gap:12px !important;padding:15px 24px !important;text-align:left !important;font-weight:600 !important;position:relative;}
.mega-menu .service-tabs .nav-link.active {background:#fff !important;color:var(--text-color) !important;}
.mega-menu .service-tabs .nav-link.active::before {content:"";width:3px;height:100%;background:var(--main_color);position:absolute;left:0;top:0;}
.mega-menu .menu-icon {width:34px;height:34px;border-radius:8px;background:#ddd;display:flex;align-items:center;justify-content:center;}
.mega-menu .menu-text{font-weight: 600;}
.mega-menu .service-tabs .active .menu-icon {background:var(--main_color);color:#fff;}
.mega-menu .service-tabs .nav-link:hover,
.mega-menu .service-tabs .nav-link:focus {background:#fff !important;color:var(--text-color);}
.mega-menu .service-tabs .nav-link:hover::before,
.mega-menu .service-tabs .nav-link:focus::before {content:"";width:3px;height:100%;background:var(--main_color);position:absolute;left:0;top:0;}
.mega-menu .service-tabs .nav-link:hover .menu-icon,
.mega-menu .service-tabs .nav-link:focus .menu-icon {background:var(--main_color);color:#fff;}
.mega-menu .service-tabs .nav-link .menu-arrow {margin-left:auto;color:var(--main_color);opacity:0;}
.mega-menu .service-tabs .nav-link.active .menu-arrow,
.mega-menu .service-tabs .nav-link:hover .menu-arrow {opacity:1;}
.mega-menu .sidebar-footer {margin-top:auto;padding:20px 25px;border-top:1px solid #ddd;}
.mega-menu .sidebar-footer span {color:#9ba5b4;}
.mega-menu .sidebar-footer a {color:var(--main_color);text-decoration:none;font-weight:600;}
.mega-menu .content-wrapper {padding:35px;}
.mega-menu .service-header {display:flex;align-items:center;gap:15px;}
.mega-menu .service-icon {width:38px;height:38px;border-radius:10px;background:var(--main_color);color:#fff;display:flex;align-items:center;justify-content:center;}
.mega-menu .service-header h3 {margin:0;font-size:30px;font-weight:700;}
.mega-menu .service-header p.service-heading {color:#000000;margin:0;font-size:30px;font-weight:700;}
.mega-menu .service-header p {margin:0;color:#8f98a8;}
.mega-menu .header-line {width:35px;height:2px;background:var(--main_color);margin:0px 0 30px 2px;}
.mega-menu .service-links {display:flex;flex-direction:column;gap:20px;}
.mega-menu .service-links a {text-decoration:none;color:var(--text-color);font-size:18px;line-height:1.2;display:flex;align-items:center;justify-content:flex-start;gap:15px;}
.mega-menu .service-links a .right_arrow {opacity:0;margin-left:auto;font-size:14px;}
.mega-menu .service-links a.active-service .right_arrow,
.mega-menu .service-links a:hover .right_arrow {opacity:1;}
.mega-menu .service-links a span {width:30px;height:30px;background:#f2f2f2;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;}
.mega-menu .service-links a:hover {color:var(--main_color);}
.mega-menu .service-links a:hover span {background:var(--main_color);color:#fff;}
.mega-menu .service-links a:hover small {background:var(--main_color);color:#fff;}
.mega-menu .active-service {color:var(--main_color)!important;}
.mega-menu .active-service small {background:var(--main_color);color:#fff;font-size:10px;padding:4px 8px;border-radius:4px;margin-left:10px;}
.mega-menu .view-all {display:inline-flex;gap:8px;align-items:center;margin-top:30px;color:var(--main_color);text-decoration:none;font-weight:700;}

/* New Mega Menu Design */

.main_chantdocx .sf-project-showcase{padding: 0 0 80px 0; background-color: var(--white);overflow:hidden;}
.main_chantdocx .sf-project-image{text-align:right;}
.main_chantdocx .sf-project-image img{width:100%;max-width:550px;border-radius:20px;display:block;margin:0 0 0 auto;}
.main_chantdocx .sf-project-content h1::after{display: none;}
.main_chantdocx .sf-project-title{display: block;width: 100%;font-size: 37px;font-weight: 800;line-height: 1.3;color: var(--text-color);margin-bottom: 0;text-align: left;padding-bottom: 20px;}
.main_chantdocx .sf-project-title strong{color: var(--main_color);font-weight: 800;}
.main_chantdocx .sf-project-content h2{display: block;width: 100%;font-size: 20px;font-weight: 600;color: var(--text-color);margin-bottom: 10px;}
.main_chantdocx .sf-project-content p{margin-bottom: 15px;}


/* New design for customer service */

.timeline-wrap {width: 100%;margin:0 0; padding:30px 30px 30px 30px;background:var(--section_bg); border-radius:10px; }
.timeline-wrap .timeline-item { position:relative; display:flex; gap:20px; padding-bottom:46px; }
.timeline-wrap .timeline-item:last-child { padding-bottom:0; }
.timeline-wrap .timeline-marker-col { position:relative; width:32px; flex:0 0 32px; display:flex; justify-content:center; }
.timeline-wrap .marker { width:32px; height:32px; border-radius:50%; color:var(--white); font-weight:700; font-size:0.95rem; display:flex; align-items:center; justify-content:center;flex-shrink:0; }
.timeline-wrap .timeline-item:not(:last-child) .timeline-marker-col::after { content:""; position:absolute; top:32px; bottom:-46px; left:50%; transform:translateX(-50%); width:2px; background:#e3e5e9; z-index:1; }
.timeline-wrap .marker-gray { background:var(--gray); }
.timeline-wrap .marker-maroon { background:var(--main_color); }
.timeline-wrap .marker-blue { background:var(--blue); }
.timeline-wrap .marker-green { background:var(--green); }
.timeline-wrap .timeline-content { flex:1; padding-top:4px; }
.timeline-wrap .eyebrow { font-size:0.8rem; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; margin-bottom:8px; }
.timeline-wrap .eyebrow-gray { color:var(--gray); }
.timeline-wrap .eyebrow-maroon { color:var(--main_color); }
.timeline-wrap .eyebrow-blue { color:var(--blue); }
.timeline-wrap .eyebrow-green { color:var(--green); }
.timeline-wrap .body-text { font-size:0.95rem; line-height:1.55; color:var(--text-dark); margin-bottom:16px; }
.timeline-wrap strong{font-weight: 600;}
.timeline-wrap .body-text:last-child { margin-bottom:0; }
.timeline-wrap .alert-box { background:var(--pink-bg); border:1px solid var(--pink-border); border-radius:8px; padding:18px 20px; font-size:0.95rem; line-height:1.55; color:var(--text-dark); }
.timeline-wrap .alert-box p:first-child{margin-bottom: 10px;}
.timeline-wrap .check-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.timeline-wrap .check-pill { display:flex; align-items:center; gap:10px; background:var(--green-bg); border:1px solid var(--green-border); border-radius:8px; padding:11px 16px; font-size:0.88rem; color:var(--text-dark); }
.timeline-wrap .check-pill i { color:var(--green); font-size:0.85rem; }
.timeline-wrap .result-box { background:linear-gradient(135deg, var(--main_color) 0%, var(--maroon-dark) 100%); border-radius:8px; padding:22px 24px; color:#fff; font-size:0.97rem; line-height:1.55; }

/* New design for customer service */

/* new section for sey ferry page  */
.operation-management-section {background-color: var(--section_bg);padding: 40px 0;}
.operation-management-section .feature-list{margin-top: 10px;display: grid;grid-template-columns: repeat(3, 1fr);gap: 30px;}
.operation-management-section .feature-list.ferry{margin-top: 10px;display: flex;flex-direction: column; gap: 30px;}
.operation-management-section .feature-item { height: 100%; display: flex;align-items: flex-start;gap: 15px;margin-bottom: 0;border-right: 1px solid var(--pink-border);padding: 0 20px 20px 0;border-bottom: 1px solid var(--pink-border);}
.operation-management-section .feature-icon {padding: 15px;background-color: var(--pink-bg);border-radius: 12px;display: flex;align-items: center;justify-content: center;margin-bottom: 22px;color: var(--main_color);}
.operation-management-section .feature-icon i{font-size: 22px;}
.operation-management-section .feature-icon:hover{background-color: var(--main_color); color: var(--white);}

.highlight-section{background-color: var(--section_bg);padding: 40px 0;}
.highlight-section .title{display: block;width: 100%;font-size: 16px;font-weight: 600;color: var(--main_color);margin-bottom: 0px;padding-bottom: 0;}
.highlight-section .card {border: none;border-radius: 16px;box-shadow:rgba(0, 0, 0, 0.24) 0px 0px 8px;}
.highlight-section .card .duration {font-size: 35px;font-weight: 800;color: var(--text-dark);}
.highlight-section .card .border-right{border-right: 1px solid var(--section_bg);}
.highlight-section .card .number-circle {width: 32px;height: 32px;background: var(--main_color);color: var(--white);border-radius: 50%;display: flex;align-items: center;justify-content: center;font-weight: bold;font-size: 16px; border: 1px solid transparent;}
.highlight-section .card .number-circle:hover{background-color: var(--white); border: 1px solid var(--gray-border); color: var(--text-color);}
.highlight-section .card .tech-pill {line-height: 1.2; background: var(--bs-light);border: 1px solid var(--gray-light);padding: 7px 15px;border-radius: 5px;font-weight: 500;}
.highlight-section .card .tech-pill:hover{background-color: var(--main_color); color: var(--white); border: 1px solid transparent;}
.highlight-section .card .infra-pill {color: var(--main_color);background: var(--pink-bg);border: 1px solid var(--pink-border);padding: 7px 15px;border-radius: 5px;font-weight: 500;display: inline-block;}

.operation-management{background-color: var(--section_bg);padding: 40px 0;}
.operation-management .description{   margin-top: 20px;text-align: center;color: var(--black);display: flex;justify-content: center;}
.operation-management .card{box-shadow: 0 12px 15px rgba(0, 0, 0, 0.1);border-radius: 10px;background: var(--text-mute);padding: 30px;height: 100%;transition: all 0.3s ease;border: 1px solid var(--section_bg);}
.operation-management .card:hover{transform: translateY(-10px);border-color: var(--main_color);}
.operation-management .card:hover .icon-wrapper{background: var(--main_color);color: var(--white);}
.operation-management .card .icon-wrapper{width: 50px;height: 50px;background: var(--badge-bg);border-radius: 12px;display: flex;align-items: center;justify-content: center;margin-bottom: 22px;color: var(--main_color);}
.operation-management .card .icon-wrapper i{font-size: 22px;}
.operation-management .card h3{font-size: 20px;font-weight: 600;margin-bottom: 10px;color: var(--text-color);}
.operation-management .card p{color: var(--black);line-height: 1.6;}
.reservation-section{background-color: var(--section_bg);padding: 40px 0;}
.reservation-section p{margin-bottom: 10px;}


/* Krishna CSS */

.key-features-section{background-color: var(--white);padding: 40px 0;}
.feature-showcase {flex-wrap: wrap; display: flex;align-items: center;gap: 60px;padding:40px;margin-bottom:0;border-bottom: 1px solid #e2e8f0;}
.feature-showcase:last-child {border-bottom: none;}
.feature-showcase.even {flex-direction: row-reverse;background-color:var(--section_bg);}
.feature-visual {flex: 1;height: auto;background: white;border-radius: 28px;display: flex;align-items: center;justify-content: center;padding:20px;font-size: 6.5rem;box-shadow: 0 25px 60px -15px rgba(15, 23, 42, 0.12);transition: all 0.5s ease;}
.feature-showcase:hover .feature-visual {transform: scale(1.04);box-shadow: 0 35px 70px -15px rgba(14, 165, 233, 0.2);}

.feature-boxes {flex: 1;display:flex;flex-direction: column;justify-content:space-evenly;gap:50px;}
.feature-boxes-content{flex: 1;display:flex;flex-direction:row;gap:40px;}
.feature-number {font-size:14px;font-weight: 600;letter-spacing: 4px;color: #9b1b34;margin-bottom: 12px;}
.feature-heading {color:#000;font-size:30px;font-weight: 700;line-height: 1.2;margin-bottom: 10px;}

.feature-content {font-size:18px;color:var(--text-muted);line-height: 1.2;}
/* Krishna CSS */



.portfolio-filter-wrapper {background-color: var(--white);padding: 0px 15px;margin-bottom: 2.5rem;}
.portfolio-filter-list {gap: 25px;border: none;}
.portfolio-filter-list .nav-item{margin-bottom: 0 !important;}
.portfolio-filter-list .nav-link {margin: 0 !important;color: var(--text-muted);font-weight: 600;font-size: 1rem;padding: 12px 5px;background: transparent !important;border: none !important;position: relative;display: flex;align-items: center;gap: 10px;transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);}
.portfolio-filter-list .nav-link i {font-size: 1.1rem;transition: transform 0.3s ease, color 0.3s ease;}
.portfolio-filter-list .nav-link::after {content: '';position: absolute;bottom: -2px;left: 0;width: 100%;height: 3px;background-color: var(--main_color);transform: scaleX(0);transform-origin: bottom right;transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);}
.portfolio-filter-list .nav-link:hover {color: var(--main_color);}
.portfolio-filter-list .nav-link:hover i {color: var(--main_color);transform: translateY(-2px);}
.portfolio-filter-list .nav-link:hover::after {transform: scaleX(1);transform-origin: bottom left;}
.portfolio-filter-list .nav-link.active {color: var(--main_color) !important;}
.portfolio-filter-list .nav-link.active::after {transform: scaleX(1);background-color: var(--main_color);}
.portfolio-filter-list .nav-link.active i {color: var(--main_color) !important;}
.portfolio-breadcrumb{display: inline-flex;align-items: center;gap: 10px;padding: 10px;margin: 15px;background: rgba(255, 255, 255, 0.2);box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);backdrop-filter: blur(5px);border: 1px solid rgba(255, 255, 255, 0.3);border-radius: 50px;font-size: 13px;font-weight: 600;letter-spacing: .5px;text-transform: uppercase;}
.portfolio-breadcrumb .breadcrumb-main{color: var(--text-color);text-decoration: none;transition: .3s ease;font-weight: 700;}
.portfolio-breadcrumb .breadcrumb-main:hover{color: var(--text-color)}

.portfolio-breadcrumb2{width: fit-content; color: var(--text-color);align-items: center;box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 30px;backdrop-filter: blur(5px);font-size: 13px;font-weight: 600;letter-spacing: 0.5px;text-transform: uppercase;text-decoration: none;transition: 0.3s;gap: 10px;padding: 10px;margin: 15px;background: rgba(255, 255, 255, 0.2);border-width: 1px;border-style: solid;border-color: rgba(255, 255, 255, 0.3);border-image: initial;border-radius: 50px;}
.portfolio-breadcrumb2 .breadcrumb-main{color: var(--text-color);text-decoration: none;transition: .3s ease;font-weight: 700;}
.portfolio-breadcrumb2 .breadcrumb-main:hover{color: var(--text-color)}
.portfolio-breadcrumb2 .breadcrumb-separator {color: var(--gray-light);font-size: 15px;font-weight: 700;}
.portfolio-breadcrumb2 .breadcrumb-sub{color: var(--gray-light);font-weight: 500;}

.portfolio-breadcrumb .breadcrumb-separator{color: var(--gray-light);font-size: 15px;font-weight: 700;}
.portfolio-breadcrumb .breadcrumb-sub{color: var(--gray-light);font-weight: 500;}




@media only screen and (max-width: 1440px) {
  .slider-wrapper {max-width:1440px;}
}

@media (max-width:1200px){
  .slider_img::after{width:35%;}
}
@media (max-width:992px){
    .team-section .expect-card{flex-wrap: wrap; padding: 20px;}
  .operation-management-section .feature-list{grid-template-columns: repeat(2, 1fr);}
  .highlight-section .card .border-right{border-right: none !important;}
  .slider_img::after{width:30%;} .shiftwizard{margin: 20px 0px !important ;} .main_chantdocx .bmi_content .bmi_about{padding-top: 80px;}
  .timeline-wrap .check-grid{grid-template-columns: 1fr;}
  .our_process .view-more{display: flex; justify-content: center; margin-top: 20px;}
  .our_process .roadmap{grid-template-columns:1fr;gap:70px;}
  .our_process .roadmap::before{width:4px;height:100%;left:50%;top:0;transform:translateX(-50%);}
  .our_process .roadmap .step,.roadmap .step:nth-child(4),.roadmap .step:nth-child(5),.roadmap .step:nth-child(6){margin-top:0;}
  .our_process .roadmap .step:nth-child(4)::before{display:none;}
  .our_process .roadmap .step:hover{transform: translateY(0px);}
  .technology.about-tech .tech_used .tech-card{flex-wrap: wrap;}
  .technology.about-tech .tech_used .tech_icons_container{width: 100% !important;}
  .technology.about-tech .tech_used .tech_icons_container.right-border{border-right: none;}
  .technology.about-tech .tech_used .tech_icons_container div{justify-content: start !important;}
  .technology.about-tech .tech_used .tech_icons_container.right{margin-left: 0px;}
  .our_process .roadmap .step:nth-child(4){margin-top: 0;}
}
@media (max-width:768px){
  .feature-content{font-size: 16px;}
  .main_chantdocx .testimonial .seferry-video{background: none;}
  .feature-heading{font-size: 22px;}
  .feature-visual{flex: unset;}
  .feature-boxes{gap: 35px;}
  .feature-boxes-content{flex-wrap: wrap;}
  .main_chantdocx .sf-project-title{font-size: 25px !important;}
  .feature-showcase{gap: 35px;padding: 10px; margin-bottom: 20px;}
  .feature-showcase.even{padding: 20px;}
  .operation-management-section .feature-list{grid-template-columns: repeat(1, 1fr);}
  .main_chantdocx .sf-project-image{margin-top: 20px;} .main_chantdocx .sf-project-showcase{padding: 0 0 40px 0;} .main_chantdocx:has(.sf-project-showcase) {padding: 40px 0 0 0 !important;} .main_chantdocx .top_features.projects .user_side .title p{display: block !important;width: 100%;} .main_chantdocx .top_features.projects{padding: 40px 0;} .main_chantdocx .top_features.projects .title{ padding-bottom: 20px;} .main_chantdocx .top_features.projects .description{text-align: start !important; margin-bottom: 20px;}   .main_chantdocx .top_features .user_side .badge-group{flex-direction: row !important;} .main_chantdocx .top_features .user_side .badge-group .custom-badge{padding: 4px 8px !important;} .slider_img::after{width:50%;} .why_us .tech_used .tech_icons_container{flex-wrap: wrap;}
  .main_chantdocx .testimonial h2{font-size:28px;}
  .how_work .development-cta .main-cta{justify-content: start !important; gap: 20px !important;}
  .how_work .development-cta .main-cta .description{width: 100% !important;}
  .how_work .development-cta .main-cta .description h2{font-size: 22px !important;}
}
@media (max-width:992px){
  .how_work .development-services-area .development-cta{width: 100% !important;} .slider_img::after{width:30%;} .shiftwizard{margin: 20px 0px !important ;} .main_chantdocx .bmi_content .bmi_about{padding-top: 80px;}
}
@media (max-width:768px){
  .portfolio-filter-list .nav-item{width: 100%;} .portfolio-filter-list{justify-content: start !important;} .portfolio-filter-list{gap: 10px 20px !important;} .how_work .development-services-area .service-card{padding: 15px;} .how_work .development-services-area{padding: 20px;} .how_work .development-services-area .development-cta .description{width: 100% !important;} .how_work .development-services-area .development-cta .description h2{font-size: 20px;}  .slider_img::after{width:50%;} .why_us .tech_used .tech_icons_container{flex-wrap: wrap;}
}
@media (max-width:576px){
  .about-tech .tech_used .tech_icons_container .tech_icon .icon{width: auto;}
  .portfolio-breadcrumb{border-radius: 25px; font-size:12px;padding:8px 14px;gap:6px;flex-wrap:wrap;}
  .slider_img::after{width:70%;}
  .timeline-wrap { margin:24px auto; padding:28px 18px; } .check-grid { grid-template-columns:1fr; }
}
@media (max-width:479px){
  .main_chantdocx .top_features.projects .user_side{padding:20px;}
  .main_chantdocx .bmi_content .hero-images .manage-availibility{ top: 70px; width: 60% !important;}.main_chantdocx .bmi_content .hero-images .home-img{width: 60% !important;} .main_chantdocx .bmi_content .bmi_about{padding-top: 40px;}
  .whatsapp-label{display:none;}
  .whatsapp-btn{right:20px;}
  .technology.about-tech .tech_used .tech_icons_container .tech_icon .icon{width: calc(50% - 5px);}
  .technology.about-tech .tech_used .tech_icons_container .tech_icon .icon span{font-size: 12px;}
  .technology.about-tech .tech_used .tech_icons_container .tech_icon .icon img{min-width: 25px;}
  .technology.about-tech .tech_used .tech_icons_container .tech_icon .icon{gap: 5px;}
}

.project-highlights{padding:80px 0;}
.heading{text-align:center;margin-bottom:45px;}
.heading .badge{
width:70px;height:70px;border-radius:50%;
display:flex;align-items:center;justify-content:center;
background:rgba(155,27,52,.08);color:var(--main_color);
margin:auto;font-size:30px;
}
.heading h2{margin-top:18px;font-size:46px;font-weight:800;}
.project-heading{display: block;font-size:24px;color:var(--text-color);line-height: 1.2;font-weight: 600;margin-bottom: 10px; word-break: break-all;}
.card-box{
background:#fff;border:1px solid #ececec;border-radius:22px;
padding:28px;height:100%;
box-shadow:0 12px 30px rgba(0,0,0,.06);
transition:.3s;
}
.card-box:hover{transform:translateY(-5px);}
.top{display:flex;gap:20px;}
.top ul {list-style-type:circle;}
.top ul li{font-size:16px;font-weight: 500;line-height: 1.2;color:var(--text-dark);}
.icon-box,.small-icon,.badge-default{
display:flex;align-items:center;justify-content:center;
background:rgba(155,27,52,.08);
color:var(--main_color);
}
.badge-default:hover , .small-icon:hover,.icon-box:hover{background-color: var(--main_color); color: var(--white);}
.icon-box{width:60px;height:60px;border-radius:20px;font-size:34px;flex-shrink:0;}
.small-icon{min-width:56px;height:56px;border-radius:16px;font-size:22px;}
h4{font-size:26px;font-weight:700;margin-bottom:16px;}
ul{padding-left:18px;margin:0;}
li{margin-bottom:10px;color:var(--text-muted);}
.duration .num{font-size:48px;font-weight:800;color:var(--main_color);line-height:1;}
.duration .txt{font-size:24px;color:var(--text-color);font-weight: 500;}
.card-box .top .duration{display: flex;align-items: center; gap: 10px;}

.title-row{display:flex;align-items:center;gap:15px;margin-bottom:24px;}
.subtitle{font-size:20px;font-weight:700;color:var(--main_color);margin-bottom:10px;}
.divider{height:1px;background:#ececec;margin:20px 0;}
.tech-list{list-style:none;padding:0;margin:0;}
.tech-list li{display:flex;align-items:center;gap:12px;padding:0 0 5px 0;border-bottom:1px solid #f2f2f2;}
.badge-default,.brand{width:40px;height:40px;border-radius:12px;flex-shrink:0;font-size:17px;}
.brand{display:flex;align-items:center;justify-content:center;color:#fff;}
.aws{background:#FF9900;}
.github{background:#24292f;}
.jira{background:#0052CC;}
.google{background:#4285F4;}
.stripe{background:#635BFF;}
.react{background:#61DAFB;color:#20232A;}
.node{background:#3C873A;}
.cloudflare{background:#F38020;}
@media(max-width:991px){
.top{flex-direction:column;}
.heading h2{font-size:36px;}
}
/* New Portfolio Filter - Tab Style (Exact Match) */

.case-study-section{
  margin-bottom: 40px; background:var(--white);padding:0 0;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;border-radius:22px;

  .case-study-card{
    width:100%;background:var(--white);display:flex;overflow:hidden;border-radius:22px;border:1px solid rgba(22,21,25,.08);box-shadow:0 8px 48px rgba(22,21,25,.09),0 2px 12px rgba(22,21,25,.05);transition:transform .45s ease,box-shadow .45s ease;

    &:hover{
      box-shadow:0 16px 70px rgba(22,21,25,.13),0 6px 20px rgba(22,21,25,.08);

      .project-title{transform:translateY(-2px);}
      .project-description{opacity:.82;}
      .right-panel{
        .client-header {
          h4{
            transform:translateY(-2px);
          }

          .client-icon{
            background:var(--main_color);
            svg{stroke:var(--white);}
          }
        }
      }
      .testimonial{
        .client-info img{
          transform:scale(1.08);
          border-color:var(--main_color);
        }
      }
    }

    .vertical-divider{width:1px;background:rgba(22,21,25,.07);flex-shrink:0;}

    .left-panel{
      &.r-img{border-radius:0 20px 20px 0;}

      width:45%;position:relative;overflow:hidden;background:var(--white);border-radius:20px 0 0 20px;cursor:pointer;flex-shrink:0;
      &::before{
        content:"";position:absolute;left:0;right:0;top:0;bottom:0;background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,0));z-index:1;pointer-events:none;
      }

      .project-image{
        width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.25,.46,.45,.94);object-position:center;
      }

      &:hover {
        .project-image{transform:scale(1.06);}
      }
    }

    .middle-panel{
      width:30%;padding:22px 24px;display:flex;flex-direction:column;height:100%;border-right:1px solid rgba(22,21,25,.07);

      .category-badge{
        width:max-content;background:var(--main_color);backdrop-filter:blur(14px);padding:6px 14px;border-radius:999px;color:var(--white);text-transform:uppercase;font-size:10px;font-weight:700;letter-spacing:.12em;box-shadow:0 2px 12px rgba(0,0,0,.10);margin-bottom:16px;
      }
      .sub-category{margin-bottom: 15px;font-size: 16px;font-weight: 700;color: var(--text-color);line-height: 1.5;}

      .case-label{
        display:flex;align-items:center;gap:9px;margin-bottom:16px;

        .line{
          width:24px;height:2px;background:var(--main_color);border-radius:2px;
        }

        span:last-child{
          color:var(--main_color);  font-size:10.5px;  font-weight:700;text-transform:uppercase;letter-spacing:.20em;
        }
      }

      .project-title{
        margin:0 0 16px;font-size:30px;font-weight:700;line-height:1.15;color:var(--text-color);letter-spacing:-.02em;
      }

      .project-description{
        margin:0 0 16px;font-size:13.5px;line-height:1.8;color:var(--text-color);opacity:.70;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;
      }

      .project-tags{
        display:flex;flex-wrap:wrap;gap:7px;margin-top:auto;

        span{
          display:inline-flex;align-items:center;justify-content:center;padding:5px 12px;border-radius:999px;border:1px solid rgba(155,27,52,.22);background:rgba(155,27,52,.04);color:var(--main_color);font-size:11px;font-weight:600;letter-spacing:.02em;white-space:nowrap;transition:background .30s ease,color .30s ease,transform .30s ease,border-color .30s ease;

          &:hover{
            background:var(--main_color);color:var(--white);border-color:var(--main_color);transform:translateY(-2px);
          }
        }
      }

      .divider{
        width:100%;height:1px;background:rgba(22,21,25,.07);margin:16px 0 0;
      }

      .case-button{
        display:inline-flex;align-items:center;gap:10px;align-self:flex-start;padding:12px 22px;border:1.5px solid var(--main_color);border-radius:0;color:var(--main_color);background:transparent;font-size:13px;font-weight:700;letter-spacing:.03em;transition:all .35s cubic-bezier(.34,1.56,.64,1);cursor:pointer;

        svg{transition:transform .35s cubic-bezier(.34,1.56,.64,1),stroke .35s ease;}

        &:hover{
          background:var(--main_color);color:var(--white);text-decoration:none;
          svg{
            transform:translateX(5px);
          }
        }

        &:focus{
          outline:none;box-shadow:0 0 0 4px rgba(155,27,52,.15);
        }
      }

      &>*{
        transition:all .35s ease;
      }
    }

    .right-panel{
      width:25%;display:flex;flex-direction:column;height:100%;

      .client-header{
        padding:22px 24px;border-bottom:1px solid rgba(22,21,25,.07);display:flex;align-items:flex-start;gap:12px;

        .client-icon{
          width:32px;height:32px;background:rgba(155,27,52,.07);border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:.35s ease;
        }

        .client-label{
          display:block;color:var(--main_color);font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin-bottom:0;
        }

        h4{
          margin:0;color:var(--text-color);font-size:16px;font-weight:700;line-height:1.25;letter-spacing:-.01em;
        }

      }

      .video-box{
        position:relative;margin:18px 20px;border-radius:14px;overflow:hidden;cursor:pointer;background:#1a1520;

        img{
          width:100%;height:148px;object-fit:cover;opacity:.8;transition:transform .55s cubic-bezier(.25,.46,.45,.94),opacity .35s ease;
        }

        .video-overlay{
          position:absolute;inset:0;background:linear-gradient(to bottom,rgba(10,8,14,.15),rgba(10,8,14,.55));transition:.35s ease;
        }

        .play-button{
          position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(0,0,0,.22);transition:transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .35s ease;

          svg{margin-left:3px;}
        }

        &:hover{
           img{
            transform:scale(1.05);opacity:.95;
          }
          .video-overlay{
            background:linear-gradient(to bottom,rgba(10,8,14,.08),rgba(10,8,14,.45));
          }
          .play-button{
            transform:translate(-50%,-50%)scale(1.12);box-shadow:0 8px 28px rgba(0,0,0,.30);
          }
        }
      }

      .testimonial{
        padding:20px 22px 26px;flex:1;

        .divider{
          width:100%;height:1px;background:rgba(22,21,25,.06);margin:12px 0;
        }

        .client-info{
          display:flex;align-items:center;justify-content:flex-start;gap:12px;margin-bottom:14px;text-align:left;

          img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid rgba(155,27,52,.18);flex-shrink:0;transition:transform .35s ease,border-color .35s ease;
          }

          h5{
            margin:0;color:var(--text-color);font-size:14px;font-weight:700;line-height:1.2;
          }

          p{
            text-align: left;margin:2px 0 0;color:var(--text-color);opacity:.5;font-size:11.5px;
          }

          span{
            display:block;margin-top:2px;color:var(--main_color);font-size:11.5px;font-weight:600;
          }
        }
      }
    }
  }
}

.client-header h4,
.client-info img{transition:.35s ease;}

.case-study-card,
.left-panel,
.middle-panel,
.right-panel,
.project-title,
.project-subtitle,
.project-description,
.client-header,
.client-info,
.video-box,
.play-button,
.project-tags span{transition:all .35s ease;}

.project-image,
.video-box img,
.client-info img{user-select:none;-webkit-user-drag:none;}

@media screen and (max-width: 1199px) {
  .case-study-section{
    .middle-panel{
      padding:30px;
    }
    .right-panel{
      .client-header {
        padding:24px 20px;
      }
    }
  }
}

@media screen and (max-width: 991px) {
  .case-study-section{
    padding:60px 20px;
    .case-study-card{
      flex-wrap:wrap;min-height:auto;
      .vertical-divider{display:none;}
      .left-panel{width:100%;min-height:380px;border-radius:22px 22px 0 0; margin-bottom: 20px;
        &.r-img{border-radius: 0 0 22px 22px; margin-bottom: 0 !important; margin-top: 20px;}
        }
      .middle-panel{width:60%;border-right:none;border-top:1px solid rgba(22,21,25,.07);}
      .right-panel{
        width:40%;border-top:1px solid rgba(22,21,25,.07);
        .testimonial {
          & .client-info {margin-bottom: 0;}
        }
      }
    }
  }
}

@media screen and (max-width: 768px) {
  .case-study-section{
    padding:50px 15px;
    .case-study-card{
      .middle-panel,right-panel{width:100%;}
      .middle-panel{padding:28px 24px;}
      .right-panel{border-top:1px solid rgba(22,21,25,.07);}
      .project-title{font-size:28px;}
      .video-box img{height:220px;}
    }
  }
}

@media screen and (max-width: 540px) {
  .case-study-section{
    padding:40px 12px;
    .case-study-card{
      .left-panel{
        min-height:300px;
      }
      .middle-panel{
        padding:24px 20px;
        .project-title{font-size:24px;}
        .project-description{font-size:13px;}
        .project-tags{
          gap:6px;
          span{font-size:10px;padding:5px 10px;}
        }
      }
      .right-panel{width: 100%;
        .client-header{padding:22px 18px;}
        .testimonial{
          padding:18px;
          .client-info{
            gap:10px;
            img{width:44px;height:44px;}
          }
        }
        .video-box{margin:18px;}
      }
    }
  }
}
