/*
 * SiteAuditHub Case Studies - front-end styles.
 * Every rule is scoped to .sahcs-scope and every class starts with
 * "sahcs-", so nothing here can change the rest of your site.
 * Colours, fonts, sizes and corners come from CSS variables set in
 * Case Studies → Settings → Design.
 */

/* ---------- Tokens and base ---------- */

.sahcs-scope {
	--sahcs-primary: #4f46e5;
	--sahcs-accent: #06b6d4;
	--sahcs-heading: #111827;
	--sahcs-text: #374151;
	--sahcs-bg: #ffffff;
	--sahcs-card: #ffffff;
	--sahcs-soft: #f5f6fb;
	--sahcs-size: 17px;
	/* Typography (px numbers): desktop / phone. Sizes glide between them
	   from 380px to 1024px wide screens, so tablets get an in-between size. */
	--sahcs-p-d: 17;
	--sahcs-p-m: 16;
	--sahcs-h1-d: 37;
	--sahcs-h1-m: 28;
	--sahcs-h2-d: 30;
	--sahcs-h2-m: 24;
	--sahcs-h3-d: 21;
	--sahcs-h3-m: 19;
	--sahcs-fs-p: clamp(calc(var(--sahcs-p-m) * 1px), calc(var(--sahcs-p-m) * 1px + (var(--sahcs-p-d) - var(--sahcs-p-m)) * (100vw - 380px) / 644), calc(var(--sahcs-p-d) * 1px));
	--sahcs-fs-h1: clamp(calc(var(--sahcs-h1-m) * 1px), calc(var(--sahcs-h1-m) * 1px + (var(--sahcs-h1-d) - var(--sahcs-h1-m)) * (100vw - 380px) / 644), calc(var(--sahcs-h1-d) * 1px));
	--sahcs-fs-h2: clamp(calc(var(--sahcs-h2-m) * 1px), calc(var(--sahcs-h2-m) * 1px + (var(--sahcs-h2-d) - var(--sahcs-h2-m)) * (100vw - 380px) / 644), calc(var(--sahcs-h2-d) * 1px));
	--sahcs-fs-h3: clamp(calc(var(--sahcs-h3-m) * 1px), calc(var(--sahcs-h3-m) * 1px + (var(--sahcs-h3-d) - var(--sahcs-h3-m)) * (100vw - 380px) / 644), calc(var(--sahcs-h3-d) * 1px));
	--sahcs-radius: 14px;
	--sahcs-width: 1140px;
	--sahcs-font-heading: inherit;
	--sahcs-font-body: inherit;
	--sahcs-muted: color-mix(in srgb, var(--sahcs-text) 84%, var(--sahcs-bg));
	--sahcs-line: color-mix(in srgb, var(--sahcs-text) 14%, transparent);
	--sahcs-card-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 8px 24px -8px rgba(16, 24, 40, .12);
	--sahcs-card-border: 1px solid color-mix(in srgb, var(--sahcs-text) 8%, transparent);
	--sahcs-gap: clamp(16px, 2.4vw, 28px);
	--sahcs-section-gap: clamp(40px, 6vw, 72px);
	--sahcs-up: #047857;
	--sahcs-on-primary: #ffffff;
	--sahcs-down: #b42318;
}

/* Older browsers without color-mix() (Safari before 16.2, Firefox before 113):
   plain fallback colours so text, lines and soft backgrounds still show. */
@supports not (color: color-mix(in srgb, red 50%, blue)) {
	.sahcs-scope {
		--sahcs-muted: #5b6472;
		--sahcs-line: rgba(17, 24, 39, 0.14);
		--sahcs-card-border: 1px solid rgba(17, 24, 39, 0.08);
	}

	.sahcs-scope .sahcs-chip,
	.sahcs-scope .sahcs-glance__icon,
	.sahcs-scope .sahcs-testimonial__badge,
	.sahcs-scope .sahcs-team__social,
	.sahcs-scope .sahcs-team__initials,
	.sahcs-scope .sahcs-faq__q::after {
		background-color: rgba(79, 70, 229, 0.1);
	}

	.sahcs-glance.sahcs-glance,
	.sahcs-testimonial.sahcs-testimonial {
		background-color: #f5f6fb;
	}
}

/* Low-specificity base so per-section colour/font/size choices win */
:where(.sahcs-scope) {
	font-family: var(--sahcs-font-body);
	font-size: var(--sahcs-size);
	font-size: var(--sahcs-fs-p);
	line-height: 1.65;
	color: var(--sahcs-text);
	-webkit-font-smoothing: antialiased;
}

/* A section given its own text colour or font in the editor sidebar
   passes it on to its titles, labels and numbers too. */
.sahcs-scope.has-text-color {
	--sahcs-heading: currentColor;
	--sahcs-text: currentColor;
	--sahcs-muted: currentColor;
}

.sahcs-scope[class*="-font-family"] {
	--sahcs-font-heading: inherit;
	--sahcs-font-body: inherit;
}

.sahcs-scope.has-background {
	padding: clamp(24px, 4vw, 44px);
	border-radius: var(--sahcs-radius);
}

.sahcs-scope,
.sahcs-scope *,
.sahcs-scope *::before,
.sahcs-scope *::after,
.sahcs-lightbox,
.sahcs-lightbox *,
.sahcs-lightbox *::before,
.sahcs-lightbox *::after {
	box-sizing: border-box;
}

.sahcs-scope img {
	max-width: 100%;
	height: auto;
}

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

/* Headings share one look */
.sahcs-scope .sahcs-hero__title,
.sahcs-scope .sahcs-section__title,
.sahcs-scope .sahcs-results__title,
.sahcs-scope .sahcs-gallery__title,
.sahcs-scope .sahcs-faq__title,
.sahcs-scope .sahcs-team__title,
.sahcs-scope .sahcs-related__title,
.sahcs-scope .sahcs-cta__title,
.sahcs-scope .sahcs-archive__title,
.sahcs-scope .sahcs-grid-wrap__title,
.sahcs-scope .sahcs-card__title,
.sahcs-scope .sahcs-feature__title,
.sahcs-scope .sahcs-preview__h {
	font-family: var(--sahcs-font-heading);
	color: var(--sahcs-heading);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.015em;
	margin: 0;
	text-transform: none;
}

.sahcs-scope .sahcs-section__title,
.sahcs-scope .sahcs-results__title,
.sahcs-scope .sahcs-gallery__title,
.sahcs-scope .sahcs-faq__title,
.sahcs-scope .sahcs-team__title,
.sahcs-scope .sahcs-related__title,
.sahcs-scope .sahcs-grid-wrap__title {
	font-size: clamp(1.45em, 1.1em + 1.2vw, 2em);
	margin-bottom: 0.7em;
}

.sahcs-scope [id] {
	scroll-margin-top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--sahcs-header-h, 72px) + 24px);
}

/* Links and buttons */
.sahcs-scope a {
	color: var(--sahcs-primary);
	text-underline-offset: 0.18em;
}

.sahcs-scope .sahcs-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	min-height: 48px;
	padding: 0.75em 1.5em;
	border: 2px solid var(--sahcs-primary);
	border-radius: min(var(--sahcs-radius), 999px);
	background: var(--sahcs-primary);
	color: var(--sahcs-on-primary);
	font-family: var(--sahcs-font-body);
	font-size: 1em;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.2s, color 0.2s, transform 0.2s, box-shadow 0.2s;
}

.sahcs-scope .sahcs-button:hover {
	background: color-mix(in srgb, var(--sahcs-primary) 86%, #000);
	border-color: color-mix(in srgb, var(--sahcs-primary) 86%, #000);
	color: var(--sahcs-on-primary);
}

.sahcs-scope .sahcs-button--ghost {
	background: transparent;
	color: var(--sahcs-primary);
}

.sahcs-scope .sahcs-button--ghost:hover {
	background: var(--sahcs-primary);
	color: var(--sahcs-on-primary);
}

.sahcs-scope .sahcs-button--light {
	background: #fff;
	border-color: #fff;
	color: var(--sahcs-primary);
}

.sahcs-scope .sahcs-button--light:hover {
	background: color-mix(in srgb, #fff 88%, var(--sahcs-primary));
	border-color: transparent;
	color: var(--sahcs-primary);
}

/*
 * Focus: clicking with a mouse or finger shows no box (some themes add one
 * on every click); moving with the Tab key shows a clear ring instead.
 */
.sahcs-scope :is(a, button, summary, [tabindex]):focus:not(:focus-visible),
.sahcs-lightbox :is(a, button, [tabindex]):focus:not(:focus-visible),
.sahcs-lightbox:focus:not(:focus-visible) {
	outline: none;
}

.sahcs-scope a:focus-visible,
.sahcs-scope button:focus-visible,
.sahcs-scope summary:focus-visible,
.sahcs-scope .sahcs-button:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--sahcs-primary) 60%, transparent);
	outline-offset: 3px;
}

/* Inside the FAQ list the ring sits just inside the row, so nothing is cut off. */
.sahcs-scope .sahcs-faq__q:focus-visible {
	outline-offset: -3px;
	border-radius: 6px;
}

