/* ══════════════════════════════════════════════════════════════
   LUNDA LIFE · Exclusive Residences
   Oscuro y oro. Marcellus + Manrope.
   ══════════════════════════════════════════════════════════════ */

:root{
  --alto-cab:clamp(5.1rem,10vh,5.9rem);
  --negro:#0A0A0B;
  --carbon:#131312;
  --humo:#1C1A17;
  --oro:#C8A265;
  --oro-luz:#E3C489;
  --hueso:#EFE9E0;

  --h-80:rgba(239,233,224,.82);
  --h-60:rgba(239,233,224,.64);
  --h-20:rgba(239,233,224,.22);
  --h-10:rgba(239,233,224,.11);

  --display:"Marcellus","Times New Roman",serif;
  --sans:"Manrope","Helvetica Neue",Arial,sans-serif;

  --marco:clamp(1.2rem,4vw,4rem);
  --ancho:210px;   /* el JS los recalcula al medir el riel */
  --hueco:14px;
  --curva:cubic-bezier(.28,.72,0,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--negro);color:var(--hueso);
  font-family:var(--sans);font-size:clamp(1rem,.96rem+.28vw,1.14rem);
  font-weight:300;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,p{margin:0}
ul{margin:0;padding:0;list-style:none}
::selection{background:var(--oro);color:var(--negro)}
:focus-visible{outline:2px solid var(--oro-luz);outline-offset:4px}
.oculto{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
  clip-path:inset(50%);white-space:nowrap}

/* ═══ CABECERA · logo y hamburguesa ═══════════════════════ */
.cab{
  position:fixed;inset:0 0 auto;z-index:60;
  display:flex;align-items:center;justify-content:space-between;
  padding:clamp(1.1rem,2.4vw,2rem) var(--marco);pointer-events:none;
  transition:padding .45s var(--curva);
}
.cab > *{pointer-events:auto}
/* al iniciar el scroll, la zona del nav se oscurece detrás del logo y la hamburguesa */
.cab::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(rgba(10,10,11,.94),rgba(10,10,11,.86));
  border-bottom:1px solid rgba(200,162,101,.18);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  opacity:0;transition:opacity .45s var(--curva);
}
.cab.posada::before{opacity:1}
.cab.posada{padding-block:clamp(.28rem,.55vw,.38rem)}
.logo{display:block;line-height:0}
.logo img{
  display:block;width:auto;
  height:clamp(5.03rem,9.61vw,6.74rem);
  transition:height .45s var(--curva);
}
.cab.posada .logo img{height:clamp(3.03rem,5.08vw,3.69rem)}

.hamb{width:56px;height:56px;position:relative;border:1px solid var(--h-20);border-radius:50%;
  transition:border-color .4s var(--curva),background .4s var(--curva)}
.hamb:hover{border-color:var(--oro);background:rgba(200,162,101,.12)}
.hamb i{position:absolute;left:18px;width:20px;height:1px;background:var(--hueso);
  transition:transform .45s var(--curva),opacity .3s}
.hamb i:nth-child(1){top:24px}
.hamb i:nth-child(2){top:31px}
.abierto .hamb i:nth-child(1){transform:translateY(3.5px) rotate(45deg)}
.abierto .hamb i:nth-child(2){transform:translateY(-3.5px) rotate(-45deg)}

/* menú a pantalla completa */
.menu{
  position:fixed;inset:0;z-index:55;background:var(--carbon);
  display:flex;flex-direction:column;justify-content:center;
  padding:0 var(--marco);
  clip-path:circle(0% at calc(100% - 3.5rem) 3.5rem);visibility:hidden;
  transition:clip-path .8s var(--curva),visibility 0s linear .8s;
}
.abierto .menu{clip-path:circle(150% at calc(100% - 3.5rem) 3.5rem);visibility:visible;
  transition:clip-path .8s var(--curva),visibility 0s}
.menu li{overflow:hidden;border-bottom:1px solid var(--h-10);max-width:900px}
.menu > ul > li > a{
  display:flex;align-items:baseline;gap:1.4rem;padding:clamp(.55rem,1.6vw,1rem) 0;
  font-family:var(--display);font-size:clamp(1.7rem,5.2vw,3.1rem);
  transform:translateY(110%);transition:transform .8s var(--curva),color .3s;
}
.abierto .menu > ul > li > a{transform:none}
.menu > ul > li:nth-child(1) > a{transition-delay:.12s}
.menu > ul > li:nth-child(2) > a{transition-delay:.17s}
.menu > ul > li:nth-child(3) > a{transition-delay:.22s}
.menu > ul > li:nth-child(4) > a{transition-delay:.27s}
.menu > ul > li:nth-child(5) > a{transition-delay:.32s}
.menu > ul > li:nth-child(6) > a{transition-delay:.37s}
.menu > ul > li > a:hover{color:var(--oro-luz)}
.menu > ul > li > a small{font-family:var(--sans);font-size:.72rem;letter-spacing:.2em;color:var(--oro)}
.menu__sub{
  display:flex;flex-wrap:wrap;gap:.2rem 1.4rem;
  padding:0 0 .9rem clamp(3.4rem, 7vw, 5.2rem);
  transform:translateY(110%);transition:transform .8s var(--curva);
}
.abierto .menu__sub{transform:none}
.menu > ul > li:nth-child(3) .menu__sub{transition-delay:.25s}
.menu > ul > li:nth-child(4) .menu__sub{transition-delay:.3s}
.menu > ul > li:nth-child(5) .menu__sub{transition-delay:.35s}
.menu__sub a{
  font-family:var(--sans);font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--h-60);padding:.25rem 0;
}
.menu__sub a:hover{color:var(--oro-luz)}
/* el idioma queda en el pie para el botón flotante; no se ve en el overlay */
.menu__pie{
  position:absolute!important;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;margin:0;padding:0;border:0;
}

/* escritorio: tipografía fluida (vh+vw). 13" compacto, 2K amplio — sin tope de altura fijo */
@media (min-width:901px){
  body.abierto .cab{padding-block:clamp(.28rem,.55vw,.38rem)}
  .menu{
    justify-content:flex-start;
    padding:clamp(5rem,8.6vh,8.4rem) var(--marco) clamp(1.1rem,2.6vh,2.6rem);
    overflow-y:auto;-webkit-overflow-scrolling:touch;
  }
  .menu li{max-width:min(52rem,56vw)}
  .menu > ul > li > a{
    font-size:clamp(1.12rem,2.05vh + .38vw,2.48rem);
    padding:clamp(.16rem,.42vh,.68rem) 0;
    gap:clamp(.7rem,1.15vh,1.45rem);
  }
  .menu > ul > li > a small{font-size:clamp(.56rem,.72vh + .12vw,.82rem);letter-spacing:.16em}
  .menu__sub{
    padding:0 0 clamp(.16rem,.45vh,.5rem) clamp(2.4rem,4vw,3.6rem);
    gap:.06rem 1.05rem;
  }
  .menu__sub a{
    font-size:clamp(.66rem,.95vh + .12vw,1.05rem);
    letter-spacing:.14em;
    padding:clamp(.04rem,.14vh,.2rem) 0;
  }
}

/* ═══ HERO ════════════════════════════════════════════════ */
/* filo dorado permanente en el borde superior */
.filo{position:fixed;inset:0 0 auto;height:3px;z-index:70;pointer-events:none;
  background:linear-gradient(90deg,var(--oro) 0%,var(--oro-luz) 50%,var(--oro) 100%)}

.hero{position:relative;height:100svh;min-height:600px;overflow:hidden;isolation:isolate;
  touch-action:pan-y}

