/*
 * SNH Blocks — site styles (front end + editor).
 *
 * theme.json holds the tokens (palette, fonts, base type). This file holds layout
 * and the per-breakpoint rules that blocks can't express. Breakpoints follow the
 * original Bricks build: 991px (tablet), 767px (mobile landscape), 478px (mobile).
 */

:root {
	--snh-red: var(--wp--preset--color--brand-red);
	--snh-red-dark: var(--wp--preset--color--brand-red-dark);
	--snh-navy: var(--wp--preset--color--navy);
	--snh-ink: var(--wp--preset--color--ink);
	--snh-text: var(--wp--preset--color--text);
	--snh-radius: 24px;
	--snh-curve: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 100' preserveAspectRatio='none'%3E%3Cpath d='M500,97C126.7,96.3,0.8,19.8,0,0v100l1000,0V1C1000,19.4,873.3,97.8,500,97z' fill='%23ffffff'/%3E%3C/svg%3E");
}

/* ---------- Base ---------- */

body {
	-webkit-font-smoothing: auto;
}

p {
	margin: 0;
}

:where(.wp-site-blocks) > * {
	margin-block-start: 0;
}

h1, h2 {
	font-family: var(--wp--preset--font-family--inter);
	letter-spacing: -2px;
	color: var(--snh-ink);
	font-weight: 700;
}

h2 {
	font-size: 44px;
}

h1, h2, h3, h4, h5, h6 {
	max-width: 100%;
}

.wp-block-image {
	margin: 0;
}

.wp-block-image img {
	display: block;
}

/* Icons: SVG files used as images. Bricks set them inline in a text line, which
   leaves a little space under each one — kept so spacing matches. */
.snh-icon {
	line-height: 0;
}

/* ---------- Section shell ---------- */

.snh-section {
	padding: 120px 40px;
}

@media (max-width: 991px) {
	.snh-section {
		padding: 80px 32px;
	}

	h2 {
		font-size: 36px;
	}
}

@media (max-width: 478px) {
	.snh-section {
		padding: 60px 24px;
	}

	h2 {
		font-size: 28px;
	}
}

/* ---------- Block style variations ---------- */

/* Eyebrow label above section headings */
.is-style-eyebrow {
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: var(--snh-navy);
}

/* Pill label on dark backgrounds (hero) */
.is-style-pill {
	display: inline-block;
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: #fff;
	background-color: #ffffff20;
	padding: 6px 18px;
	border: 1px solid #ffffff40;
	border-radius: 99px;
	margin-bottom: 24px !important;
}

/* Buttons: theme.json gives the red pill; these are the variations. */
.wp-block-button .wp-block-button__link {
	display: inline-block;
}

.wp-block-button.is-style-ghost .wp-block-button__link {
	background-color: #ffffff47;
	border: 1px solid #fff;
	color: #fff;
}

.wp-block-button.is-style-ghost .wp-block-button__link:hover {
	background-color: #ffffff66;
}

.wp-block-button.snh-btn-lg .wp-block-button__link {
	padding: 14px 32px;
}

.wp-block-button.is-style-text-link .wp-block-button__link {
	background: none;
	padding: 0;
	border-radius: 0;
	color: var(--snh-navy);
	letter-spacing: normal;
}

.wp-block-buttons {
	gap: 12px;
}

/* Card: white rounded panel */
.wp-block-group.is-style-card {
	background-color: #fff;
	border-radius: var(--snh-radius);
	padding: 40px;
}

@media (max-width: 991px) {
	.wp-block-group.is-style-card {
		padding: 32px;
	}
}

@media (max-width: 478px) {
	.wp-block-group.is-style-card {
		padding: 24px;
	}
}

/* Shared text treatments */
.snh-text,
.snh-section p.snh-text {
	font-size: 16px;
	line-height: 1.65;
	color: var(--snh-text);
}

/* ---------- Header ---------- */

.snh-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.admin-bar .snh-header {
	top: var(--wp-admin--admin-bar--height, 32px);
}

