.recruitment {
  --market-ink: #18352a;
  --market-green: #173b2e;
  --market-gold: #ffcf66;
  --market-paper: #f6efdf;
  color: var(--market-ink);
  max-width: 1320px;
  margin: 0 auto;
  padding: 1.25rem 0 3rem;
}

.recruitment-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--market-green);
  color: #fffdf6;
  border-radius: 1.25rem;
  overflow: hidden;
}

.recruitment-hero__copy {
  padding: clamp(1.5rem, 4.5vw, 4.5rem);
  align-self: center;
}

.recruitment-label {
  font-size: .8rem;
  font-weight: 750;
  letter-spacing: .14em;
  text-transform: uppercase;
  margin-bottom: .65rem;
}

.recruitment-hero .recruitment-label { color: var(--market-gold); }

.recruitment h1,
.recruitment h2,
.recruitment h3 {
  font-family: Georgia, serif;
  font-weight: 700;
  line-height: 1.08;
}

.recruitment h1 { font-size: clamp(2.65rem, 6vw, 5.7rem); }
.recruitment h2 { font-size: clamp(2rem, 3.6vw, 3.4rem); }
.recruitment h3 { font-size: 1.6rem; }
.recruitment-lead { font-size: clamp(1.15rem, 1.8vw, 1.5rem); }

.recruitment-hero__image,
.recruitment-franchise img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.recruitment-button {
  background: var(--market-gold);
  border-color: var(--market-gold);
  color: #1e2c22;
  font-weight: 700;
}

.recruitment-button:hover,
.recruitment-button:focus-visible {
  background: #ffdf91;
  border-color: #a96800;
  color: #1e2c22;
}

.recruitment-section { margin-top: clamp(2rem, 5vw, 4.5rem); }
.recruitment-section[id] { scroll-margin-top: 2rem; }

.recruitment-roles {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1.4rem;
}

.recruitment-roles article,
.recruitment-vacancies,
.recruitment-franchise {
  background: var(--market-paper);
  border-radius: 1rem;
  overflow: hidden;
}

.recruitment-roles article > div,
.recruitment-vacancies,
.recruitment-franchise > div { padding: clamp(1.25rem, 3vw, 2.5rem); }

.recruitment-roles img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.recruitment-section a:not(.btn),
.recruitment-trade a { color: #245439; font-weight: 650; }

.recruitment-franchise {
  display: grid;
  grid-template-columns: 2fr 3fr;
  background: #e3eee2;
}

.recruitment-trade { margin: 1.5rem 0 0; }

@media (max-width: 900px) {
  .recruitment-hero { grid-template-columns: 1fr; }
  .recruitment-hero__image { height: clamp(220px, 55vw, 450px); }
}

@media (max-width: 720px) {
  .recruitment-roles, .recruitment-franchise { grid-template-columns: 1fr; }
  .recruitment-franchise img { height: auto; aspect-ratio: 16 / 9; }
}