/* Atanga SkillBridge - Grant Eligibility Checker
   Brand: logo blue #00163F with complementary green #419351. */

.asb-gec {
	--ast-navy: #00163F;
	--ast-green: #00163F;
	--ast-green-dark: #000E2A;
	--ast-accent: #419351;
	--ast-accent-dark: #32733F;
	--ast-ink: #1f2937;
	--ast-muted: #6b7280;
	--ast-line: #e5e7eb;
	--ast-bg: #f8fafc;
	--ast-radius: 12px;

	max-width: 760px;
	margin: 0 auto;
	padding: clamp(2rem, 5vw, 3.5rem) 0;
	color: var(--ast-ink);
	font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	font-size: 16px;
	line-height: 1.6;
}

/* Keep this tool's page introduction focused and visually connected to the
   assessment. The shared hero and section spacing is intentionally roomier
   for editorial pages, so scope these adjustments to the grant checker. */
.asb-grant-checker-hero {
	padding: clamp(2.5rem, 4vw, 3rem) 0;
}
.asb-grant-checker-hero .asb-hero-inner {
	max-width: 980px;
	margin-inline: auto;
	text-align: center;
}
.asb-grant-checker-hero .asb-kicker {
	display: table;
	margin-inline: auto;
}
.asb-grant-checker-hero .asb-h1,
.asb-grant-checker-hero .asb-sub {
	margin-inline: auto;
}
.asb-grant-checker-hero .asb-sub {
	max-width: 760px;
	margin-bottom: 0;
}

.asb-grant-checker-assessment {
	padding: 0 0 4.5rem;
}
.asb-grant-checker-assessment .asb-gec {
	padding-block: 0;
	margin-top: -1.5rem;
	position: relative;
	z-index: 1;
}

.asb-gec *,
.asb-gec *::before,
.asb-gec *::after {
	box-sizing: border-box;
}

.asb-gec h2,
.asb-gec h3 {
	font-family: "Montserrat", "Open Sans", sans-serif;
	color: var(--ast-navy);
	line-height: 1.2;
	margin: 0 0 .5em;
}

/* Assessment masthead (persistent title across wizard steps) */
.asb-gec__masthead {
	text-align: center;
	margin-bottom: 1.75rem;
}
.asb-gec__masthead-title {
	font-size: clamp(1.5rem, 3.5vw, 2rem);
	margin: 0 0 .35rem;
}
.asb-gec__masthead-sub {
	margin: 0;
	color: var(--ast-muted);
	font-size: 16px;
}
/* Intro step supplies its own hero title, so hide the masthead there. */
.asb-gec.is-intro .asb-gec__masthead {
	display: none;
}
/* Progress begins with question one; omitting its empty intro state removes
   a misleading bar and keeps the first card close to the page introduction. */
.asb-gec.is-intro .asb-gec__progress {
	display: none;
}

/* Progress */
.asb-gec__progress {
	margin-bottom: 2rem;
}
.asb-gec__progress-bar {
	height: 8px;
	background: var(--ast-line);
	border-radius: 999px;
	overflow: hidden;
}
.asb-gec__progress-bar span {
	display: block;
	height: 100%;
	width: 0;
	background: linear-gradient(90deg, var(--ast-green), var(--ast-green-dark));
	border-radius: 999px;
	transition: width .35s ease;
}
.asb-gec__progress-label {
	margin-top: .6rem;
	font-size: 15px;
	color: var(--ast-muted);
	letter-spacing: .02em;
}

/* Card / steps */
.asb-gec__form {
	background: #fff;
	border: 1px solid var(--ast-line);
	border-radius: var(--ast-radius);
	padding: clamp(1.75rem, 4vw, 3rem);
	box-shadow: 0 10px 30px rgba(12, 30, 62, .06);
}
.asb-gec__step {
	display: none;
	animation: ast-fade .35s ease;
}
.asb-gec__step.is-active {
	display: block;
}
@keyframes ast-fade {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: translateY(0); }
}

