/* Trayecta EU · servicios (10/10/2026): formulario de avisos, buscador «¿Figura tu universidad?» y borrador del plazo vigilado.
   Solo variables de /assets/tokens.css. Se carga únicamente en las páginas que lo piden. */

.formulario {
  display: grid;
  gap: var(--e-5);
  max-width: var(--medida);
  margin: var(--e-5) 0;
  padding: var(--e-5);
  background: var(--c-superficie);
  border: var(--borde-fino) solid var(--c-linea);
  border-radius: var(--radio-l);
}
.formulario fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.formulario legend, .campo > label { display: block; padding: 0; margin-bottom: var(--e-2); font-weight: var(--peso-medio); }
.formulario input[type="email"],
.formulario input[type="search"],
.formulario input[type="text"],
.formulario select {
  width: 100%;
  box-sizing: border-box;
  padding: var(--e-3) var(--e-4);
  font: inherit;
  color: var(--c-texto);
  background: var(--c-fondo);
  border: var(--borde-medio) solid var(--c-linea);
  border-radius: var(--radio-m);
}
.formulario input:focus-visible, .formulario select:focus-visible {
  outline: var(--grosor-foco) solid var(--c-foco);
  outline-offset: var(--borde-medio);
}
.casillas { display: grid; gap: var(--e-2); grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); }
.casilla { display: flex; align-items: flex-start; gap: var(--e-3); line-height: var(--interlineado); }
.casilla input { flex: none; width: 1.25rem; height: 1.25rem; margin-top: var(--e-1); accent-color: var(--c-acento); }
.casilla label { font-weight: var(--peso-texto); }
.ayuda { font-size: var(--tam-s); color: var(--c-texto-suave); margin: var(--e-2) 0 0; }

/* Campo trampa para robots: fuera de la pantalla, no se lee ni se enfoca */
.trampa { position: absolute; left: -100vmax; width: var(--borde-fino); height: var(--borde-fino); overflow: hidden; }

.resultado {
  margin: var(--e-4) 0;
  padding: var(--e-4) var(--e-5);
  border: var(--borde-fino) solid var(--c-linea);
  border-left: var(--grosor-linea-pasos) solid var(--c-medidor);
  border-radius: var(--radio-m);
  background: var(--c-superficie);
}
.resultado--no { border-left-color: var(--c-estado-cambio); }
.resultado h3 { margin-top: 0; }
.resultado p:last-child { margin-bottom: 0; }

.estado-herramienta { min-height: 1.6em; color: var(--c-texto-suave); }
.pasos-calculo { counter-reset: paso; list-style: none; padding-left: 0; }
.pasos-calculo li { padding-left: var(--e-6); position: relative; }
.pasos-calculo li::before {
  counter-increment: paso;
  content: counter(paso);
  position: absolute;
  left: 0;
  width: var(--e-5);
  height: var(--e-5);
  line-height: var(--e-5);
  text-align: center;
  border-radius: var(--radio-pastilla);
  background: var(--c-acento-tinte);
  font-weight: var(--peso-fuerte);
}


/* ---------- «Tu plazo vigilado» (C2, 10/10/2026): venta, plan personal, formularios de desistimiento y baja ---------- */
.formulario[hidden], .resultado[hidden], [hidden].plan-bloque { display: none; }
.formulario input[type="date"] {
  width: 100%;
  box-sizing: border-box;
  padding: var(--e-3) var(--e-4);
  font: inherit;
  color: var(--c-texto);
  background: var(--c-fondo);
  border: var(--borde-medio) solid var(--c-linea);
  border-radius: var(--radio-m);
}
.formulario input[type="date"]:focus-visible { outline: var(--grosor-foco) solid var(--c-foco); outline-offset: var(--borde-medio); }
.formulario input[aria-invalid="true"] { border-color: var(--c-estado-caida); }
.etq-paso { margin: 0; font-size: var(--tam-s); font-weight: var(--peso-medio); color: var(--c-texto-suave); }
.error-form { margin: 0; min-height: 1.4em; color: var(--c-estado-caida); font-weight: var(--peso-medio); }
.resumen { display: grid; grid-template-columns: max-content 1fr; gap: var(--e-2) var(--e-4); margin: 0; }
.resumen dt { font-weight: var(--peso-medio); color: var(--c-texto-suave); }
.resumen dd { margin: 0; overflow-wrap: anywhere; }

.modo-prueba {
  max-width: var(--medida);
  margin: var(--e-4) 0;
  padding: var(--e-3) var(--e-4);
  border: var(--borde-medio) dashed var(--c-aviso-borde);
  border-radius: var(--radio-m);
  background: var(--c-aviso-fondo);
  color: var(--c-texto);
  font-weight: var(--peso-medio);
}
.precio-caja { max-width: var(--medida); margin: var(--e-4) 0; padding: var(--e-4) var(--e-5); border: var(--borde-fino) solid var(--c-linea); border-radius: var(--radio-l); background: var(--c-superficie); }
.precio-caja .precio { font-size: var(--tam-cifra); font-weight: var(--peso-titulo); margin: 0; }
.precio-caja p:last-child { margin-bottom: 0; }
.resumen-pedido { max-width: var(--medida); }

.linea-tiempo { list-style: none; margin: var(--e-4) 0; padding: 0 0 0 var(--e-5); border-left: var(--grosor-linea-pasos) solid var(--c-linea); display: grid; gap: var(--e-4); max-width: var(--medida); }
.linea-tiempo li { position: relative; }
.linea-tiempo li::before { content: ""; position: absolute; left: calc(-1 * var(--e-5) - var(--grosor-linea-pasos) / 2 - var(--e-1)); top: var(--e-2); width: var(--e-3); height: var(--e-3); border-radius: var(--radio-pastilla); background: var(--c-acento); }
.linea-tiempo .hito--pasado { color: var(--c-texto-suave); }
.linea-tiempo .hito--pasado::before { background: var(--c-linea); }
.linea-tiempo .hito--cerca::before { background: var(--c-estado-cambio); }
.hito__fecha { display: block; font-size: var(--tam-l); font-weight: var(--peso-fuerte); }
.hito__regla { display: block; font-size: var(--tam-s); color: var(--c-texto-suave); }