/* /journal: the client's R41 reading surface (index + articles), generated by
   tools/journal/build.js. Our header/footer chrome comes from the shared
   Atelier V2 stack; the masthead reuses the inner-page hero grid
   (about-page.css) with a handwritten lead and the "journal" dot mark. */
.journal-page {
  --journal-ink: var(--atelier-blue, #2e3e44);
  --journal-paper: var(--atelier-beige, #fdf4e3);
  --journal-gold: var(--atelier-gold, #b59357);
  --journal-rule: rgba(181,147,87,.4);
  --journal-serif: var(--atelier-display, Georgia, serif);
  background: var(--journal-paper); color: var(--journal-ink);
}
/* Do not create an accidental body scroll container: contents uses document scroll. */
html[data-design-revision="atelier-v2"] body.journal-page:not(.nav-open):not(.modal-open) { overflow-x: clip; overflow-y: visible; }
.journal-page ::selection { background: var(--journal-gold); color: #000; }
.journal-page .journal-shell { width: min(1240px, 88%); margin: 0 auto; padding-block: clamp(132px, 11vw, 176px) 100px; }
.journal-page .journal-shell a { color: inherit; }
.journal-page .journal-shell :is(h1,h2,h3) { font-family: var(--journal-serif); font-weight: 400; letter-spacing: -.03em; text-wrap: balance; }
.journal-page .journal-shell h1 { font-size: clamp(40px, 5.8vw, 84px); line-height: 1.04; margin: 0; }
.journal-page .journal-shell h2 { font-size: clamp(26px, 2.5vw, 38px); line-height: 1.18; }
.journal-page .journal-shell p { margin-block: 0 16px; }
.journal-page .journal-masthead { padding-bottom: 42px; }
.journal-page .journal-masthead h1 { max-width: 11ch; }
/* Handwritten lead: Caveat (Latin + Cyrillic); Armenian has no Google Fonts
   handwriting face, so HY keeps Noto Sans Armenian in a light italic. */
.journal-page p.journal-script { position: relative; display: inline-block; max-width: 30ch; margin: clamp(28px, 2.8vw, 42px) 0 0; padding-bottom: 14px; color: var(--journal-ink); font: 500 clamp(28px, 2.7vw, 40px)/1.18 "Caveat", "Noto Sans Armenian", cursive; letter-spacing: .005em; transform: rotate(-1.2deg); transform-origin: left center; }
.journal-page .journal-script:lang(hy) { max-width: 30ch; font: italic 400 clamp(20px, 1.8vw, 26px)/1.45 "Noto Sans Armenian", sans-serif; transform: rotate(-.8deg); }
.journal-page .journal-swash { position: absolute; left: 0; bottom: 0; width: min(100%, 320px); height: 16px; overflow: visible; fill: none; stroke: var(--journal-gold); stroke-width: 2.4; stroke-linecap: round; }
.journal-page p.journal-intro { max-width: 44ch; margin-top: 22px; font-size: clamp(17px, 1.3vw, 19px); line-height: 1.6; color: rgba(46,62,68,.82); }
@media (prefers-reduced-motion: no-preference) {
  .journal-page .journal-script span { display: block; text-wrap: balance; clip-path: inset(0 100% 0 0); animation: journal-write 1.9s .35s cubic-bezier(.45,.05,.35,1) forwards; }
  .journal-page .journal-swash path { stroke-dasharray: 360; stroke-dashoffset: 360; animation: journal-swash .9s 2s ease-out forwards; }
}
@keyframes journal-write { to { clip-path: inset(0 0 0 0); } }
@keyframes journal-swash { to { stroke-dashoffset: 0; } }
.journal-page .journal-lead { font-size: clamp(19px, 1.65vw, 24px); line-height: 1.5; }
.journal-page .journal-filters { display: flex; flex-wrap: wrap; gap: 8px 28px; padding-block: 12px; margin-bottom: 30px; border-block: 1px solid var(--journal-rule); }
.journal-page .journal-filters[hidden], .journal-page .journal-story[hidden] { display: none; }
.journal-page .journal-filters button { position: relative; min-height: 44px; padding: 8px 0; border: 0; border-radius: 0; background: none; color: var(--journal-ink); font: 600 15px/1.4 var(--font-body); cursor: pointer; }
.journal-page .journal-filters button::after { content: ''; position: absolute; bottom: 0; inset-inline: 0; height: 2px; background: var(--journal-gold); transform: scaleX(0); transform-origin: left; }
.journal-page .journal-filters button[aria-pressed="true"]::after { transform: scaleX(1); }
.journal-page .journal-collection { display: grid; grid-template-columns: 1.38fr 1fr; gap: 38px 5%; align-items: start; }
.journal-page .journal-story { min-width: 0; }
.journal-page .journal-story--featured { grid-row: span 2; }
.journal-page .journal-story__link { display: block; text-decoration: none; }
.journal-page .journal-story__image { overflow: hidden; border-radius: 14px; background: rgba(46,62,68,.07); }
.journal-page .journal-story__image img { display: block; width: 100%; height: auto; aspect-ratio: 2.3; object-fit: cover; transition: transform 220ms cubic-bezier(.2,.7,.2,1); }
.journal-page .journal-story--featured .journal-story__image img { aspect-ratio: .94; object-position: 54% center; }
.journal-page .journal-story__copy { padding-top: 18px; }
.journal-page .journal-meta { font-size: 13px; font-weight: 600; line-height: 1.4; }
.journal-page .journal-story__copy :is(h2,h3) { margin: 0 0 12px; font-size: clamp(24px, 2.2vw, 34px); }
.journal-page .journal-story--featured h2 { font-size: clamp(30px, 3.2vw, 46px); }
.journal-page .journal-story__copy > p:not(.journal-meta) { max-width: 54ch; font-size: 16px; line-height: 1.6; }
.journal-page .journal-read, .journal-page .journal-back { display: inline-flex; align-items: center; gap: 16px; min-height: 44px; font-size: 14px; font-weight: 600; }
.journal-page .journal-read svg, .journal-page .journal-back svg { width: 22px; height: 22px; flex: none; }
.journal-page .journal-read { text-decoration: underline; text-decoration-color: var(--journal-gold); text-underline-offset: 6px; }
.journal-page .journal-collection.is-filtered { grid-template-columns: minmax(0, 760px); }
.journal-page .journal-collection.is-filtered .journal-story { grid-row: auto; }
.journal-page .journal-collection.is-filtered .journal-story__image img { aspect-ratio: 1.65; }
.journal-page .journal-conversation { display: flex; align-items: center; justify-content: space-between; gap: 40px; border-block: 1px solid var(--journal-rule); padding-block: 40px; margin-top: 88px; }
.journal-page .journal-conversation h2 { margin: 0 0 16px; }
.journal-page .journal-conversation p { max-width: 58ch; }
.journal-page .journal-conversation .primary-btn { flex: 0 0 auto; color: var(--journal-paper); }
.journal-page .journal-breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; font-size: 14px; margin-bottom: 28px; }
.journal-page .journal-breadcrumbs a { min-height: 44px; display: inline-flex; align-items: center; text-underline-offset: 5px; }
.journal-page .journal-article__header { max-width: 1020px; margin-bottom: 48px; }
.journal-page .journal-article__header h1 { font-size: clamp(38px, 4.7vw, 68px); max-width: 24ch; }
.journal-page .journal-article__header .journal-lead { max-width: 55ch; margin-top: 24px; }
.journal-page .journal-cover { margin: 0 0 64px; }
.journal-page .journal-cover img { display: block; width: 100%; height: auto; max-height: 570px; aspect-ratio: 2.1; object-fit: cover; border-radius: 14px; }
.journal-page .journal-cover figcaption { margin-top: 12px; font-size: 13px; }
.journal-page .journal-reading { display: grid; grid-template-columns: minmax(200px, .7fr) minmax(0, 2fr); gap: 8%; align-items: start; }
.journal-page .journal-contents { position: sticky; top: 112px; border-top: 1px solid var(--journal-rule); padding-top: 24px; }
.journal-page .journal-contents h2 { font: 600 16px/1.5 var(--font-body); letter-spacing: 0; margin: 0 0 16px; }
.journal-page .journal-contents ol { list-style: decimal; padding-left: 22px; margin: 0 0 24px; }
.journal-page .journal-contents li { padding-left: 8px; margin-block: 8px; font-size: 14px; }
.journal-page .journal-contents li::marker { color: var(--journal-ink); }
.journal-page .journal-contents a { display: inline-flex; align-items: center; min-height: 44px; text-decoration-color: var(--journal-rule); text-underline-offset: 4px; }
.journal-page .journal-prose { max-width: 70ch; font-size: 18px; line-height: 1.78; }
.journal-page .journal-prose section { scroll-margin-top: 112px; margin-top: 56px; }
.journal-page .journal-prose h2 { margin-block: 0 22px; font-size: clamp(27px, 2.45vw, 36px); }
.journal-page .journal-prose p { margin-bottom: 22px; }
.journal-page .journal-prose ul { margin-block: 26px; padding-left: 24px; }
.journal-page .journal-prose li { padding-left: 8px; margin-bottom: 12px; }
.journal-page .journal-prose li::marker { color: var(--journal-gold); }
.journal-page .journal-opening { font-size: 21px; line-height: 1.65; }
.journal-page .journal-takeaway { margin-top: 52px; padding-block: 28px 8px; border-block: 1px solid var(--journal-rule); }
.journal-page .journal-related { margin-top: 72px; }
.journal-page .journal-related > h2 { margin-bottom: 32px; }
.journal-page .journal-related__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5%; }
.journal-page .journal-related .journal-story__image img { aspect-ratio: 1.7; }
.journal-page .journal-skip { position: fixed; top: 12px; left: 20px; z-index: 10000; transform: translateY(-180%); background: var(--journal-paper); color: var(--journal-ink); padding: 12px 20px; border: 2px solid var(--journal-ink); }
.journal-page .journal-skip:focus { transform: none; }
.journal-page .journal-shell :is(a,button):focus-visible { outline: 2px solid var(--journal-ink); outline-offset: 5px; border-radius: 4px; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .journal-page .journal-story__link:hover img { transform: scale(1.025); }
}
@media (hover: hover) {
  .journal-page .journal-story__link:hover :is(h2,h3) { text-decoration: underline; text-decoration-thickness: 1px; text-decoration-color: var(--journal-gold); text-underline-offset: 5px; }
}
@media (max-width: 1100px) {
  .journal-page .journal-contents { position: static; }
  .journal-page .journal-reading { grid-template-columns: minmax(0, 1fr); gap: 40px; max-width: 76ch; margin-inline: auto; }
}
@media (max-width: 700px) {
  .journal-page .journal-shell { width: calc(100% - 40px); padding-block: 114px 64px; }
  .journal-page .journal-filters { gap: 4px 20px; margin-bottom: 24px; }
  .journal-page .journal-collection, .journal-page .journal-related__grid { grid-template-columns: 1fr; gap: 38px; }
  .journal-page .journal-story--featured { grid-row: auto; }
  .journal-page .journal-story__image img, .journal-page .journal-story--featured .journal-story__image img { aspect-ratio: 1.23; }
  .journal-page .journal-story__copy :is(h2,h3), .journal-page .journal-story--featured h2 { font-size: 30px; }
  .journal-page .journal-conversation { flex-direction: column; align-items: flex-start; gap: 20px; margin-top: 52px; padding-block: 32px; }
  .journal-page .journal-article__header { margin-bottom: 28px; }
  .journal-page .journal-cover { margin-bottom: 36px; }
  .journal-page .journal-cover img { aspect-ratio: 1.15; }
  .journal-page .journal-prose { font-size: 17px; line-height: 1.75; }
  .journal-page .journal-opening { font-size: 19px; }
  .journal-page .journal-prose section { margin-top: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .journal-page .journal-story__image img { transition: none; }
  .journal-page { scroll-behavior: auto; }
}