/* =====================================================
   EVENTS PAGE
   Matches the existing association website style
   ===================================================== */

:root {
    --event-blue:
        var(--bs-primary, #0d6efd);

    --event-green:
        var(--primary-green, #0f8f83);

    --event-green-dark:
        #08776f;

    --event-heading:
        #101828;

    --event-text:
        #526174;

    --event-border:
        rgba(13, 110, 253, 0.12);

    --event-surface:
        #ffffff;

    --event-background:
        #f6f9fc;
}


/* =====================================================
   HERO
   ===================================================== */

.event-page-hero {
    position: relative;

    min-height: 335px !important;
    padding: 72px 0 !important;

    display: flex;
    align-items: center;

    overflow: hidden;

    background-image: none !important;

    background:
        radial-gradient(
            circle at 85% 20%,
            rgba(15, 143, 131, 0.15),
            transparent 28%
        ),
        radial-gradient(
            circle at 10% 90%,
            rgba(13, 110, 253, 0.11),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #f2f8ff,
            #f3fbf9
        ) !important;
}

.event-page-hero::before {
    content: "";

    position: absolute;
    top: -150px;
    right: -100px;

    width: 350px;
    height: 350px;

    border: 55px solid
        rgba(15, 143, 131, 0.055);

    border-radius: 50%;

    background: transparent !important;
}

.event-page-hero::after {
    content: "";

    position: absolute;
    bottom: -170px;
    left: -130px;

    width: 370px;
    height: 370px;

    border-radius: 50%;

    background:
        rgba(13, 110, 253, 0.035);
}

.event-page-hero .container {
    position: relative;
    z-index: 2;
}

.event-page-hero .page-hero-content {
    max-width: 820px;
}

.event-page-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    margin-bottom: 18px;
    padding: 8px 14px;

    border:
        1px solid
        rgba(15, 143, 131, 0.18);

    border-radius: 999px;

    background:
        rgba(15, 143, 131, 0.08);

    color: var(--event-green-dark);

    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.event-page-hero
.page-hero-content h1 {
    max-width: 780px;

    margin: 0 0 17px !important;

    color: var(--event-heading) !important;

    font-size:
        clamp(36px, 5vw, 58px);

    font-weight: 850;
    line-height: 1.08;
}

.event-page-hero
.page-hero-content p {
    max-width: 740px;

    margin: 0 !important;

    color: var(--event-text) !important;

    font-size: 17px;
    line-height: 1.7;
}


/* =====================================================
   PAGE AND SECTIONS
   ===================================================== */

.association-events-page {
    background: var(--event-background);
}

.association-events-section {
    padding: 68px 0;
}

.ongoing-events-section {
    background:
        linear-gradient(
            135deg,
            rgba(15, 143, 131, 0.055),
            rgba(255, 255, 255, 0.85)
        );
}

.upcoming-events-section {
    background:
        linear-gradient(
            145deg,
            #ffffff,
            rgba(13, 110, 253, 0.035)
        );
}

.completed-events-section {
    background:
        linear-gradient(
            135deg,
            #f4f8fb,
            #f2f8ff,
            #f4fbf8
        );
}


/* =====================================================
   SECTION HEADINGS
   ===================================================== */

.association-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;

    margin-bottom: 32px;
}

.association-section-kicker {
    display: block;

    margin-bottom: 7px;

    color: var(--event-blue);

    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.association-section-kicker.ongoing {
    color: var(--event-green);
}

.association-section-kicker.completed {
    color: var(--event-green-dark);
}

.association-section-heading h2 {
    margin: 0 0 8px;

    color: var(--event-heading);

    font-size:
        clamp(29px, 4vw, 39px);

    font-weight: 850;
    line-height: 1.15;
}

.association-section-heading p {
    max-width: 680px;

    margin: 0;

    color: var(--event-text);

    font-size: 15px;
    line-height: 1.65;
}

.association-section-count {
    width: 46px;
    height: 46px;

    flex-shrink: 0;

    display: grid;
    place-items: center;

    border:
        1px solid
        rgba(13, 110, 253, 0.14);

    border-radius: 14px;

    background: #ffffff;

    color: var(--event-blue);

    box-shadow:
        0 8px 22px
        rgba(15, 23, 42, 0.055);

    font-weight: 850;
}


/* =====================================================
   EVENT GRID
   ===================================================== */

.association-events-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    align-items: stretch;

    gap: 25px;
}

.association-events-count-1 {
    grid-template-columns:
        minmax(0, 410px);

    justify-content: center;
}

.association-events-count-2 {
    grid-template-columns:
        repeat(2, minmax(0, 410px));

    justify-content: center;
}


/* =====================================================
   EVENT CARD
   ===================================================== */

.association-event-card {
    min-width: 0;
    overflow: hidden;

    display: flex;
    flex-direction: column;

    border:
        1px solid
        var(--event-border);

    border-radius: 22px;

    background: var(--event-surface);

    box-shadow:
        0 13px 34px
        rgba(15, 23, 42, 0.07);

    transition:
        transform 0.32s
        cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.32s ease,
        border-color 0.32s ease;
}

.association-event-card:hover {
    transform: translateY(-6px);

    border-color:
        rgba(13, 110, 253, 0.25);

    box-shadow:
        0 21px 48px
        rgba(15, 23, 42, 0.115);
}

.ongoing-events-section
.association-event-card {
    border-color:
        rgba(15, 143, 131, 0.20);
}


/* Image */

.association-event-image {
    position: relative;

    height: 218px;

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            var(--event-green),
            #14b8a6
        );
}

.association-event-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform 0.55s
        cubic-bezier(0.22, 1, 0.36, 1);
}

.association-event-card:hover
.association-event-image img {
    transform: scale(1.04);
}

