:root {
	--gboneai-color-primary: #1043ff;
	--gboneai-color-dark: #1b2b50;
	--gboneai-color-accent: #fcac0b;
	--gboneai-color-turquoise: #1fa9ab;
	--gboneai-color-surface: #f3f3f5;
	--gboneai-color-white: #fff;
	--gboneai-color-text: #212121;
	--gboneai-radius-card: 20px;
	--gboneai-radius-pill: 999px;
	--gboneai-shadow-card: 0 0 20px rgba(0, 0, 0, 0.1);
	/* Measured from Figma 17/08: prose column 1040, wide band 1400, full bleed
	 * 1920. See docs/figma-map.md. These mirror theme.json layout.contentSize
	 * and layout.wideSize - keep the two in step. */
	--gboneai-content: 1040px;
	--gboneai-container: 1400px;
	--gboneai-gutter: 1rem;

	/* 104 at the drawn 1920, scaling down but never below 48. */
	--gboneai-footer-gap: clamp(48px, 5.42vw, 104px);
	--gboneai-header-height: 90px;
	--gboneai-panel-blue: #1748ff;
	--gboneai-focus: 3px solid var(--gboneai-color-accent);
	/* One easing curve for every hover in the theme, so interactions feel like
	 * one system rather than each component inventing its own timing.
	 * ease-out: quick to respond, gentle to settle. */
	--gboneai-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--gboneai-duration: 280ms;
	--gboneai-duration-slow: 420ms;
	--gboneai-font-general-family: "Times New Roman", Times, serif;
	--gboneai-font-general-weight: 400;
	--gboneai-font-headings-family: var(--gboneai-font-general-family);
	--gboneai-font-headings-weight: 700;
	--gboneai-font-links-family: var(--gboneai-font-general-family);
	--gboneai-font-links-weight: 400;
}

.gboneai-component-disabled-notice {
	box-sizing: border-box;
	padding: 0.75rem 1rem;
	border: 1px dashed currentcolor;
	font-size: 0.875rem;
}

/* Phase 2B Batch 1: approved Gutenberg Hero and Statistics. */
body.home .gboneai-content,
body.home .entry-content {
	width: 100%;
	max-width: none;
	margin-inline: 0;

	/* Inline and top only. `padding: 0` here also removed the space above the
	 * footer, which is why the home page was the one page without any. */
	padding-inline: 0;
	padding-block-start: 0;
}

body.home .entry-content > .home-hero {
	width: 100%;
	max-width: none;
	margin-inline: 0 !important;
	transform: none !important;
}

/*
 * The rail's top is y743 on every drawing, not only the home page's. Until
 * 27/09 this clamp was scoped to body.home and every inner page fell back to
 * 45% of the viewport, which put the rail 257px higher (QA A10). The <=600
 * rules further down are untouched.
 */
@media (min-width: 601px) {
	body .side-contact-controls {
		inset-block-start: clamp(560px, 68vh, 743px);
		inset-block-end: auto;
	}
}