.sahcs-scope .sahcs-chip {
	display: inline-block;
	padding: 0.28em 0.75em;
	border-radius: 999px;
	background: color-mix(in srgb, var(--sahcs-primary) 11%, var(--sahcs-bg));
	color: color-mix(in srgb, var(--sahcs-primary) 88%, var(--sahcs-heading));
	font-size: 0.78em;
	font-weight: 600;
	line-height: 1.4;
	text-decoration: none;
	white-space: nowrap;
}

.sahcs-scope a.sahcs-chip:hover {
	background: color-mix(in srgb, var(--sahcs-primary) 20%, var(--sahcs-bg));
}

/* ---------- Page containers ---------- */

.sahcs-single,
.sahcs-archive {
	max-width: var(--sahcs-width);
	margin-inline: auto;
	padding: calc(clamp(24px, 5vw, 56px) + var(--sahcs-push, 0px)) clamp(16px, 4vw, 32px) clamp(48px, 7vw, 88px);
	/* The theme's background shows unless a page background is chosen. */
	background: var(--sahcs-page-bg, transparent);
	box-shadow: 0 0 0 100vmax var(--sahcs-page-bg, transparent);
	clip-path: inset(0 -100vmax);
}

.sahcs-main {
	display: block;
	width: 100%;
}

/* ---------- Hero ---------- */

.sahcs-hero.sahcs-hero {
	container-type: inline-size;
}

/* The hero and listing title scroll with the page: never sticky or fixed,
   even when the theme makes its own header sticky. */
.sahcs-hero.sahcs-hero,
.sahcs-hero .sahcs-hero__inner,
.sahcs-hero .sahcs-hero__text,
.sahcs-hero .sahcs-hero__media,
.sahcs-hero .sahcs-hero__title,
.sahcs-archive .sahcs-archive__header {
	position: relative !important;
	top: auto !important;
}

/* Zero specificity so page spacing rules always win. */
:where(.sahcs-hero) {
	margin: 0 0 var(--sahcs-section-gap);
}

.sahcs-scope .sahcs-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: clamp(24px, 4vw, 56px);
	align-items: center;
}

/* Two columns only when the hero itself has room, not just the screen. */
@container (min-width: 760px) {
	.sahcs-hero--split:not(.sahcs-hero--no-image) .sahcs-hero__inner {
		grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	}
}

.sahcs-hero--stacked {
	text-align: center;
}

.sahcs-hero--stacked .sahcs-hero__text {
	max-width: 820px;
	margin-inline: auto;
}

.sahcs-scope .sahcs-hero__eyebrow {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 1em;
}

.sahcs-hero--stacked .sahcs-hero__eyebrow {
	justify-content: center;
}

.sahcs-scope .sahcs-hero__title {
	font-size: clamp(1.9em, 1.2em + 3vw, 3.2em);
	font-size: clamp(1.8em, 1.1em + 3.4cqi, 3.2em);
	line-height: 1.12;
	letter-spacing: -0.025em;
}

.sahcs-scope .sahcs-hero__intro {
	margin: 1em 0 0;
	font-size: 1.15em;
	line-height: 1.6;
	color: var(--sahcs-muted);
	max-width: 62ch;
}

.sahcs-hero--stacked .sahcs-hero__intro {
	margin-inline: auto;
}

.sahcs-scope .sahcs-hero__actions {
	margin: 1.6em 0 0;
}

.sahcs-scope .sahcs-hero__media {
	margin: 0;
	border-radius: var(--sahcs-radius);
	overflow: hidden;
	box-shadow: var(--sahcs-card-shadow);
	background: var(--sahcs-soft);
}

.sahcs-scope .sahcs-hero__img {
	display: block;
	width: 100%;
	height: auto;
}

@container (max-width: 640px) {
	.sahcs-scope .sahcs-hero__img {
		aspect-ratio: 16 / 10;
		object-fit: cover;
	}
}

/* ---------- Single layout with table of contents ---------- */

/* Space between the hero and the content below it. Uses padding on the
   body (not the hero's margin), so theme rules that reset margins on
   content blocks cannot remove it. */
.sahcs-scope.sahcs-single > .sahcs-hero {
	margin-bottom: 0;
}

.sahcs-scope.sahcs-single > .sahcs-single__body {
	margin-top: 0;
	padding-top: clamp(50px, 6vw, 72px);
}

.sahcs-single__body {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 32px;
}

@media (min-width: 1024px) {
	.sahcs-single__body--toc {
		grid-template-columns: minmax(0, 1fr) 260px;
		gap: 56px;
		align-items: start;
	}

	.sahcs-single__body--toc .sahcs-single__aside {
		order: 2;
		position: sticky;
		top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--sahcs-header-h, 0px) + 24px);
		max-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px) - var(--sahcs-header-h, 0px) - 48px);
		overflow: auto;
	}
}

.sahcs-single__content > * {
	margin-top: 0;
	margin-bottom: 0;
}

.sahcs-single__content > * + * {
	margin-top: var(--sahcs-section-gap);
}

.sahcs-single__content > .sahcs-glance + .sahcs-facts,
.sahcs-single__content > .sahcs-facts + .sahcs-glance {
	margin-top: var(--sahcs-gap);
}

/* Blocks written straight into the page (outside sections) */
.sahcs-single__content > p,
.sahcs-single__content > ul,
.sahcs-single__content > ol {
	margin-top: 1em;
}

/* TOC */
.sahcs-scope .sahcs-toc {
	border: var(--sahcs-card-border);
	border-radius: var(--sahcs-radius);
	background: var(--sahcs-card);
	padding: 18px 20px;
	font-size: 0.92em;
}

.sahcs-scope .sahcs-toc__title {
	cursor: pointer;
	list-style: none;
	font-family: var(--sahcs-font-heading);
	font-weight: 700;
	color: var(--sahcs-heading);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.sahcs-scope .sahcs-toc__title::-webkit-details-marker {
	display: none;
}

.sahcs-scope .sahcs-toc__title::after {
	content: "";
	width: 8px;
	height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg) translateY(-2px);
	transition: transform 0.2s;
	flex-shrink: 0;
	margin-right: 4px; /* the rotated arrow stays inside the box */
}

.sahcs-scope .sahcs-toc[open] .sahcs-toc__title::after {
	transform: rotate(-135deg) translateY(-2px);
}

.sahcs-scope .sahcs-toc__list {
	list-style: none;
	margin: 12px 0 0;
	padding: 0;
	counter-reset: none;
}

.sahcs-scope .sahcs-toc__item {
	margin: 0;
	padding: 0;
}

.sahcs-scope .sahcs-toc__link {
	display: block;
	padding: 6px 0 6px 12px;
	border-left: 2px solid var(--sahcs-line);
	color: var(--sahcs-muted);
	text-decoration: none;
	line-height: 1.4;
}

.sahcs-scope .sahcs-toc__item--h3 a {
	padding-left: 26px;
	font-size: 0.94em;
}

.sahcs-scope .sahcs-toc__link:hover {
	color: var(--sahcs-heading);
}

.sahcs-scope .sahcs-toc__link.sahcs-toc__link--active {
	color: var(--sahcs-primary);
	border-left-color: var(--sahcs-primary);
	font-weight: 600;
}

/* ---------- Story sections ---------- */

.sahcs-section--soft.sahcs-section--soft {
	background: var(--sahcs-soft);
	border-radius: var(--sahcs-radius);
	padding: clamp(24px, 4vw, 44px);
}

.sahcs-scope .sahcs-section__content > * {
	margin-top: 0;
	margin-bottom: 1em;
}

.sahcs-scope .sahcs-section__content > *:last-child {
	margin-bottom: 0;
}

.sahcs-scope .sahcs-section__content h3,
.sahcs-scope .sahcs-section__content h4 {
	font-family: var(--sahcs-font-heading);
	color: var(--sahcs-heading);
	line-height: 1.3;
	margin: 1.6em 0 0.5em;
}

.sahcs-scope .sahcs-section__content h3 {
	font-size: 1.25em;
}

.sahcs-scope .sahcs-section__content ul,
.sahcs-scope .sahcs-section__content ol {
	padding-left: 1.3em;
}

.sahcs-scope .sahcs-section__content li + li {
	margin-top: 0.35em;
}

.sahcs-scope .sahcs-section__content img {
	border-radius: calc(var(--sahcs-radius) * 0.7);
}

.sahcs-scope .sahcs-section__content figure {
	margin-left: 0;
	margin-right: 0;
}

.sahcs-scope .sahcs-section__content figcaption {
	font-size: 0.85em;
	color: var(--sahcs-muted);
	margin-top: 0.5em;
	text-align: center;
}

.sahcs-scope .sahcs-section__content .wp-block-button__link {
	border-radius: min(var(--sahcs-radius), 999px);
	background: var(--sahcs-primary);
	color: var(--sahcs-on-primary);
	font-weight: 600;
}

.sahcs-scope .sahcs-section__content .wp-block-table table {
	width: 100%;
	border-collapse: collapse;
}

.sahcs-scope .sahcs-section__content .wp-block-table th,
.sahcs-scope .sahcs-section__content .wp-block-table td {
	border: 1px solid var(--sahcs-line);
	padding: 0.6em 0.8em;
	text-align: left;
}

/* ---------- At a glance ---------- */

