/**
 * Widget: job-vacancy|list-v02
 * "Le nostre posizioni aperte": titolo a sinistra, elenco card a destra.
 * Variante v02 — STACKING CARDS: le card sono "sticky"; scrollando si fissano in
 * sequenza sovrapponendosi alla prima (deck sfalsato). Il titolo resta sticky a lato.
 * Ultima card scura (candidatura spontanea) hard-coded.
 */

.job-vacancy-list-v02 {
    display: block;
    background-color: var(--website-color-light, #FFFAF0);
    padding: clamp(56px, 9vw, 112px) 0;
    /* Stacking: punto in cui si fissa la prima card e sfalsamento tra le card impilate */
    --stack-top: clamp(100px, 13vh, 150px);
    --stack-step: 18px;
}
.job-vacancy-list-v02 .job-vacancy-list-v02-inner {
    max-width: var(--website-container-max-width, 1440px);
    margin: 0 auto;
    padding: 0 28px;
    display: grid;
    grid-template-columns: minmax(0, 360px) minmax(0, 1fr);
    gap: clamp(40px, 6vw, 80px);
    align-items: start;
}
.job-vacancy-list-v02 .job-vacancy-list-v02-head {
    align-self: start;
    position: sticky;            /* il titolo resta fermo mentre le card si impilano */
    top: var(--stack-top);
}
.job-vacancy-list-v02 .job-vacancy-list-v02-title {
    margin: 0;
    color: var(--website-color-txt-title, #3D3D3D);
    text-transform: uppercase;
    font-weight: 400;
    font-size: clamp(2rem, 4.5vw, 3.4rem);
    line-height: 1.1;
}

.job-vacancy-list-v02 .job-vacancy-list-v02-items {
    display: block;             /* flusso normale: ogni card pinna in sequenza (sticky) */
    min-width: 0;
}

/* Card — sticky: si fissa a top crescente per indice → si impila sovrapponendosi alla prima */
.job-vacancy-list-v02 .job-vacancy-list-v02-card {
    position: sticky;
    top: calc(var(--stack-top) + var(--card-index, 0) * var(--stack-step));
    z-index: calc(var(--card-index, 0) + 1);
    margin-bottom: 24px;
    display: flex;
    flex-direction: column;
    gap: clamp(40px, 5vw, 56px);
    padding: 24px;
    background-color: var(--website-color-light, #FFFAF0);
    border: 1px solid rgba(45, 45, 45, 0.38);
    border-radius: 10px;
    box-shadow: 0 -6px 22px rgba(45, 45, 45, 0.07); /* stacca la card da quella dietro/sopra */
    transition: background-color 0.4s ease-in-out;
}
.job-vacancy-list-v02 .job-vacancy-list-v02-card:last-child { margin-bottom: 0; }

.job-vacancy-list-v02 .job-vacancy-list-v02-card:not(.job-vacancy-list-v02-card--cta):hover{
    background-color: var(--website-third);
    transition: 0.5s all ease-in-out;
}

.job-vacancy-list-v02 .job-vacancy-list-v02-icon {
    flex: none;
    width: 56px;
    height: 56px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(45, 45, 45, 0.38);
    border-radius: 50%;
    color: var(--website-color-txt-title, #3D3D3D);
}
.job-vacancy-list-v02 .job-vacancy-list-v02-icon-img { width: 26px; height: 26px; object-fit: contain; display: block; }

.job-vacancy-list-v02 .job-vacancy-list-v02-body { display: flex; flex-direction: column; gap: 20px; }
.job-vacancy-list-v02 .job-vacancy-list-v02-headrow { display: flex; flex-direction: column; gap: 12px; }

.job-vacancy-list-v02 .job-vacancy-list-v02-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
}
.job-vacancy-list-v02 .job-vacancy-list-v02-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--website-color-txt-body, #4D5359);
    font-size: 0.875rem;
    line-height: 1.3;
}
.job-vacancy-list-v02 .job-vacancy-list-v02-meta-icon { flex: none; }

.job-vacancy-list-v02 .job-vacancy-list-v02-card-title {
    margin: 0;
    color: var(--website-color-txt-title, #3D3D3D);
    text-transform: uppercase;
    font-weight: 400;
    font-size: 1.65rem;
    line-height: 1.15;
}
.job-vacancy-list-v02 .job-vacancy-list-v02-text {
    color: var(--website-color-txt-body, #4D5359);
    font-size: 1rem;
    line-height: 1.55;
}
.job-vacancy-list-v02 .job-vacancy-list-v02-text p { margin: 0 0 0.6rem; }
.job-vacancy-list-v02 .job-vacancy-list-v02-text p:last-child { margin-bottom: 0; }

.job-vacancy-list-v02 .job-vacancy-list-v02-cta { align-self: flex-start; }

/* Ultima card scura (candidatura spontanea) */
.job-vacancy-list-v02 .job-vacancy-list-v02-card--cta {
    background-color: var(--website-color-dark, #4E4B4A);
}
.job-vacancy-list-v02 .job-vacancy-list-v02-card--cta .job-vacancy-list-v02-icon {
    border-color: rgba(255, 255, 255, 0.4);
    color: var(--website-color-white, #fff);
}
.job-vacancy-list-v02 .job-vacancy-list-v02-card--cta .job-vacancy-list-v02-card-title { color: var(--website-color-white, #fff); }
.job-vacancy-list-v02 .job-vacancy-list-v02-card--cta .job-vacancy-list-v02-text { color: rgba(255, 255, 255, 0.8); }

/* Mobile: una colonna (titolo sopra, poi le card che si impilano scrollando) */
@media (max-width: 991.98px) {
    .job-vacancy-list-v02 .job-vacancy-list-v02-inner{ grid-template-columns: 1fr; gap: clamp(28px, 5vw, 40px); }
    /* il titolo scorre via (è sopra le card, non a lato) */
    .job-vacancy-list-v02 .job-vacancy-list-v02-head{ position: static; }
}