/* ============================================================
   site-v31.css — Jobs hero with right-side image (v1.6.7)
   ============================================================ */

.jobs-hero { background: #ffffff !important; }
.jobs-hero-grid {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: clamp(16px, 2vw, 28px);
  align-items: center;
}
.jobs-hero-text { text-align: left; }
.jobs-hero-text h1 { margin: 12px 0 14px !important; }
.jobs-hero-text .eyebrow { color: #4F8EDC !important; }
.jobs-hero-text .lede { color: #6B7280 !important; opacity: 1 !important; margin-bottom: 0 !important; }

.jobs-hero-image {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.jobs-hero-image img {
  width: 100% !important;
  max-width: 600px !important;
  height: auto !important;
  display: block !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 24px -10px rgba(20,33,61,0.18),
              0 4px 8px rgba(20,33,61,0.06) !important;
  transition: transform .4s cubic-bezier(.2,.7,.2,1) !important;
}
.jobs-hero-image:hover img { transform: translateY(-3px) scale(1.01) !important; }

@media (max-width: 880px) {
  .jobs-hero-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .jobs-hero-image { justify-content: center; }
  .jobs-hero-image img { max-width: 520px !important; }
}