/* ==========================================================================
   Sapience header – white version
   Desktop ≥1200px: top bar + main bar + mega menus + sticky bar
   Below 1200px: compact bar with call + menu buttons, full-screen menu
   ========================================================================== */

.sp-header {
	--sp-navy: #0d1625;
	--sp-navy-line: #253044;
	--sp-gold: #958357;
	--sp-gold-dark: #7d6d46;   /* gold for small text on white (readable contrast) */
	--sp-gold-soft: #c7ba95;
	--sp-cream: #f7f3eb;
	--sp-text: #505967;
	--sp-border: #dfe2e5;
	--sp-border-warm: #ded9cd;
	--sp-top-h: 46px;
	--sp-main-h: 96px;
	--sp-stuck-h: 72px;
	--sp-mobile-h: 72px;
	--sp-ease: cubic-bezier(.2, .7, .2, 1);

	position: relative;
	z-index: 1000;
	font-family: 'Rubik', -apple-system, 'Segoe UI', Arial, sans-serif;
	color: var(--sp-navy);
}

/* Reset theme styles inside the header */
.sp-header *,
.sp-header *::before,
.sp-header *::after { box-sizing: border-box; }
.sp-header ul { list-style: none; margin: 0; padding: 0; }
.sp-header li { margin: 0; padding: 0; }
.sp-header p { margin: 0; }
.sp-header a { text-decoration: none !important; transition: color .2s, background-color .2s; }
.sp-header button { font-family: inherit; line-height: inherit; cursor: pointer; margin: 0; }
.sp-header img { max-width: none; }
.sp-header :focus-visible { outline: 2px solid var(--sp-gold); outline-offset: 3px; }

.sp-ico { width: 15px; height: 15px; flex: none; display: block; }