.sahcs-glance.sahcs-glance {
	--sahcs-glance-hue: var(--sahcs-primary);
	position: relative;
	overflow: hidden;
	isolation: isolate;
	container-type: inline-size;
	border-radius: calc(var(--sahcs-radius) + 8px);
	background: color-mix(in srgb, var(--sahcs-primary) 3%, var(--sahcs-soft));
	border: 1px solid color-mix(in srgb, var(--sahcs-primary) 8%, transparent);
	box-shadow: 0 30px 60px -40px color-mix(in srgb, var(--sahcs-heading) 30%, transparent);
	padding: clamp(22px, 4vw, 48px);
}

/* Soft round shapes and a dotted pattern in the top-right corner */
.sahcs-scope .sahcs-glance__decor {
	position: absolute;
	top: -60px;
	right: -60px;
	width: 300px;
	height: 300px;
	z-index: -1;
	pointer-events: none;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 40%, color-mix(in srgb, var(--sahcs-primary) 14%, transparent), transparent 65%);
}

.sahcs-scope .sahcs-glance__decor::before {
	content: "";
	position: absolute;
	top: 120px;
	right: 20px;
	width: 180px;
	height: 180px;
	border-radius: 50%;
	background: radial-gradient(circle, color-mix(in srgb, var(--sahcs-accent) 18%, transparent), transparent 70%);
}

.sahcs-scope .sahcs-glance__decor::after {
	content: "";
	position: absolute;
	top: 96px;
	right: 90px;
	width: 112px;
	height: 80px;
	background-image: radial-gradient(color-mix(in srgb, var(--sahcs-primary) 50%, transparent) 1.6px, transparent 1.8px);
	background-size: 16px 16px;
	opacity: 0.7;
}

.sahcs-scope .sahcs-glance__head {
	position: relative;
	margin-bottom: clamp(18px, 3cqi, 30px);
	max-width: 62ch;
}

.sahcs-scope .sahcs-glance__title {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0;
	font-family: var(--sahcs-font-body);
	font-size: 0.82em;
	font-weight: 600;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--sahcs-primary);
}

.sahcs-scope .sahcs-glance__bar {
	flex: none;
	width: 64px;
	height: 3px;
	border-radius: 3px;
	background: linear-gradient(90deg, var(--sahcs-primary), var(--sahcs-accent));
}

.sahcs-scope .sahcs-glance__heading {
	margin: 0.55em 0 0;
	font-family: var(--sahcs-font-heading);
	font-size: clamp(1.5em, 1.1em + 2.4cqi, 2.4em);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -0.02em;
	color: var(--sahcs-heading);
}

.sahcs-scope .sahcs-glance__intro {
	margin: 0.8em 0 0;
	color: var(--sahcs-muted);
	font-size: 1.05em;
	line-height: 1.65;
}

.sahcs-scope .sahcs-glance__list {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: clamp(12px, 2cqi, 20px);
	margin: 0;
	padding: 0;
}

@container (min-width: 560px) {
	.sahcs-scope .sahcs-glance__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.sahcs-scope .sahcs-glance__item {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-start; /* top-aligned, so labels in a row line up */
	gap: 6px;
	min-height: 104px;
	padding: 20px 22px;
	border-radius: calc(var(--sahcs-radius) + 2px);
	background: linear-gradient(var(--sahcs-card), var(--sahcs-card)), var(--sahcs-bg);
	border: 1px solid color-mix(in srgb, var(--sahcs-text) 10%, transparent);
	box-shadow: 0 10px 24px -18px color-mix(in srgb, var(--sahcs-heading) 35%, transparent);
}

/* Room on the left for the round icon */
.sahcs-glance--icons .sahcs-glance__item:not(.sahcs-glance__item--no-icon) {
	padding-left: calc(22px + 64px + 20px);
}

.sahcs-scope .sahcs-glance__item dt,
.sahcs-scope .sahcs-glance__item dd {
	margin: 0;
	padding: 0;
}

.sahcs-scope .sahcs-glance__label {
	font-size: 0.78em;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--sahcs-muted);
}

.sahcs-scope .sahcs-glance__item dd {
	font-family: var(--sahcs-font-heading);
	font-size: 1.08em;
	font-weight: 500;
	line-height: 1.4;
	color: var(--sahcs-heading);
}

.sahcs-scope .sahcs-glance__item dd a,
.sahcs-scope .sahcs-facts__item dd a {
	color: inherit;
	text-decoration-line: underline;
	text-decoration-color: color-mix(in srgb, var(--sahcs-glance-hue) 55%, transparent);
	text-underline-offset: 4px;
}

.sahcs-scope .sahcs-glance__item dd a:hover {
	color: var(--sahcs-glance-hue);
}

.sahcs-scope .sahcs-glance__icon {
	position: absolute;
	left: 22px;
	top: 20px;
	display: grid;
	place-items: center;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: color-mix(in srgb, var(--sahcs-glance-hue) 12%, var(--sahcs-card));
	/* Leans toward the heading colour: a touch deeper on light sites, brighter on dark ones. */
	color: color-mix(in srgb, var(--sahcs-glance-hue) 82%, var(--sahcs-heading));
}

.sahcs-scope .sahcs-glance__icon .sahcs-icon {
	width: 28px;
	height: 28px;
}

/* Uploaded icons keep their own colours, at the same 28 × 28 px size */
.sahcs-scope .sahcs-glance__img {
	display: block;
	width: 28px;
	height: 28px;
	max-width: none;
	object-fit: contain;
}

