/* ==========================================================================
   JOURNAL — featured article, filterable grid, newsletter
   ========================================================================== */

.journal-hero{
  padding: 11rem clamp(1.25rem,4vw,3rem) 3.5rem;
  border-bottom: 1px solid var(--hairline);
}
.journal-hero h1{ font-size: clamp(2.6rem, 7vw, 5.6rem); }
.journal-hero p{ margin-top:1.4rem; max-width:50ch; color:var(--muted-2); font-size:1.02rem; line-height:1.7; }

/* ---- Featured article ---- */
.featured{ padding: 4.5rem clamp(1.25rem,4vw,3rem) 2rem; }
.featured__card{
  display:grid; grid-template-columns: 1.2fr 1fr; gap:0; border:1px solid var(--hairline);
  background: var(--bg-card);
}
.featured__img{
  min-height:380px; background-size:cover; background-position:center;
  filter: grayscale(0.55) brightness(0.62);
}
.featured__body{ padding: 2.8rem 2.6rem; display:flex; flex-direction:column; justify-content:center; }
.featured__meta{
  display:flex; gap:1.2rem; align-items:center; margin-bottom:1.4rem;
  font-family:'JetBrains Mono', monospace; font-size:0.7rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted);
}
.featured__meta .tag{ color:var(--gold); }
.featured__body h2{ font-size: clamp(1.6rem, 3.2vw, 2.3rem); margin-bottom:1.2rem; }
.featured__body p.excerpt{ color:var(--muted-2); font-size:0.98rem; line-height:1.75; margin-bottom:1.8rem; }

@media (max-width: 860px){
  .featured__card{ grid-template-columns:1fr; }
  .featured__img{ min-height:240px; }
}

/* ---- Filters (shared visual language with Work page) ---- */
.filters{ display:flex; gap:0.6rem; flex-wrap:wrap; padding: 3rem clamp(1.25rem,4vw,3rem) 0; }
.filter-btn{
  font-family:'JetBrains Mono', monospace; font-size:0.75rem; letter-spacing:0.08em; text-transform:uppercase;
  padding: 0.7rem 1.2rem; border:1px solid var(--hairline); background:none; color:var(--muted-2); cursor:pointer;
  transition: all 0.3s var(--ease);
}
.filter-btn:hover{ color:var(--ink); border-color:var(--muted); }
.filter-btn.is-active{ color:#08080A; background:var(--gold); border-color:var(--gold); }

/* ---- Article grid ---- */
.articles{
  display:grid; grid-template-columns: repeat(4, 1fr); gap:1px;
  background: var(--hairline); border:1px solid var(--hairline);
  margin: 2.5rem clamp(1.25rem,4vw,3rem) 0;
}
.article-card{ background:var(--bg); display:flex; flex-direction:column; transition: opacity 0.4s var(--ease); }
.article-card.is-hidden{ display:none; }
.article-card__img{
  height:190px; background-size:cover; background-position:center;
  filter:grayscale(0.65) brightness(0.58); transition: filter 0.5s var(--ease), transform 0.7s var(--ease);
}
.article-card:hover .article-card__img{ filter:grayscale(0.1) brightness(0.68); transform:scale(1.03); }
.article-card__body{ padding:1.5rem 1.4rem 1.8rem; display:flex; flex-direction:column; flex-grow:1; }
.article-card__tag{ font-family:'JetBrains Mono', monospace; font-size:0.64rem; color:var(--gold); letter-spacing:0.1em; text-transform:uppercase; }
.article-card__title{ font-size:1.08rem; margin-top:0.7rem; line-height:1.3; }
.article-card__excerpt{ font-size:0.82rem; color:var(--muted-2); line-height:1.6; margin-top:0.7rem; flex-grow:1; }
.article-card__foot{
  margin-top:1.2rem; display:flex; justify-content:space-between; align-items:center;
  font-family:'JetBrains Mono', monospace; font-size:0.68rem; color:var(--muted);
}
.article-card__foot a{ color:var(--gold); }

@media (max-width: 1080px){ .articles{ grid-template-columns: repeat(2,1fr); } }
@media (max-width: 640px){
  .articles{ grid-template-columns: 1fr; margin-left:1.25rem; margin-right:1.25rem; }
  .filters, .featured{ padding-left:1.25rem; padding-right:1.25rem; }
}

/* ---- Newsletter ---- */
.newsletter{
  padding: 7rem clamp(1.25rem,4vw,3rem); border-top:1px solid var(--hairline); text-align:center;
}
.newsletter h2{ font-size: clamp(2rem, 4.5vw, 3.2rem); }
.newsletter p{ max-width:44ch; margin: 1.2rem auto 2.4rem; color:var(--muted-2); font-size:0.98rem; line-height:1.7; }
.newsletter__form{ display:flex; gap:0.8rem; max-width:440px; margin:0 auto; }
.newsletter__form input{
  flex:1; background:transparent; border:1px solid var(--hairline); color:var(--ink);
  padding: 1rem 1.2rem; font-family:'Inter',sans-serif; font-size:0.92rem; font-weight:300;
  transition: border-color 0.3s var(--ease);
}
.newsletter__form input:focus{ outline:none; border-color:var(--gold); }
.newsletter__status{
  margin-top:1.2rem; font-family:'JetBrains Mono', monospace; font-size:0.78rem; color:var(--gold); display:none;
}
.newsletter__status.is-visible{ display:block; }

@media (max-width: 520px){ .newsletter__form{ flex-direction:column; } }