/**
 * Mackay ESG — main stylesheet (Figma tokens, no Tailwind).
 */

/* ── Base ── */
@property --mackay-counter-num {
	syntax: '<integer>';
	initial-value: 0;
	inherits: false;
}

@property --mackay-concept-card-color-stop {
	syntax: '<length>';
	initial-value: 2px;
	inherits: false;
}

:root {
	interpolate-size: allow-keywords;
	--mackay-stats-value: 0;
}

.mackay-container {
	max-width: var(--mackay-container-home);
	margin-block: 0;
	margin-inline: auto;
	padding-block: 0;
	padding-inline: var(--mackay-gutter);
}

.mackay-container--about {
	max-width: var(--mackay-container-about);
}

/* ── Buttons ── */
.mackay-btn {
	display: inline-block;
	padding-block: 0.75rem;
	padding-inline: 1.75rem;
	border-radius: var(--mackay-btn-radius);
	font-family: var(--mackay-font-button);
	font-weight: 600;
	font-size: 16px;
	line-height: 1.6;
	text-align: center;
	text-decoration: none;
	border: var(--mackay-btn-border) solid transparent;
	transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
	cursor: pointer;

	&[data-shape="pill"] {
		border-radius: 3.125rem;
	}
}

.mackay-btn--primary {
	background: var(--mackay-teal-mid);
	border-color: var(--mackay-teal-mid);
	color: var(--mackay-surface-white);
}

.mackay-btn--primary:hover {
	background: transparent;
	color: var(--mackay-teal-mid);
}

.mackay-btn--secondary {
	background: transparent;
	border-color: var(--mackay-teal-mid);
	color: var(--mackay-teal-mid);
}

.mackay-btn--secondary:hover {
	background: var(--mackay-teal-mid);
	color: var(--mackay-surface-white);
}

.mackay-btn--accent {
	background: var(--mackay-lime-accent);
	border-color: var(--mackay-lime-accent);
	color: var(--mackay-surface-white);
}

.mackay-btn--accent:hover {
	background: transparent;
	color: var(--mackay-lime-accent);
}

/* ── Header ── */
.mackay-header {
	background: var(--mackay-surface-white);
	box-shadow: var(--mackay-shadow);
	position: sticky;
	top: 0;
	z-index: 1000;
	padding-block: 0.9375rem;
	padding-inline: 0;
}

.mackay-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;

	& > .mackay-nav {
		display: none;

		@media (min-width: 768px) {
			display: flex;
		}
	}
}

.mackay-logo img {
	height: 52px;
	width: auto;
}

.mackay-nav__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0;
}

.mackay-nav__item {
	width: 100%;
	border-bottom: 1px solid var(--mackay-teal-light);
}

.mackay-nav__link {
	display: block;
	width: 100%;
	padding-block: 1rem;
	padding-inline: 0;
	font-family: var(--mackay-font-body);
	font-weight: 700;
	font-size: 20px;
	color: var(--mackay-primary-teal);
	text-decoration: none;
	position: relative;
}

.mackay-nav__link::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 0;
	height: 2px;
	background: var(--mackay-lime-accent);
	transition: width 0.3s ease;
}

.mackay-nav__link:hover::after,
.mackay-nav__link.is-active::after {
	width: 100%;
}

.mackay-burger-menu {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 6px;
	width: 44px;
	height: 44px;
	padding: 0;
	margin-block: 0;
	margin-inline-start: auto;
	border: 0;
	background: transparent;
	cursor: pointer;
	position: relative;
	z-index: 1002;
}

.mackay-burger-menu__bar {
	display: block;
	width: 26px;
	height: 3px;
	border-radius: 2px;
	background: var(--mackay-lime-accent);
	transition: transform 0.3s ease, opacity 0.3s ease;
}

.mackay-burger-menu.is-active .mackay-burger-menu__bar:nth-child(1) {
	transform: translateY(9px) rotate(45deg);
}

.mackay-burger-menu.is-active .mackay-burger-menu__bar:nth-child(2) {
	opacity: 0;
}

.mackay-burger-menu.is-active .mackay-burger-menu__bar:nth-child(3) {
	transform: translateY(-9px) rotate(-45deg);
}

.mackay-nav-drawer {
	position: fixed;
	inset: 0 0 0 auto;
	z-index: 1001;
	width: min(320px, 85vw);
	height: 100svh;
	margin: 0;
	padding-block-start: 1.5rem;
	padding-block-end: 2.5rem;
	padding-inline: var(--mackay-gutter);
	border: 0;
	background: var(--mackay-surface-white);
	box-shadow: var(--mackay-shadow);
	overflow-y: auto;
	transform: translateX(100%);
	transition: transform 0.3s ease, overlay 0.3s ease allow-discrete;
}

.mackay-nav-drawer[open] {
	transform: translateX(0);
}

@starting-style {
	.mackay-nav-drawer[open] {
		transform: translateX(100%);
	}
}

.mackay-nav-drawer::backdrop {
	background: rgba(0, 0, 0, 0.45);
	opacity: 0;
	transition: opacity 0.3s ease, overlay 0.3s ease allow-discrete;
}

.mackay-nav-drawer[open]::backdrop {
	opacity: 1;
}

@starting-style {
	.mackay-nav-drawer[open]::backdrop {
		opacity: 0;
	}
}

.mackay-nav-drawer__close-form {
	display: block;
	margin: 0;
	padding: 0;
}

.mackay-nav-drawer__close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-block-end: 1rem;
	margin-inline-start: auto;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--mackay-primary-teal);
	font-size: 32px;
	line-height: 1;
	cursor: pointer;
}

.mackay-nav {
	width: 100%;
}

@media (prefers-reduced-motion: reduce) {
	.mackay-burger-menu__bar,
	.mackay-nav-drawer,
	.mackay-nav-drawer::backdrop {
		transition: none;
	}
}

@media (min-width: 768px) {
	.mackay-burger-menu {
		display: none;
	}

	/* .mackay-nav-drawer,
	.mackay-nav-drawer:not([open]) {
		display: flex;
		align-items: center;
	}

	.mackay-nav-drawer {
		position: static;
		width: auto;
		height: auto;
		margin: 0;
		padding: 0;
		background: transparent;
		overflow: visible;
		transform: none;
		transition: none;
	}

	.mackay-nav-drawer::backdrop {
		display: none;
	}

	.mackay-nav-drawer__close-form,
	.mackay-nav-drawer__close {
		display: none;
	} */

	.mackay-nav {
		width: auto;
	}

	.mackay-nav__list {
		flex-direction: row;
		align-items: center;
		gap: 30px;
	}

	.mackay-nav__item {
		width: auto;
		border-bottom: 0;
	}

	.mackay-nav__link {
		display: inline;
		width: auto;
		padding-block-end: 0.3125rem;
		font-size: 18px;
	}
}

/* ── Footer ── */
.mackay-footer__partners {
	padding-block-start: 5rem;
	padding-block-end: 2.5rem;
	padding-inline: 0;
	text-align: center;
}

.mackay-footer__govt-text {
	font-family: var(--mackay-font-footer);
	font-weight: 600;
	font-size: 28px;
	line-height: 1.3;
	color: rgba(0, 94, 184, 0.92);
	margin-block-start: 0;
	margin-block-end: 1.5rem;
	margin-inline: auto;
	max-width: 682px;
	text-wrap: pretty;
}

.mackay-footer__govt-logo {
	margin-block-start: 0;
	margin-block-end: 1.5rem;
	margin-inline: auto;
}

.mackay-footer__govt-logo img {
	margin-inline: auto;
}

.mackay-footer__attribution {
	font-family: var(--mackay-font-footer);
	font-size: 18px;
	line-height: 1.1;
	color: #000;
	max-width: 780px;
	margin-inline: auto;
}

.mackay-footer__main {
	background: var(--mackay-primary-teal);
	padding-block: 2.5rem;
	padding-inline: 0;
}

.mackay-footer__main-inner {
	text-align: center;
	color: var(--mackay-surface-white);
	font-size: 18px;
	line-height: 1.6;
}

.mackay-footer__main-inner p {
	margin: 0;
}

.mackay-footer__main-inner p + p {
	margin-block-start: 0.5rem;
}

/* ── Floating chat ── */
.mackay-floating-chat {
	position: fixed;
	right: 24px;
	bottom: 24px;
	width: 60px;
	height: 60px;
	z-index: 999;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
}

.mackay-floating-chat__bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.mackay-floating-chat__icon {
	position: relative;
	z-index: 1;
	color: var(--mackay-surface-white);
	font-size: 28px;
}

/* ── Section header block ── */
.mackay-section-header {
	padding-block-start: 2rem;
	padding-block-end: 2rem;

	.mackay-section-header__label {
		display: flex;
		align-items: center;
		gap: 10px;
		margin-block-end: 0.75rem;
	}
	
	.mackay-section-header__label-bar {
		width: 30px;
		height: 3px;
		background: var(--mackay-green-accent);
		border-radius: 2px;
		flex-shrink: 0;
	}
	
	.mackay-section-header__label-text {
		font-weight: 700;
		font-size: 14px;
		color: var(--mackay-teal-mid);
		text-transform: capitalize;
	}
	
	.mackay-section-header__title {
		font-weight: 700;
		font-size: 34px;
		line-height: 1.15;
		color: var(--mackay-text-heading);
		margin-block-end: 1rem;
	}
	
	.mackay-section-header__lead {
		font-size: 18px;
		line-height: 1.55;
		color: var(--mackay-text-muted);
		margin: 0;
		max-width: 708px;
	}
	
	&.mackay-section-header--center {
		text-align: center;
	}
	
	&.mackay-section-header--center .mackay-section-header__label {
		justify-content: center;
	}
	
	&.mackay-section-header--center .mackay-section-header__lead {
		margin-inline: auto;
	}
	
	&.mackay-section-header--display .mackay-section-header__title {
		font-family: var(--mackay-font-display);
		font-weight: 400;
		font-size: 35.2px;
		color: var(--mackay-primary-teal);
	}
}

hr + .mackay-section-header {
	padding-block-start: 0;
}

.mackay-section-header + :is(.mackay-two-col, .mackay-faq, .mackay-card-accordion) {
	margin-block-start: -1rem; /* Account for the section header padding */
}

