html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Plus Jakarta Sans', sans-serif;
    background:
        radial-gradient(circle at 10% 10%, rgba(139, 92, 246, 0.22), transparent 30%),
        radial-gradient(circle at 85% 15%, rgba(255, 77, 140, 0.18), transparent 28%),
        radial-gradient(circle at 40% 88%, rgba(255, 138, 76, 0.14), transparent 30%),
        #050505;
}

.glass-card {
    background: linear-gradient(140deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.02));
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 20px 80px rgba(0, 0, 0, 0.45);
}

.text-gradient {
    background: linear-gradient(135deg, #FF4D8C 0%, #FF8A4C 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.content-card {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 16px 50px rgba(0, 0, 0, 0.28);
    transition: transform .35s ease, border-color .35s ease, background .35s ease;
}

.content-card:hover {
    transform: translateY(-4px);
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.04);
}

.hero-shell {
    background:
        linear-gradient(160deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.01) 40%),
        rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.13);
    box-shadow: 0 35px 120px rgba(0, 0, 0, 0.5);
}

.hero-badge {
    background: linear-gradient(90deg, rgba(255, 77, 140, 0.15), rgba(139, 92, 246, 0.15));
    border: 1px solid rgba(255, 255, 255, 0.14);
}

.stat-chip {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(8px);
}

.reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s ease, transform .7s ease;
}

.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

.section-title::after {
    content: '';
    display: block;
    margin-top: 12px;
    width: 72px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, #FF4D8C, #FF8A4C);
}

.eq-bar {
    width: 5px;
    border-radius: 999px;
    background: linear-gradient(180deg, #FF4D8C, #FF8A4C);
    animation: equalize 1.2s ease-in-out infinite;
}

.eq-bar:nth-child(2) {
    animation-delay: .15s;
}

.eq-bar:nth-child(3) {
    animation-delay: .3s;
}

.eq-bar:nth-child(4) {
    animation-delay: .45s;
}

@keyframes equalize {
    0%,
    100% {
        height: 14px;
        opacity: .6;
    }

    50% {
        height: 34px;
        opacity: 1;
    }
}

.tilt-wrap {
    perspective: 1100px;
}

.tilt-card {
    transform-style: preserve-3d;
    will-change: transform;
    transition: transform .22s ease;
}