/* ============================================================
   05 · PARÁMETROS (RTP / volatilidad)
   Anatomy unlike siblings: DUELO "cara a cara". Dos conceptos
   enfrentados por un eje de oro vertical con un rombo al centro.
   Bloque puramente TIPOGRÁFICO, sin lámina: pausa deliberada de
   respiración entre secciones con mucha imagen. Simetría rota por
   el ancho desigual de las columnas y el desfase del rótulo.
   ============================================================ */

.parametros {
  padding: var(--seccion-y) var(--canal);
  background: var(--vitela);
  border-top: 1px solid var(--filete);
}
.parametros__cabe { max-width: 58ch; margin-bottom: clamp(2.8rem, 4.5vw, 4.6rem); display: grid; gap: 1.1rem; }
.parametros__titulo { font-size: var(--t-titulo); }
.parametros__intro { font-size: var(--t-lead); color: var(--tinta-media); }

.parametros__duelo {
  display: grid;
  grid-template-columns: 1.05fr auto 0.95fr;
  gap: clamp(1.8rem, 4vw, 4.5rem);
  align-items: stretch;
}
.parametros__lado { display: flex; flex-direction: column; }
.parametros__lado--der { padding-top: clamp(1.4rem, 3vw, 3rem); }  /* desfase: no se alinean */

.parametros__rotulo {
  font-family: "Public Sans", sans-serif; font-size: var(--t-folio);
  font-weight: 700; letter-spacing: 0.3em; text-transform: uppercase; color: var(--oro-hondo);
  margin-bottom: 0.7rem;
}
.parametros__lado--der .parametros__rotulo { text-align: right; }
.parametros__concepto { font-family: "Cormorant Garamond", serif; font-size: var(--t-sub); font-weight: 700; margin-bottom: 1.1rem; }
.parametros__lado--der .parametros__concepto { text-align: right; }
.parametros__txt { color: var(--tinta); }
.parametros__lado--der .parametros__txt { color: var(--tinta-media); }

/* ---- eje de oro con rombo ---- */
.parametros__eje { position: relative; width: 2px; background: var(--oro-grad); justify-self: center; }
.parametros__eje::before {
  content: ""; position: absolute; top: 50%; left: 50%;
  width: 0.9rem; height: 0.9rem; background: var(--oro-vivo);
  border: 1px solid var(--carbon); transform: translate(-50%, -50%) rotate(45deg);
}

.parametros__pie { margin-top: clamp(2.6rem, 4vw, 3.6rem); display: flex; justify-content: center; }

@media (max-width: 1024px) {
  .parametros__duelo { grid-template-columns: 1fr; gap: 0; }
  .parametros__eje { width: 100%; height: 2px; margin: 2.2rem 0; }
  .parametros__lado--der { padding-top: 0; }
  .parametros__rotulo, .parametros__lado--der .parametros__rotulo,
  .parametros__concepto, .parametros__lado--der .parametros__concepto { text-align: left; }
}