.snh-header.is-scrolled {
	background-color: #fff;
	box-shadow: 0 2px 12px 0 #00000026;
}

.snh-header__bar {
	height: 80px;
	padding: 0 40px;
	align-items: center;
}

.snh-logo-link {
	display: inline-flex;
	line-height: 0;
	color: #fff;
	flex-shrink: 0;
}

.snh-logo {
	display: block;
	height: 44px;
	aspect-ratio: 567 / 211;
	background-color: currentColor;
	-webkit-mask: url(../icons/logo.svg) no-repeat center / contain;
	mask: url(../icons/logo.svg) no-repeat center / contain;
}

.snh-header.is-scrolled .snh-logo-link {
	color: var(--snh-red);
}

/* Main menu: inline above 1336px, slide-in panel below (as in the Bricks build). */
.snh-main-nav {
	flex: 1 1 auto;
	font-family: var(--wp--preset--font-family--inter);
	font-size: 15px;
	font-weight: 500;
}

/* Bricks spaced items 22px gap + 30px item margin */
.snh-main-nav .wp-block-navigation__container {
	gap: 52px;
	padding-left: 30px;
}

.snh-header .snh-main-nav .wp-block-navigation-item__content.wp-block-navigation-item__content {
	padding: 8px 0;
	color: #ffffffcc;
	white-space: nowrap;
	border-bottom: 2px solid transparent;
	line-height: 1.7;
}

.snh-header .snh-main-nav .current-menu-item > .wp-block-navigation-item__content.wp-block-navigation-item__content {
	color: #fff;
	font-weight: 600;
	border-bottom-color: #fff;
}

.snh-header.is-scrolled .snh-main-nav .wp-block-navigation-item__content.wp-block-navigation-item__content {
	color: var(--snh-navy);
}

.snh-header.is-scrolled .snh-main-nav .current-menu-item > .wp-block-navigation-item__content.wp-block-navigation-item__content {
	border-bottom-color: var(--snh-navy);
}

.snh-main-nav .wp-block-navigation__responsive-container-open {
	color: #fff;
}

/* Hamburger drawn like Bricks': three 2px bars in a 20x16 box. */
.snh-main-nav .wp-block-navigation__responsive-container-open {
	width: 20px;
	height: 16px;
	padding: 0;
	background:
		linear-gradient(currentColor 0 0) top / 100% 2px no-repeat,
		linear-gradient(currentColor 0 0) center / 100% 2px no-repeat,
		linear-gradient(currentColor 0 0) bottom / 100% 2px no-repeat;
}

.snh-main-nav .wp-block-navigation__responsive-container-open svg {
	display: none;
}

.snh-header.is-scrolled .snh-main-nav .wp-block-navigation__responsive-container-open {
	color: var(--snh-navy);
}

@media (min-width: 1337px) {
	.snh-main-nav .wp-block-navigation__responsive-container-open {
		display: none;
	}

	.snh-main-nav .wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: block;
		position: static;
		width: auto;
		background: none !important;
		z-index: auto;
	}

	.snh-main-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-container-close {
		display: none;
	}
}

@media (max-width: 1336px) {
	.snh-main-nav {
		justify-content: flex-end;
	}
}

/* Language switcher: set apart from the page links — a divider after the last page link, then a
   compact "EN / 中文" with the current language bold and the other muted. (Bricks styled the two
   languages exactly like page links; changed 2026-10-05 at the client's request.) */
.snh-header .snh-main-nav .lang-item .wp-block-navigation-item__content.wp-block-navigation-item__content {
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.04em;
	opacity: 0.6;
	border-bottom: 0;
}

.snh-header .snh-main-nav .lang-item.current-lang .wp-block-navigation-item__content.wp-block-navigation-item__content {
	font-weight: 700;
	opacity: 1;
}

.snh-header .snh-main-nav .lang-item .wp-block-navigation-item__content:hover {
	opacity: 1;
}

