/* ==========================================================================
   Villa stay page (sections/t-villa.liquid) — mobile first.
   Phones: immersive gallery, content sheet, sticky price bar, booking sheet.
   Desktop: gallery mosaic, content left, sticky booking card right.
   Gallery, viewer, host and map pieces come from tan-product.css.
   ========================================================================== */
.villa__crumbs{display:none}
@media (max-width:999px){.villa__gallery .gal__track{aspect-ratio:4/3.3;max-height:62svh}}
.villa__chip i{background:var(--gold)}

/* no z-index here: the booking sheet inside must be able to cover the site header */
.villa__body{position:relative;margin-top:-22px;border-radius:24px 24px 0 0;background:var(--ivory)}
.villa__grid{padding-top:22px;padding-bottom:36px}

/* ---------- Head ---------- */
.vh{padding-bottom:24px;border-bottom:1px solid var(--line)}
.vh__eyebrow{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-ink)}
.vh__title{margin-top:10px}
.vh__name{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(42px,11.5vw,72px);line-height:.95;letter-spacing:-.018em;color:var(--ink)}
.vh__tag{display:block;margin-top:12px;font-size:15.5px;font-weight:600;line-height:1.45;letter-spacing:-.005em;color:var(--ink-2)}
.vh__facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.vh__facts li{display:inline-flex;align-items:center;gap:7px;padding:8px 13px 8px 11px;border-radius:999px;background:var(--white);border:1px solid var(--line-soft);font-size:13px;font-weight:600;color:var(--ink-2)}
.vh__facts svg{width:16px;height:16px;color:var(--gold-lo)}
.vh__facts b{font-weight:800;color:var(--ink)}
.vh__from{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 7px;margin-top:20px;font-size:14px;font-weight:600;color:var(--ink-3)}
.vh__from b{font-size:26px;font-weight:800;letter-spacing:-.02em;color:var(--navy)}
.vh__from em{display:inline-flex;align-items:center;margin-left:4px;padding:4px 10px;border-radius:999px;background:#E3F3E8;color:#14532D;font-style:normal;font-size:12px;font-weight:800;letter-spacing:.01em}

/* ---------- Sections ---------- */
.vsec{padding:32px 0;border-bottom:1px solid var(--line)}
.vsec:last-child{border-bottom:0}
.vsec__h{margin-bottom:18px;font-family:var(--serif);font-weight:500;font-size:31px;line-height:1.08;letter-spacing:-.01em;color:var(--ink)}
.vsec__top{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 14px;margin-bottom:18px}
.vsec__top .vsec__h{margin-bottom:0}
.vsec__sub{font-size:13.5px;font-weight:700;color:var(--ink-3)}

.vhl{padding-top:26px}
.vhl__list{display:grid;gap:20px}
.vhl__item{display:flex;align-items:flex-start;gap:15px}
.vhl__ic{flex-shrink:0;width:46px;height:46px;border-radius:15px;display:grid;place-items:center;background:var(--navy);color:var(--gold-hi)}
.vhl__ic svg{width:22px;height:22px}
.vhl__item b{display:block;font-size:15.5px;font-weight:800;line-height:1.3;color:var(--ink)}
.vhl__item small{display:block;margin-top:3px;font-size:14px;line-height:1.55;color:var(--ink-3)}

.vabout__txt{font-size:15.5px;line-height:1.78;color:var(--ink-2)}
.vabout__txt p+p{margin-top:14px}

.vsleep__track{display:flex;gap:12px;margin:0 calc(-1 * var(--gutter));padding:0 var(--gutter) 2px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:var(--gutter);scrollbar-width:none;overscroll-behavior-x:contain}
.vsleep__track::-webkit-scrollbar{display:none}
.vsleep__item{flex:0 0 64%;aspect-ratio:4/3;padding:0;border:0;border-radius:18px;overflow:hidden;background:var(--sand);scroll-snap-align:start;cursor:zoom-in}
.vsleep__item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .9s var(--ease)}

.vam__list{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px}
.vam__list li{display:flex;align-items:center;gap:11px;font-size:14.5px;font-weight:600;line-height:1.35;color:var(--ink-2)}
.vam__list svg{width:21px;height:21px;flex-shrink:0;color:var(--ink)}

