.welcome-section {
	border-bottom: 1px solid #C1E1DC;
	margin-bottom: 40px;
}
/* Post hero
   -------------------------------------------------------------------------- */
.xg-post-hero {
	position: relative;
	border-radius: 16px;
	overflow: hidden;
	margin-bottom: 24px;
	aspect-ratio: 1280/400;
}

.xg-post-hero__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.xg-post-hero__share {
	position: absolute;
	right: 24px;
	bottom: 24px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 16px;
	border-radius: 999px;
	background: #fff;
	font-weight: 600;
	font-size: 14px;
	line-height: 16px;
	letter-spacing: 0%;
	color: #404040;
	cursor: pointer;
	border: 1px solid #D4D4D4;
	box-shadow: 0px 1px 2px 0px #0000000D;
}

.xg-post-title {
	margin: 0 0 24px;
	font-weight: 900;
	font-size: 56px;
	line-height: 60px;
	letter-spacing: -5%;
	color: #006775;
}

.xg-post-date {
	font-weight: 400;
	font-size: 16px;
	line-height: 22px;
	letter-spacing: 0%;
	color: #737373;
}

/* Post layout: content + sticky contents
   -------------------------------------------------------------------------- */
.xg-post {
	--xg-post-gap: 32px;
	display: flex;
	align-items: flex-start;
	gap: var(--xg-post-gap);
}

.xg-post__main {
	flex: 1;
	min-width: 0;
	padding-right: 32px;
	border-right: 1px solid #C1E1DC;
}

.xg-post__aside {
	flex: 0 0 265px;
	position: sticky;
	top: 100px;
}

/* Author card */
.xg-post__authors-wrapper {
	padding-bottom: 32px;
	margin-bottom: 32px;
	border-bottom: 1px solid #C1E1DC;
	display: flex;
	gap: 32px;
	flex-wrap: wrap;
}

.xg-post__author {
	display: flex;
	gap: 20px;
}

.xg-post__author-photo {
	flex: 0 0 auto;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	object-fit: cover;
}

.xg-post__author-name {
	margin: 0 0 10px;
	font-weight: 700;
	font-size: 24px;
	line-height: 32px;
	color: #006775;
}

.xg-post__author-bio {
	color: #008294;
	font-weight: 400;
	font-size: 14px;
	line-height: 16px;
}

.xg-post__author-bio strong {
	font-weight: bold;
	color: #006775;
}

.xg-post__author-bio p {
	margin: 0 0 10px;
}

/* Contents nav */
.xg-toc__title {
	font-weight: 900;
	font-size: 32px;
	line-height: 36px;
	letter-spacing: -5%;
	color: #006775;
	margin-bottom: 16px;
}

.xg-toc__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.xg-toc__list li {
	margin: 4px 0;
}

.xg-toc__list a {
	display: block;
	padding: 8px 0 8px 16px;
	border-left: 2px solid #E4E4E7;
	font-weight: 400;
	font-size: 14px;
	line-height: 16px;
	letter-spacing: 0%;
	color: #3F3F46;
	text-decoration: none;
	transition: color 0.15s ease, border-color 0.15s ease;
}

.xg-toc__list a.is-active {
	border-left-color: #006775;
	color: #006775;
}

.xg-post__content {
	font-weight: 400;
	font-size: 16px;
	line-height: 22px;
	letter-spacing: 0%;
}

/* Smooth anchor landing under any fixed header */
.xg-post__content h2 {
	scroll-margin-top: 96px;
	font-weight: 900;
	font-size: 32px;
	line-height: 36px;
	letter-spacing: -5%;
	position: relative;
	padding-bottom: 32px;
	margin-bottom: 32px;
	color: #006775;
}

.xg-post__content h3 {
	font-weight: 900;
	font-size: 32px;
	line-height: 36px;
	letter-spacing: -5%;
	position: relative;
	margin-top: 32px;
	margin-bottom: 12px;
	color: #006775;
}

.xg-post__content h2:before {
	content: '';
	width: 64px;
	height: 3px;
	background-color: #00AC73;
	border-radius: 2px;
	position: absolute;
	left: 0;
	bottom: 0;
}

.xg-post__content > * {
	max-width: 100%;
}

.xg-post__content img {
	text-align: center;
}

.xg-post__content ul, .xg-post__content ol {
	list-style: inherit;
	padding-left: 20px;
}

/* Post content — blockquote
   -------------------------------------------------------------------------- */
.xg-post__content blockquote {
	position: relative;
	margin: 32px 0;
	padding: 0 0 0 62px;
	border: none;
	font-weight: 900;
	font-size: 42px;
	line-height: 50px;
	letter-spacing: -5%;
	color: #43A977;
	quotes: none;
	max-width: 747px;
}

