.cert-hero {
	position: relative;
	background:
		radial-gradient(1200px 500px at 85% 0%, rgba(255, 215, 50, .10), transparent 60%),
		radial-gradient(900px 400px at 10% 100%, rgba(255, 215, 50, .08), transparent 60%),
		linear-gradient(135deg, #0059b2 0%, #0059b2 45%, #0059b2 100%);
	color: #fff;
	padding: 60px 0 60px;
	overflow: hidden;
}

.cert-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(255, 255, 255, .06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, .06) 1px, transparent 1px);
	background-size: 48px 48px;
	mask-image: radial-gradient(ellipse at center, #000 40%, transparent 85%);
	-webkit-mask-image: radial-gradient(ellipse at center, #000 40%, transparent 85%);
}

.cert-hero-inner {
	position: relative;
	z-index: 2;
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 30px;
	display: grid;
	grid-template-columns: 1.4fr .8fr;
	gap: 50px;
	align-items: center;
}

.cert-hero-left {
	min-width: 0
}

.cert-tag {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 16px;
	background: rgba(255, 215, 50, .10);
	border: 1px solid rgba(255, 215, 50, .45);
	border-radius: 999px;
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .5px;
	margin-bottom: 22px;
}

.cert-tag .dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #ffd732;
	box-shadow: 0 0 12px rgba(255, 215, 50, .9);
	animation: cert-pulse 2s ease-in-out infinite
}

@keyframes cert-pulse {

	0%,
	100% {
		opacity: 1
	}

	50% {
		opacity: .35
	}
}

.cert-redesign h1 {
	font-family: "Barlow", sans-serif;
	color: #fff !important;
	font-size: clamp(38px, 5.4vw, 68px);
	font-weight: 800;
	line-height: 1.05;
	margin: 0 0 22px;
}

.cert-redesign h1 .accent {
	color: #ffd732;
}

.cert-redesign h1::after {
	content: "";
	display: block;
	width: 80px;
	height: 4px;
	border-radius: 4px;
	margin-top: 22px;
	background: linear-gradient(90deg, #ffd732, transparent);
}

.cert-hero p {
	color: #e2e8f0;
	font-size: 17px;
	line-height: 1.75;
	max-width: 640px;
	margin: 0 0 30px;
}

.cert-hero p strong {
	color: #fff;
	font-weight: 600
}

.cert-cta {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 16px 28px;
	background: #ffd732;
	color: #222 !important;
	border-radius: 50px;
	font-family: "Barlow", sans-serif;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 15px;
	text-decoration: none !important;
	position: relative;
	overflow: hidden;
	transition: transform .25s ease, box-shadow .25s ease;
	box-shadow: 0 12px 26px -8px rgba(255, 215, 50, .6);
}

.cert-cta:hover {
	transform: translateY(-2px);
	box-shadow: 0 18px 34px -10px rgba(255, 215, 50, .7);
	color: #222
}

/* ---------- HERO RIGHT: animated rings ---------- */
.cert-hero-right {
	position: relative;
	min-height: 300px;
	display: flex;
	align-items: center;
	justify-content: center
}

.cert-ring {
	position: absolute;
	border-radius: 50%;
	border: 1px dashed rgba(255, 215, 50, .8);
}

.cert-ring.r1 {
	width: 300px;
	height: 300px;
	animation: cert-spin 38s linear infinite
}

.cert-ring.r2 {
	width: 230px;
	height: 230px;
	border-style: solid;
	border-color: rgba(255, 215, 50, .8);
	animation: cert-spin 24s linear infinite reverse
}

.cert-ring.r3 {
	width: 160px;
	height: 160px;
	border-style: dotted;
	border-color: rgba(255, 215, 50, .8);
	animation: cert-spin 18s linear infinite
}

.cert-core {
	position: relative;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #ffe572, #ffd732 50%, #b88f00 100%);
	box-shadow:
		0 0 0 6px rgba(255, 255, 255, .04),
		0 0 0 10px rgba(255, 215, 50, .12),
		0 30px 60px -10px rgba(255, 215, 50, .55),
		inset 0 0 30px rgba(0, 0, 0, .25);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0059b2;
	font-size: 42px;
}

.cert-core .seal-icon {
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .25));
}

@keyframes cert-spin {
	from {
		transform: rotate(0)
	}

	to {
		transform: rotate(360deg)
	}
}

/* Floating cert chips */
.cert-chips {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.cert-chip {
	position: absolute;
	padding: 7px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .06);
	border: 1px solid #ffd732;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
	letter-spacing: .4px;
}

.cert-chip.c1 {
	top: 6%;
	left: -2%
}

.cert-chip.c2 {
	top: 18%;
	right: -6%
}

.cert-chip.c3 {
	bottom: 10%;
	left: -4%
}

.cert-chip.c4 {
	bottom: 4%;
	right: 4%
}

.cert-chip.c5 {
	top: 48%;
	right: -8%
}

.cert-chip.c6 {
	top: 50%;
	left: -8%
}

/* ---------- GALLERY SECTION ---------- */
.cert-gallery-section {
	padding: 50px 0;
	position: relative;
}

.cert-section-title {
	text-align: center;
	margin-bottom: 50px
}

.cert-section-title .tag-line {
	display: inline-block;
	color: #0059b2;
	font-weight: 700;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 3px;
	margin-bottom: 12px;
	position: relative;
	padding: 0 30px;
}

.cert-section-title .tag-line::before,
.cert-section-title .tag-line::after {
	content: '';
	position: absolute;
	top: 50%;
	width: 20px;
	height: 2px;
	background: #ffd732;
}

.cert-section-title .tag-line::before {
	left: 0
}

.cert-section-title .tag-line::after {
	right: 0
}

.cert-section-title h2 {
	font-family: "Barlow", sans-serif;
	font-size: clamp(28px, 4vw, 42px);
	font-weight: 800;
	color: #0a1929;
	line-height: 1.2;
	margin-bottom: 15px;
}

.cert-section-title h2 span {
	color: #0059b2;
	position: relative
}

.cert-section-title p {
	color: #222;
	font-size: 16px;
	line-height: 1.7;
	max-width: 650px;
	margin: 0 auto;
}

/* ---------- FILTER BAR ---------- */
.cert-filter {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 15px;
	margin-bottom: 50px;
}

.filter-btn {
	background: #fff;
	border: 2px solid #e8eef7;
	padding: 11px 24px;
	border-radius: 50px;
	color: #222;
	font-weight: 500;
	font-size: 15px;
	cursor: pointer;
	transition: .3s;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.filter-btn img {
	filter: brightness(0%) contrast(200%) invert(0%) opacity(100%);
	height: 20px;
}

.filter-btn:hover img {
	filter: none;
}

.filter-btn.on img {
	filter: brightness(0%) contrast(200%) invert(100%) opacity(100%);
}

.filter-btn .count {
	background: rgba(0, 89, 178, .08);
	color: #0059b2;
	padding: 2px 9px;
	border-radius: 50px;
	font-size: 12px;
	font-weight: 700;
}

.filter-btn:hover {
	border-color: #0059b2;
	color: #0059b2;
	transform: translateY(-2px);
}

.filter-btn.on {
	background: linear-gradient(135deg, #0059b2 0%, #01478d 100%);
	border-color: transparent;
	color: #fff;
	box-shadow: 0 8px 20px rgba(0, 89, 178, .3);
}

.filter-btn.on .count {
	background: #ffd732;
	color: #0059b2;
}

/* ---------- GALLERY GRID ---------- */
.gallery {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 28px;
}

.item {
	background: #fff;
	overflow: hidden;
	border-radius: 16px;
	cursor: pointer;
	transition: all .4s cubic-bezier(.4, 0, .2, 1);
	border: 1px solid #e8eef7;
	box-shadow: 0 4px 12px rgba(0, 89, 178, .08);
	position: relative;
	animation: fadeUp .6s ease backwards;
}

.item.hide {
	display: none
}

@keyframes fadeUp {
	from {
		opacity: 0;
		transform: translateY(20px)
	}

	to {
		opacity: 1;
		transform: translateY(0)
	}
}

.item:hover {
	transform: translateY(-8px);
	box-shadow: 0 20px 60px rgba(0, 89, 178, .18);
	border-color: #0059b2;
}

/* IMAGE WRAP - show FULL certificate (object-fit: contain) */
.item-img-wrap {
	position: relative;
	overflow: hidden;
	/* height:340px; */
	background: linear-gradient(135deg, #f7faff 0%, #eef4fc 100%);
	padding: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.item-img-wrap a {
	display: flex;
	width: 100%;
	height: 100%;
	align-items: center;
	justify-content: center;
}

.item img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: 360px;
	object-fit: contain;
	display: block;
	transition: transform .6s ease;
}

.item:hover img {
	transform: scale(1.05)
}

.item-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 40%, rgba(0, 89, 178, .85) 100%);
	opacity: 0;
	transition: opacity .4s ease;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	padding: 20px;
	pointer-events: none;
}

.item:hover .item-overlay {
	opacity: 1
}

.zoom-icon {
	width: 55px;
	height: 55px;
	background: #ffd732;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0059b2;
	font-size: 20px;
	transform: scale(0);
	transition: transform .4s ease .1s;
	box-shadow: 0 8px 20px rgba(255, 215, 50, .5);
}

.item:hover .zoom-icon {
	transform: scale(1)
}

.cert-type-badge {
	position: absolute;
	top: 15px;
	left: 15px;
	background: rgba(255, 255, 255, .96);
	backdrop-filter: blur(10px);
	color: #0059b2;
	padding: 5px 12px;
	border-radius: 20px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .8px;
	z-index: 2;
	box-shadow: 0 4px 10px rgba(0, 0, 0, .08);
}

.cert-type-badge.iso {
	background: #ffd732;
	color: #0059b2
}

.cert-type-badge.international {
	background: #0059b2;
	color: #fff
}

.cert-type-badge.european {
	background: #01478d;
	color: #ffd732
}

.cert-type-badge.national {
	background: #0a1929;
	color: #ffd732
}

.cert-type-badge.patent {
	background: #fff;
	color: #0059b2;
	border: 1px solid #ffd732
}

.caption {
	padding: 7px;
	font-weight: 700;
	text-align: center;
	min-height: 80px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0a1929;
	font-size: 15px;
	line-height: 1.4;
	transition: .3s;
	position: relative;
}

.item:hover .caption {
	color: #0059b2
}

.caption::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 0;
	height: 3px;
	background: #ffd732;
	transition: all .4s ease;
	transform: translateX(-50%);
}

.item:hover .caption::after {
	width: 60%
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:991px) {
	.cert-hero-inner {
		grid-template-columns: 1fr;
		gap: 40px
	}

	.cert-hero-right {
		min-height: 280px
	}

	.cert-chip.c5,
	.cert-chip.c6 {
		display: none
	}
}

@media (max-width:768px) {
	.cert-hero {
		padding: 50px 0 80px
	}

	.cert-hero-inner {
		padding: 0 20px
	}

	.cert-stats-inner {
		grid-template-columns: repeat(2, 1fr);
		gap: 15px
	}

	.stat-box {
		border-right: none;
		border-bottom: 1px solid rgba(0, 89, 178, .08);
		padding-bottom: 15px
	}

	.stat-box:nth-child(odd) {
		border-right: 1px solid rgba(0, 89, 178, .08)
	}

	.stat-box:nth-last-child(-n+2) {
		border-bottom: none
	}

	.stat-num {
		font-size: 30px
	}

	.gallery {
		grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
		gap: 20px
	}

	.item-img-wrap {
		height: 280px;
		padding: 14px
	}

	.caption {
		font-size: 13px;
		padding: 14px;
		min-height: 70px
	}

	.cert-cta {
		padding: 14px 22px;
		font-size: 14px
	}

	.filter-btn {
		padding: 9px 16px;
		font-size: 13px
	}
}

@media (max-width:480px) {
	.cert-hero-right .cert-ring.r1 {
		width: 240px;
		height: 240px
	}

	.cert-hero-right .cert-ring.r2 {
		width: 180px;
		height: 180px
	}

	.cert-hero-right .cert-ring.r3 {
		width: 130px;
		height: 130px
	}

	.cert-core {
		width: 96px;
		height: 96px;
		font-size: 34px
	}

	.gallery {
		grid-template-columns: 1fr 1fr;
		gap: 14px
	}

	.item-img-wrap {
		height: 220px;
		padding: 10px
	}

	.cert-type-badge {
		font-size: 9px;
		padding: 3px 8px;
		top: 10px;
		left: 10px
	}

	.caption {
		font-size: 12px;
		min-height: 60px;
		padding: 12px 10px
	}
}




.qmv2-hero {
	position: relative;
	background:
		radial-gradient(900px 600px at 90% 10%, rgba(255, 215, 50, .18), transparent 60%),
		radial-gradient(700px 500px at 5% 90%, rgba(255, 215, 50, .08), transparent 65%),
		linear-gradient(135deg, #031a3d 0%, #0059b2 55%, #0a3d80 100%);
	color: #fff;
	padding: 90px 0 0;
	overflow: hidden;
	isolation: isolate;
}

/* fine engineering grid overlay */
.qmv2-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 0;
	background-image:
		linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
	background-size: 60px 60px;
	mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, #000 50%, transparent 100%);
	-webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, #000 50%, transparent 100%);
}

/* diagonal yellow accent shape */
.qmv2-hero::after {
	content: "";
	position: absolute;
	top: -100px;
	right: -200px;
	width: 520px;
	height: 520px;
	background: radial-gradient(circle at center, rgba(255, 215, 50, .22), transparent 65%);
	filter: blur(20px);
	pointer-events: none;
	z-index: 0;
}

.qmv2-hero-wrap {
	position: relative;
	z-index: 2;
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 40px;
	display: grid;
	grid-template-columns: 1.25fr .9fr;
	gap: 60px;
	align-items: center;
	min-height: 520px;
}

/* LEFT side */
.qmv2-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-family: "Barlow", sans-serif;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 4px;
	text-transform: uppercase;
	color: #ffd732;
	margin-bottom: 28px;
	animation: qmv2-fadeUp .8s ease both;
}

.qmv2-eyebrow .line {
	width: 42px;
	height: 1px;
	background: #ffd732;
	display: inline-block
}

.qmv2-eyebrow .pulse {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #ffd732;
	box-shadow: 0 0 0 4px rgba(255, 215, 50, .18);
	animation: qmv2-pulse 2.4s ease-in-out infinite
}

@keyframes qmv2-pulse {

	0%,
	100% {
		box-shadow: 0 0 0 4px rgba(255, 215, 50, .18)
	}

	50% {
		box-shadow: 0 0 0 10px rgba(255, 215, 50, 0)
	}
}

.qmv2-hero h1 {
	font-family: "Barlow", sans-serif;
	color: #fff !important;
	font-size: clamp(44px, 6.2vw, 86px);
	font-weight: 900;
	line-height: .95;
	letter-spacing: -1.5px;
	margin: 0 0 28px;
	animation: qmv2-fadeUp .9s .1s ease both;
}

.qmv2-hero h1 .row1 {
	display: block
}

.qmv2-hero h1 .row2 {
	display: block;
	color: #ffd732;
	font-style: italic;
	font-weight: 800;
	font-size: .85em;
	letter-spacing: -1px;
	position: relative;
}

.qmv2-hero h1 .row2::before {
	content: "";
	display: inline-block;
	width: 40px;
	height: 4px;
	border-radius: 4px;
	background: #ffd732;
	margin-right: 18px;
	vertical-align: middle;
	transform: translateY(-8px);
}

.qmv2-hero .lead {
	color: #d8e3f4;
	font-size: 18px;
	line-height: 1.75;
	max-width: 620px;
	margin: 0 0 36px;
	animation: qmv2-fadeUp 1s .25s ease both;
}

.qmv2-hero .lead strong {
	color: #fff;
	font-weight: 600;
	border-bottom: 1px dashed rgba(255, 215, 50, .5);
	padding-bottom: 1px
}

.qmv2-cta-group {
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
	align-items: center;
	animation: qmv2-fadeUp 1.1s .4s ease both;
}

.qmv2-cta {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 17px 30px;
	background: #ffd732;
	color: #0a1929 !important;
	border-radius: 6px;
	font-family: "Barlow", sans-serif;
	text-transform: uppercase;
	font-weight: 800;
	font-size: 14px;
	letter-spacing: 1.2px;
	text-decoration: none !important;
	position: relative;
	overflow: hidden;
	transition: transform .3s ease, box-shadow .3s ease;
	box-shadow: 0 14px 30px -10px rgba(255, 215, 50, .55), 0 0 0 1px rgba(255, 215, 50, .4);
}

.qmv2-cta::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(120deg, transparent 30%, rgba(255, 255, 255, .5), transparent 70%);
	transform: translateX(-100%);
	transition: transform .6s ease;
}

.qmv2-cta:hover {
	transform: translateY(-3px);
	box-shadow: 0 22px 40px -12px rgba(255, 215, 50, .7), 0 0 0 1px rgba(255, 215, 50, .6);
	color: #0a1929
}

.qmv2-cta:hover::after {
	transform: translateX(100%)
}

.qmv2-cta svg {
	transition: transform .3s ease
}

.qmv2-cta:hover svg {
	transform: translateX(4px)
}

/* RIGHT side — shield + orbital chips */
.qmv2-hero-art {
	position: relative;
	min-height: 440px;
	display: flex;
	align-items: center;
	justify-content: center;
	animation: qmv2-fadeIn 1.2s .3s ease both;
}

.qmv2-shield {
	position: relative;
	width: 280px;
	height: 280px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qmv2-shield-bg {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background:
		radial-gradient(circle at 35% 30%, rgba(255, 215, 50, .25), rgba(255, 215, 50, .05) 60%, transparent 80%),
		conic-gradient(from 180deg, rgba(255, 215, 50, .5), rgba(255, 255, 255, .05), rgba(255, 215, 50, .5));
	filter: blur(2px);
	animation: qmv2-spin 30s linear infinite;
}

.qmv2-ring {
	position: absolute;
	border-radius: 50%
}

.qmv2-ring.r1 {
	inset: -30px;
	border: 1px dashed rgba(255, 215, 50, .5);
	animation: qmv2-spin 50s linear infinite
}

.qmv2-ring.r2 {
	inset: 10px;
	border: 1px solid rgba(255, 215, 50, .7);
	animation: qmv2-spin 35s linear infinite reverse
}

.qmv2-ring.r3 {
	inset: 40px;
	border: 2px dotted rgba(255, 255, 255, .25);
	animation: qmv2-spin 22s linear infinite
}

.qmv2-core {
	position: relative;
	z-index: 3;
	width: 170px;
	height: 170px;
	border-radius: 50%;
	background:
		radial-gradient(circle at 30% 25%, #fff5b3, #ffd732 45%, #b88f1a 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0a1929;
	box-shadow:
		0 0 0 8px rgba(255, 255, 255, .03),
		0 0 0 14px rgba(255, 215, 50, .08),
		0 40px 80px -10px rgba(255, 215, 50, .5),
		inset 0 -8px 24px rgba(0, 0, 0, .2),
		inset 0 6px 18px rgba(255, 255, 255, .35);
}

.qmv2-core svg {
	filter: drop-shadow(0 3px 6px rgba(0, 0, 0, .35))
}

/* floating certification chips */
.qmv2-orbits {
	position: absolute;
	inset: -20px;
	pointer-events: none
}

.qmv2-orbit {
	position: absolute;
	padding: 9px 16px;
	border-radius: 999px;
	background: rgba(10, 25, 41, .6);
	border: 1px solid #ffd732;
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	color: #fff;
	font-family: "Barlow", sans-serif;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 1px;
	white-space: nowrap;
	box-shadow: 0 8px 20px rgba(0, 0, 0, .3);
	animation: qmv2-float 5s ease-in-out infinite;
}

.qmv2-orbit b {
	color: #ffd732
}

.qmv2-orbit.o1 {
	top: 6%;
	left: -8%;
	animation-delay: 0s
}

.qmv2-orbit.o2 {
	top: 22%;
	right: -12%;
	animation-delay: .6s
}

.qmv2-orbit.o3 {
	bottom: 30%;
	left: -14%;
	animation-delay: 1.2s
}

.qmv2-orbit.o4 {
	bottom: 6%;
	right: -4%;
	animation-delay: 1.8s
}

.qmv2-orbit.o5 {
	top: 50%;
	right: -18%;
	animation-delay: 2.4s
}

.qmv2-orbit.o6 {
	top: 50%;
	left: -18%;
	animation-delay: 3s
}

@keyframes qmv2-float {

	0%,
	100% {
		transform: translateY(0)
	}

	50% {
		transform: translateY(-10px)
	}
}

/* CREDENTIALS STRIP — at bottom of hero */
.qmv2-creds {
	position: relative;
	z-index: 2;
	margin-top: 60px;
	border-top: 1px solid rgba(255, 255, 255, .12);
	border-bottom: 1px solid rgba(255, 255, 255, .12);
	background: rgba(0, 0, 0, .18);
}

.qmv2-creds-inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 22px 40px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
}

.qmv2-creds-label {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: #ffd732;
	font-family: "Barlow", sans-serif;
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 3px;
}

.qmv2-creds-label::before {
	content: "";
	width: 24px;
	height: 1px;
	background: #ffd732
}

.qmv2-creds-items {
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
	align-items: center;
}

.qmv2-creds-items span {
	font-family: "Barlow", sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: #fff;
	letter-spacing: .5px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.qmv2-creds-items span::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #ffd732;
	display: inline-block;
	box-shadow: 0 0 8px rgba(255, 215, 50, .6);
}

@keyframes qmv2-fadeUp {
	from {
		opacity: 0;
		transform: translateY(20px)
	}

	to {
		opacity: 1;
		transform: translateY(0)
	}
}

@keyframes qmv2-fadeIn {
	from {
		opacity: 0
	}

	to {
		opacity: 1
	}
}

@keyframes qmv2-spin {
	from {
		transform: rotate(0)
	}

	to {
		transform: rotate(360deg)
	}
}

/* =========================================================
   2. PROCESS SECTION — Editorial vertical timeline
   ========================================================= */
.qmv2-process {
	padding: 40px 0;
	position: relative;
	overflow: hidden;
}

.qmv2-process::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 1px;
	height: 60px;
	background: linear-gradient(180deg, #ffd732, transparent);
}

.qmv2-process::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image: radial-gradient(rgba(0, 89, 178, .05) 1px, transparent 1px);
	background-size: 24px 24px;
	mask-image: linear-gradient(180deg, #000, transparent 50%);
	-webkit-mask-image: linear-gradient(180deg, #000, transparent 50%);
}

.qmv2-process-inner {
	position: relative;
	z-index: 2;
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 40px;
}

/* Section header */
.qmv2-sec-head {
	text-align: center;
	margin-bottom: 70px
}

.qmv2-sec-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-family: "Barlow", sans-serif;
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	color: #0059b2;
	margin-bottom: 24px;
}

.qmv2-sec-eyebrow .l {
	width: 28px;
	height: 2px;
	background: #ffd732;
	display: inline-block;
	border-radius: 2px
}

.qmv2-process h2.qmv2-h2 {
	font-family: "Barlow", sans-serif;
	font-size: clamp(30px, 4vw, 52px);
	font-weight: 900;
	line-height: 1.1;
	letter-spacing: -1px;
	color: #0a1929;
	max-width: 920px;
	margin: 0 auto 24px;
}

.qmv2-process h2.qmv2-h2 em {
	color: #0059b2;
	font-style: italic;
	font-weight: 800;
	background: linear-gradient(180deg, transparent 60%, rgba(255, 215, 50, .35) 60%);
	padding: 0 4px;
}

.qmv2-process .qmv2-intro {
	color: #475569;
	font-size: 16px;
	line-height: 1.8;
	max-width: 880px;
	margin: 0 auto;
}

.qmv2-sub-head {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	margin: 60px 0 40px;
	font-family: "Barlow", sans-serif;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 4px;
	text-transform: uppercase;
	color: #0059b2;
}

.qmv2-sub-head::before,
.qmv2-sub-head::after {
	content: "";
	flex: 1;
	max-width: 120px;
	height: 1px;
	background: linear-gradient(90deg, transparent, #ffd732, transparent);
}

.qmv2-sub-title {
	font-family: "Barlow", sans-serif;
	font-size: clamp(24px, 2.6vw, 34px);
	font-weight: 800;
	color: #0a1929;
	text-align: center;
	margin: 0 0 30px;
	line-height: 1.25;
}

/* Timeline */
.qmv2-timeline {
	position: relative
}

.qmv2-timeline::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 30px;
	bottom: 30px;
	width: 2px;
	background: linear-gradient(180deg, transparent, #0059b2 8%, #0059b2 92%, transparent);
	transform: translateX(-50%);
	z-index: 0;
}

.qmv2-step {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 80px 1fr;
	gap: 0;
	margin-bottom: 60px;
	align-items: center;
}

.qmv2-step:last-child {
	margin-bottom: 0
}

.qmv2-step-img {
	position: relative;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 30px 60px -20px rgba(0, 89, 178, .3), 0 0 0 1px rgba(0, 89, 178, .08);
	transition: transform .5s ease, box-shadow .5s ease;
}

.qmv2-step-img img {
	width: 100%;
	height: 340px;
	object-fit: cover;
	display: block;
	transition: transform .8s ease;
}

.qmv2-step:hover .qmv2-step-img {
	transform: translateY(-6px);
	box-shadow: 0 40px 80px -20px rgba(0, 89, 178, .4)
}

.qmv2-step:hover .qmv2-step-img img {
	transform: scale(1.06)
}

.qmv2-step-img::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, transparent 60%, rgba(0, 89, 178, .25) 100%);
	pointer-events: none;
}

/* center node with step number */
.qmv2-step-node {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	align-self: start;
	margin-top: 30px;
}

.qmv2-step-num {
	width: 78px;
	height: 78px;
	border-radius: 50%;
	background: #fff;
	border: 3px solid #ffd732;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Barlow", sans-serif;
	font-size: 30px;
	font-weight: 900;
	color: #0059b2;
	box-shadow: 0 18px 36px -8px rgba(0, 89, 178, .3), inset 0 0 0 6px #fff, 0 0 0 8px rgba(255, 215, 50, .15);
	position: relative;
	transition: transform .4s ease;
}

.qmv2-step:hover .qmv2-step-num {
	transform: scale(1.08) rotate(-6deg)
}

.qmv2-step-body {
	padding: 0;
}

.qmv2-step-tag {
	display: inline-block;
	font-family: "Barlow", sans-serif;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 3px;
	text-transform: uppercase;
	color: #fff;
	/*background: rgba(0, 89, 178, .08);*/
	padding: 5px 0px;
	border-radius: 4px;
	margin-bottom: 14px;
}

.qmv2-step-title {
	font-family: "Barlow", sans-serif;
	font-size: clamp(22px, 2.4vw, 30px);
	font-weight: 800;
	line-height: 1.2;
	color: #fff;
	margin: 0 0 16px;
}

.qmv2-step-title::after {
	content: "";
	display: block;
	width: 46px;
	height: 3px;
	border-radius: 3px;
	background: #ffd732;
	margin-top: 14px;
}

.qmv2-step-desc {
	color: #fff;
	font-size: 15px;
	line-height: 1.8;
	margin: 0 0 18px;
}

.qmv2-step-desc strong {
	color: #fff;
	font-weight: 700
}

