/* interior pages: same dark material, one terracotta dawn at the top */
body{color:var(--cream);
  background:radial-gradient(60vmax 50vmax at 85% -5%,rgba(117,68,54,.28),transparent 60%),
             radial-gradient(46vmax 46vmax at 5% 40%,rgba(206,161,103,.07),transparent 60%),
             var(--room-deep)}
.page-nav{position:sticky}
.crumb{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--sand);opacity:.7}
.crumb:hover{opacity:1}
@media (prefers-reduced-motion: no-preference){.crumb{transition:opacity .25s}}
.page-main{padding-block:8rem 6rem;display:grid;gap:2.5rem}
.page-main h1{font-size:var(--h-section);color:var(--cream)}
.page-intro{max-width:520px;color:color-mix(in srgb,var(--cream) 80%,transparent)}

/* portfolio grid */
.works{display:grid;grid-template-columns:repeat(2,1fr);gap:3rem 1.5rem;margin-top:1rem}
.work{display:grid;gap:1rem}
.work:nth-child(even){margin-top:3.5rem}
.work .frame{height:clamp(300px,34vw,460px)}
.work-meta{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.work h3{font-size:1.5rem;color:var(--sand)}
@media (prefers-reduced-motion: no-preference){
  .work h3{transition:color .35s ease}
  .work:hover h3{color:var(--gold)}
}
@media (max-width:900px){.works{grid-template-columns:1fr}.work:nth-child(even){margin-top:0}}

/* project detail */
.detail-eyebrow{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.detail-gallery .frame{height:clamp(320px,52vh,540px)}
.thumbs{display:flex;gap:.8rem;margin-top:.8rem}
.thumbs img{width:110px;height:76px;object-fit:cover;cursor:pointer;opacity:.5}
.thumbs img.is-on,.thumbs img:hover{opacity:1}
@media (prefers-reduced-motion: no-preference){.thumbs img{transition:opacity .25s}}
.detail-cols{display:grid;grid-template-columns:1.6fr 1fr;gap:3rem}
.detail-cols p{color:color-mix(in srgb,var(--cream) 82%,transparent);margin-bottom:1.1rem}
.detail-side{align-self:start;display:grid;gap:1.2rem;border:1px solid color-mix(in srgb,var(--sand) 25%,transparent);background:color-mix(in srgb,var(--cream) 5%,transparent);padding:2rem;font-size:.9rem}
.detail-side dt{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:.25rem}
.detail-side dd{color:var(--sand)}
.detail-nav{display:flex;justify-content:space-between;gap:2rem;margin-top:2rem;flex-wrap:wrap}
.detail-missing{display:grid;gap:1.5rem;justify-items:start}
@media (max-width:900px){.detail-cols{grid-template-columns:1fr}}

/* journal posts */
.posts{display:grid;gap:clamp(4rem,8vw,7rem);margin-top:1rem}
.post{display:grid;grid-template-columns:1fr 1.15fr;gap:3rem;align-items:start;scroll-margin-top:7rem}
.post:nth-child(even) .post-media{order:2}
.post-media .frame{height:clamp(280px,30vw,400px);border:8px solid var(--sand);background:var(--sand)}
.post-body{display:grid;gap:1.1rem}
.post-body h2{font-size:clamp(1.7rem,3vw,2.5rem);color:var(--sand)}
.post-meta{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.post-body p{color:color-mix(in srgb,var(--cream) 82%,transparent)}
@media (max-width:900px){.post{grid-template-columns:1fr}.post:nth-child(even) .post-media{order:0}}
