/* Page banners: title on the left, cut-out portrait on the right standing on the banner's bottom line.
   Size, left/right and up/down come from the console (--pbz, --pbx, --pby, --pbh). */
.pbx { position: relative; overflow: hidden; border-bottom: 1px solid var(--line); }
.pbx.glow::before { content: ""; position: absolute; width: 62vw; height: 62vw; max-width: 900px; max-height: 900px; right: -6vw; bottom: -34vw;
  background: radial-gradient(circle, rgba(193,42,122,.42), rgba(158,31,99,.14) 45%, transparent 68%); pointer-events: none; opacity: var(--pbg, 1); transform: scale(calc(.75 + var(--pbg, 1) / 4)); transform-origin: center; }
.pbx-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(24px, 4vw, 64px); align-items: end; }
.pbx-text { padding-block: clamp(32px, 4vw, 56px) clamp(48px, 7vw, 96px); align-self: start; }
.pbx-text .crumbs { margin-bottom: clamp(32px, 5vw, 64px); }
.pbx.fixed-h .pbx-grid { min-height: var(--pbh, 70vh); }
.pbx-pic { position: relative; align-self: end; display: flex; justify-content: center; min-height: 100%; padding-top: clamp(24px, 3vw, 40px); }
.pbx-pic img { display: block; width: auto; height: calc(clamp(400px, 42vw, 600px) * var(--pbz, 1)); max-width: 100%; object-fit: contain; object-position: bottom center;
  transform: translate(var(--pbx, 0%), var(--pby, 0%)); transform-origin: bottom center; opacity: var(--pbo, 1); user-select: none; -webkit-user-drag: none; }
.pbx-tag { position: absolute; left: 0; bottom: clamp(20px, 4vw, 48px); margin: 0; padding: 12px 16px; display: grid; gap: 2px;
  background: rgba(42,10,26,.78); border: 1px solid var(--line-strong); border-left: 3px solid var(--berry-hi); backdrop-filter: blur(6px); }
.pbx-tag b { font-family: var(--display); font-size: 17px; font-weight: 700; }
.pbx-tag span { font-size: 12.5px; letter-spacing: .06em; color: var(--blush); }
@media (max-width: 860px) {
  .pbx-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .pbx-text { padding-bottom: 8px; }
  .pbx-text .crumbs { margin-bottom: 28px; }
  .pbx-pic img { height: calc(min(108vw, 460px) * var(--pbz, 1)); transform: translate(calc(var(--pbx, 0%) / 2), 0); }
  .pbx-tag { left: 50%; transform: translateX(-50%); white-space: nowrap; bottom: 16px; }
  .pbx.glow::before { width: 120vw; height: 120vw; right: -30vw; bottom: -50vw; }
}
