body{
	margin:0;
	padding:0;
}

.nav-menu{
	margin-right:30px;
}

.nav-item a:hover{
	color:red;
} 

header{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	background:transparent;
	border-bottom:none;
	z-index:1000;
	padding: 15px 0;
	transition: all 0.4s ease;  /* Smooth transition for all changes */
	box-shadow:none;
}

header.scrolled {
    background-color: white;          /* White background after scroll */
    box-shadow: 0 2px 10px rgba(0,0,0,0.2);  /* Subtle shadow */
}

header a.nav-link {
    color: #fff;
    transition: color 0.4s ease; /* Smooth color change */
}

header.scrolled a.nav-link {
    color: #de450d;   /* Keep red color after scroll */
}

header.scrolled a.nav-link:hover{
	color:#003a96;
}

header span.logo {
    color: #fff;
    transition: color 0.4s ease;
}

header.scrolled span.logo {
    color: #de450d;
}
	

.nav-item a{
	text-decoration:none;
	color:white;
	font-size:15px;
	transition: color 0.3s ease;
	
}

#home{
	width:100%;
	height:350px;
	background: url(https://ik.imagekit.io/maheenasim/talk1.jpeg?updatedAt=1756775393715);
	background-size:cover;
	position:relative;
	overflow:hidden;
}

.overlay{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(67, 89, 144, 0.9);
	z-index:1;
}

.home-text{
	z-index:2;
	position: relative;
	display:flex;
	justify-content:center;
	width:100%;
	height:100%;
	flex-direction:column;
	align-items:center;
}

.home-text h2{
	color:white;
	font-size:45px;
	margin-bottom:15px;
}

.home-text h3{
	font-size:30px;
	color:white;
}

.social-icons {
  display: flex;
  gap: 15px;
  margin-top: 20px;
  font-size: 20px;
  color: #de450d;
}

.frequent{
	padding-top:100px;
	padding-bottom:100px;
	display:flex;
	justify-content:center;
	align-items:center;
	gap:40px;
}
.faq-text{
	display:flex;
	justify-content:center;
	align-items:center;
	flex-direction:column;
	width:450px;
}

.faqs{
	max-width:600px;
	margin-top:2rem;
	padding-bottom:1rem;
	border-bottom: 2px solid #666;
	cursor:pointer;
}

.faq-container{
	display:flex;
	justify-content:center;
	align-items:center;
	flex-direction:column;
}

.question{
	display:flex;
	justify-content:space-between;
	align-items:center;
}

.question h3{
	font-size:1.2rem;
}

.answer{
	max-height:0;
	overflow:hidden;
	transition: max-height 1.4s ease;
}
.answer p{
	padding-top:1rem;
	line-height:1.6;
	font-size:1rem;
}
	
.faqs.active .answer{
	max-height:300px;
	animation: fade 1s ease-in-out;
	
}

.faqs.active svg{
	transform: rotate(180deg);
}

svg{
	transition: transform 0.5s ease-in;
}

@keyframes fade{
	from{
		opacity:0;
		transform: translateY(-10px);
	}
	
	to{
		opacity:1;
		transform: translateY(0px;)
	}
}