/* v021 separates publisher, product, and evidence branding roles. */

.publisher-cover-media {
  position: relative;
  isolation: isolate;
}

.publisher-cover-winglet {
  position: absolute;
  z-index: 5;
  top: 0;
  left: 0;
  width: clamp(54px, 5.2%, 64px);
  height: clamp(36px, 3.8vw, 42px);
  overflow: hidden;
  background: var(--accent);
  clip-path: polygon(0 0, 100% 0, 72% 100%, 0 100%);
  pointer-events: none;
}

.publisher-home-v021 .tool-media-frame-v020.publisher-cover-media .publisher-cover-winglet > img,
.product-page-v021 .product-proof-grid .product-hero-media-v020.publisher-cover-media .publisher-cover-winglet > img {
  position: absolute;
  z-index: 1;
  top: 6px;
  left: 8px;
  width: 24px;
  height: 24px;
  max-width: none;
  object-fit: contain;
  filter: brightness(0) invert(1);
  opacity: 0.92;
}

.product-page-v021 .breadcrumb li + li::before {
  content: "";
  width: 5px;
  height: 5px;
  flex: 0 0 auto;
  border-right: 1px solid var(--quiet);
  border-bottom: 1px solid var(--quiet);
  transform: rotate(-45deg);
}

.tool-product-identity,
.product-identity-line {
  display: flex;
  align-items: center;
  gap: 10px;
}

.tool-product-identity {
  margin-bottom: 18px;
}

.tool-product-identity .tool-meta-v014 {
  margin: 0;
}

.tool-product-mark,
.product-title-mark {
  width: 27px;
  height: 27px;
  flex: 0 0 auto;
  object-fit: contain;
}

.product-page-v021 .product-identity-line {
  grid-column: 1 / -1;
  margin-bottom: 16px;
}

.product-page-v021 .product-identity-line .product-kicker {
  margin: 0;
  color: var(--accent);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.4;
}

@media (max-width: 600px) {
  .publisher-cover-winglet {
    width: 46px;
    height: 34px;
  }

  .publisher-home-v021 .tool-media-frame-v020.publisher-cover-media .publisher-cover-winglet > img,
  .product-page-v021 .product-proof-grid .product-hero-media-v020.publisher-cover-media .publisher-cover-winglet > img {
    top: 6px;
    left: 7px;
    width: 20px;
    height: 20px;
  }

  .product-page-v021 .product-identity-line {
    order: 1;
  }

  .product-title-mark,
  .tool-product-mark {
    width: 24px;
    height: 24px;
  }
}