/* Página /prueba. Provisional de la V0: solo el titular y el formulario.
   Cuando la demo tenga su destino de verdad, esta página se va entera. */

.prueba {
  padding: clamp(56px, 7vw, 96px) clamp(20px, 5.5vw, 80px) clamp(72px, 9vw, 120px);
}

.prueba__interior {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--gi);
  box-sizing: border-box;
}

.prueba__titulo {
  font: 700 var(--fs-h1) / var(--lh-h1) var(--fd);
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 0 32px;
}

/* El formulario ocupa todo el ancho del contenido. Typeform mete su propia
   hoja de estilos después de esta y le pone 500 px de alto al contenedor,
   así que hay que nombrar sus clases para ganarle. */
.prueba__formulario,
.prueba__formulario [data-tf-live],
.prueba__formulario [data-tf-live] > div,
.prueba__formulario .tf-v1-widget,
.prueba__formulario .tf-v1-widget iframe {
  width: 100%;
  min-height: 600px;
  border: 0;
}

/* En móvil manda la altura de la pantalla, para que el formulario se vea
   entero sin tener que desplazarlo dentro de sí mismo. */
@media (max-width: 767px) {
  .prueba__formulario,
  .prueba__formulario [data-tf-live],
  .prueba__formulario [data-tf-live] > div,
  .prueba__formulario .tf-v1-widget,
  .prueba__formulario .tf-v1-widget iframe {
    min-height: calc(100vh - 160px);
  }
}
