:root {
    --main-red: #e31e24;
    --dark-grey: #333;
    --light-grey: #f4f4f4;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
    height: 100%;
}

body { 
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; 
    line-height: 1.6; 
    color: var(--dark-grey);
    background-color: #fff;
	display: flex;
    flex-direction: column;
}

.container { 
	width: 90%; 
	max-width: 1200px; 
	margin: 0 auto; }

header { 
	background: var(--main-red); 
	border-bottom: none; 
	padding: 10px 0; 
	position: sticky; 
	top: 0; 
	z-index: 1000; }
	
.logo-wrapper img {
    display: block; 
    height: 45px; 
}

.header-flex { 
	display: flex; 
	justify-content: space-between; 
	align-items: center; 
	flex-wrap: wrap; }
.logo { 
	font-size: 2rem; 
	font-weight: 800; 
	color: var(--main-red); 
	text-decoration: none; 
	letter-spacing: -1px; }

nav ul { 
	display: flex; 
	list-style: none; 
	gap: 20px; }
nav a { 
	text-decoration: none; 
	color: #ffffff; 
	font-weight: 600; 
	font-size: 0.95rem; 
	transition: 0.5s; }
nav a:hover { color: rgba(255, 255, 255, 0.8); }

.hero-section { 
	display: flex; 
	align-items: center; 
	gap: 40px; 
	padding: 60px 0; }
.hero-content { flex: 1; }
.hero-image { 
	flex: 1; 
	text-align: center; }
.hero-image img { 
	max-width: 100%; 
	border-radius: 8px; 
	box-shadow: 0 10px 30px rgba(0,0,0,0.1); }

h1 { 
	font-size: 2.5rem; 
	line-height: 1.2; 
	margin-bottom: 20px; 
	color: var(--dark-grey); }
.red-text { color: var(--main-red); }

.btn { 
	display: inline-block; 
	background: var(--main-red); 
	color: #fff; 
	padding: 12px 25px; 
	text-decoration: none; 
	border-radius: 5px; 
	font-weight: bold; 
	margin-top: 20px; }

@media (max-width: 768px) {
    .header-flex { 
		flex-direction: column; 
		text-align: center; }
    nav ul { 
		margin-top: 20px; 
		flex-wrap: wrap; 
		justify-content: center; 
		gap: 10px; }
    .hero-section { 
		flex-direction: column; 
		padding: 30px 0; }
    h1 { font-size: 1.8rem; }
}


main {
    flex: 1 0 auto;
}

footer {
    flex-shrink: 0;
}