.asb-gec__title {
	font-size: clamp(1.6rem, 4vw, 2.1rem);
}
.asb-gec__step-title {
	font-size: clamp(1.2rem, 3vw, 1.45rem);
	padding-bottom: .65rem;
	border-bottom: 2px solid var(--ast-green);
	display: inline-block;
	margin-bottom: 1.75rem;
}
.asb-gec__lead {
	color: var(--ast-muted);
	font-size: 16px;
	margin: 0 0 1.5rem;
}
.asb-gec__meta-list {
	list-style: none;
	padding: 0;
	margin: 0 0 1.75rem;
	display: flex;
	flex-wrap: wrap;
	gap: .75rem 1.75rem;
}
.asb-gec__meta-list li {
	position: relative;
	padding-left: 1.6rem;
	font-size: 15px;
	color: var(--ast-ink);
}
.asb-gec__meta-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .1em;
	width: 1.05rem;
	height: 1.05rem;
	border-radius: 50%;
	background: var(--ast-accent);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E") center/70% no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E") center/70% no-repeat;
}

/* ---------------- Intro / mini landing page ---------------- */
.asb-gec__hero {
	text-align: center;
}
.asb-gec__eyebrow {
	display: inline-block;
	font-family: "Montserrat", "Open Sans", sans-serif;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--ast-green-dark);
	background: rgba(0, 22, 63, .08);
	padding: .4rem 1rem;
	border-radius: 999px;
	margin-bottom: 1.25rem;
}
.asb-gec__hero .asb-gec__title {
	max-width: 18ch;
	margin: 0 auto .75rem;
}
.asb-gec__hero .asb-gec__lead {
	max-width: 54ch;
	margin: 0 auto 2rem;
}

.asb-gec__hero-stats {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1rem;
	margin-bottom: 2rem;
}
.asb-gec__stat {
	flex: 1 1 140px;
	max-width: 200px;
	background: var(--ast-bg);
	border: 1px solid var(--ast-line);
	border-radius: var(--ast-radius);
	padding: 1.1rem 1rem;
}
.asb-gec__stat strong {
	display: block;
	font-family: "Montserrat", sans-serif;
	font-size: 2rem;
	line-height: 1;
	color: var(--ast-navy);
}
.asb-gec__stat span {
	display: block;
	margin-top: .4rem;
	font-size: 15px;
	color: var(--ast-muted);
}

.asb-gec__how {
	list-style: none;
	counter-reset: how;
	padding: 0;
	margin: 0 auto 2rem;
	display: grid;
	gap: 1rem;
	text-align: left;
	max-width: 520px;
}
.asb-gec__how li {
	display: flex;
	align-items: flex-start;
	gap: .9rem;
}
.asb-gec__how-num {
	flex: none;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background: var(--ast-navy);
	color: #fff;
	font-family: "Montserrat", sans-serif;
	font-weight: 700;
	font-size: 15px;
	display: grid;
	place-items: center;
}
.asb-gec__how-text {
	font-size: 16px;
	padding-top: .2rem;
}
.asb-gec__how-text strong {
	color: var(--ast-navy);
}

.asb-gec__hero .asb-gec__meta-list {
	justify-content: center;
	margin-bottom: 2rem;
}

.asb-gec__hero-cta {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .9rem;
}
.asb-gec__btn--lg {
	font-size: 16px;
	padding: 1.05rem 2.5rem;
}
.asb-gec__reassure {
	font-size: 15px;
	color: var(--ast-muted);
}

@media (max-width: 679px) {
	.asb-grant-checker-hero {
		padding: 2.5rem 0 2.25rem;
	}
	.asb-grant-checker-assessment {
		padding: 0 0 3.5rem;
	}
}

/* Autosave status line */
.asb-gec__autosave {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: 15px;
	color: var(--ast-muted);
	margin: 0 0 1.25rem;
}
.asb-gec__autosave::before {
	content: "";
	flex: none;
	width: 1rem;
	height: 1rem;
	border-radius: 50%;
	background: var(--ast-accent);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E") center/70% no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E") center/70% no-repeat;
}

