/* ==========================================================================
   COMPONENTS · PULL QUOTE — a lifted line set large in serif italic, with a
   hanging rubric quotation mark as the one identity flourish. For landing pages
   and feature openers; never inside the dense reading column.
   ========================================================================== */

.op-pullquote {
  position: relative;
  margin: var(--space-lg) 0;
  padding-left: var(--space-lg);
  max-width: var(--measure);
}

.op-pullquote::before {
  content: "\201C";              /* a left double quote */
  position: absolute;
  left: -0.06em;
  top: -0.18em;
  font-family: var(--font-reading);
  font-size: 3.2em;
  line-height: 1;
  color: var(--accent);
  opacity: 0.9;
}

.op-pullquote__text {
  font-family: var(--font-reading);
  font-style: italic;
  font-size: var(--text-lg);
  line-height: var(--leading-snug);
  color: var(--text);
}

.op-pullquote__cite {
  display: block;
  margin-top: var(--space-sm);
  font-family: var(--font-furniture);
  font-style: normal;
  font-size: var(--text-2xs);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--text-secondary);
}