/* About (/about/). Loads after /css/bevp-shell.css and /css/readability.css and never restyles the shell.
   Breakpoints match the shell: 900 stacked sections, 700 phone. Hero split as on Overwatch (Saasten .banner-area-v3). */

.ab{background:var(--u-bone)}
.ab section{padding-block:var(--rd-section)}
.ab-kicker{margin-bottom:var(--u-s4)}
.ab-h2{margin:0}
.ab-h3{margin:0;font-family:var(--u-ff-title);font-weight:400;text-transform:uppercase;font-size:clamp(28px,2.6vw,40px);line-height:1.02;text-wrap:balance}
.ab p{text-wrap:pretty}
/* A stacked headline and the copy under it run the full content width */
.ab-wide{max-width:none}

/* 1. HERO */
.ab .ab-hero{
  display:grid;grid-template-columns:calc(max(0px,(100vw - var(--u-wrap)) / 2) + .52 * min(100vw,var(--u-wrap))) minmax(0,1fr);
  min-height:clamp(520px,calc(100svh - var(--u-header-h)),820px);
  padding:0;background:var(--u-ink);color:var(--u-bone);
}
.ab-hero__copy{
  display:flex;flex-direction:column;justify-content:center;
  padding:var(--u-s8) clamp(40px,4.4vw,72px) var(--u-s8) calc(max(0px,(100vw - var(--u-wrap)) / 2) + var(--u-pad-x));
  /* The headline is sized to this panel, not the window, so it never reaches the photograph */
  container-type:inline-size;
}
.ab-hero .ab-kicker{color:var(--u-bone-soft)}
.ab-h1{margin:0;font-family:var(--u-ff-title);font-weight:400;text-transform:uppercase;font-size:clamp(44px,5.6vw,92px);line-height:.94;letter-spacing:.005em}
/* Three fixed lines. "Real outcomes." is the longest, about 6.2 times the font size wide: 15cqi keeps it to 93% of the panel's text width */
.ab-h1 span{display:block;white-space:nowrap}
@supports (font-size:1cqi){.ab-hero__copy .ab-h1{font-size:clamp(44px,15cqi,92px)}}
.ab-hero__lead{margin-top:var(--u-s6);font-size:var(--rd-lead);line-height:1.55;max-width:34em}
.ab-hero__note{margin-top:var(--u-s5);font-size:var(--rd-body);line-height:1.6;color:var(--u-bone-soft);max-width:36em}
.ab-hero__media{position:relative;margin:0;min-height:100%}
.ab-hero__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:48% 22%}

/* 2. MISSION */
.ab-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--rd-gap);align-items:start}
.ab-pair .ab-h2{font-size:clamp(40px,4.4vw,68px)}
.ab-pair__lead{margin-top:var(--u-s5);max-width:none}
.ab-pair p:not([class]){margin-top:var(--u-s4);font-size:var(--rd-body);line-height:1.6;color:var(--u-text-soft)}
.ab-pair .rd-actions{margin-top:var(--u-s6)}
.ab-practice{background:var(--u-ink);color:var(--u-bone)}
.ab-practice__h{font-size:clamp(36px,4vw,60px)}
.ab-programs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--rd-gap);row-gap:var(--u-s6);margin:var(--u-s7) 0 0;padding:0;list-style:none}
.ab-program__name{margin:0;font-family:var(--u-ff-title);font-weight:400;text-transform:uppercase;font-size:clamp(26px,2.2vw,34px);line-height:1}
.ab-program__name a{color:inherit;text-decoration:underline;text-decoration-color:var(--u-red);text-decoration-thickness:3px;text-underline-offset:8px}
.ab-programs p{margin-top:var(--u-s4);font-size:var(--rd-body);line-height:1.6;color:var(--u-bone-soft)}
.ab-practice__note{margin-top:var(--u-s7);font-size:var(--rd-lead);line-height:1.55;max-width:none}
.ab-practice .rd-actions{margin-top:var(--u-s6)}
.ab-practice :focus-visible{outline-color:var(--u-bone)}
.ab-join .ab-h3{margin-bottom:var(--u-s2)}
/* Events beside participation: shared heading, copy and action rows, so both headings, both paragraphs and both buttons align */
.ab-join .ab-pair{grid-template-rows:auto auto auto;row-gap:0}
.ab-join [data-col]{display:grid;grid-row:span 3;grid-template-rows:subgrid;align-content:start}
.ab-join .ab-h3{align-self:start}
/* Both titles are set as two deliberate lines so they read as a matched pair at every side-by-side width */
.ab-join__h span{display:block;white-space:nowrap}
.ab-join .ab-join__body > p:first-child{margin-top:var(--u-s3)}
.ab-join .rd-actions{align-self:start}

