/* Travel News list — newspaper front page. Tokens from landing.css. */
.tn {
  --tn-serif: 'Noto Serif', Georgia, 'Times New Roman', serif;
  max-width: 1100px;
  margin: 68px auto 0; /* fixed Nav height */
  padding: clamp(2rem, 5vw, 3.5rem) clamp(1rem, 5vw, 2rem) clamp(3rem, 7vw, 5rem);
  color: var(--ink);
}
.tn a { color: inherit; text-decoration: none; }
.tn img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* Masthead */
.tn-masthead { text-align: center; padding-bottom: 1rem; border-bottom: 3px double var(--ink); margin-bottom: 2rem; }
.tn-masthead-title { font-family: var(--tn-serif); font-weight: 700; font-size: clamp(2rem, 6vw, 3.25rem); line-height: 1.1; margin: 0; }
.tn-masthead-date { margin: 0.5rem 0 0; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: capitalize; color: var(--muted); }

/* Shared story bits */
.tn-thumb { display: block; overflow: hidden; background: var(--cream); }
.tn-text { display: block; }
.tn-date { display: block; font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.4rem; }
.tn-headline { font-family: var(--tn-serif); font-weight: 700; line-height: 1.25; margin: 0 0 0.5rem; }
.tn-standfirst { margin: 0; color: var(--muted); line-height: 1.6; font-size: 0.95rem; }
.tn-lead:hover .tn-headline, .tn-card:hover .tn-headline, .tn-row:hover .tn-headline { color: var(--ochre); }
.tn a:focus-visible { outline: 2px solid var(--ochre); outline-offset: 3px; }

/* Lead story */
.tn-lead { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 1.75rem; align-items: center; padding-bottom: 2rem; }
.tn-lead .tn-thumb { aspect-ratio: 16 / 10; }
.tn-lead .tn-headline { font-size: clamp(1.6rem, 3.4vw, 2.4rem); }
.tn-lead .tn-standfirst { font-size: 1.05rem; }

/* Secondary stories */
.tn-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; padding: 2rem 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.tn-card { display: block; }
.tn-card .tn-thumb { aspect-ratio: 3 / 2; margin-bottom: 0.75rem; }
.tn-card .tn-headline { font-size: 1.2rem; }

/* More stories */
.tn-more { margin-top: 2.5rem; }
.tn-more-title { font-family: var(--tn-serif); font-size: 1.4rem; margin: 0 0 0.5rem; padding-bottom: 0.5rem; border-bottom: 2px solid var(--ink); }
.tn-row { display: grid; grid-template-columns: minmax(0, 1fr) 128px; gap: 1.25rem; align-items: start; padding: 1.25rem 0; border-bottom: 1px solid var(--border); min-height: 44px; }
.tn-row .tn-thumb { order: 2; width: 128px; height: 88px; }
.tn-row .tn-headline { font-size: 1.1rem; margin-bottom: 0.3rem; }
.tn-row .tn-standfirst { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

.tn-empty { text-align: center; padding: 5rem 1rem; color: var(--muted); }
.tn-empty p { font-family: var(--tn-serif); font-size: 1.4rem; color: var(--ink); margin: 0 0 0.5rem; }

@media (max-width: 900px){
  .tn-lead { grid-template-columns: minmax(0, 1fr); }
  .tn-cards { grid-template-columns: minmax(0, 1fr); }
  .tn-card { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 1rem; align-items: start; }
  .tn-card .tn-thumb { margin: 0; aspect-ratio: 4 / 3; }
}

/* Stories without a cover image: no reserved image column */
.tn-lead.tn-nothumb { grid-template-columns: minmax(0, 1fr); }
.tn-row.tn-nothumb { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 900px){
  .tn-card.tn-nothumb { display: block; }
}
