/* ---------- Header logo as real text (replaces the PNG wordmark) ------------
 * functions.php filters the_custom_logo() so the masthead prints
 *   <a class="custom-logo-link lp-text-logo" href="/">Love Pharm</a>
 * instead of the <img>. We keep the .custom-logo-link anchor so the sticky
 * header (assets/css/header-sticky.css) and the Customizer's logo-centering
 * rules keep targeting the same element — only the inner node changes.
 *
 * ACTIVE FONT: Montserrat (set via --lp-logo-font below). All fonts are
 * self-hosted and declared here; a browser only downloads the one that's
 * actually referenced, so the unused @font-face declarations cost nothing. To
 * switch fonts, change --lp-logo-font (and the preload in functions.php). */

@font-face {
	/* Montserrat (Google Fonts), self-hosted — latin subset, VARIABLE weight file
	 * so any weight 100–900 renders from this one file (real weights, no
	 * faux-bold). Modern geometric sans. OFL: assets/fonts/OFL-Montserrat.txt. */
	font-family: "Montserrat";
	src: url("../fonts/montserrat-latin.woff2") format("woff2");
	font-weight: 100 900; /* variable range */
	font-style: normal;
	font-display: swap; /* show fallback immediately, swap in brand font (good for LCP) */
}

@font-face {
	/* Jost (Google Fonts) — kept available but not currently used. Point
	 * --lp-logo-font at it (and preload it) to switch back. Modern geometric
	 * (Futura-style) sans, VARIABLE 100–900. OFL: assets/fonts/OFL-Jost.txt. */
	font-family: "Jost";
	src: url("../fonts/jost-latin.woff2") format("woff2");
	font-weight: 100 900; /* variable range */
	font-style: normal;
	font-display: swap;
}

@font-face {
	/* Tenor Sans (Google Fonts) — kept available but not currently used. Point
	 * --lp-logo-font at it (and preload it) to switch back. Elegant humanist
	 * sans, single weight (400). OFL: assets/fonts/OFL-TenorSans.txt. */
	font-family: "Tenor Sans";
	src: url("../fonts/tenor-sans-latin.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	/* Prata (Google Fonts) — kept available but not currently used. Point
	 * --lp-logo-font at it (and preload it) to switch back. High-contrast
	 * editorial Didone serif. OFL: assets/fonts/OFL-Prata.txt. */
	font-family: "Prata";
	src: url("../fonts/prata-latin.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

/* Shared logo font — single source of truth for the wordmark family, used by
 * both the masthead text logo (below) and the mobile-drawer logo
 * (.col-full-nav::before in style.css). Switch fonts here in one place. */
:root {
	--lp-logo-font: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* The wordmark. Overrides scoped under .site-header to beat the theme's link
 * styles. Elegant all-caps display with tracking; tune font-size /
 * letter-spacing / color to taste. */
.site-header .custom-logo-link.lp-text-logo {
	display: inline-flex;
	align-items: center;
	font-family: var(--lp-logo-font);
	font-size: 28px;
	line-height: 1;
	/* Montserrat is a variable font (100–900), so this is a real designed weight,
	 * not faux-bold. Bump toward 800/900 for a fatter wordmark, or down for lighter. */
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em; /* light tracking for the all-caps wordmark */
	color: var(--lp-logo-color, #000); /* wordmark color — swap to a brand token if you want it colored */
	text-decoration: none;
	white-space: nowrap;
	/* "Love Pharm" is Latin on an RTL (he-IL) site — keep it left-to-right and
	 * isolated so the surrounding RTL context can't reorder it. */
	direction: ltr;
	unicode-bidi: isolate;
}

.site-header .custom-logo-link.lp-text-logo:hover,
.site-header .custom-logo-link.lp-text-logo:focus {
	text-decoration: none;
	color: var(--lp-logo-color, #000);
}

/* Mobile: the top bar is compact, so scale the wordmark down and tighten the
 * tracking to fit the narrow viewport (the desktop 26px/0.12em is too big/airy
 * here). Breakpoint matches the theme's mobile header (<993px). Tunable. */
@media (max-width: 992px) {
	.site-header .custom-logo-link.lp-text-logo {
		font-size: 22px;
		letter-spacing: 0.015em;
	}
}
