/* import font family is == Poppins ==*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

/* 
Theme Name:     Finteezy
Theme URI:      
Author:         
Author URI:     
Description:    
Version:        1.0
License:        
License URI:

 [Table of Content]
 01. Reset
 02. Global Style 
	  01. Index Page Style
        section Index Page
            1.1. Header section
            1.2. Hero section
            1.3. Partners section
            1.4. Services section
            1.5. Registration section
            1.6. Download section
            1.7. Benefits section
            1.8. Testimonials section
            1.9. Pricing section
            1.10. Blog section
            1.11. FAQs section
            1.12. Footer section
   
    02. About Page Style
        section About Page
            2.1. Subpage_Hero section
            2.2. Mission section
			2.3. Online section
			2.4. Team section

    03. Services Page Style
        section Services Page
            3.1. Features section

    04. Pricing Page Style
        
    05. Testimonial Page Style

    06. Team Page Style

    07. Blog Page Style
          
    08. BlogDetails_Hero Page Style
		section BlogDetails_Hero Page
			   8.1. BlogDetails_Hero section
			   8.2. Details section
			   8.3. Comment section

    09. Contact Page Style
		section Contact Page
				9.1. Contact_Details section
				9.2. Contact section

    10. Error Page Style
		section Error Page
				10.1. Error_404 section	

    11. ComingSoon Page Style
		section ComingSoon Page
				11.1. ComingSoon section	
    
 */

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
a,
p,
blockquote,
pre,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;

}
body {
    position: relative;
    /*overflow-x: hidden;*/
}



/* HTML5 display-role reset for older browsers */
/* =====  01. Reset  ====== */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block;
}
* {
    margin: 0;
  padding: 0;
    box-sizing: border-box;
}
body {
	font-family: "Poppins", sans-serif;
	line-height: 1;
	background: #01030E; /* Dark background from logo */
	scroll-behavior: smooth;
	color: #FFFFFF;
	overflow-x:hidden !important;
}
html, body {
  /*overflow-x: hidden;*/
  width: 100%;
}



* {
  max-width: 100vw;
}

ol,
ul {
	list-style: none;
}

blockquote,
q {
	quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
}

input:focus,
button:focus {
	outline: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

/*Hide services, api, products */
.navbar-nav .nav-item:nth-child(1),
.navbar-nav .dropdown:nth-child(2), 
.navbar-nav .mega-dropdown {          
    display: none !important;
}

#mySidenav li.nav-item:has(a[href="services.html"]),
#mySidenav li.nav-item:has(#slid-products-btn),
#mySidenav li.nav-item:has(#slid-api-btn) {
    display: none !important;
}
select {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	background-color: #ffffff;
	-webkit-text-fill-color: #ffffff;
	-webkit-box-shadow: 0 0 0px 1000px transparent inset;
	transition: background-color 5000s ease-in-out 0s;
}

select::-ms-expand {
	display: none;
}

label {
	font-weight: normal;
}

iframe {
	width: 100%;
}

/* =====  End of 01. Reset  ====== */
/* ===== 02. Global Style ===== */

/* Headings with theme colors */
h1, h2, h3, h4, h5, h6 {
	font-family: "Poppins", sans-serif;
	font-weight: 700;
	color: #FF0000; /* Red by default */
}

h1 {
	font-size: 76px;
	line-height: 90px;
}

h2 {
	font-size: 56px;
	line-height: 76px;
}

h3 {
	font-size: 38px;
	line-height: 50px;
}

h4 {
	font-size: 30px;
	line-height: 40px;
}

h5 {
	font-size: 20px;
	line-height: 30px;
	font-weight: 600;
}

h6 {
	font-size: 18px;
	line-height: 24px;
	font-weight: 600;
}

p {
	font-size: 16px;
	line-height: 22px;
	font-weight: 400;
	color: #DDDDDD;
}

a {
	font-size: 18px;
	line-height: 24px;
	font-weight: 500;
	text-decoration: none;
	font-family: "Poppins", sans-serif;
	color: #0000FF; /* Blue links */
}

a:hover {
	color: #FF0000; /* Red on hover */
}

button {
	font-size: 18px;
	line-height: 24px;
	font-weight: 500;
	padding: 14px 22px;
	font-family: "Poppins", sans-serif;
	border: none;
	outline: none;
}

/* Primary Button */
.hover1 {
	display: inline-block;
	position: relative;
	overflow: hidden;
	cursor: pointer;
	transition: 0.5s ease;
	font-weight: 500;
	color: #FFFFFF;
	z-index: 1;
	padding: 17px 50px;
	border-radius: 40px;
	border: 1px solid transparent;
	line-height: 27px;
	text-align: center;
}

.hover1::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(100.57deg, #FF0000 12.93%, #0000FF 121.02%);
	position: absolute;
	border-radius: 40px;
	z-index: -1;
	transition: 0.4s ease;
	top: 0px;
	left: 0px;
}

.hover1:hover {
	color: #ffffff;
	border: 1px solid #0000FF;
}

.hover1:active {
	filter: brightness(0.8);
}

@keyframes moveRight {
	from {
		left: 0;
	}

	to {
		left: 100%;
	}
}

@keyframes moveLeft {
	from {
		left: 100%;
	}

	to {
		left: 0;
	}
}

.hover1::before {
	animation: moveLeft 0.4s forwards;
}

.hover2 {
	display: inline-block;
	position: relative;
	overflow: hidden;
	cursor: pointer;
	transition: 0.5s ease;
	font-weight: 500;
	color: #FFFFFF;
	z-index: 1;
	padding: 17px 50px;
	border-radius: 40px;
	border: 1px solid #FF0000;
	line-height: 27px;
	text-align: center;
}

.hover2::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(100.57deg, #FF0000 12.93%, #0000FF 121.02%);
	position: absolute;
	border-radius: 40px;
	z-index: -1;
	transition: 0.4s ease;
	top: 0px;
	left: 100%;
}

.hover2:hover::before {
	animation: moveLeft 0.4s forwards;
}

.hover2:hover {
	color: #ffffff;
	border: 1px solid transparent;
}

.hover2:active {
	filter: brightness(0.8);
}

.hover2::before {
	animation: moveRight 0.4s forwards;
}

@keyframes moveLeft {
	from {
		left: 100%;
	}

	to {
		left: 0;
	}
}

@keyframes moveRight {
	from {
		left: 0;
	}

	to {
		left: 100%;
	}
}

/* form validation modal */
.modal-content {
	padding: 40px;
	background: rgba(23, 22, 38, 0.6);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

.modal-content img {
	margin: auto;
	width: 100px;
}

.modal-content div {
	padding: 40px 0px;
	width: 350px;
	margin: auto;
}

.modal-content h4,
.modal-content h6 {
	margin: auto;
	color: #ffffff;
	text-align: center;
}

.modal-content h6 {
	margin: 15px auto;
}

.modal .hover1 {
	width: 100px;
	padding: 12px 24px;
}

/* Scroll To Top Button */
.scrollToTop {
	display: none;
	height: 60px;
	width: 60px;
	position: fixed;
	bottom: 20px;
	right: 20px;
	background-color: #0000FF; /* Blue */
	border-radius: 50%;
	overflow: hidden;
	cursor: pointer;
	z-index: 999;
	transition: 0.5s ease all;
}

.scrollToTop:hover {
	transform: translateY(-15%);
}

.scrollToTop .arrowUp {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 3;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #FFF;
	font-size: 24px;
}

.scrollToTop .water {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	transform: translateY(100%);
	background-color: #FF0000E0; /* Red */
	transition: all 0.3s;
}

.scrollToTop .water_wave {
	width: 200%;
	position: absolute;
	bottom: 100%;
}

.scrollToTop .water_wave_back {
	right: 0;
	fill: #C7EEFF;
	animation: wave-back 1.4s infinite linear;
}

.scrollToTop .water_wave_front {
	left: 0;
	fill: #FF0000E0;
	margin-bottom: -1px;
	animation: wave-front 0.7s infinite linear;
}

@keyframes wave-front {
	100% {
		transform: translateX(-50%);
	}
}

@keyframes wave-back {
	100% {
		transform: translateX(50%);
	}
}

/* pre_loader */
.site-wrapper {
	visibility: hidden;
	overflow: hidden;
	opacity: 0;
	transition: all 0.5s ease;
	display: none;
}

body.preloader-active {
	overflow: hidden;
	transition: all 0.5s ease;
}

.preloader {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #01030ECC;
	z-index: 9999;
	display: flex;
	justify-content: center;
	align-items: center;
}

.preloader-logo {
	position: relative;
	width: 100px;
	height: 100px;
	background-image: url('../images/logo2.svg');
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

.preloader::before {
	content: "";
	position: absolute;
	background: url("../images/icons/botted_circle.svg") no-repeat center center;
	height: 400px;
	width: 400px;
	transform: translate(-50%, -50%);
	animation: rotate 10s linear infinite;
	
}

@keyframes rotate {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

.cursor-effect {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	box-shadow: 0px 0 15px #FF0000; /* Red glow */
	position: absolute;
	pointer-events: none;
	transform: scale(1) translate(-30px, -30px);
	transition: transform 0.2s ease, left 0.3s ease, top 0.3s ease;
	z-index: 9999999999;
}

/* ===== End of 02. Global Style ===== */

/* ========= 1.1. Header section ======== */

.nav-logo img {
	width: 183px;
}

.navbar-brand img {
	width: 140px;
}

header .flex-row-reverse {
	width: 100%;
}

.navbar-collapse {
	justify-content: center;
}

.right-sidbar {
	width: 280px;
	position: fixed;
	height: 100vh;
	top: 0;
	left: -355px;
	overflow-x: hidden;
	transition: 0.5s;
	padding: 20px 10px 20px 5px;
	background: #01030E; /* Dark navy background */
	z-index: 999999;
}

.open-aside {
	max-height: 50px;
	display: none;
	z-index: 2;
}

aside .fa-xmark {
	padding: 10px 15px;
	background: linear-gradient(100.57deg, #FF0000 12.93%, #0000FF 121.02%);
	color: #ffffff;
	border: none;
	border-radius: 10px;
	font-size: 22px;
}

aside .fa-caret-down {
	color: #0000FF; /* Blue arrow */
	font-size: 18px;
}

.right-sidbar a:focus,
aside a {
	color: #FFFFFF;
}

aside a:hover {
	color: #FF0000; /* Red hover */
}

#slid-drop {
	display: none;
}

aside li {
	padding: 12px;
}

#slid-drop li {
	padding: 12px 0px;
}

.aside-dropdwon {
	display: block !important;
}

.page-btn {
	padding: 0px 0px 10px;
	color: #ffffff;
	font-weight: 400;
	background-color: transparent;
	border: none;
	font-size: 16px;
}

.navbar ul li a:focus,
.navbar ul li a {
	color: #ffffff;
	padding: 15px;
	font-weight: 400;
	font-size: 16px;
}

.dropdown ul .active {
	background: none;
}

.right-sidbar a:active,
.right-sidbar a:focus,
.right-sidbar .nav-item a {
	font-weight: 400;
	color: #ffffff;
	font-size: 16px;
}

header #slid-btn:hover .page-btn,
header #slid-btn.active .page-btn,
aside .nav-item .active,
.right-sidbar .active a,
.right-sidbar a:hover,
.navbar ul .active,
.navbar ul li a:hover {
	color: #0000FF; /* Blue active/hover */
	font-size: 16px;
}

.dropdown ul {
	width: 200px;
}

.dropdown-menu {
	padding: 15px 10px;
	background: #01030E; /* Dark navy */
	display: block;
	overflow: hidden;
	transition: all 0.3s ease-in;
	visibility: hidden;
	border-radius: 10px;
}

.dropdown ul li a:focus,
.dropdown ul li a:active {
	background: transparent;
}

.dropdown ul li a {
	color: #ffffff;
	border-radius: 10px;
	background: transparent;
}

.dropdown ul li a:hover {
	color: #FF0000; /* Red hover */
	background-color: transparent;
}

.open-aside {
	padding: 12px 15px;
	background: linear-gradient(100.57deg, #FF0000 12.93%, #0000FF 121.02%);
	border: none;
	border-radius: 10px;
	font-size: 25px;
	color: #ffffff;
}

aside .fa-xmark:hover,
.open-aside:hover {
	background: linear-gradient(102.05deg, #0000FF 40.6%, #FF0000 91.37%);
	color: #ffffff;
}

header .search i {
	font-size: 30px;
	color: #FFF;
}

header .SearchModal button {
	border: none;
	background: none;
	padding: 0px;
}

header .modal {
	display: none;
	position: fixed;
	z-index: 1000;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.8);
	backdrop-filter: blur(7px);
	justify-content: center;
	align-items: center;
	opacity: 0;
	transition: opacity 0.5s ease-in-out;
}

header .modal.show {
	opacity: 1;
}

header .searchModal .close-btn {
	position: absolute;
	top: 10px;
	right: 10px;
	background: none;
	color: #FFFFFF;
	border: none;
	font-size: 50px;
}

header .searchModal .close-btn:hover {
	color: #FF0000; /* Red hover */
}

header .searchModal .modal-content div {
	width: 100%;
}

header .searchModal .position-relative {
	display: flex;
	align-items: center;
	width: 80%;
	position: relative;
	transform: translateY(-400%);
	transition: transform 0.7s ease-in-out;
}

header .modal.show .position-relative {
	transform: translateY(0);
}

header .searchModal input {
	width: 100% !important;
	padding: 20px 30px;
	outline: none;
	background: #01030E;
	color: #ffffff;
	border: 1px solid #0000FF; /* Blue border */
	border-radius: 10px;
}

header .search-btn {
	border: none;
	background: none;
	padding: 0px;
	position: absolute;
	right: 20px;
}

header .searchModal img[alt="search"] {
	width: 20px !important;
}

body.modal-open {
	overflow: hidden;
}

header .pt-lg-4 .p-0 {
	font-size: 24px;
	font-family: "Forum", serif;
	color: #FFFFFF;
	transition: all 0.3s ease;
}

header .pt-lg-4 .p-0:hover {
	color: #FF0000; /* Red hover */
}

header .pt-lg-4 {
	position: relative;
}

/* ========= End of 1.1. Header section ======== */

/* ========= 1.2. Hero section ======== */

.Hero {
	padding: 100px 0px;
}

.Hero h2,
.Hero h1,
.Hero p {
	color: #FFFFFF;
}

.Hero h1 span {
	    background-image: linear-gradient(105deg, #FF0000 39.5%, #0000FF 39%); /* Red → Blue */
	color: transparent;
	display: inline-block;
	width: max-content;
	background-clip: text;
}

.Hero p {
	padding: 26px 177px 30px 0px;
}

.Hero .mt-1 h5 {
	color: #ffffff;
	padding: 60px 0px 15px;
	font-weight: 500;
}

.Hero .mt-1 img {
	width: 71px;
	border-radius: 50%;
	border: 3px solid #FF0000; /* Red border around avatars */
}

.Hero .mt-1 figure:nth-child(2) {
	left: -4%;
	position: relative;
}

.Hero .mt-1 figure:nth-child(3) {
	position: relative;
	left: -8%;
}

.Hero .rounded-circle {
	border: 3px solid #000000;
	background-color: #ffffff;
	width: 71px;
	height: 71px;
	left: -12%;
}

.Hero .rounded-circle h5 {
	color: #000000;
}

.Hero .position-absolute::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	background: #00009e2b; /* Soft blue glow */
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(100px);
	z-index: -1;
}

.Hero .position-absolute {
	left: -25%;
	top: 4%;
	z-index: -1;
}

.Hero .position-absolute img {
	width: 75%;
}

.Hero .align-items-end {
	gap: 35px;
}

.Hero .align-items-end p {
	padding: 5px 0px 0px;
}

/* ========= End of 1.2. Hero section ======== */


/* ======== 1.3. Partners section ======== */

.Partners h5 {
	color: #FFFFFF;
}

.Partners hr {
	margin: 0;
	opacity: 1;
	border-top: 1px solid;
	border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1; /* Red → Blue */
}

.PartnersSlider {
	padding: 50px 50px 0px;
}

.PartnersSlider img {
	height: 34px;
	object-fit: contain;
}



/* ======== End of 1.3. Partners section ======== */

/* ======== 1.4. Services section ======== */

.Services {
	padding: 100px 0px;
}

.Services h2 {
	color: #FFF;
}

.Services h5 {
	color: #FFF;
}

.Services p {
	color: #FFF;
}

.Services h2 span {
/*background-image: linear-gradient(105deg, #FF0000 39.5%, #0000FF 39%);*/
    /*background-image: linear-gradient(105deg, #FF0000 25.5%, #0000FF 28%);*/
        background-image: linear-gradient(106deg, #FF0000 48.5%, #0000FF 52%);
	color: transparent;
	background-clip: text;
}
.Services h2 .our{
/*background-image: linear-gradient(105deg, #FF0000 39.5%, #0000FF 39%);*/
    background-image: linear-gradient(105deg, #FF0000 25.5%, #0000FF 28%);
        /*background-image: linear-gradient(106deg, #FF0000 48.5%, #0000FF 52%);*/
	color: transparent;
	background-clip: text;
}
.Services img {
	width: 70px;
	filter: brightness(0) invert(1);
}

.Services .flex-wrap {
	gap: 30px 24px;
}

.Services .flex-wrap .gap-3 {
	width: 32%;
	flex-grow: 1;
	padding: 40px 24px;
	border-radius: 30px;
}

.Services .flex-wrap .gap-3 p {
	font-size: 14px;
	line-height: 20px;
}

/* Service cards with consistent red-blue gradients */
.Services .flex-wrap .gap-3:nth-child(1),
.Services .flex-wrap .gap-3:nth-child(7) {
    background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%); /* Red to Blue */
}

.Services .flex-wrap .gap-3:nth-child(2),
.Services .flex-wrap .gap-3:nth-child(8) {
    background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%); /* Red to Blue */
}

.Services .flex-wrap .gap-3:nth-child(3),
.Services .flex-wrap .gap-3:nth-child(9) {
    background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%); /* Strong Red to Blue */
}

.Services .flex-wrap .gap-3:nth-child(4),
.Services .flex-wrap .gap-3:nth-child(10) {
    background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%); /* Red to Blue */
}

.Services .flex-wrap .gap-3:nth-child(5),
.Services .flex-wrap .gap-3:nth-child(11) {
    background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%); /* Subtle Red to Blue */
}

.Services .flex-wrap .gap-3:nth-child(6),
.Services .flex-wrap .gap-3:nth-child(12) {
    background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%); /* Soft Red to Blue */
}



.Services .h-100 {
	padding-left: 24px;
}

.Services .h-100::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 40%;
	width: 100%;
	height: 70%;
	background: #00009e5c; /* Blue glow */
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(150px);
	z-index: -1;
}

.Services .m-0::before {
	display: none;
}

.Services .h-100 p {
	padding-right: 40px;
	    margin-bottom: 40px;
}

/* ======== End of 1.4. Services section ======== */
 
      

/* ========= 1.5. Registration section ======== */

.Registration {
	padding: 0px 0px 100px;
}

.Registration h2,
.Registration h5,
.Registration p {
	color: #FFFFFF;
}