/* duración del slide, al pie del hero */
.tiempo{position:absolute;left:0;right:0;bottom:0;z-index:8;height:3px;
  background:rgba(200,162,101,.18)}
.tiempo i{display:block;height:100%;width:100%;transform:scaleX(0);transform-origin:left;
  background:linear-gradient(90deg,var(--oro) 0%,var(--oro-luz) 100%)}
@keyframes avanza{from{transform:scaleX(0)}to{transform:scaleX(1)}}

.lienzo{position:absolute;inset:0;z-index:-2;background:var(--carbon);overflow:hidden}
.lienzo__via{display:flex;height:100%;will-change:transform}
.slide{position:relative;flex:none;height:100%;overflow:hidden}
.slide picture{position:absolute;inset:0;display:block}
.slide img{width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.16)}
@media (prefers-reduced-motion:no-preference){
  .slide.viva img{animation:acercar 9s var(--curva) forwards}
  @keyframes acercar{from{transform:scale(1.16)}to{transform:scale(1)}}
}
/* hero: foto un poco más oscura, viñeta en los bordes,
   y la sombra del texto nace del borde izquierdo (no se corta) */
.velo{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(rgba(10,10,11,.26),rgba(10,10,11,.26)),
    radial-gradient(ellipse 82% 72% at 50% 44%,
      transparent 38%,
      rgba(10,10,11,.52) 100%),
    linear-gradient(to right,
      rgba(10,10,11,.62) 0%,
      rgba(10,10,11,.40) 22%,
      rgba(10,10,11,.14) 40%,
      transparent 54%);
  box-shadow:inset 0 0 10rem 3rem rgba(10,10,11,.42);
}

/* ── texto a la izquierda ───────────────────────────────── */
.dicho{
  position:absolute;left:var(--marco);z-index:13;
  bottom:clamp(9rem,26vh,15rem);max-width:min(30rem,42vw);
  pointer-events:none;
}
.dicho__num{display:flex;align-items:center;gap:.9rem;font-size:.8rem;letter-spacing:.22em;
  color:var(--oro)}
.dicho__num i{display:block;width:44px;height:1px;background:var(--oro);opacity:.5}
.dicho__nombre{
  font-family:var(--display);font-size:clamp(2.8rem,6.4vw,5.6rem);line-height:1.02;
  letter-spacing:.01em;margin-top:1rem;
  text-shadow:0 2px 24px rgba(10,10,11,.8),0 0 42px rgba(10,10,11,.45);
}
.dicho__meta{margin-top:.9rem;font-size:.88rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--oro-luz);text-shadow:0 1px 18px rgba(10,10,11,.75)}
.dicho__texto{margin-top:1.2rem;color:var(--hueso);max-width:34ch;
  text-shadow:0 1px 18px rgba(10,10,11,.8)}
