/* MoxKit team widget. Design rules stay at two classes so the Elementor style controls (also two) win. */
.moxkit-team{text-align:center;--moxkit-team-justify:center;--moxkit-team-ease:cubic-bezier(.2,0,.3,1)}
.moxkit-team-media{position:relative;width:120px;max-width:100%;margin:0 auto 20px}
/* Two classes: Elementor's ".elementor img{border-radius:0}" would otherwise square off the Photo radius. */
.moxkit-team .moxkit-team-photo{width:100%;aspect-ratio:1;object-fit:cover;border-radius:inherit}
.moxkit-team .moxkit-person-name{font-size:22px;font-weight:700;margin:0 0 4px}
.moxkit-team-role{font-size:14px;font-weight:600;color:var(--moxkit-accent);margin:0 0 16px}
.moxkit-team .moxkit-description{margin:0 auto 20px;max-width:46ch}
.moxkit-team-socials{display:flex;flex-wrap:wrap;gap:8px;justify-content:var(--moxkit-team-justify);font-size:18px}
.moxkit-team-socials a{display:inline-flex;align-items:center;justify-content:center;min-width:var(--moxkit-social-box, 40px);min-height:var(--moxkit-social-box, 40px);border-radius:8px;color:var(--moxkit-muted);background:#f2f4f7}
.moxkit-team-socials a:is(:hover,:focus-visible){color:#fff;background:var(--moxkit-accent)}

/* Rating badge. */
.moxkit-team-rating{position:absolute;z-index:3;top:12px;right:12px;display:inline-flex;align-items:center;gap:4px;padding:3px 9px 3px 7px;border-radius:99px;background:#ffd84d;color:#111827;font-size:12px;font-weight:700;line-height:1.5;box-shadow:0 6px 16px -6px rgba(16,24,40,.35)}
.moxkit-team-rating svg{width:1.1em;height:1.1em;fill:var(--moxkit-team-star,currentColor)}
.moxkit-team--classic .moxkit-team-rating{top:2%;right:-16%}
.moxkit-team--side .moxkit-team-rating{top:auto;right:auto;bottom:10px;left:10px;background:#fff;--moxkit-team-star:#f59e0b}

/* Photo effects. */
.moxkit-team-photo{transition:transform .7s var(--moxkit-team-ease),filter .5s ease}
.moxkit-team--gray .moxkit-team-photo,.moxkit-team--gray-hover .moxkit-team-photo{filter:grayscale(1)}
.moxkit-team--gray-hover:is(:hover,:focus-within) .moxkit-team-photo{filter:none}
.moxkit-team--zoom:is(:hover,:focus-within) .moxkit-team-photo{transform:scale(1.07)}
.moxkit-team--lift{transition:transform .45s var(--moxkit-team-ease),box-shadow .45s ease}
.moxkit-team--lift:is(:hover,:focus-within){transform:translateY(-8px)}

/* Every design except the classic card: the photo fills the card width. */
/* min-width: in a Flex row the widget is as wide as its content, and the caption may sit on the photo. */
.moxkit-team:where(:not(.moxkit-team--classic)){position:relative;min-width:min(100%,240px);padding:0;overflow:hidden}
.moxkit-team:where(:not(.moxkit-team--classic)) .moxkit-team-media{width:auto;margin:0;border-radius:0;overflow:hidden}
.moxkit-team:where(:not(.moxkit-team--classic)) .moxkit-team-photo{aspect-ratio:var(--moxkit-team-ratio,4/5);height:auto}
.moxkit-team:where(:not(.moxkit-team--classic)) .moxkit-team-body{padding:22px 24px}
.moxkit-team:where(:not(.moxkit-team--classic)) .moxkit-team-body>:last-child{margin-bottom:0}
.moxkit-team:where(:not(.moxkit-team--classic)) .moxkit-description{max-width:none}
.moxkit-team-ph{background:linear-gradient(135deg,#e4e7ec,#c9cfd8)}

/* Name, role, and bio on the photo or in the floating box. Three classes: beats the global text colors. */
.moxkit-team.moxkit-team--over .moxkit-team-body :is(.moxkit-person-name,.moxkit-team-role,.moxkit-description){color:var(--moxkit-team-ink,#fff)}
.moxkit-team--over .moxkit-team-role{opacity:.82}
.moxkit-team--over .moxkit-description{opacity:.9}

/* Photo with caption strip: the social icons rise over the photo. */
.moxkit-team--strip .moxkit-team-body{padding:18px 24px}
.moxkit-team--strip .moxkit-team-media .moxkit-team-socials{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:40px 16px 16px;background:linear-gradient(to top,rgba(17,24,39,.55),rgba(17,24,39,0));transform:translateY(100%);transition:transform .5s cubic-bezier(.19,1,.22,1)}
.moxkit-team--strip:is(:hover,:focus-within) .moxkit-team-media .moxkit-team-socials{transform:none}

/* Reveal on hover: the caption fades in over the photo, line by line. */
.moxkit-team--reveal{border-color:transparent}
.moxkit-team--reveal .moxkit-team-body{position:absolute;z-index:2;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:28px;background:linear-gradient(to top,rgba(17,24,39,.9),rgba(17,24,39,.35) 55%,rgba(17,24,39,0));opacity:0;transition:opacity .45s ease}
.moxkit-team--reveal .moxkit-team-body>*{transform:translateY(18px);transition:transform .6s var(--moxkit-team-ease)}
.moxkit-team--reveal .moxkit-team-body>:nth-child(2){transition-delay:.05s}
.moxkit-team--reveal .moxkit-team-body>:nth-child(3){transition-delay:.1s}
.moxkit-team--reveal .moxkit-team-body>:nth-child(4){transition-delay:.15s}
.moxkit-team--reveal:is(:hover,:focus-within) .moxkit-team-body{opacity:1}
.moxkit-team--reveal:is(:hover,:focus-within) .moxkit-team-body>*{transform:none}

/* Floating caption box over the lower edge of the photo. */
.moxkit-team--float{overflow:visible;background:none;border-color:transparent}
.moxkit-team--float .moxkit-team-media{border-radius:16px}
.moxkit-team--float .moxkit-team-body{position:relative;z-index:2;margin:-76px 22px 0;padding:22px;border-radius:14px;background:var(--moxkit-accent);box-shadow:0 20px 40px -20px rgba(16,24,40,.55);transform:translateY(10px);transition:transform .45s var(--moxkit-team-ease)}
.moxkit-team--float:is(:hover,:focus-within) .moxkit-team-body{transform:none}

/* Glass caption: name and role on a blurred shade; the social icons appear on hover. */
.moxkit-team--glass{text-align:left;--moxkit-team-justify:flex-start;border-color:transparent}
.moxkit-team--glass .moxkit-team-body{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:70px 26px 24px;background:linear-gradient(to top,rgba(17,24,39,.62),rgba(17,24,39,0))}
.moxkit-team--glass .moxkit-team-body::before{content:"";position:absolute;z-index:-1;inset:0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);-webkit-mask-image:linear-gradient(to top,#000 40%,transparent);mask-image:linear-gradient(to top,#000 40%,transparent)}
.moxkit-team--glass .moxkit-team-socials{margin-top:14px;opacity:0;transform:translateY(10px);transition:opacity .4s ease,transform .5s var(--moxkit-team-ease)}
.moxkit-team--glass:is(:hover,:focus-within) .moxkit-team-socials{opacity:1;transform:none}

/* Side by side: photo beside the text, stacked where "Photo above the text" is on. */
.moxkit-team--side{display:grid;grid-template-columns:var(--moxkit-team-media-w,40%) minmax(0,1fr);align-items:center;text-align:left;--moxkit-team-justify:flex-start}
.moxkit-team--side .moxkit-team-media{align-self:stretch}
.moxkit-team--side .moxkit-team-photo{height:100%;min-height:100%}

/* Name ribbon: the name scrolls across the photo. */
.moxkit-team-ribbon{position:absolute;z-index:2;left:-12%;right:-12%;top:var(--moxkit-team-ribbon-y,62%);overflow:hidden;padding:var(--moxkit-team-ribbon-pad,10px) 0;background:#fff;transform:translateY(-50%) rotate(var(--moxkit-team-ribbon-angle,0deg));pointer-events:none}
.moxkit-team-ribbon-track{display:flex;width:max-content;animation:moxkit-team-ribbon var(--moxkit-team-ribbon-dur,14s) linear infinite}
.moxkit-team-ribbon-group{display:flex;align-items:center;flex-shrink:0}
.moxkit-team-ribbon .moxkit-person-name{margin:0;padding:0 .55em;font-size:18px;line-height:1.3;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap}
.moxkit-team-ribbon-sep{font-size:18px;line-height:1}
.moxkit-team--ribbon:is(:hover,:focus-within) .moxkit-team-ribbon-track{animation-play-state:paused}
.moxkit-team--ribbon .moxkit-team-body{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;text-align:left;padding:18px 22px}
.moxkit-team--ribbon .moxkit-team-role{margin:0}
.moxkit-team--ribbon .moxkit-description{order:3;flex-basis:100%;max-width:none;margin:0}
@keyframes moxkit-team-ribbon{to{transform:translateX(-50%)}}

/* Touch screens have no hover: show what hover would reveal. */
@media(hover:none){
.moxkit-team--reveal .moxkit-team-body,.moxkit-team--glass .moxkit-team-socials{opacity:1}
.moxkit-team--reveal .moxkit-team-body>*,.moxkit-team--glass .moxkit-team-socials,.moxkit-team--strip .moxkit-team-media .moxkit-team-socials,.moxkit-team--float .moxkit-team-body{transform:none}
}
@media(prefers-reduced-motion:reduce){.moxkit-team,.moxkit-team *{transition:none!important}.moxkit-team--lift:is(:hover,:focus-within),.moxkit-team--zoom:is(:hover,:focus-within) .moxkit-team-photo{transform:none}.moxkit-team-ribbon-track{animation:none}}
