/*
 * ThinkDone Solutions - single job page (new design).
 * Loaded by career-detail-v2.php after css/services-v2.css, css/pages-v2.css and css/careers-v2.css
 * (job rows, perks grid). All rules sit under .tdsj-page.
 */

@keyframes tdsj-row { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* ---------- hero ---------- */
.tdsj-page .tdsj-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; }
.tdsj-page .tdsj-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-bottom: 26px; font-size: 14px; letter-spacing: 1.2px; text-transform: uppercase; color: var(--tds-peri); }
.tdsj-page .tdsj-crumbs a { color: var(--tds-peri); border-bottom: 1px solid transparent; transition: color .2s, border-color .2s; }
.tdsj-page .tdsj-crumbs a:hover { color: #FFFFFF; border-color: var(--tds-or); }
.tdsj-page .tdsj-crumbs span[aria-hidden] { color: var(--tds-or); }
.tdsj-page .tdsj-crumbs [aria-current] { color: #FFFFFF; }
.tdsj-page .tdss-hero .tdsj-hero__h { font-size: clamp(46px, 5.4vw, 92px); }
.tdsj-page .tdsj-hero__h .tdss-line > span { display: inline; }
.tdsj-page .tdsj-hero__tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 26px 0 0; padding: 0; list-style: none; }
.tdsj-page .tdsj-hero__tags li { display: inline-flex; align-items: center; gap: 8px; padding: 7px 15px; border: 1px solid rgba(221, 222, 222, .28); border-radius: 999px; font-size: 14px; color: #FFFFFF; }
.tdsj-page .tdsj-hero__tags li::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--tds-or); }

.tdsj-page .tdsj-glance { justify-self: end; width: min(100%, 480px); padding: 34px; 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; }
.tdsj-page .tdsj-glance__label { display: inline-flex; align-items: center; gap: 10px; font-size: 13px; letter-spacing: 1.4px; text-transform: uppercase; color: #FFFFFF; }
.tdsj-page .tdsj-glance__label::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--tds-or); animation: tdsk-pulse 2s ease-out infinite; }
.tdsj-page .tdsj-glance__list { margin: 20px 0 0; }
.tdsj-page .tdsj-glance__row { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 16px; padding: 15px 0; border-top: 1px solid rgba(221, 222, 222, .12); animation: tdsj-row .7s cubic-bezier(.2, .7, .2, 1) both; animation-delay: calc(.6s + var(--i, 0) * .08s); }
.tdsj-page .tdsj-glance__row dt { font-size: 12px; letter-spacing: 1.2px; text-transform: uppercase; color: var(--tds-peri); padding-top: 3px; }
.tdsj-page .tdsj-glance__row dd { margin: 0; font-family: var(--tds-title); font-weight: 500; font-size: 16px; line-height: 1.45; color: #FFFFFF; }
.tdsj-page .tdsj-glance__btn { width: 100%; margin-top: 22px; }
.tdsj-page .tdsj-glance__note { margin-top: 10px; font-size: 13px; text-align: center; color: var(--tds-peri); }

/* ---------- the role: on-page nav + blocks ---------- */
.tdsj-page .tdsj-role { content-visibility: visible; contain: none; }
.tdsj-page .tdsj-role__grid { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); align-items: start; gap: 56px 112px; }
.tdsj-page .tdsj-toc { position: sticky; top: 124px; }
.tdsj-page .tdsj-toc__list { margin: 6px 0 0; padding: 0; list-style: none; border-left: 2px solid var(--tds-line); }
.tdsj-page .tdsj-toc__link { --p: 0; position: relative; display: flex; align-items: baseline; gap: 14px; padding: 13px 0 13px 22px; font-family: var(--tds-title); font-weight: 500; font-size: 17px; line-height: 1.35; color: var(--tds-slate); transition: color .3s; }
.tdsj-page .tdsj-toc__link::before { content: ''; position: absolute; left: -2px; top: 0; bottom: 0; width: 2px; background: var(--tds-or); transform: scaleY(var(--p)); transform-origin: top; }
.tdsj-page .tdsj-toc__link:hover, .tdsj-page .tdsj-toc__link[aria-current="true"] { color: var(--tds-ink); }
.tdsj-page .tdsj-toc__n { font-family: var(--tds-body); font-size: 12px; letter-spacing: 1.2px; color: var(--tds-line2); transition: color .3s; }
.tdsj-page .tdsj-toc__link[aria-current="true"] .tdsj-toc__n { color: var(--tds-or-text); }
.tdsj-page .tdsj-toc__apply { margin-top: 32px; padding: 24px; background: var(--tds-alt); border-radius: 12px; }
.tdsj-page .tdsj-toc__apply p { margin-bottom: 14px; font-family: var(--tds-title); font-weight: 600; font-size: 18px; color: var(--tds-ink); }
.tdsj-page .tdsj-toc__apply .tdsv2-btn { width: 100%; }

