/**
 * GATARD Pro Pages 1.9.75
 * CMS 9 uniquement — optimisation responsive Événement / Privatisation.
 * Logique validée sur l'index et Nos emplacements : gouttières constantes,
 * espacements progressifs, tablette centrée comme le mobile et aucun débordement.
 */

html body.cms-id-9,
html body.cms-id-9 #page,
html body.cms-id-9 #wrapper,
html body.cms-id-9 #main,
html body.cms-id-9 #content-wrapper,
html body.cms-id-9 #content,
html body.cms-id-9 .page-content,
html body.cms-id-9 #gatard-events {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    overflow-x: clip !important;
}

html body.cms-id-9 #wrapper,
html body.cms-id-9 #main,
html body.cms-id-9 #content-wrapper,
html body.cms-id-9 #content,
html body.cms-id-9 .page-content,
html body.cms-id-9 section.page-cms {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    background: #fbf7f2 !important;
}

html body.cms-id-9 .breadcrumb,
html body.cms-id-9 .breadcrumb-wrapper,
html body.cms-id-9 .page-header,
html body.cms-id-9 #main > header.page-header {
    display: none !important;
}

html body.cms-id-9 #gatard-events {
    --gatard-events-gutter: 15px;
    --gatard-events-max: 1800px;
    --gatard-events-space-xs: clamp(10px, .9vw, 16px);
    --gatard-events-space-sm: clamp(16px, 1.35vw, 24px);
    --gatard-events-space-md: clamp(24px, 2.2vw, 38px);
    --gatard-events-space-lg: clamp(38px, 3.8vw, 66px);
    --gatard-events-section-gap: clamp(48px, 5vw, 86px);
    --gatard-events-card-gap: clamp(14px, 1.45vw, 24px);
    position: relative !important;
    left: auto !important;
    right: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    font-family: "Poppins", Arial, Helvetica, sans-serif !important;
    background: #fbf7f2 !important;
}

html body.cms-id-9 #gatard-events,
html body.cms-id-9 #gatard-events *,
html body.cms-id-9 #gatard-events *::before,
html body.cms-id-9 #gatard-events *::after {
    box-sizing: border-box !important;
}

html body.cms-id-9 #gatard-events img {
    display: block !important;
    max-width: 100% !important;
}

html body.cms-id-9 #gatard-events .gatard-events__inner {
    width: min(var(--gatard-events-max), calc(100% - (var(--gatard-events-gutter) * 2))) !important;
    max-width: var(--gatard-events-max) !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 0 clamp(52px, 5vw, 88px) !important;
}

/* HERO — sur tablette/mobile l'image passe avant le texte, mais conserve
   toujours une vraie zone de sécurité sous le menu flottant. */
html body.cms-id-9 #gatard-events .gatard-events__hero {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr) !important;
    align-items: center !important;
    gap: clamp(30px, 4vw, 72px) !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: clamp(34px, 3.5vw, 62px) 0 0 !important;
    overflow: visible !important;
    transform: none !important;
}

html body.cms-id-9 #gatard-events .gatard-events__hero-copy,
html body.cms-id-9 #gatard-events .gatard-events__hero-media {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}

html body.cms-id-9 #gatard-events .gatard-events__hero-copy {
    z-index: 2 !important;
    padding: 0 !important;
}

html body.cms-id-9 #gatard-events .gatard-events__hero-media {
    overflow: hidden !important;
    border: 0 !important;
    border-radius: clamp(14px, 1.2vw, 19px) !important;
    background: #fffdf9 !important;
    box-shadow: 0 18px 50px rgba(45, 34, 20, .10) !important;
    isolation: isolate !important;
    clip-path: none !important;
    mask: none !important;
    -webkit-mask: none !important;
}

html body.cms-id-9 #gatard-events .gatard-events__hero-media::before,
html body.cms-id-9 #gatard-events .gatard-events__hero-media::after,
html body.cms-id-9 #gatard-events .gatard-events__brush {
    display: none !important;
    content: none !important;
}

html body.cms-id-9 #gatard-events .gatard-events__hero-media > img {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    object-fit: contain !important;
    object-position: center !important;
    border-radius: inherit !important;
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
}

