/* Job openings list - filter chips, department groups and role rows. */
.jo { display: grid; gap: 12px; }
.jo-title { margin: 0; font-size: 1.2em; line-height: 1.25; font-weight: 750; letter-spacing: -.015em; color: var(--e-ink); overflow-wrap: anywhere; }
.jo-none { margin: 0; padding: 14px; border-radius: 12px; background: var(--e-surface); color: var(--e-ink-2); }
.jo-filters { display: grid; gap: 8px; padding: 10px 12px; border-radius: 12px; background: var(--e-surface); border: 1px solid var(--e-line); }
.jo-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.jo-chips-l { font-size: .74em; font-weight: 750; text-transform: uppercase; letter-spacing: .06em; color: var(--e-ink-3); min-width: 82px; }
.jo-chip {
    font: inherit; font-size: .82em; font-weight: 650; cursor: pointer; min-height: 40px; padding: 4px 13px; border-radius: 999px;
    border: 1px solid var(--e-line-strong); background: var(--e-bg); color: var(--e-ink-2);
}
.jo-chip:hover { border-color: var(--e-accent); color: var(--e-accent-fg); }
.jo-chip[aria-pressed="true"] { background: var(--e-ink); border-color: var(--e-ink); color: var(--e-bg); }
.jo-count { margin: 0; font-size: .8em; color: var(--e-ink-3); }
.jo-body { display: grid; gap: 14px; }
.jo-dept { display: grid; gap: 6px; }
.jo-dept-title { margin: 0; font-size: .78em; font-weight: 750; text-transform: uppercase; letter-spacing: .07em; color: var(--e-ink-3); display: flex; align-items: center; gap: 8px; }
.jo-dept-title::after { content: ""; flex: 1; height: 1px; background: var(--e-line); }
.jo-dept-n { font-size: .95em; padding: 0 7px; border-radius: 999px; background: var(--e-surface-2); color: var(--e-ink-2); letter-spacing: 0; }
.jo-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.jo-job {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 14px; padding: 13px 14px;
    border-radius: calc(var(--e-radius) - 4px); border: 1px solid var(--e-line); background: var(--e-bg);
    transition: border-color .15s var(--e-ease), box-shadow .15s var(--e-ease);
}
.jo-job:hover { border-color: color-mix(in srgb, var(--e-accent) 40%, var(--e-line)); box-shadow: 0 4px 14px rgba(16, 22, 43, .06); }
.jo-main { flex: 1 1 220px; min-width: 0; display: grid; gap: 5px; }
.jo-name { margin: 0; font-size: 1em; line-height: 1.3; font-weight: 700; color: var(--e-ink); overflow-wrap: anywhere; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.jo-new { font-size: .72em; font-weight: 750; letter-spacing: .03em; text-transform: uppercase; padding: 2px 8px; border-radius: 999px; color: var(--e-ok); background: color-mix(in srgb, var(--e-ok) 13%, var(--e-bg)); border: 1px solid color-mix(in srgb, var(--e-ok) 35%, transparent); }
.jo-meta { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: .84em; color: var(--e-ink-2); }
.jo-meta li { display: inline-flex; align-items: center; gap: 5px; min-width: 0; overflow-wrap: anywhere; }
.jo-i { width: 15px; height: 15px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.jo-meta .jo-i { color: var(--e-ink-3); }
.jo-when { margin: 0; font-size: .78em; color: var(--e-ink-3); }
.jo-apply { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; min-height: 40px; border-radius: 999px; padding: 8px 16px; }
.jo-apply .jo-i { width: 16px; height: 16px; }
@media (max-width: 380px) { .jo-apply { flex: 1 1 100%; justify-content: center; } .jo-chips-l { min-width: 0; flex-basis: 100%; } }
html[data-compact="1"] .jo-job { padding: 10px 11px; }
