/* === Harbour & Hangar — refined journal template (scoped to .jrnl) === */
/* TYPE SCALE */
.jrnl .prose p,.jrnl .prose li{font-size:17px;line-height:1.72}
.jrnl .prose h2{font-family:var(--font-head);font-weight:500;font-size:clamp(27px,3vw,33px);line-height:1.2;letter-spacing:-.012em;margin:56px 0 16px}
.jrnl .prose h3{font-family:var(--font-sans);font-weight:600;font-size:16px;letter-spacing:.005em;text-transform:none;color:var(--ink);margin:32px 0 8px}
.jrnl .standfirst{font-family:var(--font-head);font-weight:400;font-size:clamp(21px,2.3vw,25px);line-height:1.5;color:var(--ink-2);letter-spacing:-.005em}
.jrnl .prose blockquote{font-style:italic}
/* INTRO FURNITURE — one 28px rhythm; first H2 sits tight to takeaways */
.jrnl .byline{margin:0 0 28px}
.jrnl .qanswer{margin:0 0 28px}
.jrnl .takeaways{margin:0 0 28px}
.jrnl .takeaways+h2{margin-top:0}
/* HERO — vertically centred so top gap = bottom gap */
.jrnl .hhero--article{align-items:center!important}
.jrnl .hhero--article .hhero-cap{align-self:center!important;padding-top:clamp(52px,7vh,76px)!important;padding-bottom:clamp(52px,7vh,76px)!important}
/* INLINE IMAGE — body=measure, wide=full column, inset=float */
.jrnl figure.fig{margin:44px 0;max-width:680px}
.jrnl figure.fig .ph{position:relative;aspect-ratio:3/2;background:linear-gradient(135deg,#cdd4d1,#a7b2ad);border:1px solid var(--line);overflow:hidden}
.jrnl figure.fig .ph svg{position:absolute;inset:0;width:100%;height:100%}
.jrnl figure.fig .slot{position:absolute;left:14px;bottom:12px;font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:rgba(17,17,20,.5);background:rgba(255,255,255,.72);padding:4px 8px}
.jrnl figure.fig figcaption{font-family:var(--font-mono);font-size:12px;letter-spacing:.02em;color:var(--ink-3);margin-top:10px}
.jrnl figure.fig.wide{max-width:100%}
.jrnl figure.fig.wide .ph{aspect-ratio:21/9}
.jrnl figure.fig.inset{float:right;width:300px;max-width:44%;margin:6px 0 20px 32px}
.jrnl figure.fig.inset .ph{aspect-ratio:4/5}
@media(max-width:600px){.jrnl figure.fig.inset{float:none;width:100%;max-width:none;margin:32px 0}.jrnl figure.fig.inset .ph{aspect-ratio:3/2}}
/* CLOSING CTA — serif line + solid button (replaces the mono underline) */
.jrnl .artcta{margin:48px 0 0;border-top:1px solid var(--line);padding-top:26px;display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center;justify-content:space-between;max-width:680px}
.jrnl .artcta .t{font-family:var(--font-head);font-weight:500;font-size:clamp(19px,2.2vw,22px);line-height:1.25;letter-spacing:-.01em;max-width:24ch;margin:0}
.jrnl .artcta .btn{flex:none;font-family:var(--font-mono);font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:#fff;background:var(--ink);padding:13px 20px;text-decoration:none;border:0;cursor:pointer}
.jrnl .artcta .btn:hover{background:#000}
/* SIDEBAR — primary card jazzed with a faint image overlay */
.jrnl .side-card--feature{position:relative;overflow:hidden;border-color:#0e1518;color:#fff}
.jrnl .side-card--feature .cbg{position:absolute;inset:0;background:radial-gradient(120% 100% at 80% 0,#26333a,#0c1316 70%)}
.jrnl .side-card--feature .cbg svg{position:absolute;inset:0;width:100%;height:100%;opacity:.22}
.jrnl .side-card--feature>:not(.cbg){position:relative}
.jrnl .side-card--feature h4{color:#fff}
.jrnl .side-card--feature p{color:rgba(255,255,255,.74)}
.jrnl .side-card--feature .side-cta{background:#fff!important;color:#0e1518!important;border-color:#fff!important}
/* === real images in figure slots === */
.jrnl figure.fig .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
/* === closing dual CTA — both actions, image overlay (homepage-style) === */
.jrnl .endcards{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:48px 0 0;max-width:680px}
@media(max-width:560px){.jrnl .endcards{grid-template-columns:1fr}}
.jrnl .ecta{position:relative;overflow:hidden;border:1px solid #0e1518;background:#0e1518;color:#fff;padding:22px;text-decoration:none;display:flex;flex-direction:column;justify-content:space-between;min-height:158px}
.jrnl .ecta .cbg{position:absolute;inset:0}
.jrnl .ecta .cbg img{width:100%;height:100%;object-fit:cover;opacity:.30;display:block}
.jrnl .ecta .cbg::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(14,21,24,.45),rgba(14,21,24,.85))}
.jrnl .ecta .ci{position:relative}
.jrnl .ecta .lab{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.58);margin:0 0 8px}
.jrnl .ecta h4{font-family:var(--font-head);font-weight:500;font-size:19px;line-height:1.25;color:#fff;margin:0}
.jrnl .ecta .go{position:relative;font-family:var(--font-mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:#fff;margin-top:18px}
.jrnl .ecta .go span{border-bottom:1px solid rgba(255,255,255,.45);padding-bottom:3px}
.jrnl .ecta:hover .go span{border-color:#fff}
/* hero: bring article hero back to template size (override .home .hhero 100vh) */
.jrnl .hhero.hhero--article{min-height:clamp(360px,46vh,460px)!important}
/* tighten column<->sidebar gap: hug the body column to the text measure + smaller gutter */
@media(min-width:981px){.jrnl .art-layout{grid-template-columns:minmax(0,720px) 290px!important;gap:clamp(30px,3vw,48px)!important;max-width:1080px!important;justify-content:center!important}}
.jrnl .art-main .prose,.jrnl .art-main .byline,.jrnl .art-main .qanswer,.jrnl .art-main .takeaways,.jrnl .art-main .endcards{max-width:none}
/* sidebar reading text up from 13.5 -> 15px (gentler step under 17px body) */
.jrnl .toc a{font-size:15px;line-height:1.4}
.jrnl .side-card p{font-size:15px;line-height:1.55}
/* belt-and-braces: never allow the two-column override to apply on mobile */
@media(max-width:980px){.jrnl .art-layout{grid-template-columns:1fr!important;max-width:760px!important;gap:0!important}}