.Registration h2 span {
	background-image: linear-gradient(115deg, #FF0000 35%, #0000FF 100%); /* Red → Blue */
	color: transparent;
	display: inline-block;
	width: max-content;
	background-clip: text;
}

.Registration h2 {
	width: 82%;
}

.Registration .col-lg-6:nth-child(1) p {
	padding: 25px 94px 40px 0px;
}

.Registration ul li {
	position: relative;
	padding: 0px 0px 0px 45px;
}

.Registration ul li h6 {
	color: #ffffff;
	font-weight: 500;
}

.Registration ul {
	gap: 45px;
}

.Registration ul li:before {
	content: "\f00c";
	font-family: "Font Awesome 5 Free";
	font-size: 20px;
	padding: 5px;
	font-weight: 700;
	position: absolute;
	left: 0px;
	top: -2px;
	color: #FFF;
	border-radius: 50%;
	background: linear-gradient(137.28deg, #FF0000 1.84%, #0000FF 98.16%); /* Red → Blue */
	box-shadow: 5px 5px 4px 0px #00000040 inset;
}

.Registration .gap-md-4 {
	margin: 50px 0px 0px;
}

.Registration .position-relative {
	width: fit-content;
}

.Registration .position-relative::before {
	content: "";
	position: absolute;
	top: 38%;
	left: 63%;
	background: linear-gradient(45deg, #FF0000 40.6%, #0000FF 91.37%); /* Red → Blue */
	border-radius: 50%;
	transform: translate(-50%, -50%);
	z-index: -1;
	width: 550px;
	height: 550px;
}

.Registration .position-relative::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 140%;
	height: 80%;
	background: #0000FF80; /* Soft blue glow */
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(100px);
	z-index: -2;
}

.Registration .gap-lg-3 {
	padding: 20px 70px 14px 16px;
	background-color: #272B40;
	border-radius: 16px;
	width: fit-content;
}

.Registration .gap-lg-3 figure {
	width: 26px;
	height: 26px;
	background-color: #FFFFFF;
	border-radius: 8px;
}

.Registration .gap-lg-3 .p-0 {
	color: #868894;
	font-size: 12px;
}

.Registration img[alt="monthly_Graph"] {
	position: relative;
	left: -13%;
}

/* ========= End of 1.5. Registration section ======== */

/* ======== 1.6. Download section ======== */

.Download {
	margin: 100px 0px;
	background: #150C2380;
	border-top: 1px solid;
	border-bottom: 1px solid;
	border-image-source: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	border-image-slice: 1;
}

.Download h6,
.Download h5,
.Download p,
.Download h2 {
	color: #FFFFFF;
}

.Download h2 span {
	background-image: linear-gradient(130deg, #ff0000c4 27.79%, #001bffc7 84.37%);
	color: transparent;
	display: inline-block;
	width: max-content;
	background-clip: text;
}

.Download p {
	padding: 25px 0px 45px;
}

.Download h6,
.Download h5 {
	font-weight: 600;
}

.Download .gap-lg-3 p {
	padding: 0px;
	font-size: 12px;
	line-height: 14px;
}

.Download figure.h-100 {
	width: fit-content;
}

.Download img[alt="download_Img"] {
	width: 76%;
	margin: 0px auto;
	position: relative;
	bottom: 15%;
	transform: scale(1.3);
}

.Download figure.h-100::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 150%;
	height: 100%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(80px);
	z-index: -1;
}

.Download .gap-lg-3 a {
	background: linear-gradient(100.57deg, rgba(48, 6, 164, 0.2) 12.93%, rgba(255, 163, 123, 0.2) 121.02%);
	border-radius: 10px;
	padding: 20px 22px;
	border: 1px solid #FF0000;
	transition: 0.3 ease all;
}

.Download .gap-lg-3 a:hover {
	background: transparent;
}

.Download .justify-content-end {
	padding: 90px 0px 80px;
	position: relative;
	z-index: 1;
}

/* ======== End of 1.6. Download section ======== */
/* ======== 1.7. Benefits section ======== */
.Benefits {
	margin: 100px 0px;
	border-bottom: 1px solid;
    border-image-source: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);

}
.Benefits .h-100 {
    gap: 30px;
}
.Benefits .container .row {
   gap:100px;
}

.Benefits .col-xl-2 .text-center {
     padding: 40px 25px; 
    border: 1px solid #711FE3;
    border-radius: 10px;
}
/*.text-center {*/
/*    text-align: center !important;*/
/*}*/
.Benefits h2 {
	color: #FFF;
	padding-right: 100px;
}

.Benefits p {
	color: #711FE3;
	font-weight: 700;
}

.Benefits h5 {
	color: #711FE3;
}

.Benefits h2 span {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	color: transparent;
	background-clip: text;
}

.Benefits .gap-4 figure {
	width: 60px;
}

.Benefits .align-items-center figure {
	width: 45px;
}

.Benefits .position-absolute {
	background: linear-gradient(130deg, #ff0000c4 27.79% 24.79%, #001bffc7 84.37%);
	border-radius: 10px;
	top: 50%;
	right: -30%;
	transform: translateY(-50%);
	width: 53%;
}

.Benefits .position-absolute p {
	color: #FFF;
	font-weight: 400;
}

.Benefits .position-absolute figure {
	width: 40px;
	background: linear-gradient(160.27deg, #962EFF 9.09%, #2F06B1 151.6%) no-repeat;
	height: 40px;
	border-radius: 50%;
	color: #FFF;
	font-size: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.Benefits .gap-4 figure:nth-child(2) {
	background: linear-gradient(100deg, #ff0909 1.84%, #4046d4 98.16%) no-repeat;
	box-shadow: 5px 5px 4px 0px #00000040 inset;
	border-radius: 50%;
	height: 60px;
	margin: 35px 0px;
	transform: translateX(-120%);
}

.Benefits .py-4 {
	padding-left: 70px;
}

.Benefits figure:nth-child(2) img {
	width: 30px;
	border-radius: 0;
}

.Benefits .gap-4 img {
	width: 60px;
	border-radius: 50%;
}

.Benefits .gap-3 img {
	width: 45px;
}

.Benefits .col-lg-7 .position-relative {
	background: #FFF;
	width: 75%;
	border-radius: 5px;
	padding: 40px 40px;
}

.Benefits .position-relative .gap-5 {
	width: 60%;
}

.Benefits .flex-column.gap-3 .gap-4 {
	background: #F2EBFC;
	padding: 18px 35px;
	border-radius: 5px;
}

.Benefits .col-lg-5 figure::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 40%;
	width: 100%;
	height: 70%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(100px);
	z-index: -1;
}

/* ======== End of 1.7. Benefits section ======== */
/* ======== 1.8. Testimonials section ======== */

.Testimonials {
	    margin-bottom: 80px;
}

.Testimonials h3 {
	color: #FFF;
}

.Testimonials h2 {
	color: #FFF;
	padding-right: 50px;
}

.Testimonials p {
	color: #FFF;
}

.Testimonials h6 {
	color: #FFF;
}

.Testimonials .ps-lg-5 {
	gap: 40px;
}

.Testimonials .flex-row {
	gap: 80px;
}

/*.Testimonials .flex-column .position-relative {*/
/*	width: 85%;*/
/*	padding: 30px 45px;*/
/*	border-radius: 10px;*/
/*   background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%);*/
/*}*/

/*.Testimonials .flex-column .position-relative:nth-child(6),*/
/*.Testimonials .flex-column .position-relative:nth-child(2) {*/
/*    background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%);*/

/*	align-self: flex-end;*/
/*}*/

/*.Testimonials .flex-column .position-relative:nth-child(3) {*/
/*  background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%);*/
/*}*/

.Testimonials .position-absolute {
	top: -7px;
	right: 40px;
}

.Testimonials .py-md-1 p {
	font-weight: 500;
}

.Testimonials p.p-0 {
	font-size: 14px;
	line-height: 20px;
}

.Testimonials i {
	color: #C69E0C;
	font-size: 12px;
}

.Testimonials img {
	width: 80px;
	border-radius: 50%;
}

.Testimonials .position-absolute img {
	width: 30px;
	border-radius: 0;
}

.Testimonials .col-md-6:nth-child(1) .h-100::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 40%;
	width: 100%;
	height: 70%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(100px);
	z-index: -1;
}

.Testimonials .col-md-6:nth-child(1) .m-0::before {
	display: none;
}

.Testimonials.m-0 h2 {
	padding: 0px 24px;
}

.Testimonials.m-0 p.py-0 {
	padding: 0px 230px;
}

.Testimonials.m-0 .pt-5 {
	gap: 40px;
}

.Testimonials .flex-wrap .position-relative:nth-child(1),
.Testimonials .flex-wrap .position-relative:nth-child(5) {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);

}

.Testimonials .flex-wrap .position-relative {
	width: 40% !important;
	flex-grow: 1;
}

.Testimonials.m-0 {
	position: relative;
}

.Testimonials.m-0::before {
	content: '';
	position: absolute;
	top: 50%;
	right: 0%;
	width: 30%;
	height: 30%;
	background: #00009e5c;
	border-radius: 50%;
	filter: blur(100px);
	z-index: -1;
}

.Testimonials.m-0 .flex-column .position-relative:nth-child(6),
.Testimonials.m-0 .flex-column .position-relative:nth-child(2) {
	align-self: unset;
}

/* ======== End of 1.8. Testimonials section ======== */
/* ======== 1.9. Pricing section ======== */

.Pricing {
	padding: 100px 0px;
	background: #150C2380;
	border: 1px solid;
	border-left: none;
	border-right: none;
	border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}

.Pricing .row {
	row-gap: 70px;
}

.Pricing h4 {
	color: #FFF;
}

.Pricing h2 {
	color: #FFF;
	font-weight: 600;
}

.Pricing h2 span {
    background-image: linear-gradient(85deg, #FF0000 49.5%, #0000FF 39%);

	background-clip: text;
	color: transparent;
}

.Pricing p {
	color: #FFF;
}

.Pricing figure::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	background: #00009e2b;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(100px);
	z-index: -1;
}

.Pricing img {
	width: 85%;
}

.Pricing .h-100.gap-4 {
	border: 1px solid #FF0000;
	border-radius: 20px;
	padding: 50px 80px 45px;
}

.Pricing .h-100.gap-4:hover {
	border: 1px solid #2F06B1;
}

.Pricing .gap-4 h2 {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	color: transparent;
	background-clip: text;
	font-size: 60px;
	line-height: 90px;
}

.Pricing .align-items-center p {
	padding-right: 100px;
	font-weight: 500;
}

.Pricing.mx-0 {
	margin: 100px 0px;
}

.Pricing.mx-0 .row {
	row-gap: 35px;
}

/* ======== End of 1.9. Pricing section ======== */
/* ======== 1.10. Blog section ======== */

.Blog {
	padding: 100px 0px;
	position: relative;
}

.Blog::before {
	content: '';
	position: absolute;
	top: 60%;
	left: 10%;
	width: 30%;
	height: 50%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(150px);
	z-index: -2;
}

.Blog h2,
.Blog p,
.Blog h4 {
	color: #ffffff;
}

.Blog h4 {
	font-weight: 600;
}

.Blog .mx-auto p {
	padding: 12px 300px 70px;
}

.Blog figure {
	width: 100%;
}

.Blog img[alt="blog_img1"] {
	width: -webkit-fill-available;
}

.Blog img {
	width: 100%;
	border-radius: 10px;
	height: 100%;
	object-fit: cover;
}

.Blog .border-1 {
	border: 1px solid #711FE3;
	border-radius: 10px;
}

.Blog .border-1:hover {
	border: 1px solid #2F06B1;
}

.Blog .col-lg-9 .border-1 .flex-column {
	padding: 65px 22px;
}

.Blog .col-lg-9 .border-1.flex-column {
	padding: 65px 20px;
	width: 59%;
}

.Blog .col-lg-9 .border-1 p {
	padding: 20px 0px 30px;
}

.Blog .col-lg-3 .border-1 .flex-column {
	padding: 35px 10px 20px 15px;
}

.Blog .col-lg-3 .border-1 .flex-column p {
	padding: 20px 2px 30px 0px;
}

.Blog a {
	color: #ffffff;
	transition: 0.3s ease all;
}

.Blog a:hover {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

/* ======== End of 1.10. Blog section ======== */
/* ======== 1.11. FAQs section ======== */

.FAQs h2 {
	color: #FFF;
}

.FAQs p {
	color: #FFF;
	padding: 24px 20px 40px 0px;
}

.FAQs h2 span {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	color: transparent;
	background-clip: text;
}

.FAQs .col-lg-7 {
	padding-right: 130px;
}

.FAQs .accordion {
	gap: 40px;
}

.FAQs .accordion-item {
	color: #FFF;
	border-radius: 10px;
	border: 1px solid #FF0000;
	background-color: transparent;
	overflow: hidden;
}

.FAQs .accordion-item:last-child {
	border-bottom: 1px solid #FF0000;
}

.FAQs .accordion-button {
	color: #FFF;
	background: linear-gradient(100.57deg, #a40606 12.93%, #000cff 112.02%);
	font-size: 16px;
	font-weight: 600;
	padding: 22px 30px;
}

.FAQs .accordion-button::after {
	background: none !important;
	font-size: 24px;
	content: "\f067";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
}

.FAQs .accordion-button:focus {
	box-shadow: none;
}

.FAQs .accordion-button:not(.collapsed)::after {
	content: "\f068";
}

.FAQs .accordion-button:not(.collapsed) {
	border-bottom: 1px solid #FF0000;
}

.FAQs .accordion-body {
	padding: 35px 24px;
}

.FAQs .accordion-body p {
	padding: 0;
}

.FAQs img {
	width: 100%;
	border-radius: 20px;
}

.FAQs figure::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 40%;
	width: 100%;
	height: 70%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(100px);
	z-index: -1;
}

/* ======== End of 1.11. FAQs section ======== */
/* ======== 1.12. Footer section ======== */

footer {
	padding: 100px 0px 0px;
	position: relative;
}

footer::before {
	content: '';
	position: absolute;
	top: 70%;
	left: 50%;
	width: 50%;
	height: 60%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(180px);
	z-index: -2;
}

footer input::placeholder,
footer p,
footer h6,
footer h5,
footer h2 {
	color: #ffffff;
}
footer h2{
  
    margin-top:70px;
}
footer h5 {
	font-weight: 600;
}

footer form {
	margin: 0px 0px 70px;
}

footer form input {
	padding: 25px 45px;
	background-color: transparent;
	border: 2px solid #711FE3;
	border-radius: 10px;
	color: #ffffff;
	width: 52%;
	font-size: 16px;
}

footer .hover1 {
	padding: 25px 35px;
	color: #FFFFFF;
	font-size: 18px;
	border-radius: 10px;
	background-color: transparent;
}

footer .hover1::before {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	border-radius: 10px;
}

footer .hover1:hover {
	background: transparent;
}

footer .justify-content-between {
	padding: 70px 0px;
	border-top: 1px solid;
	border-bottom: 1px solid;
	border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;

}

footer img[alt="logo"] {
	width: 237px;
	margin-bottom: -15px;
    margin-top: -25px;
}

footer .m-0 {
	width: 71%;
	padding: 0px 0px 25px;
}



footer .gap-lg-4 figure:hover {

	background: none;
}

footer .gap-lg-4 figure i {
	color: #ffffff;
	font-size: 20px;
}

footer ul {
	width: 63%;
}

footer ul li {
	padding: 10px 0px;
}

footer ul li,
footer ul li a {
	font-size: 16px;
	color: #ffffff;
	font-weight: 400;
}

footer ul li a:hover {
	color: #FFA37B;
}

footer li a span {
	font-size: 24px;
	font-weight: 600;
	padding: 10px 0px 0px;
	    background-image: linear-gradient(85deg, #FF0000 70.5%, #0000FF 39%);
	background-clip: text;
	-webkit-text-fill-color: transparent;
	transition: 0.4s ease all;
}

footer li a span:hover {
	background: linear-gradient(160.27deg, #962EFF 9.09%, #2F06B1 151.6%);
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

footer .p-0 p {
	padding: 20px 0px 30px;
	width: 74%;
}

footer .p-0 .gap-lg-3 a p {
	width: 100%;
	padding: 0px;
	font-size: 12px;
}

footer .p-0 .gap-lg-3 a {
	background: linear-gradient(100.57deg, rgba(48, 6, 164, 0.2) 12.93%, rgba(255, 163, 123, 0.2) 121.02%);
	border-radius: 10px;
	padding: 9px 22px !important;
	border: 1px solid #FF0000;
	width: max-content;
	transition: 0.3s ease all;
}

footer .p-0 .gap-lg-3 a:hover {
	background: transparent;
}

footer .d-block {
	width: max-content;
}

footer .z-1 {
	width: 40%;
}

footer .ms-0 {
	width: min-content;
	padding: 0px 100px 0px 0px;
}

footer .ms-0 ul {
	width: 100%;
}

/* ======== End of 1.12. Footer section ======== */
/* ======== 2.1. subpage_hero section ======== */

.Subpage_Hero {
	position: relative;
	
}



.Subpage_Hero .text-center {
    background: linear-gradient(124deg, #00009e 10.79% 1.79%, #a52a2ab8 72.37%);
    border-radius: 20px;
    padding: 60px 0px;
}

.Subpage_Hero .text-center h2,
.Subpage_Hero .text-center p {
	color: #ffffff;
}

.Subpage_Hero .text-center h2 {
	font-weight: 600;
}

.Subpage_Hero .text-center p {
	padding: 30px 270px 0px;
}

/* ======== End of 2.1. subpage_hero section ======== */
/* ======== 2.2. Mission section ======== */

.Mission h5 {
	background-image: linear-gradient(124deg, #00009eed 16.79% 9.79%, #a52a2ab8 72.37%);
    /*background-image: linear-gradient(105deg, #FF0000 25.5%, #0000FF 28%);*/
	color: transparent;
	display: inline-block;
	width: max-content;
	background-clip: text;
	padding: 0px 0px 10px;
}

.Mission .position-relative::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 30%;
	width: 130%;
	height: 100%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(240px);
	z-index: -1;
}

.Mission h2,
.Mission p {
	color: #ffffff;
}

.Mission p {
	padding: 20px 0px 40px;
}



/* ======== End of 2.2. Mission section ======== */
/* ======== 2.3. Online section ======== */

/*.Online {*/
/*	margin: 100px 0px;*/
/*	background: #150C23;*/
/*	border-top: 1px solid;*/
/*	border-bottom: 1px solid;*/
/*	border-image-source: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);*/
/*	border-image-slice: 1;*/
/*}*/

/*.Online h6,*/
/*.Online h5,*/
/*.Online p,*/
/*.Online h2 {*/
/*	color: #FFFFFF;*/
/*}*/

/*.Online h2 span {*/
/*	background-image: linear-gradient(130deg, #ff0000c4 27.79% 24.79%, #001bffc7 84.37%);*/
/*	color: transparent;*/
/*	display: inline-block;*/
/*	width: max-content;*/
/*	background-clip: text;*/
/*}*/

/*.Online .text-md-start {*/
/*	padding: 130px 0px;*/
/*}*/

/*.Online .text-md-start p {*/
/*	padding: 30px 0px 40px;*/
/*	width: 85%;*/
/*}*/

/*.Online figure {*/
/*	width: 100%;*/
/*	transform: scale(1.1);*/
/*	bottom: 5%;*/
/*	right: 10%;*/
/*	height: 100%;*/
/*}*/

/*.Online figure::before {*/
/*	content: '';*/
/*	position: absolute;*/
/*	top: 50%;*/
/*	left: 50%;*/
/*	width: 100%;*/
/*	height: 70%;*/
/*	background: #00009e5c;*/
/*	border-radius: 50%;*/
/*	transform: translate(-50%, -50%);*/
/*	filter: blur(200px);*/
/*	z-index: -1;*/
/*}*/

/*.Online .h-100 {*/
/*	gap: 30px;*/
/*}*/

/*.Online .col-xl-2 .text-center {*/
/*	padding: 40px 25px;*/
/*	border: 1px solid #711FE3;*/
/*	border-radius: 10px;*/
/*}*/

/* ======== End of 2.3. Online section ======== */
/* ======== 2.4. Team section ======== */

.Team {
	padding: 100px 0px;
}

.Team img {
	object-fit: cover;
	border-radius: 10px;
}

.Team .position-absolute {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(102.05deg, rgba(131, 109, 214, 0.7) 40.6%, rgba(255, 163, 123, 0.7) 91.37%);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	opacity: 0;
	transition: opacity 0.3s ease;
	border-radius: 10px;
}

.Team .position-relative:hover .position-absolute {
	opacity: 1;
}

.Team h2,
.Team h4,
.Team p,
.Team .position-absolute .d-flex {
	color: #ffffff;
}

.Team .position-absolute p {
	padding: 20px 0px;
}

.Team .position-absolute .d-flex a {
	color: #ffffff;
	font-size: 16px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: linear-gradient(100deg, #ff0909 1.84%, #4046d4 98.16%);
	box-shadow: 3.98px 3.98px 3.19px 0px #00000040 inset;
}

.Team .position-absolute .d-flex a:hover {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
}

.Team .text-md-start p {
	padding: 30px 0px 50px;
}

.Team .text-md-start {
	position: relative;
}

.Team .text-md-start::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 60%;
	width: 100%;
	height: 100%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(180px);
	z-index: -1;
}

/* ======== End of 2.4. Team section ======== */
/* ======== 3.1. Features section ======== */

.Features h2 {
	color: #FFF;
	padding: 0px 100px 0px 0px;
}

.Features h2 span {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	color: transparent;
	background-clip: text;
}

.Features .position-relative figure::before {
	content: '';
	position: absolute;
	top: 70%;
	left: 50%;
	width: 50%;
	height: 60%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(180px);
	z-index: -2;
}

.Features .position-relative img {
	border-radius: 10px;
}

.Features .position-absolute {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.Features .position-absolute i {
	color: #FFF;
	font-size: 50px;
	width: 120px;
	height: 120px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	border-radius: 50%;
	animation: pulse 2s infinite;
	transition: 0.3s ease all;
}

@keyframes pulse {
	0% {
		box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.7);
	}

	70% {
		box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);
	}

	100% {
		box-shadow: 0 0 0 25px rgba(255, 255, 255, 0);
	}
}

.Features .modal-dialog {
	max-width: unset;
	width: 80%;
}

.Features .modal-content {
	background-color: transparent;
	backdrop-filter: none;
}

.Features .modal-content button {
	opacity: 1;
	visibility: hidden;
	position: absolute;
	right: 10px;
	top: 0px;
	z-index: 1;
}

.Features .modal-content i {
	color: #FFF;
	visibility: visible;
	font-size: 28px;
	transition: color 0.3s ease;
}

.Features .modal-content button:hover i {
	color: #777777;
}

.Features .modal-body {
	width: 700px;
}

.Features iframe {
	border: none;
	width: 100%;
	border-radius: 18px;
	width: 100%;
	height: 400px;
}

.Features h5 {
	color: #FFF;
}

.Features p {
	color: #FFF;
}

.Features .flex-lg-column {
	gap: 30px;
}

.Features .gap-3 {
	padding: 30px 60px;
	border-radius: 20px;
}

.Features .gap-3 img {
	width: 60px;
}

.Features .gap-3:nth-child(5),
.Features .gap-3:nth-child(6),
.Features .gap-3:nth-child(1) {
	background: linear-gradient(130deg, #ff0000c4 27.79% 24.79%, #001bffc7 84.37%);
}

.Features .gap-3:nth-child(2) {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
}

.Features .gap-3:nth-child(3) {
	background: linear-gradient(100.57deg, #a40606 12.93%, #000cff 112.02%);
}

.Features .gap-3:nth-child(4) {
	background: linear-gradient(160.27deg, #962EFF 9.09%, #2F06B1 151.6%);
}

.Features .gap-3:nth-child(5) {
	background: linear-gradient(130deg, #ff0000c4 27.79% 24.79%, #001bffc7 84.37%);
}

.Features .gap-3:nth-child(6) {
	background: linear-gradient(130deg, #ff0000c4 27.79% 24.79%, #001bffc7 84.37%);
}

/* ======== End of 3.1. Features section ======== */
/* ======== 8.1. BlogDetails_Hero section ======== */

.BlogDetails_Hero {
	position: relative;
}

.BlogDetails_Hero::before {
	content: '';
	position: absolute;
	top: 25%;
	left: 50%;
	width: 50%;
	height: 60%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(180px);
	z-index: -2;
	
}

.BlogDetails_Hero h2 {
	color: #FFF;
	text-align: center;
 
}

.BlogDetails_Hero p {
	color: #FFF;
}

.BlogDetails_Hero .position-relative {
	padding: 80px 95px 45px;
}

.BlogDetails_Hero img {
	border-radius: 20px;
}

.BlogDetails_Hero .position-relative::before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
	width: 100%;
	height: 40%;
  /*background: linear-gradient(124deg, #00009e 10.79% 1.79%, #a52a2ab8 72.37%);*/
	border-radius: 20px;
	 background: linear-gradient(124deg, #00009e 10.79% 1.79%, #a52a2ab8 72.37%);
  
    padding: 100px 0px !important;
}

.BlogDetails_Hero iframe {
	height: 550px;
	border-radius: 20px;
}

/* ======== End of 8.1. BlogDetails_Hero section ======== */
/* ======== 8.2. Details section ======== */

.Details p {
	color: #FFF;
}

.Details h4 {
	color: #FFF;
}

.Details .gap-md-5 {
	padding: 0px 95px;
}

.Details img {
	border-radius: 20px;
}

.Details ul {
	list-style: disc inside;
}

.Details li {
	color: #FFF;
}

.Details figure {
	width: 40%;
}

.Details figure::before {
	content: '';
	position: absolute;
	top: 65%;
	left: 20%;
	width: 100%;
	height: 100%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(150px);
	z-index: -1;
}

.Details .py-4 {
	padding-right: 230px;
}

.Details .justify-content-center {
	width: 60%;
}

.Details hr {
	border: 1px solid;
	border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
	margin: 0;
}

/* ======== End of 8.2. Details section ======== */
/* ======== 8.3. Comment section ======== */

.Comment .pt-md-5 {
	padding: 0px 95px;
}

.Comment h6 {
	color: #FFF;
}

.Comment form {
	width: 80%;
}

.Comment textarea,
.Comment input {
	background: linear-gradient(102.05deg, rgba(131, 109, 214, 0.1) 40.6%, rgba(255, 163, 123, 0.1) 91.37%);
	border: none;
	color: #FFF;
	padding: 24px 24px;
}

.Comment textarea:focus {
	outline: none;
}

.Comment button {
	background-color: transparent;
}

/* ======== End of 8.3. Comment section ======== */
/* ======== 9.1. Contact_Details section ======== */

.Contact_Details {
	padding: 100px 0px;
	position: relative;
}

.Contact_Details::before {
	content: '';
	position: absolute;
	top: 70%;
	left: 75%;
	width: 50%;
	height: 70%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(210px);
	z-index: -1;
}

.Contact_Details h2,
.Contact_Details h4,
.Contact_Details p {
	color: #ffffff;
}

.Contact_Details h2 {
	padding: 0px 0px 50px;
}

.Contact_Details figure {
	width: 58px;
	height: 58px;

	border-radius: 50%;
	padding: 18px;
}

.Contact_Details figure i {
	font-size: 28px;
	color: #ffffff;
}

.Contact_Details a {
	width: 30%;
	display: inline-block;
}





.Contact_Details h4 {
	font-weight: 500;
}

.Contact_Details .text-start p {
	padding: 8px 0px 0px;
	flex-grow: 1;
}

/* ======== End of 9.1. Contact_Details section ======== */
/* ======== 9.2. Contact section ======== */

.Contact h2 {
	color: #ffffff;
	padding: 120px 0px 50px !important;
}

.contact form {
	width: 80%;
	gap: 40px;
	background: linear-gradient(102.05deg, rgba(131, 109, 214, 0.1) 40.6%, rgba(255, 163, 123, 0.1) 91.37%);
	border-radius: 20px;
	padding: 85px;
}

.contact form .d-flex {
	gap: 40px;
}

.Contact input,
.Contact textarea {
	width: 100%;
	padding: 14px 20px;
	background: linear-gradient(102.05deg, rgba(131, 109, 214, 0.1) 40.6%, rgba(255, 163, 123, 0.1) 91.37%);
	border-radius: 3px;
	border: 1px solid #711FE3;
	color: #FFFFFF;
	font-size: 16px;
	font-weight: 500;
	outline: none;
	margin:20px;
}

.Contact input[type="number"]::-webkit-outer-spin-button,
.Contact input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.Contact input::placeholder,
.Contact textarea::placeholder {
	color: #FFFFFF;
	font-size: 16px;
	font-weight: 500;
}



.Contact .hover2:hover {
	border: 1px solid transparent;
}

/* ======== End of 9.2. Contact section ======== */
/* ======== 10.1. Error_404 section ======== */

.Error_404 {
	padding: 100px 0px;
}

.Error_404 h2,
.Error_404 p {
	color: #ffffff;
}

.Error_404 h2 span {
	background-image: linear-gradient(130deg, #ff0000c4 27.79% 24.79%, #001bffc7 84.37%);
	color: transparent;
	display: inline-block;
	width: max-content;
	background-clip: text;
}

.Error_404 p {
	padding: 35px 0px 40px;
	width: 67%;
}

.Error_404 .position-relative::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(200px);
	z-index: -1;
}

/* ======== End of 10.1. Error_404 section ======== */
/* ======== 11.1. ComingSoon section ======== */

.ComingSoon {
	padding: 100px 0px;
}

.ComingSoon h1 {
	background-image: linear-gradient(130deg, #ff0000c4 27.79% 24.79%, #001bffc7 84.37%);
	color: transparent;
	display: inline-block;
	background-clip: text;
	width: 95%;
}

.ComingSoon h1 span {
	width: max-content;
}

.ComingSoon p {
	color: #ffffff;
	padding: 20px 0px 60px;
}

.ComingSoon .position-relative::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(210px);
	z-index: -1;
}

/* ======== End of 11.1. ComingSoon section ======== */
/* Mega dropdown wrapper */

.mega-dropdown {
  position: static !important; /* stop Bootstrap from forcing narrow width */
  
}

/* Mega menu container */
.mega-dropdown .mega-menu {
  width: 100% !important;        /* full width under navbar */

  right: 0;
  /* top: 100%; */
  margin-top: 0;
  position: absolute;
  background: #01030E;           /* dark navy background */
  border: none;
  border-radius: 0;
  display: none;
  z-index: 999;
}




/* Show mega menu on hover */
.mega-dropdown:hover .mega-menu {
  display: block;
}

/* Grid spacing */
.mega-menu .row {
  margin: 0;
  
}


.mega-menu .col-lg-3 {
  padding: 20px;
  min-width: 220px;
}

/* Section headings */
.mega-menu h6 {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  padding-bottom: 6px;
}

.col-lg-4.col-md-6 {
  flex: 1;
  min-width: 20px;
}
/* Links */
.mega-menu a {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #ddd;
  font-size: 14px;
  padding: 7px 0px !important;
  text-decoration: none;
}

.mega-menu a:hover {
  color: #FF0000 !important;
}

/* Hide nested menus initially */
#slid-products-drop,
#slid-api-drop,
#slid-company-drop {
  display: none;
  padding-left: 15px;
}
/* import font family is == Poppins ==*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

/* 
Theme Name:     Finteezy
Theme URI:      
Author:         
Author URI:     
Description:    
Version:        1.0
License:        
License URI:

 [Table of Content]
 01. Reset
 02. Global Style 
	  01. Index Page Style
        section Index Page
            1.1. Header section
            1.2. Hero section
            1.3. Partners section
            1.4. Services section
            1.5. Registration section
            1.6. Download section
            1.7. Benefits section
            1.8. Testimonials section
            1.9. Pricing section
            1.10. Blog section
            1.11. FAQs section
            1.12. Footer section
   
    02. About Page Style
        section About Page
            2.1. Subpage_Hero section
            2.2. Mission section
			2.3. Online section
			2.4. Team section

    03. Services Page Style
        section Services Page
            3.1. Features section

    04. Pricing Page Style
        
    05. Testimonial Page Style

    06. Team Page Style

    07. Blog Page Style
          
    08. BlogDetails_Hero Page Style
		section BlogDetails_Hero Page
			   8.1. BlogDetails_Hero section
			   8.2. Details section
			   8.3. Comment section

    09. Contact Page Style
		section Contact Page
				9.1. Contact_Details section
				9.2. Contact section

    10. Error Page Style
		section Error Page
				10.1. Error_404 section	

    11. ComingSoon Page Style
		section ComingSoon Page
				11.1. ComingSoon section	
    
 */

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
a,
p,
blockquote,
pre,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;

}


/* HTML5 display-role reset for older browsers */
/* =====  01. Reset  ====== */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block;
}

body {
	font-family: "Poppins", sans-serif;
	line-height: 1;
	background: #01030E; /* Dark background from logo */
	scroll-behavior: smooth;
	color: #FFFFFF;
}

ol,
ul {
	list-style: none;
}

blockquote,
q {
	quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
}

input:focus,
button:focus {
	outline: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

select {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	background-color: #ffffff;
	-webkit-text-fill-color: #ffffff;
	-webkit-box-shadow: 0 0 0px 1000px transparent inset;
	transition: background-color 5000s ease-in-out 0s;
}

select::-ms-expand {
	display: none;
}

label {
	font-weight: normal;
}

iframe {
	width: 100%;
}

/* =====  End of 01. Reset  ====== */
/* ===== 02. Global Style ===== */

/* Headings with theme colors */
h1, h2, h3, h4, h5, h6 {
	font-family: "Poppins", sans-serif;
	font-weight: 700;
	color: #FF0000; /* Red by default */
}

h1 {
	font-size: 40px;
	line-height: 90px;
}

h2 {
	font-size: 56px;
	line-height: 76px;
}

h3 {
	font-size: 38px;
	line-height: 50px;
}

h4 {
	font-size: 30px;
	line-height: 40px;
}

h5 {
	font-size: 20px;
	line-height: 30px;
	font-weight: 600;
}

h6 {
	font-size: 18px;
	line-height: 24px;
	font-weight: 600;
}

p {
	font-size: 16px;
	line-height: 22px;
	font-weight: 400;
	color: #DDDDDD;
}

a {
	font-size: 18px;
	line-height: 24px;
	font-weight: 500;
	text-decoration: none;
	font-family: "Poppins", sans-serif;
	color: #0000FF; /* Blue links */
	  
}

a:hover {
	color: #FF0000; /* Red on hover */
}

button {
	font-size: 18px;
	line-height: 24px;
	font-weight: 500;
	padding: 14px 22px;
	font-family: "Poppins", sans-serif;
	border: none;
	outline: none;
}

/* Primary Button */
.hover1 {
	display: inline-block;
	position: relative;
	overflow: hidden;
	cursor: pointer;
	transition: 0.5s ease;
	font-weight: 500;
	color: #FFFFFF;
	z-index: 1;
	padding: 17px 50px;
	border-radius: 40px;
	border: 1px solid transparent;
	line-height: 27px;
	text-align: center;
}

.hover1::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(100.57deg, #FF0000 12.93%, #0000FF 121.02%);
	position: absolute;
	border-radius: 40px;
	z-index: -1;
	transition: 0.4s ease;
	top: 0px;
	left: 0px;
}

.hover1:hover {
	color: #ffffff;
	border: 1px solid #0000FF;
}

.hover1:active {
	filter: brightness(0.8);
}

@keyframes moveRight {
	from {
		left: 0;
	}

	to {
		left: 100%;
	}
}

@keyframes moveLeft {
	from {
		left: 100%;
	}

	to {
		left: 0;
	}
}

.hover1::before {
	animation: moveLeft 0.4s forwards;
}

.hover2 {
	display: inline-block;
	position: relative;
	overflow: hidden;
	cursor: pointer;
	transition: 0.5s ease;
	font-weight: 500;
	color: #FFFFFF;
	z-index: 1;
	padding: 17px 50px;
	border-radius: 40px;
	border: 1px solid #FF0000;
	line-height: 27px;
	text-align: center;
}

.hover2::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(100.57deg, #FF0000 12.93%, #0000FF 121.02%);
	position: absolute;
	border-radius: 40px;
	z-index: -1;
	transition: 0.4s ease;
	top: 0px;
	left: 100%;
}

.hover2:hover::before {
	animation: moveLeft 0.4s forwards;
}

.hover2:hover {
	color: #ffffff;
	border: 1px solid transparent;
}

.hover2:active {
	filter: brightness(0.8);
}

.hover2::before {
	animation: moveRight 0.4s forwards;
}

@keyframes moveLeft {
	from {
		left: 100%;
	}

	to {
		left: 0;
	}
}

@keyframes moveRight {
	from {
		left: 0;
	}

	to {
		left: 100%;
	}
}

/* form validation modal */
.modal-content {
	padding: 40px;
	background: rgba(23, 22, 38, 0.6);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

.modal-content img {
	margin: auto;
	width: 100px;
}

.modal-content div {
	padding: 40px 0px;
	width: 350px;
	margin: auto;
}

.modal-content h4,
.modal-content h6 {
	margin: auto;
	color: #ffffff;
	text-align: center;
}

.modal-content h6 {
	margin: 15px auto;
}

.modal .hover1 {
	width: 100px;
	padding: 12px 24px;
}

/* Scroll To Top Button */
.scrollToTop {
	display: none;
	height: 60px;
	width: 60px;
	position: fixed;
	bottom: 20px;
	right: 20px;
	background-color: #0000FF; /* Blue */
	border-radius: 50%;
	overflow: hidden;
	cursor: pointer;
	z-index: 999;
	transition: 0.5s ease all;
}

.scrollToTop:hover {
	transform: translateY(-15%);
}

.scrollToTop .arrowUp {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 3;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #FFF;
	font-size: 24px;
}

.scrollToTop .water {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	transform: translateY(100%);
	background-color: #FF0000E0; /* Red */
	transition: all 0.3s;
}

.scrollToTop .water_wave {
	width: 200%;
	position: absolute;
	bottom: 100%;
}

.scrollToTop .water_wave_back {
	right: 0;
	fill: #C7EEFF;
	animation: wave-back 1.4s infinite linear;
}

.scrollToTop .water_wave_front {
	left: 0;
	fill: #FF0000E0;
	margin-bottom: -1px;
	animation: wave-front 0.7s infinite linear;
}

@keyframes wave-front {
	100% {
		transform: translateX(-50%);
	}
}

@keyframes wave-back {
	100% {
		transform: translateX(50%);
	}
}

/* pre_loader */
.site-wrapper {
	visibility: hidden;
	overflow: hidden;
	opacity: 0;
	transition: all 0.5s ease;
	display: none;
}

body.preloader-active {
	overflow: hidden;
	transition: all 0.5s ease;
}

.preloader {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #01030ECC;
	z-index: 9999;
	display: flex;
	justify-content: center;
	align-items: center;
}

.preloader-logo {
	position: relative;
	width: 100px;
	height: 100px;
	background-image: url('../images/logo2.svg');
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

.preloader::before {
	content: "";
	position: absolute;
	background: url("../images/icons/botted_circle.svg") no-repeat center center;
	height: 400px;
	width: 400px;
	transform: translate(-50%, -50%);
	animation: rotate 10s linear infinite;
}

@keyframes rotate {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

.cursor-effect {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	box-shadow: 0px 0 15px #FF0000; /* Red glow */
	position: absolute;
	pointer-events: none;
	transform: scale(1) translate(-30px, -30px);
	transition: transform 0.2s ease, left 0.3s ease, top 0.3s ease;
	z-index: 9999999999;
}

/* ===== End of 02. Global Style ===== */

/* ========= 1.1. Header section ======== */

.nav-logo img {
	width: 183px;
}

.navbar-brand img {
	width: 140px;
}

header .flex-row-reverse {
	width: 100%;
}

.navbar-collapse {
	justify-content: center;
}

.right-sidbar {
	width: 280px;
	position: fixed;
	height: 100vh;
	top: 0;
	left: -355px;
	overflow-x: hidden;
	transition: 0.5s;
	padding: 20px 10px 20px 5px;
	background: #01030E; /* Dark navy background */
	z-index: 999999;
}

.open-aside {
	max-height: 50px;
	display: none;
	z-index: 2;
}

aside .fa-xmark {
	padding: 10px 15px;
	background: linear-gradient(100.57deg, #FF0000 12.93%, #0000FF 121.02%);
	color: #ffffff;
	border: none;
	border-radius: 10px;
	font-size: 22px;
}

aside .fa-caret-down {
	color: #0000FF; /* Blue arrow */
	font-size: 18px;
}

.right-sidbar a:focus,
aside a {
	color: #FFFFFF;
}

aside a:hover {
	color: #FF0000; /* Red hover */
}

#slid-drop {
	display: none;
}

aside li {
	padding: 12px;
}

#slid-drop li {
	padding: 12px 0px;
}

.aside-dropdwon {
	display: block !important;
}

.page-btn {
	padding: 0px 0px 10px;
	color: #ffffff;
	font-weight: 400;
	background-color: transparent;
	border: none;
	font-size: 16px;
}

.navbar ul li a:focus,
.navbar ul li a {
	color: #ffffff;
	padding: 15px;
	font-weight: 400;
	font-size: 16px;
}

.dropdown ul .active {
	background: none;
}

.right-sidbar a:active,
.right-sidbar a:focus,
.right-sidbar .nav-item a {
	font-weight: 400;
	color: #ffffff;
	font-size: 16px;
}

header #slid-btn:hover .page-btn,
header #slid-btn.active .page-btn,
aside .nav-item .active,
.right-sidbar .active a,
.right-sidbar a:hover,
.navbar ul .active,
.navbar ul li a:hover {
	color: #0000FF; /* Blue active/hover */
	font-size: 16px;
}

.dropdown ul {
	width: 200px;
}

.dropdown-menu {
	padding: 15px 10px;
	background: #01030E; /* Dark navy */
	display: block;
	overflow: hidden;
	transition: all 0.3s ease-in;
	visibility: hidden;
	border-radius: 10px;
}

.dropdown ul li a:focus,
.dropdown ul li a:active {
	background: transparent;
}

.dropdown ul li a {
	color: #ffffff;
	border-radius: 10px;
	background: transparent;
}

.dropdown ul li a:hover {
	color: #FF0000; /* Red hover */
	background-color: transparent;
}

.open-aside {
	padding: 12px 15px;
	background: linear-gradient(100.57deg, #FF0000 12.93%, #0000FF 121.02%);
	border: none;
	border-radius: 10px;
	font-size: 25px;
	color: #ffffff;
}

aside .fa-xmark:hover,
.open-aside:hover {
	background: linear-gradient(102.05deg, #0000FF 40.6%, #FF0000 91.37%);
	color: #ffffff;
}

header .search i {
	font-size: 30px;
	color: #FFF;
}

header .SearchModal button {
	border: none;
	background: none;
	padding: 0px;
}

header .modal {
	display: none;
	position: fixed;
	z-index: 1000;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.8);
	backdrop-filter: blur(7px);
	justify-content: center;
	align-items: center;
	opacity: 0;
	transition: opacity 0.5s ease-in-out;
}

header .modal.show {
	opacity: 1;
}

header .searchModal .close-btn {
	position: absolute;
	top: 10px;
	right: 10px;
	background: none;
	color: #FFFFFF;
	border: none;
	font-size: 50px;
}

header .searchModal .close-btn:hover {
	color: #FF0000; /* Red hover */
}

header .searchModal .modal-content div {
	width: 100%;
}

header .searchModal .position-relative {
	display: flex;
	align-items: center;
	width: 80%;
	position: relative;
	transform: translateY(-400%);
	transition: transform 0.7s ease-in-out;
}

header .modal.show .position-relative {
	transform: translateY(0);
}

header .searchModal input {
	width: 100% !important;
	padding: 20px 30px;
	outline: none;
	background: #01030E;
	color: #ffffff;
	border: 1px solid #0000FF; /* Blue border */
	border-radius: 10px;
}

header .search-btn {
	border: none;
	background: none;
	padding: 0px;
	position: absolute;
	right: 20px;
}

header .searchModal img[alt="search"] {
	width: 20px !important;
}

body.modal-open {
	overflow: hidden;
}

header .pt-lg-4 .p-0 {
	font-size: 24px;
	font-family: "Forum", serif;
	color: #FFFFFF;
	transition: all 0.3s ease;
}

header .pt-lg-4 .p-0:hover {
	color: #FF0000; /* Red hover */
}

header .pt-lg-4 {
	position: relative;
}

/* ========= End of 1.1. Header section ======== */

/* ========= 1.2. Hero section ======== */

.Hero {
	padding: 100px 0px;
}

.Hero h2,
.Hero h1,
.Hero p {
	color: #FFFFFF;
}

.Hero h1 span {
    background-image: linear-gradient(105deg, #FF0000 39.5%, #0000FF 39%);
	color: transparent;
	display: inline-block;
	width: max-content;
	background-clip: text;
}

.Hero p {
	padding: 26px 177px 30px 0px;
}

.Hero .mt-1 h5 {
	color: #ffffff;
	padding: 60px 0px 15px;
	font-weight: 500;
}

.Hero .mt-1 img {
	width: 71px;
	border-radius: 50%;
	border: 3px solid #FF0000; /* Red border around avatars */
}

.Hero .mt-1 figure:nth-child(2) {
	left: -4%;
	position: relative;
}

.Hero .mt-1 figure:nth-child(3) {
	position: relative;
	left: -8%;
}

.Hero .rounded-circle {
	border: 3px solid #000000;
	background-color: #ffffff;
	width: 71px;
	height: 71px;
	left: -12%;
}

.Hero .rounded-circle h5 {
	color: #000000;
}

.Hero .position-absolute::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	background: #00009e2b; /* Soft blue glow */
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(100px);
	z-index: -1;
}

.Hero .position-absolute {
	left: -25%;
	top: 4%;
	z-index: -1;
}

.Hero .position-absolute img {
	width: 75%;
}

.Hero .align-items-end {
	gap: 35px;
}

.Hero .align-items-end p {
	padding: 5px 0px 0px;
}

/* ========= End of 1.2. Hero section ======== */


/* ======== 1.3. Partners section ======== */

.Partners h5 {
	color: #FFFFFF;
}

.Partners hr {
	margin: 0;
	opacity: 1;
	border-top: 1px solid;
	border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1; /* Red → Blue */
}



.PartnersSlider {
	padding: 50px 50px 0px;
}

.PartnersSlider img {
	height: 34px;
	object-fit: contain;
}
.PartnersSlider img[alt="Bill Avenue"] {
  height: 70px;
  width: 180px; /* increase width manually */
}
.PartnersSlider .slick-slide {
	padding: 0px 24px;
	margin: 0px 15px !important;
}


.slick-list {
  margin: 0 -15px; /* to balance the outer gap */
}
/* ======== End of 1.3. Partners section ======== */

/* ======== 1.4. Services section ======== */

.Services {
	padding: 100px 0px;
}

.Services h2 {
	color: #FFF;
}

.Services h5 {
	color: #FFF;
}

.Services p {
	color: #FFF;
}

.Services h2 span {
    /*background-image: linear-gradient(105deg, #FF0000 39.5%, #0000FF 39%);*/
    /*background-image: linear-gradient(105deg, #FF0000 25.5%, #0000FF 28%);*/
        background-image: linear-gradient(106deg, #FF0000 48.5%, #0000FF 52%);
	color: transparent;
	background-clip: text;
}
.Services h2 .our{
    /*background-image: linear-gradient(105deg, #FF0000 39.5%, #0000FF 39%);*/
    background-image: linear-gradient(105deg, #FF0000 25.5%, #0000FF 28%);
        /*background-image: linear-gradient(106deg, #FF0000 48.5%, #0000FF 52%);*/
	color: transparent;
	background-clip: text;
}
.Services img {
	width: 70px;
	filter: brightness(0) invert(1);
}

.Services .flex-wrap {
	gap: 30px 24px;
}

.Services .flex-wrap .gap-3 {
	width: 32%;
	flex-grow: 1;
	padding: 40px 24px;
	border-radius: 30px;
}

.Services .flex-wrap .gap-3 p {
	font-size: 14px;
	line-height: 20px;
}

/* Service cards with consistent red-blue gradients */
.Services .flex-wrap .gap-3:nth-child(1),
.Services .flex-wrap .gap-3:nth-child(7) {
    background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%); /* Red to Blue */
}

.Services .flex-wrap .gap-3:nth-child(2),
.Services .flex-wrap .gap-3:nth-child(8) {
    background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%); /* Red to Blue */
}

.Services .flex-wrap .gap-3:nth-child(3),
.Services .flex-wrap .gap-3:nth-child(9) {
    background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%); /* Strong Red to Blue */
}

.Services .flex-wrap .gap-3:nth-child(4),
.Services .flex-wrap .gap-3:nth-child(10) {
    background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%); /* Red to Blue */
}

.Services .flex-wrap .gap-3:nth-child(5),
.Services .flex-wrap .gap-3:nth-child(11) {
    background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%); /* Subtle Red to Blue */
}

.Services .flex-wrap .gap-3:nth-child(6),
.Services .flex-wrap .gap-3:nth-child(12) {
    background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%); /* Soft Red to Blue */
}



.Services .h-100 {
	padding-left: 24px;
}

.Services .h-100::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 40%;
	width: 100%;
	height: 70%;
	background: #00009e5c; /* Blue glow */
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(150px);
	z-index: -1;
}

.Services .m-0::before {
	display: none;
}

.Services .h-100 p {
	padding-right: 40px;
	    margin-bottom: 40px;
}

/* ======== End of 1.4. Services section ======== */
 
      

/* ========= 1.5. Registration section ======== */

.Registration {
	padding: 0px 0px 100px;
}

.Registration h2,
.Registration h5,
.Registration p {
	color: #FFFFFF;
}

.Registration h2 span {
	background-image: linear-gradient(115deg, #FF0000 35%, #0000FF 100%); /* Red → Blue */
	color: transparent;
	display: inline-block;
	width: max-content;
	background-clip: text;
}

.Registration h2 {
	width: 82%;
}

.Registration .col-lg-6:nth-child(1) p {
	padding: 25px 94px 40px 0px;
}

.Registration ul li {
	position: relative;
	padding: 0px 0px 0px 45px;
}

.Registration ul li h6 {
	color: #ffffff;
	font-weight: 500;
}

.Registration ul {
	gap: 45px;
}

.Registration ul li:before {
	content: "\f00c";
	font-family: "Font Awesome 5 Free";
	font-size: 20px;
	padding: 5px;
	font-weight: 700;
	position: absolute;
	left: 0px;
	top: -2px;
	color: #FFF;
	border-radius: 50%;
	background: linear-gradient(137.28deg, #FF0000 1.84%, #0000FF 98.16%); /* Red → Blue */
	box-shadow: 5px 5px 4px 0px #00000040 inset;
}

.Registration .gap-md-4 {
	margin: 50px 0px 0px;
}

.Registration .position-relative {
	width: fit-content;
}

.Registration .position-relative::before {
	content: "";
	position: absolute;
	top: 38%;
	left: 63%;
	background: linear-gradient(45deg, #FF0000 40.6%, #0000FF 91.37%); /* Red → Blue */
	border-radius: 50%;
	transform: translate(-50%, -50%);
	z-index: -1;
	width: 550px;
	height: 550px;
}

.Registration .position-relative::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 140%;
	height: 80%;
	background: #0000FF80; /* Soft blue glow */
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(100px);
	z-index: -2;
}

.Registration .gap-lg-3 {
	padding: 20px 70px 14px 16px;
	background-color: #272B40;
	border-radius: 16px;
	width: fit-content;
}

.Registration .gap-lg-3 figure {
	width: 26px;
	height: 26px;
	background-color: #FFFFFF;
	border-radius: 8px;
}

.Registration .gap-lg-3 .p-0 {
	color: #868894;
	font-size: 12px;
}

.Registration img[alt="monthly_Graph"] {
	position: relative;
	left: -13%;
}

/* ========= End of 1.5. Registration section ======== */

/* ======== 1.6. Download section ======== */

.Download {
	margin: 100px 0px;
	background: #150C2380;
	border-top: 1px solid;
	border-bottom: 1px solid;
	border-image-source: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	border-image-slice: 1;
}

.Download h6,
.Download h5,
.Download p,
.Download h2 {
	color: #FFFFFF;
}

.Download h2 span {
	background-image: linear-gradient(130deg, #ff0000c4 27.79%, #001bffc7 84.37%);
	color: transparent;
	display: inline-block;
	width: max-content;
	background-clip: text;
}

.Download p {
	padding: 25px 0px 45px;
}

.Download h6,
.Download h5 {
	font-weight: 600;
}

.Download .gap-lg-3 p {
	padding: 0px;
	font-size: 12px;
	line-height: 14px;
}

.Download figure.h-100 {
	width: fit-content;
}

.Download img[alt="download_Img"] {
	width: 76%;
	margin: 0px auto;
	position: relative;
	bottom: 15%;
	transform: scale(1.3);
}

.Download figure.h-100::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 150%;
	height: 100%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(80px);
	z-index: -1;
}

.Download .gap-lg-3 a {
	background: linear-gradient(100.57deg, rgba(48, 6, 164, 0.2) 12.93%, rgba(255, 163, 123, 0.2) 121.02%);
	border-radius: 10px;
	padding: 20px 22px;
	border: 1px solid #FF0000;
	transition: 0.3 ease all;
}

.Download .gap-lg-3 a:hover {
	background: transparent;
}

.Download .justify-content-end {
	padding: 90px 0px 80px;
	position: relative;
	z-index: 1;
}

/* ======== End of 1.6. Download section ======== */
/* ======== 1.7. Benefits section ======== */

.Benefits h2 {
	color: #FFF;
	padding-right: 100px;
}

.Benefits p {
	color: #711FE3;
	font-weight: 700;
}

.Benefits h5 {
	color: #711FE3;
}

.Benefits h2 span {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	color: transparent;
	background-clip: text;
}

.Benefits .gap-4 figure {
	width: 60px;
}

.Benefits .align-items-center figure {
	width: 45px;
}

.Benefits .position-absolute {
	background: linear-gradient(130deg, #ff0000c4 27.79% 24.79%, #001bffc7 84.37%);
	border-radius: 10px;
	top: 50%;
	right: -30%;
	transform: translateY(-50%);
	width: 53%;
}

.Benefits .position-absolute p {
	color: #FFF;
	font-weight: 400;
}

.Benefits .position-absolute figure {
	width: 40px;
	background: linear-gradient(160.27deg, #962EFF 9.09%, #2F06B1 151.6%) no-repeat;
	height: 40px;
	border-radius: 50%;
	color: #FFF;
	font-size: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.Benefits .gap-4 figure:nth-child(2) {
	background: linear-gradient(100deg, #ff0909 1.84%, #4046d4 98.16%) no-repeat;
	box-shadow: 5px 5px 4px 0px #00000040 inset;
	border-radius: 50%;
	height: 60px;
	margin: 35px 0px;
	transform: translateX(-120%);
}

.Benefits .py-4 {
	padding-left: 70px;
}

.Benefits figure:nth-child(2) img {
	width: 30px;
	border-radius: 0;
}

.Benefits .gap-4 img {
	width: 60px;
	border-radius: 50%;
}

.Benefits .gap-3 img {
	width: 45px;
}

.Benefits .col-lg-7 .position-relative {
	background: #FFF;
	width: 75%;
	border-radius: 5px;
	padding: 40px 40px;
}

.Benefits .position-relative .gap-5 {
	width: 60%;
}

.Benefits .flex-column.gap-3 .gap-4 {
	background: #F2EBFC;
	padding: 18px 35px;
	border-radius: 5px;
}

.Benefits .col-lg-5 figure::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 40%;
	width: 100%;
	height: 70%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(100px);
	z-index: -1;
}

/* ======== End of 1.7. Benefits section ======== */
/* ======== 1.8. Testimonials section ======== */

.Testimonials {
	padding: 100px 0px !important;
}

.Testimonials h3 {
	color: #FFF;
}

.Testimonials h2 {
	color: #FFF;
	padding-right: 50px;
}

.Testimonials p {
	color: #FFF;
}

.Testimonials h6 {
	color: #FFF;
}

.Testimonials .ps-lg-5 {
	gap: 40px;
}

.Testimonials .flex-row {
	gap: 80px;
}

.Testimonials .flex-column .position-relative {
	width: 85%;
	padding: 30px 45px;
	border-radius: 10px;
	   background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%);

}

.Testimonials .flex-column .position-relative:nth-child(6),
.Testimonials .flex-column .position-relative:nth-child(2) {
 background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%);
	align-self: flex-end;
}

.Testimonials .flex-column .position-relative:nth-child(3) {
  background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%);
}

.Testimonials .position-absolute {
	top: -7px;
	right: 40px;
}

.Testimonials .py-md-1 p {
	font-weight: 500;
}

.Testimonials p.p-0 {
	font-size: 14px;
	line-height: 20px;
}

.Testimonials i {
	color: #C69E0C;
	font-size: 12px;
}

.Testimonials img {
	width: 80px;
	border-radius: 50%;
}

.Testimonials .position-absolute img {
	width: 30px;
	border-radius: 0;
}

.Testimonials .col-md-6:nth-child(1) .h-100::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 40%;
	width: 100%;
	height: 70%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(100px);
	z-index: -1;
}

.Testimonials .col-md-6:nth-child(1) .m-0::before {
	display: none;
}

.Testimonials.m-0 h2 {
	padding: 0px 24px;
}

.Testimonials.m-0 p.py-0 {
	padding: 0px 230px;
}

.Testimonials.m-0 .pt-5 {
	gap: 40px;
}

.Testimonials .flex-wrap .position-relative:nth-child(1),
.Testimonials .flex-wrap .position-relative:nth-child(5) {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);

}

.Testimonials .flex-wrap .position-relative {
	width: 40% !important;
	flex-grow: 1;
}

.Testimonials.m-0 {
	position: relative;
}

.Testimonials.m-0::before {
	content: '';
	position: absolute;
	top: 50%;
	right: 0%;
	width: 30%;
	height: 30%;
	background: #00009e5c;
	border-radius: 50%;
	filter: blur(100px);
	z-index: -1;
}

.Testimonials.m-0 .flex-column .position-relative:nth-child(6),
.Testimonials.m-0 .flex-column .position-relative:nth-child(2) {
	align-self: unset;
}

/* ======== End of 1.8. Testimonials section ======== */
/* ======== 1.9. Pricing section ======== */

.Pricing {
	padding: 100px 0px;
	background: #150C2380;
	border: 1px solid;
	border-left: none;
	border-right: none;
	border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}

.Pricing .row {
	row-gap: 70px;
}

.Pricing h4 {
	color: #FFF;
}

.Pricing h2 {
	color: #FFF;
	font-weight: 600;
}

.Pricing h2 span {
    background-image: linear-gradient(85deg, #FF0000 46.5%, #0000FF 39%);

	background-clip: text;
	color: transparent;
}

.Pricing p {
	color: #FFF;
}

.Pricing figure::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	background: #00009e2b;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(100px);
	z-index: -1;
}

.Pricing img {
	width: 85%;
}

.Pricing .h-100.gap-4 {
	border: 1px solid #FF0000;
	border-radius: 20px;
	padding: 50px 80px 45px;
}

.Pricing .h-100.gap-4:hover {
	border: 1px solid #2F06B1;
}

.Pricing .gap-4 h2 {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	color: transparent;
	background-clip: text;
	font-size: 60px;
	line-height: 90px;
}

.Pricing .align-items-center p {
	padding-right: 100px;
	font-weight: 500;
}

.Pricing.mx-0 {
	margin: 100px 0px;
}

.Pricing.mx-0 .row {
	row-gap: 35px;
}

/* ======== End of 1.9. Pricing section ======== */
/* ======== 1.10. Blog section ======== */

.Blog {
	padding: 100px 0px;
	position: relative;
}

.Blog::before {
	content: '';
	position: absolute;
	top: 60%;
	left: 10%;
	width: 30%;
	height: 50%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(150px);
	z-index: -2;
}

.Blog h2,
.Blog p,
.Blog h4 {
	color: #ffffff;
}

.Blog h4 {
	font-weight: 600;
}

.Blog .mx-auto p {
	padding: 12px 300px 70px;
}

.Blog figure {
	width: 100%;
}

.Blog img[alt="blog_img1"] {
	width: -webkit-fill-available;
}

.Blog img {
	width: 100%;
	border-radius: 10px;
	height: 100%;
	object-fit: cover;
}

.Blog .border-1 {
	border: 1px solid #711FE3;
	border-radius: 10px;
}

.Blog .border-1:hover {
	border: 1px solid #2F06B1;
}

.Blog .col-lg-9 .border-1 .flex-column {
	padding: 65px 22px;
}

.Blog .col-lg-9 .border-1.flex-column {
	padding: 65px 20px;
	width: 59%;
}

.Blog .col-lg-9 .border-1 p {
	padding: 20px 0px 30px;
}

.Blog .col-lg-3 .border-1 .flex-column {
	padding: 35px 10px 20px 15px;
}

.Blog .col-lg-3 .border-1 .flex-column p {
	padding: 20px 2px 30px 0px;
}

.Blog a {
	color: #ffffff;
	transition: 0.3s ease all;
}

.Blog a:hover {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

/* ======== End of 1.10. Blog section ======== */
/* ======== 1.11. FAQs section ======== */

.FAQs h2 {
	color: #FFF;
}

.FAQs p {
	color: #FFF;
	padding: 24px 20px 40px 0px;
}

.FAQs h2 span {
	    background-image: linear-gradient(90deg, #FF0000 50%, #0000FF 39%);
	color: transparent;
	background-clip: text;
}

.FAQs .col-lg-7 {
	padding-right: 130px;
}

.FAQs .accordion {
	gap: 40px;
}

.FAQs .accordion-item {
	color: #FFF;
	border-radius: 10px;
	border: 1px solid #FF0000;
	background-color: transparent;
	overflow: hidden;
}

.FAQs .accordion-item:last-child {
	border-bottom: 1px solid #FF0000;
}

.FAQs .accordion-button {
	color: #FFF;
	background: linear-gradient(100.57deg, #a40606 12.93%, #000cff 112.02%);
	font-size: 16px;
	font-weight: 600;
	padding: 22px 30px;
}

.FAQs .accordion-button::after {
	background: none !important;
	font-size: 24px;
	content: "\f067";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
}

.FAQs .accordion-button:focus {
	box-shadow: none;
}

.FAQs .accordion-button:not(.collapsed)::after {
	content: "\f068";
}

.FAQs .accordion-button:not(.collapsed) {
	border-bottom: 1px solid #FF0000;
}

.FAQs .accordion-body {
	padding: 35px 24px;
}

.FAQs .accordion-body p {
	padding: 0;
}

.FAQs img {
	width: 100%;
	border-radius: 20px;
}

.FAQs figure::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 40%;
	width: 100%;
	height: 70%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(100px);
	z-index: -1;
}

/* ======== End of 1.11. FAQs section ======== */
/* ======== 1.12. Footer section ======== */

footer {
	
	position: relative;
}



footer input::placeholder,
footer p,
footer h6,
footer h5,
footer h2 {
	color: #ffffff;
}

footer h5 {
	font-weight: 600;
}

footer form {
	margin: 0px 0px 70px;
}

footer form input {
	padding: 25px 45px;
	background-color: transparent;
	border: 2px solid #711FE3;
	border-radius: 10px;
	color: #ffffff;
	width: 52%;
	font-size: 16px;
}

footer .hover1 {
	padding: 25px 35px;
	color: #FFFFFF;
	font-size: 18px;
	border-radius: 10px;
	background-color: transparent;
}

footer .hover1::before {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	border-radius: 10px;
}

footer .hover1:hover {
	background: transparent;
}

footer .justify-content-between {
	padding: 70px 0px;
	border-top: 1px solid;
	border-bottom: 1px solid;
	border-image-source: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	border-image-slice: 1;
}

footer img[alt="logo"] {
	width: 237px;
}

footer .m-0 {
	width: 71%;
	padding: 30px 0px 25px;
}

footer .gap-lg-4 figure {
	width: 60%;
	height: 50px;

	border-radius: 50%;
	border: 1px solid transparent;
}



footer .gap-lg-4 figure:hover {

	background: none;
}

footer .gap-lg-4 figure i {
	color: #ffffff;
	font-size: 20px;
}

footer ul {
	width: 63%;
}

footer ul li {
	padding: 10px 0px;
}

footer ul li,
footer ul li a {
	font-size: 16px;
	color: #ffffff;
	font-weight: 400;
}

footer ul li a:hover {
	color: #FFA37B;
}

footer li a span {
	font-size: 24px;
	font-weight: 600;
	padding: 10px 0px 0px;
    background-image: linear-gradient(85deg, #FF0000 70.5%, #0000FF 39%);
	background-clip: text;
	-webkit-text-fill-color: transparent;
	transition: 0.4s ease all;
}

footer li a span:hover {
	background: linear-gradient(160.27deg, #962EFF 9.09%, #2F06B1 151.6%);
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

footer .p-0 p {
	    padding: 9px 0px 0px;
	width: 74%;
}

footer .p-0 .gap-lg-3 a p {
	width: 100%;
	padding: 0px;
	font-size: 12px;
}

footer .p-0 .gap-lg-3 a {
	background: linear-gradient(100.57deg, rgba(48, 6, 164, 0.2) 12.93%, rgba(255, 163, 123, 0.2) 121.02%);
	border-radius: 10px;
	padding: 9px 22px;
	border: 1px solid #FF0000;
	width: max-content;
	transition: 0.3s ease all;
}

footer .p-0 .gap-lg-3 a:hover {
	background: transparent;
}

footer .d-block {
	width: max-content;
}

footer .z-1 {
	width: 40%;
}

footer .ms-0 {
	width: min-content;
	padding: 0px 100px 0px 0px;
}

footer .ms-0 ul {
	width: 100%;
}
.footer {
  color: #fff;
  font-size: 0.9rem;
  text-align: center;
}

.footer-container p,
.footer-container a {
  font-size: 14px;
  margin: 5px 0;
  text-decoration: none;
    
      text-align:center;
}

.footer-links {
  display: inline-flex;
  gap: 10px;
  margin-top: 10px;
}

.footer-links a {
  cursor: pointer;
}

.footer-links a:not(:last-child)::after {
  content: " • ";
  margin: 0 6px;
  font-weight: bold;
}
.abc{
    margin: -15px;
}


.policy-section {
  display: none;
  max-width: 1300px;
  margin: 2.5rem auto;


}

main {
  position: relative;
  z-index: 2;
}



#refund:target,
#terms:target,
#privacy:target,
#dataresidency:target,
#aml-kyc:target,
#grievance-redressal:target{
  display: block;
}

.policy-content h1 {
 

  text-align: center;
     color: white;
    background: linear-gradient(124deg, #00009e 10.79% 1.79%, #a52a2ab8 72.37%);
  margin-bottom: 2rem;
      border-radius: 20px;
    padding: 70px 45px;
}

.policy-content h2 {
  font-size: 1.4rem;
  font-weight: 700;

}

.policy-content p,
.policy-content li {
  margin-bottom: 1rem;
  line-height: 1.7;
  
}
.policy-content li{
 list-style: disc !important;
}
.policy-content ul {
  list-style: disc;
  padding-left: 1.5rem;
}


.footer-links {
  display: flex;
  justify-content: center;
  gap: 1.5rem;
  margin-top: 0.75rem;
}

.footer-links a {
  color: #9ca3af;
  text-decoration: none;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  transition: 0.2s;
}

.footer-links a:hover {
  color: #fff;
  background: #374151;
}

/* ======== End of 1.12. Footer section ======== */
/* ======== 2.1. subpage_hero section ======== */

.Subpage_Hero {
	position: relative;
	
}

.Subpage_Hero::before {
	content: '';
	position: absolute;
	top: 30%;
	left: 50%;
	width: 70%;
	height: 100%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(200px);
	z-index: -1;
}

.Subpage_Hero .text-center {
    background: linear-gradient(124deg, #00009e 10.79% 1.79%, #a52a2ab8 72.37%);
    border-radius: 20px;
    padding: 60px 0px;
}
.subpage_hero .text-center {
    background: linear-gradient(124deg, #00009e 10.79% 1.79%, #a52a2ab8 72.37%);
    border-radius: 20px;
    padding: 60px 0px;
}

.subpage_hero .text-center h2, p {
	color: #ffffff;
	
}
.Subpage_Hero .text-center h2,
.Subpage_Hero .text-center p {
	color: #ffffff;
}

.Subpage_Hero .text-center h2 {
	font-weight: 600;
}

.Subpage_Hero .text-center p {
	padding: 30px 270px 0px;
}
.subpage_hero .text-center h2 {
	font-weight: 600;
}

.subpage_hero .text-center p {
	padding: 30px 270px 0px;
}

/* ======== End of 2.1. subpage_hero section ======== */
/* ======== 2.2. Mission section ======== */

.Mission h5 {
	background-image: linear-gradient(124deg, #00009eed 16.79% 9.79%, #a52a2ab8 72.37%);
    /*background-image: linear-gradient(105deg, #FF0000 25.5%, #0000FF 50%);*/
	color: transparent;
	display: inline-block;
	width: max-content;
	background-clip: text;
	padding: 0px 0px 10px;
}

.Mission .position-relative::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 30%;
	width: 130%;
	height: 100%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(240px);
	z-index: -1;
}

.Mission h2,
.Mission p {
	color: #ffffff;
}

.Mission p {
	padding: 20px 0px 40px;
}



/* ======== End of 2.2. Mission section ======== */
/* ======== 2.3. Online section ======== */

.Online {
	margin: 100px 0px;
	background: #150C23;
	border-top: 1px solid;
		border-image-source: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	border-bottom: 1px solid;

	border-image-slice: 1;
}

.Online h6,
.Online h5,
.Online p,
.Online h2 {
	color: #FFFFFF;
}

.Online h2 span {
	background-image: linear-gradient(130deg, #ff0000c4 27.79% 24.79%, #001bffc7 84.37%);
	color: transparent;
	display: inline-block;
	width: max-content;
	background-clip: text;
}

.Online .text-md-start {
	padding: 130px 0px;
}

.Online .text-md-start p {
	padding: 30px 0px 40px;
	width: 85%;
}

.Online figure {
	width: 100%;
	transform: scale(1.1);
	bottom: 5%;
	right: 10%;
	height: 100%;
}

.Online figure::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 70%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(200px);
	z-index: -1;
}

.Online .h-100 {
	gap: 30px;
}

.Online .col-xl-2 .text-center {
	padding: 40px 25px;
	border: 1px solid #711FE3;
	border-radius: 10px;
}

/* ======== End of 2.3. Online section ======== */
/* ======== 2.4. Team section ======== */

.Team {
	padding: 100px 0px;
}

.Team img {
	object-fit: cover;
	border-radius: 10px;
}

.Team .position-absolute {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(102.05deg, rgba(131, 109, 214, 0.7) 40.6%, rgba(255, 163, 123, 0.7) 91.37%);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	opacity: 0;
	transition: opacity 0.3s ease;
	border-radius: 10px;
}

.Team .position-relative:hover .position-absolute {
	opacity: 1;
}

.Team h2,
.Team h4,
.Team p,
.Team .position-absolute .d-flex {
	color: #ffffff;
}

.Team .position-absolute p {
	padding: 20px 0px;
}

.Team .position-absolute .d-flex a {
	color: #ffffff;
	font-size: 16px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: linear-gradient(100deg, #ff0909 1.84%, #4046d4 98.16%);
	box-shadow: 3.98px 3.98px 3.19px 0px #00000040 inset;
}

.Team .position-absolute .d-flex a:hover {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
}

.Team .text-md-start p {
	padding: 30px 0px 50px;
}

.Team .text-md-start {
	position: relative;
}

.Team .text-md-start::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 60%;
	width: 100%;
	height: 100%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(180px);
	z-index: -1;
}

/* ======== End of 2.4. Team section ======== */
/* ======== 3.1. Features section ======== */

.Features h2 {
	color: #FFF;
	padding: 0px 100px 0px 0px;
}

.Features h2 span {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	color: transparent;
	background-clip: text;
}

.Features .position-relative figure::before {
	content: '';
	position: absolute;
	top: 70%;
	left: 50%;
	width: 50%;
	height: 60%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(180px);
	z-index: -2;
}

.Features .position-relative img {
	border-radius: 10px;
}

.Features .position-absolute {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.Features .position-absolute i {
	color: #FFF;
	font-size: 50px;
	width: 120px;
	height: 120px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
	border-radius: 50%;
	animation: pulse 2s infinite;
	transition: 0.3s ease all;
}

@keyframes pulse {
	0% {
		box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.7);
	}

	70% {
		box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);
	}

	100% {
		box-shadow: 0 0 0 25px rgba(255, 255, 255, 0);
	}
}

.Features .modal-dialog {
	max-width: unset;
	width: 80%;
}

.Features .modal-content {
	background-color: transparent;
	backdrop-filter: none;
}

.Features .modal-content button {
	opacity: 1;
	visibility: hidden;
	position: absolute;
	right: 10px;
	top: 0px;
	z-index: 1;
}

.Features .modal-content i {
	color: #FFF;
	visibility: visible;
	font-size: 28px;
	transition: color 0.3s ease;
}

.Features .modal-content button:hover i {
	color: #777777;
}

.Features .modal-body {
	width: 700px;
}

.Features iframe {
	border: none;
	width: 100%;
	border-radius: 18px;
	width: 100%;
	height: 400px;
}

.Features h5 {
	color: #FFF;
}

.Features p {
	color: #FFF;
}

.Features .flex-lg-column {
	gap: 30px;
}

.Features .gap-3 {
	padding: 30px 60px;
	border-radius: 20px;
}

.Features .gap-3 img {
	width: 60px;
}

.Features .gap-3:nth-child(5),
.Features .gap-3:nth-child(6),
.Features .gap-3:nth-child(1) {
	background: linear-gradient(130deg, #ff0000c4 27.79% 24.79%, #001bffc7 84.37%);
}

.Features .gap-3:nth-child(2) {
	background: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%);
}

.Features .gap-3:nth-child(3) {
	background: linear-gradient(100.57deg, #a40606 12.93%, #000cff 112.02%);
}

.Features .gap-3:nth-child(4) {
	background: linear-gradient(160.27deg, #962EFF 9.09%, #2F06B1 151.6%);
}

.Features .gap-3:nth-child(5) {
	background: linear-gradient(130deg, #ff0000c4 27.79% 24.79%, #001bffc7 84.37%);
}

.Features .gap-3:nth-child(6) {
	background: linear-gradient(130deg, #ff0000c4 27.79% 24.79%, #001bffc7 84.37%);
}

/* ======== End of 3.1. Features section ======== */
/* ======== 8.1. BlogDetails_Hero section ======== */

.BlogDetails_Hero {
	position: relative;
}

.BlogDetails_Hero::before {
	content: '';
	position: absolute;
	top: 25%;
	left: 50%;
	width: 50%;
	height: 60%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(180px);
	z-index: -2;
}

.BlogDetails_Hero h2 {
	color: #FFF;
	text-align: center;
}

.BlogDetails_Hero p {
	color: #FFF;
}

.BlogDetails_Hero .position-relative {
	padding: 80px 95px 45px;
}

.BlogDetails_Hero img {
	border-radius: 20px;
}

.BlogDetails_Hero .position-relative::before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
	width: 100%;
	height: 40%;
  background: linear-gradient(124deg, #00009e 10.79% 1.79%, #a52a2ab8 72.37%);
	border-radius: 20px;
    padding: 100px 0px !important;
}

.BlogDetails_Hero iframe {
	height: 550px;
	border-radius: 20px;
}

/* ======== End of 8.1. BlogDetails_Hero section ======== */
/* ======== 8.2. Details section ======== */

.Details p {
	color: #FFF;
}

.Details h4 {
	color: #FFF;
}

.Details .gap-md-5 {
	padding: 0px 95px;
}

.Details img {
	border-radius: 20px;
}

.Details ul {
	list-style: disc inside;
}

.Details li {
	color: #FFF;
}

.Details figure {
	width: 40%;
}

.Details figure::before {
	content: '';
	position: absolute;
	top: 65%;
	left: 20%;
	width: 100%;
	height: 100%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(150px);
	z-index: -1;
}

.Details .py-4 {
	padding-right: 230px;
}

.Details .justify-content-center {
	width: 60%;
}

.Details hr {
	border: 1px solid;
	border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
	margin: 0;
}

/* ======== End of 8.2. Details section ======== */
/* ======== 8.3. Comment section ======== */

.Comment .pt-md-5 {
	padding: 0px 95px;
}

.Comment h6 {
	color: #FFF;
}

.Comment form {
	width: 80%;
}

.Comment textarea,
.Comment input {
	background: linear-gradient(102.05deg, rgba(131, 109, 214, 0.1) 40.6%, rgba(255, 163, 123, 0.1) 91.37%);
	border: none;
	color: #FFF;
	padding: 24px 24px;
}

.Comment textarea:focus {
	outline: none;
}

.Comment button {
	background-color: transparent;
}

/* ======== End of 8.3. Comment section ======== */
/* ======== 9.1. Contact_Details section ======== */

/* ======== Contact Details Section ======== */
.Contact_Details {
  padding: 100px 0;
  position: relative;
  overflow: hidden;
}

.Contact_Details::before {
  content: '';
  position: absolute;
  top: 70%;
  left: 75%;
  width: 50%;
  height: 70%;
  background: #00009e5c;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  filter: blur(210px);
  z-index: -1;
}

/* Headings and Text Colors */
.Contact_Details h2,
.Contact_Details h4,
.Contact_Details p {
  color: #ffffff;
}

.Contact_Details h2 {
  padding-bottom: 50px;
  font-weight: 700;
  text-align: center;
}

/* Each Info Card */
.Contact_Details a {
  width: 32%;
  display: inline-block;
  text-decoration: none;
  color: inherit;
}

.Contact_Details .text-start {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  padding: 25px 20px;
  border-radius: 20px;
  color: #fff;
  height: 100%;
  min-height: 180px; /* ✅ uniform height */
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.Contact_Details .text-start:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 18px rgba(0,0,0,0.25);
}

/* Gradient Backgrounds */
.Contact_Details a:nth-child(odd) .text-start {
  background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%);
}

.Contact_Details a:nth-child(even) .text-start {
  background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%);
}

/* Icons */
.Contact_Details figure {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  padding: 18px;
  margin: 0;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.15);
}

.Contact_Details figure i {
  font-size: 28px;
  color: #ffffff;
}

/* Text Content */
.Contact_Details h4 {
  font-weight: 600;
  font-size: 1.1rem;
  margin-bottom: 6px;
}

.Contact_Details .text-start p {
  padding: 0;
  font-size: 0.95rem;
  line-height: 1.5;
}

/* Responsive Fixes */
@media (max-width: 992px) {
  .Contact_Details a {
    width: 48%;
    margin-bottom: 20px;
  }

  .Contact_Details .text-start {
    min-height: 160px;
    padding: 20px 18px;
  }
}

/* ======== Contact Details Section ======== */
.Contact_Details {
  padding: 100px 0;
  position: relative;
  overflow: hidden;
}

.Contact_Details::before {
  content: '';
  position: absolute;
  top: 70%;
  left: 75%;
  width: 50%;
  height: 70%;
  background: #00009e5c;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  filter: blur(210px);
  z-index: -1;
}

/* Headings */
.Contact_Details h2,
.Contact_Details h4,
.Contact_Details p {
  color: #ffffff;
}

.Contact_Details h2 {
  padding-bottom: 50px;
  font-weight: 700;
  text-align: center;
}

/* Contact Boxes */
.Contact_Details a {
  width: 32%;
  display: inline-block;
  text-decoration: none;
  color: inherit;
  margin-right: 2%;
  vertical-align: top;
}

/* Remove right space from last element in row */
.Contact_Details a:nth-child(3n) {
  margin-right: 0;
}

.Contact_Details .text-start {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  padding: 25px 20px;
  border-radius: 20px;
  color: #fff;
  height: 100%;
  min-height: 180px;
  background-clip: padding-box;
}

/* Gradient Backgrounds */
.Contact_Details a:nth-child(odd) .text-start {
  background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%);
}

.Contact_Details a:nth-child(even) .text-start {
  background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%);
}

/* Icons */
.Contact_Details figure {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  padding: 18px;
  margin: 0;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.15);
}

.Contact_Details figure i {
  font-size: 28px;
  color: #ffffff;
}

/* Text */
.Contact_Details h4 {
  font-weight: 600;
  font-size: 1.1rem;
  margin-bottom: 6px;
}

.Contact_Details .text-start p {
  padding: 0;
  font-size: 0.95rem;
  line-height: 1.5;
}






.contact form {
	width: 80%;
	gap: 40px;
	background: linear-gradient(102.05deg, rgba(131, 109, 214, 0.1) 40.6%, rgba(255, 163, 123, 0.1) 91.37%);
	border-radius: 20px;
	padding: 85px;
}

.contact form .d-flex {
	gap: 40px;
}

.Contact input,
.Contact textarea {
	width: 100%;
	padding: 14px 20px;
	background: linear-gradient(102.05deg, rgba(131, 109, 214, 0.1) 40.6%, rgba(255, 163, 123, 0.1) 91.37%);
	border-radius: 3px;
	border: 1px solid #711FE3;
	color: #FFFFFF;
	font-size: 16px;
	font-weight: 500;
	outline: none;
}

.Contact input[type="number"]::-webkit-outer-spin-button,
.Contact input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.Contact input::placeholder,
.Contact textarea::placeholder {
	color: #FFFFFF;
	font-size: 16px;
	font-weight: 500;
}

.Contact .hover2 {
	background-color: transparent;
	border: 1px solid #711FE3;
	width: fit-content;
	margin-left:25px;
}

.Contact .hover2:hover {
	border: 1px solid transparent;
}

/* ======== End of 9.2. Contact section ======== */
/* ======== 10.1. Error_404 section ======== */

.Error_404 {
	padding: 100px 0px;
}

.Error_404 h2,
.Error_404 p {
	color: #ffffff;
}

.Error_404 h2 span {
	background-image: linear-gradient(130deg, #ff0000c4 27.79% 24.79%, #001bffc7 84.37%);
	color: transparent;
	display: inline-block;
	width: max-content;
	background-clip: text;
}

.Error_404 p {
	padding: 35px 0px 40px;
	width: 67%;
}

.Error_404 .position-relative::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(200px);
	z-index: -1;
}

/* ======== End of 10.1. Error_404 section ======== */
/* ======== 11.1. ComingSoon section ======== */

.ComingSoon {
	padding: 100px 0px;
}

.ComingSoon h1 {
	background-image: linear-gradient(130deg, #ff0000c4 27.79% 24.79%, #001bffc7 84.37%);
	color: transparent;
	display: inline-block;
	background-clip: text;
	width: 95%;
}

.ComingSoon h1 span {
	width: max-content;
}

.ComingSoon p {
	color: #ffffff;
	padding: 20px 0px 60px;
}

.ComingSoon .position-relative::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(210px);
	z-index: -1;
}

/* ======== End of 11.1. ComingSoon section ======== */
/* Mega dropdown wrapper */

.mega-dropdown {
  position: static !important; /* stop Bootstrap from forcing narrow width */
  
}

/* Mega menu container */
.mega-dropdown .mega-menu {
  width: 100% !important;        /* full width under navbar */

  right: 0;
  /* top: 100%; */
  margin-top: 0;
  position: absolute;
  background: #01030E;           /* dark navy background */
  border: none;
  border-radius: 0;
  display: none;
  z-index: 999;
}




/* Show mega menu on hover */
.mega-dropdown:hover .mega-menu {
  display: block;
}

/* Grid spacing */
.mega-menu .row {
  margin: 0;
  
}


.mega-menu .col-lg-3 {
  padding: 20px;
  min-width: 220px;
}

/* Section headings */
.mega-menu h6 {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  padding-bottom: 6px;
}

.col-lg-4.col-md-6 {
  flex: 1;
  min-width: 20px;
}
/* Links */
.mega-menu a {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #ddd;
  font-size: 14px;
  padding: 7px 0px !important;
  text-decoration: none;
}

.mega-menu a:hover {
  color: #FF0000 !important;
}

/* Hide nested menus initially */
#slid-products-drop,
#slid-api-drop,
#slid-company-drop {
  display: none;
  padding-left: 15px;
}



.Mission .row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.image-right {
    flex-direction: row !important;
}

.image-left {
    flex-direction: row-reverse !important;
}


/* Style submenu headers inside sidebar */
#slid-api-drop strong {
  display: block;
  margin-top: 10px;
  font-size: 14px;
  color: #00f; /* blue for section headers */
}


.service-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06);
    transition: all 0.3s ease;
}
.service-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 8px 28px rgba(0,0,0,0.12);
}
.service-card .icon img {
    max-width: 70px;
    height: auto;
}
.service-card h5 {
    font-weight: 600;
    margin-bottom: 10px;
    color: var(--primary-color, #6a1b9a); /* fallback your theme color */
}
.service-card p {
    font-size: 14px;
    color: #555;
}




.Mission .row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}




/* Style submenu headers inside sidebar */
#slid-api-drop strong {
  display: block;
  margin-top: 10px;
  font-size: 14px;
  color: #00f; /* blue for section headers */
}


.service-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06);
    transition: all 0.3s ease;
}
.service-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 8px 28px rgba(0,0,0,0.12);
}
.service-card .icon img {
    max-width: 70px;
    height: auto;
}
.service-card h5 {
    font-weight: 600;
    margin-bottom: 10px;
    color: var(--primary-color, #6a1b9a); /* fallback your theme color */
}
.service-card p {
    font-size: 14px;
    color: #555;
}



.why-payprime {
 
  color: #fff;
  text-align: center;
  padding: 100px 20px;
  position: relative;
  overflow: hidden;
  margin-top:80px;
      border: 1px solid;
    border-left: none;
    border-right: none;
    border-top: none;
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}
 .inner-wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 60px;
    margin: 0 auto;         
}
@media(max-width:767px){
    .inner-wrap{
        flex-direction:column;
        gap:10px;
    }
}


.why-payprime h2 {
  font-size: 2rem;
  margin-bottom: 40px;
  font-weight: 700;
  position: relative;
  z-index: 2;
}

.why-grid {
  display: grid;
 grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  max-width: 1100px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.why-card {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 16px;
  padding: 30px 20px;
  box-shadow: 0 0 15px rgba(0, 200, 255, 0.1);
  transition: all 0.3s ease;
  backdrop-filter: blur(6px);
}

.why-card i {
  font-size: 28px;
  color: #00b4ff;
  margin-bottom: 16px;
}

.why-card h4 {
  font-size: 1rem;
  font-weight: 600;
  color: #fff;
}

.why-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 0 25px rgba(0, 180, 255, 0.25);
  border-color: rgba(0, 180, 255, 0.4);
}
.get-started-payprime {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 50px;
  padding: 80px 8%;

}

/* Get Started Section */
.get-started-payprime {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 60px 80px;
  gap: 40px;

}

.get-started-payprime .left-content {
  flex: 1;
  text-align: center;
}

.get-started-payprime .left-content img {
  width: 100%;
  max-width: 450px;
  height: auto;
  /* No transition here */
}

.get-started-payprime .right-content {
  flex: 1;
}

.get-started-payprime h2 {
  font-weight: 700;
  margin-bottom: 25px;
}
.left-content {
  flex: 1 1 40%;
  text-align: center;
}

.left-content img {
  max-width: 450px;
  
}



.right-content {
  flex: 1 1 50%;
}

.right-content h2 {
 
  font-size: 1.9rem;
  font-weight: 700;
  margin-bottom: 25px;
}
.payprime-soundbox-image .img-soundbox {
    width: 128%; 
    height: auto;
    position: relative;
    bottom: 65px;
}
.accordion {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.accordion-item {
  border: 1px solid #FF0000;
  border-radius: 8px;
  overflow: hidden;
  background: transparent;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.05);
 
}

.accordion-header {
  width: 100%;
      background: linear-gradient(100.57deg, #a40606 12.93%, #000cff 112.02%);
  color: #fff;
 
  font-size: 1rem;
  font-weight: 600;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: none;
  cursor: pointer;
  transition: background 0.3s ease;
}


.accordion-body {
  
  overflow: hidden;
 
  padding: 0 20px;
}

.accordion-item.active .accordion-body {
  max-height: 160px;
  padding-top: 15px;
     padding-bottom: 65px;
    line-height: 1.5;
}

.accordion-item.active .accordion-header i {
  transform: rotate(45deg);
}

.accordion-header i {
  transition: transform 0.3s ease;
  font-size: 1rem;
}
/* ======================
   New Prime Banner Layout
=========================*/

.prime-banner {
    padding: 100px 6%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 50px;
        border: 1px solid;
    border-left: none;
    border-right: none;
    border-top: none;
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}

.prime-left {
    flex: 1 1 48%;
}

.prime-right {
    flex: 1 1 48%;
    display: flex;
    justify-content: center;
}

.prime-tag {
    display: inline-block;
    background: #e8f1ff;
    color: #0050c8;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: 600;
}

.prime-left h1 {
   
    font-size: 2.4rem;
    line-height: 1.3;
      position: relative;
    bottom: 30px;
    font-weight: 700;
}

.prime-left p {
  
    font-size: 1.06rem;
    line-height: 1.6;
    margin-top: 14px;
}

.prime-actions {
    margin-top: 22px;
    display: flex;
    align-items: center;
    gap: 14px;
}

.prime-btn {
    background: #007bff;
    padding: 12px 26px;
    color: #fff;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    transition: 0.3s ease;
}

.prime-btn:hover {
    background: #0059c9;
}

.prime-link {
    color: #007bff;
    font-weight: 600;
    text-decoration: none;
}

.prime-link:hover {
    text-decoration: underline;
}

.prime-note {
    margin-top: 18px;
    color: #5f6c7a;
    font-size: 0.95rem;
}

.prime-image-wrapper img {
    width: 100%;
    max-width: 520px;
    border-radius: 18px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
}



/* ---------- Safexpay-Style Features Grid (NEW) ---------- */
.safexpay-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 4 columns for desktop */
  gap: 24px;
  margin-top: 70px;
}

.safexpay-card {
  
  color: var(--bg); /* Dark text for the content */
  border-radius: 18px; /* Slightly larger border radius */
  padding: 30px;
  text-align: center;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); /* Subtle shadow for depth */
  transition: transform .2s ease;
  min-height: 220px; /* Ensure a consistent height */
}
.safexpay-card:nth-child(1),.safexpay-card:nth-child(3), .safexpay-card:nth-child(5), .safexpay-card:nth-child(7) {
    background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%);
}
.safexpay-card:nth-child(2), .safexpay-card:nth-child(4),.safexpay-card:nth-child(6),  .safexpay-card:nth-child(8) {
      background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%);
}
.safexpay-card:hover {
  transform: translateY(-8px);
}

