/*bootstrap*/
.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {--bs-gutter-x:1.5rem; --bs-gutter-y:0; width:100%; padding-right:calc(var(--bs-gutter-x) * .5); padding-left:calc(var(--bs-gutter-x) * .5); margin-right:auto; margin-left:auto}

.row {--bs-gutter-x:1.5rem; --bs-gutter-y:0; display:flex; flex-wrap:wrap; margin-top:calc(-1 * var(--bs-gutter-y)); margin-right:calc(-.5 * var(--bs-gutter-x)); margin-left:calc(-.5 * var(--bs-gutter-x))}
.row>* {flex-shrink:0; width:100%; max-width:100%; padding-right:calc(var(--bs-gutter-x) * .5); padding-left:calc(var(--bs-gutter-x) * .5); margin-top:var(--bs-gutter-y)}
.d-none {display:none!important}
.d-flex {display:flex!important}
.flex-column {flex-direction:column!important}
.flex-wrap {flex-wrap:wrap!important}
.justify-content-center {justify-content:center!important}
.justify-content-between {justify-content:space-between!important}
.align-items-center {align-items:center!important}
.align-items-start {align-items:flex-start!important}
.row-gap-3 {row-gap:1rem!important}
.row-gap-4 {row-gap:1.5rem!important}
.column-gap-3 {-moz-column-gap:1rem!important; column-gap:1rem!important}
.text-center {text-align:center!important}
.text-white {color:white !important;}
.text-white-600 {color:var(--white-600) !important;}
.my-0 {margin-top:0!important; margin-bottom:0!important}
.my-3 {margin-top:1rem!important; margin-bottom:1rem!important}
.mt-2 {margin-top:.5rem!important}
.mt-4 {margin-top:1.5rem!important}
.mt-5 {margin-top:3rem!important}
.mb-3 {margin-bottom:1rem!important}
.p-2 {padding:.5rem!important}
.pt-2 {padding-top:.5rem!important}
.pt-5 {padding-top:3rem!important}
.px-4 {padding-right:1.5rem!important; padding-left:1.5rem!important}

@media (min-width:576px) {
.container, .container-sm {max-width:540px}
}

@media (min-width:768px) {
.container, .container-md, .container-sm {max-width:720px}
}

@media (min-width:992px) {
.container, .container-lg, .container-md, .container-sm {max-width:960px}
.col-lg-8 {flex:0 0 auto; width:66.66666667%}
.col-lg-4 {flex:0 0 auto; width:33.33333333%}
.d-lg-inline {display:inline !important;}
.d-lg-flex {display:flex!important}
.d-lg-block {display:block!important}
.d-lg-none {display:none!important}
.mt-lg-0 {margin-top:0!important}
.px-lg-0 {padding-right:0!important; padding-left:0!important}
.flex-lg-row {flex-direction:row!important}
.align-items-lg-center {align-items:center!important}
}

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

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

