@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700&display=swap');

/* ============================================================
 * Ponca Chairperson Intro — Frame 43
 * ============================================================ */

.ponca-cpi {
	position: relative;
	box-sizing: border-box;
	padding: var(--cpi-pad-top, 128px) var(--cpi-pad-x, 48px) var(--cpi-pad-bottom, 128px);
	overflow: hidden;
	isolation: isolate;
	background: var(--cpi-section-bg, linear-gradient(180deg, #FFFDF6 0%, #FFF7F5 158.08%));
}

.ponca-cpi *,
.ponca-cpi *::before,
.ponca-cpi *::after { box-sizing: border-box; }

.ponca-cpi__container {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: var(--cpi-max, 1600px);
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: var(--cpi-row-gap, 60px);
	padding:0px var(--cpi-pad-x)
}
.leader .ponca-cpi__container:before{
	display: none;
}
.ponca-cpi__container:before{
	content: "";
    display: block;
    max-width: 1504px;
	width:100%;
    height: 1px;
    background-color: #A7A7A7;
    position: absolute;
    top: -60px;
}

/* ---------- Header (eyebrow + title) ---------- */

.ponca-cpi__header {
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: 100%;
}

.ponca-cpi__eyebrow {
	margin: 0;
	padding: 0;
	color: var(--cpi-eyebrow-color, #DEB209);
	font-family: var(--cpi-eyebrow-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--cpi-eyebrow-font-size, 13px);
	line-height: var(--cpi-eyebrow-line-height, 22px);
	font-style: var(--cpi-eyebrow-font-style, normal);
	font-weight: var(--cpi-eyebrow-font-weight, 600);
	letter-spacing: var(--cpi-eyebrow-letter-spacing, 3px);
	text-transform: var(--cpi-eyebrow-text-transform, uppercase);
}

.ponca-cpi__title {
	margin: 0;
	padding: 0;
	font-family: var(--cpi-title-font-family, 'Cormorant Garamond', Georgia, serif);
	font-size: var(--cpi-title-font-size, clamp(2.25rem, 1.4rem + 3.2vw, 56px));
	line-height: var(--cpi-title-line-height, 1.11);
	font-weight: var(--cpi-title-font-weight, 300);
	letter-spacing: var(--cpi-title-letter-spacing, -0.56px);
}

.ponca-cpi__title-line1 {
	color: var(--cpi-title-line1-color, #0D0F0E);
	font-style: var(--cpi-title-line1-font-style, normal);
}
.ponca-cpi__title-line2 {
	color: var(--cpi-title-line2-color, #0D0F0E);
	font-style: var(--cpi-title-line2-font-style, italic);
}

.ponca-cpi__title--stacked {
	display: flex;
	flex-direction: column;
}
.ponca-cpi__title--stacked .ponca-cpi__title-line1,
.ponca-cpi__title--stacked .ponca-cpi__title-line2 { display: block; }

.ponca-cpi__title--inline {
	display: block;
}
.ponca-cpi__title--inline .ponca-cpi__title-line1,
.ponca-cpi__title--inline .ponca-cpi__title-line2 { display: inline; }

/* ---------- Description / subtitle ---------- */

.ponca-cpi__description {
	margin: var(--cpi-desc-top-gap, 24px) 0 0;
	padding: 0;
	color: var(--cpi-desc-color, #474747);
	max-width: var(--cpi-desc-max-width, 900px);
	font-family: var(--cpi-desc-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--cpi-desc-font-size, 18px);
	line-height: var(--cpi-desc-line-height, 30px);
	font-style: var(--cpi-desc-font-style, normal);
	font-weight: var(--cpi-desc-font-weight, 400);
}
.ponca-cpi__description a {
	color: var(--cpi-desc-link, #A78607);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.ponca-cpi__description a:hover { text-decoration: none; }
.ponca-cpi__description strong { font-weight: 600; }
.ponca-cpi__description em     { font-style: italic; }

/* ---------- Two-column row ---------- */

.ponca-cpi__row {
	display: grid;
	grid-template-columns: var(--cpi-img-w, 645px) 1fr;
	gap: var(--cpi-cols-gap, 100px);
	align-items: start;
	width: 100%;
}

/* ---------- Image column ---------- */

.ponca-cpi__image-col {
	margin: 0;
	padding: 0;
	width: 100%;
}

.ponca-cpi__image-frame {
	position: relative;
	width: 100%;
	aspect-ratio: var(--cpi-img-aspect);
	border: var(--cpi-img-border-w, 1px) solid var(--cpi-img-border-c, #A7A7A7);
	overflow: hidden;
}

.ponca-cpi__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top;
}

.ponca-cpi__image--placeholder {
	background:
		linear-gradient(135deg, rgba(255,255,255,0.04), rgba(255,255,255,0)) ,
		var(--cpi-img-ph-bg, #8B0000);
}

.ponca-cpi__overlay {
	position: absolute;
	inset: 0;
	pointer-events: none;
}
.ponca-cpi__overlay-fade {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 65%;
	background: var(--cpi-overlay-grad, linear-gradient(180deg, rgba(0,0,0,0) 0%, #000000 100%));
}
.ponca-cpi__overlay-text {
	position: absolute;
	left: 60px;
	right: 60px;
	bottom: 48px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.ponca-cpi__overlay-name,
.ponca-cpi__overlay-role { margin: 0; padding: 0; }

.ponca-cpi__overlay-name {
	color: var(--cpi-ovl-name-color, #E2D7CA);
	font-family: var(--cpi-ovl-name-font-family, 'Cormorant Garamond', Georgia, serif);
	font-size: var(--cpi-ovl-name-font-size, 40px);
	line-height: var(--cpi-ovl-name-line-height, 48px);
	font-style: var(--cpi-ovl-name-font-style, normal);
	font-weight: var(--cpi-ovl-name-font-weight, 600);
}
.ponca-cpi__overlay-role {
	color: var(--cpi-ovl-role-color, #E2D7CA);
	font-family: var(--cpi-ovl-role-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--cpi-ovl-role-font-size, 18px);
	line-height: var(--cpi-ovl-role-line-height, 23px);
	font-style: var(--cpi-ovl-role-font-style, normal);
	font-weight: var(--cpi-ovl-role-font-weight, 400);
}

/* ---------- Content column ---------- */

.ponca-cpi__content {
	display: flex;
	flex-direction: column;
	gap: var(--cpi-content-gap, 30px);
	padding: 20px 0;
	min-width: 0;
}

.ponca-cpi__name-block {
	display: flex;
	flex-direction: column;
	gap: var(--cpi-name-role-gap, 10px);
}

.ponca-cpi__name {
	margin: 0;
	padding: 0;
	color: var(--cpi-name-color, #0D0F0E);
	font-family: var(--cpi-name-font-family, 'Cormorant Garamond', Georgia, serif);
	font-size: var(--cpi-name-font-size, clamp(1.85rem, 1.3rem + 1.8vw, 44px));
	line-height: var(--cpi-name-line-height, 1.2);
	font-style: var(--cpi-name-font-style, normal);
	font-weight: var(--cpi-name-font-weight, 600);
	letter-spacing: var(--cpi-name-letter-spacing, 0);
	text-transform: var(--cpi-name-text-transform, uppercase);
}
.ponca-cpi__role {
	margin: 0;
	padding: 0;
	color: var(--cpi-role-color, #A78607);
	font-family: var(--cpi-role-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--cpi-role-font-size, 22px);
	line-height: var(--cpi-role-line-height, 29px);
	font-style: var(--cpi-role-font-style, normal);
	font-weight: var(--cpi-role-font-weight, 400);
}

/* ---------- Contact ---------- */

.ponca-cpi__contact {
	display: flex;
	flex-direction: column;
	gap: var(--cpi-contact-gap, 10px);
}

.ponca-cpi__contact-row {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	transition: opacity 0.25s ease;
	color: var(--cpi-contact-color, #474747);
	font-family: var(--cpi-contact-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--cpi-contact-font-size, 16px);
	line-height: var(--cpi-contact-line-height, 25px);
	font-style: var(--cpi-contact-font-style, normal);
	font-weight: var(--cpi-contact-font-weight, 400);
}
.ponca-cpi__contact-row:hover { opacity: 0.75; }
.ponca-cpi__contact-row:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

.ponca-cpi__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--cpi-icon-size, 20px);
	height: var(--cpi-icon-size, 20px);
	flex-shrink: 0;
	color: var(--cpi-icon-color, #A78607);
}
.ponca-cpi__icon svg { display: block; width: 100%; height: 100%; }

.ponca-cpi__contact-text { color: inherit; }

/* ---------- Divider ---------- */

.ponca-cpi__divider {
	margin: 0;
	border: 0;
	border-top: var(--cpi-divider-width, 1px) solid var(--cpi-divider-color, #F5E7B3);
	width: 100%;
}

/* ---------- Bio ---------- */

.ponca-cpi__bio {
	margin: 0;
	color: var(--cpi-bio-color, #474747);
	font-family: var(--cpi-bio-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--cpi-bio-font-size, 18px);
	line-height: var(--cpi-bio-line-height, 30px);
	font-style: var(--cpi-bio-font-style, normal);
	font-weight: var(--cpi-bio-font-weight, 400);
}
.ponca-cpi__bio > p {
	margin: 0 0 var(--cpi-bio-gap, 20px);
}
.ponca-cpi__bio > p:last-child { margin-bottom: 0; }

.ponca-cpi__bio a {
	color: var(--cpi-bio-link, #A78607);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.ponca-cpi__bio a:hover { text-decoration: none; }

.ponca-cpi__bio strong { font-weight: 600; }
.ponca-cpi__bio em     { font-style: italic; }

/* ---------- Title + checklist (after bio) ---------- */

.ponca-cpi__list-section {
	display: flex;
	flex-direction: column;
	gap: var(--cpi-list-title-gap, 24px);
}

.ponca-cpi__list-title {
	margin: 0;
	padding: 0;
	color: var(--cpi-list-title-color, #0D0F0E);
	font-family: var(--cpi-list-title-font-family, 'Cormorant Garamond', Georgia, serif);
	font-size: var(--cpi-list-title-font-size, clamp(1.75rem, 1.4rem + 1vw, 36px));
	line-height: var(--cpi-list-title-line-height, 1.2);
	font-style: var(--cpi-list-title-font-style, normal);
	font-weight: var(--cpi-list-title-font-weight, 500);
}

.ponca-cpi__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--cpi-list-item-gap, 12px);
}

.ponca-cpi__list-item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	padding: 0;
	color: var(--cpi-list-item-color, #0D0F0E);
	font-family: var(--cpi-list-item-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--cpi-list-item-font-size, 18px);
	line-height: var(--cpi-list-item-line-height, 26px);
	font-style: var(--cpi-list-item-font-style, normal);
	font-weight: var(--cpi-list-item-font-weight, 400);
}
.ponca-cpi__list-item::before,
.ponca-cpi__list-item::marker { content: none; }

.ponca-cpi__list-icon {
	display: inline-flex;
	flex-shrink: 0;
	width: var(--cpi-list-icon-size, 22px);
	height: var(--cpi-list-icon-size, 22px);
	/* Centre the icon on the first text line. */
	margin-top: calc((var(--cpi-list-item-line-height, 26px) - var(--cpi-list-icon-size, 22px)) / 2);
	color: var(--cpi-list-icon-color, #A78607);
}
.ponca-cpi__list-icon svg { display: block; width: 100%; height: 100%; }

.ponca-cpi__list-text { min-width: 0; }

.ponca-cpi__list-title a,
.ponca-cpi__list-text a {
	color: var(--cpi-list-link, #A78607);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.ponca-cpi__list-title a:hover,
.ponca-cpi__list-text a:hover { text-decoration: none; }
.ponca-cpi__list-text strong { font-weight: 600; }

/* ---------- Bottom pattern strip ---------- */

.ponca-cpi__pattern {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: var(--cpi-pattern-h, 83px);
	pointer-events: none;
	z-index: 0;
	opacity:10!important;
	background-image: var(--cpi-pattern-image, none);
	background-repeat: var(--cpi-pattern-repeat, repeat);
	background-position: var(--cpi-pattern-position, 0% 0%);
	background-size: cover!important;
}

/* ---------- Alignment variants ---------- */

.ponca-cpi.alignwide  .ponca-cpi__container,
.ponca-cpi.alignfull  .ponca-cpi__container { max-width: var(--cpi-max, 1600px); }

/* ---------- Responsive ---------- */

@media (max-width: 1100px) {
	.ponca-cpi {
		padding: clamp(3.5rem, 5vw + 1rem, 8rem) clamp(1.25rem, 3vw, 3rem);
	}
	
}
@media (max-width: 1024px) {
	.ponca-cpi__row {
		grid-template-columns: 1fr;
		gap: clamp(2rem, 4vw, 3.5rem);
	}
	.ponca-cpi__image-col {
		max-width: 400px;
	}
}
@media (max-width: 768px) {
	.ponca-cpi__container {
		padding:0px;
		gap: var(--cpi-row-gap, 30px);
	}
	.ponca-cpi__content{
		padding:0px;
		gap:10px
	}
	.ponca-cpi__row{
		gap: clamp(1rem, 4vw, 3.5rem);
	}
	.ponca-cpi__description{
		margin-top:10px!important
	}
	.ponca-cpi__container:before{
		top:-64px
	}
}

@media (max-width: 640px) {
	.ponca-cpi__overlay-text {
		left: 24px;
		right: 24px;
		bottom: 24px;
	}
}

/* ---------- Reduced motion ---------- */

@media (prefers-reduced-motion: reduce) {
	.ponca-cpi__contact-row { transition: none !important; }
}
