/* Officials block (of_) – parent repeater: department; child: employee + contact */
.of_wrapper {
  max-width: 820px;
  margin: 0 auto;
  padding: 0px var(--container-padding, 24px) 24px;
}

.of_section {
  margin-bottom: 24px;
}

.of_section:last-child {
  margin-bottom: 0;
}

/* Parent: department name – bold black */
.of_department_name {
  margin: 0 0 1rem;
  color: var(--color-text);
}

/* Child list */
.of_list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Child item – bordered box */
.of_item {
  border: 1px solid #E1E1E1;
  border-radius: 4px;
  padding: 16px 24px;
  background: var(--color-bg);
}

/* Employee name – red (primary) */
.of_employee_name {
  margin: 0 0 0.5rem;
  color: var(--color-primary);
}

.of_employee_name p {
  margin: 0 0 0.25em;
}

.of_employee_name p:last-child {
  margin-bottom: 0;
}

/* Contact line – black text, labels + values */
.of_contact_line {
  margin: 0;
  color: var(--color-text);
}

.of_contact_label {
  font-weight: 500;
}

.of_contact_value {
  color: var(--color-text);
  text-decoration: none;
}

.of_contact_email {
  text-decoration: underline;
}

.of_contact_email:hover {
  color: var(--color-primary);
}

.of_contact_sep {
  margin: 0 0.5em;
  color: var(--color-text);
  opacity: 0.7;
}

@media (max-width: 768px) {
  .of_wrapper {
    padding: 0px var(--container-padding) 48px;
  }

  .of_section {
    margin-bottom: 24px;
  }

  .of_item {
    padding: 16px;
  }
}