/* ═══════════════════════════════════════════════════════════════════════════
   TÉRMINOS Y CONDICIONES — puerta de consulta, documento y aceptación.
   Diseño plano: sin degradados, sin sombras, sin movimiento al hover.
   ═══════════════════════════════════════════════════════════════════════════ */

/* Mientras no haya constancia de consulta, el documento y la aceptación no se
   muestran. Solo ocurre con JavaScript activo: sin él la página se lee
   completa, que es lo que necesitan los buscadores y la accesibilidad. */
.terms-js .terms-doc,
.terms-js .terms-accept {
  display: none;
}

.terms-js .terms-doc.is-open,
.terms-js .terms-accept.is-open {
  display: block;
}

.terms-gate {
  display: none;
}

.terms-js .terms-gate {
  display: block;
}

/* ───────────────────────────── PUERTA DE CONSULTA ────────────────────────── */
.terms-gate__panel {
  max-width: 44rem;
  margin: 0 auto;
  padding: clamp(var(--sp-5), 4vw, var(--sp-8));
  border: 1px solid var(--c-border);
  border-left: 4px solid var(--c-navy);
  background-color: var(--c-bg);
}

.terms-gate__title {
  font-size: var(--fs-2xl);
  color: var(--c-navy);
}

.terms-gate__text {
  margin-top: var(--sp-3);
  color: var(--c-text-soft);
}

.terms-gate__form {
  margin-top: var(--sp-6);
}

.terms-gate__label {
  display: block;
  margin-bottom: var(--sp-2);
  color: var(--c-navy);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.terms-gate__input {
  display: block;
  width: 100%;
  padding: var(--sp-3) var(--sp-4);
  border: 1px solid var(--c-border);
  border-radius: 0;
  background-color: var(--c-surface);
  color: var(--c-text);
  font-family: inherit;
  font-size: var(--fs-base);
}

.terms-gate__input:focus-visible {
  outline: 3px solid var(--c-navy);
  outline-offset: 2px;
}

.terms-gate__input.is-invalid {
  border-color: #B3261E;
}

.terms-gate__hint {
  margin-top: var(--sp-2);
  color: var(--c-text-soft);
  font-size: var(--fs-sm);
}

.terms-gate__check {
  display: grid;
  grid-template-columns: 1.25rem minmax(0, 1fr);
  gap: var(--sp-3);
  align-items: start;
  margin-top: var(--sp-5);
  color: var(--c-text-soft);
  font-size: var(--fs-sm);
  line-height: 1.55;
  cursor: pointer;
}

.terms-gate__check input {
  width: 1.25rem;
  height: 1.25rem;
  margin: 0;
  accent-color: var(--c-navy);
  cursor: pointer;
}

.terms-gate__error,
.terms-accept__error {
  margin-top: var(--sp-4);
  padding: var(--sp-3) var(--sp-4);
  border: 1px solid #B3261E;
  color: #B3261E;
  font-size: var(--fs-sm);
}

.terms-gate__submit {
  margin-top: var(--sp-5);
}

.terms-gate__note {
  margin-top: var(--sp-5);
  padding-top: var(--sp-4);
  border-top: 1px solid var(--c-border);
  color: var(--c-text-soft);
  font-size: var(--fs-sm);
}

/* ───────────────────────────── DOCUMENTO ─────────────────────────────────── */
/* Medida de lectura: el sitio usa contenedores a ancho completo, pero un
   contrato de doce mil caracteres a 1200px por renglón no se lee. Se limita
   solo aquí, con el mismo recurso en ch que ya usa .closing__text. */
.terms-doc__body > * {
  max-width: 82ch;
}

.terms-doc__anexo {
  color: var(--c-navy);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.terms-doc__title {
  margin-top: var(--sp-3);
  font-size: var(--fs-2xl);
  color: var(--c-navy);
  line-height: 1.2;
}

.terms-doc__body h2 {
  margin-top: var(--sp-8);
  padding-top: var(--sp-4);
  border-top: 1px solid var(--c-border);
  font-size: var(--fs-xl);
  color: var(--c-navy);
}

.terms-doc__body h3 {
  margin-top: var(--sp-6);
  font-size: var(--fs-lg);
  color: var(--c-navy);
}

.terms-doc__body p {
  margin-top: var(--sp-4);
  color: var(--c-text-soft);
  line-height: 1.7;
}

.terms-doc__body strong {
  color: var(--c-text);
}

.terms-doc__list {
  margin-top: var(--sp-4);
  padding-left: var(--sp-5);
  list-style: disc;
  color: var(--c-text-soft);
}

.terms-doc__list li {
  margin-top: var(--sp-3);
  line-height: 1.7;
}

/* ───────────────────────────── ACEPTACIÓN ────────────────────────────────── */
.terms-accept {
  padding-top: 0;
}

.terms-accept__panel {
  max-width: 44rem;
  margin: 0 auto;
  padding: clamp(var(--sp-5), 4vw, var(--sp-8));
  border: 1px solid var(--c-border);
  border-left: 4px solid var(--c-navy);
  background-color: var(--c-bg);
}

.terms-accept__title {
  font-size: var(--fs-2xl);
  color: var(--c-navy);
}

.terms-accept__text {
  margin-top: var(--sp-3);
  color: var(--c-text-soft);
}

.terms-accept__who {
  margin-top: var(--sp-4);
  padding: var(--sp-3) var(--sp-4);
  border: 1px solid var(--c-border);
  color: var(--c-text);
  font-size: var(--fs-sm);
}

#terms-accept-btn {
  margin-top: var(--sp-5);
}

.terms-accept__done {
  margin-top: var(--sp-5);
  padding: var(--sp-4);
  border: 1px solid var(--c-navy);
  color: var(--c-navy);
  font-weight: var(--fw-medium);
}

@media (max-width: 640px) {
  .terms-gate__panel,
  .terms-accept__panel {
    padding: var(--sp-5);
  }
  .terms-doc__title {
    font-size: var(--fs-xl);
  }
}