/* Shared stylesheet for the Q&A pages. Edit here, not per page. */
:root{
  --bg:#10131A; --bg-elevated:#171B24; --line:#262B36;
  --grey-mid:#7C8494; --grey-light:#C7CDD6; --white:#F3F5F7;
  --ember:#E2A54D; --ember-dim:#8A6B3A; --frost:#6FC6E8; --c-tripqa:#A08FD6;
  --display:'Big Shoulders Display',sans-serif; --body:'IBM Plex Sans',sans-serif;
}
.article{ padding:20px; }
.article-meta{ display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--grey-mid); margin-bottom:10px; }
.article-meta .dot{ width:6px; height:6px; border-radius:50%; background:var(--c-tripqa); }
.article-title{ font-family:var(--display); font-weight:800; font-size:30px; line-height:1.1; color:var(--white); margin:0 0 18px; }
.byline{ display:flex; align-items:center; gap:10px; margin:0 0 22px; }
.byline img{ width:36px; height:36px; border-radius:50%; object-fit:cover; flex:none; }
.byline-name{ font-size:13.5px; font-weight:600; color:var(--white); }
.prose{ font-size:16px; line-height:1.65; }
.prose p{ margin:0 0 18px; }
.prose a{ color:var(--frost); text-decoration:underline; }
.related{ margin-top:34px; padding-top:20px; border-top:1px solid var(--line); }
.related h2{ font-family:var(--display); font-weight:700; font-size:15px; text-transform:uppercase; letter-spacing:0.04em; color:var(--grey-mid); margin:0 0 12px; }
.related-links{ display:flex; flex-direction:column; gap:9px; }
.related-links a{ font-size:14.5px; color:var(--white); text-decoration:none; border-bottom:1px solid var(--line); padding-bottom:9px; display:block; }
.related-links a:hover{ color:var(--frost); }
.related-links a:last-child{ border-bottom:none; padding-bottom:0; }
.footer{ border-top:1px solid var(--line); padding:24px 20px 32px; display:flex; justify-content:space-between; align-items:center; font-size:12.5px; color:var(--grey-mid); }

/* Trip Q&A pages: more-questions card in the sidebar, and article spacing inside the two-column frame */
.main-col > .article{ padding: 0; }
.more-questions .label{ color: var(--c-tripqa); }
.more-list{ list-style: none; margin: 10px 0 0; padding: 0; }
.more-list li{ margin: 0; padding: 9px 0; border-top: 1px solid var(--line); font-size: 13px; line-height: 1.4; }
.more-list li:first-child{ border-top: 0; padding-top: 0; }
.more-list a{ color: var(--grey-light); text-decoration: none; }
.more-list a:hover{ color: var(--frost); }