/* ═══════════════════════════════════════════════════════════════════════
   hb-jobs.css — Ish e'lonlari (karyera) ommaviy sahifalari.

   Yangiliklar sahifasi (hb-news.css) bilan BIR XIL vizual til: serif
   sarlavha (Newsreader), monospace meta yorliqlar, keng oq maydon, tinch
   to'r. Sinf prefiksi ATAYLAB alohida (`hbj-`) — ikki bo'lim mustaqil
   rivojlanadi (vakansiyada maosh/talab bloklari paydo bo'lishi mumkin,
   blogda esa hech qachon), umumiy fayl ularni bir-biriga bog'lab qo'yardi.
   Umumiylik tokenlar darajasida (hb-tokens.css) saqlanadi.
   ═══════════════════════════════════════════════════════════════════════ */

.hbj-root{
  --hbj-ink: var(--hb-txt);
  --hbj-mut: var(--hb-mut);
  --hbj-line: var(--hb-brd);
  --hbj-acc: var(--hb-acc, #24C29A);
  --hbj-paper: var(--hb-bg);
  --hbj-paper-2: var(--hb-bg2);
  --hbj-serif: 'Newsreader', Georgia, 'Times New Roman', serif;
  --hbj-mono: 'JetBrains Mono', ui-monospace, monospace;
  --hbj-wrap: 1240px;

  /* Manfiy margin endi `.hbp-root` da (hb-public.css) — ikki marta
     qo'llanilsa kontent ikki barobar siljirdi. */
  display:block;
  background:var(--hbj-paper); color:var(--hbj-ink);
  font-family:'Inter', system-ui, sans-serif;
  -webkit-font-smoothing:antialiased;
}
.hbj-wrap{ max-width:var(--hbj-wrap); margin:0 auto; padding:0 clamp(16px,4vw,40px) }
.hbj-narrow{ max-width:820px }

/* Navigatsiyani markazlashtirish → hb-public.css (`body.hbp-public`). */

.hbj-eyebrow{
  font-family:var(--hbj-mono); font-size:11px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--hbj-acc); font-weight:500;
}
.hbj-meta{
  font-family:var(--hbj-mono); font-size:11.5px; letter-spacing:.04em;
  color:var(--hbj-mut); display:flex; align-items:center; gap:8px; flex-wrap:wrap;
}
.hbj-meta .dot{ opacity:.5 }

/* ── Masthead ── */
.hbj-masthead{ padding:clamp(44px,7vw,86px) 0 clamp(20px,3vw,32px) }
.hbj-masthead h1{
  font-family:var(--hbj-serif); font-weight:500;
  font-size:clamp(40px,8vw,92px); line-height:.95; letter-spacing:-.035em;
  margin:14px 0 0; color:var(--hbj-ink);
}
.hbj-sub{ margin-top:18px; max-width:52ch; font-size:clamp(15px,1.6vw,17.5px);
  line-height:1.62; color:var(--hbj-mut) }

/* Statistika qatori */
.hbj-stats{
  display:flex; gap:clamp(24px,5vw,64px); flex-wrap:wrap;
  margin-top:clamp(28px,4vw,44px); padding:22px 0;
  border-top:1px solid var(--hbj-line); border-bottom:1px solid var(--hbj-line);
}
.hbj-stat-n{ font-family:var(--hbj-serif); font-size:clamp(30px,4vw,44px); line-height:1;
  font-weight:500; letter-spacing:-.02em }
.hbj-stat-l{ font-family:var(--hbj-mono); font-size:10.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--hbj-mut); margin-top:8px }

/* ── Filtrlar ── */
.hbj-filters{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:22px 0; border-bottom:1px solid var(--hbj-line);
}
.hbj-chips{ display:flex; gap:8px; flex-wrap:wrap; flex:1; min-width:0 }
.hbj-chip{
  display:inline-flex; align-items:center; gap:7px; text-decoration:none;
  padding:7px 14px; border-radius:999px; border:1px solid var(--hbj-line);
  font-size:12.5px; font-weight:600; color:var(--hbj-mut); background:transparent;
  transition:color .18s ease, border-color .18s ease, background .18s ease;
}
a.hbj-chip:hover{ color:var(--hbj-ink); border-color:var(--hb-brd2); text-decoration:none }
.hbj-chip.active{ background:var(--hbj-ink); border-color:var(--hbj-ink); color:var(--hbj-paper) }
.hbj-search{
  display:flex; align-items:center; gap:9px; height:38px; padding:0 15px;
  border:1px solid var(--hbj-line); border-radius:999px; min-width:230px;
  color:var(--hbj-mut); transition:border-color .18s ease;
}
.hbj-search:focus-within{ border-color:var(--hbj-acc) }
.hbj-search input{ border:0; outline:0; background:transparent; color:var(--hbj-ink);
  font:inherit; font-size:13px; width:100%; min-width:0 }