.dicho__cta{
  display:inline-flex;align-self:flex-start;width:auto;flex:none;
  align-items:center;gap:.8rem;margin-top:1.8rem;
  padding:.9rem 1.7rem;border:1px solid var(--oro);border-radius:999px;
  background:var(--oro);color:#fff;
  font-size:.86rem;letter-spacing:.14em;text-transform:uppercase;
  min-height:50px;pointer-events:auto;
  transition:background .4s var(--curva),border-color .4s var(--curva),color .4s var(--curva);
}
.dicho__cta:hover{background:var(--oro-luz);border-color:var(--oro-luz);color:#fff}
/* la entrada del texto se reinicia con cada slide */
.dicho > *{animation:entra .8s var(--curva) both}
.dicho__nombre{animation-delay:.05s}
.dicho__meta{animation-delay:.11s}
.dicho__texto{animation-delay:.17s}
.dicho__cta{animation-delay:.23s}
@keyframes entra{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ── carrusel abajo a la derecha ────────────────────────── */
.riel{
  position:absolute;right:var(--marco);z-index:12;
  bottom:clamp(4.5rem,11vh,7.5rem);
  width:min(46rem,58vw);
  /* aire arriba y abajo para que el anillo de oro se vea completo */
  padding-block:9px;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 9%,#000 91%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0,#000 9%,#000 91%,transparent 100%);
  overflow:hidden;
  touch-action:none;
}
.riel__via{display:flex;gap:var(--hueco);will-change:transform}
.thumb{
  flex:0 0 var(--ancho);position:relative;padding:0;border-radius:2px;overflow:hidden;
  aspect-ratio:4/5;background:var(--humo);touch-action:none;cursor:pointer;
  transform:scale(.9);opacity:.5;pointer-events:auto;
  transition:transform .7s var(--curva),opacity .7s var(--curva),box-shadow .7s var(--curva);
}
.thumb picture{display:block;width:100%;height:100%}
.thumb img{width:100%;height:100%;object-fit:cover;object-position:center;
  filter:grayscale(.5) brightness(.72);transition:filter .7s var(--curva)}
.thumb__nombre{
  position:absolute;left:.75rem;right:.75rem;bottom:.7rem;text-align:left;
  font-family:var(--display);font-size:1.05rem;line-height:1.1;
  opacity:0;transform:translateY(6px);transition:opacity .5s var(--curva),transform .5s var(--curva);
}
.thumb.viva{transform:scale(1);opacity:1;
  box-shadow:0 0 0 2px var(--oro),0 18px 44px -20px rgba(0,0,0,.9)}
.thumb.viva img{filter:none}
.thumb.viva .thumb__nombre{opacity:1;transform:none}
.thumb:hover{opacity:.85;transform:scale(.94)}
.thumb.viva:hover{transform:scale(1);opacity:1}

.riel__pie{
  position:absolute;right:var(--marco);z-index:6;
  bottom:clamp(2.2rem,6.5vh,4.4rem);
  width:min(46rem,58vw);
  display:flex;align-items:center;justify-content:space-between;gap:1.5rem;
  font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--h-60);
}
.riel__pie b{color:var(--oro-luz);font-weight:400}
.riel__pista{flex:1;height:1px;background:var(--h-10);position:relative;overflow:hidden}
.riel__pista i{position:absolute;top:0;bottom:0;left:0;width:16.666%;background:var(--oro);
  transition:left .7s var(--curva)}

/* 13–14" laptops: the 4/5 cards ate the hero photo */
@media (min-width:901px) and (max-height:980px){
  .riel{
    width:min(32rem,42vw);
    bottom:clamp(3rem,6vh,4.4rem);
  }
  .riel__pie{
    width:min(32rem,42vw);
    bottom:clamp(1.4rem,3.6vh,2.4rem);
  }
  .thumb{aspect-ratio:5/4}
  .thumb__nombre{font-size:.92rem;left:.6rem;right:.6rem;bottom:.5rem}
  .dicho{
    bottom:calc(clamp(3rem,6vh,4.4rem) + 9px + (var(--ancho) * .8) + 1.5rem);
    max-width:min(26rem,38vw);
  }
  .dicho__nombre{font-size:clamp(2.35rem,4.8vw,4.1rem);margin-top:.7rem}
  .dicho__meta{margin-top:.7rem}
  .dicho__texto{margin-top:.85rem}
  .dicho__cta{margin-top:1.15rem;padding:.75rem 1.45rem;min-height:44px}
  .destino__titulo{font-size:clamp(1.95rem,2.2vw,2.4rem);margin-top:.7rem}
  .hoja__titulo{font-size:clamp(2.05rem,2.4vw,2.55rem);margin-top:.6rem}
}

@media (max-width:900px){
  :root{--alto-cab:7.6rem}
  .hero{min-height:640px}

  /* punto medio: menos vacío que el original, más aire que el recorte extremo */
  .cab{padding:1.15rem var(--marco) .55rem;align-items:center}
  .cab.posada{padding-block:.4rem}
  .logo{overflow:hidden;height:4.84rem;display:flex;align-items:flex-start}
  .logo img{height:7.22rem;width:auto;max-width:none;margin-top:-1.72rem}
  .cab.posada .logo{height:3.85rem}
  .cab.posada .logo img{height:4.51rem;margin-top:-.78rem}

  /* el panel no se centra: arranca debajo del logo, con aire */
  .menu{
    justify-content:flex-start;
    padding:calc(var(--alto-cab) + 2.5rem) var(--marco) 2.6rem;
    overflow-y:auto;-webkit-overflow-scrolling:touch;
  }

  /* arriba sale del marco; abajo termina a media altura de los thumbs y se disuelve */
  .lienzo{
    top:-22vh;
    bottom:calc(3px + 9px + var(--ancho) * .4375);
    -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 calc(100% - 8rem),rgba(0,0,0,.4) calc(100% - 3.2rem),transparent 100%);
    mask-image:linear-gradient(to bottom,#000 0%,#000 calc(100% - 8rem),rgba(0,0,0,.4) calc(100% - 3.2rem),transparent 100%);
  }
  .slide picture{inset:0}
  .slide img{object-position:center center;transform-origin:center center}

  .velo{
    background:
      linear-gradient(rgba(10,10,11,.2),rgba(10,10,11,.2)),
      radial-gradient(ellipse 90% 80% at 50% 40%,
        transparent 32%,
        rgba(10,10,11,.5) 100%),
      linear-gradient(to top,
        var(--negro) 0%,var(--negro) 18%,
        rgba(10,10,11,.4) 46%,rgba(10,10,11,.48) 68%,
        rgba(10,10,11,.72) 100%);
    box-shadow:inset 0 0 6rem 2rem rgba(10,10,11,.4);
  }

  /* tarjetas ~30 % menos altas (4/5 → 8/7) */
  .thumb{aspect-ratio:8/7}
  .thumb__nombre{font-size:.95rem;left:.6rem;right:.6rem;bottom:.55rem}

  /* el bloque de texto (y See more) queda encima del carrusel, con aire */
  .dicho{
    left:var(--marco);right:5.4rem;max-width:20rem;
    top:auto;z-index:7;
    bottom:calc(3px + 18px + var(--ancho) * .875 + 4.5rem);
    display:flex;flex-direction:column;justify-content:flex-end;
    align-items:flex-start;
  }
  .dicho__nombre{font-size:clamp(2.2rem,8.6vw,3.4rem);max-width:11ch}
  .dicho__meta{max-width:22ch}
  .dicho__texto{max-width:28ch}
  .dicho__cta{margin-top:1.15rem}

  /* sin numerador ni nombre: las tarjetas bajan hasta la línea dorada */
  .riel__pie{display:none}
  .riel{left:0;right:0;width:auto;padding-inline:0;
    bottom:3px;
    -webkit-mask-image:linear-gradient(to right,transparent 0,#000 8%,#000 92%,transparent 100%);
    mask-image:linear-gradient(to right,transparent 0,#000 8%,#000 92%,transparent 100%)}
}

/* ═══ MARQUESINA ══════════════════════════════════════════ */
.marquesina{
  position:relative;overflow:hidden;background:var(--carbon);
  border-top:1px solid var(--h-10);border-bottom:1px solid var(--h-10);
  padding-block:clamp(1rem,2vw,1.5rem);
}
.marquesina__via{display:flex;width:max-content;animation:correr 120s linear infinite}
.marquesina:hover .marquesina__via{animation-play-state:paused}
.marquesina ul{display:flex;align-items:center}
.marquesina li{
  display:flex;align-items:center;gap:clamp(1.4rem,3vw,2.8rem);
  padding-right:clamp(1.4rem,3vw,2.8rem);
  font-family:var(--sans);font-size:clamp(.9rem,1.4vw,1.15rem);font-weight:300;
  letter-spacing:.18em;text-transform:uppercase;color:var(--h-60);white-space:nowrap;
}
.marquesina li::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--oro);
  flex:none}
@keyframes correr{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* ═══ DESTINO · foto aérea a sangre ═══════════════════════ */
.destino{position:relative;min-height:min(88svh,760px);display:flex;align-items:flex-end;
  overflow:hidden;isolation:isolate}
.destino__media{position:absolute;inset:0;z-index:-2;background:var(--carbon)}
.destino__media picture{position:absolute;inset:0;display:block}
.destino__media img{width:100%;height:100%;object-fit:cover}
.destino__velo{position:absolute;inset:0;z-index:-1;background:
  radial-gradient(110% 90% at 50% 40%,rgba(10,10,11,0) 20%,rgba(10,10,11,.5) 70%,rgba(10,10,11,.85) 100%),
  linear-gradient(to top,rgba(10,10,11,.9) 0%,rgba(10,10,11,.2) 55%,rgba(10,10,11,.5) 100%)}
.destino__cuerpo{position:relative;z-index:2;width:100%;max-width:1600px;margin-inline:auto;
  padding:var(--marco);padding-bottom:clamp(3rem,7vh,5rem)}
.rotulo{display:flex;align-items:center;gap:.9rem;font-size:.78rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--oro)}
.rotulo::before{content:"";width:44px;height:1px;background:var(--oro);opacity:.55;flex:none}
.destino__titulo{font-family:var(--display);font-size:clamp(2.4rem,5.6vw,4.6rem);line-height:1.04;
  margin-top:1.1rem;max-width:15ch}
@media (min-width:901px){
  .destino__titulo{font-size:clamp(2.15rem,2.6vw,2.85rem);margin-top:.85rem}
}
.destino__texto{margin-top:1.2rem;max-width:46ch;color:var(--h-80)}
.oro{
  display:inline-flex;align-items:center;gap:.8rem;margin-top:1.8rem;padding:.9rem 1.7rem;
  border:1px solid var(--oro);border-radius:999px;font-size:.86rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--oro-luz);min-height:50px;
  transition:background .4s var(--curva),color .4s var(--curva);
}
.oro:hover{background:var(--oro);color:var(--negro)}
.oro--macizo{background:var(--oro);color:var(--negro)}
.oro--macizo:hover{background:var(--oro-luz);border-color:var(--oro-luz)}

/* ═══ NOSOTROS · el hero repetido, empujado a la derecha ══ */
.lateral{position:relative;background:var(--negro)}
.lateral__alto{height:calc(100svh * 5)}
.lateral__fijo{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;
  flex-direction:column}
.lateral__via{display:flex;flex:1;min-height:0;width:max-content;will-change:transform}

/* misma caja que el hero: fondo, velo y texto abajo a la izquierda */
.hoja{position:relative;width:100vw;flex:none;overflow:hidden;isolation:isolate}
.hoja__fondo{position:absolute;inset:0;z-index:-2;background:var(--humo)}
.hoja__fondo picture{position:absolute;inset:0;display:block}
.hoja__fondo img{width:100%;height:100%;object-fit:cover;object-position:center}
.hoja__velo{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(rgba(10,10,11,.26),rgba(10,10,11,.26)),
    radial-gradient(ellipse 82% 72% at 50% 44%,
      transparent 38%,
      rgba(10,10,11,.52) 100%),
    linear-gradient(to right,
      rgba(10,10,11,.62) 0%,
      rgba(10,10,11,.40) 22%,
      rgba(10,10,11,.14) 40%,
      transparent 54%);
  box-shadow:inset 0 0 10rem 3rem rgba(10,10,11,.42);
}

.hoja__texto{
  position:absolute;left:var(--marco);z-index:5;
  bottom:clamp(9rem,26vh,15rem);max-width:min(30rem,42vw);
}
.hoja__num{display:flex;align-items:center;gap:.9rem;font-size:.8rem;letter-spacing:.22em;
  color:var(--oro)}
.hoja__num i{display:block;width:44px;height:1px;background:var(--oro);opacity:.5}
.hoja__titulo{font-family:var(--display);font-size:clamp(2.8rem,6.4vw,5.6rem);line-height:1.02;
  letter-spacing:.01em;margin-top:1rem}
@media (min-width:901px){
  .hoja__titulo{font-size:clamp(2.25rem,2.8vw,3.05rem);margin-top:.75rem}
}
.hoja__texto p{margin-top:1.2rem;color:var(--hueso);max-width:34ch}
.hoja__cta{
  display:inline-flex;align-items:center;gap:.8rem;margin-top:1.8rem;
  padding:.9rem 1.7rem;border:1px solid var(--oro);border-radius:999px;
  font-size:.86rem;letter-spacing:.14em;text-transform:uppercase;color:var(--oro-luz);
  min-height:50px;transition:background .4s var(--curva),color .4s var(--curva);
}
.hoja__cta:hover{background:var(--oro);color:var(--negro)}

.lateral__pista{height:2px;background:rgba(200,162,101,.16);flex:none}
.lateral__pista i{display:block;height:100%;width:100%;transform:scaleX(0);transform-origin:left;
  background:linear-gradient(90deg,var(--oro),var(--oro-luz))}

@media (max-width:900px){
  /* misma viñeta elegante que en escritorio, con un poco de sombra abajo para el texto */
  .hoja__velo{
    background:
      linear-gradient(rgba(10,10,11,.26),rgba(10,10,11,.26)),
      radial-gradient(ellipse 82% 72% at 50% 44%,
        transparent 38%,
        rgba(10,10,11,.52) 100%),
      linear-gradient(to top,
        rgba(10,10,11,.38) 0%,
        rgba(10,10,11,.1) 26%,
        transparent 48%),
      linear-gradient(to right,
        rgba(10,10,11,.62) 0%,
        rgba(10,10,11,.40) 22%,
        rgba(10,10,11,.14) 40%,
        transparent 54%);
    box-shadow:inset 0 0 10rem 3rem rgba(10,10,11,.42);
  }
  .hoja__texto{
    left:var(--marco);right:5.4rem;max-width:22rem;
    bottom:clamp(1.4rem,4.5vh,2.2rem);
  }
  .hoja__titulo{
    font-size:clamp(2.1rem,8.4vw,3.1rem);
    text-shadow:0 2px 22px rgba(10,10,11,.7);
  }
  .hoja__texto p{max-width:32ch;text-shadow:0 1px 16px rgba(10,10,11,.65)}
  .hoja__cta{margin-top:1.05rem}
}

/* pista con las marcas de cada hoja */
.lateral__pista{position:relative}
.lateral__marcas{position:absolute;inset:0;display:flex;pointer-events:none}
.lateral__marcas span{flex:1;border-right:1px solid rgba(200,162,101,.28)}
.lateral__marcas span:last-child{border-right:0}

/* ═══ TOURS · tarjetas con flechas ════════════════════════ */
.tours{background:var(--carbon);padding-block:clamp(3.5rem,8vw,6rem);overflow:hidden}
.tours__alto{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;
  gap:1.2rem 2.5rem;max-width:1600px;margin:0 auto clamp(2rem,4vw,3rem);padding-inline:var(--marco)}
.tours__titulo{font-family:var(--display);font-size:clamp(2rem,4.2vw,3.4rem);margin-top:1rem;
  max-width:16ch;line-height:1.05}
.tours__mando{display:flex;gap:.6rem}
.tours__mando button{width:52px;height:52px;border:1px solid var(--h-20);border-radius:50%;
  display:grid;place-items:center;font-size:1.1rem;
  transition:background .3s var(--curva),color .3s var(--curva),border-color .3s var(--curva)}
.tours__mando button:hover{background:var(--oro);color:var(--negro);border-color:var(--oro)}
.tours__mando button[disabled]{opacity:.28}
.tours__mando button[disabled]:hover{background:none;color:var(--hueso);border-color:var(--h-20)}
.tours__riel{display:flex;gap:clamp(1rem,1.8vw,1.6rem);overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;padding-inline:var(--marco);padding-bottom:.5rem;
  max-width:1600px;margin-inline:auto}
.tours__riel::-webkit-scrollbar{display:none}
.tour{flex:0 0 clamp(250px,26vw,340px);scroll-snap-align:start;
  border:1px solid var(--h-10);background:var(--negro);
  transition:border-color .4s var(--curva),transform .4s var(--curva)}
.tour:hover{border-color:var(--oro);transform:translateY(-4px)}
.tour__foto{display:block;position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--humo)}
.tour__foto picture{display:block;width:100%;height:100%}
.tour__foto img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--curva)}
.tour:hover .tour__foto img{transform:scale(1.05)}
.tour__hora{position:absolute;z-index:2;left:.8rem;top:.8rem;background:rgba(10,10,11,.8);
  padding:.3rem .65rem;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--oro-luz)}