/* 3. LEADERSHIP */
.ab-lead{background:var(--u-paper)}
.ab-lead__intro{margin-top:var(--u-s5)}
.ab-people{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--rd-gap);row-gap:var(--u-s8);margin:clamp(40px,5vw,72px) 0 0;padding:0;list-style:none}
.ab-person img{display:block;width:100%;aspect-ratio:1 / 1;object-fit:cover;object-position:50% 20%}
.ab-person__role{margin-top:var(--u-s5);font-family:var(--u-ff-label);font-size:var(--u-fs-label);letter-spacing:.14em;text-transform:uppercase;color:var(--u-red)}
.ab-person__name{margin:var(--u-s2) 0 0;font-family:var(--u-ff-title);font-weight:400;text-transform:uppercase;font-size:clamp(26px,2.2vw,34px);line-height:1.02}
.ab-person p:not([class]){margin-top:var(--u-s4);font-size:var(--rd-body);line-height:1.6;color:var(--u-text-soft)}
.ab-board{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--rd-gap);align-items:start;margin-top:clamp(56px,6vw,96px)}
.ab-board__head{grid-column:1 / span 4}
.ab-board__head p{margin-top:var(--u-s4);font-size:var(--rd-lead);line-height:1.55}
.ab-board__names{grid-column:5 / -1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--rd-gap);row-gap:var(--u-s4);margin:0;padding:0;list-style:none;font-size:clamp(18px,1.4vw,21px);line-height:1.35}

/* 4. CONTACT (bone, so it does not run into the ink footer) */
/* Financials & annual reports (ink band between Leadership and Contact). The filing record reads as a row of years with
   their form type; facts and actions follow in the page's two-column rhythm. */
.ab-fin{background:var(--u-ink);color:var(--u-bone)}
.ab-fin .ab-kicker,.ab-fin .rd-lead{color:var(--u-bone-soft)}
.ab-fin :focus-visible{outline-color:var(--u-bone)}
.ab-fin__intro{margin-top:var(--u-s5)}
.ab-fin__ratio{margin-top:clamp(48px,5.4vw,80px)}
.ab-fin__ratio-h{margin:0 0 var(--u-s4)}
.ab-fin__stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--rd-gap);row-gap:var(--u-s6);margin:var(--u-s6) 0 0}
.ab-fin__stats dt{font-family:var(--u-ff-label);font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:var(--u-bone-soft)}
.ab-fin__stats dd{display:flex;flex-direction:column;gap:var(--u-s3);margin:var(--u-s3) 0 0}
.ab-fin__pct{font-family:var(--u-ff-title);font-size:clamp(64px,7.4vw,120px);line-height:.92;color:var(--u-bone)}
.ab-fin__calc{font-size:var(--rd-lead);line-height:1.5;color:var(--u-bone-soft);max-width:30em}
.ab-fin__record{margin-top:clamp(56px,6vw,96px)}
.ab-fin__label{margin:0;font-family:var(--u-ff-label);font-weight:400;font-size:var(--u-fs-label);letter-spacing:.14em;text-transform:uppercase;color:var(--u-bone-soft)}
.ab-fin__years{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:var(--u-s5) 12px;margin:var(--u-s5) 0 0;padding:0;list-style:none}
.ab-fin__years li{display:flex;flex-direction:column;gap:8px}
.ab-fin__yr{font-family:var(--u-ff-title);font-size:clamp(34px,3.6vw,56px);line-height:1;color:var(--u-bone)}
.ab-fin__form{white-space:nowrap;font-family:var(--u-ff-label);font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--u-bone-soft)}
.ab-fin__source{margin-top:var(--u-s5);font-size:var(--rd-note);line-height:1.6;color:rgba(236,227,208,.72)}
.ab-fin__facts{display:flex;flex-wrap:wrap;gap:var(--u-s5) clamp(40px,5vw,80px);margin:var(--u-s6) 0 0}
.ab-fin__facts dt{font-family:var(--u-ff-label);font-size:var(--u-fs-label);letter-spacing:.14em;text-transform:uppercase;color:var(--u-bone-soft)}
.ab-fin__facts dd{margin:var(--u-s3) 0 0;font-size:clamp(20px,1.9vw,28px);line-height:1.3;color:var(--u-bone)}
.ab-fin__pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto auto auto;column-gap:var(--rd-gap);row-gap:0;margin-top:clamp(56px,6vw,96px)}
.ab-fin__pair > div{display:grid;grid-row:span 3;grid-template-rows:subgrid;align-content:start}
.ab-fin__h{margin:0 0 var(--u-s4)}
.ab-fin__pair p{margin:0;font-size:var(--rd-lead);line-height:1.55;color:var(--u-bone-soft);max-width:36em}
.ab-fin__pair .rd-actions{margin-top:var(--u-s6);align-self:start}
.ab-fin__note{margin-top:clamp(40px,5vw,64px);font-size:var(--rd-body);line-height:1.6;color:var(--u-bone-soft)}
.ab-fin__note a{color:var(--u-bone);text-decoration:underline;text-decoration-color:var(--u-red);text-decoration-thickness:2px;text-underline-offset:6px;overflow-wrap:anywhere}
.ab-contact{background:var(--u-bone)}
.ab-contact__intro{margin-top:var(--u-s5)}
.ab-lines{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--rd-gap);row-gap:var(--u-s7);margin:clamp(40px,5vw,64px) 0 0}
.ab-lines dt{font-family:var(--u-ff-label);font-size:var(--u-fs-label);letter-spacing:.14em;text-transform:uppercase;color:var(--u-text-soft)}
.ab-lines dd{margin:var(--u-s3) 0 0;font-size:clamp(20px,1.9vw,28px);line-height:1.3}
.ab-lines a,.ab-contact__note a{color:var(--u-ink);text-decoration:underline;text-decoration-color:var(--u-red);text-decoration-thickness:2px;text-underline-offset:6px;overflow-wrap:anywhere}
.ab-contact__note{margin-top:clamp(40px,5vw,64px);font-size:var(--rd-body);line-height:1.6;color:var(--u-text-soft)}