.qmv2-step-list {
	list-style: none;
	padding: 0;
	margin: 18px 10px;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.qmv2-step-list li {
	position: relative;
	padding: 14px 16px 14px 46px;
	/*background: #fff;*/
	border-radius: 10px;
	border: 1px solid #fff;
	font-size: 14px;
	line-height: 1.7;
	color: #222;
	transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.qmv2-step-list li p{
	color: #fff;
}

.qmv2-step-list li:hover {
	border-color: #0059b2;
	transform: translateX(4px);
	box-shadow: 0 8px 20px -6px rgba(0, 89, 178, .15)
}

.qmv2-step-list li::before {
	content: "";
	position: absolute;
	left: 12px;
	top: 22px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #ffd732;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qmv2-step-list li::after {
	content: "";
	position: absolute;
	left: 19px;
	top: 25px;
	width: 6px;
	height: 10px;
	border: solid #0a1929;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

.qmv2-step-list li strong,
.qmv2-step-list li .lab {
	color: #fff;
	font-weight: 800;
	display: block;
	font-family: "Barlow", sans-serif;
	font-size: 13px;
	letter-spacing: .5px;
	text-transform: uppercase;
	margin-bottom: 4px;
}


.qmv2-step-list .sub-list {
	list-style: none;
	padding: 10px 0 0;
	margin: 10px 0 0;
	border-top: 1px dashed #e2e8f0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.qmv2-step-list .sub-list li {
	background: transparent;
	border: none;
	padding: 4px 0 4px 20px;
	font-size: 14px;
	color: #222;
}

.qmv2-step-list .sub-list li:hover {
	transform: none;
	box-shadow: none
}

.qmv2-step-list .sub-list li::before {
	display: none
}

.qmv2-step-list .sub-list li::after {
	content: "";
	position: absolute;
	left: 6px;
	top: 14px;
	width: 6px;
	height: 1px;
	background: #0059b2;
	border: none;
	transform: none;
}

.qmv2-step-list .sub-list li b {
	color: #0a1929;
	font-weight: 700;
	display: inline
}

/* alternating layout */
.qmv2-step.left {
	grid-template-columns: 1fr 80px 1fr
}

.qmv2-step.left .qmv2-step-img {
	order: 1
}

.qmv2-step.left .qmv2-step-node {
	order: 2
}

.qmv2-step.left .qmv2-step-body {
	order: 3;
	padding-left: 36px;
	background: #0059b2;
    border-radius: 10px;
}

.qmv2-step.right .qmv2-step-img {
	order: 3
}

.qmv2-step.right .qmv2-step-node {
	order: 2
}

.qmv2-step.right .qmv2-step-body {
	order: 1;
	padding-right: 36px;
	text-align: right;
	background: #0059b2;
    border-radius: 10px;
}

.qmv2-step.right .qmv2-step-title::after {
	margin-left: auto
}

.qmv2-step.right .qmv2-step-list li {
	text-align: left
}

/* =========================================================
   3. TESTING METHODS SECTION — Dark premium grid
   ========================================================= */
.qmv2-testing {
	position: relative;
	background: #0059b2;
	padding: 40px 0 60px 0;
	overflow: hidden;
	color: #fff;
}

.qmv2-testing::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		radial-gradient(800px 500px at 10% 0%, rgba(0, 89, 178, .35), transparent 60%),
		radial-gradient(700px 400px at 95% 100%, rgba(255, 215, 50, .10), transparent 60%);
}

.qmv2-testing::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px);
	background-size: 60px 60px;
	mask-image: radial-gradient(ellipse 80% 70% at 50% 50%, #000 0%, transparent 90%);
	-webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 50%, #000 0%, transparent 90%);
}

.qmv2-testing-inner {
	position: relative;
	z-index: 2;
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 40px;
}

.qmv2-testing-head {
	text-align: center;
	margin-bottom: 64px
}

.qmv2-testing-head .qmv2-sec-eyebrow {
	color: #ffd732
}

.qmv2-testing-head .qmv2-sec-eyebrow .l {
	background: #ffd732
}

.qmv2-testing h2.qmv2-test-h2 {
	font-family: "Barlow", sans-serif;
	font-size: clamp(32px, 4vw, 54px);
	font-weight: 900;
	line-height: 1.1;
	color: #fff;
	margin: 0 0 22px;
}

.qmv2-testing h2.qmv2-test-h2 em {
	color: #ffd732;
	font-style: italic;
	font-weight: 800;
}

.qmv2-testing-head p {
	color: #fff;
	font-size: 16px;
	line-height: 1.8;
	max-width: 760px;
	margin: 0 auto;
}

.qmv2-test-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

.qmv2-test-card {
	position: relative;
	background: linear-gradient(160deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .015));
	border: 1px solid rgba(255, 255, 255, .08);
	border-radius: 14px;
	padding: 32px 28px 30px;
	overflow: hidden;
	transition: transform .4s ease, border-color .4s ease, box-shadow .4s ease, background .4s ease;
	cursor: default;
	isolation: isolate;
}

.qmv2-test-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	height: 3px;
	width: 0;
	background: linear-gradient(90deg, #ffd732, #0059b2);
	transition: width .5s cubic-bezier(.2, .8, .2, 1);
	z-index: 2;
}

.qmv2-test-card::after {
	content: "";
	position: absolute;
	inset: auto -40px -40px auto;
	width: 140px;
	height: 140px;
	background: radial-gradient(circle, rgba(255, 215, 50, .15), transparent 70%);
	opacity: 0;
	transition: opacity .5s ease;
	z-index: 0;
}

.qmv2-test-card:hover {
	transform: translateY(-8px);
	border-color: rgba(255, 215, 50, .5);
	background: linear-gradient(160deg, rgba(255, 215, 50, .06), rgba(255, 255, 255, .02));
	box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .5), 0 0 0 1px rgba(255, 215, 50, .25);
}

.qmv2-test-card:hover::before {
	width: 100%
}

.qmv2-test-card:hover::after {
	opacity: 1
}

.qmv2-test-top {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-bottom: 18px;
	position: relative;
	z-index: 1;
}

.qmv2-test-abbr {
	flex-shrink: 0;
	width: 74px;
	height: 74px;
	border-radius: 14px;
	background: linear-gradient(135deg, rgba(255, 215, 50, .18), rgba(255, 215, 50, .05));
	border: 1px solid rgba(255, 215, 50, .35);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Barlow", sans-serif;
	font-size: 35px;
	font-weight: 900;
	color: #ffd732;
	transition: all .35s ease;
	position: relative;
}
.qmv2-test-abbr img{width:55%;}
.qmv2-test-card:hover .qmv2-test-abbr img {
	filter: brightness(0%) contrast(200%) invert(0%) opacity(100%);
}

.qmv2-test-abbr::before {
	content: "";
	position: absolute;
	inset: -3px;
	border-radius: 16px;
	background: linear-gradient(135deg, #ffd732, transparent);
	z-index: -1;
	opacity: 0;
	transition: opacity .35s ease;
}

.qmv2-test-card:hover .qmv2-test-abbr {
	background: #fff;
	color: #0a1929;
	transform: scale(1.05) rotate(-4deg);
	box-shadow: 0 16px 32px -8px rgba(255, 215, 50, .5);
}

.qmv2-test-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 10px;
	background: rgba(255, 255, 255, .06);
	font-size: 20px;
	color: #ffd732;
	font-weight: 500;
	transition: all .35s ease;
}

.qmv2-test-card:hover .qmv2-test-icon {
	background: rgba(255, 215, 50, .12);
	color: #fff;
	transform: rotate(8deg);
}

.qmv2-test-body {
	position: relative;
	z-index: 1;
}

.qmv2-test-name-en {
	font-family: "Barlow", sans-serif;
	font-size: 18px;
	font-weight: 800;
	color: #fff;
	text-transform: uppercase;
	line-height: 1.35;
	margin: 0 0 4px;
}

.qmv2-test-name-cn {
	font-size: 12.5px;
	color: #8a9bb6;
	font-weight: 400;
	line-height: 1.5;
}

.qmv2-test-card:hover .qmv2-test-name-en {
	color: #ffd732
}

/* =========================================================
   4. KILL OLD STYLES that would conflict
   ========================================================= */
.quality-main-sec.about-two,
section.quality-main-sec {
	padding: 0 !important;
	background: transparent !important
}

.quality-main-sec::before {
	display: none
}

.quality-testing-sec {
	padding: 0 !important;
	background: transparent !important
}

.quality-testing-sec::before,
.quality-testing-sec::after {
	display: none
}

/* =========================================================
   5. RESPONSIVE
   ========================================================= */
@media (max-width:1100px) {
	.qmv2-hero-wrap {
		grid-template-columns: 1.1fr .9fr;
		gap: 40px
	}

	.qmv2-test-grid {
		grid-template-columns: repeat(2, 1fr)
	}
}

@media (max-width:900px) {
	.qmv2-hero {
		padding: 70px 0 0
	}

	.qmv2-hero-wrap {
		grid-template-columns: 1fr;
		gap: 50px;
		padding: 0 24px
	}

	.qmv2-hero-art {
		min-height: 380px
	}

	.qmv2-creds-inner {
		padding: 18px 24px;
		flex-direction: column;
		text-align: center
	}

	.qmv2-process {
		padding: 80px 0
	}

	.qmv2-process-inner {
		padding: 0 24px
	}

	.qmv2-timeline::before {
		left: 38px
	}

	.qmv2-step {
		grid-template-columns: 80px 1fr;
		gap: 0
	}

	.qmv2-step.left .qmv2-step-img,
	.qmv2-step.right .qmv2-step-img {
		order: 3;
		grid-column: 1/-1;
		margin-top: 24px
	}

	.qmv2-step.left .qmv2-step-node,
	.qmv2-step.right .qmv2-step-node {
		order: 1;
		grid-column: 1;
		margin-top: 0
	}

	.qmv2-step.left .qmv2-step-body,
	.qmv2-step.right .qmv2-step-body {
		order: 2;
		grid-column: 2;
		padding: 0 0 0 24px;
		text-align: left
	}

	.qmv2-step.right .qmv2-step-title::after {
		margin-left: 0
	}

	.qmv2-step-img img {
		height: 240px
	}

	.qmv2-testing {
		padding: 80px 0
	}

	.qmv2-testing-inner {
		padding: 0 24px
	}

	.qmv2-test-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 18px
	}
}

@media (max-width:580px) {
	.qmv2-hero {
		padding: 60px 0 0
	}

	.qmv2-hero-wrap {
		padding: 0 20px;
		gap: 36px
	}

	.qmv2-hero h1 {
		font-size: 42px
	}

	.qmv2-hero .lead {
		font-size: 16px
	}

	.qmv2-cta {
		padding: 14px 22px;
		font-size: 13px
	}

	.qmv2-creds-items {
		gap: 18px;
		justify-content: center
	}

	.qmv2-shield {
		width: 220px;
		height: 220px
	}

	.qmv2-core {
		width: 130px;
		height: 130px
	}

	.qmv2-orbit {
		font-size: 11px;
		padding: 6px 12px
	}

	.qmv2-process {
		padding: 60px 0
	}

	.qmv2-process h2.qmv2-h2 {
		font-size: 28px
	}

	.qmv2-step.left {
		grid-template-columns: 1fr;
	}

	.qmv2-step {
		grid-template-columns: 1fr;
		gap: 14px
	}

	.qmv2-timeline::before {
		display: none
	}

	.qmv2-step.left .qmv2-step-img,
	.qmv2-step.right .qmv2-step-img,
	.qmv2-step.left .qmv2-step-body,
	.qmv2-step.right .qmv2-step-body,
	.qmv2-step.left .qmv2-step-node,
	.qmv2-step.right .qmv2-step-node {
		grid-column: 1;
		padding: 0
	}

	.qmv2-step.left .qmv2-step-node,
	.qmv2-step.right .qmv2-step-node {
		margin: 0 0 6px;
		justify-content: flex-start
	}

	.qmv2-step-num {
		width: 60px;
		height: 60px;
		font-size: 22px
	}

	.qmv2-step-img img {
		height: 200px
	}

	.qmv2-testing {
		padding: 60px 0
	}

	.qmv2-testing h2.qmv2-test-h2 {
		font-size: 30px
	}

	.qmv2-test-grid {
		grid-template-columns: 1fr;
		gap: 14px
	}

	.qmv2-test-card {
		padding: 24px 22px
	}

	.qmv2-test-abbr {
		width: 60px;
		height: 60px;
		font-size: 20px
	}
}

/* =========================================================
   HERO — History-Page Style (replaces qmv2-hero look)
   ========================================================= */
.psc-redesign {
	font-family: 'Rubik', 'Barlow', system-ui, -apple-system, sans-serif;
	color: #0f172a;
	-webkit-font-smoothing: antialiased
}

.psc-redesign * {
	box-sizing: border-box
}

.psc-hero {
	position: relative;
	background:
		radial-gradient(1200px 500px at 85% 0%, rgba(56, 189, 248, .18), transparent 60%),
		radial-gradient(900px 400px at 10% 100%, rgba(14, 165, 233, .14), transparent 60%),
		linear-gradient(135deg, #0059b2 0%, #0059b2 45%, #0059b2 100%);
	color: #fff;
	padding: 60px 0;
	overflow: hidden;
}

.psc-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(125, 211, 252, .06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(125, 211, 252, .06) 1px, transparent 1px);
	background-size: 48px 48px;
	mask-image: radial-gradient(ellipse at center, #000 40%, transparent 85%);
	-webkit-mask-image: radial-gradient(ellipse at center, #000 40%, transparent 85%);
}

.psc-hero-inner {
	position: relative;
	z-index: 2;
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 30px;
	display: grid;
	grid-template-columns: 1.4fr .8fr;
	gap: 50px;
	align-items: center;
}

.psc-hero-left {
	min-width: 0
}

.psc-tag {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 16px;
	background: rgba(255, 215, 50, .12);
	border: 1px solid rgba(255, 215, 50, .5);
	border-radius: 999px;
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	text-transform: uppercase;
	margin-bottom: 22px;
}

.psc-tag .dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #ffd732;
	box-shadow: 0 0 12px rgba(255, 215, 50, .9);
	animation: psc-pulse 2s ease-in-out infinite;
}

@keyframes psc-pulse {

	0%,
	100% {
		opacity: 1
	}

	50% {
		opacity: .35
	}
}

.psc-redesign h1 {
	font-family: 'Barlow', sans-serif;
	color: #fff !important;
	font-size: clamp(38px, 5.4vw, 68px);
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -.02em;
	margin: 0 0 22px;
}

.psc-redesign h1 .accent {
	color: #ffd732
}

.psc-redesign h1::after {
	content: "";
	display: block;
	width: 80px;
	height: 4px;
	border-radius: 4px;
	margin-top: 22px;
	background: linear-gradient(90deg, #ffd732, transparent);
}

.psc-hero p {
	color: #cbd5e1;
	font-size: 17px;
	line-height: 1.75;
	max-width: 640px;
	margin: 0;
}

.psc-hero p strong {
	color: #fff;
	font-weight: 600
}

.psc-hero-right {
	position: relative;
	min-height: 300px;
	display: flex;
	align-items: center;
	justify-content: center
}

.psc-ring {
	position: absolute;
	border-radius: 50%;
	border: 1px dashed rgba(255, 215, 50, .8);
}

.psc-ring.r1 {
	width: 300px;
	height: 300px;
	animation: psc-spin 38s linear infinite
}

.psc-ring.r2 {
	width: 230px;
	height: 230px;
	border-style: solid;
	border-color: rgba(255, 215, 50, .8);
	animation: psc-spin 24s linear infinite reverse
}

.psc-ring.r3 {
	width: 160px;
	height: 160px;
	border-style: dotted;
	border-color: rgba(255, 215, 50, .8);
	animation: psc-spin 18s linear infinite
}

.psc-core {
	position: relative;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #ffe572, #ffd732 50%, #b88f00 100%);
	box-shadow:
		0 0 0 6px rgba(255, 255, 255, .04),
		0 0 0 10px rgba(255, 215, 50, .12),
		0 30px 60px -10px rgba(255, 215, 50, .55),
		inset 0 0 30px rgba(0, 0, 0, .25);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0059b2;
	font-size: 42px;
}

.psc-core .seal-icon {
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .25));
}

@keyframes psc-spin {
	from {
		transform: rotate(0)
	}

	to {
		transform: rotate(360deg)
	}
}

.psc-chips {
	position: absolute;
	inset: 0;
	pointer-events: none
}

.psc-chip {
	position: absolute;
	padding: 7px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .06);
	border: 1px solid #ffd732;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
	letter-spacing: .4px;
}

.psc-chip.c1 {
	top: 6%;
	left: -2%
}

.psc-chip.c2 {
	top: 18%;
	right: -6%
}

.psc-chip.c3 {
	bottom: 10%;
	left: -4%
}

.psc-chip.c4 {
	bottom: 4%;
	right: 4%
}

.psc-chip.c5 {
	top: 48%;
	right: -8%
}

.psc-chip.c6 {
	top: 50%;
	left: -8%
}

@media (max-width:1100px) {
	.psc-hero-inner {
		padding: 0 24px
	}
}

@media (max-width:991px) {
	.psc-hero {
		padding: 70px 0 90px
	}

	.psc-hero-inner {
		grid-template-columns: 1fr;
		gap: 40px;
		text-align: left
	}

	.psc-hero-right {
		min-height: 280px
	}

	.psc-chip.c5,
	.psc-chip.c6 {
		display: none
	}

	.psc-hero p {
		max-width: none
	}
}

@media (max-width:768px) {
	.psc-hero {
		padding: 56px 0 76px
	}

	.psc-hero-inner {
		padding: 0 20px;
		gap: 36px
	}

	.psc-tag {
		font-size: 10px;
		padding: 7px 14px;
		letter-spacing: .16em;
		margin-bottom: 18px
	}

	.psc-redesign h1 {
		font-size: clamp(34px, 7vw, 48px);
		margin-bottom: 18px
	}

	.psc-redesign h1::after {
		width: 60px;
		height: 3px;
		margin-top: 18px
	}

	.psc-hero p {
		font-size: 15px;
		line-height: 1.7
	}

	.psc-hero-right {
		min-height: 240px
	}
}

@media (max-width:600px) {
	.psc-hero {
		padding: 48px 0 64px
	}

	.psc-hero-inner {
		padding: 0 16px;
		gap: 28px
	}

	.psc-redesign h1 {
		font-size: clamp(30px, 8vw, 40px)
	}

	.psc-tag {
		flex-wrap: wrap;
		line-height: 1.4;
		font-size: 9.5px
	}
}

@media (max-width:480px) {
	.psc-hero-right {
		min-height: 220px
	}

	.psc-hero-right .psc-ring.r1 {
		width: 240px;
		height: 240px
	}

	.psc-hero-right .psc-ring.r2 {
		width: 180px;
		height: 180px
	}

	.psc-hero-right .psc-ring.r3 {
		width: 130px;
		height: 130px
	}

	.psc-core {
		width: 96px;
		height: 96px;
		font-size: 34px
	}

	.psc-core .seal-icon {
		width: 38px;
		height: 38px
	}

	.psc-chip {
		font-size: 11px;
		padding: 5px 10px;
		letter-spacing: .2px
	}
}

@media (max-width:380px) {
	.psc-hero-right {
		min-height: 200px
	}

	.psc-hero-right .psc-ring.r1 {
		width: 200px;
		height: 200px
	}

	.psc-hero-right .psc-ring.r2 {
		width: 150px;
		height: 150px
	}

	.psc-hero-right .psc-ring.r3 {
		width: 110px;
		height: 110px
	}

	.psc-core {
		width: 80px;
		height: 80px
	}

	.psc-core .seal-icon {
		width: 32px;
		height: 32px
	}

	.psc-chip.c3,
	.psc-chip.c4 {
		display: none
	}
}








/*  */
#xtd-history {
	--xh-bg: #f5f7f9;
	--xh-bg-2: #ffffff;
	--xh-card: #ffffff;
	--xh-border: #e3e7ec;
	--xh-border-2: #d3d9e0;
	--xh-ink: #0059b2;
	/* primary brand royal blue */
	--xh-ink-2: #01478d;
	/* deep brand blue */
	--xh-text: #222222;
	--xh-muted: #222222;
	--xh-accent: #0059b2;
	/* brand royal blue (was red #c8202b) */
	--xh-accent-2: #01478d;
	/* deep brand blue (was darker red) */
	--xh-yellow: #ffd732;
	/* brand yellow accent */
	--xh-yellow-2: #f59e0b;
}

#xtd-history *,
#xtd-history *::before,
#xtd-history *::after {
	box-sizing: border-box;
}

#xtd-history img {
	max-width: 100%;
	height: auto;
	display: block;
}

/* ===== Section frame ===== */
#xtd-history {
	padding: 50px 0;
	position: relative;
}

/* ===== Top header ===== */
#xtd-history .xh-section-head {
	text-align: center;
	max-width: 760px;
	margin: 0 auto 56px;
}

#xtd-history .xh-eyebrow {
	display: inline-block;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--xh-accent);
	margin-bottom: 14px;
	position: relative;
	padding: 0 28px;
}

#xtd-history .xh-eyebrow::before,
#xtd-history .xh-eyebrow::after {
	content: "";
	position: absolute;
	top: 50%;
	width: 18px;
	height: 2px;
	background: var(--xh-accent);
}

#xtd-history .xh-eyebrow::before {
	left: 0;
}

#xtd-history .xh-eyebrow::after {
	right: 0;
}

#xtd-history .xh-section-head h2 {
	font-family: 'Barlow', sans-serif;
	font-size: clamp(28px, 3.4vw, 42px);
	font-weight: 800;
	line-height: 1.15;
	color: #0f172a;
	margin: 0 0 16px;
	
}

#xtd-history .xh-section-head p {
	font-size: 16px;
	line-height: 1.7;
	color: #222;
	font-family: "Rubik", sans-serif;
	margin: 0;
}

/* ===== 2-column layout ===== */
#xtd-history .xh-shell {
	display: grid;
	grid-template-columns: 240px 1fr;
	gap: 60px;
	align-items: flex-start;
}

/* ===== Sticky Year Navigator ===== */
#xtd-history .xh-nav {
	position: sticky;
	top: 100px;
	align-self: start;
}

#xtd-history .xh-nav-label {
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	color: var(--xh-muted);
	margin: 0 0 16px;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--xh-ink);
}

#xtd-history .xh-nav-list {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}

#xtd-history .xh-nav-list::before {
	content: "";
	position: absolute;
	left: 6px;
	top: 6px;
	bottom: 6px;
	width: 2px;
	background: var(--xh-border);
}

#xtd-history .xh-nav-item {
	position: relative;
	margin: 0;
}

#xtd-history .xh-nav-link {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 9px 0 9px 22px;
	color: var(--xh-muted);
	text-decoration: none;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .02em;
	position: relative;
	transition: color .25s ease;
}

#xtd-history .xh-nav-link::before {
	content: "";
	position: absolute;
	left: 2px;
	top: 50%;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--xh-card);
	border: 2px solid var(--xh-border);
	transform: translateY(-50%);
	transition: background .25s, border-color .25s, transform .25s;
}

#xtd-history .xh-nav-link .xh-nav-tag {
	font-size: 13px;
	font-weight: 500;
	text-transform: uppercase;
	color: var(--xh-muted);
	opacity: 0;
	transform: translateX(-6px);
	transition: opacity .25s, transform .25s;
}

#xtd-history .xh-nav-link:hover {
	color: var(--xh-ink);
}

#xtd-history .xh-nav-link:hover::before {
	border-color: var(--xh-ink);
}

#xtd-history .xh-nav-item.is-active .xh-nav-link {
	color: var(--xh-accent);
	font-weight: 700;
}

#xtd-history .xh-nav-item.is-active .xh-nav-link::before {
	background: var(--xh-yellow);
	border-color: var(--xh-accent);
	transform: translateY(-50%) scale(1.25);
	box-shadow: 0 0 0 4px rgba(0, 89, 178, .18), 0 0 12px rgba(255, 215, 50, .6);
}

#xtd-history .xh-nav-item.is-active .xh-nav-link .xh-nav-tag {
	opacity: 1;
	transform: translateX(0);
	color: var(--xh-accent);
}

/* ===== Content Stream ===== */
#xtd-history .xh-stream {
	background: var(--xh-card);
	border: 1px solid var(--xh-border);
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 8px 30px -12px rgba(15, 37, 64, .12);
}

#xtd-history .xh-stream-header {
	padding: 20px 32px;
	background: linear-gradient(135deg, #0059b2 0%, #01478d 100%);
	color: #fff;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 15px;
	font-weight: 500;
	text-transform: uppercase;
}

#xtd-history .xh-stream-header .right {
	display: flex;
	gap: 14px;
	align-items: center;
	color: rgba(255, 215, 50, .9);
}

#xtd-history .xh-stream-header .right .dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--xh-yellow);
	box-shadow: 0 0 0 4px rgba(255, 215, 50, .25);
	animation: xhPulse 2s ease-in-out infinite;
}

@keyframes xhPulse {

	0%,
	100% {
		box-shadow: 0 0 0 4px rgba(255, 215, 50, .25);
	}

	50% {
		box-shadow: 0 0 0 8px rgba(255, 215, 50, .05);
	}
}

/* ===== Each milestone entry ===== */
#xtd-history .xh-entry {
	padding: 40px 36px;
	border-bottom: 1px solid var(--xh-border);
	scroll-margin-top: 110px;
	position: relative;
	transition: background .35s ease;
}

#xtd-history .xh-entry:last-child {
	border-bottom: 0;
}

#xtd-history .xh-entry:hover {
	background: #fafbfc;
}

#xtd-history .xh-entry-head {
	display: flex;
	align-items: center;
	gap: 18px;
	margin-bottom: 18px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--xh-border);
}

#xtd-history .xh-entry-num {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .18em;
	color: var(--xh-muted);
	min-width: 36px;
}

#xtd-history .xh-entry-year {
	font-family: 'Barlow', sans-serif;
	font-size: clamp(36px, 4vw, 52px);
	font-weight: 800;
	background: linear-gradient(135deg, #0059b2 0%, #01478d 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	line-height: 1;
	letter-spacing: -.02em;
	position: relative;
	padding-right: 22px;
}

#xtd-history .xh-entry-year::after {
	content: "";
	position: absolute;
	right: 0;
	top: 14%;
	bottom: 14%;
	width: 1px;
	background: var(--xh-border-2);
}

#xtd-history .xh-entry-tag {
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	color: var(--xh-accent);
	padding: 6px 12px;
	background: var(--xh-yellow);
	border-radius: 100px;
	margin-left: 4px;
}

#xtd-history .xh-entry-meta {
	margin-left: auto;
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
	color: var(--xh-muted);
}

#xtd-history .xh-entry-body {
	display: grid;
	grid-template-columns: 1fr;
	gap: 24px;
}

#xtd-history .xh-entry-body.has-image {
	grid-template-columns: 280px 1fr;
}

#xtd-history .xh-entry-image {
	position: relative;
	background: var(--xh-bg);
	border-radius: 10px;
	overflow: hidden;
	border: 1px solid var(--xh-border);
}

#xtd-history .xh-entry-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	aspect-ratio: 4 / 4;
	transition: transform .7s ease;
}

#xtd-history .xh-entry-image:hover img {
	transform: scale(1.04);
}

