/* ============================================================
   Job detail — shared template for all THROME career roles
   ============================================================ */

.job-page { background: #faf9f7; }
.job-page .nav { background: rgba(250,249,247,.9); box-shadow: 0 1px 0 var(--line); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.job-page .nav .btn-primary { background: #201b25; box-shadow: none; }
.job-page .nav .btn-primary:hover { background: var(--violet); }

.job-intro { padding: 158px 0 61px; border-bottom: 1px solid var(--line); background: radial-gradient(circle at 77% 12%, rgba(238,235,253,.86), transparent 26%), #faf9f7; }
.job-intro .container { max-width: 1120px; }
.job-back { display: inline-flex; align-items: center; gap: 9px; color: #6554d8; font-size: 11px; line-height: 1; transition: color .2s, transform .2s; }
.job-back span { font-size: 16px; line-height: .6; }.job-back:hover { color: #201b25; transform: translateX(-3px); }
.job-kicker { margin-top: 54px; color: #9a6a19; font-size: 10px; letter-spacing: .13em; line-height: 1.4; }
.job-intro h1 { max-width: 810px; margin-top: 15px; font-size: clamp(48px, 6vw, 76px); font-weight: 900; letter-spacing: -.067em; line-height: 1.06; }
.job-deck { max-width: 650px; margin-top: 22px; color: var(--ink-soft); font-size: 16px; line-height: 1.9; }

.job-detail { padding: 64px 0 118px; }
.job-detail-grid { display: grid; grid-template-columns: 224px minmax(0, 710px); gap: clamp(52px, 9vw, 132px); align-items: start; }
.job-sidebar { position: sticky; top: 108px; }
.job-facts { border-top: 1px solid #dad5cb; }
.job-fact { padding: 16px 0 17px; border-bottom: 1px solid #e7e2d9; }
.job-fact small { display: block; margin-bottom: 5px; color: #979087; font-family: var(--font-mono); font-size: 9px; letter-spacing: .09em; }
.job-fact b { display: block; color: #393442; font-size: 13px; font-weight: 500; line-height: 1.5; }
.job-apply-final { display: inline-flex; align-items: center; gap: 10px; font-weight: 900; transition: transform .2s, color .2s, background .2s; }
.job-apply-final span { font-size: 17px; line-height: 1; }

.job-tabs { display: flex; gap: 30px; margin-bottom: 42px; border-bottom: 1px solid var(--line); }
.job-tabs a { position: relative; padding: 0 0 13px; color: #948e86; font-size: 13px; font-weight: 700; }.job-tabs a.active { color: #6554d8; }.job-tabs a.active::after { content: ""; position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; border-radius: 2px; background: #6b5ce7; }
.job-section + .job-section { margin-top: 44px; }
.job-section h2, .job-application h2 { margin-bottom: 13px; font-size: 21px; font-weight: 900; letter-spacing: -.035em; line-height: 1.35; }
.job-section p, .job-section li { color: #5f5960; font-size: 14px; line-height: 1.85; }
.job-section p + p { margin-top: 13px; }
.job-section ul { display: grid; gap: 13px; margin: 3px 0 0; padding-left: 19px; }
.job-section li::marker { color: #6b5ce7; }.job-section strong { color: #2a2630; font-weight: 900; }

.job-application { margin-top: 62px; padding: 35px 37px 38px; border: 1px solid #dcd6ed; border-radius: 18px; background: linear-gradient(135deg, #eeebfd, #faf8ff); }
.job-application .job-kicker { margin: 0 0 15px; color: #6554d8; }
.job-application p:not(.job-kicker) { max-width: 530px; color: #5f5960; font-size: 14px; line-height: 1.85; }
.job-apply-final { margin-top: 24px; padding-bottom: 7px; color: #201b25; border-bottom: 1px solid rgba(32,27,37,.45); font-size: 13px; }.job-apply-final:hover { color: #6554d8; border-color: #6554d8; transform: translateX(3px); }

@media (max-width: 800px) {
  .job-intro { padding: 135px 0 53px; }.job-kicker { margin-top: 46px; }.job-detail { padding: 48px 0 88px; }.job-detail-grid { grid-template-columns: 1fr; gap: 43px; }.job-sidebar { position: static; }.job-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 0; gap: 0 24px; }.job-fact { border-top: 1px solid #dad5cb; }.job-content { max-width: 710px; }
}

@media (max-width: 560px) {
  .job-intro { padding: 120px 0 42px; }.job-intro .container, .job-detail .container { padding-right: 20px; padding-left: 20px; }.job-back { font-size: 10px; }.job-kicker { margin-top: 38px; }.job-intro h1 { margin-top: 13px; font-size: 45px; }.job-deck { margin-top: 18px; font-size: 14px; }.job-detail { padding: 38px 0 70px; }.job-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 0 15px; }.job-fact { padding: 12px 0 13px; }.job-fact b { font-size: 12px; }.job-tabs { gap: 23px; margin-bottom: 32px; }.job-section + .job-section { margin-top: 36px; }.job-section h2, .job-application h2 { font-size: 19px; }.job-section p, .job-section li, .job-application p:not(.job-kicker) { font-size: 13.5px; }.job-application { margin-top: 48px; padding: 27px 23px 29px; border-radius: 15px; }
}