.tdsj-page .tdsj-role__body { min-width: 0; }
.tdsj-page .tdsj-block { padding-bottom: 72px; margin-bottom: 72px; border-bottom: 1px solid var(--tds-line); scroll-margin-top: 120px; }
.tdsj-page .tdsj-block__h { margin-bottom: 30px; font-size: clamp(32px, 2.8vw, 46px); }
.tdsj-page .tdsj-rich { max-width: 860px; font-size: 17px; line-height: 1.8; color: var(--tds-slate); }
.tdsj-page .tdsj-rich p + p { margin-top: 18px; }
.tdsj-page .tdsj-rich :is(b, strong) { font-weight: 600; color: var(--tds-ink); }
.tdsj-page .tdsj-rich a { color: var(--tds-or-text); border-bottom: 1px solid currentColor; }
.tdsj-page .tdsj-block--about .tdsj-rich > p:first-child { font-family: var(--tds-title); font-weight: 500; font-size: clamp(19px, 1.45vw, 23px); line-height: 1.6; color: var(--tds-ink); }

/* responsibilities: numbered, each line lights up at the reading line */
.tdsj-page .tdsj-duties ul, .tdsj-page .tdsj-duties ol { margin: 0; padding: 0; list-style: none; counter-reset: tdsj-duty; border-top: 1px solid var(--tds-line); }
.tdsj-page .tdsj-duties li { position: relative; padding: 18px 0 18px 58px; border-bottom: 1px solid var(--tds-line); counter-increment: tdsj-duty; color: var(--tds-ink); transition: opacity .5s, transform .5s; }
.tdsj-page .tdsj-duties li::before { content: counter(tdsj-duty, decimal-leading-zero); position: absolute; left: 0; top: calc(18px + .35em); font-family: var(--tds-body); font-size: 13px; font-weight: 500; line-height: 1.4; letter-spacing: 1.2px; color: var(--tds-or-text); }
.tdsj-page.tdss-ready .tdsj-duties li:not(.is-lit) { opacity: .3; transform: translateX(10px); }

