/**
 * Vacancy detail — custom template.
 *
 * Values 1-on-1 from Elementor single 10680 (post-10680.css, incl. its custom CSS).
 * Gutter: 30px, 15px from tablet (≤1024) down.
 */

.r4y-template--vacancy_single { --r4y-gutter: 30px; }

/* ── Hero (#bafccd4 / #945cac1 / #361aa23 / #827f082) ───────────────── */
.r4y-template .r4y-vacancy__hero {
    margin-top: var(--r4y-space-2xl);
    padding-inline: var(--r4y-gutter);
    background-color: var(--r4y-color-surface);
}
.r4y-template .r4y-vacancy__hero-inner {
    position: relative;
    display: flex;
    min-height: 70vh;
}
.r4y-template .r4y-vacancy__hero-media {
    position: relative;
    display: flex;
    flex: 1 1 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* Closed overlay (#d0acacf): primary @ 52% with lock icon + label */
.r4y-template .r4y-vacancy__closed {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.r4y-template .r4y-vacancy__closed::before {
    content: "";
    position: absolute;
    inset: 0;
    background-color: var(--r4y-kit-primary);
    opacity: var(--r4y-overlay-opacity);
}
.r4y-template .r4y-vacancy__closed-icon,
.r4y-template .r4y-vacancy__closed-label {
    position: relative;
    display: flex;
    justify-content: center;
}
.r4y-template .r4y-vacancy__closed-icon {
    color: var(--r4y-color-on-dark);
    font-size: 50px; /* Elementor icon default */
    line-height: 1;
}
.r4y-template .r4y-vacancy__closed-icon svg {
    width: 1em;
    height: 1em;
}

/* Title bar (#2ef4f8b) */
.r4y-template .r4y-vacancy__title-bar {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: var(--r4y-space-md) 0 var(--r4y-space-md) var(--r4y-space-lg);
    background-color: var(--r4y-color-overlay-bar);
}
.r4y-template .r4y-vacancy__title {
    margin: 0;
    font-family: var(--r4y-font-ui);
    font-size: var(--r4y-fs-2xl);
    font-weight: var(--r4y-fw-semibold);
    line-height: 1;
    color: var(--r4y-color-on-dark);
}

/* Company logo box (#7f7c194 + custom CSS .bedrijf-image) */
.r4y-template .r4y-vacancy__logo {
    position: absolute;
    right: var(--r4y-space-xl);
    bottom: calc(-1 * var(--r4y-space-lg));
    z-index: 1;
    display: flex;
    width: 250px;
    height: 150px;
    background-color: var(--r4y-color-surface);
    box-shadow: var(--r4y-shadow-raised);
}
.r4y-template .r4y-vacancy__logo-image {
    display: block;
    width: 250px;
    height: 150px;
    object-fit: contain;
}

/* ── Sector badges (#639fe86 / loop 10904) ──────────────────────────── */
.r4y-template .r4y-vacancy__sectors {
    margin-top: var(--r4y-space-md);
}
.r4y-template .r4y-vacancy__sector-grid {
    display: flex;
    flex-wrap: wrap;
    gap: var(--r4y-space-sm);
}

/* ── Facts row (#7240a42) ───────────────────────────────────────────── */
.r4y-template .r4y-vacancy__facts {
    margin-top: var(--r4y-space-sm);
}
.r4y-template .r4y-vacancy__facts-row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 0 var(--r4y-space-lg);
}
.r4y-template .r4y-vacancy__fact {
    display: flex;
    align-items: center;
    gap: var(--r4y-space-sm);
    width: max-content;
}
.r4y-template .r4y-vacancy__fact-icon {
    display: flex;
    padding-top: var(--r4y-space-2xs);
    color: var(--r4y-color-heading);
    font-size: 16px;
    line-height: 1;
}
.r4y-template .r4y-vacancy__fact-icon svg {
    width: auto;
    height: 16px;
    fill: currentColor;
}
.r4y-template .r4y-vacancy__fact-text {
    font-family: var(--r4y-font-body);
    font-size: var(--r4y-fs-base);
    font-weight: var(--r4y-fw-light);
}

/* ── Body columns (#343ffdd) ────────────────────────────────────────── */
.r4y-template .r4y-vacancy__body {
    margin-top: var(--r4y-space-lg);
}
.r4y-template .r4y-vacancy__columns {
    display: flex;
    flex-direction: row;
    gap: 0 var(--r4y-space-xl);
}
.r4y-template .r4y-vacancy__main,
.r4y-template .r4y-vacancy__aside {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

/* Candidate profile (#77ccc4b) */
.r4y-template .r4y-vacancy__profile {
    padding: var(--r4y-space-lg);
    background-color: var(--r4y-color-surface-alt);
}
.r4y-template .r4y-vacancy__profile-title {
    margin: 0 0 var(--r4y-space-md);
    font-family: var(--r4y-font-body);
    font-size: var(--r4y-fs-md);
    font-weight: var(--r4y-fw-bold);
    line-height: 1;
    text-transform: uppercase;
    color: var(--r4y-color-highlight);
}
.r4y-template .r4y-vacancy__profile-text,
.r4y-template .r4y-vacancy__company-long,
.r4y-template .r4y-vacancy__description-text {
    font-family: var(--r4y-font-body);
    font-size: var(--r4y-fs-base);
    font-weight: var(--r4y-fw-light);
    color: var(--r4y-color-text);
}
.r4y-template .r4y-vacancy__profile-cta {
    margin-top: var(--r4y-space-lg);
}

/* Company (#c7973f2 / #5af5eb1 / #3c49b72) */
.r4y-template .r4y-vacancy__company-short {
    margin: var(--r4y-space-xl) 0 var(--r4y-space-lg);
    font-family: var(--r4y-font-body);
    font-size: var(--r4y-fs-base);
    font-weight: var(--r4y-fw-medium);
    text-align: justify;
}
.r4y-template .r4y-vacancy__company-title,
.r4y-template .r4y-vacancy__contact-title,
.r4y-template .r4y-vacancy__description-title {
    margin: 0 0 var(--r4y-space-md);
}
.r4y-template .r4y-vacancy__company-long {
    margin-bottom: var(--r4y-space-lg);
    text-align: justify;
}

/* Quote (#4ede9e6 / #6bf5442) */
.r4y-template .r4y-vacancy__quote {
    margin-top: var(--r4y-space-lg);
    padding: var(--r4y-space-sm) 0;
}
.r4y-template .r4y-vacancy__quote-text {
    padding-left: var(--r4y-space-md);
    border-left: 2px solid var(--r4y-color-heading);
    font-family: var(--r4y-font-heading);
    font-size: var(--r4y-fs-xl);
    font-weight: var(--r4y-fw-light);
    font-style: italic;
    line-height: 24px;
    text-align: justify;
    color: var(--r4y-color-heading);
}

/* Contact (#dc92a56 / loop 10628) */
.r4y-template .r4y-vacancy__contacts {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

/* ── Description (#fcd0d73) ─────────────────────────────────────────── */
.r4y-template .r4y-vacancy__description {
    margin-top: var(--r4y-space-xl);
    padding-block: var(--r4y-space-xl);
}
.r4y-template .r4y-vacancy__description-text {
    text-align: justify;
}

/* ── Application (#53062bb) ─────────────────────────────────────────── */
.r4y-template .r4y-vacancy__apply {
    padding-block: var(--r4y-space-xl);
}
.r4y-template .r4y-vacancy__apply-contact-title {
    margin: 0 0 var(--r4y-space-md);
}
.r4y-template .r4y-vacancy__apply-contact-text,
.r4y-template .r4y-vacancy__apply-text {
    font-family: var(--r4y-font-body);
    font-size: var(--r4y-fs-base);
    font-weight: var(--r4y-fw-light);
    color: var(--r4y-color-text);
}
.r4y-template .r4y-vacancy__apply-contact-text {
    margin-bottom: var(--r4y-space-xl);
}
/* Custom CSS on #6b8a82b */
.r4y-template .r4y-vacancy__apply-contact-text a {
    color: var(--r4y-kit-text);
    font-weight: var(--r4y-fw-medium);
    text-decoration: underline;
}
.r4y-template .r4y-vacancy__apply-title {
    margin: 0 0 var(--r4y-space-sm);
}
.r4y-template .r4y-vacancy__apply-text {
    width: 40%;
    max-width: 40%;
    margin-bottom: var(--r4y-space-lg);
}
/* Application form: the shared modern card (forms/contact-form.css), at a readable width. */
.r4y-template .r4y-vacancy__apply .r4y-apply-form {
    max-width: 760px;
}

/* ── ≥768 column widths ─────────────────────────────────────────────── */
@media (min-width: 768px) {
    .r4y-template .r4y-vacancy__main  { width: 66.6666%; }
    .r4y-template .r4y-vacancy__aside { width: 33.3333%; }
}

/* ── Tablet (≤1024) ─────────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .r4y-template--vacancy_single { --r4y-gutter: 15px; }

    .r4y-template .r4y-vacancy__logo { display: none; }
    .r4y-template .r4y-vacancy__columns { flex-direction: column; }
    .r4y-template .r4y-vacancy__description,
    .r4y-template .r4y-vacancy__apply { padding-block: var(--r4y-space-lg); }
    .r4y-template .r4y-vacancy__apply-text { width: 100%; max-width: 100%; }
}

/* ── Mobile (≤767) ──────────────────────────────────────────────────── */
@media (max-width: 767px) {
    .r4y-template .r4y-vacancy__hero-inner { min-height: 250px; }
    .r4y-template .r4y-vacancy__title-bar  { padding: var(--r4y-space-md); }
    .r4y-template .r4y-vacancy__title      { font-size: var(--r4y-fs-lg); }

    .r4y-template .r4y-vacancy__fact--salary { width: 100%; }

    .r4y-template .r4y-vacancy__profile { padding: var(--r4y-space-lg) var(--r4y-space-md); }

    .r4y-template .r4y-vacancy__company-short { margin: var(--r4y-space-lg) 0; text-align: start; }
    .r4y-template .r4y-vacancy__company-long,
    .r4y-template .r4y-vacancy__quote-text,
    .r4y-template .r4y-vacancy__description-text { text-align: start; }

    .r4y-template .r4y-vacancy__aside { margin-top: var(--r4y-space-xl); }

    .r4y-template .r4y-vacancy__company-title,
    .r4y-template .r4y-vacancy__contact-title,
    .r4y-template .r4y-vacancy__description-title,
    .r4y-template .r4y-vacancy__apply-contact-title,
    .r4y-template .r4y-vacancy__apply-title { font-size: var(--r4y-fs-xl); }
}