/* A different friendly colour for each line (can be switched to the brand colour) */
.sahcs-glance__item--c1 { --sahcs-glance-hue: #2563eb; }
.sahcs-glance__item--c2 { --sahcs-glance-hue: #10b981; }
.sahcs-glance__item--c3 { --sahcs-glance-hue: #7c3aed; }
.sahcs-glance__item--c4 { --sahcs-glance-hue: #f97316; }
.sahcs-glance__item--c5 { --sahcs-glance-hue: #db2777; }
.sahcs-glance__item--c6 { --sahcs-glance-hue: #0891b2; }

/* Narrow screens: keep the corner decoration away from the text. */
@container (max-width: 559px) {
	.sahcs-scope .sahcs-glance__decor {
		opacity: 0.55;
		top: -120px;
		right: -120px;
	}

	.sahcs-scope .sahcs-glance__decor::after {
		display: none;
	}
}

@container (max-width: 420px) {
	.sahcs-glance--icons .sahcs-glance__item:not(.sahcs-glance__item--no-icon) {
		padding-left: calc(16px + 48px + 14px);
	}

	.sahcs-scope .sahcs-glance__item {
		padding: 16px;
		min-height: 84px;
	}

	.sahcs-scope .sahcs-glance__icon {
		left: 16px;
		top: 16px;
		width: 48px;
		height: 48px;
	}

	.sahcs-scope .sahcs-glance__icon .sahcs-icon,
	.sahcs-scope .sahcs-glance__img {
		width: 22px;
		height: 22px;
	}
}

.sahcs-scope .sahcs-facts__list,
.sahcs-scope .sahcs-facts__item dt,
.sahcs-scope .sahcs-facts__item dd {
	padding: 0;
}

/* ---------- Key facts ---------- */

.sahcs-facts.sahcs-facts {
	border-radius: var(--sahcs-radius);
	background: var(--sahcs-card);
	border: var(--sahcs-card-border);
	box-shadow: var(--sahcs-card-shadow);
	padding: clamp(20px, 3vw, 30px);
}

.sahcs-scope .sahcs-facts__title {
	margin: 0 0 16px;
	font-family: var(--sahcs-font-heading);
	font-weight: 700;
	color: var(--sahcs-heading);
	font-size: 1.05em;
}

.sahcs-scope .sahcs-facts__list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
	gap: 18px 24px;
	margin: 0;
}

.sahcs-scope .sahcs-facts__item dt {
	font-size: 0.82em;
	color: var(--sahcs-muted);
	margin: 0 0 3px;
}

.sahcs-scope .sahcs-facts__item dd {
	margin: 0;
	font-weight: 600;
	color: var(--sahcs-heading);
	overflow-wrap: anywhere;
}

/* ---------- Results ---------- */

.sahcs-scope .sahcs-results__intro {
	margin: -0.2em 0 1.4em;
	color: var(--sahcs-muted);
	max-width: 70ch;
}

.sahcs-scope .sahcs-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
	gap: var(--sahcs-gap);
}

.sahcs-scope .sahcs-stats.sahcs-stats--quad {
	/* 4 per row when there is room, otherwise 2 per row. Never 3 + 1. */
	grid-template-columns: repeat(auto-fill, minmax(max(calc((100% - 3 * var(--sahcs-gap)) / 4), min(calc((100% - var(--sahcs-gap)) / 2), calc((720px - 100%) * 999))), 1fr));
}

.sahcs-scope .sahcs-stats.sahcs-stats--pair {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sahcs-scope .sahcs-stat {
	container-type: inline-size;
	min-width: 0;
	border-radius: var(--sahcs-radius);
	background: var(--sahcs-card);
	border: var(--sahcs-card-border);
	box-shadow: var(--sahcs-card-shadow);
	padding: 22px clamp(14px, 2vw, 24px);
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.sahcs-scope .sahcs-stat p {
	margin: 0;
}

.sahcs-scope .sahcs-stat__value {
	font-family: var(--sahcs-font-heading);
	font-size: clamp(1.6em, 1.2em + 1.8vw, 2.5em);
	font-size: clamp(1.35em, 21cqi, 2.5em);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--sahcs-primary);
	overflow-wrap: break-word;
}

.sahcs-scope .sahcs-stat__label {
	font-weight: 600;
	color: var(--sahcs-heading);
}

.sahcs-scope .sahcs-stat__meta {
	margin-top: 8px !important;
	font-size: 0.85em;
	color: var(--sahcs-muted);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 8px;
}

.sahcs-scope .sahcs-change {
	display: inline-block;
	padding: 0.15em 0.6em;
	border-radius: 999px;
	font-weight: 700;
	font-size: 0.92em;
	white-space: nowrap;
}

.sahcs-scope .sahcs-change--up {
	background: color-mix(in srgb, var(--sahcs-up) 13%, var(--sahcs-bg));
	color: var(--sahcs-up);
}

.sahcs-scope .sahcs-change--down {
	background: color-mix(in srgb, var(--sahcs-down) 11%, var(--sahcs-bg));
	color: var(--sahcs-down);
}

.sahcs-results--both .sahcs-table-wrap {
	margin-top: var(--sahcs-gap);
}

.sahcs-scope .sahcs-results__note {
	margin: 1em 0 0;
	font-size: 0.85em;
	color: var(--sahcs-muted);
}

/* Tables scroll sideways on small screens instead of squashing */
.sahcs-scope .sahcs-table-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border-radius: var(--sahcs-radius);
	border: var(--sahcs-card-border);
	background: var(--sahcs-card);
}

.sahcs-scope .sahcs-table {
	width: 100%;
	min-width: 520px;
	border-collapse: collapse;
	margin: 0;
	font-size: 0.95em;
	border: 0;
}

.sahcs-scope .sahcs-table th,
.sahcs-scope .sahcs-table td {
	padding: 14px 18px;
	text-align: left;
	border: 0;
	border-bottom: 1px solid var(--sahcs-line);
	vertical-align: middle;
}

.sahcs-scope .sahcs-table thead th {
	background: var(--sahcs-soft);
	color: var(--sahcs-heading);
	font-weight: 700;
	font-size: 0.88em;
}

.sahcs-scope .sahcs-table tbody th {
	font-weight: 600;
	color: var(--sahcs-heading);
}

.sahcs-scope .sahcs-table tbody tr:last-child th,
.sahcs-scope .sahcs-table tbody tr:last-child td {
	border-bottom: 0;
}

.sahcs-scope .sahcs-table td strong {
	color: var(--sahcs-heading);
}

/* ---------- Gallery ---------- */

.sahcs-scope .sahcs-gallery__items {
	--sahcs-gallery-cols: 3;
	--sahcs-img-min: 160px;
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, max(var(--sahcs-img-min), (100% - (var(--sahcs-gallery-cols) - 1) * 14px) / var(--sahcs-gallery-cols))), 1fr));
}

.sahcs-gallery.sahcs-cols-1 .sahcs-gallery__items { --sahcs-gallery-cols: 1; }
.sahcs-gallery.sahcs-cols-2 .sahcs-gallery__items { --sahcs-gallery-cols: 2; }
.sahcs-gallery.sahcs-cols-3 .sahcs-gallery__items { --sahcs-gallery-cols: 3; }
.sahcs-gallery.sahcs-cols-4 .sahcs-gallery__items { --sahcs-gallery-cols: 4; }

.sahcs-scope .sahcs-gallery__item {
	margin: 0;
	position: relative;
}

.sahcs-scope .sahcs-gallery__item img {
	display: block;
	width: 100%;
	border-radius: calc(var(--sahcs-radius) * 0.75);
}

.sahcs-gallery--grid .sahcs-gallery__item img {
	aspect-ratio: 4 / 3;
	height: 100%;
	object-fit: cover;
}

.sahcs-scope .sahcs-gallery__link {
	display: block;
	border-radius: calc(var(--sahcs-radius) * 0.75);
	overflow: hidden;
	cursor: zoom-in;
}

.sahcs-scope .sahcs-gallery__link img {
	transition: transform 0.35s ease;
}

.sahcs-scope .sahcs-gallery__link:hover img {
	transform: scale(1.035);
}

.sahcs-scope .sahcs-gallery__item figcaption {
	margin-top: 6px;
	font-size: 0.84em;
	color: var(--sahcs-muted);
}

/* Masonry uses CSS columns */
.sahcs-gallery--masonry .sahcs-gallery__items {
	display: block;
	columns: var(--sahcs-gallery-cols, 3) 160px;
	column-gap: 14px;
}

.sahcs-gallery--masonry .sahcs-gallery__item {
	break-inside: avoid;
	margin-bottom: 14px;
}

/* ---------- Testimonial ---------- */

.sahcs-testimonial.sahcs-testimonial {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	container-type: inline-size;
	margin-left: 0;
	margin-right: 0;
	padding: clamp(24px, 4.5vw, 52px);
	border-radius: calc(var(--sahcs-radius) + 8px);
	background: color-mix(in srgb, var(--sahcs-primary) 4%, var(--sahcs-soft));
	border: 1px solid color-mix(in srgb, var(--sahcs-primary) 8%, transparent);
}

/* The old big quote character is replaced by the badge and corner mark. */
.sahcs-testimonial.sahcs-testimonial::before,
.sahcs-testimonial.sahcs-testimonial::after {
	content: none;
	display: none;
}

.sahcs-scope .sahcs-testimonial__badge {
	display: grid;
	place-items: center;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: color-mix(in srgb, var(--sahcs-primary) 12%, var(--sahcs-card));
	color: var(--sahcs-primary);
}

.sahcs-scope .sahcs-testimonial__badge .sahcs-icon {
	width: 42px;
	height: 42px;
}

/* Quote text with a thin gradient line on the left */
.sahcs-scope .sahcs-testimonial__quote {
	position: relative;
	margin: clamp(18px, 3cqi, 28px) 0 0;
	padding: 0 0 0 clamp(18px, 3.2cqi, 30px);
	border: 0;
	border-radius: 0;
	background: linear-gradient(180deg, var(--sahcs-primary), var(--sahcs-accent)) left top / 4px 100% no-repeat;
	font-style: normal;
	quotes: none;
}

.sahcs-scope .sahcs-testimonial__quote::before,
.sahcs-scope .sahcs-testimonial__quote::after,
.sahcs-scope .sahcs-testimonial__quote p::before,
.sahcs-scope .sahcs-testimonial__quote p::after {
	content: none;
	display: none;
}

.sahcs-scope .sahcs-testimonial__quote p {
	margin: 0 0 1em;
	padding: 0;
	font-family: var(--sahcs-font-body);
	font-size: clamp(1.05em, 0.95em + 0.9cqi, 1.3em);
	font-weight: 400;
	font-style: normal;
	line-height: 1.7;
	letter-spacing: normal;
	text-transform: none;
	color: var(--sahcs-heading);
}

.sahcs-scope .sahcs-testimonial__quote p:last-child {
	margin-bottom: 0;
}

.sahcs-scope .sahcs-testimonial__quote strong {
	font-weight: 700;
	color: var(--sahcs-heading);
}

.sahcs-scope .sahcs-testimonial__by {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: clamp(14px, 3cqi, 24px);
	margin: clamp(22px, 4cqi, 34px) 0 0;
	padding: 0;
	padding-right: clamp(80px, 22cqi, 180px); /* keeps text clear of the corner mark */
}

.sahcs-scope .sahcs-testimonial__photo {
	flex: none;
	width: 96px;
	height: 96px;
	max-width: none;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	object-fit: cover;
	border: 0;
	box-shadow: 0 0 0 6px color-mix(in srgb, var(--sahcs-primary) 9%, transparent);
	background: color-mix(in srgb, var(--sahcs-primary) 10%, var(--sahcs-card));
}

.sahcs-scope .sahcs-testimonial__initials {
	display: grid;
	place-items: center;
	color: var(--sahcs-primary);
	font-family: var(--sahcs-font-heading);
	font-weight: 700;
	font-size: 1.8em;
	line-height: 1;
}

.sahcs-scope .sahcs-testimonial__who {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.sahcs-scope .sahcs-testimonial__by,
.sahcs-scope .sahcs-testimonial__who,
.sahcs-scope .sahcs-testimonial__name,
.sahcs-scope .sahcs-testimonial__role {
	text-align: left;
	letter-spacing: normal;
	text-transform: none;
}

.sahcs-scope .sahcs-testimonial__name::before,
.sahcs-scope .sahcs-testimonial__name::after {
	content: none;
}

.sahcs-scope .sahcs-testimonial__name {
	font-family: var(--sahcs-font-heading);
	font-size: clamp(1.1em, 1em + 0.6cqi, 1.3em);
	font-style: normal;
	font-weight: 700;
	line-height: 1.3;
	color: var(--sahcs-heading);
}

.sahcs-scope .sahcs-testimonial__role {
	font-family: var(--sahcs-font-body);
	font-size: 1em;
	line-height: 1.45;
	color: var(--sahcs-muted);
}

.sahcs-scope .sahcs-testimonial__bar {
	display: block;
	width: 72px;
	height: 4px;
	margin-top: 10px;
	border-radius: 4px;
	background: linear-gradient(90deg, var(--sahcs-primary), var(--sahcs-accent));
}

/* Large soft quote mark in the bottom-right corner */
.sahcs-scope .sahcs-testimonial__mark {
	position: absolute;
	right: clamp(16px, 4cqi, 44px);
	bottom: clamp(8px, 3cqi, 28px);
	z-index: 0;
	width: clamp(84px, 20cqi, 170px);
	color: color-mix(in srgb, var(--sahcs-primary) 12%, transparent);
	pointer-events: none;
}

.sahcs-scope .sahcs-testimonial__mark .sahcs-icon {
	width: 100%;
	height: auto;
}

@container (max-width: 480px) {
	.sahcs-scope .sahcs-testimonial__badge {
		width: 56px;
		height: 56px;
	}

	.sahcs-scope .sahcs-testimonial__badge .sahcs-icon {
		width: 32px;
		height: 32px;
	}

	.sahcs-scope .sahcs-testimonial__photo {
		width: 72px;
		height: 72px;
	}

	.sahcs-scope .sahcs-testimonial__by {
		padding-right: 0;
	}

	.sahcs-scope .sahcs-testimonial__mark {
		width: 72px;
		bottom: auto;
		top: 16px;
		right: 16px;
	}
}

/* ---------- Call to action ---------- */

.sahcs-cta.sahcs-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 20px 40px;
	border-radius: var(--sahcs-radius);
	padding: clamp(28px, 5vw, 52px);
}

.sahcs-cta--gradient {
	background: linear-gradient(125deg, var(--sahcs-primary), var(--sahcs-accent));
	color: var(--sahcs-on-primary);
}

.sahcs-cta--soft {
	background: var(--sahcs-soft);
}

.sahcs-scope .sahcs-cta__text {
	flex: 1 1 380px;
	min-width: 0;
}

.sahcs-scope .sahcs-cta__title {
	font-size: clamp(1.4em, 1.1em + 1.2vw, 1.9em);
}

.sahcs-cta--gradient .sahcs-cta__title,
.sahcs-cta--gradient .sahcs-cta__desc {
	color: var(--sahcs-on-primary);
}

.sahcs-scope .sahcs-cta__desc {
	margin: 0.6em 0 0;
	max-width: 60ch;
}

.sahcs-scope .sahcs-cta__action {
	margin: 0;
	flex: 0 0 auto;
}

.sahcs-cta--soft .sahcs-button--light {
	background: var(--sahcs-primary);
	border-color: var(--sahcs-primary);
	color: var(--sahcs-on-primary);
}

@media (max-width: 600px) {
	/* Full-width button that keeps its padding inside, whatever box-sizing the theme uses. */
	.sahcs-scope .sahcs-cta__action {
		align-self: stretch;
		width: auto;
	}

	.sahcs-scope .sahcs-cta__action .sahcs-button {
		display: block;
		width: auto;
		text-align: center;
	}
}

/* ---------- FAQ ---------- */

.sahcs-scope .sahcs-faq__list {
	border-top: 1px solid var(--sahcs-line);
}

.sahcs-scope .sahcs-faq__item {
	border-bottom: 1px solid var(--sahcs-line);
}

.sahcs-scope .sahcs-faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 0;
	cursor: pointer;
	list-style: none;
}

