/* GENERATED FILE — do not edit directly
   Source: assets/css/[0-9][0-9]-*.css
   Build:  tools/build-css.sh
*/

/* ---- 00-legacy.css ---- */
:root{
  --bg:#FBF5EC;
  --bg2:#EAF6FF;
  --surface:#FFFFFF;
  --text:#0B1B1C;
  --muted:#51606A;
  --accent:#12C7B7;
  --accent2:#FF8A00;
  --danger:#EF4444;

  --shadow:0 20px 60px rgba(0,0,0,.45);
  --radius:18px;
  --radius2:26px;
  --container:1280px;
    /* Missing base surfaces used later */
  --alt: var(--bg2);
  --panel: color-mix(in srgb, var(--surface) 92%, var(--bg2));


  /* Derived (updates automatically when Customizer variables change) */
  --card:  color-mix(in srgb, var(--surface) 70%, transparent);
  --card2: color-mix(in srgb, var(--surface) 86%, transparent);
  --line:  color-mix(in srgb, var(--text) 12%, transparent);
  --shadow-soft: 0 18px 55px color-mix(in srgb, #000 32%, transparent);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: var(--ze-font-body, ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji");
  background:
    radial-gradient(900px 520px at 12% -10%, color-mix(in srgb, var(--accent2) 14%, transparent), transparent 60%),
    radial-gradient(1000px 620px at 88% 10%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 62%),
    linear-gradient(180deg,var(--bg),var(--bg2));
  color:var(--text);
  overflow-x:hidden;
}

/* Beach preset: “Citrus Luxe” background (NO image assets; gradients + tiny inline grain) */
body.ze-mode-beach{
  background-color: var(--bg2);
  background-image:
    radial-gradient(1100px 600px at 18% -10%, rgba(18,199,183,.18), transparent 60%),
    radial-gradient(900px 520px at 88% 12%, rgba(255,138,0,.12), transparent 55%),
    radial-gradient(1000px 680px at 50% 110%, rgba(18,199,183,.10), transparent 55%),
    linear-gradient(180deg, var(--bg2) 0%, var(--bg) 58%, #ffffff 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");
  background-repeat: no-repeat,no-repeat,no-repeat,no-repeat,repeat;
  background-size: auto,auto,auto,auto,240px 240px;
  background-blend-mode: normal,normal,normal,normal,multiply;
  background-attachment: fixed,fixed,fixed,fixed,fixed;
}
a{color:inherit}

/* Typography (Customizer → Style → Font style) */
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,
.hero__title,
.ze-welcome__title,
.event-card__title,
.product_title,
.woocommerce h1,.woocommerce h2,.woocommerce h3{
  font-family: var(--ze-font-heading, var(--ze-font-body, ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial));
}

/* Global link styling (Customizer → Style) */
.site-main a:not(.btn):not(.icon-btn):not(.woocommerce a.button):not(.woocommerce button.button):not(.woocommerce input.button):not(.nav-links a):not(.nav-links-mobile a){
  color: var(--ze-link, var(--accent));
  text-decoration:none;
}

.site-main a:not(.btn):not(.icon-btn):not(.woocommerce a.button):not(.woocommerce button.button):not(.woocommerce input.button):not(.nav-links a):not(.nav-links-mobile a):hover{
  color: var(--ze-link-hover, var(--accent2));
}

/* Underline modes */
.ze-link-u-underline .site-main a:not(.btn):not(.icon-btn):not(.woocommerce a.button):not(.woocommerce button.button):not(.woocommerce input.button){
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ze-link-u-animated .site-main a:not(.btn):not(.icon-btn):not(.woocommerce a.button):not(.woocommerce button.button):not(.woocommerce input.button){
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0 2px;
  background-position: 0 calc(100% - 1px);
  background-repeat: no-repeat;
  transition: background-size .18s ease, color .18s ease;
}

.ze-link-u-animated .site-main a:not(.btn):not(.icon-btn):not(.woocommerce a.button):not(.woocommerce button.button):not(.woocommerce input.button):hover{
  background-size: 100% 2px;
}

.ze-link-u-none .site-main a:not(.btn):not(.icon-btn):not(.woocommerce a.button):not(.woocommerce button.button):not(.woocommerce input.button){
  background-image:none;
  text-decoration:none;
}

/* Focus ring */
:focus-visible{
  outline: 2px solid color-mix(in srgb, var(--ze-focus, var(--accent)) 70%, transparent);
  outline-offset: 2px;
  border-radius: 10px;
}

img{max-width:100%;height:auto;display:block}
.container{max-width:var(--container);margin:0 auto;padding:0 clamp(14px, 2.2vw, 22px)}
.section{padding:52px 0}

/* -------------------------------------------------------------------------
   Section styling + dividers (Site-wide)
   ------------------------------------------------------------------------- */

/* IMPORTANT: use background-color (not shorthand background)
   so any background-image set by blocks/plugins isn't wiped.
*/
.ze-section{
  position:relative;
  background-color: var(--ze-sec-bg, transparent);
  background-image: var(--ze-sec-bg-img, none); /* <-- THIS enables Colour 2 gradients */
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  color: var(--ze-sec-text, inherit);
  z-index: var(--ze-sec-z, 1);
  overflow: visible;
  /* Global glow strength (can be overridden per-section via inline vars) */
  --ze-sec-glow: var(--ze-glow-strength, 1);
}

/* =========================================================
   Section background gradients (per section, Customizer driven)
   Uses:
     --ze-sec-bg   (colour 1)
     --ze-sec-bg2  (colour 2, optional)
     --ze-sec-grad-on (0/1)
========================================================= */

.section.ze-section{
  /* defaults */
  --ze-sec-grad-on: var(--ze-sec-grad-on, 0);
  --ze-sec-grad-angle: var(--ze-sec-grad-angle, 165deg);
  --ze-sec-grad-opacity: var(--ze-sec-grad-opacity, .58);

  /* If colour 2 not set, we auto-generate a subtle second tone from colour 1 */
  --ze-sec-bg2-final: var(--ze-sec-bg2, color-mix(in srgb, var(--ze-sec-bg, transparent) 82%, #ffffff));

  /* Adjacent section fallbacks (used by seamless divider mode) */
  --ze-prev-bg2-final: var(--ze-prev-bg2, color-mix(in srgb, var(--ze-prev-bg, transparent) 82%, #ffffff));
  --ze-next-bg2-final: var(--ze-next-bg2, color-mix(in srgb, var(--ze-next-bg, transparent) 82%, #ffffff));
}

/* -------------------------------------------------------------------------
   Section background modes
   - glow: solid background + subtle ambient glow (modern)
   - gradient: real gradient background (no glow)
   - solid: plain solid background (no glow)
   ------------------------------------------------------------------------- */

.ze-section[data-bg-mode="gradient"]{
  background-image: linear-gradient(
    var(--ze-sec-grad-angle, 165deg),
    var(--ze-sec-bg, var(--bg)) 0%,
    var(--ze-sec-bg2-final, var(--bg2)) 100%
  );
}

.ze-section[data-bg-mode="solid"],
.ze-section[data-bg-mode="glow"]{
  background-image: none;
}

/* Gradient + Solid should not use ambient glow */
.ze-section[data-bg-mode="gradient"],
.ze-section[data-bg-mode="solid"]{
  --ze-sec-glow: 0;
}

/* Minimal mode: flatten effects */
body.ze-style-minimal{
  --ze-glow-strength: 0;
}
body.ze-style-minimal .ze-section::after{opacity:0;}
body.ze-style-minimal .ze-section::before{opacity:0;}

/* Gradient overlay (sits above glow, below content, never blocks clicks) */
.section.ze-section::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:2; /* container is z=3 in your file */
  opacity: calc(var(--ze-sec-grad-on) * var(--ze-sec-grad-opacity));
  background:
    /* tiny highlight + vignette so it feels “alive” not flat */
    radial-gradient(1200px 650px at 15% -10%, rgba(255,255,255,.16), transparent 60%),
    radial-gradient(1100px 700px at 85% 110%, rgba(0,0,0,.10), transparent 60%),
    /* the actual section gradient */
    linear-gradient(
      var(--ze-sec-grad-angle),
      var(--ze-sec-bg, transparent) 0%,
      var(--ze-sec-bg2-final, transparent) 100%
    );
}


/* Divider stacking fix:
   Bottom dividers can look like a straight line if the NEXT section paints over them.
   We give earlier sections a higher z-index so their bottom divider sits above the next section. */
.ze-section--welcome{--ze-sec-z:90}
.ze-section--events{--ze-sec-z:80}
.ze-section--calendar{--ze-sec-z:70}
.ze-section--reviews{--ze-sec-z:60}
.ze-section--map{--ze-sec-z:50}
.ze-section--blog{--ze-sec-z:40}
.ze-section--newsletter{--ze-sec-z:30}

/* Citrus Luxe: add a subtle “painted light” glow to every section (no images) */
body.ze-mode-beach .ze-section::before{
  content:"";
  position:absolute;
  inset:-120px -80px;
  pointer-events:none;
  z-index:1;
  opacity: calc(.55 * var(--ze-sec-glow,1));
  background:
    radial-gradient(800px 420px at 12% 18%, rgba(18,199,183,.20), transparent 65%),
    radial-gradient(700px 380px at 88% 8%, rgba(255,138,0,.16), transparent 60%),
    radial-gradient(900px 520px at 55% 120%, rgba(18,199,183,.14), transparent 60%);
}
/* Keep content above decorative dividers */
.ze-section .container{position:relative;z-index:3}
/* Allow per-section card surface overrides */
.ze-section .card{background:var(--ze-sec-surface,var(--surface))}

/* Base section padding + seamless overlap for TOP + BOTTOM dividers
   - padding makes room so content never sits under the SVG
   - negative margins overlap adjacent sections so straight edges never show
*/
.section.ze-section{
  /*
    Divider rendering model (IMPORTANT):
    Dividers live *inside* the section area (top:0 / bottom:0) instead of
    protruding outside and relying on negative margins.

    This prevents the classic bug where the next section "paints over" the
    previous section's bottom divider, making it look like a straight edge.
  */
  padding-top:calc(52px + var(--ze-divider-top-pad,var(--ze-divider-top-h,0px)));
  padding-bottom:calc(0px + var(--ze-divider-bottom-pad,var(--ze-divider-bottom-h,0px)));
  margin-top:0;
  margin-bottom:0;
}
.section.ze-section[data-divider-top="none"]{padding-top:52px;margin-top:0}
.section.ze-section[data-divider-bottom="none"]{padding-bottom:52px;margin-bottom:0}

/* Divider base */
.ze-divider{position:absolute;left:0;width:100%;overflow:hidden;pointer-events:none;line-height:0;z-index:4;transform:translate3d(0,0,0)}
.ze-divider--top{top:calc(-1px - var(--ze-divider-top-shift,0px));height:var(--ze-divider-top-h,0px);z-index:5}
.ze-divider--bottom{bottom:calc(-1px - var(--ze-divider-bottom-shift,0px));height:var(--ze-divider-bottom-h,0px);z-index:5}

/* Default wave/curve top flips to fill above the curve (hides straight edges) */
.ze-divider--top:not(.ze-divider--glass_fade):not(.ze-divider--el_waves_brush){transform:scaleY(-1);transform-origin:center}

/* Elementor “Waves Brush” orientation:
   - TOP divider uses the SVG as-is
   - BOTTOM divider flips so the fill sits below the wave line (like Elementor)
*/
.ze-divider--el_waves_brush.ze-divider--bottom .ze-divider__svg{transform:scaleY(-1) translate3d(0,0,0);transform-origin:center}

.ze-divider__svg{width:100%;height:100%;display:block;transform:translate3d(0,0,0);backface-visibility:hidden;fill:currentColor}

/* Exact illustrated divider image (transparent background) */
.ze-divider--wave_img_original{
  background-image:url('waves/illustrated-wave-original-transparent.png');
  background-repeat:no-repeat;
  background-position:center bottom;
  background-size:100% 100%;
}
.ze-divider--wave_img_original.ze-divider--top{transform:none !important}
.ze-divider--wave_img_original .ze-divider__img{display:block;width:100%;height:100%}
.ze-divider__custom svg{width:100%;height:100%;display:block;transform:translate3d(0,0,0);backface-visibility:hidden}

/* Divider fill colour source
   - ze-divider-fill-section  : divider matches the CURRENT section (gradient continues)
   - ze-divider-fill-seamless : divider matches PREV/NEXT section (classic seamless cut-out)

   We expose two CSS vars used by the inline SVG gradients:
   --ze-divider-g1 / --ze-divider-g2
*/
.ze-divider{
  /* Base: divider matches the current section */
  --ze-divider-g1: var(--ze-divider-tint-override, var(--ze-sec-bg,var(--bg)));
  /* IMPORTANT: use the same final BG2 that the section uses (auto-generated if BG2 is empty) */
  --ze-divider-g2: var(
    --ze-divider-tint-override,
    var(--ze-sec-bg2-final, var(--ze-sec-bg2, var(--ze-divider-g1)))
  );
  color: var(--ze-divider-g1);
  filter:none;
}

body.ze-divider-fill-seamless .ze-divider--bottom{
  /* Seamless: divider matches the NEXT section */
  --ze-divider-g1: var(--ze-divider-tint-override, var(--ze-next-bg,var(--bg)));
  --ze-divider-g2: var(
    --ze-divider-tint-override,
    var(--ze-next-bg2-final, var(--ze-next-bg2, color-mix(in srgb, var(--ze-next-bg, var(--bg)) 82%, #ffffff)))
  );
  color: var(--ze-divider-g1);
}
body.ze-divider-fill-seamless .ze-divider--top{
  /* Seamless: divider matches the PREVIOUS section */
  --ze-divider-g1: var(--ze-divider-tint-override, var(--ze-prev-bg,var(--bg)));
  --ze-divider-g2: var(
    --ze-divider-tint-override,
    var(--ze-prev-bg2-final, var(--ze-prev-bg2, color-mix(in srgb, var(--ze-prev-bg, var(--bg)) 82%, #ffffff)))
  );
  color: var(--ze-divider-g1);
}

/* Elementor pasted SVG support */
.ze-divider__custom{width:100%;height:100%}
.ze-divider__custom svg{width:100%;height:100%;display:block;transform:translate3d(0,0,0);backface-visibility:hidden}
.ze-divider__custom .elementor-shape-fill{fill:currentColor}



/* Illustrated wave (smart tint) */
.ze-divider--wave_illus .ze-divider__svg .ze-stroke,
.ze-divider--wave_illus_bold .ze-divider__svg .ze-stroke{
  fill:none !important;
  stroke: color-mix(in srgb, currentColor 68%, #ffffff 32%);
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect: non-scaling-stroke;
}
.ze-divider--wave_illus .ze-divider__svg .ze-stroke{ opacity:.38; stroke-width:2.4 }
.ze-divider--wave_illus .ze-divider__svg .ze-stroke2{ opacity:.18; stroke-width:5.2 }

.ze-divider--wave_illus_bold .ze-divider__svg .ze-stroke{ opacity:.55; stroke-width:3.2 }
.ze-divider--wave_illus_bold .ze-divider__svg .ze-stroke2{ opacity:.30; stroke-width:7.2 }

/* Dark mode tweak */
body.ze-mode-afterdark .ze-divider--wave_illus .ze-divider__svg .ze-stroke,
body.ze-mode-afterdark .ze-divider--wave_illus_bold .ze-divider__svg .ze-stroke{
  stroke: color-mix(in srgb, currentColor 74%, #ffffff 26%);
}


/* Hero illustrated wave (like screenshot) */
/* - fill is the area BELOW the waterline
   - top divider should NOT flip (we want sea below, not above)
   - when used as TOP divider, tint to the current section background
*/
.ze-divider--wave_hero_illus.ze-divider--top{
  transform:none !important;
}

/* prevent default fill from colouring the stroke-only paths */
.ze-divider--wave_hero_illus .ze-divider__svg path{fill:none}
.ze-divider--wave_hero_illus .ze-divider__svg .ze-illus-fill{fill:currentColor}

.ze-divider--wave_hero_illus .ze-illus-edge,
.ze-divider--wave_hero_illus .ze-illus-edge2,
.ze-divider--wave_hero_illus .ze-illus-hi,
.ze-divider--wave_hero_illus .ze-illus-hi2,
.ze-divider--wave_hero_illus .ze-illus-dash,
.ze-divider--wave_hero_illus .ze-illus-accent,
.ze-divider--wave_hero_illus .ze-illus-accent2{
  fill:none;
  vector-effect: non-scaling-stroke;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.ze-divider--wave_hero_illus .ze-illus-edge{
  stroke: color-mix(in srgb, currentColor 70%, #000 30%);
  opacity:.55;
  stroke-width:3.2;
}
.ze-divider--wave_hero_illus .ze-illus-edge2{
  stroke: color-mix(in srgb, currentColor 78%, #000 22%);
  opacity:.26;
  stroke-width:6.4;
}

.ze-divider--wave_hero_illus .ze-illus-hi{
  stroke: rgba(255,255,255,.92);
  opacity:.95;
  stroke-width:6.2;
}
.ze-divider--wave_hero_illus .ze-illus-hi2{
  stroke: rgba(255,255,255,.92);
  opacity:.55;
  stroke-width:3.2;
}
.ze-divider--wave_hero_illus .ze-illus-dash{
  stroke: rgba(255,255,255,.92);
  opacity:.75;
  stroke-width:4.0;
}

.ze-divider--wave_hero_illus .ze-illus-accent{
  stroke: currentColor;
  opacity:.95;
  stroke-width:5.4;
}
.ze-divider--wave_hero_illus .ze-illus-accent2{
  stroke: currentColor;
  opacity:.55;
  stroke-width:3.4;
}

/* Bold variant (used by the hero "Illustrated Wave (bold)" option) */
.ze-divider--wave_hero_illus.ze-illus-bold .ze-illus-edge{opacity:.68;stroke-width:4.2}
.ze-divider--wave_hero_illus.ze-illus-bold .ze-illus-edge2{opacity:.36;stroke-width:8.2}
.ze-divider--wave_hero_illus.ze-illus-bold .ze-illus-hi{stroke-width:7.2}
.ze-divider--wave_hero_illus.ze-illus-bold .ze-illus-hi2{stroke-width:3.8;opacity:.62}
.ze-divider--wave_hero_illus.ze-illus-bold .ze-illus-dash{stroke-width:4.8}
.ze-divider--wave_hero_illus.ze-illus-bold .ze-illus-accent{stroke-width:6.2}
.ze-divider--wave_hero_illus.ze-illus-bold .ze-illus-accent2{stroke-width:4.0;opacity:.62}
/* Glass fade uses a premium frosted tint (optional override via Customizer) */
.ze-divider--glass_fade .ze-divider__svg{
  color: rgb(var(--ze-divider-glass-rgb, 255,255,255));
  filter: none;
}
/* Foam divider highlight polish */
.ze-divider--foam .ze-divider__svg{filter:none}
.ze-divider--foam .ze-divider__svg path:last-child{filter: blur(.2px)}


/* “Alt” sections: no straight borders (dividers handle edges) */
.section-alt{background:var(--alt)}
.section-alt.ze-section{background-color:var(--ze-sec-bg,var(--alt));color:var(--ze-sec-text,inherit)}

/* Prevent divider overlap at end of content */
.site-main .ze-section:last-of-type{margin-bottom:0}


/* -------------------------------------------------------------------------
   Scroll reveal (Customizer → Style → Animations)
   JS adds `ze-js` on <html> and toggles `.is-inview` as sections enter viewport.
   ------------------------------------------------------------------------- */
html.ze-js.ze-reveal body.ze-motion-on [data-ze-anim]{
  --ze-tx: 0px;
  --ze-ty: var(--ze-motion-dist, 18px);
  --ze-scale: 1;
  opacity: 0;
  transform: translate3d(var(--ze-tx), var(--ze-ty), 0) scale(var(--ze-scale));
  transition: opacity var(--ze-motion-dur, 520ms) var(--ze-motion-ease, cubic-bezier(.2,1,.2,1)),
              transform var(--ze-motion-dur, 520ms) var(--ze-motion-ease, cubic-bezier(.2,1,.2,1));
  will-change: opacity, transform;
}

html.ze-js body.ze-motion-on [data-ze-anim="none"]{opacity:1;transform:none}
html.ze-js body.ze-motion-on [data-ze-anim="fade"]{--ze-ty:0px}
html.ze-js body.ze-motion-on [data-ze-anim="fade-up"]{--ze-ty: var(--ze-motion-dist, 18px)}
html.ze-js body.ze-motion-on [data-ze-anim="slide-up"]{--ze-ty: calc(var(--ze-motion-dist, 18px) * 1.2)}
html.ze-js body.ze-motion-on [data-ze-anim="slide-l"]{--ze-ty:0px;--ze-tx: calc(var(--ze-motion-dist, 18px) * 1.2)}
html.ze-js body.ze-motion-on [data-ze-anim="slide-r"]{--ze-ty:0px;--ze-tx: calc(var(--ze-motion-dist, 18px) * -1.2)}
html.ze-js body.ze-motion-on [data-ze-anim="zoom"]{--ze-ty:0px;--ze-scale:.97}

html.ze-js body.ze-motion-on [data-ze-anim].is-inview{opacity:1;transform:translate3d(0,0,0) scale(1)}

@media (prefers-reduced-motion: reduce){
  html.ze-js body [data-ze-anim]{opacity:1!important;transform:none!important;transition:none!important}
}

.h1{font-size:clamp(28px,4vw,46px);line-height:1.05;margin:0 0 10px}
.h2{font-size:clamp(22px,3vw,30px);line-height:1.1;margin:0}
.h3{font-size:18px;line-height:1.2;margin:0}
.meta{font-size:12px;letter-spacing:.02em;color:var(--muted)}
.muted{color:var(--muted)}
.small{font-size:12px;color:var(--muted)}
.link{color:var(--ze-link, var(--accent));text-decoration:none}
.link:hover{color:var(--ze-link-hover, var(--accent2));text-decoration:underline}

/* Optional per-section accent override (set via Customizer → Design & Layout → Sections & Dividers) */
.ze-section .link{color:var(--ze-sec-accent, rgba(255,255,255,.88))}
body.ze-mode-beach .ze-section .link{color:var(--ze-sec-accent, rgba(6,16,18,.82))}
.ze-section .link:hover{filter:brightness(1.08)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Header */
.site-header{
  position:relative;
  top:0;
  z-index:200;
  background: var(--ze-header-bg, rgba(5,7,10,.70));
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line);
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.ze-header-sticky .site-header{ position:sticky; }
.ze-header-overlay .site-header{
  position:absolute;
  left:0; right:0; top:0;
  background: transparent;
  border-bottom: 1px solid transparent;
  backdrop-filter: blur(0);
}

.ze-header-overlay .site-header.is-scrolled{
  background: var(--ze-header-bg, rgba(5,7,10,.55));
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(14px);
  box-shadow: var(--shadow-soft);
}

.site-header .container{
  padding-left: var(--ze-header-pad-x, 18px);
  padding-right: var(--ze-header-pad-x, 18px);
}
.header-inner{
  display:flex;
  align-items:center;
  gap:14px;
  padding: var(--ze-header-pad-y, 12px) 0;
}

/* Make header content full width on large screens (optional toggle) */
.ze-header-full .site-header .container{max-width:none}

.brand{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0}
.brand-text{font-weight:900;letter-spacing:-0.02em}
.brand .custom-logo-link{display:flex;align-items:center;line-height:0}
.brand .custom-logo{height:var(--ze-logo-h, 42px);width:auto;display:block}

.nav-desktop{display:none;flex:1;justify-content:center}
.nav-links{list-style:none;display:flex;gap:10px;margin:0;padding:0;align-items:center;justify-content:center}
.nav-links li{margin:0;padding:0;display:flex;align-items:center}

.nav-links a{
  color: var(--ze-nav-link, rgba(255,255,255,.92));
  text-decoration:none;
  font-weight:800;
  font-size:14px;
  letter-spacing:.01em;
  padding:10px 12px;
  border-radius:999px;
  position:relative;
  opacity:.92;
  display:inline-flex;
  align-items:center;
  line-height:1;
  transition: transform .15s ease, background .15s ease, color .15s ease, opacity .15s ease, box-shadow .15s ease;
}
.nav-links a:hover{opacity:1;color: var(--ze-nav-hover, #fff);transform: translateY(-1px)}


/* Beach mode: dark header text on non-hero pages (transparent header is for hero only) */
body.ze-mode-beach:not(.ze-header-overlay) .nav-links a{color: rgba(6,16,18,.90)}
body.ze-mode-beach:not(.ze-header-overlay) .nav-links a:hover{color: rgba(6,16,18,1)}


/* Current menu item (keep it subtle but clear) */
.nav-links .current-menu-item > a,
.nav-links .current_page_item > a{opacity:1}

/* Hover styles (Customizer) */
.ze-nav-hover-underline .nav-links a::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:6px;
  height:2px;
  border-radius:999px;
  background: var(--ze-nav-hover, var(--accent));
  transform: scaleX(0);
  transform-origin:left;
  transition: transform .18s ease;
  opacity:.95;
}
.ze-nav-hover-underline .nav-links a:hover::after{transform:scaleX(1)}

.ze-nav-hover-pill .nav-links a:hover{
  background: rgba(255,255,255,.10);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}

.ze-nav-hover-glow .nav-links a:hover{
  background: rgba(255,255,255,.08);
  box-shadow: 0 0 0 1px rgba(255,255,255,.10), 0 12px 30px rgba(0,0,0,.22);
}

.ze-nav-hover-none .nav-links a:hover{transform:none}
.ze-nav-hover-none .nav-links a::after{display:none}

.header-actions{display:flex;align-items:center;gap:10px}
.lang-switcher{display:flex;align-items:center;gap:8px}

.icon-btn{
  position:relative;
  border:1px solid var(--line);
  background:rgba(255,255,255,.08);
  color: var(--ze-nav-link, var(--text));
  border-radius:999px;
  padding:10px 12px;
  cursor:pointer;
  text-decoration:none;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.icon-btn:hover{background:rgba(255,255,255,.12);color: var(--ze-nav-hover, #fff)}
.icon-btn .icon{display:block}

.cart-count{
  position:absolute;top:-6px;right:-6px;
  background:linear-gradient(90deg, rgba(245,158,11,.95), rgba(239,68,68,.85));
  border:1px solid rgba(255,255,255,.15);
  color:#000;
  font-weight:900;
  font-size:11px;
  padding:3px 6px;
  border-radius:999px;
}

.nav-toggle{
  appearance:none;border:1px solid var(--line);background:rgba(255,255,255,.08);
  color: var(--ze-nav-link, var(--text));border-radius:999px;padding:10px 12px;cursor:pointer;
}
.nav-toggle:hover{background:rgba(255,255,255,.12);color: var(--ze-nav-hover, #fff)}
.nav-toggle-bars{display:block;width:18px;height:2px;background:currentColor;position:relative;border-radius:2px}
.nav-toggle-bars::before,.nav-toggle-bars::after{
  content:"";position:absolute;left:0;width:18px;height:2px;background:currentColor;border-radius:2px;
}
.nav-toggle-bars::before{top:-6px}
.nav-toggle-bars::after{top:6px}

.nav-mobile{
  border-top:0;
  background: var(--ze-header-bg, rgba(5,7,10,.84));
  overflow:hidden;
  max-height:0;
  opacity:0;
  transform: translateY(-8px);
  transition: max-height .35s ease, opacity .22s ease, transform .22s ease;
}
.nav-mobile.is-open{
  border-top: 1px solid var(--line);
  opacity: 1;
  transform: translateY(0);
  max-height: 520px;
}
.nav-links-mobile{list-style:none;margin:0;padding:14px 0;display:flex;flex-direction:column;gap:12px;color:#ffffff}
.nav-links-mobile a{text-decoration:none;font-weight:800;opacity:.92;padding:10px 8px;border-radius:14px}
.nav-links-mobile a:hover{opacity:1;background:rgba(255,255,255,.08)}
.nav-mobile-lang{padding:0 0 16px}

@media (min-width: 980px){
  .nav-desktop{display:block}
  .nav-toggle{display:none}
}

/* Hero */
.hero{position:relative;min-height: calc(var(--ze-hero-min-vh, 78) * 1vh);display:flex;align-items:flex-end;border-bottom:0;overflow:hidden}
.hero[data-wave="none"]{border-bottom:1px solid var(--line)}
.hero-media{position:absolute;inset:0;overflow:hidden}
.hero-video{width:100%;height:100%;object-fit:cover;filter:saturate(1.05) contrast(1.03)}
.hero-poster{width:100%;height:100%;background-size:cover;background-position:center}
.hero-overlay{position:absolute;inset:0;z-index:1;
  background:
    radial-gradient(1000px 500px at 20% 0%, rgba(231,189,108,.20), transparent 60%),
    radial-gradient(900px 520px at 80% 30%, rgba(23,195,206,.18), transparent 60%),
    linear-gradient(180deg,
      rgba(var(--ze-hero-overlay-rgb, 0,0,0), calc(var(--ze-hero-overlay-strength, .78) * .35)),
      rgba(var(--ze-hero-overlay-rgb, 0,0,0), var(--ze-hero-overlay-strength, .78))
    );
}
.hero-wave{position:absolute;left:0;width:100%;bottom:-2px;height:var(--ze-wave-height,72px);overflow:hidden;z-index:3;pointer-events:none;line-height:0;direction:ltr}
.hero-wave svg{display:block;width:100%;height:100%}
.hero-content{position:relative;z-index:2;padding:28px 0 calc(36px + (var(--ze-wave-height,72px) * .35));max-width:740px}
.hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 12px;border-radius:999px;
  background:rgba(255,255,255,.10);border:1px solid var(--line);
  font-weight:800;font-size:12px;letter-spacing:.02em;
  color:var(--ze-hero-badge-color,#fff);
}
.hero-title{font-size:clamp(30px,4.2vw,54px);line-height:1.03;margin:14px 0 10px;letter-spacing:-0.02em;color:var(--ze-hero-title-color,#fff)}
.hero-sub{margin:0 0 18px;color:var(--ze-hero-sub-color, rgba(255,255,255,.82));font-size:clamp(14px,1.6vw,18px);line-height:1.45}
.hero-cta{display:flex;gap:10px;flex-wrap:wrap}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  text-decoration:none;font-weight:900;letter-spacing:-0.01em;
  padding:12px 16px;border-radius:16px;border:1px solid var(--line);
  background:rgba(255,255,255,.08);
}
.btn:hover{background:rgba(255,255,255,.12)}
.btn-primary{
  border-color: transparent;
  background: linear-gradient(90deg, var(--accent2), var(--accent));
  color:#fff;
  box-shadow: 0 14px 40px color-mix(in srgb, var(--accent2) 26%, transparent);
}
.btn-primary:hover{filter:brightness(1.03)}
.btn-ghost{background:var(--card)}
.btn-outline{background:transparent}

.card{
  border:1px solid var(--line);
  background: var(--card);
  border-radius: var(--radius2);
  box-shadow: var(--shadow-soft);
  overflow:hidden;
}
.card-pad{padding:18px}

/* Optional per-section surface override (cards) */
.ze-section .card,
.ze-section .event-card{background:var(--ze-sec-surface, var(--card))}
body.ze-mode-beach .ze-section .card,
body.ze-mode-beach .ze-section .event-card{
  background: var(--ze-sec-surface, rgba(255,255,255,.62));
  border-color: rgba(11,27,28,.10);
  box-shadow: 0 18px 60px rgba(11,27,28,.10);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:16px}
.section-head .ze-section-title{color:var(--ze-sec-title, var(--ze-section-title, var(--ze-sec-ink, var(--text))));letter-spacing:-.02em}

/* Section heading alignment (Customizer → Style → Section headings align) */
body.ze-sec-title-center .section-head{flex-direction:column;align-items:center;text-align:center}
body.ze-sec-title-center .section-head .link{margin-top:4px}
body.ze-sec-title-right .section-head{text-align:right}
body.ze-sec-title-right .section-head .ze-section-title{text-align:right}

/* Welcome (Bali vibe) */
.ze-welcome{padding: 10px 0 12px}
.ze-welcome__inner{max-width: 920px;margin:0 auto;text-align:center}
.ze-welcome__kicker{display:inline-flex;align-items:center;gap:10px;font-weight:900;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.ze-welcome__title{margin:14px 0 10px;font-size:44px;line-height:1.05;letter-spacing:-.03em}
.ze-welcome__text{margin:0 auto 18px;max-width: 720px;color:var(--muted);font-size:16px;line-height:1.7}
.ze-welcome__actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}

/* Beach preset: brighten cards + hero controls */
body.ze-mode-beach .card,
body.ze-mode-beach .event-card{
  background: rgba(255,255,255,.62);
  border-color: rgba(11,27,28,.10);
  box-shadow: 0 18px 60px rgba(11,27,28,.10);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
body.ze-mode-beach .event-card__price{background:rgba(6,16,18,.72)}
body.ze-mode-beach .hero .badge{background:rgba(255,255,255,.72);border-color:rgba(255,255,255,.55);color:#061012}
body.ze-mode-beach .hero .btn-ghost{background:rgba(255,255,255,.55);border-color:rgba(255,255,255,.45);color:#061012}

/* Base grid helper (used by sections like Blog cards) */
.site-main .grid{
  display:grid;
  gap:16px;
}
@media (min-width: 980px){
  .site-main .grid{ gap:18px; }
}
/* Card images: contain (no cropping) */
.ze-card__media,
.ze-card-media,
.ze-post-card__media,
.ze-blog-card__media,
.ze-event-card__media,
.card__media {
  background-size: contain !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-color: rgba(255,255,255,.35); /* adjust or set via customizer var if you want */
}

/* If the card uses <img> */
.ze-card__media img,
.ze-card-media img,
.ze-post-card__media img,
.ze-blog-card__media img,
.ze-event-card__media img,
.card__media img {
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  display: block;
}


.grid-4{grid-template-columns:repeat(2, minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(1, minmax(0,1fr))}
@media (min-width: 720px){
  .grid-3{grid-template-columns:repeat(3, minmax(0,1fr))}
}
@media (min-width: 980px){
  .grid-4{grid-template-columns:repeat(4, minmax(0,1fr))}
}

/* Event cards */
.event-card{border-radius:var(--radius2);overflow:hidden;border:1px solid var(--line);background:rgba(255,255,255,.06)}
.event-card__link{text-decoration:none;display:block}
.event-card__media{position:relative;aspect-ratio:4/5;overflow:hidden}
.event-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.event-card:hover .event-card__media img{transform:scale(1.04)}
.event-card__placeholder{width:100%;height:100%;background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02))}
.event-card__price{
  position:absolute;left:12px;bottom:12px;
  background:rgba(0,0,0,.60);
  border:1px solid rgba(255,255,255,.18);
  padding:8px 10px;border-radius:999px;font-weight:900;font-size:13px
}
.event-card__body{padding:14px}
.event-card__title{margin:0 0 8px;font-size:16px;line-height:1.2}
.event-card__meta{display: contents;gap:8px;flex-wrap:wrap}
.pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 10px;border-radius:999px;
  background:rgba(255,255,255,.08);border:1px solid var(--line);
  font-size:12px;font-weight:900;color:rgba(255,255,255,.85);
}
.pill--soft{background:rgba(34,211,238,.10);border-color:rgba(34,211,238,.22)}

/* Upcoming events (premium collage)
   Desktop: 1 big + 3 stacked right
   Mobile: 2x2 touching grid with scroll-in collage animation */
.ze-upcoming-grid{
  display:grid;
  width:100%;
  gap:16px;
  grid-template-columns: 1.6fr 1fr;
  grid-template-rows: repeat(3, minmax(180px, 1fr));
  align-items:stretch;
}
.ze-upcard{
  position:relative;
  display:block;
  overflow:hidden;
  border-radius: var(--radius2);
  border:1px solid var(--line);
  background: rgba(255,255,255,.06);
  box-shadow: var(--shadow);
  text-decoration:none;
  transform: translateY(12px);
  opacity:0;
  transition: transform .65s ease, opacity .65s ease, filter .35s ease;
}
.ze-upcoming-grid.is-inview .ze-upcard{transform:none;opacity:1;}


@media (min-width: 861px){
  .ze-upcard:not(.ze-upcard--slot-1) .ze-upcard__actions{display:none;}
}
/* Upcard inner link + CTA actions (rotating featured) */
.ze-upcard__link{
  display:block;
  height:100%;
  position:relative;
  text-decoration:none;
  color:inherit;
}
.ze-upcard__actions{
  position:absolute;
  left:14px; right:14px; bottom:14px;
  display: contents;
  gap:10px;
  align-items:center;
  z-index:5;
  opacity:0;
  transform: translateY(6px);
  transition: opacity .22s ease, transform .22s ease;
}
.ze-upcard__actions .btn{
  padding:10px 12px;
  border-radius:999px;
  font-size:13px;
}
.ze-upcard--slot-1 .ze-upcard__actions{opacity:1;transform:none;}
.ze-upcard--slot-1 .ze-upcard__label{bottom:62px;}

@media (hover:hover) and (pointer:fine){
  .ze-upcard:hover .ze-upcard__actions,
  .ze-upcard:focus-within .ze-upcard__actions{opacity:1;transform:none;}
}


/* Positioning for the 4 cards
   IMPORTANT: the grid includes a <script type="application/json"> child for event data.
   Using :nth-child() breaks positioning because the script becomes the first child.
   We use :nth-of-type() so the first DIV card is treated as the featured item.
*/
.ze-upcoming-grid > .ze-upcard:nth-of-type(1){grid-column:1;grid-row:1 / 4;}
.ze-upcoming-grid > .ze-upcard:nth-of-type(2){grid-column:2;grid-row:1;}
.ze-upcoming-grid > .ze-upcard:nth-of-type(3){grid-column:2;grid-row:2;}
.ze-upcoming-grid > .ze-upcard:nth-of-type(4){grid-column:2;grid-row:3;}


/* Slot-based positioning (enables rotation without DOM reordering).
   We scope to the grid so it can override the :nth-of-type layout when needed. */
.ze-upcoming-grid .ze-upcard--slot-1{grid-column:1;grid-row:1 / 4;}
.ze-upcoming-grid .ze-upcard--slot-2{grid-column:2;grid-row:1;}
.ze-upcoming-grid .ze-upcard--slot-3{grid-column:2;grid-row:2;}
.ze-upcoming-grid .ze-upcard--slot-4{grid-column:2;grid-row:3;}


@media (min-width: 980px){
  .ze-upcoming-grid > .ze-upcard:nth-of-type(1), .ze-upcoming-grid .ze-upcard--slot-1{min-height: var(--ze-upcoming-featured-h, 520px);}
  .ze-upcoming-grid > .ze-upcard:nth-of-type(1) .ze-upcard__img, .ze-upcoming-grid .ze-upcard--slot-1 .ze-upcard__img{height:100%;aspect-ratio:auto;}
}

.ze-upcard__img{width:100%;height:100%;object-fit:cover;display:block;aspect-ratio: 16/10;}
.ze-upcoming-grid > .ze-upcard:nth-of-type(1) .ze-upcard__img, .ze-upcoming-grid .ze-upcard--slot-1 .ze-upcard__img{aspect-ratio: 16/10;}

.ze-upcard__img--placeholder{aspect-ratio: 16/10;background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));}

.ze-upcard__scrim{position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.00) 30%, rgba(0,0,0,.58) 100%);}
.ze-upcard__label{
  position:absolute;left:14px;right:14px;bottom:14px;
  padding:10px 12px;
  border-radius: 16px;
  background: rgba(0,0,0,.32);
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(12px);
  color:#fff;
  font-weight: 900;
  letter-spacing: .2px;
  display:flex;
  flex-direction:column;

}
.ze-upcard__kicker{display:none;}
.ze-upcard__name{font-size:16px;line-height:1.1;}

/* On-brand label tint (keeps readability while feeling less "flat black") */
@supports (background: color-mix(in srgb, red, blue)){
  .ze-upcard__label{
    background:
      linear-gradient(135deg,
        color-mix(in srgb, var(--accent2) 34%, rgba(0,0,0,.62)),
        color-mix(in srgb, var(--accent) 28%, rgba(0,0,0,.70))
      );
    border-color: rgba(255,255,255,.20);
  }
}

.ze-upcard__countdown{
  position:absolute;left:14px;top:14px;
  padding:8px 10px;border-radius:999px;
  background: rgba(0,0,0,.40);
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(12px);
  color:#fff;font-weight:950;font-size:12px;letter-spacing:.2px;
  opacity:1;transform:none;
  transition: opacity .22s ease, transform .22s ease;
}

/* Fun, on-brand countdown pill (safe fallback above; gradient where supported) */
.ze-upcard__countdown{
  box-shadow: 0 10px 26px rgba(0,0,0,.20);
}
@supports (background: color-mix(in srgb, red, blue)){
  .ze-upcard__countdown{
    background: linear-gradient(135deg,
      color-mix(in srgb, var(--accent) 72%, rgba(0,0,0,.28)),
      color-mix(in srgb, var(--accent2) 72%, rgba(0,0,0,.28))
    );
    border-color: rgba(255,255,255,.22);
  }
}



/* Hover overlay with event text (desktop)
   On mobile there is no hover; we keep the label only. */
.ze-upcard__hover{
  position:absolute; inset:0;
  display:contents; flex-direction:column; justify-content:flex-end;
  padding:18px;
  gap:10px;
  opacity:0;
  transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease;
}
.ze-upcard__hover-title{font-weight:950;color:#fff;letter-spacing:.2px;font-size:18px;line-height:1.1}
.ze-upcard__hover-desc{color:rgba(255,255,255,.88);font-weight:700;line-height:1.35;max-width:46ch}
.ze-upcard__hover-cta{display:inline-flex;align-self:flex-start;padding:8px 10px;border-radius:999px;filter:brightness(1.03);border:1px solid rgba(255,255,255,.18);color:#fff;font-weight:900;font-size:12px;}

.ze-upcard:hover .ze-upcard__label,
.ze-upcard:focus-within .ze-upcard__label{opacity:0;transform: translateY(6px)}
.ze-upcard:hover .ze-upcard__hover,
.ze-upcard:focus-within .ze-upcard__hover{opacity:1;transform:none}

.ze-upcard__label{transition: opacity .22s ease, transform .22s ease;}

.ze-upcard:hover{transform: translateY(-4px); filter: brightness(1.02);}
.ze-upcard:hover .ze-upcard__img{transform: scale(1.04);}
.ze-upcard__img{transition: transform .35s ease;}

/* Collage animation: cards fly in from angles */
.ze-upcoming-grid.ze-collage > .ze-upcard:nth-of-type(1),
.ze-upcoming-grid.ze-collage .ze-upcard.ze-upcard--slot-1{transform: translate(-18px, 14px) rotate(-2deg);opacity:0;}
.ze-upcoming-grid.ze-collage > .ze-upcard:nth-of-type(2),
.ze-upcoming-grid.ze-collage .ze-upcard.ze-upcard--slot-2{transform: translate(18px, -12px) rotate(2deg);opacity:0;}
.ze-upcoming-grid.ze-collage > .ze-upcard:nth-of-type(3),
.ze-upcoming-grid.ze-collage .ze-upcard.ze-upcard--slot-3{transform: translate(-14px, 16px) rotate(1deg);opacity:0;}
.ze-upcoming-grid.ze-collage > .ze-upcard:nth-of-type(4),
.ze-upcoming-grid.ze-collage .ze-upcard.ze-upcard--slot-4{transform: translate(14px, 16px) rotate(-1deg);opacity:0;}
.ze-upcoming-grid.ze-collage.is-inview .ze-upcard{transform:none;opacity:1;}


/* Slot-based collage transforms (when slot classes are present) */
.ze-upcoming-grid.ze-collage .ze-upcard--slot-1{transform: translate(-18px, 14px) rotate(-2deg);opacity:0;}
.ze-upcoming-grid.ze-collage .ze-upcard--slot-2{transform: translate(18px, -12px) rotate(2deg);opacity:0;}
.ze-upcoming-grid.ze-collage .ze-upcard--slot-3{transform: translate(-14px, 16px) rotate(1deg);opacity:0;}
.ze-upcoming-grid.ze-collage .ze-upcard--slot-4{transform: translate(14px, 16px) rotate(-1deg);opacity:0;}


/* Mobile: swipeable single-card carousel */
@media (max-width: 860px){
  /* Full-bleed feel on mobile */
  #events .container{ padding-left: 0; padding-right: 0; }

  /* Turn the grid into a horizontal swipe rail */
  .ze-upcoming-grid{
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;

    overflow-x: auto !important;
    overflow-y: hidden !important;

    padding: 0 14px 14px !important;
    margin: 0 !important;

    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch !important;

    border-radius: 0 !important;      /* don’t clip slides */
    background: transparent !important;

    /* kill any leftover grid settings */
    grid-template-columns: none !important;
    grid-template-rows: none !important;
  }

  /* Hide scrollbar */
  .ze-upcoming-grid::-webkit-scrollbar{ display: none; }
  .ze-upcoming-grid{ scrollbar-width: none; }

  /* Each card becomes a “slide” */
  .ze-upcard{
    flex: 0 0 88% !important;         /* 1 big card per view */
    scroll-snap-align: center !important;

    border-radius: 22px !important;
    box-shadow: var(--shadow) !important;
    overflow: hidden !important;

    outline: 1px solid rgba(0,0,0,.06) !important;
    outline-offset: -1px !important;
  }
  body.ze-mode-afterdark .ze-upcard{
    outline-color: rgba(255,255,255,.10) !important;
  }

  /* Undo the 4-slot collage rules (desktop-only) */
  .ze-upcard:nth-child(1),
  .ze-upcard:nth-child(2),
  .ze-upcard:nth-child(3),
  .ze-upcard:nth-child(4),
  .ze-upcard--slot-1,
  .ze-upcard--slot-2,
  .ze-upcard--slot-3,
  .ze-upcard--slot-4,
  .ze-upcoming-grid > .ze-upcard:nth-of-type(1),
  .ze-upcoming-grid > .ze-upcard:nth-of-type(2),
  .ze-upcoming-grid > .ze-upcard:nth-of-type(3),
  .ze-upcoming-grid > .ze-upcard:nth-of-type(4){
    grid-column: auto !important;
    grid-row: auto !important;
  }

  /* Image becomes a premium wide banner */
  .ze-upcard__img,
  .ze-upcard__img--placeholder{
    aspect-ratio: 16 / 9 !important;
    border-radius: 0 !important;
  }

  /* Label stays readable */
  .ze-upcard__label{
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
    font-size: 14px !important;
    border-radius: 18px !important;
  }

  /* No CTA buttons on mobile (tap the card) */
  .ze-upcard__actions{ display: none !important; }
}


/* Beach preset: brighter collage cards */
body.ze-mode-beach .ze-upcard{background:rgba(255,255,255,.84)}

/* Blog cards */
.card-link{text-decoration:none;display:block}
.card-media{aspect-ratio:16/10;overflow:hidden}
.card-media img{width:100%;height:100%;object-fit:cover}
.card-body{padding:16px}

/* Prose (blog + pages) */
.prose{max-width:760px;font-size:16px;width:100%}
body.page .prose{max-width:var(--ze-page-width, 1100px)}
body.page .prose > *{max-width:100%}
body.page .prose .wp-block-image, body.page .prose .wp-block-gallery{max-width:100%}
@media (max-width: 900px){body.page .prose{max-width:100%}}
.ze-prose--wide{max-width:var(--container)}
@media (max-width: 900px){.ze-prose--wide{max-width:100%}}


.prose > *{max-width:100%}
.prose p{line-height:1.75;color:color-mix(in srgb, var(--text) 88%, transparent);margin:0 0 14px}
.prose a{color:var(--ze-link, var(--accent));text-decoration:none}
.prose a:hover{color:var(--ze-link-hover, var(--accent2));text-decoration:underline;text-underline-offset:3px}
.prose h1,.prose h2,.prose h3{color:var(--text)}
.prose h2{margin-top:26px;margin-bottom:10px}
.prose h3{margin-top:22px;margin-bottom:8px}
.prose blockquote{
  margin:18px 0;
  padding:14px 16px;
  border-left:4px solid color-mix(in srgb, var(--accent) 60%, transparent);
  background: var(--card);
  border-radius: 18px;
  color: color-mix(in srgb, var(--text) 88%, transparent);
}
.prose hr{border:0;border-top:1px solid var(--line);margin:22px 0}
.prose img{border-radius:var(--radius2)}

/* Blog & page content as a premium “reading card” */
body.single-post .prose,
body.page .prose{
  margin: 0 auto;
  padding: 22px 20px;
  border: 1px solid var(--line);
  background: var(--card);
  border-radius: var(--radius2);
  box-shadow: var(--shadow-soft);
}
@media (min-width: 720px){
  body.single-post .prose,
  body.page .prose{padding: 28px 28px}
}
body.ze-mode-beach.single-post .prose,
body.ze-mode-beach.page .prose{
  background: rgba(255,255,255,.62);
  border-color: rgba(11,27,28,.10);
  box-shadow: 0 18px 60px rgba(11,27,28,.10);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ze-hero-image{position:relative;overflow:hidden;border-radius:var(--radius2);margin:14px 0 18px}
.ze-hero-image img{display:block;width:100%;height:auto;position:relative;z-index:1;border-radius:var(--radius2)}
.ze-image-halo{
  position:absolute;
  inset:-22%;
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
  filter: blur(42px) saturate(1.15);
  opacity:.55;
  transform: scale(1.1);
  pointer-events:none;
  z-index:0;
}
.hero-image{border-radius:var(--radius2);overflow:hidden;margin:16px 0;border:1px solid var(--line)}
.list{margin:12px 0 0;padding-left:18px}
.list li{margin:6px 0;color:color-mix(in srgb, var(--text) 82%, transparent)}

.pagination{margin-top:18px}

/* Footer (scoped — will NOT affect sections/dividers) */
.site-footer{
  border-top: 1px solid rgba(255,255,255,.10);
  padding: clamp(34px, 5vw, 58px) 0 18px;
  background: var(--ze-footer-bg, linear-gradient(180deg, rgba(6,16,18,.94), rgba(6,16,18,.98)));
  color: var(--ze-footer-text, rgba(255,255,255,.86));
}

.site-footer .footer-grid{
  display: grid;
  gap: clamp(18px, 3vw, 36px);
  align-items: start;
}

@media (min-width: 720px){
  .site-footer .footer-grid{
    grid-template-columns: 1.2fr 1fr;
  }
}

@media (min-width: 980px){
  .site-footer .footer-grid{
    grid-template-columns: 1.3fr 1fr 1fr 1fr;
  }
}

/* Brand column */
.site-footer .footer-brand{min-width:0}
.site-footer .footer-logo{display:inline-flex;align-items:center;line-height:0;text-decoration:none}
.site-footer .footer-logo .custom-logo{
  width: auto;
  height: auto;
  max-height: 86px; /* smaller logo */
  max-width: 220px;
  display:block;
}
@media (max-width: 420px){
  .site-footer .footer-logo .custom-logo{max-height:72px; max-width: 180px;}
}

.site-footer .footer-kicker{
  margin: 14px 0 0;
  max-width: 46ch;
  color: rgba(255,255,255,.62);
  line-height: 1.6;
}

/* Column titles + link lists */
.site-footer .footer-title{
  margin: 0 0 10px;
  font-weight: 950;
  letter-spacing: -.02em;
  color: rgba(255,255,255,.92);
}

.site-footer .footer-links{
  list-style:none;
  margin: 0;
  padding: 0;
  display:flex;
  flex-direction: column;   /* links go DOWN */
  gap: 10px;
}

.site-footer .footer-links li{margin:0;padding:0}

.site-footer .footer-links a{
  text-decoration:none;
  font-weight: 850;
  color: rgba(255,255,255,.72);
  display:inline-flex;
  align-items:center;
  gap: 8px;
}

.site-footer .footer-links a:hover{
  color: rgba(255,255,255,.95);
  transform: translateX(1px);
}

/* Contact column */
.site-footer .footer-meta .small{margin:0 0 6px; opacity:.8}
.site-footer .footer-meta .link{color: rgba(255,255,255,.82)}
.site-footer .footer-meta .link:hover{color:#fff}

.site-footer .footer-actions{margin-top: 12px}
.site-footer .btn-sm{
  padding: 10px 12px;
  border-radius: 14px;
  font-size: 13px;
}

/* Bottom row */
.site-footer .footer-bottom{
  margin-top: clamp(18px, 3vw, 28px);
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.10);
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  color: rgba(255,255,255,.55);
}

.site-footer .footer-bottom p{margin:0}


/* Social links */
.ze-social{list-style:none;margin:0;padding:0;display:flex;gap:10px;flex-wrap:wrap}
.ze-social__link{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 12px;border:1px solid rgba(255,255,255,.18);
  border-radius:999px;text-decoration:none;
  color:inherit;opacity:.92;font-weight:800
}
.ze-social__link:hover{opacity:1}
.ze-social__icon{width:16px;height:16px;display:block}

/* Hero slider fallback (mobile / reduced motion) */
.hero-media--slider{display:none}
.hero-slide{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;opacity:0;
  animation: heroFade 15s infinite;
}
.hero-slide:nth-child(1){animation-delay:0s}
.hero-slide:nth-child(2){animation-delay:5s}
.hero-slide:nth-child(3){animation-delay:10s}
.hero-slide:nth-child(4){animation-delay:15s}
.hero-slide:nth-child(5){animation-delay:20s}
@keyframes heroFade{
  0%, 18%{opacity:1}
  30%, 100%{opacity:0}
}
@media (max-width: 768px), (prefers-reduced-motion: reduce){
  .hero-content{padding-top:84px;}

  .hero{min-height:72vh}
  .hero-content{padding-bottom:28px}
  .hero-media--video[data-hide-on-mobile="1"]{display:none}
  .hero-media--slider{display:block}
}

/* WooCommerce polish */
.woocommerce .woocommerce-breadcrumb{opacity:.85}
.woocommerce .woocommerce-notices-wrapper{margin-bottom:12px}
.woocommerce ul.products{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0;padding:0}
@media (min-width: 980px){
  .woocommerce ul.products{grid-template-columns:repeat(4,minmax(0,1fr))}
}
.woocommerce ul.products li.product{
  list-style:none;
  border:1px solid var(--line);
  background:var(--card);
  border-radius:var(--radius2);
  padding:12px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{font-weight:900}
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit{
  border-radius:16px;
  border:1px solid transparent;
  background: linear-gradient(90deg, var(--accent2), var(--accent));
  color:#fff;
  font-weight:900;
  padding:12px 16px;
  transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
  box-shadow: 0 14px 30px rgba(0,0,0,.16);
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover{
  filter: brightness(1.06);
  transform: translateY(-1px);
  box-shadow: 0 18px 44px rgba(0,0,0,.18);
}
.woocommerce a.button:active, .woocommerce button.button:active, .woocommerce input.button:active{
  filter: brightness(.98);
  transform: translateY(0);
}
.woocommerce .quantity .qty{
  border-radius:14px;
  border:1px solid var(--line);
  background: var(--card2);
  color:var(--text);
  padding:10px 12px;
}
.woocommerce input.input-text, .woocommerce textarea{
  width:100%;
  border-radius:14px;
  border:1px solid var(--line);
  background: var(--card2);
  color:var(--text);
  padding:12px 12px;
}
.woocommerce .woocommerce-checkout .form-row label{font-weight:800}
.woocommerce table.shop_table{
  border:1px solid var(--line);
  border-radius:var(--radius2);
  overflow:hidden;
  background: var(--card);
}
.woocommerce table.shop_table th, .woocommerce table.shop_table td{
  border-top:1px solid var(--line);
}


@media (min-width: 980px){
  body.ze-wc-checkout-two-col .woocommerce form.checkout{
    display:grid;
    grid-template-columns: 1.2fr .8fr;
    gap:18px;
    align-items:start;
  }
  body.ze-wc-checkout-two-col .woocommerce form.checkout #customer_details{grid-column:1}
  body.ze-wc-checkout-two-col .woocommerce form.checkout .woocommerce-checkout-review-order{
    grid-column:2;
    position: sticky;
    top: 92px;
  }
}

/* Cart / Checkout cards */
.woocommerce .cart-collaterals .cart_totals,
.woocommerce .woocommerce-checkout-review-order,
.woocommerce .woocommerce-checkout-payment{
  border:1px solid var(--line);
  background: var(--card);
  border-radius: var(--radius2);
  padding:14px;
}

.woocommerce .woocommerce-info,
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-error{
  border-radius: var(--radius2);
}
/* =========================
   Cart page – premium layout
   ========================= */

body.woocommerce-cart .site-main{ padding-top: 18px; }

body.woocommerce-cart .woocommerce{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 clamp(14px, 2.2vw, 22px) 42px;
  display: grid;
  gap: 18px;
}

@media (min-width: 980px){
  body.woocommerce-cart .woocommerce{
    grid-template-columns: 1fr 360px;
    align-items: start;
  }
  body.woocommerce-cart .cart-collaterals{
    position: sticky;
    top: 92px;
  }
}

/* Card shells */
body.woocommerce-cart .woocommerce-cart-form,
body.woocommerce-cart .cart-collaterals .cart_totals{
  border: 1px solid var(--line);
  background: var(--card);
  border-radius: var(--radius2);
  box-shadow: var(--shadow-soft);
}

body.woocommerce-cart .woocommerce-cart-form{ padding: 14px; }
body.woocommerce-cart .cart-collaterals .cart_totals{ padding: 16px; }

/* Table to full width (fixes huge empty space) */
body.woocommerce-cart .woocommerce-cart-form table.shop_table{
  width: 100% !important;
  border: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: transparent !important;
}

body.woocommerce-cart table.shop_table thead th{
  font-weight: 950;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  opacity: .85;
  padding: 10px 8px;
  border-bottom: 1px solid var(--line);
}

body.woocommerce-cart table.shop_table tbody td{
  padding: 14px 8px;
  border-top: 1px solid var(--line);
  vertical-align: middle;
}

body.woocommerce-cart table.shop_table tbody tr:first-child td{ border-top: 0; }

/* Thumbs */
body.woocommerce-cart td.product-thumbnail img{
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
}

/* Product name */
body.woocommerce-cart td.product-name a{
  text-decoration: none;
  font-weight: 900;
}

body.woocommerce-cart td.product-name dl.variation{
  margin: 6px 0 0;
  font-size: 12px;
  color: var(--muted);
}

/* Remove button */
body.woocommerce-cart a.remove{
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.92);
  text-decoration: none;
}

body.woocommerce-cart a.remove:hover{
  background: rgba(239,68,68,.18);
  border-color: rgba(239,68,68,.35);
  color: #fff;
}

/* Quantity */
body.woocommerce-cart .quantity .qty{
  height: 44px;
  width: 92px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--card2);
  color: var(--text);
}

/* Actions row */
body.woocommerce-cart .actions{
  padding-top: 14px !important;
  border-top: 1px solid var(--line);
}

body.woocommerce-cart .actions .coupon{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

body.woocommerce-cart .actions .coupon input.input-text{
  min-width: 220px;
  flex: 1 1 220px;
}

/* Buttons (Update cart / Apply coupon) */
body.woocommerce-cart button[name="update_cart"],
body.woocommerce-cart .actions .coupon .button{
  border-radius: 16px;
  padding: 12px 16px;
}

/* Totals */
body.woocommerce-cart .cart-collaterals .cart_totals h2{
  margin: 0 0 10px;
  font-size: 18px;
}

body.woocommerce-cart .cart-collaterals table{
  width: 100%;
  margin: 0 0 12px;
  border: 0;
}

body.woocommerce-cart .cart-collaterals th,
body.woocommerce-cart .cart-collaterals td{
  padding: 10px 0;
  border-top: 1px solid var(--line);
}

body.woocommerce-cart .cart-collaterals tr:first-child th,
body.woocommerce-cart .cart-collaterals tr:first-child td{ border-top: 0; }

/* Checkout button */
body.woocommerce-cart .wc-proceed-to-checkout .checkout-button{
  width: 100%;
  text-align: center;
  border-radius: 18px;
  padding: 14px 18px;
  font-weight: 950;
}

/* Small screens tweaks */
@media (max-width: 980px){
  body.woocommerce-cart td.product-remove{ width: 34px; }
  body.woocommerce-cart td.product-thumbnail{ width: 72px; }
}


/* Single product (premium layout + mobile-first) */
body.single-product .woocommerce div.product:not(.ze-product){
  display:grid;
  gap:18px;
}
@media (min-width: 980px){
  body.single-product .woocommerce div.product:not(.ze-product){
    grid-template-columns: 1.05fr .95fr;
    gap:24px;
    align-items:start;
  }
  body.single-product .woocommerce div.product:not(.ze-product) .summary{
    position: sticky;
    top: 92px;
  }
}

body.single-product .woocommerce div.product:not(.ze-product) .woocommerce-product-gallery,
body.single-product .woocommerce div.product:not(.ze-product) .summary{
  border:1px solid var(--line);
  background: var(--card);
  border-radius: var(--radius2);
  padding:18px;
}

body.single-product .woocommerce div.product:not(.ze-product) .woocommerce-product-gallery{
  overflow:hidden;
}
body.single-product .woocommerce div.product:not(.ze-product) .woocommerce-product-gallery .flex-viewport{
  border-radius: 22px;
  overflow:hidden;
}

/* =========================
   Single Product – clean layout (ONE source of truth)
   ========================= */

body.single-product .ze-product{display:block}

body.single-product .ze-product__grid{
  display:grid;
  gap: clamp(16px, 2vw, 28px);
}
@media (min-width: 980px){
  body.single-product .ze-product__grid{
    grid-template-columns: 1.1fr .9fr;
    align-items:start;
  }
  body.single-product .ze-product__summary{
    position: sticky;
    top: 92px;
  }
}

/* Left column wrapper */
body.single-product .ze-product__media{
  position:relative;
  min-width:0;
}

/* Optional halo (safe) */
body.single-product .ze-product__halo{
  position:absolute;
  inset:-20%;
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
  filter: blur(44px) saturate(1.12);
  opacity:.45;
  transform: scale(1.08);
  pointer-events:none;
}

/* “Card” around the gallery */
body.single-product .ze-product__gallery{
  position:relative;
  z-index:1;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius2);
  background: var(--card);
  overflow:hidden;
}

body.ze-mode-beach.single-product .ze-product__gallery{
  border-color: rgba(11,27,28,.10);
  background: rgba(255,255,255,.62);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

/* Right column “buy box” */
body.single-product .ze-product__summary{
  border: 1px solid var(--line);
  border-radius: var(--radius2);
  background: var(--card);
  padding: 18px;
}

body.ze-mode-beach.single-product .ze-product__summary{
  border-color: rgba(11,27,28,.10);
  background: rgba(255,255,255,.62);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

body.single-product .ze-product__below{ margin-top: 22px; }


body.single-product .woocommerce .product_title{
  font-size: clamp(26px, 3.2vw, 44px);
  line-height: 1.05;
  margin: 0 0 6px;
  color: var(--text);
}
body.single-product .woocommerce .product .price{
  font-size: 20px;
  font-weight: 900;
  margin: 10px 0 16px;
  color: color-mix(in srgb, var(--text) 92%, transparent);
}

body.single-product .woocommerce div.product form.cart{
  margin: 12px 0 8px;
}
body.single-product .woocommerce div.product form.cart .variations{
  margin: 0 0 10px;
}
body.single-product .woocommerce div.product form.cart .variations td,
body.single-product .woocommerce div.product form.cart .variations th{
  padding: 6px 0;
}
body.single-product .woocommerce div.product form.cart .variations select{
  width: 100%;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--card2);
  padding: 12px 12px;
}
body.single-product .woocommerce div.product form.cart .quantity{margin-right:10px}
body.single-product .woocommerce div.product form.cart .single_add_to_cart_button{
  width: 100%;
  justify-content: center;
  padding: 14px 18px;
  border-radius: 18px;
}

body.single-product .woocommerce .product_meta{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 13px;
}

/* Tabs as a clean card */
body.single-product .woocommerce div.product .woocommerce-tabs{
  margin-top: 20px;
  border:1px solid var(--line);
  background: var(--card);
  border-radius: var(--radius2);
  padding: 12px 14px;
}
body.single-product .woocommerce div.product .woocommerce-tabs ul.tabs{
  margin: 0 0 12px;
  padding: 0;
}
body.single-product .woocommerce div.product .woocommerce-tabs .panel{
  margin: 0;
}



/* Andy Events calendar — theme polish + readability */
.andy-cal,
.andy-calendar{
  /*
    Don't force these with !important.
    The Andy Events plugin sets --andy-* inline per-shortcode.
    This block provides a fallback that follows the theme customizer,
    but still allows inline vars to win.
  */
  --andy-accent: var(--ze-btn-primary-bg, var(--accent));
  --andy-accent2: var(--ze-btn-primary-bg2, var(--accent2));
  --andy-btn-text: var(--ze-btn-primary-text, #fff);
  --andy-ink: var(--ze-text, #103532);
}



.ze-cal-tabs-glass .andy-cal-tabs .andy-cal-tab{
  background: rgba(255,255,255,.74);
  backdrop-filter: blur(14px);
  border:1px solid rgba(16,53,50,.14);
}
.ze-cal-tabs-glass .andy-cal-tabs .andy-cal-tab.is-active{
  background: linear-gradient(135deg, var(--andy-accent), rgba(255,255,255,.92));
  box-shadow: 0 18px 44px rgba(0,0,0,.14);
  border-color: rgba(255,255,255,.22);
}

.ze-cal-density-compact .andy-cal-cell{ min-height: 92px !important; }
.ze-cal-density-compact .andy-cal-pill{ padding: 8px 9px !important; }

/* =========================
   PDP Share (single source)
   ========================= */
body.single-product .ze-share{
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

body.single-product .ze-share__label{
  font-weight:900;
  opacity:.9;
  margin-right: 2px;
}

body.single-product .ze-share__btn{
  appearance:none;
  border:1px solid rgba(255,255,255,.16);
  background: var(--card);
  color:inherit;
  padding:10px 12px;
  border-radius:999px;
  text-decoration:none;
  font-weight:900;
  cursor:pointer;
  line-height:1;
}

body.ze-mode-beach.single-product .ze-share__btn{
  border-color: rgba(0,0,0,.12);
  background: rgba(0,0,0,.04);
}

body.single-product .ze-share__btn:hover{transform: translateY(-1px)}
body.single-product .ze-share__btn:active{transform: translateY(0)}


/* Map section layout (fills space + adds info panel on desktop) */
.ze-map-grid{
  display: grid;
  gap: 22px;
  align-items: stretch;
}
@media (min-width: 980px){
  .ze-map-grid{
    grid-template-columns: 420px 1fr;
  }
}
.ze-map-info{
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0 !important;
  min-height: 420px;
}
@media (min-width: 980px){
  .ze-map-info{min-height: 520px;}
}
.ze-map-body{
  position: relative;
  padding: 22px;
}
/* Map poster card: image ONLY at the top (not full background) */
.ze-map-info--poster{
  background: rgba(255,255,255,.06);
}

/* Turn the media into a top “banner” */
.ze-map-info--poster .ze-map-media{
  position: relative;      /* was absolute */
  inset: auto;             /* cancels inset:0 */
  height: 220px;           /* controls image height */
  margin: 14px 14px 0;     /* space around image inside the card */
  border-radius: 22px;     /* rounded image */
  overflow: hidden;
  background-size: cover;
  background-position: center;
  transform: none;
  filter: saturate(1.06) contrast(1.03);
}

/* If your markup uses an <img> inside .ze-map-media, support it too */
.ze-map-info--poster .ze-map-media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Optional subtle overlay ON THE IMAGE only */
.ze-map-info--poster .ze-map-media::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.18));
}

/* Text goes back to normal (not white on top of image) */
.ze-map-info--poster .ze-map-body{
  color: var(--text);
  text-shadow: none;
  padding-top: 14px;
}

@media (min-width: 980px){
  .ze-map-info--poster .ze-map-media{ height: 260px; }
}

/* =========================
   Map section – polished
   ========================= */

.btn-sm{padding:9px 12px;border-radius:999px;font-size:13px}

/* Kicker */
.ze-map-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:12px;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:950;
  opacity:.78;
  margin-bottom:10px;
}
.ze-map-kicker::before{
  content:"";
  width:10px;
  height:10px;
  border-radius:999px;
  background: color-mix(in srgb, var(--ze-sec-accent,var(--accent,#12C7B7)) 85%, #fff);
  box-shadow: 0 0 0 6px color-mix(in srgb, var(--ze-sec-accent,var(--accent,#12C7B7)) 14%, transparent);
}

/* Title + body copy */
.ze-map-info .ze-map-title{
  margin:0 0 10px;
  font-size:22px;
  line-height:1.15;
}
.ze-map-info .ze-map-text{
  font-size:15px;
  line-height:1.55;
  opacity:.92;
}
.ze-map-info .ze-map-text p{margin:0 0 10px}
.ze-map-info .ze-map-text p:last-child{margin-bottom:0}

/* Points list as “pills” (cleaner than bullets) */
.ze-map-points{
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 13.5px;
  line-height: 1.25;
  opacity: .96;
}
.ze-map-points li{
  display:flex;
  align-items:center;
  gap:10px;
  padding:9px 12px;
  border-radius:999px;
  border:1px solid var(--line);
  background: color-mix(in srgb, var(--ze-sec-surface,var(--surface,#fff)) 86%, transparent);
  font-weight: 900;
}
.ze-map-points li::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background: color-mix(in srgb, var(--ze-sec-accent,var(--accent,#12C7B7)) 95%, #fff 5%);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--ze-sec-accent,var(--accent,#12C7B7)) 14%, transparent);
  flex:0 0 8px;
}

/* Buttons */
.ze-map-actions{
  margin-top: 14px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.ze-map-note{
  margin-top: 14px;
  font-size: 13px;
  opacity: .72;
}

/* Poster style button feel */
.ze-map-info--poster .btn{box-shadow:0 18px 60px rgba(0,0,0,.20)}
.ze-map-info--poster .btn-ghost{
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.22);
  color: rgba(255,255,255,.96);
  backdrop-filter: blur(10px);
}
.ze-map-info--poster .btn-ghost:hover{background:rgba(255,255,255,.20)}
.ze-map-info--poster .ze-map-note{opacity:.82}

/* Map embed card: header bar + iframe fills remaining height */
.ze-map-embed{
  padding:0 !important;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.ze-map-embed__bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  border-bottom:1px solid var(--line);
  background: color-mix(in srgb, var(--card) 90%, transparent);
}
.ze-map-embed__title{
  font-weight:950;
  font-size:12.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  opacity:.85;
}
.ze-map-embed__frame{
  flex:1;
  min-height:420px; /* mobile */
}
.ze-map-embed__frame iframe{
  width:100% !important;
  max-width:100% !important;
  height:100% !important;
  min-height:420px;
  display:block;
  border:0;
}
@media (min-width: 980px){
  .ze-map-embed__frame{min-height:560px;}
  .ze-map-embed__frame iframe{min-height:560px;}
}
/* Map button theming */
#map{
  /* defaults if customizer not set */
  --ze-map-open-btn-bg: var(--ze-accent, var(--accent, #13a3a0));
  --ze-map-open-btn-text: #072427;
}

#map .btn-map-open{
  background: var(--ze-map-open-btn-bg);
  color: var(--ze-map-open-btn-text);
  border: 1px solid color-mix(in srgb, var(--ze-map-open-btn-bg) 70%, #000 30%);
  border-radius: 999px;
  padding: 10px 14px;
  line-height: 1;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 16px 40px rgba(0,0,0,.14);
}

#map .btn-map-open:hover{
  transform: translateY(-1px);
  box-shadow: 0 20px 55px rgba(0,0,0,.18);
  filter: brightness(0.98);
}

#map .btn-map-open:active{
  transform: translateY(0);
  filter: brightness(0.95);
}


/* Generic embed safety */
.ze-embed iframe, .ze-embed embed, .ze-embed object{
  width: 100% !important;
  max-width: 100% !important;
}
/* Calendar shortcode should use full available width on pages */
body.page .prose .andy-calendar{max-width:100% !important;width:100% !important}


/* Upcoming Events – mobile polish (bigger, cleaner, no CTA buttons) */
@media (max-width: 760px){
  .ze-section--events > .container{max-width:none;width:98vw;padding-left:0;padding-right:0}
  .ze-upcoming-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto;
    gap:14px;
  }
  /* Disable the desktop "featured" spanning layout on mobile */
  .ze-upcard--slot-1,.ze-upcard--slot-2,.ze-upcard--slot-3,.ze-upcard--slot-4{
    grid-column:auto;
    grid-row:auto;
  }
  .ze-upcard__actions{display:none!important}
  .ze-upcard--slot-1 .ze-upcard__label{bottom:14px;}
  .ze-upcard__img{aspect-ratio: 1 / 1.1;}
}


/* =========================
   Andy two-stage cart tidy
   ========================= */
body.single-product form.cart.andy-two-stage{
  display:flex;
  flex-direction:column;
  gap: 10px;
  margin: 12px 0 8px;
}

/* Variations table: keep label + field clean */
body.single-product form.cart.andy-two-stage .variations{
  width:100%;
  margin: 0 0 8px !important;
  border-collapse:separate;
  border-spacing:0;
}

body.single-product form.cart.andy-two-stage .variations th.label{
  padding: 6px 12px 6px 0;
  vertical-align: top;
  width: 38%;
}

body.single-product form.cart.andy-two-stage .variations td.value{
  padding: 6px 0;
  display:flex;              /* THIS stops “touching” */
  flex-direction:column;
  gap:8px;                   /* select -> qty gap */
}

/* Select full width */
body.single-product form.cart.andy-two-stage .variations select{
  width:100% !important;
  max-width:100%;
  height:44px;
  border-radius:14px;
}

/* Qty look + no manual margin hacks */
body.single-product form.cart.andy-two-stage .quantity{margin:0 !important}
body.single-product form.cart.andy-two-stage .quantity input.qty,
body.single-product form.cart.andy-two-stage #andy_upgrade_qty{
  width:92px;
  min-width:92px;
  height:44px;
  margin:0 !important;
}

/* If button is inside .qty-wrap, align nicely */
body.single-product form.cart.andy-two-stage .qty-wrap{
  display:grid;
  grid-template-columns: 92px 1fr;
  gap:12px;
  align-items:center;
  margin-top: 2px;
}

/* If button is outside, still make it full width */
body.single-product form.cart.andy-two-stage .single_add_to_cart_button{
  width:100%;
  justify-content:center;
  margin-top: 8px;
  margin-bottom: 8px;
}


/* Make sure variations section has breathing room */
body.single-product form.cart.andy-two-stage .variations{
  margin: 0 0 8px !important;
}

/* Row that contains qty + button */
body.single-product form.cart.andy-two-stage .qty-wrap{
  margin-top: 8px;
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Remove the hacky margin on the input so it aligns */
body.single-product form.cart.andy-two-stage .qty-wrap .quantity input.qty,
body.single-product form.cart.andy-two-stage #andy_upgrade_qty{
  margin-top: 0 !important;
}

/* Kill any default spacing that creates the big gap */
body.single-product .ze-product__gallery .woocommerce-product-gallery .flex-viewport{
  margin: 0 !important;
  height: auto !important;
  border-radius: 24px;
  overflow: hidden;
}

/* Force the main image area to be FULL width (prevents the “floating image” look) */
body.single-product .ze-product__gallery .woocommerce-product-gallery__wrapper,
body.single-product .ze-product__gallery .woocommerce-product-gallery__image,
body.single-product .ze-product__gallery .woocommerce-product-gallery__image a{
  width: 100% !important;
  margin: 0 !important;
  display: block !important;
  padding: 0 !important;
}

/* Make the image actually fill the viewport */
body.single-product .ze-product__gallery .woocommerce-product-gallery__wrapper img{
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 24px;
}

/* OPTIONAL: if you want a consistent “event hero” crop, uncomment these 2 lines */
/*
body.single-product .ze-product__gallery .flex-viewport{ aspect-ratio: 16/10; }
body.single-product .ze-product__gallery .woocommerce-product-gallery__wrapper img{ height:100% !important; object-fit:cover; }
*/

/* Remove the magnifier / zoom icon (optional but looks cleaner) */
body.single-product .ze-product__gallery .woocommerce-product-gallery__trigger{
  display:none !important;
}


/* ------------------------------------------------------------------
   CLICK FIX: dividers/waves must never block clicks
------------------------------------------------------------------- */
.ze-divider,
.ze-divider *{
  pointer-events:none !important;
}

.hero-wave,
.hero-wave *{
  pointer-events:none !important;
}


/* Make sure cards can layer correctly */
.ze-upcard,
.ze-card {
  position: relative;
}

/* Full-card clickable hit area (you add this anchor in markup below) */
.ze-card__hit,
.ze-upcard__hit {
  position: absolute;
  inset: 0;
  z-index: 5;
  border-radius: inherit;
  display: block;
}

/* If you have buttons inside cards, keep them above the hit layer */
.ze-upcard button,
.ze-upcard .ze-btn,
.ze-card button,
.ze-card .ze-btn,
.ze-upcard a.ze-btn,
.ze-card a.ze-btn {
  position: relative;
  z-index: 6;
}

/* === Premium Single Product layout (Theme v0.9.x) === */
body.single-product .site-main{ padding-top: 18px; }

body.single-product .ze-product{
  background: var(--surface, #fff);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 24px;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
  padding: clamp(16px, 2vw, 26px);
}

body.single-product .ze-product__grid{
  display: grid;
  gap: clamp(16px, 2vw, 28px);
}

@media (min-width: 960px){
  body.single-product .ze-product__grid{
    grid-template-columns: 1.1fr 0.9fr;
    align-items: start;
  }
  body.single-product .ze-product__summary{
    position: sticky;
    top: 96px;
  }
}

/* Keep Woo’s gallery but make it “card-like” */
body.single-product .ze-product__media .woocommerce-product-gallery{
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}

body.single-product .woocommerce-product-gallery__wrapper{
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.08);
  background: transparent;
}
/* PDP main image: force the active slide to fill the viewport (kills right-side gap) */
body.single-product .woocommerce-product-gallery .flex-viewport{
  background: transparent !important;
  overflow: hidden !important;
}

body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image,
body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image a{
  display: block !important;
  width: 100% !important;
}

body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image img{
  display: block !important;
  width: 100% !important;
  height: auto !important;
}


/* Thumbs (single source of truth): row under main image, no numbers */
body.single-product .woocommerce-product-gallery .flex-control-thumbs{
  list-style: none !important;     /* removes 1,2,3… */
  margin: 10px 0 0 !important;
  padding: 0 !important;

  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs li{
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;

  flex: 0 0 84px;
  width: 84px;
  height: 84px;

  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.08);
  background: #fff;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;

  opacity: .85;
  transition: opacity .2s ease, transform .2s ease;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs li:hover img{
  opacity: 1;
  transform: scale(1.02);
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs li.flex-active,
body.single-product .woocommerce-product-gallery .flex-control-thumbs li.flex-active-slide{
  border-color: rgba(18,199,183,.55);
  box-shadow: 0 0 0 3px rgba(18,199,183,.18);
}

@media (min-width: 700px){
  body.single-product .woocommerce-product-gallery .flex-control-thumbs{
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 6px !important;
  }
}


@media (min-width: 700px){
  body.single-product .woocommerce-product-gallery .flex-control-thumbs{
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 6px !important;
  }
}


/* Summary typography */
body.single-product .ze-product__summary .product_title{
  font-size: clamp(26px, 2.2vw, 40px);
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin: 0 0 10px;
}

body.single-product .ze-product__summary .price{
  font-size: clamp(18px, 1.4vw, 22px);
  margin: 8px 0 12px;
}

body.single-product .ze-product__summary .woocommerce-product-details__short-description{
  color: var(--muted, #51606A);
}

/* Add-to-cart area: keep it readable and not cramped */
body.single-product .ze-product__summary form.cart{
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(0,0,0,.06);
}

/* Tabs / related: give breathing room */
body.single-product .woocommerce-tabs{
  margin-top: 26px;
}

body.single-product .related.products{
  margin-top: 26px;
}

/* --- Fix: Woo gallery must fill our left column (removes white gap) --- */
.ze-product__media .woocommerce-product-gallery{
  width: 100% !important;
  max-width: none !important;
  float: none !important;
  margin: 0 !important;
}

.ze-product__media .woocommerce-product-gallery__wrapper{
  width: 100% !important;
  max-width: none !important;
}

.ze-product__media .woocommerce-product-gallery__image{
  width: 100% !important;
}

.ze-product__media .woocommerce-product-gallery__image a,
.ze-product__media .woocommerce-product-gallery__image img{
  display: block;
  width: 100% !important;
  height: auto !important;
}
/* =========================
   Related products – premium cards (single product only)
   ========================= */

body.single-product .related.products{
  margin-top: 34px;
}

body.single-product .related.products > h2{
  margin: 0 0 14px;
  font-size: clamp(22px, 2.2vw, 30px);
  line-height: 1.1;
  font-weight: 950;
  letter-spacing: -.02em;
}

/* Force a clean grid just for related products */
body.single-product .related.products ul.products{
  display: grid !important;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
}

@media (min-width: 640px){
  body.single-product .related.products ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 980px){
  body.single-product .related.products ul.products{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Card */
body.single-product .related.products ul.products li.product{
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;

  border-radius: 24px;
  overflow: hidden;

  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  box-shadow: 0 18px 55px rgba(0,0,0,.28);

  display: flex;
  flex-direction: column;

  transition: transform .18s ease, filter .18s ease;
}

body.single-product .related.products ul.products li.product:hover{
  transform: translateY(-2px);
  filter: brightness(1.02);
}

/* Image full-bleed */
body.single-product .related.products ul.products li.product a.woocommerce-LoopProduct-link{
  display: block;
  text-decoration: none;
  color: inherit;
}

body.single-product .related.products ul.products li.product a.woocommerce-LoopProduct-link img{
  display: block !important;
  width: 100% !important;
  aspect-ratio: 4 / 3;
  height: auto !important;
  object-fit: cover;
  margin: 0 !important;
}

/* Title: STOP Woo's big h2 sizing */
body.single-product .related.products ul.products li.product .woocommerce-loop-product__title{
  margin: 14px 16px 6px !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
  font-weight: 950 !important;
  letter-spacing: -.01em;
  color: rgba(255,255,255,.92);
}

/* Price */
body.single-product .related.products ul.products li.product .price{
  margin: 0 16px 14px !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  opacity: .88;
}

/* Button pinned to bottom, full width, never hanging off */
body.single-product .related.products ul.products li.product .button{
  margin: auto 16px 16px !important;
  width: calc(100% - 32px) !important;

  display: flex !important;
  justify-content: center !important;
  align-items: center !important;

  text-align: center !important;
  border-radius: 16px !important;

  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

/* Beach mode: lighter cards */
body.ze-mode-beach.single-product .related.products ul.products li.product{
  border-color: rgba(11,27,28,.10);
  background: rgba(255,255,255,.62);
  box-shadow: 0 18px 60px rgba(11,27,28,.10);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

body.ze-mode-beach.single-product .related.products ul.products li.product .woocommerce-loop-product__title{
  color: var(--text);
}
/* Blog cards: featured image should FIT inside (no crop) */
.ze-blog-card .ze-card-media,
.ze-blog-card .post-thumb,
.ze-blog-card .card-thumb,
.blog .card-thumb,
.blog .post-thumb {
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-color: #fff; /* keeps it clean if there’s empty space */
}

/* If the blog card uses an <img> instead of background-image */
.ze-blog-card img,
.blog .wp-post-image {
  object-fit: contain !important;
  background: #fff;
}
/* Give the mcard CTA breathing room from the image */
.andy-mcard .andy-mcard-btn{
  margin-top: 14px !important; /* increase if you want more gap */
}
/* =========================
   Blog -> Mobile carousel
   ========================= */
@media (max-width: 860px){

  /* Prefer: .ze-blog-rail (add it to the blog grid) */
  .ze-blog-rail,
  /* Fallbacks if you don't want to touch markup */
  .ze-section--blog .grid-3,
  #blog .grid-3{
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;

    overflow-x: auto !important;
    overflow-y: hidden !important;

    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch !important;

    /* nice “rail” spacing */
    padding: 0 14px 14px !important;
    margin: 0 -14px !important; /* makes it feel full-bleed inside container */
  }

  /* Hide scrollbar */
  .ze-blog-rail::-webkit-scrollbar,
  .ze-section--blog .grid-3::-webkit-scrollbar,
  #blog .grid-3::-webkit-scrollbar{ display:none; }
  .ze-blog-rail,
  .ze-section--blog .grid-3,
  #blog .grid-3{ scrollbar-width:none; }

  /* Each card becomes a slide */
  .ze-blog-rail > *,
  .ze-section--blog .grid-3 > *,
  #blog .grid-3 > *{
    flex: 0 0 86% !important;          /* one main card per swipe */
    min-width: 86% !important;
    scroll-snap-align: center !important;
    scroll-snap-stop: always !important;
  }

  /* Optional: slightly smaller on very small screens */
  @media (max-width: 420px){
    .ze-blog-rail > *,
    .ze-section--blog .grid-3 > *,
    #blog .grid-3 > *{
      flex-basis: 90% !important;
      min-width: 90% !important;
    }
  }
}

/* Optional: subtle edge fade hint (only if you like it) */
@media (max-width: 860px){
  .ze-section--blog .container{ position: relative; }
  .ze-section--blog .container::before,
  .ze-section--blog .container::after{
    content:"";
    position:absolute;
    top: 44px;                 /* adjust if it clashes with your heading */
    bottom: 10px;
    width: 18px;
    pointer-events:none;
    z-index: 5;
  }
  .ze-section--blog .container::before{
    left: 0;
    background: linear-gradient(90deg, var(--ze-sec-bg, transparent), transparent);
  }
  .ze-section--blog .container::after{
    right: 0;
    background: linear-gradient(270deg, var(--ze-sec-bg, transparent), transparent);
  }
}
/* =========================================================
   CALENDAR SECTION — center the embed + use space better
   ========================================================= */

/* Center the whole calendar card on the page (stops “left stuck” look) */
#calendar .card.card-pad{
  max-width: 1120px;   /* tweak if you want wider/narrower */
  margin-left: auto;
  margin-right: auto;
}

/* Make whatever the shortcode outputs fill the card */
#calendar .ze-embed{
  width: 100%;
}
#calendar .ze-embed > *{
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto;
  margin-right: auto;
}

/* --- Two-column layout for calendar “cards/list” area (if multiple items) --- */
/* Your plugin uses .andy-mcard (we see it referenced in your CSS),
   so we turn the WRAPPER that holds the cards into a 2-col grid.
   (We include multiple wrapper names as fallbacks.) */
@media (min-width: 720px){
  #calendar .andy-calendar .andy-mcards,
  #calendar .andy-cal .andy-mcards,
  #calendar .andy-calendar .andy-mcard-grid,
  #calendar .andy-cal .andy-mcard-grid,
  #calendar .andy-calendar .andy-cards,
  #calendar .andy-cal .andy-cards,
  #calendar .andy-calendar .andy-list,
  #calendar .andy-cal .andy-list{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
    align-items: stretch;
  }

  /* Ensure each card behaves as a full grid item */
  #calendar .andy-mcard{
    width: 100% !important;
    max-width: 100% !important;
  }
}
/* =========================================================
   FIX: stop “blank overhang” / horizontal scroll on mobile
   ========================================================= */

/* Strong safety net */
html, body{ overflow-x: hidden; }

/* Don’t let decorative glows create horizontal overflow */
body.ze-mode-beach .ze-section{ overflow-x: clip; } /* modern browsers */
@supports not (overflow-x: clip){
  body.ze-mode-beach .ze-section{ overflow-x: hidden; }
}

/* Also make the glow not extend past the sides */
body.ze-mode-beach .ze-section::before{
  left: 0 !important;
  right: 0 !important;
  /* keep the vertical “spread”, remove horizontal spread */
  top: -120px !important;
  bottom: -120px !important;
}
/* Desktop: hide posts after the first 3 */
@media (min-width: 861px){
  #blog .ze-only-mobile{ display: none !important; }
}

/* Mobile: show them (so the carousel includes all) */
@media (max-width: 860px){
  #blog .ze-only-mobile{ display: block !important; }
}
/* =========================================================
   Buttons
========================================================= */

.ze-book-btn{
  background: linear-gradient(90deg, var(--accent2), var(--accent)) !important;
  color: #fff !important;
}

/* ZE DIVIDER SEAM FIX v1
   Removes 1px hairlines where SVG wave meets sections (anti-alias gaps)
*/
.ze-divider,
.ze-divider-wrap,
.section-divider,
.elementor-shape{
  line-height: 0 !important;
  font-size: 0 !important;
}

.ze-divider__svg,
.elementor-shape svg,
.section-divider svg{
  display:block !important;
  width:100% !important;
  height:auto;
  vertical-align: bottom !important;

  /* overlap by 2px to kill the seam */
  margin-bottom: -2px !important;
}

/* If any dividers sit ABOVE a section, also overlap upward */
.ze-divider--top .ze-divider__svg,
.section-divider.top svg{
  margin-top: -2px !important;
}

/* =========================================================
   DIVIDER FIX (full width + no weird gaps)
   ========================================================= */

/* If a divider is placed inside .container, force it to bleed full-viewport */
.container .ze-divider{
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.ze-divider{
  position: relative;
  overflow: hidden;
  line-height: 0;
  pointer-events: none;
}

.ze-divider__svg{
  display: block;
  width: 100%;
  height: 100%;
}

/* Image-based divider must stretch edge-to-edge */
.ze-divider__img{
  display: block;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 100% 100%;
}

/* Kill 1px seams from subpixel rounding */
.ze-divider--bottom{ margin-bottom: -1px; }
.ze-divider--top{ margin-top: -1px; }
/* =========================
   ZE Divider Fixes (layout)
   ========================= */

/* Make likely section wrappers positioning contexts */
:where(.ze-hero, .ze-section, .ze-band, .ze-wrap, section) { position: relative; }

/* If divider is placed INSIDE a section, it should overlay the edge (not take up space) */
:where(.ze-hero, .ze-section, .ze-band, .ze-wrap, section) > .ze-divider{
  position: absolute;
  left: 0; right: 0;
  margin: 0 !important;
  overflow: hidden;
  line-height: 0;          /* kills inline-svg whitespace gaps */
  pointer-events: none;
  z-index: 5;
}

/* Anchor to the edge */
:where(.ze-hero, .ze-section, .ze-band, .ze-wrap, section) > .ze-divider--bottom{ bottom: -1px; }
:where(.ze-hero, .ze-section, .ze-band, .ze-wrap, section) > .ze-divider--top{
  top: -1px;
  transform: rotate(180deg);
  transform-origin: center;
}

/* SVG should truly fill the divider box */
.ze-divider__svg{
  display: block;
  width: 100%;
  height: 100%;
}

/* Image divider must fill height + repeat horizontally + sit on the bottom edge */
.ze-divider__img{
  display: block;
  width: 100%;
  height: 100%;
  background-repeat: repeat-x !important;
  background-position: center bottom !important;
  background-size: auto 100% !important; /* scale to divider height */
}
/* =========================
   Divider hotfix (full-bleed + PNG wave span)
   ========================= */

/* If a divider is output inside a .container, force full-viewport bleed */
.container .ze-divider,
.container .ze-divider-wrap .ze-divider{
  left: 50% !important;
  width: 100vw !important;
  margin-left: -50vw !important;
  right: auto !important;
  max-width: none !important;
}

.ze-divider--wave_img_original .ze-divider__img{
  display:block;
  width:100%;
  height:100%;

  /* 1) put gradient behind  2) put transparent PNG on top */
  background-image:
    linear-gradient(135deg, var(--ze-divider-g1), var(--ze-divider-g2)),
    url("waves/illustrated-wave-transparent.png");

  background-repeat: no-repeat, repeat-x;
  background-position: center, center bottom;
  background-size: cover, auto 100%;
}
.ze-divider--wave_img_original.ze-divider--top .ze-divider__img{
  background-position: center, center top;
}
/* Force dividers to be full-bleed even if markup is inside .container */
.container .ze-divider{
  left: 50% !important;
  width: 100vw !important;
  margin-left: -50vw !important;
}
/* === Divider FIXES (must be last in file) === */

/* 1) Full-bleed even if divider is rendered inside a .container */
.container .ze-divider{
  left: 50% !important;
  width: 100vw !important;
  margin-left: -50vw !important;
  max-width: none !important;
}

/* 2) Stop the wrapper rectangle being painted (this causes the “big bar”) */
.ze-divider{
  background: transparent !important;
}

/* If you still use the PNG divider anywhere, keep its painting limited to the image span */
.ze-divider--wave_img_original{ background: transparent !important; }
.ze-divider--wave_img_original .ze-divider__img{
  background-position: bottom center !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
}



/* ============================================================
   ZE Divider overlap + see-through blending (FINAL OVERRIDES)
   - Full-bleed (ignores .container)
   - Uses per-style shift variables injected by PHP to hide the SVG's empty whitespace
   - Prevents legacy rules later in this file from snapping dividers back to top:-1px/bottom:-1px
   ============================================================ */
.ze-divider{
  position:absolute !important;
  left:50% !important;
  width:100vw !important;
  margin-left:-50vw !important;
  background:transparent !important;
  overflow:hidden !important;
  pointer-events:none !important;
  line-height:0 !important;
  z-index:50 !important;
}
.ze-divider__svg{ display:block; width:100%; height:100%; }

/* Use computed shift vars (set in functions.php) so the wavy edge sits exactly on the section boundary */
.ze-divider--top{ top: calc(-1px - var(--ze-divider-top-shift, 0px)) !important; }
.ze-divider--bottom{ bottom: calc(-1px - var(--ze-divider-bottom-shift, 0px)) !important; }

/* Reserve only the portion of the divider that remains inside the section after shifting */
.section.ze-section{
  padding-top: calc(52px + var(--ze-divider-top-pad, 0px)) !important;
  padding-bottom: calc(52px + var(--ze-divider-bottom-pad, 0px)) !important;
}

/* Calendar day “pill” — bigger image + flush to top */
#calendar .andy-cal-pill{
  padding: 0 !important;          /* remove the inner gap around the image */
  overflow: hidden !important;    /* keeps rounded corners clean */
  border-radius: 22px !important; /* match your card rounding */
}

/* Thumbnail (covers different possible markup names) */
#calendar .andy-cal-pill img,
#calendar .andy-cal-pill__img,
#calendar .andy-cal-pill .andy-cal-thumb,
#calendar .andy-cal-pill .thumb{
  display: block !important;
  width: 100% !important;
  height: 140px !important;       /* tweak: 120–170px */
  object-fit: cover !important;
  margin: 0 !important;
  border-radius: 22px 22px 16px 16px !important; /* flush top corners */
}

/* Keep the Book button nicely inset (so it doesn’t stick to edges) */
#calendar .andy-cal-pill .btn,
#calendar .andy-cal-pill a.button,
#calendar .andy-cal-pill .andy-cal-pill__btn,
#calendar .andy-cal-pill .andy-cal-pill__cta{
  margin: 12px !important;
  width: calc(100% - 24px) !important;
}

/* If there’s a little count badge (like “5”), keep it on the image */
#calendar .andy-cal-pill .andy-cal-pill__badge,
#calendar .andy-cal-pill .andy-cal-pill__count,
#calendar .andy-cal-pill .count{
  top: 10px !important;
  right: 10px !important;
}

/* ---- 10-base.css ---- */
/* 10-base.css — extracted rules live here (currently empty) */

/* ---- 20-header.css ---- */
/* ==========================================================
   Header nav: keep WHITE links everywhere + underline hover/active
   ========================================================== */

/* Top-level menu links (try to catch all theme nav structures) */
header.site-header .main-navigation > ul > li > a,
header.site-header nav ul.menu > li > a,
header.site-header nav ul > li > a,
.ze-header nav ul.menu > li > a,
.ze-header nav ul > li > a{
  color: #fff !important;
  opacity: .92;
  text-decoration: none !important;

  /* underline effect */
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-position: 50% 100%;
  background-size: 0% 2px;

  padding-bottom: 6px;
  transition: background-size .18s ease, opacity .18s ease, transform .18s ease;
}

header.site-header .main-navigation > ul > li > a:hover,
header.site-header nav ul.menu > li > a:hover,
header.site-header nav ul > li > a:hover,
.ze-header nav ul.menu > li > a:hover,
.ze-header nav ul > li > a:hover{
  opacity: 1;
  background-size: 100% 2px;
}

/* Keep underline on the selected/active page */
header.site-header .current-menu-item > a,
header.site-header .current_page_item > a,
header.site-header .current-menu-ancestor > a,
header.site-header .current-menu-parent > a,
.ze-header .current-menu-item > a,
.ze-header .current_page_item > a,
.ze-header .current-menu-ancestor > a,
.ze-header .current-menu-parent > a{
  opacity: 1;
  background-size: 100% 2px;
}

/* (Optional) dropdown menus usually sit on light panels, keep them dark */
header.site-header ul.sub-menu a,
.ze-header ul.sub-menu a{
  color: var(--ze-ink, #103532) !important;
  background-image: none !important;
  padding-bottom: 0 !important;
}

/* ---- 20-layout.css ---- */
/* 20-layout.css — layout rules */

/* Mobile layout override for Upcoming Events (Customizer-controlled) */
@media (max-width: 860px){
  .ze-upcoming-grid.ze-mobile-layout-carousel{
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory;
    padding: 0 14px 14px !important;
    margin: 0 !important;
  }
  .ze-upcoming-grid.ze-mobile-layout-carousel > *{
    flex: 0 0 82% !important;
    max-width: 82% !important;
    scroll-snap-align: start;
  }

  /* Explicit grid override (keeps 2×2 style if theme defaults change later) */
  .ze-upcoming-grid.ze-mobile-layout-grid{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}

/* ---- 30-hero.css ---- */
/* 30-hero.css — Hero (video/poster/slider) */

.hero{
  position:relative;
  min-height: calc(var(--ze-hero-min-vh, 78) * 1vh);
  display:flex;
  align-items:flex-end;
  overflow:hidden;
}

.hero-media{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:hidden;
}

.hero-poster{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  background-size:cover;
  background-position:center;
}

.ze-hero-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(1.05) contrast(1.03);
}

/* Hide ONLY the video on mobile when toggled, poster remains */
@media (max-width: 768px), (prefers-reduced-motion: reduce){
  .ze-hero-video[data-hide-on-mobile="1"]{ display:none; }
}

/* Slider */
.ze-hero-slider{
  position:absolute;
  inset:0;
  overflow:hidden;
}

.ze-hero-slide{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  background-size:cover;
  background-position:center;
  opacity:0;
  transition: opacity .9s ease;
}
.ze-hero-slide.is-active{ opacity:1; }

.ze-hero-slide__scrim{
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.20), rgba(0,0,0,.55));
}

/* ---- 40-dividers.css ---- */
/* 40-dividers.css — Canonical divider rules */

html, body { overflow-x: hidden; }
@supports (overflow-x: clip) {
  html, body { overflow-x: clip; }
}

/* HERO full-bleed */
.hero{
  width:100vw;
  max-width:none;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
}

/* Sections produced by ze_section_attrs() have data-sec */
.section[data-sec]{
  position:relative;
  overflow:visible;
  margin:0;
  --ze-sec-pad-y: 10px;
  padding-top: calc(var(--ze-sec-pad-y) + var(--ze-divider-top-pad, var(--ze-divider-top-h, 0px)));
  padding-bottom: calc(var(--ze-sec-pad-y) + var(--ze-divider-bottom-pad, var(--ze-divider-bottom-h, 0px)));
}
.section[data-sec][data-divider-top="none"]{ padding-top: var(--ze-sec-pad-y); }
.section[data-sec][data-divider-bottom="none"]{ padding-bottom: var(--ze-sec-pad-y); }

/* Divider should never block content */
.section[data-sec] > .ze-divider{ z-index:2; }
.section[data-sec] > .container{ position:relative; z-index:3; }

/* Base divider */
.ze-divider{
  overflow:hidden;
  pointer-events:none;
  line-height:0;
  background:transparent;
  color: var(--ze-divider-g1, currentColor);
}

/* Full-bleed absolute positioning for dividers inside sections/hero */
.section[data-sec] > .ze-divider,
.hero .ze-divider{
  position:absolute;
  left:50%;
  width:100vw;
  margin-left:-50vw;
  transform: translate3d(0,0,0);
}

.section[data-sec] > .ze-divider.ze-divider--top{
  top: calc(-1px - var(--ze-divider-top-shift, 0px));
  height: var(--ze-divider-top-h, 0px) !important;
}
.section[data-sec] > .ze-divider.ze-divider--bottom{
  bottom: calc(-1px - var(--ze-divider-bottom-shift, 18px));
  height: var(--ze-divider-bottom-h, 0px) !important;
}

/* Orientation */
.section[data-sec] > .ze-divider.ze-divider--top:not(.ze-divider--glass_fade):not(.ze-divider--el_waves_brush){
  transform: scaleY(-1) translate3d(0,0,0);
  transform-origin:center;
}
.section[data-sec] > .ze-divider.ze-divider--el_waves_brush.ze-divider--bottom svg{
  transform: scaleY(-1) translate3d(0,0,0);
  transform-origin:center;
}

/* SVG sizing */
.ze-divider__svg,
.ze-divider svg{
  width:100%;
  height:100%;
  display:block;
  max-width:none;
  margin:0;
  background:transparent;
  vertical-align:bottom;
  fill: currentColor;
}

/* Colour rules (default: match THIS section) */
.section[data-sec] > .ze-divider{
  --ze-divider-g1: var(--ze-divider-tint-override, var(--ze-sec-bg, var(--bg, #fff)));
  --ze-divider-g2: var(--ze-divider-tint-override, var(--ze-sec-bg2, var(--ze-sec-bg, var(--bg, #fff))));
  color: var(--ze-divider-g1);
}

/* Seamless mode: bottom matches NEXT, top matches PREV */
body.ze-divider-fill-seamless .section[data-sec] > .ze-divider.ze-divider--bottom{
  --ze-divider-g1: var(--ze-divider-tint-override, var(--ze-next-bg, var(--bg, #fff)));
  --ze-divider-g2: var(--ze-divider-tint-override, var(--ze-next-bg2, var(--ze-next-bg, var(--bg, #fff))));
  color: var(--ze-divider-g1);
}
body.ze-divider-fill-seamless .section[data-sec] > .ze-divider.ze-divider--top{
  --ze-divider-g1: var(--ze-divider-tint-override, var(--ze-prev-bg, var(--bg, #fff)));
  --ze-divider-g2: var(--ze-divider-tint-override, var(--ze-prev-bg2, var(--ze-prev-bg, var(--bg, #fff))));
  color: var(--ze-divider-g1);
}

/* Image-based divider (transparent PNG wave) */
.ze-divider--wave_img_original .ze-divider__img{
  display:block;
  width:100%;
  height:100%;
  background-image: url("waves/illustrated-wave-original-transparent.png");
  background-repeat:no-repeat;
  background-position:center bottom;
  background-size:100% 100%;
}
.ze-divider--wave_img_original.ze-divider--top{ transform:none !important; }

/* ---- 50-sections.css ---- */
/* 50-sections.css — extracted rules live here (currently empty) */

/* Packages banner (single promo image) */
.ze-packages-banner{
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(0,0,0,.14);
}
.ze-packages-banner__link{ display:block; }
.ze-packages-banner__img{
  width: 100%;
  height: auto;
  display: block;
}

/* ---- 60-woocommerce.css ---- */
/* 60-woocommerce.css — WooCommerce layout polish (single product + checkout)
   NOTE: Compiled into assets/main.css via tools/build-css.sh
*/

/* ==========================================================
   SINGLE PRODUCT — Image left / Options right
   ========================================================== */

body.woocommerce.single-product div.product{ margin-top: 18px; }

/* --- 2-column layout (desktop) --- */
@media (min-width: 920px){
  body.woocommerce.single-product div.product{
    display: grid !important;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr) !important;
    gap: 26px !important;
    align-items: start !important;
  }

  body.woocommerce.single-product div.product .woocommerce-product-gallery{
    grid-column: 1 !important;
    margin: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.woocommerce.single-product div.product .summary{
    grid-column: 2 !important;
    margin: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.woocommerce.single-product div.product > .woocommerce-tabs,
  body.woocommerce.single-product div.product > .related,
  body.woocommerce.single-product div.product > .up-sells,
  body.woocommerce.single-product div.product > .upsells{
    grid-column: 1 / -1 !important;
  }
}

/* --- Gallery polish --- */
body.woocommerce.single-product .woocommerce-product-gallery{
  position: relative;
  width: 100% !important;
  margin: 0 !important;
}

body.woocommerce.single-product .woocommerce-product-gallery__wrapper{
  border-radius: 26px !important;
  overflow: hidden !important;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 18px 45px rgba(10,20,30,.10);
}

body.woocommerce.single-product .woocommerce-product-gallery__wrapper img{
  display: block !important;
  width: 100% !important;
  height: auto !important;
}

/* --- Thumbnails: 5 across, full width, wrap --- */
body.woocommerce.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs,
body.woocommerce.single-product .woocommerce-product-gallery .flex-control-thumbs{
  margin: 12px 0 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 12px !important;
  overflow: visible !important;
  list-style: none !important;
}

body.woocommerce.single-product .woocommerce-product-gallery .flex-control-thumbs li{
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  aspect-ratio: 1 / 1 !important;
  background: rgba(255,255,255,.55) !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  display: block !important;
}

body.woocommerce.single-product .woocommerce-product-gallery .flex-control-thumbs li img{
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  border: 0 !important;
  border-radius: 0 !important;
  opacity: .92 !important;
  transition: transform .15s ease, opacity .15s ease, filter .15s ease;
}

body.woocommerce.single-product .woocommerce-product-gallery .flex-control-thumbs li:hover img{
  transform: scale(1.03);
  opacity: 1 !important;
}

body.woocommerce.single-product .woocommerce-product-gallery .flex-control-thumbs li img.flex-active{
  opacity: 1 !important;
  filter: none !important;
}

@media (max-width: 720px){
  body.woocommerce.single-product .woocommerce-product-gallery .flex-control-thumbs{
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 480px){
  body.woocommerce.single-product .woocommerce-product-gallery .flex-control-thumbs{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* --- Summary typography --- */
body.woocommerce.single-product div.product .summary{ padding: 0 !important; }

body.woocommerce.single-product div.product .summary .product_title{
  margin: 2px 0 6px !important;
  font-weight: 900 !important;
  letter-spacing: -0.02em;
  line-height: 1.05;
  font-size: 32px !important;
  color: var(--ze-ink, #103532);
}

body.woocommerce.single-product div.product .summary .price{
  margin: 0 0 14px !important;
  font-weight: 900 !important;
  font-size: 16px !important;
  color: rgba(16,53,50,.82);
}

/* --- Ticket options card --- */
body.woocommerce.single-product div.product form.cart,
body.woocommerce.single-product div.product .variations_form.cart{
  background: rgba(255,255,255,.78) !important;
  border: 1px solid rgba(0,0,0,.06) !important;
  border-radius: 26px !important;
  padding: 14px 14px 16px !important;
  box-shadow: 0 18px 45px rgba(10,20,30,.10) !important;
  margin: 0 0 14px !important;
}

/* --- Variations table --- */
body.woocommerce.single-product div.product table.variations{
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 10px !important;
  margin: 0 0 10px !important;
  table-layout: fixed !important;
}

body.woocommerce.single-product div.product table.variations th,
body.woocommerce.single-product div.product table.variations td{
  padding: 0 !important;
  border: 0 !important;
  vertical-align: top !important;
}

body.woocommerce.single-product div.product table.variations th{
  width: 160px !important;
  padding-right: 14px !important;
}

body.woocommerce.single-product div.product table.variations label{
  display: block !important;
  font-weight: 900 !important;
  font-size: 12px !important;
  letter-spacing: .06em;
  text-transform: uppercase;
  opacity: .78;
  margin: 0 0 6px !important;
}

body.woocommerce.single-product div.product table.variations select{
  width: 100% !important;
  height: 46px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(0,0,0,.14) !important;
  background: rgba(255,255,255,.85) !important;
  padding: 10px 12px !important;
  font-weight: 800 !important;
  color: var(--ze-ink, #103532) !important;
}

/* ==========================================================
   HOLIDAY DATES — Arrive + Leave INLINE (clean + stable)
   Requires the wrapper markup in the plugin template.
   ========================================================== */

body.woocommerce.single-product .andy-holiday-dates{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px 14px !important;
  align-items: start !important;
  margin: 0 !important;
}

body.woocommerce.single-product .andy-holiday-dates .andy-hd-field{
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  min-width: 0 !important;
}

body.woocommerce.single-product .andy-holiday-dates .andy-hd-field label{
  font-weight: 900 !important;
  font-size: 12px !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  opacity: .82 !important;
  margin: 0 !important;
}

body.woocommerce.single-product .andy-holiday-dates input[type="date"]{
  width: 100% !important;
  height: 46px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(0,0,0,.14) !important;
  background: rgba(255,255,255,.85) !important;
  padding: 10px 12px !important;
  font-weight: 800 !important;
  color: var(--ze-ink, #103532) !important;
}

body.woocommerce.single-product .andy-holiday-dates .andy-holiday-help{
  grid-column: 1 / -1 !important;
  margin: 2px 0 0 !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
  color: rgba(16,53,50,.78) !important;
}

@media (max-width: 560px){
  body.woocommerce.single-product .andy-holiday-dates{
    grid-template-columns: 1fr !important;
  }
}

/* --- Quantity --- */
body.woocommerce.single-product div.product .cart .quantity{ margin: 10px 0 12px !important; }

body.woocommerce.single-product div.product .cart .quantity input.qty{
  width: 96px !important;
  height: 46px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(0,0,0,.14) !important;
  background: rgba(255,255,255,.85) !important;
  text-align: center !important;
  font-weight: 900 !important;
}

/* --- Add to cart button --- */
body.woocommerce.single-product div.product .single_add_to_cart_button,
body.woocommerce.single-product div.product button.single_add_to_cart_button{
  width: 100% !important;
  border-radius: 999px !important;
  padding: 14px 18px !important;
  font-weight: 900 !important;
  border: 0 !important;
  color: #fff !important;
  background: linear-gradient(135deg, var(--ze-accent2, #7C4DFF), var(--ze-accent, #17C3CE)) !important;
  box-shadow: 0 14px 34px rgba(10,20,30,.14) !important;
}

/* --- Tabs --- */
body.woocommerce.single-product .woocommerce-tabs{ margin-top: 18px !important; }

body.woocommerce.single-product .woocommerce-tabs ul.tabs{
  padding: 0 !important;
  margin: 0 0 12px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  border: 0 !important;
}

body.woocommerce.single-product .woocommerce-tabs ul.tabs li{
  border: 1px solid rgba(0,0,0,.08) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.70) !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.woocommerce.single-product .woocommerce-tabs ul.tabs li a{
  display: inline-block !important;
  padding: 10px 16px !important;
  font-weight: 900 !important;
  color: var(--ze-ink, #103532) !important;
}

body.woocommerce.single-product .woocommerce-tabs ul.tabs li.active{
  background: rgba(23,195,206,.12) !important;
  border-color: rgba(23,195,206,.35) !important;
}

body.woocommerce.single-product .woocommerce-tabs .panel{
  background: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(0,0,0,.06) !important;
  border-radius: 26px !important;
  padding: 16px !important;
  box-shadow: 0 18px 45px rgba(10,20,30,.08) !important;
}

/* --- Mobile stack --- */
@media (max-width: 919px){
  body.woocommerce.single-product div.product{ display: block !important; }
  body.woocommerce.single-product div.product .summary .product_title{ font-size: 26px !important; }
  body.woocommerce.single-product .woocommerce-product-gallery__wrapper{ border-radius: 22px !important; }
}

/* ==========================================================
   CHECKOUT — Order box TOP RIGHT (next to form)
   ========================================================== */

body.woocommerce-checkout .woocommerce{
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px 16px 44px;
}

body.woocommerce-checkout form.checkout.woocommerce-checkout{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 380px) !important;
  gap: 22px 26px !important;
  grid-template-areas: "details order" !important;
  align-items: start !important;
}

/* Remove floats */
body.woocommerce-checkout .col2-set,
body.woocommerce-checkout .col2-set .col-1,
body.woocommerce-checkout .col2-set .col-2,
body.woocommerce-checkout #customer_details,
body.woocommerce-checkout #order_review{
  float: none !important;
  width: auto !important;
}

body.woocommerce-checkout form.checkout.woocommerce-checkout #customer_details{
  grid-area: details !important;
  margin: 0 !important;
}

body.woocommerce-checkout form.checkout.woocommerce-checkout #order_review_heading{
  display: none !important;
}

body.woocommerce-checkout form.checkout.woocommerce-checkout #order_review{
  grid-area: order !important;
  margin: 0 !important;
  padding: 14px !important;
  clear: none !important;
  border-radius: 22px !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  background: rgba(255,255,255,.72) !important;
  box-shadow: 0 18px 45px rgba(10,20,30,.10) !important;
  align-self: start !important;
  position: sticky !important;
  top: 110px !important;
}

body.woocommerce-checkout #order_review::before{
  content: "Your order";
  display: block;
  font-weight: 900;
  margin: 2px 0 12px;
  color: var(--ze-ink, #103532);
}

body.woocommerce-checkout #order_review table{
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 0 !important;
}

body.woocommerce-checkout #order_review th,
body.woocommerce-checkout #order_review td{
  padding: 10px 8px !important;
  border: 0 !important;
  font-size: 14px !important;
}

body.woocommerce-checkout #order_review tr + tr td,
body.woocommerce-checkout #order_review tr + tr th{
  border-top: 1px solid rgba(0,0,0,.08) !important;
}

body.woocommerce-checkout #payment{
  background: transparent !important;
  border: 0 !important;
  margin-top: 12px !important;
}

body.woocommerce-checkout #payment .payment_box{
  border-radius: 16px !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  background: rgba(255,255,255,.62) !important;
  margin: 10px 0 0 !important;
}

body.woocommerce-checkout #place_order{
  width: 100% !important;
  border-radius: 18px !important;
  padding: 14px 16px !important;
  font-weight: 900 !important;
  border: 0 !important;
  background: linear-gradient(135deg, var(--ze-accent2, #7C4DFF), var(--ze-accent, #17C3CE)) !important;
  color: #fff !important;
  box-shadow: 0 14px 34px rgba(10,20,30,.14) !important;
}

/* Checkout fields */
body.woocommerce-checkout .woocommerce-billing-fields h3,
body.woocommerce-checkout .woocommerce-additional-fields h3{
  font-weight: 900;
  margin: 0 0 10px;
}

body.woocommerce-checkout form .form-row{ margin: 0 0 12px !important; }

body.woocommerce-checkout form .form-row label{
  font-weight: 800;
  font-size: 13px;
  margin-bottom: 6px;
}

body.woocommerce-checkout form input.input-text,
body.woocommerce-checkout form textarea,
body.woocommerce-checkout form select{
  width: 100% !important;
  border-radius: 16px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  background: rgba(255,255,255,.78) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}

body.woocommerce-checkout form textarea{
  min-height: 120px;
  resize: vertical;
}

@media (min-width: 980px){
  body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
  body.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper,
  body.woocommerce-checkout .woocommerce-additional-fields__field-wrapper{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 14px;
  }
  body.woocommerce-checkout .form-row-wide{ grid-column: 1 / -1; }
}

@media (max-width: 980px){
  body.woocommerce-checkout form.checkout.woocommerce-checkout{
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "details"
      "order" !important;
  }
  body.woocommerce-checkout form.checkout.woocommerce-checkout #order_review{
    position: static !important;
    top: auto !important; 
  }
}
/* =========================================================
   THANK YOU layout (force address top-right)
   ========================================================= */

@media (min-width: 980px){

  /* Main grid */
  .woocommerce .woocommerce-order{
    display: grid;
    grid-template-columns: 1.35fr .65fr;
    grid-template-areas:
      "received received"
      "overview customer"
      "details  details";
    gap: 22px;
    align-items: start;
  }

  /* Assign areas */
  .woocommerce .woocommerce-thankyou-order-received{
    grid-area: received;
    margin-bottom: 0;
  }

  .woocommerce ul.woocommerce-order-overview{
    grid-area: overview;
  }

  .woocommerce .woocommerce-customer-details{
    grid-area: customer;
    margin-top: 0;
    align-self: start;
  }

  .woocommerce .woocommerce-order-details{
    grid-area: details;
    margin-top: 0;
  }

  /* Make the overview cards “pack” nicer (removes that big empty space) */
  .woocommerce ul.woocommerce-order-overview{
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  }

  /* Optional: keep address visible while scrolling order details */
  .woocommerce .woocommerce-customer-details{
    position: sticky;
    top: 110px; /* adjust if your admin bar/header differs */
  }
}

/* ---- 90-overrides.css ---- */
/* 90-overrides.css — final polish overrides */

/* HERO: force media to behave like a true background */
.hero{
  position: relative;
  overflow: hidden;
}

.hero .hero-media{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

/* The legacy slider container in template-parts/hero.php should never affect layout */
.hero .hero-media--slider{
  display: none !important;
}

.hero .ze-hero-video,
.hero video{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* Poster fallback */
.hero .hero-poster{
  position: absolute !important;
  inset: 0 !important;
  background-size: cover !important;
  background-position: center !important;
}

/* New hero slider (background-image based) */
.hero .ze-hero-slider{
  position: absolute !important;
  inset: 0 !important; 
  width: 100% !important;
  height: 100% !important;
}
.hero .ze-hero-slide{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-size: cover !important;
  background-position: center !important;
}
/* Push bottom dividers DOWN so they overlap into the next section */
.ze-section{
  --ze-divider-bottom-shift: 22px; /* try 12px–40px */
}

/* (Optional) push top dividers UP a touch too */
.ze-section{
  --ze-divider-top-shift: 6px; /* try 0px–18px */
}

/* ===== HOME MAP / VENUE CARD ===== */

/* Card wrapper (one of these WILL match depending on your markup) */
.ze-map-card,
.ze-home-map-card,
.ze-map-panel,
.ze-map-box,
.ze-map-info-wrap{
  border-radius: 18px !important;
  background: rgba(255,255,255,.78) !important;
  border: 1px solid rgba(16,53,50,.10) !important;
  box-shadow: 0 12px 34px rgba(16,53,50,.10) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: 18px 18px 16px !important;
}

/* “VENUE” line (kicker) */
.ze-map-kicker,
.ze-map-label,
.ze-map-head{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  text-transform: uppercase !important;
  letter-spacing: .14em !important;
  font-weight: 900 !important;
  font-size: 12px !important;
  opacity: .72 !important;
  margin: 0 0 6px !important;
}

/* Title */
.ze-map-title,
.ze-map-card h3{
  margin: 0 0 12px !important;
  font-size: 28px !important;
  line-height: 1.1 !important;
  font-weight: 900 !important;
}

/* Pills/chips row */
.ze-map-chips,
.ze-map-badges,
.ze-map-tags{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin: 0 0 12px !important;
}

/* Individual pill (works whether they’re <a>, <span>, or <div>) */
.ze-map-chips > *,
.ze-map-badges > *,
.ze-map-tags > *{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  padding: 10px 14px !important;
  border-radius: 999px !important;
  background: rgba(16,53,50,.06) !important;
  border: 1px solid rgba(16,53,50,.12) !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

/* Teal dot inside pills (if your HTML includes a dot element) */
.ze-map-dot,
.ze-dot,
.ze-map-chips .dot,
.ze-map-badges .dot{
  width: 10px !important;
  height: 10px !important;
  border-radius: 999px !important;
  background: #22c7b8 !important;
  box-shadow: 0 0 0 4px rgba(34,199,184,.18) !important;
  flex: 0 0 auto !important;
}

/* Address text */
.ze-map-address,
.ze-map-info{
  margin: 0 !important;
  font-size: 15px !important;
  font-weight: 650 !important;
  opacity: .78 !important;
}

/* Tip line */
.ze-map-note{
  margin-top: 10px !important;
  font-size: 13px !important;
  opacity: .62 !important;
}
/* ===== HOME MAP / VENUE CARD (polish) ===== */

/* Remove any decorative dot/bullet on the VENUE kicker (your HTML has none) */
.ze-map-kicker::before,
.ze-map-kicker:before{
  content: none !important;
  display: none !important;
}

/* Kicker: clean + consistent */
.ze-map-kicker{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  text-transform: uppercase !important;
  letter-spacing: .16em !important;
  font-weight: 900 !important;
  font-size: 12px !important;
  opacity: .7 !important;
  margin: 0 0 8px !important;
}

/* Title */
.ze-map-title{
  margin: 0 0 12px !important;
  font-size: 30px !important;
  line-height: 1.1 !important;
  font-weight: 900 !important;
}

/* Turn the UL into “chips” like your screenshot */
.ze-map-points{
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 12px !important;

  display:flex !important;
  flex-wrap:wrap !important;
  gap: 10px !important;
}

.ze-map-points li{
  list-style: none !important;
  margin: 0 !important;

  display:inline-flex !important;
  align-items:center !important;
  gap: 10px !important;

  padding: 10px 14px !important;
  border-radius: 999px !important;
  background: rgba(16,53,50,.06) !important;
  border: 1px solid rgba(16,53,50,.12) !important;

  font-weight: 800 !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

/* Add a neat teal dot inside each chip (instead of messy list bullets) */
.ze-map-points li::before{
  content: "" !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 999px !important;
  background: #22c7b8 !important;
  box-shadow: 0 0 0 4px rgba(34,199,184,.16) !important;
  flex: 0 0 auto !important;
}

/* Address / info text */
.ze-map-text{
  margin: 0 !important;
  opacity: .82 !important;
}

.ze-map-text p{
  margin: 0 0 6px !important;
  font-size: 15px !important;
  font-weight: 650 !important;
}

.ze-map-text p:last-child{ margin-bottom: 0 !important; }

/* Buttons row */
.ze-map-actions{
  display:flex !important;
  flex-wrap:wrap !important;
  gap: 10px !important;
  margin-top: 12px !important;
}

/* Tip line: subtle divider */
.ze-map-note{
  margin-top: 12px !important;
  padding-top: 10px !important;
  border-top: 1px dashed rgba(16,53,50,.14) !important;
  font-size: 13px !important;
  opacity: .7 !important;
}
/* HERO: allow mobile image swap (works for slider + poster) */
.ze-hero-slide,
.hero-poster{
  background-image: var(--ze-hero-bg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

@media (max-width: 860px){
  .ze-hero-slide,
  .hero-poster{
    background-image: var(--ze-hero-bg-m, var(--ze-hero-bg));
  }
}
/* ===== HERO: force mobile slide images ===== */
@media (max-width: 860px){
  .ze-hero-slide{
    background-image: var(--ze-hero-m, var(--ze-hero-d)) !important;
  }
}
.ze-packages-banner__img{
  width:100%;
  height:auto;
  display:block;
  border-radius: 18px;
}

@media (max-width: 860px){
  .ze-packages-banner__img{
    height: 210px;      /* tweak: 180–260 */
    object-fit: cover;  /* makes it feel “hero-like” */
  }
}
/* FORCE packages banner to NEVER crop */
body .ze-packages-banner picture.ze-packages-banner__picture,
body .ze-packages-banner picture.ze-packages-banner__picture > img.ze-packages-banner__img{
  display:block !important;
  width:100% !important;
}

body .ze-packages-banner picture.ze-packages-banner__picture{
  /* if a fixed height exists elsewhere, this stops clipping */
  height:auto !important;
  overflow:visible !important;
}

body .ze-packages-banner img.ze-packages-banner__img{
  /* this is the important bit */
  object-fit:contain !important;
  object-position:center !important;

  /* if another rule is forcing a height, we neutralize it */
  height:auto !important;
  max-height:none !important;
}
/* Mobile: make variation dropdown text white */
@media (max-width: 860px){
  /* Common WooCommerce variation selects */
  .variations select,
  form.variations_form select,
  .woocommerce div.product form.cart .variations select{
    color: #fff !important;
  }

  /* Sometimes the options stay dark (browser dependent) */
  .variations select option,
  form.variations_form select option{
    color: #0b1b1c !important; /* keeps options readable in the dropdown list */
  }

  /* If the field background is dark, keep it consistent */
  .variations select,
  form.variations_form select{
    background-color: rgba(16,53,50,.92) !important;
    border-color: rgba(255,255,255,.22) !important;
  }
}
