/* Artmark Product-page widgets — structural layout + design defaults.
   Colors/typography are overridable via widget controls. */

/* ---------------------------------------------------------------- */
/* Shared: eyebrow chip (light-blue pill with square dot)            */
/* ---------------------------------------------------------------- */

.am-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	background-color: #d3edfe;
	font-size: 14px;
	font-weight: 500;
	color: #3f3b34;
	line-height: 1;
}

.am-eyebrow__dot {
	width: 10px;
	height: 10px;
	border-radius: 3.5px;
	background-color: #0081e4;
	flex-shrink: 0;
}

/* Shared: two-tone section heading */
.am-h2 {
	margin: 0;
	font-size: 52px;
	font-weight: 400;
	line-height: 1.12;
	letter-spacing: -0.01em;
	color: #020713;
}

.am-h2__muted {
	color: #697284;
}

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

.am-phero {
	position: relative;
	display: flex;
	width: 100%;
	min-height: 700px;
	background-color: #020713;
	overflow: hidden;
}

.am-phero__media,
.am-phero__fallback {
	position: absolute;
	inset: 0;
}

.am-phero__fallback {
	background-size: cover;
	background-position: center;
}

.am-phero__media video,
.am-phero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.am-phero__overlay {
	position: absolute;
	inset: 0;
}

.am-phero__inner {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 40px;
	width: 100%;
	max-width: none;
	margin: 0 auto;
}

.am-phero__title {
	margin: 0;
	width: 51%;
	flex-shrink: 0;
	font-size: 62px;
	font-weight: 400;
	line-height: 1.11;
	letter-spacing: -0.01em;
	color: #ffffff;
}

.am-phero__right {
	display: flex;
	flex-direction: column;
	gap: 32px;
	max-width: 620px;
}

.am-phero__para {
	margin: 0;
	font-size: 16px;
	line-height: 24px;
	color: #e6e8e8;
}

.am-phero__btns {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

/* ---------------------------------------------------------------- */
/* Capability Cards                                                  */
/* ---------------------------------------------------------------- */

.am-caps {
	width: 100%;
}

.am-caps__inner {
	max-width: none;
	margin: 0 auto;
}

.am-caps__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 40px;
	margin-bottom: 56px;
}

.am-caps__head-left .am-eyebrow {
	margin-bottom: 24px;
}

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

.am-cap-card {
	position: relative;
	display: flex;
	flex-direction: column-reverse;
	justify-content: space-between;
	background-color: #fcf7ee;
	clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 0 100%);
	text-decoration: none;
	overflow: hidden;
	transition: transform 0.25s ease;
}

a.am-cap-card:hover {
	transform: translateY(-3px);
}

.am-cap-card__text {
	padding: 24px 24px 16px;
}

.am-cap-card__title {
	margin: 0 0 4px;
	font-size: 22px;
	font-weight: 500;
	color: #020713;
}

.am-cap-card__desc {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
	color: #020713;
	opacity: 0.75;
}

.am-cap-card__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-top: 24px;
	background-color: #b4ddff;
	color: #020713;
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%);
	transition: transform 0.2s ease;
}

a.am-cap-card:hover .am-cap-card__arrow {
	transform: translateX(3px);
}

.am-cap-card__arrow svg {
	width: 16px;
	height: 16px;
	display: block;
}

.am-cap-card__image img {
	display: block;
	width: 100%;
	height: auto;
	transition: transform 0.35s ease;
}

/* Hover chip — pinned top-right, shown on hover */
.am-cap-card__hoverbtn {
	position: absolute;
	top: 16px;
	right: 16px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 13px;
	background-color: #b4ddff;
	color: #020713;
	font-size: 14px;
	font-weight: 500;
	line-height: 1;
	white-space: nowrap;
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%);
	opacity: 0;
	transform: translateY(-4px);
	pointer-events: none;
	transition: opacity 0.2s ease, transform 0.2s ease;
}

.am-cap-card:hover .am-cap-card__hoverbtn {
	transform: translateY(0);
}

.am-cap-card__hoverbtn svg {
	width: 16px;
	height: 16px;
	display: block;
}

.am-cap-card:hover .am-cap-card__hoverbtn {
	opacity: 1;
}


/* ---------------------------------------------------------------- */
/* Risk Timeline                                                     */
/* ---------------------------------------------------------------- */

.am-risk {
	width: 100%;
}

.am-risk__inner {
	max-width: none;
	margin: 0 auto;
}

.am-risk__head .am-eyebrow {
	margin-bottom: 24px;
}

.am-risk__head {
	margin-bottom: 56px;
}

.am-risk__ruler {
	height: 26px;
	margin-bottom: 32px;
	color: rgba(2, 7, 19, 0.35);
	/* Tall major ticks with short minor ticks between them */
	background-image:
		repeating-linear-gradient(to right, currentColor 0, currentColor 1px, transparent 1px, transparent 252px),
		repeating-linear-gradient(to right, currentColor 0, currentColor 1px, transparent 1px, transparent 28px);
	background-image:
		repeating-linear-gradient(to right, currentColor 0, currentColor 1px, transparent 1px, transparent 252px),
		repeating-linear-gradient(to right, color-mix(in srgb, currentColor 45%, transparent) 0, color-mix(in srgb, currentColor 45%, transparent) 1px, transparent 1px, transparent 28px);
	background-size: 100% 100%, 100% 42%;
	background-position: left top, left center;
	background-repeat: no-repeat;
}

.am-risk__cols {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 24px;
	margin-bottom: 64px;
}

.am-risk__col {
	cursor: pointer;
}

.am-risk__col-title {
	margin: 0 0 4px;
	font-size: 20px;
	font-weight: 500;
	color: #9aa6b8;
}

.am-risk__col-sub {
	margin: 0;
	font-size: 14px;
	color: #9aa6b8;
}

.am-risk__col.is-active .am-risk__col-title {
	color: #020713;
	font-weight: 600;
}

.am-risk__col.is-active .am-risk__col-sub {
	color: #2e454c;
}

/* The image and the text under it share one block (.am-risk__col-more), so
   the text's Max Width is relative to the image, and the "own width" layout
   can size both at once. Shown on the active column only. */
.am-risk__col-more {
	display: none;
	width: 100%;
	vertical-align: top;
}

.am-risk__col.is-active .am-risk__col-more {
	display: inline-block; /* follows the column's text-align */
}

.am-risk__col-image {
	display: none;
	width: 100%;
	margin-top: 16px;
	vertical-align: top;
}

/* inline-block so a narrower Image Width follows the column's text-align. */
.am-risk__col.is-active .am-risk__col-image {
	display: inline-block;
	animation: am-risk-fade 0.45s ease;
}

/* "Own width" image layout (Image Layout control): the block keeps
   --am-risk-free-w whatever the column width and runs over the empty space
   of the following columns, as in the design. On the last columns (Grow
   Leftwards On The Last) it grows to the left instead, so nothing leaves the
   section. Below 1024px the columns are wide again and it reverts. */
.am-risk-imglayout-free .am-risk__col {
	min-width: 0;
	position: relative;
}

.am-risk-imglayout-free .am-risk__col.is-active {
	z-index: 1;
}

.am-risk-imglayout-free .am-risk__col.is-active .am-risk__col-more {
	width: var(--am-risk-free-w, 400px);
	max-width: none;
}

.am-risk-imglayout-free.am-risk-imganchor-1 .am-risk__col:nth-last-child(-n+1).is-active .am-risk__col-more,
.am-risk-imglayout-free.am-risk-imganchor-2 .am-risk__col:nth-last-child(-n+2).is-active .am-risk__col-more,
.am-risk-imglayout-free.am-risk-imganchor-3 .am-risk__col:nth-last-child(-n+3).is-active .am-risk__col-more {
	margin-left: calc(100% - var(--am-risk-free-w, 400px));
}

@media (max-width: 1024px) {
	.am-risk-imglayout-free .am-risk__col.is-active .am-risk__col-more {
		width: 100%;
		margin-left: 0;
	}
}

