 :root{
 	--font-xl:55px;
    --font-lg:45px;
    --font-md:35px;
 	--btn-font-size:18px;
 	--base-size:16px;
 	--size-20:20px;
 	--size-25:25px;
 	--size-30:30px;
    --body-font-weight:400;
    --body-line-height: 1.5;
 	--font-aloevera-display:'Aloevera Display';
 	--font-urbanist:'Urbanist';
 	--font-light:300;
 	--font-medium:500;
 	--font-semibold:600;
 	--font-bold:bold;
 	--border-width: 1px;
 	--btn-color:#ddd;
 	--link-color:#15023A;
 	--white:#ffffff;
 	--sky-blue:#B3C1DC80;
 	--secondary-color:#DD3429;
 	--primary-color:#15023A;
 	--border-radius: 0.375rem;
    --border-radius-sm: 0.25rem;
    --border-radius-lg: 0.5rem;
    --border-radius-xl: 1rem;
    --border-radius-xxl: 2rem;
    --border-radius-xxxl: 18px;
 	--breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --breakpoint-xxl: 1400px;
 }
img {
    vertical-align: middle;
    max-width: 100%;
    height: auto;
    width: auto;
}
 

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

@media (prefers-reduced-motion:no-preference) {
    :root {
        scroll-behavior: smooth
    }
}

body {
    margin: 0;
    font-family: var(--font-urbanist);
    font-size: var(--body-font-size);
    font-weight: var(--body-font-weight);
    line-height: var(--body-line-height);
    color: var(--body-color);
    text-align: var(--body-text-align);
    background-color: var(--body-bg);
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
    text-rendering: optimizeLegibility;
}
p{
    font-family: var(--font-urbanist);
}

hr {
    margin: 1rem 0;
    color: inherit;
    border: 0;
    border-top: var(--border-width) solid;
    opacity: .25
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;
    margin-bottom: .5rem;
    line-height: 1.2;
    font-family: var(--font-aloevera-display);
    font-weight: var(--font-bold);
}
p {
    margin-top: 0;
    margin-bottom: 1rem
}
.space-40{
    padding-top: 40px;
    padding-bottom: 40px;
}
.space-80{
    padding-top: 80px;
    padding-bottom: 80px;
}
.p-1{padding: 1rem}
.p-2{padding: 1.5rem}
.p-3{padding: 2rem}
.pt-10{padding-top: 10px}
.pt-1{padding-top: 1rem}
.pb-1{padding-bottom: 1rem}
.pt-3{padding-top: 3rem}
.pt-2{padding-top: 2rem}
.pb-2{padding-bottom: 2rem}
.pb-3{padding-bottom: 3rem}

.pl-1{padding-left: 1rem}
.pl-2{padding-left: 1.5rem}
.pr-1{padding-right: 1rem}
.pr-2{padding-right: 1.5rem}
.medium{font-weight: var(--font-medium);}
.semibold{font-weight: var(--font-semibold);}

.text-20{
	font-size: var(--size-20);
}
.text-25{
	font-size: var(--size-25);
}
.text-30{
	font-size: var(--size-30);
}
.text-30{
    font-size: var(--size-30);
}
.text-45{
    font-size: var(--font-lg);
}
.text-55{
	font-size: var(--font-xl);
}
.dark{color: var(--primary-color);}
.text-center{
	text-align: center;
}
.pull-top{
  margin-top: -60px;
}
.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
    --gutter-x: 1.5rem;
    --gutter-y: 0;
    width: 100%;
    padding-right: calc(var(--gutter-x) * .5);
    padding-left: calc(var(--gutter-x) * .5);
    margin-right: auto;
    margin-left: auto
}

@media (min-width:576px) {

    .container,
    .container-sm {
        max-width: 100%
    }
}

@media (min-width:768px) {

    .container,
    .container-md,
    .container-sm {
        max-width: 100%
    }
}

@media (min-width:992px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm {
        max-width: 100%
    }
}

@media (min-width:1200px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl {
        max-width: 1200px
    }
}
@media (min-width:1300px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1360px
    }
}
@media (min-width:1400px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1360px
    }
}
body{
	background: url(../front-images/gradient-bg-main.webp) no-repeat top center;
	background-size: 100% 100%;    
}
html,body{min-height: 100vh;}
/*Buttons*/
.btn {
	--btn-padding-x: 1.55rem;
	--btn-padding-y: 0.575rem;
	font-family:var(--font-urbanist) ;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.5;
    -border-width: var(--border-width);
    border-color: transparent;
    border-radius: var(--border-radius-xxl);
    display: inline-block;
    padding: var(--btn-padding-y) var(--btn-padding-x);
    color: var(--btn-color);
    text-align: center;
    white-space: nowrap;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    text-transform: capitalize;
    border: var(--btn-border-width) solid var(--btn-border-color);
    background-color: var(--btn-bg);
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out

}