.safexpay-card .icon {
  width: 60px;
  height: 60px;
  margin: 0 auto 15px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  /* Icon background similar to the image, using a light accent */
 
}

.safexpay-card .icon svg {
  width: 30px;
  height: 30px;
}

.safexpay-card h3 {
  font-size: 1.1rem;
  margin: 0 0 10px 0;
  color: black;
  font-weight: 600;
}

.safexpay-card p {
  font-size: 0.95rem;
  color: white;
  margin: 0;
}
.timeline-section {
  display: flex;
  flex-wrap: wrap; 
  gap: 40px;
  align-items: center;
  justify-content: space-between;
  padding: 72px 10%; 
}

.timeline-left {
  flex: 1;
  min-width: 300px;
  max-width: 50%; /* Control width on larger screens */
}

.timeline-item {
  display: flex;
  align-items: flex-start;
  margin-bottom: 30px; /* Spacing between items */
  position: relative;
}

.timeline-item:last-child {
  margin-bottom: 0;
}

.timeline-icon-container {
  width: 50px;
  height: 50px;
  min-width: 50px; /* Prevent shrinking */
  border-radius: 50%;
  background: rgba(0, 102, 255, 0.1); /* Light blue background for icon */
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 20px;
  position: relative;
  z-index: 2; /* Ensures icon is above the line */
  border: 1px solid var(--accent-2); /* Blue border for the icon */
}

