/**
 * Theme Design Tokens – Single source of truth for fonts and colors.
 * Change these values (or via Customizer) to affect the entire site.
 * Loaded first so all other stylesheets can use these variables.
 *
 * Font: Poppins loaded via Google Fonts in functions.php
 * https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap
 */

:root {
	/* ========== COLORS ========== */
	/* Primary brand – buttons, links, accents (yellow/orange) */
	--primary-color: #f0a402;
	--primary-color-dark: #d99300;
	--primary-color-light: #ffc107;

	/* Header / menu bar */
	--header-bar-bg: #f0a402;
	--header-bar-border: #f0a402;
	--menu-text: #ffffff;
	--menu-text-hover: #000000;
	--menu-text-active: #ffffff;

	/* Body text and backgrounds (optional overrides) */
	--color-text: #222529;
	--color-text-muted: #696969;
	--color-heading: #222529;
	--color-body-bg: #fff;

	/* Homepage: benefits strip (dark bar below hero) */
	--benefits-strip-bg: #222529;
	--benefits-strip-text: #fff;

	/* ========== FONTS ========== */
	/* Poppins for entire site - loaded via Google Fonts */
	--font-body: 'Poppins', sans-serif;
	--font-heading: 'Poppins', sans-serif;
	--shop-font-family: 'Poppins', sans-serif;
}

/* ========== Global font application ========== */
body,
input,
textarea,
select,
button {
	font-family: var(--font-body);
}

h1, h2, h3, h4, h5, h6,
.btn,
.button,
.product-title,
.entry-title,
.widget-title,
.breadcrumb,
.main-nav .menu > li > a {
	font-family: var(--font-heading);
}