:root {
    --brand-primary: #DC143C;
    --brand-primary-dark: #B21030;
    --brand-ink: #121923;
    --brand-ink-soft: #334155;
    --brand-surface: #f8fafc;
    --brand-border: #e2e8f0;
}

::selection {
    background: rgba(220, 20, 60, 0.18);
    color: var(--brand-ink);
}

a {
    color: var(--brand-primary);
}

a:hover {
    color: var(--brand-primary-dark);
}

.brand-btn {
    background-color: var(--brand-primary);
    color: #ffffff;
    transition: background-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
    box-shadow: 0 10px 24px rgba(220, 20, 60, 0.2);
}

.brand-btn:hover {
    background-color: var(--brand-primary-dark);
    color: #ffffff;
}

.brand-btn:active {
    transform: translateY(1px);
}

.brand-outline-btn {
    border: 1px solid rgba(220, 20, 60, 0.35);
    color: var(--brand-primary);
    background-color: rgba(220, 20, 60, 0.05);
    transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

.brand-outline-btn:hover {
    background-color: rgba(220, 20, 60, 0.1);
    border-color: rgba(220, 20, 60, 0.6);
    color: var(--brand-primary-dark);
}

.brand-badge {
    background-color: rgba(220, 20, 60, 0.1);
    color: var(--brand-primary-dark);
    border: 1px solid rgba(220, 20, 60, 0.3);
}