/* About (T5 text with a people directory, 10 nov 2026). Prefix abx-. Personality: a letter from the people who make the calls.
   Warm and plain: one real photo, initials where a photo is still missing, a rank ladder for the callers, short house rules,
   a ledger of where we call. One amber spark (the Elite step); the house rules settle in once. */
.page[data-page="about"]{--abx-sand0:#F6F1E9; --abx-sand1:#F1EADF; --abx-sand2:#E9DECD; --abx-sand3:#D8C7AE; --abx-taupe:#5C5345; --abx-enter:cubic-bezier(.16,1,.3,1)}

.abx-cell{padding-block:clamp(4px,1.6vw,20px)}
.abx-top{padding-top:0}
.abx-n{font-family:var(--sans);font-size:clamp(34px,3.4vw,48px);font-weight:600;letter-spacing:-.05em;line-height:1;color:var(--fg);text-transform:none}
.pt-prose-body .abx-title{font-size:clamp(40px,5.4vw,80px);line-height:.98;letter-spacing:-.05em}
.pt-prose-body .abx-h2{font-size:clamp(28px,3.1vw,42px);line-height:1.06;letter-spacing:-.036em;margin-top:0}
.pt-prose-body a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}

/* the founder's own words */
.abx-quote{margin:6px 0;padding:clamp(22px,3vw,34px) 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);display:flex;flex-direction:column;gap:14px}
.abx-quote blockquote{margin:0}
.abx-quote blockquote p{font-size:clamp(24px,2.6vw,36px);line-height:1.2;letter-spacing:-.03em;font-weight:500;color:var(--fg)}
.abx-quote figcaption{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg3)}

/* section heads */
.abx-head{margin-bottom:clamp(28px,4vw,48px)}
.abx-head-side{font-size:clamp(16px,1.3vw,18px);line-height:1.5;color:var(--fg2);max-width:44ch}

/* the people: one frame shape for a photo, initials or the ladder */
.abx-people{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.2vw,32px)}
.abx-person{display:flex;flex-direction:column;gap:22px;min-width:0}
.abx-frame{position:relative;aspect-ratio:4/5;border-radius:20px;overflow:hidden;background:var(--abx-sand1)}
/* the photo is cropped to head and shoulders with object-view-box (the image box stays inside its frame);
   browsers without it show the whole portrait, which has the same 4:5 shape */
.abx-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%;object-view-box:inset(4% 17% 28% 15%)}
.abx-mono{display:flex;align-items:center;justify-content:center;background:var(--abx-sand0)}
.abx-mono span{font-size:clamp(84px,9vw,148px);font-weight:700;letter-spacing:-.06em;line-height:1;color:var(--abx-sand3)}
.abx-ladder{display:flex;flex-direction:column;justify-content:flex-end;gap:12px;padding:clamp(22px,3vw,40px);background:var(--abx-sand0)}
.abx-bars{flex:1;display:flex;align-items:flex-end;gap:10px;min-height:0}
.abx-bars i{flex:1;height:calc(var(--h) * 82%);border-radius:8px 8px 3px 3px;background:var(--abx-sand2);position:relative}
.abx-bars i.abx-elite{background:var(--abx-sand3)}
.abx-bars i.abx-elite::before{content:"";position:absolute;left:50%;bottom:calc(100% + 8px);width:22px;height:19px;margin-left:-11px;background:var(--amber);clip-path:polygon(50% 0,100% 100%,0 100%)}
.abx-ranks{display:flex;gap:10px}
.abx-ranks span{flex:1;min-width:0;text-align:center;font-family:var(--mono);font-size:11px;letter-spacing:.02em;color:var(--abx-taupe);white-space:nowrap;overflow:hidden}
.abx-person-t{display:flex;flex-direction:column;gap:10px;min-width:0}
.abx-person-t h3{font-size:clamp(26px,2.4vw,34px);line-height:1.05;letter-spacing:-.035em}
.abx-role{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg3)}
.abx-person-t p{font-size:16px;line-height:1.6;color:var(--fg2);max-width:42ch}
.abx-facts{border-top:1px solid var(--rule);margin-top:4px}
.abx-facts>div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:10px 0;border-bottom:1px solid var(--rule)}
.abx-facts dt{font-size:14px;color:var(--fg3)}
.abx-facts dd{margin:0;font-size:15px;font-weight:500;color:var(--fg);text-align:right}
.abx-facts dd.abx-num{font-family:var(--mono);font-weight:400}

