/* =============================================================
 * Ponca Enrollment Resources — frontend styles
 * Class prefix: .ponca-er
 * ============================================================= */

.ponca-er {
	position: relative;
	box-sizing: border-box;
	overflow: hidden;
	isolation: isolate;
	padding: var(--er-pad-top, 128px) var(--er-pad-x, 48px) var(--er-pad-bottom, 128px);
	background: var(--er-section-bg, #FFFDF6);
}

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

.ponca-er::before,
.ponca-er::after,
.ponca-er__row::before,
.ponca-er__row::after,
.ponca-er__card::before,
.ponca-er__card::after { content: none !important; }

.ponca-er__bg-img {
	position: absolute;
	inset: 0;
	z-index: 0;
	background-image: var(--er-bg-img, none);
	background-size: var(--er-bg-size, cover);
	background-position: var(--er-bg-pos, center center);
	background-repeat: var(--er-bg-repeat, no-repeat);
}
.ponca-er__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: var(--er-overlay, rgba(255, 253, 246, 0.6));
	pointer-events: none;
}

.ponca-er__container {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: var(--er-max, 1600px);
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: var(--er-gap, 60px);
}

/* ---------- Section header ---------- */

.ponca-er__header {
	display: flex;
	flex-direction: column;
	gap: var(--er-eye-title-gap, 14px);
}
.ponca-er__eyebrow,
.ponca-er__title { margin: 0; padding: 0; }

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

