:root {
    --navy: #081b36;
    --navy-light: #102d54;
    --orange: #f45b20;
    --orange-light: #ff843e;
    --blue: #1677ef;
    --ink: #172843;
    --muted: #687992;
    --border: #e2eaf4;
    --background: #f5f8fd;
    --white: #fff;
    --green: #07865b;
    --shadow: 0 16px 45px rgba(17, 47, 85, .07);
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 100px;
}

body {
    margin: 0;
    color: var(--ink);
    background: var(--background);
    font-family: "DM Sans", Arial, sans-serif;
    font-size: 14px;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
select,
textarea {
    font: inherit;
}

button,
a,
input,
select,
textarea {
    -webkit-tap-highlight-color: transparent;
}

:focus-visible {
    outline: 3px solid rgba(22, 119, 239, .6);
    outline-offset: 3px;
}

.apply-container {
    width: min(1180px, calc(100% - 40px));
    margin-inline: auto;
}

.apply-header {
    position: sticky;
    top: 0;
    z-index: 100;
    color: #fff;
    background: rgba(8, 27, 54, .97);
    border-bottom: 1px solid rgba(255, 255, 255, .08);
    backdrop-filter: blur(15px);
}

.apply-header-inner {
    min-height: 78px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.apply-brand {
    display: inline-flex;
    align-items: center;
    gap: 11px;
}

.apply-brand-mark {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    color: white;
    background: linear-gradient(140deg, var(--orange-light), var(--orange));
    border-radius: 13px;
    box-shadow: 0 7px 20px rgba(244, 91, 32, .23);
    font-family: "Manrope", sans-serif;
    font-size: 19px;
    font-weight: 800;
}

.apply-brand-copy {
    display: flex;
    flex-direction: column;
    line-height: 1.15;
}

.apply-brand-copy strong {
    font-family: "Manrope", sans-serif;
    font-size: 17px;
    font-weight: 800;
}

.apply-brand-copy small {
    margin-top: 4px;
    font-size: 9px;
    letter-spacing: 1.4px;
}

.back-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 15px;
    color: #dce8f8;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
    transition: background .2s ease;
}

.back-link:hover {
    background: rgba(255, 255, 255, .08);
}

.apply-main {
    min-height: 70vh;
    padding-block: 32px 80px;
    background:
        radial-gradient(ellipse at 8% 0%, rgba(213, 231, 255, .6), transparent 38%),
        var(--background);
}

.apply-breadcrumb {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 27px;
    color: #8795a9;
    font-size: 12px;
}

.apply-breadcrumb a {
    color: var(--blue);
    font-weight: 700;
}

.apply-intro {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 34px;
}

.apply-kicker,
.panel-kicker {
    color: var(--orange);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.7px;
}

.apply-intro h1 {
    margin: 9px 0 8px;
    color: var(--navy);
    font-family: "Manrope", sans-serif;
    font-size: clamp(32px, 4vw, 47px);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1.7px;
}

.apply-intro h1 span {
    color: var(--orange);
}

.apply-intro p {
    margin: 0;
    color: var(--muted);
    font-size: 14px;
}

.apply-step-indicator {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 16px;
    background: white;
    border: 1px solid var(--border);
    border-radius: 14px;
}

.step-number {
    display: grid;
    width: 39px;
    height: 39px;
    place-items: center;
    color: white;
    background: var(--navy);
    border-radius: 12px;
    font-weight: 800;
}

.apply-step-indicator strong,
.apply-step-indicator small {
    display: block;
}

.apply-step-indicator strong {
    color: var(--navy);
    font-size: 12px;
}

.apply-step-indicator small {
    margin-top: 3px;
    color: var(--muted);
    font-size: 10px;
}

.apply-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 310px;
    align-items: start;
    gap: 25px;
}

.application-form-panel {
    min-width: 0;
    padding: clamp(22px, 4vw, 38px);
    background: white;
    border: 1px solid #e6edf6;
    border-radius: 22px;
    box-shadow: var(--shadow);
}

.form-panel-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 24px;
}

.form-panel-heading h2 {
    margin: 5px 0 0;
    color: var(--navy);
    font-family: "Manrope", sans-serif;
    font-size: 26px;
    font-weight: 800;
    letter-spacing: -.7px;
}

.required-note {
    color: #7a899e;
    font-size: 10px;
    white-space: nowrap;
}

.required-note span,
.form-field label > span,
.consent-row strong {
    color: var(--orange);
}