.xg-post__content blockquote::before {
	content: '';
	position: absolute;
	left: 0;
	top: 8px;
	width: 32px;
	height: 28px;
	background-image: url("data:image/svg+xml,%3Csvg width='32' height='28' viewBox='0 0 32 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.7007 16.6831C14.7007 19.4681 13.9993 21.9071 12.45 23.8438C10.905 25.7747 8.66074 27.0261 5.90796 27.7146C4.97037 27.9491 4.01993 27.379 3.7854 26.4414C3.55092 25.5038 4.12104 24.5534 5.05859 24.3188C7.28403 23.7623 8.77351 22.8359 9.71729 21.6562C10.6564 20.4821 11.2007 18.8762 11.2007 16.6831V14.7007H5.48413C2.45571 14.7007 0 12.245 0 9.21655V5.48413C0 2.45571 2.45571 0 5.48413 0H9.21655C12.245 0 14.7007 2.45571 14.7007 5.48413V16.6831ZM31.5 16.6831C31.5 19.4681 30.7987 21.9071 29.2493 23.8438C27.7043 25.7745 25.4599 27.0262 22.7073 27.7146C21.77 27.9486 20.821 27.3786 20.5864 26.4414C20.352 25.504 20.9207 24.5537 21.8579 24.3188C24.0834 23.7623 25.5728 22.8359 26.5166 21.6562C27.4559 20.4821 28 18.8764 28 16.6831V14.7007H22.2834C19.255 14.7007 16.7993 12.245 16.7993 9.21655V5.48413C16.7993 2.45571 19.255 0 22.2834 0H26.0159C29.0443 0 31.5 2.45571 31.5 5.48413V16.6831Z' fill='%2343A977'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
}

.xg-post__content blockquote p {
	margin: 0 0 8px;
}

.xg-post__content blockquote p:last-child {
	margin-bottom: 0;
}

.xg-post__content blockquote cite {
	display: block;
	margin-top: 12px;
	font-size: 14px;
	font-weight: 400;
	font-style: normal;
	color: #6E6E6E;
}

.xg-post__content .xg-figure {
	margin: 32px 0;
}

.xg-post__content .xg-figure img {
	display: block;
	width: 100%;
	height: auto;
}

.xg-post__content p, .xg-post__content ul, .xg-post__content ol {
	margin-bottom: 16px;
}

.xg-figure__caption {
	margin-top: 8px;
	font-weight: 400;
	font-size: 14px;
	line-height: 20px;
	letter-spacing: 0%;
}

.xg-figure__desc {
	display: block;
	color: #737373;
}

.xg-figure__credit {
	display: block;
	margin-top: 4px;
	font-weight: 400;
	font-size: 12px;
	line-height: 14px;
	letter-spacing: 0%;
	color: #A3A3A3;
}

.xgate-compatibility-profile__reason {
	display: inline-block;
	padding: 4px 12px;
	background: #EFFAF3;
	border-radius: 100px;
	font-weight: 500;
	font-size: 14px;
	line-height: 16px;
	letter-spacing: 0%;
	text-align: center;
	color: #307D57;
	white-space: nowrap;
}

.xgate-compatibility-profile {
	margin: 32px 0;
	border-radius: 12px;
	overflow: hidden;
	color: #333;
	line-height: 1.4;
	border: 1px solid #008294;
	box-shadow:
	0px 1px 2px 0px #0000000F,
	0px 1px 3px 0px #00000000;
}

.xgate-compatibility-profile__header {
	background-color: #008294;
	padding: 16px 24px;
}

.xgate-compatibility-profile__label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #fff;
}

.xgate-compatibility-profile__content {
	background: #fff;
	padding: 24px;
}

.xgate-compatibility-profile__specs {
	display: flex;
	padding-bottom: 20px;
	border-bottom: 1px solid #e0e0e0;
	margin-bottom: 20px;
}

.xgate-compatibility-profile__spec {
	flex: 1 1 0;
	min-width: 0;
}

.xgate-compatibility-profile__spec-label {
	font-weight: 700;
	font-size: 12px;
	line-height: 14px;
	letter-spacing: 0%;
	text-transform: uppercase;
	color: #737373;
	margin-bottom: 8px;
}

.xgate-compatibility-profile__spec-value {
	font-weight: 700;
	font-size: 14px;
	line-height: 16px;
	letter-spacing: 0%;
	color: #171717;
}

.xgate-compatibility-profile__spec-value--mua {
	color: #008294;
}

.xgate-compatibility-profile__rationale-title {
	font-weight: 700;
	font-size: 12px;
	line-height: 14px;
	letter-spacing: 0%;
	text-transform: uppercase;
	color: #006775;
	margin-bottom: 12px;
}

