.about-body{background:var(--paper);}

/* ---- Header (moved from editor.css) ---- */
.about-header{
  display:flex; justify-content:space-between; align-items:center;
  padding:1rem 1.5rem; border-bottom:3px solid var(--rule); background:var(--paper);
}
.about-brand{font-family:var(--serif); font-weight:900; font-size:1.3rem;}
.about-brand span{color:var(--signal); font-style:italic; font-weight:500; font-size:.9em;}
.about-brand-logo{
  height:1.6rem; width:1.6rem; vertical-align:middle; margin-right:.4rem;
  border-radius:50%; object-fit:cover; border:1px solid var(--ink);
}
.about-exit{font-family:var(--sans-x); font-weight:700; font-size:.78rem; text-transform:uppercase; letter-spacing:.05em; color:var(--grey);}
.about-exit:hover{color:var(--signal);}

/* ---- Hero ---- */
.about-hero{
  max-width:820px; margin:0 auto; text-align:center;
  padding:4.5rem 1.5rem 3rem;
}
.about-kicker{
  display:inline-block; font-family:var(--sans-x); font-weight:700; font-size:.72rem;
  text-transform:uppercase; letter-spacing:.14em; color:var(--signal); margin-bottom:1rem;
}
.about-title{
  font-family:var(--serif); font-weight:900; font-size:3rem; line-height:1.08; letter-spacing:-.01em;
}
.about-lede{
  font-family:var(--serif); font-size:1.2rem; color:var(--grey); line-height:1.55;
  margin-top:1.3rem; font-style:italic;
}

/* ---- Main ---- */
.about-main{max-width:980px; margin:0 auto; padding:0 1.5rem 4rem;}
.about-block{padding:3rem 0; border-top:1px solid var(--rule);}
.about-block h2{
  font-family:var(--serif); font-weight:900; font-size:1.7rem; margin-bottom:1.8rem;
}

/* ---- Pillars ---- */
.about-pillars{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1.6rem;
}
.pillar{border-top:3px solid var(--ink); padding-top:1rem;}
.pillar-num{
  font-family:var(--sans-x); font-weight:800; font-size:.75rem; color:var(--gold);
  letter-spacing:.08em;
}
.pillar h3{font-family:var(--serif); font-weight:700; font-size:1.25rem; margin:.5rem 0 .6rem;}
.pillar p{font-size:.88rem; color:var(--grey); line-height:1.5;}

/* ---- Split (text + stats) ---- */
.about-split{display:grid; grid-template-columns:1.4fr 1fr; gap:3rem; align-items:start;}
.about-split p{font-size:.98rem; line-height:1.65; color:var(--ink); margin-bottom:1rem;}
.about-split p:last-child{margin-bottom:0;}

.about-stats{
  display:flex; flex-direction:column; gap:1.4rem;
  background:var(--paper-dim); border:1px solid var(--ink); padding:1.6rem;
}
.stat{display:flex; flex-direction:column; border-bottom:1px dotted var(--grey); padding-bottom:1.2rem;}
.stat:last-child{border-bottom:none; padding-bottom:0;}
.stat span{font-family:var(--serif); font-weight:900; font-size:2.2rem; color:var(--signal); line-height:1;}
.stat label{
  font-family:var(--sans-x); font-weight:700; font-size:.7rem; text-transform:uppercase;
  letter-spacing:.06em; color:var(--grey); margin-top:.4rem;
}

/* ---- Editorial / Corrections notes ---- */
.about-notes{display:grid; grid-template-columns:1fr 1fr; gap:2.5rem;}
.note-item h3{
  font-family:var(--sans-x); font-weight:800; font-size:.78rem; text-transform:uppercase;
  letter-spacing:.08em; color:var(--gold); margin-bottom:.7rem;
}
.note-item p{font-size:.92rem; line-height:1.6; color:var(--ink);}
.note-item a{color:var(--signal); border-bottom:1px solid var(--signal);}
.note-item a:hover{color:var(--ink); border-color:var(--ink);}

/* ---- CTA ---- */
.about-cta{text-align:center;}
.about-cta p{color:var(--grey); margin-bottom:1.6rem;}
.about-cta-links{display:flex; justify-content:center; gap:1rem; flex-wrap:wrap;}
.about-btn{
  font-family:var(--sans-x); font-weight:700; font-size:.8rem; text-transform:uppercase;
  letter-spacing:.05em; padding:.75rem 1.6rem; border:1px solid var(--ink); border-radius:1px;
  color:var(--ink);
}
.about-btn:hover{border-color:var(--signal); color:var(--signal);}
.about-btn-solid{background:var(--ink); color:var(--paper); border-color:var(--ink);}
.about-btn-solid:hover{background:var(--signal); border-color:var(--signal); color:var(--paper);}

/* ---- Responsive ---- */
@media (max-width:820px){
  .about-pillars{grid-template-columns:repeat(2,1fr);}
  .about-split{grid-template-columns:1fr;}
  .about-notes{grid-template-columns:1fr;}
}
@media (max-width:640px){
  .about-header{padding:.9rem 1.2rem; flex-wrap:wrap; gap:.7rem;}
  .about-nav{gap:1rem; flex-wrap:wrap;}
  .about-hero{padding:3rem 1.2rem 2rem;}
  .about-title{font-size:2.1rem;}
  .about-lede{font-size:1.02rem;}
  .about-pillars{grid-template-columns:1fr;}
  .about-main{padding:0 1.2rem 3rem;}
}
