/* Updated Section Title Styles to match about-intro-heading */
.section-title {
  font-family: 'Playfair Display', serif !important;
  font-size: 2.3rem !important;
  font-weight: 800 !important;
  color: #621c38 !important;
  letter-spacing: 0.01em !important;
  margin-bottom: 0.2rem !important;
  text-align: left !important;
  transition: color 0.3s ease !important;
  border-bottom: none !important;
  padding-bottom: 0 !important;
  display: block !important;
  scroll-margin-top: 5rem !important;
}

/* Section title divider to match about-intro-divider */
.section-title-divider {
  width: 48px;
  height: 3px;
  background: linear-gradient(90deg, #cba135 0%, #a6782d 100%);
  border-radius: 2px;
  margin-bottom: 0.5rem;
  transition: width 0.3s ease, background 0.3s ease;
}

/* Hover animations for section titles and dividers */
.section:hover .section-title-divider,
.section-title:hover + .section-title-divider,
.section-title:hover ~ .section-title-divider {
  width: 64px;
  background: linear-gradient(90deg, #d4b44a 0%, #b88a3a 100%);
}

/* Alternative hover approach for components outside .section containers */
.cta-block:hover .section-title-divider,
.container:hover .section-title-divider {
  width: 64px;
  background: linear-gradient(90deg, #d4b44a 0%, #b88a3a 100%);
}

/* Mobile responsive styles to match about-intro-heading */
@media (max-width: 700px) {
  .section-title {
    font-size: 1.3rem !important;
  }
  
  .section-title-divider {
    width: 32px;
    height: 2px;
  }
  
  .section:hover .section-title-divider,
  .section-title:hover + .section-title-divider,
  .section-title:hover ~ .section-title-divider,
  .cta-block:hover .section-title-divider,
  .container:hover .section-title-divider {
    width: 40px;
  }
}