/* ── View transitions (About ESG journey) ── */
/* Opt-in (@view-transition { navigation: auto }) is inlined in <head> on About ESG pages. */
/*
 * - progress-indicator: indicator bar morphs to the new active step
 * - about-hero: hero cross-fades between journey pages
 */
 ::view-transition-group(progress-indicator) {
	animation-duration: var(--mackay-journey-transition-duration);
	animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

::view-transition-group(about-hero) {
	animation-duration: var(--mackay-view-transition-duration);
}

::view-transition-old(about-hero) {
	animation-name: mackay-transition-animation-swipe-old;
}

::view-transition-new(about-hero) {
	animation-name: mackay-transition-animation-swipe-new;
}

@keyframes mackay-transition-animation-swipe-old {
	to {
		opacity: 0;
		translate: -100vw 0;
	}
}

@keyframes mackay-transition-animation-swipe-new {
	from {
		opacity: 0;
		translate: 100vw 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	::view-transition-group(*),
	::view-transition-old(*),
	::view-transition-new(*) {
		animation-duration: 0.01ms !important;
		animation-delay: 0s !important;
		animation-iteration-count: 1 !important;
	}
}

/* ── Progress strip ── */
.mackay-progress-strip {
	background: var(--mackay-surface-sand);
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
	overflow-x: auto;
	scrollbar-width: thin;
}

.mackay-progress-strip::-webkit-scrollbar {
	display: none;
}

.mackay-progress-strip__inner {
	max-width: var(--mackay-container-about);
	margin-block: 0;
	margin-inline: auto;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	gap: 0;
	padding-block: 0;
	padding-inline: var(--mackay-gutter);
	overflow-x: auto;
    scrollbar-width: none;
}

.mackay-progress-strip__item {
	position: relative;
	display: flex;
	align-items: center;
	gap: 9px;
	padding-block: 0.8125rem;
	padding-inline-end: 1.125rem;
	padding-inline-start: 0;
	text-decoration: none;
	color: var(--mackay-text-muted);
	font-weight: 600;
	font-size: 0.75rem;
	white-space: nowrap;
	transition: color 0.18s ease;
}

.mackay-progress-strip__item:hover {
	color: var(--mackay-teal-mid);
}

.mackay-progress-strip__item.is-done {
	color: var(--mackay-lime-accent);
}

.mackay-progress-strip__item.is-active {
	color: var(--mackay-teal-mid);
}

.mackay-progress-strip__indicator {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background-color: var(--mackay-teal-mid);
	border-radius: 20px;
	view-transition-name: about-progress;
}

.mackay-progress-strip__num {
	width: 1.3125rem;
	height: 1.3125rem;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.06);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.625rem;
	font-weight: 800;
	flex-shrink: 0;
}

.mackay-progress-strip__item.is-active .mackay-progress-strip__num {
	background: var(--mackay-teal-mid);
	color: var(--mackay-surface-white);
}

.mackay-progress-strip__item.is-done .mackay-progress-strip__num {
	background: var(--mackay-lime-accent);
	color: var(--mackay-surface-white);
	font-size: 0.5625rem;

	/* Makes the thin icon thicker */
	svg path {
		stroke-width: 6rem;
		stroke: currentColor;
	}
}

/* ── About hero ── */
.mackay-about-hero {
	background: var(--mackay-primary-teal);
	color: var(--mackay-surface-white);
	padding-block: 4.5rem;
	padding-inline: 0;
}

.mackay-about-hero__crumb {
	font-size: 1rem;
	font-weight: 700;
	margin-block-end: 2.25rem;
}

.mackay-about-hero__crumb a {
	color: rgba(255, 255, 255, 0.55);
	text-decoration: none;
}

.mackay-about-hero__crumb a:hover {
	color: var(--mackay-surface-white);
}

.mackay-about-hero__crumb span,
.mackay-about-hero__crumb .breadcrumb_last {
	color: rgba(255, 255, 255, 0.3);
}

.mackay-about-hero__crumb .breadcrumb_last strong {
	font-weight: inherit;
	color: inherit;
}

.mackay-about-hero__title {
	font-family: var(--mackay-font-display);
	font-size: 36px;
	line-height: 1.12;
	margin-block-end: 1rem;
	font-weight: 400;
}

.mackay-about-hero__title .accent {
	color: var(--mackay-lime-accent);
}

.mackay-about-hero__lead {
	font-size: 20px;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.82);
	max-width: 668px;
	margin: 0;
}

/* ── Hero home ── */
.mackay-hero-home {
	position: relative;
	min-height: 756px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	color: var(--mackay-surface-white);
}

.mackay-hero-home__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.mackay-hero-home__bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.mackay-hero-home__overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 86, 92, 0.7);
	z-index: 1;
}

.mackay-hero-home__content {
	position: relative;
	z-index: 2;
	max-width: 900px;
	padding-block: 2.5rem;
	padding-inline: var(--mackay-gutter);
}

.mackay-hero-home__title {
	font-family: var(--mackay-font-display);
	font-size: 36px;
	line-height: 1.2;
	font-weight: 400;
}

.mackay-hero-home__lead {
	font-size: 20px;
	line-height: 1.54;
	margin-block-start: 0;
	margin-block-end: 2rem;
	margin-inline: auto;
	max-width: 662px;
}

/* ── Intro section ── */
.mackay-intro-section {
	background: var(--mackay-surface-light);
	padding-block: var(--mackay-section-padding);
	padding-inline: 0;
	text-align: center;
}

.mackay-intro-section__title {
	font-family: var(--mackay-font-display);
	font-size: 35.2px;
	line-height: 1.2;
	color: var(--mackay-primary-teal);
	margin-block-end: 1rem;
	font-weight: 400;
}

.mackay-intro-section__text {
	font-size: 18px;
	line-height: 1.55;
	max-width: 808px;
	margin-inline: auto;
}

/* ── Pathway cards ── */
.mackay-pathway-cards {
	padding-block: var(--mackay-section-padding);
	padding-inline: 0;
}

.mackay-pathway-cards__title {
	font-family: var(--mackay-font-display);
	font-size: 35.2px;
	text-align: center;
	color: var(--mackay-primary-teal);
	margin-block-end: 2.5rem;
	font-weight: 400;
}

.mackay-pathway-cards__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 30px;
}

.mackay-pathway-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: var(--mackay-surface-white);
	border-radius: 10px;
	box-shadow: var(--mackay-shadow);
	padding: 1.875rem;
	text-align: center;
}

.mackay-pathway-card__icon {
	color: var(--mackay-lime-accent);
	width: 50px;
	height: 50px;
	margin-block-end: 1.5rem;
}

.mackay-pathway-card__title {
	font-size: 26px;
	font-weight: 700;
	color: var(--mackay-primary-teal);
	margin-block-end: 0.75rem;
	line-height: 1.05;
}

.mackay-pathway-card__text {
	flex: 1;
	font-size: 18px;
	margin-block-end: 1.5rem;
	line-height: 1.4;
}

/* ── Stats row ── */
.mackay-stats-row {
	background: var(--mackay-surface-light);
	padding-block: var(--mackay-section-padding);
	padding-inline: 0;
	text-align: center;
}

.mackay-stats-row__title {
	font-family: var(--mackay-font-display);
	font-size: 35.2px;
	color: var(--mackay-primary-teal);
	margin-block-end: 1rem;
	font-weight: 400;
}

.mackay-stats-row__lead {
	font-size: 18px;
	max-width: 808px;
	margin-block-start: 0;
	margin-block-end: 2.5rem;
	margin-inline: auto;
}

.mackay-stats-row__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 30px;
}

.mackay-stat-card {
	background: var(--mackay-primary-teal);
	border-radius: 10px;
	padding: 1.875rem;
	color: var(--mackay-surface-white);
	text-align: center;
}

.mackay-stat-card__icon {
	font-size: 48px;
	color: var(--mackay-lime-accent);
	margin-block-end: 1rem;
	font-weight: 100;
}

.mackay-stat-card__text {
	font-size: 18px;
	line-height: 1.4;
	margin: 0;
}

/* ── Definition box ── */
.mackay-definition-box {
	background: var(--mackay-teal-light);
	border-left: 5px solid var(--mackay-teal-mid);
	border-radius: 0 14px 14px 0;
	padding-block: 1.75rem;
	padding-inline: 2.125rem;
	margin-block: 1.5rem;
	margin-inline: 0;
	font-size: 18px;
	line-height: 1.65;
	color: var(--mackay-text-heading);
}

.mackay-definition-box strong {
	color: var(--mackay-teal-dark);
}

/* ── Banner ── */
.mackay-banner {
	display: flex;
	align-items: center;
	gap: 1.75rem;
	border-radius: 18px;
	padding-block: 2.25rem;
	padding-inline: 2.5rem;
	margin-block: 3rem;
	margin-inline: 0;
	position: relative;
	overflow: hidden;
	color: var(--mackay-surface-white);
}

.mackay-banner--teal {
	background: linear-gradient(135deg, var(--mackay-primary-teal), var(--mackay-teal-mid));
}

.mackay-banner--lime,
.mackay-banner--green {
	background: linear-gradient(135deg, var(--mackay-green-dark), var(--mackay-green-mid));
}

.mackay-banner--orange {
	background: linear-gradient(135deg, var(--mackay-brown-dark), var(--mackay-brown-mid));
}

.mackay-banner__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 4rem;
	height: 4rem;
	min-width: 4rem;
	background: rgba(255, 255, 255, 0.15);
	border-radius: 1rem;
	font-size: 1.875rem;
}

.mackay-banner__content {
	flex: 1;
	min-width: 0;
}

.mackay-banner__title {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--mackay-surface-white);
	margin-block-end: 0.375rem;
}

.mackay-banner__text {
	font-size: 0.875rem;
	line-height: 1.6;
	color: var(--mackay-text-white-muted);
	max-width: 37.5rem;
}

