/* ERA V3 — one locally pinned narrative. Concept → location → coast.
   The display typeface remains configurable in refinements.css.
   Fixed reference geometry, live flower videos, no artificial scroll dwell. */
:root{--story-travel:220vw}
.flower{display:block;pointer-events:none!important;user-select:none;translate:none!important;object-fit:contain;contain:layout style}
.flower>video{display:block;width:100%;height:auto;max-width:none;object-fit:contain;pointer-events:none;background:transparent}
.flower>.foliage-still{display:block!important;width:100%;height:auto;max-width:none;object-fit:contain;pointer-events:none}
.flower>video[data-foliage]{display:none!important}
.foliage-video-supported .flower>.foliage-still{display:none!important}
.foliage-video-supported .flower>video[data-foliage]{display:block!important}
.flower.mirror-flower>.foliage-still{transform:scaleX(-1)}
.flower::after,.flower::before{display:none!important}
.story-scroll{position:relative;width:100%;height:calc(100svh + 220vw);overflow:visible;isolation:isolate;view-timeline-name:--era-story;view-timeline-axis:block}
.story-stage{position:sticky;top:0;width:100%;height:100svh;overflow:hidden;isolation:isolate}
.story-track{position:relative;display:flex;width:320vw;height:100%;will-change:transform;transform:translate3d(0,0,0);transition:none!important}
.story-panel{position:relative;flex-shrink:0;height:100svh;min-height:0;overflow:visible;background:var(--paper)}
.story-track>.concept{width:100vw;flex-basis:100vw;padding:0;display:block;text-align:center}
.story-track>.concept>.micro{position:absolute;top:37%;left:20%;width:60%;margin:0;font-size:clamp(9px,.69vw,13px);font-weight:600;letter-spacing:.045em;line-height:1.15}
.story-track>.concept>h2{position:absolute;left:22%;top:43%;width:56%;max-width:none;font-size:clamp(26px,3.05vw,59px);line-height:1.055;letter-spacing:-.047em;margin:0;text-transform:uppercase;font-stretch:62.5%}
.concept-heading>span{display:block;white-space:nowrap}
.story-track>.concept>.copy{position:absolute;top:74%;left:41.5%;width:17%;max-width:none;margin:0;font-size:clamp(10px,.82vw,16px);line-height:1.29}
.story-track>.concept>.rosette{position:absolute;top:88%;left:48.4%;width:3.2%;height:auto;margin:0}
.story-track>.concept>.flower.top-left{left:0;top:0;width:38.54vw;height:auto;max-width:none;transform:none;z-index:6}
.story-track>.story-upright{position:absolute;left:80vw;bottom:0;width:57.3vw;max-width:none;z-index:7;transform:none;height:auto}
.story-track>.location-first{position:relative;width:120vw;flex-basis:120vw;height:100%;padding:0;overflow:visible}
.story-track .location-title{position:absolute;left:19vw;top:20.5svh;z-index:4;font-size:clamp(104px,11.45vw,220px);line-height:.92;letter-spacing:-.055em;margin:0;max-width:none;width:auto}
.story-track .location-title span{display:block;white-space:nowrap}
.story-track .location-title span:nth-child(2){margin-left:9vw}
.story-track .location-title span:nth-child(3){margin-left:-3vw}
.story-track .location-country{position:absolute;left:10.3vw;top:49%;font-size:clamp(12px,1.35vw,26px);letter-spacing:.8em;font-family:var(--display);line-height:1}
.story-track .location-photo{position:absolute;left:44vw;top:5.5svh;right:auto;width:37vw;height:89svh;margin:0;z-index:3;overflow:hidden}
.story-track .location-photo .media,.story-track .location-photo img{height:100%;width:100%}
.story-track .location-photo img{object-fit:cover;object-position:50% 50%;transform:none!important}
.story-track .location-text{position:absolute;left:82vw;top:auto;bottom:5.5svh;width:28vw;margin:0;z-index:5}
.story-track .location-text h3{font-size:clamp(24px,2.5vw,48px);line-height:1.02;margin:0 0 1.6svh;letter-spacing:-.045em}
.story-track .location-text .copy{font-size:clamp(10px,.82vw,16px);line-height:1.3;max-width:100%;margin:0}
.story-track>.location-second{position:relative;width:100vw;flex-basis:100vw;left:auto;height:100%;padding:0;overflow:visible}
.story-track .location-second h2{position:absolute;top:21.5svh;left:23vw;right:auto;width:54vw;max-width:none;font-size:clamp(45px,4.6vw,90px);line-height:1;letter-spacing:-.043em;text-align:center;margin:0;z-index:2}
.story-track .location-second h2 .script{display:block;text-transform:none;font-weight:400;line-height:.82;font-size:1.48em;margin:-.02em 0 .07em}
.story-track .location-second>.flower{position:absolute;left:-28vw;right:auto;top:0;width:40vw;height:auto;max-width:none;z-index:6;transform:none;transform-origin:100% 0}
.story-track .location-second .round-cta{position:absolute;left:-11vw;right:auto;top:38%;bottom:auto;width:13vw;height:13vw;min-width:0;min-height:0;margin:0;z-index:8;transform:none}
.story-track .round-cta .micro{font-size:clamp(9px,.7vw,14px);line-height:1.2;letter-spacing:.025em;font-weight:600}
.story-track .round-cta .arr{display:none}
.story-track .coastline{position:absolute;left:14vw;right:auto;bottom:8.7svh;width:72vw;height:auto;aspect-ratio:1440/225;transform:none}
.story-track .coastline svg{width:100%;height:100%;overflow:visible}
.coast-place{font:600 16px Arial,Helvetica,sans-serif;letter-spacing:.4px;text-transform:uppercase;fill:currentColor}
.coast-time{font:400 16px Arial,Helvetica,sans-serif;text-transform:uppercase;fill:currentColor;opacity:.82}
@keyframes story-horizontal{from{transform:translate3d(0,0,0)}to{transform:translate3d(calc(-1 * var(--story-travel)),0,0)}}
@supports(animation-timeline:view()){
 .native-story-timeline:not(.reduced-experience) .story-track{animation:story-horizontal linear both;animation-timeline:--era-story;animation-range:contain 0% contain 100%}
}
/* These sections no longer convert wheel movement to horizontal motion. */
#app .types-scroll{height:100svh;min-height:720px;overflow:hidden;isolation:isolate}
#app .types-stage{position:relative;top:auto;height:100%;min-height:720px;overflow:hidden}
#app .types-track{position:relative;display:flex;width:300%;height:100%;transition:transform .7s cubic-bezier(.22,.61,.36,1);will-change:transform}
#app .type-panel{position:relative;flex:0 0 33.333333%;width:33.333333%;height:100%;min-height:0;padding:8svh 0 0}
#app .type-title{font-size:clamp(48px,6.2vw,120px);line-height:1.04}
#app .types-stage>.carousel-controls{display:flex;position:absolute;left:50%;bottom:4svh;transform:translateX(-50%);z-index:6}
#app .space-panels{height:105svh;min-height:760px;padding:0;position:relative;overflow:hidden}
#app .space-left{position:absolute;left:0;top:12svh;width:42%;height:90svh;margin:0}
#app .space-left>div{position:absolute;left:20%;top:15%;width:60%;height:72%}
#app .space-left>div>.media{height:100%;width:100%}
#app .space-left>.flower{left:auto;right:-24%;top:-13%;width:88%;height:auto;max-width:none;transform:none;z-index:5}
#app .space-right{position:absolute;left:61%;top:0;width:32%;margin:0}
#app .space-right>div{height:45svh;width:100%}
#app .space-right>div>.media{width:100%;height:100%}
#app .space-right h3{font-size:clamp(27px,2.5vw,48px);line-height:1.06;margin:3svh 0 1.5svh}
#app .space-right .copy{font-size:clamp(11px,.78vw,15px);line-height:1.45}
#app .space-panels>.round-cta{position:absolute;left:45%;right:auto;bottom:10%;width:11vw;height:11vw;min-width:140px;min-height:140px}
#app .interior-gallery{position:relative;display:block;padding:8svh 0 7svh;min-height:95svh;overflow:hidden}
#app .interior-gallery .gallery-image{width:74%;height:76svh;margin:0 7% 0 19%;min-height:500px}
#app .interior-gallery>.carousel-controls{margin:3svh auto 0}
/* Recovered transparent foliage must never contain a cut-out facade segment. */
.architecture-stage .flower.left-low{width:42vw;left:5%;bottom:0;top:auto;transform:none}
.architecture-stage .flower.bottom-right{width:29vw;right:0;bottom:0;top:auto;transform:none}
.partners>.flower.top-right,.catalog>.flower.top-right{top:0;right:0;transform:none;width:32vw;max-width:none}
.surface-statement>.flower.left-low{left:-6vw;bottom:0;top:auto;transform:none;width:44vw;max-width:none}
@media(max-width:800px){
 .story-scroll{height:calc(100svh + 280vw);--story-travel:280vw}
 .story-track{width:380vw}
 .story-track>.concept{height:100svh;padding:0;min-height:0}
 .story-track>.concept>.micro{top:31%;font-size:10px}
 .story-track>.concept>h2{top:37%;left:11%;width:78%;font-size:clamp(24px,5.8vw,42px);line-height:1.07}
 .story-track>.concept>h2>span{white-space:normal;display:inline}
 .story-track>.concept>h2>span::after{content:' '}
 .story-track>.concept>.copy{top:auto;bottom:17%;left:26%;width:48%;font-size:11px;line-height:1.38}
 .story-track>.concept>.rosette{top:auto;bottom:6%;left:46%;width:8%}
 .story-track>.concept>.flower.top-left{width:60vw}
 .story-track>.story-upright{left:87vw;width:94vw;bottom:0}
 .story-track>.location-first{width:180vw;flex-basis:180vw;min-height:0}
 .story-track .location-title{left:20vw;top:23%;font-size:22vw;line-height:.91}
 .story-track .location-title span:nth-child(2){margin-left:10vw}
 .story-track .location-title span:nth-child(3){margin-left:-5vw}
 .story-track .location-country{left:9vw;top:42%;font-size:13px;letter-spacing:.35em}
 .story-track .location-photo{left:70vw;top:15svh;width:62vw;height:65svh}
 .story-track .location-text{left:136vw;bottom:20svh;width:39vw;top:auto}
 .story-track .location-text h3{font-size:26px;margin-bottom:15px}
 .story-track .location-text .copy{font-size:11px}
 .story-track>.location-second{height:100svh;min-height:0;width:100vw;flex-basis:100vw}
 .story-track .location-second h2{left:11vw;top:25%;width:78vw;font-size:9vw}
 .story-track .location-second>.flower{left:-46vw;right:auto;width:82vw}
 .story-track .location-second .round-cta{left:-32vw;top:32%;width:27vw;height:27vw;min-width:0;min-height:0}
 .story-track .round-cta .micro{font-size:8px}
 .story-track .coastline{left:7vw;bottom:15svh;width:89vw;aspect-ratio:1440/225}
 .coast-place,.coast-time{font-size:21px}
 #app .types-scroll{height:104svh;min-height:770px}
 #app .types-stage{height:100%;min-height:770px}
 #app .type-panel{height:100%;min-height:0;padding-top:9svh}
 #app .type-title{font-size:clamp(34px,7.3vw,59px);line-height:1.1;width:84%;max-width:84%;min-height:2.2em;margin:0 auto 3svh}
 #app .type-layout{display:grid;grid-template-columns:.8fr 1.2fr;width:84%;gap:20px;margin:0 auto;align-items:center}
 #app .type-photo{grid-column:2;grid-row:1;height:38svh;min-height:260px;width:100%}
 #app .type-stats{grid-column:1;grid-row:1;display:block}
 #app .type-stats b{font-size:clamp(28px,6.8vw,45px);white-space:normal}
 #app .type-stats>div+div{margin-top:27px}
 #app .type-description{grid-column:1/-1;grid-row:2;font-size:12px;text-align:left;margin:0}
 #app .type-description .outline-button{margin-top:17px;min-height:44px}
 #app .types-stage>.carousel-controls{bottom:3svh}
 #app .space-panels{height:auto;min-height:0;padding:0 0 40px}
 #app .space-left{position:relative;top:auto;left:auto;width:80%;height:76svh;min-height:500px;margin:0 0 45px}
 #app .space-left>.flower{width:90%;top:0;right:-20%}
 #app .space-right{position:relative;left:auto;top:auto;width:82%;margin-left:12%}
 #app .space-right>div{height:52svh}
 #app .space-right h3{font-size:30px;margin:25px 0 18px}
 #app .space-panels>.round-cta{position:relative;left:auto;bottom:auto;width:130px;height:130px;min-width:130px;min-height:130px;margin:28px 24px 0 auto}
 #app .interior-gallery{padding:30px 0 65px;min-height:0}
 #app .interior-gallery .gallery-image{height:63svh;min-height:360px;width:94%;margin:0 0 0 6%}
 .partners>.flower.top-right,.catalog>.flower.top-right{width:52vw}
}
/* A motion-reduced document stays readable. Not a hidden or permanently pinned track. */
.reduced-experience .story-scroll{height:auto}
.reduced-experience .story-stage{height:auto;position:relative}
.reduced-experience .story-track{width:100%;height:auto;display:block;transform:none!important;animation:none!important}
.reduced-experience .story-track>.story-panel{width:100%;height:100svh;min-height:700px}
.reduced-experience .story-track>.story-upright{display:none}
.reduced-experience .story-track .location-title{left:12vw;font-size:8.5vw}
.reduced-experience .story-track .location-photo{left:53vw;width:36vw;height:65svh}
.reduced-experience .story-track .location-text{left:53vw;width:36vw;bottom:5svh}
.reduced-experience .story-track .location-second .round-cta{left:8vw;top:44%}
@media(prefers-reduced-motion:reduce){#app .types-track{transition:none}}
.flower.mirror-flower>video{transform:scaleX(-1)}
.story-track>.concept>h2{font-size:clamp(26px,2.83vw,55px)}
@media(max-width:800px){
 .story-track>.concept>h2{font-size:clamp(24px,5.8vw,42px)}
 #app .types-scroll,#app .types-stage{height:112svh;min-height:930px}
 #app .type-panel{padding-top:177px}
 #app .type-title{margin-bottom:20px;min-height:2.2em}
 #app .type-photo{height:36svh;min-height:260px}
}
.story-stage{overflow:clip}
#app [data-carousel="types"]>.types-stage>.types-track{transform:translate3d(calc(-100% * var(--type-index,0) / 3),0,0)!important}

/* V4 fix: in the concept/location banner the hanging bougainvillea belongs to the maroon banner seam, not the outer page edge. */

/* LATIDOS final override — intentionally last stylesheet rule block. */
@media(min-width:801px){
  .story-track>.concept>.flower.top-left{width:24vw!important;left:0!important;top:0!important}
  .story-track>.story-upright{width:34vw!important;left:90vw!important}
  .story-track .location-second>.flower{width:25vw!important;left:-16vw!important}
  #app .space-left>.flower{width:52%!important;right:-11%!important;top:-7%!important}
  .architecture-stage .flower.left-low{width:27vw!important;left:4%!important}
  .architecture-stage .flower.bottom-right{width:18vw!important;right:0!important}
  .partners>.flower.top-right,.catalog>.flower.top-right,.contact-page>.flower.top-right{width:20vw!important}
  .surface-statement>.flower.left-low{width:28vw!important;left:-3vw!important}

  .story-track .location-title{
    left:18vw!important;
    top:21svh!important;
    font-size:clamp(72px,8.6vw,166px)!important;
    line-height:.97!important;
    letter-spacing:-.035em!important;
    width:auto!important;
    text-align:left!important;
  }
  .story-track .location-title span,
  .story-track .location-title span:nth-child(2),
  .story-track .location-title span:nth-child(3){margin-left:0!important;white-space:nowrap!important}
  .story-track>.concept>h2{letter-spacing:-.03em!important}
}

@media(max-width:800px){
  .story-track>.concept>.flower.top-left{width:38vw!important}
  .story-track>.story-upright{width:58vw!important;left:93vw!important}
  .story-track .location-second>.flower{width:50vw!important;left:-28vw!important}
  #app .space-left>.flower{width:55%!important;right:-10%!important;top:-4%!important}
  .partners>.flower.top-right,.catalog>.flower.top-right,.contact-page>.flower.top-right{width:32vw!important}
  .architecture-stage .flower.left-low{width:36vw!important}
  .architecture-stage .flower.bottom-right{width:25vw!important}
  .surface-statement>.flower.left-low{width:36vw!important}

  .story-track .location-title{
    left:16vw!important;
    top:23%!important;
    font-size:17vw!important;
    line-height:.98!important;
    letter-spacing:-.025em!important;
  }
  .story-track .location-title span,
  .story-track .location-title span:nth-child(2),
  .story-track .location-title span:nth-child(3){margin-left:0!important}
}

/* =========================================================
   LATIDOS · DEMO REDES · ajustes rápidos 2026-09-20
   Poppins global, legibilidad móvil, CTA, contacto y media real
   ========================================================= */
:root{
  --display:'Poppins',Arial,Helvetica,sans-serif!important;
  --script:'Poppins',Arial,Helvetica,sans-serif!important;
  --body:'Poppins',Arial,Helvetica,sans-serif!important;
}
html,body,button,input,textarea,select{font-family:'Poppins',Arial,Helvetica,sans-serif!important}
body{font-size:16px;line-height:1.55}
.display,.script{font-family:'Poppins',Arial,Helvetica,sans-serif!important;font-stretch:normal!important;font-variation-settings:normal!important}
.script{font-style:italic!important;font-weight:600!important}
.copy{font-size:clamp(15px,.98vw,18px)!important;line-height:1.62!important}
.micro{font-size:clamp(11px,.72vw,13px)!important;line-height:1.4!important;letter-spacing:.12em}
.tagline{font-size:12px!important;line-height:1.4!important}
.underlink,.outline-button{font-family:'Poppins',Arial,Helvetica,sans-serif!important}

/* Main reservation button must win the hierarchy. */
.booking-cta{
  min-height:62px!important;
  padding:18px 30px!important;
  border-color:#D19020!important;
  background:#D19020!important;
  color:#11261B!important;
  font-size:clamp(13px,1vw,17px)!important;
  line-height:1.15!important;
  font-weight:800!important;
  letter-spacing:.07em!important;
  box-shadow:0 14px 38px rgba(0,0,0,.2);
}
.booking-cta:hover{background:#f0b33d!important;border-color:#f0b33d!important;transform:translateY(-2px)}
.hero-brief-actions .booking-cta{min-width:270px;justify-content:center}
.final-actions .booking-cta{min-width:290px;justify-content:center}

/* Contact is visible without opening the menu. */
.header-phone{white-space:nowrap;font-weight:600!important;letter-spacing:.01em!important}

/* Permanent direct WhatsApp control. */
.floating-whatsapp{
  left:auto!important;
  right:22px!important;
  bottom:24px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:10px!important;
  width:auto!important;
  min-width:0!important;
  padding:9px 13px 9px 9px!important;
  border:1px solid rgba(255,255,255,.25)!important;
  border-radius:999px!important;
  background:#25D366!important;
  color:#fff!important;
  box-shadow:0 12px 34px rgba(0,0,0,.28)!important;
  text-transform:none!important;
  letter-spacing:0!important;
  z-index:96!important;
}
.wa-icon{display:grid;place-items:center;width:36px;height:36px;flex:0 0 36px;border-radius:50%;background:#fff;color:#128C4A;font-size:21px;font-weight:800;line-height:1}
.wa-icon svg{display:block;width:22px;height:22px;fill:currentColor}
.wa-copy{display:flex;flex-direction:column;align-items:flex-start;gap:2px;white-space:nowrap}
.wa-copy strong{font-size:12px;line-height:1.05;font-weight:800}
.wa-copy small{font-size:10px;line-height:1.1;font-weight:600;opacity:.94}
.floating-whatsapp:hover{transform:translateY(-2px) scale(1.015)!important;background:#20c55d!important}

/* Social accounts — same handle everywhere. */
.social-cluster{margin-top:18px;max-width:720px}
.social-handle{margin:0 0 9px;font-size:13px;font-weight:700;letter-spacing:.02em}
.social-links{display:flex;flex-wrap:wrap;gap:8px}
.social-links a{display:inline-flex;align-items:center;gap:8px;padding:9px 12px;border:1px solid currentColor;border-radius:999px;font-size:11px;font-weight:700;line-height:1;transition:transform .22s ease,background .22s ease,color .22s ease}
.social-links a:hover{transform:translateY(-2px)}
.footer-socials{margin:12px 0 28px}
.footer-socials .social-links a{border-color:rgba(255,255,255,.35)}
.contact-socials{margin-top:22px}
.menu-socials{margin-top:22px}
.menu-socials .social-handle{font-size:12px}
.menu-socials .social-links{max-width:420px}

/* Destination-specific real photography. */
.real-route-photo{position:relative;overflow:hidden;background:#0a1b14}
.real-route-photo>img{width:100%;height:100%;display:block;object-fit:cover}
.real-media-credit{position:absolute;left:10px;bottom:10px;z-index:5;max-width:calc(100% - 20px);padding:6px 8px;border-radius:4px;background:rgba(8,20,15,.72);color:#fff!important;font-size:8px!important;font-weight:600;line-height:1.2;letter-spacing:.04em;text-transform:uppercase;backdrop-filter:blur(5px)}
.real-route-photo.used-fallback .real-media-credit,.auto-gallery-card.used-fallback .real-media-credit{opacity:.55}
.hot-card .real-route-photo{height:220px}
.amenity-layer .real-route-photo{position:absolute;inset:0;width:100%;height:100%}

.real-route-gallery{padding-top:clamp(70px,8vw,130px)!important;padding-bottom:clamp(70px,8vw,120px)!important}
.real-route-gallery .auto-gallery-card{position:relative;overflow:hidden;background:#e9e5dc}
.real-route-gallery .auto-gallery-card>img{width:100%;height:100%;object-fit:cover;display:block}
.real-route-gallery .auto-gallery-card .real-media-credit{left:10px;right:auto;bottom:39px;width:auto;color:#fff!important}
.real-route-gallery .auto-gallery-heading>p:last-child{font-size:12px!important;line-height:1.55!important;max-width:880px}

/* Real video block. */
.real-video-section{padding:clamp(80px,9vw,160px) 6vw;overflow:hidden}
.real-video-heading{max-width:760px;margin:0 auto clamp(40px,5vw,78px);text-align:center}
.real-video-heading h2{font-size:clamp(48px,7vw,108px);line-height:.96;margin:16px 0 24px;letter-spacing:-.045em}
.real-video-heading .copy{max-width:620px;margin:0 auto}
.real-video-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,52px);max-width:1320px;margin:0 auto}
.real-video-card{min-width:0}
.real-video-frame{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:2px;background:#07130e;box-shadow:0 24px 55px rgba(0,0,0,.24)}
.real-video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.real-video-card>p{display:flex;justify-content:space-between;gap:18px;align-items:baseline;margin:15px 0 0;font-size:12px;line-height:1.35}
.real-video-card>p strong{font-size:14px}
.real-video-card>p span{opacity:.7;text-align:right}

/* The route labels in the panorama are deliberately repeated as HTML on mobile,
   because SVG text shrinks with the complete 1440px route artwork. */
.coast-mobile-labels{display:none}

/* Timeline type becomes readable instead of editorially tiny. */
#app .type-stats>div>span{font-size:11px!important;line-height:1.35!important;letter-spacing:.12em}
#app .type-stats b{font-family:'Poppins',Arial,Helvetica,sans-serif!important;font-weight:600!important;letter-spacing:-.015em!important}
#app .type-description{font-size:14px!important;line-height:1.58!important}
#app .timeline-highlight{font-size:12px!important;font-weight:700!important}
#app .type-description .outline-button{font-size:12px!important;font-weight:700!important}

@media(max-width:800px){
  body{font-size:16px}
  .copy{font-size:15.5px!important;line-height:1.62!important}
  .micro{font-size:11.5px!important;line-height:1.42!important}
  .tagline{font-size:11.5px!important}
  .hero-secondary{font-size:14px!important;line-height:1.5!important}
  .hero-meta{font-size:12px!important;line-height:1.45!important}
  .hero-brief-actions .booking-cta,.final-actions .booking-cta{width:100%;min-width:0;min-height:64px!important;font-size:15px!important;padding:18px 20px!important}

  .header-phone{display:none!important}
  .floating-whatsapp{left:auto!important;right:14px!important;bottom:88px!important;width:auto!important;padding:8px 11px 8px 8px!important;text-align:left!important}
  .wa-icon{width:38px;height:38px;flex-basis:38px;font-size:22px}
  .wa-copy strong{font-size:12.5px}.wa-copy small{font-size:10.5px}

  .social-handle{font-size:13px}.social-links a{font-size:11.5px;padding:10px 12px}
  .menu-socials .social-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .menu-socials .social-links a{justify-content:center;padding:10px 6px;font-size:9px}

  .story-track .coastline{bottom:18svh!important}
  .coast-place{font-size:28px!important;font-family:'Poppins',Arial,sans-serif!important;font-weight:700!important}
  .coast-time{font-size:23px!important;font-family:'Poppins',Arial,sans-serif!important}
  .coast-mobile-labels{position:absolute;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px;left:-4vw;right:-4vw;top:calc(100% + 10px);font-family:'Poppins',Arial,sans-serif;font-size:clamp(16px,4.35vw,18px);font-weight:700;line-height:1.22;text-transform:uppercase;letter-spacing:.01em}
  .coast-mobile-labels span:last-child{grid-column:1/-1}

  #app .types-scroll,#app .types-stage{height:116svh!important;min-height:940px!important}
  #app .type-panel{padding-top:152px!important}
  #app .type-title{font-size:clamp(35px,8.2vw,54px)!important;line-height:1.08!important}
  #app .type-layout{grid-template-columns:.95fr 1.05fr!important;gap:18px!important;width:88%!important}
  #app .type-stats b{font-size:clamp(16px,4.25vw,21px)!important;line-height:1.38!important;max-width:none!important;overflow-wrap:anywhere}
  #app .type-stats>div>span{font-size:10px!important}
  #app .type-stats>div+div{margin-top:20px!important}
  #app .type-description{font-size:14.5px!important;line-height:1.58!important}
  #app .timeline-highlight{font-size:11.5px!important}
  #app .type-description .outline-button{min-height:48px!important;font-size:11.5px!important;padding:12px 15px!important}

  .real-route-gallery{padding-top:68px!important;padding-bottom:72px!important}
  .real-route-gallery .auto-gallery-heading{padding-left:7vw;padding-right:7vw}
  .real-route-gallery .auto-gallery-heading h2{font-size:clamp(37px,10vw,56px)!important;line-height:1.02!important}
  .real-route-gallery .auto-gallery-heading>p:last-child{font-size:12px!important;line-height:1.55!important}
  .real-route-gallery .auto-gallery-card .real-media-credit{font-size:7px!important;bottom:36px}

  .real-video-section{padding:76px 6vw 86px}
  .real-video-heading{text-align:left;margin:0 0 34px}
  .real-video-heading h2{font-size:clamp(43px,12vw,66px);line-height:.98}
  .real-video-grid{grid-template-columns:1fr;gap:36px}
  .real-video-card>p{display:block;font-size:11.5px}.real-video-card>p strong,.real-video-card>p span{display:block;text-align:left}.real-video-card>p strong{font-size:14px;margin-bottom:4px}
  .real-media-credit{font-size:7px!important;padding:5px 6px}
}

/* Final mobile legibility pass for route-point names. */
@media(max-width:800px){
  .coast-mobile-labels{font-size:15px!important;line-height:1.3!important;gap:8px 14px!important}
  #app .type-stats .route-points b{font-size:clamp(18px,4.8vw,23px)!important;line-height:1.38!important}
  #app .type-stats>div:not(.route-points) b{font-size:clamp(15.5px,4.05vw,19px)!important;line-height:1.4!important}
}


/* LATIDOS · MOBILE RESPONSIVE AUDIT FINAL · 2026-09-20 */
html,body{max-width:100%;overflow-x:clip}
img,video,iframe,svg{max-width:100%}

@media(max-width:800px){
  /* Header stays usable on 320–430 px screens. */
  .brand{left:14px!important;top:16px!important;width:116px!important;height:auto!important}
  .top-nav{right:14px!important;top:18px!important;max-width:150px!important;text-align:right}
  .top-nav .apartment-link{font-size:clamp(18px,5.2vw,22px)!important;line-height:.88!important}
  .nav-secondary{gap:8px!important;justify-content:flex-end!important;flex-wrap:wrap!important}
  .nav-secondary>a{font-size:8px!important;letter-spacing:.09em!important}

  /* Give the hero CTA breathing room above the two permanent contact controls. */
  .hero-brief{left:14px!important;right:14px!important;bottom:78px!important;padding:17px 16px 18px!important;max-height:calc(100svh - 150px);overflow:auto!important}
  .hero-brief h1{font-size:clamp(36px,10.8vw,52px)!important;line-height:.91!important;overflow-wrap:anywhere}
  .hero-brief h2{font-size:17px!important;line-height:1.18!important}
  .hero-meta{font-size:10.5px!important;line-height:1.45!important;letter-spacing:.09em!important}
  .hero-secondary{font-size:14px!important;line-height:1.48!important}
  .hero-brief-actions{gap:11px!important}
  .hero-brief-actions .underlink{font-size:10px!important;line-height:1.35!important}
  .hero-brief-actions .booking-cta{width:100%!important;min-height:62px!important;font-size:14.5px!important}

  /* Floating actions: always available, but no longer cover CTA/text on phones. */
  .floating-whatsapp{
    right:14px!important;left:auto!important;bottom:calc(14px + env(safe-area-inset-bottom))!important;
    width:52px!important;height:52px!important;min-width:52px!important;padding:7px!important;
    justify-content:center!important;border-radius:50%!important;overflow:hidden!important;
  }
  .floating-whatsapp .wa-icon{width:38px!important;height:38px!important;flex:0 0 38px!important}
  .floating-whatsapp .wa-copy{display:none!important}
  .latidos-chat{
    left:14px!important;right:auto!important;bottom:calc(14px + env(safe-area-inset-bottom))!important;
    width:52px!important;max-width:calc(100vw - 28px)!important;
  }
  .latidos-chat:not(.open) .chat-toggle{width:52px!important;height:52px!important;min-height:52px!important;padding:6px!important;border-radius:50%!important;justify-content:center!important}
  .latidos-chat:not(.open) .chat-toggle-copy{display:none!important}
  .latidos-chat:not(.open) .chat-toggle-icon{width:40px!important;height:40px!important;flex-basis:40px!important}
  .latidos-chat.open{width:calc(100vw - 28px)!important;right:14px!important}
  .latidos-chat.open .chat-panel{max-height:calc(100svh - 96px)!important;overflow:auto!important}
  body:has(.latidos-chat.open) .floating-whatsapp{opacity:0!important;pointer-events:none!important}

  /* Mobile timeline: vertical, readable and never clipped. */
  #app .types-scroll,#app .types-stage{height:auto!important;min-height:0!important;overflow:visible!important}
  #app .types-stage{position:relative!important;top:auto!important}
  #app .types-track{display:block!important;width:100%!important;height:auto!important;transform:none!important;transition:none!important}
  #app .type-panel{
    display:block!important;width:100%!important;height:auto!important;min-height:0!important;
    padding:108px 22px 78px!important;border-bottom:1px solid rgba(17,38,27,.14)!important;overflow:visible!important;
  }
  #app .type-title{
    width:100%!important;max-width:none!important;min-height:0!important;margin:0 0 30px!important;
    font-size:clamp(34px,9.3vw,48px)!important;line-height:1.04!important;text-align:left!important;
  }
  #app .type-title .day-label{font-size:11px!important;margin-bottom:10px!important}
  #app .type-layout{display:flex!important;flex-direction:column!important;width:100%!important;gap:22px!important;margin:0!important}
  #app .type-photo{order:1!important;width:100%!important;height:42svh!important;min-height:270px!important;max-height:380px!important}
  #app .type-stats{order:2!important;width:100%!important;display:grid!important;grid-template-columns:1fr!important;gap:18px!important}
  #app .type-stats>div,#app .type-stats>div+div{margin:0!important}
  #app .type-stats>div>span{font-size:11px!important;margin-bottom:8px!important}
  #app .type-stats b,#app .type-stats .route-points b,#app .type-stats>div:not(.route-points) b{
    font-size:clamp(18px,5vw,22px)!important;line-height:1.35!important;max-width:none!important;overflow-wrap:break-word!important;
  }
  #app .type-description{order:3!important;width:100%!important;max-width:none!important;margin:0!important;text-align:left!important;font-size:15px!important;line-height:1.62!important}
  #app .type-description p{max-width:none!important;margin-bottom:20px!important}
  #app .timeline-highlight{font-size:12px!important;line-height:1.45!important}
  #app .type-description .outline-button{width:100%!important;min-height:52px!important;justify-content:center!important;font-size:12px!important;margin-top:8px!important}
  #app .types-stage>.carousel-controls{display:none!important}

  /* Route names requested by the client. */
  .coast-mobile-labels{font-size:clamp(16.5px,4.6vw,19px)!important;line-height:1.28!important;gap:9px 14px!important}
  .coast-mobile-labels span{overflow-wrap:anywhere}

  /* Media / cards adapt without edge clipping. */
  .real-route-gallery .auto-gallery-heading>p:last-child{font-size:13px!important;line-height:1.6!important}
  .real-route-gallery .auto-gallery-card,.real-route-gallery .auto-gallery-card:nth-child(3n+2),.real-route-gallery .auto-gallery-card:nth-child(3n){width:82vw!important;flex-basis:82vw!important;height:54svh!important;min-height:380px!important;max-height:560px!important}
  .real-video-section{padding-left:20px!important;padding-right:20px!important}
  .real-video-heading h2{font-size:clamp(40px,11vw,58px)!important}
  .real-video-heading .copy{font-size:15px!important;line-height:1.6!important}
  .real-video-card>p{font-size:12.5px!important;line-height:1.5!important}
  .real-video-card>p strong{font-size:14.5px!important}

  /* Text sections stay within the viewport. */
  .surface-statement,.partners,.architecture-scroll,.finale-scroll{max-width:100vw!important;overflow:hidden!important}
  .information-heading{padding-left:22px!important;padding-right:22px!important}
  .footer{padding-left:22px!important;padding-right:22px!important}
  .footer-phone{font-size:clamp(31px,9.2vw,48px)!important;overflow-wrap:anywhere!important}
  .footer-socials .social-links{gap:7px!important}
  .footer-socials .social-links a{font-size:10.5px!important;padding:10px 11px!important}
  .menu-socials .social-links{grid-template-columns:1fr!important}
  .menu-socials .social-links a{font-size:11px!important;justify-content:flex-start!important;padding:11px 12px!important}
}

@media(max-width:380px){
  .brand{width:104px!important}
  .top-nav{max-width:132px!important}
  .hero-brief{bottom:74px!important;left:12px!important;right:12px!important}
  .hero-brief h1{font-size:34px!important}
  .hero-secondary{font-size:13px!important}
  #app .type-panel{padding-left:18px!important;padding-right:18px!important}
  #app .type-photo{height:35svh!important;min-height:235px!important;max-height:300px!important}
  .coast-mobile-labels{grid-template-columns:1fr!important;text-align:center!important;font-size:17px!important;left:-1vw!important;right:-1vw!important}
  .coast-mobile-labels span:last-child{grid-column:auto!important}
}
\n\n/* =========================================================
   LATIDOS · ajuste puntual solicitado 2026-09-21
   Espaciado, hover con videos únicos, carrusel limpio y CTA final clicable.
   ========================================================= */
/* Concept: reduce the empty gap between headline and body copy. */
@media(min-width:801px){
  .story-track>.concept>.copy{
    top:62.5%!important;
    left:39%!important;
    width:22%!important;
    line-height:1.42!important;
  }
  .story-track>.concept>.rosette{
    top:84%!important;
    left:48.5%!important;
    width:3%!important;
  }
}
@media(max-width:800px){
  .story-track>.concept>.copy{
    top:auto!important;
    bottom:19%!important;
    left:20%!important;
    width:60%!important;
    font-size:12px!important;
    line-height:1.5!important;
  }
  .story-track>.concept>.rosette{bottom:8%!important}
}

/* Give the three-day timeline a clean white breath before the immersive effect. */
.latidos-mid-effect{
  margin-top:clamp(88px,10vh,144px)!important;
}
@media(max-width:800px){
  .latidos-mid-effect{margin-top:72px!important}
}

/* Every hover destination is a real moving local video and each uses a unique file. */
.amenity-layer>.latidos-video-media,
.amenity-layer>.latidos-video-media>video{
  width:100%!important;
  height:100%!important;
}
.amenity-layer>.latidos-video-media>video{
  object-fit:cover!important;
  object-position:50% 50%!important;
}
.amenity-layer{will-change:opacity}

/* Gallery cards no longer show the source pill. */
.real-route-gallery .real-media-credit{display:none!important}

/* Final CTA layer must sit above the background media and receive pointer events. */
.finale-title{
  z-index:7!important;
  pointer-events:auto!important;
}
.finale-title .final-actions,
.finale-title .final-actions a{
  pointer-events:auto!important;
}
.finale-stage .round-cta{
  z-index:7!important;
  pointer-events:auto!important;
}
.finale-image{
  pointer-events:none!important;
}
.finale-image .latidos-video-media,
.finale-image .latidos-video-media *{
  pointer-events:none!important;
  cursor:default!important;
}

/* =========================================================
   LATIDOS · revisión final para demo/redes · 2026-09-21
   Mantiene Poppins real, integra video local HD y refuerza lectura móvil.
   ========================================================= */
.coast-place,.coast-time{font-family:'Poppins',Arial,Helvetica,sans-serif!important}
.coast-place{font-weight:700!important}
.coast-time{font-weight:500!important}

.real-video-frame>.media,
.real-video-frame>.latidos-video-media{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
}
.real-video-frame>.media>video,
.real-video-frame>.latidos-video-media>video{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center!important;
}
.real-video-frame .media-note{display:none!important}
.real-video-card{overflow:hidden}

/* Keep the main reservation action visually dominant everywhere. */
.booking-cta{position:relative;z-index:8!important}
.final-actions{position:relative;z-index:8!important}

@media(max-width:800px){
  .micro{font-size:12px!important;line-height:1.48!important}
  .tagline{font-size:12px!important;line-height:1.45!important}
  .nav-secondary>a{font-size:10px!important;line-height:1.2!important}
  #app .type-title .day-label{font-size:12px!important;line-height:1.3!important}
  #app .type-stats>div>span{font-size:12px!important;line-height:1.35!important}
  #app .timeline-highlight{font-size:13px!important;line-height:1.45!important}
  #app .type-description{font-size:15px!important;line-height:1.64!important}
  .coast-mobile-labels{font-size:clamp(17px,4.8vw,20px)!important;line-height:1.3!important}
  .footer-legal .text-link,.demo-provenance{font-size:10.5px!important;line-height:1.45!important}
  .real-video-grid{gap:30px!important}
  .real-video-card>p{font-size:13px!important}
  .real-video-card>p strong{font-size:15px!important}
}

/* Mobile contact remains visibly available as requested by the client. */
@media(max-width:800px){
  .header-phone{
    display:inline-flex!important;
    width:100%!important;
    justify-content:flex-end!important;
    font-size:10px!important;
    line-height:1.2!important;
    font-weight:700!important;
    letter-spacing:.01em!important;
  }
}

/* =========================================================
   LATIDOS · cierre de auditoría demo/redes · 2026-09-21
   CTA clicable, lectura móvil real y contacto visible.
   ========================================================= */
/* The hero copy itself is decorative, but its actions must always receive clicks. */
.hero-brief-actions,
.hero-brief-actions a,
.hero-brief .booking-cta{
  pointer-events:auto!important;
}

/* Keep contact readable without competing with the main CTA. */
.header-phone{font-size:10.5px!important;font-weight:700!important}

@media(max-width:800px){
  /* Client specifically requested larger general reading text on mobile. */
  .story-track>.concept>.copy{
    font-size:15px!important;
    line-height:1.58!important;
    left:15%!important;
    width:70%!important;
    bottom:15%!important;
  }
  .story-track>.concept>.rosette{
    bottom:4.5%!important;
    width:8%!important;
    left:46%!important;
  }
  .header-phone{font-size:11px!important}
}
@media(max-width:800px){
  .nav-secondary .header-phone{font-size:11px!important}
}

/* =========================================================
   LATIDOS · QA visual/funcional final · 2026-09-21
   Evita solapes en móvil y despeja controles redundantes.
   ========================================================= */
@media(max-width:800px){
  /* El contacto sigue visible en el WhatsApp flotante/footer; el mini-nav
     superior se simplifica para no invadir títulos en 320–390px. */
  .nav-secondary{display:none!important}
  .top-nav{right:14px!important;top:16px!important;width:118px!important;max-width:118px!important}
  .top-nav .apartment-link{font-size:18px!important;line-height:.95!important;letter-spacing:-.035em!important}
  .brand{left:14px!important;top:14px!important;width:92px!important;max-width:92px!important}
  .brand img{width:100%!important;height:auto!important}

  /* El selector Paisaje/Detalle generaba cruces con copy/CTA en móvil. */
  .day-toggle{display:none!important}

  /* Una vez que el usuario sale del hero, el header editorial se retira para
     no tapar los títulos superiores de las siguientes escenas. */
  body.mobile-header-condensed .brand,
  body.mobile-header-condensed .top-nav{opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(-12px)!important}
  .brand,.top-nav{transition:opacity .22s ease,transform .22s ease,visibility .22s ease!important}

  /* Experiencias/hover: la cabecera pasa a flujo y la lista queda separada. */
  .amenities{height:auto!important;min-height:0!important;overflow:visible!important;background:#07130e!important}
  .amenities-heading{
    position:relative!important;left:auto!important;right:auto!important;top:auto!important;
    width:auto!important;max-width:none!important;margin:0!important;padding:92px 22px 30px!important;
    z-index:8!important;background:#07130e!important;
  }
  .amenities-heading h2{font-size:clamp(34px,9vw,44px)!important;line-height:1.02!important;margin:8px 0 0!important;max-width:100%!important}
  .amenity-stage{position:relative!important;top:auto!important;height:920px!important;min-height:920px!important;overflow:hidden!important}
  .amenity-index{top:54px!important;left:22px!important;right:22px!important;width:auto!important;z-index:7!important}
  .amenity-index button{font-size:clamp(25px,7.1vw,31px)!important;line-height:1.12!important;min-height:1.42em!important;text-align:left!important}
  .amenity-caption{left:22px!important;right:22px!important;bottom:108px!important;width:auto!important;max-width:none!important;z-index:7!important}
  .amenity-caption .micro{font-size:11px!important;margin-bottom:10px!important}
  .amenity-caption h3{font-size:clamp(28px,8vw,36px)!important;line-height:1.02!important;max-width:92%!important}
  .amenity-book{left:22px!important;right:auto!important;bottom:58px!important;z-index:8!important;font-size:11px!important}

  /* En móvil ya existe WhatsApp flotante: no duplicar un círculo encima del CTA final. */
  .finale-stage>.round-cta,.finale-stage .round-cta{display:none!important}
  .final-actions{width:calc(100% - 44px)!important;max-width:420px!important;left:22px!important;right:auto!important}
  .final-actions .booking-cta{width:100%!important;max-width:100%!important}
  .final-actions .underlink{display:block!important;text-align:center!important;margin-top:16px!important}

  /* Aire superior para bloques que empiezan con titulares grandes. */
  .real-video-section{padding-top:96px!important}
  .real-video-heading{padding-top:0!important;margin-top:0!important}
  .real-video-heading h2{max-width:100%!important;overflow-wrap:break-word!important}
  .information-heading{padding-top:92px!important}
}

@media(max-width:350px){
  .brand{width:84px!important}
  .top-nav{width:108px!important;max-width:108px!important}
  .top-nav .apartment-link{font-size:16px!important}
  .amenities-heading{padding-left:18px!important;padding-right:18px!important}
  .amenity-index{left:18px!important;right:18px!important}
  .amenity-caption{left:18px!important;right:18px!important}
  .amenity-book{left:18px!important}
  .amenity-index button{font-size:24px!important}
}
@media(max-width:800px){
  /* El rótulo gigante es decorativo; en 320–390px invadía la información útil. */
  .practical-info .architecture-word{display:none!important}
  .practical-info .architecture-quote{left:22px!important;right:22px!important;top:96px!important;bottom:auto!important;width:auto!important;max-width:none!important}
}
@media(max-width:350px){
  .practical-info .architecture-quote{left:18px!important;right:18px!important;top:90px!important}
}
@media(min-width:801px){
  /* Aleja Paisaje/Detalle del titular del hero. */
  .day-toggle{left:58%!important;top:65vh!important}
}
/* Hero: el video/fondo nunca debe capturar el clic de los CTA. */
.hero-camera,.hero-image,.hero-image video,.hero-wordmark{pointer-events:none!important}
.hero-brief{position:absolute!important;z-index:18!important;pointer-events:auto!important}
.hero-brief-actions{position:relative!important;z-index:22!important;pointer-events:auto!important}
.hero-brief-actions a{position:relative!important;z-index:23!important;pointer-events:auto!important}
