/*
 * Cognixia premium layer (Nov 2026), inspired by the Hyqoo build.
 * Everything is scoped to body.cx-premium, which inc/cognixia-premium.php adds.
 * Remove that one body class (or the enqueue) to switch the whole layer off.
 *
 * Rules kept from the Collabera brand guide: flat surfaces (no drop shadows, no gradients),
 * Tenure Green #05262B, teal #27717C, mint #B1F4DC. Gold is used for text accents only, never as a
 * background; photos sit in plain rectangles.
 * No copy is added or changed; photos are decorative (alt="").
 */

body.cx-premium {
	--cx-ease: cubic-bezier(0.22, 1, 0.36, 1);   /* enter / hover */
	--cx-ease-out: cubic-bezier(0.16, 1, 0.3, 1); /* long reveals */
	--cx-ring: inset 0 0 0 1px var(--cognixia-primary);
}

/* ------------------------------------------------------------------
 * 1. Buttons: a colour fill sweeps up from the bottom, the arrow nudges right.
 *    cognixia-premium.js adds .cx-sweep to link buttons and stores each one's
 *    resting background in --cx-btn-bg, so every button variant keeps its own
 *    colour while the fill sweeps in. Without JS, buttons behave as before.
 * ---------------------------------------------------------------- */
body.cx-premium .cx-sweep {
	position: relative;
	z-index: 0;
	overflow: hidden;
	isolation: isolate;
	transition: color 0.35s var(--cx-ease), border-color 0.35s var(--cx-ease), transform 0.25s var(--cx-ease);
}
body.cx-premium .cx-sweep::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--cx-btn-fill, var(--cognixia-dark));
	transform: translateY(101%);
	transition: transform 0.45s var(--cx-ease);
}
body.cx-premium .cx-sweep:not(.noarrow)::after {
	display: inline-block;
	transition: transform 0.3s var(--cx-ease);
}
@media (hover: hover) and (pointer: fine) {
	body.cx-premium .cx-sweep:hover {
		background: var(--cx-btn-bg);
		border-color: var(--cx-btn-fill, var(--cognixia-dark));
		color: #FFFFFF;
		transform: translateY(-2px);
	}
	body.cx-premium .cx-sweep:hover::before {
		transform: translateY(0);
	}
	body.cx-premium .cx-sweep:hover::after {
		transform: translateX(4px);
	}
}
body.cx-premium .cx-sweep:active {
	transform: translateY(0) scale(0.98);
	transition-duration: 0.1s;
}
body.cx-premium .cx-sweep:focus-visible {
	outline: 2px solid var(--cognixia-primary);
	outline-offset: 3px;
}

/* ------------------------------------------------------------------
 * 2. Cards (bordered icon boxes): teal ring, growing accent line,
 *    icon tilt, link arrow. The lift itself comes from cognixia-cards.js.
 * ---------------------------------------------------------------- */
