/* ViumbiEats system typography Body / base (~60%): Jost | Headings & titles (~40%): Poppins Self-hosted (no external CDN). Files in ../fonts/{jost,poppins}/ */ /* ---------- Jost ---------- */ @font-face { font-family:'Jost'; font-style:normal; font-weight:300; font-display:swap; src:url('../fonts/jost/Jost-Light.ttf') format('truetype'); } @font-face { font-family:'Jost'; font-style:normal; font-weight:400; font-display:swap; src:url('../fonts/jost/Jost-Regular.ttf') format('truetype'); } @font-face { font-family:'Jost'; font-style:normal; font-weight:500; font-display:swap; src:url('../fonts/jost/Jost-Medium.ttf') format('truetype'); } @font-face { font-family:'Jost'; font-style:normal; font-weight:600; font-display:swap; src:url('../fonts/jost/Jost-SemiBold.ttf') format('truetype'); } @font-face { font-family:'Jost'; font-style:normal; font-weight:700; font-display:swap; src:url('../fonts/jost/Jost-Bold.ttf') format('truetype'); } /* ---------- Poppins ---------- */ @font-face { font-family:'Poppins'; font-style:normal; font-weight:300; font-display:swap; src:url('../fonts/poppins/Poppins-Light.ttf') format('truetype'); } @font-face { font-family:'Poppins'; font-style:normal; font-weight:400; font-display:swap; src:url('../fonts/poppins/Poppins-Regular.ttf') format('truetype'); } @font-face { font-family:'Poppins'; font-style:normal; font-weight:500; font-display:swap; src:url('../fonts/poppins/Poppins-Medium.ttf') format('truetype'); } @font-face { font-family:'Poppins'; font-style:normal; font-weight:600; font-display:swap; src:url('../fonts/poppins/Poppins-SemiBold.ttf') format('truetype'); } @font-face { font-family:'Poppins'; font-style:normal; font-weight:700; font-display:swap; src:url('../fonts/poppins/Poppins-Bold.ttf') format('truetype'); } /* ---------- Legacy alias: anything still asking for 'Open Sans' renders Jost ---------- */ @font-face { font-family:'Open Sans'; font-style:normal; font-weight:400; font-display:swap; src:url('../fonts/jost/Jost-Regular.ttf') format('truetype'); } @font-face { font-family:'Open Sans'; font-style:normal; font-weight:500; font-display:swap; src:url('../fonts/jost/Jost-Medium.ttf') format('truetype'); } @font-face { font-family:'Open Sans'; font-style:normal; font-weight:600; font-display:swap; src:url('../fonts/jost/Jost-SemiBold.ttf') format('truetype'); } @font-face { font-family:'Open Sans'; font-style:normal; font-weight:700; font-display:swap; src:url('../fonts/jost/Jost-Bold.ttf') format('truetype'); } /* ---------- Apply across the system ---------- */ :root { --bs-font-sans-serif: 'Jost', sans-serif; --body-fonts: 'Jost', sans-serif; --heading-fonts: 'Poppins', sans-serif; } /* Base / body (~60%) -> Jost. We only set it on ; everything inherits it. Icon fonts (Font Awesome, icon-set/tio) declare their own font-family on the icon element, so they are NOT affected by inheritance and keep rendering correctly. Any legacy element still asking for 'Open Sans' also renders Jost via the alias @font-face above. */ body { font-family: 'Jost', sans-serif !important; } /* Headings & titles (~40%) -> Poppins. !important beats theme rules regardless of specificity; icons inside a title are child elements and keep their font. */ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .page-header-title, .page-title, .card-title, .card-header-title, .modal-title, .navbar-brand, .nav-subtitle, .display-1, .display-2, .display-3, .display-4, .auth-content .title { font-family: 'Poppins', sans-serif !important; }