/* =========================================================
   EVENT DETAIL
========================================================= */

.event-page {
    width: 100%;

    overflow: hidden;

    background: #f3f0e9;
    color: #171717;
}


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

.event-hero {
    position: relative;

    width: 100%;

    min-height: clamp(420px, 46vw, 500px);

    display: flex;
    align-items: flex-end;

    overflow: hidden;

    background: #111;
    color: #fff;
}


.event-hero__image {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    transform: scale(1.01);
}


.event-hero__shade {
    position: absolute;

    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            90deg,
            rgba(0, 0, 0, 0.82) 0%,
            rgba(0, 0, 0, 0.52) 42%,
            rgba(0, 0, 0, 0.18) 72%,
            rgba(0, 0, 0, 0.08) 100%
        );
}


.event-hero__vignette {
    position: absolute;

    inset: 0;

    z-index: 2;

    background:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.48) 0%,
            transparent 30%,
            transparent 62%,
            rgba(0, 0, 0, 0.45) 100%
        );
}


/* NAVIGATION */

.event-hero__nav {
    position: absolute;

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

    z-index: 20;
}


.event-hero .inner-navbar {
    width: 100%;

    min-height: 94px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 40px;

    padding: 18px 5%;

    border: 0;

    background:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.55),
            transparent
        );

    color: #fff;
}


.event-hero .inner-navbar__brand {
    display: flex;
    align-items: center;

    gap: 13px;

    flex: 0 0 auto;

    color: #fff;
}


.event-hero .inner-navbar__logo {
    width: 52px;
    height: 52px;

    object-fit: contain;
}


.event-hero .inner-navbar__brand span {
    font-size: 0.92rem;
    font-weight: 700;

    letter-spacing: 0.03em;
}


.event-hero .inner-navbar__links {
    display: flex;
    align-items: center;
    justify-content: center;

    gap:
        clamp(
            18px,
            2.2vw,
            38px
        );
}


.event-hero .inner-navbar__links a {
    position: relative;

    padding: 10px 0;

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

    font-size: 0.78rem;
    font-weight: 600;

    transition:
        color 0.2s ease;
}


.event-hero .inner-navbar__links a::after {
    content: "";

    position: absolute;

    left: 0;
    right: 100%;
    bottom: 3px;

    height: 1px;

    background: #fff;

    transition:
        right 0.25s ease;
}


.event-hero .inner-navbar__links a:hover {
    color: #fff;
}


.event-hero .inner-navbar__links a:hover::after {
    right: 0;
}


.event-hero .inner-navbar__back {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 40px;

    padding: 0 18px;

    border:
        1px solid
        rgba(255, 255, 255, 0.32);

    color: #fff;

    font-size: 0.76rem;
    font-weight: 700;

    transition:
        background 0.2s ease,
        color 0.2s ease;
}


.event-hero .inner-navbar__back:hover {
    background: #fff;
    color: #111;
}


/* HERO CONTENT */

.event-hero__content {
    position: relative;

    z-index: 10;

    width: min(900px, 90%);

    margin:
        0
        5%
        clamp(90px, 11vh, 150px);
}


.event-hero__eyebrow {
    display: flex;
    align-items: center;

    gap: 15px;

    margin-bottom: 22px;
}


.event-hero__eyebrow span {
    width: 54px;
    height: 1px;

    background: #d3b168;
}


.event-hero__eyebrow p {
    margin: 0;

    font-size: 0.69rem;
    font-weight: 700;

    letter-spacing: 0.21em;
    text-transform: uppercase;

    color: #e0c78d;
}


.event-hero__content h1 {
    max-width: 1000px;

    margin: 0;

    font-size:
        clamp(
            4.3rem,
            9vw,
            9.2rem
        );

    font-weight: 500;

    line-height: 0.85;

    letter-spacing: -0.06em;

    text-wrap: balance;
}


.event-hero__description {
    max-width: 630px;

    margin-top: 30px;

    font-size:
        clamp(
            1rem,
            1.3vw,
            1.15rem
        );

    line-height: 1.75;

    color:
        rgba(255, 255, 255, 0.76);
}


.event-hero__description p {
    margin: 0;
}


.event-hero__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: 13px;

    margin-top: 38px;
}


/* BUTTONS */

.event-button {
    min-height: 52px;

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

    gap: 25px;

    padding: 0 25px;

    font-size: 0.78rem;
    font-weight: 700;

    letter-spacing: 0.02em;

    transition:
        transform 0.2s ease,
        background 0.2s ease,
        border-color 0.2s ease;
}


.event-button:hover {
    transform: translateY(-2px);
}


.event-button span {
    font-size: 1.05rem;
}


.event-button--gold {
    background: #d3b168;
    color: #141414;
}


.event-button--gold:hover {
    background: #e2c681;
}


