/* ============================================================
   Lemariku — Careers page (careers.html)   · loads after base.css
   Unique: split layout (content + headquarters photo)
   (the photo hero comes from base.css — .phero / .phero--left)
   ============================================================ */

.jobsplit { display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; }
.jobsplit__body {
  display: flex; flex-direction: column;
  padding-block: clamp(48px, 7vw, 104px);
  padding-right: clamp(28px, 5vw, 64px);
  padding-left: max(var(--gutter), calc((100vw - var(--wrap)) / 2));
}
.jobsplit__title { font-family: var(--display); font-weight: 700; font-size: clamp(2.2rem, 4.6vw, 3.4rem); line-height: 1.05; letter-spacing: -0.02em; max-width: 12ch; }
.jobsplit__body .btn { align-self: flex-start; margin-top: clamp(26px, 3vw, 40px); }
.jobsplit__hq { margin-top: auto; padding-top: clamp(44px, 7vw, 96px); }
.jobsplit__hq-title { font-family: var(--display); font-weight: 700; font-size: clamp(1.3rem, 2.4vw, 1.7rem); color: var(--teal); margin-bottom: 16px; }
.jobsplit__addr { font-size: 16px; line-height: 1.7; color: var(--ink); }
.jobsplit__addr + .jobsplit__addr { margin-top: 16px; }
.jobsplit__media { position: relative; background: #E7E1DA; min-height: 520px; }
.jobsplit__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 900px) {
  .jobsplit { grid-template-columns: 1fr; }
  .jobsplit__body { padding-inline: var(--gutter); }
  .jobsplit__media { min-height: 320px; }
}