#xtd-history .xh-entry-image .cap {
	position: absolute;
	left: 0;
	bottom: 0;
	right: 0;
	background: linear-gradient(180deg, transparent, rgba(20, 33, 61, .85));
	color: #fff;
	padding: 24px 14px 12px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
}

#xtd-history .xh-entry-text p {
	font-size: 16px;
	line-height: 1.7;
	color: var(--xh-text);
	margin: 0 0 14px;
	font-weight: 400;
}

#xtd-history .xh-entry-text p:last-child {
	margin-bottom: 0;
}

#xtd-history .xh-entry-text p+p {
	padding-top: 14px;
	border-top: 1px dashed var(--xh-border);
}

/* ===== Footer of stream ===== */
#xtd-history .xh-stream-end {
	padding: 28px 32px;
	background: linear-gradient(135deg, #fafbfc 0%, #fffbeb 100%);
	border-top: 3px solid var(--xh-yellow);
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--xh-muted);
}

#xtd-history .xh-stream-end .accent {
	color: var(--xh-accent);
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

#xtd-history .xh-stream-end .accent::before {
	content: "";
	width: 24px;
	height: 2px;
	background: var(--xh-accent);
}

/* ===== Responsive ===== */
@media (max-width: 980px) {
	#xtd-history .xh-shell {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	#xtd-history .xh-nav {
		position: static;
		top: auto;
		background: var(--xh-card);
		border: 1px solid var(--xh-border);
		border-radius: 4px;
		padding: 18px 20px;
		overflow-x: auto;
	}

	#xtd-history .xh-nav-list {
		display: flex;
		overflow-x: auto;
		gap: 4px;
		padding-bottom: 4px;
		scrollbar-width: thin;
	}

	#xtd-history .xh-nav-list::before {
		display: none;
	}

	#xtd-history .xh-nav-item {
		flex: 0 0 auto;
	}

	#xtd-history .xh-nav-link {
		padding: 8px 14px;
		border: 1px solid var(--xh-border);
		border-radius: 100px;
		background: var(--xh-card);
	}

	#xtd-history .xh-nav-link::before {
		display: none;
	}

	#xtd-history .xh-nav-link .xh-nav-tag {
		display: none;
	}

	#xtd-history .xh-nav-item.is-active .xh-nav-link {
		background: var(--xh-accent);
		color: #fff;
		border-color: var(--xh-accent);
	}
}

@media (max-width: 720px) {
	#xtd-history .xh-section {
		padding: 56px 0 70px;
	}

	#xtd-history .xh-section-head {
		margin-bottom: 36px;
	}

	#xtd-history .xh-stream-header {
		padding: 14px 20px;
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
		font-size: 10px;
	}

	#xtd-history .xh-entry {
		padding: 28px 22px;
	}

	#xtd-history .xh-entry-head {
		flex-wrap: wrap;
		gap: 12px;
		align-items: center;
	}

	#xtd-history .xh-entry-meta {
		margin-left: 0;
		width: 100%;
		order: 5;
	}

	#xtd-history .xh-entry-body.has-image {
		grid-template-columns: 1fr;
	}

	#xtd-history .xh-entry-image {
		max-width: 360px;
	}

	#xtd-history .xh-stream-end {
		padding: 20px 22px;
		flex-direction: column;
		gap: 10px;
		align-items: flex-start;
	}
}

@media (prefers-reduced-motion: reduce) {

	#xtd-history *,
	#xtd-history *::before,
	#xtd-history *::after {
		animation-duration: .001s !important;
		transition-duration: .001s !important;
		scroll-behavior: auto !important;
	}
}

html {
	scroll-behavior: smooth;
}

</style><style>

/* ============================================================
   PSC HERO (matches pipe-size-chart header style)
============================================================ */
.psc-redesign {
	font-family: 'Rubik', 'Barlow', system-ui, -apple-system, sans-serif;
	color: #0f172a;
	-webkit-font-smoothing: antialiased
}

.psc-redesign * {
	box-sizing: border-box
}

/* ---------- HERO STRIP ---------- */
.psc-hero {
	position: relative;
	background:
		radial-gradient(1200px 500px at 85% 0%, rgba(56, 189, 248, .18), transparent 60%),
		radial-gradient(900px 400px at 10% 100%, rgba(14, 165, 233, .14), transparent 60%),
		linear-gradient(135deg, #0059b2 0%, #0059b2 45%, #0059b2 100%);
	color: #fff;
	padding: 60px 0;
	overflow: hidden;
}

.psc-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(125, 211, 252, .06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(125, 211, 252, .06) 1px, transparent 1px);
	background-size: 48px 48px;
	mask-image: radial-gradient(ellipse at center, #000 40%, transparent 85%);
	-webkit-mask-image: radial-gradient(ellipse at center, #000 40%, transparent 85%);
}

.psc-hero-inner {
	position: relative;
	z-index: 2;
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 30px;
	display: grid;
	grid-template-columns: 1.4fr .8fr;
	gap: 50px;
	align-items: center;
}

.psc-hero-left {
	min-width: 0
}

.psc-tag {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 16px;
	background: rgba(255, 215, 50, .12);
	border: 1px solid rgba(255, 215, 50, .5);
	border-radius: 999px;
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	text-transform: uppercase;
	margin-bottom: 22px;
}

.psc-tag .dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #ffd732;
	box-shadow: 0 0 12px rgba(255, 215, 50, .9);
	animation: psc-pulse 2s ease-in-out infinite;
}

@keyframes psc-pulse {

	0%,
	100% {
		opacity: 1
	}

	50% {
		opacity: .35
	}
}

.psc-redesign h1 {
	font-family: 'Barlow', sans-serif;
	color: #fff !important;
	font-size: clamp(38px, 5.4vw, 68px);
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -.02em;
	margin: 0 0 22px;
}

.psc-redesign h1 .accent {
	color: #ffd732
}

.psc-redesign h1::after {
	content: "";
	display: block;
	width: 80px;
	height: 4px;
	border-radius: 4px;
	margin-top: 22px;
	background: linear-gradient(90deg, #ffd732, transparent);
}

.psc-hero p {
	color: #cbd5e1;
	font-size: 17px;
	line-height: 1.75;
	max-width: 640px;
	margin: 0;
}

.psc-hero p strong {
	color: #fff;
	font-weight: 600
}

/* ---------- HERO RIGHT: animated rings ---------- */
.psc-hero-right {
	position: relative;
	min-height: 300px;
	display: flex;
	align-items: center;
	justify-content: center
}

.psc-ring {
	position: absolute;
	border-radius: 50%;
	border: 1px dashed rgba(255, 215, 50, .8);
}

.psc-ring.r1 {
	width: 300px;
	height: 300px;
	animation: psc-spin 38s linear infinite
}

.psc-ring.r2 {
	width: 230px;
	height: 230px;
	border-style: solid;
	border-color: rgba(255, 215, 50, .8);
	animation: psc-spin 24s linear infinite reverse
}

.psc-ring.r3 {
	width: 160px;
	height: 160px;
	border-style: dotted;
	border-color: rgba(255, 215, 50, .8);
	animation: psc-spin 18s linear infinite
}

.psc-core {
	position: relative;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #ffe572, #ffd732 50%, #b88f00 100%);
	box-shadow:
		0 0 0 6px rgba(255, 255, 255, .04),
		0 0 0 10px rgba(255, 215, 50, .12),
		0 30px 60px -10px rgba(255, 215, 50, .55),
		inset 0 0 30px rgba(0, 0, 0, .25);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0059b2;
	font-size: 42px;
}

.psc-core .seal-icon {
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .25));
}

@keyframes psc-spin {
	from {
		transform: rotate(0)
	}

	to {
		transform: rotate(360deg)
	}
}

/* Floating chips around the core */
.psc-chips {
	position: absolute;
	inset: 0;
	pointer-events: none
}

.psc-chip {
	position: absolute;
	padding: 7px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .06);
	border: 1px solid #ffd732;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
	letter-spacing: .4px;
}

.psc-chip.c1 {
	top: 6%;
	left: -2%
}

.psc-chip.c2 {
	top: 18%;
	right: -6%
}

.psc-chip.c3 {
	bottom: 10%;
	left: -4%
}

.psc-chip.c4 {
	bottom: 4%;
	right: 4%
}

.psc-chip.c5 {
	top: 48%;
	right: -8%
}

.psc-chip.c6 {
	top: 50%;
	left: -8%
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1100px) {
	.psc-hero-inner {
		padding: 0 24px
	}
}

@media (max-width:991px) {
	.psc-hero {
		padding: 70px 0 90px
	}

	.psc-hero-inner {
		grid-template-columns: 1fr;
		gap: 40px;
		text-align: left
	}

	.psc-hero-right {
		min-height: 280px
	}

	.psc-chip.c5,
	.psc-chip.c6 {
		display: none
	}

	.psc-hero p {
		max-width: none
	}
}

@media (max-width:768px) {
	.psc-hero {
		padding: 56px 0 76px
	}

	.psc-hero-inner {
		padding: 0 20px;
		gap: 36px
	}

	.psc-tag {
		font-size: 10px;
		padding: 7px 14px;
		letter-spacing: .16em;
		margin-bottom: 18px
	}

	.psc-redesign h1 {
		font-size: clamp(34px, 7vw, 48px);
		margin-bottom: 18px
	}

	.psc-redesign h1::after {
		width: 60px;
		height: 3px;
		margin-top: 18px
	}

	.psc-hero p {
		font-size: 15px;
		line-height: 1.7
	}

	.psc-hero-right {
		min-height: 240px
	}
}

@media (max-width:600px) {
	.psc-hero {
		padding: 48px 0 64px
	}

	.psc-hero-inner {
		padding: 0 16px;
		gap: 28px
	}

	.psc-redesign h1 {
		font-size: clamp(30px, 8vw, 40px)
	}

	.psc-tag {
		flex-wrap: wrap;
		line-height: 1.4;
		font-size: 9.5px
	}
}

@media (max-width:480px) {
	.psc-hero-right {
		min-height: 220px
	}

	.psc-hero-right .psc-ring.r1 {
		width: 240px;
		height: 240px
	}

	.psc-hero-right .psc-ring.r2 {
		width: 180px;
		height: 180px
	}

	.psc-hero-right .psc-ring.r3 {
		width: 130px;
		height: 130px
	}

	.psc-core {
		width: 96px;
		height: 96px;
		font-size: 34px
	}

	.psc-core .seal-icon {
		width: 38px;
		height: 38px
	}

	.psc-chip {
		font-size: 11px;
		padding: 5px 10px;
		letter-spacing: .2px
	}
}

@media (max-width:380px) {
	.psc-hero-right {
		min-height: 200px
	}

	.psc-hero-right .psc-ring.r1 {
		width: 200px;
		height: 200px
	}

	.psc-hero-right .psc-ring.r2 {
		width: 150px;
		height: 150px
	}

	.psc-hero-right .psc-ring.r3 {
		width: 110px;
		height: 110px
	}

	.psc-core {
		width: 80px;
		height: 80px
	}

	.psc-core .seal-icon {
		width: 32px;
		height: 32px
	}

	.psc-chip.c3,
	.psc-chip.c4 {
		display: none
	}
}



/*  */
:root {
	--xtd-navy: #1770c9;
	--xtd-navy-2: #13314f;
	--xtd-steel: #1e3a5f;
	--xtd-accent: #132986;
	--xtd-accent-2: #132986;
	--xtd-accent-3: #ffd732;
	--xtd-ink: #0f172a;
	--xtd-muted: #475569;
	--xtd-line: #e2e8f0;
	--xtd-bg: #f8fafc;
	--xtd-bg-2: #f1f5f9;
	--xtd-white: #ffffff;
}

.xtd2-hero {
	position: relative;
	padding: 50px 0;
	background: #0059b2;
	color: #fff;
	overflow: hidden;
}

.xtd2-hero .auto-container {
	position: relative;
	z-index: 2
}

.xtd2-hero-grid {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 80px;
	align-items: end;
}

.xtd2-hero-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-family: 'Rubik', sans-serif;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .32em;
	text-transform: uppercase;
	color: var(--xtd-accent-2);
	margin-bottom: 32px;
}

.xtd2-hero-eyebrow::before {
	content: "";
	width: 48px;
	height: 1px;
	background: currentColor;
}

.xtd2-hero h1 {
	font-family: 'Barlow', sans-serif;
	font-weight: 800;
	font-size: clamp(56px, 7.5vw, 110px);
	line-height: .94;
	letter-spacing: -.025em;
	margin: 0;
	color: #fff;
}

.xtd2-hero h1 .xtd2-hero-line-2 {
	display: block;
	font-style: italic;
	font-weight: 400;
	background: linear-gradient(135deg, var(--xtd-accent-2) 0%, var(--xtd-accent) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

.xtd2-hero-tag {
	display: block;
	margin-top: 30px;
	max-width: 520px;
	font-family: 'Rubik', sans-serif;
	font-size: 16px;
	line-height: 1.7;
	color: rgba(255, 255, 255, .72);
	font-weight: 400;
}

.xtd2-hero-spec {
	position: relative;
	background: rgba(255, 255, 255, .04);
	border: 1px solid rgba(255, 255, 255, .12);
	border-left: 3px solid var(--xtd-accent-2);
	padding: 34px 32px;
	border-radius: 4px;
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}

.xtd2-hero-spec-label {
	font-family: 'Rubik', sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .3em;
	text-transform: uppercase;
	color: var(--xtd-accent-2);
	margin-bottom: 22px;
	display: flex;
	align-items: center;
	gap: 12px;
}

.xtd2-hero-spec-label::before {
	content: "";
	width: 24px;
	height: 1px;
	background: currentColor
}

.xtd2-hero-spec-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding: 14px 0;
	border-bottom: 1px dashed rgba(255, 255, 255, .12);
}

.xtd2-hero-spec-row:last-child {
	border-bottom: 0
}

.xtd2-hero-spec-key {
	font-family: 'Rubik', sans-serif;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .6);
}

.xtd2-hero-spec-val {
	font-family: 'Barlow', sans-serif;
	font-weight: 800;
	font-size: 22px;
	color: #fff;
	letter-spacing: -.01em;
}

.xtd2-hero-spec-val small {
	font-size: .55em;
	color: var(--xtd-accent-2);
	margin-left: 4px;
	font-weight: 600;
}

.xtd2-hero-crumb {
	margin-top: 44px;
	font-family: 'Rubik', sans-serif;
	font-size: 13px;
	color: rgba(255, 255, 255, .55);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.xtd2-hero-crumb a {
	color: #fff;
	text-decoration: none;
	transition: color .3s ease
}

.xtd2-hero-crumb a:hover {
	color: var(--xtd-accent-2)
}

.xtd2-hero-crumb .xtd2-sep {
	margin: 0 12px;
	color: rgba(255, 255, 255, .3)
}

/* ===== Global Re-Design Tokens ===== */
.xtd2-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-family: 'Rubik', sans-serif;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	color: #0059b2;
}

.xtd2-eyebrow::before {
	content: "";
	display: block;
	width: 42px;
	height: 1px;
	background: currentColor;
}

.xtd2-section--dark .xtd2-eyebrow {
	color: var(--xtd-accent-3)
}

.xtd2-display {
	font-family: 'Barlow', sans-serif;
	font-weight: 800;
	font-size: clamp(30px, 3.6vw, 48px);
	line-height: 1.08;
	color: var(--xtd-ink);
	margin: 18px 0;
}

.xtd2-display em {
	font-style: italic;
	font-weight: 800;
	color: #0059b2;
}

.xtd2-section--dark .xtd2-display {
	color: #fff
}

/* ===== Section Base ===== */
.xtd2-section {
	padding: 50px 0;
	position: relative;
	overflow: hidden
}

.xtd2-section--light {
	background: #fff
}

.xtd2-section--alt {
	background:
		radial-gradient(circle at 5% 10%, rgba(230, 57, 70, .035), transparent 45%),
		radial-gradient(circle at 95% 90%, rgba(247, 127, 0, .035), transparent 45%),
		var(--xtd-bg);
}

.xtd2-section--dark {
	background: #0059b2;
	color: #fff;
}

.xtd2-section--dark::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 22% 30%, rgba(247, 127, 0, .08), transparent 40%),
		radial-gradient(circle at 78% 70%, rgba(230, 57, 70, .06), transparent 40%);
	pointer-events: none;
}

.xtd2-section--dark>.auto-container {
	position: relative;
	z-index: 1
}

/* Decorative big outlined section number */
.xtd2-sect-num {
	position: absolute;
	top: 60px;
	right: 4%;
	font-family: 'Barlow', sans-serif;
	font-weight: 900;
	font-size: clamp(110px, 14vw, 200px);
	line-height: .85;
	color: transparent;
	-webkit-text-stroke: 1.5px rgba(10, 37, 64, .055);
	pointer-events: none;
	user-select: none;
	z-index: 0;
	letter-spacing: -.05em;
}

.xtd2-section--dark .xtd2-sect-num {
	-webkit-text-stroke: 1.5px rgba(255, 255, 255, .06);
}

/* ===== SECTION 01 — Editorial Intro ===== */
.xtd2-intro-grid {
	display: grid;
	grid-template-columns: 5fr 7fr;
	gap: 80px;
	align-items: center;
}

.xtd2-intro-content {
	position: relative
}

.xtd2-intro-content::before {
	content: "";
	position: absolute;
	left: -28px;
	top: 8px;
	bottom: 8px;
	width: 2px;
	background: linear-gradient(180deg, #0059b2 0%, #03407e 100%);
	border-radius: 2px;
	opacity: .45;
}

.xtd2-intro-image {
	position: relative;
	aspect-ratio: 5/4;
	width: 100%;
}

.xtd2-intro-image>img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	border-radius: 4px;
	box-shadow: 0 40px 30px -28px rgba(10, 37, 64, .45);
	filter: saturate(1.05);
}

/* Bracket corners */
.xtd2-intro-image::before,
.xtd2-intro-image::after {
	content: "";
	position: absolute;
	width: 64px;
	height: 64px;
	pointer-events: none;
	z-index: 2;
}

.xtd2-intro-image::before {
	top: -14px;
	left: -14px;
	border-top: 3px solid var(--xtd-navy);
	border-left: 3px solid var(--xtd-navy);
}

.xtd2-intro-image::after {
	bottom: -14px;
	right: -14px;
	border-bottom: 3px solid var(--xtd-navy);
	border-right: 3px solid var(--xtd-navy);
}

/* Floating years badge — vertical pill */
.xtd2-intro-years {
	position: absolute;
	top: 50%;
	right: -42px;
	transform: translateY(-50%) rotate(0);
	background: linear-gradient(135deg, #0c437a 0%, #0059b2 100%);
	color: #fff;
	padding: 30px 22px;
	border-radius: 6px;
	box-shadow: 0 22px 40px -14px rgba(230, 57, 70, .55);
	text-align: center;
	z-index: 3;
	min-width: 120px;
}

.xtd2-intro-years-num {
	font-family: 'Barlow', sans-serif;
	font-weight: 900;
	font-size: 54px;
	line-height: 1;
	display: block;
	letter-spacing: -.03em;
}

.xtd2-intro-years-num sup {
	font-size: .5em;
	font-weight: 700;
	vertical-align: super;
	margin-left: 2px
}

.xtd2-intro-years-label {
	margin-top: 8px;
	font-family: 'Rubik', sans-serif;
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .22em;
	text-transform: uppercase;
	line-height: 1.4;
	color: rgba(255, 255, 255, .92);
}

/* ===== Inline Stats Bar ===== */
.xtd2-stats-bar {
	margin-top: 80px;
	padding: 42px 50px;
	background: var(--xtd-navy);
	border-radius: 6px;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	position: relative;
	overflow: hidden;
	box-shadow: 0 30px 60px -28px rgba(10, 37, 64, .35);
}

.xtd2-stats-bar::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background: linear-gradient(90deg, var(--xtd-accent-3) 0%, var(--xtd-accent-3) 100%);
}

.xtd2-stats-bar::after {
	content: "";
	position: absolute;
	top: -50%;
	right: -10%;
	width: 400px;
	height: 400px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(247, 127, 0, .10) 0%, transparent 65%);
	pointer-events: none;
}

.xtd2-stat-item {
	position: relative;
	padding: 0 30px;
	border-left: 1px solid rgba(255, 255, 255, .1);
}

.xtd2-stat-item:first-child {
	border-left: 0;
	padding-left: 0
}

.xtd2-stat-num {
	font-family: 'Barlow', sans-serif;
	font-weight: 800;
	font-size: clamp(38px, 4.4vw, 54px);
	line-height: 1;
	letter-spacing: -.02em;
	display: block;
	background: linear-gradient(135deg, var(--xtd-accent-3) 0%, var(--xtd-accent-3) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

.xtd2-stat-num small {
	font-size: .4em;
	color: rgba(255, 255, 255, .85);
	margin-left: 6px;
	font-weight: 600;
	-webkit-text-fill-color: rgba(255, 255, 255, .85);
	letter-spacing: .02em;
}

.xtd2-stat-label {
	margin-top: 12px;
	font-family: 'Rubik', sans-serif;
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
	color: #fff;
	line-height: 1.4;
}

/* ===== SECTION 02 — Product Range — Horizontal Specimen Rows ===== */
.xtd2-prod-head {
	max-width: 780px;
	margin: 0 auto 80px;
	text-align: center;
}

.xtd2-prod-head .xtd2-eyebrow {
	justify-content: center
}

.xtd2-prod-rows {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.xtd2-prod-row {
	display: grid;
	grid-template-columns: 90px 1.4fr 2.2fr;
	gap: 40px;
	align-items: center;
	background: #fff;
	border: 1px solid var(--xtd-line);
	border-radius: 6px;
	padding: 32px 38px;
	position: relative;
	transition: all .4s cubic-bezier(.2, .8, .2, 1);
	overflow: hidden;
}

.xtd2-prod-row::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 100%;
	background: linear-gradient(180deg, var(--xtd-accent) 0%, var(--xtd-accent-2) 100%);
	transition: width .4s ease;
}

.xtd2-prod-row::after {
	content: "";
	position: absolute;
	right: 0;
	top: 0;
	width: 140px;
	height: 100%;
	background: radial-gradient(ellipse at right center, rgba(247, 127, 0, .06), transparent 70%);
	opacity: 0;
	transition: opacity .4s ease;
	pointer-events: none;
}

.xtd2-prod-row:hover {
	transform: translateX(6px);
	border-color: transparent;
	box-shadow: 0 22px 50px -22px rgba(10, 37, 64, .22);
}

.xtd2-prod-row:hover::before {
	width: 5px
}

.xtd2-prod-row:hover::after {
	opacity: 1
}

.xtd2-prod-num {
	font-family: 'Barlow', sans-serif;
	font-weight: 900;
	font-size: 60px;
	line-height: 1;
	letter-spacing: -.04em;
	color: transparent;
	-webkit-text-stroke: 1.5px #0059b2;
	transition: all .35s ease;
}

.xtd2-prod-row:hover .xtd2-prod-num {
	color: var(--xtd-accent);
	-webkit-text-stroke: 1.5px var(--xtd-accent);
}

.xtd2-prod-info h3 {
	font-family: 'Barlow', sans-serif;
	font-weight: 700;
	font-size: 22px;
	color: var(--xtd-ink);
	margin: 0;
	line-height: 1.25;
	letter-spacing: -.005em;
}

.xtd2-prod-info-sub {
	display: block;
	margin-top: 8px;
	font-family: 'Rubik', sans-serif;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: #0059b2;
}

.xtd2-prod-grades {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
}

.xtd2-prod-chip {
	display: inline-block;
	background: var(--xtd-bg-2);
	border: 1px solid var(--xtd-line);
	color: var(--xtd-ink);
	font-family: 'Rubik', sans-serif;
	font-size: 12.5px;
	font-weight: 500;
	padding: 7px 13px;
	border-radius: 50px;
	letter-spacing: .01em;
	transition: all .3s ease;
}

.xtd2-prod-row:hover .xtd2-prod-chip {
	background: #fff;
	border-color: rgba(230, 57, 70, .18);
}

.xtd2-prod-chip:hover {
	background: var(--xtd-accent);
	color: #fff;
	border-color: var(--xtd-accent);
	transform: translateY(-2px);
}

.xtd2-prod-note {
	margin-top: 42px;
	text-align: center;
	font-family: 'Rubik', sans-serif;
	font-size: 15px;
	font-style: italic;
	color: #222;
}

.xtd2-prod-note::before,
.xtd2-prod-note::after {
	content: "—";
	color: var(--xtd-accent);
	margin: 0 12px;
	font-style: normal;
	font-weight: 700;
}

/* ===== SECTION 03 — Manufacturing — Timeline Process ===== */
.xtd2-mfg-head {
	display: grid;
	grid-template-columns: 1fr 1.2fr;
	gap: 60px;
	align-items: end;
	margin-bottom: 80px;
}

.xtd2-mfg-head-r {
	padding-bottom: 6px;
}

.xtd2-mfg-process {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
	margin-bottom: 80px;
}

.xtd2-mfg-process::before {
	content: "";
	position: absolute;
	top: 42px;
	left: 8%;
	right: 8%;
	height: 2px;
	background-image: linear-gradient(90deg, var(--xtd-accent) 50%, transparent 50%);
	background-size: 12px 2px;
	opacity: .4;
	z-index: 0;
}

.xtd2-mfg-step {
	position: relative;
	text-align: center;
	z-index: 1;
	padding: 0 8px;
}

.xtd2-mfg-step-icon {
	width: 84px;
	height: 84px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--xtd-navy) 0%, var(--xtd-steel) 100%);
	color: var(--xtd-accent-2);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 30px;
	margin: 0 auto 22px;
	box-shadow: 0 0 0 8px #fff, 0 0 0 9px rgba(230, 57, 70, .18);
	position: relative;
	transition: all .4s cubic-bezier(.2, .8, .2, 1);
}

.xtd2-mfg-step-icon::after {
	content: "";
	position: absolute;
	inset: -4px;
	border-radius: 50%;
	background: conic-gradient(from 0deg, transparent 65%, var(--xtd-accent), transparent);
	opacity: 0;
	transition: opacity .35s ease;
	animation: xtd2-rotate 4s linear infinite;
	z-index: -1;
}

.xtd2-mfg-step:hover .xtd2-mfg-step-icon {
	transform: translateY(-6px);
	background: linear-gradient(135deg, var(--xtd-accent) 0%, var(--xtd-accent-2) 100%);
	color: #fff;
	box-shadow: 0 0 0 8px #fff, 0 0 0 9px var(--xtd-accent-2), 0 16px 30px -10px rgba(230, 57, 70, .45);
}

.xtd2-mfg-step .xtd2-mfg-step-icon img {
	height: 30px;
}

.xtd2-mfg-step:hover .xtd2-mfg-step-icon img {
	filter: brightness(0%) contrast(200%) invert(100%) opacity(100%);
}

.xtd2-mfg-step:hover .xtd2-mfg-step-icon::after {
	opacity: .8
}

/* CSS counter — visual decoration only, no HTML text content */
.xtd2-mfg-process {
	counter-reset: xtd2-step
}

.xtd2-mfg-step {
	counter-increment: xtd2-step
}

.xtd2-mfg-step:hover::before {
	opacity: 1
}

.xtd2-mfg-step-title {
	font-family: 'Barlow', sans-serif;
	font-weight: 700;
	font-size: 16px;
	color: var(--xtd-ink);
	line-height: 1.35;
	margin: 0;
	letter-spacing: -.005em;
}

/* Spec blocks (Production lines + In-stock) */
.xtd2-mfg-specs {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}

