/* Shared long-form reading layout. */
.detail-page{--accent:#3867bf;--wash:#eef5ff;--blob:#bddbff}
.source-note{background:#f6f7fa;border-left:2px solid #b7c8e4;color:#657088;font:400 .875rem/1.7 var(--sans);padding:.65rem .95rem;margin:25px 0 0;max-width:850px}
.detail-page .btn{display:inline-block;background:var(--ink);color:white;text-decoration:none;padding:.85rem 1.25rem;border:1px solid var(--ink);border-radius:5px;font-size:1rem}
.detail-page .btn:hover{background:var(--accent);border-color:var(--accent)}
.detail-page .btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.detail-page .btn.ghost:hover{background:var(--wash)}
.detail-page .cta-row{display:flex;flex-wrap:wrap;gap:1rem;margin-top:1.7rem}
.detail-page .note{font-size:.875rem;margin-top:1rem}
.detail-page .crumb{font-size:.875rem;margin-bottom:1.6rem;color:var(--muted)}
.detail-page .crumb a{text-decoration:underline;text-underline-offset:4px}
.detail-page .lede{font-size:1rem;line-height:1.85;margin-top:1.7rem;max-width:55ch}
.detail-page .art svg{display:block;width:100%;height:auto}
.detail-page svg path[fill="#96A2FF"],.detail-page svg rect[fill="#96A2FF"]{fill:var(--blob)}
.detail-page .bar{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;margin-top:3.5rem;border-block:1px solid var(--line);padding-block:1.8rem}
.detail-page .bar b{font-size:1.4rem;display:block;font-family:'Bricolage Grotesque',var(--sans);letter-spacing:-.035em}
.detail-page .bar span{font-size:.875rem;color:var(--muted);display:block;margin-top:.4rem}
.detail-page main>section{padding-block:70px}
.detail-page main>section>div>h2{margin-bottom:1.2rem}
.detail-page .sub{font-size:1rem;max-width:66ch}
.detail-page .fit{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-top:2rem}
.detail-page .fit>div{padding:2rem;border:1px solid var(--line);border-radius:6px}
.detail-page .fit>div.no{background:#f6f7f8}

.detail-page .fit ul{padding-left:1.2rem;margin-top:1.2rem}
.detail-page .fit li{padding-left:.25rem;margin-top:.6rem;color:var(--muted);font-size:1rem}
.detail-page .weeks{margin-top:2rem;border-top:1px solid var(--line)}
.detail-page .wk{display:grid;grid-template-columns:120px 1fr;gap:2rem;padding:1.5rem 0;border-bottom:1px solid var(--line)}
.detail-page .wk .n{font:.875rem var(--mono);color:var(--accent);padding-top:.2rem}
.detail-page .wk h4{font-family:'Bricolage Grotesque',var(--sans);font-weight:700;line-height:1.35;margin:0;letter-spacing:-.025em}
.detail-page .wk p{font-size:1rem;margin-top:.5rem;max-width:70ch}
.detail-page .faq{border-top:1px solid var(--line);margin-top:2rem}
.detail-page .faq details{border-bottom:1px solid var(--line)}
.detail-page .faq summary{cursor:pointer;font-weight:600;font-size:1.4rem;padding:1.3rem 0;list-style:none;display:flex;gap:1rem}
.detail-page .faq summary::-webkit-details-marker{display:none}
.detail-page .faq summary::before{content:'+';color:var(--accent)}
.detail-page .faq details[open] summary::before{content:'−'}
.detail-page .faq p{padding:0 0 1.5rem 1.7rem;max-width:75ch;font-size:1rem}
.detail-page .contact{background:var(--wash);padding:3rem;border-radius:8px;position:relative;overflow:hidden}
.detail-page .contact .blobby{display:none}
.detail-page .contact h2{max-width:20ch}
.detail-page .contact p{font-size:1rem;margin-top:1rem;max-width:62ch}
.detail-page .narrow{max-width:760px;width:calc(100% - 48px);margin-inline:auto}
.detail-page.post-page main>article{padding-top:55px}
.detail-page .body{padding-top:1.3rem}
.detail-page .body p{font-size:1rem;line-height:1.95;margin-top:1.25rem}
.detail-page .body h2{line-height:1.3;margin-top:2.8rem;margin-bottom:.9rem}
.detail-page .body h3{margin-top:2rem;letter-spacing:-.02em}
.detail-page .body ul,.detail-page .body ol{padding-left:1.2rem;margin-block:1.3rem}
.detail-page .body li{font-size:1rem;line-height:1.9;margin-top:.6rem;padding-left:.3rem;color:var(--muted)}
.detail-page .body strong{color:var(--ink);font-weight:600}
.detail-page .body a{color:var(--accent);text-decoration:underline;text-underline-offset:4px}
.detail-page .body figure{margin-block:2.5rem}
.detail-page figcaption{font-size:.875rem;color:var(--muted);margin-top:1rem}
.detail-page .pull{border-left:3px solid var(--blob);padding-left:1.5rem;margin-block:2rem}
.detail-page .pull p{font:700 1.4rem/1.5 'Bricolage Grotesque',var(--sans);letter-spacing:-.03em;color:var(--ink)}
.detail-page .next{padding-block:3rem 4rem}
.detail-page .more{font-size:1rem;color:var(--accent);text-decoration:underline;text-underline-offset:4px}
.theme-notes{padding-block:60px 80px}
.theme-notes>h1{line-height:1.1;margin-block:1.5rem}
@media(max-width:1000px){
.detail-page .bar{gap:1rem}
.detail-page .bar b{font-size:1.4rem}
}
@media(max-width:700px){
.detail-page .bar{grid-template-columns:1fr 1fr;gap:1.5rem}
.detail-page .bar b{font-size:1.4rem}
.detail-page .bar span{font-size:.875rem}
.detail-page .lede{font-size:1rem}
.detail-page main>section{padding-block:50px}

.detail-page .fit{grid-template-columns:1fr;gap:1rem}
.detail-page .fit>div{padding:1.5rem}
.detail-page .wk{grid-template-columns:1fr;gap:.65rem;padding-block:1.25rem}
.detail-page .wk .n{font-size:.875rem}

.detail-page .contact{padding:1.5rem}

.detail-page .contact p{font-size:1rem}
.detail-page.post-page main>article{padding-top:35px}

.detail-page .body p{font-size:1rem}
.detail-page .pull p{font-size:1.4rem}
.source-note{font-size:.875rem}
.theme-notes{padding-block:35px 55px}

}
