.job-page,
.resume-page { background: #f4f7fb; }

.job-hero {
  padding: 88px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 88% 0%, rgba(17,104,200,.18), transparent 32%),
    linear-gradient(135deg, #fff 0%, #edf5ff 100%);
  border-bottom: 1px solid #dce7f3;
}

.job-kicker,
.job-section-heading > div > p {
  margin: 0 0 12px;
  color: #1168c8;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .15em;
}

.job-hero h1,
.resume-hero h1 {
  margin: 0 0 20px;
  color: #002794;
  font-size: clamp(42px, 6vw, 70px);
  line-height: 1.15;
  font-weight: 650;
  letter-spacing: -.035em;
}

.job-hero__lead {
  max-width: 700px;
  margin: 0;
  color: #566b89;
  font-size: 17px;
  line-height: 1.8;
}

.job-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.job-primary-button,
.job-secondary-button {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 12px 22px;
  border-radius: 999px;
  font-weight: 650;
  text-decoration: none;
}
.job-primary-button { background: #002794; color: #fff; box-shadow: 0 10px 24px rgba(0,39,148,.18); }
.job-primary-button:hover { background: #001d70; color: #fff; }
.job-secondary-button { border: 1px solid #b8c9df; background: rgba(255,255,255,.7); color: #17355f; }

.job-hero__panel {
  padding: 32px;
  border: 1px solid rgba(0,39,148,.12);
  border-radius: 24px;
  background: rgba(255,255,255,.82);
  box-shadow: 0 20px 55px rgba(0,39,148,.08);
}
.job-hero__panel span { display: block; margin-bottom: 12px; color: #1168c8; font-size: 11px; font-weight: 750; letter-spacing: .15em; }
.job-hero__panel strong { display: block; margin-bottom: 10px; color: #10285f; font-size: 24px; }
.job-hero__panel p { margin: 0; color: #637592; line-height: 1.7; }

.job-list-section { padding: 82px 0 95px; }
.job-section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 30px; }
.job-section-heading h2 { margin: 0; color: #10285f; font-size: clamp(30px, 4vw, 44px); font-weight: 650; }
.job-section-heading > span { padding: 8px 14px; border: 1px solid #d6e2ef; border-radius: 999px; background: #fff; color: #526987; font-size: 13px; }

.job-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) repeat(2, minmax(180px, .7fr));
  gap: 14px;
  margin-bottom: 30px;
  padding: 20px;
  border: 1px solid #dfe8f1;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 10px 35px rgba(0,39,148,.045);
}
.job-field label { display: block; margin-bottom: 7px; color: #344d70; font-size: 12px; font-weight: 650; }
.job-field input,
.job-field select,
.resume-form input:not([type="checkbox"]),
.resume-form textarea {
  width: 100%;
  min-height: 48px;
  padding: 11px 14px;
  border: 1px solid #cfdae7;
  border-radius: 12px;
  background: #fff;
  color: #233d62;
  outline: none;
}
.job-field input:focus,
.job-field select:focus,
.resume-form input:focus,
.resume-form textarea:focus { border-color: #1168c8; box-shadow: 0 0 0 3px rgba(17,104,200,.12); }

.job-card {
  display: flex;
  height: 100%;
  flex-direction: column;
  padding: 28px;
  border: 1px solid #dfe8f1;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 10px 34px rgba(0,39,148,.045);
  transition: transform .22s ease, box-shadow .22s ease;
}
.job-card:hover { transform: translateY(-4px); box-shadow: 0 20px 48px rgba(0,39,148,.1); }
.job-card__topline { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.job-card__source { padding: 6px 10px; border-radius: 999px; background: #edf4fc; color: #285d9a; font-size: 11px; font-weight: 700; }
.job-card__source.is-jira { background: #e8eeff; color: #002794; }
.job-card__posted { color: #8290a5; font-size: 12px; }
.job-card__heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 20px; }
.job-card__heading h3 { flex: 1 1 auto; margin: 0; color: #10285f; font-size: 25px; line-height: 1.4; font-weight: 650; }
.job-card__heading .job-card__company { flex: 0 1 48%; margin: 0; color: #1168c8; font-weight: 650; text-align: right; }
.job-card__meta { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; margin: 0 0 20px; padding: 17px; border-radius: 15px; background: #f5f8fc; }
.job-card__meta > div:first-child { grid-column: 1 / -1; }
.job-card__meta dt { margin-bottom: 3px; color: #8492a7; font-size: 15px; font-weight: 600; }
.job-card__meta dd { margin: 0; color: #2e486d; font-size: 17px; }
.job-card__summary { margin: 0 0 17px; color: #5f718d; font-size: 18px; line-height: 1.75; }
.job-card__details-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-bottom: 22px; }
.job-card__requirements,
.job-card__benefits { min-width: 0; color: #4d6382; }
.job-card__requirements strong,
.job-card__benefits strong { color: #263f64; font-size: 17px; }
.job-card__requirements ul,
.job-card__benefits ul { margin: 9px 0 0; padding-left: 20px; font-size: 17px; line-height: 1.75; }
.job-card__footer { margin-top: auto; padding-top: 20px; border-top: 1px solid #e6edf4; }
.job-card__footer a { display: inline-flex; align-items: center; gap: 8px; color: #075fc7; font-weight: 650; text-decoration: none; }
.job-card__footer a:hover span { transform: translateX(4px); }
.job-card__footer span { transition: transform .2s ease; }
.job-list-item[hidden] { display: none; }
.job-empty { padding: 60px 24px; border: 1px dashed #cbd8e7; border-radius: 20px; background: #fff; text-align: center; }
.job-empty h3 { color: #17355f; }
.job-empty p { margin: 8px 0 0; color: #70809a; }

.job-resume-cta { padding: 0 0 95px; }
.job-resume-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 42px; border-radius: 25px; background: #002794; color: #fff; }
.job-resume-cta__inner p { margin: 0 0 8px; color: #aecdff; font-size: 13px; }
.job-resume-cta__inner h2 { max-width: 760px; margin: 0; font-size: clamp(24px, 4vw, 36px); line-height: 1.4; }
.job-resume-cta__inner a { flex: 0 0 auto; padding: 13px 22px; border-radius: 999px; background: #fff; color: #002794; font-weight: 700; text-decoration: none; }

.resume-hero { padding: 64px 0 70px; background: linear-gradient(135deg, #fff 0%, #edf5ff 100%); border-bottom: 1px solid #dce7f3; }
.resume-hero h1 { margin-bottom: 12px; font-size: clamp(41px, 5vw, 61px); }
.resume-hero > .container > p:last-child { max-width: 700px; margin: 0; color: #5e718f; font-size: 19px; line-height: 1.75; }
.resume-back { display: inline-block; margin-bottom: 28px; color: #416181; font-size: 19px; text-decoration: none; }
.resume-section { padding: 72px 0 95px; }
.resume-preview-alert { margin-bottom: 28px; padding: 18px 22px; border: 1px solid #9bc7ae; border-radius: 15px; background: #edf9f1; color: #245c3a; font-size: 19px; }
.resume-preview-alert strong { display: block; margin-bottom: 4px; }
.resume-preview-alert p { margin: 0; }
.resume-form { padding: clamp(25px, 5vw, 48px); border: 1px solid #dfe8f1; border-radius: 24px; background: #fff; box-shadow: 0 15px 48px rgba(0,39,148,.06); }
.resume-job-context { margin-bottom: 32px; padding: 22px; border: 1px solid #c9daf0; border-radius: 17px; background: #f1f6ff; }
.resume-job-context > p { margin: 0 0 14px; color: #075fc7; font-size: 17px; font-weight: 700; }
.resume-job-context__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.resume-job-context__grid > div { min-width: 0; }
.resume-job-context__grid span { display: block; margin-bottom: 4px; color: #7588a5; font-size: 16px; }
.resume-job-context__grid strong { display: block; color: #10285f; font-size: 21px; line-height: 1.5; overflow-wrap: anywhere; }
.resume-form__heading { margin-bottom: 32px; }
.resume-form__heading span { color: #1168c8; font-size: 14px; font-weight: 700; letter-spacing: .14em; }
.resume-form__heading h2 { margin: 7px 0; color: #10285f; font-size: 35px; }
.resume-form__heading p { margin: 0; color: #8490a4; font-size: 16px; }
.resume-form label:not(.resume-upload):not(.resume-consent) { display: block; margin-bottom: 8px; color: #304a6d; font-size: 16px; font-weight: 650; }
.resume-form input:not([type="checkbox"]),
.resume-form textarea { font-size: 19px; }
.resume-form input[readonly] { background: #edf2f8; color: #586b86; cursor: not-allowed; }
.resume-form textarea { resize: vertical; }
.resume-upload { display: flex; min-height: 125px; align-items: center; justify-content: center; flex-direction: column; gap: 7px; padding: 22px; border: 2px dashed #b7c9dd; border-radius: 16px; background: #f7faff; text-align: center; cursor: pointer; }
.resume-upload:hover { border-color: #1168c8; background: #f0f6ff; }
.resume-upload strong { color: #075fc7; font-size: 19px; }
.resume-upload span { color: #77869c; font-size: 15px; }
.resume-file-list { display: grid; gap: 10px; margin-top: 14px; }
.resume-file-list[hidden] { display: none; }
.resume-file-item { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 16px; border: 1px solid #d5e1ee; border-radius: 13px; background: #fff; }
.resume-file-item__info { min-width: 0; }
.resume-file-item__info strong { display: block; color: #2d476b; font-size: 17px; font-weight: 650; overflow-wrap: anywhere; }
.resume-file-item__info span { display: block; margin-top: 2px; color: #8290a4; font-size: 14px; }
.resume-file-item__actions { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; }
.resume-file-item__actions a,
.resume-file-item__actions button { display: inline-flex; min-height: 38px; align-items: center; justify-content: center; padding: 7px 13px; border-radius: 999px; font-size: 15px; font-weight: 650; text-decoration: none; }
.resume-file-item__actions a { border: 1px solid #b9cbe2; color: #075fc7; }
.resume-file-item__actions button { border: 1px solid #efc1c1; background: #fff5f5; color: #b52e2e; cursor: pointer; }
.resume-file-item__actions a:hover { background: #edf5ff; }
.resume-file-item__actions button:hover { background: #ffe8e8; }
.resume-consent { display: flex; align-items: flex-start; gap: 10px; color: #5a6d89; font-size: 16px; line-height: 1.6; }
.resume-consent input { margin-top: 4px; }
.resume-form__footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 32px; padding-top: 25px; border-top: 1px solid #e5edf5; }
.resume-form__footer p { margin: 0; color: #8a97aa; font-size: 15px; }
.resume-form__footer button { min-height: 48px; padding: 12px 23px; border: 0; border-radius: 999px; background: #002794; color: #fff; font-size: 19px; font-weight: 700; }
.resume-help-card { position: sticky; top: 105px; padding: 30px; border-radius: 22px; background: #10285f; color: #fff; }
.resume-help-card > span { color: #8fc2ff; font-size: 14px; font-weight: 700; letter-spacing: .13em; }
.resume-help-card h2 { margin: 10px 0 20px; font-size: 28px; line-height: 1.45; }
.resume-help-card ol { margin: 0 0 22px; padding-left: 22px; color: #d8e5f6; font-size: 19px; line-height: 1.9; }
.resume-help-card p { margin: 0; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.16); color: #b9cbe2; font-size: 16px; line-height: 1.7; }

.resume-result-page,
.resume-view-page { min-height: 70vh; padding: 90px 0; background: linear-gradient(135deg, #f7faff 0%, #eaf3ff 100%); }
.resume-result-card { max-width: 820px; margin: 0 auto; padding: clamp(30px, 6vw, 58px); border: 1px solid #d7e4f1; border-radius: 28px; background: #fff; box-shadow: 0 24px 70px rgba(0,39,148,.1); text-align: center; }
.resume-result-card__icon { display: grid; width: 76px; height: 76px; place-items: center; margin: 0 auto 24px; border-radius: 50%; background: #e7f8ed; color: #168447; font-size: 40px; font-weight: 700; }
.resume-result-card__icon.is-error { background: #fff0f0; color: #c33b3b; }
.resume-result-card h1 { margin: 0 0 15px; color: #002794; font-size: clamp(34px, 5vw, 50px); }
.resume-result-card__lead { margin: 0 auto 28px; color: #5d708d; font-size: 19px; line-height: 1.8; }
.resume-result-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 22px; text-align: left; }
.resume-result-summary > div { padding: 17px; border-radius: 14px; background: #f2f6fc; }
.resume-result-summary span,
.resume-view-job span { display: block; margin-bottom: 4px; color: #778ba7; font-size: 14px; }
.resume-result-summary strong,
.resume-view-job strong { color: #18365e; font-size: 18px; }
.resume-result-email { margin: 0 0 28px; padding: 20px; border-radius: 15px; text-align: left; }
.resume-result-email.is-success { border: 1px solid #a8dab9; background: #effaf3; color: #27623e; }
.resume-result-email.is-warning { border: 1px solid #efd08d; background: #fff8e9; color: #795b1a; }
.resume-result-email strong { font-size: 18px; }
.resume-result-email p { margin: 6px 0 0; font-size: 16px; line-height: 1.7; }
.resume-view-page > .container { max-width: 1000px; }
.resume-view-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 30px; }
.resume-view-heading h1 { margin: 0 0 10px; color: #002794; font-size: clamp(36px, 5vw, 54px); }
.resume-view-heading > div > p:last-child { margin: 0; color: #687b96; font-size: 17px; }
.resume-view-edit-button { flex: 0 0 auto; min-height: 48px; padding: 11px 22px; border: 2px solid #002794; border-radius: 999px; background: transparent; color: #002794; font-size: 17px; font-weight: 700; cursor: pointer; }
.resume-view-edit-button:hover { background: #002794; color: #fff; }
.resume-view-job { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin-bottom: 22px; padding: 24px; border-radius: 20px; background: #002794; }
.resume-view-job span { color: #adc7ee; }
.resume-view-job strong { color: #fff; }
.resume-view-card { margin-top: 20px; padding: clamp(24px, 5vw, 38px); border: 1px solid #dbe5f0; border-radius: 22px; background: #fff; }
.resume-view-card h2 { margin: 0 0 24px; color: #17365e; font-size: 27px; }
.resume-view-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; margin: 0; }
.resume-view-details .is-wide { grid-column: 1 / -1; }
.resume-view-details dt { margin-bottom: 5px; color: #7b8da6; font-size: 14px; }
.resume-view-details dd { margin: 0; color: #29476e; font-size: 18px; line-height: 1.7; overflow-wrap: anywhere; }
.resume-view-files { display: grid; gap: 10px; }
.resume-view-files > div { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 15px 17px; border-radius: 13px; background: #f3f7fc; }
.resume-view-files > div > div { min-width: 0; }
.resume-view-files strong { display: block; color: #29476e; overflow-wrap: anywhere; }
.resume-view-files span { display: block; color: #7c8da4; font-size: 14px; }
.resume-view-files a { flex: 0 0 auto; padding: 7px 14px; border: 1px solid #bfd0e4; border-radius: 999px; color: #075fc7; font-size: 15px; font-weight: 650; text-decoration: none; }
.resume-view-edit-form[hidden],
#resumeReadonlyContent[hidden] { display: none; }
.resume-view-edit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.resume-view-edit-grid .is-wide { grid-column: 1 / -1; }
.resume-view-edit-grid label { display: block; margin-bottom: 8px; color: #304a6d; font-size: 16px; font-weight: 650; }
.resume-view-edit-grid input,
.resume-view-edit-grid textarea { width: 100%; min-height: 50px; padding: 12px 14px; border: 1px solid #cbd8e6; border-radius: 12px; background: #fff; color: #233d62; font-size: 18px; outline: none; }
.resume-view-edit-grid textarea { resize: vertical; }
.resume-view-edit-grid input:focus,
.resume-view-edit-grid textarea:focus { border-color: #1168c8; box-shadow: 0 0 0 3px rgba(17,104,200,.12); }
.resume-view-edit-grid input:disabled { background: #edf2f7; color: #718097; }
.resume-view-edit-grid small { display: block; margin-top: 6px; color: #8291a7; font-size: 13px; }
.resume-edit-file-help { margin: -10px 0 20px; color: #70819a; font-size: 15px; line-height: 1.7; }
.resume-edit-existing-files,
.resume-edit-new-files { display: grid; gap: 10px; }
.resume-edit-existing-file,
.resume-edit-new-files > div { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 16px; border: 1px solid #dae4ef; border-radius: 13px; background: #f7faff; transition: opacity .2s ease, background-color .2s ease; }
.resume-edit-existing-file.is-removed { border-color: #efc4c4; background: #fff2f2; opacity: .7; }
.resume-edit-existing-file.is-removed > div:first-child { text-decoration: line-through; }
.resume-edit-existing-file > div:first-child,
.resume-edit-new-files > div > div { min-width: 0; }
.resume-edit-existing-file strong,
.resume-edit-new-files strong { display: block; color: #29476e; font-size: 16px; overflow-wrap: anywhere; }
.resume-edit-existing-file span,
.resume-edit-new-files span { display: block; margin-top: 2px; color: #8190a5; font-size: 13px; }
.resume-edit-existing-file__actions { display: flex; flex: 0 0 auto; gap: 8px; }
.resume-edit-existing-file__actions a,
.resume-edit-existing-file__actions button,
.resume-edit-new-files button { min-height: 38px; padding: 7px 13px; border-radius: 999px; font-size: 14px; font-weight: 650; text-decoration: none; cursor: pointer; }
.resume-edit-existing-file__actions a { border: 1px solid #bdd0e6; color: #075fc7; }
.resume-edit-existing-file__actions button,
.resume-edit-new-files button { border: 1px solid #efc1c1; background: #fff5f5; color: #b52e2e; }
.resume-edit-upload { display: flex; min-height: 110px; align-items: center; justify-content: center; flex-direction: column; gap: 6px; margin-top: 18px; padding: 20px; border: 2px dashed #b8cce2; border-radius: 15px; background: #f5f9ff; text-align: center; cursor: pointer; }
.resume-edit-upload:hover { border-color: #1168c8; background: #edf5ff; }
.resume-edit-upload strong { color: #075fc7; font-size: 18px; }
.resume-edit-upload span { color: #74869f; font-size: 14px; }
.resume-edit-new-files { margin-top: 12px; }
.resume-view-edit-actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 24px; }
.resume-view-edit-actions button { min-height: 48px; padding: 11px 22px; border-radius: 999px; font-size: 17px; font-weight: 700; cursor: pointer; }
.resume-edit-cancel { border: 1px solid #c7d4e3; background: #fff; color: #526884; }
.resume-edit-save { border: 0; background: #002794; color: #fff; }
.resume-edit-save:disabled { opacity: .6; cursor: wait; }

@media (max-width: 991px) {
  .job-toolbar { grid-template-columns: 1fr 1fr; }
  .job-field--search { grid-column: 1 / -1; }
  .job-resume-cta__inner { align-items: flex-start; flex-direction: column; }
  .resume-help-card { position: static; }
}

@media (max-width: 575px) {
  .job-hero { padding: 60px 0; }
  .job-hero__actions a { width: 100%; }
  .job-list-section { padding: 60px 0 75px; }
  .job-section-heading { align-items: flex-start; flex-direction: column; }
  .job-toolbar { grid-template-columns: 1fr; padding: 16px; }
  .job-field--search { grid-column: auto; }
  .job-card { padding: 22px; border-radius: 18px; }
  .job-card__meta { grid-template-columns: 1fr; }
  .job-card__meta > div:first-child { grid-column: auto; }
  .job-card__details-grid { grid-template-columns: 1fr; gap: 18px; }
  .job-resume-cta { padding-bottom: 75px; }
  .job-resume-cta__inner { padding: 28px 24px; border-radius: 20px; }
  .resume-hero { padding: 48px 0 55px; }
  .resume-section { padding: 52px 0 75px; }
  .resume-form { border-radius: 18px; }
  .resume-job-context__grid { grid-template-columns: 1fr; }
  .resume-file-item { align-items: flex-start; flex-direction: column; }
  .resume-file-item__actions { width: 100%; }
  .resume-file-item__actions a,
  .resume-file-item__actions button { flex: 1; }
  .resume-form__footer { align-items: stretch; flex-direction: column; }
  .resume-form__footer button { width: 100%; }
  .resume-result-page,
  .resume-view-page { padding: 55px 0; }
  .resume-result-card { border-radius: 20px; }
  .resume-result-summary,
  .resume-view-job,
  .resume-view-details,
  .resume-view-edit-grid { grid-template-columns: 1fr; }
  .resume-view-details .is-wide { grid-column: auto; }
  .resume-view-edit-grid .is-wide { grid-column: auto; }
  .resume-view-heading { align-items: flex-start; flex-direction: column; }
  .resume-view-edit-button { width: 100%; }
  .resume-edit-existing-file,
  .resume-edit-new-files > div { align-items: flex-start; flex-direction: column; }
  .resume-edit-existing-file__actions { width: 100%; }
  .resume-edit-existing-file__actions a,
  .resume-edit-existing-file__actions button,
  .resume-edit-new-files button { flex: 1; text-align: center; }
  .resume-view-edit-actions { align-items: stretch; flex-direction: column-reverse; }
  .resume-view-edit-actions button { width: 100%; }
}