/* Departamento Bella — Resort Premium v1 (2026-08-19)
   Capa visual no destructiva: conserva portada, video, logo, SEO y funciones existentes. */
:root{
  --bella-ink:#12383d;
  --bella-deep:#0b292d;
  --bella-sand:#d9aa68;
  --bella-cream:#fbf7f0;
  --bella-white:#fff;
  --bella-muted:#657477;
  --bella-line:rgba(18,56,61,.12);
  --bella-shadow:0 22px 70px rgba(9,39,43,.12);
}
body{background:var(--bella-cream);}

/* Cabecera tipo hotel boutique */
.header{padding-inline:max(4.5vw,22px);border-bottom:1px solid transparent;}
.header.scrolled{background:rgba(11,41,45,.92)!important;border-bottom-color:rgba(255,255,255,.12);box-shadow:0 12px 42px rgba(0,0,0,.14);}
.header.scrolled .nav a:not(.nav-cta),.header.scrolled .lang-link{color:#fff!important;text-shadow:none!important;}
.nav{gap:clamp(15px,1.6vw,27px)}
.nav a{letter-spacing:.01em}
.nav-cta{box-shadow:0 8px 25px rgba(0,0,0,.14);padding:12px 21px!important;}

/* Portada: se conserva video + logo; solo pulido visual */
.hero{min-height:min(860px,100svh);isolation:isolate;background:#0b292d;}
.hero-bg-video{filter:saturate(.91) contrast(1.03);}
.hero-shade{background:linear-gradient(90deg,rgba(5,25,29,.88) 0%,rgba(5,25,29,.58) 44%,rgba(5,25,29,.12) 78%),linear-gradient(0deg,rgba(5,25,29,.72),transparent 48%)!important;}
.hero-content{max-width:900px!important;padding-bottom:clamp(112px,13vh,145px)!important;}
.hero h1{max-width:860px;text-wrap:balance;text-shadow:0 4px 24px rgba(0,0,0,.22);}
.hero-text{max-width:650px;color:rgba(255,255,255,.9);font-size:clamp(1.06rem,1.5vw,1.2rem);}
.hero .btn{min-height:54px;padding-inline:27px;}
.hero .btn.primary{background:linear-gradient(135deg,#e4bb81,#cf8f3b);box-shadow:0 14px 35px rgba(0,0,0,.2);}
.hero .btn.glass{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.58);}
.bella-logo-portada img{filter:drop-shadow(0 12px 30px rgba(0,0,0,.22));}
.scroll{letter-spacing:.08em;text-transform:uppercase;font-size:.72rem;opacity:.9;}

/* Sello de confianza, más compacto y refinado */
.trust-strip{box-shadow:0 12px 42px rgba(9,39,43,.08);position:relative;z-index:3;}
.trust-item{position:relative;}
.trust-item strong{letter-spacing:.01em;}

/* Ritmo editorial de resort */
.section{padding-block:clamp(78px,9vw,122px);}
.section-head{margin-bottom:clamp(34px,4.5vw,58px);}
.section-head h2,.intro h2,.location h2{letter-spacing:-.025em;text-wrap:balance;}
.section-head>p{font-size:1.01rem;}

/* Presentación principal */
.intro{max-width:1440px;margin:auto;}
.intro-img img{border-radius:8px 92px 8px 8px;box-shadow:var(--bella-shadow);}
.intro-img figcaption{border-radius:999px;padding:10px 15px;box-shadow:0 10px 30px rgba(0,0,0,.12);}
.facts span{background:rgba(255,255,255,.72);border:1px solid var(--bella-line);padding:13px 15px;border-radius:14px;}

/* Galería editorial compacta tipo resort: 5 imágenes visibles; el lightbox conserva TODAS. */
#galeria{background:#eef1ec!important;}
#galeria .gallery{display:grid!important;grid-template-columns:1.55fr .75fr .75fr!important;grid-template-rows:235px 235px!important;gap:12px!important;max-width:1440px;margin-inline:auto;}
#galeria .gallery>.photo{display:block!important;min-height:0!important;border-radius:18px!important;box-shadow:none!important;}
#galeria .gallery>.photo:nth-child(1){grid-column:1;grid-row:1 / span 2;}
#galeria .gallery>.photo:nth-child(2){grid-column:2;grid-row:1;}
#galeria .gallery>.photo:nth-child(3){grid-column:3;grid-row:1;}
#galeria .gallery>.photo:nth-child(4){grid-column:2;grid-row:2;}
#galeria .gallery>.photo:nth-child(5){grid-column:3;grid-row:2;}
#galeria .gallery>.photo:nth-child(n+6){display:none!important;}
#galeria .photo img{transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .35s ease!important;}
#galeria .photo:hover img{transform:scale(1.035)!important;filter:saturate(1.04);}
#galeria .photo span{background:rgba(8,35,39,.72)!important;color:#fff!important;backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.15);}
.bella-gallery-actions{display:flex;justify-content:flex-end;max-width:1440px;margin:18px auto 0;}
.bella-gallery-open{appearance:none;border:1px solid rgba(18,56,61,.22);background:#fff;color:var(--bella-ink);font:700 .9rem "DM Sans",sans-serif;border-radius:999px;padding:13px 19px;cursor:pointer;box-shadow:0 10px 30px rgba(9,39,43,.08);transition:.22s ease;}
.bella-gallery-open:hover{transform:translateY(-2px);box-shadow:0 15px 36px rgba(9,39,43,.13);}
.bella-gallery-open:focus-visible{outline:3px solid #d9aa68;outline-offset:3px;}

/* Experiencia Bella: eleva las tarjetas existentes sin tocar su contenido */
.bella-experience{background:linear-gradient(180deg,#fffaf3 0%,#f7efe3 100%)!important;}
.bella-experience>div>div[style*="display:grid"]>div{border:1px solid rgba(18,56,61,.1)!important;border-radius:24px!important;padding:30px!important;box-shadow:0 18px 50px rgba(18,56,61,.07);transition:transform .25s ease,box-shadow .25s ease;}
.bella-experience>div>div[style*="display:grid"]>div:hover{transform:translateY(-5px);box-shadow:0 25px 58px rgba(18,56,61,.11);}

/* Amenidades con apariencia de hotel */
.amenity-grid{gap:18px;}
.amenity-grid article{border-radius:22px!important;border:1px solid var(--bella-line)!important;min-height:220px;background:rgba(255,255,255,.8)!important;box-shadow:0 12px 38px rgba(18,56,61,.045);}
.amenity-grid article b{display:grid;width:52px;height:52px;place-items:center;border-radius:16px;background:#f3e7d4;font-size:1.7rem;}

/* Reservas / disponibilidad como módulo premium */
.booking{background:#f7f2ea!important;}
.booking-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;max-width:1050px;margin-inline:auto;}
.booking-card{border-radius:24px!important;padding:30px!important;min-height:230px!important;box-shadow:0 18px 52px rgba(18,56,61,.07);}
.booking-card.direct{background:linear-gradient(145deg,#0f383d,#0a292d)!important;}
.availability-panel{border-radius:28px!important;box-shadow:var(--bella-shadow);overflow:hidden;}

/* Destino, mapa y opiniones */
.destination-card{transition:transform .25s ease,box-shadow .25s ease;}
.destination-card:hover{transform:translateY(-5px);box-shadow:0 22px 50px rgba(14,48,53,.12);}
.map-wrap,.map-wrap iframe{border-radius:24px;overflow:hidden;}
.airbnb-reviews-wrap{border-radius:30px;overflow:hidden;}
.airbnb-reviews-card{box-shadow:0 22px 65px rgba(11,41,45,.12);}

/* Momentos reales: integración visual con el resto */
.guest-moments{background:#f1eee7!important;}
.guest-upload-card{border-radius:24px!important;box-shadow:0 18px 50px rgba(18,56,61,.07);}
.guest-approved-card{border-radius:20px!important;overflow:hidden;}

/* FAQ + contacto */
.faq{background:#eef1ec!important;}
.faq details{border-radius:16px!important;box-shadow:0 8px 24px rgba(18,56,61,.035);}
.contact-panel{border-radius:30px!important;box-shadow:var(--bella-shadow);overflow:hidden;}

/* Barra de reserva discreta: aparece después de salir de la portada */
.bella-resort-rail{position:fixed;left:50%;bottom:18px;z-index:48;transform:translate(-50%,20px);display:flex;align-items:center;gap:10px;background:rgba(10,41,45,.94);color:#fff;border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:8px 9px 8px 17px;box-shadow:0 18px 48px rgba(0,0,0,.24);backdrop-filter:blur(14px);opacity:0;pointer-events:none;transition:.28s ease;}
.bella-resort-rail.is-visible{opacity:1;pointer-events:auto;transform:translate(-50%,0);}
.bella-resort-rail__copy{display:flex;flex-direction:column;line-height:1.15;white-space:nowrap;margin-right:4px;}
.bella-resort-rail__copy strong{font:700 .9rem "Playfair Display",serif;}
.bella-resort-rail__copy span{font-size:.68rem;color:rgba(255,255,255,.72);margin-top:3px;}
.bella-resort-rail a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 15px;border-radius:999px;font-size:.78rem;font-weight:800;}
.bella-resort-rail .rail-airbnb{background:#fff;color:#17383d;}
.bella-resort-rail .rail-whatsapp{background:#d9aa68;color:#0c3034;}
.whatsapp{bottom:86px!important;}

/* Texturas y animaciones sutiles */
.reveal{transform:translateY(18px)!important;transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.2,1)!important;}
.reveal.visible{transform:none!important;}

@media(max-width:900px){
  .header:not(.scrolled){background:linear-gradient(180deg,rgba(5,25,29,.68),transparent)!important;}
  .nav{border-radius:20px!important;padding:22px!important;}
  #galeria .gallery{grid-template-columns:1.35fr .9fr!important;grid-template-rows:220px 220px 220px!important;}
  #galeria .gallery>.photo:nth-child(1){grid-column:1;grid-row:1 / span 2;}
  #galeria .gallery>.photo:nth-child(2){grid-column:2;grid-row:1;}
  #galeria .gallery>.photo:nth-child(3){grid-column:2;grid-row:2;}
  #galeria .gallery>.photo:nth-child(4){grid-column:1;grid-row:3;}
  #galeria .gallery>.photo:nth-child(5){grid-column:2;grid-row:3;}
}
@media(max-width:620px){
  .hero{min-height:760px;}
  .hero-content{padding-inline:20px!important;padding-bottom:118px!important;}
  .hero h1{font-size:clamp(2.85rem,13vw,4rem)!important;}
  .trust-strip{grid-template-columns:1fr!important;gap:0!important;}
  .trust-item{padding-block:11px!important;}
  #galeria .gallery{grid-template-columns:1fr 1fr!important;grid-template-rows:280px 170px 170px!important;gap:8px!important;}
  #galeria .gallery>.photo:nth-child(1){grid-column:1 / span 2;grid-row:1;}
  #galeria .gallery>.photo:nth-child(2){grid-column:1;grid-row:2;}
  #galeria .gallery>.photo:nth-child(3){grid-column:2;grid-row:2;}
  #galeria .gallery>.photo:nth-child(4){grid-column:1;grid-row:3;}
  #galeria .gallery>.photo:nth-child(5){grid-column:2;grid-row:3;}
  #galeria .photo span{font-size:.67rem!important;padding:6px 9px!important;}
  .bella-gallery-actions{justify-content:center;}
  .booking-grid{grid-template-columns:1fr!important;}
  .bella-resort-rail{left:12px;right:12px;bottom:10px;transform:translateY(20px);width:auto;justify-content:space-between;border-radius:22px;padding:8px;}
  .bella-resort-rail.is-visible{transform:none;}
  .bella-resort-rail__copy{display:none;}
  .bella-resort-rail a{flex:1;min-height:44px;padding-inline:11px;}
  .whatsapp{display:none!important;}
  footer{padding-bottom:95px!important;}
}
@media(prefers-reduced-motion:reduce){
  .bella-resort-rail,.bella-experience>div>div[style*="display:grid"]>div,.destination-card{transition:none!important;}
}


/* AJUSTE MÓVIL/TABLET: sin línea residual del header y sin etiquetas en galería */
@media (max-width: 1100px){
  header, .site-header, .navbar, .nav, .topbar,
  header::before, header::after,
  .site-header::before, .site-header::after,
  .navbar::before, .navbar::after{
    border-bottom:0 !important;
    border-top:0 !important;
    box-shadow:none !important;
    outline:none !important;
  }

  #galeria #official-gallery-grid > .bella-space-photo > span,
  #galeria #official-gallery-grid > .official-managed-card > span,
  #galeria #official-gallery-grid .photo-label,
  #galeria .bella-space-photo .photo-label,
  #galeria .official-managed-card .photo-label{
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    height:0 !important;
    min-height:0 !important;
    max-height:0 !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    overflow:hidden !important;
  }
}
