:root{
  --emerald:#2E8B57; --forest:#0B3D2E; --silver:#C0C0C0; --white:#FFFFFF; --gold:#D4AF37;
}
.hero {
  padding: 3.5rem 1.25rem;
  border-radius: 14px;
  background:
    radial-gradient(120% 120% at 70% 30%, rgba(255,255,255,.06) 0%, rgba(255,255,255,0) 40%),
    linear-gradient(135deg, var(--forest), #07231A 55%, var(--emerald) 110%);
  color: var(--white);
  border: 1px solid rgba(255,255,255,.10);
  text-align: center;
}
.hero h1 { letter-spacing:.06em; font-variant: small-caps; margin-bottom:.2rem }
.hero p.subtitle { color: var(--silver); margin-top:0 }
.hero .cta-row { margin-top:1rem; display:flex; gap:.75rem; justify-content:center; flex-wrap:wrap }
.button.gold { border:1px solid var(--gold) }
.grid {
  display:grid; gap:1rem; grid-template-columns: 1fr; margin-top:1.5rem
}
@media (min-width: 900px) {
  .grid { grid-template-columns: 1.2fr .8fr; }
}
.card {
  border:1px solid rgba(0,0,0,.08); border-radius:14px; padding:1rem; background:#fff;
}
.card.dark {
  background: #0f2a22; color: var(--white); border-color: rgba(255,255,255,.10);
}
.card img { width:100%; height:auto; border-radius:10px }
.list-clean { list-style: none; padding-left:0; margin:0 }
.list-clean li { margin:.4rem 0 }
footer { margin:3rem 0 1rem }
footer .links { display:flex; gap:12px; justify-content:center; flex-wrap:wrap }
footer .links a { text-decoration:none }