.xtd2-spec-block {
	background: #fff;
	border: 1px solid var(--xtd-line);
	border-left: 4px solid var(--xtd-accent);
	border-radius: 0 6px 6px 0;
	padding: 32px 36px;
	position: relative;
	transition: all .35s ease;
}

.xtd2-spec-block:hover {
	border-left-color: var(--xtd-accent-2);
	transform: translateX(4px);
	box-shadow: 0 16px 36px -16px rgba(10, 37, 64, .18);
}

.xtd2-spec-block-label {
	font-family: 'Rubik', sans-serif;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	color: var(--xtd-accent);
	margin-bottom: 14px;
	display: flex;
	align-items: center;
	gap: 10px;
}

.xtd2-spec-block-label::before {
	content: "";
	width: 18px;
	height: 1px;
	background: currentColor
}

.xtd2-spec-block-content {
	font-family: 'Rubik', sans-serif;
	font-size: 15px;
	line-height: 1.75;
	color: var(--xtd-muted);
}

.xtd2-spec-block-content strong {
	color: var(--xtd-ink);
	font-weight: 600;
}

/* ===== Large Diameter Feature Box — RE-IMAGINED ===== */
.xtd2-feature {
	margin-top: 80px;
	background: linear-gradient(135deg, var(--xtd-navy) 0%, var(--xtd-navy-2) 60%, #1a3a5f 100%);
	color: #fff;
	border-radius: 8px;
	position: relative;
	overflow: hidden;
	display: grid;
	grid-template-columns: 1fr 1.3fr;
	gap: 0;
}

.xtd2-feature::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 80% 20%, rgba(247, 127, 0, .20), transparent 50%),
		radial-gradient(circle at 20% 90%, rgba(230, 57, 70, .12), transparent 50%);
	pointer-events: none;
}

.xtd2-feature::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 50%;
	height: 100%;
	background: repeating-linear-gradient(135deg,
			transparent 0,
			transparent 60px,
			rgba(247, 127, 0, .03) 60px,
			rgba(247, 127, 0, .03) 61px);
	pointer-events: none;
}

.xtd2-feature-stats-col {
	position: relative;
	z-index: 2;
	background: rgba(0, 0, 0, .18);
	padding: 50px 44px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	border-right: 1px solid rgba(255, 255, 255, .08);
}

.xtd2-feature-stat-block {
	padding: 24px 0;
	border-bottom: 1px dashed rgba(255, 255, 255, .14);
}

.xtd2-feature-stat-block:last-child {
	border-bottom: 0
}

.xtd2-feature-stat-block:first-child {
	padding-top: 0
}

.xtd2-feature-stat-block-label {
	font-family: 'Rubik', sans-serif;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	color: #fff;
	margin-bottom: 10px;
}

.xtd2-feature-stat-block-val {
	font-family: 'Barlow', sans-serif;
	font-weight: 800;
	font-size: 30px;
	color: #fff;
	line-height: 1.1;
	letter-spacing: -.01em;
}

.xtd2-feature-stat-block-val .xtd2-accent {
	color: var(--xtd-accent-3)
}

.xtd2-feature-content-col {
	position: relative;
	z-index: 2;
	padding: 60px 56px;
}

.xtd2-feature-content-col .xtd2-eyebrow {
	color: var(--xtd-accent-3)
}

.xtd2-feature-content-col h3 {
	font-family: 'Barlow', sans-serif;
	font-weight: 800;
	font-size: clamp(26px, 2.6vw, 34px);
	line-height: 1.15;
	margin: 20px 0 22px;
	color: #fff;
	letter-spacing: -.01em;
}

.xtd2-feature-content-col p {
	font-family: 'Rubik', sans-serif;
	font-size: 15.5px;
	line-height: 1.75;
	color: rgba(255, 255, 255, .82);
	margin: 0;
}

.xtd2-feature-content-col p strong {
	color: #fff;
	font-weight: 600
}

/* ===== SECTION 04 — Standards & Certifications (DARK) ===== */
.xtd2-std-grid {
	display: grid;
	grid-template-columns: 5fr 7fr;
	gap: 80px;
	align-items: start;
}

.xtd2-std-left {
	padding-top: 8px
}

.xtd2-std-note {
	margin-top: 30px;
	padding: 22px 26px;
	background: rgba(255, 255, 255, .05);
	border: 1px solid rgba(255, 255, 255, .1);
	border-left: 3px solid var(--xtd-accent-3);
	border-radius: 0 6px 6px 0;
	font-family: 'Rubik', sans-serif;
	font-size: 16px;
	line-height: 1.7;
	color: rgba(255, 255, 255, .82);
	font-style: italic;
}
.xtd2-std-note p{color: rgba(255, 255, 255, .82);}

.xtd2-std-note strong {
	color: #fff;
	font-style: normal;
	font-weight: 600
}

.xtd2-std-cta {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-family: 'Rubik', sans-serif;
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	background: var(--xtd-accent);
	color: #222;
	padding: 17px 34px;
	border-radius: 50px;
	text-decoration: none;
	margin-top: 34px;
	position: relative;
	overflow: hidden;
	box-shadow: 0 12px 30px -10px rgba(230, 57, 70, .55);
	transition: all .35s ease;
}

.xtd2-std-cta::before {
	content: "";
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .35), transparent);
	transition: left .7s ease;
}

.xtd2-std-cta:hover {
	background: var(--xtd-accent-2);
	color: #222;
	text-decoration: none;
	transform: translateX(4px);
}

.xtd2-std-cta:hover::before {
	left: 100%
}

.xtd2-std-cta i {
	transition: transform .3s ease;
	position: relative;
	z-index: 1
}

.xtd2-std-cta:hover i {
	transform: translateX(4px)
}

/* Asymmetric facility collage - 6 images */
.xtd2-collage {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	grid-template-rows: repeat(3, 140px);
	gap: 14px;
}

.xtd2-collage-img {
	position: relative;
	overflow: hidden;
	border-radius: 4px;
	background: rgba(255, 255, 255, .04);
}

.xtd2-collage-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .6s ease, filter .4s ease;
	filter: saturate(.95) brightness(.92);
}

.xtd2-collage-img::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 55%, rgba(10, 37, 64, .7) 100%);
	opacity: 0;
	transition: opacity .35s ease;
}

.xtd2-collage-img:hover img {
	transform: scale(1.08);
	filter: saturate(1.1) brightness(1);
}

.xtd2-collage-img:hover::after {
	opacity: 1
}

/* Asymmetric 6-image mosaic */
.xtd2-collage-img--1 {
	grid-column: 1/3;
	grid-row: 1/2
}

.xtd2-collage-img--2 {
	grid-column: 3/5;
	grid-row: 1/3
}

.xtd2-collage-img--3 {
	grid-column: 5/7;
	grid-row: 1/2
}

.xtd2-collage-img--4 {
	grid-column: 1/3;
	grid-row: 2/3
}

.xtd2-collage-img--5 {
	grid-column: 5/7;
	grid-row: 2/3
}

.xtd2-collage-img--6 {
	grid-column: 1/7;
	grid-row: 3/4
}

/* Marquee bands kept (visually refined) */
.xtd2-marquee-band {
	margin-top: 80px;
	padding-top: 60px;
	border-top: 1px solid rgba(255, 255, 255, .1);
}

.xtd2-marquee-row {
	margin-bottom: 36px
}

.xtd2-marquee-row:last-child {
	margin-bottom: 0
}

.xtd2-marquee-label {
	display: flex;
	align-items: center;
	gap: 14px;
	font-family: 'Rubik', sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .3em;
	text-transform: uppercase;
	color: var(--xtd-accent-3);
	margin-bottom: 20px;
}

.xtd2-marquee-label::before {
	content: "";
	width: 32px;
	height: 1px;
	background: currentColor
}

.xtd2-marquee-label .xtd2-marquee-count {
	color: rgba(255, 255, 255, .4);
	font-size: 11px;
	letter-spacing: .18em;
	margin-left: auto;
	font-weight: 500;
}

.xtd2-marquee-row--certs .xtd2-marquee-label {
	color: var(--xtd-accent-3)
}

.xtd2-marquee {
	position: relative;
	overflow: hidden;
	padding: 6px 0;
	-webkit-mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
	mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}

.xtd2-marquee-track {
	display: flex;
	gap: 14px;
	width: max-content;
	animation: xtd2-scroll 40s linear infinite;
}

.xtd2-marquee:hover .xtd2-marquee-track {
	animation-play-state: paused
}

.xtd2-marquee-row--certs .xtd2-marquee-track {
	animation: xtd2-scroll-rev 44s linear infinite
}

.xtd2-marquee-item {
	flex-shrink: 0;
	background: rgba(255, 255, 255, .05);
	border: 1px solid rgba(255, 255, 255, .12);
	border-left: 3px solid var(--xtd-accent-3);
	padding: 14px 24px;
	border-radius: 4px;
	font-family: 'Rubik', sans-serif;
	font-size: 13.5px;
	font-weight: 600;
	color: #fff;
	letter-spacing: .04em;
	white-space: nowrap;
	backdrop-filter: blur(8px);
	transition: all .3s ease;
	cursor: default;
	position: relative;
	overflow: hidden;
}

.xtd2-marquee-row--certs .xtd2-marquee-item {
	border-left-color: var(--xtd-accent-3)
}

.xtd2-marquee-item::after {
	content: "";
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .12), transparent);
	transition: left .8s ease;
}

.xtd2-marquee-item:hover {
	background: rgba(247, 127, 0, .18);
	border-left-color: var(--xtd-accent-3);
	transform: translateY(-3px);
}

.xtd2-marquee-item:hover::after {
	left: 100%
}

@keyframes xtd2-scroll {
	0% {
		transform: translateX(0)
	}

	100% {
		transform: translateX(calc(-50% - 7px))
	}
}

@keyframes xtd2-scroll-rev {
	0% {
		transform: translateX(calc(-50% - 7px))
	}

	100% {
		transform: translateX(0)
	}
}

/* ===== SECTION 05 — Applications — Visual Cards ===== */
.xtd2-apps-head {
	max-width: 780px;
	margin: 0 auto 70px;
	text-align: center
}

.xtd2-apps-head .xtd2-eyebrow {
	justify-content: center
}

.xtd2-apps-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px;
}

.xtd2-app-card {
	position: relative;
	background: #fff;
	border: 1px solid var(--xtd-line);
	border-radius: 8px;
	padding: 48px 32px;
	text-align: center;
	overflow: hidden;
	transition: all .4s cubic-bezier(.2, .8, .2, 1);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24px;
	min-height: 200px;
}

.xtd2-app-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--xtd-accent), var(--xtd-accent-2));
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .5s cubic-bezier(.2, .8, .2, 1);
}

.xtd2-app-card::after {
	content: "";
	position: absolute;
	bottom: -50px;
	right: -50px;
	width: 180px;
	height: 180px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(247, 127, 0, .08), transparent 70%);
	opacity: 0;
	transition: opacity .4s ease;
	pointer-events: none;
}

.xtd2-app-card:hover {
	transform: translateY(-8px);
	border-color: transparent;
	box-shadow: 0 30px 60px -22px rgba(10, 37, 64, .25);
}

.xtd2-app-card:hover::before {
	transform: scaleX(1)
}

.xtd2-app-card:hover::after {
	opacity: 1
}

.xtd2-app-icon {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--xtd-navy), var(--xtd-steel));
	color: var(--xtd-accent-2);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 26px;
	transition: all .4s cubic-bezier(.2, .8, .2, 1);
	position: relative;
	overflow: hidden;
	box-shadow: 0 0 0 6px #fff, 0 0 0 7px rgba(10, 37, 64, .08);
}

.xtd2-app-icon img {
	height: 30px;
}

.xtd2-app-icon::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, var(--xtd-accent), var(--xtd-accent-2));
	opacity: 0;
	transition: opacity .35s ease;
}

.xtd2-app-icon>i {
	position: relative;
	z-index: 1
}

.xtd2-app-card:hover .xtd2-app-icon {
	color: #fff;
	transform: rotate(-6deg) scale(1.05);
	box-shadow: 0 0 0 6px #fff, 0 0 0 7px var(--xtd-accent), 0 12px 24px -10px rgba(230, 57, 70, .4);
}

.xtd2-app-card:hover .xtd2-app-icon img {
	filter: brightness(0%) contrast(200%) invert(100%) opacity(100%);
}

.xtd2-app-card:hover .xtd2-app-icon::before {
	opacity: 1
}

.xtd2-app-name {
	font-family: 'Barlow', sans-serif;
	font-weight: 700;
	font-size: 18px;
	color: var(--xtd-ink);
	line-height: 1.3;
	margin: 0;
	letter-spacing: -.005em;
}

.xtd2-app-card>* {
	position: relative;
	z-index: 1
}

/* ===== SECTION 06 — Certifications Grid + Closing ===== */
.xtd2-certs-head {
	display: grid;
	grid-template-columns: 1fr 1.3fr;
	gap: 60px;
	margin-bottom: 70px;
	align-items: end;
}

.xtd2-certs-head-l {
	padding-bottom: 4px
}

.xtd2-certs-head-r {
	padding-bottom: 8px
}

.xtd2-certs-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 14px;
}

.xtd2-cert-card {
	background: #fff;
	border: 1px solid var(--xtd-line);
	border-radius: 8px;
	padding: 28px 12px 24px;
	text-align: center;
	position: relative;
	overflow: hidden;
	transition: all .4s cubic-bezier(.2, .8, .2, 1);
}

.xtd2-cert-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: linear-gradient(90deg, var(--xtd-accent), var(--xtd-accent-2));
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .4s ease;
}

.xtd2-cert-card:hover {
	transform: translateY(-6px);
	border-color: transparent;
	box-shadow: 0 22px 40px -18px rgba(10, 37, 64, .22);
}

.xtd2-cert-card:hover::before {
	transform: scaleX(1)
}

.xtd2-cert-icon {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--xtd-navy), var(--xtd-steel));
	color: var(--xtd-accent-2);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	margin: 0 auto 14px;
	box-shadow: 0 0 0 4px #fff, 0 0 0 5px rgba(10, 37, 64, .08);
	transition: all .4s cubic-bezier(.2, .8, .2, 1);
}

.xtd2-cert-card:hover .xtd2-cert-icon {
	background: linear-gradient(135deg, var(--xtd-accent), var(--xtd-accent-2));
	color: #fff;
	transform: rotate(-6deg) scale(1.08);
	box-shadow: 0 0 0 4px #fff, 0 0 0 6px var(--xtd-accent), 0 12px 24px -10px rgba(230, 57, 70, .4);
}

.xtd2-cert-card .xtd2-cert-icon img {
	height: 20px;
}

.xtd2-cert-card:hover .xtd2-cert-icon img {
	filter: brightness(0%) contrast(200%) invert(100%) opacity(100%);
}

.xtd2-cert-name {
	font-family: 'Barlow', sans-serif;
	font-weight: 700;
	font-size: 13px;
	color: var(--xtd-ink);
	line-height: 1.3;
	margin: 0;
	letter-spacing: .01em;
}

/* Closing quote */
.xtd2-closing {
	margin-top: 80px;
	padding: 70px 60px 64px;
	background:
		radial-gradient(ellipse at top left, rgba(230, 57, 70, .05), transparent 60%),
		radial-gradient(ellipse at bottom right, rgba(247, 127, 0, .05), transparent 60%),
		#fff;
	border: 1px solid var(--xtd-line);
	border-radius: 10px;
	text-align: center;
	position: relative;
}

.xtd2-closing::before {
	content: "\201C";
	font-family: 'Barlow', serif;
	font-weight: 900;
	font-size: 160px;
	line-height: 1;
	position: absolute;
	top: 8px;
	left: 42px;
	color: transparent;
	-webkit-text-stroke: 1.5px rgba(230, 57, 70, .18);
}

.xtd2-closing::after {
	content: "";
	position: absolute;
	bottom: -1px;
	left: 50%;
	transform: translateX(-50%);
	width: 140px;
	height: 4px;
	background: linear-gradient(90deg, var(--xtd-accent), var(--xtd-accent-2));
	border-radius: 2px;
}

.xtd2-closing p {
	font-family: 'Barlow', sans-serif;
	font-weight: 500;
	font-size: 18px;
	line-height: 1.55;
	color: var(--xtd-ink);
	margin: 0;
	max-width: 980px;
	margin-left: auto;
	margin-right: auto;
	font-style: italic;
	letter-spacing: -.005em;
	position: relative;
	z-index: 1;
}

/* ===== Decorative pipe ring shared ===== */
.xtd2-ring {
	position: absolute;
	width: 340px;
	height: 340px;
	border-radius: 50%;
	pointer-events: none;
	z-index: 0;
	opacity: .55;
	background:
		radial-gradient(circle, transparent 30%, rgba(247, 127, 0, .12) 30.3%, rgba(247, 127, 0, .12) 31.5%, transparent 31.8%),
		radial-gradient(circle, transparent 50%, rgba(230, 57, 70, .10) 50.3%, rgba(230, 57, 70, .10) 51.5%, transparent 51.8%),
		radial-gradient(circle, transparent 70%, rgba(10, 37, 64, .05) 70.3%, rgba(10, 37, 64, .05) 71.5%, transparent 71.8%);
	animation: xtd2-rotate 80s linear infinite;
}

.xtd2-ring--dark {
	background:
		radial-gradient(circle, transparent 30%, rgba(247, 127, 0, .15) 30.3%, rgba(247, 127, 0, .15) 31.5%, transparent 31.8%),
		radial-gradient(circle, transparent 50%, rgba(230, 57, 70, .12) 50.3%, rgba(230, 57, 70, .12) 51.5%, transparent 51.8%),
		radial-gradient(circle, transparent 70%, rgba(255, 255, 255, .06) 70.3%, rgba(255, 255, 255, .06) 71.5%, transparent 71.8%);
}

@keyframes xtd2-rotate {
	to {
		transform: rotate(360deg)
	}
}

/* ===== Reveal animations on scroll ===== */
@supports (animation-timeline:view()) {

	.xtd2-section,
	.xtd2-hero {
		animation: xtd2-fade-up linear both;
		animation-timeline: view();
		animation-range: entry 0% cover 25%;
	}

	.xtd2-prod-row,
	.xtd2-mfg-step,
	.xtd2-spec-block,
	.xtd2-app-card,
	.xtd2-cert-card,
	.xtd2-collage-img,
	.xtd2-stat-item,
	.xtd2-feature-stat-block {
		animation: xtd2-rise linear both;
		animation-timeline: view();
		animation-range: entry 0% cover 30%;
	}
}

@keyframes xtd2-fade-up {
	from {
		opacity: 0;
		transform: translateY(36px)
	}

	to {
		opacity: 1;
		transform: translateY(0)
	}
}

@keyframes xtd2-rise {
	from {
		opacity: 0;
		transform: translateY(24px) scale(.97)
	}

	to {
		opacity: 1;
		transform: translateY(0) scale(1)
	}
}

/* Hero reveal anims */
.xtd2-hero h1 {
	animation: xtd2-hero-reveal 1.1s cubic-bezier(.2, .8, .2, 1) both;
	animation-delay: .15s;
}

.xtd2-hero-eyebrow {
	animation: xtd2-fade-down .9s ease both
}

.xtd2-hero-crumb {
	animation: xtd2-fade-up 1s ease both;
	animation-delay: .55s
}

@keyframes xtd2-hero-reveal {
	from {
		opacity: 0;
		transform: translateY(30px);
		clip-path: inset(0 100% 0 0)
	}

	to {
		opacity: 1;
		transform: translateY(0);
		clip-path: inset(0 0 0 0)
	}
}

@keyframes xtd2-fade-down {
	from {
		opacity: 0;
		transform: translateY(-15px)
	}

	to {
		opacity: 1;
		transform: translateY(0)
	}
}

@keyframes xtd2-slide-in {
	from {
		opacity: 0;
		transform: translateX(30px)
	}

	to {
		opacity: 1;
		transform: translateX(0)
	}
}

/* Eyebrow line pulse */
.xtd2-eyebrow::before {
	animation: xtd2-pulse 2.5s ease-in-out infinite;
}

@keyframes xtd2-pulse {

	0%,
	100% {
		opacity: 1;
		width: 42px
	}

	50% {
		opacity: .55;
		width: 54px
	}
}

/* Accessibility: reduced-motion respect */
@media (prefers-reduced-motion:reduce) {

	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}

/* ===== RESPONSIVE ===== */
@media (max-width:1199px) {
	.xtd2-certs-grid {
		grid-template-columns: repeat(5, 1fr)
	}

	.xtd2-collage {
		grid-template-rows: repeat(3, 130px)
	}
}

@media (max-width:991px) {
	.xtd2-hero {
		padding: 90px 0 80px
	}

	.xtd2-hero-grid {
		grid-template-columns: 1fr;
		gap: 50px
	}

	.xtd2-section {
		padding: 80px 0
	}

	.xtd2-intro-grid,
	.xtd2-mfg-head,
	.xtd2-std-grid,
	.xtd2-certs-head {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.xtd2-intro-content::before {
		display: none
	}

	.xtd2-intro-years {
		right: 14px;
		top: auto;
		bottom: 14px;
		transform: none;
		padding: 18px 18px;
		min-width: auto;
	}

	.xtd2-intro-years-num {
		font-size: 36px
	}

	.xtd2-stats-bar {
		grid-template-columns: 1fr;
		padding: 28px 24px;
		gap: 24px
	}

	.xtd2-stat-item {
		padding: 18px 0 0;
		border-left: 0;
		border-top: 1px solid rgba(255, 255, 255, .1)
	}

	.xtd2-stat-item:first-child {
		border-top: 0;
		padding-top: 0
	}

	.xtd2-prod-row {
		grid-template-columns: 60px 1fr;
		gap: 24px;
		padding: 24px 26px
	}

	.xtd2-prod-grades {
		grid-column: 1/-1;
		margin-top: 4px
	}

	.xtd2-prod-num {
		font-size: 42px
	}

	.xtd2-mfg-process {
		grid-template-columns: repeat(2, 1fr);
		gap: 32px 14px
	}

	.xtd2-mfg-process::before {
		display: none
	}

	.xtd2-mfg-specs {
		grid-template-columns: 1fr
	}

	.xtd2-feature {
		grid-template-columns: 1fr
	}

	.xtd2-feature-stats-col {
		border-right: 0;
		border-bottom: 1px solid rgba(255, 255, 255, .08);
		padding: 36px 30px
	}

	.xtd2-feature-content-col {
		padding: 40px 30px
	}

	.xtd2-apps-grid {
		grid-template-columns: repeat(2, 1fr)
	}

	.xtd2-collage {
		grid-template-columns: repeat(4, 1fr);
		grid-template-rows: repeat(4, 130px)
	}

	.xtd2-collage-img--1 {
		grid-column: 1/3;
		grid-row: 1/2
	}

	.xtd2-collage-img--2 {
		grid-column: 3/5;
		grid-row: 1/3
	}

	.xtd2-collage-img--3 {
		grid-column: 1/3;
		grid-row: 2/3
	}

	.xtd2-collage-img--4 {
		grid-column: 1/3;
		grid-row: 3/4
	}

	.xtd2-collage-img--5 {
		grid-column: 3/5;
		grid-row: 3/4
	}

	.xtd2-collage-img--6 {
		grid-column: 1/5;
		grid-row: 4/5
	}

	.xtd2-certs-grid {
		grid-template-columns: repeat(4, 1fr)
	}

	.xtd2-closing {
		padding: 50px 30px 44px
	}

	.xtd2-closing p {
		font-size: 18px
	}

	.xtd2-closing::before {
		font-size: 120px;
		left: 22px;
		top: 14px
	}
}

@media (max-width:600px) {
	.xtd2-hero {
		padding: 70px 0 60px
	}

	.xtd2-hero-spec {
		padding: 24px 22px
	}

	.xtd2-hero-spec-val {
		font-size: 18px
	}

	.xtd2-section {
		padding: 60px 0
	}

	.xtd2-apps-grid {
		grid-template-columns: 1fr
	}

	.xtd2-certs-grid {
		grid-template-columns: repeat(3, 1fr)
	}

	.xtd2-collage {
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(3, 140px)
	}

	.xtd2-collage-img--1 {
		grid-column: 1/2;
		grid-row: 1/2
	}

	.xtd2-collage-img--2 {
		grid-column: 2/3;
		grid-row: 1/2
	}

	.xtd2-collage-img--3 {
		grid-column: 1/2;
		grid-row: 2/3
	}

	.xtd2-collage-img--4 {
		grid-column: 2/3;
		grid-row: 2/3
	}

	.xtd2-collage-img--5 {
		grid-column: 1/2;
		grid-row: 3/4
	}

	.xtd2-collage-img--6 {
		grid-column: 2/3;
		grid-row: 3/4
	}

	.xtd2-marquee-item {
		padding: 12px 18px;
		font-size: 12.5px
	}

	.xtd2-prod-num {
		font-size: 34px
	}

	.xtd2-feature-content-col h3 {
		font-size: 22px
	}

	.xtd2-closing::before {
		font-size: 90px
	}
}

/* =========================================================
   HERO STRIP — matches certificate.html hero design
   Colors: #0059b2 (primary blue) + #ffd732 (yellow accent)
   ========================================================= */
.cert-redesign {
	font-family: 'Rubik', 'Barlow', system-ui, -apple-system, sans-serif;
	color: #0f172a;
	-webkit-font-smoothing: antialiased
}

.cert-redesign * {
	box-sizing: border-box
}

.cert-hero {
	position: relative;
	background:
		radial-gradient(1200px 500px at 85% 0%, rgba(255, 215, 50, .10), transparent 60%),
		radial-gradient(900px 400px at 10% 100%, rgba(255, 215, 50, .08), transparent 60%),
		linear-gradient(135deg, #0059b2 0%, #0059b2 45%, #0059b2 100%);
	color: #fff;
	padding: 60px 0 60px;
	overflow: hidden;
	border-bottom:12px solid #ffd732;
}

.cert-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(255, 255, 255, .06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, .06) 1px, transparent 1px);
	background-size: 48px 48px;
	mask-image: radial-gradient(ellipse at center, #000 40%, transparent 85%);
	-webkit-mask-image: radial-gradient(ellipse at center, #000 40%, transparent 85%);
}

.cert-hero-inner {
	position: relative;
	z-index: 2;
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 30px;
	display: grid;
	grid-template-columns: 1.4fr .8fr;
	gap: 50px;
	align-items: center;
}

.cert-hero-left {
	min-width: 0
}

.cert-tag {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 16px;
	border: 1px solid rgba(255, 215, 50, .45);
	border-radius: 999px;
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .5px;
	margin-bottom: 22px;
}

.cert-tag .dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #ffd732;
	box-shadow: 0 0 12px rgba(255, 215, 50, .9);
	animation: cert-pulse 2s ease-in-out infinite
}

@keyframes cert-pulse {

	0%,
	100% {
		opacity: 1
	}

	50% {
		opacity: .35
	}
}

.cert-redesign h1 {
	font-family: "Barlow", sans-serif;
	color: #fff !important;
	font-size: clamp(38px, 5.4vw, 68px);
	font-weight: 800;
	line-height: 1.05;
	margin: 0 0 22px;
}

.cert-redesign h1 .accent {
	color: #ffd732;
}

.cert-redesign h1::after {
	content: "";
	display: block;
	width: 80px;
	height: 4px;
	border-radius: 4px;
	margin-top: 22px;
	background: linear-gradient(90deg, #ffd732, transparent);
}

.cert-hero p {
	color: #e2e8f0;
	font-size: 17px;
	line-height: 1.75;
	max-width: 640px;
	margin: 0 0 30px;
}

.cert-hero p strong {
	color: #fff;
	font-weight: 600
}

.cert-hero-right {
	position: relative;
	min-height: 300px;
	display: flex;
	align-items: center;
	justify-content: center
}

.cert-ring {
	position: absolute;
	border-radius: 50%;
	border: 1px dashed rgba(255, 215, 50, .8);
}

.cert-ring.r1 {
	width: 300px;
	height: 300px;
	animation: cert-spin 38s linear infinite
}

.cert-ring.r2 {
	width: 230px;
	height: 230px;
	border-style: solid;
	border-color: rgba(255, 215, 50, .8);
	animation: cert-spin 24s linear infinite reverse
}

.cert-ring.r3 {
	width: 160px;
	height: 160px;
	border-style: dotted;
	border-color: rgba(255, 215, 50, .8);
	animation: cert-spin 18s linear infinite
}

.cert-core {
	position: relative;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #ffe572, #ffd732 50%, #b88f00 100%);
	box-shadow:
		0 0 0 6px rgba(255, 255, 255, .04),
		0 0 0 10px rgba(255, 215, 50, .12),
		0 30px 60px -10px rgba(255, 215, 50, .55),
		inset 0 0 30px rgba(0, 0, 0, .25);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0059b2;
	font-size: 42px;
}

.cert-core .seal-icon {
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .25));
}

