.marketing { max-width: 980px; }
.marketing h1 { font: 52px/1.08 Georgia, serif; margin: 18px 0 16px; }
.marketing .lede { max-width: 620px; font-size: 18px; }
.draft-banner { margin: 18px 0; padding: 12px 14px; border: 1px solid var(--line); background: var(--surface); }
.price-grid, .step-grid, .article-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 28px 0; }
.step-grid, .article-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.price-card, .step-card, .article-card { border: 1px solid var(--line); background: var(--surface); padding: 18px; min-height: 180px; }
.price-card h2, .step-card h2, .article-card h2 { font: 24px/1.2 Georgia, serif; }
.price-card .amount { font: 34px/1 Georgia, serif; margin: 8px 0; }
.price-card button, .text-button, .danger-button { min-height: 42px; border: 0; background: var(--button); color: var(--button-ink); padding: 0 14px; cursor: pointer; }
.danger-button { background: #6d2f2f; }
.release-banner { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin: 18px 0; }
.release-form, .stack { display: grid; gap: 12px; max-width: 720px; }
.release-form label, .stack label { display: grid; gap: 6px; }
.release-form input, .release-form textarea, .release-form select, .stack input, .stack textarea { width: 100%; padding: 10px; border: 1px solid var(--line); background: var(--bg); color: var(--ink); }
.prose { max-width: 720px; }
.prose h2 { margin: 28px 0 8px; font: 28px/1.25 Georgia, serif; }
.prose p, .prose li { color: var(--muted); }
.site-footer { display: flex; gap: 16px; flex-wrap: wrap; padding: 28px 0 48px; color: var(--muted); font-size: 12px; }
.site-footer a { color: inherit; }
@media (max-width: 900px) {
  .price-grid, .step-grid, .article-list { grid-template-columns: 1fr 1fr; }
  .marketing h1 { font-size: 40px; }
}
@media (max-width: 650px) {
  .price-grid, .step-grid, .article-list { grid-template-columns: 1fr; }
}