/*
 * ThinkDone Solutions - Careers page (new design).
 * Loaded by careers-v2.php after css/services-v2.css (shared hero, heading animations, FAQ chat,
 * closing CTA) and css/pages-v2.css (story and film strip, shared with About). All rules sit under .tdsk-page.
 */

@keyframes tdsk-roll { from { transform: translateY(0); } to { transform: translateY(-50%); } }
@keyframes tdsk-pulse { 0% { box-shadow: 0 0 0 0 rgba(255, 89, 47, .55); } 70% { box-shadow: 0 0 0 10px rgba(255, 89, 47, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 89, 47, 0); } }

/* ---------- hero: live hiring board ---------- */
.tdsk-page .tdsk-hero__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: center; gap: 48px 64px; min-height: 899px; padding-top: 48px; padding-bottom: 80px; }
.tdsk-page .tdsk-board { justify-self: end; width: min(100%, 500px); padding: 34px 34px 28px; background: rgba(23, 24, 26, .58); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); border: 1px solid rgba(221, 222, 222, .16); border-radius: 12px; }
.tdsk-page .tdsk-board__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.tdsk-page .tdsk-board__live { display: inline-flex; align-items: center; gap: 10px; font-size: 13px; letter-spacing: 1.4px; text-transform: uppercase; color: #FFFFFF; }
.tdsk-page .tdsk-board__live::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--tds-or); animation: tdsk-pulse 2s ease-out infinite; }
.tdsk-page .tdsk-board__modes { font-size: 12px; letter-spacing: 1.2px; text-transform: uppercase; color: var(--tds-peri); }
.tdsk-page .tdsk-board__num { display: flex; align-items: flex-end; gap: 14px; margin: 18px 0 22px; font-family: var(--tds-display); font-size: clamp(96px, 9vw, 150px); line-height: .9; color: #FFFFFF; font-variant-numeric: tabular-nums; }
.tdsk-page .tdsk-board__unit { margin-bottom: .2em; font-family: var(--tds-title); font-weight: 600; font-size: 22px; line-height: 1.1; color: var(--tds-or); }
.tdsk-page .tdsk-board__roll { position: relative; height: 232px; overflow: hidden; border-top: 1px solid rgba(221, 222, 222, .16); -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 14%, #000 82%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0, #000 14%, #000 82%, transparent 100%); }
.tdsk-page .tdsk-board__list { margin: 0; padding: 0; list-style: none; }
.tdsk-page .tdsk-board__roll.is-rolling .tdsk-board__list { animation: tdsk-roll calc(var(--n, 6) * 2.6s) linear infinite; }
.tdsk-page .tdsk-board__roll:hover .tdsk-board__list, .tdsk-page .tdsk-board__roll:focus-within .tdsk-board__list { animation-play-state: paused; }
.tdsk-page .tdsk-board__list a { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 58px; border-bottom: 1px solid rgba(221, 222, 222, .1); color: #FFFFFF; transition: color .2s; }
.tdsk-page .tdsk-board__list a:hover { color: var(--tds-or); }
.tdsk-page .tdsk-board__role { min-width: 0; overflow: hidden; font-family: var(--tds-title); font-weight: 500; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.tdsk-page .tdsk-board__tag { flex: 0 0 auto; padding: 4px 11px; border: 1px solid rgba(221, 222, 222, .24); border-radius: 999px; font-size: 12px; color: var(--tds-peri); }
.tdsk-page .tdsk-board__depts { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; padding: 0; list-style: none; }
.tdsk-page .tdsk-board__depts li { display: inline-flex; align-items: center; gap: 8px; padding: 6px 8px 6px 13px; border: 1px solid rgba(221, 222, 222, .22); border-radius: 999px; font-size: 13px; color: var(--tds-peri); }
.tdsk-page .tdsk-board__depts b { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 999px; background: rgba(255, 89, 47, .18); font-weight: 600; color: var(--tds-or); }

/* ---------- open roles ---------- */
.tdsk-page .tdsk-roles .tdsv2-head { align-items: flex-end; }
.tdsk-page .tdsk-filter { display: flex; flex-wrap: wrap; gap: 8px; }
.tdsk-page .tdsk-filter[hidden] { display: none; }
.tdsk-page .tdsk-filter__btn { display: inline-flex; align-items: center; gap: 10px; min-height: 46px; padding: 10px 10px 10px 18px; background: #FFFFFF; border: 1px solid var(--tds-line2); border-radius: 999px; color: var(--tds-ink); font-family: var(--tds-title); font-weight: 500; font-size: 15px; line-height: 1.2; cursor: pointer; transition: background-color .25s, border-color .25s, color .25s; }
.tdsk-page .tdsk-filter__btn span { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 26px; padding: 0 7px; border-radius: 999px; background: var(--tds-alt); font-size: 13px; font-weight: 600; transition: background-color .25s, color .25s; }
.tdsk-page .tdsk-filter__btn:hover { border-color: var(--tds-ink); }
.tdsk-page .tdsk-filter__btn[aria-pressed="true"] { background: var(--tds-n950); border-color: var(--tds-n950); color: #FFFFFF; }
.tdsk-page .tdsk-filter__btn[aria-pressed="true"] span { background: var(--tds-or); color: var(--tds-n950); }
.tdsk-page .tdsk-roles__status { margin-bottom: 14px; font-size: 13px; letter-spacing: 1.2px; text-transform: uppercase; color: var(--tds-slate); }

.tdsk-page .tdsk-jobs { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--tds-line2); }
.tdsk-page .tdsk-job { position: relative; isolation: isolate; display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; align-items: center; gap: 12px 32px; padding: 34px 28px; border-bottom: 1px solid var(--tds-line2); transition: opacity .6s, transform .6s; transition-delay: calc(var(--i, 0) * .07s); }
.tdsk-page .tdsk-job::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, var(--tds-tint) 0%, rgba(255, 240, 237, 0) 100%); transform: scaleX(0); transform-origin: left; transition: transform .6s cubic-bezier(.65, 0, .2, 1); }
.tdsk-page .tdsk-job::after { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--tds-or); transform: scaleY(0); transition: transform .4s cubic-bezier(.65, 0, .2, 1); }
.tdsk-page .tdsk-job:hover::before, .tdsk-page .tdsk-job:focus-within::before { transform: scaleX(1); }
.tdsk-page .tdsk-job:hover::after, .tdsk-page .tdsk-job:focus-within::after { transform: scaleY(1); }
.tdsk-page .tdsk-job[hidden] { display: none; }
.tdsk-page .tdsk-job__num { font-family: var(--tds-display); font-size: 40px; line-height: 1; color: var(--tds-line2); transition: color .3s; }
.tdsk-page .tdsk-job:hover .tdsk-job__num { color: var(--tds-or); }
.tdsk-page .tdsk-job__main { min-width: 0; }
.tdsk-page .tdsk-job__title { font-family: var(--tds-title); font-weight: 600; font-size: clamp(22px, 1.9vw, 30px); line-height: 1.2; color: var(--tds-ink); transition: transform .4s cubic-bezier(.2, .8, .2, 1); }
.tdsk-page .tdsk-job:hover .tdsk-job__title { transform: translateX(6px); }
.tdsk-page .tdsk-job__link { color: inherit; }
.tdsk-page .tdsk-job__link::after { content: ''; position: absolute; inset: 0; z-index: 1; }
.tdsk-page .tdsk-job__link:focus-visible { outline: none; }
.tdsk-page .tdsk-job:has(.tdsk-job__link:focus-visible) { outline: 2px solid var(--tds-or); outline-offset: -2px; }
.tdsk-page .tdsk-job__tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 0; padding: 0; list-style: none; }
.tdsk-page .tdsk-tag { padding: 4px 11px; border: 1px solid var(--tds-line2); border-radius: 999px; font-size: 12px; line-height: 1.4; color: var(--tds-slate); background: #FFFFFF; }
.tdsk-page .tdsk-tag--dept { border-color: transparent; background: var(--tds-tint); color: var(--tds-tag); letter-spacing: .6px; text-transform: uppercase; }
.tdsk-page .tdsk-job__desc { display: flex; flex-wrap: wrap; gap: 4px 0; max-width: 900px; margin-top: 12px; font-size: 15px; line-height: 1.6; color: var(--tds-slate); }
.tdsk-page .tdsk-job__desc span + span::before { content: ''; display: inline-block; width: 4px; height: 4px; margin: 0 12px; border-radius: 50%; background: var(--tds-or); vertical-align: middle; }
.tdsk-page .tdsk-job__actions { position: relative; z-index: 2; display: flex; align-items: center; gap: 14px; }
.tdsk-page .tdsk-job__apply { display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 11px 22px; background: var(--tds-or); border-radius: 999px; color: var(--tds-n950); font-family: var(--tds-title); font-weight: 600; font-size: 15px; white-space: nowrap; transition: filter .2s, transform .3s cubic-bezier(.2, .8, .2, 1); }
.tdsk-page .tdsk-job__apply:hover { filter: brightness(1.08); color: var(--tds-n950); transform: translateY(-2px); }
.tdsk-page .tdsk-job__go { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border: 1px solid var(--tds-line2); border-radius: 50%; color: var(--tds-ink); pointer-events: none; transition: background-color .3s, border-color .3s, color .3s, transform .3s; }
.tdsk-page .tdsk-job:hover .tdsk-job__go { background: var(--tds-n950); border-color: var(--tds-n950); color: #FFFFFF; transform: rotate(-45deg); }
.tdsk-page.tdss-ready .tdsk-jobs:not(.is-in) .tdsk-job { opacity: 0; transform: translateY(24px); }
.tdsk-page .tdsk-job.is-hiding { opacity: 0; transform: translateY(10px); transition-delay: 0s; }
.tdsk-page .tdsk-empty { padding: 56px 40px; border: 1px dashed var(--tds-line2); border-radius: 12px; text-align: center; }
.tdsk-page .tdsk-empty .tdsv2-text { margin-top: 8px; }

/* ---------- perks: spotlight grid ---------- */
.tdsk-page .tdsk-perks__aside { max-width: 360px; font-size: 16px; line-height: 1.6; color: var(--tds-peri); }
.tdsk-page .tdsk-perks__aside b { font-family: var(--tds-display); font-weight: 400; font-size: 34px; line-height: 1; color: var(--tds-or); }
.tdsk-page .tdsk-perks__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.tdsk-page .tdsk-perk { --mx: -400px; --my: -400px; position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: space-between; gap: 34px; min-height: 196px; padding: 26px; overflow: hidden; background: rgba(23, 24, 26, .45); border-radius: 12px; transition: opacity .6s, transform .6s, background-color .3s; transition-delay: calc(var(--i, 0) * .04s), calc(var(--i, 0) * .04s), 0s; }
/* border that lights up near the pointer */
.tdsk-page .tdsk-perk::before { content: ''; position: absolute; inset: 0; z-index: -1; padding: 1px; border-radius: 12px; background: radial-gradient(260px circle at var(--mx) var(--my), rgba(255, 89, 47, .9), rgba(255, 89, 47, 0) 60%), rgba(221, 222, 222, .14); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); pointer-events: none; }
/* soft fill under the pointer */
.tdsk-page .tdsk-perk::after { content: ''; position: absolute; inset: 0; z-index: -2; background: radial-gradient(320px circle at var(--mx) var(--my), rgba(255, 89, 47, .12), rgba(255, 89, 47, 0) 60%); pointer-events: none; }
.tdsk-page .tdsk-perk__icon { display: inline-flex; align-items: center; justify-content: center; width: 54px; height: 54px; border-radius: 50%; background: rgba(255, 89, 47, .14); color: var(--tds-or); transition: background-color .3s, color .3s, transform .5s cubic-bezier(.2, .8, .2, 1); }
.tdsk-page .tdsk-perk:hover .tdsk-perk__icon { background: var(--tds-or); color: var(--tds-n950); transform: rotate(-8deg) scale(1.06); }
.tdsk-page .tdsk-perk__num { position: absolute; top: 24px; right: 24px; font-size: 13px; letter-spacing: 1.2px; color: rgba(221, 222, 222, .5); }
.tdsk-page .tdsk-perk__title { font-family: var(--tds-title); font-weight: 600; font-size: 19px; line-height: 1.3; color: #FFFFFF; }
.tdsk-page.tdss-ready .tdsk-perks__grid:not(.is-in) .tdsk-perk { opacity: 0; transform: translateY(24px) scale(.98); }

/* ---------- why ThinkDone (story component from pages-v2.css) ---------- */
.tdsk-page .tdsk-story .tdsp-story__p { font-size: clamp(19px, 1.45vw, 24px); }
.tdsk-page .tdsk-story__photo { margin: 36px 0 0; overflow: hidden; aspect-ratio: 3 / 2; max-width: 560px; background: var(--tds-alt); border-radius: 12px; clip-path: inset(0 0 0 0 round 12px); transition: clip-path 1.2s cubic-bezier(.65, 0, .2, 1); }
.tdsk-page .tdsk-story__photo img { display: block; width: 100%; height: 100%; object-fit: cover; transition: scale 1.4s cubic-bezier(.2, .8, .2, 1); }
.tdsk-page.tdss-ready .tdsk-story__media:not(.is-in) .tdsk-story__photo { clip-path: inset(0 0 100% 0 round 12px); }
.tdsk-page.tdss-ready .tdsk-story__media:not(.is-in) .tdsk-story__photo img { scale: 1.15; }

/* ---------- how hiring works: a line that fills with the scroll ---------- */
.tdsk-page .tdsk-steps__track { --p: 0; position: relative; display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 32px; margin: 0; padding: 0; list-style: none; }
.tdsk-page .tdsk-steps__track::before, .tdsk-page .tdsk-steps__track::after { content: ''; position: absolute; left: 30px; right: calc(100% / var(--n, 4) - 30px); top: 30px; height: 2px; background: var(--tds-line2); }
.tdsk-page .tdsk-steps__track::after { background: var(--tds-or); transform: scaleX(var(--p)); transform-origin: left; transition: transform .2s linear; }
.tdsk-page .tdsk-step { position: relative; z-index: 1; }
.tdsk-page .tdsk-step__dot { display: inline-flex; align-items: center; justify-content: center; width: 62px; height: 62px; border: 2px solid var(--tds-line2); border-radius: 50%; background: var(--tds-alt); font-family: var(--tds-display); font-size: 26px; color: var(--tds-slate); transition: background-color .4s, border-color .4s, color .4s, transform .4s cubic-bezier(.2, .8, .2, 1); }
.tdsk-page .tdsk-step.is-on .tdsk-step__dot { background: var(--tds-or); border-color: var(--tds-or); color: var(--tds-n950); transform: scale(1.06); }
.tdsk-page .tdsk-step__title { margin-top: 28px; font-family: var(--tds-title); font-weight: 600; font-size: clamp(21px, 1.6vw, 26px); line-height: 1.25; color: var(--tds-ink); }
.tdsk-page .tdsk-step__text { max-width: 360px; margin-top: 12px; font-size: 16px; line-height: 1.7; color: var(--tds-slate); }
.tdsk-page.tdss-ready .tdsk-step:not(.is-on) .tdsk-step__title, .tdsk-page.tdss-ready .tdsk-step:not(.is-on) .tdsk-step__text { opacity: .4; }
.tdsk-page .tdsk-step__title, .tdsk-page .tdsk-step__text { transition: opacity .5s; }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
  .tdsk-page .tdsk-perks__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tdsk-page .tdsk-steps__track { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 56px; }
  .tdsk-page .tdsk-steps__track::before, .tdsk-page .tdsk-steps__track::after { display: none; }
}
@media (max-width: 1024px) {
  .tdsk-page .tdsk-hero__grid { grid-template-columns: minmax(0, 1fr); min-height: 0; padding-top: 56px; }
  .tdsk-page .tdsk-board { justify-self: start; }
  .tdsk-page .tdsk-job { grid-template-columns: 56px minmax(0, 1fr); }
  .tdsk-page .tdsk-job__actions { grid-column: 2; }
}
@media (max-width: 768px) {
  .tdsk-page .tdsk-board { padding: 26px 22px 22px; }
  .tdsk-page .tdsk-board__num { font-size: 92px; }
  .tdsk-page .tdsk-board__roll { height: 174px; }
  .tdsk-page .tdsk-filter { width: 100%; }
  .tdsk-page .tdsk-job { grid-template-columns: minmax(0, 1fr); padding: 26px 4px; }
  .tdsk-page .tdsk-job__num { display: none; }
  .tdsk-page .tdsk-job__actions { grid-column: auto; }
  .tdsk-page .tdsk-job__apply { flex: 1; justify-content: center; }
  .tdsk-page .tdsk-job:hover .tdsk-job__title { transform: none; }
  .tdsk-page .tdsk-job__desc { font-size: 14px; }
  .tdsk-page .tdsk-perks__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .tdsk-page .tdsk-perk { min-height: 160px; gap: 24px; padding: 20px; }
  .tdsk-page .tdsk-perk__icon { width: 46px; height: 46px; }
  .tdsk-page .tdsk-perk__title { font-size: 16px; }
  .tdsk-page .tdsk-perk__num { top: 18px; right: 18px; }
  .tdsk-page .tdsk-steps__track { grid-template-columns: minmax(0, 1fr); row-gap: 0; }
  .tdsk-page .tdsk-step { display: grid; grid-template-columns: 52px minmax(0, 1fr); column-gap: 18px; padding-bottom: 36px; }
  .tdsk-page .tdsk-step::before { content: ''; position: absolute; left: 25px; top: 52px; bottom: 0; width: 2px; background: var(--tds-line2); }
  .tdsk-page .tdsk-step:last-child::before { display: none; }
  .tdsk-page .tdsk-step.is-on::before { background: var(--tds-or); }
  .tdsk-page .tdsk-step__dot { grid-row: span 2; width: 52px; height: 52px; font-size: 22px; }
  .tdsk-page .tdsk-step__title { margin-top: 10px; }
}
@media (max-width: 420px) {
  .tdsk-page .tdsk-perks__grid { grid-template-columns: minmax(0, 1fr); }
  .tdsk-page .tdsk-perk { flex-direction: row; align-items: center; justify-content: flex-start; min-height: 0; gap: 16px; }
  .tdsk-page .tdsk-perk__num { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .tdsk-page .tdsk-board__roll.is-rolling .tdsk-board__list, .tdsk-page .tdsk-board__live::before { animation: none; }
  .tdsk-page .tdsk-job, .tdsk-page .tdsk-job::before, .tdsk-page .tdsk-perk, .tdsk-page .tdsk-story__photo, .tdsk-page .tdsk-steps__track::after { transition: none; }
}