:root {
  --bw-card-action-bg: #eef0f3;
  --bw-card-action-color: #5f6671;
  --bw-card-action-hover-bg: #25272b;
  --bw-card-hover-easing: cubic-bezier(0, 0, .5, 1);
  --bw-card-hover-scale: 1.015;
}

.bw-interaction-scope .bw-card-action {
  position: absolute;
  right: 34px;
  bottom: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  background: var(--bw-card-action-bg);
  color: var(--bw-card-action-color);
  font-size: 28px;
  line-height: 1;
  font-weight: 700;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  transition: background-color .2s var(--bw-card-hover-easing), color .2s var(--bw-card-hover-easing);
}

.bw-interaction-scope .bw-card-action span {
  display: block;
  margin-top: -2px;
}

.bw-interaction-scope .bws-project-filter-button.bw-interactive-card {
  --bw-filter-hover-scale: 1.075;
  --bw-filter-hover-bg: #fff;
  --bw-filter-hover-border: rgba(31, 31, 31, .12);
  --bw-filter-hover-shadow: 0 1px 2px rgba(18, 24, 32, .035), 0 12px 26px rgba(18, 24, 32, .055);
  position: relative;
  isolation: isolate;
  overflow: visible;
}

.bw-interaction-scope .bws-project-filter-button.bw-interactive-card.is-active {
  --bw-filter-hover-bg: #24262a;
  --bw-filter-hover-border: #24262a;
}

.bw-interaction-scope .bws-project-filter-button.bw-interactive-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  border: 1px solid var(--bw-filter-hover-border);
  border-radius: inherit;
  background: var(--bw-filter-hover-bg);
  box-shadow: none;
  opacity: 0;
  transform: scale(1);
  transform-origin: center;
  transition: transform .3s var(--bw-card-hover-easing), opacity .3s var(--bw-card-hover-easing), box-shadow .3s var(--bw-card-hover-easing);
  pointer-events: none;
}

.bw-interaction-scope .bws-project-filter-button.bw-interactive-card .bws-filter-label {
  position: relative;
  z-index: 1;
}

