.br135-hero {
  box-sizing: border-box;
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 1200px;
  min-height: clamp(250px, 26vw, 340px);
  margin: 20px auto 26px;
  border-radius: 18px;
  overflow: hidden;
  background: #15352e;
  color: #fff9ea;
}
.br135-hero[hidden] { display: none; }
.br135-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 0 36%;
  background: linear-gradient(90deg, #15352e, transparent 36%);
}
.br135-copy { box-sizing: border-box; width: min(55%, 660px); padding: clamp(20px, 3vw, 44px); }
.br135-copy :is(.hero-copy, .hero-inner, .hero-content, .heroText) {
  padding: 0; margin: 0; background: none; color: inherit;
}
.br135-copy :is(h1,h2) { margin: .18em 0; color: inherit; font: 700 clamp(1.75rem, 3.6vw, 3.2rem)/1.08 Georgia, serif; }
.br135-copy p { margin: .55em 0 0; color: inherit; font-size: clamp(.95rem, 1.4vw, 1.14rem); line-height: 1.5; }
#detail > .br135-hero { width: min(calc(100% - 32px), 1200px); }
#detail:has(> .br135-hero:not([hidden])) > .detail-body { padding-top: 0; }
#detail:has(> .br135-hero:not([hidden])) > #detail-image,
#detail:has(> .br135-hero:not([hidden])) .detail-body > :is(#detail-kicker,#detail-title,#detail-desc) { display: none !important; }
.br135-hero + .hero-actions { margin: 0 0 24px; }
.br135-hero + .hero-actions .button:not(.gold) { color: #173b35; border-color: #173b35; }
@media (max-width: 680px) {
  .br135-hero { align-items: end; min-height: 320px; }
  .br135-hero::after { inset: 0; background: linear-gradient(0deg,#15352e 5%,#15352ee8 34%,transparent 85%); }
  .br135-copy { width: 100%; padding-top: 130px; }
}

.br135-art {
  position: absolute;
  z-index: -2;
  inset: 0 0 0 36%;
  width: 64%;
  height: 100%;
  object-fit: cover;
}
@media (max-width: 680px) {
  .br135-art { inset: 0; width: 100%; object-position: center top; }
}