.timeline-icon-container svg {
  width: 28px;
  height: 28px;
  color: var(--accent-1); /* Accent color for the icon */
}

.timeline-content h3 {
  font-size: 1.15rem;
  margin: 0 0 8px 0;
  color: #fff; /* White text for headings */
}

.timeline-content p {
  font-size: 0.95rem;
  color: var(--muted);
  margin: 0;
}








.timeline-right {
  flex: 1;
  min-width: 300px;
  max-width: 40%; /* Control width on larger screens */
  display: flex;
  justify-content: center;
  align-items: center;
}

.timeline-visual {
  width: 100%;
  max-width: 600px; /* Max width for the image */
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6);
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
}

.timeline-visual img {
  display: block;
  width: 100%;
  height: auto;
  vertical-align: middle;
}
.white-labeling-section {
      
      color: #fff;
      padding: 80px 10%;
      font-family: Inter, ui-sans-serif, system-ui;
          border: 1px solid;
    border-left: none;
    border-right: none;
    border-top: none;
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
    }

    /* Section Header */
    .section-intro {
      max-width: 700px;
      margin: 0 auto 60px;
      text-align: center;
    }

    .section-intro h2 {
      font-size: 2.5rem;
      background: white;
      -webkit-background-clip: text;
    
      margin-bottom: 10px;
    }

    .section-intro p {
      color: #d0d0d0;
      font-size: 1.1rem;
      line-height: 1.7;
    }

    /* Common Item Styling */
    .white-labeling-item {
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 50px;
    }

    /* Spacing for alternating sections */
    .white-labeling-item:not(:last-child) {
      margin-bottom: 80px;
    }

    .white-labeling-content {
      flex: 1;
      min-width: 300px;
      max-width: 500px; /* Limit content width */
    }

    .white-labeling-content h3 {
      font-size: 1.8rem;
      color:#0000FF;
      margin-top: 0;
      margin-bottom: 15px;
    }

    .white-labeling-content p {
      color: #ccc;
      line-height: 1.7;
      margin-top: 10px;
      margin-bottom: 10px;
    }

    .white-labeling-content ul {
      margin-top: 20px;
      list-style: none;
      padding: 0;
    }

    .white-labeling-content li {
      color: #fff;
      margin-bottom: 8px;
      font-size: 1rem;
    }

    .white-labeling-content li::before {
      content: '✔';
      color: white;
      font-weight: bold;
      display: inline-block;
      width: 1em;
      margin-left: -1em;
      margin-right: 0.5em;
    }

    

    .white-labeling-image img {
      width: 100%;
      border-radius: 15px;
     
    }

   
    
  
  
    /* Instant PAy*/    
