/* "Real client stories" as a scrolling strip, like the Client reviews section.
   Uses the same track/loop as google-reviews.css (.df-review-window / .df-review-track / .df-review-set). */
#community-testimonials .df-story-strip{margin:0 -16px;padding:4px 0 8px;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
#community-testimonials .df-story-strip .df-review-track{animation-duration:240s}
#community-testimonials .df-story-strip .df-review-set{gap:20px;padding-right:20px;align-items:stretch}

#community-testimonials .df-story-strip .df-testimonial{width:320px;flex:0 0 320px;margin:0;display:flex;flex-direction:column;align-items:center;text-align:center;padding:24px 22px 22px;background:#2a2142;border:1px solid #ffffff14;border-radius:12px;box-sizing:border-box}
/* Photo: full-width rectangle at the top of the card (was a small circle) */
#community-testimonials .df-story-strip .r-portrait{position:relative;width:100%;height:auto;aspect-ratio:4/3;margin:0 0 14px;border:0;border-radius:10px;background:#352369;overflow:hidden;box-shadow:0 0 0 1px #da3f9655,0 10px 26px #0000004d}
#community-testimonials .df-story-strip .r-portrait img{width:100%;height:100%;object-fit:cover;object-position:center 30%;margin:0!important;border-radius:0;transition:transform .5s ease}
#community-testimonials .df-story-strip .df-hba1c{margin:4px 0 12px;min-height:0}
#community-testimonials .df-story-strip .df-hba1c-label{font-size:12px}
#community-testimonials .df-story-strip .df-hba1c-values{font-size:24px;gap:10px;line-height:1.3}
#community-testimonials .df-story-strip .df-testimonial-description{font-size:15px;line-height:1.55;margin:0 0 14px;flex:1}
#community-testimonials .df-story-strip .df-testimonial h3{font-size:28px;margin:0 0 2px}
#community-testimonials .df-story-strip .r-testimonial-role{font-size:13px;margin:0 0 14px}
#community-testimonials .df-story-strip .df-testimonial-cta{font-size:20px;padding:12px 10px;width:100%;max-width:none;margin-top:auto}

@media(max-width:767px){
  #community-testimonials .df-story-strip .df-testimonial{width:280px;flex-basis:280px;padding:20px 18px}
  #community-testimonials .df-story-strip .df-testimonial h3{font-size:24px}
  #community-testimonials .df-story-strip .df-testimonial-description{font-size:14px}
  #community-testimonials .df-story-strip .df-testimonial-cta{font-size:18px}
}

