body{
	font-family: system-ui, "SemiBold" !important;
}
.section-1-bg {
    background-image: 
		linear-gradient(rgba(0, 12, 44, 0.33) 1%, rgba(0, 12, 44, 0) 50%),
        url('../img/header.png'); /* Bottom layer */
    background-blend-mode: normal, multiply; /* Blend mode for each layer */
    background-repeat: no-repeat, no-repeat; /* No repeat for all layers */
    background-size: cover, cover; /* Size adjustments for each layer */
    background-position: center center, center center; /* Position adjustments for each layer */
    width: 100%;
    background-position-y: center;
}



.nav-link{
	color: #fff !important;
	padding: 20px;
	margin-left: 2.5rem;
  font-size: 0.8rem;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
}
.toggle-icon{
	color: #fff !important;
	border: 0px solid #fff !important;
	font-size:1.16rem;
}

@media all and (min-width:1100px){
    .navbar-text{
        text-align: center;
    }
    .navbar-expand-sm .navbar-collapse {
        display: flex !important;
        flex-basis: auto !important;
    }
    .navbar-expand-sm .navbar-toggler {
  		display: none;
    }
}
@media all and (max-width:1100px){
    .nav-link {
        padding: 1.66rem !important;
    }

    .navbar-nav {
        flex-direction: column !important;
        padding-top: 1rem;
    }
    
    /* Remove display: none to allow menu to open */
    .navbar-expand-sm .navbar-collapse {
        position: relative;
        width: 100%;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.5s ease-in-out;
    }

    /* When menu is open, allow expansion */
    .collapse.show {
        max-height: 400px; /* Adjust height as needed */
        background-color: rgb(43, 35, 35);
        padding-bottom: 0.5rem;
        overflow: visible;
    }

    .navbar-expand-sm .navbar-toggler {
        display: inherit !important;
    }

    .navbar-text {
        text-align: center;
        padding: 0px !important;
    }

    .collapse.show.section-1-bg {
        background-color: rgba(119, 119, 119, 1.0) !important;
    }

    .button-57 {
        border: none !important;
        font-size: 20px !important;
    }

    .navbar {
        position: relative !important;
        display: flex !important;
        flex-direction: column!important;
        align-items: center !important;
        overflow: hidden !important;
    }

	.header {
	   position: sticky !important;
	   top: 0;
	   width: 100%;

	}
    .navbar-expand-sm {
         flex-wrap: wrap !important;
     }
     .navbar-expand-sm .navbar-collapse{
     	display: block !important;
     }
}


@media all and (max-width:1100px){
	.section-1-bg{
		background-image: url('../images/tab-view.png'), linear-gradient(89deg, rgba(0, 12, 44, 0.66) 1%, rgba(0, 12, 44, 0) 97%);
		background-blend-mode: multiply;
		background-repeat: no-repeat;
		background-size: cover;
		width: 100%;
		min-height: 600px !important;
		background-position-x: center;
	}
	.navbar-toggler{
		position: relative !important;
	}
	.nav-menu{
/*		position: absolute;
	    top: 100px*/;
	    text-align: center;
	    width: 100%;
	    left: 0px;
	    right: 0px;
	}
	.nav-link{
		color: #fff !important;
		padding-left: 0rem !important;
	}
	.toggle-icon{
		font-size:3rem !important;
	}
}
.container-section{
	
	  padding-top: calc(300px - 60px);
	  min-height: 650px;
}

.logo-img img{
	  width: 2rem;
	  height: 55px;
	  object-fit: contain;
}

.heading-1 h1{
	object-fit: contain;
  	font-size: 2.5rem;
  	font-weight: 600;
  	font-stretch: normal;
  	font-style: normal;
  	line-height: 1.67;
  	letter-spacing: normal;
  	color: #fff;
}

.span-1{
	color: #ec4156;
	font-weight: 700; 
	font-size: 3rem;
}

@media all and (max-width:600px){
	.heading-1 h1{
	  font-size:1rem !important;
	  font-weight: 600;
	  font-stretch: normal;
	  font-style: normal;
	  line-height: normal;
	  letter-spacing: normal;
	  text-align: left;
	}
	.heading-2 h1{
	  font-size:1.16rem !important;
	  font-weight: 600;
	  font-stretch: normal;
	  font-style: normal;
	  line-height: normal;
	  letter-spacing: normal;
	  text-align: center;
	  margin-top: 4rem;
	  color: #ec4156;
	}
	.innovation-text h2{
		font-size: 0.8rem !important;
	}
	.innovation-text p{
		font-size: 16px !important;
		margin-top: 1rem !important;
	}
}

