/* eb5inc.com — components.
   Only what Elementor (free) has no control for. Padding, colors, borders,
   radii, shadows and type are set on each widget/container and stay editable.
   Classes are applied in Advanced → CSS Classes. */

/* ---------- Cards ---------- */
/* .card-featured: 2px gold top rule over the card's 1px hairline. */
.card-featured { position: relative; }
.card-featured::before {
	content: ""; position: absolute; top: -1px; left: -1px; right: -1px; height: 2px;
	background: var(--eb-accent); border-radius: 8px 8px 0 0; pointer-events: none; z-index: 1;
}
/* .card-link: the whole card is the link (container with HTML tag "a"). */
.card-link { text-decoration: none; color: inherit; }
.card-link .imgph { transition: background 200ms var(--eb-ease); }
.card-link:hover .imgph { background: #EFE9DE; }
.view-link .elementor-icon-box-title { text-decoration: underline; text-decoration-color: var(--eb-accent); text-underline-offset: 3px; }
.view-link .elementor-icon { transition: transform 200ms var(--eb-ease); }
.card-link:hover .view-link .elementor-icon { transform: translateX(4px); }

/* ---------- Badges: Icon List, inline view ---------- */
.bdgs .elementor-icon-list-items { gap: 8px; }
.bdgs.elementor-widget .elementor-icon-list-item { /* beats Elementor's .elementor-widget .elementor-icon-list-item { padding: 0 } */
	border-radius: 999px; padding: 5px 12px; line-height: 1.4; /* set the widget's "Space between" to 0: the gap above spaces the pills */
}
.bdgs .elementor-icon-list-icon { padding-inline-end: 8px; }
.bdgs-c .elementor-icon-list-item { background: var(--eb-primary); }
/* Inside a badge a pending value reads as plain bracket text, as in the mockup. */
.bdgs .ph { background: none; border: 0; padding: 0; font-size: inherit; line-height: inherit; color: inherit; font-weight: inherit; }
.bdgs-c .elementor-icon-list-icon { color: var(--eb-accent); }
.bdgs-p .elementor-icon-list-item { background: #FFFFFF; border: 1px solid var(--eb-red); letter-spacing: .02em; }
.bdgs-p .elementor-icon-list-icon { color: var(--eb-red); }

/* Fixed-meaning icon colors (teal = eligible, primary = neutral). */
.ic-teal .elementor-icon-list-icon { color: var(--eb-teal); }
.ic-primary .elementor-icon-list-icon { color: var(--eb-primary); }

/* ---------- Tables (written as <table> in a Text Editor) ---------- */
.elementor-widget-text-editor table { width: 100%; border-collapse: collapse; margin: 0; border: 0; font-size: 15px; }
.elementor-widget-text-editor table th,
.elementor-widget-text-editor table td { border: 0; background: none; line-height: 1.65; }
.elementor-widget-text-editor table tbody > tr:nth-child(odd) > td,
.elementor-widget-text-editor table tbody > tr:nth-child(odd) > th,
.elementor-widget-text-editor table tbody tr:hover > td,
.elementor-widget-text-editor table tbody tr:hover > th { background: none; }
.elementor-widget-text-editor table caption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }

/* .kv — label / value list */
.kv table tr { border-bottom: 1px solid var(--eb-line); }
.kv table th { text-align: left; font-weight: 500; color: var(--eb-muted); padding: 11px 16px 11px 0; vertical-align: top; width: 42%; }
.kv table td { padding: 11px 0; font-weight: 600; color: var(--eb-text); font-variant-numeric: tabular-nums; }
.kv.kv-sm table { font-size: 14px; }
.kv table td small { font-weight: 400; font-size: 13.5px; color: var(--eb-muted); }

/* .tbl — data table; the widget gets .scroll so it scrolls sideways on small screens */
.scroll { overflow-x: auto; }
.tbl table { min-width: 620px; }
.tbl table th { text-align: left; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--eb-muted); font-weight: 600; padding: 0 16px 10px 0; border-bottom: 1px solid var(--eb-text); }
.tbl table td { padding: 14px 16px 14px 0; border-bottom: 1px solid var(--eb-line); vertical-align: top; font-variant-numeric: tabular-nums; }
.tbl table tbody td:first-child { font-weight: 600; }
.tbl table tfoot td { font-weight: 700; border-bottom: 0; border-top: 1px solid var(--eb-text); }
.tbl table tbody tr { transition: background 120ms var(--eb-ease); }
.tbl table tbody tr:hover > td { background: var(--eb-ivory-hover); }