.association-event-placeholder {
    width: 100%;
    height: 100%;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;

    color: #ffffff;

    font-size: 13px;
    font-weight: 750;
}

.association-event-placeholder i {
    font-size: 47px;

    transition:
        transform 0.35s ease;
}

.association-event-card:hover
.association-event-placeholder i {
    transform:
        translateY(-3px)
        scale(1.05);
}


/* Status */

.association-event-status-row {
    position: absolute;
    z-index: 2;

    top: 14px;
    left: 14px;
    right: 14px;

    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}

.association-event-status,
.association-event-external {
    min-height: 29px;

    display: inline-flex;
    align-items: center;
    gap: 7px;

    padding: 6px 10px;

    border-radius: 999px;

    color: #ffffff;

    box-shadow:
        0 7px 18px
        rgba(15, 23, 42, 0.15);

    font-size: 11px;
    font-weight: 800;
    line-height: 1;

    backdrop-filter: blur(8px);
}

.association-event-status {
    background:
        rgba(13, 110, 253, 0.94);
}

.association-event-status.ongoing {
    background:
        rgba(15, 143, 131, 0.95);
}

.association-event-status.ongoing i {
    font-size: 7px;

    animation:
        association-event-pulse
        1.8s ease-in-out infinite;
}

.association-event-external {
    background:
        rgba(16, 24, 40, 0.78);
}


/* Date */

.association-event-date {
    position: absolute;
    z-index: 2;

    right: 14px;
    bottom: 14px;

    width: 57px;
    height: 62px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border-radius: 15px;

    background:
        rgba(255, 255, 255, 0.95);

    box-shadow:
        0 8px 20px
        rgba(15, 23, 42, 0.13);
}

.association-event-date strong {
    color: var(--event-heading);

    font-size: 21px;
    line-height: 1;
}

.association-event-date span {
    margin-top: 4px;

    color: var(--event-blue);

    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.07em;
}


/* Card body */

.association-event-body {
    flex: 1;

    display: flex;
    flex-direction: column;

    padding: 22px;
}

.association-event-category {
    display: inline-flex;
    align-items: center;

    width: fit-content;

    padding: 6px 10px;

    border:
        1px solid
        rgba(13, 110, 253, 0.08);

    border-radius: 999px;

    background:
        rgba(13, 110, 253, 0.075);

    color: var(--event-blue);

    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.association-event-body h3 {
    min-height: 52px;

    margin: 13px 0 14px;

    color: var(--event-heading);

    font-size: 20px;
    font-weight: 850;
    line-height: 1.3;

    display: -webkit-box;
    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
}


/* Information */

.association-event-information {
    display: grid;
    gap: 8px;
}

.association-event-information > div {
    display: grid;

    grid-template-columns:
        18px minmax(0, 1fr);

    align-items: start;
    gap: 8px;

    padding: 8px 9px;

    border-radius: 10px;

    background:
        rgba(13, 110, 253, 0.035);

    color: var(--event-text);

    font-size: 12px;
    line-height: 1.45;
}

.ongoing-events-section
.association-event-information > div {
    background:
        rgba(15, 143, 131, 0.045);
}

.association-event-information i {
    margin-top: 3px;

    color: var(--event-blue);

    text-align: center;
}

.ongoing-events-section
.association-event-information i {
    color: var(--event-green);
}

.association-event-description {
    min-height: 61px;

    margin: 15px 0 19px;

    color: var(--event-text);

    font-size: 13px;
    line-height: 1.6;

    display: -webkit-box;
    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
}


/* Actions */

.association-event-actions {
    margin-top: auto;

    display: grid;

    grid-template-columns:
        minmax(0, 0.78fr)
        minmax(0, 1.22fr);

    gap: 9px;
}

.event-registration-form {
    width: 100%;
    margin: 0;
}

.association-event-button {
    width: 100%;
    min-height: 43px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    padding: 10px 13px;

    border:
        1px solid transparent;

    border-radius: 11px;

    font: inherit;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;

    text-decoration: none;
    text-align: center;

    cursor: pointer;

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

.association-event-button.details {
    border-color:
        rgba(13, 110, 253, 0.18);

    background:
        rgba(13, 110, 253, 0.045);

    color: var(--event-blue);
}

.association-event-button.details:hover {
    transform: translateY(-1px);

    background:
        rgba(13, 110, 253, 0.10);

    color: var(--event-blue);
}

.association-event-button.register {
    position: relative;
    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            var(--event-blue),
            #347ff0
        );

    color: #ffffff;

    box-shadow:
        0 8px 18px
        rgba(13, 110, 253, 0.17);
}

.ongoing-events-section
.association-event-button.register {
    background:
        linear-gradient(
            135deg,
            var(--event-green),
            var(--event-blue)
        );
}

.association-event-button.register:hover {
    transform: translateY(-1px);

    color: #ffffff;

    box-shadow:
        0 11px 23px
        rgba(13, 110, 253, 0.22);
}

.association-event-button.register i {
    transition:
        transform 0.2s ease;
}

.association-event-button.register:hover i {
    transform: translateX(3px);
}

.association-event-button.closed {
    border-color: #d8dee6;

    background: #eef1f4;

    color: #697382;

    cursor: not-allowed;
}


/* =====================================================
   FEATURED EVENT
   ===================================================== */

.featured-events-section {
    padding-top: 52px;

    background: #ffffff;
}

.association-featured-event {
    display: grid;

    grid-template-columns:
        minmax(300px, 0.92fr)
        minmax(0, 1.08fr);

    overflow: hidden;

    border:
        1px solid
        rgba(13, 110, 253, 0.14);

    border-radius: 27px;

    background:
        linear-gradient(
            135deg,
            rgba(13, 110, 253, 0.065),
            rgba(15, 143, 131, 0.055),
            #ffffff
        );

    box-shadow:
        0 17px 45px
        rgba(15, 23, 42, 0.08);
}

.association-featured-image {
    min-height: 390px;

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            var(--event-green),
            var(--event-blue)
        );
}