html body.cms-id-9 #gatard-events .gatard-events__eyebrow {
    margin: 0 !important;
    font-family: "Poppins", Arial, Helvetica, sans-serif !important;
    font-size: clamp(10.5px, .72vw, 13px) !important;
    line-height: 1.35 !important;
}

html body.cms-id-9 #gatard-events .gatard-events__hero-copy h1 {
    width: min(100%, 820px) !important;
    margin: clamp(14px, 1.5vw, 24px) 0 0 !important;
    font-family: "Poppins", Arial, Helvetica, sans-serif !important;
    font-size: clamp(42px, 4.35vw, 76px) !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 1.02 !important;
    letter-spacing: -.035em !important;
    text-wrap: balance !important;
}

html body.cms-id-9 #gatard-events .gatard-events__hero-copy h1 span,
html body.cms-id-9 #gatard-events .gatard-events__hero-copy h1 em {
    font-family: inherit !important;
    font-style: normal !important;
    font-weight: inherit !important;
}

html body.cms-id-9 #gatard-events .gatard-events__script {
    margin-top: clamp(11px, 1vw, 17px) !important;
    font-size: clamp(16px, 1.25vw, 22px) !important;
    line-height: 1.35 !important;
}

html body.cms-id-9 #gatard-events .gatard-events__hero-copy p {
    width: min(100%, 720px) !important;
    margin: clamp(16px, 1.7vw, 27px) 0 0 !important;
    font-family: "Poppins", Arial, Helvetica, sans-serif !important;
    font-size: clamp(14px, .96vw, 17px) !important;
    line-height: 1.65 !important;
    overflow-wrap: anywhere !important;
}

html body.cms-id-9 #gatard-events .gatard-events__btn,
html body.cms-id-9 #gatard-events .gatard-events__small-btn {
    min-height: clamp(47px, 3vw, 53px) !important;
    padding: 0 clamp(18px, 1.55vw, 27px) !important;
    font-family: "Poppins", Arial, Helvetica, sans-serif !important;
    font-size: clamp(12px, .78vw, 14px) !important;
}

html body.cms-id-9 #gatard-events .gatard-events__btn {
    margin-top: clamp(21px, 1.9vw, 31px) !important;
}

/* AVANTAGES */
html body.cms-id-9 #gatard-events .gatard-events__features {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: var(--gatard-events-card-gap) !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: clamp(28px, 3vw, 50px) 0 0 !important;
    padding: 0 !important;
}

html body.cms-id-9 #gatard-events .gatard-events__feature {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(9px, .85vw, 13px) !important;
    min-width: 0 !important;
    min-height: clamp(62px, 4vw, 72px) !important;
    margin: 0 !important;
    padding: clamp(12px, 1vw, 16px) clamp(12px, 1.2vw, 19px) !important;
    text-align: center !important;
}

html body.cms-id-9 #gatard-events .gatard-events__feature strong {
    min-width: 0 !important;
    font-family: "Poppins", Arial, Helvetica, sans-serif !important;
    font-size: clamp(12px, .83vw, 15px) !important;
    line-height: 1.35 !important;
    overflow-wrap: anywhere !important;
}

/* TITRES */
html body.cms-id-9 #gatard-events .gatard-events__section-title,
html body.cms-id-9 #gatard-events .gatard-events__commitment-title {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(9px, 1.2vw, 19px) !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: var(--gatard-events-section-gap) 0 clamp(22px, 2.5vw, 39px) !important;
    padding: 0 !important;
    text-align: center !important;
}

html body.cms-id-9 #gatard-events .gatard-events__section-title h2,
html body.cms-id-9 #gatard-events .gatard-events__commitment-title h2 {
    min-width: 0 !important;
    margin: 0 !important;
    font-family: "Poppins", Arial, Helvetica, sans-serif !important;
    font-size: clamp(27px, 2.45vw, 42px) !important;
    font-weight: 700 !important;
    line-height: 1.12 !important;
    text-align: center !important;
    text-wrap: balance !important;
}

