
.about-page{--editorial:'Instrument Serif',Georgia,serif;--ice:#e7f1f8;background:#fff;color:var(--navy)}
.about-page .site-header{height:86px;padding-inline:4%;border-bottom:0}
.about-page .site-header nav a[aria-current=page]{color:var(--blue)}
.about-page .editorial-title{font-family:var(--editorial);font-weight:400;letter-spacing:-.035em;line-height:.95}
.about-page .eyebrow{font-size:10px;letter-spacing:.14em;font-weight:500}
.ceo-story{position:relative}
.ceo-stage{padding:20px 4% 32px}
.about-kicker{display:flex;justify-content:space-between;font-size:9px;line-height:1.4;letter-spacing:.1em}
#about-title{font-size:clamp(88px,12.5vw,200px);text-align:center;margin:18px 0 28px}
.ceo-visual{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:center;max-width:1440px;margin:auto}
.ceo-portrait{margin:0;width:min(100%,560px);justify-self:center}
.ceo-image{aspect-ratio:1;overflow:hidden;border-radius:5px;background:#ece8e2}
.ceo-image img{display:block;width:100%;height:100%;object-fit:contain}
.ceo-portrait figcaption{display:flex;justify-content:space-between;gap:12px;margin-top:12px;font-size:9px;line-height:1.4;color:var(--slate)}
.ceo-portrait figcaption>span:first-child{color:var(--navy);letter-spacing:.1em}
.ceo-copy{max-width:470px;padding:12px 0}
.ceo-copy .eyebrow{color:var(--blue);margin-bottom:23px}
.ceo-copy h2{font-size:clamp(54px,6vw,90px);margin-bottom:24px}
.ceo-copy>p:not(.eyebrow){font-size:14px;color:var(--slate);line-height:1.8;max-width:385px;margin-top:15px}
.ceo-copy>p.ceo-lead{font-size:17px;line-height:1.5;color:var(--navy);margin:0 0 22px}
.ceo-signoff{font-size:9px;letter-spacing:.12em;margin-top:28px;color:var(--blue)}
.ceo-opening-note{display:none}
.scroll-note{display:flex;justify-content:center;align-items:center;gap:14px;font-size:8px;letter-spacing:.15em;margin-top:35px;color:var(--slate)}
.scroll-line{height:1px;width:30px;background:#7d9aad}
.scroll-note>span:last-child{font-size:17px;color:var(--blue)}
/* The page scrolls normally; only the CEO composition holds for a short chapter. */
@media(min-width:901px) and (min-height:700px){
 .scroll-story .ceo-story{height:195svh}
 .scroll-story .ceo-stage{position:sticky;top:0;height:calc(100svh - 86px);padding-top:18px;display:flex;flex-direction:column}
 .scroll-story #about-title{font-size:min(12vw,17svh);margin:16px 0 20px;flex:none}
 .scroll-story .ceo-visual{width:100%;max-width:1440px;flex:1;min-height:0;display:block}
 .scroll-story .ceo-portrait{position:absolute;width:min(44vw,49svh,560px);left:50%;top:50%;transform:translate(calc(-50% - var(--portrait-shift,0px)),-50%);will-change:transform}
 .scroll-story .ceo-copy{position:absolute;left:56%;width:40%;top:50%;opacity:var(--profile-opacity,0);transform:translateY(calc(-50% + var(--profile-rise,40px)));will-change:transform,opacity}
 .scroll-story .ceo-copy h2{font-size:min(6.3vw,9svh,94px);margin-bottom:20px}
 .scroll-story .ceo-copy>p:not(.eyebrow){font-size:clamp(12px,1vw,15px);line-height:1.7;margin-top:12px}
 .scroll-story .ceo-copy>p.ceo-lead{font-size:clamp(15px,1.3vw,19px);margin:0 0 16px}
 .scroll-story .ceo-copy .eyebrow{margin-bottom:18px}
 .scroll-story .ceo-signoff{margin-top:20px}
 .scroll-story .ceo-opening-note{display:block;position:absolute;left:3%;top:48%;opacity:var(--opening-opacity,1);transform:translateY(-50%);pointer-events:none}
 .ceo-opening-note>span{font-size:8px;letter-spacing:.13em;color:var(--blue)}
 .ceo-opening-note>p{font-family:var(--editorial);font-size:clamp(23px,2.2vw,35px);line-height:1.15;margin-top:14px}
 .scroll-story .scroll-note{flex:none;margin-top:20px;opacity:var(--opening-opacity,1)}
}
.people-intro{position:relative;text-align:center;background:var(--ice);padding:115px 5% 45px}
.people-intro .eyebrow{color:var(--blue);margin-bottom:42px}
.people-intro h2{font-size:clamp(78px,13vw,198px)}
.people-intro h2 span{display:block}
.people-intro h2 span:last-child{color:var(--blue)}
.people-statement{font-size:15px;line-height:1.7;max-width:560px;margin:40px auto 80px}
.people-index{display:flex;justify-content:space-between;gap:18px;max-width:1200px;margin:auto;padding-top:25px;border-top:1px solid #bfd1df;color:var(--slate);font-size:10px}
.department-chapter{position:relative;padding:100px 5% 125px;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:8%;align-items:start;max-width:1700px;margin:auto}
.department-chapter+.department-chapter{border-top:1px solid var(--line)}
.department-copy{position:sticky;top:100px;padding-top:15px}
.department-meta{display:flex;align-items:center;gap:14px;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--slate);margin-bottom:32px}
.department-dot{width:6px;height:6px;border-radius:50%;background:var(--blue);flex:none;transition:background .65s}
.department-copy h2{font-size:clamp(52px,5.6vw,90px);max-width:430px;margin-bottom:28px;transition:color .7s}
.department-copy>p{font-size:14px;line-height:1.9;color:var(--slate);max-width:315px}
.team-portraits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:65px 28px}
.team-member{margin:0;min-width:0}
.team-member .portrait{display:block;aspect-ratio:1;overflow:hidden;border-radius:5px;background:#ece8e2;transition:filter 900ms ease}
.team-member img{display:block;width:100%;height:100%;object-fit:contain}
.team-member figcaption{display:flex;justify-content:space-between;gap:8px;margin-top:13px;font-size:9px;color:var(--slate);line-height:1.5}
.team-member figcaption>span:last-child{font-size:8px;letter-spacing:.06em}
.department-executive .team-portraits,.department-closing .team-portraits{display:block;max-width:580px;width:100%;justify-self:end}
.department-assistants .team-member:nth-child(2){margin-top:115px}
.department-design{padding-block:110px 160px}
.department-design .team-portraits{grid-template-columns:repeat(3,minmax(0,1fr));gap:55px 20px}
.department-design .team-member:nth-child(3n + 2){margin-top:70px}
.department-design .team-member:nth-child(3n){margin-top:140px}
.department-design .team-member figcaption{font-size:8px}
.departments.has-focus .department-chapter:not(.is-active) .portrait{filter:grayscale(1)}
.departments.has-focus .department-chapter:not(.is-active) .department-dot{background:#a7b4bd}
.department-chapter.is-active .department-copy h2{color:var(--blue)}
.about-closing{padding:105px 5% 100px;text-align:center;background:var(--navy);color:white}
.about-closing .eyebrow{color:#b1d6ef;margin-bottom:42px}
.about-closing h2{font-size:clamp(75px,12vw,185px)}
.about-project-link{display:inline-flex;align-items:center;gap:50px;padding:17px 0 10px;margin-top:40px;border:0;border-bottom:1px solid #7195ae;background:transparent;color:white;font-size:14px}
.about-project-link>span{font-size:25px;transition:transform .2s}
.about-project-link:hover>span{transform:translate(3px,-3px)}
.about-closing>p:last-child{color:#b9cbd9;font-size:10px;margin-top:26px}
.about-page footer{padding-top:35px}
.about-page footer>p{justify-content:flex-start}
.about-no-script{padding:60px 5%;max-width:850px}
.about-no-script p{margin-top:20px}
/* Reveal only elements below the initial viewport. Content is visible if JS is unavailable. */
.motion-ready [data-reveal]{opacity:0;transform:translateY(30px);transition:opacity .85s ease,transform 1.1s cubic-bezier(.2,.65,.3,1)}
.motion-ready [data-reveal].is-visible{opacity:1;transform:none}
.motion-ready .people-intro h2 span:nth-child(2){transition-delay:.12s}
@media(max-width:1100px){
 .department-chapter{gap:5%;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr)}
 .department-design .team-portraits{gap:40px 12px}
 .department-design .team-member figcaption{display:block}
 .department-design .team-member figcaption>span:last-child{display:block;margin-top:2px}
}
@media(max-width:900px){
 .about-page .site-header{height:80px}
 .ceo-stage{padding-top:16px}
 #about-title{font-size:15vw;margin-top:32px;margin-bottom:35px}
 .ceo-visual{display:flex;flex-direction:column;gap:0}
 .ceo-portrait{width:min(100%,560px)}
 .ceo-copy{max-width:560px;width:100%;padding:75px 0 30px}
 .ceo-copy h2{font-size:clamp(65px,10vw,90px)}
 .ceo-copy>p:not(.eyebrow){max-width:460px}
 .scroll-note{display:none}
 .people-intro{padding-top:85px}
 .department-chapter{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:6%;padding-block:80px}
 .department-copy{top:55px}
 .department-copy h2{font-size:50px}
 .department-copy>p{font-size:13px}
 .department-design .team-portraits{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 15px}
 .department-design .team-member:nth-child(n){margin-top:0}
 .department-design .team-member:nth-child(even){margin-top:65px}
 .department-assistants .team-portraits{gap:20px}
 .department-assistants .team-member:nth-child(2){margin-top:65px}
}
@media(max-width:600px){
 .about-page .site-header{height:74px;padding-inline:6%}
 .ceo-stage{padding:16px 6% 55px}
 .about-kicker{font-size:7px;letter-spacing:.09em}
 .about-kicker>span:last-child{display:none}
 #about-title{font-size:17vw;margin:25px 0 28px}
 .ceo-portrait figcaption{font-size:8px}
 .ceo-portrait figcaption>span:last-child{max-width:160px;text-align:right}
 .ceo-copy{padding-top:70px;padding-bottom:0}
 .ceo-copy h2{font-size:67px;margin-bottom:27px}
 .ceo-copy>p:not(.eyebrow){font-size:14px;line-height:1.8}
 .ceo-copy>p.ceo-lead{font-size:17px}
 .ceo-signoff{margin-top:28px}
 .people-intro{padding:70px 6% 30px}
 .people-intro .eyebrow{margin-bottom:32px}
 .people-intro h2{font-size:17vw}
 .people-statement{font-size:13px;margin:32px auto 50px;line-height:1.8}
 .people-index{display:grid;grid-template-columns:1fr 1fr;text-align:left;gap:15px;font-size:9px}
 .department-chapter{display:block;padding:55px 6% 65px}
 .department-copy{position:static;padding:0;margin-bottom:33px}
 .department-meta{margin-bottom:22px;font-size:8px}
 .department-copy h2{font-size:60px;margin-bottom:20px;max-width:340px}
 .department-copy>p{font-size:13px;max-width:340px;line-height:1.8}
 .team-portraits{gap:35px 14px}
 .department-assistants .team-portraits{gap:14px}
 .department-assistants .team-member:nth-child(2){margin-top:55px}
 .department-design .team-portraits{gap:35px 14px}
 .department-design .team-member:nth-child(even){margin-top:50px}
 .team-member figcaption{font-size:8px;margin-top:9px}
 .department-executive .team-member figcaption,.department-closing .team-member figcaption{font-size:9px}
 .about-closing{padding:70px 6%}
 .about-closing .eyebrow{margin-bottom:30px}
 .about-closing h2{font-size:17vw}
 .about-project-link{font-size:13px;gap:45px;margin-top:30px}
}
@media(prefers-reduced-motion:reduce){
 .motion-ready [data-reveal]{opacity:1;transform:none;transition:none}
 .team-member .portrait,.department-copy h2,.department-dot{transition:none}
 .about-page{scroll-behavior:auto}
}

@media(prefers-reduced-motion:no-preference){
 #about-title{animation:about-title-arrive 1s cubic-bezier(.2,.65,.3,1) both}
 .ceo-image{animation:about-portrait-arrive 1.2s .15s ease both}
}
@keyframes about-title-arrive{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes about-portrait-arrive{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}

@media(min-width:901px) and (min-height:700px) and (max-height:800px){
 .scroll-story .ceo-copy{top:60%}
 .scroll-story .ceo-copy h2{font-size:8svh}
}