@media (hover: hover) and (pointer: fine) {
  /* BWSLC 0.1.73: shared desktop card interaction for index and detail pages. */
  .bw-interaction-scope .bw-interactive-card {
    transform: translateZ(0) scale(1);
    transform-origin: center;
    backface-visibility: hidden;
    transition: transform .3s var(--bw-card-hover-easing);
    will-change: transform;
  }

  .bw-interaction-scope .bw-interactive-card :where(.product-body .product-meta, .product-body h3, .product-body p, .product-body .product-specs, .product-body .product-card-action, .bw-card-stable-copy),
  .bw-interaction-scope .bw-interactive-card.category-tab :where(span, strong) {
    transform: translateZ(0) scale(1);
    transform-origin: center;
    backface-visibility: hidden;
    transition: none;
  }

  .bw-interaction-scope .bw-interactive-card:is(:hover, :focus-within) {
    transform: translateZ(0) scale(var(--bw-card-hover-scale));
  }

  .bw-interaction-scope .bw-interactive-card:is(:hover, :focus-within) :where(.product-body .product-meta, .product-body h3, .product-body p, .product-body .product-specs, .product-body .product-card-action, .bw-card-stable-copy),
  .bw-interaction-scope .bw-interactive-card.category-tab:is(:hover, :focus-within) :where(span, strong) {
    transform: translateZ(0) scale(1);
  }

  .bw-interaction-scope .bws-project-filter-button.bw-interactive-card:is(:hover, :focus-within) .bws-filter-label {
    transform: none;
  }

  .bw-interaction-scope .bws-project-filter-button.bw-interactive-card:is(:hover, :focus-within) {
    border-color: transparent;
    box-shadow: none;
    transform: none;
  }

  .bw-interaction-scope .bws-project-filter-button.bw-interactive-card:is(:hover, :focus-within)::before {
    opacity: 1;
    box-shadow: var(--bw-filter-hover-shadow);
    transform: scale(var(--bw-filter-hover-scale));
  }

  .bw-interaction-scope .bw-card-action:hover,
  .bw-interaction-scope .bw-card-action:focus-visible {
    background: var(--bw-card-action-hover-bg);
    color: #fff;
    outline: none;
  }

  html body:is(.bwp-page, .bws-system-page, .bws-project-case-detail-page, .bwa-article-detail-page) {
    --bw-detail-card-hover-scale: var(--bw-card-hover-scale);
  }

  html body.bwp-page :is(
    .bwp-card,
    .bwp-metrics article,
    .bwp-note-card,
    .bwp-faq article,
    .bwp-tables .bwp-card,
    .bwp-spec-metric-carousel > .bwp-spec-metric-card
  ),
  html body.bws-system-page:not(.bws-project-case-detail-page) :is(
    .bws-hero-card,
    .bws-risk-card,
    .bws-stage-media,
    .bws-product-data-card,
    .bws-qc-block,
    .bws-faq-card,
    .bws-spec-metric-card
  ),
  html body.bws-project-case-detail-page :is(
    .bws-case-hero-banner,
    .bws-case-product-card,
    .bws-case-system-panel,
    .bws-case-gallery-grid > *
  ),
  html body.bwa-article-detail-page :is(
    .bwa-article-figure,
    .bwa-article-table-wrap
  ) {
    backface-visibility: hidden !important;
    transform: translateZ(0) scale(1) !important;
    transform-origin: center !important;
    transition: transform .3s var(--bw-card-hover-easing) !important;
    will-change: transform !important;
  }

  html body.bwp-page :is(
    .bwp-card,
    .bwp-metrics article,
    .bwp-note-card,
    .bwp-faq article,
    .bwp-tables .bwp-card,
    .bwp-spec-metric-carousel > .bwp-spec-metric-card
  ):is(:hover, :focus-within),
  html body.bws-system-page:not(.bws-project-case-detail-page) :is(
    .bws-hero-card,
    .bws-risk-card,
    .bws-stage-media,
    .bws-product-data-card,
    .bws-qc-block,
    .bws-faq-card,
    .bws-spec-metric-card
  ):is(:hover, :focus-within),
  html body.bws-project-case-detail-page :is(
    .bws-case-hero-banner,
    .bws-case-product-card,
    .bws-case-system-panel,
    .bws-case-gallery-grid > *
  ):is(:hover, :focus-within),
  html body.bwa-article-detail-page :is(
    .bwa-article-figure,
    .bwa-article-table-wrap
  ):is(:hover, :focus-within) {
    transform: translateZ(0) scale(var(--bw-detail-card-hover-scale)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bw-interaction-scope .bw-interactive-card,
  .bw-interaction-scope .bw-interactive-card :where(.product-body .product-meta, .product-body h3, .product-body p, .product-body .product-specs, .product-body .product-card-action, .bw-card-stable-copy),
  .bw-interaction-scope .bw-card-action {
    transition: none;
  }

  .bw-interaction-scope .bw-interactive-card,
  .bw-interaction-scope .bw-interactive-card :where(.product-body .product-meta, .product-body h3, .product-body p, .product-body .product-specs, .product-body .product-card-action, .bw-card-stable-copy),
  .bw-interaction-scope .bw-card-action {
    transform: none;
  }

  html body:is(.bwp-page, .bws-system-page, .bws-project-case-detail-page, .bwa-article-detail-page) :is(
    .bwp-card,
    .bwp-metrics article,
    .bwp-note-card,
    .bwp-faq article,
    .bwp-tables .bwp-card,
    .bwp-spec-metric-carousel > .bwp-spec-metric-card,
    .bws-hero-card,
    .bws-risk-card,
    .bws-stage-media,
    .bws-product-data-card,
    .bws-qc-block,
    .bws-faq-card,
    .bws-spec-metric-card,
    .bws-case-hero-banner,
    .bws-case-product-card,
    .bws-case-system-panel,
    .bws-case-gallery-grid > *,
    .bwa-article-figure,
    .bwa-article-table-wrap
  ) {
    transition: none !important;
    transform: none !important;
  }
}

@media (max-width: 700px) {
  .bw-interaction-scope .bws-project-filter-button.bw-interactive-card.is-active {
    border-color: transparent;
    background: transparent;
    box-shadow: none;
    transform: none;
  }

  .bw-interaction-scope .bws-project-filter-button.bw-interactive-card.is-active::before {
    opacity: 1;
    box-shadow: var(--bw-filter-hover-shadow);
    transform: scale(var(--bw-filter-hover-scale));
  }

  .bw-interaction-scope .bw-card-action {
    right: 22px;
    bottom: 26px;
    width: 30px;
    height: 30px;
    font-size: 26px;
  }

  .bw-interaction-scope.bws-system-hub .bws-category-family-card h2 {
    font-size: 20px;
    line-height: 24.4px;
    font-weight: 900;
  }

  .bw-interaction-scope.bws-system-hub .bws-category-family-card > p {
    font-size: 16px;
    line-height: 25.6px;
    font-weight: 400;
  }

  .bw-interaction-scope.bws-system-hub .bws-category-family-features strong {
    font-size: 16px;
    line-height: 22.4px;
    font-weight: 800;
  }

  .bw-interaction-scope.bws-system-hub .bws-category-family-features span {
    font-size: 16px;
    line-height: 25.6px;
    font-weight: 400;
  }

  .bw-interaction-scope.bws-system-hub .bws-category-card .bws-category-code {
    font-size: 10px;
    line-height: 1.2;
    letter-spacing: .2em;
  }

  .bw-interaction-scope.bws-system-hub .bws-category-card .bws-category-pill {
    max-width: 50%;
    padding: 4px 10px;
    font-size: 10px;
    line-height: 1.2;
  }

  .bw-interaction-scope.bws-system-hub .bws-category-card h3 {
    font-size: 18px;
    line-height: 22.3px;
    font-weight: 800;
  }

  .bw-interaction-scope.bws-system-hub .bws-category-card p {
    margin: 9px 0 16px;
    color: var(--hub-muted);
    font-size: 14px;
    line-height: 21.8px;
  }

  .bw-interaction-scope.bws-system-hub .bws-category-facts div,
  .bw-interaction-scope.bws-system-hub .bws-category-facts span {
    font-size: 10px;
    line-height: 1.3;
  }

  .bw-interaction-scope.bws-system-hub .bws-category-facts strong {
    margin-top: 5px;
    font-size: 14px;
    line-height: 19.6px;
    font-weight: 800;
  }
}

/* BWSLC 0.1.60: mobile-only short tap feedback for small circular card buttons. */
@media (max-width: 900px) {
  .bw-interaction-scope {
    --bw-mobile-touch-dark: #24262a;
    --bw-mobile-touch-ease: cubic-bezier(.2, 0, .2, 1);
  }

  html body .bw-interaction-scope :is(.bw-card-action, .product-card-action, .bws-category-card-action) {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    transition:
      transform .13s var(--bw-mobile-touch-ease),
      background-color .15s var(--bw-mobile-touch-ease),
      color .15s var(--bw-mobile-touch-ease),
      box-shadow .15s var(--bw-mobile-touch-ease),
      opacity .15s var(--bw-mobile-touch-ease) !important;
  }

  html body .bw-interaction-scope :is(.bw-card-action, .product-card-action, .bws-category-card-action):is(:active, .is-touching, .is-tap-feedback),
  html body .bw-interaction-scope .bw-interactive-card:has(:is(.bw-card-action, .product-card-action, .bws-category-card-action):is(:active, .is-touching, .is-tap-feedback)) :is(.bw-card-action, .product-card-action, .bws-category-card-action) {
    background: var(--bw-mobile-touch-dark) !important;
    background-color: var(--bw-mobile-touch-dark) !important;
    color: #fff !important;
    box-shadow: none !important;
    transform: translate3d(0, 1px, 0) !important;
  }
}

@media (max-width: 900px) and (prefers-reduced-motion: reduce) {
  .bw-interaction-scope :is(.bw-card-action, .product-card-action, .bws-category-card-action) {
    transition: none;
    transform: none;
  }
}

/* BWSLC 0.1.61: unify every mobile card round action with the category-card treatment. */
@media (max-width: 900px) {
  html body.bw-interaction-scope :is(.bw-card-action, .product-card-action, .bws-category-card-action, .about-link-card-action, .bwh-card-action),
  html body .bw-interaction-scope :is(.bw-card-action, .product-card-action, .bws-category-card-action, .about-link-card-action, .bwh-card-action) {
    position: absolute !important;
    right: 22px !important;
    bottom: 26px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #eef0f3 !important;
    background-color: #eef0f3 !important;
    background-image: none !important;
    color: #5f6671 !important;
    font-size: 26px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transform: translate3d(0, 0, 0) !important;
    -webkit-tap-highlight-color: transparent !important;
    touch-action: manipulation !important;
    transition:
      background-color .08s cubic-bezier(.2, 0, .2, 1),
      color .08s cubic-bezier(.2, 0, .2, 1),
      transform .08s cubic-bezier(.2, 0, .2, 1) !important;
  }

  html body.bw-interaction-scope :is(.bw-card-action, .product-card-action, .bws-category-card-action, .about-link-card-action, .bwh-card-action) > span,
  html body .bw-interaction-scope :is(.bw-card-action, .product-card-action, .bws-category-card-action, .about-link-card-action, .bwh-card-action) > span {
    display: block !important;
    margin-top: -2px !important;
    color: inherit !important;
    line-height: 1 !important;
    transform: none !important;
  }

  html body.bw-interaction-scope :is(.bw-card-action, .product-card-action, .bws-category-card-action, .about-link-card-action, .bwh-card-action):is(:active, .is-touching, .is-tap-feedback),
  html body .bw-interaction-scope :is(.bw-card-action, .product-card-action, .bws-category-card-action, .about-link-card-action, .bwh-card-action):is(:active, .is-touching, .is-tap-feedback) {
    background: #24262a !important;
    background-color: #24262a !important;
    background-image: none !important;
    color: #fff !important;
    box-shadow: none !important;
    transform: translate3d(0, 1px, 0) !important;
  }
}

@media (max-width: 900px) and (prefers-reduced-motion: reduce) {
  html body .bw-interaction-scope :is(.bw-card-action, .product-card-action, .bws-category-card-action, .about-link-card-action, .bwh-card-action) {
    transition: none !important;
  }
}