/* Articles: single posts and the /articles/ hub. Builds on redesign-home.css tokens. */
/* tokens missing from redesign-home.css (values from the original design system) */
.cr-article{--card-2:#FBF8F1;--r-sm:12px;--r-md:16px;--r-lg:24px;--r-pill:999px;--r-book:3px 6px 6px 3px;--sh-inset:inset 0 0 0 1px var(--line);--sh-cover:0 40px 60px -26px rgba(var(--ink-rgb),.55),0 4px 12px rgba(var(--ink-rgb),.22)}

html body.cr-article{background:var(--paper);color:var(--ink)}
html body.cr-article #page,html body.cr-article .site{background:transparent}
.art{padding:clamp(120px,14vw,168px) var(--gut) clamp(72px,9vw,120px)}

/* ---- header ---- */
.art-head{max-width:780px;margin:0 auto clamp(40px,5vw,60px);text-align:center}
.art-head .eyebrow{justify-content:center}
.art-title{font-family:var(--serif);font-weight:500;font-size:clamp(34px,4.8vw,58px);line-height:1.07;letter-spacing:-.012em;color:var(--ink);margin:0 0 20px;text-wrap:balance}
.art-meta{font-family:var(--sans);font-size:14px;letter-spacing:.01em;color:var(--muted);margin:0}
.art-meta span{margin:0 .45em}

/* ---- body: a ~68ch measure ---- */
.art-body{max-width:680px;margin:0 auto;font-family:var(--sans);font-size:18px;line-height:1.75;color:var(--ink-2)}
.art-body>p:first-of-type{font-family:var(--serif);font-size:clamp(20px,2.1vw,23px);line-height:1.55;color:var(--ink)}
.art-body p{margin:0 0 22px}
.art-body h2{font-family:var(--serif);font-weight:500;font-size:clamp(26px,3vw,34px);line-height:1.18;letter-spacing:-.006em;color:var(--ink);margin:60px 0 18px;text-wrap:balance}
.art-body h3{font-family:var(--serif);font-weight:500;font-size:clamp(20px,2.2vw,23px);line-height:1.3;color:var(--ink);margin:38px 0 10px}
.art-body strong{color:var(--ink);font-weight:600}
.art-body em{font-style:italic}
.art-body a{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:color .2s}
.art-body a:hover{color:var(--accent-d)}
.art-body ul,.art-body ol{margin:0 0 24px;padding-left:1.35em}
.art-body li{margin:0 0 12px;padding-left:.25em}
.art-body li::marker{color:var(--accent)}
.art-body ol li::marker{font-family:var(--serif);font-weight:600}

/* Key-takeaways box (blockquote directly after the lede) */
.art-body blockquote{margin:40px 0 44px;padding:28px 32px 20px;background:var(--card-2);border-radius:var(--r-md);box-shadow:var(--sh-inset);border-left:3px solid var(--accent)}
.art-body blockquote>p:first-child{margin:0 0 6px}
.art-body blockquote>p:first-child strong{font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.art-body blockquote ul{margin:10px 0 8px}
.art-body blockquote li{font-size:16.5px;line-height:1.6;color:var(--ink)}

/* ---- book card ---- */
.art-book{max-width:780px;margin:clamp(56px,7vw,84px) auto 0;display:grid;grid-template-columns:150px 1fr;gap:clamp(24px,3.5vw,40px);align-items:center;background:var(--panel-2);border-radius:var(--r-lg);padding:clamp(26px,3.6vw,44px)}
.art-book-cover{display:block;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.art-book-cover:hover{transform:translateY(-4px) rotate(-1deg)}
.art-book-cover img{width:100%;height:auto;display:block;border-radius:var(--r-book);box-shadow:var(--sh-cover)}
.art-book-kicker{display:block;font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 10px}
.art-book-name{font-family:var(--serif);font-weight:500;font-size:clamp(26px,3vw,32px);line-height:1.12;color:var(--ink);margin:0 0 10px}
.art-book-blurb{font-family:var(--sans);font-size:16px;line-height:1.6;color:var(--ink-2);margin:0 0 22px}
.art-book-btns{display:flex;flex-wrap:wrap;gap:12px}
.art-book-btns .btn{padding:13px 24px;font-size:13px}

/* ---- keep reading ---- */
.art-more{max-width:1080px;margin:clamp(72px,9vw,112px) auto 0}
.art-more-title{font-family:var(--serif);font-weight:500;font-size:clamp(28px,3.4vw,40px);line-height:1.1;color:var(--ink);text-align:center;margin:0 0 32px}
.art-more-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.art-card{display:flex;flex-direction:column;background:var(--card-2);border-radius:var(--r-md);box-shadow:var(--sh-inset);padding:26px 26px 22px;text-decoration:none;transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s}
.art-card:hover{transform:translateY(-4px);box-shadow:var(--sh-inset),0 22px 40px -22px rgba(var(--ink-rgb),.35)}
.art-card-kicker{font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 12px}
.art-card-title{font-family:var(--serif);font-weight:500;font-size:20px;line-height:1.3;color:var(--ink);margin:0 0 22px;flex:1}
.art-card-go{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);border-bottom:2px solid var(--accent);padding-bottom:3px;align-self:flex-start}
.art-more-all{text-align:center;margin:30px 0 0}
.art-more-all a{font-family:var(--sans);font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--accent);padding-bottom:3px}

/* ---- /articles/ hub ---- */
.hub-head{max-width:720px;margin:0 auto clamp(44px,5vw,64px);text-align:center}
.hub-head .eyebrow{justify-content:center}
.hub-title{font-family:var(--serif);font-weight:500;font-size:clamp(38px,5vw,60px);line-height:1.06;color:var(--ink);margin:0 0 16px}
.hub-title em{font-style:italic;color:var(--accent)}
.hub-sub{font-family:var(--sans);font-size:17px;line-height:1.6;color:var(--ink-2);margin:0}
.hub-grid{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.hub-grid .art-card{padding:32px 32px 26px}
.hub-grid .art-card-title{font-size:clamp(22px,2.4vw,26px);margin-bottom:12px;flex:0 0 auto}
.hub-excerpt{font-family:var(--sans);font-size:15.5px;line-height:1.6;color:var(--ink-2);margin:0 0 22px;flex:1}

@media (max-width:860px){
	.art-more-grid{grid-template-columns:1fr}
	.hub-grid{grid-template-columns:1fr}
}
@media (max-width:600px){
	.art-body{font-size:17px}
	.art-body blockquote{padding:22px 22px 14px}
	.art-book{grid-template-columns:1fr;text-align:center}
	.art-book-cover{width:130px;margin:0 auto}
	.art-book-btns{justify-content:center}
}
.hub-sub a{color:var(--accent);text-underline-offset:3px}