.bin-search { padding-top: 18px; padding-bottom: 32px; color: #17232b; }
.bin-search h2 { font-size: clamp(1.4rem, 3vw, 2rem); line-height: 1.3; overflow-wrap: anywhere; }
.bin-search p { color: #34454f; font-size: 1rem; line-height: 1.6; }
.bin-search .bin-search-note { padding: 16px; background: #f4f6f1; border-left: 4px solid #bd8a21; }
.bin-results-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 24px; }
.bin-result { min-width: 0; border: 1px solid #bcc7be; border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; background: #fff; }
.bin-result > img { width: 100%; height: 210px; object-fit: contain; border-bottom: 4px solid #f4c344; background: #fff; }
.bin-result-body { padding: 20px; display: flex; flex-direction: column; flex: 1; }
.bin-result h3 { font-size: 1.2rem; line-height: 1.45; margin: 0 0 10px; overflow-wrap: anywhere; }
.bin-result p { margin: 0 0 10px; }
.bin-measurements { font-weight: 750; }
.bin-result details { margin-bottom: 14px; }
.bin-result summary { cursor: pointer; min-height: 48px; padding: 12px 0; font-weight: 700; }
.ordered-categories > summary { cursor: pointer; min-height: 48px; padding: 12px 0; font-size: 1rem; font-weight: 700; }
.bin-result-actions { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 8px; margin-top: auto; }
.bin-result-actions a { min-height: 52px; padding: 12px; font-size: 1rem; line-height: 1.4; text-align: center; white-space: normal; }
.bin-result-actions a:last-child { color: #17232b; background: #f4c344; border: 1px solid #bd8a21; }
.bin-pages, .bin-search-help, .bin-search-examples, .bin-filter-links { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 20px; }
.bin-filter-links { padding: 14px; background: #fff8e5; border: 1px solid #d3a43b; border-radius: 8px; }
.bin-filter-heading { width: 100%; font-weight: 800; color: #17232b; }
.bin-pages a, .bin-search-help a, .bin-search-examples a, .bin-filter-links a { display: inline-flex; align-items: center; min-height: 48px; padding: 10px 16px; color: #173b2d; background: #f4f6f1; border: 1px solid #8faaa0; border-radius: 5px; font-weight: 700; text-decoration: underline; }
.bin-search-examples { margin-bottom: 20px; font-size: 1rem; }
.bin-search a:focus-visible, .bin-search summary:focus-visible, .bin-search-examples a:focus-visible { outline: 3px solid #277bb0; outline-offset: 3px; }
@media (max-width: 1000px) { .bin-results-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 650px) { .bin-results-grid { grid-template-columns: minmax(0, 1fr); } .bin-result-body { padding: 18px; } .bin-search-help a, .bin-filter-links a { width: 100%; } }

/* One catalog hierarchy, with large ordinary links at every depth. */
.catalog-category-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 16px 0 28px; }
.catalog-category-grid a { display: flex; flex-direction: column; gap: 8px; min-height: 76px; padding: 18px; border: 1px solid #8faaa0; border-left: 5px solid #f4c344; background: #f4f6f1; color: #173b2d; text-decoration: none; overflow-wrap: anywhere; }
.catalog-category-grid strong { font-size: 1.15rem; line-height: 1.4; }
.catalog-category-grid a > span { font-size: 1rem; line-height: 1.5; }
.catalog-category-grid a:hover { background: #e6eee7; }
.catalog-category-open { font-weight: 750; text-decoration: underline; }
.catalog-category-grid [hidden], .catalog-chooser[hidden], .bin-search-examples[hidden], .catalog-back-link[hidden], #catalog-scope[hidden] { display: none !important; }
.catalog-back-link { display: inline-flex; align-items: center; min-height: 52px; padding: 12px 16px; border: 1px solid #8faaa0; font-weight: 750; margin-bottom: 14px; }
.catalog-active-filters { margin: 0 0 24px; }
.catalog-fit-request { margin: 0 0 20px; padding: 14px 16px; border: 2px solid #bd8a21; border-radius: 10px; background: #fff8e5; color: #2d2a22; line-height: 1.5; }
.catalog-fit-request strong { display: block; margin-bottom: 3px; }
.ordered-categories { padding: 12px 0; border-block: 1px solid #bcc7be; margin: 16px 0 24px; }
.catalog-category-filter { display: block; max-width: 600px; font-weight: 750; }
.catalog-category-filter input { display: block; width: 100%; min-height: 52px; margin-top: 8px; padding: 12px; font: inherit; background: #fff; color: #17232b; border: 1px solid #667e72; }
.header .catalog-search:has(#catalog-scope:not([hidden])) { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; height: auto; gap: 0 12px; }
.header .catalog-search:has(#catalog-scope:not([hidden])) > input, .header .catalog-search:has(#catalog-scope:not([hidden])) > button { height: 52px; }
#catalog-scope { grid-column: 1 / -1; width: 100%; min-width: 0; min-height: 48px; font: inherit; font-size: 1rem; padding: 10px; border: 0; border-top: 1px solid #8faaa0; background: #f4f6f1; color: #17232b; }
.catalog-bin-results .catalog-chooser { display: none; }
@media (max-width: 1000px) { .catalog-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 650px) { .catalog-category-grid { grid-template-columns: minmax(0, 1fr); } .catalog-category-grid a { min-height: 60px; padding: 16px; } }

/* The Knopp search pattern: broad departments, then relevant live filters. */
.catalog-department-nav { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.catalog-department-nav a { display: flex; align-items: center; min-height: 48px; padding: 12px 16px; border: 1px solid #809789; border-radius: 5px; background: #fff; color: #173b2d; font-weight: 750; font-size: 1rem; }
.catalog-department-nav a[aria-current] { color: #fff; background: #173b2d; border-color: #173b2d; }
.catalog-search-layout { display: grid; grid-template-columns: minmax(220px,270px) minmax(0,1fr); gap: 20px 28px; align-items: start; }
.catalog-refinements { grid-column: 1; grid-row: 1 / span 2; padding: 20px; background: #f4f6f1; border: 1px solid #aabbb0; border-radius: 8px; }
.catalog-refinements summary { min-height: 48px; cursor: pointer; font-size: 1.25rem; font-weight: 800; }
.catalog-filter-form { display: grid; gap: 18px; padding-top: 14px; }
.catalog-filter-form label { display: grid; gap: 8px; color: #17232b; font-size: 1rem; font-weight: 750; }
.catalog-filter-form input, .catalog-filter-form select { width: 100%; min-width: 0; min-height: 52px; padding: 12px; color: #17232b; border: 1px solid #81998b; border-radius: 4px; background: #fff; font: inherit; font-weight: 400; }
.catalog-filter-form button { min-height: 52px; font: inherit; font-weight: 750; }
.catalog-reset { display: flex; align-items: center; min-height: 48px; text-decoration: underline; color: #173b2d; font-weight: 750; }
.catalog-refinements p { font-size: .95rem; margin-bottom: 0; }
.catalog-search-products { grid-column: 2; min-width: 0; }
.catalog-search-products .bin-results-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.catalog-filter-removals { grid-column: 2; display: flex; flex-wrap: wrap; gap: 8px; }
.catalog-filter-removals a { min-height: 48px; display: flex; align-items: center; gap: 12px; padding: 12px; border: 1px solid #9f822e; background: #fff7df; border-radius: 5px; color: #17232b; font-weight: 750; }
.catalog-filter-form :focus-visible { outline: 3px solid #287bbb; outline-offset: 3px; }
@media(max-width:900px) { .catalog-search-layout { grid-template-columns: minmax(0,1fr); } .catalog-refinements,.catalog-search-products,.catalog-filter-removals { grid-column: 1; grid-row: auto; } .catalog-filter-form { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:650px) { .catalog-department-nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); } .catalog-department-nav a { padding: 12px; } .catalog-filter-form,.catalog-search-products .bin-results-grid { grid-template-columns: minmax(0,1fr); } .catalog-refinements { padding: 16px; } }