@media (max-width: 767px) {
	.mackay-banner {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* ── Case study highlight ── */
.mackay-case-study-highlight {
	margin-block: 3rem;
	margin-inline: 0;
}

.mackay-case-study-highlight__inner {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
	align-items: center;
	border-radius: 1.125rem;
	padding-block: 2.75rem;
	padding-inline: 2.5rem;
	color: var(--mackay-surface-white);
	overflow: hidden;
}

.mackay-case-study-highlight--teal .mackay-case-study-highlight__inner {
	background: linear-gradient(138deg, var(--mackay-primary-teal), var(--mackay-teal-mid));
}

.mackay-case-study-highlight--green .mackay-case-study-highlight__inner {
	background: linear-gradient(138deg, var(--mackay-green-dark), var(--mackay-green-mid));
}

.mackay-case-study-highlight--orange .mackay-case-study-highlight__inner {
	background: linear-gradient(138deg, var(--mackay-brown-dark), var(--mackay-brown-mid));
}

.mackay-case-study-highlight--purple .mackay-case-study-highlight__inner {
	background: linear-gradient(138deg, var(--mackay-purple-dark), var(--mackay-purple));
}

.mackay-case-study-highlight__label {
	margin: 0 0 0.625rem;
	font-size: 0.625rem;
	font-weight: 800;
	line-height: 1.4;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--mackay-lime-accent);
}

.mackay-case-study-highlight__title {
	margin: 0 0 0.875rem;
	font-size: 1.375rem;
	font-weight: 900;
	line-height: 1.3;
	color: var(--mackay-surface-white);
}

.mackay-case-study-highlight__text {
	font-size: 0.875rem;
	line-height: 1.75;
	color: rgba(255, 255, 255, 0.8);
}

.mackay-case-study-highlight__text p {
	margin: 0 0 0.75rem;
}

.mackay-case-study-highlight__text p:last-child {
	margin-block-end: 0;
}

.mackay-case-study-highlight__text a {
	color: var(--mackay-lime-accent);
}

.mackay-case-study-highlight__stats {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.mackay-case-study-highlight__stat {
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 0.75rem;
	padding-block: 1rem;
	padding-inline: 1.125rem;
	text-align: center;
}

.mackay-case-study-highlight__stat-value {
	margin-block-end: 0.375rem;
	font-size: 1.625rem;
	font-weight: 900;
	line-height: 1;
	color: var(--mackay-lime-accent);
}

.mackay-case-study-highlight__stat--icon .mackay-case-study-highlight__stat-value {
	font-size: 1.5rem;
	font-weight: 300;
}

.mackay-case-study-highlight__stat-caption {
	margin: 0;
	font-size: 0.6875rem;
	line-height: 1.4;
	color: rgba(255, 255, 255, 0.6);
}

@media (min-width: 768px) {
	.mackay-case-study-highlight__inner {
		grid-template-columns: 1fr auto;
		gap: 2.5rem;
	}

	.mackay-case-study-highlight__stats {
		min-width: 11.25rem;
	}
}

/* ── Quote banner ── */
.mackay-quote-banner {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	background: linear-gradient(135deg, var(--mackay-primary-teal), var(--mackay-teal-mid));
	color: var(--mackay-surface-white);
	padding-block: 3rem;
	padding-inline: 2.5rem;
	border-radius: 18px;
	margin-block: 3rem;
	margin-inline: 0;

	svg {
		color: var(--mackay-lime-accent);
		font-size: 2rem;
	}

	.mackay-quote-banner__text {
		font-size: 22px;
		line-height: 1.5;
		font-weight: 700;
		margin: 0;
		text-wrap: pretty;
	}

	.mackay-quote-banner__author-cite {
		font-size: 1rem;
		line-height: 1.5;
		font-weight: 500;
		color: var(--mackay-text-white-muted);
	}
}

/* ── Completion banner ── */
.mackay-completion-banner {
	--background-gradient-1: var(--mackay-lime-accent);
	--background-gradient-2: var(--mackay-lime-dark);

	--step-background-color: color-mix(in srgb, var(--mackay-surface-white) 20%, transparent);
	--step-border-color: color-mix(in srgb, var(--mackay-surface-white) 30%, transparent);

	position: relative;
	overflow: hidden;
	text-align: center;
	background: linear-gradient(135deg, var(--background-gradient-1), var(--background-gradient-2));
	border-radius: 1.125rem;
	padding-block: 3rem;
	padding-inline: 2.5rem;
	margin-block: 3rem;
	margin-inline: 0;
	color: var(--mackay-surface-white);
	
	.mackay-completion-banner__badge {
		display: inline-flex;
		align-items: center;
		gap: 0.4375rem;
		margin-block: 0 1.125rem;
		margin-inline: 0;
		padding-block: 0.3125rem;
		padding-inline: 0.875rem;
		border: 1px solid var(--step-border-color);
		border-radius: 1.25rem;
		background: var(--step-background-color);
		font-size: 0.6875rem;
		font-weight: 700;
		letter-spacing: 0.0625rem;
		text-transform: uppercase;
	}
	
	.mackay-completion-banner__title {
		margin-block: 0 0.875rem;
        font-size: 2rem;
        font-weight: 700;
        color: var(--mackay-surface-white);
	}
	
	.mackay-completion-banner__text {
		max-width: 36.25rem;
		margin-block: 0 1.75rem;
		margin-inline: auto;
		font-size: 0.9375rem;
		line-height: 1.7;
		color: color-mix(in srgb, var(--mackay-surface-white) 85%, transparent);
		text-wrap: pretty;
	}
	
	.mackay-completion-banner__steps {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 0.625rem;
		margin: 0;
		padding: 0;
		list-style: none;
	}
	
	.mackay-completion-banner__step {
		display: flex;
		align-items: center;
		gap: 0.375rem;
		padding-block: 0.625rem;
		padding-inline: 1rem;
		border: 1px solid var(--step-border-color);
		border-radius: 0.625rem;
		background: var(--step-background-color);
		font-size: 0.75rem;
		font-weight: 700;
	}
}

.mackay-completion-banner--teal {
	--background-gradient-1: var(--mackay-teal-mid);
	--background-gradient-2: var(--mackay-teal-dark);
}

.mackay-completion-banner--green {
	--background-gradient-1: var(--mackay-green-dark);
	--background-gradient-2: var(--mackay-green-mid);
}

/* ── CTA strip ── */
.mackay-cta-strip {
	background: var(--mackay-green-light);
	border: 1px solid color-mix(in srgb, var(--mackay-green-accent) 22%, transparent);
	padding-block: 2.25rem;
	padding-inline: 2.5rem;
	border-radius: 18px;
	margin-block: 3rem;
	margin-inline: 0;

	.mackay-cta-strip__title {
		font-size: 1.25rem;
		font-weight: 700;
		color: var(--mackay-text-heading);
		margin-block-end: 0.75rem;
	}
	
	.mackay-cta-strip__text {
		font-size: 1rem;
		color: var(--mackay-text-muted);
		margin-block-end: 1.5rem;
	}
	
	.mackay-cta-strip__actions {
		display: flex;
		gap: 1rem;
		align-items: center;
		justify-content: start;
		flex-wrap: wrap;

		&:empty {
			display: none;
		}
	}
}


/* Details/summary default styling */
details {
	background: var(--mackay-surface-white);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 12px;
	overflow: hidden;

	&::details-content {
		transition: height 0.35s ease, opacity 0.35s ease;
		height: 0;
		overflow: hidden;
	}

	&[open] {
		summary svg {
			transform: rotate(90deg);
		}
	
		&::details-content {
			height: auto;
			opacity: 1;
			padding-inline: 1.5rem;
			font-size: 16px;
			line-height: 1.6;
		}
	}
}

summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-block: 1.25rem;
	padding-inline: 1.5rem;
	font-weight: 700;
	font-size: 18px;
	color: var(--mackay-text-heading);
	cursor: pointer;
	list-style: none;

	&::-webkit-details-marker {
		display: none;
	}
}

/* ── FAQ accordion (see default styling for details/summary above) ── */
.mackay-faq {
	display: flex;
	flex-direction: column;
	gap: .75rem;
	margin-block: 3rem;
	margin-inline: 0;
	transition: all 0.35s ease-in-out;
	
	details {
		&[open] {
			background: var(--mackay-green-light);

			summary {
				color: var(--mackay-primary-teal);
			}

			.mackay-faq__answer {
				height: auto;
				opacity: 1;
			}
		}
	}
	
	.mackay-faq__answer {
		height: 0;
		opacity: 0;
		overflow: hidden;
		transition: 
			height 0.35s cubic-bezier(0.25, 1, 0.5, 1), 
    		opacity 0.3s ease, 
    		content-visibility 0.35s allow-discrete;
		color: var(--mackay-text-muted);
		padding-block-start: 0;
		padding-block-end: 1.25rem;
		padding-inline: 1.5rem;
		font-size: 16px;
		line-height: 1.6;
	}
}

/* ── Card accordion (see default styling for details/summary above) ── */
.mackay-card-accordion {
	display: flex;
	flex-direction: column;
	gap: .75rem;
	margin-block: 3rem;
	margin-inline: 0;
	transition: all 0.35s ease-in-out;

	.mackay-card-accordion__body {
		padding-block: 1.5rem;
	}
}

/* ── Card accordion (info-box panels) ── */
.mackay-card-accordion {
	--header-background: var(--mackay-surface-white);
	--header-step-background: var(--mackay-primary-teal);

	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	margin-block: 3rem;
	margin-inline: 0;

	details.mackay-card-accordion__item:hover {
		border-color: var(--header-step-background);

		.mackay-card-accordion__number {
			transform: translateY(-4px);
			box-shadow: 0 5px 10px var(--header-step-background);
		}
	}

	summary {
		background: var(--header-background);
	}

	.mackay-card-accordion__header {
		display: flex;
		align-items: center;
		color: var(--mackay-text-heading);
		gap: 1.5rem;

		.mackay-card-accordion__number {
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 1.25rem;
			font-weight: 700;
			width: 2.75rem;
			height: 2.75rem;
			background: var(--header-step-background);
			color: var(--mackay-surface-white);
			color: contrast-color(var(--header-step-background));
			border-radius: 50%;
			transition: all .3s ease;
            box-shadow: 0 0 0px 0px var(--header-step-background);
		}

		& > div {
			display: flex;
			flex-direction: column;
			flex: 1;
		}

		.mackay-card-accordion__label {
			font-size: 1.25rem;
			font-weight: 700;
		}

		.mackay-card-accordion__subtitle {
			font-size: 1rem;
			font-weight: 500;
			color: var(--mackay-text-muted);
		}
	}

	.mackay-card-accordion__panel > .acf-innerblocks-container {
		display: flex;
		flex-direction: column;
		gap: 1rem;
	}

	.mackay-card-accordion__panel .mackay-info-box__container {
		margin-block: 0;
	}

	.mackay-card-accordion__sync-notice {
		margin-block-end: 1rem;
		padding-block: 0.75rem;
		padding-inline: 1rem;
		border-radius: 0.5rem;
		background: #fff3cd;
		border: 1px solid #ffc107;
		color: #664d03;
		font-size: 0.875rem;
	}
}

/* Editor: show panels source below triggers */
.block-editor-page .mackay-card-accordion__panels-source {
	display: block;
	margin-block-start: 1.5rem;
	padding-block-start: 1.5rem;
	border-top: 1px dashed rgba(0, 0, 0, 0.12);
}

.block-editor-page .mackay-card-accordion__body {
	display: none;
}

.block-editor-page .mackay-card-accordion__panel {
	margin-block-end: 2rem;
	padding-block-end: 2rem;
	border-block-end: 1px dashed rgba(0, 0, 0, 0.12);
}

.block-editor-page .mackay-card-accordion__panel:last-child {
	margin-block-end: 0;
	padding-block-end: 0;
	border-block-end: 0;
}


/* ── Page nav ── */
.mackay-page-nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	padding-block-start: 1.5rem;
	padding-inline: 0;
	border-top: 1px solid rgba(0, 0, 0, 0.08);
	margin-block-start: 3rem;

	.mackay-page-nav__link {
		display: flex;
		align-items: center;
		gap: 1rem;
		padding-block: 1rem;
		padding-inline: 1.5rem;
		border-radius: 12px;
		border: 1px solid rgba(0, 0, 0, 0.08);
		text-decoration: none;

		&:only-child:has(.fa-arrow-right) {
			margin-left: auto;
		}

		i, svg {
			font-size: 1lh;
			color: var(--mackay-teal-mid);
			transition: all 0.35s ease-in-out;
		}

		&:hover {
			background: var(--mackay-teal-light);
			color: var(--mackay-surface-white);

			i, svg {
				translate: 50% 0;
			}
		}
	}

	.mackay-page-nav__link-text {
		display: flex;
		flex-direction: column;
		gap: 0.25rem;

		span:first-child {
			font-size: 0.875rem;
			font-weight: 700;
			color: var(--mackay-text-muted);
		}

		span:last-child {
			font-size: 1rem;
			font-weight: 700;
			color: var(--mackay-text-heading);
		}
	}

	.mackay-page-nav__link-text-label {
		font-size: 14px;
		color: var(--mackay-text-muted);
	}
	
	.mackay-page-nav__link:hover {
		text-decoration: underline;
	}
}


