/*
 * Public marketing pages (Home, Learn, Assess, For Employers, For
 * Professionals, About, Resources - Plan doc Phase 5). Loaded after
 * assessment.css/candidate.css/jobs.css and builds on their shared
 * shell/button/tag/pill/banner classes rather than redefining them (see
 * candidate.css's own header comment) - .accounnect-btn,
 * .accounnect-btn-primary/secondary, .accounnect-pill,
 * .accounnect-status-open/closed, .accounnect-tag(-list), and
 * .accounnect-assessment-note all come from those files. This file only
 * adds what's genuinely new: the hero, the 4-step journey, category/course
 * grids, the employer funnel, and the CTA band.
 *
 * Mobile-first: single column by default, grid/row layouts only from the
 * tablet breakpoint up - same approach assessment.css uses.
 */

.accounnect-marketing {
	color: #1a2233;
	line-height: 1.6;
}

.accounnect-marketing-section {
	max-width: 1100px;
	margin: 0 auto;
	padding: 2.5em 1em;
}

.accounnect-page-header {
	padding-bottom: 0.5em;
}

.accounnect-page-header h1 {
	font-size: 2rem;
	margin: 0 0 0.4em;
}

.accounnect-section-title {
	font-size: 1.4em;
	margin: 0 0 1em;
}

/* ---- Hero ---- */

.accounnect-hero {
	background: linear-gradient(135deg, #2b3fd6, #5865e6);
	color: #fff;
}

.accounnect-hero-compact .accounnect-hero-inner {
	padding-top: 3em;
	padding-bottom: 3em;
}

.accounnect-hero-inner {
	padding-top: 3.5em;
	padding-bottom: 3.5em;
	text-align: center;
}

.accounnect-hero-eyebrow {
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 0.85em;
	font-weight: 700;
	opacity: 0.85;
	margin: 0 0 0.75em;
}

.accounnect-hero h1 {
	font-size: 2rem;
	margin: 0 0 0.4em;
	color: #fff;
}

.accounnect-hero-tagline {
	font-size: 1.15em;
	font-weight: 700;
	margin: 0 0 0.75em;
}

.accounnect-hero-body {
	color: inherit;
	opacity: 0.92;
	max-width: 640px;
	margin: 0 auto 1.5em;
}

.accounnect-hero-ctas {
	display: flex;
	flex-direction: column;
	gap: 0.75em;
	align-items: center;
}

.accounnect-hero .accounnect-btn-secondary {
	background: rgba(255, 255, 255, 0.14);
	color: #fff;
	border: 1px solid rgba(255, 255, 255, 0.6);
}

.accounnect-hero .accounnect-btn-secondary:hover {
	background: rgba(255, 255, 255, 0.26);
}

/* ---- Journey (Home) ---- */

.accounnect-journey {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75em;
}

.accounnect-journey-step {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	text-decoration: none;
	color: inherit;
	background: #fff;
	border: 1px solid #e2e4ea;
	border-radius: 12px;
	padding: 1.25em 1em;
	width: 100%;
	max-width: 320px;
}

.accounnect-journey-step:hover {
	border-color: #b7c0f7;
}

.accounnect-journey-number {
	font-size: 1.4em;
	font-weight: 800;
	color: #2c3e91;
}

.accounnect-journey-label {
	font-weight: 700;
	margin-top: 0.2em;
}

.accounnect-journey-desc {
	font-size: 0.9em;
	color: #5a6472;
	margin-top: 0.25em;
}

.accounnect-journey-arrow {
	font-size: 1.4em;
	color: #b7c0f7;
	transform: rotate(90deg);
}

/* ---- PACE intro (Home) ---- */

.accounnect-pace-intro {
	text-align: center;
}

.accounnect-pace-brand {
	font-weight: 700;
	color: #2c3e91;
}

/* ---- CTA band ---- */

.accounnect-cta-band {
	background: #eef1ff;
	border-top: 1px solid #ccd3ff;
	border-bottom: 1px solid #ccd3ff;
}

.accounnect-cta-band-inner {
	text-align: center;
}

.accounnect-cta-band-inner h2 {
	margin: 0 0 0.5em;
}

.accounnect-cta-band-title {
	font-size: 1.2em;
	font-weight: 800;
	color: #2c3e91;
	margin: 0 0 0.5em;
}

.accounnect-pill-on-band {
	display: inline-block;
	margin: 0 0 0.75em;
}

.accounnect-cta-band-inner .accounnect-btn {
	margin-top: 0.5em;
}

/* ---- Categories / courses (Learn) ---- */

/* ---- Page intro (long-form lead paragraph, e.g. Learn page) ---- */

.accounnect-page-intro {
	max-width: 100%;
	margin-top: 0.75em;
}

.accounnect-page-intro p {
	font-size: 1.08em;
	line-height: 1.75;
	color: #3a4356;
	margin: 0 0 1em;
	text-align: justify;
	text-justify: inter-word;
	hyphens: none;
	word-break: normal;
	overflow-wrap: normal;
}

.accounnect-page-intro p:last-child {
	margin-bottom: 0;
}

.accounnect-competency-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.25em;
}

