.hero { text-align: center; padding: 2rem 0; }
.hero h1 { font-size: 3rem !important; margin-bottom: 0.5rem !important; }
.hero h3 { font-size: 1.4rem; font-weight: 400; opacity: 0.8; margin-bottom: 1rem; }
.hero p { font-size: 1.1rem; max-width: 700px; margin: 0 auto 2rem; opacity: 0.9; }
.md-typeset .grid.cards > ul > li {
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0.5rem;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.md-typeset .grid.cards > ul > li:hover {
  border-color: var(--md-accent-fg-color);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
.md-typeset pre > code { font-size: 0.82rem; }