@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&display=swap");

body {
	font-family: "Open Sans", sans-serif;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

/* body {
    font-family: 'Open Sans';
} */

html,
body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	/* Hide horizontal overflow */
	scroll-behavior: smooth;
	/* Optional for smooth scrolling */
	overflow-y: auto !important;
}

/*#region navbar */
.navbar {
	position: fixed;
	height: 95px;
	top: 20px;
	/* Adjust this value to move it down */
	right: 5%;
	width: 90%;
	/* Adjust width if needed */
	display: flex;
	justify-content: space-between;
	align-items: center;
	z-index: 1000;
	background: #24014e99;

	/* background: rgba(255, 255, 255, 0.1); */
	backdrop-filter: blur(24px);
	padding-top: 10px;
	padding-right: 30px;
	padding-bottom: 10px;
	padding-left: 10px;
	gap: 113px;
	border-radius: 200px;
}

.navbar-container {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

/* Navbar Links */
.navbar-links {
	list-style: none;
	display: flex;
	position: absolute;
	top: 50%;
	gap: 45px;
	/* Optional if you also want to center it horizontally */
	transform: translateY(-50%) translateX(50%);
}

.header-logo {
	padding-right: 20px;
	padding-left: 20px;
	gap: 10px;
}

.navbar-links li {
	display: inline;
}

.navbar-links a {
	text-decoration: none;
	color: white;
	font-weight: bold;
	transition: color 0.3s;
}

.navbar-search {
	display: flex;
	/* gap: 20px; */
	position: absolute;
	left: 80%;
	/* Optional if you also want to center it horizontally */
}

.navbar-search a {
	color: #ffffff;
	size: medium;
}

.language-selector {
	display: flex;
	align-items: center;
	gap: 4px;
	/* Space between text and icon */
	padding: 10px;
	color: white;
	cursor: pointer;
	position: absolute;
	left: 75%;
	/* Optional if you also want to center it horizontally */
}

.dropdown-icon {
	position: absolute;
	left: 75%;
	/* Optional if you also want to center it horizontally */
	transform: translateY(15%);
}

/* Logo */
.navbar-logo a {
	text-decoration: none;
	font-size: 24px;
	font-weight: bold;
	color: white;
	align-items: center;

	position: absolute;
	top: 50%;
	left: 9%;
	transform: translate(-50%, -50%);
}

/* Button */
.navbar-button .btn {
	text-decoration: none;
	/* background: #7853ec; */
	background: linear-gradient(90deg, #a538f9 0%, #5e63e5 100%);

	/* background: rgba(255, 255, 255, 0.2); */
	border-radius: 40px;
	color: white;
	transition: 0.3s;
	height: 56px;
	text-align: center;
	align-content: center;
}

.navbar-button .btn:hover {
	background: rgba(255, 255, 255, 0.4);
}

.navbar-button {
	/* display: flex; */
	bottom: 70% align-items;
}

.hamburger {
	display: none;
}

.navbar .navbar-nav .nav-link {
	color: #000000;
	font-size: 1.1em;
}

.carousel,
.carousel .carousel-inner,
.carousel .carousel-inner .active,
.carousel .carousel-inner .carousel-item,
.view,
body,
html {
	height: 100%;
}

@media only screen and (max-width: 768px) {
	.navbar {
		background-color: #1c2331;
	}

	.menuitem {
		display: none;
	}
}

.download {
	background: linear-gradient(to right, #a13af8, #6261e6) !important;
	height: 50px;
	font-weight: 700;
	font-size: 13px;
	color: var(--Grayscale-Text-Icon-Negative, #f5f5f5);
}

/*#endregion */

/* Hero Section */
.hero {
	position: relative;
	width: 100%;
	height: 111vh;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

html {
	scroll-behavior: smooth;
	/* Enables smooth scrolling */
}

.hero {
	position: relative;
	width: 100%;
	height: 100vh;
	display: flex;
	align-items: flex-end;
	justify-content: center;
}

.bg-video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: -1;
}

.video-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #39018133;
	/* Semi-transparent purple overlay */
	z-index: 1;
	/* Ensures the overlay is above the video */
	transition: all 0ms ease;
}

.download-video {
	opacity: 30%;
}

.overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, #14001b 0%, #14001b 100%);
	z-index: -2;
}

.overlay-headers {
	transform: translateY(-200%);
	/*Start off-screen (above) */
	/*Infinite loop */
	z-index: 2;
	/* Ensures the overlay is above the video */
}

.hero-text-content {
	display: block;
}

.hero-text-content.is-entering {
	animation: heroTextEnter 0.42s ease forwards;
}

.hero-text-content.is-exiting {
	animation: heroTextExit 0.32s ease forwards;
}

@keyframes heroTextEnter {
	from {
		opacity: 0;
		transform: translateY(-42px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes heroTextExit {
	from {
		opacity: 1;
		transform: translateY(0);
	}

	to {
		opacity: 0;
		transform: translateY(-42px);
	}
}

.home-heading {
	font-size: 40px;
}

.lighter {
	font-weight: lighter;
}

.bold {
	font-weight: bold;
}

.home-subheading {
	font-size: 30px;
}

.home-sub-subheading {
	font-size: 27px;
}

/* Animation for sliding in and out */
@keyframes slideInAndOut {
	0% {
		transform: translateY(-200%);
		/* Off-screen (above) */
		opacity: 0;
	}

	10% {
		transform: translateY(0);
		/* Slide into view */
		opacity: 1;
	}

	70% {
		transform: translateY(0);
		/* Stay in place */
		opacity: 1;
	}

	80% {
		transform: translateY(-100%);
		/* Slide out of view (above) */
		opacity: 0;
	}

	100% {
		transform: translateY(-200%);
		/* Off-screen (above) */
		opacity: 0;
	}
}

/* Tab Bar */
.tab-bar {
	position: relative;
	bottom: 20px;
	width: 100%;
	height: 10%;
	display: flex;
	justify-content: center;
	background: rgba(204, 203, 203, 0.7);
	padding: 10px 0;
}

.tabs {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	width: 100%;
	justify-content: space-around;
	position: relative;
	z-index: 1;
	/* Ensure tabs appear above slider */
}

.tab {
	color: white;
	font-size: 1.2rem;
	text-align: center;
	flex: 1;
	cursor: pointer;
	transition: color 0.3s ease;
	position: relative;
	/* Required for proper stacking */
}

.tab.active {
	font-weight: bold;
	color: black;
}

.tabs li {
	padding: 10px 10px;
	margin: 0px 60px;
	color: white;
	cursor: pointer;
	transition: 0.5s ease-in-out;
}

.tabs li.active {
	background: rgba(255, 255, 255);
	/* border-radius: 5px; */
	margin: -10px 70px;
	padding: 20px;
}

.home-slider {
	position: absolute;
	bottom: 0;
	height: 100%;
	width: calc(100% / 4);
	/* Calculate exact width for 4 tabs */
	background: rgb(255, 255, 255);
	border-radius: 4px;
	transform: translateX(0);
	transition: transform 0.5s linear;
	/* Match auto-slide timing */
	left: 0;
	z-index: 0;
	/* Place behind tabs */
}

/* Overlay (Centered Text) */
.overlay-headers {
	position: absolute;
	transform: translateX(-50%);
	color: white;
	font-size: 1.5rem;
	/* Adjust based on design */
	font-weight: bold;
	text-align: center;
	white-space: nowrap;
	transition:
		opacity 0.5s ease-in-out,
		top 0.5s ease-in-out;
	max-width: 80%;
	/* Ensure responsiveness */
	line-height: 1.2;
}

/* Style adjustments to match design */
.overlay-headers h3 {
	font-size: 1rem;
	font-weight: 400;
}

.overlay-headers h1 {
	font-size: 1rem;
	font-weight: 700;
	text-transform: uppercase;
}

/* Mobile Responsive */
@media (max-width: 768px) {
	.navbar-container {
		flex-direction: column;
		align-items: flex-start;
	}

	.navbar-links {
		display: none;
		flex-direction: column;
		gap: 10px;
		width: 100%;
		background: rgba(255, 255, 255, 0.1);
		border-radius: 10px;
		padding: 10px;
	}

	.navbar-links.active {
		display: flex;
	}

	.hamburger {
		display: block;
		cursor: pointer;
	}

	.hamburger .bar {
		display: block;
		width: 25px;
		height: 3px;
		margin: 5px;
		background: white;
	}
}

.about-us {
	padding: 100px;
	text-align: center;
	height: 950px;

	.try-free {
		font-size: 2rem;
		margin-bottom: 1rem;
		width: 11%;
	}

	.why-choose {
		font-size: 2.5rem;
		font-weight: bold;
		margin-bottom: 2rem;
	}

	.description {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 2rem;
		position: relative;

		.img1 {
			width: 40%;
			/* Adjust width for the image */
			padding: 2rem 0;
		}

		.desc-content {
			text-align: left;
			width: 60%;
			/* Adjust width for the text content */
			padding: 2rem;
			z-index: 1;

			.desc-heading {
				font-size: 2.2rem;
				margin-bottom: 1rem;
				color: #333;

				.blue {
					color: #1a54ec;
				}
			}

			.desc-text {
				font-size: 1.5rem;
				line-height: 1.6;
				color: #666;
			}

			.description-text {
				background-color: rgba(255, 255, 255, 0.7);
				padding: 2rem;
				position: absolute;
				top: 28%;
			}

			/* Add background images */
			/* &::before {
                content: '';
                position: absolute;
                top: 3%;
                left: 50%;
                width: 300px;
                height: 300px;
                background: url('/assets/images/what-is-autograph/what is autograph image 02.png') no-repeat;
                background-size: contain;
                z-index: -1;
                opacity: 0.8;
            }

            &::after {
                content: '';
                position: absolute;
                top: -5%;
                right: 4%;
                width: 300px;
                height: 300px;
                background: url('/assets/images/what-is-autograph/what is autograph image 03.png') no-repeat;
                background-size: contain;
                z-index: -1;
                opacity: 0.8;
            } */
		}
	}
}

.details {
	padding: 5rem;
	height: 50%;
	width: 60%;
	z-index: 2;

	.text-white {
		color: white;
	}

	.content-details {
		font-size: larger;
		padding: 10px 0;
	}
}

.swiper-wrapper {
	position: absolute !important;
	height: 50% !important;
}

.why-choose-us {
	text-align: center;
	padding: 100px;
	transition: all 0.4s ease-in-out;
	height: 820px;
}

.try-free {
	/* font-size: 28px;
    font-family: Arial, sans-serif;    */
	background: linear-gradient(
		to right,
		#d05efd,
		#bc4bfd,
		#a04dfa,
		#7a4ff6,
		#2d53ee
	);
	color: transparent;
	background-clip: text;
	-webkit-background-clip: text;
	font-size: 22px;
	font-weight: 600;
	font-family: "Montserrat", sans-serif;
}

.w-22 {
	width: 22% !important;
}

.w-35 {
	width: 35% !important;
}

.w-43 {
	width: 43% !important;
}

/* .fs-25{
    font-size: 25px !important;
} */

.fs-20 {
	font-size: 20px !important;
}

.fs-49 {
	font-size: 49px !important;
}

.why-choose {
	display: flex;
	font-size: 48px;
	font-weight: 500;
}

.features {
	display: flex;
	justify-content: left;
	flex-wrap: wrap;
	gap: 20px;
	margin-top: 30px;
}

.feature:hover .icon-container {
	transform: scale(1.1);
}

.feature:hover {
	transform: translateY(-5px);
	border-radius: 10px;
	/* background-color: rgba(209, 206, 206, 0.8); */
	/* background-color: #fef9ff; */
	padding: 10px;
}

.feature:hover .rounded-button {
	background: #7a328e;
	color: #ffffff;
}

.feature:hover h3 {
	color: #48055f;
	font-size: xx-large;
	font-weight: bold;
}

.feature {
	width: 25%;

	p {
		font-size: 20px;
		text-align: center;
		padding: 0px 50px;
	}
}

/*#section8 region */
.come-in {
	transform: translateY(150px);
	animation: come-in 3s ease forwards;
}

.come-in:nth-child(odd) {
	animation-duration: 2s;
	/* So they look staggered */
}

@keyframes come-in {
	to {
		transform: translateY(0);
	}
}

.come-left {
	transform: translateX(0px);
	animation: come-in 0.8s ease forwards;
}

.come-in:nth-child(odd) {
	animation-duration: 1s;
	/* So they look staggered */
}

@keyframes come-left {
	to {
		transform: translateX(150);
	}
}

/*#endregion */

/*#region digiblock */

.digi-block {
	position: relative;
	opacity: 1;
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 420px;
	/*background-image: url("../assets/images/bgimg2.png");*/
	background: linear-gradient(to right, #4e0263, #263ec8);
}

.digi-block .container {
	padding: 3% 0px;
}

.digi-block .row,
.digi-block .row.d-none,
.digi-block .virtual-bank-section {
	display: flex !important;
	opacity: 1 !important;
	visibility: visible !important;
}

.digi-head {
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	color: #3e70ee;
}

.digi-headcontent {
	font-size: 20px;
	font-weight: bold;
	color: #000000;
}

.digi-bl2-head {
	color: #000000;
}

.digi-bl2-content {
	color: #000000;
	padding-right: 50px;
}

.digiback {
	background: linear-gradient(to right, #4e0263, #263ec8);

	width: 100%;
	height: 100%;
	transition: opacity 3s;
	opacity: 0;
	position: absolute;
}

/*#endregion */

/*#region bulbblock */
.bulbblock {
	height: 95vh;
}

.bulbblock .backimg {
	pointer-events: none;
	position: absolute;
	width: 100%;
	height: 95vh;
	z-index: -2;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: opacity 2s;
	background-color: #808080;
}

.bulb-text {
	padding-top: 5vw;
}

.bulb-head {
	font-size: 1.5vw;
	color: #304053;
	transition: color 2s;
	font-weight: bold;
}

.bulb-content {
	color: #304053;
	transition: color 2s;
	font-size: 0.8vw;
}

.counter {
	margin-top: 10vw;
	margin-bottom: 10px;
}

.countcircle {
	width: 180px;
	height: 180px;
	border: 7px solid #304053;
	border-radius: 50%;
}

.countcircle img {
	margin: 15px auto 2px 64px;
	width: 42px;
	height: 44px;
}

.countcircle h3 {
	width: 55px;
	margin: 0px auto 0px auto;
	font-size: 38px;
	color: #304053;
	transition: color 2s;
}

.countcircle h3 small {
	font-size: 30px;
	color: #fff;
	text-transform: initial;
	transition: color 2s;
}

.countcircle p {
	width: 92px;
	margin: 0px auto;
	text-align: center;
	font-size: 15px;
	color: #304053;
	transition: color 2s;
}

.helpblock-head span {
	font-size: 15px;
	width: 50%;
	padding: 8px;
	color: #3e70ee;
	border: 1px solid #3e70ee;
	border-radius: 10px;
	text-align: center;
	font-weight: bold;
	background-color: #fff;
	-moz-box-shadow: inherit;
	-webkit-box-shadow: inherit;
	box-shadow: 1px 1px 6px #b8b8b8;
	cursor: pointer;
}

.helpblock-head span:hover {
	background-color: #3e70ee;
	color: #fff;
	transition: background-color 0.5s;
	transition: color 0.5s;
}

/*#endregion */

@media (max-width: 575.98px) {
	.bulbblock .backimg {
		pointer-events: none;
		position: absolute;
		width: 100%;
		height: 800px;
		z-index: -1;
		background-position: 40% -140px;
		background-repeat: no-repeat;
		background-size: cover;
		transition: opacity 2s;
		background-color: #808080;
		font-size: 16px;
	}

	.sliderblock {
		margin-top: 0px;
	}

	.logo {
		height: 34px !important;
	}

	/*.bulb-head {
        font-size: 16px;
        color: #304053;
        transition: color 2s;
    }*/

	.menuitem {
		display: none;
	}

	#myNavbarToggler10 {
		background-color: #0c173a !important;
		color: #fff;
	}

	#myNavbarToggler10 > ul > li > a {
		color: #fff;
	}

	.countercl {
		padding: 0px;
		margin: 0px;
	}

	.countcircle {
		width: 170px;
		height: 170px;
		border: 5px solid #3e70ee;
		border-radius: 50%;
		margin-bottom: 10px;
		padding: 0px;
	}

	.countcircle img {
		margin: 6% auto 5% 35%;
		width: 42px;
		height: 44px;
	}

	.countcircle h3 {
		width: 50px;
		margin: 0px auto 0px auto;
		font-size: 28px;
		color: #304053;
		transition: color 2s;
		font-weight: bold;
	}

	.countcircle h3 small {
		font-size: 28px;
		color: #304053;
		text-transform: initial;
		transition: color 2s;
	}

	.countcircle p {
		width: 100px;
		margin: 0px auto;
		text-align: center;
		font-size: 14px;
		color: #304053;
		transition: color 2s;
	}

	.counter {
		background-color: #f5f5f5;
		margin-top: 20px;
		padding: 15px;
	}

	.cl2 {
		padding-left: 5px;
	}

	.counter h4 {
		text-align: center;
		color: #3e70ee;
		font-weight: bold;
		font-size: 22px;
	}

	.abouthead {
		color: #fff;
		font-size: 18px;
		font-family: "Segoe UI";
		padding: 0px;
	}

	.aboudesc {
		color: #fff;
		font-size: 14px;
		font-family: "Segoe UI";
		padding: 0px;
	}

	.abouthover {
		background-color: #0c173a;
		width: 400vw;
		height: 400vw;
		overflow: hidden;
		transition:
			width 3s,
			height 3s;
		position: absolute;
		margin-top: 175px;
		border-radius: 50%;
		opacity: 1;
	}

	.inpresense {
		width: 100%;
		height: 269px;
		background-image: url("../assets/images/preback.png");
		background-position: center;
		background-size: 100%;
	}

	.helpblock-head h5 {
		font-size: 15px;
	}

	.helpblock-head h2 {
		font-size: 30px;
	}

	.helpblock-head p {
		font-size: 20px;
	}

	.helpblock-head button {
		font-size: 15px;
		width: 80%;
		padding: 8px;
		color: #3e70ee;
		border: 1px solid #3e70ee;
		border-radius: 15px;
		text-align: center;
		margin: 30px auto;
		font-weight: bold;
		background-color: #fff;
		-moz-box-shadow: inherit;
		-webkit-box-shadow: inherit;
		box-shadow: 1px 1px 6px #b8b8b8;
	}

	.footer {
		font-size: 12px;
		padding: 0px;
	}

	.slidplatform p {
		background-color: transparent;
		border: 1px solid #fff;
		padding: 12px;
		width: 100%;
		font-size: 16px;
		border-radius: 25px;
		font-weight: bold;
		color: #fff;
		text-align: center;
		margin-top: 22px;
	}
}

@media (max-height: 1000px) {
	.bulbblock {
		height: 100vh;
	}

	.bulbblock .backimg {
		height: 100vh;
	}
}

@media (max-height: 1079px) {
	.bulbblock {
		height: 100vh;
	}

	.bulbblock .backimg {
		height: 100vh;
	}
}

@media (min-height: 1080px) {
	.bulbblock {
		height: 87vh;
	}

	.bulbblock .backimg {
		height: 87vh;
	}
}

.accordion .fa {
	margin-right: 0.5rem;
}

.accordion button,
.accordion button:hover,
.accordion button:focus {
	text-decoration: none;
}

.btn-link:hover {
	text-decoration: none;
}

.accordion .fa {
	margin-right: 0.5rem;
}

.accordion button,
.accordion button:hover,
.accordion button:focus {
	text-decoration: none;
}

.btn-link:hover {
	text-decoration: none;
}

.card {
	border: none;
	margin: 10px 0px;
	background-color: transparent;
}

.card-header {
	background-color: transparent;
	border: none;
	border-radius: 0;
	margin-bottom: -1px;
	padding-top: 0px;
	padding-bottom: 0px;
	margin-bottom: 20px;
	padding: 0px;
}

.card-header span {
	font-size: 16px;
	background-color: transparent;
	font-weight: bold;
}

.card-header p {
	font-size: 28px;
	margin-top: -10px;
	line-height: 2;
}

.card-header .col-8 {
	padding-left: 26px;
	padding-top: 18px;
}

.accordion .card-body {
	padding-top: 0;
	padding-bottom: 0;
	margin-top: -8px;
}

.accordion > .card > .card-header {
	border-radius: 0;
	margin-bottom: 10px;
}

.panel-title > a:before {
	float: right !important;
	font-family: "Segoe UI";
	content: "-";
	font-weight: normal;
	font-size: 42px;
	margin-top: -10px;
}

.panel-title > a.collapsed:before {
	float: right !important;
	font-family: "Segoe UI";
	content: "+";
	font-weight: normal;
	font-size: 30px;
	margin-top: 0px;
}

.panel-title > a:hover,
.panel-title > a:active,
.panel-title > a:focus {
	text-decoration: none;
}

.owl-carousel .item {
	height: 600px;
	border-radius: 15px;
}

.owl-carousel .item h4,
.owl-carousel .item h4 h5 {
	line-height: 1.4;
}

.owl-carousel .item1 {
	background-image: url("../assets/images/bulbmb1.png");
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: top;
	padding-top: 65%;
	color: #fff;
	font-weight: normal;
}

.owl-carousel .item2 {
	background-image: url("../assets/images/bulbmb2.png");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top;
	color: #fff;
	font-weight: normal;
}

.owl-carousel .item2 .p1 {
	font-size: 18px;
}

.owl-carousel .item2 .p2 {
	font-size: 20px;
}

.bulb-mb-block .owl-dots {
	display: none;
}

.helpitem img {
	width: 62px;
	height: 62px;
}

.inpresense h3 {
	text-align: center;
	font-size: 21px;
	color: #fff;
	padding-top: 41px;
}

/*# edrine edrine*/

.body-test {
	font-family: Arial, sans-serif;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	overflow: hidden;
	position: relative;
	background: url("images/lady.png") no-repeat center center/cover;
}

.container-test {
	position: relative;
	width: 100%;
	height: 100vh;
	font-family: Arial, sans-serif;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	overflow: hidden;
	position: relative;
	background: url("images/lady.png") no-repeat center center/cover;
}

.content {
	position: absolute;
	top: 50%;
	left: 10%;
	transform: translateY(-50%);
	max-width: 500px;
	color: white;
}

.h1-element {
	font-size: 20px;
	font-weight: bold;
	color: #a64dff;
}

.h3-element {
	font-size: 34px;
	font-weight: 100;
	/* color: #ddd; */
	backdrop-filter: Transparency;
	margin: 10px 0;
}

.p-element {
	font-size: 18px;
	font-weight: 300;
	color: #ccc;
	line-height: 1.6;
	margin-bottom: 20px;
}

.store-links {
	display: flex;
	gap: 10px;
	margin-top: 20px;
}

.store-links img {
	height: 60px;
	width: 190px;
}

.qr-code {
	position: absolute;
	right: 10%;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	flex-direction: column;
	align-items: center;
}

.qr-code img {
	width: 120px;
	height: 120px;
}

.qr-code span {
	color: white;
	font-size: 16px;
	margin-top: 10px;
}

/* section6 */

.virtual-bank-section {
	/* background: linear-gradient(to right, #4e0263, #263ec8); */
	padding: 60px 0;
	border-radius: 0px;
	width: 100%;
	box-sizing: border-box;
	margin: 0px -20px;
	color: white;
	text-align: left;
	display: flex;
	flex-direction: column;
	position: relative;
}

/* .virtual-bank-section h1 {
    font-size: 22px;
    font-weight: 600;
    font-family: 'Montserrat', sans-serif;

    font-family: Open Sans;
font-weight: 700;
font-size: 25px;
line-height: 30px;
letter-spacing: 0%;


} */

.virtual-bank-section h2 {
	/* font-size: 40px;
    font-weight: 200;
    margin: 10px 0; */

	/* font-family: Inter; */
	font-weight: 400;
	font-size: 49px;
	line-height: 58.8px;
	letter-spacing: 0%;
}

.virtual-bank-section p {
	font-size: 24px;
	font-weight: 400;
	line-height: 1.6;
	width: 66%;
	word-wrap: break-word;
	overflow-wrap: break-word;
	hyphens: auto;
	font-family: Open Sans;
	letter-spacing: 0%;
	line-height: 30px;
	color: var(--color-grey-96, #f5f5f7);
}

.virtual-bank-section ul {
	list-style: none;
	padding: 0;
	/* font-size: 16px; */
	color: #cdcdcd;

	font-family: Open Sans;
	font-weight: 400;
	font-size: 20px;
	line-height: 24px;
	letter-spacing: 0%;
}

.virtual-bank-section ul li::before {
	content: "\2022";
	color: white;
	/* font-weight: bold; */
	display: inline-block;
	width: 1em;
	margin-left: 1em;
}

.cta-button {
	/* background: linear-gradient(to right, #a64dff, #816aff); */
	background: linear-gradient(90deg, #a538f9 0%, #5e63e5 100%);
	box-shadow: 0px 8px 10px 0px #00000040;
	color: white;
	padding: 15px 30px;
	border: none;
	border-radius: 45px;
	cursor: pointer;
	margin-top: 20px;
	display: inline-block;
	position: absolute;
	right: 5%;
	top: 42%;
	transform: translateY(-50%);
	height: 80px;
	min-height: 80px;
	width: 292px;

	font-weight: 700;
	font-size: 20px;
	line-height: 24px;
	letter-spacing: 0%;
}

/* section 7 */

.faq-main-container {
	margin: 0 9%;
}

.faq-header {
	font-size: 3rem;
	font-weight: bold;
	text-align: left;
	color: white;
}

.faq-box {
	background: rgba(255, 255, 255, 0.05);
	border: 2px solid rgba(255, 255, 255, 0.3);
	padding: 20px;
	margin: 10px 0;
	border-radius: 5px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	/* Align content to the left */
	cursor: pointer;
	backdrop-filter: Transparency;
	/* backdrop-filter: blur(10px); */
	max-width: 620px;
	width: 100%;
	text-align: left;
	color: white;
	gap: 16px;
}

.p-l-45 {
	padding-left: 45px;
}

.faq-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(38, 1, 81, 0.5);
	/* Semi-transparent purple overlay */
	z-index: -1;
	/* Ensures the overlay is above the video */
	transition: all 0ms ease;
}

.faq-box span {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-grow: 1;
}

.faq-box .card-icon {
	font-size: 1.5rem;
	/* Adjust icon size */
	color: white;
	/* Ensure icons are visible */
	min-width: 30px;
	/* Keeps icons aligned properly */
}

.faq-box .card-icon {
	font-size: 1.5rem;
	color: white;
	min-width: 30px;
	/* transform: translateY(-12px); */
	/* Move icon down */
	/* Use -3px to move it up */
}

.faq-icon {
	font-size: 1.8rem;
	color: white;
}

.faq-box:hover {
	background: rgba(255, 255, 255, 0.2);
}

/* question mar and circle */
.qn-mark {
	width: 548.74px;
	height: 398.21px;
	left: 108px;
	top: 47.55px;
	margin-top: 50px;
}

.text-overlay {
	position: absolute;
	top: 55%;
	/* Moves text down */
	left: 50%;
	transform: translate(-40%, -50%);
	/* Center text inside circle */
	color: white;
	text-align: center;
	max-width: 60%;
}

.text-overlay strong {
	font-size: 1.5rem;
	display: block;
	margin-bottom: 10px;
}

.text-overlay p {
	font-size: 1rem;
	line-height: 1.4;
}

h1 {
	font-size: 24px;
	font-weight: 600;
	color: #6d5cdf;
	text-align: left;
	margin-bottom: 2;
}

.faq-answer {
	display: none;
	margin-top: 5px;
	margin-left: 15px;
	font-size: 14px;
	color: white;
	padding: 10px;
	/* background: #fff;
    border-left: 4px solid #7b5f39; */
	border-radius: 5px;
	max-width: 485px;
}

/* .faq-container.active .faq-answer {
    display: block;
} */

/* section8 help section */

.contact-container {
	display: flex;
	justify-content: center;
	align-items: center;
	background: transparent;
	border: 1px solid #a258ed;
	border-radius: 12px;
	width: 40%;
}

.contact-form {
	width: 600px;
	padding: 30px;
	border-radius: 15px;
	background: transparent;
	backdrop-filter: blur(10px);
	text-align: center;
	color: white;
}

.contact-form h2 {
	font-family: Open Sans;
	font-weight: 600;
	font-size: 34px;
	line-height: 46.3px;
	letter-spacing: 0%;
	text-align: left;
	/* margin-bottom: 20px; */
}

.contact-form label {
	display: block;
	font-size: 12px;
	text-align: left;
	margin-top: 10px;
	color: rgba(255, 255, 255, 0.8);
}

.p {
	color: rgba(255, 255, 255, 0.8);
}

.contact-form input,
.contact-form textarea {
	width: 100%;
	padding: 2px;
	margin-top: 2px;
	border: none;
	border-bottom: 1px solid rgba(255, 255, 255, 0.5);
	background: transparent;
	color: white;
	font-size: 14px;
	outline: none;
	transition: border-bottom 0.3s ease;
}

.contact-form input:focus,
.contact-form textarea:focus {
	border-bottom: 1px solid #846c8d;
}

.contact-form textarea {
	height: 80px;
	resize: none;
}

.contact-form button {
	width: 100%;
	padding: 12px;
	margin-top: 20px;
	border: none;
	border-radius: 25px;
	color: white;
	font-size: 14px;
	cursor: pointer;
	background: linear-gradient(90deg, #a538f9 0%, #5e63e5 100%);
}

/* .contact-form button:hover {
    background: linear-gradient(to right, #c99cff, #a258ed);
} */

.social-media {
	margin-top: 20px;
	width: 90%;
	font-size: 16px;
	text-align: left;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.social-icons {
	display: flex;
	gap: 10px;
	color: #5e63e5;
}

.social-icons a {
	color: white;
	text-decoration: none;
	font-size: 20px;
}

.footer {
	font-size: 10px;
	margin-top: 20px;
	width: 90%;

	text-align: left;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.rounded-button {
	width: 90px;
	height: 90px;
	background: transparent;
	/* Transparent by default */
	color: #7a328e;
	/* Text color that matches the border */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	border-radius: 50%;
	text-decoration: none;
	border: 1px solid #7a328e;
	/* Border added */
	transition:
		background 0.2s,
		color 0.2s,
		border-color 0.2s;
}

.rounded-button:hover {
	/* background: #7a328e; */
	/* Background fills on hover */
	color: #ffffff;
	/* Text color changes to white on hover */
}

#home {
	z-index: 1;
}

#about-us {
	background-color: white;
	z-index: 2;
}

#why-choose-us {
	z-index: 3;
}

#download {
	z-index: 4;
}

#digi-block {
	z-index: 5;
}

#faq {
	z-index: 6;
}

#contact-us {
	z-index: 7;
}

/* Sticky Sections */
.section {
	position: sticky;
	top: 0;
}

.cv-spinner img {
	width: 50%;
	/* animation-name: example;
    animation-duration: 1s;
    animation-iteration-count: infinite; */
}

@keyframes example {
	0% {
		transform: rotate(10deg);
		/* width: 20%; */
	}

	50% {
		transform: rotate(-10deg);
		/* width: 30%; */
	}

	100% {
		transform: rotate(10deg);
		/* width: 20%; */
	}
}

.cv-spinner {
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.preloader {
	width: 100%;
	height: 100%;
	top: 0;
	position: fixed;
	z-index: 99999;
	background: #fff;
}

.preloader {
	background-color: rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(5px);
}

@media (max-width: 576px) {
	.preloader .cv-spinner img {
		width: 70% !important;
	}
}

.hide {
	display: none;
}

.line-bar {
	width: 150px;
	border-width: 5px;
	border: 5px solid #aa42c7;
}

.line-bar-container {
	width: 168px;
	height: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
	gap: 10px;
}

@media (max-width: 991.98px) {
	html,
	body {
		height: auto;
		overflow-x: hidden;
	}

	.section {
		position: relative;
		top: auto;
	}

	.navbar {
		top: 12px;
		right: 16px;
		left: 16px;
		width: calc(100% - 32px) !important;
		height: auto;
		min-height: 64px;
		padding: 10px 16px;
		gap: 0;
		border-radius: 28px;
		background: #24014ee6;
	}

	.navbar-container {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}

	.navbar-logo a {
		position: static;
		transform: none;
		display: flex;
		align-items: center;
	}

	.header-logo {
		padding: 0;
	}

	.header-logo img {
		max-width: 150px;
		height: auto;
	}

	.hamburger {
		display: block;
		position: absolute;
		top: 50%;
		right: 18px;
		transform: translateY(-50%);
		margin-left: auto;
		padding: 6px;
		cursor: pointer;
	}

	.hamburger .bar {
		display: block;
		width: 24px;
		height: 2px;
		margin: 5px 0;
		background: #ffffff;
		border-radius: 999px;
	}

	.navbar-links {
		position: absolute;
		top: calc(100% + 10px);
		left: 0;
		right: 0;
		transform: none;
		display: none;
		flex-direction: column;
		width: 100%;
		gap: 0;
		padding: 12px 16px;
		margin: 0;
		background: #24014ef2;
		border-radius: 18px;
		box-shadow: 0 14px 34px rgba(20, 0, 27, 0.24);
	}

	.navbar-links.active {
		display: flex;
	}

	.navbar-links li,
	.navbar-links a {
		display: block;
		width: 100%;
	}

	.navbar-links a {
		padding: 12px 4px;
		font-size: 15px;
	}

	.hero {
		min-height: 100svh;
		height: 100svh;
		align-items: flex-end;
	}

	.overlay-headers {
		top: 42% !important;
		left: 50% !important;
		transform: translate(-50%, -50%) !important;
		width: min(92vw, 520px);
		max-width: 92vw;
		white-space: normal;
		line-height: 1.12;
		text-align: center !important;
		font-size: clamp(24px, 8vw, 40px) !important;
	}

	.overlay-headers p {
		margin: 0;
	}

	.home-heading {
		font-size: clamp(30px, 10vw, 44px) !important;
	}

	.home-subheading {
		font-size: clamp(22px, 7vw, 32px) !important;
	}

	.home-sub-subheading {
		font-size: clamp(17px, 5vw, 24px) !important;
	}

	.tab-bar {
		height: auto;
		padding: 8px;
		overflow-x: auto;
		justify-content: flex-start;
	}

	.tabs {
		justify-content: flex-start;
		gap: 8px;
		min-width: max-content;
	}

	.tabs li,
	.tabs li.active {
		flex: 0 0 auto;
		margin: 0;
		padding: 12px 14px;
		border-radius: 12px;
		font-size: 14px;
		white-space: nowrap;
	}

	.home-slider {
		display: none;
	}

	.about-us,
	.why-choose-us,
	.container-test,
	.download-section,
	.help-section {
		height: auto;
		min-height: auto;
	}

	.about-us {
		padding: 72px 20px 48px;
	}

	.about-us .try-free,
	.try-free,
	.w-22,
	.w-35,
	.w-43 {
		width: auto !important;
		display: inline-block;
	}

	.why-choose {
		display: block;
		font-size: clamp(30px, 9vw, 42px);
		text-align: center;
	}

	.about-us .description {
		flex-direction: column;
		gap: 18px;
	}

	.about-us .description .img1,
	.about-us .description .desc-content {
		width: 100%;
		padding: 0;
	}

	.about-us .description .img1 {
		max-width: 360px;
	}

	.about-us .description .desc-content .description-text {
		position: static;
		padding: 20px;
	}

	.about-us .description .desc-content .desc-heading {
		font-size: clamp(25px, 7vw, 34px);
	}

	.about-us .description .desc-content .desc-text {
		font-size: 16px;
	}

	.details {
		width: 100%;
		height: auto;
		padding: 84px 20px 24px;
	}

	.swiper-wrapper {
		position: relative !important;
		height: auto !important;
	}

	.why-choose-us {
		padding: 72px 20px 48px;
		background-size: cover;
	}

	.features {
		justify-content: center;
		gap: 16px;
	}

	.feature {
		width: calc(50% - 12px);
		padding: 10px;
	}

	.feature p {
		padding: 0;
		font-size: 15px;
	}

	.rounded-button {
		width: 72px;
		height: 72px;
	}

	.download-section {
		display: block;
		padding: 92px 20px 56px;
		overflow: visible;
	}

	.content {
		position: relative;
		top: auto;
		left: auto;
		transform: none;
		max-width: none;
	}

	.h3-element {
		font-size: clamp(30px, 9vw, 42px);
	}

	.p-element,
	.virtual-bank-section p {
		width: 100%;
		font-size: 16px;
		line-height: 1.6;
	}

	.store-links {
		flex-wrap: wrap;
	}

	.store-links img {
		width: min(190px, 44vw);
		height: auto;
	}

	.digi-block {
		background-attachment: scroll;
	}

	.digi-block .container {
		padding: 48px 20px;
	}

	.virtual-bank-section {
		margin: 0;
		padding: 0;
	}

	.virtual-bank-section h2 {
		font-size: clamp(30px, 9vw, 42px);
		line-height: 1.18;
	}

	.virtual-bank-section ul {
		font-size: 16px;
		line-height: 1.5;
	}

	.cta-button {
		position: static;
		transform: none;
		width: 100%;
		max-width: 292px;
		height: 58px;
		min-height: 58px;
		margin-top: 22px;
	}

	.faq-main-container {
		margin: 0;
		padding: 72px 20px 48px;
	}

	.faq-main-container .col-6,
	.faq-main-container .p-l-45 {
		flex: 0 0 100%;
		max-width: 100%;
		padding-left: 15px;
		padding-right: 15px;
	}

	.faq-header {
		font-size: clamp(32px, 10vw, 46px);
	}

	.faq-box {
		padding: 16px;
		gap: 10px;
	}

	.help-section {
		padding: 84px 20px 36px;
		background-position: center;
	}

	.contact-container,
	.contact-form {
		width: 100%;
	}

	.contact-form {
		padding: 22px;
	}

	.contact-form h2 {
		font-size: clamp(26px, 8vw, 34px);
		line-height: 1.25;
	}

	.social-media,
	.footer {
		width: 100%;
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
	}
}

@media (max-width: 575.98px) {
	.navbar {
		right: 10px;
		left: 10px;
		width: calc(100% - 20px) !important;
	}

	.header-logo img {
		max-width: 128px;
	}

	.feature {
		width: 100%;
	}

	.tabs li,
	.tabs li.active {
		font-size: 13px;
		padding: 10px 12px;
	}

	.download-section,
	.help-section,
	.about-us,
	.why-choose-us {
		padding-left: 16px;
		padding-right: 16px;
	}

	.line-bar-container,
	.line-bar {
		width: 100%;
	}
}