/* -PTF- About: editorial history page. Uses the shared 1240px site canvas with selective narrative hierarchy. */
.about-page .hero{padding-bottom:38px}
.about-page .hero-copy{max-width:1040px}
.about-page .hero .lede{max-width:920px}

/* The page intentionally uses the same desktop canvas as the rest of the site. */
.about-story{width:100%;max-width:none;margin:0;padding:0 0 32px}
.about-chapter{padding:0;margin-top:58px}
.about-chapter:first-child{margin-top:16px}
.about-chapter h2{
  margin:0 0 22px;
  color:var(--text-strong);
  font-size:clamp(25px,2.25vw,32px);
  font-weight:950;
  letter-spacing:-.022em;
  line-height:1.08;
}
.about-chapter h2::before{
  content:"";
  display:inline-block;
  width:24px;
  height:6px;
  margin:0 10px 4px 0;
  background:var(--gold);
  clip-path:polygon(0 0,100% 0,calc(100% - 5px) 100%,4px 100%);
}
.about-prose{max-width:1080px}
.about-prose p{
  max-width:1080px;
  margin:0 0 16px;
  color:var(--text-secondary);
  font-size:17.25px;
  line-height:1.7;
}
.about-prose p:last-child{margin-bottom:0}
.about-prose strong{color:var(--text-strong);font-weight:900}

/* Only actual points in time receive milestone treatment. */
.about-chapter--milestone{
  position:relative;
  padding-top:38px;
  border-top:1px solid var(--line-soft);
}
.about-milestone-date{
  margin:0 0 10px;
  color:var(--steel2);
  font-size:calc(var(--type-micro) * 1.12);
  font-weight:950;
  letter-spacing:.14em;
  line-height:1.1;
  text-transform:uppercase;
}
.about-chapter--milestone h2::before{background:var(--gold)}

/* A live typographic rail, not a dashboard/card grid. */
.about-live-rail{
  width:100%;
  max-width:1120px;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin:4px 0 28px;
  border-top:1px solid var(--border-panel);
  border-bottom:1px solid var(--border-panel);
}
.about-live-stat{
  min-width:0;
  padding:19px 24px 18px 0;
}
.about-live-stat+.about-live-stat{
  padding-left:24px;
  border-left:1px solid var(--line-soft);
}
.about-live-stat strong{
  display:block;
  color:var(--gold);
  font-size:clamp(25px,2.5vw,34px);
  font-weight:950;
  letter-spacing:-.025em;
  line-height:1;
}
.about-live-stat span{
  display:block;
  margin-top:6px;
  color:var(--text-secondary);
  font-size:11px;
  font-weight:950;
  letter-spacing:.11em;
  text-transform:uppercase;
}

/* The standard section is dense by design; these accents expose cause -> response without turning it into cards. */
.about-standard-response{
  max-width:1040px!important;
  margin:0 0 12px!important;
  padding:2px 0 2px 16px;
  border-left:2px solid rgba(240,212,79,.55);
}
.about-standard-response+.about-standard-response{margin-top:0!important}

/* Selective pull-lines carry the emotional spine while remaining part of the text flow. */
.about-emphasis{
  max-width:1020px!important;
  margin:25px 0!important;
  padding:2px 0 2px 18px;
  border-left:4px solid var(--gold);
  color:var(--text-primary)!important;
  font-size:20.5px!important;
  line-height:1.46!important;
}
.about-motto-return{
  margin-top:22px!important;
  color:var(--text-primary)!important;
  font-size:20px!important;
  line-height:1.35!important;
}
.about-motto-return strong{color:var(--gold)}
.about-final{
  margin-top:22px!important;
  color:var(--text-primary)!important;
  font-size:22px!important;
  line-height:1.3!important;
}

/* The closing PvP/PvE chapter visually calls back to the opening without adding decoration. */
.about-chapter--heritage-return{
  padding-top:38px;
  border-top:1px solid var(--line-soft);
}
.about-chapter--heritage-return h2::before{background:var(--gold)}

@media (max-width:980px){
  .about-prose,.about-prose p{max-width:100%}
  .about-live-rail{max-width:100%}
}
@media (max-width:760px){
  .about-page .hero{padding-bottom:32px}
  .about-story{padding-bottom:18px}
  .about-chapter{margin-top:42px}
  .about-chapter:first-child{margin-top:12px}
  .about-chapter--milestone,.about-chapter--heritage-return{padding-top:30px}
  .about-chapter h2{margin-bottom:18px}
  .about-prose p{font-size:16px;line-height:1.64}
  .about-emphasis{font-size:18px!important;padding-left:14px}
  .about-motto-return{font-size:18px!important}
  .about-final{font-size:20px!important}
  .about-live-rail{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:24px}
  .about-live-stat{padding:16px 14px 15px 0}
  .about-live-stat+.about-live-stat{padding-left:14px}
  .about-live-stat:nth-child(3){padding-left:0;border-left:0;border-top:1px solid var(--line-soft)}
  .about-live-stat:nth-child(4){border-top:1px solid var(--line-soft)}
  .about-standard-response{padding-left:13px}
}
@media (max-width:420px){
  .about-live-stat strong{font-size:25px}
  .about-live-stat span{font-size:10px}
}