/* Pages and plain (non-Feature) posts. Uses prose. */
.c-entry__media { margin: 0 0 var(--space-8); overflow: hidden; border-radius: var(--radius-lg); background: var(--pn-gray-100); aspect-ratio: 16 / 9; }
.c-entry__media img { width: 100%; height: 100%; object-fit: cover; }
.c-entry__content { margin-inline: auto; }
.container--detail .c-prose { margin-inline: auto; }

.c-entry__tags { display: flex; flex-wrap: wrap; gap: var(--space-2); max-width: var(--measure); margin: var(--space-8) auto 0; }
.c-entry__tags a { display: inline-flex; align-items: center; min-height: 32px; padding: 0 var(--space-3); font-size: var(--fs-13); font-weight: var(--fw-medium); color: var(--color-text-2); text-decoration: none; background: var(--pn-gray-100); border-radius: var(--radius-pill); }
.c-entry__tags a:hover { background: var(--pn-brand-50); color: var(--color-primary); }

/* Previous / next post */
.c-post-nav { max-width: var(--measure); margin: var(--space-10) auto 0; }
.c-post-nav .nav-links { display: grid; gap: var(--space-4); }
@media (min-width: 640px) { .c-post-nav .nav-links { grid-template-columns: repeat(2, minmax(0, 1fr)); } .c-post-nav .nav-next { grid-column: 2; text-align: right; } }
.c-post-nav a { display: grid; gap: var(--space-1); height: 100%; padding: var(--space-4) var(--space-5); text-decoration: none; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease); }
@media (hover: hover) { .c-post-nav a:hover { border-color: var(--pn-brand-300); box-shadow: var(--shadow-hover); } }
.c-post-nav__label { font-size: var(--fs-12); font-weight: var(--fw-semibold); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--color-text-muted); }
.c-post-nav__title { font-weight: var(--fw-semibold); color: var(--color-heading); }

/* App pages (WPJM, Cariera, Woo shortcodes or Elementor content): no prose rhythm, full container width. */
.l-app { min-width: 0; }

