Parallax Site with darken image not text

I am trying to create a parallax webpage with multiple images but I want to make the images darken and the text regular. My images and text are all in the same div since its parralax but maybe theres another way?

.pimg1,
.pimg2,
{
  position: relative;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  filter: brightness(50%);
  height: 100vh;
}

.pimg1 {
  background-image: url('https://www.sticky.digital/wp-content/uploads/2013/11/img-6.jpg');
  min-height: 100%;
}

.pimg2 {
  background-image: url('https://babeltechreviews.com/wp-content/uploads/2018/07/rendition1.img_.jpg');
  min-height: 100%;
}

<body>
  <div>
    <img src="https://www.sticky.digital/wp-content/uploads/2013/11/img-6.jpg" class="pimg1">
    <div class="ptext">
      <h1 class="Intro"><strong>Farbod Jahan</strong></h1> <br>
    </div>
  </div>
  <div>
    <div class="pimg2">
      <div class="ptext">
        <h1 class="openSans"><strong>Who am I</strong></h1> <br>
      </div>
    </div>
</body>

Solution

Use pseudo elements ::before or ::after

Here you go. Try this

body{width:100%;}

.pimg1{
    position:relative;
    width:100%; 
    max-width:48%;
    margin-right:1%;
    float:left;
    height:100vh;
    margin-bottom:100px;
}
.pimg1::before{
  content:"";
  background:url('https://www.w3schools.com/html/clouds.jpg') no-repeat fixed center;
  background-size:cover;
  position:absolute; 
  top:0; 
  left:0; 
  height:100%;    
  width:100%;
  filter:brightness(50%);
  z-index:-1;
}

<body>
    <div class="pimg1">
        <div class="ptext">
            <h1 class="Intro"><strong>Farbod Jahan</strong></h1> <br>
        </div>
    </div>
  
   <div class="pimg1">
        <div class="ptext">
            <h1 class="Intro"><strong>Farbod Jahan</strong></h1> <br>
        </div>
    </div>

    <p style="padding-top:30px;">Original Image</p>
    <img src="https://www.w3schools.com/html/clouds.jpg">
 </body>