.sp-sr-only {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.sp-skip {
	position: absolute; left: 16px; top: -60px; z-index: 1100;
	background: var(--sp-navy); color: #fff !important; padding: 10px 16px; font-size: 14px;
}
.sp-skip:focus { top: 8px; }

.sp-container {
	max-width: 1200px;
	height: 100%;
	margin: 0 auto;
	padding: 0 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

/* ---------- Top bar ---------- */
.sp-topbar {
	height: var(--sp-top-h);
	background: var(--sp-navy);
	font-size: 14px;
}
.sp-topbar__list { display: flex; align-items: center; gap: 34px; }
.sp-topbar a { color: #dfe2e5; display: inline-flex; align-items: center; gap: 9px; }
.sp-topbar a .sp-ico { color: var(--sp-gold); }
.sp-topbar a:hover { color: var(--sp-gold-soft); }
.sp-topbar__right { display: flex; align-items: center; gap: 20px; }
.sp-topbar__loc {
	font-size: 11px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase;
	color: var(--sp-gold-soft);
}
.sp-topbar__divider { width: 1px; height: 16px; background: var(--sp-navy-line); }
.sp-topbar .sp-social { color: #fff; }
.sp-topbar .sp-social .sp-ico { color: currentColor; }

/* ---------- Main bar ---------- */
.sp-main-wrap { height: var(--sp-main-h); }
.sp-main {
	position: relative;
	height: var(--sp-main-h);
	background: #fff;
	border-bottom: 1px solid var(--sp-border);
}
.sp-logo { display: flex; align-items: center; flex: none; }
.sp-logo img { display: block; height: 60px; width: auto; transition: height .25s var(--sp-ease); }

/* Navigation */
.sp-nav { height: 100%; margin-inline-start: auto; margin-inline-end: 52px; }
.sp-nav__list { display: flex; align-items: stretch; gap: 24px; height: 100%; }
.sp-nav__item { display: flex; align-items: center; }   /* static: mega panel aligns to .sp-main */

.sp-nav__link {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	height: 100%;
	padding: 0;
	background: none;
	border: 0;
	color: var(--sp-navy);
	font-size: 15px;
	font-weight: 500;
	letter-spacing: .04em;
	text-transform: uppercase;
	white-space: nowrap;
}
.sp-nav__link::after {
	content: "";
	position: absolute;
	inset-inline: 0;
	bottom: calc(50% - 21px);
	height: 2px;
	background: var(--sp-gold);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .25s var(--sp-ease);
}
.sp-nav__toggle--icon {
	display: inline-flex; align-items: center; height: 100%;
	padding: 0 0 0 7px; background: none; border: 0; color: var(--sp-navy);
}
.sp-ico--chev { width: 11px; height: 11px; transition: transform .25s var(--sp-ease); }

.sp-nav__item:hover > .sp-nav__link,
.sp-nav__item:hover > .sp-nav__toggle--icon,
.sp-nav__item.is-current > .sp-nav__link,
.sp-nav__item.is-current > .sp-nav__toggle--icon,
.sp-nav__item.is-open > .sp-nav__link,
.sp-nav__item.is-open > .sp-nav__toggle--icon { color: var(--sp-gold-dark); }

.sp-nav__item.is-current > .sp-nav__link::after,
.sp-nav__item.is-open > .sp-nav__link::after { transform: scaleX(1); }

.sp-nav__item.is-open .sp-ico--chev { transform: rotate(180deg); }

/* Button */
.sp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	flex: none;
	padding: 15px 26px;
	border-radius: 2px;
	background: var(--sp-gold);
	color: #fff !important;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.2;
	white-space: nowrap;
}
.sp-btn:hover { background: var(--sp-gold-dark);color: #fff !important; }
.sp-ico--arrow { width: 16px; height: 16px; transition: transform .2s var(--sp-ease); }
.sp-btn:hover .sp-ico--arrow { transform: translateX(3px); }

.sp-mobile-actions { display: none; }

/* ---------- Mega menus ---------- */
.sp-mega {
	position: absolute;
	inset-inline: 0;
	top: 100%;
	background: #fff;
	border-top: 2px solid var(--sp-gold);
	box-shadow: 0 24px 40px -20px rgba(13, 22, 37, .35);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity .2s, transform .2s var(--sp-ease), visibility 0s .2s;
}
.sp-nav__item.is-open > .sp-mega {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: opacity .2s, transform .2s var(--sp-ease), visibility 0s;
}
.sp-mega__inner { max-width: 1460px; margin: 0 auto; padding: 40px 24px 44px; }

.sp-mega__inner--services {
	display: grid;
	grid-template-columns: 1.3fr 1fr 1fr 1.15fr;
	gap: 48px;
}
.sp-mega__title {
	display: inline-block;
	margin-bottom: 10px;
	color: var(--sp-navy);
	font-size: 22px;
	font-weight: 500;
	line-height: 1.25;
}
.sp-mega__desc { color: var(--sp-text); font-size: 14px; line-height: 1.6; }
.sp-mega__sub {
	display: grid;
	gap: 10px;
	margin-top: 18px !important;
	padding-top: 16px !important;
	border-top: 1px solid var(--sp-border-warm);
}
.sp-mega__sub a,
.sp-sectors a { color: var(--sp-navy); font-size: 15px; font-weight: 500; }
.sp-mega a:hover { color: var(--sp-gold-dark); }

/* Case study card */
.sp-case {
	display: flex;
	flex-direction: column;
	background: var(--sp-navy);
	color: #fff;
	overflow: hidden;
}
.sp-case__img { display: block; width: 100%; height: 120px; object-fit: cover; }
.sp-case__body { display: flex; flex-direction: column; gap: 12px; padding: 24px 26px 26px; flex: 1; }
.sp-case__label {
	font-size: 11px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase;
	color: var(--sp-gold-soft);
}
.sp-case__title { font-size: 18px; font-weight: 400; line-height: 1.35; color: #fff; }
.sp-case__more {
	display: inline-flex; align-items: center; gap: 8px; margin-top: auto;
	font-size: 13px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
	color: var(--sp-gold-soft);
}
.sp-mega a.sp-case:hover { color: #fff; }
.sp-case:hover .sp-case__more .sp-ico--arrow { transform: translateX(3px); }

/* Sectors */
.sp-mega__inner--sectors { display: grid; grid-template-columns: 300px 1fr; gap: 64px; }
.sp-mega__heading { font-size: 26px; font-weight: 500; line-height: 1.25; color: var(--sp-navy); margin-bottom: 12px !important; }
.sp-mega__all {
	display: inline-flex; align-items: center; gap: 8px; margin-top: 20px;
	color: var(--sp-gold-dark); font-size: 13px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
}
.sp-sectors {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	column-gap: 40px;
	align-content: start;
}
.sp-sectors a { display: block; padding: 14px 0; border-bottom: 1px solid var(--sp-border-warm); }

/* ---------- Sticky bar (desktop) ---------- */
.sp-header.is-stuck .sp-main {
	position: fixed;
	top: 0;
	inset-inline: 0;
	height: var(--sp-stuck-h);
	box-shadow: 0 8px 22px -10px rgba(13, 22, 37, .35);
	transform: translateY(-110%);
	transition: transform .3s var(--sp-ease);
}
.sp-header.is-stuck.is-up .sp-main,
.sp-header.is-stuck .sp-main:has(.is-open) {
	transform: none;
}
.sp-header.is-stuck .sp-logo img { height: 60px; }
.sp-header.is-stuck .sp-nav__link::after { bottom: calc(50% - 17px); }
.sp-header.is-stuck .sp-btn--header { padding: 12px 22px; font-size: 14px; }
body.admin-bar .sp-header.is-stuck .sp-main { top: 32px; }

@keyframes sp-slide-in {
	from { transform: translateY(-100%); }
	to { transform: none; }
}

/* Tighter spacing on smaller desktops */
@media (min-width: 1200px) {
	.sp-logo img { height: 60px; }
	.sp-nav { margin-inline-end: 28px; }
	.sp-nav__list { gap: 22px; }
	.sp-nav__link { font-size: 14px; letter-spacing: .02em; }
	.sp-btn--header { padding: 13px 20px; font-size: 14px; }
	.sp-mega__inner { max-width: 1200px; }
	.sp-mega__inner--services { gap: 32px; }
}
@media (max-width: 1399px) {
	.sp-nav { margin-inline-end: 28px; }
	.sp-nav__list { gap: 24px; }
	.sp-nav__link { font-size: 14px; letter-spacing: .02em; }
	.sp-logo img { height: 60px; }
	.sp-mega__inner--services { gap: 32px; }
}

/* ---------- Mobile menu (drawer) ---------- */
.sp-drawer { display: none; }
/* Compact desktop (992px – 1199px) */
@media (min-width: 992px) and (max-width: 1199px) {
	.sp-container { padding: 0 15px; max-width: 100%; }
	.sp-logo img,
	.sp-header.is-stuck .sp-logo img { height: 60px; }
	.sp-nav { margin-inline-end: 14px; }
	.sp-nav__list { gap: 16px; }
	.sp-nav__link { font-size: 12.5px; letter-spacing: .01em; }
	.sp-btn--header,
	.sp-header.is-stuck .sp-btn--header { padding: 11px 14px; font-size: 13px; gap: 8px; }
	.sp-mega__inner--services { gap: 24px; }
	.sp-mega__inner--sectors { grid-template-columns: 220px 1fr; gap: 32px; }
	.sp-sectors { column-gap: 24px; }
}
@media (max-width: 991px) {
	.sp-topbar,
	.sp-nav,
	.sp-btn--header { display: none; }

	.sp-main-wrap,
	.sp-main { height: var(--sp-mobile-h); }
	.sp-container { padding: 0 14px 0 18px; }
	.sp-logo img,
	.sp-header.is-stuck .sp-logo img { height: 40px; }
	.sp-header.is-stuck .sp-main { height: var(--sp-mobile-h); }

	.sp-mobile-actions { display: flex; gap: 8px; }
	.sp-icon-btn {
		display: inline-flex; align-items: center; justify-content: center;
		width: 44px; height: 44px; padding: 0; border-radius: 2px;
	}
	.sp-icon-btn .sp-ico { width: 20px; height: 20px; }
	.sp-call { border: 1px solid var(--sp-border-warm); color: var(--sp-gold-dark); }
	.sp-call:hover { border-color: var(--sp-gold); }
	.sp-burger,
	.sp-drawer__close { background: var(--sp-gold); color: #fff; border: 0; }

	.sp-drawer {
		position: fixed;
		inset: 0;
		z-index: 1001;
		display: flex;
		flex-direction: column;
		background: #fff;
		transform: translateX(100%);
		visibility: hidden;
		transition: transform .3s var(--sp-ease), visibility 0s .3s;
	}
	.sp-drawer.is-open {
		transform: none;
		visibility: visible;
		transition: transform .3s var(--sp-ease), visibility 0s;
	}
	body.admin-bar .sp-drawer { top: 32px; }

	.sp-drawer__head {
		display: flex; align-items: center; justify-content: space-between;
		height: var(--sp-mobile-h); padding: 0 14px 0 18px; flex: none;
		border-bottom: 1px solid var(--sp-border);
	}
	.sp-drawer__body { flex: 1; overflow-y: auto; padding: 4px 20px 12px; overscroll-behavior: contain; }

	.sp-drawer__link {
		display: flex; align-items: center; justify-content: space-between;
		width: 100%; padding: 15px 0;
		background: none; border: 0; border-bottom: 1px solid var(--sp-border-warm);
		color: var(--sp-navy); font-size: 19px; font-weight: 400; text-align: start;
	}
	.sp-drawer__item.is-current > .sp-drawer__link,
	.sp-drawer__item.is-open > .sp-drawer__link { color: var(--sp-gold-dark); }

	.sp-ico--plus { width: 18px; height: 18px; color: var(--sp-gold-dark); }
	.sp-plus-v { transition: transform .25s var(--sp-ease); transform-origin: center; }
	.sp-drawer__item.is-open .sp-plus-v { transform: scaleY(0); }

	/* Accordion */
	.sp-acc { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s var(--sp-ease); }
	.sp-drawer__item.is-open > .sp-acc { grid-template-rows: 1fr; }
	.sp-acc__inner { overflow: hidden; visibility: hidden; transition: visibility 0s .3s; }
	.sp-drawer__item.is-open > .sp-acc .sp-acc__inner { visibility: visible; transition: none; }
	.sp-acc__list {
		display: grid; gap: 12px;
		margin: 14px 0 18px !important; padding-inline-start: 14px !important;
		border-inline-start: 2px solid var(--sp-gold);
	}
	.sp-acc__list a { color: var(--sp-navy); font-size: 15px; font-weight: 500; }
	.sp-acc__sub { display: grid; gap: 10px; margin-top: 10px !important; padding-inline-start: 12px !important; }
	.sp-acc__sub a { color: var(--sp-text); font-size: 14px; font-weight: 400; }
	.sp-acc a:hover { color: var(--sp-gold-dark); }

	.sp-drawer__foot { flex: none; display: grid; gap: 16px; padding: 20px; background: var(--sp-navy); }
	.sp-btn--block { width: 100%; padding: 16px; }
	.sp-drawer__contact { display: grid; gap: 10px; font-size: 14px; }
	.sp-drawer__contact a { display: inline-flex; align-items: center; gap: 9px; color: #dfe2e5; }
	.sp-drawer__contact .sp-ico { color: var(--sp-gold-soft); }

	html.sp-lock,
	html.sp-lock body { overflow: hidden; }
}

@media (max-width: 782px) {
	body.admin-bar .sp-header.is-stuck .sp-main { top: 0; }   /* WP admin bar scrolls away on phones */
	body.admin-bar .sp-drawer { top: 46px; }
}

@media (prefers-reduced-motion: reduce) {
	.sp-header *,
	.sp-header *::before,
	.sp-header *::after { transition: none !important; animation: none !important; }
}