/* ===== Pantalla de carga =====
   La crea intro.js cada vez que se carga una página.
   El isotipo se dibuja con un solo trazo: sus piezas son rellenos, así que van debajo de una
   máscara (una línea gruesa que recorre la O y la V); se ve el logo solo donde ya pasó la línea. */
.intro{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:var(--blanco,#fff);cursor:pointer;
  transition:opacity .45s ease,visibility 0s linear .45s}
.intro svg{width:clamp(150px,38vw,230px);height:auto;overflow:visible;margin-bottom:6vh;transition:transform .45s ease}
.intro.sale{opacity:0;visibility:hidden}
.intro.sale svg{transform:scale(1.05)}

/* 0,1 s de espera, 1,5 s de trazo; la pupila entra cuando el trazo va por el 80 % */
.intro-trazo{stroke-dasharray:1 2;stroke-dashoffset:1;animation:intro-trazo 1.5s cubic-bezier(.65,0,.35,1) .1s forwards}
.intro-pupila{transform-box:fill-box;transform-origin:center;transform:scale(0);opacity:0;
  animation:intro-pupila .55s cubic-bezier(.34,1.56,.64,1) 1.3s forwards}
@keyframes intro-trazo{to{stroke-dashoffset:0}}
@keyframes intro-pupila{40%{opacity:1}to{transform:scale(1);opacity:1}}