/* Drag-to-slide strips (marquee-drag.js takes over from the CSS animation) */
.df-review-window.is-js-marquee{cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.df-review-window.is-js-marquee.is-dragging{cursor:grabbing}
.df-review-window.is-js-marquee .df-review-track{animation:none!important;will-change:transform}
.df-review-window.is-js-marquee img{-webkit-user-drag:none;pointer-events:none}
.df-review-window.is-js-marquee button,.df-review-window.is-js-marquee a{cursor:pointer}
@media(prefers-reduced-motion:reduce){.df-review-window.is-js-marquee{overflow:hidden}.df-review-window.is-js-marquee .df-review-set[aria-hidden]{display:flex}}

/* Cards with a video: the photo shows a play button and the whole card opens the video (story-cards.js) */
#community-testimonials .df-story-strip .df-testimonial.has-video{cursor:pointer;transition:border-color .25s,box-shadow .25s}
#community-testimonials .df-story-strip .df-testimonial.has-video:hover{border-color:#da3f9666;box-shadow:0 0 28px #da3f9633}
#community-testimonials .df-story-strip .df-testimonial.has-video:hover .r-portrait img{transform:scale(1.04)}
#community-testimonials .df-story-strip .df-testimonial:focus-visible{outline:3px solid #f2b8e0;outline-offset:3px}
.df-card-play{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-end;padding:10px;background:linear-gradient(180deg,#0000 45%,#1b123899);pointer-events:none}
.df-card-play i{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;background:#da3f96e6;box-shadow:0 0 0 6px #da3f9640,0 8px 22px #0006;transition:transform .25s}
.df-card-play i::before{content:"";border-style:solid;border-width:10px 0 10px 16px;margin-left:4px;border-color:transparent transparent transparent #fff}
.df-card-play b{position:absolute;left:10px;bottom:22px;font:700 11px/1 ReplicaInter,Arial,sans-serif;letter-spacing:1px;text-transform:uppercase;color:#fff;background:#1b1238b3;padding:5px 8px;border-radius:999px}
.df-testimonial.has-video:hover .df-card-play i{transform:scale(1.1)}

/* Video popup */
.df-story-modal{width:min(94vw,960px);max-width:none;max-height:none;padding:0;border:0;border-radius:14px;background:#000;overflow:visible}
.df-story-modal::backdrop{background:#0f0a1ee6}
.df-story-modal-body{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:14px;overflow:hidden}
.df-story-modal:has(.is-vertical){width:auto}
.df-story-modal-body.is-vertical{aspect-ratio:9/16;width:auto;height:min(86vh,calc(94vw*16/9))}
.df-story-modal-body video,.df-story-modal-body iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}
.df-story-modal-body .voomly-embed{position:absolute;inset:0}
.df-story-modal-close{position:absolute;top:-14px;right:-14px;z-index:2;width:40px;height:40px;border:0;border-radius:50%;background:#da3f96;color:#fff;font:400 26px/40px Arial,sans-serif;cursor:pointer;box-shadow:0 4px 14px #0008}
@media(max-width:767px){.df-story-modal-close{top:-50px;right:0}}

/* Shorter cards: wider photo, tighter spacing, smaller text */
#community-testimonials .df-story-strip .df-testimonial{padding:14px 16px 16px}
#community-testimonials .df-story-strip .r-portrait{aspect-ratio:16/9;margin-bottom:10px}
#community-testimonials .df-story-strip .df-hba1c{margin:0 0 6px}
#community-testimonials .df-story-strip .df-hba1c-values{font-size:21px;line-height:1.25}
#community-testimonials .df-story-strip .df-hba1c-missing{margin-top:0;font-size:11px}
#community-testimonials .df-story-strip .df-testimonial-description{font-size:14px;line-height:1.5;margin:0 0 10px}
#community-testimonials .df-story-strip .df-testimonial h3{font-size:24px;line-height:1.1;margin:0}
#community-testimonials .df-story-strip .r-testimonial-role{margin:0 0 10px}
#community-testimonials .df-story-strip .df-testimonial-cta{font-size:17px;padding:10px}

/* Video story cards (27 stories from the Doctor Farmer video carousel): cover, name, what the story is about, short story */
#community-testimonials .df-story-strip .df-video-story .r-portrait{aspect-ratio:3/2}
#community-testimonials .df-story-strip .df-video-story .r-portrait img{object-position:center 30%}
#community-testimonials .df-story-strip .df-video-story h3{margin:4px 0 2px}
#community-testimonials .df-story-strip .df-video-story .r-testimonial-role{color:#f2b8e0;font-weight:600;letter-spacing:.3px;margin:0 0 10px}
#community-testimonials .df-story-strip .df-video-story .df-testimonial-description{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;overflow:hidden;flex:0 0 auto;margin-bottom:16px}
#community-testimonials .df-story-strip .df-video-story .df-testimonial-cta{margin-top:auto}

/* A story video playing inside its card's picture frame */
#community-testimonials .df-story-strip .r-portrait .df-card-player{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000;display:block}
#community-testimonials .df-story-strip .df-testimonial.is-playing{border-color:#da3f96aa;box-shadow:0 0 28px #da3f9644}
#community-testimonials .df-story-strip .df-card-player-close{position:absolute;top:6px;left:6px;z-index:2;width:30px;height:30px;border:0;border-radius:50%;background:#000000b3;color:#fff;font:600 20px/1 Arial,sans-serif;display:grid;place-items:center;cursor:pointer}
#community-testimonials .df-story-strip .df-card-player-close:hover{background:#da3f96}
/* The story videos are portrait (9:16) with the interview in a band across the middle. The card keeps its size:
   the Drive player is enlarged and moved so that band fills the picture frame, just like the cover photo. */
#community-testimonials .df-story-strip .r-portrait .df-card-player.is-drive{inset:auto;left:50%;top:50%;width:106%;height:auto;aspect-ratio:9/16;transform:translate(-50%,-42.6%)}
/* Catches swipes over a playing video; the hole in the middle lets taps reach the player's play button */
#community-testimonials .df-story-strip .df-card-player-shield{position:absolute;inset:0;z-index:1;background:transparent;touch-action:pan-y;
  clip-path:polygon(evenodd,0 0,100% 0,100% 100%,0 100%,0 0,25% 28%,72% 28%,72% 80%,25% 80%,25% 28%)}
#community-testimonials .df-story-strip .df-testimonial.is-playing .r-portrait{-webkit-user-select:none;user-select:none}