/* Questions */
.asb-gec__question {
	border: 0;
	padding: 0;
	margin: 0 0 2rem;
}
.asb-gec__question:last-of-type {
	margin-bottom: 0;
}
.asb-gec__question-text {
	font-weight: 700;
	color: var(--ast-navy);
	padding: 0;
	margin-bottom: 1rem;
	font-size: 17px;
}
.asb-gec__options {
	display: grid;
	gap: .65rem;
}
.asb-gec__question--error .asb-gec__question-text {
	color: #c0392b;
}
.asb-gec__question--error .asb-gec__options {
	outline: 2px solid #f5c6c2;
	outline-offset: 6px;
	border-radius: 10px;
}
.asb-gec__option {
	display: flex;
	align-items: center;
	gap: .8rem;
	padding: 1rem 1.15rem;
	border: 1.5px solid var(--ast-line);
	border-radius: 10px;
	cursor: pointer;
	transition: border-color .15s, background .15s, box-shadow .15s;
}
.asb-gec__option:hover {
	border-color: #b8c4d6;
	background: var(--ast-bg);
}
.asb-gec__option input {
	margin: 0;
	accent-color: var(--ast-green);
	width: 1.15rem;
	height: 1.15rem;
	flex: none;
}
.asb-gec__option:has(input:checked) {
	border-color: var(--ast-green);
	background: rgba(0, 22, 63, .06);
	box-shadow: inset 0 0 0 1px var(--ast-green);
}
.asb-gec__option-label {
	font-size: 15px;
}

/* Contact fields */
.asb-gec__fields {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.25rem;
	margin-bottom: 1.25rem;
}
.asb-gec__field {
	display: flex;
	flex-direction: column;
	gap: .45rem;
	font-size: 15px;
	font-weight: 600;
	color: var(--ast-navy);
}
.asb-gec__field--full {
	grid-column: 1 / -1;
}
.asb-gec__field input {
	font: inherit;
	font-size: 16px;
	font-weight: 400;
	padding: .85rem 1rem;
	border: 1.5px solid var(--ast-line);
	border-radius: 8px;
	background: #fff;
	color: var(--ast-ink);
}
.asb-gec__field input:focus {
	outline: none;
	border-color: var(--ast-green);
	box-shadow: 0 0 0 3px rgba(0, 22, 63, .15);
}
.asb-gec__consent {
	display: flex;
	align-items: flex-start;
	gap: .7rem;
	font-weight: 400;
	font-size: 15px;
	color: var(--ast-muted);
}
.asb-gec__consent input {
	margin-top: .2rem;
	accent-color: var(--ast-green);
}
.asb-gec__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
.asb-gec__error {
	background: #fdecea;
	border: 1px solid #f5c6c2;
	color: #a5342b;
	padding: .85rem 1rem;
	border-radius: 8px;
	font-size: 15px;
	margin-bottom: 1.25rem;
}

/* Buttons / nav */
.asb-gec__nav {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	margin-top: 2.25rem;
}
.asb-gec__nav:only-child,
.asb-gec__step[data-step="0"] .asb-gec__nav {
	justify-content: flex-end;
}
.asb-gec__btn {
	font-family: "Montserrat", "Open Sans", sans-serif;
	font-weight: 600;
	font-size: 15px;
	padding: .9rem 1.9rem;
	border-radius: 999px;
	border: 2px solid transparent;
	cursor: pointer;
	transition: transform .1s, background .15s, box-shadow .15s;
	text-decoration: none;
	display: inline-block;
	line-height: 1.2;
}
.asb-gec__btn:active {
	transform: translateY(1px);
}
.asb-gec__btn--primary {
	background: var(--ast-green);
	color: #fff;
}
.asb-gec__btn--primary:hover {
	background: var(--ast-green-dark);
	color: #fff;
	box-shadow: 0 6px 18px rgba(0, 22, 63, .3);
}
.asb-gec__btn--primary[disabled] {
	opacity: .6;
	cursor: not-allowed;
	box-shadow: none;
}
.asb-gec__btn--ghost {
	background: transparent;
	color: var(--ast-navy);
	border-color: var(--ast-line);
}
.asb-gec__btn--ghost:hover {
	border-color: var(--ast-navy);
}

