.cainco-quote {
    --cainco-quote-background: #fff;
    --cainco-quote-text-color: #111;
    --cainco-quote-author-color: #111;
    --cainco-quote-detail-color: #c8c8c8;
    --cainco-quote-mark-color: #f0f0f0;
    --cainco-quote-accent-color: #111;
    --cainco-quote-border-radius: 6px;
    --cainco-quote-card-max-width: 334px;
    --cainco-quote-card-min-height: 272px;
    --cainco-quote-attribution-spacing: 26px;
    --cainco-quote-cta-spacing: 20px;
    --cainco-quote-accent-offset-bottom: -30px;
    --cainco-quote-accent-offset-right: 26px;
    --cainco-quote-text-font-size: 15px;
    --cainco-quote-text-font-weight: 400;
    --cainco-quote-text-line-height: 1.48;
    --cainco-quote-author-font-size: 15px;
    --cainco-quote-author-font-weight: 500;
    --cainco-quote-author-line-height: 1.25;
    --cainco-quote-detail-font-size: 13px;
    --cainco-quote-detail-font-weight: 400;
    --cainco-quote-detail-line-height: 1.2;
    --cainco-quote-cta-color: #111;
    --cainco-quote-cta-hover-color: #444;
    --cainco-quote-cta-font-size: 13px;
    --cainco-quote-cta-font-weight: 600;

    background: var(--cainco-quote-background);
    border-radius: var(--cainco-quote-border-radius);
    box-sizing: border-box;
    color: var(--cainco-quote-text-color);
    margin: 0;
    max-width: var(--cainco-quote-card-max-width);
    min-height: var(--cainco-quote-card-min-height);
    overflow: visible;
    padding: 34px 32px 78px;
    position: relative;
    width: 100%;
}

.cainco-quote--has-mark::before {
    color: var(--cainco-quote-mark-color);
    content: "\201C";
    font-family: Georgia, "Times New Roman", serif;
    font-size: 72px;
    font-weight: 700;
    left: 16px;
    line-height: 1;
    position: absolute;
    top: 6px;
    z-index: 0;
}

.cainco-quote__body,
.cainco-quote__text {
    margin: 0;
}

.cainco-quote__body,
.cainco-quote__attribution {
    position: relative;
    z-index: 1;
}

.cainco-quote__text {
    color: var(--cainco-quote-text-color);
    font-size: var(--cainco-quote-text-font-size);
    font-weight: var(--cainco-quote-text-font-weight);
    line-height: var(--cainco-quote-text-line-height);
}

.cainco-quote__attribution {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-top: var(--cainco-quote-attribution-spacing);
}

.cainco-quote__author {
    color: var(--cainco-quote-author-color);
    font-size: var(--cainco-quote-author-font-size);
    font-weight: var(--cainco-quote-author-font-weight);
    line-height: var(--cainco-quote-author-line-height);
}

.cainco-quote__detail {
    color: var(--cainco-quote-detail-color);
    font-size: var(--cainco-quote-detail-font-size);
    font-weight: var(--cainco-quote-detail-font-weight);
    line-height: var(--cainco-quote-detail-line-height);
}

.cainco-quote__cta {
    color: var(--cainco-quote-cta-color);
    display: inline-flex;
    font-size: var(--cainco-quote-cta-font-size);
    font-weight: var(--cainco-quote-cta-font-weight);
    line-height: 1.2;
    margin-top: var(--cainco-quote-cta-spacing);
    position: relative;
    text-decoration: none;
    transition: color 160ms ease;
    z-index: 1;
}

.cainco-quote__cta::after {
    background: currentColor;
    bottom: -2px;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    right: 0;
}

.cainco-quote__cta:hover,
.cainco-quote__cta:focus {
    color: var(--cainco-quote-cta-hover-color);
    text-decoration: none;
}

.cainco-quote__accent {
    bottom: var(--cainco-quote-accent-offset-bottom);
    display: block;
    height: 92px;
    position: absolute;
    right: var(--cainco-quote-accent-offset-right);
    width: 84px;
    z-index: 2;
}

.cainco-quote--accent-horizontal .cainco-quote__accent,
.cainco-quote__accent {
    background-image: repeating-linear-gradient(
        to bottom,
        var(--cainco-quote-accent-color) 0,
        var(--cainco-quote-accent-color) 2px,
        transparent 2px,
        transparent 5px
    );
}

.cainco-quote--accent-vertical .cainco-quote__accent {
    background-image: repeating-linear-gradient(
        to right,
        var(--cainco-quote-accent-color) 0,
        var(--cainco-quote-accent-color) 2px,
        transparent 2px,
        transparent 5px
    );
}

.wp-block-cainco-cain-quote {
    width: 100%;
}

@media (max-width: 767px) {
    .cainco-quote {
        max-width: 100%;
        --cainco-quote-card-min-height: 0px;
        --cainco-quote-accent-offset-bottom: -26px;
        --cainco-quote-accent-offset-right: 24px;

        min-height: var(--cainco-quote-card-min-height);
        padding: 32px 28px 76px;
    }

    .cainco-quote__accent {
        height: 82px;
        width: 78px;
    }
}
