/* quote-single. Scoped to its root class. Colours come only from tokens.css. */
.sk.sk-quote-single { background: var(--sk-surface); }
.sk.sk-quote-single .sk-inner { display: grid; grid-template-columns: minmax(70px, 2fr) minmax(0, 10fr); gap: clamp(16px, 3cqi, 40px); padding-block: var(--sk-section-y); }
.sk.sk-quote-single .sk-mark { display: flex; gap: 6%; width: 100%; max-width: 160px; }
.sk.sk-quote-single .sk-mark span { flex: 1; aspect-ratio: 1 / 2; background: var(--sk-accent); border-radius: var(--sk-radius-arch) 0 var(--sk-radius-arch) 0; }
.sk.sk-quote-single .sk-mark span + span { background: var(--sk-third); }
.sk.sk-quote-single .sk-body { display: flex; flex-direction: column; gap: clamp(24px, 3.4cqi, 44px); }
.sk.sk-quote-single .sk-quote { font-family: var(--sk-font-display); font-weight: var(--sk-weight-display); font-size: var(--sk-text-quote); line-height: 1.14; letter-spacing: var(--sk-track-display); text-wrap: pretty; }
.sk.sk-quote-single:lang(zh) .sk-quote { line-height: 1.34; }
.sk.sk-quote-single .sk-face { width: 84px; height: 84px; }
.sk.sk-quote-single .sk-name { font-size: var(--sk-text-lg); }
@container sk (max-width: 460px) {
  .sk.sk-quote-single .sk-inner { grid-template-columns: minmax(0, 1fr); }
  .sk.sk-quote-single .sk-mark { max-width: 72px; }
}