@media (min-width: 1337px) {
	.snh-main-nav .lang-item-first {
		position: relative;
		margin-left: 6px;
	}

	.snh-main-nav .lang-item-first::before {
		content: "";
		position: absolute;
		left: -32px;
		top: 50%;
		width: 1px;
		height: 18px;
		transform: translateY(-50%);
		background: #fff;
		opacity: 0.35;
	}

	.snh-header.is-scrolled .snh-main-nav .lang-item-first::before {
		background: var(--snh-navy);
	}

	.snh-main-nav .lang-item + .lang-item {
		margin-left: -38px; /* 52px menu gap → 14px between EN and 中文 */
	}

	.snh-main-nav .lang-item + .lang-item::before {
		content: "/";
		position: absolute;
		margin-left: -10px;
		top: 50%;
		transform: translateY(-50%);
		font-size: 13px;
		color: #fff;
		opacity: 0.45;
	}

	.snh-header.is-scrolled .snh-main-nav .lang-item + .lang-item::before {
		color: var(--snh-navy);
	}

	.snh-main-nav .lang-item + .lang-item {
		position: relative;
	}

	.snh-header .snh-main-nav .lang-item .wp-block-navigation-item__content.wp-block-navigation-item__content {
		color: #fff;
	}

	.snh-header.is-scrolled .snh-main-nav .lang-item .wp-block-navigation-item__content.wp-block-navigation-item__content {
		color: var(--snh-navy);
	}
}

/* Open mobile menu: 300px navy panel from the left */
.snh-main-nav .wp-block-navigation__responsive-container.is-menu-open {
	width: 300px;
	right: auto;
	padding: 0;
	animation: snh-slide-in 0.2s ease-out;
}

.snh-main-nav .is-menu-open .wp-block-navigation__responsive-dialog {
	margin-top: 0;
}

.snh-main-nav .wp-block-navigation__responsive-container.is-menu-open {
	box-shadow: 0 0 0 100vmax rgba(0, 0, 0, 0.25);
}

.snh-main-nav .is-menu-open .wp-block-navigation__responsive-container-content.wp-block-navigation__responsive-container-content {
	padding: 0 30px;
	align-items: flex-start;
}

.snh-main-nav .is-menu-open .wp-block-navigation__container.wp-block-navigation__container {
	gap: 0;
	padding-left: 0;
	align-items: flex-start;
}

/* Phone menu: page links one per line; the two languages side by side under a divider. */
.snh-main-nav .is-menu-open .wp-block-navigation__container.wp-block-navigation__container {
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
}

.snh-main-nav .is-menu-open .wp-block-navigation-item.wp-block-navigation-item {
	align-items: flex-start;
	justify-content: flex-start;
	text-align: left;
}

.snh-main-nav .is-menu-open .wp-block-navigation-item:not(.lang-item) {
	width: 100%;
}

.snh-main-nav .is-menu-open .lang-item {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid #ffffff33;
}

.snh-main-nav .is-menu-open .lang-item-first {
	padding-right: 24px;
}

.snh-main-nav .is-menu-open .lang-item + .lang-item {
	flex: 1;
}

.snh-main-nav .is-menu-open .wp-block-navigation-item__label {
	line-height: 28px;
}

.has-modal-open .snh-main-nav .wp-block-navigation__responsive-container-open {
	visibility: hidden;
}

.snh-main-nav .is-menu-open .wp-block-navigation-item__content {
	color: #fff !important;
	font-size: 16px;
	font-weight: 500;
	line-height: 28px;
	padding: 16px 0 !important;
	border: 0 !important;
}

.snh-main-nav .is-menu-open .wp-block-navigation__responsive-container-close {
	position: fixed;
	top: 20px;
	right: 20px;
	color: #fff;
}

.snh-main-nav .is-menu-open .wp-block-navigation__responsive-container-close svg {
	width: 28px;
	height: 28px;
}

@keyframes snh-slide-in {
	from { transform: translateX(-100%); }
	to { transform: none; }
}

@media (max-width: 991px) {
	.snh-header__bar {
		height: 70px;
		padding: 0 20px;
	}

	.snh-logo {
		height: 38px;
	}
}

