.work-art {
  position: absolute;
  top: 155px;
  right: auto;
  left: 74px;
  width: calc(100% - 148px);
  height: 276px;
  overflow: hidden;
  border: 0;
  border-radius: 10px;
  background: #074158;
  opacity: 1;
}

.work-art img {
  position: absolute;
  top: -41px;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  width: 693px;
  height: 416.704px;
  max-width: none;
  border-radius: 0;
}

/* mobile (<768px) - banner flows in the stacked layout */
@media (max-width: 767px) {
    .work-art {
        position: relative;
        top: 0;
        left: 0;
        width: 100%;
        height: auto;
        margin: 24px 0 0;
    }

    .work-art img {
        position: static;
        transform: none;
        width: 100%;
        height: auto;
    }
}

/* cv upload field, styled like the text inputs with an orange icon */
.cr-file { position: relative; display: block; margin-top: 4px; }
.cr-file input[type="file"] { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; opacity: 0; cursor: pointer; }
.cr-file__text {
    display: flex; align-items: center; height: 43px;
    padding: 6px 46px 6px 10px; border-radius: 10px; background: #f2f2f2;
    color: rgba(2, 28, 37, .6); font: 16px NHaasGroteskTX, Arial, sans-serif;
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
.cr-file.has-file .cr-file__text { color: #021c25; }
.cr-file__icon {
    position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
    width: 31px; height: 31px; display: grid; place-items: center;
    border: 1.5px solid #f26522; border-radius: 8px; color: #f26522; pointer-events: none;
}
.cr-file__icon svg { width: 16px; height: 16px; }

/* captcha row: input + grey challenge box + reset */
.cr-captcha-field { grid-column: span 2; }
.cr-captcha-row { display: flex; align-items: center; gap: 16px; margin-top: 4px; }
.cr-captcha-input { flex: 0 0 340px; width: 340px; }
.cr-captcha-box {
    display: grid; place-items: center; min-width: 150px; height: 43px; padding: 0 22px;
    border-radius: 8px; background: #d9d9d9; color: #021c25;
    font: 600 18px NHaasGroteskTX, Arial, sans-serif; letter-spacing: 1px; user-select: none;
}
/* more specific than ".work form button" so the reset icon doesnt pick up the big submit style */
.work form button.cr-captcha-reset {
    width: 34px; height: 34px; margin: 0; padding: 0; border: 0; border-radius: 50%;
    background: transparent; color: #f2f2f2; font: 22px/1 NHaasGroteskTX, Arial, sans-serif;
    display: grid; place-items: center; cursor: pointer; transition: color .2s; flex: none;
}
.work form button.cr-captcha-reset:hover { color: #f26522; }

@media (max-width: 767px) {
    .cr-captcha-field { grid-column: auto; }
    .cr-captcha-row { flex-wrap: wrap; }
    .cr-captcha-input { flex: 1 1 100%; width: 100%; }
}

/* field validation */
.cr-err { display: none; margin-top: 4px; font-size: 13px; line-height: 15px; color: #ffc2b0; }
.cr-err.is-shown { display: block; }
.form-grid input.cr-invalid,
.form-grid select.cr-invalid,
.form-grid textarea.cr-invalid,
.cr-captcha-input.cr-invalid { box-shadow: 0 0 0 1.5px #ff8a65; }
.cr-file.cr-invalid .cr-file__text { box-shadow: 0 0 0 1.5px #ff8a65; }