/* ---------- FAQ: Nested Accordion (<details>/<summary>) ---------- */
.faq .e-n-accordion { border-top: 1px solid var(--eb-line); }
.faq .e-n-accordion-item { border-bottom: 1px solid var(--eb-line); }
.faq .e-n-accordion-item-title { min-height: 44px; }
.faq .e-n-accordion-item-title-icon { color: var(--eb-teal); }
.faq .e-n-accordion-item-title-icon svg { width: 20px; height: 20px; }
.faq .e-n-accordion-item[open] .e-n-accordion-item-title-icon .e-opened svg { transform: rotate(180deg); }
.faq .e-n-accordion-item > .e-con p { max-width: 68ch; }

/* ---------- On-this-page nav (Icon List without icons) ---------- */
.toc .elementor-icon-list-item a {
	display: flex; align-items: center; width: 100%; min-height: 44px; padding: 7px 0 7px 12px; border-left: 2px solid var(--eb-line); text-decoration: none;
	transition: border-color 120ms var(--eb-ease);
}
.toc .elementor-icon-list-item .elementor-icon-list-text { color: var(--eb-text); transition: color 120ms var(--eb-ease); }
.toc .elementor-icon-list-item a:hover { border-left-color: var(--eb-primary); }
.toc .elementor-icon-list-item a[aria-current="true"] { border-left-color: var(--eb-accent); }
.toc .elementor-icon-list-item a[aria-current="true"] .elementor-icon-list-text { color: var(--eb-primary); font-weight: 600; }

/* ---------- Layout helpers ---------- */
/* Sticky aside (Elementor's "Sticky" motion effect is Pro). */
@media (min-width: 1001px) {
	.stick { position: sticky; top: calc(100px + var(--wp-admin--admin-bar--height, 0px)); align-self: flex-start; }
}
/* Process step number: tabular figures (border/size are widget controls). */
.step-n .elementor-heading-title, .stat-v .elementor-heading-title { font-variant-numeric: tabular-nums; }

