/* ==========================================================================
   Single Job Template
   ========================================================================== */

/* ── Full-page tan background ── */

.job-page {
    background-color: var(--color-tan);
    padding: 0 2rem 5rem;
}

/* ── Centered container ── */

.job-wrap {
    max-width: 820px;
    margin: 0 auto;
}

/* ── Header ── */

.job-header {
    padding: 3.5rem 0 2rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Desktop: title/location/salary on the left, Apply button on the right. */
@media (min-width: 768px) {
    .job-header {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 2rem;
    }
}

.job-header__main {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.job-header__title {
    font-family: 'Work Sans', sans-serif;
    font-size: clamp(1.75rem, 4vw, 2.75rem);
    font-weight: 700;
    color: var(--color-dark_green);
    margin: 0;
    line-height: 1.15;
}

.job-header__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
}

.job-header__apply {
    flex-shrink: 0;
}

.job-header__meta-item {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--color-maroon);
}

/* ── Body ── */

.job-body {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

/* ── Sections ── */

.job-section__heading {
    font-family: 'Work Sans', sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--color-dark_green);
    margin: 0 0 0.75rem;
}

.job-section__content {
    font-size: 1rem;
    line-height: 1.8;
    color: var(--color-copy);
}

.job-section__content p { margin: 0 0 1em; }
.job-section__content p:last-child { margin-bottom: 0; }

.job-section__content ul,
.job-section__content ol {
    padding-left: 1.5rem;
    margin: 0 0 1em;
}

.job-section__content li { margin-bottom: 0.4em; }

/* ── Embed form ── */

/* Smooth jump from the header "Apply Now" button to the form below. */
html {
    scroll-behavior: smooth;
}

.job-embed {
    margin-top: 2.5rem;
    scroll-margin-top: 2rem;   /* breathing room above the form when jumped to */
}

.job-embed__heading {
    font-family: 'Work Sans', sans-serif;
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    color: var(--color-dark_green);
    text-align: center;
    margin: 0 0 1.5rem;
}