/* Dossiers list + article. Loaded only by dossiers.html and dossier.html, on top of style.css.
   Uses the site's existing custom properties (--wb-*). */

.dossier-list { display: grid; gap: 0; border-top: 1px solid var(--wb-hair); }
.dossier-item {
  display: grid; grid-template-columns: 1fr; gap: 6px;
  padding: 32px 0; border-bottom: 1px solid var(--wb-hair);
  transition: background .2s ease;
}
@media (min-width: 768px) {
  .dossier-item { grid-template-columns: 180px 1fr; gap: 32px; align-items: baseline; }
}
.dossier-item:hover { background: var(--wb-warm-gray); }
.dossier-item .d-meta { display: flex; flex-direction: column; gap: 4px; }
.dossier-item .d-cat { font-family: "Montserrat", sans-serif; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--wb-wine); }
.dossier-item .d-date { font-family: "Montserrat", sans-serif; font-size: 11px; letter-spacing: .08em; color: var(--wb-graphite); }
.dossier-item .d-title {
  font-family: "Playfair Display", serif; font-weight: 600; font-size: clamp(19px, 2.4vw, 24px);
  line-height: 1.3; color: var(--wb-charcoal);
}
.dossier-item:hover .d-title { color: var(--wb-wine); }
.dossier-item .d-excerpt { margin-top: 8px; font-family: "Lora", serif; font-size: 15px; line-height: 1.65; color: var(--wb-graphite); max-width: 62ch; }

.dossier-empty { padding: 60px 0; font-family: "Lora", serif; color: var(--wb-graphite); }

/* ===== article ===== */
.dossier-article { max-width: 720px; margin: 0 auto; }
.dossier-back { display: inline-block; margin-bottom: 28px; font-family: "Montserrat", sans-serif; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--wb-graphite); }
.dossier-back:hover { color: var(--wb-wine); }
.dossier-article .d-cat { font-family: "Montserrat", sans-serif; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--wb-wine); }
.dossier-article h1 { font-family: "Playfair Display", serif; font-weight: 700; font-size: clamp(28px, 4.4vw, 44px); line-height: 1.2; margin: 12px 0 14px; color: var(--wb-charcoal); }
.dossier-article .d-byline { font-family: "Montserrat", sans-serif; font-size: 12px; color: var(--wb-graphite); padding-bottom: 22px; border-bottom: 1px solid var(--wb-hair); margin-bottom: 30px; }
.dossier-article figure { margin: 0 0 30px; border: 1px solid var(--wb-hair); }
.dossier-article figure img { display: block; width: 100%; }
.dossier-article .d-standfirst { font-family: "Lora", serif; font-size: clamp(17px, 1.8vw, 20px); line-height: 1.6; color: var(--wb-charcoal); border-left: 2px solid var(--wb-gold); padding-left: 18px; margin: 0 0 34px; }
.dossier-article h2 { font-family: "Playfair Display", serif; font-weight: 600; font-size: clamp(20px, 2.4vw, 26px); margin: 34px 0 12px; color: var(--wb-charcoal); }
.dossier-article p { font-family: "Lora", serif; font-size: 16px; line-height: 1.8; color: var(--wb-graphite); margin: 0 0 18px; }
.dossier-article .d-table-wrap { overflow-x: auto; border: 1px solid var(--wb-hair); margin: 30px 0; }
.dossier-article table { width: 100%; border-collapse: collapse; font-family: "Montserrat", sans-serif; font-size: 13px; }
.dossier-article th { background: var(--wb-charcoal); color: var(--wb-ivory); text-align: left; padding: 10px 14px; white-space: nowrap; }
.dossier-article td { padding: 10px 14px; border-top: 1px solid var(--wb-hair); color: var(--wb-graphite); vertical-align: top; }
.dossier-faq { margin-top: 42px; padding-top: 28px; border-top: 1px solid var(--wb-hair); }
.dossier-faq h2 { margin-top: 0; }
.dossier-faq dt { font-family: "Lora", serif; font-weight: 600; color: var(--wb-charcoal); margin-bottom: 6px; }
.dossier-faq dd { font-family: "Lora", serif; font-size: 15px; line-height: 1.7; color: var(--wb-graphite); margin: 0 0 20px; }
.dossier-source { margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--wb-hair); font-family: "Montserrat", sans-serif; font-size: 12px; line-height: 1.7; color: var(--wb-graphite); }
.dossier-source a { color: var(--wb-wine); text-decoration: underline; text-underline-offset: 3px; }