/* Editorial post layout, scoped independently from archive cards. */
.single-story { background: #282b37; color: #efeeeb; }
.story-hero { position: relative; isolation: isolate; min-height: 440px; display: grid; place-items: center; padding: 100px 24px 50px; background: #343b4b; text-align: center; }
.story-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgb(37 39 51 / 64%), rgb(26 29 39 / 75%)); }
.story-hero-image { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.story-hero-content { width: 100%; max-width: 800px; }
.story-breadcrumb { margin-bottom: 26px; font-size: 13px; }
.story-breadcrumb a { color: #dddde3; }
.story-breadcrumb a:last-child:not(:first-child) { color: #f3ad14; }
.story-hero h1 { margin: 0 auto; max-width: 680px; font-size: clamp(2.25rem, 4.5vw, 3.5rem); font-weight: 700; line-height: 1.08; text-wrap: balance; color: #f7f5ef; }
.story-hero-rule { width: 94px; height: 2px; margin: 22px auto 16px; background: #eda90d; }
.story-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 22px; font-size: 13px; }
.story-location::before { content: '⌖'; margin-right: 6px; }
.story-layout { display: grid; grid-template-columns: minmax(210px, 302px) minmax(0, 1fr); gap: 44px; max-width: 1300px; margin: auto; padding: 50px 40px 80px; }
.story-sidebar { min-width: 0; }
.story-sidebar-inner { position: sticky; top: 32px; max-height: calc(100vh - 64px); overflow-y: auto; }
.single-story .story-label { margin: 0 0 18px; color: #ffb511; font: 600 11px/1.4 'Source Sans Pro', sans-serif; text-transform: uppercase; letter-spacing: 1.8px; }
.story-contents { border-top: 2px solid #e8a30c; padding-top: 17px; margin-bottom: 28px; }
.story-contents ol { list-style: none; counter-reset: contents; padding: 0; margin: 0; }
.story-contents li { counter-increment: contents; margin-bottom: 16px; }
.story-contents a { display: flex; gap: 12px; color: #e4e4eb; font-size: 14px; line-height: 1.4; }
.story-contents a::before { content: counter(contents, decimal-leading-zero); color: #ffb511; font-family: 'Playfair Display', serif; }
.story-contents a:hover { color: #ffb511; }
.story-facts { background: #323645; padding: 22px 20px; border-radius: 5px; margin-bottom: 24px; }
.story-facts dl { margin: 0; }
.story-facts dt { color: #cbccd6; font-size: 12px; font-weight: 400; }
.story-facts dd { margin: 0 0 12px; font-size: 14px; line-height: 1.4; }
.story-facts dd:last-child { margin-bottom: 0; }
.story-article { min-width: 0; }
.story-body { font-size: 16px; line-height: 1.85; overflow-wrap: break-word; }
.story-body p { margin: 0 0 22px; }
.story-body > p:first-child { font-size: 18px; font-weight: 600; color: #f6f3ed; }
.story-body > p:first-child::first-letter { float: left; font: 700 64px/.9 'Playfair Display', serif; color: #eaaa14; padding: 7px 10px 0 0; }
.story-body h2, .story-body h3, .story-body h4, .story-related > h2 { font-family: 'Playfair Display', serif; font-weight: 700; color: #faf8f3; line-height: 1.3; }
.story-body h2 { margin: 56px 0 20px; padding-bottom: 10px; border-bottom: 1px solid #a17a24; font-size: clamp(1.5rem, 2.5vw, 1.875rem); scroll-margin-top: 32px; }
.story-section-heading::before { content: attr(data-section-number) ' '; color: #efad13; margin-right: 8px; }
.story-body h3 { margin-top: 36px; font-size: 1.5rem; }
.story-body a, .story-pages a, .story-comments a { color: #ffb511; text-decoration: underline; text-underline-offset: 3px; }
.story-body figure { max-width: 100%; margin: 24px 0; }
.story-body img { max-width: 100%; height: auto; border-radius: 5px; }
.story-body .wp-block-image img { width: 100%; }
.story-body figcaption, .story-body .wp-caption-text { margin-top: 8px; color: #c6c8d1; font-size: 12px; line-height: 1.5; }
.story-body iframe, .story-body video { max-width: 100%; }
.story-body blockquote { margin: 30px 0; border-left: 3px solid #efad13; padding: 8px 24px; }
.story-body table { display: block; max-width: 100%; overflow-x: auto; }
.story-related, .story-comments { margin-top: 64px; }
.single-story [hidden] { display: none !important; }
@media (max-width: 767px) {
  .story-hero { min-height: 380px; padding: 64px 22px 40px; }
  .story-layout { grid-template-columns: 1fr; gap: 32px; padding: 32px 22px 56px; }
  .story-sidebar-inner { position: static; max-height: none; overflow: visible; }
  .story-contents ol { columns: 2; column-gap: 24px; }
  .story-contents li { break-inside: avoid; }
  .story-facts dl { display: grid; grid-template-columns: auto 1fr; gap: 8px 16px; }
  .story-facts dd { margin: 0; }
  .story-body h2 { margin-top: 40px; }
}
@media (max-width: 420px) { .story-contents ol { columns: 1; } }
@media print {
  .story-sidebar, .story-hero-image, .story-hero::after { display: none; }
  .story-layout { display: block; padding: 0; }
  .story-hero { min-height: 0; padding: 20px 0; }
}

/* Full-width article footer: adjacent posts, recommendations, then comments. */
.story-footer-container { width: 100%; max-width: 1300px; margin-inline: auto; padding-inline: 40px; }
.story-post-navigation { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding-bottom: 32px; }
.story-adjacent { display: flex; flex-direction: column; justify-content: center; gap: 8px; padding: 24px; border: 1px solid #3d4151; border-radius: 5px; color: #f5f2ec; transition: border-color .2s, background-color .2s; overflow-wrap: anywhere; }
.story-adjacent-next { grid-column: 2; text-align: right; }
.single-story .story-adjacent .story-label { margin: 0; }
.story-adjacent-title { font: 700 20px/1.35 'Playfair Display', serif; }
.story-adjacent:hover { color: #f5f2ec; background: #303441; border-color: #c38e20; }
.story-recommendations { padding-block: 32px; border-top: 1px solid #3d4151; background: #252833; }
.story-recommendations h2 { margin: 0 0 20px; color: #f5f2ec; font: 700 28px/1.3 'Playfair Display', serif; }
.story-recommendations h2::after { content: ''; display: block; width: 52px; height: 2px; margin-top: 12px; background: #e7a512; }
.story-related-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.story-related-card { display: flex; flex-direction: column; overflow: hidden; border-radius: 5px; background: #1c1f28; box-shadow: none; color: #f5f2ec; }
.story-related-cover { aspect-ratio: 1.8; overflow: hidden; background: repeating-linear-gradient(135deg, #353948 0 12px, #3b3f4f 12px 24px); }
.story-related-cover img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s; }
.story-related-copy { padding: 18px 20px 22px; }
.single-story .story-related-copy .story-label { display: block; margin-bottom: 8px; }
.story-related-copy h3 { margin: 0; color: #f5f2ec; font: 700 22px/1.3 'Playfair Display', serif; overflow-wrap: anywhere; }
.story-related-card:hover { color: #f5f2ec; box-shadow: none; }
.story-related-card:hover img { transform: scale(1.025); }
.story-comments.story-footer-container { margin-top: 0; padding-block: 32px; }
@media (max-width: 767px) {
  .story-footer-container { padding-inline: 22px; }
  .story-post-navigation { grid-template-columns: 1fr; padding-bottom: 24px; }
  .story-adjacent-next { grid-column: auto; }
  .story-adjacent { padding: 20px; }
  .story-related-grid { grid-template-columns: 1fr; }
  .story-recommendations, .story-comments.story-footer-container { padding-block: 24px; }
}
@media (prefers-reduced-motion: reduce) { .story-related-cover img { transition: none; } }
@media print { .story-post-navigation, .story-recommendations { display: none; } }