body.home .home-hero {
	position: relative;
	width: 100%;
	max-width: none;
	min-height: 753px;
	overflow: hidden;
	background:
		linear-gradient(
			to bottom,
			var(--gboneai-color-dark) 0,
			var(--gboneai-color-dark) 631px,
			var(--gboneai-color-surface) 631px,
			var(--gboneai-color-surface) 100%
		);
	color: var(--gboneai-color-white, #fff);
}

body.home .home-hero::before {
	position: absolute;
	z-index: 0;
	inset: 0 auto auto 0;
	width: 676px;
	height: 753px;
	background: radial-gradient(
		ellipse at center,
		rgba(70, 102, 175, 0.9) 0,
		rgba(70, 102, 175, 0) 91.827%
	);
	content: "";
	pointer-events: none;
}

body.home .home-hero__inner {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: minmax(0, 676px) minmax(0, 1fr);
	grid-template-rows: 257px 290px 206px;
	width: min(100%, 1920px);
	max-width: none;
	min-height: 753px;
	margin-inline: auto;
	direction: ltr;
}

body.home .home-hero__title {
	position: relative;
	z-index: 3;
	grid-column: 2;
	grid-row: 1;
	width: auto;
	max-width: none;
	margin: 81px 159px 0 60px;
	color: #fff;
	direction: rtl;
	font-size: clamp(48px, 4.167vw, 80px);
	font-weight: 700;
	line-height: 0.9;
	text-align: right;
}

body.home .home-hero__people {
	position: relative;
	z-index: 2;
	inset: auto;
	grid-column: 1;
	grid-row: 1 / -1;
	justify-self: start;
	width: 676px;
	max-width: none;
	height: 753px;
	margin-inline-start: -3px;
	overflow: visible;
	pointer-events: none;
}

body.home .home-hero__people figure {
	position: absolute;
	overflow: hidden;
	margin: 0;
}

body.home .home-hero__man {
	inset: 18px auto auto 42px;
	width: 491px;
	height: 613px;
}

body.home .home-hero__woman {
	inset: 17px auto auto 230px;
	width: 443px;
	height: 614px;
}

body.home .home-hero__man img,
body.home .home-hero__woman img {
	display: block;
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
	object-position: right bottom;
}

body.home .home-hero__woman img {
	transform: scaleX(-1);
}

body.home .home-stats {
	position: relative;
	z-index: 4;
	inset: auto;
	display: flex;
	grid-column: 2;
	grid-row: 2;
	justify-self: end;
	flex-direction: row;
	flex-wrap: nowrap !important;
	gap: 50px;
	width: min(970px, calc(100% - 215px));
	max-width: none;
	margin-right: 155px;
	direction: rtl;
}

body.home .home-stat {
	position: relative;
	display: grid;
	flex: 0 0 290px;
	width: 290px;
	max-width: 290px;
	height: 290px;
	min-height: 290px;
	padding: 0;
	border: 0;
	border-radius: 0;
	place-content: center;
	text-align: center;
	transform: none;
}

body.home .home-stat > * {
	transform: none;
}

body.home .home-stat__ring {
	position: absolute;
	z-index: 0;
	inset: 0;
	width: 290px;
	height: 290px;
	margin: 0;
	pointer-events: none;
}

body.home .home-stat__ring img {
	display: block;
	width: 100%;
	height: 100%;
}

body.home .home-stat__value,
body.home .home-stat__label {
	position: relative;
	z-index: 1;
	margin: 0;
}

body.home p.home-stat__value {
	color: var(--gboneai-color-primary);
	font-size: 80px;
	font-weight: 700;
	line-height: 1;
	white-space: nowrap;
}

body.home .home-stat--members p.home-stat__value {
	color: var(--gboneai-color-turquoise);
}

body.home .home-stat--events p.home-stat__value {
	color: var(--gboneai-color-accent);
}

body.home p.home-stat__label {
	width: 122px;
	margin-inline: auto;
	color: var(--gboneai-color-surface);
	font-size: 20px;
	font-weight: 400;
	line-height: 1;
	text-wrap: balance;
}

@media (max-width: 1700px) {
	body.home .home-hero {
		min-height: auto;
		background: var(--gboneai-color-dark);
	}

	body.home .home-hero__inner {
		display: grid;
		grid-template-columns: minmax(320px, 45%) minmax(0, 1fr);
		grid-template-rows: auto auto;
		grid-template-areas:
			"people title"
			"people stats";
		gap: 30px 20px;
		min-height: 650px;
		padding: 56px 96px 32px 32px;
		direction: ltr;
	}

	body.home .home-hero__title {
		position: static;
		grid-area: title;
		width: auto;
		margin: 0;
		align-self: end;
		direction: rtl;
		font-size: clamp(48px, 5.2vw, 68px);
	}

	body.home .home-hero__people {
		position: relative;
		inset: auto;
		grid-area: people;
		width: 100%;
		height: 100%;
		min-height: 560px;
		margin: 0;
	}

	body.home .home-hero__man {
		inset: auto auto 0 0;
		width: 72%;
		height: 88%;
	}

	body.home .home-hero__woman {
		inset: auto 0 0 auto;
		width: 72%;
		height: 78%;
	}

	body.home .home-stats {
		position: static;
		grid-area: stats;
		gap: 12px;
		width: auto;
		margin: 0;
		align-self: start;
		justify-self: stretch;
	}

	body.home .home-stat {
		flex-basis: min(220px, calc((100% - 24px) / 3));
		width: min(220px, calc((100% - 24px) / 3));
		max-width: none;
		height: auto;
		min-height: 0;
		aspect-ratio: 1;
	}

	body.home .home-stat__ring {
		width: 100%;
		height: 100%;
	}

	body.home p.home-stat__value {
		font-size: clamp(48px, 5vw, 64px);
	}

	body.home p.home-stat__label {
		width: 56%;
		font-size: clamp(15px, 1.55vw, 18px);
	}
}

@media (max-width: 900px) {
	body.home .home-hero__inner {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas:
			"title"
			"people"
			"stats";
		gap: 22px;
		min-height: 0;
		padding: 48px 80px 54px 24px;
	}

	body.home .home-hero__title {
		text-align: right;
	}

	body.home .home-hero__people {
		width: min(100%, 620px);
		height: 420px;
		min-height: 0;
		margin-inline: auto;
	}

	body.home .home-stats {
		justify-content: center;
	}

	body.home .home-stat {
		flex-basis: clamp(180px, 27vw, 220px);
		width: clamp(180px, 27vw, 220px);
		height: clamp(180px, 27vw, 220px);
	}
}

@media (max-width: 600px) {
	body.home .home-hero__inner {
		padding: 38px 20px 48px;
	}

	body.home .home-hero__title {
		font-size: clamp(40px, 12vw, 52px);
		line-height: 0.95;
	}

	body.home .home-hero__people {
		height: clamp(285px, 82vw, 360px);
	}

	body.home .home-stats {
		flex-wrap: wrap !important;
		gap: 18px;
	}

	body.home .home-stat {
		flex-basis: 210px;
		width: 210px;
		height: 210px;
	}

	body.home p.home-stat__value {
		font-size: 58px;
	}

	body.home p.home-stat__label {
		width: 122px;
		font-size: 17px;
	}
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	background: var(--gboneai-color-white);
	color: var(--gboneai-color-text);
	font-family: var(--gboneai-font-general-family);
	font-weight: var(--gboneai-font-general-weight);
	font-size: 18px;
	line-height: 1.6;

	/*
	 * Discovery FS carries a required-ligature rule that swallows a plus sign
	 * after some digits: "30+" renders and measures as "30", "10+" as "10". It
	 * is not a layout problem - the character is dropped during shaping, so the
	 * text is simply wrong and no amount of width fixes it.
	 *
	 * rlig is on by definition and font-variant-ligatures: none cannot reach it;
	 * font-feature-settings is the only property that can. Turning it off is
	 * safe for this site: required ligatures matter for Arabic and Indic
	 * scripts, not for Hebrew or Latin. Measured before and after - Hebrew and
	 * plain digits are byte-for-byte the same width.
	 */
	font-feature-settings: "rlig" 0;

	/*
	 * A flex column so the footer sits at the bottom of a short page without
	 * anything being padded out to push it there. main is the item that grows.
	 */
	min-block-size: 100vh;
	display: flex;
	flex-direction: column;
}

:where(h1, h2, h3, h4, h5, h6, .wp-block-heading) {
	font-family: var(--gboneai-font-headings-family);
	font-weight: var(--gboneai-font-headings-weight);
}

img,
video,
iframe {
	max-width: 100%;
}

img {
	height: auto;
}

a {
	color: var(--gboneai-color-primary);
}

:where(a:not(.button):not(.wp-element-button):not([role="button"])) {
	font-family: var(--gboneai-font-links-family);
	font-weight: var(--gboneai-font-links-weight);
}

a:hover {
	text-decoration-thickness: 2px;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: var(--gboneai-focus);
	outline-offset: 3px;
}

button,
input,
textarea,
select {
	font: inherit;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.screen-reader-text:focus {
	position: fixed;
	inset-block-start: 1rem;
	inset-inline-start: 1rem;
	z-index: 100000;
	width: auto;
	height: auto;
	padding: 0.75rem 1rem;
	clip: auto;
	background: var(--gboneai-color-white);
	color: var(--gboneai-color-dark);
}

.gboneai-container {
	width: min(calc(100% - 2rem), var(--gboneai-container));
	margin-inline: auto;
}

/* Was `width: 73%`, which never matched the design and had no ceiling: it gave
 * a ~1870px text column on a 2560 display and threw away 27% of a 375px phone
 * as margin. The min() form caps at the designed 1040 and degrades to a real
 * gutter on small screens. Same pattern as .gboneai-container above. */
/*
 * The space above the footer, in one place.
 *
 * It had been three different values from three unrelated rules: 0 on the home
 * page, 72 on an ordinary page, and 0 on every CPT archive - which is why some
 * pages had room above the footer and some did not. The drawing gives 104
 * (content ends 4348, footer starts 4452).
 *
 * On main rather than on the footer, because main is the flex item that grows:
 * a margin on the footer would be added *after* main had already filled the
 * viewport, and push the footer back off the bottom of a short page.
 */
main.site-main {
	flex: 1 0 auto;
	padding-block-end: var(--gboneai-footer-gap);
}

.gboneai-content {
	width: min(calc(100% - (var(--gboneai-gutter) * 2)), var(--gboneai-content));
	margin-inline: auto;

	/* Start only. The end is main.site-main above, so one rule owns the space
	 * above the footer on every template.
	 *
	 * min-height: 40vh used to sit here. It was a crude way to stop the footer
	 * riding up a short page, and it did it by inflating the content block - so
	 * a short page got an arbitrary slab of empty space that a long one did not.
	 * The flex column on body does the same job without inventing any. */
	padding-block-start: clamp(2rem, 5vw, 4.5rem);
}

/* alignwide widens from the 1040 column out to the 1400 band - it is not
 * full-bleed. alignfull below still escapes to the viewport. */
.gboneai-content .alignwide {
	width: min(calc(100vw - (var(--gboneai-gutter) * 2)), var(--gboneai-container));
	max-width: none;
	margin-inline: 50%;
	transform: translateX(-50%);
}

[dir="rtl"] .gboneai-content .alignwide {
	transform: translateX(50%);
}

.gboneai-content .alignfull {
	width: 100vw;
	max-width: none;
	margin-inline: 50%;
	transform: translateX(-50%);
}

[dir="rtl"] .gboneai-content .alignfull {
	transform: translateX(50%);
}

.site-header {
	position: sticky;
	inset-block-start: 0;
	z-index: 100;
	min-height: 90px;
	background: rgba(27, 43, 80, 0.95);
	color: var(--gboneai-color-white);
	backdrop-filter: blur(7.5px);
}

/*
 * Inner pages slide the secondary header up behind the bar, so the 95% navy
 * composites over navy and reads #1B2B50. The home page has nothing behind the
 * bar but white, and the same rgba came out #273659 (QA A2). Opaque there.
 */
body.home .site-header {
	background: #1b2b50;
}

.site-header__inner {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: clamp(1rem, 2vw, 2rem);
	min-height: 90px;
}

.site-branding { grid-column: 1; }
.primary-navigation { grid-column: 2; }
.header-actions { grid-column: 3; }
.site-navigation__mobile-divider { display: none; }

.custom-logo-link {
	display: inline-flex;
	align-items: center;
}

.custom-logo {
	display: block;
	max-height: 64px;
	width: auto;
}

.site-title,
.footer-site-title {
	color: inherit;
	font-size: 1.25rem;
	font-weight: 700;
	text-decoration: none;
}

.primary-menu,
.footer-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.primary-menu {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: clamp(0.75rem, 1.5vw, 1.5rem);
}

.primary-menu .menu-item-has-children { position: relative; }
.primary-menu .sub-menu {
	position: absolute;
	inset-block-start: calc(100% + 1.65rem);
	inset-inline-start: 50%;
	display: none;
	min-width: 242px;
	padding: 1rem 1.25rem;
	margin: 0;
	transform: translateX(50%);
	list-style: none;
	border-radius: 0 0 20px 20px;
	background: var(--gboneai-panel-blue);
	box-shadow: var(--gboneai-shadow-card);
	text-align: center;
}
.primary-menu .menu-item-has-children.is-submenu-open > .sub-menu { display: block; }
.primary-menu .sub-menu a { display: block; padding: 0.2rem 0; }
.submenu-toggle {
	width: 30px;
	height: 30px;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--gboneai-color-white);
	cursor: pointer;
}

.primary-menu a,
.primary-menu .menu-item-placeholder {
	color: var(--gboneai-color-white);
	text-decoration: none;

	/*
	 * WCAG 2.2 AA, 2.5.8: a pointer target is at least 24 by 24. These measured
	 * 21px tall - the line box and nothing more.
	 *
	 * inline-flex with the text centred rather than padding, so the hit area
	 * grows around the label and the label itself does not move. The header is
	 * laid out on its own centring, so nothing shifts.
	 *
	 * The inline exception covers the breadcrumbs and the privacy link in the
	 * consent sentence - those sit inside running text and are sized by its
	 * line-height. Menu items are standalone targets and are not covered.
	 */
	display: inline-flex;
	align-items: center;
	min-block-size: 24px;
}

/*
 * The footer's contact details are the same case: an icon and a link on their
 * own row, not a phrase in a sentence, so the inline exception does not cover
 * them. The phone measured 107 by 20.
 */
.footer-contact a {
	display: inline-flex;
	align-items: center;
	min-block-size: 24px;
}

.primary-menu .menu-item-placeholder {
	display: block;
}

.primary-menu .current-menu-item > a,
.primary-menu .current-menu-ancestor > a,
.primary-menu a:hover {
	color: var(--gboneai-color-accent);
}

.header-actions {
	display: flex;
	align-items: center;
	gap: 0.4rem;
}

.header-action,
.button,
.back-to-top {
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	justify-content: center;
	padding: 0.55rem 1rem;
	border: 0;
	border-radius: var(--gboneai-radius-pill);
	text-decoration: none;
	cursor: pointer;
}

.header-action {
	color: var(--gboneai-color-white);
	background: transparent;
}

.header-action--join {
	background: var(--gboneai-color-primary);
}
.header-action.is-disabled { opacity: 0.65; cursor: default; }
.header-action[aria-expanded="true"] { color: var(--gboneai-color-accent); }

.header-panel { position: absolute; inset-inline: 0; inset-block-start: 100%; }
.header-panel[hidden] { display: none; }
.header-search-panel { padding-block: 2.75rem; background: var(--gboneai-panel-blue); }
.header-search-panel__inner { display: flex; justify-content: center; }
.header-search-form { display: flex; width: min(100%, 576px); padding: 0.6rem; border-radius: var(--gboneai-radius-pill); background: var(--gboneai-color-surface); }
.header-search-form input { width: 100%; min-width: 0; padding-inline: 1rem; border: 0; background: transparent; }
.header-search-form button { width: 42px; height: 42px; border: 0; border-radius: 50%; background: var(--gboneai-color-primary); color: #fff; cursor: pointer; }
.header-login-panel { background: transparent; pointer-events: none; }
.header-login-panel__inner { position: relative; width: 344px; max-width: calc(100vw - 2rem); padding: 1.5rem 2rem; margin-inline-start: 4rem; border-radius: 0 0 20px 20px; background: var(--gboneai-panel-blue); color: #fff; pointer-events: auto; }
.header-login-panel h2 { margin-block: 0 0.25rem; text-align: center; }
.header-login-panel p { margin-block: 0.35rem; }
.header-login-panel label { display: block; }
.header-login-panel input[type="text"], .header-login-panel input[type="password"] { width: 100%; min-height: 42px; border: 0; border-radius: var(--gboneai-radius-pill); }
.header-login-panel input[type="submit"] { width: 100%; min-height: 42px; border: 0; border-radius: var(--gboneai-radius-pill); background: var(--gboneai-color-dark); color: #fff; cursor: pointer; }
.header-login-panel a { color: #fff; }
.header-panel__close { position: absolute; inset-block-start: 0.5rem; inset-inline-end: 0.5rem; border: 0; background: transparent; color: #fff; font-size: 1.5rem; cursor: pointer; }

.menu-toggle {
	display: none;
	min-width: 44px;
	min-height: 44px;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	border: 1px solid rgba(255, 255, 255, 0.6);
	border-radius: var(--gboneai-radius-pill);
	background: transparent;
	color: var(--gboneai-color-white);
}

.menu-toggle__icon,
.menu-toggle__icon::before,
.menu-toggle__icon::after {
	display: block;
	width: 18px;
	height: 2px;
	background: currentcolor;
	content: "";
}

.menu-toggle__icon {
	position: relative;
}

.menu-toggle__icon::before,
.menu-toggle__icon::after {
	position: absolute;
	inset-inline-start: 0;
}

.menu-toggle__icon::before { inset-block-start: -6px; }
.menu-toggle__icon::after { inset-block-start: 6px; }

.entry-card {
	padding: 1.5rem;
	margin-block-end: 1.5rem;
	border-radius: var(--gboneai-radius-card);
	background: var(--gboneai-color-surface);
}

.entry-title,
.page-title {
	color: var(--gboneai-color-dark);
	line-height: 1.15;
}

.entry-title a {
	color: inherit;
}

.entry-meta {
	color: #5b6477;
	font-size: 0.875rem;
}

.site-footer {
	padding-block: clamp(2.5rem, 5vw, 4rem) 1.5rem;
	background: var(--gboneai-color-surface);
	color: var(--gboneai-color-dark);
}

.site-footer__grid {
	display: grid;
	grid-template-columns: 1.2fr repeat(3, minmax(0, 1fr)) 1.25fr;
	gap: clamp(1.5rem, 3vw, 3rem);
}
.footer-brand { order: -2; }
.footer-contact { order: -1; }
.footer-social { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-block-start: 1.25rem; }
.footer-social a { display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; border: 1px solid currentcolor; border-radius: 50%; color: var(--gboneai-color-primary); text-decoration: none; }
.newsletter-preview { display: grid; gap: 0.75rem; opacity: 0.7; }
.newsletter-preview span { padding: 0.65rem 1rem; border: 1px solid var(--gboneai-color-dark); border-radius: var(--gboneai-radius-pill); background: #fff; }

.site-footer h2 {
	font-size: 1.125rem;
}

.footer-navigation a {
	display: inline-block;
	padding-block: 0.25rem;
	color: var(--gboneai-color-dark);
}

.button--accent {
	background: var(--gboneai-color-primary);
	color: var(--gboneai-color-white);
}

/* The 404 page (QA C11 + D19): message, the header's search pill, the site's
   blue pill button - one centred column in the 1400 band. */
.error-404 {
	display: flex;
	width: min(calc(100% - (var(--gboneai-gutter) * 2)), 1400px);
	flex-direction: column;
	align-items: center;
	gap: 30px;
	padding-block: 60px 90px;
	text-align: center;
}

.error-404 > p {
	margin: 0;
	font-size: 20px;
	color: var(--gboneai-color-dark);
}

.error-404 .header-search-form {
	width: min(100%, 576px);
}

.error-404 .button--accent {
	min-height: 50px;
	padding-inline: 30px;
	font-size: 18px;
	font-weight: 700;
}

.site-footer__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding-block-start: 2rem;
	margin-block-start: 2rem;
	border-block-start: 1px solid rgba(27, 43, 80, 0.2);
}

.back-to-top {
	position: fixed;
	inset-inline-start: 1.75rem;
	inset-block-end: 1rem;
	z-index: 90;
	background: var(--gboneai-color-dark);
	color: var(--gboneai-color-white);
}

.back-to-top[hidden] {
	display: none;
}

.side-contact-controls { position: fixed; inset-inline-end: 1rem; inset-block-start: 45%; z-index: 95; display: grid; gap: 0.25rem; }
.side-contact-control { display: inline-flex; width: 54px; height: 54px; align-items: center; justify-content: center; border-radius: 50%; color: #fff; font-size: 0.72rem; font-weight: 700; text-decoration: none; box-shadow: 0 4px 12px rgba(0,0,0,.2); }
.side-contact-control--whatsapp { background: #2ee833; }
.side-contact-control--contact { background: var(--gboneai-color-primary); }
.side-contact-control--emergency { background: var(--gboneai-color-dark); }

@media (max-width: 1279px) {
	.site-header__inner {
		gap: 0.75rem;
	}

	.header-action {
		padding-inline: 0.7rem;
		font-size: 0.9rem;
	}
}

@media (max-width: 1023px) {
	.site-header__inner {
		grid-template-columns: 1fr auto;
		padding-block: 0.75rem;
	}

	.menu-toggle {
		display: inline-flex;
		justify-self: end;
	}

	.primary-navigation {
		display: none;
		grid-column: 1 / -1;
	}
	.site-branding { grid-column: 1; }
	.menu-toggle { grid-column: 2; }
	.header-actions { grid-column: 1 / -1; }
	.header-panel { position: fixed; inset-block-start: auto; }
	.header-search-panel, .header-login-panel { inset-block-start: var(--gboneai-header-height); }
	.header-login-panel__inner { margin-inline: auto; }
	.primary-menu .menu-item-has-children { display: grid; grid-template-columns: 1fr auto; }
	.primary-menu .sub-menu { position: static; grid-column: 1 / -1; width: 100%; min-width: 0; transform: none; border-radius: 12px; }

	.primary-navigation.is-open {
		display: block;
		max-height: calc(100vh - 90px);
		overflow: auto;
	}

	.primary-menu {
		align-items: stretch;
		flex-direction: column;
		padding-block: 1rem;
		border-block-start: 1px solid rgba(255, 255, 255, 0.2);
	}

	.primary-menu a {
		display: block;
		min-height: 44px;
		padding: 0.6rem;
	}

	.header-actions {
		grid-column: 1 / -1;
		flex-wrap: wrap;
		padding-block-end: 0.5rem;
	}

	.site-footer__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 479px) {
	.header-actions {
		align-items: stretch;
		flex-direction: column;
	}

	.header-action {
		width: 100%;
	}

	.site-footer__grid {
		grid-template-columns: 1fr;
	}

	.site-footer__bottom {
		align-items: flex-start;
		flex-direction: column;
	}
	.side-contact-controls { inset-inline-end: 0.5rem; inset-block-start: auto; inset-block-end: 5rem; }
	.side-contact-control { width: 48px; height: 48px; }
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}

/* Phase 2A approved global-shell geometry. */
.site-header__inner {
	width: 100%;
	max-width: none;
	padding-inline: 32px;
	grid-template-columns: 410px minmax(720px, 1fr) 272px;
	gap: 18px;
	direction: ltr;
}

.site-branding { grid-column: 3; grid-row: 1; justify-self: end; direction: rtl; }
.primary-navigation { grid-column: 2; grid-row: 1; justify-self: center; direction: rtl; }
.header-actions { grid-column: 1; grid-row: 1; justify-self: start; justify-content: flex-end; gap: 20px; direction: rtl; white-space: nowrap; }
.custom-logo { width: 240px; max-width: 240px; max-height: 58px; object-fit: contain; }

.primary-menu { gap: 28px; justify-content: center; }
.primary-menu > li > a,
.primary-menu > li > .menu-item-placeholder {
	font-size: 19px;
	font-weight: 400;
	line-height: normal;
	white-space: nowrap;
}
.primary-menu > .current-menu-item > a,
.primary-menu > .current-menu-ancestor > a { color: var(--gboneai-color-accent); }
.header-action {
	display: inline-flex;
	min-height: 44px;
	padding: 0;
	align-items: center;
	gap: 8px;
	border: 0;
	text-decoration: none;
}
.header-action--search,
.header-action--login,
.header-action--join {
	font-size: 20px;
	font-weight: 400;
	line-height: normal;
}
.header-action--welcome {
	font-size: 17px;
	font-weight: 600;
}
.header-action svg { width: 23px; height: 23px; fill: none; stroke: currentcolor; stroke-width: 1.8; }
.header-action--join { min-width: 163px; padding-inline: 20px; justify-content: center; }
.header-action--welcome { max-width: 245px; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.header-action--welcome svg { flex: 0 0 23px; }
/* It is a link now; the row's other actions are buttons and carry no underline,
   and `[aria-expanded="true"]` already sets accent as their active colour. */
a.header-action--welcome { text-decoration: none; }
a.header-action--welcome:hover,
a.header-action--welcome:focus-visible { color: var(--gboneai-color-accent); }
.site-header--logged-in .header-actions { width: 390px; justify-content: flex-end; }

.header-search-panel { height: 160px; padding-block: 44px; }
.header-search-form { height: 60px; width: 576px; padding: 9px 12px; }
.header-search-form input { font-size: 18px; font-weight: 600; }
.header-search-form button {
	display: grid;
	flex: 0 0 42px;
	padding: 0;
	place-items: center;
	font-size: 0;
	line-height: 0;
}
.header-search-form button svg {
	display: block;
	width: 24px;
	height: 24px;
	overflow: visible;
	fill: none;
	stroke: currentcolor;
	stroke-width: 2.4;
	stroke-linecap: round;
	stroke-linejoin: round;
	pointer-events: none;
}

.header-login-panel__inner {
	position: absolute;
	left: 78px;
	right: auto;
	width: 344px;
	min-height: 543px;
	padding: 20px 33px 18px;
	margin-inline: 0;
	margin-left: 0;
	border-radius: 0 0 20px 20px;
	text-align: right;
}
.header-login-panel h2 { font-size: 23px; margin-bottom: 2px; text-align: center; }
.header-login-panel p { text-align: center; }
.header-panel__close { opacity: 0; }
.login-sms-preview p { margin: 0 0 8px; font-size: 18px; }
.login-sms-preview label,
.header-login-panel .login-username,
.header-login-panel .login-password { margin: 0 0 9px; font-size: 14px; }
.login-sms-preview input,
.header-login-panel input[type="text"],
.header-login-panel input[type="password"] { height: 40px; min-height: 40px; margin-top: 4px; padding-inline: 14px; }
.login-sms-preview__button {
	display: flex;
	min-height: 41px;
	align-items: center;
	justify-content: center;
	border-radius: var(--gboneai-radius-pill);
	background: var(--gboneai-color-dark);
	font-size: 0;
}
.login-sms-preview__button::after { content: "SMS"; font-size: 16px; }
.login-separator { display: flex; align-items: center; gap: 10px; margin: 20px 0 10px !important; }
.login-separator::before,
.login-separator::after { content: ""; flex: 1; border-block-start: 1px solid rgba(255,255,255,.25); }
.header-login-panel .login-remember { display: inline-block; margin: 0; font-size: 14px; }
.header-login-panel .login-submit { margin: 8px 0 4px; }
.header-login-panel input[type="submit"] { min-height: 40px; }
.header-login-panel a { font-size: 14px; }

.primary-menu .sub-menu {
	inset-block-start: 34px;
	min-width: 242px;
	padding: 20px 20px 24px;
	border-radius: 0 0 20px 20px;
	box-shadow: none;
}
.primary-menu .sub-menu a {
	padding: 3px 0;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.2;
	white-space: nowrap;
}
.submenu-toggle { width: 20px; height: 28px; margin-inline-start: -24px; opacity: 0; }

.site-footer {
	min-height: 422px;
	padding-block: 64px 8px;
	background: #f1f2f4;
	color: var(--gboneai-color-dark);
}
.site-footer__grid {
	grid-template-columns: 1.25fr 1fr 1fr 1fr 1.25fr;
	grid-template-areas: "newsletter links about contact brand";
	gap: 48px;
	align-items: start;
	direction: ltr;
}
.footer-brand { display: flex; grid-area: brand; order: initial; align-items: center; flex-direction: column; direction: rtl; text-align: center; }
.footer-contact { grid-area: contact; order: initial; direction: rtl; }
.footer-navigation:first-of-type { grid-area: about; direction: rtl; }
.footer-navigation:last-of-type { grid-area: links; direction: rtl; }
.footer-newsletter { grid-area: newsletter; direction: rtl; }
.footer-logo { display: block; width: auto; max-width: 245px; max-height: 72px; object-fit: contain; }
.footer-site-title { max-width: 245px; margin: 0; color: var(--gboneai-color-primary); font-size: 25px; font-weight: 800; line-height: 1.05; }
.footer-remember { display: inline-flex; min-width: 124px; min-height: 46px; margin-top: 10px; padding-inline: 16px; align-items: center; justify-content: center; gap: 9px; border-radius: var(--gboneai-radius-pill); background: var(--gboneai-color-dark); color: #fff; font-size: 26px; font-weight: 700; line-height: 1.4; text-align: center; }
.footer-remember__asset { display: block; width: 16px; height: 28px; }
.footer-remember__image { width: 18px; max-height: 30px; object-fit: contain; }
.footer-brand .button { display: inline-flex; min-width: 193px; min-height: 46px; align-items: center; justify-content: center; margin-top: 17px; font-size: 22px; font-weight: 700; line-height: normal; }
.site-footer h2 { display: block; margin: 8px 0 10px; color: var(--gboneai-color-primary); font-size: 22px; font-weight: 700; line-height: 1; }
.footer-navigation ul { display: grid; gap: 2px; }
.footer-navigation a,
.footer-navigation .menu-item-placeholder { font-size: 18px; font-weight: 400; line-height: 1; }
.footer-navigation a,
.footer-contact a,
.footer-navigation .menu-item-placeholder { color: var(--gboneai-color-dark); text-decoration: none; }
.footer-contact p { display: flex; margin: 8px 0; align-items: center; gap: 10px; font-size: 20px; font-weight: 400; line-height: 1; }
.footer-contact p > svg { flex: 0 0 25px; width: 25px; height: 25px; fill: none; stroke: currentcolor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.footer-social { justify-content: center; gap: 8px; margin-top: 20px; }
.footer-social a { width: 40px; height: 40px; background: #fff; }
.footer-social svg { width: 21px; height: 21px; fill: none; stroke: currentcolor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.newsletter-preview { width: 255px; max-width: 100%; gap: 12px; }
.newsletter-preview span { min-height: 44px; padding: 8px 20px; border-color: var(--gboneai-color-dark); background: #fff; }
.newsletter-privacy { display: flex; width: 255px; max-width: 100%; gap: 6px; align-items: flex-start; margin: 7px 0; font-size: 16px; font-weight: 400; line-height: 1; }
.newsletter-checkbox { flex: 0 0 14px; width: 14px; height: 14px; margin-top: 2px; border: 1px solid var(--gboneai-color-dark); border-radius: 2px; background: #fff; }
.newsletter-privacy a,
.newsletter-privacy__link { color: var(--gboneai-color-primary); text-decoration: underline; }
.newsletter-submit { display: inline-flex; min-width: 102px; min-height: 40px; align-items: center; justify-content: center; border-radius: var(--gboneai-radius-pill); background: var(--gboneai-color-primary); color: #fff; font-size: 20px; font-weight: 400; line-height: normal; cursor: not-allowed; }
.site-footer__bottom {
	display: flex;
	min-height: 62px;
	margin-top: 24px;
	padding-top: 18px;
	align-items: center;
	justify-content: center;
	gap: 12px;
	border-top: 0;
	font-size: 13px;
}
.footer-credits {
	margin: 0;
	font-size: 16px;
	font-weight: 400;
	line-height: normal;
	text-align: center;
}
/* The previous/next links under a single. Same 24 as everything else. */
.post-navigation a {
	display: inline-block;
	padding-block: 4px;
}

/*
 * Pagination had no rule of its own, so a page number was as wide as its glyph -
 * "2" measured 9 x 20. WCAG 2.5.8 asks for 24 square, and a number you have to
 * aim at is worse than that on a phone.
 */
.page-numbers {
	display: inline-flex;
	min-inline-size: 32px;
	min-block-size: 32px;
	align-items: center;
	justify-content: center;
	padding-inline: 6px;
	border-radius: 50px;
	text-decoration: none;
}

a.page-numbers:hover,
a.page-numbers:focus-visible {
	background: var(--gboneai-color-surface);
}

.page-numbers.current {
	background: var(--gboneai-color-dark);
	color: var(--gboneai-color-white);
}

.footer-legal-menu { display: flex; gap: 10px; padding: 0; margin: 0; list-style: none; }
.footer-legal-menu a { color: var(--gboneai-color-dark); }
.back-to-top { width: 55px; height: 55px; min-height: 55px; padding: 0; border-radius: 50%; left: 28px; right: auto; inset-inline-start: auto; inset-block-end: 32px; overflow: hidden; font-size: 0; }
.back-to-top::before { content: "↑"; font-size: 26px; font-weight: 300; }

.side-contact-controls { inset-inline-end: 16px; direction: ltr; gap: 2px; }
.side-contact-control { width: 54px; height: 54px; border-radius: 50%; box-shadow: none; }
.side-contact-control span { display: grid; width: 30px; height: 30px; place-items: center; }
.side-contact-control svg,
.side-contact-control img { display: block; width: 24px; height: 24px; object-fit: contain; }
.side-contact-control svg { fill: none; stroke: #fff; stroke-width: 1.8; }
.side-contact-control--emergency img { width: 30px; height: 15px; }
.side-contact-control--whatsapp { background: #2ee833; }

@media (max-width: 1279px) {
	.site-header__inner { width: min(calc(100% - 2rem), var(--gboneai-container)); padding-inline: 0; grid-template-columns: 1fr auto; }
	.site-branding { grid-column: 1; justify-self: start; }
	.menu-toggle { grid-column: 2; justify-self: end; }
	.header-actions { grid-column: 1 / -1; justify-self: stretch; justify-content: center; }
	.header-login-panel__inner { position: relative; left: auto; right: auto; margin-inline: auto; }
	.site-footer__grid { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-areas: "brand contact" "about links" "newsletter newsletter"; }
}

@media (max-width: 600px) {
	.site-header__inner { position: relative; display: block; min-height: 90px; }
	.site-branding { position: absolute; inset-block-start: 13px; right: 0; left: auto; inset-inline-end: auto; }
	.custom-logo { width: 190px; max-height: 58px; }
	.menu-toggle { position: absolute; inset-block-start: 23px; left: 0; display: inline-flex; }
	.primary-navigation.is-open { position: fixed; inset: 90px 0 auto; max-height: calc(100vh - 90px); overflow: auto; padding: 18px; background: var(--gboneai-color-dark); }
	.primary-menu { gap: 8px; }
	.site-footer { padding-block-start: 42px; }
	.site-footer__grid { grid-template-columns: 1fr; grid-template-areas: "brand" "contact" "about" "links" "newsletter"; gap: 26px; }
	.footer-brand,
	.footer-contact,
	.footer-navigation,
	.footer-newsletter { text-align: center; }
	.site-footer__bottom { flex-direction: column; margin-top: 30px; text-align: center; }
	.side-contact-control { width: 48px; height: 48px; }
	.side-contact-controls { inset-block-start: 290px; inset-block-end: auto; inset-inline-end: 8px; }
}

/* Phase 2A final visual polish. */
.site-header__inner {
	width: 100%;
	max-width: none;
	padding-inline: 32px;
}

.menu-toggle {
	padding-inline: 12px;
}

.footer-remember {
	gap: 12px;
	padding-inline: 17px;
}

.footer-remember__image {
	width: 22px;
	height: 32px;
	max-height: none;
	object-fit: contain;
}

.footer-social {
	gap: 9px;
}

.footer-social a {
	width: 40px;
	height: 40px;
	flex: 0 0 40px;
}

.footer-social svg {
	width: 20px;
	height: 20px;
	stroke-width: 1.75;
}

.footer-social a[aria-label="Facebook"] svg {
	width: 18px;
	height: 20px;
}

.footer-social a[aria-label="TikTok"] svg,
.footer-social a[aria-label="LinkedIn"] svg {
	width: 19px;
	height: 19px;
}

.footer-social .footer-social-link {
	--gboneai-social-icon-size: 38px;
	border: 0;
	border-color: currentcolor;
	background: transparent;
	color: var(--gboneai-color-dark);
	transition:
		color 180ms ease,
		border-color 180ms ease;
}

.footer-social .footer-social-link:hover,
.footer-social .footer-social-link:focus-visible {
	border-color: currentcolor;
	color: var(--gboneai-color-primary);
}

.header-search-form {
	transition: box-shadow 160ms ease;
}

.header-search-form:focus-within {
	box-shadow:
		0 0 0 3px rgba(255, 255, 255, 0.92),
		0 0 0 5px rgba(27, 43, 80, 0.45);
}

.header-search-form input:focus,
.header-search-form input:focus-visible,
.header-search-form input:active {
	outline: 0;
	outline-offset: 0;
}

.login-sms-preview input {
	direction: ltr;
	text-align: right;
	opacity: 1;
	background: #fff;
	color: var(--gboneai-color-dark);
	-webkit-text-fill-color: var(--gboneai-color-dark);
	cursor: text;
}

/* Approved Phase 2A login-panel geometry. */
.header-login-panel__inner {
	width: 344px;
	height: 543px;
	min-height: 543px;
	padding: 20px 33px 18px;
	background: var(--gboneai-panel-blue);
	border-radius: 0 0 20px 20px;
	overflow: hidden;
}

.header-login-panel h2 {
	margin: 0 0 4px;
	font-size: 23px;
	line-height: 1.25;
}

.login-sms-preview p {
	margin: 0 0 10px;
	font-size: 18px;
	line-height: 1.35;
}

.login-sms-preview label,
.header-login-panel .login-username,
.header-login-panel .login-password {
	display: block;
	margin: 0 0 10px;
	font-size: 14px;
	line-height: 1.35;
	text-align: right;
}

.login-sms-preview input,
.header-login-panel input[type="text"],
.header-login-panel input[type="password"] {
	display: block;
	width: 100%;
	height: 40px;
	min-height: 40px;
	padding-inline: 14px;
	margin-top: 6px;
	border: 0;
	border-radius: var(--gboneai-radius-pill);
	background: #fff;
	color: var(--gboneai-color-dark);
}

.login-sms-preview__button {
	width: 100%;
	height: 41px;
	min-height: 41px;
	margin-top: 14px;
	border-radius: var(--gboneai-radius-pill);
}

.login-separator {
	height: 20px;
	line-height: 20px;
}

.header-login-panel form {
	position: static;
}

.header-login-panel .login-remember {
	position: absolute;
	inset-block-start: 416px;
	inset-inline-end: 33px;
	display: flex;
	height: 24px;
	align-items: center;
	gap: 7px;
	margin: 0;
	line-height: 24px;
}

.header-login-panel .login-remember label {
	display: inline-flex;
	align-items: center;
	gap: 7px;
}

.header-login-panel .login-remember input {
	width: 14px;
	height: 14px;
	margin: 0;
}

.login-lost-password {
	position: absolute;
	inset-block-start: 416px;
	inset-inline-start: 34px;
	line-height: 24px;
}

.header-login-panel .login-submit {
	position: absolute;
	inset-block-start: 454px;
	inset-inline: 33px;
	height: 40px;
	margin: 0;
}

.header-login-panel input[type="submit"] {
	width: 100%;
	height: 40px;
	min-height: 40px;
	border-radius: var(--gboneai-radius-pill);
}

.login-registration {
	position: absolute;
	inset-inline: 20px;
	inset-block-end: 17px;
	margin: 0;
	font-size: 14px;
	line-height: 18px;
	text-align: center;
}

.footer-social-link svg,
.footer-social a[aria-label="Facebook"] svg,
.footer-social a[aria-label="TikTok"] svg,
.footer-social a[aria-label="LinkedIn"] svg {
	width: var(--gboneai-social-icon-size);
	height: var(--gboneai-social-icon-size);
	overflow: visible;
	fill: initial;
	stroke: initial;
}

.footer-contact__waze {
	padding-inline-start: 0;
}

.footer-contact__waze a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.footer-contact__waze img {
	flex: 0 0 25px;
	width: 25px;
	height: 23px;
}

.newsletter-preview {
	opacity: 0.82;
}

.newsletter-preview span {
	font-size: 18px;
	font-weight: 400;
	line-height: 1;
}

.newsletter-privacy {
	gap: 8px;
	font-size: 16px;
	line-height: 1;
}

.newsletter-checkbox {
	flex-basis: 16px;
	width: 16px;
	height: 16px;
}

.newsletter-submit {
	min-height: 42px;
	padding-inline: 22px;
}

.site-footer__bottom {
	font-size: 14px;
	line-height: 1.55;
}

.footer-credits {
	max-width: 860px;
}

.side-contact-controls {
	gap: 5px;
	justify-items: end;
}

.side-contact-control {
	display: inline-flex;
	width: 50px;
	height: 50px;
	align-items: center;
	justify-content: flex-start;
	direction: rtl;
	overflow: hidden;
	border-radius: 50px;
	transition: width 180ms ease;
}

.side-contact-control .side-contact-control__icon {
	display: grid;
	flex: 0 0 50px;
	width: 50px;
	height: 50px;
	place-items: center;
}

.side-contact-control__label {
	flex: 1 1 auto;
	overflow: hidden;
	color: #fff;
	font-size: 24px;
	font-weight: 400;
	line-height: 1;
	letter-spacing: normal;
	text-align: right;
	text-decoration: none;
	white-space: nowrap;
	opacity: 0;
	transition: opacity 120ms ease;
}

.side-contact-control img {
	display: block;
	width: 24px;
	height: 24px;
	object-fit: contain;
}

.side-contact-control--emergency img {
	width: 30px;
	height: 15px;
}

@media (min-width: 601px) {
	.side-contact-control--whatsapp:hover,
	.side-contact-control--whatsapp:focus,
	.side-contact-control--whatsapp:focus-visible,
	.side-contact-control--contact:hover,
	.side-contact-control--contact:focus,
	.side-contact-control--contact:focus-visible {
		width: 153px;
	}

	.side-contact-control--emergency:hover,
	.side-contact-control--emergency:focus,
	.side-contact-control--emergency:focus-visible {
		width: 174px;
	}

	.side-contact-control:hover .side-contact-control__label,
	.side-contact-control:focus .side-contact-control__label,
	.side-contact-control:focus-visible .side-contact-control__label {
		opacity: 1;
	}
}

/* Direct active-Figma desktop typography verification: header variants 2–5. */
@media (min-width: 1280px) {
	.primary-menu .sub-menu a {
		font-size: 19px;
		font-weight: 400;
		line-height: 1.4;
		letter-spacing: normal;
		text-transform: none;
		text-decoration: none;
		text-align: right;
	}

	.header-search-form input {
		font-size: 20px;
		font-weight: 400;
		line-height: normal;
		letter-spacing: normal;
		text-transform: none;
		text-decoration: none;
		text-align: right;
	}

	.header-action--welcome {
		font-size: 20px;
		font-weight: 400;
		line-height: normal;
		letter-spacing: normal;
		text-transform: none;
		text-decoration: none;
		text-align: center;
	}

	.header-login-panel h2 {
		font-size: 24px;
		font-weight: 700;
		line-height: normal;
		letter-spacing: normal;
		text-transform: none;
		text-decoration: none;
		text-align: center;
	}

	.login-sms-preview p {
		font-size: 20px;
		font-weight: 400;
		line-height: normal;
		letter-spacing: normal;
		text-transform: none;
		text-decoration: none;
		text-align: right;
	}

	.login-sms-preview label,
	.header-login-panel .login-username,
	.header-login-panel .login-password {
		font-size: 16px;
		font-weight: 300;
		line-height: 1;
		letter-spacing: 0.16px;
		text-transform: none;
		text-decoration: none;
		text-align: right;
	}

	.login-sms-preview__button::after,
	.header-login-panel input[type="submit"] {
		font-size: 20px;
		font-weight: 400;
		line-height: normal;
		letter-spacing: normal;
		text-transform: none;
		text-decoration: none;
		text-align: center;
	}

	.login-separator {
		font-size: 18px;
		font-weight: 400;
		line-height: normal;
		letter-spacing: normal;
		text-transform: none;
		text-decoration: none;
		text-align: center;
	}

	.header-login-panel .login-remember,
	.login-lost-password,
	.login-registration {
		font-size: 17px;
		font-weight: 400;
		line-height: normal;
		letter-spacing: normal;
		text-transform: none;
		text-align: right;
	}

	.login-lost-password,
	.login-registration a {
		text-decoration: underline;
	}

	.header-login-panel .login-lost-password,
	.header-login-panel .login-registration a {
		font-size: 17px;
	}

	.login-registration {
		text-align: center;
	}
}

@media (min-width: 1500px) and (max-width: 1599px) {
	.site-header__inner {
		grid-template-columns: 380px minmax(0, 1fr) 250px;
		gap: 12px;
	}

	.primary-menu {
		gap: 16px;
	}

	.header-actions {
		gap: 12px;
	}

	.header-action--join {
		padding-inline: 18px;
	}
}

@media (min-width: 1390px) and (max-width: 1499px) {
	.site-header__inner {
		grid-template-columns: 356px minmax(0, 1fr) 240px;
		gap: 8px;
	}

	.primary-menu {
		gap: 7px;
	}

	.header-actions {
		gap: 8px;
	}

	.site-header--logged-in .header-actions {
		width: 356px;
	}

	.header-action--join {
		padding-inline: 16px;
	}
}

@media (max-width: 1389px) {
	.site-header__inner {
		width: min(calc(100% - 3rem), var(--gboneai-container));
		grid-template-columns: auto minmax(0, 1fr);
		grid-template-rows: auto auto;
		padding-block: 12px;
	}

	.site-branding {
		grid-column: 2;
		grid-row: 1;
		justify-self: end;
	}

	.menu-toggle {
		display: inline-flex;
		grid-column: 1;
		grid-row: 1;
		justify-self: start;
	}

	.primary-navigation {
		display: none;
		grid-column: 1 / -1;
		grid-row: 3;
		justify-self: stretch;
	}

	.primary-navigation.is-open {
		display: block;
		max-height: calc(100vh - 90px);
		overflow: auto;
	}

	.primary-menu {
		align-items: stretch;
		flex-direction: column;
		padding-block: 1rem;
		border-block-start: 1px solid rgba(255, 255, 255, 0.2);
	}

	.primary-menu .menu-item-has-children {
		display: grid;
		grid-template-columns: 1fr auto;
	}

	.primary-menu .sub-menu {
		position: static;
		grid-column: 1 / -1;
		width: 100%;
		min-width: 0;
		transform: none;
		border-radius: 12px;
	}

	.primary-menu a {
		display: block;
		min-height: 44px;
		padding: 0.6rem;
	}

	.header-actions,
	.site-header--logged-in .header-actions {
		width: auto;
		grid-column: 1 / -1;
		grid-row: 2;
		justify-self: stretch;
		justify-content: center;
	}

	.site-header__inner > .header-actions {
		display: none;
	}

	.primary-navigation .site-navigation__mobile-divider {
		display: block;
		margin-block: 0.5rem 0.875rem;
		border-block-start: 1px solid rgba(255, 255, 255, 0.22);
	}

	.primary-navigation .header-actions,
	.site-header--logged-in .primary-navigation .header-actions {
		display: flex;
		width: 100%;
		padding-block: 0 0.875rem;
		align-items: stretch;
		flex-direction: column;
		gap: 0.3rem;
		white-space: normal;
	}

	.primary-navigation .header-action {
		width: 100%;
		min-height: 48px;
		max-width: none;
		padding: 0.65rem 0.875rem;
		justify-content: flex-start;
		border-radius: 8px;
		overflow: visible;
		text-align: start;
		text-overflow: clip;
	}

	.primary-navigation .header-action--welcome,
	.primary-navigation .header-action--login,
	.primary-navigation .header-action--search {
		background: transparent;
	}
}

@media (max-width: 600px) {
	.site-header__inner {
		width: calc(100% - 28px);
	}

	.menu-toggle {
		gap: 7px;
		padding-inline: 10px;
	}

	.site-footer {
		position: relative;
	}

	.side-contact-controls {
		position: absolute;
		inset-block-start: -156px;
		inset-block-end: auto;
		inset-inline-end: 8px;
		gap: 5px;
		transform: none;
	}

	.side-contact-control {
		width: 48px;
		height: 48px;
		border-radius: 50%;
	}

	.side-contact-control .side-contact-control__icon {
		flex-basis: 48px;
		width: 48px;
		height: 48px;
	}

	.side-contact-control .side-contact-control__label {
		display: none;
	}

	.side-contact-control img {
		width: 23px;
		height: 23px;
	}

	.side-contact-control--emergency img {
		width: 30px;
		height: 15px;
	}

	.footer-remember__image {
		width: 23px;
		height: 33px;
	}

	.newsletter-preview,
	.newsletter-privacy {
		width: min(100%, 300px);
		margin-inline: auto;
		text-align: start;
	}

	.newsletter-submit {
		min-width: 112px;
	}

	.site-footer__bottom {
		gap: 14px;
		padding-inline: 8px;
	}

	.footer-credits {
		max-width: 32rem;
		text-wrap: pretty;
	}
}

@media (prefers-reduced-motion: reduce) {
	.footer-social-link,
	.side-contact-control,
	.side-contact-control__label {
		transition-duration: 0.01ms;
	}
}

/* Phase 2B editorial home page. */
.home .gboneai-content {
	max-width: none;
	padding-inline: 0;
	padding-block-start: 0;
}

.home .entry-content {
	margin: 0;
}

.home .entry-content > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

.home-hero {
	position: relative;
	min-height: 631px;
	overflow: hidden;
	background: var(--gboneai-color-dark);
	color: #fff;
}

.home-hero::before {
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 24% 70%, rgba(70, 102, 175, 0.6), transparent 30%),
		linear-gradient(90deg, rgba(27, 43, 80, 0.6), rgba(27, 43, 80, 0.98) 60%);
	content: "";
}

.home-hero__inner {
	position: relative;
	width: min(calc(100% - 64px), 1660px);
	max-width: none;
	min-height: 631px;
	margin-inline: auto;
}

.home-hero__people {
	position: absolute;
	inset-block: 0;
	inset-inline-start: -80px;
	width: 690px;
	max-width: none;
}

.home-hero__people img {
	position: absolute;
	inset-block-end: 0;
	display: block;
	object-fit: contain;
	object-position: bottom;
}

.home-hero__man {
	inset-inline-start: -20px;
	width: 390px;
	max-width: none;
}

.home-hero__woman {
	inset-inline-start: 210px;
	width: 460px;
}

.home-hero__title {
	position: absolute;
	inset-block-start: 72px;
	inset-inline-end: 0;
	width: min(1025px, 62vw);
	max-width: none;
	margin: 0;
	color: #fff;
	font-size: clamp(48px, 4.2vw, 80px);
	font-weight: 700;
	line-height: 0.9;
	text-align: right;
}

.home-stats {
	position: absolute;
	inset-inline-end: 0;
	inset-block-end: 84px;
	max-width: none;
	gap: 50px;
}

.home-stat {
	--stat-color: var(--gboneai-color-primary);
	display: grid;
	width: 250px;
	aspect-ratio: 1;
	place-content: center;
	padding: 38px;
	border: 30px solid var(--stat-color);
	border-inline-start-color: transparent;
	border-radius: 50%;
	text-align: center;
	transform: rotate(8deg);
}

.home-stat > * {
	transform: rotate(-8deg);
}

.home-stat h2,
.home-stat p {
	margin: 0;
}

.home-stat h2 {
	color: var(--stat-color);
	font-size: 64px;
	line-height: 1;
}

.home-stat p {
	color: #f3f3f5;
	font-size: 20px;
	line-height: 1;
}

.home-stat--events { --stat-color: var(--gboneai-color-accent); }
.home-stat--members { --stat-color: #1fa9ab; }

.home-promotion .wp-block-button__link,
.home-join-banner .wp-block-button__link {
	border-radius: 50px;
	background: var(--gboneai-color-primary);
	color: #fff;
	font-size: 20px;
}

.home-arms {
	padding: 52px 32px 84px;
	background: #f7f8fa;
}

.home-section-title {
	margin-block: 0 50px;
	color: var(--gboneai-color-dark);
	font-size: clamp(42px, 3.2vw, 60px);
	line-height: 0.9;
}

.home-arm-grid {
	gap: 40px;
}

.home-arm-card {
	position: relative;
	min-height: 474px;
	overflow: hidden;
	border-radius: 20px;
	background: #fff;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
}

.home-arm-card figure,
.home-arm-card img {
	width: 100%;
	height: 100%;
	margin: 0;
}

.home-arm-card img {
	min-height: 474px;
	object-fit: cover;
}

.home-arm-card__body {
	position: absolute;
	inset: auto 0 0;
	min-height: 134px;
	padding: 18px 25px;
	background: rgba(27, 43, 80, 0.96);
	color: #fff;
	text-align: right;
}

.home-arm-card--benefits .home-arm-card__body { background: rgba(1, 55, 252, 0.96); }
.home-arm-card--events .home-arm-card__body { background: rgba(252, 172, 11, 0.96); }
.home-arm-card--training .home-arm-card__body { background: rgba(31, 169, 171, 0.96); }

.home-arm-card h3,
.home-arm-card p {
	margin: 0;
}

.home-arm-card h3 {
	font-size: 30px;
	line-height: 0.95;
}

.home-arm-card p {
	margin-block-start: 6px;
	font-size: 17px;
	line-height: 1.1;
}

.home-promotion {
	position: relative;
	display: grid;
	grid-template-columns: 31.5% 68.5%;
	min-height: 542px;
	margin-block: 0 135px;
	overflow: hidden;
	border-radius: 20px;
	background: var(--gboneai-color-dark);
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
	color: #fff;
	direction: ltr;
}

.home-promotion__content {
	z-index: 2;
	grid-column: 1;
	padding: 52px 54px;
	direction: rtl;
}

.home-promotion__content h2 {
	margin: 0;
	font-size: 30px;
}

.home-promotion__content p {
	font-size: 22px;
	line-height: 1.3;
}

.home-promotion__visual {
	position: relative;
	grid-column: 2;
	overflow: hidden;
	direction: rtl;
}

.home-promotion__visual > img:first-child {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.home-promotion__logo {
	position: absolute;
	inset-block-start: 70px;
	inset-inline-start: 90px;
	width: 90px;
	height: 105px;
	object-fit: contain;
}

.home-promotion__controls {
	display: flex;
	gap: 12px;
	margin-block-start: 64px;
}

.home-promotion__controls button {
	width: 48px;
	height: 48px;
	border: 1px solid #fff;
	border-radius: 10px;
	background: transparent;
	color: #fff;
	font-size: 24px;
}

.home-news {
	padding: 160px 32px 130px;
	background: linear-gradient(180deg, #1043ff, #131f3c);
	color: #fff;
}

.home-news .home-section-title {
	color: #fff;
}

.home-news-grid {
	gap: 40px;
}

.home-news-card {
	position: relative;
	min-height: 590px;
	overflow: hidden;
	border-radius: 20px;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
}

.home-news-card figure,
.home-news-card img {
	width: 100%;
	height: 100%;
	margin: 0;
}

.home-news-card img {
	min-height: 590px;
	object-fit: cover;
}

.home-news-card__body {
	position: absolute;
	inset: auto 13px 17px;
	padding: 25px 30px;
	border-radius: 15px;
	background: rgba(16, 67, 255, 0.95);
	color: #fff;
}

.home-news-card__body p,
.home-news-card__body h3 {
	margin: 0;
}

.home-news-card__body h3 {
	margin-block-start: 10px;
	font-size: 24px;
	line-height: 0.95;
}

.home-quick-links {
	gap: 10px;
	padding-block: 85px 70px;
}

.home-quick-link {
	text-align: center;
}

.home-quick-link figure {
	display: grid;
	width: 164px;
	height: 164px;
	place-items: center;
	padding: 18px;
	margin: 0 auto 22px;
	border: 2px solid var(--gboneai-color-primary);
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.25);
}

.home-quick-link:nth-child(2) figure { border-color: var(--gboneai-color-accent); }
.home-quick-link:nth-child(3) figure { border-color: #1fa9ab; }
.home-quick-link:nth-child(4) figure { border-color: #777; }

.home-quick-link img {
	width: 120px;
	height: 120px;
	object-fit: contain;
}

.home-quick-link p {
	max-width: 220px;
	margin-inline: auto;
	font-size: 24px;
	line-height: 0.95;
}

.home-quick-link a {
	color: var(--gboneai-color-dark);
	text-decoration: none;
}

.home-closing {
	grid-template-columns: minmax(0, 2.05fr) minmax(360px, 1fr);
	gap: 24px;
	padding-block-end: 104px;
	direction: rtl;
}

.home-join-banner,
.home-contact-preview {
	min-height: 472px;
	border-radius: 20px;
}

.home-join-banner {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(circle at 20% 20%, transparent 0 115px, var(--gboneai-color-accent) 116px 145px, transparent 146px),
		radial-gradient(circle at 100% 30%, transparent 0 130px, var(--gboneai-color-primary) 131px 165px, transparent 166px),
		var(--gboneai-color-dark);
	color: #fff;
}

.home-join-banner__person {
	position: absolute;
	inset-block-end: 0;
	inset-inline-start: -80px;
	width: 620px;
	max-width: none;
}

.home-join-banner__content {
	position: relative;
	z-index: 1;
	width: 43%;
	padding-block-start: 125px;
	margin-inline-start: auto;
	margin-inline-end: 8%;
	text-align: right;
}

.home-join-banner h2,
.home-join-banner p {
	margin: 0;
}

.home-join-banner h2 {
	font-size: 60px;
	line-height: 0.9;
}

.home-join-banner p {
	margin-block: 16px;
	font-size: 30px;
	line-height: 1.1;
}

.home-contact-preview {
	padding: 26px 34px 28px;
	background: var(--gboneai-color-primary);
	color: #fff;
}

.home-contact-preview h2,
.home-contact-preview h3,
.home-contact-preview p {
	margin: 0;
}

.home-contact-preview h2 {
	font-size: 38px;
	line-height: 1;
}

.home-contact-preview h3,
.home-contact-preview p {
	font-size: 22px;
	line-height: 1.1;
}

.home-contact-preview__fields {
	display: grid;
	gap: 12px;
	margin-block-start: 18px;
}

.home-contact-preview__fields input:not([type="checkbox"]) {
	width: 100%;
	height: 45px;
	padding-inline: 23px;
	border: 0;
	border-radius: 50px;
	background: #fff;
	color: #000;
	font: inherit;
	text-align: right;
	opacity: 1;
}

.home-contact-preview__fields label {
	color: #fff;
	font-size: 16px;
	text-align: center;
}

.home-contact-preview__fields button {
	justify-self: center;
	min-width: 126px;
	min-height: 46px;
	border: 0;
	border-radius: 50px;
	background: var(--gboneai-color-accent);
	color: #fff;
	font-size: 20px;
	opacity: 1;
}

@media (max-width: 1599px) {
	.home-hero__title {
		width: 58%;
		font-size: clamp(46px, 4.2vw, 64px);
	}

	.home-stats {
		gap: 18px;
	}

	.home-stat {
		width: 210px;
		border-width: 24px;
	}

	.home-stat h2 {
		font-size: 52px;
	}
}

@media (max-width: 1389px) {
	.home-hero__inner {
		width: min(calc(100% - 48px), 1280px);
	}

	.home-hero__title {
		width: 70%;
		font-size: clamp(46px, 5vw, 68px);
	}

	.home-arms .home-arm-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.home-promotion {
		margin-inline: 32px;
	}

	.home-closing {
		grid-template-columns: 1.6fr 1fr;
		margin-inline: 24px;
	}
}

@media (max-width: 1023px) {
	.home-hero {
		min-height: 780px;
	}

	.home-hero__inner {
		min-height: 780px;
	}

	.home-hero__title {
		inset-block-start: 55px;
		width: 100%;
		text-align: center;
	}

	.home-hero__people {
		inset-inline-start: -160px;
		opacity: 0.72;
	}

	.home-stats {
		inset-inline: 0;
		inset-block-end: 50px;
		justify-content: center;
	}

	.home-stat {
		width: 190px;
	}

	.home-promotion.wp-block-group {
		grid-template-columns: 1fr;
	}

	.home-promotion__content,
	.home-promotion__visual {
		grid-column: 1;
	}

	.home-promotion__content {
		z-index: 2;
		background: rgba(27, 43, 80, 0.9);
	}

	.home-promotion__visual {
		position: absolute;
		inset: 0;
	}

	.home-news .home-news-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.home-news-card:last-child {
		grid-column: 1 / -1;
	}

	.home-quick-links.wp-block-group {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.home-closing.wp-block-group {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 767px) {
	.home-hero {
		min-height: 830px;
	}

	.home-hero__inner {
		width: calc(100% - 28px);
		min-height: 830px;
	}

	.home-hero__title {
		font-size: 42px;
	}

	.home-hero__people {
		inset-inline-start: -250px;
		transform: scale(0.8);
		transform-origin: bottom left;
	}

	.home-stats {
		gap: 8px;
	}

	.home-stat {
		width: 145px;
		padding: 20px;
		border-width: 18px;
	}

	.home-stat h2 {
		font-size: 38px;
	}

	.home-stat p {
		font-size: 15px;
	}

	.home-arms,
	.home-news {
		padding-inline: 18px;
	}

	.home-arms .home-arm-grid,
	.home-news .home-news-grid {
		grid-template-columns: 1fr;
	}

	.home-news-card:last-child {
		grid-column: auto;
	}

	.home-promotion {
		min-height: 570px;
		margin: 0 14px 80px;
	}

	.home-promotion__content {
		padding: 40px 30px;
	}

	.home-news {
		padding-block: 80px;
	}

	.home-quick-links {
		padding-inline: 14px;
	}

	.home-quick-link p {
		font-size: 20px;
	}

	.home-closing {
		margin-inline: 14px;
	}

	.home-join-banner__person {
		inset-inline-start: -190px;
		width: 600px;
		opacity: 0.7;
	}

	.home-join-banner__content {
		width: 62%;
		margin-inline-end: 5%;
	}

	.home-join-banner h2 {
		font-size: 45px;
	}
}

@media (max-width: 479px) {
	.home-hero {
		min-height: 960px;
	}

	.home-hero__inner {
		min-height: 960px;
	}

	.home-hero__title {
		font-size: 36px;
	}

	.home-hero__people {
		inset-block-start: 130px;
		inset-inline-start: -330px;
	}

	.home-stats {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
	}

	.home-stat {
		width: 105px;
		padding: 10px;
		border-width: 12px;
	}

	.home-stat h2 {
		font-size: 29px;
	}

	.home-stat p {
		font-size: 12px;
	}

	.home-section-title {
		font-size: 38px;
	}

	.home-arm-card {
		min-height: 420px;
	}

	.home-arm-card img {
		min-height: 420px;
	}

	.home-arm-card__body {
		min-height: 150px;
	}

	.home-news-card,
	.home-news-card img {
		min-height: 500px;
	}

	.home-quick-links.wp-block-group {
		grid-template-columns: 1fr;
	}

	.home-join-banner__content {
		width: 90%;
		margin-inline: auto;
		padding-inline: 20px;
		text-align: center;
	}

	.home-join-banner__person {
		opacity: 0.28;
	}

	.home-contact-preview {
		padding-inline: 20px;
	}
}

/* Phase 2B home-page correction layer. */
.home .gboneai-content,
.home .entry-content {
	width: 100%;
	max-width: none;
}

/*
 * On the home page the content container is already the full viewport width, so
 * an alignfull child needs none of the 100vw-and-pull-back trick above - it just
 * needs to be left alone. Scoped to .home, because everywhere else the container
 * IS the 1040 column and the trick is what makes full-bleed work at all.
 *
 * This has to out-rank [dir="rtl"] .gboneai-content .alignfull, which is why the
 * transform is flagged rather than merely later in the file.
 *
 * It replaces a rule that keyed on body.home[dir="rtl"] and therefore never
 * matched anything: WordPress puts dir on <html> and gives the body the class
 * "rtl", so the attribute was never on the element the selector tested.
 */
.home .gboneai-content > .alignfull,
.home .entry-content > .alignfull {
	width: 100%;
	max-width: 100%;
	margin-inline: 0 !important;
	transform: none !important;
}

/*
 * The same trick, one level in. An alignwide block inside a full-bleed group is
 * already in a container the width of the viewport, so the 100vw-and-pull-back
 * breakout above has nothing to break out of - it just moves the block half its
 * own width sideways. Measured on the news band: the heading landed at x=960 and
 * ran to 2360, well off the page.
 *
 * This is the third time this pattern has bitten. The breakout assumes its
 * parent is the 1040 measure, and says so nowhere.
 */
.gboneai-content .alignfull .alignwide {
	width: min(calc(100vw - (var(--gboneai-gutter) * 2)), var(--gboneai-container));
	max-width: 100%;
	margin-inline: auto !important;
	transform: none !important;
}

.home-hero {
	min-height: 753px;
	overflow: visible;
	background: radial-gradient(circle at 18% 50%, rgba(70, 102, 175, 0.65), transparent 36%), var(--gboneai-color-dark);
}

.home-hero__inner {
	position: relative;
	width: min(100%, 1920px);
	min-height: 753px;
	margin-inline: auto;
}

.home-hero__people {
	position: absolute;
	inset: 0 auto 0 0;
	width: 676px;
	height: 753px;
	margin: 0;
	pointer-events: none;
}

.home-hero__people figure {
	position: absolute;
	margin: 0;
}

.home-hero__man {
	inset: 18px auto auto 39px;
	width: 491px;
	height: 613px;
}

.home-hero__man img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center bottom;
}

.home-hero__woman {
	inset: 17px auto auto 230px;
	width: 443px;
	height: 614px;
}

.home-hero__woman img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center bottom;
}

.home-hero__title {
	position: absolute;
	inset: 72px 100px auto auto;
	width: min(860px, calc(100% - 820px));
	margin: 0;
	text-align: right;
}

.home-stats {
	position: absolute;
	inset: 257px 75px auto auto;
	display: flex;
	flex-wrap: nowrap !important;
	flex-direction: row;
	gap: 20px;
	width: 930px;
	direction: rtl;
}

.home-stat {
	flex: 0 0 290px;
	width: 290px;
	max-width: 290px;
	height: 290px;
	min-height: 290px;
	box-sizing: border-box;
}

.home-stat__value,
.home-stat h2 {
	font-size: 80px;
	line-height: 1;
}

.home-stat p.home-stat__value {
	font-size: 80px;
	line-height: 1;
}


.home-arm-card {
	height: 474px;
	min-height: 474px;
}

.home-arm-card > figure,
.home-arm-card > figure img {
	height: 474px;
	min-height: 474px;
}

.home-arm-card::before {
	content: "";
	position: absolute;
	z-index: 1;
	width: 178px;
	height: 178px;
	border: 20px solid currentColor;
	border-radius: 50%;
	opacity: 0.95;
	pointer-events: none;
}

.home-arm-card--professional::before {
	inset: 20px 38px auto auto;
	color: var(--gboneai-color-dark);
}

.home-arm-card--benefits::before {
	inset: 10px auto auto 80px;
	color: var(--gboneai-color-primary);
}

.home-arm-card--events::before {
	inset: 16px 18px auto auto;
	color: var(--gboneai-color-accent);
}

.home-arm-card--training::before {
	inset: 20px auto auto 48px;
	color: var(--gboneai-color-turquoise);
}

.home-arm-card > figure {
	position: relative;
	z-index: 2;
}

.home-arm-card--professional img {
	object-position: 58% 18%;
}

.home-arm-card--benefits img {
	object-position: 52% 22%;
}

.home-arm-card--events img {
	object-position: 54% 28%;
}

.home-arm-card--training img {
	object-position: 58% 26%;
}

.home-arm-card__body {
	z-index: 3;
	min-height: 134px;
	padding: 20px 25px;
}

.home-arm-card__body h3 {
	font-size: 32px;
	line-height: 0.9;
	letter-spacing: 0.32px;
}

.home-arm-card__body p {
	font-size: 18px;
	line-height: 1.1;
}

.home-promotion {
	position: relative;
	display: grid;
	grid-template-columns: 440px minmax(0, 959px);
	width: min(1399px, calc(100% - 40px));
	height: 542px;
	min-height: 542px;
	padding: 0;
	overflow: hidden;
	direction: ltr;
}

.home-promotion__content {
	position: relative;
	z-index: 3;
	width: 440px;
	height: 542px;
	padding: 58px 54px;
	direction: rtl;
}

.home-promotion__content p {
	font-size: 22px;
	line-height: 1.3;
}

.home-placeholder-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: max-content;
	min-height: 44px;
	margin-top: 15px;
	padding: 10px 20px;
	border-radius: 999px;
	background: rgba(16, 67, 255, 0.58);
	color: #fff;
	cursor: not-allowed;
}

.home-promotion__visual {
	position: relative;
	width: 100%;
	height: 542px;
	margin: 0;
	overflow: hidden;
}

.home-promotion__art {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
}

.home-promotion__art img {
	position: absolute;
	inset-block-start: 0;
	inset-inline-start: -22%;
	width: 144%;
	max-width: none;
	height: auto;
	min-height: 0;
	object-fit: initial;
}

.home-promotion__logo {
	position: absolute;
	z-index: 2;
	inset: 80px auto auto 165px;
	width: 60px;
	height: 70px;
	margin: 0;
}

.home-promotion__logo img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.home-promotion__controls,
.home-news__controls {
	position: absolute;
	display: flex;
	gap: 10px;
	direction: ltr;
	pointer-events: none;
}

.home-promotion__controls [aria-disabled="true"],
.home-news__controls [aria-disabled="true"] {
	opacity: 0.48;
	cursor: default;
	pointer-events: none;
}

.home-promotion__controls {
	inset: auto 54px 37px auto;
}

.home-promotion__controls p,
.home-news__controls p {
	display: grid;
	width: 48px;
	height: 48px;
	margin: 0;
	place-items: center;
	border: 1px solid rgba(255, 255, 255, 0.45);
	border-radius: 10px;
	color: rgba(255, 255, 255, 0.55);
	cursor: not-allowed;
}

.home-news {
	position: relative;
	min-height: 1064px;
	padding-block: 178px 120px;
}

.home-news-grid {
	margin-top: 56px;
}

.home-news-card,
.home-news-card img {
	height: 628px;
	min-height: 628px;
}

.home-news__date {
	font-size: 18px !important;
	line-height: 1;
	letter-spacing: 0.18px;
	unicode-bidi: isolate;
}

.home-news__controls {
	inset: 178px auto auto max(20px, calc((100% - 1400px) / 2));
}

.home-quick-links {
	grid-template-columns: repeat(4, 290px) !important;
	justify-content: space-between;
	direction: rtl;
}

.home-quick-link {
	width: 290px;
	height: 254px;
	opacity: 0.78;
	cursor: not-allowed;
}

.home-quick-link figure,
.home-quick-link img {
	width: 164px;
	height: 164px;
}

.home-quick-link p {
	width: 218px;
	margin-inline: auto;
	font-size: 24px;
	line-height: 0.9;
	letter-spacing: 0.24px;
}

.home-quick-link__chevron {
	display: inline-block;
	direction: ltr;
}

.home-closing {
	grid-template-columns: minmax(0, 917px) minmax(0, 444px) !important;
	gap: 24px;
	direction: rtl;
	min-height: 472px;
	padding: 0;
}

.home-join-banner {
	width: 917px;
	height: 472px;
	min-height: 472px;
}

.home-join-banner__person {
	position: absolute;
	inset: 0 auto 0 0;
	width: 520px;
	height: 472px;
	margin: 0;
	opacity: 1;
	overflow: visible;
}

.home-join-banner__person img {
	position: absolute;
	inset: 0 auto 0 -470px;
	width: 1291px;
	max-width: none;
	height: 472px;
	object-fit: fill;
}

.home-join-banner__content {
	position: relative;
	z-index: 2;
	width: 365px;
	margin: 0 80px 0 auto;
	padding-top: 92px;
	text-align: right;
}

.home-contact-preview {
	width: 444px;
	height: 472px;
	min-height: 472px;
	padding: 27px 34px 28px;
}

.home-contact-preview > p {
	font-size: 24px;
}

.home-contact-preview__fields {
	width: 336px;
	margin-inline: auto;
}

.home-contact-preview__fields input:not([type="checkbox"]) {
	width: 336px;
	height: 45px;
	opacity: 0.82;
	cursor: not-allowed;
}

.home-contact-preview__fields input[type="email"] {
	direction: ltr;
	text-align: right;
}

.home-contact-preview__privacy {
	display: flex;
	align-items: center;
	gap: 7px;
	opacity: 0.82;
}

.home-contact-preview__privacy span[role="link"] {
	text-decoration: underline;
	text-underline-offset: 2px;
	cursor: not-allowed;
}

.home-contact-preview__fields button:disabled {
	opacity: 0.68;
	cursor: not-allowed;
}

.home-contact-preview__note {
	margin: 4px 0 6px;
	font-size: 14px !important;
	color: rgba(255, 255, 255, 0.9);
	text-align: center;
}

@media (max-width: 1389px) {
	.home-hero {
		min-height: auto;
	}

	.home-hero__inner {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(320px, 45%);
		grid-template-areas:
			"title people"
			"stats people";
		min-height: 650px;
		padding: 56px 32px 32px;
		direction: rtl;
	}

	.home-hero__title {
		position: static;
		grid-area: title;
		width: auto;
	}

	.home-stats {
		position: static;
		grid-area: stats;
		width: auto;
		gap: 12px;
	}

	.home-stat {
		flex-basis: clamp(180px, 22vw, 250px);
		width: clamp(180px, 22vw, 250px);
		height: clamp(180px, 22vw, 250px);
		min-height: 0;
	}

	.home-hero__people {
		position: relative;
		inset: auto;
		grid-area: people;
		width: 100%;
		height: 100%;
	}

	.home-hero__man,
	.home-hero__woman {
		inset: auto;
		bottom: 0;
	}

	.home-hero__man {
		left: 0;
		width: 62%;
		height: 95%;
	}

	.home-hero__woman {
		right: 0;
		width: 68%;
		height: 78%;
	}

	.home-promotion {
		grid-template-columns: minmax(330px, 34%) minmax(0, 66%);
		width: calc(100% - 40px);
	}

	.home-promotion__content {
		width: 100%;
	}

	.home-closing {
		grid-template-columns: minmax(0, 2.05fr) minmax(360px, 1fr) !important;
	}

	.home-join-banner,
	.home-contact-preview {
		width: 100%;
	}
}

@media (max-width: 900px) {
	.home-hero__inner {
		grid-template-columns: 1fr;
		grid-template-areas:
			"title"
			"people"
			"stats";
		min-height: auto;
	}

	.home-hero__people {
		height: 420px;
	}

	.home-stats {
		justify-content: center;
	}

	.home-promotion {
		display: flex;
		flex-direction: column-reverse;
		height: auto;
	}

	.home-promotion__visual,
	.home-promotion__content {
		width: 100%;
		height: auto;
		min-height: 420px;
	}

	.home-promotion__art img {
		right: auto;
		left: 50%;
		width: auto;
		height: 1409px;
		transform: translateX(-50%);
	}

	.home-closing {
		grid-template-columns: 1fr !important;
	}

	.home-join-banner,
	.home-contact-preview {
		max-width: 100%;
	}
}

@media (max-width: 600px) {
	.home-hero__inner {
		padding-inline: 20px;
	}

	.home-hero__people {
		height: 330px;
	}

	.home-stats {
		flex-wrap: wrap !important;
	}

	.home-stat {
		flex-basis: 210px;
		width: 210px;
		height: 210px;
	}

	.home-stat__value,
	.home-stat h2 {
		font-size: 58px;
	}

	.home-promotion {
		width: calc(100% - 24px);
	}

	.home-promotion__content {
		padding: 32px 24px 100px;
	}

	.home-quick-links {
		grid-template-columns: 1fr !important;
		justify-items: center;
	}

	.home-join-banner {
		height: 520px;
	}

	.home-join-banner__person {
		width: 100%;
		opacity: 0.34;
	}

	.home-join-banner__content {
		width: auto;
		margin: 0;
		padding: 100px 24px 0;
		text-align: center;
	}

	.home-contact-preview {
		height: auto;
		padding-inline: 20px;
	}

	.home-contact-preview__fields,
	.home-contact-preview__fields input:not([type="checkbox"]) {
		width: 100%;
	}
}

/*
 * Home page: restore the content measure for blocks that did not ask to break out.
 *
 * Three layers above release `.home .gboneai-content` and `.home .entry-content`
 * to full width, so the hero and the full-bleed sections can span the viewport.
 * That release is correct for them, but it also removed the measure from every
 * ordinary block, leaving a heading or a paragraph 1385px wide - unreadable, and
 * flush against the edge with no gutter.
 *
 * Constrain the children instead of the container: anything that explicitly asked
 * for a wider band (alignwide, alignfull) or is a known full-bleed section keeps
 * the width it asked for; everything else gets the 1040px measure back.
 */
.home .entry-content > *:not(.alignwide):not(.alignfull):not(.home-hero),
.home .gb-home-grey > *:not(.alignwide):not(.alignfull) {
	max-inline-size: var(--gboneai-content);
	margin-inline: auto;
}

/* The gutter still has to exist on narrow viewports, where 1040px is not the
   binding constraint and the block would otherwise touch both edges. */
@media (max-width: 1104px) {
	.home .entry-content > *:not(.alignwide):not(.alignfull):not(.home-hero),
	.home .gb-home-grey > *:not(.alignwide):not(.alignfull) {
		max-inline-size: calc(100% - (var(--gboneai-gutter) * 2));
	}
}
