/* ==========================================================================
   Base Styles
   ========================================================================== */
body {
  flex-direction: column;
}

/* ==========================================================================
   Hero Section
   ========================================================================== */
.contact-img {
  height: 95vh;
  background-image: linear-gradient(
      rgba(0, 0, 0, 0.2),
      rgba(0, 0, 0, 0.4),
      rgba(0, 0, 0, 0.7)
    ),
    url("../../assets/about/about-us-background.webp");
}

/* ==========================================================================
   Layout Utilities
   ========================================================================== */
.dp-flex-spc-btw {
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   Typography
   ========================================================================== */
.text-us {
  font-size: 1.2rem;
  letter-spacing: 1.28px;
  max-width: 800px;
}

/* ==========================================================================
   Animations
   ========================================================================== */
@keyframes appear {
  from {
    opacity: 0;
    scale: 0.5;
  }
  to {
    opacity: 1;
    scale: 1;
  }
}

.block-animation {
  animation: appear linear;
  animation-timeline: view();
  animation-range: entry 0% cover 25%;
}