/* ================================
   HEADER COMPONENT
   ================================ */

.home-hero {
    text-align: center;
    margin-bottom: var(--space-12);
}

.home-hero h1 {
    font-size: var(--font-size-4xl);
    font-weight: 700;
    margin-bottom: var(--space-4);
    letter-spacing: var(--letter-spacing-tight);
}

.home-hero p {
    font-size: var(--font-size-lg);
    color: var(--color-text-muted);
    margin-bottom: 0;
    font-weight: 400;
    max-width: var(--max-width-narrow);
    margin-left: auto;
    margin-right: auto;
}

.page-header {
    margin-bottom: var(--space-12);
    text-align: center;
}

.page-title {
    font-size: var(--font-size-4xl);
    font-weight: 700;
    margin-bottom: var(--space-4);
    letter-spacing: var(--letter-spacing-tight);
}

.page-subtitle {
    font-size: var(--font-size-lg);
    color: var(--color-text-muted);
    margin-bottom: 0;
    font-weight: 400;
    max-width: var(--max-width-narrow);
    margin-left: auto;
    margin-right: auto;
}