/* ============================================================
   Quote block — shared testimonial treatment (Patch 20b)
   Single source of truth for the /about and /structure-review
   client quotes (extracted from the About client-quote treatment).
   Linked directly by each consuming page so it does not depend on
   any page-specific CSS variables — colours are literal.
   Light by default; .quote-block--dark renders on dark sections
   (e.g. the diagnostic 16e recipient-quote slot).
   ============================================================ */
.quote-block { display: block; }
/* The mark is the single shared chunky Arc-blue quote glyph
   (brand_assets/northarc-quote-mark.svg), NOT a font/unicode quote. LARGE tier
   (featured / hero quotes). Sits on its own line above the quote with breathing
   room beneath. The “ in the markup is hidden (font-size:0) as a fallback. */
.quote-block__mark {
  display: block;
  width: 31px;
  height: 25px; /* 40% smaller than the original 52x42; background-size:contain keeps the SVG's ratio */
  background: url('/brand_assets/northarc-quote-mark.svg') no-repeat left top;
  background-size: contain;
  font-size: 0;
  line-height: 0;
  color: transparent;
  margin: 0 0 18px;
}
.quote-block__quote {
  font-size: clamp(24px, 3vw, 36px);
  line-height: 1.3;
  font-style: italic;
  font-weight: 400;
  color: #15171B;
  margin: 0;
  max-width: 40ch;
}
.quote-block__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
  margin-top: 44px;
}
.quote-block__id { display: flex; align-items: center; gap: 16px; }
.quote-block__avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  background: #1F2937;
  flex: none;
  display: block;
}
.quote-block__name { font-size: 15px; font-weight: 500; color: #15171B; margin: 0; }
.quote-block__role { font-size: 13px; color: rgba(21, 23, 27, 0.62); margin: 2px 0 0; }
.quote-block__tag {
  font-family: 'Geist Mono', ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #5B6CF2;
}

/* Dark variant — for dark-section placements */
.quote-block--dark .quote-block__quote,
.quote-block--dark .quote-block__name { color: #FAF7F2; }
.quote-block--dark .quote-block__role { color: rgba(250, 247, 242, 0.66); }
.quote-block--dark .quote-block__tag { color: #A8B2F7; }