:root{
	--purple:#800080;
	--purple-dark:#660166;
	--light-bg:#F5E6F5;
	--section-padding:80px;
	--radius-lg:18px;
	--radius-md:14px;
	--shadow-lg:0 18px 40px rgba(0,0,0,.18);
	--shadow-md:0 10px 25px rgba(0,0,0,.12)
}
p{
	margin-bottom: 0px;
}
body,p,h1,h2,h3,h4,h5,h6,span,input,a,lable{
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	scroll-behavior:smooth;
}
.dark-btn{
	background: var(--purple);
	border-radius: 12px;
	color: #fff;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0.5%;
	padding: 16px 32px!important;
	text-transform: uppercase;
}
.dark-btn:hover{
	background-color: #ffff!important;
	color: var(--purple);
}
.section-label{
	color:var(--purple);
	font-weight:700;
	font-size: 22px;
	letter-spacing:.5%;
	margin-bottom:10px
}
.section-title{
	font-weight:700;
	font-size:32px;
	color: #1A1A1A;
}
.text-18{
	font-size: 18px;
	letter-spacing: 0.5%;
	color: #474747;
	line-height: 26px;
}
.text-16{
	font-size: 16px;
	letter-spacing: 0.5%;
	color: #474747;
	line-height: 26px;
}
.h-24{
	font-size: 24px;
	color: #1A1A1A;
	font-weight: 700;
	letter-spacing: 0.5%;
}
.saak-navbar{
	background:var(--purple);
	padding:18px 0
}
.saak-navbar img{
	max-width: 200px;
}
.saak-navbar .navbar-nav{
	gap: 70px;
}
.saak-navbar .navbar-nav a{
	color: #ffff;
	font-size: 16px;
	letter-spacing: 0.5%;
	font-weight: 500;
}
.saak-navbar .dark-btn{
	border: 1px solid #ffffff;
}