@keyframes cert-spin {
	from {
		transform: rotate(0)
	}

	to {
		transform: rotate(360deg)
	}
}

.cert-chips {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.cert-chip {
	position: absolute;
	padding: 7px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .06);
	border: 1px solid #ffd732;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
	letter-spacing: .4px;
}

.cert-chip.c1 {
	top: 6%;
	left: -2%
}

.cert-chip.c2 {
	top: 18%;
	right: -6%
}

.cert-chip.c3 {
	bottom: 10%;
	left: -4%
}

.cert-chip.c4 {
	bottom: 4%;
	right: 4%
}

.cert-chip.c5 {
	top: 48%;
	right: -8%
}

.cert-chip.c6 {
	top: 50%;
	left: -8%
}

@media (max-width:991px) {
	.cert-hero-inner {
		grid-template-columns: 1fr;
		gap: 40px
	}

	.cert-hero-right {
		min-height: 280px
	}

	.cert-chip.c5,
	.cert-chip.c6 {
		display: none
	}
}

@media (max-width:768px) {
	.cert-hero {
		padding: 50px 0 80px
	}

	.cert-hero-inner {
		padding: 0 20px
	}
}

@media (max-width:480px) {
	.cert-hero-right .cert-ring.r1 {
		width: 240px;
		height: 240px
	}

	.cert-hero-right .cert-ring.r2 {
		width: 180px;
		height: 180px
	}

	.cert-hero-right .cert-ring.r3 {
		width: 130px;
		height: 130px
	}

	.cert-core {
		width: 96px;
		height: 96px;
		font-size: 34px
	}
}



/*  */
.xpt-hero {
	position: relative;
	overflow: hidden;
	color: #fff;
	padding: 66px 0 72px;
	background:
		radial-gradient(1100px 460px at 85% 0%, rgba(255, 215, 50, .12), transparent 60%),
		linear-gradient(135deg, #0059b2 0%, #01478d 100%);
}

.xpt-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(255, 255, 255, .06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, .06) 1px, transparent 1px);
	background-size: 46px 46px;
	-webkit-mask-image: radial-gradient(ellipse at center, #000 40%, transparent 88%);
	mask-image: radial-gradient(ellipse at center, #000 40%, transparent 88%);
}

.xpt-hero .auto-container {
	position: relative;
	z-index: 2
}

.xpt-hero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #ffd732;
	margin-bottom: 16px;
}

.xpt-hero__eyebrow::before {
	content: "";
	width: 32px;
	height: 2px;
	background: #ffd732
}

.xpt-hero h1 {
	font-family: 'Barlow', sans-serif;
	font-weight: 800;
	font-size: clamp(30px, 4.4vw, 52px);
	line-height: 1.12;
	letter-spacing: -.01em;
	margin: 0 0 26px;
	color: #fff;
	max-width: 900px;
}

.xpt-hero h1 em {
	font-style: normal;
	color: #ffd732
}

.xpt-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 10px
}

.xpt-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 15px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .07);
	border: 1px solid rgba(255, 215, 50, .5);
	font-size: 13px;
	font-weight: 600;
	color: #fff;
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}

.xpt-badge::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #ffd732
}

/* Grid */
.xpt-grid-sec {
	padding: 60px 0 80px;
	background: #f8fafc
}

.xpt-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 26px
}

.xpt-card {
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 16px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: 0 4px 14px -8px rgba(15, 37, 64, .18);
	transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s ease, border-color .3s ease;
}

.xpt-card:hover {
	transform: translateY(-8px);
	border-color: #bae6fd;
	box-shadow: 0 26px 50px -20px rgba(0, 89, 178, .30)
}

.xpt-card__img {
	position: relative;
	overflow: hidden;
	aspect-ratio: 4/3;
	background: #eef2f7
}

.xpt-card__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .6s ease
}

.xpt-card:hover .xpt-card__img img {
	transform: scale(1.06)
}

.xpt-card__body {
	padding: 22px 22px 24px;
	display: flex;
	flex-direction: column;
	flex: 1
}

.xpt-card__title {
	font-family: 'Barlow', sans-serif;
	font-weight: 700;
	font-size: 20px;
	line-height: 1.3;
	margin: 0 0 13px;
	color: #0a1929
}

.xpt-card__title a {
	color: inherit;
	text-decoration: none
}

.xpt-card:hover .xpt-card__title a {
	color: #0059b2
}

.xpt-card__grades {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 20px
}

.xpt-card__grade {
	font-size: 12px;
	font-weight: 500;
	color: #475569;
	background: #f1f5f9;
	border: 1px solid #e2e8f0;
	border-radius: 50px;
	padding: 4px 11px
}

.xpt-card__btn {
	margin-top: auto;
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 11px 20px;
	border-radius: 50px;
	background: #0059b2;
	color: #fff;
	text-decoration: none;
	font-family: 'Barlow', sans-serif;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .05em;
	text-transform: uppercase;
	transition: background .25s ease, gap .25s ease;
}

.xpt-card__btn:hover {
	background: #01478d;
	gap: 14px;
	color: #fff
}

.xpt-card__btn .arr {
	display: inline-flex;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: #ffd732;
	color: #0059b2;
	align-items: center;
	justify-content: center
}

@media(max-width:1100px) {
	.xpt-grid {
		grid-template-columns: repeat(3, 1fr)
	}
}

@media(max-width:820px) {
	.xpt-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 18px
	}

	.xpt-hero {
		padding: 52px 0 58px
	}
}

@media(max-width:520px) {
	.xpt-grid {
		grid-template-columns: 1fr
	}
}



/*  */
.prod-redesign {
	padding: 40px 0;
	font-family: 'Rubik', 'Barlow', system-ui, -apple-system, sans-serif;
	color: #0f172a;
	-webkit-font-smoothing: antialiased
}

.prod-redesign * {
	box-sizing: border-box
}

/* ---------- HERO ---------- */
.prod-hero {
	position: relative;
	background:
		radial-gradient(1200px 500px at 85% 0%, rgba(56, 189, 248, .18), transparent 60%),
		radial-gradient(900px 400px at 10% 100%, rgba(14, 165, 233, .14), transparent 60%),
		linear-gradient(135deg, #0059b2 0%, #0059b2 45%, #0059b2 100%);
	color: #fff;
	padding: 60px 0;
	overflow: hidden;
}

.prod-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(125, 211, 252, .06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(125, 211, 252, .06) 1px, transparent 1px);
	background-size: 48px 48px;
	mask-image: radial-gradient(ellipse at center, #000 40%, transparent 85%);
	-webkit-mask-image: radial-gradient(ellipse at center, #000 40%, transparent 85%);
}

.prod-hero-inner {
	position: relative;
	z-index: 2;
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 30px;
	display: grid;
	grid-template-columns: 1.4fr .8fr;
	gap: 50px;
	align-items: center;
}

.prod-tag {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 16px;
	border: 1px solid rgba(255, 215, 50, .5);
	border-radius: 999px;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	margin-bottom: 22px;
}

.prod-tag .dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #ffd732;
	box-shadow: 0 0 12px rgba(255, 215, 50, .9);
	animation: prod-pulse 2s ease-in-out infinite;
}

@keyframes prod-pulse {

	0%,
	100% {
		opacity: 1
	}

	50% {
		opacity: .35
	}
}

.prod-redesign h1 {
	font-family: 'Barlow', sans-serif;
	color: #fff !important;
	font-size: clamp(32px, 4.6vw, 56px);
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -.02em;
	margin: 0 0 22px;
}

.prod-redesign h1 .accent {
	color: #ffd732
}

.prod-redesign h1::after {
	content: "";
	display: block;
	width: 80px;
	height: 4px;
	border-radius: 4px;
	margin-top: 22px;
	background: linear-gradient(90deg, #ffd732, transparent);
}

.prod-hero p {
	color: #cbd5e1;
	font-size: 17px;
	line-height: 1.75;
	max-width: 640px;
	margin: 0;
}

.prod-hero p strong {
	color: #fff;
	font-weight: 600
}

/* Hero right - rings + gear/cog core */
.prod-hero-right {
	position: relative;
	min-height: 300px;
	display: flex;
	align-items: center;
	justify-content: center
}

.prod-ring {
	position: absolute;
	border-radius: 50%;
	border: 1px dashed rgba(255, 215, 50, .8)
}

.prod-ring.r1 {
	width: 300px;
	height: 300px;
	animation: prod-spin 38s linear infinite
}

.prod-ring.r2 {
	width: 230px;
	height: 230px;
	border-style: solid;
	border-color: rgba(255, 215, 50, .8);
	animation: prod-spin 24s linear infinite reverse
}

.prod-ring.r3 {
	width: 160px;
	height: 160px;
	border-style: dotted;
	border-color: rgba(255, 215, 50, .8);
	animation: prod-spin 18s linear infinite
}

.prod-core {
	position: relative;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #ffe572, #ffd732 50%, #b88f00 100%);
	box-shadow:
		0 0 0 6px rgba(255, 255, 255, .04),
		0 0 0 10px rgba(255, 215, 50, .12),
		0 30px 60px -10px rgba(255, 215, 50, .55),
		inset 0 0 30px rgba(0, 0, 0, .25);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0059b2;
}

.prod-core .seal-icon {
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .25));
	animation: prod-spin 12s linear infinite
}

@keyframes prod-spin {
	from {
		transform: rotate(0)
	}

	to {
		transform: rotate(360deg)
	}
}

.prod-chips {
	position: absolute;
	inset: 0;
	pointer-events: none
}

.prod-chip {
	position: absolute;
	padding: 7px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .06);
	border: 1px solid #ffd732;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
	letter-spacing: .4px;
}

.prod-chip.c1 {
	top: 6%;
	left: -2%
}

.prod-chip.c2 {
	top: 18%;
	right: -6%
}

.prod-chip.c3 {
	bottom: 10%;
	left: -4%
}

.prod-chip.c4 {
	bottom: 4%;
	right: 4%
}

.prod-chip.c5 {
	top: 48%;
	right: -8%
}

.prod-chip.c6 {
	top: 50%;
	left: -8%
}

/* ---------- MAIN SECTION ---------- */
.prod-section {
	background: linear-gradient(180deg, #f4f6fb 0%, #eef2f8 100%);
	padding: 60px 0 80px;
	position: relative;
}

.prod-container {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 30px
}

/* INTRO CARD (top video + paragraph) */
.prod-intro-card {
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 18px;
	overflow: hidden;
	box-shadow: 0 8px 30px -16px rgba(15, 37, 64, .2);
	margin-bottom: 20px;
}

.prod-intro-card .xtd-manufacturing-video {
	position: relative;
	background: #000;
	border-bottom: 4px solid #ffd732;
}

.prod-intro-card .xtd-manufacturing-video video {
	width: 100%;
	display: block;
}

.prod-intro-card-body {
	padding: 32px 36px
}

.prod-intro-card-body p {
	font-size: 15.5px;
	line-height: 1.75;
	color: #475569;
	margin: 0;
}

.prod-intro-card-body p strong {
	color: #0059b2;
	font-weight: 700
}

/* SECTION HEADING */
.prod-section-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	margin-bottom: 32px;
}

.prod-eyebrow {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	color: #0284c7;
	letter-spacing: .18em;
	text-transform: uppercase;
	background: #e0f2fe;
	padding: 6px 14px;
	border-radius: 999px;
	border: 1px solid #bae6fd;
	margin-bottom: 12px;
}

.prod-section-title {
	font-family: 'Barlow', sans-serif;
	font-size: clamp(26px, 3vw, 38px);
	font-weight: 800;
	color: #0f172a;
	line-height: 1.15;
	margin: 0;
	letter-spacing: -.015em;
}

.prod-section-sub {
	font-size: 15px;
	color: #64748b;
	margin: 8px 0 0;
	line-height: 1.6
}

.prod-step-badge {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 11px 18px;
	background: linear-gradient(135deg, #0059b2, #01478d);
	color: #ffd732;
	border-radius: 14px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
	box-shadow: 0 8px 18px -6px rgba(0, 89, 178, .5);
}

.prod-step-badge .num {
	font-family: 'Barlow', sans-serif;
	font-size: 18px;
	color: #fff;
}

/* ====== STEP NAVIGATION GRID (20 boxes) ====== */
.prod-redesign .row.g-3:first-of-type {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px !important;
	margin: 0 !important;
	padding: 0;
}

.prod-redesign .row.g-3:first-of-type>[class*="col-md"] {
	padding: 0;
	max-width: none;
	flex: none;
	width: auto;
}

/* Process boxes (the step nav buttons) */
.prod-redesign .process-box {
	position: relative;
	height: 100%;
}

.prod-redesign .process-box a {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 18px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	text-decoration: none !important;
	color: #0f172a;
	font-family: 'Rubik', sans-serif;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	transition: all .3s cubic-bezier(.2, .7, .2, 1);
	height: 100%;
	position: relative;
	overflow: hidden;
}

.prod-redesign .process-box a::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 0;
	background: linear-gradient(90deg, rgba(0, 89, 178, .05), transparent);
	transition: width .3s ease;
}

.prod-redesign .process-box a:hover {
	border-color: #0059b2;
	transform: translateY(-3px);
	box-shadow: 0 14px 28px -12px rgba(0, 89, 178, .35);
}

.prod-redesign .process-box a:hover::before {
	width: 100%
}

