.sq-quote.sq-single-flex-block--quote {
    margin: 0;
    padding: 0;
    border: 0;
    color: var(--text-color--accent);
}

.sq-quote.sq-single-flex-block--quote blockquote {
    margin: 0;
    color: inherit;
    /* Neutraliseert de globale blockquote-stijl (style.css) voor tekst zonder <p>-wrapper. */
    font: inherit;
    letter-spacing: inherit;
}

.sq-quote.sq-single-flex-block--quote blockquote p {
    position: relative;
    margin: 0;
    font-family: var(--font-macan);
    font-size: 2rem;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    font-variant-ligatures: none;
    font-feature-settings: "ss03" on, "liga" off, none;
    letter-spacing: -.03em;
    line-height: 1.25;
}

.sq-quote.sq-single-flex-block--quote blockquote p::before {
    content: open-quote;
}

.sq-quote.sq-single-flex-block--quote blockquote p::after {
    content: close-quote;
}

.sq-quote.sq-single-flex-block--quote figcaption {
    margin-top: 2.4rem;
    color: inherit;
    font-family: var(--font-macan);
    font-size: 1.4rem;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    font-variant-ligatures: none;
    font-feature-settings: "ss03" on, "liga" off, none;
    letter-spacing: -.02em;
    line-height: 1.75;
}

.sq-quote.sq-single-flex-block--quote figcaption::before {
    content: "— ";
}

.sq-quote.sq-single-flex-block--quote cite {
    font: inherit;
}

@media only screen and (min-width: 600px) {
    .sq-quote.sq-single-flex-block--quote blockquote p {
        font-size: 2.4rem;
    } 
}

@media only screen and (min-width: 1000px) {
    .sq-quote.sq-single-flex-block--quote blockquote p::before {
        position: absolute;
        right: 100%;
    }
}

@media only screen and (min-width: 1792px) {
    .sq-quote.sq-single-flex-block--quote blockquote p {
        font-size: max(2.4rem, min(-2.2666666667rem + 2.6041666667vw, 4.4rem));
    }

    .sq-quote.sq-single-flex-block--quote figcaption {
        font-size: max(1.4rem, min(.78125vw, 2rem));
    }
}