.blog-dtl h3 {
	margin-top: 30px;
}

.border-img,
.btn-purple {
	border-radius: 10px
}

h1,
h2,
p {
	color: #fff
}

.btn-purple,
.btn-trans {
	padding: 10px 30px;
	transition: transform .4s, box-shadow .4s, background .4s
}

.dropdown-item,
body {
	font-family: "Noto Sans", sans-serif
}

body {
	background: #1a0022;
	background: linear-gradient(152deg, rgb(26 0 34) 0, rgb(36 0 112) 100%);
	overflow-x: hidden
}

@font-face {
	font-display: swap
}

.anti-box {
	width: 300px;
	height: 300px;
	position: relative;
	overflow: visible
}

#nextBtn,
#prevBtn {
	color: #daacdd !important
}

.anti-object {
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
	will-change: transform;
	pointer-events: none
}

.i-icon {
	margin-top: -18px;
	width: auto !important;
	height: auto !important
}

.font35-bold {
	font-size: 35px;
	font-weight: 600
}

.font22-semibold {
	font-size: 22px;
	font-weight: 600
}

.font55-bold {
	font-size: 55px;
	font-weight: 600
}

.font40-bold {
	font-size: 40px;
	font-weight: 500
}

.font40-semibold {
	font-size: 40px;
	font-weight: 400
}

.font24 {
	font-size: 24px;
	font-weight: 600
}

.font30-semibold {
	font-size: 30px;
	font-weight: 400
}

.font25,
h1,
h2 {
	font-weight: 600
}

.font25 {
	font-size: 25px
}

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

.font27 {
	font-size: 27px
}

.dark-color {
	color: #333
}

.light-purple,
a.drop-had-nav:hover {
	color: #e0baff
}

.lineight {
	line-height: 35px
}

h1,
h2 {
	font-size: 55px
}

.btn-purple,
.btn-trans,
.dropdown-item,
.nav-link,
p {
	font-size: 18px
}

p {
	line-height: 25px;
	font-weight: 300
}

nav {
	border-bottom: 1px solid #350d65
}

.nav-link {
	color: #fff !important;
	font-weight: 500
}

.btn-trans,
a.drop-had-nav {
	color: #fff
}

.nav-item {
	margin: 0 10px
}

.sticky-nav {
	position: fixed;
	width: 100%
}

a:hover {
	text-decoration: none !important
}

.btn-purple,
.btn-trans,
.footer-links a,
.mobile-nav-list li a,
.pagination li a,
.services-section a,
.site-map-link,
.visit-site-btn,
a.drop-had-nav,
a.drop-had-nav:hover {
	text-decoration: none
}

.btn-purple {
	background-color: #4c38bd;
	color: #fff;
	font-weight: 500;
	border: 1px solid #4c38bd
}

.btn-purple:hover,
.btn-trans:hover {
	background: #902397;
	background: linear-gradient(152deg, rgb(144 35 151) 0, rgb(97 53 189) 100%);
	transform: scale(1.08);
	box-shadow: 0 0 20px rgb(140 0 255 / .5)
}

.btn-trans {
	background-color: #fff0;
	font-weight: 500;
	border-radius: 10px;
	border: 1px solid #fff
}

.mynavbar {
	padding: 11px 0;
	border-bottom: 1px solid #350d65
}

.mynavbar.sticky-nav {
	background: #200051db;
	z-index: 999
}

.sticky-nav .with-i,
.without-i {
	display: block
}

#file-input,
.carousel-indicators,
.dropdown-toggle::after,
.sml-full-img,
.sticky-nav .without-i,
.with-i {
	display: none
}

.footer-links a:hover,
.save-btn:hover {
	text-decoration: underline
}

.dropdown-menu {
	left: 0;
	height: auto;
	opacity: 1;
	visibility: visible;
	background: #1a0022;
	background: linear-gradient(152deg, rgb(26 0 34) 0, rgb(55 2 167) 100%);
	transform: translateY(15px);
	transition: .35s
}

.btn-light,
.info-box,
.service-box,
.stat-box {
	transition: .3s
}

.dropdown-menu.closing {
	height: 0 !important;
	opacity: 0 !important;
	transform: translateY(15px) !important;
	visibility: hidden !important
}

.dropdown-item {
	color: #fff !important;
	font-weight: 400;
	border-bottom: 1px solid #fff0;
	background-image: linear-gradient(to right, #902397, #6135bd);
	background-repeat: no-repeat;
	background-size: 100% 1px;
	background-position: 0 100%;
	padding: 6px 0 6px 10px
}

.dropdown-item:hover {
	background-color: #fff0
}

.dropdown-item:focus,
.dropdown-item:hover {
	background-color: #4c38bd;
	color: #fff !important
}

.holiday-title,
.navbar-nav .nav-link {
	color: #fff
}

.dropend .dropdown-toggle {
	color: salmon;
	margin-left: 1em
}

.mynavbar .dropdown .dropdown-menu {
	display: block;
	opacity: 0;
	visibility: hidden;
	transform: translateY(20px);
	transition: opacity 380ms cubic-bezier(.2, .9, .3, 1), transform 380ms cubic-bezier(.2, .9, .3, 1);
	pointer-events: none
}

.mynavbar .dropdown.show .dropdown-menu,
.mynavbar .dropdown:hover .dropdown-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	pointer-events: auto
}

.mynavbar .dropdown-menu.closing {
	opacity: 0 !important;
	visibility: hidden !important;
	transform: translateY(20px) !important;
	pointer-events: none !important
}

