/* ============================================================
   TRIBECA LISBOA — SALAS (venues / getting there / contacts)
   Header + tabs mirror the Programme page (pg-*). Black canvas.
   ============================================================ */
.sl-page{ background:#000; color:#fff; font-family:var(--font-text); -webkit-font-smoothing:antialiased; }
.sl-page a{ color:#fff; text-decoration:none; }
.sl-page a:hover{ color:var(--pink); }

/* header (same language as .pg-hero) */
.sl-hero{ padding-top:var(--band-y); padding-bottom:28px; }
.sl-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; }

/* sticky tabs */
.sl-tabsbar{ position:sticky; top:var(--hdr-h); z-index:30; background:#000;
  border-top:1px solid var(--line-dark); border-bottom:1px solid var(--line-dark); padding:14px 0; }
.sl-tabs{ display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; }
.sl-tabs::-webkit-scrollbar{ display:none; }
.sl-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; }
.sl-tab:hover{ border-color:#fff; }
.sl-tab.is-active{ background:#fff; color:#000; border-color:#fff; }

/* sections */
.sl-sec{ padding-top:56px; padding-bottom:56px; border-bottom:1px solid var(--line-dark); scroll-margin-top:150px; }
.sl-sec:last-of-type{ border-bottom:none; padding-bottom:var(--band-y); }
.sl-h2{ margin:0 0 20px; font-family:var(--font-display); font-weight:800; text-transform:uppercase;
  font-size:clamp(36px,6vw,64px); line-height:.9; letter-spacing:-.01em; }
.sl-intro{ margin:0 0 40px; font-size:clamp(16px,1.8vw,19px); line-height:1.55; color:rgba(255,255,255,.82); max-width:64ch; }

/* venue cards */
.sl-venues{ display:flex; flex-direction:column; gap:48px; }
.sl-venue{ display:flex; flex-direction:column; gap:20px; }
.sl-venue-media{ position:relative; width:100%; aspect-ratio:16/10; background:#111; overflow:hidden; }
.sl-venue-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.sl-venue-name{ margin:0; font-family:var(--font-display); font-weight:800; text-transform:uppercase;
  font-size:clamp(28px,3.4vw,40px); line-height:.95; }
.sl-venue-desc{ margin:12px 0 0; font-size:16px; line-height:1.6; color:rgba(255,255,255,.82); max-width:60ch; }
.sl-venue-info{ display:flex; flex-direction:column; gap:8px; margin-top:20px; padding-top:18px; border-top:1px solid var(--line-dark); }
.sl-info-row{ display:flex; align-items:flex-start; gap:10px; font-size:15px; line-height:1.45; }
.sl-info-row svg{ flex:none; margin-top:2px; color:var(--pink); }
.sl-site{ display:inline-flex; align-items:center; gap:8px; margin-top:14px; font-weight:700; font-size:14px;
  text-transform:uppercase; letter-spacing:.02em; border-bottom:2px solid var(--pink); padding-bottom:4px; width:fit-content; }
@media (min-width:900px){
  .sl-venue{ display:grid; grid-template-columns:1.1fr 1fr; gap:48px; align-items:center; }
  .sl-venue:nth-child(even) .sl-venue-media{ order:2; }
  .sl-venue-media{ aspect-ratio:4/3; }
}

/* how to get there */
.sl-transport-lead{ margin:0 0 32px; font-size:17px; line-height:1.6; color:rgba(255,255,255,.82); max-width:64ch; }
.sl-ways{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--line-dark); border:1px solid var(--line-dark); }
@media (min-width:760px){ .sl-ways{ grid-template-columns:repeat(3,1fr); } }
.sl-way{ background:#000; padding:24px; }
.sl-way-h{ margin:0 0 16px; font-family:var(--font-text); font-weight:700; font-size:12px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--pink); }
.sl-way ul{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:10px; }
.sl-way li{ font-size:16px; line-height:1.45; }

/* contacts */
.sl-contacts{ display:grid; grid-template-columns:1fr; gap:32px; }
@media (min-width:760px){ .sl-contacts{ grid-template-columns:1fr 1fr; gap:48px; } }
.sl-contact-k{ font-weight:700; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--pink); margin-bottom:10px; }
.sl-contact-v{ font-size:clamp(18px,2vw,22px); line-height:1.45; }