.vprice__list{border:1px solid var(--line);border-radius:18px;background:var(--white);overflow:hidden}
.vprice__list div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 16px;border-top:1px solid var(--line-soft)}
.vprice__list div:first-child{border-top:0}
.vprice__list dt{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:var(--ink-2)}
.vprice__list dt svg{width:18px;height:18px;flex-shrink:0;color:var(--gold-lo)}
.vprice__list dd{font-size:16px;font-weight:800;letter-spacing:-.01em;color:var(--navy);white-space:nowrap;font-variant-numeric:tabular-nums}
.vprice__list dd small{font-size:12.5px;font-weight:600;color:var(--ink-3)}
.vprice__long{margin-top:14px;padding:14px 16px;border-radius:16px;background:var(--gold-wash);font-size:14px;line-height:1.55;color:var(--ink-2)}
.vprice__long b{display:block;font-size:14.5px;color:var(--ink)}
.vprice__btn{width:100%;margin-top:18px}
.vprice__btn svg,.vbook__go svg,.vcta .btn svg{width:19px;height:19px}

.vloc__travel{display:grid;gap:10px;margin-top:16px}
.vloc__travel li{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--ink-2)}
.vloc__travel svg{width:17px;height:17px;flex-shrink:0;color:var(--gold-lo)}

.vgood__list{display:grid;gap:18px}
.vgood__list li{display:flex;align-items:flex-start;gap:13px}
.vgood__list svg{width:21px;height:21px;flex-shrink:0;margin-top:1px;color:var(--ink)}
.vgood__list b{display:block;font-size:15px;font-weight:800;color:var(--ink)}
.vgood__list small{display:block;margin-top:2px;font-size:14px;line-height:1.55;color:var(--ink-3)}

.vhost__card{padding:18px;border-radius:20px;background:var(--white);border:1px solid var(--line-soft);box-shadow:0 1px 2px rgba(12,30,48,.04),0 14px 34px -22px rgba(12,30,48,.3)}
.vhost__card .pdp-agent img{width:56px;height:56px}
.vhost__txt{margin-top:14px;font-size:14.5px;line-height:1.65;color:var(--ink-2)}
.vhost__btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.vhost__btns .btn{min-height:48px;padding:10px 14px;font-size:14.5px}
.vhost__btns svg{width:18px;height:18px}

.vfaq .faq{gap:10px}
.vfaq .faq summary{padding:17px 18px;font-size:15.5px}
.vfaq .faq__a{padding:0 18px 18px;font-size:14.5px;line-height:1.65;color:var(--ink-2)}

/* ---------- Final call to action ---------- */
.vcta{position:relative;isolation:isolate;overflow:hidden;color:#fff;background:var(--night);text-align:center}
.vcta__bg{position:absolute;inset:0;z-index:-2}
.vcta__bg img{width:100%;height:100%;object-fit:cover}
.vcta::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,18,30,.38),rgba(7,18,30,.86))}
.vcta__in{padding-top:76px;padding-bottom:84px}
.vcta .vh__eyebrow{color:var(--gold-hi)}
.vcta__h{margin:12px auto 0;max-width:14ch;font-family:var(--serif);font-weight:500;font-size:clamp(38px,9.5vw,66px);line-height:1;letter-spacing:-.015em}
.vcta__p{margin:16px auto 28px;max-width:40ch;font-size:15px;line-height:1.6;color:rgba(255,255,255,.86)}

