/* /about/ — Tier 1 page CSS. Loaded only by this page. Tokens, type scale and buttons come from
   styles.css; sizing is on @container page.

   Composition: an editorial masthead hero (type in the left eight, one wide photograph across all
   twelve columns beneath it), the shared Navy proof band, a 5/6 Since 1996 spread over a 21:9
   photograph, the full-width Navy method chapter carrying the site's one contour field, a Paper
   4/4/4 responsibilities section, a 5/6 people section built to grow, and a Navy close whose
   three audience routes are equals. No section repeats its neighbour's rhythm; the hero repeats
   no other Tier 1 hero.

   Below 620px every grid collapses to one column with no column gap: a 12-column grid with a
   40px column gap has a 440px minimum and would otherwise clip inside a 390px viewport. */

main{--ab-r:6px}
.ab-h2{font-size:42px;line-height:1.06;letter-spacing:-.022em;max-width:22ch}
.ab-h2.inv{color:var(--text-inverse)}
.ab-lead{margin-top:16px;font-size:18px;line-height:1.6;color:var(--text-secondary);max-width:52ch}
.ab-link{display:inline-flex;align-items:center;flex-wrap:wrap;gap:8px;min-height:44px;font-family:var(--font-sans);font-size:14.5px;font-weight:600;color:var(--brand-navy);text-decoration:none;padding:11px 0}
.ab-link:hover{color:var(--brand-accent)}
figure{margin:0}
.nowrap{white-space:nowrap}

/* ---- 1 hero: editorial masthead. Type above, one wide photograph beneath, full width ---- */
.ab-hero__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px 40px;padding-top:6px;padding-bottom:4px}
.ab-hero__copy{grid-column:1 / span 8}
.ab-hero__h{font-size:64px;line-height:1.0;letter-spacing:-.03em;color:var(--brand-navy);margin-top:10px;max-width:20ch}
.ab-hero__l{margin-top:24px;font-size:19px;line-height:1.58;color:var(--text-secondary);max-width:56ch}
.ab-hero__a{display:flex;flex-wrap:wrap;align-items:center;gap:12px 30px;margin-top:32px}
.ab-hero__sec{color:var(--sky-800,#1B5E8C)}
.ab-hero__ph{grid-column:1 / -1;margin-top:44px;position:relative;overflow:hidden;border-radius:var(--ab-r)}
.ab-hero__ph img{width:100%;aspect-ratio:16 / 7;object-fit:cover;object-position:50% 56%;display:block}
.ab-hero__scrim{position:absolute;inset:0;background:linear-gradient(180deg,transparent 52%,rgba(0,25,45,.62))}
.ab-hero__cap{position:absolute;left:26px;bottom:20px;font-family:var(--font-sans);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-sky)}
.ab-hero__dev{grid-column:1 / -1}

/* ---- 2 proof band: four territories, on the Brokers alignment rule ---- */
.ab-pband .ds-pband__v{font-size:40px;align-self:start}
.ab-pband .ds-pband__i:last-child .ds-pband__v{font-size:24px;letter-spacing:-.018em;line-height:1.0}
.ab-pband .ds-pband__i{grid-template-rows:40px auto auto;row-gap:7px;align-items:start}
.ab-pband .ds-pband__set{padding-bottom:26px}
.ab-pband .ds-pband__i:last-child .ds-pband__q{font-size:11px;line-height:1.34}

/* ---- 3 Since 1996: one composition. The photograph holds the left seven, the history the
   right five, vertically centred against it, so the two read together rather than in sequence.
   The page's only full-width photographic moment stays in the hero. ---- */
.ab-hist__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px 40px;align-items:center}
.ab-hist__ph{grid-column:1 / span 7;overflow:hidden;border-radius:var(--ab-r);aspect-ratio:5 / 4;max-height:620px}
.ab-hist__ph img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:50% 58%;display:block}
.ab-hist__copy{grid-column:9 / span 4}
.ab-hist__h{font-family:var(--font-display);font-weight:500;font-size:40px;line-height:1.06;letter-spacing:-.024em;color:var(--brand-navy);margin:10px 0 0;max-width:14ch}
.ab-hist__l{margin-top:16px;font-size:17px;line-height:1.55;color:var(--text-secondary);max-width:30ch}
.ab-hist__set{margin:28px 0 0}
.ab-hist__set>div{padding:18px 0;border-top:1px solid rgba(0,43,84,.16);display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:14px;align-items:start}
.ab-hist__set>div:last-child{border-bottom:1px solid rgba(0,43,84,.16)}
.ab-hist__n{margin:3px 0 0;font-family:var(--font-display);font-weight:500;font-size:14px;line-height:1;letter-spacing:.02em;color:var(--brand-accent);font-variant-numeric:tabular-nums}
.ab-hist__set dt{font-family:var(--font-display);font-weight:500;font-size:21px;line-height:1.18;letter-spacing:-.016em;color:var(--brand-navy)}
.ab-hist__set dd{margin:7px 0 0;font-size:15.5px;line-height:1.58;color:var(--text-secondary)}
.ab-hist__dev{grid-column:1 / -1}