/* ── Pillar cards ── */
.mackay-pillar-cards {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.25rem;
	margin-block: 2rem;
	margin-inline: 0;

	&.mackay-pillar-cards--2col {
		@media (min-width: 768px) {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
	}

	&.mackay-pillar-cards--3col {
		@media (min-width: 768px) {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}

		@media (min-width: 1024px) {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
	}
	
	.mackay-pillar-card {
		border-radius: 18px;
		padding-block: 1.875rem;
		padding-inline: 1.5rem;
		color: var(--mackay-surface-white);
	
		&.mackay-pillar-card--teal {
			background: linear-gradient(180deg, var(--mackay-primary-teal), var(--mackay-teal-mid));
		}
	
		&.mackay-pillar-card--green {
			background: linear-gradient(180deg, var(--mackay-green-dark), var(--mackay-green-mid));
		}
	
		&.mackay-pillar-card--brown {
			background: linear-gradient(180deg, var(--mackay-brown-dark), var(--mackay-brown-mid));
		}
	
		&.mackay-pillar-card--purple {
			background: linear-gradient(180deg, var(--mackay-purple-dark), var(--mackay-purple));
		}
	}
	
	.mackay-pillar-card__icon {
		width: 46px;
		height: 46px;
		background: rgba(255, 255, 255, 0.14);
		border-radius: 12px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 22px;
		margin-block-end: 1rem;
	}
	
	.mackay-pillar-card__title {
		font-size: 20px;
		font-weight: 700;
		margin-block-end: 0.75rem;
	}
	
	.mackay-pillar-card__text {
		line-height: 1.5;
		font-size: 1rem;
		opacity: 0.82;
		margin-block-end: 1.25rem;

		p:not(:last-child) {
			margin-block-end: 1rem; 
		}

		ul {
			list-style: none;
			padding: 0;
			margin: 0;

			li {
				display: flex;
                gap: 0.5rem;
				font-size: .95em;
                line-height: 1.25rem;
                margin-block-end: .75rem;

				&::before {
					content: '→';
				}
			}
		}		
	}
	
	.mackay-pillar-card__tags {
		display: flex;
		flex-wrap: wrap;
		gap: 6px;
	}
	
	.mackay-pillar-card__tag {
		background: rgba(255, 255, 255, 0.14);
		border-radius: 20px;
		padding-block: 0.125rem;
		padding-inline: 0.5625rem;
		font-size: 13px;
		font-weight: 700;
	}
}

/* ── Maturity levels ── */
.mackay-maturity-levels {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
	margin-block: 2rem;
	margin-inline: 0;
}

.mackay-maturity-card {
	--card-padding-block: 2rem;
	--card-padding-inline: 1.5rem;
	--card-background: var(--mackay-teal-light);
	--card-border-color-mix-secondary-color: var(--mackay-teal-mid);
	--card-border-color-mix-percentage: 50%;
	--card-border-color: color-mix(in srgb, var(--card-background) var(--card-border-color-mix-percentage), var(--card-border-color-mix-secondary-color));
	
	position: relative;
	padding-block: var(--card-padding-block);
	padding-inline: var(--card-padding-inline);
	border-radius: 18px;
	border: 1px solid var(--card-border-color);
	background: var(--card-background);
	transition: transform 0.2s ease, box-shadow 0.2s ease;

	&:hover {
		transform: translateY(-4px);
		box-shadow: 0 20px 40px var(--card-background);
	}

	&.mackay-maturity-card--teal {
		--card-background: var(--mackay-teal-light);
		--card-border-color-mix-secondary-color: var(--mackay-teal-mid);
		--card-border-color-mix-percentage: 50%;
	}
	
	&.mackay-maturity-card--green {
		--card-background: var(--mackay-green-light);
		--card-border-color-mix-secondary-color: var(--mackay-green-mid);
		--card-border-color-mix-percentage: 50%;
	}
	
	&.mackay-maturity-card--purple {
		--card-background: var(--mackay-purple-light);
		--card-border-color-mix-secondary-color: var(--mackay-purple);
		--card-border-color-mix-percentage: 50%;
	}
	
	&.mackay-maturity-card--gray {
		--card-background: var(--mackay-surface-gray);
		--card-border-color-mix-secondary-color: var(--mackay-text-heading);
		--card-border-color-mix-percentage: 90%;
	}

	&.mackay-maturity-card--white {
		--card-background: var(--mackay-surface-white);
		--card-border-color-mix-secondary-color: var(--mackay-text-heading);
		--card-border-color-mix-percentage: 90%;
	}

	.mackay-maturity-card__num {
		position: absolute;
		top: var(--card-padding-block);
		right: var(--card-padding-inline);
		font-size: 2.5rem;
		font-weight: 700;
		color: var(--mackay-text-heading);
		text-box-trim: trim-both;
        text-box-edge: ex alphabetic;
	}

	.mackay-maturity-card__icon {
		font-size: 1.5rem;
		color: var(--mackay-text-heading);
		margin-block-end: 1lh;
	}
	
	.mackay-maturity-card__title {
		font-size: 1.125rem;
		font-weight: 700;
		margin-block-end: .5lh;
		color: var(--mackay-text-heading);
	}
	
	.mackay-maturity-card__text {
		font-size: 1rem;
		line-height: 1.4;
		color: var(--mackay-text-muted);
	}

	.mackay-maturity-card__badges {
		display: flex;
		flex-wrap: wrap;
		gap: .5rem;
		margin-block-start: 1rem;

		.mackay-badge {
			background: var(--card-border-color);
			color: var(--mackay-surface-white); /* Fallback for contrast-color() */
			color: contrast-color(var(--card-border-color));
			user-select: none;
		}
	}
}

/* ── Steps timeline ── */
.mackay-steps-timeline {
	--step-block-start: .5rem;
	--step-num-width: 3rem;
	--step-line-width: .5rem;

	margin-block: 2rem;
	margin-inline: 0;
	position: relative;
	
	&::before {
		content: '';
		position: absolute;
		top: calc(var(--step-block-start) + var(--step-num-width) / 2);
		left: calc(var(--step-num-width) / 2 - (var(--step-line-width) / 2));
		width: var(--step-line-width);
		height: calc(100% - var(--step-block-start) - var(--step-num-width) / 2);
		background: linear-gradient(180deg, var(--mackay-primary-teal), var(--mackay-green-accent));
		border-radius: var(--step-line-width);
		z-index: 0;
		pointer-events: none;
		transform-origin: top center;
		animation: mackay-step-line-grow auto linear forwards;
		animation-timeline: view();
		animation-range: entry 40% contain 90%;
        opacity: 0;
        will-change: transform, opacity;

		@supports not (animation-timeline: view()) {
			opacity: 1;
		}

		@media (min-width: 768px) {
			animation-range: entry 20% contain 60%;
			--step-line-width: .25rem;
		}
	}

	.mackay-step {
		display: grid;
		grid-template-columns: 48px 1fr;
		gap: 1.5rem;
		padding-block-start: var(--step-block-start);
		padding-block-end: 1.5rem;
		padding-inline: 0;
		position: relative;
		z-index: 1;
	
		&:last-child {
			padding-block-end: 0;
		}
	}
	
	.mackay-step__num {
		width: var(--step-num-width);
		height: var(--step-num-width);
		border-radius: 50%;
		border: 2px solid var(--mackay-teal-mid);
		background: var(--mackay-surface-white);
		color: var(--mackay-teal-mid);
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: 700;
		font-size: 18px;
	}

	.mackay-step__content {
		display: flex;
		flex-direction: column;
		gap: .5rem;

		&.mackay-step__format--card {
			padding: 1.5rem;
			background: var(--mackay-surface-gray);
			border-radius: 14px;
			border: 1px solid rgba(0, 0, 0, 0.08);
		}

		.mackay-step__label {
			font-size: 14px;
			font-weight: 700;
			color: var(--mackay-primary-teal);
		}

		.mackay-step__title {
			font-size: 20px;
			font-weight: 700;
			margin-block-end: 0.5rem;
			color: var(--mackay-text-heading);
		}
		
		.mackay-step__text {
			font-size: 16px;
			color: var(--mackay-text-muted);
			margin: 0;
			line-height: 1.5;
		}

		.mackay-step__badges {
			display: flex;
			flex-wrap: wrap;
			gap: .5rem;
			margin-block-start: 1rem;

			span {
				text-transform: capitalize;
			}
		}
	}
}

/* These badges are used in multiple blocks */
.mackay-steps-badge--foundation {
	background: var(--mackay-teal-light);
	color: var(--mackay-teal-dark);
}

.mackay-steps-badge--intermediate {
	background: var(--mackay-green-light);
	color: var(--mackay-green-dark);
}

.mackay-steps-badge--advanced {
	background: var(--mackay-blue-light);
	color: var(--mackay-blue-dark);
}

.mackay-steps-badge--expert {
	background: var(--mackay-purple-light);
	color: var(--mackay-purple-dark);
}

@keyframes mackay-step-line-grow {
	from {
		opacity: 0;
		transform: scaleY(0);
	}

	to {
		opacity: 1;
		transform: scaleY(1);
	}
}

@media (prefers-reduced-motion: reduce) {
	.mackay-step {
		animation: none;
	}
}

/* Block editor: no scroll context for view timelines. */
.editor-styles-wrapper .mackay-step,
.block-editor-writing-flow .mackay-step {
	animation: none;
	opacity: 1;
}

/* ── Concept cards ── */
.mackay-concept-cards {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
	margin-block: 2rem;
	margin-inline: 0;
}

.mackay-concept-card {
	--mackay-concept-card-color: var(--mackay-teal-mid);

	display: flex;
	flex-direction: column;
	gap: .5rem;
	background: linear-gradient(180deg, var(--mackay-concept-card-color) var(--mackay-concept-card-color-stop), var(--mackay-surface-white) var(--mackay-concept-card-color-stop)) no-repeat;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 14px;
	padding: 1.5rem;

	@media (prefers-reduced-motion: no-preference) {
		will-change: --mackay-concept-card-color-stop;
		transition: --mackay-concept-card-color-stop 0.35s ease-out;
	}

	.mackay-concept-card__icon {
		color: var(--mackay-concept-card-color);
		font-size: 1.5rem;
		margin-block-end: .5rem;
		max-height: 3.75rem;

		img {
			height: 100%;
			width: auto;
		}
	}

	.mackay-concept-card__label {
		font-size: 0.875rem;
		font-weight: 700;
	}

	.mackay-concept-card__title {
		font-weight: 700;
		font-size: 1.125rem;
		color: var(--mackay-text-heading);
		margin-block-end: 0;
	}
	
	.mackay-concept-card__text {
		font-size: 1rem;
		color: var(--mackay-text-muted);
		flex: 1;
	}

	&:hover {
		--mackay-concept-card-color-stop: .5rem;
	}
}

/* ── Matter list ── */
.mackay-matter-list {
	margin-block: 2rem;
	margin-inline: 0;

	.mackay-matter-item {
		display: flex;
		gap: 20px;
		align-items: flex-start;
		padding: 1.5rem;
		background: var(--mackay-surface-gray);
		border-radius: 14px;
		margin-block-end: 1rem;
	}
	
	.mackay-matter-item__icon {
		width: 2.625rem;
		height: 2.625rem;
		color: var(--mackay-text-heading);
		display: flex;
		justify-content: center;
		font-size: 22px;
		flex-shrink: 0;
	}
	
	.mackay-matter-item__title {
		font-weight: 700;
		font-size: 18px;
		margin-block-end: 0.375rem;
	}
	
	.mackay-matter-item__text {
		font-size: 16px;
		color: var(--mackay-text-muted);
		margin: 0;
		line-height: 1.5;
	}
}

/* ── Four Cs ── */
.mackay-four-cs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 1rem;
	margin-block: 2rem;
	margin-inline: 0;
}

.mackay-four-c-card {
	background: var(--mackay-surface-gray);
	border-radius: 14px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
	padding-block: 1.5rem;
	padding-inline: 1rem;

	.mackay-four-c-card__letter {
		font-size: 2.5rem;
		font-weight: 700;
		color: var(--mackay-teal-mid);
	}
	
	.mackay-four-c-card__title {
		font-weight: 700;
		font-size: 18px;
		margin-block-end: 0.5rem;
	}
	
	.mackay-four-c-card__text {
		text-align: center;
		font-size: 1rem;
		color: var(--mackay-text-muted);
		margin: 0;
		line-height: 1.45;
	}
}

/* ── Stat cards ── */
.mackay-stat-cards {
	/* section styles handled with the others, search by class name */
	--stats-font-size: 3rem;

	.mackay-stat-card {
		background: var(--mackay-primary-teal);
		border-radius: 14px;
		display: grid;
		grid-template-rows: 2.625rem 1fr;
		align-items: center;
		justify-items: center;
		gap: .5rem;

		&.mackay-stat-card--number,
		&.mackay-stat-card--percentage {
			.mackay-stat-card__stat-number {
				counter-reset: stat-counter var(--mackay-counter-num);
				animation: mackay-count 2s forwards;
				animation-timeline: view();
				animation-range: entry 0% cover 33%;
			}
		}

		&.mackay-stat-card--icon {
			--stats-font-size: 2.5rem;
		}

		.mackay-stat-card__stat {
			display: flex;
			color: var(--mackay-lime-accent);
			font-size: var(--stats-font-size);
			font-weight: 300;
			margin-block-end: 1rem;

			@supports (counter-reset: stat-counter) {
				.mackay-stat-card__stat-number {
					font-size: 0;

					&::before {
						content: counter(stat-counter);
						font-size: var(--stats-font-size);
					}
				}
			}

			svg {
				stroke: currentColor;
				stroke-width: var(--stats-font-size);
				stroke-linejoin: round;
			}
		}

		.mackay-stat-card__text {
			color: color-mix(in srgb, var(--mackay-surface-white), transparent 25%);
			font-size: 1rem;
			text-wrap: pretty;
		}
	}
}

@keyframes mackay-count {
	100% {
		--mackay-counter-num: var(--mackay-stats-value, 100);
	}
}


/* ── Content blocks (generic) ── */
.mackay-two-col {
	column-count: 1;
	gap: 2rem;
	margin-block: 2rem;
	margin-inline: 0;

	p {
		margin-block-end: 1rem;
	}
}

.mackay-info-box {
	--box-color: var(--mackay-accent-orange-light);

	.mackay-info-box__container {
		display: flex;
		gap: 1rem;
		background: var(--box-color);
		border-radius: 14px;
		border: 2px solid color-mix(in srgb, var(--box-color) 90%, var(--mackay-text-heading));
		padding: 2rem;
		margin-block: 1.5rem;
		margin-inline: 0;
	}

	.mackay-info-box__icon {
		color: var(--mackay-text-heading);
		font-size: 1.5rem;

		svg {
			stroke: currentColor;
			stroke-width: 1.5rem;
			stroke-linejoin: round;
		}
	}

	.mackay-info-box__content {
		flex: 1;
	}
		
	.mackay-info-box__title {
		font-weight: 700;
		font-size: 18px;
		margin-block-end: 0.5rem;
		color: var(--mackay-text-heading);
	}
}

.mackay-divider {
	border: none;
	border-top: 1px solid rgba(0, 0, 0, 0.08);
	margin-block: 3rem;
	margin-inline: 0;
}

.mackay-stat-cards {
	display: grid;
	gap: 20px;
	margin-block: 2rem;
	margin-inline: 0;
	grid-template-columns: 1fr;
}

.mackay-content-card {
	background: var(--mackay-surface-white);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 14px;
	padding: 1.5rem;
	box-shadow: var(--mackay-shadow);
}

.mackay-content-card--accent-top {
	border-top: 4px solid var(--mackay-lime-accent);
}

.mackay-risk-table {
	margin-block: 2rem;
	margin-inline: 0;
	font-size: 16px;
	
	.mackay-risk-table__container {
		max-width: 100%;
		overflow-x: auto;
		border-radius: 0.75rem;
		scrollbar-width: thin;
		scrollbar-color: var(--mackay-primary-teal) transparent;
	}

	table {
		width: 100%;
		border-collapse: separate;
		border-spacing: 0;
		background: var(--mackay-surface-white);
	}

	th,
	td {
		background: var(--mackay-surface-white);
		border-block-start: 1px solid rgba(0, 0, 0, 0.08);
		border-block-end: 1px solid rgba(0, 0, 0, 0.08);
		padding-block: 0.875rem;
		padding-inline: 1rem;
		text-align: left;
		text-wrap: pretty;

		&:first-child {
			position: sticky;
			left: 0;
			z-index: 1;
			box-shadow: 4px 0 8px -4px rgba(0, 0, 0, 0.1);

			@media (min-width: 768px) {
				box-shadow: none;
			}
		}
	}
	
	th {
		background: var(--mackay-primary-teal);
		color: var(--mackay-surface-white);
		font-weight: 700;
		position: relative;
	}

	tbody {
		vertical-align: top;

		tr:nth-child(odd) td {
			background-color: var(--mackay-surface-gray);
		}

		td:first-child {
			font-weight: 700;
		}
	}
	
	.mackay-pillar-badge {
		display: inline-block;
		padding-block: 0.125rem;
		padding-inline: 0.625rem;
		border-radius: 20px;
		font-size: 0.875rem;
		font-weight: 700;
	}
	
	.mackay-pillar-badge--env { background: var(--mackay-teal-light); color: var(--mackay-teal-dark); }
	.mackay-pillar-badge--soc { background: var(--mackay-green-light); color: var(--mackay-green-dark); }
	.mackay-pillar-badge--gov { background: var(--mackay-accent-orange-light); color: var(--mackay-brown-dark); }

	&.mackay-color-pillar-headers th {
		--pillar-color: transparent;
		padding-inline-start: 1.5rem;

		&:nth-child(2) {
			--pillar-color: var(--mackay-teal-mid);
		}

		&:nth-child(3) {
			--pillar-color: var(--mackay-blue-accent);
		}

		&:nth-child(4) {
			--pillar-color: var(--mackay-purple);
		}

		&::before {
			position: absolute;
			content: '';
			width: .5rem;
			height: .5rem;
			border-radius: 50%;
			background: var(--pillar-color);
			top: 50%;
			left: .75rem;
			translate: 0 -50%;
		}
	}
}

.mackay-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	padding-block: 0.125rem;
	padding-inline: 0.625rem;
	border-radius: 20px;
	font-size: 0.875rem;
	font-weight: 700;
	text-transform: capitalize;
}