/* ---------- Phone price bar (replaces the site's quick-contact bar here) ---------- */
body:has(.vbar) .mbar,body:has(.vbar) .fab{display:none}
.vbar{position:fixed;left:0;right:0;bottom:0;z-index:96;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--line);box-shadow:0 -12px 30px -18px rgba(12,30,48,.35)}
.vbar__price{min-width:0}
.vbar__price b{display:block;font-size:17.5px;font-weight:800;letter-spacing:-.01em;color:var(--navy);font-variant-numeric:tabular-nums}
.vbar__price span{display:block;font-size:12.5px;font-weight:600;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vbar__btn{flex-shrink:0;min-height:50px;padding:12px 24px;border-radius:14px}
.vbar__btn.is-ready{--bg:var(--wa)}

/* ---------- Booking: phones = full-screen sheet ---------- */
.vbook{position:fixed;inset:0;z-index:310;display:flex;flex-direction:column;background:#fff;transform:translateY(100%);visibility:hidden;transition:transform .45s var(--ease),visibility 0s linear .45s}
.vbook.is-open{transform:none;visibility:visible;transition:transform .45s var(--ease)}
.vbook__top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line-soft)}
.vbook__title{font-size:17px;font-weight:800;color:var(--ink)}
.vbook__x{width:40px;height:40px;border-radius:999px;display:grid;place-items:center;border:1px solid var(--line);color:var(--ink)}
.vbook__x svg{width:18px;height:18px}
.vbook__body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:16px}
.vbook__foot{padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line-soft);background:#fff}
.vbook__price p{font-size:14px;font-weight:600;color:var(--ink-3)}
.vbook__price b{font-size:23px;font-weight:800;letter-spacing:-.02em;color:var(--navy);font-variant-numeric:tabular-nums}
.vbook__price small{display:block;margin-top:2px;font-size:12.5px;font-weight:700;color:var(--gold-ink)}
.vbook__dates{display:grid;grid-template-columns:1fr 1fr;margin-top:14px;border:1px solid var(--line);border-radius:14px}
.vbook__date{display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:10px 14px;border-radius:13px;text-align:left;background:transparent;transition:box-shadow .2s}
.vbook__date+.vbook__date{border-left:1px solid var(--line);border-radius:0 13px 13px 0}
.vbook__date:first-child{border-radius:13px 0 0 13px}
.vbook__date small{font-size:10.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--ink)}
.vbook__date b{font-size:14.5px;font-weight:600;color:var(--ink-3)}
.vbook__date.has b{color:var(--ink)}
.vbook__date.is-active{box-shadow:inset 0 0 0 2px var(--ink)}

