/* Everest Custom Elements — tokens.css (EHF 1.4.0, handle ehf-tokens)
   Single source of design tokens. Registered first, enqueued on every front-end request;
   every other EHF style handle depends on it. Binding spec: generated/_design/decisions.md.
   Kit post 6 and every _elementor_page_settings stay untouched: tokens live here only.
   Every var() consumer in the other EHF files carries a literal fallback, so a missing
   tokens.css degrades to today's look. */

/* ---- 1.2 Colour (all values already used on the site) -------------------------------- */
:root {
	/* brand */
	--ehf-c-primary: #0b6993;       /* buttons, links, eyebrows, icons (5.9:1 on white) */
	--ehf-c-primary-700: #084f70;   /* hover, pressed, dark-band mid */
	--ehf-c-primary-900: #063a52;   /* dark band end, text on white chips */
	--ehf-c-accent: #17a2c9;        /* decorative only: gradients, accent bar. NEVER text, NEVER focus ring */
	/* tints: one alt-section background (#F4F6F8 / #F7FBFD / #f4f8fa merge into tint-50) */
	--ehf-c-tint-50: #f4f8fa;
	--ehf-c-tint-100: #eaf4f9;      /* icon halo, chip bg, tab bar, location-hero gradient start */
	--ehf-c-tint-200: #dcedf5;      /* chip border, dividers on tint */
	/* neutrals */
	--ehf-c-ink: #111827;           /* headings */
	--ehf-c-body: #5c6570;          /* body copy (4.9:1 on white, 4.6:1 on tint-50) */
	--ehf-c-line: #e5e7eb;          /* card borders, hairlines */
	--ehf-c-surface: #ffffff;
	/* dark */
	--ehf-c-on-dark: #ffffff;
	--ehf-c-on-dark-muted: #bfe0ee; /* utility-bar text colour */
	--ehf-c-footer-base: #0b1220;   /* footer bottom bar */
	--ehf-g-dark: linear-gradient(160deg, #0b6993 0%, #084f70 55%, #063a52 100%);
	--ehf-g-dark-photo: linear-gradient(90deg, rgba(6, 58, 82, 0.94) 0%, rgba(6, 58, 82, 0.84) 45%, rgba(6, 58, 82, 0.6) 100%);
	--ehf-g-hero-tint: linear-gradient(180deg, #eaf4f9 0%, #f4f8fa 65%, #ffffff 100%);
}

/* ---- 1.3 Typography ------------------------------------------------------------------- */
:root {
	--ehf-ff-head: "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;
	--ehf-ff-body: "Nunito Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	--ehf-fs-display: clamp(2.125rem, 1.707rem + 1.714vw, 3.25rem);   /* H1 34-52, w800, lh 1.1  */
	--ehf-fs-h2: clamp(1.75rem, 1.518rem + 0.952vw, 2.375rem);        /* 28-38, w800, lh 1.15    */
	--ehf-fs-h3: clamp(1.1875rem, 1.118rem + 0.286vw, 1.375rem);      /* 19-22, w700, lh 1.3     */
	--ehf-fs-h4: clamp(1.0625rem, 1.039rem + 0.095vw, 1.125rem);      /* 17-18, w700, lh 1.35    */
	--ehf-fs-lead: clamp(1.125rem, 1.079rem + 0.19vw, 1.25rem);       /* 18-20, w400, lh 1.55    */
	--ehf-fs-body: clamp(1rem, 0.977rem + 0.095vw, 1.0625rem);        /* 16-17, w400, lh 1.65    */
	--ehf-fs-small: clamp(0.875rem, 0.852rem + 0.095vw, 0.9375rem);   /* 14-15, w400, lh 1.5     */
	--ehf-fs-eyebrow: clamp(0.75rem, 0.727rem + 0.095vw, 0.8125rem);  /* 12-13, w800, uppercase, ls .08em */
	--ehf-prose: 68ch;
}

/* Critic A10: the kit "Text" font is Noto Sans Hanunoo (wrong face). Override only the CSS
   variable value on the kit body class (specificity beats .elementor-kit-6); the kit is not edited. */
body.elementor-kit-6 {
	--e-global-typography-text-font-family: "Nunito Sans";
	--e-global-typography-text-font-weight: 400;
}

html body {
	font-family: var(--ehf-ff-body);
}

/* ---- 1.4 Spacing (8-pt) ----------------------------------------------------------------- */
:root {
	--ehf-s-1: 8px;
	--ehf-s-2: 16px;
	--ehf-s-3: 24px;
	--ehf-s-4: 32px;
	--ehf-s-5: 48px;
	--ehf-s-6: 64px;
	--ehf-s-7: 96px;
	--ehf-pad-section: clamp(3.5rem, 2.943rem + 2.286vw, 5rem);   /* 56-80 top and bottom */
	--ehf-pad-tight: clamp(2rem, 1.814rem + 0.762vw, 2.5rem);     /* 32-40 */
	--ehf-pad-hero-t: clamp(2rem, 1.257rem + 3.048vw, 4rem);      /* 32-64 */
	--ehf-pad-hero-b: clamp(3rem, 2.443rem + 2.286vw, 4.5rem);    /* 48-72 */
	--ehf-gutter: 24px;
	--ehf-gap-grid: 24px;
	--ehf-gap-stack: 16px;
	--ehf-gap-inline: 12px;
}

@media (max-width: 480px) {
	:root {
		--ehf-gutter: 16px;
	}
}

/* ---- 1.5 Containers ------------------------------------------------------------------------ */
:root {
	--ehf-container: 1200px;
	--ehf-container-narrow: 800px;
}

/* G3 interim: stock boxed containers follow the EHF edge without editing the kit. Not in the editor. */
body:not(.elementor-editor-active) .e-con {
	--container-max-width: var(--ehf-container);
}

.ehf-container {
	max-width: var(--ehf-container);
	margin-inline: auto;
	padding-inline: var(--ehf-gutter);
}

.ehf-container--narrow {
	max-width: var(--ehf-container-narrow);
}

/* ---- 1.6 Radius, shadow, border, motion ------------------------------------------------------ */
:root {
	--ehf-r-sm: 8px;       /* inputs, square chips */
	--ehf-r-md: 12px;      /* buttons, small cards, FAQ items */
	--ehf-r-lg: 16px;      /* cards, images, panels */
	--ehf-r-pill: 999px;
	--ehf-shadow-1: 0 1px 2px rgba(17, 24, 39, 0.06);     /* resting card */
	--ehf-shadow-2: 0 8px 24px rgba(11, 41, 61, 0.1);     /* hover / raised / pinned bars */
	--ehf-border: 1px solid var(--ehf-c-line);
	--ehf-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
	--ehf-dur: 180ms;
}

/* ---- 3.6 Header height (header.js overwrites --ehf-header-h; these are the no-JS fallbacks) ---- */
:root {
	--ehf-header-h: 108px;
	--ehf-subnav-h: 0px;
}

@media (max-width: 1024px) {
	:root {
		--ehf-header-h: 100px;
	}
}

.ehf-anchor-target {
	scroll-margin-top: calc(var(--ehf-header-h) + var(--ehf-subnav-h) + 16px);
}

/* ---- 1.7 Focus ring (solid 2px, 3px offset; white on dark) ------------------------------------- */
:root {
	--ehf-focus-color: #0b6993;
}

.ehf-scope :focus-visible,
.ehf-btn:focus-visible,
.ehf-cta:focus-visible {
	outline: 2px solid var(--ehf-focus-color);
	outline-offset: 3px;
}

.ehf-on-dark :focus-visible,
.ehf-on-dark.ehf-scope:focus-visible {
	--ehf-focus-color: #ffffff;
}

/* ---- 1.8 Buttons: one family -------------------------------------------------------------------- */
.ehf-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	box-sizing: border-box;
	min-height: 48px;
	padding: 14px 24px;
	border: 1px solid transparent;
	border-radius: var(--ehf-r-md);
	font-family: var(--ehf-ff-head);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--ehf-dur) var(--ehf-ease), color var(--ehf-dur) var(--ehf-ease), box-shadow var(--ehf-dur) var(--ehf-ease), border-color var(--ehf-dur) var(--ehf-ease);
}

