/* Section-specific styles */

/* Mission Section */
.mission {
  background-color: var(--primary-color);
  color: black;
  text-align: center;
  padding: var(--space-xxl) 0;
}

.mission h2, 
.mission h2::after {
  color: black;
  margin-left: auto;
  margin-right: auto;
}

.mission h2::after {
  background-color: white;
  left: 50%;
  transform: translateX(-50%);
}

.mission p {
  font-size: 1.25rem;
  max-width: 800px;
  margin: 0 auto;
}

/* Services Section */
.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: var(--space-xl);
  margin-top: var(--space-xl);
}

.service-card {
  background-color: white;
  border-radius: var(--radius-md);
  padding: var(--space-xl);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.service-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
}

.service-icon {
  width: 60px;
  height: 60px;
  margin-bottom: var(--space-md);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.service-icon.advocacy {
  background-image: url('https://images.pexels.com/photos/3184339/pexels-photo-3184339.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2');
  background-size: cover;
  border-radius: 50%;
}

.service-icon.workshops {
  background-image: url('https://images.pexels.com/photos/3184291/pexels-photo-3184291.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2');
  background-size: cover;
  border-radius: 50%;
}

.service-icon.employment {
  background-image: url('https://images.pexels.com/photos/3184306/pexels-photo-3184306.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2');
  background-size: cover;
  border-radius: 50%;
}

.service-icon.living {
  background-image: url('https://images.pexels.com/photos/1181715/pexels-photo-1181715.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2');
  background-size: cover;
  border-radius: 50%;
}

.service-icon.training {
  background-image: url('https://images.pexels.com/photos/3184328/pexels-photo-3184328.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2');
  background-size: cover;
  border-radius: 50%;
}

/* Nonprofit Status Section */
.nonprofit-status {
  background-color: var(--primary-light);
  padding: var(--space-xxl) 0;
}

.status-box {
  background-color: white;
  border-radius: var(--radius-lg);
  padding: var(--space-xl);
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.status-box h2 {
  color: var(--primary-dark);
}

.status-box h2::after {
  left: 50%;
  transform: translateX(-50%);
}

.status-box p {
  font-style: italic;
  color: var(--neutral-700);
}

/* Values Section */
.values-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: var(--space-lg);
  margin-top: var(--space-xl);
}

.value-box {
  background-color: white;
  border-radius: var(--radius-md);
  padding: var(--space-lg);
  text-align: center;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  border-top: 5px solid var(--secondary-color);
  transition: transform 0.3s ease;
}

.value-box:hover {
  transform: translateY(-5px);
}

.value-box:nth-child(2) {
  border-top-color: var(--primary-color);
}

.value-box:nth-child(3) {
  border-top-color: var(--accent-color);
}

.value-box:nth-child(4) {
  border-top-color: var(--secondary-light);
}

.value-box:nth-child(5) {
  border-top-color: var(--primary-light);
}

.value-box h3 {
  margin-bottom: var(--space-sm);
}