/* AUTO-GENERATED by sync-css.js — do not edit directly. */
/* Edit shared-css/ sources or _*-local.css files, then run: node sync-css.js */

/* ============================================
   MaP Blockquote Components
   Shared across all MaP web properties

   Two treatments for two purposes:
   - .bq-provocation: questions, insights, data prompts
     High-value content — the payoff, not the aside.
   - .bq-voice: testimonials, direct quotes, feedback
     Secondary content — someone else speaking.

   Requires MaP design tokens (tokens.css or base.css).
   ============================================ */

/* ===== Provocation Blockquote ===== */

.bq-provocation {
  margin: 1.5em 0;
  padding: 24px;
  font-family: var(--font-serif);
  font-size: var(--wb-p1);
  font-weight: 400;
  font-style: normal;
  line-height: 1.55;
  color: var(--color-text);
  background: var(--color-surface);
  border: 2px solid var(--fx-orange-400);
  border-radius: 6px;
  box-shadow: 0 1px 2px var(--shadow-color);
}

.bq-provocation p {
  margin: 0;
}

.bq-provocation p + p {
  margin-top: 0.75em;
}

/* ===== Voice Blockquote ===== */

.bq-voice {
  margin: 5em 0;
  padding: 0;
  font-family: var(--font-serif);
  font-size: var(--wb-p1);
  font-style: italic;
  line-height: 1.6;
  color: var(--color-text);
  text-align: left;
  background: none;
  border: none;
  border-radius: 0;
  box-shadow: none;
}

.bq-voice p {
  margin: 0;
  padding-left: 1.5rem;
  border-left: 3px solid var(--color-brand);
}

.bq-voice p + p {
  margin-top: 0.75em;
}

.bq-voice__attribution {
  display: block;
  margin-top: 0.75em;
  padding-left: calc(1.5rem + 3px);
  font-family: var(--font-serif);
  font-size: var(--wb-p2);
  font-style: normal;
  font-weight: 400;
  color: var(--color-text-secondary);
}

.bq-voice__attribution::before {
  content: '\2014\00A0';
}

.bq-voice__role {
  display: block;
  padding-left: 1.15em;
}

/* ===== Dark Mode ===== */

html.dark .bq-provocation {
  border-color: var(--fx-blue-400);
}

/* ===== Responsive ===== */

@media (max-width: 640px) {
  .bq-provocation {
    padding: 20px;
    font-size: var(--wb-p2);
  }
}