/* Landing Preparación online — CBS
   Tokens de marca extraídos de carlosblancosanjurjo.com (theme BeTheme, 2026-08-25):
   morado #410a6d · morado claro #8c76a4 · naranja #e98b37 · amarillo #fbd05d · fondo #0f0209 · Kanit */
:root {
  --fondo: #0f0209;
  --morado: #410a6d;
  --morado-claro: #8c76a4;
  --naranja: #e98b37;
  --amarillo: #fbd05d;
  --claro: #ffffff;
  --texto-suave: #cbbfd8;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
img { max-width: 100%; height: auto; }
body {
  font-family: "Kanit", system-ui, sans-serif;
  font-weight: 300;
  color: var(--claro);
  background: var(--fondo);
  line-height: 1.6;
}
h1, h2, h3 { font-weight: 700; }
.contenedor { max-width: 840px; margin: 0 auto; padding: 0 1.25rem; }
.hero {
  padding: 4rem 0 3.5rem;
  background: linear-gradient(160deg, var(--morado) 0%, var(--fondo) 78%);
  text-align: center;
}
.credencial {
  color: var(--amarillo);
  font-weight: 600;
  letter-spacing: .08em;
  font-size: .85rem;
  text-transform: uppercase;
  margin-bottom: 1rem;
}
h1 { font-size: clamp(1.9rem, 5vw, 3rem); line-height: 1.15; margin-bottom: 1rem; }
.subtitulo { font-size: 1.15rem; color: var(--texto-suave); max-width: 640px; margin: 0 auto 1.75rem; }
/* Oferta visible desde el primer bloque */
.oferta {
  display: inline-flex; flex-direction: column; gap: .15rem;
  max-width: 100%;
  margin: .25rem auto 1.25rem; padding: .8rem 1.4rem;
  border: 1px solid var(--naranja); border-radius: 10px;
  background: rgba(15, 2, 9, .45);
}
.oferta-nombre { font-weight: 400; font-size: 1.05rem; }
.oferta-precio { font-weight: 800; font-size: 1.5rem; color: var(--amarillo); }
.alternativa { font-size: .95rem; color: var(--texto-suave); margin-top: 1rem; }
.alternativa a { color: var(--claro); font-weight: 600; }
h2 { font-size: clamp(1.4rem, 4vw, 2rem); margin-bottom: 1rem; }
.bloque { padding: 3rem 0; }
.bloque-alterno { background: #1a0b26; }
.boton {
  display: inline-block;
  max-width: 100%;
  text-align: center;
  background: var(--naranja);
  color: #2b1503;
  border: 0;
  padding: .95rem 1.8rem;
  border-radius: 8px;
  font-family: inherit;
  font-size: 1.05rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}
.boton-whatsapp { background: var(--naranja); }
.boton-secundario { background: transparent; border: 2px solid var(--morado-claro); color: var(--claro); }
.boton:hover { filter: brightness(1.08); }
.nota-cta { font-size: .9rem; color: var(--morado-claro); margin-top: .9rem; }
.lista-incluye, .pasos { padding-left: 1.3rem; }
.lista-incluye li, .pasos li { margin-bottom: .7rem; }
.foto-carlos { width: 100%; max-width: 420px; border-radius: 12px; display: block; margin: 0 0 1.25rem; }
.casos { display: grid; gap: 1.25rem; grid-template-columns: 1fr; margin-top: 1.5rem; }
@media (min-width: 700px) { .casos { grid-template-columns: repeat(3, 1fr); } }
.caso img { width: 100%; border-radius: 10px; display: block; }
.caso figcaption { margin-top: .5rem; font-size: .9rem; }
.caso a { color: var(--texto-suave); }
.tarjetas { display: grid; gap: 1.25rem; grid-template-columns: 1fr; margin-top: 1.5rem; }
@media (min-width: 700px) { .tarjetas { grid-template-columns: 1fr 1fr; } }
.tarjeta { background: #1a0b26; border: 1px solid #35204a; border-radius: 12px; padding: 1.75rem; text-align: left; }
.tarjeta-destacada { border-color: var(--naranja); }
.precio { font-size: 2.2rem; font-weight: 800; margin: .5rem 0 1rem; color: var(--amarillo); }
details { background: #170923; border-radius: 8px; padding: .9rem 1.1rem; margin-bottom: .7rem; }
summary { cursor: pointer; font-weight: 600; }
details p { margin-top: .6rem; color: var(--texto-suave); }
.formulario { margin-top: 1.75rem; display: grid; gap: 1rem; text-align: left; }
.formulario label { display: block; font-weight: 600; font-size: .95rem; }
.formulario input, .formulario textarea, .formulario select {
  width: 100%; margin-top: .35rem; padding: .75rem;
  border-radius: 8px; border: 1px solid #4a2f63;
  background: #170923; color: var(--claro);
  font-family: inherit; font-size: 1rem;
}
.formulario select:invalid { color: var(--morado-claro); }
.formulario option { color: var(--claro); }
.opcional { font-weight: 300; color: var(--morado-claro); }
.casilla { display: flex !important; gap: .5rem; align-items: flex-start; }
.casilla input { width: auto; margin-top: .3rem; flex-shrink: 0; }
.confirmacion { font-weight: 400 !important; font-size: .95rem !important; color: var(--claro); }
.consentimiento { font-weight: 300 !important; font-size: .85rem !important; color: var(--morado-claro); }
.consentimiento a { color: var(--texto-suave); }
.oculto { position: absolute; left: -9999px; }
.aviso { padding: .8rem 1rem; border-radius: 8px; margin: 1rem 0; }
.aviso-ok { background: #1c3a26; color: #a9e6bc; }
.aviso-error { background: #40140f; color: #f0a29a; }
.pie { padding: 2rem 0 5.5rem; border-top: 1px solid #35204a; font-size: .85rem; color: var(--morado-claro); text-align: center; overflow-wrap: anywhere; }
.pie a { color: var(--texto-suave); }
#contacto, #planes { text-align: center; }
/* CTA fija en móvil (cro): el CTA primario siempre a un toque */
.cta-fija {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 10;
  padding: .6rem 1rem calc(.6rem + env(safe-area-inset-bottom));
  background: rgba(15, 2, 9, .95);
  border-top: 1px solid #35204a;
  text-align: center;
}
.cta-fija .boton { width: 100%; max-width: 420px; }
@media (min-width: 900px) { .cta-fija { display: none; } .pie { padding-bottom: 2rem; } }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
/* Banner de cookies (Consent Mode) */
.banner-cookies {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 20;
  background: #1a0b26;
  border-top: 2px solid var(--morado);
  padding: 1rem 1.25rem calc(1rem + env(safe-area-inset-bottom));
  font-size: .9rem; color: var(--texto-suave);
  display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; justify-content: center;
}
.banner-cookies p { max-width: 560px; }
.banner-cookies a { color: var(--claro); }
.banner-botones { display: flex; gap: .6rem; }
.banner-cookies .boton { padding: .55rem 1.1rem; font-size: .95rem; }
.banner-cookies[hidden] { display: none; }