/* ===== Jofo – global styles ===== */
:root {
	--jofo-primary: #014aac;
	--jofo-primary-2: #1a5fc4;
	--jofo-teal: #12c2c2;
	--jofo-text: #333;
	--jofo-muted: #707070;
	--jofo-border: #e7e7e7;
	--jofo-panel: #f2f7fd;
	--jofo-footer: #5d6570;
	--jofo-radius: 8px;
}
body { font-family: 'Roboto', sans-serif; color: var(--jofo-text); background: #fff; }
a { color: var(--jofo-primary); }
h1, h2, h3, h4, .elementor-heading-title { font-family: 'Poppins', sans-serif; }

/* ---------- Logo ---------- */
.jofo-logo .elementor-heading-title { font-family: 'Poppins', sans-serif; font-weight: 600; letter-spacing: 2px; line-height: 1; }
.jofo-logo .elementor-heading-title a { color: #1d1d1f; display: inline-flex; align-items: center; gap: .3em; }
.jofo-mark {
	display: inline-flex; align-items: center; justify-content: center; width: 1.05em; height: 1.05em; border-radius: .22em;
	background: linear-gradient(135deg, var(--jofo-teal), var(--jofo-primary)); color: #fff; font-size: .9em;
}
.jofo-mark i { font-size: .5em; }
.jofo-logo--header .elementor-heading-title { font-size: 22px; }
.jofo-logo--hero .elementor-heading-title { font-size: 52px; }
.jofo-logo--footer .elementor-heading-title { font-size: 26px; }
.jofo-logo--footer .elementor-heading-title a { color: #fff; }
.jofo-logo--footer .jofo-mark { background: #fff; color: var(--jofo-footer); }
/* The home page shows the big logo in the hero, so hide the small one there. */
body.home .jofo-logo--header { visibility: hidden; }

/* ---------- Header tools ---------- */
.jofo-header { position: relative; z-index: 50; }
.jofo-tools { display: flex; gap: 2px; flex-wrap: wrap; justify-content: flex-end; }
.jofo-tools__item { position: relative; }
.jofo-tools__btn {
	background: none; border: 0; padding: 6px 8px; border-radius: 6px; cursor: pointer;
	font: 400 13px 'Roboto', sans-serif; color: var(--jofo-text); display: inline-flex; align-items: center; gap: 6px;
}
.jofo-tools__btn i { color: #555; font-size: 13px; }
.jofo-tools__btn:hover, .jofo-tools__btn[aria-expanded="true"] { color: var(--jofo-primary); background: var(--jofo-panel); }
.jofo-tools__btn:hover i { color: var(--jofo-primary); }
.jofo-tools__badge {
	min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--jofo-primary);
	color: #fff; font-size: 11px; line-height: 18px; text-align: center;
}
.jofo-tools__badge[data-n="0"] { display: none; }
.jofo-tools__panel {
	position: absolute; right: 0; top: calc(100% + 8px); width: 280px; background: #fff;
	border: 1px solid var(--jofo-border); border-radius: var(--jofo-radius); box-shadow: 0 8px 24px rgba(0, 0, 0, .1); padding: 10px; z-index: 60;
}
.jofo-tools__panel ul { list-style: none; margin: 0; padding: 0; }
.jofo-tools__panel li a { display: block; padding: 8px; border-radius: 6px; font-size: 14px; color: var(--jofo-text); }
.jofo-tools__panel li a:hover { background: var(--jofo-panel); color: var(--jofo-primary); }
.jofo-tools__panel small { color: var(--jofo-muted); }
.jofo-tools__empty { margin: 0; padding: 8px; color: var(--jofo-muted); font-size: 14px; }
.jofo-tools__clear { margin-top: 6px; background: none; border: 0; color: var(--jofo-primary); font-size: 13px; cursor: pointer; padding: 4px 8px; }

/* ---------- Hero ---------- */
.jofo-hero__count p { margin: 0; font-size: 14px; color: var(--jofo-text); }
.jofo-hero__count .jofo-count { font: 600 20px 'Poppins', sans-serif; color: var(--jofo-text); margin-right: 4px; vertical-align: -1px; }
.jofo-hero__search { width: 100%; max-width: 656px; }

.jofo-search {
	display: flex; align-items: center; width: 100%; background: #fff; border: 1.5px solid #6fb7e0;
	border-radius: 999px; box-shadow: 0 2px 8px rgba(1, 74, 172, .12); padding: 3px;
}
.jofo-search__field { flex: 1; display: flex; align-items: center; gap: 10px; padding: 0 12px; margin: 0; color: #666; min-width: 0; }
.jofo-search__field + .jofo-search__field { border-left: 1px solid var(--jofo-border); }
.jofo-search__field i { font-size: 15px; }
.jofo-search__field input {
	border: 0 !important; box-shadow: none !important; outline: 0; width: 100%; padding: 8px 0 !important; border-radius: 0 !important;
	font: 400 13px 'Poppins', sans-serif; color: var(--jofo-text); background: transparent;
}
.jofo-search__btn {
	border: 0; border-radius: 999px; background: var(--jofo-primary); color: #fff; padding: 9px 22px;
	font: 600 14px 'Poppins', sans-serif; cursor: pointer; white-space: nowrap; letter-spacing: .3px;
}
.jofo-search__btn:hover { background: var(--jofo-primary-2); }

.jofo-trend__label .elementor-heading-title { font: 600 13px 'Roboto', sans-serif; color: #444; }
.jofo-trend__label i { margin-right: 4px; }
.jofo-trend .elementor-icon-list-items { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.jofo-trend .elementor-icon-list-item { margin: 0 !important; padding: 0 !important; }
.jofo-trend .elementor-icon-list-item::after { display: none !important; }
.jofo-trend .elementor-icon-list-text { color: var(--jofo-primary); font-size: 12.5px; padding: 0 !important; }
.jofo-trend a:hover .elementor-icon-list-text { text-decoration: underline; }

.jofo-hero-art { overflow: hidden; }
.jofo-hero-art__img img { display: block; height: min(260px, 26vw); width: auto; max-width: none; }

/* ---------- Section headings ---------- */
.elementor-widget-heading h2.elementor-heading-title { font-size: 28px; font-weight: 600; color: #2b2b2b; }

/* ---------- Popular fields ---------- */
.jofo-panel { width: 100%; }
.jofo-cats > .e-con-inner, .jofo-cats { width: 100%; }
.jofo-cat { flex: 1 1 0; min-width: 120px; }
.jofo-cat .elementor-icon {
	background: #fff !important; border: 1px solid #e3e9f1; box-shadow: 0 1px 3px rgba(0, 0, 0, .05);
	width: 80px; height: 80px; display: inline-flex !important; align-items: center; justify-content: center; padding: 0 !important; transition: .15s;
}
.jofo-cat .elementor-icon i { font-size: 30px; }
.jofo-cat .elementor-icon svg { width: 30px; height: 30px; }
.jofo-cat a:hover .elementor-icon, .jofo-cat .elementor-icon:hover { border-color: var(--jofo-primary); transform: translateY(-2px); }
.jofo-cat .elementor-icon-box-title { margin: 0; }
.jofo-cat .elementor-icon-box-title, .jofo-cat .elementor-icon-box-title a { font: 500 13px 'Roboto', sans-serif; color: var(--jofo-text); }

.jofo-pills { width: 100%; }
.jofo-pills .elementor-icon-list-items { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 8px; max-width: 600px; margin: 0 auto; }
.jofo-pills .elementor-icon-list-item { margin: 0 !important; padding: 0 !important; }
.jofo-pills .elementor-icon-list-item::after { display: none !important; }
.jofo-pills .elementor-icon-list-item a {
	display: inline-block; padding: 6px 13px; border-radius: 999px; background: #fff; border: 1px solid var(--jofo-border);
	transition: .15s;
}
.jofo-pills .elementor-icon-list-text { font: 500 12.5px 'Roboto', sans-serif; color: var(--jofo-text); padding: 0 !important; }
.jofo-pills a:hover { border-color: var(--jofo-primary); }
.jofo-pills a:hover .elementor-icon-list-text { color: var(--jofo-primary); }

/* ---------- Locations ---------- */
.jofo-citycards { width: 100%; }
.jofo-citycard { flex: 1 1 0; overflow: hidden; text-decoration: none; transition: .15s; }
.jofo-citycard:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0, 0, 0, .15); }
.jofo-citycard__name .elementor-heading-title { font: 600 13px 'Roboto', sans-serif; color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .4); }
.jofo-citylist { width: 100%; }
.jofo-citylist .elementor-icon-list-items { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px 14px; }
.jofo-citylist .elementor-icon-list-item { margin: 0 !important; padding: 0 !important; justify-content: center; }
.jofo-citylist .elementor-icon-list-item::after { display: none !important; }
.jofo-citylist .elementor-icon-list-item a { justify-content: center; width: 100%; }
.jofo-citylist .elementor-icon-list-text { font-size: 13px; color: var(--jofo-text); padding: 0 !important; }
.jofo-citylist a:hover .elementor-icon-list-text { color: var(--jofo-primary); text-decoration: underline; }

/* ---------- Jobs close to home ---------- */
.jofo-near .elementor-widget-text-editor p { margin: 0; font-size: 13px; }
.jofo-pill-btn .elementor-button {
	background: var(--jofo-primary); color: #fff; border-radius: 999px; padding: 10px 26px;
	font: 600 15px 'Poppins', sans-serif;
}
.jofo-pill-btn .elementor-button:hover { background: var(--jofo-primary-2); }

/* ---------- Footer ---------- */
.jofo-footer, .jofo-footer a { color: #fff; }
.jofo-footer__title .elementor-heading-title { font: 600 13px 'Roboto', sans-serif; color: #fff; }
.jofo-footer__links .elementor-icon-list-item { padding: 0 0 12px !important; margin: 0 !important; }
.jofo-footer__links .elementor-icon-list-item::after { display: none !important; }
.jofo-footer__links .elementor-icon-list-text { color: #fff; font-size: 12.5px; padding: 0 !important; }
.jofo-footer__links a:hover .elementor-icon-list-text { text-decoration: underline; }
.jofo-footer__copy p { margin: 0; font-size: 10px; color: #fff; text-align: right; }
.jofo-footer .elementor-social-icon { background: transparent !important; }
.jofo-footer .elementor-social-icon i, .jofo-footer .elementor-social-icon svg { color: #fff; fill: #fff; }

/* ---------- Inner pages ---------- */
body:not(.home) .site-main { max-width: 1000px; margin: 0 auto; padding: 36px 20px 64px; }
body:not(.home) .page-header .entry-title { font: 600 28px 'Poppins', sans-serif; color: #2b2b2b; margin-bottom: 20px; }
.site-main p, .site-main li { font-size: 15px; line-height: 1.7; }

/* Job search filters */
.job_filters { background: var(--jofo-panel) !important; border-radius: var(--jofo-radius) var(--jofo-radius) 0 0; }
.job_filters .search_jobs { background: transparent !important; padding: 18px !important; }
.job_filters input[type="text"], .job_filters select, .job_filters .select2-selection {
	border: 1px solid #d5dde8 !important; border-radius: 999px !important; padding: 9px 16px !important;
	font: 400 14px 'Roboto', sans-serif !important; background: #fff !important; box-shadow: none !important;
}
.job_filters .search_submit input[type="submit"], .job_filters .search_submit button, .job_filters input[type="submit"] {
	background: var(--jofo-primary) !important; color: #fff !important; border: 0 !important; border-radius: 999px !important;
	font: 600 14px 'Poppins', sans-serif !important; padding: 10px !important;
}
.job_filters .search_submit input[type="submit"]:hover { background: var(--jofo-primary-2) !important; }
.job_filters .job_types { background: #fff !important; border: 1px solid var(--jofo-border) !important; border-top: 0 !important; }
.job_filters .job_types li { font-size: 13px; border-color: var(--jofo-border) !important; }
.job_filters .showing_jobs { background: #fafbfd !important; font-size: 13px; border: 1px solid var(--jofo-border) !important; border-top: 0 !important; }
.job_filters .showing_jobs .rss_link { display: none !important; }

/* Job cards */
ul.job_listings { border: 0 !important; display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-top: 16px !important; }
ul.job_listings li.job_listing, ul.job_listings li.no_job_listings_found { border: 0 !important; }
ul.job_listings li.job_listing a {
	border: 1px solid var(--jofo-border) !important; border-radius: var(--jofo-radius); background: #fff; padding: 16px 18px !important;
	display: flex !important; flex-wrap: wrap; gap: 6px 16px; align-items: flex-start; height: 100%; transition: .15s;
}
ul.job_listings li.job_listing a:hover { border-color: var(--jofo-primary) !important; background: #fff !important; box-shadow: 0 4px 14px rgba(1, 74, 172, .08); }
ul.job_listings li.job_listing a img.company_logo { display: none; }
ul.job_listings li.job_listing a .position { float: none !important; width: 100% !important; padding: 0 !important; }
ul.job_listings li.job_listing a .position h3 { font: 600 16px 'Poppins', sans-serif; color: var(--jofo-primary); margin: 0 0 4px; }
ul.job_listings li.job_listing a .company { color: var(--jofo-muted); font-size: 13px; }
ul.job_listings li.job_listing a .company strong { font-weight: 500; }
ul.job_listings li.job_listing a .location { float: none !important; width: auto !important; padding: 0 !important; color: var(--jofo-text); font-size: 13px; }
ul.job_listings li.job_listing a .location::before { content: "\f3c5"; font-family: "Font Awesome 5 Free"; font-weight: 900; color: var(--jofo-primary); margin-right: 6px; }
ul.job_listings li.job_listing a .meta { float: none !important; width: auto !important; padding: 0 !important; margin-left: auto; text-align: right; }
ul.job_listings li.job_listing a .meta li { display: inline-block; margin-left: 10px; font-size: 12px; color: var(--jofo-muted); }
ul.job_listings li.job_listing a .meta .job-type { background: var(--jofo-panel); color: var(--jofo-primary) !important; padding: 2px 10px; border-radius: 12px; font-weight: 500; }
div.job_listings .load_more_jobs {
	display: block; width: max-content; margin: 24px auto 0; border: 0 !important; border-radius: 999px; background: var(--jofo-primary) !important;
	color: #fff !important; padding: 10px 26px !important; font: 600 15px 'Poppins', sans-serif;
}

/* Single job */
.single_job_listing .meta { padding: 0; margin: 0 0 16px; }
.single_job_listing .meta li { font-size: 13px; }
.single_job_listing .meta .job-type { background: var(--jofo-panel) !important; color: var(--jofo-primary) !important; border-radius: 12px; padding: 2px 10px; }
.single_job_listing .company { border: 1px solid var(--jofo-border) !important; border-radius: var(--jofo-radius); background: #fafbfd !important; padding: 16px !important; }
.single_job_listing .company .name strong { font: 600 16px 'Poppins', sans-serif; }
.single_job_listing .company img.company_logo { display: none; }
.single_job_listing .company .name, .single_job_listing .company .tagline { padding-left: 0 !important; }
.single_job_listing .job_description { font-size: 15px; line-height: 1.7; }
.single_job_listing .application_button, .job-manager-form input[type="submit"], .job-manager-form button[type="submit"], #submit-job-form .button {
	background: var(--jofo-primary) !important; color: #fff !important; border: 0 !important; border-radius: 999px !important;
	padding: 11px 26px !important; font: 600 15px 'Poppins', sans-serif !important; cursor: pointer;
}
.single_job_listing .application_button:hover, .job-manager-form input[type="submit"]:hover { background: var(--jofo-primary-2) !important; }
.single_job_listing .application_details { border: 1px solid var(--jofo-border); border-radius: var(--jofo-radius); padding: 16px; }
.jofo-save-job {
	margin: 0 0 18px; background: #fff; border: 1px solid var(--jofo-primary); color: var(--jofo-primary);
	border-radius: 999px; padding: 8px 18px; font: 500 14px 'Poppins', sans-serif; cursor: pointer;
}
.jofo-save-job.is-saved, .jofo-save-job:hover { background: var(--jofo-primary); color: #fff; }

/* Forms (post a job, dashboard, login) */
.job-manager-form fieldset { border-bottom: 1px solid var(--jofo-border) !important; padding: 14px 0 !important; }
.job-manager-form label { font: 500 14px 'Roboto', sans-serif; }
.job-manager-form input[type="text"], .job-manager-form input[type="email"], .job-manager-form input[type="password"], .job-manager-form input[type="url"],
.job-manager-form input[type="tel"], .job-manager-form select, .job-manager-form textarea, .job-manager-form .select2-selection {
	border: 1px solid #d5dde8 !important; border-radius: 6px !important; padding: 9px 12px !important; font: 400 14px 'Roboto', sans-serif;
	box-shadow: none !important; background: #fff;
}
.job-manager-form input:focus, .job-manager-form textarea:focus, .job_filters input:focus { border-color: var(--jofo-primary) !important; outline: 0; }
.job-manager-form h2 { font: 600 20px 'Poppins', sans-serif; margin-top: 24px; }
#job-manager-job-dashboard table { border-radius: var(--jofo-radius); overflow: hidden; font-size: 14px; }
.job-manager-message, .job-manager-info { background: var(--jofo-panel) !important; border-left: 4px solid var(--jofo-primary) !important; border-radius: 6px; color: var(--jofo-text) !important; }
.job-manager-error { border-radius: 6px; }

/* Blog list */
body.blog .site-main article, body.archive .site-main article { padding: 18px 0; border-bottom: 1px solid var(--jofo-border); }
body.blog .site-main .entry-title a { font: 600 20px 'Poppins', sans-serif; color: #2b2b2b; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
	.jofo-citylist .elementor-icon-list-items { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 767px) {
	.jofo-logo--hero .elementor-heading-title { font-size: 38px; }
	.jofo-search { flex-direction: column; border-radius: 16px; padding: 8px; align-items: stretch; }
	.jofo-search__field + .jofo-search__field { border-left: 0; border-top: 1px solid var(--jofo-border); }
	.jofo-search__btn { margin-top: 6px; padding: 12px; }
	.jofo-cats { justify-content: center !important; }
	.jofo-cat { flex: 0 0 30%; min-width: 0; }
	.jofo-cat .elementor-icon { width: 64px; height: 64px; }
	.jofo-citycards { flex-wrap: wrap !important; }
	.jofo-citycard { flex: 0 0 calc(50% - 7px); }
	.jofo-citylist .elementor-icon-list-items { grid-template-columns: repeat(2, 1fr); }
	ul.job_listings { grid-template-columns: 1fr; }
	.jofo-tools__btn { font-size: 0; gap: 0; padding: 8px; }
	.jofo-tools__btn i { font-size: 16px; }
	.jofo-tools__badge { font-size: 11px; margin-left: 2px; }
	.jofo-footer__copy p { text-align: left; }
}

/* ---------- Fixes from page review ---------- */
.job_filters .search_remote_position label, .job_filters .search_remote_position { font-size: 14px; color: var(--jofo-text); }
.job_filters .select2-container .select2-selection { height: auto !important; min-height: 42px; display: flex !important; align-items: center; }
.job_filters .select2-selection__rendered { padding: 0 !important; line-height: 22px !important; font-size: 14px; }
.job_filters .select2-selection__arrow { top: 50% !important; transform: translateY(-50%); right: 10px !important; }
.job_filters .showing_jobs { display: none !important; }
div.job_listings .load_more_jobs, div.job_listings .load_more_jobs strong,
.job-manager-form .button, .job-manager-form a.button, .job-manager-form fieldset .button { text-decoration: none !important; }
.job-manager-form a.button, .job-manager-form .account-sign-in .button {
	display: inline-flex; align-items: center; gap: 6px; background: var(--jofo-primary); color: #fff !important; border-radius: 999px;
	padding: 8px 20px; font: 600 14px 'Poppins', sans-serif;
}
.single_job_listing .company { min-height: 0 !important; padding: 14px 18px !important; }
.single_job_listing .company .name { margin: 0; }

/* ---------- Real Jobf0 logo ---------- */
.jofo-logo img { display: block; height: auto; }
.jofo-logo--header img { width: 150px; }
.jofo-logo--hero img { width: 300px; margin: 0 auto; }
.jofo-logo--footer img { width: 150px; filter: brightness(0) invert(1); }
body.home .jofo-logo--header { visibility: hidden; }
@media (max-width: 767px) { .jofo-logo--hero img { width: 230px; } }

/* =====================================================================
   Components for inner pages (search results, job detail, page layouts)
   ===================================================================== */
:root { --jofo-bg-soft: #f2f7fd; --jofo-shadow: 0 6px 20px rgba(1, 74, 172, .10); }

/* ---------- Buttons ---------- */
.jofo-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 999px; padding: 10px 22px; font: 600 14px 'Poppins', sans-serif; text-decoration: none !important; cursor: pointer; border: 1px solid transparent; transition: .15s; line-height: 1.2; }
.jofo-btn--primary { background: var(--jofo-primary); color: #fff !important; }
.jofo-btn--primary:hover { background: var(--jofo-primary-2); }
.jofo-btn--ghost { background: #fff; color: var(--jofo-primary) !important; border-color: var(--jofo-primary); }
.jofo-btn--ghost:hover, .jofo-btn--ghost.is-saved { background: var(--jofo-primary); color: #fff !important; }
.jofo-btn--link { background: none; color: var(--jofo-primary) !important; padding-left: 6px; padding-right: 6px; }
.jofo-btn--link:hover { text-decoration: underline !important; }

/* ---------- Inner header ---------- */
.jofo-header--inner { position: sticky; top: 0; z-index: 50; }
.jofo-header__top { min-height: 30px; }
.jofo-crumbs { font-size: 12px; color: var(--jofo-muted); display: flex; flex-wrap: wrap; align-items: center; gap: 0 8px; }
.jofo-crumbs a { color: var(--jofo-muted); }
.jofo-crumbs a:hover { color: var(--jofo-primary); text-decoration: underline; }
.jofo-crumbs i { font-style: normal; color: #c9c9c9; }
.jofo-crumbs span { color: var(--jofo-text); max-width: 40ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jofo-header__main .jofo-logo--header img { width: 150px; }
.jofo-header__search { flex: 1 1 auto; max-width: 620px; }
.jofo-search--compact { padding: 2px; box-shadow: none; border-width: 1.5px; }
.jofo-search--compact .jofo-search__field input { padding: 7px 0 !important; font-size: 13px; }
.jofo-search--compact .jofo-search__btn { padding: 8px 18px; font-size: 13px; }

/* ---------- Header popups (Saved / Viewed / Recent) ---------- */
.jofo-tools__panel { width: 320px; padding: 0; overflow: visible; border-radius: 10px; top: calc(100% + 10px); }
.jofo-tools__panel::before {
	content: ""; position: absolute; top: -7px; right: 26px; width: 12px; height: 12px; background: #fff;
	border-left: 1px solid var(--jofo-border); border-top: 1px solid var(--jofo-border); transform: rotate(45deg);
}
.jofo-tools__panel::after { content: ""; position: absolute; top: -12px; left: 0; right: 0; height: 12px; } /* hover bridge */
.jofo-pop__head { display: flex; justify-content: space-between; align-items: center; padding: 12px 14px 10px; border-bottom: 1px solid var(--jofo-border); }
.jofo-pop__head strong { font: 600 14px 'Poppins', sans-serif; }
.jofo-pop__head strong span { color: var(--jofo-muted); font-weight: 400; }
.jofo-pop__head a { font-size: 12.5px; font-weight: 500; }
.jofo-pop__list { list-style: none; margin: 0; padding: 6px; max-height: 330px; overflow: auto; }
.jofo-pop__list li a { display: flex; align-items: center; gap: 10px; padding: 9px 8px; border-radius: 8px; color: var(--jofo-text); text-decoration: none; }
.jofo-pop__list li a:hover { background: var(--jofo-bg-soft); }
.jofo-pop__list li a > i { color: var(--jofo-muted); font-size: 13px; width: 16px; text-align: center; }
.jofo-pop__txt { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.jofo-pop__txt b { font: 500 13.5px 'Roboto', sans-serif; color: var(--jofo-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jofo-pop__txt small { font-size: 12px; color: var(--jofo-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jofo-pop__list em { font-style: normal; font-size: 11px; color: #9a9a9a; white-space: nowrap; }
.jofo-pop__go { color: #b5b5b5 !important; font-size: 11px !important; }
.jofo-pop__foot { display: flex; justify-content: space-between; align-items: center; padding: 8px 14px 10px; border-top: 1px solid var(--jofo-border); }
.jofo-pop__foot a { font-size: 12.5px; }
.jofo-pop__foot .jofo-tools__clear { margin: 0; padding: 0; font-size: 12.5px; color: var(--jofo-muted); }
.jofo-pop__foot .jofo-tools__clear:hover { color: #c0392b; }
.jofo-pop__empty { text-align: center; padding: 22px 18px 24px; }
.jofo-pop__empty span { display: inline-flex; width: 46px; height: 46px; border-radius: 50%; background: var(--jofo-bg-soft); align-items: center; justify-content: center; color: var(--jofo-primary); font-size: 18px; margin-bottom: 8px; }
.jofo-pop__empty p { margin: 0; font-size: 13px; color: var(--jofo-muted); }
.jofo-tools__badge { background: #e53935; }

/* ---------- Search suggestions ---------- */
.jofo-search__field { position: relative; }
.jofo-suggest {
	position: absolute; top: calc(100% + 10px); left: -4px; right: -4px; z-index: 70; list-style: none; margin: 0; padding: 6px;
	background: #fff; border: 1px solid var(--jofo-border); border-radius: 10px; box-shadow: 0 10px 28px rgba(0, 0, 0, .12); max-height: 340px; overflow: auto; text-align: left;
}
.jofo-suggest li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 7px; cursor: pointer; font-size: 14px; color: var(--jofo-text); }
.jofo-suggest li i { width: 16px; text-align: center; color: #9a9a9a; font-size: 13px; }
.jofo-suggest li span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jofo-suggest li small { font-size: 11px; color: #9a9a9a; white-space: nowrap; }
.jofo-suggest li mark { background: none; color: var(--jofo-primary); font-weight: 600; padding: 0; }
.jofo-suggest li:hover, .jofo-suggest li[aria-selected="true"] { background: var(--jofo-bg-soft); }
.jofo-suggest li[aria-selected="true"] i { color: var(--jofo-primary); }

/* ---------- Job card ---------- */
ul.job_listings { list-style: none; padding: 0; margin: 0; }
ul.job_listings li.jofo-card {
	display: flex; flex-direction: column; background: #fff; border: 1px solid var(--jofo-border) !important; border-radius: 10px;
	padding: 0 !important; transition: border-color .15s, box-shadow .15s; position: relative; min-width: 0;
}
ul.job_listings li.jofo-card:hover, ul.job_listings li.jofo-card.is-active { border-color: var(--jofo-primary) !important; box-shadow: var(--jofo-shadow); }
ul.job_listings li.jofo-card.is-active { box-shadow: inset 4px 0 0 var(--jofo-primary), var(--jofo-shadow); }
ul.job_listings li.jofo-card a.jofo-card__link {
	display: block !important; flex: 1; padding: 16px 16px 8px !important; border: 0 !important; color: var(--jofo-text); text-decoration: none; background: none !important; box-shadow: none !important; min-height: 0; height: auto;
}
.jofo-card__title { font: 600 16.5px/1.3 'Poppins', sans-serif; color: #222; margin: 0 0 6px; }
.jofo-card__link:hover .jofo-card__title { color: var(--jofo-primary); text-decoration: underline; }
.jofo-card__line { margin: 0 0 2px; font-size: 13px; color: #555; line-height: 1.45; }
.jofo-card__line i { width: 14px; color: #9a9a9a; font-size: 11.5px; margin-right: 3px; }
.jofo-card__remote { margin: 2px 0 0; font-size: 13px; font-weight: 600; color: var(--jofo-primary); }
.jofo-card__salary { margin: 8px 0 4px; font: 500 16px 'Roboto', sans-serif; color: #222; }
.jofo-card__salary small { font-size: 12px; color: var(--jofo-muted); font-weight: 400; }
.jofo-card__excerpt { margin: 6px 0 10px; font-size: 13px; line-height: 1.5; color: #666; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.jofo-card__chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.jofo-card__chips li { background: var(--jofo-bg-soft); color: #4a5a70; font-size: 12px; padding: 3px 8px; border-radius: 4px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jofo-card__chips li i { color: var(--jofo-primary); margin-right: 3px; font-size: 10.5px; }
.jofo-card__foot { display: flex; justify-content: space-between; align-items: center; padding: 6px 10px 10px 16px; margin-top: auto; }
.jofo-card__date { font-size: 12px; color: var(--jofo-muted); }
.jofo-card__new { color: #e8590c; font-weight: 600; }
.jofo-card__save { background: none; border: 0; cursor: pointer; padding: 6px 8px; color: #6b6b6b; font-size: 17px; border-radius: 6px; line-height: 1; }
.jofo-card__save:hover { color: var(--jofo-primary); background: var(--jofo-bg-soft); }
.jofo-card__save.is-saved { color: var(--jofo-primary); }
ul.job_listings.jofo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }

/* ---------- Horizontal sections (Jobs Near Me) ---------- */
.jofo-section { margin: 0 0 44px; }
.jofo-section__head { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.jofo-section__icon { flex: 0 0 auto; width: 56px; height: 56px; border-radius: 50%; background: #dcebfb; color: var(--jofo-primary); display: inline-flex; align-items: center; justify-content: center; font-size: 22px; }
.jofo-section__title { margin: 0; font: 400 26px 'Poppins', sans-serif !important; color: #2b2b2b; }
.jofo-section__rail { position: relative; }
ul.jofo-scroller { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 24px) / 3); gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 2px 2px 6px; }
ul.jofo-scroller::-webkit-scrollbar { display: none; }
ul.jofo-scroller > li { scroll-snap-align: start; min-height: 360px; }
.jofo-section__next {
	position: absolute; right: -46px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; border-radius: 50%;
	background: #fff; border: 1px solid #cfcfcf; color: #444; cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.jofo-section__next:hover { border-color: var(--jofo-primary); color: var(--jofo-primary); }

/* ---------- Search ideas chips ---------- */
.jofo-ideas { margin: 44px 0 10px; }
.jofo-ideas__title { font: 400 15px 'Roboto', sans-serif !important; color: #333; margin: 0 0 10px; }
.jofo-ideas ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.jofo-ideas a { display: inline-flex; align-items: center; gap: 8px; background: #fff; border: 1px solid var(--jofo-border); border-radius: 4px; padding: 8px 12px; font-size: 13px; color: #333; }
.jofo-ideas a i { color: #9a9a9a; font-size: 12px; }
.jofo-ideas a:hover { border-color: var(--jofo-primary); color: var(--jofo-primary); }

/* ---------- Inner page shell ---------- */
.jofo-inner { background: #fff; }
.jofo-inner__hero { max-width: 1000px; margin: 0 auto; padding: 36px 20px 30px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.jofo-inner__title { font: 600 34px/1.2 'Poppins', sans-serif !important; color: #333; margin: 0 0 8px; }
.jofo-inner__sub { margin: 0; font-size: 14px; color: #444; }
.jofo-inner__sub i { color: var(--jofo-primary); margin-right: 4px; }
.jofo-inner__desc { margin-top: 8px; font-size: 14px; color: #555; max-width: 60ch; }
.jofo-inner__art { flex: 0 0 auto; width: 240px; height: auto; }
.jofo-inner__body { max-width: 1000px; margin: 0 auto; padding: 0 20px 64px; }
.jofo-inner--near .jofo-inner__body, .jofo-inner--browse .jofo-inner__body { background: none; }
.jofo-inner--near { background: linear-gradient(#fff 0, #fff 230px, var(--jofo-bg-soft) 230px); }
.jofo-inner--near .jofo-inner__hero { border-bottom: 1px solid var(--jofo-border); max-width: none; padding-left: max(20px, calc((100% - 1000px) / 2 + 20px)); padding-right: max(20px, calc((100% - 1000px) / 2 + 20px)); background: #fff; margin-bottom: 30px; }
.jofo-near-loc { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 14px; }
.jofo-near-loc__change { background: none; border: 0; padding: 0; color: var(--jofo-primary); text-decoration: underline; cursor: pointer; font-size: 14px; }
.jofo-near-loc__select { margin-left: 6px; border: 1px solid #cfd8e3; border-radius: 6px; padding: 5px 8px; font-size: 14px; }
.jofo-empty { text-align: center; padding: 48px 20px; border: 1px dashed #d5dde8; border-radius: 12px; background: #fff; }
.jofo-empty > i { font-size: 30px; color: var(--jofo-primary); background: var(--jofo-bg-soft); width: 70px; height: 70px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.jofo-empty h2 { font: 600 20px 'Poppins', sans-serif !important; margin: 14px 0 6px; }
.jofo-empty p { color: var(--jofo-muted); margin: 0 0 18px; }

/* ---------- Search results (split view) ---------- */
.jofo-inner:has(.jofo-serp) .jofo-inner__hero { padding-bottom: 14px; }
.jofo-inner:has(.jofo-serp) .jofo-inner__art { width: 180px; }
.jofo-inner:has(.jofo-serp) .jofo-inner__body, .jofo-page-jobs .site-main { max-width: 1160px; }
.jofo-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 0; border-bottom: 1px solid var(--jofo-border); }
.jofo-filter select { appearance: none; -webkit-appearance: none; border: 1px solid #cfd8e3; border-radius: 999px; padding: 7px 30px 7px 14px; font: 500 13px 'Roboto', sans-serif; color: #333; cursor: pointer;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23555' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") no-repeat right 12px center; }
.jofo-filter select:hover, .jofo-filter select:focus { border-color: var(--jofo-primary); outline: 0; }
.jofo-filter--check { display: inline-flex; align-items: center; gap: 6px; border: 1px solid #cfd8e3; border-radius: 999px; padding: 6px 14px; font: 500 13px 'Roboto', sans-serif; cursor: pointer; }
.jofo-filter--check:has(input:checked) { background: var(--jofo-bg-soft); border-color: var(--jofo-primary); color: var(--jofo-primary); }
.jofo-filter__reset { font-size: 13px; margin-left: 4px; }
.jofo-serp__count { margin: 14px 0; font-size: 14px; color: #555; }
.jofo-serp__count strong { color: #222; }
.jofo-serp__cols { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 20px; align-items: start; }
ul.job_listings.jofo-results { display: flex; margin: 0 !important; flex-direction: column; gap: 12px; }
.jofo-results li.jofo-card { cursor: pointer; }
.jofo-serp__panel {
	position: sticky; top: 112px; max-height: calc(100vh - 128px); overflow: auto; background: #fff; border: 1px solid var(--jofo-border);
	border-radius: 10px; box-shadow: 0 2px 10px rgba(0, 0, 0, .04); transition: opacity .15s;
}
.jofo-serp.is-loading .jofo-serp__panel { opacity: .5; }
.jofo-serp__panel:empty { display: none; }
.jofo-pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 24px 0 0; }
.jofo-pagination a, .jofo-pagination span, .jofo-pagination .page-numbers { min-width: 36px; height: 36px; padding: 0 10px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--jofo-border); border-radius: 8px; font-size: 14px; color: #333; background: #fff; }
.jofo-pagination a:hover { border-color: var(--jofo-primary); color: var(--jofo-primary); }
.jofo-pagination [aria-current], .jofo-pagination .current { background: var(--jofo-primary); color: #fff; border-color: var(--jofo-primary); }

/* ---------- Job detail ---------- */
.jofo-detail__head { padding: 22px 24px 16px; border-bottom: 1px solid var(--jofo-border); }
.jofo-detail--panel .jofo-detail__head { position: sticky; top: 0; background: #fff; z-index: 2; }
.jofo-detail__close { display: none; background: none; border: 0; padding: 0 0 12px; color: var(--jofo-primary); font: 500 14px 'Roboto', sans-serif; cursor: pointer; }
.jofo-detail__top { display: flex; justify-content: space-between; gap: 16px; }
.jofo-detail__title { font: 600 22px/1.3 'Poppins', sans-serif !important; color: #222; margin: 0 0 8px; }
.jofo-detail--page .jofo-detail__title { font-size: 28px !important; }
.jofo-detail__line { margin: 0 0 3px; font-size: 14px; color: #444; }
.jofo-detail__line i { width: 16px; color: #9a9a9a; margin-right: 4px; font-size: 12.5px; }
.jofo-detail__line a { color: #444; text-decoration: underline; }
.jofo-detail__remote { color: var(--jofo-primary); font-weight: 600; }
.jofo-detail__logo { width: 64px; height: 64px; object-fit: contain; border: 1px solid var(--jofo-border); border-radius: 8px; padding: 4px; background: #fff; flex: 0 0 auto; }
.jofo-detail__salary { margin: 12px 0 0; font: 500 19px 'Roboto', sans-serif; color: #222; }
.jofo-detail__salary small { font-size: 13px; color: var(--jofo-muted); font-weight: 400; }
.jofo-detail__chips { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.jofo-detail__chips a { display: inline-block; background: var(--jofo-bg-soft); color: #4a5a70; font-size: 12.5px; padding: 4px 10px; border-radius: 4px; }
.jofo-detail__chips a:hover { color: var(--jofo-primary); }
.jofo-detail__chips i { color: var(--jofo-primary); font-size: 11px; margin-right: 3px; }
.jofo-detail__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 16px; }
.jofo-detail__actions .jofo-btn--primary { padding: 11px 26px; font-size: 15px; }
.jofo-detail__expired { display: inline-flex; align-items: center; gap: 8px; background: #fff4e5; color: #8a5300; border-radius: 8px; padding: 10px 14px; font-size: 14px; }
.jofo-detail__facts { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13px; color: var(--jofo-muted); }
.jofo-detail__facts i { margin-right: 4px; }
.jofo-detail__body, .jofo-detail__company { padding: 18px 24px; }
.jofo-detail__h { font: 600 17px 'Poppins', sans-serif !important; margin: 4px 0 12px; color: #222; }
.jofo-detail__desc { font-size: 15px; line-height: 1.75; color: #333; overflow-wrap: anywhere; }
.jofo-detail__desc img { max-width: 100%; height: auto; border-radius: 6px; }
.jofo-detail__desc table { width: 100%; border-collapse: collapse; font-size: 14px; display: block; overflow-x: auto; }
.jofo-detail__desc td, .jofo-detail__desc th { border: 1px solid var(--jofo-border); padding: 6px 8px; }
.jofo-detail__tags { list-style: none; margin: 0 0 6px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.jofo-detail__tags a { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--jofo-border); border-radius: 4px; padding: 6px 10px; font-size: 12.5px; color: #333; }
.jofo-detail__tags a i { color: #9a9a9a; font-size: 11px; }
.jofo-detail__tags a:hover { border-color: var(--jofo-primary); color: var(--jofo-primary); }
.jofo-detail__company { border-top: 1px solid var(--jofo-border); }
.jofo-detail__company-card { display: flex; gap: 14px; align-items: center; }
.jofo-detail__company-card img { width: 56px; height: 56px; object-fit: contain; border: 1px solid var(--jofo-border); border-radius: 8px; padding: 4px; }
.jofo-detail__company-card p { margin: 2px 0; font-size: 13px; color: var(--jofo-muted); }
.jofo-detail__company-card a { font-size: 13.5px; }

/* Single job page */
.single-job_listing .site-main { max-width: 1160px; }
.single-job_listing .page-header { display: none; }
.jofo-jobpage { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 28px; align-items: start; }
.jofo-jobpage__main .jofo-detail { border: 1px solid var(--jofo-border); border-radius: 10px; }
.jofo-jobpage__side { position: sticky; top: 120px; }
.jofo-jobpage__side-title { font: 600 18px 'Poppins', sans-serif !important; margin: 0 0 12px; }
ul.job_listings.jofo-side-list { display: flex; margin: 0 !important; flex-direction: column; gap: 10px; }
.jofo-side-list .jofo-card__excerpt, .jofo-side-list .jofo-card__chips { display: none; }
.jofo-side-list li.jofo-card a.jofo-card__link { padding: 12px 14px 4px !important; }
.jofo-side-list .jofo-card__title { font-size: 14.5px; }
.jofo-jobpage__more { display: inline-block; margin-top: 12px; font-size: 14px; }

/* ---------- Legal pages ---------- */
.jofo-inner--legal .jofo-inner__hero { border-bottom: 1px solid var(--jofo-border); margin-bottom: 28px; }
.jofo-doc { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 40px; align-items: start; }
.jofo-doc__nav { position: sticky; top: 120px; }
.jofo-doc__nav h2 { font: 600 13px 'Roboto', sans-serif !important; text-transform: uppercase; letter-spacing: .06em; color: var(--jofo-muted); margin: 0 0 10px; }
.jofo-doc__nav ul { list-style: none; margin: 0; padding: 0; border-left: 2px solid var(--jofo-border); }
.jofo-doc__nav a { display: block; padding: 7px 14px; margin-left: -2px; border-left: 2px solid transparent; font-size: 14px; color: #444; }
.jofo-doc__nav a:hover { color: var(--jofo-primary); }
.jofo-doc__nav a[aria-current] { border-left-color: var(--jofo-primary); color: var(--jofo-primary); font-weight: 600; }
.jofo-prose { font-size: 15.5px; line-height: 1.75; color: #333; max-width: 72ch; overflow-wrap: anywhere; }
.jofo-prose h2 { font: 600 22px 'Poppins', sans-serif !important; margin: 32px 0 10px; color: #222; scroll-margin-top: 130px; }
.jofo-prose h3 { font: 600 17px 'Poppins', sans-serif !important; margin: 24px 0 6px; color: #222; }
.jofo-prose h4, .jofo-prose h5 { font: 600 15px 'Roboto', sans-serif !important; margin: 18px 0 4px; }
.jofo-prose p { margin: 0 0 14px; }
.jofo-prose ul, .jofo-prose ol { margin: 0 0 14px; padding-left: 22px; }
.jofo-prose li { margin-bottom: 6px; }
.jofo-prose a { text-decoration: underline; }
.jofo-prose img { max-width: 100%; height: auto; border-radius: 8px; }

/* ---------- About ---------- */
.jofo-stats { list-style: none; margin: 0 0 28px; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.jofo-stats li { background: var(--jofo-bg-soft); border-radius: 10px; padding: 18px; text-align: center; color: #555; font-size: 14px; }
.jofo-stats strong { display: block; font: 600 28px 'Poppins', sans-serif; color: var(--jofo-primary); }
.jofo-about { margin: 0 auto 32px; }
.jofo-tiles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.jofo-tiles a { display: flex; flex-direction: column; gap: 6px; height: 100%; padding: 20px 18px; border: 1px solid var(--jofo-border); border-radius: 10px; background: #fff; color: #333; transition: .15s; }
.jofo-tiles a:hover { border-color: var(--jofo-primary); box-shadow: var(--jofo-shadow); transform: translateY(-2px); }
.jofo-tiles i { font-size: 20px; color: var(--jofo-primary); width: 44px; height: 44px; border-radius: 50%; background: var(--jofo-bg-soft); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 4px; }
.jofo-tiles strong { font: 600 15px 'Poppins', sans-serif; }
.jofo-tiles span { font-size: 13px; color: var(--jofo-muted); }
.jofo-tiles--help { grid-template-columns: repeat(5, 1fr); margin-bottom: 30px; }
.jofo-tiles--help a { align-items: center; text-align: center; }
.jofo-faq h2 { padding-top: 10px; border-top: 1px solid var(--jofo-border); }
.jofo-faq h2:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
.jofo-cta { margin-top: 36px; padding: 26px; border-radius: 12px; background: var(--jofo-bg-soft); text-align: center; }
.jofo-cta p { font: 600 18px 'Poppins', sans-serif; margin: 0 0 12px; }

/* ---------- Contact ---------- */
.jofo-contact { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 32px; align-items: start; }
.jofo-contact__form h2 { font: 600 20px 'Poppins', sans-serif !important; margin: 0 0 14px; }
.jofo-contact__card { background: var(--jofo-bg-soft); border-radius: 12px; padding: 22px; }
.jofo-contact__card .jofo-prose h3 { margin-top: 0; }
.jofo-contact__links { list-style: none; margin: 0 0 16px; padding: 0; }
.jofo-contact__links li { display: flex; gap: 10px; align-items: center; padding: 6px 0; font-size: 14px; }
.jofo-contact__links i { color: var(--jofo-primary); width: 18px; text-align: center; }
.jofo-contact__hint { font-size: 13px; color: var(--jofo-muted); margin: 0; }
.jofo-form { display: flex; flex-direction: column; gap: 14px; }
.jofo-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.jofo-form label { display: flex; flex-direction: column; gap: 6px; font: 500 13.5px 'Roboto', sans-serif; color: #333; }
.jofo-form input, .jofo-form select, .jofo-form textarea { border: 1px solid #cfd8e3 !important; border-radius: 8px !important; padding: 10px 12px !important; font: 400 14px 'Roboto', sans-serif; background: #fff; }
.jofo-form input:focus, .jofo-form select:focus, .jofo-form textarea:focus { border-color: var(--jofo-primary) !important; outline: 0; box-shadow: 0 0 0 3px rgba(1, 74, 172, .12); }
.jofo-form button { align-self: flex-start; }
.jofo-hp { position: absolute !important; left: -9999px; }
.jofo-notice { border-radius: 8px; padding: 12px 14px; font-size: 14px; margin: 0 0 16px; }
.jofo-notice--ok { background: #e8f7ee; color: #1d6b3a; }
.jofo-notice--err { background: #fdecea; color: #a12b1f; }

/* ---------- Browse ---------- */
.jofo-browse__jump { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 30px; }
.jofo-browse__jump a { display: inline-flex; gap: 8px; align-items: center; padding: 9px 16px; border: 1px solid var(--jofo-border); border-radius: 999px; font-size: 14px; color: #333; background: #fff; }
.jofo-browse__jump a:hover { border-color: var(--jofo-primary); color: var(--jofo-primary); }
.jofo-browse__jump i { color: var(--jofo-primary); }
.jofo-browse__group { margin-bottom: 40px; scroll-margin-top: 130px; }
.jofo-browse__title { display: flex; align-items: center; gap: 12px; font: 600 22px 'Poppins', sans-serif !important; margin: 0 0 14px; }
.jofo-browse__title .jofo-section__icon { width: 44px; height: 44px; font-size: 17px; }
.jofo-browse__letters { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 16px; }
.jofo-browse__letters a { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border-radius: 6px; background: var(--jofo-bg-soft); font-size: 13px; font-weight: 600; }
.jofo-browse__cols { columns: 4 200px; column-gap: 28px; }
.jofo-browse__letter { break-inside: avoid; margin-bottom: 16px; scroll-margin-top: 130px; }
.jofo-browse__letter h3 { font: 600 15px 'Poppins', sans-serif !important; color: var(--jofo-primary); margin: 0 0 6px; padding-bottom: 4px; border-bottom: 1px solid var(--jofo-border); }
.jofo-browse__letter ul { list-style: none; margin: 0; padding: 0; }
.jofo-browse__letter li { display: flex; justify-content: space-between; gap: 8px; padding: 3px 0; font-size: 13.5px; }
.jofo-browse__letter li a { color: #333; }
.jofo-browse__letter li a:hover { color: var(--jofo-primary); text-decoration: underline; }
.jofo-browse__letter li span { color: #9a9a9a; font-size: 12px; }

/* ---------- Saved / Viewed / Recent ---------- */
.jofo-inner--myjobs .jofo-inner__body { padding-top: 32px; }
.jofo-myjobs { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 32px; align-items: start; }
.jofo-myjobs__nav { display: flex; flex-direction: column; gap: 4px; position: sticky; top: 120px; }
.jofo-myjobs__nav a { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 8px; font-size: 14.5px; color: #333; }
.jofo-myjobs__nav a i { width: 16px; color: #777; }
.jofo-myjobs__nav a:hover { background: var(--jofo-bg-soft); }
.jofo-myjobs__nav a[aria-current] { background: var(--jofo-bg-soft); color: var(--jofo-primary); font-weight: 600; }
.jofo-myjobs__nav a[aria-current] i { color: var(--jofo-primary); }
.jofo-myjobs__n { margin-left: auto; font-size: 12px; color: var(--jofo-muted); font-weight: 400; }
.jofo-myjobs__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.jofo-myjobs__clear { background: none; border: 0; color: var(--jofo-muted); font-size: 13px; cursor: pointer; }
.jofo-myjobs__clear:hover { color: #c0392b; }
.jofo-myjobs__note { font-size: 12.5px; color: var(--jofo-muted); margin: 0 0 18px; }
.jofo-myjobs__note i { margin-right: 4px; }
.jofo-searches { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.jofo-searches li { display: flex; align-items: center; border: 1px solid var(--jofo-border); border-radius: 10px; background: #fff; }
.jofo-searches li:hover { border-color: var(--jofo-primary); }
.jofo-searches a { flex: 1; display: flex; align-items: center; gap: 14px; padding: 14px 16px; color: #333; }
.jofo-searches a > i { color: var(--jofo-primary); }
.jofo-searches span { flex: 1; min-width: 0; }
.jofo-searches strong { font-weight: 600; }
.jofo-searches small { color: var(--jofo-muted); }
.jofo-searches em { font-style: normal; font-size: 13px; color: var(--jofo-primary); white-space: nowrap; }
.jofo-searches button { background: none; border: 0; padding: 14px 16px; color: #9a9a9a; cursor: pointer; }
.jofo-searches button:hover { color: #c0392b; }

/* ---------- Companies ---------- */
.jofo-companies { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 14px; }
.jofo-companies a { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; padding: 20px 14px; border: 1px solid var(--jofo-border); border-radius: 10px; background: #fff; height: 100%; color: #333; }
.jofo-companies a:hover { border-color: var(--jofo-primary); box-shadow: var(--jofo-shadow); }
.jofo-companies img, .jofo-companies__ph { width: 72px; height: 72px; object-fit: contain; border-radius: 10px; }
.jofo-companies__ph { display: inline-flex; align-items: center; justify-content: center; background: var(--jofo-bg-soft); color: var(--jofo-primary); font-size: 26px; }
.jofo-companies strong { font: 600 14px 'Poppins', sans-serif; line-height: 1.3; }
.jofo-companies span { font-size: 12.5px; color: var(--jofo-muted); }
.single-company .site-main { max-width: 1000px; }
.jofo-company { display: flex; gap: 20px; align-items: center; padding: 20px; border: 1px solid var(--jofo-border); border-radius: 12px; margin-bottom: 24px; }
.jofo-company__logo { width: 96px; height: 96px; object-fit: contain; border-radius: 10px; }
.jofo-company__meta { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 14px; }
.jofo-company__meta i { color: var(--jofo-primary); margin-right: 4px; }
.jofo-company__tagline { flex-basis: 100%; font-size: 15px; color: #555; }
.jofo-company__jobs-title { font: 600 22px 'Poppins', sans-serif !important; margin: 36px 0 14px; }
.single-company ul.job_listings { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }

/* ---------- Blog ---------- */
body.blog .site-main, body.archive.category .site-main, body.archive.tag .site-main, body.single-post .site-main { max-width: 1000px; }
body.single-post .site-main .entry-title, body.single-post .page-header .entry-title { font: 600 32px/1.25 'Poppins', sans-serif; }
body.single-post .page-content { font-size: 16.5px; line-height: 1.8; }
body.single-post .page-content img { max-width: 100%; height: auto; border-radius: 8px; }
body.single-post .page-content h2 { font: 600 24px 'Poppins', sans-serif; margin: 34px 0 12px; }
body.single-post .page-content h3 { font: 600 19px 'Poppins', sans-serif; margin: 26px 0 8px; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
	.jofo-section__next { right: 6px; box-shadow: 0 2px 8px rgba(0, 0, 0, .15); }
}
@media (max-width: 900px) {
	.jofo-header__main { flex-wrap: wrap !important; gap: 10px !important; }
	.jofo-header__search { flex-basis: 100%; max-width: none; }
	.jofo-crumbs { display: none; }
	.jofo-serp__cols { grid-template-columns: 1fr; }
	.jofo-serp__panel { display: none; }
	/* Phones: the panel opens full screen. */
	body.jofo-panel-open { overflow: hidden; }
	body.jofo-panel-open .jofo-serp__panel { display: block; position: fixed; inset: 0; top: 0; max-height: none; z-index: 200; border-radius: 0; border: 0; }
	.jofo-detail__close { display: inline-flex; gap: 8px; align-items: center; }
	.jofo-jobpage, .jofo-contact, .jofo-doc, .jofo-myjobs { grid-template-columns: 1fr; }
	.jofo-jobpage__side, .jofo-doc__nav, .jofo-myjobs__nav { position: static; }
	.jofo-myjobs__nav { flex-direction: row; overflow-x: auto; }
	.jofo-myjobs__nav a { white-space: nowrap; }
	.jofo-doc__nav ul { display: flex; overflow-x: auto; border-left: 0; border-bottom: 2px solid var(--jofo-border); }
	.jofo-doc__nav a { white-space: nowrap; border-left: 0; border-bottom: 2px solid transparent; margin: 0 0 -2px; }
	.jofo-doc__nav a[aria-current] { border-bottom-color: var(--jofo-primary); }
	.jofo-tiles, .jofo-tiles--help { grid-template-columns: repeat(2, 1fr); }
	ul.jofo-scroller { grid-auto-columns: 80%; }
}
@media (max-width: 767px) {
	.jofo-inner__hero { padding-top: 24px; }
	.jofo-inner__art { display: none; }
	.jofo-inner__title { font-size: 26px !important; }
	.jofo-section__title { font-size: 20px !important; }
	.jofo-section__icon { width: 44px; height: 44px; font-size: 17px; }
	.jofo-stats { grid-template-columns: 1fr; }
	.jofo-form__row { grid-template-columns: 1fr; }
	.jofo-detail__head, .jofo-detail__body, .jofo-detail__company { padding-left: 16px; padding-right: 16px; }
	.jofo-tools__panel { position: fixed; left: 12px; right: 12px; width: auto; top: 54px; }
	.jofo-tools__panel::before { display: none; }
	.jofo-company { flex-direction: column; align-items: flex-start; }
}

/* =====================================================================
   Buttons & links – replace the theme reset's pink (#c36) defaults.
   The reset styles button:hover AND button:focus pink (0,1,1), and buttons keep
   focus after a click, so every component below declares its resting, hover and
   focus states with button.<class> selectors (0,2,1) to win cleanly.
   ===================================================================== */
a { color: var(--jofo-primary); }
a:hover, a:active { color: var(--jofo-primary-2); }

/* Fallback for any button without its own styling: brand outline → filled on hover. */
button, [type=button], [type=submit], [type=reset] { font-family: inherit; border-color: var(--jofo-primary); color: var(--jofo-primary); border-radius: 999px; }
button:hover, button:focus, [type=button]:hover, [type=button]:focus, [type=submit]:hover, [type=submit]:focus {
	background-color: var(--jofo-primary); border-color: var(--jofo-primary); color: #fff;
}
/* Mouse clicks don't leave a filled "focused" button behind… */
button:not([class*="jofo-"]):focus:not(:focus-visible):not(:hover), [type=button]:not([class*="jofo-"]):focus:not(:focus-visible):not(:hover), [type=submit]:not([class*="jofo-"]):focus:not(:focus-visible):not(:hover) {
	background-color: transparent; color: var(--jofo-primary);
}
/* …while keyboard users get a clear ring. */
a:focus-visible, button:focus-visible, [type=button]:focus-visible, [type=submit]:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
	outline: 2px solid var(--jofo-primary); outline-offset: 2px; box-shadow: none;
}

/* ---- Primary (filled) ---- */
button.jofo-search__btn, button.jofo-search__btn:focus,
button.jofo-btn--primary, button.jofo-btn--primary:focus, a.jofo-btn--primary, a.jofo-btn--primary:focus {
	background: var(--jofo-primary); border: 1px solid var(--jofo-primary); color: #fff; border-radius: 999px;
}
button.jofo-search__btn:hover, button.jofo-btn--primary:hover, a.jofo-btn--primary:hover {
	background: var(--jofo-primary-2); border-color: var(--jofo-primary-2); color: #fff;
}
button.jofo-search__btn { padding: 9px 22px; line-height: 1.3; }
.jofo-search--compact button.jofo-search__btn { padding: 8px 18px; }

/* ---- Ghost (outline) ---- */
button.jofo-btn--ghost, button.jofo-btn--ghost:focus { background: #fff; border: 1px solid var(--jofo-primary); color: var(--jofo-primary); border-radius: 999px; }
button.jofo-btn--ghost:hover, button.jofo-btn--ghost.is-saved, button.jofo-btn--ghost.is-saved:focus { background: var(--jofo-primary); color: #fff; }
button.jofo-btn--ghost.is-saved i::before { content: "\f02e"; font-weight: 900; } /* solid bookmark when saved */

/* ---- Plain / icon buttons (no box) ---- */
button.jofo-tools__btn, button.jofo-tools__btn:focus,
button.jofo-card__save, button.jofo-card__save:focus,
button.jofo-tools__clear, button.jofo-tools__clear:focus,
button.jofo-myjobs__clear, button.jofo-myjobs__clear:focus,
button.jofo-near-loc__change, button.jofo-near-loc__change:focus,
button.jofo-detail__close, button.jofo-detail__close:focus,
.jofo-searches button, .jofo-searches button:focus {
	background: transparent; border: 0; box-shadow: none; white-space: nowrap;
}
button.jofo-tools__btn, button.jofo-tools__btn:focus { color: var(--jofo-text); border-radius: 6px; padding: 6px 8px; }
button.jofo-tools__btn:hover, button.jofo-tools__btn[aria-expanded="true"] { background: var(--jofo-bg-soft, #f2f7fd); color: var(--jofo-primary); }
button.jofo-card__save, button.jofo-card__save:focus { color: #6b6b6b; border-radius: 6px; padding: 6px 8px; font-size: 17px; line-height: 1; }
button.jofo-card__save:hover { background: var(--jofo-bg-soft, #f2f7fd); color: var(--jofo-primary); }
button.jofo-card__save.is-saved, button.jofo-card__save.is-saved:focus { color: var(--jofo-primary); }
button.jofo-tools__clear, button.jofo-tools__clear:focus, button.jofo-myjobs__clear, button.jofo-myjobs__clear:focus { color: var(--jofo-muted); padding: 0; font-size: 12.5px; }
button.jofo-tools__clear:hover, button.jofo-myjobs__clear:hover, .jofo-searches button:hover { background: transparent; color: #c0392b; }
button.jofo-near-loc__change, button.jofo-near-loc__change:focus, button.jofo-near-loc__change:hover { color: var(--jofo-primary); padding: 0; text-decoration: underline; font-size: 14px; }
button.jofo-detail__close, button.jofo-detail__close:focus, button.jofo-detail__close:hover { color: var(--jofo-primary); padding: 0 0 12px; border-radius: 0; }
.jofo-searches button, .jofo-searches button:focus { color: #9a9a9a; padding: 14px 16px; border-radius: 0 10px 10px 0; }

/* ---- Round arrow on job rows ---- */
button.jofo-section__next, button.jofo-section__next:focus { background: #fff; border: 1px solid #cfcfcf; color: #444; border-radius: 50%; padding: 0; width: 32px; height: 32px; }
button.jofo-section__next:hover { background: #fff; border-color: var(--jofo-primary); color: var(--jofo-primary); }

/* ---- Text links styled as links inside filters etc. ---- */
a.jofo-btn--link, a.jofo-btn--link:focus, a.jofo-btn--link:hover { background: none; border: 0; color: var(--jofo-primary); }

/* ---- WP Job Manager forms (Post a Job, dashboard) ---- */
.job-manager-form input[type=submit], .job-manager-form button[type=submit], .job-manager-form input[type=submit]:focus, .job-manager-form button[type=submit]:focus {
	background: var(--jofo-primary) !important; border: 1px solid var(--jofo-primary) !important; color: #fff !important; border-radius: 999px !important;
}
.job-manager-form input[type=submit]:hover, .job-manager-form button[type=submit]:hover { background: var(--jofo-primary-2) !important; }
.job-manager-form input[name=edit_job], .job-manager-form input[name=edit_job]:focus { background: #fff !important; color: var(--jofo-primary) !important; }
#job-manager-job-dashboard .job-dashboard-actions a, #job-manager-job-dashboard .job-manager-pagination a { color: var(--jofo-primary); }

/* ---- Elementor button widgets ---- */
.elementor-button { border-radius: 999px; font-family: 'Poppins', sans-serif; font-weight: 600; }
.elementor-button:focus { color: #fff; }

/* =====================================================================
   Home: cities with real photos
   ===================================================================== */
.jofo-cities { width: 100%; }
.jofo-cities__cards { list-style: none; margin: 0 0 22px; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.jofo-citycard { position: relative; display: block; border-radius: 6px; overflow: hidden; aspect-ratio: 16 / 10; background: #dfe7f1; text-decoration: none; transition: transform .15s, box-shadow .15s; }
.jofo-citycard img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.jofo-citycard::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .72)); }
.jofo-citycard:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0, 0, 0, .18); }
.jofo-citycard:hover img { transform: scale(1.04); }
.jofo-citycard__name { position: absolute; left: 10px; bottom: 9px; z-index: 1; color: #fff; font: 600 14px 'Roboto', sans-serif; text-shadow: 0 1px 2px rgba(0, 0, 0, .5); }
.jofo-citycard__count { position: absolute; right: 10px; bottom: 10px; z-index: 1; color: #fff; font-size: 11.5px; background: rgba(1, 74, 172, .85); padding: 2px 8px; border-radius: 999px; }
.jofo-cities__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px 14px; text-align: center; }
.jofo-cities__list a { font-size: 13.5px; color: var(--jofo-text); }
.jofo-cities__list a:hover { color: var(--jofo-primary); text-decoration: underline; }
.jofo-cities__credit { margin: 18px 0 0; text-align: center; font-size: 11px; }
.jofo-cities__credit a { color: #9a9a9a; }
.jofo-credits { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.jofo-credits li { display: flex; gap: 14px; align-items: center; font-size: 14px; }
.jofo-credits img { width: 120px; height: 75px; object-fit: cover; border-radius: 6px; flex: 0 0 auto; }
@media (max-width: 767px) {
	.jofo-cities__cards { grid-template-columns: repeat(2, 1fr); }
	.jofo-cities__list { grid-template-columns: repeat(2, 1fr); }
}

/* The cities block sits in a centred flex column – stretch it to the full section width. */
.elementor-widget.jofo-cities-widget, .elementor-element.jofo-cities-widget { width: 100%; max-width: 100%; align-self: stretch; }
.jofo-cities-widget .elementor-shortcode { width: 100%; }

/* Footer social icons */
.jofo-footer__social .elementor-social-icon { background: transparent !important; width: auto; height: auto; padding: 4px !important; }
.jofo-footer__social .elementor-social-icon i, .jofo-footer__social .elementor-social-icon svg { color: #fff !important; fill: #fff !important; }
.jofo-footer__social .elementor-social-icon:hover { opacity: .8; transform: translateY(-1px); }
.jofo-footer__copy p { font-size: 11px; }

/* =====================================================================
   Inner pages share the header's content edges (1200px box, 20px gutters).
   ===================================================================== */
:root { --jofo-wrap: 1200px; --jofo-gutter: 20px; }
.jofo-inner__hero, .jofo-inner__body,
body:not(.home) .site-main, body:not(.home) .page-header, body:not(.home) .page-content,
.single-job_listing .site-main, .single-company .site-main,
body.blog .site-main, body.archive.category .site-main, body.archive.tag .site-main, body.single-post .site-main,
.jofo-inner:has(.jofo-serp) .jofo-inner__body, .jofo-page-jobs .site-main {
	width: min(var(--jofo-wrap), 100% - 2 * var(--jofo-gutter));
	max-width: none;
	margin-left: auto;
	margin-right: auto;
	padding-left: 0;
	padding-right: 0;
}
body:not(.home) .site-main { padding-top: 32px; padding-bottom: 64px; }
body:not(.home) .site-main .page-header, body:not(.home) .site-main .page-content { width: 100%; }
/* Jobs Near Me: full-bleed white hero band, content on the same edges. */
.jofo-inner--near .jofo-inner__hero { width: 100%; padding-left: max(var(--jofo-gutter), (100% - var(--jofo-wrap)) / 2); padding-right: max(var(--jofo-gutter), (100% - var(--jofo-wrap)) / 2); }
/* Results: list column a little wider now that there is more room. */
.jofo-serp__cols { grid-template-columns: minmax(0, 460px) minmax(0, 1fr); gap: 24px; }
/* Reading pages keep a comfortable line length inside the wider box. */
.jofo-prose { max-width: 78ch; }
.jofo-doc { grid-template-columns: 240px minmax(0, 1fr); gap: 56px; }
.jofo-section__next { right: -40px; }
@media (max-width: 1290px) { .jofo-section__next { right: 6px; box-shadow: 0 2px 8px rgba(0, 0, 0, .15); } }

/* =====================================================================
   Single job page
   ===================================================================== */
.single-job_listing .site-main { padding-top: 0 !important; }
.jofo-jp__band { margin: 0 calc(50% - 50vw) 28px; padding: 30px calc(50vw - 50%) 26px; background: #fff; border-bottom: 1px solid var(--jofo-border); }
.jofo-jp__band-inner { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 40px; align-items: start; }
.jofo-jp__closed { display: inline-flex; gap: 8px; align-items: center; background: #fff4e5; color: #8a5300; border-radius: 8px; padding: 8px 12px; font-size: 13.5px; margin: 0 0 12px; }
.jofo-jp__title { font: 600 30px/1.25 'Poppins', sans-serif !important; color: #222; margin: 0 0 16px; }
.jofo-jp__summary { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.jofo-jp__summary li { display: flex; align-items: center; gap: 12px; font-size: 15px; color: #333; }
.jofo-jp__summary a { color: #333; text-decoration: underline; }
.jofo-jp__ico { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; background: var(--jofo-bg-soft); color: var(--jofo-primary); display: inline-flex; align-items: center; justify-content: center; font-size: 13px; }
.jofo-jp__remote { color: var(--jofo-primary); font-weight: 600; margin-left: 6px; }
.jofo-jp__salary { font: 500 18px 'Roboto', sans-serif; }
.jofo-jp__salary small { font-size: 13px; color: var(--jofo-muted); font-weight: 400; }
.jofo-jp__chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.jofo-jp__chips a { display: inline-block; background: var(--jofo-bg-soft); color: #4a5a70; font-size: 12.5px; padding: 4px 10px; border-radius: 4px; }
.jofo-jp__chips a:hover { color: var(--jofo-primary); }
.jofo-jp__box { position: sticky; top: 118px; border: 1px solid var(--jofo-border); border-radius: 12px; padding: 18px; background: #fff; box-shadow: var(--jofo-shadow); }
.jofo-jp__box-title { font: 600 15px/1.35 'Poppins', sans-serif; margin: 0 0 2px; color: #222; }
.jofo-jp__box-sub { margin: 0 0 14px; font-size: 13px; color: var(--jofo-muted); }
.jofo-jp__box-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.jofo-jp__box-btns .jofo-btn--block { grid-column: 1 / -1; }
.jofo-btn--block { width: 100%; padding-top: 12px; padding-bottom: 12px; font-size: 15px; }
.jofo-jp__box-note { margin: 12px 0 0; font-size: 13px; color: #8a5300; }
.jofo-jp__box-note i { margin-right: 4px; }
.jofo-share { position: absolute; z-index: 20; right: 0; top: calc(100% + 6px); min-width: 190px; background: #fff; border: 1px solid var(--jofo-border); border-radius: 10px; box-shadow: 0 10px 28px rgba(0, 0, 0, .12); padding: 6px; display: flex; flex-direction: column; }
.jofo-share a, .jofo-share button, .jofo-share button:focus { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 6px; font-size: 14px; color: #333; background: none; border: 0; text-align: left; }
.jofo-share a:hover, .jofo-share button:hover { background: var(--jofo-bg-soft); color: var(--jofo-primary); }
.jofo-share i { width: 16px; text-align: center; color: var(--jofo-primary); }

.jofo-jp__cols { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 40px; align-items: start; }
.jofo-jp__main { display: flex; flex-direction: column; gap: 18px; }
.jofo-jp__card { border: 1px solid var(--jofo-border); border-radius: 12px; padding: 22px 24px; background: #fff; }
.jofo-jp__h { font: 600 19px 'Poppins', sans-serif !important; margin: 0 0 14px; color: #222; }
.jofo-jp__desc { max-width: none; }
.jofo-jp__desc table { width: 100%; display: block; overflow-x: auto; }
.jofo-jp__row { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 12px; margin: 0; padding: 12px 0; border-top: 1px solid var(--jofo-border); align-items: center; }
.jofo-jp__row:first-of-type { border-top: 0; padding-top: 0; }
.jofo-jp__row dt { display: flex; align-items: center; gap: 10px; font-weight: 500; font-size: 14px; color: #555; }
.jofo-jp__row dd { margin: 0; font-size: 14.5px; color: #222; }
.jofo-jp__bottom { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 6px 2px 0; }
.jofo-jp__report { font-size: 13.5px; color: var(--jofo-muted); }
.jofo-jp__report:hover { color: #c0392b; }
.jofo-jp__bottom-btns { display: flex; gap: 10px; }
.jofo-jp__side { display: flex; flex-direction: column; gap: 18px; position: sticky; top: 118px; }
.jofo-jp__company .jofo-detail__company-card { align-items: flex-start; }
.jofo-jp__similar .jofo-jp__h { margin-bottom: 10px; }
.jofo-jp__mobilebar { display: none; }

@media (max-width: 1024px) {
	.jofo-jp__band-inner, .jofo-jp__cols { grid-template-columns: 1fr; gap: 20px; }
	.jofo-jp__box, .jofo-jp__side { position: static; }
}
@media (max-width: 767px) {
	.jofo-jp__title { font-size: 24px !important; }
	.jofo-jp__box { display: none; }
	.jofo-jp__card { padding: 18px 16px; }
	.jofo-jp__row { grid-template-columns: 1fr; gap: 4px; }
	.jofo-jp__bottom-btns { display: none; }
	.jofo-jp { padding-bottom: 76px; }
	.jofo-jp__mobilebar { display: flex; gap: 10px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid var(--jofo-border); box-shadow: 0 -4px 16px rgba(0, 0, 0, .06); }
	.jofo-jp__mobilebar .jofo-btn--block { flex: 1; }
	.jofo-jp__mobilebar .jofo-btn--icon span { display: none; }
}

/* Header: Jobs Near Me link */
.jofo-tools { align-items: center; }
a.jofo-tools__link { display: inline-flex; align-items: center; gap: 6px; padding: 6px 8px; border-radius: 6px; font: 400 13px 'Roboto', sans-serif; color: var(--jofo-text); }
a.jofo-tools__link i { color: #555; font-size: 13px; }
a.jofo-tools__link:hover, a.jofo-tools__link.is-current { background: var(--jofo-bg-soft); color: var(--jofo-primary); }
a.jofo-tools__link:hover i, a.jofo-tools__link.is-current i { color: var(--jofo-primary); }
@media (max-width: 767px) { a.jofo-tools__link { font-size: 0; gap: 0; padding: 8px; } a.jofo-tools__link i { font-size: 16px; } }

/* =====================================================================
   Jobs Near Me rows: equal card widths/heights, arrow inside the content box
   ===================================================================== */
.jofo-section__rail { padding-right: 48px; }
ul.job_listings.jofo-scroller {
	display: grid; grid-template-columns: none; grid-auto-flow: column;
	grid-auto-columns: calc((100% - 2 * 14px) / 3); gap: 14px; align-items: stretch;
	overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 2px 2px 8px; margin: 0 !important; border: 0 !important;
}
ul.job_listings.jofo-scroller > li.jofo-card { min-height: 0; height: 100%; scroll-snap-align: start; }
ul.job_listings.jofo-scroller .jofo-card__link { display: flex !important; flex-direction: column; }
ul.job_listings.jofo-scroller .jofo-card__title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.6em; }
ul.job_listings.jofo-scroller .jofo-card__chips { margin-top: auto; max-height: 58px; overflow: hidden; }
button.jofo-section__next, button.jofo-section__next:focus { right: 4px; top: 50%; }
.jofo-section__head { margin-bottom: 18px; }
.jofo-inner--near .jofo-inner__body { padding-top: 6px; }
@media (max-width: 900px) {
	.jofo-section__rail { padding-right: 0; }
	ul.job_listings.jofo-scroller { grid-auto-columns: 82%; }
	button.jofo-section__next { display: none !important; }
}

/* Prev arrow: same button as Next, on the left, vertically centred on the row. */
.jofo-section__rail { padding-left: 48px; padding-right: 48px; }
button.jofo-section__prev, button.jofo-section__prev:focus,
button.jofo-section__next, button.jofo-section__next:focus {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
	width: 36px; height: 36px; padding: 0; border-radius: 50%;
	background: #fff; border: 1px solid #cfcfcf; color: #444; box-shadow: 0 2px 6px rgba(0, 0, 0, .08);
	display: flex; align-items: center; justify-content: center; font-size: 13px; cursor: pointer;
}
button.jofo-section__prev, button.jofo-section__prev:focus { left: 4px; right: auto; }
button.jofo-section__next, button.jofo-section__next:focus { right: 4px; left: auto; }
button.jofo-section__prev:hover, button.jofo-section__next:hover { background: #fff; border-color: var(--jofo-primary); color: var(--jofo-primary); }
button.jofo-section__prev[hidden], button.jofo-section__next[hidden] { display: none; }
@media (max-width: 900px) {
	.jofo-section__rail { padding-left: 0; padding-right: 0; }
	button.jofo-section__prev, button.jofo-section__next { display: none !important; }
}

/* Drag to slide (mouse) */
@media (hover: hover) and (pointer: fine) {
	ul.job_listings.jofo-scroller { cursor: grab; }
	ul.job_listings.jofo-scroller.is-dragging { cursor: grabbing; scroll-snap-type: none; scroll-behavior: auto; user-select: none; }
	ul.job_listings.jofo-scroller.is-dragging a, ul.job_listings.jofo-scroller.is-dragging li { cursor: grabbing; pointer-events: none; }
	ul.job_listings.jofo-scroller img { -webkit-user-drag: none; }
}

/* =====================================================================
   Listing pages (search results, job categories / cities / tags):
   header with title + filter row as one block, results on a soft background.
   ===================================================================== */
body.jofo-listing { background: #f5f8fc; }
body.jofo-listing .jofo-header--inner { border-bottom: 0 !important; }
body.jofo-listing .site-main, body.jofo-listing .jofo-inner, body.jofo-listing .jofo-inner__body { background: transparent; }
body.jofo-listing .site-main { padding-top: 0 !important; }
body.jofo-listing .jofo-inner__body { padding-top: 0; }

/* Title in the header's top row */
.jofo-crumbs--listing { display: flex; flex-direction: column; align-items: flex-start; gap: 0; }
.jofo-crumbs--listing a { font-size: 12px; color: var(--jofo-muted); }
.jofo-crumbs--listing a:hover { color: var(--jofo-primary); text-decoration: underline; }
.jofo-header__title { font: 600 20px/1.25 'Poppins', sans-serif !important; color: #222; margin: 2px 0 4px; }
body.jofo-listing .jofo-header__top { min-height: 52px; align-items: flex-start !important; padding-top: 6px; }

/* Filter row: full-width white strip under the header, content on the header's edges */
.jofo-fbar { background: #fff; border-bottom: 1px solid var(--jofo-border); margin: 0 calc(50% - 50vw) 18px; padding: 4px calc(50vw - 50%) 14px; }
.jofo-fbar__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.jofo-fbar__item { position: relative; display: inline-flex; align-items: center; }
button.jofo-fbar__btn, button.jofo-fbar__btn:focus {
	display: inline-flex; align-items: center; gap: 8px; background: #fff; border: 1px solid #c9d2de; color: #333;
	border-radius: 999px; padding: 7px 14px; font: 500 13px 'Roboto', sans-serif; line-height: 1.3; white-space: nowrap;
}
button.jofo-fbar__btn i { font-size: 10px; color: #777; transition: transform .15s; }
button.jofo-fbar__btn:hover { background: #fff; border-color: var(--jofo-primary); color: var(--jofo-primary); }
button.jofo-fbar__btn[aria-expanded="true"] i { transform: rotate(180deg); }
.jofo-fbar__item.is-active button.jofo-fbar__btn, .jofo-fbar__item.is-active button.jofo-fbar__btn:focus { background: var(--jofo-bg-soft); border-color: var(--jofo-primary); color: var(--jofo-primary); padding-right: 34px; }
.jofo-fbar__x { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 10px; color: var(--jofo-primary); background: #fff; }
.jofo-fbar__x:hover { background: var(--jofo-primary); color: #fff; }
.jofo-fbar__reset { font-size: 13px; padding: 7px 6px; }
.jofo-fbar__menu { position: absolute; top: calc(100% + 8px); left: 0; z-index: 80; min-width: 230px; max-height: 360px; overflow: auto; background: #fff; border: 1px solid var(--jofo-border); border-radius: 10px; box-shadow: 0 10px 28px rgba(0, 0, 0, .12); padding: 6px; }
.jofo-fbar__menu ul { list-style: none; margin: 0; padding: 0; }
.jofo-fbar__menu li a, .jofo-fbar__menu li span { display: flex; justify-content: space-between; gap: 16px; padding: 9px 12px; border-radius: 7px; font-size: 14px; color: #333; }
.jofo-fbar__menu li a:hover { background: var(--jofo-bg-soft); color: var(--jofo-primary); }
.jofo-fbar__menu li a[aria-current] { background: var(--jofo-bg-soft); color: var(--jofo-primary); font-weight: 600; }
.jofo-fbar__menu li a[aria-current]::after { content: "\f00c"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 12px; }
.jofo-fbar__menu small { color: #9a9a9a; font-size: 12px; }
.jofo-fbar__menu .is-disabled { color: #b5b5b5; cursor: default; }
.jofo-fbar__checks { display: flex; flex-direction: column; padding: 4px; min-width: 290px; }
.jofo-fbar__checks label { display: flex; align-items: center; gap: 10px; padding: 8px 8px; border-radius: 7px; font-size: 14px; cursor: pointer; line-height: 1.3; }
.jofo-fbar__checks label:hover { background: var(--jofo-bg-soft); }
.jofo-fbar__checks label small { margin-left: auto; }
.jofo-fbar__checks input { width: 16px; height: 16px; accent-color: var(--jofo-primary); }
.jofo-fbar__foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 8px 6px; border-top: 1px solid var(--jofo-border); margin-top: 6px; }
.jofo-fbar__foot a { font-size: 13.5px; }
.jofo-fbar__foot .jofo-btn { padding: 8px 18px; font-size: 13.5px; }

/* Results */
body.jofo-listing .jofo-serp__count { margin: 0 0 12px; }
body.jofo-listing .jofo-serp__panel { top: 132px; max-height: calc(100vh - 148px); }
@media (max-width: 900px) {
	.jofo-fbar__list { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
	.jofo-fbar__list::-webkit-scrollbar { display: none; }
	.jofo-fbar__menu { position: fixed; left: 12px; right: 12px; top: auto; bottom: 12px; max-height: 70vh; }
	.jofo-header__title { font-size: 17px !important; }
}

/* =====================================================================
   Home: "Find Work in the Fields That Fit You" – live categories
   ===================================================================== */
.jofo-panel { width: 100%; align-self: stretch; }
.elementor-widget.jofo-fields-widget, .jofo-fields-widget .elementor-shortcode { width: 100%; }
.jofo-fields { width: 100%; }
.jofo-fields__top { list-style: none; margin: 0 0 26px; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; }
.jofo-fields__top a { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; color: #333; }
.jofo-fields__ico { width: 84px; height: 84px; border-radius: 50%; background: #fff; border: 1px solid #e3e9f1; box-shadow: 0 1px 4px rgba(0, 0, 0, .05); display: inline-flex; align-items: center; justify-content: center; font-size: 30px; transition: .15s; }
.jofo-fields__top a:hover .jofo-fields__ico { border-color: var(--jofo-primary); transform: translateY(-2px); box-shadow: var(--jofo-shadow); }
.jofo-fields__name { font: 500 13.5px/1.35 'Roboto', sans-serif; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; max-width: 100%; }
.jofo-fields__top small { font-size: 12px; color: var(--jofo-muted); margin-top: -4px; }
.jofo-fields__top a:hover .jofo-fields__name { color: var(--jofo-primary); }
.jofo-fields__chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.jofo-fields__chips a { display: inline-flex; align-items: center; gap: 8px; max-width: 300px; padding: 7px 8px 7px 14px; border-radius: 999px; background: #fff; border: 1px solid var(--jofo-border); color: #333; font: 500 13px 'Roboto', sans-serif; transition: .15s; }
.jofo-fields__chips a span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jofo-fields__chips a small { flex: 0 0 auto; min-width: 22px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--jofo-bg-soft); color: var(--jofo-primary); font-size: 11px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }
.jofo-fields__chips a:hover { border-color: var(--jofo-primary); color: var(--jofo-primary); }
.jofo-fields__more { text-align: center; margin: 20px 0 0; font-size: 14px; }
@media (max-width: 1024px) { .jofo-fields__top { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px) {
	.jofo-fields__top { gap: 18px 10px; }
	.jofo-fields__ico { width: 64px; height: 64px; font-size: 24px; }
	.jofo-fields__chips a { max-width: 100%; }
}
/* Two rows of chips at most. */
.jofo-fields__chips { max-height: 82px; overflow: hidden; }
.jofo-fields__chips a { max-width: 220px; }
@media (max-width: 767px) { .jofo-fields__chips { max-height: 128px; } }

/* =====================================================================
   Header popups: title, mini job cards / search panels, "See all" footer
   ===================================================================== */
.jofo-tools__panel { width: 380px; padding: 14px 14px 10px; }
.jofo-pop__title { margin: 0 0 10px; font: 600 16px 'Poppins', sans-serif; color: #222; }
.jofo-pop__title span { color: var(--jofo-muted); font-weight: 400; font-size: 14px; }
.jofo-pop__jobs, .jofo-pop__panels { list-style: none; margin: 0; padding: 0 2px 2px; display: flex; flex-direction: column; gap: 10px; max-height: 420px; overflow: auto; }
.jofo-pop__job { position: relative; border: 1px solid var(--jofo-border); border-radius: 8px; padding: 12px 14px 10px; background: #fff; transition: border-color .15s, box-shadow .15s; }
.jofo-pop__job:hover { border-color: var(--jofo-primary); box-shadow: var(--jofo-shadow); }
a.jofo-pop__jt { display: block; font: 600 14.5px/1.35 'Poppins', sans-serif; color: #222; margin-bottom: 6px; }
a.jofo-pop__jt::after { content: ""; position: absolute; inset: 0; border-radius: 8px; } /* whole card is the link */
.jofo-pop__job:hover a.jofo-pop__jt { color: var(--jofo-primary); text-decoration: underline; }
.jofo-pop__sum { list-style: none; margin: 0; padding: 0; }
.jofo-pop__sum li { font-size: 12.5px; color: #555; line-height: 1.5; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jofo-pop__sum i { width: 14px; color: #9a9a9a; font-size: 11px; margin-right: 3px; }
.jofo-pop__sal { margin: 6px 0 0; font: 500 14px 'Roboto', sans-serif; color: #222; }
.jofo-pop__chip { display: inline-block; margin-top: 6px; background: var(--jofo-bg-soft); color: #4a5a70; font-size: 11.5px; padding: 2px 8px; border-radius: 4px; }
.jofo-pop__chip i { color: var(--jofo-primary); font-size: 10px; margin-right: 2px; }
.jofo-pop__bottom { margin: 8px 0 0; font-size: 11.5px; color: #9a9a9a; display: flex; justify-content: space-between; align-items: center; }
a.jofo-pop__panel { display: flex; flex-direction: column; gap: 3px; border: 1px solid var(--jofo-border); border-radius: 8px; padding: 12px 14px 10px; color: #333; background: #fff; transition: border-color .15s, box-shadow .15s; }
a.jofo-pop__panel:hover { border-color: var(--jofo-primary); box-shadow: var(--jofo-shadow); color: #333; }
.jofo-pop__kw { font: 600 14.5px 'Poppins', sans-serif; color: #222; }
.jofo-pop__kw i { color: var(--jofo-primary); font-size: 12px; margin-right: 4px; }
a.jofo-pop__panel:hover .jofo-pop__kw { color: var(--jofo-primary); }
.jofo-pop__where { font-size: 12.5px; color: #555; }
.jofo-pop__where i { color: #9a9a9a; font-size: 11px; width: 14px; margin-right: 3px; }
.jofo-pop__bottom i { font-size: 10px; color: #b5b5b5; }
.jofo-pop__foot { display: flex; justify-content: space-between; align-items: center; padding: 10px 2px 2px; margin-top: 10px; border-top: 1px solid var(--jofo-border); }
.jofo-pop__foot a { font-size: 14px; font-weight: 500; }
.jofo-pop__foot a i { font-size: 10px; margin-left: 4px; }
@media (max-width: 767px) { .jofo-tools__panel { width: auto; } }

/* All three header popups (Saved / Viewed / Recent Searches): light-blue balloon, white cards inside. */
.jofo-tools__panel { background: #F2F7FD; border-color: #d9e6f5; }
.jofo-tools__panel::before { background: #F2F7FD; border-color: #d9e6f5; }
.jofo-pop__foot { border-top-color: #d9e6f5; }
.jofo-pop__empty span { background: #fff; }

/* =====================================================================
   Results side panel (job detail)
   ===================================================================== */
.jofo-serp__panel { display: flex; flex-direction: column; padding: 0; }
.jofo-detail--panel { display: flex; flex-direction: column; min-height: 0; }
.jofo-detail--panel .jofo-detail__head { position: sticky; top: 0; z-index: 3; background: #fff; padding: 20px 22px 14px; border-bottom: 1px solid var(--jofo-border); }
.jofo-detail__top { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; }
.jofo-detail__title { font: 600 21px/1.3 'Poppins', sans-serif !important; color: #222; margin: 0 0 12px; }
.jofo-detail__logo { width: 52px; height: 52px; }
.jofo-detail__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; }
.jofo-detail__actions .jofo-btn { padding: 10px 20px; font-size: 14px; }
.jofo-detail__actions .jofo-detail__apply { padding: 10px 26px; }
.jofo-btn--icon, button.jofo-btn--icon, button.jofo-btn--icon:focus, a.jofo-btn--icon {
	width: 40px; height: 40px; padding: 0 !important; border-radius: 50%; background: #fff; border: 1px solid #c9d2de; color: #444; display: inline-flex; align-items: center; justify-content: center;
}
button.jofo-btn--icon:hover, a.jofo-btn--icon:hover { background: var(--jofo-bg-soft); border-color: var(--jofo-primary); color: var(--jofo-primary); }
.jofo-detail__scroll { padding: 16px 22px 20px; }
.jofo-detail__summary { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.jofo-detail__summary li { display: flex; align-items: center; gap: 12px; font-size: 14.5px; color: #333; }
.jofo-detail__summary a { color: #333; text-decoration: underline; }
.jofo-detail__chips { margin: 0 0 6px; }
.jofo-detail__sec { padding: 18px 0 4px; border-top: 1px solid var(--jofo-border); margin-top: 14px; }
.jofo-detail__sec .jofo-jp__row:first-of-type { padding-top: 4px; }
.jofo-detail__sec .jofo-jp__row { grid-template-columns: 170px minmax(0, 1fr); }
.jofo-detail__desc { font-size: 15px; }
.jofo-detail__foot { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--jofo-border); font-size: 12.5px; color: var(--jofo-muted); }
.jofo-detail__foot a { color: var(--jofo-muted); }
.jofo-detail__foot a:hover { color: #c0392b; }

/* Similar jobs (panel list + under result cards) */
.jofo-similar { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.jofo-similar a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 10px 12px; border: 1px solid var(--jofo-border); border-radius: 8px; background: #fff; color: #333; }
.jofo-similar a:hover { border-color: var(--jofo-primary); box-shadow: var(--jofo-shadow); }
.jofo-similar strong { font: 600 14px/1.35 'Poppins', sans-serif; color: var(--jofo-primary); grid-column: 1; }
.jofo-similar span { font-size: 12.5px; color: #666; grid-column: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jofo-similar em { font-style: normal; font-size: 11.5px; color: #9a9a9a; grid-column: 2; grid-row: 1 / span 2; align-self: center; white-space: nowrap; }
.jofo-similar__none { margin: 0; font-size: 13px; color: var(--jofo-muted); }
button.jofo-card__similar, button.jofo-card__similar:focus { margin-left: auto; margin-right: 4px; background: none; border: 0; border-radius: 6px; padding: 5px 8px; color: var(--jofo-primary); font: 500 12.5px 'Roboto', sans-serif; display: inline-flex; align-items: center; gap: 6px; }
button.jofo-card__similar:hover { background: var(--jofo-bg-soft); color: var(--jofo-primary); }
button.jofo-card__similar i { font-size: 10px; transition: transform .15s; }
button.jofo-card__similar[aria-expanded="true"] i { transform: rotate(180deg); }
.jofo-card__similar-list { padding: 0 12px 12px; }
.jofo-card__similar-list .jofo-similar a { background: #fafcff; }

/* =====================================================================
   Job alert forms
   ===================================================================== */
.jofo-alert-form { background: linear-gradient(135deg, #eef5ff, #f7fbff); border: 1px solid #d7e5f7; border-radius: 12px; padding: 16px 18px; }
.jofo-alert-form__head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.jofo-alert-form__ico { width: 40px; height: 40px; border-radius: 50%; background: var(--jofo-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 16px; flex: 0 0 auto; }
.jofo-alert-form__title { margin: 0; font: 600 15px 'Poppins', sans-serif; color: #222; }
.jofo-alert-form__sub { margin: 0; font-size: 13px; color: #555; }
.jofo-alert-form__row { display: flex; gap: 8px; flex-wrap: wrap; }
.jofo-alert-form__row input[type=email] { flex: 1 1 200px; min-width: 0; border: 1px solid #c9d2de !important; border-radius: 999px !important; padding: 9px 16px !important; font-size: 14px; background: #fff; }
.jofo-alert-form__row select { flex: 0 0 auto; width: auto; border: 1px solid #c9d2de; border-radius: 999px; padding: 9px 12px; font-size: 14px; background: #fff; }
.jofo-alert-form__row .jofo-btn { padding: 9px 20px; }
.jofo-alert-form__fine { margin: 8px 0 0; font-size: 11.5px; color: #7a8796; }
.jofo-alert-form__msg, .jofo-newsletter__msg { margin: 10px 0 0; font-size: 13.5px; padding: 8px 12px; border-radius: 8px; }
.jofo-alert-form__msg.is-ok { background: #e8f7ee; color: #1d6b3a; }
.jofo-alert-form__msg.is-err { background: #fdecea; color: #a12b1f; }
.jofo-alert-form.is-done .jofo-alert-form__row, .jofo-alert-form.is-done .jofo-alert-form__fine { display: none; }
li.jofo-alert-inline { list-style: none; }
.jofo-alert-sec { border-top: 0; padding-top: 6px; }

/* =====================================================================
   Footer newsletter – card in the space to the right of the link columns
   ===================================================================== */
.elementor-widget.jofo-newsletter-widget { flex: 1 1 360px; max-width: 440px; margin-left: auto; }
.jofo-newsletter { background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .16); border-radius: 14px; padding: 22px 22px 18px; }
.jofo-newsletter__title { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; font: 600 17px 'Poppins', sans-serif; color: #fff; }
.jofo-newsletter__title i { width: 36px; height: 36px; border-radius: 50%; background: #fff; color: var(--jofo-primary); display: inline-flex; align-items: center; justify-content: center; font-size: 14px; flex: 0 0 auto; }
.jofo-newsletter__sub { margin: 0 0 14px; font-size: 13.5px; line-height: 1.55; color: #e3e7ec; }
.jofo-newsletter__row { display: flex; gap: 0; background: #fff; border-radius: 999px; padding: 4px; box-shadow: 0 4px 14px rgba(0, 0, 0, .12); }
.jofo-newsletter__row input[type=email] { flex: 1; min-width: 0; border: 0 !important; box-shadow: none !important; background: transparent; border-radius: 999px !important; padding: 9px 14px !important; font-size: 14px; color: #333; }
.jofo-newsletter__row input[type=email]:focus { outline: 0; }
.jofo-newsletter__row button.jofo-btn, .jofo-newsletter__row button.jofo-btn:focus { padding: 9px 20px; background: var(--jofo-primary); color: #fff; border-color: var(--jofo-primary); white-space: nowrap; }
.jofo-newsletter__row button.jofo-btn:hover { background: var(--jofo-primary-2); }
.jofo-newsletter__fine { display: flex; align-items: center; gap: 6px; margin: 10px 0 0; font-size: 12px; color: #c9d0d8; }
.jofo-newsletter__msg.is-ok { background: rgba(255, 255, 255, .14); color: #fff; }
.jofo-newsletter__msg.is-err { background: #fdecea; color: #a12b1f; }
.jofo-newsletter.is-done .jofo-newsletter__row, .jofo-newsletter.is-done .jofo-newsletter__fine { display: none; }

.jofo-confirm { max-width: 560px; margin: 40px auto; }
.jofo-confirm h1 { font: 600 24px 'Poppins', sans-serif; margin: 14px 0 6px; }
.jofo-toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 300; background: #222; color: #fff; padding: 12px 18px; border-radius: 10px; font-size: 14px; box-shadow: 0 8px 24px rgba(0, 0, 0, .25); max-width: calc(100% - 32px); }

@media (max-width: 1024px) {
	.elementor-widget.jofo-newsletter-widget { flex-basis: 100%; max-width: none; margin-left: 0; }
}
@media (max-width: 767px) {
	.jofo-detail__sec .jofo-jp__row { grid-template-columns: 1fr; }
	.jofo-alert-form__row select, .jofo-alert-form__row .jofo-btn { flex: 1 1 auto; }
}

/* =====================================================================
   Search bars: compact widths, no focus border on the fields
   ===================================================================== */
.jofo-hero .jofo-search, .jofo-hero__search .jofo-search { width: 100%; max-width: 720px; margin-left: auto; margin-right: auto; }
.jofo-hero__search { width: 100%; max-width: 720px !important; margin-left: auto !important; margin-right: auto !important; align-self: center; }
.jofo-header__search { flex: 0 1 620px !important; max-width: 620px !important; }
.jofo-search--compact { max-width: 620px; }

/* Text fields inside the search bar, alert and newsletter forms: no outline / ring / border change on focus. */
.jofo-search input, .jofo-search input:focus, .jofo-search input:focus-visible,
.jofo-alert-form input[type=email], .jofo-alert-form input[type=email]:focus, .jofo-alert-form input[type=email]:focus-visible,
.jofo-newsletter input[type=email], .jofo-newsletter input[type=email]:focus, .jofo-newsletter input[type=email]:focus-visible {
	outline: none !important; box-shadow: none !important;
}
.jofo-alert-form input[type=email]:focus { border-color: #c9d2de !important; }

/* Listing pages: header search fills the row (logo → right edge), in line with the filters and results below. */
body.jofo-listing .jofo-header__search { flex: 1 1 auto !important; max-width: none !important; }
body.jofo-listing .jofo-search--compact { max-width: none; }

/* =====================================================================
   Listing + job pages: nothing full-bleed. Filters, results and the job
   band stay inside the header's content box (1200px, centred).
   ===================================================================== */
body.jofo-listing { background: #fff; }
body.jofo-listing .site-main,
body.single-job_listing .site-main {
	width: min(var(--jofo-wrap, 1200px), 100% - 40px) !important;
	max-width: none !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	box-sizing: border-box;
}
body.jofo-listing .site-main .page-content { width: 100%; max-width: none; margin: 0; padding: 0; }
.jofo-fbar {
	margin: 0 0 18px !important;
	padding: 6px 0 14px !important;
	background: transparent;
	border-bottom: 1px solid var(--jofo-border);
	width: 100%;
}
.jofo-jp__band {
	margin: 24px 0 28px !important;
	padding: 24px 26px 22px !important;
	background: #fff;
	border: 1px solid var(--jofo-border);
	border-radius: 12px;
}

/* Listing pages: light grey page background (#F7F7F7), white header, white cards and panel. */
html:has(body.jofo-listing), body.jofo-listing { background: #F7F7F7; }
body.jofo-listing .jofo-header--inner, body.jofo-listing .elementor-location-header { background: #fff; }
body.jofo-listing .jofo-header--inner { border-bottom: 1px solid var(--jofo-border) !important; }
body.jofo-listing .site-main { padding-top: 18px !important; }
body.jofo-listing .jofo-fbar { border-bottom-color: #e3e3e3; }
body.jofo-listing ul.job_listings li.jofo-card, body.jofo-listing .jofo-serp__panel { background: #fff; }

/* =====================================================================
   Results list: compact alert switch rows + alert pop-up
   ===================================================================== */
li.jofo-alert-toggle {
	list-style: none; display: flex; align-items: center; gap: 12px;
	background: #fff; border: 1px solid var(--jofo-border); border-radius: 10px; padding: 12px 14px;
}
.jofo-alert-toggle__ico { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 50%; background: var(--jofo-bg-soft); color: var(--jofo-primary); display: inline-flex; align-items: center; justify-content: center; font-size: 15px; }
.jofo-alert-toggle__txt { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.jofo-alert-toggle__txt strong { font: 600 14px/1.35 'Poppins', sans-serif; color: #222; }
.jofo-alert-toggle__txt small { font-size: 12px; color: var(--jofo-muted); }

button.jofo-switch, button.jofo-switch:focus, button.jofo-switch:hover {
	flex: 0 0 auto; position: relative; width: 46px; height: 26px; padding: 0; border: 0; border-radius: 999px;
	background: #c9d2de; cursor: pointer; transition: background .2s;
}
button.jofo-switch[aria-checked="true"] { background: var(--jofo-primary); }
.jofo-switch__knob { position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); transition: transform .2s; }
button.jofo-switch[aria-checked="true"] .jofo-switch__knob { transform: translateX(20px); }
button.jofo-switch:focus-visible { outline: 2px solid var(--jofo-primary); outline-offset: 2px; }

.jofo-modal { position: fixed; inset: 0; z-index: 400; display: flex; align-items: center; justify-content: center; padding: 16px; }
.jofo-modal[hidden] { display: none; }
.jofo-modal__backdrop { position: absolute; inset: 0; background: rgba(20, 28, 40, .45); }
.jofo-modal__dialog { position: relative; width: 100%; max-width: 460px; background: #fff; border-radius: 14px; box-shadow: 0 20px 50px rgba(0, 0, 0, .25); padding: 22px 22px 18px; }
.jofo-modal__title { font: 600 19px 'Poppins', sans-serif !important; margin: 0 0 12px; color: #222; padding-right: 30px; }
button.jofo-modal__close, button.jofo-modal__close:focus { position: absolute; top: 12px; right: 12px; width: 34px; height: 34px; border-radius: 50%; border: 0; background: transparent; color: #666; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
button.jofo-modal__close:hover { background: var(--jofo-bg-soft); color: var(--jofo-primary); }
.jofo-alert-form--modal { background: none; border: 0; padding: 0; }
.jofo-alert-form--modal .jofo-alert-form__row { flex-direction: column; }
.jofo-alert-form--modal .jofo-alert-form__row input[type=email], .jofo-alert-form--modal .jofo-alert-form__row select, .jofo-alert-form--modal .jofo-alert-form__row .jofo-btn { width: 100%; flex: 0 0 auto; }
body.jofo-modal-open { overflow: hidden; }

/* =====================================================================
   Alert switch: track colour never depends on focus state
   ===================================================================== */
li.jofo-alert-toggle button.jofo-switch,
li.jofo-alert-toggle button.jofo-switch:hover,
li.jofo-alert-toggle button.jofo-switch:focus,
li.jofo-alert-toggle button.jofo-switch:active { background: #c9d2de !important; border: 0 !important; box-shadow: inset 0 1px 2px rgba(0, 0, 0, .12); }
li.jofo-alert-toggle button.jofo-switch[aria-checked="true"],
li.jofo-alert-toggle button.jofo-switch[aria-checked="true"]:hover,
li.jofo-alert-toggle button.jofo-switch[aria-checked="true"]:focus { background: var(--jofo-primary) !important; }

/* =====================================================================
   Filter row: active pills + professional dropdown options
   ===================================================================== */
.jofo-fbar__item.is-active button.jofo-fbar__btn,
.jofo-fbar__item.is-active button.jofo-fbar__btn:focus,
.jofo-fbar__item.is-active button.jofo-fbar__btn:hover { background: var(--jofo-primary); border-color: var(--jofo-primary); color: #fff; font-weight: 600; padding-right: 36px; }
.jofo-fbar__item.is-active button.jofo-fbar__btn i { color: #fff; }
.jofo-fbar__item.is-active .jofo-fbar__x { background: rgba(255, 255, 255, .22); color: #fff; right: 9px; }
.jofo-fbar__item.is-active .jofo-fbar__x:hover { background: #fff; color: var(--jofo-primary); }
.jofo-fbar__count { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: #fff; color: var(--jofo-primary); font-size: 11px; font-weight: 700; margin-left: 2px; }

.jofo-fbar__menu { padding: 8px; min-width: 260px; border-radius: 12px; box-shadow: 0 12px 32px rgba(16, 24, 40, .14); border-color: #e4e8ee; }
.jofo-fbar__menu-title { margin: 4px 8px 6px; font: 600 12px Roboto, sans-serif; color: #8a94a3; text-transform: uppercase; letter-spacing: .06em; }
.jofo-opts { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.jofo-opt { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 8px; font-size: 14px; color: #2b2b2b; cursor: pointer; line-height: 1.3; text-decoration: none; position: relative; }
a.jofo-opt:hover, label.jofo-opt:hover { background: #f2f7fd; color: #2b2b2b; }
.jofo-opt.is-on, a.jofo-opt.is-on:hover { background: #eef5ff; color: var(--jofo-primary); font-weight: 600; }
.jofo-opt.is-disabled { color: #b4bac3; cursor: default; }
label.jofo-opt.is-disabled:hover { background: none; }
.jofo-opt__label { flex: 1; min-width: 0; }
.jofo-opt__count { flex: 0 0 auto; min-width: 26px; padding: 1px 7px; border-radius: 999px; background: #f1f3f6; color: #6b7480; font-size: 11.5px; text-align: center; font-weight: 500; }
.jofo-opt.is-on .jofo-opt__count { background: #fff; color: var(--jofo-primary); }
.jofo-opt__mark { flex: 0 0 auto; width: 18px; height: 18px; border: 1.5px solid #b9c2ce; background: #fff; position: relative; transition: .15s; }
.jofo-opt__mark--radio { border-radius: 50%; }
.jofo-opt__mark--check { border-radius: 5px; }
.jofo-opt.is-on .jofo-opt__mark--radio { border-color: var(--jofo-primary); }
.jofo-opt.is-on .jofo-opt__mark--radio::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--jofo-primary); }
.jofo-opt__input { position: absolute; opacity: 0; width: 0; height: 0; }
.jofo-opt__input:checked + .jofo-opt__mark--check { background: var(--jofo-primary); border-color: var(--jofo-primary); }
.jofo-opt__input:checked + .jofo-opt__mark--check::after { content: ""; position: absolute; left: 5px; top: 1px; width: 5px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.jofo-opt__input:focus-visible + .jofo-opt__mark { outline: 2px solid var(--jofo-primary); outline-offset: 2px; }
.jofo-fbar__menu--multi { min-width: 300px; }
.jofo-fbar__foot { margin: 8px -8px -8px; padding: 10px 12px; border-top: 1px solid #edf0f4; background: #fafbfd; border-radius: 0 0 12px 12px; }
.jofo-fbar__foot .jofo-btn { padding: 8px 22px; }

/* Salary range slider */
.jofo-fbar__menu--range { min-width: 330px; }
.jofo-range { padding: 2px 8px 0; }
.jofo-range__value { margin: 0 0 14px; font: 600 16px Poppins, sans-serif; color: #222; }
.jofo-range__slider { position: relative; height: 26px; margin: 0 4px 14px; }
.jofo-range__track { position: absolute; left: 0; right: 0; top: 11px; height: 4px; border-radius: 4px; background: #e1e6ed; }
.jofo-range__fill { position: absolute; top: 0; bottom: 0; border-radius: 4px; background: var(--jofo-primary); }
.jofo-range__slider input[type=range] { position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 26px; margin: 0; padding: 0; border: 0; background: none; pointer-events: none; -webkit-appearance: none; appearance: none; }
.jofo-range__slider input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; pointer-events: auto; width: 20px; height: 20px; border-radius: 50%; background: #fff; border: 2px solid var(--jofo-primary); box-shadow: 0 1px 4px rgba(0, 0, 0, .2); cursor: grab; }
.jofo-range__slider input[type=range]::-moz-range-thumb { pointer-events: auto; width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 2px solid var(--jofo-primary); box-shadow: 0 1px 4px rgba(0, 0, 0, .2); cursor: grab; }
.jofo-range__slider input[type=range]::-webkit-slider-runnable-track { background: none; }
.jofo-range__slider input[type=range]::-moz-range-track { background: none; }
.jofo-range__inputs { display: flex; align-items: flex-end; gap: 10px; }
.jofo-range__inputs > i { font-style: normal; color: #9aa3ae; padding-bottom: 9px; }
.jofo-range__inputs label { flex: 1; display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 6px; border: 1px solid #d5dce5; border-radius: 8px; padding: 4px 10px 6px; background: #fff; }
.jofo-range__inputs label span { grid-column: 1 / -1; font-size: 11px; color: #8a94a3; }
.jofo-range__inputs label b { font-size: 13px; color: #6b7480; font-weight: 500; }
.jofo-range__inputs input[type=number] { border: 0 !important; padding: 0 !important; width: 100%; font-size: 14px; background: transparent; outline: none !important; box-shadow: none !important; -moz-appearance: textfield; }
.jofo-range__inputs input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; }
.jofo-range__inputs label:focus-within { border-color: var(--jofo-primary); }
.jofo-range__note { margin: 10px 0 2px; font-size: 11.5px; color: #8a94a3; }

/* =====================================================================
   Alert subscription: switch rows + pop-up
   ===================================================================== */
li.jofo-alert-toggle { padding: 14px 16px; gap: 14px; border-color: #dbe7f6; background: linear-gradient(100deg, #ffffff 0%, #f5f9ff 100%); box-shadow: 0 1px 2px rgba(16, 24, 40, .04); }
.jofo-alert-toggle__ico { width: 42px; height: 42px; background: linear-gradient(135deg, #1a5fc4, #014aac); color: #fff; font-size: 16px; box-shadow: 0 4px 10px rgba(1, 74, 172, .25); }
.jofo-alert-toggle__txt strong { font-size: 14.5px; }
.jofo-alert-toggle__txt small { font-size: 12.5px; color: #6b7480; margin-top: 1px; }

.jofo-modal__dialog { max-width: 440px; padding: 0; overflow: hidden; border-radius: 16px; }
.jofo-modal__title { margin: 0; padding: 22px 56px 0 24px; font-size: 20px !important; }
.jofo-modal .jofo-alert-form--modal { padding: 8px 24px 22px; }
.jofo-alert-form--modal .jofo-alert-form__head { margin: 6px 0 14px; padding: 12px 14px; border-radius: 10px; background: #f2f7fd; }
.jofo-alert-form--modal .jofo-alert-form__ico { width: 36px; height: 36px; font-size: 14px; background: linear-gradient(135deg, #1a5fc4, #014aac); }
.jofo-alert-form--modal .jofo-alert-form__title { font: 500 12px Roboto, sans-serif; color: #6b7480; }
.jofo-alert-form--modal .jofo-alert-form__sub { font: 600 15px Poppins, sans-serif; color: #222; }
.jofo-alert-perks { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 13.5px; color: #444; }
.jofo-alert-perks i { color: #1d9a5b; width: 18px; }
.jofo-alert-form--modal .jofo-alert-form__row { gap: 10px; }
.jofo-alert-form--modal .jofo-alert-form__row input[type=email],
.jofo-alert-form--modal .jofo-alert-form__row select { border-radius: 10px !important; padding: 12px 14px !important; font-size: 14.5px; border: 1px solid #d5dce5 !important; }
.jofo-alert-form--modal .jofo-alert-form__row .jofo-btn { border-radius: 10px; padding: 13px 18px; font-size: 15px; }
.jofo-alert-form--modal .jofo-alert-form__fine { text-align: center; margin-top: 12px; }
.jofo-alert-form.is-done .jofo-alert-perks { display: none; }
.jofo-alert-form__msg.is-ok { display: flex; align-items: flex-start; gap: 10px; padding: 14px; border-radius: 10px; font-size: 14px; }
button.jofo-modal__close, button.jofo-modal__close:focus { top: 16px; right: 16px; background: #f2f4f7; color: #555; }
button.jofo-modal__close:hover { background: #e4e8ee; color: #222; }

/* Results side panel: the header scrolls away, so the panel sticks near the top with no empty band. */
body.jofo-listing .jofo-serp__panel { top: 16px; max-height: calc(100vh - 32px); }
body.jofo-listing.admin-bar .jofo-serp__panel { top: 48px; max-height: calc(100vh - 64px); }

/* =====================================================================
   Scrollbars in dropdowns and panels: thin, brand coloured
   ===================================================================== */
.jofo-pop__jobs, .jofo-pop__panels, .jofo-pop__list, .jofo-fbar__menu, .jofo-suggest, .jofo-serp__panel, .jofo-tools__panel {
	scrollbar-width: thin; scrollbar-color: #a9c2e6 transparent;
}
.jofo-pop__jobs::-webkit-scrollbar, .jofo-pop__panels::-webkit-scrollbar, .jofo-pop__list::-webkit-scrollbar, .jofo-fbar__menu::-webkit-scrollbar, .jofo-suggest::-webkit-scrollbar, .jofo-serp__panel::-webkit-scrollbar, .jofo-tools__panel::-webkit-scrollbar { width: 8px; height: 8px; }
.jofo-pop__jobs::-webkit-scrollbar-track, .jofo-pop__panels::-webkit-scrollbar-track, .jofo-pop__list::-webkit-scrollbar-track, .jofo-fbar__menu::-webkit-scrollbar-track, .jofo-suggest::-webkit-scrollbar-track, .jofo-serp__panel::-webkit-scrollbar-track, .jofo-tools__panel::-webkit-scrollbar-track { background: transparent; margin: 4px 0; }
.jofo-pop__jobs::-webkit-scrollbar-thumb, .jofo-pop__panels::-webkit-scrollbar-thumb, .jofo-pop__list::-webkit-scrollbar-thumb, .jofo-fbar__menu::-webkit-scrollbar-thumb, .jofo-suggest::-webkit-scrollbar-thumb, .jofo-serp__panel::-webkit-scrollbar-thumb, .jofo-tools__panel::-webkit-scrollbar-thumb { background: #a9c2e6; border-radius: 8px; border: 2px solid transparent; background-clip: padding-box; }
.jofo-pop__jobs::-webkit-scrollbar-thumb:hover, .jofo-pop__panels::-webkit-scrollbar-thumb:hover, .jofo-pop__list::-webkit-scrollbar-thumb:hover, .jofo-fbar__menu::-webkit-scrollbar-thumb:hover, .jofo-suggest::-webkit-scrollbar-thumb:hover, .jofo-serp__panel::-webkit-scrollbar-thumb:hover, .jofo-tools__panel::-webkit-scrollbar-thumb:hover { background-color: var(--jofo-primary); }
.jofo-pop__jobs::-webkit-scrollbar-button, .jofo-pop__panels::-webkit-scrollbar-button, .jofo-pop__list::-webkit-scrollbar-button, .jofo-fbar__menu::-webkit-scrollbar-button, .jofo-suggest::-webkit-scrollbar-button, .jofo-serp__panel::-webkit-scrollbar-button, .jofo-tools__panel::-webkit-scrollbar-button { display: none; }

/* =====================================================================
   Shared: directory hero, logo boxes, pagination
   ===================================================================== */
.jofo-dir-hero { background: linear-gradient(135deg, #f2f7fd 0%, #e6f0fc 60%, #e9f8f8 100%); border-bottom: 1px solid #e3ecf7; }
.jofo-dir-hero__inner { width: min(1200px, 100% - 40px); margin: 0 auto; padding: 44px 0 38px; }
.jofo-dir-hero__eyebrow { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 10px; padding: 5px 12px; border-radius: 999px; background: #fff; color: var(--jofo-primary); font: 600 12.5px 'Poppins', sans-serif; box-shadow: 0 1px 2px rgba(16, 24, 40, .06); }
.jofo-dir-hero__title { font: 600 34px/1.2 'Poppins', sans-serif !important; color: #1d2a3a; margin: 0 0 8px; }
.jofo-dir-hero__sub { margin: 0; max-width: 62ch; font-size: 15.5px; color: #4a5768; }
.jofo-dir-hero__sub strong { color: var(--jofo-primary); }
.jofo-dir-search { position: relative; display: flex; gap: 8px; align-items: center; max-width: 560px; margin-top: 22px; padding: 6px 6px 6px 44px; background: #fff; border: 1px solid #d5e1f0; border-radius: 999px; box-shadow: 0 6px 20px rgba(1, 74, 172, .08); }
.jofo-dir-search > i { position: absolute; left: 18px; color: #8a94a3; }
.jofo-dir-search input { flex: 1; min-width: 0; border: 0 !important; outline: 0 !important; box-shadow: none !important; background: transparent; padding: 8px 0 !important; font-size: 15px; }
.jofo-dir-search .jofo-btn { padding: 10px 24px; }

.jofo-clogo { flex: 0 0 auto; width: 64px; height: 64px; border-radius: 12px; border: 1px solid #e6ebf2; background: #fff; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; padding: 6px; box-sizing: border-box; }
.jofo-clogo img { width: 100%; height: 100%; object-fit: contain; border-radius: 0; }
.jofo-clogo--ph { background: linear-gradient(135deg, #e8f1fc, #d6e6fa); color: var(--jofo-primary); font: 600 20px 'Poppins', sans-serif; border-color: transparent; }
.jofo-clogo--sm { width: 44px; height: 44px; border-radius: 10px; padding: 4px; }
.jofo-clogo--sm.jofo-clogo--ph { font-size: 14px; }

.jofo-pagination { margin: 30px 0 6px; text-align: center; }
.jofo-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 38px; padding: 0 10px; margin: 0 3px; border: 1px solid var(--jofo-border); border-radius: 10px; background: #fff; color: #333; font-size: 14px; text-decoration: none; }
.jofo-pagination a.page-numbers:hover { border-color: var(--jofo-primary); color: var(--jofo-primary); }
.jofo-pagination .page-numbers.current { background: var(--jofo-primary); border-color: var(--jofo-primary); color: #fff; }
.jofo-pagination .page-numbers.dots { border: 0; background: none; }

/* ---------- Company directory ---------- */
.jofo-dir, .jofo-blog { width: min(1200px, 100% - 40px); margin: 0 auto; padding: 26px 0 64px; }
.jofo-dir__bar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.jofo-dir__count { margin: 0; font-size: 14px; color: #5b6676; }
.jofo-dir__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 16px; }
.jofo-ccard { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; height: 100%; box-sizing: border-box; padding: 18px; border: 1px solid var(--jofo-border); border-radius: 14px; background: #fff; color: #333; text-decoration: none !important; transition: border-color .15s, box-shadow .15s, transform .15s; }
.jofo-ccard:hover { border-color: #b9cfee; box-shadow: var(--jofo-shadow); transform: translateY(-2px); }
.jofo-ccard__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.jofo-ccard__name { font: 600 15px/1.35 'Poppins', sans-serif; color: #1d2a3a; }
.jofo-ccard__loc { font-size: 13px; color: var(--jofo-muted); }
.jofo-ccard__loc i { color: #a3adba; margin-right: 3px; }
.jofo-ccard__foot { flex-basis: 100%; display: flex; justify-content: space-between; align-items: center; padding-top: 12px; margin-top: auto; border-top: 1px solid #f0f2f5; font-size: 13px; }
.jofo-ccard__jobs { color: #8a94a3; }
.jofo-ccard__jobs.is-hiring { color: #1d7a46; background: #e8f6ee; padding: 3px 10px; border-radius: 999px; font-weight: 500; }
.jofo-ccard__go { color: var(--jofo-primary); font-weight: 500; }
.jofo-ccard__go i { font-size: 11px; margin-left: 3px; transition: transform .15s; }
.jofo-ccard:hover .jofo-ccard__go i { transform: translateX(3px); }
.jofo-dir .jofo-ideas { margin-top: 40px; }

/* ---------- Company profile ---------- */
.jofo-inner--company { background: #f7f9fc; }
.jofo-cp { width: min(1200px, 100% - 40px); margin: 0 auto; padding: 28px 0 64px; }
.jofo-cp__head { display: flex; align-items: center; gap: 22px; padding: 26px 28px; background: #fff; border: 1px solid var(--jofo-border); border-radius: 16px; box-shadow: 0 1px 3px rgba(16, 24, 40, .04); position: relative; overflow: hidden; }
.jofo-cp__head::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 5px; background: linear-gradient(90deg, var(--jofo-primary), var(--jofo-teal)); }
.jofo-cp__logo { flex: 0 0 auto; width: 104px; height: 104px; border-radius: 16px; border: 1px solid #e6ebf2; background: #fff; display: inline-flex; align-items: center; justify-content: center; padding: 10px; box-sizing: border-box; overflow: hidden; }
.jofo-cp__logo img { width: 100%; height: 100%; object-fit: contain; }
.jofo-cp__logo.jofo-cp__logo--ph { background: linear-gradient(135deg, #e8f1fc, #d6e6fa); color: var(--jofo-primary); font: 600 32px 'Poppins', sans-serif; border-color: transparent; }
.jofo-cp__id { flex: 1; min-width: 0; }
.jofo-cp__name { font: 600 28px/1.25 'Poppins', sans-serif !important; color: #1d2a3a; margin: 0 0 4px; }
.jofo-cp__tagline { margin: 0 0 6px; color: #5b6676; font-size: 15px; }
.jofo-cp__facts { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 14px; color: #4a5768; }
.jofo-cp__facts i { color: #8a94a3; margin-right: 4px; }
.jofo-cp__facts a { color: #4a5768; }
.jofo-cp__facts a:hover { color: var(--jofo-primary); }
.jofo-cp__hiring.is-on { color: #1d7a46; font-weight: 500; }
.jofo-cp__hiring.is-on i { color: #1d7a46; }
.jofo-cp__actions { display: flex; flex-direction: column; gap: 8px; flex: 0 0 auto; }
.jofo-cp__cols { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 24px; align-items: start; margin-top: 24px; }
.jofo-cp__main, .jofo-cp__side { display: flex; flex-direction: column; gap: 20px; }
.jofo-cp__side { position: sticky; top: 120px; }
.jofo-cp__card { background: #fff; border: 1px solid var(--jofo-border); border-radius: 14px; padding: 22px 24px; scroll-margin-top: 130px; }
.jofo-cp__h { font: 600 18px 'Poppins', sans-serif !important; color: #1d2a3a; margin: 0 0 14px; }
.jofo-cp__h-row { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.jofo-cp__h-row .jofo-cp__h { margin: 0; }
.jofo-cp__count { min-width: 26px; height: 26px; padding: 0 8px; border-radius: 999px; background: var(--jofo-bg-soft); color: var(--jofo-primary); font: 600 13px 'Poppins', sans-serif; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; }
.jofo-cp__lead { margin: 0; font-size: 15px; line-height: 1.75; color: #4a5768; }
ul.job_listings.jofo-cp__jobs { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; margin: 0 !important; }
.jofo-cp__nojobs { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 18px; border: 1px dashed #d5dde8; border-radius: 12px; background: #fafcff; }
.jofo-cp__nojobs > i { width: 44px; height: 44px; border-radius: 50%; background: var(--jofo-bg-soft); color: var(--jofo-primary); display: inline-flex; align-items: center; justify-content: center; font-size: 17px; }
.jofo-cp__nojobs > div { flex: 1; min-width: 200px; }
.jofo-cp__nojobs strong { font: 600 15px 'Poppins', sans-serif; color: #222; }
.jofo-cp__nojobs p { margin: 2px 0 0; font-size: 13.5px; color: var(--jofo-muted); }
.jofo-cp__dl { margin: 0; }
.jofo-cp__dl > div { display: flex; justify-content: space-between; gap: 14px; padding: 11px 0; border-top: 1px solid #f0f2f5; font-size: 14px; }
.jofo-cp__dl > div:first-child { border-top: 0; padding-top: 0; }
.jofo-cp__dl dt { color: #6b7480; white-space: nowrap; }
.jofo-cp__dl dt i { width: 18px; color: #a3adba; }
.jofo-cp__dl dd { margin: 0; text-align: right; color: #222; font-weight: 500; overflow-wrap: anywhere; }
.jofo-cp__social { list-style: none; margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid #f0f2f5; display: flex; gap: 8px; }
.jofo-cp__social a { width: 36px; height: 36px; border-radius: 50%; background: var(--jofo-bg-soft); color: var(--jofo-primary); display: inline-flex; align-items: center; justify-content: center; }
.jofo-cp__social a:hover { background: var(--jofo-primary); color: #fff; }
.jofo-cp__others { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.jofo-cp__others a { display: flex; align-items: center; gap: 12px; padding: 8px; margin: 0 -8px; border-radius: 10px; color: #333; text-decoration: none; }
.jofo-cp__others a:hover { background: #f5f8fc; }
.jofo-cp__others span { min-width: 0; display: flex; flex-direction: column; }
.jofo-cp__others strong { font: 500 14px/1.3 'Poppins', sans-serif; color: #222; }
.jofo-cp__others small { font-size: 12.5px; color: var(--jofo-muted); }
.jofo-cp__more { display: inline-block; margin-top: 10px; font-size: 14px; font-weight: 500; }

/* ---------- Footer: top companies ---------- */
.jofo-fcomp { padding: 26px 0 28px; margin: 4px 0 26px; border-top: 1px solid rgba(255, 255, 255, .16); border-bottom: 1px solid rgba(255, 255, 255, .16); }
.jofo-fcomp__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 14px; }
.jofo-fcomp__title { margin: 0; font: 600 14px 'Roboto', sans-serif !important; color: #fff; }
.jofo-fcomp__all { color: #fff !important; font-size: 13px; opacity: .85; }
.jofo-fcomp__all:hover { opacity: 1; text-decoration: underline; }
.jofo-fcomp__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(175px, 1fr)); gap: 10px; }
.jofo-fcomp__list a { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; background: rgba(255, 255, 255, .07); color: #fff !important; text-decoration: none; transition: background .15s; min-width: 0; }
.jofo-fcomp__list a:hover { background: rgba(255, 255, 255, .16); }
.jofo-fcomp__logo { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 8px; background: #fff; display: inline-flex; align-items: center; justify-content: center; padding: 3px; box-sizing: border-box; overflow: hidden; color: var(--jofo-primary); font: 600 12px 'Poppins', sans-serif; }
.jofo-fcomp__logo img { width: 100%; height: 100%; object-fit: contain; }
.jofo-fcomp__name { flex: 1; min-width: 0; font-size: 13px; line-height: 1.3; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.jofo-fcomp__list small { flex: 0 0 auto; font-size: 11px; padding: 1px 7px; border-radius: 999px; background: rgba(255, 255, 255, .18); }
.jofo-fcomp-widget { width: 100%; }

/* ---------- Blog list ---------- */
.jofo-topics { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.jofo-topics a { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 999px; background: #fff; border: 1px solid #d5e1f0; color: #344256; font-size: 13.5px; text-decoration: none; }
.jofo-topics a span { font-size: 11.5px; color: #8a94a3; }
.jofo-topics a:hover { border-color: var(--jofo-primary); color: var(--jofo-primary); }
.jofo-topics a[aria-current] { background: var(--jofo-primary); border-color: var(--jofo-primary); color: #fff; }
.jofo-topics a[aria-current] span { color: rgba(255, 255, 255, .8); }
.jofo-blog__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.jofo-pcard { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--jofo-border); border-radius: 14px; overflow: hidden; transition: box-shadow .15s, transform .15s; }
.jofo-pcard:hover { box-shadow: var(--jofo-shadow); transform: translateY(-2px); }
.jofo-pcard__img { display: block; aspect-ratio: 16 / 10; background: #eef3f9; overflow: hidden; }
.jofo-pcard__img img { width: 100%; height: 100%; object-fit: cover; border-radius: 0 !important; transition: transform .3s; }
.jofo-pcard:hover .jofo-pcard__img img { transform: scale(1.04); }
.jofo-pcard__ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: #a9c2e6; font-size: 34px; }
.jofo-pcard__body { flex: 1; display: flex; flex-direction: column; padding: 18px 20px; }
.jofo-pcard__cat { align-self: flex-start; display: inline-block; margin-bottom: 10px; padding: 3px 10px; border-radius: 999px; background: var(--jofo-bg-soft); color: var(--jofo-primary); font: 600 11.5px 'Poppins', sans-serif; text-transform: uppercase; letter-spacing: .04em; text-decoration: none; }
.jofo-pcard__title { font: 600 17px/1.4 'Poppins', sans-serif !important; margin: 0 0 8px; }
.jofo-pcard__title a { color: #1d2a3a; text-decoration: none; }
.jofo-pcard__title a:hover { color: var(--jofo-primary); }
.jofo-pcard__excerpt { margin: 0 0 14px; font-size: 14px; line-height: 1.65; color: #5b6676; }
.jofo-pcard__meta { margin: auto 0 0; display: flex; gap: 6px; font-size: 12.5px; color: #8a94a3; }
.jofo-pcard--lead { grid-column: 1 / -1; flex-direction: row; }
.jofo-pcard--lead .jofo-pcard__img { flex: 0 0 58%; aspect-ratio: auto; min-height: 340px; }
.jofo-pcard--lead .jofo-pcard__body { padding: 32px 34px; justify-content: center; }
.jofo-pcard--lead .jofo-pcard__title { font-size: 26px !important; line-height: 1.3; }
.jofo-pcard--lead .jofo-pcard__excerpt { font-size: 15.5px; }
.jofo-pcard--lead .jofo-pcard__meta { margin-top: 0; }

/* ---------- Blog article ---------- */
.jofo-inner--post { background: #fff; }
.jofo-post { width: min(1200px, 100% - 40px); margin: 0 auto; padding: 36px 0 20px; }
.jofo-post__head { max-width: 820px; margin-bottom: 28px; }
.jofo-post__title { font: 600 38px/1.22 'Poppins', sans-serif !important; color: #1d2a3a; margin: 4px 0 12px; }
.jofo-post__dek { font-size: 18px; line-height: 1.6; color: #4a5768; margin: 0 0 14px; }
.jofo-post__meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0; font-size: 13.5px; color: #6b7480; }
.jofo-post__meta i { color: #a3adba; margin-right: 4px; }
.jofo-post__cols { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 48px; align-items: start; padding-top: 28px; border-top: 1px solid var(--jofo-border); }
.jofo-post__hero { margin: 0 0 26px; border-radius: 14px; overflow: hidden; }
.jofo-post__hero img { width: 100%; height: auto; display: block; }
.jofo-post__body { max-width: 760px; font-size: 17px; line-height: 1.8; color: #2f3a48; }
.jofo-post__body img { max-width: 100%; height: auto; border-radius: 12px; margin: 10px auto 18px !important; }
.jofo-post__body h2 { font-size: 25px !important; margin: 40px 0 14px; }
.jofo-post__body h3 { font-size: 20px !important; }
.jofo-post__body ul, .jofo-post__body ol { padding-left: 22px; margin: 0 0 18px; }
.jofo-post__body li { margin-bottom: 6px; }
.jofo-post__body blockquote { margin: 22px 0; padding: 14px 20px; border-left: 4px solid var(--jofo-primary); background: var(--jofo-bg-soft); border-radius: 0 10px 10px 0; }
.jofo-post__foot { max-width: 760px; margin-top: 34px; display: flex; flex-direction: column; gap: 20px; }
.jofo-post__tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.jofo-post__tags a { font-size: 13px; padding: 4px 10px; border-radius: 6px; background: #f1f4f8; color: #4a5768; }
.jofo-post__share { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 16px 0; border-top: 1px solid var(--jofo-border); border-bottom: 1px solid var(--jofo-border); }
.jofo-post__share > span { font: 600 14px 'Poppins', sans-serif; color: #222; margin-right: 6px; }
.jofo-post__share a, .jofo-post__share button, .jofo-post__share button:focus { width: 38px; height: 38px; padding: 0; border-radius: 50%; border: 1px solid #d5e1f0; background: #fff; color: var(--jofo-primary); display: inline-flex; align-items: center; justify-content: center; }
.jofo-post__share a:hover, .jofo-post__share button:hover { background: var(--jofo-primary); border-color: var(--jofo-primary); color: #fff; }
.jofo-post__nav { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.jofo-post__nav a { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; border: 1px solid var(--jofo-border); border-radius: 12px; color: #1d2a3a; text-decoration: none; }
.jofo-post__nav a:hover { border-color: var(--jofo-primary); }
.jofo-post__nav small { font-size: 12px; color: var(--jofo-muted); }
.jofo-post__nav span { font: 500 14.5px/1.4 'Poppins', sans-serif; }
.jofo-post__next { grid-column: 2; text-align: right; }
.jofo-post__side { position: sticky; top: 120px; display: flex; flex-direction: column; gap: 22px; }
.jofo-post__cta { padding: 22px; border-radius: 14px; background: linear-gradient(150deg, #014aac, #1a5fc4 60%, #12a8c8); color: #fff; }
.jofo-post__cta-ico { width: 40px; height: 40px; border-radius: 10px; background: rgba(255, 255, 255, .18); display: inline-flex; align-items: center; justify-content: center; }
.jofo-post__cta h2 { font: 600 19px 'Poppins', sans-serif !important; color: #fff; margin: 12px 0 4px; }
.jofo-post__cta p { margin: 0 0 14px; font-size: 13.5px; opacity: .9; }
.jofo-post__cta form { display: flex; flex-direction: column; gap: 8px; }
.jofo-post__cta input { border: 0 !important; border-radius: 10px !important; padding: 11px 14px !important; font-size: 14px; }
.jofo-post__cta .jofo-btn { background: #fff; color: var(--jofo-primary) !important; border-radius: 10px; }
.jofo-post__cta .jofo-btn:hover { background: #e9f1fc; }
.jofo-post__latest h2, .jofo-post__related h2 { font: 600 17px 'Poppins', sans-serif !important; color: #1d2a3a; margin: 0 0 12px; }
.jofo-pcard--mini { flex-direction: row; align-items: center; gap: 12px; border: 0; border-radius: 0; padding: 10px 0; border-top: 1px solid #f0f2f5; background: none; }
.jofo-pcard--mini:hover { box-shadow: none; transform: none; }
.jofo-pcard--mini .jofo-pcard__img { flex: 0 0 84px; height: 64px; aspect-ratio: auto; border-radius: 10px; }
.jofo-pcard--mini .jofo-pcard__body { padding: 0; }
.jofo-pcard--mini .jofo-pcard__title { font-size: 13.5px !important; line-height: 1.4; margin: 0 0 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.jofo-pcard--mini .jofo-pcard__meta { font-size: 12px; }
.jofo-post__related { width: min(1200px, 100% - 40px); margin: 0 auto; padding: 36px 0 64px; border-top: 1px solid var(--jofo-border); }
.jofo-post__related h2 { font-size: 22px !important; margin-bottom: 18px; }

/* ---------- Contact ---------- */
.jofo-inner--contact .jofo-inner__body, .jofo-inner--contact .jofo-inner__hero { max-width: 1100px; }
.jofo-cinfo { list-style: none; margin: 0 0 28px; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.jofo-cinfo li { display: flex; flex-direction: column; gap: 4px; padding: 20px 22px; border: 1px solid var(--jofo-border); border-radius: 14px; background: #fff; font-size: 14.5px; color: #4a5768; }
.jofo-cinfo strong { font: 600 15px 'Poppins', sans-serif; color: #1d2a3a; }
.jofo-cinfo a { font-weight: 500; overflow-wrap: anywhere; }
.jofo-cinfo__ico { width: 42px; height: 42px; margin-bottom: 8px; border-radius: 12px; background: linear-gradient(135deg, #1a5fc4, #014aac); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 16px; box-shadow: 0 4px 10px rgba(1, 74, 172, .2); }
.jofo-contact { grid-template-columns: minmax(0, 1fr) 340px; gap: 24px; }
.jofo-contact__form { padding: 28px 30px; border: 1px solid var(--jofo-border); border-radius: 16px; background: #fff; box-shadow: 0 6px 24px rgba(16, 24, 40, .05); }
.jofo-contact__form h2 { font-size: 21px !important; margin: 0 0 4px; color: #1d2a3a; }
.jofo-contact__lead { margin: 0 0 20px; font-size: 14px; color: var(--jofo-muted); }
.jofo-contact__form .jofo-form input, .jofo-contact__form .jofo-form select, .jofo-contact__form .jofo-form textarea { background: #f9fbfd; border-color: #dde4ed !important; padding: 12px 14px !important; border-radius: 10px !important; }
.jofo-contact__form .jofo-form input:focus, .jofo-contact__form .jofo-form select:focus, .jofo-contact__form .jofo-form textarea:focus { background: #fff; }
.jofo-contact__form .jofo-form button { padding: 12px 30px; }
.jofo-contact__side { display: flex; flex-direction: column; gap: 16px; }
.jofo-contact__card { background: #fff; border: 1px solid var(--jofo-border); border-radius: 14px; padding: 20px 22px; }
.jofo-contact__card h3 { font: 600 16px 'Poppins', sans-serif !important; margin: 0 0 10px; color: #1d2a3a; }
.jofo-contact__quick { list-style: none; margin: 0; padding: 0; }
.jofo-contact__quick a { display: flex; align-items: center; gap: 12px; padding: 10px 8px; margin: 0 -8px; border-radius: 10px; text-decoration: none; }
.jofo-contact__quick a:hover { background: #f5f8fc; }
.jofo-contact__quick i { width: 36px; height: 36px; flex: 0 0 auto; border-radius: 10px; background: var(--jofo-bg-soft); color: var(--jofo-primary); display: inline-flex; align-items: center; justify-content: center; }
.jofo-contact__quick span { display: flex; flex-direction: column; }
.jofo-contact__quick strong { font-size: 14px; color: #222; font-weight: 500; }
.jofo-contact__quick small { font-size: 12.5px; color: var(--jofo-muted); }
.jofo-contact__hint { margin: 0 0 12px; }
.jofo-contact__social { list-style: none; margin: 0; padding: 0; display: flex; gap: 8px; }
.jofo-contact__social a { width: 40px; height: 40px; border-radius: 50%; background: var(--jofo-bg-soft); color: var(--jofo-primary); display: inline-flex; align-items: center; justify-content: center; }
.jofo-contact__social a:hover { background: var(--jofo-primary); color: #fff; }

/* ---------- Single job: header + details polish ---------- */
.jofo-jp__titlerow { display: flex; align-items: flex-start; gap: 18px; margin-bottom: 16px; }
.jofo-jp__logo { width: 72px; height: 72px; border-radius: 14px; border: 1px solid #e6ebf2; background: #fff; display: inline-flex; align-items: center; justify-content: center; padding: 6px; box-sizing: border-box; overflow: hidden; }
.jofo-jp__logo img { width: 100%; height: 100%; object-fit: contain; }
.jofo-jp__logo.jofo-jp__logo--ph { background: linear-gradient(135deg, #e8f1fc, #d6e6fa); color: var(--jofo-primary); font: 600 22px 'Poppins', sans-serif; border-color: transparent; }
.jofo-jp__titlerow .jofo-jp__title { margin: 0 0 8px; color: #1d2a3a; }
.jofo-jp__byline { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 14.5px; color: #4a5768; }
.jofo-jp__byline i { color: #a3adba; margin-right: 4px; }
.jofo-jp__byline a { color: var(--jofo-primary); font-weight: 500; }
.jofo-jp__pills { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.jofo-jp__pills li { display: inline-flex; align-items: center; gap: 7px; padding: 7px 13px; border-radius: 999px; background: #f2f5f9; color: #344256; font-size: 13.5px; }
.jofo-jp__pills i { color: var(--jofo-primary); font-size: 12px; }
.jofo-jp__pills .jofo-jp__pill--salary { background: #e8f6ee; color: #1d5e3a; font-weight: 600; }
.jofo-jp__pills .jofo-jp__pill--salary i { color: #1d7a46; }
.jofo-jp__pills .jofo-jp__pill--salary small { font-weight: 400; color: #4d7a60; }
.jofo-jp__pills .jofo-jp__pill--deadline { background: #fff4e5; color: #8a5300; }
.jofo-jp__pills .jofo-jp__pill--deadline i { color: #c27400; }
.jofo-jp__band { position: relative; overflow: hidden; }
.jofo-jp__band::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: linear-gradient(90deg, var(--jofo-primary), var(--jofo-teal)); }
.jofo-jp__chips a { border-radius: 999px; padding: 4px 12px; text-decoration: none; }
.jofo-jp__box { border-radius: 14px; padding: 20px; }
.jofo-jp__box-title { font-size: 15.5px; }
.jofo-jp__card { border-radius: 14px; padding: 24px 26px; }
.jofo-jp__h { display: flex; align-items: center; gap: 10px; font-size: 18px !important; }
.jofo-jp__h::before { content: ""; width: 4px; height: 18px; border-radius: 2px; background: var(--jofo-primary); }
.jofo-jp__similar .jofo-jp__h::before, .jofo-jp__company .jofo-jp__h::before { display: none; }
.jofo-jp__desc { font-size: 15.5px; line-height: 1.8; color: #2f3a48; }
/* Details: two-column fact tiles instead of a table */
.jofo-jp__main .jofo-jp__card:has(.jofo-jp__row) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.jofo-jp__main .jofo-jp__card:has(.jofo-jp__row) .jofo-jp__h { grid-column: 1 / -1; margin-bottom: 2px; }
.jofo-jp__main .jofo-jp__row, .jofo-jp__main .jofo-jp__row:first-of-type { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin: 0; padding: 14px 16px; border: 1px solid #edf1f6; border-radius: 12px; background: #fafcfe; }
.jofo-jp__main .jofo-jp__row dt { font-size: 12.5px; color: #6b7480; font-weight: 500; text-transform: uppercase; letter-spacing: .03em; }
.jofo-jp__main .jofo-jp__row dt .jofo-jp__ico { width: 28px; height: 28px; font-size: 12px; }
.jofo-jp__main .jofo-jp__row dd { font-size: 15px; font-weight: 500; color: #1d2a3a; padding-left: 38px; }
.jofo-jp__bottom { padding: 14px 18px; border: 1px solid var(--jofo-border); border-radius: 14px; background: #fafcfe; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
	.jofo-cp__cols, .jofo-post__cols { grid-template-columns: 1fr; }
	.jofo-cp__side, .jofo-post__side { position: static; }
	.jofo-blog__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.jofo-contact { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
	.jofo-dir-hero__inner { padding: 30px 0 26px; }
	.jofo-dir-hero__title { font-size: 26px !important; }
	.jofo-dir-search { padding-left: 40px; }
	.jofo-dir-search .jofo-btn { padding: 9px 16px; }
	.jofo-cp__head { flex-direction: column; align-items: flex-start; padding: 22px 18px; gap: 14px; }
	.jofo-cp__logo { width: 84px; height: 84px; }
	.jofo-cp__name { font-size: 23px !important; }
	.jofo-cp__actions { flex-direction: row; flex-wrap: wrap; width: 100%; }
	.jofo-cp__actions .jofo-btn { flex: 1; }
	.jofo-cp__card { padding: 18px 16px; }
	.jofo-blog__grid { grid-template-columns: 1fr; gap: 18px; }
	.jofo-pcard--lead { flex-direction: column; }
	.jofo-pcard--lead .jofo-pcard__img { flex: none; min-height: 0; aspect-ratio: 16 / 10; }
	.jofo-pcard--lead .jofo-pcard__body { padding: 18px 20px; }
	.jofo-pcard--lead .jofo-pcard__title { font-size: 20px !important; }
	.jofo-post { padding-top: 24px; }
	.jofo-post__title { font-size: 27px !important; }
	.jofo-post__cols { gap: 32px; padding-top: 20px; }
	.jofo-post__body { font-size: 16px; }
	.jofo-post__nav { grid-template-columns: 1fr; }
	.jofo-post__next { grid-column: auto; }
	.jofo-cinfo { grid-template-columns: 1fr; }
	.jofo-contact__form { padding: 20px 18px; }
	.jofo-fcomp__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.jofo-jp__titlerow { gap: 12px; }
	.jofo-jp__logo { width: 52px; height: 52px; }
	.jofo-jp__main .jofo-jp__card:has(.jofo-jp__row) { grid-template-columns: 1fr; }
	.jofo-jp__main .jofo-jp__row dd { padding-left: 0; }
}