.tour__cuerpo{display:block;padding:1.1rem 1.2rem 1.3rem}
.tour__nombre{display:block;font-family:var(--display);font-size:1.4rem;line-height:1.1;font-weight:400}
.tour__texto{display:block;margin-top:.6rem;font-size:.92rem;color:var(--h-60)}
.tour__mas{display:inline-flex;align-items:center;gap:.5rem;margin-top:1rem;font-size:.8rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--oro-luz);
  border-bottom:1px solid currentColor;padding-bottom:.15rem}

/* ═══ PREGUNTAS · acordeón con imagen al costado ══════════ */
.preguntas{background:var(--negro);border-top:1px solid var(--h-10);
  padding-block:clamp(3.5rem,8vw,6rem)}
.preguntas__reja{max-width:1600px;margin-inline:auto;padding-inline:var(--marco);
  display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:clamp(2rem,5vw,5rem);align-items:start}
.preguntas__foto{position:sticky;top:clamp(6rem,12vh,8rem);aspect-ratio:3/4;
  overflow:hidden;background:var(--humo)}
.preguntas__foto picture{display:block;width:100%;height:100%}
.preguntas__foto img{width:100%;height:100%;object-fit:cover}
.preguntas__foto::after{content:"";position:absolute;inset:0;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(200,162,101,.45),inset 0 0 90px rgba(10,10,11,.55)}
.preguntas__titulo{font-family:var(--display);font-size:clamp(2rem,4.2vw,3.4rem);
  margin-top:1rem;max-width:15ch;line-height:1.05}
.preguntas__nota{margin-top:1.2rem;color:var(--h-60);font-size:.95rem;max-width:40ch}
.preguntas__nota a{color:var(--oro-luz);border-bottom:1px solid currentColor;padding-bottom:.1rem}
.preguntas--sola .preguntas__reja{grid-template-columns:minmax(0,1fr);max-width:920px}
.preguntas--sola .preguntas__titulo{max-width:22ch}
.faq-pagina .preguntas__reja{max-width:920px;grid-template-columns:1fr}
.faq-grupo{margin-top:clamp(2.2rem,4vw,3.2rem)}
.faq-grupo:first-child{margin-top:0}
.faq-grupo h2{font-family:var(--display);font-size:clamp(1.35rem,2.4vw,1.85rem);color:var(--oro-luz);
  letter-spacing:.04em;margin:0 0 .4rem}
.faq-grupo .rotulo{margin-bottom:.35rem}
.faq-indice{display:flex;flex-wrap:wrap;gap:.45rem .9rem;margin:1.4rem 0 0;padding:0;list-style:none}
.faq-indice a{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--h-60);
  border-bottom:1px solid var(--h-20);padding-bottom:.12rem}