.btn-primary {
    color: #fff;
    background: var(--primary-color);
    border-width:0px;
    border-radius: 40px;
}
.btn-primary:hover{
	background: var(--secondary-color);
	color: var(--white);
}
.btn-white-hover:hover{
    background: var(--white);
    color: var(--primary-color);
}
.btn-secondary {
    color: var(--white);
    background: var(--secondary-color);
    border-width:0px;
    border-radius: 40px;
}
.btn-secondary:hover,.btn-secondary:focus,.btn-secondary:active{
    background: var(--primary-color);
    color: var(--white);
}
.btn-sky{
	background:var(--white);
	color: var(--primary-color);
	border-width:0px;
    border-radius: 40px;
}
.btn-sky:hover,.btn-sky:focus,.btn-sky:active{
    background: var(--secondary-color);
    color: var(--white);
}
.btn-sm{
	line-height: 1;
}
.btn-text {
	position: relative;
	overflow: hidden;
}
	
.text,
.hover-text {
  transition: transform 1.5s cubic-bezier(0.16, 1, 0.3, 1);
  width: 100%;
  display: block;
}

.btn-text .text,
.btn-text .hover-text {
  transform: translateY(0%);
}

.hover-text {
  position: absolute;
  left: 0;
}

.btn-text .hover-text {
  bottom: -200%;
}

.btn:hover .btn-text .hover-text,
.btn:hover .btn-text .text {
  transform: translateY(-200%);
}

.button, .button:visited, .cost a, button, button:visited, input[type="button"], input[type="button"]:visited, input[type="reset"], input[type="reset"]:visited, input[type="submit"], input[type="submit"]:visited {
	background-color: #007aff;
	border: 1px solid #007aff;
	border-radius: 4px;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	font-family: var(--font-urbanist);
	font-size: 1em;
	font-weight: 500;
	line-height: 1.75em;
	margin-top: 0;
	padding: 10px;
	text-align: center;
	text-decoration: none;
	text-shadow: none;
	transition: all .25s ease 0;
	white-space: nowrap;
	-webkit-appearance:button;
}

