:root{
  --bg:#f9fdfb; --text:#1d1f20; --muted:#5e6b68; --accent:#4cc9a7;
  --card:#f1f7f4; --border:#d9e5df;
}
*{box-sizing:border-box}
body{
  margin:0; font-family:'DM Sans',Inter,system-ui;
  background:var(--bg); color:var(--text); line-height:1.6;
}
header,main,footer{max-width:1080px;margin:auto;padding:0 1.4rem}
header{padding-top:2rem;text-align:center}
h1,h2,h3{font-family:'Libre Baskerville',serif;margin:.3rem 0;color:var(--text)}
.lede{color:var(--muted);margin-top:.5rem;font-size:1.1rem}
.grid{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:2rem 0}
.card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:1.2rem;transition:box-shadow .2s}
.card:hover{box-shadow:0 4px 10px rgba(0,0,0,0.05)}
.card h3{color:var(--accent);margin-bottom:.4rem}
a.btn{display:inline-block;background:var(--accent);color:#fff;padding:.5rem .9rem;border-radius:.6rem;text-decoration:none;font-weight:600}
footer{color:var(--muted);text-align:center;padding:2rem 0 3rem}
.badge{display:inline-block;padding:.3rem .6rem;border:1px solid var(--border);border-radius:.5rem;font-size:.9rem;color:var(--muted)}
hr{border:none;border-top:1px solid var(--border);margin:3rem 0}

.references ul {
  list-style-type: none;
  padding-left: 0;
  margin: 1rem 0;
}
.references li {
  background: var(--card);
  border-left: 3px solid var(--accent);
  padding: .75rem 1rem;
  margin-bottom: .75rem;
  border-radius: 10px;
}
.references a {
  color: var(--text);
  text-decoration: none;
  font-weight: 500;
}
.references a:hover {
  color: var(--accent);
  text-decoration: underline;
}
.references cite {
  display: block;
  color: var(--muted);
  font-size: .9rem;
  margin-top: .2rem;
}