Mobile Custom Fonts Getting Cut Off

Site URL: https://www.sunlovertravel.com

Hi there! I'm having an issue where my script font on mobile version is getting cut off at the top. It's only happening with the script.

This is my css code 

@font-face {
    font-family: 'Birdsong';
    src: url('https://static1.squarespace.com/static/6112da3bee7c1453530b2e0e/t/6154bb97569c3f0aa31bfaaf/1632943000008/Birdsong.woff');
}

h2 {
    font-family: 'Birdsong';
    font-weight: 500;
    color: #;
    font-style: none;
    font-size: 38px;
    letter-spacing: 0em;
    text-transform: none;
    line-height: 1em;
}

h3 {
    font-family: 'Birdsong';
    font-weight: 500;
    color: #;
    font-style: none;
    font-size: 125px;
    letter-spacing: 0em;
    text-transform: none;
    line-height: 1em;
}

I cannot figure out why this is happening, any ideas? 

It looks fine from my end. Did you solve or problem appears on iOS only?