/* Preserve the supplied artwork; crop only the outer scenery on small screens. */
.main-career-banner {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #02040c;
  line-height: 0;
}

.main-career-banner-image {
  position: relative;
  left: 50%;
  display: block;
  width: 100%;
  min-width: 960px;
  max-width: none;
  height: auto;
  margin: 0;
  transform: translateX(-50%);
}

.main-career-banner-button {
  position: absolute;
  top: 62.3%;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(190px, 14.35vw, 275px);
  height: clamp(44px, 2.92vw, 56px);
  margin: 0;
  padding: 0 20px;
  transform: translateX(-50%);
  border: 0;
  border-radius: 999px;
  background: #ff0000;
  color: #fff;
  font-family: techupSans, Arial, sans-serif;
  font-size: clamp(20px, 1.46vw, 28px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.035em;
  white-space: nowrap;
  appearance: none;
}
.main-career-banner-button:disabled { opacity: 1; cursor: default; -webkit-text-fill-color: #fff; }
.main-career-banner-button:not(:disabled):hover { background: #d71920; }
.main-career-banner-button:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }

/* Consultation hover: darker red, pointer cursor, and a small lift. */
@media (hover: hover) and (pointer: fine) {
  .main-career-banner .main-career-banner-button:hover { background-color: #d71920; cursor: pointer; }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .main-career-banner-button { transition: translate 180ms ease-out, background-color 180ms ease-out; }
  .main-career-banner-button:hover { translate: 0 -3px; }
}