.event-button--glass {
    border:
        1px solid
        rgba(255, 255, 255, 0.42);

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

    color: #fff;

    backdrop-filter: blur(8px);
}


.event-button--glass:hover {
    background:
        rgba(255, 255, 255, 0.11);
}


.event-button--light {
    background: #fff;
    color: #111;
}


/* SCROLL MARKER */

.event-hero__scroll {
    position: absolute;

    right: 5%;
    bottom: 0;

    z-index: 10;

    display: flex;
    align-items: center;

    gap: 14px;

    transform:
        rotate(90deg)
        translateX(-100%);

    transform-origin: right bottom;
}


.event-hero__scroll span {
    font-size: 0.63rem;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.16em;

    color:
        rgba(255, 255, 255, 0.55);
}


.event-hero__scroll div {
    width: 60px;
    height: 1px;

    background:
        rgba(255, 255, 255, 0.42);
}


/* =========================================================
   FEATURES
========================================================= */

.event-features {
    border-bottom: 1px solid #d8d3ca;

    background: #eee9df;
}


.event-features__inner {
    width: min(1500px, 90%);

    margin: 0 auto;

    display: grid;

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


.event-features article {
    min-height: 180px;

    display: grid;

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

    align-items: center;

    gap: 22px;

    padding:
        35px
        clamp(25px, 3vw, 50px);

    border-right:
        1px solid #d8d3ca;
}


.event-features article:first-child {
    border-left:
        1px solid #d8d3ca;
}


.event-features__number {
    align-self: start;

    padding-top: 4px;

    font-size: 0.64rem;
    font-weight: 700;

    letter-spacing: 0.12em;

    color: #a88949;
}


.event-features h3 {
    margin: 0 0 9px;

    font-size: 1.05rem;
}


.event-features p {
    max-width: 330px;

    margin: 0;

    font-size: 0.82rem;
    line-height: 1.65;

    color: #777169;
}


/* =========================================================
   INTRO
========================================================= */

.event-intro {
    padding:
        clamp(100px, 12vw, 190px)
        5%;

    background: #f4f1ea;
}


.event-intro__inner {
    width: min(1400px, 100%);

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(350px, 0.75fr);

    gap:
        clamp(
            70px,
            10vw,
            170px
        );
}


.event-kicker {
    margin: 0 0 17px;

    font-size: 0.67rem;
    font-weight: 700;

    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: #a88949;
}


.event-kicker--light {
    color: #d3b168;
}


.event-intro__heading h2 {
    max-width: 800px;

    margin: 0;

    font-size:
        clamp(
            3rem,
            5.6vw,
            6.2rem
        );

    font-weight: 500;

    line-height: 0.98;

    letter-spacing: -0.055em;
}


.event-intro__content {
    align-self: end;
}


.event-intro__content p {
    margin:
        22px
        0
        0;

    font-size: 0.95rem;
    line-height: 1.8;

    color: #746f68;
}
.event-intro__dynamic-text {
    color: #746f68;
}


.event-intro__dynamic-text p {
    margin: 0 0 22px;

    font-size: 1rem;
    line-height: 1.85;
}


.event-intro__dynamic-text p:first-child {
    font-size: 1.12rem;

    color: #35322f;
}


.event-intro__dynamic-text p:last-child {
    margin-bottom: 0;
}


.event-intro__content
.event-intro__lead {
    margin-top: 0;

    font-size: 1.12rem;

    color: #35322f;
}


.event-intro__links {
    display: grid;

    gap: 13px;

    margin-top: 33px;
}


.event-text-link {
    width: fit-content;

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

    gap: 30px;

    padding: 9px 0;

    border-bottom: 1px solid #bbb3a5;

    font-size: 0.79rem;
    font-weight: 700;

    transition:
        gap 0.2s ease;
}


.event-text-link:hover {
    gap: 38px;
}


/* =========================================================
   VISUAL CTA
========================================================= */

.event-visual-cta {
    padding:
        0
        5%
        clamp(100px, 11vw, 170px);

    background: #f4f1ea;
}


.event-visual-cta__inner {
    width: min(1500px, 100%);

    min-height: 680px;

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        minmax(350px, 0.8fr)
        minmax(0, 1.2fr);

    background: #151515;
    color: #fff;
}


.event-visual-cta__content {
    align-self: center;

    padding:
        clamp(
            45px,
            6vw,
            95px
        );
}


.event-visual-cta__content h2 {
    max-width: 600px;

    margin: 0;

    font-size:
        clamp(
            2.7rem,
            4.5vw,
            5.4rem
        );

    font-weight: 500;

    line-height: 1;

    letter-spacing: -0.05em;
}


.event-visual-cta__content > p:not(.event-kicker) {
    max-width: 520px;

    margin: 28px 0 35px;

    font-size: 0.95rem;
    line-height: 1.8;

    color:
        rgba(255, 255, 255, 0.62);
}


.event-visual-cta__image {
    position: relative;

    min-height: 620px;

    overflow: hidden;
}


.event-visual-cta__image::after {
    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(21, 21, 21, 0.32),
            transparent 40%
        );
}


