/* ==========================================================================
   KarirLuar.id — Typography & responsive scale (v1.5.2)
   Dimuat SETELAH theme.css. Satu sumber untuk jenis font, ukuran, dan
   line-height di semua perangkat (mobile, tablet, desktop).
   Font: Manrope (judul/angka penting) + DM Sans (isi), dengan fallback sistem.
   ========================================================================== */

:root{
  --kl-font-body:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --kl-font-head:"Manrope","DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;

  /* Skala fluid: minimum nyaman di HP, membesar halus di tablet/desktop */
  --kl-fs-label:11px;                                   /* label huruf besar (eyebrow, kicker) */
  --kl-fs-meta:clamp(12.5px,.78rem + .1vw,13.5px);      /* info sekunder, chip, catatan */
  --kl-fs-body:clamp(14px,.86rem + .15vw,15.5px);       /* teks isi, form, tombol */
  --kl-fs-lead:clamp(15px,.9rem + .4vw,17.5px);         /* subjudul / paragraf pembuka */
  --kl-fs-h4:clamp(16px,.95rem + .35vw,18px);           /* judul kartu */
  --kl-fs-h3:clamp(18px,1rem + .6vw,24px);
  --kl-fs-h2:clamp(24px,1.1rem + 2.4vw,38px);
  --kl-fs-h1:clamp(30px,1rem + 4.6vw,64px);
  --kl-lh-body:1.6;
  --kl-lh-tight:1.25;
}