.ponca-er__title {
	font-family: var(--er-title-font-family, 'Cormorant Garamond', Georgia, serif);
	font-size: var(--er-title-font-size, clamp(2.25rem, 1.4rem + 3.2vw, 56px));
	line-height: var(--er-title-line-height, 1.11);
	font-weight: var(--er-title-font-weight, 300);
	letter-spacing: var(--er-title-letter-spacing, -0.56px);
}
.ponca-er__title-l1 {
	color: var(--er-title-l1-color, #0D0F0E);
	font-style: var(--er-title-l1-font-style, normal);
}
.ponca-er__title-l2 {
	color: var(--er-title-l2-color, #DEB209);
	font-style: var(--er-title-l2-font-style, italic);
}

.ponca-er__title--inline { display: block; }
.ponca-er__title--inline .ponca-er__title-l1,
.ponca-er__title--inline .ponca-er__title-l2 { display: inline; }
.ponca-er__title--inline .ponca-er__title-l1 + .ponca-er__title-l2::before {
	content: "";
	display: inline-block;
	/* width: var(--er-title-gap, 0.4em); */
}
.ponca-er__title--stacked { display: flex; flex-direction: column; }
.ponca-er__title--stacked .ponca-er__title-l1,
.ponca-er__title--stacked .ponca-er__title-l2 { display: block; }

.ponca-er__description {
	margin: 0!important;
	padding: 0;
	margin-top: var(--er-desc-top, 24px);
	max-width: var(--er-desc-max, 1232px);
	color: var(--er-desc-color, #474747);
	font-family: var(--er-desc-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--er-desc-font-size, 18px);
	line-height: var(--er-desc-line-height, 30px);
	font-style: var(--er-desc-font-style, normal);
	font-weight: var(--er-desc-font-weight, 400);
}
.ponca-er__description a {
	color: var(--er-desc-link, #B28E07);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.ponca-er__description a:hover { text-decoration: none; }
.ponca-er__description strong,
.ponca-er__description b {
	color: var(--er-desc-highlight, #DEB209);
	font-weight: 600;
}
.ponca-er__description em,
.ponca-er__description i { font-style: italic; }

/* ---------- Documents list ---------- */

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

.ponca-er__row {
	box-sizing: border-box;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	gap: clamp(1rem, 4vw, 120px);
	padding: var(--er-row-pad, 24px);
	background: var(--er-row-bg, #FFFFFF);
	border: var(--er-row-bw, 1px) solid var(--er-row-bc, #F3F3F3);
	border-top-width: 0;
}
.ponca-er__row:first-child {
	border-top-width: var(--er-row-bw, 1px);
	border-top-left-radius:  var(--er-row-radius, 6px);
	border-top-right-radius: var(--er-row-radius, 6px);
}
.ponca-er__row:last-child {
	border-bottom-left-radius:  var(--er-row-radius, 6px);
	border-bottom-right-radius: var(--er-row-radius, 6px);
}
.ponca-er__row:only-child {
	border-radius: var(--er-row-radius, 6px);
}

.ponca-er__row-left {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: var(--er-row-gap, 24px);
	min-width: 0;
}

.ponca-er__icon-circle {
	flex-shrink: 0;
	width:  var(--er-icon-size, 50px);
	height: var(--er-icon-size, 50px);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 100px;
	background: var(--er-icon-bg-active, rgba(222, 178, 9, 0.1));
}
.ponca-er__icon-circle--locked {
	background: var(--er-icon-bg-locked, #F4F4F4);
}
.ponca-er__icon-svg {
	display: block;
	width: 24px;
	height: 24px;
}
.ponca-er__icon-svg--lock {
	width: 20px;
	height: 20px;
	color: var(--er-icon-locked-color, #848484);
	stroke: currentColor;
	fill: none;
}
.ponca-er__icon-custom {
	display: block;
	max-width: 28px;
	max-height: 28px;
	width: auto;
	height: auto;
	object-fit: contain;
}

.ponca-er__row-text {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 6px;
	min-width: 0;
}
.ponca-er__row-title {
	margin: 0;
	padding: 0;
	color: var(--er-title-color, #0D0F0E);
	font-family: var(--er-rowtitle-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--er-rowtitle-font-size, 18px);
	line-height: var(--er-rowtitle-line-height, 23px);
	font-style: var(--er-rowtitle-font-style, normal);
	font-weight: var(--er-rowtitle-font-weight, 500);
}
.ponca-er__row-subtitle {
	margin: 0;
	padding: 0;
	color: var(--er-sub-color, #848484);
	font-family: var(--er-rowsub-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--er-rowsub-font-size, 14px);
	line-height: var(--er-rowsub-line-height, 18px);
	font-style: var(--er-rowsub-font-style, normal);
	font-weight: var(--er-rowsub-font-weight, 400);
}
.ponca-er__row-subtitle a {
	color: var(--er-sub-link, #B28E07);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.ponca-er__row-subtitle a:hover { text-decoration: none; }

/* Secondary subtitle line (e.g. "Sign in to view documents") — own color, hover color,
   per-line gap above, and an underline toggle via the .is-sub2-underline wrapper class. */
.ponca-er__row-subtitle2 {
	margin: 0;
	padding: 0;
	margin-top: var(--er-sub2-gap-top, 6px);
	color: var(--er-sub2-color, #B28E07);
	transition: color .15s ease;
	font-family: var(--er-rowsub2-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--er-rowsub2-font-size, 14px);
	line-height: var(--er-rowsub2-line-height, 18px);
	font-style: var(--er-rowsub2-font-style, normal);
	font-weight: var(--er-rowsub2-font-weight, 400);
	letter-spacing: var(--er-rowsub2-letter-spacing, 0px);
	text-transform: var(--er-rowsub2-text-transform, none);
}
.ponca-er__row-subtitle2 span {
	color: var(--er-sub2-color-al, #848484);
}
.ponca-er__row-subtitle2 a {
	color: inherit;
	transition: color .15s ease;
}
/*.ponca-er.is-sub2-underline .ponca-er__row-subtitle2,*/
.ponca-er.is-sub2-underline .ponca-er__row-subtitle2 a {
	text-decoration: underline;
	text-underline-offset: 2px;
}
/*.ponca-er:not(.is-sub2-underline) .ponca-er__row-subtitle2,*/
.ponca-er:not(.is-sub2-underline) .ponca-er__row-subtitle2 a {
	text-decoration: none;
}
.ponca-er__row-subtitle2 a:hover,
.ponca-er__row-subtitle2 a:focus-visible {
	color: var(--er-sub2-hover, #DEB209);
}
.ponca-er.is-sub2-underline .ponca-er__row-subtitle2 a:hover,
.ponca-er.is-sub2-underline .ponca-er__row-subtitle2 a:focus-visible {
	text-decoration: none;
}

/* PDF text + meta date line — styled like the subtitle, shown below it when filled.
   PDF text and date sit on one line, joined by the configurable separator. */
.ponca-er__row-pdftext {
	margin: 0;
	padding: 0;
	color: var(--er-sub-color, #848484);
	font-family: var(--er-rowsub-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--er-rowsub-font-size, 14px);
	line-height: var(--er-rowsub-line-height, 18px);
	font-style: var(--er-rowsub-font-style, normal);
	font-weight: var(--er-rowsub-font-weight, 400);
}
.ponca-er__row-meta-date {
	color: var(--er-meta-date-color, #848484);
}

.ponca-er__row-btn,
.ponca-er__row-badge {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: var(--er-btn-pad, 6px 16px);
	border: var(--er-btn-bw, 1px) solid var(--er-btn-bc, #B28E07);
	border-radius: var(--er-btn-radius, 100px);
	background: var(--er-btn-bg, transparent);
	color: var(--er-btn-text, #B28E07);
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 0.2s ease, color 0.2s ease;
	font-family: var(--er-rowbtn-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--er-rowbtn-font-size, 12px);
	line-height: var(--er-rowbtn-line-height, 16px);
	font-weight: var(--er-rowbtn-font-weight, 400);
	letter-spacing: var(--er-rowbtn-letter-spacing, 1px);
	text-transform: var(--er-rowbtn-text-transform, uppercase);
}
.ponca-er__row-btn:hover,
.ponca-er__row-btn:focus-visible {
	background: var(--er-btn-hover-bg, #FAF3DA);
	color: var(--er-btn-hover-text, #B28E07);
}
.ponca-er__row-btn:hover .ponca-er__row-btn-arrow svg * {
	stroke: var(--er-btn-hover-text, #B28E07);
}
.ponca-er__row-btn:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

.ponca-er__row-badge {
	border-color: var(--er-btn-locked-bc, #848484);
	color:        var(--er-btn-locked-text, #848484);
	background:   var(--er-btn-locked-bg, transparent);
	cursor: default;
}

.ponca-er__row-btn-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	color: var(--er-btn-arrow, #B28E07);
}
.ponca-er__row-btn-arrow svg { width: 100%; height: 100%; display: block; }
.ponca-er__row-btn-arrow-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

/* ---------- Info cards grid ---------- */

.ponca-er__info-cards {
	display: grid;
	grid-template-columns: repeat(var(--er-ic-cols, 2), minmax(0, 1fr));
	gap: var(--er-ic-gap, 30px);
}

.ponca-er__card {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: var(--er-card-gap, 20px);
	padding: var(--er-card-pad, 40px);
	background: var(--er-card-bg, #FFFFFF);
	border: var(--er-card-bw, 1px) solid var(--er-card-bc, #F5E7B3);
	border-radius: var(--er-card-radius, 0px);
}

.ponca-er__card-icon {
	display: block;
	width:  var(--er-card-icon-size, 30px);
	height: var(--er-card-icon-size, 30px);
	color:  var(--er-card-icon-color, #A78607);
	stroke: currentColor;
	fill: none;
}
.ponca-er__card-icon-custom {
	display: block;
	width:  var(--er-card-icon-size, 30px);
	height: var(--er-card-icon-size, 30px);
	object-fit: contain;
}

.ponca-er__card-title,
.ponca-er__card-description { margin: 0; padding: 0; }

.ponca-er__card-title {
	color: var(--er-card-title-color, #0D0F0E);
	font-family: var(--er-cardtitle-font-family, 'Cormorant Garamond', Georgia, serif);
	font-size: var(--er-cardtitle-font-size, 32px);
	line-height: var(--er-cardtitle-line-height, 37px);
	font-style: var(--er-cardtitle-font-style, normal);
	font-weight: var(--er-cardtitle-font-weight, 400);
	letter-spacing: var(--er-cardtitle-letter-spacing, 0.576px);
}
.ponca-er__card-description {
	color: var(--er-card-desc-color, #474747);
	font-family: var(--er-carddesc-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--er-carddesc-font-size, 16px);
	line-height: var(--er-carddesc-line-height, 25px);
	font-style: var(--er-carddesc-font-style, normal);
	font-weight: var(--er-carddesc-font-weight, 400);
}
.ponca-er__card-description a {
	color: var(--er-card-desc-link, #B28E07);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.ponca-er__card-description a:hover { text-decoration: none; }
.ponca-er__card-description strong { font-weight: 600; }
.ponca-er__card-description em     { font-style: italic; }

.ponca-er__card-link {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 11px;
	text-decoration: none;
	align-self: flex-start;
}
.ponca-er__card-link-row {
	display: inline-flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;
	color: var(--er-card-link-color, #B28E07);
	font-family: var(--er-cardlink-font-family, 'DM Sans', 'Helvetica Neue', sans-serif);
	font-size: var(--er-cardlink-font-size, 13px);
	font-weight: var(--er-cardlink-font-weight, 600);
	letter-spacing: var(--er-cardlink-letter-spacing, 1.92px);
	text-transform: var(--er-cardlink-text-transform, uppercase);
}
.ponca-er__card-link-arrow {
	display: inline-block;
	font-family: Arial, sans-serif;
	font-size: 12.8px;
	font-weight: 700;
	line-height: 22px;
	letter-spacing: 1.92px;
	text-transform: uppercase;
	color: inherit;
}
.ponca-er__card-link-underline {
	display: block;
	height: 1px;
	background: var(--er-card-link-underline, #B28E07);
	width: 100%;
	min-width: 80px;
}

/* ---------- Footer decorative image ---------- */

.ponca-er__footer-img {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: var(--er-fimg-h, 83px);
	background-image: var(--er-fimg-url, none);
	background-size: var(--er-fimg-size, auto 100%);
	background-position: var(--er-fimg-pos, bottom center);
	background-repeat: var(--er-fimg-repeat, repeat-x);
	opacity: var(--er-fimg-opacity, 1);
	pointer-events: none;
	z-index: 1;
}

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

@media (max-width: 1100px) {
	.ponca-er { padding: clamp(3.5rem, 5vw + 1rem, 8rem) clamp(1.25rem, 3vw, 3rem); }
	.ponca-er__row { gap: clamp(1rem, 3vw, 2rem); }
	.ponca-er__info-cards { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 760px) {
	.ponca-er__info-cards { grid-template-columns: 1fr; }
	.ponca-er__row { flex-direction: column; align-items: flex-start; }
	.ponca-er__row-btn, .ponca-er__row-badge { align-self: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
	.ponca-er__row-btn { transition: none !important; }
}

/* ==========================================================================
   Optional second row button ("view page"), shown before the download button.
   Off unless switched on per document in the block settings.
   ========================================================================== */

/* Holds both buttons so the row still has two flex children and its
   space-between layout is unchanged. With the extra button switched off this
   wrapper contains only the download button and nothing moves. */
.ponca-er__row-actions {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	gap: var(--er-btn2-gap, 12px);
}

/* The reverse of the download button: filled where that one is outlined,
   and it swaps to the outlined look on hover. */
.ponca-er__row-btn--alt {
	border-color: var(--er-btn2-bc, #B28E07);
	background: var(--er-btn2-bg, #B28E07);
	color: var(--er-btn2-text, #FFFFFF);
}

.ponca-er__row-btn--alt:hover,
.ponca-er__row-btn--alt:focus-visible {
	background: var(--er-btn2-hover-bg, transparent);
	color: var(--er-btn2-hover-text, #B28E07);
}

/* The icon needs its own colour, or it keeps the download button's gold and
   disappears against the filled background. */
.ponca-er__row-btn--alt .ponca-er__row-btn-arrow {
	color: var(--er-btn2-arrow, #FFFFFF);
}

.ponca-er__row-btn--alt .ponca-er__row-btn-arrow svg * {
	stroke: var(--er-btn2-arrow, #FFFFFF);
}

.ponca-er__row-btn--alt:hover .ponca-er__row-btn-arrow,
.ponca-er__row-btn--alt:focus-visible .ponca-er__row-btn-arrow {
	color: var(--er-btn2-hover-arrow, #B28E07);
}

.ponca-er__row-btn--alt:hover .ponca-er__row-btn-arrow svg *,
.ponca-er__row-btn--alt:focus-visible .ponca-er__row-btn-arrow svg * {
	stroke: var(--er-btn2-hover-arrow, #B28E07);
}

@media (max-width: 640px) {
	.ponca-er__row-actions { gap: 8px; flex-wrap: wrap;  }
}