/* Elementor-built pages: sections are transparent, so in dark mode the page follows the dark tokens (no white slab). */
[data-theme="dark"] body.elementor-page .elementor {
	--text-primary: inherit; --text-secondary: inherit; --foreground: inherit; --foreground-muted: inherit; --text-muted: inherit; --primary: inherit; --background: inherit; --background-secondary: inherit;
	--color-text: inherit; --color-text-2: inherit; --color-text-muted: inherit; --color-heading: inherit; --color-link: inherit; --color-primary: inherit; --color-bg: inherit; --color-surface: inherit; --color-border: inherit;
	--e-global-color-text: #c4c3d6; --e-global-color-secondary: #fff;
	color-scheme: dark; color: #c4c3d6; background: none; border-radius: 0;
}
[data-theme="dark"] body.elementor-page .elementor :is(h1, h2, h3, h4, h5, h6, .elementor-heading-title) { color: #fff; }
[data-theme="dark"] body.elementor-page .elementor a:not(.elementor-button):not(.btn):not(.c-btn):not(.elementor-alert a) { color: #92adfe; }

/* CLS + gutter: Elementor JS stretches "stretched" sections to the viewport after load (layout jump, gutter lost).
   Keep them at the container width from first paint. */
.l-app .elementor-section.elementor-section-stretched { width: 100% !important; left: 0 !important; margin-left: 0 !important; }
.l-app .elementor-section.elementor-section-boxed > .elementor-container { max-width: 100%; }

/* Pages without a page header: clear the fixed header (~70px + 16px; the admin bar shifts the header by 32/46px). */
.l-clear-header { padding-top: calc(86px + var(--space-4, 16px)); }
body.admin-bar .l-clear-header { padding-top: calc(118px + var(--space-4, 16px)); }

/* Cariera forms inside pages (/sign-up/ etc.): readable submit labels. */
.site-main :is(input[type="submit"], button[type="submit"]):is(.btn-main, .btn-effect, .btn) { color: #fff; -webkit-text-fill-color: #fff; background-color: #303af7; border-color: #303af7; }
[data-theme="dark"] .site-main :is(input[type="submit"], button[type="submit"]):is(.btn-main, .btn-effect, .btn) { color: #0a071a; -webkit-text-fill-color: #0a071a; background-color: #7091ff; border-color: #7091ff; }

/* Elementor text contrast (AA): kit greys are ~3-4:1 on white. */
/* Kit greys via variable: widgets with their own colour (white hero text) keep it. */
body.elementor-page .elementor { --e-global-color-text: #3f3d56; }
body.elementor-page .elementor a.elementor-button, body.elementor-page .elementor .elementor-button { color: #fff; background-color: #303af7; }
body.elementor-page .elementor a:not(.elementor-button):not(.btn):not(.c-btn) { color: #2227c1; }

/* Cariera login/register widget: dark card with dark tokens in dark mode (undoes the light pin above). */
[data-theme="dark"] body.elementor-page .elementor .elementor-widget-login_register .elementor-widget-container {
	color-scheme: dark;
	--text-primary: #fff; --text-secondary: #a09fb7; --foreground: #fff; --text-muted: #a09fb7; --primary: #7091ff;
	--color-text: #fff; --color-text-2: #a09fb7; --color-heading: #fff; --color-surface: #110c2a; --color-border: #ffffff1a;
	background: #110c2a; color: #a09fb7; padding: var(--space-6, 24px); border: 1px solid #ffffff1a; border-radius: var(--radius-lg, 16px);
}
[data-theme="dark"] body.elementor-page .elementor .elementor-widget-login_register :is(label, h6, h4, h1, h2, h3) { color: #fff; }
[data-theme="dark"] body.elementor-page .elementor .elementor-widget-login_register :is(input.form-control, input[type="text"], input[type="email"], input[type="password"]) { color: #fff; background: #0a071a; border-color: #ffffff33; }
.user-roles-wrapper { display: grid; gap: var(--space-3, 12px); }
@media (min-width: 640px) { .user-roles-wrapper { grid-template-columns: 1fr 1fr; } }
.user-roles-wrapper .user-role label { display: flex; align-items: center; gap: var(--space-3, 12px); margin: 0; padding: var(--space-3, 12px) var(--space-4, 16px); border: 1px solid currentColor; border-radius: var(--radius-md, 8px); cursor: pointer; }
.user-roles-wrapper .user-role { position: relative; }
.user-roles-wrapper .user-role-radio { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.user-roles-wrapper .user-role-radio:checked + label { border-color: #7091ff; box-shadow: 0 0 0 2px #7091ff; }
.user-roles-wrapper .user-role-radio:focus-visible + label { outline: 2px solid #7091ff; outline-offset: 2px; }

/* Round 6: Elementor buttons keep AA fill whatever the widget's own colour; dark sign-up card links/text follow dark tokens. */
body.elementor-page .elementor a.elementor-button, body.elementor-page .elementor .elementor-button { background-color: #303af7 !important; color: #fff !important; }
[data-theme="dark"] body.elementor-page .elementor .elementor-widget-login_register :is(a, a:not(.elementor-button):not(.btn):not(.c-btn)) { color: #92adfe; }
[data-theme="dark"] body.elementor-page .elementor .elementor-widget-login_register :is(p, span, li, small, div, .status) { color: #c4c3d6; }
[data-theme="dark"] body.elementor-page .elementor .elementor-widget-login_register :is(h1, h2, h3, h4, h5, h6, label) { color: #fff; }
[data-theme="dark"] body.elementor-page .elementor .elementor-widget-login_register :is(input[type="submit"], button[type="submit"]) { color: #0a071a; }

/* QA R4 r6: links inside form text (e.g. the sign-up Privacy Policy link) need a non-colour cue (axe link-in-text). */
.site-main form label a, .site-main form p a { text-decoration: underline; text-underline-offset: 2px; }

/* Round 6 R3: 24px checkbox targets, Inter + sane heading sizes in Elementor content. */
body.elementor-page .elementor input[type="checkbox"], body.elementor-page .elementor input[type="radio"].user-role-radio + label { min-width: 24px; min-height: 24px; }
body.elementor-page .elementor input[type="checkbox"] { width: 24px; height: 24px; margin: 0 var(--space-2, 8px) 0 0; vertical-align: middle; }
body.elementor-page .elementor :is(h1, h2, h3, h4, .elementor-heading-title) { font-family: var(--font-sans, "Inter", system-ui, sans-serif); overflow-wrap: anywhere; }
body.elementor-page .elementor :is(h1, h1.elementor-heading-title) { font-size: clamp(1.75rem, 1.2rem + 2.5vw, 3rem); line-height: 1.15; }
#check-privacy, #wp-comment-cookies-consent { width: 24px; height: 24px; min-width: 24px; }
.poea-page-h1 { margin-bottom: var(--space-4, 16px); }
/* Cariera .btn-main links inside Elementor (FAQ "Contact us"): fill is #303af7 in both themes, so the label stays white. */
body.elementor-page .elementor a.btn-main { color: #fff; -webkit-text-fill-color: #fff; }
/* Legal pages: section titles and body copy set as heading widgets keep AA (>= 4.5:1); the dark hero h2 is untouched. */
body.poea-legal.elementor-page .elementor .elementor-widget-heading :is(h3, h4, h5, h6, [data-hl]).elementor-heading-title { color: #2227c1; }
body.poea-legal.elementor-page .elementor .elementor-widget-heading :is(p, div, span).elementor-heading-title { color: #4a4560; }
[data-theme="dark"] body.poea-legal.elementor-page .elementor .elementor-widget-heading :is(h3, h4, h5, h6, [data-hl]).elementor-heading-title { color: #92adfe; }
[data-theme="dark"] body.poea-legal.elementor-page .elementor .elementor-widget-heading :is(p, div, span).elementor-heading-title { color: #c4c3d6; }
.poea-page-h1 { color: var(--text-primary); }
/* Call-to-action ribbons: black ribbon, white label (the inherited dark text was unreadable). */
body.elementor-page .elementor .elementor-ribbon-inner { color: #fff; }

/* QA r8: contact intro paragraph is kit grey #737883 (4.07:1 on white, 4.4:1 on dark). */
body.elementor-page .elementor-6938 .elementor-element.elementor-element-c45dd7a, body.elementor-page .elementor-6938 .elementor-element.elementor-element-c45dd7a p { color: #55546a; }
[data-theme="dark"] body.elementor-page .elementor-6938 .elementor-element.elementor-element-c45dd7a, [data-theme="dark"] body.elementor-page .elementor-6938 .elementor-element.elementor-element-c45dd7a p { color: #c4c3d6; }

/* QA r8: Elementor sections with a hard-coded near-white fill (about-us, contact, hiring, work-abroad) follow the dark surface. Light mode untouched. */
[data-theme="dark"] body.elementor-page .elementor :is(.elementor-element-4ad6a009, .elementor-element-1bf6cb83, .elementor-element-c16c58, .elementor-element-64adc637, .elementor-element-17e188e4, .elementor-element-77daa09c, .elementor-element-6648b7ba, .elementor-element-5907afe, .elementor-element-4ebda3c) { background-color: var(--background-secondary) !important; }

/* QA r8: sign-up (dark): the card is the login widget itself, so the white Elementor column behind it goes transparent. */
[data-theme="dark"] body.elementor-page .elementor .elementor-widget-wrap.elementor-element-populated:has(> .elementor-widget-login_register) { background-color: transparent !important; }
/* reCAPTCHA is a fixed 304x78 iframe: scale it to fit narrow cards instead of overflowing. */
.g-recaptcha { --rc: 1; transform-origin: 0 0; transform: scale(var(--rc)); height: calc(78px * var(--rc)); max-width: 100%; }
@media (max-width: 420px) { .g-recaptcha { --rc: .85; } }
@media (max-width: 350px) { .g-recaptcha { --rc: .68; } }
.user-roles-wrapper .user-role h4 { margin: 0; font-size: 16px; line-height: 26px; font-weight: 600; letter-spacing: normal; text-transform: none; color: inherit; }

/* QA r8 (dark follow-ups): category tiles, contact form, A-Z "All", CTA cards and grey kit text. */
[data-theme="dark"] body.elementor-page .elementor .listing-category > a { background-color: var(--popover-bg) !important; }
[data-theme="dark"] body.elementor-page .elementor :is(label, .wpcf7-form p) { color: #c4c3d6; }
[data-theme="dark"] body.elementor-page .elementor .wpcf7-submit { color: #2f2e41; }
[data-theme="dark"] body.is-company-listing.elementor-page .elementor .companies-listing-a-z .company-letters a.c-tag.chosen { color: #fff; }
body.elementor-page .elementor .elementor-cta__content-item, body.elementor-page .elementor .elementor-cta__description, body.elementor-page .elementor .elementor-cta__content-item .elementor-content-item { color: #55546a !important; }
body.elementor-page .elementor-element-9f02932 h5, body.elementor-page .elementor-element-27ef10b h5 { color: #5f5f6a !important; }
[data-theme="dark"] body.elementor-page .elementor .elementor-cta__bg-overlay { background-color: var(--popover-bg) !important; }
[data-theme="dark"] body.elementor-page .elementor :is(.elementor-cta__content-item, .elementor-cta__description, .elementor-content-item) { color: #c4c3d6 !important; }
[data-theme="dark"] body.elementor-page .elementor-element-9f02932 h5, [data-theme="dark"] body.elementor-page .elementor-element-27ef10b h5 { color: #c4c3d6 !important; }

/* QA r8: headings lowered for outline order keep their original look. */
body.elementor-page .elementor [data-hl="3"].elementor-heading-title { font-size: var(--fs-18, 18px); line-height: var(--lh-18, 1.5); font-weight: var(--fw-semibold, 600); }
body.elementor-page .elementor :is([data-hl="4"], [data-hl="5"], [data-hl="6"]).elementor-heading-title { font-size: var(--fs-16, 16px); line-height: var(--lh-16, 1.5); font-weight: var(--fw-semibold, 600); }