css/componentes/umbral.css

/* Umbral — la primera pantalla. Cielo, una frase y Seguir. */

.umbral {
  position: relative;
  z-index: 1;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--e-8);
  text-align: center;
  padding: var(--e-10) var(--e-7);
}

.umbral__marca {
  font-size: var(--f-s);
  letter-spacing: var(--f-espaciado-ancho);
  color: var(--texto-noche-apunte);
  margin: 0;
}

.umbral__frase {
  font-size: var(--f-xl);
  line-height: var(--f-alto-apretado);
  /* Tinta lisa, sin degradado: un degradado de texto probó un halo. */
  font-weight: var(--f-peso-titulo);
  letter-spacing: var(--f-espaciado-titulo);
  margin: 0;
  max-width: 16em;
}

.umbral__apunte {
  font-size: var(--f-l);
  line-height: var(--f-alto-normal);
  color: var(--texto-noche-tenue);
  margin: 0;
  max-width: 26em;
}

@media (max-width: 640px) {
  .umbral__frase  { font-size: calc(var(--f-xl) * 0.62); }
  .umbral__apunte { font-size: var(--f-md); }
}