:root {
	--bus-green: #2E8B57;
	--bus-dark-green: #1a5233;
	--cream: #F5F5DC;
	--text-dark: #333;
	--accent-gold: #D4AF37;
}

body {
	font-family: 'Open Sans', sans-serif;
	color: var(--text-dark);
	background-color: #f9f9f9;
	padding-top: 76px;
}

h1, h2, h3, h4, h5, .navbar-brand, .nav-link {
	font-family: 'Amatic SC', cursive;
	font-weight: 700;
}

.navbar {
	background-color: var(--bus-green);
	box-shadow: 0 2px 4px rgba(0,0,0,0.1);
	padding: 10px 0;
}

.navbar-brand {
	color: var(--cream) !important;
	font-size: 2rem;
	letter-spacing: 1px;
}

.nav-link {
	color: rgba(255,255,255,0.9) !important;
	font-size: 1.5rem;
	margin: 0 10px;
	transition: color 0.3s ease;
}

.nav-link:hover, .nav-link.active {
	color: var(--accent-gold) !important;
}

.navbar-toggler {
	border-color: rgba(255,255,255,0.5);
}

.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(255, 255, 255, 0.9)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.btn-custom {
	background-color: var(--bus-green);
	color: white;
	font-family: 'Amatic SC', cursive;
	font-size: 1.5rem;
	padding: 10px 25px;
	border: 2px solid var(--bus-green);
	transition: all 0.3s;
}

.btn-custom:hover {
	background-color: transparent;
	color: var(--bus-green);
}

.btn-outline-custom {
	background-color: transparent;
	color: var(--cream);
	font-family: 'Amatic SC', cursive;
	font-size: 1.5rem;
	padding: 10px 25px;
	border: 2px solid var(--cream);
	transition: all 0.3s;
}

.btn-outline-custom:hover {
	background-color: var(--cream);
	color: var(--bus-green);
}

.page-section {
	animation: fadeIn 0.5s;
}

@keyframes fadeIn {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: translateY(0); }
}

.hero-section {
	background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)), url('./_img/bus-wheel.jpg');
	background-size: cover;
	background-position: center;
	height: calc(100vh - 76px);
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	color: white;
}

.hero-content h1 {
	font-size: 5rem;
	text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}

.hero-content p {
	font-size: 1.5rem;
	margin-bottom: 30px;
}

.section-header {
	text-align: center;
	margin-bottom: 50px;
	margin-top: 80px;
}

.section-header h2 {
	font-size: 3.5rem;
	color: var(--bus-green);
}

.section-header .line {
	width: 100px;
	height: 3px;
	background-color: var(--accent-gold);
	margin: 10px auto;
}

.gallery-item {
	margin-bottom: 30px;
	overflow: hidden;
	border-radius: 8px;
	box-shadow: 0 4px 6px rgba(0,0,0,0.1);
	cursor: pointer;
	transition: transform 0.3s;
}

.gallery-item:hover {
	transform: scale(1.02);
}

.gallery-item img {
	width: 100%;
	height: 250px;
	object-fit: cover;
}

.feature-icon {
	font-size: 3rem;
	color: var(--bus-green);
	margin-bottom: 20px;
}

footer {
	background-color: var(--bus-dark-green);
	color: var(--cream);
	padding: 40px 0;
	margin-top: 60px;
}

footer a {
	color: var(--cream);
	text-decoration: none;
}

.modal-body img {
	width: 100%;
}