/* ==========================================================================
   ABOUT — studio story, process pipeline, capabilities
   ========================================================================== */

.about-hero{
  padding: 11rem clamp(1.25rem,4vw,3rem) 4rem;
  border-bottom: 1px solid var(--hairline);
}
.about-hero h1{ font-size: clamp(2.4rem, 6vw, 4.6rem); max-width: 18ch; }
.about-hero .lede{
  margin-top:1.8rem; max-width:56ch; font-size:1.15rem; line-height:1.7; color:var(--muted-2); font-weight:300;
}

.pipeline{ padding: 7rem clamp(1.25rem,4vw,3rem); border-bottom:1px solid var(--hairline); }
.pipeline__list{ margin-top:3rem; border-top:1px solid var(--hairline); }
.pipeline__item{
  display:grid; grid-template-columns: 90px 1fr 1fr; gap:2rem;
  padding: 2.2rem 0; border-bottom:1px solid var(--hairline);
  align-items:start;
}
.pipeline__num{ font-family:'JetBrains Mono', monospace; color:var(--gold); font-size:0.9rem; }
.pipeline__item h3{ font-size:1.5rem; }
.pipeline__item p{ color:var(--muted-2); font-size:0.92rem; line-height:1.65; max-width:48ch; }

@media (max-width: 760px){
  .pipeline__item{ grid-template-columns: 1fr; gap:0.6rem; }
}

.capabilities{ padding: 7rem clamp(1.25rem,4vw,3rem); border-bottom:1px solid var(--hairline); }
.cap-grid{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr));
  gap:1px; background:var(--hairline); border:1px solid var(--hairline); margin-top:3rem;
}
.cap-card{ background:var(--bg); padding:2rem 1.8rem; }
.cap-card h4{ font-size:1.05rem; margin-bottom:0.8rem; }
.cap-card p{ color:var(--muted-2); font-size:0.85rem; line-height:1.6; }

.stats{ padding: 5rem clamp(1.25rem,4vw,3rem) 0; display:flex; gap:4rem; flex-wrap:wrap; }
.stat{ font-family:'JetBrains Mono', monospace; }
.stat strong{ display:block; font-family:'Syne',sans-serif; font-size:2.6rem; color:var(--ink); font-weight:800; }
.stat span{ font-size:0.72rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--muted); }