/* CAPYME hero component. All selectors stay inside this namespace. */
.capyme-team-animation {
  --capyme-team-ink: #184b50;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: #fff;
  container: capyme-team / inline-size;
}
.capyme-team-animation *,
.capyme-team-animation *::before,
.capyme-team-animation *::after { box-sizing: border-box; }
.capyme-team-animation .capyme-team-animation__stage {
  position: relative;
  width: 100%;
  aspect-ratio: 1.85;
  overflow: hidden;
  isolation: isolate;
  background: #fff;
}
.capyme-team-animation .capyme-team-animation__person {
  position: absolute;
  left: var(--position-x);
  top: 37%;
  width: calc(41% * var(--person-scale));
  margin: 0;
  padding: 0;
  transform: translate(-50%, calc(-1 * var(--eye-y)));
  mix-blend-mode: multiply;
  z-index: var(--depth, 1);
  pointer-events: none;
}
.capyme-team-animation .capyme-team-animation__motion {
  display: block;
  width: 100%;
  transform-origin: 50% var(--eye-y);
}
.capyme-team-animation .capyme-team-animation__portrait {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  object-fit: contain;
}
.capyme-team-animation .capyme-team-animation__person--sergio {
  --position-x: 8%; --person-scale: 1.05; --eye-y: 31.3%;
  --enter-x: -22%; --enter-y: 5%; --depth: 1;
}
.capyme-team-animation .capyme-team-animation__person--paz {
  --position-x: 25%; --person-scale: 1.05; --eye-y: 33.7%;
  --enter-x: -13%; --enter-y: -6%; --depth: 3;
}
.capyme-team-animation .capyme-team-animation__person--pablo {
  --position-x: 42%; --person-scale: 1; --eye-y: 34.7%;
  --enter-x: -5%; --enter-y: 8%; --depth: 5;
}
.capyme-team-animation .capyme-team-animation__person--romina {
  --position-x: 59%; --person-scale: .95; --eye-y: 37.3%;
  --enter-x: 6%; --enter-y: -5%; --depth: 6;
}
.capyme-team-animation .capyme-team-animation__person--joselyn {
  --position-x: 76%; --person-scale: .74; --eye-y: 40.5%;
  --enter-x: 14%; --enter-y: 9%; --depth: 4;
}
.capyme-team-animation .capyme-team-animation__person--claudia {
  --position-x: 93%; --person-scale: .86; --eye-y: 36.5%;
  --enter-x: 22%; --enter-y: -3%; --depth: 2;
}
.capyme-team-animation .capyme-team-animation__controls {
  display: flex;
  min-height: 44px;
  justify-content: flex-end;
  align-items: center;
  gap: 4px;
  padding: 0 4px;
  background: #fff;
}
.capyme-team-animation .capyme-team-animation__button {
  display: inline-flex;
  width: 44px;
  min-width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 10px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--capyme-team-ink);
  box-shadow: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.capyme-team-animation .capyme-team-animation__button:hover { background: #f2f7f7; }
.capyme-team-animation .capyme-team-animation__button:focus-visible {
  outline: 2px solid var(--capyme-team-ink);
  outline-offset: 2px;
}
.capyme-team-animation .capyme-team-animation__button svg {
  width: 19px; height: 19px; fill: none; stroke: currentColor;
  stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round;
}
.capyme-team-animation .capyme-team-animation__button[data-paused="false"] .capyme-team-animation__icon-play,
.capyme-team-animation .capyme-team-animation__button[data-paused="true"] .capyme-team-animation__icon-pause { display: none; }
.capyme-team-animation [hidden] { display: none !important; }

/* Tablet: retain the six-person editorial line with a little more vertical room. */
@media (min-width: 681px) and (max-width: 1024px) {
  .capyme-team-animation .capyme-team-animation__stage { aspect-ratio: 1.65; }
  .capyme-team-animation .capyme-team-animation__person { top: 39%; }
}

/* Mobile is two rows in the same reading order, with no face/body collisions. */
@media (max-width: 680px) {
  .capyme-team-animation .capyme-team-animation__stage { aspect-ratio: .95; }
  .capyme-team-animation .capyme-team-animation__person { top: 20%; width: calc(52% * var(--person-scale)); }
  .capyme-team-animation .capyme-team-animation__person:nth-child(n+4) { top: 65%; }
  .capyme-team-animation .capyme-team-animation__person:nth-child(3n+1) { left: 15%; --enter-x: -10%; }
  .capyme-team-animation .capyme-team-animation__person:nth-child(3n+2) { left: 50%; --enter-x: 0%; }
  .capyme-team-animation .capyme-team-animation__person:nth-child(3n) { left: 85%; --enter-x: 10%; }
}
@container capyme-team (max-width: 420px) {
  .capyme-team-animation .capyme-team-animation__stage { aspect-ratio: .95; }
  .capyme-team-animation .capyme-team-animation__person { top: 20%; width: calc(52% * var(--person-scale)); }
  .capyme-team-animation .capyme-team-animation__person:nth-child(n+4) { top: 65%; }
  .capyme-team-animation .capyme-team-animation__person:nth-child(3n+1) { left: 15%; --enter-x: -10%; }
  .capyme-team-animation .capyme-team-animation__person:nth-child(3n+2) { left: 50%; --enter-x: 0%; }
  .capyme-team-animation .capyme-team-animation__person:nth-child(3n) { left: 85%; --enter-x: 10%; }
}
@media (prefers-reduced-motion: reduce) {
  .capyme-team-animation .capyme-team-animation__motion { transform: none !important; opacity: 1 !important; }
  .capyme-team-animation .capyme-team-animation__controls { display: none !important; }
}

/* Integration into the existing hero, with content below the portraits. */
.hero.team-hero{height:auto;min-height:0;max-height:none;background:#fff;color:#172e4a;padding-top:8px;overflow:hidden}
.team-hero .capyme-team-animation{max-width:1160px;margin:auto}
.team-hero .capyme-team-animation__stage{aspect-ratio:3.4}
.team-hero .capyme-team-animation__person{top:37%;width:calc(31% * var(--person-scale))}
.team-hero .hero-content{position:relative;left:auto;right:auto;bottom:auto;width:87.5%;max-width:1160px;margin:auto;padding:0 0 26px}
.team-hero .hero-content:before{display:none}
.team-hero .eyebrow{font-size:18px;color:#046bd2}
.team-hero h1{font-size:clamp(38px,4.4vw,60px)}
.team-hero .hero-bottom{margin-top:14px}
.team-hero .hero-reassurance{font-size:14px;margin-top:12px;display:flex;justify-content:space-between;gap:12px}
.team-hero .price-pill{background:#f1f5f9}
@media (min-width:681px) and (max-width:1024px){.team-hero .capyme-team-animation__stage{aspect-ratio:2.8}.team-hero .capyme-team-animation__person{top:40%;width:calc(33% * var(--person-scale))}}
@media(max-width:680px){.team-hero .capyme-team-animation{width:94%}.team-hero .capyme-team-animation__stage{aspect-ratio:1.13}.team-hero .capyme-team-animation__person{top:21%;width:calc(52% * var(--person-scale))}.team-hero .capyme-team-animation__person:nth-child(n+4){top:67%}.team-hero .hero-content{width:88%;padding-bottom:24px;text-align:left}.team-hero .hero-bottom{align-items:flex-start;gap:18px}.team-hero .hero-reassurance{flex-wrap:wrap}.team-hero h1{font-size:40px}.team-hero .price-pill{gap:12px;padding-left:14px}.team-hero .price-pill .button{font-size:13px}}