body {
margin:0;
font-family: Arial, Helvetica, sans-serif;
background:#f5f7fb;
color:#333;
}


header {
background:#7b1e3a;
color:white;
padding:1.5rem;
text-align:center;
}


header h1 { margin:0; }


.container {
max-width:1100px;
margin:auto;
padding:1.5rem;
display:grid;
gap:1.5rem;
}


.card {
background:white;
padding:1.5rem;
border-radius:18px;
box-shadow:0 4px 12px rgba(0,0,0,0.08);
transition:0.2s;
}


.card:hover {
transform:translateY(-3px);
box-shadow:0 8px 18px rgba(0,0,0,0.12);
}


h2 {
margin-top:0;
color:#7b1e3a;
}


ul {
padding-left:1.2rem;
margin:0;
}


li {
margin:0.4rem 0;
}


footer {
text-align:center;
padding:1.2rem;
font-size:0.9rem;
color:#666;
}


@media (min-width:700px) {
.container {
grid-template-columns:repeat(2,1fr);
}
}


@media (min-width:1000px) {
.container {
grid-template-columns:repeat(3,1fr);
}
}