/* NBX-EVENT-003 · Northern Pulse */
.nbx-events-page{max-width:1240px;margin:0 auto;padding:clamp(30px,5vw,72px) 24px 90px;color:#F7F9FC}
.nbx-events-intro{margin-bottom:32px}
.nbx-events-eyebrow{display:block;color:#25D0E8;font-size:.76rem;font-weight:750;letter-spacing:.13em;margin-bottom:14px}
.nbx-events-intro h1{font-size:clamp(2.1rem,5vw,3.5rem);line-height:1.1;letter-spacing:-.035em;margin:0 0 12px;color:#F7F9FC}
.nbx-events-intro p{color:#C4CED9;font-size:1.08rem;margin:0}
.nbx-events-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.nbx-event-card{min-width:0;overflow:hidden;border-radius:20px;border:1px solid rgba(37,208,232,.18);background:#17202D;display:flex;flex-direction:column;box-shadow:0 16px 36px rgba(0,0,0,.14);transition:transform .2s,border-color .2s}
.nbx-event-card:hover{transform:translateY(-3px);border-color:rgba(37,208,232,.45)}
.nbx-event-card__media{height:205px;display:block;position:relative;background:linear-gradient(135deg,#101722,#18374a);overflow:hidden}
.nbx-event-card__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}
.nbx-event-card:hover .nbx-event-card__media img{transform:scale(1.04)}
.nbx-event-card__placeholder{height:100%;display:grid;place-items:center;font-size:3.5rem;color:#25D0E8}
.nbx-event-card__date{position:absolute;top:14px;left:14px;display:flex;flex-direction:column;align-items:center;min-width:62px;padding:8px 12px;border:1px solid rgba(255,255,255,.2);border-radius:12px;background:rgba(7,10,15,.85);backdrop-filter:blur(8px);color:#fff;text-transform:uppercase;line-height:1.2}
.nbx-event-card__date strong{font-size:1.55rem}
.nbx-event-card__date span{font-size:.73rem;letter-spacing:.09em}
.nbx-event-card__body{padding:23px;display:flex;flex:1;flex-direction:column;gap:10px}
.nbx-event-card__meta{display:flex;gap:8px 14px;flex-wrap:wrap;margin:0;color:#25D0E8;font-size:.82rem;font-weight:650}
.nbx-event-card h2{font-size:1.27rem;line-height:1.28;margin:0}
.nbx-event-card h2 a{color:#F7F9FC;text-decoration:none}
.nbx-event-card h2 a:hover,.nbx-event-card__more:hover{color:#70e6f4}
.nbx-event-card__venue{margin:0;color:#F7F9FC;font-size:.93rem}
.nbx-event-card__excerpt{margin:0;color:#C4CED9;font-size:.91rem;line-height:1.6}
.nbx-event-card__more{margin-top:auto;padding-top:12px;color:#25D0E8;text-decoration:none;font-weight:700;font-size:.92rem}
.nbx-events-empty{padding:44px 28px;border-radius:20px;border:1px solid rgba(37,208,232,.18);background:#17202D}
.nbx-events-empty h2{margin:0 0 10px;color:#F7F9FC}.nbx-events-empty p{margin:0;color:#C4CED9}
.nbx-events-pagination{margin-top:32px}.nbx-events-pagination ul{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;padding:0;list-style:none}
.nbx-events-pagination a,.nbx-events-pagination span{display:block;padding:9px 14px;border:1px solid rgba(37,208,232,.3);border-radius:10px;color:#F7F9FC;text-decoration:none}
.nbx-events-pagination .current{background:#25D0E8;color:#070A0F}
@media(max-width:950px){.nbx-events-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.nbx-events-page{padding:28px 16px 64px}.nbx-events-grid{grid-template-columns:1fr;gap:18px}.nbx-event-card__media{height:210px}}
@media(prefers-reduced-motion:reduce){.nbx-event-card,.nbx-event-card__media img{transition:none}}

/* ==========================================
   NBX-EVENT-004 – EVENTFILTER
   ========================================== */

.nbx-events-filters {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    align-items: end;
    gap: 18px;

    margin: 0 0 36px;
    padding: 24px;

    background: var(--nbx-surface);
    border: 1px solid var(--nbx-border);
    border-radius: var(--nbx-radius-lg);
}

.nbx-events-filters__field {
    display: flex;
    flex-direction: column;
    gap: 9px;
    min-width: 0;
}

.nbx-events-filters__field label {
    color: var(--nbx-text);
    font-size: 13px;
    font-weight: 700;
}

.nbx-events-filters__field select {
    width: 100%;
    min-height: 48px;
    padding: 11px 14px;

    background: var(--nbx-bg-secondary);
    border: 1px solid var(--nbx-border);
    border-radius: var(--nbx-radius-sm);

    color: var(--nbx-text);
    font: inherit;
    cursor: pointer;
}

.nbx-events-filters__field select:focus-visible {
    outline: 2px solid var(--nbx-cyan);
    outline-offset: 2px;
}

.nbx-events-filters__actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 9px;
}

.nbx-events-filters__actions .nbx-button {
    white-space: nowrap;
    cursor: pointer;
}

.nbx-events-filters__reset {
    color: var(--nbx-text-secondary);
    font-size: 12px;
    text-decoration: none;
}

.nbx-events-filters__reset:hover {
    color: var(--nbx-cyan);
}

@media (max-width: 900px) {
    .nbx-events-filters {
        grid-template-columns: 1fr 1fr;
    }

    .nbx-events-filters__actions {
        grid-column: 1 / -1;
        align-items: stretch;
    }
}

@media (max-width: 600px) {
    .nbx-events-filters {
        grid-template-columns: 1fr;
        padding: 18px;
        gap: 16px;
    }

    .nbx-events-filters__actions {
        grid-column: auto;
    }
}

/* ==========================================
   NBX-EVENT-004
   Filterbutton – Northern Pulse
   ========================================== */

.nbx-events-filters__actions button.nbx-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    min-height: 48px;
    padding: 13px 24px;

    appearance: none;
    -webkit-appearance: none;

    background: #25D0E8;
    border: 1px solid #25D0E8;
    border-radius: 12px;

    color: #070A0F;
    font-family: inherit;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;

    cursor: pointer;

    transition:
        background 0.2s ease,
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.nbx-events-filters__actions button.nbx-button:hover {
    background: #70E4F2;
    border-color: #70E4F2;
    color: #070A0F;

    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(37, 208, 232, 0.18);
}

.nbx-events-filters__actions button.nbx-button:focus-visible {
    outline: 3px solid #25D0E8;
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    .nbx-events-filters__actions button.nbx-button {
        transition: none;
    }
}