@media (max-width: 478px) {
	.snh-header__bar {
		height: 60px;
	}

	.snh-logo {
		height: 34px;
	}
}

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

.wp-block-cover.snh-hero {
	padding: 160px 24px 180px;
	min-height: 520px;
	overflow: hidden;
}

.snh-hero .wp-block-cover__background.has-background-dim {
	opacity: 0.82;
}

.snh-hero::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 4em;
	z-index: 3;
	background: var(--snh-curve) no-repeat bottom / 100% 100%;
}

.snh-hero__content {
	max-width: 720px;
	margin: 0 auto;
	text-align: center;
}

.snh-hero h1 {
	font-size: 44px;
	font-weight: 600;
	line-height: 1.2;
	color: #fff;
	margin-bottom: 16px;
}

.snh-hero__lead {
	font-size: 18px;
	line-height: 1.6;
	color: #ffffff99;
	margin-bottom: 32px !important;
}

.snh-hero__buttons {
	justify-content: center;
}

@media (max-width: 478px) {
	.wp-block-cover.snh-hero {
		padding: 100px 20px 130px;
	}

	.snh-hero::after {
		height: 2.5em;
	}
}

/* ---------- Strip of four applications under the hero ---------- */

.snh-strip {
	display: flow-root; /* keep the card's negative margin from collapsing through the section */
	padding: 0 40px;
	background-color: #fff;
}

.snh-strip__card {
	position: relative;
	z-index: 4;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	column-gap: 2px;
	margin-top: -100px !important;
	padding: 36px 52px;
	background-color: #fff;
	border-radius: var(--snh-radius);
	box-shadow: 0 8px 28px 0 #00000012;
}

.snh-strip__item {
	display: flex;
	flex-direction: column;
	row-gap: 4px;
	width: 24%;
}

.snh-strip__item .snh-icon {
	padding-bottom: 8.5px;
}

.snh-strip__item h5 {
	font-weight: 600;
	color: var(--wp--preset--color--heading);
	margin-top: 8px;
}

.snh-strip__item p {
	font-size: 16px;
	line-height: 1.65;
	color: var(--snh-text);
}

@media (max-width: 478px) {
	.snh-strip__card {
		flex-direction: column;
		padding: 24px;
		margin-top: -50px !important;
	}

	.snh-strip__item {
		width: 100%;
	}
}

/* ---------- About ---------- */

.snh-about__row {
	display: flex;
	align-items: center;
	column-gap: 50px;
}

.snh-about__media {
	display: flex;
	flex-direction: column;
	width: 50%;
	position: relative;
}

.snh-about__primary {
	width: 546px;
	max-width: 100%;
	margin-right: 20px;
	overflow: hidden;
	border-radius: var(--snh-radius);
}

.snh-about__primary img {
	width: 100%;
	aspect-ratio: 546 / 467;
	object-fit: cover;
	transform: scale(1.14);
}

.snh-about__secondary {
	width: 220px;
	align-self: flex-end;
	margin: -200px -20px 0 0 !important;
	position: relative;
	z-index: 2;
	overflow: hidden;
	border-radius: var(--snh-radius);
}

