/* Deliberately scoped: Featured Projects, individual projects, Home and Info are unaffected. */
.bn-featured.bn-category-index { --bn-directory-space:clamp(18px,2.4vw,42px); }
.bn-featured.bn-category-index .bn-directories {margin-bottom:25px!important;}
.bn-featured.bn-category-index .bn-filter-labels {display:flex!important;flex-wrap:wrap;gap:24px!important;margin-bottom:38px!important;}
.bn-featured.bn-category-index .bn-results {display:block!important;width:calc(100% - 60px)!important;max-width:none!important;margin:0 30px!important;padding:0!important;}
.bn-featured.bn-category-index .bn-work.bn-contact-ready {display:grid!important;grid-template-columns:190px minmax(0,1fr)!important;column-gap:30px!important;row-gap:0!important;width:100%!important;max-width:none!important;height:auto!important;min-height:0!important;margin:0!important;padding:32px 0!important;border-top:1px solid #dedede;transform:none!important;zoom:1!important;position:relative!important;content-visibility:visible!important;}
.bn-featured.bn-category-index .bn-work[hidden] {display:none!important;}
.bn-featured.bn-category-index .bn-contact-ready > .bn-cover,
.bn-featured.bn-category-index .bn-contact-ready > .bn-strip,
.bn-featured.bn-category-index .bn-contact-ready > .bn-entry-action,
.bn-featured.bn-category-index .bn-contact-ready .bn-credits {display:none!important;}
.bn-featured.bn-category-index .bn-contact-ready .bn-meta {display:block!important;position:static!important;width:auto!important;height:auto!important;min-width:0!important;max-width:none!important;padding:0!important;margin:0!important;grid-column:1!important;grid-row:1!important;align-self:start!important;transform:none!important;}
.bn-featured.bn-category-index .bn-contact-ready .bn-number {display:block!important;font-size:12px!important;line-height:1.3!important;letter-spacing:.035em!important;margin:0 0 12px!important;color:#666!important;}
.bn-featured.bn-category-index .bn-contact-ready h2 {font:400 22px/1.08 'Arial Narrow',Arial,sans-serif!important;text-transform:none!important;margin:0!important;padding:0!important;max-width:none!important;}
.bn-featured.bn-category-index .bn-contact-ready h2 a {color:#111;text-decoration:none;}
.bn-featured.bn-category-index .bn-contact-ready h2 a:hover {text-decoration:underline;text-underline-offset:4px;}
.bn-featured.bn-category-index .bn-contact-sheet {display:flex;align-items:flex-end;align-content:flex-start;flex-wrap:wrap;gap:6px;grid-column:2;grid-row:1;min-width:0;}
.bn-featured.bn-category-index .bn-contact-image {display:flex!important;align-items:flex-end!important;justify-content:flex-start;width:64px!important;max-width:100%!important;height:86px!important;margin:0!important;padding:0!important;position:relative!important;transform:none!important;overflow:visible!important;}
.bn-featured.bn-category-index .bn-contact-image img {display:block!important;width:auto!important;height:auto!important;max-width:100%!important;max-height:86px!important;object-fit:contain!important;position:static!important;transform:none!important;margin:0!important;transition:opacity .18s ease;}
.bn-featured.bn-category-index .bn-contact-image:hover img {opacity:.75;}
.bn-featured.bn-category-index .bn-contact-ready a:focus-visible {outline:1px solid #111;outline-offset:5px;}
@media(max-width:900px){
 .bn-featured.bn-category-index .bn-work.bn-contact-ready{grid-template-columns:165px minmax(0,1fr)!important;column-gap:24px!important;}
}
@media(max-width:600px) and (orientation:portrait){
 .bn-featured.bn-category-index .bn-work.bn-contact-ready{grid-template-columns:1fr!important;gap:20px!important;padding:28px 0!important;}
 .bn-featured.bn-category-index .bn-contact-ready .bn-meta{grid-column:1!important;grid-row:1!important;}
 .bn-featured.bn-category-index .bn-contact-ready h2{font-size:24px!important;}
 .bn-featured.bn-category-index .bn-contact-ready .bn-number{font-size:12px!important;margin-bottom:9px!important;}
 .bn-featured.bn-category-index .bn-contact-sheet{grid-column:1;grid-row:2;gap:8px;}
 .bn-featured.bn-category-index .bn-contact-image{width:calc((100% - 24px)/4)!important;height:115px!important;}
 .bn-featured.bn-category-index .bn-contact-image img{max-height:115px!important;}
 .bn-featured.bn-category-index .bn-filter-labels{gap:20px!important;margin-bottom:24px!important;}
}
@media(prefers-reduced-motion:reduce){.bn-featured.bn-category-index .bn-contact-image img{transition:none;}}


@media(max-width:600px) and (orientation:portrait){.bn-featured.bn-category-index .bn-results{width:calc(100% - 36px)!important;margin:0 18px!important;}}
/* Keep each project's imagery on one line at every viewport size. */
.bn-featured.bn-category-index .bn-contact-sheet {
 flex-wrap:nowrap!important;
 overflow-x:auto;
 overflow-y:hidden;
 width:100%;
 padding-bottom:0;
 scrollbar-width:thin;
 scrollbar-color:#b5b5b5 transparent;
 overscroll-behavior-x:contain;
}
.bn-featured.bn-category-index .bn-contact-image {flex:0 0 64px!important;}
@media(max-width:600px) and (orientation:portrait){
 .bn-featured.bn-category-index .bn-contact-image {flex-basis:82px!important;width:82px!important;}
}

.bn-featured.bn-category-index h1{text-transform:none!important;}

@media(max-width:700px) and (orientation:portrait){
 .bn-featured.bn-category-index .bn-filter-toolbar{flex-direction:column;align-items:stretch;gap:16px;margin:0 18px 28px;}
 .bn-featured.bn-category-index .bn-filter-toolbar .bn-filter-labels{display:flex!important;flex-wrap:wrap;justify-content:flex-start;gap:20px!important;width:100%;}
 .bn-featured.bn-category-index .bn-filter-toolbar .bn-filter-labels button{min-height:44px;font-size:12px!important;text-align:left;}
 .bn-featured.bn-category-index .bn-directory-search{flex:auto;width:100%;}
 .bn-featured.bn-category-index .bn-directory-search input{min-height:44px;font-size:16px;}
 .bn-featured.bn-category-index .bn-directory-search-clear{width:44px;height:44px;}
 .bn-featured.bn-category-index .bn-directory-search-status{margin-left:18px;margin-right:18px;}
 .bn-featured.bn-category-index .bn-results{width:calc(100% - 36px)!important;margin:0 18px!important;}
 .bn-featured.bn-category-index .bn-work.bn-contact-ready{grid-template-columns:1fr!important;gap:20px!important;padding:28px 0!important;}
 .bn-featured.bn-category-index .bn-contact-sheet{grid-column:1;grid-row:2;gap:10px;}
 .bn-featured.bn-category-index .bn-contact-sheet .bn-contact-image{flex:0 0 auto!important;width:auto!important;max-width:none!important;height:132px!important;}
 .bn-featured.bn-category-index .bn-contact-sheet .bn-contact-image img{height:132px!important;max-height:132px!important;width:auto!important;max-width:none!important;object-fit:contain!important;}
}

/* Match Featured Projects mobile menu margins and link spacing. */
@media(max-width:700px) and (orientation:portrait){
 .bn-featured.bn-category-index nav.bn-directories{display:flex!important;flex-wrap:wrap;align-items:center;gap:0 15px!important;margin:0 18px 24px!important;}
 .bn-featured.bn-category-index nav.bn-directories a{font:400 12px/1.2 'Arial Narrow',Arial,sans-serif!important;white-space:nowrap;min-height:36px;}
}

/* Scale desktop menu rhythm by the mobile/desktop type ratio: 12/14. */
@media(max-width:700px) and (orientation:portrait){
 .bn-featured.bn-category-index nav.bn-directories{margin-bottom:calc(20px * 6 / 7)!important;}
 .bn-featured.bn-category-index nav.bn-directories a{min-height:0;line-height:1.2!important;}
 .bn-featured.bn-category-index .bn-filter-toolbar .bn-filter-labels button{min-height:0;padding:6px 0!important;line-height:1.2!important;}
}

/* Keep the search field's landscape proportions in portrait. */
@media(max-width:700px) and (orientation:portrait){
 .bn-featured.bn-category-index .bn-directory-search{flex:none;width:240px;max-width:100%;align-self:flex-start;font-size:14px;}
 .bn-featured.bn-category-index .bn-directory-search input{min-height:0;font-size:14px;padding:7px 28px 7px 0;}
 .bn-featured.bn-category-index .bn-directory-search-clear{width:28px;height:28px;}
}

/* Desktop directory navigation matches Featured Projects; tags are secondary. */
@media(min-width:701px), (orientation:landscape){
 .bn-featured.bn-category-index nav.bn-directories{gap:30px!important;margin:0 30px 12px!important;font-size:14px;}
 .bn-featured.bn-category-index nav.bn-directories a{font-family:inherit!important;font-size:14px!important;font-weight:400!important;line-height:inherit!important;}
 .bn-featured.bn-category-index .bn-filter-toolbar .bn-filter-labels button{font-size:12px!important;padding:6px 0!important;}
}

/* Never expose the legacy preview cards while the directory is being assembled. */

.bn-featured.bn-category-index .bn-work:not(.bn-contact-ready){visibility:hidden!important;}

/* Shared logo/navigation bottom alignment on directory and project headers. */
.bn-featured header,.bn-project-nav .bn-top{align-items:flex-end!important;}
.bn-featured header>a,.bn-project-nav .bn-top>a{display:block;line-height:0;}
.bn-featured header nav,.bn-project-nav .bn-top .bn-links{display:flex;align-items:flex-end!important;}
.bn-featured header nav a,.bn-project-nav .bn-top .bn-links a{display:block!important;line-height:1!important;min-height:0!important;margin-top:0!important;padding-top:0!important;padding-bottom:0!important;position:relative;}
.bn-featured header nav a::before,.bn-project-nav .bn-top .bn-links a::before{content:'';position:absolute;inset:-14px 0;}
.bn-project-nav .bn-top img{display:block;}

/* Mobile mirrors desktop's 14:12 category/tag type and 12px row gap. */
@media(max-width:700px) and (orientation:portrait){
 .bn-featured.bn-category-index nav.bn-directories{margin-bottom:calc(12px * 6 / 7)!important;}
 .bn-featured.bn-category-index .bn-filter-toolbar .bn-filter-labels button{font-size:calc(12px * 6 / 7)!important;padding:calc(6px * 6 / 7) 0!important;line-height:1.2!important;}
}

/* Keep the aligned header row at its original top inset. */
.bn-featured header,.bn-project-nav .bn-top{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-content:start!important;align-items:end!important;}
.bn-featured header>a,.bn-project-nav .bn-top>a{justify-self:start;}

/* Shared tag typography also covers filters rebuilt during navigation. */
.bn-featured.bn-category-index{--bn-category-type:14px;--bn-tag-type:12px;-webkit-text-size-adjust:100%;text-size-adjust:100%;}
.bn-featured.bn-category-index nav.bn-directories a{font-size:var(--bn-category-type)!important;}
.bn-featured.bn-category-index fieldset.bn-filter .bn-filter-labels button,
.bn-featured.bn-category-index .bn-filter-toolbar .bn-filter-labels button{font-size:var(--bn-tag-type)!important;line-height:1.2!important;}
@media(max-width:700px) and (orientation:portrait){
 .bn-featured.bn-category-index{--bn-category-type:12px;--bn-tag-type:10.2857px;}
}

/* Slightly tighten the gap from the header to category titles. */
.bn-featured h1{padding-top:20px!important;}
@media(max-width:700px){.bn-featured h1{padding-top:18px!important;}}

/* Shared mobile frame for all four project listing pages, including Lay wrappers. */
@media(max-width:700px){
 .lay-content:has(.bn-featured),.grid:has(.bn-featured),.grid:has(.bn-featured)>.grid-inner,
 .grid:has(.bn-featured) .row:has(.bn-featured),.grid:has(.bn-featured) .row-inner:has(.bn-featured),
 .grid:has(.bn-featured) .column-wrap:has(.bn-featured),.grid:has(.bn-featured) .type-html:has(.bn-featured){padding-top:0!important;margin-top:0!important;padding-left:0!important;padding-right:0!important;}
 .bn-featured header{box-sizing:border-box!important;height:82px!important;min-height:0!important;margin:0!important;padding:23px 18px!important;}
 .bn-featured h1{box-sizing:border-box!important;margin:0!important;padding:18px 18px 30px!important;font-size:40px!important;line-height:1!important;}
 .bn-featured .bn-rule{margin:0 18px 30px!important;}
}

/* One mobile category menu for Featured Projects and every directory. */
@media(max-width:700px) and (orientation:portrait){
 .bn-featured nav.bn-directories,.bn-featured.bn-category-index nav.bn-directories{box-sizing:border-box!important;display:flex!important;flex-wrap:wrap!important;justify-content:flex-start!important;align-items:center!important;gap:0 15px!important;margin:0 18px 10.2857px!important;padding:0!important;font:400 12px/1.2 'Arial Narrow',Arial,sans-serif!important;-webkit-text-size-adjust:100%;text-size-adjust:100%;}
 .bn-featured nav.bn-directories a,.bn-featured.bn-category-index nav.bn-directories a{display:inline-flex!important;align-items:center!important;min-height:0!important;margin:0!important;padding:0!important;font:400 12px/1.2 'Arial Narrow',Arial,sans-serif!important;white-space:nowrap;}
}

/* Keep mobile category-switch landmarks fixed, including longer page titles. */
@media(max-width:700px) and (orientation:portrait){
 .bn-featured h1{height:88px!important;min-height:88px!important;max-height:88px!important;display:flex!important;align-items:flex-start!important;white-space:nowrap!important;font-size:clamp(26px,8vw,40px)!important;line-height:40px!important;padding:18px 18px 30px!important;}
 .bn-featured .bn-rule{box-sizing:border-box!important;height:1px!important;min-height:1px!important;padding:0!important;margin:0 18px 30px!important;border:0!important;border-top:1px solid #ddd!important;}
 .bn-featured nav.bn-directories,.bn-featured.bn-category-index nav.bn-directories{min-height:14.4px!important;align-content:flex-start!important;}
}

/* Equal-height uncropped previews; image proportions determine width. */
.bn-featured.bn-category-index .bn-contact-sheet{--bn-preview-height:86px;}
.bn-featured.bn-category-index .bn-contact-sheet .bn-contact-image{flex:0 0 auto!important;width:auto!important;max-width:none!important;height:var(--bn-preview-height)!important;}
.bn-featured.bn-category-index .bn-contact-sheet .bn-contact-image img{height:var(--bn-preview-height)!important;max-height:var(--bn-preview-height)!important;width:auto!important;max-width:none!important;object-fit:contain!important;}
@media(max-width:700px) and (orientation:portrait){.bn-featured.bn-category-index .bn-contact-sheet{--bn-preview-height:132px;}}

/* On portrait phones, search ends at the same edge as the tag row. */
@media(max-width:700px) and (orientation:portrait){
 .bn-featured.bn-category-index .bn-filter-toolbar{display:grid;grid-template-columns:fit-content(100%);justify-content:start;align-items:start;}
 .bn-featured.bn-category-index .bn-filter-toolbar .bn-filter-labels{width:max-content;max-width:100%;}
 .bn-featured.bn-category-index .bn-filter-toolbar .bn-directory-search{contain:inline-size;box-sizing:border-box;width:100%;max-width:100%;min-width:0;justify-self:stretch;}
}

/* Centre the shared loading notice in the viewport on all devices. */
#bn-loading-notice{background:#000!important;color:#fff!important;border-color:#000!important;top:50%!important;left:50%!important;bottom:auto!important;right:auto!important;transform:translate(-50%,-50%)!important;}

/* Give each horizontal strip its own paint layer so decoded offscreen images
   are painted on first scroll, without needing hover to invalidate the layer. */
.bn-featured.bn-category-index .bn-contact-sheet{transform:translateZ(0);backface-visibility:hidden;}

/* Extra breathing room before the first featured project on portrait phones. */
@media(max-width:700px) and (orientation:portrait){
 .bn-featured:not(.bn-category-index) nav.bn-directories{margin-bottom:36px!important;}
}