body.cx-premium .cognixia-icon-box.cognixiaboxborder {
	position: relative;
	overflow: hidden;
	background-color: #FFFFFF;
	transition: border-color 0.35s var(--cx-ease), box-shadow 0.35s var(--cx-ease), background-color 0.35s var(--cx-ease);
}
body.cx-premium .section-dark .cognixia-icon-box.cognixiaboxborder {
	background-color: transparent;
}
body.cx-premium .cognixia-icon-box.cognixiaboxborder::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 3px;
	background: var(--cognixia-primary);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.5s var(--cx-ease);
	pointer-events: none;
}
body.cx-premium .section-dark .cognixia-icon-box.cognixiaboxborder::after {
	background: #B1F4DC;
}
body.cx-premium .cognixia-icon-box .boxicon > svg,
body.cx-premium .cognixia-icon-box .boxicon > img {
	transition: transform 0.45s var(--cx-ease);
}
body.cx-premium .cognixia-icon-box .boxnumber {
	transition: color 0.35s var(--cx-ease);
}
body.cx-premium .cognixia-icon-box .badge {
	transition: background-color 0.35s var(--cx-ease), color 0.35s var(--cx-ease), border-color 0.35s var(--cx-ease);
}
body.cx-premium .cognixia-icon-box .boxlink {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
body.cx-premium .cognixia-icon-box .boxlink::after {
	content: "\2192";
	display: inline-block;
	transition: transform 0.3s var(--cx-ease);
}
@media (hover: hover) and (pointer: fine) {
	body.cx-premium .cognixia-icon-box.cognixiaboxborder:hover {
		border-color: var(--cognixia-primary);
		box-shadow: var(--cx-ring);
	}
	body.cx-premium .section-dark .cognixia-icon-box.cognixiaboxborder:hover {
		border-color: #B1F4DC;
		box-shadow: inset 0 0 0 1px #B1F4DC;
	}
	body.cx-premium .cognixia-icon-box.cognixiaboxborder:hover::after {
		transform: scaleX(1);
	}
	body.cx-premium .cognixia-icon-box:hover .boxicon > svg,
	body.cx-premium .cognixia-icon-box:hover .boxicon > img {
		transform: rotate(-6deg) scale(1.06);
	}
	body.cx-premium .cognixia-icon-box:hover .boxnumber {
		color: var(--cognixia-secondary);
	}
	body.cx-premium .section-dark .cognixia-icon-box:hover .boxnumber {
		color: #C39E61;
	}
	body.cx-premium .cognixia-icon-box:hover .badge {
		background-color: var(--cognixia-primary);
		border-color: var(--cognixia-primary);
		color: #FFFFFF;
	}
	body.cx-premium .cognixia-icon-box:hover .boxlink::after {
		transform: translateX(4px);
	}
}
/* Keyboard users get the same ring as hover (no motion). */
body.cx-premium .cognixia-icon-box.cognixiaboxborder:focus-within {
	border-color: var(--cognixia-primary);
	box-shadow: var(--cx-ring);
}

/* Course and listing cards: same ring treatment on their bordered box. */
@media (hover: hover) and (pointer: fine) {
	body.cx-premium .coursebox .listingboxdetail {
		transition: border-color 0.35s var(--cx-ease), box-shadow 0.35s var(--cx-ease);
	}
	body.cx-premium .coursebox:hover .listingboxdetail {
		border-color: var(--cognixia-primary);
		box-shadow: var(--cx-ring);
	}
}

/* ------------------------------------------------------------------
 * 3. Photos (real people, licensed stock; see inc/cognixia-premium.php)
 * ---------------------------------------------------------------- */
body.cx-premium .cx-photo {
	position: relative;
	margin: 2rem 0 0;
	overflow: hidden;
	border-radius: 4px; /* photos are plain rectangles */
	background: var(--cognixia-accent);
	aspect-ratio: 4 / 3;
}
body.cx-premium .cx-photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.9s var(--cx-ease-out);
}
body.cx-premium .cx-photo--wide {
	aspect-ratio: 16 / 10;
}
/* Photo header inside a service card: bleeds to the card edges. */
body.cx-premium .cx-photo--card {
	margin: -2rem -2rem 1.5rem;
	border-radius: 0;
	aspect-ratio: 16 / 9;
}
@media (hover: hover) and (pointer: fine) {
	body.cx-premium .cx-photo:hover img,
	body.cx-premium .cognixia-icon-box:hover .cx-photo--card img {
		transform: scale(1.04);
	}
}
/* Only shown on wide screens where the column has room for it. */
@media (max-width: 991.98px) {
	body.cx-premium .cx-photo--side {
		display: none;
	}
}

/* ------------------------------------------------------------------
 * 4. Page-to-page transition (Chrome and Edge 126+; ignored elsewhere)
 * ---------------------------------------------------------------- */
@view-transition {
	navigation: auto;
}
::view-transition-old(root) {
	animation: 180ms cubic-bezier(0.4, 0, 1, 1) both cx-vt-out;
}
::view-transition-new(root) {
	animation: 320ms cubic-bezier(0.22, 1, 0.36, 1) both cx-vt-in;
}
@keyframes cx-vt-out {
	to { opacity: 0; }
}
@keyframes cx-vt-in {
	from { opacity: 0; transform: translateY(8px); }
}