.selected-job-banner {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 32px;
    padding: 18px;
    background: linear-gradient(120deg, #f0f6ff, #fff8f4);
    border: 1px solid #e0eafb;
    border-radius: 16px;
}

.selected-job-icon {
    display: grid;
    width: 49px;
    height: 49px;
    flex: 0 0 49px;
    place-items: center;
    color: var(--orange);
    background: #ffebe0;
    border: 1px solid #ffdcc9;
    border-radius: 14px;
    font-size: 24px;
}

.selected-job-copy {
    min-width: 0;
    flex: 1;
}

.selected-job-copy > span {
    color: #8291a5;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.1px;
}

.selected-job-copy h3 {
    margin: 3px 0 7px;
    color: var(--navy);
    font-family: "Manrope", sans-serif;
    font-size: 16px;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.selected-job-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.selected-job-tags span {
    padding: 4px 8px;
    color: #52647d;
    background: white;
    border: 1px solid #e4ebf5;
    border-radius: 6px;
    font-size: 9px;
    font-weight: 700;
}

.change-job-link {
    color: var(--blue);
    font-size: 11px;
    font-weight: 800;
}

.form-section {
    padding-bottom: 29px;
    margin-bottom: 29px;
    border-bottom: 1px solid #edf1f6;
}

.form-section:last-of-type {
    margin-bottom: 0;
}

.form-section-heading {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    margin-bottom: 22px;
}

.section-number {
    display: grid;
    width: 37px;
    height: 37px;
    flex: 0 0 37px;
    place-items: center;
    color: var(--blue);
    background: #eaf3ff;
    border: 1px solid #dceaff;
    border-radius: 11px;
    font-family: "Manrope", sans-serif;
    font-size: 12px;
    font-weight: 800;
}

.form-section-heading h3 {
    margin: 0;
    color: var(--navy);
    font-family: "Manrope", sans-serif;
    font-size: 17px;
    font-weight: 800;
}

.form-section-heading p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 11px;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 19px 17px;
}

.form-field {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 8px;
}

.form-field.full-width {
    grid-column: 1 / -1;
}

.form-field > label {
    color: #263954;
    font-size: 12px;
    font-weight: 700;
}

.form-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.form-field select,
.form-field textarea {
    width: 100%;
    min-width: 0;
    min-height: 47px;
    padding: 12px 13px;
    color: var(--ink);
    background: #fbfcfe;
    border: 1px solid #dce5f0;
    border-radius: 10px;
    outline: none;
    font-size: 12px;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.form-field textarea {
    min-height: 95px;
    resize: vertical;
}

.form-field input::placeholder,
.form-field textarea::placeholder {
    color: #a0adbd;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
    background: white;
    border-color: #7db4ff;
    box-shadow: 0 0 0 4px rgba(22, 119, 239, .08);
}

.form-field input[aria-invalid="true"],
.form-field select[aria-invalid="true"],
.form-field textarea[aria-invalid="true"] {
    border-color: #e64c4c;
    box-shadow: 0 0 0 3px rgba(230, 76, 76, .08);
}

.form-field small,
.field-help {
    color: #8795a8;
    font-size: 10px;
    line-height: 1.65;
}

.choice-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.choice-option {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background: #f8faff;
    border: 1px solid var(--border);
    border-radius: 9px;
    font-size: 11px;
}

.choice-option input {
    accent-color: var(--blue);
}

.upload-box {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 19px;
    background: #f8faff;
    border: 1px dashed #b8cce5;
    border-radius: 14px;
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease;
}

.upload-box:hover,
.upload-box.is-dragging {
    background: #eef5ff;
    border-color: var(--blue);
}

.upload-icon {
    display: grid;
    width: 45px;
    height: 45px;
    flex: 0 0 45px;
    place-items: center;
    color: var(--blue);
    background: #e5f0ff;
    border-radius: 13px;
    font-size: 24px;
}

.upload-copy {
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
    gap: 3px;
}

.upload-copy strong {
    color: var(--navy);
    font-size: 12px;
}

.upload-copy small {
    color: #78879d;
    font-size: 10px;
}

.upload-copy > span {
    overflow-wrap: anywhere;
    color: var(--blue);
    font-size: 10px;
    font-weight: 700;
}

.upload-button {
    padding: 8px 11px;
    color: var(--blue);
    background: white;
    border: 1px solid #d4e4fa;
    border-radius: 8px;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

.visually-hidden-file {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    clip-path: inset(50%);
    border: 0;
}

.visually-hidden-file:focus-visible + .field-help {
    outline: 2px solid var(--blue);
}

.consent-row {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    margin-top: 24px;
    padding: 15px;
    background: #f8faff;
    border: 1px solid #e5edf7;
    border-radius: 12px;
    cursor: pointer;
}

.consent-row input {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    margin-top: 3px;
    accent-color: var(--blue);
}

.consent-row > span {
    color: #5e6e84;
    font-size: 11px;
    line-height: 1.8;
}

.form-notice {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 13px;
    padding: 12px 14px;
    color: #526985;
    background: #f0f6ff;
    border: 1px solid #e0ebfa;
    border-radius: 10px;
}

.form-notice > span {
    color: var(--blue);
    font-size: 17px;
}

.form-notice p {
    margin: 0;
    font-size: 10px;
    line-height: 1.8;
}

.form-submit-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: 27px;
}

.cancel-link {
    padding: 12px 5px;
    color: #64758d;
    font-size: 12px;
    font-weight: 700;
}

.button-submit {
    display: inline-flex;
    min-height: 50px;
    align-items: center;
    justify-content: center;
    gap: 13px;
    padding: 12px 22px;
    color: white;
    background: linear-gradient(110deg, var(--orange-light), var(--orange));
    border: 0;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(244, 91, 32, .22);
    font-size: 12px;
    font-weight: 800;
    transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}

.button-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 27px rgba(244, 91, 32, .3);
}

.button-submit:disabled {
    cursor: wait;
    opacity: .7;
    transform: none;
}

.submit-arrow {
    font-size: 18px;
}

.form-footer-note {
    margin: 15px 0 0;
    color: #8b98a9;
    font-size: 10px;
    text-align: center;
}

.application-sidebar {
    position: sticky;
    top: 100px;
    display: flex;
    flex-direction: column;
    gap: 17px;
}

.sidebar-job-card {
    padding: 24px;
    color: white;
    background:
        radial-gradient(circle at 100% 0%, rgba(42, 125, 216, .25), transparent 40%),
        linear-gradient(145deg, #081b36, #102f56);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 20px;
    box-shadow: 0 15px 35px rgba(8, 27, 54, .15);
}

.sidebar-card-kicker {
    color: #ff9a67;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

.sidebar-job-card h2 {
    margin: 12px 0 5px;
    font-family: "Manrope", sans-serif;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.sidebar-job-card > p {
    margin: 0;
    color: #b3c7df;
    font-size: 11px;
}

.sidebar-divider {
    height: 1px;
    margin: 21px 0;
    background: rgba(255, 255, 255, .12);
}

.sidebar-detail {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 19px;
}

.sidebar-detail > span {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    color: #8fcaff;
    background: rgba(143, 202, 255, .1);
    border: 1px solid rgba(143, 202, 255, .12);
    border-radius: 10px;
    font-size: 17px;
}

.sidebar-detail small,
.sidebar-detail strong {
    display: block;
}

.sidebar-detail small {
    margin-bottom: 4px;
    color: #9eb4cd;
    font-size: 10px;
}

.sidebar-detail strong {
    color: #fff;
    font-size: 11px;
    line-height: 1.7;
    overflow-wrap: anywhere;
}

.sidebar-help-card {
    padding: 23px;
    background: white;
    border: 1px solid var(--border);
    border-radius: 18px;
}

.help-icon {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    color: var(--blue);
    background: #eaf3ff;
    border-radius: 12px;
    font-family: "Manrope", sans-serif;
    font-size: 19px;
    font-weight: 800;
}

.sidebar-help-card h3 {
    margin: 13px 0 6px;
    color: var(--navy);
    font-family: "Manrope", sans-serif;
    font-size: 16px;
}

.sidebar-help-card p {
    margin: 0 0 15px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.8;
}

.sidebar-help-card > a {
    display: block;
    margin-top: 10px;
    color: var(--blue);
    font-size: 11px;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.sidebar-help-card > a span {
    margin-left: 4px;
}

.sidebar-trust-note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 14px;
    color: #526d60;
    background: #eaf8f1;
    border: 1px solid #d4f0e2;
    border-radius: 13px;
}

.sidebar-trust-note > span {
    display: grid;
    width: 23px;
    height: 23px;
    flex: 0 0 23px;
    place-items: center;
    color: var(--green);
    background: white;
    border-radius: 7px;
    font-weight: 800;
}

.sidebar-trust-note p {
    margin: 0;
    font-size: 10px;
    line-height: 1.8;
}

.apply-footer {
    color: #c4d2e3;
    background: #041124;
}

.apply-footer-inner {
    display: flex;
    min-height: 65px;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.apply-footer p,
.apply-footer a {
    margin: 0;
    font-size: 11px;
}

.apply-footer a {
    color: #91c8ff;
    font-weight: 700;
}



/* APPLICATION SUCCESS / CONFIRMATION */

.confirmation-card {
    width: min(760px, 100%);
    margin: 28px auto;
    padding: clamp(25px, 5vw, 55px);
    text-align: center;
    background: #fff;
    border: 1px solid #e3eaf4;
    border-radius: 26px;
    box-shadow: 0 22px 65px rgba(17, 47, 85, .09);
}

.confirmation-success-icon {
    display: grid;
    width: 86px;
    height: 86px;
    margin: 0 auto 23px;
    place-items: center;
    color: #0a9b6a;
    background: #e4f8ee;
    border: 1px solid #c8efdc;
    border-radius: 27px;
    animation: confirmationPop .5s ease both;
}

.confirmation-success-icon svg {
    width: 52px;
    height: 52px;
}

.confirmation-kicker {
    color: #0a9666;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.8px;
}

.confirmation-card h1 {
    max-width: 590px;
    margin: 14px auto;
    color: #081b36;
    font-family: "Manrope", sans-serif;
    font-size: clamp(29px, 5vw, 43px);
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1.4px;
}

.confirmation-card h1 span {
    color: #f45b20;
}

.confirmation-description {
    max-width: 530px;
    margin: 0 auto;
    color: #687992;
    font-size: 13px;
    line-height: 1.9;
}

.confirmation-reference {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 30px;
    padding: 18px;
    text-align: left;
    background: #f5f8fd;
    border: 1px dashed #bdcfe6;
    border-radius: 15px;
}

.confirmation-reference > div {
    min-width: 0;
}

.confirmation-reference span,
.confirmation-reference strong {
    display: block;
}

.confirmation-reference span {
    color: #78889e;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
}

.confirmation-reference strong {
    margin-top: 6px;
    color: #081b36;
    font-family: "Manrope", sans-serif;
    font-size: 17px;
    overflow-wrap: anywhere;
}

.reference-copy-button {
    flex-shrink: 0;
    padding: 9px 12px;
    color: #075bd8;
    background: #fff;
    border: 1px solid #d5e5fa;
    border-radius: 9px;
    font-size: 10px;
    font-weight: 800;
}

.reference-copy-button:hover {
    background: #eaf3ff;
}

.confirmation-job {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 19px;
    padding: 20px;
    text-align: left;
    background: linear-gradient(120deg, #f0f6ff, #fff8f4);
    border: 1px solid #e4ebf5;
    border-radius: 15px;
}

.confirmation-job-icon {
    display: grid;
    width: 49px;
    height: 49px;
    flex: 0 0 49px;
    place-items: center;
    color: #f45b20;
    background: #ffebe0;
    border-radius: 14px;
    font-size: 25px;
}

.confirmation-job > div:last-child {
    min-width: 0;
}

.confirmation-job > div:last-child > span {
    color: #7f8da1;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
}

.confirmation-job h2 {
    margin: 4px 0;
    color: #081b36;
    font-family: "Manrope", sans-serif;
    font-size: 16px;
    overflow-wrap: anywhere;
}

.confirmation-job p {
    margin: 0;
    color: #687992;
    font-size: 11px;
}

.confirmation-job p span {
    padding-inline: 5px;
    color: #f45b20;
}

.confirmation-status {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 17px;
    padding: 16px;
    text-align: left;
    background: #eaf8f1;
    border: 1px solid #d5f0e3;
    border-radius: 13px;
}

.confirmation-status-dot {
    width: 10px;
    height: 10px;
    flex: 0 0 10px;
    margin-top: 5px;
    background: #0a9b6a;
    border-radius: 50%;
    box-shadow: 0 0 0 5px rgba(10, 155, 106, .1);
}

.confirmation-status strong {
    color: #08764f;
    font-size: 12px;
}

.confirmation-status p {
    margin: 4px 0 0;
    color: #527666;
    font-size: 11px;
    line-height: 1.7;
}

.confirmation-next-steps {
    margin-top: 29px;
    text-align: left;
}

.confirmation-next-steps > h3 {
    margin: 0 0 17px;
    color: #081b36;
    font-family: "Manrope", sans-serif;
    font-size: 17px;
}

.confirmation-step {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-top: 15px;
}

.confirmation-step > span {
    display: grid;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    place-items: center;
    color: #075bd8;
    background: #eaf3ff;
    border: 1px solid #dceaff;
    border-radius: 11px;
    font-size: 11px;
    font-weight: 800;
}

.confirmation-step strong {
    color: #172843;
    font-size: 12px;
}

.confirmation-step p {
    margin: 4px 0 0;
    color: #687992;
    font-size: 11px;
    line-height: 1.8;
}

.confirmation-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 17px;
    margin-top: 30px;
}

.confirmation-home-link {
    color: #526680;
    font-size: 12px;
    font-weight: 700;
}

.confirmation-home-link:hover {
    color: #075bd8;
}

.confirmation-note {
    margin: 23px 0 0;
    color: #8b98a9;
    font-size: 10px;
    line-height: 1.8;
}

.confirmation-error-icon {
    display: grid;
    width: 70px;
    height: 70px;
    margin: 0 auto 22px;
    place-items: center;
    color: #a75b00;
    background: #fff3d9;
    border: 1px solid #ffe2a1;
    border-radius: 22px;
    font-family: "Manrope", sans-serif;
    font-size: 30px;
    font-weight: 800;
}

.confirmation-error-card .confirmation-kicker {
    color: #a75b00;
}

@keyframes confirmationPop {
    from {
        opacity: 0;
        transform: scale(.86);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@media (max-width: 600px) {
    .confirmation-card {
        margin-block: 8px;
        padding: 25px 17px;
        border-radius: 19px;
    }

    .confirmation-success-icon {
        width: 72px;
        height: 72px;
        border-radius: 22px;
    }

    .confirmation-success-icon svg {
        width: 44px;
        height: 44px;
    }

    .confirmation-card h1 {
        font-size: 30px;
        letter-spacing: -.9px;
    }

    .confirmation-description {
        font-size: 12px;
    }

    .confirmation-reference {
        align-items: flex-start;
        flex-direction: column;
    }

    .confirmation-reference strong {
        font-size: 15px;
    }

    .confirmation-job {
        padding: 15px;
    }

    .confirmation-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .confirmation-actions .button {
        width: 100%;
    }

    .confirmation-home-link {
        padding: 8px;
        text-align: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .confirmation-success-icon {
        animation: none;
    }
}


@media (max-width: 950px) {
    .apply-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .application-sidebar {
        position: static;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: start;
    }

    .sidebar-job-card {
        grid-row: span 2;
    }
}

@media (max-width: 600px) {
    .apply-container {
        width: calc(100% - 28px);
    }

    .apply-header-inner {
        min-height: 68px;
    }

    .apply-brand-mark {
        width: 39px;
        height: 39px;
        font-size: 16px;
    }

    .apply-brand-copy strong {
        font-size: 14px;
    }

    .apply-brand-copy small {
        font-size: 8px;
    }

    .back-link {
        padding: 9px 10px;
        font-size: 10px;
    }

    .apply-main {
        padding-block: 24px 45px;
    }

    .apply-intro {
        align-items: flex-start;
        flex-direction: column;
        gap: 18px;
        margin-bottom: 23px;
    }

    .apply-intro h1 {
        font-size: 34px;
        letter-spacing: -1.2px;
    }

    .apply-intro p {
        font-size: 12px;
    }

    .apply-step-indicator {
        width: 100%;
    }

    .application-form-panel {
        padding: 19px 15px;
        border-radius: 17px;
    }

    .form-panel-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .form-panel-heading h2 {
        font-size: 23px;
    }

    .selected-job-banner {
        align-items: flex-start;
        gap: 10px;
        padding: 13px;
    }

    .selected-job-icon {
        width: 39px;
        height: 39px;
        flex-basis: 39px;
        font-size: 19px;
    }

    .selected-job-copy h3 {
        font-size: 14px;
    }

    .change-job-link {
        font-size: 10px;
    }

    .form-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
    }

    .form-field.full-width {
        grid-column: auto;
    }

    .form-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
    .form-field select,
    .form-field textarea {
        font-size: 13px;
    }

    .upload-box {
        flex-wrap: wrap;
        padding: 14px;
    }

    .upload-button {
        margin-left: 59px;
    }

    .form-submit-row {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .button-submit {
        width: 100%;
    }

    .cancel-link {
        text-align: center;
    }

    .application-sidebar {
        display: flex;
    }

    .apply-footer-inner {
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
        padding-block: 17px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
}