/* ================================================
   PLACEMENT STATS SECTION – CLEAN EXTRACTED CSS
   ================================================ */

#placements {
    padding: 60px 0 !important;
    background: linear-gradient(180deg, #0c1440 0%, #10002b 100%) !important;
}

/* Card styling */
#placements .card-lite {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.18) !important;
    border-radius: 20px;
    padding: 25px 10px !important;
    transition: 0.3s ease;
    backdrop-filter: blur(8px);
    box-shadow: 0 0 12px rgba(255,255,255,0.05);
    text-align: center;
}

/* Hover effect */
#placements .card-lite:hover {
    transform: translateY(-6px);
    box-shadow: 
        0 0 25px rgba(138, 43, 255, 0.45),
        0 0 45px rgba(255, 0, 150, 0.35);
}

/* Numbers */
#placements h3 {
    font-size: 36px !important;
    font-weight: 800 !important;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
    color: #ffffff !important;
}

/* Labels */
#placements div {
    color: #d8dcff !important;
    font-size: 15px;
}

/* Counter animation */
.counter {
    opacity: 0;
    transform: translateY(10px);
    transition: 0.4s ease;
}

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