.sahcs-scope .sahcs-faq__q::-webkit-details-marker {
	display: none;
}

.sahcs-scope .sahcs-faq__q::after {
	content: "+";
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--sahcs-soft);
	color: var(--sahcs-primary);
	display: grid;
	place-items: center;
	font-size: 1.2em;
	font-weight: 600;
	line-height: 1;
}

.sahcs-scope .sahcs-faq__item[open]:not(.sahcs-faq__item--closing) > .sahcs-faq__q::after {
	content: "\2212";
	transform: rotate(180deg);
}

@media (prefers-reduced-motion: no-preference) {
	.sahcs-scope .sahcs-faq__q::after {
		transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.2s ease;
	}
}

.sahcs-scope .sahcs-faq__qtext {
	margin: 0;
	font-family: var(--sahcs-font-heading);
	font-size: 1.08em;
	font-weight: 600;
	line-height: 1.4;
	color: var(--sahcs-heading);
}

.sahcs-scope .sahcs-faq__a {
	padding: 0 48px 20px 0;
	color: var(--sahcs-text);
}

.sahcs-scope .sahcs-faq__a p {
	margin: 0 0 0.8em;
}

.sahcs-scope .sahcs-faq__a p:last-child {
	margin-bottom: 0;
}

/* ---------- Cards and grids ---------- */

.sahcs-scope .sahcs-grid {
	--sahcs-grid-cols: 3;
	--sahcs-card-min: 250px;
	display: grid;
	gap: var(--sahcs-gap);
	/* Never more than the chosen columns, and never narrower than
	   --sahcs-card-min: the grid fits whatever space it is given
	   (wide page, narrow theme column, sidebar) without media queries. */
	grid-template-columns: repeat(auto-fill, minmax(min(100%, max(var(--sahcs-card-min), (100% - (var(--sahcs-grid-cols) - 1) * var(--sahcs-gap)) / var(--sahcs-grid-cols))), 1fr));
}

.sahcs-scope .sahcs-grid.sahcs-cols-1 { --sahcs-grid-cols: 1; }
.sahcs-scope .sahcs-grid.sahcs-cols-2 { --sahcs-grid-cols: 2; }
.sahcs-scope .sahcs-grid.sahcs-cols-3 { --sahcs-grid-cols: 3; }
.sahcs-scope .sahcs-grid.sahcs-cols-4 { --sahcs-grid-cols: 4; --sahcs-card-min: 230px; }

.sahcs-scope .sahcs-card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	border-radius: var(--sahcs-radius);
	background: var(--sahcs-card);
	border: var(--sahcs-card-border);
	box-shadow: var(--sahcs-card-shadow);
	overflow: hidden;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.sahcs-scope .sahcs-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 2px 4px rgba(16, 24, 40, .06), 0 16px 36px -10px rgba(16, 24, 40, .22);
}

/* Ring around the whole card only for keyboard focus, never after a click. */
.sahcs-scope .sahcs-card:has(:focus-visible) {
	outline: 3px solid color-mix(in srgb, var(--sahcs-primary) 55%, transparent);
	outline-offset: 2px;
}

.sahcs-scope .sahcs-card__media {
	aspect-ratio: 16 / 10;
	background: var(--sahcs-soft);
	overflow: hidden;
}

.sahcs-scope .sahcs-card__img,
.sahcs-scope .sahcs-card__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.sahcs-scope .sahcs-card:hover .sahcs-card__media img {
	transform: scale(1.03);
}

.sahcs-scope .sahcs-card__placeholder {
	display: grid;
	place-items: center;
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, var(--sahcs-primary), var(--sahcs-accent));
	color: #fff;
	font-family: var(--sahcs-font-heading);
	font-size: 3em;
	font-weight: 800;
}

.sahcs-scope .sahcs-card__body {
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1 1 auto;
	padding: 20px 22px 22px;
}

.sahcs-scope .sahcs-card__body > p {
	margin: 0;
}

.sahcs-scope .sahcs-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.sahcs-scope .sahcs-card__title {
	font-size: 1.18em;
	line-height: 1.3;
}

.sahcs-scope .sahcs-card__link {
	color: inherit;
	text-decoration: none;
}

.sahcs-scope .sahcs-card__link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

/* Browsers with :has() draw the ring on the card; older ones keep it on the link. */
@supports selector(:has(*)) {
	.sahcs-scope .sahcs-card__link:focus-visible {
		outline: none;
	}
}

.sahcs-scope .sahcs-card__stat {
	font-size: 0.9em;
	color: var(--sahcs-muted);
}

.sahcs-scope .sahcs-card__stat strong {
	color: var(--sahcs-up);
	font-size: 1.1em;
}

