/* Remote Talent — help centre.
   Layered on top of features/style.css, which carries the tokens and chrome. */

.help-hero{padding:56px 0 40px;position:relative;overflow:hidden}
.help-hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(700px 340px at 78% 0%,rgba(29,78,216,.055),transparent 70%)}
.help-hero .wrap{position:relative}
.help-hero h1{font-size:clamp(32px,4.4vw,46px);line-height:1.07;letter-spacing:-1.5px;
  font-weight:600;margin:6px 0 0}
.help-hero .lede{margin-top:16px;max-width:640px}
.help-hero .lede a{color:var(--blue);font-weight:500}
.help-hero .lede a:hover{text-decoration:underline;text-underline-offset:3px}

/* ── Search ── */
.search-wrap{position:relative;margin-top:28px;max-width:520px}
.search-ico{position:absolute;left:16px;top:50%;transform:translateY(-50%);
  width:18px;height:18px;color:var(--sub2);pointer-events:none}
#helpSearch{width:100%;padding:14px 44px 14px 44px;font-family:var(--font);font-size:15px;
  color:var(--ink);background:#fff;border:1px solid var(--rule);border-radius:999px;
  outline:none;transition:border-color .18s,box-shadow .18s;-webkit-appearance:none}
#helpSearch::placeholder{color:var(--sub2)}
#helpSearch:focus{border-color:var(--ink);box-shadow:0 0 0 4px rgba(29,78,216,.09)}
#helpSearch::-webkit-search-cancel-button{display:none}
.search-clear{position:absolute;right:8px;top:50%;transform:translateY(-50%);
  width:30px;height:30px;border:none;border-radius:999px;background:var(--paper2);
  color:var(--sub);font-size:18px;line-height:1;display:grid;place-items:center}
.search-clear:hover{background:var(--paper3);color:var(--ink)}
/* display:grid above would otherwise beat the hidden attribute */
.search-clear[hidden]{display:none}

/* ── Category chips ── */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.chip{padding:8px 14px;border-radius:999px;border:1px solid var(--rule);background:#fff;
  font-family:var(--font);font-size:12.5px;font-weight:500;color:var(--sub);
  transition:all .16s;white-space:nowrap}
.chip:hover{border-color:var(--ink);color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.chip .n{font-variant-numeric:tabular-nums;opacity:.55;margin-left:6px;font-size:11px}

/* ── Categories ── */
.cat{padding:44px 0 8px;scroll-margin-top:calc(var(--nav-h) + 20px)}
.cat + .cat{border-top:1px solid var(--rule-soft)}
.cat-head{max-width:640px;margin-bottom:8px}
.cat-head h2{font-size:23px;line-height:1.25;letter-spacing:-.5px;font-weight:600}
.cat-head .body{margin-top:6px;font-size:14px}

/* ── Q&A ── */
.qa-list{margin-top:18px;border-top:1px solid var(--rule)}
.qa{border-bottom:1px solid var(--rule)}
.qa[hidden]{display:none}
.qa-q{width:100%;background:none;border:none;padding:17px 0;display:flex;align-items:flex-start;
  gap:16px;text-align:left;color:inherit;font-family:var(--font)}
.qa-t{font-size:15.5px;font-weight:600;letter-spacing:-.2px;line-height:1.45;flex:1}
.qa-x{width:16px;height:16px;flex-shrink:0;margin-top:4px;position:relative;color:var(--sub2)}
.qa-x::before,.qa-x::after{content:"";position:absolute;background:currentColor;border-radius:1px;
  transition:transform .28s cubic-bezier(.2,.7,.3,1)}
.qa-x::before{left:0;top:7px;width:16px;height:1.5px}
.qa-x::after{left:7px;top:0;width:1.5px;height:16px}
.qa.open .qa-x::after{transform:rotate(90deg)}
.qa.open .qa-x{color:var(--ink)}
.qa.open .qa-t{color:var(--ink)}
.qa-a{max-height:0;overflow:hidden;transition:max-height .34s cubic-bezier(.3,.7,.3,1)}
.qa-inner{padding:0 32px 20px 0}
.qa-a p{font-size:14.5px;line-height:1.68;color:var(--sub);margin:0}
.qa-a b{color:var(--ink);font-weight:600}
.qa-a a{color:var(--blue);font-weight:500}
.qa-a a:hover{text-decoration:underline;text-underline-offset:3px}

.no-results{padding:56px 0 12px;font-size:15px;line-height:1.6;color:var(--sub);max-width:560px}
.no-results a{color:var(--blue);font-weight:500}

.cta h2{color:var(--paper)}