.nav-links .active {
    color: var(--brown-dark);
    font-weight: 800;
}

.events-page-main {
    display: block;
    overflow: hidden;
    background: var(--cream);
}

.events-hero {
    position: relative;
    isolation: isolate;
    width: 100%;
    padding: 110px 24px 90px;
    text-align: center;
    background: var(--cream);
}
.events-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: url("assets/backgrounds/cafe-doodle-pattern.webp") center top / 680px repeat;
    opacity: 0.085;
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 62%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 62%, transparent 100%);
}
.events-hero h1 {
    max-width: 850px;
    margin: 14px auto 20px;
    color: var(--brown-dark);
    font-size: clamp(42px, 7vw, 76px);
    line-height: 1.03;
    letter-spacing: -2px;
}
.events-hero p {
    max-width: 680px;
    margin: 0 auto;
    color: var(--muted);
    font-size: 18px;
    line-height: 1.7;
}

.events-archive {
    width: min(1120px, 100%);
    margin: 0 auto;
    padding: 90px 24px;
}
.events-archive-heading {
    max-width: 650px;
    margin-bottom: 34px;
}
.upcoming-event-card {
    display: grid;
    grid-template-columns: minmax(280px, 0.75fr) minmax(0, 1.25fr);
    gap: 46px;
    align-items: center;
    margin-bottom: 90px;
    padding: 34px;
    border-radius: 30px;
    background: var(--surface);
    box-shadow: var(--shadow);
}
.upcoming-event-poster {
    display: block;
    overflow: hidden;
    border-radius: 22px;
    box-shadow: 0 18px 38px rgba(94, 50, 24, 0.18);
}
.upcoming-event-poster img {display: block; width: 100%; height: auto;}
.upcoming-event-copy h2 {
    margin: 12px 0 16px;
    color: var(--brown-dark);
    font-size: clamp(34px, 5vw, 54px);
}
.upcoming-event-copy > p {margin: 0; color: var(--muted); line-height: 1.7;}
.event-status {
    display: inline-flex;
    margin-right: 8px;
    padding: 7px 11px;
    border-radius: 999px;
    color: white;
    background: #a64d47;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 1.5px;
}
.event-facts {display: grid; gap: 12px; margin: 26px 0;}
.event-facts div {display: grid; grid-template-columns: 86px 1fr; gap: 14px;}
.event-facts dt {color: var(--muted); font-size: 13px;}
.event-facts dd {margin: 0; color: var(--brown-dark); font-weight: 800;}
.events-archive-heading h2 {
    margin: 0;
    color: var(--brown-dark);
    font-size: clamp(32px, 5vw, 46px);
}
.events-archive-heading p {
    margin: 12px 0 0;
    color: var(--muted);
    line-height: 1.65;
}
.event-archive-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr));
    gap: 24px;
}
.event-archive-card {
    overflow: hidden;
    border-radius: 28px;
    background: var(--surface);
    box-shadow: var(--shadow);
}
.event-archive-card-wide {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.55fr);
    grid-column: 1 / -1;
}
.event-photo-gallery {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    grid-template-rows: repeat(2, minmax(190px, 1fr));
    gap: 6px;
    min-height: 540px;
    background: #e8ddce;
}
.event-photo-gallery img {
    width: 100%;
    height: 100%;
    min-height: 0;
    object-fit: cover;
}
.event-photo-gallery .event-photo-main {grid-row: 1 / 3;}
.event-photo-pair {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    min-height: 540px;
    background: #e8ddce;
}
.event-photo-pair img {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 540px;
    object-fit: cover;
}
.event-single-photo {
    min-height: 540px;
    background: #e8ddce;
}
.event-single-photo img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 540px;
    object-fit: cover;
    object-position: center;
}
.event-archive-card-wide .event-archive-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 40px;
}
.event-labels {display: flex; flex-wrap: wrap; align-items: center; gap: 10px;}
.event-first-badge {
    padding: 6px 9px;
    border-radius: 999px;
    color: var(--brown-dark);
    background: #f4e5bb;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1px;
}
.archive-event-facts {display: grid; gap: 12px; margin: 10px 0 22px;}
.archive-event-facts div {display: grid; grid-template-columns: 70px 1fr; gap: 12px;}
.archive-event-facts dt {color: var(--muted); font-size: 13px;}
.archive-event-facts dd {margin: 0; color: var(--brown-dark); font-weight: 800;}
.event-media-placeholder {
    display: grid;
    place-items: center;
    align-content: center;
    gap: 14px;
    min-height: 300px;
    padding: 30px;
    color: var(--brown-dark);
    background: linear-gradient(145deg, #e8ddce, #d9e2d5);
}
.event-donor-art {background: linear-gradient(145deg, #f0dfd8, #e6c7c3);}
.event-media-placeholder span {font-size: 66px;}
.event-media-placeholder small {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.8px;
    text-align: center;
    opacity: 0.72;
}
.event-archive-copy {padding: 30px;}
.event-type {
    color: var(--sage-dark);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2px;
}
.event-archive-copy h3 {
    margin: 10px 0 12px;
    color: var(--brown-dark);
    font-size: 28px;
}
.event-archive-copy p {
    margin: 0;
    color: var(--muted);
    line-height: 1.7;
}
.event-contact-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    width: min(1072px, calc(100% - 48px));
    margin: 0 auto 90px;
    padding: 44px;
    border-radius: 30px;
    color: white;
    background: linear-gradient(145deg, var(--brown), var(--brown-dark));
    box-shadow: 0 22px 50px rgba(94, 50, 24, 0.18);
}
.event-contact-card h2 {
    margin: 10px 0 10px;
    font-size: clamp(28px, 4vw, 40px);
}
.event-contact-card p {margin: 0; opacity: 0.82; line-height: 1.6;}
.event-contact-card .section-eyebrow {color: #d8e2d4;}
.event-contact-card .button {flex: 0 0 auto;}

@media (max-width: 850px) {
    .upcoming-event-card {grid-template-columns: 1fr;}
    .upcoming-event-poster {max-width: 480px; margin: 0 auto;}
    .event-archive-card-wide {grid-template-columns: 1fr;}
    .event-photo-gallery {min-height: 500px;}
    .event-photo-pair {min-height: 500px;}
    .event-photo-pair img {min-height: 500px;}
    .event-single-photo,
    .event-single-photo img {min-height: 500px; max-height: 680px;}
    .event-contact-card {align-items: flex-start; flex-direction: column;}
}

@media (max-width: 520px) {
    .events-hero {padding: 78px 18px 68px;}
    .events-hero h1 {font-size: 44px; letter-spacing: -1px;}
    .events-hero p {font-size: 16px;}
    .events-archive {padding: 70px 18px;}
    .upcoming-event-card {
        gap: 28px;
        margin-bottom: 70px;
        padding: 18px 18px 28px;
    }
    .event-archive-grid {grid-template-columns: 1fr;}
    .event-photo-gallery {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 330px 190px;
        min-height: 0;
    }
    .event-photo-gallery .event-photo-main {grid-column: 1 / 3; grid-row: auto;}
    .event-photo-pair {min-height: 390px;}
    .event-photo-pair img {min-height: 390px;}
    .event-single-photo,
    .event-single-photo img {min-height: 430px; max-height: 520px;}
    .event-archive-card-wide .event-archive-copy {padding: 28px 24px 32px;}
    .event-media-placeholder {min-height: 230px;}
    .event-contact-card {
        width: calc(100% - 36px);
        margin-bottom: 70px;
        padding: 30px 24px;
    }
    .event-contact-card .button {width: 100%;}
}