.sahcs-scope .sahcs-card__excerpt {
	font-size: 0.93em;
	color: var(--sahcs-muted);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.sahcs-scope .sahcs-card__more {
	align-self: flex-start;
	white-space: nowrap;
	margin-top: auto;
	padding-top: 6px;
	font-weight: 600;
	font-size: 0.92em;
	color: var(--sahcs-primary);
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.sahcs-scope .sahcs-arrow {
	transition: transform 0.2s;
}

.sahcs-scope .sahcs-card:hover .sahcs-arrow {
	transform: translateX(3px);
}

/* List layout: image beside text when there is room */
.sahcs-grid-wrap,
.sahcs-feature-wrap,
.sahcs-scope .sahcs-archive__results,
.sahcs-scope .sahcs-related {
	container-type: inline-size;
}

.sahcs-scope .sahcs-grid.sahcs-grid--list.sahcs-grid--list {
	--sahcs-grid-cols: 1;
	--sahcs-card-min: 0px;
	grid-template-columns: minmax(0, 1fr);
}

/* The list measures its own width, so it works in any theme, page builder,
   sidebar or column, no matter what surrounds it. */
.sahcs-scope .sahcs-grid--list {
	container-type: inline-size;
}

@container (min-width: 540px) {
	.sahcs-scope .sahcs-grid--list .sahcs-card {
		flex-direction: row;
	}

	.sahcs-scope .sahcs-grid--list .sahcs-card__media {
		flex: 0 0 38%;
		aspect-ratio: auto;
		min-height: 220px;
		position: relative;
	}

	/* The image fills the side and is cropped, so tall photos don't stretch the card. */
	.sahcs-scope .sahcs-grid--list .sahcs-card__media > img,
	.sahcs-scope .sahcs-grid--list .sahcs-card__media > .sahcs-card__placeholder {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		min-height: 100%; /* still fills the side if a theme forces img { height: auto !important } */
		max-height: none;
		object-fit: cover;
	}
}

/* Featured single card ([sahcs_card]) */
.sahcs-scope .sahcs-feature {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	border-radius: var(--sahcs-radius);
	background: var(--sahcs-card);
	border: var(--sahcs-card-border);
	box-shadow: var(--sahcs-card-shadow);
	overflow: hidden;
	margin: 1.5em 0;
}

@container (min-width: 600px) {
	.sahcs-scope .sahcs-feature:not(.sahcs-feature--no-image) {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}
}

.sahcs-scope .sahcs-feature__media img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 220px;
	object-fit: cover;
}

.sahcs-scope .sahcs-feature__body {
	padding: clamp(22px, 3.5vw, 36px);
	display: flex;
	flex-direction: column;
	gap: 12px;
	align-items: flex-start;
}

.sahcs-scope .sahcs-feature__body > p {
	margin: 0;
}

.sahcs-scope .sahcs-feature__title {
	font-size: clamp(1.25em, 1.1em + 0.8vw, 1.6em);
}

.sahcs-scope .sahcs-feature__stat strong {
	color: var(--sahcs-up);
	font-size: 1.25em;
}

.sahcs-scope .sahcs-feature__excerpt {
	color: var(--sahcs-muted);
}

.sahcs-scope .sahcs-feature .sahcs-button {
	margin-top: 6px;
}

/* ---------- Filters ---------- */

.sahcs-scope .sahcs-filters {
	margin: 0 0 var(--sahcs-gap);
}

.sahcs-scope .sahcs-filters__list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.sahcs-scope .sahcs-filters__list li {
	margin: 0;
	padding: 0;
}

.sahcs-scope .sahcs-filter {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 0.45em 1.05em;
	border-radius: 999px;
	border: 1px solid var(--sahcs-line);
	background: var(--sahcs-card);
	color: var(--sahcs-heading);
	font: inherit;
	font-size: 0.92em;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}

.sahcs-scope .sahcs-filter:not(.sahcs-filter--active):hover,
.sahcs-scope .sahcs-filter:not(.sahcs-filter--active):focus-visible {
	background: color-mix(in srgb, var(--sahcs-primary) 8%, var(--sahcs-card));
	border-color: var(--sahcs-primary);
	color: var(--sahcs-primary);
	text-decoration: none;
}

/* The chosen tab keeps readable text in every state (hover, focus, visited). */
.sahcs-scope .sahcs-filter.sahcs-filter--active,
.sahcs-scope .sahcs-filter.sahcs-filter--active:hover,
.sahcs-scope .sahcs-filter.sahcs-filter--active:focus,
.sahcs-scope .sahcs-filter.sahcs-filter--active:visited {
	background: var(--sahcs-primary);
	border-color: var(--sahcs-primary);
	color: var(--sahcs-on-primary);
	text-decoration: none;
}

/* Many categories on phones: one swipeable row */
@media (max-width: 640px) {
	.sahcs-scope .sahcs-filters {
		margin-inline: calc(-1 * clamp(16px, 4vw, 32px));
	}

	.sahcs-scope .sahcs-filters__list {
		flex-wrap: nowrap;
		overflow-x: auto;
		padding: 2px clamp(16px, 4vw, 32px) 8px;
		scroll-snap-type: x proximity;
		scrollbar-width: none;
	}

	.sahcs-scope .sahcs-filters__list::-webkit-scrollbar {
		display: none;
	}

	.sahcs-scope .sahcs-filters__list li {
		flex: 0 0 auto;
		scroll-snap-align: start;
	}
}

.sahcs-grid-wrap .sahcs-filters {
	margin-inline: 0;
}

.sahcs-scope .sahcs-card[hidden] {
	display: none;
}

.sahcs-scope .sahcs-grid__empty {
	color: var(--sahcs-muted);
}

.sahcs-scope .sahcs-grid__more {
	margin: var(--sahcs-gap) 0 0;
	text-align: center;
}

.sahcs-archive__results--loading {
	opacity: 0.5;
	pointer-events: none;
	transition: opacity 0.2s;
}

/* ---------- Listing page ---------- */

.sahcs-scope .sahcs-archive__header {
	margin: 0 0 clamp(24px, 4vw, 40px);
	max-width: 760px;
}

.sahcs-scope .sahcs-archive__title {
	font-size: clamp(2em, 1.3em + 2.8vw, 3.1em);
	letter-spacing: -0.025em;
}

.sahcs-scope .sahcs-archive__intro {
	margin-top: 0.8em;
	font-size: 1.1em;
	color: var(--sahcs-muted);
}

.sahcs-scope .sahcs-archive__intro p {
	margin: 0 0 0.6em;
}

.sahcs-scope .sahcs-breadcrumb {
	font-size: 0.88em;
	margin-bottom: 0.8em;
	color: var(--sahcs-muted);
}

.sahcs-scope .sahcs-archive__empty {
	padding: 40px;
	text-align: center;
	border-radius: var(--sahcs-radius);
	background: var(--sahcs-soft);
}

/* Pagination */
.sahcs-scope .sahcs-pagination {
	margin-top: clamp(32px, 5vw, 48px);
}

.sahcs-scope .sahcs-pagination ul.page-numbers {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.sahcs-scope .sahcs-pagination li {
	margin: 0;
}

.sahcs-scope .sahcs-pagination .page-numbers:not(ul) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0 14px;
	border-radius: 999px;
	border: 1px solid var(--sahcs-line);
	background: var(--sahcs-card);
	color: var(--sahcs-heading);
	text-decoration: none;
	font-weight: 600;
}

.sahcs-scope .sahcs-pagination .page-numbers.current {
	background: var(--sahcs-primary);
	border-color: var(--sahcs-primary);
	color: var(--sahcs-on-primary);
}

.sahcs-scope .sahcs-pagination .page-numbers.dots {
	border: 0;
	background: none;
}

/* ---------- Related ---------- */

.sahcs-scope .sahcs-related {
	padding-top: var(--sahcs-section-gap);
	border-top: 1px solid var(--sahcs-line);
}

/* Related cards sit in the content column (next to the table of contents),
   so they may be narrower: three fit in one row from about 600px, and one
   card keeps one third of the row instead of stretching. */
.sahcs-scope .sahcs-related .sahcs-grid--grid {
	--sahcs-card-min: 180px;
}

/* ---------- Embeds (shortcode sections) ---------- */

.sahcs-embed {
	margin: 1.5em 0;
}

.sahcs-scope.sahcs-embed__link {
	margin: 0.8em 0 0;
	font-weight: 600;
}

/* ---------- Lightbox ---------- */

.sahcs-lightbox {
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
	margin: 0;
	padding: 0;
	border: 0;
	/* The image always fits the screen, so the viewer never scrolls. */
	overflow: hidden !important;
	box-sizing: border-box !important;
	overscroll-behavior: contain;
	background: rgba(10, 12, 18, 0.94);
	color: #fff;
	z-index: 999999;
}

.sahcs-lightbox::backdrop {
	background: rgba(10, 12, 18, 0.94);
}

.sahcs-lightbox[open] {
	display: block;
}

.sahcs-lightbox__figure {
	/* Pinned to the four edges instead of "100% wide + padding", so the
	   padding always stays inside, whatever box-sizing the theme uses. */
	position: absolute;
	inset: 0 0 72px 0; /* room for the caption below */
	width: auto;
	height: auto;
	max-width: none;
	margin: 0;
	padding: 56px 64px 0;
	display: grid;
	place-items: center;
	min-height: 0;
	overflow: hidden;
	border: 0;
	background: none;
	box-shadow: none;
}

.sahcs-lightbox .sahcs-lightbox__img {
	border: 0;
	padding: 0;
	margin: 0;
}

.sahcs-lightbox__img {
	max-width: 100%;
	max-height: calc(100vh - 140px);
	max-height: calc(100dvh - 140px);
	width: auto;
	height: auto;
	object-fit: contain;
	border-radius: 6px;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.sahcs-lightbox__caption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0;
	padding: 8px 72px 20px;
	font-size: 15px;
	text-align: center;
	color: rgba(255, 255, 255, 0.85);
	min-height: 44px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.sahcs-lightbox__btn {
	position: absolute;
	width: 48px;
	height: 48px;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.12);
	color: #fff;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	display: grid;
	place-items: center;
}

.sahcs-lightbox__btn:hover {
	background: rgba(255, 255, 255, 0.24);
}

.sahcs-lightbox__btn:focus-visible {
	outline: 3px solid #fff;
	outline-offset: 2px;
}

.sahcs-lightbox__close {
	top: 12px;
	right: 12px;
}

.sahcs-lightbox__prev {
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
}

.sahcs-lightbox__next {
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
}

@media (max-width: 600px) {
	.sahcs-lightbox__figure {
		padding: 60px 8px 0;
	}

	.sahcs-lightbox__prev,
	.sahcs-lightbox__next {
		top: auto;
		bottom: 12px;
		transform: none;
	}
}

html.sahcs-no-scroll {
	overflow: hidden;
}

/* ---------- Accessibility: respect reduced motion ---------- */

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

	.sahcs-scope .sahcs-card:hover,
	.sahcs-scope .sahcs-card:hover .sahcs-card__media img,
	.sahcs-scope .sahcs-gallery__link:hover img {
		transform: none;
	}
}

