/* JobPilot marketing surface — homepage, pricing, future sector landing pages.
   Every value here comes from tokens.css. No magic numbers. */

/* ─── Hero ──────────────────────────────────────────────────────────────── */

.jp-hero{
    padding:var(--jp-space-10) 0 var(--jp-space-11);
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:var(--jp-space-9);
    align-items:center;
}
.jp-hero__copy{display:flex;flex-direction:column;gap:var(--jp-space-6)}
.jp-hero__title{
    font-size:var(--jp-text-5xl);
    line-height:var(--jp-leading-tight);
    letter-spacing:var(--jp-tracking-tight);
    font-weight:900;
    max-width:14ch;
}
.jp-hero__title em{
    font-style:normal;
    background:linear-gradient(110deg,var(--jp-accent) 0%,#B89A38 60%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}
.jp-hero__lede{
    color:var(--ui-ink-2);
    font-size:var(--jp-text-lg);
    line-height:var(--jp-leading-body);
    font-weight:550;
    max-width:54ch;
}
.jp-hero__actions{
    display:flex;
    gap:var(--jp-space-3);
    flex-wrap:wrap;
}
.jp-hero__proof{
    display:flex;
    gap:var(--jp-space-6);
    flex-wrap:wrap;
    color:var(--jp-muted);
    font-size:var(--jp-text-sm);
    font-weight:700;
    margin-top:var(--jp-space-2);
}
.jp-hero__proof span{display:inline-flex;align-items:center;gap:var(--jp-space-2)}
.jp-hero__proof span::before{
    content:'';width:6px;height:6px;border-radius:50%;
    background:var(--jp-success);
    box-shadow:0 0 0 4px var(--jp-success-wash);
}

/* Hero product mock — a visual demo card. */
.jp-hero__mock{position:relative}
.jp-hero__mock::before{
    content:'';
    position:absolute;
    inset:-22px;
    border-radius:calc(var(--jp-radius-xl) + 12px);
    background:linear-gradient(145deg,rgba(231,199,90,.34),rgba(255,255,255,.25));
    transform:rotate(-2deg);
    z-index:0;
}
.jp-mock-card{
    position:relative;
    z-index:1;
    background:var(--jp-panel-soft);
    border:1px solid var(--jp-line);
    border-radius:var(--jp-radius-xl);
    padding:var(--jp-space-6);
    box-shadow:var(--jp-shadow-lg);
    backdrop-filter:blur(18px);
    display:flex;
    flex-direction:column;
    gap:var(--jp-space-4);
}
.jp-mock-card__top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    color:var(--jp-muted);
    font-size:var(--jp-text-sm);
    font-weight:800;
}
.jp-mock-role{
    display:flex;
    justify-content:space-between;
    gap:var(--jp-space-4);
    align-items:flex-start;
    padding:var(--jp-space-6);
    border-radius:var(--jp-radius-lg);
    background:linear-gradient(145deg,#24231F,#111);
    color:#fff;
    text-decoration:none;
}
.jp-mock-role--linked{
    transition:transform var(--jp-duration-base) var(--jp-ease),
               box-shadow var(--jp-duration-base) var(--jp-ease);
    cursor:pointer;
}
.jp-mock-role--linked:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 50px rgba(0,0,0,.35);
}
.jp-mock-card__deeplink{
    display:inline-flex;
    align-items:center;
    gap:var(--jp-space-2);
    align-self:flex-start;
    padding:var(--jp-space-2) var(--jp-space-3);
    color:var(--jp-accent-ink);
    font-weight:900;
    font-size:var(--jp-text-sm);
    border-radius:var(--jp-radius-md);
    transition:background var(--jp-duration-base) var(--jp-ease);
}
.jp-mock-card__deeplink:hover{background:var(--jp-accent-wash)}
.jp-mock-role small{
    color:rgba(255,255,255,.58);
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:var(--jp-tracking-eyebrow);
    font-size:var(--jp-text-xs);
}
.jp-mock-role h3{
    font-size:var(--jp-text-2xl);
    line-height:1;
    margin-top:var(--jp-space-2);
    letter-spacing:var(--jp-tracking-snug);
}
.jp-mock-role p{color:rgba(255,255,255,.64);font-weight:600;margin-top:var(--jp-space-2)}
.jp-mock-role__score{
    background:var(--jp-accent);
    color:var(--ui-on-gold);
    padding:var(--jp-space-3);
    border-radius:var(--jp-radius-sm);
    font-size:var(--jp-text-lg);
    font-weight:900;
}
.jp-mock-stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:var(--jp-space-3);
}
.jp-mock-stat{
    background:var(--jp-canvas-3);
    border:1px solid var(--jp-line);
    border-radius:var(--jp-radius-md);
    padding:var(--jp-space-4);
}
.jp-mock-stat span{
    display:block;
    color:var(--jp-muted);
    font-size:var(--jp-text-xs);
    font-weight:750;
}
.jp-mock-stat strong{
    display:block;
    font-size:var(--jp-text-2xl);
    letter-spacing:var(--jp-tracking-snug);
    margin-top:var(--jp-space-1);
}
.jp-mock-row{
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:var(--jp-space-3);
    padding:var(--jp-space-3) var(--jp-space-4);
    background:var(--jp-panel);
    border:1px solid var(--jp-line);
    border-radius:var(--jp-radius-md);
}
.jp-mock-row__avatar{
    width:42px;height:42px;
    border-radius:var(--jp-radius-sm);
    background:linear-gradient(135deg,var(--jp-charcoal),#444039);
}
.jp-mock-row__avatar--muted{background:linear-gradient(135deg,#6E695F,#B8AD94)}
.jp-mock-row h4{font-size:var(--jp-text-base);letter-spacing:-.02em}
.jp-mock-row p{color:var(--jp-muted);font-size:var(--jp-text-sm);font-weight:600;margin-top:2px}
.jp-mock-row__score{
    font-size:var(--jp-text-md);
    font-weight:900;
    color:var(--jp-accent-ink);
}

@media(max-width:1060px){
    .jp-hero{grid-template-columns:1fr;padding-top:var(--jp-space-8)}
    .jp-hero__title{max-width:none}
}

/* ─── Trust strip ───────────────────────────────────────────────────────── */

.jp-trust-strip{
    margin-top:var(--jp-space-9);
    padding:var(--jp-space-6) var(--jp-space-7);
    background:var(--jp-panel-soft);
    border:1px solid var(--jp-line);
    border-radius:var(--jp-radius-xl);
    display:flex;
    align-items:center;
    gap:var(--jp-space-7);
    flex-wrap:wrap;
    justify-content:space-between;
}
.jp-trust-strip__label{
    color:var(--jp-muted);
    font-weight:850;
    text-transform:uppercase;
    letter-spacing:var(--jp-tracking-eyebrow);
    font-size:var(--jp-text-xs);
}
.jp-trust-strip__items{
    display:flex;
    gap:var(--jp-space-7);
    flex-wrap:wrap;
    color:var(--jp-ink-soft);
    font-weight:850;
    font-size:var(--jp-text-base);
}

/* ─── Shared marketing type ─────────────────────────────────────────────
   Section eyebrows on marketing blocks are a quiet text label (matching the
   hero kicker) rather than a pill. App pages keep the pill eyebrow. */

.jp-home .jp-eyebrow,
.jp-compare .jp-eyebrow,
.jp-cta .jp-eyebrow{
    padding:0;
    border:0;
    background:none;
    border-radius:0;
    color:var(--jp-muted);
    font-weight:600;
    letter-spacing:.14em;
    gap:10px;
}
.jp-home .jp-eyebrow::before,
.jp-compare .jp-eyebrow::before,
.jp-cta .jp-eyebrow::before{
    width:18px;
    height:1px;
    border-radius:0;
    background:var(--jp-accent-ink);
    opacity:.6;
}
.jp-compare .jp-eyebrow,
.jp-cta .jp-eyebrow{color:rgba(255,255,255,.6)}
.jp-compare .jp-eyebrow::before,
.jp-cta .jp-eyebrow::before{background:var(--jp-accent);opacity:.8}

.jp-section-head h2,
.jp-compare__intro h2,
.jp-cta__heading{
    font-size:clamp(32px,3.4vw,50px);
    line-height:1.05;
    letter-spacing:-.04em;
    font-weight:600;
}
.jp-section-head p{font-weight:400}

/* ─── Agency-comparison block ───────────────────────────────────────────── */

.jp-compare{
    margin-top:var(--jp-space-11);
    padding:var(--jp-space-10) var(--jp-space-9);
    background:var(--jp-charcoal);
    color:#fff;
    border-radius:var(--jp-radius-lg);
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:var(--jp-space-9);
    align-items:center;
}
.jp-compare__intro h2{margin-top:var(--jp-space-4)}
.jp-compare__intro p{
    color:rgba(255,255,255,.66);
    font-size:var(--jp-text-md);
    line-height:var(--jp-leading-body);
    margin-top:var(--jp-space-4);
    max-width:46ch;
}
.jp-compare__panes{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:var(--jp-space-3);
}
.jp-compare-pane{
    background:transparent;
    border:1px solid rgba(255,255,255,.12);
    border-radius:var(--jp-radius-md);
    padding:var(--jp-space-6);
    display:flex;
    flex-direction:column;
    gap:var(--jp-space-5);
}
.jp-compare-pane--win{
    background:var(--jp-panel);
    color:var(--jp-ink);
    border-color:transparent;
    box-shadow:0 30px 60px -20px rgba(0,0,0,.5);
}
.jp-compare-pane__label{
    font-size:var(--jp-text-xs);
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:.12em;
    color:rgba(255,255,255,.55);
}
.jp-compare-pane--win .jp-compare-pane__label{color:var(--jp-muted)}
.jp-compare-pane__amount{display:flex;flex-direction:column;gap:var(--jp-space-2)}
.jp-compare-pane__price{
    font-family:var(--jp-font-display);
    font-size:clamp(36px,3.6vw,52px);
    line-height:1;
    font-weight:600;
    letter-spacing:-.04em;
    font-variant-numeric:tabular-nums;
}
.jp-compare-pane__caption{
    font-size:var(--jp-text-sm);
    font-weight:500;
    color:rgba(255,255,255,.5);
}
.jp-compare-pane--win .jp-compare-pane__caption{color:var(--jp-muted)}
.jp-compare-pane ul{
    list-style:none;
    display:grid;
    gap:var(--jp-space-3);
    padding-top:var(--jp-space-5);
    border-top:1px solid rgba(255,255,255,.1);
}
.jp-compare-pane--win ul{border-top-color:var(--jp-line)}
.jp-compare-pane li{
    display:flex;
    gap:var(--jp-space-3);
    align-items:flex-start;
    font-size:var(--jp-text-base);
    font-weight:400;
    line-height:1.45;
    color:rgba(255,255,255,.72);
}
.jp-compare-pane--win li{color:var(--jp-ink-soft);font-weight:500}
.jp-compare-pane li::before{
    content:'';
    margin-top:10px;
    flex-shrink:0;
    width:8px;height:1px;
    background:rgba(255,255,255,.4);
}
.jp-compare-pane--win li::before{
    content:'✓';
    margin-top:0;
    width:auto;height:auto;
    background:none;
    color:var(--jp-success);
    font-weight:700;
}
@media(max-width:1060px){
    .jp-compare{grid-template-columns:1fr;gap:var(--jp-space-7);padding:var(--jp-space-8) var(--jp-space-6)}
}
@media(max-width:680px){
    .jp-compare__panes{grid-template-columns:1fr}
}

/* ─── How-it-works steps ────────────────────────────────────────────────── */

.jp-steps{
    margin-top:var(--jp-space-11);
    /* Horizontal padding aligns this section's content with the hero
       above and the nav brand at the top of the page. */
    padding-inline:var(--jp-space-5);
}
/* Numbered columns divided by hairlines — no cards, no badges. */
.jp-steps__grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:var(--jp-space-7);
}
.jp-step{
    padding-top:var(--jp-space-5);
    border-top:1px solid var(--jp-line-strong);
    display:flex;
    flex-direction:column;
    gap:var(--jp-space-3);
}
.jp-step__num{
    font-family:var(--jp-font-display);
    font-size:var(--jp-text-sm);
    font-weight:500;
    color:var(--jp-muted);
    font-variant-numeric:tabular-nums;
    letter-spacing:.04em;
}
.jp-step h3{
    font-size:var(--jp-text-lg);
    font-weight:600;
    letter-spacing:-.02em;
    line-height:var(--jp-leading-snug);
}
.jp-step p{
    color:var(--jp-muted);
    line-height:var(--jp-leading-body);
    font-weight:400;
    font-size:var(--jp-text-base);
}
@media(max-width:1060px){.jp-steps__grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.jp-steps__grid{grid-template-columns:1fr;gap:var(--jp-space-6)}}

/* ─── Feature grid ──────────────────────────────────────────────────────── */

.jp-features{margin-top:var(--jp-space-11);padding-inline:var(--jp-space-5)}
/* One bordered panel split into cells by 1px gaps over the line colour. */
.jp-features__grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:1px;
    background:var(--jp-line);
    border:1px solid var(--jp-line);
    border-radius:var(--jp-radius-lg);
    overflow:hidden;
}
.jp-feature{
    background:var(--jp-panel);
    padding:var(--jp-space-8);
    display:grid;
    grid-template-columns:auto 1fr;
    gap:var(--jp-space-5);
    align-items:flex-start;
    transition:background var(--jp-duration-base) var(--jp-ease);
}
.jp-feature:hover{background:var(--jp-canvas-3)}
.jp-feature__icon{
    width:44px;height:44px;
    border-radius:var(--jp-radius-sm);
    background:var(--jp-canvas);
    border:1px solid var(--jp-line);
    color:var(--jp-ink);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:600;
    font-size:var(--jp-text-base);
}
.jp-feature h3{
    font-size:var(--jp-text-lg);
    font-weight:600;
    letter-spacing:-.02em;
    line-height:var(--jp-leading-snug);
}
.jp-feature p{
    color:var(--jp-muted);
    line-height:var(--jp-leading-body);
    font-weight:400;
    font-size:var(--jp-text-base);
    margin-top:var(--jp-space-2);
}
.jp-feature__tag{
    display:inline-flex;
    margin-top:var(--jp-space-4);
    color:var(--jp-accent-ink);
    font-size:var(--jp-text-xs);
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:.1em;
}
@media(max-width:860px){.jp-features__grid{grid-template-columns:1fr}}
@media(max-width:620px){.jp-feature{padding:var(--jp-space-6)}}

/* ─── Final CTA block ───────────────────────────────────────────────────── */

.jp-cta{
    margin-top:var(--jp-space-11);
    margin-bottom:var(--jp-space-11);
    padding:var(--jp-space-10) var(--jp-space-9);
    background:var(--jp-charcoal);
    color:#fff;
    border-radius:var(--jp-radius-lg);
    display:grid;
    grid-template-columns:1.2fr .8fr;
    gap:var(--jp-space-7);
    align-items:center;
    position:relative;
    overflow:hidden;
}
/* A faint warm light from the top-right corner, not a yellow blob. */
.jp-cta::after{
    content:'';
    position:absolute;
    width:560px;height:560px;border-radius:50%;
    background:radial-gradient(circle,rgba(231,199,90,.12),transparent 65%);
    right:-200px;top:-260px;
    pointer-events:none;
}
.jp-cta__copy{position:relative;z-index:1;display:flex;flex-direction:column;gap:var(--jp-space-4)}
.jp-cta__copy p{
    color:rgba(255,255,255,.66);
    font-size:var(--jp-text-md);
    line-height:var(--jp-leading-body);
    max-width:52ch;
}
.jp-cta__actions{
    position:relative;z-index:1;
    display:flex;
    gap:var(--jp-space-3);
    flex-wrap:wrap;
    justify-content:flex-end;
}
@media(max-width:860px){
    .jp-cta{grid-template-columns:1fr;padding:var(--jp-space-8) var(--jp-space-6)}
    .jp-cta__actions{justify-content:flex-start}
}
@media(max-width:680px){
    .jp-cta__actions .ui-btn{flex:1 1 100%}
}

/* ─── Pricing page ──────────────────────────────────────────────────────── */

.jp-pricing-shell{padding:var(--jp-space-10) 0 var(--jp-space-11)}

.jp-pricing-hero{
    text-align:center;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:var(--jp-space-5);
    margin-bottom:var(--jp-space-9);
}
.jp-pricing-hero h1{
    font-size:var(--jp-text-4xl);
    line-height:var(--jp-leading-tight);
    letter-spacing:var(--jp-tracking-tight);
    font-weight:900;
    max-width:18ch;
}
.jp-pricing-hero p{
    color:var(--jp-muted);
    font-size:var(--jp-text-lg);
    line-height:var(--jp-leading-body);
    max-width:60ch;
    font-weight:550;
}

.jp-pricing-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:var(--jp-space-5);
}
.jp-price-card{
    background:var(--jp-panel-soft);
    border:1px solid var(--jp-line);
    border-radius:var(--jp-radius-xl);
    padding:var(--jp-space-7);
    display:flex;
    flex-direction:column;
    gap:var(--jp-space-5);
    box-shadow:var(--jp-shadow-sm);
    transition:transform var(--jp-duration-base) var(--jp-ease),
               box-shadow var(--jp-duration-base) var(--jp-ease);
}
.jp-price-card:hover{transform:translateY(-4px);box-shadow:var(--jp-shadow-md)}
.jp-price-card--featured{
    background:linear-gradient(145deg,#24231F,#111);
    color:#fff;
    border-color:transparent;
    transform:translateY(-12px);
    box-shadow:var(--jp-shadow-lg);
}
.jp-price-card--featured:hover{transform:translateY(-16px)}
.jp-price-card__head{display:flex;flex-direction:column;gap:var(--jp-space-2)}
.jp-price-card__name{
    font-size:var(--jp-text-xl);
    letter-spacing:var(--jp-tracking-snug);
    font-weight:900;
}
.jp-price-card__tagline{
    color:var(--jp-muted);
    font-size:var(--jp-text-base);
    line-height:var(--jp-leading-body);
    font-weight:550;
}
.jp-price-card--featured .jp-price-card__tagline{color:rgba(255,255,255,.68)}
.jp-price-card__amount{
    display:flex;
    align-items:baseline;
    gap:var(--jp-space-2);
}
.jp-price-card__amount strong{
    font-size:var(--jp-text-4xl);
    line-height:1;
    letter-spacing:var(--jp-tracking-tight);
    font-weight:900;
}
.jp-price-card__amount span{
    color:var(--jp-muted);
    font-weight:700;
    font-size:var(--jp-text-base);
}
.jp-price-card--featured .jp-price-card__amount span{color:rgba(255,255,255,.6)}

.jp-price-card__list{list-style:none;display:grid;gap:var(--jp-space-3)}
.jp-price-card__list li{
    display:flex;
    gap:var(--jp-space-2);
    align-items:flex-start;
    font-weight:600;
    line-height:var(--jp-leading-body);
    font-size:var(--jp-text-base);
}
.jp-price-card__list li::before{
    content:'✓';
    color:var(--jp-accent-ink);
    font-weight:900;
}
.jp-price-card--featured .jp-price-card__list li::before{color:var(--jp-accent)}

.jp-price-card__compare{
    padding:var(--jp-space-4);
    border-radius:var(--jp-radius-md);
    background:var(--jp-canvas-3);
    color:var(--jp-ink-soft);
    font-size:var(--jp-text-sm);
    line-height:var(--jp-leading-body);
    font-weight:700;
}
.jp-price-card--featured .jp-price-card__compare{
    background:rgba(231,199,90,.14);
    color:var(--jp-accent-soft);
    border:1px solid rgba(231,199,90,.24);
}
.jp-price-card__compare strong{color:var(--jp-accent-ink);font-weight:900}
.jp-price-card--featured .jp-price-card__compare strong{color:var(--jp-accent)}

.jp-price-card__cta{margin-top:auto}
@media(max-width:1060px){
    .jp-pricing-grid{grid-template-columns:1fr;gap:var(--jp-space-4)}
    .jp-price-card--featured{transform:none}
    .jp-price-card--featured:hover{transform:translateY(-4px)}
}

/* ─── Pricing FAQ ───────────────────────────────────────────────────────── */

.jp-faq{
    margin-top:var(--jp-space-11);
    padding-inline:var(--jp-space-5);
    display:grid;
    grid-template-columns:1fr 1.5fr;
    gap:var(--jp-space-8);
}
.jp-faq__list{display:grid;gap:var(--jp-space-3)}
.jp-faq__item{
    background:var(--jp-panel-soft);
    border:1px solid var(--jp-line);
    border-radius:var(--jp-radius-md);
    padding:var(--jp-space-5) var(--jp-space-6);
}
.jp-faq__item summary{
    cursor:pointer;
    font-weight:900;
    font-size:var(--jp-text-md);
    letter-spacing:var(--jp-tracking-snug);
    list-style:none;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:var(--jp-space-3);
}
.jp-faq__item summary::-webkit-details-marker{display:none}
.jp-faq__item summary::after{
    content:'+';
    color:var(--jp-accent-ink);
    font-size:var(--jp-text-lg);
    font-weight:900;
    transition:transform var(--jp-duration-base) var(--jp-ease);
}
.jp-faq__item[open] summary::after{transform:rotate(45deg)}
.jp-faq__item p{
    color:var(--jp-muted);
    font-size:var(--jp-text-base);
    line-height:var(--jp-leading-body);
    margin-top:var(--jp-space-3);
}
@media(max-width:860px){.jp-faq{grid-template-columns:1fr}}

/* ─── Workspaces directory (public) ─────────────────────────────────────── */

.jp-directory{
    padding:var(--jp-space-10) 0 var(--jp-space-11);
    display:flex;
    flex-direction:column;
    gap:var(--jp-space-8);
}
.jp-directory__head{
    display:flex;
    flex-direction:column;
    gap:var(--jp-space-4);
    align-items:flex-start;
}
.jp-directory__title{
    font-size:var(--jp-text-4xl);
    line-height:var(--jp-leading-tight);
    letter-spacing:var(--jp-tracking-tight);
    font-weight:900;
    max-width:22ch;
}
.jp-directory__intro{
    color:var(--jp-muted);
    font-size:var(--jp-text-lg);
    line-height:var(--jp-leading-body);
    font-weight:550;
    max-width:60ch;
}
.jp-directory__search{
    display:flex;
    gap:var(--jp-space-2);
    width:100%;
    max-width:520px;
    margin-top:var(--jp-space-2);
}
.jp-directory__search input{
    flex:1;
    border:1px solid var(--jp-line);
    border-radius:var(--jp-radius-md);
    padding:var(--jp-space-3) var(--jp-space-4);
    font:inherit;
    font-weight:650;
    background:var(--jp-panel);
    outline:none;
    transition:border-color var(--jp-duration-base) var(--jp-ease),
               box-shadow var(--jp-duration-base) var(--jp-ease);
}
.jp-directory__search input:focus{
    border-color:var(--jp-accent);
    box-shadow:0 0 0 4px rgba(231,199,90,.18);
}

.jp-directory__grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:var(--jp-space-5);
}
@media(max-width:1060px){.jp-directory__grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.jp-directory__grid{grid-template-columns:1fr}}

