/*
 * Let Elementor's editable global font families feed the theme's typography
 * tokens. Component sizes and spacing stay responsive; widget typography
 * controls can still emit their own font declarations normally.
 */
.elementor {
	--font-heading: var(--e-global-typography-primary-font-family, 'Bricolage Grotesque'), ui-sans-serif, sans-serif;
	--font-secondary: var(--e-global-typography-secondary-font-family, 'Bricolage Grotesque'), ui-sans-serif, sans-serif;
	--font-body: var(--e-global-typography-text-font-family, 'IBM Plex Mono'), ui-monospace, monospace;
	--font-accent: var(--e-global-typography-accent-font-family, 'IBM Plex Mono'), ui-monospace, monospace;
	--font-weight-heading: var(--e-global-typography-primary-font-weight, 700);
	--font-weight-secondary: var(--e-global-typography-secondary-font-weight, 600);
	--font-weight-body: var(--e-global-typography-text-font-weight, 500);
	--font-weight-accent: var(--e-global-typography-accent-font-weight, 600);
}

/* Secondary headings resolve the Secondary family even inside a component
 * whose default declaration uses --font-heading. No font property is forced. */
.elementor :where(h2, h3, h4, h5, h6) {
	--font-heading: var(--font-secondary);
}

/* Native Elementor buttons use the Accent family without changing their
 * layout or competing with an explicit widget-level typography declaration. */
.elementor :where(.elementor-widget-button) {
	--font-body: var(--font-accent);
}

/* The large editorial statement uses Primary; ordinary subheadings use Secondary. */
.elementor .sj-home-story-heading :where(h2) {
	--font-heading: var(--e-global-typography-primary-font-family, 'Bricolage Grotesque'), ui-sans-serif, sans-serif;
}
:where(.sj-home-page .sj-home-section) :is(.sj-home-section-title, .sj-home-card-title, .sj-home-service-title, .sj-home-rate) .elementor-heading-title,
.sj-pricing-page :is(.sj-pricing-section-title, .sj-pricing-principle-title, .sj-pricing-question) .elementor-heading-title {
	font-weight: var(--font-weight-secondary);
}
.sj-home-hero .sj-home-title .elementor-heading-title,
:where(.sj-home-page) .sj-home-story-heading .sj-home-section-title .elementor-heading-title,
.sj-pricing-page .sj-pricing-title .elementor-heading-title,
.sj-pricing-page .sj-pricing-price .elementor-heading-title {
	font-weight: var(--font-weight-heading);
}
.elementor .elementor-widget-button .elementor-button { font-weight: var(--font-weight-accent); }

/* Body copy follows the same scale in native pages and Elementor widgets. */
.elementor .elementor-widget-text-editor { font-size: var(--font-size-body); font-weight: var(--font-weight-body); }
