/* Usa paleta existente; respeta :root ya definido en site */
.wb-body { background: var(--background-color); color: var(--text-color); }
.container { max-width: 1100px; margin: 0 auto; padding: 32px 20px; }

/* Fade utilitario */
.fade-in { animation: fade .45s ease-out both; }
.hidden { display: none !important; }
.locked { filter: blur(3px); pointer-events: none; user-select: none; opacity: .45; }
@keyframes fade { from { opacity: 0 } to { opacity: 1 } }

/* Hero */
.wb-hero { display: grid; grid-template-columns: 1.1fr .9fr; gap: 24px; align-items: center; }
.wb-hero__text h1 { font-size: clamp(28px, 4vw, 44px); line-height: 1.15; }
.wb-hero__text p { margin: 8px 0 18px; font-size: 1.05rem; }
.wb-hero__mockup img { width: 100%; border-radius: 16px; box-shadow: 0 12px 32px rgba(0,0,0,.12); }
.wb-hero.fade-out {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.6s ease-out;
}

.btn_book {
  display: inline-block;
  padding: 14px 32px;              
  font-size: 1.1rem;
  font-weight: 700;
  border-radius: 999px;
  background: var(--text-color);
  color: #fff;
  text-decoration: none;
  transition: background 0.3s ease, transform 0.15s ease;
}

.btn_book:hover {          
  transform: translateY(-2px);
}

.btn_book:active {
  transform: translateY(0);
}

/* Oculta los botones de descarga al inicio */
#btnTopDownload,
#btnMidDownload,
#btnBottomDownload {
  display: inline-block;
  margin: 20px auto;
  text-align: center;
}


/* Preview */
.wb-preview { 
  margin-bottom: 0; 
  padding-bottom: 0; 
  text-align: center; }
.wb-preview__grid { display:grid; grid-template-columns: repeat(auto-fit,minmax(240px,1fr)); gap:16px; margin-top:16px; }
.wb-preview__grid img { width:100%; border-radius:12px; box-shadow: 0 8px 24px rgba(0,0,0,.10); }
.wb-preview .wb-cta {
  margin-bottom: 0;   
}
.wb-preview h2 {
  margin-bottom: 8px; 
}

/* Lead gate */
.wb-leadgate { margin: 48px 0; background:#fff; padding: 22px; border-radius:14px; box-shadow:0 8px 24px rgba(0,0,0,.08); }
.field { margin-bottom: 14px; text-align:left; }
.field label { display:block; font-weight:700; margin-bottom:6px; }
.field input { width:100%; padding:10px 12px; border:1px solid #e5e5e5; border-radius:10px; background:#fff; }
.consent { margin: 10px 0 14px; font-size:.95rem; }
.hp { display:none !important; }
.msg { margin-top:10px; min-height:1.4em; }

/* Video */
.wb-video {
  margin-top: 0 !important; 
  padding-top: 0;
  text-align: center;
}
.video-wrap {
  position: relative;
  aspect-ratio: 16/9;
  max-width: 600px;      
  margin: 0 auto;
}

.video-wrap iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Descripción */
.wb-desc {
  margin-top: 10px;
}
.wb-desc h2 { margin-bottom:10px; }
.wb-desc h3 { margin:18px 0 8px; }
.bullets { padding-left: 1.2rem; }
.bullets li { margin: 6px 0; }
.wb-desc .content  {
  max-width: 750px;       /* centradas */
  margin: 0 auto 1.2em;   /* centrado horizontal + separación */
  text-align: left;       /* texto alineado a la izquierda */
  list-style: none;
  padding-left: 0;
}
.wb-desc .content .bullets li {
  margin: 8px 0;
  font-size: 1.05rem;
  line-height: 1.6;
}

/* CTA y Gracias */
.wb-cta { text-align:center; margin: 0; }
.wb-thanks .card { padding:24px; border-radius:14px; margin-top:28px; }
.wb-thanks a {
  color: var(--text-color);
  text-decoration: underline;
}

@media (max-width: 900px) {
  .wb-hero { grid-template-columns: 1fr; }
}