.prod-redesign .process-box .step-no {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	background: linear-gradient(135deg, #0059b2, #01478d);
	color: #ffd732;
	border-radius: 8px;
	font-family: 'Barlow', sans-serif;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0;
	flex-shrink: 0;
	box-shadow: 0 4px 8px -2px rgba(0, 89, 178, .4);
	transition: all .3s ease;
}

.prod-redesign .process-box a:hover .step-no {
	background: linear-gradient(135deg, #ffd732, #d4a900);
	color: #0059b2;
	transform: scale(1.05);
}

/* ====== STEP DETAIL � VERTICAL TIMELINE WITH PHASES (production2-style, brand palette) ====== */
.prod-steps-container {
	margin-top: 50px;
	background: transparent;
	border: none;
	padding: 0;
	position: relative;
	box-shadow: none;
}

.prod-steps-container::before {
	display: none
}

/* The wrap - container with vertical timeline */
.prod-steps-wrap {
	position: relative;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 18px;
	padding: 8px 30px;
	box-shadow: 0 8px 30px -16px rgba(15, 37, 64, .15);
	margin-bottom: 25px;
}

.prod-steps-wrap::before {
	content: "";
	position: absolute;
	left: calc(30px + 45px);
	top: 38px;
	bottom: 38px;
	width: 2px;
	background: linear-gradient(180deg, #0059b2 0%, #ffd732 50%, #0059b2 100%);
	opacity: .2;
}

/* Each step row */
.prod-step {
	display: grid;
	grid-template-columns: 140px 1fr;
	gap: 50px;
	align-items: start;
	padding: 38px 0;
	position: relative;
	border-bottom: 1px solid #e2e8f0;
	transition: background .3s;
	scroll-margin-top: 30px;
}

.prod-step:last-child {
	border-bottom: 0
}

.prod-step:hover {
	background: linear-gradient(90deg, rgba(0, 89, 178, .02), transparent)
}

/* Step marker (number circle + phase label) */
.prod-step .step-marker {
	position: relative;
	z-index: 2;
}

.prod-step .num-circle {
	width: 90px;
	height: 90px;
	border-radius: 50%;
	background: #fff;
	border: 2px solid #0059b2;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: 'Barlow', sans-serif;
	font-weight: 800;
	font-size: 32px;
	color: #0059b2;
	transition: all .35s cubic-bezier(.2, .7, .3, 1);
	position: relative;
	box-shadow: 0 6px 16px -6px rgba(0, 89, 178, .2);
}

.prod-step:hover .num-circle {
	background: linear-gradient(135deg, #0059b2, #01478d);
	border-color: #0059b2;
	color: #ffd732;
	transform: scale(1.05);
	box-shadow: 0 12px 24px -8px rgba(0, 89, 178, .5);
}

.prod-step .num-circle::before {
	content: "";
	position: absolute;
	inset: -6px;
	border: 1px dashed #ffd732;
	border-radius: 50%;
	transition: border-color .3s, transform .5s;
	opacity: .6;
}

.prod-step:hover .num-circle::before {
	border-color: #ffd732;
	border-style: solid;
	opacity: 1;
	transform: rotate(45deg);
}

.prod-step .ph {
	margin-top: 14px;
	font-family: 'Barlow', sans-serif;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .18em;
	color: #0284c7;
	text-transform: uppercase;
	text-align: center;
}

/* Step content */
.prod-step .step-content {
	padding-top: 8px
}

.prod-redesign .prod-step h3.service-detail_title {
	font-family: 'Barlow', sans-serif;
	font-weight: 800;
	font-size: 30px;
	line-height: 1.1;
	margin: 0 0 14px;
	color: #0f172a !important;
	letter-spacing: -.015em;
	text-transform: uppercase;
	padding: 0;
	display: block;
}

.prod-redesign .prod-step h3.service-detail_title::before,
.prod-redesign .prod-step h3.service-detail_title::after {
	display: none
}

.prod-step .body {
	font-size: 16px;
	line-height: 1.7;
	color: #475569;
	max-width: 780px;
	margin: 0;
}

.prod-step .meta-row {
	margin-top: 18px;
	display: flex;
	gap: 18px 24px;
	flex-wrap: wrap;
	font-family: 'Rubik', sans-serif;
	font-size: 11.5px;
	font-weight: 600;
	color: #64748b;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.prod-step .meta-row span {
	display: inline-flex;
	align-items: center;
	gap: 7px;
}

.prod-step .meta-row span::before {
	content: "";
	width: 6px;
	height: 6px;
	background: #ffd732;
	border-radius: 50%;
	display: inline-block;
	box-shadow: 0 0 6px rgba(255, 215, 50, .6);
}

.prod-step:hover .meta-row span::before {
	background: #0059b2;
	box-shadow: 0 0 6px rgba(0, 89, 178, .6);
}

/* ====== STICKY PROCESS TOC (left side floating sidebar) ====== */
.prod-toc {
	position: fixed;
	left: 24px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 90;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-left: 3px solid #0059b2;
	border-radius: 0 12px 12px 0;
	padding: 16px 10px;
	box-shadow: 0 16px 36px -10px rgba(0, 89, 178, .22);
	width: 240px;
	opacity: 0;
	visibility: hidden;
	transition: opacity .35s, visibility .35s, transform .35s;
	max-height: 78vh;
	overflow-y: auto;
	font-family: 'Rubik', sans-serif;
}

.prod-toc.visible {
	opacity: 1;
	visibility: visible
}

.prod-toc::-webkit-scrollbar {
	width: 4px
}

.prod-toc::-webkit-scrollbar-thumb {
	background: #cbd5e1;
	border-radius: 4px
}

.prod-toc::-webkit-scrollbar-thumb:hover {
	background: #0059b2
}

.prod-toc-title {
	font-family: 'Barlow', sans-serif;
	font-size: 13px;
	font-weight: 800;
	text-transform: uppercase;
	color: #0059b2;
	margin: 0 0 12px;
	padding: 0 10px;
	display: flex;
	align-items: center;
	gap: 8px;
}

.prod-toc-title::before {
	content: "";
	display: inline-block;
	width: 4px;
	height: 14px;
	background: #ffd732;
	border-radius: 2px;
}

.prod-toc ul {
	list-style: none;
	margin: 0;
	padding: 0
}

.prod-toc li {
	margin: 0
}

.prod-toc a {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 8px 10px;
	text-decoration: none !important;
	color: #222;
	font-size: 13px;
	font-weight: 500;
	transition: all .25s ease;
	border-radius: 6px;
	position: relative;
}

.prod-toc a:hover {
	color: #0059b2;
	background: #f0f9ff;
}

.prod-toc a.active {
	color: #0059b2;
	background: linear-gradient(90deg, rgba(255, 215, 50, .18), rgba(0, 89, 178, .06));
	font-weight: 700;
}

.prod-toc a.active::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 3px;
	height: 60%;
	background: linear-gradient(180deg, #0059b2, #01478d);
	border-radius: 2px;
}

.prod-toc a .tnum {
	font-family: 'Barlow', sans-serif;
	font-weight: 800;
	font-size: 12px;
	color: #222;
	width: 24px;
	display: inline-block;
	flex-shrink: 0;
	transition: color .25s ease;
}

.prod-toc a:hover .tnum {
	color: #0059b2
}

.prod-toc a.active .tnum {
	color: #0059b2
}

.prod-toc a .tname {
	flex: 1;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	letter-spacing: .01em;
}

/* Hide TOC on smaller screens */
@media (max-width:1399px) {
	.prod-toc {
		display: none !important
	}
}

/* Video modal close button */
.prod-redesign .modal-content {
	background: transparent;
	border: none;
}

.prod-redesign .modal-body {
	position: relative;
}

.prod-video-close {
	position: absolute;
	top: -20px;
	right: -20px;
	z-index: 1056;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #ffd732;
	color: #0059b2;
	border: 3px solid #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: 0 10px 24px -6px rgba(0, 0, 0, .5);
	transition: all .25s ease;
	padding: 0;
}

.prod-video-close:hover {
	background: #fff;
	color: #0059b2;
	transform: scale(1.1) rotate(90deg);
	box-shadow: 0 14px 28px -6px rgba(0, 0, 0, .6);
}

.prod-video-close:focus {
	outline: none;
	box-shadow: 0 0 0 4px rgba(255, 215, 50, .5)
}

@media (max-width:768px) {
	.prod-video-close {
		top: -16px;
		right: -8px;
		width: 38px;
		height: 38px
	}
}

/* Video card anchor: full-width block so the thumb/overlay fill the card */
.process-box1 a.video-btn {
	display: block;
	padding: 0;
	gap: 0;
}

/* Douyin play icon (replaces YouTube icon) — stacked above the title */
.douyin-play-icon {
	font-size: 24px;
	line-height: 1;
	color: #fff;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 12px;
	background: #161823;
	box-shadow: 0 4px 12px -3px rgba(0, 0, 0, .45);
	transition: transform .25s ease, background .25s ease;
}

.video-btn:hover .douyin-play-icon {
	transform: scale(1.08);
	background: #000;
}

/* ====== RESPONSIVE ====== */
@media (max-width:1100px) {
	.prod-hero-inner {
		padding: 0 24px
	}

	.prod-redesign .row.g-3:first-of-type {
		grid-template-columns: repeat(3, 1fr)
	}

	.prod-redesign .row.g-3:last-of-type {
		grid-template-columns: repeat(2, 1fr)
	}
}

@media (max-width:991px) {
	.prod-hero {
		padding: 70px 0 90px
	}

	.prod-hero-inner {
		grid-template-columns: 1fr;
		gap: 40px
	}

	.prod-hero-right {
		min-height: 280px
	}

	.prod-chip.c5,
	.prod-chip.c6 {
		display: none
	}

	.prod-hero p {
		max-width: none
	}

	.prod-redesign .row.g-3:first-of-type {
		grid-template-columns: repeat(2, 1fr)
	}

	.prod-step {
		grid-template-columns: 110px 1fr;
		gap: 32px;
		padding: 32px 0
	}

	.prod-step .num-circle {
		width: 78px;
		height: 78px;
		font-size: 28px
	}

	.prod-steps-wrap::before {
		left: calc(30px + 39px)
	}

	.prod-redesign .prod-step h3.service-detail_title {
		font-size: 26px
	}
}

@media (max-width:768px) {
	.prod-hero {
		padding: 56px 0 76px
	}

	.prod-hero-inner {
		padding: 0 20px;
		gap: 36px
	}

	.prod-tag {
		font-size: 10px;
		padding: 7px 14px;
		letter-spacing: .16em;
		margin-bottom: 18px
	}

	.prod-redesign h1 {
		font-size: clamp(28px, 6.5vw, 40px);
		margin-bottom: 18px
	}

	.prod-redesign h1::after {
		width: 60px;
		height: 3px;
		margin-top: 18px
	}

	.prod-hero p {
		font-size: 15px;
		line-height: 1.7
	}

	.prod-hero-right {
		min-height: 240px
	}

	.prod-section {
		padding: 40px 0 70px
	}

	.prod-container {
		padding: 0 16px
	}

	.prod-intro-card-body {
		padding: 24px 22px
	}

	.prod-redesign .row.g-3:last-of-type {
		grid-template-columns: 1fr
	}

	.prod-steps-wrap {
		padding: 8px 20px
	}

	.prod-step {
		grid-template-columns: 90px 1fr;
		gap: 24px;
		padding: 28px 0
	}

	.prod-step .num-circle {
		width: 68px;
		height: 68px;
		font-size: 24px;
		border-width: 2px
	}

	.prod-step .num-circle::before {
		inset: -4px
	}

	.prod-step .ph {
		font-size: 9px;
		margin-top: 10px
	}

	.prod-steps-wrap::before {
		left: calc(20px + 34px)
	}

	.prod-redesign .prod-step h3.service-detail_title {
		font-size: 22px
	}

	.prod-step .body {
		font-size: 15px
	}

	.prod-step .meta-row {
		font-size: 10.5px;
		gap: 12px 18px;
		margin-top: 14px
	}
}

@media (max-width:600px) {
	.prod-hero {
		padding: 48px 0 64px
	}

	.prod-hero-inner {
		padding: 0 16px;
		gap: 28px
	}

	.prod-redesign h1 {
		font-size: clamp(26px, 7.5vw, 36px)
	}

	.prod-tag {
		flex-wrap: wrap;
		line-height: 1.4;
		font-size: 9.5px
	}

	.prod-section-head {
		flex-direction: column;
		align-items: flex-start
	}

	.prod-redesign .row.g-3:first-of-type {
		grid-template-columns: 1fr;
		gap: 10px !important
	}

	.prod-redesign .process-box a {
		padding: 12px 14px;
		font-size: 13px
	}

	.prod-steps-wrap {
		padding: 0 16px
	}

	.prod-step {
		grid-template-columns: 1fr;
		gap: 16px;
		padding: 28px 0
	}

	.prod-step .step-marker {
		display: flex;
		align-items: center;
		gap: 16px
	}

	.prod-step .num-circle {
		width: 60px;
		height: 60px;
		font-size: 22px;
		flex-shrink: 0
	}

	.prod-step .num-circle::before {
		display: none
	}

	.prod-step .ph {
		margin-top: 0;
		text-align: left
	}

	.prod-steps-wrap::before {
		display: none
	}

	.prod-redesign .prod-step h3.service-detail_title {
		font-size: 20px
	}
}

@media (max-width:480px) {
	.prod-hero-right {
		min-height: 220px
	}

	.prod-hero-right .prod-ring.r1 {
		width: 240px;
		height: 240px
	}

	.prod-hero-right .prod-ring.r2 {
		width: 180px;
		height: 180px
	}

	.prod-hero-right .prod-ring.r3 {
		width: 130px;
		height: 130px
	}

	.prod-core {
		width: 96px;
		height: 96px
	}

	.prod-core .seal-icon {
		width: 38px;
		height: 38px
	}

	.prod-chip {
		font-size: 11px;
		padding: 5px 10px;
		letter-spacing: .2px
	}

	.prod-redesign .faq-production .acc-btn {
		padding: 16px 18px;
		font-size: 14.5px;
		gap: 12px
	}

	.prod-redesign .faq-production .icon-outer {
		width: 32px;
		height: 32px
	}

	.prod-redesign .faq-production .acc-content,
	.prod-redesign .faq-production .acc-content.current {
		padding-left: 62px;
		padding-right: 18px
	}
}

@media (max-width:380px) {
	.prod-hero-right {
		min-height: 200px
	}

	.prod-hero-right .prod-ring.r1 {
		width: 200px;
		height: 200px
	}

	.prod-hero-right .prod-ring.r2 {
		width: 150px;
		height: 150px
	}

	.prod-hero-right .prod-ring.r3 {
		width: 110px;
		height: 110px
	}

	.prod-core {
		width: 80px;
		height: 80px
	}

	.prod-core .seal-icon {
		width: 32px;
		height: 32px
	}

	.prod-chip.c3,
	.prod-chip.c4 {
		display: none
	}
}



.video_tc {
	position: fixed;
	left: 0;
	top: 0;
	background: rgb(0, 0, 0, 0.7);
	z-index: 9999;
	display: none;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.video_tc.on {
	display: flex;
}

.video_tc .inner {
	width: 500px;
	max-width: 100%;
	position: relative;
	font-size: 0;
}

.video_tc .inner video {
	width: 100%;
}

.video_tc .inner .v_close {
	position: absolute;
	top: -20px;
	right: -20px;
	z-index: 1056;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #ffd732;
	color: #0059b2;
	border: 3px solid #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: 0 10px 24px -6px rgba(0, 0, 0, .5);
	transition: all .25s ease;
	padding: 0;
}







/*  */
.psc-cta {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 16px 28px;
	background: #ffd732;
	color: #222 !important;
	border-radius: 50px;
	font-family: "Barlow", sans-serif;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 15px;
	text-decoration: none !important;
	position: relative;
	overflow: hidden;
	transition: transform .25s ease, box-shadow .25s ease;
}

.psc-section {
	padding: 50px 0;
	margin-top: 50px;
	position: relative;
}

.psc-container {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 30px
}

.psc-card {
	position: relative;
	margin-top: -70px;
	background: #fff;
	border-radius: 24px;
	box-shadow:
		0 1px 0 rgba(15, 37, 64, .04),
		0 30px 60px -20px rgba(15, 37, 64, .22),
		0 12px 30px -10px rgba(15, 37, 64, .12);
	overflow: hidden;
}

.psc-card::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 5px;
	background: #ffd732;
	z-index: 5;
}

.psc-card-header {
	padding: 26px 36px;
	background: linear-gradient(135deg, #0059b2 0%, #01478d 100%);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 18px;
	border-bottom: 1px solid #ffd732;
}

.psc-card-h-left {
	display: flex;
	align-items: center;
	gap: 16px
}

.psc-icon-box {
	width: 48px;
	height: 48px;
	border-radius: 12px;
	background: linear-gradient(135deg, #0059b2, #01478d);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 10px 22px -6px rgba(14, 165, 233, .55), inset 0 1px 0 rgba(255, 255, 255, .25);
	flex-shrink: 0;
}

.psc-card-h-title {
	font-size: 18px;
	font-weight: 500;
	margin: 0;
	color: #fff;
}

.psc-card-h-sub {
	font-size: 13px;
	color: #ededed;
	margin: 3px 0 0;
	text-transform: uppercase
}

.psc-legend {
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap
}

.psc-legend-item {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #cbd5e1;
	font-size: 12px;
	font-weight: 500
}

.psc-legend-item .sw {
	width: 14px;
	height: 14px;
	border-radius: 4px;
	display: inline-block
}

.psc-legend-item .sw.id {
	background: linear-gradient(135deg, #e0f2fe, #bae6fd);
	border: 1px solid #7dd3fc
}

.psc-legend-item .sw.val {
	background: #f1f5f9;
	border: 1px solid #cbd5e1
}

.psc-legend-item .sw.na {
	background: #fafbfc;
	border: 1px dashed #cbd5e1
}

/* ---------- TABLE ---------- */
.psc-table-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	max-height: 90vh;
	position: relative;
}

.psc-table-wrap::-webkit-scrollbar {
	height: 10px;
	width: 10px
}

.psc-table-wrap::-webkit-scrollbar-track {
	background: #f1f5f9
}

.psc-table-wrap::-webkit-scrollbar-thumb {
	background: linear-gradient(135deg, #0059b2, #01478d);
	border-radius: 6px
}

.psc-table-wrap::-webkit-scrollbar-thumb:hover {
	background: linear-gradient(135deg, #01478d, #0059b2)
}

.psc-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	font-size: 13px;
	font-family: 'Rubik', sans-serif;
	margin: 0;
}

.psc-table td {
	padding: 13px 12px;
	text-align: center;
	border-bottom: 1px solid #f1f5f9;
	color: #334155;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
	transition: background-color .12s ease, color .12s ease;
	background: #fff;
}

/* The two header rows (.tbl-main) */
.psc-table tr.tbl-main:first-child td {
	background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
	color: #fff;
	font-weight: 500;
	font-size: 15px;
	text-transform: uppercase;
	;
	padding: 18px 12px;
	border: none;
	position: sticky;
	top: 0;
	z-index: 3;
}

.psc-table tr.tbl-main:nth-child(2) td {
	background: linear-gradient(135deg, #0059b2 0%, #01478d 100%);
	color: #fff;
	font-weight: 400;
	font-size: 14px;
	text-transform: uppercase;
	padding: 13px 10px;
	border: none;
	position: sticky;
	top: 55px;
	z-index: 2;
	border-right: 1px solid rgba(255, 255, 255, .1);
}

.psc-table tr.tbl-main:nth-child(2) td:last-child {
	border-right: none
}

/* Body rows */
.psc-table tbody tr:not(.tbl-main):nth-child(even) td {
	background: #fafbfc
}

.psc-table tbody tr:not(.tbl-main):hover td {
	background: #eff6ff !important
}

/* First 3 columns = identifier columns (NPS, DN, OD) */
.psc-table tbody tr:not(.tbl-main) td:nth-child(1),
.psc-table tbody tr:not(.tbl-main) td:nth-child(2),
.psc-table tbody tr:not(.tbl-main) td:nth-child(3) {
	font-weight: 700;
	color: #0c4a6e;
	background: linear-gradient(90deg, #f0f9ff, #f8fafc);
}

.psc-table tbody tr:not(.tbl-main):hover td:nth-child(1),
.psc-table tbody tr:not(.tbl-main):hover td:nth-child(2),
.psc-table tbody tr:not(.tbl-main):hover td:nth-child(3) {
	background: linear-gradient(90deg, #e0f2fe, #f0f9ff) !important;
	color: #075985;
}

.psc-table tbody tr:not(.tbl-main) td:nth-child(1) {
	position: relative;
	border-left: 3px solid transparent;
}

.psc-table tbody tr:not(.tbl-main):hover td:nth-child(1) {
	border-left-color: #01478d;
}

.psc-table tbody tr:not(.tbl-main) td:nth-child(3) {
	border-right: 2px solid #e2e8f0;
	font-size: 14px;
}

/* Empty (em-dash) cells - styled via JS-added class */
.psc-table td.psc-empty {
	color: #333;
	font-weight: 300
}

/* ---------- FOOTNOTE STRIP ---------- */
.psc-foot-strip {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	padding: 22px 36px;
	background: linear-gradient(135deg, #f8fafc 0%, #eff6ff 100%);
	border-top: 1px solid #e2e8f0;
	align-items: center;
	justify-content: space-between;
}

.psc-foot-meta {
	display: flex;
	align-items: center;
	gap: 12px;
	color: #475569;
	font-size: 13px
}

.psc-foot-meta .ic {
	width: 34px;
	height: 34px;
	border-radius: 10px;
	background: linear-gradient(135deg, #0059b2, #01478d);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	flex-shrink: 0;
	box-shadow: 0 6px 14px -4px rgba(14, 165, 233, .5);
}

.psc-foot-meta strong {
	color: #0f172a;
	font-weight: 700
}

.psc-foot-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid #e2e8f0;
	color: #0c4a6e;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
}

.psc-foot-pill .dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #22c55e;
	box-shadow: 0 0 8px rgba(34, 197, 94, .6)
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:991px) {
	.psc-hero-inner {
		grid-template-columns: 1fr;
		gap: 40px
	}

	.psc-hero-right {
		min-height: 260px
	}

	.psc-chip.c5,
	.psc-chip.c6 {
		display: none
	}
}

@media (max-width:768px) {
	.psc-hero {
		padding: 60px 0 110px
	}

	.psc-hero-inner {
		padding: 0 20px
	}

	.psc-container {
		padding: 0 16px
	}

	.psc-card-header {
		padding: 20px 22px
	}

	.psc-foot-strip {
		padding: 18px 22px
	}

	.psc-card {
		border-radius: 18px;
		margin-top: -60px
	}

	.psc-table td {
		padding: 11px 9px;
		font-size: 12px
	}

	.psc-table tr.tbl-main:first-child td {
		padding: 14px 9px;
		font-size: 12px
	}

	.psc-table tr.tbl-main:nth-child(2) td {
		padding: 11px 8px;
		font-size: 11px;
		top: 48px
	}

	.psc-cta {
		padding: 14px 22px;
		font-size: 14px
	}

	.psc-legend {
		display: none
	}
}

@media (max-width:480px) {
	.psc-hero-right .psc-ring.r1 {
		width: 240px;
		height: 240px
	}

	.psc-hero-right .psc-ring.r2 {
		width: 180px;
		height: 180px
	}

	.psc-hero-right .psc-ring.r3 {
		width: 130px;
		height: 130px
	}

	.psc-core {
		width: 96px;
		height: 96px;
		font-size: 34px
	}
}




/*  */
.psc-v3-section {
	padding: 0 0 80px;
	position: relative;
}

.psc-v3-container {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 30px
}

/* === INTRO PARAGRAPHS (plain, no card) === */
.psc-v3-intro {
	margin-bottom: 30px;
	padding: 30px 0;
	position: relative;
	z-index: 2;
}

.psc-v3-intro p {
	color: #222;
	font-size: 16px;
	line-height: 1.75;
	margin: 0 0 14px;
}

.psc-v3-intro p:last-child {
	margin-bottom: 0
}

.psc-v3-intro p strong {
	color: #0059b2;
	font-weight: 700
}

/* === STATS STRIP === */
.psc-v3-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
	margin-bottom: 30px;
}

.psc-v3-stat {
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 14px;
	padding: 16px 18px;
	display: flex;
	align-items: center;
	gap: 14px;
	position: relative;
	overflow: hidden;
	box-shadow: 0 2px 6px -2px rgba(15, 23, 42, .06);
}

.psc-v3-stat::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 4px;
	background: #0059b2;
}

.psc-v3-stat.yellow::before {
	background: #ffd732
}

.psc-v3-stat.green::before {
	background: #22c55e
}

.psc-v3-stat-ico {
	width: 42px;
	height: 42px;
	border-radius: 10px;
	flex-shrink: 0;
	background: linear-gradient(135deg, #0059b2 0%, #01478d 100%);
	color: #ffd732;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.psc-v3-stat.yellow .psc-v3-stat-ico {
	background: linear-gradient(135deg, #ffd732 0%, #f59e0b 100%);
	color: #0059b2;
}

.psc-v3-stat.green .psc-v3-stat-ico {
	background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
	color: #fff;
}

.psc-v3-stat-body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0
}

.psc-v3-stat-n {
	font-family: 'Barlow', sans-serif;
	font-size: 20px;
	font-weight: 800;
	color: #0f172a;
	line-height: 1;
	letter-spacing: -.01em;
}

.psc-v3-stat-l {
	font-size: 13px;
	font-weight: 500;
	color: #222;
	text-transform: uppercase;
}

/* === SPLIT (sidebar + data panel) === */
.psc-v3-split {
	display: grid;
	grid-template-columns: 260px 1fr;
	gap: 18px;
}

/* SIDEBAR */
.psc-v3-sidebar {
	background: #fff;
	border-radius: 16px;
	border: 1px solid #e2e8f0;
	padding: 18px;
	align-self: start;
	position: static;
	box-shadow: 0 4px 12px -4px rgba(15, 23, 42, .06);
}

.psc-v3-sidebar-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 4px 14px;
	margin-bottom: 6px;
	border-bottom: 1px solid #f1f5f9;
}

.psc-v3-sidebar-title {
	font-family: 'Barlow', sans-serif;
	font-size: 16px;
	font-weight: 600;
	color: #475569;
	text-transform: uppercase;
}

.psc-v3-sidebar-count {
	font-family: 'Barlow', sans-serif;
	font-size: 13px;
	font-weight: 800;
	background: #0059b2;
	color: #ffd732;
	padding: 3px 8px;
	border-radius: 6px;
}

/* Tabs (JS-rendered) — vertical list */
.tabs {
	display: flex;
	flex-direction: column;
	gap: 2px;
	max-height: none;
	overflow: visible;
	padding: 6px 2px;
	margin: 0 -2px;
}

.tabs::-webkit-scrollbar {
	width: 5px
}

.tabs::-webkit-scrollbar-track {
	background: transparent
}

.tabs::-webkit-scrollbar-thumb {
	background: #cbd5e1;
	border-radius: 5px
}

.tabs::-webkit-scrollbar-thumb:hover {
	background: #0059b2
}

.tabs ul li {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 11px 14px;
	background: transparent;
	border: none;
	color: #475569;
	cursor: pointer;
	font-family: 'Rubik', sans-serif;
	font-size: 13.5px;
	font-weight: 600;
	text-align: left;
	border-radius: 10px;
	position: relative;
	transition: all .2s ease;
}

.tabs ul li::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 2px;
	flex-shrink: 0;
	background: #cbd5e1;
	transition: all .2s ease;
}

.tabs ul li:hover {
	background: #f1f5f9;
	color: #0f172a
}

.tabs ul li:hover::before {
	background: #ffd732;
	transform: scale(1.3);
	box-shadow: 0 0 8px rgba(255, 215, 50, .7)
}

.tabs ul li.on {
	background: linear-gradient(135deg, #0059b2 0%, #01478d 100%);
	color: #fff;
	font-weight: 700;
	box-shadow: 0 8px 18px -6px rgba(0, 89, 178, .5);
}

.tabs ul li.on::before {
	background: #ffd732 !important;
	box-shadow: 0 0 12px rgba(255, 215, 50, 1);
	transform: scale(1.4);
}

.tabs ul li.on::after {
	content: "→";
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 14px;
	font-weight: 700;
	color: #ffd732;
}

/* DATA PANEL */
.psc-v3-panel {
	background: #fff;
	border-radius: 16px;
	border: 1px solid #e2e8f0;
	overflow: hidden;
	box-shadow: 0 4px 12px -4px rgba(15, 23, 42, .06);
	min-width: 0;
}

/* Panel header (royal blue terminal-style) */
.psc-v3-panel-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 14px 22px;
	background: linear-gradient(135deg, #0059b2 0%, #01478d 100%);
	color: #fff;
	flex-wrap: wrap;
	gap: 12px;
}

.psc-v3-ph-left {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
	flex-wrap: wrap
}

.psc-v3-ph-dots {
	display: inline-flex;
	gap: 5px
}

.psc-v3-ph-dots span {
	width: 9px;
	height: 9px;
	border-radius: 50%
}

.psc-v3-ph-dots span:nth-child(1) {
	background: #ef4444
}

.psc-v3-ph-dots span:nth-child(2) {
	background: #ffd732
}

.psc-v3-ph-dots span:nth-child(3) {
	background: #22c55e
}

.psc-v3-ph-path {
	font-family: 'Barlow', sans-serif;
	font-size: 13px;
	font-weight: 600;
	color: #cbd5e1;
	letter-spacing: .02em;
}

.psc-v3-ph-path .sep {
	color: #7dd3fc;
	margin: 0 6px
}

.psc-v3-ph-path .grade-name {
	color: #ffd732;
	font-weight: 800
}

.psc-v3-ph-right {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #ffd732;
}

.psc-v3-ph-right .d {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #ffd732;
	box-shadow: 0 0 10px rgba(255, 215, 50, .9);
	animation: v3-blink 1.4s ease-in-out infinite;
}

@keyframes v3-blink {

	0%,
	100% {
		opacity: 1
	}

	50% {
		opacity: .3
	}
}

/* Loading badge */
.loading {
	display: inline-block;
	font-size: 11px;
	color: #0059b2;
	font-weight: 800;
	letter-spacing: .08em;
	padding: 3px 9px;
	border-radius: 6px;
	background: #ffd732;
	font-family: 'Barlow', sans-serif;
}

.loading:empty {
	display: none
}

/* Table wrap */
.table-responsive {
	overflow-x: auto;
	max-height: 75vh;
	position: relative;
}

.table-responsive::-webkit-scrollbar {
	height: 10px;
	width: 10px
}

.table-responsive::-webkit-scrollbar-track {
	background: #f8fafc
}

.table-responsive::-webkit-scrollbar-thumb {
	background: linear-gradient(135deg, #0059b2, #01478d);
	border-radius: 6px
}

.psc-v3 table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	font-family: 'Rubik', sans-serif;
	font-size: 14px;
	margin: 0;
}

/* Header row (.tbl-main is the original class) */
.psc-v3 table tr.tbl-main td {
	background: #f8fafc;
	color: #0059b2;
	font-family: 'Barlow', sans-serif;
	font-weight: 800;
	font-size: 14px;
	text-transform: uppercase;
	padding: 18px 18px 20px;
	border: none;
	border-bottom: 3px solid #ffd732;
	position: sticky;
	top: 0;
	z-index: 3;
	text-align: left;
	box-shadow: 0 12px 16px -8px rgba(0, 89, 178, .18), 0 6px 8px -6px rgba(15, 37, 64, .08);
}

/* Extra breathing room between sticky header and the first body row */
.psc-v3 table tbody tr:not(.tbl-main):first-child td {
	padding-top: 20px;
}

.psc-v3 table tr.tbl-main td:first-child {
	text-align: center;
	width: 70px;
}

.psc-v3 table tr.tbl-main td:last-child {
	text-align: right
}

/* Body cells */
.psc-v3 table td {
	padding: 13px 18px;
	border-bottom: 1px solid #f1f5f9;
	color: #334155;
	background: #fff;
	font-variant-numeric: tabular-nums;
	transition: background-color .12s ease;
	vertical-align: middle;
}

.psc-v3 table tbody tr:not(.tbl-main):nth-child(even) td {
	background: #fafbfc
}

.psc-v3 table tbody tr:not(.tbl-main):hover td {
	background: #fff8e1 !important;
}

/* Row index column */
.psc-v3 table tbody tr:not(.tbl-main) td:nth-child(1) {
	text-align: center;
	width: 70px;
	font-family: 'Barlow', sans-serif;
	font-size: 12px;
	font-weight: 700;
	color: #94a3b8;
	letter-spacing: .04em;
	border-right: 1px solid #f1f5f9;
}

.psc-v3 table tbody tr:not(.tbl-main):hover td:nth-child(1) {
	color: #0059b2;
	background: #fff8e1 !important;
}

/* Products column */
.psc-v3 table tbody tr:not(.tbl-main) td:nth-child(2) {
	font-weight: 600;
	color: #0f172a
}

.psc-v3 table tbody tr:not(.tbl-main) td:nth-child(3) {
	font-weight: 700;
	color: #475569
}

.psc-v3 table tbody tr:not(.tbl-main) td:nth-child(4) {
	font-family: 'Barlow', sans-serif;
	font-weight: 600;
	color: #1e293b;
	letter-spacing: .01em;
}

/* Stock column */
.psc-v3 table tbody tr:not(.tbl-main) td:nth-child(5) {
	text-align: right;
	font-weight: 700;
	padding-right: 24px;
}

.psc-v3 table td.available {
	color: #0059b2;
	position: relative
}

.psc-v3 table td.available::before {
	content: "●";
	display: inline-block;
	margin-right: 10px;
	color: #22c55e;
	font-size: 10px;
	animation: v3-pulse 2s ease-in-out infinite;
	vertical-align: middle;
	text-shadow: 0 0 8px rgba(34, 197, 94, .6);
}

.psc-v3 table td.out {
	color: #cbd5e1;
	font-weight: 500;
	font-style: italic
}

.psc-v3 table td.out::before {
	content: "○";
	display: inline-block;
	margin-right: 10px;
	color: #cbd5e1;
	font-size: 10px;
	vertical-align: middle;
}

@keyframes v3-pulse {

	0%,
	100% {
		opacity: 1
	}

	50% {
		opacity: .4
	}
}

/* Loading row */
.psc-v3 table tbody tr td[colspan] {
	text-align: center !important;
	padding: 60px 20px !important;
	color: #64748b;
	background: repeating-linear-gradient(45deg, #fafbfc, #fafbfc 10px, #f8fafc 10px, #f8fafc 20px) !important;
	font-family: 'Barlow', sans-serif;
	font-weight: 600;
	letter-spacing: .06em;
}

/* Panel footer */
.psc-v3-panel-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 14px;
	padding: 14px 22px;
	background: #fff8e1;
	border-top: 1px solid #ffd732;
	font-size: 12px;
	color: #475569;
}

.psc-v3-pf-left {
	display: inline-flex;
	align-items: center;
	gap: 10px
}

.psc-v3-pf-left .check {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: #0059b2;
	color: #ffd732;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.psc-v3-pf-left strong {
	color: #0059b2;
	font-weight: 800
}

.psc-v3-pf-legend {
	display: inline-flex;
	align-items: center;
	gap: 14px
}

.psc-v3-pf-legend span {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #475569
}

.psc-v3-pf-legend .d {
	font-size: 9px
}

.psc-v3-pf-legend .av {
	color: #22c55e
}

.psc-v3-pf-legend .ot {
	color: #cbd5e1
}

/* ---------- CTA ---------- */
.psc-v3 .project-four,
.psc-v3-cta {
	position: relative;
	background: #fff;
	padding: 0 0 80px
}

.psc-v3-cta-inner {
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 30px
}

.psc-v3-cta-box {
	position: relative;
	border-radius: 24px;
	padding: 50px 60px;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	flex-wrap: wrap;
	background:
		radial-gradient(circle at 100% 100%, rgba(255, 215, 50, .25), transparent 50%),
		radial-gradient(circle at 0% 0%, rgba(125, 211, 252, .18), transparent 50%),
		linear-gradient(135deg, #0059b2 0%, #01478d 60%, #0059b2 100%);
}

.psc-v3-cta-box::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(255, 215, 50, .08) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 215, 50, .08) 1px, transparent 1px);
	background-size: 40px 40px;
	mask-image: radial-gradient(ellipse 80% 80% at center, #000, transparent 90%);
	-webkit-mask-image: radial-gradient(ellipse 80% 80% at center, #000, transparent 90%);
}

.psc-v3-cta-box::after {
	content: "";
	position: absolute;
	right: -80px;
	top: -80px;
	width: 300px;
	height: 300px;
	border-radius: 50%;
	border: 1px dashed rgba(255, 215, 50, .5);
	animation: v3-spin 30s linear infinite;
}

.psc-v3-cta-text {
	position: relative;
	z-index: 2;
	font-family: 'Barlow', sans-serif;
	font-size: clamp(22px, 2.2vw, 32px);
	font-weight: 700;
	line-height: 1.25;
	color: #fff;
	letter-spacing: -.015em;
	max-width: 680px;
}

.psc-v3-cta-btn {
	position: relative;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 18px 32px;
	background: #ffd732;
	color: #0059b2 !important;
	border-radius: 999px;
	font-weight: 800;
	font-size: 14px;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-decoration: none !important;
	box-shadow: 0 14px 30px -8px rgba(255, 215, 50, .5), inset 0 1px 0 rgba(255, 255, 255, .4);
	transition: transform .25s ease, gap .25s ease, box-shadow .25s ease;
}

.psc-v3-cta-btn .arr {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: #0059b2;
	color: #ffd732;
	transition: transform .25s ease;
}

.psc-v3-cta-btn:hover {
	transform: translateY(-2px);
	gap: 16px;
	box-shadow: 0 20px 40px -10px rgba(255, 215, 50, .65);
}

.psc-v3-cta-btn:hover .arr {
	transform: rotate(-12deg)
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1100px) {
	.psc-v3-split {
		grid-template-columns: 220px 1fr
	}

	.psc-v3-stats {
		grid-template-columns: repeat(2, 1fr)
	}
}

@media (max-width:900px) {
	.psc-v3-hero-inner {
		grid-template-columns: 1fr;
		gap: 40px
	}

	.psc-v3-hero-right {
		min-height: 280px
	}

	.psc-v3-grade-chip.c5,
	.psc-v3-grade-chip.c6 {
		display: none
	}

	.psc-v3-split {
		grid-template-columns: 1fr;
		gap: 14px
	}

	.psc-v3-sidebar {
		position: static;
		padding: 14px
	}

	.psc-v3-sidebar-head {
		padding-bottom: 10px;
		margin-bottom: 10px
	}

	.tabs {
		flex-direction: row;
		flex-wrap: nowrap;
		max-height: none;
		overflow-x: auto;
		overflow-y: hidden;
		gap: 8px;
		padding: 4px 2px 8px
	}

	.tabs button {
		width: auto;
		flex-shrink: 0;
		padding: 9px 14px
	}

	.tabs button.active::after {
		display: none
	}
}

@media (max-width:768px) {
	.psc-v3-hero-inner {
		padding: 0 20px
	}

	.psc-v3-container {
		padding: 0 16px
	}

	.psc-v3-stats {
		grid-template-columns: 1fr 1fr;
		gap: 10px
	}

	.psc-v3-stat {
		padding: 13px 14px;
		gap: 11px
	}

	.psc-v3-stat-n {
		font-size: 17px
	}

	.psc-v3-cta-box {
		padding: 36px 28px;
		flex-direction: column;
		align-items: flex-start
	}

	.psc-v3 table td {
		padding: 11px 12px;
		font-size: 12.5px
	}

	.psc-v3 table tr.tbl-main td {
		padding: 13px 12px;
		font-size: 10px
	}

	.psc-v3 table tr.tbl-main td:first-child,
	.psc-v3 table tbody tr:not(.tbl-main) td:nth-child(1) {
		width: 50px;
		padding: 11px 8px
	}

	.psc-v3-ph-right {
		display: none
	}

	.psc-v3-split {
		display: inherit;
	}
}

@media (max-width:480px) {
	.psc-v3-stats {
		grid-template-columns: 1fr
	}

	.psc-v3 h1 {
		font-size: 38px
	}

	.psc-v3-hero-right .psc-v3-ring.r1 {
		width: 240px;
		height: 240px
	}

	.psc-v3-hero-right .psc-v3-ring.r2 {
		width: 180px;
		height: 180px
	}

	.psc-v3-hero-right .psc-v3-ring.r3 {
		width: 130px;
		height: 130px
	}

	.psc-v3-core {
		width: 96px;
		height: 96px;
		font-size: 34px
	}

	.psc-v3-cta-box {
		padding: 30px 22px
	}
}




/*  */
/* =========================================================
   NEWS PAGE  REDESIGNED
   Hero (matches pipe-size-chart + certificate)
   + Modern news card grid (bento style)
   ========================================================= */
.news-redesign {
	font-family: 'Rubik', 'Barlow', system-ui, -apple-system, sans-serif;
	color: #0f172a;
	-webkit-font-smoothing: antialiased
}

.news-redesign * {
	box-sizing: border-box
}

/* ---------- HERO ---------- */
.news-hero {
	position: relative;
	background:
		radial-gradient(1200px 500px at 85% 0%, rgba(56, 189, 248, .18), transparent 60%),
		radial-gradient(900px 400px at 10% 100%, rgba(14, 165, 233, .14), transparent 60%),
		linear-gradient(135deg, #0059b2 0%, #0059b2 45%, #0059b2 100%);
	color: #fff;
	padding: 60px 0;
	overflow: hidden;
}

.news-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(125, 211, 252, .06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(125, 211, 252, .06) 1px, transparent 1px);
	background-size: 48px 48px;
	mask-image: radial-gradient(ellipse at center, #000 40%, transparent 85%);
	-webkit-mask-image: radial-gradient(ellipse at center, #000 40%, transparent 85%);
}

.news-hero-inner {
	position: relative;
	z-index: 2;
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 30px;
	display: grid;
	grid-template-columns: 1.4fr .8fr;
	gap: 50px;
	align-items: center;
}

.news-hero-left {
	min-width: 0
}

.news-tag {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 16px;
	background: rgba(255, 215, 50, .12);
	border: 1px solid rgba(255, 215, 50, .5);
	border-radius: 999px;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	margin-bottom: 22px;
}

.news-tag .dot {
	position: relative;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #ffd732;
	box-shadow: 0 0 12px rgba(255, 215, 50, .9);
}

.news-tag .dot::after {
	content: "";
	position: absolute;
	inset: -4px;
	border-radius: 50%;
	border: 2px solid rgba(255, 215, 50, .4);
	animation: news-ping 1.8s ease-out infinite;
}

@keyframes news-ping {
	0% {
		transform: scale(.5);
		opacity: 1
	}

	100% {
		transform: scale(2.2);
		opacity: 0
	}
}

.news-redesign h1 {
	font-family: 'Barlow', sans-serif;
	color: #fff !important;
	font-size: clamp(38px, 5.4vw, 68px);
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -.02em;
	margin: 0 0 22px;
}

.news-redesign h1 .accent {
	color: #ffd732
}

.news-redesign h1::after {
	content: "";
	display: block;
	width: 80px;
	height: 4px;
	border-radius: 4px;
	margin-top: 22px;
	background: linear-gradient(90deg, #ffd732, transparent);
}

.news-hero p {
	color: #cbd5e1;
	font-size: 17px;
	line-height: 1.75;
	max-width: 640px;
	margin: 0;
}

.news-hero p strong {
	color: #fff;
	font-weight: 600
}

/* Hero right - newspaper/broadcast themed core */
.news-hero-right {
	position: relative;
	min-height: 300px;
	display: flex;
	align-items: center;
	justify-content: center
}

.news-ring {
	position: absolute;
	border-radius: 50%;
	border: 1px dashed rgba(255, 215, 50, .8)
}

.news-ring.r1 {
	width: 300px;
	height: 300px;
	animation: news-spin 38s linear infinite
}

.news-ring.r2 {
	width: 230px;
	height: 230px;
	border-style: solid;
	border-color: rgba(255, 215, 50, .8);
	animation: news-spin 24s linear infinite reverse
}

.news-ring.r3 {
	width: 160px;
	height: 160px;
	border-style: dotted;
	border-color: rgba(255, 215, 50, .8);
	animation: news-spin 18s linear infinite
}

.news-core {
	position: relative;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #ffe572, #ffd732 50%, #b88f00 100%);
	box-shadow:
		0 0 0 6px rgba(255, 255, 255, .04),
		0 0 0 10px rgba(255, 215, 50, .12),
		0 30px 60px -10px rgba(255, 215, 50, .55),
		inset 0 0 30px rgba(0, 0, 0, .25);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0059b2;
}

.news-core .seal-icon {
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .25))
}

@keyframes news-spin {
	from {
		transform: rotate(0)
	}

	to {
		transform: rotate(360deg)
	}
}

.news-chips {
	position: absolute;
	inset: 0;
	pointer-events: none
}

.news-chip {
	position: absolute;
	padding: 7px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .06);
	border: 1px solid #ffd732;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
	letter-spacing: .4px;
}

.news-chip.c1 {
	top: 6%;
	left: -2%
}

.news-chip.c2 {
	top: 18%;
	right: -6%
}

.news-chip.c3 {
	bottom: 10%;
	left: -4%
}

.news-chip.c4 {
	bottom: 4%;
	right: 4%
}

.news-chip.c5 {
	top: 48%;
	right: -8%
}

.news-chip.c6 {
	top: 50%;
	left: -8%
}

/* ---------- NEWS CARDS SECTION ---------- */
.news-section {
	padding: 40px 0;
	position: relative;
}

.news-container {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 30px
}

/* Section heading bar */
.news-section-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	margin-bottom: 36px;
}

.news-eyebrow {
	display: inline-block;
	font-size: 14px;
	font-weight: 500;
	color: #0284c7;
	text-transform: uppercase;
	padding: 6px 14px;
	border-radius: 999px;
	border: 1px solid #bae6fd;
	margin-bottom: 14px;
}

.news-section-title {
	font-family: 'Barlow', sans-serif;
	font-size: clamp(26px, 3vw, 36px);
	font-weight: 800;
	color: #0f172a;
	line-height: 1.15;
	margin: 0;
	letter-spacing: -.015em;
}

.news-count-pill {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 18px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	color: #0c4a6e;
	text-transform: uppercase;
}

.news-count-pill .dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #22c55e;
	box-shadow: 0 0 8px rgba(34, 197, 94, .7);
}

/* ============== MAGAZINE / EDITORIAL LAYOUT ============== */
/* Layout strategy:
   - Card #1 = HERO (spans left half, full height of the featured row)
   - Cards #2-5 = vertical list of horizontal "headline" rows on the right
   - Cards #6+ = regular 3-up grid below the featured row
*/
.news-redesign .news-events-section {
	display: grid !important;
	grid-template-columns: repeat(12, 1fr);
	grid-auto-rows: auto;
	gap: 24px;
	width: 100%;
}

/* Reset original card */
.news-redesign .chronicle-card {
	position: relative;
	background: #fff;
	border-radius: 14px;
	overflow: hidden;
	text-align: left;
	transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s ease, border-color .3s ease;
}

/* =========== FEATURED CARD (#1) =========== */
.news-redesign .chronicle-card:first-child {
	grid-column: span 7;
	grid-row: span 4;
	display: flex;
	flex-direction: column;
	background: #0f172a;
	border-radius: 18px;
	box-shadow: 0 30px 60px -20px rgba(15, 37, 64, .4);
	min-height: 540px;
}

.news-redesign .chronicle-card:first-child>a:first-child {
	display: block;
	position: relative;
	flex: 1;
	overflow: hidden;
	/* background:linear-gradient(135deg,#0059b2,#01478d); */
}

.news-redesign .chronicle-card:first-child>a:first-child::before {
	content: "FEATURED";
	position: absolute;
	top: 24px;
	left: 24px;
	z-index: 4;
	padding: 6px 14px;
	background: #ffd732;
	color: #0059b2;
	font-family: 'Barlow', sans-serif;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .22em;
	border-radius: 4px;
	box-shadow: 0 8px 18px -4px rgba(0, 0, 0, .3);
}

.news-redesign .chronicle-card:first-child>a:first-child::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	background:
		linear-gradient(180deg, rgba(15, 23, 42, 0) 30%, rgba(15, 23, 42, .6) 65%, rgba(15, 23, 42, .95) 100%),
		linear-gradient(135deg, rgba(0, 89, 178, .2), transparent 60%);
	pointer-events: none;
}

.news-redesign .chronicle-card:first-child>a:first-child img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 60px;
	background: linear-gradient(135deg, #0059b2 0%, #01478d 100%);
	transition: transform 1s cubic-bezier(.2, .7, .2, 1);
}

.news-redesign .chronicle-card:first-child:hover>a:first-child img {
	transform: scale(1.06)
}

/* Title overlay on the dark gradient */
.news-redesign .chronicle-card:first-child h3 {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 80px;
	z-index: 3;
	margin: 0;
	padding: 0 36px;
	font-family: 'Barlow', sans-serif;
	font-size: clamp(24px, 2.4vw, 34px);
	font-weight: 800;
	color: #fff;
	line-height: 1.18;
	letter-spacing: -.015em;
	text-shadow: 0 2px 16px rgba(0, 0, 0, .5);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.news-redesign .chronicle-card:first-child>div {
	position: absolute;
	left: 36px;
	bottom: 36px;
	z-index: 3;
	font-size: 12px;
	font-weight: 700;
	color: #ffd732;
	letter-spacing: .14em;
	text-transform: uppercase;
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.news-redesign .chronicle-card:first-child>div::before {
	content: "";
	display: inline-block;
	width: 18px;
	height: 1px;
	background: #ffd732;
}

/* The featured card's read more button - sits in bottom right of image */
.news-redesign .chronicle-card:first-child .theme-btn {
	position: absolute;
	right: 24px;
	bottom: 24px;
	z-index: 4;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 22px;
	background: #ffd732 !important;
	color: #0059b2 !important;
	border: none !important;
	border-radius: 999px;
	font-family: 'Barlow', sans-serif;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .16em;
	text-transform: uppercase;
	text-decoration: none !important;
	box-shadow: 0 14px 30px -6px rgba(0, 0, 0, .4);
	transition: all .25s ease;
}

.news-redesign .chronicle-card:first-child .theme-btn::after {
	content: "→";
	font-size: 14px;
	font-weight: 700;
	transition: transform .25s ease;
}

.news-redesign .chronicle-card:first-child .theme-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 18px 36px -8px rgba(0, 0, 0, .55);
	background: #fff !important;
}

.news-redesign .chronicle-card:first-child .theme-btn:hover::after {
	transform: translateX(4px);
}

/* =========== RIGHT SIDE LIST (#2 - #5) =========== */
.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5) {
	grid-column: span 5;
	grid-row: span 1;
	display: grid;
	grid-template-columns: 120px 1fr;
	gap: 0;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 14px;
	overflow: hidden;
	align-items: stretch;
	min-height: 118px;
}

.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5):hover {
	border-color: #bae6fd;
	box-shadow: 0 14px 26px -14px rgba(15, 37, 64, .22);
	transform: translateX(-3px);
}

.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5)>a:first-child {
	display: block;
	position: relative;
	overflow: hidden;
	background: linear-gradient(135deg, #f0f9ff, #e0f2fe);
	border-right: 1px solid #e2e8f0;
}

.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5)>a:first-child img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 14px;
	transition: transform .6s cubic-bezier(.2, .7, .2, 1);
}

.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5):hover>a:first-child img {
	transform: scale(1.08)
}

/* Item number badge on each list card */

.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5)>a:first-child::before {
	position: absolute;
	top: 8px;
	left: 8px;
	z-index: 2;
	font-family: 'Barlow', sans-serif;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .1em;
	background: #0059b2;
	color: #ffd732;
	padding: 3px 7px;
	border-radius: 4px;
}