/*default*/
.flex{display: flex;}
.flex-wrap{flex-wrap: wrap;}
.justify-between{justify-content: space-between;}
.justify-center{justify-content: center;}
.justify-end{justify-content: end;}
.align-center{align-items: center;}
.align-end{align-items: end;}
.unstyled{list-style-type: none;padding: 0;margin: 0}
.gap-10{gap: 10px}
.gap-15{gap: 15px}
.gap-20{gap: 20px}
.gap-30{gap: 30px}
.overlay{position: fixed;}
/*header*/
.site-header,.gradient-rounded{
	background: #15023A;
    background: -webkit-linear-gradient(90deg, rgba(21, 2, 58, 0.2) 0%, rgba(36, 154, 65, 0.2) 25%, rgba(230, 49, 37, 0.2) 50%, rgba(246, 103, 1, 0.2) 75%, rgba(20, 65, 155, 0.2) 100%);
    background: -moz-linear-gradient(90deg, rgba(21, 2, 58, 0.2) 0%, rgba(36, 154, 65, 0.2) 25%, rgba(230, 49, 37, 0.2) 50%, rgba(246, 103, 1, 0.2) 75%, rgba(20, 65, 155, 0.2) 100%);
    background: linear-gradient(90deg, rgba(21, 2, 58, 0.2) 0%, rgba(36, 154, 65, 0.2) 25%, rgba(230, 49, 37, 0.2) 50%, rgba(246, 103, 1, 0.2) 75%, rgba(20, 65, 155, 0.2) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#15023A", endColorstr="#14419B", GradientType=1);
	padding: 1px;
	border-radius: 80px;
}
.gradient-rounded-light{
    background: rgb(255,207,78);
    background: -moz-linear-gradient(90deg, rgba(255,207,78,0.2) 0%, rgba(170,201,252,0.2) 25%, rgba(245,245,245,0.2) 50%, rgba(255,207,78,0.2) 82%, rgba(170,201,252,0.2) 100%);
    background: -webkit-linear-gradient(90deg, rgba(255,207,78,0.2) 0%, rgba(170,201,252,0.2) 25%, rgba(245,245,245,0.2) 50%, rgba(255,207,78,0.2) 82%, rgba(170,201,252,0.2) 100%);
    background: linear-gradient(90deg, rgba(255,207,78,0.2) 0%, rgba(170,201,252,0.2) 25%, rgba(245,245,245,0.2) 50%, rgba(255,207,78,0.2) 82%, rgba(170,201,252,0.2) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffcf4e",endColorstr="#aac9fc",GradientType=1); 
    padding: 1px;
    border-radius: 80px;
}
.rounded-light{
    padding: 1px;
    border-radius: 80px;
}
.site-header-in {
	background-color: #fffaf9;
	border-radius: 80px;
	padding: 10px 14px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
}
.navbar {
	background: 0 0;
	position: sticky;
	right: 0;
	top: 20px;
	z-index: 99;
	border-bottom: none !important;
	padding-bottom: 4px;
	left: 0;
	margin-top: 20px;
}
.navbar-brand {
	display: inline-block;
}
.navbar-header img{
	max-width: 124px !important;
}
#navbar .sub-menu-1 {
	margin: 0;
	padding: 0;
}
.site-header .sub-menu-1 li {
	color: var(--link-color);
	padding: 8px 6px 8px;
	font-size: 18px;
	font-weight: 500;
	position: relative;
	cursor: pointer;
	display: inline-block;
	font-family: var(--font-urbanist);
}
.site-header .sub-menu-1 li span{
	cursor: pointer;
}
.site-header .sub-menu-1 li>a{
	font-family: var(--font-urbanist);
	color: var(--link-color);
	text-decoration: none;
	font-size: var(--base-size);
}
.site-header .sub-menu-1 li>span:hover,.site-header .sub-menu-1 li>a:hover{
	color:var(--secondary-color) ;
}
#navbar li .large-menu li a {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 6px 12px;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	border-radius: 8px;
	color: #333;
	text-decoration: none;
	white-space: normal;
}
.m-icon {
	display: flex;
	min-width: 40px;
	min-height: 40px;
	margin-right: 8px;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	border-radius: 100%;
	background-color: #15023a2b;
}
.m-icon img {
	width: 21px;
	height: auto;
}
#navbar li .dropdowm-menu1 li a span {
	font-weight: 300;
	font-size: 14px;
	display: block;
}
#navbar li .fa-angle-down {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-bottom: 2px solid;
	border-right: 2px solid;
	transform: rotate(45deg);
	margin-bottom: 3px;
	margin-left: 4px;
}
#navbar li .fa-angle-down:before{
    display: none;
}
.dropdowm-menu1 {
	display: none;
	position: absolute;
	left: 0;
	top: 0;
	top: 63px;
	background: #fff;
	border-radius: 0 0 4px 4px;
	width: 135px;
	padding: 4px 0;
	box-shadow: 0 20px 20px rgb(0 0 0 / .1);
	-webkit-box-shadow: 0 20px 20px rgb(0 0 0 / .1);
}
#navbar li .large-menu li a:hover {
    background: #e8edff
}

#navbar li .large-menu li:nth-child(odd) a:hover {
    background-color: rgba(211, 0, 0, 0.11)
}
.cont {
    font-weight: 600;
}
@media (min-width: 992px) {
  .site-header-in{
    padding: 10px 14px 10px 25px;
  }
  .navbar-header {
    float: left;
  }
  .navbar-toggle-btn {
    display: none;
    border: 0;
    background: #333 !important;
  }
   #navbar {
    display: block;
    flex: 1;
    padding-left: 60px;
  }
  #navbar .sub-menu-1{
	display: inline-flex;
	gap:25px;
  }
  .site-header .sub-menu-1 li {
	position: static;
	cursor: default;
  }
  #navbar li .dropdowm-menu1 {
	width: auto;
	min-width: 180px;
	padding: 5px 5px;
    border-radius: 16px;
}
  .large-menu{
		display: flex;
		flex-direction: row;
		align-items: stretch;
		-ms-flex-wrap: wrap !important;
		min-width: 410px;
		flex-wrap: wrap !important;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		opacity: 0;
		visibility: hidden;
		z-index: -55;		
	}
	#navbar li.has-dropdown .large-menu.open{
		left: 0%;
	    transform: translateX(0%);
	    -webkit-transform:translateX(0%);
	    opacity: 1;
	    z-index: 55;
	    visibility: visible;
	}
	#navbar li .large-menu li {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		min-width: 200px;
		margin-top: 1px;
		margin-bottom: 1px;
		-webkit-box-align: center;
		-webkit-align-items: center;
		-ms-flex-align: center;
		align-items: center;
		border-radius: 8px;
		color: #333;
		text-decoration: none;
		width: 33.33%;
        padding-bottom: 0;
        padding-top: 0;
	}
	.drop-menu{display: none;}


}