/* ---- 4 the method: full-width Navy over the site's one contour field ---- */
.ab-mth{position:relative;background:var(--brand-navy);color:var(--text-inverse);isolation:isolate;overflow:hidden}
.ab-mth__field{position:absolute;top:0;bottom:0;left:0;right:0;width:100%;height:100%;z-index:-1;opacity:var(--ap-field-o,.02);pointer-events:none}
.ab-mth__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px 40px;padding-top:92px;padding-bottom:96px}
.ab-mth__head{grid-column:1 / span 4}
.ab-mth__l{margin-top:20px;font-size:16.5px;line-height:1.6;color:var(--sky-300);max-width:34ch}
.ab-mth__list{grid-column:6 / span 7;border-top:2px solid var(--brand-accent)}
.ab-mth__r{padding:19px 0 20px;border-bottom:1px solid rgba(145,195,235,.26);display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);column-gap:36px;align-items:baseline}
.ab-mth__t{font-family:var(--font-display);font-weight:500;font-size:23px;line-height:1.16;letter-spacing:-.016em;color:var(--text-inverse);margin:0}
.ab-mth__d{margin:0;font-size:15.5px;line-height:1.55;color:var(--sky-300)}
.ab-mth__dev{grid-column:1 / -1;margin-top:32px}

/* ---- 5 one company: 4/4/4 over Navy rules, closing on one promoted line ---- */
.ab-one__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px 40px}
.ab-one__head{grid-column:1 / span 8}
.ab-one__cols{grid-column:1 / -1;margin-top:16px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.ab-one__cols>div{padding-top:20px;border-top:2px solid var(--brand-navy)}
.ab-one__t{font-size:28px;line-height:1.12;letter-spacing:-.018em;margin:0;font-family:var(--font-display);font-weight:500;color:var(--brand-navy)}
.ab-one__p{margin-top:12px;font-size:16.5px;line-height:1.62;color:var(--text-secondary)}
.ab-one__stmt{grid-column:1 / span 8;margin-top:52px;font-family:var(--font-display);font-weight:500;font-size:31px;line-height:1.12;letter-spacing:-.02em;color:var(--brand-navy);max-width:26ch}
.ab-one__dev{grid-column:1 / -1}

/* ---- 6 the people: one anchor portrait, a roster that lengthens beneath it ---- */
.ab-ppl__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px 40px}
.ab-ppl__head{grid-column:1 / span 8}
.ab-ppl__ph{grid-column:1 / span 4;margin-top:44px;overflow:hidden;border-radius:var(--ab-r);background:var(--brand-fog);align-self:start}
.ab-ppl__ph img{width:100%;aspect-ratio:4 / 5;object-fit:cover;object-position:50% 50%;display:block}
.ab-ppl__anchor{grid-column:6 / span 6;margin-top:44px;align-self:start}
.ab-ppl__n{font-family:var(--font-display);font-weight:500;font-size:35px;line-height:1.1;letter-spacing:-.02em;color:var(--brand-navy);margin:0}
.ab-ppl__role{margin:11px 0 0;font-family:var(--font-sans);font-size:11.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--text-eyebrow)}
.ab-ppl__bio{margin-top:22px;padding-top:22px;border-top:1px solid var(--line);max-width:68ch}
.ab-ppl__bio p{margin:0;font-size:17.5px;line-height:1.66;color:var(--text-secondary)}
.ab-ppl__bio p+p{margin-top:17px}
.ab-ppl__li{margin:18px 0 0}
.ab-ppl__li a{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-family:var(--font-sans);font-size:14.5px;font-weight:600;color:var(--sky-800,#1B5E8C);text-decoration:none}
.ab-ppl__li a:hover{color:var(--brand-accent)}
.ab-ppl__persps{margin-top:12px;border-top:1px solid var(--line);max-width:68ch}
.ab-ppl__persp{display:block;padding:16px 0;border-bottom:1px solid var(--line);text-decoration:none}
.ab-ppl__pk{display:block;font-family:var(--font-sans);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text-eyebrow)}
.ab-ppl__pt{display:block;margin-top:6px;font-family:var(--font-display);font-weight:500;font-size:19px;line-height:1.24;letter-spacing:-.012em;color:var(--brand-navy)}
.ab-ppl__persp:hover .ab-ppl__pt{color:var(--brand-accent)}
.ab-ppl__roster{margin-top:8px}
.ab-ppl__r{padding:18px 0;border-bottom:1px solid var(--line)}
.ab-ppl__rn{font-family:var(--font-display);font-weight:500;font-size:22px;line-height:1.16;color:var(--brand-navy);margin:0}
.ab-ppl__rr{margin:5px 0 0;font-family:var(--font-sans);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text-eyebrow)}
.ab-ppl__rl{margin:8px 0 0;font-size:15.5px;line-height:1.55;color:var(--text-secondary);max-width:44ch}
.ab-ppl__dev{grid-column:1 / -1}

