:root {
    --rl-accent: #c000d7;
    --rl-accent-dark: #78008f;
    --rl-accent-bright: #e000e6;
    --rl-text-magenta: #e000e6;
    --rl-text-lilac: #a66bff;
    --rl-text-gradient: linear-gradient(to bottom right, var(--rl-text-magenta) 0%, var(--rl-text-magenta) 38%, #d82af0 70%, var(--rl-text-lilac) 100%);
}

.brand-logo {
    filter: none;
}

.nav-link.is-active,
.nav-link:hover {
    border-color: var(--rl-accent-bright);
    background: rgba(192, 0, 215, .14);
    color: #fff;
    box-shadow: 0 0 16px rgba(255, 0, 214, .08);
}

.hero::before {
    background: radial-gradient(circle, rgba(255, 0, 214, .28), transparent 64%);
}

.hero-kicker {
    color: var(--rl-text-magenta);
    background-image: var(--rl-text-gradient);
    background-repeat: no-repeat;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.field:focus,
input:focus,
textarea:focus {
    border-color: var(--rl-accent-bright);
    box-shadow: 0 0 0 3px rgba(255, 0, 214, .14);
}

.check input {
    accent-color: var(--rl-accent);
}

.btn:not(.btn-secondary) {
    border-color: var(--rl-accent-bright);
    background: linear-gradient(135deg, var(--rl-accent), var(--rl-accent-dark));
    box-shadow: 0 8px 22px rgba(255, 0, 214, .16);
}

.btn:not(.btn-secondary):hover {
    background: transparent;
    box-shadow: 0 0 20px rgba(255, 0, 214, .16);
}

.link-button {
    text-decoration-color: var(--rl-accent-bright);
}

.link-button:hover {
    color: var(--rl-text-magenta);
    background-image: var(--rl-text-gradient);
    background-repeat: no-repeat;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}