/* ======================================================================
   RESEARCH PAGE — post index on top of hd-v1.css tokens
   ====================================================================== */

/* ---------- header ---------- */
.research-hero{
  padding:110px 56px 64px;
  text-align:center;
}
.research-hero h1{
  font-size:64px; line-height:1.05;
  max-width:22ch; margin:0 auto;
}
.research-hero h1 .gold{color:var(--gold)}
.research-hero .gold-rule{margin-top:34px; margin-bottom:30px}
.research-tagline{
  font-size:19px; line-height:1.55; color:var(--text-2);
  max-width:56ch; margin:0 auto;
}

/* ---------- post list ---------- */
.research-list{
  max-width:1080px; margin:0 auto; padding:24px 56px 130px;
}
.post{
  display:grid; grid-template-columns:340px 1fr; gap:56px;
  align-items:start;
  padding:64px 0;
  border-bottom:1px solid var(--line-soft);
}
.post:last-child{border-bottom:none}
.post-thumb{display:block}
.post-thumb .ph{border-radius:4px; transition:border-color .2s}
.post-thumb:hover .ph{border-color:var(--gold)}
.post-thumb img{
  width:100%; aspect-ratio:16/9; object-fit:cover;
  border:1px solid var(--line-soft); border-radius:4px;
}
.post-date{
  display:block;
  font-family:var(--mono); font-size:11px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--text-2);
  margin-bottom:16px;
}
.post-title{font-size:30px; margin-bottom:16px}
.post-title a{transition:color .15s}
.post-title a:hover{color:var(--gold-2)}
.post-excerpt{
  font-size:16.5px; line-height:1.62; color:var(--text-2);
  max-width:58ch; margin-bottom:26px;
}
.continue{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--mono); font-size:11.5px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--text);
  transition:color .15s;
}
.continue:hover{color:var(--gold-2)}
.continue .arr{display:inline-block; transition:transform .2s}
.continue:hover .arr{transform:translateX(3px)}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .research-hero h1{font-size:48px}
  .post{grid-template-columns:280px 1fr; gap:36px}
}
@media (max-width:680px){
  .research-hero{padding:72px 22px 44px}
  .research-hero h1{font-size:36px}
  .research-tagline{font-size:17px}
  .research-list{padding:0 22px 90px}
  .post{grid-template-columns:1fr; gap:26px; padding:48px 0}
}