CORS Policy Blocking Custom Font

Hey team!

Having an issue with CORS blocking a custom font on our deployed page. The font displays perfectly in preview/edit modes (navbar, headings and buttons). However, on the deployed page were getting these errors: 

www.buddycreative.com.au/:1 Access to font at 'https://static1.squarespace.com/static/64d45d3380d2950c5ad0d949/t/65c0b64d2fa0a6617b387154/1707128397244/Acorn-Medium.otf' from origin 'https://www.buddycreative.com.au' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
site.css:1 
 
       GET https://static1.squarespace.com/static/64d45d3380d2950c5ad0d949/t/65c0b64d2fa0a6617b387154/1707128397244/Acorn-Medium.otf net::ERR_FAILED 404 (Not Found)

Would love some input if possible! I had a look into trying to configure CDN settings to resolve the issue but no luck - Squarespace is pretty new territory for me.

Here's the custom CSS at current:

/* Define custom font */
@font-face {
    font-family: 'Acorn-Medium';
    src: url('https://static1.squarespace.com/static/64d45d3380d2950c5ad0d949/t/65c0b64d2fa0a6617b387154/1707128397244/Acorn-Medium.otf');
}

/* Apply custom font to heading elements */
h1, h2, h3, h4 {
    font-family: 'Acorn-Medium' !important;
    overflow-x: hidden; /* Add a valid value for overflow-x, like 'hidden' or 'scroll' */
}

/* Apply custom font to navigation links */
.header-nav a {
    font-family: 'Acorn-Medium', sans-serif !important;
    font-size: 20px;
}

body .sqs-block-button-element {
    font-family: 'Acorn-Medium', sans-serif !important;
}

/* Gallery grid styles */
.gallery-grid-wrapper {
    display: flex;
    animation: slideshow 30s linear infinite;
}

.gallery-grid-wrapper .gallery-grid-item {
    min-width: 50%;
    margin-right: 5%;
}

/* Keyframes for gallery grid slideshow animation */
@keyframes slideshow {
    0%    { left: 0; }
    100%  { left: -225%; }

Cheers all!

Perfect! Thanks so much for your help