.snh-about__secondary img {
	width: 100%;
	aspect-ratio: 220 / 230;
	object-fit: cover;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.snh-about__text {
	display: flex;
	flex-direction: column;
	width: 50%;
}

.snh-about h2 {
	line-height: 1.25;
	margin-top: 6px;
	font-size: 44px;
}

.snh-facts {
	display: flex;
	flex-direction: column;
	row-gap: 6px;
	padding-top: 14px;
}

.snh-facts p {
	font-size: 16px;
	color: var(--wp--preset--color--heading);
}

.snh-facts__check {
	display: flex;
	align-items: center;
	column-gap: 8px;
}

.snh-facts__check::before {
	content: "";
	width: 20px;
	height: 20px;
	flex-shrink: 0;
	background: url(../icons/check-circle.svg) no-repeat center / contain;
}

@media (max-width: 991px) {
	.snh-about__row {
		flex-direction: column;
	}

	.snh-about__media,
	.snh-about__text {
		width: 100%;
	}

	.snh-about__secondary {
		margin-top: -120px !important;
	}
}

@media (max-width: 478px) {
	.snh-about__row {
		row-gap: 40px;
	}

	/* Bricks resets the right margin here but it doesn't take effect; the image keeps its -20px overhang. */
	.snh-about__secondary {
		margin-top: -75px !important;
	}
}

/* ---------- Product range ---------- */

.snh-range {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.snh-range .is-style-eyebrow {
	margin-bottom: 4px;
}

.snh-range h2.snh-range__title {
	width: 700px;
	max-width: 100%;
	font-size: 44px;
	/* Bricks: 80px row gap with a -68px top margin */
	margin-top: 12px !important;
	margin-bottom: 92px;
}

.snh-range__cards {
	display: flex;
	column-gap: 20px;
	width: 100%;
}

.snh-range-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: calc(33.333% - 14px);
}

.snh-range-card__image {
	position: relative;
	width: 100%;
}

.snh-range-card__image img {
	width: 100%;
	height: 400px;
	object-fit: cover;
	object-position: 50% 50%;
	border-radius: var(--snh-radius) var(--snh-radius) 0 0;
}

.snh-range-card__image.snh-pos-automotive img {
	object-position: 50% 40%;
}

.snh-range-card__image.snh-pos-right img {
	object-position: right center;
}

.snh-range-card__image::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 100%;
	height: 60px;
	background: var(--snh-curve) no-repeat center bottom / 100% 100%;
	pointer-events: none;
}

.snh-range-card__body {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 83%;
	min-height: 25em;
	margin-top: -110px !important;
	padding: 40px 28px;
	background-color: #fff;
	border-radius: var(--snh-radius);
	box-shadow: 0 4px 20px 0 #0000000a;
}

.snh-range-card__body .snh-icon {
	padding-bottom: 8.5px;
}

/* Two classes: core's ":root :where(.is-layout-flow) > :first-child" zeroes first-child margins. */
.snh-range-card .snh-range-card__body h4 {
	font-size: 24px;
	font-weight: 700;
	color: var(--snh-ink);
	text-align: center;
	margin: 6px 0 10px;
}

.snh-range-card__body p {
	font-size: 16px;
	line-height: 1.6;
	color: var(--snh-text);
	margin-bottom: 10px;
}

.snh-range-card__body p.snh-range-card__link {
	font-size: 14px;
	font-weight: 600;
	line-height: 1.7;
	text-transform: uppercase;
	color: var(--snh-navy);
	margin-bottom: 0;
}

@media (max-width: 991px) {
	.snh-range h2.snh-range__title {
		margin-top: -8px !important;
		margin-bottom: 72px;
	}
}

@media (max-width: 478px) {
	.snh-range h2.snh-range__title {
		margin-top: 0 !important;
		margin-bottom: 52px;
	}

	.snh-range__cards {
		flex-direction: column;
		row-gap: 20px;
	}

	.snh-range-card {
		width: 100%;
	}

	.snh-range-card__image img {
		height: 300px;
	}

	.snh-range-card__body {
		width: 90%;
		padding: 24px 16px;
		margin-top: -90px !important;
	}

	.snh-range-card__body p {
		text-align: center;
	}
}

/* ---------- In-house capability ---------- */

.snh-capability__intro {
	display: flex;
	justify-content: space-between;
	column-gap: 16px;
	margin-bottom: 80px;
}