.faq-indice a:hover{color:var(--oro-luz)}

.acordeon{margin-top:clamp(1.5rem,3vw,2.2rem)}
.acordeon details{border-top:1px solid var(--h-10)}
.acordeon details:last-of-type{border-bottom:1px solid var(--h-10)}
.acordeon summary{
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:flex-start;gap:1.5rem;
  padding:clamp(1rem,2vw,1.4rem) 0;cursor:pointer;list-style:none;
  font-family:var(--display);font-size:clamp(1.15rem,1.9vw,1.5rem);line-height:1.25;
  color:var(--h-80);transition:color .3s var(--curva);
}
.acordeon summary::-webkit-details-marker{display:none}
.acordeon summary:hover,.acordeon details[open] summary{color:var(--oro-luz)}
.acordeon summary i{flex:none;position:relative;width:16px;height:16px;margin-top:.45rem;
  transition:transform .45s var(--curva)}
.acordeon summary i::before,.acordeon summary i::after{content:"";position:absolute;left:0;
  top:50%;width:16px;height:1px;background:var(--oro)}
.acordeon summary i::after{transform:rotate(90deg)}
.acordeon details[open] summary i{transform:rotate(135deg)}
.acordeon p{padding:0 3rem 1.3rem 0;color:var(--h-60);font-size:.98rem;max-width:62ch}
.acordeon p b{color:var(--h-80);font-weight:400}
@media (max-width:900px){
  .preguntas__reja{grid-template-columns:1fr}
  .preguntas__foto{position:relative;top:auto;aspect-ratio:16/11;order:-1}
  .acordeon p{padding-right:1rem}
}

/* ═══ CONTACTO CORTO ══════════════════════════════════════ */
.llamada{background:var(--negro);border-top:1px solid var(--h-10);
  padding-block:clamp(3rem,7vw,5rem)}
.llamada__reja{max-width:1600px;margin-inline:auto;padding-inline:var(--marco);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.8rem 3rem}
.llamada__titulo{font-family:var(--display);font-size:clamp(2rem,4.4vw,3.4rem);line-height:1.05;
  max-width:14ch}
.llamada__titulo em{font-style:normal;color:var(--oro-luz)}
.llamada__lado{display:flex;flex-direction:column;gap:1rem;align-items:flex-start}
.llamada__lado p{color:var(--h-60);font-size:.95rem;max-width:32ch}
.llamada__botones{display:flex;flex-wrap:wrap;gap:.7rem}

/* ═══ PIE ═════════════════════════════════════════════════ */
.pie{background:var(--carbon);padding-block:clamp(3rem,6vw,4.5rem) 1.5rem;
  border-top:1px solid var(--h-10)}
.pie__reja{max-width:1600px;margin-inline:auto;padding-inline:var(--marco);
  display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:2.2rem clamp(1.5rem,3vw,3rem)}
.pie__marca-logo{
  display:block;line-height:0;width:72%;max-width:18rem;margin:0;
}
.pie__marca-logo img{
  display:block;width:100%;height:auto;
}
.pie__dir{margin-top:1.2rem;font-size:.92rem;color:var(--h-60);line-height:1.95;font-style:normal;
  max-width:28ch}
.pie__dir a:hover{color:var(--oro-luz)}
.pie__col h3{font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--oro);
  margin-bottom:1rem;font-weight:400}
.pie__col li{margin-bottom:.6rem}
.pie__col a{font-size:.95rem;color:var(--h-80)}
.pie__col a:hover{color:var(--oro-luz)}
.pie__franja{max-width:1600px;margin:clamp(2.5rem,5vw,3.5rem) auto 0;padding:1.3rem var(--marco) 0;
  border-top:1px solid var(--h-10);display:flex;flex-wrap:wrap;justify-content:space-between;
  gap:.6rem 2rem;font-size:.82rem;color:var(--h-60)}
@media (max-width:900px){.pie__reja{grid-template-columns:1fr 1fr}.pie__marca{grid-column:1/-1}}
@media (max-width:560px){.pie__reja{grid-template-columns:1fr}}

/* revelado sobrio */
[data-sube]{opacity:0;transform:translateY(20px);
  transition:opacity .8s var(--curva),transform .8s var(--curva);transition-delay:var(--d,0s)}
[data-sube].dentro{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  [data-sube]{opacity:1;transform:none}
  .marquesina__via{animation:none}
  .slide img{transform:none}
  *,*::before,*::after{transition-duration:.01ms!important}
  .dicho > *{animation:none}
}

/* ═══ INNER PAGES ═════════════════════════════════════════ */
body.pagina{overflow-x:hidden;--alto-cab:clamp(4.7rem,7.4vh,5.5rem)}
body.pagina .cab::before{opacity:1}
body.pagina .cab{padding-block:clamp(.28rem,.55vw,.38rem)}
body.pagina .logo img{height:clamp(3.03rem,5.08vw,3.69rem)}
@media (max-width:900px){
  body.pagina{--alto-cab:5.55rem}
  body.pagina .cab{padding-block:.4rem}
  body.pagina .logo{height:3.85rem}
  body.pagina .logo img{height:4.51rem;margin-top:-.78rem}
}

/* escritorio: mitad del aire encima del logo y la hamburguesa */
@media (min-width:901px){
  .cab{padding-block:clamp(.55rem,1.2vw,1rem)}
  .cab .logo{
    overflow:hidden;
    height:calc(clamp(5.03rem,9.61vw,6.74rem) * .84);
    transition:height .45s var(--curva);
  }
  .cab .logo img{
    height:clamp(5.03rem,9.61vw,6.74rem);
    margin-top:calc(clamp(5.03rem,9.61vw,6.74rem) * -.14);
    transition:height .45s var(--curva),margin-top .45s var(--curva);
  }
  .cab.posada .logo,
  body.pagina .cab .logo{
    height:calc(clamp(3.03rem,5.08vw,3.69rem) * .84);
  }
  .cab.posada .logo img,
  body.pagina .cab .logo img{
    height:clamp(3.03rem,5.08vw,3.69rem);
    margin-top:calc(clamp(3.03rem,5.08vw,3.69rem) * -.14);
  }
  body.abierto .cab .logo{height:calc(clamp(2.34rem,2.62vh + 1.11rem,3.03rem) * .84)}
  body.abierto .cab .logo img{
    height:clamp(2.34rem,2.62vh + 1.11rem,3.03rem);
    margin-top:calc(clamp(2.34rem,2.62vh + 1.11rem,3.03rem) * -.14);
  }
}
.miga{max-width:1600px;margin:0 auto;padding:calc(var(--alto-cab) + 1.2rem) var(--marco) 0;
  font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--h-60)}
.miga a{color:var(--oro-luz)}
.miga a:hover{color:var(--hueso)}
.miga span{margin-inline:.45rem;opacity:.5}

.banda{position:relative;min-height:min(62svh,560px);display:flex;align-items:flex-end;
  overflow:hidden;isolation:isolate}
.banda--corta{min-height:min(42svh,380px)}
.banda--hero{
  display:block;min-height:100svh;min-height:100dvh;
}
.banda__media{position:absolute;inset:0;z-index:-2;background:var(--carbon)}
.banda__media picture{position:absolute;inset:0;display:block}
.banda__media img{width:100%;height:100%;object-fit:cover}
.banda__velo{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(rgba(10,10,11,.22),rgba(10,10,11,.22)),
    linear-gradient(to top,rgba(10,10,11,.88) 0%,rgba(10,10,11,.2) 55%,rgba(10,10,11,.45) 100%)}
