blockquote {
  --quote-tone: 224, 198, 194;
  width: min(100%, 590px);
  margin: 94px 0 0 auto;
  padding: 38px 0 34px 36px;
  background: transparent;
  border-left: 1px solid rgba(var(--quote-tone), .72);
  border-radius: 0;
  isolation: isolate;
}

blockquote::before {
  top: 2px;
  left: 10px;
  color: rgb(var(--quote-tone));
  opacity: .48;
}

blockquote::after {
  inset: -44px -11vw -42px -7vw;
  z-index: -1;
  opacity: 1;
  filter: none;
  border-radius: 0;
  background:linear-gradient(90deg, transparent 0%, rgba(var(--quote-tone), .16) 13%, rgba(var(--quote-tone), .52) 48%, rgba(var(--quote-tone), .24) 82%, transparent 100%);
}

.analysis-section blockquote { --quote-tone: 222, 193, 186; }
.approach blockquote { --quote-tone: 190, 207, 206; }
.journey blockquote { --quote-tone: 224, 205, 184; }
.intro blockquote { margin: 148px -4% 0 auto; }
.philosophy-quote,
.quote-right { margin-top: 94px; }

.analysis-section > .concept-line { margin-top: 52px; }
.analysis-section > .philosophy-quote + .concept-line { margin-top: 112px; }
.analysis-section .why { margin-top: 72px; }

.analysis-intro { display:grid; grid-template-columns:minmax(0, 1.35fr) minmax(260px, .65fr); gap:8vw; align-items:end; }
.analysis-intro .philosophy-quote { margin:0 0 38px; }
.analysis-section > .concept-line { margin-top:112px; }

@media (max-width:760px) {
  .analysis-intro { grid-template-columns:1fr; gap:0; }
  .analysis-intro .philosophy-quote { margin:55px 0 0; }
  .analysis-section > .concept-line { margin-top:76px; }
}

.why-intro {
  max-width: 410px;
  margin: -25px 0 42px;
  color: #5b6b72;
  font-family: var(--serif);
  font-size: 20px;
  line-height: 1.35;
}

blockquote p { margin-bottom: 16px; }
blockquote cite { display: block; }

@media (max-width: 760px) {
  blockquote { width: 100%; margin-top: 72px; padding: 34px 0 30px 27px; }
  .intro blockquote { margin: 80px 0 0; }
  .philosophy-quote,
  .quote-right { margin-top: 72px; }
  blockquote::after { inset: -33px -32px; }
  blockquote::before { top: 0; left: 8px; }
}