.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5) h3 {
	font-family: 'Barlow', sans-serif;
	font-size: 15px;
	font-weight: 700;
	color: #0f172a;
	line-height: 1.35;
	margin: 14px 18px 6px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: color .2s ease;
}

.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5):hover h3 {
	color: #0059b2
}

.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5)>div {
	font-size: 11px;
	font-weight: 600;
	color: #222;
	text-transform: uppercase;
	margin: 0 18px 6px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5)>div::before {
	content: "";
	color: #0284c7;
	font-size: 8px;
}

/* Hide redundant read-more button on list cards (whole card is clickable) */
.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5) .theme-btn {
	margin: 0 18px 14px auto;
	align-self: flex-start;
	font-size: 10px;
	font-weight: 700;
	color: #0284c7 !important;
	text-transform: uppercase;
	padding: 0;
	background: transparent !important;
	border: none !important;
	text-decoration: none !important;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5) .theme-btn::after {
	content: "";
	font-size: 13px;
	transition: transform .2s ease;
}

.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5):hover .theme-btn {
	color: #0059b2 !important
}

.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5):hover .theme-btn::after {
	transform: translateX(3px)
}

/* Make the entire list card a column of 3 items: title, date, button */
.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5)>*:not(a) {
	align-self: flex-start;
}

.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5) {
	/* Make the right side a stacked flex column with vertical fit */
}

.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5)>a:first-child {
	grid-row: 1 / span 4;
}

/* "More headlines" divider between featured group and grid */
.news-redesign .news-events-section::after {
	content: "";
	grid-column: span 12;
	display: block;
	margin: 8px 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, #cbd5e1, transparent);
}

/* =========== GRID CARDS (#6+) =========== */
.news-redesign .chronicle-card:nth-child(n+6) {
	grid-column: span 4;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 14px;
	overflow: hidden;
}

.news-redesign .chronicle-card:nth-child(n+6):hover {
	transform: translateY(-4px);
	border-color: #bae6fd;
	box-shadow: 0 16px 30px -16px rgba(15, 37, 64, .24);
}

.news-redesign .chronicle-card:nth-child(n+6)>a:first-child {
	display: block;
	position: relative;
	overflow: hidden;
	aspect-ratio: 16/10;
	background: linear-gradient(135deg, #f8fafc, #eff6ff);
}

.news-redesign .chronicle-card:nth-child(n+6)>a:first-child img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 24px;
	transition: transform .7s cubic-bezier(.2, .7, .2, 1);
}

.news-redesign .chronicle-card:nth-child(n+6):hover>a:first-child img {
	transform: scale(1.06)
}

.news-redesign .chronicle-card:nth-child(n+6) h3 {
	font-family: 'Barlow', sans-serif;
	font-size: 17px;
	font-weight: 700;
	color: #0f172a;
	line-height: 1.3;
	letter-spacing: -.005em;
	margin: 18px 20px 8px;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: color .2s ease;
}

.news-redesign .chronicle-card:nth-child(n+6):hover h3 {
	color: #0059b2
}

.news-redesign .chronicle-card:nth-child(n+6)>div {
	margin: 0 20px 12px;
	font-size: 11px;
	font-weight: 600;
	color: #64748b;
	letter-spacing: .08em;
	text-transform: uppercase;
	display: inline-flex;
	align-items: center;
	gap: 7px;
}

.news-redesign .chronicle-card:nth-child(n+6)>div::before {
	content: "";
	display: inline-block;
	width: 13px;
	height: 13px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='%230284c7' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
}

.news-redesign .chronicle-card:nth-child(n+6) .theme-btn {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	margin: auto 20px 20px;
	align-self: flex-start;
	padding: 10px 16px;
	background: transparent !important;
	border: 1px solid #0284c7 !important;
	color: #0284c7 !important;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	text-decoration: none !important;
	transition: all .25s ease;
}

.news-redesign .chronicle-card:nth-child(n+6) .theme-btn::after {
	content: "";
	font-size: 12px;
	transition: transform .2s ease;
}

.news-redesign .chronicle-card:nth-child(n+6) .theme-btn:hover {
	background: linear-gradient(135deg, #0059b2, #01478d) !important;
	border-color: transparent !important;
	color: #fff !important;
	box-shadow: 0 8px 18px -6px rgba(0, 89, 178, .5);
}

.news-redesign .chronicle-card:nth-child(n+6) .theme-btn:hover::after {
	transform: translateX(4px)
}

/* Hide duplicate text-two from original button */
.news-redesign .chronicle-card .theme-btn .btn-wrap {
	display: inline
}

.news-redesign .chronicle-card .theme-btn .text-two {
	display: none
}


/* ====== LOAD MORE BUTTON ====== */
.news-redesign .load-more-btn {
	display: block;
	margin: 50px auto 0;
	padding: 16px 36px;
	background: linear-gradient(135deg, #0059b2 0%, #01478d 100%);
	color: #fff;
	border: none;
	border-radius: 999px;
	font-family: 'Barlow', sans-serif;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	cursor: pointer;
	box-shadow: 0 14px 30px -8px rgba(0, 89, 178, .5), inset 0 1px 0 rgba(255, 255, 255, .18);
	transition: all .25s ease;
	position: relative;
	overflow: hidden;
}

.news-redesign .load-more-btn::before {
	content: "";
	position: absolute;
	top: 0;
	left: -120%;
	width: 60%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255, 215, 50, .4), transparent);
	transform: skewX(-20deg);
	transition: left .7s ease;
}

.news-redesign .load-more-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 20px 40px -10px rgba(0, 89, 178, .65);
}

.news-redesign .load-more-btn:hover::before {
	left: 130%
}

/* ====== RESPONSIVE ====== */
@media (max-width:1100px) {
	.news-hero-inner {
		padding: 0 24px
	}

	.news-redesign .chronicle-card:first-child {
		min-height: 480px
	}

	.news-redesign .chronicle-card:first-child h3 {
		font-size: clamp(22px, 2vw, 28px);
		bottom: 70px;
		padding: 0 30px
	}

	.news-redesign .chronicle-card:first-child>div {
		left: 30px;
		bottom: 30px
	}
}

@media (max-width:991px) {
	.news-hero {
		padding: 70px 0 90px
	}

	.news-hero-inner {
		grid-template-columns: 1fr;
		gap: 40px
	}

	.news-hero-right {
		min-height: 280px
	}

	.news-chip.c5,
	.news-chip.c6 {
		display: none
	}

	.news-hero p {
		max-width: none
	}

	/* Magazine layout becomes stacked: featured full-width, then list cards below it */
	.news-redesign .chronicle-card:first-child {
		grid-column: span 12;
		grid-row: auto;
		min-height: 420px;
	}

	.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5) {
		grid-column: span 6;
		grid-row: auto;
		min-height: auto;
	}

	.news-redesign .chronicle-card:nth-child(n+6) {
		grid-column: span 6;
	}
}

@media (max-width:768px) {
	.news-hero {
		padding: 56px 0 76px
	}

	.news-hero-inner {
		padding: 0 20px;
		gap: 36px
	}

	.news-tag {
		font-size: 10px;
		padding: 7px 14px;
		letter-spacing: .16em;
		margin-bottom: 18px
	}

	.news-redesign h1 {
		font-size: clamp(34px, 7vw, 48px);
		margin-bottom: 18px
	}

	.news-redesign h1::after {
		width: 60px;
		height: 3px;
		margin-top: 18px
	}

	.news-hero p {
		font-size: 15px;
		line-height: 1.7
	}

	.news-hero-right {
		min-height: 240px
	}

	.news-section {
		padding: 40px 0 70px
	}

	.news-container {
		padding: 0 16px
	}

	.news-redesign .news-events-section {
		gap: 18px
	}

	/* Featured card: smaller image padding, title scales */
	.news-redesign .chronicle-card:first-child {
		min-height: 360px
	}

	.news-redesign .chronicle-card:first-child>a:first-child img {
		padding: 40px
	}

	.news-redesign .chronicle-card:first-child h3 {
		font-size: 22px;
		bottom: 64px;
		padding: 0 22px
	}

	.news-redesign .chronicle-card:first-child>div {
		left: 22px;
		bottom: 22px;
		font-size: 11px
	}

	.news-redesign .chronicle-card:first-child .theme-btn {
		right: 16px;
		bottom: 16px;
		padding: 11px 18px;
		font-size: 11px
	}

	.news-redesign .chronicle-card:first-child>a:first-child::before {
		top: 16px;
		left: 16px;
		font-size: 10px;
		padding: 5px 11px
	}

	/* List cards (#2-5): smaller image column */
	.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5) {
		grid-template-columns: 100px 1fr;
	}

	.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5) h3 {
		font-size: 14px;
		margin: 12px 14px 4px
	}

	.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5)>div {
		margin: 0 14px 4px;
		font-size: 10px
	}

	.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5) .theme-btn {
		margin: 0 14px 12px auto;
		font-size: 9.5px
	}

	/* Grid cards */
	.news-redesign .chronicle-card:nth-child(n+6) h3 {
		font-size: 15px;
		margin: 14px 16px 6px
	}

	.news-redesign .chronicle-card:nth-child(n+6)>div {
		margin: 0 16px 10px;
		font-size: 10px
	}

	.news-redesign .chronicle-card:nth-child(n+6) .theme-btn {
		margin: auto 16px 16px;
		padding: 9px 14px;
		font-size: 10px
	}
}

@media (max-width:600px) {
	.news-hero {
		padding: 48px 0 64px
	}

	.news-hero-inner {
		padding: 0 16px;
		gap: 28px
	}

	.news-redesign h1 {
		font-size: clamp(30px, 8vw, 40px)
	}

	.news-tag {
		flex-wrap: wrap;
		line-height: 1.4;
		font-size: 9.5px
	}

	.news-section-head {
		margin-bottom: 24px
	}

	/* All cards stack to single column */
	.news-redesign .chronicle-card:first-child {
		grid-column: span 12;
		min-height: 340px;
	}

	.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5) {
		grid-column: span 12;
	}

	.news-redesign .chronicle-card:nth-child(n+6) {
		grid-column: span 12;
	}
}

@media (max-width:480px) {
	.news-hero-right {
		min-height: 220px
	}

	.news-hero-right .news-ring.r1 {
		width: 240px;
		height: 240px
	}

	.news-hero-right .news-ring.r2 {
		width: 180px;
		height: 180px
	}

	.news-hero-right .news-ring.r3 {
		width: 130px;
		height: 130px
	}

	.news-core {
		width: 96px;
		height: 96px
	}

	.news-core .seal-icon {
		width: 38px;
		height: 38px
	}

	.news-chip {
		font-size: 11px;
		padding: 5px 10px;
		letter-spacing: .2px
	}

	.news-redesign .chronicle-card:first-child {
		min-height: 300px
	}

	.news-redesign .chronicle-card:first-child h3 {
		font-size: 18px;
		bottom: 58px;
		padding: 0 18px
	}

	.news-redesign .chronicle-card:first-child>div {
		left: 18px;
		bottom: 18px;
		font-size: 10px
	}

	.news-redesign .chronicle-card:first-child .theme-btn {
		padding: 10px 14px;
		font-size: 10px
	}

	.news-redesign .chronicle-card:first-child>a:first-child img {
		padding: 30px
	}

	/* List cards (#2-5) become more compact */
	.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5) {
		grid-template-columns: 90px 1fr;
		min-height: 100px;
	}

	.news-redesign .chronicle-card:nth-child(n+2):nth-child(-n+5) h3 {
		font-size: 13px;
		margin: 10px 12px 3px;
		-webkit-line-clamp: 2
	}

	.news-redesign .load-more-btn {
		padding: 14px 28px;
		font-size: 12px
	}
}

@media (max-width:380px) {
	.news-hero-right {
		min-height: 200px
	}

	.news-hero-right .news-ring.r1 {
		width: 200px;
		height: 200px
	}

	.news-hero-right .news-ring.r2 {
		width: 150px;
		height: 150px
	}

	.news-hero-right .news-ring.r3 {
		width: 110px;
		height: 110px
	}

	.news-core {
		width: 80px;
		height: 80px
	}

	.news-core .seal-icon {
		width: 32px;
		height: 32px
	}

	.news-chip.c3,
	.news-chip.c4 {
		display: none
	}

	.news-redesign .chronicle-card:first-child {
		min-height: 260px
	}

	.news-redesign .chronicle-card:first-child h3 {
		font-size: 16px
	}
}



/*  */
.cx2-contact {
	--c-cream: #f4f6fb;
	--c-cream-2: #eef2f8;
	--c-cream-3: #e2e8f0;
	--c-white: #ffffff;
	--c-navy: #0059b2;
	--c-navy-2: #01478d;
	--c-ink: #0f172a;
	--c-ink-2: #475569;
	--c-line: #e2e8f0;
	--c-line-2: #cbd5e1;
	--c-cobalt: #0059b2;
	--c-cobalt-dark: #01478d;
	--c-cobalt-soft: #dbeafe;
	--c-amber: #ffd732;
	--c-amber-soft: #fffbeb;
	font-family: 'Rubik', system-ui, sans-serif;
	color: var(--c-ink);
	position: relative;
	font-weight: 400;
	line-height: 1.5;
}

.cx2-contact * {
	box-sizing: border-box;
}

.cx2-contact a {
	color: inherit;
}

.cx2-contact h1,
.cx2-contact h2,
.cx2-contact h3,
.cx2-contact h4 {
	font-family: 'Barlow', system-ui, sans-serif;
	margin: 0;
	color: var(--c-navy);
}

