@charset "UTF-8";
/* ==========================================================================
   Intro (opening logo animation)
   ========================================================================== */

/*
 * Two fixed layers so the header (z-index 100) stays visible during the intro, as in the
 * reference recording: the gradient sits under the header, the logo flies over it.
 */
.intro {
  position: fixed;
  inset: 0;
  z-index: 90;
  cursor: pointer;
  /* Radial gradient from the Figma frame (centre 715,22 · radii 725 x 1289 on 1440 x 810) */
  background: radial-gradient(50.35% 159.12% at 49.65% 2.72%, #f9c8c1 0%, #bba1a5 25%, #7d7a89 50%, #5d667a 62.5%, #3e526c 75%, #1f3f5e 87.5%, #103557 93.75%, #002b50 100%);
}

.intro-stage {
  position: fixed;
  inset: 0;
  z-index: 200;
  overflow: hidden;
  pointer-events: none;
}

/* Word mark (no "AWJ"): ~22% of the viewport width, centred, a little below the middle */
.intro__mark {
  position: absolute;
  left: 50%;
  top: 55%;
  width: clamp(180px, 22vw, 330px);
  aspect-ratio: 229/153.78;
  translate: -50% -50%;
  will-change: transform;
}

.intro__logo {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
}

/* Head of the "و": (150.92, 314.45) 39.03 x 39.29 in the 229 x 153.78 mark (top at y 275) */
.intro__piece {
  position: absolute;
  left: 65.904%;
  top: 25.654%;
  width: 17.044%;
  height: 25.55%;
  overflow: visible;
  will-change: transform;
  /* Parked off screen until the fall animation takes over (no one-frame flash in its slot) */
  transform: translateY(-200vh);
}

/* Skipped: show the finished logo while everything fades */
.intro-stage.is-skipped .intro__piece {
  transform: none;
}

/* Already played in this visit (coming back from an inner page): no intro at all */
.intro-seen .intro,
.intro-seen .intro-stage {
  display: none;
}