/* calendar */
.vcal{margin-top:16px}
.vcal__head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.vcal__month{font-size:15.5px;font-weight:800;color:var(--ink)}
.vcal__nav{width:38px;height:38px;border-radius:999px;display:grid;place-items:center;border:1px solid var(--line);color:var(--ink);transition:background .2s,opacity .2s}
.vcal__nav:disabled{opacity:.28;cursor:default}
.vcal__nav svg{width:16px;height:16px}
.vcal__dow,.vcal__grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.vcal__dow span{padding:6px 0;text-align:center;font-size:11.5px;font-weight:700;color:var(--ink-3)}
.vcal__grid{row-gap:3px}
.vcal__mt{grid-column:1/-1;margin:16px 0 6px;padding-top:14px;border-top:1px solid var(--line-soft);text-align:center;font-size:15.5px;font-weight:800;color:var(--ink)}
.vcal__d{position:relative;height:52px;padding:0;border:0;background:transparent;color:var(--ink);cursor:pointer}
.vcal__d .c{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:48px;height:100%;margin:0 auto;border-radius:14px;transition:background .15s,box-shadow .15s}
.vcal__d .n{font-size:14.5px;font-weight:700;line-height:1.1;font-variant-numeric:tabular-nums}
.vcal__d small{margin-top:2px;font-size:10px;font-weight:700;line-height:1;color:var(--ink-3)}
.vcal__d.is-we small{color:var(--gold-ink)}
.vcal__d.is-today .n{text-decoration:underline;text-underline-offset:3px}
.vcal__d:disabled{color:#B9C0CA;cursor:default}
.vcal__d.is-booked .n{text-decoration:line-through}
.vcal__d.is-range{background:var(--gold-wash)}
.vcal__d.is-start.has-range{background:linear-gradient(90deg,transparent 50%,var(--gold-wash) 50%)}
.vcal__d.is-end:not(.is-start){background:linear-gradient(90deg,var(--gold-wash) 50%,transparent 50%)}
.vcal__d.is-start .c,.vcal__d.is-end .c{background:var(--navy);color:#fff}
.vcal__d.is-start small,.vcal__d.is-end small{color:rgba(255,255,255,.78)}
.vcal__d.is-preview .c{background:var(--ink-2)}
@media (hover:hover){.vcal__d:not(:disabled):hover .c{box-shadow:inset 0 0 0 1.5px var(--ink)}.vcal__nav:not(:disabled):hover{background:var(--ivory)}}
.vcal__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 14px;margin-top:10px}
.vcal__legend{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:12px;font-weight:600;color:var(--ink-3)}
.vcal__legend i{display:inline-block;width:9px;height:9px;border-radius:3px;background:var(--ink-3)}
.vcal__legend i.is-we{margin-left:6px;background:var(--gold)}
.vcal__clear{font-size:13px;font-weight:800;color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.vcal__nojs{font-size:14px;color:var(--ink-2)}

.vbook__guests{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;padding:12px 14px;border:1px solid var(--line);border-radius:14px}
.vbook__guests b{display:block;font-size:14.5px;font-weight:800;color:var(--ink)}
.vbook__guests small{display:block;font-size:12.5px;color:var(--ink-3)}
.vstep{display:flex;align-items:center;gap:12px}
.vstep button{width:36px;height:36px;border-radius:999px;display:grid;place-items:center;border:1px solid var(--line);color:var(--ink);transition:border-color .2s,opacity .2s}
.vstep button:not(:disabled):hover{border-color:var(--ink)}
.vstep button:disabled{opacity:.3;cursor:default}
.vstep svg{width:16px;height:16px}
.vstep output{min-width:3ch;text-align:center;font-size:15.5px;font-weight:800;font-variant-numeric:tabular-nums}

.vbook__sum{display:grid;gap:9px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line-soft);font-size:14px;color:var(--ink-2)}
.vbook__sum p{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.vbook__sum em{font-style:normal;font-size:12px;font-weight:700;color:var(--ink-3)}
.vbook__sum b{font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.vbook__sum .tot{margin-top:4px;padding-top:12px;border-top:1px solid var(--line);font-size:16.5px;font-weight:800;color:var(--ink)}
.vbook__sum .tot b{font-size:19px;font-weight:800;color:var(--navy)}
.vbook__sum .long{display:block;padding:10px 12px;border-radius:12px;background:var(--gold-wash);font-size:13px;color:var(--ink-2)}
.vbook__hint{margin-top:14px;font-size:13.5px;font-weight:700;color:var(--ink-3)}
.vbook [hidden]{display:none!important}
.vbook__go,.vbook__wa{min-height:54px;border-radius:15px;font-size:16px}
.vbook__wa svg{width:20px;height:20px}
.vbook__note{display:flex;align-items:flex-start;gap:8px;margin-top:10px;font-size:12.5px;line-height:1.45;color:var(--ink-3)}
.vbook__note svg{width:15px;height:15px;flex-shrink:0;margin-top:1px;color:var(--gold-lo)}

/* ---------- Desktop ---------- */
@media (min-width:1000px){
  .villa__crumbs{display:flex;max-width:calc(var(--wrap) + var(--gutter)*2);margin:0 auto;padding:18px var(--gutter) 0}
  .villa__gallery .gal__track{height:clamp(380px,min(36vw,58vh),560px)}
  .villa__body{margin-top:0;border-radius:0;background:transparent}
  .villa__grid{display:grid;grid-template-columns:minmax(0,1fr) 384px;grid-template-areas:"head book" "main book";column-gap:clamp(40px,5vw,84px);padding-top:34px;padding-bottom:64px}
  .vh{grid-area:head;padding-bottom:28px}
  .villa__main{grid-area:main}
  .vh__name{font-size:clamp(52px,4.8vw,72px)}
  .vh__tag{font-size:17px}
  .vh__from{display:none}
  .vsec{padding:38px 0}
  .vsec__h{font-size:34px}
  .vhl__list{grid-template-columns:1fr 1fr;gap:24px 30px}
  .vsleep__track{margin:0;padding:0 0 2px;scroll-padding-left:0}
  .vsleep__item{flex-basis:250px}
  .vsleep__item:hover img{transform:scale(1.04)}
  .vam__list{gap:18px 26px}
  .vprice__btn{display:none}
  .vhost__btns{grid-template-columns:auto auto;justify-content:start}
  .vhost__btns .btn{padding:10px 22px}
  .vcta__in{padding-top:110px;padding-bottom:116px}

  .vbook{grid-area:book;position:sticky;top:calc(var(--hdr-h) + 22px);align-self:start;inset:auto;z-index:5;max-height:calc(100vh - var(--hdr-h) - 44px);transform:none;visibility:visible;transition:none;border:1px solid var(--line-soft);border-radius:22px;box-shadow:0 1px 2px rgba(12,30,48,.05),0 26px 54px -30px rgba(12,30,48,.4)}
  .vbook__top{display:none}
  .vbook__body{padding:22px 22px 6px}
  .vbook__foot{padding:12px 22px 20px;border-top:0}
  .vcal{display:none}
  .vcal.is-open{display:block}
  .vcal__d{height:48px}
  .vbar{display:none}
}
@media (prefers-reduced-motion:reduce){.vbook,.vbook.is-open{transition:none}}
