/* =====================================================
   GB OPPORTUNITIES: HOMEPAGE SECTIONS
   Fonts, colors, corners and spacing come from
   Opportunities > Homepage (Design) and Design Settings.
===================================================== */

.gbh-s {
	/* design tokens (the plugin overrides these from your settings) */
	--gbh-brand: #1B4332;
	--gbh-deep: #122C21;
	--gbh-ink: #262623;
	--gbh-soft: #55564F;
	--gbh-line: #E3DFD4;
	--gbh-accent: #E0B15A;
	--gbh-accent-d: #B27A12;
	--gbh-radius: 2px;
	--gbh-btn-radius: 2px;
	--gbh-space: 1;
	--gbh-max: 1180px;
	--gbh-base: 17px;
	--gbh-head-w: 500;
	--gbh-title-scale: 1;
	--gbh-ratio: 4 / 3;
	--gbh-ov: 0.55;
	--gbh-font-head: 'Newsreader', Georgia, 'Times New Roman', serif;
	--gbh-font-body: 'Public Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--gbh-font-label: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

	/* text colors for a LIGHT background (dark text) */
	--gbh-h: var(--gbh-brand);
	--gbh-t: #3F4B45;
	--gbh-m: #55645B;
	--gbh-rule: #D8DFD7;
	--gbh-btn-bg: var(--gbh-brand);
	--gbh-btn-fg: #FFFFFF;
	--gbh-ul: var(--gbh-accent-d);

	box-sizing: border-box;
	font-size: var(--gbh-base);
	color: var(--gbh-t);
	line-height: 1.65;
}

/* text colors for a DARK background (light text) */
.gbh-text-light {
	--gbh-h: #FFFFFF;
	--gbh-t: #E4ECE7;
	--gbh-m: #D5E0D9;
	--gbh-rule: rgba(228, 236, 231, 0.28);
	--gbh-btn-bg: #F6F7F5;
	--gbh-btn-fg: var(--gbh-brand);
	--gbh-ul: var(--gbh-accent);
}

.gbh-s *,
.gbh-s *::before,
.gbh-s *::after { box-sizing: inherit; }

/* Fonts. Themes often set fonts on h2 and p directly, so inheritance alone is not enough. */
.gbh-fb,
.gbh-fb * { font-family: var(--gbh-font-body) !important; }

.gbh-fh .gbh-h,
.gbh-fh .gbo-title,
.gbh-fh .gbo-title a { font-family: var(--gbh-font-head) !important; }

.gbh-fm .gbh-mono { font-family: var(--gbh-font-label) !important; }

.gbh-s .gbh-h {
	margin: 0;
	font-weight: var(--gbh-head-w);
	font-style: normal;
	text-transform: none;
	letter-spacing: -0.01em;
	color: var(--gbh-h) !important;
}

.gbh-s .gbh-mono {
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--gbh-m);
}

.gbh-s p { margin: 0 0 1em; }
.gbh-s p:last-child { margin-bottom: 0; }

.gbh-s .gbh-copy p { color: var(--gbh-t) !important; }
.gbh-s .gbh-note p { color: var(--gbh-m) !important; }

.gbh-s .gbh-title {
	font-size: calc(clamp(30px, 3.6vw, 46px) * var(--gbh-title-scale));
	line-height: 1.12;
	text-wrap: balance;
}

.gbh-pad { padding: calc(clamp(56px, 7vw, 104px) * var(--gbh-space)) clamp(24px, 5vw, 64px); }

.gbh-in {
	max-width: var(--gbh-max);
	margin: 0 auto;
}

.gbh-two {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(380px, 100%), 1fr));
	gap: 48px 72px;
	align-items: center;
}

.gbh-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px 32px;
	margin-bottom: 44px;
}


/* ---------- BACKGROUND PHOTO (a section's own "Photo" background) ---------- */

.gbh-bgimg {
	position: relative;
	background-size: cover;
	background-position: center;
}

.gbh-bgimg::before {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(15, 34, 25, var(--gbh-ov));
}

.gbh-bgimg > * { position: relative; }


/* ---------- BUTTONS AND LINKS ---------- */

.gbh-s a.gbh-btn {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	min-height: 52px;
	padding: 0 28px;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	background: var(--gbh-btn-bg);
	color: var(--gbh-btn-fg) !important;
	border-radius: var(--gbh-btn-radius);
	transition: opacity 0.2s ease;
}

.gbh-s a.gbh-btn:hover { opacity: 0.88; }

.gbh-s a.gbh-arrowlink {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	font-weight: 600;
	color: var(--gbh-h);
	text-decoration: none;
}

.gbh-s a.gbh-arrowlink:hover { text-decoration: underline; text-underline-offset: 5px; }

