/* Plantilla "Refugio" (sitio/app/Views/templates/refugio). Misma estructura que la
   Clásica; cambia el diseño. DECISIONS.md "Plantilla Refugio" [2026-10-26].
   --color-primario / --color-secundario / --color-estetico los define chrome-start.php
   con los colores que el hotel elige en el panel (Sitio Web → Diseño). */
:root{
  --ink:#26281F;
  --gris:#6A6B60;
  --paper:#F5F0E6;            /* crema */
  --paper-2:#EDE6D8;
  --line:rgba(38,40,31,.12);
  --font-display:'Cormorant Garamond', Georgia, serif;
  --font-body:'Mulish', system-ui, sans-serif;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:var(--font-body); color:var(--ink); background:var(--paper); font-size:1rem; line-height:1.7; -webkit-font-smoothing:antialiased;}
.page-wrap{overflow-x:hidden;}
h1,h2,h3,h4,.font-display{font-family:var(--font-display); font-weight:500; line-height:1.08; letter-spacing:-.01em;}
/* Cormorant trae números "antiguos" (el 11 parece II): en toda la página, números normales. */
body{font-variant-numeric:lining-nums;}
a{text-decoration:none; color:inherit;}
img{max-width:100%;}
em,.it{font-style:italic;}

/* Etiqueta chica con línea ("— Bienvenidos") */
.eyebrow{display:inline-flex; align-items:center; gap:.9rem; font-size:.7rem; font-weight:700; letter-spacing:.28em; text-transform:uppercase; color:var(--color-secundario); margin-bottom:1.1rem;}
.eyebrow::before{content:""; width:38px; height:1px; background:currentColor;}
.eyebrow.center::after{content:""; width:38px; height:1px; background:currentColor;}
.eyebrow.light{color:rgba(255,255,255,.85);}
.section-title{font-size:clamp(2.2rem,4.2vw,3.4rem); color:var(--ink); margin-bottom:1.2rem;}
.section-title em{color:var(--color-primario);}
.section-sub{color:var(--gris); font-size:1.02rem;}
.section-pad{padding:6.5rem 0;}
.bg-paper{background:var(--paper);}
.bg-paper-2{background:var(--paper-2);}
.bg-white{background:#FFFDF9;}

.btn-r{display:inline-flex; align-items:center; gap:.7rem; font-size:.72rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; padding:1rem 1.9rem; border-radius:0; transition:.3s; border:1px solid transparent; cursor:pointer;}
.btn-brand{background:var(--color-primario); border-color:var(--color-primario); color:#fff;}
.btn-brand:hover{background:var(--color-estetico); border-color:var(--color-estetico); color:#fff;}
.btn-ghost{background:transparent; border-color:rgba(255,255,255,.55); color:#fff;}
.btn-ghost:hover{background:#fff; color:var(--ink);}
.btn-line{background:transparent; border-color:var(--ink); color:var(--ink);}
.btn-line:hover{background:var(--ink); color:#fff;}
.link-arrow{display:inline-flex; align-items:center; gap:.6rem; font-size:.72rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--color-primario); border-bottom:1px solid var(--color-secundario); padding-bottom:.35rem; transition:.3s;}
.link-arrow:hover{gap:1rem; color:var(--color-estetico);}

/* Topbar */
.topbar{background:var(--color-estetico); color:rgba(255,255,255,.75); font-size:.74rem; letter-spacing:.04em; position:relative; z-index:1031;}
.topbar a:hover{color:#fff;}
.topbar .social a{display:inline-flex; width:26px; height:26px; align-items:center; justify-content:center; margin-left:.25rem;}
.lang-switch a{font-weight:700; padding:0 .3rem; color:rgba(255,255,255,.5);}
.lang-switch a.active{color:#fff;}

/* Navbar */
.navbar-site{position:fixed; top:36px; left:0; right:0; z-index:1030; padding:1.2rem 0; transition:.35s; background:transparent;}
.navbar-site.is-scrolled,.navbar-site.solid{top:0; background:rgba(245,240,230,.96); backdrop-filter:blur(10px); box-shadow:0 1px 0 var(--line); padding:.55rem 0;}
.brand-text{font-family:var(--font-display); font-size:1.75rem; font-weight:600; color:#fff; line-height:1; letter-spacing:.01em;}
.brand-text small{display:block; font-family:var(--font-body); font-size:.56rem; letter-spacing:.42em; text-transform:uppercase; font-weight:700; opacity:.75; margin-top:.35rem;}
.navbar-site.is-scrolled .brand-text,.navbar-site.solid .brand-text{color:var(--ink);}
.navbar-site.no-topbar{top:0;}
.navbar-site .navbar-brand img{height:54px; width:auto; transition:.35s;}
.navbar-site.is-scrolled .navbar-brand img,.navbar-site.solid .navbar-brand img{height:42px;}
.navbar-brand .logo-scrolled{display:none;}
.navbar-site.is-scrolled .navbar-brand .logo-scrolled{display:block;}
.navbar-site.is-scrolled .navbar-brand .logo-default{display:none;}
/* Páginas sin foto de encabezado: banda oscura con el color estético. */
.page-hero.sin-foto{height:auto; min-height:0; padding-top:11rem; background:var(--color-estetico);}
.page-hero.sin-foto::after{display:none;}
.page-content{color:var(--gris); font-size:1.05rem; max-width:820px;}
.navbar-site .nav-link{color:#fff; font-size:.72rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; margin:0 .55rem; position:relative;}
.navbar-site .nav-link::after{content:""; position:absolute; left:.5rem; right:.5rem; bottom:.2rem; height:1px; background:currentColor; transform:scaleX(0); transition:.3s;}
.navbar-site .nav-link:hover::after{transform:scaleX(1);}
.navbar-site.is-scrolled .nav-link,.navbar-site.solid .nav-link{color:var(--ink);}
.navbar-site .btn-nav{border:1px solid rgba(255,255,255,.6); color:#fff; padding:.7rem 1.3rem; font-size:.68rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; transition:.3s;}
.navbar-site .btn-nav:hover{background:#fff; color:var(--ink);}
.navbar-site.is-scrolled .btn-nav,.navbar-site.solid .btn-nav{background:var(--color-primario); border-color:var(--color-primario); color:#fff;}
.navbar-site .navbar-toggler{border:1px solid rgba(255,255,255,.6); border-radius:0; padding:.45rem .6rem;}
.navbar-site .navbar-toggler-icon{filter:invert(1);}
.navbar-site.is-scrolled .navbar-toggler,.navbar-site.solid .navbar-toggler{border-color:var(--line);}
.navbar-site.is-scrolled .navbar-toggler-icon,.navbar-site.solid .navbar-toggler-icon{filter:none;}
@media (max-width:991.98px){
  .navbar-site .navbar-collapse{background:var(--color-estetico); margin-top:.8rem; padding:1.2rem 1.4rem;}
  .navbar-site .nav-link,.navbar-site.is-scrolled .nav-link,.navbar-site.solid .nav-link{color:#fff; padding:.6rem 0;}
}

/* Hero con fotos que se acercan despacio */
.hero{position:relative; height:100vh; min-height:640px; overflow:hidden; display:flex; align-items:center; justify-content:center; text-align:center; color:#fff;}
.hero .slide{position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity 1.6s ease; transform:scale(1.02);}
.hero .slide.active{opacity:1;}
.hero .slide.active, .hero .slide.saliendo{animation:kenburns 9s ease-out both;} /* misma animación: al pasar de una clase a otra sigue, no se reinicia */
@keyframes kenburns{from{transform:scale(1.02);} to{transform:scale(1.12);}}
.hero::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,24,16,.55) 0%, rgba(20,24,16,.25) 38%, rgba(20,24,16,.7) 100%);}
.hero-content{position:relative; z-index:2; max-width:900px; padding:0 1.25rem;}
.hero-title{font-size:clamp(2.8rem,7vw,6rem); font-weight:500; margin-bottom:1.4rem; text-shadow:0 2px 30px rgba(0,0,0,.25);}
.hero-title em{font-weight:500;}
.hero-lead{font-size:1.08rem; max-width:560px; margin:0 auto 2.2rem; color:rgba(255,255,255,.88); font-weight:300;}
.hero .eyebrow{color:rgba(255,255,255,.9);}
.hero-count{position:absolute; z-index:3; right:3rem; bottom:9rem; display:flex; align-items:center; gap:.9rem; font-family:var(--font-display); font-size:1.15rem;}
.hero-count .bar{width:70px; height:1px; background:rgba(255,255,255,.35); position:relative; overflow:hidden;}
.hero-count .bar i{position:absolute; inset:0; background:#fff; transform-origin:left; animation:barra 6s linear infinite;}
@keyframes barra{from{transform:scaleX(0);} to{transform:scaleX(1);}}
.scroll-cue{position:absolute; z-index:3; left:50%; bottom:8.5rem; transform:translateX(-50%); width:1px; height:56px; background:rgba(255,255,255,.3); overflow:hidden;}
.scroll-cue::after{content:""; position:absolute; left:0; top:-56px; width:1px; height:56px; background:#fff; animation:cue 2.2s ease-in-out infinite;}
@keyframes cue{to{top:56px;}}
@keyframes heroIn{from{opacity:0; transform:translateY(26px);} to{opacity:1; transform:none;}}
.hero-anim{animation:heroIn .9s cubic-bezier(.215,.61,.355,1) both;}
.hero-anim-d1{animation-delay:.15s;} .hero-anim-d2{animation-delay:.3s;} .hero-anim-d3{animation-delay:.45s;}
@media (prefers-reduced-motion:reduce){.hero-anim,.hero .slide.active,.hero .slide.saliendo{animation:none;}}

/* Buscador / consulta: pegado al borde inferior del hero */
.consult-wrap{position:relative; z-index:4; margin-top:-92px;}
.consult-card{background:#FFFDF9; padding:1.8rem 2rem; box-shadow:0 30px 60px rgba(20,24,16,.18); border-top:3px solid var(--color-secundario);}
.consult-card label{display:block; font-size:.62rem; font-weight:800; letter-spacing:.22em; text-transform:uppercase; color:var(--gris); margin-bottom:.15rem;}
.consult-card .form-control,.consult-card .form-select{border:0; border-bottom:1px solid var(--line); border-radius:0; padding:.45rem 0; background-color:transparent; font-size:.95rem; color:var(--ink); box-shadow:none;}
.consult-card .form-control:focus,.consult-card .form-select:focus{border-color:var(--color-secundario);}
.consult-card .btn-r{width:100%; justify-content:center; padding:1.05rem 1rem;}

/* Destacados */
.highlights{padding:4.5rem 0 1rem;}
.highlight-item{text-align:center; padding:1rem .8rem;}
.highlight-item .h-ico{width:64px; height:64px; border-radius:50%; border:1px solid var(--color-secundario); color:var(--color-primario); display:inline-flex; align-items:center; justify-content:center; font-size:1.25rem; margin-bottom:1rem; transition:.35s;}
.highlight-item:hover .h-ico{background:var(--color-primario); border-color:var(--color-primario); color:#fff;}
.highlight-item .h-text{font-family:var(--font-display); font-size:1.3rem; line-height:1.2;}
@media (min-width:768px){.highlight-item + .highlight-item{border-left:1px solid var(--line);}}

/* Texto 1: collage de dos fotos + texto */
.collage{position:relative; padding:0 12% 18% 0;}
.collage .c-main{width:100%; aspect-ratio:4/5; object-fit:cover; display:block;}
.collage .c-small{position:absolute; right:0; bottom:0; width:52%; aspect-ratio:1/1; object-fit:cover; border:10px solid var(--paper); box-shadow:0 20px 40px rgba(20,24,16,.18);}
.collage .c-badge{position:absolute; left:-1.2rem; top:2.5rem; background:var(--color-primario); color:#fff; padding:1.2rem 1.4rem; font-family:var(--font-display); font-size:1.15rem; line-height:1.15; max-width:180px;}
.collage .c-badge strong{display:block; font-size:2.6rem; font-weight:500;}
.text-cols p{color:var(--gris); margin-bottom:1rem;}
.signature{font-family:var(--font-display); font-style:italic; font-size:1.6rem; color:var(--color-primario); margin-top:1.4rem;}

/* Unidades: fotos altas con el texto encima */
.section-head{display:flex; justify-content:space-between; align-items:flex-end; gap:2rem; flex-wrap:wrap; margin-bottom:3rem;}
.section-head .section-title{margin-bottom:0;}
.unit-card{position:relative; display:block; aspect-ratio:3/4; overflow:hidden; color:#fff; background:var(--ink);}
.unit-card img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1.1s cubic-bezier(.2,.7,.2,1);}
.unit-card::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,24,16,0) 35%, rgba(20,24,16,.85) 100%); transition:.4s;}
.unit-card:hover img{transform:scale(1.07);}
.unit-card:hover::after{background:linear-gradient(180deg, rgba(20,24,16,.1) 15%, rgba(20,24,16,.9) 100%);}
.unit-card .u-body{position:absolute; z-index:2; left:0; right:0; bottom:0; padding:1.8rem 1.6rem;}
.unit-card .u-kicker{font-size:.62rem; font-weight:800; letter-spacing:.24em; text-transform:uppercase; color:rgba(255,255,255,.7);}
.unit-card h3{font-size:2rem; margin:.3rem 0 .7rem; color:#fff;}
.unit-card .u-desc{font-size:.88rem; color:rgba(255,255,255,.82); max-height:0; opacity:0; overflow:hidden; transition:.5s; margin:0;}
.unit-card:hover .u-desc{max-height:120px; opacity:1; margin-bottom:.9rem;}
.unit-card .u-meta{display:flex; gap:1.1rem; font-size:.78rem; border-top:1px solid rgba(255,255,255,.25); padding-top:.8rem;}
.unit-card .u-meta i{color:var(--color-secundario); margin-right:.35rem;}
.unit-card .u-go{position:absolute; z-index:2; top:1.3rem; right:1.3rem; width:46px; height:46px; border-radius:50%; border:1px solid rgba(255,255,255,.5); display:flex; align-items:center; justify-content:center; transition:.35s;}
.unit-card:hover .u-go{background:#fff; color:var(--ink); transform:rotate(-45deg);}
.unit-card .u-price{position:absolute; z-index:2; top:1.3rem; left:1.3rem; background:rgba(255,253,249,.92); color:var(--ink); font-size:.72rem; font-weight:700; padding:.4rem .75rem; letter-spacing:.04em;}
@media (hover:none){.unit-card .u-desc{max-height:120px; opacity:1; margin-bottom:.9rem;}}

/* Servicios: banda oscura sobre foto */
.services-band{position:relative; color:#fff; background-size:cover; background-position:center; background-attachment:fixed;}
.services-band::before{content:""; position:absolute; inset:0; background:color-mix(in srgb, var(--color-estetico) 88%, transparent);}
.services-band .container{position:relative; z-index:2;}
.services-band .section-title{color:#fff;}
.services-band .section-title em{color:var(--color-secundario);}
.service-grid{display:grid; grid-template-columns:repeat(5,1fr); border-top:1px solid rgba(255,255,255,.14); border-left:1px solid rgba(255,255,255,.14);}
.service-grid .s-item{padding:2rem 1rem; text-align:center; border-right:1px solid rgba(255,255,255,.14); border-bottom:1px solid rgba(255,255,255,.14); transition:.35s;}
.service-grid .s-item:hover{background:rgba(255,255,255,.06);}
.service-grid i{font-size:1.5rem; color:var(--color-secundario); margin-bottom:.9rem; display:inline-block;}
.service-grid span{display:block;}
@media (max-width:991px){.service-grid{grid-template-columns:repeat(3,1fr);}}
@media (max-width:575px){.service-grid{grid-template-columns:repeat(2,1fr);} .service-grid .s-item{padding:1.5rem .6rem;}}
.service-grid span{font-size:.86rem; letter-spacing:.03em; color:rgba(255,255,255,.88);}
@media (max-width:991px){.services-band{background-attachment:scroll;}}

/* Texto 2: frase grande */
.statement{text-align:center; max-width:920px; margin:0 auto;}
.statement .ornament{color:var(--color-secundario); font-size:1.4rem; margin-bottom:1.4rem; display:block;}
.statement p{font-family:var(--font-display); font-size:clamp(1.7rem,3.4vw,2.7rem); line-height:1.3; color:var(--ink); font-style:italic; margin:0;}
.statement h2{font-size:1rem; font-family:var(--font-body); font-weight:800; letter-spacing:.26em; text-transform:uppercase; color:var(--color-secundario); margin-top:1.8rem;}

/* Galería en mosaico */
.mosaic{display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:220px; gap:10px;}
.mosaic .g-item{position:relative; overflow:hidden; cursor:pointer; background:var(--paper-2);}
/* Grupos de 5 (una grande + cuatro chicas) llenan 2 filas justas; las que sobran
   completan la última fila con estas clases (las pone la vista según la cantidad). */
.mosaic .g-big{grid-column:span 2; grid-row:span 2;}
.mosaic .g-w2{grid-column:span 2;}
.mosaic .g-w4{grid-column:span 4;}
.mosaic img{width:100%; height:100%; object-fit:cover; transition:transform 1s cubic-bezier(.2,.7,.2,1); display:block;}
.mosaic .g-item::after{content:"\f065"; font-family:"Font Awesome 7 Free"; font-weight:900; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.2rem; background:rgba(20,24,16,.35); opacity:0; transition:.35s;}
.mosaic .g-item:hover img{transform:scale(1.06);}
.mosaic .g-item:hover::after{opacity:1;}
@media (max-width:767px){.mosaic{grid-template-columns:repeat(2,1fr); grid-auto-rows:150px; grid-auto-flow:dense;} .mosaic .g-w2{grid-column:span 1;} .mosaic .g-w4{grid-column:span 2;}}

/* Texto 3: tarjeta con marco */
.framed{border:1px solid var(--color-secundario); outline:1px solid var(--color-secundario); outline-offset:-12px; padding:4rem 3rem; text-align:center; max-width:880px; margin:0 auto; background:#FFFDF9;}
@media (max-width:575px){.framed{padding:3rem 1.6rem;}}

/* Lugar para widgets pegados por el hotel (reseñas, Instagram) */
.embed-slot{border:1px dashed rgba(38,40,31,.3); padding:2.6rem 1.5rem; text-align:center; color:var(--gris); font-size:.9rem; background:rgba(255,255,255,.4);}
.embed-slot i{font-size:1.6rem; color:var(--color-secundario); display:block; margin-bottom:.7rem;}
.review-demo{background:#FFFDF9; padding:2rem; height:100%; border-bottom:2px solid var(--color-secundario);}
.review-demo .stars{color:var(--color-secundario); font-size:.8rem; letter-spacing:.2em;}
.review-demo p{font-family:var(--font-display); font-size:1.25rem; font-style:italic; line-height:1.4; margin:.9rem 0 1.2rem;}
.review-demo .who{font-size:.72rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--gris);}

/* Preguntas frecuentes: solo líneas */
.faq .item{border-bottom:1px solid var(--line);}
.faq .item:first-child{border-top:1px solid var(--line);}
.faq button{all:unset; box-sizing:border-box; width:100%; display:flex; justify-content:space-between; align-items:center; gap:1.5rem; padding:1.45rem 0; cursor:pointer; font-family:var(--font-display); font-size:1.45rem; line-height:1.2; color:var(--ink);}
.faq button:focus-visible{outline:2px solid var(--color-secundario); outline-offset:4px;}
.faq button .pm{flex:0 0 34px; height:34px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-size:.75rem; transition:.3s;}
.faq button[aria-expanded="true"] .pm{background:var(--color-primario); border-color:var(--color-primario); color:#fff; transform:rotate(45deg);}
.faq .answer{color:var(--gris); padding:0 3.5rem 1.6rem 0;}

/* Ubicación: mapa ancho con la ficha encima */
/* El mapa ocupa toda la sección y la ficha va encima, centrada en el alto. */
.location{position:relative; min-height:640px; display:flex; align-items:center; padding:4rem 0;}
.location .map{position:absolute; inset:0; height:100%; width:100%; border:0; display:block; filter:grayscale(.35) sepia(.12);}
.location .container{position:relative; z-index:2; pointer-events:none;}
.location .loc-card{pointer-events:auto; width:410px; max-width:100%; background:#FFFDF9; padding:2.4rem 2.4rem 1.6rem; box-shadow:0 30px 60px rgba(20,24,16,.2);}
.loc-item{display:flex; gap:1rem; padding:.85rem 0; border-bottom:1px solid var(--line); font-size:.92rem;}
.loc-item:last-child{border-bottom:0;}
.loc-item i{color:var(--color-secundario); margin-top:.3rem; width:18px; text-align:center;}
.loc-item strong{display:block; font-size:.62rem; font-weight:800; letter-spacing:.22em; text-transform:uppercase; color:var(--gris);}
@media (max-width:767px){.location{display:block; min-height:0; padding:0 0 3rem;} .location .map{position:relative; height:360px;} .location .loc-card{width:auto; margin-top:-70px; padding:2rem 1.5rem 1rem;}}

/* Contacto */
.contact-section{background:var(--color-estetico); color:#fff; position:relative; overflow:hidden;}
.contact-photo{background-size:cover; background-position:center; min-height:100%; position:relative;}
.contact-photo::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,24,16,.25), rgba(20,24,16,.75));}
.contact-photo .inner{position:relative; z-index:2; padding:4rem 3rem; height:100%; display:flex; flex-direction:column; justify-content:flex-end;}
.contact-section h2{color:#fff; font-size:clamp(2.2rem,4vw,3.2rem);}
.contact-pill{display:flex; align-items:center; gap:.8rem; color:#fff; font-size:.92rem; padding:.55rem 0;}
.contact-pill i{width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,.35); display:inline-flex; align-items:center; justify-content:center; color:var(--color-secundario);}
.contact-pill:hover{color:var(--color-secundario);}
.contact-form{padding:4.5rem 3.5rem;}
.contact-form label{font-size:.62rem; font-weight:800; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.6); margin-bottom:.1rem;}
.contact-form .form-control{background:transparent; border:0; border-bottom:1px solid rgba(255,255,255,.25); border-radius:0; color:#fff; padding:.55rem 0; box-shadow:none;}
.contact-form .form-control:focus{border-color:var(--color-secundario); background:transparent; color:#fff;}
.contact-form .btn-brand{background:var(--color-secundario); border-color:var(--color-secundario);}
.contact-form .btn-brand:hover{background:#fff; color:var(--ink); border-color:#fff;}
@media (max-width:991px){.contact-photo .inner{padding:3.5rem 1.5rem 2.5rem;} .contact-form{padding:3rem 1.5rem 4rem;}}

/* Footer */
footer{background:#1D2118; color:rgba(255,255,255,.62); padding:5rem 0 1.6rem; font-size:.9rem;}
footer .f-name{font-family:var(--font-display); font-size:2.4rem; color:#fff; line-height:1;}
footer h6{font-size:.64rem; font-weight:800; letter-spacing:.24em; text-transform:uppercase; color:var(--color-secundario); margin-bottom:1.1rem;}
footer a:hover{color:#fff;}
footer .fline{height:1px; background:rgba(255,255,255,.1); margin:3rem 0 1.4rem;}
footer .bottom-note{font-size:.74rem; color:rgba(255,255,255,.4);}

.wa-float{position:fixed; right:22px; bottom:22px; z-index:1040; width:56px; height:56px; border-radius:50%; background:#25D366; color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.5rem; box-shadow:0 10px 24px rgba(0,0,0,.25);}
.scroll-top-float{position:fixed; right:28px; bottom:92px; z-index:1040; width:44px; height:44px; border-radius:50%; background:var(--color-estetico); color:#fff; display:flex; align-items:center; justify-content:center; border:0; opacity:0; visibility:hidden; transform:translateY(8px); transition:.3s;}
.scroll-top-float.show{opacity:1; visibility:visible; transform:none;}

/* Páginas interiores: banda con foto */
.page-hero{position:relative; height:62vh; min-height:440px; display:flex; align-items:flex-end; color:#fff; overflow:hidden;}
.page-hero .bg{position:absolute; inset:0; background-size:cover; background-position:center; animation:kenburns 12s ease-out both;}
.page-hero::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,24,16,.45) 0%, rgba(20,24,16,.2) 40%, rgba(20,24,16,.8) 100%);}
.page-hero .container{position:relative; z-index:2; padding-bottom:4.5rem;}
.page-hero.with-bar .container{padding-bottom:7.5rem;}
.page-hero h1{font-size:clamp(2.8rem,6vw,5rem); color:#fff; margin:0;}
.crumbs{font-size:.7rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.75); margin-bottom:1rem;}
.crumbs a:hover{color:#fff;}
.crumbs span{margin:0 .6rem; opacity:.5;}

/* Listado de unidades: filas alternadas */
.unit-row{display:grid; grid-template-columns:1.25fr 1fr; gap:0; align-items:center; margin-bottom:6rem;}
.unit-row:nth-child(even){grid-template-columns:1fr 1.25fr;}
.unit-row:nth-child(even) .ur-img{order:2;}
.unit-row .ur-img{position:relative; aspect-ratio:4/3; overflow:hidden;}
.unit-row .ur-img img{width:100%; height:100%; object-fit:cover; transition:transform 1.1s cubic-bezier(.2,.7,.2,1);}
.unit-row:hover .ur-img img{transform:scale(1.04);}
.unit-row .ur-body{background:#FFFDF9; padding:3.4rem 3rem; margin-left:-4rem; position:relative; z-index:2; box-shadow:0 24px 50px rgba(20,24,16,.1);}
.unit-row:nth-child(even) .ur-body{margin-left:0; margin-right:-4rem;}
.unit-row .ur-num{font-family:var(--font-display); font-size:1rem; color:var(--color-secundario); font-style:italic;}
.unit-row h2{font-size:clamp(2.2rem,3.5vw,3rem); margin:.3rem 0 1rem;}
.unit-row p{color:var(--gris);}
.spec-row{display:flex; flex-wrap:wrap; gap:.6rem 1.6rem; margin:1.4rem 0 2rem; padding:1rem 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); font-size:.85rem;}
.spec-row i{color:var(--color-secundario); margin-right:.4rem;}
@media (max-width:991px){
  .unit-row,.unit-row:nth-child(even){grid-template-columns:1fr; margin-bottom:4rem;}
  .unit-row:nth-child(even) .ur-img{order:0;}
  .unit-row .ur-body,.unit-row:nth-child(even) .ur-body{margin:-3rem 1rem 0; padding:2.4rem 1.6rem;}
}

/* Detalle de unidad */
.info-bar{position:relative; z-index:3; margin-top:-62px; background:#FFFDF9; box-shadow:0 30px 60px rgba(20,24,16,.15); display:flex; flex-wrap:wrap;}
.info-bar .ib{flex:1 1 150px; padding:1.6rem 1rem; text-align:center; border-right:1px solid var(--line);}
.info-bar .ib:last-child{border-right:0;}
.info-bar .ib i{color:var(--color-secundario); font-size:1.15rem;}
.info-bar .ib-value{font-family:var(--font-display); font-size:1.7rem; line-height:1.1; margin-top:.4rem;}
.info-bar .ib-label{font-size:.6rem; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--gris);}
.info-bar .ib-text{font-family:var(--font-display); font-size:1.15rem; line-height:1.2; margin-top:.5rem;}
.desc-photo{position:relative;}
.desc-photo img{width:100%; aspect-ratio:4/5; object-fit:cover;}
.desc-photo::before{content:""; position:absolute; inset:1.4rem -1.4rem -1.4rem 1.4rem; border:1px solid var(--color-secundario); z-index:-1;}
.reserve-band{position:relative; background-size:cover; background-position:center; color:#fff;}
.reserve-band::before{content:""; position:absolute; inset:0; background:color-mix(in srgb, var(--color-estetico) 86%, transparent);}
.reserve-band .container{position:relative; z-index:2;}
.reserve-band .section-title{color:#fff;}
.reserve-band .section-title em,.contact-section h2 em{color:var(--color-secundario);}
.reserve-band .consult-card{border-top-color:var(--color-secundario);}

/* Lightbox propio (sin modal de Bootstrap) */
.lb{position:fixed; inset:0; z-index:2000; background:rgba(14,16,11,.94); display:none; align-items:center; justify-content:center; padding:4rem 1rem;}
.lb.open{display:flex;}
.lb img{max-width:100%; max-height:84vh; box-shadow:0 20px 60px rgba(0,0,0,.5);}
.lb button{position:absolute; background:none; border:1px solid rgba(255,255,255,.35); color:#fff; width:50px; height:50px; border-radius:50%; font-size:1rem; transition:.3s;}
.lb button:hover{background:#fff; color:var(--ink);}
.lb .lb-close{top:1.2rem; right:1.2rem;}
.lb .lb-prev{left:1.2rem; top:50%; transform:translateY(-50%);}
.lb .lb-next{right:1.2rem; top:50%; transform:translateY(-50%);}
.lb .lb-count{position:absolute; bottom:1.4rem; left:50%; transform:translateX(-50%); color:rgba(255,255,255,.7); font-family:var(--font-display); font-size:1.1rem;}

/* Página de galería completa: columnas tipo revista */
.masonry{columns:3 300px; column-gap:12px;}
.masonry .g-item{break-inside:avoid; margin-bottom:12px; overflow:hidden; cursor:pointer; position:relative;}
.masonry img{width:100%; display:block; transition:transform 1s cubic-bezier(.2,.7,.2,1);}
.masonry .g-item:hover img{transform:scale(1.05);}


/* Videos del detalle de unidad (mismo bloque que la Clásica) */
.video-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:18px;}
@media (max-width:767px){.video-grid{grid-template-columns:1fr;}}
.video-card{position:relative; overflow:hidden; aspect-ratio:16/9; background:var(--ink); box-shadow:0 20px 40px rgba(20,24,16,.15);}
.video-card iframe,.video-card embed,.video-card video{width:100%; height:100%; border:0; display:block;}

/* Portada sin fotos en el slider: fondo con el color estético */
.hero.sin-foto{background:var(--color-estetico); height:auto; min-height:0; padding:13rem 0 11rem;}
.hero.sin-foto::after{display:none;}
.services-band.sin-foto{background:var(--color-estetico);}
.contact-photo:not([style]){background:color-mix(in srgb, var(--color-estetico) 80%, #000);}