.bio-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at center top, rgba(190,150,95,.18), transparent 42%),
    linear-gradient(180deg, #1a1714 0%, #0f0f0f 55%, #141414 100%);
}


/* ── Kontener jako punkt odniesienia ── */
.bio-person-left,
.bio-person-right {
  position: relative;
}

/* ── Nagłówek z imieniem ── */
.bio-person-left .bio-person-name,
.bio-person-right .bio-person-name {
  position: absolute;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
  width: 90%;
  text-align: center;
  pointer-events: none;
  margin: 0;
}

.bio-person-name h3 {
  text-shadow:
    0 0 30px rgba(0,0,0,1),
    0 0 14px rgba(0,0,0,0.95),
    0 2px 8px rgba(0,0,0,0.9);
  margin: 0;
}

/* ── Button "Poznaj" ── */
.bio-person-left .bgGlow,
.bio-person-right .bgGlow {
  position: absolute;
  top: 68%;                      /* tuż pod nagłówkiem */
  left: 50%;
  transform: translate(-50%, 0);
  z-index: 10;
  width: auto;
  pointer-events: auto;          /* button musi być klikalny */
}

.bgGlow .elementor-button {
  transition: background 0.25s ease, box-shadow 0.25s ease, color 0.25s ease;
  box-shadow: 0 0 12px rgba(201,168,76,0.2);
  white-space: nowrap;
}

.bgGlow .elementor-button:hover {
  background: rgba(201, 168, 76, 0.15);
  box-shadow: 0 0 24px rgba(201,168,76,0.5), 0 0 8px rgba(201,168,76,0.3);
  color: #e8c96a;
}

/* ── Hover na zdjęciu ── */
.bio-person-left .person-image a:hover img,
.bio-person-right .person-image a:hover img {
  opacity: 0.75;
  transition: opacity 0.25s ease;
}
/* ── Mobile ── */
@media (max-width: 767px) {

  .bio-person-left .bio-person-name,
  .bio-person-right .bio-person-name {
    top: 60%;
  }

  .bio-person-left .bgGlow,
  .bio-person-right .bgGlow {
    top: 80%;
  }

}