Hi! I am also having a similar issue with my custom font 'Botanica'. It works fine on desktop but does not show up correctly on mobile or tablet. Here is my website URL and code snippet below:
www.gonzalezcaicedowedding.com
@font-face {
font-family: 'Brown Sugar';
src: url('https://static1.squarespace.com/static/641377c923334d1a80dffdeb/t/64d1b0ce22c9037a026c2f97/1691463887061/Brown+Sugar+.ttf');
}
@font-face {
font-family: 'Brown Sugar';
src: url('https://static1.squarespace.com/static/641377c923334d1a80dffdeb/t/64d1b0ce22c9037a026c2f97/1691463887061/Brown+Sugar+.ttf');
}
@font-face {
font-family: 'Brown Sugar';
src: url('https://static1.squarespace.com/static/641377c923334d1a80dffdeb/t/64d1b0ce22c9037a026c2f97/1691463887061/Brown+Sugar+.ttf');
}
h1 {
font-family: 'Brown Sugar' !important;
letter-spacing: .05em;
}
h2 {
font-family: 'Brown Sugar' !important;
}
h3, h4 {
font-family: 'Botanica'
!important;
}
p, {
font-family: 'josefin sans'
!important;
}
.header-title-text, .header-menu-nav-item--collection {
font-family: 'Brown Sugar' !important;
}
.portfolio-hover-item-content {
font-family: 'Botanica'
!important;
letter-spacing: .5px;
font-size: 40px;
}