html body.cms-id-9 #gatard-events .gatard-events__section-title--gallery > div {
    min-width: 0 !important;
    text-align: center !important;
}

html body.cms-id-9 #gatard-events .gatard-events__section-title--gallery p {
    width: min(100%, 900px) !important;
    margin: 9px auto 0 !important;
    font-size: clamp(13px, .9vw, 16px) !important;
    line-height: 1.55 !important;
}

/* CARTES ÉVÉNEMENTS */
html body.cms-id-9 #gatard-events .gatard-events__cards {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: var(--gatard-events-card-gap) !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

html body.cms-id-9 #gatard-events .gatard-event-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 100% !important;
    margin: 0 !important;
    padding: 0 0 clamp(18px, 1.5vw, 24px) !important;
    overflow: hidden !important;
    border-radius: clamp(14px, 1vw, 18px) !important;
    transform: none !important;
}

html body.cms-id-9 #gatard-events .gatard-event-card figure {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    aspect-ratio: 16 / 10 !important;
    overflow: hidden !important;
}

html body.cms-id-9 #gatard-events .gatard-event-card figure > img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
}

html body.cms-id-9 #gatard-events .gatard-event-card__icon.gatard-events__round-ico {
    width: clamp(52px, 4vw, 66px) !important;
    height: clamp(52px, 4vw, 66px) !important;
    margin: clamp(-29px, -1.9vw, -23px) auto 11px !important;
}

html body.cms-id-9 #gatard-events .gatard-event-card h3 {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 clamp(14px, 1.2vw, 20px) !important;
    font-family: "Poppins", Arial, Helvetica, sans-serif !important;
    font-size: clamp(16px, 1.05vw, 20px) !important;
    line-height: 1.26 !important;
    text-align: center !important;
}

html body.cms-id-9 #gatard-events .gatard-event-card p {
    flex: 1 1 auto !important;
    width: 100% !important;
    margin: 9px 0 0 !important;
    padding: 0 clamp(14px, 1.2vw, 20px) !important;
    font-family: "Poppins", Arial, Helvetica, sans-serif !important;
    font-size: clamp(13px, .84vw, 15px) !important;
    line-height: 1.55 !important;
    text-align: center !important;
    overflow-wrap: anywhere !important;
}

/* ENGAGEMENT */
html body.cms-id-9 #gatard-events .gatard-events__commitment {
    width: 100% !important;
    min-width: 0 !important;
    margin: var(--gatard-events-section-gap) 0 0 !important;
    padding: clamp(26px, 3.2vw, 52px) !important;
    border-radius: clamp(15px, 1.2vw, 20px) !important;
    overflow: hidden !important;
}

html body.cms-id-9 #gatard-events .gatard-events__commitment .gatard-events__commitment-title {
    margin: 0 0 clamp(21px, 2.3vw, 36px) !important;
}

html body.cms-id-9 #gatard-events .gatard-events__commitment-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: var(--gatard-events-card-gap) !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

html body.cms-id-9 #gatard-events .gatard-events__commitment-grid article {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: clamp(17px, 1.5vw, 24px) clamp(11px, 1vw, 17px) !important;
    text-align: center !important;
}

html body.cms-id-9 #gatard-events .gatard-events__commitment-grid article h3 {
    font-family: "Poppins", Arial, Helvetica, sans-serif !important;
    font-size: clamp(14px, .95vw, 17px) !important;
    line-height: 1.3 !important;
}

html body.cms-id-9 #gatard-events .gatard-events__commitment-grid article p {
    margin-top: 8px !important;
    font-family: "Poppins", Arial, Helvetica, sans-serif !important;
    font-size: clamp(12.5px, .82vw, 14.5px) !important;
    line-height: 1.5 !important;
}

/* PROJET */
html body.cms-id-9 #gatard-events .gatard-events__project {
    display: grid !important;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.12fr) minmax(220px, .58fr) !important;
    align-items: center !important;
    gap: clamp(20px, 2.7vw, 42px) !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: var(--gatard-events-section-gap) 0 0 !important;
    padding: clamp(22px, 2.7vw, 40px) !important;
    border-radius: clamp(15px, 1.2vw, 20px) !important;
    overflow: hidden !important;
    background: #fffdf9 !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project figure,
