/* ============================================================
   YMX CAREERS - front-end styles
   Tokens lifted verbatim from the live #ymx-careers-v1 block so
   every new screen is indistinguishable from the current page.
   Scoped to .ymx-careers-app: zero bleed into the theme.
   ============================================================ */

.ymx-careers-app {
  --navy-deep:#0c1a26; --navy:#152637; --navy-2:#1d3349; --navy-soft:#2a4561; --ink-deep:#08131c;
  --cream:#f8f5ee; --cream-2:#efeae0; --cream-3:#e6ddc8;
  --amber:#e8ab36; --amber-deep:#c8902a; --amber-light:#f3c459; --amber-glow:rgba(232,171,54,.55);
  --text:#2a3a48; --muted:#5a6b7a; --faint:#8b97a3;
  --line:rgba(21,38,55,.12); --line-soft:rgba(21,38,55,.08); --line-strong:rgba(21,38,55,.28);
  --wa:#25D366; --ok:#1f9d55; --warn:#c8902a; --bad:#c0392b;
  --r-sm:8px; --r-md:14px; --r-lg:22px; --r-xl:28px; --r-2xl:36px; --pill:999px;
  --ease:cubic-bezier(.2,.8,.2,1); --ease-out:cubic-bezier(.16,1,.3,1); --eq:cubic-bezier(.22,1,.36,1);
  --max:1480px; --gutter:clamp(20px,4vw,56px);
  --sh-navy:rgba(21,38,55,.55) 0 14px 32px -12px, rgba(255,255,255,.18) 0 1px 0 0 inset;
  --sh-amber:rgba(232,171,54,.55) 0 14px 32px -10px, rgba(255,255,255,.45) 0 1px 0 0 inset;
  --sh-card:rgba(12,26,38,.16) 0 24px 48px -28px, rgba(12,26,38,.08) 0 6px 14px -4px, rgba(255,255,255,.7) 0 1px 0 0 inset;
  --sh-dark:rgba(0,0,0,.72) 0 24px 60px -34px, rgba(255,255,255,.06) 0 1px 0 0 inset;

  background:var(--cream); color:var(--text);
  font:400 16px/1.6 'Gabarito',system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  position:relative; overflow-x:hidden;
}
.ymx-careers-app *,
.ymx-careers-app *::before,
.ymx-careers-app *::after { box-sizing:border-box; }
.ymx-careers-app ::selection { background:var(--amber); color:var(--navy); }
.ymx-careers-app img { display:block; max-width:100%; height:auto; }
.ymx-careers-app a { color:inherit; text-decoration:none; transition:color .18s var(--ease); }
.ymx-careers-app button { font:inherit; cursor:pointer; border:0; background:none; color:inherit; }

.ymx-careers-app .wrap { width:100%; max-width:var(--max); margin-inline:auto; padding-inline:var(--gutter); }
.ymx-careers-app .wrap-narrow { max-width:920px; }
.ymx-careers-app .sec { padding:clamp(48px,7vh,96px) 0; position:relative; }

.ymx-careers-app h1,
.ymx-careers-app h2,
.ymx-careers-app h3,
.ymx-careers-app h4 {
  font-family:'Fraunces',Georgia,serif; font-weight:600; letter-spacing:-.02em;
  line-height:1.05; margin:0; color:var(--navy-deep);
}
.ymx-careers-app h1 { font-size:clamp(38px,6vw,72px); font-weight:700; letter-spacing:-.04em; }
.ymx-careers-app h2 { font-size:clamp(28px,4vw,52px); letter-spacing:-.025em; }
.ymx-careers-app h3 { font-size:clamp(19px,2.2vw,26px); letter-spacing:-.015em; line-height:1.15; }
.ymx-careers-app h1 em,
.ymx-careers-app h2 em,
.ymx-careers-app h3 em { font-family:'Fraunces',serif; font-style:italic; font-weight:500; color:var(--amber-deep); }
.ymx-careers-app p { margin:0; }

.ymx-careers-app .eyebrow {
  display:inline-flex; align-items:center; gap:9px;
  font-size:11.5px; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--amber-deep);
}
.ymx-careers-app .eyebrow::before { content:""; width:30px; height:1px; background:var(--amber); }

.ymx-careers-app .sec-head { max-width:780px; margin-bottom:36px; }
.ymx-careers-app .sec-head h2 { margin-top:14px; }
.ymx-careers-app .sec-head .sub { font-size:clamp(15px,1.3vw,18px); color:var(--muted); margin-top:16px; line-height:1.65; }

.ymx-careers-app .ico {
  width:1em; height:1em; stroke:currentColor; stroke-width:1.6; fill:none;
  stroke-linecap:round; stroke-linejoin:round; flex:none;
}

