/* Community Intro block */
.community-intro {
  position: relative;
  overflow: hidden;
  background-color: #8c5b4c;
  color: #fff5eb;
  padding-top: 4.75rem;
  padding-bottom: 4.75rem;
}

.community-intro__decoration {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.community-intro__decoration img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 114%;
  max-width: none;
  height: auto;
  opacity: 0.12;
}

/* When an editor uploads an image, render it as a full-bleed background
   instead of the faint botanical watermark. */
.community-intro--has-bg .community-intro__decoration img {
  top: 0;
  left: 0;
  transform: none;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 1;
}

/* Brand-brown (#8c5b4c) overlay keeps the section on the Figma colour while
   muting busy photos. Lower the alpha to reveal more image, raise it for a
   more solid brand-brown panel. */
.community-intro--has-bg .community-intro__decoration::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(rgba(140, 91, 76, 0.6), rgba(140, 91, 76, 0.6));
}

.community-intro__inner {
  position: relative;
  z-index: 1;
}

.community-intro__heading {
  color: #fff5eb;
  font-weight: 200;
  font-family: 'pp-hatton';
  font-size: clamp(2rem, 4vw, 2.8125rem);
  line-height: 1.1;
  margin: 0 auto 2rem;
  max-width: 884px;
}

.community-intro__content {
  max-width: 636px;
  margin: 0 auto;
  font-size: 0.9375rem;
  line-height: 1.6;
}

.community-intro__content :last-child {
  margin-bottom: 0;
}

.community-intro__content a {
  color: #fff5eb;
  text-decoration: underline;
}

.community-intro__content a:hover,
.community-intro__content a:focus {
  text-decoration: none;
}