/* ============================================================
   TRIBECA LISBOA — NEWS LISTING (responsive)
   Reuses --gut/--maxw/.r-wrap/.r-band + .ed-tag (design system).
   Featured hero + responsive grid (1 → 2 → 3 cols).
   ============================================================ */
.nl-page{ background:#fff; color:#000; font-family:var(--font-text); -webkit-font-smoothing:antialiased; }
.nl-page img{ display:block; }

.nl-eyebrow{ font-family:var(--font-text); font-weight:700; font-size:12px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--fg-2); margin-bottom:14px; }
.nl-h1{ margin:0; color:#000; font-family:var(--font-display); font-weight:800; text-transform:uppercase;
  font-size:clamp(56px,9vw,120px); line-height:.88; letter-spacing:-.01em; }
.nl-intro{ margin:20px 0 0; color:var(--ink); font-family:var(--font-text); font-size:18px; line-height:1.5; max-width:54ch; }
@media (min-width:1024px){ .nl-intro{ font-size:20px; } }
.nl-date{ font-family:var(--font-text); font-weight:700; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--fg-2); }

/* ---- featured hero — the title links, stretched over the card by ::after;
   the .nl-feature-cta control lifts above the overlay ---- */
.nl-featured-band{ padding-top:40px; padding-bottom:var(--band-y); }
.nl-feature{ display:flex; flex-direction:column; gap:20px; cursor:pointer; position:relative; }
.nl-feature-media{ width:100%; aspect-ratio:16/10; overflow:hidden; background:#ddd; }
.nl-feature-media img{ width:100%; height:100%; object-fit:cover; transition:transform 1s cubic-bezier(.16,1,.3,1); }
.nl-feature:hover .nl-feature-media img{ transform:scale(1.03); }
.nl-feature-meta{ display:flex; align-items:center; gap:14px; }
.nl-feature-title{ margin:14px 0 0; color:#0E0E0E; font-family:var(--font-display); font-weight:800; text-transform:uppercase;
  font-size:clamp(30px,4.4vw,56px); line-height:.96; letter-spacing:-.01em; text-wrap:balance; }
.nl-feature-title a{ color:inherit; text-decoration:none; }
.nl-feature-title a::after{ content:''; position:absolute; inset:0; }
.nl-feature-cta{ position:relative; z-index:1; }
.nl-feature-title a:focus-visible{ outline:2px solid var(--fg-2); outline-offset:2px; }
.nl-page .tb-link:focus-visible{ outline-color:var(--fg-2); }  /* white page: keep the ring >= 3:1 */
.nl-feature-ex{ margin:14px 0 0; color:var(--ink); font-family:var(--font-text); font-size:18px; line-height:1.5; max-width:64ch; }
.nl-feature-title, .nl-feature-ex{ transition:opacity .15s; }
@media (min-width:900px){
  .nl-feature{ display:grid; grid-template-columns:1.15fr .85fr; gap:48px; align-items:center; }
  .nl-feature-media{ aspect-ratio:4/3; }
  .nl-feature-title{ margin-top:0; }
}
@media (min-width:1280px){ .nl-feature{ gap:72px; } }

/* ---- divider ---- */
.nl-rule{ height:1px; background:var(--line-mid); }

/* ---- responsive grid ---- */
.nl-grid{ display:grid; grid-template-columns:1fr; gap:40px 32px; padding-top:48px; }
@media (min-width:680px){ .nl-grid{ grid-template-columns:1fr 1fr; } }
@media (min-width:1024px){ .nl-grid{ grid-template-columns:1fr 1fr 1fr; gap:48px 40px; } }

/* the card element is the <a> (whole-card link, one Tab stop) */
.nl-card{ display:flex; flex-direction:column; gap:14px; cursor:pointer; color:inherit; text-decoration:none; }
.nl-card:focus-visible{ outline:2px solid var(--fg-2); outline-offset:2px; }
.nl-card-media{ width:100%; aspect-ratio:3/2; overflow:hidden; background:#ddd; }
.nl-card-media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.16,1,.3,1); }
.nl-card:hover .nl-card-media img{ transform:scale(1.05); }
.nl-card-meta{ display:flex; align-items:center; gap:12px; }
.nl-card-title{ margin:6px 0 0; color:#0E0E0E; font-family:var(--font-text); font-weight:700; font-size:22px; line-height:1.12; text-wrap:pretty; }
.nl-card:hover .nl-card-title{ color:var(--film-bg); }
.nl-card-ex{ margin:0; color:var(--fg-2); font-family:var(--font-text); font-size:16px; line-height:1.45; }
@media (min-width:1024px){ .nl-card-title{ font-size:24px; } }

/* category pill — same as the news article (.na-tag) */
.nl-tag{ display:inline-block; border-radius:var(--radius-pill); padding:5px 12px; font-family:var(--font-text); font-weight:700; font-size:13px; line-height:1.2; }
