/* WorkScout Platform — "WorkScout content page" template, mobile first.
   Colours, buttons and the search form come from home.css (loaded first). */

/* ---------- Hero band (homepage style) ---------- */
.wsp-phero {
	position: relative;
	overflow: hidden;
	background: var(--wsp-sky);
}

.wsp-phero__in {
	position: relative;
	z-index: 1;
	max-width: 1232px;
	margin: 0 auto;
	padding: 36px 16px 40px;
}

.wsp-phero .wsp-phero__title {
	max-width: 760px;
	margin: 0;
	color: var(--wsp-ink);
	font-weight: 700;
	font-size: 30px;
	line-height: 1.15;
	letter-spacing: -0.01em;
	text-transform: none;
}

.wsp-phero__lead {
	max-width: 640px;
	margin: 12px 0 0;
	color: var(--wsp-text);
	font-size: 16px;
	line-height: 1.55;
}

/* Breadcrumb NavXT list */
.wsp-phero__crumbs { margin: 0 0 14px; }

.wsp-phero__crumbs ul {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--wsp-muted);
	font-size: 13px;
	line-height: 1.4;
}

.wsp-phero__crumbs li { margin: 0; padding: 0; list-style: none; }
.wsp-phero__crumbs li + li::before { content: "\203A"; margin: 0 8px; color: #9aa5b1; }
.wsp-phero__crumbs a { color: var(--wsp-action); text-decoration: none; }
.wsp-phero__crumbs a:hover { text-decoration: underline; }

@media (min-width: 1025px) {
	.wsp-phero__in { padding: 64px 16px 72px; }
	.wsp-phero .wsp-phero__title { font-size: 48px; line-height: 1.1; }
	.wsp-phero__lead { font-size: 17px; }

	/* Same navy shape as the homepage hero, a little narrower. */
	.wsp-phero::after {
		content: "";
		position: absolute;
		top: 0;
		right: -8%;
		width: 30%;
		height: 100%;
		background: var(--wsp-ink);
		border-radius: 0 0 0 200px;
		z-index: 0;
	}
}

/* ---------- Readable content column ---------- */
.wsp-page {
	display: block;
	max-width: 760px;
	margin: 0 auto;
	padding: 40px 16px 56px;
	box-sizing: content-box;
}

.wsp-page--wide { max-width: 1200px; }

@media (min-width: 1025px) {
	.wsp-page { padding: 64px 16px 80px; }
}

.wsp-page__body {
	color: var(--wsp-text);
	font-size: 16px;
	line-height: 1.75;
	overflow-wrap: break-word;
}

.wsp-page__body > :first-child { margin-top: 0; }
.wsp-page__body > :last-child { margin-bottom: 0; }

.wsp-page__body p { margin: 0 0 16px; }

/* Elementor text widgets inside this template follow the page's type and
   colours rather than Elementor's default kit (grey text). */
.wsp-page__body .elementor-widget-text-editor { color: inherit; font-family: inherit; font-size: inherit; line-height: inherit; }
.wsp-page__body .elementor-widget-text-editor > :first-child,
.wsp-page__body .elementor-widget-text-editor .elementor-widget-container > :first-child { margin-top: 0; }

.wsp-page__body h2,
.wsp-page__body h3,
.wsp-page__body h4 {
	color: var(--wsp-ink);
	font-weight: 700;
	letter-spacing: normal;
	text-transform: none;
}

.wsp-page__body h2 { margin: 40px 0 12px; font-size: 22px; line-height: 1.3; }
.wsp-page__body h3 { margin: 28px 0 8px; font-size: 18px; line-height: 1.35; }
.wsp-page__body h4 { margin: 24px 0 8px; font-size: 16px; line-height: 1.4; }

@media (min-width: 1025px) {
	.wsp-page__body { font-size: 17px; }
	.wsp-page__body h2 { font-size: 26px; }
	.wsp-page__body h3 { font-size: 20px; }
}

.wsp-page__body ul,
.wsp-page__body ol { margin: 0 0 20px; padding-left: 1.4em; }
.wsp-page__body ul { list-style: disc; }
.wsp-page__body ol { list-style: decimal; }
.wsp-page__body li { margin: 0 0 6px; padding: 0; line-height: 1.65; list-style: inherit; }
.wsp-page__body li::marker { color: var(--wsp-action); }

.wsp-page__body a { color: var(--wsp-action); text-decoration: underline; text-underline-offset: 2px; }
.wsp-page__body a:hover { color: var(--wsp-action-dark); }
.wsp-page__body a:focus-visible { outline: 3px solid var(--wsp-action); outline-offset: 2px; }

.wsp-page__body strong { color: var(--wsp-ink); }

.wsp-page__body blockquote {
	margin: 24px 0;
	padding: 16px 20px;
	border: 0;
	border-left: 4px solid var(--wsp-brand);
	border-radius: 0 12px 12px 0;
	background: var(--wsp-sky);
	color: var(--wsp-ink);
	font-style: normal;
}

.wsp-page__body hr { margin: 32px 0; border: 0; border-top: 1px solid var(--wsp-line); }

/* Tables scroll sideways on small screens instead of breaking the layout. */
.wsp-page__body .wp-block-table { margin: 0 0 24px; overflow-x: auto; }

.wsp-page__body table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
	line-height: 1.5;
}

