/* Keep this minimal to avoid conflicts with existing CSS */

:root { --brand:#111; --accent:#0b5fff; }
body { margin:0; font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; color:#222; }
.container { width:min(1100px, 92%); margin-inline:auto; }
.row { display:flex; gap:1rem; }
.between { justify-content:space-between; }
.center { align-items:center; }

.site-header { border-bottom:1px solid #eee; }
.brand { font-weight:700; color:var(--brand); text-decoration:none; }
.site-nav ul { list-style:none; display:flex; gap:1rem; padding:0; margin:0; }
.site-nav a { text-decoration:none; color:#444; padding:.75rem .5rem; border-radius:.5rem; }
.site-nav a.active { color:#fff; background:var(--accent); }

.nav-toggle { display:none; }
@media (max-width: 840px) {
  .site-nav { display:none; }
  .site-nav.open { display:block; }
  .site-nav ul { flex-direction:column; }
  .nav-toggle { display:inline-block; }
}

.hero { padding:3rem 0 1rem; }
.btn { display:inline-block; background:var(--accent); color:#fff; padding:.8rem 1.1rem; border-radius:.6rem; text-decoration:none; }

.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1rem; padding:0; }
.cards li, .card { list-style:none; border:1px solid #eee; border-radius:.8rem; padding:1rem; }

.site-footer { border-top:1px solid #eee; margin-top:3rem; padding:2rem 0; }
.footer-grid { display:grid; grid-template-columns:1.2fr .8fr .8fr; gap:1rem; }
@media (max-width: 840px) {
  .footer-grid { grid-template-columns:1fr; }
}