/* ── Vakansiya ro'yxati — jurnal uslubidagi QATORLAR (karta emas) ──
   Vakansiyada rasm yo'q; kartaga solish bo'sh to'rtburchaklar qatorini
   yasardi. Shu sabab keng, bosiladigan qatorlar — Linear/Vercel ish
   sahifalaridagi naqsh. */
.hbj-list{ display:flex; flex-direction:column; padding:clamp(10px,2vw,18px) 0 0 }
.hbj-item{
  position:relative; display:grid; grid-template-columns:1fr auto;
  gap:18px; align-items:center; padding:clamp(22px,3vw,30px) clamp(6px,1.4vw,16px);
  border-bottom:1px solid var(--hbj-line); text-decoration:none; color:inherit;
  transition:padding-left .4s cubic-bezier(.16,1,.3,1);
}
/* `a.hbj-*` — hb-components.css dagi umumiy havola rangidan kuchliroq
   bo'lishi uchun element+klass. `color:inherit` yetarli emas edi: qator
   sarlavhalari yashil (havola rangi) bo'lib chiqib qolgan edi. */
a.hbj-item, a.hbj-item:hover{ color:var(--hbj-ink) }
a.hbj-item h2, a.hbj-item p, a.hbj-item .hbj-meta{ color:inherit }
a.hbj-item p, a.hbj-item .hbj-meta{ color:var(--hbj-mut) }
a.hbj-item:hover{ text-decoration:none; padding-left:clamp(14px,2.4vw,28px) }
.hbj-item::before{
  content:''; position:absolute; inset:0; background:var(--hbj-paper-2); z-index:0;
  transform:scaleX(0); transform-origin:left; transition:transform .45s cubic-bezier(.16,1,.3,1);
}
a.hbj-item:hover::before{ transform:scaleX(1) }
.hbj-item > *{ position:relative; z-index:1 }
.hbj-item-main{ min-width:0 }
.hbj-item h2{
  font-family:var(--hbj-serif); font-weight:500; font-size:clamp(22px,2.8vw,32px);
  line-height:1.15; letter-spacing:-.02em; margin:0;
}
.hbj-item p{
  margin:10px 0 0; font-size:14.5px; line-height:1.6; color:var(--hbj-mut);
  max-width:62ch; display:-webkit-box; -webkit-line-clamp:2;
  -webkit-box-orient:vertical; overflow:hidden;
}
.hbj-item .hbj-meta{ margin-top:12px }
.hbj-badge{
  display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px;
  background:color-mix(in srgb, var(--hbj-acc) 16%, transparent);
  color:var(--hb-acc-text, var(--hbj-acc));
  font-family:var(--hbj-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase;
}
.hbj-arrow{
  flex:none; width:42px; height:42px; border-radius:50%; display:grid; place-items:center;
  border:1px solid var(--hbj-line); color:var(--hbj-mut);
  transition:background .3s ease, color .3s ease, border-color .3s ease, transform .3s ease;
}
a.hbj-item:hover .hbj-arrow{
  background:var(--hbj-acc); border-color:transparent;
  color:var(--hb-acc-ink,#0B1F19); transform:translateX(4px);
}

/* ── Bo'sh holat ── */
.hbj-empty{ padding:clamp(60px,10vw,120px) 0; text-align:center }
.hbj-empty-t{ font-family:var(--hbj-serif); font-size:clamp(24px,3vw,34px); margin:14px 0 8px }
.hbj-empty-s{ color:var(--hbj-mut); font-size:14.5px }

/* ── "Nega biz" bo'limi ── */
.hbj-why{ padding:clamp(50px,7vw,90px) 0; border-top:1px solid var(--hbj-line) }
.hbj-why h2{
  font-family:var(--hbj-serif); font-weight:500; font-size:clamp(26px,3.4vw,42px);
  letter-spacing:-.02em; margin:14px 0 clamp(26px,4vw,44px);
}
.hbj-why-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,40px) }
.hbj-why-item h3{ font-family:var(--hbj-serif); font-weight:500; font-size:20px;
  margin:12px 0 8px; letter-spacing:-.01em }
.hbj-why-item p{ margin:0; font-size:14.5px; line-height:1.62; color:var(--hbj-mut) }
.hbj-why-n{ font-family:var(--hbj-mono); font-size:11px; letter-spacing:.16em; color:var(--hbj-acc) }

