@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
body {
    margin: 0;
    padding: 0;
    font-family: "Poppins", sans-serif;
}
/* Normal Navbar Styles */
.navbar {
    transition: all 0.4s ease;
    padding: 1rem 1.5rem;
    background: transparent;
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 10;
}

.navbar-brand {
    font-size: 2rem;
    transition: font-size 0.4s ease;
    color: white;
}

.navbar-nav .nav-link {
    font-size: 1.2rem;
    transition: font-size 0.4s ease;
    color: white;
    margin: 0 1rem;
}
.navbar-nav .nav-link:hover, .navbar-brand:hover {
    color: #ff5722;
}

/* Active Link Effect */
.navbar-nav .nav-item.active .nav-link {
    color: #ff5722;
    font-weight: bold;
}
.navbar .navbar-toggler {
    border-color: rgba(255, 255, 255, 0.7);
}

.navbar .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba%28255%2C255%2C255%2C1%29' stroke-width='2' linecap='round' linejoin='round' d='M4 7h22M4 15h22M4 23h22' /%3E%3C/svg%3E");
}

/* Sticky Navbar Styles */
.navbar.sticky {
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 0.5rem 1.5rem;
    position: fixed;
    animation: stickyAnim 0.4s ease forwards;
}

.navbar.sticky .navbar-brand {
    font-size: 1.5rem;
    color: #333;
}

.navbar.sticky .navbar-nav .nav-link {
    font-size: 1rem;
    color: #333;
}
.navbar.sticky .navbar-nav .nav-link:hover {
    color: #ff5722;
}

/* Active Link Effect */
.navbar.sticky .navbar-nav .nav-item.active .nav-link {
    color: #ff5722;
}
.navbar.sticky .navbar-toggler {
    border-color: rgba(0, 0, 0, 0.7);
}

.navbar.sticky .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba%2833%2C33%2C33%2C1%29' stroke-width='2' linecap='round' linejoin='round' d='M4 7h22M4 15h22M4 23h22' /%3E%3C/svg%3E");
}



@keyframes stickyAnim {
    0% {
        top: -70px;
    }
    100% {
        top: 0;
    }
}

/*--------------- about section ------------*/
.about .left-content img{
    border-radius: 20px;
}
.about .right-content p{
    line-height: 2.5rem;
}




/*------------- inquiry form --------------*/
.inq_form .form-control,.inq_form .form-control:focus {
    border-color: #000;
    box-shadow:none;
    outline:none;
}


/*---------- whatsapp ---------*/
.whatsapp-icon {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 50px; /* Adjust size as needed */
    height: 50px; /* Adjust size as needed */
    z-index: 1000; /* Make sure it's on top of other content */
}

.whatsapp-icon img {
    width: 100%;
    height: 100%;
    display: block;
}




/*footer*/

.footer {
	background: rgb(75,198,249);
    background: linear-gradient(150deg, rgba(75,198,249,1) 0%, rgba(9,148,149,0.9192051820728291) 100%);
	padding: 20px 0;
}

.footer h5 {
	font-weight: bold;
	color: #fff;
}

.footer p {
	margin-bottom: 0;
	color: #fff;
}

.footer li a {
	text-decoration: none;
	color: #d1cfcd;
	transition: .2s ease all;
}

.footer li a:hover {
	text-decoration: none;
	color: #fff;
}

.map-container {
	height: 200px;
}


/*---------- about page -------------*/
.about_page {
	padding: 40px 0;
}

.about_page .card {
	border: none;
	border-radius: 15px;
	background: rgba(255, 255, 255, 0.6);
	backdrop-filter: blur(15px);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	transition: transform 0.3s;
}

.about_page .card:hover {
	transform: translateY(-10px);
}

.about_page .card-body {
	padding: 20px;
}

.about_page .card-title {
	font-size: 1.5rem;
	font-weight: bold;
}

.about_page .card img {
	border-radius: 15px 15px 0 0;
}

/*-------- contact page ---------------*/
.contact-page {
	padding: 30px;
}

.contact-page h2 {
	margin-bottom: 30px;
}

.contact-info,
.inquiry-form {
	margin-bottom: 30px;
}

.form-control,
.form-group {
	margin-bottom: 15px;
}

.map {
	height: 400px;
}

.contact-info,
.inquiry-form {
	background-color: #f9f9f9;
	padding: 20px;
	border-radius: 8px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}



/* Responsive Styles */
@media (max-width: 768px) {
    .navbar{
        background-color: #000;
    }
    .top_banners{
        margin-top: 4.5rem;
    }
    .navbar-brand, .navbar.sticky .navbar-brand {
        font-size: 1.2rem;
    }
    .navbar-nav .nav-link {
        font-size: 1rem;
    }

    .banner h1 {
        font-size: 2rem;
    }
    
}