/* Paginatransitie — Osmo Pixelated Wave: kleinere tegels, #4041D6, golf van onder naar boven.
   De panel is een kolom van rijen ([data-transition-col]); elke rij is een strook tegels. */
.transition {
  z-index: 110;
  pointer-events: none;
  position: fixed;
  inset: 0;
  overflow: clip;
}

.transition__panel {
  opacity: 0;
  flex-flow: column;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
}

.transition__col {
  flex-flow: row;
  justify-content: flex-start;
  align-items: stretch;
  display: flex;
  flex: none;
}

.transition__pixel {
  flex: none;
  width: var(--pixel, 40px);
  height: var(--pixel, 40px);
  background-color: #4041d6;
}

/* binnenkomst: dek meteen af tot de tegels er staan (anders flitst de pagina even) */
html.is-entering .transition { background-color: #4041d6; }
html.is-entering .logo-loader { display: none; }