/* -----------------------------
   Breakpoints (general tweaks)
------------------------------*/

@media (max-width: 1200px) {

    .brand {
    font-size: clamp(0.8em, 1em, 1.4em);
  }
  .hero .title {
    padding-inline: 4vw;
    font-size: 24vw;
}
.hp-tilecard {
  min-height:380px;
}
.facilities__grid {
  gap:5em;
  margin-block:2.5em;
}



  .voucher-single {
    display: flex;
    justify-content: center;
  }
  .voucher-media {
    display: none;
  }
  .page-hero__inner {
    min-height: 80vh !important;
  }
  
  .page-hero {
      background-position: right calc(-60vw) center;
  }


  /* Hide desktop sticker on mobile */
  .footer-sticker.desktop { display: none !important; }

  .footer-sticker.mobile {
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    bottom: 5vh;
    width: calc(90% - var(--spacing-lg));
    z-index: 10000;
    max-width:360px;
    display: flex;
    gap: .75rem;
    padding: 0;                /* we pad the buttons, not the wrapper */
    border-radius: 999px;
    color: #fff;
    pointer-events: none;      /* wrapper ignores taps; buttons receive them */
  }
  .footer-sticker.mobile .footer-action {
    pointer-events: auto;      /* buttons are clickable */
    flex: 1 1 0;
    background: var(--color-purple);
    color: #fff;
    border-color: rgba(255,255,255,.25);
  }

  /* “Top mode” pill that animates in */
  .footer-sticker.mobile.is-top {
    bottom: 2.75em;
    top: auto;
    left: 50%;
    transform: translate(-50%, 120%);
    opacity: 0;
    transition: transform .3s ease, opacity .3s ease;
    background: rgba(255, 255, 255, 0.45);
    backdrop-filter: blur(22px);
    padding: 0.4em;
    gap: 0.4em;
    width: calc(100% - var(--spacing-lg));
    border: 2px solid #ffffff2b;
  }
  .footer-sticker.mobile.is-top.is-visible {
    transform: translate(-50%, 0);
    opacity: 1;
  }

  /* Optional: vary the two CTAs */
  .footer-sticker.mobile .footer-action.deals { background: var(--color-purple); }
  .footer-sticker.mobile .footer-action.book  { background: var(--color-black); }



.page-hero .container {
  max-width:100%;
}

}


@media (max-width: 980px) {
    
    .mk-modal__dialog {
        max-height:90dvh;
        margin-top:35px;
        margin-bottom:20vh;
    }
    

  .page-hero__title {
    font-size: 4.8em;
}

.hp-tiles-v3 > div > * {
    grid-column: 1 / -1 !important;
}
.page-content {
    padding-block: var(--spacing-sm);
    padding-inline: var(--spacing-sm);
}
.hp-intro {
    border-bottom: 1px solid var(--color-black);
    margin-bottom: 2.25em;
}
.hp-tilecard .tile__actions > * {
    margin-top: 1em;
}
.hp-tilecard .tile__actions > *:first-child {
  margin-top:0;
}
.footer-sticker.shake {
  animation: none;
}

.hp-tiles-v3__singles article::after, .hp-tiles-v3__stack article::after {
    display:initial !important;
}

.vouchers-grid {
    display: flex;
    flex-direction: column;
    gap: 1em;
    padding: 0.5em;
}

  .footer-sticker.mobile {
    max-width:100%;
  }
  .footer-sticker .footer-action {
    padding: 1.25em;
}

.subscribe-box {
    padding:2.2rem 0.16em;
}
.subscribe-box h3 {
    padding-inline:0.5em;
}

.hp-intro_heading {
    font-size: 3em;
}

.footer-contact p {
    font-size: 1.2em;
}
footer.footer {
    margin-bottom: 2em;
}
footer .footer-legal {
  display:none;
}
.top-footer > div > div {
  min-height:100%;
  padding:0;
}
.top-footer .col-2 {
  padding-left:0;
}
footer .columns-half {
    gap: var(--spacing-sm);
}
.top-footer .quick-links li a, .top-footer .quick-links {
    width: 100%;
    padding: 1.5em 0;
    border-radius: 4px;
}
}