.ehf-btn svg {
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ehf-btn--primary,
.ehf-btn--primary:link,
.ehf-btn--primary:visited {
	background: var(--ehf-c-primary);
	color: #ffffff;
}

.ehf-btn--primary:hover,
.ehf-btn--primary:focus-visible,
.ehf-btn--primary:active {
	background: var(--ehf-c-primary-700);
	color: #ffffff;
	box-shadow: var(--ehf-shadow-2);
}

.ehf-btn--secondary,
.ehf-btn--secondary:link,
.ehf-btn--secondary:visited {
	background: #ffffff;
	border-color: var(--ehf-c-primary);
	color: var(--ehf-c-primary);
}

.ehf-btn--secondary:hover,
.ehf-btn--secondary:focus-visible,
.ehf-btn--secondary:active {
	background: var(--ehf-c-tint-100);
	color: var(--ehf-c-primary-700);
	border-color: var(--ehf-c-primary-700);
}

.ehf-btn--on-dark,
.ehf-btn--on-dark:link,
.ehf-btn--on-dark:visited {
	background: #ffffff;
	color: var(--ehf-c-primary-900);
}

.ehf-btn--on-dark:hover,
.ehf-btn--on-dark:focus-visible,
.ehf-btn--on-dark:active {
	background: var(--ehf-c-tint-100);
	color: var(--ehf-c-primary-900);
}

.ehf-btn--ghost-on-dark,
.ehf-btn--ghost-on-dark:link,
.ehf-btn--ghost-on-dark:visited {
	background: transparent;
	border-color: #ffffff;
	color: #ffffff;
}

.ehf-btn--ghost-on-dark:hover,
.ehf-btn--ghost-on-dark:focus-visible,
.ehf-btn--ghost-on-dark:active {
	background: rgba(255, 255, 255, 0.14);
	color: #ffffff;
}

/* Text link: primary 700 with an arrow added in markup, underline on hover. */
.ehf-link {
	color: var(--ehf-c-primary);
	font-weight: 700;
	text-decoration: none;
}

.ehf-link:hover,
.ehf-link:focus-visible {
	color: var(--ehf-c-primary-700);
	text-decoration: underline;
}

/* G9: stock Button widget (.elementor-widget-button) follows .ehf-btn--primary. Never targets
   .elementor-widget-form, so form 7e41870 on 1473 keeps its look (R5). Element-level settings
   (higher specificity) still win, so deliberately styled buttons are not overridden. */
body .elementor-widget-button .elementor-button {
	box-sizing: border-box;
	min-height: 48px;
	padding: 14px 24px;
	border-radius: var(--ehf-r-md);
	background-color: var(--ehf-c-primary);
	color: #ffffff;
	font-family: var(--ehf-ff-head);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	fill: #ffffff;
	transition: background-color var(--ehf-dur) var(--ehf-ease), box-shadow var(--ehf-dur) var(--ehf-ease);
}

body .elementor-widget-button .elementor-button:hover,
body .elementor-widget-button .elementor-button:focus-visible {
	background-color: var(--ehf-c-primary-700);
	color: #ffffff;
	box-shadow: var(--ehf-shadow-2);
}

/* ---- 8. Protected templates (461 / 2846 blog archive, 475 blog single, 2371 404) ---------------------
   Their Elementor data stays untouched; styling reaches them only through scoped CSS here.
   Allowed: body text, heading faces and scale, buttons (above), post column measure. Nothing else. */
body.elementor-page-461,
body.single-post.elementor-page-475,
body.error404.elementor-page-2371 {
	font-family: var(--ehf-ff-body);
	color: var(--ehf-c-body);
}

body.single-post.elementor-page-475 .elementor-widget-theme-post-content .elementor-widget-container {
	max-width: var(--ehf-prose);
	font-size: var(--ehf-fs-body);
	line-height: 1.65;
	color: var(--ehf-c-body);
}

body.single-post.elementor-page-475 .elementor-widget-theme-post-content :is(h2, h3, h4) {
	font-family: var(--ehf-ff-head);
	color: var(--ehf-c-ink);
}

body.single-post.elementor-page-475 .elementor-widget-theme-post-content h2 {
	font-size: var(--ehf-fs-h2);
	font-weight: 800;
	line-height: 1.15;
}

body.single-post.elementor-page-475 .elementor-widget-theme-post-content h3 {
	font-size: var(--ehf-fs-h3);
	font-weight: 700;
	line-height: 1.3;
}

body.single-post.elementor-page-475 .elementor-widget-theme-post-content h4 {
	font-size: var(--ehf-fs-h4);
	font-weight: 700;
	line-height: 1.35;
}

/* ---- Rebuilt pages: EHF widgets sit at the Elementor root (decisions 1.9 rule 6). Elementor's default 20px
   widget gap would put a white strip between full-bleed sections, so root EHF widgets butt together. ---- */
.elementor > .elementor-widget[class*="elementor-widget-everest_"] {
	margin-block-end: 0;
}

/* ---- Utilities ----------------------------------------------------------------------------------------- */
.ehf-visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

@media (prefers-reduced-motion: reduce) {
	.ehf-btn,
	.ehf-scope * {
		transition-duration: 0.001ms !important;
	}
}