.heading-2 h1{
  font-size: 2rem;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  margin-top: 4rem;
  color: #ec4156;
}

.innovation-text h2{
	font-size: 1.66;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  margin-top: 3rem;
}

.innovation-text p{
  font-size: 1rem;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: left;
  color: #7e7e7e;
  margin-top: 2rem;
}

.bold-text{
	font-size: 2rem;
    font-weight: 700;
	font-stretch: normal;
	font-style: normal;
	line-height: normal;
	letter-spacing: normal;
	text-align: left;
	color: #3d3d3d;
}

.normal-text{
  font-size: 1rem;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.2;
  letter-spacing: normal;
  text-align: left;
  color: #7e7e7e;
}

.innovation-img img{
	width: 100%;
	height: 300px;
	object-fit: contain;
}

@media all and (max-width:600px){
	.bold-text{
		font-size:1.33rem !important;
	}
	.normal-text{
		font-size: 16px !important;
	}
	.text-1{
		align-items: center !important;
		justify-content: center !important;
	}
	.innovation-img img{
		object-fit: contain !important;
		height: 370px !important;
	}
}

.section-3{
  background-color: #2b2323;
  width: 100%;
}

.heading-3 h1{
  
  font-size: 2rem;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #ec4156;
  padding-top: 3rem;
}

.heading-3 p{
	
  font-size:1.66rem;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
  padding-top: 2rem;
}

.about-text img{
	width: 2.66rem;
	height: 2.66rem;
	object-fit: contain;
	margin-top: 0rem;
}

.about-text h1{
	
  font-size:1.33rem;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
/*  text-align: left;*/
  color: #fff;
  margin-top: 1rem;
}

.about-card{
	background-color: #2b2323 !important;
	border: 1px solid #ec4156 !important;
	border-radius:0.4rem !important;
	margin-top: 2rem !important;
	margin-bottom: 2rem;
}

.about-text p{
	
  font-size:1rem;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
/*  text-align: left;*/
  color: #e1e1e1;
  margin-top: 2rem;
}

@media only screen and (max-width:600px){
	.about-text img{
		width:1.33rem;
		height:1.33rem;
		object-fit: contain;
		margin-top: 1.5rem;
	}
	.about-text h1{
		font-size:0.73rem;
		margin-top: 1.5rem;
	}
	.about-text p{
		 font-size: 20px;
		 margin-top: 1.5rem;
	}
	.heading-3 p{
		  font-size: 0.8rem;
	}
}

.heading-4 h1{
  font-size: 2rem;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #ec4156;
  padding-top: 3rem;
}

.heading-4 p{
	
  font-size:1.66rem;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #3d3d3d;
  margin-top: 3rem;
}

.explore-text img{
	  width: 3rem;
	  height: 3rem;
	  object-fit: contain;
}

.explore-text h1{
	
  font-size:1.16rem;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: left;
  color: #3d3d3d;
  margin-top: 1.5rem;
}

.explore-text p{
	
  font-size:0.8rem;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: left;
  color: #7e7e7e;
  margin-top: 1rem;
}

.explore-card{
	height: 250px !important;
	border: none !important;
}

.explore-img img{
	/* height: 800px; */
	width: 100%;
	object-fit: contain;
}

.explore-box{
	padding-left: 10rem;
}

@media all and (max-width:600px){
	.explore-img img{
		height: 344px !important;
		width: 100% !important;
	}
	.heading-5 p{
		font-size:1.33rem !important;
	}
	.heading-5 h1{
		font-size:1.16rem !important;
	}
	.contact-img img{
		height: 250px !important;
		width: 100%;
		object-fit: contain;
	}
}

@media all and (max-width: 1100px){
	.explore-box{
		padding-left: 0rem !important;
	}
	.explore-text p{
		text-align: center !important;
	}
	.explore-text h1{
		text-align: center !important;
	}
	.explore-text img{
		display: block;
		margin: auto;
	}
	.explore-img img{
		height: 633px;
		width: 100%;
	}
	.send-btn{
		font-size: 20px !important;
	}
	.contact-img img{
		height: 450px;
		width: 100%;
		object-fit: contain;
	}
}

