Change size of drop-shadow and not the actual png

Question

I´m trying to put a shadow on a frame that is a png with an image inside, and I don´t want the shadow to go over the image. Is it possible to either cut or change the size of the drop-shadow?

.grid {
  display: grid;
  }

.box8 { /*Girl*/
    grid-area: 1 / 1 / 1 / 1;
    margin: auto;
    z-index: -1;
}

.frame1 { /*Rectangular gold frame*/
    grid-area: 1 / 1 / 1 / 1;
    filter: grayscale(20%);
    margin: auto;
    -webkit-filter: drop-shadow(15px 25px 20px #222); /*Makes the shadow fit the png-image*/
    filter: drop-shadow(15px 25px 20px #222);
}

		<div class="grid">
    <div class="box8">
			<img src="https://pbs.twimg.com/profile_images/774007491130785792/hAtxoNuW_400x400.jpg" width="240" height="300">
		</div>
    
    <img class="frame1" src="https://media.overstockart.com/optimized/cache/data/frames/FR-BW223111216X20-1000x1000.png" width="250" height="350" alt="Gullramme">
    </div>

Answer 1

How about adding a second instance of the frame, putting it behind the picture, and having the drop shadow on that one? It's hacky, but it works. Something like this:

.grid {
  display: grid;
  }

.box8 { /*Girl*/
    grid-area: 1 / 1 / 1 / 1;
    margin: auto;
    z-index: -1;
}

.frame1 { /*Rectangular gold frame*/
    grid-area: 1 / 1 / 1 / 1;
    filter: grayscale(20%);
    margin: auto;
}

.frame2 { /*Rectangular gold frame*/
    grid-area: 1 / 1 / 1 / 1;
    filter: grayscale(20%);
    margin: auto;
    -webkit-filter: drop-shadow(15px 25px 20px #222); /*Makes the shadow fit the png-image*/
    filter: drop-shadow(15px 25px 20px #222);
    z-index:-2;
}

<div class="grid">
    <div class="box8">
			<img src="https://pbs.twimg.com/profile_images/774007491130785792/hAtxoNuW_400x400.jpg" width="240" height="300">
		</div>
    <img class="frame1" src="https://media.overstockart.com/optimized/cache/data/frames/FR-BW223111216X20-1000x1000.png" width="250" height="350" alt="Gullramme">
    <img class="frame2" src="https://media.overstockart.com/optimized/cache/data/frames/FR-BW223111216X20-1000x1000.png" width="250" height="350" alt="Gullramme">
</div>