:root{
    --brand:#5b2b82;
    --brand2:#f4b740;
    --dark:#1b1b1b;
    --muted:#6c757d;
    --soft:#faf7ff;
}

body{
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    color: var(--dark);
}

a{ color: var(--brand); }
a:hover{ color:#461f64; }

.navbar{
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(0,0,0,.06);
}

.brand-badge{
    width: 42px; height: 42px;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--brand), #8a4fd1);
    display:flex; align-items:center; justify-content:center;
    color:#fff; font-weight:700;
}

.hero{
    background: radial-gradient(1200px circle at 20% 10%, rgba(91,43,130,.15), transparent 45%),
    radial-gradient(900px circle at 85% 15%, rgba(244,183,64,.22), transparent 35%),
    linear-gradient(180deg, #fff, var(--soft));
    padding: 72px 0 52px;
}

.hero h1{ font-weight:800; letter-spacing:-.02em; }
.hero p{ color: var(--muted); }

.section-title{
    font-weight: 800;
    letter-spacing: -.01em;
}

.card-soft{
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 18px;
    box-shadow: 0 10px 26px rgba(20, 0, 40, .06);
}

.pill{
    display:inline-block;
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(91,43,130,.08);
    color: var(--brand);
    font-weight: 600;
    font-size: .9rem;
}

.btn-brand{
    background: var(--brand);
    color:#fff;
    border: 0;
}
.btn-brand:hover{ background:#4a226c; color:#fff; }

.btn-outline-brand{
    border:1px solid rgba(91,43,130,.35);
    color: var(--brand);
}
.btn-outline-brand:hover{ background: rgba(91,43,130,.08); color: var(--brand); }

.footer{
    background: #0f0a16;
    color: rgba(255,255,255,.78);
}
.footer a{ color: rgba(255,255,255,.85); text-decoration:none; }
.footer a:hover{ color:#fff; }

.badge-soft{
    background: rgba(244,183,64,.2);
    color: #7a5200;
    border: 1px solid rgba(244,183,64,.35);
    font-weight: 600;
}

.blog-cover{
    height: 210px;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(91,43,130,.25), rgba(244,183,64,.25));
    border: 1px solid rgba(0,0,0,.06);
}

.reading-card{
    background: linear-gradient(135deg, rgba(91,43,130,.10), rgba(244,183,64,.10));
}

.form-control, .form-select{
    border-radius: 12px;
    border-color: rgba(0,0,0,.12);
}
.form-control:focus, .form-select:focus{
    border-color: rgba(91,43,130,.5);
    box-shadow: 0 0 0 .25rem rgba(91,43,130,.15);
}

.toast-container{ z-index: 1080; }