/* =====================================================================
   BX3 KARIR — judul + kalimat di tengah, tombol saring, daftar lowongan bergaris tipis (akordeon)
   Tanpa JS: semua lowongan terbuka dan tombol saring disembunyikan.
   ===================================================================== */

.bx3.bx3-careers{display:block;background:var(--bx3-white)}
.bx3 .bx3-car__in{max-width:calc(1040px + var(--bx3-pad-x) * 2);margin:0 auto;padding:clamp(64px,6.6vw,124px) var(--bx3-pad-x) clamp(80px,8vw,150px);scroll-margin-top:var(--bx3-nav-h)}
.bx3 .bx3-car__intro{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:clamp(36px,4vw,64px)}
.bx3 .bx3-car__intro .bx3-text{max-width:34em}
.bx3 .bx3-car__filters{margin-bottom:clamp(24px,2.6vw,40px)}
.bx3 .bx3-car__count{margin-bottom:14px;font-size:var(--bx3-fs-xs);line-height:1.4;letter-spacing:.06em;text-transform:uppercase;text-align:right;color:var(--bx3-ink-soft)}

/* Baris lowongan */
.bx3 .bx3-jobs{border-top:1px solid var(--bx3-line)}
.bx3 .bx3-job{border-bottom:1px solid var(--bx3-line)}
.bx3 .bx3-job[hidden]{display:none!important}
/* white-space & user-select: tema (Hello Elementor) membuat teks <button> satu baris dan tidak bisa dipilih */
.bx3 button.bx3-job__head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:20px;width:100%;padding:clamp(22px,2.4vw,34px) 0;text-align:left;white-space:normal;-webkit-user-select:text;user-select:text;color:var(--bx3-ink);line-height:1.4}
.bx3 .bx3-job__text{display:block;min-width:0}
.bx3 .bx3-job__title{display:block;overflow-wrap:break-word;font-size:clamp(1.2rem,1.56vw,1.5rem);font-weight:400;line-height:1.4;color:var(--bx3-ink);transition:color var(--bx3-t) var(--bx3-ease)}
.bx3 .bx3-job__meta{display:flex;flex-wrap:wrap;gap:.6em;margin-top:8px;font-size:var(--bx3-fs-xs);line-height:1.4;letter-spacing:.06em;text-transform:uppercase;color:var(--bx3-ink-soft)}
.bx3 .bx3-job__icon{position:relative;display:block;width:40px;height:40px;border:1px solid var(--bx3-line-btn);border-radius:50%;color:var(--bx3-ink);transition:background-color var(--bx3-t) var(--bx3-ease),color var(--bx3-t) var(--bx3-ease),border-color var(--bx3-t) var(--bx3-ease)}
.bx3 .bx3-job__icon::before,.bx3 .bx3-job__icon::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;margin:-.75px 0 0 -6px;background:currentColor;transition:transform var(--bx3-t) var(--bx3-ease)}
.bx3 .bx3-job__icon::after{transform:rotate(90deg)}
.bx3 button.bx3-job__head:is(:hover,:focus-visible) .bx3-job__title{color:var(--bx3-orange)}
.bx3 button.bx3-job__head:is(:hover,:focus-visible) .bx3-job__icon{background:var(--bx3-choc);border-color:var(--bx3-choc);color:var(--bx3-white)}
.bx3 .bx3-job.is-open .bx3-job__icon::after{transform:rotate(0deg)}

/* Isi: tinggi 0 → otomatis (animasi grid-template-rows). Tanpa JS semua terbuka. */
.bx3 .bx3-job__panel{display:grid;grid-template-rows:1fr;transition:grid-template-rows .45s var(--bx3-ease)}
.bx3.bx3-careers.is-js .bx3-job:not(.is-open) .bx3-job__panel{grid-template-rows:0fr}
.bx3.bx3-careers.is-init .bx3-job__panel{transition:none}
.bx3.bx3-careers:not(.is-js) .bx3-job__icon{visibility:hidden}
.bx3 .bx3-job__inner{min-height:0;overflow:hidden}
.bx3 .bx3-job__body{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);row-gap:24px;padding:0 0 clamp(28px,3vw,44px)}
.bx3 .bx3-job__col--desc{grid-column:1/7}
.bx3 .bx3-job__col--req{grid-column:7/13}
.bx3 .bx3-job__label{margin-bottom:10px;font-size:var(--bx3-fs-xs);line-height:1.4;letter-spacing:.06em;text-transform:uppercase;color:var(--bx3-ink)}
.bx3 .bx3-job__list>li{position:relative;padding-left:16px;margin-bottom:6px;font-size:var(--bx3-fs-body);line-height:1.6;color:var(--bx3-ink-soft);overflow-wrap:break-word}
.bx3 .bx3-job__list>li:last-child{margin-bottom:0}
.bx3 .bx3-job__list>li::before{content:"";position:absolute;left:0;top:.75em;width:5px;height:5px;border-radius:50%;background:var(--bx3-orange)}
.bx3 .bx3-job__act{grid-column:1/-1}
.bx3 .bx3-job__act a.bx3-btn[href]{margin-top:4px}

.bx3 .bx3-car__empty{padding:clamp(32px,4vw,64px) 0;border-top:1px solid var(--bx3-line);border-bottom:1px solid var(--bx3-line);text-align:center;color:var(--bx3-ink-soft)}

@media (max-width:767px){
  .bx3 .bx3-car__intro{align-items:flex-start;text-align:left}
  .bx3 .bx3-car__count{text-align:left}
  .bx3 .bx3-job__col--desc,.bx3 .bx3-job__col--req{grid-column:1/-1}
  .bx3 .bx3-job__icon{width:36px;height:36px}
}
@media (prefers-reduced-motion:reduce){
  .bx3 .bx3-job__panel,.bx3 .bx3-job__icon::before,.bx3 .bx3-job__icon::after{transition:none}
}