body {
margin: 0;
font-family: Arial, sans-serif;
background: #f2f4f7;
}
/* HEADER */
header {
background: #d8232a;
color: #fff;
padding: 15px 40px;
display: flex;
justify-content: space-between;
align-items: center;
}
.logo {
font-size: 24px;
font-weight: bold;
}
.logo span {
color: #ffd700;
}
nav a {
color: #fff;
margin-left: 20px;
text-decoration: none;
}
/* SEARCH */
.search-box {
background: white;
padding: 20px;
display: flex;
gap: 10px;
justify-content: center;
}
.search-box input,
.search-box select,
.search-box button {
padding: 10px;
font-size: 14px;
}
.search-box button {
background: #d8232a;
color: white;
border: none;
cursor: pointer;
}
/* LAYOUT */
.container {
display: flex;
padding: 20px;
}
/* FILTERS */
.filters {
width: 220px;
background: white;
padding: 15px;
margin-right: 20px;
border-radius: 6px;
}
.filters label {
display: block;
margin-top: 10px;
}
/* LISTINGS */
.listings {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
gap: 20px;
flex: 1;
}
.card {
background: white;
border-radius: 8px;
overflow: hidden;
}
.card img {
width: 100%;
height: 180px;
object-fit: cover;
}
.card-body {
padding: 15px;
}
.price {
color: green;
font-weight: bold;
}
.card button {
margin-top: 10px;
background: #2563eb;
color: white;
border: none;
padding: 8px;
cursor: pointer;
}
/* FOOTER */
footer {
background: #111;
color: white;
text-align: center;
padding: 15px;
}