/* Clean existing card content styles to make room for Icon */
.category-card .card-content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: flex-end;
    pointer-events: none;
    /* Let tilt handle mouse */
}

/* Icon Styles */
.category-icon {
    font-size: 3.5rem;
    color: rgba(255, 255, 255, 0.2);
    margin-bottom: auto;
    /* Push to top */
    transition: all 0.4s ease;
    text-shadow: 0 0 20px rgba(255, 255, 255, 0.1);
}

.category-card:hover .category-icon {
    color: var(--card-color);
    transform: scale(1.1) translateY(-5px);
    text-shadow: 0 0 30px var(--card-color);
}

/* Adjust H2 and P for better layout */
.category-card h2 {
    margin-bottom: 0.5rem;
    /* Ensure existing styles don't conflict */
}

/* Ensure Spotlight Overlay is behind content */
.spotlight-overlay {
    z-index: 1 !important;
}

/* Mobile Tweaks */
@media (max-width: 768px) {
    .category-icon {
        font-size: 2.5rem;
        margin-bottom: 1rem;
        /* Always active on Mobile */
        color: var(--card-color);
        text-shadow: 0 0 15px var(--card-color);
        opacity: 0.9;
    }
}