:root { /* Global font switcher Change the site-wide font by editing ONE attribute: public/index.html -> Available values: - baby-valentine - alphabet-valentine - inter */ /* Default (will be overridden by html[data-font="..."] below) */ --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; --font-heading: var(--font-sans); --font-body: var(--font-sans); } /* Baby Valentine (OTF) */ @font-face { font-family: "BabyValentine"; src: url("/fonts/BabyValentine.otf") format("opentype"), url("/fonts/@BabyValentine.otf") format("opentype"), url("/fonts/Baby%20Valentine.otf") format("opentype"); font-weight: 400; font-style: normal; font-display: swap; } /* Alphabet Valentine (WOFF) */ @font-face { font-family: "AlphabetValentine"; src: url("/fonts/AlphabetValentine.woff") format("woff"), url("/fonts/@AlphabetValentine.woff") format("woff"); font-weight: 400; font-style: normal; font-display: swap; } html[data-font="baby-valentine"] { --font-sans: "BabyValentine", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; --font-heading: var(--font-sans); --font-body: var(--font-sans); } html[data-font="alphabet-valentine"] { --font-sans: "AlphabetValentine", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; --font-heading: var(--font-sans); --font-body: var(--font-sans); } html[data-font="inter"] { --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; --font-heading: var(--font-sans); --font-body: var(--font-sans); }