/* Ponca · Tribal Leadership History — frontend styles
 * Static layout lives here keyed on element classes. Editor-controlled design
 * tokens (colors, typography, editor-set spacing/radius/widths/gaps) come in as
 * CSS custom properties on the block wrapper, consumed below via var(default). */

.wp-block-ponca-tribal-leadership-history {
	box-sizing: border-box;
	position: relative;
	overflow: hidden;
	width: 100%;
	background-color: var(--tlh-bg, #FFFDF6);
	background-image: var(--tlh-bg-image, none);
	background-size: cover;
	background-position: center;
	padding: var(--tlh-pt, 128px) var(--tlh-pr, 165px) var(--tlh-pb, 96px) var(--tlh-pl, 165px);
}

.wp-block-ponca-tribal-leadership-history *,
.wp-block-ponca-tribal-leadership-history *::before,
.wp-block-ponca-tribal-leadership-history *::after {
	box-sizing: border-box;
}

.ponca-tlh__inner {
	margin: 0 auto;
	width: 100%;
	max-width: var(--tlh-maxw, 1600px);
}

.ponca-tlh__eyebrow {
	display: block;
	margin: 0;
	color: var(--tlh-eyebrow-color, #DEB209);
	font-family: var(--tlh-eyebrow-font-family, "DM Sans");
	font-size: var(--tlh-eyebrow-font-size, 13px);
	line-height: var(--tlh-eyebrow-line-height, 22px);
	font-weight: var(--tlh-eyebrow-font-weight, 600);
	font-style: var(--tlh-eyebrow-font-style, normal);
	letter-spacing: var(--tlh-eyebrow-letter-spacing, 2.3px);
	text-transform: var(--tlh-eyebrow-text-transform, uppercase);
}

.ponca-tlh__heading {
	display: block;
	margin: var(--tlh-heading-mt, 14px) 0 0 0;
	color: var(--tlh-heading-color, #0D0F0E);
	font-family: var(--tlh-heading-font-family, "Cormorant Garamond");
	font-size: var(--tlh-heading-font-size, 56px);
	line-height: var(--tlh-heading-line-height, 62px);
	font-weight: var(--tlh-heading-font-weight, 400);
	font-style: var(--tlh-heading-font-style, normal);
	letter-spacing: var(--tlh-heading-letter-spacing, -0.56px);
}

.ponca-tlh__heading-accent {
	display: inline;
	margin-left: 0.3em;
	color: var(--tlh-accent-color, #A78607);
	font-family: var(--tlh-accent-font-family, "Cormorant Garamond");
	font-weight: var(--tlh-accent-font-weight, 400);
	font-style: var(--tlh-accent-font-style, italic);
}

.ponca-tlh__groups {
	display: flex;
	flex-direction: column;
	margin-top: var(--tlh-groups-mt, 80px);
	gap: var(--tlh-groups-gap, 40px);
}

.ponca-tlh__group {
	display: flex;
	flex-direction: column;
}

.ponca-tlh__year {
	display: block;
	margin: 0 0 var(--tlh-year-mb, 24px) 0;
	color: var(--tlh-year-color, #0D0F0E);
	font-family: var(--tlh-year-font-family, "DM Sans");
	font-size: var(--tlh-year-font-size, 24px);
	line-height: var(--tlh-year-line-height, 32px);
	font-weight: var(--tlh-year-font-weight, 700);
	font-style: var(--tlh-year-font-style, normal);
	letter-spacing: var(--tlh-year-letter-spacing, 0);
	text-transform: var(--tlh-year-text-transform, none);
}

.ponca-tlh__people {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
	list-style: none;
	gap: var(--tlh-people-gap, 16px);
}

.ponca-tlh__person {
	display: flex;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
	gap: var(--tlh-person-gap, 12px);
}

.ponca-tlh__person-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: var(--tlh-icon-size, 20px);
	height: var(--tlh-icon-size, 20px);
}

.ponca-tlh__person-icon svg {
	display: block;
	width: 100%;
	height: 100%;
}

.ponca-tlh__person-text {
	display: inline-flex;
	align-items: baseline;
	flex-wrap: wrap;
}

.ponca-tlh__name {
	display: inline;
	margin: 0;
	color: var(--tlh-name-color, #0D0F0E);
	font-family: var(--tlh-name-font-family, "DM Sans");
	font-size: var(--tlh-name-font-size, 18px);
	line-height: var(--tlh-name-line-height, 26px);
	font-weight: var(--tlh-name-font-weight, 700);
	font-style: var(--tlh-name-font-style, normal);
	letter-spacing: var(--tlh-name-letter-spacing, 0);
}

.ponca-tlh__separator {
	display: inline-block;
	white-space: pre;
	padding-right: var(--tlh-separator-pr, 8px);
	color: var(--tlh-role-color, #474747);
	font-family: var(--tlh-name-font-family, "DM Sans");
	font-size: var(--tlh-name-font-size, 18px);
	line-height: var(--tlh-name-line-height, 26px);
}

.ponca-tlh__role {
	display: inline;
	margin: 0;
	color: var(--tlh-role-color, #474747);
	font-family: var(--tlh-role-font-family, "Cormorant Garamond");
	font-size: var(--tlh-role-font-size, 18px);
	line-height: var(--tlh-role-line-height, 26px);
	font-weight: var(--tlh-role-font-weight, 400);
	font-style: var(--tlh-role-font-style, italic);
	letter-spacing: var(--tlh-role-letter-spacing, 0);
}

.ponca-tlh__divider {
	display: block;
	border: 0;
	border-top: var(--tlh-divider-height, 1px) solid var(--tlh-divider-color, #E8E8E8);
	width: 100%;
	height: 0;
	margin-top: var(--tlh-divider-mt, 32px);
	margin-bottom: var(--tlh-divider-mb, 32px);
}

.ponca-tlh__footer {
	display: block;
	width: 100%;
	pointer-events: none;
	position: absolute;
	bottom: 0;
	left: 0;
	height: var(--tlh-footer-h, 83px);
	opacity: var(--tlh-footer-opacity, 1);
	margin-top: var(--tlh-footer-mt, 0);
	background-image: var(--tlh-footer-image, none);
	background-repeat: var(--tlh-footer-repeat, repeat-x);
	background-position: var(--tlh-footer-position, left bottom);
	background-size: var(--tlh-footer-size, auto 83px);
}

/* Responsive — keep the section comfortable on narrower viewports */
@media (max-width: 1280px) {
	.wp-block-ponca-tribal-leadership-history {
		padding-left: 64px !important;
		padding-right: 64px !important;
	}
}
@media (max-width: 768px) {
	.wp-block-ponca-tribal-leadership-history {
		padding-left: 24px !important;
		padding-right: 24px !important;
	}
	.ponca-tlh__heading {
		font-size: 38px !important;
		line-height: 44px !important;
	}
	.ponca-tlh__separator {
		display: none;
	}
}