/* ============================================================
   TRIBECA LISBOA — TALENTOS (listing + detail)
   Same language as Programme / News: black canvas, Druk heads,
   square cards, hairlines, pink accents.
   ============================================================ */
.tl-page{ background:#000; color:#fff; font-family:var(--font-text); -webkit-font-smoothing:antialiased; }
.tl-page a{ color:#fff; text-decoration:none; }
.tl-page img{ display:block; }
.tl-hero{ padding-top:var(--band-y); padding-bottom:28px; border-bottom:1px solid var(--line-dark); }
.tl-eyebrow{ font-weight:700; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--pink); margin-bottom:14px; }
.tl-h1{ margin:0; font-family:var(--font-display); font-weight:800; text-transform:uppercase;
  font-size:clamp(48px,9vw,112px); line-height:.86; letter-spacing:-.01em; }
.tl-desc{ margin:18px 0 0; font-size:clamp(16px,1.8vw,19px); line-height:1.5; color:rgba(255,255,255,.82); max-width:52ch; }
.tl-tabs{ display:flex; gap:8px; overflow-x:auto; margin-top:28px; scrollbar-width:none; }
.tl-tabs::-webkit-scrollbar{ display:none; }
.tl-tab{ flex:none; background:transparent; border:1px solid var(--line-dark2); color:#fff; cursor:pointer;
  font-family:var(--font-text); font-weight:700; font-size:13px; letter-spacing:.02em; text-transform:uppercase;
  padding:11px 18px; transition:background .15s, color .15s, border-color .15s; }
.tl-tab:hover{ border-color:#fff; }
.tl-tab.is-active{ background:#fff; color:#000; border-color:#fff; }

/* grid */
.tl-list{ padding-top:40px; padding-bottom:var(--band-y); }
.tl-grid{ display:grid; grid-template-columns:1fr 1fr; gap:32px 16px; }
@media (min-width:760px){ .tl-grid{ grid-template-columns:repeat(3,1fr); gap:40px 24px; } }
@media (min-width:1200px){ .tl-grid{ grid-template-columns:repeat(4,1fr); } }
/* the card element is the <a> (whole-card link, one Tab stop) */
.tl-card{ display:flex; flex-direction:column; gap:12px; cursor:pointer; color:inherit; text-decoration:none; }
.tl-card:focus-visible{ outline:2px solid var(--pink); outline-offset:2px; }
.tl-card-media{ position:relative; width:100%; aspect-ratio:1/1; overflow:hidden; background:#111; }
.tl-card-media img{ width:100%; height:100%; object-fit:cover; transition:transform .5s cubic-bezier(.16,1,.3,1); }
.tl-card:hover .tl-card-media img{ transform:scale(1.04); }
.tl-card-cat{ font-weight:700; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--pink); }
.tl-card-name{ margin:0; font-weight:700; font-size:clamp(17px,1.8vw,21px); line-height:1.15; }
.tl-card:hover .tl-card-name{ color:var(--pink); }
.tl-card-meta{ font-size:14px; line-height:1.4; color:var(--fg-3); }
.tl-pending{ font-size:12px; line-height:1.4; color:var(--yellow); }

/* detail */
.tl-d-hero{ padding-top:var(--band-y); padding-bottom:48px; border-bottom:1px solid var(--line-dark); }
.tl-d-grid{ display:flex; flex-direction:column; gap:28px; }
@media (min-width:900px){ .tl-d-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; align-items:start; }
  .tl-d-media{ position:sticky; top:calc(var(--hdr-h) + 24px); } }
.tl-d-media{ width:100%; aspect-ratio:4/5; overflow:hidden; background:#111; }
.tl-d-media img{ width:100%; height:100%; object-fit:cover; }
.tl-d-name{ margin:0; font-family:var(--font-display); font-weight:800; text-transform:uppercase;
  font-size:clamp(44px,7vw,96px); line-height:.88; letter-spacing:-.01em; }
.tl-d-roles{ margin-top:16px; display:flex; flex-direction:column; gap:6px; font-size:16px; color:rgba(255,255,255,.82); }
.tl-d-dek{ margin:20px 0 0; font-size:clamp(17px,1.9vw,21px); line-height:1.5; font-weight:700; max-width:52ch; }
.tl-d-sec{ padding-top:48px; padding-bottom:48px; border-bottom:1px solid var(--line-dark); }
.tl-d-h2{ margin:0 0 20px; font-family:var(--font-display); font-weight:800; text-transform:uppercase; font-size:clamp(28px,4vw,44px); line-height:.95; }
.tl-d-body{ max-width:68ch; }
.tl-d-body p{ margin:0 0 16px; font-size:17px; line-height:1.7; color:rgba(255,255,255,.85); }
.tl-d-body h3{ margin:28px 0 8px; font-weight:700; font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--pink); }
.tl-d-links{ display:flex; flex-wrap:wrap; gap:20px; margin-top:24px; }
.tl-d-link{ display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:14px; text-transform:uppercase;
  letter-spacing:.02em; border-bottom:2px solid var(--pink); padding-bottom:4px; }
.tl-d-link:hover{ color:var(--pink); }
.tl-d-note{ font-size:15px; line-height:1.5; color:var(--yellow); }
.tl-d-events{ display:flex; flex-direction:column; gap:12px; }
/* the row element is the <a> (whole-row link) */
.tl-d-ev{ display:flex; gap:16px; align-items:center; border:1px solid var(--line-dark2); padding:12px; cursor:pointer; transition:border-color .15s; color:inherit; text-decoration:none; }
.tl-d-ev:hover{ border-color:#fff; }
.tl-d-ev:focus-visible{ outline:2px solid var(--pink); outline-offset:2px; }
.tl-d-ev-img{ width:96px; height:96px; flex:none; overflow:hidden; background:#111; }
.tl-d-ev-img img{ width:100%; height:100%; object-fit:cover; }
.tl-d-ev-t{ font-weight:700; font-size:18px; line-height:1.2; }
.tl-d-ev-m{ margin-top:6px; font-size:14px; color:var(--fg-3); }
.tl-d-ev-r{ margin-top:6px; font-size:13px; color:var(--pink); font-weight:700; }