/* Hotel Casa Mexicana Cozumel — vitrina "Del arrecife a tu balcón"
   Regla de arte: solo el azul tiene color. Todo lo demás, blanco y negro. */

:root{
  --negro:#000; --blanco:#fff; --cal:#F3F4F2; --gris:#5F6566;
  --hondo:#03203B; --medio:#0A4677; --somero:#1D86BE;
  --agua:#0B78A6; --agua-claro:#63C9E8; --reserva:#0A3E66;
  --f:"Sofia Sans",system-ui,sans-serif;
  --f-sc:"Sofia Sans Semi Condensed","Sofia Sans",system-ui,sans-serif;
  --f-c:"Sofia Sans Condensed","Sofia Sans",system-ui,sans-serif;
  --f-xc:"Sofia Sans Extra Condensed","Sofia Sans Condensed",system-ui,sans-serif;
  --riel:76px; --margen:6vw;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--blanco);color:var(--negro);font:400 18px/1.55 var(--f);font-optical-sizing:auto}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
:focus-visible{outline:3px solid var(--agua-claro);outline-offset:3px}
.solo-lector{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.saltar{position:fixed;left:12px;top:-60px;z-index:100;background:var(--blanco);color:var(--negro);padding:10px 14px;font-weight:700}
.saltar:focus{top:12px}

/* ---------- botones ---------- */
.boton{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 24px;font:700 17px/1 var(--f-sc);letter-spacing:.01em;text-decoration:none;border:0;cursor:pointer;border-radius:2px}
.boton--agua{background:var(--agua);color:var(--blanco)}
.boton--borde{border:1px solid rgba(255,255,255,.7);color:var(--blanco)}
/* relleno que sube como el agua (idea adaptada de un botón de uiverse.io, licencia MIT) */
.boton--llenar{position:relative;overflow:hidden;isolation:isolate;background:var(--blanco);color:var(--reserva);height:76px;width:100%;font:800 24px/1 var(--f-sc)}
.boton--llenar::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--agua-claro);transform:translateY(101%);transition:transform .45s cubic-bezier(.2,.7,.2,1);border-radius:46% 54% 0 0/18px 18px 0 0}
.boton--llenar:hover::before,.boton--llenar:focus-visible::before{transform:translateY(0);border-radius:0}

