/**
 * RSite — Roadmap Page  v1.0
 * Depends on: base.css (variables, glass-card)
 *
 * Development phases with status badges.
 */

.roadmap-grid {
    display: grid;
    gap: var(--space-lg);
}

.phase-badge {
    display: inline-block;
    padding: 4px 14px;
    border-radius: var(--radius-sm);
    font-weight: 700;
    font-size: 0.8em;
    letter-spacing: 1px;
}

.phase-badge.completed {
    background: linear-gradient(135deg, var(--gold-accent), var(--gold-dark));
    color: var(--bg-dark);
}

.phase-badge.in-progress {
    background: rgba(212, 175, 55, 0.15);
    color: var(--gold-accent);
    border: 1px solid rgba(212, 175, 55, 0.3);
}

.phase-badge.planned {
    background: rgba(255, 255, 255, 0.04);
    color: var(--text-muted);
    border: 1px solid rgba(255, 255, 255, 0.06);
}

.phase-card {
    padding: var(--space-xl);
    border-left: 4px solid var(--gold-accent);
    transition: border-color var(--duration-normal) ease;
}

.phase-card.planned {
    border-left-color: rgba(255, 255, 255, 0.1);
}

.phase-card:hover {
    border-left-color: var(--gold-light);
}

.phase-header {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    margin-bottom: var(--space-md);
}

.phase-title {
    color: var(--gold-accent);
    font-family: var(--font-heading);
    font-size: 1.2em;
    margin: 0;
}

.phase-card.planned .phase-title {
    color: var(--text-primary);
}

.phase-list {
    padding-left: 20px;
    line-height: 1.9;
}

.phase-list li {
    color: var(--text-secondary);
}