.quote{--text-color: var(--white);--quote-marks-size: var(--size-20);--marks-color: var(--gold-300);container:quote / inline-size;display:grid;gap:var(--size-10);justify-items:center;margin-inline:auto;max-inline-size:99ch;text-align:center}:where([class*=bg-blue-]:not(.bg-blue-100)) .quote{color:var(--text-color)}:where([class*=bg-blue-]:not(.bg-blue-100)) .quote .quote__title{color:var(--text-color)}.quote__marks{display:flex;inline-size:var(--quote-marks-size);justify-content:center}@container (inline-size >= 45rem){.quote__marks{--quote-marks-size: var(--size-24);inline-size:calc(var(--quote-marks-size) * 1.5)}}.quote__marks svg path{fill:var(--marks-color)}:where([class*=bg-blue-]:not(.bg-blue-300)) .quote__marks svg path{--marks-color: var(--blue-300);fill:var(--marks-color)}.quote__content{padding-inline:var(--size-4)}@container (inline-size >= 64rem){.quote__content{padding-inline:0}}.quote__content>*+*{margin-block-start:var(--size-5)}.quote__content .button{display:inline-flex;justify-self:center}.quote__title{font-size:clamp(var(--h2-min),1.386rem + 1.176vw,var(--h2-max));text-wrap:balance}.quote__author{font-style:normal;margin-block-start:var(--size-5)}