/**
 * AppCurate UI: the sections added during the brand-review work.
 *
 * Kept out of style.css so the Divi child stylesheet stays what it was, and
 * enqueued from functions.php with dh_asset_ver() for cache busting rather than
 * a raw <link> in a template.
 *
 * Contents
 *   1. The Commercialisation Library - hub masthead, read time, email capture
 *   2. Jobs board
 *   3. About page - founding story
 *   4. Team member modal
 *   5. Job application form
 *   6. Link decoration on button-shaped anchors
 *   7. Shared page rhythm - top spacing and section bands
 */

/* =========================================================================
   The Commercialisation Library
   -------------------------------------------------------------------------
   Gaps 2, 4, 5 and 14 from the brand review. Colours are the ones already in
   use: the #7D6FE0 -> #009FE3 button gradient from newhome.css, #009FE3 for
   accents and #001E6E from the footer.
   ====================================================================== */

/* --- Gap 2: the hub masthead ------------------------------------------- */

/* No padding-top: the site's own .container already contributes the 58px that
   every standard page opens with, and stacking another 54px on top of it was
   what made these pages start lower than the rest of the site. */
.hubmasthead {
	max-width: 760px;
	margin: 0 auto 46px;
	text-align: center;
	font-family: 'Noto Sans', sans-serif;
}
.hubmasthead__name {
	margin: 0 0 14px;
	font-size: 46px;
	line-height: 1.12;
	font-weight: 700;
	color: #001E6E;
}
.hubmasthead__tagline {
	margin: 0 auto;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.6;
	color: #3d4a63;
}
.hubmasthead__pills {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin: 30px 0 0;
	padding: 0;
	list-style: none;
}
.hubmasthead__pills li {
	margin: 0;
	padding: 0;
	list-style: none;
}
.hubmasthead__pill {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 9px 18px;
	border: 1px solid rgba(0, 30, 110, 0.16);
	border-radius: 999px;
	background: #fff;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.2;
	color: #001E6E;
	text-decoration: none;
	transition: border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}
.hubmasthead__pill:hover,
.hubmasthead__pill:focus-visible {
	border-color: transparent;
	background: #7D6FE0;
	color: #fff;
}
.hubmasthead__pill.is-active {
	border-color: transparent;
	background: linear-gradient(90deg, #7D6FE0 0%, #009FE3 100%);
	color: #fff;
}

/* --- Gap 14: read time and the author's bio ---------------------------- */

.authorrow .readtime {
	position: relative;
	margin-left: 16px;
	padding-left: 17px;
	white-space: nowrap;
}
/* A dot rather than a pipe: the same separator the reference sites use. */
.authorrow .readtime::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 4px;
	height: 4px;
	margin-top: -2px;
	border-radius: 50%;
	background: currentColor;
	opacity: 0.45;
}
.authorrow .authorbio {
	margin: 7px 0 0;
	max-width: 560px;
	font-size: 14px;
	line-height: 1.55;
	color: #55617a;
}

/* --- Gap 4: email capture --------------------------------------------- */

