/* Tamu House Journal */
.j-head{padding:clamp(2.5rem,6vw,3.75rem) 0 2rem; display:grid; gap:.8rem}
.j-head h1{font-size:clamp(2.6rem,6vw,4.2rem); line-height:1; color:var(--jungle)}
.j-head p{color:var(--ink-soft); max-width:34rem; font-size:1.2rem}
.j-filters{display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.6rem}
.j-filters button{appearance:none; background:none; cursor:pointer; color:var(--jungle); font:600 .6rem/1 var(--f-label); letter-spacing:.17em; text-transform:uppercase; padding:.6rem .9rem; border:1px solid var(--line); border-radius:20px}
.j-filters button.on{background:var(--jungle); color:var(--linen); border-color:var(--jungle)}
.j-meta{font:500 .62rem/1.4 var(--f-label); letter-spacing:.18em; text-transform:uppercase; color:var(--ink-soft)}
.j-img{display:block; border-radius:20px; overflow:hidden; background:var(--paper)}
.j-img img{display:block; width:100%; height:100%; object-fit:cover}
.j-feat{display:grid; grid-template-columns:1.35fr 1fr; gap:2.5rem; align-items:center; padding:1.5rem 0 3rem}
.j-feat .j-img{aspect-ratio:4/3}
.j-feat h2{font-size:clamp(2rem,3.6vw,2.9rem); line-height:1.05; margin:.7rem 0 1rem; color:var(--jungle)}
.j-feat h2 em, .j-card h3 em{color:var(--dark-clay)}
.j-feat p.sum{color:var(--ink-soft); font-size:1.15rem}
.j-feat a.title-link, .j-card a.title-link{color:inherit; text-decoration:none}
.j-more{display:inline-block; margin-top:1.4rem; font:600 .64rem/1 var(--f-label); letter-spacing:.2em; text-transform:uppercase; border-bottom:1px solid var(--terra); padding-bottom:.35rem; color:var(--jungle); text-decoration:none}
.j-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2.5rem 2rem; padding:3rem 0 0; border-top:1px solid var(--line)}
.j-card .j-img{aspect-ratio:4/3; margin-bottom:1rem}
.j-card h3{font-size:1.45rem; line-height:1.2; margin:.5rem 0; color:var(--jungle)}
.j-card p.sum{color:var(--ink-soft); font-size:1.05rem}
.j-list{padding-bottom:clamp(3rem,7vw,5rem)}
@media (max-width:820px){ .j-feat{grid-template-columns:1fr; gap:1.4rem} .j-grid{grid-template-columns:1fr} }

