/* OfficeLineHub – about-us.css */
.aboutus-hero-section {
  background: var(--gray-100);
  padding-top: var(--space-16);
  padding-bottom: var(--space-16);
}
.aboutus-hero {
  align-items: center;
  gap: var(--space-8);
}
.aboutus-hero-text h1 {
  font-size: var(--font-size-4xl);
  margin-bottom: var(--space-4);
}
.aboutus-hero-image img {
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-base);
  max-width: 400px;
}
@media (max-width: 900px) {
  .aboutus-hero-image img {
    max-width: 100%;
  }
}

.aboutus-journey-section,
.aboutus-commitment-section,
.aboutus-future-section {
  padding-top: var(--space-16);
  padding-bottom: var(--space-16);
}
.aboutus-journey {
  align-items: center;
  gap: var(--space-8);
}
.aboutus-journey-image img {
  border-radius: var(--radius-base);
  box-shadow: var(--shadow-base);
  max-width: 350px;
}
.aboutus-milestones {
  margin-top: var(--space-4);
  margin-bottom: var(--space-4);
  font-size: var(--font-size-base);
  color: var(--gray-700);
  list-style: disc inside;
}

.aboutus-commitment {
  align-items: center;
  gap: var(--space-8);
}
.aboutus-commitment-image img {
  border-radius: var(--radius-base);
  max-width: 340px;
  box-shadow: var(--shadow-base);
}

.aboutus-usp-section {
  background: var(--gray-50);
  padding-top: var(--space-16);
  padding-bottom: var(--space-16);
}
.aboutus-usp-list .usp-card {
  min-height: 280px;
  align-items: center;
  text-align: center;
}
.usp-icon {
  width: 52px;
  height: 52px;
  margin-bottom: var(--space-3);
}

.aboutus-values-section {
  padding-top: var(--space-16);
  padding-bottom: var(--space-16);
}
.aboutus-values-list {
  gap: var(--space-6);
}
.value-card {
  align-items: center;
  text-align: center;
  min-height: 240px;
}
.value-icon {
  width: 36px;
  height: 36px;
  margin-bottom: var(--space-2);
}

.aboutus-team-section {
  background: var(--gray-100);
  padding-top: var(--space-16);
  padding-bottom: var(--space-16);
}
.aboutus-team-list {
  gap: var(--space-6);
}
.team-card {
  align-items: center;
  text-align: center;
  min-height: 260px;
}
.team-photo {
  width: 94px;
  height: 94px;
  object-fit: cover;
  border-radius: 50%;
  margin-bottom: var(--space-2);
  border: 3px solid var(--gray-200);
}

.aboutus-community-section {
  padding-top: var(--space-16);
  padding-bottom: var(--space-16);
}
.aboutus-community-content {
  align-items: start;
  gap: var(--space-8);
  margin-bottom: var(--space-8);
}
.aboutus-community-list {
  margin-top: var(--space-4);
  color: var(--gray-700);
  font-size: var(--font-size-base);
  list-style: disc inside;
}
.aboutus-community-gallery {
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3);
}
.community-photo {
  border-radius: var(--radius-base);
  box-shadow: var(--shadow-sm);
  width: 100%;
  min-width: 90px;
  object-fit: cover;
  background: var(--gray-200);
}
.community-testimonial {
  margin-top: var(--space-8);
  font-style: italic;
  background: var(--gray-50);
  color: var(--gray-800);
}

.aboutus-future-section {
  background: var(--gray-100);
}
.aboutus-future-content {
  align-items: center;
  gap: var(--space-8);
}
.aboutus-future-image img {
  border-radius: var(--radius-base);
  box-shadow: var(--shadow-base);
  max-width: 320px;
}

.aboutus-cta-section {
  padding-top: var(--space-10);
  padding-bottom: var(--space-16);
}

/* Responsive tweaks */
@media (max-width: 900px) {
  .aboutus-hero, .aboutus-journey, .aboutus-commitment, .aboutus-future-content {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }
  .aboutus-community-gallery {
    grid-template-columns: 1fr;
  }
  .aboutus-values-list, .aboutus-team-list, .aboutus-usp-list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 700px) {
  .aboutus-community-content {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }
  .aboutus-values-list, .aboutus-team-list, .aboutus-usp-list {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }
}
/* Section spacing on small screens */
@media (max-width: 600px) {
  .aboutus-hero-section, .aboutus-journey-section, .aboutus-commitment-section, .aboutus-usp-section, .aboutus-values-section, .aboutus-team-section, .aboutus-community-section, .aboutus-future-section, .aboutus-cta-section {
    padding-top: var(--space-8);
    padding-bottom: var(--space-8);
  }
}