/* article reading layout for the two analysis parts */
.article-hero { padding: 92px 0 26px; }
.article-hero .partlabel { font-family: var(--font-mono); font-size:12px; letter-spacing:3px; text-transform:uppercase; color:var(--cy); }
.article-hero h1 { font-family: var(--font-display); font-weight:800; letter-spacing:-1.2px; font-size: clamp(34px,5vw,56px); line-height:1.02; margin:16px 0 14px; color:#f4f7fc; }
.article-hero .sub { font-family: var(--font-body); font-size: 20px; color: var(--fg-soft); max-width: 720px; }
.article-hero .meta { font-family: var(--font-ui); font-size:13.5px; color: var(--fg-mute); margin-top:18px; display:flex; gap:18px; flex-wrap:wrap; align-items:center; }
.article-hero .meta b { color: var(--fg); }
.article-hero .meta a { color: var(--cy); }

.toc { max-width: 760px; margin: 6px auto 0; border:1px solid var(--line-2); border-radius:14px; padding:18px 22px; background: linear-gradient(165deg, rgba(17,25,39,.85), rgba(8,13,22,.82)); }
.toc-h { font-family: var(--font-mono); font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color: var(--cy); margin-bottom:10px; }
.toc ol { margin:0; padding-left:20px; columns:2; column-gap:28px; }
.toc li { font-family: var(--font-ui); font-size:14px; margin:5px 0; break-inside:avoid; }
.toc a { color: var(--fg-soft); text-decoration:none; }
.toc a:hover { color: var(--cy); }
.prose h2 { scroll-margin-top: 80px; }
@media (max-width:680px){ .toc ol { columns:1; } }
.prose { max-width: 760px; margin: 0 auto; padding: 20px 0 40px; font-family: var(--font-body); font-size: 18.5px; line-height: 1.72; color: var(--fg-soft); }
.prose h2 { font-family: var(--font-display); font-weight:700; font-size: clamp(26px,3vw,34px); letter-spacing:-.4px; color:#f1f4fa; margin: 52px 0 8px; padding-top: 14px; border-top:1px solid var(--line); }
.prose h2:first-child { border-top:0; padding-top:0; margin-top: 8px; }
.prose h3 { font-family: var(--font-ui); font-weight:600; font-size: 20px; color: var(--cy); margin: 34px 0 6px; }
.prose p { margin: 0 0 18px; }
.prose a { color: var(--cy); text-decoration: underline; text-underline-offset: 2px; text-decoration-color: rgba(65,224,214,.4); }
.prose a:hover { text-decoration-color: var(--cy); }
.prose strong { color: var(--fg); font-weight: 600; }
.prose code { font-family: var(--font-mono); font-size: .86em; background: rgba(255,255,255,.05); padding: 1px 6px; border-radius: 5px; color: #d6e0ee; }
.prose ul, .prose ol { margin: 0 0 18px; padding-left: 24px; }
.prose li { margin: 5px 0; }
.prose hr { border:0; border-top:1px solid var(--line); margin: 30px 0; }

/* callouts */
.callout { border-radius: 13px; padding: 16px 20px; margin: 26px 0; font-family: var(--font-ui); font-size: 16px; line-height:1.6; border:1px solid; position: relative; }
.callout .cl-label { font-family: var(--font-mono); font-size: 11px; letter-spacing:1.5px; text-transform: uppercase; font-weight:600; margin-bottom: 8px; }
.callout p { margin: 0 0 8px; } .callout p:last-child { margin-bottom:0; }
.callout ul { margin: 4px 0 0; padding-left: 20px; }
.callout li { margin: 6px 0; }
.cl-EXEC { background: rgba(47,111,237,.08); border-color: rgba(91,140,255,.4); } .cl-EXEC .cl-label{ color:#7fa2ff; }
.cl-TAKEAWAYS { background: rgba(65,224,214,.06); border-color: rgba(65,224,214,.35); } .cl-TAKEAWAYS .cl-label{ color: var(--cy); }
.cl-RECOMMEND { background: rgba(255,176,32,.07); border-color: rgba(255,176,32,.38); } .cl-RECOMMEND .cl-label{ color:#ffc04a; }
.cl-GAP { background: rgba(255,84,112,.08); border-color: rgba(255,84,112,.42); } .cl-GAP .cl-label{ color: var(--crit); }
.cl-EXAMPLE { background: rgba(124,140,255,.07); border-color: rgba(124,140,255,.38); } .cl-EXAMPLE .cl-label{ color:#9aa6ff; }
.cl-NOTE { background: rgba(131,142,164,.08); border-color: var(--line-2); } .cl-NOTE .cl-label{ color: var(--fg-mute); }

/* figures */
.prose figure { margin: 34px 0; }
.prose figure img { width: 100%; border:1px solid var(--line-2); border-radius: 14px; box-shadow: var(--shadow-card); display:block; }
.prose figcaption { font-family: var(--font-ui); font-size: 13.5px; color: var(--fg-mute); text-align:center; margin-top: 10px; font-style: italic; }

/* exhibit tables (wide, escape the reading column) */
.exhibit-wrap { margin: 30px calc((760px - min(1180px, 92vw)) / 2); max-width: min(1180px, 92vw); overflow-x: auto; border:1px solid var(--line-2); border-radius: 14px; box-shadow: var(--shadow-card); }
@media (max-width: 1180px){ .exhibit-wrap { margin: 30px 0; } }
table.exhibit { border-collapse: collapse; width: 100%; font-family: var(--font-ui); font-size: 13.5px; min-width: 720px; }
table.exhibit caption { caption-side: top; text-align:left; font-family: var(--font-mono); font-size: 11px; letter-spacing:1px; text-transform: uppercase; color: var(--cy); padding: 12px 14px 0; }
table.exhibit th { position: sticky; top:0; background: #16202f; color: var(--fg-soft); text-align:left; padding: 11px 14px; font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; letter-spacing:.5px; border-bottom:1px solid var(--line-2); }
table.exhibit td { padding: 10px 14px; border-bottom:1px solid var(--line); color: var(--fg-soft); vertical-align: top; }
table.exhibit tr:nth-child(even) td { background: rgba(255,255,255,.015); }
table.exhibit .mono { font-family: var(--font-mono); font-size: 12px; color: var(--fg-faint); white-space:nowrap; }
table.exhibit .gapcell { font-family: var(--font-mono); font-size: 12px; font-weight:600; white-space:nowrap; }

.partnav { display:flex; justify-content: space-between; gap: 16px; margin: 50px 0 10px; flex-wrap:wrap; }
.partnav a { font-family: var(--font-ui); font-size:15px; border:1px solid var(--line-2); border-radius: 12px; padding: 16px 20px; color: var(--fg); flex:1; min-width: 220px; transition: border-color .15s, transform .15s; }
.partnav a:hover { border-color: var(--cy); transform: translateY(-2px); text-decoration:none; }
.partnav a span { display:block; font-family: var(--font-mono); font-size:11px; color: var(--cy); letter-spacing:1px; margin-bottom:5px; }
.partnav a.next { text-align: right; }