/* ---------- Print: clean pages for sharing as PDF ---------- */

@media print {
	.sahcs-single__aside,
	.sahcs-cta,
	.sahcs-related-wrap,
	.sahcs-filters {
		display: none !important;
	}

	.sahcs-single__body--toc {
		display: block;
	}

	.sahcs-scope .sahcs-card,
	.sahcs-scope .sahcs-stat,
	.sahcs-scope .sahcs-facts {
		box-shadow: none;
		border: 1px solid #ccc;
	}
}

/* ---------- Project team ---------- */

/* Zero specificity: inside a case study the page spacing rules win. */
:where(.sahcs-team) {
	margin: 0 0 var(--sahcs-section-gap);
}

.sahcs-scope .sahcs-team {
	--sahcs-team-grad: linear-gradient(90deg, var(--sahcs-primary), var(--sahcs-accent));
	container-type: inline-size;
	position: relative;
}

.sahcs-scope .sahcs-gradient-text {
	color: var(--sahcs-primary);
	background: linear-gradient(90deg, var(--sahcs-primary), var(--sahcs-accent));
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

.sahcs-scope .sahcs-team__eyebrow {
	margin: 0 0 0.9em;
	font-size: 0.82em;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--sahcs-primary);
}

.sahcs-scope .sahcs-team__eyebrow::after,
.sahcs-scope .sahcs-team__bar {
	content: "";
	display: block;
	width: 64px;
	height: 4px;
	border-radius: 4px;
	background: var(--sahcs-team-grad);
}

.sahcs-scope .sahcs-team__eyebrow::after {
	margin-top: 12px;
}

.sahcs-scope .sahcs-team__title {
	font-size: clamp(1.7em, 1.2em + 2vw, 2.6em);
	margin-bottom: 0.45em;
}

.sahcs-scope .sahcs-team__text > .sahcs-team__bar {
	margin: -0.1em 0 1.3em;
}

.sahcs-scope .sahcs-team__intro {
	color: var(--sahcs-muted);
	font-size: 1.05em;
	line-height: 1.75;
	max-width: 68ch;
}

.sahcs-scope .sahcs-team__intro p {
	margin: 0 0 1em;
}

.sahcs-scope .sahcs-team__intro p:last-child {
	margin-bottom: 0;
}

.sahcs-scope .sahcs-team__quote {
	display: flex;
	align-items: flex-start;
	gap: 18px;
	margin: 1.6em 0 0;
	padding: clamp(18px, 3cqi, 28px) clamp(18px, 3.2cqi, 32px);
	border: 0;
	border-radius: calc(var(--sahcs-radius) + 4px);
	background: color-mix(in srgb, var(--sahcs-primary) 5%, var(--sahcs-soft));
	color: var(--sahcs-heading);
	font-style: normal;
}

.sahcs-scope .sahcs-team__quote::before,
.sahcs-scope .sahcs-team__quote::after {
	content: none;
	display: none;
}

.sahcs-scope .sahcs-team__quote p {
	margin: 0;
	padding: 0;
	font-weight: 500;
	font-style: normal;
	letter-spacing: normal;
	color: inherit;
	font-family: var(--sahcs-font-heading);
	font-size: clamp(1.1em, 1em + 0.6cqi, 1.35em);
	line-height: 1.5;
}

.sahcs-scope .sahcs-team__quote-icon {
	flex: none;
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: color-mix(in srgb, var(--sahcs-primary) 12%, var(--sahcs-bg));
	color: var(--sahcs-primary);
}

.sahcs-scope .sahcs-team__quote-icon .sahcs-icon {
	width: 26px;
	height: 26px;
}

.sahcs-scope .sahcs-team__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--sahcs-gap);
}

.sahcs-scope .sahcs-team__member {
	margin: 0;
	padding: 0;
	min-width: 0;
	position: relative;
}

.sahcs-scope .sahcs-team__photo-wrap {
	position: relative;
	display: block;
	flex: none;
}

.sahcs-scope .sahcs-team__photo {
	position: relative;
	z-index: 1;
	display: block;
	border-radius: 50%;
	object-fit: cover;
	max-width: none;
	background: color-mix(in srgb, var(--sahcs-primary) 10%, var(--sahcs-bg));
}

.sahcs-scope .sahcs-team__initials {
	display: grid;
	place-items: center;
	color: var(--sahcs-primary);
	font-family: var(--sahcs-font-heading);
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.02em;
}

.sahcs-scope .sahcs-team__who {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.sahcs-scope .sahcs-team__name {
	font-family: var(--sahcs-font-heading);
	font-weight: 700;
	color: var(--sahcs-heading);
	line-height: 1.3;
	font-size: 1.3em;
}

.sahcs-scope .sahcs-team__role {
	margin-top: 4px;
	color: var(--sahcs-muted);
	line-height: 1.45;
}

.sahcs-scope .sahcs-team__bar--small {
	margin-top: 14px;
}

.sahcs-scope .sahcs-team__socials {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-top: 18px;
}

.sahcs-scope .sahcs-team__divider {
	width: 1px;
	height: 26px;
	background: color-mix(in srgb, var(--sahcs-text) 18%, transparent);
}

.sahcs-scope .sahcs-team__social {
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border-radius: 10px;
	background: color-mix(in srgb, var(--sahcs-primary) 10%, var(--sahcs-bg));
	color: var(--sahcs-primary);
	text-decoration: none;
	transition: transform 0.15s ease, background-color 0.15s ease;
}

.sahcs-scope .sahcs-team__social:hover,
.sahcs-scope .sahcs-team__social:focus-visible {
	background: var(--sahcs-primary);
	color: var(--sahcs-on-primary);
	transform: translateY(-2px);
}

/* Cards with large photos: text on the left, person card on the right. */
.sahcs-team--cards .sahcs-team__list {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
}

.sahcs-team--cards .sahcs-team__text + .sahcs-team__list {
	margin-top: clamp(24px, 4cqi, 40px);
}

/* One or two people under the text (narrow screens): keep the card a sensible size. */
.sahcs-team--cards:not(.sahcs-team--wide) .sahcs-team__list {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 360px));
	justify-content: center;
}

.sahcs-team--cards .sahcs-team__member {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 28px 22px 26px;
	border-radius: calc(var(--sahcs-radius) + 6px);
	/* Solid even when cards are see-through (dark sites), so nothing shows through. */
	background: linear-gradient(var(--sahcs-card), var(--sahcs-card)), var(--sahcs-bg);
	border: var(--sahcs-card-border);
	box-shadow: 0 24px 48px -28px color-mix(in srgb, var(--sahcs-heading) 35%, transparent), var(--sahcs-card-shadow);
}

.sahcs-team--cards .sahcs-team__photo {
	width: 176px;
	height: 176px;
	box-shadow: 0 0 0 10px color-mix(in srgb, var(--sahcs-primary) 7%, transparent);
}

.sahcs-team--cards .sahcs-team__initials {
	font-size: 3em;
}

.sahcs-team--cards .sahcs-team__photo-wrap {
	margin-bottom: 26px;
}

/* Dotted pattern behind the photo */
.sahcs-team--cards .sahcs-team__photo-wrap::before {
	content: "";
	position: absolute;
	top: -14px;
	right: -34px;
	width: 96px;
	height: 72px;
	background-image: radial-gradient(color-mix(in srgb, var(--sahcs-primary) 45%, transparent) 1.6px, transparent 1.8px);
	background-size: 16px 16px;
	opacity: 0.7;
}

.sahcs-team--cards .sahcs-team__who {
	align-items: center;
}

@container (min-width: 760px) {
	.sahcs-team--cards:not(.sahcs-team--wide) .sahcs-team__inner {
		display: grid;
		grid-template-columns: minmax(0, 1.55fr) minmax(250px, 1fr);
		gap: clamp(28px, 5cqi, 64px);
		align-items: center;
	}

	.sahcs-team--cards:not(.sahcs-team--wide) .sahcs-team__list {
		grid-template-columns: minmax(0, 1fr);
		position: relative;
		margin-top: 0;
	}

	/* Soft round shape behind the person card */
	.sahcs-team--cards:not(.sahcs-team--wide) .sahcs-team__list::before {
		content: "";
		position: absolute;
		inset: 8% -8% 4% -14%;
		border-radius: 46% 54% 50% 50% / 55% 45% 55% 45%;
		background: radial-gradient(circle at 30% 30%, color-mix(in srgb, var(--sahcs-accent) 14%, transparent), color-mix(in srgb, var(--sahcs-primary) 8%, transparent) 70%);
		z-index: 0;
	}

	.sahcs-team--cards:not(.sahcs-team--wide) .sahcs-team__member {
		z-index: 1;
	}
}

