.hero{
  position:relative;

  width:100%;
  height:100vh;

  overflow:hidden;
  padding: 0;
}

.bg-image{
  position:absolute;

  width:100%;
  height:100%;

  object-fit:cover;

  object-position: right center;

  top:0;
  left:0;

  z-index:1;
}

.about-content{
  position: absolute;
  right: 12%;
  top: 50%;
  transform: translateY(-50%);

  display: flex;
  flex-direction: column;
  gap: 16px;

  align-items: flex-start;
  z-index: 2;
}



.about-text h1{
color:rgb(250, 187, 234);
  font-family:'Oswald', sans-serif;
  font-size:8rem;

  line-height:0.9;

  font-weight:400;

  margin-bottom:40px;
}

.about-text p{
  font-size:1rem;
  margin-bottom:20px;
  width: 450px;
}

@media (max-width:1100px){

  .bg-image{
    object-position:60% center;
  }

  .about-content{
  left: auto;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
  }

  .about-text{
    width: 100%;
    text-align: right;
  }

  .about-text h1{
    font-size: 5rem;
    font-weight: 400;
  }

  .about-text p{
    font-size: 1rem;
      width: 350px;
  }
}