/* ---------- cabecera ---------- */
.cabeza{position:fixed;top:0;left:var(--riel);right:0;height:92px;z-index:40;display:flex;align-items:center;gap:28px;padding:0 40px;pointer-events:none;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.cabeza.is-oculta{transform:translateY(-110%)}
.cabeza>*{pointer-events:auto}
.cabeza__logo{display:block;width:128px;margin-right:auto}
.logo{width:100%;transition:filter .5s}
.cabeza--clara .logo--blanco{filter:invert(1)}
.idiomas{position:relative;display:flex;gap:2px}
.idioma{background:none;border:0;color:var(--blanco);font:600 14px/1 var(--f);padding:8px 7px;cursor:pointer;opacity:.8;transition:color .5s,opacity .2s}
.idioma.is-activo{opacity:1;text-decoration:underline;text-underline-offset:5px}
.cabeza--clara .idioma{color:var(--negro)}
.idiomas__aviso{position:absolute;top:100%;right:0;width:240px;margin-top:8px;padding:10px 12px;background:var(--negro);color:var(--blanco);font-size:14px;line-height:1.35}

/* ---------- riel: computadora de buceo y tablero del elevador ---------- */
.riel{position:fixed;left:0;top:0;bottom:0;width:var(--riel);z-index:50;color:var(--blanco);background:rgba(2,20,37,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-right:1px solid rgba(255,255,255,.12);transition:background .6s,color .6s,border-color .6s}
.en-tierra .riel{background:rgba(255,255,255,.86);color:var(--negro);border-color:rgba(0,0,0,.08)}
.riel__escala{position:absolute;top:120px;bottom:150px;left:0;right:0;display:flex;flex-direction:column;justify-content:space-between}
.riel__escala::before{content:"";position:absolute;left:22px;top:6px;bottom:6px;width:1px;background:currentColor;opacity:.3}
.riel__escala a{position:relative;display:flex;align-items:center;gap:8px;padding:4px 0 4px 16px;text-decoration:none;font:600 13px/1 var(--f-sc);opacity:.72;transition:opacity .25s}
.riel__escala a::before{content:"";width:13px;height:1px;background:currentColor}
.riel__escala a b{position:absolute;left:calc(100% + 6px);top:50%;transform:translateY(-50%);white-space:nowrap;padding:6px 9px;background:var(--negro);color:var(--blanco);font:600 13px/1 var(--f);opacity:0;pointer-events:none;transition:opacity .2s}
.riel__escala a:hover,.riel__escala a:focus-visible,.riel__escala a.is-actual{opacity:1}
.riel__escala a.is-actual::before{width:22px;height:2px}
.riel__escala a:hover b,.riel__escala a:focus-visible b{opacity:1}
/* la pantalla: siempre oscura, como la de una computadora de buceo o un elevador */
.riel__lectura{position:absolute;left:8px;right:8px;bottom:26px;height:74px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;background:#04121F;border-radius:7px;box-shadow:inset 0 0 0 1px rgba(99,201,232,.25),0 8px 20px rgba(0,0,0,.18)}
.riel__lectura small{font:600 11px/1 var(--f-sc);color:var(--agua-claro);opacity:.85}
.riel__lectura.es-piso small{visibility:hidden}

/* matriz de puntos (pantalla de la computadora / tablero del elevador) */
.matriz{display:inline-block;--punto:2.6px}
.matriz svg{display:block;height:calc(var(--punto) * 7 * 1.55);width:auto;overflow:visible}
.matriz circle{fill:currentColor}
.matriz .off{opacity:.13}
.riel .matriz{--punto:2.5px;color:var(--agua-claro)}
.riel .matriz svg{max-width:56px}
.matriz--grande{--punto:clamp(9px,1.45vw,22px)}
.matriz--piso{--punto:clamp(6px,.8vw,11px)}
.matriz--horas{--punto:clamp(7px,1.05vw,15px)}
.matriz--movil{--punto:2.2px}

main{margin-left:var(--riel)}

/* ---------- −24 m ---------- */
.s-arrecife{position:relative;height:100vh;height:100svh;min-height:620px;overflow:hidden;background:var(--hondo);color:var(--blanco)}
.s-arrecife__foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 40%}
.s-arrecife::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,32,59,.28) 0%,rgba(3,32,59,0) 26%,rgba(3,32,59,.06) 52%,rgba(3,32,59,.9) 100%);pointer-events:none}
.rayos{position:absolute;top:-10%;left:18%;width:70%;height:78%;z-index:1;mix-blend-mode:screen;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000 10%,transparent 92%);mask-image:linear-gradient(180deg,#000 10%,transparent 92%)}
.rayos i{position:absolute;top:0;height:100%;width:9%;background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0));filter:blur(14px);transform-origin:top center;opacity:.22;animation:rayo 13s ease-in-out infinite alternate}
.rayos i:nth-child(1){left:8%;transform:skewX(-14deg)}
.rayos i:nth-child(2){left:32%;width:5%;animation-duration:17s;opacity:.18}
.rayos i:nth-child(3){left:55%;width:12%;animation-duration:11s;opacity:.14}
.rayos i:nth-child(4){left:76%;width:6%;animation-duration:19s;opacity:.2}
@keyframes rayo{from{transform:skewX(-16deg) translateX(-12px)}to{transform:skewX(-8deg) translateX(14px)}}
.causticas{position:absolute;left:0;top:0;width:100%;height:48%;z-index:1;opacity:.16;mix-blend-mode:soft-light;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000,transparent);mask-image:linear-gradient(180deg,#000,transparent)}
.causticas rect{fill:#fff}
.s-arrecife__titulo{position:absolute;left:var(--margen);right:var(--margen);bottom:15vh;z-index:2;font:800 clamp(64px,12.6vw,214px)/.82 var(--f-xc);letter-spacing:-.004em}
.s-arrecife__titulo span{display:block}
.s-arrecife__titulo span+span{margin-left:1.12em}
.s-arrecife__nota{position:absolute;right:40px;bottom:44px;z-index:2;max-width:31ch;font:500 15px/1.4 var(--f);text-align:right;color:rgba(255,255,255,.9)}
.sube{position:absolute;left:var(--margen);bottom:44px;z-index:2;display:flex;align-items:center;gap:10px;font:600 14px/1 var(--f-sc);color:rgba(255,255,255,.88)}
.sube__burbuja{width:10px;height:10px;border:1.5px solid currentColor;border-radius:50%;animation:burbuja 2.4s ease-in infinite}
@keyframes burbuja{0%{transform:translateY(8px);opacity:0}25%{opacity:1}100%{transform:translateY(-16px);opacity:0}}

/* ---------- deriva ---------- */
.s-deriva{position:relative;overflow:hidden;color:var(--blanco);background:linear-gradient(180deg,var(--hondo) 0%,#052c50 40%,var(--medio) 100%);padding:22vh var(--margen) 16vh;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:8vh}
.deriva__nombres{position:absolute;top:7vh;left:0;display:flex;gap:.22em;white-space:nowrap;font:800 22vw/.8 var(--f-xc);color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.17);pointer-events:none;z-index:0;will-change:transform}
.deriva__texto{grid-column:1/span 5;position:relative;z-index:1;align-self:start}
.deriva__texto h2{font:800 clamp(48px,6.2vw,106px)/.9 var(--f-xc);margin-bottom:28px;text-wrap:balance}
.deriva__texto p{max-width:42ch;color:rgba(255,255,255,.92)}
.deriva__texto p+p{margin-top:14px}
.deriva__fisica{font-size:16px;color:var(--agua-claro)!important}
.deriva__grafica{grid-column:7/span 6;position:relative;z-index:1;align-self:start;margin-top:4vh}
.grafica{width:100%;height:auto;overflow:visible;font-family:var(--f-sc)}
.grafica__regla line{stroke:rgba(255,255,255,.55)}
.grafica__regla .grafica__guia{stroke:rgba(255,255,255,.12);stroke-dasharray:3 6}
.grafica__regla text{fill:rgba(255,255,255,.72)}
.arr line{stroke:rgba(255,255,255,.9);stroke-width:3;transition:stroke .3s,stroke-width .3s}
.arr circle{fill:var(--blanco);transition:fill .3s}
.arr text{fill:var(--blanco);font:700 17px var(--f-sc)}
.arr .arr__m{fill:rgba(255,255,255,.72);font:500 13px var(--f-sc)}
.arr__punteada{stroke-dasharray:4 5;stroke-width:2!important}
.arr.is-aqui line{stroke:var(--agua-claro);stroke-width:5}
.arr.is-aqui circle{fill:var(--agua-claro)}
.arr.is-aqui text{fill:var(--agua-claro)}
.grafica__tu line{stroke:var(--agua-claro);stroke-width:1.5;stroke-dasharray:7 6}
.grafica__tu text{fill:var(--agua-claro);font:700 15px var(--f-sc)}
.deriva__grafica figcaption{margin-top:10px;font-size:13px;color:rgba(255,255,255,.72)}
.deriva__fotos{grid-column:1/span 7;position:relative;z-index:1;padding-bottom:10vh}
.deriva__foto--a{width:84%;aspect-ratio:3/2;object-fit:cover}
.deriva__foto--b{position:absolute;right:0;bottom:0;width:48%;aspect-ratio:4/3;object-fit:cover;box-shadow:0 30px 60px rgba(0,10,25,.45)}
.deriva__socios{grid-column:9/span 4;position:relative;z-index:1;align-self:end;padding-bottom:10vh}
.deriva__socios p{font-size:16px;color:rgba(255,255,255,.88);margin-bottom:18px;max-width:30ch}
.deriva__socios li{font:700 clamp(26px,2.4vw,36px)/1.1 var(--f-c);padding:14px 0;border-top:1px solid rgba(255,255,255,.22)}
.deriva__socios li:last-child{border-bottom:1px solid rgba(255,255,255,.22)}

/* ---------- parada de seguridad ---------- */
.s-parada{position:relative;height:100vh;height:100svh;min-height:600px;overflow:hidden;color:var(--blanco);background:linear-gradient(180deg,var(--medio) 0%,var(--somero) 100%)}
.parada__marco{position:relative;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 var(--margen)}
.parada__reloj{position:relative;z-index:1;margin-bottom:5vh}
.parada__titulo{position:relative;z-index:1;font:800 clamp(40px,5vw,86px)/.95 var(--f-c);margin-bottom:14px}
.parada__texto{position:relative;z-index:1;max-width:34ch;font-size:19px;color:rgba(255,255,255,.95)}
.burbujas{position:absolute;inset:0;pointer-events:none;z-index:0}
.burbujas span{position:absolute;bottom:-24px;border:1.5px solid rgba(255,255,255,.7);border-radius:50%}
.superficie{position:absolute;left:0;top:0;width:100%;height:100%;z-index:3;fill:var(--blanco);display:none}
.anim-ok .superficie{display:block}

/* ---------- 0 m ---------- */
.s-malecon{position:relative;background:var(--blanco);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;padding-bottom:16vh}
.malecon__cabeza{grid-column:1/span 5;padding:20vh 0 0 var(--margen);position:relative;z-index:1}
.malecon__cabeza h2{font:800 clamp(52px,7.4vw,128px)/.86 var(--f-sc);margin-bottom:30px;margin-right:-30%;text-wrap:balance}
.malecon__cabeza p{max-width:34ch}
.malecon__azul{margin-top:14px;color:var(--agua)}
.malecon__foto{grid-column:6/-1;width:100%;height:100vh;height:100svh;min-height:560px;object-fit:cover}
.linea{grid-column:1/-1;position:relative;margin:13vh var(--margen) 0;padding-top:28px}
.linea__titulo{font:700 15px/1 var(--f);margin-bottom:24px}
.linea__puntos{position:relative;height:250px}
.linea__puntos::before{content:"";position:absolute;left:0;right:0;top:124px;height:2px;background:var(--negro)}
.linea__punto{position:absolute;left:calc(var(--x) * (100% - 24px));bottom:calc(50% + 18px);width:max-content;max-width:240px;font:500 14px/1.3 var(--f)}
.linea__punto::after{content:"";position:absolute;left:0;top:calc(100% + 10px);width:14px;height:14px;border-radius:50%;background:var(--blanco);border:2px solid var(--negro)}
.linea__punto .num{font:800 52px/1 var(--f-sc);letter-spacing:-.01em}
.linea__punto b{display:block;font-weight:600;margin-top:6px}
.linea__punto--abajo{bottom:auto;top:calc(50% + 22px)}
.linea__punto--abajo::after{top:auto;bottom:calc(100% + 10px)}
.linea__punto--hotel::after{background:var(--agua);border-color:var(--agua)}
.linea__punto--hotel b{font:800 20px/1 var(--f-sc);margin:0}
.linea__punto:last-child{transform:translateX(calc(-100% + 14px))}
.linea__punto:last-child::after{left:auto;right:0}
.linea__nota{margin-top:28px;color:var(--gris)}

/* ---------- pisos ---------- */
.piso{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;padding:16vh var(--margen);background:var(--blanco);border-top:1px solid rgba(0,0,0,.08);align-items:start}
.piso__numero{grid-column:1/span 2;padding-top:10px}
.piso__texto{grid-column:3/span 4}
.piso__texto h2{font:800 clamp(42px,4.9vw,84px)/.9 var(--f-sc);margin-bottom:24px;text-wrap:balance}
.piso__nombre{display:block;font:600 16px/1.2 var(--f);color:var(--gris);margin-bottom:14px}
.piso__texto p{max-width:38ch}
.piso__foto{grid-column:7/-1;width:100%;height:72vh;object-fit:cover}
.piso--p1{background:var(--cal)}
.piso__foto-marco{grid-column:7/-1;position:relative;margin-right:calc(var(--margen) * -1);margin-top:-6vh}
.piso__foto-marco .piso__foto{height:92vh;object-position:center 72%}
.piso__foto-marco::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(104deg,rgba(0,0,0,.075) 0 16px,transparent 16px 46px);mix-blend-mode:multiply;pointer-events:none}
.piso--p2 .piso__numero{grid-column:7/span 2;grid-row:1}
.piso--p2 .piso__texto{grid-column:9/span 4;grid-row:1}
.piso--p2 .piso__foto{grid-column:1/span 6;grid-row:1;height:78vh}

/* ---------- cuartos ---------- */
.s-cuartos{background:var(--blanco);padding:18vh var(--margen) 16vh;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:9vh;border-top:1px solid rgba(0,0,0,.08)}
.cuartos__titulo{grid-column:1/span 9;font:800 clamp(48px,6.6vw,116px)/.88 var(--f);letter-spacing:-.012em;text-wrap:balance}
.ficha{grid-column:1/-1;position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:end}
.ficha__foto{grid-row:1}
.ficha__cuerpo{grid-row:1}
.ficha--mar .ficha__foto{grid-column:1/span 8;width:100%;height:78vh;object-fit:cover}
.ficha--mar .ficha__cuerpo{grid-column:8/span 5;position:relative;z-index:1;background:var(--blanco);padding:36px 36px 32px;margin-bottom:9vh;box-shadow:0 24px 60px rgba(0,0,0,.14)}
.ficha--ciudad .ficha__foto{grid-column:5/span 4;width:100%;aspect-ratio:4/5;object-fit:cover}
.ficha--ciudad .ficha__cuerpo{grid-column:9/span 4;padding-bottom:3vh}
.ficha h3{font:800 clamp(26px,2.3vw,36px)/1 var(--f-sc);margin-bottom:22px}
.ficha__datos{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;column-gap:28px;margin-bottom:18px}
.ficha__datos dt{font:500 13px/1.2 var(--f);color:var(--gris)}
.ficha__datos dd{font:800 26px/1.05 var(--f-sc)}
.ficha p{max-width:36ch}
.cuartos__todos{grid-column:1/-1;font-size:16px;color:var(--gris)}

/* ---------- reservar ---------- */
.s-reservar{background:var(--reserva);color:var(--blanco);padding:18vh var(--margen) 16vh;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:7vh;outline:none}
.reservar__cabeza{grid-column:1/span 5}
.reservar__cabeza h2{font:800 clamp(52px,6.6vw,116px)/.88 var(--f);letter-spacing:-.012em;margin-bottom:22px}
.reservar__cabeza p{max-width:32ch;color:rgba(255,255,255,.9)}
.reserva{grid-column:6/-1;align-self:end;display:grid;grid-template-columns:1fr 1fr 150px;border:1px solid rgba(255,255,255,.4)}
.campo{display:flex;flex-direction:column;gap:6px;min-width:0;padding:18px 20px 16px;border-right:1px solid rgba(255,255,255,.4)}
.campo input,.campo select{min-width:0}
.campo--corto{border-right:0}
.campo span{font:600 13px/1 var(--f);color:rgba(255,255,255,.85)}
.campo input,.campo select{width:100%;background:transparent;border:0;color:var(--blanco);font:700 24px/1.2 var(--f-sc);color-scheme:dark;padding:0}
.campo select option{color:var(--negro)}
.reserva .boton--llenar{grid-column:1/-1}
.reserva__error{grid-column:1/-1;padding:12px 20px;background:var(--blanco);color:#9B1C1C;font-weight:600}
.reservar__datos{grid-column:6/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px}
.reservar__datos li{font-size:16px;line-height:1.4;padding-top:14px;border-top:1px solid rgba(255,255,255,.3)}
.reservar__letra{grid-column:6/-1;font-size:14px;color:rgba(255,255,255,.78);margin-top:-3vh}

/* ---------- último día ---------- */
.s-ultimo{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;padding:16vh var(--margen);align-items:center}
.ultimo__horas{grid-column:1/span 5}
.ultimo__texto{grid-column:7/span 5}
.ultimo__texto h2{font:800 clamp(42px,5vw,86px)/.9 var(--f);letter-spacing:-.01em;margin-bottom:22px}

/* ---------- otras casas ---------- */
.s-casas{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(0,0,0,.1)}
.casa{display:block;padding:12vh var(--margen);text-decoration:none;transition:background .3s}
.casa+.casa{border-left:1px solid rgba(0,0,0,.1)}
.casa:hover{background:var(--cal)}
.casa__pregunta{display:block;font:800 clamp(32px,3.6vw,58px)/.95 var(--f-sc);margin-bottom:14px}
.casa__nombre{font-size:18px;text-decoration:underline;text-underline-offset:5px}

/* ---------- pie ---------- */
.pie{margin-left:var(--riel);background:var(--negro);color:var(--blanco);padding:14vh var(--margen) 6vh;display:grid;grid-template-columns:1.1fr 1fr 1fr .7fr;gap:40px}
.pie__logo{width:190px}
.pie__titulo{font:700 15px/1.2 var(--f);color:rgba(255,255,255,.7);margin-bottom:16px}
.pie__col p{margin-bottom:14px;font-size:17px}
.pie__col a{text-underline-offset:4px}
.pie__google{color:rgba(255,255,255,.75)}
.pie__legal{grid-column:1/-1;margin-top:8vh;font-size:13px;color:rgba(255,255,255,.6)}

.barra-movil,.barra-movil__reservar{display:none}

/* ---------- celular ---------- */
@media (max-width:900px){
  :root{--riel:0px;--margen:20px}
  body{font-size:17px}
  .riel{display:none}
  .cabeza{height:68px;padding:0 18px;gap:12px}
  .cabeza__logo{width:96px}
  .cabeza__reservar{display:none}
  .s-arrecife__titulo{bottom:21vh;font-size:clamp(58px,19vw,120px)}
  .s-arrecife__titulo span+span{margin-left:.5em}
  .s-arrecife__nota{left:20px;right:20px;bottom:96px;text-align:left;font-size:14px}
  .sube{display:none}
  .s-deriva,.s-malecon,.piso,.s-cuartos,.s-reservar,.s-ultimo{display:block}
  .s-deriva{padding:16vh 20px 12vh}
  .deriva__nombres{font-size:36vw}
  .deriva__texto,.deriva__grafica,.deriva__fotos,.deriva__socios{margin-bottom:9vh}
  .deriva__fotos{padding-bottom:16vh}
  .deriva__foto--a{width:100%}
  .deriva__foto--b{width:62%}
  .malecon__cabeza{padding:16vh 20px 6vh}
  .malecon__cabeza h2{margin-right:0}
  .malecon__foto{height:62svh;min-height:0}
  .linea{margin:9vh 20px 0}
  .linea__titulo{margin-bottom:22px}
  .linea__puntos{height:auto;border-left:2px solid var(--negro);padding-left:22px}
  .linea__puntos::before{display:none}
  .linea__punto,.linea__punto--abajo,.linea__punto--hotel,.linea__punto:last-child{position:relative;left:auto;top:auto;bottom:auto;transform:none;max-width:none;margin-bottom:22px}
  .linea__punto::after,.linea__punto--abajo::after,.linea__punto--hotel::after,.linea__punto:last-child::after{left:-31px;right:auto;top:12px;bottom:auto}
  .linea__punto .num{font-size:38px}
  .linea__nota{margin-top:10px}
  .piso{padding:12vh 20px}
  .piso__numero{margin-bottom:22px}
  .piso__foto,.piso--p2 .piso__foto{height:56svh;margin-top:6vh}
  .piso__foto-marco{margin:6vh -20px 0 0}
  .piso__foto-marco .piso__foto{height:60svh;margin-top:0}
  .s-cuartos{padding:14vh 20px}
  .cuartos__titulo{margin-bottom:7vh}
  .ficha{display:block;margin-bottom:8vh}
  .ficha--mar .ficha__foto{height:58svh}
  .ficha--mar .ficha__cuerpo{position:relative;right:auto;bottom:auto;width:auto;margin:-12vh 16px 0;padding:26px 22px}
  .ficha__datos{column-gap:14px}
  .ficha__datos dd{font-size:19px}
  .s-reservar{padding:14vh 20px 18vh}
  .reservar__cabeza{margin-bottom:6vh}
  .reserva{grid-template-columns:minmax(0,1fr)}
  .campo{border-right:0;border-bottom:1px solid rgba(255,255,255,.4)}
  .campo input,.campo select{font-size:20px}
  .reservar__datos{grid-template-columns:1fr;row-gap:16px;margin-top:6vh}
  .reservar__letra{margin-top:24px}
  .s-ultimo{padding:12vh 20px}
  .ultimo__horas{margin-bottom:6vh}
  .s-casas{grid-template-columns:1fr}
  .casa+.casa{border-left:0;border-top:1px solid rgba(0,0,0,.1)}
  .pie{margin-left:0;grid-template-columns:1fr;padding:12vh 20px 120px}
  .barra-movil{display:flex;position:fixed;left:0;right:0;bottom:0;height:66px;z-index:60;align-items:center;padding:0 18px;background:rgba(2,20,37,.86);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--agua-claro)}
  .en-tierra .barra-movil{background:rgba(255,255,255,.92);color:var(--agua)}
  .barra-movil__reservar{display:inline-flex;position:fixed;right:12px;bottom:11px;z-index:61}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rayos i,.sube__burbuja{animation:none}
  .burbujas{display:none}
}
.sin-animacion .superficie{display:none}