/* ---- 7 close: one primary action, three routes as equals ---- */
.ab-cl{background:var(--brand-navy);color:var(--text-inverse)}
.ab-cl__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px 40px;padding-top:82px;padding-bottom:92px}
.ab-cl__copy{grid-column:1 / span 5}
.ab-cl__h{font-size:48px;line-height:1.04;letter-spacing:-.028em;color:var(--text-inverse);max-width:12ch;margin-top:4px}
.ab-cl__l{margin-top:18px;font-size:17.5px;line-height:1.6;color:var(--sky-300);max-width:38ch}
.ab-cl__a{display:flex;flex-wrap:wrap;align-items:center;gap:12px 26px;margin-top:30px}
.ab-cl__a .ds-btn--primary{background:var(--brand-accent);border-color:var(--brand-accent);color:var(--brand-navy)}
.ab-cl__a .ds-btn--primary:hover{background:var(--sun-700);border-color:var(--sun-700);color:var(--brand-navy)}
.ab-cl__tel{display:inline-flex;align-items:center;min-height:44px;font-family:var(--font-sans);font-size:14.5px;font-weight:600;color:var(--brand-sky);text-decoration:none}
.ab-cl__tel:hover{color:var(--text-inverse)}
.ab-cl__routes{grid-column:7 / span 6;align-self:center;border-top:1px solid rgba(145,195,235,.3)}
.ab-cl__r{padding:22px 0 18px;border-bottom:1px solid rgba(145,195,235,.3);display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 26px}
.ab-cl__rt{margin:0;font-family:var(--font-display);font-weight:500;font-size:19px;line-height:1.24;letter-spacing:-.012em;color:var(--text-inverse);max-width:26ch}
.ab-cl__r .ab-link{color:var(--brand-sky);padding:0;min-height:0}
.ab-cl__r:hover .ab-link{color:var(--text-inverse)}
.ab-cl__dev{grid-column:1 / -1}

/* ---- motion: html.ab is added by about-motion.js only ---- */
/* The Tier 3 reveal targets the section's direct children. The decorative contour field is a
   direct child too, so it must be excluded: otherwise the reveal drives it to opacity 1 (and
   animates it), overriding its own .04 and breaking the motif's STATIC lock. */