.event-visual-cta__image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
}


/* =========================================================
   OTHER EVENTS
========================================================= */

.event-more {
    padding:
        clamp(100px, 11vw, 170px)
        5%;

    background: #0f0f0f;
    color: #fff;
}


.event-more__heading {
    width: min(1500px, 100%);

    margin:
        0
        auto
        50px;

    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 50px;
}


.event-more__heading h2 {
    margin: 0;

    font-size:
        clamp(
            3rem,
            5vw,
            5.7rem
        );

    font-weight: 500;

    line-height: 1;

    letter-spacing: -0.05em;
}


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

    gap: 25px;

    padding-bottom: 8px;

    border-bottom:
        1px solid
        rgba(255, 255, 255, 0.3);

    font-size: 0.77rem;
    font-weight: 700;

    color:
        rgba(255, 255, 255, 0.78);
}


.event-more__grid {
    width: min(1500px, 100%);

    margin: 0 auto;

    display: grid;

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

    gap: 18px;
}


.event-more-card {
    position: relative;

    min-height: 540px;

    overflow: hidden;

    background: #222;
}


.event-more-card img {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform 0.55s ease;
}


.event-more-card:hover img {
    transform: scale(1.045);
}


.event-more-card__shade {
    position: absolute;

    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            180deg,
            transparent 32%,
            rgba(0, 0, 0, 0.82) 100%
        );
}


.event-more-card__content {
    position: absolute;

    z-index: 2;

    left: 30px;
    right: 30px;
    bottom: 30px;
}


.event-more-card__content > span {
    display: block;

    margin-bottom: 9px;

    font-size: 0.63rem;
    font-weight: 700;

    letter-spacing: 0.14em;
    text-transform: uppercase;

    color: #d3b168;
}


.event-more-card__content h3 {
    margin: 0;

    font-size:
        clamp(
            1.8rem,
            2.5vw,
            2.8rem
        );

    font-weight: 500;

    letter-spacing: -0.035em;
}


.event-more-card__content > div {
    display: flex;
    align-items: center;

    gap: 20px;

    margin-top: 22px;

    font-size: 0.75rem;
    font-weight: 700;

    color:
        rgba(255, 255, 255, 0.72);
}


/* =========================================================
   BOTTOM CONTACT
========================================================= */

.event-bottom-contact {
    min-height: 330px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 50px;

    padding:
        70px
        7%;

    background: #1b1b1b;
    color: #fff;
}


.event-bottom-contact h2 {
    margin: 0;

    font-size:
        clamp(
            2.7rem,
            5vw,
            5.2rem
        );

    font-weight: 500;

    line-height: 1;

    letter-spacing: -0.05em;
}


.event-bottom-contact__actions {
    display: flex;
    align-items: center;

    gap: 35px;
}