.snh-capability__title,
.snh-capability__body {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.snh-capability__body {
	align-self: center;
}

.snh-capability .is-style-eyebrow {
	margin-bottom: 4px;
}

.snh-capability h2 {
	width: 70%;
	font-size: 44px;
}

.snh-capability__body p {
	font-size: 16px;
	line-height: 1.65;
	color: var(--snh-text);
}

.snh-capability__body .wp-block-buttons {
	margin-top: 16px;
}

.snh-gallery__row.wp-block-columns {
	gap: 20px;
	margin: 0 0 20px;
}

.snh-gallery__row:last-child {
	margin-bottom: 0;
}

.snh-gallery img {
	width: 100%;
	height: 440px;
	object-fit: cover;
	border-radius: var(--snh-radius);
}

@media (max-width: 991px) {
	.snh-capability__intro {
		margin-bottom: 60px;
	}
}

@media (max-width: 478px) {
	.snh-capability__intro {
		flex-direction: column;
		row-gap: 24px;
		margin-bottom: 40px;
	}

	.snh-capability h2 {
		width: 100%;
	}

	.snh-gallery__row.wp-block-columns {
		flex-direction: column;
	}

	.snh-gallery__row > .wp-block-column {
		flex-basis: 100% !important;
	}

	.snh-gallery img {
		height: 250px;
	}
}

/* ---------- Mid-page enquiry banner ---------- */

.wp-block-cover.snh-cta {
	padding: 100px 40px;
	min-height: 0;
	overflow: hidden;
}

.snh-cta .wp-block-cover__background.has-background-dim {
	opacity: 0.82;
}

.snh-cta__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
}

.snh-cta__text {
	flex: 1 1 0;
}

.snh-cta h2 {
	color: #fff;
}

.snh-cta p {
	font-size: 16px;
	line-height: 1.65;
	color: #ffffffcc;
}

.snh-cta .wp-block-buttons {
	flex-shrink: 0;
}

@media (max-width: 991px) {
	.wp-block-cover.snh-cta {
		padding: 80px 32px;
	}
}

@media (max-width: 478px) {
	.wp-block-cover.snh-cta {
		padding: 60px 24px;
	}

	.snh-cta__row {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* ---------- Certifications ---------- */

.snh-certs__head {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 80px;
}

.snh-certs__head h2 {
	margin-top: 10px;
}

.snh-certs__cards {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch; /* equal-height cards (Bricks let them differ; changed 2026-10-05) */
	gap: 20px;
}

.snh-cert {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	row-gap: 12px;
	padding: 32px 40px 40px 32px;
	background-color: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--snh-radius);
}

.snh-cert .snh-icon {
	align-self: flex-end;
	padding-bottom: 8.5px;
}

.snh-cert h3 {
	font-family: var(--wp--preset--font-family--inter);
	font-size: 24px;
	font-weight: 700;
	color: var(--snh-ink);
}

.snh-cert p {
	font-size: 16px;
	line-height: 1.65;
	color: var(--snh-text);
}

.snh-cert p.snh-cert__issuer {
	margin-top: auto; /* issuer line + divider aligned across the row */
	font-size: 14px;
	font-weight: 500;
	line-height: 1.7;
	color: var(--wp--preset--color--muted);
	padding-top: 16px;
	border-top: 1px solid var(--wp--preset--color--border);
}

@media (max-width: 991px) {
	.snh-certs__head {
		margin-bottom: 60px;
	}

	.snh-cert {
		padding: 24px 16px;
	}

	.snh-cert h3 {
		font-size: 22px;
	}
}

@media (max-width: 478px) {
	.snh-certs__head {
		margin-bottom: 40px;
	}

	.snh-certs__cards {
		flex-direction: column;
		align-items: stretch;
	}

	.snh-cert {
		padding: 20px 12px;
	}

	.snh-cert h3 {
		font-size: 20px;
	}
}

/* ---------- Track record ---------- */

.snh-section.snh-track {
	padding-bottom: 80px;
}

.snh-track__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 50px;
}

.snh-track__text,
.snh-track__media {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.snh-track__media {
	position: relative;
	align-items: stretch;
}

.snh-track .is-style-eyebrow,
.snh-why .is-style-eyebrow {
	margin-bottom: 12px;
}

.snh-track__text h2,
.snh-why__text h2 {
	margin-bottom: 16px;
}

.snh-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	width: 100%;
	padding-top: 42px;
}