/* ===== Hero band (pipe-size-chart style — royal blue + yellow rings) ===== */
.cx2-hero {
	position: relative;
	background:
		radial-gradient(1200px 500px at 85% 0%, rgba(56, 189, 248, .18), transparent 60%),
		radial-gradient(900px 400px at 10% 100%, rgba(14, 165, 233, .14), transparent 60%),
		linear-gradient(135deg, #0059b2 0%, #0059b2 45%, #0059b2 100%);
	color: #fff;
	padding: 60px 0;
	overflow: hidden;
}

.cx2-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(125, 211, 252, .06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(125, 211, 252, .06) 1px, transparent 1px);
	background-size: 48px 48px;
	-webkit-mask-image: radial-gradient(ellipse at center, #000 40%, transparent 85%);
	mask-image: radial-gradient(ellipse at center, #000 40%, transparent 85%);
}

.cx2-hero::after {
	display: none
}

.cx2-hero__inner {
	position: relative;
	z-index: 2;
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 30px;
	display: grid;
	grid-template-columns: 1.4fr .8fr;
	gap: 50px;
	align-items: center;
}

.cx2-hero__left {
	min-width: 0
}

.cx2-hero__crumb {
	display: none
}

.cx2-hero__tag-badge {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 16px;
	border: 1px solid rgba(255, 215, 50, .5);
	border-radius: 999px;
	color: #ffd;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	margin-bottom: 22px;
}

.cx2-hero__tag-badge .dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #ffd732;
	box-shadow: 0 0 12px rgba(255, 215, 50, .9);
	animation: cx2-pulse 2s ease-in-out infinite;
}

@keyframes cx2-pulse {

	0%,
	100% {
		opacity: 1
	}

	50% {
		opacity: .35
	}
}

.cx2-contact .cx2-hero h1 {
	font-family: 'Barlow', sans-serif;
	color: #fff !important;
	font-size: clamp(38px, 5.4vw, 68px);
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -.02em;
	margin: 0 0 22px;
	text-transform: none;
}

.cx2-contact .cx2-hero h1 .accent {
	color: #ffd732
}

.cx2-contact .cx2-hero h1 .dot {
	color: #ffd732;
	display: inline-block;
	margin-left: 0;
}

.cx2-contact .cx2-hero h1::after {
	content: "";
	display: block;
	width: 80px;
	height: 4px;
	border-radius: 4px;
	margin-top: 22px;
	background: linear-gradient(90deg, #ffd732, transparent);
}

.cx2-hero__sub {
	color: #cbd5e1;
	font-size: 17px;
	line-height: 1.75;
	max-width: 640px;
	margin: 0;
	font-weight: 400;
}

.cx2-hero__sub strong {
	color: #fff;
	font-weight: 600
}

/* Hero right - animated rings + yellow/gold core */
.cx2-hero__right {
	position: relative;
	min-height: 300px;
	display: flex;
	align-items: center;
	justify-content: center
}

.cx2-hero__ring {
	position: absolute;
	border-radius: 50%;
	border: 1px dashed rgba(255, 215, 50, .8)
}

.cx2-hero__ring.r1 {
	width: 300px;
	height: 300px;
	animation: cx2-spin 38s linear infinite
}

.cx2-hero__ring.r2 {
	width: 230px;
	height: 230px;
	border-style: solid;
	border-color: rgba(255, 215, 50, .8);
	animation: cx2-spin 24s linear infinite reverse
}

.cx2-hero__ring.r3 {
	width: 160px;
	height: 160px;
	border-style: dotted;
	border-color: rgba(255, 215, 50, .8);
	animation: cx2-spin 18s linear infinite
}

.cx2-hero__core {
	position: relative;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #ffe572, #ffd732 50%, #b88f00 100%);
	box-shadow:
		0 0 0 6px rgba(255, 255, 255, .04),
		0 0 0 10px rgba(255, 215, 50, .12),
		0 30px 60px -10px rgba(255, 215, 50, .55),
		inset 0 0 30px rgba(0, 0, 0, .25);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0059b2;
}

.cx2-hero__core .seal-icon {
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .25))
}

@keyframes cx2-spin {
	from {
		transform: rotate(0)
	}

	to {
		transform: rotate(360deg)
	}
}

.cx2-hero__chips {
	position: absolute;
	inset: 0;
	pointer-events: none
}

.cx2-hero__chip {
	position: absolute;
	padding: 7px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .06);
	border: 1px solid #ffd732;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
	letter-spacing: .4px;
}

.cx2-hero__chip.c1 {
	top: 6%;
	left: -2%
}

.cx2-hero__chip.c2 {
	top: 18%;
	right: -6%
}

.cx2-hero__chip.c3 {
	bottom: 10%;
	left: -4%
}

.cx2-hero__chip.c4 {
	bottom: 4%;
	right: 4%
}

.cx2-hero__chip.c5 {
	top: 48%;
	right: -8%
}

.cx2-hero__chip.c6 {
	top: 50%;
	left: -8%
}

/* Hide the old meta column */
.cx2-hero__meta {
	display: none
}

/* ===== Quick stats strip ===== */
.cx2-stats {
	background: var(--c-cream);
	border-bottom: 1px solid var(--c-line);
	padding: 0;
}

.cx2-stats__inner {
	max-width: 1320px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
}

.cx2-stat {
	padding: 28px 28px;
	border-right: 1px solid var(--c-line);
	display: flex;
	flex-direction: column;
	gap: 6px;
	position: relative;
}

.cx2-stat:last-child {
	border-right: 0;
}

.cx2-stat__label {
	font-family: 'Rubik', sans-serif;
	font-size: 13px;
	text-transform: uppercase;
	color: var(--c-ink-2);
	font-weight: 500;
}

.cx2-stat__value {
	font-family: 'Barlow', sans-serif;
	font-size: 22px;
	font-weight: 600;
	color: var(--c-navy);
	line-height: 1.2;
}

.cx2-stat__value b {
	color: var(--c-cobalt);
	font-weight: 900;
}

/* ===== Section base ===== */
.cx2-main {
	padding: 60px 0px;
	position: relative;
}

.cx2-main::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image: radial-gradient(circle, rgba(10, 21, 53, 0.06) 1px, transparent 1px);
	background-size: 28px 28px;
	opacity: .45;
	-webkit-mask-image: radial-gradient(ellipse at top center, black 20%, transparent 70%);
	mask-image: radial-gradient(ellipse at top center, black 20%, transparent 70%);
}

.cx2-wrap {
	position: relative;
	max-width: 1320px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 5fr 7fr;
	gap: 56px;
	align-items: start;
}

/* Column header */
.cx2-colhead {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	padding-bottom: 20px;
	margin-bottom: 28px;
	border-bottom: 2px solid var(--c-navy);
}

.cx2-colhead__kicker {
	font-family: 'Rubik', sans-serif;
	font-size: 11px;
	letter-spacing: .28em;
	text-transform: uppercase;
	color: var(--c-cobalt);
	font-weight: 600;
	margin-bottom: 8px;
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.cx2-colhead__kicker::before {
	content: "";
	width: 18px;
	height: 2px;
	background: var(--c-cobalt);
}

.cx2-contact .cx2-colhead h2 {
	font-family: 'Barlow', sans-serif;
	font-weight: 800;
	font-size: clamp(28px, 3.4vw, 40px);
	line-height: 1;
	text-transform: uppercase;
	color: var(--c-navy);
}

.cx2-colhead__id {
	font-family: 'Rubik', sans-serif;
	font-size: 10.5px;
	letter-spacing: .28em;
	text-transform: uppercase;
	color: var(--c-ink-2);
	font-weight: 500;
	padding-bottom: 6px;
}

.cx2-colhead__id b {
	color: var(--c-amber);
	font-weight: 700;
}

/* ===== Info cards ===== */
.cx2-info__list {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.cx2-info {
	position: relative;
	background: var(--c-white);
	border: 1.5px solid var(--c-line);
	padding: 24px 26px 22px 26px;
	display: grid;
	grid-template-columns: 54px 1fr;
	gap: 22px;
	align-items: center;
	transition: border-color .3s ease, transform .3s ease, box-shadow .3s ease;
}

.cx2-info::after {
	content: "";
	position: absolute;
	top: 14px;
	right: 14px;
	width: 14px;
	height: 14px;
	border: 1.5px solid var(--c-line-2);
	border-left: 0;
	border-bottom: 0;
	opacity: .5;
}

.cx2-info:hover {
	border-color: var(--c-navy);
	transform: translateX(4px);
	box-shadow: -6px 0 0 0 var(--c-amber);
}

.cx2-info__num {
	width: 54px;
	height: 54px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--c-cobalt);
	color: var(--c-white);
	font-family: 'Barlow', sans-serif;
	font-weight: 900;
	font-size: 20px;
	letter-spacing: -.02em;
	position: relative;
}
.cx2-info__num img{height:20px;}
.cx2-info__num i {
	position: absolute;
	left: -1.5px;
	bottom: -1.5px;
	width: 14px;
	height: 14px;
	background: var(--c-amber);
}

.cx2-info__body {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.cx2-info__meta {
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: 'Rubik', sans-serif;
	font-size: 10.5px;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--c-ink-2);
	font-weight: 600;
}

.cx2-info__meta .ic {
	color: var(--c-cobalt);
	font-size: 12px;
	width: 14px;
}

.cx2-contact .cx2-info__label {
	font-family: 'Barlow', sans-serif;
	font-weight: 600;
	font-size: 18px;
	color: var(--c-navy);
	margin: 0;
	display: block;
}

.cx2-info__value {
	font-family: 'Rubik', sans-serif;
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--c-ink);
	font-weight: 400;
	margin-top: 2px;
}

.cx2-info__value a {
	color: var(--c-navy);
	text-decoration: none;
	font-weight: 500;
	border-bottom: 1px solid transparent;
	transition: color .25s ease, border-color .25s ease;
}

.cx2-info__value a:hover {
	color: var(--c-cobalt);
	border-bottom-color: var(--c-cobalt);
}

.cx2-info__value .sep {
	color: var(--c-line-2);
	margin: 0 6px;
	font-weight: 300;
}

/* ===== Form card ===== */
.cx2-form-card {
	position: relative;
	background: var(--c-white);
	border: 2px solid var(--c-navy);
	padding: 0;
}

.cx2-form-card::before {
	content: "";
	position: absolute;
	top: -2px;
	left: -2px;
	right: -2px;
	height: 8px;
	background: var(--c-cobalt);
}

.cx2-form-card::after {
	content: "";
	position: absolute;
	top: 6px;
	right: -2px;
	width: 16px;
	height: 46px;
	background: var(--c-amber);
}

.cx2-form-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
	padding: 34px 38px 26px;
	border-bottom: 1.5px solid var(--c-line);
}

.cx2-contact .cx2-form-bar h2.h1mainheading {
	font-family: 'Barlow', sans-serif !important;
	font-weight: 900;
	font-size: clamp(26px, 3.2vw, 36px);
	line-height: 1.05;
	letter-spacing: -.018em;
	color: var(--c-navy);
	text-transform: uppercase;
	margin: 0;
}

.cx2-contact .cx2-form-bar h2.h1mainheading span {
	color: var(--c-cobalt);
}

.cx2-form-bar__tag {
	font-family: 'Rubik', sans-serif;
	font-size: 10.5px;
	letter-spacing: .28em;
	text-transform: uppercase;
	color: var(--c-ink-2);
	font-weight: 500;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 10px;
	border: 1px solid var(--c-line);
	background: var(--c-cream);
}

.cx2-form-bar__tag b {
	color: var(--c-amber);
	font-weight: 700;
}

.cx2-form-bar__tag .dot {
	width: 6px;
	height: 6px;
	background: var(--c-amber);
	display: inline-block;
}

.cx2-form-body {
	padding: 30px 38px 38px;
}

.cx2-contact .cx2-form-body .row.clearfix {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 18px 22px;
	margin: 0;
}

.cx2-contact .cx2-form-body .form-group {
	width: auto;
	padding: 0;
	margin: 0;
	float: none;
}

.cx2-contact .cx2-form-body .form-group.is-full,
.cx2-contact .cx2-form-body .form-group.is-submit {
	grid-column: 1 / -1;
}

.cx2-contact .cx2-form-body .form-group {
	position: relative;
	margin-bottom: 15px;
}

.cx2-contact .cx2-form-body .form-group .lbl {
	position: absolute;
	left: 14px;
	top: -9px;
	background: var(--c-white);
	padding: 0 8px;
	font-family: 'Rubik', sans-serif;
	font-size: 14px;
	text-transform: uppercase;
	color: var(--c-cobalt);
	font-weight: 600;
	z-index: 1;
	pointer-events: none;
}

.cx2-contact .cx2-form-body input[type="text"],
.cx2-contact .cx2-form-body input[type="email"],
.cx2-contact .cx2-form-body textarea {
	display: block;
	width: 100% !important;
	max-width: 100%;
	font-family: 'Rubik', sans-serif !important;
	font-size: 15px !important;
	color: var(--c-navy) !important;
	background: var(--c-white) !important;
	border: 1.5px solid var(--c-line-2) !important;
	border-radius: 0 !important;
	padding: 18px 16px 14px !important;
	line-height: 1.4 !important;
	box-shadow: none !important;
	outline: none !important;
	transition: border-color .25s ease, box-shadow .25s ease;
	font-weight: 400;
	-webkit-appearance: none;
	appearance: none;
}

.cx2-contact .cx2-form-body input::placeholder,
.cx2-contact .cx2-form-body textarea::placeholder {
	color: #a4a292 !important;
	font-weight: 300;
}

.cx2-contact .cx2-form-body input:focus,
.cx2-contact .cx2-form-body textarea:focus {
	border-color: var(--c-cobalt) !important;
	box-shadow: 0 0 0 3px rgba(30, 64, 175, 0.10) !important;
}

.cx2-contact .cx2-form-body textarea {
	min-height: 140px;
	resize: vertical;
}

.cx2-contact .cx2-form-body .g-recaptcha {
	margin: 6px 0 4px;
}

.cx2-contact .cx2-form-body .d-flex {
	display: flex !important;
	align-items: center;
	gap: 24px;
	flex-wrap: wrap;
	justify-content: space-between;
}

.cx2-contact .cx2-form-body button.theme-btn,
.cx2-contact .cx2-form-body .theme-btn {
	display: inline-flex !important;
	align-items: center;
	gap: 14px;
	padding: 18px 36px !important;
	font-family: 'Barlow', sans-serif !important;
	font-size: 15px !important;
	letter-spacing: .1em !important;
	text-transform: uppercase !important;
	background: var(--c-cobalt) !important;
	color: var(--c-white) !important;
	border: 0 !important;
	border-radius: 0 !important;
	cursor: pointer;
	transition: transform .2s ease, box-shadow .2s ease, background .25s ease;
	-webkit-appearance: none;
	appearance: none;
	line-height: 1;
	text-shadow: none;
	font-weight: 600;
	position: relative;
}

.cx2-contact .cx2-form-body button.theme-btn:hover {
	background: var(--c-cobalt-dark) !important;
	transform: translate(-2px, -2px);
	box-shadow: 8px 8px 0 0 var(--c-amber) !important;
}

.cx2-contact .cx2-form-body button.theme-btn:active {
	transform: translate(2px, 2px);
	box-shadow: 2px 2px 0 0 var(--c-navy) !important;
}

.cx2-contact .cx2-form-body button.theme-btn .btn-wrap {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	color: inherit;
}

.cx2-contact .cx2-form-body button.theme-btn .btn-wrap i {
	display: inline-flex;
	width: 28px;
	height: 10px;
}

.cx2-contact .cx2-form-body button.theme-btn .btn-wrap i img {
	display: none;
}

.cx2-contact .cx2-form-body button.theme-btn .btn-wrap i::after {
	content: "";
	width: 28px;
	height: 10px;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 10' fill='none'><path d='M0 5H26M26 5L22 1M26 5L22 9' stroke='%23ffffff' stroke-width='1.6'/></svg>");
	background-repeat: no-repeat;
	background-position: center;
}

/* ===== Map ===== */
.cx2-mapwrap {
	background: var(--c-cream-2);
	padding: 60px 0;
	border-top: 1px solid var(--c-line);
	position: relative;
}

.cx2-mapwrap::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 5px;
	background: var(--c-cobalt);
}

.cx2-mapwrap__inner {
	max-width: 1320px;
	margin: 0 auto;
}

.cx2-mapwrap__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 24px;
	flex-wrap: wrap;
	margin-bottom: 24px;
}

.cx2-mapwrap__title {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.cx2-mapwrap__kicker {
	font-family: 'Rubik', sans-serif;
	font-size: 14px;
	text-transform: uppercase;
	color: var(--c-cobalt);
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.cx2-mapwrap__kicker::before {
	content: "";
	width: 18px;
	height: 2px;
	background: var(--c-cobalt);
}

.cx2-contact .cx2-mapwrap__head h2 {
	font-family: 'Barlow', sans-serif;
	font-weight: 900;
	font-size: clamp(28px, 3.4vw, 40px);
	line-height: 1;
	letter-spacing: -.02em;
	text-transform: uppercase;
	color: var(--c-navy);
}

.cx2-mapwrap__coords {
	display: flex;
	align-items: center;
	gap: 24px;
	flex-wrap: wrap;
	font-family: 'Rubik', sans-serif;
	font-size: 11.5px;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--c-ink-2);
	font-weight: 500;
}

.cx2-mapwrap__coords b {
	color: var(--c-navy);
	font-weight: 700;
	font-family: 'Barlow', sans-serif;
	font-size: 14px;
	letter-spacing: .04em;
}

.cx2-mapframe {
	position: relative;
	background: var(--c-white);
	border: 2px solid var(--c-navy);
	padding: 0;
	aspect-ratio: 21/9;
	min-height: 420px;
	overflow: hidden;
}
.cx2-mapframe>p{display: block;height: 100%;}

.cx2-mapframe::before {
	content: "";
	position: absolute;
	top: -2px;
	left: -2px;
	right: -2px;
	height: 5px;
	background: var(--c-amber);
	z-index: 2;
}

.cx2-mapframe::after {
	content: "";
	position: absolute;
	bottom: 18px;
	left: 18px;
	width: 46px;
	height: 46px;
	background: var(--c-cobalt);
	z-index: 3;
	box-shadow: 6px 6px 0 0 var(--c-amber);
	pointer-events: none;
}

.cx2-mapframe iframe {
	position: absolute;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	border: 0 !important;
}

/* ===== Responsive (Improved Mobile-First) ===== */
/* Prevent horizontal overflow inside contact section only */
.cx2-contact {
	overflow-x: hidden;
}

/* === CRITICAL: Defeat external bootstrap.css + responsive.css =====
               (these reload async at page bottom and override inline styles) */
.cx2-contact .contact-three_info-column1,
.cx2-contact .contact-three_form-column {
	padding-left: 0 !important;
	padding-right: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	flex: none !important;
	float: none !important;
}

.cx2-contact .cx2-form-body .row.clearfix {
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.cx2-contact .cx2-form-body .form-group {
	padding-left: 0 !important;
	padding-right: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	width: auto !important;
	max-width: 100% !important;
	flex: none !important;
	float: none !important;
}

.cx2-contact .cx2-info__list,
.cx2-contact .cx2-info__list.addresscol {
	padding: 0 !important;
	margin: 0 !important;
	list-style: none !important;
}

.cx2-contact .contact-form,
.cx2-contact .contact-form form {
	margin: 0 !important;
	padding: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
}

/* Remove sticky-hover state on touch devices (info cards) */
@media (hover:none) {
	.cx2-contact .cx2-info:hover {
		transform: none !important;
		box-shadow: none !important;
		border-color: var(--c-line) !important;
	}
}

/* Phone/email separators wrap cleanly */
.cx2-info__value a {
	display: inline-block;
	word-break: break-word;
	overflow-wrap: anywhere;
}

.cx2-info__value .sep {
	display: inline-block;
}

@media (max-width:1200px) {
	.cx2-hero__inner {
		padding: 0 24px;
		gap: 40px
	}

	.cx2-wrap {
		padding: 0 24px;
		gap: 40px
	}

	.cx2-stats__inner {
		padding: 0 24px
	}

	.cx2-mapwrap__inner {
		padding: 0 24px
	}
}

@media (max-width:991px) {
	.cx2-hero {
		padding: 60px 0 70px
	}

	.cx2-hero__inner {
		grid-template-columns: 1fr !important;
		gap: 40px;
		align-items: start
	}

	.cx2-hero__right {
		min-height: 280px;
		margin: 0 auto;
		max-width: 380px;
		width: 100%
	}

	.cx2-hero__chip.c5,
	.cx2-hero__chip.c6 {
		display: none
	}

	.cx2-hero__sub {
		max-width: none
	}

	.cx2-stats__inner {
		grid-template-columns: repeat(2, 1fr) !important;
	}

	.cx2-stat {
		border-bottom: 1px solid var(--c-line);
		padding: 24px 22px;
	}

	.cx2-stat:nth-child(2n) {
		border-right: 0;
	}

	.cx2-stat:nth-last-child(-n+2) {
		border-bottom: 0;
	}

	.cx2-main {
		padding: 50px 20px 60px;
	}

	.cx2-wrap {
		grid-template-columns: 1fr !important;
		gap: 40px;
		padding: 0;
	}

	.cx2-mapwrap {
		padding: 50px 20px 60px;
	}

	.cx2-mapwrap__inner {
		padding: 0;
	}

	.cx2-form-bar {
		padding: 28px 24px 22px;
	}

	.cx2-form-body {
		padding: 26px 24px 30px;
	}

	.cx2-contact .cx2-form-body .row.clearfix {
		grid-template-columns: 1fr !important;
		gap: 18px !important;
	}

	.cx2-mapframe {
		aspect-ratio: auto;
		min-height: 340px;
	}
}

@media (max-width:768px) {
	.cx2-hero {
		padding: 48px 0 56px
	}

	.cx2-hero__inner {
		padding: 0 18px;
		gap: 32px
	}

	.cx2-hero__tag-badge {
		font-size: 10px;
		padding: 7px 14px;
		letter-spacing: .16em;
		margin-bottom: 18px
	}

	.cx2-contact .cx2-hero h1 {
		font-size: clamp(32px, 7vw, 46px);
		margin-bottom: 18px
	}

	.cx2-contact .cx2-hero h1::after {
		width: 60px;
		height: 3px;
		margin-top: 18px
	}

	.cx2-hero__sub {
		font-size: 15px;
		line-height: 1.7
	}

	.cx2-hero__right {
		min-height: 240px;
		max-width: 320px
	}

	.cx2-main {
		padding: 40px 16px 50px;
	}

	.cx2-wrap {
		gap: 36px;
	}

	.cx2-colhead {
		padding-bottom: 16px;
		margin-bottom: 22px;
	}

	.cx2-form-bar {
		padding: 22px 20px 18px;
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}

	.cx2-form-body {
		padding: 24px 20px 28px;
	}

	.cx2-form-card::after {
		height: 36px;
		width: 12px;
	}

	.cx2-mapwrap {
		padding: 40px 16px 50px;
	}

	.cx2-mapframe {
		min-height: 300px;
	}

	.cx2-mapframe::after {
		width: 36px;
		height: 36px;
		bottom: 14px;
		left: 14px;
		box-shadow: 5px 5px 0 0 var(--c-amber);
	}

	.cx2-contact .cx2-form-body .d-flex {
		gap: 16px;
	}

	.cx2-contact .cx2-form-body .g-recaptcha {
		transform: scale(0.95);
		transform-origin: left center;
	}
}

@media (max-width:600px) {
	.cx2-hero {
		padding: 42px 0 50px
	}

	.cx2-hero__inner {
		padding: 0 14px;
		gap: 24px
	}

	.cx2-contact .cx2-hero h1 {
		font-size: clamp(28px, 8vw, 38px)
	}

	.cx2-hero__tag-badge {
		flex-wrap: wrap;
		line-height: 1.4;
		font-size: 9.5px;
		padding: 6px 12px;
	}

	.cx2-hero__sub {
		font-size: 14.5px;
		line-height: 1.65
	}

	.cx2-stats__inner {
		grid-template-columns: 1fr;
	}

	.cx2-stat {
		border-right: 0;
		padding: 20px 18px;
	}

	.cx2-stat:not(:last-child) {
		border-bottom: 1px solid var(--c-line);
	}

	.cx2-stat__value {
		font-size: 20px;
	}

	.cx2-main {
		padding: 34px 14px 42px;
	}

	.cx2-wrap {
		gap: 32px;
	}

	.cx2-info {
		grid-template-columns: 46px 1fr;
		gap: 14px;
		padding: 18px;
	}

	.cx2-info::after {
		top: 10px;
		right: 10px;
		width: 10px;
		height: 10px;
	}

	.cx2-info__num {
		width: 46px;
		height: 46px;
		font-size: 18px;
	}

	.cx2-contact .cx2-info__label {
		font-size: 16px;
	}

	.cx2-info__value {
		font-size: 14px;
		line-height: 1.55;
		word-break: break-word;
		overflow-wrap: anywhere;
	}

	.cx2-info__value .sep {
		margin: 0 4px;
	}

	.cx2-form-bar {
		padding: 20px 18px 16px;
	}

	.cx2-contact .cx2-form-bar h2.h1mainheading {
		font-size: clamp(22px, 5.5vw, 28px);
		line-height: 1.15;
	}

	.cx2-form-body {
		padding: 22px 18px 24px;
	}

	.cx2-contact .cx2-form-body input[type="text"],
	.cx2-contact .cx2-form-body input[type="email"],
	.cx2-contact .cx2-form-body textarea {
		font-size: 16px !important;
		/* 16px+ prevents iOS auto-zoom on focus */
		padding: 16px 14px 12px !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	.cx2-contact .cx2-form-body .form-group .lbl {
		font-size: 12.5px;
		left: 12px;
		padding: 0 6px;
	}

	.cx2-contact .cx2-form-body .d-flex {
		flex-direction: column;
		align-items: stretch;
		gap: 14px;
		justify-content: flex-start !important;
	}

	.cx2-contact .cx2-form-body .g-recaptcha {
		transform: scale(0.88);
		transform-origin: left center;
		max-width: 100%;
		overflow: hidden;
	}

	.cx2-contact .cx2-form-body button.theme-btn,
	.cx2-contact .cx2-form-body .theme-btn {
		width: 100%;
		justify-content: center;
		padding: 16px 24px !important;
		font-size: 14px !important;
	}

	.cx2-mapwrap {
		padding: 34px 14px 42px;
	}

	.cx2-mapwrap__head {
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
	}

	.cx2-mapwrap__coords {
		gap: 14px;
		font-size: 10.5px;
	}

	.cx2-mapframe {
		min-height: 260px;
	}

	.cx2-mapframe::after {
		width: 32px;
		height: 32px;
		bottom: 12px;
		left: 12px;
		box-shadow: 4px 4px 0 0 var(--c-amber);
	}
}

@media (max-width:480px) {
	.cx2-hero__right {
		min-height: 220px;
		max-width: 280px
	}

	.cx2-hero__right .cx2-hero__ring.r1 {
		width: 240px;
		height: 240px
	}

	.cx2-hero__right .cx2-hero__ring.r2 {
		width: 180px;
		height: 180px
	}

	.cx2-hero__right .cx2-hero__ring.r3 {
		width: 130px;
		height: 130px
	}

	.cx2-hero__core {
		width: 96px;
		height: 96px
	}

	.cx2-hero__core .seal-icon {
		width: 38px;
		height: 38px
	}

	.cx2-hero__chip {
		font-size: 11px;
		padding: 5px 10px;
		letter-spacing: .2px
	}

	.cx2-stat__value {
		font-size: 18px;
	}

	.cx2-stat__label {
		font-size: 12px;
	}

	.cx2-info__value {
		font-size: 13.5px;
	}
}

@media (max-width:320px) {
	.cx2-hero__inner {
		padding: 0 12px;
	}

	.cx2-hero__right {
		min-height: 200px;
		max-width: 240px
	}

	.cx2-hero__right .cx2-hero__ring.r1 {
		width: 200px;
		height: 200px
	}

	.cx2-hero__right .cx2-hero__ring.r2 {
		width: 150px;
		height: 150px
	}

	.cx2-hero__right .cx2-hero__ring.r3 {
		width: 110px;
		height: 110px
	}

	.cx2-hero__core {
		width: 80px;
		height: 80px
	}

	.cx2-hero__core .seal-icon {
		width: 32px;
		height: 32px
	}

	.cx2-hero__chip.c3,
	.cx2-hero__chip.c4 {
		display: none
	}

	.cx2-main {
		padding: 28px 12px 34px;
	}

	.cx2-mapwrap {
		padding: 28px 12px 34px;
	}

	.cx2-info {
		grid-template-columns: 42px 1fr;
		padding: 14px;
		gap: 12px;
	}

	.cx2-info__num {
		width: 42px;
		height: 42px;
		font-size: 16px;
	}

	.cx2-form-bar {
		padding: 18px 14px 14px;
	}

	.cx2-form-body {
		padding: 18px 14px 22px;
	}

	.cx2-contact .cx2-form-body .g-recaptcha {
		transform: scale(0.85);
		transform-origin: left center;
	}
}