/* MRC ABOUT PASTOR CTA HARD ROUNDING FIX
   Loaded after all other public styles. The visible panel is painted by a
   rounded pseudo-element using the exact scheme main color (--navy). */

:root {
  --mrc-about-cta-main: var(--navy, #06264e);
  --mrc-about-cta-page: var(--mrc-page-bg, var(--cream, #fbfaf7));
  --mrc-about-cta-radius: 36px;
}

body.mrc-page-about-pastor .pastor-cta-section,
body.mrc-page-about-pastor .mrc-pastor-cta-section,
body.about-pastor-page .pastor-cta-section,
body.about-pastor-page .mrc-pastor-cta-section,
section.pastor-cta-section,
section.mrc-pastor-cta-section {
  background: var(--mrc-about-cta-page) !important;
  background-color: var(--mrc-about-cta-page) !important;
}

#pastor-visit-cta,
.mrc-primary-rounded-cta,
body.mrc-page-about-pastor .pastor-cta-section > .cta-panel,
body.about-pastor-page .pastor-cta-section > .cta-panel {
  position: relative !important;
  isolation: isolate !important;
  background: var(--mrc-about-cta-main) !important;
  background-color: var(--mrc-about-cta-main) !important;
  background-image: none !important;
  color: #ffffff !important;
  border: 0 !important;
  border-radius: var(--mrc-about-cta-radius) !important;
  -webkit-border-radius: var(--mrc-about-cta-radius) !important;
  overflow: hidden !important;
  clip-path: inset(0 round var(--mrc-about-cta-radius)) !important;
  -webkit-clip-path: inset(0 round var(--mrc-about-cta-radius)) !important;
  transform: translateZ(0) !important;
  -webkit-mask-image: -webkit-radial-gradient(white, black) !important;
  padding: clamp(1.5rem, 4vw, 3rem) !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 2rem !important;
  box-shadow: 0 22px 54px rgba(6, 38, 78, .20) !important;
}

/* Paint the panel on a separately rounded layer. This keeps the corners round
   even when another stylesheet later changes the element background. */
#pastor-visit-cta::before,
.mrc-primary-rounded-cta::before,
body.mrc-page-about-pastor .pastor-cta-section > .cta-panel::before,
body.about-pastor-page .pastor-cta-section > .cta-panel::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background: var(--mrc-about-cta-main) !important;
  background-color: var(--mrc-about-cta-main) !important;
  border-radius: inherit !important;
  -webkit-border-radius: inherit !important;
}

#pastor-visit-cta > *,
.mrc-primary-rounded-cta > *,
body.mrc-page-about-pastor .pastor-cta-section > .cta-panel > *,
body.about-pastor-page .pastor-cta-section > .cta-panel > * {
  position: relative !important;
  z-index: 1 !important;
}

#pastor-visit-cta h2,
#pastor-visit-cta p,
#pastor-visit-cta .eyebrow,
.mrc-primary-rounded-cta h2,
.mrc-primary-rounded-cta p,
.mrc-primary-rounded-cta .eyebrow {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

#pastor-visit-cta .eyebrow,
.mrc-primary-rounded-cta .eyebrow {
  opacity: .9 !important;
}

#pastor-visit-cta .button.primary,
.mrc-primary-rounded-cta .button.primary {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: var(--mrc-about-cta-main) !important;
  -webkit-text-fill-color: var(--mrc-about-cta-main) !important;
  border-color: #ffffff !important;
}

#pastor-visit-cta .button.primary:hover,
.mrc-primary-rounded-cta .button.primary:hover {
  background: var(--soft-blue, #eaf0f6) !important;
  background-color: var(--soft-blue, #eaf0f6) !important;
  border-color: var(--soft-blue, #eaf0f6) !important;
  color: var(--mrc-about-cta-main) !important;
  -webkit-text-fill-color: var(--mrc-about-cta-main) !important;
}

@media (max-width: 900px) {
  :root { --mrc-about-cta-radius: 30px; }

  #pastor-visit-cta,
  .mrc-primary-rounded-cta,
  body.mrc-page-about-pastor .pastor-cta-section > .cta-panel,
  body.about-pastor-page .pastor-cta-section > .cta-panel {
    display: grid !important;
    border-radius: var(--mrc-about-cta-radius) !important;
    -webkit-border-radius: var(--mrc-about-cta-radius) !important;
    clip-path: inset(0 round var(--mrc-about-cta-radius)) !important;
    -webkit-clip-path: inset(0 round var(--mrc-about-cta-radius)) !important;
  }
}