/* Below 900px: sections stack; the hero runs title, lead, photograph, note */
@media (max-width:899px){
  .ab .ab-hero{display:flex;flex-direction:column;min-height:0}
  .ab-hero__copy{display:contents}
  .ab-hero__copy > *{padding-inline:max(var(--u-pad-x),env(safe-area-inset-left,0px))}
  .ab-hero .ab-kicker{order:1;padding-top:var(--u-s7)}
  .ab-h1,.ab-hero__copy .ab-h1{order:2;font-size:clamp(44px,10vw,80px)}
  .ab-hero__lead{order:3;max-width:none}
  .ab-hero__media{order:4;min-height:0;aspect-ratio:3 / 2;margin-top:var(--u-s6)}
  .ab-hero__note{order:5;max-width:none;padding-bottom:var(--u-s7)}
  .ab-pair{grid-template-columns:minmax(0,1fr);row-gap:var(--u-s8)}
  .ab-join .ab-pair{grid-template-rows:none;row-gap:var(--u-s8)}
  .ab-join [data-col]{display:block}
  .ab-join__h span{display:inline;white-space:normal}
  .ab-programs{grid-template-columns:minmax(0,1fr)}
  .ab-people{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ab-board__head,.ab-board__names{grid-column:1 / -1}
  .ab-board__names{margin-top:var(--u-s6);grid-template-columns:repeat(2,minmax(0,1fr))}
  .ab-fin__years{grid-template-columns:repeat(5,minmax(0,1fr))}
  .ab-fin__pair{grid-template-columns:minmax(0,1fr);grid-template-rows:none;row-gap:var(--u-s8)}
  .ab-fin__pair > div{display:block;grid-row:auto}
}
/* Short landscape phones keep the desktop hero split so the photograph does not fill the screen */
@media (max-width:899px) and (min-width:700px) and (max-height:500px){
  .ab .ab-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
  .ab-hero__copy{display:flex;padding:var(--u-s6) var(--rd-gap) var(--u-s6) var(--u-pad-x)}
  .ab-hero__copy > *{padding-inline:0}
  .ab-hero .ab-kicker{padding-top:0}
  .ab-hero__media{aspect-ratio:auto;margin-top:0}
  .ab-hero__note{padding-bottom:0}
  .ab-hero__copy .ab-h1{font-size:44px}
}
@media (max-width:699px){
  .ab-people{grid-template-columns:minmax(0,1fr)}
  .ab-person img{aspect-ratio:1 / 1}
  .ab-lines{grid-template-columns:minmax(0,1fr)}
  .ab-fin__years{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ab-fin__stats{grid-template-columns:minmax(0,1fr)}
}