.instant-pay-section {
 
  color: #fff;
  padding: 80px 10%;
      border: 1px solid;
    border-left: none;
    border-right: none;
    border-top: none;
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}

.instant-pay-section .container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  max-width: 1200px;
  margin: 0 auto;
}

.instant-pay-content {
  flex: 1 1 500px;
}

.instant-pay-visual {
  flex: 1 1 500px;
  text-align: right;
}

.instant-pay-section h2 {
  font-size: 2.5rem;
  line-height: 1.3;
  margin-bottom: 20px;
}

.instant-pay-section p {
  font-size: 1rem;
  line-height: 1.6;
  color: #cccccc;
}

.instant-pay-section img {
  width: 100%;
  max-width: 500px;
  border-radius: 10px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.4);
}
.payprime-connected {
 
  padding: 100px 8%;
      border: 1px solid;
    border-left: none;
    border-right: none;
    border-top: none;
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}

.connected-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 60px;
  max-width: 1200px;
  margin: auto;
}

.connected-content {
  flex: 1 1 50%;
}

.connected-content h2 {
  font-size: 2rem;

  font-weight: 700;
  margin-bottom: 20px;
}

.connected-content p {
 
  font-size: 1.05rem;
  line-height: 1.7;
  margin-bottom: 25px;
}