/* single post */
.p-hero{position:relative; height:min(62vh,34rem); overflow:hidden; background:var(--jungle)}
.p-hero img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 25%}
.p-hero::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(30,40,34,.15),rgba(30,40,34,.7))}
.p-hero .inner{position:absolute; bottom:2.5rem; left:0; right:0; z-index:2; color:var(--linen)}
.p-hero .j-meta{color:rgba(240,230,211,.88)}
.p-hero h1{font-size:clamp(2.2rem,5.4vw,3.9rem); line-height:1.02; margin-top:.8rem; max-width:20ch; color:var(--linen)}
.p-hero h1 em{color:#E9C9A8}
.p-body{padding-top:3rem}
.p-body > *{max-width:52rem}
.p-body .lede{font-size:1.32rem; line-height:1.55; margin-bottom:1.6rem; color:var(--ink)}
.p-content h2{font-size:1.75rem; margin:2.4rem 0 .8rem; color:var(--jungle); line-height:1.2}
.p-content h3{font-size:1.35rem; margin:1.8rem 0 .6rem; color:var(--jungle)}
.p-content p{margin:0 0 1.1rem; color:var(--ink-soft)}
.p-content ul{padding-left:1.1rem; color:var(--ink-soft); margin:0 0 1.1rem}
.p-content li{margin-bottom:.6rem}
.p-content strong{color:var(--ink); font-weight:500}
.p-content a{color:var(--jungle); text-decoration:underline; text-decoration-color:var(--soft-clay); text-underline-offset:3px}
.p-content blockquote{margin:2.2rem 0; padding-left:1.2rem; border-left:2px solid var(--terra)}
.p-content blockquote p{font:italic 400 1.55rem/1.35 var(--f-serif); color:var(--dark-clay); margin:0}
.p-content img{max-width:100%; height:auto; border-radius:20px; margin:1rem 0}
.p-sources{margin-top:2.6rem; padding-top:1.4rem; border-top:1px solid var(--line)}
.p-sources h2{font:600 .66rem/1.3 var(--f-label); letter-spacing:.2em; text-transform:uppercase; color:var(--dark-clay); margin:0 0 .8rem}
.p-sources ul{padding-left:1.1rem; color:var(--ink-soft); margin:0}
.p-sources li{font-size:1rem; margin-bottom:.4rem}
.p-sources a{color:var(--jungle); text-decoration:underline; text-decoration-color:var(--line); text-underline-offset:3px}
.p-cta{margin-top:3rem; background:var(--jungle); color:var(--linen); border-radius:20px; padding:2rem; display:grid; gap:.8rem; max-width:none !important}
.p-cta .label{color:var(--soft-clay)}
.p-cta h2{font-size:1.7rem; color:var(--linen)}
.p-cta p{color:rgba(240,230,211,.82)}
.p-cta .btn{justify-self:start; margin-top:.4rem}
.p-back{display:inline-block; margin:2.5rem 0 clamp(3rem,7vw,5rem); font:600 .64rem/1 var(--f-label); letter-spacing:.2em; text-transform:uppercase; color:var(--jungle); text-decoration:none}

/* mobile: the newest post looks like every other card, no hero */
@media (max-width:820px){
  .j-feat{gap:0; padding:.5rem 0 2.5rem}
  .j-feat .j-img{margin-bottom:1rem}
  .j-feat h2{font-size:1.45rem; line-height:1.2; margin:.5rem 0}
  .j-feat p.sum{font-size:1.05rem}
  .j-feat .j-more{display:none}
  .j-grid{border-top:0; padding-top:0; gap:2.5rem}
}
.p-content ol{padding-left:1.4rem; color:var(--ink-soft); margin:0 0 1.1rem}
.p-content ol li::marker{color:var(--dark-clay); font-weight:500}

/* Refinement (Nov 2026): DM Sans body, Garamond for the opening and headings */
.p-body .lede{font:400 clamp(1.4rem,2.4vw,1.65rem)/1.45 var(--f-serif); color:var(--ink); letter-spacing:-.005em}
.p-body > *{max-width:42rem}
.p-content{font-size:1.04rem; line-height:1.78}
.p-content p, .p-content li{color:var(--ink-soft)}
.p-content strong{font-weight:600}
.p-content h2{font-size:clamp(1.55rem,2.6vw,1.9rem); letter-spacing:-.005em; margin:2.8rem 0 .8rem}
.j-feat p.sum{font-size:1.04rem; line-height:1.7}
.j-card p.sum{font-size:.96rem; line-height:1.65}
.p-sources, .p-sources li{font-size:.9rem}
@media (max-width:600px){ .p-content{font-size:1rem} }

/* Journal list refinement (Nov 2026): quieter metadata, one spacing rhythm */
.j-meta{font:500 .62rem/1.4 var(--f-body); letter-spacing:.12em; color:rgba(45,74,62,.6)}
.j-img{border-radius:12px}
@media (max-width:820px){
  .j-head{padding:2.1rem 0 1.4rem}
  .j-head h1{font-size:2.6rem}
  .j-feat{padding:0 0 2.4rem !important; gap:0 !important}
  .j-grid{gap:2.4rem !important; padding-top:0 !important}
  .j-img{border-radius:8px}
  .j-feat .j-img, .j-card .j-img{aspect-ratio:16/10; margin-bottom:.9rem !important}
  .j-meta{font-size:.58rem; letter-spacing:.1em}
  .j-feat h2, .j-card h3{font-size:1.4rem !important; line-height:1.16 !important; letter-spacing:-.006em; margin:.4rem 0 .45rem !important}
  .j-feat p.sum, .j-card p.sum{font-size:.94rem !important; line-height:1.6 !important; margin:0}
}
