SVG 1.1 had its own font format, <font> with a <glyph> of path data per character. Firefox 555 never shipped it, Chrome 1 removed it in version 38 (2014) and SVG 2 dropped it; only Safari 10 still reads it. Use @font-face with WOFF2 as in HTML, but mind isolation: an SVG loaded as an image may fetch nothing, fonts included.
<style>body { display:flex; gap:16px; font:13px Arial; text-align:center }</style>
<script type="module">
const url = 'https://cdn.jsdelivr.net/npm/@fontsource/lobster@5.3.0/files/'
+ 'lobster-latin-400-normal.woff2';
const svg = src => `<svg xmlns="http://www.w3.org/2000/svg" width="190" height="60">
<style>@font-face { font-family:Lobster; src:url(${src}) }</style>
<text x="95" y="44" text-anchor="middle" font-family="Lobster, serif" font-size="38"
fill="#1f5f8b">BookNest</text></svg>`;
const img = src => `<img src="data:image/svg+xml,${encodeURIComponent(svg(src))}">`;
const bytes = new Uint8Array(await (await fetch(url)).arrayBuffer());
const embedded = 'data:font/woff2;base64,' + btoa(String.fromCharCode(...bytes));
for (const [html, label] of [[svg(url), 'inline SVG'], [img(url), 'img, linked font'],
[img(embedded), 'img, embedded font']])
document.body.insertAdjacentHTML('beforeend', `<div>${html}<br>${label}</div>`);
await document.fonts.ready;
await Promise.all([...document.images].map(i => i.decode()));
window.__done = true;
</script>
The inline copy loads Lobster; the image with the same url() falls back to serif; the image carrying the font as a base64 data URL (34 KB) works anywhere. Subset embedded fonts, or convert a logo's text to outlines (Inkscape's Object to Path).