/* /join recruiting pages. Builds on site.css tokens and the article hero (art-*), split and jp-* sections. */
.jn-hero .art-tag{max-width:32em}
.jn-lane{margin:12px 0 0;font:700 clamp(16px,1.4vw,18px)/1.3 var(--display);color:var(--yellow)}
.jn-small{margin-top:14px;font-size:15px}
.jn-small .link{color:#e9e9e9;text-decoration:underline;text-underline-offset:3px}
.jn-small .link:hover{color:var(--yellow)}

/* Lanes */
.jn-paths{background:#0a0a0a;padding:clamp(40px,6vw,80px) 0}
.jn-paths h2,.jn-roadmap h2,.jn-fit h2{font-size:clamp(32px,4.4vw,56px);line-height:1;margin-bottom:clamp(20px,3vw,36px)}
.jn-paths h2 .y,.jn-roadmap h2 .y,.jn-fit h2 .y{display:inline}
.jn-cards{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2.4vw,28px)}
.jn-card{background:#141414;border:1px solid #2a2a2a;border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:transform .25s var(--ease),border-color .25s}
.jn-card:hover{transform:translateY(-3px);border-color:#4a3c10}
.jn-card img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-bottom:4px solid var(--yellow)}
.jn-card>div{padding:clamp(18px,2.4vw,28px);display:flex;flex-direction:column;gap:10px;flex:1}
.jn-card h3{font-size:clamp(24px,2.4vw,32px);line-height:1.05}
.jn-card p{color:#cfd1d4;font-size:17px}
.jn-card .kicker{margin:0}
.jn-card .btn{align-self:flex-start;margin-top:auto}

/* Mission split: reuse the TruckLife split, slightly calmer type */
.jn-mission .half h2{font-size:clamp(40px,5vw,72px)}

/* Roadmap */
.jn-roadmap{background:linear-gradient(180deg,#0a0a0a,#121008);padding:clamp(44px,6vw,88px) 0}
.jn-steps{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,2vw,22px);counter-reset:s;position:relative}
.jn-steps::before{content:'';position:absolute;left:4%;right:4%;top:34px;height:4px;background:repeating-linear-gradient(90deg,var(--yellow) 0 28px,transparent 28px 46px);opacity:.7}
.jn-steps li{position:relative;background:#161616;border:1px solid #2a2a2a;border-radius:12px;padding:62px 18px 20px}
.jn-steps b{position:absolute;top:12px;left:18px;width:46px;height:46px;border-radius:50%;background:var(--yellow);color:#0a0a0a;display:grid;place-items:center;font:900 17px/1 var(--display);box-shadow:0 0 0 6px #0f0f0f}
.jn-steps h3{font-size:21px;line-height:1.1;margin:8px 0 8px}
.jn-steps p{font-size:16px;line-height:1.5;color:#cfd1d4}

/* Fit */
.jn-fit{background:#0a0a0a;padding:clamp(40px,6vw,80px) 0}
.jn-fit .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center}
.jn-checks{list-style:none;display:grid;gap:12px}
.jn-checks li{position:relative;padding-left:40px;font-size:clamp(17px,1.5vw,20px);color:#e3e4e6}
.jn-checks li::before{content:'';position:absolute;left:0;top:3px;width:26px;height:26px;border-radius:50%;background:var(--yellow);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='12'/%3E%3C/svg%3E") center/contain no-repeat}
.jn-checks li::after{content:'';position:absolute;left:8px;top:9px;width:10px;height:6px;border-left:3px solid #0a0a0a;border-bottom:3px solid #0a0a0a;transform:rotate(-45deg)}
.jn-fit-photo{margin:0;border-radius:14px;overflow:hidden;aspect-ratio:4/3;border:1px solid #2b2b2b;box-shadow:0 24px 60px rgba(0,0,0,.5)}
.jn-fit-photo img{width:100%;height:100%;object-fit:cover}

/* Affiliates band */
.jn-aff{position:relative;isolation:isolate;overflow:hidden;padding:clamp(56px,8vw,120px) 0;background:#0a0a0a}
.jn-aff>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.6}
.jn-aff::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(10,10,10,.94) 0%,rgba(10,10,10,.7) 45%,rgba(10,10,10,.15) 100%)}
.jn-aff .wrap>*{max-width:34em}
.jn-aff h2{font-size:clamp(34px,4.6vw,60px);line-height:1;margin-bottom:16px}
.jn-aff h2 .y{display:inline}
.jn-aff p{color:#e3e4e6;font-size:clamp(17px,1.5vw,19px);margin-bottom:22px}
.jn-legal{margin-top:28px;font-size:13px;line-height:1.55;color:#9a9da1}
.jn-legal a{color:#d6d8db}

/* Form pages */
.jn-mini{position:relative;isolation:isolate;overflow:hidden;padding:clamp(40px,6vw,80px) 0 clamp(28px,4vw,44px);background:#0a0a0a}
.jn-mini>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.55}
.jn-mini::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0a0a0a 25%,rgba(10,10,10,.6) 65%,rgba(10,10,10,.35)),linear-gradient(0deg,#0a0a0a,rgba(10,10,10,0) 60%)}
.jn-mini .crumbs{color:var(--steel-lt);margin-bottom:18px}
.jn-mini h1{font:900 clamp(40px,6vw,76px)/.92 var(--display);margin:0}
.jn-mini h1 .w,.jn-mini h1 .y{display:block}
.jn-mini p{margin-top:14px;max-width:34em;font-size:clamp(17px,1.5vw,20px);color:#e9e9e9}
.jn-switch{display:inline-flex;margin-top:22px;border:1.5px solid #3a3a3a;border-radius:999px;padding:4px;background:rgba(10,10,10,.6)}
.jn-switch a{padding:9px 18px;border-radius:999px;text-decoration:none;font:800 15px/1 var(--display);color:#d6d8db}
.jn-switch a[aria-selected="true"]{background:var(--yellow);color:#0a0a0a}

.jn-formwrap{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(240px,.9fr);gap:clamp(20px,3vw,40px);align-items:start;padding-top:clamp(20px,3vw,36px);padding-bottom:clamp(48px,6vw,88px)}
.jn-form{background:#141414;border:1px solid #2a2a2a;border-radius:14px;padding:clamp(18px,3vw,32px)}
.jn-form fieldset{border:0;display:grid;gap:14px}
.jn-form fieldset[hidden]{display:none}
.jn-form legend{padding:0;margin-bottom:6px}
.jn-form h2{font-size:clamp(24px,2.6vw,32px);line-height:1.05}
.jn-form p{font-size:16px;color:#cfd1d4}
.jn-form a{color:var(--yellow)}
.jn-progress{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px;counter-reset:p}
.jn-progress li{counter-increment:p;font:700 13px/1.2 var(--display);color:#8a8d91;border-top:4px solid #2e2e2e;padding-top:8px}
.jn-progress li::before{content:counter(p) '. '}
.jn-progress li.done,.jn-progress li[aria-current="step"]{color:#fff;border-top-color:var(--yellow)}
.jn-autosave{margin:0 0 10px !important}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fld{display:grid;gap:6px;font-size:15px;font-weight:600;color:#e3e4e6}
.fld small,.jn-check small,.sub-q small{font-weight:400;color:#9a9da1}
.fld input,.fld select,.fld textarea{width:100%;min-height:50px;padding:12px 14px;border-radius:10px;border:1.5px solid #3a3a3a;background:#0d0d0d;color:#fff;font:400 17px/1.3 var(--body)}
.fld select[multiple]{min-height:130px}
.fld textarea{min-height:90px;resize:vertical}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--yellow);box-shadow:0 0 0 3px rgba(251,191,1,.25)}
.fld [aria-invalid="true"]{border-color:#e5534b}
.sub-q{font-size:15px;font-weight:600;color:#e3e4e6;margin-bottom:-6px}
.jn-chips{display:flex;flex-wrap:wrap;gap:8px}
.jn-chips label{position:relative}
.jn-chips input{position:absolute;opacity:0;inset:0;cursor:pointer}
.jn-chips span{display:inline-block;padding:9px 14px;border-radius:999px;border:1.5px solid #3a3a3a;font-size:15px;color:#d6d8db;transition:background .15s,border-color .15s}
.jn-chips input:checked+span{background:var(--yellow);border-color:var(--yellow);color:#0a0a0a;font-weight:700}
.jn-chips input:focus-visible+span{outline:3px solid var(--yellow);outline-offset:2px}
.jn-check{display:grid;grid-template-columns:24px 1fr;gap:12px;align-items:start;font-size:15px;line-height:1.5;color:#d6d8db;padding:12px;border-radius:10px;background:#0f0f0f;border:1px solid #262626}
.jn-check input{width:22px;height:22px;margin-top:1px;accent-color:var(--yellow)}
.jn-check.req{border-color:#4a3c10}
.jn-rules{display:grid;gap:8px;padding-left:1.1em;color:#d6d8db;font-size:15px}
.err{color:#ff8a80;font-weight:600;font-size:15px}
.hp{position:absolute !important;left:-9999px;width:1px;height:1px;opacity:0}
.jn-form .btn-row{margin-top:6px}
.jn-form .btn{min-width:140px}
.jn-form button[disabled]{opacity:.6;cursor:wait}
.jn-side{position:sticky;top:90px;background:#101010;border:1px solid #262626;border-left:4px solid var(--yellow);border-radius:12px;padding:20px 22px}
.jn-side h2{font-size:22px;margin-bottom:12px}
.jn-mini-steps{display:grid;gap:10px;padding-left:1.2em;color:#d6d8db;font-size:16px}
.jn-mini-steps li::marker{color:var(--yellow);font-weight:800}

@media (max-width:900px){
  .jn-steps{grid-template-columns:1fr 1fr}
  .jn-steps::before{display:none}
  .jn-formwrap{grid-template-columns:1fr}
  .jn-side{position:static}
}
@media (max-width:700px){
  .jn-cards,.jn-fit .wrap{grid-template-columns:1fr}
  .jn-steps{grid-template-columns:1fr}
  .grid2{grid-template-columns:1fr}
  .jn-hero .btn-row .btn{width:100%}
  .jn-aff::after{background:linear-gradient(0deg,rgba(10,10,10,.95) 30%,rgba(10,10,10,.55))}
  .jn-switch{display:flex}
  .jn-switch a{flex:1;text-align:center;padding:11px 8px}
  .jn-form .btn-row{flex-wrap:nowrap}
  .jn-form .btn{min-width:0;flex:1}
}
@media (prefers-reduced-motion:reduce){.jn-card{transition:none}.jn-card:hover{transform:none}}

/* ---- Teri recruiting mode (spec v1.0) ---- */
.jn-cards-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.jn-scope{font-size:15px !important;color:#b9bcc0 !important;border-left:3px solid var(--yellow);padding-left:10px}
.jn-scope b{color:#fff}
.jn-paths .kicker+h2{margin-top:0}
.jn-touch{background:#0f0f0f;padding:clamp(40px,6vw,80px) 0;border-top:1px solid #1d1d1d}
.jn-touch h2,.jn-dolearn h2{font-size:clamp(30px,4vw,50px);line-height:1;margin-bottom:clamp(18px,2.6vw,30px)}
.jn-touch h2 .y,.jn-dolearn h2 .y{display:inline}
.jn-quotes{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,20px)}
.jn-quotes li{background:#161616;border:1px solid #2a2a2a;border-radius:12px;padding:18px 20px;font-size:17px;color:#d6d8db;line-height:1.5}
.jn-quotes b{display:block;font:800 19px/1.2 var(--display);color:#fff;margin-bottom:6px}
.jn-dolearn{background:#0a0a0a;padding:clamp(40px,6vw,80px) 0}
.jn-dolearn .wrap{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,56px)}
.jn-steps-7{grid-template-columns:repeat(7,minmax(0,1fr))}
.jn-steps-7 li{padding:58px 14px 16px}
.jn-steps-7 h3{font-size:17px}
.jn-steps-7 p{font-size:14.5px}
.jn-reality{background:#141414;border:1px solid #2a2a2a;border-left:4px solid var(--yellow);border-radius:12px;padding:18px 20px;margin:8px 0 28px}
.jn-reality h3{font-size:22px;margin:0 0 10px;color:#fff}
.jn-reality dl{display:grid;gap:8px;margin:0}
.jn-reality dl div{display:grid;grid-template-columns:minmax(150px,240px) 1fr;gap:12px;padding:8px 0;border-top:1px solid #242424}
.jn-reality dt{font-weight:700;color:#e3e4e6;font-size:15.5px}
.jn-reality dd{margin:0;color:#c9ccd0;font-size:15.5px}
.jn-tbd{display:inline-block;padding:2px 9px;border-radius:999px;background:#2a2410;color:var(--yellow);font-weight:700;font-size:13.5px}
.jn-sticky{display:none}
@media (max-width:1100px){.jn-steps-7{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:900px){.jn-cards-3{grid-template-columns:1fr 1fr}}
@media (max-width:700px){
  .jn-cards-3,.jn-quotes,.jn-dolearn .wrap{grid-template-columns:1fr}
  .jn-steps-7{grid-template-columns:1fr}
  .jn-reality dl div{grid-template-columns:1fr;gap:2px}
  /* Sticky "Join TruckLife": sits above the site's bottom bar, hides near the top and bottom of the page. */
  .jn-sticky{display:block;position:fixed;left:50%;transform:translateX(-50%);bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:40;transition:opacity .2s,transform .2s}
  .jn-sticky .btn{min-height:46px;padding:10px 22px;border-radius:999px;font-size:16px;box-shadow:0 6px 20px rgba(0,0,0,.45)}
  .jn-sticky[data-hidden]{opacity:0;pointer-events:none;transform:translate(-50%,12px)}
}
@media (prefers-reduced-motion:reduce){.jn-sticky{transition:none}}

.jn-hero .art-copy h1{font-size:clamp(40px,5.2vw,76px);line-height:.95}
