/* Bootstrap caps .container at 1140px above 1200px; Figma sections are 1280px, so widen it above 1300px. This file loads after bootstrap.min.css so the cascade wins without !important. */
@media (min-width: 1300px) {
    .container {
        max-width: 1280px;
    }
}

/* Subheader / Accent — shared italic script accent line, color chosen per instance via ACF (see acf-json/group_c85f5c4ab309e.json) */
.subhead-accent {
    display: block;
    margin: 0;
    font-family: 'BodoniFLF', serif;
    font-size: 24px;
    font-style: italic;
    font-weight: 700;
    line-height: normal;
}

.subhead-accent--black {
    color: var(--Black, #000000);
}

.subhead-accent--off-black {
    color: var(--Off-black, #222222);
}

.subhead-accent--purple {
    color: var(--Purple, #273671);
}

.subhead-accent--pink {
    color: var(--Pink, #FA0E7C);
}

.subhead-accent--green {
    color: var(--Green, #186730);
}

/* Body — shared paragraph style */
.text-body {
    margin: 0;
    color: var(--Off-black, #222222);
    text-align: center;
    font-family: 'museo-slab', serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
}

/* ===== Hero / Main Slider (flexible-content/sections/main_slider.php) ===== */

.hero-wrapper {
    position: relative;
    overflow: hidden;
}

.hero-wrapper .carousel-item {
    position: relative;
    height: calc(100vh - 100px);
}

.hero-wrapper .home-carousel-item {
    min-height: 620px;
    max-height: 820px;
}

.hero-wrapper .other-pages-carousel-item {
    min-height: 620px;
    max-height: 820px;
}

.hero-wrapper .carousel-image {
    position: absolute;
    inset: 0;
}

.hero-wrapper .carousel-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-wrapper .carousel-video-overlay {
    position: absolute;
    inset: 0;
    z-index: 1; /* same stacking as .carousel-image (theme.min.css), sits above the video, below .hero-content */
}

/* Per-slide headline + subtext */
.hero-content {
    position: absolute;
    inset: 0;
    z-index: 2; /* .carousel-image (theme.min.css) sits at z-index:1 and would otherwise cover this */
    display: flex;
    flex-direction: column;
    color: var(--White, #fff);
    padding: 24px;
}

.hero-content__title {
    margin: 0;
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-size: 32px;
    text-transform: uppercase;
    line-height: normal;
}

.hero-content__subtext {
    margin: 12px 0 0;
    font-family: 'museo-slab', serif;
    font-weight: 300;
    font-size: 16px;
    line-height: normal;
}

/* Homepage: left-aligned, bottom of hero, room left for the booking bar below */
.hero-content--home {
    justify-content: flex-end;
    align-items: flex-start;
    text-align: left;
    padding-bottom: 250px;
}

.hero-content--home .hero-content__title,
.hero-content--home .hero-content__subtext {
    max-width: 560px;
}

/* Inner pages: centered headline only */
.hero-content--inner {
    justify-content: center;
    align-items: center;
    text-align: center;
}

.hero-content--inner .hero-content__title {
    max-width: 680px;
}

.offer-hero__book-now {
    display: inline-block;
    margin-top: 24px;
    padding: 16px 40px;
    background: var(--Aqua, #4ec1e0);
    color: #000;
    font-family: "museo-slab", serif;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 100px;
}

/* Booking bar — same left/right bounds as .hero-content at every breakpoint, always full width of it */
.hero-booking {
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 32px;
    z-index: 5;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

@media (min-width: 768px) {
    .hero-content {
        padding: 32px 48px;
    }

    .hero-content__title {
        font-size: 40px;
    }

    .hero-content--home {
        padding-bottom: 180px;
    }

    .hero-booking {
        left: 48px;
        right: 48px;
    }
}

@media (min-width: 1200px) {
    .hero-content {
        padding: 48px 133px;
    }

    .hero-content__title {
        font-size: 48px;
    }

    .hero-content--home {
        padding-bottom: 150px;
    }

    .hero-booking {
        left: 133px;
        right: 133px;
    }
}

.hero-booking__widget {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
    background: var(--White, #fff);
    border: 3px solid var(--Aqua, #4ec1e0);
    border-radius: 10px;
}

.hero-booking__field {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    padding: 15px 14px;
    flex: 1 1 180px;
    min-width: 0;
    cursor: pointer;
    /* border-left: 1px solid rgba(34, 34, 34, 0.12); */
}

.hero-booking__field:first-child {
    border-left: none;
}

.hero-booking__field--static {
    cursor: default;
}

.hero-booking__value {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    color: var(--Off-black, #222);
    border: none;
    background: transparent;
    padding: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}

/* Placeholder text (Check-in / Check-Out) reads identically to a picked value — no faded/italic default look */
.hero-booking__value::placeholder {
    color: var(--Off-black, #222);
    opacity: 1;
}

.hero-booking__select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    max-width: 100%;
}

.hero-booking__chevron {
    width: 20px;
    height: 20px;
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.hero-booking__chevron img {
    width: 100%;
    height: 100%;
    display: block;
}

.hero-booking__submit {
    background: var(--Aqua, #4ec1e0);
    color: var(--Black, #000);
    border: none;
    border-radius: 100px;
    padding: 14px 32px;
    font-family: 'museo-slab', serif;
    font-weight: 500;
    font-size: 16px;
    text-transform: uppercase;
    cursor: pointer;
    white-space: nowrap;
}

.hero-booking__submit:hover {
    opacity: 0.9;
}

@media (min-width: 768px) {
    .hero-booking {
        flex-direction: row;
        bottom: 48px;
    }

    .hero-booking__widget {
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
        justify-content: center;
    }

    .hero-booking__field {
        flex: 1 1 180px;
        gap: 10px;
        padding: 11px 25px;
    }

    .hero-booking__value {
        font-size: 23px;
    }
}

/* Prev/next controls — circular aqua buttons, vertically centered on the hero edges */
.hero-wrapper .carousel-control-prev,
.hero-wrapper .carousel-control-next {
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    opacity: 1;
    z-index: 6;
}

.hero-wrapper .carousel-control-prev {
    left: 25px;
}

.hero-wrapper .carousel-control-next {
    right: 25px;
}

.hero-wrapper .carousel-control-prev-icon,
.hero-wrapper .carousel-control-next-icon {
    width: 50px;
    height: 50px;
    background-image: url('../images/icons/slider-arrow.svg');
    background-repeat: no-repeat;
    background-size: contain;
}

.hero-wrapper .carousel-control-prev-icon {
    transform: rotate(-90deg) scaleY(-1);
}

.hero-wrapper .carousel-control-next-icon {
    transform: rotate(-90deg);
}

/* Indicator dots */
.hero-wrapper .carousel-indicators {
    bottom: 16px;
    z-index: 6;
    margin-bottom: 0;
}

.hero-wrapper .carousel-indicators li {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.5);
    border: none;
    margin: 0 5px;
}

.hero-wrapper .carousel-indicators li.active {
    background-color: var(--Aqua, #4ec1e0);
}

/* ===== Deals and Packages (flexible-content/sections/deals_and_packages_block.php) ===== */

.deals-packages {
    position: relative;
    overflow: hidden;
    padding: 80px 0;
    background: var(--White, #fff);
}

.deals-packages::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url('../images/ripple-bg.jpg') center / cover no-repeat;
    opacity: 0.1;
    pointer-events: none;
}

.deals-packages > .container {
    position: relative;
    z-index: 1;
}

.deals-packages__intro {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    text-align: center;
    margin-bottom: 40px;
}

.deals-packages__accent {
    margin-bottom: 0;
}

.deals-packages__heading {
    margin: 0;
    max-width: 1200px;
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-size: 40px;
    text-transform: uppercase;
    line-height: normal;
    color: var(--Purple, #273671);
}

.deals-packages__body {
    max-width: 1008px;
}

.deals-packages__filter {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    margin-bottom: 40px;
}

.deals-packages__filter-label {
    margin: 0;
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-size: 19px;
    text-transform: uppercase;
    color: var(--Off-black, #222);
}

.deals-packages__tabs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
}

.deals-packages__tab {
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    padding: 10px 0;
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-size: 28px;
    text-transform: uppercase;
    color: var(--Off-black, #222);
    cursor: pointer;
    transition: color 0.2s ease, border-color 0.2s ease;
}

.deals-packages__tab.active {
    color: var(--Purple, #273671);
    border-bottom-color: var(--Gold, #fbae35);
}

.deals-packages__panel {
    display: none;
}

.deals-packages__panel.active {
    display: block;
}

.deals-packages__row.owl-carousel .owl-stage-outer {
    padding-bottom: 4px;
}

.deals-packages__row.owl-carousel .owl-stage {
    display: flex;
    align-items: stretch;
}

/* Branded prev/next — same circular-aqua-button asset/rotation as the hero and
   Three Eat Drink Block/Events & Groups Block, replacing Owl's plain "‹"/"›" text
   nav (only rendered by Owl once a category has more than 3 offers). */
.deals-packages__row.owl-carousel .owl-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    margin-top: 32px;
}

/* Owl's own default CSS hides nav via `.owl-nav.disabled { display: none }`
   (owl.carousel.css) when a breakpoint's card count doesn't exceed what fits in
   one view — same specificity as the rule above, and this file loads after Owl's,
   so without this override the disabled state would never actually hide again. */
.deals-packages__row.owl-carousel .owl-nav.disabled {
    display: none;
}

.deals-packages__row.owl-carousel .owl-nav button.owl-prev,
.deals-packages__row.owl-carousel .owl-nav button.owl-next {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 70px;
    height: 70px;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 0;
    background: url('../images/icons/slider-arrow.svg') no-repeat center;
    background-size: contain;
    cursor: pointer;
}

.deals-packages__row.owl-carousel .owl-nav button.owl-prev {
    transform: rotate(-90deg) scaleY(-1);
}

.deals-packages__row.owl-carousel .owl-nav button.owl-next {
    transform: rotate(-90deg);
}

.deals-packages__row.owl-carousel .owl-nav button span {
    display: none;
}

.deals-packages__row.owl-carousel .owl-nav .disabled {
    opacity: 0.4;
    cursor: default;
}

@media (max-width: 767px) {
    .deals-packages__row.owl-carousel .owl-nav button.owl-prev,
    .deals-packages__row.owl-carousel .owl-nav button.owl-next {
        width: 48px;
        height: 48px;
    }
}

.deals-packages__card {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--White, #fff);
    border-radius: 6px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
}

.deals-packages__card:hover {
    text-decoration: none;
    color: inherit;
}

.deals-packages__card-image {
    position: relative;
    height: 220px;
    overflow: hidden;
}

.deals-packages__card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s ease;
}

.deals-packages__card:hover .deals-packages__card-image img {
    transform: scale(1.04);
}

.deals-packages__card-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 24px;
    flex: 1 1 auto;
}

.deals-packages__card-title {
    margin: 0;
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-size: 28px;
    text-transform: uppercase;
    color: var(--Purple, #273671);
    line-height: normal;
    /* min-height is set in JS (measured from real rendered content, not a
       guessed line count) so the description below starts at the same height
       across every card in a row regardless of whether titles wrap to 1, 2,
       or more lines — see equalizeTitleHeights() below. */
}

.deals-packages__card-desc {
    margin: 0;
    font-family: "museo-slab", serif;
    font-weight: 300;
    font-size: 16px;
    color: var(--Off-black, #222);
    line-height: normal;
}

.deals-packages__card-price {
    margin: 0;
    /* Bottom-anchored, same as the "View Details" link below it: descriptions run
       1 or 2 lines depending on the offer, which left the "From $XXX" line sitting
       18px higher on some cards than others in the same row (measured on staging's
       Waterpark Deals tab, 2026-08-18: price tops 663 vs 681). Pinning the price
       to the bottom of the card body puts it on one line across the whole row —
       titles are already equalized in JS by equalizeTitleHeights(). */
    margin-top: auto;
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-size: 19px;
    text-transform: uppercase;
    color: var(--Off-black, #222);
}

.deals-packages__card-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    /* Fallback for cards with no price line — when a price IS present it owns the
       auto margin, otherwise the two would split the free space between them. */
    margin-top: auto;
    font-family: "museo-slab", serif;
    font-weight: 500;
    font-size: 16px;
    text-transform: uppercase;
    color: var(--Black, #000);
    text-decoration: none;
    width: fit-content;
}

.deals-packages__card-price + .deals-packages__card-link {
    margin-top: 0;
}

.deals-packages__card-link-arrow {
    font-size: 18px;
    line-height: 1;
}

.deals-packages__card-link:hover {
    opacity: .8;
    color: var(--Black, #000);
}

.deals-packages__empty {
    text-align: center;
    padding: 40px 0;
    color: var(--Off-black, #222);
    opacity: 0.6;
}

.deals-packages__actions {
    display: flex;
    justify-content: center;
    margin-top: 40px;
}

.deals-packages__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 30px;
    border-radius: 100px;
    background: var(--Gold, #fbae35);
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-size: 16px;
    text-transform: uppercase;
    color: var(--Purple, #273671);
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.deals-packages__button:hover {
    opacity: 0.85;
    color: var(--Purple, #273671);
    text-decoration: none;
}

@media (max-width: 991px) {
    .deals-packages { padding: 60px 0; }
    .deals-packages__heading { font-size: 32px; }
    .deals-packages__tab { font-size: 22px; }
    .deals-packages__tabs { gap: 20px; }
}

@media (max-width: 767px) {
    .deals-packages { padding: 40px 0; }
    .deals-packages__heading { font-size: 26px; }
    .deals-packages__card-title { font-size: 22px; }
    .deals-packages__tab { font-size: 16px; }
    .deals-packages__tabs { gap: 14px; }
    .deals-packages__card-image { height: 180px; }
}

/* ===== Deals Archive (archive-offer.php) — same look as Deals and Packages block, full paginated grid instead of a slider ===== */

.deals-archive {
    padding: 80px 15px;
    max-width: 1280px;
    margin: 0 auto;
}

.deals-archive__intro {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    text-align: center;
    margin-bottom: 40px;
}

.deals-archive__accent {
    margin-bottom: 0;
}

.deals-archive__heading {
    margin: 0;
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-size: 40px;
    text-transform: uppercase;
    line-height: normal;
    color: var(--Purple, #273671);
}

.deals-archive__filter {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    margin-bottom: 48px;
}

.deals-archive__filter-label {
    margin: 0;
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-size: 19px;
    text-transform: uppercase;
    color: var(--Off-black, #222);
}

.deals-archive__tabs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
}

.deals-archive__tab {
    border-bottom: 3px solid transparent;
    padding: 10px 0;
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-size: 22px;
    text-transform: uppercase;
    color: var(--Off-black, #222);
    text-decoration: none;
    transition: color 0.2s ease, border-color 0.2s ease;
}

.deals-archive__tab:hover {
    color: var(--Purple, #273671);
    text-decoration: none;
}

.deals-archive__tab.active {
    color: var(--Purple, #273671);
    border-bottom-color: var(--Gold, #fbae35);
}

.deals-archive__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-bottom: 48px;
}

.deals-archive__card {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--White, #fff);
    border-radius: 6px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
}

.deals-archive__card:hover {
    text-decoration: none;
    color: inherit;
}

.deals-archive__card-image {
    position: relative;
    height: 220px;
    overflow: hidden;
}

.deals-archive__card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s ease;
}

.deals-archive__card:hover .deals-archive__card-image img {
    transform: scale(1.04);
}

.deals-archive__card-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 24px;
    flex: 1 1 auto;
}

.deals-archive__card-title {
    margin: 0;
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-size: 28px;
    text-transform: uppercase;
    color: var(--Purple, #273671);
    line-height: normal;
}

.deals-archive__card-desc {
    margin: 0;
    font-family: "museo-slab", serif;
    font-weight: 300;
    font-size: 16px;
    color: var(--Off-black, #222);
    line-height: normal;
}

.deals-archive__card-price {
    margin: 0;
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-size: 19px;
    text-transform: uppercase;
    color: var(--Off-black, #222);
}

.deals-archive__card-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: auto;
    font-family: "museo-slab", serif;
    font-weight: 500;
    font-size: 16px;
    text-transform: uppercase;
    color: var(--Black, #000);
    text-decoration: none;
    width: fit-content;
}

.deals-archive__card-link-arrow {
    font-size: 18px;
    line-height: 1;
}

.deals-archive__card-link:hover {
    opacity: .8;
    color: var(--Black, #000);
}

.deals-archive__empty {
    text-align: center;
    padding: 40px 0;
    color: var(--Off-black, #222);
    opacity: 0.6;
}

.deals-archive__grid + .pagination,
.deals-archive nav.navigation {
    display: flex;
    justify-content: center;
}

.deals-archive ul.page-numbers {
    display: flex;
    list-style: none;
    gap: 8px;
    padding: 0;
    margin: 0;
}

.deals-archive ul.page-numbers li a,
.deals-archive ul.page-numbers li span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 8px;
    border-radius: 100px;
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    color: var(--Off-black, #222);
    text-decoration: none;
}

.deals-archive ul.page-numbers li .current {
    background: var(--Gold, #fbae35);
    color: var(--Purple, #273671);
}

@media (max-width: 991px) {
    .deals-archive { padding: 60px 15px; }
    .deals-archive__heading { font-size: 32px; }
    .deals-archive__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 575px) {
    .deals-archive { padding: 40px 15px; }
    .deals-archive__heading { font-size: 26px; }
    .deals-archive__grid { grid-template-columns: 1fr; }
    .deals-archive__tabs { gap: 14px; }
    .deals-archive__tab { font-size: 16px; }
}

/* Single post (Press & Media, etc.) — brand type, previously unstyled */
#single-wrapper .entry-title {
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-size: 40px;
    text-transform: uppercase;
    color: var(--Purple, #273671);
}

#single-wrapper .entry-meta {
    font-family: "museo-slab", serif;
    font-weight: 300;
    font-size: 14px;
    color: var(--Image-Dark, #666666);
}

#single-wrapper .entry-content,
#single-wrapper .entry-content p {
    font-family: "museo-slab", serif;
    font-weight: 300;
    font-size: 16px;
    line-height: 1.6;
    color: var(--Off-black, #222222);
}

#single-wrapper .entry-content h2,
#single-wrapper .entry-content h3,
#single-wrapper .entry-content h4 {
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--Purple, #273671);
}

#single-wrapper .entry-content a {
    color: var(--Aqua, #4ec1e0);
}

@media (max-width: 767px) {
    #single-wrapper .entry-title { font-size: 28px; }
}

/* ==========================================================================
   Modal close button
   --------------------------------------------------------------------------
   The theme ships Bootstrap 4.4.1 CSS (css/bootstrap.min.css) but Bootstrap
   5.3 JS (functions.php). `.btn-close` is a Bootstrap 5-only class, so the
   dismiss button in card-grid popups rendered as an unstyled, iconless button
   — invisible on desktop and untappable on mobile. Dismissal itself works
   (BS5 JS reads `data-bs-dismiss`), so this only restores the visuals; keep
   the BS5 markup rather than swapping to BS4's `.close`.
   ========================================================================== */

.btn-close {
    box-sizing: content-box;
    width: 16px;
    height: 16px;
    padding: 14px;
    margin: -14px -14px -14px auto;
    border: 0;
    border-radius: 50%;
    background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center / 16px no-repeat;
    opacity: 0.5;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
}

.btn-close:hover,
.btn-close:focus {
    opacity: 1;
    text-decoration: none;
}

.btn-close:focus-visible {
    outline: 2px solid var(--Aqua, #4ec1e0);
    outline-offset: 2px;
}

/* Single event "Book Now" button (inc/event-booking.php) — same pill treatment
   as .offer-hero__book-now, but on a light background so it needs its own rule. */
.event-booking {
    margin: 24px 0 32px;
}

.event-booking__button,
.event-booking__button:hover,
.event-booking__button:focus {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 30px;
    background: var(--Aqua, #4ec1e0);
    border-radius: 100px;
    font-family: "museo-slab", serif;
    font-weight: 500;
    font-size: 16px;
    text-transform: uppercase;
    text-align: center;
    color: var(--Black, #000) !important;
    text-decoration: none;
    white-space: nowrap;
    border-bottom: none !important;
}

.event-booking__button:hover {
    opacity: 0.85;
}