/* Journal layout inherits the shared site theme; header and footer use shared styles. */
.blog-page{--journal-bg:var(--bg);--journal-text:var(--fg);--journal-muted:var(--muted);--journal-accent:var(--ac);--journal-gold:var(--ac);--journal-ink:var(--bg);--journal-line:var(--line);background:var(--journal-bg);color:var(--journal-text);padding:30px 0 40px;font-family:'Space Grotesk',system-ui,sans-serif}
.blog-page .journal-masthead{display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid var(--journal-line);padding-bottom:18px;font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.blog-page .journal-masthead p{margin:0;font-weight:700}.blog-page .journal-masthead p span{margin:0 12px;color:var(--journal-accent)}
.blog-page .journal-masthead>span{color:var(--journal-muted)}
.blog-page .journal-disclosure{font-size:11px;line-height:1.7;color:var(--journal-muted);margin:15px 0 26px;max-width:80em}
.blog-page .journal-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:56px;align-items:start;margin-top:26px}
.blog-page .journal-grid>section{padding:0;min-width:0}
.blog-page :is(h1,h2){font-family:Fraunces,Georgia,serif;text-transform:none;letter-spacing:-.035em;overflow-wrap:anywhere}
.blog-page .journal-feature{border-radius:24px;background:var(--journal-gold);color:var(--journal-ink);transition:transform .3s,box-shadow .3s}
.blog-page .journal-feature-link{display:flex;flex-direction:column;gap:24px;min-height:540px;padding:36px;border-radius:inherit}
.blog-page .journal-feature-meta{font-size:12px;line-height:1.7;text-transform:uppercase;letter-spacing:.16em;font-weight:500}
.blog-page .journal-feature h2{font-size:clamp(38px,3.65vw,52px);font-weight:800;line-height:1.02;margin:0}
.blog-page .journal-cover{display:block;width:100%;height:140px;border-radius:12px;overflow:hidden;margin-top:auto}
.blog-page .journal-cover img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 55%}
.blog-page .journal-feature-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.blog-page .journal-read{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:14px;font-weight:700;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.blog-page .journal-arrow{display:inline-block;transition:transform .3s}
.blog-page .journal-draft{font-size:12px;font-weight:500;line-height:1.6}
.blog-page .journal-heading{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:20px}
.blog-page .journal-heading h1{font-size:clamp(44px,4.3vw,60px);font-weight:800;line-height:1;margin:0}
.blog-page #story-count{font-size:14px;color:var(--journal-muted);white-space:nowrap}
.blog-page .journal-item{border-bottom:1px solid var(--journal-line)}
.blog-page .journal-row{position:relative;display:grid;grid-template-columns:76px minmax(0,1fr) auto;gap:18px;align-items:center;padding:14px 12px 14px 0;border-radius:12px;transition:background .25s}
.blog-page .journal-row>*{transition:transform .25s;min-width:0}
.blog-page .journal-thumb{display:block;width:76px;height:76px;border-radius:12px;overflow:hidden}
.blog-page .journal-thumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .25s}
.blog-page .journal-cover img.journal-fallback,.blog-page .journal-thumb img.journal-fallback{object-fit:contain;padding:12px;background:var(--card)}
.blog-page .journal-row-copy{display:flex;flex-direction:column;align-items:start;gap:5px}
.blog-page .journal-row h2{font-size:21px;line-height:1.2;font-weight:600;margin:0;transition:color .25s}
.blog-page .journal-row-draft{font-size:12px;line-height:1.5;color:var(--journal-muted)}
.blog-page .journal-time{font-size:13px;color:var(--journal-muted);white-space:nowrap}
.blog-page .journal-more{min-height:44px;margin-top:22px;padding:10px 24px;font-size:13px;border-color:var(--journal-line);color:var(--journal-text)}
.blog-page .journal-more:hover{background:var(--journal-accent);border-color:var(--journal-accent);color:var(--journal-ink)}
.blog-page .journal-empty{font-size:16px;line-height:1.6;color:var(--journal-muted);padding:32px 0;border-top:1px solid var(--journal-line);margin:0}
.blog-page .journal-route-note,.blog-page .journal-noscript{font-size:12px;line-height:1.7;color:var(--journal-muted);margin:28px 0 0}
.blog-page :focus-visible{outline:3px solid var(--journal-accent);outline-offset:4px}
.blog-page .journal-feature-link:focus-visible{outline-color:var(--journal-ink);outline-offset:-7px}
.blog-page .journal-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.blog-page .journal-reveal{animation:journal-enter .5s var(--e) both;animation-delay:var(--delay,0ms);animation-play-state:paused}
.blog-page .journal-reveal.is-visible{animation-play-state:running}
@keyframes journal-enter{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@media(hover:hover) and (pointer:fine){
  .blog-page .journal-feature:hover{transform:translateY(-6px);box-shadow:0 18px 42px #0004}
  .blog-page .journal-feature:hover .journal-arrow{transform:translateX(6px)}
  .blog-page .journal-row:hover{background:rgba(255,255,255,.04)}
  .blog-page .journal-row:hover>.journal-thumb,.blog-page .journal-row:hover>.journal-row-copy{transform:translateX(12px)}
  .blog-page .journal-row:hover h2{color:var(--journal-accent)}
  .blog-page .journal-row:hover img{transform:scale(1.05)}
}
.blog-page .journal-row:focus-visible{background:rgba(255,255,255,.04)}
.blog-page .journal-row:focus-visible>.journal-thumb,.blog-page .journal-row:focus-visible>.journal-row-copy{transform:translateX(12px)}
.blog-page .journal-row:focus-visible h2{color:var(--journal-accent)}
.blog-page .journal-row:focus-visible img{transform:scale(1.05)}
.blog-page .journal-feature-link:focus-visible .journal-arrow{transform:translateX(6px)}
@media(max-width:1200px) and (min-width:1024px){.blog-page .journal-grid{gap:36px}.blog-page .journal-feature-link{padding:30px}.blog-page .journal-row{gap:14px}}
@media(max-width:1023px){.blog-page .journal-grid{grid-template-columns:minmax(0,1fr);gap:36px}.blog-page .journal-feature-link{min-height:360px;padding:26px;gap:20px}.blog-page .journal-feature h2{font-size:clamp(36px,4.5vw,46px);max-width:18em}.blog-page .journal-cover{height:150px}.blog-page .journal-heading h1{font-size:52px}}
@media(max-width:639px){.blog-page{padding:22px 0 32px}.blog-page .journal-masthead{font-size:10px;letter-spacing:.1em;gap:12px}.blog-page .journal-masthead>span{max-width:90px;text-align:right;line-height:1.6}.blog-page .journal-disclosure{margin-bottom:22px}.blog-page .journal-feature h2{font-size:clamp(32px,8.6vw,40px)}.blog-page .journal-feature-meta{font-size:10px;letter-spacing:.1em}.blog-page .journal-feature-link{min-height:360px}.blog-page .journal-cover{height:120px}.blog-page .journal-heading h1{font-size:46px}.blog-page .journal-row{grid-template-columns:64px minmax(0,1fr);column-gap:14px;row-gap:5px;padding-right:12px}.blog-page .journal-thumb{width:64px;height:64px;grid-column:1;grid-row:1/3;align-self:start}.blog-page .journal-row-copy{grid-column:2;grid-row:1}.blog-page .journal-row h2{font-size:clamp(18px,4.8vw,21px)}.blog-page .journal-time{grid-column:2;grid-row:2;font-size:12px}.blog-page .journal-row-draft{font-size:12px}.blog-page .journal-more{width:100%;justify-content:center}.blog-page .journal-row:hover>.journal-thumb,.blog-page .journal-row:hover>.journal-row-copy,.blog-page .journal-row:focus-visible>.journal-thumb,.blog-page .journal-row:focus-visible>.journal-row-copy{transform:translateX(6px)}}
@media(prefers-reduced-motion:reduce){.blog-page .journal-reveal{animation:none}.blog-page *,.blog-page *::before,.blog-page *::after{transition:none}.blog-page .journal-feature:hover,.blog-page .journal-row:hover>.journal-thumb,.blog-page .journal-row:hover>.journal-row-copy,.blog-page .journal-row:focus-visible>.journal-thumb,.blog-page .journal-row:focus-visible>.journal-row-copy,.blog-page .journal-row:hover img,.blog-page .journal-row:focus-visible img,.blog-page .journal-feature:hover .journal-arrow,.blog-page .journal-feature-link:focus-visible .journal-arrow{transform:none}}

/* Reserve the featured card and article rows while API requests are pending. */
.blog-page .journal-skeleton{pointer-events:none;user-select:none}
.blog-page .journal-skeleton.journal-feature{background:var(--card);color:var(--journal-muted);box-shadow:none;transform:none}
.blog-page .journal-skeleton-block{display:block;width:100%;height:20px;border-radius:6px;background:linear-gradient(100deg,var(--journal-line) 20%,color-mix(in srgb,var(--journal-muted) 24%,transparent) 45%,var(--journal-line) 70%);background-size:200% 100%;animation:journal-shimmer 1.6s ease-in-out infinite}
.blog-page .journal-skeleton-title{display:grid;gap:12px}
.blog-page .journal-skeleton-title .journal-skeleton-block{height:44px}
.blog-page .journal-skeleton .journal-skeleton-short{width:65%}
.blog-page .journal-skeleton .journal-skeleton-meta{width:35%;height:12px}
.blog-page .journal-skeleton .journal-cover{height:140px;border-radius:12px}
.blog-page .journal-skeleton .journal-row-copy{width:100%;gap:10px}
.blog-page .journal-skeleton .journal-thumb{width:76px;height:76px;border-radius:12px}
.blog-page .journal-skeleton .journal-row{grid-template-columns:76px minmax(0,1fr)}
@keyframes journal-shimmer{from{background-position:200% 0}to{background-position:-200% 0}}
@media(max-width:1023px){.blog-page .journal-skeleton .journal-cover{height:150px}}
@media(max-width:639px){.blog-page .journal-skeleton .journal-cover{height:120px}.blog-page .journal-skeleton-title .journal-skeleton-block{height:32px}.blog-page .journal-skeleton .journal-thumb{width:64px;height:64px}.blog-page .journal-skeleton .journal-row{grid-template-columns:64px minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.blog-page .journal-skeleton-block{animation:none}}