css – Overflow content material bug once I use place sticky iOS Safari on cellular

I need to use place sticky block(first) contained in the part with two blocks. First sticky block is picture and second is any content material with white background.

DEMO hyperlink

HTML:

<part>
  <div class="first">
    <img src="https://pictures.unsplash.com/photo-1604311795833-25e1d5c128c6?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&match=crop&w=654&q=80" alt="asd">
  </div>
  <div class="second">Lorem ipsum dolor sit amet consectetur adipisicing elit. Ex voluptatum sit tempore libero, temporibus ea maxime consequatur pariatur incidunt iste.</div>
</part>

CSS:

part {
    place: relative;
    show: flex;
    flex-direction: column;
}
.first {
    place: sticky;
    high: 0;
}
img {
    max-width: 100%;
    show: block;
}
.second {
    font-size: 62px;
    z-index: 1;
    background: white;
}

It really works correctly however for iOS units in Safari we will see a part of picture. We can also detect it in a Safari cellular emulator.
screenshot-bug

If I add property overflow: hidden for mother or father part it’s going to remedy problem however place: sticky is not going to work.

Can we now have one other answer for this problem?
Thanks upfront!
Regards