.recruit {
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  align-items: stretch;
  gap: clamp(44px, 6vw, 96px);
  min-height: 680px;
  padding-inline: clamp(7%, 11vw, 14%);
  background: #101113;
}

.recruit-image {
  position: relative;
  display: flex;
  min-height: 680px;
  flex-direction: column;
  justify-content: center;
  padding: 70px 0;
  isolation: isolate;
  background: radial-gradient(ellipse at 38% 38%, rgba(255,106,40,.17), transparent 36%), linear-gradient(145deg, #292d30, #17191b 74%);
}

.recruit-image:before {
  position: absolute;
  z-index: -1;
  top: 10%;
  right: -15%;
  width: min(33vw, 470px);
  aspect-ratio: 1;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 50%;
  box-shadow: 0 0 0 34px rgba(255,255,255,.025), 0 0 0 70px rgba(255,255,255,.018);
  content: "";
}

.recruit-image:after {
  position: absolute;
  z-index: -1;
  inset: 0 -1px 0 55%;
  background: linear-gradient(90deg, transparent, #101113);
  content: "";
}

.recruit-image-grid {
  position: absolute;
  z-index: -2;
  inset: 0;
  opacity: .28;
  background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(135deg, #000, transparent 82%);
}

.recruit-image-kicker {
  margin: 0 0 24px;
  color: #c4c0b9;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .12em;
}

.recruit-image-title {
  position: relative;
  margin: 0;
  color: #f5f3ed;
  font-size: clamp(35px, 4vw, 58px);
  font-weight: 700;
  letter-spacing: .035em;
  line-height: 1.5;
}

.recruit-image-title em {
  color: var(--orange);
  font-style: normal;
}

.recruit-image-title:after {
  display: block;
  width: 58px;
  height: 2px;
  margin-top: 25px;
  background: var(--orange);
  content: "";
}

.recruit-image-caption {
  max-width: 350px;
  margin: 22px 0 0;
  color: #aaa9a6;
  font-size: 11px;
  line-height: 1.9;
}

.recruit-content {
  padding: 112px 0 90px;
}

.recruit-content .section-label {
  color: #c4c0b9;
  font-size: 9px;
  letter-spacing: .08em;
}

.recruit-content .section-label i {
  background: #55565a;
}

.recruit-content h2 {
  margin: 57px 0 18px;
  font-size: clamp(37px, 4vw, 55px);
  letter-spacing: .025em;
  line-height: 1.48;
}

.recruit-content h2 em {
  white-space: nowrap;
}

.recruit-content > p.recruit-intro:not(.eyebrow) {
  max-width: 530px;
  margin: 0;
  color: #c4c3c0;
  font-size: 13px;
  line-height: 2.15;
}

.recruit-welcome {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  margin: 30px 0 22px;
}

.recruit-welcome > div {
  display: grid;
  grid-template-columns: 28px 1fr;
  align-items: baseline;
  gap: 7px 9px;
  padding: 13px 0 12px;
  border-top: 1px solid #414245;
}

.recruit-welcome > div > span {
  color: var(--orange);
  font: 600 12px/1 var(--en);
}

.recruit-welcome strong {
  color: #f5f3ed;
  font-size: 12px;
  white-space: nowrap;
}

.recruit-welcome small {
  grid-column: 2;
  color: #aaa9a6;
  font-size: 10px;
  line-height: 1.8;
}

.benefit-note {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: center;
  gap: 10px 14px;
  margin: 0 0 24px;
  padding: 13px 15px;
  border: 1px solid #383a3d;
  background: #17181a;
  color: #c4c3c0;
  font-size: 11px;
  line-height: 1.8;
}

.recruit-content .benefit-note > .recruit-benefit-label {
  padding: 0;
  border: 0;
  color: var(--orange);
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}

.benefit-copy {
  min-width: 0;
  line-break: strict;
  word-break: normal;
}

.recruit-content .button {
  min-width: 270px;
  padding: 17px 20px;
  transition: background-color .3s ease, transform .3s ease;
}

.recruit-content .button:hover {
  transform: translateY(-2px);
  background: #ff8a50;
}

.recruit-note {
  margin-top: 16px;
  font-size: 10px;
  line-height: 1.8;
}

@media (max-width: 1100px) {
  .recruit { gap: 42px; padding-inline: 8%; }
  .recruit-content { padding: 96px 0 75px; }
  .recruit-welcome { gap: 14px; }
}

@media (max-width: 750px) {
  .recruit { display: block; padding: 0 7%; }
  .recruit-image { min-height: 390px; margin: 0 -7%; padding: 72px 9% 50px; }
  .recruit-image:before { top: 7%; right: -10%; width: 280px; }
  .recruit-image:after { inset: 38% 0 0; background: linear-gradient(0deg, #101113, transparent); }
  .recruit-image-kicker { margin-bottom: 14px; font-size: 11px; }
  .recruit-image-title { font-size: clamp(33px, 8vw, 47px); }
  .recruit-image-title:after { margin-top: 15px; }
  .recruit-image-caption { margin-top: 13px; font-size: 10px; }
  .recruit-content { padding: 43px 0 68px; }
  .recruit-content h2 { margin: 38px 0 13px; font-size: clamp(34px, 8vw, 43px); }
}

@media (max-width: 430px) {
  .recruit-welcome { grid-template-columns: 1fr; gap: 5px; margin-top: 22px; }
  .recruit-welcome > div { padding: 10px 0; }
  .benefit-note { gap: 8px 10px; padding: 12px; font-size: 10px; }
  .recruit-content .button { min-width: min(270px, 100%); }
  .recruit-content h2 { font-size: clamp(30px, 8vw, 34px); }
}

@media (prefers-reduced-motion: reduce) {
  .recruit-content .button { transition: none; }
}