/* ---------- buttons ---------- */
.ymx-careers-app .cta {
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 26px; min-height:50px; border-radius:var(--pill);
  font-weight:700; font-size:14.5px; letter-spacing:-.005em; position:relative; overflow:hidden;
  transition:transform .22s var(--eq), box-shadow .22s var(--eq), background .22s var(--eq), color .22s var(--eq);
}
.ymx-careers-app .cta .ico { font-size:18px; }
.ymx-careers-app .cta:hover { transform:translateY(-3px); }
.ymx-careers-app .cta:disabled { opacity:.5; cursor:not-allowed; transform:none; }
.ymx-careers-app .cta::after {
  content:""; position:absolute; inset:0;
  background:linear-gradient(120deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);
  transform:translateX(-120%); mix-blend-mode:overlay; pointer-events:none;
}
.ymx-careers-app .cta:hover::after { transform:translateX(120%); transition:transform .85s var(--ease-out); }
.ymx-careers-app .cta-amber { background:linear-gradient(180deg,var(--amber-light) 0%,var(--amber) 60%,var(--amber-deep) 100%); color:var(--navy-deep); box-shadow:var(--sh-amber); }
.ymx-careers-app .cta-navy { background:var(--navy); color:#fff; box-shadow:var(--sh-navy); }
.ymx-careers-app .cta-navy:hover { background:var(--navy-deep); }
.ymx-careers-app .cta-wa { background:linear-gradient(180deg,#2eda6e,#20b85a); color:#fff; box-shadow:rgba(37,211,102,.55) 0 12px 26px -10px, rgba(255,255,255,.25) 0 1px 0 0 inset; }
.ymx-careers-app .cta-ghost { background:transparent; color:var(--navy-deep); border:1px solid var(--line-strong); }
.ymx-careers-app .cta-ghost:hover { background:var(--navy-deep); color:var(--cream); border-color:var(--navy-deep); }
.ymx-careers-app .cta-sm { padding:11px 18px; min-height:42px; font-size:13px; }

@keyframes ymxCtaPulse {
  0%,100% { box-shadow:rgba(232,171,54,.5) 0 14px 32px -10px, rgba(255,255,255,.45) 0 1px 0 0 inset; }
  50%     { box-shadow:rgba(232,171,54,.72) 0 20px 44px -8px, rgba(255,255,255,.45) 0 1px 0 0 inset; }
}
.ymx-careers-app .pulse { animation:ymxCtaPulse 3.5s var(--ease) infinite; }

/* ---------- cards ---------- */
.ymx-careers-app .card {
  background:#fff; border:1px solid var(--line); border-radius:var(--r-2xl);
  box-shadow:var(--sh-card); overflow:hidden;
}
.ymx-careers-app .card-pad { padding:clamp(22px,3vw,38px); }

/* ---------- forms ---------- */
.ymx-careers-app .lbl {
  display:block; font-size:12px; font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; color:var(--muted); margin-bottom:8px;
}
.ymx-careers-app .inp,
.ymx-careers-app .sel,
.ymx-careers-app .txt {
  width:100%; padding:14px 16px; font-size:16px; font-family:inherit; color:var(--navy-deep);
  background:var(--cream); border:1px solid var(--line); border-radius:var(--r-md);
  transition:border-color .22s var(--ease), box-shadow .22s var(--ease), background .22s var(--ease);
}
.ymx-careers-app .inp:focus,
.ymx-careers-app .sel:focus,
.ymx-careers-app .txt:focus {
  outline:none; background:#fff; border-color:var(--amber); box-shadow:0 0 0 3px rgba(232,171,54,.18);
}
.ymx-careers-app .txt { resize:vertical; min-height:96px; line-height:1.6; }
.ymx-careers-app .sel {
  appearance:none;
  background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235a6b7a' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; background-size:18px; padding-right:44px;
}
.ymx-careers-app .field { margin-bottom:16px; }
.ymx-careers-app .field:last-child { margin-bottom:0; }
.ymx-careers-app .field.err .inp,
.ymx-careers-app .field.err .sel,
.ymx-careers-app .field.err .txt { border-color:var(--bad); box-shadow:0 0 0 3px rgba(192,57,43,.14); }
.ymx-careers-app .field .hint { font-size:12.5px; color:var(--faint); margin-top:6px; line-height:1.5; }

.ymx-careers-app .g1 { display:grid; grid-template-columns:1fr; gap:16px; }
.ymx-careers-app .g2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.ymx-careers-app .g3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px; }

.ymx-careers-app .block {
  background:var(--cream); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:20px; margin-bottom:16px;
}
.ymx-careers-app .block-t {
  display:flex; align-items:center; gap:10px; font-size:12px; font-weight:800;
  letter-spacing:.16em; text-transform:uppercase; color:var(--amber-deep); margin-bottom:16px;
}
.ymx-careers-app .block-t .opt { color:var(--faint); letter-spacing:.06em; font-weight:600; text-transform:none; font-size:12px; }

/* ---------- steps ---------- */
.ymx-careers-app .steps { display:flex; align-items:center; gap:5px; flex-wrap:wrap; margin-bottom:14px; }
.ymx-careers-app .step {
  display:flex; align-items:center; gap:8px; font-size:12.5px; font-weight:600;
  color:var(--faint); transition:color .3s var(--ease);
}
.ymx-careers-app .step.is-active,
.ymx-careers-app .step.is-done { color:var(--navy); }
.ymx-careers-app .step .num {
  width:26px; height:26px; border-radius:50%; display:grid; place-items:center;
  background:var(--cream-2); color:var(--faint); font-size:12px; font-weight:700;
  border:1px solid var(--line); transition:all .3s var(--eq);
}
.ymx-careers-app .step.is-active .num {
  background:linear-gradient(180deg,var(--amber-light),var(--amber)); color:var(--navy-deep);
  border-color:transparent; box-shadow:rgba(232,171,54,.5) 0 8px 18px -8px;
}
.ymx-careers-app .step.is-done .num { background:var(--navy); color:var(--cream); border-color:transparent; }
.ymx-careers-app .step-sep { color:var(--faint); font-size:13px; }

.ymx-careers-app .prog { height:4px; background:var(--cream-2); border-radius:var(--pill); overflow:hidden; margin-bottom:24px; }
.ymx-careers-app .prog i {
  display:block; height:100%; width:10%;
  background:linear-gradient(90deg,var(--amber),var(--amber-light));
  border-radius:var(--pill); transition:width .5s var(--eq);
}

.ymx-careers-app .panel { display:none; }
.ymx-careers-app .panel.is-active { display:block; animation:ymxFade .4s var(--ease-out); }
@keyframes ymxFade { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
.ymx-careers-app .panel-head { margin-bottom:22px; }
.ymx-careers-app .panel-head .t { font-family:'Fraunces',serif; font-size:clamp(21px,2.2vw,27px); color:var(--navy-deep); letter-spacing:-.02em; }
.ymx-careers-app .panel-head .n { font-size:13.5px; color:var(--muted); margin-top:6px; }

.ymx-careers-app .btn-row { display:flex; gap:12px; margin-top:24px; flex-wrap:wrap; }
.ymx-careers-app .btn-row .cta { flex:1; min-width:170px; }

.ymx-careers-app .status { margin-top:14px; font-size:13.5px; font-weight:600; color:var(--bad); min-height:20px; }
.ymx-careers-app .status.ok { color:var(--ok); }
.ymx-careers-app .autosave {
  font-size:12px; color:var(--faint); display:inline-flex; align-items:center; gap:7px;
  opacity:0; transition:opacity .3s var(--ease);
}
.ymx-careers-app .autosave.show { opacity:1; }
.ymx-careers-app .autosave .dot { width:7px; height:7px; border-radius:50%; background:var(--ok); }

/* ---------- chips (skills) ---------- */
.ymx-careers-app .chips { display:flex; flex-wrap:wrap; gap:8px; }
.ymx-careers-app .chip {
  display:inline-flex; align-items:center; gap:7px; padding:9px 15px; border-radius:var(--pill);
  background:var(--cream); border:1px solid var(--line); font-size:13.5px; font-weight:600;
  color:var(--muted); cursor:pointer; user-select:none;
  transition:all .22s var(--eq);
}
.ymx-careers-app .chip:hover { border-color:var(--amber); color:var(--navy-deep); transform:translateY(-2px); }
.ymx-careers-app .chip.on {
  background:linear-gradient(180deg,var(--amber-light),var(--amber)); color:var(--navy-deep);
  border-color:transparent; box-shadow:rgba(232,171,54,.45) 0 8px 18px -9px; font-weight:700;
}
.ymx-careers-app .chip input { position:absolute; opacity:0; pointer-events:none; }
.ymx-careers-app .chip-group { margin-bottom:22px; }
.ymx-careers-app .chip-group h4 {
  font-family:'Gabarito',sans-serif; font-size:11.5px; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:var(--amber-deep); margin-bottom:12px;
}

/* ---------- consent ---------- */
.ymx-careers-app .consent {
  display:flex; gap:12px; align-items:flex-start; font-size:13.5px; color:var(--muted);
  line-height:1.6; padding:16px; border:1px solid var(--line); border-radius:var(--r-lg);
  background:var(--cream); margin-bottom:12px; cursor:pointer;
  transition:border-color .25s var(--ease), background .25s var(--ease);
}
.ymx-careers-app .consent:hover { border-color:rgba(232,171,54,.5); }
.ymx-careers-app .consent input { width:20px; height:20px; flex:none; margin-top:2px; accent-color:var(--amber-deep); }
.ymx-careers-app .consent b { color:var(--navy-deep); font-weight:700; }
.ymx-careers-app .consent .rec {
  display:inline-flex; align-items:center; padding:3px 9px; border-radius:var(--pill);
  background:linear-gradient(180deg,var(--amber-light),var(--amber)); color:var(--navy-deep);
  font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; margin-right:7px;
}

/* Required candidate headshot. */
.ymx-careers-app .ymx-photo-upload { display:grid; grid-template-columns:112px 1fr; gap:18px; align-items:center; }
.ymx-careers-app .ymx-photo-preview { width:112px; height:112px; border-radius:24px; overflow:hidden; display:grid; place-items:center; background:var(--navy-deep); color:var(--amber); font:600 34px/1 Georgia,serif; box-shadow:0 12px 28px -20px rgba(12,26,38,.7); }
.ymx-careers-app .ymx-photo-preview img { width:100%; height:100%; object-fit:cover; display:block; }
.ymx-careers-app .ymx-photo-field.err .ymx-photo-preview { outline:2px solid var(--bad); outline-offset:3px; }
@media (max-width:560px) {
  .ymx-careers-app .ymx-photo-upload { grid-template-columns:86px 1fr; gap:13px; }
  .ymx-careers-app .ymx-photo-preview { width:86px; height:86px; border-radius:20px; }
}

/* ---------- review ---------- */
.ymx-careers-app .review {
  background:var(--cream); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:20px; font-size:14px; line-height:1.7;
}
.ymx-careers-app .review .row { display:flex; gap:10px; padding:8px 0; border-bottom:1px dashed var(--line); }
.ymx-careers-app .review .row:last-child { border-bottom:0; }
.ymx-careers-app .review .k {
  color:var(--muted); min-width:150px; font-size:12px; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase;
}
.ymx-careers-app .review .v { color:var(--navy-deep); font-weight:600; }

/* ---------- crew cards ---------- */
.ymx-careers-app .crew-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:18px; }
.ymx-careers-app .crew {
  background:#fff; border:1px solid var(--line); border-radius:var(--r-xl); padding:22px;
  box-shadow:rgba(21,38,55,.18) 0 14px 36px -22px; display:flex; flex-direction:column;
  transition:transform .5s var(--eq), border-color .3s var(--ease), box-shadow .5s var(--eq);
}
.ymx-careers-app .crew:hover {
  transform:translateY(-5px); border-color:rgba(232,171,54,.5);
  box-shadow:rgba(21,38,55,.28) 0 32px 60px -28px;
}
.ymx-careers-app .crew-top { display:flex; gap:14px; align-items:center; }
.ymx-careers-app .avatar {
  width:52px; height:52px; border-radius:16px; flex:none; display:grid; place-items:center;
  background:linear-gradient(160deg,var(--navy-2),var(--navy)); color:var(--amber);
  font-family:'Fraunces',serif; font-size:20px; letter-spacing:-.02em; box-shadow:var(--sh-navy);
  overflow:hidden;
}
.ymx-careers-app .avatar img { width:100%; height:100%; object-fit:cover; }
.ymx-careers-app .crew .nm { font-family:'Fraunces',serif; font-size:21px; color:var(--navy-deep); letter-spacing:-.02em; line-height:1.15; }
.ymx-careers-app .crew .ps { font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--amber-deep); margin-top:5px; }
.ymx-careers-app .crew .facts { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.ymx-careers-app .pill {
  display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:var(--pill);
  background:var(--cream-2); border:1px solid var(--line); font-size:11.5px; font-weight:600;
  letter-spacing:.04em; color:var(--muted);
}
.ymx-careers-app .pill .ico { font-size:14px; color:var(--amber-deep); }
.ymx-careers-app .pill.badge-verified { background:rgba(31,157,85,.12); border-color:rgba(31,157,85,.3); color:var(--ok); font-weight:700; }
.ymx-careers-app .pill.badge-pro { background:rgba(232,171,54,.16); border-color:rgba(232,171,54,.36); color:var(--amber-deep); font-weight:800; letter-spacing:.1em; }
.ymx-careers-app .pill.badge-rec { background:var(--navy); border-color:transparent; color:var(--amber); font-weight:800; letter-spacing:.1em; }
.ymx-careers-app .crew .last { margin-top:16px; font-size:13.5px; color:var(--muted); line-height:1.6; flex:1; }
.ymx-careers-app .crew .last b { color:var(--navy-deep); font-weight:700; }
.ymx-careers-app .crew .cta { width:100%; margin-top:18px; font-size:13.5px; padding:13px 20px; min-height:46px; }

/* ---------- filters ---------- */
.ymx-careers-app .filters {
  display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:12px; background:#fff;
  border:1px solid var(--line); border-radius:var(--r-xl); padding:16px;
  box-shadow:var(--sh-card); margin-bottom:24px;
}
.ymx-careers-app .search-wrap { position:relative; display:flex; align-items:center; }
.ymx-careers-app .search-wrap .ico { position:absolute; left:15px; font-size:19px; color:var(--faint); pointer-events:none; }
.ymx-careers-app .search-wrap .inp { padding-left:44px; }
.ymx-careers-app .dir-meta {
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;
  margin-bottom:18px; font-size:13.5px; color:var(--muted);
}
.ymx-careers-app .dir-meta b { color:var(--navy-deep); font-family:'Fraunces',serif; font-size:19px; font-variant-numeric:tabular-nums; }

.ymx-careers-app .empty {
  grid-column:1/-1; text-align:center; padding:56px 20px; color:var(--muted); font-size:15px;
  background:#fff; border:1px dashed var(--line-strong); border-radius:var(--r-xl);
}
.ymx-careers-app .empty .ico { font-size:40px; color:var(--faint); margin-bottom:14px; }
.ymx-careers-app .loading { text-align:center; padding:60px 20px; color:var(--muted); }

/* ---------- profile page ---------- */
.ymx-careers-app .prof-hero {
  background:linear-gradient(180deg,var(--navy) 0%,var(--ink-deep) 100%); color:var(--cream);
  padding:clamp(40px,7vh,72px) 0;
}
.ymx-careers-app .prof-hero h1 { color:#fff; }
.ymx-careers-app .prof-hero .avatar { width:96px; height:96px; border-radius:26px; font-size:34px; }
.ymx-careers-app .prof-hero .pill { background:rgba(255,255,255,.06); border-color:rgba(248,245,238,.16); color:rgba(248,245,238,.8); }
.ymx-careers-app .prof-hero .ps { color:var(--amber); }
.ymx-careers-app .prof-body { display:grid; grid-template-columns:1fr 340px; gap:32px; align-items:start; }
.ymx-careers-app .prof-sec { margin-bottom:34px; }
.ymx-careers-app .prof-sec h3 { margin-bottom:16px; }
.ymx-careers-app .timeline { border-left:2px solid var(--line); padding-left:22px; }
.ymx-careers-app .timeline .job { position:relative; padding-bottom:22px; }
.ymx-careers-app .timeline .job::before {
  content:""; position:absolute; left:-29px; top:6px; width:12px; height:12px;
  border-radius:50%; background:var(--amber); border:3px solid var(--cream);
}
.ymx-careers-app .timeline .job b { font-family:'Fraunces',serif; font-size:18px; color:var(--navy-deep); }
.ymx-careers-app .timeline .job .meta { font-size:13px; color:var(--faint); margin-top:3px; }
.ymx-careers-app .side-card { position:sticky; top:100px; }

/* ---------- dashboard ---------- */
.ymx-careers-app .dash-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin-bottom:28px; }
.ymx-careers-app .stat { background:#fff; border:1px solid var(--line); border-radius:var(--r-xl); padding:22px; box-shadow:var(--sh-card); }
.ymx-careers-app .stat b { display:block; font-family:'Fraunces',serif; font-size:36px; color:var(--navy-deep); line-height:1.1; }
.ymx-careers-app .stat span { font-size:12.5px; color:var(--muted); letter-spacing:.04em; }
.ymx-careers-app .ring-wrap { display:flex; align-items:center; gap:18px; }
.ymx-careers-app .ring { width:74px; height:74px; flex:none; }
.ymx-careers-app .todo { list-style:none; padding:0; margin:14px 0 0; }
.ymx-careers-app .todo li {
  padding:11px 0; border-bottom:1px dashed var(--line); font-size:14px; color:var(--muted);
  display:flex; align-items:center; gap:10px;
}
.ymx-careers-app .todo li:last-child { border-bottom:0; }
.ymx-careers-app .todo .ico { color:var(--amber-deep); font-size:16px; }

.ymx-careers-app .avail-row { display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }

/* ---------- notice ---------- */
.ymx-careers-app .notice-box {
  padding:16px 20px; border-radius:var(--r-lg); font-size:14.5px; line-height:1.6; margin-bottom:22px;
  border:1px solid var(--line); background:#fff;
}
.ymx-careers-app .notice-box.ok { border-left:4px solid var(--ok); background:rgba(31,157,85,.06); }
.ymx-careers-app .notice-box.warn { border-left:4px solid var(--amber); background:rgba(232,171,54,.08); }
.ymx-careers-app .notice-box.bad { border-left:4px solid var(--bad); background:rgba(192,57,43,.06); }

/* ---------- success screen ---------- */
.ymx-careers-app .ok-screen { padding:clamp(30px,5vw,56px); text-align:center; }
.ymx-careers-app .ok-screen .ring-ok {
  width:74px; height:74px; border-radius:50%; margin:0 auto 22px; display:grid; place-items:center;
  background:linear-gradient(180deg,var(--amber-light),var(--amber)); color:var(--navy-deep);
  font-size:34px; box-shadow:var(--sh-amber);
}
.ymx-careers-app .ok-screen h3 { font-size:clamp(24px,3vw,34px); }
.ymx-careers-app .ok-screen p { color:var(--muted); margin-top:12px; max-width:46ch; margin-inline:auto; }

/* ---------- auth ---------- */
.ymx-careers-app .auth-wrap { max-width:480px; margin-inline:auto; }
.ymx-careers-app .auth-tabs {
  display:flex; gap:4px; padding:5px; background:var(--cream-2); border:1px solid var(--line);
  border-radius:var(--pill); margin-bottom:26px;
}
.ymx-careers-app .auth-tabs button {
  flex:1; padding:12px 20px; border-radius:var(--pill); font-weight:700; font-size:14px;
  color:var(--muted); transition:all .25s var(--eq);
}
.ymx-careers-app .auth-tabs button.on { background:var(--navy); color:var(--cream); box-shadow:var(--sh-navy); }

/* ---------- plans ---------- */
.ymx-careers-app .plans-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:20px; }
.ymx-careers-app .plan {
  background:#fff; border:1px solid var(--line); border-radius:var(--r-2xl); padding:30px;
  box-shadow:var(--sh-card); display:flex; flex-direction:column; position:relative;
}
.ymx-careers-app .plan.featured { border-color:var(--amber); box-shadow:rgba(232,171,54,.28) 0 28px 56px -30px, var(--sh-card); }
.ymx-careers-app .plan .tag {
  position:absolute; top:-11px; left:30px; padding:5px 14px; border-radius:var(--pill);
  background:linear-gradient(180deg,var(--amber-light),var(--amber)); color:var(--navy-deep);
  font-size:10.5px; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
}
.ymx-careers-app .plan .price { font-family:'Fraunces',serif; font-size:44px; color:var(--navy-deep); line-height:1; margin:14px 0 4px; }
.ymx-careers-app .plan .per { font-size:13px; color:var(--faint); }
.ymx-careers-app .plan ul { list-style:none; padding:0; margin:22px 0; flex:1; }
.ymx-careers-app .plan li { padding:9px 0; font-size:14px; color:var(--muted); display:flex; gap:10px; align-items:flex-start; }
.ymx-careers-app .plan li .ico { color:var(--ok); font-size:16px; margin-top:3px; }

/* ---------- modal ---------- */
.ymx-careers-app .modal {
  position:fixed; inset:0; z-index:99999; background:rgba(8,19,28,.94);
  backdrop-filter:blur(8px); display:none; align-items:center; justify-content:center; padding:20px;
}
.ymx-careers-app .modal.open { display:flex; }
.ymx-careers-app .modal-box {
  background:var(--cream); border-radius:var(--r-2xl); max-width:540px; width:100%;
  padding:clamp(24px,4vw,38px); position:relative; max-height:90vh; overflow:auto;
  box-shadow:rgba(0,0,0,.6) 0 40px 90px -30px;
}
.ymx-careers-app .modal-box .x {
  position:absolute; top:16px; right:16px; width:38px; height:38px; border-radius:50%;
  display:grid; place-items:center; border:1px solid var(--line); font-size:17px; color:var(--muted);
}
.ymx-careers-app .modal-box .x:hover { background:var(--navy); color:var(--cream); border-color:transparent; }

/* ---------- mobile ---------- */
@media (max-width:980px) {
  .ymx-careers-app .prof-body { grid-template-columns:1fr; }
  .ymx-careers-app .side-card { position:static; }
}
@media (max-width:860px) {
  .ymx-careers-app .filters { grid-template-columns:1fr 1fr; }
  .ymx-careers-app .search-wrap { grid-column:1/-1; }
}
@media (max-width:640px) {
  .ymx-careers-app { --gutter:18px; }
  .ymx-careers-app h1 { font-size:clamp(32px,9vw,48px); line-height:1; }
  .ymx-careers-app h2 { font-size:clamp(25px,6.5vw,34px); }
  .ymx-careers-app .g2,
  .ymx-careers-app .g3 { grid-template-columns:1fr; }
  .ymx-careers-app .filters { grid-template-columns:1fr; padding:14px; }
  .ymx-careers-app .crew-grid { grid-template-columns:1fr; }
  .ymx-careers-app .btn-row { flex-direction:column-reverse; }
  .ymx-careers-app .btn-row .cta { width:100%; }
  .ymx-careers-app .step span { display:none; }
  .ymx-careers-app .step.is-active span { display:inline; }
  .ymx-careers-app .review .row { flex-direction:column; gap:2px; }
  /* Bigger tap targets on phones - most crew apply from a phone. */
  .ymx-careers-app .inp,
  .ymx-careers-app .sel,
  .ymx-careers-app .txt { padding:15px 16px; }
  .ymx-careers-app .chip { padding:11px 16px; }
}

@media (prefers-reduced-motion:reduce) {
  .ymx-careers-app *,
  .ymx-careers-app *::before,
  .ymx-careers-app *::after { transition:none !important; animation:none !important; }
}

/* ---------- embedded mode ----------
   When the shortcode sits inside the existing /careers/ Elementor page,
   the block must not repaint the background or add a second full section
   of padding on top of what the page already has. */
.ymx-careers-app.ymx-embedded {
  background: transparent;
  overflow-x: visible;
}
.ymx-careers-app.ymx-embedded > .sec { padding-top: 0; padding-bottom: 0; }
.ymx-careers-app.ymx-embedded .wrap { padding-inline: 0; }
.ymx-careers-app.ymx-embedded .prof-hero { border-radius: var(--r-2xl); }

/* ============================================================
   PROFILE PREVIEW
   The last step of the application: the candidate's real public
   profile, with a live Basic / Verified / Professional switch.

   Locked sections stay legible in outline but unreadable in
   detail - the point is "employers cannot see this yet", not
   "you did not fill this in". No fake urgency anywhere.
   ============================================================ */

.ymx-careers-app .ymx-pv { margin-top:4px; }

.ymx-careers-app .ymx-pv-head { margin-bottom:18px; }
.ymx-careers-app .ymx-pv-head .t {
  font-family:'Fraunces',Georgia,serif; font-size:clamp(19px,2.2vw,24px);
  font-weight:600; letter-spacing:-.015em; color:var(--navy-deep);
}
.ymx-careers-app .ymx-pv-head .n {
  font-size:13.5px; color:var(--muted); margin-top:7px; line-height:1.6; max-width:60ch;
}

.ymx-careers-app .ymx-pv-loading {
  padding:34px; text-align:center; color:var(--faint); font-size:14px;
  border:1px dashed var(--line); border-radius:var(--r-lg);
}

/* ---- plan switch ---- */
.ymx-careers-app .ymx-pv-tabs {
  display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:18px;
}
.ymx-careers-app .ymx-pv-tab {
  display:flex; flex-direction:column; gap:3px; align-items:center; justify-content:center;
  padding:13px 10px; border-radius:var(--r-md); text-align:center;
  border:1px solid var(--line); background:#fff; color:var(--muted);
  transition:border-color .18s var(--ease), color .18s var(--ease), background .18s var(--ease);
}
.ymx-careers-app .ymx-pv-tab:hover { border-color:var(--line-strong); }
.ymx-careers-app .ymx-pv-tab .n { font-size:14px; font-weight:700; color:var(--navy-deep); }
.ymx-careers-app .ymx-pv-tab .p { font-size:12px; letter-spacing:.02em; }
.ymx-careers-app .ymx-pv-tab.is-on {
  background:var(--navy-deep); border-color:var(--navy-deep); color:rgba(248,245,238,.75);
}
.ymx-careers-app .ymx-pv-tab.is-on .n { color:var(--amber); }

.ymx-careers-app .ymx-pv-split { display:grid; grid-template-columns:1fr; gap:16px; }
@media (min-width:900px) {
  .ymx-careers-app .ymx-pv-split { grid-template-columns:1.7fr 1fr; align-items:start; }
}

/* ---- the card ---- */
.ymx-careers-app .ymx-pv-card {
  border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; background:#fff;
  box-shadow:var(--sh-card);
}
.ymx-careers-app .ymx-pv-hero {
  display:flex; gap:16px; align-items:center; flex-wrap:wrap;
  padding:22px; background:linear-gradient(160deg,var(--navy) 0%,var(--navy-deep) 100%);
}
.ymx-careers-app .ymx-pv-avatar {
  width:78px; height:78px; flex:none; border-radius:50%; overflow:hidden;
  background:var(--navy-soft); color:var(--amber);
  display:flex; align-items:center; justify-content:center;
  font-family:'Fraunces',serif; font-size:26px; font-weight:600;
  border:2px solid rgba(232,171,54,.35);
}
.ymx-careers-app .ymx-pv-avatar img { width:100%; height:100%; object-fit:cover; }
.ymx-careers-app .ymx-pv-id { flex:1; min-width:200px; }
.ymx-careers-app .ymx-pv-role {
  font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  color:var(--amber); margin-bottom:6px;
}
.ymx-careers-app .ymx-pv-name {
  font-family:'Fraunces',Georgia,serif; font-size:clamp(22px,3vw,30px);
  font-weight:600; letter-spacing:-.02em; color:var(--cream); line-height:1.1;
}
.ymx-careers-app .ymx-pv-headline {
  color:rgba(248,245,238,.8); font-size:14px; margin-top:8px; line-height:1.5; max-width:50ch;
}
.ymx-careers-app .ymx-pv-pills { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.ymx-careers-app .ymx-pv-pill {
  font-size:11.5px; font-weight:600; padding:5px 11px; border-radius:var(--pill);
  background:rgba(248,245,238,.1); border:1px solid rgba(248,245,238,.22); color:rgba(248,245,238,.9);
}
.ymx-careers-app .ymx-pv-badge {
  font-size:11.5px; font-weight:700; padding:5px 11px; border-radius:var(--pill);
  background:rgba(232,171,54,.16); border:1px solid rgba(232,171,54,.4); color:var(--amber);
}
/* Inside the card body the pills sit on cream, not navy. */
.ymx-careers-app .ymx-pv-body .ymx-pv-pill {
  background:var(--cream-2); border-color:var(--line); color:var(--text);
}

.ymx-careers-app .ymx-pv-body { padding:6px 22px 22px; }
.ymx-careers-app .ymx-pv-sec { padding:18px 0; border-bottom:1px solid var(--line-soft); }
.ymx-careers-app .ymx-pv-sec:last-child { border-bottom:0; padding-bottom:2px; }
.ymx-careers-app .ymx-pv-sec h4 {
  font-family:'Gabarito',system-ui,sans-serif;
  font-size:11.5px; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  color:var(--faint); margin:0 0 12px; display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
.ymx-careers-app .ymx-pv-note { font-size:12.5px; color:var(--faint); margin-top:10px; line-height:1.55; }
.ymx-careers-app .ymx-pv-bio { font-size:14.5px; color:var(--muted); line-height:1.7; }

.ymx-careers-app .ymx-pv-rows { display:grid; gap:8px; }
.ymx-careers-app .ymx-pv-rows > div { display:flex; gap:12px; align-items:baseline; font-size:14px; }
.ymx-careers-app .ymx-pv-rows b {
  min-width:74px; font-size:11.5px; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:var(--faint);
}
.ymx-careers-app .ymx-pv-rows span { color:var(--text); }

.ymx-careers-app .ymx-pv-jobs { display:grid; gap:12px; }
.ymx-careers-app .ymx-pv-job {
  display:grid; gap:2px; padding-left:14px; border-left:2px solid var(--amber);
}
.ymx-careers-app .ymx-pv-job b { font-size:14.5px; color:var(--navy-deep); font-weight:700; }
.ymx-careers-app .ymx-pv-job span { font-size:13.5px; color:var(--muted); }
.ymx-careers-app .ymx-pv-job i { font-size:12.5px; color:var(--faint); font-style:normal; }

.ymx-careers-app .ymx-pv-chips { display:flex; flex-wrap:wrap; gap:7px; }
.ymx-careers-app .ymx-pv-chip {
  font-size:12.5px; padding:6px 12px; border-radius:var(--pill);
  background:var(--cream-2); border:1px solid var(--line); color:var(--text);
}
.ymx-careers-app .ymx-pv-chip i { font-style:normal; color:var(--faint); }
.ymx-careers-app .ymx-pv-chip.is-expired { border-color:rgba(192,57,43,.35); color:var(--bad); }
.ymx-careers-app .ymx-pv-video { font-size:13px; color:var(--muted); word-break:break-all; }

/* ---- locked ---- */
.ymx-careers-app .ymx-pv-lock {
  margin-left:auto; font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:none;
  padding:4px 10px; border-radius:var(--pill);
  background:rgba(232,171,54,.14); border:1px solid rgba(232,171,54,.4); color:var(--amber-deep);
}
.ymx-careers-app .ymx-pv-masked {
  filter:blur(4px); opacity:.45; pointer-events:none; user-select:none;
  max-height:120px; overflow:hidden;
}

/* ---- side column ---- */
.ymx-careers-app .ymx-pv-side {
  border:1px solid var(--line); border-radius:var(--r-lg); background:#fff;
  padding:20px; box-shadow:var(--sh-card);
}
.ymx-careers-app .ymx-pv-side h4 {
  font-family:'Fraunces',Georgia,serif; font-size:20px; font-weight:600;
  color:var(--navy-deep); margin:0 0 14px;
}
.ymx-careers-app .ymx-pv-extras { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.ymx-careers-app .ymx-pv-extras li {
  display:flex; gap:10px; align-items:flex-start; font-size:13.5px; line-height:1.45; color:var(--text);
}
.ymx-careers-app .ymx-pv-extras li.is-off { color:var(--faint); }
.ymx-careers-app .ymx-pv-extras li i { font-style:normal; color:var(--amber-deep); font-weight:600; }
.ymx-careers-app .ymx-pv-tick { flex:none; width:16px; font-weight:800; color:var(--ok); }
.ymx-careers-app .ymx-pv-extras li.is-off .ymx-pv-tick { color:var(--line-strong); }

@media (max-width:640px) {
  .ymx-careers-app .ymx-pv-tabs { grid-template-columns:1fr; }
  .ymx-careers-app .ymx-pv-tab { flex-direction:row; gap:10px; justify-content:space-between; padding:12px 16px; }
  .ymx-careers-app .ymx-pv-hero { padding:18px; }
  .ymx-careers-app .ymx-pv-body { padding:4px 18px 18px; }
  .ymx-careers-app .ymx-pv-rows > div { flex-direction:column; gap:1px; }
}

/* ============================================================
   REVIEW BY SECTION, CERTIFICATE DOCUMENTS, TRAVEL DOCUMENTS
   ============================================================ */

/* The step strip is clickable now: going back is always allowed. */
.ymx-careers-app .step[data-goto] { cursor:pointer; }

/* ---- review ---- */
.ymx-careers-app .ymx-rev {
  border:1px solid var(--line); border-radius:var(--r-md);
  padding:14px 16px; margin-bottom:10px; background:#fff;
}
.ymx-careers-app .ymx-rev.is-missing { border-color:rgba(200,144,42,.55); background:rgba(232,171,54,.05); }
.ymx-careers-app .ymx-rev-head { display:flex; align-items:center; gap:10px; }
.ymx-careers-app .ymx-rev-head b { font-size:14.5px; color:var(--navy-deep); font-weight:700; }
.ymx-careers-app .ymx-rev-tick {
  flex:none; width:22px; height:22px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:800; color:#fff; background:var(--ok);
}
.ymx-careers-app .ymx-rev.is-missing .ymx-rev-tick { background:var(--warn); }
.ymx-careers-app .ymx-rev-edit {
  margin-left:auto; font-size:12.5px; font-weight:700; color:var(--amber-deep);
  background:none; border:0; cursor:pointer; text-decoration:underline; padding:4px;
}
.ymx-careers-app .ymx-rev-missing {
  margin:10px 0 0; padding-left:32px; list-style:disc;
  font-size:13.5px; color:var(--muted); line-height:1.6;
}

/* ---- certificate document ---- */
.ymx-careers-app .ymx-cert-doc {
  margin-top:14px; padding-top:14px; border-top:1px dashed var(--line);
}
.ymx-careers-app .ymx-cert-doc.is-on {
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
}
.ymx-careers-app .ymx-cert-doc.is-on a {
  font-size:13.5px; font-weight:600; color:var(--amber-deep); text-decoration:underline;
}
.ymx-careers-app .ymx-cert-doc.is-on button {
  color:var(--bad); font-size:12.5px; background:none; border:0; cursor:pointer;
}
.ymx-careers-app .ymx-cert-doc.is-waiting .hint { margin:0; }
.ymx-careers-app .ymx-cert-pill {
  font-size:11px; font-weight:700; letter-spacing:.04em;
  padding:3px 9px; border-radius:var(--pill);
  background:var(--cream-2); border:1px solid var(--line); color:var(--muted);
}
.ymx-careers-app .ymx-cert-pill.is-ok {
  background:rgba(31,157,85,.12); border-color:rgba(31,157,85,.4); color:#157a41;
}
.ymx-careers-app .ymx-cert-pill.is-warn {
  background:rgba(200,144,42,.14); border-color:rgba(200,144,42,.45); color:var(--amber-deep);
}

/* ---- travel documents ---- */
.ymx-careers-app .ymx-doc-row {
  border-bottom:1px solid var(--line-soft); padding:12px 0;
}
.ymx-careers-app .ymx-doc-row:last-child { border-bottom:0; padding-bottom:0; }
.ymx-careers-app .ymx-doc-detail {
  margin-top:12px; padding-left:30px; border-left:2px solid var(--line);
}
@media (max-width:640px) {
  .ymx-careers-app .ymx-doc-detail { padding-left:14px; }
  .ymx-careers-app .ymx-rev-edit { margin-left:0; width:100%; text-align:left; }
  .ymx-careers-app .ymx-rev-head { flex-wrap:wrap; }
}

/* ============================================================
   v1.8 — photo and certificate controls, and the full profile view
   ============================================================ */

/* Two buttons instead of one bare file input: the camera, or a file. */
.ymx-careers-app .ymx-photo-actions,
.ymx-careers-app .ymx-cert-actions {
  display:flex; flex-wrap:wrap; gap:8px; margin-bottom:10px;
}
.ymx-careers-app .ymx-cert-actions { margin-top:2px; }
@media (max-width:520px) {
  .ymx-careers-app .ymx-photo-actions .cta,
  .ymx-careers-app .ymx-cert-actions .cta { flex:1 1 auto; }
}

/* ---- the profile preview, laid out like the live profile page ---- */
.ymx-careers-app .ymx-pv-head {
  display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.ymx-careers-app .ymx-pv-grid { display:grid; grid-template-columns:1fr; }
.ymx-careers-app .ymx-pv-main { padding:6px 22px 22px; }
.ymx-careers-app .ymx-pv-rail {
  padding:6px 22px 22px; border-top:1px solid var(--line-soft);
}
@media (min-width:760px) {
  .ymx-careers-app .ymx-pv-grid { grid-template-columns:1.55fr 1fr; }
  .ymx-careers-app .ymx-pv-rail { border-top:0; border-left:1px solid var(--line-soft); }
}
/* The rail is denser than the reading column. */
.ymx-careers-app .ymx-pv-rail .ymx-pv-sec:first-child { padding-top:18px; }

/* "View my profile" breaks the card out of the narrow form column. */
.ymx-careers-app .ymx-pv.is-full {
  position:relative;
  width:calc(100vw - 2 * var(--gutter));
  max-width:1180px;
  margin-left:50%;
  transform:translateX(-50%);
}
@media (max-width:900px) {
  .ymx-careers-app .ymx-pv.is-full { width:auto; margin-left:0; transform:none; }
}
