/* Talent card, cinematic style (eventme-africa.js _talentCardHtml).
   The photo fills the card; name, role and actions sit on a dark fade at the bottom.
   Scoped to .talent-card.tc2 so the older card rules do not apply. */
.talent-card.tc2 {
  position: relative !important; display: block !important; isolation: isolate;
  aspect-ratio: 4 / 5.3; min-height: 0 !important; height: auto !important; padding: 0 !important;
  border-radius: 20px !important; overflow: hidden !important; cursor: pointer;
  background: #0c0809 !important; border: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 18px 40px rgba(0,0,0,.45) !important;
  transition: transform .25s cubic-bezier(.2,.7,.2,1), box-shadow .25s !important;
  container-type: inline-size;
}
.talent-card.tc2::after { content: ""; position: absolute; inset: 0; border-radius: inherit; border: 1px solid rgba(255,255,255,.09); pointer-events: none; z-index: 4; transition: border-color .25s; }
.talent-card.tc2:focus-visible { outline: 2px solid #ff3a5c; outline-offset: 3px; }

/* photo */
.talent-card.tc2 .tc2-media { position: absolute !important; inset: 0; width: 100% !important; height: 100% !important; aspect-ratio: auto !important; z-index: 0; background: #120b0d; overflow: hidden; }
.talent-card.tc2 .tc2-media > img { width: 100% !important; height: 100% !important; object-fit: cover; object-position: 50% 22%; display: block; transition: transform .6s cubic-bezier(.2,.7,.2,1) !important; }
.talent-card.tc2 .tc2-fade { position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(8,4,5,.38) 0%, rgba(8,4,5,0) 22%, rgba(8,4,5,0) 44%, rgba(8,4,5,.74) 70%, rgba(8,4,5,.97) 100%); }

/* top row: category, video, rising, save */
.talent-card.tc2 .tc2-top { position: absolute; top: 12px; left: 12px; right: 12px; z-index: 3; display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; min-width: 0; }
.talent-card.tc2 .tc2-cat { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 6px 10px; border-radius: 999px; font: 700 10px/1 var(--font-body, Inter, sans-serif); letter-spacing: .09em; text-transform: uppercase; color: #fff;
  background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.22); backdrop-filter: blur(12px) saturate(140%); -webkit-backdrop-filter: blur(12px) saturate(140%); cursor: pointer; transition: background .15s; }
