/* Blog styles shared by all copies of blog.html and blog-detail.html. */
.journal { --ink:#212933; --muted:#526681; --paper:#f2f5f8; --accent:#28466e; color:var(--ink); background:var(--paper); padding:70px 0 85px; }
.journal * { box-sizing:border-box; }
.journal [hidden] { display:none !important; }
.journal a { color:var(--accent); }
.journal a:hover { color:#15273e; }
.journal a:focus-visible,.journal button:focus-visible { outline:3px solid #dc9239; outline-offset:4px; }
.journal-intro-block { max-width:760px; margin-bottom:38px; }
.journal-kicker { color:var(--accent); font-weight:700; font-size:12px; text-transform:uppercase; letter-spacing:1.8px; margin:0 0 14px; }
.journal-intro-block h1 { font-size:44px; line-height:1.15; text-transform:none; margin:0 0 18px; }
.journal-intro-block p:last-child { font-size:18px; line-height:1.7; color:var(--muted); }
.journal-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.journal-card { min-width:0; background:#fff; border:1px solid #dae0e8; display:flex; flex-direction:column; }
.journal-cover { display:block; background:#dfe4ea; overflow:hidden; }
.journal-cover img { display:block; width:100%; aspect-ratio:4/3; object-fit:contain; transition:transform .25s; }
.journal-cover:hover img { transform:scale(1.025); }
.journal-card-content { padding:25px; display:flex; flex-direction:column; flex:1; }
.journal-card h2 { font-size:22px; line-height:1.35; margin:0 0 14px; text-transform:none; }
.journal-card h2 a { color:var(--ink); }
.journal-card-content>p:not(.journal-kicker) { color:var(--muted); font-size:15px; line-height:1.8; }
.journal-read { margin-top:auto; padding-top:20px; font-weight:700; }
.journal-read span { margin-left:8px; }
.journal-article,.journal-discussion { max-width:850px; margin:auto; }
.journal-back { display:inline-block; margin-bottom:32px; }
.journal-article h1 { font-size:46px; line-height:1.2; text-transform:none; margin:0 0 20px; }
.journal-byline { color:var(--muted); font-size:13px; }
.journal-intro { font-size:21px; line-height:1.8; margin:25px 0 35px; }
.journal-hero { margin:0 0 40px; background:#dfe4ea; }
.journal-hero img { display:block; width:100%; max-height:610px; object-fit:contain; }
.journal-hero figcaption { padding:16px 22px; font-size:12px; font-weight:700; letter-spacing:.5px; }
.journal-prose h2 { font-size:28px; line-height:1.3; text-transform:none; margin:30px 0 16px; }
.journal-prose p { font-size:18px; line-height:1.9; }
.journal-question { background:#dce4ef; border-left:4px solid #3c6191; padding:28px; margin:32px 0; }
.journal-question span { color:var(--accent); font-size:12px; text-transform:uppercase; letter-spacing:1px; }
.journal-question p { margin:10px 0; font-weight:700; }
.journal-prose .journal-editorial { color:var(--muted); font-size:13px; }
.journal-button,.journal-form button[type=submit] { display:inline-block; background:var(--accent); color:#fff; padding:15px 24px; border:0; font-weight:700; cursor:pointer; text-transform:none; }
.journal-button:hover { color:#fff !important; background:#1c314c; }
.journal-follow { margin:45px 0; padding:25px 0; border-top:1px solid #ced6e0; border-bottom:1px solid #ced6e0; }
.journal-follow h2 { font-size:20px; text-transform:none; margin:0 0 18px; }
.journal-socials { display:flex; flex-wrap:wrap; gap:10px 22px; }
.journal-socials a { font-size:14px; }
.journal-discussion h2 { font-size:28px; text-transform:none; }
.journal-note { color:var(--muted); font-size:13px; }
.journal-comments { list-style:none; padding:0; margin:28px 0; }
.journal-comment { display:flex; gap:16px; padding:24px 0; border-bottom:1px solid #d6dde5; scroll-margin-top:30px; }
.journal-reply { margin-left:34px; border-left:2px solid #d6dde5; padding-left:20px; }
.journal-avatar { flex:0 0 42px; width:42px; height:42px; display:grid; place-items:center; background:#d4dde9; border-radius:50%; font-weight:700; }
.journal-comment-text { min-width:0; flex:1; }
.journal-comment-meta { display:flex; flex-wrap:wrap; gap:8px 18px; }
.journal-comment-meta span { font-size:12px; color:var(--muted); }
.journal-comment-body { margin:12px 0; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.8; }
.journal-reply-to { font-size:12px; margin:8px 0; color:var(--muted); }
.journal-reply-button,#cancel-reply,#retry-comments { background:none; border:0; padding:5px 0; color:var(--accent); cursor:pointer; text-decoration:underline; text-transform:none; }
.journal-form { background:#fff; padding:30px; border:1px solid #d6dde5; }
.journal-form h3 { font-size:23px; text-transform:none; margin:0 0 20px; }
.journal-form label { display:block; margin:20px 0 8px; font-weight:700; }
.journal-form input,.journal-form textarea { display:block; width:100%; padding:13px; border:1px solid #9eadc1; border-radius:0; background:#fff; color:var(--ink); }
.journal-form input { max-width:440px; }
.journal-form textarea { min-height:160px; resize:vertical; }
.journal-form button[type=submit] { margin-top:20px; }
.journal-form button:disabled { opacity:.6; cursor:wait; }
#comment-status { margin:15px 0; min-height:24px; font-weight:600; }
.journal-related { margin-top:65px; padding-top:35px; border-top:1px solid #ced6e0; }
.journal-related>h2 { margin-bottom:26px; font-size:28px; text-transform:none; }
@media(max-width:991px) { .journal-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .journal { padding:40px 0; } .journal-grid { grid-template-columns:1fr; } .journal-intro-block h1,.journal-article h1 { font-size:32px; } .journal-intro { font-size:18px; } .journal-form { padding:20px; } .journal-reply { margin-left:12px; padding-left:12px; } .journal-avatar { flex-basis:32px; height:32px; } }

