/* RENOVA Field Journal — what the design needs once it lists real posts: topics as links, entry titles and
   labels from post data, pagination, the compact header, search, the empty state and the not-found page.
   Loaded after journal.css. */

.journal-sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.journal-page :is(h1,h2,h3){overflow-wrap:break-word}

/* ---- Topics: real categories, linked to their archives ---- */
.journal-topic-track a{flex:0 0 clamp(165px,17vw,260px);scroll-snap-align:start;display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:76px;padding:12px 20px;border-right:1px solid var(--brand-line);color:var(--brand-muted);font-size:12px;line-height:1.35;transition:background .35s,color .35s}
.journal-topic-track a:first-child{border-left:1px solid var(--brand-line)}
.journal-topic-track a small{font-size:9px;letter-spacing:.06em;font-variant-numeric:tabular-nums;color:var(--brand-accent)}
.journal-topic-track a[aria-current=page],.journal-topic-track a:hover{background:var(--brand-ink);color:var(--brand-paper-soft)}
.journal-topic-track a[aria-current=page] small,.journal-topic-track a:hover small{color:#d7ddce}
.journal-page .journal-topic-track a:focus-visible{outline-offset:-5px}
/* Every topic stays in view on wide screens; narrower ones keep the design's swipeable track. */
@media(min-width:1101px){.journal-topic-track a{flex:1 1 165px;min-width:132px}}

/* ---- Search ---- */
.journal-search{display:grid;grid-template-columns:auto minmax(0,400px);justify-content:end;align-items:center;gap:10px 28px;margin:34px 0 0}
.journal-search label{font-size:9px;line-height:1.4;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-accent)}
.journal-search>div{display:flex;align-items:stretch;border-bottom:1px solid var(--brand-ink);transition:box-shadow .25s}
.journal-search>div:focus-within{box-shadow:0 1px 0 var(--brand-ink)}
.journal-search input{flex:1;min-width:0;margin:0;padding:13px 0;border:0;border-radius:0;outline:0;background:transparent;color:var(--brand-ink);font:inherit;font-size:14px;-webkit-appearance:none;appearance:none}
.journal-search input::placeholder{color:var(--brand-muted);opacity:.75}
.journal-search input::-webkit-search-cancel-button{-webkit-appearance:none}
.journal-search button{display:inline-flex;align-items:center;gap:14px;min-height:44px;padding:0 0 0 20px;border:0;background:transparent;color:var(--brand-ink);font-size:11px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.journal-search button .arrow-icon{font-size:16px;color:var(--brand-accent);transition:transform .3s}
.journal-search button:hover .arrow-icon{transform:translate(2px,-2px)}

/* ---- Lead entry ---- */
.journal-feature-image>a{display:block;height:100%;overflow:hidden}
.journal-feature-image img{transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.journal-feature-image>a:hover img{transform:scale(1.02)}
.journal-feature h2 a,.journal-card h3 a{transition:color .3s}
.journal-feature h2 a:hover,.journal-card h3 a:hover{color:var(--brand-accent)}
/* Post titles run longer than the design's sample headline. */
.journal-feature h2.is-long{font-size:clamp(40px,4.1vw,64px);line-height:1.03}
.journal-feature dd a{border-bottom:1px solid var(--brand-line);transition:border-color .25s}
.journal-feature dd a:hover{border-bottom-color:var(--brand-ink)}
.journal-meta a:hover{color:var(--brand-ink)}

/* ---- Cards: the label is real markup (number / date) rather than generated content ---- */
.journal-card:before{content:none}
.journal-card-stage{position:absolute;left:0;top:15px;font-size:9px;line-height:1.4;letter-spacing:.15em;text-transform:uppercase;color:#756850}
.journal-image-blank,.journal-card-image:hover .journal-image-blank,.journal-feature-image>a:hover .journal-image-blank{object-fit:contain!important;padding:0 27%;opacity:.5;transform:none!important}

/* ---- Notes without the index page's large intro ---- */
.journal-notes-plain{padding-top:90px}
.journal-notes-plain>.journal-section-head{margin-bottom:55px;padding-bottom:22px;border-bottom:1px solid var(--brand-line)}
.journal-notes-plain>.journal-section-head span{display:block}
.journal-section-head h2{margin:0;font:inherit;letter-spacing:inherit}

/* ---- Pagination ---- */
.journal-pagination{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;margin-top:96px;padding:20px 0;border-top:1px solid var(--brand-ink);border-bottom:1px solid var(--brand-line)}
.journal-pagination ol{display:flex;align-items:center;gap:4px;margin:0;padding:0;list-style:none}
.journal-pagination li>:is(a,span){display:grid;place-items:center;min-width:44px;height:44px;padding:0 8px;border:1px solid transparent;color:var(--brand-muted);font-size:12px;letter-spacing:.06em;font-variant-numeric:tabular-nums;transition:border-color .25s,color .25s,background .25s}
.journal-pagination li>a:hover{border-color:var(--brand-ink);color:var(--brand-ink)}
.journal-pagination li>[aria-current]{background:var(--brand-ink);color:var(--brand-paper-soft)}
.journal-pagination-gap{padding:0 2px;color:var(--brand-accent);font-size:12px}
.journal-pagination-step{display:inline-flex;align-items:center;gap:16px;min-height:44px;font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.journal-pagination-step.is-next{justify-self:end}
.journal-pagination-step .arrow-icon{font-size:17px;color:var(--brand-accent);transition:transform .3s}
a.journal-pagination-step:hover .arrow-icon{transform:translateX(-4px)}
a.journal-pagination-step.is-next:hover .arrow-icon{transform:translateX(4px)}
.journal-page .journal-pagination a:focus-visible{outline-offset:2px}

/* ---- Compact header: archives, search results, later pages of the index ---- */
.journal-masthead,.journal-lost{position:relative;padding:112px 4.6vw 0;background:var(--journal-hero-surface,#f2eee8)}
.journal-crumbs{display:flex;flex-wrap:wrap;gap:4px 10px}
.journal-hero-top .journal-crumbs span{display:inline!important}
.journal-crumbs a{transition:color .25s}
.journal-crumbs a:hover{color:var(--brand-ink)}
.journal-crumbs [aria-current]{color:var(--brand-muted)}
.journal-masthead-body{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr);align-items:end;gap:clamp(40px,7vw,130px);padding:clamp(56px,7vw,104px) 0 clamp(40px,4.4vw,64px)}
.journal-masthead h1{margin:0;font-size:clamp(46px,6vw,100px);font-weight:400;line-height:.96;letter-spacing:-.06em;text-wrap:balance}
.journal-masthead h1 em,.journal-lost h1 em{font-family:var(--serif);font-weight:400;color:var(--brand-accent)}
.journal-masthead-side p{max-width:430px;margin:0;color:var(--brand-muted);font-size:15px;line-height:1.7}
.journal-masthead-side .journal-masthead-count{margin-top:22px;padding-top:16px;border-top:1px solid var(--brand-line);color:var(--brand-accent);font-size:10px;line-height:1.4;letter-spacing:.14em;text-transform:uppercase}
.journal-masthead-side .journal-masthead-count:first-child{margin-top:0}
.journal-masthead-count strong{margin-right:10px;color:var(--brand-ink);font-family:var(--serif);font-size:30px;font-weight:400;letter-spacing:-.02em;vertical-align:-.12em}

/* ---- Empty state ---- */
.journal-void{padding:110px clamp(24px,4.6vw,76px) 130px;border-bottom:1px solid var(--brand-line)}
.journal-void h2{max-width:900px;margin:0 0 26px;font-size:clamp(42px,5vw,80px);font-weight:400;line-height:1;letter-spacing:-.055em;text-wrap:balance}
.journal-void>p:not(.journal-kicker){max-width:540px;margin:0 0 44px;color:var(--brand-muted);font-size:16px;line-height:1.75}
.journal-void-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(24px,4vw,60px);max-width:1100px}
.journal-void-links a{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:16px 0;border-bottom:1px solid var(--brand-ink);font-size:12px}
.journal-void-links .arrow-icon,.journal-lost-links .arrow-icon{font-size:17px;color:var(--brand-accent);transition:transform .3s}
.journal-void-links a:hover .arrow-icon,.journal-lost-links a:hover .arrow-icon{transform:translate(3px,-3px)}

/* ---- Not found ---- */
.journal-lost{padding-bottom:clamp(70px,8vw,120px)}
.journal-lost-body{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:40px;padding:clamp(56px,7vw,110px) 0 clamp(50px,6vw,90px)}
.journal-lost h1{margin:0 0 34px;font-size:clamp(52px,7vw,118px);font-weight:400;line-height:.92;letter-spacing:-.065em}
.journal-lost-body>div>p:not(.journal-kicker){max-width:470px;margin:0;color:var(--brand-muted);font-size:16px;line-height:1.7}
.journal-lost .journal-search{grid-template-columns:minmax(0,470px);justify-content:start}
.journal-lost-mark{margin:0 0 -.04em;color:transparent;font-size:clamp(150px,20vw,330px);font-weight:700;line-height:.76;letter-spacing:-.03em;-webkit-text-stroke:1px rgba(117,104,80,.45);user-select:none}
.journal-lost-links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 clamp(20px,3vw,48px);border-top:1px solid var(--brand-line)}
.journal-lost-links a{display:flex;align-items:center;gap:16px;min-height:66px;padding:12px 0;border-bottom:1px solid var(--brand-line);font-size:13px;transition:border-color .25s}
.journal-lost-links a:hover{border-bottom-color:var(--brand-ink)}
.journal-lost-links b{color:var(--brand-accent);font:inherit;font-size:9px;letter-spacing:.14em}
.journal-lost-links span{flex:1}

@media(max-width:980px){
 .journal-masthead-body{grid-template-columns:1fr;gap:34px;align-items:start}
 .journal-lost-links{grid-template-columns:repeat(2,minmax(0,1fr))}
 .journal-void-links{grid-template-columns:1fr}
}
@media(max-width:760px){
 .journal-topic-track a{flex-basis:155px;min-height:66px;padding:10px 14px;font-size:11px}
 .journal-search{grid-template-columns:1fr;margin-top:26px}
 .journal-search input{font-size:16px}
 /* Labels that are now links and dates stay legible on a phone. */
 .journal-meta{font-size:9px}
 .journal-card-stage{top:14px;font-size:9px}
 .journal-feature h2.is-long{font-size:clamp(34px,9.6vw,44px);line-height:1.05}
 .journal-card h3{font-size:clamp(28px,8.4vw,36px)}
 .journal-notes-plain{padding-top:64px}
 .journal-notes-plain>.journal-section-head{margin-bottom:40px;font-size:9px}
 .journal-pagination{grid-template-columns:1fr 1fr;gap:6px 14px;margin-top:0;padding:14px 0}
 .journal-pagination ol{grid-column:1/-1;grid-row:1;justify-content:center;gap:2px;padding-bottom:12px;border-bottom:1px solid var(--brand-line)}
 .journal-pagination li>:is(a,span){min-width:40px}
 .journal-pagination li.is-far{display:none}
 .journal-masthead,.journal-lost{padding:99px 20px 0}
 .journal-masthead-body{padding:6px 0 36px}
 .journal-masthead h1{font-size:clamp(40px,12vw,60px);line-height:1}
 .journal-void{padding:70px 20px 84px}
 .journal-void h2{font-size:40px}
 .journal-lost{padding-bottom:64px}
 .journal-lost-body{grid-template-columns:1fr;gap:10px;padding:0 0 44px}
 .journal-lost h1{font-size:clamp(46px,13.5vw,64px);line-height:.96;margin-bottom:26px}
 .journal-lost-mark{order:-1;font-size:40vw;line-height:.8;margin:0 0 26px -.04em}
 .journal-lost-links{grid-template-columns:1fr}
 .journal-lost-links a{min-height:58px}
}
@media(prefers-reduced-motion:reduce){
 .journal-topic-track a,.journal-feature-image img,.journal-feature h2 a,.journal-card h3 a,.journal-pagination li>:is(a,span),.journal-page .arrow-icon,.journal-search>div{transition:none}
 .journal-feature-image>a:hover img,.journal-page a:hover .arrow-icon,.journal-search button:hover .arrow-icon{transform:none}
}
