/* Standalone content pages (landing pages, grammar rules, about) on top of site.css */
body > .container {
  max-width: 760px;
  margin: 28px auto 0;
  padding: 8px 32px 32px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 16px;
  line-height: 1.7;
}
body > .container h1, body > .container .page-title { font-size: clamp(26px, 3.4vw, 34px); line-height: 1.2; letter-spacing: -0.02em; }
body > .container h2 { color: var(--blue); }
.cta {
  display: inline-block;
  background: var(--blue);
  color: #fff;
  font-weight: 700;
  padding: 12px 20px;
  border-radius: 10px;
  text-decoration: none;
}
.cta:hover { background: var(--blue-dark); }
/* Inline examples inside list items used to overlap the line above */
span.example { display: inline-block; margin: 6px 0 2px; padding: 6px 12px; }
.site-footer { margin-top: 40px; text-align: start; }
@media (max-width: 640px) {
  body > .container { margin: 0; border-radius: 0; border-left: 0; border-right: 0; padding: 4px 18px 24px; }
}