/* b4u-services.html — hero / banner */

#banner-section.b4u-hero.services-hero {
    background: linear-gradient(160deg, #ffffff 0%, #f5f3ff 32%, #ecfeff 68%, #f8fafc 100%);
}

#banner-section.b4u-hero.services-hero::before {
    background:
        radial-gradient(circle at 12% 38%, rgba(139, 92, 246, 0.16) 0%, transparent 42%),
        radial-gradient(circle at 88% 22%, rgba(6, 182, 212, 0.14) 0%, transparent 40%),
        radial-gradient(circle at 50% 92%, rgba(99, 102, 241, 0.1) 0%, transparent 38%);
}

#banner-section.b4u-hero.services-hero::after {
    background: radial-gradient(circle, rgba(139, 92, 246, 0.16) 0%, transparent 70%);
}

html.dark #banner-section.b4u-hero.services-hero {
    background: linear-gradient(160deg, #0f172a 0%, #1e1b4b 38%, #134e4a 72%, #0f172a 100%);
}

html.dark #banner-section.b4u-hero.services-hero::before {
    background:
        radial-gradient(circle at 12% 38%, rgba(139, 92, 246, 0.22) 0%, transparent 42%),
        radial-gradient(circle at 88% 22%, rgba(34, 211, 238, 0.16) 0%, transparent 40%),
        radial-gradient(circle at 50% 92%, rgba(99, 102, 241, 0.14) 0%, transparent 38%);
}

.b4u-hero .services-hero-badge {
    color: #6d28d9;
    background: rgba(139, 92, 246, 0.1);
    border-color: rgba(139, 92, 246, 0.28);
}

.b4u-hero .services-hero-badge::before {
    background: #8b5cf6;
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.35);
}

html.dark .b4u-hero .services-hero-badge {
    color: #c4b5fd;
    background: rgba(139, 92, 246, 0.15);
    border-color: rgba(167, 139, 250, 0.35);
}

.b4u-hero .services-hero-title {
    background: linear-gradient(135deg, #0f172a 0%, #6d28d9 42%, #0891b2 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

html.dark .b4u-hero .services-hero-title {
    background: linear-gradient(135deg, #f8fafc 0%, #c4b5fd 40%, #67e8f9 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.b4u-hero .hero-stat-value {
    color: #5b21b6;
}

html.dark .b4u-hero .hero-stat-value {
    color: #c4b5fd;
}