.banda__cuerpo{position:relative;z-index:2;width:100%;max-width:1600px;margin-inline:auto;
  padding:var(--marco);padding-bottom:clamp(2.2rem,6vh,3.6rem)}
.banda--hero .banda__cuerpo{
  position:absolute;left:0;right:0;bottom:0;max-width:none;
  padding-bottom:clamp(3.2rem,9vh,5.8rem);
}
.banda--hero .banda__titulo{
  font-size:clamp(2.8rem,6.4vw,5.6rem);
  text-shadow:0 2px 24px rgba(10,10,11,.8),0 0 42px rgba(10,10,11,.45);
}
.banda--hero .banda__meta{text-shadow:0 1px 18px rgba(10,10,11,.75)}
.banda--hero .banda__texto{text-shadow:0 1px 18px rgba(10,10,11,.8);max-width:36ch}
.banda__titulo{font-family:var(--display);font-size:clamp(2.4rem,5.6vw,4.6rem);line-height:1.04;
  margin-top:1rem;max-width:16ch}
.banda__texto{margin-top:1.1rem;max-width:min(48ch,100%);color:var(--h-80)}
.banda__meta{margin-top:.8rem;font-size:.88rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--oro-luz);max-width:100%}
.miga--sobre{
  position:absolute;z-index:4;left:0;right:0;max-width:none;
  top:calc(var(--alto-cab) - .15rem);margin:0;
  padding:.35rem var(--marco) 0;
  color:var(--h-80);
}

.cuerpo{max-width:1600px;margin-inline:auto;padding:clamp(2.4rem,6vw,4.5rem) var(--marco)}
.cuerpo h2{font-family:var(--display);font-size:clamp(1.8rem,3.4vw,2.6rem);line-height:1.12;
  margin:0 0 1rem}
.cuerpo p + p{margin-top:1rem}
.prosa{max-width:66ch;color:var(--h-80)}
.prosa h2{margin-top:2.2rem}

.franja{
  background:var(--carbon);border-block:1px solid var(--h-10);
  padding-block:clamp(1.5rem,3.2vw,2.2rem);
}
.franja ul{
  max-width:1600px;margin:0 auto;padding-inline:var(--marco);
  display:flex;flex-wrap:wrap;gap:1.35rem clamp(2rem,4vw,3.6rem);
}
.franja li{min-width:min(11rem,100%)}
@media (max-width:700px){
  .franja li{min-width:0;flex:1 1 10rem}
  .banda--media .banda__texto{max-width:34ch}
}
.franja b{
  display:block;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--oro);font-weight:400;margin-bottom:.35rem;
}
.franja span{color:var(--h-80);font-size:.98rem}

.fotos__cabeza{
  display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;
  gap:1.4rem 3rem;margin-bottom:clamp(1.6rem,3vw,2.4rem);
}
.fotos__cabeza h2{margin:1rem 0 0;max-width:14ch;font-size:clamp(2rem,4.2vw,3.4rem)}
.fotos__cabeza p{max-width:42ch;color:var(--h-60);margin:0}
.album-indice{
  display:flex;flex-wrap:wrap;gap:.35rem 1.1rem;
  margin:0 0 clamp(2rem,4vw,3rem);
}
.album-indice a{
  font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--h-60);padding:.3rem 0;border-bottom:1px solid transparent;
}
.album-indice a:hover{color:var(--oro-luz);border-bottom-color:var(--oro)}
.album{margin-top:clamp(2.6rem,6vw,4.2rem)}
.album:first-of-type{margin-top:0}

.reja{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(1rem,2vw,1.6rem)}
@media (max-width:1100px){.reja{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.reja{grid-template-columns:1fr}}

.ficha{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr);
  gap:clamp(1.8rem,4vw,3.5rem);align-items:start}
@media (max-width:900px){.ficha{grid-template-columns:1fr}}

.hechos{border:1px solid var(--h-10);padding:1.4rem 1.5rem;background:var(--carbon)}
.hechos dt{font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--oro);
  margin-top:1rem}
.hechos dt:first-child{margin-top:0}
.hechos dd{margin:.35rem 0 0;color:var(--h-80)}

.galeria{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.7rem;margin-top:clamp(2rem,4vw,3rem)}
.galeria a,.galeria figure{margin:0;aspect-ratio:4/3;overflow:hidden;background:var(--humo)}
.galeria picture,.galeria img{width:100%;height:100%;display:block}
.galeria img{object-fit:cover}
@media (max-width:700px){.galeria{grid-template-columns:repeat(2,minmax(0,1fr))}}

.galeria--edicion{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-auto-flow:dense;
  gap:2px;
  margin-top:0;
  background:rgba(200,162,101,.42);
  box-shadow:
    0 32px 70px -22px rgba(0,0,0,.92),
    0 8px 24px rgba(0,0,0,.4),
    0 0 0 1px rgba(200,162,101,.35);
  scroll-margin-top:calc(var(--alto-cab) + 1.2rem);
}
.galeria--edicion figure{
  position:relative;
  min-width:0;
  min-height:0;
  aspect-ratio:4/3;
  overflow:hidden;
  margin:0;
  background:var(--humo);
  cursor:zoom-in;
}
.galeria--edicion figure:focus-visible{
  outline:2px solid var(--oro-luz);outline-offset:-2px;z-index:2;
}
.galeria--edicion picture{
  position:absolute;inset:0;display:block;
}
.galeria--edicion figure::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  box-shadow:inset 0 0 0 1px rgba(200,162,101,.28),inset 0 0 70px rgba(10,10,11,.22);
}
.galeria--edicion figure img{
  transition:transform 1.1s var(--curva);
}
.galeria--edicion figure:hover img{transform:scale(1.05)}
.galeria--edicion figure:hover::after{
  box-shadow:inset 0 0 0 1px rgba(227,196,137,.7),inset 0 0 70px rgba(10,10,11,.12);
}
@media (max-width:700px){
  .galeria--edicion{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){
  .galeria--edicion figure img{transition:none}
  .galeria--edicion figure:hover img{transform:none}
}

/* ═══ LUPA · zoom de galería ══════════════════════════════ */
body.lupa-abierta .cab,
body.lupa-abierta .filo{visibility:hidden}
.lupa{
  position:fixed;inset:0;z-index:80;
  display:flex;align-items:center;justify-content:center;
  padding:4.5rem 4.8rem 3.2rem;
  background:rgba(10,10,11,.97);
}
.lupa[hidden]{display:none}
.lupa img{
  max-width:min(96vw,1600px);max-height:86vh;width:auto;height:auto;
  min-width:0;min-height:0;object-fit:contain;
  box-shadow:0 24px 80px rgba(0,0,0,.55);
}
.lupa__cerrar,.lupa__antes,.lupa__luego{
  position:absolute;width:56px;height:56px;border:1px solid var(--h-20);
  border-radius:50%;background:rgba(10,10,11,.55);color:var(--hueso);
  font-size:1.6rem;line-height:1;display:flex;align-items:center;justify-content:center;
}
.lupa__cerrar{top:max(1rem,env(safe-area-inset-top));right:max(1rem,env(safe-area-inset-right))}
.lupa__antes{left:max(.8rem,env(safe-area-inset-left));top:50%;transform:translateY(-50%)}
.lupa__luego{right:max(.8rem,env(safe-area-inset-right));top:50%;transform:translateY(-50%)}
.lupa__cerrar:hover,.lupa__antes:hover,.lupa__luego:hover{
  border-color:var(--oro);background:rgba(200,162,101,.16);color:var(--oro-luz);
}
.lupa__antes[hidden],.lupa__luego[hidden]{display:none}
@media (max-width:700px){
  .lupa{padding:4.2rem 1rem 2.4rem}
  .lupa__antes,.lupa__luego{width:44px;height:44px;font-size:1.35rem}
}

.destino--patio{min-height:min(72svh,640px)}

.tours.otros{
  background:var(--negro);
  border-top:1px solid var(--h-10);
}

@media (max-width:900px){
  .banda--hero .banda__titulo{font-size:clamp(2.6rem,11vw,4rem)}
  .banda--hero .banda__cuerpo{padding-bottom:clamp(2.4rem,8vh,3.6rem)}
  .banda--hero .velo{
    background:
      linear-gradient(rgba(10,10,11,.2),rgba(10,10,11,.2)),
      radial-gradient(ellipse 90% 80% at 50% 40%,
        transparent 32%,
        rgba(10,10,11,.5) 100%),
      linear-gradient(to top,
        var(--negro) 0%,var(--negro) 12%,
        rgba(10,10,11,.35) 42%,rgba(10,10,11,.48) 68%,
        rgba(10,10,11,.72) 100%);
  }
}

.legal{max-width:72ch}
.legal h1{font-family:var(--display);font-size:clamp(2.2rem,4.6vw,3.6rem);line-height:1.08;
  margin:0 0 1.2rem}
.legal h2{margin-top:2rem}
.legal p,.legal li{color:var(--h-80)}
.legal ul{margin:1rem 0 0;padding-left:1.1rem;list-style:disc}
.legal li{margin-bottom:.55rem}
.legal .nota{margin-top:2rem;font-size:.92rem;color:var(--h-60)}

.tour.tour--grid{flex:none;width:auto;min-width:0}

/* ═══ LISTADO DE CONDOS ═══════════════════════════════════ */
.banda--media{
  min-height:min(68svh,640px);
  overflow:hidden;
}
.banda--media .banda__velo{
  background:
    linear-gradient(rgba(10,10,11,.22),rgba(10,10,11,.22)),
    radial-gradient(ellipse 82% 72% at 50% 44%,transparent 38%,rgba(10,10,11,.58) 100%),
    linear-gradient(to top,rgba(10,10,11,.92) 0%,rgba(10,10,11,.18) 52%,rgba(10,10,11,.5) 100%);
  box-shadow:inset 0 0 10rem 3rem rgba(10,10,11,.42);
}
.banda--media .banda__cuerpo{
  /* debajo de .lugar (Tangolunda / Huatulco), no encima */
  padding-top:calc(var(--alto-cab) + 2.7rem);
  padding-bottom:clamp(3.8rem,9vh,5.2rem);
}
.lugar{
  position:absolute;z-index:4;left:0;right:0;
  top:calc(var(--alto-cab) + .35rem);
  display:flex;flex-wrap:wrap;align-items:center;gap:.45rem .7rem;
  padding:0 var(--marco);
  font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--h-80);
  text-shadow:0 1px 14px rgba(10,10,11,.85);
  pointer-events:none;
}
.lugar i{width:14px;height:1px;background:var(--oro);opacity:.75;display:inline-block}
html{scroll-padding-top:calc(var(--alto-cab) + .6rem)}

