.zen-and-tao-category-hero {
  position: relative;
  margin: 0 0 56px;
  color: #20221e;
}

.zen-and-tao-category-hero__image img {
  display: block;
  width: 100%;
  height: auto;
}

.zen-and-tao-category-hero--collection .zen-and-tao-category-hero__image {
  aspect-ratio: 1920 / 500;
  overflow: hidden;
  background: #f5f5f5;
}

.zen-and-tao-category-hero--collection .zen-and-tao-category-hero__image img {
  height: 100%;
  object-fit: cover;
}

.zen-and-tao-category-hero__copy {
  position: absolute;
  inset: 0 auto 0 0;
  display: flex;
  width: 56%;
  flex-direction: column;
  justify-content: center;
  padding: 24px clamp(28px, 3.5vw, 56px);
}

.zen-and-tao-category-hero__copy h1 {
  margin: 0 0 clamp(14px, 1.5vw, 22px);
  color: inherit;
  font-family: "Jost", Arial, Helvetica, sans-serif;
  font-size: clamp(28px, 3vw, 46px);
  font-weight: 400;
  line-height: 1.1;
  overflow-wrap: break-word;
  text-wrap: balance;
}

.zen-and-tao-category-hero__copy p {
  max-width: 58ch;
  margin: 0;
  color: inherit;
  font-family: "Jost", Arial, Helvetica, sans-serif;
  font-size: clamp(15px, 1.25vw, 18px);
  line-height: 1.55;
  white-space: pre-line;
}

.zen-and-tao-category-hero--light-text {
  color: #fff;
}

.zen-and-tao-category-hero--text-only .zen-and-tao-category-hero__copy {
  position: static;
  width: 100%;
}

/* Shade copy areas while retaining the full banner artwork. */
@media (min-width: 1024px) {
  .zen-and-tao-category-hero--shop .zen-and-tao-category-hero__image,
  .zen-and-tao-category-hero--tibetan .zen-and-tao-category-hero__image,
  .zen-and-tao-category-hero--home-decor .zen-and-tao-category-hero__image,
  .zen-and-tao-category-hero--jewelry .zen-and-tao-category-hero__image {
    position: relative;
  }

  .zen-and-tao-category-hero--shop .zen-and-tao-category-hero__image::after,
  .zen-and-tao-category-hero--tibetan .zen-and-tao-category-hero__image::after,
  .zen-and-tao-category-hero--home-decor .zen-and-tao-category-hero__image::after,
  .zen-and-tao-category-hero--jewelry .zen-and-tao-category-hero__image::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgb(0 0 0 / 60%), rgb(0 0 0 / 35%) 45%, transparent 80%);
    content: "";
    pointer-events: none;
  }

  .zen-and-tao-category-hero--shop .zen-and-tao-category-hero__copy,
  .zen-and-tao-category-hero--tibetan .zen-and-tao-category-hero__copy,
  .zen-and-tao-category-hero--home-decor .zen-and-tao-category-hero__copy,
  .zen-and-tao-category-hero--jewelry .zen-and-tao-category-hero__copy {
    z-index: 1;
  }
}

/* Keep the entire original banner and readable copy on narrow screens. */
@media (max-width: 1023px) {
  .zen-and-tao-category-hero {
    margin-bottom: 32px;
    color: #20221e;
  }

  .zen-and-tao-category-hero__copy {
    position: static;
    width: 100%;
    padding: 24px 0 0;
  }

  .zen-and-tao-category-hero__copy h1 {
    margin-bottom: 18px;
    font-size: clamp(28px, 5vw, 38px);
    text-wrap: initial;
  }

  .zen-and-tao-category-hero__copy p {
    max-width: 68ch;
    font-size: 16px;
    line-height: 1.7;
  }
}

@media (max-width: 767px) {
  .tax-product_cat .zen-and-tao-shop-shell {
    padding-top: 24px;
  }
}

@media (max-width: 782px) {
  .zen-and-tao-category-hero__copy h1 { text-align: center; }
}
