/* ============================================================
   WOOD SOURCING ETHICS — STANDALONE native rebuild (Divi removal).
   Loaded with wwg-about.css, whose hero, band and inner this page
   borrows: it is a child of About Us and reads as one.
   ============================================================ */

/* ── The line under the hero ── */
.wwg-ethics-lead {
	padding: var(--wwg-space-11) var(--wwg-space-4) var(--wwg-space-9);
	background: var(--wwg-bone-xlight);
	text-align: center;
}
.wwg-ethics-lead p {
	max-width: 860px;
	margin: 0 auto;
	font-family: var(--wwg-font-body);
	font-size: var(--wwg-text-lg-size);
	line-height: var(--wwg-text-lg-line);
}

/* ── Three principles, on the wood grain ── */
.wwg-ethics-principles {
	padding: var(--wwg-space-10) var(--wwg-space-4);
	background-color: var(--wwg-bone-light);
	background-size: cover;
	background-position: center;
}
.wwg-ethics-principles-grid {
	max-width: 1160px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--wwg-space-6);
}
.wwg-ethics-principle {
	display: flex;
	align-items: flex-start;
	gap: var(--wwg-space-4);
}
.wwg-ethics-principle-mark {
	flex: 0 0 40px;
	width: 40px;
	height: 40px;
	margin-top: 2px;
	color: var(--wwg-color-text-primary);
}
.wwg-ethics-principle h3 {
	margin: 0 0 var(--wwg-space-2);
}
.wwg-ethics-principle p {
	margin: 0;
	font-family: var(--wwg-font-body);
	font-size: var(--wwg-text-sm-size);
	line-height: var(--wwg-text-sm-line);
}

/* ── A Delicate Balance: two columns over a photograph ── */
.wwg-ethics-balance {
	padding: var(--wwg-space-11) var(--wwg-space-4);
	background-color: var(--wwg-bone-xlight);
}
.wwg-ethics-balance-grid {
	max-width: 1160px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--wwg-space-6);
	padding: var(--wwg-space-9) var(--wwg-space-7);
	border-radius: var(--wwg-radius-lg);
	/* the photograph sits behind the copy, lightened so the ink stays readable over it */
	background-size: cover;
	background-position: center;
	box-shadow: inset 0 0 0 100vmax color-mix(in srgb, var(--wwg-bone-xlight) 72%, transparent);
}
.wwg-ethics-balance-col h2 {
	margin: 0 0 var(--wwg-space-3);
}
.wwg-ethics-balance-col p {
	margin: 0 0 var(--wwg-space-3);
	font-family: var(--wwg-font-body);
	font-size: var(--wwg-text-md-size);
	line-height: var(--wwg-text-md-line);
}

/* ── Nonprofit partners: full-bleed photograph, light text ── */
.wwg-ethics-partners {
	padding: var(--wwg-space-12) var(--wwg-space-4);
	background-color: var(--wwg-ivory);
	background-size: cover;
	background-position: center;
	color: var(--wwg-bone-xlight);
}
.wwg-ethics-partners-grid {
	max-width: 1160px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: var(--wwg-space-9);
	align-items: center;
}
.wwg-ethics-partners h2 {
	margin: 0;
	color: var(--wwg-bone-xlight);
}
.wwg-ethics-partners-grid p {
	margin: 0;
	font-family: var(--wwg-font-body);
	font-size: var(--wwg-text-md-size);
	line-height: var(--wwg-text-md-line);
}
.wwg-ethics-partner-links {
	max-width: 1160px;
	margin: var(--wwg-space-9) auto 0;
	text-align: center;
	font-family: var(--wwg-font-body);
	font-size: var(--wwg-text-md-size);
	line-height: var(--wwg-text-md-line);
}
.wwg-ethics-partner-links a {
	color: var(--wwg-bone-xlight);
	font-weight: var(--wwg-btn-weight);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
}
.wwg-ethics-partner-links a:hover {
	color: var(--wwg-color-text-cta);
}
.wwg-ethics-partner-links .sep {
	margin: 0 var(--wwg-space-2);
	opacity: 0.6;
}

/* ── The species listing ── */
.wwg-ethics-species {
	padding: var(--wwg-space-11) var(--wwg-space-4);
	background-color: var(--wwg-bone);
	background-size: cover;
	background-position: center;
}
.wwg-ethics-species-grid {
	max-width: 1160px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: var(--wwg-space-9);
	align-items: start;
}
.wwg-ethics-species-photo {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--wwg-radius-lg);
}
.wwg-ethics-species-lists {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--wwg-space-6);
}
.wwg-ethics-species-lists h2 {
	margin: 0 0 var(--wwg-space-3);
}
.wwg-ethics-species-lists ul {
	margin: 0;
	padding-left: var(--wwg-space-4);
	font-family: var(--wwg-font-body);
	font-size: var(--wwg-text-md-size);
	line-height: var(--wwg-text-md-line);
}
.wwg-ethics-species-body > p {
	margin: var(--wwg-space-7) 0 0;
	font-family: var(--wwg-font-body);
	font-size: var(--wwg-text-md-size);
	line-height: var(--wwg-text-md-line);
}

/* ── On to the wood library ── */
.wwg-ethics-cta {
	padding: var(--wwg-space-10) var(--wwg-space-4) var(--wwg-space-12);
	background: var(--wwg-bone-xlight);
	text-align: center;
}
.wwg-ethics-cta p {
	max-width: 720px;
	margin: 0 auto var(--wwg-space-5);
	font-family: var(--wwg-font-body);
	font-size: var(--wwg-text-lg-size);
	line-height: var(--wwg-text-lg-line);
}

@media (max-width: 900px) {
	.wwg-ethics-principles-grid,
	.wwg-ethics-balance-grid,
	.wwg-ethics-partners-grid,
	.wwg-ethics-species-grid {
		grid-template-columns: minmax(0, 1fr);
	}
	.wwg-ethics-balance-grid {
		padding: var(--wwg-space-6) var(--wwg-space-5);
		gap: var(--wwg-space-7);
	}
	.wwg-ethics-partners-grid {
		gap: var(--wwg-space-5);
	}
	.wwg-ethics-lead,
	.wwg-ethics-balance,
	.wwg-ethics-species {
		padding-top: var(--wwg-space-9);
		padding-bottom: var(--wwg-space-9);
	}
	.wwg-ethics-partners {
		padding-top: var(--wwg-space-10);
		padding-bottom: var(--wwg-space-10);
	}
}

@media (max-width: 560px) {
	.wwg-ethics-species-lists {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--wwg-space-5);
	}
}
