/* Estructura y tipografía. Los colores viven en css/temas/. */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  background: var(--fondo);
  color: var(--texto);
  font-family: "Helvetica Neue", Arial, system-ui, sans-serif;
  line-height: 1.4;
}

.portada {
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 6vh 6vw;
  overflow: hidden;
}

.estado {
  align-self: flex-start;
  margin: 0 0 2.5vh;
  padding: .45em 1em;
  border-radius: 999px;
  background: var(--acento-3);
  color: var(--sobre-acento);
  font-size: clamp(.8rem, 1.6vw, 1rem);
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.titulo {
  margin: 0;
  display: flex;
  flex-direction: column;
  font-family: "Arial Black", "Helvetica Neue", Arial, sans-serif;
  font-weight: 900;
  font-size: clamp(3rem, 14.2vw, 10.5rem);
  line-height: .92;
  letter-spacing: -.03em;
  text-transform: uppercase;
}

.titulo .resalta-1 { color: var(--acento-1); }
.titulo .resalta-2 { color: var(--acento-2); }

.institucion {
  margin: 2.5vh 0 0;
  font-size: clamp(1rem, 2.4vw, 1.6rem);
  font-weight: 500;
  letter-spacing: .02em;
  opacity: .8;
}

.subtitulo {
  margin: 4vh 0 0;
  font-size: clamp(1.3rem, 3.6vw, 2.6rem);
  font-weight: 800;
}

.aviso {
  margin: 3vh 0 0;
  max-width: 34ch;
  font-size: clamp(1rem, 1.8vw, 1.2rem);
  opacity: .85;
}

[hidden] { display: none !important; }

@media (prefers-reduced-motion: no-preference) {
  .estado { animation: latido 2.4s ease-in-out infinite; }
  @keyframes latido { 50% { transform: scale(1.04); } }
}