.bc-showcase,
.bc-showcase * {
  box-sizing: border-box;
}

.bc-showcase {
  --bc-gutter: var(--bc-gutter-desktop, 100px);
  --bc-card-gap: var(--bc-card-gap-desktop, 54px);
  --bc-image-height: var(--bc-image-height-desktop, 438px);
  --bc-area-w: var(--bc-area-w-d, 1200px);
  --bc-h-size: var(--bc-h-size-d, 40px);
  --bc-d-size: var(--bc-d-size-d, 17px);
  --bc-rows: var(--bc-rows-desktop, 1);
  --bc-row-gap: var(--bc-row-gap-desktop, 40px);
  --bc-ratio: var(--bc-image-ratio, 244 / 424);
  position: relative;
  left: 50%;
  width: 100vw;
  max-width: 100vw;
  margin-left: -50vw;
  overflow: hidden;
  background: var(--bc-bg, #fff);
  color: var(--bc-text, #373737);
  font-family: var(--bc-font-family, "Poppins", "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif);
  font-size: var(--bc-base-font-size, 16px);
  font-weight: 400;
  line-height: 1.45;
  text-align: left;
}

.bc-showcase.is-contained {
  left: auto;
  width: 100% !important;
  max-width: none !important;
  margin-left: 0;
}

.bc-showcase.has-no-sidebar-line .bc-sidebar {
  border-right: 0;
}

/* optional heading + description above the gallery */
.bc-heading {
  max-width: max(var(--bc-area-w, 1200px), var(--bc-d-w, 820px));
  margin: 0 auto var(--bc-area-mb, 28px);
  padding: var(--bc-area-pad, 0);
  text-align: var(--bc-h-align, left);
  background: var(--bc-area-bg, transparent);
  border: var(--bc-area-bw, 0) var(--bc-area-bs, solid) var(--bc-area-bc, #373737);
  border-radius: var(--bc-area-radius, 0);
}
.bc-showcase.h-left .bc-heading, .bc-showcase.h-left .bc-desc { margin-left: 0; }
.bc-showcase.h-right .bc-heading, .bc-showcase.h-right .bc-desc { margin-right: 0; }
.bc-title {
  display: block;
  margin: 0;
  padding: var(--bc-h-pad, 0);
  background: var(--bc-h-bg, transparent);
  border: var(--bc-h-bw, 0) var(--bc-h-bs, solid) var(--bc-h-bc, #373737);
  border-radius: var(--bc-h-radius, 0);
  color: var(--bc-h-color, #373737);
  font-family: inherit;
  font-size: var(--bc-h-size, 40px);
  font-weight: var(--bc-h-weight, 400);
  line-height: var(--bc-h-lh, 1.15);
  letter-spacing: var(--bc-h-ls, 0);
  text-transform: var(--bc-h-tt, none);
}
.bc-desc {
  display: block;
  max-width: var(--bc-d-w, 820px);
  margin: var(--bc-d-mt, 12px) auto 0;
  padding: var(--bc-d-pad, 0);
  background: var(--bc-d-bg, transparent);
  border: var(--bc-d-bw, 0) var(--bc-d-bs, solid) var(--bc-d-bc, #373737);
  border-radius: var(--bc-d-radius, 0);
  color: var(--bc-d-color, #5a5a58);
  font-size: var(--bc-d-size, 17px);
  font-weight: var(--bc-d-weight, 400);
  line-height: var(--bc-d-lh, 1.6);
  letter-spacing: var(--bc-d-ls, 0);
}
.bc-heading-wrap {
  max-width: var(--bc-max-width, 2048px);
  margin: 0 auto;
  padding: var(--bc-padding-top, 42px) var(--bc-gutter) 0;
}
.bc-heading-wrap + .bc-shell { padding-top: 0; }

.bc-showcase button,
.bc-showcase a,
.bc-showcase h3 {
  font-family: inherit;
}

.bc-shell {
  display: grid;
  grid-template-columns: var(--bc-sidebar-width, 335px) minmax(0, 1fr);
  column-gap: var(--bc-sidebar-gap, 36px);
  width: 100%;
  max-width: var(--bc-max-width, 2048px);
  min-height: calc(var(--bc-min-height, 720px) + var(--bc-padding-top, 42px) + var(--bc-padding-bottom, 48px));
  margin: 0 auto;
  padding: var(--bc-padding-top, 42px) var(--bc-gutter) var(--bc-padding-bottom, 48px);
}

.bc-showcase.has-no-sidebar .bc-shell {
  grid-template-columns: minmax(0, 1fr);
}

.bc-sidebar {
  align-self: start;
  min-width: 0;
  min-height: calc(var(--bc-image-height) + 80px);
  margin-top: var(--bc-sidebar-top, 109px);
  padding-right: var(--bc-sidebar-padding, 34px);
  border-right: 1px solid var(--bc-line, #c9c7c1);
}

.bc-sidebar-title {
  margin: 0 0 16px;
  color: var(--bc-muted, #8a8a86);
  font-size: var(--bc-sidebar-title-size, 17px);
  font-weight: var(--bc-sidebar-title-weight, 400);
  letter-spacing: var(--bc-sidebar-title-ls, 0);
  text-transform: var(--bc-sidebar-title-tt, none);
  line-height: 1.2;
}

.bc-brand-select-wrap { display: none; }

.bc-brand-list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--bc-brand-gap, 7px);
}

.bc-brand-filter {
  display: block;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  outline-offset: 4px;
  background: transparent;
  box-shadow: none;
  color: var(--bc-brand-color, var(--bc-text, #373737));
  font-size: var(--bc-brand-font-size, 17px);
  font-weight: var(--bc-brand-weight, 400);
  line-height: var(--bc-brand-lh, 1.5);
  letter-spacing: var(--bc-brand-ls, 0);
  text-transform: var(--bc-brand-tt, none);
  text-align: left;
  cursor: pointer;
  transition: opacity 160ms ease, font-weight 160ms ease;
  appearance: none;
}

.bc-brand-filter:hover {
  background: transparent;
  color: var(--bc-brand-color, var(--bc-text, #373737));
  opacity: 0.7;
}

.bc-brand-filter.is-active {
  color: var(--bc-brand-active-color, var(--bc-text, #373737));
  font-weight: var(--bc-active-weight, 600);
}

.bc-main {
  position: relative;
  min-width: 0;
}

.bc-toolbar {
  position: relative;
  height: var(--bc-toolbar-height, 61px);
}

.bc-counter {
  height: 27px;
  color: var(--bc-counter-color, var(--bc-text, #373737));
  font-size: var(--bc-counter-size, 17px);
  font-variant-numeric: tabular-nums;
  font-weight: var(--bc-counter-weight, 400);
  line-height: 1.45;
}

.bc-toolbar,
.bc-track-viewport,
.bc-shell,
.bc-main {
  max-width: none !important;
  float: none;
}
.bc-toolbar,
.bc-track-viewport {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.bc-line-row {
  position: absolute !important;
  left: 0 !important;
  right: var(--bc-controls-right, -2px) !important;
  bottom: -9px;
  width: auto !important;
  max-width: none !important;
  display: flex;
  align-items: center;
  gap: var(--bc-line-arrow-gap, 46px);
  min-height: var(--bc-arrow-size, 27px);
}

.bc-progress {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  height: var(--bc-progress-thickness, 3px);
  overflow: hidden;
  background: var(--bc-line, #c9c7c1);
}

.bc-progress span {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--bc-progress-color, #4c4c4a);
  transform: scaleX(1);
  transform-origin: left center;
  transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.bc-controls {
  position: relative;
  z-index: 2;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: var(--bc-arrow-gap, 29px);
  margin-left: auto;
  color: var(--bc-arrow-color, #373737);
  transform: translateX(var(--bc-arrows-right-shift, 0px));
}

.bc-nav {
  position: relative;
  width: var(--bc-arrow-size, 27px);
  height: var(--bc-arrow-size, 27px);
  min-width: var(--bc-arrow-size, 27px);
  min-height: var(--bc-arrow-size, 27px);
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  outline-offset: 3px;
  background: transparent;
  box-shadow: none;
  color: inherit;
  cursor: pointer;
  appearance: none;
}

.bc-nav:hover,
.bc-nav:focus {
  background: transparent;
  color: inherit;
}

.bc-nav:disabled {
  cursor: default;
  opacity: 0.23;
}

.bc-nav span,
.bc-nav span::after {
  position: absolute;
  display: block;
  content: "";
}

.bc-nav span {
  top: 50%;
  left: 3px;
  width: calc(100% - 7px);
  height: var(--bc-arrow-stroke, 1px);
  background: currentColor;
  transform: translateY(-50%);
}

.bc-nav span::after {
  top: -4px;
  width: 9px;
  height: 9px;
  border-top: var(--bc-arrow-stroke, 1px) solid currentColor;
  border-right: var(--bc-arrow-stroke, 1px) solid currentColor;
}

.bc-prev span::after {
  left: 0;
  transform: rotate(-135deg);
}

.bc-next span::after {
  right: 0;
  transform: rotate(45deg);
}

.bc-track-viewport {
  position: relative;
  width: 100%;
  margin-top: var(--bc-cards-top-gap, 47px);
  overflow: hidden;
}

.bc-track {
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(var(--bc-rows, 1), auto);
  align-items: start;
  column-gap: var(--bc-card-gap);
  row-gap: var(--bc-row-gap, 40px);
  /* replaced with the exact width by the script; this keeps the layout sane before it runs */
  grid-auto-columns: calc((100% - var(--bc-card-gap) * 4) / 5);
  width: 100%;
  transform: translate3d(0, 0, 0);
  transition: transform var(--bc-slide-ms, 550ms) cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform;
}

/* Stacked layout: the colours fill rows down the page instead of sliding sideways.
   The script adds this class for the screens set to "Stacked". */
.bc-showcase.is-grid .bc-track-viewport {
  overflow: visible;
}

.bc-showcase.is-grid .bc-track {
  grid-auto-flow: row;
  grid-template-rows: none;
  transform: none !important;
  transition: none;
}

.bc-showcase.is-grid .bc-toolbar {
  display: none;
}

.bc-card {
  display: block;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: var(--bc-bg, #fff);
}

.bc-card[hidden] {
  display: none !important;
}

.bc-card-title {
  min-height: 27px;
  margin: 0 0 var(--bc-title-gap, 9px);
  padding: 0;
  color: var(--bc-title-color, var(--bc-text, #373737));
  font-size: var(--bc-title-size, 18px);
  font-weight: var(--bc-title-weight, 400);
  line-height: var(--bc-title-lh, 1.5);
  letter-spacing: var(--bc-title-ls, 0.2px);
  text-transform: var(--bc-title-tt, none);
  text-align: left;
}

.bc-image-link {
  position: relative;
  display: block;
  width: 100%;
  height: var(--bc-image-height);
  max-width: none !important;
  overflow: hidden;
  border-radius: var(--bc-image-radius, 0);
  border: var(--bc-image-border, 0) solid var(--bc-image-border-color, #c9c7c1);
  background: var(--bc-project-bg, #efefeb);
  color: inherit;
  text-decoration: none;
  isolation: isolate;
}

.bc-card-image {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  border: 0;
  border-radius: inherit;
  object-fit: var(--bc-image-fit, cover);
  object-position: var(--bc-image-position, center);
  transform: scale(var(--bc-hover-zoom, 1.08));
  transition: transform var(--bc-hover-duration, 1200ms) cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform;
}

/* proportional images: width : height follows the reference (244 : 424) at every screen width */
.bc-showcase.is-ratio .bc-image-link {
  height: auto;
  aspect-ratio: var(--bc-ratio, 244 / 424);
}
.bc-showcase.is-ratio .bc-image-link .bc-card-image { position: absolute; inset: 0; }

.bc-image-link:hover .bc-card-image,
.bc-image-link:focus .bc-card-image {
  transform: scale(1);
}

/* Soft shade over each picture that clears when the mouse comes over it. */
.bc-dim {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  border-radius: inherit;
  pointer-events: none;
  background: var(--bc-dim-color, #000);
  opacity: var(--bc-dim, 0.22);
  transition: opacity var(--bc-dim-duration, 450ms) cubic-bezier(0.22, 1, 0.36, 1);
}

.bc-image-link:hover .bc-dim,
.bc-image-link:focus .bc-dim,
.bc-image-link:focus-within .bc-dim {
  opacity: var(--bc-dim-hover, 0);
}

/* "NEW" badge, one corner of the picture. */
.bc-new {
  position: absolute;
  z-index: 2;
  display: block;
  box-sizing: border-box;
  width: var(--bc-new-width, auto);
  margin: 0;
  padding: var(--bc-new-pad-y, 5px) var(--bc-new-pad-x, 10px);
  border: var(--bc-new-bw, 0) var(--bc-new-bs, solid) var(--bc-new-bc, #fff);
  border-radius: var(--bc-new-radius, 3px);
  background: var(--bc-new-bg, #c8102e);
  color: var(--bc-new-color, #fff);
  font-family: inherit;
  font-size: var(--bc-new-size, 12px);
  font-weight: var(--bc-new-weight, 600);
  line-height: 1.2;
  letter-spacing: var(--bc-new-ls, 0.6px);
  text-align: var(--bc-new-align, center);
  text-transform: var(--bc-new-tt, uppercase);
  white-space: nowrap;
  pointer-events: none;
}

.bc-new--top-right { top: var(--bc-new-y, 12px); right: var(--bc-new-x, 12px); }
.bc-new--top-left { top: var(--bc-new-y, 12px); left: var(--bc-new-x, 12px); }
.bc-new--bottom-right { bottom: var(--bc-new-y, 12px); right: var(--bc-new-x, 12px); }
.bc-new--bottom-left { bottom: var(--bc-new-y, 12px); left: var(--bc-new-x, 12px); }

.bc-project-popup {
  box-sizing: border-box;
  position: fixed;
  z-index: 999999;
  top: 0;
  left: 0;
  display: block;
  width: min(var(--bc-project-width, 700px), calc(100vw - 24px));
  height: min(var(--bc-project-height, 450px), calc(100vh - 24px));
  overflow: hidden;
  border-radius: var(--bc-project-radius, 0);
  background: var(--bc-project-bg, #fff);
  box-shadow: var(--bc-project-shadow, 0 8px 24px rgba(0, 0, 0, 0.18));
  opacity: 0;
  visibility: hidden;
  transform: scale(0.975);
  transform-origin: center;
  transition: opacity var(--bc-project-duration, 550ms) ease, transform var(--bc-project-duration, 550ms) cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear var(--bc-project-duration, 550ms);
  pointer-events: none;
}

.bc-project-image {
  box-sizing: border-box;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  border: 0;
  object-fit: var(--bc-project-fit, cover);
}

.bc-project-popup.is-visible {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
  transition-delay: 0s;
}

@media (hover: none), (pointer: coarse) {
  .bc-project-popup {
    display: none !important;
  }
}

.bc-view-link:not([href]) { cursor: default; }
.bc-view-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 13px;
  min-height: 31px;
  margin-top: var(--bc-view-gap, 10px);
  padding: 0 0 5px;
  border-bottom: var(--bc-link-line-w, 1px) solid var(--bc-link-line, #272725);
  font-size: var(--bc-view-size, 17px);
  font-weight: var(--bc-view-weight, 400);
  line-height: 1.2;
  text-decoration: none;
  transition: color 250ms ease, border-color 250ms ease;
}

/* The colors are forced because a theme's own link rules (usually an ID selector on
   the section) otherwise win over these, and the settings then look like they do
   nothing. Scoped to this gallery — no other link on the page is touched. */
.bc-showcase .bc-view-link,
.bc-showcase .bc-view-link:link,
.bc-showcase .bc-view-link:visited {
  color: var(--bc-link-color, #272725) !important;
  border-bottom-color: var(--bc-link-line, #272725) !important;
  text-decoration: none !important;
}

.bc-showcase .bc-view-link:hover,
.bc-showcase .bc-view-link:focus,
.bc-showcase .bc-view-link:active {
  color: var(--bc-link-hover, #8a8a86) !important;
  border-bottom-color: var(--bc-link-line-hover, #8a8a86) !important;
  text-decoration: none !important;
}

.bc-view-link i,
.bc-quote i {
  position: relative;
  display: block;
  flex: 0 0 auto;
  width: 22px;
  height: 17px;
  font-style: normal;
}

.bc-view-link i::before,
.bc-view-link i::after,
.bc-quote i::before,
.bc-quote i::after {
  position: absolute;
  display: block;
  content: "";
}

.bc-view-link i::before {
  top: 8px;
  left: 0;
  width: 21px;
  height: 1px;
  background: currentColor;
}

.bc-view-link i::after {
  top: 3px;
  right: 0;
  width: 10px;
  height: 10px;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: rotate(45deg);
}

.bc-quote {
  position: absolute;
  z-index: 5;
  top: var(--bc-quote-top, 251px);
  right: calc(var(--bc-quote-right, 100px) * -1);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  width: var(--bc-quote-width, 322px);
  height: var(--bc-quote-height, 75px);
  padding: 0 26px;
  border: 0;
  border-radius: var(--bc-quote-radius, 5px) 0 0 var(--bc-quote-radius, 5px);
  background: var(--bc-quote-bg, #ffeb72);
  box-shadow: 0 3px 8px rgba(34, 34, 25, 0.14);
  color: var(--bc-quote-color, #0f0f0c);
  font-size: var(--bc-quote-font-size, 17px);
  font-weight: var(--bc-quote-font-weight, 600);
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  transition: filter 180ms ease;
}

.bc-quote:hover,
.bc-quote:focus {
  color: var(--bc-quote-color, #0f0f0c);
  text-decoration: none;
  filter: brightness(0.97);
}

.bc-quote i {
  width: 28px;
  height: 28px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
}

.bc-quote i::before {
  top: 12px;
  left: 7px;
  width: 11px;
  height: 1px;
  background: currentColor;
}

.bc-quote i::after {
  top: 8px;
  right: 7px;
  width: 7px;
  height: 7px;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: rotate(45deg);
}

.bc-empty {
  margin-top: 70px;
  padding: 50px 20px;
  border: 1px solid var(--bc-line, #c9c7c1);
  color: var(--bc-muted, #8a8a86);
  font-size: var(--bc-base-font-size, 16px);
  text-align: center;
}

@media (max-width: 1439px) and (min-width: 900px) {
  .bc-showcase {
    --bc-gutter: var(--bc-gutter-tablet, 42px);
    --bc-card-gap: var(--bc-card-gap-tablet, 28px);
    --bc-image-height: var(--bc-image-height-tablet, 430px);
    --bc-rows: var(--bc-rows-tablet, 1);
    --bc-row-gap: var(--bc-row-gap-tablet, 28px);
    --bc-ratio: var(--bc-image-ratio-t, 244 / 424);
    --bc-area-w: var(--bc-area-w-t, 900px);
    --bc-h-size: var(--bc-h-size-t, 34px);
    --bc-d-size: var(--bc-d-size-t, 16px);
  }

  .bc-shell {
    grid-template-columns: min(var(--bc-sidebar-width, 335px), 200px) minmax(0, 1fr);
  }
}

@media (max-width: 899px) {
  .bc-showcase {
    --bc-gutter: var(--bc-gutter-tablet, 42px);
    --bc-card-gap: var(--bc-card-gap-tablet, 28px);
    --bc-image-height: var(--bc-image-height-small, 480px);
    --bc-rows: var(--bc-rows-small, 1);
    --bc-row-gap: var(--bc-row-gap-tablet, 28px);
    --bc-ratio: var(--bc-image-ratio-s, 220 / 300);
    --bc-area-w: var(--bc-area-w-t, 900px);
    --bc-h-size: var(--bc-h-size-t, 34px);
    --bc-d-size: var(--bc-d-size-t, 16px);
  }

  .bc-shell {
    display: flex;
    flex-direction: column;
    min-height: 0;
  }

  .bc-sidebar {
    order: 1;
    align-self: stretch;
    width: 100%;
    min-height: 0;
    margin: 0 0 27px;
    padding: 0 0 20px;
    border-right: 0;
    border-bottom: 1px solid var(--bc-line, #c9c7c1);
  }

  .bc-sidebar-title {
    margin-bottom: 13px;
  }

  .bc-brand-list {
    flex-direction: row;
    align-items: center;
    gap: 9px;
    width: 100%;
    padding-bottom: 2px;
    overflow-x: auto;
    scrollbar-width: thin;
  }

  .bc-brand-filter {
    flex: 0 0 auto;
    padding: 7px 13px;
    border: 1px solid var(--bc-line, #d6d4cf);
    border-radius: 999px;
    line-height: 1.2;
  }

  .bc-brand-filter:hover {
    background: color-mix(in srgb, var(--bc-bg, #fff) 94%, var(--bc-text, #373737));
  }

  .bc-brand-filter.is-active {
    border-color: var(--bc-active-filter-bg, #30302e);
    background: var(--bc-active-filter-bg, #30302e);
    color: var(--bc-active-filter-fg, #fff);
  }

  .bc-main {
    order: 2;
  }

  .bc-quote {
    position: relative;
    top: auto;
    right: auto;
    width: min(100%, var(--bc-quote-width, 322px));
    margin-top: 36px;
    border-radius: var(--bc-quote-radius, 5px);
  }
}

@media (max-width: 599px) {
  .bc-showcase {
    --bc-gutter: var(--bc-gutter-mobile, 19px);
    --bc-card-gap: var(--bc-card-gap-mobile, 9px);
    --bc-image-height: var(--bc-image-height-mobile, 520px);
    --bc-rows: var(--bc-rows-mobile, 1);
    --bc-row-gap: var(--bc-row-gap-mobile, 18px);
    --bc-ratio: var(--bc-image-ratio-p, 168 / 200);
    --bc-area-w: var(--bc-area-w-p, 600px);
    --bc-h-size: var(--bc-h-size-p, 28px);
    --bc-d-size: var(--bc-d-size-p, 15px);
  }

  /* reference phone layout: "Brands" label, dropdown, counter, line + arrows, 2.2 cards */
  .bc-shell {
    padding-top: var(--bc-padding-top-p, 40px);
    padding-bottom: var(--bc-padding-bottom-p, 40px);
    min-height: 0;
  }
  .bc-heading-wrap { padding-top: var(--bc-padding-top-p, 40px); }
  .bc-sidebar { align-self: stretch; width: 100%; margin: 0 0 8px; padding: 0; border: 0; }
  .bc-sidebar-title { margin: 0 0 18px; font-size: var(--bc-sidebar-title-size, 17px); }
  .bc-brand-list { display: none; }
  .bc-showcase[style*="--bc-filter-style:pills"] .bc-brand-list { display: flex; }
  .bc-showcase[style*="--bc-filter-style:pills"] .bc-brand-select-wrap { display: none; }
  .bc-brand-select-wrap {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
  }
  .bc-brand-select {
    display: block;
    width: 100%;
    height: 47px;
    margin: 0;
    padding: 0 44px 0 16px;
    border: 1px solid var(--bc-line, #c9c7c1);
    border-radius: 0;
    background: var(--bc-bg, #fff);
    color: var(--bc-text, #373737);
    font-family: inherit;
    font-size: var(--bc-brand-font-size-p, 17px);
    font-weight: 400;
    line-height: 45px;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
  }
  .bc-brand-select:focus { outline: 2px solid var(--bc-text, #373737); outline-offset: 2px; }
  .bc-brand-select-wrap i {
    position: absolute;
    top: 50%;
    right: 20px;
    width: 9px;
    height: 9px;
    margin-top: -7px;
    border-right: 1.5px solid var(--bc-text, #373737);
    border-bottom: 1.5px solid var(--bc-text, #373737);
    transform: rotate(45deg);
    pointer-events: none;
  }
  .bc-toolbar { height: auto; }
  .bc-counter { height: auto; font-size: var(--bc-counter-size-p, 16px); line-height: 1.4; }
  .bc-line-row { position: static !important; margin-top: 20px; min-height: 22px; gap: 36px; }
  .bc-progress { height: 3px; }
  .bc-controls { gap: 26px; }
  .bc-nav { width: 22px; height: 22px; min-width: 22px; min-height: 22px; }
  .bc-track-viewport { margin-top: 32px; }
  .bc-card-title { min-height: 0; margin: 0 0 8px; font-size: var(--bc-title-size-p, 17px); }
  .bc-view-link { margin-top: 23px; font-size: var(--bc-view-size-p, 17px); }
  .bc-new { font-size: var(--bc-new-size-p, 11px); }
  .bc-quote { width: 100%; margin-top: 30px; }
}

@media (prefers-reduced-motion: reduce) {
  .bc-track,
  .bc-progress span,
  .bc-card-image,
  .bc-dim,
  .bc-project-popup,
  .bc-quote {
    transition: none !important;
  }
}

/* ------------------------------------------------------------------ *
 * Typography, per device. Every element takes its font, size, weight,
 * colour, line height, letter spacing and case from its own variables,
 * and the stylesheet swaps which set is in use at each screen. The
 * declarations are forced because a theme's heading, paragraph, button and
 * link rules would otherwise win over them.
 * ------------------------------------------------------------------ */
.bc-showcase {
  --bct-heading-font: var(--bct-heading-font-d);
  --bct-heading-size: var(--bct-heading-size-d);
  --bct-heading-weight: var(--bct-heading-weight-d);
  --bct-heading-color: var(--bct-heading-color-d);
  --bct-heading-lh: var(--bct-heading-lh-d);
  --bct-heading-ls: var(--bct-heading-ls-d);
  --bct-heading-tt: var(--bct-heading-tt-d);
  --bct-desc-font: var(--bct-desc-font-d);
  --bct-desc-size: var(--bct-desc-size-d);
  --bct-desc-weight: var(--bct-desc-weight-d);
  --bct-desc-color: var(--bct-desc-color-d);
  --bct-desc-lh: var(--bct-desc-lh-d);
  --bct-desc-ls: var(--bct-desc-ls-d);
  --bct-desc-tt: var(--bct-desc-tt-d);
  --bct-sidebar-font: var(--bct-sidebar-font-d);
  --bct-sidebar-size: var(--bct-sidebar-size-d);
  --bct-sidebar-weight: var(--bct-sidebar-weight-d);
  --bct-sidebar-color: var(--bct-sidebar-color-d);
  --bct-sidebar-lh: var(--bct-sidebar-lh-d);
  --bct-sidebar-ls: var(--bct-sidebar-ls-d);
  --bct-sidebar-tt: var(--bct-sidebar-tt-d);
  --bct-brand-font: var(--bct-brand-font-d);
  --bct-brand-size: var(--bct-brand-size-d);
  --bct-brand-weight: var(--bct-brand-weight-d);
  --bct-brand-color: var(--bct-brand-color-d);
  --bct-brand-lh: var(--bct-brand-lh-d);
  --bct-brand-ls: var(--bct-brand-ls-d);
  --bct-brand-tt: var(--bct-brand-tt-d);
  --bct-cardtitle-font: var(--bct-cardtitle-font-d);
  --bct-cardtitle-size: var(--bct-cardtitle-size-d);
  --bct-cardtitle-weight: var(--bct-cardtitle-weight-d);
  --bct-cardtitle-color: var(--bct-cardtitle-color-d);
  --bct-cardtitle-lh: var(--bct-cardtitle-lh-d);
  --bct-cardtitle-ls: var(--bct-cardtitle-ls-d);
  --bct-cardtitle-tt: var(--bct-cardtitle-tt-d);
  --bct-viewlink-font: var(--bct-viewlink-font-d);
  --bct-viewlink-size: var(--bct-viewlink-size-d);
  --bct-viewlink-weight: var(--bct-viewlink-weight-d);
  --bct-viewlink-color: var(--bct-viewlink-color-d);
  --bct-viewlink-lh: var(--bct-viewlink-lh-d);
  --bct-viewlink-ls: var(--bct-viewlink-ls-d);
  --bct-viewlink-tt: var(--bct-viewlink-tt-d);
  --bct-counter-font: var(--bct-counter-font-d);
  --bct-counter-size: var(--bct-counter-size-d);
  --bct-counter-weight: var(--bct-counter-weight-d);
  --bct-counter-color: var(--bct-counter-color-d);
  --bct-counter-lh: var(--bct-counter-lh-d);
  --bct-counter-ls: var(--bct-counter-ls-d);
  --bct-counter-tt: var(--bct-counter-tt-d);
}

@media (max-width: 1024px) {
  .bc-showcase {
    --bct-heading-font: var(--bct-heading-font-t);
    --bct-heading-size: var(--bct-heading-size-t);
    --bct-heading-weight: var(--bct-heading-weight-t);
    --bct-heading-color: var(--bct-heading-color-t);
    --bct-heading-lh: var(--bct-heading-lh-t);
    --bct-heading-ls: var(--bct-heading-ls-t);
    --bct-heading-tt: var(--bct-heading-tt-t);
    --bct-desc-font: var(--bct-desc-font-t);
    --bct-desc-size: var(--bct-desc-size-t);
    --bct-desc-weight: var(--bct-desc-weight-t);
    --bct-desc-color: var(--bct-desc-color-t);
    --bct-desc-lh: var(--bct-desc-lh-t);
    --bct-desc-ls: var(--bct-desc-ls-t);
    --bct-desc-tt: var(--bct-desc-tt-t);
    --bct-sidebar-font: var(--bct-sidebar-font-t);
    --bct-sidebar-size: var(--bct-sidebar-size-t);
    --bct-sidebar-weight: var(--bct-sidebar-weight-t);
    --bct-sidebar-color: var(--bct-sidebar-color-t);
    --bct-sidebar-lh: var(--bct-sidebar-lh-t);
    --bct-sidebar-ls: var(--bct-sidebar-ls-t);
    --bct-sidebar-tt: var(--bct-sidebar-tt-t);
    --bct-brand-font: var(--bct-brand-font-t);
    --bct-brand-size: var(--bct-brand-size-t);
    --bct-brand-weight: var(--bct-brand-weight-t);
    --bct-brand-color: var(--bct-brand-color-t);
    --bct-brand-lh: var(--bct-brand-lh-t);
    --bct-brand-ls: var(--bct-brand-ls-t);
    --bct-brand-tt: var(--bct-brand-tt-t);
    --bct-cardtitle-font: var(--bct-cardtitle-font-t);
    --bct-cardtitle-size: var(--bct-cardtitle-size-t);
    --bct-cardtitle-weight: var(--bct-cardtitle-weight-t);
    --bct-cardtitle-color: var(--bct-cardtitle-color-t);
    --bct-cardtitle-lh: var(--bct-cardtitle-lh-t);
    --bct-cardtitle-ls: var(--bct-cardtitle-ls-t);
    --bct-cardtitle-tt: var(--bct-cardtitle-tt-t);
    --bct-viewlink-font: var(--bct-viewlink-font-t);
    --bct-viewlink-size: var(--bct-viewlink-size-t);
    --bct-viewlink-weight: var(--bct-viewlink-weight-t);
    --bct-viewlink-color: var(--bct-viewlink-color-t);
    --bct-viewlink-lh: var(--bct-viewlink-lh-t);
    --bct-viewlink-ls: var(--bct-viewlink-ls-t);
    --bct-viewlink-tt: var(--bct-viewlink-tt-t);
    --bct-counter-font: var(--bct-counter-font-t);
    --bct-counter-size: var(--bct-counter-size-t);
    --bct-counter-weight: var(--bct-counter-weight-t);
    --bct-counter-color: var(--bct-counter-color-t);
    --bct-counter-lh: var(--bct-counter-lh-t);
    --bct-counter-ls: var(--bct-counter-ls-t);
    --bct-counter-tt: var(--bct-counter-tt-t);
  }
}

@media (max-width: 767px) {
  .bc-showcase {
    --bct-heading-font: var(--bct-heading-font-p);
    --bct-heading-size: var(--bct-heading-size-p);
    --bct-heading-weight: var(--bct-heading-weight-p);
    --bct-heading-color: var(--bct-heading-color-p);
    --bct-heading-lh: var(--bct-heading-lh-p);
    --bct-heading-ls: var(--bct-heading-ls-p);
    --bct-heading-tt: var(--bct-heading-tt-p);
    --bct-desc-font: var(--bct-desc-font-p);
    --bct-desc-size: var(--bct-desc-size-p);
    --bct-desc-weight: var(--bct-desc-weight-p);
    --bct-desc-color: var(--bct-desc-color-p);
    --bct-desc-lh: var(--bct-desc-lh-p);
    --bct-desc-ls: var(--bct-desc-ls-p);
    --bct-desc-tt: var(--bct-desc-tt-p);
    --bct-sidebar-font: var(--bct-sidebar-font-p);
    --bct-sidebar-size: var(--bct-sidebar-size-p);
    --bct-sidebar-weight: var(--bct-sidebar-weight-p);
    --bct-sidebar-color: var(--bct-sidebar-color-p);
    --bct-sidebar-lh: var(--bct-sidebar-lh-p);
    --bct-sidebar-ls: var(--bct-sidebar-ls-p);
    --bct-sidebar-tt: var(--bct-sidebar-tt-p);
    --bct-brand-font: var(--bct-brand-font-p);
    --bct-brand-size: var(--bct-brand-size-p);
    --bct-brand-weight: var(--bct-brand-weight-p);
    --bct-brand-color: var(--bct-brand-color-p);
    --bct-brand-lh: var(--bct-brand-lh-p);
    --bct-brand-ls: var(--bct-brand-ls-p);
    --bct-brand-tt: var(--bct-brand-tt-p);
    --bct-cardtitle-font: var(--bct-cardtitle-font-p);
    --bct-cardtitle-size: var(--bct-cardtitle-size-p);
    --bct-cardtitle-weight: var(--bct-cardtitle-weight-p);
    --bct-cardtitle-color: var(--bct-cardtitle-color-p);
    --bct-cardtitle-lh: var(--bct-cardtitle-lh-p);
    --bct-cardtitle-ls: var(--bct-cardtitle-ls-p);
    --bct-cardtitle-tt: var(--bct-cardtitle-tt-p);
    --bct-viewlink-font: var(--bct-viewlink-font-p);
    --bct-viewlink-size: var(--bct-viewlink-size-p);
    --bct-viewlink-weight: var(--bct-viewlink-weight-p);
    --bct-viewlink-color: var(--bct-viewlink-color-p);
    --bct-viewlink-lh: var(--bct-viewlink-lh-p);
    --bct-viewlink-ls: var(--bct-viewlink-ls-p);
    --bct-viewlink-tt: var(--bct-viewlink-tt-p);
    --bct-counter-font: var(--bct-counter-font-p);
    --bct-counter-size: var(--bct-counter-size-p);
    --bct-counter-weight: var(--bct-counter-weight-p);
    --bct-counter-color: var(--bct-counter-color-p);
    --bct-counter-lh: var(--bct-counter-lh-p);
    --bct-counter-ls: var(--bct-counter-ls-p);
    --bct-counter-tt: var(--bct-counter-tt-p);
  }
}

.bc-showcase .bc-title {
  font-family: var(--bct-heading-font) !important;
  font-size: var(--bct-heading-size) !important;
  font-weight: var(--bct-heading-weight) !important;
  color: var(--bct-heading-color) !important;
  line-height: var(--bct-heading-lh) !important;
  letter-spacing: var(--bct-heading-ls) !important;
  text-transform: var(--bct-heading-tt) !important;
}

.bc-showcase .bc-desc {
  font-family: var(--bct-desc-font) !important;
  font-size: var(--bct-desc-size) !important;
  font-weight: var(--bct-desc-weight) !important;
  color: var(--bct-desc-color) !important;
  line-height: var(--bct-desc-lh) !important;
  letter-spacing: var(--bct-desc-ls) !important;
  text-transform: var(--bct-desc-tt) !important;
}

.bc-showcase .bc-sidebar-title {
  font-family: var(--bct-sidebar-font) !important;
  font-size: var(--bct-sidebar-size) !important;
  font-weight: var(--bct-sidebar-weight) !important;
  color: var(--bct-sidebar-color) !important;
  line-height: var(--bct-sidebar-lh) !important;
  letter-spacing: var(--bct-sidebar-ls) !important;
  text-transform: var(--bct-sidebar-tt) !important;
}

.bc-showcase .bc-brand-filter, .bc-showcase .bc-brand-select {
  font-family: var(--bct-brand-font) !important;
  font-size: var(--bct-brand-size) !important;
  font-weight: var(--bct-brand-weight) !important;
  color: var(--bct-brand-color) !important;
  line-height: var(--bct-brand-lh) !important;
  letter-spacing: var(--bct-brand-ls) !important;
  text-transform: var(--bct-brand-tt) !important;
}

.bc-showcase .bc-card-title {
  font-family: var(--bct-cardtitle-font) !important;
  font-size: var(--bct-cardtitle-size) !important;
  font-weight: var(--bct-cardtitle-weight) !important;
  color: var(--bct-cardtitle-color) !important;
  line-height: var(--bct-cardtitle-lh) !important;
  letter-spacing: var(--bct-cardtitle-ls) !important;
  text-transform: var(--bct-cardtitle-tt) !important;
}

.bc-showcase .bc-view-link {
  font-family: var(--bct-viewlink-font) !important;
  font-size: var(--bct-viewlink-size) !important;
  font-weight: var(--bct-viewlink-weight) !important;
  color: var(--bct-viewlink-color) !important;
  line-height: var(--bct-viewlink-lh) !important;
  letter-spacing: var(--bct-viewlink-ls) !important;
  text-transform: var(--bct-viewlink-tt) !important;
}

.bc-showcase .bc-counter {
  font-family: var(--bct-counter-font) !important;
  font-size: var(--bct-counter-size) !important;
  font-weight: var(--bct-counter-weight) !important;
  color: var(--bct-counter-color) !important;
  line-height: var(--bct-counter-lh) !important;
  letter-spacing: var(--bct-counter-ls) !important;
  text-transform: var(--bct-counter-tt) !important;
}

.bc-showcase .bc-view-link:hover,
.bc-showcase .bc-view-link:focus,
.bc-showcase .bc-view-link:active {
  color: var(--bc-link-hover, #8a8a86) !important;
}

.bc-showcase .bc-brand-filter.is-active {
  font-weight: var(--bc-active-weight, var(--bct-brand-weight)) !important;
  color: var(--bc-brand-active-color, var(--bct-brand-color)) !important;
}