/* Review-only variant: formal join.html remains unchanged. */
html body .join-banner .shv1__h{letter-spacing:0!important}
html body .why-carousel{--why-visible:3;--why-gap:var(--wy-col-gap);margin-top:var(--wy-gap-head)}
html body .why-carousel__stage{position:relative}
html body .why-carousel__viewport{overflow:hidden;touch-action:pan-y}
html body .why-carousel__track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - (var(--why-visible) - 1)*var(--why-gap))/var(--why-visible));gap:var(--why-gap);align-items:start;transition:transform var(--wy-dur) var(--wy-ease)}
html body .why-card{min-width:0}
html body .why-card__image{aspect-ratio:16/9;overflow:hidden;border-radius:var(--wy-r-2xl);background:var(--wy-g25)}
html body .why-card__image img{display:block;width:100%;height:100%;object-fit:cover}
html body .why-card .h3{margin:var(--wy-s7) 0 var(--wy-s4)}
html body .why-card .body{margin:0;color:var(--wy-g700)}
html body .why-carousel__track{transition:transform .62s var(--wy-ease)}
/* Match WHY's 16:9 frame; the controller shares its measured column count. */
html body .join-life-gallery{--why-visible:4;margin-top:var(--wy-s9)}
html body .life-gallery__photo{margin:0;aspect-ratio:16/9;overflow:hidden;border-radius:var(--wy-r-2xl);background:var(--wy-g25)}
html body .life-gallery__photo img{display:block;width:100%;height:100%;object-fit:cover}
/* Center the 232px rail on the photos; retain joined 44px buttons at the right. */
html body .join-life-controls{display:grid;grid-template-columns:minmax(88px,1fr) minmax(0,232px) minmax(88px,1fr);column-gap:var(--wy-s3)!important;align-items:center;margin-top:var(--wy-s6)}
html body .join-life-controls .wyprog{position:relative;grid-column:2;width:100%;margin:0;border-radius:2px;background:var(--wy-g200);overflow:hidden}
html body .join-life-arrows{grid-column:3;justify-self:end;display:flex;align-items:center}
html body .join-life-controls .wyprog i{position:absolute;inset-block:0;left:calc((100% - var(--pw,100%)) * var(--pp,0));width:var(--pw,100%);border-radius:2px;background:var(--wy-ink);transition:left .62s var(--wy-ease),width .62s var(--wy-ease)}
html body .join-life-controls button:first-of-type{border-radius:12px 0 0 12px!important}
html body .join-life-controls button:focus-visible{outline:2px solid var(--wy-primary);outline-offset:var(--wy-s1);z-index:1}
html body .join-life-controls .wyprog,html body #band-people .voices__dots button{height:2px}
html body #band-people .voices__dots button::before{top:50%;bottom:auto;height:var(--wy-s5);transform:translateY(-50%)}
/* One visible person at a time; the controller exits before the next entrance. */
html body #band-people .voices{overflow:hidden}
html body #band-people .voice{opacity:0;visibility:hidden;transform:none;transition:none}
html body #band-people .voice.is-cur{opacity:1;visibility:visible;transform:none;transition:none}
@media(max-width:1199px){html body .why-carousel{--why-visible:2}}
@media(max-width:767px){
 html body .why-carousel{--why-visible:1}
 html body .why-card .h3{margin-top:var(--wy-s6)}
 html body .join-life-gallery{margin-top:var(--wy-s8)}
}
@media(prefers-reduced-motion:reduce){
 html body .why-carousel__track{transition:none}
 html body .join-life-controls .wyprog i{transition:none}
 html body #band-people .voice,html body #band-people .voice.is-cur{transform:none!important;transition:none}
}

/* WHY is a static four-column composition; every reason remains visible. */
html body .why-cards{--why-gap:var(--wy-col-gap);width:100%;min-width:0;margin-top:var(--wy-gap-head)}
html body .why-cards .why-carousel__viewport{overflow:visible;touch-action:auto}
html body .why-cards .why-carousel__track{display:grid;width:100%;min-width:0;grid-auto-flow:row;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-columns:auto;column-gap:var(--wy-col-gap);transform:none!important;transition:none}
html body .why-cards .why-card,html body .why-cards .why-card__image,html body .why-cards .why-card :is(.h3,.body){width:100%;max-width:100%;min-width:0;box-sizing:border-box}
/* One full-row link replaces the expandable vacancy. */
html body .jobs2__list .job-link{display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:center;column-gap:var(--wy-s6);padding:var(--wy-s6) 0;text-decoration:none;color:inherit}
html body .jobs2__list .job-link:first-child{padding-top:0}
html body .job-link__copy{display:block;min-width:0}
html body .job-link .job__ic{display:grid;place-items:center;color:var(--wy-ink)}
html body .job-link .job__ic::before,html body .job-link .job__ic::after{content:none}
html body .job-link:focus-visible{outline:2px solid var(--wy-primary);outline-offset:var(--wy-s1)}
@media(hover:hover){
 html body .job-link:hover .job__t{color:var(--wy-primary)}
 html body .job-link:hover .job__ic{background:var(--wy-g100);color:var(--wy-primary)}
}
@media(max-width:1199px){html body .why-cards .why-carousel__track{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:var(--wy-s8)}}
@media(max-width:767px){
 html body .why-cards .why-carousel__track{grid-template-columns:minmax(0,1fr);row-gap:var(--wy-s7)}
 html body .jobs2__list .job-link{column-gap:var(--wy-s4)}
}
@media(prefers-reduced-motion:reduce){html body .job-link .job__ic svg{transform:none!important;transition:none}}

/* Three metadata keywords, matching the supplied single-line reference. */
html body .job-link .job__m{display:flex;align-items:center;flex-wrap:wrap;gap:var(--wy-s3)}
html body .job-link .job__m > span{white-space:nowrap}
html body .job-link .job__m > span + span::before{content:"·";margin-right:var(--wy-s3);color:inherit}
/* Center the actual chevron (x=1..5) inside its 14px SVG, not just the SVG box. */
html body .job-link .job__ic .wy-harr .t{transform:translateX(4px)}
html body .job-link:hover .job__ic .wy-harr .t{transform:translateX(6px)}