.row-flex {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px
}
.row-flex .col-lg,
.row-flex .col-lg-1,
.row-flex .col-lg-10,
.row-flex .col-lg-11,
.row-flex .col-lg-12,
.row-flex .col-lg-2,
.row-flex .col-lg-3,
.row-flex .col-lg-4,
.row-flex .col-lg-5,
.row-flex .col-lg-6,
.row-flex .col-lg-7,
.row-flex .col-lg-8,
.row-flex .col-lg-9,
.row-flex .col-md,
.row-flex .col-md-1,
.row-flex .col-md-10,
.row-flex .col-md-11,
.row-flex .col-md-12,
.row-flex .col-md-2,
.row-flex .col-md-3,
.row-flex .col-md-4,
.row-flex .col-md-5,
.row-flex .col-md-6,
.row-flex .col-md-7,
.row-flex .col-md-8,
.row-flex .col-md-9,
.row-flex .col-md-auto,
.row-flex .col-sm,
.row-flex .col-sm-1,
.row-flex .col-sm-10,
.row-flex .col-sm-11,
.row-flex .col-sm-12,
.row-flex .col-sm-2,
.row-flex .col-sm-3,
.row-flex .col-sm-4,
.row-flex .col-sm-5,
.row-flex .col-sm-6,
.row-flex .col-sm-7,
.row-flex .col-sm-8,
.row-flex .col-sm-9{
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px
}


@media (min-width:576px) {
    .row-flex .col-sm {
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%
    }
   .row-flex .col-sm-3 {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%
    }

    .row-flex .col-sm-4 {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%
    }

    .row-flex .col-sm-5 {
        -ms-flex: 0 0 41.666667%;
        flex: 0 0 41.666667%;
        max-width: 41.666667%
    }

    .row-flex .col-sm-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%
    }

    .row-flex .col-sm-7 {
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%
    }

    .row-flex .col-sm-8 {
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667%;
        max-width: 66.666667%
    }

    .row-flex .col-sm-9 {
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%
    }

    .row-flex .col-sm-10 {
        -ms-flex: 0 0 83.333333%;
        flex: 0 0 83.333333%;
        max-width: 83.333333%
    }

    .row-flex .col-sm-11 {
        -ms-flex: 0 0 91.666667%;
        flex: 0 0 91.666667%;
        max-width: 91.666667%
    }

    .row-flex .col-sm-12 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%
    }
}

@media (min-width:768px) {
    .row-flex .col-md {
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%
    }
    .row-flex .col-md-1 {
        -ms-flex: 0 0 8.333333%;
        flex: 0 0 8.333333%;
        max-width: 8.333333%
    }

    .row-flex .col-md-2 {
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%
    }

    .row-flex .col-md-3 {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%
    }

    .row-flex .col-md-4 {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%
    }

    .row-flex .col-md-5 {
        -ms-flex: 0 0 41.666667%;
        flex: 0 0 41.666667%;
        max-width: 41.666667%
    }

    .row-flex .col-md-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%
    }

    .row-flex .col-md-7 {
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%
    }

    .row-flex .col-md-8 {
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667%;
        max-width: 66.666667%
    }

    .row-flex .col-md-9 {
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%
    }
    .row-flex .col-md-10 {
        -ms-flex: 0 0 83.333333%;
        flex: 0 0 83.333333%;
        max-width: 83.333333%
    }
    .row-flex .col-md-11 {
        -ms-flex: 0 0 91.666667%;
        flex: 0 0 91.666667%;
        max-width: 91.666667%
    }
    .row-flex .col-md-12 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%
    }
}