.connected-content ul {
  list-style: none;
  padding: 0;
  margin: 0 0 30px 0;
}

.connected-content ul li {
  font-size: 1rem;
 
  margin-bottom: 10px;
  display: flex;
  align-items: center;
}

.connected-content ul li i {
 
  margin-right: 10px;
}

.connected-image {
  flex: 1 1 45%;
  text-align: center;
}

.connected-image img {
  max-width: 100%;
  border-radius: 20px;
  box-shadow: 0 6px 25px rgba(0, 0, 0, 0.1);
 
}



/* Approval Workflow Section */
.payprime-approval {
 
  padding: 100px 8%;
  text-align: center;
      border: 1px solid;
    border-left: none;
    border-right: none;
    border-top: none;
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}

.approval-header {
  max-width: 800px;
  margin: 0 auto 60px;
}

.approval-header h2 {
  font-size: 2rem;
 
  font-weight: 700;
  margin-bottom: 20px;
}

.approval-header p {
 
  font-size: 1.05rem;
  line-height: 1.7;
}

.approval-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  max-width: 1200px;
  margin: 0 auto;
}

.approval-card {
  background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%);
  border-radius: 16px;
  padding: 35px 25px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);

}

.approval-card:nth-child(1), .approval-card:nth-child(3), .approval-card:nth-child(5) {
    background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%);
}
.approval-card:nth-child(2), .approval-card:nth-child(4), .approval-card:nth-child(6){
    background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%);
}

.approval-card i {
  font-size: 32px;

  margin-bottom: 15px;
}

.approval-card h4 {
  color:white;
  font-size: 1.2rem;
  font-weight: 700;
  margin-bottom: 10px;
}

.approval-card p {

  font-size: 0.95rem;
  line-height: 1.6;
}




.payinout-features {

  padding: 100px 10%;
  text-align: center;
      border: 1px solid;
    border-left: none;
    border-right: none;
    border-top: none;
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}

.payinout-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 40px;
  max-width: 1200px;
  margin: 0 auto;
}

.feature {
 
  border-radius: 16px;
  padding: 40px 25px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
 
}
.feature:nth-child(1), .feature:nth-child(3) {
    background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%);
}
.feature:nth-child(2){
    background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%);
}


.feature .icon {
  width: 70px;
  height: 70px;
  margin: 0 auto 20px;
  border-radius: 50%;
 
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 30px;
}

.feature h3 {
  color: white;
  font-size: 1.3rem;
  font-weight: 700;
  margin-bottom: 15px;
}

.feature p {
 
  font-size: 1rem;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .payinout-features {
    padding: 70px 6%;
  }
}

/* Bulk Payment Section */
.payprime-bulk {
 
  padding: 100px 8%;
      border: 1px solid;
    border-left: none;
    border-right: none;
    border-top: none;
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}

.bulk-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 50px;
  max-width: 1200px;
  margin: auto;
}

.bulk-content {
  flex: 1 1 50%;
}

.bulk-content h2 {
  font-size: 2rem;

  font-weight: 700;
  margin-bottom: 20px;
}

.bulk-content p {
 
  font-size: 1.05rem;
  line-height: 1.7;
  margin-bottom: 25px;
}

.bulk-content ul {
  list-style: none;
  padding: 0;
  margin: 0 0 30px 0;
}

.bulk-content ul li {

  font-size: 1rem;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
}

.bulk-content ul li i {
 
  margin-right: 10px;
}

.bulk-image {
  flex: 1 1 45%;
  text-align: center;
}

.bulk-image img {
  max-width: 100%;
  border-radius: 20px;
  box-shadow: 0 6px 25px rgba(0, 0, 0, 0.1);
}

/* Customer Support Section */
.payprime-support {

  padding: 100px 8%;
      border: 1px solid;
    border-left: none;
    border-right: none;
    border-top: none;
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}
.payprime-hero-simple{
    padding:80px 10% !important;
        border: 1px solid;
    border-left: none;
    border-right: none;
    border-top: none;
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}

.payprime-hero-wrap{
  /*max-width:1300px;*/
  margin:auto;
  padding:0 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:80px;
}

/* LEFT CONTENT */
.payprime-hero-content{
  flex:1;
}

.payprime-hero-content h1{
  font-size:2.8rem;
  font-weight:700;
  line-height:1.2;
  margin-bottom:30px;
}

.payprime-hero-content h1 span{
  color:white;
}

.payprime-hero-content p{
  font-size:1.05rem;
  max-width:520px;
  line-height:1.6;
  margin-bottom:40px;
  opacity:0.9;
}

/* RIGHT IMAGE */
.payprime-hero-image{
  flex:1;
  display:flex;
  justify-content:flex-end;
}

.payprime-hero-image img{
  width:520px;
  max-width:100%;
  border-radius:22px;
}