.reserva{
  position:relative;z-index:12;
  max-width:1600px;margin:-2.8rem auto 0;padding-inline:var(--marco);
}
.reserva__caja{
  display:grid;grid-template-columns:1.05fr 1.35fr 1.15fr auto;
  background:var(--carbon);border:1px solid rgba(200,162,101,.28);
  box-shadow:0 28px 64px -24px rgba(0,0,0,.9),0 0 0 1px rgba(200,162,101,.12);
}
.reserva__campo{
  position:relative;display:flex;flex-direction:column;justify-content:center;
  gap:.28rem;padding:.95rem 1.2rem;min-height:5.4rem;
  border-right:1px solid var(--h-10);
}
.reserva__campo:focus-within{background:rgba(200,162,101,.06)}
.reserva__campo label,
.reserva__campo #fechasLbl{
  font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--oro);
}
.reserva__campo input,
.reserva__campo button.reserva__valor{
  width:100%;background:none;border:0;padding:0;margin:0;text-align:left;
  color:var(--hueso);font-size:1.02rem;min-height:1.5rem;caret-color:var(--oro);
}
.reserva__campo input::placeholder,
.reserva__valor [data-vacio]{color:var(--h-60)}
.reserva__enviar{
  display:flex;align-items:center;padding:.7rem;
}
.reserva__enviar .oro{margin-top:0;width:100%;justify-content:center;min-width:10.5rem}
.reserva__nota{
  margin:.85rem 0 0;font-size:.78rem;letter-spacing:.08em;color:var(--h-60);
}

.cal{
  display:none;position:absolute;left:0;top:calc(100% + 2px);z-index:20;
  width:max(36rem,100%);max-width:min(44rem,calc(100vw - 2 * var(--marco)));
  background:var(--negro);border:1px solid rgba(200,162,101,.35);
  box-shadow:0 28px 60px -18px rgba(0,0,0,.92);padding:1.1rem 1.2rem 1.2rem;
}
.cal.es-abierto{display:block !important}
.cal__tope{display:flex;align-items:center;justify-content:space-between;margin-bottom:.8rem}
.cal__tope button{
  width:36px;height:36px;border:1px solid var(--h-20);border-radius:50%;
  display:grid;place-items:center;
}
.cal__tope button:hover{border-color:var(--oro);color:var(--oro)}
.cal__pie{margin:.9rem 0 0;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--h-60);text-align:center}
.cal__meses{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem}
.cal__mes h3{
  font-family:var(--display);font-size:1.15rem;font-weight:400;margin:0 0 .7rem;
  text-align:center;
}
.cal__dias{
  display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center;
}
.cal__dow{
  font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--h-60);
  padding:.25rem 0;
}
.cal__dias button{
  aspect-ratio:1;border-radius:2px;font-size:.88rem;color:var(--h-80);
}
.cal__dias button:hover:not(:disabled){background:rgba(200,162,101,.16);color:var(--hueso)}
.cal__dias button:disabled{opacity:.28}
.cal__dias button.es-fuera{visibility:hidden}
.cal__dias button.es-rango{background:rgba(200,162,101,.18)}
.cal__dias button.es-punta{background:var(--oro);color:var(--negro)}
.lista-condos{position:relative}
.lista-condos select{
  appearance:none;-webkit-appearance:none;width:100%;background:none;border:0;
  color:var(--hueso);font:inherit;font-size:1.02rem;padding:0 1.4rem 0 0;margin:0;
  min-height:1.5rem;cursor:pointer;color-scheme:dark;
}
.lista-condos select option{background:var(--carbon);color:var(--hueso)}
.lista-condos::after{
  content:"";position:absolute;right:1.2rem;top:58%;width:7px;height:7px;
  border-right:1px solid var(--oro);border-bottom:1px solid var(--oro);
  transform:translateY(-50%) rotate(45deg);pointer-events:none;
}

.indice{
  max-width:1600px;margin:0 auto;padding:clamp(1.8rem,4vw,2.6rem) var(--marco) 0;
  display:flex;flex-wrap:wrap;gap:.55rem .9rem;
}
.indice--largo{gap:.5rem 1.05rem}
.indice a{
  font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--h-60);
  border-bottom:1px solid transparent;padding-bottom:.15rem;
}
.indice a small{color:var(--oro);margin-right:.45rem}
.indice a:hover{color:var(--hueso);border-bottom-color:var(--oro)}