html body.cms-id-9 #gatard-events .gatard-events__project-copy,
html body.cms-id-9 #gatard-events .gatard-events__project-list {
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project figure {
    overflow: hidden !important;
    border-radius: 14px !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project figure img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: center !important;
    border-radius: inherit !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project-copy h2 {
    margin: 0 !important;
    font-family: "Poppins", Arial, Helvetica, sans-serif !important;
    font-size: clamp(27px, 2.2vw, 41px) !important;
    line-height: 1.08 !important;
    text-wrap: balance !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project-copy p {
    margin: clamp(13px, 1.2vw, 18px) 0 0 !important;
    font-family: "Poppins", Arial, Helvetica, sans-serif !important;
    font-size: clamp(13.5px, .9vw, 16px) !important;
    line-height: 1.6 !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project-copy .gatard-events__small-btn {
    width: auto !important;
    margin-top: clamp(17px, 1.5vw, 23px) !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project-list {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: clamp(10px, 1vw, 15px) !important;
    padding-left: clamp(17px, 2vw, 30px) !important;
    border-left: 1px dashed rgba(191, 135, 50, .48) !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project-list p {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 11px !important;
    min-width: 0 !important;
    margin: 0 !important;
    font-family: "Poppins", Arial, Helvetica, sans-serif !important;
    font-size: clamp(12.5px, .8vw, 14px) !important;
    line-height: 1.45 !important;
}

/* GALERIE */
html body.cms-id-9 #gatard-events .gatard-events__gallery {
    width: 100% !important;
    min-width: 0 !important;
    margin: var(--gatard-events-section-gap) 0 0 !important;
    padding: 0 0 clamp(26px, 2.8vw, 46px) !important;
    overflow: visible !important;
}

html body.cms-id-9 #gatard-events .gatard-events__gallery .gatard-events__section-title {
    margin-top: 0 !important;
}

html body.cms-id-9 #gatard-events .gatard-events__gallery-wrap {
    display: grid !important;
    grid-template-columns: clamp(38px, 3vw, 46px) minmax(0, 1fr) clamp(38px, 3vw, 46px) !important;
    align-items: center !important;
    gap: clamp(8px, .9vw, 13px) !important;
    width: 100% !important;
    min-width: 0 !important;
}

html body.cms-id-9 #gatard-events .gatard-events__gallery-viewport {
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

html body.cms-id-9 #gatard-events .gatard-events__gallery-track {
    display: flex !important;
    align-items: stretch !important;
    gap: clamp(10px, 1vw, 14px) !important;
    width: max-content !important;
    min-width: 100% !important;
}

html body.cms-id-9 #gatard-events .gatard-events__gallery-item,
html body.cms-id-9 #gatard-events .gatard-events__gallery-track > .gatard-events__gallery-item {
    flex: 0 0 calc((100% - 42px) / 4) !important;
    width: calc((100% - 42px) / 4) !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    border-radius: clamp(11px, .9vw, 15px) !important;
    overflow: hidden !important;
}

html body.cms-id-9 #gatard-events .gatard-events__gallery-open {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 10 !important;
    overflow: hidden !important;
}

html body.cms-id-9 #gatard-events .gatard-events__gallery-item img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
}

html body.cms-id-9 #gatard-events .gatard-events__slider-btn {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    align-self: center !important;
    justify-self: center !important;
    transform: none !important;
}