/* Data room rows */
.doc { transition: background 120ms var(--eb-ease); }
.doc-ic .elementor-icon {
	width: 40px; height: 40px; border-radius: 8px; display: flex; align-items: center; justify-content: center;
	background: var(--eb-primary-tint); color: var(--eb-primary); font-size: 20px;
	transition: background 120ms var(--eb-ease), color 120ms var(--eb-ease);
}
.doc:hover .doc-ic .elementor-icon { background: var(--eb-primary); color: #FFFFFF; }
@media (max-width: 600px) {
	.doc > .doc-btn { grid-column: 2; justify-self: start; }
}

/* Glossary */
.gloss-item .elementor-heading-title { transition: color 120ms var(--eb-ease); }
.gloss-item:hover .elementor-heading-title { color: var(--eb-teal); }

/* Breadcrumb (Icon List, inline). The separator is decorative. */
.crumbs.elementor-widget .elementor-icon-list-items .elementor-icon-list-item:not(:last-child)::after { /* above Elementor's inline divider rule */
	content: "/" / ""; position: static; width: auto; height: auto; border: 0;
	margin-inline-start: 10px; color: var(--eb-muted); font-size: 14px;
}
.crumbs .elementor-icon-list-item a { min-height: 44px; display: inline-flex; align-items: center; }
.crumbs .elementor-icon-list-item a .elementor-icon-list-text { text-decoration: underline; text-decoration-color: rgba(15, 42, 63, .4); text-underline-offset: 3px; }
.crumbs .elementor-icon-list-item:last-child .elementor-icon-list-text { color: var(--eb-muted); }

/* ---------- Eligibility checker (HTML widget) ---------- */
.checker fieldset { border: 0; margin: 0; padding: 0; min-width: 0; display: grid; gap: 10px; }
.checker legend { padding: 0; }
.chk {
	display: flex; gap: 12px; align-items: flex-start; font-size: 15px; line-height: 1.5; padding: 12px;
	border: 1px solid var(--eb-line); border-radius: 6px; background: #FFFFFF; cursor: pointer; min-height: 44px;
	transition: border-color 120ms, background 120ms; color: var(--eb-text);
}
.chk:hover { border-color: var(--eb-primary); background: var(--eb-ivory-hover); }
.chk input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--eb-primary); flex: none; }
.meter { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; margin: 4px 0 16px; }
.meter span { height: 4px; border-radius: 2px; background: var(--eb-line); transition: background 200ms var(--eb-ease); }
.meter span.on { background: var(--eb-teal); }
.checker .small { font-size: 13.5px; line-height: 1.5; color: var(--eb-muted); margin: 0 0 12px; }
.checker .result { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--eb-line); }
.checker .result p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--eb-text); }
.checker .result .done-msg { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 12px; }
.checker .done-msg svg { flex: none; margin-top: 1px; color: var(--eb-teal); }
.checker .actions { display: grid; gap: 10px; }
.checker .result .disc { margin-top: 14px; font-size: 13.5px; line-height: 1.5; color: var(--eb-muted); border-left: 1px solid var(--eb-line); padding: 2px 0 2px 12px; }
.checker .btn {
	display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 44px;
	padding: 11px 20px; border-radius: 6px; border: 1px solid transparent; font-weight: 600; font-size: 16px;
	text-decoration: none; cursor: pointer; font-family: inherit; transition: background 120ms var(--eb-ease);
}
.checker .btn-primary { background: var(--eb-primary); border-color: var(--eb-primary); color: #FFFFFF; }
.checker .btn-primary:hover { background: var(--eb-primary-hover); color: #FFFFFF; }
.checker .btn-secondary { background: transparent; border-color: var(--eb-accent); color: var(--eb-primary); }
.checker .btn-secondary:hover { background: var(--eb-accent-tint); color: var(--eb-primary); }

/* ---------- Hero and photo bands ---------- */
.hero-copy > .elementor-element { max-width: 560px; }
.hero-img.imgph { border-width: 0 0 0 1px; }
.bleed.imgph { border-left: 0; border-right: 0; }
.band.imgph { border-width: 0 0 1px 0; }
.feat-img.imgph { border-width: 0 1px 0 0; }
.card-img.imgph { border-width: 0 0 1px 0; }
@media (max-width: 1000px) {
	.hero-img.imgph { border-width: 1px 0 0 0; }
	.feat-img.imgph { border-width: 0 0 1px 0; }
}

/* External link: icon after the text (decorative; the link text says where it goes). */
a.ext { display: inline-flex; gap: 6px; align-items: center; font-weight: 600; }
a.ext::after {
	content: ""; width: 15px; height: 15px; flex: none; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6'/%3E%3Cpath d='M10 14 21 3'/%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6'/%3E%3Cpath d='M10 14 21 3'/%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------- Offering gallery: [offering_image] fills its grid cell ---------- */
.gal-cell > .elementor-widget,
.gal-cell .elementor-widget-container,
.gal-cell .imgph,
.gal-cell img { height: 100%; }
.gal-cell .imgph { border-left: 0; border-right: 0; }
/* In the breadcrumb the pending project name reads as plain text, as in the mockup. */
.crumbs .ph { background: none; border: 0; padding: 0; font-size: inherit; font-weight: inherit; color: inherit; line-height: inherit; }

/* Program review metadata: three short lines, 6px apart. */
.review-meta p { margin: 0 0 6px; }
.review-meta strong { color: var(--eb-text); }

/* Photographs (Image widget, class .eb5-photo-widget): block-level, no line gap, square corners. */
.eb5-photo-widget .elementor-widget-container { line-height: 0; }
.eb5-photo-widget img { display: block; border-radius: 0; }