/* Tipo «test»: preguntas y captura. Se carga después de assets/styles.css
   (núcleo); el resultado lo pinta cada sitio en su assets/sitio.css. */

/* Portada: antetítulo en naranja y título en mayúsculas, como en el resto de landings */
.hero .eyebrow { color: var(--bd-orange); }
.hero h1 { text-transform: uppercase; }

/* Test */
.quiz { gap: 28px; padding-top: 40px; padding-bottom: 80px; }
.progress { height: 8px; background: var(--bd-grey); }
.progress-bar { height: 100%; width: 0; background: var(--bd-blue-light); transition: width .3s ease; }
.quiz-meta { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 12px; font-size: 15px; color: var(--bd-ink-2); }
.question-head { gap: 10px; }
.question { font-size: clamp(22px, 2.8vw, 28px); line-height: 1.3; color: var(--bd-black); outline: none; }
.options { display: flex; flex-direction: column; gap: 8px; }
.option {
  display: flex; align-items: flex-start; gap: 16px; width: 100%; text-align: left;
  padding: 18px 20px; border: 2px solid var(--bd-grey); background: var(--bd-grey-50); color: var(--bd-ink);
  font: 300 17px/1.5 var(--font-body); cursor: pointer;
  transition: background .12s, border-color .12s;
}
.option:hover { border-color: var(--bd-blue-dark); }
.option-key {
  flex: none; width: 32px; height: 32px; display: grid; place-items: center;
  font: 700 14px var(--font-heading); background: #fff; color: var(--bd-blue-dark);
}
.option-text { padding-top: 3px; }
.option.selected { background: var(--bd-blue-dark); border-color: var(--bd-blue-dark); color: #fff; }
.option.selected .option-key { background: var(--bd-orange); color: var(--bd-black); }
.hint { font-size: 14px; color: var(--bd-ink-2); }

/* Captura */
.lead { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 48px; align-items: start; padding-bottom: 80px; }
.lead-intro { gap: 18px; padding-top: 8px; }
.lead-intro h2 { font-size: 30px; }
.lead-intro p { font-size: 19px; line-height: 1.55; }
.lead-intro .link-btn { align-self: flex-start; }

/* Nota bajo el botón de empezar y el de enviar (contenido.php → boton_nota) */
p.boton-nota { font-size: 15px; line-height: 1.45; opacity: .85; }
.form p.boton-nota { color: #fff; }