/* ==========================================================================
   Vacancy detail — page-specific styles
   ========================================================================== */

/* ---- Body ---- */
.vacancy__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 80px;
  padding: 120px 0;
  width: 100%;
}

/* ---- Hero ---- */
.vacancy-hero {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  padding: 0 var(--page-padding-x);
  width: 100%;
}

.vacancy-hero__title {
  font-family: var(--font-primary);
  font-weight: var(--fw-medium);
  font-size: 6rem; /* 96px */
  line-height: 1.05;
  letter-spacing: -2.88px;
  color: var(--green-1200);
  max-width: 1178px;
}

.vacancy-hero__subtitle {
  font-family: var(--font-primary);
  font-weight: var(--fw-regular);
  font-size: 2.375rem; /* 38px */
  line-height: 1.2;
  letter-spacing: -0.76px;
  color: var(--green-1200);
  max-width: 1178px;
}

/* ---- Photos ---- */
.vacancy-photos {
  display: flex;
  gap: 10px;
  width: 100%;
  padding: 0 var(--page-padding-x);
}

.vacancy-photos__item {
  flex: 679 0 0; /* proportional grow, fills available space */
  height: 759px;
  border-radius: var(--radius-card);
  overflow: hidden;
}

.vacancy-photos__item--wide {
  flex: 718 0 0;
}

.vacancy-photos__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Bottom photos: 4 photos, fixed widths that overflow right */
.vacancy-photos--bottom .vacancy-photos__item {
  flex: 0 0 477px;
  height: 533px;
}

.vacancy-photos--bottom .vacancy-photos__item--first {
  flex: 0 0 504px;
}

/* ---- Text sections (Wat je gaat doen, Wat bij je past, Interesse?) ---- */
.vacancy-text-section {
  display: flex;
  gap: 21px;
  align-items: flex-start;
  width: 1180px;
  max-width: 100%;
}

.vacancy-text-section__label {
  width: 337px;
  flex-shrink: 0;
}

.vacancy-text-section__content {
  display: flex;
  flex-direction: column;
  gap: 0;
  align-items: flex-start;
  flex: 1 1 0;
  min-width: 0;
  max-width: 938px;
  padding-right: 120px;
}

.vacancy-text-section__text {
  font-family: var(--font-primary);
  font-weight: var(--fw-regular);
  font-size: 1.875rem; /* 30px */
  line-height: 1.25;
  letter-spacing: -0.45px;
  color: var(--green-1200);
}

/* Spacing between paragraphs in Interesse? section */
.vacancy-text-section__text + .vacancy-text-section__text {
  margin-top: 1.25em;
}

/* ---- Bullet list ---- */
.vacancy-list {
  font-family: var(--font-primary);
  font-weight: var(--fw-regular);
  font-size: 1.875rem; /* 30px */
  line-height: 1.25;
  letter-spacing: -0.45px;
  color: var(--green-1200);
  list-style: disc;
  padding-left: 45px;
  margin-bottom: 1.25em;
}

.vacancy-list li {
  padding-left: 0;
}

/* ---- Links ---- */
.vacancy-link {
  text-decoration: underline;
}