@font-face {
    font-family: 'HK Grotesk';
    src:
      url('../fonts/HankenGrotesk-Regular.woff2') format('woff2 supports variations'),
      url('../fonts/HankenGrotesk-Regular.woff2') format('woff2-variations'),
      url('../fonts/HankenGrotesk-Regular.woff') format('woff');
    font-weight: 400 500 600 700;
    font-display: swap;
    /* font-stretch: 75% 125%; */
  }

:root {
    --font-main: 'HK Grotesk';


	--font-size-h1: 32px;
	--font-size-h2: 28px;
	--font-size-h3: 24px;
	--font-size-h4: 20px;
	--font-size-h5: 18px;
	--line-height-h1: 40px;
	--line-height-h2: 36px;
	--line-height-h3: 32px;
	--line-height-h4: 30px;
	--line-height-h5: 25px;
    
}


@media (min-width: 768px) {
	:root {
		--font-size-h1: 42px;
		--font-size-h2: 32px;
		--font-size-h3: 28px;
        --font-size-h4: 24px;
        --font-size-h5: 20px;
        --line-height-h1: 52.56px;
		--line-height-h2: 39.4px;
        --line-height-h3: 38.6px;
        --line-height-h4: 38px;
        --line-height-h5: 28px;
	}

}
@media (min-width: 992px) {
	:root {
		--font-size-h1: 44px;
		--font-size-h2: 32px;
		--font-size-h3: 28px;
        --font-size-h4: 24px;
        --font-size-h5: 22px;
        --line-height-h1: 53px;
		--line-height-h2: 41.6px;
        --line-height-h3: 36.4px;
        --line-height-h4: 31.2px;
        --line-height-h5: 28px;
	}

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

}

/**** heading ***/
h1{ 
	font-family: var(--font-main); 
	font-size: var(--font-size-h1);
	line-height: var(--line-height-h1);
    font-weight: 700;
}

h2{ 
	font-family: var(--font-main);
	font-size: var(--font-size-h2);
	line-height: var(--line-height-h2);
    font-weight: 600;
    margin-bottom: 1rem;
}

h3{ 
	font-family: var(--font-main);
	font-size: var(--font-size-h3);
	line-height: var(--line-height-h3);
    font-weight: 600;
}

h4{ 
	font-family: var(--font-main);
	font-size: var(--font-size-h4);
	line-height: var(--line-height-h4);
    font-weight: 600;
    margin-bottom: 1rem;
    margin-top: 1.5rem;
}

h5{ 
	font-family: var(--font-main);
	font-size: var(--font-size-h5);
	line-height: var(--line-height-h5);
    font-weight: 500;
}

/**** paragraph****/
p, li{ 
	font-family: var(--font-main); 
	line-height: 24px;
    font-weight: normal;
    font-size: 16px;

}

/* a{ font-weight: 400;} */

@media (min-width: 1200px) {
    .blog-content p, .blog-content li{ 
        font-size: 20px;
        line-height: 26px;
    }
    .blog-content li{margin-bottom: 10px;}
    .fs-18{font-size: 18px; line-height: 21px;}
    .fs-16{font-size: 16px !important; line-height: 19px;}
    .fs-20{font-size: 20px;}
    
}

a{
	font-family: var(--font-main); 
	text-decoration: none;

}

/*Common*/
    body{ overflow-x:hidden !important; font-family: var(--font-main) !important; color: #000;}
    /* .container{ width: 95%; max-width: 1440px;} */
    .spt-20{padding-top:20px;}
    .sp-50{ padding-top:40px; padding-bottom:40px;}
    .spt-50{ padding-top:40px;}
    .spb-50{ padding-bottom:40px;}
    .mb-30{ margin-bottom: 30px;}
    .mt-30{ margin-top: 30px;}
    .p-30{ padding: 20px;}
    .sp-100{padding-top: 80px; padding-bottom:80px;}
    .btn:focus, .btn.focus, a:focus, .swiper-pagination-bullet:focus, button:focus {outline: 0; box-shadow: none !important;}
   

@media (min-width: 992px) {
	.sp-50{ padding-top:80px; padding-bottom:80px;}
	.spt-20{padding-top:20px;}
	.spt-50{ padding-top:80px;}
	.spb-50{ padding-bottom:80px;}
    .sp-100{padding-top: 120px; padding-bottom:120px;}
}

@media (min-width: 992px) and (max-width:1200px){
    .container{width: 1200px !important;}
}

@media (min-width:992px){
    .col-lg-2-5{width:20% !important;}
}


.menu-box{padding: 8px 8px 12px 8px;height: 100%;}
.dropdown-item{white-space: unset !important;}


.dropdown-menu .menu-box a{
    color: #000000db;
    font-size: 12.8px;
    line-height: 18px;
    padding: .3em .8em ;
}
@media (max-width:992px){
    .vh-100{height: auto !important;}
   }

   @media (max-width:600px){
    .mt-mobile{margin-top: 0;}
   }

@media (min-width: 992px){
    .pe-lg-8{padding-right: 13rem;}
    .db{display: block;}
    .p-lg-4-5{padding: 2rem !important;}
    .ps-6-8 {
        padding-left: 4.8rem !important;
    }
    .p-lg-6{padding: 4.5rem !important;}
   
}
.br-24{border-radius: 24px;}
.br-10{border-radius: 10px;}
.br-20{border-radius: 20px;}

.fs-14{font-size: 14px;}
.fs-16{font-size: 16px !important;}
.lh-24{line-height: 24px;}

@media (min-width:600px){
    .col-md-4-5{width:36.5% !important; display: flex;}
    .col-md-6-5{width:63% !important; display: flex;}
    .col-md-6-3 {
        width: 60.5% !important; display: flex;
    }
    .col-md-4-3 {
        width: 39.5% !important;display: flex;
    }
}

@media (min-width:1200px){
    .w-lg-200{width:200px;}
    .w-lg-224{width:224px;}
    .lh-33-6{line-height: 33.6px !important;}
}

.bg-ll-grey{background-color: #ffffff27; border-radius: 20px;}
.br-76{border-radius:76px;}


.dropdown-menu{background-color: #f9f9f9;}
.menu-box{background-color: #fff !important;padding-top: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: left;
    transition: background-color .3s, box-shadow .3s;}

    @media (min-width: 1200px){
        .nav-item.dropdown .dropdown-menu{display: block !important;max-height: 0 !important;padding: 20px !important;left: 0;visibility: hidden;transition: max-height 0.3s !important;}
        .nav-item.dropdown:hover .dropdown-menu{display: block !important;max-height: 600px !important;padding: 20px !important;visibility: visible;height: auto !important;}
        .navbar-expand-lg .navbar-nav .nav-link:not(.btn-light){padding-top: 20px; padding-bottom: 20px;}
    }


    .heading-color{color: #F0EFEE;}
    .text-purple{color: #845EF7;}
    .bg-llgrey{background-color: #F9FAFC;}