/* ============================================================================ DEKLARASI @font-face — SEMUA BERKAS SUDAH DILOKALKAN KE /fonts/ ============================================================================ MENGAPA berkas ini diubah: Sebelumnya ke-12 @font-face menunjuk https://assets.elements.envato.com/... CDN itu memblokir hotlink berdasarkan header Referer, jadi begitu halaman dibuka dari domain lain (localhost maupun hosting pelanggan) browser mengembalikan net::ERR_FAILED untuk PolySans-Neutral dan PolySans-Median. Karena PolySans adalah font utama seluruh situs (body{font-family:PolySans} di base/reset.css dan seluruh token --font-family-* di base/tokens.css), kegagalan itu membuat SELURUH halaman jatuh ke Arial/Helvetica. Bukti terukur sebelum perbaikan: document.fonts -> {unloaded:10, error:2}, document.fonts.check('16px PolySans') -> false. Semua url() sekarang root-relative (/fonts/...), sehingga template mandiri dan tidak lagi bergantung pada CDN pihak ketiga mana pun. font-display: swap dipertahankan pada SETIAP face supaya teks tampil segera dengan font fallback dan tidak pernah invisible (menghindari FOIT). --------------------------------------------------------------------------- CATATAN LISENSI — WAJIB DIBACA PEMILIK SITUS --------------------------------------------------------------------------- * Montserrat : berlisensi SIL Open Font License 1.1 (bebas didistribusikan ulang bersama situs). Aman. * PolySans : font BERPEMILIK (komersial, Wallet Studio) — BUKAN open source. Berkas di /fonts/ diambil dari CDN resmi Envato agar tampilan template sama persis dengan aslinya, TETAPI mendistribusikannya ulang di situs produksi memerlukan lisensi PolySans yang sah atas nama pemilik situs. Bila Anda TIDAK memiliki lisensi PolySans, jangan pakai berkasnya. Cukup: 1. hapus tiga blok @font-face "PolySans" di bawah, dan 2. hapus dua berkas /fonts/PolySans-Neutral.woff2 dan /fonts/PolySans-Median.woff2. Situs tetap tampil rapi karena rantai fallback di base/tokens.css sudah benar ("Inter", -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif) — font sistem yang layak, bukan Times. Sebaliknya, bila ingin memasang PolySans milik Anda sendiri: letakkan PolySans-Neutral.woff2 (400) dan PolySans-Median.woff2 (600/700) hasil pembelian Anda ke folder /fonts/ dengan nama yang sama — tidak ada CSS lain yang perlu diubah. --------------------------------------------------------------------------- INVENTARIS PEMAKAIAN (hasil grep seluruh css-assets/ + seluruh *.html) --------------------------------------------------------------------------- PolySans : DIPAKAI, paling kritis. base/reset.css:454 (body) dan ke-12 token --font-family-* di base/tokens.css, plus components/plasmic.css:24. Bobot yang benar-benar diminta aturan CSS: 400 (teks umum) dan 600/700 (tebal). Montserrat : DIPAKAI oleh 4 aturan judul di components/storefront.css (.QlDUwu91/.kWrtGDhe bobot 800, .O1_3J39i/.yM7Spz2t bobot 700). Keempat kelas itu belum muncul di markup mana pun sekarang, tapi ini template — kelas judul bisa dipakai saat halaman diisi, jadi seluruh keluarga dipertahankan. Face yang tidak diminta aturan apa pun TIDAK menimbulkan request: browser hanya mengunduh face yang benar-benar dipakai. PolySansWide : DIHAPUS. Nama keluarga ini tidak dirujuk oleh satu pun aturan CSS atau elemen HTML (grep: 0 kecocokan di luar berkas ini sendiri), jadi face-nya mustahil pernah dimuat. PolySans-Bulky.woff2 sengaja tidak ikut diunduh — percuma menambah berkas mati sekaligus memperluas paparan lisensi. PolySansMono : dirujuk base/reset.css:460 untuk //
, tetapi
                   TIDAK PERNAH punya @font-face — juga di template aslinya.
                   Elemen itu memakai fallback "Courier New", yang memang wajar
                   untuk teks kode. Sengaja tidak diada-adakan.

   Satu URL asli terkorupsi find/replace "Sembako":
   montserrat-v15-latin_cyrillic-200-1Sembako81a205d0bf9eb95c5.woff2 -> HTTP 403
   permanen, hash aslinya tidak bisa dipulihkan dan HARAM ditebak. Karena
   Montserrat berlisensi OFL, bobot 200 diambil ulang dari sumber resmi Google
   Fonts (font yang sama persis, versi terbaru) dan dipecah per subset dengan
   unicode-range asli dari Google — jadi browser hanya mengunduh potongan
   aksara yang benar-benar dipakai halaman.
   ============================================================================ */