.mackay-badge i {
	font-size: 0.875rem;
	line-height: 1;
}

.mackay-badge--gray {
	background: var(--mackay-surface-gray);
	color: var(--mackay-text-muted);
}

.mackay-badge--teal {
	background: var(--mackay-teal-light);
	color: var(--mackay-teal-dark);
}

.mackay-badge--green {
	background: var(--mackay-green-light);
	color: var(--mackay-green-dark);
}

.mackay-badge--lime {
	background: color-mix(in srgb, var(--mackay-lime-accent) 18%, white);
	color: var(--mackay-lime-dark);
}

.mackay-badge--purple {
	background: var(--mackay-purple-light);
	color: var(--mackay-purple-dark);
}

.mackay-badge--foundation {
	background: var(--mackay-foundation-foreground);
	color: var(--mackay-surface-white);
}

.mackay-badge--advanced {
	background: var(--mackay-advanced-foreground);
	color: var(--mackay-surface-white);
}

.mackay-badge--expert {
	background: var(--mackay-expert-foreground);
	color: var(--mackay-surface-white);
}

/* ── Badges block ── */
.mackay-badges {
	margin-block: 2rem;
	margin-inline: 0;
}

.mackay-badges__container {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.mackay-badges__container--align-start {
	justify-content: start;
}

.mackay-badges__container--align-center {
	justify-content: center;
}

.mackay-badges__container--align-end {
	justify-content: end;
}

/* ── Pillar tabs ── */
.mackay-pillar-tabs__nav {
	display: flex;
	gap: 0.625rem;
	flex-wrap: wrap;
}

.mackay-pillar-tabs__btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding-block: 0.75rem;
	padding-inline: 1.375rem;
	border: 2px solid rgba(0, 0, 0, 0.08);
	border-radius: 0.75rem;
	background: var(--mackay-surface-white);
	font-family: var(--mackay-font-button);
	font-weight: 700;
	font-size: 0.875rem;
	color: var(--mackay-text-muted);
	cursor: pointer;
	transition: border-color 0.2s, background-color 0.2s, color 0.2s;
}