/* ── Vakansiya sahifasi ── */
.hbj-detail{ padding:clamp(30px,5vw,56px) 0 0 }
.hbj-back{
  display:inline-flex; align-items:center; gap:7px; text-decoration:none;
  font-family:var(--hbj-mono); font-size:11.5px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--hbj-mut);
}
a.hbj-back:hover{ color:var(--hbj-ink); text-decoration:none }
.hbj-detail h1{
  font-family:var(--hbj-serif); font-weight:500;
  font-size:clamp(32px,5.4vw,62px); line-height:1.04; letter-spacing:-.03em;
  margin:22px 0 0;
}
.hbj-detail-meta{ margin-top:20px; display:flex; gap:10px; flex-wrap:wrap; align-items:center }
.hbj-prose{
  max-width:68ch; margin:clamp(30px,4vw,48px) 0 0;
  font-family:var(--hbj-serif); font-size:18.5px; line-height:1.72;
}
.hbj-prose p{ margin:0 0 1.2em }
.hbj-prose ul, .hbj-prose ol{ margin:0 0 1.2em; padding-left:1.3em }
.hbj-prose li{ margin:.35em 0 }
.hbj-prose h2, .hbj-prose h3{ font-weight:600; letter-spacing:-.02em; margin:1.8em 0 .5em }

/* Tavsif bo'sh bo'lganda — "bo'sh joy" o'rniga foydali blok */
.hbj-nodesc{
  margin:clamp(30px,4vw,48px) 0 0; padding:24px 26px; max-width:68ch;
  border:1px solid var(--hbj-line); border-radius:var(--hb-radius-md,18px);
  background:var(--hbj-paper-2);
}
.hbj-nodesc h3{ font-family:var(--hbj-serif); font-weight:500; font-size:21px; margin:0 0 10px }
.hbj-nodesc p{ margin:0 0 10px; font-size:14.5px; line-height:1.62; color:var(--hbj-mut) }
.hbj-nodesc ul{ margin:0; padding-left:1.2em; font-size:14.5px; line-height:1.7; color:var(--hbj-mut) }

.hbj-cta{
  display:flex; gap:12px; flex-wrap:wrap; align-items:center;
  margin:clamp(32px,4vw,48px) 0 0; padding:clamp(24px,3vw,32px) 0;
  border-top:1px solid var(--hbj-line);
}
.hbj-btn{
  display:inline-flex; align-items:center; gap:9px; text-decoration:none; cursor:pointer;
  height:48px; padding:0 26px; border-radius:999px; border:1px solid transparent;
  background:var(--hbj-acc); color:var(--hb-acc-ink,#0B1F19);
  font-size:14.5px; font-weight:700; letter-spacing:-.1px;
  transition:background .2s ease, transform .2s ease;
}
.hbj-btn:hover{ background:var(--hb-acc-d,#1FA884); color:var(--hb-acc-ink,#0B1F19);
  text-decoration:none; transform:translateY(-1px) }
.hbj-btn-ghost{
  background:transparent; border-color:var(--hbj-line); color:var(--hbj-ink);
}
.hbj-btn-ghost:hover{ background:var(--hbj-paper-2); color:var(--hbj-ink) }
.hbj-cta-note{ font-size:13px; color:var(--hbj-mut) }

.hbj-other{ padding:clamp(40px,6vw,72px) 0 clamp(50px,7vw,90px) }
.hbj-other-h{
  display:flex; align-items:baseline; justify-content:space-between; gap:16px;
  padding-top:26px; padding-bottom:8px; border-top:1px solid var(--hbj-line);
}
.hbj-other-h h3{ font-family:var(--hbj-serif); font-weight:500;
  font-size:clamp(20px,2.4vw,28px); margin:0 }

/* ── Ariza formasi sahifasi ── */
.hbj-form-head{ padding:clamp(34px,5vw,60px) 0 clamp(20px,3vw,30px) }
.hbj-form-head h1{
  font-family:var(--hbj-serif); font-weight:500;
  font-size:clamp(30px,4.6vw,52px); line-height:1.05; letter-spacing:-.03em; margin:14px 0 0;
}
.hbj-formcard{
  max-width:820px; margin:0 auto clamp(50px,7vw,90px);
  border:1px solid var(--hbj-line); border-radius:var(--hb-radius,22px);
  padding:clamp(22px,3vw,36px); background:var(--hb-sfc);
}

/* ── Footer ── */
.hbj-foot{ border-top:1px solid var(--hbj-line); background:var(--hbj-paper-2) }
.hbj-foot-in{
  max-width:var(--hbj-wrap); margin:0 auto; padding:28px clamp(16px,4vw,40px);
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.hbj-foot-brand{ font-family:var(--hbj-mono); font-size:11.5px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--hbj-mut) }
.hbj-foot-links{ display:flex; gap:18px; flex-wrap:wrap }
.hbj-foot-links a{ color:var(--hbj-mut); text-decoration:none; font-size:13px; font-weight:600 }
.hbj-foot-links a:hover{ color:var(--hbj-ink) }

@media (max-width:860px){
  .hbj-why-grid{ grid-template-columns:1fr; gap:26px }
}
@media (max-width:600px){
  .hbj-item{ grid-template-columns:1fr; gap:14px }
  .hbj-arrow{ display:none }
  .hbj-search{ width:100%; min-width:0 }
  .hbj-stats{ gap:24px }
  .hbj-prose{ font-size:17px }
}