.ab .ab-rv>*:not(.ab-mth__field){opacity:0;transform:translateY(10px)}
.ab .ab-rv.is-in>*:not(.ab-mth__field){opacity:1;transform:none;transition:opacity 300ms cubic-bezier(.2,.6,.2,1),transform 300ms cubic-bezier(.2,.6,.2,1)}
.ab .ab-rv>.ab-mth__field,.ab .ab-rv.is-in>.ab-mth__field{opacity:var(--ap-field-o,.02);transform:none;transition:none}
.ab .ab-hist__set>div,.ab .ab-mth__r,.ab .ab-one__cols>div,.ab .ab-cl__r{opacity:0;transform:translateY(10px)}
.ab .ab-hist.is-in .ab-hist__set>div,.ab .ab-mth.is-in .ab-mth__r,.ab .ab-one.is-in .ab-one__cols>div,.ab .ab-cl.is-in .ab-cl__r{opacity:1;transform:none;transition:opacity 560ms cubic-bezier(.2,.6,.2,1),transform 560ms cubic-bezier(.2,.6,.2,1)}
.ab .ab-hist.is-in .ab-hist__set>div:nth-child(2),.ab .ab-one.is-in .ab-one__cols>div:nth-child(2),.ab .ab-cl.is-in .ab-cl__r:nth-child(2){transition-delay:90ms}
.ab .ab-hist.is-in .ab-hist__set>div:nth-child(3),.ab .ab-one.is-in .ab-one__cols>div:nth-child(3),.ab .ab-cl.is-in .ab-cl__r:nth-child(3){transition-delay:180ms}
.ab .ab-mth.is-in .ab-mth__r:nth-child(2){transition-delay:50ms}
.ab .ab-mth.is-in .ab-mth__r:nth-child(3){transition-delay:100ms}
.ab .ab-mth.is-in .ab-mth__r:nth-child(4){transition-delay:150ms}
.ab .ab-mth.is-in .ab-mth__r:nth-child(n+5){transition-delay:200ms}
@media (prefers-reduced-motion:no-preference){
  .ab .ab-hero__ph img{animation:ab-settle 1300ms cubic-bezier(.2,.6,.2,1) 120ms both}
  .ab .ab-hero__copy>*{animation:ab-rise 760ms cubic-bezier(.2,.6,.2,1) both}
  .ab .ab-hero__copy>:nth-child(1){animation-delay:120ms}
  .ab .ab-hero__copy>:nth-child(2){animation-delay:180ms}
  .ab .ab-hero__copy>:nth-child(3){animation-delay:260ms}
  .ab .ab-hero__copy>:nth-child(4){animation-delay:460ms}
  .ab .ab-hero__copy>:nth-child(5){animation-delay:640ms}
}
@keyframes ab-settle{from{opacity:0;transform:scale(1.03)}to{opacity:1;transform:none}}
@keyframes ab-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ---- responsive ---- */
@container page (max-width:1100px){
  .ab-pband .ds-pband__i{grid-template-rows:36px auto auto;row-gap:8px}
  .ab-pband .ds-pband__v{font-size:36px}
  .ab-pband .ds-pband__i:last-child .ds-pband__v{font-size:24px}
  .ab-pband .ds-pband__set{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:30px;padding-bottom:0}
}
@container page (max-width:1240px){
  .ab-hero__h{font-size:54px}
  .ab-h2{font-size:36px}
  .ab-hist__h{font-size:34px}
  .ab-cl__h{font-size:40px}
  .ab-one__stmt{font-size:27px}
  .ab-mth__head{grid-column:1 / span 4}
  .ab-mth__list{grid-column:6 / span 7}
}
@container page (max-width:900px){
  .ab-hero__g{padding-top:0}
  .ab-hero__copy{grid-column:1 / -1}
  .ab-hero__h{font-size:42px;max-width:24ch}
  .ab-hero__l{font-size:17px}
  .ab-hero__ph{margin-top:32px}
  .ab-hero__ph img{aspect-ratio:16 / 9}
  .ab-hist__ph,.ab-hist__copy{grid-column:1 / -1}
  .ab-hist__copy{margin-top:32px}
  .ab-hist__ph{aspect-ratio:16 / 9;max-height:420px}
  .ab-hist__ph img{aspect-ratio:auto}
  .ab-hist__h{font-size:32px}
  .ab-hist__l{max-width:44ch}
  .ab-mth__g{padding-top:62px;padding-bottom:66px}
  .ab-mth__head,.ab-mth__list{grid-column:1 / -1}
  .ab-mth__list{margin-top:28px}
  .ab-mth__r{grid-template-columns:1fr;row-gap:8px}
  .ab-one__head,.ab-one__stmt{grid-column:1 / -1}
  .ab-one__cols{grid-template-columns:1fr;gap:28px;margin-top:22px}
  .ab-ppl__head{grid-column:1 / -1}
  .ab-ppl__ph{grid-column:1 / span 5;margin-top:34px}
  .ab-ppl__anchor{grid-column:1 / -1;margin-top:30px}
  .ab-cl__g{padding-top:56px;padding-bottom:68px}
  .ab-cl__copy,.ab-cl__routes{grid-column:1 / -1}
  .ab-cl__routes{margin-top:34px}
}
@container page (max-width:700px){
  .ab-pband .ds-pband__set{grid-template-columns:1fr;row-gap:24px}
  .ab-pband .ds-pband__i{grid-template-rows:34px auto auto}
  .ab-pband .ds-pband__v{font-size:34px}
  .ab-pband .ds-pband__i:last-child .ds-pband__v{font-size:23px}
}
@container page (max-width:620px){
  .ab-hero__g,.ab-hist__g,.ab-mth__g,.ab-one__g,.ab-ppl__g,.ab-cl__g{grid-template-columns:minmax(0,1fr);column-gap:0}
  .ab-pband .ds-pband__g{grid-template-columns:minmax(0,1fr);column-gap:0}
  .ab-hero__h{font-size:34px}
  .ab-h2{font-size:27px}
  .ab-hist__h{font-size:26px}
  .ab-hist__set dt{font-size:19px}
  .ab-hist__set>div{grid-template-columns:26px minmax(0,1fr);column-gap:11px}
  .ab-mth__t{font-size:21px}
  .ab-one__t{font-size:24px}
  .ab-one__stmt{font-size:23px}
  .ab-ppl__ph{grid-column:1 / -1}
  .ab-ppl__n{font-size:28px}
  .ab-cl__h{font-size:30px}
}