/* Centered Navigation Bar - Desktop */
.centered-nav {
   background: rgb(234 235 235);
	padding: 7px 34px;            margin: 0px auto; /* Centered with top/bottom margin */
	box-shadow: 0 4px 20px rgba(69, 203, 68, 0.3); /* Subtle shadow */
	display: flex;
	justify-content: space-between; /* Space items left and right */
	align-items: center; /* Vertically center items */
	position: relative;
	z-index: 100; /* Ensure it's above other content */
}

/* Full-width Navbar - Mobile */
@media (max-width: 768px) {
	.centered-nav {
		border-radius: 0; /* Straight edges on mobile */
		max-width: 100%; /* Full width */
		margin: 0; /* No margin */
		padding: 15px 20px; /* Adjusted padding */
	}
}

/* Login/Logo Link Styling */
.navbar-login-link {
	display: flex;
	align-items: center;
	text-decoration: none; /* Remove default link underline */
	color: white; /* White text */
	font-weight: 600; /* Bold text */
	transition: opacity 0.3s ease; /* Smooth transition */
}

.navbar-login-link:hover {
	opacity: 0.9; /* Slight fade on hover */
}

/* Login Icon Styling */
.navbar-login-icon {
	margin-right: 8px; /* Space between icon and text */
	font-size: 1.2rem; /* Icon size */
}

/* Download Button Styling */
.navbar-download-btn {
	transition: all 0.3s ease; /* Smooth transition for hover effects */
	font-weight: 600; /* Bold text */
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); /* Button shadow */
	border: none; /* Remove default border */
	color: #d30b17; /* Darker ornage text */
	background-color: white; /* White background */
	border-radius: 30px; /* Pill shape */
	padding: 10px 20px; /* Button padding */
}

.navbar-download-btn:hover {
	transform: translateY(-2px); /* Lift effect on hover */
	box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3); /* Larger shadow on hover */
	color: #320c0c; /* Ensure text color stays */
	background-color: #f8f9fa; /* Slight background change */
}

.navbar-download-btn:active {
	 transform: translateY(0); /* Reset lift on click */
	 box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); /* Reset shadow */
}

/* Logo Link Styling */
.navbar-logo-link {
    display: flex; /* Ensures the image is aligned properly */
    align-items: center;
}

.navbar-logo-img {
    max-height: 64px; /* Adjust logo size as needed */
    /* border: none; */ /* Ensure no border if previously added */
}
.fw-bolder{
   margin-top: 190px;
}

/* Mobile view */
@media (max-width: 768px) {
    .fw-bolder {
        margin-top: 80px;
    }
}

/* --- Hover Effects for Main Content Sections --- */

/* Apply transition to all target sections for smooth animation */
.header-adjust,
.py-5.bg-light.border-top,
.py-3.bg-dark.border-top {
    transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease; /* Smooth transitions */
    /* Optional: Add a default subtle shadow for better depth perception */
    /* box-shadow: 0 2px 5px rgba(0,0,0,0.05); */
}

/* Header Hover Effect */
.header-adjust:hover {
    transform: translateY(-5px); /* Lift slightly */
    /* Example: Add a subtle shadow on hover if not present by default */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    /* Example: Slightly change background if desired (ensure text contrast remains) */
    /* background-color: #e9ecef; */
}

/* Menu Section Hover Effect */
.py-5.bg-light.border-top:hover {
    transform: translateY(-5px); /* Lift slightly */
    /* Example: Enhance shadow */
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    /* Example: Slightly change background */
    /* background-color: #f8f9fa; */
}

 /* Footer Hover Effect */
.py-3.bg-dark.border-top:hover {
    /* Transform might be less visually appealing on footer, optional */
    /* transform: translateY(-2px); */

    /* Example: Enhance shadow */
    box-shadow: 0 -5px 15px rgba(0, 0, 0, 0.2) inset, 0 2px 5px rgba(0, 0, 0, 0.2);
    /* Example: Slightly change background */
    /* background-color: #343a40; */
}

/* --- Hover Effects for Menu Cards --- */
/* Apply transition to the card container */
.bg-white.shadow-sm.border.rounded-4.overflow-hidden {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    /* Ensure the card doesn't overflow its container if scaled */
    will-change: transform;
}

/* Card Hover Effect */
.bg-white.shadow-sm.border.rounded-4.overflow-hidden:hover {
    transform: translateY(-10px) scale(1.02); /* Move up and slightly enlarge */
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2); /* Increase shadow */
}

/* Optional: Button hover effect enhancement within cards */
.btn.btn-primary.w-100.btn-lg {
    transition: background-color 0.3s ease, transform 0.2s ease;
}
.btn.btn-primary.w-100.btn-lg:hover {
    /* The existing btn-primary hover styles will apply, but you could add: */
    transform: scale(1.05); /* Slight scale on button hover */
}