/* KUBOLAB redesign — Histórias (scoped under .kbl) */

.kbl .page-head{ padding:150px clamp(20px,4vw,48px) 56px; max-width:680px; }
.kbl .page-head h1{ font-weight:600; font-size:clamp(2.6rem,6vw,4rem); line-height:0.98; letter-spacing:-0.01em; margin:0 0 18px; }
.kbl .page-head p{ color:var(--text-soft); font-size:1rem; line-height:1.6; margin:0; max-width:56ch; }

.kbl .list{ max-width:920px; margin:0 auto; padding:0 clamp(20px,4vw,48px) 100px; }
.kbl .post{
  display:grid; grid-template-columns:120px 1fr; gap:32px; padding:32px 0;
  border-bottom:1px solid var(--line); transition:opacity .15s;
}
.kbl .post:first-child{ padding-top:0; }
.kbl .post:hover .post-title{ color:var(--text-soft); }
.kbl .post-date{
  font-weight:500; font-size:11px; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--text-faint); padding-top:4px; font-variant-numeric:tabular-nums;
}
.kbl .post-title{ font-weight:600; font-size:1.25rem; line-height:1.3; margin:0 0 10px; letter-spacing:-0.005em; transition:color .2s; text-wrap:balance; }
.kbl .post-excerpt{ color:var(--text-soft); font-size:0.94rem; line-height:1.65; margin:0 0 14px; max-width:60ch; }
.kbl .post-arrow{ font-size:12px; font-weight:500; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-faint); display:inline-flex; align-items:center; gap:6px; }
.kbl .post:hover .post-arrow{ color:var(--text); }
.kbl .post-arrow span{ transition:transform .2s; }
.kbl .post:hover .post-arrow span{ transform:translateX(4px); }

@media (max-width:640px){
  .kbl .post{ grid-template-columns:1fr; gap:8px; }
}