/* ------------------------------------------------------------------
 * 5. Reduced motion: no sweeps, tilts, zooms or page transitions.
 * ---------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	::view-transition-old(root),
	::view-transition-new(root) {
		animation: none;
	}
	body.cx-premium .cx-sweep:hover,
	body.cx-premium .cx-sweep:active {
		transform: none;
	}
	body.cx-premium .cognixia-icon-box:hover .boxicon > svg,
	body.cx-premium .cognixia-icon-box:hover .boxicon > img,
	body.cx-premium .cx-photo:hover img,
	body.cx-premium .cognixia-icon-box:hover .cx-photo--card img {
		transform: none;
	}
}


/* ==================================================================
 * LIGHT HOMEPAGE LAYOUT (Hyqoo x HVT), scoped to body.cx-premium.home-layout,
 * which inc/cognixia-premium.php adds on the Home template only.
 * Same sections, same order, same words: only layout, colour and motion change.
 * Header and footer stay Tenure Green as the brand frame; the page itself is light.
 * ================================================================== */
body.cx-premium.home-layout {
	--cx-paper: #FFFFFF;
	--cx-paper-2: #F4F7F7;
	--cx-tint: #EAF2F2;   /* soft teal tint for alternate bands (no cream or gold backgrounds) */
	--cx-ink: #05262B;
	--cx-muted: #4F5B5D;  /* 7.0:1 on white, 6.4:1 on #F4F7F7 */
	--cx-line: #D5E0E1;
	--cx-radius: 1.25rem 1.25rem 1.25rem 0; /* Collabera's one squared corner */
}
body.cx-premium.home-layout .hero-image { display: none !important; } /* the fixed dark render behind the hero */
body.cx-premium.home-layout main,
body.cx-premium.home-layout #primary { background: var(--cx-paper); }

/* Shared: editorial section headings (HVT scale, Hyqoo serif). */
body.cx-premium.home-layout main .section-title {
	font-size: clamp(2.25rem, 3.6vw, 3.6rem);
	font-weight: 300;
	line-height: 1.08;
	letter-spacing: -0.01em;
	color: var(--cx-ink);
}
body.cx-premium.home-layout main .section-head .boxdesc,
body.cx-premium.home-layout main .section-head p { color: var(--cx-muted); }
body.cx-premium.home-layout main .section-label { color: var(--cognixia-primary); letter-spacing: 2px; }

/* Shared: on wide screens a centred section head splits into heading left, intro right (HVT). */
@media (min-width: 992px) {
	body.cx-premium.home-layout #collabera-advantage .section-head,
	body.cx-premium.home-layout #training-solutions .section-head {
		display: grid;
		grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
		align-items: end;
		gap: 2rem 4rem;
		text-align: left;
		margin-bottom: 3.5rem;
	}
	body.cx-premium.home-layout #collabera-advantage .section-head .section-label,
	body.cx-premium.home-layout #training-solutions .section-head .section-label { justify-content: flex-start; }
	body.cx-premium.home-layout #collabera-advantage .section-head .headesc,
	body.cx-premium.home-layout #training-solutions .section-head .headesc { margin: 0; max-width: 46ch; }
}

