/* Vacancies (vacancies.html). */

.job { padding: 22px 0; border-top: 1px solid var(--line); display: grid; gap: 10px; justify-items: start; }
.job:first-child { border-top: 0; padding-top: 0; }
.job h3 { font-size: 1.4rem; }
.job h4 { font-size: 1rem; margin: 6px 0 0; }
.job p { margin: 0; text-align: left; }
.job ul { margin: 0; padding-left: 1.2rem; list-style: disc; display: grid; gap: 4px; }
.job-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.tag { padding: .2rem .7rem; border: 2px solid var(--ink); border-radius: 8px; font-weight: 700; font-size: .85rem; line-height: 1.2; }
.job-empty { padding: 22px; border: 2px dashed var(--ink); border-radius: var(--r-md); display: grid; gap: 10px; justify-items: start; }
.job-empty p { margin: 0; text-align: left; }
.apply { margin-top: 36px; padding-top: 28px; border-top: 2px solid var(--ink); }
.apply .done { display: grid; gap: 12px; }

/* display:grid above would beat the hidden attribute, so say it again */
#apply-form[hidden], .apply .done[hidden], .job-empty[hidden] { display: none; }