/* TABLETTE — même disposition centrée et verticale que le mobile/index. */
@media (min-width: 768px) and (max-width: 1199.98px) {
    html body.cms-id-9 #gatard-events {
        --gatard-events-section-gap: clamp(48px, 6.4vw, 70px);
        --gatard-events-card-gap: clamp(14px, 2vw, 21px);
    }

    html body.cms-id-9 #gatard-events .gatard-events__hero {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: clamp(24px, 3.4vw, 36px) !important;
        padding-top: max(34px, calc(var(--gatard-mobile-menu-safe-offset, 0px) + 22px), calc(var(--ccm-quick-real-height, 0px) + 18px)) !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__hero-media {
        order: 1 !important;
        width: min(100%, 980px) !important;
        margin: 0 auto !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__hero-copy {
        order: 2 !important;
        width: min(100%, 900px) !important;
        margin: 0 auto !important;
        padding: 0 !important;
        text-align: center !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__eyebrow,
    html body.cms-id-9 #gatard-events .gatard-events__hero-copy h1,
    html body.cms-id-9 #gatard-events .gatard-events__script,
    html body.cms-id-9 #gatard-events .gatard-events__hero-copy p {
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__eyebrow {
        justify-content: center !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__hero-copy h1 {
        width: min(100%, 850px) !important;
        font-size: clamp(43px, 6.25vw, 69px) !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__hero-copy p {
        width: min(100%, 760px) !important;
        font-size: clamp(14.5px, 1.7vw, 17px) !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__btn {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__features {
        width: min(100%, 980px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__cards {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__commitment-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project {
        display: flex !important;
        flex-direction: column !important;
        width: min(100%, 1100px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding: 0 !important;
        gap: 0 !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project figure {
        order: 1 !important;
        width: 100% !important;
        border-radius: 0 !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project figure img {
        width: 100% !important;
        border-radius: 0 !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project-copy {
        order: 2 !important;
        width: 100% !important;
        padding: clamp(28px, 4vw, 46px) clamp(24px, 5vw, 58px) clamp(18px, 2.6vw, 28px) !important;
        text-align: center !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project-copy h2,
    html body.cms-id-9 #gatard-events .gatard-events__project-copy p {
        width: min(100%, 760px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project-copy .gatard-events__small-btn {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project-list {
        order: 3 !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        width: 100% !important;
        padding: 0 clamp(24px, 5vw, 58px) clamp(28px, 4vw, 44px) !important;
        border: 0 !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project-list p {
        grid-template-columns: 42px minmax(0, 1fr) !important;
        text-align: left !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__gallery-item,
    html body.cms-id-9 #gatard-events .gatard-events__gallery-track > .gatard-events__gallery-item {
        flex-basis: calc((100% - 28px) / 3) !important;
        width: calc((100% - 28px) / 3) !important;
    }
}

/* Tablette compacte : les avantages passent en colonne, sans étirer les blocs. */
@media (min-width: 768px) and (max-width: 899.98px) {
    html body.cms-id-9 #gatard-events .gatard-events__features {
        grid-template-columns: minmax(0, 1fr) !important;
        width: min(100%, 760px) !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__feature {
        justify-content: center !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project-list {
        grid-template-columns: minmax(0, 1fr) !important;
        width: min(100%, 650px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* MOBILE */
@media (max-width: 767.98px) {
    html body.cms-id-9 #gatard-events {
        --gatard-events-section-gap: 44px;
        --gatard-events-card-gap: 16px;
    }

    html body.cms-id-9 #gatard-events .gatard-events__inner {
        width: calc(100% - 30px) !important;
        margin-left: 15px !important;
        margin-right: 15px !important;
        padding-bottom: 48px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__hero {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 20px !important;
        padding-top: max(26px, calc(var(--gatard-mobile-menu-safe-offset, 0px) + 18px), calc(var(--ccm-quick-real-height, 0px) + 16px)) !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__hero-media {
        order: 1 !important;
        width: 100% !important;
        margin: 0 auto !important;
        border-radius: 14px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__hero-copy {
        order: 2 !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: center !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__eyebrow {
        justify-content: center !important;
        margin: 0 auto !important;
        font-size: 10.5px !important;
        text-align: center !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__hero-copy h1 {
        width: min(100%, 560px) !important;
        margin: 13px auto 0 !important;
        font-size: clamp(32px, 9.8vw, 46px) !important;
        line-height: 1.03 !important;
        text-align: center !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__script {
        margin: 10px auto 0 !important;
        font-size: clamp(15px, 4.5vw, 19px) !important;
        text-align: center !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__hero-copy p {
        width: min(100%, 540px) !important;
        margin: 15px auto 0 !important;
        font-size: clamp(13.5px, 3.75vw, 15px) !important;
        line-height: 1.62 !important;
        text-align: center !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__btn,
    html body.cms-id-9 #gatard-events .gatard-events__small-btn {
        justify-content: center !important;
        width: 100% !important;
        min-height: 47px !important;
        font-size: 12.5px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__btn {
        margin: 19px auto 0 !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__features {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 10px !important;
        width: 100% !important;
        margin: 24px auto 0 !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__feature {
        justify-content: center !important;
        min-height: 58px !important;
        padding: 11px 13px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__section-title,
    html body.cms-id-9 #gatard-events .gatard-events__commitment-title {
        gap: 7px !important;
        margin: var(--gatard-events-section-gap) 0 20px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__section-title h2,
    html body.cms-id-9 #gatard-events .gatard-events__commitment-title h2 {
        font-size: clamp(20px, 6.2vw, 30px) !important;
        line-height: 1.12 !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__section-title:not(.gatard-events__section-title--gallery) h2 {
        white-space: nowrap !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__cards {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 18px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-event-card {
        padding-bottom: 18px !important;
        border-radius: 14px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-event-card figure {
        aspect-ratio: 16 / 9.5 !important;
    }

    html body.cms-id-9 #gatard-events .gatard-event-card__icon.gatard-events__round-ico {
        width: 55px !important;
        height: 55px !important;
        margin: -27px auto 10px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-event-card h3 {
        padding: 0 15px !important;
        font-size: 17px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-event-card p {
        padding: 0 15px !important;
        font-size: 14px !important;
        line-height: 1.55 !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__commitment {
        padding: 23px 14px !important;
        border-radius: 15px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__commitment-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__commitment-grid article {
        padding: 16px 10px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        padding: 0 !important;
        border-radius: 15px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project figure {
        order: 1 !important;
        width: 100% !important;
        border-radius: 0 !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project figure img {
        width: 100% !important;
        border-radius: 0 !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project-copy {
        order: 2 !important;
        width: 100% !important;
        padding: 22px 16px 17px !important;
        text-align: center !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project-copy h2 {
        font-size: clamp(24px, 7.4vw, 33px) !important;
        line-height: 1.1 !important;
        text-align: center !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project-copy p {
        margin-top: 12px !important;
        font-size: 14.5px !important;
        line-height: 1.58 !important;
        text-align: center !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project-copy .gatard-events__small-btn {
        margin: 18px auto 0 !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project-list {
        order: 3 !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 10px !important;
        width: 100% !important;
        padding: 0 16px 22px !important;
        border: 0 !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__project-list p {
        grid-template-columns: 40px minmax(0, 1fr) !important;
        gap: 10px !important;
        font-size: 13.5px !important;
        text-align: left !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__section-title--gallery p {
        margin-top: 7px !important;
        font-size: 13px !important;
        line-height: 1.5 !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__gallery {
        padding-bottom: 16px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__gallery-wrap {
        grid-template-columns: 38px minmax(0, 1fr) 38px !important;
        gap: 8px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__gallery-track {
        gap: 8px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__gallery-item,
    html body.cms-id-9 #gatard-events .gatard-events__gallery-track > .gatard-events__gallery-item {
        flex: 0 0 calc((100% - 8px) / 2) !important;
        width: calc((100% - 8px) / 2) !important;
        min-width: 0 !important;
        max-width: none !important;
        border-radius: 11px !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__gallery-open {
        aspect-ratio: 4 / 3 !important;
    }
}

@media (max-width: 374px) {
    html body.cms-id-9 #gatard-events .gatard-events__commitment-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body.cms-id-9 #gatard-events .gatard-events__section-title:not(.gatard-events__section-title--gallery) h2 {
        font-size: 19px !important;
    }
}

@media (hover: none), (pointer: coarse) {
    html body.cms-id-9 #gatard-events .gatard-event-card:hover,
    html body.cms-id-9 #gatard-events .gatard-events__feature:hover,
    html body.cms-id-9 #gatard-events .gatard-events__commitment-grid article:hover {
        transform: none !important;
    }
}