/* skills */
.tdsj-page .tdsj-skills { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; padding: 0; list-style: none; }
.tdsj-page .tdsj-skills li { display: inline-flex; align-items: center; gap: 12px; padding: 14px 22px; background: var(--tds-tint); border-radius: 999px; font-family: var(--tds-title); font-weight: 500; font-size: 18px; color: var(--tds-ink); transition: opacity .5s, transform .5s cubic-bezier(.2, .8, .2, 1), background-color .25s, color .25s; transition-delay: calc(var(--i, 0) * .08s), calc(var(--i, 0) * .08s), 0s, 0s; }
.tdsj-page .tdsj-skills li::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--tds-or); }
.tdsj-page .tdsj-skills li:hover { background: var(--tds-n950); color: #FFFFFF; }
.tdsj-page.tdss-ready .tdsj-skills:not(.is-in) li { opacity: 0; transform: translateY(16px) scale(.96); }

/* qualification */
.tdsj-page .tdsj-qual { display: grid; grid-template-columns: 64px minmax(0, 1fr); align-items: start; gap: 24px; max-width: 860px; padding: 32px; background: var(--tds-alt); border: 1px solid var(--tds-line); border-radius: 12px; transition: opacity .7s, transform .7s; }
.tdsj-page .tdsj-qual__icon { display: inline-flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 50%; background: var(--tds-or); color: var(--tds-n950); }
.tdsj-page .tdsj-qual .tdsj-rich { font-family: var(--tds-title); font-weight: 500; font-size: 19px; line-height: 1.6; color: var(--tds-ink); }
.tdsj-page.tdss-ready .tdsj-qual:not(.is-in) { opacity: 0; transform: translateY(20px); }

/* apply card at the end of the role */
.tdsj-page .tdsj-apply { position: relative; isolation: isolate; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 32px; padding: 36px 40px; overflow: hidden; background: var(--tds-n950); border-radius: 12px; color: #FFFFFF; transition: opacity .7s, transform .7s; }
.tdsj-page .tdsj-apply::before { content: ''; position: absolute; right: -120px; top: -160px; z-index: -1; width: 420px; height: 420px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 89, 47, .35) 0%, rgba(255, 89, 47, 0) 65%); }
.tdsj-page .tdsj-apply__label { font-size: 13px; letter-spacing: 1.4px; text-transform: uppercase; color: var(--tds-or); }
.tdsj-page .tdsj-apply__h { margin-top: 8px; font-family: var(--tds-display); font-size: clamp(30px, 2.6vw, 42px); line-height: 1.05; }
.tdsj-page.tdss-ready .tdsj-apply:not(.is-in) { opacity: 0; transform: translateY(20px); }

/* other roles section sits on the alt background */
.tdsj-page .tdsj-more .tdsk-job { background: transparent; }
.tdsj-page .tdsj-more .tdsk-tag:not(.tdsk-tag--dept) { background: #FFFFFF; }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
  .tdsj-page .tdsj-role__grid { grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: 48px 56px; }
}
@media (max-width: 1024px) {
  .tdsj-page .tdsj-hero__grid { grid-template-columns: minmax(0, 1fr); min-height: 0; padding-top: 56px; }
  .tdsj-page .tdsj-glance { justify-self: start; }
  .tdsj-page .tdsj-role__grid { grid-template-columns: minmax(0, 1fr); }
  .tdsj-page .tdsj-toc { position: static; }
  .tdsj-page .tdsj-toc__list { display: flex; flex-wrap: wrap; gap: 8px; border-left: 0; }
  .tdsj-page .tdsj-toc__link { padding: 9px 16px; border: 1px solid var(--tds-line2); border-radius: 999px; font-size: 15px; }
  .tdsj-page .tdsj-toc__link::before { display: none; }
  .tdsj-page .tdsj-toc__apply { display: none; }
}
@media (max-width: 768px) {
  .tdsj-page .tdsj-glance { padding: 24px 22px; }
  .tdsj-page .tdsj-glance__row { grid-template-columns: 96px minmax(0, 1fr); }
  .tdsj-page .tdsj-block { padding-bottom: 48px; margin-bottom: 48px; }
  .tdsj-page .tdsj-rich { font-size: 16px; }
  .tdsj-page .tdsj-duties li { padding: 14px 0 14px 40px; }
  .tdsj-page .tdsj-duties li::before { top: calc(14px + .3em); }
  .tdsj-page .tdsj-skills li { padding: 11px 17px; font-size: 16px; }
  .tdsj-page .tdsj-qual { grid-template-columns: minmax(0, 1fr); padding: 24px; }
  .tdsj-page .tdsj-qual__icon { width: 52px; height: 52px; }
  .tdsj-page .tdsj-qual .tdsj-rich { font-size: 17px; }
  .tdsj-page .tdsj-apply { padding: 28px 24px; }
  .tdsj-page .tdsj-apply .tdsv2-btn { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .tdsj-page .tdsj-glance__row, .tdsj-page .tdsj-glance__label::before { animation: none; }
  .tdsj-page .tdsj-duties li, .tdsj-page .tdsj-skills li, .tdsj-page .tdsj-qual, .tdsj-page .tdsj-apply { transition: none; }
}