/* -----------------------------
   Mobile Header / Menu — Base
------------------------------*/

/* Toggle */
.site-header__toggle {
  display: none; /* shown ≤ 860px */
  width: 42px;
  height: 42px;
  border: 2px solid currentColor;
  border-radius: 2px;
  background: transparent;
  align-items: center;
  justify-content: center;
}

/* Overlay */
.mobile-menu[hidden] {
  display: none !important;
}
.mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 2000; /* above header */
  height: 100dvh;
  min-height: -webkit-fill-available;
  background: #000;
  color: #fff;
  display: flex;
  flex-direction: column;
  padding: 0 var(--container-padding, 1.25rem);
  overflow: auto;
}

/* Header bar inside overlay */
.mobile-menu__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: var(--hdr-height, 64px);
}
.brand-mini .brand {
  color: #fff;
  text-decoration: none;
  font-weight: 800;
}
.mobile-menu__close {
  appearance: none;
  border: 0;
  background: transparent;
  color: #fff;
  font-family: var(--font-mono, ui-monospace);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

/* Body & panels */
.mobile-menu__body {
  position: relative;
  flex: 1;
  display: grid;
  place-items: start;
}
.mm-panel {
  width: 100%;
}

/* Lists (shared) */
.mm-list {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: center;
}
.mm-list a,
.mm-btn {
  color: #fff;
  text-decoration: none;
  font-family: var(--font-primary);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  display: inline-block;
}

/* Level sizes */
.mm-list--level1 a {
  font-size: clamp(28px, 7vw, 52px);
  line-height: 1.15;
  padding: 0.35rem 0.6rem;
}
.mm-list--level2 a {
  font-size: clamp(22px, 6vw, 44px);
  line-height: 1.15;
  padding: 0.3rem 0.6rem;
  opacity: 0.9;
}
.mm-list--level2 a:hover {
  opacity: 1;
}

/* Level 2 state */
.mobile-menu.is-level2 .mm-level-1 {
  filter: blur(3px);
  opacity: 0.3;
  transition:
    filter 0.2s ease,
    opacity 0.2s ease;
}
.mobile-menu.is-level2 .mm-level-2 {
  display: block;
}
.mm-level-2[hidden] {
  display: none;
}

/* CTAs (share text rules with links via .mm-btn above) */
.mobile-menu__ctas {
  display: grid;
  gap: 0.6rem;
  padding: 0 0 clamp(1.2rem, 5vh, 2rem);
}
.mm-btn {
  border: 1px solid rgba(255, 255, 255, 0.85);
  border-radius: 2px;
  padding: 0.4rem 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 700;
  letter-spacing: 0.06em;
}

/* -----------------------------
   Visibility rules
------------------------------*/
@media (max-width: 1200px) {
  .site-header__toggle {
    display: inline-flex;
  }
  .site-header__nav--left,
  .site-header__nav--right {
    display: none;
  }
}

/* ===== Mobile header bar (≤ 860px) ===== */
@media (max-width: 1200px) {
  /* Force black bar with white type */

  /* Layout: brand left, MENU toggle right */
  .site-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--hdr-gap, 1rem);
    height: var(--hdr-height, 64px);
  }

  /* Brand back to normal flow (desktop version centers absolutely) */
  .site-header__brand {
    position: static;
    transform: none;
    margin: 0;
  }
  .site-header__brand .brand {
    color: #fff;
    text-decoration: none;
    font-size: clamp(0.8em, 1em, 1.4em);
  }

  /* Hide desktop nav rows on mobile */
  .site-header__nav--left,
  .site-header__nav--right {
    display: none !important;
  }

  /* Toggle shows plain “MENU” text (no box) on the right */
  .site-header__toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: transparent;
    color: #fff;
    padding-block: 1.5rem;
    height: auto;
    width: auto;
    font-size: 1em;
    text-transform: uppercase;
    font-family: var(--font-mono, ui-monospace);
  }

  /* Combined view list (single column) */
  .mm-list--combined {
    text-align: left;
    width: 100%;
    margin-inline: auto;
    padding-left: 0;
  }

  /* Remaining top-level items (Mini Golf, Arcade…) */
  .mm-top button {
    appearance: none;
    border: 0;
    background: transparent;
    color: #fff;
    padding: 0.25rem 0;
    cursor: pointer;
    font-family: var(--font-mono, ui-monospace);
    text-transform: uppercase;
    font-size: clamp(22px, 6vw, 44px);
    opacity: 0.6;
  }
  .mm-top button:hover,
  .mm-top button:focus-visible {
    opacity: 1;
    outline: none;
  }

  /* Enter animation */
  .mm-combined-enter {
    opacity: 0;
    transform: translateY(8px);
  }
  .mm-combined-enter.is-in {
    opacity: 1;
    transform: none;
    transition:
      opacity 0.22s ease,
      transform 0.22s ease;
  }
  .mm-stagger {
    opacity: 0;
    transform: translateY(8px);
  }
  .mm-stagger.is-in {
    opacity: 1;
    transform: none;
    transition:
      opacity 0.22s ease,
      transform 0.22s ease;
  }

  /* Top-level buttons/links (unified) */
  .mm-top button,
  .mm-top a,
  .mm-list--combined,
  .mm-child .mm-stagger {
    appearance: none;
    border: 0;
    background: transparent;
    color: #fff;
    padding: 0.25rem 0;
    cursor: pointer;
    font-family: var(--font-primary);
    text-transform: uppercase;
    font-size: clamp(22px, 6vw, 44px);
    text-align: left;
    font-weight: 500;
    opacity: 1;
  }
  .mm-top button:hover,
  .mm-top button:focus-visible,
  .mm-top a:hover,
  .mm-top a:focus-visible {
    opacity: 1;
    outline: none;
  }
}

