/* Let Elementor sections carry our full-bleed design without builder padding/width */
.elementor-section.gs-section > .elementor-container{max-width:100%!important;margin:0!important}
.gs-section .elementor-column,
.gs-section .elementor-widget-wrap,
.gs-section .elementor-widget-html{padding:0!important;margin:0!important;width:100%}
.gs-section .elementor-widget-container{padding:0!important;margin:0!important}
body:not(.elementor-editor-active) .gs-section{overflow:visible}
/* header/footer templates sit outside the page flow the same way the prototype did */
.ehf-header .elementor-section > .elementor-container,
.ehf-footer .elementor-section > .elementor-container{max-width:100%;margin:0}
.ehf-header .elementor-widget-wrap,
.ehf-footer .elementor-widget-wrap{padding:0}
/* Hello Elementor resets we don't want fighting the design */
.site-header, .site-footer{display:none}

/* ---- WordPress-menu markup mapped onto the design ---- */
/* header: wp_nav_menu outputs <ul class="nav-links"> — matches the design already */
.nav-links li{list-style:none}
.nav-links a.active,
.nav-links .current-menu-item > a{opacity:1;color:var(--brass)}

/* mobile menu */
.mobile-menu .mm-links{list-style:none;display:flex;flex-direction:column;gap:0;margin:0;padding:0}
.mobile-menu .mm-links li{list-style:none}
.mobile-menu .mm-links a{
  display:block;font-family:var(--display);font-weight:800;
  font-size:clamp(2.6rem,10vw,4rem);text-transform:uppercase;line-height:1.16;
  color:var(--bone);transition:.2s;
}
.mobile-menu .mm-links a:hover{color:var(--flare)}

/* footer explore column */
.footer .footer-explore{list-style:none;display:flex;flex-direction:column;gap:12px;margin:0;padding:0}
.footer .footer-explore li{list-style:none}
.footer .footer-explore a{color:var(--smoke);font-size:.92rem;transition:.2s}
.footer .footer-explore a:hover{color:var(--flare)}

/* Elementor wraps the shortcode output — keep the fixed header truly fixed */
.ehf-header .elementor-widget-shortcode,
.ehf-header .elementor-shortcode{position:static}
.ehf-header .elementor-section,
.ehf-header .elementor-container,
.ehf-header .elementor-column,
.ehf-header .elementor-widget-wrap{position:static!important}

/* ---- Reset parent-theme + plugin link chrome inside our design ---- */
.nav a, .nav li,
.mobile-menu a, .mobile-menu li,
.footer a, .footer li, .footer ul{
  text-decoration:none;
  border:0;
  box-shadow:none;
}
.nav ul, .mobile-menu ul, .footer ul{margin:0;padding:0;list-style:none}
.nav li, .mobile-menu li, .footer li{margin:0;padding:0;list-style:none}
.nav a:hover, .footer a:hover, .mobile-menu a:hover{text-decoration:none}
/* footer non-link list items match the caption tone */
.footer ul li{color:var(--smoke);font-size:.92rem;line-height:1.6}
.footer .footer-explore{gap:12px}
.footer address{margin:0}

/* ---- seven-item primary nav: keep it on one line down to the burger ---- */
@media (max-width:1340px){ .nav-links{gap:24px} }
@media (max-width:1180px){
  .nav-links{gap:16px}
  .nav-links a{font-size:11px;letter-spacing:.11em}
  .nav-cta .btn{padding:12px 18px;font-size:11px}
}
/* mobile menu has more items now — let it scroll from the top */
.mobile-menu{
  justify-content:flex-start;overflow-y:auto;
  padding-top:112px;padding-bottom:48px;
}
.mobile-menu .mm-links a{font-size:clamp(1.8rem,6.5vw,2.7rem);line-height:1.3}
.mobile-menu .mm-cta{margin-top:26px;padding-bottom:20px}

/* ---- event titles link to their detail page ---- */
.ec-info h3 a, .ev-info h3 a{color:inherit;text-decoration:none;transition:color .25s}
.ec-info h3 a:hover, .ev-info h3 a:hover{color:var(--flare)}
/* the rail card artwork is a link now — keep it behaving like the old div */
a.ev-card-img{display:block}

/* ---- private event inquiry ---- */
.inquiry-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(36px,5vw,90px);align-items:start}
.inquiry-copy h2{margin-bottom:20px}
.inquiry-copy .lede{margin-bottom:18px}
.inquiry-copy .stay-perks{margin:22px 0 24px}
.f-field select{
  background:var(--night);border:1px solid var(--line);border-radius:12px;color:var(--bone);
  font:inherit;padding:14px 16px;width:100%;transition:border-color .25s;
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%23A79B86' stroke-width='1.6'%3E%3Cpath d='M5 8l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:42px;
}
.f-field select:focus{outline:none;border-color:var(--brass)}
.f-field input[type=date]{color-scheme:dark}
.f-field input::placeholder,.f-field textarea::placeholder{color:rgba(167,155,134,.6)}
/* honeypot: off-screen for people, still reachable for bots */
.gs-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-status{margin-top:14px;font-size:.92rem;min-height:1.2em}
.form-status.is-error{color:#F0A38A}
.form-status.is-success{color:var(--flare);font-size:1.02rem}
@media (max-width:1024px){ .inquiry-grid{grid-template-columns:1fr} }
.gs-skip-target{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ============================================================
   Horizontal containment
   The page must never scroll sideways; only the deliberate
   rails (events, After Dark) may pan horizontally.
   ============================================================ */

/* `clip` (not `hidden`) does NOT create a scroll container, so the sticky
   venue panels keep working while stray bleed is cut off. */
html, body{overflow-x:clip;max-width:100%}
/* kill the elastic sideways rubber-band + iOS back-swipe on stray drags */
html, body{overscroll-behavior-x:none}

/* the decorative outlined wordmark bled ~5px past the edge on mobile */
.venues-intro{overflow:hidden}

/* deliberate horizontal scrollers: don't chain their scroll to the page */
.ev-rail, .rail-wrap, .cal-controls .chip-group, .ec-grid.list{
  overscroll-behavior-x:contain;
}
/* let a vertical swipe that starts on a rail still scroll the page */
.ev-rail{touch-action:pan-x pan-y}

/* nothing should be able to push the layout wider than the screen */
img, video, svg, iframe{max-width:100%}

/* ---- After Dark rail: swipeable on touch ----
   The desktop auto-marquee crawls on narrow screens (same 55s across a much
   shorter track) and can't be swiped because the wrapper is overflow:hidden.
   On touch, drop the animation and let people scroll it themselves. */
@media (max-width:900px){
  .rail-wrap{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
    scroll-padding-left:var(--gutter);
    overscroll-behavior-x:contain;
    touch-action:pan-x pan-y;
    scrollbar-width:none;
    /* fade only the trailing edge so it reads as "more to the right" */
    -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);
    mask-image:linear-gradient(90deg,#000 88%,transparent);
  }
  .rail-wrap::-webkit-scrollbar{display:none}
  .rail-track{
    animation:none;
    width:max-content;
    padding-left:var(--gutter);
    padding-right:var(--gutter);
  }
  /* the duplicate set exists only to make the loop seamless */
  .rail-track .rail-set[aria-hidden="true"]{display:none}
  .rail-track .tile{scroll-snap-align:start}
}
