/* =========================================================================
 * Careers — block 2, the job list.
 *
 * A dark list in the catalogue tokens (Integrations / FAQ): a graphite
 * background with a grid and a teal glow, the heading and the counter,
 * compact filters (three selects), row cards with the title, three properties
 * and the VIEW POSITION button. The section is data-tall (--ms-scale = 1).
 * Animation only on an event (card hover); with reduced motion there are no
 * transitions.
 * ====================================================================== */

.lmx-jl-inner{position:relative;width:100%;min-height:100vh;background:#050708 !important;color:#fff;font-family:var(--lmx-ms-font,'Hanken Grotesk',Helvetica,Arial,sans-serif);padding:0 var(--lmx-section-padding-x);box-sizing:border-box;overflow:hidden;--jl-accent:#52C7C6;--jl-accent-hi:#83DAD9;--jl-on-accent:#04211F;--jl-line:rgba(255,255,255,.10);--jl-line-hi:rgba(255,255,255,.18);--jl-surface:rgba(255,255,255,.035);--jl-surface-hi:rgba(255,255,255,.065);--jl-muted:rgba(255,255,255,.58);--jl-text:rgba(255,255,255,.86)}
.lmx-jl-inner *{box-sizing:border-box;min-width:0}

.lmx-jl-bg{position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(60% 34% at 50% 0%,rgba(82,199,198,.14),transparent 70%),radial-gradient(40% 30% at 85% 60%,rgba(82,199,198,.05),transparent 70%)}
.lmx-jl-bg::before{content:'';position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(70% 55% at 50% 22%,#000 20%,transparent 100%);mask-image:radial-gradient(70% 55% at 50% 22%,#000 20%,transparent 100%)}
.lmx-jl-bg::after{content:'';position:absolute;left:50%;top:0;width:min(720px,80%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(82,199,198,.55),transparent)}

.lmx-jl-wrap{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:clamp(56px,7vw,96px) 0 clamp(64px,8vw,104px)}

/* --- header -------------------------------------------------------------------- */
.lmx-jl-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:12px 32px;margin-bottom:28px}
.lmx-jl-eyebrow{margin:0 0 12px !important;font-family:var(--lmx-ms-font) !important;font-weight:600;font-size:13px !important;letter-spacing:.34em;text-transform:uppercase;color:var(--jl-accent) !important;line-height:1.4 !important}
.lmx-jl-title{margin:0 !important;font-family:var(--lmx-ms-display,'Outfit','Poppins',sans-serif) !important;font-weight:300 !important;font-size:clamp(36px,4.6vw,64px) !important;line-height:1.05 !important;letter-spacing:-.02em;color:#fff !important;text-wrap:balance}
.lmx-jl-intro{margin:14px 0 0 !important;max-width:620px;font-family:var(--lmx-ms-font) !important;font-size:17px !important;line-height:1.55 !important;font-weight:300;color:var(--jl-muted) !important}
.lmx-jl-count{align-self:end;margin:0 0 6px !important;padding:8px 14px;border:1px solid var(--jl-line);border-radius:999px;background:var(--jl-surface);font-family:var(--lmx-ms-font) !important;font-size:14px !important;letter-spacing:.04em;color:var(--jl-text) !important;white-space:nowrap;font-variant-numeric:tabular-nums}

/* --- filters ------------------------------------------------------------------- */
.lmx-jl-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:14px 16px;align-items:end;margin:0 0 30px;padding:18px 20px 20px;border:1px solid var(--jl-line);border-radius:16px;background:rgba(255,255,255,.025)}
.lmx-jl-filter{display:grid;gap:8px}
.lmx-jl-filter__label{font-family:var(--lmx-ms-font);font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--jl-muted)}
.lmx-jl-filter__box{position:relative}
.lmx-jl-inner .lmx-jl-filter__select{display:block;width:100%;height:48px;margin:0;padding:0 42px 0 14px;border:1px solid var(--jl-line-hi);border-radius:10px;background:rgba(255,255,255,.045);color:#fff;font-family:var(--lmx-ms-font);font-size:15px;line-height:1.2;cursor:pointer;-webkit-appearance:none;appearance:none;transition:border-color .2s ease,box-shadow .2s ease}
.lmx-jl-inner .lmx-jl-filter__select option{color:#fff;background:#14191b}
.lmx-jl-inner .lmx-jl-filter__select:hover{border-color:rgba(255,255,255,.3)}
.lmx-jl-inner .lmx-jl-filter__select:focus{outline:none;border-color:var(--jl-accent);box-shadow:0 0 0 3px rgba(82,199,198,.18)}
.lmx-jl-filter__chev{position:absolute;right:14px;top:50%;width:18px;height:18px;transform:translateY(-50%);color:var(--jl-accent);pointer-events:none}
/* The custom list (assets/js/shared/select.js) draws its own chevron inside
   the button, so the native fallback one — for the no-JS case — is removed
   and the right padding no longer reserves room for it. */
.lmx-jl-filter__box .lmx-sel ~ .lmx-jl-filter__chev{display:none}
.lmx-jl-inner .lmx-sel__btn.lmx-jl-filter__select{padding-right:14px}
.lmx-jl-filters__tools{display:flex;align-items:center;gap:12px}
.lmx-jl-inner .lmx-jl-apply{min-height:48px}
.lmx-jl-js .lmx-jl-apply{display:none}
.lmx-jl-clear{display:inline-flex;align-items:center;min-height:44px;font-family:var(--lmx-ms-font);font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--jl-accent) !important;text-decoration:none !important;border-bottom:1px solid transparent;transition:color .2s ease,border-color .2s ease}
.lmx-jl-clear:hover{color:var(--jl-accent-hi) !important;border-bottom-color:currentColor}
.lmx-jl-clear[hidden]{display:none}

/* --- list ---------------------------------------------------------------------- */
.lmx-jl-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.lmx-jl-item[hidden]{display:none}
.lmx-jl-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px 28px;padding:24px 26px;border:1px solid var(--jl-line);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));box-shadow:0 1px 0 rgba(255,255,255,.03) inset;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease,background .25s ease}
.lmx-jl-card::before{content:'';position:absolute;left:0;top:18px;bottom:18px;width:2px;background:linear-gradient(180deg,var(--jl-accent),transparent);opacity:.7;border-radius:2px}
.lmx-jl-card:hover,.lmx-jl-card:focus-within{transform:translateY(-3px);border-color:rgba(82,199,198,.6);background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));box-shadow:0 0 0 1px rgba(82,199,198,.3),0 18px 44px rgba(0,0,0,.5),0 0 30px rgba(82,199,198,.14)}
.lmx-jl-card__main{display:flex;flex-direction:column;gap:12px}
.lmx-jl-card__title{margin:0 !important;font-family:var(--lmx-ms-display,'Outfit','Poppins',sans-serif) !important;font-weight:400 !important;font-size:clamp(20px,2vw,26px) !important;line-height:1.2 !important;letter-spacing:-.01em;color:#fff !important}
.lmx-jl-card__link{color:#fff !important;text-decoration:none !important;transition:color .2s ease}
.lmx-jl-card__link:hover{color:var(--jl-accent-hi) !important}
.lmx-jl-card__link:focus-visible{outline:2px solid var(--jl-accent);outline-offset:4px}
.lmx-jl-card__meta{display:flex;flex-wrap:wrap;gap:8px 22px;margin:0}
.lmx-jl-card__prop{display:flex;align-items:baseline;gap:8px;margin:0}
.lmx-jl-card__prop dt{margin:0;font-family:var(--lmx-ms-font);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--jl-accent)}
.lmx-jl-card__prop dd{margin:0;font-family:var(--lmx-ms-font);font-size:15px;color:var(--jl-text)}
.lmx-jl-inner .lmx-jl-card__btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;white-space:nowrap}
.lmx-jl-inner .lmx-jl-card__btn .lmx-fx-arrow{width:18px;height:18px}

