/* ============================================================
   LAS VILLAS DEL SITIO: catalogo (reservar/) y ficha (villa/)
   1 oct 2026, segunda version 3 oct 2026.

   Color del huesped: terracota (--c-cliente). Fondo marfil, secciones arena,
   turquesa solo en acentos chicos. Cada color dice algo:
     verde  = disponible        gris = ocupado
     terracota = tu estadia / la accion de reservar
     turquesa  = "Proximamente" (acento)
   Poppins, sin serifas. Esquinas redondas: tarjetas 14, botones y fotos 10.
   ============================================================ */
:root{
  --vs-libre:#1e8449;        /* disponible */
  --vs-libre-f:#e4f3ea;
  --vs-ocu:#9a9790;          /* ocupado */
  --vs-ocu-f:#e6e3de;
  --vs-terra-f:#f6e3db;      /* terracota suave: la estadia dentro del rango */
  --vs-r-tarj:14px;
  --vs-r-btn:10px;
}

/* ---------- EL CATALOGO ---------- */
.vs-cab{padding:56px 0 18px}
.vs-cab h1{font-weight:300;font-size:clamp(34px,4.6vw,58px);line-height:1.04;letter-spacing:-.025em;margin:0 0 12px}
.vs-cab h1 b{font-weight:600}
.vs-cab p{margin:0;max-width:620px;color:var(--gris);font-size:16px;font-weight:300}
.vs-filtros{margin:28px 0 0}

/* La barra de reserva */
.vs-barra{display:grid;grid-template-columns:1.1fr 1.1fr .8fr .7fr auto;gap:0;background:#fff;border:1px solid var(--linea);border-radius:var(--vs-r-tarj);
  box-shadow:0 24px 50px -36px rgba(11,12,13,.5);overflow:hidden}