/* Only affects the mobile overlay list */
.mm-top {
    border-top: 1px solid;
}
.mm-parent {
  border-top: 1px solid;
  border-bottom:1px solid;
}
.mm-top:last-child {
  border-bottom:1px solid;
}
.mobile-info {
    margin-block: 0 2.4em;
    text-align: center;
    font-size: 11pt;
}



/* -----------------------------
  Fix Gravity Forms
------------------------------*/
@media (max-width: 980px) {
    
    .chip__media {
        aspect-ratio: 2 / 1;
    }
    .chip__inner {
        min-width:50% !important;
    }


  .footer-subscribe .gform_wrapper form {
    flex-direction:column;
  }

/* Scope to your subscribe section and a safe hook class */
.subscribe-box .gform_wrapper.gf-stack,
.subscribe-box .gform_wrapper.gf-stack * { box-sizing: border-box; }

/* Kill the horizontal/table-cell layout GF applies */
.subscribe-box .gform_wrapper.gf-stack .gf_simple_horizontal .gform_body,
.subscribe-box .gform_wrapper.gf-stack .gf_simple_horizontal .gform_footer,
.subscribe-box .gform_wrapper.gf-stack .gform_body,
.subscribe-box .gform_wrapper.gf-stack .gform_footer {
  display: block !important;
  width: 100% !important;
  inline-size: 100% !important;      /* beat GF's inline-size:auto */
  max-inline-size: 100% !important;
}

/* One column stack for the fields */
.subscribe-box .gform_wrapper.gf-stack .gform_fields {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: .75rem !important;
  width: 100% !important;
}

/* Each field spans full width */
.subscribe-box .gform_wrapper.gf-stack .gfield {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding-inline-end: 0 !important;
}

/* Inputs & button full-width */
.subscribe-box .gform_wrapper.gf-stack input[type="email"],
.subscribe-box .gform_wrapper.gf-stack input[type="text"],
.subscribe-box .gform_wrapper.gf-stack .gform_button {
  display: block !important;
  width: 100% !important;
  inline-size: 100% !important;
}

/* Make sure the footer (button row) sits under the body */
.subscribe-box .gform_wrapper.gf-stack .gform_footer {
  margin-top: .75rem !important;
  padding: 0 !important;
}

/* Remove any leftover table styles GF injects */
.subscribe-box .gform_wrapper.gf-stack .gform_body,
.subscribe-box .gform_wrapper.gf-stack .gform_footer.top_label {
  table-layout: auto !important;
}
}