.newsletterbox {
	margin: 0 auto;
	max-width: 820px;
	padding: 34px 38px;
	border: 1px solid rgba(0, 159, 227, 0.22);
	border-radius: 18px;
	background: linear-gradient(180deg, #F4FBFF 0%, #FFFFFF 100%);
	font-family: 'Noto Sans', sans-serif;
}
.newsletterbox__heading {
	margin: 0 0 8px;
	font-size: 24px;
	line-height: 1.25;
	font-weight: 700;
	color: #001E6E;
}
.newsletterbox__sub {
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: #4a5670;
}
.newsletterform {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 20px;
}
.newsletterbox .newsletterform__input {
	flex: 1 1 260px;
	min-width: 0;
	height: 50px;
	padding: 0 18px;
	text-indent: 0;
	border: 1px solid rgba(0, 30, 110, 0.18);
	border-radius: 10px;
	background: #fff;
	font-family: inherit;
	font-size: 15px;
	color: #001E6E;
}
.newsletterform__input:focus {
	outline: none;
	border-color: #009FE3;
	box-shadow: 0 0 0 3px rgba(0, 159, 227, 0.16);
}
.newsletterform__button {
	flex: 0 0 auto;
	height: 50px;
	padding: 0 28px;
	border: 0;
	border-radius: 10px;
	background: linear-gradient(90deg, #7D6FE0 0%, #009FE3 100%);
	font-family: inherit;
	font-size: 15px;
	font-weight: 600;
	color: #fff;
	cursor: pointer;
	transition: filter 0.18s ease;
}
.newsletterform__button:hover:not(:disabled) {
	filter: brightness(1.07);
}
.newsletterform__button:disabled {
	opacity: 0.6;
	cursor: default;
}
/* Visually hidden, still read aloud. The theme does not define
   .screen-reader-text, so relying on it printed "Your email address" as visible
   text above the field on every page the section appears. */
.newsletterform__srlabel {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Honeypot: off-screen rather than display:none, which some bots detect. */
.newsletterform__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
.newsletterform__message {
	flex: 1 1 100%;
	margin: 0;
	min-height: 20px;
	font-size: 14px;
	line-height: 1.45;
}
.newsletterform__message.is-ok {
	color: #0f7a4f;
}
.newsletterform__message.is-error {
	color: #b4232b;
}
.newsletterform.is-done .newsletterform__input,
.newsletterform.is-done .newsletterform__button {
	display: none;
}

/* --- the signup as its own band, below the article -------------------- */

/* It used to sit inside .fullcontent, which read as the last paragraph of the
   piece. Its own section, with a tinted ground, makes the ask deliberate. */
/* 70px top and bottom, the same rhythm .contact-sec and .team-sec use, so the
   band sits identically on every page that prints it. */
.newslettersec {
	padding: 70px 0;
	background: #F7FBFE;
	border-top: 1px solid rgba(0, 30, 110, 0.08);
}
.newslettersec .newsletterbox {
	margin: 0 auto;
}

@media (max-width: 860px) {
	.hubmasthead {
		margin-bottom: 34px;
	}
	.hubmasthead__name {
		font-size: 34px;
	}
	.hubmasthead__tagline {
		font-size: 16px;
	}
	.newsletterbox {
		padding: 26px 22px;
		border-radius: 14px;
	}
	.newsletterbox__heading {
		font-size: 21px;
	}
	.newsletterform__button {
		flex: 1 1 100%;
	}
	.authorrow .authorbio {
		font-size: 13px;
	}
}

@media (max-width: 520px) {
	.hubmasthead__name {
		font-size: 28px;
	}
	.hubmasthead__pill {
		padding: 8px 14px;
		font-size: 14px;
	}
	.authorrow .readtime {
		margin-left: 11px;
		padding-left: 12px;
	}
}

/* =========================================================================
   Jobs board (gap 16)
   ====================================================================== */

.joblist {
	max-width: 880px;
	margin: 0 auto;
	font-family: 'Noto Sans', sans-serif;
}
.joblist__heading {
	max-width: 880px;
	margin: 52px auto 18px;
	font-family: 'Noto Sans', sans-serif;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #8b94a7;
}
.jobcard {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 22px 26px;
	margin-bottom: 14px;
	border: 1px solid rgba(0, 30, 110, 0.12);
	border-radius: 14px;
	background: #fff;
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.jobcard:hover {
	border-color: rgba(0, 159, 227, 0.5);
	box-shadow: 0 4px 18px rgba(0, 30, 110, 0.07);
}
.jobcard--featured {
	border-left: 4px solid #009FE3;
}
.jobcard--closed {
	opacity: 0.62;
}
.jobcard--closed:hover {
	border-color: rgba(0, 30, 110, 0.12);
	box-shadow: none;
}
.jobcard__main {
	min-width: 0;
}
.jobcard__company {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 5px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: #009FE3;
}
.jobcard__flag {
	padding: 2px 8px;
	border-radius: 999px;
	background: rgba(125, 111, 224, 0.14);
	font-size: 11px;
	letter-spacing: 0.04em;
	color: #5b4fd0;
}
.jobcard__title {
	margin: 0 0 9px;
	font-size: 21px;
	line-height: 1.3;
	font-weight: 700;
}
.jobcard__title a {
	color: #001E6E;
	text-decoration: none;
}
.jobcard__title a:hover {
	color: #009FE3;
}
.jobcard__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 7px 18px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
	color: #5c6780;
}
.jobcard__meta li {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
}
.jobcard__meta li + li::before {
	content: "";
	position: absolute;
	left: -10px;
	top: 50%;
	width: 3px;
	height: 3px;
	margin-top: -1px;
	border-radius: 50%;
	background: currentColor;
	opacity: 0.5;
}
.jobcard__action {
	flex: 0 0 auto;
	text-align: right;
}
.jobcard__button {
	display: inline-block;
	padding: 11px 22px;
	border-radius: 10px;
	background: linear-gradient(90deg, #7D6FE0 0%, #009FE3 100%);
	font-family: 'Noto Sans', sans-serif;
	font-size: 15px;
	font-weight: 600;
	color: #fff;
	text-decoration: none;
	transition: filter 0.18s ease;
}
.jobcard__button:hover {
	filter: brightness(1.07);
	color: #fff;
}
.jobcard__button--lg {
	padding: 15px 34px;
	font-size: 16px;
}
.jobcard__closes,
.jobcard__closed {
	display: block;
	margin-top: 8px;
	font-size: 13px;
	color: #8b94a7;
}
.jobcard__closed {
	margin-top: 0;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.07em;
}
.jobsempty {
	max-width: 620px;
	margin: 0 auto;
	padding: 44px 30px;
	border: 1px dashed rgba(0, 30, 110, 0.2);
	border-radius: 16px;
	text-align: center;
	font-family: 'Noto Sans', sans-serif;
}
.jobsempty h2 {
	margin: 0 0 10px;
	font-size: 23px;
	color: #001E6E;
}
.jobsempty p {
	margin: 0 0 18px;
	font-size: 15px;
	line-height: 1.6;
	color: #4a5670;
}
.jobsempty p:last-child {
	margin-bottom: 0;
}

/* --- a single role ----------------------------------------------------- */

/* Self-contained: this page used to borrow .articledtpage / .articlewrapper
   from single.php, whose rules live in an inline <style> block in that file and
   so never loaded here. */

/* Divi's sidebar divider, hidden the same way .blogpage and .single-post do. */
#main-content.jobsinglepage .container::before {
	display: none;
}
.jobsinglepage {
	font-family: 'Noto Sans', sans-serif;
}
.jobsingle,
.jobcrumbs {
	max-width: 820px;
	margin-left: auto;
	margin-right: auto;
}
.jobcrumbs ol {
	display: flex;
	flex-wrap: wrap;
	margin: 0 0 26px;
	padding: 0;
	list-style: none;
	font-family: 'Noto Sans', sans-serif;
	font-size: 15px;
	font-weight: 600;
	color: #55585D;
}
.jobcrumbs li {
	margin: 0;
	padding: 0;
	list-style: none;
}
/* The article pages absolutely position this ">" inside a 30px padded gap. The
   same 30px between words, reached with margins instead, so the separator sits
   centred between the two items rather than hard against the first. */
.jobcrumbs li:not(:last-child)::after {
	content: ">";
	display: inline-block;
	margin: 0 11px;
}
.jobcrumbs a {
	color: #55585D;
	font-weight: 600;
	text-decoration: none;
}
.jobcrumbs a:hover {
	color: #009FE3;
}
.jobsingle__head {
	margin-bottom: 26px;
}
.jobsingle__company {
	margin: 0 0 10px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: #009FE3;
}
.jobsingle__company a {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}
.jobsingle__title {
	margin: 0;
	font-size: 44px;
	line-height: 1.14;
	font-weight: 700;
	color: #001E6E;
}
.jobsingle__notice {
	margin: 0 0 24px;
	padding: 14px 18px;
	border-radius: 10px;
	background: #FFF6E5;
	font-size: 15px;
	color: #7a5a14;
}
.jobsingle__facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
	gap: 18px 30px;
	margin: 0 0 34px;
	padding: 24px 28px;
	border-radius: 14px;
	background: #F4FBFF;
}
.jobsingle__fact {
	min-width: 0;
}
.jobsingle__facts dt {
	margin: 0 0 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: #8b94a7;
}
.jobsingle__facts dd {
	margin: 0;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.35;
	color: #001E6E;
}

/* The description comes from the editor, so every tag it can emit is styled
   here rather than relying on the article stylesheet. */
.jobsingle__body {
	font-size: 17px;
	line-height: 1.72;
	color: #3d4a63;
}
.jobsingle__body > *:first-child {
	margin-top: 0;
}
.jobsingle__body p {
	margin: 0 0 18px;
}
.jobsingle__body h2 {
	margin: 34px 0 12px;
	font-size: 27px;
	line-height: 1.25;
	font-weight: 700;
	color: #001E6E;
}
.jobsingle__body h3 {
	margin: 30px 0 10px;
	font-size: 21px;
	line-height: 1.3;
	font-weight: 700;
	color: #001E6E;
}
/* Divi resets `ol, ul { list-style: none }` site-wide, so a description typed
   as a bulleted list rendered with no bullets at all. Restated here. */
.jobsingle__body ul,
.jobsingle__body ol {
	margin: 0 0 18px;
	padding-left: 22px;
}
.jobsingle__body ul {
	list-style: disc outside;
}
.jobsingle__body ol {
	list-style: decimal outside;
}
.jobsingle__body li {
	margin-bottom: 9px;
	list-style: inherit;
}
.jobsingle__body a {
	color: #009FE3;
}
.jobsingle__body strong {
	color: #2d3a55;
}
.jobsingle__body table {
	width: 100%;
	margin: 0 0 22px;
	border-collapse: collapse;
}
.jobsingle__body th,
.jobsingle__body td {
	padding: 8px 12px;
	border: 1px solid #e2e8f0;
	text-align: left;
	font-size: 15px;
	line-height: 1.45;
}
.jobsingle__body th {
	background: #edf2f7;
	font-weight: 600;
	text-align: center;
}
.jobsingle__closes {
	margin: 16px 0 0;
	font-size: 14px;
	color: #8b94a7;
	text-align: center;
}
/* A div, not a p: newhome.css sets `p { padding-bottom: 0 !important }`, which
   no amount of specificity on a class can beat. */
.jobsingle__back {
	margin: 36px 0 0;
	padding: 22px 0;
	border-top: 1px solid rgba(0, 30, 110, 0.1);
	font-size: 15px;
}
.jobsingle__back a {
	color: #009FE3;
	text-decoration: none;
	font-weight: 600;
}
.jobsingle__back a:hover {
	color: #7D6FE0;
}

@media (max-width: 782px) {
	.jobsingle__title {
		font-size: 30px;
	}
	.jobsingle__facts {
		gap: 16px 20px;
		padding: 20px;
	}
	.jobsingle__body {
		font-size: 16px;
	}
	.jobsingle__body table {
		display: block;
		overflow-x: auto;
	}
}

@media (max-width: 720px) {
	.jobcard {
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
		padding: 20px;
	}
	.jobcard__action {
		text-align: left;
		width: 100%;
	}
	.jobcard__button {
		display: block;
		text-align: center;
	}
	.jobsingle__facts {
		gap: 16px 28px;
		padding: 18px 20px;
	}
}

/* =========================================================================
   About page: founding story and team bios (gap 3)
   ====================================================================== */

.aboutstory {
	padding: 64px 0 10px;
	font-family: 'Noto Sans', sans-serif;
}
.aboutstory__inner {
	max-width: 760px;
	margin: 0 auto;
}
.aboutstory__heading {
	margin: 0 0 18px;
	font-size: 36px;
	line-height: 1.18;
	font-weight: 700;
	color: #001E6E;
}
.aboutstory__standfirst {
	margin: 0 0 24px;
	font-size: 20px;
	line-height: 1.55;
	font-weight: 600;
	color: #2d3a55;
}
.aboutstory__body {
	font-size: 17px;
	line-height: 1.72;
	color: #3d4a63;
}
.aboutstory__body p {
	margin: 0 0 18px;
}
.aboutstory__body p:last-child {
	margin-bottom: 0;
}
.aboutstory__body h3 {
	margin: 32px 0 12px;
	font-size: 22px;
	font-weight: 700;
	color: #001E6E;
}
.aboutstory__body a {
	color: #009FE3;
}
.aboutstory__line {
	margin: 30px 0 0;
	padding-left: 18px;
	border-left: 3px solid #009FE3;
	font-size: 16px;
	line-height: 1.6;
	font-weight: 600;
	color: #001E6E;
}

@media (max-width: 860px) {
	.aboutstory {
		padding: 44px 0 6px;
	}
	.aboutstory__heading {
		font-size: 28px;
	}
	.aboutstory__standfirst {
		font-size: 18px;
	}
	.aboutstory__body {
		font-size: 16px;
	}
}

/* =========================================================================
   Team member modal
   -------------------------------------------------------------------------
   Clicking a card opens the member's bio and LinkedIn profile. Markup and
   behaviour are in appcurate-team-modal.php.
   ====================================================================== */

.teammember--clickable {
	cursor: pointer;
}
.teammember--clickable:focus-visible {
	outline: 2px solid #009FE3;
	outline-offset: 4px;
}
body.has-teammodal {
	overflow: hidden;
}

.teammodal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	font-family: 'Noto Sans', sans-serif;
}
.teammodal[hidden] {
	display: none;
}
.teammodal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 30, 110, 0.55);
}
.teammodal__dialog {
	position: relative;
	width: 100%;
	max-width: 560px;
	max-height: calc(100vh - 48px);
	overflow-y: auto;
	padding: 34px 36px;
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 24px 60px rgba(0, 30, 110, 0.28);
}
.teammodal__close {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 34px;
	height: 34px;
	border: 1px solid rgba(0, 30, 110, 0.14);
	border-radius: 50%;
	background: #fff;
	font-size: 22px;
	line-height: 1;
	color: #8b94a7;
	cursor: pointer;
}
.teammodal__close:hover {
	border-color: transparent;
	background: #7D6FE0;
	color: #fff;
}
.teammodal__head {
	display: flex;
	align-items: center;
	gap: 20px;
}
.teammodal__photo {
	flex: 0 0 auto;
	width: 96px;
	height: 96px;
	border-radius: 50%;
	overflow: hidden;
	background: #EDF2F7;
}
.teammodal__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.teammodal__ident {
	min-width: 0;
}
.teammodal__name {
	margin: 0 0 4px;
	font-size: 24px;
	line-height: 1.22;
	font-weight: 700;
	color: #001E6E;
}
.teammodal__role {
	margin: 0;
	font-size: 15px;
	line-height: 1.45;
	color: #55617a;
}
.teammodal__linkedin {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 12px;
	padding: 9px 16px;
	border-radius: 9px;
	background: linear-gradient(90deg, #7D6FE0 0%, #009FE3 100%);
	font-size: 14px;
	font-weight: 600;
	color: #fff;
	text-decoration: none;
	transition: background 0.18s ease;
}
.teammodal__linkedin:hover,
.teammodal__linkedin:focus-visible {
	background: #7D6FE0;
	color: #fff;
}
.teammodal__linkedin svg {
	width: 16px;
	height: 16px;
	fill: currentColor;
}
.teammodal__linkedin[hidden] {
	display: none;
}
.teammodal__bio {
	margin-top: 22px;
	padding-top: 20px;
	border-top: 1px solid rgba(0, 30, 110, 0.1);
	font-size: 16px;
	line-height: 1.68;
	color: #3d4a63;
}
.teammodal__bio[hidden] {
	display: none;
}
.teammodal__bio p {
	margin: 0 0 14px;
}
.teammodal__bio p:last-child {
	margin-bottom: 0;
}

@media (max-width: 560px) {
	.teammodal {
		padding: 14px;
	}
	.teammodal__dialog {
		padding: 28px 22px;
	}
	.teammodal__head {
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
	}
	.teammodal__photo {
		width: 78px;
		height: 78px;
	}
	.teammodal__name {
		font-size: 21px;
	}
}

/* =========================================================================
   Job application form
   ====================================================================== */

.applyform {
	max-width: 820px;
	margin: 44px auto 0;
	padding: 34px 38px;
	border: 1px solid rgba(0, 159, 227, 0.22);
	border-radius: 18px;
	background: linear-gradient(180deg, #F4FBFF 0%, #FFFFFF 100%);
	font-family: 'Noto Sans', sans-serif;
}
.applyform__heading {
	margin: 0 0 6px;
	font-size: 24px;
	line-height: 1.25;
	font-weight: 700;
	color: #001E6E;
}
.applyform__sub {
	margin: 0 0 24px;
	font-size: 15px;
	line-height: 1.6;
	color: #4a5670;
}
.applyform__form {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}
.applyfield--wide,
.applyform__actions {
	grid-column: 1 / -1;
}
.applyfield > label {
	display: block;
	margin-bottom: 6px;
	font-size: 14px;
	font-weight: 600;
	color: #2d3a55;
}
.applyfield > label span[aria-hidden] {
	color: #009FE3;
}
.applyfield__optional {
	font-weight: 400;
	color: #8b94a7;
}
.applyfield__hint {
	display: block;
	margin-top: 6px;
	font-size: 12px;
	line-height: 1.5;
	color: #8b94a7;
}
.applyform .applyinput {
	width: 100%;
	padding: 0 18px;
	height: 48px;
	border: 1px solid rgba(0, 30, 110, 0.18);
	border-radius: 10px;
	background: #fff;
	font-family: inherit;
	font-size: 15px;
	color: #001E6E;
}
.applyform textarea.applyinput {
	height: auto;
	padding: 14px 18px;
	line-height: 1.6;
	resize: vertical;
}
.applyform .applyinput--file {
	padding: 11px 14px;
	height: auto;
	line-height: 1.4;
}
.applyform .applyinput:focus {
	outline: none;
	border-color: #009FE3;
	box-shadow: 0 0 0 3px rgba(0, 159, 227, 0.16);
}
/* Honeypot: off-screen rather than display:none, which some bots detect. */
.applyform__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
.applyform__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
}
.applyform__submit {
	border: 0;
	cursor: pointer;
	font-family: inherit;
}
.applyform__submit:disabled {
	opacity: 0.6;
	cursor: default;
}
.applyform__message {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
}
.applyform__message.is-ok {
	color: #0f7a4f;
}
.applyform__message.is-error {
	color: #b4232b;
}
.applyform__form.is-done .applyfield,
.applyform__form.is-done .applyform__submit {
	display: none;
}

@media (max-width: 720px) {
	.applyform {
		padding: 26px 20px;
		border-radius: 14px;
	}
	.applyform__form {
		grid-template-columns: minmax(0, 1fr);
	}
	.applyform__heading {
		font-size: 21px;
	}
}

/* =========================================================================
   Link decoration on button-shaped anchors
   -------------------------------------------------------------------------
   An inline `p a { text-decoration: underline }` rule underlines any anchor
   inside a paragraph, which caught the card buttons. The markup no longer
   wraps them in <p>, and these state it outright so another stylesheet cannot
   reintroduce it.
   ====================================================================== */

.jobcard__button,
.jobcard__button:hover,
.jobcard__button:focus,
.hubmasthead__pill,
.hubmasthead__pill:hover,
.hubmasthead__pill:focus,
.teammodal__linkedin,
.teammodal__linkedin:hover,
.teammodal__linkedin:focus,
.jobcard__title a,
.toolcard__title a {
	text-decoration: none;
}
.jobsempty__go {
	margin: 0;
}

/* =========================================================================
   7. Shared page rhythm
   ====================================================================== */

/* The signup band is full width, so it must not sit inside a padded column.
   Every template prints it as a sibling of the page container. */
/* Divi sets this as `body:not(.et-tb) #main-content .container { padding-top:
   58px }`, so a plain class selector loses and the band sat 129px above the box
   against 70px below it. Mirroring Divi's own selector shape outranks it rather
   than reaching for !important. */
body:not(.et-tb) #main-content .newslettersec .container,
.newslettersec .container {
	padding-top: 0;
	padding-bottom: 0;
}

@media (max-width: 782px) {
	.newslettersec {
		padding: 48px 0;
	}
}