Product page title CSS

Site URL: https://smilodon-cricket-9sh9.squarespace.com/

I would like to change the font of my product titles via CSS. They need to be like H1 (Font: planewalker). I have found several codes on this forum, but none of them seem to do the trick.\

Please find the screenshot attached.
 

The CSS code I used so far:

@font-face {
font-family: 'planewalker';
src: url(https://static1.squarespace.com/static/5fc6d52010d6a92a736829bd/t/5fc76b2a09f4d56e8f856ec4/1606904618945/Planewalker.otf)
}
h1 {
font-family: 'planewalker', orpheus-pro;
}
h2 {
font-family: 'planewalker', orpheus-pro;
}
h3 {
font-family: 'planewalker', orpheus-pro;
}
.collection-type-products .grid-title {
    font-family: 'planewalker';}

Your site is private. Can you setup password & share url?

https://smilodon-cricket-9sh9.squarespace.com

Password: *

Add to Home > Design > Custom CSS

h1.ProductItem-details-title {
    font-family: 'planewalker' !important;
}