/* ---------------------------------------------------------------------------
   Careers: the public advert and application form. Two homes, one look:
   the dashboard-hosted page (hiring/public/job.php, inside the customerDoc
   chrome) and the fragment the website stub pulls in (embed.php, inside
   the site's own chrome). Everything is prefixed avxj- so it sits inside
   either without a fight. --avxj-accent is the only brand knob.
--------------------------------------------------------------------------- */

.avxj { --avxj-accent: #43b3e6; --avxj-ink: #1f2733; --avxj-muted: #6b7280; --avxj-line: #e4e9ee; --avxj-bg: #f7fafc;
  max-width: 860px; margin: 0 auto; padding: 24px 20px 60px; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; color: var(--avxj-ink); box-sizing: border-box; }
.avxj *, .avxj *::before, .avxj *::after { box-sizing: border-box; }
.avxj a { color: var(--avxj-accent); }

.avxj-back { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--avxj-muted); text-decoration: none; margin-bottom: 14px; }
.avxj-back:hover { color: var(--avxj-accent); }

.avxj-head { border-bottom: 3px solid var(--avxj-accent); padding-bottom: 18px; margin-bottom: 22px; }
.avxj-eyebrow { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--avxj-accent); margin: 0 0 6px; }
.avxj-head h1 { margin: 0 0 12px; font-size: 30px; line-height: 1.2; font-weight: 700; }
.avxj-meta { display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 14px; color: var(--avxj-muted); }
.avxj-meta span { display: inline-flex; align-items: center; gap: 7px; }
.avxj-meta i { color: var(--avxj-accent); width: 16px; text-align: center; }
.avxj-closed { margin: 16px 0 0; padding: 12px 16px; border-radius: 10px; background: #fff4e5; border: 1px solid #f3c78a; color: #8a5613; font-size: 14px; }
.avxj-preview { margin: 0 0 16px; padding: 10px 14px; border-radius: 10px; background: #eef3ff; border: 1px solid #c7d4f5; color: #2b4a8f; font-size: 13px; }

.avxj-summary { font-size: 17px; line-height: 1.6; color: #2b3442; margin: 0 0 22px; }
.avxj h2 { font-size: 16px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--avxj-muted); margin: 26px 0 10px; padding-bottom: 6px; border-bottom: 1px solid var(--avxj-line); }
.avxj p { font-size: 15px; line-height: 1.65; margin: 0 0 12px; }
.avxj ul { margin: 0 0 12px; padding-left: 22px; }
.avxj li { font-size: 15px; line-height: 1.6; margin: 4px 0; }
.avxj-two { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }
@media (max-width: 640px) { .avxj-two { grid-template-columns: 1fr; } .avxj-head h1 { font-size: 24px; } }

.avxj-cta { display: inline-flex; align-items: center; gap: 8px; margin: 8px 0 0; padding: 12px 22px; border-radius: 10px; background: var(--avxj-accent); color: #fff !important; font-weight: 700; font-size: 15px; text-decoration: none; cursor: pointer; border: none; }
.avxj-cta:hover { filter: brightness(.92); }
.avxj-share { font-size: 13px; color: var(--avxj-muted); margin-top: 14px; }
.avxj-share a { margin-right: 12px; }

/* The form */
.avxj-apply { margin-top: 34px; background: #fff; border: 1px solid var(--avxj-line); border-radius: 14px; padding: 22px 26px; box-shadow: 0 4px 14px rgba(31,39,51,.05); }
.avxj-apply h2 { margin-top: 0; }
.avxj-field { margin-bottom: 16px; }
.avxj-field label { display: block; font-size: 14px; font-weight: 600; color: #2b3442; margin-bottom: 5px; }
.avxj-req { color: #c0392b; }
.avxj-help { font-size: 12.5px; color: var(--avxj-muted); margin: 4px 0 0; line-height: 1.5; }
.avxj-in, .avxj-ta, .avxj-sel { width: 100%; border: 1px solid #d6dce4; border-radius: 8px; padding: 10px 12px; font-size: 15px; font-family: inherit; color: var(--avxj-ink); background: #fff; }
.avxj-in:focus, .avxj-ta:focus, .avxj-sel:focus { outline: none; border-color: var(--avxj-accent); box-shadow: 0 0 0 3px rgba(67,179,230,.16); }
.avxj-ta { resize: vertical; min-height: 120px; }
.avxj-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 560px) { .avxj-row { grid-template-columns: 1fr; } }
.avxj-yesno, .avxj-multi { display: flex; flex-wrap: wrap; gap: 10px; }
.avxj-yesno label, .avxj-multi label { display: inline-flex; align-items: center; gap: 7px; border: 1px solid #d6dce4; border-radius: 8px; padding: 9px 18px; font-weight: 600; cursor: pointer; font-size: 14px; margin: 0; }
.avxj-yesno input, .avxj-multi input { margin: 0; }
.avxj-yesno label:has(input:checked), .avxj-multi label:has(input:checked) { background: var(--avxj-accent); border-color: var(--avxj-accent); color: #fff; }
.avxj-file { font-size: 14px; }
.avxj-check { display: flex; align-items: flex-start; gap: 10px; font-size: 13.5px; line-height: 1.5; color: #444; }
.avxj-check input { margin-top: 3px; }
.avxj-hp { position: absolute; left: -9999px; top: -9999px; height: 0; width: 0; overflow: hidden; opacity: 0; }
.avxj-privacy { font-size: 13.5px; color: var(--avxj-muted); margin: 0 0 16px; }
.avxj-privacy i { color: var(--avxj-accent); margin-right: 5px; }
/* Benefits as tags */
.avxj-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.avxj-tag { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--avxj-line); border-radius: 999px; padding: 7px 14px; font-size: 14px; font-weight: 600; color: var(--avxj-ink); background: #fff; }
.avxj-tag i { color: var(--avxj-accent); font-size: 12px; }
.avxj-errors { background: #fdeaea; border: 1px solid #f3bcbc; color: #b0392f; border-radius: 10px; padding: 12px 16px; margin-bottom: 16px; font-size: 14px; }
.avxj-errors p { margin: 3px 0; }
.avxj-done { background: #e7f6ec; border: 1px solid #b7e2c4; color: #1f6b3a; border-radius: 10px; padding: 16px 18px; font-size: 15px; line-height: 1.6; }
.avxj-done b { display: block; font-size: 17px; margin-bottom: 4px; }
.avxj-sending { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--avxj-muted); margin-left: 12px; }

/* The listing */
.avxj-list { display: grid; grid-template-columns: 1fr; gap: 14px; }
.avxj-card { display: block; text-decoration: none; color: inherit; background: #fff; border: 1px solid var(--avxj-line); border-radius: 14px; padding: 18px 22px; transition: box-shadow .15s ease, border-color .15s ease; }
.avxj-card:hover { border-color: var(--avxj-accent); box-shadow: 0 6px 18px rgba(31,39,51,.08); }
.avxj-card h3 { margin: 0 0 6px; font-size: 19px; color: var(--avxj-ink); }
.avxj-card p { margin: 8px 0 0; color: #444; font-size: 14px; }
.avxj-card .avxj-meta { font-size: 13px; }
.avxj-none { color: var(--avxj-muted); font-size: 15px; line-height: 1.6; }