.snh-stat {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.snh-stat h3 {
	font-family: var(--wp--preset--font-family--inter);
	font-size: 44px;
	font-weight: 700;
	letter-spacing: -2px;
	color: var(--snh-ink);
	margin-bottom: 8px;
}

.snh-stat h6 {
	font-family: var(--wp--preset--font-family--inter);
	font-size: 16px;
	font-weight: 600;
	color: var(--snh-ink);
	margin-bottom: 8px;
	padding-top: 8px;
	border-top: 2px solid var(--snh-navy);
}

.snh-stat p {
	font-size: 14px;
	line-height: 1.5;
	color: var(--wp--preset--color--muted);
}

.snh-track__media img {
	width: 100%;
	height: 620px;
	object-fit: cover;
	border-radius: var(--snh-radius);
}

.snh-track__badge {
	position: relative;
	z-index: 2;
	align-self: flex-start;
	margin: -120px 0 0 -32px !important;
	padding: 24px 32px;
	border-radius: var(--snh-radius);
}

.snh-track__badge h5 {
	font-family: var(--wp--preset--font-family--inter);
	font-size: 18px;
	font-weight: 600;
	color: #fff;
}

@media (max-width: 991px) {
	.snh-section.snh-track {
		padding-bottom: 50px;
	}

	.snh-track__row {
		column-gap: 46px;
	}

	.snh-stat h3 {
		font-size: 36px;
	}

	.snh-track__badge {
		margin-left: -16px !important;
	}
}

@media (max-width: 478px) {
	.snh-section.snh-track {
		padding-bottom: 60px;
	}

	.snh-track__row {
		flex-direction: column;
		row-gap: 40px;
	}

	.snh-track__text,
	.snh-track__media {
		flex-basis: auto;
		width: 100%;
	}

	.snh-stat h3 {
		font-size: 28px;
	}

	.snh-track__media img {
		height: 400px;
	}

	.snh-track__badge {
		margin: -80px 0 0 0 !important;
	}
}

/* ---------- Why SNH ---------- */

.snh-why__row {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 60px 50px;
}

.snh-why__text {
	flex: 1 1 0;
}

.snh-why__cards {
	flex: 1 1 0;
	display: flex;
	flex-wrap: wrap;
	align-items: stretch; /* equal-height cards in each row (changed 2026-10-05) */
	gap: 20px;
}

.snh-why__cards > .is-style-card {
	width: calc(50% - 10px);
	display: flex;
	flex-direction: column;
}

.snh-why__cards .snh-icon {
	margin-bottom: 16px;
}

.snh-why__cards h4 {
	font-family: var(--wp--preset--font-family--inter);
	font-size: 20px;
	font-weight: 700;
	color: var(--snh-ink);
	margin-bottom: 8px;
}

.snh-why__cards p {
	font-size: 16px;
	line-height: 1.65;
	color: var(--snh-text);
}

@media (max-width: 478px) {
	.snh-why__row {
		flex-direction: column;
	}

	.snh-why__text,
	.snh-why__cards {
		flex-basis: auto;
		width: 100%;
	}

	.snh-why__cards {
		flex-direction: column;
	}

	.snh-why__cards > .is-style-card {
		width: 100%;
	}
}

/* ---------- Footer enquiry banner ---------- */

.snh-section.snh-footer-cta {
	padding: 80px 40px;
}

.snh-footer-cta__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 32px 80px;
}

.snh-footer-cta__title,
.snh-footer-cta__body {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
}

.snh-footer-cta__body {
	row-gap: 24px;
}

.snh-footer-cta .is-style-eyebrow {
	color: #ffffff99;
}

.snh-footer-cta h2 {
	font-size: 36px;
	color: #fff;
	margin-top: 10px;
}

.snh-footer-cta p:not(.is-style-eyebrow) {
	font-size: 16px;
	line-height: 1.65;
	color: #ffffffcc;
}

@media (max-width: 991px) {
	.snh-section.snh-footer-cta {
		padding: 60px 32px;
	}

	.snh-footer-cta h2 {
		font-size: 30px;
	}
}