@media (min-width:992px) {
    .row-flex .col-lg {
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%
    }
    .row-flex .col-lg-1 {
        -ms-flex: 0 0 8.333333%;
        flex: 0 0 8.333333%;
        max-width: 8.333333%
    }

    .row-flex .col-lg-2 {
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%
    }

   .row-flex .col-lg-3 {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%
    }

    .row-flex .col-lg-4 {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%
    }

    .row-flex .col-lg-5 {
        -ms-flex: 0 0 41.666667%;
        flex: 0 0 41.666667%;
        max-width: 41.666667%
    }

    .row-flex .col-lg-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%
    }

    .row-flex .col-lg-7 {
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%
    }

    .row-flex .col-lg-8 {
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667%;
        max-width: 66.666667%
    }

    .row-flex .col-lg-9 {
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%
    }

    .row-flex .col-lg-10 {
        -ms-flex: 0 0 83.333333%;
        flex: 0 0 83.333333%;
        max-width: 83.333333%
    }

    .row-flex .col-lg-11 {
        -ms-flex: 0 0 91.666667%;
        flex: 0 0 91.666667%;
        max-width: 91.666667%
    }

    .row-flex .col-lg-12 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%
    }
}

.overflow-hidden{
    overflow: hidden;
}
.white{
    color: var(--white);
}
.white-bg{
	background: var(--white);
}
.white-bg-50{
	background: rgba(255, 255, 255, 0.5);
}
.sky-bg{
	background: var(--sky-blue);
}
.sky-bg-light{
    background:var(--white);
}
.sky-bg-light-25{
    background: var(--white);
}
.radius-18{border-radius: var(--border-radius-xxxl);}
.radius-10{border-radius: var(--border-radius-lg);}

.tabs-container-outer{
    background: url(../front-images/dashboard-bg.webp) no-repeat;
    background-size: 100% 100%;
/*    margin-bottom: 35px;*/
    padding: 50px 40px;
}
.tabs-container-inner {
    background: #fff;
    border-radius: 26px;
    overflow: hidden;
}
.tabs-container {
  display: flex;
  flex-direction: row;
  max-width: 100%;
  margin: auto;
  gap: 0px;
  background: #fff;
}    

.banner-tabs {
  display: flex;
  flex-direction: column;
  min-width: 118px;
  flex: 0 0 118px;
  background: #1A0C38;
  border-right: 2px solid #ff5a34;
}

.tab-button {
    background: transparent;
    color: white;
    border: none;
    padding:8px 10px;
    cursor: pointer;
    font-weight: 500;
    transition: background 0.3s;
    text-align: center;
    font-size: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    position: relative;
}
.tab-button-action:not(.active):before {
    animation: pulse-border 1500ms ease-out infinite;
    content: "";
    position: absolute;
    right: -16px;
    top: 45%;
    transform: translateY(-50%);
    display: block;
    width: 18px;
    height: 18px;
    background: #ff5a34;
    border-radius: 50%;
    z-index: 1;
}
@keyframes pulse-border {
    0% {
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
        opacity: 1
    }

    100% {
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
        opacity: 0
    }
}
.tab-button.active {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
}

.banner-tab-contents {
  flex: 1;
}

.banner-tab-content {
    background: rgba(255, 255, 255, 0.05);
    padding: 0px;
    border-radius: 20px;
    text-align: left;
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: opacity 0.5s ease, max-height 0.5s ease;
    position: relative;
}
.banner-tab-content.active {
    opacity: 1;
    transition: all 1.5s;
    max-height: inherit;
    overflow: visible;
}

.popup-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    display: none;
    /* align-items: center; */
    justify-content: center;
    z-index: 3;
    overflow-y: auto;
    padding: 0;
    right: 0;
}

.popup {
  background: #fff; 
  max-width: 100%;
  width: 100%;
  text-align: center;
  position: relative;
}

.close-popup {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: #000;
    height: auto;
    padding: 0;
    line-height: 1;
    font-size: 40px;
}

.popup-header {
    position: absolute;
    display: flex;
    left: 0;
    right: 0;
    align-items: center;
    padding:0 25px;
    gap:15px;
    top: 5px;
    z-index: 2;
}
.popup-header h3{
    font-weight: 600;
    padding-top: 5px;
    margin-bottom: 0;
    padding-bottom: 0;
}
.tab-button img {
    height: 30px;
}

@supports ((-webkit-clip-path:inset(0% var(--clipPath,0%) 0% var(--clipPath,0%) round 60px)) or (clip-path:inset(0% var(--clipPath,0%) 0% var(--clipPath,0%) round 60px))) {
  .homepageGridSection {
    border-radius:0;
    -webkit-clip-path:inset(0 var(--clipPath,0) 0 var(--clipPath,0) round 60px);
    clip-path: inset(0 var(--clipPath,0) 0 var(--clipPath,0) round 60px);
  }
}
.homepageGridSection{
    will-change: clip-path,var(--clipPath);
}
    
