/* ================================================================
   JEWARGI DESIGN SYSTEM (jewargi-ds.css)
   ONE global stylesheet, loaded last. Retunes the palette tokens,
   typography, and every Bootstrap + legacy-skin component to the
   new vibrant orange system so the WHOLE site reads as one product.
   Matches /discover and the reusable business card (.bzc-*).
   ================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800;900&display=swap');

:root{
  /* new brand palette */
  --ds-orange:#FF6B35; --ds-orange-600:#F1571E;
  --ds-green:#22C55E; --ds-blue:#4D8BFF; --ds-purple:#8B5CF6; --ds-pink:#EC4899; --ds-amber:#FFB800; --ds-teal:#14B8A6;
  --ds-ink:#0F1622; --ds-ink-2:#3B4658; --ds-muted:#7A8698; --ds-line:#EDF0F4; --ds-line-2:#E3E8EF;
  --ds-bg:#FFFFFF; --ds-bg-2:#F7F8FB;
  --ds-r-sm:12px; --ds-r:16px; --ds-r-lg:20px;
  --ds-shadow-sm:0 1px 2px rgba(16,22,34,.06),0 1px 3px rgba(16,22,34,.05);
  --ds-shadow:0 8px 24px -10px rgba(16,22,34,.16);
  --ds-shadow-lg:0 20px 48px -18px rgba(16,22,34,.24);
  --ds-grad:linear-gradient(135deg,#FF6B35,#FF9A5A);

  /* ---- override the legacy earthy tokens the whole site references ---- */
  --jw-cream:#FFFFFF; --jw-paper:#FFFFFF; --jw-ink:#0F1622;
  --jw-terra:#FF6B35; --jw-sage:#22C55E; --jw-gold:#FFB800; --jw-line:#EDF0F4;
  --jwx-primary:#FF6B35; --jwx-accent:#FFB800; --jwx-ink:#0F1622;

  /* ---- override Bootstrap tokens ---- */
  --bs-primary:#FF6B35; --bs-primary-rgb:255,107,53;
  --bs-link-color:#F1571E; --bs-link-hover-color:#c9430f;
  --bs-body-font-family:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --bs-body-color:#1c2530; --bs-body-bg:#FFFFFF;
  --bs-border-radius:12px; --bs-border-radius-sm:10px; --bs-border-radius-lg:16px; --bs-border-radius-xl:20px;
  --bs-border-color:#EDF0F4;
}