@media (max-width: 478px) {
	.snh-section.snh-footer-cta {
		padding: 48px 24px;
	}

	.snh-footer-cta__row {
		flex-direction: column;
		align-items: stretch;
		row-gap: 9px;
	}

	.snh-footer-cta .is-style-eyebrow {
		margin-bottom: -20px;
	}

	.snh-footer-cta h2 {
		font-size: 24px;
		margin-top: 30px;
	}
}

/* ---------- Footer ---------- */

.snh-footer {
	padding: 80px 40px 0;
	font-family: var(--wp--preset--font-family--roboto);
}

.snh-footer__cols {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 40px;
	padding-bottom: 60px;
}

.snh-footer__brand {
	display: flex;
	flex-direction: column;
	row-gap: 20px;
	width: 320px;
}

.snh-footer__brand p {
	font-size: 14px;
	line-height: 1.7;
	color: #ffffffb3;
}

.snh-footer__col {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	row-gap: 16px;
}

.snh-footer h6 {
	font-family: var(--wp--preset--font-family--inter);
	font-size: 16px;
	font-weight: 600;
	color: #fff;
	margin-bottom: 8px;
}

.snh-footer__links {
	list-style: none;
	margin: 0;
	padding: 0;
	font-family: var(--wp--preset--font-family--system);
}

.snh-footer__links a {
	display: block;
	font-size: 15px;
	line-height: 2.2;
	color: #ffffffb3;
}

.snh-footer__links a:hover {
	color: #fff;
}

.snh-contact-item {
	display: flex;
	align-items: center;
	column-gap: 12px;
}

.snh-contact-item--top {
	align-items: flex-start;
}

.snh-contact-item--top .snh-contact-item__icon {
	margin-top: 2px;
}

.snh-contact-item__icon {
	flex-shrink: 0;
	line-height: 0;
}

/* Bricks containers wrap at 767px and below, which drops the text under the icon. */
@media (max-width: 767px) {
	.snh-contact-item {
		flex-wrap: wrap;
	}

	.snh-contact-item__text {
		width: 100%;
	}
}

.snh-contact-item__text p {
	font-size: 15px;
	line-height: 1.7;
	color: #ffffffcc;
}

.snh-contact-item__text p.snh-contact-item__label {
	font-size: 13px;
	font-weight: 500;
	color: #ffffff99;
}

.snh-footer p.snh-footer__certs {
	padding: 24px 0;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 1px;
	text-align: center;
	color: #ffffff66;
	border-top: 1px solid #ffffff1a;
	border-bottom: 1px solid #ffffff1a;
}

.snh-footer__legal {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px 16px;
	padding: 24px 0;
}

.snh-footer__legal p {
	font-size: 13px;
	line-height: 1.7;
	color: #ffffff66;
}

/* Bricks: the links sit in a 15px body-text line (25.5px tall) at 13px each. */
.snh-footer .snh-footer__legal p.snh-footer__legal-links {
	font-family: var(--wp--preset--font-family--system);
	font-size: 15px;
	line-height: 1.7;
}

.snh-footer__legal-links a {
	font-size: 13px;
	color: #ffffff66;
}

@media (max-width: 991px) {
	.snh-footer {
		padding: 60px 32px 0;
	}
}

@media (max-width: 478px) {
	.snh-footer {
		padding: 48px 24px 0;
	}

	.snh-footer__cols {
		flex-direction: column;
	}

	.snh-footer__brand,
	.snh-footer__col {
		width: 100%;
		flex-basis: auto;
	}

	.snh-footer__legal {
		flex-direction: column;
	}
}

/* ---------- Chinese pages ---------- */

/* The English design tightens headings to -2px, which crowds CJK glyphs; Chinese
   headings use normal tracking and balanced lines (no single orphaned character). */
:lang(zh) :is(h1, h2, h3, h4, h5, h6) {
	letter-spacing: 0;
	text-wrap: balance;
}

/* Uppercase/letter-spaced eyebrow labels read better without extra tracking in Chinese. */
:lang(zh) .is-style-eyebrow,
:lang(zh) .is-style-pill {
	letter-spacing: 1px;
}