/* Owner-approved original product imagery. Keep labels pixel-exact and blend every edge. */
.hero-visual > img {
  filter: drop-shadow(0 34px 34px rgba(7, 59, 87, .28));
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  width: 100%;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 11%, #000 89%, transparent 100%), linear-gradient(to bottom, transparent 0%, #000 8%, #000 92%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent 0%, #000 11%, #000 89%, transparent 100%), linear-gradient(to bottom, transparent 0%, #000 8%, #000 92%, transparent 100%);
  mask-composite: intersect;
}

.product-card > img.owner-pair,
.choice-bottle img.owner-pair {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  filter: none;
  height: 540px;
  max-height: none;
  object-fit: cover;
  width: 112%;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 13%, #000 87%, transparent 100%), linear-gradient(to bottom, transparent 0%, #000 9%, #000 88%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent 0%, #000 13%, #000 87%, transparent 100%), linear-gradient(to bottom, transparent 0%, #000 9%, #000 88%, transparent 100%);
  mask-composite: intersect;
}

.product-card > img.owner-pair--premier { object-position: 31% 50%; }
.choice-bottle img.owner-pair--choice { object-position: 69% 50%; }
.choice-bottle span { display: none; }

.buddy-section::after {
  aspect-ratio: 3 / 2;
  background-image: url("/assets/beverage-buddy-hero-card.png");
  -webkit-mask-image: linear-gradient(to right, transparent, #000 10%, #000 90%, transparent), linear-gradient(to bottom, transparent, #000 10%, #000 90%, transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent, #000 10%, #000 90%, transparent), linear-gradient(to bottom, transparent, #000 10%, #000 90%, transparent);
  mask-composite: intersect;
  width: clamp(230px, 20vw, 310px);
}

@media (max-width: 920px) {
  .product-card > img.owner-pair,
  .choice-bottle img.owner-pair {
    height: 390px;
    width: 74%;
  }

  .buddy-section::after { width: clamp(220px, 42vw, 300px); }
}

@media (max-width: 620px) {
  .product-card > img.owner-pair,
  .choice-bottle img.owner-pair {
    height: 350px;
    width: 92%;
  }


  .buddy-section::after { width: min(88vw, 292px); }
}