.journal { margin:0; padding-top:var(--topbar-h); overflow-x:visible; color:var(--color-ink); background:var(--color-paper); font:400 var(--type-body)/1.5 var(--font-family); letter-spacing:var(--tracking); }
.journal * { box-sizing:border-box; }
.journal a { color:inherit; text-decoration:none; }
.journal .top-request { color:var(--color-paper); }
.journal button,.journal input { font:inherit; color:inherit; }
.journal-main img,.article-main img { display:block; max-width:100%; height:auto; }
/* :where() keeps these resets at zero specificity, so shared blocks (header, footer) keep their own spacing. */
:where(.journal) :is(h1,h2,h3,p) { margin:0; }
:where(.journal) :is(h1,h2,h3) { font-weight:400; text-wrap:balance; }
.journal a:focus-visible,.journal button:focus-visible,.journal input:focus-visible,.journal summary:focus-visible { outline:2px solid var(--color-ink); outline-offset:5px; }
.journal [hidden] { display:none!important; }
.skip { position:fixed; left:var(--space-16); top:-100px; z-index:10001; background:var(--color-paper); padding:var(--space-16); }
.skip:focus { top:var(--space-16); }
.journal-header { min-height:var(--topbar-h); padding:var(--space-20) var(--page-gutter); display:flex; gap:var(--space-24); flex-wrap:wrap; align-items:center; justify-content:space-between; border-bottom:1px solid var(--color-border); }
.journal-brand { width:226px; flex:none; line-height:1; }
.journal-brand>span { font:300 var(--text-24)/1 "Montserrat",Arial,sans-serif; white-space:nowrap; }
.journal-brand b { color:var(--color-accent); font-size:var(--text-36); font-weight:400; }
.journal-brand small { display:block; font:400 var(--text-12)/1.2 "Montserrat",Arial,sans-serif; text-align:right; }
.journal-header nav { display:flex; flex-wrap:wrap; gap:var(--space-8) var(--space-24); font-size:var(--type-control); order:3; width:100%; }
.journal-header nav a { padding:var(--space-8) 0; text-underline-offset:6px; }
.journal-header nav a:hover,.journal-header nav [aria-current] { text-decoration:underline; }
.journal-back { display:none; }
.journal-main,.article-main { padding:0 var(--page-gutter); max-width:1800px; margin:auto; }
.journal-intro { padding:var(--space-64) 0 var(--space-48); display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-20); }
.eyebrow { font-size:var(--type-label); line-height:1.4; color:var(--color-muted); }
.journal-intro h1 { font-size:var(--type-section); line-height:1.06; }
.journal-deck { font-size:var(--type-lead); }
.journal-tools { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:var(--space-24); margin-bottom:var(--space-24); }
.journal-tools h2 { font-size:var(--type-result); }
.search { display:flex; align-items:center; gap:var(--space-12); border-bottom:1px solid var(--color-border); width:min(100%,320px); }
.search input { width:100%; min-width:0; border:0; padding:var(--space-12) 0; background:transparent; font-size:var(--type-control); }
.search-reset { display:grid; place-items:center; flex:none; width:44px; height:44px; border:0; background:transparent; cursor:pointer; }
.search-status { margin-bottom:var(--space-24)!important; font-size:var(--type-control); color:var(--color-muted); }
.journal-grid { display:grid; gap:var(--space-48) var(--space-24); }
.journal-card { min-width:0; }
.journal-card>a { display:flex; height:100%; flex-direction:column; }
.cover { aspect-ratio:3/2; overflow:hidden; border-radius:var(--radius-panel); background:var(--color-surface); margin-bottom:var(--space-20); }
.cover img { width:100%; height:100%; object-fit:cover; transition:transform 500ms var(--motion-standard); }
@media (hover:hover) {
  .journal-card > a:hover .cover img { transform:scale(1.035); }
}
.journal-card h2 { font-size:var(--type-result); line-height:1.15; text-wrap:pretty; margin:var(--space-12) 0; }
.journal-card p { font-size:var(--type-body); line-height:1.5; color:var(--color-muted); margin-bottom:var(--space-24); }
.card-link { margin-top:auto; font-size:var(--type-control); display:flex; align-items:center; gap:var(--space-12); }
/* Filter bar shared by the blog and the cases page: outline controls in the site's button language, the chosen one ink. */
.filter-bar { display:flex; flex-wrap:wrap; gap:var(--space-8); min-width:0; }
.filter-bar button { display:inline-flex; align-items:center; gap:var(--space-8); flex:none; min-height:44px; padding:0 var(--space-16); border:1px solid var(--color-border); border-radius:var(--radius-control); background:var(--color-paper); color:var(--color-ink); font-size:var(--type-control); line-height:1; white-space:nowrap; cursor:pointer; transition:border-color var(--duration-fast),background var(--duration-fast),color var(--duration-fast); }
.filter-bar button:hover { border-color:var(--color-ink); }
.filter-bar button[aria-pressed="true"] { border-color:var(--color-ink); background:var(--color-ink); color:var(--color-paper); }
.filter-bar .filter-count { font-size:var(--type-label); color:var(--color-muted); }
.filter-bar button[aria-pressed="true"] .filter-count { color:var(--color-dark-muted); }
.filter-status { margin:0 0 var(--space-24); font-size:var(--type-control); color:var(--color-muted); }
@media(max-width:767px) {
  /* Phones: one scrollable row instead of ragged wrapping, bleeding to the screen edges. */
  .filter-bar { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin-inline:calc(-1 * var(--page-gutter)); padding-inline:var(--page-gutter); scroll-padding-inline:var(--page-gutter); }
  .filter-bar::-webkit-scrollbar { display:none; }
  .journal-tools { flex-direction:column; flex-wrap:nowrap; align-items:stretch; gap:var(--space-16); }
  .journal-tools .search { width:100%; }
}
.article-author { display:flex; align-items:center; gap:var(--space-12); margin-block:var(--space-20) var(--space-24); font-size:var(--type-control); }
.article-author img { width:44px; height:44px; object-fit:cover; border-radius:50%; flex:none; }
.article-author strong { display:block; font-weight:500; color:var(--color-ink); }
.article-author small { display:block; font-size:var(--type-label); line-height:1.4; color:var(--color-muted); }
.article-heading .article-author { margin:0; }
.human-label { display:inline-flex; align-items:center; gap:var(--space-8); font-size:var(--type-label); color:var(--color-muted); margin-block:var(--space-8); }
.journal .case-archive .projects { margin-inline:0; }
.case-archive .cases-v3 h2 { font-size:var(--type-case-heading); line-height:1.125; font-weight:400; }
.case-archive .case-primary-story h2,.case-archive .case-southern-story h2 { margin-top:var(--space-16); }
.journal .case-archive .case-brand img { max-width:none; height:inherit; }
.journal .ph { font-size:var(--text-20); vertical-align:middle; flex:none; }
.materials { padding:var(--space-48) 0 0; margin-top:var(--section-gap); border-top:1px solid var(--color-border); display:grid; gap:var(--space-32); scroll-margin-top:var(--space-32); }
.materials h2 { font-size:var(--type-section); line-height:1.1; margin:var(--space-12) 0 var(--space-24); }
.material { display:flex; gap:var(--space-16); padding:var(--space-24) 0; border-bottom:1px solid var(--color-border); align-items:flex-start; }
.material strong { display:block; font-size:var(--type-body); font-weight:500; }
.material small { display:block; font-size:var(--type-control); color:var(--color-muted); margin-top:var(--space-8); }
.material-format { white-space:nowrap; margin-left:auto; font-size:var(--type-label); }
.material:hover strong { text-decoration:underline; text-underline-offset:5px; }
.journal-footer { margin:var(--space-80) var(--page-gutter) 0; border-top:1px solid var(--color-border); padding:var(--space-32) 0; display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--space-24); font-size:var(--type-control); }
.journal-footer p { color:var(--color-muted); }
.breadcrumbs { display:flex; gap:var(--space-12); flex-wrap:wrap; font-size:var(--type-label); color:var(--color-muted); margin-top:var(--space-32); }
.breadcrumbs a:hover { text-decoration:none; }
.article-heading { max-width:1004px; margin:var(--space-48) auto; }
.article-main > .breadcrumbs { max-width:1004px; margin-inline:auto; }
.article-heading h1 { font-size:var(--type-article-title); line-height:1.08; margin:var(--space-20) 0 var(--space-24); overflow-wrap:break-word; }
.article-lead { font-size:var(--type-lead); line-height:1.5; max-width:850px; }
.article-meta { display:flex; flex-wrap:wrap; gap:var(--space-12) var(--space-24); align-items:center; margin-top:var(--space-24); font-size:var(--type-label); color:var(--color-muted); }
.copy-link { width:44px; height:44px; border:1px solid var(--color-border); border-radius:50%; background:var(--color-paper); cursor:pointer; }
.article-layout { display:grid; gap:var(--space-32); max-width:1240px; margin:auto; }
.article-aside { min-width:0; }
.article-aside details { border-block:1px solid var(--color-border); padding:var(--space-20) 0; }
.article-aside summary { cursor:pointer; font-size:var(--type-control); }
.article-aside summary { min-height:44px; align-content:center; }
.article-aside nav { display:grid; gap:var(--space-16); margin-top:var(--space-20); }
.article-aside a { font-size:var(--type-control); color:var(--color-muted); line-height:1.35; border-left:3px solid transparent; padding-left:var(--space-12); }
.article-aside a:hover { color:var(--color-ink); text-decoration:underline; text-underline-offset:4px; }
.article-aside a[aria-current] { color:var(--color-ink); border-left-color:var(--color-accent); }
.reading { min-width:0; max-width:700px; width:100%; margin:auto; font-size:var(--type-reading); line-height:1.6; overflow-wrap:break-word; }
.article-cover { width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:var(--radius-panel); }
.reading-summary { margin:var(--space-32) 0 var(--space-48); padding-left:var(--space-24); border-left:3px solid var(--color-accent); }
.reading-summary .eyebrow { margin-bottom:var(--space-8); }
.reading section { margin-top:var(--space-64); scroll-margin-top:calc(var(--topbar-h) + var(--space-24)); }
.reading h2 { font-size:var(--type-case-heading); line-height:1.18; margin-bottom:var(--space-24); text-wrap:pretty; }
.reading h3 { font-size:var(--type-result); line-height:1.3; margin-bottom:var(--space-16); }
.reading #faq p+h3 { margin-top:var(--space-32); }
.reading { color:var(--color-reading); }
.reading :is(h2,h3,h4) { color:var(--color-ink); font-weight:500; }
.reading :is(h2,h3,h4),.reading-summary { scroll-margin-top:calc(var(--topbar-h) + var(--space-24)); }
.reading p+p,.reading :is(ul,ol)+p { margin-top:var(--space-24); }
.reading :is(p,ul,ol,figure,blockquote)+:is(h3,h4) { margin-top:var(--space-32); }
.reading ul,.reading ol { padding-left:var(--space-24); margin-block:var(--space-24); }
.reading ol { list-style:decimal outside; }
.reading ol > li { display:list-item; }
.reading li::marker { color:inherit; font:inherit; }
.reading li+li { margin-top:var(--space-12); }
.reading :is(strong,b) { font-weight:500; }
.reading blockquote { margin:var(--space-32) 0; padding-left:var(--space-24); border-left:3px solid var(--color-accent); }
.reading :is(p,div):empty { display:none; }
.reading :is(p,li,dd) a { text-decoration:underline; text-decoration-color:var(--color-muted); text-underline-offset:4px; }
.reading :is(p,li,dd) a:hover { text-decoration-thickness:2px; }
.reading-example { margin:var(--space-32) 0; padding:var(--space-24); background:var(--color-surface); }
.reading .article-download,.reading .article-next-step { border-top:1px solid var(--color-border); padding-top:var(--space-32); }
.small-note { font-size:var(--type-label); color:var(--color-muted); margin-top:var(--space-16)!important; }
.editorial-figure { margin:var(--space-32) 0; padding-block:var(--space-24); border-block:1px solid var(--color-border); }
.editorial-figure .figure-kicker { color:var(--color-muted); font-size:var(--type-label); margin-bottom:var(--space-16); }
.editorial-figure h3 { font-size:var(--type-result); margin-bottom:var(--space-24); }
.editorial-figure figcaption { margin-top:var(--space-24); font-size:var(--type-control); line-height:1.5; color:var(--color-muted); }
.editorial-figure figcaption a { text-decoration:underline; text-underline-offset:4px; }
.channel-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-16); }
.channel-column { min-width:0; }
.channel-column h4 { margin:0; font-size:var(--type-body); }
.channel-column .figure-budget { margin:var(--space-8) 0 var(--space-20); font-size:var(--type-label); color:var(--color-muted); }
.channel-column dl { margin:0; }
.channel-column dl>div { border-top:1px solid var(--color-border); padding:var(--space-12) 0; }
.channel-column dt { font-size:var(--type-control); line-height:1.4; }
.channel-column dd { margin:var(--space-8) 0 0; font-size:var(--type-result); color:var(--color-ink); }
.channel-column .channel-outcome { border-top:3px solid var(--color-ink); }
.channel-column .channel-outcome-best { border-top-color:var(--color-accent); }
.metric-bars { display:grid; gap:var(--space-24); }
.metric-bar-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--space-8); font-size:var(--type-control); }
.metric-bar-row strong { font-size:var(--type-body); white-space:nowrap; }
.metric-bar-track { grid-column:1/-1; height:var(--space-32); }
.metric-bar { display:block; height:100%; width:var(--bar-share); background:var(--color-accent); }
.metric-bar-plan { background:var(--color-ink); }
.reading .figure-flow { list-style:none; padding:0; margin:0; }
.figure-flow li { position:relative; padding-left:var(--space-24); border-left:1px solid var(--color-border); padding-bottom:var(--space-24); }
.reading .figure-flow li+li { margin:0; }
.figure-flow li::before { content:""; width:var(--space-8); height:var(--space-8); background:var(--color-accent); position:absolute; top:var(--space-8); left:-4px; }
.figure-flow li:last-child { padding-bottom:0; }
.figure-flow strong,.figure-flow span,.figure-flow small { display:block; }
.figure-flow strong { font-size:var(--type-body); color:var(--color-ink); }
.figure-flow span { font-size:var(--type-control); margin-top:var(--space-8); line-height:1.5; }
.figure-flow small { font-size:var(--type-label); color:var(--color-muted); margin-top:var(--space-12); line-height:1.5; }
.launch-phases { display:grid; gap:var(--space-32); }
.launch-phases .phase-label { font-size:var(--type-label); padding-bottom:var(--space-16); margin-bottom:var(--space-24); border-bottom:3px solid var(--color-accent); color:var(--color-ink); }
.launch-result strong { display:block; font-size:var(--type-section); line-height:1.1; color:var(--color-ink); }
.launch-result span,.launch-phases .figure-detail { font-size:var(--type-control); line-height:1.5; }
.launch-phases .figure-detail { margin-top:var(--space-24); }
@media(min-width:600px) {
  .channel-grid { gap:var(--space-32); }
  .launch-phases { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
}
.article-next-step>a { display:inline-block; margin-top:var(--space-24); padding-bottom:var(--space-8); border-bottom:1px solid var(--color-ink); font-size:var(--type-control); }
.related { margin:var(--section-gap) 0 0; }
.related>h2 { font-size:var(--type-section); line-height:1.05; margin-bottom:var(--space-48); }
.related-all { display:inline-flex; align-items:center; gap:var(--space-8); margin-top:var(--space-32); min-height:44px; font-size:var(--type-control); }
.journal-article .article-heading { margin-block:var(--space-32); padding-bottom:var(--space-32); border-bottom:1px solid var(--color-border); }
.journal-article .article-aside details { border-top:0; }
.journal-article .reading-summary { margin-top:0; }
@media(max-width:1099px) {
  .article-aside { width:100%; max-width:700px; margin-inline:auto; }
  .article-heading,.article-main>.breadcrumbs { max-width:700px; }
}
@media(max-width:599px) {
  .journal-article,.case-article { --page-gutter:var(--space-20); }
  .journal-article .article-heading { margin-block:var(--space-32); padding-bottom:var(--space-24); }
  .journal-article .article-heading h1 { line-height:1.15; }
  .journal-article .article-meta { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--space-12); }
  .journal-article .article-meta .article-author { grid-column:1/-1; }
  .journal-article .article-meta time { grid-column:1; }
  .journal-article .copy-link { grid-column:2; grid-row:2/4; }
  .journal-article .copy-status:empty { display:none; }
  .journal-article .article-meta .copy-status { grid-column:1/-1; }
  .article-aside details { padding-block:var(--space-8); }
  .article-aside nav { gap:var(--space-8); margin-block:var(--space-8) var(--space-16); }
  .article-aside a { display:flex; align-items:center; min-height:44px; }
  .material { flex-wrap:wrap; }
  .material>span:not(.material-format) { flex:1; min-width:0; }
  .material-format { margin-left:var(--space-32); }
}
@media(min-width:600px) {
  .journal-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .journal-back { display:flex; gap:var(--space-12); align-items:center; font-size:var(--type-control); }
}
@media(min-width:1100px) {
  .journal-header { flex-wrap:nowrap; }
  .journal-header nav { order:0; width:auto; gap:var(--space-40); }
  .journal-intro { padding:var(--space-80) 0; }
  .journal-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .materials { grid-template-columns:1fr 2fr; gap:var(--space-64); }
  .article-layout { grid-template-columns:240px minmax(0,700px); gap:var(--space-64); justify-content:center; }
  .article-aside>details { position:sticky; top:calc(var(--topbar-h) + var(--space-24)); }
  .article-heading { margin-block:var(--space-64); }
  .related .journal-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(prefers-reduced-motion:reduce) { .journal * { transition:none!important; scroll-behavior:auto!important; } }
@media print {
  .journal { padding-top:0; }
  .topbar,.nav-backdrop,.site-footer,.journal-footer,.article-aside,.related,.copy-link,.copy-status,.article-next-step,.skip { display:none; }
  .article-layout { display:block; }
  .reading { max-width:none; font-size:var(--type-control); }
  .reading section { margin-top:var(--space-32); }
  .reading :is(h2,h3,h4) { break-after:avoid; }
  .reading figure { break-inside:avoid; }
  .article-cover { max-height:220px; object-fit:contain; }
}

/* Inner pages follow the home page rhythm: one section gap before the footer. */
.journal .site-footer { margin-top:var(--section-gap); }
.case-archive .journal-tools { margin-bottom:var(--space-48); }
.case-archive [data-case-hidden] { display:none!important; }
.case-archive .case-card-grid:not(:has(.case-tile:not([data-case-hidden]))) { display:none; }

/* Six short chapters give the reader a route without a second scrollbar. */
.journal-article .article-aside nav { gap:var(--space-8); }
.journal-article .article-aside a { display:flex; align-items:center; min-height:44px; padding-block:var(--space-8); }
@media(min-width:1100px) and (max-height:700px) {
  .journal-article .article-aside>details { position:static; }
}
.reading .reading-subsection { margin-top:var(--space-40); scroll-margin-top:calc(var(--topbar-h) + var(--space-24)); }
.reading-chapter>.reading-subsection:first-of-type { margin-top:0; }
.reading-summary ul { margin:0; padding-left:var(--space-24); }
.reading-summary li+li { margin-top:var(--space-12); }
.reading .reading-note { padding:var(--space-24); margin-block:var(--space-32); border-left:3px solid var(--color-accent); background:var(--color-surface); }
.reading .reading-subsection>h3 { font-size:var(--type-result); line-height:1.25; margin-bottom:var(--space-20); }
.reading .reading-subsection h4 { font-size:var(--type-body); line-height:1.35; margin:var(--space-24) 0 var(--space-12); }
.reading .reading-subsection :is(ul,ol):not(.figure-flow)>li>strong:first-child { display:inline; color:var(--color-ink); }
.reading .reading-subsection :is(ul,ol):not(.figure-flow)>li+li { margin-top:var(--space-16); }
.reading .figure-answer { display:flex; align-items:center; gap:var(--space-24); margin-bottom:var(--space-24); }
.figure-answer strong { font-size:var(--type-section); line-height:1; color:var(--color-ink); }
.figure-answer span { max-width:300px; font-size:var(--type-control); line-height:1.45; }
.journal-article .article-meta { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:var(--space-24); align-items:center; }
.article-meta-details { display:grid; gap:var(--space-8); }
.article-status { color:var(--color-ink); }
.article-experts { font-size:var(--type-label); color:var(--color-muted); margin-top:var(--space-20); }
.journal-article .article-meta .copy-status { grid-column:1/-1; }
.journal-article .article-meta .copy-status:empty { display:none; }
.reading .article-next-step { position:relative; overflow:hidden; isolation:isolate; padding:var(--space-40); background:var(--color-ink); color:var(--color-paper); border:0; }
.article-cta-grid { position:absolute; inset:0; width:100%; height:100%; color:var(--color-studio-rule); z-index:-1; pointer-events:none; }
.reading .article-next-step h2 { color:var(--color-paper); max-width:540px; }
.reading .article-next-step p { color:var(--color-paper); max-width:540px; }
.article-next-step :is(h2,p) { background:var(--color-ink); box-shadow:0 0 0 var(--space-8) var(--color-ink); }
.reading .article-next-step .article-cta-button { display:inline-flex; justify-content:center; align-items:center; min-height:52px; padding:var(--space-16) var(--space-24); margin-top:var(--space-32); border:1px solid var(--color-paper); border-radius:var(--radius-control); font-size:var(--type-control); line-height:1.25; text-align:center; text-decoration:none; }
.article-next-step .article-cta-button::after { content:none; }
.article-next-step .article-cta-button .ui-link-label { background:none; padding:0; }
@media(max-width:599px) {
 .journal-article .article-meta { grid-template-columns:minmax(0,1fr) auto; gap:var(--space-20) var(--space-12); }
 .journal-article .article-meta .article-author { grid-column:1; }
 .journal-article .article-meta .copy-link { grid-column:2; grid-row:1; }
 .article-meta-details { grid-column:1/-1; }
 .reading .article-next-step { padding:var(--space-24); }
 .article-next-step .article-cta-button { width:100%; }
 .reading .figure-answer { align-items:flex-start; flex-direction:column; gap:var(--space-16); }
}

/* Short list labels stay with their explanation; extended answers use semantic rows. */
.reading-anchor { display:block; height:0; scroll-margin-top:calc(var(--topbar-h) + var(--space-24)); }
.reading .reading-worksheet { margin:var(--space-32) 0; border-top:1px solid var(--color-border); }
.reading-worksheet>div { display:grid; grid-template-columns:180px minmax(0,1fr); gap:var(--space-24); padding:var(--space-20) 0; border-bottom:1px solid var(--color-border); }
.reading-worksheet dt { color:var(--color-ink); font-weight:500; }
.reading-worksheet dd { margin:0; }
.reading .example-label { margin:0 0 var(--space-12); color:var(--color-muted); font-size:var(--type-label); }
.reading-example .example-label+h3 { margin-top:0; }
@media(max-width:767px) { .reading-worksheet>div { grid-template-columns:1fr; gap:var(--space-8); } }