.section-5{
  background-color: #2b2323;
  width: 100%;
  margin-top: 2rem;
}

.heading-5 h1{
	
  font-size: 2rem;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #ec4156;
  padding-top: 3rem;
}

.heading-5 p{
	
  font-size:1.66rem;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
  margin-top: 2rem;
}

.send-btn{
	background-color: #ec4156;
	border-color: #ec4156 !important;
	font-size: 0.8rem;
  	font-weight: 500;
  	font-stretch: normal;
  	font-style: normal;
  	line-height: normal;
  	letter-spacing: normal;
  	text-align: center;
}

.send-btn:hover{
	background-color: #ec4156;
	border-color: #ec4156 !important;
}

.input-field{
	background-color: #2b2323 !important;
	border-top: 0px !important;
	border-left: 0px !important;
	border-right: 0px !important;
	border-radius: 0px !important;
	border-bottom:0.1rem solid #fff !important;
	color: #fff !important;
}

.input-field::placeholder{
	font-size: 15px;
	color: #fff;
	font-weight: 600;
}

.input-field:focus{
	outline: none !important;
	border-top: 0px !important;
	border-left: 0px !important;
	border-right: 0px !important;
	border-radius: 0px !important;
	border-bottom:0.8rem solid #fff !important;
	box-shadow: none !important;
}

.contact-img img{
	height: 500px;
	width: 100%;
	object-fit: contain;
}

.section-6{
  background-color: #ec4156;
  width: 100%;
}

.footer-logo img{
  width: 162px;
  height:7.83rem;
  object-fit: contain;
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.link-text h1{
	
  font-size:1.33rem;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: left;
  color: #fff;
  margin-top: 2rem;
  margin-left: 2rem;
  padding: 20px;
}

.footer-nav{
	list-style-type: none !important;
	display: flex;
	justify-content: space-between;
}

.footer-text{
	text-decoration: none !important;
	color: #fff;
	padding: 20px;
	
	  font-size:0.73rem;
	  font-weight: 500;
	  font-stretch: normal;
	  font-style: normal;
	  line-height: normal;
	  letter-spacing: normal;
	  text-align: left;
}

.footer-text:hover{
	color: #fff;
}

@media all and (max-width: 600px){
	.footer-logo img{
		width: 92px !important;
		height: 133px !important;
		display: block;
		margin: auto;
		margin-top: 2rem;
	}
	.link-text h1{
		margin-left: 0rem !important;
		padding: 10px !important;
		font-size: 20px !important;
	}
	.footer-text{
		padding: 10px !important;
		font-size: 16px !important;
	}
	.footer-nav{
		padding-left: 0rem !important;
	}
	.contact-text h1{
		padding: 10px !important;
		margin-left: 0.5rem !important;
		font-size: 20px !important;
	}
	.contact-add img{
		margin-left: 0.5rem !important;
	}
	.contact-add span{
		font-size: 16px !important;
	}
	.contact-add{
		margin-bottom: 2rem;
	}
	.contact-text{
		padding: 0px !important;
	}
	.contact-add{
		padding: 5px !important;
	}
}

.contact-text h1{
	
  font-size:1.33rem;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: left;
  color: #fff;
  margin-top: 2rem;
  margin-left: 2rem;
}

.contact-add{
	margin-top: 1.5rem;
}

.contact-add img{
	 width: 32px;
	  height:1.33rem;
	  object-fit: contain;
	  margin-left: 2rem
}

.contact-add span{
	
  font-size:0.73rem;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: left;
  color: #fff;
  margin-left: 20px;
}

@media all and (max-width:1100px){
	.footer-logo img{
	  width: 119px;
	  height: 173px;
	  object-fit: contain;
	  display: block;
	  margin: auto;
	  margin-top: 2rem;
	}
	.contact-text{
		padding: 0px;
	}
	.contact-add{
		padding: 0px;
	}
	.contact-input{
		margin-top: 2rem;
		padding-top: 2rem;
	}
	.link-text h1{
		margin-left: 0rem;
		padding: 0px;
	}
	.contact-text h1{
		margin-left: 0rem;
	}
	.contact-add img{
		width: 2rem;
		height: 2rem;
		margin-left: 0rem;
	}
	.footer-nav{
		margin-top: 3rem;
		padding-left: 0rem;
	}
	.footer-text{
		margin-left: 0rem;
		padding: 0px;
	}
}
.flex {
    display: flex;
    justify-content: space-between;
}

.gone {
    display: none; /* Hide by default */
}
.footer-nav-visible #footerNav {
	display: flex;
}
.footer-nav{
	justify-content: space-between;
	display: flex;
}
  
  
.toggle-btn {
	display: none; 
	height: 50px;
	width: 50px;
	margin-top: 1rem;
	margin-right: 10px;
}