.wsp-page__body th,
.wsp-page__body td { padding: 10px 12px; border: 1px solid var(--wsp-line); text-align: left; vertical-align: top; }
.wsp-page__body th { background: var(--wsp-sky); color: var(--wsp-ink); }

.wsp-page__body img { max-width: 100%; height: auto; }

/* ---------- Closing band: job search ---------- */
.wsp-pcta { padding: 0 0 48px; background: #fff; }

.wsp-pcta__in { max-width: 1232px; margin: 0 auto; padding: 0 16px; }

.wsp-pcta__card {
	display: grid;
	gap: 20px;
	padding: 28px 20px;
	border-radius: 20px;
	background: var(--wsp-ink);
}

.wsp-pcta .wsp-pcta__title {
	margin: 0 0 8px;
	color: #fff;
	font-weight: 700;
	font-size: 24px;
	line-height: 1.25;
	letter-spacing: normal;
	text-transform: none;
}

.wsp-pcta__lead { margin: 0; color: #c5d3e0; font-size: 15px; line-height: 1.55; }

.wsp-pcta__search { display: grid; gap: 14px; justify-items: start; }
.wsp-pcta__search .wsp-search { width: 100%; box-sizing: border-box; }

.wsp-pcta__link { color: #fff; font-weight: 600; font-size: 15px; text-decoration: none; }
.wsp-pcta__link:hover { color: #fff; text-decoration: underline; }
.wsp-pcta__link:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

@media (min-width: 1025px) {
	.wsp-pcta { padding: 0 0 80px; }
	.wsp-pcta__card {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr);
		align-items: center;
		gap: 48px;
		padding: 48px;
	}
	.wsp-pcta .wsp-pcta__title { font-size: 32px; }
	.wsp-pcta__lead { font-size: 16px; }
}

/* Elementor Toggle (FAQ) inside this template: same cards as the site's other FAQs. */
.wsp-page__body .elementor-toggle { display: grid; gap: 8px; max-width: 860px; }
.wsp-page__body .elementor-toggle .elementor-toggle-item { border: 1px solid var(--wsp-line); border-radius: 12px; background: #fff; }
.wsp-page__body .elementor-toggle .elementor-tab-title { display: flex; gap: 10px; align-items: baseline; padding: 14px 16px; border: 0; color: var(--wsp-ink); font-weight: 600; font-size: 16px; line-height: 1.4; }
.wsp-page__body .elementor-toggle .elementor-tab-title a { color: inherit; text-decoration: none; }
.wsp-page__body .elementor-toggle .elementor-tab-title:hover,
.wsp-page__body .elementor-toggle .elementor-tab-title.elementor-active { color: var(--wsp-action); }
.wsp-page__body .elementor-toggle .elementor-tab-title:focus-visible { outline: 3px solid var(--wsp-action); outline-offset: 2px; border-radius: 12px; }
.wsp-page__body .elementor-toggle .elementor-toggle-icon,
.wsp-page__body .elementor-toggle .elementor-tab-title.elementor-active a,
.wsp-page__body .elementor-toggle .elementor-tab-title.elementor-active .elementor-toggle-icon { color: var(--wsp-action); }
.wsp-page__body .elementor-toggle .elementor-tab-content { padding: 0 16px 16px; border: 0; color: var(--wsp-text); }
.wsp-page__body .elementor-toggle .elementor-tab-content p:last-child { margin-bottom: 0; }