/* Catalog-only styles. Scoped to avoid changing the home, search and product pages. */
.krep-catalog-page {
  padding: 0 0 70px;
  background: #fff;
  color: var(--ink);
  font: 15px/1.45 Arial,"Helvetica Neue",sans-serif
}
.krep-catalog-page h1,
.krep-catalog-page h2,
.krep-catalog-page h3,
.krep-catalog-page p {
  margin-top: 0
}
.krep-catalog-crumbs {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 58px;
  overflow: hidden;
  color: var(--muted);
  font-size: 13px;
  white-space: nowrap
}
.krep-catalog-crumbs a {
  overflow: hidden;
  text-overflow: ellipsis
}
.krep-catalog-crumbs a:hover {
  color: var(--ink);
  text-decoration: underline
}
.krep-catalog-crumbs span {
  color: #b1b3ad
}
.krep-catalog-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
  padding: 22px 0 27px;
  border-bottom: 1px solid var(--line)
}
.krep-catalog-heading h1 {
  margin-bottom: 10px;
  font-size: clamp(34px,4vw,54px);
  line-height: 1.02;
  letter-spacing: -2px
}
.krep-catalog-heading>div>p {
  max-width: 720px;
  margin-bottom: 0;
  color: var(--muted);
  font-size: 16px
}
.krep-catalog-heading-meta {
  min-width: 190px;
  margin-bottom: 2px!important;
  color: var(--muted);
  text-align: right
}
.krep-catalog-heading-meta strong {
  color: var(--ink);
  font-size: 28px
}
.krep-catalog-heading-meta span {
  font-size: 13px
}
.krep-catalog-layout {
  display: grid;
  grid-template-columns: minmax(0,1fr) 240px;
  gap: 24px;
  margin-top: 24px
}
.krep-family-results {
  min-width: 0
}
.krep-result-top {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  min-height: 74px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line)
}
.krep-result-eyebrow {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font: 12px var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase
}
.krep-result-top h2 {
  margin: 0;
  font-size: 24px;
  letter-spacing: -.6px
}
.krep-result-count {
  font: 13px var(--mono);
  color: var(--muted);
  white-space: nowrap
}
.krep-family-grid {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 12px
}
.krep-family-card {
  display: flex;
  min-width: 0;
  min-height: 410px;
  flex-direction: column;
  padding: 16px;
  border: 1px solid #d6d8d2;
  background: #fff;
  transition: transform .16s ease,border-color .16s ease,box-shadow .16s ease
}
.krep-family-card:hover {
  transform: translateY(-2px);
  border-color: #3b99e5;
  box-shadow: 0 7px 18px rgba(32,34,31,.09)
}
.krep-family-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px
}
.krep-family-card-top strong {
  font: 800 16px var(--mono)
}
.krep-family-card-top span {
  padding: 4px 7px;
  background: #fff5b9;
  color: #585315;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase
}
.krep-family-image {
  height: 150px;
  margin: 10px -15px 8px;
  overflow: hidden;
  background: #fff
}
.krep-family-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform .2s ease
}
.krep-family-card:hover .krep-family-image img {
  transform: scale(1.025)
}
.krep-family-card h3 {
  min-height: 42px;
  margin: 7px 0 6px;
  font-size: 17px;
  line-height: 1.2;
  letter-spacing: -.35px
}
.krep-family-card>p {
  min-height: 35px;
  margin-bottom: 13px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4
}
.krep-family-card dl {
  display: grid;
  gap: 4px;
  margin: 0 0 16px
}
.krep-family-card dl div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px
}
.krep-family-card dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 400
}
.krep-family-card dd {
  margin: 0;
  font: 700 11px var(--mono);
  text-align: right
}
.krep-family-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  padding: 8px 9px;
  background: #ffed7c;
  color: #272817;
  font-size: 12px;
  font-weight: 800
}
.krep-family-action span {
  font: 18px var(--mono)
}
.krep-filter-column {
  min-width: 0;
  padding-left: 15px;
  border-left: 1px solid var(--line)
}
@media(min-width:901px) {
  .krep-family-filter-column {
    position: relative;
    border-left: 0
  }
  .krep-family-filter-column::before {
    position: absolute;
    top: 74px;
    bottom: 0;
    left: 0;
    border-left: 1px solid var(--line);
    content: "";
    pointer-events: none
  }
}
.krep-filter-result {
  min-height: 74px;
  margin-bottom: 18px;
  padding: 3px 0 14px;
  border-bottom: 1px solid var(--line);
  text-align: right
}
.krep-filter-result strong {
  display: block;
  font-size: 17px
}
.krep-filter-result span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px
}
.krep-filter-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 0 11px
}
.krep-filter-head h2 {
  margin: 0;
  font-size: 18px
}
.krep-filter-head span {
  padding: 3px 6px;
  background: #eceeeb;
  color: #6b6d67;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase
}
.krep-filter-note {
  margin-bottom: 10px!important;
  padding: 11px 12px;
  border-left: 3px solid var(--accent);
  background: #fffbea;
  color: #65665f;
  font-size: 11px;
  line-height: 1.45
}
.krep-disabled-filters {
  border-top: 1px solid var(--line)
}
.krep-disabled-filters button {
  display: flex;
  width: 100%;
  min-height: 48px;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: #fff;
  color: #777973;
  font-size: 13px;
  text-align: left;
  cursor: not-allowed
}
.krep-disabled-filters button span:last-child {
  color: #b5b7b1;
  font-size: 18px
}
.krep-filter-apply {
  width: 100%;
  min-height: 43px;
  margin-top: 16px;
  border: 1px solid #e5d673;
  background: #ffed7c;
  color: #77704b;
  font-weight: 800;
  cursor: not-allowed;
  opacity: .58
}
.krep-catalog-description {
  margin-top: 38px;
  padding: 26px 28px;
  background: #f7f7f6
}
.krep-catalog-description h2 {
  margin-bottom: 8px;
  font-size: 21px
}
.krep-catalog-description p:last-child {
  margin-bottom: 0
}
.krep-catalog-empty {
  padding: 35px;
  border: 1px solid var(--line);
  background: var(--soft)
}
.krep-family-landing {
  display: grid;
  grid-template-columns: minmax(260px,420px) minmax(0,1fr);
  gap: clamp(30px,6vw,80px);
  align-items: center;
  padding: 46px 0 72px;
  border-top: 1px solid var(--line)
}
.krep-family-landing-image {
  height: 340px
}
.krep-family-landing-image img {
  width: 100%;
  height: 100%;
  object-fit: contain
}
.krep-family-landing h1 {
  margin: 4px 0 15px;
  font-size: clamp(36px,5vw,62px);
  letter-spacing: -2px
}
.krep-family-description {
  max-width: 680px;
  color: var(--muted)
}
.krep-sku-status {
  max-width: 680px;
  margin-top: 24px;
  padding: 18px 20px;
  border-left: 4px solid var(--accent);
  background: #fffbea
}
.krep-sku-status strong {
  font-size: 17px
}
.krep-sku-status p {
  margin: 5px 0 0;
  color: #676962
}
.krep-back-to-families {
  display: inline-block;
  margin-top: 23px;
  font-weight: 800
}
.krep-back-to-families:hover {
  text-decoration: underline
}
.krep-family-catalog-layout {
  grid-template-columns: minmax(0,1fr) 260px;
  gap: 30px;
  margin-top: 12px
}
.krep-product-toolbar {
  margin-bottom: 16px;
  padding-bottom: 14px
}
.krep-product-toolbar h1 {
  margin: 0 0 3px;
  font-size: 31px;
  letter-spacing: -.45px
}
.krep-active-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  margin: -2px 0 15px
}
.krep-active-filters button,
.krep-active-filters a {
  min-height: 30px;
  padding: 5px 8px;
  border: 1px solid #d8d19d;
  border-radius: 0;
  background: #fffbea;
  color: #36372f;
  font-size: 11px
}
.krep-active-filters button {
  display: inline-flex;
  align-items: center;
  gap: 8px
}
.krep-active-filters button:hover,
.krep-active-filters button:focus-visible {
  border-color: #a99d45;
  background: #fff5b9
}
.krep-active-filters a {
  border-color: transparent;
  background: transparent;
  text-decoration: underline
}
.krep-product-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 12px
}
.krep-product-card {
  display: grid;
  min-width: 0;
  grid-template-rows: 168px minmax(0,1fr) auto;
  border: 1px solid #d6d8d2;
  background: #fff;
  transition: border-color .16s ease,box-shadow .16s ease,transform .16s ease
}
.krep-product-card:hover {
  transform: translateY(-1px);
  border-color: #a8aaa4;
  box-shadow: 0 7px 18px rgba(32,34,31,.08)
}
.krep-product-image {
  display: block;
  min-width: 0;
  height: 168px;
  padding: 9px;
  overflow: hidden;
  border-bottom: 1px solid #eceee9;
  background: #fff
}
.krep-product-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform .18s ease
}
.krep-product-card:hover .krep-product-image img {
  transform: scale(1.025)
}
.krep-product-card-body {
  padding: 13px 14px 11px
}
.krep-product-code {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  color: var(--muted);
  font: 10px var(--mono)
}
.krep-product-code span:first-child {
  padding: 3px 5px;
  background: #fff5b9;
  color: #585315;
  font-weight: 800
}
.krep-product-code span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}
.krep-product-card h3 {
  min-height: 52px;
  margin: 0 0 12px;
  font-size: 14px;
  line-height: 1.28;
  letter-spacing: -.15px
}
.krep-product-card h3 a:hover {
  text-decoration: underline
}
.krep-product-specs {
  display: grid;
  gap: 4px;
  margin: 0
}
.krep-product-specs div {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 8px;
  align-items: baseline
}
.krep-product-specs dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 400
}
.krep-product-specs dd {
  margin: 0;
  font: 700 10px var(--mono);
  text-align: right
}
.krep-product-card-footer {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 8px;
  align-items: end;
  padding: 11px 14px 13px;
  border-top: 1px solid #eceee9
}
.krep-product-commercial {
  display: grid;
  gap: 3px
}
.krep-product-commercial span {
  color: #72746e;
  font-size: 10px
}
.krep-product-commercial .is-stocked {
  color: #2f6b3c
}
.krep-product-commercial strong {
  font: 800 17px var(--mono)
}
.krep-product-card-footer button,
.krep-product-details {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 8px 10px;
  border: 1px solid #e1cf54;
  border-radius: 0;
  background: #ffed7c;
  color: #272817;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap
}
.krep-product-card-footer button:hover,
.krep-product-details:hover {
  border-color: #c6b32f;
  background: #ffe75a
}
.krep-product-card-footer button:active,
.krep-product-details:active {
  transform: translateY(1px)
}
.krep-family-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 22px
}
.krep-family-pagination .pagination {
  margin: 0
}
.krep-family-pagination .pagination>li>a,
.krep-family-pagination .pagination>li>span {
  border-radius: 0;
  color: var(--ink)
}
.krep-family-pagination .pagination>.active>span {
  border-color: #d8c43f;
  background: #ffed7c;
  color: #272817
}
.krep-family-pagination p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  text-align: right
}
.krep-family-filter-column .krep-filter-head a {
  color: var(--muted);
  font-size: 11px;
  text-decoration: underline
}
.krep-mobile-filter-toggle {
  display: none
}
.krep-family-filter-groups {
  border-top: 1px solid var(--line)
}
.krep-family-filter-groups details {
  border-bottom: 1px solid var(--line)
}
.krep-family-filter-groups summary {
  display: flex;
  min-height: 44px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 0;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  list-style: none
}
.krep-family-filter-groups summary::-webkit-details-marker {
  display: none
}
.krep-family-filter-groups summary span:last-child::before {
  content: "+";
  color: #8d8f89;
  font: 17px var(--mono)
}
.krep-family-filter-groups details[open] summary span:last-child::before {
  content: "−"
}
.krep-filter-options {
  display: grid;
  gap: 1px;
  max-height: 224px;
  margin: 0 -5px 9px 0;
  padding-right: 5px;
  overflow: auto;
  scrollbar-width: thin
}
.krep-filter-options label {
  display: grid;
  min-height: 30px;
  grid-template-columns: 16px minmax(0,1fr) auto;
  gap: 7px;
  align-items: center;
  margin: 0;
  color: #41433e;
  font-size: 11px;
  font-weight: 400;
  cursor: pointer
}
.krep-filter-options input {
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: #d4bc20
}
.krep-filter-options small {
  color: #999b95;
  font: 9px var(--mono)
}
.krep-family-filter-column .krep-filter-apply {
  border-color: #e1cf54;
  background: #ffed7c;
  color: #272817;
  cursor: pointer;
  opacity: 1
}
.krep-family-filter-column .krep-filter-apply:hover {
  border-color: #c6b32f;
  background: #ffe75a
}
.krep-filter-reset {
  display: block;
  margin-top: 10px;
  color: var(--muted);
  font-size: 11px;
  text-align: center;
  text-decoration: underline
}
.krep-catalog-empty a {
  display: inline-block;
  margin-top: 8px;
  font-weight: 800;
  text-decoration: underline
}
@media(max-width:1180px) {
  .krep-family-grid {
    grid-template-columns: repeat(3,minmax(0,1fr))
  }
  .krep-product-grid {
    grid-template-columns: repeat(2,minmax(0,1fr))
  }
}
.krep-section-heading {
  padding: 4px 0 10px;
  border-bottom: 1px solid var(--line)
}
.krep-section-title-row {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 6px
}
.krep-section-title-row h1 {
  margin: 0;
  font-size: 28px;
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: -.3px;
  color: #101820
}
.krep-section-title-row span {
  color: #8d969e;
  font-size: 15px;
  line-height: 1
}
.krep-section-intro {
  display: grid;
  grid-template-columns: 260px minmax(0,1fr);
  align-items: center;
  gap: 14px
}
.krep-section-screw-drawing {
  display: block;
  width: 260px;
  height: 124px;
  overflow: visible
}
.krep-section-intro p {
  max-width: 980px;
  margin: 0;
  color: #4f5c66;
  font-size: 14px;
  line-height: 1.42
}
@media(max-width:900px) {
  .krep-catalog-layout {
    grid-template-columns: 1fr
  }
  .krep-filter-column {
    grid-row: 1;
    padding: 0 0 20px;
    border: 0;
    border-bottom: 1px solid var(--line)
  }
  .krep-filter-result {
    text-align: left
  }
  .krep-disabled-filters {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 20px
  }
  .krep-filter-apply {
    max-width: 260px
  }
  .krep-family-results {
    grid-row: 2
  }
  .krep-family-filter-column form {
    position: static
  }
  .krep-mobile-filter-toggle {
    display: flex;
    width: 100%;
    min-height: 42px;
    align-items: center;
    justify-content: space-between;
    padding: 8px 10px;
    border: 1px solid #d6d8d2;
    border-radius: 0;
    background: #fff;
    color: var(--ink);
    font-size: 12px;
    font-weight: 700
  }
  .krep-mobile-filter-toggle span:last-child::before {
    content: "+";
    font: 17px var(--mono)
  }
  .krep-family-filter-column form.is-open .krep-mobile-filter-toggle span:last-child::before {
    content: "−"
  }
  .krep-family-filter-column form:not(.is-open) #krep-family-filter-controls {
    display: none
  }
  #krep-family-filter-controls {
    padding-top: 8px
  }
  .krep-family-filter-groups {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 22px
  }
  .krep-family-filter-column .krep-filter-apply {
    max-width: 260px
  }
  .krep-family-grid {
    grid-template-columns: repeat(2,minmax(0,1fr))
  }
  .krep-family-landing {
    grid-template-columns: 1fr 1.25fr
  }
  .krep-family-landing-image {
    height: 280px
  }
}
@media(max-width:640px) {
  .krep-section-heading {
    padding-top: 0
  }
  .krep-section-title-row {
    margin-bottom: 4px
  }
  .krep-section-title-row h1 {
    font-size: 26px
  }
  .krep-section-intro {
    grid-template-columns: 1fr;
    gap: 10px
  }
  .krep-section-screw-drawing {
    width: 230px;
    height: auto
  }
  .krep-section-intro p {
    font-size: 13px
  }
  .krep-catalog-page {
    padding-bottom: 42px
  }
  .krep-catalog-crumbs {
    min-height: 46px
  }
  .krep-catalog-heading {
    display: block;
    padding: 15px 0 21px
  }
  .krep-catalog-heading h1 {
    font-size: 38px;
    letter-spacing: -1.2px
  }
  .krep-catalog-heading>div>p {
    font-size: 14px
  }
  .krep-catalog-heading-meta {
    display: none
  }
  .krep-catalog-layout {
    gap: 20px;
    margin-top: 18px
  }
  .krep-family-catalog-layout {
    margin-top: 9px
  }
  .krep-filter-result {
    min-height: 0;
    margin-bottom: 12px
  }
  .krep-filter-note {
    font-size: 12px
  }
  .krep-disabled-filters {
    grid-template-columns: 1fr
  }
  .krep-disabled-filters button {
    min-height: 44px
  }
  .krep-family-grid {
    grid-template-columns: 1fr
  }
  .krep-family-card {
    min-height: 390px
  }
  .krep-family-image {
    height: 164px
  }
  .krep-family-card h3,
  .krep-family-card>p {
    min-height: 0
  }
  .krep-result-top {
    min-height: 0
  }
  .krep-result-count {
    display: none
  }
  .krep-family-landing {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 25px 0 50px
  }
  .krep-family-landing-image {
    height: 230px
  }
  .krep-family-landing h1 {
    font-size: 40px
  }
  .krep-product-grid {
    grid-template-columns: 1fr
  }
  .krep-product-card {
    grid-template-rows: 188px minmax(0,1fr) auto
  }
  .krep-product-image {
    height: 188px
  }
  .krep-product-card h3 {
    min-height: 0
  }
  .krep-family-pagination {
    display: grid
  }
  .krep-family-pagination p {
    text-align: left
  }
  .krep-family-filter-groups {
    grid-template-columns: 1fr
  }
  .krep-family-filter-column .krep-filter-apply {
    max-width: none
  }
}