.grid-5 {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 30px;
      margin-bottom: 40px;
      padding-left: 25px;
      padding-right: 25px;
    }
.grid-5 .column-grid:nth-child(2),
.grid-5 .column-grid:nth-child(4){
        background: rgba(255, 255, 255, 0.07);
    }
    .column-grid {
      padding: 20px;
      border-radius: 20px;
      text-align: left;
      position: relative;
      z-index: 1;
    }

    .column-grid h3 {
      font-size: 23px;
      display: flex;
      align-items: center;
      margin-bottom: 20px;
      justify-content: center;
      font-family: var(--font-urbanist);
      font-weight: var(--font-semibold);
    }
   .column-grid .rounded-light{
        margin: 10px 0;
    }
    .column-grid .feature {
        background: rgba(255,255,255,0.1);
        border-radius: 30px;
        padding: 10px 20px;        
        font-size: 16px;
        text-align: center;
        line-height: 1;
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: center;
        --glow-color: rgba(0, 0, 0, 0);
        position: relative;
        transition: opacity .4s ease;
        -webkit-user-select: none;
        user-select: none;
    }
    
    
    .feature:has(span){
        cursor: pointer;
        position: relative;
    }
    .feature span {
        -webkit-user-select: none;
        user-select: none;
       filter: drop-shadow(0 0 .8rem color-mix(in srgb,var(--glow-color) 40%,transparent));
    }
   .feature:has(span)::before {
        content: "";
        position: absolute;
        top: 9%;
        left: 10%;
        right: 10%;
        bottom: 10%;
        background: linear-gradient(90deg,rgba(21, 2, 58, 0.4) 0%, rgba(36, 154, 65, 0.4) 25%, rgb(230, 49, 37) 50%, rgba(246, 103, 1, 0.4) 75%, rgba(20, 65, 155, 0.4) 100%);
        filter: blur(18px);
        z-index: -1;
        opacity: 0;
        transition: opacity 3s ease;
        will-change: opacity;
    }
    .feature:has(span):hover:before {
        opacity:1;
        transition:opacity .2s ease
    }