.service-box {
	background: rgb(255 255 255 / .06);
	backdrop-filter: blur(10px);
	text-align: left;
	border-radius: 20px
}

.label,
.why-card {
	backdrop-filter: blur(6px)
}

.service-box:hover,
.stat-box:hover {
	transform: translateY(-8px);
	box-shadow: 0 8px 20px rgb(0 0 0 / .3)
}

.service-box h3 {
	font-size: 30px;
	margin: 0 0 0 15px;
	display: flex;
	align-items: center;
	color: #fff
}

.heading {
	font-size: 25px;
	line-height: 31px
}

#file-name,
.desc {
	font-size: 14px
}

.web {
	background: linear-gradient(135deg, #902397, #6135bd)
}

.mobile {
	background: linear-gradient(135deg, #256be0, #554d9b)
}

.data {
	background: linear-gradient(135deg, #902397, #8256dd)
}

.icon-wrapper {
	width: 90px;
	height: 90px;
	margin: 0 auto;
	display: flex;
	justify-content: center;
	align-items: center;
	box-shadow: 0 0 12px rgb(255 255 255 / .2);
	position: relative
}

.icon-wrapper::after {
	content: "";
	position: absolute;
	border-radius: 50%;
	inset: -5px;
	border: 2px solid;
	opacity: 0;
	transform: scale(.7);
	transition: .45s
}

.image-wrapper,
.process-flow .col-md-2 {
	position: relative
}

.process-flow .col-md-2:hover .icon-wrapper {
	transform: translateY(-10px) scale(1.07);
	box-shadow: 0 10px 25px rgb(183 76 250 / .4)
}

.process-flow .col-md-2:hover .icon-wrapper::after {
	opacity: 1;
	transform: scale(1.05)
}

.process-flow .icon-wrapper img {
	transition: .45s
}

.process-flow .col-md-2:hover .icon-wrapper img {
	transform: scale(1.15) rotate(8deg)
}

.process-flow .col-md-2:not(:last-child)::after {
	content: "";
	position: absolute;
	top: 45px;
	right: -35px;
	width: 70px;
	height: 3px;
	background: linear-gradient(90deg, #b74cfa, #fff);
	background-size: 200% 100%;
	transition: background-position .5s
}

.process-flow .col-md-2:hover::after {
	background-position: 100% 0
}

.process-flow .col-12.col-md-2 p {
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: .45s;
	padding: 6px 9px;
	border-radius: 12px;
	background: rgb(183 76 250 / .15);
	backdrop-filter: blur(4px);
	display: inline-block;
	color: #fff;
	box-shadow: 0 0 0 #fff0;
	font-size: 17px
}

.process-flow .col-12.col-md-2:hover p {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	background: rgb(183 76 250 / .25);
	box-shadow: 0 4px 15px rgb(183 76 250 / .4)
}

.process-flow .col-12.col-md-2 {
	cursor: pointer
}

.stat-box {
	background: #f3f3f3;
	border-radius: 12px;
	padding: 30px 10px;
	box-shadow: 0 0 10px rgb(0 0 0 / .05);
	CURSOR: DEFAULT
}

.section-main {
	background: linear-gradient(135deg, #0b001b, #220047);
	color: #fff
}

.info-box {
	background: linear-gradient(135deg, indigo, #1b0033);
	border: 1px solid
}

.info-box:hover {
	transform: translateY(-5px);
	background: linear-gradient(135deg, #5b00ff, #2b0075)
}

.gallery-img {
	transition: transform .3s, box-shadow .3s;
	cursor: pointer
}

.gallery-img:hover {
	transform: scale(1.05);
	box-shadow: 0 8px 20px rgb(255 255 255 / .2)
}

.footer-links li {
	margin-bottom: .4rem;
	font-size: 18px
}

.footer-links a {
	color: #fff;
	transition: .3s;
	font-weight: 400
}

.footer-links a:hover {
	color: #c698f1
}

.social-icons {
	background: #fcf9ff;
	border: 1px solid #efecff;
	padding: 10px 0;
	text-align: center;
	border-radius: 10px
}

.social-icons a img {
	margin: -12px 15px 0
}

.social-icons a img:hover,
.social-icons i:hover {
	transform: scale(1.1);
	box-shadow: 0 0 10px rgb(255 255 255 / .3)
}

.social-icons i {
	font-size: 34px;
	margin: 0 15px;
	color: #7941bf
}

.btn-outline-light {
	font-weight: 500;
	border: 1px solid #fff;
	color: #fff;
	font-size: 18px;
	transition: transform .4s, box-shadow .4s, background .4s
}

.btn-outline-light:hover {
	background: #fff;
	color: #333;
	transform: scale(1.08);
	box-shadow: 0 0 20px rgb(140 0 255 / .5)
}

.btn-light {
	background: #fff;
	color: #3b0a91;
	font-size: 18px;
	transition: transform .4s, box-shadow .4s, background .4s
}

#cookie-banner button:hover,
.btn-light:hover {
	color: #fff !important;
	background: #902397;
	background: linear-gradient(152deg, rgb(144 35 151) 0, rgb(97 53 189) 100%);
	transform: scale(1.08);
	box-shadow: 0 0 20px rgb(140 0 255 / .5)
}

.call-footer {
	background: linear-gradient(135deg, #352390, #632497)
}

.footer-bottom {
	border-color: rgb(255 255 255 / .2) !important;
	background: linear-gradient(135deg, #632497, #352390)
}

.our-work img {
	width: 100%;
	height: 350px;
	object-fit: cover;
	border-radius: 12px
}

.case-study {
	background: #1a0022;
	background: linear-gradient(152deg, rgb(26 0 34) 0, rgb(55 2 167) 100%);
	border-radius: 10px;
	border: 1px solid #3d0483
}

.image-wrapper {
	overflow: hidden;
	border-radius: 12px;
	cursor: pointer
}

.image-wrapper img {
	transition: transform .5s;
	display: block;
	width: 100%;
	border-radius: 12px
}

.image-wrapper .overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #1a002296;
	opacity: 0;
	transition: opacity .5s;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9;
	border-radius: 12px
}

.image-wrapper .overlay-text {
	color: #fff;
	font-size: 1.2rem;
	font-weight: 600;
	letter-spacing: .5px;
	opacity: 0;
	transform: translateY(15px);
	transition: .4s
}

.image-wrapper:hover img {
	transform: scale(1.08)
}

.image-wrapper:hover .overlay,
.vmg-card:hover h2,
.vmg-card:hover p {
	opacity: 1
}

.image-wrapper:hover .overlay-text,
.vmg-card:hover ul li {
	opacity: 1;
	transform: translateY(0)
}

.image-wrapper i {
	font-size: 40px
}

.modal-footer {
	position: absolute;
	border-radius: 50px;
	right: -30px;
	top: -25px
}

#lightboxModal img {
	width: 100%;
	border-radius: 10px;
	height: auto
}

.modal-footer .btn {
	border-radius: 50px;
	border: 1px solid #230b64;
	font-size: 25px;
	background: linear-gradient(135deg, #632497, #352390);
	color: #fff;
	padding: 6px 12px 11px 15px;
	line-height: 21px
}

.icon-wrapper {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 20px
}

.icon-wrapper img {
	width: 100%;
	transition: transform .4s;
	margin-bottom: 0 !important
}

.icon-wrapper:hover,
.service-icon:hover {
	transform: scale(1.08);
	box-shadow: 0 0 20px rgb(140 0 255 / .5);
	background: linear-gradient(152deg, rgb(26 0 34) 0, rgb(55 2 167) 100%)
}

.icon-wrapper:hover img {
	transform: scale(1.15)
}

.top-img img {
	transition: transform .4s ease-in-out;
	transform: scale(1.1)
}

.navbar-toggler-icon {
	background-image: url(../images/buger.webp);
	background-repeat: no-repeat
}

.mobile-sidebar {
	position: fixed;
	top: 0;
	right: -280px;
	width: 280px;
	height: 100vh;
	background: linear-gradient(152deg, rgb(26 0 34) 0, rgb(55 2 167) 100%);
	padding: 20px;
	transition: .3s;
	z-index: 99999;
	overflow-y: auto
}

.close-btn {
	background: 0 0;
	border: none;
	color: #fff;
	font-size: 28px;
	float: right
}

.overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgb(0 0 0 / 64%);
	display: none;
	z-index: 9999
}

.day,
.pie_progress,
.stat-item,
footer {
	position: relative
}

.mobile-nav-list {
	list-style: none;
	padding-left: 0;
	margin-top: 60px
}

.mobile-nav-list li a {
	color: #fff;
	display: block;
	padding: 10px 0;
	border-bottom: 1px solid #333;
	font-size: 18px
}

.mobile-submenu {
	display: none;
	list-style: none;
	padding-left: 15px
}

.mobile-submenu li a {
	font-size: 16px;
	color: #fff !important
}

#desktopMega {
	display: none !important
}

.empower-section p {
	line-height: 27px;
	margin-bottom: 32px
}

.empower-image img {
	width: 100%;
	border-radius: 10px
}

.vmg-card {
	border: 1px solid #632497;
	height: 100%;
	display: flex;
	flex-direction: column
}

.vmg-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 0 20px rgb(155 107 255 / .3);
	border-color: rgb(155 107 255 / .5)
}

.principle-card-box {
	background: #fff;
	border-radius: 50%;
	padding: 18px;
	margin-bottom: 15px;
	transition: .3s;
	border: 1px solid #7941bf;
	height: 100px;
	width: 100px;
	display: inline-block
}

.principle-card-box:hover {
	color: #fff;
	transform: scale(1.1);
	box-shadow: 0 0 20px rgb(155 107 255 / 51%)
}

.stat-item {
	color: #fff;
	padding: 0 25px
}

.stat-item:not(:last-child)::after {
	content: "";
	position: absolute;
	right: 0;
	top: 10%;
	height: 80%;
	width: 1px;
	background: rgb(255 255 255 / .2)
}

.stats p {
	line-height: 45px
}

.competency-card {
	background: #1a0022;
	background: linear-gradient(152deg, rgb(26 0 34) 0, rgb(45 0 139) 100%);
	border-radius: 10px;
	padding: 20px 30px;
	height: 100%;
	transition: .3s
}

.gradient-btn,
.page-item .page-link:hover,
.page-item.active .page-link {
	background: linear-gradient(135deg, #a84dc4, #6b2eff);
	color: #fff
}

.competency-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 0 25px rgb(155 107 255 / .3)
}

.competency-card ul {
	list-style-type: disc;
	padding-left: 20px;
	color: #e0e0e0;
	margin-bottom: 0;
	padding-bottom: 0
}

.case-study-main ul li,
.competency-card ul li {
	margin-bottom: 10px;
	line-height: 1.6;
	font-size: 18px
}

.blog-card {
	border: 1px solid #632497;
	color: #fff;
	border-radius: 10px;
	padding: 20px;
	margin-bottom: 20px;
	height: auto
}

.blog-card h5 {
	font-size: 18px
}

.blog-card p {
	font-size: 16px;
	height: 100px;
	margin-bottom: 0
}

.pagination {
	display: flex;
	gap: 10px;
	align-items: center
}

.page-item .page-link {
	border: none;
	color: #000;
	font-weight: 500;
	background-color: #f5f5f5;
	border-radius: 6px;
	box-shadow: 0 0 3px rgb(255 255 255 / .2);
	transition: .2s ease-in-out
}

.btn.ghost,
.wrap .btn {
	background: #fff0
}

.page-item.active .page-link {
	box-shadow: 0 0 5px rgb(255 255 255 / .3)
}

.gradient-btn {
	border: none;
	border-radius: 6px;
	width: 40px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: .3s
}

.gradient-btn:hover {
	opacity: .9;
	transform: scale(1.05)
}

.gradient-btn:disabled {
	opacity: .5;
	cursor: not-allowed
}

.pagination-main {
	margin: 0 auto;
	max-width: max-content
}

.bullet li,
.sitemap-title {
	margin-bottom: 20px;
	color: #fff
}

.holiday-item:last-child,
.pagination-main nav {
	border-bottom: 0
}

.bullet li {
	line-height: 25px;
	font-size: 18px;
	font-weight: 300
}

.sitemap-wrapper {
	border: 1px solid;
	border-radius: 8px;
	padding: 50px 40px
}

.sitemap-title {
	font-size: 22px;
	font-weight: 500;
	background: #350d65;
	display: inline-block;
	border-radius: 0
}

.sitemap-wrapper ul {
	list-style: none;
	padding: 0 0 0 15px;
	margin: 0
}

.sitemap-wrapper ul li {
	color: #ddd;
	font-size: 15px;
	line-height: 1.7;
	margin-bottom: 6px
}

.sitemap-wrapper ul li a {
	color: #ccc;
	text-decoration: none;
	transition: .3s
}

.sitemap-wrapper ul li a:hover {
	color: #d1a0ff;
	text-decoration: underline
}

.sitemap-wrapper .row {
	border: 1px solid;
	border-radius: 8px;
	padding: 30px 20px
}

@media (max-width:768px) {

	.sitemap-title,
	.sitemap-wrapper ul {
		text-align: center
	}

	.sitemap-wrapper {
		padding: 40px 20px;
		margin: 40px 10px
	}

	.sitemap-title {
		display: block
	}
}

.pie_progress {
	width: 30px;
	height: 25px;
	z-index: 99999;
	top: 172px;
	margin: 0 auto
}

.v-table p {
	margin-bottom: 0;
	font-size: 20px;
	line-height: 28px
}

.left-img img {
	padding-right: 40px
}

.right-img img {
	padding-left: 40px;
	width: 100%
}

.how-bg img {
	width: 100%
}

footer {
	z-index: 99
}

.footer-color {
	background: #220064
}

.service-card {
	text-align: left;
	padding: 20px 10px
}

#cookie-banner,
.contact-banner h1,
.contact-section,
.day .date-num,
.grid-weekdays,
.muted {
	text-align: center
}

.icon-box {
	border-radius: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 18px
}

.service-title {
	font-size: 20px;
	font-weight: 600;
	color: #fff;
	margin-bottom: 10px
}

.divider-line {
	width: 80px;
	height: 3px;
	background: #c149ff;
	margin: -155px auto 0
}

.service-item {
	display: flex;
	align-items: flex-start;
	gap: 18px;
	margin-bottom: 30px
}

.service-icon {
	width: 55px;
	background: #352390;
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
	transition: transform .4s, box-shadow .4s, background .4s
}

.icon-box img {
	transition: transform .4s, filter .4s
}

.icon-box:hover img {
	transform: scale(1.25);
	filter: drop-shadow(0 0 12px rgb(255 255 255 / .45))
}

.wrap {
	margin: 0 auto
}

.calendar-card {
	background: linear-gradient(152deg, rgb(26 0 34) 0, rgb(36 0 112) 100%);
	border-radius: var(--radius);
	padding: 20px;
	border: 1px solid #1e0044
}

.cal-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 12px
}

.month-title {
	font-size: 20px;
	font-weight: 700;
	letter-spacing: .2px;
	color: #fff
}

.nav-buttons {
	display: flex;
	gap: 8px
}

.calendar-grid,
.grid-weekdays {
	display: grid;
	grid-template-columns: repeat(7, 1fr)
}

.wrap .btn {
	border: 1px solid;
	color: #fff;
	padding: 8px 12px;
	border-radius: 8px;
	cursor: pointer;
	font-weight: 600
}

.btn:active {
	transform: translateY(1px)
}

.grid-weekdays {
	gap: 6px;
	margin: 50px 0 10px;
	color: var(--muted);
	font-weight: 700;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: #fff
}

.calendar-grid {
	gap: 8px
}

.day {
	background: #fff;
	border-radius: 10px;
	padding: 30px 0;
	border: 1px solid #220064;
	transition: transform .12s, box-shadow .12s;
	overflow: hidden;
	height: 88px
}

.day.small {
	min-height: 70px;
	padding: 8px
}

.day .date-num {
	font-weight: 600;
	font-size: 18px;
	opacity: .95;
	color: #000
}

.muted-day {
	color: rgb(255 255 255 / .28)
}

.day:hover {
	transform: translateY(-6px);
	box-shadow: 0 10px 30px rgb(0 0 0 / .45)
}

.holiday-indicator {
	display: inline-block;
	padding: 6px 8px;
	border-radius: 0 0 10px 10px;
	background: #d1d1d1;
	color: #000;
	font-size: 14px;
	text-align: center;
	width: 100%
}

.legend .dot,
.muted {
	display: none;
	color: #fff
}

.today {
	box-shadow: 0 0 0 3px rgb(247 201 72 / .08), inset 0 -4px 18px rgb(247 201 72 / .04);
	border: 1px solid
}

.muted {
	font-weight: 500;
	font-size: 18px !important
}

.bottom-row {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	flex-wrap: wrap
}

.holiday-item,
.legend {
	display: flex;
	gap: 10px
}

.holiday-list,
.legend {
	background: linear-gradient(135deg, #352390, #632497);
	border-radius: 5px;
	padding: 10px;
	border: 1px solid
}

.legend {
	align-items: center;
	color: #fff;
	width: 100%;
	font-size: 18px;
	font-weight: 700
}

.legend .dot {
	width: 12px;
	height: 7px;
	border-radius: 50%;
	background: linear-gradient(90deg, var(--accent), var(--accent-2));
	box-shadow: 0 2px 6px rgb(139 47 181 / .18)
}

.holiday-list {
	flex: 1;
	overflow: auto;
	min-width: 240px
}

.holiday-item {
	align-items: center;
	padding: 13px 6px;
	border-bottom: 1px solid #6627af !important
}

.holiday-date {
	color: var(--muted);
	color: #fff
}

.tooltip {
	position: absolute;
	left: 12px;
	right: 12px;
	bottom: 12px;
	background: rgb(0 0 0 / .6);
	padding: 8px 10px;
	border-radius: 8px;
	border: 1px solid;
	display: none;
	z-index: 40;
	font-size: 13px
}

.dropdown-checkbox,
.had-who,
.map-card,
.vmg-card {
	position: relative
}

.left-holiday {
	background: linear-gradient(152deg, rgb(26 0 34) 0, rgb(36 0 112) 100%);
	padding: 20px;
	border: 1px solid #1e0044
}

.fs-3 {
	font-size: 70px !important
}

.had-who {
	background: linear-gradient(152deg, #1b0029 0, #1d0038 100%);
	z-index: 99
}

.dropdown-checkbox {
	width: 200px
}

.dropdown-checkbox button {
	width: 100%;
	padding: 8px
}

.dropdown-checkbox .menu {
	display: none;
	position: absolute;
	width: 100%;
	background: #fff;
	border: 1px solid #ccc;
	padding: 10px
}

#cookie-banner,
.vmg-card::before {
	background: linear-gradient(135deg, #352390, #632497);
	left: 0
}

#cookie-banner {
	position: fixed;
	bottom: 0;
	right: 0;
	color: #fff;
	padding: 10px;
	z-index: 1000;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap
}

#cookie-banner button {
	background: #fff;
	color: #000;
	border: 1px solid #fff;
	padding: 10px 20px;
	cursor: pointer;
	border-radius: 50px;
	margin-left: 10px
}

#cookie-banner .close-btn {
	background: 0 0;
	border: none;
	font-size: 20px;
	font-weight: 700;
	color: #fff;
	cursor: pointer;
	margin-left: 10px
}

.vmg-card {
	border-radius: 16px;
	padding: 30px 20px;
	overflow: hidden;
	transition: transform .4s;
	cursor: default
}

.choose-btn,
.save-btn {
	font-size: 14px;
	cursor: pointer
}

.vmg-card::before {
	content: '';
	position: absolute;
	bottom: -100%;
	width: 100%;
	height: 100%;
	transition: bottom .5s;
	z-index: 0;
	border-radius: 16px
}

.vmg-card:hover::before {
	bottom: 0
}

.vmg-card h2,
.vmg-card p {
	position: relative;
	z-index: 1;
	color: #fff;
	transform: translateY(20px);
	transition: opacity .4s .2s, transform .4s .2s
}

.vmg-card ul li {
	transform: translateY(10px);
	transition: .3s
}

.icon-wrapper {
	background: #fff;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1;
	transition: transform .6s
}

.vmg-card:hover .icon-wrapper {
	transform: rotate(360deg)
}

.about-us-box .vmg-card {
	min-height: 250px
}

.dropdown-menu[data-bs-popper] {
	top: 72%
}

.cube-icon,
.eye-icon,
.flag-icon {
	width: 120px;
	transition: .2s
}

.contact-us {
	border: 1px solid #632497;
	border-radius: 5px
}

.contact-us input,
.contact-us textarea {
	border: 0;
	padding-left: 15px;
	width: 100%;
	outline: 0
}

.contact-us label {
	width: 100%;
	color: #fff;
	font-size: 18px;
	margin-bottom: 8px
}

.contact-us input {
	height: 40px;
	border-radius: 5px
}

.contact-us textarea {
	height: 100px;
	border-radius: 5px;
	padding-top: 10px
}

.contact-us input[type=file i] {
	width: 100%;
	height: 40px;
	border: 0;
	border-radius: 5px;
	outline: 0;
	background: #fff;
	padding: 5px 0 0 5px
}

.choose-btn {
	background: #2b0066;
	color: #fff;
	padding: 8px 16px;
	border-radius: 12px
}

.save-btn {
	background: #fff0;
	border: none;
	color: #2b0066
}

::file-selector-button {
	border: 2px solid #22005b;
	color: #fff;
	border-radius: 5px;
	background-color: #22005b;
	cursor: pointer
}

[type=submit].submit-btn {
	padding: 0;
	border-radius: 50px;
	height: 50px
}

.contact-banner {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 40px;
	padding: 30px 20px;
	background: linear-gradient(90deg, #2c0f74, #4b0c76);
	flex-wrap: wrap;
	border-radius: 5px
}

.contact-banner h1 {
	font-size: 35px;
	margin: 0
}

.phone-box {
	display: inline-flex;
	align-items: center;
	background: #fff;
	color: #333;
	padding: 10px 20px;
	border-radius: 40px;
	font-size: 25px;
	gap: 10px;
	font-weight: 600
}

.phone-box:hover {
	background-color: #e7e7e7
}

.phone-box img {
	width: 32px
}

.contact-section {
	display: flex;
	justify-content: space-around;
	padding: 30px 20px;
	background: linear-gradient(349deg, #200050, #12003a);
	flex-wrap: wrap;
	border-radius: 5px
}

.country h2 {
	font-size: 35px;
	margin-bottom: 15px
}

.country p {
	line-height: 1.6;
	font-size: 20px
}

.divider {
	width: 2px;
	background: rgb(255 255 255 / .2);
	height: 144px;
	margin: 0
}

.map-box {
	width: 520px;
	height: 300px;
	background: rgb(255 255 255 / .05);
	border: 1px solid;
	border-radius: 15px;
	padding: 12px
}

.map-box iframe {
	width: 100%;
	height: 100%;
	border: 0;
	border-radius: 10px
}

.map-card {
	width: 100%;
	height: 330px;
	border-radius: 14px;
	overflow: hidden;
	padding: 15px;
	border: 1px solid #632497
}

.map-card iframe {
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
	filter: grayscale(40%) contrast(90%) brightness(95%);
	transform: translateZ(0)
}

.map-card::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, var(--accent-1), var(--accent-2));
	opacity: var(--overlay-alpha);
	mix-blend-mode: multiply;
	pointer-events: none
}

.map-card::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 60%;
	background: linear-gradient(180deg, rgb(255 255 255 / .03), #fff0);
	pointer-events: none
}

.label {
	position: absolute;
	left: 18px;
	bottom: 18px;
	background: rgb(0 0 0 / .45);
	color: #fff;
	padding: 10px 14px;
	border-radius: 10px;
	font-size: 14px;
	line-height: 1.3;
	max-width: 72%;
	box-shadow: 0 6px 18px rgb(0 0 0 / .5)
}

.big-web,
.line-right,
.weback-img,
.why-card {
	position: relative
}

.label .title {
	font-weight: 600;
	margin-bottom: 6px;
	font-size: 15px
}

.country img {
	border-radius: 3px;
	margin: -7px 0 0;
	height: 27px
}

.service-icon i {
	color: #fff;
	font-size: 35px
}

.why-card {
	z-index: 2;
	padding: 2em;
	border-radius: 16px;
	background: linear-gradient(180deg, rgb(255 255 255 / .03), rgb(255 255 255 / .02));
	box-shadow: 0 10px 30px rgb(11 15 30 / .35), inset 0 1px 0 rgb(255 255 255 / .02);
	color: var(--text-on-accent);
	border: 1px solid
}

.why-bullets {
	list-style: none;
	padding: 0;
	margin: 0 0 1rem
}

.why-bullets li {
	display: flex;
	gap: .9rem;
	align-items: flex-start;
	margin-bottom: 25PX;
	color: #e6e9f2;
	font-size: 18PX
}

.why-bullets svg {
	flex: 0 0 34px;
	width: 34px;
	height: 34px;
	margin-top: 2px
}

.why-bullets .text {
	color: #e6e9f2
}

.colpadding,
.contact-padding {
	padding: 0 !important
}

.border_changed,
.we-assess,
.we-back,
.we-craft,
.we-define,
.we-deliver,
.we-gather {
	width: 486px;
	background-image: url(../images/bdr-top-how.webp), url(../images/bdr-right-how.webp);
	background-repeat: no-repeat, repeat-y;
	padding: 10px
}

.border_changed,
.we-define,
.we-deliver,
.we-gather {
	background-position: right top, right top;
	text-align: right;
	margin-left: 4px;
	float: right
}

.v-center {
	height: 358px;
	display: table
}

.we-assess,
.we-back,
.we-craft {
	background-position: left top, left top;
	text-align: left;
	margin-left: 88px
}

.how-bg img {
	margin-bottom: 20px
}

.v-center .v-table {
	display: table-cell;
	vertical-align: middle
}

.how-we-do-hbar-right {
	background: url(../images/how-we-do-hbar-right.png) 430px center no-repeat
}

.how-we-do-hbar-left {
	background: url(../images/how-we-do-hbar-left.png) left center no-repeat
}

.weback-img {
	text-align: center;
	margin-top: 125px;
	left: 124px;
	right: 0
}

.we-assess p,
.we-back p,
.we-craft p,
.we-define p,
.we-deliver p,
.we-gather p {
	font-size: 17px;
	margin: 5px 0;
	font-weight: 400
}

.we-assess h3,
.we-back h3,
.we-craft h3,
.we-define h3,
.we-deliver h3,
.we-gather h3 {
	font-size: 23px !important;
	margin: 3px 0 15px !important
}

.line-right {
	background: url(../images/line-right.png) 432px 141px no-repeat;
	z-index: 99999
}

.how-line-left,
.how-line-right {
	width: 78px;
	height: 1px;
	background: #902398;
	top: 191px;
	z-index: 99999;
	position: relative
}

.pagination li a:hover,
.pagination li.active a,
.visit-site-btn,
.visit-site-btn:hover {
	background: #902397;
	box-shadow: 0 0 20px rgb(140 0 255 / .5);
	color: #fff
}

.how-line-right {
	margin: 0 auto 0 478px
}

.how-line-left {
	margin: 0 auto 0 568px
}

.img-who-we-are-left {
	padding-right: 45px
}

.img-who-we-are-right {
	padding-left: 55px
}

.case-study-main h3 {
	color: #fff;
	font-size: 22px;
	font-weight: 400;
	margin-top: 25px
}

.big-web {
	display: inline-block
}

.visit-site-btn {
	position: absolute;
	bottom: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(10px);
	padding: 12px 30px;
	background: linear-gradient(152deg, rgb(144 35 151) 0, rgb(97 53 189) 100%);
	transform: scale(1.08);
	border-radius: 30px;
	font-weight: 600;
	letter-spacing: 1px;
	opacity: 0;
	transition: .3s
}

.big-web:hover .visit-site-btn {
	opacity: 1;
	transform: translateX(-50%) translateY(0)
}

.visit-site-btn:hover {
	background: linear-gradient(152deg, rgb(144 35 151) 0, #24006e 100%);
	transform: scale(1.08)
}

.pagination li a {
	padding: 10px;
	border: 1px solid #fff;
	color: #fff;
	font-weight: 700;
	font-size: 18px
}

.pagination li a:hover,
.pagination li.active a {
	background: linear-gradient(152deg, rgb(144 35 151) 0, rgb(97 53 189) 100%);
	transform: scale(1.08)
}

.testimonial-card {
	padding: 0;
	border-radius: 15px;
	color: #fff
}

.testimonial-card p {
	font-size: 18px;
	line-height: 1.7;
	margin-bottom: 20px;
	font-style: italic
}

.testimonial-card h5 {
	margin-bottom: 5px;
	font-weight: 600
}

.testimonial-card span {
	font-size: 18px;
	color: #bbb
}

.carousel-indicators button {
	background-color: #fff
}

.pagination li.disabled a {
	COLOR: #fff
}

.home-our-work img {
	height: 204px
}

.thank-cont-main {
	height: 320px;
	padding: 25px;
	vertical-align: middle;
	align-items: center;
	align-content: center;
	background: #1a0022;
	background: linear-gradient(152deg, rgb(26 0 34) 0, rgb(55 2 167) 100%);
	border-radius: 10px;
	border: 1px solid #3d0483
}

.service-icon img {
	width: auto;
	max-width: max-content
}

.site-map-link {
	color: #fff;
	font-weight: 4000;
	font-size: 22px
}

.blog-card h4 a:hover {
	color: #c07aff !important
}








.blog-dtl br{ display:none;}
.min-vh-hero {    padding: 100px 20px;}

.hero {
  position: relative;
  overflow: hidden;
  color: #ffffff;
  background: #030b24;    margin-bottom: 45px;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(3, 8, 25, .72) 0%, rgba(3, 8, 25, .56) 38%, rgba(3, 8, 25, .16) 64%, rgba(3, 8, 25, .08) 100%);
  z-index: 1;
}

.hero-bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
}

.container {
  max-width: 1160px;
}

.hero .container {
  z-index: 2;
}

.section-label {
  color: #8b42ff;
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: .04em;
}

.hero h1 {
  margin: 0;
    font-size: 40px;
    line-height: 25px;
  font-weight: 600;
  letter-spacing: 0;
  text-shadow: 0 2px 12px rgba(0,0,0,.25);
}
.hero p{    font-size: 22px;
    line-height: 30px;}

.accent-line {
  width: 60px;
  height: 4px;
  background: #4C38BD;
}

.hero-subtitle {
  max-width: 690px;
  color: rgba(255,255,255,.9);
  font-size: clamp(1.1rem, 2vw, 1.55rem);
  line-height: 1.35;
}

.post-meta {
  color: rgba(255,255,255,.9);
  font-size: .98rem;
}

.post-meta a {
  color: #5794ff;
}

.dot {
  width: 5px;
  height: 5px;
  background: currentColor;
  border-radius: 50%;
  opacity: .9;
}

.article-wrap {
  padding: 34px 0 26px;
}

.article-content {
  font-size: 1rem;
}

.article-content p {
  margin-bottom: .42rem;
}

.article-content hr {
  margin: 26px 0;
  border-color: #350d65;
  opacity: 1;
}

.emphasis {
  color: #ffffff;
  font-weight: 800;
}

.intro-copy {
  max-width: 690px;
}

.article-section {
  display: flex;
  gap: 18px;
}

.article-section h2 {
  margin: 4px 0 8px;
  color: #fff;
  font-size: 1.55rem;
  font-weight: 600;
  line-height: 1.15;
}

.article-section ul {
  margin: 8px 0 20px;
  padding-left: 20px;
}

.article-section li {
  margin-bottom: 4px;
  color: #fff;
}

.article-section li::marker {
  color: #512bd8;
}

.icon-box {
  flex: 0 0 60px;
  height: 60px;
  display: grid;
  place-items: center;
  color: #5926d8;
  background: linear-gradient(135deg, #e4dcff, #f2efff);
  border-radius: 8px;
  font-size: 2rem;
  font-weight: 800;
}

.question-list {
  width: 100%;
  max-width: 650px;
  margin: 18px 0 18px;
}

.question-row {
  display: grid;
  grid-template-columns: 24px 170px 1fr;
  gap: 12px;
  align-items: start;
  margin-bottom: 10px;
  font-size: .92rem;
  line-height: 1.25;
}

.number {
  width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  color: #fff;
  background: #4C38BD;
  border-radius: 50%;
  font-size: .76rem;
  font-weight: 800;
}

.question-row strong {
  color: #fff;
  font-size: .86rem;
}

.question-row span {
  color: #fff;
 
}

.closing-copy {
  margin-top: 22px;
  font-size: 1.08rem;
  line-height: 1.42;
}

.closing-copy span {
  color: #fff;
  font-weight: 800;
}

aside {
  margin-top: 0;
}

.sidebar-card {
  background: #fff;
  border: 1px solid rgba(6, 19, 58, .08);
  border-radius: 8px;
  box-shadow: 0 12px 36px rgba(21, 31, 68, .1);
}

.framework-card {
  padding: 25px 18px 22px;
}

.framework-card h3 {
  margin: 0 20px 10px;
  color: #000;
  font-size: 1.45rem;
  line-height: 1.12;
  font-weight: 800;
}

.framework-card > p {
  margin: 0 20px 22px;
  color: #121b3a;
  font-size: 1rem;
  line-height: 1.3;
}

.framework {
  display: grid;
  gap: 4px;
}

.framework-row {
  min-height: 96px;
  display: grid;
  grid-template-columns: 128px 48px 1fr;
  gap: 12px;
  align-items: center;
  overflow: hidden;
  background: linear-gradient(90deg, #ffffff, #f8f8fb);
  border-radius: 8px;    padding: 0px 10px 0px 0px;
}

.step {
  height: 113px;
  display: grid;
  place-items: center;
  color: #ffffff;
  font-size: 3rem;
  font-weight: 600;
  clip-path: polygon(8% 0, 92% 0, 100% 100%, 0 100%);
  border-radius: 12px;
}

.step-5 { background: linear-gradient(180deg, #7d35ef, #5732d1); }
.step-4 { background: linear-gradient(180deg, #3d64f0, #2a54d8); }
.step-3 { background: linear-gradient(180deg, #3383f5, #2174e1); }
.step-2 { background: linear-gradient(180deg, #32bdd5, #1d9fc5); }
.step-1 { background: linear-gradient(180deg, #246bd0, #1c4faa); }

.step-icon {
  color: #245ef2;
  font-size: 2rem;
  text-align: center;
}

.framework-row strong,
.ai-layer strong {
  display: block;
  color: #000;
  font-size: .82rem;
  line-height: 1.15;
}

.framework-row small,
.ai-layer small {
  display: block;
  margin-top: 4px;
  color: #050817;
  font-size: .74rem;
  line-height: 1.2;
}

.down-arrow {
  margin: -2px 0;
  color: var(--ink);
  text-align: center;
  font-size: 2rem;
  line-height: .9;
  font-weight: 800;
}

.ai-layer {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 14px;
  align-items: center;
  min-height: 102px;
  padding: 15px 20px;
  color: #ffffff;
  background: linear-gradient(135deg, #030831, #062056);
  border-radius: 8px;
}

.ai-layer strong,
.ai-layer small {
  color: #ffffff;
}

.ai-layer strong {
  font-size: 1.05rem;
}

.ai-layer small {
  font-size: .85rem;
}

.ai-icon {
  color: #8b42ff;
  font-size: 60px;
}

.quote-card {
  margin-top: 22px;
  padding: 22px 18px 22px;
  color: #071350;
  background: linear-gradient(135deg, #f8f7ff, #eef1ff);
  box-shadow: none;
}

.quote-mark {
  color: #6e35e8;
  font-size: 4rem;
  line-height: .55;
  font-weight: 800;
}

.quote-card p {
  margin-bottom: 10px;
  color: #000;
}

.share-box {
  padding: 22px 4px 0;
}

.share-box p {
  margin-bottom: 14px;
  color: #ffffff;
  font-size: 1rem;
}

.share {
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  color: #ffffff;
  border-radius: 50%;
  font-weight: 800;
  text-transform: uppercase;
  text-decoration: none;
}

.linkedin { background: #1577b8; }
.twitter { background: #3188ee; }
.facebook { background: #2c55a4; }
.link {
  color: #4f5b73;
  background: #e9edf5;
  font-size: .9rem;
}

@media (max-width: 991.98px) {
  .min-vh-hero {
    min-height: 430px;
  }

  aside {
    margin-top: 4px;
  }
}

@media (max-width: 767.98px) {
  .min-vh-hero {
    min-height: 300px;
  }

  .hero h1 {
    font-size: 2.75rem;
  }

  .article-section {
    gap: 14px;
  }

  .icon-box {
    flex-basis: 48px;
    height: 48px;
    font-size: 1.45rem;
  }

  .question-row {
    grid-template-columns: 24px 1fr;        display: block;
        margin-bottom: 25px;
  }

  .question-row span:last-child {
    grid-column: 2;
  }

  .framework-card {
    padding: 20px 12px;
  }

  .framework-card h3,
  .framework-card > p {
    margin-left: 8px;
    margin-right: 8px;
  }

  .framework-row {
    grid-template-columns: 86px 38px 1fr;
    min-height: 90px;
  }

  .step {
    height: 90px;
    font-size: 2.3rem;
  }

  .framework-row strong {
    font-size: .75rem;
  }

  .framework-row small {
    font-size: .68rem;
  }

  .quote-card {
    padding: 32px 34px;
  }
}