/* The personal records use the same notebook, with mounted photographs. */
.journal-hero .container, .journal-container, .journal-page .article-layout { max-width: 800px; }
.journal-hero { padding-block: clamp(32px, 6vw, 72px); }
.journal-hero h1 { font-size: clamp(2rem, 6vw, 3.25rem); }
.journal-tagline { margin-block: 20px; color: var(--ink-2); font-family: var(--hand); font-size: clamp(1.15rem, 3vw, 1.45rem); }
.journal-context, .journal-date { color: var(--muted); font-size: .85rem; }
.journal-list { display: grid; gap: 32px; padding: 0; margin: 28px 0; list-style: none; }
.journal-card { position: relative; display: grid; border: 1px solid var(--line); border-radius: var(--radius); background: #f5f1e1; color: var(--ink); text-decoration: none; box-shadow: var(--shadow-s); }
.journal-card::before { content: ""; position: absolute; z-index: 1; top: -12px; left: 36px; width: 80px; height: 24px; background: #cddbcab3; transform: rotate(-5deg); pointer-events: none; }
.journal-card:hover { border-color: var(--accent); box-shadow: var(--shadow-m); }
.journal-card img { width: calc(100% - 48px); height: 300px; justify-self: center; align-self: center; object-fit: contain; margin: 28px 24px; padding: 10px 10px 24px; border: 1px solid #d7d2c3; background: #fffef9; box-shadow: 2px 4px 10px #574b3417; transform: rotate(-3deg); }
.journal-card-copy { align-self: center; padding: 24px; }
.journal-card-copy h3 { font-size: 1.2rem; }
.journal-card-copy p:last-child { margin-bottom: 0; color: var(--ink-2); }
.journal-page.article-page::before { display: none; }
.journal-page .prose figure img { max-height: none; padding: 12px 12px 28px; border-radius: 2px; box-shadow: var(--shadow-m); }
.journal-page .article-layout { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 700px) { .journal-card { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); } }