/* === Page Layout ===
 * Unified page wrapper and title — single replacement for all
 * app-specific *__container / *__container__sample classes.
 */

/* ── Page wrapper ────────────────────────────── */
.page {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: var(--spacing-lg);
}

/* ── Page title (h1) ─────────────────────────── */
.page__title {
    font-family: var(--font-primary);
    font-size: var(--text-3xl);
    font-weight: 700;
    color: var(--color-primary);
    line-height: var(--leading-tight);
    margin-bottom: var(--spacing-lg);
}

.page__title--sm {
    font-size: var(--text-2xl);
}

/* ── Page section heading (h2) ───────────────── */
.page__heading {
    font-family: var(--font-primary);
    font-size: var(--text-xl);
    font-weight: 600;
    color: var(--color-primary);
    line-height: var(--leading-normal);
    margin-bottom: var(--spacing-md);
}

/* ── Page description / lead text ────────────── */
.page__lead {
    font-family: var(--font-primary);
    font-size: var(--text-lg);
    color: var(--color-text-secondary);
    line-height: var(--leading-relaxed);
    margin-bottom: var(--spacing-lg);
}