/**
 * FAHE Design Bridge — global stylesheet.
 *
 * These custom properties are the exact values already used across 130+
 * of the migrated content pages (verified directly from the delivered
 * HTML, not guessed) — this file just makes them available site-wide,
 * so theme/Elementor elements outside those pages (nav, footer, native
 * widgets) can share the same palette instead of falling back to
 * whatever default theme the new site happens to ship with.
 *
 * Deliberately does NOT load any external font — the migrated pages all
 * use a system-UI font stack already, so there's nothing to fetch and
 * nothing that can fail to load.
 */
:root {
	--ef-navy:   #0B2545;
	--ef-gold:   #F9A825;
	--ef-blue:   #1565C0;
	--ef-teal:   #00897B;
	--ef-muted:  #64748B;
	--ef-text:   #1E293B;
	--ef-light:  #F0F6FF;
	--ef-border: #E2E8F0;
	--ef-radius: 14px;
	--ef-shadow: 0 4px 24px rgba(11,37,69,0.10);
	--ef-shadow-hv: 0 10px 40px rgba(11,37,69,0.18);
	--ef-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ---------------------------------------------------------------------
   Base typography — applied broadly but gently. Only sets font-family
   and base color/line-height; does not touch layout, spacing, or
   anything Elementor/the theme already controls, so this can't fight
   with existing page designs.
------------------------------------------------------------------------ */
body {
	font-family: var(--ef-font);
	color: var(--ef-text);
}
h1, h2, h3, h4, h5, h6 {
	font-family: var(--ef-font);
	color: var(--ef-navy);
}
a {
	color: var(--ef-blue);
}

/* ---------------------------------------------------------------------
   Reusable component classes — the same ones already used throughout
   the migrated content (.ef-btn etc.). Defining them globally means any
   NEW page or Elementor "Custom HTML" block on faheglobal.com can reuse
   them directly without needing to re-paste this CSS every time.
------------------------------------------------------------------------ */
.ef-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--ef-font);
	font-weight: 700;
	font-size: 15px;
	padding: 12px 22px;
	border-radius: 8px;
	text-decoration: none;
	border: none;
	cursor: pointer;
	transition: background .15s ease, transform .15s ease;
}
.ef-btn--primary  { background: var(--ef-navy); color: #fff; }
.ef-btn--primary:hover  { background: #0d47a1; }
.ef-btn--gold     { background: var(--ef-gold); color: var(--ef-navy); }
.ef-btn--gold:hover     { background: #f0a500; }
.ef-btn--teal     { background: var(--ef-teal); color: #fff; }
.ef-btn--teal:hover     { background: #00695c; }
.ef-btn--outline  { background: transparent; color: var(--ef-navy); border: 1.5px solid var(--ef-navy); }
.ef-btn--outline:hover  { background: var(--ef-navy); color: #fff; }
.ef-btn--wht-out  { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,.55); }
.ef-btn--wht-out:hover  { background: rgba(255,255,255,.12); }
.ef-btn--sm { font-size: 13px; padding: 9px 16px; }
.ef-btn--lg { font-size: 16px; padding: 15px 28px; }

.ef-card {
	background: #fff;
	border: 1px solid var(--ef-border);
	border-radius: var(--ef-radius);
	box-shadow: var(--ef-shadow);
	padding: 24px;
}
.ef-card:hover { box-shadow: var(--ef-shadow-hv); }

.ef-tag {
	display: inline-block;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--ef-gold);
	margin-bottom: 8px;
}