/* Basic, lightweight styling */
:root{--bg:#f3efe9;--card:#fff;--accent:#6b3f2a}
*{box-sizing:border-box}
body{font-family:Segoe UI, Roboto, Arial, sans-serif;margin:0;background:var(--bg);color:#222; background-image: url('back2.png');}
.site-header{background:linear-gradient(180deg,rgba(107,63,42,0.9),rgba(107,63,42,0.7)),url('homelander.png');background-size:cover;padding:36px 20px;color:#fff;text-align:center}
.site-header h1{margin:0 0 8px;font-size:clamp(1.4rem,3vw,2.4rem);border: #222;border-bottom: 2px solid;}
.tag{opacity:.9;margin:0}
.controls{display:flex;gap:8px;padding:18px;justify-content:center}
.controls input, .controls select{padding:10px;border-radius:6px;border:1px solid #ccc}
.grid{
  display:grid;
  gap:18px;
  padding:20px;
  grid-template-columns: repeat(4, 1fr);
}.card{background:var(--card);padding:14px;border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,0.07);display:flex;flex-direction:column;gap:10px}
.card img{width:100%;height:140px;object-fit:cover;border-radius:8px}
.card h3{margin:0;font-size:1.05rem}
.card p{margin:0;color:#444;font-size:.95rem}
.card .meta{font-size:.85rem;color:#777}
.card a{display:inline-block;margin-top:auto;padding:8px 10px;background:var(--accent);color:#fff;text-decoration:none;border-radius:6px}
footer{text-align:center;padding:16px;color:#555}
@media (max-width:480px){.controls{flex-direction:column;padding:12px}}