/* ==========================================================================
   LEB PARK — estilos
   Paleta tomada del barrio: verde de puertas y bancos porteños, revoque
   claro, y el ocre de las baldosas calcáreas como único acento.
   ========================================================================== */

:root{
  /* Verde de la marca, tomado de la lámina Olive: #848867.
     Los otros dos verdes son el mismo color más profundo y más claro,
     para que el texto se lea bien encima. */
  --olivo:      #848867;
  --verde:      #565b42;   /* olivo profundo: secciones oscuras y botones */
  --verde-alto: #6d7256;   /* hover */
  --verde-humo: #656a4e;   /* texto secundario sobre fondo claro */
  --tinta:      #2f3327;
  --papel:      #f4f3ed;
  --papel-alto: #fbfaf6;
  --piedra:     #dedcd0;
  --ocre:       #7e6f4c;   /* arena, solo para detalles y foco */

  --sans: "Jost", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --serif: "Cormorant Garamond", Garamond, Georgia, "Times New Roman", serif;

  --mg: clamp(20px, 5vw, 72px);
  --gap: clamp(28px, 4vw, 48px);
  --sec: clamp(72px, 11vw, 148px);
  --head: 68px;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:.01ms !important; transition-duration:.01ms !important; }
}

body{
  margin:0;
  /* revoque verde suave de fondo, en vez del blanco plano */
  background:var(--papel) url("../img/textura.jpg") repeat;
  background-size:520px auto;
  color:var(--tinta);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.is-locked{ overflow:hidden; }

img{ display:block; max-width:100%; }
a{ color:inherit; }
button{ font:inherit; color:inherit; }

:focus-visible{ outline:2px solid var(--ocre); outline-offset:3px; }

/* -------------------------------------------------------------- tipografía */
h1,h2,h3,h4{ margin:0; font-weight:400; line-height:1.1; letter-spacing:-.005em; }

.t-hero{
  font-family:var(--serif);
  font-size:clamp(3.2rem, 9vw, 6.4rem);
  font-weight:300;
  letter-spacing:.045em;
  line-height:1.02;
}
.t-sec{
  font-family:var(--serif);
  font-size:clamp(2.2rem, 5.4vw, 4.1rem);
  font-weight:300;
  line-height:1.05;
  max-width:18ch;
}
.t-med{ font-family:var(--serif); font-size:clamp(1.6rem, 3vw, 2.4rem); font-weight:400; }
.t-sm{ font-size:1.05rem; font-weight:500; }

.serif{ font-family:var(--serif); font-weight:300; font-style:italic; letter-spacing:0; }

/* La bajada de marca va en sans finita y espaciada, como en la lámina del color */
.linea-marca{
  font-size:clamp(.82rem,1.6vw,1rem);
  letter-spacing:.32em;
  text-transform:uppercase;
  font-weight:300;
}

.rotulo{
  font-size:.72rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  font-weight:500;
  color:var(--verde-humo);
  margin:0 0 1.4rem;
  display:block;
}
/* Rótulo subrayado, con la línea separada del texto */
.rotulo--sub{ border-bottom:1px solid var(--olivo); padding-bottom:10px; display:inline-block; }
.sec--verde .rotulo--sub{ border-color:rgba(242,241,236,.4); }

.bajada{ max-width:56ch; font-size:1.06rem; color:#4c5241; }

/* -------------------------------------------------------------- estructura */
.wrap{ padding-inline:var(--mg); }
.sec{ padding-block:var(--sec); }
.sec--verde{ background:var(--verde); color:var(--papel); }

/* Bloque en el olivo puro de la marca, con texto muy oscuro para que se lea bien */
.sec--olivo{ background:var(--olivo); color:#23261c; }
.sec--olivo .bajada{ color:#2c301f; }
.sec--olivo .rotulo{ color:#3a3f2b; }
.sec--olivo .tarifas li{ border-color:rgba(35,38,28,.28); }
.sec--olivo .tarifas span{ color:#3a3f2b; }
.sec--olivo .btn--claro{ background:#23261c; border-color:#23261c; color:var(--papel); }
.sec--olivo .btn--claro:hover{ background:#2f3327; border-color:#2f3327; }
.sec--olivo .ph-box{
  background:repeating-linear-gradient(45deg, rgba(35,38,28,.06) 0 12px, rgba(35,38,28,.12) 12px 24px);
  border-color:rgba(35,38,28,.32); color:#3a3f2b;
}
.sec--verde .bajada{ color:#d3d5c1; }
.sec--verde .rotulo{ color:#b4b79e; }
.linea{ border:0; border-top:1px solid var(--piedra); margin:0 var(--mg); }

/* La presentación ocupa todo el ancho, arriba de la grilla de motivos */
.cab--intro{ display:block; margin-bottom:0; }
#departamentos .cab--intro{ margin-bottom:clamp(22px,3vw,34px); }
/* Entra en un solo renglón en desktop; en celular se acomoda en dos */
/* Entra en un renglón en escritorio; en pantallas chicas se acomoda sola */
#departamentos .cab--intro .bajada{ margin-top:16px; max-width:none; font-size:1.05rem; }
.cab--intro .t-sec{ max-width:none; font-size:clamp(2.1rem, 4.6vw, 3.7rem); text-wrap:balance; }
/* En escritorio, el título de departamentos entra en un solo renglón */
@media (min-width:1000px){ #departamentos .cab--intro .t-sec{ white-space:nowrap; } }
.cab--intro .bajada{ max-width:52ch; margin-top:22px; }
.rotulo--motivos{ margin:clamp(40px,6vw,64px) 0 20px; }
.cab{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:clamp(32px,5vw,64px); }
/* Va después de .cab a propósito: si no, el título y la bajada quedan uno al
   lado del otro en vez de uno debajo del otro. */
.cab.cab--intro{ display:block; margin-bottom:0; }

/* -------------------------------------------------------------- botones */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 28px; min-height:52px;
  border:1px solid var(--verde); background:var(--verde); color:var(--papel);
  text-decoration:none; cursor:pointer;
  font-size:.8rem; letter-spacing:.18em; text-transform:uppercase; font-weight:400;
  transition:background .18s ease, color .18s ease, border-color .18s ease;
}
.btn:hover{ background:var(--verde-alto); border-color:var(--verde-alto); }
.btn--linea{ background:transparent; color:var(--verde); }
.btn--linea:hover{ background:var(--verde); color:var(--papel); }
.btn--claro{ background:var(--papel); border-color:var(--papel); color:var(--verde); }
.btn--claro:hover{ background:#fff; border-color:#fff; }
.btn--fantasma{ background:transparent; border-color:rgba(242,241,236,.55); color:var(--papel); }
.btn--fantasma:hover{ background:rgba(242,241,236,.12); border-color:var(--papel); }
.btn--ancho{ width:100%; }

.enlace{
  display:inline-block; text-decoration:none; padding-bottom:3px;
  border-bottom:1px solid currentColor;
  font-size:.8rem; letter-spacing:.18em; text-transform:uppercase; font-weight:400;
}
.enlace:hover{ color:var(--olivo); border-color:var(--olivo); }

/* -------------------------------------------------------------- header */
.head{
  position:fixed; inset:0 0 auto; z-index:60; height:var(--head);
  display:flex; align-items:center; justify-content:space-between;
  padding-inline:var(--mg);
  color:var(--papel);
  transition:background .3s ease, color .3s ease, box-shadow .3s ease;
}
.head::before{
  content:""; position:absolute; inset:0 0 -44px; z-index:-1;
  background:linear-gradient(to bottom, rgba(24,26,19,.68) 0%, rgba(24,26,19,.28) 55%, rgba(24,26,19,0) 100%);
  transition:opacity .3s ease;
}
.head.is-solido{ background:var(--papel); color:var(--tinta); box-shadow:0 1px 0 var(--piedra); }
.head.is-solido::before{ opacity:0; }
.head.is-solido .head__logo{ color:var(--verde); }

.head__logo{
  display:flex; align-items:center; gap:11px;
  text-decoration:none; font-family:var(--serif); font-size:1.42rem; font-weight:400;
  letter-spacing:.05em; white-space:nowrap; line-height:1;
}
.head__logo img{ height:34px; width:auto; display:block; }
/* Sombra sutil solo cuando el header está sobre la foto */
.head:not(.is-solido) .head__logo,
.head:not(.is-solido) .head__nav a{ text-shadow:0 1px 8px rgba(18,20,14,.55); }
.head:not(.is-solido) .head__logo img{ filter:drop-shadow(0 1px 4px rgba(18,20,14,.6)); }
.head__logo .oscuro{ display:none; }
.head.is-solido .head__logo .claro{ display:none; }
.head.is-solido .head__logo .oscuro{ display:block; }
.head__nav{ display:flex; align-items:center; gap:clamp(16px,2.2vw,30px); }
.head__nav a{
  text-decoration:none; font-size:.74rem; letter-spacing:.2em; text-transform:uppercase; font-weight:400; padding:6px 0; position:relative;
}
.head__nav a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:1px;
  background:currentColor; transition:right .25s ease;
}
.head__nav a:hover::after{ right:0; }
.head__acc{ display:flex; align-items:center; gap:14px; }
.idiomas{ display:flex; align-items:center; gap:4px; font-size:.74rem; letter-spacing:.14em; }
.idiomas a{ text-decoration:none; padding:4px 2px; opacity:.55; transition:opacity .2s ease; }
.idiomas a:hover{ opacity:1; }
.idiomas a[aria-current="true"]{ opacity:1; text-decoration:underline; text-underline-offset:4px; }
.idiomas span{ opacity:.35; }
.head__ico{ display:grid; place-items:center; width:38px; height:38px; text-decoration:none; }
.head__ico svg{ width:19px; height:19px; }
.head__btn{ padding:11px 22px; min-height:auto; font-size:.75rem; }
.head.is-solido .head__btn.btn--fantasma{ border-color:var(--verde); color:var(--verde); }
.head.is-solido .head__btn.btn--fantasma:hover{ background:var(--verde); color:var(--papel); }

.hamb{ display:none; width:42px; height:42px; border:0; background:none; cursor:pointer; padding:0; }
.hamb span{ display:block; width:22px; height:1.5px; background:currentColor; margin:5px auto; transition:transform .25s ease, opacity .2s ease; }
.hamb[aria-expanded="true"] span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
.hamb[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.hamb[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

.menu{
  position:fixed; inset:0; z-index:55; background:var(--verde); color:var(--papel);
  display:flex; flex-direction:column; justify-content:center; gap:6px;
  padding:var(--head) var(--mg) 40px;
  transform:translateY(-100%); transition:transform .4s cubic-bezier(.2,.7,.2,1);
  visibility:hidden;
}
.menu.is-abierto{ transform:translateY(0); visibility:visible; }
.menu a{
  text-decoration:none; font-family:var(--serif); font-size:clamp(2.1rem,8vw,3.2rem); font-weight:300; letter-spacing:0; padding:8px 0;
}
.menu__pie{ margin-top:36px; display:flex; flex-wrap:wrap; gap:14px; }

/* -------------------------------------------------------------- hero */
.hero{ position:relative; min-height:100svh; display:flex; flex-direction:column; justify-content:flex-end; color:var(--papel); }
.hero__fondo{ position:absolute; inset:0; overflow:hidden; background:var(--verde); }
.hero__fondo img,.hero__fondo video{ width:100%; height:100%; object-fit:cover; }
.hero__fondo::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(28,30,22,.72) 0%, rgba(28,30,22,.2) 45%, rgba(28,30,22,.3) 100%);
}
.hero__marca{ height:clamp(84px,12vw,148px); width:auto; margin-bottom:20px; }
.hero__txt{ position:relative; padding:0 var(--mg) clamp(40px,7vw,72px); }
.hero__sub{ margin:1rem 0 1.2rem; color:#e6e7da; font-size:clamp(1.5rem,3.4vw,2.4rem); }
.hero__linea{ max-width:34ch; color:#e4e5d7; margin:0 0 2rem; }
.hero__ctas{ display:flex; flex-wrap:wrap; gap:12px; }
.hero__anim > *{ animation:sube .9s cubic-bezier(.2,.7,.2,1) both; }
.hero__anim > *:nth-child(2){ animation-delay:.08s; }
.hero__anim > *:nth-child(3){ animation-delay:.14s; }
.hero__anim > *:nth-child(4){ animation-delay:.2s; }
@keyframes sube{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }

/* -------------------------------------------------------------- buscador */
.buscador{ background:rgba(251,250,246,.72); backdrop-filter:blur(2px); padding:clamp(22px,3vw,32px) var(--mg); border-bottom:1px solid var(--piedra); }
.buscador__form{ display:grid; grid-template-columns:repeat(3,1fr) auto; gap:20px; align-items:end; }
.campo{ display:flex; flex-direction:column; gap:7px; min-width:0; }
.campo > span{ font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--verde-humo); font-weight:500; }
.campo input,.campo select{
  font:inherit; font-size:.98rem; color:var(--tinta);
  background:transparent; border:0; border-bottom:1px solid var(--piedra);
  padding:9px 0; min-height:42px; width:100%; border-radius:0;
}
.campo input:focus,.campo select:focus{ border-color:var(--verde); outline:none; }
.campo select{ appearance:none; background-image:none; }
.campo input[type="date"]{ min-width:0; }
.campo input[type="date"]::-webkit-date-and-time-value{ text-align:left; }
.contador{ display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--piedra); padding:4px 0; min-height:42px; }
.contador button{
  width:34px; height:34px; border:1px solid var(--piedra); background:none; cursor:pointer;
  display:grid; place-items:center; font-size:1.1rem; line-height:1;
}
.contador button:hover{ border-color:var(--verde); color:var(--verde); }
.contador output{ font-size:1rem; font-weight:500; }

/* -------------------------------------------------------------- rama */
/* La rama queda centrada y con el mismo aire arriba que abajo */
.divisor{ display:flex; justify-content:center; align-items:center; padding-block:0; width:100%; }
.sec + .divisor{ margin-top:calc(var(--sec) * -0.5); }
/* El buscador termina en una línea, y esa línea es donde arranca el espacio.
   Por eso el aire de arriba tiene que ser el mismo que el de abajo. */
.buscador + .divisor{ margin-top:calc(var(--sec) * 0.5); }
.divisor + .sec{ padding-top:calc(var(--sec) * 0.5); }
.rama{ display:block; width:clamp(200px,28vw,380px); height:auto; margin-inline:auto; color:var(--olivo); }
.sec--verde .rama,.sec--olivo .rama{ color:currentColor; opacity:.75; }

/* -------------------------------------------------------------- datos */
.datos{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--gap); }
.datos div{ border-top:1px solid var(--piedra); padding-top:18px; }
.datos b{ display:block; font-family:var(--serif); font-weight:300; font-size:clamp(2rem,3.8vw,3rem); line-height:1.1; }
.datos span{ font-size:.92rem; color:#5f6449; }

/* -------------------------------------------------------------- unidades */
.unidades{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--gap); }
.unidad{ display:flex; flex-direction:column; }
.unidad a.unidad__foto{ display:block; overflow:hidden; aspect-ratio:4/5; }
.unidad__foto img{ width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.unidad__foto .ph-box{ height:100%; }
.unidad a.unidad__foto:hover img{ transform:scale(1.03); }
.unidad__cab{ display:flex; justify-content:space-between; align-items:baseline; gap:16px; margin:26px 0 8px; }
.unidad__n{ font-size:.75rem; letter-spacing:.2em; color:var(--verde-humo); text-transform:uppercase; white-space:nowrap; }
.unidad__specs{ list-style:none; margin:16px 0 22px; padding:0; display:flex; flex-wrap:wrap; gap:8px 22px; font-size:.92rem; color:#4f5544; }
.unidad__specs li{ position:relative; }
.unidad__pie{ margin-top:auto; display:flex; flex-wrap:wrap; align-items:center; gap:18px; }
.precio{ font-size:.98rem; }
.precio i{ font-style:normal; color:var(--verde-humo); }

/* -------------------------------------------------------------- relatos */
.relatos{ display:grid; gap:clamp(56px,9vw,120px); }
.relato{ display:grid; grid-template-columns:1.15fr 1fr; gap:clamp(28px,5vw,72px); align-items:center; }
.relato:nth-child(even) .relato__foto{ order:2; }
.relato__foto{ overflow:hidden; }
.relato__foto img,.relato__foto .ph-box{ width:100%; height:100%; object-fit:cover; aspect-ratio:4/3; }
.relato__txt .t-med{ margin-bottom:14px; }
.relato__txt .bajada{ max-width:44ch; }

/* -------------------------------------------------------------- carrusel */
.carru{ display:block; }
.carru__marco{ position:relative; overflow:hidden; background:rgba(86,91,66,.06); width:100%; }
.carru__pista{
  position:absolute; inset:0; display:flex;
  overflow-x:auto; overflow-y:hidden;
  scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.carru__pista::-webkit-scrollbar{ display:none; }
.carru__slide{ flex:0 0 100%; height:100%; scroll-snap-align:start; }
.carru__slide img,.carru__slide .ph-box{ width:100%; height:100%; object-fit:cover; }
.carru__btn{
  position:absolute; top:50%; transform:translateY(-50%);
  width:42px; height:42px; border:0; cursor:pointer;
  background:rgba(244,243,237,.9); color:var(--verde);
  font-size:1.5rem; line-height:1; display:grid; place-items:center;
  transition:background .2s ease;
}
.carru__btn:hover{ background:var(--papel-alto); }
.carru__btn--prev{ left:10px; }
.carru__btn--next{ right:10px; }
.carru__cont{
  position:absolute; right:10px; bottom:10px;
  background:rgba(47,51,39,.72); color:var(--papel);
  font-size:.72rem; letter-spacing:.12em; padding:5px 10px;
}
.carru__pie{ margin:14px 0 0; font-size:.94rem; line-height:1.55; color:#4c5241; min-height:3em; }
.sec--verde .carru__pie{ color:#d3d5c1; }

/* -------------------------------------------------------------- destacado */
.destacados{ display:grid; gap:clamp(40px,6vw,72px); }
.destacado{ display:grid; grid-template-columns:1fr 1fr; align-items:center; }
.destacado__foto{ grid-column:1; grid-row:1; }
.destacado__foto img,.destacado__foto .ph-box{ width:100%; height:100%; object-fit:cover; aspect-ratio:3/2; max-height:min(52vh,440px); }
.destacado__txt{
  grid-column:2; grid-row:1; z-index:2; margin-left:-14%;
  background:var(--olivo); color:#23261c; text-align:center;
  padding:clamp(30px,4vw,52px) clamp(24px,3.5vw,48px);
}
.destacado__txt .t-med{ margin-bottom:14px; }
.destacado__txt p{ margin:0; font-size:1rem; line-height:1.7; color:#2c301f; }
/* la segunda entrada, y las pares, invierten el lado */
.destacado:nth-child(even) .destacado__foto{ grid-column:2; }
.destacado:nth-child(even) .destacado__txt{ grid-column:1; margin-left:0; margin-right:-14%; }

/* -------------------------------------------------------------- amenities */
/* padding y margin en cero: si no, la lista se corre 40px y no coincide con las fotos */
.amen{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(26px,3vw,40px) 12px; margin:0; padding:0; }
.amen li{ list-style:none; padding:22px 0 0; border-top:1px solid rgba(242,241,236,.32); }
.amen svg{ width:26px; height:26px; margin-bottom:20px; stroke:var(--papel); fill:none; stroke-width:1.25; }
.amen h3{ font-size:1.06rem; margin-bottom:8px; font-weight:500; }
.amen p{ margin:0; font-size:.92rem; color:#cfd2bd; }

.amen-fotos{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:clamp(26px,4vw,44px); }
.amen-fotos figure{ margin:0; }
.amen-fotos img,.amen-fotos .ph-box{ width:100%; height:100%; object-fit:cover; aspect-ratio:4/5; }
.amen-fotos figcaption{ font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:#b4b79e; margin-top:12px; font-weight:500; }

.equipo{ margin-top:clamp(44px,6vw,72px); }
/* Tres columnas que se leen de arriba hacia abajo, no de izquierda a derecha */
.equipo ul{
  list-style:none; margin:0; padding:0; display:grid;
  grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(5,auto);
  grid-auto-flow:column; gap:0 clamp(20px,3vw,40px);
}
.equipo li{ padding:12px 0; border-top:1px solid var(--piedra); font-size:.95rem; color:#4c5241; }
.sec--verde .equipo li{ border-color:rgba(242,241,236,.22); color:#d3d5c1; }

/* -------------------------------------------------------------- ubicación */
.ubi{ display:grid; grid-template-columns:1fr 1.15fr; gap:var(--gap); align-items:start; }
/* La dirección de la derecha arranca a la misma altura que el mapa */
.ubi > div > .t-med:first-child{ margin-top:-6px; }
.mapa{ width:100%; aspect-ratio:1/1; border:1px solid var(--piedra); }
.mapa--plan-b{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:6px; text-align:center; padding:clamp(28px,4vw,48px);
  background:var(--verde); color:var(--papel); border:0; filter:none;
}
.mapa--plan-b .rama{ width:min(230px,60%); color:var(--papel); opacity:.55; margin-bottom:14px; }
.mapa--plan-b p{ margin:0; }
.mapa--plan-b p + p{ color:#b4b79e; font-size:.95rem; margin-bottom:20px; }

/* En dos columnas, para que el listado no se estire más que el mapa */
.zona{ list-style:none; margin:30px 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:0 clamp(20px,3vw,40px); }
.zona li{ display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-top:1px solid var(--piedra); font-size:.98rem; }
.zona span{ color:var(--verde-humo); font-size:.9rem; }

/* Nota del estacionamiento, dentro de la columna de la dirección */
.extra{ margin-top:clamp(34px,4vw,52px); padding-top:clamp(24px,3vw,34px); border-top:1px solid var(--piedra); }
.extra .rotulo{ margin-bottom:10px; }
.extra p{ margin:0; font-size:.98rem; line-height:1.65; color:#4c5241; max-width:78ch; }

/* -------------------------------------------------------------- guide */
.tabs{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:44px; }
.tab{
  border:1px solid rgba(242,241,236,.35); background:none; color:inherit; cursor:pointer;
  padding:10px 20px; font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; font-weight:400;
}
.tab[aria-selected="true"]{ background:var(--papel); color:var(--verde); border-color:var(--papel); }
.lugares{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--gap); }
.lugar{ text-decoration:none; display:block; }
.lugar img{ width:100%; aspect-ratio:3/2; object-fit:cover; margin-bottom:16px; }
.lugar h3{ font-family:var(--serif); font-size:1.5rem; font-weight:400; margin-bottom:5px; }
/* Fichas sin foto: se sostienen con una línea arriba */
.lugar--texto{ border-top:1px solid rgba(242,241,236,.3); padding-top:20px; }
.lugar--texto .lugar__meta{ display:block; margin-bottom:8px; }
.lugar p{ margin:.4rem 0 0; font-size:.94rem; color:#cfd2bd; }
.lugar__meta{ font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:#b4b79e; }
.vacio{ border:1px dashed rgba(242,241,236,.3); padding:clamp(28px,4vw,48px); max-width:60ch; }
.vacio p{ margin:0; color:#d3d5c1; }

/* -------------------------------------------------------------- galería */
/* Todas las fotos del mismo tamaño. Al hacer clic se ven completas. */
.galeria{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.galeria button{
  border:0; padding:0; background:none; cursor:zoom-in; overflow:hidden;
  aspect-ratio:1/1; width:100%;
}
.galeria img,.galeria .ph-box{ width:100%; height:100%; object-fit:cover; transition:opacity .3s ease; }
.galeria button:hover img{ opacity:.88; }

.lightbox{ position:fixed; inset:0; z-index:90; background:rgba(30,32,24,.96); display:none; place-items:center; }
.lightbox.is-abierto{ display:grid; }
.lightbox img{ max-width:92vw; max-height:82vh; object-fit:contain; }
.lightbox__cerrar{ position:absolute; top:16px; right:16px; }
.lightbox__nav{ position:absolute; top:50%; transform:translateY(-50%); }
.lightbox__nav--prev{ left:12px; }
.lightbox__nav--next{ right:12px; }
.lb-btn{ width:52px; height:52px; border:1px solid rgba(242,241,236,.4); background:rgba(30,32,24,.4); color:var(--papel); cursor:pointer; display:grid; place-items:center; font-size:1.2rem; }
.lb-btn:hover{ background:rgba(242,241,236,.15); }
.lightbox__pie{ position:absolute; bottom:18px; left:0; right:0; text-align:center; color:#cfd2bd; font-size:.84rem; }

/* -------------------------------------------------------------- estadías */
.largas{ display:grid; grid-template-columns:1fr 1fr; gap:var(--gap); align-items:center; }
.tarifas{ list-style:none; margin:30px 0; padding:0; }
.tarifas li{ display:flex; justify-content:space-between; align-items:baseline; gap:20px; padding:16px 0; border-top:1px solid rgba(242,241,236,.28); }
.tarifas b{ font-size:1.15rem; font-weight:400; }
.tarifas span{ color:#cfd2bd; font-size:.95rem; }

/* -------------------------------------------------------------- motivos */
.motivos{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(86,91,66,.18); border:1px solid rgba(86,91,66,.18); }
.motivos div{ background:rgba(248,247,241,.66); padding:clamp(26px,3vw,40px); }
.motivos h3{ font-family:var(--serif); font-size:1.6rem; font-weight:400; margin-bottom:6px; }
.motivos p{ margin:0; color:#5f6449; font-size:.95rem; }

/* -------------------------------------------------------------- reviews */
/* Reseñas: carrusel que se desplaza solo */
.reviews{ position:relative; }
.resenas{ position:relative; }
.resenas__pista{
  display:flex; gap:28px; overflow-x:auto; scroll-snap-type:x mandatory;
  scrollbar-width:none; -webkit-overflow-scrolling:touch; padding-bottom:4px;
}
.resenas__pista::-webkit-scrollbar{ display:none; }
.review{
  flex:0 0 calc((100% - 56px) / 3); scroll-snap-align:start;
  border-top:1px solid var(--piedra); padding-top:22px;
}
.review p{ font-family:var(--serif); font-style:italic; font-size:1.2rem; line-height:1.55; margin:0 0 18px; }
.review footer{ font-size:.86rem; color:var(--verde-humo); }

.resenas__btn{ top:50%; opacity:.9; }
.resenas__btn--prev{ left:-14px; }
.resenas__btn--next{ right:-14px; }
.resenas__pie{ margin:clamp(30px,4vw,44px) 0 0; font-size:.98rem; color:#4c5241; }
.resenas__pie .enlace{ margin-left:10px; }

.vacio--claro{ border-color:var(--piedra); }
.vacio--claro p{ color:#5f6449; }

/* -------------------------------------------------------------- contacto */
.contacto{ display:grid; grid-template-columns:1.2fr 1fr; gap:var(--gap); align-items:start; }
.form{ display:grid; gap:22px; }
.form__fila{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.form textarea{
  font:inherit; font-size:.98rem; background:transparent; border:0; border-bottom:1px solid var(--piedra);
  padding:9px 0; resize:vertical; min-height:96px; width:100%; border-radius:0; color:var(--tinta);
}
.form textarea:focus{ border-color:var(--verde); outline:none; }
.form__ctas{ display:flex; flex-wrap:wrap; gap:12px; }
.datos-contacto{ font-size:1.05rem; line-height:1.9; }
.datos-contacto .rotulo{ margin-bottom:10px; }
.datos-contacto a{ text-decoration:none; border-bottom:1px solid var(--piedra); }
.datos-contacto a:hover{ border-color:var(--verde); }

/* -------------------------------------------------------------- footer */
.pie{ background:var(--verde); color:var(--papel); padding:clamp(44px,5.5vw,68px) var(--mg) 26px; }
.pie__top{ display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:var(--gap); padding-bottom:38px; }
.pie__marca img{ width:clamp(110px,11vw,140px); height:auto; margin-bottom:14px; }
.pie ul{ list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.pie a,.pie li span{ text-decoration:none; font-size:.9rem; color:#d8dac7; }
.pie a:hover{ color:var(--papel); }
.pie__legal{ border-top:1px solid rgba(242,241,236,.22); padding-top:20px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:14px; font-size:.82rem; color:#b4b79e; }
.pie__legal a{ font-size:.82rem; }
.pie__enc{ font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:#b4b79e; margin:0 0 14px; font-weight:500; }

/* -------------------------------------------------------------- wpp flotante */
.wpp{
  position:fixed; right:16px; bottom:16px; z-index:70;
  display:flex; align-items:center; gap:11px;
  background:var(--verde); color:var(--papel); text-decoration:none;
  padding:13px 20px 13px 16px; box-shadow:0 6px 24px rgba(47,51,39,.28);
}
.wpp:hover{ background:var(--verde-alto); }
.wpp svg{ width:22px; height:22px; flex:none; fill:currentColor; }
.wpp__txt{ display:block; }
.wpp b{ display:block; font-size:.82rem; letter-spacing:.04em; font-weight:500; }
.wpp__txt > span{ display:block; font-size:.74rem; color:#cfd2bd; margin-top:1px; }

/* -------------------------------------------------------------- placeholder de fotos */
.ph-box{
  display:grid; place-items:center; text-align:center; width:100%; height:100%;
  min-height:120px; padding:20px;
  background:repeating-linear-gradient(45deg, rgba(86,91,66,.05) 0 12px, rgba(86,91,66,.1) 12px 24px);
  border:1px dashed rgba(86,91,66,.3);
  color:#61664e; font-size:.76rem; letter-spacing:.06em; line-height:1.5;
}
.sec--verde .ph-box,.hero .ph-box,.pie .ph-box{
  background:repeating-linear-gradient(45deg, rgba(242,241,236,.05) 0 12px, rgba(242,241,236,.1) 12px 24px);
  border-color:rgba(242,241,236,.28); color:#b4b79e;
}
.ph-box em{ font-style:normal; display:block; opacity:.65; margin-top:6px; }

/* -------------------------------------------------------------- página unidad */
.uni-hero{ padding-top:calc(var(--head) + clamp(40px,7vw,90px)); }
.uni-hero__cab{ display:grid; grid-template-columns:1fr 1fr; gap:var(--gap); align-items:end; margin-bottom:clamp(32px,5vw,56px); }
.ficha{ display:grid; grid-template-columns:1fr 1fr; gap:var(--gap) clamp(30px,5vw,80px); }
.ficha dl{ margin:0; display:grid; grid-template-columns:auto 1fr; gap:0; }
.ficha dt,.ficha dd{ padding:13px 0; border-top:1px solid var(--piedra); margin:0; }
.ficha dt{ font-size:.75rem; letter-spacing:.18em; text-transform:uppercase; color:var(--verde-humo); padding-right:24px; }
.ficha dd{ text-align:right; }
.incluye{ list-style:none; margin:0; padding:0; columns:2; column-gap:40px; }
.incluye li{ padding:9px 0; border-top:1px solid var(--piedra); font-size:.96rem; break-inside:avoid; }
.reserva-box{ background:var(--verde); color:var(--papel); padding:clamp(26px,3.5vw,40px); }
.reserva-box .campo > span{ color:#b4b79e; }
.reserva-box .campo input,.reserva-box .campo select{ color:var(--papel); border-color:rgba(242,241,236,.32); }
.reserva-box .campo input:focus,.reserva-box .campo select:focus{ border-color:var(--papel); }
.reserva-box .contador{ border-color:rgba(242,241,236,.32); }
.reserva-box .contador button{ border-color:rgba(242,241,236,.32); color:var(--papel); }
.reserva-box .contador button:hover{ border-color:var(--papel); color:var(--papel); }
.reserva-box input[type="date"]{ color-scheme:dark; }
.pago{ font-size:.88rem; line-height:1.6; color:#b4b79e; margin:18px 0 0; }
.reserva-form{ display:grid; gap:20px; margin-top:26px; }
.reserva-form .campo--par{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }

.legal{ padding-top:calc(var(--head) + clamp(50px,8vw,110px)); max-width:72ch; }
.legal h2{ font-size:1.35rem; margin:2.4rem 0 .7rem; }
.legal p,.legal li{ color:#4c5241; }

.saltar{ position:absolute; left:-9999px; }
.saltar:focus{ left:var(--mg); top:10px; z-index:100; background:var(--papel); color:var(--verde); padding:10px 16px; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1080px){
  .equipo ul{ grid-template-columns:repeat(2,1fr); grid-template-rows:repeat(7,auto); }
  .lugares{ grid-template-columns:repeat(2,1fr); }
  .review{ flex:0 0 calc((100% - 28px) / 2); }
  .buscador__form{ grid-template-columns:1fr 1fr; }
  .buscador__form .campo--btn{ grid-column:1 / -1; }
}

@media (max-width:900px){
  .head__nav{ display:none; }
  .idiomas{ font-size:.7rem; }
  .hamb{ display:block; }
  .ubi,.largas,.contacto,.unidades,.uni-hero__cab,.ficha,.relato{ grid-template-columns:1fr; }
  .destacado{ grid-template-columns:1fr; }
  .destacado__foto,.destacado:nth-child(even) .destacado__foto{ grid-column:1; grid-row:1; }
  .destacado__txt,.destacado:nth-child(even) .destacado__txt{ grid-column:1; grid-row:2; margin:-28px 20px 0; }
  .relato:nth-child(even) .relato__foto{ order:0; }
  .motivos{ grid-template-columns:repeat(2,1fr); }
  .pie__top{ grid-template-columns:1fr 1fr; }
  .galeria{ grid-template-columns:repeat(3,1fr); }
}

@media (max-width:640px){
  body{ font-size:16px; }
  :root{ --head:60px; }
  .datos{ grid-template-columns:1fr; }
  .datos div{ padding-top:14px; }
  .amen,.lugares,.motivos{ grid-template-columns:1fr; }
  .review{ flex:0 0 100%; }
  .resenas__btn{ display:none; }
  .equipo ul{ grid-template-columns:1fr; grid-template-rows:none; grid-auto-flow:row; }
  .amen-fotos{ grid-template-columns:1fr; gap:8px; }
  .buscador__form{ grid-template-columns:1fr; gap:18px; }
  .form__fila,.reserva-form .campo--par{ grid-template-columns:1fr; }
  .incluye{ columns:1; }
  .galeria{ grid-template-columns:repeat(2,1fr); gap:8px; }
  .ficha dd{ text-align:right; }
  .hero__ctas .btn{ flex:1 1 100%; }
  .wpp{ right:12px; bottom:12px; padding:12px 15px; }
  .wpp b{ font-size:.78rem; }
  .wpp__txt > span{ display:none; }
  .pie__top{ grid-template-columns:1fr; gap:36px; }
  .mapa{ aspect-ratio:4/3; }
  .zona{ grid-template-columns:1fr; }
}

/* ==========================================================================
   TECHO DE ALTURA PARA LAS FOTOS
   Ninguna imagen debe ser más alta que la ventana: si lo fuera, habría que
   scrollear para ver una sola foto. El tope está en % de la pantalla, así
   se adapta solo a cada monitor y a cada celular.
   ========================================================================== */
.amen-fotos img,.amen-fotos .ph-box{ max-height:min(52vh, 460px); }
.relato__foto img,.relato__foto .ph-box{ max-height:min(56vh, 520px); }
.largas img,.largas .ph-box{ max-height:min(58vh, 540px); }
.extra img,.extra .ph-box{ max-height:min(52vh, 460px); }

.lugar img,.lugar .ph-box{ max-height:min(46vh, 400px); }
.mapa{ max-height:min(58vh, 540px); }

/* Ubicación: menos aire entre el título, la bajada y el mapa */
#ubicacion .cab--intro{ margin-bottom:clamp(24px,3.4vw,40px); }
#ubicacion .cab--intro .bajada{ margin-top:12px; margin-bottom:0; max-width:none; }

/* Amenities: título a todo el ancho, bajada debajo y menos aire arriba */
#amenities{ padding-top:clamp(46px,6vw,80px); }
#amenities .cab--intro{ margin-bottom:clamp(24px,3.4vw,40px); }
#amenities .cab--intro .bajada{ margin-top:12px; margin-bottom:0; max-width:48ch; }

/* Galería: menos aire arriba, título solo */
#galeria{ padding-top:clamp(46px,6vw,80px); }
#galeria .cab--intro{ margin-bottom:clamp(24px,3.4vw,40px); }

/* Motivos de viaje, como frase y no como grilla de cajas */
.motivos-linea{
  font-family:var(--serif); font-weight:300;
  font-size:clamp(1.7rem, 4.2vw, 3.1rem); line-height:1.35;
  margin:0 0 26px; max-width:26ch; letter-spacing:.01em;
}
.motivos-linea i{ font-style:normal; color:var(--olivo); padding:0 .12em; }
.motivos-cierre{ margin:0; max-width:52ch; font-size:1.02rem; color:#4c5241; }

/* Presentación corta debajo del buscador */
.quienes{ padding-block:clamp(46px,6vw,82px); }
.quienes__txt{
  margin:0; max-width:34ch; font-size:clamp(1.35rem,2.9vw,2.15rem);
  line-height:1.45; color:var(--tinta);
}

/* Datos prácticos, al lado del equipamiento */
.saber{ margin-top:clamp(36px,5vw,56px); }
.saber ul{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:0 clamp(20px,3vw,40px); }
.saber li{ padding:12px 0; border-top:1px solid var(--piedra); font-size:.95rem; color:#4c5241; }
@media (max-width:900px){ .saber ul{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .saber ul{ grid-template-columns:1fr; } }