.trusted-brand{
    margin-bottom: 15px;
    position: relative;
}
.trusted-brand a {
    background: #fef9f6;
    border-radius: 90px;
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 12px 20px;
    text-decoration: none;
}
.trusted-brand a::before {
    content: '';
    position: absolute;
    inset: 14px;
    background: linear-gradient(45deg, #FFCF4E, #FFCF4E, #AAC9FC);
    filter: blur(16px);
    z-index: -1;
    opacity: 0.8;
    border-radius: 8px;
    opacity: 0;
    transition: opacity 2s ease;
    will-change: opacity;
    left: 12%;
    right: 15%;
}
.trusted-brand a:hover{
    background: #fff;
    transition:opacity 2s ease;
    text-decoration: none;
}
.trusted-brand a:hover:before {
    opacity:1;
}
.trusted-brand a .text-20{
    margin-bottom: 0;
    font-weight: 600;
    padding: 0;
}

.clients-testimonials .slide{
    width: 364px;
    position: relative;
}

.clients-testimonials .slick-track{
    display: flex;
    padding-bottom: 40px;
}
.client-testimonial{
    background: #FFFFFF;
    border-radius: 16px;
    position: relative;
}
.client-testimonial{
    margin: 15px 8px;
}
.testimonials-content,.testimonials-footer{
    padding: 24px;
}
.testimonials-content p{
    font-size: 16px;
    line-height: 1.5;
}
.testimonials-footer{
    display: flex;
    gap: 15px;
    align-items: center;
    border-top: 1px solid #AAC9FC;
}
.testimonials-footer .author{
    font-size: var(--size-25);
    color: var(--primary-color);
    font-weight: var(--font-semibold);
}
 .space-app{
    padding: 30px 25px 0 25px;
}
@media (min-width:768px){
    .space-app{
        padding: 70px 35px 0 45px;
    }
    /*.clients-testimonials::before {
        content: '';
        background: #ffffff;
        background: linear-gradient(90deg, rgba(255, 255, 255, 0.06) 0%, rgb(255, 255, 255) 100%);
        position: absolute;
        right: 0;
        height: 100%;
        top: 10px;
        width: 200px;
        z-index: 4;
        max-height: 340px;
    }*/
}
.poster-wrap-outer{
  max-height: 440px;
  overflow:hidden;
  margin-bottom: 40px;
  position: relative;
}
.poster-wrap-outer>img{width: 100%}
.play-video-btn{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
}

/*Brands*/
.slider-brands .slide{
    margin-right: 26px;
    height: auto;
}
.slide-in {
    max-width: 209px;
    height: 62px;
    min-width: 209px;
    background: #FFF;
    border-radius: 90px;
    /* display: block; */
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
}
.home-brand .slick-slide{
    margin-right: 15px;
}
.slide-in img{
    max-height: 46px;
}

/*Integrations*/
.integration-space{
    padding-top: 80px;
    padding-bottom: 20px;
}
@media (min-width: 840px) {
.frameworks-section .frameworks-container {
    /* -webkit-mask-image: linear-gradient(90deg,transparent 0%,#ffffff 300px,#ffffff calc(100vw - 300px),transparent 100%); */
    mask-image: linear-gradient(90deg,transparent 0%,#ffffff 300px,#ffffff calc(100vw - 300px),transparent 100%);
}
}
.frameworks-section .frameworks-container{
    width: 100%;
    position: relative;
    margin-top: -60px;
    overflow: hidden;
}
.frameworks-section .frameworks-container:after {
  content:"";
  display:block;
  width:100%;
  height:150px;
  background:linear-gradient(360deg,rgba(21, 2, 58, 1) 0%, rgba(230, 49, 37, 0.07) 100%);
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  z-index:2;
  pointer-events:none
}
/*.frameworks-section .frameworks-container::before {
    content: "";
    display: block;
    width: 100%;
    height: 130px;
    background:linear-gradient(0deg,#17171700,#110030,#110030);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 2;
    pointer-events: none;
}*/
.frameworks-section .framework-row {
  display:grid;
  grid-auto-columns:119px;
  grid-gap:20px;
  justify-content:center;
  margin-bottom:20px;
  position:relative;
  white-space:nowrap;
  grid-auto-flow:column
}
.frameworks-section .framework-row:nth-child(2n) {
  --row-offset: 36px
}
.frameworks-section .framework-row:nth-child(odd) {
  --row-offset: 12px
}
@media (min-width: 1080px) {
  .frameworks-section .framework-row:nth-child(2n) {
    --row-offset: 24px
  }
  .frameworks-section .framework-row:nth-child(odd) {
    --row-offset: 28px;
  }
}
.framework-card{
    width: 119px;
    height: 119px;
    border-radius: 12px;
    border: 1px solid rgba(170, 201, 252, 0.13);
    /*background:rgb(17, 5, 40);*/
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 23px;
    --glow-color: rgba(0, 0, 0, 0);
    opacity: 0;
    transition: opacity .2s ease;
    -webkit-user-select: none;
    user-select: none;
}
.framework-card.active{
    opacity: 1;
}
.framework-card:has(img){
    cursor: pointer;
    position: relative;
}
.framework-card img {
    -webkit-user-select: none;
    user-select: none;
/*    filter: drop-shadow(0 0 .8rem color-mix(in srgb,var(--glow-color) 40%,transparent));*/
}
.framework-card:has(img):before {
    content:"";
    position:absolute;
    top:7%;
    left:7%;
    right:7%;
    bottom:7%;
    background-color:var(--glow-color);
    filter:blur(15px);
    z-index:-1;
    opacity:0;
    transition:opacity 2s ease;
    will-change:opacity
}
.framework-card:has(img):hover:before {
    opacity:0.62;
    transition:opacity .2s ease
}
.framework-card:has(img):hover{
    background:rgba(9, 7, 7, 0.39);
}
/*language*/
.country-flags{
	background: var(--white);
	padding: 40px 0;
}
.slider-language .gradient-rounded{
    margin: 0 10px;
}
.slider-language .slide {
      width: 172px;
      padding: 5px 10px;
      background: white;
      margin: 0 0px;
      border-radius: 80px;
      display: flex;
      align-items: center;
      font-size: var(--base-size);
      font-weight: var(--font-semibold);
      white-space: nowrap;
      height: auto;
}
.slider-language .slide img {
	display: block;
	width: 45px;
	height: 45px;
	border-radius: 50%;
	margin-right: 15px;
}
.dark-radial-bg{
    background: #15023A;
    background: -webkit-linear-gradient(180deg, rgba(21, 2, 58, 1) 0%, rgba(230, 49, 37, 1) 100%);
    background: -moz-linear-gradient(180deg, rgba(21, 2, 58, 1) 0%, rgba(230, 49, 37, 1) 100%);
    background: linear-gradient(180deg, rgba(21, 2, 58, 1) 0%, rgba(230, 49, 37, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#15023A", endColorstr="#E63125", GradientType=0);
}
.dark-radial-bg-2{
    background: #15023A;
    background: -webkit-linear-gradient(360deg, rgba(21, 2, 58, 1) 0%, rgba(230, 49, 37, 1) 100%);
    background: -moz-linear-gradient(360deg, rgba(21, 2, 58, 1) 0%, rgba(230, 49, 37, 1) 100%);
    background: linear-gradient(360deg, rgba(21, 2, 58, 1) 0%, rgba(230, 49, 37, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#15023A", endColorstr="#E63125", GradientType=0);
}
/*.sticky-side .dark-radial-bg{
    background: #15023A;
    background: -webkit-linear-gradient(360deg, rgba(21, 2, 58, 1) 0%, rgba(230, 49, 37, 1) 100%);
    background: -moz-linear-gradient(360deg, rgba(21, 2, 58, 1) 0%, rgba(230, 49, 37, 1) 100%);
    background: linear-gradient(360deg, rgba(21, 2, 58, 1) 0%, rgba(230, 49, 37, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#15023A", endColorstr="#E63125", GradientType=0);
}*/

.sticky-side .content-contact>img{max-width: 250px !important;}
.gradient-text {
    color: transparent;
    background: #DD3429;
background: linear-gradient(86deg,rgba(221, 52, 41, 1) 0%, rgba(26, 115, 232, 1) 25%, rgba(251, 188, 4, 1) 51%, rgba(52, 168, 83, 1) 75%, rgba(21, 2, 58, 1) 100%);
    display: inline-block;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}
/*footer*/
#footer{
    background: #15023A;
    background: -webkit-linear-gradient(360deg, rgba(21, 2, 58, 1) 0%, rgba(230, 49, 37, 1) 100%);
    background: -moz-linear-gradient(360deg, rgba(21, 2, 58, 1) 0%, rgba(230, 49, 37, 1) 100%);
    background: linear-gradient(360deg, rgba(21, 2, 58, 1) 0%, rgba(230, 49, 37, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#15023A", endColorstr="#E63125", GradientType=0);
	padding-top: 80px;
}
#footer h4{
	font-size: var(--size-25);
	color: var(--white);
	font-weight: var(--font-semibold);
	font-family: var(--font-aloevera-display);
}
#footer ul{
	padding: 0;
	list-style-type: none;
}
#footer ul li{
	padding-top: 15px;
}
#footer .toggle-body li a{
	color: #fff;
	font-size: 16px;
	font-family: var(--font-urbanist);
	font-weight: normal;
	text-decoration: none;
}
#footer .toggle-body li a:hover{
	text-decoration: underline;
}
.footer-bottom-bar{
	background: #AAC9FC14;
	border-radius: 90px;
	padding: 20px 30px;
	
}

.footer-bottom-bar .image-wrap {
	background: #fff;
	border-radius: 90px;
	max-width: 116px;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	padding: 8px;
}
.footer-bottom-bar .image-wrap img {
	width: auto;
	height: auto;
	max-height: 46px;
}
.footer-bar {
	border-top: 1px solid #AAC9FC33;
	padding-top: 13px;
}
.footer-bar *{
	color: #fff;
}
.footer-bar a:hover{
	text-decoration: underline;
}
@media (min-width:768px){
	.line-middle{position: relative;}
	.line-middle:after{
        content: '';
        top: 25px;
        bottom: 25px;
        width: 1px;
        background: rgba(170, 201, 252, 1);
        position: absolute;
        left:45%;
        transform: translateX(-50%);
        z-index: 1;
    }
	.text-right-desktop{text-align: right;}
}
@media (min-width:992px){
	#clipElement{
      /* clip-path: inset(0 0 0 0 round 60px);
      transition: clip-path 0.3s ease-out;*/     
    }
    .integration-space{
        margin-bottom: 40px;
    }
}

.scroll-hint {
  text-align: center;
  font-size: 18px;
  color: #fff;
  margin-bottom: 10px;
  animation: hintBlink 2s infinite;
  display: block;
}

@keyframes hintBlink {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 1; }
}

@media (min-width: 768px) {
  .scroll-hint {
    display: none;
  }
}