/*
 * About - Awards tiers.
 *
 * Read from the demo's css/about-us.css (.abaw3) — the copy in the live
 * demo, which still carries this option.
 *
 * What the Style tab sets arrives through the widget's selectors; a size
 * left empty there scales with the window the way the design's does,
 * through the two numbers below (app.css:127-128, 2889-2900).
 */

.custom-about-awards-tiers {
	--custom-vwu: 14.4px;
	--custom-vhu: clamp(5.2px, 1svh, 9px);
	--custom-pad: 90px;
	position: relative;
	display: block;
	box-sizing: border-box;
	overflow: hidden;
	/* app.css:385-389 .sec--rhythm, .container --pad */
	padding: min(clamp(52px, calc(8.6 * var(--custom-vwu)), 160px), calc(13.7 * var(--custom-vhu))) var(--custom-pad);
	background: linear-gradient(180deg, var(--custom-abaw-a, #EAF6FD) 0%, var(--custom-abaw-b, #F7FBFE) 42%, var(--custom-abaw-c, #FFFFFF) 100%);
}

@media (max-width: 1280px) { .custom-about-awards-tiers { --custom-vwu: 12.2px; --custom-vhu: clamp(5.2px, 1svh, 8.5px); } }
@media (max-width: 1200px) { .custom-about-awards-tiers { --custom-vwu: 11.2px; --custom-vhu: clamp(5.2px, 1svh, 8.35px); } }
@media (max-width: 1024px) { .custom-about-awards-tiers { --custom-vwu: 9.2px; --custom-vhu: clamp(5.2px, 1svh, 8px); --custom-pad: 40px; } }
@media (max-width: 860px)  { .custom-about-awards-tiers { --custom-vwu: 7.7px; --custom-vhu: clamp(5.2px, 1svh, 7.8px); } }
@media (max-width: 640px)  { .custom-about-awards-tiers { --custom-vwu: 4.2px; --custom-vhu: clamp(5.2px, 1svh, 7.6px); --custom-pad: 24px; } }
@media (max-width: 380px)  { .custom-about-awards-tiers { --custom-vwu: 3.6px; --custom-vhu: clamp(5.2px, 1svh, 7.2px); } }

.custom-about-awards-tiers__inner {
	box-sizing: border-box;
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
}

.custom-about-awards-tiers__head {
	/* app.css:167-176 body — the line the small label sits in is the design's,
	   whatever the theme sets */
	font-size: 16px;
	line-height: 1.6;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.custom-about-awards-tiers__title {
	margin: 0;
	padding: 0;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0;
}

.custom-about-awards-tiers__title strong {
	font-weight: 700;
}

/* app.css:246-252 — the highlighted part, with the soft bar under it */
.custom-about-awards-tiers__title em {
	position: relative;
	display: inline-block;
	font-style: italic;
	font-weight: 700;
}

.custom-about-awards-tiers__title em::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0.06em;
	height: 0.16em;
	border-radius: 3px;
	background: currentColor;
	opacity: 0.18;
}

.custom-about-awards-tiers [data-custom-sweep-ghost] em::after {
	opacity: 0.12;                         /* app.css:275 */
}

/* app.css:291-294 — a measure of its own, its words centred inside it */
.custom-about-awards-tiers__intro {
	margin-bottom: 0;
	font-weight: 400;
	line-height: 1.7;
}

/* app.css:3016 — a phone's lead sets tighter */
@media (max-width: 640px) {
	.custom-about-awards-tiers__intro {
		line-height: 1.5;
	}
}


/* app.css:920 .br-lg */
@media (max-width: 1024px) {
	.custom-about-awards-tiers__intro br { display: none; }
}

/* app.css:202-209, 407 — the small red label over the heading */
.custom-about-awards-tiers__eyebrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin: 0 0 min(22px, calc(2.4 * var(--custom-vhu)));
	font-size: 12px;
	font-weight: 600;
	line-height: 1.6;
	letter-spacing: 1.15px;
	text-transform: uppercase;
	color: #CE2929;
}

/* about-us.css .abaw3 / .abaw4 .abaw__cta, app.css:304-315 .btn--navy */
.custom-about-awards-tiers__cta {
	display: flex;
	justify-content: center;
	margin-top: clamp(24px, calc(2.6 * var(--custom-vwu)), 40px);
}

.custom-about-awards-tiers__button {
	box-sizing: border-box;
	--custom-press-ground: #16418C;
	--custom-press-ink: #FFFFFF;
	--custom-press-edge: transparent;
	display: inline-flex;
	align-items: center;
	gap: 11px;
	padding: 15px 30px;
	border-width: 1.5px;
	border-style: solid;
	border-radius: 16px;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.6;
	letter-spacing: normal;
	white-space: nowrap;
	cursor: pointer;
	transition: all 250ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.custom-about-awards-tiers__button:hover {
	--custom-press-ground: #50A3D5;
	--custom-press-shadow: 0 14px 30px rgba(80, 163, 213, 0.30);
	transform: translateY(-2px);
}

.custom-about-awards-tiers__button:focus-visible {
	outline: 2px solid #50A3D5;
	outline-offset: 3px;
}

.custom-about-awards-tiers p,
.custom-about-awards-tiers h2,
.custom-about-awards-tiers h3,
.custom-about-awards-tiers span {
	text-wrap: wrap;
	text-rendering: optimizeLegibility;
}


/* ------------------------------------------------------------------ */
/* The panels — about-us.css .abaw3                                    */
/* ------------------------------------------------------------------ */

.custom-about-awards-tiers__tiers {
	display: grid;
	gap: clamp(20px, calc(2.4 * var(--custom-vwu)), 36px);
	max-width: 1200px;
	margin: 0 auto;
	text-align: left;
}

.custom-about-awards-tiers__tier {
	--custom-lv-bg: rgba(80, 163, 213, 0.26);
	--custom-lv-fg: #CDEAFA;
	--custom-curl: clamp(30px, calc(3.2 * var(--custom-vwu)), 50px);   /* app.css:158 --curl-sm */
	display: grid;
	grid-template-columns: clamp(180px, calc(16 * var(--custom-vwu)), 250px) minmax(0, 1fr);
	overflow: hidden;
	border-radius: var(--custom-curl) 6px var(--custom-curl) 6px;
	background: var(--custom-abaw3-panel, #F5FAFE);
	box-shadow: 0 3px 8px rgba(14, 30, 84, 0.08), 0 18px 34px -18px rgba(14, 30, 84, 0.34);
}

.custom-about-awards-tiers__tier--nat {
	--custom-lv-bg: rgba(206, 41, 41, 0.34);
	--custom-lv-fg: #FFD9D9;
}

.custom-about-awards-tiers__label {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	padding: 24px 20px;
	text-align: center;
	color: #FFFFFF;
	background: linear-gradient(158deg, var(--custom-abaw3-a, #16418C) 0%, var(--custom-abaw3-b, #0E1E54) 100%);
}

.custom-about-awards-tiers__n {
	font-size: clamp(56px, calc(6 * var(--custom-vwu)), 84px);
	font-weight: 700;
	line-height: 1.25;
}

.custom-about-awards-tiers__u {
	font-size: 16px;
	font-weight: 500;
	line-height: 1.5;
	opacity: 0.9;
}

.custom-about-awards-tiers__lv {
	margin-top: 10px;
	padding: 4px 14px;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.5;
	color: var(--custom-lv-fg);
	background: var(--custom-lv-bg);
}

.custom-about-awards-tiers__list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(12px, calc(1.4 * var(--custom-vwu)), 20px);
	margin: 0;
	padding: clamp(16px, calc(2 * var(--custom-vwu)), 28px);
	list-style: none;
}

.custom-about-awards-tiers__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	box-sizing: border-box;
	margin: 0;
	padding: clamp(16px, calc(1.6 * var(--custom-vwu)), 24px) clamp(12px, calc(1.2 * var(--custom-vwu)), 18px);
	border-radius: 14px 4px 14px 4px;   /* app.css:141 --r */
	text-align: center;
	background: var(--custom-abaw3-card, #FFFFFF);
	box-shadow: 0 2px 6px rgba(22, 65, 140, 0.06), 0 12px 24px -14px rgba(22, 65, 140, 0.28);
}

.custom-about-awards-tiers__logo {
	--custom-logo-h: clamp(84px, calc(8.4 * var(--custom-vwu)), 120px);
	display: grid;
	place-items: center;
	width: 100%;
	height: var(--custom-logo-h);
}

.custom-about-awards-tiers__logo img {
	display: block;
	width: auto;
	height: auto;
	max-width: 86%;
	max-height: var(--custom-logo-h);
	margin: 0;
	object-fit: contain;
}

.custom-about-awards-tiers__name {
	margin: 0;
	padding: 0;
	font-size: clamp(16px, calc(1.25 * var(--custom-vwu)), 18px);
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: normal;
	color: var(--custom-abaw3-title, #16418C);
}

@media (max-width: 1024px) {
	.custom-about-awards-tiers__tier { grid-template-columns: minmax(0, 1fr); }
	.custom-about-awards-tiers__label { flex-direction: row; flex-wrap: wrap; gap: 4px 12px; padding: 14px 20px; }
	.custom-about-awards-tiers__n { font-size: 40px; }
	.custom-about-awards-tiers__lv { margin-top: 0; margin-left: 6px; }
}

@media (max-width: 860px) {
	.custom-about-awards-tiers__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.custom-about-awards-tiers__card:last-child:nth-child(odd) {
		grid-column: 1 / -1;
		justify-self: center;
		width: calc((100% - clamp(12px, calc(1.4 * var(--custom-vwu)), 20px)) / 2);
	}
}

@media (max-width: 560px) {
	.custom-about-awards-tiers__list { grid-template-columns: minmax(0, 1fr); }
	.custom-about-awards-tiers__card:last-child:nth-child(odd) { grid-column: auto; width: auto; justify-self: stretch; }
}

@media (prefers-reduced-motion: reduce) {
	.custom-about-awards-tiers__button { transition: none; }
	.custom-about-awards-tiers__button:hover { transform: none; }
}


/* ------------------------------------------------------------------ */
/* 1.0.7 — the heading scales like the design until a size is typed    */
/* (app.css:237 .h-sec, 291 .lead, 3015-3016; about-us.css head gaps)  */
/* ------------------------------------------------------------------ */
.custom-about-awards-tiers__head {
	margin-bottom: clamp(28px, calc(3.4 * var(--custom-vwu)), 52px);
}

.custom-about-awards-tiers__title {
	font-size: min(clamp(28px, calc(3.9 * var(--custom-vwu)), 56px), calc(6.2 * var(--custom-vhu)));
}

.custom-about-awards-tiers__intro {
	font-size: clamp(16px, calc(1.25 * var(--custom-vwu)), 18px);
	line-height: 1.7;
	margin-top: min(22px, calc(2.4 * var(--custom-vhu)));
}

@media (max-width: 640px) {
	.custom-about-awards-tiers__title {
		font-size: clamp(22px, calc(6.2 * var(--custom-vwu)), 56px);
	}

	.custom-about-awards-tiers__intro {
		font-size: 14px;
		line-height: 1.5;
		margin-top: 14px;
	}
}

/* app.css:3018 — on a phone the small label sits closer to the heading */
@media (max-width: 640px) {
	.custom-about-awards-tiers__eyebrow {
		margin-bottom: 14px;
	}
}