:root {
        --nex-orange: #FF5900;
        --nex-orange-light: #ff8b0d;
        --nex-dark: #121212;
        --discord-blurple: #5865F2;
    }

    body { font-family: 'Poppins', sans-serif; background-color: #fff; color: var(--nex-dark); overflow-x: hidden; }

    /* Hero Styling */
    .hero-title {
        font-size: clamp(2.5rem, 6vw, 4rem);
        font-weight: 800;
        background: linear-gradient(to right, var(--nex-orange), var(--nex-orange-light));
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        line-height: 1.1;
    }

    .btn-nex-orange {
        background: linear-gradient(45deg, var(--nex-orange), var(--nex-orange-light));
        color: white;
        border: none;
        padding: 12px 30px;
        border-radius: 50px;
        font-weight: 600;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .btn-nex-orange:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 20px rgba(255, 89, 0, 0.3);
        color: white;
    }

    /* Deezer Grid - Honeycomb Effect */
    .honeycomb-thumb {
        width: 100%;
        height: auto;
        border-radius: 15px; /* Vierkant met afgeronde hoeken, zoals gevraagd */
        transition: transform 0.3s ease;
        cursor: pointer;
    }

    .honeycomb-thumb:hover {
        transform: scale(0.95) rotate(3deg);
    }

    /* Nep/Lege afbeelding voor honeycomb effect */
    .honeycomb-empty {
        width: 100%;
        height: 100%;
        background: transparent;
    }

    /* Agenda Card Styling */
    .agenda-card {
        background: #F8F9FA;
        border-radius: 30px;
        border: none;
        overflow: hidden;
    }

    .date-box {
        transition: all 0.3s ease;
        border: 1px solid #dee2e6 !important;
    }

    .date-box.active {
        background: linear-gradient(45deg, var(--nex-orange), var(--nex-orange-light));
        border: none !important;
        color: white !important;
    }

    /* YouTube Thumbnail Fix - Geen zwarte balken */
    .yt-thumb-container {
        width: 100%;
        position: relative;
        overflow: hidden;
        border-radius: 20px;
        box-shadow: 0 10px 25px rgba(0,0,0,0.1);
    }

    .yt-thumb-img {
        width: 100%;
        height: 100%;
        object-fit: cover; 
    }

    /* Discord Card */
    .discord-card-fancy {
        background: var(--discord-blurple);
        color: white;
        border-radius: 40px;
        padding: 60px 40px;
        position: relative;
        overflow: hidden;
        margin-top: 80px;
    }

    .discord-bg-icon {
        position: absolute;
        right: -40px;
        bottom: -40px;
        font-size: 15rem;
        opacity: 0.1;
        transform: rotate(-15deg);
    }

    .hoverzoom{
        transition: 0.3s;
    }

    .hoverzoom:hover{
        transition: 0.3s;
        transform: scale(1.05);
    }