/* ===========================================================
   ShiftPress — Quote carousel
   Uses the design tokens + existing .quote blockquote/.who/.av/.quote-mark
   styles already defined on the page. Add slides inside .quote-track.
   =========================================================== */
.quote-carousel{position:relative;max-width:50em;margin:0 auto}
.quote-viewport{overflow:hidden}
.quote-track{display:flex;align-items:stretch;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.quote-slide{flex:0 0 100%;min-width:0;padding:0 10px;text-align:center;
  display:flex;flex-direction:column;justify-content:center}

/* controls */
.quote-nav{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:36px}
.quote-arrow{flex:none;width:42px;height:42px;border-radius:50%;border:1px solid var(--line-strong);
  background:var(--cream);display:grid;place-items:center;cursor:pointer;color:var(--ink-soft);
  transition:border-color .25s,color .25s,transform .25s,background .25s}
.quote-arrow:hover{border-color:var(--moss);color:var(--moss);transform:translateY(-2px)}
.quote-arrow:active{transform:translateY(0)}
.quote-dots{display:flex;align-items:center;gap:9px}
.quote-dot{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:var(--line-strong);
  cursor:pointer;transition:background .25s,width .25s,border-radius .25s}
.quote-dot:hover{background:var(--sage)}
.quote-dot.active{background:var(--gold);width:22px;border-radius:5px}

/* a single quote needs no controls */
.quote-carousel.single .quote-nav{display:none}

@media(prefers-reduced-motion:reduce){.quote-track{transition:none}}