.accounnect-competency-card {
	background: #fff;
	border: 1px solid #e2e4ea;
	border-radius: 10px;
	padding: 1.5em 1.25em 1.25em;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.accounnect-competency-card:hover {
	border-color: #b7c0f7;
	box-shadow: 0 2px 10px rgba(43, 63, 214, 0.08);
}

.accounnect-competency-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.2em;
	height: 2.2em;
	border-radius: 50%;
	background: #eef0fb;
	color: #2c3e91;
	font-size: 1.3em;
	margin-bottom: 0.6em;
}

.accounnect-competency-icon::before {
	line-height: 1;
}

.accounnect-competency-icon-rupee {
	font-size: 1.15em;
	font-weight: 700;
	font-style: normal;
}

.accounnect-competency-area {
	margin: 0 0 0.4em;
	font-size: 1.05em;
	color: #1a2233;
}

.accounnect-competency-desc {
	margin: 0;
	font-size: 0.95em;
	color: #3a4356;
	text-align: justify;
	text-justify: inter-word;
	hyphens: none;
	word-break: normal;
	overflow-wrap: normal;
}

@media ( min-width: 700px ) {
	.accounnect-competency-grid {
		grid-template-columns: repeat( 2, 1fr );
	}
}

@media ( min-width: 1000px ) {
	.accounnect-competency-grid {
		grid-template-columns: repeat( 3, 1fr );
	}
}

.accounnect-course-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.25em;
}

.accounnect-course-card {
	background: #fff;
	border: 1px solid #e2e4ea;
	border-radius: 10px;
	padding: 1.25em;
}

.accounnect-course-card h3 {
	margin-top: 0;
}

.accounnect-course-meta {
	list-style: none;
	margin: 0 0 1em;
	padding: 0;
	font-size: 0.92em;
	color: #3a4356;
}

.accounnect-course-meta li {
	padding: 0.15em 0;
}

/* ---- Assessment levels (Assess) ---- */

.accounnect-assess-levels {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.25em;
}

.accounnect-assess-level {
	background: #fff;
	border: 1px solid #e2e4ea;
	border-radius: 10px;
	padding: 1.5em;
}

.accounnect-assess-level-live {
	border-color: #b7c0f7;
	box-shadow: 0 2px 10px rgba(43, 63, 214, 0.08);
}

.accounnect-assess-level h3 {
	margin: 0.5em 0 0.3em;
}

.accounnect-assess-desc {
	margin: 0 0 0.75em;
	color: #3a4356;
	text-align: justify;
	text-justify: inter-word;
	hyphens: none;
	word-break: normal;
	overflow-wrap: normal;
}

.accounnect-assess-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.4em;
	height: 2.4em;
	border-radius: 50%;
	color: #fff;
	font-size: 1.3em;
	margin-bottom: 0.6em;
}

.accounnect-assess-icon::before {
	line-height: 1;
}

