/* Shared, descriptive navigation and quicker routes into the collections. */
#kb-site-preview .crumb { padding-block: 3px; }
#kb-site-preview .header-compact #main-nav { gap: 12px; }
#kb-site-preview .header-compact #main-nav > a,
#kb-site-preview .header-compact #main-nav > .nav-group > summary { font-size: 13px; min-height: 50px; }
#kb-site-preview .header-compact #main-nav a[aria-current="page"],
#kb-site-preview .header-compact #main-nav details:has(a[aria-current="page"]) > summary { font-weight: 600; text-decoration: underline; text-underline-offset: 6px; }
#kb-site-preview .header-compact .nav-panel > a:first-child { font-weight: 600; }
#kb-site-preview .header-compact .nav-panel > a { min-height: 44px; line-height: 1.4; display: flex; align-items: center; padding: 10px 12px; }
#kb-site-preview .header-compact .nav-panel > a:hover { background: #ece5ee; }
#kb-site-preview .next-step-links { padding: 22px var(--studio-pad,5.6%); background: #eee7ef; border-block: 1px solid #d5c8d9; }
#kb-site-preview .next-step-links > p { font-size: 12px; margin: 0 0 10px; letter-spacing: .06em; }
#kb-site-preview .next-step-links > div { display: flex; flex-wrap: wrap; gap: 5px 32px; }
#kb-site-preview .next-step-links a { display: inline-flex; align-items: center; min-height: 44px; font-size: 15px; text-decoration: none; border-bottom: 1px solid #b6a0bf; }
#kb-site-preview .next-step-links a:hover { text-decoration: underline; text-underline-offset: 5px; }
#kb-site-preview .portfolio-collection .portfolio-index { padding-top: 24px; }
#kb-site-preview .portfolio-collection .portfolio-index-heading { border: 0; padding: 0; align-items: center; }
#kb-site-preview .portfolio-collection .portfolio-index-heading h1 { font-size: clamp(30px,3.1vw,43px); line-height: 1.15; margin: 0 0 6px; }
#kb-site-preview .portfolio-collection .portfolio-index-heading p { font-size: 14px; line-height: 1.5; margin: 0; }
#kb-site-preview .portfolio-collection .portfolio-index-heading .textlink { font-size: 13px; }
#kb-site-preview .portfolio-collection .filters { margin: 22px 0 0; padding: 0 0 17px; gap: 9px; }
#kb-site-preview .portfolio-collection .filters button {
  font-size: 16px; line-height: 1.3; padding: 12px 17px; min-height: 48px;
  color: #3c144c; background: #f1eaf2; border: 1px solid #c9b8cf; border-radius: 2px;
}
#kb-site-preview .portfolio-collection .filters button:hover { background: #e5d9e9; }
#kb-site-preview .portfolio-collection .filters button[aria-pressed="true"] { color: white; background: #3c144c; border-color: #3c144c; }
#kb-site-preview .portfolio-collection .filters button:focus-visible { outline: 3px solid #9671a6; outline-offset: 3px; }
#kb-site-preview .portfolio-collection #kb-project-count { margin: 13px 0 19px; font-size: 12px; }
#kb-site-preview .portfolio-collection #kb-project-grid .project-card { padding-top: 16px; }
#kb-site-preview .portfolio-collection .project-card-heading { margin-bottom: 16px; }
#kb-site-preview .portfolio-collection #kb-project-grid .project-card .kicker { margin-bottom: 8px; }
#kb-site-preview .portfolio-collection #kb-project-grid .project-card h3 { margin-bottom: 8px; }
#kb-site-preview .portfolio-collection .project-card-featured { grid-column: auto; }
#kb-site-preview .portfolio-collection .project-card-featured .project-card-heading { display: block; }
#kb-site-preview .portfolio-collection #kb-project-grid .project-card-featured h3 { font-size: clamp(27px,2.5vw,37px); margin-bottom: 8px; }
#kb-site-preview .portfolio-collection .project-card-featured .project-image-composition { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: auto; gap: 18px 16px; }
#kb-site-preview .portfolio-collection .project-card-featured .project-image-lead { grid-column: 1/-1; grid-row: auto; display: block; }
#kb-site-preview .portfolio-collection #kb-project-grid .project-card-featured .project-image-lead img { position: static; height: auto; aspect-ratio: 16/10; }
#kb-site-preview .portfolio-source-link { font-size: 13px; margin-top: 30px; }
@media (max-width: 1120px) {
  #kb-site-preview .header-compact #main-nav { gap: 0; }
  #kb-site-preview .header-compact #main-nav > a,
  #kb-site-preview .header-compact #main-nav > .nav-group > summary { font-size: 16px; min-height: 48px; }
}
@media (max-width: 700px) {
  #kb-site-preview .header-compact .header-magazine-mobile { display: none; }
  #kb-site-preview .header-compact .header-search-label { display: inline; }
  #kb-site-preview .polished-header.header-compact .header-search button { width: auto; padding-inline: 5px; font-size: 12px; }
  #kb-site-preview .header-compact .header-utilities { gap: 14px; }
  #kb-site-preview .portfolio-collection .portfolio-index { padding-top: 22px; }
  #kb-site-preview .portfolio-collection .portfolio-index-heading { display: block; }
  #kb-site-preview .portfolio-collection .portfolio-index-heading > .textlink { display: none; }
  #kb-site-preview .portfolio-collection .filters { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 17px; }
  #kb-site-preview .portfolio-collection .filters button { font-size: 15px; padding: 10px 8px; min-height: 46px; text-align: center; }
  #kb-site-preview .next-step-links { padding: 20px 24px; }
  #kb-site-preview .next-step-links > div { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 18px; }
  #kb-site-preview .next-step-links a { font-size: 14px; }
}