.hero-section{
	padding:220px 0 130px;
	background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),url('data/img/herosection.png');
	background-size: cover;
}
.hero-title{
	font-size:64px;
	font-family: "Figtree", sans-serif;
	line-height:76px;
	letter-spacing: 0.5%;
	font-weight:900!important;
	max-width:560px;
}
.hero-subtitle{
	font-size:24px;
	line-height:37px;
	letter-spacing: 0.5%;
	max-width:500px;
	color: #ffff;
}
.hero-section .dark-btn{
	border: none;
}
.hero-section .left{
	gap: 20px;
}
.hero-btn{
	padding:16px 38px;
	border-radius:44px;
	font-size:16px;
	font-weight:500
}
.ratecard-title{
	background-color: #F5E6F5;
	padding: 32px;
	text-align: center;
	border-radius: 20px;
}
.ratecard-body{
	background: #ffff;
	margin: 0px 38px 0px 38px;
	padding: 40px 40px;
	border-radius: 0px 0px 48px 48px;
	position: relative;
}
.rate-header{
	font-weight:500;
	color:var(--purple);
	margin-bottom:8px;
	font-size:24px;
	letter-spacing:.5%;
	text-transform:uppercase;
}
.rate-value{
	font-weight:600;
	color:var(--purple);
	font-size:32px;
	font-weight:500;
	letter-spacing:.5%;
	color:var(--purple);
}
.rate-card form label{
	font-size: 16px;
	padding: 5px 15px;
	border: 1px solid #B7B7B7;
	border-radius: 8px;
	position: absolute;
	top: -15px;
	z-index: 9;
	background: #fff;
	left: 50px;
	width: 100%;
	max-width:70px;
	color: #1A1A1A;
	text-align: center;
}
.rate-card select{
	border: none;
	background: #fff;
	font-size: 18px;
	position: absolute;
	right: 20px;
	bottom: 15px;
	color: #1A1A1A;
}
.rate-card form input{
	height: 90px;
	border-radius: 20px;
	padding-left: 30px;
	font-size: 18px;
	color: #1A1A1A;
	border:1px solid #B7B7B7;
}
.btn-purple{
	background:var(--purple);
	color:#fff;
	border-radius:44px;
	padding:23px 34px;
	font-size:18px;
	font-weight:500
}
.btn-purple:hover{
	background:var(--purple-dark);
	color:#fff
}
.features-section{
	padding:var(--section-padding) 0
}
.feature-box{
	transition:.3s;
	text-align: center;
	padding: 0px 20px;
}
.feature-box:hover{
	transform:translateY(-6px)
}
.feature-box .icon-circle{
	background:#fff;
	padding:28px;
	border-radius:50%;
	box-shadow: 2px 8px 44px 0px rgba(0, 0, 0, .15);
	width:120px;
	height:120px;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:50%;
	font-size:40px;
	margin:0px auto 20px auto;
}
.feature-box .icon-circle svg{
	fill:var(--purple);
}
.feature-box:hover  .icon-circle{
	background:var(--purple);
}
.feature-box:hover .icon-circle svg{
	fill: #fff;
}
.features-section .feature-box h6{

}
.about-section img{
	position: absolute;
	left: 0;
	top: 0;
	width: 45%;
	height: 800px;
	object-fit: cover;
	object-position: center;
}
.about-section .text-18{
	max-width: 700px;
	margin-top: 20px;
	margin-bottom: 40px;
	line-height: 33px;
}
.about-section .left{
	height: 800px;
}
.about-section .stat-box{
	display: flex;
	align-items: center;
	font-family: "Figtree", sans-serif;
	gap: 10px;
	margin-bottom: 40px;
}
.about-section .stat-box strong{
	font-size: 54px;
	line-height: 33px;
	letter-spacing: 0.5%;
	font-weight: 700;
}
.about-section .stat-box span{
	font-family: "Figtree", sans-serif;
	font-size: 20px;
	font-weight: 700;
	line-height: 22px;

}
.transfer-section{
	padding:var(--section-padding) 0;
	background: var(--light-bg);
	margin-top: 80px;
}
.transfer-card{
	background:#fff;
	padding:34px;
	border-radius:var(--radius-md);
	box-shadow:var(--shadow-md);
	transition:.3s;
	height:100%;
	display: flex;
	align-items: center;
	gap: 15px;
	border: 1px solid var(--purple);
} 
.transfer-card .icon-circle{
	background:var(--purple);
	padding:28px;
	width:100px;
	height:100px;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:18px;
	font-size:30px;
}
.transfer-card .icon-circle svg{
	fill: #F5E6F5;
}
.transfer-card:hover .h-24,.transfer-card:hover .text-16{
	color: #fff;
}
.transfer-card:hover  .icon-circle{
	background: var(--light-bg);
}
.transfer-card:hover  .icon-circle svg{
	fill: var(--purple);
}
.transfer-card:hover{
	transform:translateY(-6px);
	background: var(--purple);
}
.app-section{
	position: relative;
}
.app-section img.app-img{
	position: absolute;
	right: 0;
	top: 0;
	width: 45%;
	height: 800px;
	object-fit: contain;
	object-position: right;
}
.app-section .section-title{
	max-width: 580px;
	line-height: 40px;
	margin-bottom: 20px;
}
.app-list{
	padding-left: 15px;
	margin-top: 20px;
}
.app-list li{
	margin-bottom:10px;
	font-size:20px;
}
.app-section .right{
	height: 800px;
}
.app-section .app-btn{
	display: flex;
	gap: 20px;
	margin-top: 30px;
}
.app-section .app-btn a{
	background: var(--light-bg);
	border-radius: 25px;
	border:1px solid var(--purple);
	padding: 10px 30px;
}
.app-section .app-btn a:hover{
	box-shadow: var(--shadow-md);
}
.reviews-section{
	padding:var(--section-padding) 0;
	background: var(--purple);
}
.review-card{
	background:#fff;
	border-radius:44px;
	box-shadow:var(--shadow-md);
	padding: 40px 70px;
}
.review-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.review-card .review-img{
	display: flex;
	align-items: center;
	gap: 10px;
}
.review-card .review-img .h-24{
	margin-bottom: 0px;
}
.contact-section{
	padding:var(--section-padding) 0;
}
.contact-form{
	padding: 60px;
	border-radius: 30px;
	box-shadow: var(--shadow-md);
}
.contact-form .form-control{
	border-radius:14px;
	border:1px solid #1A1A1A;
	padding:14px 14px 14px 25px;
	color: #1A1A1A;
	font-size: 18px;
}
.contact-form .dark-btn:hover{
	border: 1px solid var(--purple);
}
.contact-info{
	display: flex;
	gap: 10px;
	align-items: center;
}
.contact-info img{
	width: 70px
}
.contact-info .h-24{
	margin-bottom: 0;
}
.contact-section .left{
	display: flex;
	gap: 40px;
	flex-direction: column;
}
.footer-section{
	background:var(--purple);
	padding:80px 0px 20px 0px;
}
[data-aos]{
	transition-duration:1s;
}
.footer-logo{
	max-width: 200px;
	margin-bottom: 30px;
}
.footer-desc{
	font-size:15px;
	line-height:1.6;
	opacity:.9;
	max-width:260px;
	color: #fff;
}
.footer-title{
	font-size:24px;
	font-weight:600;
	margin-bottom:14px;
	color: #fff;
}
.footer-links li{
	margin-bottom:10px
}
.footer-links a{
	color:#fff;
	text-decoration:none;
	opacity:.9;
	transition:.3s;
}
.footer-links a:hover{
	opacity:1;text-decoration:underline
}
.footer-contact li{
	margin-bottom:10px;
	font-size:16px;
	opacity:.9;
	color: #fff;
}
.footer-bottom{
	border-top:1px solid rgba(255,255,255,.25);
	margin-top:30px;
	padding-top:16px;
	font-size:16px;
	opacity:.9;
	display: flex;
	justify-content: space-between;
	color: #fff;
}
.about-page{
	padding: var(--section-padding) 0;
}
.about-page img{
	height: 400px;
	width: 100%;
	object-fit: cover;
}
.about-section .icon-circle{
	color: #1A1A1A!important;
}
.about-section:hover .icon-circle{
	color: #fff!important;
}
@media(max-width:1600px){
	.saak-navbar img{
		max-width: 130px;
	}
	.dark-btn {
	  	border-radius: 12px;
	  	font-size: 14px;
	  	padding: 10px 25px !important;
	}
	.hero-title {
  		font-size: 54px;
  		line-height: 64px;
  	}
  	.hero-subtitle {
	  	font-size: 20px;
	  	line-height: 27px;
	}
	.rate-header {
	  	margin-bottom: 5px;
	  	font-size: 20px;
	}
	.rate-value {
	  	font-size: 26px;
	}
	.rate-card form input {
		height: 75px;
		border-radius: 20px;
		padding-left: 30px;
		font-size: 18px;
		color: #1A1A1A;
		border: 1px solid #B7B7B7;
	}
	.btn-purple {
	  	background: var(--purple);
	  	color: #fff;
	  	border-radius: 44px;
	  	padding: 18px 34px;
	  	font-size: 18px;
	  	font-weight: 500;
	}
	.hero-section {
	  padding: 180px 0 100px;
	}
	.h-24 {
	  	font-size: 20px;
	}
	.text-18{
		font-size: 16px;
	}
	.text-16{
		font-size: 14px;
	}
	.about-section .stat-box strong {
	  	font-size: 44px;
	}
	.about-section .stat-box span {
	  	font-size: 16px;
	}
	.about-section .left {
	  	height: 700px;
	}
	.about-section img {
	  	height: 700px;
	}
	.review-card {
	  	background: #fff;
	  	border-radius: 44px;
	  	box-shadow: var(--shadow-md);
	  	padding: 40px 40px;
	}
	.footer-title {
	 	font-size: 20px;
	}
	.footer-logo{
		max-width: 150px;
	}
  
}
@media(max-width:992px){
	.hero-title{
		font-size:44px;
	}
	.section-title{
		font-size:32px;
	}
}
@media(max-width:768px){
	.hero-title{
		font-size:38px;
		line-height: 42px;
	}
	.hero-section{
		padding:130px 0 95px
	}
	.hero-subtitle{
		font-size:16px;
		line-height: 20px;
		
	}
	.rate-card{
		padding:0;
		margin-top: 40px;
	}
	.ratecard-title {
	  	padding: 15px;
	}
	.rate-header {
	  	margin-bottom: 5px;
	  	font-size: 14px;
	}
	.rate-value {
	  	font-size: 20px;
	}
	.ratecard-body{
		margin: 0px 20px 0px 20px;
		padding: 30px 20px;
	}
	.rate-card form input {
	    height: 55px;
	    font-size: 16px;
	}
	.rate-card form label {
	  	font-size: 14px;
	  	padding: 3px 15px;
	  	left: 30px;
	}
	.btn-purple{
		padding: 10px;
	}
	.section-title {
	    font-size: 26px;
	}
	.section-label {
		font-size: 20px;
	}
	.feature-box{
		margin-bottom: 20px;
	}
	.about-section img {
	  position: unset!important;
	  left: 0;
	  top: 0;
	  width: 100%;
	  height: 400px;
	  margin-bottom: 20px;
	}
	.about-section .left{
		height: auto;
	}
	.text-18{
		font-size: 14px;
	}
	.h4{
		font-size: 18px;
	}
	.about-section .stat-box strong {
	    font-size: 30px;
	}
	.about-section .stat-box span {
	    font-size: 18px;
	    line-height: 16px;
	}
	.stat-box{
		margin-bottom: 20px!important;
	}
	.transfer-card{
		padding: 20px;
	}
	.app-section{
		padding: var(--section-padding) 0;
	}
	.app-section img.app-img {
	  position: unset!important;
	  right: 0;
	  top: 0;
	  width: 100%;
	  height: 400px;
	  margin-bottom: 20px;
	}
	.app-section .right{
		height: auto;
	}
	.app-list li {
	  	font-size: 16px;
	}
	.contact-form {
	  	padding: 20px;
	  	margin-top: 20px;
	}
	.saak-navbar .navbar-nav {
	  	gap: 10px;
	}
}
@media(min-width: 1600px){
	.container{
		max-width: 1600px;
	}
}