.jp-directory-card{
    display:flex;
    flex-direction:column;
    gap:var(--jp-space-3);
    padding:var(--jp-space-6);
    background:var(--jp-panel-soft);
    border:1px solid var(--jp-line);
    border-radius:var(--jp-radius-lg);
    box-shadow:var(--jp-shadow-sm);
    text-decoration:none;
    color:inherit;
    transition:transform var(--jp-duration-base) var(--jp-ease),
               border-color var(--jp-duration-base) var(--jp-ease),
               box-shadow var(--jp-duration-base) var(--jp-ease);
}
.jp-directory-card:hover{
    transform:translateY(-3px);
    border-color:rgba(231,199,90,.5);
    box-shadow:var(--jp-shadow-md);
}
.jp-directory-card__head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:var(--jp-space-3);
}
.jp-directory-card__roles{
    color:var(--jp-muted);
    font-size:var(--jp-text-xs);
    font-weight:850;
    text-transform:uppercase;
    letter-spacing:var(--jp-tracking-eyebrow);
}
.jp-directory-card__name{
    font-size:var(--jp-text-xl);
    letter-spacing:var(--jp-tracking-snug);
    font-weight:900;
    color:var(--jp-ink);
}
.jp-directory-card__tagline{
    color:var(--jp-muted);
    font-size:var(--jp-text-base);
    line-height:var(--jp-leading-body);
    font-weight:550;
}
.jp-directory-card__meta{
    display:flex;
    flex-wrap:wrap;
    gap:var(--jp-space-3);
    color:var(--jp-muted);
    font-size:var(--jp-text-sm);
    font-weight:650;
}
.jp-directory-card__meta span{display:inline-flex;align-items:center;gap:var(--jp-space-2)}
.jp-directory-card__meta span::before{
    content:'';
    width:5px;height:5px;
    border-radius:50%;
    background:var(--jp-accent);
}
.jp-directory-card__cta{
    margin-top:auto;
    padding-top:var(--jp-space-3);
    color:var(--jp-accent-ink);
    font-weight:900;
    font-size:var(--jp-text-sm);
}

.jp-directory__empty{
    padding:var(--jp-space-9);
    text-align:center;
    background:var(--jp-panel-soft);
    border:1px solid var(--jp-line);
    border-radius:var(--jp-radius-lg);
    box-shadow:var(--jp-shadow-sm);
}
.jp-directory__empty h3{
    font-size:var(--jp-text-2xl);
    letter-spacing:var(--jp-tracking-snug);
    font-weight:900;
}
.jp-directory__empty p{
    color:var(--jp-muted);
    margin-top:var(--jp-space-3);
    font-size:var(--jp-text-md);
    line-height:var(--jp-leading-body);
}
.jp-directory__empty a{color:var(--jp-accent-ink);font-weight:900}

/* ─── Branded workspace page ────────────────────────────────────────────── */

/* Hero */

/* Stats strip */

/* About */

/* Focus — departments + skills */

/* Values */

/* Perks */

/* Open roles grid */

/* Workspace final CTA */