/* ==========================================================================
   Dreamstay - own design system. No framework, no Elementor CSS.
   Tokens and base typography are the real values measured from the original
   site (Astra inline CSS + per-page Elementor CSS): palette
   #065a60 / #415a77 / #0F172A / #212245 / #eaf4f4, Montserrat body,
   Adamina headings (h1 88/700/1.4 uppercase, h2 46/700/1.3 uppercase),
   Astra container 1240px, Elementor content width 1140px.
   Normalized pages carry their own measured values as CSS custom properties
   (--fs / --pt / --gap / --dir ...); this file only provides the vocabulary.
   ========================================================================== */

@font-face { font-family: 'Montserrat'; font-weight: 400; font-style: normal; font-display: swap; src: url('/assets/fonts/montserrat-400.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-weight: 500; font-style: normal; font-display: swap; src: url('/assets/fonts/montserrat-500.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-weight: 600; font-style: normal; font-display: swap; src: url('/assets/fonts/montserrat-600.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-weight: 700; font-style: normal; font-display: swap; src: url('/assets/fonts/montserrat-700.woff2') format('woff2'); }
@font-face { font-family: 'Adamina'; font-weight: 400; font-style: normal; font-display: swap; src: local('Adamina'), url('https://fonts.gstatic.com/s/adamina/v21/j8_r6-DH1bjodkjz4siQuHXzA9o.woff2') format('woff2'); }

:root {
  --ds-primary: #065a60;
  --ds-primary-dark: #04494f;
  --ds-accent: #415a77;
  --ds-navy: #212245;
  --ds-text: #212245;
  --ds-muted: #415a77;
  --ds-soft: #eaf4f4;
  --ds-border: #e0e1dd;
  --ds-bg: #ffffff;
  --ds-bg-soft: #f6f9fa;
  --ds-radius: 14px;
  --ds-radius-sm: 9px;
  --ds-shadow: 0 1px 3px rgba(15, 23, 42, .07), 0 4px 16px rgba(15, 23, 42, .06);
  --ds-shadow-lg: 0 12px 40px rgba(15, 23, 42, .16);
  --ds-container: 1140px;
  --ds-container-wide: 1240px;
  --ds-gutter: clamp(20px, 4.5vw, 40px);
  --ds-header-h: 114px;
  --ds-font: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ds-serif: 'Adamina', Georgia, 'Times New Roman', serif;
  --ds-whatsapp: #49e670;
  --ds-sec-pad: clamp(44px, 6vw, 80px);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: var(--ds-font); color: var(--ds-text); background: var(--ds-bg); font-size: 16px; line-height: 1.65; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--ds-primary); text-decoration: none; }
a:hover { color: var(--ds-accent); }
h1, h2, h3, h4, h5, h6 { line-height: 1.22; margin: 0 0 .55em; font-weight: 600; }
p { margin: 0 0 1em; }
hr { border: 0; border-top: 1px solid var(--ds-border); margin: 2em 0; }
ul, ol { padding-left: 1.3em; }
.skip-link { position: absolute; left: -9999px; }
.skip-link:focus { left: 8px; top: 8px; background: #fff; padding: 8px 14px; z-index: 999; border-radius: 6px; }
[hidden] { display: none !important; }
@media (max-width: 921px) { html { font-size: 91.2%; } }

.ds-btn { display: inline-block; padding: 13px 28px; border-radius: var(--ds-radius-sm); font-weight: 600; font-size: .95rem; border: 1px solid transparent; cursor: pointer; font-family: inherit; transition: all .18s ease; }
.ds-btn-primary { background: var(--ds-primary); color: #fff; }
.ds-btn-primary:hover { background: var(--ds-primary-dark); color: #fff; }
.ds-btn-ghost { background: transparent; color: var(--ds-primary); border-color: var(--ds-primary); }
.ds-btn-ghost:hover { background: var(--ds-primary); color: #fff; }

/* ==========================================================================
   Header / nav
   ========================================================================== */
.ds-header { position: sticky; top: 0; z-index: 100; background: #fff; box-shadow: 0 1px 0 var(--ds-border), 0 2px 12px rgba(15,23,42,.05); }
.ds-header-inner { max-width: 1310px; margin: 0 auto; padding: 0 var(--ds-gutter); height: var(--ds-header-h); display: flex; align-items: center; gap: 16px; }
.ds-logo { flex-shrink: 0; }
.ds-logo img { height: 44px; width: auto; }
.ds-nav { flex: 1 1 auto; min-width: 0; }
.ds-menu, .ds-submenu { list-style: none; margin: 0; padding: 0; display: flex; }
.ds-menu { justify-content: center; flex-wrap: nowrap; }
.ds-menu-item { position: relative; }
.ds-menu-item > a { display: block; padding: 9px 11px; font-size: 1rem; font-weight: 500; color: var(--ds-text); border-radius: 6px; white-space: nowrap; }
.ds-menu-item > a:hover { color: var(--ds-primary); background: var(--ds-bg-soft); }
.ds-menu-item.has-children > a::after { content: ''; display: inline-block; margin-left: 5px; border: 4px solid transparent; border-top-color: currentColor; transform: translateY(2px); }
.ds-submenu { position: absolute; top: 100%; left: 0; min-width: 215px; flex-direction: column; background: #fff; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-sm); box-shadow: var(--ds-shadow); padding: 6px; opacity: 0; visibility: hidden; transform: translateY(6px); transition: all .18s ease; z-index: 20; }
.ds-menu-item:hover > .ds-submenu, .ds-menu-item:focus-within > .ds-submenu { opacity: 1; visibility: visible; transform: translateY(0); }
.ds-submenu a { display: block; padding: 9px 12px; font-size: .93rem; color: var(--ds-text); border-radius: 6px; white-space: nowrap; }
.ds-submenu a:hover { background: var(--ds-bg-soft); color: var(--ds-primary); }

.ds-header-tools { display: flex; align-items: center; gap: 12px; flex-shrink: 0; margin-left: auto; }
.ds-lang-switch { display: flex; gap: 4px; }
.ds-lang-switch a { font-size: .78rem; font-weight: 600; padding: 6px 9px; border-radius: 6px; color: var(--ds-muted); border: 1px solid var(--ds-border); }
.ds-lang-switch a:hover { color: var(--ds-primary); border-color: var(--ds-primary); }
.ds-lang-switch a.active { background: var(--ds-primary); color: #fff; border-color: var(--ds-primary); }
.ds-book-now { background: var(--ds-primary); color: #fff; font-weight: 600; font-size: 1.25rem; line-height: 1.3; padding: 15px 25px; border-radius: 5px; max-width: 116px; text-align: center; }
.ds-book-now:hover { background: var(--ds-primary-dark); color: #fff; }
.ds-burger { display: none; background: none; border: 0; cursor: pointer; padding: 8px; }
.ds-burger span { display: block; width: 24px; height: 2.5px; background: var(--ds-text); margin: 5px 0; border-radius: 2px; }
.ds-mobile-nav { display: none; }

@media (max-width: 1280px) {
  .ds-menu-item > a { padding: 9px 8px; font-size: .9rem; }
  .ds-book-now { font-size: 1.05rem; padding: 13px 18px; }
}
@media (max-width: 1150px) {
  .ds-menu-item > a { padding: 8px 6px; font-size: .8rem; }
  .ds-logo img { height: 38px; }
}
@media (max-width: 990px) {
  :root { --ds-header-h: 80px; }
  .ds-nav, .ds-lang-switch, .ds-book-now { display: none; }
  .ds-burger { display: block; }
  .ds-mobile-nav { display: block; position: absolute; top: 100%; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--ds-border); box-shadow: var(--ds-shadow-lg); padding: 14px 20px 22px; max-height: 75vh; overflow: auto; }
  .ds-mobile-nav a { display: block; padding: 11px 4px; border-bottom: 1px solid var(--ds-bg-soft); color: var(--ds-text); font-weight: 500; }
  .ds-mobile-nav a.sub { padding-left: 22px; font-weight: 400; color: var(--ds-muted); }
  .ds-mobile-langs { display: flex; gap: 10px; margin-top: 14px; }
  .ds-mobile-langs a { flex: 1; text-align: center; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-sm); }
}

/* ==========================================================================
   Normalized content (pc-*) - structure + measured values
   ========================================================================== */
.ds-main { min-height: 40vh; }
.pc-sec {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: var(--p-pt, var(--ds-sec-pad)) var(--p-pr, var(--ds-gutter)) var(--p-pb, var(--ds-sec-pad)) var(--p-pl, var(--ds-gutter));
  margin-top: var(--p-mt, 0);
  margin-bottom: var(--p-mb, 0);
  min-height: var(--p-mh, auto);
  background-color: var(--p-bgc, transparent);
  background-image: var(--p-bgi, none);
  background-size: var(--p-bgsz, cover);
  background-position: var(--p-bgpos, center);
  background-repeat: no-repeat;
  text-align: var(--p-ta, inherit);
}
@media (min-width: 1025px) { .pc-sec { background-attachment: var(--p-bgatt, scroll); } }
.pc-sec[style*="--p-bgfixed"] { --p-bgatt: fixed; }
.pc-sec::before { content: ''; position: absolute; inset: 0; background: var(--p-ovbg, transparent); opacity: var(--p-ov, 0); pointer-events: none; }
.pc-sec > * { position: relative; z-index: 1; }

.pc-wrap {
  width: 100%;
  max-width: var(--p-cw, var(--ds-container));
  margin-inline: auto;
  flex: 1 1 auto;
  display: flex;
  flex-direction: var(--p-dir, column);
  flex-wrap: var(--p-fxw, nowrap);
  justify-content: var(--p-jc, normal);
  align-items: var(--p-ai, normal);
  gap: var(--p-gap, normal);
}
.pc-col {
  display: flex;
  flex-direction: var(--p-dir, column);
  flex-wrap: var(--p-fxw, nowrap);
  justify-content: var(--p-jc, normal);
  align-items: var(--p-ai, normal);
  gap: var(--p-gap, normal);
  flex: 0 1 auto;
  width: var(--p-w, 100%);
  max-width: var(--p-cw, none);
  min-width: 0;
}
.pc-item { max-width: var(--p-mw, none); min-width: 0; }
/* measured box values are consumed only by the element that owns them */
.pc-box {
  padding: var(--p-pt, 0) var(--p-pr, 0) var(--p-pb, 0) var(--p-pl, 0);
  margin: var(--p-mt, 0) var(--p-mr, 0) var(--p-mb, 0) var(--p-ml, 0);
}

/* measured typography: the element that owns the values applies them, children inherit */
.pc-sec, .pc-wrap, .pc-col, .pc-item, .pc-text, .pc-h, .pc-btn,
.pc-banner-title, .pc-banner-text, .pc-acc-q, .pc-acc-a, .pc-list li {
  font-family: var(--p-ff, inherit);
  font-weight: var(--p-fw, inherit);
  letter-spacing: var(--p-ls, normal);
  text-transform: var(--p-tt, none);
  color: var(--p-c, inherit);
  line-height: var(--p-lh, inherit);
  text-align: var(--p-ta, inherit);
}
.pc-item, .pc-text, .pc-banner-title, .pc-banner-text, .pc-acc-a, .pc-list li { font-size: var(--p-fs, inherit); }
h1.pc-h { font-family: var(--p-ff, var(--ds-serif)); font-size: var(--p-fs, 88px); font-weight: var(--p-fw, 700); line-height: var(--p-lh, 1.4); text-transform: var(--p-tt, uppercase); }
h2.pc-h { font-family: var(--p-ff, var(--ds-serif)); font-size: var(--p-fs, 46px); font-weight: var(--p-fw, 700); line-height: var(--p-lh, 1.3); text-transform: var(--p-tt, uppercase); }
h3.pc-h { font-family: var(--p-ff, var(--ds-serif)); font-size: var(--p-fs, 46px); font-weight: var(--p-fw, 400); line-height: var(--p-lh, 1.3); text-transform: var(--p-tt, uppercase); }
h4.pc-h { font-family: var(--p-ff, var(--ds-serif)); font-size: var(--p-fs, 20px); font-weight: var(--p-fw, 700); line-height: var(--p-lh, 1.2); text-transform: var(--p-tt, none); }
h5.pc-h { font-family: var(--p-ff, var(--ds-serif)); font-size: var(--p-fs, 18px); line-height: var(--p-lh, 1.2); }
h6.pc-h { font-family: var(--p-ff, var(--ds-serif)); font-size: var(--p-fs, 15px); line-height: var(--p-lh, 1.25); }

@media (max-width: 1024px) {
  .pc-sec { padding-top: var(--p-pt-t, var(--p-pt, var(--ds-sec-pad))); padding-right: var(--p-pr-t, var(--p-pr, var(--ds-gutter))); padding-bottom: var(--p-pb-t, var(--p-pb, var(--ds-sec-pad))); padding-left: var(--p-pl-t, var(--p-pl, var(--ds-gutter))); margin-top: var(--p-mt-t, var(--p-mt, 0)); margin-bottom: var(--p-mb-t, var(--p-mb, 0)); min-height: var(--p-mh-t, var(--p-mh, auto)); }
  .pc-wrap, .pc-col { flex-direction: var(--p-dir-t, var(--p-dir, column)); gap: var(--p-gap-t, var(--p-gap, normal)); justify-content: var(--p-jc-t, var(--p-jc, normal)); }
  .pc-wrap { max-width: var(--p-cw-t, var(--p-cw, var(--ds-container))); }
  .pc-col { width: var(--p-w-t, var(--p-w, 100%)); }
  .pc-box { padding: var(--p-pt-t, var(--p-pt, 0)) var(--p-pr-t, var(--p-pr, 0)) var(--p-pb-t, var(--p-pb, 0)) var(--p-pl-t, var(--p-pl, 0)); margin-bottom: var(--p-mb-t, var(--p-mb, 0)); }
  h1.pc-h { font-size: var(--p-fs-t, var(--p-fs, 72px)); }
  h2.pc-h { font-size: var(--p-fs-t, var(--p-fs, 34px)); }
  h3.pc-h { font-size: var(--p-fs-t, var(--p-fs, 34px)); }
  .pc-item, .pc-text, .pc-banner-title, .pc-banner-text, .pc-acc-a { font-size: var(--p-fs-t, var(--p-fs, inherit)); }
}
@media (max-width: 767px) {
  .pc-sec { padding-top: var(--p-pt-m, var(--p-pt, var(--ds-sec-pad))); padding-bottom: var(--p-pb-m, var(--p-pb, var(--ds-sec-pad))); margin-top: var(--p-mt-m, var(--p-mt, 0)); margin-bottom: var(--p-mb-m, var(--p-mb, 0)); min-height: var(--p-mh-m, var(--p-mh, auto)); }
  .pc-wrap, .pc-col { flex-wrap: wrap; flex-direction: var(--p-dir-m, var(--p-dir, column)); gap: var(--p-gap-m, var(--p-gap, normal)); }
  .pc-wrap { max-width: var(--p-cw-m, var(--p-cw, var(--ds-container))); }
  .pc-col { width: var(--p-w-m, var(--p-w, 100%)); }
  .pc-box { padding: var(--p-pt-m, var(--p-pt, 0)) var(--p-pr-m, var(--p-pr, 0)) var(--p-pb-m, var(--p-pb, 0)) var(--p-pl-m, var(--p-pl, 0)); margin-bottom: var(--p-mb-m, var(--p-mb, 0)); }
  h1.pc-h { font-size: var(--p-fs-m, var(--p-fs, 40px)); }
  h2.pc-h { font-size: var(--p-fs-m, var(--p-fs, 27px)); }
  h3.pc-h { font-size: var(--p-fs-m, var(--p-fs, 27px)); }
  .pc-item, .pc-text, .pc-banner-title, .pc-banner-text, .pc-acc-a { font-size: var(--p-fs-m, var(--p-fs, inherit)); }
}

/* responsive visibility (Elementor breakpoints) */
@media (min-width: 1025px) { .pc-hd { display: none !important; } }
@media (min-width: 768px) and (max-width: 1024px) { .pc-ht { display: none !important; } }
@media (max-width: 767px) { .pc-hm { display: none !important; } }

.pc-text { font-size: var(--p-fs, 1rem); }
.pc-text p { margin: 0 0 1.1em; }
.pc-text img { border-radius: var(--ds-radius); margin: 1.2em 0; }
.pc-text a { text-decoration: underline; text-underline-offset: 2px; }
.pc-btn { display: inline-block; align-self: flex-start; background: var(--p-btnbg, var(--ds-primary)); color: var(--p-btnc, #fff); padding: var(--p-btnpad, 13px 28px); border-radius: var(--p-btnbr, var(--ds-radius-sm)); border: var(--p-btnbd, 0); font-weight: var(--p-btnfw, 600); font-size: var(--p-btnfs, .95rem); letter-spacing: var(--p-btnls, normal); text-transform: var(--p-btntt, none); margin: 4px 0; }
.pc-btn:hover { background: var(--ds-primary-dark); color: #fff; }
.pc-list { list-style: none; padding: 0; margin: 0 0 1.2em; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 6px 22px; }
.pc-list li { padding: 7px 0 7px 26px; position: relative; font-size: .95rem; border-bottom: 1px dashed var(--ds-border); }
.pc-list li::before { content: ''; position: absolute; left: 4px; top: 14px; width: 7px; height: 7px; border-radius: 50%; background: var(--ds-primary); }
.pc-ol li { margin-bottom: .5em; }
.pc-table { width: 100%; border-collapse: collapse; }
.pc-table td, .pc-table th { padding: 8px 10px; border: 1px solid var(--ds-border); }
.pc-hr { border: 0; border-top: 1px solid var(--ds-border); margin: 2em 0; }
.pc-quote { border-left: 3px solid var(--ds-primary); margin: 1.5em 0; padding: 4px 0 4px 18px; color: var(--ds-accent); font-style: italic; }

/* category / photo banner cards */
/* The live widget put the photo at 60% opacity over black, which greys the image out.
   A scrim over the full-colour photo keeps the contrast without the wash-out. */
.pc-banner { position: relative; display: block; overflow: hidden; background: var(--ds-navy); color: #fff; }
.pc-banner img { display: block; width: 100%; height: 475px; object-fit: cover; }
.pc-banner::after { content: ''; position: absolute; inset: 0; z-index: 1; background: rgba(14, 22, 32, .26); transition: background .3s ease; }
.pc-banner:hover::after { background: rgba(14, 22, 32, .52); }
.pc-banner-body { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 30px; text-align: center; }
.pc-banner-title { text-shadow: 0 1px 14px rgba(0, 0, 0, .45); }
.pc-banner-text { text-shadow: 0 1px 10px rgba(0, 0, 0, .5); }
.pc-banner-title { font-family: var(--ds-serif); font-weight: 400; font-size: 34px; line-height: 1.2; color: #fff; margin: 0; text-transform: none; }
.pc-banner-text { color: #fff; font-size: 1rem; }

/* accordion (Elementor nested-accordion -> details/summary) */
.pc-acc-item { border: 1px solid var(--ds-border); border-radius: var(--ds-radius-sm); background: #fff; }
.pc-acc-item + .pc-acc-item { margin-top: 10px; }
.pc-acc-q { cursor: pointer; list-style: none; padding: 18px 22px; display: flex; align-items: center; justify-content: space-between; gap: 16px; font-family: var(--ds-font); font-weight: 600; font-size: 1.05rem; color: var(--ds-navy); }
.pc-acc-q::-webkit-details-marker { display: none; }
.pc-acc-q::after { content: '+'; flex: 0 0 auto; font-size: 1.5rem; line-height: 1; color: var(--ds-primary); font-weight: 400; }
.pc-acc-item[open] .pc-acc-q::after { content: '\2212'; }
.pc-acc-item[open] .pc-acc-q { color: var(--ds-primary); }
.pc-acc-a { padding: 0 22px 18px; color: var(--ds-text); }
.pc-acc-a > :last-child { margin-bottom: 0; }

/* search card (own implementation of the original Lodgix widget) */
.pc-search { width: 100%; max-width: var(--ds-container); margin: 0 auto; }
.pc-search form { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; }
.pc-search-field { flex: 1 1 190px; min-width: 0; display: block; }
.pc-search-field input { font-family: inherit; font-size: 16px; height: 55px; width: 100%; padding: 0 16px; border: 0; border-radius: 5px; background: #fff; color: #000; }
.pc-search-field input::placeholder { color: #6b7280; }
.pc-search-go { flex: 1 1 150px; height: 55px; border: 0; border-radius: 5px; background: #fff; color: var(--ds-primary); font-family: inherit; font-weight: 600; font-size: 16px; cursor: pointer; transition: background .18s ease; }
.pc-search-go:hover { background: var(--ds-soft); }
.pc-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* reviews band (replaces the Trustindex widget) */
.pc-reviews { max-width: var(--ds-container); margin: 34px auto 0; text-align: center; }
.pc-reviews-badge { display: inline-flex; align-items: center; gap: 12px; font-weight: 700; font-size: 1.35rem; letter-spacing: .04em; color: var(--ds-navy); }
.pc-stars { color: #f5a623; font-size: 1.15rem; letter-spacing: 2px; }
.pc-reviews-note { margin: 10px 0 0; color: var(--ds-muted); }
/* Host for the frozen Trustindex markup. Its carousel progress line is wider
   than the container, which made the whole document scroll sideways on phones
   (and dragged any position:fixed widget out past the right edge with it).
   `clip` trims it horizontally while leaving vertical overflow - the widget's
   tooltips - visible. */
.pc-ti-host { overflow-x: clip; }

/* ==========================================================================
   Listing
   ========================================================================== */
.ds-listing { max-width: var(--ds-container-wide); margin: 0 auto; padding: 44px var(--ds-gutter) 70px; }
.ds-listing-head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-bottom: 22px; }
.ds-count { color: var(--ds-muted); }
.ds-filters { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; background: var(--ds-bg-soft); border: 1px solid var(--ds-border); border-radius: var(--ds-radius); padding: 16px 18px; margin-bottom: 30px; }
.ds-filters label { display: flex; flex-direction: column; gap: 5px; font-size: .8rem; font-weight: 600; color: var(--ds-muted); }
.ds-filters select, .ds-filters input { font-family: inherit; font-size: .95rem; padding: 10px 12px; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-sm); background: #fff; min-width: 170px; }

.ds-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 26px; }
.ds-card { position: relative; background: #fff; border: 1px solid var(--ds-border); border-radius: var(--ds-radius); overflow: hidden; box-shadow: var(--ds-shadow); transition: transform .18s ease, box-shadow .18s ease; }
.ds-card:hover { transform: translateY(-3px); box-shadow: var(--ds-shadow-lg); }
.ds-card img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.ds-card a { display: block; color: inherit; padding-bottom: 14px; }
.ds-card h3 { padding: 14px 16px 4px; margin: 0; font-size: 1.05rem; }
.ds-card-meta { padding: 0 16px; margin: 0; font-size: .82rem; color: var(--ds-muted); }
.ds-card-price { padding: 8px 16px 0; margin: 0; font-weight: 700; color: var(--ds-primary); }
.ds-fav { position: absolute; top: 10px; right: 10px; z-index: 2; width: 38px; height: 38px; border-radius: 50%; border: none; background: rgba(255,255,255,.92); color: var(--ds-muted); font-size: 1.2rem; cursor: pointer; box-shadow: var(--ds-shadow); }
.ds-fav.active { color: #e11d48; }

.ds-pagination { display: flex; justify-content: center; align-items: center; gap: 22px; margin-top: 40px; }
.ds-pagination span { color: var(--ds-muted); font-size: .9rem; }

/* ==========================================================================
   Property page
   ========================================================================== */
.ds-property { max-width: var(--ds-container-wide); margin: 0 auto; padding: 34px var(--ds-gutter) 80px; }
.ds-prop-title h1 { margin-bottom: 4px; }
.ds-prop-location { color: var(--ds-muted); margin-bottom: 20px; }
.ds-gallery-hero { width: 100%; aspect-ratio: 1448 / 710; object-fit: cover; border-radius: var(--ds-radius); box-shadow: var(--ds-shadow); }
.ds-gallery-thumbs { display: flex; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
.ds-gallery-thumbs button { border: 2px solid transparent; border-radius: var(--ds-radius-sm); overflow: hidden; padding: 0; cursor: pointer; background: none; width: 110px; }
.ds-gallery-thumbs button:hover { border-color: var(--ds-primary); }
.ds-gallery-thumbs img { width: 100%; height: 74px; object-fit: cover; }
.ds-gallery-all { display: flex; align-items: center; justify-content: center; background: rgba(6,90,96,.85); color: #fff; font-weight: 700; font-size: 1rem; width: 110px; height: 74px; }

.ds-prop-columns { display: grid; grid-template-columns: minmax(0, 1fr) 350px; gap: 44px; margin-top: 34px; }
@media (max-width: 960px) { .ds-prop-columns { grid-template-columns: 1fr; } }
.ds-prop-facts { list-style: none; padding: 0; margin: 0 0 24px; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px 22px; font-size: .95rem; }
.ds-prop-description { color: var(--ds-text); overflow-wrap: break-word; }
.ds-amenities { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px 18px; }
.ds-amenities li { padding: 8px 0 8px 26px; border-bottom: 1px dashed var(--ds-border); position: relative; font-size: .93rem; }
.ds-amenities li::before { content: ''; position: absolute; left: 4px; top: 13px; width: 7px; height: 7px; border-radius: 50%; background: var(--ds-primary); }

.ds-prop-side { display: flex; flex-direction: column; gap: 22px; }
.ds-book-card { position: sticky; top: calc(var(--ds-header-h) + 14px); background: #fff; border: 1px solid var(--ds-border); border-radius: var(--ds-radius); box-shadow: var(--ds-shadow-lg); padding: 22px; }
.ds-book-dates { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; }
.ds-book-dates input { flex: 1; min-width: 0; font-family: inherit; font-size: .92rem; padding: 11px 10px; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-sm); cursor: pointer; text-align: center; color: var(--ds-text); }
.ds-book-dates input::placeholder { color: #94a3b8; }
.ds-book-dates span { color: var(--ds-muted); }
.ds-book-btn { width: 100%; text-align: center; font-size: 1.05rem; padding: 15px; }
.ds-book-price { font-size: 1.35rem; font-weight: 700; color: var(--ds-primary); margin: 0 0 4px; }
.ds-book-hint { font-size: .84rem; color: var(--ds-muted); margin: 12px 0 0; text-align: center; }
.ds-map { height: 260px; border-radius: var(--ds-radius); overflow: hidden; border: 1px solid var(--ds-border); background: var(--ds-bg-soft); }

/* the live property page has no separate availability-calendar section */

/* ==========================================================================
   Date-range picker / calendar
   ========================================================================== */
.ds-dp { position: absolute; z-index: 60; background: #fff; border: 1px solid var(--ds-border); border-radius: var(--ds-radius); box-shadow: var(--ds-shadow-lg); padding: 16px; width: min(680px, calc(100vw - 24px)); }
@media (max-width: 640px) { .ds-dp { position: fixed; left: 0; right: 0; bottom: 0; top: auto; width: 100%; border-radius: 16px 16px 0 0; max-height: 82vh; overflow: auto; } }
.ds-dp-months { display: flex; gap: 30px; flex-wrap: wrap; }
@media (max-width: 640px) { .ds-dp-months { flex-direction: column; gap: 18px; } }
.ds-dp-month { width: 295px; }
.ds-dp-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; font-weight: 600; }
.ds-dp-nav { background: none; border: 1px solid var(--ds-border); border-radius: 6px; width: 32px; height: 32px; cursor: pointer; color: var(--ds-primary); font-size: 1rem; line-height: 1; }
.ds-dp-nav:disabled { opacity: .35; cursor: default; }
.ds-dp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; font-size: .8rem; }
.ds-dp-grid .dow { color: var(--ds-muted); font-weight: 600; padding: 6px 0; }
.ds-dp-grid .day { padding: 0; height: 36px; display: flex; align-items: center; justify-content: center; border: none; background: none; border-radius: 6px; cursor: pointer; font-family: inherit; font-size: .82rem; color: var(--ds-text); }
.ds-dp-grid .day:hover { background: var(--ds-bg-soft); }
.ds-dp-grid .day.empty { cursor: default; }
.ds-dp-grid .day.booked { color: #cbd5e1; text-decoration: line-through; cursor: not-allowed; background: repeating-linear-gradient(45deg, #f8fafc, #f8fafc 4px, #eef2f7 4px, #eef2f7 8px); }
.ds-dp-grid .day.in-range { background: rgba(6,90,96,.12); border-radius: 0; }
.ds-dp-grid .day.selected { background: var(--ds-primary); color: #fff; font-weight: 700; }
.ds-dp-grid .day.today { outline: 1.5px solid var(--ds-accent); }
.ds-dp-actions { display: flex; justify-content: space-between; align-items: center; margin-top: 12px; gap: 10px; }
.ds-dp-hint { font-size: .82rem; color: var(--ds-muted); }
.ds-dp-hint.warn { color: #b45309; }

.ds-cal-month { min-width: 295px; border: 1px solid var(--ds-border); border-radius: var(--ds-radius); padding: 14px; }
.ds-cal-month h4 { margin: 0 0 10px; text-align: center; font-size: .95rem; }

/* ==========================================================================
   Lightbox
   ========================================================================== */
.ds-lightbox { position: fixed; inset: 0; z-index: 300; background: rgba(10, 15, 20, .92); display: flex; align-items: center; justify-content: center; }
.ds-lightbox img { max-width: 92vw; max-height: 86vh; border-radius: var(--ds-radius-sm); }
.ds-lightbox button { position: absolute; top: 18px; right: 22px; background: none; border: none; color: #fff; font-size: 2.4rem; cursor: pointer; line-height: 1; }
.ds-lightbox .ds-lb-nav { position: absolute; top: 50%; transform: translateY(-50%); font-size: 2.6rem; color: #fff; background: none; border: none; cursor: pointer; padding: 20px; }
.ds-lightbox .ds-lb-prev { left: 10px; }
.ds-lightbox .ds-lb-next { right: 10px; }

/* ==========================================================================
   Footer
   ========================================================================== */
.ds-footer { background: var(--ds-primary-dark); color: #dbe7e8; margin-top: 60px; }
.ds-footer-inner { max-width: var(--ds-container-wide); margin: 0 auto; padding: 46px var(--ds-gutter) 26px; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 34px; }
@media (max-width: 800px) { .ds-footer-inner { grid-template-columns: 1fr; } }
.ds-footer a { color: #fff; }
.ds-footer a:hover { color: #9fd4d8; }
.ds-footer ul { list-style: none; margin: 0; padding: 0; }
.ds-footer-menu li { padding: 5px 0; font-size: .93rem; }
.ds-company { font-size: .93rem; line-height: 1.9; margin: 0; }
.ds-footer-legal ul { margin-bottom: 16px; }
.ds-socials { display: flex; gap: 14px; }
.ds-socials a { color: #bcd9db; }
.ds-socials a:hover { color: #fff; }
.ds-copyright { border-top: 1px solid rgba(255,255,255,.14); text-align: center; font-size: .82rem; padding: 16px; color: #9fc3c6; }

/* ==========================================================================
   Floating widgets / cookie
   ========================================================================== */
/* No-JS fallback for the Chaty widget (see src/Chaty.php): with JavaScript on,
   Chaty renders its own floating icon and this markup is never in the DOM. */
.ds-whatsapp { position: fixed; right: 20px; bottom: 20px; z-index: 120; width: 58px; height: 58px; border-radius: 50%; background: var(--ds-whatsapp); color: #053d10; display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 22px rgba(0,0,0,.24); transition: transform .18s ease; }
.ds-whatsapp:hover { transform: scale(1.08); color: #053d10; }

.ds-cookie { position: fixed; left: 50%; transform: translateX(-50%); bottom: 18px; z-index: 200; background: #fff; border: 1px solid var(--ds-border); border-radius: var(--ds-radius); box-shadow: var(--ds-shadow-lg); padding: 18px 22px; max-width: min(560px, calc(100vw - 32px)); }
.ds-cookie p { margin: 0 0 12px; font-size: .9rem; }
.ds-cookie-actions { display: flex; gap: 10px; justify-content: flex-end; }

/* forms + misc */
.ds-form-card { max-width: 640px; margin: 30px auto; background: #fff; border: 1px solid var(--ds-border); border-radius: var(--ds-radius); box-shadow: var(--ds-shadow); padding: 28px; }
.ds-form label { display: flex; flex-direction: column; gap: 5px; font-size: .85rem; font-weight: 600; color: var(--ds-muted); margin-bottom: 14px; }
.ds-form input, .ds-form textarea, .ds-form select { font-family: inherit; font-size: .95rem; padding: 11px 12px; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-sm); width: 100%; color: var(--ds-text); }
.ds-form input::placeholder, .ds-form textarea::placeholder { color: #94a3b8; }
.ds-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 560px) { .ds-form-row { grid-template-columns: 1fr; } }
.ds-form-check { flex-direction: row !important; align-items: flex-start; gap: 10px; font-weight: 400; color: var(--ds-text); }
.ds-form-check input { width: auto; margin-top: 3px; }
.ds-form input[type="file"] { padding: 9px 12px; background: #fff; }
.ds-honeypot { position: absolute; left: -9999px; }
.ds-form-success { max-width: 640px; margin: 30px auto; background: #ecfdf5; border: 1px solid #a7f3d0; border-radius: var(--ds-radius); padding: 18px; color: #065f46; }
.ds-404, .ds-confirmation { max-width: 640px; margin: 0 auto; padding: 80px var(--ds-gutter); text-align: center; }
.ds-page { font-size: 1rem; }
.ds-page img { border-radius: var(--ds-radius); }

/* rotating hero background (background_slideshow) */
.pc-sec[data-bgslideshow] { overflow: hidden; }
.pc-sec[data-bgslideshow] > .pc-bglayer { position: absolute !important; inset: 0 !important; z-index: 0 !important; background-size: cover; background-position: center; opacity: 0; transition: opacity 1.4s ease; }
.pc-sec[data-bgslideshow] .pc-bglayer.on { opacity: 1; }


/* ==========================================================================
   Property page additions (gallery pill, chips, quick nav, places, policies,
   reviews, related, booking sidebar extras)
   ========================================================================== */
.ds-prop-chips { display: flex; flex-wrap: wrap; gap: 6px 10px; margin: 6px 0 20px; color: var(--ds-muted); font-size: .95rem; }
.ds-prop-chips span + span::before { content: '\2022'; margin-right: 10px; color: var(--ds-border); }

.ds-gallery-frame { position: relative; }
.ds-gallery-viewall { position: absolute; right: 16px; bottom: 12px; height: 40px; padding: 0 20px; border: 0; border-radius: 5px; background: rgba(255,255,255,.94); color: var(--ds-primary); font-family: inherit; font-weight: 600; font-size: .88rem; cursor: pointer; box-shadow: var(--ds-shadow); }
.ds-gallery-viewall:hover { background: #fff; }

.ds-prop-nav { margin: 22px 0 0; border-top: 1px solid var(--ds-border); border-bottom: 1px solid var(--ds-border); }
.ds-prop-nav ul { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 22px; margin: 0; padding: 10px 0; }
.ds-prop-nav a { font-size: .82rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--ds-text); padding: 4px 0; border-bottom: 2px solid transparent; }
.ds-prop-nav a:hover { color: var(--ds-primary); border-bottom-color: var(--ds-primary); }

.ds-prop-main section { margin-bottom: 44px; }
.ds-prop-main section:last-child { margin-bottom: 0; }
.ds-prop-main h2 { margin-bottom: 18px; }
.ds-prop-main h3 { font-size: 1rem; font-weight: 600; font-family: var(--ds-font); margin: 0 0 4px; }

.ds-places { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 16px; }
.ds-place { border: 1px solid var(--ds-border); border-radius: var(--ds-radius-sm); padding: 16px; background: #fff; }
.ds-place-bed { margin: 0 0 2px; font-weight: 600; color: var(--ds-text); }

.ds-amenity-group { margin-bottom: 22px; }
.ds-amenities { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }

.ds-map-wide { height: 520px; }
@media (max-width: 767px) { .ds-map-wide { height: 320px; } }

.ds-prop-location, .ds-prop-policies, .ds-prop-reviews, .ds-related { margin-top: 48px; }
.ds-policy { margin-bottom: 18px; }
.ds-policy h3 { font-size: 1rem; }
.ds-review-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 18px; }
.ds-review { border: 1px solid var(--ds-border); border-radius: var(--ds-radius-sm); padding: 16px 18px; background: #fff; }
.ds-review-head { display: flex; justify-content: space-between; gap: 10px; margin: 0 0 6px; }
.ds-review-stars { color: #f5a623; letter-spacing: 1px; }
.ds-reviews-count { color: var(--ds-muted); margin-top: -10px; }

.ds-book-guests { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: .9rem; font-weight: 600; color: var(--ds-muted); margin-bottom: 12px; }
.ds-book-guests input { width: 84px; font-family: inherit; font-size: .95rem; padding: 9px 10px; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-sm); }
.ds-book-fees { list-style: none; padding: 10px 0 0; margin: 10px 0 0; border-top: 1px solid var(--ds-border); font-size: .85rem; color: var(--ds-muted); }
.ds-book-note { font-size: .78rem; color: var(--ds-muted); margin: 8px 0 0; text-align: center; }

.ds-related .ds-cards { grid-template-columns: repeat(auto-fill, minmax(235px, 1fr)); gap: 18px; }
.ds-related .ds-card h3 { font-size: .98rem; }

/* measured text alignment also positions block-level images in a widget wrapper */
.pc-item[style*="--p-ta:end"], .pc-item[style*="--p-ta: right"] { display: flex; justify-content: flex-end; }
.pc-item[style*="--p-ta:center"] { display: flex; justify-content: center; }

/* ==========================================================================
   Legibility for copy sitting directly on a photo (operator request):
   a frosted card behind the copy COLUMN of split/band photo sections, and a
   plain text shadow for hero copy that sits on the photo itself.
   ========================================================================== */
.pc-photo > .pc-wrap > .pc-col {
  background: rgba(12, 22, 30, .38);
  -webkit-backdrop-filter: blur(7px) saturate(1.15);
  backdrop-filter: blur(7px) saturate(1.15);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 16px;
  padding: clamp(20px, 2.6vw, 34px);
  box-shadow: 0 10px 34px rgba(0, 0, 0, .18);
}
.pc-photo > .pc-wrap > .pc-col.pc-spacer { background: none; border: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; padding: 0; }
.pc-photo > .pc-wrap > .pc-col .pc-btn { margin-top: 6px; }
@media (max-width: 1024px) {
  .pc-photo > .pc-wrap > .pc-col { padding: clamp(18px, 3.4vw, 26px); }
}
/* Hero copy (the wrap holds the text widgets directly) keeps the white text the
   pages measure; text-shadow inherits, so one rule on the wrap covers every
   heading and paragraph inside it. Recipe picked by measurement (see
   scripts/check-hero-text-shadow.js): a wide even halo plus a soft drop beat the
   old 0 1px 12px shadow on the glyph edge - ring contrast around the strokes
   goes from 1.2:1 (no shadow) to 1.8:1 at p95 and 3.4:1 on average. */
.pc-photo > .pc-wrap:not(:has(> .pc-col)) { text-shadow: 0 0 4px rgba(0, 0, 0, .9), 0 2px 22px rgba(0, 0, 0, .6); }
.pc-photo > .pc-wrap:not(:has(> .pc-col)) > .pc-btn { text-shadow: none; }

/* ==========================================================================
   Photo cards: rounded, separated, no black placeholder while images load
   ========================================================================== */
.pc-banner { border-radius: 12px; }
.pc-banner img { border-radius: 12px; }
.pc-wrap:has(> .pc-col > .pc-banner) { gap: 16px; }
@media (max-width: 1024px) { .pc-wrap:has(> .pc-col > .pc-banner) { gap: 14px; } }
.pc-photo > .pc-wrap:has(> .pc-col > .pc-banner) > .pc-col { background: none; border: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; padding: 0; }

/* the listing filter is a booking search: dates first, and they wrap nicely */
.ds-filters input[type="date"] { font-family: inherit; min-width: 160px; cursor: pointer; }
.ds-count-dates { display: block; font-size: .9rem; color: var(--ds-text); font-weight: 600; }
.ds-empty { text-align: center; padding: 60px 20px; border: 1px dashed var(--ds-border); border-radius: var(--ds-radius); background: var(--ds-bg-soft); }
.ds-empty h2 { margin-bottom: 8px; }
.ds-empty p { color: var(--ds-muted); }