/* Prosper UK — public profile pages */

body.page-profiles-show #content.site-content-frame,
body.page-profiles-show-wide #content.site-content-frame {
  padding-top: 0 !important;
}

body.page-profiles-show .site-content--full,
body.page-profiles-show-wide .site-content--full {
  padding-top: 0;
}

.prosper-profile-page {
  width: 100%;
  max-width: 1440px;
  padding-top: 0 !important;
  padding-bottom: clamp(2rem, 4vw, 3.5rem) !important;
  margin-top: 0;
}

.prosper-profile-hero {
  margin-bottom: 0;
}

.prosper-profile-hero .hero-container.solid-bg {
  background: linear-gradient(160deg, #2f3f63 0%, #273356 52%, #1a3358 100%);
}

.prosper-profile-hero .hero-overlay {
  background:
    linear-gradient(90deg, rgba(39, 51, 86, 0.78) 0%, rgba(39, 51, 86, 0.66) 55%, rgba(39, 51, 86, 0.5) 100%),
    linear-gradient(180deg, rgba(19, 20, 20, 0.08) 0%, rgba(19, 20, 20, 0.32) 100%);
}

.prosper-profile-hero .hero-container {
  min-height: clamp(180px, 24vw, 260px);
  padding-bottom: clamp(4.5rem, 10vw, 7rem);
}

/* Square portrait overlapping hero — stage reserves layout space for content below */
.prosper-profile-portrait-stage {
  display: flow-root;
  width: var(--prosper-profile-portrait-size);
  height: var(--prosper-profile-portrait-size);
  margin-top: calc(-1 * var(--prosper-profile-portrait-overlap));
  margin-bottom: 0.75rem;
  position: relative;
  z-index: 2;
}

.prosper-profile-portrait {
  position: absolute;
  top: 0;
  left: 0;
  width: var(--prosper-profile-portrait-size);
  margin: 0;
  z-index: 2;
}

.prosper-profile-portrait__frame {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
}

.prosper-profile-portrait__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 4px solid var(--prosper-white, #fff);
  box-shadow: 0 10px 28px rgba(39, 51, 86, 0.18);
}

/* Two-column layout — equal width */
.prosper-profile-layout {
  --prosper-profile-portrait-size: clamp(140px, 20vw, 200px);
  --prosper-profile-portrait-overlap: calc(var(--prosper-profile-portrait-size) * 0.58);
  align-items: flex-start;
  margin-top: 0;
}

.prosper-profile-layout__sidebar {
  position: relative;
  z-index: 2;
}

.prosper-profile-layout__main {
  padding-top: 0;
}

.prosper-profile-intro {
  padding-bottom: 0;
  border-bottom: none;
  margin-bottom: 0;
  margin-top: 0;
}

/* Role + socials directly under avatar */
.prosper-profile-identity {
  position: relative;
  z-index: 5;
  margin-bottom: 1rem;
  clear: both;
}

.prosper-profile-identity__role {
  margin: 0 0 0.65rem;
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.35;
  color: var(--prosper-navy, #273356);
}

.prosper-profile-identity .prosper-directory-card__socials {
  margin: 0;
  padding: 0;
  border-top: none;
  justify-content: flex-start;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.55rem;
}

.prosper-profile-identity .prosper-directory-card__contact-link {
  color: var(--prosper-navy, #273356);
  font-size: 0.9rem;
  font-weight: 500;
}

.prosper-profile-identity .prosper-directory-card__contact-link i {
  color: var(--prosper-navy, #273356);
}

.prosper-profile-identity .prosper-directory-card__contact-link:hover,
.prosper-profile-identity .prosper-directory-card__contact-link:focus {
  color: var(--prosper-text, #131414);
}

.prosper-profile-identity .prosper-directory-card__social-icons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  min-height: 2rem;
}

.prosper-profile-identity .prosper-directory-card__social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 4px;
  background: var(--prosper-navy, #273356);
  color: #fff;
  transition: background-color 0.15s ease;
}

.prosper-profile-identity .prosper-directory-card__social-link:hover,
.prosper-profile-identity .prosper-directory-card__social-link:focus {
  background: var(--prosper-navy-soft, #323d5c);
}

.prosper-profile-identity .prosper-directory-card__social-link img {
  width: 14px;
  height: 14px;
  filter: brightness(0) invert(1);
}

.prosper-profile-intro__bio {
  font-size: 1rem;
  line-height: 1.6;
  color: var(--prosper-text, #131414);
  margin-top: 0;
  margin-bottom: 0.85rem;
}

.prosper-profile-intro__bio > *:first-child {
  margin-top: 0;
}

.prosper-profile-intro__bio > *:last-child {
  margin-bottom: 0;
}

.prosper-profile-intro__actions {
  margin-bottom: 0.75rem;
}

.prosper-profile-intro__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  margin-top: 0;
  margin-bottom: 0.75rem;
  font-size: 0.9rem;
  color: rgba(19, 20, 20, 0.68);
}

.prosper-profile-intro__stats strong {
  color: var(--prosper-text, #131414);
}

.prosper-profile-intro__badges {
  margin-top: 0;
  margin-bottom: 0.75rem;
}

.prosper-profile-intro__badge {
  display: inline-block;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  background: rgba(27, 128, 152, 0.12);
  color: var(--prosper-teal, #1b8098);
  font-size: 0.78rem;
  font-weight: 700;
  text-decoration: none;
}

.prosper-profile-intro__status {
  margin-top: 0;
  margin-bottom: 0.75rem;
  font-size: 0.875rem;
  font-weight: 600;
}

.prosper-profile-intro__fundraising,
.prosper-profile-intro__site-actions {
  margin-top: 0.75rem;
}

.prosper-profile-intro__site-actions .site-buttons {
  margin-bottom: 0 !important;
}

/* Vertical article feed — right column */
.prosper-profile-feed__list {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

@media (min-width: 992px) {
  .prosper-profile-layout__main {
    padding-top: calc(var(--prosper-profile-portrait-size, 168px) * 0.42);
    padding-left: 2rem;
    border-left: 1px solid rgba(39, 51, 86, 0.1);
  }

  .prosper-profile-layout__sidebar {
    padding-right: 2rem;
  }

  .prosper-profile-layout > [class*="col-"] {
    flex: 0 0 50%;
    max-width: 50%;
  }
}

@media (max-width: 991.98px) {
  .prosper-profile-layout {
    --prosper-profile-portrait-overlap: calc(var(--prosper-profile-portrait-size) * 0.55);
  }

  .prosper-profile-layout__main {
    margin-top: 2rem;
    padding-top: 0;
    border-top: 1px solid rgba(39, 51, 86, 0.12);
  }
}