/*
 * Sustainability - SDG notes.
 *
 * Read from cp-all-designer css/sustain-cpall-and-the-sustainable-development-
 * goals.css:200-240 (.susdgpn__kicker, .susdg-notes, .susdgduo,
 * .susdgpn--onDark). The leaves are the shared ones (sustainability-widget.css).
 *
 * Colour, type, padding and the measures arrive from the Style tab and are not
 * repeated here.
 */

.custom-sustainability-sdg-notes.custom-sustainability-sdg-notes[data-custom-partner-band] {
	background: linear-gradient(160deg,
		var(--custom-sustainability-sdg-notes-top, #1E4EA5) 0%,
		var(--custom-sustainability-sdg-notes-foot, #16418C) 100%);
}

/* the smaller head (.h-sub): 500, 1.35 */
.custom-sustainability-sdg-notes.custom-sustainability-sdg-notes [data-custom-investor-title] {
	font-weight: 500;
	line-height: 1.35;
}

/* side by side, as many as fit; every card as tall as the tallest */
.custom-sustainability-sdg-notes .custom-sustainability-sdg-notes__cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--custom-sustainability-sdg-notes-least, 320px)), 1fr));
	align-items: stretch;
}

.custom-sustainability-sdg-notes .custom-sustainability-sdg-notes__card {
	min-width: 0;
	border: 2px solid rgba(255, 255, 255, 0.12);   /* measures 1px */
}

.custom-sustainability-sdg-notes .custom-sustainability-sdg-notes__card-head {
	display: flex;
	align-items: center;
	gap: 18px;
	margin-bottom: 24px;
	padding-bottom: 22px;
	border-bottom: 2px solid rgba(255, 255, 255, 0.14);   /* measures 1px */
}

.custom-sustainability-sdg-notes .custom-sustainability-sdg-notes__card-icon {
	display: block;
	flex: 0 0 auto;
	overflow: hidden;
	border-radius: 6px;                    /* --r-sm */
	box-shadow: 0 4px 14px -6px rgba(0, 0, 0, 0.5);
}

.custom-sustainability-sdg-notes .custom-sustainability-sdg-notes__card-icon img {
	display: block;
	width: 100%;
	height: auto;
	max-width: none;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 0;
}

.custom-sustainability-sdg-notes .custom-sustainability-sdg-notes__card .custom-sustainability-sdg-notes__card-head .custom-sustainability-sdg-notes__name {
	margin-top: 0;
	font-weight: 600;
	line-height: 1.4;
}

/* a paragraph's own 18px over it, as the design keeps it */
.custom-sustainability-sdg-notes .custom-sustainability-sdg-notes__card .custom-sustainability-sdg-notes__kicker {
	margin: 18px 0 16px;
	font-weight: 600;
	line-height: 1.5;
}

.custom-sustainability-sdg-notes .custom-sustainability-sdg-notes__notes {
	line-height: 1.8;
}

.custom-sustainability-sdg-notes .custom-sustainability-sdg-notes__card .custom-sustainability-sdg-notes__notes ul,
.custom-sustainability-sdg-notes .custom-sustainability-sdg-notes__card .custom-sustainability-sdg-notes__notes ol {
	display: grid;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.custom-sustainability-sdg-notes .custom-sustainability-sdg-notes__card .custom-sustainability-sdg-notes__notes li {
	position: relative;
	margin: 0;
	padding-left: 20px;
}

.custom-sustainability-sdg-notes .custom-sustainability-sdg-notes__notes li::before {
	content: "";
	position: absolute;
	top: 14px;                             /* half the 14px line and 6: 13 */
	left: 0;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--custom-sustainability-sdg-notes-bullet, #D8E8A3);
}

.custom-sustainability-sdg-notes .custom-sustainability-sdg-notes__card .custom-sustainability-sdg-notes__notes p {
	margin: 0 0 12px;
	color: inherit;
}