/* Jobbol Career Moments — shared, decorative SVG scenes. */
.jb-visual{display:flex;flex-direction:column;align-items:center;gap:14px;padding:30px 22px;text-align:center;max-width:100%;color:var(--ink,#303956);border:1px solid var(--line,#e7eafa);border-radius:var(--radius,16px);background:var(--paper,#fff);box-sizing:border-box;overflow-wrap:anywhere}
.jb-visual-art{display:block;flex-shrink:0;width:184px;height:auto;aspect-ratio:4/3;max-width:100%;object-fit:contain}
.jb-visual-copy{min-width:0;max-width:540px}.jb-visual-copy :is(h1,h2,h3,h4){margin:0 0 9px;font-size:clamp(1.15rem,2.2vw,1.4rem);line-height:1.25;letter-spacing:-.025em;font-weight:750;color:var(--ink,#303956)}
.jb-visual-copy p{margin:0;color:var(--muted,#596780);line-height:1.65;font-size:.95rem}.jb-visual-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:20px}.jb-visual-actions .button{white-space:normal}
.jb-visual--expanded{padding:36px 24px;gap:18px}.jb-visual--expanded .jb-visual-art{width:240px}.jb-visual--expanded .jb-visual-copy :is(h1,h2){font-size:clamp(1.4rem,3vw,2rem)}
.jb-visual--compact{flex-direction:row;text-align:left;align-items:center;gap:16px;padding:18px}.jb-visual--compact .jb-visual-art{width:88px}.jb-visual--compact .jb-visual-copy{max-width:none}.jb-visual--compact .jb-visual-copy :is(h1,h2,h3,h4){font-size:1.05rem}.jb-visual--compact .jb-visual-copy p{font-size:.9rem}.jb-visual--compact .jb-visual-actions{justify-content:flex-start;margin-top:12px}
.jb-visual--error,.jb-visual--warning{border-color:var(--strong-line,#b9c5ee)}.jb-visual--success{background:var(--tint,#f2f4fb)}
.jb-visual-slot{margin:18px 0}.jb-visual-slot:empty{display:none}.candidate-panel>.jb-visual{margin-bottom:20px}.candidate-auth .candidate-intro>.jb-visual-art{width:240px;margin:0 0 18px}.error-page>.jb-visual{border:0;background:transparent}
.jb-visual-notice{position:relative;width:100%;max-width:660px;border-radius:16px;box-shadow:0 10px 40px #141c3330;pointer-events:auto;flex-shrink:0}.jb-visual-notice .jb-visual{padding-right:48px}.jb-visual-dismiss{position:absolute;right:4px;top:4px;width:44px;height:44px;border:0;background:transparent;color:var(--ink,#303956);font-size:24px;cursor:pointer}.jb-visual-dismiss:focus-visible{outline:2px solid var(--link,#0000cc);outline-offset:-4px;border-radius:8px}
.candidate-table td.dt-empty .jb-visual{white-space:normal;max-width:640px;margin:12px auto;border:0}.jb-table-state{margin:18px 0}.jb-table-state:empty{display:none}.candidate-table-wrap[data-empty-visual] .dt-empty{display:none}.candidate-table-wrap[data-empty-visual] .dt-layout-row:last-child{display:none}
.jb-search-failure{margin:0 0 18px}.jb-visual-saved-closed{display:inline-flex;align-items:center;gap:6px;margin:6px 0;font-size:.85rem;color:var(--muted,#596780)}.jb-visual-saved-closed .jb-visual-art{width:40px;height:30px}
@media(max-width:540px){.jb-visual{padding:24px 16px}.jb-visual--expanded{padding:28px 16px}.jb-visual--compact{gap:12px;padding:16px}.jb-visual--compact .jb-visual-art{width:64px}.jb-visual--compact .jb-visual-copy :is(h1,h2,h3,h4){font-size:1rem}.jb-visual-actions{gap:8px}.jb-visual-actions .button{min-height:44px}.candidate-auth .candidate-intro>.jb-visual-art{width:150px}.jb-visual-notice .jb-visual{padding-right:40px}}
@media(prefers-reduced-motion:no-preference){.jb-visual-notice{animation:jb-visual-enter .18s ease-out}@keyframes jb-visual-enter{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}}
@media(prefers-reduced-motion:reduce){.jb-visual,.jb-visual-notice,.jb-visual-art{animation:none!important;transition:none!important}}

[data-visual-failed] .dt-info,[data-visual-failed] .dt-paging{display:none}
body[data-page="applications"] .jb-visual-copy p{color:var(--muted,#58637b)}
.error-page>.eyebrow{display:block;text-align:center}

/* 2.9.10: contextual companions complement forms without occupying the mobile CTA area. */
.candidate-auth.has-context{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,80px);max-width:1120px;align-items:start;padding-block:40px 64px}
.candidate-auth.has-context>.candidate-panel{grid-column:2;grid-row:1;min-width:0;margin-bottom:0}
.candidate-auth.has-context>.candidate-intro{grid-column:1;grid-row:1;min-width:0;max-width:460px;align-self:center}
.candidate-auth.has-context .candidate-form{min-width:0}
.jb-auth-context{margin-bottom:22px}
.jb-visual--companion{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;text-align:left;align-items:flex-start;gap:18px}
.jb-visual--companion .jb-visual-art{width:clamp(220px,22vw,280px);max-width:100%;height:auto}
.jb-visual--companion .jb-visual-copy{max-width:380px}
.candidate-auth .jb-visual--companion .jb-visual-copy h2{font-size:clamp(20px,2vw,24px);line-height:1.3;margin:0 0 10px}
.candidate-auth .jb-visual--companion .jb-visual-copy p{font-size:14px;line-height:1.7;margin:0;color:var(--muted)}
.candidate-auth.has-context .candidate-intro>.employer-journey{margin-top:20px}
.jb-context-note{display:flex;align-items:center;gap:20px;min-width:0}
.jb-context-note>.jb-visual-art{width:96px;max-width:25%;flex:none}
.jb-context-note>div{min-width:0;flex:1}
.jb-context-note>div>p{margin:8px 0 14px}
.jb-context-note>div>h2{margin-bottom:12px}
.jb-context-note--small{justify-content:flex-start;margin-bottom:22px}
.jb-context-note--small>.jb-visual-art{width:64px}
.jb-context-note--small>h2{margin:0;flex:1}
.jb-context-note--small>.employer-status{flex:none}
@media(max-width:950px){.candidate-auth.has-context{gap:32px}.jb-visual--companion .jb-visual-art{width:220px}}
@media(max-width:700px){
 .candidate-auth.has-context{grid-template-columns:minmax(0,1fr);gap:24px;padding-block:24px 40px}
 .candidate-auth.has-context>.candidate-panel{grid-column:1;grid-row:1;width:100%}
 .candidate-auth.has-context>.candidate-intro{grid-column:1;grid-row:2;width:100%;max-width:none}
 .candidate-auth.has-context .jb-auth-context{display:none}
 .candidate-auth.has-context .candidate-intro>.employer-journey{margin-top:0}
 .jb-context-note{gap:12px}.jb-context-note>.jb-visual-art{width:64px}
 .jb-context-note--small>.jb-visual-art{width:48px}
 .jb-context-note--small>.employer-status{max-width:45%;white-space:normal}
}