.accounnect-assess-icon-foundation {
	background: linear-gradient(135deg, #22c55e, #15803d);
}

.accounnect-assess-icon-professional {
	background: linear-gradient(135deg, #3b82f6, #1d4ed8);
}

.accounnect-assess-icon-advanced {
	background: linear-gradient(135deg, #a855f7, #7e22ce);
}

.accounnect-assess-icon-jobspecific {
	background: linear-gradient(135deg, #f97316, #c2410c);
}

/* ---- Assess: one-screen layout (2 x 2 level cards) ---- */

.accounnect-page-assess .accounnect-marketing-section {
	padding-top: 1em;
	padding-bottom: 0.5em;
}

.accounnect-page-assess h1 {
	font-size: 2rem;
	margin: 0 0 0.25em;
}

.accounnect-page-assess .accounnect-page-intro {
	margin-top: 0.25em;
}

.accounnect-page-assess .accounnect-page-intro p {
	font-size: 0.95rem;
	line-height: 1.55;
	text-align: justify;
	text-justify: inter-word;
	hyphens: none;
	word-break: normal;
	overflow-wrap: normal;
}

.accounnect-page-assess .accounnect-section-title {
	margin: 0 0 0.6em;
	font-size: 0.85rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #2c3e91;
}

.accounnect-page-assess .accounnect-assess-levels {
	gap: 12px;
}

.accounnect-page-assess .accounnect-assess-level {
	display: flex;
	flex-direction: column;
	padding: 14px 16px;
}

.accounnect-assess-head {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 8px;
}

.accounnect-page-assess .accounnect-assess-icon {
	flex: 0 0 auto;
	width: 36px;
	height: 36px;
	margin: 0;
	font-size: 17px;
}

.accounnect-page-assess .accounnect-assess-icon.dashicons::before {
	font-size: 19px;
	width: 19px;
	height: 19px;
}

.accounnect-page-assess .accounnect-assess-head h3 {
	flex: 1 1 auto;
	margin: 0;
	font-size: 1.05rem;
	line-height: 1.25;
}

.accounnect-page-assess .accounnect-assess-desc {
	margin: 0 0 10px;
	font-size: 0.88rem;
	line-height: 1.5;
}

.accounnect-assess-foot {
	margin-top: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
}

.accounnect-assess-foot .accounnect-assessment-note {
	margin: 0;
	font-size: 0.85rem;
}

.accounnect-page-assess .accounnect-tag-list {
	margin-top: auto;
}

/* ---- Employer funnel (For Employers) ---- */

.accounnect-funnel {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0;
}

.accounnect-funnel-step {
	display: flex;
	flex-direction: column;
	gap: 0.2em;
	background: #fff;
	border: 1px solid #e2e4ea;
	border-radius: 12px;
	padding: 1.1em 1.25em;
	width: 100%;
	max-width: 320px;
}

.accounnect-funnel-step-title {
	font-weight: 700;
}

.accounnect-funnel-step-example {
	font-size: 0.9em;
	color: #5a6472;
	margin: 0.3em 0 0;
	text-align: justify;
	text-justify: inter-word;
	hyphens: none;
	word-break: normal;
	overflow-wrap: normal;
}

/* Arrow between two steps - stacked/pointing down on mobile (the funnel
   reads top to bottom), rotated to point right once the flow lays the
   steps out in a row from the tablet breakpoint up. Same rotate-on-mobile
   pattern as .accounnect-journey-arrow (Home page) uses. */
.accounnect-funnel-connector {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #b7c0f7;
	flex: 0 0 auto;
}

.accounnect-funnel-connector .dashicons {
	font-size: 1.6em;
	width: 1em;
	height: 1em;
	transform: rotate(90deg);
}

.accounnect-tag-list-large .accounnect-tag {
	font-size: 0.95em;
	padding: 0.5em 1em;
}

.accounnect-tag-future {
	background: #f4f4f6;
	color: #6b7280;
}

/* ---- Employer Services cubes (For Employers, 2026-09-28) ---- */

.accounnect-service-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.25em;
}

.accounnect-service-cube {
	background: #fff;
	border: 1px solid #e2e4ea;
	border-radius: 10px;
	padding: 1.5em 1.25em 1.25em;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.accounnect-service-cube:hover {
	border-color: #b7c0f7;
	box-shadow: 0 2px 10px rgba(43, 63, 214, 0.08);
}

.accounnect-service-cube-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.2em;
	height: 2.2em;
	border-radius: 50%;
	background: #eef0fb;
	color: #2c3e91;
	font-size: 1.3em;
	margin-bottom: 0.6em;
}

.accounnect-service-cube-title {
	margin: 0 0 0.4em;
	font-size: 1.05em;
	color: #1a2233;
}

.accounnect-service-cube-desc {
	margin: 0;
	font-size: 0.92em;
	color: #3a4356;
	text-align: justify;
	text-justify: inter-word;
	hyphens: none;
	word-break: normal;
	overflow-wrap: normal;
}

@media ( min-width: 700px ) {
	.accounnect-service-grid {
		grid-template-columns: repeat( 3, 1fr );
	}
}

/* ---- Benefits (For Professionals) ---- */

.accounnect-benefit-list {
	list-style: none;
	margin: 0 0 1.5em;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.6em;
}

.accounnect-benefit-item {
	background: #fff;
	border: 1px solid #e2e4ea;
	border-radius: 8px;
	padding: 0.75em 1em;
	color: #1c6b32;
	font-weight: 600;
}

/* ---- About ---- */

.accounnect-vision-statement {
	font-size: 1.3em;
	font-weight: 700;
	color: #2c3e91;
}

/* ---- About: one-screen layout (Why / Vision / Mission / People) ---- */

.accounnect-about-wrap {
	padding-top: 1.5em;
	padding-bottom: 1.5em;
}

.accounnect-about-title {
	font-size: 2rem;
	margin: 0 0 0.6em;
}

.accounnect-about-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.1em;
}

.accounnect-about-card {
	background: #fff;
	border: 1px solid #e2e4ea;
	border-radius: 10px;
	padding: 1.25em 1.4em;
}

.accounnect-about-card h2 {
	font-size: 0.85rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #2c3e91;
	margin: 0 0 0.6em;
}

.accounnect-about-card p {
	margin: 0 0 0.75em;
	font-size: 0.95rem;
	color: #3a4356;
}

.accounnect-about-card p:last-child {
	margin-bottom: 0;
}

.accounnect-about-why p {
	text-align: justify;
	text-justify: inter-word;
	hyphens: none;
	word-break: normal;
	overflow-wrap: normal;
	line-height: 1.55;
}

.accounnect-about-why p.accounnect-about-closing {
	margin-top: 0.9em;
	padding-top: 0.8em;
	border-top: 1px solid #e2e4ea;
	color: #1a2233;
	font-weight: 600;
}

.accounnect-about-side {
	display: grid;
	gap: 1.1em;
}

.accounnect-about-vision p,
.accounnect-about-mission p {
	font-size: 1.1rem;
	font-weight: 600;
	color: #1a2233;
	line-height: 1.45;
}

.accounnect-about-vision,
.accounnect-about-mission {
	border-left: 4px solid #2c3e91;
}

.accounnect-people-row {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.1em;
}

.accounnect-person {
	display: flex;
	gap: 1em;
	align-items: flex-start;
}

.accounnect-person-photo {
	flex: 0 0 72px;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	object-fit: cover;
	background: #eef0fb;
}

.accounnect-person-name {
	margin: 0;
	font-size: 1.05rem;
}

.accounnect-person-role {
	margin: 0.1em 0 0.35em;
	color: #2c3e91;
	font-weight: 600;
	font-size: 0.9rem;
}

.accounnect-person-card .accounnect-person-bio,
.accounnect-person-bio {
	margin: 0;
	font-size: 0.9rem;
}

.accounnect-person-link {
	display: inline-block;
	margin-left: 0.4em;
	padding: 0 0.4em;
	border-radius: 4px;
	background: #2c3e91;
	color: #fff;
	font-size: 0.7rem;
	font-weight: 700;
	line-height: 1.6;
	text-decoration: none;
	vertical-align: middle;
}

@media ( min-width: 900px ) {
	.accounnect-about-grid {
		grid-template-columns: 1.6fr 1fr;
		align-items: stretch;
	}

	.accounnect-about-people {
		grid-column: 1 / -1;
	}

	.accounnect-people-row {
		grid-template-columns: repeat( 2, 1fr );
	}
}

/* ---- Learn: redesigned category cards with descriptions + filter chips ---- */

.accounnect-page-learn {
	--learn-navy: #0b2d52;
	--learn-teal: #0f9aa5;
	--learn-teal-dark: #0b7f89;
	--learn-green: #6ab04c;
	--learn-border: #dde6ec;
	--learn-text: #3b4f63;
}

.accounnect-learn-hero {
	background: linear-gradient(180deg, #eaf4f6, #fff);
}

.accounnect-learn-hero-inner {
	padding-top: 2.5em;
	padding-bottom: 1.2em;
}

.accounnect-page-learn .accounnect-hero-eyebrow {
	color: var(--learn-teal-dark);
	opacity: 1;
}

.accounnect-page-learn .accounnect-learn-hero h1 {
	color: var(--learn-navy);
	font-size: 2rem;
	line-height: 1.15;
	margin: 0 0 0.4em;
}

.accounnect-page-learn .accounnect-learn-hero p:not(.accounnect-hero-eyebrow) {
	max-width: 760px;
	color: var(--learn-text);
	text-align: left;
	hyphens: none;
	margin: 0;
}

.accounnect-learn-body {
	padding-top: 1.2em;
}

.accounnect-learn-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	margin-bottom: 1.2em;
}

.accounnect-learn-chip {
	font: inherit;
	font-size: 0.82em;
	font-weight: 600;
	background: #eaf4f6;
	color: var(--learn-navy);
	border: 0;
	border-radius: 999px;
	padding: 0.45em 1.1em;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease;
}

.accounnect-learn-chip:hover {
	background: #d4ebee;
}

.accounnect-learn-chip.is-active {
	background: var(--learn-navy);
	color: #fff;
}

.accounnect-learn-chip:focus-visible {
	outline: 3px solid #7fb3d5;
	outline-offset: 2px;
}

.accounnect-page-learn .accounnect-competency-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1em;
}

.accounnect-page-learn .accounnect-competency-card {
	--group: var(--learn-navy);
	--group-tint: #eaf4f6;
	background: #fff;
	border: 1px solid var(--learn-border);
	border-top: 4px solid var(--group);
	border-radius: 12px;
	padding: 1.1em 1.2em;
	text-align: left;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.accounnect-page-learn .accounnect-competency-card[hidden] {
	display: none;
}

.accounnect-page-learn .accounnect-competency-card:hover {
	box-shadow: 0 10px 24px rgba(11, 45, 82, 0.1);
	transform: translateY(-2px);
}

.accounnect-page-learn .accounnect-group-tax {
	--group: var(--learn-teal);
	--group-tint: #e3f4f5;
}

.accounnect-page-learn .accounnect-group-reporting {
	--group: #3fa57a;
	--group-tint: #e4f3ea;
}

.accounnect-page-learn .accounnect-group-professional {
	--group: var(--learn-green);
	--group-tint: #eef6e8;
}

.accounnect-competency-head {
	display: flex;
	align-items: center;
	gap: 0.7em;
	margin-bottom: 0.55em;
}

.accounnect-page-learn .accounnect-competency-icon {
	flex: none;
	width: 36px;
	height: 36px;
	border-radius: 10px;
	background: var(--group-tint);
	color: var(--group);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	font-size: 1.1rem;
}

.accounnect-page-learn .accounnect-competency-icon.dashicons::before {
	font-size: 20px;
	width: 20px;
	height: 20px;
	line-height: 20px;
}

.accounnect-page-learn .accounnect-competency-area {
	font-size: 1rem;
	line-height: 1.3;
	margin: 0;
	color: var(--learn-navy);
}

.accounnect-page-learn .accounnect-competency-desc {
	display: block;
	overflow: visible;
	margin: 0;
	font-size: 0.88em;
	line-height: 1.55;
	color: var(--learn-text);
	text-align: left;
	hyphens: none;
}

@media ( min-width: 640px ) {
	.accounnect-page-learn .accounnect-competency-grid {
		grid-template-columns: repeat( 2, 1fr );
	}
}

@media ( min-width: 1000px ) {
	.accounnect-page-learn .accounnect-competency-grid {
		grid-template-columns: repeat( 3, 1fr );
	}

	.accounnect-page-learn .accounnect-learn-hero h1 {
		font-size: 2.6rem;
	}
}

/* ---- Resources ---- */

.accounnect-resource-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1em;
}

.accounnect-resource-category {
	background: #fff;
	border: 1px solid #e2e4ea;
	border-radius: 10px;
	padding: 1.25em;
}

.accounnect-resource-category h3 {
	margin: 0 0 0.3em;
}

/* ---- Tablet / desktop ---- */

@media (min-width: 700px) {
	.accounnect-hero h1,
	.accounnect-page-header h1 {
		font-size: 2.6rem;
	}

	.accounnect-hero-ctas {
		flex-direction: row;
		justify-content: center;
		flex-wrap: wrap;
	}

	.accounnect-journey {
		flex-direction: row;
		align-items: stretch;
		justify-content: center;
	}

	.accounnect-journey-arrow {
		transform: none;
		align-self: center;
	}

	.accounnect-course-grid {
		grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	}

	.accounnect-assess-levels {
		grid-template-columns: repeat(2, 1fr);
	}

	.accounnect-funnel {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		align-items: stretch;
		gap: 1.25em 0;
	}

	.accounnect-funnel-step {
		flex: 1 1 200px;
		max-width: 220px;
	}

	.accounnect-funnel-connector .dashicons {
		transform: rotate(0deg);
	}

	.accounnect-benefit-list {
		grid-template-columns: repeat(2, 1fr);
	}

	.accounnect-resource-grid {
		grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	}
}

@media (min-width: 1000px) {
	.accounnect-funnel-step {
		max-width: 240px;
	}
}

.accounnect-assess-foot .accounnect-btn {
	padding: 0.5em 0.9em;
	font-size: 0.88em;
}

/* ==== Home page redesign: two-column hero, score card, stats, icon journey ====
   Everything is scoped to .accounnect-page-home so the other marketing
   pages (which share .accounnect-hero etc.) keep their current look. */

.accounnect-page-home {
	--home-navy: #0b2d52;
	--home-teal: #0f9aa5;
	--home-teal-dark: #0b7f89;
	--home-green: #6ab04c;
	--home-tint: #eaf4f6;
	--home-border: #dde6ec;
	--home-text: #3b4f63;
}

.accounnect-page-home .accounnect-home-hero {
	background: linear-gradient(180deg, var(--home-tint), #fff);
	color: var(--home-navy);
}

.accounnect-page-home .accounnect-home-hero-inner {
	display: flex;
	flex-direction: column;
	gap: 2.5em;
	align-items: center;
	text-align: left;
	padding-top: 3em;
	padding-bottom: 2em;
}

.accounnect-page-home .accounnect-home-hero-copy,
.accounnect-page-home .accounnect-home-hero-visual {
	width: 100%;
	min-width: 0;
}

.accounnect-page-home .accounnect-hero-eyebrow {
	color: var(--home-teal-dark);
	opacity: 1;
}

.accounnect-page-home .accounnect-home-hero h1 {
	color: var(--home-navy);
	font-size: 2.2rem;
	line-height: 1.12;
}

.accounnect-page-home .accounnect-hero-tagline {
	color: var(--home-teal-dark);
}

.accounnect-page-home .accounnect-hero-body {
	color: var(--home-text);
	opacity: 1;
	margin-left: 0;
	margin-right: 0;
	max-width: 520px;
}

.accounnect-page-home .accounnect-hero-ctas {
	align-items: stretch;
	justify-content: flex-start;
}

.accounnect-page-home .accounnect-btn-primary {
	background: var(--home-navy);
	color: #fff;
}

.accounnect-page-home .accounnect-btn-primary:hover {
	background: #123e6e;
}

.accounnect-page-home .accounnect-hero .accounnect-btn-secondary {
	background: #fff;
	color: var(--home-navy);
	border: 1px solid var(--home-teal);
}

.accounnect-page-home .accounnect-hero .accounnect-btn-secondary:hover {
	background: var(--home-tint);
}

/* Score card */
.accounnect-scorecard {
	width: 100%;
	max-width: 420px;
	margin: 0 auto;
	background: #fff;
	border: 1px solid var(--home-border);
	border-radius: 16px;
	padding: 1.5em;
	box-shadow: 0 18px 40px rgba(11, 45, 82, 0.12);
}

.accounnect-scorecard-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1.1em;
}

.accounnect-scorecard-title {
	font-weight: 700;
	color: var(--home-navy);
}

.accounnect-scorecard-badge {
	font-size: 0.75em;
	font-weight: 600;
	color: var(--home-teal-dark);
	background: var(--home-tint);
	padding: 0.25em 0.8em;
	border-radius: 999px;
}

.accounnect-scorecard-main {
	display: flex;
	align-items: center;
	gap: 1.2em;
	margin-bottom: 1.3em;
}

.accounnect-scorecard-main p {
	margin: 0;
	font-size: 0.9em;
	color: var(--home-text);
	line-height: 1.5;
}

.accounnect-scorecard-ring {
	flex: none;
	width: 96px;
	height: 96px;
	border-radius: 50%;
	background: conic-gradient(var(--home-teal) 0 72%, #e6edf2 72% 100%);
	display: flex;
	align-items: center;
	justify-content: center;
}

.accounnect-scorecard-ring span {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--home-navy);
}

.accounnect-scorecard-bars {
	display: grid;
	gap: 0.8em;
}

.accounnect-scorecard-bars div {
	display: grid;
	grid-template-columns: 1fr auto;
	row-gap: 0.3em;
	font-size: 0.85em;
}

.accounnect-scorecard-bars em {
	font-style: normal;
	color: #6b7f90;
}

.accounnect-scorecard-bars i {
	grid-column: 1 / -1;
	display: block;
	height: 8px;
	border-radius: 4px;
	background: linear-gradient(90deg, var(--home-teal) var(--w), #e6edf2 var(--w));
}

.accounnect-scorecard-bars div:first-child i {
	background: linear-gradient(90deg, var(--home-navy) var(--w), #e6edf2 var(--w));
}

.accounnect-scorecard-bars div:last-child i {
	background: linear-gradient(90deg, var(--home-green) var(--w), #e6edf2 var(--w));
}

/* Stats row */
.accounnect-page-home .accounnect-home-stats {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1em;
	padding-top: 1em;
	padding-bottom: 1.5em;
}

.accounnect-home-stat {
	background: var(--home-navy, #0b2d52);
	color: #fff;
	text-align: center;
	border-radius: 12px;
	padding: 1.1em 1em;
}

.accounnect-home-stat strong {
	display: block;
	font-size: 2.1rem;
	line-height: 1.1;
}

.accounnect-home-stat span {
	font-size: 0.9em;
	opacity: 0.85;
}

/* Journey cards with icons */
.accounnect-page-home .accounnect-journey {
	gap: 1.25em;
}

.accounnect-page-home .accounnect-journey-step {
	align-items: flex-start;
	text-align: left;
	border-color: var(--home-border);
	border-radius: 14px;
	padding: 1.4em;
	max-width: none;
	flex: 1 1 0;
	transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.accounnect-page-home .accounnect-journey-step:hover {
	border-color: var(--home-teal);
	box-shadow: 0 10px 24px rgba(11, 45, 82, 0.1);
	transform: translateY(-2px);
}

.accounnect-journey-icon {
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: var(--home-tint, #eaf4f6);
	color: var(--home-navy, #0b2d52);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 0.8em;
}

.accounnect-page-home .accounnect-journey-number {
	font-size: 0.8em;
	font-weight: 700;
	color: var(--home-teal-dark);
}

.accounnect-page-home .accounnect-journey-label {
	font-size: 1.2em;
	color: var(--home-navy);
}

.accounnect-page-home .accounnect-journey-desc {
	color: var(--home-text);
}

.accounnect-page-home .accounnect-section-title,
.accounnect-page-home .accounnect-pace-intro h2 {
	color: var(--home-navy);
	text-align: center;
}

.accounnect-page-home .accounnect-pace-brand {
	color: var(--home-teal-dark);
}

/* Assessment CTA band picks up the same palette */
.accounnect-page-home .accounnect-cta-band {
	background: var(--home-tint);
	border-color: #c9e0e5;
}

.accounnect-page-home .accounnect-cta-band-title {
	color: var(--home-teal-dark);
}

@media (min-width: 700px) {
	.accounnect-page-home .accounnect-home-hero-inner {
		flex-direction: row;
		gap: 3em;
		padding-top: 4em;
		padding-bottom: 2.5em;
	}

	.accounnect-page-home .accounnect-home-hero-copy,
	.accounnect-page-home .accounnect-home-hero-visual {
		flex: 1 1 0;
	}

	.accounnect-page-home .accounnect-home-hero h1 {
		font-size: 3rem;
	}

	.accounnect-page-home .accounnect-home-stats {
		grid-template-columns: repeat(3, 1fr);
	}

	.accounnect-page-home .accounnect-journey {
		flex-direction: row;
		align-items: stretch;
	}
}

@media (max-width: 699px) {
	.accounnect-page-home .accounnect-hero-ctas .accounnect-btn {
		width: 100%;
	}
}

/* =========================================================
   0.9.3 polish: Assess, Employers, About
   ========================================================= */

/* ---- Assess: even columns, muted coming-soon cards ---- */
.accounnect-page-assess .accounnect-assess-levels {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	align-items: stretch;
}
.accounnect-page-assess .accounnect-assess-level {
	padding: 24px;
	border: 1px solid #dde6ec;
	border-radius: 16px;
	background: #fff;
	height: 100%;
	box-sizing: border-box;
}
.accounnect-page-assess .accounnect-assess-level-live {
	border: 2px solid #0f9aa5;
	box-shadow: 0 14px 34px rgba(11, 45, 82, 0.12);
}
.accounnect-page-assess .accounnect-assess-level-soon {
	border: 1px dashed #c3d0d9;
	background: #f6f9fb;
	box-shadow: none;
}
.accounnect-page-assess .accounnect-assess-level-soon h3,
.accounnect-page-assess .accounnect-assess-level-soon .accounnect-assess-desc {
	color: #5d7285;
}
.accounnect-page-assess .accounnect-assess-level h3 {
	color: #0b2d52;
	letter-spacing: 0.02em;
}
.accounnect-page-assess .accounnect-assess-icon-foundation { background: #e3f4f5; color: #0b7f89; }
.accounnect-page-assess .accounnect-assess-icon-professional,
.accounnect-page-assess .accounnect-assess-icon-advanced,
.accounnect-page-assess .accounnect-assess-icon-jobspecific { background: #e6edf2; color: #6b7f90; }
@media (max-width: 760px) {
	.accounnect-page-assess .accounnect-assess-levels { grid-template-columns: 1fr; }
}

/* ---- About: icon tiles ---- */
.accounnect-about-card h2 {
	display: flex;
	align-items: center;
	gap: 10px;
	color: #0b2d52;
}
.accounnect-about-icon.dashicons {
	flex: none;
	width: 36px;
	height: 36px;
	border-radius: 10px;
	background: #0b2d52;
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
}
.accounnect-about-icon.dashicons::before { font-size: 20px; width: 20px; height: 20px; line-height: 20px; }
.accounnect-about-vision .accounnect-about-icon { background: #0f9aa5; }
.accounnect-about-mission .accounnect-about-icon { background: #6ab04c; color: #0b2d52; }

/* ---- Employers ---- */
.accounnect-page-employers .accounnect-emp-hero,
.accounnect-emp-hero {
	background: linear-gradient(180deg, #eaf4f6, #fff);
	color: #0b2d52;
	padding: 56px 24px 32px;
}
.accounnect-emp-hero h1 { color: #0b2d52; }
.accounnect-emp-hero p { color: #3b4f63; }
.accounnect-emp-hero-inner {
	display: flex;
	flex-wrap: wrap;
	gap: 48px;
	align-items: center;
	max-width: 1120px;
	margin: 0 auto;
}
.accounnect-emp-hero-copy { flex: 1 1 440px; min-width: 0; }
.accounnect-emp-hero-visual { flex: 1 1 340px; min-width: 0; display: flex; justify-content: center; }
.accounnect-emp-card {
	width: 100%;
	max-width: 400px;
	background: #fff;
	border: 1px solid #dde6ec;
	border-radius: 16px;
	padding: 22px;
	box-shadow: 0 18px 40px rgba(11, 45, 82, 0.12);
}
.accounnect-emp-card-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; font-weight: 700; color: #0b2d52; }
.accounnect-emp-card-person { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.accounnect-emp-avatar { width: 48px; height: 48px; border-radius: 50%; background: #0b2d52; color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; flex: none; }
.accounnect-emp-score { margin-left: auto; font-size: 13px; font-weight: 700; color: #2f6f4e; background: #e4f3ea; padding: 5px 10px; border-radius: 8px; }
.accounnect-emp-skills { display: flex; gap: 8px; flex-wrap: wrap; }
.accounnect-emp-skills span { font-size: 12px; font-weight: 600; background: #eaf4f6; color: #0b2d52; padding: 5px 11px; border-radius: 999px; }

.accounnect-funnel.accounnect-funnel-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	align-items: stretch;
}
.accounnect-funnel-grid .accounnect-funnel-step {
	background: #fff;
	border: 1px solid #dde6ec;
	border-radius: 14px;
	padding: 22px;
	width: auto;
	max-width: none;
	margin: 0;
}
.accounnect-funnel-grid .accounnect-funnel-connector { display: none; }
.accounnect-funnel-num {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: #0b2d52;
	color: #fff;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 12px;
}
.accounnect-funnel-grid .accounnect-funnel-step:nth-child(3n+2) .accounnect-funnel-num { background: #0f9aa5; }
.accounnect-funnel-grid .accounnect-funnel-step:nth-child(3n) .accounnect-funnel-num { background: #6ab04c; color: #0b2d52; }
.accounnect-funnel-grid .accounnect-funnel-step-title { color: #0b2d52; font-weight: 700; font-size: 1.1rem; }
@media (max-width: 900px) { .accounnect-funnel.accounnect-funnel-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .accounnect-funnel.accounnect-funnel-grid { grid-template-columns: 1fr; } }

.accounnect-page-employers .accounnect-cta-band,
.accounnect-cta-band {
	background: transparent;
}
.accounnect-cta-band-inner {
	background: #0b2d52;
	color: #fff;
	border-radius: 18px;
	padding: 36px 32px;
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	align-items: center;
	justify-content: space-between;
	max-width: 1120px;
	margin: 0 auto;
}
.accounnect-cta-band-inner h2,
.accounnect-cta-band-inner p { color: #fff; margin: 0 0 6px; }
.accounnect-cta-band-inner .accounnect-btn-primary { background: #6ab04c; color: #0b2d52; border-color: #6ab04c; font-weight: 700; }