.association-featured-image img {
    width: 100%;
    height: 100%;

    min-height: 390px;

    display: block;

    object-fit: cover;

    transition:
        transform 0.55s ease;
}

.association-featured-event:hover
.association-featured-image img {
    transform: scale(1.03);
}

.association-featured-placeholder {
    width: 100%;
    height: 100%;
    min-height: 390px;

    display: grid;
    place-items: center;

    color: rgba(255, 255, 255, 0.85);

    font-size: 68px;
}

.association-featured-content {
    padding:
        clamp(30px, 5vw, 52px);

    display: flex;
    flex-direction: column;
    justify-content: center;
}

.association-featured-labels {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;

    margin-bottom: 17px;
}

.association-featured-label {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    padding: 7px 11px;

    border-radius: 999px;

    background:
        rgba(245, 158, 11, 0.14);

    color: #8a5b00;

    font-size: 11px;
    font-weight: 850;
}

.association-featured-content h2 {
    margin: 13px 0 14px;

    color: var(--event-heading);

    font-size:
        clamp(29px, 4vw, 43px);

    font-weight: 850;
    line-height: 1.14;
}

.association-featured-content > p {
    margin: 0;

    color: var(--event-text);

    font-size: 15px;
    line-height: 1.7;
}

.association-featured-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;

    margin-top: 23px;

    color: var(--event-text);

    font-size: 13px;
    font-weight: 650;
}

.association-featured-meta span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.association-featured-meta i {
    color: var(--event-blue);
}

.association-featured-action {
    max-width: 220px;

    margin-top: 27px;
}


/* =====================================================
   PAST EVENTS
   ===================================================== */

.association-past-events-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 20px;
}

.association-past-event-card {
    min-width: 0;

    display: grid;

    grid-template-columns:
        45px minmax(0, 1fr);

    align-items: start;
    gap: 15px;

    padding: 21px;

    border:
        1px solid
        rgba(13, 110, 253, 0.11);

    border-radius: 18px;

    background: #ffffff;

    box-shadow:
        0 10px 27px
        rgba(15, 23, 42, 0.05);

    transition:
        transform 0.28s ease,
        box-shadow 0.28s ease;
}

.association-past-event-card:hover {
    transform: translateY(-4px);

    box-shadow:
        0 16px 36px
        rgba(15, 23, 42, 0.085);
}

.association-past-event-icon {
    width: 45px;
    height: 45px;

    display: grid;
    place-items: center;

    border-radius: 13px;

    background:
        rgba(15, 143, 131, 0.10);

    color: var(--event-green);

    font-size: 16px;
}

.association-past-event-labels {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;

    margin-bottom: 10px;
}

.association-completed-label {
    flex-shrink: 0;

    padding: 5px 8px;

    border-radius: 999px;

    background:
        rgba(15, 143, 131, 0.075);

    color: var(--event-green-dark);

    font-size: 10px;
    font-weight: 800;
}

.association-past-event-content h3 {
    margin: 0 0 8px;

    color: var(--event-heading);

    font-size: 17px;
    font-weight: 850;
    line-height: 1.35;
}

.association-past-event-content p {
    min-height: 41px;

    margin: 0;

    color: var(--event-text);

    font-size: 12px;
    line-height: 1.55;

    display: -webkit-box;
    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
}

.association-past-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;

    margin-top: 12px;

    color: var(--event-text);

    font-size: 11px;
    font-weight: 650;
}

.association-past-meta span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.association-past-meta i {
    color: var(--event-blue);
}


/* =====================================================
   EMPTY STATE
   ===================================================== */

.association-events-empty {
    padding: 50px 22px;

    border:
        1px dashed
        rgba(13, 110, 253, 0.20);

    border-radius: 21px;

    background:
        rgba(255, 255, 255, 0.72);

    text-align: center;
}

.association-events-empty i {
    margin-bottom: 15px;

    color:
        rgba(13, 110, 253, 0.55);

    font-size: 39px;
}

.association-events-empty h3 {
    margin: 0 0 7px;

    color: var(--event-heading);

    font-size: 20px;
    font-weight: 850;
}

.association-events-empty p {
    max-width: 510px;

    margin: 0 auto;

    color: var(--event-text);

    font-size: 14px;
    line-height: 1.6;
}


/* =====================================================
   MODAL
   ===================================================== */

.association-event-modal {
    overflow: hidden;

    border: 0;
    border-radius: 22px;
}

.association-event-modal
.modal-header,
.association-event-modal
.modal-footer {
    padding: 21px 24px;

    border-color: #e7ebf0;
}

.association-event-modal
.modal-header {
    align-items: flex-start;
}

.association-event-modal
.modal-title {
    margin-top: 9px;

    color: var(--event-heading);

    font-size: 23px;
    font-weight: 850;
}

.association-event-modal
.modal-body {
    padding: 24px;
}

.association-event-modal-image {
    height: 290px;

    overflow: hidden;

    margin-bottom: 22px;

    border-radius: 17px;
}

.association-event-modal-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
}

.association-event-modal-description {
    color: var(--event-text);

    line-height: 1.7;
}

.association-event-modal-grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 13px;

    margin-top: 20px;
}

.association-event-modal-grid > div {
    display: grid;

    grid-template-columns:
        22px minmax(0, 1fr);

    gap: 9px;

    padding: 14px;

    border-radius: 13px;

    background: #f4f7fa;

    color: var(--event-text);

    font-size: 12px;
}