.mackay-pillar-tabs__dot {
	width: 0.625rem;
	height: 0.625rem;
	border-radius: 50%;
	flex-shrink: 0;
	background: currentColor;
}

.mackay-pillar-tabs__btn i {
	font-size: 1rem;
	line-height: 1;
}

.mackay-pillar-tabs__btn--teal {
	--mackay-pillar-tab-color: var(--mackay-teal-mid);
	--mackay-pillar-tab-bg: var(--mackay-teal-light);
	--mackay-pillar-tab-text: var(--mackay-teal-dark);
}

.mackay-pillar-tabs__btn--green {
	--mackay-pillar-tab-color: var(--mackay-green-accent);
	--mackay-pillar-tab-bg: var(--mackay-green-light);
	--mackay-pillar-tab-text: var(--mackay-green-dark);
}

.mackay-pillar-tabs__btn--orange {
	--mackay-pillar-tab-color: var(--mackay-accent-orange);
	--mackay-pillar-tab-bg: var(--mackay-accent-orange-light);
	--mackay-pillar-tab-text: var(--mackay-brown-dark);
}

.mackay-pillar-tabs__btn--teal .mackay-pillar-tabs__dot,
.mackay-pillar-tabs__btn--teal i {
	color: var(--mackay-teal-mid);
}

.mackay-pillar-tabs__btn--green .mackay-pillar-tabs__dot,
.mackay-pillar-tabs__btn--green i {
	color: var(--mackay-green-accent);
}

.mackay-pillar-tabs__btn--orange .mackay-pillar-tabs__dot,
.mackay-pillar-tabs__btn--orange i {
	color: var(--mackay-accent-orange);
}

.mackay-pillar-tabs__btn:hover {
	border-color: var(--mackay-pillar-tab-color, var(--mackay-teal-mid));
	color: var(--mackay-pillar-tab-color, var(--mackay-teal-mid));
	background: var(--mackay-pillar-tab-bg, var(--mackay-teal-light));
}

.mackay-pillar-tabs__btn.is-active {
	background: var(--mackay-pillar-tab-bg, var(--mackay-teal-light));
	border-color: var(--mackay-pillar-tab-color, var(--mackay-teal-mid));
	color: var(--mackay-pillar-tab-text, var(--mackay-teal-dark));
}

.mackay-pillar-tabs__panels {
	display: grid;
}

.mackay-pillar-tabs__panels > .acf-innerblocks-container,
.mackay-pillar-tabs__panel > .acf-innerblocks-container {
	min-height: 4rem;
}

.mackay-pillar-tabs__panel {
	display: none;
	opacity: 0;
	transform: translateY(0.75rem);
	transition:
		opacity var(--mackay-pillar-tab-duration, 0.35s) ease-out,
		transform var(--mackay-pillar-tab-duration, 0.35s) ease-out,
		display var(--mackay-pillar-tab-duration, 0.35s) ease-out allow-discrete;
}

.mackay-pillar-tabs__panel.is-active {
	display: block;
	opacity: 1;
	transform: translateY(0);
}

@starting-style {
	.mackay-pillar-tabs__panel.is-active {
		opacity: 0;
		transform: translateY(0.75rem);
	}
}

@media (prefers-reduced-motion: reduce) {
	.mackay-pillar-tabs__btn {
		transition: none;
	}

	.mackay-pillar-tabs__panel {
		transition: none;
	}
}

.mackay-pillar-tabs__sync-notice {
	margin-block-end: 1rem;
	padding-block: 0.75rem;
	padding-inline: 1rem;
	border-radius: 0.5rem;
	background: #fff3cd;
	border: 1px solid #ffc107;
	color: #664d03;
	font-size: 0.875rem;
}

/* Editor: show all tab panels while editing */
.block-editor-page .mackay-pillar-tabs__panel {
	display: block;
	opacity: 1;
	transform: none;
	transition: none;
	margin-block-end: 2rem;
	padding-block-end: 2rem;
	border-block-end: 1px dashed rgba(0, 0, 0, 0.12);
}

.block-editor-page .mackay-pillar-tabs__panel:last-child {
	margin-block-end: 0;
	padding-block-end: 0;
	border-block-end: 0;
}

/* ── About main column ── */
:is(.site-main--about, .site-main--hero-page) .mackay-about-content {
	max-width: var(--mackay-container-about);
	margin-block: 0;
	margin-inline: auto;
	padding-block-start: 2rem;
	padding-block-end: 5rem;
	padding-inline: var(--mackay-gutter);
}

/* ── LearnDash quiz & Learning Portal layout ── */
.mackay-quiz-page .site-main.mackay-quiz,
.mackay-learning-portal-page .site-main.mackay-learning-portal {
	background: var(--mackay-surface-sand);
}

.mackay-quiz-hero {
	padding-block: 3.25rem 2.25rem;
	padding-inline: var(--mackay-gutter);
	text-align: center;
	background: var(--mackay-surface-white);
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.mackay-quiz-hero__title {
	margin: 0;
	font-family: var(--mackay-font-display);
	font-size: clamp(1.75rem, 3vw, 2.125rem);
	line-height: 1.2;
	color: var(--mackay-text-heading);
}

.mackay-quiz-hero__meta {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 1.125rem;
	margin-block-start: 0.75rem;
	padding: 0;
	list-style: none;
	font-size: 0.8125rem;
	color: var(--mackay-text-muted);
}

.mackay-quiz-hero__meta-item {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	color: var(--mackay-primary-teal);
	font-size: 1rem;

	svg {
		stroke: currentColor;
		stroke-width: 2rem;
	}
}

.mackay-quiz-layout {
	background: var(--mackay-surface-sand);
	padding-block: 3rem 4.5rem;
	padding-inline: var(--mackay-gutter);

	h2, h4, strong { color: var(--mackay-primary-teal); }
	h2 { margin-block-end: 2rem; }
	p { margin-block-end: 1rem; }

	.mackay-maturity-card {
		--card-padding-inline: 1rem;
		--card-padding-block: 1rem;
		display: flex;
		flex-direction: column;
		align-items: center;

		:is(.mackay-maturity-card__icon, .mackay-maturity-card__title) {
			color: var(--card-border-color-mix-secondary-color);
			margin-block-end: 1rem;
		}

		.mackay-maturity-card__text {
			text-align: center;
		}

		.mackay-maturity-card__icon svg {
			stroke: currentColor;
			stroke-width: 1rem;
		}
	}

	.mackay-badge {
		text-transform: none;
	}
}

.mackay-quiz-layout__inner {
	max-width: 45rem;
	margin-inline: auto;
}

.mackay-quiz-extra-content {
	margin-block: 3rem;

	p:not(:last-child) {
		margin-block-end: 1rem;
	}

	:is(.label-foundation, .label-advanced, .label-expert) {
		display: inline-flex;
		align-items: center;
		gap: 0.25rem;
		font-weight: 700;
		font-size: 1rem;
	}

	.label-foundation {
		color: var(--mackay-foundation-foreground);
	}

	.label-advanced {
		color: var(--mackay-advanced-foreground);
	}

	.label-expert {
		color: var(--mackay-expert-foreground);
	}
}

.mackay-quiz {
	scroll-behavior: auto;
}

.mackay-quiz.is-quiz-complete [data-mackay-quiz-progress] {
	display: none !important;
}

.mackay-quiz:not(.is-quiz-active) .mackay-quiz-engine,
.mackay-quiz:not(.is-quiz-active) [data-mackay-quiz-progress],
.mackay-quiz:not(.is-quiz-active) [data-mackay-quiz-pillar] {
	display: none !important;
}

.mackay-quiz-card {
	background: var(--mackay-surface-white);
	border: 1.5px solid rgba(0, 0, 0, 0.07);
	border-radius: 1rem;
	padding: 1.875rem 1.75rem;
	box-shadow: var(--mackay-shadow);

	&:has(+ .mackay-quiz-card) {
		margin-block-end: 1.5rem;
	}
}

.mackay-quiz-card--intro {
	text-align: center;
}

.mackay-quiz-card--content {
	text-align: left;
}

.mackay-learning-portal__content > *:first-child {
	margin-block-start: 0;
}

.mackay-learning-portal__content > *:last-child {
	margin-block-end: 0;
}

.mackay-quiz-card__icon {
	font-size: 2.75rem;
	margin-block-end: 0.875rem;
}

.mackay-quiz-card__title {
	margin: 0 0 1rem;
	font-family: var(--mackay-font-display);
	font-size: clamp(1.125rem, 2.2vw, 1.375rem);
	line-height: 1.35;
	color: var(--mackay-text-heading);
}

.mackay-quiz-card__body {
	color: var(--mackay-text-muted);
	font-size: 0.9375rem;
	line-height: 1.7;
}

.mackay-quiz-card__body p {
	margin-block-end: 1rem;
}

.mackay-quiz-pillar-pills {
	display: flex;
	flex-wrap: wrap;
	justify-content: start;
	gap: 0.625rem;
	margin: 1.5rem 0 0;
	padding: 0;
	list-style: none;

	.mackay-quiz-pillar-pills__item--environmental {
		background: var(--mackay-teal-light);
		color: var(--mackay-teal-dark);
	}
	
	.mackay-quiz-pillar-pills__item--social {
		background: var(--mackay-green-light);
		color: var(--mackay-green-dark);
	}
	
	.mackay-quiz-pillar-pills__item--governance {
		background: var(--mackay-purple-light);
		color: var(--mackay-purple-dark);
	}
}


.mackay-quiz-level-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
	gap: 0.75rem;
	margin-block: 1.75rem 1.5rem;
	padding: 0;
	list-style: none;
	text-align: left;
}