.gbh-s a.gbh-ulink {
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	font-weight: 600;
	color: var(--gbh-h);
	text-decoration: underline;
	text-decoration-color: var(--gbh-ul);
	text-decoration-thickness: 2px;
	text-underline-offset: 6px;
}

.gbh-s a.gbh-link2 {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	font-weight: 500;
	color: var(--gbh-t) !important;
	text-decoration: underline;
	text-decoration-color: var(--gbh-ul);
	text-underline-offset: 5px;
}

.gbh-s a:focus-visible {
	outline: 2px solid var(--gbh-accent);
	outline-offset: 3px;
}


/* ---------- HERO ---------- */

.gbh-hero {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 640px;
	padding: 96px clamp(24px, 5vw, 64px) clamp(44px, 6vw, 80px);
	background-color: var(--gbh-brand);
	background-image: repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.06) 0 1px, transparent 1px 18px);
	overflow: hidden;
}

.gbh-hh-short { min-height: 420px; }
.gbh-hh-medium { min-height: 540px; }
.gbh-hh-tall { min-height: 640px; }
.gbh-hh-full { min-height: 88vh; }

.gbh-v-center { justify-content: center; }

.gbh-hero-bg {
	position: absolute;
	inset: 0;
}

.gbh-hero-bg img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.gbh-focus-top .gbh-hero-bg img { object-position: center top; }
.gbh-focus-bottom .gbh-hero-bg img { object-position: center bottom; }

.gbh-hero-bg.has-img::after {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(15, 34, 25, var(--gbh-ov));
}

.gbh-hero-in {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 24px;
	max-width: 820px;
}

.gbh-s .gbh-hero-title {
	font-size: calc(clamp(40px, 5.4vw, 76px) * var(--gbh-title-scale));
	line-height: 1.04;
	letter-spacing: -0.015em;
	text-wrap: balance;
}

.gbh-hero-text { max-width: 640px; font-size: calc(var(--gbh-base) + 1px); line-height: 1.6; }

.gbh-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 28px;
	padding-top: 8px;
}

.gbh-hero-tags { padding-top: 12px; font-size: 13px !important; }


/* ---------- CONSTRUCTION STRIP ---------- */

.gbh-con {
	padding: 6px clamp(24px, 5vw, 64px);
	background: #E6EBE5;
	font-size: 14px;
	line-height: 1.4;
}

.gbh-con-in {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 4px 24px;
	max-width: var(--gbh-max);
	margin: 0 auto;
}

.gbh-con-l {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 14px;
	padding: 8px 0;
}

.gbh-con-l strong { font-weight: 600; color: var(--gbh-h); }

.gbh-s a.gbh-con-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	font-weight: 600;
	color: var(--gbh-h);
}


/* ---------- WHAT WE DO ---------- */

.gbh-svc { background: #F6F7F5; }

.gbh-s .gbh-svc-title { max-width: 820px; margin-bottom: 56px; }

.gbh-svc-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
	gap: 40px;
}

.gbh-svc-item { display: flex; flex-direction: column; gap: 20px; }

.gbh-svc-img img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: var(--gbh-ratio);
	object-fit: cover;
	border-radius: var(--gbh-radius);
}

.gbh-s .gbh-svc-item h3 { font-size: 27px; line-height: 1.2; }


/* ---------- CURRENT OPPORTUNITIES ---------- */

.gbh-opp { background: #FBFCFA; border-top: 1px solid #DDE3DC; }

/* The listing cards are light boxes whatever the section's background is */
.gbh-opp .gbo-list {
	max-width: none;
	--gbo-radius: var(--gbh-radius);
	color: var(--gbo-ink);
}


/* ---------- GB FIRST LOOK ---------- */

.gbh-fl { background: var(--gbh-brand); }
.gbh-fl .gbh-two { align-items: start; }

.gbh-fl-left { display: flex; flex-direction: column; gap: 24px; }
.gbh-s .gbh-fl-title { font-size: calc(clamp(34px, 4.2vw, 56px) * var(--gbh-title-scale)); line-height: 1.06; }

.gbh-fl-text { max-width: 540px; font-size: calc(var(--gbh-base) + 2px); line-height: 1.6; }
.gbh-fl-note { max-width: 520px; font-size: 13px; line-height: 1.55; }
.gbh-fl-left .gbh-btn { align-self: flex-start; }

.gbh-fl-list .gbh-mono { padding-bottom: 16px; }

.gbh-fl-list ul {
	margin: 0;
	padding: 0;
	list-style: none;
	border-bottom: 1px solid var(--gbh-rule);
}

.gbh-fl-list li {
	margin: 0;
	padding: 16px 0;
	border-top: 1px solid var(--gbh-rule);
	font-size: calc(var(--gbh-base) + 1px);
	line-height: 1.4;
	color: var(--gbh-h);
}


/* ---------- LATEST ARTICLES ---------- */

.gbh-art { background: #F6F7F5; border-top: 1px solid #DDE3DC; }

.gbh-art-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
	gap: 40px;
}

.gbh-art-item {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding-top: 22px;
	border-top: 2px solid var(--gbh-h);
}

.gbh-art-img img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-radius: var(--gbh-radius);
}