.vs-c{display:flex;flex-direction:column;gap:3px;padding:12px 20px;min-width:0;cursor:pointer;position:relative}
.vs-c + .vs-c{box-shadow:-1px 0 0 var(--linea)}
.vs-c span{font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--gris)}
.vs-c input,.vs-c select{border:0;background:transparent;font:inherit;font-size:15px;color:var(--tinta);padding:0;outline:none;width:100%;min-width:0;cursor:pointer}
.vs-c:focus-within{background:var(--marfil)}
.vs-ir{border:0;cursor:pointer;background:var(--c-cliente);color:#fff;font:inherit;font-size:12.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:0 34px;transition:filter .2s}
.vs-ir:hover{filter:brightness(1.08)}
@media (max-width:860px){
  .vs-barra{grid-template-columns:1fr 1fr}
  .vs-c{padding:10px 16px}
  .vs-c:nth-child(3){box-shadow:0 -1px 0 var(--linea)}
  .vs-c:nth-child(4){box-shadow:-1px -1px 0 var(--linea)}
  .vs-c:nth-child(3),.vs-c:nth-child(4){border-top:0}
  .vs-ir{grid-column:1/-1;padding:15px}
}

/* Filtros */
.vs-fila-f{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;margin:18px 0 0}
.vs-rot{font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--gris);margin-right:2px}
.vs-buscar{font:inherit;font-size:14px;color:var(--tinta);background:#fff;border:1px solid var(--linea);border-radius:var(--vs-r-btn);padding:10px 14px;outline:none;min-width:0;flex:1 1 200px;max-width:260px}
.vs-buscar:focus,.vs-sel select:focus{border-color:var(--c-cliente)}
.vs-hab{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.vs-chip{font:inherit;font-size:13.5px;font-weight:500;color:var(--tinta);background:#fff;border:1px solid var(--linea);border-radius:var(--vs-r-btn);padding:8px 14px;cursor:pointer;
  display:inline-flex;align-items:center;gap:8px;transition:border-color .15s,background .15s}
.vs-chip:hover{border-color:var(--c-cliente)}
.vs-chip.on{background:var(--c-cliente);border-color:var(--c-cliente);color:#fff}
.vs-chip svg{width:18px;height:18px;flex:none}
.vs-sel{display:flex;align-items:center;gap:8px}
.vs-sel select{font:inherit;font-size:13.5px;color:var(--tinta);background:#fff;border:1px solid var(--linea);border-radius:var(--vs-r-btn);padding:8px 12px;outline:none;max-width:210px}
.vs-mas{font:inherit;font-size:13.5px;font-weight:500;color:var(--tinta);background:#fff;border:1px solid var(--linea);border-radius:var(--vs-r-btn);padding:8px 14px;cursor:pointer;
  display:inline-flex;align-items:center;gap:8px}
.vs-mas svg{width:18px;height:18px}
.vs-mas .vs-flecha{width:16px;height:16px;transition:transform .2s}
.vs-mas.on .vs-flecha{transform:rotate(180deg)}
.vs-mas:hover,.vs-mas.on{border-color:var(--c-cliente)}
.vs-panel{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0;padding:16px;background:var(--arena);border-radius:var(--vs-r-tarj)}
.vs-panel[hidden]{display:none}
.vs-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:18px 0 0}
.vs-cuenta{font-size:13px;color:var(--gris)}
.vs-limpiar{font:inherit;font-size:13px;font-weight:500;color:var(--c-cliente);background:none;border:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:0}
.vs-limpiar[hidden],.vs-nota[hidden]{display:none}
.vs-nota{margin:8px 0 0;font-size:13px;color:var(--gris);padding:10px 14px;background:var(--arena);border-radius:var(--vs-r-btn)}

/* Tarjetas */
.vs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:26px;padding:18px 0 70px}
.vs-tarj{display:flex;flex-direction:column;text-decoration:none;color:inherit;background:#fff;border-radius:var(--vs-r-tarj);overflow:hidden;
  box-shadow:0 1px 0 rgba(11,12,13,.05),0 22px 40px -30px rgba(11,12,13,.45);transition:transform .25s,box-shadow .25s}
a.vs-tarj:hover{transform:translateY(-4px);box-shadow:0 1px 0 rgba(11,12,13,.05),0 30px 50px -28px rgba(11,12,13,.55)}
.vs-foto{position:relative;aspect-ratio:4/3;background:var(--arena);overflow:hidden;margin:8px 8px 0;border-radius:10px}
.vs-foto img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
a.vs-tarj:hover .vs-foto img{transform:scale(1.04)}
.vs-no .vs-foto img{filter:grayscale(.85) brightness(.95)}
.vs-sinfoto{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--c-cliente);background:linear-gradient(135deg,var(--arena),#f6ece3)}
.vs-sinfoto svg{width:54px;height:54px;opacity:.8}
.vs-sello{position:absolute;left:10px;bottom:10px;font-size:11.5px;font-weight:600;letter-spacing:.04em;padding:7px 12px;border-radius:8px;background:#fff;color:var(--tinta);box-shadow:0 8px 20px -10px rgba(0,0,0,.5)}
.vs-sello.libre{background:var(--vs-libre);color:#fff}
.vs-sello.ocupada{background:#6f6d68;color:#fff}
.vs-sello.consulta{background:#fff;color:var(--tinta)}
.vs-sello.prox{background:#fff;color:var(--brand-d);border:1px solid var(--brand);box-shadow:none}
.vs-cuerpo{padding:16px 22px 22px;display:flex;flex-direction:column;flex:1}
.vs-fila{display:flex;justify-content:space-between;gap:10px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;color:var(--c-cliente)}
.vs-lugar{color:var(--gris);text-align:right}
.vs-cuerpo h3{font-weight:500;font-size:19px;line-height:1.28;letter-spacing:-.01em;margin:8px 0 4px}
.vs-sub{margin:0 0 8px;font-size:13.5px;font-weight:300;color:var(--gris)}
.vs-rap{margin:0;font-size:13px;color:var(--gris)}
.vs-datos{list-style:none;display:flex;gap:16px;margin:8px 0 0;padding:0;font-size:13px;color:var(--gris)}
.vs-datos li{display:flex;align-items:center;gap:6px}
.vs-datos svg{width:18px;height:18px;color:var(--tinta);opacity:.8}
.vs-datos span{color:var(--tinta);font-weight:600}
.vs-datos i{font-style:normal}
.vs-precio{margin:auto 0 0;padding-top:14px;font-size:14px;color:var(--tinta)}
.vs-precio b{font-weight:600;font-size:17px}
.vs-cons{font-size:14px !important;font-weight:500 !important;color:var(--gris)}
.vs-estado{text-align:center;padding:60px 20px 100px;color:var(--gris)}
.vs-estado p{margin:0 0 20px;font-size:17px;font-weight:300}
.vs-ej{position:fixed;left:12px;bottom:12px;z-index:60;font-size:11.5px;font-weight:500;color:var(--tinta);background:#fff;border:1px dashed var(--c-cliente);border-radius:8px;padding:6px 12px;opacity:.92;pointer-events:none}

@media (max-width:1020px){.vs-ej{bottom:74px;left:8px;font-size:10px;padding:3px 8px}}

/* Las villas que vamos a conectar */
.vs-prox-sec{background:var(--arena);padding:0}
.vs-prox-sec:empty{display:none}
.vs-prox-cab{padding:56px 0 6px}
.vs-prox-cab h2{font-weight:300;font-size:clamp(26px,3.2vw,38px);letter-spacing:-.02em;margin:0 0 10px;line-height:1.1}
.vs-prox-cab p{margin:0;max-width:640px;color:var(--gris);font-weight:300}
.vs-grid-prox{padding-bottom:80px}
.vs-prox{background:rgba(255,255,255,.78);box-shadow:none;border:1px dashed #d8cdbd}
.vs-prox .vs-foto{background:var(--marfil)}
.vs-avisame{display:inline-flex;align-items:center;gap:10px;margin-top:14px;padding:12px 18px;border-radius:var(--vs-r-btn);text-decoration:none;color:var(--c-cliente);font-weight:600;font-size:13.5px;border:1px solid var(--c-cliente);align-self:flex-start;transition:background .2s,color .2s}
.vs-avisame:hover{background:var(--c-cliente);color:#fff}
.vs-avisame svg{width:20px;height:20px}
.vs-prox h3{color:var(--tinta)}

/* ---------- LA FICHA ---------- */
.vd{padding-top:30px;padding-bottom:90px}
.vd-ruta{font-size:13px;color:var(--gris);margin:0 0 14px}
.vd-ruta a{text-decoration:none}
.vd-ruta a:hover{text-decoration:underline}
.vd-cab{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;flex-wrap:wrap;margin-bottom:20px}
.vd-cab h1{font-weight:300;font-size:clamp(28px,3.6vw,46px);line-height:1.08;letter-spacing:-.025em;margin:0 0 8px;max-width:820px}
.vd-lugar{display:flex;align-items:center;gap:8px;margin:0;color:var(--gris);font-size:14.5px}
.vd-lugar svg{width:18px;height:18px;flex:none;color:var(--c-cliente)}
.vd-comp{display:inline-flex;align-items:center;gap:8px}
.vd-comp svg{width:18px;height:18px}

.vd-gal{position:relative;display:grid;gap:8px;border-radius:10px;overflow:hidden;height:min(56vw,520px)}
.vd-gal .vd-g{padding:0;border:0;cursor:pointer;background:var(--arena);overflow:hidden;display:block;min-height:0}
.vd-gal .vd-g img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease,filter .3s}
.vd-gal .vd-g:hover img{transform:scale(1.03);filter:brightness(.94)}
.vd-gal.n1{grid-template-columns:1fr}
.vd-gal.n2{grid-template-columns:1fr 1fr}
.vd-gal.n3{grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr}
.vd-gal.n3 .vd-g:first-child{grid-row:1/3}
.vd-gal.n4{grid-template-columns:2fr 1fr 1fr;grid-template-rows:1fr 1fr}
.vd-gal.n4 .vd-g:first-child{grid-row:1/3}
.vd-gal.n4 .vd-g:nth-child(4){grid-column:2/4}
.vd-gal.n5{grid-template-columns:2fr 1fr 1fr;grid-template-rows:1fr 1fr}
.vd-gal.n5 .vd-g:first-child{grid-row:1/3}
.vd-todas{position:absolute;right:16px;bottom:16px;border:0;cursor:pointer;background:rgba(255,255,255,.95);color:var(--tinta);
  font:inherit;font-size:13px;font-weight:500;padding:11px 20px;border-radius:var(--vs-r-btn);box-shadow:0 8px 24px -10px rgba(0,0,0,.5)}
.vd-todas:hover{background:#fff}
.vd-gal-vacia{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:260px;border-radius:10px;background:linear-gradient(135deg,var(--arena),#f6ece3);color:var(--c-cliente)}
.vd-gal-vacia svg{width:56px;height:56px}
.vd-gal-vacia p{margin:0;color:var(--gris);font-size:15px}
@media (max-width:760px){
  .vd-gal{height:auto;aspect-ratio:4/3;grid-template-columns:1fr !important;grid-template-rows:1fr !important}
  .vd-gal .vd-g{display:none}
  .vd-gal .vd-g:first-child{display:block;grid-row:auto !important}
}

.vd-cols{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:56px;margin-top:36px;align-items:start}
.vd-izq{min-width:0}
@media (max-width:1020px){.vd-cols{grid-template-columns:minmax(0,1fr)}.vd-reserva{display:none}}
.vd-subt{font-size:20px;font-weight:300;line-height:1.4;margin:0 0 18px}
.vd-rap{margin:0 0 6px;color:var(--gris);font-size:15px}
.vd-fila-d{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:0 0 22px;padding:0}
.vd-fila-d li{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--linea);border-radius:var(--vs-r-tarj);padding:11px 16px;font-size:14px;color:var(--gris)}
.vd-fila-d svg{width:22px;height:22px;color:var(--c-cliente);flex:none}
.vd-fila-d b{font-weight:600;color:var(--tinta);font-size:16px}
.vd-dest{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin:0 0 6px;padding:0}
.vd-dest li{display:flex;align-items:center;gap:12px;background:var(--arena);border-radius:var(--vs-r-tarj);padding:14px 16px;font-size:14px}
.vd-dest svg{width:26px;height:26px;color:var(--tinta);flex:none}
.vd-dest b{font-weight:500}
.vd-sec{padding:30px 0;border-top:1px solid var(--linea)}
.vd-sec:first-of-type{border-top:0}
.vd-sec h2{font-weight:500;font-size:22px;letter-spacing:-.01em;margin:0 0 16px}
.vd-texto p{margin:0 0 14px;font-size:16px;font-weight:300;line-height:1.75;color:#2c3236}
.vd-texto p:last-child{margin-bottom:0}
.vd-sub-h{font-weight:600;font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--c-cliente);margin:24px 0 10px}

.vd-camas{display:flex;gap:14px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x proximity}
.vd-cama{flex:0 0 220px;scroll-snap-align:start;display:flex;flex-direction:column;gap:2px;border:1px solid var(--linea);border-radius:var(--vs-r-tarj);overflow:hidden;background:#fff;padding:0 0 14px}
.vd-cama img,.vd-cama-ico{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;margin-bottom:10px}
.vd-cama-ico{display:flex;align-items:center;justify-content:center;background:var(--crema-2);color:var(--c-cliente)}
.vd-cama-ico svg{width:34px;height:34px}
.vd-cama b{font-size:14.5px;font-weight:500;padding:0 14px}
.vd-cama span{font-size:13px;color:var(--gris);padding:0 14px}

/* Comodidades por grupo, con su icono */
.vd-grupos{display:grid;grid-template-columns:1fr 1fr;gap:26px 40px}
@media (max-width:760px){.vd-grupos{grid-template-columns:1fr}}
.vd-gt{display:flex;align-items:center;gap:10px;font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--tinta);margin:0 0 14px}
.vd-gi{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;background:#f6e3db;color:var(--c-cliente);flex:none}
.vd-gi svg{width:19px;height:19px}
.vd-com,.vd-normas{list-style:none;margin:0 0 6px;padding:0;display:grid;gap:12px}
.vd-com li,.vd-normas li{display:flex;align-items:center;gap:14px;font-size:15px;font-weight:300}
.vd-ci{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:var(--arena);flex:none}
.vd-ci svg{width:22px;height:22px;color:var(--tinta)}
.vd-normas{grid-template-columns:1fr 1fr;gap:14px 28px}
.vd-normas svg{width:24px;height:24px;flex:none;color:var(--tinta);opacity:.85}
@media (max-width:560px){.vd-normas{grid-template-columns:1fr}}
.vd-sec > .boton-linea{margin-top:18px}

/* Ubicacion */
.vd-ubic{display:flex;align-items:center;gap:14px;margin:0 0 16px}
.vd-ubic-ico{width:46px;height:46px;border-radius:10px;background:#f6e3db;color:var(--c-cliente);display:flex;align-items:center;justify-content:center;flex:none}
.vd-ubic-ico svg{width:24px;height:24px}
.vd-ubic b{display:block;font-weight:600;font-size:17px}
.vd-ubic span{font-size:13.5px;color:var(--gris)}
.vd-mapa{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-size:14px;font-weight:500;color:var(--c-cliente);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}
.vd-mapa svg{width:18px;height:18px}

/* El calendario de la villa */
.vd-cal-carga{color:var(--gris);margin:0}
.vd-cal-nota{background:var(--arena);border-radius:var(--vs-r-tarj);padding:14px 18px;margin:0 0 16px}
.vd-cal-nota p{margin:0;font-size:14.5px;color:#2c3236;font-weight:300}
.cal-cab{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 16px}
.cal-vista{display:inline-flex;background:var(--arena);border-radius:var(--vs-r-btn);padding:3px}
.cal-vista button{font:inherit;font-size:13px;font-weight:500;border:0;background:transparent;color:var(--gris);padding:7px 18px;border-radius:8px;cursor:pointer}
.cal-vista button.on{background:#fff;color:var(--tinta);box-shadow:0 2px 8px -3px rgba(11,12,13,.3)}
.cal-nav{display:flex;align-items:center;gap:12px;font-weight:500;font-size:14.5px}
.cal-nav button{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:1px solid var(--linea);background:#fff;border-radius:var(--vs-r-btn);cursor:pointer;color:var(--tinta)}
.cal-nav button:hover:not(:disabled){border-color:var(--c-cliente);color:var(--c-cliente)}
.cal-nav button:disabled{opacity:.35;cursor:default}
.cal-nav svg{width:18px;height:18px}
.cal-meses{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
@media (min-width:760px){.cal-meses{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px}}
.cal-mes h4{margin:0 0 10px;font-weight:600;font-size:15px}
.cal-sem{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin:0 0 4px}
.cal-sem span{text-align:center;font-size:11px;font-weight:600;letter-spacing:.08em;color:var(--gris)}
.cal-dias{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cd{font:inherit;font-size:14px;font-weight:500;aspect-ratio:1;min-height:38px;border:1px solid transparent;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:background .12s,color .12s}
.cd.lib{background:var(--vs-libre-f);color:#1b6e43}
.cd.lib:hover{background:#cfe9d9}
.cd.ocu{background:var(--vs-ocu-f);color:var(--vs-ocu);text-decoration:line-through;text-decoration-thickness:1px;cursor:default}
.cd.neutro{background:#fff;border-color:var(--linea);color:var(--tinta)}
.cd.neutro:hover{border-color:var(--c-cliente)}
.cd.pas{background:transparent;color:#cfcac2;cursor:default}
.cd.hoy{box-shadow:inset 0 0 0 1.5px var(--tinta)}
.cd.sel{background:var(--vs-terra-f);color:var(--tinta);text-decoration:none;border-color:transparent}
.cd.ini,.cd.fin{background:var(--c-cliente);color:#fff;text-decoration:none}
.cd.fin.ocu{background:var(--c-cliente);color:#fff}
.cal-aviso{min-height:20px;margin:12px 0 0;font-size:13.5px;color:var(--c-cliente);font-weight:500}
.cal-ley{display:flex;flex-wrap:wrap;gap:8px 22px;margin:6px 0 0;font-size:13px;color:var(--gris)}
.cal-ley span{display:inline-flex;align-items:center;gap:8px}
.cal-ley .k{width:16px;height:16px;border-radius:5px;display:inline-block}
.cal-ley .k.lib{background:var(--vs-libre-f);box-shadow:inset 0 0 0 1.5px var(--vs-libre)}
.cal-ley .k.ocu{background:var(--vs-ocu-f);box-shadow:inset 0 0 0 1.5px var(--vs-ocu)}
.cal-ley .k.sel{background:var(--c-cliente)}
.cal-ley .k.neutro{background:#fff;box-shadow:inset 0 0 0 1.5px var(--linea)}
/* Vista de año */
.cal-ano{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media (min-width:640px){.cal-ano{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1000px){.cal-ano{grid-template-columns:repeat(4,1fr)}}
.cal-mini{font:inherit;text-align:left;background:#fff;border:1px solid var(--linea);border-radius:var(--vs-r-tarj);padding:12px 12px 14px;cursor:pointer;transition:border-color .15s}
.cal-mini:hover:not(:disabled){border-color:var(--c-cliente)}
.cal-mini.fuera{opacity:.4;cursor:default}
.cal-mini b{display:block;font-size:13px;font-weight:600;margin:0 0 8px}
.cal-mini-d{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.cal-mini-d em,.cal-mini-d i{aspect-ratio:1;border-radius:3px;display:block}
.cal-mini-d em.lib{background:#b8dcc6}
.cal-mini-d em.ocu{background:#cbc8c1}
.cal-mini-d em.neutro{background:#ece8e0}
.cal-mini-d em.pas{background:transparent;box-shadow:inset 0 0 0 1px #ece8e0}
.cal-mini-d em.sel{background:var(--c-cliente)}

/* Tarjeta de reserva */
.vd-reserva{position:sticky;top:calc(var(--alto-cab,0px) + 16px)}
.vd-res-in{background:#fff;border:1px solid var(--linea);border-radius:var(--vs-r-tarj);padding:24px;box-shadow:0 30px 60px -36px rgba(11,12,13,.5)}
.vd-pr{margin:0 0 16px;font-size:15px;color:var(--gris)}
.vd-pr b{font-size:28px;font-weight:600;color:var(--tinta);letter-spacing:-.02em}
.vd-pr span{font-size:14px}
.vd-campos{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--linea);border-radius:var(--vs-r-btn);overflow:hidden;margin-bottom:12px}
.vd-campos label{display:flex;flex-direction:column;gap:3px;padding:11px 16px;cursor:pointer;min-width:0}
.vd-campos label:nth-child(2n){box-shadow:-1px 0 0 var(--linea)}
.vd-campos label:nth-child(n+3){box-shadow:0 -1px 0 var(--linea)}
.vd-campos label:nth-child(4){box-shadow:-1px -1px 0 var(--linea)}
.vd-campos span{font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--gris)}
.vd-campos input,.vd-campos select{border:0;background:transparent;font:inherit;font-size:15px;color:var(--tinta);padding:0;outline:none;width:100%}
.vd-estado{margin:0 0 12px;font-size:13.5px;font-weight:500;min-height:20px}
.vd-estado.neutro{color:var(--gris);font-weight:400}
.vd-estado.libre{color:var(--vs-libre)}
.vd-estado.ocupada{color:var(--c-cliente)}
.vd-reservar,.vd-consultar{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;text-decoration:none;cursor:pointer;border-radius:var(--vs-r-btn);padding:15px;font:inherit;font-size:12.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;transition:filter .2s,transform .2s,background .2s}
.vd-reservar{background:var(--c-cliente);color:#fff;border:1px solid var(--c-cliente)}
.vd-reservar:hover{filter:brightness(1.07);transform:translateY(-1px)}
.vd-reservar svg{width:20px;height:20px}
.vd-consultar{margin-top:10px;background:#fff;color:var(--c-cliente);border:1px solid var(--c-cliente);letter-spacing:.06em;text-transform:none;font-size:14px}
.vd-consultar:hover{background:var(--c-cliente);color:#fff}
.vd-consultar svg{width:20px;height:20px}
.vd-nota{margin:14px 2px 0;font-size:12.5px;color:var(--gris);text-align:center}
.vd-res-mov{display:none;margin-top:26px;padding:20px;background:#fff;border:1px solid var(--linea);border-radius:var(--vs-r-tarj)}
@media (max-width:1020px){.vd-res-mov{display:block}}
.vd-vacio{padding:90px 0;text-align:center}
.vd-vacio h1{font-weight:300;font-size:34px;margin:0 0 10px}
.vd-vacio p{color:var(--gris);margin:0 0 24px}

/* Ficha de una villa que viene en camino */
.vd-prox{display:grid;grid-template-columns:1.15fr 1fr;gap:44px;align-items:center;margin-top:18px}
@media (max-width:900px){.vd-prox{grid-template-columns:1fr;gap:26px}}
.vd-prox-foto{border-radius:10px;overflow:hidden;aspect-ratio:4/3;background:linear-gradient(135deg,var(--arena),#f6ece3);display:flex;align-items:center;justify-content:center;color:var(--c-cliente)}
.vd-prox-foto svg{width:80px;height:80px;opacity:.75}
.vd-prox-foto img{width:100%;height:100%;object-fit:cover}
.vd-prox-txt{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.vd-prox-txt .vs-sello{position:static}
.vd-prox-txt h1{font-weight:300;font-size:clamp(30px,4vw,48px);line-height:1.06;letter-spacing:-.025em;margin:4px 0 0}
.vd-prox-p{margin:6px 0 10px;font-size:16.5px;font-weight:300;line-height:1.7;color:#2c3236;max-width:520px}
.vd-prox-txt .vd-reservar{width:auto;padding:15px 28px;letter-spacing:.06em;text-transform:none;font-size:14.5px}
.vd-prox-txt .boton-linea{margin-top:2px}

/* La barra de abajo, solo en telefono, donde la tarjeta no cabe */
.vd-barra{display:none}
@media (max-width:1020px){
  .vd-barra{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:14px;
    padding:12px 18px calc(12px + env(safe-area-inset-bottom));background:rgba(255,255,255,.97);backdrop-filter:blur(12px);
    box-shadow:0 -1px 0 var(--linea),0 -18px 30px -24px rgba(11,12,13,.4)}
  .vd-barra b{display:block;font-size:16px;font-weight:600}
  .vd-barra span{font-size:12px;color:var(--gris)}
  .vd-barra .vd-reservar{width:auto;padding:14px 30px}
  .vd{padding-bottom:110px}
}

/* El visor de fotos y la ventana de comodidades */
body.vd-bloq{overflow:hidden}
.vd-visor{position:fixed;inset:0;z-index:300;background:rgba(6,10,12,.94);display:flex;align-items:center;justify-content:center}
.vd-visor figure{margin:0;max-width:min(1200px,92vw);text-align:center}
.vd-visor img{max-width:100%;max-height:82vh;border-radius:10px;display:block;margin:0 auto}
.vd-visor figcaption{color:rgba(255,255,255,.8);font-size:13px;margin-top:12px}
.vv-x,.vv-a{position:absolute;border:0;cursor:pointer;color:#fff;background:rgba(255,255,255,.14);border-radius:10px;width:46px;height:46px;font-size:28px;line-height:1;
  display:flex;align-items:center;justify-content:center;transition:background .2s}
.vv-x:hover,.vv-a:hover{background:rgba(255,255,255,.3)}
.vv-a svg{width:22px;height:22px}
.vv-x{top:18px;right:18px}
.vv-a{left:18px;top:50%;transform:translateY(-50%)}
.vv-s{left:auto;right:18px}
.vd-modal{background:rgba(11,12,13,.6);padding:20px}
.vd-hoja{position:relative;background:var(--marfil);width:min(640px,100%);max-height:88vh;overflow-y:auto;border-radius:var(--vs-r-tarj);padding:34px 30px}
.vd-hoja h2{font-weight:500;font-size:24px;margin:0 0 20px}
.vd-hoja .vd-grupo{margin:0 0 26px}
.vd-x2{top:14px;right:14px;background:rgba(11,12,13,.08);color:var(--tinta)}
.vd-x2:hover{background:rgba(11,12,13,.16)}

/* ============================================================
   FICHA DE VILLA, LINEA DEL PORTAL (4 oct 2026)
   Blanco, turquesa de la marca, tarjetas redondeadas, sin rayas, sin colores ajenos
   (fuera el durazno y el verde). Los datos siguen saliendo del calendario: aqui solo cambia el vestido.
   ============================================================ */
:root{
  --vs-libre:#10b2c2;--vs-libre-f:rgba(16,178,194,0.09);
  --vs-terra-f:rgba(16,178,194,0.27);
  --vs-r-tarj:24px;--vs-r-btn:999px;
}
.vd{padding-top:34px;padding-bottom:110px}
.vd-ruta{font-size:13.5px;margin-bottom:18px}
.vd-cab h1{font-weight:300;font-size:clamp(30px,3.7vw,54px);line-height:1.08;letter-spacing:-.035em;margin:0 0 14px;max-width:1000px;text-wrap:balance}
.vd-lugar{font-size:15.5px}
.vd-comp{background:#f4f8f9;border:0;border-radius:999px;padding:12px 22px;font-weight:600;color:var(--tinta)}
.vd-comp:hover{background:rgba(16,178,194,0.09)}

/* Galeria */
.vd-gal{gap:10px;border-radius:32px;height:min(52vw,560px);box-shadow:0 50px 90px -60px rgba(11,12,13,.55)}
.vd-gal .vd-g img{transition:transform 1.2s cubic-bezier(.2,.7,.2,1),filter .3s}
.vd-gal .vd-g:hover img{transform:scale(1.05);filter:none}
.vd-todas{right:20px;bottom:20px;border-radius:999px;padding:13px 24px;font-weight:600;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}

/* Cuerpo */
.vd-cols{margin-top:48px;gap:72px;grid-template-columns:minmax(0,1fr) 400px}
.vd-subt{font-size:clamp(22px,2.2vw,30px);font-weight:300;letter-spacing:-.02em;line-height:1.35;margin-bottom:26px}
.vd-fila-d{gap:10px}
.vd-fila-d li{background:#f4f8f9;border:0;border-radius:999px;padding:13px 22px;font-size:14.5px}
.vd-fila-d svg{color:var(--res,#10b2c2)}
.vd-dest{gap:12px;margin-bottom:10px}
.vd-dest li{background:#f4f8f9;border-radius:22px;padding:18px 20px;font-size:14.5px}
.vd-dest svg{color:var(--brand-d)}
.vd-sec{border-top:0;padding:46px 0 10px}
.vd-sec h2{font-weight:300;font-size:clamp(26px,2.6vw,36px);letter-spacing:-.025em;margin:0 0 22px}
.vd-texto p{font-size:17px;line-height:1.85;color:#3a4246}
.vd-sub-h{font-size:13px;letter-spacing:0;text-transform:none;font-weight:600;color:var(--brand-d)}

/* Camas */
.vd-cama{border:0;background:#f4f8f9;border-radius:24px;box-shadow:none}
.vd-cama-ico{background:rgba(16,178,194,0.09);color:var(--brand-d)}

/* Comodidades */
.vd-grupos{gap:34px 56px}
.vd-gt{font-size:16px;letter-spacing:0;text-transform:none;font-weight:600;gap:12px;margin-bottom:18px}
.vd-gi{width:40px;height:40px;border-radius:50%;background:rgba(16,178,194,0.09);color:var(--brand-d)}
.vd-gi svg{width:20px;height:20px}
.vd-com{gap:10px}
.vd-ci{width:42px;height:42px;border-radius:50%;background:#f4f8f9}
.vd-ci svg{color:var(--brand-d)}
.vd-com li,.vd-normas li{font-size:15.5px}
.vd-normas svg{color:var(--brand-d);opacity:1}

/* Ubicacion */
.vd-ubic-ico{width:52px;height:52px;border-radius:50%;background:rgba(16,178,194,0.09);color:var(--brand-d)}
.vd-mapa{border-bottom:0;background:#f4f8f9;border-radius:999px;padding:12px 22px;font-weight:600;color:var(--brand-d)}
.vd-mapa:hover{background:rgba(16,178,194,0.09)}

/* Calendario */
.vd-cal-nota{background:#f4f8f9;border-radius:22px}
.cal-vista{background:#f4f8f9;padding:4px}
.cal-vista button{border-radius:999px;padding:9px 20px}
.cal-nav button{border:0;background:rgba(16,178,194,0.09);color:var(--brand-d);border-radius:50%;width:40px;height:40px}
.cal-nav button:hover:not(:disabled){background:var(--res,#10b2c2);color:#fff;border:0}
.cal-mes h4{font-size:16px;font-weight:600}
.cd{border-radius:50%;min-height:42px;font-weight:500}
.cd.lib{background:var(--vs-libre-f);color:var(--brand-d)}
.cd.lib:hover{background:rgba(16,178,194,0.27)}
.cd.ocu{background:#f1f3f4;color:#a3abae}
.cd.neutro{border-color:#e6eaec}
.cd.hoy{box-shadow:inset 0 0 0 1.5px var(--res,#10b2c2)}
.cd.sel{background:rgba(16,178,194,0.27);border-radius:6px}
.cd.ini,.cd.fin{background:var(--res,#10b2c2);color:#fff;border-radius:50%}
.cal-aviso{color:var(--brand-d)}
.cal-ley .k.lib{background:var(--vs-libre-f);box-shadow:none}
.cal-ley .k.ocu{background:#f1f3f4;box-shadow:none}
.cal-ley .k.sel{background:var(--res,#10b2c2)}
.cal-ley .k{border-radius:50%}
.cal-mini{border:0;background:#f4f8f9;border-radius:22px}
.cal-mini-d em.lib{background:rgba(16,178,194,0.27)}
.cal-mini-d em.ocu{background:#dfe4e6}
.cal-mini-d em.neutro{background:#eef2f3}
.cal-mini-d em.pas{box-shadow:none}
.cal-mini-d em.sel{background:var(--res,#10b2c2)}

/* Tarjeta de reserva */
.vd-res-in{border:0;border-radius:32px;padding:32px 30px;box-shadow:0 50px 90px -50px rgba(11,12,13,.45),0 0 0 1px rgba(11,12,13,.04)}
.vd-pr{font-size:15px;margin-bottom:22px}
.vd-pr b{font-size:34px;font-weight:300;letter-spacing:-.03em}
.vd-campos{border:0;background:#f4f8f9;border-radius:24px;margin-bottom:16px}
.vd-campos label:nth-child(2n),.vd-campos label:nth-child(n+3),.vd-campos label:nth-child(4){box-shadow:none}
.vd-campos label{padding:14px 20px}
.vd-campos span{font-size:11.5px;letter-spacing:0;text-transform:none;font-weight:600;color:var(--brand-d)}
.vd-estado.libre{color:var(--brand-d)}
.vd-estado.ocupada{color:#6a7478}
.vd-reservar,.vd-consultar{border-radius:999px;padding:17px;font-size:15.5px;letter-spacing:0;text-transform:none;font-weight:600}
.vd-reservar{background:var(--res,#10b2c2);border-color:var(--res,#10b2c2);box-shadow:0 18px 34px -18px rgba(16,178,194,.9)}
.vd-consultar{border:0;background:rgba(16,178,194,0.09);color:var(--brand-d)}
.vd-consultar:hover{background:var(--brand-d);color:#fff}
.vd-nota{font-size:13px}
.vd-res-mov{border:0;background:#f4f8f9;border-radius:28px}
.vd-barra{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
@media (max-width:1020px){.vd-cols{gap:0}}
@media (max-width:760px){.vd-gal{border-radius:24px}.vd-sec{padding-top:34px}}
.vd-dest{display:none}
.cal-ley .k.lib{box-shadow:inset 0 0 0 1.5px rgba(16,178,194,0.27)}
@media (max-width:760px){.vd-gal{height:auto;width:100%}}

/* Titulo de una sola linea (hasta 50 caracteres) y debajo la frase que lo complementa, en otro tono */
.vd-cab > div{min-width:0;flex:1}
.vd-cab h1{font-weight:500;font-size:clamp(30px,3.3vw,46px);line-height:1.1;letter-spacing:-.03em;margin:0 0 10px;max-width:none}
.vd-cab .vd-subt{font-size:clamp(18px,1.7vw,24px);font-weight:300;letter-spacing:.005em;color:var(--brand);margin:0 0 14px;line-height:1.35}
@media (min-width:900px){.vd-cab h1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}
.vd-cab .vd-lugar{font-size:14px}

/* Cabecera centrada: sin la ruta "Villas / Villa N", titulo y frase centrados */
.vd-ruta{display:none}
.vd{padding-top:46px}
.vd-cab{position:relative;justify-content:center;text-align:center;margin-bottom:34px}
.vd-cab > div{flex:none;width:100%;max-width:1100px;margin:0 auto}
.vd-cab h1{margin-left:auto;margin-right:auto}
.vd-cab .vd-subt{color:var(--brand);margin-bottom:0}
.vd-cab .vd-lugar{justify-content:center}
.vd-cab .vd-comp{position:absolute;right:0;top:0}
@media (max-width:760px){.vd-cab .vd-comp{position:static;margin:16px auto 0}}
.vd-cab .vd-comp{top:auto;bottom:-6px}
.vd-subt .pt{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--brand);margin:0 18px;vertical-align:middle;opacity:.9}
.vd-subt span{letter-spacing:.04em}

/* Titulo = tres palabras sensoriales con puntos; debajo, la frase en el color de la marca */
.vd-cab h1.vd-pal{white-space:normal;font-weight:500;font-size:clamp(34px,4.6vw,66px);letter-spacing:-.025em;margin-bottom:12px}
.vd-cab h1.vd-pal .pt{display:inline-block;width:.16em;height:.16em;border-radius:50%;background:var(--brand);margin:0 .55em;vertical-align:middle;position:relative;top:-.04em}
.vd-cab h1.vd-pal span{letter-spacing:-.025em}
.vd-cab h1.vd-pal + .vd-subt{font-size:clamp(17px,1.6vw,22px)}

/* Todo en negro: titulo con palabras largas, puntos negros y frase negra */
.vd-cab h1.vd-pal{font-size:clamp(26px,3.5vw,50px);color:var(--tinta)}
.vd-cab h1.vd-pal .pt{background:var(--tinta);width:.14em;height:.14em}
@media (min-width:900px){.vd-cab h1.vd-pal{white-space:nowrap}}
.vd-cab .vd-subt,.vd-cab h1.vd-pal + .vd-subt{color:var(--tinta)}
.vd-cab h1.vd-pal .pt{margin:0 .32em}
.vd-cab .vd-subt,.vd-cab h1.vd-pal + .vd-subt{color:#10b2c2}

/* Frase de la ficha en Syne, mas apretada */
.vd-cab .vd-subt{font-family:"Syne",Poppins,sans-serif;font-weight:400;letter-spacing:-.015em;word-spacing:-.1em;color:#10b2c2}
.vd-cab h1.vd-pal + .vd-subt{font-size:clamp(20px,2vw,28px)}
.vd-cab .vd-subt{letter-spacing:-.012em;word-spacing:-.02em}

/* ---- ¿Donde vas a dormir? Estilo B&B: una tarjeta por habitacion y el baño al lado del titulo ---- */
.vd-dormir{padding-top:54px}
.vd-dormir-cab{display:flex;align-items:center;justify-content:space-between;gap:20px 30px;flex-wrap:wrap;margin-bottom:28px}
.vd-dormir-cab h2{margin:0}
.vd-dormir-bano{display:inline-flex;align-items:center;gap:12px;margin:0;background:rgba(16,178,194,0.09);color:var(--brand-d);border-radius:999px;padding:12px 24px 12px 16px;font-size:14.5px;font-weight:500}
.vd-dormir-bano svg{width:24px;height:24px;flex:none}
.vd-dormir .vd-camas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;overflow:visible;padding-bottom:0}
.vd-dormir .vd-cama{flex:none;background:#f4f8f9;border:0;border-radius:28px;padding:0;gap:0;box-shadow:0 24px 50px -40px rgba(11,12,13,.45);transition:transform .35s,box-shadow .35s}
.vd-dormir .vd-cama:hover{transform:translateY(-4px);box-shadow:0 34px 60px -38px rgba(11,12,13,.5)}
.vd-dormir .vd-cama img,.vd-dormir .vd-cama-ico{aspect-ratio:4/3;margin:0;border-radius:28px 28px 0 0}
.vd-dormir .vd-cama-ico{background:linear-gradient(180deg,rgba(16,178,194,0.09),#f4f8f9);color:var(--brand-d)}
.vd-dormir .vd-cama-ico svg{width:54px;height:54px;stroke-width:1.2}
.vd-cama-t{padding:18px 22px 22px}
.vd-dormir .vd-cama b{display:block;padding:0;font-size:17px;font-weight:600;letter-spacing:-.01em}
.vd-dormir .vd-cama span{display:block;padding:0;margin-top:4px;font-size:14.5px;color:var(--brand-d);font-weight:500}
@media (max-width:900px){.vd-dormir .vd-camas{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.vd-dormir .vd-camas{grid-template-columns:1fr}}
.vd-dormir-cab h2{font-size:clamp(24px,2.3vw,30px);white-space:nowrap}
.vd-dormir-bano{padding:10px 20px 10px 14px;font-size:13.5px}
@media (max-width:520px){.vd-dormir-cab h2{white-space:normal}}
.vd-dormir-cab{flex-wrap:nowrap;gap:16px}
.vd-dormir-cab h2{font-size:clamp(22px,2vw,27px)}
.vd-dormir-bano{padding:9px 16px 9px 12px;font-size:13px;gap:9px}
.vd-dormir-bano svg{width:21px;height:21px}
@media (max-width:760px){.vd-dormir-cab{flex-wrap:wrap}}

/* ---- Dormir: justo debajo de las fotos, mas pequeño, frase en el color de la marca, tarjetas blancas ---- */
.vd-cols{margin-top:34px}
.vd-dormir{padding:0 0 18px}
.vd-dormir-cab h2{font-family:"Syne",Poppins,sans-serif;font-weight:500;font-size:clamp(20px,1.8vw,24px);letter-spacing:-.012em;color:#10b2c2;margin:0}
.vd-dormir-cab{margin-bottom:18px}
.vd-dormir-bano{background:#fff;box-shadow:0 10px 24px -18px rgba(11,12,13,.4);font-size:12.5px;padding:8px 14px 8px 10px}
.vd-dormir-bano svg{width:19px;height:19px;color:#10b2c2}
.vd-dormir .vd-camas{gap:14px}
.vd-dormir .vd-cama{background:#fff;border-radius:22px;box-shadow:0 18px 40px -30px rgba(11,12,13,.5),0 0 0 1px rgba(11,12,13,.05)}
.vd-dormir .vd-cama img,.vd-dormir .vd-cama-ico{aspect-ratio:3/2;border-radius:22px 22px 0 0}
.vd-dormir .vd-cama-ico{background:#f4f8f9;color:#10b2c2}
.vd-dormir .vd-cama-ico svg{width:38px;height:38px}
.vd-cama-t{padding:12px 16px 15px}
.vd-dormir .vd-cama b{font-size:14.5px}
.vd-dormir .vd-cama span{font-size:13px;color:#10b2c2;margin-top:2px}
.vd-dormir + .vd-fila-d{margin-top:22px}

/* ---- Carruseles de la ficha: habitaciones y reseñas, con flechas ---- */
.vd-flechas{display:inline-flex;gap:8px;margin-left:auto;flex:none}
.vd-flechas button{width:38px;height:38px;border-radius:50%;border:0;background:rgba(16,178,194,0.09);color:var(--brand-d);display:grid;place-items:center;cursor:pointer;padding:0;transition:background .25s,color .25s}
.vd-flechas button:hover{background:#10b2c2;color:#fff}
.vd-flechas svg{width:17px;height:17px}
.vd-pista{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px 2px 18px}
.vd-pista::-webkit-scrollbar{display:none}
.vd-dormir .vd-camas.vd-pista{display:flex;grid-template-columns:none}
.vd-dormir .vd-cama{flex:0 0 clamp(170px,26%,205px);scroll-snap-align:start}
.vd-dormir-cab{flex-wrap:wrap}
.vd-dormir-bano{margin-left:4px}

/* Rating y lo que dicen los huespedes, pegado a las fotos */
.vd-resenas{padding:26px 0 8px}
.vd-res-cab{display:flex;align-items:center;gap:18px;margin-bottom:14px;flex-wrap:wrap}
.vd-res-nota{display:inline-flex;align-items:center;gap:12px}
.vd-res-nota b{font-size:34px;font-weight:300;letter-spacing:-.03em;line-height:1}
.vd-est{display:inline-flex;gap:2px}
.vd-est svg{width:17px;height:17px;fill:#d7e6e9}
.vd-est svg.on{fill:#10b2c2}
.vd-res-cab p{margin:0;font-family:"Syne",Poppins,sans-serif;font-weight:500;font-size:clamp(17px,1.5vw,20px);color:#10b2c2;letter-spacing:-.01em}
.vd-res-cab p i{font-style:normal;font-family:Poppins,sans-serif;font-weight:400;font-size:13px;color:#6a7478;margin-left:12px;letter-spacing:0}
.vd-rv-t{flex:0 0 clamp(250px,46%,330px);scroll-snap-align:start;margin:0;background:#fff;border-radius:22px;padding:18px 20px 16px;box-shadow:0 18px 40px -30px rgba(11,12,13,.5),0 0 0 1px rgba(11,12,13,.05);display:flex;flex-direction:column;gap:10px}
.vd-rv-t .vd-est svg{width:14px;height:14px}
.vd-rv-t blockquote{margin:0;font-size:14.5px;line-height:1.65;color:#2c3236;font-weight:300;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.vd-rv-t figcaption{margin-top:auto;font-size:13px;color:#6a7478;display:flex;gap:10px;align-items:baseline}
.vd-rv-t figcaption b{color:var(--tinta);font-weight:600}
.vd-dormir-cab h2{flex:1 1 auto}
.vd-dormir-cab .vd-flechas{order:2}
.vd-dormir-cab .vd-dormir-bano{order:3;margin:0}
.vd-dormir-cab{row-gap:12px}
.vd-resenas{padding-bottom:0}
.vd-dormir .vd-camas.vd-pista{overflow-x:auto;overflow-y:hidden}

/* ---- Rating compacto bajo las fotos; las reseñas se abren con un clic ---- */
.vd-resenas{padding:22px 0 4px}
.vd-res-cab{display:flex;align-items:center;gap:10px 18px;flex-wrap:wrap;margin:0}
.vd-res-nota b{font-size:30px}
.vd-res-cab p{font-size:clamp(16px,1.4vw,19px)}
.vd-res-ver{margin-left:auto;border:0;cursor:pointer;font:inherit;font-size:13.5px;font-weight:600;color:var(--brand-d);background:rgba(16,178,194,0.09);border-radius:999px;padding:11px 22px;transition:background .25s,color .25s}
.vd-res-ver:hover{background:#10b2c2;color:#fff}
.vd-rvm{position:fixed;inset:0;z-index:300;background:rgba(6,16,18,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:24px}
.vd-rvm-hoja{position:relative;background:#fff;border-radius:32px;width:min(920px,100%);max-height:88vh;overflow:auto;padding:36px 36px 30px;box-shadow:0 60px 120px -40px rgba(0,0,0,.6)}
.vd-rvm-x{position:absolute;right:18px;top:16px;width:42px;height:42px;border-radius:50%;border:0;background:#f4f8f9;font-size:26px;line-height:1;cursor:pointer;color:var(--tinta)}
.vd-rvm-x:hover{background:rgba(16,178,194,0.09)}
.vd-rvm-cab{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-bottom:24px;padding-right:50px}
.vd-rvm-cab h3{margin:0;font-family:"Syne",Poppins,sans-serif;font-weight:500;font-size:20px;color:#10b2c2}
.vd-rvm-lista{columns:2;column-gap:16px}
.vd-rvm-lista .vd-rv-t{flex:none;break-inside:avoid;margin:0 0 16px;background:#f4f8f9;box-shadow:none}
.vd-rvm-lista .vd-rv-t blockquote{-webkit-line-clamp:unset;display:block;white-space:pre-line}
@media (max-width:700px){.vd-rvm{padding:0;align-items:flex-end}.vd-rvm-hoja{border-radius:28px 28px 0 0;max-height:92vh;padding:28px 20px}.vd-rvm-lista{columns:1}.vd-res-ver{margin-left:0}}
.vd-rv-t figcaption{display:flex;align-items:center;gap:12px}
.vd-rv-t figcaption > div{display:flex;flex-direction:column;gap:1px;line-height:1.3}
.vd-rv-f,.vd-rv-i{width:42px;height:42px;border-radius:50%;object-fit:cover;flex:none}
.vd-rv-i{display:grid;place-items:center;background:rgba(16,178,194,0.09);color:var(--brand-d);font-weight:600}

/* ---- Reservador estilo Airbnb: pide fechas, el precio aparece con ellas; capacidad dentro; mascotas ---- */
.vd-pr{display:flex;flex-direction:column;gap:2px;margin-bottom:16px}
.vd-pr-pide{font-family:"Syne",Poppins,sans-serif;font-weight:500;font-size:clamp(22px,1.9vw,26px);color:#10b2c2;letter-spacing:-.015em;line-height:1.15}
.vd-pr-sub{font-size:14px;color:#6a7478}
.vd-cap{list-style:none;margin:0 0 20px;padding:0;display:flex;gap:8px;flex-wrap:wrap}
.vd-cap li{display:inline-flex;align-items:center;gap:7px;background:#f4f8f9;border-radius:999px;padding:8px 14px;font-size:13px;color:#4a5558}
.vd-cap svg{width:18px;height:18px;color:#10b2c2;flex:none}
.vd-cap b{font-weight:600;color:var(--tinta)}
.vd-campos .vd-masc{grid-column:1/-1}
.vd-campos .vd-masc select{width:100%}
.vd-campos{gap:2px}
.vd-campos label{background:#fff;border-radius:18px;margin:0;box-shadow:inset 0 0 0 1px #e6eaec;transition:box-shadow .2s}
.vd-campos label:hover,.vd-campos label:focus-within{box-shadow:inset 0 0 0 1.5px #10b2c2}
.vd-campos{background:transparent;gap:8px;padding:0;border-radius:0}
.vd-campos span{color:#10b2c2}

/* flechas encima de las camas, no en el encabezado */
.vd-pista-w{position:relative}
.vd-pista-w .vd-flechas{position:absolute;left:0;right:0;top:calc(50% - 38px);margin:0;display:flex;justify-content:space-between;padding:0 8px;pointer-events:none;z-index:3}
.vd-pista-w .vd-flechas button{pointer-events:auto;width:44px;height:44px;background:rgba(255,255,255,.96);color:var(--tinta);box-shadow:0 10px 26px -10px rgba(11,12,13,.55);backdrop-filter:blur(8px)}
.vd-pista-w .vd-flechas button:hover{background:#10b2c2;color:#fff}
.vd-dormir-bano{display:none}
.vd-campos label,.vd-campos label:nth-child(2n),.vd-campos label:nth-child(n+3),.vd-campos label:nth-child(4){box-shadow:inset 0 0 0 1px #e6eaec !important;border-radius:18px;padding:12px 18px}
.vd-campos label:hover,.vd-campos label:focus-within{box-shadow:inset 0 0 0 1.5px #10b2c2 !important}
.vd-campos{margin-bottom:14px}
.vd-cap{gap:6px}
.vd-cap li{padding:7px 11px;font-size:12.5px;gap:6px}
.vd-cap svg{width:16px;height:16px}
.vd-pr{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:2px 8px}
.vd-pr-pide,.vd-pr-sub{flex-basis:100%}

/* ---- Las cinco partes de la descripcion + reservador compacto y dividido ---- */
.vd-info{padding:30px 0 6px}
.vd-info-f{display:grid;grid-template-columns:170px minmax(0,1fr);gap:8px 30px;padding:24px 0}
.vd-info-f h3{margin:0;font-family:"Syne",Poppins,sans-serif;font-weight:500;font-size:15.5px;letter-spacing:-.005em;color:#10b2c2;line-height:1.35}
.vd-info-f .vd-texto p{font-size:15.5px;line-height:1.8;margin:0 0 10px}
.vd-info-f .vd-texto > :last-child{margin-bottom:0}
.vd-ico{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px 22px}
.vd-ico li{display:inline-flex;align-items:center;gap:10px;font-size:14px}
.vd-ico .vd-ci{width:36px;height:36px}
.vd-ico b{font-weight:500}
.vd-info-f .vd-normas{margin-top:14px;grid-template-columns:1fr;gap:12px}
.vd-info-f .vd-normas li{font-size:14.5px;gap:12px}
.vd-info-f .vd-normas svg{width:20px;height:20px}
@media (max-width:700px){.vd-info-f{grid-template-columns:1fr;gap:6px;padding:18px 0}}

/* Reservador pequeño: un solo bloque dividido en filas, como Airbnb */
.vd-res-in{padding:22px 22px 20px;border-radius:28px}
.vd-pr{margin-bottom:12px}
.vd-pr-pide{font-size:20px}
.vd-pr-sub{font-size:13px}
.vd-pr b{font-size:26px}
.vd-cap{margin:0 0 14px;gap:14px;flex-wrap:nowrap}
.vd-cap li{background:none;padding:0;font-size:12.5px;gap:5px;white-space:nowrap}
.vd-cap svg{width:16px;height:16px}
.vd-campos{display:grid;grid-template-columns:1fr 1fr;gap:0;margin:0 0 12px;border-radius:18px;overflow:hidden;box-shadow:inset 0 0 0 1px #dde5e8;background:#fff}
.vd-campos label,.vd-campos label:nth-child(2n),.vd-campos label:nth-child(n+3),.vd-campos label:nth-child(4){box-shadow:none !important;border-radius:0;padding:9px 14px;gap:1px;background:#fff}
.vd-campos label:nth-child(2n){box-shadow:inset 1px 0 0 #dde5e8 !important}
.vd-campos label:nth-child(n+3){box-shadow:inset 0 1px 0 #dde5e8 !important}
.vd-campos label:nth-child(4){box-shadow:inset 1px 1px 0 #dde5e8 !important}
.vd-campos .vd-masc{grid-column:1/-1;box-shadow:inset 0 1px 0 #dde5e8 !important}
.vd-campos label:hover,.vd-campos label:focus-within{background:rgba(16,178,194,0.05);box-shadow:inherit}
.vd-campos span{font-size:10.5px;letter-spacing:.02em}
.vd-campos input,.vd-campos select{font-size:14px}
.vd-estado{margin:0 0 8px;font-size:13px;min-height:0}
.vd-reservar,.vd-consultar{padding:14px;font-size:14.5px}
.vd-consultar{margin-top:8px}
.vd-nota{margin-top:10px;font-size:12px}

/* ============================================================
   FICHA CENTRADA (5 oct 2026): cada seccion con su titulo al centro, descripcion justificada,
   calendario grande y con colores que se entienden de un vistazo.
   ============================================================ */
/* Titulos de seccion, todos iguales y centrados */
.vd-sec h2,.vd-info-f h3,.vd-dormir-cab h2{font-family:"Syne",Poppins,sans-serif;font-weight:500;font-size:clamp(20px,1.9vw,24px);letter-spacing:-.012em;color:#10b2c2;text-align:center;margin:0 0 18px}
.vd-sec{padding:38px 0 8px;text-align:center}
.vd-dormir{text-align:left}
.vd-dormir-cab{justify-content:center}

/* Las cinco partes: titulo arriba, contenido debajo, todo al centro */
.vd-info{padding:30px 0 0}
.vd-info-f{display:block;padding:0 0 34px;text-align:center}
.vd-info-f .vd-texto{max-width:none}
/* La descripcion: justificada, todas las lineas del mismo largo */
.vd-info-f .vd-texto p{text-align:justify;text-align-last:left;hyphens:auto;-webkit-hyphens:auto;font-size:15.5px;line-height:1.85;margin:0 0 12px}
.vd-info-f:first-child .vd-texto p,.vd-info-f .vd-texto p:only-child{text-align:justify}
/* Acceso, interaccion y otros detalles: centrados, en una sola linea cuando caben */
.vd-info-f:not(:first-child) .vd-texto p{text-align:center;text-align-last:center;margin-left:auto;margin-right:auto}
.vd-ico{justify-content:center;margin-top:16px}
.vd-info-f .vd-normas{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 26px;margin:16px auto 0}
.vd-info-f .vd-normas li{justify-content:center}

/* Amenities centradas */
.vd-grupos{justify-items:center;text-align:center}
.vd-grupo{width:100%}
.vd-gt{justify-content:center}
.vd-com li{justify-content:center}

/* Ubicacion centrada */
.vd-ubic{flex-direction:column;justify-content:center;text-align:center;gap:10px}
.vd-ubic > div{text-align:center}
.vd-ubic-ico{margin:0 auto}
.vd-sec .vd-texto p{text-align:center;margin-left:auto;margin-right:auto}
.vd-mapa{margin:18px auto 0}

/* Disponibilidad: centrada, grande y con colores que hablan */
.vd-cal-sec{text-align:center}
.vd-cal-nota{text-align:center}
.cal-cab{justify-content:center;gap:16px 28px;margin-bottom:22px}
.cal-nav{justify-content:center}
.cal-meses{justify-items:center;gap:34px 44px}
.cal-mes{width:100%;max-width:360px}
.cal-mes h4{text-align:center;font-family:"Syne",Poppins,sans-serif;font-size:18px;font-weight:500;color:var(--tinta);margin-bottom:12px}
.cal-sem{gap:6px}
.cal-sem span{font-size:12px;color:#10b2c2;font-weight:600}
.cal-dias{gap:6px}
.cd{min-height:44px;font-size:15px;font-weight:600}
.cd.lib{background:rgba(16,178,194,0.23);color:#10b2c2}
.cd.lib:hover{background:#10b2c2;color:#fff;transform:scale(1.06)}
.cd.ocu{background:#e3e7e9;color:#9aa5a9;text-decoration:line-through;font-weight:500}
.cd.pas{background:transparent;color:#d3d9dc;font-weight:400}
.cd.hoy{box-shadow:inset 0 0 0 2px #0b0c0d}
.cd.sel{background:rgba(16,178,194,0.47);color:#0b0c0d;border-radius:8px}
.cd.ini,.cd.fin{background:#10b2c2;color:#fff;border-radius:50%;box-shadow:0 8px 18px -8px rgba(16,178,194,.9)}
.cal-aviso{text-align:center;font-weight:600}
.cal-ley{justify-content:center;gap:10px 28px;margin-top:18px;font-size:14px;color:var(--tinta)}
.cal-ley .k{width:22px;height:22px;border-radius:50%}
.cal-ley .k.lib{background:rgba(16,178,194,0.23);box-shadow:inset 0 0 0 2px #10b2c2}
.cal-ley .k.ocu{background:#e3e7e9;box-shadow:inset 0 0 0 2px #b7c0c4}
.cal-ley .k.sel{background:#10b2c2}
.cal-ley .k.neutro{background:#fff;box-shadow:inset 0 0 0 2px #0b0c0d}
.cal-ano{justify-items:center}

/* ============================================================
   FICHA, TERCERA PASADA (5 oct 2026): texto parejo de borde a borde (candado), amenities alineadas,
   calendario con el rango pintado, otro color para lo ocupado y vista de año que funciona.
   ============================================================ */
/* ---- (8 oct 2026) Ya NO se justifica: Carlos, "la letra se ve muy separada, no se ve lujoso". El texto va centrado y equilibrado (ver el bloque LUJO al final). ---- */
.vd-info,.vd-sec{--ancho:100%}
.vd-info-f .vd-texto,.vd-sec .vd-texto{width:100%;max-width:100%;margin:0 auto;overflow:hidden}
.vd-info-f .vd-texto p,.vd-sec .vd-texto p,.vd-info-f:not(:first-child) .vd-texto p{
  text-align:center !important;text-align-last:center !important;
  hyphens:none;-webkit-hyphens:none;overflow-wrap:break-word;word-break:normal;
  width:100%;max-width:100%;margin:0 0 12px !important;box-sizing:border-box}
.vd-info-f .vd-texto p:last-child,.vd-sec .vd-texto p:last-child{margin-bottom:0 !important}

/* Ubicacion: el nombre y su subtitulo con el mismo largo (el bloque mide lo que mide la linea mas larga) */
.vd-ubic{display:block;text-align:center}
.vd-ubic-ico{margin:0 auto 12px}
.vd-ubic > div:last-child{display:table;margin:0 auto 18px}
.vd-ubic b,.vd-ubic span{display:block;text-align:justify;text-align-last:justify;white-space:nowrap}
.vd-ubic b{font-size:19px;margin-bottom:4px}
.vd-ubic span{font-size:13.5px}

/* ---- Amenities: todas, alineadas en columnas, una debajo de otra ---- */
.vd-grupos{display:block;text-align:left}
.vd-grupo{width:100%;margin:0 0 30px}
.vd-gt{justify-content:center;font-size:16px;margin:0 0 16px}
.vd-gi{display:none}
.vd-com{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 24px;margin:0}
.vd-com li{justify-content:flex-start;font-size:14.5px;gap:12px;align-items:center}
.vd-ci{width:auto;height:auto;background:none;border-radius:0}
.vd-ci svg{width:22px;height:22px;color:#0b0c0d}
.vd-info-f .vd-normas svg{color:#0b0c0d}
@media (max-width:700px){.vd-com{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.vd-com{grid-template-columns:1fr}}

/* ---- Calendario ---- */
.cal-nav span:empty{display:none}
.cal-nav{gap:14px}
/* ocupado: color propio y claro, el tachado queda */
.cd.ocu{background:#9fb0b8;color:#fff;text-decoration:line-through;text-decoration-thickness:2px;font-weight:600;opacity:1}
.cal-ley .k.ocu{background:#9fb0b8;box-shadow:none}
/* el rango se pinta de corrido: llegada y salida llenas, los dias de en medio en bloque */
.cd.sel,.cd.prev{background:#10b2c2;color:#0b0c0d;border-radius:12px;font-weight:700}
.cd.ini,.cd.fin,.cd.prevfin{background:#10b2c2;color:#fff;border-radius:50%;box-shadow:0 8px 18px -8px rgba(16,178,194,.95)}
.cd.prevfin{opacity:.85}
.cd.ini.ocu,.cd.fin.ocu{background:#10b2c2}
/* vista de año: los 12 meses con sus dias, se puede escoger ahi mismo */
.cal-ano{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 26px;justify-items:center}
.cal-ano .cal-mes{max-width:none;width:100%}
.cal-ano .cal-mes h4{font-size:15px;margin-bottom:8px}
.cal-ano .cal-sem{gap:2px}
.cal-ano .cal-sem span{font-size:10px}
.cal-ano .cal-dias{gap:3px}
.cal-ano .cd{min-height:0;aspect-ratio:1;font-size:11.5px;border-radius:50%}
.cal-ano .cd.sel,.cal-ano .cd.prev{border-radius:6px}
@media (max-width:900px){.cal-ano{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.cal-ano{grid-template-columns:1fr}}

/* ---- Reservador: solo "Reservar"; cada campo con su borde completo; el rabito de la g sin cortar ---- */
.vd-pr-pide{line-height:1.4;padding-bottom:3px;overflow:visible}
.vd-pr{overflow:visible}
.vd-campos{display:grid;grid-template-columns:1fr 1fr;gap:10px;box-shadow:none;background:transparent;border-radius:0;overflow:visible}
.vd-campos label,.vd-campos label:nth-child(2n),.vd-campos label:nth-child(n+3),.vd-campos label:nth-child(4),.vd-campos .vd-masc{
  box-shadow:none !important;background:#fff;border:1.5px solid #cfdadd;border-radius:14px;padding:9px 14px;overflow:visible}
.vd-campos label:hover,.vd-campos label:focus-within{border-color:#10b2c2;background:#fff;box-shadow:none !important}
.vd-campos .vd-masc{grid-column:1/-1}
.vd-estado{margin:2px 0 10px}
.vd-reservar{margin-top:2px}
/* Amenities: una sola lista, tres columnas bien alineadas */
.vd-todas-am{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 28px;list-style:none;margin:6px 0 0;padding:0;text-align:left}
.vd-todas-am li{display:flex;align-items:center;gap:12px;font-size:14.5px}
/* Otros detalles: una debajo de otra, alineadas a la izquierda dentro de un bloque centrado */
.vd-info-f .vd-normas{display:table;margin:18px auto 0;text-align:left;border-spacing:0}
.vd-info-f .vd-normas li{display:flex;justify-content:flex-start;align-items:center;gap:12px;margin:0 0 12px;text-align:left}
@media (max-width:700px){.vd-todas-am{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.vd-todas-am{grid-template-columns:1fr}}
.cal-ano .cd.ocu{text-decoration:none}

/* ---- Lupa 1 del reservador ---- */
.vd-reservar{background:#10b2c2;border-color:#10b2c2;color:#fff;font-weight:600;letter-spacing:0;box-shadow:0 16px 30px -16px rgba(16,178,194,.95)}
.vd-reservar:hover{filter:none;background:#10b2c2;border-color:#10b2c2;transform:translateY(-1px)}
.vd-reservar.bloq{background:#d3dadd;border-color:#d3dadd;color:#6a7478;box-shadow:none;cursor:not-allowed;transform:none}
.vd-pr-no{color:#6a7478;font-size:17px}
.vd-barra b{font-size:15px}
.vd-barra .vd-reservar{padding:13px 28px;font-size:14.5px}
/* En celular el chat flotante sube para no tapar el boton Reservar de la barra */
@media (max-width:1020px){body[data-pagina="reservar"] .chat-btn{bottom:92px}}
/* ARREGLO: en pantallas medianas y chicas la ficha va en UNA columna (la regla de escritorio de arriba la pisaba y la columna de contenido quedaba en 0 px) */
@media (max-width:1020px){.vd-cols{grid-template-columns:minmax(0,1fr);gap:0}.vd-reserva{display:none}}
.vd-res-mov{text-align:left}
.vd-res-mov .vd-campos label{text-align:left}
.vd-res-mov .vd-estado{text-align:center}
@media (max-width:520px){.vd-campos input[type=date],.vd-campos select{font-size:13px}.vd-campos label{padding:8px 11px}}

/* ---- Destacados, anfitrion, no incluye, cosas que debes saber, detalle de calificacion ---- */
.vd-dest3{padding:22px 0 0}
.vd-dest3 ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.vd-dest3 li{background:#f4f8f9;border-radius:22px;padding:18px 18px 20px;text-align:center}
.vd-dest3 b{display:block;font-family:"Syne",Poppins,sans-serif;font-weight:500;font-size:15.5px;color:#10b2c2;margin-bottom:6px}
.vd-dest3 span{display:block;font-size:13px;line-height:1.5;color:#4a5558}
@media (max-width:700px){.vd-dest3 ul{grid-template-columns:1fr}}
.vd-host-c{display:inline-flex;align-items:center;gap:16px;text-align:left}
.vd-host-c img,.vd-host-i{width:62px;height:62px;border-radius:50%;object-fit:cover;flex:none}
.vd-host-i{display:grid;place-items:center;background:rgba(16,178,194,0.09);color:var(--brand-d);font-size:24px;font-weight:600}
.vd-host-c b{display:block;font-size:17px;font-weight:600}
.vd-host-c span{display:block;font-size:14px;color:#4a5558;margin-top:2px}
.vd-noinc-t{font-family:"Syne",Poppins,sans-serif;font-weight:500;font-size:16px;color:#6a7478;text-align:center;margin:30px 0 12px}
.vd-noinc{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 28px;text-align:left}
.vd-noinc li{display:flex;align-items:center;gap:12px;font-size:14.5px;color:#8a9498}
.vd-noinc svg{width:20px;height:20px;flex:none}
.vd-noinc li span{text-decoration:line-through}
@media (max-width:700px){.vd-noinc{grid-template-columns:1fr 1fr}}
.vd-saber-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 40px;text-align:left}
.vd-saber h3{margin:0 0 8px;font-size:14.5px;font-weight:600}
.vd-saber p,.vd-saber li{font-size:14.5px;line-height:1.75;color:#3a4246;margin:0}
.vd-saber ul{margin:0;padding-left:18px}
@media (max-width:700px){.vd-saber-g{grid-template-columns:1fr}}
.vd-rvd{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:24px 40px;margin:0 0 26px;padding:0 4px;align-items:start}
.vd-rvd-dist{display:grid;gap:7px}
.vd-rvd-dist div{display:grid;grid-template-columns:14px 1fr 38px;gap:10px;align-items:center;font-size:12.5px;color:#4a5558}
.vd-rvd-dist i{display:block;height:6px;border-radius:99px;background:#e6eef0;overflow:hidden}
.vd-rvd-dist u{display:block;height:100%;background:#10b2c2;text-decoration:none;border-radius:99px}
.vd-rvd-dist b{font-weight:500;text-align:right}
.vd-rvd-cat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.vd-rvd-cat div{background:#f4f8f9;border-radius:16px;padding:12px 14px}
.vd-rvd-cat span{display:block;font-size:12px;color:#6a7478}
.vd-rvd-cat b{display:block;font-size:20px;font-weight:400;margin-top:2px}
@media (max-width:700px){.vd-rvd{grid-template-columns:1fr}.vd-rvd-cat{grid-template-columns:repeat(2,minmax(0,1fr))}}
.vd-host-c .vd-host-i{display:grid;place-items:center;width:62px;height:62px;border-radius:50%;background:rgba(16,178,194,0.09);color:var(--brand-d);font-size:24px;font-weight:600;margin:0}
.vd-host-c div span{display:block}
.vd-saber-g:has(> div:only-child){grid-template-columns:minmax(0,460px);justify-content:center}

/* GALERIA EN EL TELEFONO = LA DE AIRBNB EN COMPUTADORA (5 oct 2026)

   Carlos: "solo se ve una foto arriba. Tiene que verse, estilo Airbnb, una foto de portada y por lo menos tres o cuatro mas", y despues, con
   una captura de Airbnb en computadora: la portada grande a la izquierda y las otras como alli, con la linea blanca fina entre fotos.
   Antes (<=760px) se escondian todas menos la primera. Ahora el telefono usa la MISMA grilla de escritorio (portada a la izquierda en 2 de 4 partes
   del ancho, y a la derecha cuatro fotos en 2x2), a proporcion 2:1 para que no quede una tira aplastada. Segun cuantas fotos haya:
   5 o mas = portada + 4; 4 = portada + 3 (la de abajo a lo ancho); 3 = portada + 2; 2 = mitad y mitad; 1 = una sola. Lo de las reglas !important
   es porque el bloque de arriba (que escondia las fotos) las puso asi. */
@media (max-width:760px){
  .vd-gal{height:auto !important;aspect-ratio:2/1 !important;gap:6px !important;border-radius:18px;grid-template-columns:2fr 1fr 1fr !important;grid-template-rows:1fr 1fr !important}
  .vd-gal .vd-g{display:block !important}
  .vd-gal.n5 .vd-g:first-child,.vd-gal.n4 .vd-g:first-child,.vd-gal.n3 .vd-g:first-child{grid-row:1/3 !important}
  .vd-gal.n3{grid-template-columns:2fr 1fr !important}
  .vd-gal.n2{grid-template-columns:1fr 1fr !important;grid-template-rows:1fr !important}
  .vd-gal.n1{grid-template-columns:1fr !important;grid-template-rows:1fr !important;aspect-ratio:4/3 !important}
  .vd-gal.n1 .vd-g:first-child,.vd-gal.n2 .vd-g:first-child{grid-row:auto !important}
  .vd-gal .vd-todas{right:8px;bottom:8px;padding:6px 11px;font-size:11px}
}

/* COMPARTIR ARRIBA A LA DERECHA, EL TITULO DEBAJO (Carlos, 5 oct 2026): *"el titulo debe estar debajo del share, y el share a mano derecha, arriba del titulo"*.
   El boton ya estaba en el HTML despues del titulo y se pintaba suelto (absoluto abajo, o centrado en el telefono). Ahora la cabecera es una columna: primero
   el boton, pegado a la derecha, y debajo el titulo y la frase, centrados como siempre. Sin tocar el HTML: `order:-1` lo sube. Vale igual en telefono. */
.vd-cab{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:14px}
.vd-cab .vd-comp{order:-1;position:static;align-self:flex-end;margin:0}


/* TEXTO RESALTADO EN LA DESCRIPCION (5 oct 2026): lo que en el calendario se marca con el boton "Resaltar" llega aqui entre ** y sale en el turquesa EXACTO de la marca. */
.vd-texto .resal{color:#10b2c2;font-weight:600}

/* EL BOTON "RESERVAR" (5 oct 2026, segunda version)

   Carlos: *"el Book ese no es el tipo de animacion que quiero. Lo que quiero es que salga de adentro hacia afuera por los alrededores, pero no que pase
   por encima."* Se quito el destello que cruzaba por encima y el texto que rodaba. Ahora el boton es plano, del color EXACTO de la marca (#10b2c2, del libro
   de marca) y SIN sombra fija; lo unico que se mueve son dos ondas del mismo turquesa que nacen en el borde y se abren hacia afuera por TODOS los lados
   (spread parejo, sin desplazamiento hacia abajo) mientras se desvanecen. Nada pasa por encima del boton: una sombra exterior no se pinta debajo de su propia
   caja, y la segunda onda sale de un pseudo-elemento transparente del mismo tamano. Con movimiento reducido no hay ondas. */
.vd-reservar:not(.bloq){background:#10b2c2 !important;border-color:#10b2c2 !important;color:#fff;filter:none !important;position:relative;font-weight:600;letter-spacing:.01em;animation:vrOnda 2.8s ease-out infinite}
.vd-reservar:not(.bloq)::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;animation:vrOnda 2.8s ease-out 1.4s infinite}
.vd-reservar:not(.bloq):hover,.vd-reservar:not(.bloq):focus-visible{background:#10b2c2 !important;border-color:#10b2c2 !important;filter:none !important;transform:translateY(-1px)}
.vd-reservar:not(.bloq):active{transform:scale(.98)}
@keyframes vrOnda{0%{box-shadow:0 0 0 0 rgba(16,178,194,.6)}70%,100%{box-shadow:0 0 0 16px rgba(16,178,194,0)}}
@media (prefers-reduced-motion:reduce){.vd-reservar:not(.bloq),.vd-reservar:not(.bloq)::after{animation:none}}

/* "Casa Linda" del final de la ficha (5 oct 2026): estaba JUSTIFICADO y separaba "Casa" de "Linda" a los lados. Un solo texto, centrado, con el espacio normal entre palabras. */
.vd-ubic,.vd-ubic *{text-align:center !important;text-align-last:center !important;word-spacing:normal !important;text-justify:auto}
.vd-ubic b{display:block}

/* ---- Pagina de reservar, mas limpia (5 oct 2026) ----
   Carlos: titulo corto con letras resaltadas, filtros bien cuadrados (se veian regueros), una invitacion elegante en la foto para abrir la villa completa,
   y la onda del boton Reservar mas fina. */
.vs-cab h1{font-weight:300;letter-spacing:-.03em}
.vs-cab h1 b{font-weight:600;color:var(--res,#10b2c2)}
.vs-cab{padding-bottom:6px}
.vs-fila-f{display:grid;grid-template-columns:1.25fr auto 1fr 1fr;gap:0;align-items:stretch;margin:12px 0 0;background:#fff;border:1px solid var(--linea);border-radius:var(--vs-r-tarj);overflow:hidden}
.vs-fila-f > *{padding:12px 20px;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:6px;margin:0}
.vs-fila-f > * + *{box-shadow:-1px 0 0 var(--linea)}
.vs-fila-f .vs-rot{margin:0;font-size:10px;letter-spacing:.18em}
.vs-fila-f .vs-buscar{border:0;border-radius:0;padding:0;max-width:none;flex:none;background:transparent;font-size:15px;height:100%}
.vs-fila-f .vs-hab{flex-direction:column;align-items:flex-start;gap:6px}
.vs-fila-f .vs-hab{display:flex}
.vs-fila-f .vs-chip{padding:5px 12px;font-size:13px}
.vs-fila-f .vs-chip-fila{display:flex}
.vs-fila-f .vs-sel{flex-direction:column;align-items:stretch;gap:6px}
.vs-fila-f .vs-sel select{border:0;border-radius:0;padding:0;max-width:none;font-size:15px;background:transparent}
.vs-fila-f > .vs-buscar:focus{box-shadow:none}
@media (max-width:900px){
  .vs-fila-f{grid-template-columns:1fr 1fr}
  .vs-fila-f > *{padding:11px 16px}
  .vs-fila-f > .vs-bus{grid-column:1/-1}
  .vs-fila-f > .vs-hab{grid-column:1/-1;box-shadow:0 -1px 0 var(--linea)}
  .vs-fila-f > .vs-sel{box-shadow:0 -1px 0 var(--linea)}
  .vs-fila-f > .vs-sel + .vs-sel{box-shadow:-1px -1px 0 var(--linea)}
}
.vs-mas,.vs-panel{display:none !important}

/* Invitacion dentro de la foto */
.vs-ver{position:absolute;right:12px;bottom:12px;display:inline-flex;align-items:center;gap:10px;padding:6px 6px 6px 16px;border-radius:999px;background:rgba(255,255,255,.94);color:var(--tinta);font-size:13px;font-weight:600;letter-spacing:.01em;box-shadow:0 10px 24px -12px rgba(0,0,0,.55);backdrop-filter:blur(6px);transition:padding .3s,box-shadow .3s}
.vs-ver i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#10b2c2;color:#fff}
.vs-ver svg{width:15px;height:15px;animation:vsFlecha 2.6s ease-in-out infinite}
@keyframes vsFlecha{0%,60%,100%{transform:translateX(0)}30%{transform:translateX(3px)}}
a.vs-tarj:hover .vs-ver{padding-left:20px;box-shadow:0 14px 28px -12px rgba(0,0,0,.6)}
.vs-no .vs-ver{display:none}
@media (prefers-reduced-motion:reduce){.vs-ver svg{animation:none}}

/* La onda del boton Reservar, mas fina (antes 16 px) */
@keyframes vrOnda{0%{box-shadow:0 0 0 0 rgba(16,178,194,.42)}70%,100%{box-shadow:0 0 0 7px rgba(16,178,194,0)}}
.vs-fila-f .vs-hab{flex-direction:row;flex-wrap:wrap;align-items:center;column-gap:6px;row-gap:8px}
.vs-fila-f .vs-hab .vs-rot{flex:0 0 100%}
.vs-fila-f .vs-bus .vs-buscar{width:100%;height:auto}
.vs-fila-f > .vs-buscar{display:none}
@media (max-width:900px){.vs-fila-f > .vs-bus{grid-column:1/-1}}
.vs-fila-f .vs-hab{justify-content:flex-start;align-content:center}

/* "¿Donde vas a dormir?": las camas suben, estaban a 40 px del titulo (margen doble: 18 + 18). Ahora 16 px. (Carlos, 5 oct 2026) */
.vd-dormir-cab{margin-bottom:0}
.vd-dormir-cab h2{margin-bottom:12px}

/* ---- Calendario de disponibilidad, colores nuevos (Carlos, 5 oct 2026) ----
   Libre = blanco natural. Ocupado = turquesa de la marca, SIN tachar (la leyenda de abajo ya dice que es cada color).
   La estadia que escoge el huesped = indigo del canal "Sitio web" (el mismo #3d5afe que ve el equipo en el calendario interno). */
.cal-dias .cd.lib{background:#fff;color:#0b0c0d;border:1px solid #e9eef0;transform:none}
.cal-dias .cd.lib:hover{background:#fff;color:#3d5afe;border-color:#3d5afe;transform:none}
.cal-dias .cd.ocu{background:#10b2c2;color:#fff;border-color:transparent;text-decoration:none;font-weight:600;opacity:1;cursor:default}
.cal-dias .cd.sel,.cal-dias .cd.prev{background:#3d5afe;color:#fff;border-color:transparent;font-weight:600;text-decoration:none}
.cal-dias .cd.ini,.cal-dias .cd.fin,.cal-dias .cd.prevfin{background:#3d5afe;color:#fff;border-color:transparent;box-shadow:0 8px 18px -8px rgba(61,90,254,.9);text-decoration:none}
.cal-dias .cd.ini.ocu,.cal-dias .cd.fin.ocu{background:#3d5afe}
.cal-dias .cd.hoy{box-shadow:inset 0 0 0 2px #0b0c0d}
.cal-ano .cd.ocu{text-decoration:none}
.cal-ley .k.lib{background:#fff;box-shadow:inset 0 0 0 1.5px #d5dde0}
.cal-ley .k.ocu{background:#10b2c2;box-shadow:none}
.cal-ley .k.sel{background:#3d5afe;box-shadow:none}

/* ---- Un solo "Book" con el precio (6 oct 2026) ----
   El primero (bajo el calendario) lleva el precio de las fechas escogidas; la barra de abajo se esconde mientras hay fechas puestas. */
.vd-reservar[data-campo="reservar"]{flex-direction:column;gap:2px;line-height:1.15}
.vd-res-t{display:block}
.vd-res-pr{display:block;font-size:12.5px;font-weight:500;opacity:.95;letter-spacing:0}
@media (max-width:760px){.vd-fechas .vd-barra{display:none !important}}

/* ---- Calendario: la estadia del cliente sin brillo hacia afuera (6 oct 2026) ---- */
.cal-dias .cd.ini,.cal-dias .cd.fin,.cal-dias .cd.prevfin,.cal-dias .cd.sel,.cal-dias .cd.prev{box-shadow:none !important}

/* ============================================================================================================================================
   LUJO, 8 oct 2026 (Carlos): texto sin separaciones raras, calendario con el ocupado TACHADO en turquesa (no pintado), comodidades por categoria en
   tarjetas, servicios a tu medida, boton de compartir y de fotos mas finos. Va AL FINAL a proposito: la hoja ya tiene varias vueltas encima de las
   mismas clases y esta es la que manda. Si algo de aqui se cambia, se cambia aqui.
   ============================================================================================================================================ */

/* ---- Texto: ni justificado ni separado. Centrado, equilibrado y con aire ---- */
.vd-info-f{position:relative;padding:0 0 54px}
.vd-info-f + .vd-info-f::before{content:"";display:block;width:54px;height:1px;background:#10b2c2;opacity:.5;margin:0 auto 40px}
.vd-info-f .vd-texto{max-width:740px;margin:0 auto}
.vd-info-f .vd-texto p,.vd-sec .vd-texto p{text-align:center !important;text-align-last:center !important;hyphens:none !important;-webkit-hyphens:none !important;
  word-spacing:normal !important;letter-spacing:.004em;font-weight:300;font-size:16.5px;line-height:1.95;margin:0 auto 16px;color:#1c2428;text-wrap:balance}
.vd-info-f:first-child .vd-texto p{font-size:17.5px;line-height:2;text-wrap:pretty}
.vd-info-f .vd-texto > :last-child{margin-bottom:0}

/* Normas y horas: pastillas finas, el icono en turquesa */
.vd-info-f .vd-normas{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 12px;margin:22px auto 0;max-width:760px}
.vd-info-f .vd-normas li{display:inline-flex;align-items:center;gap:10px;background:#f7fafb;border:1px solid #e6eef0;border-radius:999px;padding:10px 18px;font-size:14px;font-weight:400;color:#1c2428;text-align:left}
.vd-info-f .vd-normas svg{width:18px;height:18px;color:#10b2c2;opacity:1;flex:none}

/* ---- La flecha que baja a los servicios ---- */
.vd-texto .vd-baja,.vd-baja{display:flex;width:max-content;max-width:100%;align-items:center;gap:16px;margin:22px auto 26px;padding:6px 6px 6px 26px;border:1px solid #0b0c0d;border-radius:999px;
  background:#fff;color:#0b0c0d;text-decoration:none;font:600 13.5px/1 Poppins,sans-serif;letter-spacing:.05em;transition:border-color .2s,box-shadow .25s,transform .25s}
.vd-baja i{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#10b2c2;color:#fff;flex:none;transition:transform .25s}
.vd-baja svg{width:18px;height:18px}
.vd-baja:hover{border-color:#10b2c2;box-shadow:0 16px 28px -20px rgba(16,178,194,.95)}
.vd-baja:hover i{transform:translateY(3px)}

/* ---- Compartir y "ver las fotos": finos, de marca ---- */
.vd-cab .vd-comp,.vd-comp{background:transparent;border:1px solid #0b0c0d;border-radius:999px;padding:10px 20px;font-size:11.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#0b0c0d;
  display:inline-flex;align-items:center;gap:10px;transition:border-color .2s,color .2s,background .2s}
.vd-comp svg{width:16px;height:16px;color:#10b2c2}
.vd-comp:hover{border-color:#10b2c2;color:#10b2c2;background:rgba(16,178,194,.06)}
.vd-todas{display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.75);color:#0b0c0d;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:600;padding:12px 22px;border-radius:999px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 16px 30px -18px rgba(11,12,13,.6);transition:background .2s,transform .2s}
.vd-todas svg{width:16px;height:16px;color:#10b2c2;flex:none}
.vd-todas:hover{background:#fff;transform:translateY(-1px)}

/* ---- Servicios a tu medida ---- */
.vd-serv{padding-top:60px}
.vd-serv-g{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;text-align:left}
.vd-serv-g .vd-serv-c{grid-column:span 2}
.vd-serv-g .vd-serv-c:nth-child(n+4){grid-column:span 3;aspect-ratio:16/10}
@media (max-width:620px){.vd-serv-g{grid-template-columns:repeat(2,minmax(0,1fr))}.vd-serv-g .vd-serv-c,.vd-serv-g .vd-serv-c:nth-child(n+4){grid-column:span 1;aspect-ratio:4/5}.vd-serv-g .vd-serv-c:last-child{grid-column:span 2;aspect-ratio:16/10}}
.vd-serv-c{position:relative;display:block;aspect-ratio:4/5;border-radius:26px;overflow:hidden;color:#fff;text-decoration:none;isolation:isolate;box-shadow:0 30px 50px -36px rgba(11,12,13,.6)}
.vd-serv-f{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .7s}
.vd-serv-c::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(6,12,14,0) 42%,rgba(6,12,14,.8))}
.vd-serv-t{position:absolute;left:18px;right:58px;bottom:16px;z-index:2}
.vd-serv-t b{display:block;font:500 17px/1.2 Syne,Poppins,sans-serif;letter-spacing:.005em}
.vd-serv-t small{display:block;margin-top:4px;font-size:12.5px;font-weight:300;color:rgba(255,255,255,.9);line-height:1.4}
.vd-serv-c i{position:absolute;right:14px;bottom:14px;z-index:2;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#fff;color:#10b2c2;transition:transform .25s}
.vd-serv-c i svg{width:16px;height:16px}
.vd-serv-c:hover .vd-serv-f{transform:scale(1.06)}
.vd-serv-c:hover i{transform:translateX(3px)}

/* ---- Habitaciones y ubicacion ---- */
.vd-cama{border-radius:26px;overflow:hidden}
.vd-cama img{aspect-ratio:4/3}
.vd-ubic b{font:500 22px Syne,Poppins,sans-serif;letter-spacing:.005em}
.vd-ubic span{font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#5d676c}

/* ---- Tarjetas del catalogo: el boton de la foto, antes "See the full villa" (Carlos: "tan pelado"). Cristal, mayusculas finas, flecha turquesa ---- */
.vs-ver{right:14px;bottom:14px;gap:12px;padding:7px 7px 7px 20px;background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.7);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;box-shadow:0 18px 34px -20px rgba(11,12,13,.7);transition:padding .25s,background .25s,box-shadow .25s}
.vs-ver i{width:32px;height:32px}
a.vs-tarj:hover .vs-ver{background:#fff;padding-left:24px;box-shadow:0 20px 38px -18px rgba(11,12,13,.75)}

/* ---- Cosas que debes saber: tarjeta centrada, igual de fina que lo demas ---- */
.vd-saber{padding-top:56px}
.vd-saber-g{display:grid;gap:18px;max-width:700px;margin:0 auto;text-align:center}
.vd-saber-g > div{background:#fff;border:1px solid #e3eaec;border-radius:26px;padding:28px 34px;box-shadow:0 26px 50px -42px rgba(11,12,13,.4)}
.vd-saber-g h3{margin:0 0 12px;font:500 15.5px Syne,Poppins,sans-serif;letter-spacing:.01em;color:#0b0c0d}
.vd-saber-g p{margin:0 auto;font-weight:300;font-size:15.5px;line-height:1.9;color:#1c2428;text-wrap:balance}
.vd-saber-g ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-weight:300;font-size:15px}

/* ============================================================================================================================================
   LUJO 2, 8 oct 2026 (Carlos, segunda vuelta): calendario rehecho por mi (el me dio libertad), comodidades en DOS columnas una debajo de otra
   (sin tarjetas), texto en peso medio ("en negritas"), reglas en filas finas en vez de pastillas, flecha del boton de las tarjetas mas rapida y en cristal.
   ============================================================================================================================================ */

/* ---- Texto: peso medio, tinta negra. La letra fina no hacia su trabajo ---- */
.vd-info-f .vd-texto p,.vd-sec .vd-texto p{font-weight:500 !important;color:#0b0c0d;letter-spacing:.002em}
.vd-info-f:first-child .vd-texto p{font-weight:500 !important}

/* ---- Reglas y horas: filas finas con raya, el icono en turquesa. Nada de pastillas ---- */
.vd-info-f .vd-normas{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:0 44px;max-width:740px;margin:28px auto 0;text-align:left}
.vd-info-f .vd-normas li{display:flex;align-items:center;gap:14px;background:none;border:0;border-bottom:1px solid #eaf0f2;border-radius:0;padding:14px 2px;font-size:15px;font-weight:500;color:#0b0c0d;text-align:left}
.vd-info-f .vd-normas svg{width:20px;height:20px;color:#10b2c2;flex:none}

/* ---- Calendario, rehecho: tarjeta blanca, dias limpios, tachado turquesa, hoy con un punto, rango en banda ---- */
.vd-cal-sec .cal-meses{background:#fff;border:1px solid #e6eef0;border-radius:32px;padding:34px 34px 30px;box-shadow:0 34px 64px -46px rgba(11,12,13,.4);gap:36px 44px}
@media (min-width:760px){.vd-cal-sec .cal-meses .cal-mes + .cal-mes{border-left:1px solid #eef3f4;padding-left:44px}}
@media (max-width:560px){.vd-cal-sec .cal-meses{padding:26px 16px 24px}}
.cal-mes h4{font:400 21px Syne,Poppins,sans-serif;letter-spacing:.02em;text-align:center;color:#0b0c0d;margin:0 0 20px}
.cal-sem{gap:4px 2px;margin:0 0 8px}
.cal-sem span{font-size:10px;font-weight:600;letter-spacing:.24em;color:#10b2c2;text-transform:uppercase}
.cal-dias{gap:4px 2px}
.cal-dias .cd{position:relative;border:0;background:transparent;color:#0b0c0d;border-radius:50%;min-height:0;min-width:0;font-size:15px;font-weight:500;transition:background .18s,color .18s,box-shadow .18s}
.vd-cal-sec .cal-mes{min-width:0}
.cal-dias .cd.lib{background:transparent;color:#0b0c0d;border:0}
.cal-dias .cd.lib:hover{background:#fff;color:#0a8c99;box-shadow:inset 0 0 0 1.5px #10b2c2;transform:none}
.cal-dias .cd.ocu{background:transparent;border:0;color:#a7b2b6;font-weight:400;opacity:1;cursor:default;text-decoration:line-through;text-decoration-color:#10b2c2;text-decoration-thickness:2px}
.cal-dias .cd.pas{background:transparent;border:0;color:#d4dbde;font-weight:400}
.cal-dias .cd.hoy{box-shadow:none}
.cal-dias .cd.hoy::after{content:"";position:absolute;left:50%;bottom:6px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:#10b2c2}
.cal-dias .cd.sel,.cal-dias .cd.prev{background:#e4f6f8;color:#0b0c0d;border:0;border-radius:0;font-weight:600}
.cal-dias .cd.ini,.cal-dias .cd.fin,.cal-dias .cd.prevfin{background:#10b2c2;color:#fff;border:0;border-radius:50%;box-shadow:0 12px 22px -12px rgba(16,178,194,.95);text-decoration:none}
.cal-dias .cd.ini.ocu,.cal-dias .cd.fin.ocu{background:#10b2c2;color:#fff}
.cal-cab{gap:16px 28px;margin-bottom:26px}
.cal-nav button{width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.75);border:1px solid #dfe9ec;color:#10b2c2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:border-color .2s,box-shadow .2s}
.cal-nav button:hover:not(:disabled){border-color:#10b2c2;box-shadow:0 12px 22px -16px rgba(16,178,194,.95)}
.cal-nav button:disabled{opacity:.35}
.cal-ley{justify-content:center;gap:10px 36px;margin-top:26px;font-size:11.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#5d676c}
.cal-ley span{gap:10px}
.cal-ley .k{width:22px;height:22px;border-radius:50%;box-shadow:none}
.cal-ley .k.lib{background:#fff;box-shadow:inset 0 0 0 1.5px #cfe0e4}
.cal-ley .k.ocu{background:linear-gradient(135deg,transparent calc(50% - 1px),#10b2c2 calc(50% - 1px),#10b2c2 calc(50% + 1px),transparent calc(50% + 1px)),#fff;box-shadow:inset 0 0 0 1px #e3eaec}
.cal-ley .k.sel{background:#10b2c2}

/* ---- Comodidades: DOS columnas, una debajo de otra, sin tarjetas. Iconos en aro turquesa ---- */
.vd-amen{padding-top:58px}
.vd-amen-sub,.vd-serv-sub{max-width:580px;margin:-6px auto 34px;color:#5d676c;font-weight:400;font-size:15.5px;line-height:1.8}
.vd-amen-g{display:block;column-count:2;column-gap:64px;text-align:left}
@media (max-width:640px){.vd-amen-g{column-count:1}}
.vd-amen-c{break-inside:avoid;-webkit-column-break-inside:avoid;margin:0 0 34px;padding:0;background:none;border:0;border-radius:0;box-shadow:none;transform:none}
.vd-amen-c:hover{transform:none;box-shadow:none;border:0}
.vd-amen-c h3{display:flex;align-items:center;gap:12px;margin:0 0 6px;padding:0 0 14px;border-bottom:1px solid rgba(16,178,194,.55);font:600 11.5px Poppins,sans-serif;letter-spacing:.24em;text-transform:uppercase;color:#10b2c2;text-align:left}
.vd-amen-i{display:none}
.vd-amen-c ul{list-style:none;margin:0;padding:0;display:block}
.vd-amen-c li{display:flex;align-items:center;justify-content:flex-start;gap:16px;padding:12px 0;border-bottom:1px solid #eef3f4;font-size:15.5px;font-weight:500;color:#0b0c0d;line-height:1.35}
.vd-amen-ck{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px rgba(16,178,194,.45),0 10px 18px -14px rgba(16,178,194,.9);color:#10b2c2;transition:background .2s,box-shadow .2s}
.vd-amen-ck svg{width:19px;height:19px;color:#10b2c2}
.vd-amen-c li:hover .vd-amen-ck{background:rgba(16,178,194,.1)}
.vd-noinc-t{margin:6px 0 14px;font:600 11.5px Poppins,sans-serif;letter-spacing:.24em;text-transform:uppercase;color:#5d676c;text-align:center}
.vd-noinc{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.vd-noinc li{display:inline-flex;align-items:center;gap:8px;background:#f5f7f8;border-radius:999px;padding:8px 16px;font-size:13.5px;font-weight:500;color:#5d676c}
.vd-noinc svg{width:14px;height:14px;color:#10b2c2}

/* ---- Boton de las tarjetas: la flecha mas rapida y el circulo en cristal ---- */
@keyframes vsFlecha2{0%,100%{transform:translateX(-2px)}50%{transform:translateX(4px)}}
.vs-ver svg{animation:vsFlecha2 1.05s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.vs-ver svg{animation:none}}


/* ---- CRISTAL AL 100% (Carlos: "cristal al cien, no empanado; la flecha en el turquesa de la marca") ----
   El boton "View the listing" es transparente de verdad: SIN velo, SIN desenfoque, SIN tinte. Solo un borde claro con brillo y sombra fina
   para que se lea sobre fotos claras y oscuras. La flecha va en el turquesa de la marca (#10b2c2), dentro de un circulo de cristal claro. */
.vs-ver{background:transparent;border:1.5px solid #10b2c2;color:#0b0c0d;
  text-shadow:0 0 5px rgba(255,255,255,.95),0 0 12px rgba(255,255,255,.75),0 0 22px rgba(255,255,255,.5);
  -webkit-backdrop-filter:none;backdrop-filter:none;
  box-shadow:none}
.vs-ver i{background:transparent;color:#10b2c2;border:1.5px solid #10b2c2;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
.vs-ver svg{color:#10b2c2;stroke-width:2.6;filter:none}
a.vs-tarj:hover .vs-ver{background:transparent;border-color:#10b2c2;box-shadow:none}
a.vs-tarj:hover .vs-ver i{background:rgba(16,178,194,.14)}

/* ============================================================================================================================================
   NIVEL ALTO, pasada 1 (8 oct 2026, criterio propio por orden de Carlos: "llevalo al mas alto nivel"). Va al final y manda sobre las vueltas anteriores.
   Ideas: (1) el turquesa se reserva para acentos, los titulos de seccion pasan a tinta negra en Syne, (2) los bloques de lectura (descripcion, propiedad,
   acceso...) dejan de estar centrados y pasan a lectura editorial alineada a la izquierda con numero y raya fina, (3) servicios en rejilla pareja,
   (4) un solo ritmo de espacios entre secciones.
   ============================================================================================================================================ */
:root{--ritmo:76px}

/* ---- Titulos de seccion: negros, Syne, con una raya turquesa corta debajo. Ya no todo es turquesa ---- */
.vd-sec > h2,.vd-cal-sec > h2,.vd-amen > h2,.vd-serv > h2,.vd-saber > h2,.vd-dormir > h2,.vd-cars > h2{font:500 clamp(26px,2.5vw,33px)/1.15 Syne,Poppins,sans-serif;letter-spacing:-.012em;color:#0b0c0d;text-align:center;margin:0 0 12px}
.vd-sec > h2::after,.vd-cal-sec > h2::after,.vd-amen > h2::after,.vd-serv > h2::after,.vd-saber > h2::after,.vd-dormir > h2::after{content:"";display:block;width:34px;height:2px;border-radius:2px;background:#10b2c2;margin:16px auto 0}
.vd-sec{padding-top:var(--ritmo)}

/* ---- Bloques de lectura: editorial, a la izquierda, con numero y raya fina ---- */
.vd-info{counter-reset:inf;max-width:100%;padding-top:30px}
.vd-info-f{counter-increment:inf;position:relative;padding:44px 0 46px 0;border-top:1px solid #e3ecee;text-align:left}
.vd-info-f:first-child{border-top:0;padding-top:12px}
.vd-info-f + .vd-info-f::before{display:none}
.vd-info-f h3{display:flex;align-items:baseline;gap:16px;margin:0 0 18px;font:500 clamp(21px,2vw,26px)/1.2 Syne,Poppins,sans-serif;letter-spacing:-.008em;color:#0b0c0d;text-align:left}
.vd-info-f h3::before{content:counter(inf,decimal-leading-zero);font:600 11px Poppins,sans-serif;letter-spacing:.2em;color:#10b2c2;transform:translateY(-3px)}
.vd-info-f .vd-texto{max-width:640px;margin:0}
.vd-info-f .vd-texto p,.vd-sec .vd-texto p{text-align:left !important;text-align-last:left !important;text-wrap:pretty;font-size:16.5px;line-height:1.85;font-weight:400 !important;color:#2a3338;margin:0 0 16px !important;letter-spacing:0}
.vd-info-f:first-child .vd-texto p:first-child{font-size:19px;line-height:1.75;font-weight:400 !important;color:#0b0c0d;letter-spacing:-.003em}
.vd-info-f .vd-texto p b,.vd-info-f .vd-texto p strong{font-weight:600;color:#0b0c0d}

/* flecha de servicios dentro de "otros detalles": alineada a la izquierda, sobria */
.vd-texto .vd-baja,.vd-baja{margin:8px 0 28px;border:1.5px solid #10b2c2;background:transparent;padding:5px 5px 5px 22px;font:600 13px/1 Poppins,sans-serif;color:#0b0c0d}
.vd-baja i{background:#10b2c2;color:#fff;width:36px;height:36px}
.vd-baja:hover{background:rgba(16,178,194,.07);box-shadow:none;border-color:#10b2c2}

/* reglas: dos columnas, a la izquierda, filas finas */
.vd-info-f .vd-normas{max-width:640px;margin:24px 0 0;gap:0 40px;text-align:left}
.vd-info-f .vd-normas li{padding:13px 0;font-size:15px;font-weight:400;color:#2a3338}

/* ---- Servicios: rejilla pareja, 3 arriba y 2 centradas abajo del mismo ancho ---- */
.vd-serv-g{display:flex;flex-wrap:wrap;justify-content:center;gap:16px}
.vd-serv-c{flex:0 0 calc((100% - 32px)/3);aspect-ratio:4/5;border-radius:24px}
@media (max-width:620px){.vd-serv-c{flex:0 0 calc((100% - 16px)/2)}}
.vd-serv-t{left:20px;right:64px;bottom:20px}
.vd-serv-t b{font:500 18px/1.2 Syne,Poppins,sans-serif;margin-bottom:5px}
.vd-serv-t small{font-size:12.5px;line-height:1.45;font-weight:400;color:rgba(255,255,255,.92)}
.vd-serv-c::after{background:linear-gradient(180deg,rgba(6,12,14,0) 38%,rgba(6,12,14,.86))}
.vd-serv-c i{right:16px;bottom:18px;width:38px;height:38px;background:transparent;border:1.5px solid #fff;color:#fff}
.vd-serv-c:hover i{background:#10b2c2;border-color:#10b2c2}

/* NIVEL ALTO 1b: la regla vieja `.vd-info-f:not(:first-child) .vd-texto p` pesaba mas; se iguala aqui para que TODOS los bloques lean a la izquierda */
.vd-info-f:not(:first-child) .vd-texto p{text-align:left !important;text-align-last:left !important;margin:0 0 16px !important;width:auto;max-width:640px}
.vd-info-f .vd-texto{width:auto;max-width:640px;margin:0;overflow:visible}
/* servicios: la flecha va arriba a la derecha, para no chocar con el texto */
.vd-serv-c i{top:16px;bottom:auto;right:16px;width:34px;height:34px;background:rgba(11,12,13,.18);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.vd-serv-t{right:20px}

/* NIVEL ALTO 2: "¿Donde vas a dormir?" igual que los demas titulos; las camas con aire para que la sombra no se corte */
.vd-dormir-cab h2{font:500 clamp(26px,2.5vw,33px)/1.15 Syne,Poppins,sans-serif;letter-spacing:-.012em;color:#0b0c0d;text-align:center;margin:0 0 12px}
.vd-dormir-cab h2::after{content:"";display:block;width:34px;height:2px;border-radius:2px;background:#10b2c2;margin:16px auto 0}
.vd-dormir .vd-cama{box-shadow:0 14px 30px -22px rgba(11,12,13,.45),0 0 0 1px rgba(11,12,13,.06);border-radius:24px}
.vd-dormir .vd-cama img,.vd-dormir .vd-cama-ico{border-radius:24px 24px 0 0}
.vd-carsec [class*="vd-cars"],.vd-dormir .vd-cars{padding-top:8px;padding-bottom:28px}

/* NIVEL ALTO 3: "Cosas que debes saber" a todo el ancho, texto a la izquierda, rotulo en turquesa fino */
.vd-saber-g:has(> div:only-child){grid-template-columns:minmax(0,1fr)}
.vd-saber-g > div{text-align:left;padding:30px 34px;border-radius:24px;background:#fff;border:1px solid #e3ecee;box-shadow:0 20px 44px -34px rgba(11,12,13,.35)}
.vd-saber-g > div > :first-child{display:block;margin:0 0 12px;font:600 11.5px Poppins,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:#10b2c2;text-align:left}
.vd-saber-g > div p{text-align:left !important;text-align-last:left !important;font-size:16px;line-height:1.8;font-weight:400;color:#2a3338;margin:0}

/* ============================================================================================================================================
   PULIDO 8 OCT 2026, noche (Carlos, "Reservar"): barra de disponibilidad de lujo (una sola pieza de cristal blanco con las habitaciones debajo),
   boton "Find your villa", chips de habitaciones y boton "View the listing" legible (blanco, flecha turquesa). Va al final y manda.
   ============================================================================================================================================ */
.vs-barra{background:#fff;border:0;border-radius:32px;padding:10px;gap:0;box-shadow:0 40px 80px -48px rgba(11,12,13,.5),0 0 0 1px rgba(11,12,13,.05)}
.vs-barra .vs-c{padding:14px 26px;border-radius:22px;transition:background .2s}
.vs-barra .vs-c:hover{background:rgba(16,178,194,.06)}
.vs-barra .vs-c + .vs-c{box-shadow:-1px 0 0 rgba(11,12,13,.08)}
.vs-barra .vs-c > span{font-size:10.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#10b2c2}
.vs-barra .vs-c input,.vs-barra .vs-c select{font-size:16px;font-weight:500;color:#0b0c0d}
.vs-barra .vs-ir{border:0;border-radius:24px;background:#10b2c2;color:#fff;font:600 13px Poppins,sans-serif;letter-spacing:.14em;text-transform:uppercase;padding:0 36px;display:inline-flex;align-items:center;gap:14px;box-shadow:0 18px 34px -18px rgba(16,178,194,.95);transition:background .2s,transform .2s,box-shadow .2s}
.vs-barra .vs-ir::after{content:"";width:18px;height:18px;flex:none;background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");animation:vsFlecha2 1.1s ease-in-out infinite}
.vs-barra .vs-ir:hover{background:#0e9fae;transform:translateY(-1px);box-shadow:0 22px 38px -18px rgba(16,178,194,1)}

.vs-fila-f{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 22px;margin:20px 0 0;padding:0;background:none;border:0;border-radius:0;box-shadow:none;overflow:visible}
.vs-fila-f > *{padding:0;box-shadow:none !important}
.vs-fila-f .vs-hab{display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;justify-content:center;gap:8px 10px}
.vs-fila-f .vs-hab .vs-rot{flex:none;margin:0 6px 0 0;font-size:10.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#5d676c}
.vs-fila-f .vs-chip{min-width:46px;padding:10px 18px;border-radius:999px;border:1px solid rgba(11,12,13,.12);background:#fff;font-size:14px;font-weight:500;color:#0b0c0d;transition:border-color .2s,background .2s,color .2s,box-shadow .2s}
.vs-fila-f .vs-chip:hover{border-color:#10b2c2;color:#0a8c99}
.vs-fila-f .vs-chip.on{background:#10b2c2;border-color:#10b2c2;color:#fff;box-shadow:0 12px 22px -14px rgba(16,178,194,.95)}
.vs-meta{justify-content:center}

/* Boton de cada tarjeta: blanco, legible sobre cualquier foto; el circulo con la flecha en el turquesa de la marca */
.vs-ver{background:#fff;border:0;color:#0b0c0d;text-shadow:none;font-weight:600;box-shadow:0 16px 32px -14px rgba(11,12,13,.6)}
.vs-ver i{background:rgba(16,178,194,.14);border:1.5px solid #10b2c2;color:#10b2c2;box-shadow:none}
.vs-ver svg{color:#10b2c2;stroke-width:2.6}
a.vs-tarj:hover .vs-ver{background:#fff;box-shadow:0 20px 38px -14px rgba(11,12,13,.7)}
a.vs-tarj:hover .vs-ver i{background:#10b2c2;color:#fff}
a.vs-tarj:hover .vs-ver svg{color:#fff}
@media (max-width:900px){.vs-barra .vs-ir{padding:18px 24px;justify-content:center}.vs-barra .vs-c + .vs-c{box-shadow:none}}

/* ============================================================================================================================================
   PULIDO 8 OCT 2026, noche (Carlos, ficha): (1) todas las descripciones con la MISMA letra, mas chica y sin dislocarse; (2) comodidades en UNA columna,
   sin rayas, con un color por grupo; (3) "Share" y "See all photos" de lujo. Va al final y manda sobre las vueltas anteriores.
   ============================================================================================================================================ */

/* ---- 1) Texto: una sola letra para todos los bloques ---- */
.vd-info-f .vd-texto,.vd-info-f:not(:first-child) .vd-texto{width:auto;max-width:620px;margin:0}
.vd-info-f .vd-texto p,.vd-info-f:first-child .vd-texto p:first-child,.vd-info-f:not(:first-child) .vd-texto p,.vd-sec .vd-texto p{
  font-size:15.5px !important;line-height:1.85 !important;font-weight:400 !important;letter-spacing:0 !important;color:#2a3338 !important;
  text-align:left !important;text-align-last:left !important;text-wrap:pretty;margin:0 0 12px !important;max-width:620px}
.vd-info-f .vd-texto p:last-child{margin-bottom:0 !important}
.vd-info-f .vd-texto p b,.vd-info-f .vd-texto p strong{font-weight:600;color:#0b0c0d}
.vd-info-f h3{font-size:clamp(19px,1.7vw,23px)}

/* ---- 2) Comodidades: una columna, sin rayas, un color por grupo ---- */
.vd-amen-g{display:block;column-count:1;max-width:680px;margin:0 auto;text-align:left}
.vd-amen-c{--gc:#10b2c2;break-inside:auto;margin:0 0 34px;padding:0;background:none;border:0;border-radius:0;box-shadow:none}
.vd-amen-c[data-g="cocina"]{--gc:#e9822f}.vd-amen-c[data-g="exterior"]{--gc:#2f9e6f}.vd-amen-c[data-g="vistas"]{--gc:#3b82c4}
.vd-amen-c[data-g="ubicacion"]{--gc:#7c5cd6}.vd-amen-c[data-g="climatizacion"]{--gc:#0ea5c6}.vd-amen-c[data-g="internet"]{--gc:#4f6bed}
.vd-amen-c[data-g="entretenimiento"]{--gc:#7c5cd6}.vd-amen-c[data-g="familia"]{--gc:#1aa88b}.vd-amen-c[data-g="bano"]{--gc:#3aa0d8}
.vd-amen-c[data-g="dormitorio"]{--gc:#6b7fd7}.vd-amen-c[data-g="seguridad"]{--gc:#3d9a5a}.vd-amen-c[data-g="estacionamiento"]{--gc:#5d6f7a}
.vd-amen-c[data-g="energia"]{--gc:#ee8a2a}.vd-amen-c[data-g="servicios"]{--gc:#10b2c2}
.vd-amen-c h3{display:flex;align-items:center;gap:14px;margin:0 0 10px;padding:0;border:0;font:500 17px Syne,Poppins,sans-serif;letter-spacing:.01em;text-transform:none;color:#0b0c0d}
.vd-amen-i{display:grid !important;place-items:center;flex:none;width:42px;height:42px;border-radius:14px;background:color-mix(in srgb,var(--gc) 14%,#fff);color:var(--gc)}
.vd-amen-i svg{width:21px;height:21px;color:var(--gc)}
.vd-amen-c ul{list-style:none;margin:0;padding:0 0 0 56px;display:block}
.vd-amen-c li{display:flex;align-items:center;gap:12px;padding:7px 0;border:0;font-size:15px;font-weight:400;color:#2a3338;line-height:1.35}
.vd-amen-ck{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:10px;background:color-mix(in srgb,var(--gc) 10%,#fff);box-shadow:none;color:var(--gc)}
.vd-amen-ck svg{width:16px;height:16px;color:var(--gc)}
.vd-amen-c li:hover .vd-amen-ck{background:color-mix(in srgb,var(--gc) 20%,#fff)}
@media (max-width:640px){.vd-amen-c ul{padding-left:0}}

/* ---- 3) Share y See all photos ---- */
.vd-comp{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid rgba(16,178,194,.45);border-radius:999px;padding:9px 20px 9px 10px;font:600 11.5px Poppins,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#0b0c0d;box-shadow:0 14px 28px -20px rgba(16,178,194,.9);transition:background .2s,box-shadow .2s,transform .2s}
.vd-comp svg{width:30px;height:30px;padding:7px;border-radius:50%;background:#10b2c2;color:#fff;box-sizing:border-box}
.vd-comp:hover{background:rgba(16,178,194,.07);box-shadow:0 18px 30px -18px rgba(16,178,194,1);transform:translateY(-1px)}
.vd-todas{display:inline-flex;align-items:center;gap:12px;right:22px;bottom:22px;background:rgba(255,255,255,.96);border:0;border-radius:999px;padding:8px 8px 8px 22px;font:600 13px Poppins,sans-serif;letter-spacing:.04em;color:#0b0c0d;box-shadow:0 18px 34px -14px rgba(11,12,13,.65);backdrop-filter:none;-webkit-backdrop-filter:none;transition:box-shadow .2s,transform .2s}
.vd-todas svg{order:2;width:34px;height:34px;padding:8px;border-radius:50%;background:#10b2c2;color:#fff;box-sizing:border-box}
.vd-todas span{order:1}
.vd-todas:hover{background:#fff;box-shadow:0 22px 40px -14px rgba(11,12,13,.75);transform:translateY(-1px)}

/* ---- 4) Calendario: el ocupado vuelve a ir RELLENO (como al principio), en turquesa de cristal para que no chille; la bolita de hoy mas chica ---- */
.cal-dias .cd.ocu{background:rgba(16,178,194,.15);color:#0b6f7a;text-decoration:none;font-weight:500;opacity:1;border:0;box-shadow:inset 0 0 0 1px rgba(16,178,194,.22)}
.cal-dias .cd.hoy::after{width:4px;height:4px;margin-left:-2px;bottom:5px}
.cal-ley .k.ocu{background:rgba(16,178,194,.15);box-shadow:inset 0 0 0 1px rgba(16,178,194,.3)}

/* ---- 5) Sin rayitas bajo los titulos de seccion (Carlos: "las rayas de Ubicacion se ven feas") ---- */
.vd-sec > h2::after,.vd-cal-sec > h2::after,.vd-amen > h2::after,.vd-serv > h2::after,.vd-saber > h2::after,.vd-dormir > h2::after,.vd-dormir-cab h2::after{content:none !important;display:none !important}
.vd-sec > h2,.vd-cal-sec > h2,.vd-amen > h2,.vd-serv > h2,.vd-saber > h2,.vd-dormir > h2,.vd-dormir-cab h2{margin-bottom:18px}

/* ---- 8 oct 2026: seccion "Reglas de la casa" (una sola columna, sin rayas, el icono en turquesa de cristal) ---- */
.vd-reglas{padding-top:58px}
.vd-reglas .vd-normas{display:grid;grid-template-columns:1fr;gap:6px;max-width:680px;margin:6px auto 0;text-align:left}
.vd-reglas .vd-normas li{display:flex;align-items:center;gap:14px;padding:7px 0;border:0;font-size:15px;font-weight:400;line-height:1.5;color:#2a3338}
.vd-reglas .vd-normas svg{flex:none;width:34px;height:34px;padding:8px;border-radius:12px;box-sizing:border-box;background:rgba(16,178,194,.12);color:#0a8c99;opacity:1}
.vd-reglas .vd-normas li:first-child,.vd-reglas .vd-normas li:nth-child(2),.vd-reglas .vd-normas li:nth-child(3){font-weight:500;color:#0b0c0d}


/* ---- 8 oct 2026 (Carlos: "no es cambiar el color: es ponerlo mas cristal, clarito"): el MISMO turquesa de la marca, pero de cristal (claro y translucido) en "Find your villa" y en el chip escogido, "Any" ---- */
.vs-barra .vs-ir{background:rgba(16,178,194,.16);color:#0b0c0d;border:1px solid rgba(16,178,194,.55);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.vs-barra .vs-ir::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2310b2c2' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E")}
.vs-barra .vs-ir:hover{background:rgba(16,178,194,.26);box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.vs-fila-f .vs-chip.on{background:rgba(16,178,194,.16);border-color:#10b2c2;color:#0b0c0d;box-shadow:inset 0 1px 0 rgba(255,255,255,.7);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.vs-fila-f .vs-chip:hover{border-color:#10b2c2;color:#0b0c0d}
.vs-barra .vs-c > span{color:#10b2c2}

/* ---- 8 oct 2026: "Cosas que de seguro pueden interesarte" (los servicios, con su flechita "Book" hacia el mismo lugar que las tarjetas de mas abajo) ---- */
.vd-int{padding-top:58px}
.vd-int-sub{max-width:560px;margin:-4px auto 22px;text-align:center;color:#5d676c;font-size:15px;line-height:1.7}
.vd-int-g{display:grid;gap:10px;max-width:680px;margin:0 auto}
.vd-int-f{display:flex;align-items:center;gap:16px;padding:12px 14px 12px 12px;border-radius:20px;background:#fff;box-shadow:0 0 0 1px rgba(11,12,13,.07),0 18px 36px -30px rgba(11,12,13,.4);text-decoration:none;color:inherit;transition:box-shadow .2s,transform .2s}
.vd-int-f:hover{box-shadow:0 0 0 1px rgba(16,178,194,.5),0 22px 40px -28px rgba(11,12,13,.45);transform:translateY(-1px)}
.vd-int-f > span:first-child{flex:none;width:58px;height:58px;border-radius:16px;background:center/cover #e9eef0}
.vd-int-t{flex:1;min-width:0}
.vd-int-t b{display:block;font:500 16px Syne,Poppins,sans-serif;color:#0b0c0d}
.vd-int-t small{display:block;margin-top:2px;font-size:13px;color:#5d676c}
.vd-int-b{flex:none;display:inline-flex;align-items:center;gap:10px;padding:6px 6px 6px 18px;border-radius:999px;border:1px solid rgba(16,178,194,.5);background:rgba(16,178,194,.12);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font:600 12.5px Poppins,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#0b0c0d}
.vd-int-b i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:rgba(16,178,194,.2);color:#10b2c2}
.vd-int-b svg{width:15px;height:15px}
.vd-int-f:hover .vd-int-b{background:rgba(16,178,194,.22)}
@media (max-width:520px){.vd-int-f{gap:12px}.vd-int-f > span:first-child{width:48px;height:48px}.vd-int-b{padding-left:14px;letter-spacing:.08em}}
.vd-int-f,.vd-int-t{text-align:left}

/* ---- 8 oct 2026 (Carlos: "la cristalizacion tambien para Your stay, Book y el resto"): el mismo turquesa, claro y translucido, en las noches que el cliente escoge ("Your stay"); el boton Book conserva su diseno aprobado ---- */
.cal-dias .cd.ini,.cal-dias .cd.fin,.cal-dias .cd.prevfin,.cal-dias .cd.ini.ocu,.cal-dias .cd.fin.ocu{background:rgba(16,178,194,.3);color:#0b0c0d;border:0;box-shadow:inset 0 0 0 1.5px #10b2c2}
.cal-dias .cd.sel,.cal-dias .cd.prev{background:rgba(16,178,194,.12);color:#0b0c0d}
.cal-ley .k.sel{background:rgba(16,178,194,.3);box-shadow:inset 0 0 0 1.5px #10b2c2}

/* ---- 8 oct 2026 (Carlos): las descripciones no llevan numero (01, 02...) ni la raya de abajo; cada bloque con su titulo claro y aire entre uno y otro ---- */
.vd-info-f h3::before{content:none !important;display:none !important}
.vd-info-f,.vd-info-f + .vd-info-f{border-top:0 !important;padding:26px 0 8px}
.vd-info-f:first-child{padding-top:0}
.vd-info-f h3{margin:0 0 12px;font:500 clamp(19px,1.7vw,22px)/1.25 Syne,Poppins,sans-serif;letter-spacing:-.005em;color:#0b0c0d}

/* ---- 8 oct 2026 (Carlos): "Conecta con nuestro equipo" en lugar de "Tu anfitrion": mensaje directo al equipo; despues de las 5:00 p.m., WhatsApp ---- */
.vd-equipo{padding-top:64px}
.vd-eq-sub{max-width:520px;margin:-4px auto 14px;text-align:center;color:#5d676c;font-size:15px;line-height:1.7}
.vd-eq-nota{display:flex;align-items:center;justify-content:center;gap:10px;max-width:560px;margin:0 auto 22px;padding:12px 18px;border-radius:16px;background:rgba(16,178,194,.1);border:1px solid rgba(16,178,194,.3);color:#0b0c0d;font-size:13.5px;line-height:1.5;text-align:left}
.vd-eq-nota svg{flex:none;width:20px;height:20px;color:#10b2c2}
.vd-equipo.tarde .vd-eq-nota{background:rgba(16,178,194,.2);font-weight:500}
.vd-eq-f{display:grid;gap:14px;max-width:640px;margin:0 auto;padding:26px;border-radius:26px;background:#fff;box-shadow:0 0 0 1px rgba(11,12,13,.07),0 30px 60px -44px rgba(11,12,13,.45);text-align:left}
.vd-eq-fila{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:560px){.vd-eq-fila{grid-template-columns:1fr}.vd-eq-f{padding:20px}}
.vd-eq-c{display:grid;gap:6px}
.vd-eq-c > span{font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#10b2c2}
.vd-eq-c input,.vd-eq-c textarea{width:100%;box-sizing:border-box;padding:13px 16px;border:1px solid rgba(11,12,13,.14);border-radius:14px;background:#fff;font:400 15px Poppins,sans-serif;color:#0b0c0d;outline:none;transition:border-color .2s,box-shadow .2s}
.vd-eq-c textarea{resize:vertical;min-height:110px}
.vd-eq-c input:focus,.vd-eq-c textarea:focus{border-color:#10b2c2;box-shadow:0 0 0 3px rgba(16,178,194,.2)}
.vd-eq-c input.mal,.vd-eq-c textarea.mal{border-color:#b42318;box-shadow:0 0 0 3px rgba(180,35,24,.12)}
.vd-eq-err{margin:0;color:#b42318;font-size:13.5px;font-weight:500}
.vd-eq-bt{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.vd-eq-env{display:inline-flex;align-items:center;gap:12px;padding:8px 8px 8px 24px;border-radius:999px;border:1px solid rgba(16,178,194,.55);background:rgba(16,178,194,.16);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 rgba(255,255,255,.7);font:600 14px Poppins,sans-serif;color:#0b0c0d;cursor:pointer;transition:background .2s}
.vd-eq-env i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:rgba(16,178,194,.22);color:#10b2c2}
.vd-eq-env svg{width:16px;height:16px}
.vd-eq-env:hover{background:rgba(16,178,194,.26)}
.vd-eq-env.enviando{opacity:.6;pointer-events:none}
.vd-eq-wa{display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:999px;border:1px solid rgba(11,12,13,.14);background:#fff;font:600 14px Poppins,sans-serif;color:#0b0c0d;text-decoration:none;transition:border-color .2s,background .2s}
.vd-eq-wa svg{width:20px;height:20px;color:#10b2c2}
.vd-eq-wa:hover{border-color:#10b2c2;background:rgba(16,178,194,.06)}
.vd-equipo.tarde .vd-eq-wa{border-color:rgba(16,178,194,.55);background:rgba(16,178,194,.16)}
.vd-eq-ok{max-width:640px;margin:0 auto;padding:30px;border-radius:26px;background:rgba(16,178,194,.1);border:1px solid rgba(16,178,194,.3);text-align:center}
.vd-eq-ok b{display:block;font:500 20px Syne,Poppins,sans-serif;margin-bottom:6px}
.vd-eq-ok span{color:#2a3338}

/* ---- 8 oct 2026 (Carlos): comodidades en CUADRITOS DE CRISTAL del mismo tamano, tres por renglon (izquierda, centro, derecha), con el color de su grupo.
        "Lo que ando buscando es orden: que todo matche y quede bien cuadradito." ---- */
.vd-amen-g{max-width:none;margin:0}
.vd-amen-c{margin:0 0 30px}
.vd-amen-c h3{margin-bottom:14px}
.vd-amen-c ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;gap:12px;margin:0;padding:0}
.vd-amen-c li{display:flex;align-items:center;gap:12px;min-height:66px;padding:12px 14px;border-radius:18px;font-size:14px;line-height:1.3;font-weight:500;color:#0b0c0d;
  background:color-mix(in srgb,var(--gc) 8%,rgba(255,255,255,.72));border:1px solid color-mix(in srgb,var(--gc) 28%,#fff);box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 12px 24px -22px color-mix(in srgb,var(--gc) 70%,#000);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .2s,border-color .2s,transform .2s}
.vd-amen-c li:hover{background:color-mix(in srgb,var(--gc) 15%,rgba(255,255,255,.7));border-color:color-mix(in srgb,var(--gc) 45%,#fff);transform:translateY(-1px)}
.vd-amen-ck{width:34px;height:34px;border-radius:12px;background:color-mix(in srgb,var(--gc) 16%,#fff)}
.vd-amen-ck svg{width:18px;height:18px}
@media (max-width:640px){.vd-amen-c ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.vd-amen-c li{min-height:60px;padding:10px 12px;font-size:13.5px}}

/* ---- 8 oct 2026: nota del deposito de seguridad bajo el boton de reservar ---- */
.vd-dep{display:flex;gap:10px;align-items:flex-start;margin:14px 0 0;padding:12px 14px;border-radius:14px;background:rgba(16,178,194,.08);border:1px solid rgba(16,178,194,.25);font-size:12.5px;line-height:1.55;color:#2a3338;text-align:left}
.vd-dep svg{flex:none;width:18px;height:18px;margin-top:1px;color:#10b2c2}

/* ---- 8 oct 2026: filtro por gama (Luxury, Comfort, Essential) junto al de habitaciones ---- */
.vs-fila-f .vs-hab.vs-gm{margin-right:10px}

/* ---- 8 oct 2026 (Carlos): "Conecta con nuestro equipo" como un CHAT basico por WhatsApp (el de Carlos y el de Merika), sin pedir nombre ni correo; enviar = una flecha ---- */
.vd-chat{max-width:620px;margin:0 auto;padding:22px;border-radius:30px;background:#fff;box-shadow:0 0 0 1px rgba(11,12,13,.07),0 34px 64px -46px rgba(11,12,13,.5);text-align:left}
.vd-ch-cab{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.vd-ch-cab b{display:block;font:500 17px Syne,Poppins,sans-serif;color:#0b0c0d}
.vd-ch-cab i{display:block;margin-top:2px;font-style:normal;font-size:13px;color:#5d676c}
.vd-ch-pto{flex:none;width:11px;height:11px;border-radius:50%;background:#1f9d55;box-shadow:0 0 0 4px rgba(31,157,85,.18)}
.vd-ch-quien{margin:0 0 10px;font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#10b2c2}
.vd-ch-pers{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}
.vd-ch-p{display:flex;align-items:center;gap:12px;padding:8px 14px 8px 8px;border-radius:999px;border:1px solid rgba(11,12,13,.12);background:#fff;text-align:left;cursor:pointer;font:inherit;color:inherit;transition:border-color .2s,background .2s}
.vd-ch-p img{flex:none;width:46px;height:46px;border-radius:50%;object-fit:cover}
.vd-ch-p b{display:block;font-size:14.5px;font-weight:600;color:#0b0c0d}
.vd-ch-p i{display:block;font-style:normal;font-size:12px;color:#5d676c;line-height:1.3}
.vd-ch-p:hover{border-color:#10b2c2}
.vd-ch-p.on{border-color:#10b2c2;background:rgba(16,178,194,.14);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.vd-ch-cuerpo{padding:16px;border-radius:22px;background:#f3f8f9;margin-bottom:12px}
.vd-ch-bur{display:inline-block;max-width:88%;padding:12px 16px;border-radius:20px 20px 20px 6px;background:#fff;box-shadow:0 1px 0 rgba(11,12,13,.06);font-size:14.5px;line-height:1.55;color:#0b0c0d}
.vd-ch-env{display:flex;align-items:flex-end;gap:10px}
.vd-ch-env textarea{flex:1;min-width:0;resize:none;overflow-y:auto;box-sizing:border-box;padding:14px 18px;border:1px solid rgba(11,12,13,.14);border-radius:24px;background:#fff;font:400 15px/1.4 Poppins,sans-serif;color:#0b0c0d;outline:none;transition:border-color .2s,box-shadow .2s}
.vd-ch-env textarea:focus{border-color:#10b2c2;box-shadow:0 0 0 3px rgba(16,178,194,.2)}
.vd-ch-env textarea.mal{border-color:#b42318;box-shadow:0 0 0 3px rgba(180,35,24,.12)}
.vd-ch-flecha{flex:none;display:grid;place-items:center;width:50px;height:50px;border-radius:50%;border:1px solid rgba(16,178,194,.6);background:rgba(16,178,194,.2);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 rgba(255,255,255,.7);color:#10b2c2;cursor:pointer;transition:background .2s,transform .2s}
.vd-ch-flecha svg{width:22px;height:22px}
.vd-ch-flecha:hover{background:rgba(16,178,194,.32);transform:translateX(2px)}
.vd-ch-nota{margin:10px 4px 0;font-size:12px;color:#8a949a}
@media (max-width:520px){.vd-ch-pers{grid-template-columns:1fr}.vd-chat{padding:18px}}

/* ---- 8 oct 2026 (Carlos): "estudia el area contactar al anfitrion de Airbnb y haz algo asi, pero mas lujoso". Tarjetas del equipo con foto grande y "responde en menos de una
        hora", "Lo que mas preguntan" con respuestas de la ficha, preguntas sugeridas, resumen del viaje y la caja con flecha. Va al final y manda sobre el chat anterior. ---- */
.vd-chat{max-width:780px;padding:30px;border-radius:36px;background:linear-gradient(180deg,#fff 0%,#f8fcfc 100%);box-shadow:0 0 0 1px rgba(16,178,194,.18),0 44px 80px -52px rgba(11,12,13,.55)}
.vd-chat .vd-ch-quien{margin:26px 0 12px}
.vd-chat .vd-ch-quien:first-child{margin-top:0}
.vd-ch-pers{gap:14px;margin-bottom:0}
.vd-ch-p{align-items:center;gap:16px;padding:16px 18px;border-radius:26px;border:1px solid rgba(11,12,13,.1);background:#fff;box-shadow:0 14px 28px -24px rgba(11,12,13,.5)}
.vd-ch-av{position:relative;flex:none;width:72px;height:72px}
.vd-ch-av img{width:72px;height:72px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 3px #fff,0 0 0 4px rgba(16,178,194,.35)}
.vd-ch-av i{position:absolute;right:2px;bottom:2px;width:15px;height:15px;margin:0;border-radius:50%;background:#1f9d55;box-shadow:0 0 0 3px #fff;display:block}
.vd-ch-nom{min-width:0}
.vd-ch-nom b{display:block;font:500 19px Syne,Poppins,sans-serif;color:#0b0c0d}
.vd-ch-nom em{display:block;font-style:normal;font-size:13px;color:#5d676c;margin-top:1px}
.vd-ch-nom small{display:block;margin-top:5px;font-size:11.5px;font-weight:600;color:#0a8c99}
.vd-ch-p.on{border-color:#10b2c2;background:rgba(16,178,194,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 0 0 3px rgba(16,178,194,.14)}
.vd-ch-resp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:12px}
.vd-ch-r{display:flex;gap:14px;padding:16px 18px;border-radius:22px;background:rgba(16,178,194,.06);border:1px solid rgba(16,178,194,.24);box-shadow:inset 0 1px 0 rgba(255,255,255,.85);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.vd-ch-ri{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:13px;background:rgba(16,178,194,.16);color:#10b2c2}
.vd-ch-ri svg{width:19px;height:19px}
.vd-ch-r b{display:block;font:500 15px Syne,Poppins,sans-serif;color:#0b0c0d}
.vd-ch-r p{margin:5px 0 0;font-size:13px;line-height:1.55;color:#4a5558}
.vd-ch-cuerpo{padding:18px;border-radius:24px;background:#f1f7f8;margin-bottom:10px}
.vd-ch-qs{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.vd-ch-q{padding:8px 14px;border-radius:999px;border:1px solid rgba(16,178,194,.4);background:rgba(16,178,194,.08);font:500 12.5px Poppins,sans-serif;color:#0b0c0d;cursor:pointer;transition:background .2s,border-color .2s}
.vd-ch-q:hover{background:rgba(16,178,194,.2);border-color:#10b2c2}
.vd-ch-viaje{display:flex;align-items:center;gap:10px;margin:0 0 10px;padding:9px 14px;border-radius:14px;background:rgba(16,178,194,.1);border:1px solid rgba(16,178,194,.25);font-size:13px;color:#0b0c0d}
.vd-ch-viaje[hidden]{display:none}
.vd-ch-viaje svg{flex:none;width:18px;height:18px;color:#10b2c2}
@media (max-width:620px){.vd-chat{padding:20px;border-radius:28px}.vd-ch-resp{grid-template-columns:1fr}.vd-ch-av,.vd-ch-av img{width:60px;height:60px}}

/* ---- 8 oct 2026 (Carlos): comodidades TODAS JUNTAS, sin categorias: cuadritos de cristal de un mismo color (turquesa de la marca), mismo tamano, tres por renglon, letra chiquita ---- */
.vd-amen-todas{--gc:#10b2c2;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:60px;gap:10px}
.vd-amen-todas li{display:flex;align-items:center;gap:10px;height:100%;min-height:0;padding:0 12px;border-radius:16px;font-size:12.5px;line-height:1.25;font-weight:500;color:#0b0c0d;
  background:rgba(16,178,194,.07);border:1px solid rgba(16,178,194,.26);box-shadow:inset 0 1px 0 rgba(255,255,255,.85);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);overflow:hidden}
.vd-amen-todas li:hover{background:rgba(16,178,194,.14);border-color:rgba(16,178,194,.45);transform:none}
.vd-amen-todas .vd-amen-ck{flex:none;width:30px;height:30px;border-radius:10px;background:rgba(16,178,194,.16);color:#10b2c2}
.vd-amen-todas .vd-amen-ck svg{width:16px;height:16px;color:#10b2c2}
.vd-amen-todas li > span:last-child{min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:640px){.vd-amen-todas{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:58px;gap:8px}.vd-amen-todas li{padding:0 10px;font-size:12px}}

/* ---- 8 oct 2026 (Carlos): cuadritos de comodidades FINOS: solo el alto que ocupa la letra, arriba y abajo ---- */
.vd-amen-todas{grid-auto-rows:auto;gap:8px}
.vd-amen-todas li{height:auto;padding:7px 12px;gap:9px;border-radius:14px;font-size:12px;line-height:1.2}
.vd-amen-todas .vd-amen-ck{width:24px;height:24px;border-radius:8px}
.vd-amen-todas .vd-amen-ck svg{width:14px;height:14px}
@media (max-width:640px){.vd-amen-todas{grid-auto-rows:auto;gap:7px}.vd-amen-todas li{padding:7px 10px;font-size:11.5px}}

/* ---- 8 oct 2026 (Carlos): calendario de la ficha. "Your stay" = turquesa del sitio pero mas cristal, nada pesado ("que no sea chichon"); "Booked" toma el aspecto que tenia "Your stay"; "Available" en blanco ---- */
.cal-dias .cd.ocu{background:rgba(16,178,194,.3);color:#0b0c0d;font-weight:500;border:0;box-shadow:inset 0 0 0 1.5px #10b2c2;text-decoration:none}
.cal-dias .cd.ini,.cal-dias .cd.fin,.cal-dias .cd.prevfin,.cal-dias .cd.ini.ocu,.cal-dias .cd.fin.ocu{background:rgba(16,178,194,.14);color:#0b0c0d;border:0;box-shadow:inset 0 0 0 1px rgba(16,178,194,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.cal-dias .cd.sel,.cal-dias .cd.prev{background:rgba(16,178,194,.07);color:#0b0c0d}
.cal-dias .cd.lib:not(.sel):not(.ini):not(.fin):not(.prev):not(.prevfin){background:#fff}
.cal-ley .k.ocu{background:rgba(16,178,194,.3);box-shadow:inset 0 0 0 1.5px #10b2c2}
.cal-ley .k.sel{background:rgba(16,178,194,.14);box-shadow:inset 0 0 0 1px rgba(16,178,194,.55)}
.cal-ley .k.lib{background:#fff;box-shadow:inset 0 0 0 1.5px #d5dde0}

/* 8 oct 2026 (Carlos): "Community" arriba, en negrita, sobre la comunidad en la cabecera de la ficha */
.vd-lugar > span{display:flex;flex-direction:column;gap:2px;align-items:inherit}
.vd-lugar .vd-com{font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#0b0c0d}

/* 8 oct 2026 (Carlos): "Community" arriba, en negrita, en las tarjetas del catalogo */
.vs-lugar{display:flex;flex-direction:column;gap:2px;align-items:flex-end}
.vs-lugar .vs-com{font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#0b0c0d}

/* ---- 8 oct 2026 (Carlos): "Booked" y "Your stay" en el AZUL del calendario interno para las reservas del sitio web (#3d5afe), pero cristalizado como el turquesa ---- */
.cal-dias .cd.ocu{background:rgba(61,90,254,.2);color:#0b0c0d;font-weight:500;border:0;box-shadow:inset 0 0 0 1.5px rgba(61,90,254,.55);text-decoration:none}
.cal-dias .cd.ini,.cal-dias .cd.fin,.cal-dias .cd.prevfin,.cal-dias .cd.ini.ocu,.cal-dias .cd.fin.ocu{background:rgba(61,90,254,.2);color:#0b0c0d;border:0;box-shadow:inset 0 0 0 1.5px rgba(61,90,254,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.cal-dias .cd.sel,.cal-dias .cd.prev{background:rgba(61,90,254,.09);color:#0b0c0d}
.cal-ley .k.ocu{background:rgba(61,90,254,.2);box-shadow:inset 0 0 0 1.5px rgba(61,90,254,.55)}
.cal-ley .k.sel{background:rgba(61,90,254,.2);box-shadow:inset 0 0 0 1.5px rgba(61,90,254,.55)}
.cal-dias .cd.ini.sel,.cal-dias .cd.fin.sel,.cal-dias .cd.ini.prev,.cal-dias .cd.fin.prev{background:rgba(61,90,254,.2);box-shadow:inset 0 0 0 1.5px rgba(61,90,254,.55)}

/* 8 oct 2026 (Carlos: "busca el codigo de color, esta saliendo un pulpo raro"): el codigo real es #3d5afe (INDIGO VIVO, canal "Sitio web", villas.js del calendario). Un relleno muy transparente lo vuelve lavanda; por eso el aro y el numero van en el #3d5afe pleno y el relleno es apenas un velo del mismo azul */
.cal-dias .cd.ocu,.cal-dias .cd.ini,.cal-dias .cd.fin,.cal-dias .cd.prevfin,.cal-dias .cd.ini.ocu,.cal-dias .cd.fin.ocu,.cal-dias .cd.ini.sel,.cal-dias .cd.fin.sel,.cal-dias .cd.ini.prev,.cal-dias .cd.fin.prev{background:rgba(61,90,254,.1);color:#3d5afe;font-weight:600;box-shadow:inset 0 0 0 1.5px #3d5afe}
.cal-dias .cd.sel,.cal-dias .cd.prev{background:rgba(61,90,254,.06);color:#3d5afe}
.cal-ley .k.ocu,.cal-ley .k.sel{background:rgba(61,90,254,.1);box-shadow:inset 0 0 0 1.5px #3d5afe}
.cal-dias .cd.ini,.cal-dias .cd.fin,.cal-dias .cd.prevfin{box-shadow:inset 0 0 0 1.5px #3d5afe !important}

/* 8 oct 2026 (Carlos): "Booked" vuelve al color de la MARCA y se ve como cuando pasas el puntero por una fecha libre: blanco con aro turquesa #10b2c2. "Your stay" se queda en el azul #3d5afe de cristal. */
.cal-dias .cd.ocu:not(.ini):not(.fin):not(.sel):not(.prev):not(.prevfin){background:#fff;color:#0a8c99;font-weight:500;box-shadow:inset 0 0 0 1.5px #10b2c2;text-decoration:none}
.cal-ley .k.ocu{background:#fff;box-shadow:inset 0 0 0 1.5px #10b2c2}

/* ---- 8 oct 2026 (Carlos): el catalogo ("Ver todas nuestras propiedades" y "Book") con el MISMO estilo de la portada: portada + tres fotos, "Villa N" de cristal abajo a la izquierda y "See full listing" blanco con turquesa abajo a la derecha, con la flecha en movimiento ---- */
.vs-foto.vs-mos{display:grid;grid-template-rows:minmax(0,1fr) 27%;gap:4px;aspect-ratio:4/4.3;background:#fff;border-radius:16px}
.vs-foto.vs-mos > img.vs-g{width:100%;height:100%;min-height:0;border-radius:16px 16px 0 0}
.vs-minis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;min-height:0;overflow:hidden;border-radius:0 0 16px 16px}
.vs-minis img{width:100%;height:100%;object-fit:cover;display:block}
a.vs-tarj:hover .vs-foto.vs-mos > img.vs-g{transform:none}
a.vs-tarj:hover .vs-minis img{transform:scale(1.05)}
.vs-vnum{position:absolute;z-index:3;left:12px;bottom:12px;padding:5px 12px;border-radius:999px;font:600 10.5px/1.2 Poppins,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:rgba(4,14,18,.24);border:1px solid rgba(255,255,255,.5);-webkit-backdrop-filter:blur(10px) saturate(1.2);backdrop-filter:blur(10px) saturate(1.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 10px 24px -14px rgba(4,14,18,.6);text-shadow:0 1px 6px rgba(4,14,18,.35);pointer-events:none}
.vs-foto .vs-ver{position:absolute;z-index:3;right:12px;bottom:12px;left:auto;top:auto;display:inline-flex;align-items:center;gap:7px;padding:4px 4px 4px 12px;border-radius:999px;background:#fff;color:#0b0c0d;border:0;font:600 11px Poppins,sans-serif;letter-spacing:.03em;text-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 8px 20px -10px rgba(4,14,18,.6)}
.vs-foto .vs-ver i{display:grid;place-items:center;width:18px;height:18px;border:0;border-radius:50%;background:rgba(16,178,194,.16);color:#10b2c2;box-shadow:none}
.vs-foto .vs-ver svg{width:11px;height:11px;color:#10b2c2;stroke-width:2.8;animation:vcFlecha .75s ease-in-out infinite}
a.vs-tarj:hover .vs-foto .vs-ver{background:#fff;padding-left:12px;box-shadow:0 10px 24px -10px rgba(16,178,194,.9)}
a.vs-tarj:hover .vs-foto .vs-ver i{background:rgba(16,178,194,.16);color:#10b2c2}
a.vs-tarj:hover .vs-foto .vs-ver svg{color:#10b2c2}
.vs-foto.vs-mos .vs-vnum,.vs-foto.vs-mos .vs-ver{bottom:calc(27% + 4px + 12px)}
.vs-foto.vs-mos .vs-sello{bottom:auto;top:12px}
@keyframes vcFlecha{0%,100%{transform:translateX(-2px)}50%{transform:translateX(3px)}}
@media (prefers-reduced-motion:reduce){.vs-foto .vs-ver svg{animation:none}}
.vs-foto .vs-ver{text-transform:none;letter-spacing:.03em}

/* 8 oct 2026 (Carlos): "Reservar ahora" y lo que incluye el precio, en las tarjetas del catalogo */
.pr-inc{margin:2px 0 0;font-size:12px;line-height:1.45;color:#5d676c}
.bk-ahora{display:flex;align-items:center;justify-content:center;margin-top:14px;padding:12px 18px;border-radius:999px;background:#10b2c2;color:#fff;font:600 13.5px Poppins,sans-serif;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:background .2s,transform .2s;box-shadow:0 14px 26px -16px rgba(16,178,194,.95)}
.bk-ahora:hover,.bk-ahora:focus-visible{background:#0e9fae;transform:translateY(-1px);outline:none}

/* 8 oct 2026 (Carlos): "Book now" mas de lujo y SIN brillo que se salga del boton hacia abajo. Turquesa de la marca plano, con aro interior fino, un destello que cruza SOLO por dentro (el boton recorta todo lo que se sale), y un circulo blanco con flecha a la derecha que avanza al pasar el puntero. Sin sombras hacia afuera. */
.bk-ahora{position:relative;overflow:hidden;isolation:isolate;display:flex;align-items:center;justify-content:center;margin-top:16px;min-height:50px;padding:0 64px 0 28px;border-radius:999px;background:#10b2c2;color:#fff;font:600 12.5px Poppins,sans-serif;letter-spacing:.2em;text-transform:uppercase;text-align:center;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(255,255,255,.28),inset 0 1px 0 rgba(255,255,255,.45);transition:background .3s,letter-spacing .3s;-webkit-tap-highlight-color:transparent}
.bk-ahora::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:-60%;width:45%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.38),transparent);transform:skewX(-18deg);animation:bkBrillo 4.8s ease-in-out infinite}
.bk-ahora::after{content:"";position:absolute;top:50%;right:6px;width:38px;height:38px;margin-top:-19px;border-radius:50%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2310b2c2' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/16px no-repeat;transition:transform .3s}
.bk-ahora:hover,.bk-ahora:focus-visible{background:#0fa6b5;letter-spacing:.24em;transform:none;outline:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.4),inset 0 1px 0 rgba(255,255,255,.5)}
.bk-ahora:hover::after,.bk-ahora:focus-visible::after{transform:translateX(-3px)}
.bk-ahora:active{background:#0e9aa8}
@keyframes bkBrillo{0%,55%{left:-60%}100%{left:130%}}
@media (prefers-reduced-motion:reduce){.bk-ahora::before{animation:none;display:none}}

/* 8 oct 2026 (Carlos): fuera el destello que cruzaba ("se ve reguerosa"); ahora se mueve la FLECHITA, sola y sin parar, como diciendo "reservame, reservame": va y viene dentro de su circulo */
.bk-ahora::before{display:none !important;animation:none !important}
.bk-ahora::after{animation:bkFlecha .8s ease-in-out infinite;background-position:calc(50% - 3px) center}
@keyframes bkFlecha{0%,100%{background-position:calc(50% - 3px) center}50%{background-position:calc(50% + 5px) center}}
.bk-ahora:hover::after,.bk-ahora:focus-visible::after{transform:none}
@media (prefers-reduced-motion:reduce){.bk-ahora::after{animation:none;background-position:center}}

/* 8 oct 2026 (Carlos): la flechita va del lado IZQUIERDO, apuntando al "Book now", y se mueve hacia el texto como haciendo senal */
.bk-ahora{padding:0 28px 0 64px}
.bk-ahora::after{right:auto;left:6px}

/* ---- 8 oct 2026 (Carlos): la caja de reservar sube un poco, y debajo de Book va "Invertir en una propiedad como esta", fino y elegante ---- */
.vd-reserva{top:calc(var(--alto-cab,0px) + 4px)}
.vd-res-in{padding-top:16px}
.vd-inv{display:flex;align-items:center;justify-content:center;gap:9px;margin:14px 0 2px;padding:6px 8px;text-decoration:none;font:500 12.5px Poppins,sans-serif;letter-spacing:.04em;color:#4a5558;transition:color .2s}
.vd-inv svg{flex:none;width:16px;height:16px;color:#10b2c2}
.vd-inv span{border-bottom:1px solid rgba(16,178,194,.45);padding-bottom:1px;transition:border-color .2s}
.vd-inv i{font-style:normal;color:#10b2c2;display:inline-block;animation:comFlecha .9s ease-in-out infinite}
.vd-inv:hover{color:#0b0c0d}
.vd-inv:hover span{border-color:#10b2c2}
@media (prefers-reduced-motion:reduce){.vd-inv i{animation:none}}

/* ---- 8 oct 2026 (Carlos): igual que la portada: titulo en una linea y frase sensorial en una linea, con su letra ---- */
.vs-cuerpo h3{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:2px 0 0}
.vs-sub{display:block;margin:6px 0 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:"Instrument Sans",Poppins,sans-serif;font-style:italic;font-weight:400;font-size:15.5px;color:#10b2c2}

/* 8 oct 2026 (Carlos): igual en el catalogo: Figtree cursiva en negrita, letras mas pegadas */
.vs-sub{font-family:"Figtree",Poppins,sans-serif;font-style:italic;font-weight:600;letter-spacing:-.025em;word-spacing:-.04em}

/* ---- 8 oct 2026 (Carlos, cambios desde la vista del telefono) ---- */
/* Casa Linda (y cualquier comunidad con ficha) dentro de un texto: subrayada y en el turquesa de la marca */
.com-enlace{color:#10b2c2;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;font-weight:inherit;transition:color .2s}
.com-enlace:hover{color:#0a8c99}
/* La comunidad, debajo de "Cosas que de seguro pueden interesarte" */
.vd-comu{padding-top:58px;text-align:center}
.vd-comu-p{max-width:620px;margin:0 auto 16px;font-size:17px;line-height:1.7;color:#2c3236;font-weight:400}
.vd-comu .vd-texto{max-width:680px;margin:0 auto;text-align:left}
.vd-comu-mapa{margin:16px 0 0;font-size:15px;font-weight:500}
/* El chat basico: Merika y Carlos, el saludo y la caja */
.vd-chat{max-width:620px;padding:22px}
.vd-ch-pers{margin-bottom:12px}
/* Boton "Hoy / Today" del calendario */
.cal-nav{display:flex;align-items:center;gap:8px}
.cal-hoy{padding:7px 14px;border-radius:999px;border:1px solid rgba(16,178,194,.55);background:rgba(16,178,194,.1);color:#0b0c0d;font:600 12px Poppins,sans-serif;letter-spacing:.04em;cursor:pointer;transition:background .2s}
.cal-hoy:hover{background:rgba(16,178,194,.22)}
/* Un Book chiquito bajo las fotos (solo donde no se ve la caja de reservar: telefono y tableta) */
.vd-gal-book{display:none}
@media (max-width:1020px){
  .vd-gal-book{display:flex;justify-content:flex-end;margin:10px 0 0}
  .vd-gal-book .boton{width:auto;min-height:0;padding:9px 30px;font-size:14px;line-height:1.2}
}
@media (max-width:640px){
  /* El titulo de la villa de borde a borde, sin partirse en tres renglones */
  .vd-cab h1,.vd-cab h1.vd-pal{font-size:clamp(16px,5.1vw,21px);line-height:1.22;letter-spacing:-.02em;text-wrap:balance}
  .vd-cab h1.vd-pal .pt{margin:0 .3em}
  /* available / booked / your stay: los tres en una linea y del mismo largo */
  .cal-ley{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;letter-spacing:.03em;font-size:10px}
  .cal-ley span{justify-content:center;gap:5px;white-space:nowrap}
  .cal-ley .k{width:15px;height:15px}
}
.cal-nav button.cal-hoy{width:auto;height:auto;min-width:0;padding:7px 14px;border-radius:999px}
.cal-nav button.cal-hoy{width:auto;height:36px;min-width:64px;padding:0 18px;border-radius:999px;aspect-ratio:auto}

/* ---- 8 oct 2026 (Carlos): reglas de la casa escritas, sin iconos ---- */
.vd-reglas .vd-normas-txt{display:block;max-width:680px;margin:6px auto 0;padding:0;list-style:none;text-align:left}
.vd-reglas .vd-normas-txt li{display:block;padding:11px 0;border-bottom:1px solid rgba(11,12,13,.08);font-size:15.5px;line-height:1.65;font-weight:400;color:#2a3338}
.vd-reglas .vd-normas-txt li:last-child{border-bottom:0}
.vd-reglas .vd-normas-txt li:first-child,.vd-reglas .vd-normas-txt li:nth-child(2),.vd-reglas .vd-normas-txt li:nth-child(3){font-weight:400;color:#2a3338}

/* ---- 8 oct 2026 (Carlos: "el buscador esta feo, dale lujo, llevalo a otro nivel"): una sola pieza de cristal en forma de pildora, cada campo con su icono en un circulo turquesa, divisores que se desvanecen, y el boton de buscar con su flecha en movimiento (sin brillo hacia afuera) ---- */
.vs-barra{position:relative;grid-template-columns:1.15fr 1.15fr .85fr .75fr auto;align-items:stretch;padding:8px;border:0;border-radius:999px;background:linear-gradient(180deg,#fff 0%,#fbfefe 100%);box-shadow:0 0 0 1px rgba(16,178,194,.32),0 1px 0 rgba(255,255,255,.9) inset,0 30px 60px -44px rgba(11,12,13,.45)}
.vs-barra .vs-c{position:relative;display:flex;flex-direction:column;justify-content:center;gap:3px;min-height:68px;padding:10px 22px 10px 66px;border-radius:999px;background:transparent;transition:background .25s,box-shadow .25s}
.vs-barra .vs-c + .vs-c{box-shadow:none}
.vs-barra .vs-c + .vs-c::before{content:"";position:absolute;left:-1px;top:20%;bottom:20%;width:1px;background:linear-gradient(180deg,rgba(16,178,194,0),rgba(16,178,194,.45),rgba(16,178,194,0))}
.vs-barra .vs-c:hover{background:rgba(16,178,194,.06)}
.vs-barra .vs-c:focus-within{background:rgba(16,178,194,.1);box-shadow:inset 0 0 0 1px rgba(16,178,194,.5)}
.vs-ic{position:absolute;left:20px;top:50%;display:grid;place-items:center;width:36px;height:36px;margin-top:-18px;border-radius:50%;background:rgba(16,178,194,.13);color:#10b2c2;transition:background .25s,color .25s}
.vs-ic svg{width:18px;height:18px}
.vs-barra .vs-c:focus-within .vs-ic,.vs-barra .vs-c:hover .vs-ic{background:#10b2c2;color:#fff}
.vs-barra .vs-c > span{font:600 10.5px Poppins,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:#0a8c99}
.vs-barra .vs-c input,.vs-barra .vs-c select{font:500 16px Poppins,sans-serif;color:#0b0c0d}
.vs-barra .vs-ir{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:230px;padding:0 30px 0 74px;border-radius:999px;background:#10b2c2;border:0;color:#fff;font:600 12.5px Figtree,Poppins,sans-serif;letter-spacing:.2em;text-transform:uppercase;box-shadow:inset 0 0 0 1px rgba(255,255,255,.28),inset 0 1px 0 rgba(255,255,255,.45);backdrop-filter:none;-webkit-backdrop-filter:none;transition:background .25s}
.vs-barra .vs-ir:hover{background:#0fa6b5;transform:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.28),inset 0 1px 0 rgba(255,255,255,.45)}
.vs-barra .vs-ir::after{content:"";position:absolute;top:50%;left:8px;right:auto;width:44px;height:44px;margin-top:-22px;border-radius:50%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2310b2c2' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") calc(50% - 3px) center/18px no-repeat;animation:vsBuscaFlecha .8s ease-in-out infinite}
@keyframes vsBuscaFlecha{0%,100%{background-position:calc(50% - 3px) center}50%{background-position:calc(50% + 5px) center}}
@media (prefers-reduced-motion:reduce){.vs-barra .vs-ir::after{animation:none;background-position:center}}
@media (max-width:900px){
  .vs-barra{grid-template-columns:1fr 1fr;border-radius:30px;padding:8px}
  .vs-barra .vs-c{border-radius:22px;min-height:62px;padding:8px 12px 8px 54px}
  .vs-barra .vs-c + .vs-c::before{display:none}
  .vs-ic{left:12px;width:32px;height:32px;margin-top:-16px}
  .vs-barra .vs-c input,.vs-barra .vs-c select{font-size:15px}
  .vs-barra .vs-ir{grid-column:1/-1;min-height:56px;margin-top:6px;min-width:0}
}
.vs-barra{grid-template-columns:1.2fr 1.2fr 1fr .85fr auto}
.vs-barra .vs-ir{min-width:224px}
.vs-barra label.vs-c.f-vacia::after{left:66px;bottom:14px;font:400 16px Poppins,sans-serif;color:#6a7478}
.vs-barra .vs-c input{padding-right:6px}
@media (max-width:900px){.vs-barra label.vs-c.f-vacia::after{left:54px;bottom:11px;font-size:15px}}
@media (max-width:900px){
  .vs-barra{grid-template-columns:1fr 1fr;border-radius:30px;padding:8px}
  .vs-barra .vs-c{border-radius:22px;min-height:62px;padding:8px 10px 8px 52px}
  .vs-barra .vs-ir{grid-column:1/-1;min-height:56px;margin-top:6px;min-width:0;width:100%}
  .vs-barra .vs-c input,.vs-barra .vs-c select{font-size:14.5px;width:100%}
  .vs-barra .vs-c > span{letter-spacing:.16em}
}
@media (max-width:900px){.vs-barra label.vs-c.f-vacia::after{font-size:13.5px;max-width:calc(100% - 82px);white-space:nowrap;overflow:hidden}}
/* aire entre los filtros de habitaciones y la banda de inversion (estaban pegados: 4 px) */
.vs-fila-f{margin-bottom:22px}
.inv-banda.inv-cat{margin:0 auto 18px}
@media (max-width:900px){.vs-fila-f{margin-bottom:20px}.inv-banda.inv-cat{margin:0 auto 14px}}
/* el campo escogido ya no se pega al boton de buscar */
.vs-barra .vs-ir{margin-left:10px}
@media (max-width:900px){.vs-barra .vs-ir{margin-left:0}}
/* 8 oct 2026 (Carlos): las rayas entre campos del buscador, REALES: del mismo largo, de un solo color y con las puntas rectas (antes se desvanecian y terminaban en punta fina) */
.vs-barra .vs-c + .vs-c::before{top:20%;bottom:20%;width:1px;background:rgba(16,178,194,.45);border-radius:0}