@media(max-width:900px){
  .payprime-hero-wrap{
    flex-direction:column;
    text-align:center;
  }

  .payprime-hero-image{
    justify-content:center;
  }

  .payprime-hero-content p{
    margin-left:auto;
    margin-right:auto;
  }
}

.support-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 50px;
  max-width: 1200px;
  margin: auto;
}

.support-content {
  flex: 1 1 50%;
}

.support-content h2 {
  font-size: 2rem;

  font-weight: 700;
  margin-bottom: 20px;
}

.support-content p {
 
  font-size: 1.05rem;
  line-height: 1.7;
  margin-bottom: 25px;
}

.support-content ul {
  list-style: none;
  padding: 0;
  margin: 0 0 30px 0;
}

.support-content ul li {
  font-size: 1rem;

  margin-bottom: 12px;
  display: flex;
  align-items: center;
}

.support-content ul li i {

  margin-right: 12px;
  font-size: 1.1rem;
}

.support-image {
  flex: 1 1 45%;
  text-align: center;
}

.support-image img {
  max-width: 100%;
  border-radius: 20px;
  box-shadow: 0 6px 25px rgba(0, 0, 0, 0.1);
 
}




.payinout-hero {

  padding: 100px 10%;
  display: flex;
  align-items: center;
  justify-content: center;
      border: 1px solid;
    border-left: none;
    border-right: none;
    border-top: none;
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}
.pay-in-out-section{
        border: 1px solid;
    border-left: none;
    border-right: none;
    border-top: none;
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}
.hero-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  max-width: 1200px;
  gap: 50px;
}

.hero-content {
  flex: 1 1 50%;
}

.hero-content h1 {
  font-size: 2.6rem;
 
  line-height: 1.3;
  font-weight: 700;
  margin-bottom: 20px;
}



.hero-content p {
  font-size: 1.1rem;

  line-height: 1.7;
  margin-bottom: 30px;
}


      
.btn {
  padding: 12px 26px;
  font-size: 1rem;
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.btn.primary {
  background: linear-gradient(135deg, #007bff, #004aad);
  color: #fff;
}

.btn.primary:hover {
  background: linear-gradient(135deg, #005fd1, #003b8b);
}

.btn.outline {
  border: 2px solid #007bff;
  color: #007bff;
}

.btn.outline:hover {
  background: #007bff;
  color: #fff;
}

.hero-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}

.hero-tags span {
  background: #f3f9ff;
  padding: 8px 14px;
  border-radius: 20px;
  color: #004aad;
  font-size: 0.95rem;
  display: flex;
  align-items: center;
  gap: 8px;
}

.hero-image {
  flex: 1 1 45%;
  text-align: center;
}

.hero-image img {
  max-width: 100%;
  border-radius: 20px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
 
}


.pay-section {
  padding: 80px 8%;
  
}
.pay-section.payout{
        border: 1px solid;
    border-left: none;
    border-right: none;
    border-top: none;
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}
.pay-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 60px;
  flex-wrap: wrap;
}

.pay-container.reverse {
  flex-direction: row-reverse;
}

.pay-content {
  flex: 1 1 50%;
}

.pay-content h2 {
  font-size: 2rem;

  font-weight: 700;
  margin-bottom: 20px;
}

.pay-content p {
  font-size: 1.05rem;
 
  line-height: 1.7;
  margin-bottom: 25px;
}

.pay-content ul {
  list-style: none;
  padding: 0;
  margin: 0 0 30px 0;
}

.pay-content ul li {
  font-size: 1rem;
 
  margin-bottom: 10px;
  display: flex;
  align-items: center;
}

.pay-content ul li i {

  margin-right: 10px;
}

.pay-image {
  flex: 1 1 45%;
  text-align: center;
}

.pay-image img {
  max-width: 100%;
  border-radius: 20px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
 
}

/*payout*/

     :root {
            --color-bg: #01030E;
            --color-text: #E0E7FF;
            --color-accent-red: #FF0000;
            --color-accent-blue: #0000FF;
            --color-shadow-red-strong: rgba(255, 0, 0, 0.6);
            --color-shadow-blue-strong: rgba(0, 0, 255, 0.6);
            --color-shadow-red-subtle: rgba(255, 0, 0, 0.3);
            --color-card-bg: rgba(255, 255, 255, 0.05);
        }

        body {
            background-color: var(--color-bg);
            color: var(--color-text);
            font-family: 'Inter', sans-serif;
            scroll-behavior: smooth;
            line-height: 1.6;
            margin: 0;
            padding: 0;
                overflow-x: hidden !important;
}

.container{
         padding-right: var(--bs-gutter-x, .75rem) !important; 
     /*padding-left: var(--bs-gutter-x, .75rem) !important; */
    margin-right: auto !important; 
    margin-left: auto !important;
}

@media (min-width: 576px) {
    .container { max-width: 540px !important; }
}

@media (min-width: 768px) {
    .container { max-width: 720px !important; }
}

@media (min-width: 992px) {
    .container { max-width: 960px !important; }
}

@media (min-width: 1200px) {
    .container { max-width: 1140px !important; }
}

@media (min-width: 1400px) {
    .container { max-width: 1320px !important; }
}

@media (min-width: 1600px) {
    .container { max-width: 1580px !important; }
}

/* Popup Overlay */
.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    display: none; 
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.popup-box {
    width: 700px;
    background: #fff;
    display: flex;
    border-radius: 12px;
    overflow: hidden;
    animation: fadeIn 0.4s ease;
}

.popup-left {
    width: 55%;
    background: #f5f5f5;
}

.popup-left img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.popup-right {
    width: 50%;
    /*padding: 25px;*/
    position: relative;
}
.close-btn {
    position: absolute;
    right: 12px;
    top: 10px;
    font-size: 15px;
    cursor: pointer;
    font-weight: bold;
    color: black;
}

.popup-right form {
    display: flex;
    flex-direction: column;
    color: #555;
        padding: 13px;
}

.popup-right label {
    margin-top: 10px;
    font-weight: bold;
}

.popup-right input {
    padding: 10px;
    margin-top: 5px;
   
}

.popup-right button {
    margin-top: 20px;
    padding: 12px;
     background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%);
    color: #fff;
    border: none;
    border-radius: 8px;
    cursor: pointer;
}



@keyframes fadeIn {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}

@media(min-width:320px) and (max-width:600px){
    .close-btn{
        position: absolute;
    /* top: 131px; */
    /*right: 70px;*/
    font-size: 15px;
    cursor: pointer;
    font-weight: bold;
    color: black;
    /* float: right; */
    justify-content: revert;
    /* display: flex; */
    top: 8px;
    }
}


        

        section {
            padding: 3.5rem 0;
           
        }

        .hero-title {
              font-weight: 600;
    line-height: 1.1;
    font-size: 30px;
    text-transform: uppercase;
        padding-left: 10px;
    padding-right: 10px;
        }

.wrapp {
    position: relative;
    z-index: 10;
    background: linear-gradient(124deg, #00009e 10.79% 1.79%, #a52a2ab8 72.37%);
    border-radius: 22px;
    padding: 40px 0;
}
main::before {

	content: '';
	position: absolute;
    top: 45%;
    left: 50%;
    width: 30%;
    height: 100%;;
	background: #00009e5c;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	filter: blur(180px);
	z-index: -2;
}


        .section-heading {
           
            font-weight: 800;
            line-height: 1.1;
            font-size: 2.5rem;
        }

        .sub-heading {
            font-size: 1.75rem;
            font-weight: 700;
            color: var(--color-text);
        }

        h4 {
            font-size: 1.25rem;
            font-weight: 600;
            color: white;
        }

      

        .main-header {
          
           
           position: relative;
           top: 30px;
          
            height: 80px;
        }

        .header-content {
            display: flex;
            justify-content: space-between;
            align-items: center;
            height: 100%;
        }

       .logo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 70px;
}

.logo-link img {
    height: 120px;        
    width: auto;         
    object-fit: contain;  
    display: block;
 
}

        .logo-accent {
            color: var(--color-accent-red);
        }

        .nav-desktop {
            display: none;
        }

        .nav-list {
            display: flex;
            list-style: none;
            padding: 0;
            margin: 0;
            gap: 2rem; 
        }

        .nav-link {
            text-decoration: none;
            color: #ccc;
            padding: 0.5rem 0.75rem;
            font-size: 18px;
            font-weight: 500;
            transition: color 0.3s ease, border-bottom 0.3s ease;
            border-bottom: 2px solid transparent;
        }

      

        .nav-toggle {
            display: block;
            border: none;
            background: none;
            color: #ccc;
            cursor: pointer;
            padding: 0.5rem;
        }

        .nav-toggle svg {
            width: 24px;
            height: 24px;
        }

    
        .btnn {
            display: inline-block;
            padding: 1rem 2.5rem;
            border-radius: 50px;
            font-weight: 600;
            text-decoration: none;
            transition: all 0.4s ease;
            text-align: center;
            margin-top: 1rem;
            margin-right: 1rem;
        }

      

        .btnn-secondary {
            background-color: transparent;
            color: var(--color-text);
            border: 2px solid rgba(255, 255, 255, 0.3);
                /*display: block !important;*/
    /*width: fit-content;*/
        /*left: 50%;*/
    /*transform: translateX(-50%);*/
        }

        .btn-secondary:hover {
            border-color: red;
            background-color: var(--color-card-bg);
            transform: translateY(-2px);
        }

    

        .hover3::before {
            content: "";
            display: block;
            width: 100%;
            height: 100%;
            background: linear-gradient(100.57deg, var(--color-accent-red) 12.93%, var(--color-accent-blue) 121.02%);
            position: absolute;
            border-radius: 50px;
            z-index: -1;
            transition: 0.4s ease;
            top: 0px;
            left: 0%;
            transform: translateX(-100%);
        }

        .hover3:hover::before {
            transform: translateX(0%);
        }
  .hover3 {
            display: inline-block;
            position: relative;
            overflow: hidden;
            cursor: pointer;
            transition: 0.5s ease;
            font-weight: 600;
            color: #FFFFFF !important;
            z-index: 1;
            padding: 17px 50px;
            border-radius: 50px;
            border: 2px solid var(--color-accent-red);
            line-height: 27px;
            text-align: center;
            text-decoration: none;
            margin-top: 1rem;
            margin-right: 1rem;
            /*margin-left: 20px;*/
            background:transparent;
        }
        .hover4 {
            display: inline-block;
            position: relative;
            overflow: hidden;
            cursor: pointer;
            transition: 0.5s ease;
            font-weight: 600;
            color: #FFFFFF !important;
            z-index: 1;
            padding: 17px 50px;
            border-radius: 50px;
            border: 2px solid var(--color-accent-red);
            line-height: 27px;
            text-align: center;
            text-decoration: none;
            margin-top: 1rem;
           
            
        }
    
.hero-banner {

  position: relative;
  /*padding: 120px 20px 60px;*/
  color: #fff;
      border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}



.hero-content {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.hero-text {
  flex: 1;
  min-width: 300px;
  padding-right: 20px;
}

.hero-text h1 {
  font-size: 14px;
  text-transform: uppercase;
  margin-bottom: 10px;
  position: relative;
}



.hero-text h2 {
  font-size: 40px;
  font-weight: 800;
  margin-bottom: 20px;
  line-height: 1.2;
}

.hero-text p {
  font-size: 16px;
  margin-bottom: 28px;
  line-height: 1.6;
}


.features-list {
  list-style: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  margin-bottom: 40px;
}

.features-list li {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #fff;
}


.pricing-box {
     background: linear-gradient(124deg, #00009e 10.79% 1.79%, #a52a2ab8 72.37%);
  padding: 26px;
  border-radius: 10px;
  display: inline-flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 40px;
  font-size: 16px;
}

.discounted-price {
  font-size: 32px;
  font-weight: 800;
color: #d81d1d;
}

.original-price {
  text-decoration: line-through;
  color: #888;
  font-size: 16px;
}

.pricing-box p {
  font-size: 14px;
  font-style: italic;
  margin: 0;
}



.hero-media {
  flex: 1;
  min-width: 300px;
  display: flex;
  justify-content: center;
  /*margin-top: 30px;*/
  /*  margin-bottom: 50px;*/
}

.hero-media video {
  border-radius: 1rem;
  max-width: 100%;
}


.hero-media {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.hero-media img {
    width: 90%;
    /*max-height: 450px;     */
    object-fit: contain;
     transform: translateY(-60px);
}


.trusted-logos {
  margin-top: 64px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
}

.trusted-logos img {
  max-width: 120px;
  margin-bottom: 16px;
}
.star{
        /*top: 2px;*/
        font-size:20px;
        position:relative;
}
.pricing-box {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

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

.discounted-price {
  font-weight: bold;
 
}



@media (min-width: 769px) {
  .pricing-box {
    flex-direction: row; 
    align-items: center;
  }
  .price-row {
    margin-right: 15px;
  }
}
@media(max-width:993px){
    .hero-section p{
padding: 15px 35px 0px;
    }
}
@media (max-width: 768px) {
  
   
.hero-banner{
        margin-top:50px !important;
        padding:0;
}
  .hero-text {
    padding-right: 0;
  }
   

}

        .hero-section {
            position: relative;
            text-align: center;
         
            align-items: center;
               border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
              
        }

       

        .hero-section h2 {
            
            margin: 0 auto 1.5rem;
        }

        .hero-section p {
            font-size: 1.25rem;
            color: white;
            max-width: 700px;
            margin: 0 auto 2.5rem;
                    line-height: 1.2;    
        }
        
#featuress{
     padding-top: 120px;  
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}
@media (max-width:767px){
    #featuress{
  margin-top: 50px !important;
  padding:0 !important;
    }
}
#upi-payout{
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}
        .features-row {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 4rem;
             /*padding-right: 30px; */
        }



        .feature-media,
        .feature-details {
            flex: 1;
            width: 100%;
        }

        .feature-media img {
            width: 100%;
        
        }

      
        .feature-block {
            display: flex;
            align-items: flex-start;
            gap: 1.5rem;
            background-color: var(--color-card-bg);
            padding: 1.5rem;
            border-radius: 12px;
            margin-bottom: 1.5rem;
            border-left: 5px solid var(--color-accent-red);
            /*transition: background-color 0.3s ease;*/
        }

        

        .feature-block i {
            font-size: 2rem;
            color: var(--color-accent-red);
        }

        .feature-block p {
            color: rgba(255, 255, 255, 0.6);
            margin-top:0 !important;
            margin-bottom:0 !important;
        }
.features {
    padding: 100px 0 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}

.section-title {
    text-align: center;
    font-size: 36px;
    margin-bottom: 50px;
}
.section-padding{
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}
.feature-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 35px;
}

.feature-card {
    background: var(--color-card-bg);
    padding: 40px 30px;
    border-radius: 15px;
    text-align: center;
    backdrop-filter: blur(6px);
    transition: 0.3s;
    border: 1px solid rgba(255,255,255,0.05);
}



.feature-card i {
    font-size: 35px;
    margin-bottom: 15px;
    color: var(--color-accent-blue);
}
  

.feature-grid .feature-card:nth-child(odd) {
       background: linear-gradient(120deg, #2200ff 40%, #0043ff 100%);
    
}
.feature-grid .feature-card:nth-child(odd) i {
    color: white !important;
}


.feature-grid .feature-card:nth-child(even) {
       background: linear-gradient(120deg, #ff1717 40%, #d81d1d 100%);
  
}
.feature-grid .feature-card:nth-child(even) i {
    color: white !important;
}
@media (max-width: 1215px) and (min-width: 768px) {
    .feature-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }
}
@media (max-width: 767px) {
    .feature-grid {
        grid-template-columns: 1fr;
        gap: 20px; 
       
    }
   
}

        .api-row {
            display: flex;
            flex-direction: column;
            gap: 4rem;
            align-items: center;
                padding-left: 40px;
    padding-right: 40px;
        }



        .api-text-content,
        .api-media {
            flex: 1;
            width: 100%;
        }

        .api-media img {
            width: 100%;
            border-radius: 1rem;
        }


        .api-list {
            list-style: none;
            padding: 0;
            margin: 1.5rem 0 2.5rem;
            font-size: 1.1rem;
        }

        .api-list li {
            position: relative;
            padding-left: 1.5rem;
            margin-bottom: 0.8rem;
            color: rgba(255, 255, 255, 0.75);
        }

        .api-list li::before {
            content: "\f00c";
            font-family: "Font Awesome 6 Free";
            font-weight: 900;
            position: absolute;
            left: 0;
            color: var(--color-accent-red);
        }

        #upi-payout .api-list li::before {
            color: var(--color-accent-blue);
        }

   
   

py-lg-4 p{
    text-align:center;
}

/* Responsive */
@media (max-width: 600px) {
    .popup-box {
        flex-direction: column;
        width: 90%;
    }
    .popup-left, .popup-right {
        width: 100%;
    }
}
 @media (min-width: 768px) {
            .hero-title {
                    font-size: 2.5rem !important;
            }
        }
  @media (min-width: 768px) {
            

            .section-heading {
                font-size: 3.5rem;
            }
          
            .capabilities-grid {
          display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 2rem;
    margin-top: 3rem;
    padding-left: 0px !important;
    padding-right: 40px;
    }
   
        }
    @media (min-width: 768px) {
            .nav-desktop {
                display: block;
            }
            .nav-toggle {
                display: none;
            }
        }

        @media (min-width: 1024px) {
            .features-row {
                flex-direction: row;
                gap: 8rem;
                
                
            }
        }
        
        @media (min-width: 1024px) {
            .api-row {
                flex-direction: row;
                justify-content: space-between;
                gap: 8rem;
            }
         
        }

      @media (max-width:768px) {
              .capabilities-grid {
          display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 2rem;
    margin-top: 3rem;
           padding-left: 10px !important;
        padding-right: 10px !important;
    }
       .hover3{
                margin-left: 0px !important;
            }
          
            .features-row {
              
                padding-right: 0px !important;
            }
    
}

.api-row{
    padding-left: 10px !important;
    padding-right: 10px !important;
}
.section-heading {
    font-weight: 800;
    line-height: 1.1;
    font-size: 2.5rem;
    /*text-align: center;*/
}




      

        @media (min-width: 1024px) {
            #upi-payout .api-row {
                flex-direction: row-reverse;
            }
           
        }


.nav-desktop.active {
    display: block;
}

@media (max-width: 670px) {

    .nav-desktop {
        display: none;
        width: 100%;
        background: #000;     
        padding: 20px 0;
        position: absolute;
        left: 0;
        top: 60px;            
        z-index: 9999;
                margin-top: 15px;
    }

    .nav-desktop.active {
        display: block;
    }

    .nav-list {
        flex-direction: column !important;
        gap: 1.5rem;
        text-align: center;
        margin: 0;
        padding: 0;
        position: static !important;  
                margin-bottom: 18px;
    }

    .nav-list li a {
        color: #fff;
        font-size: 18px;
        display: block;
    }
   
}
@media (max-width:479px){

    .hover3{
        margin-left:  0 !important;
        margin-right: 0 !important;
    }
}


@media (min-width:768px) 
{
    #upi-payin .api-row, .features-row{
    flex-direction: row !important;
    }
    #upi-payout .api-row{
        flex-direction: row-reverse !important;
    }
}



.containeer {
   
    max-width: 1200px;
    margin: 0 auto;
    padding: 22px;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(2, 6, 23, 0.08);
    padding: 3.5rem 0;
    /*border-bottom: 1px solid rgba(255, 255, 255, 0.05);*/
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}



label {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
    margin-top: 20px;
}

input[type="text"],

input[type="date"],
input[type="time"],
select {
    width: 90%;
     padding: 14px 20px;
    background: linear-gradient(102.05deg, rgba(131, 109, 214, 0.1) 40.6%, rgba(255, 163, 123, 0.1) 91.37%);
    border-radius: 3px;
    border: 1px solid #711FE3;
    color: #666;
    font-size: 16px;
    font-weight: 500;
    outline: none;
}
.email-field{
        width: 90%;
     padding: 14px 20px;
    background: linear-gradient(102.05deg, rgba(131, 109, 214, 0.1) 40.6%, rgba(255, 163, 123, 0.1) 91.37%);
    border-radius: 3px;
    border: 1px solid #711FE3;
    color: #666;
    font-size: 16px;
    font-weight: 500;
    outline: none;
}
@media (max-width:767px){
    input[type="text"], input[type="date"], input[type="time"], select {
        padding:5px 20px !important;
}
.email-field{
     padding:5px 20px !important;
}
}
select option {
    background-color: transparent !important;
    color: black !important;
}