/* ---------------- typography ---------------- */
body{font-family:var(--bs-body-font-family)!important;color:var(--ds-ink);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.pmh-name{font-family:var(--bs-body-font-family)!important;font-weight:800;letter-spacing:-.02em}
.display-1,.display-2,.display-3,.display-4,.display-5,.display-6{font-weight:900;letter-spacing:-.03em}
.text-muted{color:var(--ds-muted)!important}
a{text-decoration:none}
html:not([data-bs-theme="dark"]) body{background:#FFFFFF!important;color:var(--ds-ink)!important}

/* ---------------- buttons ---------------- */
.btn{border-radius:12px;font-weight:700;padding:.55rem 1.1rem;transition:transform .16s ease,box-shadow .16s ease,background .16s;border-width:1.5px}
.btn:active{transform:translateY(1px)}
.btn-sm{border-radius:10px;padding:.35rem .8rem;font-size:.82rem}
.btn-lg{border-radius:14px;padding:.8rem 1.5rem}
.btn-primary{background:var(--ds-grad);border-color:transparent;color:#fff;box-shadow:0 8px 18px -8px rgba(255,107,53,.6)}
.btn-primary:hover,.btn-primary:focus{background:linear-gradient(135deg,#F1571E,#FF8A3D);border-color:transparent;color:#fff;transform:translateY(-2px);box-shadow:0 12px 24px -8px rgba(255,107,53,.7)}
.btn-success{background:linear-gradient(135deg,#22C55E,#16A34A);border-color:transparent;color:#fff}
.btn-success:hover{filter:brightness(1.05);color:#fff;transform:translateY(-2px)}
.btn-danger{background:linear-gradient(135deg,#EF4444,#DC2626);border-color:transparent}
.btn-warning{background:linear-gradient(135deg,#FFB800,#F59E0B);border-color:transparent;color:#3a2a00}
.btn-info{background:linear-gradient(135deg,#4D8BFF,#38BDF8);border-color:transparent;color:#fff}
.btn-dark{background:var(--ds-ink);border-color:transparent}
.btn-outline-primary{color:var(--ds-orange);border-color:var(--ds-orange)}
.btn-outline-primary:hover{background:var(--ds-orange);border-color:var(--ds-orange);color:#fff}
.btn-outline-secondary{color:var(--ds-ink-2);border-color:var(--ds-line-2);background:#fff}
.btn-outline-secondary:hover{background:var(--ds-bg-2);color:var(--ds-ink);border-color:var(--ds-line-2)}
.btn-outline-success{color:#16A34A;border-color:#22C55E}
.btn-outline-success:hover{background:#22C55E;border-color:#22C55E}
.btn-light{background:var(--ds-bg-2);border-color:var(--ds-line);color:var(--ds-ink)}
.btn-link{color:var(--ds-orange-600);font-weight:700}

/* ---------------- forms ---------------- */
.form-control,.form-select,.input-group-text{border-radius:12px;border:1.5px solid var(--ds-line-2);padding:.6rem .85rem;font-size:.95rem;background:#fff}
.form-control-sm,.form-select-sm{border-radius:10px}
.form-control:focus,.form-select:focus{border-color:var(--ds-orange);box-shadow:0 0 0 .2rem rgba(255,107,53,.16)}
.form-control::placeholder{color:#9aa6b6}
.form-label{font-weight:700;font-size:.85rem;color:var(--ds-ink-2);margin-bottom:.35rem}
.form-check-input:checked{background-color:var(--ds-orange);border-color:var(--ds-orange)}
.form-switch .form-check-input:checked{background-color:var(--ds-green);border-color:var(--ds-green)}
.input-group>.form-control,.input-group>.form-select{border-radius:12px}

/* ---------------- cards ---------------- */
.card{border-radius:16px;border:1px solid var(--ds-line);box-shadow:var(--ds-shadow-sm);transition:transform .2s,box-shadow .2s,border-color .2s;overflow:hidden}
.card.hoverable:hover,.card.jw-card:hover,.card-hover:hover{transform:translateY(-5px);box-shadow:var(--ds-shadow-lg);border-color:transparent}
.card .card-img-top,.card img.card-img-top{object-fit:cover}
.card-title{font-weight:800;letter-spacing:-.01em}
.shadow-sm{box-shadow:var(--ds-shadow-sm)!important}
.shadow{box-shadow:var(--ds-shadow)!important}
.shadow-lg{box-shadow:var(--ds-shadow-lg)!important}
.rounded,.rounded-3{border-radius:14px!important}
.rounded-4{border-radius:18px!important}

/* ---------------- badges & chips ---------------- */
.badge{border-radius:999px;font-weight:800;font-size:.68rem;padding:.4em .7em;letter-spacing:.01em}
.badge.bg-primary{background:var(--ds-orange)!important}
.badge.bg-success{background:var(--ds-green)!important}
.badge.bg-warning{background:var(--ds-amber)!important;color:#3a2a00}
.badge.bg-info{background:var(--ds-blue)!important;color:#fff}
.badge.bg-secondary{background:#64748b!important}
.badge.bg-danger{background:#EF4444!important}
.badge.text-bg-light,.badge.bg-light{background:var(--ds-bg-2)!important;color:var(--ds-ink-2)!important}
.ds-chip{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border-radius:999px;font-size:.78rem;font-weight:700;
  background:var(--ds-bg-2);border:1px solid var(--ds-line);color:var(--ds-ink-2);transition:.15s;text-decoration:none}
.ds-chip:hover{border-color:var(--ds-orange);color:var(--ds-orange)}
.ds-chip.active{background:var(--ds-orange);border-color:var(--ds-orange);color:#fff}

/* ---------------- tables ---------------- */
.table{--bs-table-bg:transparent;border-color:var(--ds-line);vertical-align:middle}
.table>thead th{font-size:.74rem;text-transform:uppercase;letter-spacing:.05em;color:var(--ds-muted);font-weight:800;border-bottom:1.5px solid var(--ds-line-2)}
.table>tbody td{border-color:var(--ds-line);padding:.75rem .6rem}
.table-hover>tbody>tr:hover>*{background:var(--ds-bg-2)}
.table-responsive{border-radius:16px;border:1px solid var(--ds-line);overflow:hidden}

/* ---------------- pagination ---------------- */
.pagination{gap:6px}
.page-link{border-radius:11px!important;border:1px solid var(--ds-line-2);color:var(--ds-ink-2);font-weight:700;padding:.5rem .85rem;margin:0}
.page-link:hover{background:var(--ds-bg-2);color:var(--ds-orange);border-color:var(--ds-line-2)}
.page-item.active .page-link{background:var(--ds-grad);border-color:transparent;color:#fff}
.page-item.disabled .page-link{color:#c3cbd6}

/* ---------------- nav tabs / pills ---------------- */
.nav-tabs{border-bottom:1.5px solid var(--ds-line);gap:4px}
.nav-tabs .nav-link{border:none;border-radius:10px 10px 0 0;color:var(--ds-muted);font-weight:700;padding:.6rem 1rem}
.nav-tabs .nav-link:hover{color:var(--ds-orange);background:var(--ds-bg-2)}
.nav-tabs .nav-link.active{color:var(--ds-orange);background:transparent;border-bottom:2.5px solid var(--ds-orange)}
.nav-pills .nav-link{border-radius:999px;font-weight:700;color:var(--ds-ink-2)}
.nav-pills .nav-link.active{background:var(--ds-grad)}

/* ---------------- dropdown / modal / offcanvas / alert / list-group ---------------- */
.dropdown-menu{border-radius:16px;border:1px solid var(--ds-line);box-shadow:var(--ds-shadow-lg);padding:8px}
.dropdown-item{border-radius:10px;font-weight:600;padding:.5rem .7rem}
.dropdown-item:hover,.dropdown-item.active{background:rgba(255,107,53,.1);color:var(--ds-orange)}
.modal-content{border-radius:20px;border:none;box-shadow:var(--ds-shadow-lg)}
.modal-header,.modal-footer{border-color:var(--ds-line)}
.offcanvas{border:none}
.alert{border-radius:14px;border:1px solid transparent;font-weight:600}
.alert-success{background:#eafaf0;color:#12833f;border-color:#c9f0d8}
.alert-danger{background:#fdecec;color:#c0362f;border-color:#f7cfcf}
.alert-info{background:#eaf2ff;color:#2c5bb8;border-color:#cfe0ff}
.alert-warning{background:#fff6e2;color:#8a6100;border-color:#ffe6ab}
.list-group-item{border-color:var(--ds-line)}
.list-group-item.active{background:var(--ds-orange);border-color:var(--ds-orange)}
.breadcrumb{font-size:.85rem}
.breadcrumb-item.active{color:var(--ds-muted)}
.breadcrumb-item a{color:var(--ds-orange-600);font-weight:600}

/* ---------------- header retune → clean white/glassy, matches the new homepage ---------------- */
.pmh{background:rgba(255,255,255,.86)!important;backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--ds-line)!important}
.pmh--scrolled{box-shadow:0 6px 22px -16px rgba(16,22,34,.5)!important}
.pmh-logo{background:var(--ds-grad)!important;color:#fff!important;border-radius:13px;font-family:var(--bs-body-font-family)!important;font-weight:900!important;box-shadow:0 6px 14px -4px rgba(255,107,53,.5)}
.pmh-name{font-family:var(--bs-body-font-family)!important;font-weight:900!important;color:var(--ds-ink)!important}
.pmh-tag{color:var(--ds-orange)!important;letter-spacing:.16em!important}
.pmh-link{font-weight:600!important;color:var(--ds-ink-2)!important;font-size:14px!important;border-radius:11px!important}
.pmh-link:hover,.pmh-link.show{color:var(--ds-orange)!important;background:rgba(255,107,53,.09)!important}
.pmh-icon{color:var(--ds-ink-2)!important;border-radius:12px!important}
.pmh-icon:hover{background:var(--ds-bg-2)!important;color:var(--ds-orange)!important}
.pmh-ghost{color:var(--ds-ink)!important;font-weight:700!important;border-radius:12px!important}
.pmh-ghost:hover{background:var(--ds-bg-2)!important;color:var(--ds-orange)!important}
.pmh-cta{background:var(--ds-grad)!important;border-radius:12px!important;font-weight:800!important;box-shadow:0 8px 18px -8px rgba(255,107,53,.5)}
.pmh-cta:hover{transform:translateY(-2px)}
.pmh-badge{background:var(--ds-orange)!important}
.pmh-badge.is-alert{background:#EF4444!important}
[data-bs-theme="dark"] .pmh{background:rgba(15,18,22,.9)!important;border-bottom-color:#242833!important}
/* the whole inner-page body should be crisp white, not cream */
html:not([data-bs-theme="dark"]) body{background:#FFFFFF!important}

/* ---------------- wider container (less dead space on desktop) ---------------- */
@media(min-width:1200px){.container{max-width:1320px}}

/* ---------------- mobile bottom nav (inner pages) ---------------- */
.gz-tabbar{display:none!important}   /* retire the old cream tab bar — the new one below replaces it */
.ds-bottomnav{display:none}
@media(max-width:860px){
  body{padding-bottom:66px}
  .pmh-burger{display:grid!important}
  .ds-bottomnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:1040;height:64px;
    background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-top:1px solid var(--ds-line);
    padding:6px 6px calc(6px + env(safe-area-inset-bottom))}
  .ds-bottomnav a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    font-size:10.5px;font-weight:700;color:var(--ds-muted);text-decoration:none;min-height:44px}
  .ds-bottomnav a.active{color:var(--ds-orange)}
  .ds-bottomnav a i{font-size:20px}
  .ds-bottomnav .fab{width:48px;height:48px;border-radius:16px;background:var(--ds-grad);color:#fff!important;
    display:grid;place-items:center;margin-top:-22px;box-shadow:0 8px 18px -6px rgba(255,107,53,.6)}
  .ds-bottomnav .fab i{font-size:24px}
  [data-bs-theme="dark"] .ds-bottomnav{background:rgba(15,18,22,.94);border-top-color:#242833}
}

/* ---------------- footer retune ---------------- */
footer,.site-footer,.footer{background:#0F1622}
footer a:hover{color:#fff}

/* ---------------- section helpers (reusable) ---------------- */
.ds-section{padding:34px 0}
.ds-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.ds-head h2,.ds-head .h2{font-size:1.4rem;font-weight:800;letter-spacing:-.02em;margin:0}
.ds-eyebrow{display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ds-orange);margin-bottom:2px}
.ds-viewall{color:var(--ds-orange);font-weight:700;font-size:.85rem;white-space:nowrap}
.ds-viewall:hover{color:var(--ds-orange-600)}

/* ---------------- reusable grid (5→2) shared by all listing partials ---------------- */
.ds-grid{display:flex;flex-wrap:wrap;margin:0 -7px}
.row:has(.ds-col){--bs-gutter-x:0;--bs-gutter-y:0;margin-left:-7px;margin-right:-7px}
.ds-col{flex:0 0 20%;max-width:20%;padding:7px;box-sizing:border-box}
@media(max-width:1199.98px){.ds-col{flex-basis:25%;max-width:25%}}
@media(max-width:991.98px){.ds-col{flex-basis:33.3333%;max-width:33.3333%}}
@media(max-width:767.98px){.ds-col{flex-basis:50%;max-width:50%}}
.ds-col-3{flex:0 0 33.3333%;max-width:33.3333%;padding:7px;box-sizing:border-box}
@media(max-width:991.98px){.ds-col-3{flex-basis:50%;max-width:50%}}
@media(max-width:575.98px){.ds-col-3{flex-basis:100%;max-width:100%}}

/* ---------------- reusable list card (jobs / property / generic) ---------------- */
.ds-card{background:#fff;border:1px solid var(--ds-line);border-radius:16px;overflow:hidden;transition:transform .2s,box-shadow .2s,border-color .2s;height:100%;display:flex;flex-direction:column}
.ds-card:hover{transform:translateY(-5px);box-shadow:var(--ds-shadow-lg);border-color:transparent}
.ds-card-pad{padding:15px}
.ds-money{font-weight:900;color:#16A34A}
.ds-logo{width:46px;height:46px;border-radius:12px;object-fit:cover;background:var(--ds-bg-2);display:grid;place-items:center;font-weight:900;color:var(--ds-orange);flex:none}
.ds-cover{aspect-ratio:16/10;background:var(--ds-bg-2);overflow:hidden;position:relative}
.ds-cover img{width:100%;height:100%;object-fit:cover;transition:transform .45s}
.ds-card:hover .ds-cover img{transform:scale(1.06)}
.ds-icobtn{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--ds-bg-2);color:#5B6675;transition:.15s;flex:none}
.ds-icobtn:hover{color:#fff;background:var(--ds-orange);transform:translateY(-2px)}

/* ---------------- empty / skeleton ---------------- */
.ds-empty{border:1.5px dashed var(--ds-line-2);border-radius:20px;padding:34px;text-align:center;background:var(--ds-bg-2)}
.ds-empty .ic{font-size:2.2rem;margin-bottom:6px}
@keyframes dsShim{100%{transform:translateX(100%)}}
.ds-skel{position:relative;overflow:hidden;background:var(--ds-line);border-radius:10px}
.ds-skel::after{content:'';position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);animation:dsShim 1.3s infinite}

/* reveal animation */
.ds-reveal{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s}
.ds-reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.ds-reveal{opacity:1;transform:none;transition:none}.ds-card,.card{transition:none}}

/* dark mode keeps surfaces sensible */
[data-bs-theme="dark"]{--ds-bg:#0F1216;--ds-bg-2:#171A21;--ds-ink:#E9ECF1;--ds-line:#242833;--ds-line-2:#2c313d}
[data-bs-theme="dark"] .ds-card,[data-bs-theme="dark"] .card{background:#171A21;border-color:#242833}
[data-bs-theme="dark"] body{background:#0F1216!important;color:#E9ECF1!important}

/* ===================== Unified mobile drawer (inner pages) ===================== */
html,body{overflow-x:hidden;max-width:100%}
.pmh-overlay{position:fixed;inset:0;background:rgba(8,10,16,.5);backdrop-filter:blur(2px);z-index:1049;opacity:0;visibility:hidden;transition:opacity .28s}
.pmh-overlay.on{opacity:1;visibility:visible}
.pmh-drawer{position:fixed;top:0;right:0;bottom:0;width:min(340px,86vw);background:#fff;z-index:1050;transform:translateX(100%);
  transition:transform .32s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column;box-shadow:-18px 0 50px -20px rgba(0,0,0,.4);border:none!important;max-height:100vh!important}
.pmh-drawer.on{transform:translateX(0)}
.pmh-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:15px 16px;border-bottom:1px solid var(--ds-line);flex:none}
.pmh-drawer-brand{display:flex;align-items:center;gap:9px;font-weight:900;font-size:17px;color:var(--ds-ink)}
.pmh-drawer-x{width:38px;height:38px;border-radius:11px;background:var(--ds-bg-2);border:none;font-size:22px;line-height:1;color:var(--ds-ink-2);display:grid;place-items:center}
.pmh-drawer-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:14px 12px 26px}
.pmh-drawer-search{display:flex;align-items:center;gap:9px;background:var(--ds-bg-2);border-radius:13px;padding:11px 14px;margin-bottom:12px}
.pmh-drawer-search i{color:var(--ds-muted)}
.pmh-drawer-search input{border:none;background:transparent;outline:none;font:inherit;width:100%;font-size:15px;color:var(--ds-ink)}
.pmh-drawer-user{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;background:var(--ds-bg-2);margin-bottom:12px;text-decoration:none;color:inherit}
.pmh-drawer-user .av{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#4D8BFF,#8B5CF6);color:#fff;display:grid;place-items:center;font-weight:800;font-size:18px;flex:none}
.pmh-drawer-user b{display:block;font-size:15px}.pmh-drawer-user small{color:var(--ds-muted)}
.pmh-m-cta{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--ds-grad);color:#fff!important;padding:12px;border-radius:13px;font-weight:800;text-decoration:none;margin-bottom:12px}
.pmh-drawer .pmh-m-link{display:flex!important;align-items:center;gap:13px;padding:12px;border-radius:12px;color:var(--ds-ink);text-decoration:none;font-weight:600;font-size:15px;min-height:48px;background:none;border:none;width:100%;text-align:left}
.pmh-drawer .pmh-m-link:hover,.pmh-drawer .pmh-m-link:active{background:rgba(255,107,53,.09);color:var(--ds-orange)}
.pmh-drawer .pmh-m-link i{width:22px;text-align:center;color:var(--ds-muted)}
.pmh-drawer .pmh-m-link:hover i{color:var(--ds-orange)}
.pmh-drawer .pmh-m-sec{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ds-muted);margin:14px 8px 4px}
body.pmh-noscroll{overflow:hidden}