.xgate-compatibility-profile__reasons {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

/* Content tables
   -------------------------------------------------------------------------- */
.table-wrapper {
	margin: 32px auto;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid #D4D4D4;
	border-radius: 12px;
	width: fit-content;
	max-width: 100%;
}

.table-wrapper table {
	width: 100%;
	min-width: 420px;
	margin: 0;
	border: none;
	border-collapse: collapse;
	font-size: 14px;
}

.table-wrapper th,
.table-wrapper td {
	padding: 14px 20px;
	border: none;
	text-align: left;
	vertical-align: middle;
}

/* Header row */
.table-wrapper thead th {
	background: #008294;
	font-size: 14px;
	font-weight: 700;
	color: #fff;
	white-space: nowrap;
}

/* Body rows */
.table-wrapper tbody tr {
	border-bottom: 1px solid #E5E5E5;
}

.table-wrapper tbody tr:last-child {
	border-bottom: none;
}

.table-wrapper tbody td {
	color: #404040;
}

/* Section rows */
.table-wrapper tbody tr.summary-row td,
.table-wrapper tbody th {
	background: #D2F2F8;
	font-size: 14px;
	font-weight: 700;
	color: #003239;
	white-space: nowrap;
}

/* Site / position cells */
.table-wrapper td.pos-cell {
	width: 96px;
	font-weight: 700;
	color: #006775;
	text-align: right;
	white-space: nowrap;
}

.xg-post-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin: 0 0 28px;
}

.xg-post-date {
	font-size: 13px;
	color: #8A8A8A;
}

.xg-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.xg-tags__item {
	padding: 4px 12px;
	border-radius: 999px;
	background: #EFFAF3;
	font-weight: 500;
	font-size: 14px;
	line-height: 16px;
	letter-spacing: 0%;
	color: #307D57;
	text-decoration: none;
	transition: background-color 0.15s ease;
}

/* Case study content images — normalize alignment & spacing (Additional CSS) */
.xg-post .xg-post__content figure.xg-figure {
	margin: 40px auto !important;
	text-align: center;
}

.xg-post .xg-post__content figure.xg-figure figcaption {
	text-align: center !important;
}

.xg-post .xg-post__content img[class*="wp-image-"] {
	display: block;
	margin-left: auto !important;
	margin-right: auto !important;
}

.xg-post .xg-post__content p img[class*="wp-image-"],
.xg-post .xg-post__content li img[class*="wp-image-"] {
	margin-top: 40px !important;
	margin-bottom: 40px !important;
}

/* images grouped in one <p>/<li> are separated by <br>; hide it so the 40px margins define a clean gap */
.xg-post .xg-post__content p:has(img[class*="wp-image-"]) br,
.xg-post .xg-post__content li:has(img[class*="wp-image-"]) br {
	display: none !important;
}

@media (min-width: 992px) {
	.xg-toc.mobonly {
		display: none;
	}
}


@media (hover: hover) and (pointer: fine) {
	.xg-toc__list a:hover {
		color: #006775;
	}
}


@media (max-width: 991px) {
	.xg-toc.mobonly {
		margin-bottom: 24px;
	}
	.welcome-section {
		margin-bottom: 24px;
	}
	.xg-case-products__grid > * {
		flex: 0 0 calc((100% - var(--xg-case-gap)) / 2);
	}
	.xg-post__main {
		padding-right: 0;
		border-right: 0;
	}
	.xg-case-products__title, .xg-resources__title {
		font-weight: 900;
		font-size: 32px;
		line-height: 36px;
		letter-spacing: -5%;
	}
	.table-wrapper {
		border-radius: 8px;
	}
	
	.table-wrapper table {
		font-size: 13px;
		min-width: 0;
	}
	
	.table-wrapper th,
	.table-wrapper td {
		padding: 12px 14px;
	}
	
	.xg-post__content blockquote {
		padding-left: 40px;
		font-size: 20px;
	}
	
	.xg-post__content blockquote::before {
		width: 24px;
		height: 21px;
		background-size: 24px 21px;
		top: 4px;
	}
	.xg-post__aside {
		display: none;
	}
	.xg-post-hero {
		height: auto;
		aspect-ratio: 343/200;
	}
	.xg-post-hero__img {
		/* height: 240px; */
	}
	.xg-post__authors-wrapper {
		gap: 24px;
	}
	.xg-post__authors-wrapper {
		padding-bottom: 24px;
		margin-bottom: 24px;
	}
	.xg-post__author {
		flex: 0 0 100%;
	}
	.xg-post-title {
		font-weight: 900;
		font-size: 32px;
		line-height: 36px;
		letter-spacing: -5%;
	}
	.xg-uptodate__title {
		padding-top: 40px;
	}
	.xg-case-products {
		padding: 40px 0 0;
	}
	.xg-uptodate {
		margin: 40px 0 40px 0;
	}
}