@keyframes am-risk-fade {
	from {
		opacity: 0;
		transform: translateY(8px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

.am-risk__col-image img {
	--am-rn: 14px;
	display: block;
	width: 100%;
	height: auto;
	clip-path: polygon(0 0, 100% 0, 100% 100%, var(--am-rn) 100%, 0 calc(100% - var(--am-rn)));
}

/* Optional title + description under the image. Revealed with the image, so
   it belongs to the active column only and fades in the same way. */
.am-risk__col-body {
	display: none;
	margin-top: 20px;
}

.am-risk__col.is-active .am-risk__col-body {
	display: block;
	animation: am-risk-fade 0.45s ease;
}

.am-risk__col-caption {
	margin: 0 0 10px;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	color: #020713;
}

.am-risk__col-desc {
	margin: 0;
	font-size: 13px;
	line-height: 1.6;
	color: #5a6472;
}

.am-risk__panel {
	position: relative;
	background-color: #020713;
	background-size: cover;
	background-position: center;
	padding: 56px;
	overflow: hidden;
	clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 24px 100%, 0 calc(100% - 24px));
}

.am-risk__panel-shade {
	position: absolute;
	inset: 0;
}

.am-risk__panel-inner {
	position: relative;
	z-index: 2;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 64px;
}

.am-risk__panel-text {
	margin: 0;
	max-width: 640px;
	font-size: 16px;
	line-height: 1.6;
	color: #ffffff;
}

.am-risk__panel-text--strong {
	flex-shrink: 0;
	max-width: 420px;
	font-size: 26px;
	line-height: 1.3;
	font-weight: 500;
}

/* ---------------------------------------------------------------- */
/* Statement                                                         */
/* ---------------------------------------------------------------- */

.am-statement {
	width: 100%;
}

.am-statement__inner {
	max-width: none;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	gap: 60px;
}

.am-statement__left {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.am-statement__left .am-eyebrow {
	margin-bottom: 32px;
}

.am-statement__title {
	margin: 0 0 48px;
	max-width: 640px;
	font-size: 40px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: -0.01em;
	background-image: linear-gradient(var(--am-st-angle, 129deg), var(--am-st-a, #ffffff), var(--am-st-b, #b4ddff));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

/* The left column stretches to match the (tall) image, and this auto margin
   pins the paragraph block to the bottom of it. That is why "Space Below
   Statement" appears to do nothing: the leftover space absorbs it. */
.am-statement__bottom {
	margin-top: auto;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 28px;
}

/* "Directly Below Statement" releases the auto margin, so the paragraph sits
   under the heading. The gap arrives as a custom property rather than a
   competing margin-top, so the control never has to out-order this rule. */
.am-statement-bpos-top .am-statement__bottom {
	margin-top: var(--am-st-bgap, 0px);
}

.am-statement__para {
	margin: 0;
	width: 100%;
	max-width: 440px;
	font-size: 14px;
	line-height: 1.65;
	color: rgba(229, 232, 231, 0.8);
}

.am-statement__media {
	flex: 0 0 48%;
	max-width: 48%;
}

.am-statement__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
}

/* Statement image carousel — autoplay crossfade, each image fades in from
   the center. The first slide stays in flow so the box keeps its height. */
.am-scarousel {
	position: relative;
	overflow: hidden;
}

.am-scarousel img {
	position: absolute;
	inset: 0;
	opacity: 0;
	transform: scale(var(--am-sc-scale, 0.92));
	transform-origin: center center;
	transition: opacity var(--am-sc-dur, 0.9s) ease, transform var(--am-sc-dur, 0.9s) ease;
}

.am-scarousel img:first-child {
	position: relative;
}

.am-scarousel img.is-active {
	opacity: 1;
	transform: none;
	z-index: 2;
}


/* ---------------------------------------------------------------- */
/* Photo Cards (industry pages)                                      */
/* ---------------------------------------------------------------- */

.am-pcards {
	width: 100%;
}

.am-pcards__inner {
	max-width: none;
	margin: 0 auto;
}

/* Eyebrow on its own row; heading + paragraph top-align below it */
.am-pcards__headrow {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
}

.am-pcards__head .am-eyebrow {
	margin-bottom: 20px;
}

.am-pcards__title {
	margin: 0;
	font-size: 40px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.01em;
}

.am-pcards__para {
	margin: 0;
	font-size: 13px;
	line-height: 1.6;
}

.am-pcards__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}

.am-pcard {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	overflow: hidden;
	background-color: #020713;
	text-decoration: none;
	transition: transform 0.25s ease;
}

a.am-pcard:hover {
	transform: translateY(-3px);
}

.am-pcard__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transition: transform var(--am-pc-dur, 0.7s) ease;
	will-change: transform;
}

.am-pcard:hover .am-pcard__bg {
	transform: scale(var(--am-pc-zoom, 1.06));
}

.am-pcard__shade {
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 1;
}

.am-pcard__content {
	position: relative;
	z-index: 2;
}

.am-pcard__title {
	margin: 0 0 6px;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.25;
}

.am-pcard__desc {
	margin: 0;
	font-size: 12px;
	line-height: 1.5;
}

/* ---------------------------------------------------------------- */
/* Item List (industry pages: components / valve types)              */
/* ---------------------------------------------------------------- */

.am-ilist {
	width: 100%;
}

.am-ilist__inner {
	max-width: none;
	margin: 0 auto;
}

/* Eyebrow on its own row; heading + paragraph top-align below it */
.am-ilist__headrow {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
}

.am-ilist__head .am-eyebrow {
	margin-bottom: 24px;
}

.am-ilist__para {
	margin: 0;
	font-size: 13px;
	line-height: 1.6;
}

.am-ilist__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}

.am-ilist__item {
	display: flex;
	align-items: center;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.am-ilist__item img {
	display: block;
	object-fit: cover;
	flex-shrink: 0;
}

.am-ilist__label {
	font-size: 14px;
	line-height: 1.4;
}

/* Card layout ("Wire & Cable Categories"): the image sits in its own box on
   top, the label underneath, and one corner of the card is notched. Which
   corner and how big come from the widget (prefix classes + --am-il-notch). */
.am-ilist--card .am-ilist__item {
	flex-direction: column;
	align-items: stretch;
	gap: 0;
	min-width: 0;
	overflow: hidden;
	clip-path: polygon(
		0 0,
		100% 0,
		100% calc(100% - var(--am-il-notch, 28px)),
		calc(100% - var(--am-il-notch, 28px)) 100%,
		0 100%
	);
	transition: background-color 0.2s ease, transform 0.25s ease;
}

.am-ilist-notch-tr.am-ilist--card .am-ilist__item {
	clip-path: polygon(
		0 0,
		calc(100% - var(--am-il-notch, 28px)) 0,
		100% var(--am-il-notch, 28px),
		100% 100%,
		0 100%
	);
}

.am-ilist-notch-bl.am-ilist--card .am-ilist__item {
	clip-path: polygon(
		0 0,
		100% 0,
		100% 100%,
		var(--am-il-notch, 28px) 100%,
		0 calc(100% - var(--am-il-notch, 28px))
	);
}

.am-ilist-notch-tl.am-ilist--card .am-ilist__item {
	clip-path: polygon(
		var(--am-il-notch, 28px) 0,
		100% 0,
		100% 100%,
		0 100%,
		0 var(--am-il-notch, 28px)
	);
}

.am-ilist-notch-none.am-ilist--card .am-ilist__item {
	clip-path: none;
}

.am-ilist--card .am-ilist__media {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	box-sizing: border-box;
	overflow: hidden;
}

.am-ilist--card .am-ilist__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	transition: transform 0.4s ease;
}

.am-ilist--card .am-ilist__label {
	display: block;
	width: 100%;
	box-sizing: border-box;
	font-size: 18px;
	line-height: 1.4;
}

/* Hover (linked cards): a small lift and a gentle zoom on the image */
.am-ilist-lift-yes.am-ilist--card a.am-ilist__item:hover {
	transform: translateY(-3px);
}

.am-ilist-lift-yes.am-ilist--card a.am-ilist__item:hover .am-ilist__media img {
	transform: scale(1.04);
}

@media (prefers-reduced-motion: reduce) {
	.am-ilist-lift-yes.am-ilist--card a.am-ilist__item:hover,
	.am-ilist-lift-yes.am-ilist--card a.am-ilist__item:hover .am-ilist__media img {
		transform: none;
	}
}

/* ---------------------------------------------------------------- */
/* Accordion Showcase                                                */
/* ---------------------------------------------------------------- */

.am-show {
	width: 100%;
}

.am-show__inner {
	max-width: none;
	margin: 0 auto;
	display: flex;
	align-items: stretch;
}

.am-show--right .am-show__inner {
	flex-direction: row-reverse;
}

/* Image carousel — first slide stays in flow so the box keeps its height */
.am-show__media {
	position: relative;
	overflow: hidden;
}

.am-show__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	inset: 0;
	opacity: 0;
	transform: scale(var(--am-sc-scale, 0.92));
	transform-origin: center center;
	transition: opacity var(--am-sc-dur, 0.9s) ease, transform var(--am-sc-dur, 0.9s) ease;
}

.am-show__media img:first-child {
	position: relative;
}

.am-show__media img.is-active {
	opacity: 1;
	transform: none;
	z-index: 2;
}

/* Content column */
.am-show__content {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.am-show__content .am-eyebrow {
	margin-bottom: 32px;
}

.am-show__title {
	margin: 0;
	font-size: 44px;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -0.01em;
}

/* Accordion list — pinned toward the bottom of the column */
.am-show__list {
	width: 100%;
	margin-top: auto;
}

.am-show__item {
	border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.am-show__item:last-child {
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.am-show__head {
	width: 100%;
	display: flex;
	align-items: baseline;
	gap: 10px;
	background: none;
	border: 0;
	outline: 0;
	box-shadow: none;
	cursor: pointer;
	text-align: left;
	font-size: 20px;
	font-weight: 400;
	line-height: 1.3;
	font-family: inherit;
	transition: color 0.25s ease;
}

.am-show__head,
.am-show__head:hover,
.am-show__head:focus,
.am-show__head:focus-visible,
.am-show__head:active {
	background: none;
	border: 0;
	outline: 0;
	box-shadow: none;
	/* Same trap as the FAQ question: a theme's `button { white-space: nowrap }`
	   keeps the whole label on one line and runs it past the row. */
	white-space: normal;
}

.am-show__head:focus-visible {
	outline: 2px solid #8fd0f5;
	outline-offset: 2px;
}

.am-show__num {
	flex-shrink: 0;
	font-size: inherit;
	font-weight: inherit;
	transition: color 0.25s ease;
}

/* Description slides open/closed */
.am-show__desc {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows var(--am-sh-slide, 0.5s) ease;
}

.am-show__desc > div {
	overflow: hidden;
}

.am-show__desc p {
	margin: 0 0 22px;
	font-size: 16px;
	line-height: 1.6;
}

.am-show__item.is-open .am-show__desc {
	grid-template-rows: 1fr;
}

/* Each item carries its own image for phones (Order On Small Screens: inside); hidden otherwise */
.am-show__item-img {
	display: none;
}


/* Flipped layout — image left, content right */
.am-statement-flip-yes .am-statement__inner {
	flex-direction: row-reverse;
}

/* Numbered accordion list */
.am-statement__list {
	width: 100%;
	max-width: 640px;
	margin-bottom: 40px;
}

.am-statement__list-item {
	border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.am-statement__list-head,
.am-statement__list-head:hover,
.am-statement__list-head:focus,
.am-statement__list-head:active {
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	outline: none;
}

.am-statement__list-head {
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	padding: 18px 0;
	cursor: pointer;
	text-align: left;
	font-family: inherit;
	font-size: 22px;
	line-height: 1.3;
	color: rgba(255, 255, 255, 0.5);
	transition: color 0.2s ease;
}

.am-statement__list-head:hover,
.am-statement__list-item.is-open .am-statement__list-head {
	color: #b4ddff;
}

/* Number inherits the title's typography and gray state */
.am-statement__list-num {
	flex-shrink: 0;
	font-size: inherit;
	color: inherit;
}

.am-statement__list-item.is-open .am-statement__list-num {
	color: #0080b8;
}

.am-statement__list-desc {
	display: none;
	padding: 0 0 20px 52px;
}

.am-statement__list-item.is-open .am-statement__list-desc {
	display: block;
}

.am-statement__list-desc p {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: rgba(229, 232, 231, 0.7);
}

/* ---------------------------------------------------------------- */
/* Pillars                                                           */
/* ---------------------------------------------------------------- */

.am-pillars {
	width: 100%;
}

.am-pillars__inner {
	max-width: none;
	margin: 0 auto;
}

.am-pillars__head .am-eyebrow {
	margin-bottom: 24px;
}

.am-pillars__head {
	margin-bottom: 56px;
}

.am-pillars__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	margin-bottom: 24px;
}

.am-pillar {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	aspect-ratio: 443 / 540;
	padding: 24px;
	background-color: #020713;
	clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
	overflow: hidden;
}

.am-pillar__bg {
	position: absolute;
	inset: 0;
}

.am-pillar__bg img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: var(--am-p-imgop, 1);
	transition: transform var(--am-p-zoomdur, 5s) ease-out;
}

/* Slow zoom applies to every card */
.am-pillar:hover .am-pillar__bg img {
	transform: scale(var(--am-p-zoom, 1.08));
}

/* Composed from custom properties rather than written whole by the Overlay
   Color control, so the fade stops and the overall opacity stay adjustable.
   With the control writing the entire `background` shorthand at repeater-item
   specificity, nothing here could reach the gradient — which is why the photo
   always showed through the list. The third stop holds the colour solid from
   the fade end down to the bottom edge. */
.am-pillar__shade {
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: var(--am-p-shadeop, 1);
	background: linear-gradient(
		180deg,
		transparent var(--am-p-fadestart, 25%),
		var(--am-p-overlay, rgba(2, 7, 19, 0.85)) var(--am-p-fadeend, 80%),
		var(--am-p-overlay, rgba(2, 7, 19, 0.85)) 100%
	);
}

.am-pillar__chip {
	position: relative;
	z-index: 2;
	display: inline-flex;
	padding: 12px 16px;
	background-color: #ffffff;
	color: #020713;
	font-size: 14px;
	font-weight: 500;
	line-height: 1;
	transition: background-color 0.25s ease, color 0.25s ease;
}

/* Chip color change only on cards with the hover flag */
/* !important so the hover state beats the per-card chip color controls,
   whose element-specific CSS is otherwise more specific. The hover colors
   themselves stay controllable (they feed these variables). */
.am-pillar--hover:hover .am-pillar__chip {
	background-color: var(--am-p-chbg, #b4ddff) !important;
	color: var(--am-p-chc, #020713) !important;
}

.am-pillar__title {
	margin: 0 0 10px;
	font-size: 22px;
	font-weight: 500;
	line-height: 1.25;
	color: #ffffff;
}

.am-pillar__content {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
}

.am-pillar__desc {
	margin: 0;
	max-width: 320px;
	font-size: 13px;
	line-height: 1.55;
	color: #ffffff;
}

.am-pillar__items {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
}

.am-pillar__item {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 7px 12px 7px 10px;
	margin-left: -10px;
	border-radius: 2px;
	font-size: 14px;
	line-height: 1.3;
}

.am-pillar__item::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background-color: var(--am-p-dot, #0080b8);
	flex-shrink: 0;
}

/* Optional bottom link -------------------------------------------- */

/* The content column is shrink-wrapped by the card's `align-items:
   flex-start`, so it only stretches to the card's width when a link is
   actually present. Cards without one keep their existing layout exactly. */
.am-pillar--haslink .am-pillar__content {
	width: 100%;
}

.am-pillar__foot {
	display: flex;
	justify-content: var(--am-p-morealign, flex-end);
	width: 100%;
	margin-top: var(--am-p-moregap, 6px);
}

.am-pillar__more {
	display: inline-flex;
	align-items: center;
	gap: var(--am-p-moregapicon, 10px);
	font-size: 15px;
	line-height: 1.3;
}

/* Themes repaint links on hover/focus/active and a pseudo-class selector beats
   a bare class. Colours come back through custom properties the controls set,
   so the controls still win without !important. */
a.am-pillar__more,
a.am-pillar__more:hover,
a.am-pillar__more:focus,
a.am-pillar__more:focus-visible,
a.am-pillar__more:active {
	background: none;
	border: 0;
	box-shadow: none;
	outline: 0;
	text-decoration: none;
	transform: none;
	color: var(--am-p-morecolor, #ffffff);
}

a.am-pillar__more:hover {
	color: var(--am-p-morecolor-h, var(--am-p-morecolor, #ffffff));
}

a.am-pillar__more:focus-visible {
	outline: 2px solid var(--am-p-morefocus, #8fd0f5);
	outline-offset: 3px;
}

.am-pillar__more svg,
.am-pillar__more img {
	display: block;
	width: var(--am-p-morearrow, 17px);
	height: var(--am-p-morearrow, 17px);
	object-fit: contain;
	transition: transform 0.2s ease;
}

a.am-pillar__more:hover svg,
a.am-pillar__more:hover img {
	transform: translateX(3px);
}

.am-pillars__panel {
	--am-p-pn-tr: 24px;
	--am-p-pn-bl: 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 40px;
	background-color: #fcf7ee;
	padding: 32px;
	clip-path: polygon(
		0 0,
		calc(100% - var(--am-p-pn-tr)) 0,
		100% var(--am-p-pn-tr),
		100% 100%,
		var(--am-p-pn-bl) 100%,
		0 calc(100% - var(--am-p-pn-bl))
	);
}

/* Gradient heading — background-clip: text over a linear gradient, the same
   technique as .am-tband__title. Scoped to this widget's own class rather than
   the shared .am-h2, which nine other widgets use. The muted span inherits
   -webkit-text-fill-color, so the gradient runs across both parts. */
.am-pillars-fill-gradient .am-pillars__title {
	background-image: linear-gradient(
		var(--am-p-h-angle, 129deg),
		var(--am-p-h-a, #ffffff),
		var(--am-p-h-b, #b4ddff)
	);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

.am-pillars__panel-text {
	margin: 0;
	flex: 0 0 62%;
	max-width: 62%;
	font-size: 16px;
	line-height: 1.5;
	color: #020713;
}

.am-pillars__panel .am-btn {
	flex-shrink: 0;
}

/* ---------------------------------------------------------------- */
/* Video Feature                                                     */
/* ---------------------------------------------------------------- */

.am-vfeature {
	width: 100%;
}

.am-vfeature__inner {
	max-width: none;
	margin: 0 auto;
}

.am-vfeature__label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 16px;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #020713;
}

.am-vfeature__label img {
	width: 16px;
	height: 16px;
	object-fit: contain;
}

.am-vfeature__plus {
	font-size: 15px;
	line-height: 1;
}

.am-vfeature__top {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 60px;
	margin-bottom: 56px;
}

/* Flex column so the button keeps its natural width and its Alignment
   (align-self) control works; text blocks span full width so text
   alignment behaves normally. */
.am-vfeature__head {
	max-width: 480px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.am-vfeature__label,
.am-vfeature__title,
.am-vfeature__head .am-vfeature__para {
	width: 100%;
}

.am-vfeature__title {
	margin: 0;
	font-size: 44px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #020713;
}

/* Two media boxes: taller video left, shorter image right */
.am-vfeature__media {
	flex: 0 0 48%;
	max-width: 48%;
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.am-vfeature__video,
.am-vfeature__image {
	flex: 1 1 0;
}

.am-vfeature__video video,
.am-vfeature__video img {
	display: block;
	width: 100%;
	height: 540px;
	object-fit: cover;
}

.am-vfeature__image img {
	display: block;
	width: 100%;
	height: 330px;
	object-fit: cover;
}

.am-vfeature__divider {
	border-top: 1px solid rgba(2, 7, 19, 0.15);
	margin-bottom: 40px;
}

.am-vfeature__bottom {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
}

.am-vfeature__para {
	margin: 0;
	max-width: 620px;
	font-size: 16px;
	line-height: 24px;
	color: #333333;
}

/* ---------------------------------------------------------------- */
/* Industries                                                        */
/* ---------------------------------------------------------------- */

.am-inds {
	width: 100%;
}

.am-inds__inner {
	max-width: none;
	margin: 0 auto;
}

.am-inds__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 40px;
	margin-bottom: 56px;
}

.am-inds__title {
	margin: 0;
	max-width: 705px;
	font-size: 52px;
	font-weight: 400;
	line-height: 1.12;
	letter-spacing: -0.01em;
	color: #ffffff;
}

.am-inds__grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 16px;
}

/* Flat divider column (design default) */
.am-ind-card {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 8px 16px 8px 20px;
	border-left: 1px solid rgba(180, 221, 255, 0.35);
	background-size: cover;
	background-position: center;
	text-decoration: none;
	transition: transform 0.25s ease;
}

/* Automatically switches to a photo card when a background image is set */
.am-ind-card--image {
	justify-content: space-between;
	min-height: 320px;
	padding: 20px;
	border-left: 0;
	background-color: #0e1a1e;
	overflow: hidden;
}

a.am-ind-card:hover {
	transform: translateY(-3px);
}

.am-ind-card__shade {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.am-ind-card__icon {
	position: relative;
	z-index: 2;
	display: inline-flex;
	margin-bottom: 56px;
}

.am-ind-card__icon img {
	width: 44px;
	height: 44px;
	object-fit: contain;
}

.am-ind-card__bottom {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
}

.am-ind-card__title {
	margin: 0;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.3;
	color: #ffffff;
}

.am-ind-card__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background-color: #b4ddff;
	color: #020713;
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%);
	transition: transform 0.2s ease;
}

a.am-ind-card:hover .am-ind-card__arrow {
	transform: translateX(3px);
}

.am-ind-card__arrow svg,
.am-ind-card__arrow img {
	width: 16px;
	height: 16px;
	display: block;
	object-fit: contain;
}

/* ---------------------------------------------------------------- */
/* Quote                                                             */
/* ---------------------------------------------------------------- */

.am-quote {
	width: 100%;
	padding: 30px;
	background-color: #ffffff;
}

.am-quote__stage {
	position: relative;
	height: 88vh;
	min-height: 420px;
	overflow: hidden;
}

/* Zoom-in on scroll */
.am-quote--zoom .am-quote__stage {
	transform: scale(var(--am-q-start, 0.92));
	transition: transform 1s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.am-quote--zoom .am-quote__stage.is-inview {
	transform: scale(1);
}

.am-quote__media {
	position: absolute;
	inset: 0;
}

.am-quote__media video,
.am-quote__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Dark quote box pinned bottom-right */
.am-quote__box {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 480px;
	max-width: calc(100% - 24px);
	display: flex;
	flex-direction: column;
	gap: 40px;
	padding: 40px;
	background-color: #0e1a1e;
}

.am-quote__text {
	margin: 0;
	font-size: 22px;
	font-weight: 400;
	line-height: 1.5;
	color: #ffffff;
}

.am-quote__accent {
	color: #b4ddff;
}

/* Gradient quote — background-clip: text across the whole quote, so the two
   parts read as one continuous fade instead of switching colour at the join.
   The accent span inherits -webkit-text-fill-color, so the gradient runs
   through it too. */
.am-quote-fill-gradient .am-quote__text {
	background-image: linear-gradient(
		var(--am-qt-angle, 129deg),
		var(--am-qt-a, #ffffff),
		var(--am-qt-b, #b4ddff)
	);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

.am-quote__foot {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
}

.am-quote__logo {
	display: block;
	width: 44px;
	height: auto;
}

.am-quote__mark {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 64px;
	font-weight: 700;
	line-height: 0.4;
	color: #ffffff;
}

.am-quote__mark img {
	display: block;
	width: 48px;
	height: auto;
	object-fit: contain;
}

/* ---------------------------------------------------------------- */
/* CTA Band subtext (extension)                                      */
/* ---------------------------------------------------------------- */

.am-ctaband__subtext {
	margin: -28px 0 44px;
	font-size: 16px;
	line-height: 24px;
}

/* ---------------------------------------------------------------- */
/* Solutions Grid                                                    */
/* ---------------------------------------------------------------- */

.am-sol {
	width: 100%;
}

.am-sol__inner {
	max-width: none;
	margin: 0 auto;
}

.am-sol__head {
	margin-bottom: 110px;
}

/* Label on its own row; heading + paragraph/button top-align below it */
.am-sol__headrow {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
}

.am-sol__head .am-btn {
	flex-shrink: 0;
}

.am-sol__para {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
}

.am-sol__label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 16px;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #020713;
}

.am-sol__plus {
	font-size: 15px;
	line-height: 1;
}

.am-sol__title {
	margin: 0;
	font-size: 40px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #020713;
}

.am-sol__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

.am-sol__item {
	padding: 4px 16px 4px 20px;
	border-left: 1px solid rgba(2, 7, 19, 0.2);
}

.am-sol__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	margin-bottom: 48px;
	background-color: #020713;
}

.am-sol__icon img {
	display: block;
	width: 24px;
	height: 24px;
	object-fit: contain;
}

.am-sol__item-title {
	margin: 0 0 14px;
	font-size: 20px;
	font-weight: 400;
	line-height: 1.25;
	color: #020713;
}

.am-sol__item-desc {
	margin: 0;
	font-size: 13px;
	line-height: 1.55;
	color: rgba(2, 7, 19, 0.75);
}

/* ---------------------------------------------------------------- */
/* Resource Cards                                                    */
/* ---------------------------------------------------------------- */

.am-res {
	width: 100%;
}

.am-res__inner {
	max-width: none;
	margin: 0 auto;
}

.am-res__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
	margin-bottom: 56px;
}

.am-res__head .am-btn {
	flex-shrink: 0;
}

.am-res__headleft .am-eyebrow {
	margin-bottom: 24px;
}

.am-res__title {
	margin: 0;
	font-size: 40px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #020713;
}

.am-res__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

.am-res-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	min-height: 195px;
	padding: 20px;
	background-color: #d3edfe;
	clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
	text-decoration: none;
	transition: transform 0.25s ease;
}

a.am-res-card:hover {
	transform: translateY(-3px);
}

.am-res-card__title {
	margin: 0 0 10px;
	font-size: 20px;
	font-weight: 400;
	line-height: 1.25;
	color: #020713;
}

.am-res-card__desc {
	margin: 0;
	font-size: 13px;
	line-height: 1.55;
	color: rgba(2, 7, 19, 0.75);
}

.am-res-card__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	margin-top: auto;
	align-self: flex-end;
	background-color: #ffffff;
	color: #020713;
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%);
	transition: transform 0.2s ease;
}

a.am-res-card:hover .am-res-card__arrow {
	transform: translateX(3px);
}

.am-res-card__arrow svg,
.am-res-card__arrow img {
	width: 16px;
	height: 16px;
	display: block;
	object-fit: contain;
}

/* ---------------------------------------------------------------- */
/* Responsive                                                        */
/* ---------------------------------------------------------------- */


/* ---------------------------------------------------------------- */
/* Banner Strip (quote banner / inline CTA strip)                    */
/* ---------------------------------------------------------------- */

.am-banner {
	width: 100%;
}

.am-banner__panel {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	margin: 0 auto;
	overflow: hidden;
}

.am-banner--center .am-banner__panel {
	flex-direction: column;
	justify-content: center;
}

.am-banner--center .am-banner__text {
	text-align: center;
}

.am-banner__text {
	margin: 0;
	font-size: 24px;
	line-height: 1.45;
}

.am-banner__panel .am-btn {
	flex-shrink: 0;
}

/* ---------------------------------------------------------------- */
/* Commitment (dark band: heading left, chip-labelled images right)  */
/* ---------------------------------------------------------------- */

.am-commit {
	width: 100%;
}

.am-commit__inner {
	max-width: none;
	margin: 0 auto;
	display: flex;
	align-items: center;
}

.am-commit__label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.am-commit__title {
	margin: 0;
	font-size: 44px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: -0.01em;
	background-image: linear-gradient(var(--am-cm-angle, 129deg), var(--am-cm-a, #ffffff), var(--am-cm-b, #b4ddff));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

.am-commit__grid {
	flex: 1 1 auto;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	min-width: 0;
}

.am-commit__media {
	position: relative;
}

.am-commit__media img {
	display: block;
	width: 100%;
	object-fit: cover;
}

.am-commit__chip {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	font-size: 11px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	white-space: nowrap;
}

.am-commit__caption {
	margin: 14px 0 0;
	font-size: 13px;
	line-height: 1.55;
}

/* ---------------------------------------------------------------- */
/* Team Cards (leadership grid with hover reveal)                    */
/* ---------------------------------------------------------------- */

.am-team {
	width: 100%;
}

.am-team__inner {
	max-width: none;
	margin: 0 auto;
}

.am-team__head .am-eyebrow {
	margin-bottom: 24px;
}

/* Split head: heading left, supporting paragraph right. Only applied when a
   side paragraph is actually present, so a head without one stays a plain
   block and its heading keeps wrapping exactly as before. */
.am-team__head--split {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 40px;
}

.am-team__headmain {
	min-width: 0;
}

.am-team__side {
	flex: 0 0 auto;
	max-width: var(--am-tm-side-w, 420px);
	margin: 0;
	font-size: 14px;
	line-height: 1.55;
	color: #3f3b34;
}

.am-team__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}

.am-team-card {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	overflow: hidden;
	background-color: #020713;
	text-decoration: none;
}

.am-team-card__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center top;
}

.am-team-card__shade {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
}

.am-team-card__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	opacity: 0;
	pointer-events: none;
	transition: opacity var(--am-tm-dur, 0.45s) ease;
}

.am-team-card:hover .am-team-card__overlay {
	opacity: 1;
}

.am-team-card__content {
	position: relative;
	z-index: 2;
}

/* Chip colours travel as custom properties so the Associates style can hold
   the hover colour steady without out-specifying Elementor's generated CSS. */
.am-team-card__chip {
	display: inline-flex;
	flex-direction: column;
	gap: 2px;
	max-width: 100%;
	background-color: var(--am-tm-chip-bg, #d3edfe);
	transition: background-color var(--am-tm-dur, 0.45s) ease;
}

.am-team-card:hover .am-team-card__chip {
	background-color: var(--am-tm-chip-bg-h, var(--am-tm-chip-bg, #d3edfe));
}

.am-team-card__name {
	font-size: 18px;
	font-weight: 600;
	line-height: 1.3;
}

.am-team-card__role {
	font-size: 13px;
	line-height: 1.4;
}

/* Description expands beneath the chip, pushing it upward */
.am-team-card__descwrap {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows var(--am-tm-dur, 0.45s) ease;
}

.am-team-card__descwrap > div {
	overflow: hidden;
}

.am-team-card:hover .am-team-card__descwrap {
	grid-template-rows: 1fr;
}

.am-team-card__desc {
	margin: 0;
	font-size: 14px;
	line-height: 1.55;
}

/* Touch devices: no hover, so show the finished state */


/* ---------------------------------------------------------------- */
/* LinkedIn badge + stretched card link                              */
/* ---------------------------------------------------------------- */

/* A card carrying a LinkedIn badge cannot itself be an <a> (anchors do not
   nest), so its own link is laid over the card instead. */
.am-team-card__link {
	position: absolute;
	inset: 0;
	z-index: 3;
}

.am-team-card__link,
.am-team-card__link:hover,
.am-team-card__link:focus,
.am-team-card__link:active {
	background: none;
	border: 0;
	box-shadow: none;
	outline: 0;
	text-decoration: none;
}

.am-team-card__link:focus-visible {
	outline: 2px solid var(--am-tm-li-focus, #8fd0f5);
	outline-offset: -3px;
}

/* The design's badge is the white LinkedIn mark itself (rounded square with
   the "in" knocked out, 32px, 36px from the corner) straight on the photo:
   no box, no fill behind it. The box only defines the click target. */
.am-team-card__li {
	position: absolute;
	top: var(--am-tm-li-top, 36px);
	left: var(--am-tm-li-left, 36px);
	z-index: 4;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--am-tm-li-box, 32px);
	height: var(--am-tm-li-box, 32px);
	opacity: 0;
	transform: translateY(var(--am-tm-li-shift, -8px));
	transition: opacity var(--am-tm-dur, 0.45s) ease, transform var(--am-tm-dur, 0.45s) ease,
		background-color 0.2s ease, color 0.2s ease;
}

.am-team-card__li svg,
.am-team-card__li img {
	display: block;
	width: var(--am-tm-li-icon, 32px);
	height: var(--am-tm-li-icon, 32px);
	object-fit: contain;
}

/* Themes repaint links on hover/focus/active and a pseudo-class selector beats
   a bare class. The colours come back through custom properties the controls
   set, so the controls still win without !important. Opacity and transform are
   restated by the reveal rules below, which outrank this group. */
a.am-team-card__li,
a.am-team-card__li:hover,
a.am-team-card__li:focus,
a.am-team-card__li:focus-visible,
a.am-team-card__li:active {
	background-image: none;
	background-color: var(--am-tm-li-bg, transparent);
	border: 0;
	box-shadow: none;
	outline: 0;
	color: var(--am-tm-li-color, #ffffff);
	text-decoration: none;
}

a.am-team-card__li:hover {
	background-color: var(--am-tm-li-bg-h, var(--am-tm-li-bg, transparent));
	color: var(--am-tm-li-color-h, var(--am-tm-li-color, #ffffff));
}

/* Reveal: card hover, keyboard focus, or the Always Visible setting. Keyboard
   focus is included so the badge can never be tabbed to while invisible. */
.am-team-card:hover .am-team-card__li,
.am-team-li-always .am-team-card__li,
a.am-team-card__li:focus-visible {
	opacity: 1;
	transform: none;
}

a.am-team-card__li:focus-visible {
	outline: 2px solid var(--am-tm-li-focus, #8fd0f5);
	outline-offset: 2px;
}

/* Touch devices have no hover, so the badge shows outright. */


/* ---------------------------------------------------------------- */
/* Card Style: Associates                                            */
/* ---------------------------------------------------------------- */

/* The Associates grid is a static card — the photo, the notched corner and
   the name chip, with none of the Products hover choreography. Each rule
   carries the style class so it outranks the :hover rules above (and the
   hover:none block, which media queries do not add specificity to). */
.am-team-style-associates .am-team-card__overlay,
.am-team-style-associates .am-team-card:hover .am-team-card__overlay {
	opacity: 0;
}

.am-team-style-associates .am-team-card__descwrap,
.am-team-style-associates .am-team-card:hover .am-team-card__descwrap {
	grid-template-rows: 0fr;
}

.am-team-style-associates .am-team-card:hover .am-team-card__chip {
	background-color: var(--am-tm-chip-bg, #d3edfe);
}

/* ---------------------------------------------------------------- */
/* Team head: stack the side paragraph under the heading             */
/* ---------------------------------------------------------------- */


/* ---------------------------------------------------------------- */
/* Discipline (heading + chips left, media boxes right)              */
/* ---------------------------------------------------------------- */

.am-disc {
	width: 100%;
}

.am-disc__inner {
	max-width: none;
	margin: 0 auto;
}

.am-disc__top {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
}

.am-disc__title {
	margin: 0;
	font-size: 40px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.01em;
}

.am-disc__chips {
	display: flex;
	flex-wrap: wrap;
}

.am-disc__chip {
	display: inline-flex;
	align-items: center;
	font-size: 13px;
	line-height: 1;
	white-space: nowrap;
}

/* min-width: 0 on both columns: a flex item defaults to min-width: auto and
   refuses to shrink below its content's intrinsic minimum, which is how a wide
   chip or image pushes the row past the screen and produces a horizontal
   scrollbar rather than wrapping. */
.am-disc__head {
	min-width: 0;
}

.am-disc__media {
	flex: 1 1 auto;
	display: flex;
	justify-content: flex-end;
	min-width: 0;
}

.am-disc__box {
	min-width: 0;
}

.am-disc__box video,
.am-disc__box img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.am-disc__divider {
	border-top: 1px solid rgba(2, 7, 19, 0.15);
}

.am-disc__bottom {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
}

.am-disc__para {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
}

/* ---------------------------------------------------------------- */
/* Stat Feature (eyebrow + heading + stat tiles left, image right)   */
/* ---------------------------------------------------------------- */

.am-statf {
	width: 100%;
}

.am-statf__inner {
	max-width: none;
	margin: 0 auto;
	display: flex;
	align-items: stretch;
}

.am-statf__left .am-eyebrow {
	margin-bottom: 20px;
}

.am-statf__title {
	margin: 0;
	font-size: 40px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.01em;
}

.am-statf__para {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
}

.am-statf__tiles {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}

.am-statf__tile {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	background-size: cover;
	background-position: center;
}

.am-statf__value {
	font-size: 46px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: -1px;
}

.am-statf__label {
	display: block;
	margin-top: 24px;
	padding: 10px 0 0;
	border-top: 1px solid rgba(255, 255, 255, 0.3);
	font-size: 13px;
	line-height: 1.3;
}

.am-statf__media {
	flex: 1 1 auto;
	min-width: 0;
}

.am-statf__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ---------------------------------------------------------------- */
/* Heritage (text + label chip rows left, notched image right)       */
/* ---------------------------------------------------------------- */

.am-herit {
	width: 100%;
}

.am-herit__inner {
	max-width: none;
	margin: 0 auto;
	display: flex;
	align-items: stretch;
}

.am-herit__left .am-eyebrow {
	margin-bottom: 20px;
}

.am-herit__title {
	margin: 0;
	font-size: 40px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.01em;
}

.am-herit__para {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
}

.am-herit__chiprows {
	display: flex;
	flex-direction: column;
}

.am-herit__chiprow {
	display: flex;
	flex-wrap: wrap;
}

.am-herit__chip {
	display: inline-flex;
	align-items: center;
	border: 1px solid rgba(2, 7, 19, 0.15);
	font-size: 12px;
	line-height: 1;
	white-space: nowrap;
}

.am-herit__media {
	flex: 1 1 auto;
	min-width: 0;
}

.am-herit__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ---------------------------------------------------------------- */
/* Openings (careers table)                                          */
/* ---------------------------------------------------------------- */

.am-open {
	width: 100%;
}

.am-open__inner {
	max-width: none;
	margin: 0 auto;
}

.am-open__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
}

.am-open__title {
	margin: 0;
	font-size: 40px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.01em;
	background-image: linear-gradient(var(--am-op-angle, 100deg), var(--am-op-a, #ffffff), var(--am-op-b, #b4ddff));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

.am-open__para {
	margin: 0;
	font-size: 13px;
	line-height: 1.6;
}

.am-open__cols,
.am-open__row {
	display: grid;
	grid-template-columns: 2.2fr 1.2fr 1.2fr minmax(90px, auto);
	gap: 24px;
	align-items: center;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.am-open__cols {
	padding-bottom: 12px;
	font-size: 12px;
	letter-spacing: 0.04em;
}

.am-open__role {
	font-size: 15px;
	font-weight: 500;
	line-height: 1.4;
}

.am-open__meta {
	font-size: 13px;
	line-height: 1.4;
}

.am-open__action {
	display: flex;
	justify-content: flex-end;
}

.am-open__btn {
	min-width: 0;
	font-size: 13px;
	padding: 10px 14px;
	gap: 10px;
}

.am-open__btn .am-btn__arrow svg {
	width: 14px;
	height: 14px;
}

.am-open__empty {
	margin: 0;
	font-size: 15px;
	color: rgba(229, 232, 231, 0.75);
}

/* Row hover: the row flips to a light card (white, dark text) and its Apply
   button switches to the brand blue, per the design's hover state. Colours
   are custom properties the widget's Row Hover controls set on .am-open.
   !important throughout: Elementor writes the resting colours at
   .elementor-N .elementor-element.elementor-element-X .am-open__role, the
   same weight as these :hover rules, and its post CSS loads after this file.
   The button's --am-btn-* are overridden on the button itself because the
   button control pack sets them there, so inheritance from the row would
   never reach it. */
.am-open__row {
	transition: background-color 0.2s ease;
}

.am-open__role,
.am-open__meta {
	transition: color 0.2s ease;
}

.am-open__btn {
	transition: transform 0.2s ease, opacity 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.am-open-hover-yes .am-open__row:hover {
	background-color: var(--am-op-hbg, #ffffff) !important;
}

.am-open-hover-yes .am-open__row:hover .am-open__role {
	color: var(--am-op-hrole, #020713) !important;
}

.am-open-hover-yes .am-open__row:hover .am-open__meta {
	color: var(--am-op-hmeta, #3f3b34) !important;
}

.am-open-hover-yes .am-open__row:hover .am-open__btn {
	--am-btn-bg: var(--am-op-hbb, #0080b8) !important;
	--am-btn-color: var(--am-op-hbc, #ffffff) !important;
}

/* ---------------------------------------------------------------- */
/* Reason Cards (six reasons grid with risk panels)                  */
/* ---------------------------------------------------------------- */

.am-reasons {
	width: 100%;
}

.am-reasons__inner {
	max-width: none;
	margin: 0 auto;
}

.am-reasons__eyerow .am-eyebrow {
	margin-bottom: 24px;
}

.am-reasons__headrow {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
}

.am-reasons__para {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
}

.am-reasons__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}

.am-reason {
	position: relative;
	display: flex;
	flex-direction: column;
	background-color: #020713;
	overflow: hidden;
	text-decoration: none;
	transition: transform 0.25s ease;
}

a.am-reason:hover {
	transform: translateY(-3px);
}

.am-reason__media {
	position: relative;
	overflow: hidden;
}

.am-reason__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--am-rc-dur, 0.7s) ease;
	will-change: transform;
}

.am-reason:hover .am-reason__media img {
	transform: scale(var(--am-rc-zoom, 1.06));
}

/* Photo fades into the card background */
.am-reason__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(2, 7, 19, 0) 40%, #020713 100%);
	pointer-events: none;
}

/* Hover arrow chip, tucked under the top-right fold */
.am-reason__arrow {
	position: absolute;
	top: 48px;
	right: 0;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transform: translateY(-4px);
	pointer-events: none;
	transition: opacity 0.25s ease, transform 0.25s ease;
}

.am-reason:hover .am-reason__arrow {
	opacity: 1;
	transform: translateY(0);
}

.am-reason__arrow svg,
.am-reason__arrow img {
	width: 20px;
	height: 20px;
	display: block;
}


.am-reason__body {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}

.am-reason__title {
	margin: 0 0 12px;
	font-size: 26px;
	font-weight: 400;
	line-height: 1.2;
}

.am-reason__desc {
	margin: 0;
	font-size: 14px;
	line-height: 1.55;
}

.am-reason__panel {
	margin-top: auto;
}

.am-reason__panel-label {
	display: block;
	margin-bottom: 8px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.am-reason__panel-text {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
}

.am-reason__desc + .am-reason__panel {
	margin-top: 24px;
}

/* ---------------------------------------------------------------- */
/* Convergence (items → lines → outcome panel)                       */
/* ---------------------------------------------------------------- */

.am-conv {
	width: 100%;
}

.am-conv__inner {
	max-width: none;
	margin: 0 auto;
}

.am-conv__label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin-bottom: 20px;
}

.am-conv__headrow {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
}

.am-conv__title {
	margin: 0;
	font-size: 44px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: -0.01em;
	max-width: 720px;
}

.am-conv__para {
	margin: 0;
	font-size: 14px;
	line-height: 1.65;
}

.am-conv__diagram {
	display: flex;
	align-items: stretch;
}

.am-conv__list {
	display: flex;
	flex-direction: column;
}

.am-conv__item {
	position: relative;
	display: flex;
	align-items: center;
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 2px;
	font-size: 15px;
	line-height: 1.3;
}

.am-conv__item::before {
	content: "";
	width: 8px;
	height: 8px;
	margin-right: 14px;
	border-radius: 1.5px;
	background-color: #0080b8;
	flex-shrink: 0;
}

/* The SVG is absolutely positioned so its viewBox aspect ratio can never
   drive the layout height — it just fills whatever height the boxes give
   the row. */
.am-conv__lines {
	position: relative;
	flex: 1 1 auto;
	min-width: 60px;
	align-self: stretch;
}

.am-conv__lines svg {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
}

.am-conv__line {
	stroke: rgba(255, 255, 255, 0.55);
	stroke-width: 1;
}

.am-conv__flow {
	stroke: #0080b8;
	stroke-width: 2;
	stroke-dasharray: 8 120;
}

.am-conv-flow-yes .am-conv__flow {
	animation: am-conv-flow var(--am-cv-speed, 4s) linear infinite;
}

@keyframes am-conv-flow {
	to {
		stroke-dashoffset: -128;
	}
}


.am-conv__outcome {
	align-self: center;
	background-size: cover;
	background-position: center;
}

.am-conv__outcome-label {
	display: block;
	margin-bottom: 6px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.am-conv__outcome-text {
	display: block;
	font-size: 28px;
	font-weight: 400;
	line-height: 1.25;
}

/* ---------------------------------------------------------------- */
/* Split Feature ("Why It Matters")                                  */
/* ---------------------------------------------------------------- */
.am-split {
	width: 100%;
	background-color: #fff;
}

.am-split__inner {
	max-width: none;
	margin: 0 auto;
	display: flex;
	align-items: stretch;
	gap: 96px;
}

.am-split-order-image-first .am-split__inner {
	flex-direction: row-reverse;
}

.am-split__content {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
}

.am-split__eyerow {
	display: flex;
	width: 100%;
	margin-bottom: 32px;
}

.am-split__title {
	margin: 0 0 96px;
	width: 100%;
	max-width: 600px;
	font-size: 56px;
	font-weight: 400;
	line-height: 1.12;
	letter-spacing: -0.02em;
	color: #020713;
}

.am-split__title .am-h2__muted {
	color: #0080b8;
}

.am-split__para {
	margin: 0;
	width: 100%;
	max-width: 520px;
	font-size: 16px;
	line-height: 1.6;
	color: #3f3b34;
}

.am-split__media {
	position: relative;
	flex: 0 0 47%;
	max-width: 47%;
	height: 600px;
	overflow: hidden;
	clip-path: polygon(0 0, calc(100% - var(--am-sp-n, 24px)) 0, 100% var(--am-sp-n, 24px), 100% 100%, 0 100%);
}

.am-split__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* carousel inside the fixed-height media box: every slide is absolute */
.am-split__media.am-scarousel img,
.am-split__media.am-scarousel img:first-child {
	position: absolute;
	inset: 0;
}

/* ---------------------------------------------------------------- */
/* Comparison Flow ("Why Boots on the Ground Matters")               */
/* ---------------------------------------------------------------- */
.am-cmp {
	width: 100%;
	--am-cmp-lw: 28.5%;
	--am-cmp-cw: 65px;
	--am-cmp-dur: 0.25s;
}

.am-cmp__inner {
	max-width: none;
	margin: 0 auto;
}

.am-cmp__labelrow {
	display: flex;
	margin-bottom: 20px;
}

.am-cmp__label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #fff;
}

.am-cmp__headrow {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
}

.am-cmp__title {
	margin: 0;
	font-size: 44px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: -0.01em;
	max-width: 760px;
	color: #fff;
}

.am-cmp__accent {
	color: #b4ddff;
}

.am-cmp__para {
	margin: 0;
	max-width: 560px;
	font-size: 14px;
	line-height: 1.65;
	color: rgba(229, 232, 231, 0.7);
}

.am-cmp__head {
	margin-bottom: 72px;
}

/* column labels share the row grid so they line up with the boxes */
.am-cmp__cols,
.am-cmp__row {
	display: grid;
	grid-template-columns: var(--am-cmp-lw) var(--am-cmp-cw) minmax(0, 1fr);
	align-items: center;
}

.am-cmp__cols {
	margin-bottom: 20px;
}

.am-cmp__col {
	font-size: 11px;
	line-height: 1;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.45);
}

.am-cmp__col--left {
	grid-column: 1;
	grid-row: 1;
}

.am-cmp__col--mid {
	grid-column: 3;
	grid-row: 1;
	color: #b4ddff;
}

.am-cmp__col--right {
	grid-column: 3;
	grid-row: 1;
	justify-self: end;
}

.am-cmp__rows {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.am-cmp__row {
	min-height: 104px;
}

/* left (traditional) box */
.am-cmp__left {
	align-self: stretch;
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 24px;
	border: 1px dashed rgba(255, 255, 255, 0.28);
	border-radius: 2px;
	background-color: rgba(255, 255, 255, 0.02);
	color: rgba(255, 255, 255, 0.5);
	font-size: 17px;
	line-height: 1.3;
	transition: background-color var(--am-cmp-dur) ease, color var(--am-cmp-dur) ease, border-color var(--am-cmp-dur) ease;
}

.am-cmp__dash {
	flex-shrink: 0;
	width: 16px;
	height: 1px;
	background-color: rgba(255, 255, 255, 0.4);
	transition: background-color var(--am-cmp-dur) ease;
}

.am-cmp__left-text {
	flex: 1 1 auto;
	min-width: 0;
}

.am-cmp__left:hover {
	background-color: var(--am-cmp-lhb, #fff) !important;
	color: var(--am-cmp-lhc, #020713) !important;
	border-color: var(--am-cmp-lhbd, #fff) !important;
}

.am-cmp__left:hover .am-cmp__dash {
	background-color: var(--am-cmp-lhd, #020713) !important;
}

/* connector: line + arrow head, drawn with borders so it inherits color */
.am-cmp__connector {
	position: relative;
	align-self: stretch;
	color: #0080b8;
	--am-cmp-ct: 1px;
	--am-cmp-ch: 8px;
	--am-cmp-ci: 0px;
}

.am-cmp__connector-line {
	position: absolute;
	left: var(--am-cmp-ci);
	right: var(--am-cmp-ci);
	top: 50%;
	height: var(--am-cmp-ct);
	transform: translateY(-50%);
	background-color: currentColor;
}

.am-cmp__connector-head {
	position: absolute;
	right: calc(var(--am-cmp-ci) + var(--am-cmp-ch) * 0.29);
	top: 50%;
	width: var(--am-cmp-ch);
	height: var(--am-cmp-ch);
	border-top: var(--am-cmp-ct) solid currentColor;
	border-right: var(--am-cmp-ct) solid currentColor;
	transform: translateY(-50%) rotate(45deg);
	transform-origin: center;
}

/* right (Artmark) card */
.am-cmp__card {
	align-self: stretch;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	padding: 24px 32px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-left: 3px solid #0080b8;
	border-radius: 2px;
	background-color: #121e25;
	text-decoration: none;
	color: inherit;
	transition: background-color var(--am-cmp-dur) ease, border-color var(--am-cmp-dur) ease;
}

.am-cmp__card-title {
	flex: 1 1 auto;
	min-width: 0;
	font-size: 24px;
	line-height: 1.25;
	letter-spacing: -0.01em;
	color: #fff;
	transition: color var(--am-cmp-dur) ease;
}

.am-cmp__benefit {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 15px;
	line-height: 1.3;
	color: rgba(229, 232, 231, 0.85);
	transition: color var(--am-cmp-dur) ease;
}

.am-cmp__benefit-arrow {
	flex-shrink: 0;
	display: inline-flex;
	width: 16px;
	height: 16px;
	color: #0080b8;
	transition: color var(--am-cmp-dur) ease;
}

.am-cmp__benefit-arrow svg {
	width: 100%;
	height: 100%;
}

.am-cmp__card:hover {
	background-color: var(--am-cmp-chb, #fff) !important;
	border-color: var(--am-cmp-chbd, #fff) !important;
	border-left-color: var(--am-cmp-cha, #0080b8) !important;
}

.am-cmp__card:hover .am-cmp__card-title {
	color: var(--am-cmp-cht, #020713) !important;
}

.am-cmp__card:hover .am-cmp__benefit {
	color: var(--am-cmp-chn, #3f3b34) !important;
}

.am-cmp__card:hover .am-cmp__benefit-arrow {
	color: var(--am-cmp-chr, #0080b8) !important;
}

/* ---------------------------------------------------------------- */
/* Global Presence ("Where We Operate")                              */
/* ---------------------------------------------------------------- */
.am-gp {
	width: 100%;
	overflow: hidden;
	/* Star field from Globe Standalone (8). */
	background-image:
		radial-gradient(1.49px 1.49px at 41.94% 62.31%, rgba(255,255,255,0.74), transparent),
		radial-gradient(1.80px 1.80px at 95.50% 87.42%, rgba(255,255,255,0.70), transparent),
		radial-gradient(2.07px 2.07px at 45.03% 98.21%, rgba(255,255,255,0.35), transparent),
		radial-gradient(1.25px 1.25px at 70.49% 21.39%, rgba(255,255,255,0.42), transparent),
		radial-gradient(2.16px 2.16px at 67.50% 84.61%, rgba(255,255,255,0.53), transparent),
		radial-gradient(1.96px 1.96px at 86.25% 36.45%, rgba(255,255,255,0.37), transparent),
		radial-gradient(2.10px 2.10px at 56.09% 84.28%, rgba(255,255,255,0.30), transparent),
		radial-gradient(1.61px 1.61px at 90.07% 90.62%, rgba(255,255,255,0.68), transparent),
		radial-gradient(1.77px 1.77px at 85.27% 16.54%, rgba(255,255,255,0.43), transparent),
		radial-gradient(1.08px 1.08px at 85.51% 52.39%, rgba(255,255,255,0.41), transparent),
		radial-gradient(2.07px 2.07px at 57.20% 18.36%, rgba(255,255,255,0.63), transparent),
		radial-gradient(2.24px 2.24px at 69.82% 76.74%, rgba(255,255,255,0.46), transparent),
		radial-gradient(2.26px 2.26px at 5.05% 77.89%, rgba(255,255,255,0.33), transparent),
		radial-gradient(2.28px 2.28px at 98.25% 13.43%, rgba(255,255,255,0.41), transparent),
		radial-gradient(0.95px 0.95px at 12.59% 48.99%, rgba(255,255,255,0.77), transparent),
		radial-gradient(2.18px 2.18px at 92.62% 9.87%, rgba(255,255,255,0.64), transparent),
		radial-gradient(0.98px 0.98px at 15.51% 25.59%, rgba(255,255,255,0.37), transparent),
		radial-gradient(1.72px 1.72px at 73.37% 38.60%, rgba(255,255,255,0.70), transparent),
		radial-gradient(0.95px 0.95px at 62.64% 31.32%, rgba(255,255,255,0.73), transparent),
		radial-gradient(1.01px 1.01px at 46.24% 52.21%, rgba(255,255,255,0.62), transparent),
		radial-gradient(1.98px 1.98px at 39.77% 90.73%, rgba(255,255,255,0.64), transparent),
		radial-gradient(1.50px 1.50px at 65.91% 92.91%, rgba(255,255,255,0.53), transparent),
		radial-gradient(1.10px 1.10px at 94.76% 48.05%, rgba(255,255,255,0.45), transparent),
		radial-gradient(2.28px 2.28px at 61.75% 87.27%, rgba(255,255,255,0.55), transparent),
		radial-gradient(1.23px 1.23px at 24.47% 40.48%, rgba(255,255,255,0.76), transparent),
		radial-gradient(1.91px 1.91px at 4.34% 15.70%, rgba(255,255,255,0.39), transparent),
		radial-gradient(1.95px 1.95px at 61.82% 82.48%, rgba(255,255,255,0.78), transparent),
		radial-gradient(2.13px 2.13px at 27.07% 12.69%, rgba(255,255,255,0.49), transparent),
		radial-gradient(1.03px 1.03px at 16.18% 28.34%, rgba(255,255,255,0.56), transparent),
		radial-gradient(1.45px 1.45px at 70.07% 5.48%, rgba(255,255,255,0.52), transparent),
		radial-gradient(1.65px 1.65px at 23.40% 92.23%, rgba(255,255,255,0.58), transparent),
		radial-gradient(2.09px 2.09px at 96.81% 64.31%, rgba(255,255,255,0.32), transparent),
		radial-gradient(1.29px 1.29px at 99.79% 33.77%, rgba(255,255,255,0.43), transparent),
		radial-gradient(1.59px 1.59px at 1.18% 23.55%, rgba(255,255,255,0.40), transparent),
		radial-gradient(1.15px 1.15px at 19.34% 59.03%, rgba(255,255,255,0.42), transparent),
		radial-gradient(0.85px 0.85px at 98.61% 96.53%, rgba(255,255,255,0.37), transparent),
		radial-gradient(2.18px 2.18px at 55.57% 11.03%, rgba(255,255,255,0.47), transparent),
		radial-gradient(1.99px 1.99px at 36.68% 90.71%, rgba(255,255,255,0.26), transparent),
		radial-gradient(1.87px 1.87px at 97.79% 66.45%, rgba(255,255,255,0.83), transparent),
		radial-gradient(2.17px 2.17px at 79.27% 16.80%, rgba(255,255,255,0.55), transparent),
		radial-gradient(0.86px 0.86px at 21.29% 74.27%, rgba(255,255,255,0.70), transparent),
		radial-gradient(1.74px 1.74px at 9.84% 13.96%, rgba(255,255,255,0.60), transparent),
		radial-gradient(2.21px 2.21px at 97.47% 75.25%, rgba(255,255,255,0.79), transparent),
		radial-gradient(1.82px 1.82px at 66.33% 55.80%, rgba(255,255,255,0.55), transparent),
		radial-gradient(2.07px 2.07px at 47.14% 92.76%, rgba(255,255,255,0.44), transparent),
		radial-gradient(1.98px 1.98px at 70.28% 46.58%, rgba(255,255,255,0.43), transparent),
		radial-gradient(1.35px 1.35px at 77.06% 69.91%, rgba(255,255,255,0.38), transparent),
		radial-gradient(1.04px 1.04px at 94.72% 71.29%, rgba(255,255,255,0.45), transparent),
		radial-gradient(0.81px 0.81px at 76.89% 69.80%, rgba(255,255,255,0.80), transparent),
		radial-gradient(1.08px 1.08px at 42.15% 28.86%, rgba(255,255,255,0.58), transparent),
		radial-gradient(1.66px 1.66px at 58.68% 28.43%, rgba(255,255,255,0.72), transparent),
		radial-gradient(0.89px 0.89px at 58.17% 32.80%, rgba(255,255,255,0.69), transparent),
		radial-gradient(1.96px 1.96px at 12.32% 99.07%, rgba(255,255,255,0.35), transparent),
		radial-gradient(1.07px 1.07px at 32.49% 44.80%, rgba(255,255,255,0.38), transparent),
		radial-gradient(0.95px 0.95px at 74.98% 32.35%, rgba(255,255,255,0.70), transparent),
		radial-gradient(2.30px 2.30px at 62.48% 56.10%, rgba(255,255,255,0.47), transparent),
		radial-gradient(1.90px 1.90px at 3.86% 95.90%, rgba(255,255,255,0.54), transparent),
		radial-gradient(1.09px 1.09px at 10.97% 39.91%, rgba(255,255,255,0.32), transparent),
		radial-gradient(1.06px 1.06px at 54.54% 89.73%, rgba(255,255,255,0.33), transparent),
		radial-gradient(2.00px 2.00px at 84.32% 93.23%, rgba(255,255,255,0.67), transparent),
		radial-gradient(1.46px 1.46px at 86.17% 35.04%, rgba(255,255,255,0.40), transparent),
		radial-gradient(1.83px 1.83px at 63.40% 56.17%, rgba(255,255,255,0.33), transparent),
		radial-gradient(1.30px 1.30px at 67.64% 6.79%, rgba(255,255,255,0.34), transparent),
		radial-gradient(2.28px 2.28px at 36.69% 1.69%, rgba(255,255,255,0.69), transparent),
		radial-gradient(2.17px 2.17px at 85.38% 80.80%, rgba(255,255,255,0.56), transparent),
		radial-gradient(1.56px 1.56px at 58.16% 41.68%, rgba(255,255,255,0.57), transparent),
		radial-gradient(2.39px 2.39px at 33.30% 86.91%, rgba(255,255,255,0.33), transparent),
		radial-gradient(0.99px 0.99px at 98.11% 85.93%, rgba(255,255,255,0.62), transparent),
		radial-gradient(1.48px 1.48px at 40.32% 66.67%, rgba(255,255,255,0.50), transparent),
		radial-gradient(0.98px 0.98px at 86.66% 20.89%, rgba(255,255,255,0.27), transparent),
		radial-gradient(2.39px 2.39px at 24.91% 25.29%, rgba(255,255,255,0.67), transparent),
		radial-gradient(2.07px 2.07px at 53.10% 51.20%, rgba(255,255,255,0.78), transparent),
		radial-gradient(2.18px 2.18px at 7.46% 21.98%, rgba(255,255,255,0.58), transparent),
		radial-gradient(2.37px 2.37px at 62.47% 55.99%, rgba(255,255,255,0.73), transparent),
		radial-gradient(1.88px 1.88px at 82.96% 93.09%, rgba(255,255,255,0.45), transparent),
		radial-gradient(2.04px 2.04px at 36.33% 77.23%, rgba(255,255,255,0.64), transparent),
		radial-gradient(0.91px 0.91px at 30.01% 17.40%, rgba(255,255,255,0.28), transparent),
		radial-gradient(1.61px 1.61px at 10.66% 11.39%, rgba(255,255,255,0.57), transparent),
		radial-gradient(2.08px 2.08px at 5.13% 49.55%, rgba(255,255,255,0.81), transparent),
		radial-gradient(1.55px 1.55px at 20.84% 54.19%, rgba(255,255,255,0.68), transparent),
		radial-gradient(1.83px 1.83px at 0.06% 49.50%, rgba(255,255,255,0.27), transparent),
		radial-gradient(2.09px 2.09px at 80.27% 27.31%, rgba(255,255,255,0.81), transparent),
		radial-gradient(1.67px 1.67px at 50.71% 88.87%, rgba(255,255,255,0.51), transparent),
		radial-gradient(0.93px 0.93px at 66.73% 82.77%, rgba(255,255,255,0.49), transparent),
		radial-gradient(0.94px 0.94px at 59.29% 90.56%, rgba(255,255,255,0.43), transparent),
		radial-gradient(2.21px 2.21px at 54.28% 30.15%, rgba(255,255,255,0.40), transparent),
		radial-gradient(1.38px 1.38px at 76.84% 44.02%, rgba(255,255,255,0.73), transparent),
		radial-gradient(0.93px 0.93px at 1.95% 73.38%, rgba(255,255,255,0.34), transparent),
		radial-gradient(1.28px 1.28px at 13.51% 50.63%, rgba(255,255,255,0.77), transparent),
		radial-gradient(1.60px 1.60px at 49.51% 45.02%, rgba(255,255,255,0.72), transparent),
		radial-gradient(ellipse 55% 40% at 22% 28%, rgba(40,72,104,0.20), transparent 70%),
		radial-gradient(ellipse 48% 36% at 78% 68%, rgba(34,58,88,0.16), transparent 70%);
}

.am-gp__inner {
	max-width: none;
	margin: 0 auto;
}

.am-gp__head {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 48px;
}

.am-gp__eyerow {
	display: flex;
	justify-content: center;
	width: 100%;
	margin-bottom: 24px;
}

.am-gp__title {
	margin: 0 0 24px;
	width: 100%;
	max-width: 820px;
	font-size: 44px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: -0.01em;
	text-align: center;
	color: #fff;
}

.am-gp__accent {
	color: #b4ddff;
}

.am-gp-accent-block-yes .am-gp__accent {
	display: block;
}

.am-gp__para {
	margin: 0;
	width: 100%;
	max-width: 780px;
	font-size: 15px;
	line-height: 1.65;
	text-align: center;
	color: rgba(229, 232, 231, 0.7);
}

.am-gp__strip {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	align-items: center;
	gap: 24px;
	padding: 22px 0;
	border: 0 solid rgba(255, 255, 255, 0.18);
	border-top-width: 1px;
	border-bottom-width: 1px;
}

.am-gp__country {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 15px;
	line-height: 1;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #fff;
	text-decoration: none;
	transition: color 0.2s ease;
}

.am-gp__bullet {
	flex-shrink: 0;
	width: 6px;
	height: 6px;
	border-radius: 1px;
	background-color: #0080b8;
}

/* Globe — the interactive Three.js page in assets/globe/ runs inside an
   iframe (own ids, fonts and WebGL canvas), behind it a soft radial glow.
   Height/glow are overridden per breakpoint by the widget controls. */
.am-gp__globe {
	display: flex;
	justify-content: center;
	margin-top: 96px;
	overflow: hidden;
}

.am-gp__globe-box {
	--am-gp-glow: #0080b8;
	--am-gp-glow-size: 900px;
	--am-gp-glow-a: 0.28;
	--am-gp-globe-o: 1;
	position: relative;
	width: 100%;
	max-width: 100%;
	height: 820px;
	overflow: hidden;
	opacity: var(--am-gp-globe-o);
}

.am-gp__globe-glow {
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 0;
	width: var(--am-gp-glow-size);
	height: var(--am-gp-glow-size);
	max-width: none;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background: radial-gradient(circle, var(--am-gp-glow) 0%, transparent 72%);
	opacity: var(--am-gp-glow-a);
	pointer-events: none;
}

.am-gp__globe-frame {
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	margin: 0;
	padding: 0;
	background: transparent;
}

/* spin-in reveal: artmark-globe.js arms the box, then plays it on scroll-in */
.am-gp__globe-box.is-armed {
	opacity: 0;
}

.am-gp__globe-box.reveal-in {
	animation: am-gp-spin-in 1200ms cubic-bezier(0.16, 1, 0.3, 1) 150ms both;
}

@keyframes am-gp-spin-in {
	from {
		opacity: 0;
		transform: scale(0.88) rotate(-14deg);
	}

	to {
		opacity: var(--am-gp-globe-o, 1);
		transform: scale(1) rotate(0deg);
	}
}

@media (prefers-reduced-motion: reduce) {
	.am-gp__globe-box {
		opacity: var(--am-gp-globe-o, 1) !important;
		animation: none !important;
	}
}

@media (max-width: 1024px) {
	.am-gp__globe-box {
		--am-gp-glow-size: 520px;
		height: 760px;
	}
}

@media (max-width: 767px) {
	.am-gp__globe-box {
		--am-gp-glow-size: 420px;
		height: 700px;
	}
}

.am-gp-bleed-yes .am-gp__globe {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}


/* Comparison Flow — dotted, flowing connector + benefit column + bottom image */
.am-cmp__connector {
	--am-cmp-dot: 2px;
	--am-cmp-dotgap: 4px;
	--am-cmp-flow: 0.8s;
}

.am-cmp-cstyle-dotted .am-cmp__connector-line {
	background-color: transparent;
	background-image: repeating-linear-gradient(90deg, currentColor 0 var(--am-cmp-dot), transparent var(--am-cmp-dot) calc(var(--am-cmp-dot) + var(--am-cmp-dotgap)));
	background-size: calc(var(--am-cmp-dot) + var(--am-cmp-dotgap)) 100%;
	background-repeat: repeat-x;
}

.am-cmp-cstyle-dotted.am-cmp-flow-yes .am-cmp__connector-line {
	animation: am-cmp-flow-x var(--am-cmp-flow) linear infinite;
}

@keyframes am-cmp-flow-x {
	to {
		background-position-x: calc(var(--am-cmp-dot) + var(--am-cmp-dotgap));
	}
}

@keyframes am-cmp-flow-y {
	to {
		background-position-y: calc(var(--am-cmp-dot) + var(--am-cmp-dotgap));
	}
}


.am-cmp__card {
	border-color: #0080b8;
	border-left-color: #0080b8;
}

.am-cmp__benefit {
	flex: 0 0 40%;
	justify-content: flex-start;
	text-align: left;
}

.am-cmp__benefit-text {
	min-width: 0;
}

.am-cmp__bimg {
	display: flex;
	justify-content: center;
	margin-top: 96px;
	overflow: hidden;
}

.am-cmp__bimg img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	object-fit: cover;
	object-position: top center;
}

.am-cmp-bleed-yes .am-cmp__bimg {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}


/* Where We Operate block embedded in Comparison Flow */
.am-gp--embedded {
	padding: 0;
	background: transparent;
	margin-top: 140px;
}

/* Global Presence heading — Figma gradient text (160deg, #fff 37% -> #b4ddff 64%) */
.am-gp__title {
	font-size: 52px;
	line-height: 58px;
	letter-spacing: -0.52px;
	color: transparent;
	background-image: linear-gradient(var(--am-gp-angle, 160deg), var(--am-gp-a, #ffffff) var(--am-gp-s1, 37%), var(--am-gp-b, #b4ddff) var(--am-gp-s2, 64%));
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.am-gp__accent {
	color: inherit;
	-webkit-text-fill-color: inherit;
}


/* Comparison connector: faint base line behind the moving dots */
.am-cmp__connector {
	--am-cmp-base: rgba(255, 255, 255, 0.18);
	--am-cmp-bt: 1px;
}

.am-cmp__connector::before {
	content: "";
	position: absolute;
	left: var(--am-cmp-ci);
	right: var(--am-cmp-ci);
	top: 50%;
	height: var(--am-cmp-bt);
	transform: translateY(-50%);
	background-color: var(--am-cmp-base);
	pointer-events: none;
}

.am-cmp__connector-line,
.am-cmp__connector-head {
	z-index: 1;
}


/* "+ LABEL" eyebrows: uploaded icon marker */
.am-plabel-icon {
	display: inline-flex;
	align-items: center;
	line-height: 1;
}

.am-plabel-icon img {
	display: block;
	width: 15px;
	height: 15px;
	object-fit: contain;
}

.am-vfeature__label,
.am-sol__label,
.am-commit__label,
.am-conv__label,
.am-cmp__label {
	display: inline-flex;
	align-items: center;
	border: 0 solid transparent;
}

/* ---------------------------------------------------------------- */
/* Feature Cards ("Supplier Development in Action")                  */
/* ---------------------------------------------------------------- */
.am-fcards {
	width: 100%;
}

.am-fcards__inner {
	max-width: none;
	margin: 0 auto;
}

.am-fcards__head {
	margin-bottom: 56px;
}

.am-fcards__eyerow {
	display: flex;
	width: 100%;
}

.am-fcards__headrow {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
}

.am-fcards__title {
	margin: 0;
	max-width: 720px;
	font-size: 44px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #020713;
}

.am-fcards__title .am-h2__muted {
	color: #697284;
}

.am-fcards-muted-block-yes .am-fcards__title .am-h2__muted {
	display: block;
}

.am-fcards__side {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
	max-width: 520px;
}

.am-fcards__para {
	margin: 0;
	font-size: 15px;
	line-height: 1.65;
	color: #3f3b34;
}

.am-fcards__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

/* Eyebrow marker: uploaded icon image in place of the square dot. */
.am-eyebrow__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 16px;
	height: 16px;
}

.am-eyebrow__icon img,
.am-eyebrow__icon svg {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

/* A card with no description drops its title to the bottom, so a row of
   mixed cards still lines up along one baseline. */
.am-fcards-btitle-yes .am-fcard--nodesc .am-fcard__title {
	margin-top: auto;
}

.am-fcard {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	min-height: 265px;
	padding: 30px 32px 32px;
	background-color: #fcf7ee;
	border: 0 solid transparent;
	text-decoration: none;
	color: inherit;
	transition: background-color 0.25s ease, transform 0.25s ease;
}

.am-fcard__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	margin-bottom: 56px;
	background-color: #0e1a1e;
	transition: background-color 0.25s ease;
}

.am-fcard__icon img {
	display: block;
	width: 30px;
	height: 30px;
	object-fit: contain;
}

.am-fcards-invert-yes .am-fcard__icon img {
	filter: invert(1);
}

.am-fcard__title {
	display: block;
	margin-bottom: 12px;
	font-size: 26px;
	line-height: 1.25;
	letter-spacing: -0.01em;
	color: #020713;
}

.am-fcard__desc {
	display: block;
	font-size: 15px;
	line-height: 1.6;
	color: #697284;
}


/* Reason Cards — per-card corner label */
.am-reason__tag {
	position: absolute;
	top: var(--am-rt-y, 24px);
	left: var(--am-rt-x, 24px);
	z-index: 3;
	display: inline-flex;
	align-items: center;
	padding: 8px 12px;
	background-color: #fff;
	border: 0 solid transparent;
	color: #020713;
	font-size: 11px;
	line-height: 1;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
	transition: opacity 0.25s ease;
}

.am-reasons-taghide-yes .am-reason:hover .am-reason__tag {
	opacity: 0;
}

/* ---------------------------------------------------------------- */
/* Split Feature — optional checklist chips                          */
/* ---------------------------------------------------------------- */

.am-split__chips {
	--am-chip-cols: 2;
	display: grid;
	grid-template-columns: repeat(var(--am-chip-cols), auto);
	justify-items: start;
	column-gap: 12px;
	row-gap: 12px;
	margin-top: 32px;
}

/* Chips are emitted in row groups. In the grid they must not exist as boxes,
   so the grid lays the chips out directly. */
.am-split__chiprow {
	display: contents;
}

/* Wrap layout (Chips Layout -> Wrap): every chip is as wide as its text and
   the rows flow, as in the Figma. A chip flagged "Start a New Row" opens a
   new group, so the breaks land exactly where the design has them; inside a
   group the chips still wrap if the column gets too narrow. Both gaps are
   inherited from the container, where the gap controls write them. */
.am-split-chips-wrap .am-split__chips {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 100%;
}

.am-split-chips-wrap .am-split__chiprow {
	display: flex;
	flex-wrap: wrap;
	column-gap: inherit;
	row-gap: inherit;
	max-width: 100%;
}

.am-split-chips-wrap .am-split__chip {
	width: auto;
	max-width: 100%;
}

.am-split__chip {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	padding: 14px 20px 14px 18px;
	background-color: #ffffff;
	border: 0 solid transparent;
	text-decoration: none;
	color: inherit;
	transition: background-color 0.2s ease;
}

.am-split__chip-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	background-color: #0e1a1e;
	color: #ffffff;
}

.am-split__chip-ico svg,
.am-split__chip-ico img {
	display: block;
	width: 14px;
	height: 14px;
	object-fit: contain;
}

.am-split__chip-text {
	font-size: 16px;
	line-height: 22px;
	color: #111827;
}

/* ----------------------------------------------------------------
   Responsive blocks.

   These live at the end of the file on purpose. A media query adds no
   specificity, so a rule inside one only wins if it comes AFTER the base
   rule it overrides. Several of these blocks used to sit mid-file, ahead
   of the widgets they targeted, and were being silently undone.
   ---------------------------------------------------------------- */

@media (hover: none) {
	.am-cap-card__hoverbtn {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.am-scarousel img {
		transition: opacity 0.3s ease;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.am-show__media img {
		transition: opacity 0.3s ease;
		transform: none;
	}

	.am-show__desc {
		transition: none;
	}
}

@media (max-width: 1024px) {
	.am-phero__inner {
		flex-direction: column;
		align-items: stretch;
	}

	.am-phero__title {
		width: 100% !important;
		font-size: 44px;
	}

	.am-caps__head,
	.am-inds__head,
	.am-vfeature__bottom,
	.am-vfeature__top,
	.am-sol__headrow,
	.am-res__head {
		flex-direction: column;
		align-items: flex-start;
	}

	/* Stacked heads: text blocks span the full width so the alignment
	   controls center/right-align against the page, not a shrunk box.
	   (Buttons stay natural width — they are not in this list.) */
	.am-caps__head-left,
	.am-inds__head .am-inds__title,
	.am-sol__headleft,
	.am-sol__para,
	.am-res__headleft,
	.am-ilist__headleft,
	.am-ilist__para,
	.am-pcards__headleft,
	.am-pcards__para,
	.am-vfeature__head,
	.am-vfeature__para {
		width: 100%;
	}

	.am-sol__title,
	.am-res__title {
		font-size: 32px;
	}

	.am-vfeature__top {
		gap: 32px;
	}

	.am-vfeature__media {
		flex-basis: auto !important;
		max-width: 100% !important;
		width: 100%;
	}

	.am-h2,
	.am-inds__title,
	.am-vfeature__title {
		font-size: 38px;
	}

	.am-risk__cols {
		grid-template-columns: repeat(2, 1fr) !important;
	}

	.am-statement__inner {
		flex-direction: column;
	}

	.am-show__inner,
	.am-show--right .am-show__inner {
		flex-direction: column;
	}

	/* Order On Small Screens: heading and items first, then the image */
	.am-show-mob-text .am-show__media {
		order: 2;
		margin-top: 36px;
	}

	.am-show-mob-text .am-show__content {
		order: 1;
	}

	/* Order On Small Screens: the open item's own image inside it, under the text */
	.am-show-mob-inside .am-show__media {
		display: none;
	}

	.am-show-mob-inside .am-show__item-img {
		display: block;
		width: 100%;
		aspect-ratio: 16 / 10;
		object-fit: cover;
		margin: 0 0 22px;
		clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
	}

	.am-ilist__headrow {
		flex-direction: column;
		align-items: flex-start;
	}

	.am-ilist__para,
	.am-sol__para {
		max-width: 100% !important;
	}

	.am-pcards__headrow {
		flex-direction: column;
		align-items: flex-start;
	}

	.am-pcards__para {
		max-width: 100% !important;
	}

	.am-pcards__title {
		font-size: 32px;
	}

	.am-banner__panel {
		flex-direction: column;
		align-items: flex-start;
	}

	.am-banner--center .am-banner__panel {
		align-items: center;
	}

	.am-commit__inner {
		flex-direction: column;
		align-items: stretch;
	}

	.am-commit__head {
		flex-basis: auto !important;
		max-width: 100% !important;
	}

	.am-commit__title {
		font-size: 32px;
	}

	.am-disc__top,
	.am-disc__bottom {
		flex-direction: column;
		align-items: flex-start;
	}

	.am-disc__head {
		flex-basis: auto !important;
		max-width: 100% !important;
	}

	.am-disc__media {
		width: 100%;
		max-width: 100%;
		justify-content: flex-start;
		flex-wrap: wrap;
	}

	/* The per-box width control keeps its desktop percentage otherwise, so two
	   55% boxes wrap one per row and sit against whatever edge is left — with
	   the media column pushed past the screen. Stacked, the boxes share the
	   row instead. */
	.am-disc__box {
		flex: 1 1 0 !important;
		max-width: 100% !important;
		min-width: 0;
	}

	.am-disc__title {
		font-size: 30px;
	}

	.am-disc__para {
		max-width: 100% !important;
	}

	.am-statf__inner {
		flex-direction: column;
		align-items: stretch;
	}

	.am-statf__left {
		flex-basis: auto !important;
		max-width: 100% !important;
	}

	.am-statf__title {
		font-size: 30px;
	}

	.am-statf__media img {
		height: auto;
		max-height: 480px;
	}

	.am-herit__inner {
		flex-direction: column;
		align-items: stretch;
	}

	.am-herit__left {
		flex-basis: auto !important;
		max-width: 100% !important;
	}

	.am-herit__title {
		font-size: 30px;
	}

	.am-herit__para {
		max-width: 100% !important;
	}

	.am-herit__media img {
		height: auto;
		max-height: 480px;
	}

	.am-open__head {
		flex-direction: column;
		align-items: flex-start;
	}

	.am-open__headleft {
		width: 100%;
	}

	.am-open__para {
		max-width: 100% !important;
	}

	.am-open__title {
		font-size: 30px;
	}

	.am-open__cols {
		display: none;
	}

	.am-open__row {
		grid-template-columns: 1fr auto;
		grid-template-areas:
			"role action"
			"meta1 action"
			"meta2 action";
		gap: 4px 16px;
	}

	.am-open__role {
		grid-area: role;
	}

	.am-open__row .am-open__meta:nth-of-type(2) {
		grid-area: meta1;
	}

	.am-open__row .am-open__meta:nth-of-type(3) {
		grid-area: meta2;
	}

	.am-open__action {
		grid-area: action;
	}

	.am-reasons__headrow {
		flex-direction: column;
		align-items: flex-start;
	}

	.am-reasons__headleft {
		width: 100%;
	}

	.am-reasons__para {
		max-width: 100% !important;
	}

	.am-conv__headrow {
		flex-direction: column;
		align-items: flex-start;
	}

	.am-conv__para {
		max-width: 100% !important;
	}

	.am-conv__title {
		font-size: 32px;
	}

	.am-conv__diagram {
		flex-direction: column;
		gap: 24px;
	}

	.am-conv__list,
	.am-conv__outcome {
		flex-basis: auto !important;
		max-width: 100% !important;
	}

	.am-conv__lines {
		display: none;
	}

	.am-show__media {
		flex-basis: auto !important;
		max-width: 100% !important;
		width: 100%;
	}

	.am-show__title {
		font-size: 34px;
	}

	.am-show__list {
		margin-top: 40px;
	}

	.am-statement__title {
		font-size: 32px;
		margin-bottom: 32px;
	}

	.am-statement__media {
		flex-basis: auto !important;
		max-width: 100% !important;
	}

	.am-statement__media img {
		height: auto;
		max-height: 420px;
	}

	.am-quote__text {
		font-size: 18px;
	}

	.am-quote__box {
		gap: 24px;
		padding: 24px;
	}

	.am-risk__panel {
		padding: 32px;
	}

	.am-risk__panel-inner {
		flex-direction: column;
		align-items: flex-start;
		gap: 24px;
	}
}

@media (max-width: 640px) {
	.am-phero__title {
		font-size: 34px;
	}

	.am-h2,
	.am-inds__title,
	.am-vfeature__title {
		font-size: 30px;
	}

	/* Ruler turns vertical and sits beside the stacked steps */
	.am-risk__track {
		display: flex;
		align-items: stretch;
		gap: 20px;
	}

	.am-risk__ruler {
		width: 26px;
		height: auto;
		flex-shrink: 0;
		margin-bottom: 0;
		background-image:
			repeating-linear-gradient(to bottom, currentColor 0, currentColor 1px, transparent 1px, transparent 120px),
			repeating-linear-gradient(to bottom, currentColor 0, currentColor 1px, transparent 1px, transparent 24px);
		background-image:
			repeating-linear-gradient(to bottom, currentColor 0, currentColor 1px, transparent 1px, transparent 120px),
			repeating-linear-gradient(to bottom, color-mix(in srgb, currentColor 45%, transparent) 0, color-mix(in srgb, currentColor 45%, transparent) 1px, transparent 1px, transparent 24px);
		background-size: 100% 100%, 42% 100%;
		background-position: left top, center top;
		background-repeat: no-repeat;
	}

	.am-risk__cols {
		grid-template-columns: 1fr !important;
		flex: 1 1 auto;
		min-width: 0;
	}

	.am-pillars__panel {
		flex-direction: column;
		align-items: flex-start;
		gap: 24px;
	}

	.am-pillars__panel-text {
		flex-basis: auto !important;
		max-width: 100% !important;
	}

	/* Video Feature: the two media boxes stack instead of squeezing side by side */
	.am-vfeature__media {
		flex-direction: column;
		align-items: stretch;
	}

	/* Quote: box drops below the media instead of overlapping it.
	   height/min-height must win over the desktop Stage Height control here —
	   the stacked layout is content-driven. */
	.am-quote__stage {
		height: auto !important;
		min-height: 0 !important;
	}

	.am-quote__box {
		position: static;
		max-width: 100%;
		margin-top: var(--am-q-mm, 260px);
		margin-left: auto;
	}
}

@media (hover: none) {
	.am-team-card__descwrap {
		grid-template-rows: 1fr;
	}

	.am-team-card__overlay {
		opacity: 1;
	}
}

@media (hover: none) {
	.am-team-card__li {
		opacity: 1;
		transform: none;
	}
}

@media (max-width: 1024px) {
	.am-team__head--split {
		flex-direction: column;
		gap: 20px;
	}
}

@media (hover: none) {
	.am-reason__arrow {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.am-conv__flow {
		animation: none !important;
	}
}

@media (max-width: 1024px) {
	.am-split__inner {
		flex-direction: column !important;
	}

	.am-split-morder-image-first .am-split__inner {
		flex-direction: column-reverse !important;
	}

	.am-split__media {
		flex-basis: auto !important;
		max-width: 100% !important;
		width: 100%;
	}

	.am-split__title,
	.am-split__para {
		width: 100%;
	}

	.am-cmp__headrow {
		flex-direction: column;
	}

	.am-cmp__cols {
		display: none;
	}

	.am-cmp__row {
		grid-template-columns: 1fr;
	}

	.am-cmp__connector {
		height: 40px;
		width: 100%;
	}

	.am-cmp__connector-line {
		left: 50%;
		right: auto;
		top: var(--am-cmp-ci);
		bottom: var(--am-cmp-ci);
		height: auto;
		width: var(--am-cmp-ct);
		transform: translateX(-50%);
	}

	.am-cmp__connector-head {
		right: auto;
		left: 50%;
		top: auto;
		bottom: calc(var(--am-cmp-ci) + var(--am-cmp-ch) * 0.29);
		transform: translateX(-50%) rotate(135deg);
	}

	.am-cmp__card {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}

	.am-cmp__benefit {
		flex-basis: auto !important;
	}
}

/* A jobs row is a stacked card on a phone: the Apply button gets its own line
   rather than squeezing the role text into a narrow column beside it. */
@media (max-width: 767px) {
	.am-open__row {
		grid-template-columns: 1fr;
		grid-template-areas:
			"role"
			"meta1"
			"meta2"
			"action";
		gap: 6px;
		padding-bottom: 18px;
	}

	.am-open__action {
		justify-content: flex-start;
		margin-top: 6px;
	}
}

@media (max-width: 640px) {
	.am-split__title {
		font-size: 36px;
	}

	.am-cmp__title,
	.am-gp__title {
		font-size: 32px;
	}

	.am-cmp__card-title {
		font-size: 20px;
	}

	.am-cmp__left {
		font-size: 15px;
	}

	.am-gp__strip {
		justify-content: flex-start !important;
		gap: 16px 24px;
	}

	.am-gp__country {
		font-size: 13px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.am-cmp__connector-line {
		animation: none !important;
	}
}

@media (max-width: 1024px) {
	.am-cmp-cstyle-dotted .am-cmp__connector-line {
		background-image: repeating-linear-gradient(180deg, currentColor 0 var(--am-cmp-dot), transparent var(--am-cmp-dot) calc(var(--am-cmp-dot) + var(--am-cmp-dotgap)));
		background-size: 100% calc(var(--am-cmp-dot) + var(--am-cmp-dotgap));
		background-repeat: repeat-y;
	}

	.am-cmp-cstyle-dotted.am-cmp-flow-yes .am-cmp__connector-line {
		animation-name: am-cmp-flow-y;
	}
}

@media (max-width: 640px) {
	.am-gp__title {
		font-size: 34px;
		line-height: 1.15;
		letter-spacing: -0.3px;
	}
}

@media (max-width: 1024px) {
	.am-cmp__connector::before {
		left: 50%;
		right: auto;
		top: var(--am-cmp-ci);
		bottom: var(--am-cmp-ci);
		height: auto;
		width: var(--am-cmp-bt);
		transform: translateX(-50%);
	}
}

@media (max-width: 1024px) {
	.am-fcards__headrow {
		flex-direction: column;
	}

	.am-fcards__title,
	.am-fcards__para {
		width: 100%;
	}
}

@media (max-width: 640px) {
	.am-fcards__title {
		font-size: 32px;
	}

	.am-fcard__title {
		font-size: 22px;
	}
}

@media (max-width: 767px) {
	.am-split__chips {
		--am-chip-cols: 1;
	}

	/* Discipline on a phone: the media boxes get a row each rather than
	   sharing one, the chips may break instead of forcing the row wide, and
	   the bottom row's button drops under the paragraph. */
	.am-disc__box {
		flex: 1 1 100% !important;
	}

	.am-disc__chip {
		white-space: normal;
	}

	.am-disc__title {
		font-size: 26px;
	}

	.am-disc__bottom {
		align-items: stretch;
	}

	.am-disc__bottom .am-btn {
		align-self: flex-start;
	}
}

/* ---------------------------------------------------------------- */
/* Feature Cards: corner badge, hover arrow chip, icon hover tint     */
/* ---------------------------------------------------------------- */

/* The corner sits at the card's top padding, on the right (on the left
   when the card content is right-aligned). The padding control feeds the
   --am-fc-p* variables, the alignment control flips --am-fc-c* / -a*. */
.am-fcard {
	position: relative;
}

a.am-fcard:hover,
a.am-fcard:focus,
a.am-fcard:active,
a.am-fcard:visited {
	color: inherit;
	text-decoration: none;
}

a.am-fcard:focus-visible {
	outline: 2px solid #0081e4;
	outline-offset: 2px;
}

.am-fcard__corner {
	position: absolute;
	z-index: 2;
	top: var(--am-fc-pt, 30px);
	right: var(--am-fc-cr, var(--am-fc-pr, 32px));
	left: var(--am-fc-cl, auto);
	display: flex;
	align-items: flex-start;
	pointer-events: none;
}

.am-fcard__badge {
	display: inline-flex;
	align-items: center;
	padding: 6px 10px;
	background-color: #b4ddff;
	color: #0e1a1e;
	font-size: 10px;
	font-weight: 600;
	line-height: 12px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	white-space: nowrap;
	transition: opacity 0.2s ease;
}

/* The arrow chip: hidden until hover, bottom-right corner cut. */
.am-fcard__arrow {
	position: absolute;
	top: 0;
	right: var(--am-fc-ar, 0);
	left: var(--am-fc-al, auto);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background-color: #b4ddff;
	color: #020713;
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--am-fc-notch, 12px)), calc(100% - var(--am-fc-notch, 12px)) 100%, 0 100%);
	opacity: 0;
	transform: translate(-6px, 6px);
	transition: opacity 0.25s ease, transform 0.25s ease;
}

.am-fcard__arrow svg,
.am-fcard__arrow img {
	display: block;
	width: 18px;
	height: 18px;
	object-fit: contain;
}

/* Icon hover tint: a multiply layer over the icon box. White becomes the
   tint, the dark box stays dark, so it also works on icons exported with
   their dark box baked in. */
.am-fcard__icon {
	position: relative;
	isolation: isolate;
	overflow: hidden;
}

.am-fcard__icon::after {
	content: "";
	position: absolute;
	inset: 0;
	background-color: var(--am-fc-tint, transparent);
	mix-blend-mode: multiply;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.25s ease;
}

/* Hover (and keyboard focus) on the cards the "Hover Effect On" control picks */
.am-fcards-hov-linked .am-fcard--link:hover .am-fcard__arrow,
.am-fcards-hov-linked .am-fcard--link:focus-visible .am-fcard__arrow,
.am-fcards-hov-all .am-fcard:hover .am-fcard__arrow,
.am-fcards-hov-all .am-fcard:focus-visible .am-fcard__arrow {
	opacity: 1;
	transform: none;
}

.am-fcards-hov-linked .am-fcard--link:hover .am-fcard__icon::after,
.am-fcards-hov-linked .am-fcard--link:focus-visible .am-fcard__icon::after,
.am-fcards-hov-all .am-fcard:hover .am-fcard__icon::after,
.am-fcards-hov-all .am-fcard:focus-visible .am-fcard__icon::after {
	opacity: 1;
}

/* A badge gives its place to the arrow while the card is hovered. */
.am-fcards-hov-linked .am-fcard--link:hover .am-fcard__corner.has-badge .am-fcard__badge,
.am-fcards-hov-linked .am-fcard--link:focus-visible .am-fcard__corner.has-badge .am-fcard__badge,
.am-fcards-hov-all .am-fcard:hover .am-fcard__corner.has-badge .am-fcard__badge,
.am-fcards-hov-all .am-fcard:focus-visible .am-fcard__corner.has-badge .am-fcard__badge {
	opacity: 0;
}

/* "Show Arrow Without Hover": visible at rest on cards without a badge. */
.am-fcards-arrow-always-yes.am-fcards-hov-linked .am-fcard--link .am-fcard__corner:not(.has-badge) .am-fcard__arrow,
.am-fcards-arrow-always-yes.am-fcards-hov-all .am-fcard .am-fcard__corner:not(.has-badge) .am-fcard__arrow {
	opacity: 1;
	transform: none;
}

/* Touch screens have no hover: show the arrow on cards without a badge. */
@media (hover: none) {
	.am-fcards-hov-linked .am-fcard--link .am-fcard__corner:not(.has-badge) .am-fcard__arrow,
	.am-fcards-hov-all .am-fcard .am-fcard__corner:not(.has-badge) .am-fcard__arrow {
		opacity: 1;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.am-fcard__arrow {
		transform: none;
		transition: opacity 0.01s linear;
	}
}