:root { --bg:#0b0b0f; --fg:#f4f6fb; --muted:#a0a7b4; --card:#151722; --brand:#5ac8fa; }
* { box-sizing: border-box; }
html,body { margin:0; padding:0; background:var(--bg); color:var(--fg); font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.site-header { padding:2.5rem 1.25rem 1rem; text-align:center; }
h1 { margin:0 0 .25rem; font-size:2rem; }
.tagline { margin:0; color:var(--muted); }
.container { max-width:1000px; margin:1rem auto 3rem; padding:0 1rem; }
.grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(260px,1fr)); gap:1rem; }
.card { background:var(--card); border-radius:14px; padding:1rem 1rem 1.25rem; display:flex; flex-direction:column; gap:.5rem; box-shadow: 0 10px 24px rgba(0,0,0,.25); }
.card-title { margin:.25rem 0 0; font-size:1.1rem; line-height:1.3; }
.card-price { margin:0; color:var(--muted); font-size:.95rem; }
.card-btn { margin-top:auto; display:inline-block; text-align:center; background:var(--brand); color:#051218; text-decoration:none; font-weight:600; padding:.6rem .8rem; border-radius:10px; }
.card-btn:hover { filter:brightness(1.05); }
.empty { color:var(--muted); text-align:center; }
.site-footer { text-align:center; color:var(--muted); padding:1rem; border-top:1px solid rgba(255,255,255,.06); }