.association-event-modal-grid i {
    margin-top: 3px;

    color: var(--event-blue);
}

.association-event-modal-grid strong {
    display: block;

    margin-bottom: 3px;

    color: var(--event-heading);
}


/* =====================================================
   ANIMATION
   ===================================================== */

@keyframes association-event-pulse {

    0%,
    100% {
        opacity: 0.5;
        transform: scale(0.88);
    }

    50% {
        opacity: 1;
        transform: scale(1.18);
    }
}


/* =====================================================
   RESPONSIVE
   ===================================================== */

@media (max-width: 991.98px) {

    .association-events-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .association-events-count-1 {
        grid-template-columns:
            minmax(0, 410px);
    }

    .association-featured-event {
        grid-template-columns: 1fr;
    }

    .association-featured-image,
    .association-featured-image img,
    .association-featured-placeholder {
        min-height: 310px;
    }

    .association-past-events-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {

    .event-page-hero {
        min-height: 300px !important;
        padding: 55px 0 !important;
    }

    .event-page-hero
    .page-hero-content h1 {
        font-size: 37px;
    }

    .association-events-section {
        padding: 53px 0;
    }

    .association-section-heading {
        align-items: flex-start;
    }

    .association-events-grid,
    .association-events-count-1,
    .association-events-count-2 {
        grid-template-columns: 1fr;
    }

    .association-event-image {
        height: 230px;
    }

    .association-past-events-grid {
        grid-template-columns: 1fr;
    }

    .association-event-modal-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {

    .event-page-hero
    .page-hero-content h1 {
        font-size: 32px;
    }

    .event-page-hero
    .page-hero-content p {
        font-size: 15px;
    }

    .association-section-heading {
        gap: 15px;
    }

    .association-section-count {
        width: 41px;
        height: 41px;
    }

    .association-event-card {
        border-radius: 19px;
    }

    .association-event-body {
        padding: 19px;
    }

    .association-event-actions {
        grid-template-columns: 1fr;
    }

    .association-featured-content {
        padding: 25px 20px;
    }

    .association-featured-image,
    .association-featured-image img,
    .association-featured-placeholder {
        min-height: 245px;
    }

    .association-past-event-card {
        grid-template-columns:
            41px minmax(0, 1fr);

        padding: 17px;
    }

    .association-past-event-icon {
        width: 41px;
        height: 41px;
    }

    .association-past-event-labels {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {

    .association-event-card,
    .association-event-image img,
    .association-event-placeholder i,
    .association-past-event-card {
        transform: none !important;
        transition: none !important;
    }

    .association-event-status.ongoing i {
        animation: none !important;
    }
}


/* =====================================================
   EVENTS PAGE V6
   DARK HERO + PREMIUM UPCOMING EVENT LAYOUT
   ===================================================== */


/* =====================================================
   DARK GOVERNMENT-STYLE HERO
   ===================================================== */

.event-page-hero {
    position: relative;

    min-height: 360px !important;
    padding: 76px 0 !important;

    display: flex;
    align-items: center;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 86% 18%,
            rgba(45, 212, 191, 0.20),
            transparent 27%
        ),
        radial-gradient(
            circle at 12% 95%,
            rgba(59, 130, 246, 0.22),
            transparent 34%
        ),
        linear-gradient(
            125deg,
            #071827 0%,
            #092c3b 48%,
            #075e59 100%
        ) !important;
}

.event-page-hero::before {
    content: "";

    position: absolute;
    top: -165px;
    right: -105px;

    width: 395px;
    height: 395px;

    border: 58px solid
        rgba(255, 255, 255, 0.045);

    border-radius: 50%;

    background: transparent !important;

    pointer-events: none;
}

.event-page-hero::after {
    content: "";

    position: absolute;
    bottom: -190px;
    left: -145px;

    width: 410px;
    height: 410px;

    border-radius: 50%;

    background:
        rgba(59, 130, 246, 0.08);

    pointer-events: none;
}

.event-page-hero .page-hero-content {
    position: relative;
    z-index: 2;

    max-width: 890px;
}

.event-page-badge {
    margin-bottom: 21px;

    border-color:
        rgba(153, 246, 228, 0.26);

    background:
        rgba(255, 255, 255, 0.08);

    color: #a7f3e8;

    box-shadow:
        inset 0 0 0 1px
        rgba(255, 255, 255, 0.025);

    backdrop-filter: blur(8px);
}

.event-page-hero
.page-hero-content h1 {
    max-width: 850px;

    color: #ffffff !important;

    font-size:
        clamp(40px, 5.2vw, 64px);

    font-weight: 850;
    line-height: 1.07;

    text-shadow:
        0 12px 34px
        rgba(0, 0, 0, 0.17);
}

.event-page-hero
.page-hero-content p {
    max-width: 760px;

    color:
        rgba(255, 255, 255, 0.76) !important;

    font-size: 17px;
    line-height: 1.75;
}


/* =====================================================
   PROFESSIONAL SECTION HEADINGS
   ===================================================== */

.association-section-heading {
    position: relative;

    align-items: center;

    padding: 24px 27px;
    margin-bottom: 34px;

    overflow: hidden;

    border:
        1px solid
        rgba(13, 110, 253, 0.10);

    border-radius: 20px;

    background:
        rgba(255, 255, 255, 0.92);

    box-shadow:
        0 12px 34px
        rgba(15, 23, 42, 0.055);
}

.association-section-heading::before {
    content: "";

    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;

    width: 5px;

    background:
        linear-gradient(
            180deg,
            var(--event-blue),
            var(--event-green)
        );
}

.ongoing-events-section
.association-section-heading::before {
    background:
        linear-gradient(
            180deg,
            var(--event-green),
            var(--event-blue)
        );
}

.association-section-heading::after {
    content: "";

    position: absolute;
    top: -55px;
    right: -55px;

    width: 145px;
    height: 145px;

    border-radius: 50%;

    background:
        rgba(13, 110, 253, 0.035);

    pointer-events: none;
}

.ongoing-events-section
.association-section-heading::after {
    background:
        rgba(15, 143, 131, 0.05);
}

.association-section-heading > * {
    position: relative;
    z-index: 2;
}


/* =====================================================
   PREMIUM UPCOMING LAYOUT
   ONE OR TWO EVENTS ONLY
   ===================================================== */

.upcoming-events-section
.association-events-count-1,
.upcoming-events-section
.association-events-count-2 {
    max-width: 1120px;

    margin-right: auto;
    margin-left: auto;

    grid-template-columns:
        minmax(0, 1fr);

    gap: 26px;
}

.upcoming-events-section
.association-events-count-1
.association-event-card,
.upcoming-events-section
.association-events-count-2
.association-event-card {
    position: relative;

    min-height: 365px;

    display: grid;

    grid-template-columns:
        minmax(330px, 43%)
        minmax(0, 57%);

    overflow: hidden;

    border:
        1px solid
        rgba(13, 110, 253, 0.17);

    border-radius: 28px;

    background:
        linear-gradient(
            135deg,
            #ffffff,
            rgba(13, 110, 253, 0.035),
            rgba(15, 143, 131, 0.025)
        );

    box-shadow:
        0 19px 48px
        rgba(15, 23, 42, 0.09);
}

.upcoming-events-section
.association-events-count-1
.association-event-card::before,
.upcoming-events-section
.association-events-count-2
.association-event-card::before {
    content: "";

    position: absolute;
    z-index: 5;

    top: 0;
    right: 0;
    left: 0;

    height: 5px;

    background:
        linear-gradient(
            90deg,
            var(--event-blue),
            var(--event-green),
            var(--event-blue)
        );

    background-size: 200% 100%;

    animation:
        premium-event-accent
        8s linear infinite;

    pointer-events: none;
}

.upcoming-events-section
.association-events-count-1
.association-event-image,
.upcoming-events-section
.association-events-count-2
.association-event-image {
    width: 100%;
    height: 100%;
    min-height: 365px;
}

.upcoming-events-section
.association-events-count-1
.association-event-body,
.upcoming-events-section
.association-events-count-2
.association-event-body {
    padding: 31px 32px;
}

.upcoming-events-section
.association-events-count-1
.association-event-body h3,
.upcoming-events-section
.association-events-count-2
.association-event-body h3 {
    min-height: auto;

    margin-top: 15px;
    margin-bottom: 17px;

    font-size: 27px;
    line-height: 1.22;
}

.upcoming-events-section
.association-events-count-1
.association-event-information,
.upcoming-events-section
.association-events-count-2
.association-event-information {
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.upcoming-events-section
.association-events-count-1
.association-event-information > div,
.upcoming-events-section
.association-events-count-2
.association-event-information > div {
    min-height: 48px;

    padding: 10px 11px;

    align-content: center;
}

.upcoming-events-section
.association-events-count-1
.association-event-description,
.upcoming-events-section
.association-events-count-2
.association-event-description {
    min-height: 47px;

    margin-top: 18px;

    font-size: 14px;
    line-height: 1.65;

    -webkit-line-clamp: 2;
    line-clamp: 2;
}

.upcoming-events-section
.association-events-count-1
.association-event-actions,
.upcoming-events-section
.association-events-count-2
.association-event-actions {
    max-width: 455px;

    grid-template-columns:
        minmax(140px, 0.8fr)
        minmax(190px, 1.2fr);
}


/* =====================================================
   PREMIUM CARD COLOUR DETAILS
   ===================================================== */

.upcoming-events-section
.association-events-count-1
.association-event-image::after,
.upcoming-events-section
.association-events-count-2
.association-event-image::after {
    content: "";

    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(7, 24, 39, 0.02),
            transparent 55%,
            rgba(7, 24, 39, 0.20)
        );

    pointer-events: none;
}

.upcoming-events-section
.association-event-category {
    background:
        linear-gradient(
            135deg,
            rgba(13, 110, 253, 0.11),
            rgba(15, 143, 131, 0.07)
        );
}

.upcoming-events-section
.association-event-button.register {
    background:
        linear-gradient(
            135deg,
            var(--event-blue),
            var(--event-green)
        );

    box-shadow:
        0 10px 23px
        rgba(13, 110, 253, 0.19);
}

.upcoming-events-section
.association-event-button.register:hover {
    box-shadow:
        0 14px 29px
        rgba(13, 110, 253, 0.25);
}


/* =====================================================
   INNER CARD ANIMATION ONLY
   ===================================================== */

.upcoming-events-section
.association-events-count-1
.association-event-image img,
.upcoming-events-section
.association-events-count-2
.association-event-image img {
    animation:
        premium-event-image-entry
        0.65s
        cubic-bezier(0.22, 1, 0.36, 1)
        both;
}

.upcoming-events-section
.association-events-count-1
.association-event-body > *,
.upcoming-events-section
.association-events-count-2
.association-event-body > * {
    animation:
        premium-event-content-entry
        0.48s ease both;
}

.upcoming-events-section
.association-event-body > *:nth-child(2) {
    animation-delay: 40ms;
}

.upcoming-events-section
.association-event-body > *:nth-child(3) {
    animation-delay: 75ms;
}

.upcoming-events-section
.association-event-body > *:nth-child(4) {
    animation-delay: 110ms;
}

.upcoming-events-section
.association-event-body > *:nth-child(5) {
    animation-delay: 145ms;
}

@keyframes premium-event-accent {

    from {
        background-position: 0% 50%;
    }

    to {
        background-position: 200% 50%;
    }
}

@keyframes premium-event-image-entry {

    from {
        transform: scale(1.025);
    }

    to {
        transform: scale(1);
    }
}

@keyframes premium-event-content-entry {

    from {
        opacity: 0.86;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* =====================================================
   RESPONSIVE PREMIUM UPCOMING CARD
   ===================================================== */

@media (max-width: 991.98px) {

    .upcoming-events-section
    .association-events-count-1
    .association-event-card,
    .upcoming-events-section
    .association-events-count-2
    .association-event-card {
        grid-template-columns: 1fr;
    }

    .upcoming-events-section
    .association-events-count-1
    .association-event-image,
    .upcoming-events-section
    .association-events-count-2
    .association-event-image {
        height: 285px;
        min-height: 285px;
    }
}

@media (max-width: 767.98px) {

    .event-page-hero {
        min-height: 325px !important;
        padding: 58px 0 !important;
    }

    .event-page-hero
    .page-hero-content h1 {
        font-size: 39px;
    }

    .association-section-heading {
        padding: 21px 20px;
    }

    .upcoming-events-section
    .association-events-count-1
    .association-event-body,
    .upcoming-events-section
    .association-events-count-2
    .association-event-body {
        padding: 24px;
    }

    .upcoming-events-section
    .association-events-count-1
    .association-event-information,
    .upcoming-events-section
    .association-events-count-2
    .association-event-information {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {

    .event-page-hero
    .page-hero-content h1 {
        font-size: 33px;
    }

    .upcoming-events-section
    .association-events-count-1
    .association-event-card,
    .upcoming-events-section
    .association-events-count-2
    .association-event-card {
        border-radius: 21px;
    }

    .upcoming-events-section
    .association-events-count-1
    .association-event-image,
    .upcoming-events-section
    .association-events-count-2
    .association-event-image {
        height: 235px;
        min-height: 235px;
    }

    .upcoming-events-section
    .association-events-count-1
    .association-event-body h3,
    .upcoming-events-section
    .association-events-count-2
    .association-event-body h3 {
        font-size: 22px;
    }

    .upcoming-events-section
    .association-events-count-1
    .association-event-actions,
    .upcoming-events-section
    .association-events-count-2
    .association-event-actions {
        max-width: none;

        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {

    .upcoming-events-section
    .association-event-card::before,
    .upcoming-events-section
    .association-event-image img,
    .upcoming-events-section
    .association-event-body > * {
        animation: none !important;
    }
}


/* =====================================================
   EVENTS PAGE V7 — ASSOCIATION GREEN BACKGROUNDS
   ===================================================== */

/* Whole Events page */

.association-events-page {
    position: relative;
    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #edf9f5 0%,
            #f6fbf9 24%,
            #f2f8ff 58%,
            #eef8f5 100%
        ) !important;
}


/* =====================================================
   ONGOING EVENTS BACKGROUND
   ===================================================== */

.ongoing-events-section {
    position: relative;
    isolation: isolate;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 90% 18%,
            rgba(15, 143, 131, 0.16),
            transparent 30%
        ),
        radial-gradient(
            circle at 6% 82%,
            rgba(34, 197, 94, 0.09),
            transparent 26%
        ),
        linear-gradient(
            135deg,
            #e7f8f2 0%,
            #f3fbf8 48%,
            #edf8f5 100%
        ) !important;
}

.ongoing-events-section::before {
    content: "";

    position: absolute;
    z-index: -1;

    top: -125px;
    right: -105px;

    width: 330px;
    height: 330px;

    border:
        48px solid
        rgba(15, 143, 131, 0.055);

    border-radius: 50%;

    pointer-events: none;
}

.ongoing-events-section::after {
    content: "";

    position: absolute;
    z-index: -1;

    bottom: -140px;
    left: -105px;

    width: 310px;
    height: 310px;

    border-radius: 50%;

    background:
        rgba(34, 197, 94, 0.045);

    pointer-events: none;
}


/* Ongoing section heading */

.ongoing-events-section
.association-section-heading {
    border-color:
        rgba(15, 143, 131, 0.18);

    background:
        linear-gradient(
            135deg,
            rgba(255, 255, 255, 0.95),
            rgba(220, 247, 238, 0.91)
        );

    box-shadow:
        0 13px 34px
        rgba(15, 143, 131, 0.09);
}

.ongoing-events-section
.association-section-kicker {
    color: #08776f;
}

.ongoing-events-section
.association-section-count {
    border-color:
        rgba(15, 143, 131, 0.20);

    background:
        linear-gradient(
            135deg,
            rgba(15, 143, 131, 0.13),
            rgba(34, 197, 94, 0.08)
        );

    color: #08776f;
}


/* Ongoing event cards */

.ongoing-events-section
.association-event-card {
    border-color:
        rgba(15, 143, 131, 0.25);

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f1fbf7 62%,
            #eaf8f3 100%
        );

    box-shadow:
        0 15px 38px
        rgba(15, 143, 131, 0.10);
}

.ongoing-events-section
.association-event-card:hover {
    border-color:
        rgba(15, 143, 131, 0.40);

    box-shadow:
        0 23px 52px
        rgba(15, 143, 131, 0.16);
}

.ongoing-events-section
.association-event-category {
    border-color:
        rgba(15, 143, 131, 0.14);

    background:
        rgba(15, 143, 131, 0.10);

    color: #08776f;
}


/* =====================================================
   UPCOMING EVENTS BACKGROUND
   ===================================================== */

.upcoming-events-section {
    position: relative;
    isolation: isolate;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 8% 15%,
            rgba(15, 143, 131, 0.12),
            transparent 28%
        ),
        radial-gradient(
            circle at 92% 85%,
            rgba(13, 110, 253, 0.08),
            transparent 26%
        ),
        linear-gradient(
            145deg,
            #f2fbf8 0%,
            #f8fcfb 45%,
            #edf7f4 100%
        ) !important;
}

.upcoming-events-section::before {
    content: "";

    position: absolute;
    z-index: -1;

    top: 70px;
    right: -135px;

    width: 320px;
    height: 320px;

    border:
        50px solid
        rgba(15, 143, 131, 0.045);

    border-radius: 50%;

    pointer-events: none;
}


/* Upcoming heading */

.upcoming-events-section
.association-section-heading {
    border-color:
        rgba(15, 143, 131, 0.15);

    background:
        linear-gradient(
            135deg,
            rgba(255, 255, 255, 0.96),
            rgba(231, 248, 242, 0.92)
        );

    box-shadow:
        0 13px 34px
        rgba(15, 143, 131, 0.075);
}

.upcoming-events-section
.association-section-heading::before {
    background:
        linear-gradient(
            180deg,
            #0f8f83,
            #0d6efd
        );
}

.upcoming-events-section
.association-section-kicker {
    color: #08776f;
}


/* Upcoming premium cards */

.upcoming-events-section
.association-event-card {
    border-color:
        rgba(15, 143, 131, 0.20);

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f4fbf8 54%,
            #eef8f5 100%
        );

    box-shadow:
        0 18px 46px
        rgba(15, 143, 131, 0.10);
}

.upcoming-events-section
.association-event-card:hover {
    border-color:
        rgba(15, 143, 131, 0.36);

    box-shadow:
        0 25px 58px
        rgba(15, 143, 131, 0.16);
}

.upcoming-events-section
.association-event-information > div {
    background:
        rgba(15, 143, 131, 0.055);
}

.upcoming-events-section
.association-event-information i {
    color: #0f8f83;
}

.upcoming-events-section
.association-event-category {
    border-color:
        rgba(15, 143, 131, 0.13);

    background:
        linear-gradient(
            135deg,
            rgba(15, 143, 131, 0.11),
            rgba(13, 110, 253, 0.055)
        );

    color: #08776f;
}


/* =====================================================
   FEATURED EVENT GREEN TINT
   ===================================================== */

.featured-events-section {
    background:
        linear-gradient(
            145deg,
            #edf9f5,
            #ffffff,
            #f1faf7
        ) !important;
}

.association-featured-event {
    border-color:
        rgba(15, 143, 131, 0.24);

    background:
        radial-gradient(
            circle at 92% 12%,
            rgba(15, 143, 131, 0.11),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #ffffff,
            #edf9f5,
            #f4fbf9
        );

    box-shadow:
        0 19px 48px
        rgba(15, 143, 131, 0.12);
}

.association-featured-label {
    background:
        rgba(15, 143, 131, 0.12);

    color: #08776f;
}


/* =====================================================
   PAST EVENTS GREEN BACKGROUND
   ===================================================== */

.completed-events-section {
    position: relative;
    isolation: isolate;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 88% 12%,
            rgba(15, 143, 131, 0.09),
            transparent 26%
        ),
        linear-gradient(
            140deg,
            #eaf7f3 0%,
            #f5fbf9 48%,
            #edf8f5 100%
        ) !important;
}

.completed-events-section::before {
    content: "";

    position: absolute;
    z-index: -1;

    bottom: -145px;
    left: -110px;

    width: 315px;
    height: 315px;

    border-radius: 50%;

    background:
        rgba(15, 143, 131, 0.045);

    pointer-events: none;
}

.completed-events-section
.association-section-heading {
    border-color:
        rgba(15, 143, 131, 0.15);

    background:
        linear-gradient(
            135deg,
            rgba(255, 255, 255, 0.96),
            rgba(231, 248, 242, 0.90)
        );
}

.association-past-event-card {
    border-color:
        rgba(15, 143, 131, 0.18);

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f2faf7
        );

    box-shadow:
        0 11px 29px
        rgba(15, 143, 131, 0.075);
}

.association-past-event-card:hover {
    border-color:
        rgba(15, 143, 131, 0.32);

    box-shadow:
        0 18px 40px
        rgba(15, 143, 131, 0.13);
}

.association-past-event-icon {
    background:
        linear-gradient(
            135deg,
            rgba(15, 143, 131, 0.16),
            rgba(34, 197, 94, 0.08)
        );

    color: #08776f;
}

.association-completed-label {
    background:
        rgba(15, 143, 131, 0.10);

    color: #08776f;
}


/* =====================================================
   MOBILE GREEN BACKGROUND ADJUSTMENTS
   ===================================================== */

@media (max-width: 767.98px) {

    .ongoing-events-section,
    .upcoming-events-section,
    .completed-events-section {
        background-size: cover !important;
    }

    .association-section-heading {
        background:
            rgba(255, 255, 255, 0.93);
    }
}

@media (prefers-reduced-motion: reduce) {

    .ongoing-events-section::before,
    .ongoing-events-section::after,
    .upcoming-events-section::before,
    .completed-events-section::before {
        animation: none !important;
    }
}


/* =====================================================
   PLANNED FEATURED EVENT — INTEREST ACTION
   ===================================================== */

.association-featured-action {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 18px;
}

.association-featured-action
.event-registration-form {
    margin: 0;
}

.featured-interest-note {
    max-width: 470px;

    margin: 0;

    color: #526574;

    font-size: 13px;
    line-height: 1.6;
}

.association-featured-action
.association-event-button.register {
    background:
        linear-gradient(
            135deg,
            #08776f,
            #0f8f83
        );

    box-shadow:
        0 10px 24px
        rgba(15, 143, 131, 0.20);
}

.association-featured-action
.association-event-button.register:hover {
    transform: translateY(-2px);

    box-shadow:
        0 15px 30px
        rgba(15, 143, 131, 0.27);
}

@media (max-width: 575.98px) {

    .association-featured-action {
        align-items: stretch;
        flex-direction: column;
    }

    .association-featured-action
    .event-registration-form,
    .association-featured-action
    .association-event-button {
        width: 100%;
    }

    .featured-interest-note {
        text-align: center;
    }
}


/* =====================================================
   COMBINED UPCOMING & ONGOING EVENTS
   ===================================================== */

.official-events-section {
    position: relative;
}

.official-events-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;

    gap: 10px;

    margin-top: 16px;
}

.official-summary-item {
    min-height: 34px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 8px;

    padding: 7px 13px;

    border: 1px solid transparent;
    border-radius: 999px;

    font-size: 13px;
    font-weight: 750;
    line-height: 1;
}

.official-summary-item.ongoing {
    border-color:
        rgba(15, 143, 131, 0.19);

    background:
        rgba(15, 143, 131, 0.10);

    color: #08776f;
}

.official-summary-item.ongoing i {
    font-size: 8px;

    animation:
        official-ongoing-pulse
        1.8s ease-in-out infinite;
}

.official-summary-item.upcoming {
    border-color:
        rgba(13, 110, 253, 0.16);

    background:
        rgba(13, 110, 253, 0.075);

    color: #075db8;
}

.official-events-section
.association-events-count-1,
.official-events-section
.association-events-count-2 {
    max-width: 1120px;

    margin-right: auto;
    margin-left: auto;
}

@keyframes official-ongoing-pulse {

    0%,
    100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: 0.48;
        transform: scale(0.82);
    }
}