/* ---------- Hero: light, text left, arched photo collage right ---------- */
body.cx-premium.home-layout .cognixia-hero {
	position: relative;
	overflow: hidden;
	background: var(--cx-paper-2);
	border-bottom: 1px solid var(--cx-line);
}
body.cx-premium.home-layout .cognixia-hero .hero-title {
	color: var(--cx-ink);
	text-shadow: none;
	font-weight: 300;
	font-size: clamp(2.4rem, 3.4vw, 3.5rem);
	line-height: 1.1;
}
body.cx-premium.home-layout .cognixia-hero p { color: var(--cx-muted); }
body.cx-premium.home-layout .cognixia-hero .label,
body.cx-premium.home-layout .cognixia-hero .badge {
	background: var(--cx-paper);
	border-color: rgba(39, 113, 124, 0.35);
	color: var(--cognixia-primary);
	letter-spacing: 1px;
}
body.cx-premium.home-layout .cognixia-hero .swiper-button-next,
body.cx-premium.home-layout .cognixia-hero .swiper-button-prev { color: var(--cx-ink); }
@media (min-width: 1200px) {
	body.cx-premium.home-layout .cognixia-hero .hero-details > .col { flex: 0 0 55%; max-width: 55%; }
}
body.cx-premium .cx-hero-collage { display: none; }
@media (min-width: 1200px) {
	body.cx-premium .cx-hero-collage {
		display: block;
		position: absolute;
		top: 50%;
		right: max(0px, calc((100% - 1202px) / 2)); /* lines up with the hero text container */
		height: min(92%, 520px);
		aspect-ratio: 1 / 1;
		transform: translateY(-50%);
		z-index: 1;
		pointer-events: none;
	}
	body.cx-premium .cx-hero-collage .cx-orbit {
		position: absolute;
		inset: 4%;
		border: 1px solid rgba(39, 113, 124, 0.3);
		border-radius: 50%;
		animation: cx-spin 50s linear infinite;
	}
	body.cx-premium .cx-hero-collage .cx-orbit::before,
	body.cx-premium .cx-hero-collage .cx-orbit::after {
		content: "";
		position: absolute;
		border-radius: 50%;
	}
	body.cx-premium .cx-hero-collage .cx-orbit::before { width: 12px; height: 12px; background: var(--cognixia-primary); top: 50%; left: -6px; }
	body.cx-premium .cx-hero-collage .cx-orbit::after { width: 8px; height: 8px; background: #B1F4DC; right: 13%; top: 7%; }
	body.cx-premium .cx-hero-collage figure { position: absolute; margin: 0; overflow: hidden; background: var(--cx-line); }
	body.cx-premium .cx-hero-collage img { display: block; width: 100%; height: 100%; object-fit: cover; }
	body.cx-premium .cx-hero-collage .cx-h1 {
		left: 22%; top: 4%; width: 58%; height: 76%;
		border-radius: 4px;
		animation: cx-float 9s ease-in-out infinite;
	}
	body.cx-premium .cx-hero-collage .cx-h2 {
		left: 0; bottom: 3%; width: 44%; height: 32%;
		border-radius: 4px;
		border: 6px solid var(--cx-paper-2, #F4F7F7);
		animation: cx-float 11s ease-in-out -3s infinite;
	}
	body.cx-premium .cx-hero-collage .cx-dot {
		position: absolute;
		right: 7%;
		bottom: 16%;
		width: 72px;
		height: 72px;
		border-radius: 50%;
		background: #B1F4DC;
		animation: cx-float 7s ease-in-out -1s infinite;
	}
}
@keyframes cx-spin { to { transform: rotate(360deg); } }
@keyframes cx-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -12px; } }

/* ---------- AI stacks: a quiet light logo strip between hairlines ---------- */
body.cx-premium.home-layout #ai-tools {
	background: var(--cx-paper);
	padding-top: 3.5rem;
	padding-bottom: 3.5rem;
	border-bottom: 1px solid var(--cx-line);
}
body.cx-premium.home-layout #ai-tools .section-title {
	font-size: 0.85rem;
	font-family: var(--font-redhatdisplay);
	font-weight: 600;
	letter-spacing: 2.5px;
	text-transform: uppercase;
	color: var(--cx-muted);
}
body.cx-premium.home-layout #ai-tools .carousel-container::before,
body.cx-premium.home-layout #ai-tools .carousel-container::after { display: none; }
body.cx-premium.home-layout #ai-tools .carousel-container {
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
body.cx-premium.home-layout #ai-tools .train-coach img {
	filter: brightness(0); /* the logos are white artwork for a dark band */
	opacity: 0.5;
	transition: opacity 0.35s var(--cx-ease);
}
body.cx-premium.home-layout #ai-tools .train-coach:hover img { filter: brightness(0); opacity: 1; }