/* how we work: four house rules */
.abx-habits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--rule);border-left:1px solid var(--rule);background:var(--paper)}
.abx-habits li{display:flex;flex-direction:column;gap:12px;padding:clamp(22px,2.4vw,32px);border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);min-width:0;transition:opacity .55s ease calc(var(--d) * .07s),transform .55s var(--abx-enter) calc(var(--d) * .07s)}
.abx-habit-n{font-family:var(--mono);font-size:13px;color:var(--fg3)}
.abx-habits h3{font-size:clamp(21px,1.9vw,26px);line-height:1.12;letter-spacing:-.028em;margin-top:clamp(20px,3vw,48px)}
.abx-habits p{font-size:15.5px;line-height:1.55;color:var(--fg2)}

/* where: a ledger */
.abx-where{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,5vw,80px);align-items:start}
.abx-where-head{display:flex;flex-direction:column;gap:18px}
.abx-ledger{border-top:1px solid var(--rule)}
.abx-ledger>div{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:6px 24px;padding:18px 0;border-bottom:1px solid var(--rule)}
.abx-ledger dt{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg3);padding-top:5px}
.abx-ledger dd{margin:0;font-size:clamp(17px,1.4vw,20px);line-height:1.45;letter-spacing:-.01em;color:var(--fg)}
.abx-ledger .abx-ledger-co dd{font-size:16px;line-height:1.6;color:var(--fg2)}

/* questions */
.abx-faq{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,5vw,80px);align-items:start}
.abx-faq-head{display:flex;flex-direction:column;gap:18px}

/* close */
.abx-end{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(28px,5vw,80px);align-items:end;padding-block:clamp(88px,11vw,152px)}
.abx-end-head{display:flex;flex-direction:column;gap:22px}
.abx-end-h{font-size:clamp(42px,5.6vw,84px)}
.abx-end-side{display:flex;flex-direction:column;gap:24px;align-items:flex-start;padding-bottom:8px}
.abx-join{font-size:15px;line-height:1.55;color:var(--fg2);padding-top:18px;border-top:1px solid var(--rule);max-width:48ch}
.abx-end .note{grid-column:1/-1}

/* house rules settle in once (only when the page script runs) */
.abx-js .abx-habits[data-kit-reveal]:not(.bmk-seen) li{opacity:0;transform:translateY(12px)}

@media (max-width:1080px){
  .abx-people{grid-template-columns:repeat(2,minmax(0,1fr))}
  .abx-person-net{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(16px,2.2vw,32px);align-items:center}
  .abx-person-net .abx-frame{aspect-ratio:16/10}
  .abx-habits{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .abx-where,.abx-faq,.abx-end{grid-template-columns:minmax(0,1fr)}
  .abx-end{align-items:start}
}
@media (max-width:620px){
  .abx-people{grid-template-columns:minmax(0,1fr)}
  .abx-person-net{display:flex;align-items:stretch}
  .abx-frame,.abx-person-net .abx-frame{aspect-ratio:1/1}
  .abx-photo img{object-position:50% 20%;object-view-box:inset(4% 17% 41.6% 15%)}
  .abx-ladder{padding:22px}
  .abx-habits{grid-template-columns:minmax(0,1fr)}
  .abx-habits h3{margin-top:6px}
  .abx-ledger>div{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){
  .abx-habits li{transition:none}
}