/* =============================================================
 * career.css — CAREER (340:4943) SIFIRDAN pixel-perfect.
 * Container 840px kolon. STRICT PX (clamp/--fs-* yok, tasarımın sabit px'iyle birebir).
 * ============================================================= */

/* ---- CAREER ---- */
/* Hero başlık y=111 (üst boşluk 111-40navbar≈71'e denk gelir, container padding ile karşılanır) */
/* Son satır (347:193) bitiş y=574, footer (541:2256) y=1016 → aralık 442px */
.career { padding-block: 71px 442px; }
.career__hero { margin-bottom: 98px; } /* lead(182) → tablo başlığı(339) arası tasarımda 157px */
/* "Be part of our team." (340:5135): Lora SemiBold 56/56, 2. kelime mavi */
.career__title {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 56px;
  line-height: 56px;
  color: var(--c-heading);
  margin: 0 0 18px;
}
.career__title .accent-primary {
  color: var(--c-primary);
}
/* Lead (340:5181): Manrope 18/28, 2. cümle Bold, tek renk #161614 (ikisi de) */
.career__lead {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  color: var(--c-heading);
  margin: 0;
}
.career__lead strong {
  font-weight: 700;
}

/* Tablo başlığı (340:5137): 839px, alt border #5C5C58, Role/Type Manrope 16/24 */
.career__table {
  max-width: 839px;
}
.career__thead {
  display: grid;
  grid-template-columns: 1fr 1fr 43px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--c-body);
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #000;
}
/* Satır (Job Application, 347:179 vd.): 64px yükseklik, alt border #C9C9C9,
   Role/Type Manrope 16/24 #000, sağda 43px PreNext dairesi (ok her zaman görünür — tasarımda opacity yok) */
.career__row {
  display: grid;
  grid-template-columns: 1fr 1fr 43px;
  align-items: center;
  height: 64px;
  border-bottom: 1px solid #c9c9c9;
  text-decoration: none;
  transition: background 150ms ease;
}
.career__row:hover {
  background: var(--c-surface);
}
/* Waitlist ilanlar: detaya tıklanamaz (href yok) — Open/Full tıklanabilir kalır, sadece Waitlist
   engellenir. Hover/ok kaldırıldı, imleç düz, hafif soluk. */
.career__row--disabled {
  cursor: default;
  opacity: 0.6;
}
.career__row--disabled:hover {
  background: none;
}
.career__role,
.career__type {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #000;
}
/* Kontenjan durumu (admin panelden yönetilir: Open/Waitlist/Full) — Figma'nın temel spec'inin
   dışında, kullanıcı isteğiyle eklendi (staj Explore Programs kartlarındaki card_status rozetiyle
   aynı fikir, bu sayfanın kendi düz-metinsel diline uyarlanmış). */
.career__type-cell {
  display: flex;
  align-items: center;
  gap: 10px;
}
.career__status {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 4px 9px;
  border-radius: var(--radius-pill);
}
.career__status--open {
  color: var(--c-primary);
  background: var(--c-primary-50);
}
.career__status--waitlist {
  color: var(--c-secondary);
  background: var(--c-surface);
}
.career__status--full {
  color: var(--c-body);
  background: var(--c-surface);
}
.career__arrow {
  display: grid;
  place-items: center;
  width: 43px;
  height: 43px;
  border-radius: 50%;
  background: var(--c-surface);
  color: var(--c-heading);
  justify-self: end;
  transition: background 150ms ease, transform 150ms ease;
}
/* "Pre&Next" component set (244:332), Direction=Right State=Hover (244:328):
   hover arka planı Secondary/500 MAGENTA (#D6249F) — mavi DEĞİL. get_figma_data ile doğrulandı. */
.career__row:hover .career__arrow {
  background: var(--c-secondary);
  color: #fff;
  transform: translateX(2px);
}

/* ---- JOB DETAIL (343:5183) SIFIRDAN pixel-perfect. STRICT PX (clamp/--fs-* yok). ---- */
.job { padding-block: 71px 442px; }
/* Başlık (343:5229): Lora SemiBold 48/56, 2 satır, "as a X" X'i mavi. lead(343:5230) title'dan 83px sonra */
.job__hero { margin-bottom: 55px; }
.job__title {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 48px;
  line-height: 56px;
  color: var(--c-heading);
  margin: 0 0 28px;
  max-width: 760px;
}
.job__title .accent-primary {
  color: var(--c-primary);
}
/* Lead (343:5230): Manrope 18/28, tek renk #161614, yalnızca "together." Bold */
.job__lead {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  color: var(--c-heading);
  margin: 0;
}
.job__lead strong {
  font-weight: 700;
}

/* Grid: sol x=221 (metin ~375-429px), sağ form x=650 w=409 → gap=650-221-371=58px */
.job__grid {
  display: grid;
  grid-template-columns: 371px 409px;
  gap: 58px;
  align-items: start;
}
/* Blok aralığı: description(382)→Location(644)=262 (description+liste dahil),
   Location→WorkHours(750)=106, WorkHours→Contact(837)=87 */
.job__block {
  margin-bottom: 32px;
}
/* Label (344:5279 "Job Detail", 344:5282 "Location:" vb.): Manrope Medium 14/20, #919191 */
.job__label {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  color: #919191;
  margin: 0 0 8px;
}
/* Açıklama metni (344:5280): Manrope Regular 14/20, #161614, justify */
.job__text {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: var(--c-heading);
  text-align: justify;
  margin: 0;
}
/* Bullet listesi (344:5281): Manrope 14/20, #161614, disc */
.job__list {
  margin: 12px 0 0;
  padding-left: 21px;
  list-style: disc;
}
.job__list li {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: var(--c-heading);
  margin-bottom: 4px;
  text-align: justify;
}
.job__form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 11px;
}

@media (max-width: 860px) {
  .job__grid {
    grid-template-columns: 1fr;
    gap: var(--sp-6);
  }
  .job__form-row {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 520px) {
  .career__thead,
  .career__row {
    grid-template-columns: 1fr auto 43px;
  }
}
