/**
 * @file
 * PGF Standalone Quote Component Styling
 */

.pgf-quote {
    width: 100%;
    padding-block: var(--spacing-l);
}

.pgf-quote__inner {
    position: relative;
    max-width: var(--container-small, 800px);
    margin-inline: auto;
    margin-block: 0;

    /* Linker accentstreep met royale ruimte op basis van de Gulden Snede (Phi) */
    border-left: 3px solid var(--color-accent);
    padding-left: calc(var(--spacing-l) * var(--phi)); /* ~3.2rem ademruimte */
    padding-right: var(--spacing-m);
    padding-block: var(--spacing-xs);
    text-align: left;
}

/* Decoratief goud/accent aanhalingsteken */
.pgf-quote__mark {
    display: block;
    font-family: var(--font-heading);
    font-size: 4rem;
    line-height: 1;
    color: var(--color-accent);
    margin-bottom: calc(var(--spacing-s) * -1);
    opacity: 0.8;
    user-select: none;
}

/* Citaattekst in cursief Serif (Libre Baskerville) */
.pgf-quote__text {
    font-family: var(--font-quote);
    font-style: italic;
    font-size: clamp(1.3rem, 3vw, 1.85rem);
    line-height: var(--phi);
    color: var(--color-white);
    margin-bottom: calc(var(--spacing-m) * var(--phi));
}

.pgf-quote__text p:first-child { margin-top: 0; }
.pgf-quote__text p:last-child { margin-bottom: 0; }

/* Auteur sectie & Avatar */
.pgf-quote__footer {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: var(--spacing-m);
}

.pgf-quote__avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    border: 2px solid var(--color-accent);
    box-shadow: 0 4px 12px rgba(68, 33, 0, 0.1);
}

.pgf-quote__avatar img,
.pgf-quote__avatar picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pgf-quote__meta {
    text-align: left;
}

/* Auteur apart gezet in strakke, kleine opmaak */
.pgf-quote__author-name {
    display: block;
    font-family: var(--font-testimonial);
    font-style: normal;
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--color-text-main);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    opacity: 0.85;
}