/* --- empty state --------------------------------------------------------------- */
.lmx-jl-empty{display:flex;flex-direction:column;align-items:center;gap:18px;padding:56px 24px;border:1px dashed rgba(82,199,198,.35);border-radius:18px;background:rgba(82,199,198,.04);text-align:center}
.lmx-jl-empty[hidden]{display:none}
.lmx-jl-empty__text{max-width:520px;margin:0 !important;font-family:var(--lmx-ms-font) !important;font-size:17px !important;line-height:1.55 !important;color:var(--jl-text) !important}

/* --- layout by width ----------------------------------------------------------- */
@media (max-width:1024px){
.lmx-jl-inner{min-height:0;padding:84px var(--lmx-section-padding-x) 64px}
.lmx-jl-wrap{padding:0}
.lmx-jl-head{grid-template-columns:minmax(0,1fr);gap:14px}
.lmx-jl-count{justify-self:start;margin:0 !important}
.lmx-jl-filters{grid-template-columns:repeat(2,minmax(0,1fr))}
.lmx-jl-filters__tools{grid-column:1 / -1}
}
@media (max-width:640px){
.lmx-jl-title{font-size:34px !important}
.lmx-jl-filters{grid-template-columns:minmax(0,1fr);padding:16px}
.lmx-jl-card{grid-template-columns:minmax(0,1fr);padding:20px 18px 20px 22px}
.lmx-jl-card__meta{flex-direction:column;gap:6px}
.lmx-jl-inner .lmx-jl-card__btn{justify-content:center}
}

@media (prefers-reduced-motion:reduce){
.lmx-jl-inner *{transition:none !important;animation:none !important}
.lmx-jl-card:hover{transform:none}
}
