/*
 * Benefit - People.
 *
 * Read from cp-all-designer benefit.html:232-263, css/benefit.css:322-633.
 *
 * Colour, type, padding, the corners and the spaces between the parts arrive
 * from the Style tab and are not repeated here.
 */

/* benefit.css:617-624 — white falling to the zone's pale blue, a blue glow off
   the top corner and a green one off the foot corner */
.custom-benefit-people {
	--custom-benefit-people-top: #FFFFFF;
	--custom-benefit-people-foot: #F3F8FD;
	--custom-benefit-people-glow-top: rgba(80, 163, 213, 0.16);
	--custom-benefit-people-glow-foot: rgba(92, 161, 63, 0.12);
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(38% 46% at 6% 10%, var(--custom-benefit-people-glow-top) 0%, transparent 100%),
		radial-gradient(34% 40% at 96% 92%, var(--custom-benefit-people-glow-foot) 0%, transparent 100%),
		linear-gradient(180deg, var(--custom-benefit-people-top) 0%, var(--custom-benefit-people-top) 40%, var(--custom-benefit-people-foot) 100%);
}

.custom-benefit-people .custom-benefit-people__inner {
	position: relative;
	z-index: 1;
}

.custom-benefit-people .nb {
	white-space: nowrap;
}

/* benefit.css:332-340, 413, 443 — centred, balanced, one block with no space
   between the paragraphs; the last set apart by its colour and weight */
.custom-benefit-people .custom-benefit-people__text {
	margin-right: auto;
	margin-left: auto;
}

.custom-benefit-people .custom-benefit-people__paragraph,
.custom-benefit-people .custom-benefit-people__closing {
	margin: 0;
	padding: 0;
	font-family: inherit;
	font-size: inherit;
	font-style: normal;
	font-weight: 300;
	line-height: 1.65;
	letter-spacing: 0;
	color: inherit;
	text-align: center;
	text-transform: none;
	text-wrap: balance;
}

.custom-benefit-people .custom-benefit-people__text .custom-benefit-people__closing {
	font-weight: 500;
}

/* benefit.css:348-363 — a faint label, centred */
.custom-benefit-people .custom-benefit-people__label {
	margin-top: 0;
	padding: 0;
	font-family: inherit;
	font-style: normal;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0;
	text-align: center;
	text-transform: none;
}

/* benefit.css:444-457 — a third of the row each, the row centred however few */
.custom-benefit-people .custom-benefit-people__cards {
	--custom-benefit-people-gap: 48px;
	--custom-benefit-people-row: 3;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--custom-benefit-people-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

.custom-benefit-people .custom-benefit-people__card {
	flex: 0 1 calc((100% - (var(--custom-benefit-people-row) - 1) * var(--custom-benefit-people-gap)) / var(--custom-benefit-people-row));
	min-width: 0;
	margin: 0;
	list-style: none;
}

.custom-benefit-people .custom-benefit-people__in {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

/* benefit.css:378-382, 509, 633 — a leaf-cornered picture standing bare on the
   band, a soft shadow under it; wide and low on a desktop */
.custom-benefit-people .custom-benefit-people__figure {
	aspect-ratio: 7 / 3;
	box-shadow: 0 18px 32px -24px rgba(14, 30, 84, 0.45);
}

.custom-benefit-people .custom-benefit-people__figure > img {
	transition: transform 600ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

/* benefit.css:383 — a linked card's picture grows a little under a pointer */
@media (hover: hover) {
	.custom-benefit-people a.custom-benefit-people__in:hover .custom-benefit-people__figure > img {
		transform: scale(1.04);
	}
}

/* benefit.css:384-387 */
.custom-benefit-people .custom-benefit-people__body {
	display: flex;
	flex: 1;
	flex-direction: column;
}

/* benefit.css:388-391 */
.custom-benefit-people .custom-benefit-people__name {
	margin: 0;
	padding: 0;
	font-family: inherit;
	font-style: normal;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: 0;
	text-transform: none;
}

/* benefit.css:392, 535 */
.custom-benefit-people .custom-benefit-people__lead {
	margin: 0;
	padding: 0;
	font-family: inherit;
	font-style: normal;
	font-weight: 600;
	line-height: 1.6;
	letter-spacing: 0;
	text-transform: none;
}

/* benefit.css:393, 407, 541-544 — justified; on a desktop three lines, so the
   cards stand level */
.custom-benefit-people .custom-benefit-people__words {
	margin: 0;
	padding: 0;
	font-family: inherit;
	font-style: normal;
	font-weight: 300;
	line-height: 1.65;
	letter-spacing: 0;
	text-align: justify;
	text-transform: none;
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}

/* benefit.css:421 */
.custom-benefit-people .custom-benefit-people__more {
	margin-top: auto;
	padding-top: 6px;
	font-weight: 600;
	line-height: 1.6;
}

/* Elementor's sheet (frontend.min.css, `.elementor img`) comes after the plugin's
   and sets a picture's height to auto and caps its width: the slot's picture says
   its own here, heavily enough to stand */
.custom-benefit-people .custom-benefit-people__figure > img {
	height: 100%;
	max-width: none;
}

/* ------------------------------------------------------------------ */
/* Tablet — 768px to 1024px                                            */
/* ------------------------------------------------------------------ */

@media (max-width: 1024px) {
	/* benefit.css:332-335 — the desktop's tighter lines are its own (488) */
	.custom-benefit-people .custom-benefit-people__paragraph,
	.custom-benefit-people .custom-benefit-people__closing {
		line-height: 1.8;
	}
	/* benefit.css:379, 393 — the picture taller, every line of the words shown */
	.custom-benefit-people .custom-benefit-people__figure {
		aspect-ratio: 16 / 10;
	}
	.custom-benefit-people .custom-benefit-people__words {
		display: block;
		overflow: visible;
		line-height: 1.75;
		-webkit-line-clamp: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.custom-benefit-people .custom-benefit-people__figure > img {
		transition: none;
	}
	.custom-benefit-people a.custom-benefit-people__in:hover .custom-benefit-people__figure > img {
		transform: none;
	}
}