.mackay-quiz-level-grid__item {
	padding: 1rem;
	border-radius: 0.75rem;
	border: 1px solid rgba(0, 0, 0, 0.08);
}

.mackay-quiz-level-grid__item--foundation {
	background: var(--mackay-green-light);
}

.mackay-quiz-level-grid__item--advanced {
	background: var(--mackay-teal-light);
}

.mackay-quiz-level-grid__item--expert {
	background: var(--mackay-purple-light);
}

.mackay-quiz-level-grid__emoji {
	display: block;
	margin-block-end: 0.375rem;
	font-size: 1.25rem;
}

.mackay-quiz-level-grid__item strong {
	display: block;
	margin-block-end: 0.375rem;
	color: var(--mackay-text-heading);
}

.mackay-quiz-level-grid__item p {
	margin: 0;
	font-size: 0.75rem;
	color: var(--mackay-text-muted);
	line-height: 1.5;
}

.mackay-quiz-start-button {
	display: flex;
	justify-content: center;
}

.mackay-quiz-start {
	margin-block-start: 0.5rem;
}

.mackay-quiz-progress {
	margin-block-end: 1.375rem;
}

.mackay-quiz-progress__top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 0.5rem;
	margin-block-end: 0.5rem;
	flex-wrap: wrap;
}

.mackay-quiz-progress__label {
	font-size: 0.6875rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--mackay-teal-mid);
}

.mackay-quiz-progress__count {
	font-size: 0.6875rem;
	color: var(--mackay-text-muted);
}

.mackay-quiz-progress__bar {
	height: 0.4375rem;
	border-radius: 0.25rem;
	background: rgba(0, 0, 0, 0.08);
	overflow: hidden;
}

.mackay-quiz-progress__fill {
	height: 100%;
	width: 0;
	border-radius: inherit;
	background: linear-gradient(90deg, var(--mackay-green-accent), var(--mackay-teal-mid));
	transition: width 0.25s ease;
}

.mackay-quiz-engine .learndash-wrapper.learndash-wrap,
.mackay-quiz-engine .wpProQuiz_text,
.mackay-quiz-engine .wpProQuiz_question_page,
.mackay-quiz-engine .wpProQuiz_header {
	display: none !important;
}

/* LDAdvQuiz omits learndash-wrapper — mirror LD30 resets so Mackay styles apply */
.mackay-quiz-engine .wpProQuiz_content .wpProQuiz_question {
	background: transparent;
	border: none;
	margin: 0;
	padding: 0 0 1em;
}

.mackay-quiz-engine .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item) .ld-quiz-question-item__status--missed,
.mackay-quiz-engine .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item) .ld-quiz-question-item__status--correct,
.mackay-quiz-engine .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item) .ld-quiz-question-item__status--incorrect {
	display: none;
}

/* LearnDash category line duplicates the Mackay pillar pill */
.mackay-quiz-engine .wpProQuiz_listItem > div:has(+ fieldset.wpProQuiz_question) {
	display: none !important;
}

.mackay-quiz-engine .learndash-wrapper {
	padding: 0;
}

.mackay-quiz-engine .learndash-wrapper .wpProQuiz_content .wpProQuiz_question_text {
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.65;
	color: var(--mackay-text-heading);
}

.mackay-quiz-engine .wpProQuiz_content .wpProQuiz_questionList {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.mackay-quiz-engine .wpProQuiz_content .wpProQuiz_questionListItem {
	margin: 0;
}

.mackay-quiz-engine .wpProQuiz_content .wpProQuiz_questionListItem label.mackay-quiz-option {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	width: 100%;
	padding-block: 0.8125rem;
	padding-inline: 0.9375rem;
	border: 2px solid rgba(0, 0, 0, 0.08);
	border-radius: 0.625rem;
	background: var(--mackay-surface-gray);
	cursor: pointer;
	transition: border-color 0.18s ease, background 0.18s ease;
}

.mackay-quiz-engine .wpProQuiz_content .wpProQuiz_questionListItem label.mackay-quiz-option:hover,
.mackay-quiz-engine .wpProQuiz_content .wpProQuiz_questionListItem label.mackay-quiz-option.is-selected,
.mackay-quiz-engine .wpProQuiz_content .wpProQuiz_questionListItem label.mackay-quiz-option:focus-within {
	border-color: var(--mackay-teal-mid) !important; /* Override LearnDash's default */
	background: var(--mackay-teal-light) !important; /* Override LearnDash's default */
}

.mackay-quiz-engine .wpProQuiz_content .wpProQuiz_questionListItem label.mackay-quiz-option input {
	flex-shrink: 0;
	min-width: 1rem;
	margin-block-start: 0.125rem;
	accent-color: var(--mackay-primary-teal);
}

.mackay-quiz-engine .wpProQuiz_content .wpProQuiz_button,
.mackay-quiz-engine .wpProQuiz_content .wpProQuiz_button2 {
	width: auto;
	min-width: 8.75rem;
	max-width: none;
	margin-block-start: 1.375rem;
	margin-inline-start: auto;
	display: inline-flex;
	justify-content: center;
	padding-block: 0.75rem;
	padding-inline: 1.5rem;
	border: 0;
	border-radius: 999px;
	background: var(--mackay-teal-mid);
	color: var(--mackay-surface-white);
	font-family: var(--mackay-font-button);
	font-size: 0.875rem;
	font-weight: 600;
}

.mackay-quiz-results {
	display: flex;
	flex-direction: column;
	gap: 1.125rem;
}

.mackay-quiz-results__empty {
	padding: 2rem;
}

/* LearnDash registration page — open login form when ?action=login */
.mackay-registration--login .ld-registration__wrapper .ld-registration__login,
.mackay-registration--login .ld-registration__wrapper .ld-registration__login-form {
	display: block;
}

.mackay-registration--login .ld-registration__wrapper .ld-registration__register,
.mackay-registration--login .ld-registration__wrapper .ld-registration__register-form {
	display: none;
}

.mackay-quiz-results__hero.mackay-completion-banner {
	margin-block: 0;
}

.mackay-quiz-results__hero.mackay-completion-banner::before {
	display: none;
}

.mackay-quiz-results__score-pills {
	margin-block-start: 0;
}

.mackay-quiz-results__score-pill {
	flex-direction: column;
	align-items: center;
	gap: 0.25rem;
	min-width: 6.25rem;
	padding-block: 0.625rem;
	padding-inline: 0.875rem;
	font-weight: 400;
}

.mackay-quiz-results__score-pill strong {
	color: var(--mackay-surface-white);
	font-size: 1.375rem;
	font-weight: 700;
	line-height: 1;
}

.mackay-quiz-results__score-pill span {
	font-size: 1.125rem;
	font-weight: 700;
	letter-spacing: 0.025em;
	color: color-mix(in srgb, var(--mackay-surface-white) 65%, transparent);
}

.mackay-quiz-results__level-row {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.625rem;
}

.mackay-quiz-results__level-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	padding: 1rem 0.875rem;
	border: 2px solid color-mix(in srgb, var(--card-border-color) 20%, var(--mackay-surface-white));
	border-radius: 0.75rem;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	
	&.foundation {
		background: var(--mackay-foundation-background);
		--card-border-color: var(--mackay-foundation-foreground);
		color: var(--mackay-foundation-foreground);
	}
	
	&.advanced {
		background: var(--mackay-advanced-background);
		--card-border-color: var(--mackay-advanced-foreground);
		color: var(--mackay-advanced-foreground);
	}
	
	&.expert {
		background: var(--mackay-expert-background);
		--card-border-color: var(--mackay-expert-foreground);
		color: var(--mackay-expert-foreground);
	}
	
	&.you {
		border-color: var(--card-border-color);
		transform: translateY(-0.1875rem);
		box-shadow: 0 0.375rem 1.25rem rgba(0, 0, 0, 0.1);
	}

	:is(i, svg) {
		font-size: 1.5rem;
		line-height: 1;
		stroke: currentColor;
		stroke-width: 1rem;
	}

	.mackay-quiz-results__level-name {
		margin: 0;
		font-size: 1.125rem;
		font-weight: 700;
	}
	
	.mackay-quiz-results__level-here {
		display: inline-block;
		margin-top: 0.25rem;
		padding: 0.125rem 0.5rem;
		border-radius: 0.5rem;
		background: var(--mackay-teal-mid);
		color: var(--mackay-surface-white);
		font-size: 0.8125rem;
		font-weight: 700;
	}
}