/* ---------- Collabera advantage: HVT "proof" figures on a light band ---------- */
body.cx-premium.home-layout #collabera-advantage {
	background: var(--cx-paper-2);
	color: var(--cx-ink);
}
body.cx-premium.home-layout #collabera-advantage .section-title { color: var(--cx-ink); }
body.cx-premium.home-layout #collabera-advantage .section-label { color: var(--cognixia-primary); }
body.cx-premium.home-layout #collabera-advantage .section-label:not(.no-star)::before { filter: none; }
body.cx-premium.home-layout #collabera-advantage .section-detail.row > .col-12,
body.cx-premium.home-layout #collabera-advantage .section-detail.row > .col-sm-auto { display: none !important; }
@media (min-width: 768px) {
	body.cx-premium.home-layout #collabera-advantage .section-detail.row {
		display: grid;
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 2rem;
		margin: 0;
	}
	body.cx-premium.home-layout #collabera-advantage .section-detail.row > [class*="col-"] { width: auto; max-width: none; margin: 0 !important; padding: 0; }
}
@media (min-width: 768px) and (max-width: 1199.98px) {
	body.cx-premium.home-layout #collabera-advantage .section-detail.row { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 3rem; }
}
body.cx-premium.home-layout #collabera-advantage .our-counts {
	position: relative;
	height: 100%;
	padding: 1.75rem 0 0;
	text-align: left;
	border-top: 1px solid var(--cx-line);
}
body.cx-premium.home-layout #collabera-advantage .our-counts::before {
	content: "";
	position: absolute;
	left: 0;
	top: -1px;
	width: 100%;
	height: 2px;
	background: var(--cognixia-primary);
	transform: scaleX(0.12);
	transform-origin: left;
	transition: transform 0.7s var(--cx-ease);
}
body.cx-premium.home-layout #collabera-advantage .our-counts label { color: var(--cx-muted); letter-spacing: 1.5px; font-size: 12px; font-weight: 600; }
body.cx-premium.home-layout #collabera-advantage .our-counts > span {
	font-size: clamp(3.75rem, 6vw, 6rem);
	line-height: 1;
	margin: 1.25rem 0 1rem;
	font-weight: 300;
	color: var(--cognixia-primary);
}
body.cx-premium.home-layout #collabera-advantage .our-counts > span small { color: var(--cognixia-secondary); font-size: 0.6em; vertical-align: top; }
body.cx-premium.home-layout #collabera-advantage .our-counts > small { color: var(--cx-ink); font-weight: 600; }
@media (hover: hover) and (pointer: fine) {
	body.cx-premium.home-layout #collabera-advantage .our-counts:hover::before { transform: scaleX(1); }
}

/* ---------- Services: HVT case cards with Hyqoo photo frames ---------- */
body.cx-premium.home-layout #training-solutions .cognixia-icon-box.cognixiaboxborder {
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	overflow: visible;
}
body.cx-premium.home-layout #training-solutions .cognixia-icon-box.cognixiaboxborder::after { display: none; }
body.cx-premium.home-layout #training-solutions .cx-photo--card {
	margin: 0 0 0;
	aspect-ratio: 4 / 3;
	border-radius: 4px;
}
body.cx-premium.home-layout #training-solutions .boxicon {
	position: relative;
	z-index: 2;
	margin: -30px 0 1.25rem 1.25rem;
	align-items: flex-end;
}
body.cx-premium.home-layout #training-solutions .boxicon > svg {
	border-radius: 16px;
	outline: 6px solid var(--cx-paper);
}
body.cx-premium.home-layout #training-solutions .badge {
	margin-right: 0;
	background: transparent;
	border: 0;
	padding: 0;
	color: var(--cognixia-primary);
	font-weight: 600;
	letter-spacing: 1.5px;
}
body.cx-premium.home-layout #training-solutions .boxtitle {
	font-size: 1.75rem;
	font-weight: 300;
	min-height: 0;
	transition: color 0.35s var(--cx-ease);
}
body.cx-premium.home-layout #training-solutions .boxdesc { color: var(--cx-muted); }
body.cx-premium.home-layout #training-solutions .boxlink { color: var(--cx-ink); font-weight: 600; }
@media (hover: hover) and (pointer: fine) {
	body.cx-premium.home-layout #training-solutions .cognixia-icon-box.cognixiaboxborder:hover { box-shadow: none; }
	body.cx-premium.home-layout #training-solutions .cognixia-icon-box:hover .boxtitle { color: var(--cognixia-primary); }
	body.cx-premium.home-layout #training-solutions .cognixia-icon-box:hover .boxlink::after { transform: translateX(8px); }
	body.cx-premium.home-layout #training-solutions .cognixia-icon-box:hover .badge { background: transparent; color: var(--cognixia-secondary); }
	body.cx-premium.home-layout #training-solutions .cognixia-icon-box:hover .cx-photo--card img { transform: scale(1.05); }
}