/*custom*/
html{scroll-behavior:smooth;}
body {background:white;}
.separator {color: unset;margin:0;border-bottom:1.5px solid var(--black-100);opacity:unset;}
* {padding:0; margin:0; box-sizing:border-box;}
img {max-width:100%; height:auto;}
a{color:inherit;text-decoration:none;cursor:pointer;line-height:0px;}
h1, h2, h3, h4, h5, h6 {margin:0; padding:0; color:var(--slat-1000);}
p {margin:0; padding:0; color:var(--slat-500);}
.mt-100 {margin-top:100px;}
.py-100 {padding-top:100px; padding-bottom:100px;}
.py-96 {padding-top:var(--spacing-96); padding-bottom:var(--spacing-96);}
header {width:100%; position:fixed; z-index:9999;}
nav {background:var(--white-100); display:flex; align-items:center; justify-content:space-between; border-radius:var(--border-radius-full); border:var(--border-width-1) solid var(--white-1000); box-shadow:0 -3px 8px 0 rgba(255, 255, 255, 0.50) inset, 0 4px 8px 0 rgba(0, 0, 0, 0.02); backdrop-filter:blur(5.5px); padding:var(--spacing-8);box-shadow: rgba(50, 50, 93, 0.05) 0 -32px 27px -5px, rgba(0, 0, 0, 0.1) 0 8px 16px 5px;}
header nav.active{background:var(--white-600);}
.menus {list-style:none; column-gap:25px;}
.menus li {list-style:none; color:var(--slat-700);}
.primary-btn {color:var(--white-1000); text-shadow:0 0 4px rgba(0, 0, 0, 0.10); display:flex; padding:var(--spacing-10) var(--spacing-16); justify-content:center; align-items:center; gap:var(--spacing-4); border-radius:var(--border-radius-full); border:var(--border-width-1) solid var(--blue-700); background:linear-gradient(180deg, var(--blue-500) 0%, var(--blue-600) 100%); box-shadow:0 3px 8px -3px rgba(255, 255, 255, 0.25) inset, 2px 5px 4px -2px var(--white-200) inset, 0 30px 8px 0 rgba(0, 47, 150, 0.00), 0 19px 8px 0 rgba(0, 47, 150, 0.01), 0 11px 6px 0 rgba(0, 47, 150, 0.05), 0 5px 5px 0 rgba(0, 47, 150, 0.09), 0 1px 3px 0 rgba(0, 47, 150, 0.10); cursor:pointer;}
.primary-btn:hover{
background: linear-gradient(180deg, var(--blue-600, #0C3CC4) 0%, var(--blue-700, #06369E) 100%);
box-shadow: 0 3px 8px -3px rgba(255, 255, 255, 0.25) inset, 2px 5px 4px -2px var(--white-200) inset;}
.primary-btn-large {padding:var(--spacing-12) var(--spacing-24); gap:var(--spacing-6);}
.secondary-btn {display:flex; padding:var(--spacing-12) var(--spacing-24); justify-content:center; align-items:center; gap:var(--spacing-6); border-radius:var(--border-radius-full); border:var(--border-width-1) solid var(--black-200); background:var(--white-1000); color:var(--slat-1000); text-shadow:0 0 4px rgba(0, 0, 0, 0.10); cursor:pointer;}
.secondary-btn:hover{
background: var(--slat-200);}
.hero-sec {width:100%; background:url(../img/BACK.svg); background-position:center 0px; background-repeat:no-repeat; background-size:cover;}
.hero-text h1 {display:flex; padding:8px 12px 8px 32px; justify-content:center; align-items:center; gap:6px; border-radius:120px; border:1px solid var(--black-100); background:var(--white-1000); box-shadow:0 -2px 4px 0 rgba(0, 0, 0, 0.10) inset; display:inline-block; position:relative; color:var(--slat-1000);}
.hero-text h1::before {content:""; position:absolute; background:url(../img/orb.webp); background-repeat:no-repeat; background-position:center; background-size:cover; width:50px; height:50px; top:-8px; left:-8px;}
.hero-heading {color:var(--slat-1000);}
.hero-text p {color:var(--slat-500);}
.dashboard-sec {background:url(../img/wave-bg.webp); background-repeat:no-repeat; background-position:center; background-size:cover;}
.hero-bottom-sec {border-radius:var(--border-radius-2xl); background:var(--slat-1000); position:relative; background:url(../img/hero-bottom-bg.webp); background-position:center; background-repeat:no-repeat; background-size:cover; display:flex; padding:var(--spacing-48) var(--spacing-56);}
.hero-bottom-sec-inner-card p {color:var(--white-700);}
.hero-bottom-sec-inner-border {border:var(--border-width-1) solid var(--white-100); height:80px;}
.w-unset{width:unset!important;margin:unset!important;}


#sidemenu {position: fixed;background: var(--white-600);backdrop-filter: blur(23.5px);width: 100%;height: 100%;overflow-y: auto;overflow-x: hidden;right: 0;top: 0;z-index: 99999;transform: translateX(100%);transition: transform 0.3s ease-in-out;}
#sidemenu.open {transform: translateX(0);box-shadow: 2px 0 12px rgba(0, 0, 0, 0.4);}
#sidemenu nav{border-radius: var(--border-radius-md);}
#sidemenu .menu-card{padding: var(--spacing-10) var(--spacing-12);border-radius: var(--border-radius-md);border: 1px solid var(--white-1000);background: var(--white-900);box-shadow: 0 -3px 8px 0 rgba(255, 255, 255, 0.50) inset, 0 4px 8px 0 rgba(0, 0, 0, 0.02);backdrop-filter: blur(5.5px);height: calc(100vh - 100px);}

/*MODAL*/
.modal {display:none; position:fixed; z-index:99999; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.5); justify-content:center; align-items:center; overflow:hidden; overflow-y:auto;}
.modal-content {background:url(../img/popup-bg.webp); background-repeat:no-repeat; background-position:center; background-size:cover; padding:var(--spacing-32); border-radius:var(--border-radius-sm); width:80%; text-align:center; position:relative;}
.close-btn {cursor:pointer; position:absolute; top:10px; right:10px; font-size:23px; background:white; border-radius:50%; padding:var(--spacing-4) var(--spacing-10); line-height:1; border:0px; outline:none; width:30px; height:30px; display:flex; align-items:center; justify-content:center;}
.modal-content .model-heading {color:var(--gray-100); font-size:78px; line-height:88px;}
.modal-content input, .modal-content textarea {background:white; border:0px; outline:none; border-radius:var(--border-radius-md); padding:var(--spacing-16); width:100%;}

@media (max-width:992px){
html {scroll-padding-top: 40px;}
.anchor-width-100{width:100%}
.py-96 {padding-top:var(--spacing-56); padding-bottom:var(--spacing-56);}
.py-100 {padding-top:50px; padding-bottom:50px;}
.hero-sec {width:100%; background:url(../img/hero-bg-mobile.svg); background-position:center 0px; background-repeat:no-repeat; background-size:cover;}
.hero-bottom-sec{padding-right:var(--spacing-16);padding-left:var(--spacing-16);background:url(../img/hero-bottom-bg-mobile.webp); background-position:center; background-repeat:no-repeat; background-size:cover;}
.hero-bottom-sec-inner-border {border:var(--border-width-1) solid var(--white-100); height:unset;width:100%;}
.modal {align-items:unset;}
.modal-content {height:max-content; width:90%; margin:var(--spacing-20) auto; background:url(../img/hero-bottom-bg-mobile.webp); background-repeat:no-repeat; background-position:center; background-size:cover;}
.modal-content .model-heading {font-size:36px; line-height:42px;}
}

@media (max-width:576px){
.primary-btn, .secondary-btn{width:75%;margin:0 auto;}
}