html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.karirluar-site{font-family:var(--kl-font-body);font-size:var(--kl-fs-body);line-height:var(--kl-lh-body);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
.karirluar-site input,.karirluar-site select,.karirluar-site button,.karirluar-site textarea{font-family:inherit}

/* ---------- Font judul (Manrope) ---------- */
.brand-name,.hero-stat strong,.filter-header strong,.company-avatar,.job-heading h3,.detail-panel h2,
.empty-state h3,.trust-inner h2,.how-inner h2,.how-steps h3,.home-hero-copy h1,.hero-copy-row h1,
.visual-main-card h2,.ribbon-number,.section-intro h2,.section-heading-row h2,.home-how h2,.home-cta h2,
.destination-copy h3,.mini-job-card h3,.home-how-steps h3,.region-card h3,.subscribe-copy h2,
.subscribe-price strong,.subscribe-card h3,.account-intro h1,.account-card h2,.dashboard-head h1,.dash-card h2{
  font-family:var(--kl-font-head);
}
.job-heading h3,.mini-job-card h3,.detail-panel h2,.region-card h3,.destination-copy h3,.subscribe-card h3,
.account-card h2,.dash-card h2,.home-hero-copy h1,.hero-copy-row h1,.section-intro h2,.section-heading-row h2,
.home-how h2,.home-cta h2,.trust-inner h2,.how-inner h2,.subscribe-copy h2,.account-intro h1,.dashboard-head h1{
  text-wrap:balance;overflow-wrap:break-word;
}

/* ---------- Heading besar ---------- */
.home-hero-copy h1,.hero-copy-row h1{font-size:var(--kl-fs-h1);line-height:1.04;letter-spacing:-.035em}
.section-intro h2,.section-heading-row h2,.home-how h2,.home-cta h2,.trust-inner h2,.how-inner h2,
.subscribe-copy h2,.account-intro h1,.dashboard-head h1{font-size:var(--kl-fs-h2);line-height:1.12;letter-spacing:-.03em}
.destination-copy h3,.visual-main-card h2{font-size:var(--kl-fs-h3);line-height:1.15;letter-spacing:-.025em}
.account-card h2,.dash-card h2,.subscribe-card h3{font-size:clamp(18px,1rem + .5vw,22px);line-height:1.2;letter-spacing:-.02em}
.detail-panel h2{font-size:clamp(19px,1rem + .6vw,24px);line-height:1.2;letter-spacing:-.02em}
.region-card h3,.how-steps h3,.home-how-steps h3,.empty-state h3{font-size:var(--kl-fs-h4);line-height:1.25;letter-spacing:-.015em}

/* ---------- Header, navigasi, tombol ---------- */
.brand-name{font-size:clamp(18px,1rem + .3vw,20px);letter-spacing:-.03em}
.brand-caption{font-size:9px;letter-spacing:.12em}
.main-nav a,.find-job-button{font-size:var(--kl-fs-meta);font-weight:600}
.breadcrumb{font-size:var(--kl-fs-meta)}
.primary-button,.light-button,.text-button,.search-submit,.filter-submit,.apply-button,.dash-button,
.subscribe-primary,.subscribe-secondary,.subscribe-form button,.account-form button,.home-search-card button{
  font-size:var(--kl-fs-body);font-weight:700;line-height:1.2;letter-spacing:0}
.access-pill{font-size:var(--kl-fs-meta)}

/* ---------- Label kecil huruf besar ---------- */
.eyebrow,.detail-kicker,.detail-subtitle,.destination-label,.subscribe-step,.subscribe-divider,.dash-kicker,
.visual-kicker,.region-chips-label,.how-steps span,.home-how-steps>div>span,.status-title,.dash-table th{
  font-size:var(--kl-fs-label);letter-spacing:.1em;line-height:1.3}

/* ---------- Hero & beranda ---------- */
.hero-subtitle,.home-hero-subtitle{font-size:var(--kl-fs-lead);line-height:1.65}
.section-intro>p:last-child,.home-how-lead,.account-lead{font-size:var(--kl-fs-body);line-height:1.7}
.hero-stat strong,.ribbon-number{font-size:clamp(20px,1rem + .6vw,26px)}
.hero-stat span,.home-hero-ribbon>div>span:last-child,.home-proof p,.home-proof strong,.visual-main-card p,
.visual-location,.visual-card-bottom span,.floating-note strong,.floating-note small,.visual-live,
.destination-index,.destination-copy p,.region-card p,.trust-points,.how-steps p,.home-how-steps p,
.footer-inner p,.footer-inner>span{font-size:var(--kl-fs-meta);line-height:1.55}
.visual-card-bottom strong{font-size:var(--kl-fs-body)}
.proof-avatars span{font-size:10px}
.trust-points,.how-steps p,.home-how-steps p{font-size:var(--kl-fs-body)}

/* ---------- Pencarian, filter, toolbar ---------- */
.search-panel input,.home-search-card input{font-size:var(--kl-fs-body)}
.home-search-card label,.filter-form label,.sort-select span,.filter-header a,.filter-note{font-size:var(--kl-fs-meta)}
.filter-form label{font-weight:600}
.filter-header strong{font-size:var(--kl-fs-body)}
.filter-form select,.sort-select select{font-size:var(--kl-fs-body)}
.category-tabs a{font-size:var(--kl-fs-body);font-weight:600}
.category-tabs span,.region-chip span{font-size:var(--kl-fs-meta)}
.region-chip{font-size:var(--kl-fs-meta);font-weight:600}
.results-toolbar p{font-size:var(--kl-fs-body)}
.results-toolbar p strong{font-size:var(--kl-fs-h4)}

/* ---------- Kartu lowongan ---------- */
/* v1.6.2: aturan flex .job-card-labels dipindah seluruhnya ke features.css
   (bersama .detail-labels, .mini-job-top) — sebelumnya dideklarasikan dua
   kali dengan nilai identik di sini dan di features.css; tidak ada
   perubahan tampilan, hanya menghapus duplikasi. */
.category-chip,.featured-chip,.soft-tag,.region-tag,.deadline-chip{
  font-size:var(--kl-fs-meta);font-weight:700;line-height:1.2;letter-spacing:0;white-space:nowrap}
.soft-tag{font-weight:500}
.region-tag:empty{display:none}
.deadline-chip{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;background:#F0F4F7;color:#52687A}
.deadline-chip.is-urgent{background:#FFF4D6;color:#8A6100}
.deadline-chip.is-closed{background:#FBE4E4;color:#9A2B2B}
.deadline-chip svg,.mini-job-deadline svg,.detail-deadline svg{display:none!important}

.job-heading h3{font-size:var(--kl-fs-h4);line-height:var(--kl-lh-tight);letter-spacing:-.015em}
.company-avatar{font-size:12px;letter-spacing:0}
.company-line,.detail-company{font-size:var(--kl-fs-meta)}
.location-line,.detail-location{font-size:var(--kl-fs-meta);line-height:1.4;flex-wrap:wrap}
.job-card-footer strong,.detail-salary strong{font-size:var(--kl-fs-body);font-weight:700;font-variant-numeric:tabular-nums}
.job-card-footer span,.detail-salary span{font-size:var(--kl-fs-meta)}
.view-link{font-size:var(--kl-fs-body);font-weight:700}
.empty-state p{font-size:var(--kl-fs-body)}
.empty-state a{font-size:var(--kl-fs-body)}

/* ---------- Kartu beranda ---------- */
.mini-job-card h3{font-size:var(--kl-fs-h4);line-height:var(--kl-lh-tight)}
.mini-job-company,.mini-job-location{font-size:var(--kl-fs-meta)}
.mini-job-company small{font-size:var(--kl-fs-label)}
.mini-job-footer strong{font-size:var(--kl-fs-body);font-variant-numeric:tabular-nums}
.mini-job-footer span{font-size:var(--kl-fs-meta)}
.mini-job-deadline{font-size:var(--kl-fs-meta);font-weight:600}

/* ---------- Panel detail ---------- */
.detail-description,.detail-requirements li,.detail-facts span{font-size:var(--kl-fs-body);line-height:1.65}
.detail-facts small,.detail-region{font-size:var(--kl-fs-label);letter-spacing:.08em}
.detail-deadline span{font-size:var(--kl-fs-meta);line-height:1.6}
.safe-note,.detail-activate,.detail-lock span,.click-limit-banner span{font-size:var(--kl-fs-meta);line-height:1.55}
.detail-lock strong,.click-limit-banner strong{font-size:var(--kl-fs-body)}

/* ---------- Langganan, akun, dashboard ---------- */
.subscribe-price strong{font-size:clamp(24px,1rem + 1vw,30px)}
.subscribe-price span,.subscribe-help,.subscribe-notice,.subscribe-flow li,.account-note,.account-alt,
.account-check,.dash-logout,.dash-empty,.dash-list span,.dash-list time,.status-value{font-size:var(--kl-fs-meta);line-height:1.55}
.subscribe-flow li:before{font-size:var(--kl-fs-label)}
.subscribe-benefits li,.dash-card p,.dash-table td,.dash-list strong{font-size:var(--kl-fs-body);line-height:1.6}
.subscribe-form label,.account-form label{font-size:var(--kl-fs-meta);font-weight:600}
.subscribe-form input,.account-form input[type=text],.account-form input[type=email],
.account-form input[type=password],.account-form input[type=tel]{font-size:var(--kl-fs-body)}
.dash-table td{font-variant-numeric:tabular-nums}

/* ---------- Honeypot anti-scraping: wajib tersembunyi sepenuhnya ---------- */
.kl-trap{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;left:-9999px!important}

/* ---------- HP: cegah auto-zoom iOS pada form & jaga keterbacaan ---------- */
@media(max-width:720px){
  .karirluar-site input:not([type=checkbox]):not([type=radio]),.karirluar-site select,.karirluar-site textarea{font-size:16px!important}
  .job-card-topline{align-items:flex-start;gap:6px}
  .job-heading{gap:12px}
  .job-card-footer{align-items:flex-end}
  .view-link{min-height:44px}
  .icon-button{width:40px;height:40px}
  .main-nav a,.find-job-button,.primary-button,.light-button,.apply-button,.filter-submit,.search-submit{min-height:44px}
  .category-tabs a{min-height:44px}
}

/* ---------- Layar sangat kecil (<= 360px) ---------- */
@media(max-width:360px){
  :root{--kl-fs-h1:29px;--kl-fs-h2:23px}
  .category-chip,.deadline-chip,.region-tag{padding-left:7px;padding-right:7px}
}

/* ---------- Hormati preferensi user ---------- */
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
