/* nota.css — el banner aspiracional. Es el respiro de la página: sin botón. */
.nota {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-block: var(--esp-10);
  background: var(--kv-bruma);
  text-align: center;
}
/* Dos halos muy suaves, cielo y lavanda, como único detalle gráfico */
.nota__detalle {
  position: absolute;
  z-index: -1;
  width: min(70vw, 560px);
  aspect-ratio: 1;
  border-radius: 50%;
  left: -12%;
  top: -35%;
  background: radial-gradient(circle, var(--kv-cielo-bruma), transparent 70%);
}
.nota__detalle--lavanda {
  left: auto;
  top: auto;
  right: -15%;
  bottom: -45%;
  background: radial-gradient(circle, var(--kv-lavanda-bruma), transparent 70%);
}
.nota__texto {
  font-family: var(--fuente-serif);
  font-weight: var(--peso-display);
  font-size: var(--txt-3xl);
  line-height: var(--interlineado-titular);
  letter-spacing: var(--tracking-display);
  max-width: 18ch;
  margin-inline: auto;
}
.nota__linea { display: block; }
/* Lavanda sólo en titular grande: a este tamaño el contraste sobre bruma alcanza */
.nota__linea--acento { color: var(--kv-lavanda); font-style: italic; font-weight: 400; }