/* ---------- Enterprise enablement: sticky story + HVT hairline box grid ---------- */
@media (min-width: 992px) {
	body.cx-premium.home-layout #cognixia-for-enterprise .row > .col-xl-5 { position: sticky; top: 110px; align-self: flex-start; }
}
@media (min-width: 576px) {
	body.cx-premium.home-layout #cognixia-for-enterprise .col-xl-6 > .section-detail.row {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1px;
		margin: 0;
		background: var(--cx-line);  /* shows through the 1px gaps as the grid lines */
		border: 1px solid var(--cx-line);
		border-radius: 1.5rem 1.5rem 1.5rem 0;
		overflow: hidden;
	}
	body.cx-premium.home-layout #cognixia-for-enterprise .col-xl-6 > .section-detail.row > article { width: auto; max-width: none; margin: 0; padding: 0; }
	body.cx-premium.home-layout #cognixia-for-enterprise .col-xl-6 > .section-detail.row > article.col-12 { grid-column: 1 / -1; }
}
body.cx-premium.home-layout #cognixia-for-enterprise .cognixia-icon-box.cognixiaboxborder {
	height: 100%;
	margin: 0;
	padding: 2.25rem 2rem 2.5rem !important;
	border: 0;
	border-radius: 0;
	background: var(--cx-paper);
	transition: background-color 0.35s var(--cx-ease);
}
body.cx-premium.home-layout #cognixia-for-enterprise .boxnumber {
	font-family: var(--font-newsreader);
	font-size: 2.75rem;
	font-weight: 300;
	line-height: 1;
	margin-bottom: 1.5rem;
	color: var(--cognixia-primary);
	transition: color 0.35s var(--cx-ease), translate 0.45s var(--cx-ease);
}
body.cx-premium.home-layout #cognixia-for-enterprise .boxtitle { font-size: 1.4rem; }
body.cx-premium.home-layout #cognixia-for-enterprise .boxdesc { color: var(--cx-muted); }
@media (hover: hover) and (pointer: fine) {
	body.cx-premium.home-layout #cognixia-for-enterprise .cognixia-icon-box.cognixiaboxborder:hover { background: var(--cx-paper-2); box-shadow: none; }
	body.cx-premium.home-layout #cognixia-for-enterprise .cognixia-icon-box:hover .boxnumber { color: var(--cognixia-secondary); translate: 0 -4px; }
}