/* ---------------- Results ---------------- */
.asb-gec__results {
	background: #fff;
	border: 1px solid var(--ast-line);
	border-radius: var(--ast-radius);
	padding: clamp(1.75rem, 4vw, 3rem);
	box-shadow: 0 10px 30px rgba(12, 30, 62, .06);
	animation: ast-fade .4s ease;
}
.asb-gec-results__score {
	display: flex;
	align-items: center;
	gap: 2rem;
	flex-wrap: wrap;
	padding-bottom: 2rem;
	border-bottom: 1px solid var(--ast-line);
}
.asb-gec-results__dial {
	--asb-score: 0;
	flex: none;
	width: 140px;
	height: 140px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background:
		radial-gradient(closest-side, #fff 78%, transparent 79% 100%),
		conic-gradient(var(--asb-tier-color) calc(var(--asb-score) * 1%), var(--ast-line) 0);
}
.asb-gec-results__dial-inner {
	text-align: center;
	line-height: 1;
}
.asb-gec-results__number {
	font-family: "Montserrat", sans-serif;
	font-size: 2.6rem;
	font-weight: 700;
	color: var(--ast-navy);
}
.asb-gec-results__outof {
	display: block;
	font-size: 15px;
	color: var(--ast-muted);
	margin-top: .3rem;
}
.asb-gec-results__verdict {
	flex: 1;
	min-width: 240px;
}
.asb-gec-results__tier {
	display: inline-block;
	background: var(--asb-tier-color);
	color: #fff;
	font-weight: 700;
	font-size: 15px;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: .35rem .8rem;
	border-radius: 999px;
	margin-bottom: .75rem;
}
.asb-gec-results__heading {
	font-size: 1.35rem;
	margin: 0 0 .5rem;
}
.asb-gec-results__summary {
	color: var(--ast-muted);
	margin: 0;
	font-size: 16px;
}

.asb-gec-results__breakdown,
.asb-gec-results__recs,
.asb-gec-results__cta {
	margin-top: 2rem;
}
.asb-gec-results__breakdown h3,
.asb-gec-results__recs h3,
.asb-gec-results__cta h3 {
	font-size: 1.2rem;
	margin-bottom: 1.25rem;
}
.asb-gec-results__bar-row {
	margin-bottom: 1.1rem;
}
.asb-gec-results__bar-label {
	display: flex;
	justify-content: space-between;
	font-size: 15px;
	font-weight: 600;
	color: var(--ast-navy);
	margin-bottom: .4rem;
}
.asb-gec-results__bar-pct {
	color: var(--ast-muted);
}
.asb-gec-results__bar {
	height: 10px;
	background: var(--ast-line);
	border-radius: 999px;
	overflow: hidden;
}
.asb-gec-results__bar span {
	display: block;
	height: 100%;
	border-radius: 999px;
	transition: width .6s ease;
}
.asb-gec-results__recs-intro {
	color: var(--ast-muted);
	font-size: 15px;
	margin: -.5rem 0 1.25rem;
}
.asb-gec-results__rec-list {
	list-style: none !important;
	counter-reset: rec;
	padding: 0;
	margin: 0;
	display: grid;
	gap: 1rem;
}
/* Suppress the native ordered-list marker so only the navy counter badge
   below shows. Themes (OceanWP content styles) re-enable markers via
   higher-specificity rules like `.entry-content ol li`, so force it off. */
.asb-gec-results__rec-list li {
	counter-increment: rec;
	position: relative;
	padding: 1.15rem 1.15rem 1.15rem 3.25rem;
	background: var(--ast-bg);
	border: 1px solid var(--ast-line);
	border-radius: 10px;
	list-style: none !important;
}
.asb-gec-results__rec-list li::marker {
	content: none !important;
}
.asb-gec-results__rec-list li::before {
	content: counter(rec);
	position: absolute;
	left: .95rem;
	top: 1.15rem;
	width: 1.7rem;
	height: 1.7rem;
	background: var(--ast-navy);
	color: #fff;
	border-radius: 50%;
	display: grid;
	place-items: center;
	font-size: 15px;
	font-weight: 700;
	font-family: "Montserrat", sans-serif;
}
.asb-gec-results__rec-cat {
	display: block;
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: .05em;
	font-weight: 700;
	color: var(--ast-accent-dark);
	margin-bottom: .3rem;
}
.asb-gec-results__rec-text {
	font-size: 16px;
}
.asb-gec-results__cta {
	background: var(--ast-navy);
	color: #fff;
	border-radius: var(--ast-radius);
	padding: 2rem;
	text-align: center;
}
.asb-gec-results__cta h3 {
	color: #fff;
}
.asb-gec-results__cta p {
	color: rgba(255, 255, 255, .8);
	font-size: 16px;
	margin: 0 0 1.5rem;
}
.asb-gec-results__cta-btn {
	margin: 0 auto;
}

@media (max-width: 560px) {
	.asb-gec__fields {
		grid-template-columns: 1fr;
	}
	.asb-gec-results__score {
		flex-direction: column;
		text-align: center;
	}
	.asb-gec__nav {
		flex-direction: row;
	}
	.asb-gec__btn {
		flex: 1;
		text-align: center;
	}
}