/* --- Montserrat 200 normal: pengganti sah dari Google Fonts (OFL) ---------
   Dipecah 4 subset agar halaman latin tidak ikut menarik glif Kiril.        */
@font-face {
  font-display: swap;
  font-family: Montserrat;
  font-style: normal;
  font-weight: 200;
  src: url(/fonts/montserrat-200-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}

@font-face {
  font-display: swap;
  font-family: Montserrat;
  font-style: normal;
  font-weight: 200;
  src: url(/fonts/montserrat-200-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF
}

@font-face {
  font-display: swap;
  font-family: Montserrat;
  font-style: normal;
  font-weight: 200;
  src: url(/fonts/montserrat-200-cyrillic.woff2) format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116
}

@font-face {
  font-display: swap;
  font-family: Montserrat;
  font-style: normal;
  font-weight: 200;
  src: url(/fonts/montserrat-200-cyrillic-ext.woff2) format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F
}

/* --- Montserrat sisanya: berkas asli Envato, kini disimpan lokal --------- */
@font-face {
  font-display: swap;
  font-family: Montserrat;
  font-style: italic;
  font-weight: 200;
  src: url(/fonts/montserrat-200italic.woff2) format("woff2")
}

@font-face {
  font-display: swap;
  font-family: Montserrat;
  font-style: normal;
  font-weight: 500;
  src: url(/fonts/montserrat-500.woff2) format("woff2")
}

@font-face {
  font-display: swap;
  font-family: Montserrat;
  font-style: normal;
  font-weight: 600;
  src: url(/fonts/montserrat-600.woff2) format("woff2")
}

@font-face {
  font-display: swap;
  font-family: Montserrat;
  font-style: italic;
  font-weight: 600;
  src: url(/fonts/montserrat-600italic.woff2) format("woff2")
}

/* Bobot 700 & 800 inilah yang benar-benar diminta aturan judul storefront.css */
@font-face {
  font-display: swap;
  font-family: Montserrat;
  font-style: normal;
  font-weight: 700;
  src: url(/fonts/montserrat-700.woff2) format("woff2")
}

@font-face {
  font-display: swap;
  font-family: Montserrat;
  font-style: normal;
  font-weight: 800;
  src: url(/fonts/montserrat-800.woff2) format("woff2")
}

@font-face {
  font-display: swap;
  font-family: Montserrat;
  font-style: normal;
  font-weight: 900;
  src: url(/fonts/montserrat-900.woff2) format("woff2")
}

/* --- PolySans: font utama situs. Baca CATATAN LISENSI di atas. -----------
   font-style: normal ditulis eksplisit (aslinya dibiarkan kosong) supaya
   pencocokan face tidak bergantung pada nilai default implisit.            */
@font-face {
  font-display: swap;
  font-family: PolySans;
  font-style: normal;
  font-weight: 400;
  src: url(/fonts/PolySans-Neutral.woff2) format("woff2")
}

/* 600 dan 700 sengaja memakai berkas Median yang sama — persis seperti
   template aslinya; Envato memang tidak menyediakan face 700 tersendiri. */
@font-face {
  font-display: swap;
  font-family: PolySans;
  font-style: normal;
  font-weight: 600;
  src: url(/fonts/PolySans-Median.woff2) format("woff2")
}

@font-face {
  font-display: swap;
  font-family: PolySans;
  font-style: normal;
  font-weight: 700;
  src: url(/fonts/PolySans-Median.woff2) format("woff2")
}