.gbh-s .gbh-art-item h3 { font-size: 26px; line-height: 1.2; }
.gbh-s .gbh-art-item h3 a { color: inherit; text-decoration: none; }
.gbh-s .gbh-art-item h3 a:hover { text-decoration: underline; text-underline-offset: 5px; }
.gbh-art-item .gbh-copy p { margin: 0; }
.gbh-empty { color: var(--gbh-t); }


/* ---------- MEETUP ---------- */

.gbh-mt { background: #E6EBE5; border-top: 1px solid #D3DBD2; }

.gbh-mt-left { display: flex; flex-direction: column; gap: 20px; }
.gbh-mt-left .gbh-arrowlink { align-self: flex-start; }
.gbh-mt-text { max-width: 520px; }

/* a light box whatever the section's background is */
.gbh-mt-next {
	--gbh-t: #1E2B24;
	--gbh-m: #55645B;
	display: flex;
	flex-direction: column;
	padding: 28px;
	background: #FBFCFA;
	border: 1px solid #C9D2C8;
	border-radius: var(--gbh-radius);
	color: #1E2B24;
}

.gbh-mt-label { padding-bottom: 14px; color: #3F5247 !important; }

.gbh-row {
	display: grid;
	grid-template-columns: 96px 1fr;
	gap: 12px;
	padding: 12px 0;
	border-top: 1px solid #E0E6DF;
	font-size: 16px;
}

.gbh-row:last-child { border-bottom: 1px solid #E0E6DF; }


/* ---------- SUCCESS IS A MINDSET ---------- */

.gbh-ms { background: var(--gbh-deep); }

.gbh-ms-left { display: flex; flex-direction: column; gap: 28px; }

.gbh-s .gbh-quote {
	font-size: calc(clamp(28px, 3.2vw, 40px) * var(--gbh-title-scale));
	font-style: italic;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -0.005em;
	text-wrap: pretty;
}

.gbh-quote p { color: var(--gbh-h) !important; }
.gbh-ms-text { max-width: 540px; }

.gbh-ms-img img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	border-radius: var(--gbh-radius);
}


/* ---------- CONTACT ---------- */

.gbh-ct { background: #F6F7F5; }

.gbh-ct-in {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 32px 64px;
}

.gbh-ct-left { display: flex; flex-direction: column; gap: 16px; max-width: 640px; }


/* ---------- YOUR OWN SECTIONS ---------- */

.gbh-cu { background: #F6F7F5; }
.gbh-cu-copy { display: flex; flex-direction: column; gap: 22px; }
.gbh-cu-copy .gbh-btn { align-self: flex-start; }
.gbh-cu-text { max-width: 560px; }

.gbh-cu-img img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--gbh-radius);
}

.gbh-cu-imgleft .gbh-cu-img { order: -1; }


/* ---------- CENTERED TEXT ---------- */

.gbh-align-center .gbh-title,
.gbh-align-center .gbh-svc-title { text-align: center; margin-left: auto; margin-right: auto; }

.gbh-align-center .gbh-head { justify-content: center; text-align: center; }

.gbh-align-center .gbh-hero-in { margin-left: auto; margin-right: auto; align-items: center; text-align: center; }
.gbh-align-center .gbh-hero-text { margin-left: auto; margin-right: auto; }
.gbh-align-center .gbh-actions { justify-content: center; }

.gbh-align-center .gbh-svc-item { align-items: center; text-align: center; }
.gbh-align-center .gbh-svc-item .gbh-ulink { align-self: center; }

.gbh-align-center .gbh-ct-in { justify-content: center; text-align: center; }
.gbh-align-center .gbh-ct-left { align-items: center; }

.gbh-align-center .gbh-cu-copy { align-items: center; text-align: center; }
.gbh-align-center .gbh-cu-copy .gbh-btn { align-self: center; }
.gbh-align-center .gbh-cu-solo { text-align: center; }
.gbh-cu-solo .gbh-two { grid-template-columns: 1fr; }


/* ---------- SHOW ON PHONES / COMPUTERS ONLY ---------- */

@media (min-width: 801px) {
	.gbh-hide-d { display: none !important; }
}

@media (max-width: 800px) {
	.gbh-hide-m { display: none !important; }
	.gbh-cu-imgleft .gbh-cu-img { order: 0; }
	.gbh-hh-tall,
	.gbh-hh-full { min-height: 540px; }
}
