/* 
 * DO NOT EDIT THIS FILE.
 * The Airbus Web Experience use PostCSS to compile CSS
 * the same way as in the Drupal core except it use the .pcss extension.
 * Therefore, you are supposed to edit the pcss file of the same name.
 */

.awx-kf{
  display:flex;
  opacity:0;
  gap:2rem;
  perspective:600px;
}

.awx-kf.processed--kf{
  opacity:1;
}

.awx-kf-word{
  display:inline-flex;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  pointer-events:none;
}

.awx-kf-char{
  --this-anim-delay:calc(var(--anim-delay, 0)*60ms);

  transition:transform 300ms var(--awx-ease-in-out) 0ms, opacity 300ms var(--awx-ease-in-out) 0ms;

  transition:transform 300ms var(--awx-ease-in-out) var(--this-anim-delay), opacity 300ms var(--awx-ease-in-out) var(--this-anim-delay);
  transform:rotate3d(-1, -0.4, 0, 90deg);
  transform-origin:center center 0.4em;
  opacity:0;
}

.awx-kf[data-in-view="1"] .awx-kf-char{
  transform:rotate3d(0, 0, 0, 0);
  opacity:1;
}