/* =====================================================================
   Eufloria Gardens & Sculpture Park – site stylesheet
   Breakpoints: tablet <=1024px, mobile <=767px (same as the old site)
   ===================================================================== */

:root {
  --green: #24412F;
  --yellow: #FBC104;
  --ink: #0C261C;
  --teal: #9ACFD6;
  --font-head: "coinage-caps-kruger", Georgia, serif;
  --font-body: "Inter", Arial, sans-serif;
  --wrap: 1240px;
  --up: "/wp-content/uploads/";
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; overflow-x: hidden; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.7;
  color: var(--ink);
  background: #fff;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
p { margin: 0; }
ul { margin: 0; padding: 0; }

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  font-family: var(--font-head);
  font-weight: 500;
  line-height: 1.2;
  color: var(--green);
}
h1 { font-size: 45px; }
h2 { font-size: 39px; }
h3 { font-size: 32px; }
h4 { font-size: 25px; }
h5 { font-size: 18px; }
h6 { font-size: 15px; }

:focus:not(:focus-visible) { outline: none; }
:focus-visible { outline: 2px solid #D4AF37; outline-offset: 2px; }

.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; }
main { overflow-x: clip; }
.skip-link { position: absolute; left: -9999px; top: 0; z-index: 100000; background: #fff; padding: 8px 12px; }
.skip-link:focus { left: 8px; }
.deco { position: absolute; pointer-events: none; z-index: 0; }
.hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

.show-tablet { display: none; }
.hide-desktop { display: none; }

/* Image buttons (the site uses painted button artwork) */
.img-btn { display: inline-block; transition: opacity .2s; }
.img-btn:hover { opacity: .85; }
.img-btn img { width: 100%; }
.img-btn--100 { width: 100px; }
.img-btn--140 { width: 140px; }

/* ---------------------------------------------------------------------
   Header
   --------------------------------------------------------------------- */
.site-header { position: relative; z-index: 20; }
.hd-desktop { background: var(--green); padding: 0 35px; }
.hd-row1 { display: flex; justify-content: space-between; align-items: center; }
.hd-logo { display: block; width: 120px; padding: 12px 0; }
.hd-row2 {
  display: flex; justify-content: space-between; align-items: center;
  border-top: 2px solid #fff; padding-top: 12px; gap: 20px;
}
.hd-nav { margin-right: 30px; }
.hd-nav ul { list-style: none; display: flex; flex-wrap: wrap; }
.hd-nav a {
  display: flex; padding: 5px 60px 5px 0;
  font-size: 14px; font-weight: 500; line-height: 2em; color: #fff;
}
.hd-nav a:hover, .hd-nav a[aria-current] { color: #fff; opacity: .85; }

.btn-book {
  display: inline-block;
  -webkit-mask: url("/wp-content/uploads/2025/05/button.webp") center / contain no-repeat;
          mask: url("/wp-content/uploads/2025/05/button.webp") center / contain no-repeat;
}
.btn-book span {
  display: inline-flex; align-items: center;
  padding: 10px 32px 10px 38px;
  background: var(--yellow); color: #02311F;
  font-family: var(--font-head); font-size: 14px; font-weight: 500; line-height: 1.7;
  border-radius: 5em; box-shadow: 0 3px 6px rgba(0,0,0,.16);
}
.btn-book--sm span { font-size: 13px; padding: 13px 32px; }

.hd-mobile { display: none; }
.nav-trigger { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; width: 40px; height: 40px; }
.nav-trigger span { display: block; width: 24px; height: 2px; background: #fff; border-radius: 2px; }

/* Side drawer (tablet / mobile menu) */
.drawer { position: fixed; inset: 0; z-index: 10000; visibility: hidden; }
.drawer.is-open { visibility: visible; }
.drawer-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.4); opacity: 0; transition: opacity .3s; }
.drawer.is-open .drawer-backdrop { opacity: 1; }
.drawer-panel {
  position: absolute; top: 0; left: 0; bottom: 0; width: 350px; max-width: 85vw;
  background: var(--yellow); padding: 60px 20px 40px 20px; overflow-y: auto;
  transform: translateX(-100%); transition: transform .35s ease;
  display: flex; flex-direction: column; gap: 40px;
}
.drawer.is-open .drawer-panel { transform: none; }
.drawer-close { position: absolute; top: 10px; right: 16px; font-size: 34px; line-height: 1; color: var(--ink); }
.drawer-title { display: flex; align-items: center; gap: 12px; font-size: 16px; }
.drawer-title::after { content: ""; flex: 1; border-top: 1px solid rgba(12,38,28,.4); }
.drawer-nav { list-style: none; display: flex; flex-direction: column; gap: 6px; }
.drawer-nav a { display: block; padding: 8px 0; font-size: 16px; color: var(--ink); }

/* Torn strips */
.edge-top {
  position: relative; z-index: 9;
  height: 60px; margin: -5px 0 -30px;
  background: var(--green);
  -webkit-mask: url("/wp-content/uploads/2025/05/sketch-green-with-shadow2.webp") top center / cover;
          mask: url("/wp-content/uploads/2025/05/sketch-green-with-shadow2.webp") top center / cover;
}
.edge-top--50 { height: 50px; margin: -5px 0 -38px; z-index: 13; }
.edge-bottom {
  position: relative; z-index: 9;
  height: 50px; margin-top: -23px;
  background: var(--green);
  -webkit-mask: url("/wp-content/uploads/2026/04/Footer-Banner1.webp") bottom center / cover;
          mask: url("/wp-content/uploads/2026/04/Footer-Banner1.webp") bottom center / cover;
}
.shadow-edge {
  position: relative; z-index: 6; height: 50px; margin-bottom: -40px;
  background: url("/wp-content/uploads/2026/04/Web-Banner-shadow-2.webp") bottom center / cover no-repeat;
}

/* ---------------------------------------------------------------------
   Carousel (scroll-snap, enhanced by site.js)
   --------------------------------------------------------------------- */
.carousel { position: relative; --gutter: 10px; --n: var(--per, 3); }
.carousel-viewport { position: relative; overflow: hidden; touch-action: pan-y; cursor: grab; user-select: none; -webkit-user-select: none; }
.carousel-viewport.is-dragging { cursor: grabbing; }
.carousel-viewport.is-dragging * { pointer-events: none; }
.carousel-track {
  display: flex; flex-wrap: nowrap;
  margin: 0 calc(var(--gutter) / -2);
  will-change: transform;
}
.carousel-cell {
  flex: 0 0 calc(100% / var(--n));
  padding: 0 calc(var(--gutter) / 2);
  min-width: 0;
}
.carousel-cell img { -webkit-user-drag: none; user-select: none; }
/* faded sides (as on the live site) */
.carousel[data-fade] .carousel-viewport {
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 20%, #000 80%, transparent 100%);
          mask-image: linear-gradient(to right, transparent 0, #000 20%, #000 80%, transparent 100%);
}
.carousel-nav button {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
  width: 42px; height: 42px; border-radius: 50%;
  background: rgba(247,247,247,.48); color: #000;
  display: flex; align-items: center; justify-content: center;
  transition: background .25s, transform .25s, opacity .25s;
}
.carousel-nav button:hover { background: #fff; transform: translateY(-50%) scale(1.08); }
.carousel-nav button svg { width: 11px; height: 11px; fill: currentColor; }
.carousel-nav button[disabled] { opacity: .35; cursor: default; }
.carousel-nav .prev { left: 0; }
.carousel-nav .next { right: 0; }
.carousel-dots { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 16px; margin-top: 1.5em; padding: 0 20px; }
.carousel-dots button { width: 10px; height: 10px; border-radius: 5em; background: rgba(51,51,51,.25); transition: all .3s; }
.carousel-dots button.is-active { width: 20px; background: #333; }

/* ---------------------------------------------------------------------
   Modal
   --------------------------------------------------------------------- */
.modal { position: fixed; inset: 0; z-index: 9000; display: none; align-items: center; justify-content: center; padding: 20px; }
.modal.is-open { display: flex; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(11,22,22,.8); }
.modal-close {
  position: absolute; top: 30px; right: 30px; z-index: 5;
  width: 45px; height: 45px; border-radius: 50%;
  background: #fff; color: #000; font-size: 28px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
}
body.modal-open { overflow: hidden; }

/* ---------------------------------------------------------------------
   Homepage
   --------------------------------------------------------------------- */
.home-hero {
  position: relative; z-index: 1;
  display: flex; min-height: 80vh; padding: 30px 18px 0;
  background: url("/wp-content/uploads/2025/05/eufloria-background.webp") center / cover no-repeat fixed;
}
.deco-flowers-tr { top: 0; right: 0; width: 243px; }
.home-hero .deco-flowers-tr { top: -18px; z-index: 2; }
.deco-flowers-tl { top: 0; left: 0; width: 243px; transform: scaleX(-1); }
.home-hero-inner { display: flex; position: relative; z-index: 1; }
.home-hero-img { flex: 1 1 0; display: flex; justify-content: center; align-items: center; }
.home-hero-img img { padding: 0 10%; }
.home-hero-text { flex: 1 1 0; display: flex; justify-content: center; align-items: center; padding: 50px 0 30px; position: relative; z-index: 1; }
.home-hero-text-inner { display: flex; flex-direction: column; align-items: flex-end; gap: 20px; margin-left: -90px; }
.home-hero h1 { font-size: 76px; line-height: .7em; text-align: right; }
.home-hero h1 .h1-a { font-size: 55px; margin-right: 20px; }
.home-hero h1 .h1-c { font-size: 49px; }
.home-hero p { max-width: 440px; text-align: right; }
.home-hero p .accent { font-family: var(--font-head); font-size: 21px; font-weight: 500; color: var(--green); }

.home-about {
  position: relative; z-index: 5; margin-bottom: -60px;
  padding: 30px 18px 90px;
  background: url("/wp-content/uploads/2026/04/Seasonal-Promo-Slider-Banner.webp") bottom center / cover no-repeat;
  box-shadow: 0 -5px 5px rgba(0,0,0,.12);
}
.home-about-row { display: flex; gap: 20px; }
.home-about-text { flex: 1 1 100%; display: flex; flex-direction: column; justify-content: center; gap: 20px; }
.home-about-visual { flex: 1 1 60%; display: flex; flex-direction: column; justify-content: center; }
.home-about-visual img { width: 120%; max-width: 120%; }
.home-ttd { margin-top: 20px; display: flex; flex-direction: column; gap: 20px; }
.home-ttd > h3 { text-align: center; }
.carousel--home-ttd { margin-right: -9%; }
.ttd-card {
  min-height: 300px; padding: 20px 25px 25px;
  display: flex; flex-direction: column; gap: 10px;
  background: url("/wp-content/uploads/2025/05/white-background-1.webp") center / 100% 100% no-repeat;
}
.ttd-card-img img, .attr-card-img img {
  -webkit-mask: url("/wp-content/uploads/2025/05/ANOTHERSHAPE-1.webp") center left / contain no-repeat;
          mask: url("/wp-content/uploads/2025/05/ANOTHERSHAPE-1.webp") center left / contain no-repeat;
}
.ttd-card .img-btn { align-self: flex-start; }
.home-ttd-all { align-self: center; margin-top: 20px; }

/* Attraction popup on homepage */
.attr-modal {
  position: relative; z-index: 1;
  width: 800px; max-width: 100%; min-height: 256px; overflow: hidden;
  padding: 50px 20px;
  display: flex; flex-direction: column; gap: 20px;
  background: url("/wp-content/uploads/2025/05/Union-6-1.webp") center / 100% 100% no-repeat;
}
.carousel--modal-m { width: 80%; align-self: center; }
.carousel--modal { margin: 0 -20px; }
.attr-modal-text { width: 90%; align-self: flex-start; padding: 20px 30px 10px; }
.attr-modal-text p { margin-top: 0; }
.attr-modal-text .img-btn { margin-top: 20px; }

.home-iconic {
  position: relative; z-index: 4; margin-bottom: -70px;
  padding: 60px 0 70px;
  background: url("/wp-content/uploads/2026/04/iconic-structure-banner.webp") bottom center / cover no-repeat;
}
.home-iconic h2 { color: #fff; text-align: center; max-width: 533px; margin: 0 auto 20px; position: relative; z-index: 1; }
.iconic-row { display: flex; gap: 40px; padding: 10px; position: relative; z-index: 1; }
.iconic-col { flex: 1 1 0; display: flex; flex-direction: column; }
.iconic-col--down { margin-top: 31px; }
.iconic-label { padding: 10px; background-repeat: no-repeat; background-size: 100% 100%; display: flex; justify-content: center; }
.iconic-label h3 { max-width: 165px; text-align: center; color: #fff; font-size: 23px; }

.home-gallery {
  position: relative; z-index: 3; margin-bottom: -90px;
  padding: 80px 0;
  background: url("/wp-content/uploads/2026/04/Gallery-Banner.webp") bottom center / cover no-repeat;
}
.home-gallery > .wrap { display: flex; flex-direction: column; }
.home-gallery h2 { text-align: center; padding-bottom: 30px; }
.gal-open { display: block; width: 100%; }
.home-gallery-more { align-self: center; margin-top: 20px; }
.home-where { display: flex; flex-direction: column; justify-content: flex-end; min-height: 760px; padding: 0 10%; }
.home-where img { width: 533px; }

.gallery-modal-box { position: relative; z-index: 1; width: 100%; max-width: 600px; }
.gallery-modal-box .modal-close { position: fixed; }
.carousel--single .carousel-track { align-items: center; }
.carousel--single .carousel-cell { display: flex; justify-content: center; }
.carousel--single .carousel-cell { padding: 6px; }
/* Torn white paper frame around each photo + torn-edge mask (same as the attraction cards / popups) */
.gal-frame {
  display: inline-block; max-width: 100%; padding: 16px 16px 20px;
  background: url("/wp-content/uploads/2026/04/white-background-5.webp") center / 100% 100% no-repeat;
  filter: drop-shadow(0 10px 24px rgba(0,0,0,.25));
}
.carousel--single .gal-frame img {
  display: block; width: auto; max-width: 100%; height: auto; max-height: 74vh;
  -webkit-mask: url("/wp-content/uploads/2025/05/ANOTHERSHAPE-1.webp") center / 100% 100% no-repeat;
          mask: url("/wp-content/uploads/2025/05/ANOTHERSHAPE-1.webp") center / 100% 100% no-repeat;
}
@media (max-width: 767px) { .gal-frame { padding: 10px 10px 13px; } }

.home-explore {
  position: relative; z-index: 2; margin-bottom: -80px;
  padding: 120px 18px 80px;
  background: url("/wp-content/uploads/2026/04/Fun-Education-Banner.webp") bottom center / cover no-repeat;
}
.home-explore-row { display: flex; gap: 50px; }
.home-explore-img, .home-explore-text { flex: 1 1 0; display: flex; flex-direction: column; gap: 20px; }
.home-explore-text { justify-content: center; }
.home-explore h2, .home-explore h3 { color: #fff; }
.home-explore h2 { max-width: 352px; }
.home-explore p { color: #fff; font-size: 20px; }

/* Promo popup */
.modal--promo .modal-backdrop { background: rgba(0,0,0,.8); }
.promo-box { position: relative; z-index: 1; width: 640px; max-width: 100%; }
.promo-close { position: absolute; top: 15px; right: 15px; z-index: 2; color: #fff; font-size: 30px; line-height: 1; }

/* ---------------------------------------------------------------------
   Subscribe block (shared)
   --------------------------------------------------------------------- */
.subscribe {
  position: relative; z-index: 1; overflow: hidden;
  display: flex; flex-direction: column; align-items: center; gap: 20px;
  padding: var(--pad-top, 80px) 18px 80px;
  background: url("/wp-content/uploads/2025/05/vector.webp") center / cover no-repeat fixed;
  box-shadow: inset 0 19px 23px -5px rgba(0,0,0,.25);
}
.subscribe-box {
  display: flex; width: 1100px; max-width: 100%; margin-bottom: 30px; position: relative; z-index: 1;
  background: url("/wp-content/uploads/2025/05/contact.webp") center / 100% 100% no-repeat;
}
.subscribe-col { flex: 1 1 0; display: flex; flex-direction: column; justify-content: center; align-self: center; }
.subscribe-form-col { padding: 4%; gap: 10px; }
.subscribe-img-col { align-items: center; padding: 10px; }
.connect-title { color: #fff; text-align: center; position: relative; z-index: 1; }
.social { list-style: none; display: flex; justify-content: center; gap: 25px; position: relative; z-index: 1; }
.social a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 41px; height: 41px; border-radius: 50%; background: #fff;
}
.social svg { width: 23px; height: 23px; fill: var(--green); }
.deco-flowers-bl { left: 0; bottom: -20px; width: 243px; }

/* Underlined form (subscribe) */
.form-underlined label { display: block; font-size: 16px; color: var(--ink); margin-bottom: 5px; }
.form-underlined input[type=text], .form-underlined input[type=email] {
  display: block; width: 100%; height: 50px; padding: 1px 0;
  border: 0; border-bottom: 2px solid #D5D6DE; background: transparent;
  font: inherit; color: var(--ink); border-radius: 0;
}
.form-underlined input::placeholder { color: #B7B9C4; }
.form-underlined input:focus { outline: none; border-bottom-color: var(--green); }
.fu-row { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.fu-half { flex: 0 0 50%; padding: 0 15px; margin-bottom: 10px !important; }
.fu-full { flex: 0 0 100%; padding: 0 15px; margin-bottom: 10px !important; }
.fu-submit { display: flex; justify-content: center; }
.fu-submit button {
  height: 40px; padding: 0 44.8px;
  background: var(--teal); border: 2px solid var(--teal); color: #fff;
  font-family: var(--font-head); font-size: 16px;
}
.fu-submit button:hover { opacity: .9; }

.form-msg { font-size: 14px; margin-top: 8px; min-height: 1em; }
.form-msg.is-ok { color: #1d7a3a; }
.form-msg.is-err { color: #c0392b; }
.js-form.is-busy button[type=submit] { opacity: .6; pointer-events: none; }

/* ---------------------------------------------------------------------
   Footer
   --------------------------------------------------------------------- */
.site-footer { background: var(--green); padding: 20px 18px; color: #fff; padding-bottom: 80px; }
.ft-row { display: flex; gap: 20px; }
.ft-row1 { justify-content: space-between; align-items: center; border-bottom: 2px solid #000; padding-bottom: 20px; }
.ft-logo { width: 136px; }
.ft-row2 { border-bottom: 2px solid #000; padding: 20px 0; }
.ft-menu { list-style: none; flex: 0 0 10%; }
.ft-menu li + li { margin-top: 10px; }
.ft-menu a { color: #fff; }
.ft-news { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.ft-news-form { display: flex; align-items: center; gap: 10px; width: 465px; max-width: 100%; flex-wrap: wrap; }
.ft-news-form input[type=email] {
  flex: 1; min-width: 0; height: 50px; padding: 0 28px; border: 0;
  font: inherit; color: var(--ink);
  background: url("/wp-content/uploads/2025/05/Collumn-white.webp") center / cover no-repeat;
}
.ft-news-form button {
  flex-shrink: 0; width: 142px; height: 50px;
  color: var(--green); font-family: var(--font-body);
  background: url("/wp-content/uploads/2025/05/Collumn-yellow.webp") center / cover no-repeat;
}
.ft-news-form .form-msg { flex: 0 0 100%; color: #fff; margin-top: 0; }
.ft-news-form .form-msg.is-err { color: #ffb4a8; }
.ft-row3 { justify-content: space-between; align-items: center; padding-top: 20px; }
.ft-row3 p { font-size: 14px; }

/* Operation hours bar + panel */
.hours-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 900; background: #fff; }
.hours-bar-btn { width: 100%; display: flex; justify-content: center; align-items: center; gap: 20px; padding: 12px 0; }
.hours-bar-title { font-family: var(--font-head); font-size: 24px; font-weight: 500; line-height: 1.2; color: var(--green); }
.hours-bar-btn img { width: 119px; }
.modal--hours { align-items: flex-end; padding: 0; }
.modal--hours .modal-backdrop { background: rgba(0,0,0,.4); }
.hours-panel {
  position: relative; z-index: 1; width: 100%;
  display: flex; justify-content: center; gap: 60px;
  padding: 25px 150px 20px; background: #fff;
}
.hours-close { position: absolute; right: 20px; top: -50px; font-size: 40px; line-height: 1; color: #000; background: #fff; width: 44px; height: 44px; border-radius: 50%; }
.hours-col { display: flex; flex-direction: column; gap: 20px; }
.hours-col:first-of-type { flex: 0 0 42%; }
.hours-col--right { flex: 1; border-left: 1px solid #D5D5D5; padding-left: 60px; }
.hours-col h3 { font-size: 24px; }
.hours-time span { font-family: var(--font-body); font-weight: 400; }
.hours-col h4 { font-size: 17px; margin-bottom: -20px; }
.hours-text { font-family: "Lato", sans-serif; font-size: 18px; color: var(--green); }
.hours-text a { color: #0000EE; }
.hours-terms { font-size: 13px; font-style: italic; font-weight: 300; }

.to-top {
  position: fixed; right: 0; bottom: 30px; z-index: 9999;
  opacity: 0; visibility: hidden; transition: opacity .3s;
}
.to-top.is-visible { opacity: 1; visibility: visible; }
.to-top img { width: 60px; height: 60px; }

/* ---------------------------------------------------------------------
   Attraction pages
   --------------------------------------------------------------------- */
.attr-hero {
  position: relative; z-index: 12;
  display: flex; min-height: 85vh; padding: 30px 18px 0;
  background-position: center; background-size: cover; background-repeat: no-repeat;
}
.attr-hero-inner { display: flex; flex-direction: column; justify-content: flex-end; padding: 50px 0; }
.attr-hero h1 { color: #fff; font-size: 63px; max-width: 693px; }
.attr-body {
  position: relative; z-index: 11; margin-bottom: -2px;
  padding: 50px 18px 90px;
  background: url("/wp-content/uploads/2026/01/textures-1.webp") bottom center / cover no-repeat;
  box-shadow: 0 -5px 5px 12px rgba(154,154,154,.46);
}
.attr-body-inner { display: flex; flex-direction: column; gap: 62px; }
.attr-feature, .attr-others { display: flex; flex-direction: column; gap: 10px; }
.attr-gallery { display: flex; flex-direction: column; gap: 20px; }
.carousel--gallery .carousel-cell img { width: 100%; height: 300px; object-fit: cover; }
.attr-others .carousel { margin-top: 24px; }
.attr-card {
  min-height: 460px; padding: 12px 20px 0;
  display: flex; flex-direction: column; gap: 10px;
  background: url("/wp-content/uploads/2026/04/white-background-5.webp") center / 100% 100% no-repeat;
}
.attr-card-img { margin: -11px; }
.attr-card h5 { font-family: var(--font-body); font-weight: 700; margin-top: 10px; }

/* ---------------------------------------------------------------------
   Things To Do page
   --------------------------------------------------------------------- */
.ttd-hero {
  position: relative; z-index: 2; margin-bottom: -40px;
  min-height: 640px; padding: 80px 18px 50px;
  background: url("/wp-content/uploads/2026/04/things-to-do-banner.webp") bottom center / cover no-repeat;
}
.ttd-hero .wrap { display: flex; flex-direction: column; align-items: center; gap: 20px; text-align: center; }
.ttd-hero h1 { font-size: 63px; max-width: 693px; }
.ttd-specific {
  position: relative; z-index: 1; margin-bottom: -60px;
  min-height: 640px; padding: 80px 18px 120px;
  background: url("/wp-content/uploads/2026/04/Seasonal-Promo-Slider-Banner.webp") bottom center / cover no-repeat;
}
.ttd-specific-title { font-size: 63px; text-align: center; margin-bottom: 50px; }
.ttd-cats { display: flex; justify-content: center; gap: 40px; }
.ttd-cat { width: 300px; display: flex; flex-direction: column; align-items: center; gap: 20px; }
.ttd-cat-box {
  width: 300px; height: 300px;
  display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 10px;
  background: url("/wp-content/uploads/2026/04/white-square-bg.webp") center / 100% 100% no-repeat;
}
.ttd-cat-icon {
  width: 170px; height: 170px; padding: 30px; border-radius: 50%;
  background: var(--green); display: flex; align-items: center; justify-content: center;
}
.ttd-cat-icon svg { width: 110px; height: 110px; fill: #fff; }
.ttd-cat-box p { font-size: 24px; font-weight: 600; text-align: center; }
.btn-yellow {
  display: inline-flex; align-items: center; height: 60px; padding: 17px 31.5px;
  background: url("/wp-content/uploads/2025/05/BUTTON-YELLOW-1.webp") center / contain no-repeat;
  color: #fff; font-family: var(--font-head); font-size: 15px;
}

.outlets-box {
  position: relative; z-index: 1;
  width: 950px; max-width: 100%; min-height: 480px; margin-left: 90px;
  padding: 20px 0; display: flex; flex-direction: column; justify-content: center; align-items: center;
  background: url("/wp-content/uploads/2026/04/white-pop-up-bg.webp") center / 100% 100% no-repeat;
}
.carousel--outlets { width: 900px; max-width: 100%; margin-left: 25px; }
.outlet-card {
  min-height: 400px; padding: 20px 25px 25px;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  background: url("/wp-content/uploads/2026/04/white-rectangle-shadow.webp") center / 100% 100% no-repeat;
}
.outlet-img { width: 100%; display: flex; justify-content: center; }
.outlet-img img { max-width: 70%; }
.outlet-text { width: 80%; display: flex; flex-direction: column; gap: 10px; }
.outlet-text h5 { font-family: var(--font-body); font-weight: 700; color: #000; margin-bottom: -10px; }
.outlet-text strong { font-weight: 500; }

.ttd-list {
  position: relative; z-index: 1; margin-bottom: -2px;
  padding: 100px 18px 90px;
  background: url("/wp-content/uploads/2026/01/BG-1.webp") top center / cover no-repeat;
}
.ttd-list .wrap { display: flex; flex-direction: column; gap: 41px; position: relative; z-index: 1; }
.ttd-row { display: flex; border-bottom: 3px solid #fff; padding-bottom: 40px; }
.ttd-row-img, .ttd-row-text { flex: 1 1 0; display: flex; flex-direction: column; justify-content: center; }
.ttd-row-img img { width: 100%; }
.ttd-row-text { padding-left: 40px; gap: 20px; }
.ttd-row--text-first { flex-direction: row-reverse; }
.ttd-row--text-first .ttd-row-text { padding-left: 0; padding-right: 40px; }
.ttd-row-text h2, .ttd-row-text p { color: #fff; }
.ttd-row-text p { max-width: 698px; }
.ttd-row-text .img-btn { margin-top: 20px; align-self: flex-start; }
.deco-ttd-1 { top: -21px; right: 0; width: 233px; }
.deco-ttd-2 { top: 445px; right: -155px; width: 552px; transform: rotate(150deg); }
.deco-ttd-3 { bottom: 44%; left: -124px; width: 552px; transform: rotate(-139deg) scaleX(-1); }
.deco-ttd-4 { bottom: 505px; right: -155px; width: 552px; transform: rotate(150deg); }

/* ---------------------------------------------------------------------
   Inner pages: gallery / plant profile / plants / flower story
   --------------------------------------------------------------------- */
.pg-top {
  position: relative; z-index: 1; margin-bottom: -40px;
  padding: 90px 18px;
  background: url("/wp-content/uploads/2026/04/Gallery-Bg-Top.webp") bottom center / cover no-repeat;
}
.pg-top > .wrap { display: flex; flex-direction: column; gap: 20px; }
.pg-center { align-items: center; }
.pg-title { text-align: center; font-size: 45px; }
.gallery-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px 22px; margin-top: 20px; }
/* Photo card: torn white paper frame + torn-edge photo mask (same treatment as the attraction cards) */
.gal-card {
  display: block; width: 100%; padding: 12px 12px 16px;
  background: url("/wp-content/uploads/2026/04/white-background-5.webp") center / 100% 100% no-repeat;
  transition: transform .45s cubic-bezier(.22,1,.36,1), filter .45s;
}
.gal-card-img { display: block; overflow: hidden; }
.gal-card-img img {
  width: 100%; aspect-ratio: 4 / 3; object-fit: cover;
  -webkit-mask: url("/wp-content/uploads/2025/05/ANOTHERSHAPE-1.webp") center / 100% 100% no-repeat;
          mask: url("/wp-content/uploads/2025/05/ANOTHERSHAPE-1.webp") center / 100% 100% no-repeat;
  transition: transform .8s cubic-bezier(.22,1,.36,1);
}
.gal-card:hover { transform: translateY(-6px) rotate(-.6deg); filter: drop-shadow(0 12px 14px rgba(0,0,0,.14)); }
.gal-card:hover .gal-card-img img { transform: scale(1.06); }
.carousel--home-gallery .gal-card { margin: 8px 0 14px; }

.pg-brochure {
  position: relative; z-index: 1; margin-bottom: -40px;
  min-height: 200vh; padding: 60px 18px 390px;
  background: url("/wp-content/uploads/2026/04/Gallery-Bg-Bottom.webp") bottom center / cover no-repeat;
}
.pg-brochure .wrap { display: flex; flex-direction: column; align-items: center; gap: 20px; position: relative; z-index: 3; }
.brochure-img { margin-top: 20px; }
.brochure-img img { width: 780px; }
.brochure-dl { width: 330px; margin-top: 20px; }

.plant-block { display: flex; flex-direction: column; gap: 20px; margin-bottom: 75px; }
.plant-card { position: relative; cursor: grab; }
.plant-card img { width: 100%; }
/* Only the expand icon and the "View More" button open the popup (same hotspots as the live site) */
.plant-hs { position: absolute; z-index: 5; cursor: pointer; background: transparent; border-radius: 6px; }
.plant-hs--icon { top: 54%; left: 82%; width: 12%; height: 9%; border-radius: 50%; }
.plant-hs--btn { top: 85%; left: 7%; width: 38%; height: 9%; }
.plant-hs:focus-visible { outline: 2px solid var(--green); }
.plant-single { width: 100%; max-width: 800px; }
.plant-single img { width: 100%; }
.btn-explore {
  display: inline-block; margin: 10px; padding: 10px 20px;
  background: var(--yellow); color: #02311F; border-radius: 5em;
  font-family: var(--font-head); font-size: 14px; font-weight: 500; box-shadow: 0 3px 6px rgba(0,0,0,.16);
}
.story-img { display: flex; justify-content: center; }

/* Image lightbox (plant profile) */
.lightbox { position: fixed; inset: 0; z-index: 99999; display: none; align-items: center; justify-content: center; padding: 20px; background: rgba(0,0,0,.85); }
.lightbox.is-open { display: flex; }
.lightbox img { max-width: 100%; max-height: 90vh; width: auto; object-fit: contain; border-radius: 4px; box-shadow: 0 0 40px rgba(0,0,0,.5); cursor: grab; user-select: none; -webkit-user-drag: none; }
.lightbox-close { position: absolute; top: 20px; right: 35px; color: #fff; font-size: 50px; font-weight: 700; line-height: 1; }
.lightbox-prev, .lightbox-next { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; color: #fff; font-size: 50px; line-height: 1; padding: 10px; user-select: none; }
.lightbox-prev { left: 25px; }
.lightbox-next { right: 25px; }
.lightbox-close { z-index: 2; }
@media (max-width: 767px) { .lightbox-prev, .lightbox-next { top: 70%; } }

/* Poster pages (orchids) */
.poster { background: #f7f5d8; display: flex; justify-content: center; }
.poster img { width: 100%; }

/* Text pages */
.text-page { padding: 60px 18px 100px; }
.text-page h2 { margin-bottom: 20px; }
.text-page p { margin-bottom: 1.2em; }

/* ---------------------------------------------------------------------
   Where We Are / Contact
   --------------------------------------------------------------------- */
.pg-contact-top {
  position: relative; z-index: 1; margin-bottom: -25px;
  padding: 90px 18px;
  background: url("/wp-content/uploads/2026/04/Contact-Bg.webp") bottom center / cover no-repeat;
}
.pg-contact-top > .wrap { display: flex; flex-direction: column; gap: 20px; }
.pg-lead { max-width: 822px; }
.sketch-box { background: url("/wp-content/uploads/2025/05/pop-sketch-1.webp") center / 100% 100% no-repeat; }

.where-row { display: flex; gap: 40px; margin-top: 20px; }
.where-map { flex: 1 1 auto; padding: 20px; }
.where-map iframe { display: block; width: 100%; height: 600px; border: 0; border-radius: 20px; }
.where-cards { flex: 0 0 610px; display: flex; flex-direction: column; gap: 20px; }
.where-card { display: flex; gap: 40px; min-height: 100px; padding: 10px 20px 10px 30px; background-size: 100% 100%; background-repeat: no-repeat; }
.where-card--bus { min-height: 347px; padding: 20px 30px; }
.where-card-icon { flex: 0 0 17%; align-self: center; }
.where-card-text { flex: 1; display: flex; flex-direction: column; justify-content: center; font-size: 12px; }
.where-card-text h2 { font-size: 20px; }
.where-card-text p { font-size: 12px; margin-bottom: 10px; }
.where-card-text ul { padding-left: 18px; }
.where-card-text li { margin-bottom: 7px; }
.where-stops { display: flex; }
.where-stops ul { flex: 1; }
.where-note { margin-top: 5px; }

.contact-box { display: flex; gap: 70px; padding: 40px; margin-top: 20px; }
.contact-form-col { flex: 1 1 0; display: flex; flex-direction: column; justify-content: center; gap: 20px; }
.contact-form-col h3 { max-width: 399px; }
.contact-img-col { flex: 1 1 0; display: flex; align-items: center; }
.contact-img-col img { max-width: 558px; width: 100%; }

.form-boxed .fb-grid { display: flex; flex-wrap: wrap; gap: 0 2%; }
.form-boxed label { display: block; font-size: 15px; line-height: 1.7; color: #344054; margin-bottom: 20px; }
.form-boxed .fb-half { flex: 0 0 49%; }
.form-boxed .fb-full { flex: 0 0 100%; }
.form-boxed .req { color: #B94A48; }
.form-boxed input, .form-boxed textarea {
  display: block; width: 100%; margin-top: 5px; padding: 8px 12px;
  font: 14px/1.3 var(--font-body); color: #1D2939; background: #fff;
  border: 1px solid #D0D5DD; border-radius: 8px;
}
.form-boxed textarea { line-height: 1.7; resize: vertical; }
.form-boxed input:focus, .form-boxed textarea:focus { outline: none; border-color: var(--green); }
.fb-submit {
  width: 50%; height: 46px; margin: 10px 0;
  background: var(--teal); border: 1px solid var(--teal); color: #02311F;
  font-family: var(--font-head); font-size: 14px; box-shadow: 0 1px 1px #eee;
}

.contact-cards { display: flex; gap: 40px; margin-top: 20px; }
.contact-card {
  flex: 0 0 390px; min-height: 250px; padding: 30px 10px 40px;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  background: url("/wp-content/uploads/2026/01/Group-4.webp") center / 100% 100% no-repeat;
}
.contact-icon {
  width: 75px; height: 75px; border-radius: 50%; margin-bottom: 24px;
  background: var(--green); display: flex; align-items: center; justify-content: center;
}
.contact-icon svg { width: 42px; height: 42px; fill: #fff; }
.contact-icon--img img { width: 40px; }
.contact-card h3 { font-size: 24px; line-height: 1; margin-bottom: 16.8px; }
.contact-card p { font-size: 20px; max-width: 299px; }
.contact-card p.contact-card-sm { font-size: 16px; line-height: 1.4; }

/* =====================================================================
   Tablet  (<= 1024px)
   ===================================================================== */
@media (max-width: 1024px) {
  .gallery-grid { grid-template-columns: repeat(3, 1fr); }
  .hd-desktop { display: none; }
  .hd-mobile {
    display: flex; justify-content: space-between; align-items: center;
    background: var(--green); padding: 0 35px;
  }
  .hd-mobile-left { display: flex; align-items: center; gap: 10px; }

  .show-tablet { display: block; }
  .hide-tablet { display: none; }
  .hide-desktop { display: block; }
  .show-desktop { display: none; }

  .home-hero { min-height: 40vh; background-attachment: scroll; }
  .home-hero-img { flex-basis: 80%; }
  .home-hero-img img { padding: 0; }
  .home-hero-text-inner { margin-left: -30px; }
  .home-hero h1 { font-size: 58px; }
  .home-hero h1 .h1-a { font-size: 42px; }
  .home-hero h1 .h1-b { font-size: 52px; }
  .home-hero h1 .h1-c { font-size: 39px; }
  .home-hero p { max-width: 1000px; }
  .home-hero p .accent { font-size: 18px; }
  .deco-flowers-tr, .deco-flowers-tl { width: 196px; }

  .home-about-row { flex-direction: column; }
  .home-about-visual { order: -1; }
  .home-about-visual h2 { text-align: center; }
  .home-about-visual img { margin: -50px; max-width: calc(100% + 100px); }
  .ttd-card { background-image: url("/wp-content/uploads/2026/01/white-background-4.webp"); padding: 15px 25px 25px; }

  .home-iconic { padding: 50px 18px; }
  .iconic-label h3 { font-size: 16px; max-width: 113px; }
  .home-gallery { background-position: 68% 0%; }
  .home-where { min-height: 358px; }
  .home-where img { width: 316px; }
  .home-explore-row { flex-direction: column; }
  .home-explore h3 { text-align: center; }

  .hours-panel { padding: 40px; }

  .attr-hero { min-height: 335px; }
  .attr-hero h1 { font-size: 50px; }
  .attr-body h3 { font-size: 33px; }
  .attr-card { min-height: 450px; padding: 10px 20px 0; background-image: url("/wp-content/uploads/2026/04/white-background-tablet.webp"); }
  .attr-card-img { margin: 0 -8px -8px; }

  .ttd-hero { min-height: 580px; }
  .ttd-hero h1, .ttd-specific-title { font-size: 45px; }
  .ttd-specific { min-height: 580px; }
  .ttd-cat, .ttd-cat-box { width: 190px; }
  .ttd-cat-box { height: 190px; }
  .ttd-cat-icon { width: 129px; height: 129px; padding: 22px; }
  .ttd-cat-icon svg { width: 85px; height: 85px; }
  .ttd-cat-box p { font-size: 16px; }
  .outlets-box { width: 800px; min-height: 560px; margin-left: 0; }
  .carousel--outlets { max-width: 750px; margin-left: 0; }
  .outlet-card { min-height: 380px; padding: 15px 25px 25px; }
  .deco-ttd-2 { width: 335px; top: 331px; }
  .deco-ttd-3 { width: 263px; bottom: 50.2%; }
  .deco-ttd-4 { width: 335px; bottom: 520px; }

  .pg-top { min-height: 427px; }
  .pg-brochure { min-height: 427px; padding: 60px 18px 90px; }
  .pg-contact-top h1 { font-size: 45px; }
  .where-row { gap: 20px; }
  .where-cards { flex-basis: 50%; }
  .where-card { gap: 20px; padding: 10px 15px; }
  .contact-cards { gap: 10px; }
  .contact-card { flex: 0 0 240px; min-height: 175px; padding: 20px 10px 0; }
  .contact-icon { width: 50px; height: 50px; margin-bottom: 0; }
  .contact-icon svg { width: 26px; height: 26px; }
  .contact-icon--img img { width: 26px; }
  .contact-card h3 { font-size: 20px; margin: 10px 0; }
  .contact-card p { font-size: 15px; }
  .contact-card p.contact-card-sm { font-size: 12px; line-height: 1.2; }
  

  .subscribe, .home-hero { background-attachment: scroll; }
}

/* =====================================================================
   Mobile  (<= 767px)
   ===================================================================== */
@media (max-width: 767px) {
  body { font-size: 14px; line-height: 1.4; }
  h1 { font-size: 30px; }

  .hd-mobile { padding: 0 9px 0 15px; }
  .hd-mobile .hd-logo { width: 100px; padding: 0; }
  .btn-book--sm span { padding: 8px 20px 8px 25px; }
  .drawer-panel { width: 250px; }

  .edge-top { margin-top: -25px; }

  .home-hero { padding: 30px 18px 80px; }
  .home-hero-inner { flex-wrap: wrap; justify-content: center; }
  .home-hero-text { order: -1; flex-basis: 100%; }
  .home-hero-img { flex-basis: 100%; }
  .home-hero-text-inner { margin-left: 0; align-items: center; }
  .home-hero h1 { font-size: 45px; text-align: center; line-height: 1; }
  .home-hero h1 .h1-a { font-size: 35px; }
  .home-hero h1 .h1-b { font-size: 45px; }
  .home-hero h1 .h1-c { font-size: 30px; }
  .home-hero p { text-align: center; }
  .home-hero p .accent { font-size: 14px; }
  .deco-flowers-tr, .deco-flowers-tl { width: 129px; }

  .home-about { background-image: url("/wp-content/uploads/2025/05/Seasonal-Promo-1.webp"); background-position: top center; }
  .home-about h2 { font-size: 30px; }
  .home-about-text { text-align: center; align-items: center; }
  .home-about-visual img { margin: 0; max-width: 100%; }
  .home-ttd { margin: 30px -30px 0 0; }
  .home-ttd > h3 { font-size: 30px; }
  .carousel--home-ttd { margin: 0 -25px; }
  .ttd-card { min-height: 200px; gap: 0; padding: 25px 15px 15px; background-image: url("/wp-content/uploads/2025/05/white-background-1.webp"); }
  .ttd-card h5 { font-size: 12px; padding-bottom: 4px; }
  .ttd-card .img-btn--100 { width: 60px; }

  .attr-modal { width: 90%; background-size: cover; }
  .attr-modal .carousel--modal-m { width: 100%; padding: 0 20px; }
  .attr-modal-text { padding: 0 20px 10px; text-align: center; align-self: center; }
  .attr-modal-text .img-btn { margin-left: auto; margin-right: auto; }

  .home-iconic h2 { font-size: 30px; }
  .iconic-row { flex-wrap: wrap; gap: 25px; justify-content: center; }
  .iconic-col { flex: 0 0 45%; }
  .iconic-label { background-position: center; }
  .iconic-label h3 { font-size: 14px; max-width: 87px; margin-top: -7px; }

  .home-gallery { background-image: url("/wp-content/uploads/2025/05/the-Deals-Treasured-Memories-1.webp"); background-position: center; }
  .home-gallery h2 { font-size: 30px; padding-bottom: 10px; }
  .home-where { min-height: 216px; justify-content: flex-start; }
  .home-where img { width: 187px; margin-top: 60px; }
  .home-explore h3 { font-size: 30px; }
  .home-explore p { font-size: 14px; text-align: center; }
  .gallery-modal-box { width: 100%; }

  .subscribe-box { flex-direction: column; padding: 20px; background-image: url("/wp-content/uploads/2025/05/Union-mobile.webp"); }
  .subscribe-img-col { order: -1; }
  .subscribe-form-col h3 { font-size: 20px; }
  .connect-title { font-size: 30px; }
  .deco-flowers-bl { width: 124px; }
  .fu-half, .fu-full { margin-bottom: 5px !important; }

  .site-footer { padding-bottom: 70px; }
  .ft-logo { width: 80px; }
  .ft-row2 { gap: 10px; }
  .ft-menu { flex: 0 0 80px; }
  .ft-news-form { width: 100%; max-width: 330px; }
  .ft-news-form button { width: 100px; flex-shrink: 0; }
  .ft-news-form input[type=email], .ft-news-form button { height: 35px; }
  .ft-news-form button { width: 100px; }
  .ft-row3 p { font-size: 9px; }

  .hours-bar-title { font-size: 15px; }
  .hours-bar-btn img { width: 88px; }
  .hours-panel { flex-direction: column; gap: 40px; padding: 30px 20px; max-height: 85vh; overflow-y: auto; }
  .hours-col:first-of-type, .hours-col--right { flex: none; width: 100%; }
  .hours-col--right { border-left: 0; border-top: 1px solid #D5D5D5; padding: 30px 0 0; }
  .hours-col h3 { font-size: 19px; }
  .hours-time { font-size: 17px; }
  .hours-close { top: 10px; right: 10px; }

  .attr-hero { min-height: 209px; padding: 0 18px; justify-content: center; }
  .attr-hero-inner { padding: 40px 0; }
  .attr-hero h1 { font-size: 29px; }
  .attr-body { padding: 60px 18px; background-image: url("/wp-content/uploads/2026/01/Seasonal-Promo-1.webp"); background-position: top center; }
  .attr-body-inner { gap: 44px; }
  .attr-body h3 { font-size: 30px; }
  .attr-card { min-height: 400px; background-image: url("/wp-content/uploads/2026/01/white-background-1.webp"); }
  .attr-card-img { margin: 0; }
  .attr-card h5 { font-size: 16px; margin-top: 0; }

  .ttd-hero { min-height: 455px; padding: 60px 18px 40px; }
  .ttd-hero .wrap { align-items: flex-start; text-align: left; }
  .ttd-hero h1, .ttd-specific-title { font-size: 29px; }
  .ttd-specific { min-height: 455px; padding: 40px 18px 90px; }
  .ttd-specific-title { text-align: left; margin-bottom: 30px; }
  .ttd-cats { gap: 20px; flex-wrap: wrap; }
  .ttd-cat, .ttd-cat-box { width: 180px; }
  .ttd-cat-box { height: 180px; }
  .ttd-cat-icon { width: 111px; height: 111px; padding: 18px; }
  .ttd-cat-icon svg { width: 75px; height: 75px; }
  .outlets-box { width: 350px; min-height: 520px; background-image: url("/wp-content/uploads/2026/04/white-background-tablet.webp"); }
  .carousel--outlets { max-width: 350px; }
  .outlet-card { min-height: 350px; padding: 20px 10px 10px; }
  .outlet-img img { max-width: 69%; }
  .outlet-text { width: 85%; }
  .outlet-text h5, .outlet-text p { font-size: 12px; }
  .outlet-text h5 { font-size: 14px; margin-bottom: -15px; }

  .ttd-list { padding: 60px 18px; }
  .ttd-row, .ttd-row--text-first { flex-direction: column; gap: 20px; }
  .ttd-row-img, .ttd-row-text { flex: none; }
  .ttd-row-text, .ttd-row--text-first .ttd-row-text { padding: 0; }
  .ttd-row-text h2 { font-size: 30px; }
  .ttd-row-text .img-btn { width: 86px !important; }
  .ttd-row-text .img-btn[href^="http"] { width: 130px !important; }
  .deco-ttd-1 { width: 140px; }
  .deco-ttd-2 { width: 221px; }
  .deco-ttd-3 { width: 206px; bottom: 45.7%; }
  .deco-ttd-4 { width: 221px; bottom: 635px; }

  .pg-top { padding: 60px 18px; background-position: top center; }
  .pg-title { font-size: 30px; }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); gap: 14px 10px; }
  .gal-card { padding: 8px 8px 11px; }
  .pg-brochure { padding: 40px 18px 90px; background-position: top center; }
  .brochure-dl { width: 250px; }
  .plant-block h3 { font-size: 30px; }

  .pg-contact-top { padding: 60px 18px; margin-bottom: -30px; }
  .pg-contact-top h1 { font-size: 30px; }
  .where-row { flex-direction: column; }
  .where-map iframe { height: 350px; }
  .where-cards { flex-basis: auto; }
  .where-card, .where-card--bus { padding: 20px 30px; min-height: 0; }
  .where-card-icon { flex-basis: 20%; }

  .contact-box { flex-direction: column; gap: 50px; padding: 20px; background-position: center; background-repeat: no-repeat; }
  .contact-img-col { order: -1; justify-content: center; }
  .contact-form-col h3 { font-size: 20px; }
  .form-boxed .fb-half { flex-basis: 100%; }
  .contact-cards { flex-direction: column; gap: 20px; }
  .contact-card { flex-basis: auto; width: 100%; min-height: 175px; padding: 20px; }
  .contact-icon { margin-bottom: 5px; }
  .contact-icon svg { width: 22px; height: 22px; }
  .contact-icon--img img { width: 24px; }
  .contact-card h3 { font-size: 19px; }
  .contact-card p, .contact-card p.contact-card-sm { font-size: 15px; }
}

/* Carousel items per view by breakpoint */
@media (max-width: 1024px) { .carousel { --n: var(--per-t, var(--per, 3)); } }
@media (max-width: 767px)  { .carousel { --n: var(--per-m, var(--per-t, var(--per, 3))); } }

/* ---------------------------------------------------------------------
   About Us
   --------------------------------------------------------------------- */
.about-hero {
  position: relative; z-index: 12;
  display: flex; min-height: 380px; padding: 30px 18px 0;
  background: url("/wp-content/uploads/2026/01/6a687a3202a7a09bd7312821d74f645d31262a24-1.webp") center / cover no-repeat;
  box-shadow: 0 -5px 5px 12px rgba(154,154,154,.46);
}
.about-hero-inner { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 50px 0; }
.about-hero h1 { color: #fff; font-size: 63px; max-width: 693px; text-align: center; }
.about-body {
  position: relative; z-index: 11; margin-bottom: -2px;
  padding: 70px 18px 90px;
  background: url("/wp-content/uploads/2026/01/28e2480efdef10f6b8eb246730526ceaed4c4ef6-1.webp") bottom center / cover no-repeat;
  box-shadow: 0 -5px 5px 12px rgba(154,154,154,.46);
}
.about-row { display: flex; gap: 50px; }
.about-text { flex: 1 1 100%; display: flex; flex-direction: column; justify-content: center; gap: 20px; }
.about-img { flex: 1 1 68%; display: flex; flex-direction: column; justify-content: center; }
.about-explore {
  position: relative; padding: 90px 18px;
  background: url("/wp-content/uploads/2025/05/Seasonal-Promo-Slider-Contents-1.webp") bottom center / cover no-repeat;
}
.about-explore .home-ttd { margin-top: 20px; }

@media (max-width: 1024px) {
  .about-hero { min-height: 335px; }
  .about-hero h1 { font-size: 50px; }
  .about-text h2, .about-explore h3 { font-size: 33px; }
}
@media (max-width: 767px) {
  .about-hero { min-height: 209px; padding: 0 18px; justify-content: center; }
  .about-hero-inner { padding: 40px 0; }
  .about-hero h1 { font-size: 29px; }
  .about-body { padding: 60px 18px; background-image: url("/wp-content/uploads/2025/05/Seasonal-Promo-1.webp"); background-position: top center; }
  .about-row { flex-direction: column; }
  .about-img { order: -1; }
  .about-text h2, .about-explore h3 { font-size: 30px; }
  .about-explore { padding: 40px 18px 50px; background-image: url("/wp-content/uploads/2025/05/Seasonal-Promo-1.webp"); background-position: top center; }
  .about-explore .home-ttd { margin: 30px -30px 0 0; }
}

/* Arrows are hidden on tablet/mobile (swipe + dots), as on the live site */
@media (min-width: 1025px) { .carousel-dots--touch { display: none; } }
@media (max-width: 1024px) { .carousel-nav { display: none !important; } }

/* =====================================================================
   Motion: scroll reveal, hero entrance, parallax, hover
   ===================================================================== */
.rv { opacity: 0; transform: translate3d(0, 34px, 0); transition: opacity .9s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1); transition-delay: var(--d, 0s); }
.rv--zoom { transform: scale(.92); }
.rv--left { transform: translate3d(-60px, 0, 0); }
.rv--right { transform: translate3d(60px, 0, 0); }
.rv.is-in { opacity: 1; transform: none; }

/* Hero entrance */
@keyframes heroUp { from { opacity: 0; transform: translate3d(0, 40px, 0); } to { opacity: 1; transform: none; } }
@keyframes heroIn { from { opacity: 0; transform: scale(.9) translate3d(0, 30px, 0); } to { opacity: 1; transform: none; } }
@keyframes floatY { 0%, 100% { transform: translate3d(0, 0, 0); } 50% { transform: translate3d(0, -12px, 0); } }
@keyframes sway { 0%, 100% { rotate: -2deg; } 50% { rotate: 2deg; } }
.home-hero h1 > span { display: inline-block; opacity: 0; animation: heroUp 1s cubic-bezier(.22,1,.36,1) forwards; }
.home-hero h1 .h1-a { animation-delay: .15s; }
.home-hero h1 .h1-b { animation-delay: .3s; }
.home-hero h1 .h1-c { animation-delay: .45s; }
.home-hero p { opacity: 0; animation: heroUp 1s .65s cubic-bezier(.22,1,.36,1) forwards; }
.home-hero-img img { opacity: 0; animation: heroIn 1.3s .1s cubic-bezier(.22,1,.36,1) forwards; }
.home-hero-img { animation: floatY 6s 1.5s ease-in-out infinite; }
.attr-hero h1, .about-hero h1, .ttd-hero h1, .ttd-hero p { opacity: 0; animation: heroUp 1.1s .2s cubic-bezier(.22,1,.36,1) forwards; }
.ttd-hero p { animation-delay: .4s; }
.deco-flowers-tr, .deco-flowers-tl, .deco-flowers-bl { transform-origin: top center; animation: sway 7s ease-in-out infinite; }
.deco-flowers-tr { transform-origin: top right; }
.deco-flowers-tl { transform-origin: top left; }
.deco-flowers-bl { transform-origin: bottom left; }
[data-parallax] { will-change: transform; }

/* Hover */
.ttd-card, .attr-card, .outlet-card, .iconic-col, .contact-card, .ttd-cat-box { transition: transform .45s cubic-bezier(.22,1,.36,1), filter .45s; }
.ttd-card:hover, .attr-card:hover, .outlet-card:hover, .contact-card:hover { transform: translateY(-8px); filter: drop-shadow(0 12px 14px rgba(0,0,0,.12)); }
.iconic-col:hover { transform: translateY(-10px); }
.ttd-cat:hover .ttd-cat-box { transform: translateY(-6px) rotate(-1deg); }
.ttd-card-img, .attr-card-img, .ttd-row-img, .gallery-item, .gal-open, .carousel--gallery .carousel-cell, .iconic-col { overflow: hidden; }
.ttd-card-img img, .attr-card-img img, .ttd-row-img img, .gallery-item img, .gal-open img, .carousel--gallery .carousel-cell img, .iconic-col > img { transition: transform .8s cubic-bezier(.22,1,.36,1); }
.ttd-card:hover .ttd-card-img img, .attr-card:hover .attr-card-img img, .ttd-row:hover .ttd-row-img img, .gallery-item:hover img, .gal-open:hover img, .carousel--gallery .carousel-cell:hover img, .iconic-col:hover > img { transform: scale(1.06); }
.img-btn, .btn-book, .btn-yellow, .btn-explore, .fu-submit button, .fb-submit, .ft-news-form button { transition: transform .3s cubic-bezier(.22,1,.36,1), opacity .2s, filter .3s; }
.img-btn:hover, .btn-book:hover, .btn-yellow:hover, .btn-explore:hover, .fu-submit button:hover, .fb-submit:hover, .ft-news-form button:hover { transform: translateY(-2px) scale(1.05); opacity: 1; filter: brightness(1.05); }
.social a { transition: transform .3s, background .3s; }
.social a:hover { transform: translateY(-4px) rotate(-6deg); background: var(--yellow); }
.hd-nav a { position: relative; }
.hd-nav a::after { content: ""; position: absolute; left: 0; right: 60px; bottom: 6px; height: 2px; background: var(--yellow); transform: scaleX(0); transform-origin: left; transition: transform .35s cubic-bezier(.22,1,.36,1); }
.hd-nav a:hover::after, .hd-nav a[aria-current]::after { transform: scaleX(1); }
.hours-bar-btn img { transition: transform .3s; }
.hours-bar-btn:hover img { transform: scale(1.06) rotate(-2deg); }

/* Modal entrance */
.modal.is-open .attr-modal, .modal.is-open .gallery-modal-box, .modal.is-open .outlets-box, .modal.is-open .promo-box { animation: heroIn .55s cubic-bezier(.22,1,.36,1); }
.modal.is-open .hours-panel { animation: heroUp .45s cubic-bezier(.22,1,.36,1); }
.modal.is-open .modal-backdrop { animation: fadeIn .3s; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

@media (max-width: 767px) { .rv--left, .rv--right { transform: translate3d(0, 34px, 0); } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .rv, .home-hero h1 > span, .home-hero p, .home-hero-img img, .attr-hero h1, .about-hero h1, .ttd-hero h1, .ttd-hero p { opacity: 1 !important; transform: none !important; }
}

/* =====================================================================
   Carousel skins – values taken from each carousel on the live site
   ===================================================================== */
/* Dots: Liquid "style 3" (ring on the selected dot) */
.skin-ttd .carousel-dots, .skin-modal .carousel-dots, .skin-homegal .carousel-dots { gap: 0; }
.skin-ttd .carousel-dots button, .skin-modal .carousel-dots button, .skin-homegal .carousel-dots button {
  position: relative; width: 10px; height: 10px; margin: 0 8px; border-radius: 5em; color: #333;
}
.skin-ttd .carousel-dots button::before, .skin-modal .carousel-dots button::before, .skin-homegal .carousel-dots button::before {
  content: ""; position: absolute; inset: -1.5px; border: 3px solid currentColor; border-radius: inherit;
  transform: scale(.5); opacity: 0; transition: transform .3s cubic-bezier(.23,1,.32,1), opacity .15s;
}
.skin-ttd .carousel-dots button.is-active::before, .skin-modal .carousel-dots button.is-active::before, .skin-homegal .carousel-dots button.is-active::before { opacity: 1; transform: scale(1); }
.skin-ttd .carousel-dots button.is-active, .skin-modal .carousel-dots button.is-active, .skin-homegal .carousel-dots button.is-active { width: 10px; }
.skin-ttd .carousel-dots button { width: 9px; height: 9px; background: var(--yellow); }
.skin-ttd .carousel-dots button.is-active { width: 9px; background: var(--green); }
.skin-modal .carousel-dots button { background: var(--yellow); }
.skin-modal .carousel-dots button.is-active { background: #fff; }
.skin-homegal .carousel-dots button { background: #F6A69E; }
.skin-homegal .carousel-dots button.is-active { background: #EEF7C8; }
.skin-homegal .carousel-dots { margin-top: 0; }

/* Dots: Liquid "style 4" (plant profile) */
.skin-plant .carousel-dots { gap: 8px 0; }
.skin-plant .carousel-dots button { width: 6px; height: 6px; margin: 0 8px; background: rgba(23,24,26,.2); }
.skin-plant .carousel-dots button.is-active { width: 15px; background: #17181a; }

/* Dots on touch devices for arrow-only carousels (attraction pages) */
.skin-attr .carousel-dots { gap: 0; }
.skin-attr .carousel-dots button { width: 10px; height: 10px; margin: 0 6px; background: rgba(51,51,51,.25); }
.skin-attr .carousel-dots button.is-active { width: 10px; background: #333; }

/* Arrows */
.skin-modal .carousel-nav button { width: 40px; height: 40px; background: #fff; color: #000; }
.skin-modal .carousel-nav button svg { width: 12px; height: 12px; }
.skin-modal[data-nav-translucent] .carousel-nav button { background: rgba(255,255,255,.56); }
.skin-modal[data-nav-translucent] .carousel-nav button:hover { background: rgba(255,255,255,.67); }
.skin-modal .carousel-nav .prev { left: 45px; }
.skin-modal .carousel-nav .next { right: 45px; }
.skin-homegal .carousel-nav button, .skin-galmodal .carousel-nav button { width: 50px; height: 50px; color: var(--green); }
.skin-homegal .carousel-nav button svg, .skin-galmodal .carousel-nav button svg { width: 14px; height: 14px; }
.skin-homegal .carousel-nav button { background: #D9D9D9; }
.skin-homegal .carousel-nav button:hover, .skin-galmodal .carousel-nav button:hover { background: #D9D9D9; box-shadow: 0 7px 28px rgba(0,0,0,.12); }
.skin-homegal .carousel-nav .prev { left: 20px; }
.skin-homegal .carousel-nav .next { right: 20px; }
.skin-galmodal .carousel-nav button { background: #EFEFEF; }
.skin-galmodal .carousel-nav .prev { left: -70px; }
.skin-galmodal .carousel-nav .next { right: -70px; }
.skin-plant .carousel-nav button, .skin-attr .carousel-nav button { width: 42px; height: 42px; background: rgba(247,247,247,.48); color: #000; }
.skin-plant .carousel-nav button svg, .skin-attr .carousel-nav button svg { width: 11px; height: 11px; }
.skin-outlets .carousel-nav button { width: 42px; height: 42px; background: transparent; color: #000; }
.skin-outlets .carousel-dots button { width: 12px; height: 12px; margin: 0 8px; background: rgba(51,51,51,.25); }
.skin-outlets .carousel-dots { gap: 0; }
.skin-outlets .carousel-dots button.is-active { width: 12px; background: #333; }