.unidades{
  max-width:1600px;margin:0 auto;padding:clamp(1.6rem,4vw,2.8rem) var(--marco) clamp(3.5rem,8vw,5.5rem);
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(1.2rem,2.4vw,2rem);
}
.unidad{
  display:grid;grid-template-rows:auto 1fr;color:inherit;
  scroll-margin-top:calc(var(--alto-cab) + .8rem);
  border:1px solid var(--h-10);background:var(--negro);
  box-shadow:0 24px 50px -28px rgba(0,0,0,.8);
  transition:border-color .4s var(--curva),transform .4s var(--curva);
}
.unidad:hover{border-color:rgba(200,162,101,.45);transform:translateY(-3px)}
.unidad__foto{
  position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:var(--humo);
}
.unidad__foto picture,.unidad__foto img{width:100%;height:100%;display:block}
.unidad__foto img{object-fit:cover;transition:transform 1.1s var(--curva)}
.unidad:hover .unidad__foto img{transform:scale(1.05)}
.unidad__foto::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:
    radial-gradient(ellipse 70% 64% at 50% 40%,transparent 18%,rgba(10,10,11,.38) 72%,rgba(10,10,11,.72) 100%);
  box-shadow:inset 0 0 5.5rem 1.8rem rgba(10,10,11,.55),inset 0 0 0 1px rgba(200,162,101,.32);
}
.unidad__cuerpo{padding:1.25rem 1.35rem 1.4rem}
.unidad__num{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--oro)}
.unidad__cuerpo h2{
  font-family:var(--display);font-size:clamp(1.7rem,2.6vw,2.2rem);
  margin:.45rem 0 .5rem;font-weight:400;
}
.unidad__cuerpo p{color:var(--h-60);font-size:.95rem}
.unidad__precio{margin-top:.55rem;color:var(--oro-luz);letter-spacing:.08em;text-transform:uppercase;
  font-size:.82rem}
.unidad__mas{
  display:inline-flex;margin-top:1rem;font-size:.8rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--oro-luz);border-bottom:1px solid currentColor;
  padding-bottom:.12rem;
}

@media (max-width:980px){
  .reserva__caja{grid-template-columns:1fr 1fr}
  .reserva__enviar{grid-column:1 / -1}
  .cal{width:100%;left:0}
  .cal__meses{grid-template-columns:1fr}
}
@media (max-width:700px){
  .reserva{margin-top:-1.6rem}
  .reserva__caja{grid-template-columns:1fr}
  .reserva__campo{border-right:0;border-bottom:1px solid var(--h-10)}
  .unidades{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .unidad,.unidad__foto img{transition:none}
  .unidad:hover{transform:none}
  .unidad:hover .unidad__foto img{transform:none}
}

/* ═══ SPIRIT · relatos e imágenes ═════════════════════════ */
.cuerpo--corto{padding-bottom:0}
.relato{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  min-height:min(68svh,620px);border-top:1px solid var(--h-10);
}
.relato--voltea{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}
.relato--voltea .relato__foto{order:2}
.relato__foto{
  position:relative;min-height:min(46svh,420px);overflow:hidden;background:var(--humo);
}
.relato__foto picture,.relato__foto img{
  position:absolute;inset:0;width:100%;height:100%;display:block;
}
.relato__foto img{object-fit:cover}
.relato__foto::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:radial-gradient(ellipse 78% 72% at 50% 42%,transparent 28%,rgba(10,10,11,.5) 100%);
  box-shadow:inset 0 0 5.5rem 1.6rem rgba(10,10,11,.42),inset 0 0 0 1px rgba(200,162,101,.28);
}
.relato__cuerpo{
  display:flex;flex-direction:column;justify-content:center;
  padding:clamp(2rem,5.5vw,4.2rem) clamp(1.4rem,4vw,3.6rem);
}
.relato__cuerpo h2{
  font-family:var(--display);font-size:clamp(1.9rem,3.4vw,2.8rem);
  line-height:1.08;margin:.7rem 0 1rem;font-weight:400;max-width:16ch;
}
.relato__cuerpo p{color:var(--h-80);max-width:42ch}
.relato__cuerpo .oro{margin-top:1.6rem;align-self:flex-start}
.unidades--tres{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:980px){
  .relato,.relato--voltea{grid-template-columns:1fr;min-height:0}
  .relato--voltea .relato__foto{order:0}
  .unidades--tres{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .unidades--tres{grid-template-columns:1fr}
}

/* ═══ HUATULCO · nueve bahías ═════════════════════════════ */
.nombres{padding-top:clamp(2.8rem,6vw,4.8rem)}
.nombres .rotulo{margin:0}
.nombres h2{margin:.7rem 0 0;max-width:14ch}
.nombres__nota{margin:1.6rem 0 0;max-width:52ch;color:var(--h-60)}
.bahias{
  list-style:none;margin:2.2rem 0 0;padding:0;
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;border-top:1px solid var(--h-10);
}
.bahias li{
  display:flex;align-items:baseline;gap:.85rem;
  padding:1.15rem 1.4rem 1.15rem 0;
  border-bottom:1px solid var(--h-10);
  font-family:var(--display);font-size:clamp(1.15rem,2.1vw,1.5rem);
  line-height:1.15;font-weight:400;
}
.bahias span{
  font-family:var(--sans);font-size:.7rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--oro);flex:none;
}
.bahias li:nth-child(3n+2){padding-inline:1.4rem}
.bahias li:nth-child(3n){padding-right:0;padding-left:1.4rem}
.bahias .esta{color:var(--hueso)}
@media (max-width:800px){
  .bahias{grid-template-columns:1fr}
  .bahias li,.bahias li:nth-child(n){padding-inline:0}
}

/* ═══ REDES FLOTANTES (Bahías Travel) ═════════════════════ */
.abs{
  position:fixed;
  display:flex!important;
  flex-direction:column;
  align-items:center;
  gap:7.5px;
  right:20px;
  top:50%;
  transform:translateY(-50%);
  width:45px;
  z-index:999999;
  pointer-events:none;
}
.floating-button{
  position:relative!important;
  width:45px;height:45px;border-radius:50%;
  display:flex;justify-content:center;align-items:center;
  box-shadow:0 3px 8px rgba(0,0,0,.2);
  cursor:pointer;z-index:999;
  pointer-events:auto;
  transition:transform .3s ease;
}
.floating-button:hover{transform:scale(1.15)}
.floating-button svg{width:21px;height:21px;fill:#fff}
.instagram-button{background:#E1306C}
.facebook-button{background:#1877F2}
.whatsapp-button{background:#25D366;animation:pulse 2s infinite}
.lang-button{
  overflow:hidden;padding:0;background:#111;flex-shrink:0;
}
.lang-button img{
  width:100%;height:100%;object-fit:cover;display:block;
}
.lang-button--us img{object-position:12% 50%}
.lang-button--mx img{object-position:50% 50%}
.menu__lang{
  display:inline-flex;align-items:center;gap:.55rem;
}
.menu__lang img{
  width:22px;height:22px;border-radius:50%;object-fit:cover;flex:none;
}
@keyframes pulse{
  0%{transform:scale(1);box-shadow:0 0 0 0 rgba(37,211,102,.7)}
  70%{transform:scale(1.1);box-shadow:0 0 0 11.25px rgba(37,211,102,0)}
  100%{transform:scale(1);box-shadow:0 0 0 0 rgba(37,211,102,0)}
}
.whatsapp-button:hover{animation-play-state:paused;transform:scale(1.15)}
.floating-button:focus-visible{outline:2px solid var(--oro-luz);outline-offset:3px}
body.abierto .abs,
body.lupa-abierta .abs{visibility:hidden;pointer-events:none}
@media (prefers-reduced-motion:reduce){
  .whatsapp-button{animation:none}
  .floating-button{transition:none}
  .floating-button:hover,.whatsapp-button:hover{transform:none}
}