.event-bottom-contact__actions > a:first-child {
    font-size: 0.9rem;

    color:
        rgba(255, 255, 255, 0.68);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .event-hero .inner-navbar__links {
        display: none;
    }


    .event-intro__inner {
        grid-template-columns: 1fr;

        gap: 55px;
    }


    .event-intro__content {
        max-width: 700px;
    }


    .event-visual-cta__inner {
        min-height: auto;

        grid-template-columns: 1fr;
    }


    .event-visual-cta__image {
        min-height: 550px;
    }


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


    .event-more-card:last-child:nth-child(odd) {
        grid-column: 1 / -1;

        min-height: 430px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 720px) {

    .event-hero {
        min-height: clamp(340px, 92vw, 420px);
    }


    .event-hero__shade {
        background:
            linear-gradient(
                180deg,
                rgba(0, 0, 0, 0.4) 0%,
                rgba(0, 0, 0, 0.23) 35%,
                rgba(0, 0, 0, 0.82) 100%
            );
    }


    .event-hero .inner-navbar {
        min-height: 78px;

        padding:
            14px
            5%;
    }


    .event-hero .inner-navbar__logo {
        width: 42px;
        height: 42px;
    }


    .event-hero .inner-navbar__brand span {
        font-size: 0.78rem;
    }


    .event-hero .inner-navbar__back {
        min-height: 37px;

        padding:
            0
            14px;

        font-size: 0.68rem;
    }


    .event-hero__content {
        width: 90%;

        margin:
            0
            5%
            65px;
    }


    .event-hero__eyebrow {
        margin-bottom: 17px;
    }


    .event-hero__content h1 {
        font-size:
            clamp(
                3.5rem,
                18vw,
                6rem
            );

        line-height: 0.9;
    }


    .event-hero__description {
        max-width: 100%;

        margin-top: 22px;

        font-size: 0.92rem;
    }


    .event-hero__actions {
        align-items: stretch;
        flex-direction: column;

        margin-top: 28px;
    }


    .event-button {
        width: 100%;

        justify-content: space-between;

        min-height: 54px;
    }


    .event-hero__scroll {
        display: none;
    }


    /* FEATURES */

    .event-features__inner {
        width: 100%;

        grid-template-columns: 1fr;
    }


    .event-features article,
    .event-features article:first-child {
        min-height: auto;

        padding:
            28px
            6%;

        border-left: 0;
        border-right: 0;

        border-bottom:
            1px solid #d8d3ca;
    }


    /* INTRO */

    .event-intro {
        padding:
            90px
            6%;
    }


    .event-intro__heading h2 {
        font-size:
            clamp(
                2.8rem,
                13vw,
                4.3rem
            );
    }


    /* VISUAL CTA */

    .event-visual-cta {
        padding:
            0
            0
            90px;
    }


    .event-visual-cta__content {
        padding:
            65px
            6%;
    }


    .event-visual-cta__image {
        min-height: 430px;
    }


    /* OTHER EVENTS */

    .event-more {
        padding:
            90px
            6%;
    }


    .event-more__heading {
        align-items: flex-start;
        flex-direction: column;

        gap: 25px;
    }


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


    .event-more-card,
    .event-more-card:last-child:nth-child(odd) {
        grid-column: auto;

        min-height: 430px;
    }


    /* CONTACT */

    .event-bottom-contact {
        align-items: flex-start;
        flex-direction: column;

        min-height: auto;

        padding:
            70px
            6%;
    }


    .event-bottom-contact__actions {
        width: 100%;

        align-items: stretch;
        flex-direction: column;

        gap: 20px;
    }

}

/* =========================================================
   EVENT GALLERY
========================================================= */

.event-gallery {
    padding:
        clamp(100px, 11vw, 170px)
        5%;

    background: #eae5db;
}


.event-gallery__heading {
    width: min(1500px, 100%);

    margin:
        0
        auto
        50px;

    display: grid;

    grid-template-columns:
        minmax(0, 1.2fr)
        minmax(300px, 0.6fr);

    align-items: end;

    gap: 70px;
}


.event-gallery__heading h2 {
    margin: 0;

    font-size:
        clamp(
            3rem,
            5vw,
            5.8rem
        );

    font-weight: 500;

    line-height: 0.95;

    letter-spacing: -0.055em;
}


.event-gallery__heading > p {
    margin: 0;

    max-width: 450px;

    font-size: 0.9rem;
    line-height: 1.75;

    color: #716b62;
}


.event-gallery__grid {
    width: min(1500px, 100%);

    margin: 0 auto;

    display: grid;

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

    grid-auto-rows: 95px;

    gap: 14px;
}


.event-gallery__item {
    grid-column: span 4;
    grid-row: span 4;

    margin: 0;

    overflow: hidden;

    background: #ccc;
}


.event-gallery__item:nth-child(6n + 1) {
    grid-column: span 7;
    grid-row: span 6;
}


.event-gallery__item:nth-child(6n + 2) {
    grid-column: span 5;
    grid-row: span 4;
}


.event-gallery__item:nth-child(6n + 3) {
    grid-column: span 5;
    grid-row: span 5;
}


.event-gallery__item:nth-child(6n + 4) {
    grid-column: span 7;
    grid-row: span 5;
}


.event-gallery__item:nth-child(6n + 5),
.event-gallery__item:nth-child(6n + 6) {
    grid-column: span 6;
    grid-row: span 5;
}


.event-gallery__item img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform 0.6s ease;
}


.event-gallery__item:hover img {
    transform: scale(1.035);
}


@media (max-width: 900px) {

    .event-gallery__heading {
        grid-template-columns: 1fr;

        gap: 25px;
    }


    .event-gallery__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        grid-auto-rows: auto;
    }


    .event-gallery__item,
    .event-gallery__item:nth-child(n) {
        grid-column: auto;
        grid-row: auto;

        aspect-ratio: 4 / 3;
    }


    .event-gallery__item:first-child {
        grid-column: 1 / -1;

        aspect-ratio: 16 / 9;
    }

}


@media (max-width: 600px) {

    .event-gallery {
        padding:
            85px
            5%;
    }


    .event-gallery__grid {
        grid-template-columns: 1fr;

        gap: 9px;
    }


    .event-gallery__item,
    .event-gallery__item:first-child,
    .event-gallery__item:nth-child(n) {
        grid-column: auto;

        aspect-ratio: 4 / 3;
    }

}