/* ============================================================
   FROM THE MEN — testimonial carousel (roninman.com)
   Swipe sideways on a phone, arrows or dots on desktop, turns
   by itself every 30 seconds (stories.js). Any voice note keeps
   playing while it turns; only its own button or another voice
   note stops it (voice.js). Colors come from the page's :root.
   ============================================================ */
.tcar-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;max-width:820px}
.tcar-nav{display:flex;gap:8px;flex:0 0 auto;margin-top:-6px}
.tcar-btn{width:42px;height:42px;border-radius:50%;border:1.5px solid rgba(30,42,74,.28);background:transparent;color:var(--indigo);font-family:var(--serif);font-size:26px;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0 0 3px;transition:background .2s,border-color .2s,transform .2s;-webkit-tap-highlight-color:transparent}
.tcar-btn:hover{background:rgba(30,42,74,.07);border-color:var(--indigo);transform:translateY(-1px)}
.tcar-btn:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
.tcar{position:relative;max-width:820px}
.tcar-track{position:relative;display:flex;gap:48px;align-items:flex-start;overflow-x:auto;overflow-y:hidden;transition:height .45s ease;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;outline:none;cursor:grab}
.tcar-track::-webkit-scrollbar{display:none}
.tcar-track.dragging{cursor:grabbing;scroll-snap-type:none;scroll-behavior:auto}
.tcar-track:focus-visible{outline:2px solid var(--teal);outline-offset:10px;border-radius:6px}
.tslide{flex:0 0 100%;width:100%;scroll-snap-align:start;scroll-snap-stop:always;box-sizing:border-box}
.tslide h2{font-family:var(--sans);font-weight:500;color:var(--indigo);font-size:clamp(26px,3.4vw,38px);margin-bottom:22px}
.tslide .bigquote{max-width:none}
.tcar-foot{display:flex;align-items:center;gap:18px;margin-top:30px;max-width:820px}
.tcar-dots{display:flex;gap:9px;align-items:center}
.tcar-dot{width:9px;height:9px;border-radius:50%;background:rgba(30,42,74,.22);border:none;padding:0;cursor:pointer;transition:transform .25s,background .25s}
.tcar-dot:hover{background:rgba(30,42,74,.45)}
.tcar-dot.on{background:linear-gradient(135deg,var(--amber),var(--coral));transform:scale(1.35)}
.tcar-dot:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
.tcar-count{font-family:var(--sans);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(30,42,74,.55);font-variant-numeric:tabular-nums}
.tcar-hint{margin-left:auto;font-family:var(--sans);font-size:12.5px;color:rgba(30,42,74,.5)}
/* thin line that fills over the 30 seconds, then the next man is up */
.tcar-prog{position:relative;height:2px;max-width:820px;background:rgba(30,42,74,.12);margin-top:18px;border-radius:2px;overflow:hidden}
.tcar-prog i{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,var(--amber),var(--coral));transition:width .3s linear}
.tcar.paused .tcar-prog{opacity:.45}
/* small "still playing" pill that shows when you swipe away from a voice note that is playing */
.tcar-live{display:none;align-items:center;gap:8px;margin-top:16px;font-family:var(--sans);font-size:12.5px;letter-spacing:.06em;color:var(--indigo);background:rgba(255,255,255,.6);border:1px solid rgba(30,42,74,.12);border-radius:999px;padding:6px 14px 6px 8px;cursor:pointer}
.tcar-live.on{display:inline-flex}
.tcar-live i{width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,var(--amber),var(--coral));display:grid;place-items:center}
.tcar-live i::after{content:"";width:0;height:0;border-left:6px solid #fff;border-top:4px solid transparent;border-bottom:4px solid transparent;margin-left:2px}
@media(max-width:600px){
  .tcar-nav{display:none}
  .tcar-track{gap:32px}
  .tcar-hint{display:none}
  .tcar-foot{margin-top:24px}
}
@media(prefers-reduced-motion:reduce){
  .tcar-prog i{transition:none}
  .tcar-track{transition:none}
}
