/* A full-width, quiet band separates customer voices from adjacent sections. */
.ax-customer-quote {
  background: var(--ax-theme-quote-bg);
  color: var(--ax-theme-quote-text);
  padding-block: var(--ax-6);
}
.ax-customer-quote__inner {
  margin: 0;
}
.ax-customer-quote--with-portrait .ax-customer-quote__inner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--ax-4);
  align-items: stretch;
}
/* The copy sets the height; the portrait ratio gives the frame its exact width. */
.ax-customer-quote__portrait-frame {
  position: relative;
  min-inline-size: 0;
  block-size: 100%;
  aspect-ratio: var(--ax-portrait-ratio);
}
.ax-customer-quote__portrait {
  position: absolute;
  inset: 0;
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: contain;
  object-position: right center;
  background: transparent;
}
.ax-customer-quote__copy { min-inline-size: 0; }
.ax-customer-quote blockquote {
  margin: 0;
  padding-inline-start: var(--ax-3);
  border-inline-start: 2px solid var(--ax-theme-quote-accent);
  font-size: clamp(1.125rem, 1.65vw, 1.5rem);
  line-height: 1.4;
  font-weight: 300;
}
.ax-customer-quote .ax-small { color: var(--ax-theme-quote-muted); }
.ax-customer-quote figcaption strong { font-weight: 500; }
.ax-customer-quote figcaption { padding-inline-start: calc(var(--ax-3) + 2px); }
@media (max-width: 900px) {
  .ax-customer-quote { padding-block: var(--ax-4); }
  .ax-customer-quote--with-portrait .ax-customer-quote__inner { grid-template-columns: minmax(0, 1fr); gap: var(--ax-3); }
  .ax-customer-quote__portrait-frame { inline-size: auto; block-size: 120px; justify-self: start; }
  .ax-customer-quote__portrait { object-position: left bottom; }
}