.talent-card.tc2 .tc2-cat:hover { background: rgba(255,255,255,.24); }
.talent-card.tc2 .tc2-vid, .talent-card.tc2 .tc2-rise { flex-shrink: 0; display: inline-flex; align-items: center; gap: 4px; padding: 6px 9px; border-radius: 999px; font: 700 10px/1 var(--font-body, Inter, sans-serif); color: #fff; white-space: nowrap; }
.talent-card.tc2 .tc2-vid { background: rgba(200,16,46,.78); border: 1px solid rgba(255,120,140,.5); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.talent-card.tc2 .tc2-rise { background: rgba(244,176,0,.22); border: 1px solid rgba(244,176,0,.5); color: #ffd666; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.talent-card.tc2 .tc2-save { flex-shrink: 0; margin-left: auto; width: 34px; height: 34px; padding: 0; border-radius: 50%; display: grid; place-items: center; cursor: pointer; color: #fff;
  background: rgba(0,0,0,.3); border: 1px solid rgba(255,255,255,.22); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); transition: background .15s, color .15s, transform .15s; }
.talent-card.tc2 .tc2-save:hover { background: rgba(200,16,46,.85); border-color: rgba(255,140,160,.6); }
.talent-card.tc2 .tc2-save:active { transform: scale(.92); }
.talent-card.tc2 .tc2-save .phx { font-size: 16px !important; }

/* bottom: name, role, chips, meta */
.talent-card.tc2 .tc2-info { position: absolute; left: 16px; right: 16px; bottom: 15px; z-index: 3; color: #fff; }
.talent-card.tc2 .tc2-name { display: flex; align-items: center; gap: 6px; min-width: 0; font: 800 19px/1.2 var(--font-display, var(--font-body, Inter, sans-serif)); letter-spacing: -.01em; color: #fff; text-shadow: 0 1px 12px rgba(0,0,0,.35); }
.talent-card.tc2 .tc2-name > span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.talent-card.tc2 .tc2-name .em-vseal { flex-shrink: 0; display: inline-flex; }
.talent-card.tc2 .tc2-name .em-vseal svg { width: 17px; height: 17px; }
.talent-card.tc2 .tc2-name .verified-badge { flex-shrink: 0; color: #4cc3ff; background: none; border: 0; padding: 0; }
.talent-card.tc2 .tc2-role { margin-top: 5px; font-size: 12.8px; line-height: 1.45; color: rgba(255,255,255,.84); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.talent-card.tc2 .tc2-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
.talent-card.tc2 .tc2-chip { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border-radius: 999px; font: 700 10.5px/1 var(--font-body, Inter, sans-serif); color: #86efac; background: rgba(34,197,94,.15); border: 1px solid rgba(34,197,94,.42); }
.talent-card.tc2 .tc2-chip i { width: 6px; height: 6px; border-radius: 50%; background: #22c55e; }
.talent-card.tc2 .tc2-meta { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding-top: 11px; border-top: 1px solid rgba(255,255,255,.13); font-size: 11.8px; color: rgba(255,255,255,.68); }
.talent-card.tc2 .tc2-place { flex: 1; min-width: 0; display: inline-flex; align-items: center; gap: 5px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.talent-card.tc2 .tc2-place svg, .talent-card.tc2 .tc2-place .phx { flex-shrink: 0; }
.talent-card.tc2 .tc2-like { flex-shrink: 0; display: inline-flex; align-items: center; gap: 5px; padding: 5px 8px; margin: -5px 0; border-radius: 999px; background: none; border: 0; cursor: pointer; color: rgba(255,255,255,.75); font: 700 11.8px/1 var(--font-body, Inter, sans-serif); transition: background .15s, color .15s; }
.talent-card.tc2 .tc2-like:hover { background: rgba(255,255,255,.1); color: #fff; }
.talent-card.tc2 .tc2-like.liked { color: #ff6b83; }
.talent-card.tc2 .tc2-go { flex-shrink: 0; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; color: #fff;
  background: linear-gradient(135deg, rgba(255,58,92,.95), rgba(200,16,46,.9)); border: 1px solid rgba(255,140,160,.55);
  box-shadow: 0 6px 16px rgba(200,16,46,.45), inset 0 1px 0 rgba(255,255,255,.35); transition: transform .25s; }

/* hover on devices with a mouse */
@media (hover: hover) {
  .talent-card.tc2:hover { transform: translateY(-4px) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 26px 54px rgba(0,0,0,.55), 0 0 0 1px rgba(255,58,92,.4) !important; }
  .talent-card.tc2:hover .tc2-media > img { transform: scale(1.05) !important; }
  .talent-card.tc2:hover .tc2-go { transform: translateX(3px); }
}

/* narrow cards (two per row on phones): a taller card and a shorter text block */
@media (max-width: 560px) { .talent-card.tc2 { aspect-ratio: 3 / 4.75; } }
@container (max-width: 210px) {
  .talent-card.tc2 .tc2-top { top: 9px; left: 9px; right: 9px; gap: 4px; }
  .talent-card.tc2 .tc2-cat { font-size: 8.5px; padding: 5px 8px; }
  .talent-card.tc2 .tc2-vid, .talent-card.tc2 .tc2-rise { padding: 5px 7px; font-size: 9px; }
  /* the video badge shrinks to its play icon so the category keeps its full name */
  .talent-card.tc2 .tc2-vid { font-size: 0; gap: 0; width: 24px; height: 24px; padding: 0; justify-content: center; }
  .talent-card.tc2 .tc2-vid svg { width: 10px; height: 10px; }
  .talent-card.tc2 .tc2-save { width: 30px; height: 30px; }
  .talent-card.tc2 .tc2-info { left: 11px; right: 11px; bottom: 11px; }
  .talent-card.tc2 .tc2-name { font-size: 15px; }
  .talent-card.tc2 .tc2-name .em-vseal svg { width: 14px; height: 14px; }
  .talent-card.tc2 .tc2-role { font-size: 11.5px; -webkit-line-clamp: 1; margin-top: 3px; }
  .talent-card.tc2 .tc2-chips { flex-wrap: nowrap; overflow: hidden; margin-top: 7px; }
  .talent-card.tc2 .tc2-chip { font-size: 9.5px; padding: 3px 7px; white-space: nowrap; }
  .talent-card.tc2 .tc2-chip + .tc2-chip { display: none; }
  .talent-card.tc2 .tc2-ctry { display: none; }
  .talent-card.tc2 .tc2-meta { margin-top: 9px; padding-top: 8px; gap: 6px; font-size: 10.5px; }
  .talent-card.tc2 .tc2-place svg { display: none; }
  .talent-card.tc2 .tc2-go { width: 26px; height: 26px; }
  .talent-card.tc2 .tc2-go svg { width: 13px; height: 13px; }
}
@container (max-width: 160px) {
  .talent-card.tc2 .tc2-vid, .talent-card.tc2 .tc2-rise { display: none; }
  .talent-card.tc2 .tc2-place { display: none; }
  .talent-card.tc2 .tc2-like { margin-right: auto; }
}
