/* JPK Northwest site-owned content navigation and resource presentation. No protected Tool internals targeted. */
:root{--jpk-design-header-offset:86px;--jpk-design-accent:#04442a;--jpk-design-cream:#f7f5f3;--jpk-design-line:rgba(4,68,42,.18)}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Article: reduce line lengths, keep the Article 008 part roadmap, add a persistent section index. */
.jpk-design-reader-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(210px,260px);gap:clamp(20px,3vw,42px);align-items:start}
.jpk-design-reader-layout>article{grid-column:1;grid-row:1;min-width:0}
.jpk-design-reader-layout>.jpk-design-rail{grid-column:2;grid-row:1;min-width:0;position:sticky;top:calc(var(--jpk-design-header-offset) + 16px);max-height:calc(100dvh - var(--jpk-design-header-offset) - 32px);overflow:auto;scrollbar-color:#a2b9ac transparent}
.jpk-design-rail summary{display:none}
.jpk-design-rail-card{border:1px solid var(--jpk-design-line);border-radius:16px;background:#fff;padding:20px 16px 16px;box-shadow:0 8px 28px rgba(4,68,42,.045)}
.jpk-design-rail-caption{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:#284944;margin-bottom:8px}
.jpk-design-rail-title{font:700 20px/1.2 'Josefin Sans','Trebuchet MS',sans-serif!important;color:#04442a;margin:0 0 12px!important}
.jpk-design-reading-progress{height:4px;background:#e4ece7;border-radius:6px;overflow:hidden;margin:0 0 14px}
.jpk-design-reading-progress>span{display:block;width:0;height:100%;background:#04442a;transition:width .12s linear}
.jpk-design-toc{display:grid;gap:2px;max-height:55dvh;overflow:auto;padding-right:2px}
.jpk-design-toc-heading{display:block;margin:12px 4px 2px;padding:8px 6px 4px;font-size:11px;line-height:1.3;letter-spacing:.06em;text-transform:uppercase;font-weight:700;color:#284944;border-top:1px solid var(--jpk-design-line)}
.jpk-design-toc-heading:first-child{border-top:0;margin-top:1px}
.jpk-design-toc a{display:flex;align-items:center;min-height:var(--jpk-target-min,48px);line-height:1.3;font-size:13.5px;font-weight:600;color:#375b49!important;text-decoration:none!important;border-left:3px solid transparent;padding:9px 7px 9px 12px;border-radius:0 8px 8px 0}
.jpk-design-toc a:hover,.jpk-design-toc a[aria-current='location']{background:#e6ece8;border-left-color:#04442a;color:#04442a!important}
.jpk-design-toc a:focus-visible{outline:3px solid #3d7a5a;outline-offset:2px}
.jpk-design-toc a.jpk-design-toc-summary{font-weight:700}
.jpk-design-rail-bottom{border-top:1px solid var(--jpk-design-line);margin-top:12px;padding-top:10px;display:flex;gap:10px;justify-content:space-between}
.jpk-design-rail-bottom a{display:inline-flex;align-items:center;min-height:var(--jpk-target-min,48px);font-size:13px;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.jpk-article .jpk-design-reader-layout .jpk-article-hero{padding-top:4px;padding-bottom:30px}
.jpk-article .jpk-design-reader-layout .jpk-article-section{margin-top:clamp(40px,5.5vw,68px);scroll-margin-top:calc(var(--jpk-design-header-offset) + 18px)}
.jpk-article .jpk-design-reader-layout .jpk-article-contents{margin-top:24px;scroll-margin-top:calc(var(--jpk-design-header-offset) + 18px)}
.jpk-article .jpk-design-reader-layout .jpk-article-tldr{margin-top:30px;border-radius:16px;border-left:5px solid #04442a}
.jpk-article .jpk-design-reader-layout .jpk-article-contents-list a{border-radius:12px}
.jpk-article .jpk-design-reader-layout .jpk-article-contents-list{grid-template-columns:1fr}
.jpk-article .jpk-design-reader-layout .jpk-article-contents-list a{grid-template-columns:minmax(80px,90px) minmax(0,1fr);column-gap:12px;align-content:center;padding:14px 16px}
.jpk-article .jpk-design-reader-layout .jpk-article-contents-desc{grid-column:2}
.jpk-article .jpk-design-reader-layout .jpk-article-contents-part{grid-row:1/3;align-self:center}
.jpk-article .jpk-design-reader-layout .jpk-article-table{font-size:.9rem}
/* Mobile: contents becomes a compact, expandable persistent bottom drawer. */
@media(max-width:940px){
 .jpk-design-reader-layout{display:block}
 .jpk-design-reader-layout>.jpk-design-rail{position:fixed;top:auto;bottom:12px;left:12px;right:12px;max-height:min(65dvh,540px);z-index:65;overflow:visible;pointer-events:none}
 .jpk-design-reader-layout>.jpk-design-rail .jpk-design-rail-card{padding:0;border-radius:15px;overflow:hidden;box-shadow:0 9px 24px rgba(4,68,42,.14);pointer-events:auto}
 .jpk-design-rail details:not([open]) .jpk-design-rail-content{display:none}
 .jpk-design-rail summary{display:flex;cursor:pointer;padding:14px 18px;min-height:48px;list-style:none;display:flex;align-items:center;justify-content:space-between;font-weight:700;color:#04442a;background:#fff}
 .jpk-design-rail summary::-webkit-details-marker{display:none}
 .jpk-design-rail summary::after{content:'⌄';font-size:22px}
 .jpk-design-rail details[open] summary::after{content:'⌃'}
 .jpk-design-rail-content{padding:12px 16px 16px;max-height:55dvh;overflow:auto}
 .jpk-design-toc{max-height:38dvh}
 .jpk-design-rail-caption,.jpk-design-rail-title{display:none}
 .jpk-article .jpk-design-reader-layout .jpk-article-contents-list a{display:grid;grid-template-columns:1fr;gap:4px}
 .jpk-article .jpk-design-reader-layout .jpk-article-contents-desc{grid-column:auto}
 .jpk-article .jpk-design-reader-layout .jpk-article-contents-part{grid-row:auto}
 .jpk-article .jpk-article-top{bottom:78px}
}
html:not(.js) .jpk-design-reader-layout>.jpk-design-rail{position:static;max-height:none;overflow:visible;pointer-events:auto}
/* Desktop article rail stays visible during cookie choice; reserve its bottom edge. */
body:has(.jpk-cookie-panel:not([hidden])) .jpk-design-reader-layout>.jpk-design-rail{max-height:calc(100dvh - var(--jpk-design-header-offset) - var(--jpk-consent-reserve,266px))}
/* Only the <=940px bottom drawer can collide with the fixed consent panel. */
@media(max-width:940px){body:has(.jpk-cookie-panel:not([hidden])) .jpk-design-reader-layout>.jpk-design-rail{visibility:hidden;pointer-events:none}}
body:has(.jpk-design-reader-layout) .jpk-site-footer,body:has(.jpk-design-tool-quicknav) .jpk-site-footer{padding-bottom:120px}
/* Resources: text-first, subtle cards and a consistent selection-control language. */
.jpk-resources.jpk-design-resources{max-width:1220px}
.jpk-design-resources .jpk-resources-intro{max-width:960px;padding-bottom:20px}
.jpk-design-resources .jpk-resources-intro h1{max-width:18ch;font-size:clamp(34px,4.3vw,52px);line-height:1.12}
.jpk-design-resources .jpk-resource-featured{padding-top:18px}
.jpk-design-resources .jpk-resource-grid{gap:12px}
.jpk-design-resources .jpk-resource-card{border-radius:15px;padding:22px 20px 20px;gap:12px;box-shadow:0 6px 18px rgba(4,68,42,.025)}
.jpk-design-resources .jpk-resource-featured .jpk-resource-card{border-top:4px solid #04442a}
.jpk-design-resources .jpk-resource-card h3,.jpk-design-resources .jpk-resource-card h4{font-size:clamp(18px,1.7vw,21px);line-height:1.28}
.jpk-design-resources .jpk-resource-card :is(h3,h4) a{color:#04442a;text-decoration:none;border-bottom:1px solid rgba(4,68,42,.4)}
.jpk-design-resources .jpk-resource-card :is(h3,h4) a:hover{border-bottom-color:#04442a}
.jpk-design-resources .jpk-resource-card p:not(.jpk-resource-type){font-size:15px;line-height:1.55}
.jpk-design-resources .jpk-resource-type{font-size:11px;letter-spacing:.1em}
.jpk-design-resources .jpk-resource-section-head{margin-bottom:14px}
.jpk-design-resources .jpk-resource-section-head h2{font-size:clamp(25px,2.8vw,34px)}
.jpk-design-resources .jpk-resource-library{padding-top:27px}
.jpk-design-resources .jpk-design-filter-label{font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:#284944;margin:22px 0 6px}
.jpk-design-resources .jpk-resource-filters{gap:7px;margin:4px 0 11px}
.jpk-design-resources .jpk-resource-filters button{border-radius:999px;background:#fff;border:1px solid #aec1b6;min-height:var(--jpk-target-min,48px);padding:9px 15px;font-family:inherit;font-size:14px;font-weight:700;transition:background .13s ease,border-color .13s ease}
.jpk-design-resources .jpk-resource-filters button.is-current{background:#04442a;color:#fff;border-color:#04442a}
.jpk-design-resources .jpk-resource-filters button:not(.is-current):hover{background:#e6ece8;border-color:#04442a}
.jpk-design-resources .jpk-resource-group-heading{margin-top:27px}
.jpk-design-resources .jpk-resource-cta{border-radius:999px}

.jpk-design-resources .jpk-resource-featured .jpk-resource-card:has(img.jpk-design-thumb){display:grid;grid-template-columns:minmax(0,1fr) 96px;align-content:start}
.jpk-design-resources .jpk-resource-featured img.jpk-design-thumb{grid-column:2;grid-row:1/5;width:96px;height:72px;object-fit:cover;border-radius:9px;align-self:start}
/* Sticky site header stays; host-owned tool quick-jump bar floats without copying the protected tablist. */
.jpk-design-tool-quicknav{position:fixed;right:18px;bottom:16px;z-index:65;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px;padding:6px;border:1px solid #a4b9ad;background:rgba(255,255,255,.97);border-radius:999px;box-shadow:0 9px 28px rgba(4,68,42,.17)}
.jpk-design-tool-quicknav a{display:inline-flex;align-items:center;justify-content:center;min-height:var(--jpk-target-min,48px);padding:8px 13px;text-decoration:none;color:#04442a;font:700 13px/1.2 'Source Sans 3',Arial,sans-serif;border-radius:999px}
.jpk-design-tool-quicknav a:hover,.jpk-design-tool-quicknav a:focus-visible{background:#e6ece8}
.jpk-design-tool-quicknav a:focus-visible{outline:3px solid #3d7a5a;outline-offset:2px}
.jpk-design-tool-quicknav a:first-child{background:#04442a;color:#fff}
.jpk-design-tool-quicknav a:first-child:hover{background:#284944}
.jpk-design-tool-start{display:block;height:0;scroll-margin-top:calc(var(--jpk-design-header-offset) + 15px)}
body:has(.jpk-cookie-panel:not([hidden])) .jpk-design-tool-quicknav{visibility:hidden;pointer-events:none}
@media(max-width:700px){.jpk-design-tool-quicknav{left:10px;right:10px;bottom:10px;justify-content:space-around}.jpk-design-tool-quicknav a{min-height:48px;flex:1 1 auto;padding:8px 10px}}
@media(prefers-reduced-motion:reduce){.jpk-design-reading-progress>span,.jpk-design-resources .jpk-resource-filters button{transition:none}}


.jpk-mobile-view-switcher{display:none}
.jpk-design-view-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(max-width:767px){
 .jpk-design-tool-quicknav a[data-jpk-design-dashboard-tabs]{display:none}
 .jpk-mobile-view-switcher{display:block;position:relative;flex:1 1 42%;min-width:145px}
 .jpk-mobile-view-switcher>summary{cursor:pointer;display:flex;align-items:center;justify-content:center;min-height:48px;padding:8px 12px;list-style:none;background:#04442a;color:white;font:700 13px/1.2 'Source Sans 3',Arial,sans-serif;border-radius:999px}
 .jpk-mobile-view-switcher>summary::-webkit-details-marker{display:none}
 .jpk-mobile-view-switcher>summary:after{content:' ▴';margin-left:8px}
 .jpk-mobile-view-switcher[open]>summary:after{content:' ▾'}
 .jpk-mobile-view-switcher>summary:focus-visible{outline:3px solid #3d7a5a;outline-offset:3px}
 .jpk-mobile-view-options{position:absolute;left:0;bottom:calc(100% + 13px);z-index:2;min-width:min(310px,calc(100vw - 20px));max-height:min(48dvh,380px);overflow:auto;display:grid;gap:4px;padding:10px;border:1px solid #9cb7a6;background:white;border-radius:16px;box-shadow:0 12px 36px rgba(4,68,42,.20)}
 .jpk-mobile-view-options>a{display:flex!important;justify-content:flex-start!important;min-height:48px!important;width:100%;padding:12px 14px!important;border-radius:9px!important;background:white!important;color:#04442a!important;font-size:14px!important;font-weight:700!important;text-decoration:none!important}
 .jpk-mobile-view-options>a:hover,.jpk-mobile-view-options>a[aria-current='location']{background:#e6ece8!important}
 .jpk-mobile-view-options>a:focus-visible{outline:3px solid #3d7a5a;outline-offset:-2px}
}