/* =====================================================================
   Athlete card (Figma Card set 1678:79356; instances in "More Athletes" 2377:141432 and the In Her Element page 1517:50865).
   Macro: athleteCard(o, size, status, show_tag) in _includes/components/marketing.njk.
   Square photo (object-fit cover), soft top-to-bottom shade + a bottom Name Gradient, tag (number) top right, initials + name bottom left.
   size: small (initials only, colour photo; hero cards) · medium (190) · large (396). The card fills its container (the page sets the width).
   status: idle (medium / large in grayscale, colour on hover) · hover (colour, Shop / Follow / Share actions top left, bio line).
   Fonts are ours (Studio Feixen Sans), not the reference file's Instrument Sans / PP Neue Montreal Mono.
   ===================================================================== */
.athlete-card{
  --athlete-card-scrim:rgba(0,0,0,.5);          /* not a Figma token yet: action button fill */
  --athlete-card-scrim-border:rgba(255,255,255,.3); /* not a Figma token yet: action button border */
  --athlete-card-pad-sm:14px;                   /* not a Figma token yet: small card padding (14.4) */
  --athlete-card-fade:linear-gradient(180deg,rgba(102,102,102,0) 0%,#000 91.05%);   /* not a Figma token yet: card background gradient */
  position:relative;box-sizing:border-box;display:flex;flex-direction:column;justify-content:flex-end;width:100%;height:100%;aspect-ratio:1;
  padding:var(--space-12);overflow:hidden;background:var(--athlete-card-fade);color:var(--text-on-media);text-align:left;isolation:isolate}
.athlete-card__img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:filter .3s var(--ease-out)}
.athlete-card--medium .athlete-card__img,.athlete-card--large .athlete-card__img{filter:grayscale(1)}
.athlete-card:not(.is-hover):hover .athlete-card__img{filter:none}
.athlete-card.is-hover .athlete-card__img{filter:none}
.athlete-card__shade{position:absolute;left:0;right:0;bottom:0;z-index:-1;height:55%;background:linear-gradient(180deg,rgba(0,0,0,0),#000);pointer-events:none}
.athlete-card__tag{position:absolute;top:var(--space-12);right:var(--space-12);font:400 16px/1.4 var(--font-body);letter-spacing:-.04em;font-variant-numeric:tabular-nums;text-transform:uppercase}
.athlete-card__text{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-4);min-width:0}
.athlete-card__initials{font:600 40px/1.2 var(--font-body)}
.athlete-card__name{font:var(--text-base);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.athlete-card__bio{font:400 12px/1.4 var(--font-body)}
.athlete-card__actions{position:absolute;top:var(--space-16);left:var(--athlete-card-pad-sm);display:flex;gap:13px}   /* 13: not a Figma token yet (action gap) */
.athlete-card__action{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:34px;height:34px;padding:0;border:1px solid var(--athlete-card-scrim-border);
  border-radius:var(--radius-full);background:var(--athlete-card-scrim);color:var(--text-on-media);cursor:pointer}
.athlete-card__action svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.athlete-card__action:hover{background:var(--surface-media-overlay)}
.athlete-card__action:focus-visible{outline:0;box-shadow:var(--shadow-focus-ring-accent)}

/* Small (hero cards, "More Athletes" row): initials only, colour photo, 14 padding at 190 */
.athlete-card--small{padding:var(--athlete-card-pad-sm)}
.athlete-card--small .athlete-card__initials{font:400 20px/1.2 var(--font-body)}
.athlete-card--small .athlete-card__shade{height:46%}

/* Cells smaller than the drawn size (tablet / phone): scale the type down with the card */
@container (max-width:150px){.athlete-card__initials{font-size:28px}}
.mk-grid__cell,.mk-float__card{container-type:inline-size}
@container (max-width:120px){
  .athlete-card{padding:var(--space-8)}
  .athlete-card__tag{top:var(--space-6);right:var(--space-8);font-size:11px}
  .athlete-card__initials{font-size:20px}
  .athlete-card__name{font:var(--text-mobile-xs)}
  .athlete-card--small .athlete-card__initials{font-size:14px}
}
@container (max-width:70px){.athlete-card__name{display:none}.athlete-card__tag{display:none}}
@media (prefers-reduced-motion:reduce){.athlete-card__img{transition:none}}
.athlete-card--small .athlete-card__name{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}   /* Small: initials only (the name stays for screen readers) */