/* utisci — beskonačna traka.
   Mehanika trake je u pew.css (§14 MARQUEE) i pew.js; ovde je samo izgled
   kartice i poravnanje trake sa kontejnerom. */

/* Traka izlazi iz kontejnera do ivice ekrana, ali prva kartica mora da počne
   tamo gde počinje i naslov iznad nje — inače traka izgleda kao da je
   pomerena, a ne kao da je šira. */
.pew-quotes {
    padding-inline: max(var(--gutter), (100vw - var(--w-base)) / 2 + var(--gutter));
}
/* Prostor za okvir kartice; bez ovoga maska na ivicama seče gornju liniju. */
.pew-quotes .pew-marquee__viewport { padding-block: 4px; }

.pew-quote {
    height: 100%;
    display: flex;
    flex-direction: column;
    padding: clamp(1.35rem, 2.2vw, 1.85rem);
    background: var(--pew-surface);
    border: 1px solid var(--pew-line);
    border-radius: var(--r-md);
}

.pew-quote__text {
    font-family: var(--pew-font-display);
    font-size: var(--fs-h3);
    line-height: 1.45;
    letter-spacing: var(--tr-heading);
    color: var(--pew-fg);
    margin: 0 0 var(--sp-md);
    /* Gura potpis na dno, pa se kartice različite dužine poravnavaju po autoru. */
    flex: 1;
}
/* Navodnik u toku, ne apsolutno pozicioniran: sa negativnim top-om izlazi iz
   kartice na svakoj visini koju nismo predvideli. Ovako sam sebi pravi mesto
   i ne može da pobegne. */
.pew-quote__text::before {
    content: '\201C';
    display: block;
    font-family: var(--pew-font-display);
    font-size: 3rem;
    line-height: .7;
    color: var(--pew-accent-fill);
    opacity: .5;
    margin-bottom: .3rem;
}

.pew-quote__author {
    display: flex;
    align-items: center;
    gap: var(--sp-sm);
    padding-top: var(--sp-md);
    border-top: 1px solid var(--pew-line);
}
.pew-quote__avatar { width: 44px; flex: none; }
.pew-quote__name { display: block; font-weight: 600; color: var(--pew-fg); line-height: 1.3; }
.pew-quote__role { display: block; font-size: var(--fs-tiny); color: var(--pew-fg-muted); }