.mackay-quiz-results__strategy {
	margin-block-start: 2rem;
}

.mackay-quiz-results__pillar-card,
.mackay-quiz-results__strategy-item {
	padding: 1.5rem 1.625rem;
	box-shadow: none;
}

.mackay-quiz-results__section-title,
.mackay-quiz-results__strategy-heading {
	margin: 0 0 1rem;
	font-size: 1rem;
	font-weight: 700;
	color: var(--mackay-text-heading);
}

.mackay-quiz-results__strategy-intro {
	max-width: 42rem;
	margin: 0 0 1rem;
	font-size: 0.9375rem;
	line-height: 1.65;
	color: var(--mackay-text-muted);
}

.mackay-quiz-results__score-bar {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 0.8125rem;

	&:last-child {
		margin-bottom: 0;
	}

	.mackay-quiz-results__score-label {
		display: inline-flex;
		align-items: center;
		gap: 0.375rem;
		min-width: 7.625rem;
		font-size: 0.875rem;
		font-weight: 700;
		color: var(--mackay-text-heading);
	}
	
	.mackay-quiz-results__score-track {
		flex: 1;
		height: 0.5rem;
		overflow: hidden;
		border-radius: 0.25rem;
		background: rgba(0, 0, 0, 0.07);
	}
	
	.mackay-quiz-results__score-fill {
		width: var(--mackay-score, 0%);
		height: 100%;
		border-radius: 0.25rem;
		transition: width 0.8s ease;
	
		&.sbr-e {
			background: var(--mackay-teal-mid);
		}
		
		&.sbr-s {
			background: var(--mackay-green-accent);
		}
		
		&.sbr-g {
			background: var(--mackay-accent-orange);
		}
	}
	
	.mackay-quiz-results__score-pct {
		min-width: 2.125rem;
		font-size: 0.875rem;
		font-weight: 700;
		text-align: right;
	
		&.sbr-pct-e {
			color: var(--mackay-teal-mid);
		}
		
		&.sbr-pct-s {
			color: var(--mackay-green-accent);
		}
		
		&.sbr-pct-g {
			color: var(--mackay-accent-orange);
		}
	}
}


.mackay-quiz-results__strategy-items {
	display: flex;
	flex-direction: column;
	gap: 0.5625rem;

	.mackay-quiz-results__strategy-item {
		display: flex;
		gap: 0.8125rem;
		align-items: flex-start;
		border: 1px solid transparent;
		border-radius: 0.6875rem;
		background: var(--mackay-surface-white);
		box-shadow: inset 12px 0px 0 -4px var(--item-shadow-color);

		&.priority {
			border-color: color-mix(in srgb, var(--mackay-teal-mid) 28%, transparent);
			background: var(--mackay-teal-light);
		}

		&.environmental {
			--item-shadow-color: var(--mackay-teal-mid);
			--icon-background: var(--mackay-teal-mid);
		}

		&.social {
			--item-shadow-color: var(--mackay-green-accent);
			--icon-background: var(--mackay-green-accent);
		}
		
		&.governance {
			--item-shadow-color: var(--mackay-accent-orange);
			--icon-background: var(--mackay-accent-orange);
		}
	}

	.mackay-quiz-results__strategy-icon {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 2.125rem;
		min-width: 2.125rem;
		height: 2.125rem;
		border-radius: 0.5625rem;
		background: var(--icon-background);
		color: var(--mackay-surface-white);
		font-size: 1rem;
	}

	.mackay-quiz-results__strategy-title {
		display: flex;
		align-items: center;
		gap: 0.375rem;
		margin-block-end: .5rem;
        font-size: 1rem;
        font-weight: 700;
        color: var(--mackay-text-heading);
	}

	.mackay-quiz-results__strategy-text {
		margin: 0;
		font-size: 0.875rem;
		color: var(--mackay-text-muted);
	}

	.mackay-quiz-results__priority-chip {
		display: inline-block;
		margin-inline-start: 0.375rem;
		padding: 0.125rem 0.4375rem;
		border-radius: 0.4375rem;
		background: var(--mackay-teal-mid);
		color: var(--mackay-surface-white);
		font-size: 0.625rem;
		font-weight: 700;
		letter-spacing: 0.025em;
		text-transform: uppercase;
		vertical-align: middle;
	}
	
	.mackay-quiz-results__strategy-content {
		font-size: 0.9375rem;
		line-height: 1.65;
		color: var(--mackay-text-muted);

		p:last-child {
			margin-bottom: 0;
		}
	}	
}

.mackay-quiz-results__next-steps {
	padding: 1.5rem 1.625rem;
	border: 1.5px solid color-mix(in srgb, var(--mackay-green-accent) 25%, transparent);
	border-radius: 0.875rem;
	background: var(--mackay-green-light);
}

.mackay-quiz-results__next-steps-heading {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 0.75rem;
	font-size: 1rem;
	font-weight: 700;
	color: var(--mackay-text-heading);
}

.mackay-quiz-results__next-steps-list {
	display: flex;
	flex-direction: column;
	gap: 0.625rem;
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: mackay-quiz-next-step;
}

.mackay-quiz-results__next-step {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	font-size: 1rem;
	line-height: 1.65;
	color: var(--mackay-text-heading);
	counter-increment: mackay-quiz-next-step;

	&::before {
		content: counter(mackay-quiz-next-step);
		display: flex;
		align-items: center;
		justify-content: center;
		width: 1.375rem;
		min-width: 1.375rem;
		height: 1.375rem;
		border-radius: 50%;
		background: var(--mackay-green-accent);
		color: var(--mackay-surface-white);
		font-size: 0.6875rem;
		font-weight: 700;
	}
}

.mackay-quiz-results__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.625rem;
	margin-top: 0.25rem;
}

.mackay-quiz-results__page-content {
	margin-top: 1.5rem;
}

.mackay-quiz-results__page-content .mackay-cta-strip {
	margin-block: 0 1.5rem;
}

@media (min-width: 768px) {
	.mackay-quiz-results__level-row {
		grid-template-columns: repeat(3, 1fr);
	}

	.mackay-quiz-results__actions {
		gap: 0.75rem;
	}
}

.mackay-quiz-redirect-overlay {
	position: absolute;
	inset: 0;
	z-index: 20;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2rem;
	background: var(--mackay-surface-white);
	text-align: center;
}

.mackay-quiz-redirect-overlay p {
	margin: 0;
	font-size: 1rem;
	font-weight: 600;
	color: var(--mackay-charcoal, #1c2b2b);
}

.mackay-quiz-card.is-quiz-redirecting {
	position: relative;
}

.mackay-quiz-card.is-quiz-redirecting .wpProQuiz_sending,
.mackay-quiz-card.is-quiz-redirecting .wpProQuiz_results,
.mackay-quiz-card.is-quiz-redirecting .wpProQuiz_checkPage {
	display: none !important;
}

.mackay-quiz-card.is-quiz-redirecting .mackay-quiz-engine {
	position: relative;
	min-height: 8rem;
}


/* Layout classes */
section:is(.mackay--2col-layout,
.mackay--3col-layout,
.mackay--4col-layout) {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(var(--min-column-width, 225px), 1fr));
}

.mackay--3col-layout {
	--min-column-width: 300px;
}

/* ── Responsive (mobile-first) ── */
@media (min-width: 768px) {
	.mackay-progress-strip__item {
		font-size: 0.9375rem;
	}

	.mackay-two-col {
		column-count: 2;
	}

	.mackay-concept-cards {
		grid-template-columns: repeat(2, 1fr);
	}

	.mackay-stat-cards {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1024px) {
	.mackay-hero-home__title,
	.mackay-about-hero__title {
		font-size: 56px;
	}

	.mackay-pathway-cards__grid,
	.mackay-stats-row__grid,
	.mackay-pillar-cards,
	.mackay-maturity-levels {
		grid-template-columns: repeat(3, 1fr);
	}

	.mackay-four-cs {
		grid-template-columns: repeat(4, 1fr);
	}

	.mackay-stat-cards {
		grid-template-columns: repeat(3, 1fr);
	}

	.mackay--4col-layout {
		display: grid;
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

/* ── Print styles ── */
@page {
	size: A4 portrait;
	margin: 0mm !important; 
}

@media print {
	h1, h2, h3 {
		break-after: avoid-page !important;
	}

	/* Prevent mid-element splitting on images, code blocks, or tables */
	img, 
	table, 
	blockquote, 
	pre {
		break-inside: avoid;
	}

	html {
		background-color: #ffffff;
    	margin: 0px !important;
	}

	body {
		margin: 2cm 1.5cm 2cm 1.5cm !important; /* Top Right Bottom Left */
    	background: #ffffff;
		color: var(--mackay-text-heading) !important;
		font-size: 11pt;
		font-family: var(--mackay-font-body);
		line-height: 1.5;
	}

	p {
		orphans: 3;
		widows: 3;
	}

	a[href^="http"]:after {
		content: " (" attr(href) ") ";
		font-size: 9pt;
		color: var(--mackay-text-muted);
	}

	.mackay-header,
	.mackay-footer,
	.mackay-quiz-results__level-row,
	.mackay-quiz-results__actions,
	.mackay-quiz-results__page-content,
	.mackay-quiz-hero__meta,
	.mackay-quiz-results__strategy-icon {
		display: none !important;
	}

	.mackay-quiz-hero {
		margin: 0cm;
		padding: 1cm;
	}

	.mackay-quiz-layout {
		background: white;
	}

	.site-main, .mackay-quiz-layout__inner {
		width: 100% !important;
		max-width: none !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.mackay-quiz-results__hero, .mackay-quiz-results__pillar-card, .mackay-quiz-results__next-steps {
		print-color-adjust: exact;
		-webkit-print-color-adjust: exact;
	}

	.mackay-quiz-results__strategy {
		break-before: page;
		page-break-before: always;
		display: block;
		height: 0;

		.mackay-quiz-results__strategy-item {
			break-inside: avoid;
			page-break-inside: avoid;
			border: 1px solid var(--mackay-border-color);
		}
	}

	.mackay-quiz-results__next-steps {
		break-before: page;
		page-break-before: always;
		display: block;
		height: 0;
	}
}