.toggle-btn img {
	margin-top: 1.66rem;
	height: 1.50rem;
	width: 1.50rem;
	float: right;
}
.mb-4 {
    margin-bottom: 4rem !important;
}

/* Mobile phones (up to 767px) */
@media (max-width: 767px) {
	.heading-1 h1 {
		padding: 0 2rem;
		font-size: 2rem !important;
	}
	.heading-2 h1 {
        font-size: 2.32rem !important;
	}
	.innovation-text h2 {
        font-size: 1.6rem !important;
	}
	.heading-3 p {
        font-size: 1.6rem;
    }
	.about-text h1 {
        font-size: 1.46rem;
	}
	.about-text img {
        width: 2.66rem;
        height: 2.66rem;
	}
	.explore-text h1 {
		font-size: 1.66rem;
	}
	.explore-text p {
		font-size: 1rem;
	}
	.explore-text img {
		width: 5rem;
		height: 5rem;
	}
	.heading-5 h1 {
        font-size: 2.32rem !important;
    }
	.heading-5 p {
        font-size: 2rem !important;
    }
	.send-btn{
		padding: 0.5rem 4rem;
	}
	.mt-4 {
		margin-top: 0rem !important;
	}
	.flex {
        display: flex;
        justify-content: space-between;
    }
    .gone {
        display: block; 
		height: 50px;
		width: 50px;
		margin-top: 1rem;
		margin-right: 10px;
    }
	.gone img{
		margin-top: 1.66rem;
		height: 1.50rem;
		width: 1.50rem;
		float: right;
	}
	.footer-nav {
		margin-top: 5px;
	}
	.innovation-text h2 {
		margin-top: 1rem;
	}
	.heading-3 p {
		padding-top: 1rem;
	}
	.toggle-icon {
        font-size: 2rem !important;
    }
	.logo-img img {
		width: 2.5rem;
	}
	.navbar {
		padding: .5rem !important;
	}
	.margin-adjust{
		margin-top: 0;
	}		
	.contact-add {
		margin-top: 0rem;
	}
	.mb-5 {
		margin-bottom: 0rem !important;
	}


	.toggle-btn {
		display: block; 
	}
/*	.footer-nav{
		display: none;
	}*/
	.logo-img img{
		width: 4rem;
 	}
	 .nav-link{
		font-size: 1.5rem;
	  }
	  .section-2 .innovation-text p,
	.section-3 .about-card p,
	.section-4 .explore-card p,
	.section-5 .input-field,
	.section-6 .footer-nav .footer-text,
	.section-6 .contact-add {
		font-size: 1.5rem;
	}
	  .section-2 .heading-2 h1,
	.section-3 .heading-3 h1,
	.section-4 .heading-4 h1,
	.section-5 .heading-5 h1 {
		font-size: 2.2rem;
		font-weight: 700;
	}

	.section-2 .innovation-text h2,
	.section-3 .about-card h1,
	.section-4 .explore-card h1 {
		font-size: 1.8rem;
		font-weight: 600;
	}
	.heading-3 p {
		padding-top: 2rem;
	}	
	.row{
		padding-bottom: 20px;
	}
	.mb-4 {
		margin-bottom: 0rem !important;
	}
	.row {
        padding-bottom: 0px;
    }

}
/* iPads/tablets (768px to 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
	.explore-col {
        flex: 0 0 50%;
        max-width: 50%;
    }
    .explore-card {
        height: auto !important;
    }
	.section-1-bg {
		padding: 70px 0;
	}

	.section-1-bg h1 {
		font-size: 2rem;
	}

	.section-2 .heading-2 h1,
	.section-3 .heading-3 h1,
	.section-4 .heading-4 h1,
	.section-5 .heading-5 h1 {
		font-size: 1.5rem;
	}

	.section-2 .innovation-text h2,
	.section-3 .about-card h1,
	.section-4 .explore-card h1 {
		font-size: 1.2rem;
	}

	.section-2 .innovation-text p,
	.section-3 .about-card p,
	.section-4 .explore-card p,
	.section-5 .input-field,
	.section-6 .footer-nav .footer-text,
	.section-6 .contact-add {
		font-size: 0.9rem;
	}
	.section-1-bg {
		padding: 50px 0;
	}

	.section-1-bg h1 {
		font-size: 2.2rem;
	}

	.section-2 .heading-2 h1,
	.section-3 .heading-3 h1,
	.section-4 .heading-4 h1,
	.section-5 .heading-5 h1 {
		font-size: 1.8rem;
	}

	.section-2 .innovation-text h2,
	.section-3 .about-card h1,
	.section-4 .explore-card h1 {
		font-size: 1.4rem;
	}

	.section-2 .innovation-text p,
	.section-3 .about-card p,
	.section-4 .explore-card p,
	.section-5 .input-field,
	.section-6 .footer-nav .footer-text,
	.section-6 .contact-add {
		font-size: 1rem;
	}
	.section-1-bg {
		padding: 80px 0;
	}

	.section-1-bg h1 {
		font-size: 2.4rem;
	}

	.section-2 .heading-2 h1,
	.section-3 .heading-3 h1,
	.section-4 .heading-4 h1,
	.section-5 .heading-5 h1 {
		font-size: 2rem;
	}

	.section-2 .innovation-text h2,
	.section-3 .about-card h1,
	.section-4 .explore-card h1 {
		font-size: 1.6rem;
	}

	.section-2 .innovation-text p,
	.section-3 .about-card p,
	.section-4 .explore-card p,
	.section-5 .input-field,
	.section-6 .footer-nav .footer-text,
	.section-6 .contact-add {
		font-size: 1.1rem;
	}
	.section-1-bg {
		padding: 60px 0;
	}

	.section-1-bg h1 {
		font-size: 2.6rem;
	}

	.section-2 .heading-2 h1,
	.section-3 .heading-3 h1,
	.section-4 .heading-4 h1,
	.section-5 .heading-5 h1 {
		font-size: 2.2rem;
		font-weight: 700;
	}

	.section-2 .innovation-text h2,
	.section-3 .about-card h1,
	.section-4 .explore-card h1 {
		font-size: 1.8rem;
		font-weight: 600;
	}

	.section-2 .innovation-text p,
	.section-3 .about-card p,
	.section-4 .explore-card p,
	.section-5 .input-field,
	.section-6 .footer-nav .footer-text,
	.section-6 .contact-add {
		font-size: 1.5rem;
	}
	.contact-add span {
		font-size: 1.5rem;
	}
	.contact-add img {
        width: 2.5rem;
        height: 2.5rem;
        margin-left: 0rem;
	}
	.contact-text h1 {
		font-size: 2rem;
	}
	.link-text h1 {
		font-size: 2rem;
	}
	.footer-nav {
        margin-top: 1rem;
        padding-left: 0rem;
    }
	.flex {
        display: flex;
        justify-content: space-between;
    }
    .gone {
        display: block; 
		height: 50px;
		width: 50px;
		margin-top: 1rem;
		margin-right: 10px;
    }
	.gone img{
		margin-top: 1.66rem;
		height: 1.50rem;
		width: 1.50rem;
		float: right;
	}
	.mb-5 {
		margin-bottom: 0rem !important;
	}
	.col-12{
		padding-bottom: 2rem !important;
	}
	.text-1{
		padding-left: 20%;
	}
	.toggle-btn {
		display: block; 
	}
	.footer-nav{
		display: none;
	}
	.logo-img img{
		width: 4rem;
 	}
	 .nav-link{
	  font-size: 2rem;
	}
	.heading-3 p {
		padding: 0 10rem;
		padding-top: 2rem;
	}

	
}


.header {
   position: sticky;
   top: 0;
   width: 100%;
   background: #2b2323;
   z-index: 1000;
   padding: 10px 0;
   transition: background 0.3s ease-in-out;
}



.card-body {
  display: flex;
  justify-content: center; /* Centers horizontally */
  align-items: center; /* Centers vertically */
  text-align: center;
  height: 100%;
}

.about-text {
  display: flex;
  flex-direction: column;
  align-items: center; /* Ensures everything is centered */
  /* Adds spacing between elements */
}