/* ============================================================
   articles.css  — accordion + TOC + related styling for /articles/*
   Passthrough file (public/css). Loaded by _includes/article-layout.njk.
   Most article classes (.page-hero, .breadcrumbs, .article, .notice,
   .cta-row, .button) are already styled in styles.css; this file only
   adds the accordion presentation and the auto-generated TOC.
   ============================================================ */

/* Accordion items */
.article-acc{border-bottom:1px solid var(--rule,#D9D2C2);margin:0}
.article-acc>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:18px 2px}
.article-acc>summary::-webkit-details-marker{display:none}
.article-acc>summary::after{content:"+";margin-left:auto;font-family:var(--f-mono,ui-monospace,monospace);font-size:22px;line-height:1;color:var(--accent,#B8410C);transition:transform .2s ease}
.article-acc[open]>summary::after{transform:rotate(45deg)}
.article-acc>summary h2{margin:0;font-size:clamp(21px,2.5vw,28px);font-family:var(--f-serif,'Instrument Serif',serif);font-weight:400;line-height:1.15;letter-spacing:-.01em}
.article-acc .acc-body{padding:2px 2px 22px;color:var(--slate,#5A6478);line-height:1.7;font-size:15.5px}
.article-acc .acc-body p{margin:0 0 14px}
.article-acc .acc-body p:last-child{margin-bottom:0}
.article-acc .acc-body ul,.article-acc .acc-body ol{margin:10px 0 10px 22px}
.article-acc .acc-body li{margin-bottom:8px}
.article-acc .acc-body a{color:var(--accent,#B8410C);border-bottom:1px solid var(--rule,#D9D2C2)}

/* Related articles block */
.related-articles{margin-top:40px}
.related-articles .article-acc{border-top:1px solid var(--rule,#D9D2C2)}

html{scroll-behavior:smooth}
:target{scroll-margin-top:90px}