/* ---------- Source, Build and Embed: a soft teal band, the path drawn in teal ---------- */
body.cx-premium.home-layout #cognixia-source-build-embed {
	background-color: var(--cx-tint);
	background-image: none;
	color: var(--cx-ink);
}
body.cx-premium.home-layout #cognixia-source-build-embed h2,
body.cx-premium.home-layout #cognixia-source-build-embed h3,
body.cx-premium.home-layout #cognixia-source-build-embed .section-title { color: var(--cx-ink); }
body.cx-premium.home-layout #cognixia-source-build-embed .section-label { color: var(--cognixia-primary); }
body.cx-premium.home-layout #cognixia-source-build-embed .section-label:not(.no-star)::before { filter: none; }
body.cx-premium.home-layout #cognixia-source-build-embed .section-title { font-size: clamp(2.5rem, 4vw, 4rem); }
body.cx-premium.home-layout #cognixia-source-build-embed p { color: #3E4A4C; }
body.cx-premium.home-layout #cognixia-source-build-embed .build-count > [class*="col-sm-3"] {
	border-left: 1px solid rgba(5, 38, 43, 0.18);
	padding-left: 1rem;
}
body.cx-premium.home-layout #cognixia-source-build-embed .build-count span {
	font-size: clamp(1.6rem, 2.1vw, 2.25rem);
	font-weight: 300;
	line-height: 1.1;
	white-space: nowrap;
	color: var(--cognixia-primary);
}
body.cx-premium.home-layout #cognixia-source-build-embed .build-count label { color: var(--cx-muted); }
body.cx-premium.home-layout #cognixia-source-build-embed .step .cognixia-icon-box {
	background: var(--cx-paper);
	border: 0;
	border-radius: var(--cx-radius);
	padding: 2rem;
	color: var(--cx-ink);
}
body.cx-premium.home-layout #cognixia-source-build-embed .step .cognixia-icon-box::after { background: var(--cognixia-primary); }
body.cx-premium.home-layout #cognixia-source-build-embed .step .text-white { color: var(--cognixia-secondary) !important; }
body.cx-premium.home-layout #cognixia-source-build-embed .step .badge.text-white {
	color: var(--cognixia-primary) !important;
	background: var(--cx-paper-2) !important;
	border-color: var(--cx-line) !important;
}
body.cx-premium.home-layout #cognixia-source-build-embed .step .boxdesc { color: var(--cx-muted); }
@media (hover: hover) and (pointer: fine) {
	body.cx-premium.home-layout #cognixia-source-build-embed .step .cognixia-icon-box:hover { box-shadow: inset 0 0 0 1px var(--cognixia-primary); }
}
/* Statement fill (HVT): words of the heading light up as the section scrolls through. */
body.cx-premium .cx-fill .cx-w { color: rgba(5, 38, 43, 0.16); transition: color 0.35s linear; }
body.cx-premium .cx-fill .cx-w.is-lit { color: var(--cognixia-dark); }

/* ---------- AI partner ecosystem: HVT tiles ---------- */
body.cx-premium.home-layout #cognixia-ai-partner .section-detail article { margin-bottom: 1rem; padding-left: 0.5rem; padding-right: 0.5rem; }
@media (min-width: 576px) {
	/* two roomy columns instead of three narrow ones; the fifth tile spans the row */
	body.cx-premium.home-layout #cognixia-ai-partner .section-detail.row {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1rem;
		margin: 0;
	}
	body.cx-premium.home-layout #cognixia-ai-partner .section-detail.row > article { width: auto; max-width: none; margin: 0; padding: 0; }
	body.cx-premium.home-layout #cognixia-ai-partner .section-detail.row > article:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
body.cx-premium.home-layout #cognixia-ai-partner .cognixia-icon-box {
	height: 100%;
	padding: 1.5rem !important;
	background: var(--cx-paper-2);
	border: 1px solid transparent;
	border-radius: 14px;
	transition: background-color 0.35s var(--cx-ease), border-color 0.35s var(--cx-ease);
}
body.cx-premium.home-layout #cognixia-ai-partner .boxnumber {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	margin-bottom: 1.25rem;
	border-radius: 12px;
	background: var(--cx-paper);
	color: var(--cognixia-primary);
	font-family: var(--font-newsreader);
	font-size: 1.15rem;
	transition: background-color 0.35s var(--cx-ease), color 0.35s var(--cx-ease);
}
body.cx-premium.home-layout #cognixia-ai-partner .boxtitle { font-size: 1.25rem; }
body.cx-premium.home-layout #cognixia-ai-partner .boxdesc { color: var(--cx-muted); }
@media (hover: hover) and (pointer: fine) {
	body.cx-premium.home-layout #cognixia-ai-partner .cognixia-icon-box:hover { background: var(--cx-paper); border-color: var(--cognixia-primary); }
	body.cx-premium.home-layout #cognixia-ai-partner .cognixia-icon-box:hover .boxnumber { background: var(--cognixia-primary); color: #FFFFFF; }
}

/* ---------- Clients: monochrome logos, colour on hover ---------- */
body.cx-premium.home-layout #cognixia-clients img:not(.position-absolute) { filter: grayscale(1); opacity: 0.65; transition: filter 0.4s var(--cx-ease), opacity 0.4s var(--cx-ease); }
body.cx-premium.home-layout #cognixia-clients img:not(.position-absolute):hover { filter: none; opacity: 1; }