@media (max-width: 575.98px) {

    .official-events-summary {
        align-items: stretch;
        flex-direction: column;
    }

    .official-summary-item {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {

    .official-summary-item.ongoing i {
        animation: none !important;
    }
}

/* OFFICIAL EVENTS COMPACT GRID — START */

/* Three cards per row on desktop */

.official-events-section
.association-events-grid {
    width: 100%;
    max-width: 1320px !important;

    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    align-items: stretch;

    gap: 25px !important;

    margin-right: auto !important;
    margin-left: auto !important;
}


/* Keep one or two cards compact and centred */

.official-events-section
.association-events-count-1 {
    max-width: 430px !important;

    grid-template-columns:
        minmax(0, 430px) !important;

    justify-content: center;
}

.official-events-section
.association-events-count-2 {
    max-width: 885px !important;

    grid-template-columns:
        repeat(2, minmax(0, 430px)) !important;

    justify-content: center;
}


/* Reset the previous large horizontal card */

.official-events-section
.association-event-card {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 555px !important;

    display: flex !important;
    flex-direction: column !important;

    overflow: hidden;

    border-radius: 23px !important;
}

.official-events-section
.association-event-image {
    width: 100% !important;
    height: 220px !important;
    min-height: 220px !important;
}

.official-events-section
.association-event-image img {
    width: 100% !important;
    height: 100% !important;

    object-fit: cover !important;
}

.official-events-section
.association-event-body {
    min-width: 0 !important;

    display: flex !important;
    flex: 1;
    flex-direction: column !important;

    padding: 22px !important;
}

.official-events-section
.association-event-body h3 {
    min-height: 52px;

    margin:
        13px 0 15px !important;

    font-size: 22px !important;
    line-height: 1.25 !important;
}

.official-events-section
.association-event-information {
    display: grid !important;

    grid-template-columns:
        minmax(0, 1fr) !important;

    gap: 9px !important;
}

.official-events-section
.association-event-information > div {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
}

.official-events-section
.association-event-description {
    min-height: 67px;

    margin:
        16px 0 18px !important;

    display: -webkit-box;

    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
}

.official-events-section
.association-event-actions {
    width: 100%;
    max-width: none !important;

    grid-template-columns:
        minmax(0, 0.85fr)
        minmax(0, 1.15fr) !important;

    margin-top: auto !important;
}


/* Pagination */

.official-events-pagination {
    width: 100%;

    display: flex;
    flex-wrap: wrap;

    align-items: center;
    justify-content: center;

    gap: 14px;

    margin-top: 36px;
}

.official-page-button {
    min-height: 44px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 9px;

    padding: 10px 18px;

    border:
        1px solid
        rgba(15, 143, 131, 0.22);

    border-radius: 999px;

    background: #ffffff;

    color: #08776f;

    font-size: 14px;
    font-weight: 750;

    text-decoration: none;

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

.official-page-button:not(.disabled):hover {
    transform: translateY(-2px);

    background: #ecf9f5;

    box-shadow:
        0 10px 24px
        rgba(15, 143, 131, 0.12);
}

.official-page-button.disabled {
    cursor: not-allowed;

    opacity: 0.42;
}

.official-page-status {
    color: #526574;

    font-size: 14px;
    font-weight: 700;
}


/* Tablet: two cards */

@media (max-width: 991.98px) {

    .official-events-section
    .association-events-grid,
    .official-events-section
    .association-events-count-2 {
        max-width: 885px !important;

        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}


/* Mobile: one card */

@media (max-width: 650px) {

    .official-events-section
    .association-events-grid,
    .official-events-section
    .association-events-count-1,
    .official-events-section
    .association-events-count-2 {
        max-width: 430px !important;

        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .official-events-section
    .association-event-image {
        height: 210px !important;
        min-height: 210px !important;
    }

    .official-events-section
    .association-event-card {
        min-height: 530px !important;
    }

    .official-events-pagination {
        gap: 10px;
    }

    .official-page-status {
        width: 100%;

        order: -1;

        text-align: center;
    }
}

/* OFFICIAL EVENTS COMPACT GRID — END */