.sahcs-team--wide .sahcs-team__list {
	margin-top: clamp(24px, 4cqi, 40px);
}

.sahcs-team--wide .sahcs-team__text + .sahcs-team__list {
	margin-top: clamp(24px, 4cqi, 40px);
}

/* Compact list: photo overlapping the edge of a soft card. */
.sahcs-team--compact .sahcs-team__list {
	margin-top: clamp(28px, 4cqi, 44px);
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr));
	gap: clamp(20px, 3cqi, 32px);
}

.sahcs-team--compact .sahcs-team__text + .sahcs-team__list {
	margin-top: clamp(28px, 4cqi, 44px);
}

.sahcs-team--compact .sahcs-team__member {
	display: flex;
	align-items: center;
	gap: clamp(18px, 3cqi, 34px);
	padding: 16px 24px 16px 0;
	max-width: 580px;
	isolation: isolate;
}

.sahcs-team--compact .sahcs-team__social {
	background: var(--sahcs-card);
	border: 1px solid color-mix(in srgb, var(--sahcs-primary) 16%, transparent);
}

/* The card itself starts a little to the right, so the photo sits on its edge. */
.sahcs-team--compact .sahcs-team__member::before {
	content: "";
	position: absolute;
	inset: 0 0 0 68px;
	z-index: -1;
	border-radius: calc(var(--sahcs-radius) + 4px);
	background: color-mix(in srgb, var(--sahcs-primary) 5%, var(--sahcs-soft));
	border: var(--sahcs-card-border);
}

.sahcs-team--compact .sahcs-team__photo-wrap::before {
	content: "";
	position: absolute;
	top: -10px;
	left: -24px;
	width: 72px;
	height: 72px;
	z-index: 0;
	background-image: radial-gradient(color-mix(in srgb, var(--sahcs-primary) 45%, transparent) 1.6px, transparent 1.8px);
	background-size: 16px 16px;
	opacity: 0.7;
}

.sahcs-team--compact .sahcs-team__photo {
	width: 120px;
	height: 120px;
	border: 6px solid var(--sahcs-card);
	box-shadow: 0 14px 30px -14px color-mix(in srgb, var(--sahcs-heading) 45%, transparent);
}

.sahcs-team--compact .sahcs-team__initials {
	font-size: 2.2em;
}

.sahcs-team--compact .sahcs-team__photo-wrap {
	margin-left: 24px;
}

@container (max-width: 480px) {
	.sahcs-team--compact .sahcs-team__member {
		gap: 16px;
		padding-right: 16px;
	}

	.sahcs-team--compact .sahcs-team__photo {
		width: 88px;
		height: 88px;
		border-width: 4px;
	}

	.sahcs-team--compact .sahcs-team__photo-wrap {
		margin-left: 14px;
	}

	.sahcs-team--compact .sahcs-team__member::before {
		left: 46px;
	}

	.sahcs-team--compact .sahcs-team__photo-wrap::before {
		left: -14px;
	}

	.sahcs-team--compact .sahcs-team__name {
		font-size: 1.15em;
	}

	.sahcs-team--cards .sahcs-team__photo {
		width: 144px;
		height: 144px;
	}
}

/* ---------- Author line in the hero ---------- */

.sahcs-scope .sahcs-hero__byline {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	margin: 1.2em 0 0;
	font-size: 0.95em;
	color: var(--sahcs-muted);
}

.sahcs-hero--stacked .sahcs-hero__byline {
	justify-content: center;
}

.sahcs-scope .sahcs-hero__avatar {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	flex: none;
	margin: 0;
}

.sahcs-scope .sahcs-hero__author {
	color: var(--sahcs-heading);
	font-weight: 600;
	text-decoration: none;
}

.sahcs-scope .sahcs-hero__author:hover,
.sahcs-scope .sahcs-hero__author:focus-visible {
	color: var(--sahcs-primary);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ---------- Smooth scrolling on case study pages ---------- */

/* Only on pages that show SiteAuditHub Case Studies' case study or listing layout,
   and never for visitors who asked their device for less motion. */
@media (prefers-reduced-motion: no-preference) {
	html:has(.sahcs-single),
	html:has(.sahcs-archive) {
		scroll-behavior: smooth;
	}
}

/* ---------- Protection from theme styles ---------- */

/* Line icons stay line icons even if the theme fills every SVG. */
.sahcs-scope svg.sahcs-icon {
	fill: none;
	stroke: currentColor;
	display: inline-block;
	flex: none;
	vertical-align: middle;
	max-width: none;
}

.sahcs-scope svg.sahcs-icon > * {
	fill: inherit;
	stroke: inherit;
}

.sahcs-scope svg.sahcs-icon > .sahcs-icon__solid {
	fill: currentColor;
	stroke: none;
}

/* Photos and icons keep their square shape, even when a theme forces
   img { height: auto !important } or adds borders and shadows to images. */
.sahcs-scope img.sahcs-team__photo,
.sahcs-scope img.sahcs-testimonial__photo,
.sahcs-scope img.sahcs-glance__img,
.sahcs-scope img.sahcs-hero__avatar {
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 50%;
	padding: 0;
}

.sahcs-scope img.sahcs-glance__img {
	object-fit: contain;
	border-radius: 0;
	border: 0;
	box-shadow: none;
	background: none;
}

.sahcs-team--cards img.sahcs-team__photo,
.sahcs-scope img.sahcs-testimonial__photo,
.sahcs-scope img.sahcs-hero__avatar {
	border: 0;
}

/* Theme link decorations (bottom borders, shadows) never land on plugin links. */
.sahcs-scope a:not(.sahcs-button) {
	border-bottom: 0;
	box-shadow: none;
}

/* Clickable rows (FAQ questions, table-of-contents header) ignore theme button looks. */
.sahcs-scope summary.sahcs-faq__q,
.sahcs-scope summary.sahcs-toc__title {
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	color: var(--sahcs-heading);
	text-transform: none;
	letter-spacing: normal;
	width: auto;
	min-height: 0;
}

.sahcs-scope .sahcs-faq__qtext {
	text-transform: none;
	letter-spacing: normal;
	font-family: var(--sahcs-font-heading);
	color: var(--sahcs-heading);
}

/* Titles keep their own capitalisation. */
.sahcs-scope :is(.sahcs-glance__heading, .sahcs-team__title, .sahcs-hero__title, .sahcs-team__name, .sahcs-glance__item dd, .sahcs-testimonial__name) {
	text-transform: none;
}

/* Lists in the summary boxes: no theme bullets, floats, indents or borders. */
.sahcs-scope :is(.sahcs-glance__list, .sahcs-facts__list) :is(dt, dd) {
	float: none;
	clear: none;
	width: auto;
	border: 0;
	background: none;
}

.sahcs-scope :is(.sahcs-team__list, .sahcs-toc__list, .sahcs-filters__list) {
	list-style: none;
}

.sahcs-scope :is(.sahcs-team__list, .sahcs-toc__list, .sahcs-filters__list) > li::before,
.sahcs-scope :is(.sahcs-team__list, .sahcs-toc__list, .sahcs-filters__list) > li::marker {
	content: none;
}

/* ---------- Long words and URLs never break the layout ---------- */

.sahcs-scope :is(h1, h2, h3, h4, h5, h6, p, li, dd, dt, figcaption, blockquote, td, th, a) {
	overflow-wrap: break-word;
}

.sahcs-scope :is(.sahcs-card__title, .sahcs-hero__title, .sahcs-feature__title, .sahcs-archive__title, .sahcs-toc__link) {
	overflow-wrap: anywhere;
}

/* ---------- Right-to-left languages ---------- */

[dir="rtl"] .sahcs-scope .sahcs-arrow,
.sahcs-scope[dir="rtl"] .sahcs-arrow {
	display: inline-block;
	transform: scaleX(-1);
}


/* ---------- Typography: one set of sizes for the whole plugin ---------- */

/* H1: the case study title and the listing page title */
.sahcs-scope .sahcs-hero__title,
.sahcs-scope .sahcs-archive__title {
	font-size: var(--sahcs-fs-h1);
	line-height: 1.18;
}

/* H2: every section title */
.sahcs-scope .sahcs-section__title,
.sahcs-scope .sahcs-results__title,
.sahcs-scope .sahcs-gallery__title,
.sahcs-scope .sahcs-faq__title,
.sahcs-scope .sahcs-team__title,
.sahcs-scope .sahcs-related__title,
.sahcs-scope .sahcs-grid-wrap__title,
.sahcs-scope .sahcs-glance__heading,
.sahcs-scope .sahcs-cta__title,
.sahcs-scope .sahcs-section__content h2 {
	font-size: var(--sahcs-fs-h2);
	line-height: 1.22;
}

/* H3: questions and sub-headings inside sections */
.sahcs-scope .sahcs-faq__qtext,
.sahcs-scope .sahcs-section__content h3 {
	font-size: var(--sahcs-fs-h3);
	line-height: 1.35;
}

/* Paragraph text inside sections follows the paragraph size exactly */
.sahcs-scope .sahcs-section__content :is(p, li),
.sahcs-scope .sahcs-faq__a p {
	font-size: var(--sahcs-fs-p);
}