@import url("./base.css");
@import url("./components.css");
@import url("./header.css");
@import url("./main.css");

.hero--centered .hero-text {
  text-align: left;
}

.hero--centered .hero-portrait {
  display: block;
  margin: 0 auto;
}

.about-gallery-intro {
  text-align: center;
  color: var(--accent);
  margin-bottom: 2rem;
}

.testimonials-section {
  background: transparent !important;
}

.testimonials-grid {
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 2rem !important;
}

.card.testimonial-card,
.testimonial-card {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 1rem !important;
  padding: 1.25rem !important;
  background: transparent !important;
  box-shadow: none !important;
}

.card.testimonial-card > img.avatar,
.testimonial-card > img.avatar,
.testimonial-avatar {
  width: 72px !important;
  height: 72px !important;
  max-width: 72px !important;
  object-fit: cover !important;
  border-radius: 50% !important;
  flex: 0 0 72px !important;
  margin: 4px 0 0 0 !important;
  display: block !important;
}

.testimonial-card:hover {
  transform: none !important;
  box-shadow: none !important;
}

.testimonial-card .card-content {
  padding: 0;
  display: flex;
  flex-direction: column;
}

@media (min-width: 900px) {
  .testimonials-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 768px) {
  .testimonials-grid {
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }

  .testimonial-card {
    flex-direction: column !important;
  }

  .card.testimonial-card > img.avatar,
  .testimonial-card > img.avatar,
  .testimonial-avatar {
    width: 64px !important;
    height: 64px !important;
    border-radius: 50% !important;
    flex: none !important;
    margin: 0 0 1rem 0 !important;
  }

  .hero-grid {
    grid-template-columns: 1fr !important;
    text-align: center !important;
  }
}