.j2p-quote {
  width: 100vw;
  max-width: 100vw;
  margin: 8px 0 0 calc(50% - 50vw);
  padding: 40px 24px;
  background: color-mix(in srgb, var(--j2p-quote, var(--theme-color)) 9%, #fff);
  text-align: center;
}

.j2p-quote__inner {
  max-width: 760px;
  margin: 0 auto;
}

.j2p-quote__text {
  margin: 0;
}

.j2p-quote__text::before,
.j2p-quote__text::after {
  content: "";
  display: block;
  width: 72px;
  height: 3px;
  margin: 0 auto;
  border-radius: 3px;
  background: var(--j2p-quote, var(--theme-color));
}

.j2p-quote__text::before {
  margin-bottom: 18px;
}

.j2p-quote__text::after {
  margin-top: 18px;
}

.j2p-quote__text p {
  margin: 0;
  color: #1f2430;
  font-size: clamp(1.35rem, 2.6vw, 1.9rem);
  font-weight: 800;
  line-height: 1.35;
}

.j2p-quote__by {
  margin: 14px 0 0;
  color: #6b7280;
  font-size: 0.95rem;
  font-weight: 600;
}

@media (max-width: 640px) {
  .j2p-quote {
    padding: 32px 18px;
  }
}