.content-page { padding: 72px 0 88px; }
.content-hero { max-width: 780px; }
.content-hero h1 { margin: 14px 0 16px; font-size: var(--type-size-display); line-height: var(--type-line-tight); letter-spacing: -.05em; }
.content-hero > p { max-width: 680px; margin: 0; color: var(--color-text-muted); font-size: var(--type-size-body-lg); line-height: var(--type-line-body); }
.content-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.content-actions .button[aria-disabled="true"] { cursor: not-allowed; opacity: .58; }
.content-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 52px; }
.content-card { min-width: 0; padding: 24px; border-radius: 16px; background: var(--color-surface); }
.content-card-number { display: grid; width: 34px; height: 34px; place-items: center; margin-bottom: 20px; border-radius: 10px; background: var(--color-primary-soft); color: var(--color-primary); font-size: var(--type-size-label); font-weight: var(--type-weight-bold); }
.content-card h2 { margin: 0 0 9px; font-size: var(--type-size-title-panel); }
.content-card p { margin: 0; color: var(--color-text-muted); font-size: var(--type-size-body-sm); line-height: var(--type-line-body); }
.content-status { display: flex; align-items: center; gap: 10px; margin-top: 38px; padding: 18px 20px; border-radius: 14px; background: var(--color-surface-raised); color: var(--color-text-muted); font-size: var(--type-size-body-sm); }
.content-status::before { content: ""; width: 9px; height: 9px; flex: 0 0 auto; border-radius: 50%; background: var(--color-warning); }
@media (max-width: 820px) { .content-grid { grid-template-columns: 1fr; } }
@media (max-width: 620px) { .content-page { padding-top: 48px; } .content-hero h1 { font-size: 2.5rem; } }