.grid {
    display: grid;
    gap: 14px
}

.cols-2 {
    grid-template-columns: repeat(2, 1fr)
}

.checkbox-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  /*gap: 10px;*/
}

@media (max-width: 767px) {
  .checkbox-grid {
    grid-template-columns: repeat(2, 1fr);
    }

}


.small {
    font-size: 13px;
    text-align: center;
    margin-bottom: 50px
}

/* .btn{display:inline-block;padding:10px 16px;border-radius:10px;border:none;cursor:pointer} */
/* .btn-primary{background:#4f46e5;color:#fff} */
/* .btn-secondary{background:#fff;border:1px solid #ddd} */
.msg-success {
    background: #ecfdf5;
    color: #065f46;
    padding: 10px;
    border-radius: 8px;
    margin-bottom: 12px
}

.msg-error {
    background: #fff1f2;
    color: #9f1239;
    padding: 10px;
    border-radius: 8px;
    margin-bottom: 12px
}
input[type="time"]::-webkit-calendar-picker-indicator,input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(40%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(90%) contrast(80%);
}
#applicationForm h1 {
    font-size: 28px;
}
.bttns{
    gap:25px;
    margin-top: 20px;
}


.hover{
   background-color: #0000ff; 
   color: #fff;
    padding: 17px 50px;
    border-radius: 8px;
    line-height: 27px;
    
}
.hoverr{
  background-color: #ff0000; 
  color: #fff;
    padding: 17px 50px;
    border-radius: 8px;
    line-height: 27px;
   
}
#applicationForm .small {
    text-align: center;
    margin-bottom: 20px;
}


.checkbox-grid label {
    display: flex !important;
    align-items: center;
    gap: 10px;
    width: 100%;
       justify-content: flex-start;
}



.cols-3 {
  grid-template-columns: repeat(3, 1fr);
}


.checkbox-grid {
  display: flex;
  /*flex-wrap: wrap;*/

}

@media screen and (max-width: 768px) {
  .cols-3 {
    grid-template-columns: 1fr;
  }
.checkbox-grid{
    display:grid !important;
    
}
.bttns{
    gap:10px;
    /*margin-left:-8px;*/
}
.hover,.hoverr{
        padding: 10px 25px;

}
}
@media (max-width: 768px) {

    #applicationForm {
       
        padding: 18px;
   /*margin-top:80px !important;*/
    box-shadow: 0 3px 10px rgba(0,0,0,0.12);
    border:1px solid #eee;
    margin:10px;
    }
.hero-text h2{
        font-size: 25px;
}
.why-section{
    gap:0  !important;
}
    .grid.cols-2 {
        grid-template-columns: 1fr;  
    }

    #applicationForm h1 {
        font-size: 22px;
        line-height: 30px;
    }
     
    

label{
    font-size: 13px;
}
    

    #volumeTicketSection {
        grid-template-columns: 1fr !important;  
    }

    button[type="submit"], button[type="reset"] {
        width: 100%;
        text-align: center;
    }

    form > div:last-child {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
}

.arrow {
  width: 18px;
  height: 18px;
  cursor: pointer;
  transition: .3s;
  margin-left: auto;
}
.dashboard-section{
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}
.dashboard-tabs {
  width: 50%;      
}

.dashboard-content {
  width: 50%;       
}

.tab {
  margin-bottom: 15px;
  cursor: pointer;

}

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

.tab-icon {
  font-size: 20px;
}

.tab-head h3 {
  margin: 0;
  font-size: 18px;
  flex: 1;
  font-weight:600;
}

.arrow {
  font-size: 20px;
  transition: .3s;
}


.tab-para {
  display: none;
  font-size: 15px;
  margin-top: 5px;
  line-height: 1.8;
      padding: 10px 0;
}
.tab.open .tab-para {
  display: block;
}

.tab.open .arrow {
  transform: rotate(180deg);
}


.tab.active .tab-para {
  display: block;
}
.arrow {
  width: 20px;
  transition: 0.3s;
}

.tab.active .arrow {
  transform: rotate(180deg);
}
.tab.open .tab-para {
  display: block;
}

.tab.open .arrow {
  transform: rotate(180deg);
}

    .dashboard-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 100px;
    }
    .dashboard-tabs {
    min-width: 500px;
    
}
.tab.active {
    border-left: 4px solid #FF0000;
}
.dashboard-content {
    /*min-width: 300px;*/
    flex: 2 1 0%;
    
}
.tab-content.active {
    display: block;
}

.tab-content {
    display: none;
    animation: 0.4s ease 0s 1 normal none running fadeIn;
}
.tab {
    display: block; 
    cursor: pointer;
    margin-bottom: 10px;
    padding: 15px;
    border-left: 4px solid transparent;
    transition: 0.3s;
}

.dashboard-content {

  order:1;
}

.dashboard-content img {
  max-width: 450px;
  width: 80%;
  height: auto;
}
.mobile-image{
    display:none !important;
}



@media (max-width: 767px) {
  
    .dashboard-tabs {
    min-width: 300px;
    
}
.dashboard-tabs {
    width: 100%;
}
.dashboard-content, .dashboard-content img 
{
    display:none;
    
}
.arrow {
    height: 10px;
    width: 10px;
}
.tab-head h3 {
    font-size:15px;
}
.tab-para{
    font-size:12px;
}

.mobile-image{
    display:block !important;
}
}
@media screen and (max-width: 480px) {
    .text-lg{
        margin-bottom:0px;
    }
}
@media screen and (min-width: 768px) {
.dashboard-tabs {
    min-width: 390px;
}
}
.mobile-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 32px;
}

.pg-price-col {
  flex: 1 1 55%;
}

.pg-price-box-col {
  flex: 1 1 40%;
  display: flex;
  justify-content: center;
}





.small-title {
  font-size: 14px;
  color: var(--color-accent-blue);
  font-weight: 700;
  position: relative;

  margin-bottom: 14px;
}

.pg-price-box {
  background: transparent;                
  padding: 28px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 0 25px rgba(0, 255, 200, 0.08);
  transition: all 0.35s ease;

}

.pg-price-box:hover {
  transform: translateY(-6px);
  border-color:var(--color-accent-blue);
  box-shadow: 0 0 35px rgba(0,255,200,0.25);
}

.pg-price-box p.font-semibold {
  font-size: 20px;
  color: var(--color-accent-blue);
  margin-bottom: 8px;
}

.pg-price-box p.text-sm {
  color: #d1d5db; 
  font-size: 15px;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .pg-price-box {
    padding: 22px;
  }

  
}






.check-list-round li p {
  font-size: 16px;
 
}

.check-list-round li span {
  color: #fff;
  font-weight: bold;
}


li{
    list-style: none;
}
.check-list-round li {
  display: flex;
  align-items: center;  
  gap: 10px;            
}

.check-list-round li span {
  flex-shrink: 0;      
  display: flex;
  justify-content: center;
  align-items: center;
}


@media (max-width: 768px) {
  .pg-price-col, .pg-price-box-col {
    flex: 1 1 100%;
  }
  .check-list-round {
    margin-top: 24px;
    padding-left: 0;
    margin-bottom:25px;
}


}
.feature-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

.feature-layout-grid {
    display: grid;
    grid-template-columns: 2fr 2fr; 
    gap: 40px;
    align-items: center; 
   
    /*padding: 60px 40px;*/
    border-radius: 12px;
}

.feature-image-column {
    position: relative;
    height: 600px; 
    overflow: hidden;
}

.tab-image-anim {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    transition: opacity 0.5s ease;
}

.tab-image-anim.active {
    opacity: 1;
}

.tab-image-anim img {
    max-width: 100%;
    height: auto;
    display: block;
    border-radius: 8px;
}

.small-title {
    font-size: 14px;
    color: var(--color-accent-blue);
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.main-feature-title {
    font-size: 32px;
    margin-bottom: 30px;
   
}

.feature-tabs-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 30px;
}

.feature-tab-btn {
    background-color: transparent;
    color: white;
    padding: 8px 15px;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    cursor: pointer;
    font-size: 15px;
    font-weight: 500;
    transition: all 0.3s;
    padding: 12px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.feature-tab-btn.active {
    background-color: var(--color-accent-blue); 
    color: white;
    border-color:var(--color-accent-blue);
}

.tab-content-detail {
    display: none;
}

.tab-content-detail.active {
    display: block;
}

.tab-content-detail h3 {
    font-size: 28px;
    color: var(--color-accent-blue);
    margin-top: 0;
    margin-bottom: 15px;
}

.tab-content-detail p {
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 20px;
}

.feature-stats-list {
    margin-bottom: 30px;
}

.stat-item {
    display: flex;
    align-items: flex-start;
    font-size: 15px;
    margin-bottom: 8px;
   
}

.stat-item i {
    color: var(--color-accent-blue); 
    margin-right: 10px;
    font-size: 16px;
    margin-top: 2px;
}

@media (max-width: 768px){
 .feature-layout-grid {
        grid-template-columns: 1fr; 
        /*padding: 40px 20px;*/
        gap: 20px;
    }
}
@media (max-width: 992px) {
    
   

    .feature-image-column {
        order: -1;
   
        margin-bottom: 10px;
    }

    .main-feature-title {
        font-size: 28px;
        margin-bottom: 20px;
    }
    
    .tab-content-detail h3 {
        font-size: 22px;
    }

    .feature-tabs-controls {
        justify-content: left;
        margin-bottom: 20px;
    }
.feature-tab-btn {
    font-size: 11px;
}
    .feature-container {
        padding: 0 10px; 
    }

}

.feature-layout-grid {
    display: flex;
    flex-direction: column; 
    gap: 20px;
}

.feature-image-column {
    width: 100%;
}

.feature-content-column {
    width: 100%;
}

@media (min-width: 768px) {
    .feature-layout-grid {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    .feature-image-column {
        width: 50%;
    
    }

    .feature-content-column {
        width: 50%;
    }
}

.feature-image-column img {
    width: 80%;
    height: auto;
    display: block;
}

@media (max-width: 576px) {
   
    .feature-image-column {
        height: 300px;
        order:1;
    }
    
   
    .tab-image-anim img{
        width:100%;
    }
}       

.tab-content-detail {
    display: block; 
    opacity: 0;
    transform: translateX(20px); 
    transition: opacity 0.4s ease-out, transform 0.4s ease-out; 
    height: 0; 
    overflow: hidden;
    padding-top: 0; 
}

.tab-content-detail.active {
    opacity: 1;
    transform: translateX(0);
    height: auto; 
    padding-top: 15px; }
    




.why-section {
  display: flex;
  padding: 60px 40px;
  gap:40px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
  
}

.left {
  width: 50%;
  position: sticky;
  top: 120px;
  height: fit-content;
}

.right {
  width: 50%;

}

.features-block {
  margin-bottom: 100px; 
}

.feature-heading {
  font-size: 32px;
  font-weight: bold;
  margin-bottom: 20px;
}

.feature-content {
  font-size: 18px;
  opacity: 0.8;
  line-height: 28px;
  /*width: 80%;*/
}

.tag {
  color: #0000FF;
  font-size: 14px;
  letter-spacing: 1px;
  font-weight: bold;
}

.title {
  margin: 20px 0 40px;
  font-size: 40px;
  font-weight: 800;
      line-height: 1.4;
}


@media(max-width: 767px) {

  .why-section {
    flex-direction: column;
    padding: 0 !important;
    margin-top:50px;
  }

  .left {
    width: 100%;
    position: relative;
    top: 0;
    margin-bottom: 25px;
    text-align: left;
  }

  .tag {
    font-size: 13px;
    margin-bottom: 6px;
  }

  .title {
    font-size: 24px;
    line-height: 32px;
    margin: 10px 0 20px;
  }

  .payment-image img{
      display:none !important;
  }
#payment-options{
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}
  .right {
    width: 100%;
    margin-top: 10px;
  }

  .features-block {
    margin-bottom: 40px; 
  }

  .feature-heading {
    font-size: 20px;
    margin-bottom: 8px;
  }

  .feature-content {
    font-size: 15px;
    line-height: 24px;
    width: 100%;
  }
}

 

    .small-title {
      font-weight: bold;
      margin-bottom: 8px;
    }

    .section-title {
      font-size: 28px;
      margin-bottom: 32px;
    }


    .tabbs {
      display: flex;
      gap: 20px;
      margin-bottom: 40px;
      cursor: pointer;
    }

    .tabb {
      padding: 10px 20px;
      border-radius: 6px;
    }

    .tabb.active {
      background: #0000FF;
      color: #fff;
    }

    .tabb-contents .tabb-content {
      display: none;
    }

    .tabb-contents .tabb-content.active {
      display: block;
    }

    .tabb-panel {
      display: flex;
      flex-wrap: wrap;
      gap: 30px;
    }

    .tabb-image,
    .tabb-text {
      flex: 1 1 45%;
    }
.tabb-image img{
       width: 65%;
}
    .tabb-text h3 {
      font-size: 24px;
      margin-bottom: 12px;
    }

    .tabb-text ul {
      margin: 12px 0;
      padding-left: 20px;
    }


    .mobile-accordion {
      display: none;
    }

    @media screen and (max-width: 767px) {
.hover3{
       padding: 6px 25px;
       margin-top:0 !important;
}
.hover4{
        padding: 6px 25px;
          margin-right:0 !important;
        margin-top:5px !important;
    
}
.checkbox-grid{
    gap:0 !important;
}
label{
    margin-top:7px !important;
}
      .tabbs,
      .tabb-contents {
        display: none !important;
      }

      .accordion-contentb {
        display: flex !important;
        flex-direction: column;
      }
.section-title{
    text-align:left;
}
      .accordion-contentb img {
        order: 1;
      }

      .mobile-accordion {
        display: block;
        padding: 10px;
      }

      .accordion-itemb {
        border-bottom: 1px solid #0000FF;
        margin-bottom: 16px;
        padding: 10px 0;
      }

      .accordion-headerb {
        font-size: 20px;


        cursor: pointer;
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-radius: 6px;
      }

      .accordion-headerb:hover {
        background: blue;
        padding: 20px;
      }



      .accordion-contentb {
        display: none;
        padding: 12px 0 0 0;
      }

      .accordion-contentb img {
        max-width: 100%;
        margin-bottom: 12px;
        border-radius: 6px;
      }

      .accordion-contentb ul {
        padding-left: 0px;
        margin: 10px 0;
      }
.accordion-contentb ul li{
    line-height:2 !important;
}
      .accordion-contentb p {
        margin-bottom: 10px;
      }

      .accordion-headerb .arrow {
        transition: transform 0.3s ease;
        transform-origin: center;
      }

      .accordion-contentb {
        display: none;
        flex-direction: column;
        transition: max-height 0.3s ease, padding 0.3s ease;
        overflow: hidden;
        max-height: 0;
      }

      .accordion-contentb.active {
        display: flex;
        max-height: 1000px;
        padding-top: 12px;
         display: block;
      }
    }

.social-icons {
    flex-wrap: wrap;
}

.icon-figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 60px;
    margin: 0;
}

.icon-figure img {
   width: 100%;
    /*max-width: 40px;*/
}

.icon-figure img:hover {
    transform: scale(1.1); 
}
 
@media(max-width:768px){
   
    .gap-4{
        gap:0 !important;
    }
    .icon-figure img.linkdin {
        width: 60% !important;
    }
    .icon-figure img {

    max-width: 45px;
}
}

.features-row {
  display: flex;
  align-items: center;
  /*gap: 20px;*/
}

@media (max-width: 767px) {
  .features-row {
    flex-direction: column-reverse;  
    text-align: center;     
  }

  .feature-media img {
    max-width: 100%;         
    height: auto;
  }

  .feature-details {
    margin-top: 15px;
  }
  .feature-block{
      gap:0 !important;
  }
}

.hero {

    text-align: left;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}
.hero-grid-original {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 50px;
    max-width: 1200px;
    margin: 0 auto;
}

.hero-content {

    flex: 1 1 50%; 
 
    margin: 0;
}

.hero-content h1 {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 20px;
 
    line-height: 1.2;
}

.hero-content p {
    font-size: 1.2rem;
    line-height: 1.7;
    margin-bottom: 35px;
    opacity: 0.9;
}

.hero-content-visual {
    flex: 1; 
    display: flex;
    justify-content: flex-end; 
}

.hero-image {
    max-width: 100%;
    height: auto;

}
@media(min-width:1440px){
    .hero-image{
        max-width:85%;
    }
}
@media (max-width: 768px) {
    .hero-grid-original {
        flex-direction: column; 
        align-items: center;
      
    }
    .hero{
      
                margin-top: 50px !important;
        padding: 0;
    }
.hero-content-text h2{
      
        font-size: 25px !important;
    }

   

    .hero-content h1 {
        font-size: 2.2rem;
    }


    .hero-content-text p {
        font-size: 1rem !important;
    }

    .hero-content-visual {
        justify-content: center;
    }
}
.feature-card h3 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 10px; 
    color: white;
}
.how-it-works-grid {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    flex-wrap: wrap;
}

.how-it-works-image {
    flex: 1 1 400px;
}

.how-it-works-image img {
    width: 100%;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.how-it-works-content {
    flex: 1 1 400px;
}

.section-title {
    font-size: 2rem;
    margin-bottom: 20px;
}

.steps-container {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.step-box {
      display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    background-color: var(--color-card-bg);
    padding: 1.5rem;
    border-radius: 12px;
    margin-bottom: 1.5rem;
    border-left: 5px solid var(--color-accent-red);
}

.step-icon {
    font-size: 2rem;
}

.step-text .step-title {
    margin: 0 0 5px 0;
    font-size: 1.2rem;
    font-weight: 600;
}

.step-text p {
    margin: 0;
    color: #555;
}

.business-features {
     border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
    padding: 60px 20px;
    color: #fff;
    text-align: center;
}

.business-features .container {
   
    margin: auto;
}

.business-features .section-title {
    font-size: 2.5rem;
    margin-bottom: 40px;
}

.features-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    justify-content: space-between;
}


.feature-card {

    border-radius: 12px;
    padding: 20px;
    flex: 1 1 250px;
    max-width: 400px;

    transition: transform 0.3s, background 0.3s;
}

.feature-card img {
 
    height: 200px;
    border-radius: 8px;
    margin-bottom: 15px;
}

.feature-card:hover {
    transform: translateY(-10px);
    background: rgba(255, 255, 255, 0.2);
}

.feature-card h3 {
    margin-bottom: 10px;
    font-size: 1.3rem;
}

.feature-card p {
    font-size: 0.95rem;
    line-height: 1.5;
}
.services-mix-card {
   
    border-radius: 15px;
    padding: 0 0 30px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
    text-align: center;
    position: relative;
    overflow: hidden;
}
.services-mix-icon {
    width: 55px;
    height: 55px;
    background: #8e007e;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 205px;
    color: #fff;
    font-size: 20px;
    border: 4px solid white;
}
/* CTA Section Styles */
.cta-section {

  text-align: center;
  padding: 80px 20px;
     border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    border-image: linear-gradient(102.05deg, #FF0000 40.6%, #0000FF 91.37%) 1;
}

.cta-container h2 {
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 20px;
}



.cta-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
   
    margin: auto;
    gap: 20px;
}



.cta-container {
    text-align: center;
    color: #fff;
    max-width: 600px;
}

.cta-container h2 {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
}

.cta-container .cta-subtext {
    font-size: 16px;
    margin-bottom: 20px;
    opacity: 0.9;
}



.cta-note {
    margin-top: 15px;
    font-size: 14px;
    opacity: 0.9;
}



.cta-subtext {
  font-size: 1.1rem;
  margin-bottom: 30px;

}



.cta-note {
  margin-top: 20px;
  font-size: 1rem;

}
@media(max-width:768px){
    
.cta-img-left img,
.cta-img-right img {
   display:none;
}
.business-features{
        padding-top: 50px;
    padding-bottom: 50px;
    padding-left:0;
    padding-right:0;
}
}