/* JPK Northwest B6: owner-approved UX and shared page-grids. Based on existing Brand Tokens. */
/* No-JavaScript fallback: interactive controls are not shown until their script finishes initializing. */
.jpk-resources:not(.jpk-resource-enhanced) :is(.jpk-resource-filters,.jpk-resource-area-filters,.jpk-resource-pagination,.jpk-resource-live,.jpk-design-filter-label){display:none!important}
/* Featured stories carry the editorial visual; the complete Article library stays compact and filterable. */
.jpk-design-resources .jpk-resource-library .jpk-resource-article-list{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--jpk-design-line,#c9d5cd)}
.jpk-design-resources .jpk-resource-library .jpk-resource-article-list .jpk-resource-card{display:block;border:0;border-bottom:1px solid var(--jpk-design-line,#c9d5cd);border-radius:0;padding:22px 4px;background:transparent}
.jpk-design-resources .jpk-resource-library .jpk-resource-article-list .jpk-resource-card[hidden]{display:none!important}
.jpk-design-resources .jpk-resource-library .jpk-resource-article-list .jpk-resource-card-copy{padding:0;display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:24px;row-gap:8px;align-items:start}
.jpk-design-resources .jpk-resource-library .jpk-resource-article-list .jpk-resource-type{grid-column:1/-1}
.jpk-design-resources .jpk-resource-library .jpk-resource-article-list h4{grid-column:1;line-height:1.35}
.jpk-design-resources .jpk-resource-library .jpk-resource-article-list .jpk-resource-card-copy>p:not(.jpk-resource-type):not(.jpk-resource-date){grid-column:1;max-width:72ch;line-height:1.55;color:var(--jpk-ink,#263b32)}
.jpk-design-resources .jpk-resource-library .jpk-resource-article-list .jpk-resource-date{grid-column:2;grid-row:2;white-space:nowrap;margin:0!important}

/* Heading & breadcrumb alignment for Resources and tools on every viewport. */
.jpk-design-resources :is(h1,h2,h3){color:var(--jpk-green,#04442a)}
.jpk-resources>.jpk-site-breadcrumbs{max-width:1180px;width:100%;margin-inline:auto;padding-inline:clamp(16px,2vw,24px);box-sizing:border-box}
.jpk-resources .jpk-resources-intro h1{color:var(--jpk-green,#04442a)}
@media(max-width:650px){.jpk-design-resources .jpk-resource-library .jpk-resource-article-list .jpk-resource-card-copy{display:block}.jpk-design-resources .jpk-resource-library .jpk-resource-article-list .jpk-resource-card-copy>*{margin:0 0 8px!important}}
/* Shared core and commercial page grammar: one content edge and consistent heading accents. */
:is(.jpk-about,.jpk-approach,.jpk-routes,.jpk-fit,.jpk-deep,.jpk-utility)>.jpk-site-breadcrumbs{width:100%;box-sizing:border-box}
:is(.jpk-home,.jpk-about,.jpk-approach,.jpk-routes,.jpk-fit,.jpk-deep,.jpk-utility) h1{color:var(--jpk-green,#04442a)}
/* Approach independence is compact without changing any wording. */
.jpk-approach #independence{scroll-margin-top:120px}
.jpk-approach .jpk-approach-independence-box{background:var(--jpk-inset,#eef3ef);border:1px solid var(--jpk-line,#c8d9ce);color:var(--jpk-ink,#243b31);padding:clamp(18px,2.7vw,30px);border-radius:var(--jpk-radius-lg,14px)}
.jpk-approach .jpk-approach-commitments{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.jpk-approach .jpk-approach-commitment{background:#fff;border:1px solid var(--jpk-line,#c8d9ce);padding:clamp(14px,1.8vw,20px);border-radius:10px;min-height:0}
.jpk-approach .jpk-approach-commitment p{color:var(--jpk-ink,#243b31);margin:0}
.jpk-approach .jpk-approach-accountability{grid-template-columns:repeat(2,minmax(0,1fr));border-top-color:var(--jpk-line,#c8d9ce);padding-top:18px;margin-top:16px;gap:22px}
.jpk-approach .jpk-approach-accountability p{color:var(--jpk-ink,#243b31);font-size:15px;line-height:1.58}
@media(max-width:720px){.jpk-approach .jpk-approach-commitments,.jpk-approach .jpk-approach-accountability{grid-template-columns:1fr}}

/* Dashboard host is wider by design. Align breadcrumb with its wider content heading. */
.jpk-dashboard-host .jpk-site-breadcrumbs{max-width:initial;margin-inline:0;padding-inline:0}
/* Use supported Josefin Sans bold weight 700. */
.jpk-design-toc-heading{font-weight:700}


main.jpk-dashboard-host.jpk-b4-unified-tool.jpk-b62-dashboard > nav.jpk-site-breadcrumbs {
  max-width:1180px!important;
  width:100%!important;
  padding-left:18px!important;
  padding-right:18px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}
@media(max-width:700px){
  main.jpk-dashboard-host.jpk-b4-unified-tool.jpk-b62-dashboard > nav.jpk-site-breadcrumbs {
    max-width:none!important;
    width:100%!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }
}
/* Align Approach breadcrumb to its shell padding, including smaller layouts. */
.jpk-approach > .jpk-site-breadcrumbs {
  box-sizing:border-box;
  max-width:var(--jpk-shell-standard,1180px);
  width:100%;
  margin-inline:auto;
  padding-inline:clamp(18px,4vw,48px);
}
@media(max-width:720px){.jpk-approach > .jpk-site-breadcrumbs{padding-inline:18px}}

.jpk-approach .jpk-approach-section:not(.jpk-approach-cta) h2 {
  color:var(--jpk-green,#04442a);
}

@media(max-width:700px){
  main.jpk-dashboard-host.jpk-b4-unified-tool.jpk-b62-dashboard > nav.jpk-site-breadcrumbs {
    padding-left:16px!important;
    padding-right:16px!important;
  }
  main.jpk-dashboard-host.jpk-b4-unified-tool.jpk-b62-dashboard [data-jpk-locdash] .jpk-shell,
  main.jpk-dashboard-host.jpk-b4-unified-tool.jpk-b62-dashboard [data-jpk-quality] .jpk-shell {
    padding-left:16px!important;
    padding-right:16px!important;
  }
}


.jpk-home .jpk-home-decision-card:is(:hover,:focus-visible) h3{color:var(--jpk-green,#04442a);text-decoration-color:currentColor}
.jpk-home #jpk-home-method-title{color:var(--jpk-green,#04442a)}
.jpk-home .jpk-home-method-grid>div>p+p{margin-top:12px}
.jpk-approach .jpk-approach-negative{border-left:1px solid var(--jpk-line,#c8d9ce)}
.jpk-design-resources .jpk-resource-featured .jpk-resource-card{border-top:1px solid var(--jpk-line,#d3dcd6)}
.jpk-resources .jpk-resources-intro{max-width:900px}
.jpk-resources .jpk-resources-intro h1{max-width:28ch}
.jpk-about .jpk-about-section-head{display:block}
.jpk-about .jpk-about-section-head>p{margin:12px 0 0;max-width:72ch}
.jpk-about h2{color:var(--jpk-green,#04442a)}
:is(.jpk-home-cta-note,.jpk-approach-cta-note,.jpk-about-cta-note) a{color:inherit;text-decoration:underline;text-underline-offset:3px}

/* Shared editorial text edge for non-dashboard page templates. */
.jpk-article > nav.jpk-site-breadcrumbs ol { margin:0; padding:0; }
main.jpk-resources.jpk-shell {
  box-sizing:border-box; width:100%; max-width:var(--jpk-shell-standard);
  margin-inline:auto; padding-inline:clamp(18px,4vw,32px);
}
main.jpk-resources > nav.jpk-site-breadcrumbs.jpk-shell {
  box-sizing:border-box; width:100%; max-width:none;
  margin-inline:0; padding-inline:0;
}
main.jpk-about, main.jpk-utility { padding-inline:0; }
main.jpk-about > nav.jpk-site-breadcrumbs.jpk-shell,
main.jpk-utility > nav.jpk-site-breadcrumbs.jpk-shell,
main.jpk-about .jpk-about-shell,
main.jpk-utility .jpk-utility-inner {
  box-sizing:border-box; width:100%; max-width:var(--jpk-shell-standard);
  margin-inline:auto; padding-inline:clamp(18px,4vw,32px);
}
/* Calculator host framing only: preserve each embedded calculator fragment. */
main.jpk-b4-unified-tool:not(.jpk-b62-dashboard) > nav.jpk-site-breadcrumbs.jpk-shell {
  box-sizing:border-box; width:100%!important; max-width:var(--jpk-shell-standard)!important;
  margin-inline:auto!important; padding-inline:clamp(18px,4vw,32px)!important;
}
@media(max-width:700px){
 main.jpk-b4-unified-tool:not(.jpk-b62-dashboard)>nav.jpk-site-breadcrumbs.jpk-shell {
  width:100%!important; max-width:var(--jpk-shell-standard)!important;
 }
}

/* WBD-058: Piotr's approved Option B, shared logo-edge alignment for all eight tools.
   Host-owned CSS only: no protected dashboard or calculator content is modified.
   The standard shell is 1180px, with 32px desktop, 4vw fluid and 18px mobile inset. */
main.jpk-dashboard-host.jpk-b4-unified-tool.jpk-b62-dashboard > nav.jpk-site-breadcrumbs.jpk-shell {
  box-sizing:border-box!important;
  max-width:var(--jpk-shell-standard,1180px)!important;
  width:100%!important;
  margin-inline:auto!important;
  padding-inline:clamp(18px,4vw,32px)!important;
}
main.jpk-dashboard-host.jpk-b4-unified-tool.jpk-b62-dashboard > :is([data-jpk-locdash],[data-jpk-quality]) > .jpk-shell {
  box-sizing:border-box;
  max-width:var(--jpk-shell-standard,1180px);
  padding-inline:clamp(18px,4vw,32px)!important;
}
main.jpk-b4-unified-tool:not(.jpk-b62-dashboard) > :is(#jpk-lwc,#jpk-twr,#jpk-ndc,#jpk-ue,#jpk-ifs) {
  box-sizing:border-box!important;
  padding-inline:clamp(18px,4vw,32px)!important;
}

main.jpk-b4-unified-tool:not(.jpk-b62-dashboard) > :is(#jpk-lwc,#jpk-twr,#jpk-ndc,#jpk-ue,#jpk-ifs) > :is(.jpk-lwc-intro,.jpk-twr-intro,.jpk-ndc-intro,.jpk-ue-intro,.jpk-ifs-intro) {
  max-width:none;
}

@media (max-width:340px) {
  main.jpk-b4-unified-tool #jpk-ifs .jpk-ifs-value-wrap input {
    box-sizing:border-box;
    min-width:68px;
    width:0;
    flex:1 1 68px;
    padding-inline:7px;
  }
  main.jpk-b4-unified-tool #jpk-ifs .jpk-ifs-value-wrap .jpk-ifs-unit {
    min-width:0;
    max-width:calc(100% - 68px);
    flex:0 1 auto;
    white-space:normal;
    overflow-wrap:anywhere;
    padding-inline:6px;
    line-height:1.25;
  }
}

/* WBD-057 O-1: Resources breadcrumb separation; construction candidate pending independent verification. */
main.jpk-resources > nav.jpk-site-breadcrumbs.jpk-shell { margin-bottom:16px; }

/* WBD057-P-1b/A7-07/A7-08: keep What Comes With the Word Rate controls inside their panels; host CSS only, protected Tool code unchanged. */
@media (max-width:640px) {
  main.jpk-b4-unified-tool #jpk-ifs .jpk-ifs-task-list {
    grid-template-columns:minmax(0,1fr);
  }
  main.jpk-b4-unified-tool #jpk-ifs :is(.jpk-ifs-category-body,.jpk-ifs-task-list,.jpk-ifs-task,.jpk-ifs-field,.jpk-ifs-label-row,.jpk-ifs-value-wrap) {
    min-width:0;
    max-width:100%;
  }
  main.jpk-b4-unified-tool #jpk-ifs .jpk-ifs-value-wrap input {
    box-sizing:border-box;
    width:0;
    flex:1 1 0;
  }
  main.jpk-b4-unified-tool #jpk-ifs .jpk-ifs-value-wrap .jpk-ifs-unit {
    min-width:0;
    flex:0 1 auto;
    white-space:normal;
    overflow-wrap:break-word;
    line-height:1.25;
  }
}
@media (min-width:641px) {
  main.jpk-b4-unified-tool #jpk-ifs .jpk-ifs-program-grid .jpk-ifs-label-row {
    flex-direction:column;
    align-items:flex-start;
  }
  main.jpk-b4-unified-tool #jpk-ifs .jpk-ifs-value-wrap .jpk-ifs-unit {
    flex-shrink:0;
    max-width:calc(100% - 70px);
    white-space:normal;
    overflow-wrap:break-word;
    line-height:1.25;
  }
}

/* WBD-065: OWNER-RATIFIED SHARED WEBSITE PRESENTATION ASSUMPTIONS (review candidate).
   Preserve responsive text flow; these full-width rules mean full section width, never no-wrap at phone sizes. */
.jpk-home .jpk-method-boundary,.jpk-approach .jpk-method-boundary{
 max-width:none;width:100%;box-sizing:border-box;margin-top:clamp(24px,3vw,40px);margin-bottom:clamp(16px,2vw,28px);
}
.jpk-approach .jpk-approach-accountability{
 max-width:none;width:100%;display:flex;flex-direction:column;gap:clamp(16px,2vw,25px);
 grid-template-columns:none;
}
.jpk-approach .jpk-approach-accountability>p{
 max-width:none;width:100%;margin:0;line-height:1.65;
}
.jpk-about .jpk-about-team-model{display:block;max-width:none}
.jpk-about .jpk-about-team-model-main,.jpk-about .jpk-about-team-model-side{
 width:100%;max-width:none;display:block;
}
.jpk-about .jpk-about-team-model :is(p){max-width:none}
.jpk-about .jpk-about-team-model-side p{margin-top:clamp(16px,2vw,24px)}
.jpk-about .jpk-about-independence .jpk-about-section-head{
 display:block;max-width:none;
}
.jpk-about .jpk-about-independence :is(.jpk-about-section-head-copy,.jpk-about-disclosure,.jpk-about-commitments){max-width:none;width:100%}
.jpk-about .jpk-about-independence :is(.jpk-about-section-head>p,.jpk-about-disclosure>p,.jpk-about-commitments li){max-width:none}
/* Shared Fit Call: same green panel, CTA button, and secondary email text independent of page. */
:is(.jpk-home-cta,.jpk-approach-cta,.jpk-about-cta,.jpk-routes-cta,.jpk-deep-cta).jpk-shared-fit-cta{
 background:var(--jpk-green,#04442a);color:#fff;border:0;border-radius:20px;
 padding:clamp(28px,4.3vw,48px);display:grid;
 grid-template-columns:minmax(0,1.7fr) minmax(200px,.6fr);gap:clamp(24px,5vw,52px);align-items:center;
}
.jpk-shared-fit-cta :is(h2,p,.jpk-home-label,.jpk-about-label,.jpk-approach-label,.jpk-routes-label,.jpk-deep-label){color:#fff}
.jpk-shared-fit-cta :is(.jpk-home-cta-actions,.jpk-approach-cta-actions,.jpk-about-cta-actions,.jpk-routes-cta-actions,.jpk-deep-cta-actions){display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.jpk-shared-fit-cta :is(.jpk-home-button-primary,.jpk-about-button-primary,.jpk-approach-btn-primary,.jpk-routes-button-primary,.jpk-deep-button-primary){
 background:#fff!important;color:var(--jpk-green,#04442a)!important;border-color:#fff!important;
 border-radius:999px;min-height:48px;padding:12px 20px;font-weight:700;text-decoration:none;
}
.jpk-shared-fit-cta :is(.jpk-home-button-primary,.jpk-about-button-primary,.jpk-approach-btn-primary,.jpk-routes-button-primary,.jpk-deep-button-primary):is(:hover,:focus-visible){background:#e8f0ec!important;color:#04442a!important;border-color:#e8f0ec!important}
.jpk-shared-fit-cta :is(.jpk-home-cta-note,.jpk-about-cta-note,.jpk-approach-cta-note,.jpk-routes-cta-note,.jpk-deep-cta-note){color:#fff;margin:0}
/* Text link hover is weight, not a blocking or illegible background fill. */
a.jpk-email-inline:is(:hover,:focus-visible),.jpk-shared-fit-cta a.jpk-email-inline:is(:hover,:focus-visible){
 background:transparent!important;box-shadow:none!important;text-decoration:underline!important;
 font-weight:700!important;outline-offset:4px;
}
.jpk-shared-fit-cta a.jpk-email-inline,.jpk-shared-fit-cta a.jpk-email-inline:is(:hover,:focus-visible){color:#fff!important}
/* Hero decision cards: identical start/reference height instead of variable bottom alignment. */
.jpk-deep .jpk-deep-hero{align-items:start}
.jpk-deep .jpk-deep-hero-decision{align-self:start;margin-top:clamp(38px,6vw,66px)}
/* Allow natural small-screen stacking and avoid forced single-line text. */
@media(max-width:760px){
 .jpk-shared-fit-cta{grid-template-columns:1fr!important}
 .jpk-deep .jpk-deep-hero-decision{margin-top:0}
}
/* Compact editorial topic labels; no decorative outlines around each topic. */
.jpk-resources .jpk-topic-label{border:0;padding:0;margin-right:8px;border-radius:0;background:transparent}
.jpk-resources .jpk-card-topics{align-items:baseline;gap:6px 12px}
.jpk-checklist-date{font-size:14px;color:var(--jpk-muted,#52675d);margin:.35rem 0 1rem}

/* WBD-065 section rhythm: give cross-cutting support a visible boundary before custom/decision routes. */
.jpk-routes #ongoing-localization-support{margin-bottom:clamp(36px,5vw,68px)}
.jpk-routes #custom-work{margin-top:clamp(28px,4vw,56px)}
/* Consistent inset stack; roadmaps follow the method with matching vertical rhythm. */
.jpk-approach .jpk-method-boundary{margin-top:clamp(30px,4vw,48px);margin-bottom:clamp(26px,3vw,42px)}
/* Resource card labels remain legible but unframed. */
.jpk-resources .jpk-resource-card .jpk-topic-label{border:0!important;box-shadow:none!important;padding:0!important}

/* WBD-065 owner screenshot #15: gap between the Operations support inset and adjacent related decision-area links. */
.jpk-deep .jpk-deep-support-wide + .jpk-deep-related-nav{margin-top:clamp(28px,3.5vw,48px)}


/* WBD-066: one canonical Fit Call card geometry on Home, Routes, Approach and About. */
.jpk-shared-fit-cta.jpk-fit-card-v2{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 300px!important;
  align-items:center!important;
  gap:clamp(26px,4vw,52px)!important;
  padding:clamp(32px,4.1vw,48px)!important;
  min-height:238px;
  border-top:0!important;
  background:#05452e!important;
  border-radius:20px!important;
}
.jpk-fit-card-v2 .jpk-fit-card-v2-copy{min-width:0!important;width:100%!important}
.jpk-fit-card-v2 .jpk-fit-card-v2-copy>p:first-child{
  margin:0 0 10px!important;padding:0!important;
  font:700 12px/1.2 'Source Sans 3',sans-serif!important;
  letter-spacing:.11em!important;text-transform:uppercase!important;
}
.jpk-fit-card-v2 .jpk-fit-card-v2-copy>h2{
  max-width:none!important;margin:0 0 14px!important;
  padding:0!important;font:700 clamp(27px,2.65vw,38px)/1.15 'Josefin Sans',sans-serif!important;
  letter-spacing:-.012em!important;color:#fff!important;
  text-wrap:balance;
}
.jpk-fit-card-v2 .jpk-fit-card-v2-copy>p:not(:first-child){
  max-width:65ch!important;width:auto!important;
  margin:0!important;padding:0!important;
  font:400 17px/1.65 'Source Sans 3',sans-serif!important;color:#fff!important;
}
.jpk-fit-card-v2 .jpk-fit-card-v2-actions{
  box-sizing:border-box!important;display:flex!important;
  flex-direction:column!important;align-items:flex-start!important;
  justify-content:center!important;gap:14px!important;
  width:300px!important;max-width:300px!important;
  min-width:0!important;margin:0!important;padding:0!important;
}
.jpk-fit-card-v2 .jpk-fit-card-v2-button{
  box-sizing:border-box!important;display:inline-flex!important;
  align-items:center!important;justify-content:center!important;
  width:204px!important;min-width:204px!important;max-width:204px!important;
  height:50px!important;min-height:50px!important;
  margin:0!important;padding:0 18px!important;
  border-radius:999px!important;background:#fff!important;
  border:1px solid #fff!important;color:#05452e!important;
  font:700 16px/1 'Source Sans 3',sans-serif!important;
  text-decoration:none!important;white-space:nowrap!important;
}
.jpk-fit-card-v2 .jpk-fit-card-v2-button:is(:hover,:focus-visible){
  background:#e6eee8!important;color:#05452e!important;
}
.jpk-fit-card-v2 .jpk-fit-card-v2-contact{
  box-sizing:border-box!important;margin:0!important;padding:0!important;
  display:block!important;width:300px!important;max-width:300px!important;
  color:#fff!important;white-space:normal!important;
  font:400 15px/1.5 'Source Sans 3',sans-serif!important;
  text-align:left!important;
}
.jpk-fit-card-v2 .jpk-fit-card-v2-contact a,
.jpk-fit-card-v2 .jpk-fit-card-v2-contact a:is(:hover,:focus-visible){color:#fff!important}
/* WBD-076: keep sentence-sized headline phrases intact when desktop space allows;
   on compact widths let text wrap naturally, with no forced overflow. */
.jpk-fit-card-v2 .jpk-fit-title-line{display:inline}
@media(min-width:1100px){
  .jpk-fit-card-v2 .jpk-fit-title-line{display:block}
}
.jpk-fit-card-v2 .jpk-fit-chunk,.jpk-fit-card-v2 .jpk-fit-keep{white-space:nowrap}
.jpk-fit-card-v2 .jpk-fit-card-v2-contact a{white-space:nowrap}
/* The About page previously showed a section separator behind its green card. */
.jpk-about .jpk-about-cta.jpk-fit-card-v2{border:0!important;box-shadow:none!important}
.jpk-about .jpk-about-cta.jpk-fit-card-v2::before,
.jpk-about .jpk-about-cta.jpk-fit-card-v2::after{content:none!important;display:none!important}
@media(max-width:860px){
 .jpk-shared-fit-cta.jpk-fit-card-v2{
   grid-template-columns:minmax(0,1fr)!important;gap:24px!important;
   min-height:0!important;
 }
 .jpk-fit-card-v2 .jpk-fit-card-v2-actions{
   align-items:flex-start!important;width:100%!important;max-width:100%!important;
 }
 .jpk-fit-card-v2 .jpk-fit-card-v2-contact{max-width:100%!important;width:auto!important;white-space:normal!important}
}
@media(max-width:440px){
 .jpk-shared-fit-cta.jpk-fit-card-v2{padding:25px 20px!important;border-radius:18px!important}
 .jpk-fit-card-v2 .jpk-fit-card-v2-button{width:100%!important;max-width:100%!important}
 .jpk-fit-card-v2 .jpk-fit-card-v2-copy>h2{font-size:29px!important}
}

/* WBD-066: remove the preceding About section line so it does not touch the unified Fit Call card. */
.jpk-about .jpk-before-fit-card{border-bottom:0!important;}

/* WBD-075: About "Who we are" introduction spans the existing site shell.
   Natural wrapping remains enabled; independent sections retain their own rules. */
.jpk-about #team .jpk-about-section-head > p {
  max-width:none;
  width:100%;
}

/* WBD-075: Evidence cards match the LSP Renewal related-card link grammar.
   The full card stays clickable, but descriptive text is not underlined. */
.jpk-deep a.jpk-deep-use-card {
  text-decoration:none;
}
.jpk-deep a.jpk-deep-use-card .jpk-deep-card-link {
  text-decoration:underline;
  text-underline-offset:3px;
}
.jpk-deep a.jpk-deep-use-card:is(:hover,:focus-visible) h3 {
  text-decoration:underline;
  text-underline-offset:3px;
}