/* ---------- Why Cognixia: interactive rows next to a sticky photo ---------- */
@media (min-width: 992px) {
	body.cx-premium.home-layout #why-cognixia .row > .col-xl-5 { position: sticky; top: 110px; align-self: flex-start; }
}
body.cx-premium.home-layout #why-cognixia .section-detail article { border-top: 1px solid var(--cx-line); }
body.cx-premium.home-layout #why-cognixia .section-detail article:last-child { border-bottom: 1px solid var(--cx-line); }
body.cx-premium.home-layout #why-cognixia .cognixia-icon-box {
	position: relative;
	z-index: 0;
	display: grid;
	grid-template-columns: 5rem 1fr;
	column-gap: 1.5rem;
	align-items: baseline;
	padding: 1.75rem 1.25rem !important;
	border-radius: 0;
}
body.cx-premium.home-layout #why-cognixia .cognixia-icon-box > .boxnumber { grid-row: span 2; font-size: 3rem; font-weight: 300; line-height: 1; color: var(--cognixia-primary); transition: color 0.4s var(--cx-ease); }
body.cx-premium.home-layout #why-cognixia .cognixia-icon-box > .boxtitle { min-height: 0; margin: 0 0 .35rem !important; font-size: 1.6rem; transition: translate 0.45s var(--cx-ease); }
body.cx-premium.home-layout #why-cognixia .cognixia-icon-box > .boxdesc { color: var(--cx-muted); transition: translate 0.45s var(--cx-ease); }
body.cx-premium.home-layout #why-cognixia .cognixia-icon-box::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--cx-paper-2);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.6s var(--cx-ease);
}
@media (hover: hover) and (pointer: fine) {
	body.cx-premium.home-layout #why-cognixia .cognixia-icon-box:hover::before { transform: scaleX(1); }
	body.cx-premium.home-layout #why-cognixia .cognixia-icon-box:hover > .boxnumber { color: var(--cognixia-secondary); }
	body.cx-premium.home-layout #why-cognixia .cognixia-icon-box:hover > .boxtitle,
	body.cx-premium.home-layout #why-cognixia .cognixia-icon-box:hover > .boxdesc { translate: 10px 0; }
}
@media (max-width: 575.98px) {
	body.cx-premium.home-layout #why-cognixia .cognixia-icon-box { grid-template-columns: 3.25rem 1fr; column-gap: 1rem; }
	body.cx-premium.home-layout #why-cognixia .cognixia-icon-box > .boxnumber { font-size: 2rem; }
}

/* ---------- Closing call to action: a soft teal band with a big serif line ---------- */
body.cx-premium.home-layout #top-footer {
	background: var(--cx-tint);
	color: var(--cx-ink);
	padding-top: 6rem;
	padding-bottom: 5rem;
}
body.cx-premium.home-layout #top-footer h1,
body.cx-premium.home-layout #top-footer h2,
body.cx-premium.home-layout #top-footer .section-title {
	color: var(--cx-ink);
	font-size: clamp(2.5rem, 4.6vw, 4.5rem);
	font-weight: 300;
	line-height: 1.08;
}
body.cx-premium.home-layout #top-footer .section-label { color: var(--cognixia-primary); }
body.cx-premium.home-layout #top-footer .section-label:not(.no-star)::before { filter: none; }
body.cx-premium.home-layout #top-footer p,
body.cx-premium.home-layout #top-footer .section-head p { color: #3E4A4C; }

/* ---------- Cursor ring: teal on the light page ---------- */
body.cx-premium .cursor-circle { transition: width 0.3s var(--cx-ease), height 0.3s var(--cx-ease), margin 0.3s var(--cx-ease), background-color 0.3s var(--cx-ease); }
body.cx-premium .cursor-circle.cx-cursor-grow { width: 64px; height: 64px; margin: -17px 0 0 -17px; background-color: rgba(39, 113, 124, 0.1); }

@media (prefers-reduced-motion: reduce) {
	body.cx-premium .cx-hero-collage .cx-orbit,
	body.cx-premium .cx-hero-collage figure,
	body.cx-premium .cx-hero-collage .cx-dot { animation: none; }
	body.cx-premium .cx-fill .cx-w { color: inherit; }
}
