@import url('https://fonts.googleapis.com/css2?family=Newsreader:opsz,wght@6..72,400&display=swap');

.about-opening{background:#fff}
.about-opening-inner{padding:48px 0 86px;text-align:center}
.about-opening h2{max-width:1190px;margin:0 auto;font-size:clamp(38px,3.8vw,52px);font-weight:400;line-height:1.105;letter-spacing:-.044em;text-wrap:balance}
.about-opening-accent{font-family:'Newsreader',Georgia,serif;font-weight:400;font-style:normal;font-size:1.06em;letter-spacing:-.02em;white-space:nowrap}
.site-nav>a[aria-current="page"]{color:var(--cobalt)}

.about-philosophy{--philosophy-wash:linear-gradient(110deg,#eefbf7 0%,#f3efff 51%,#edf0ff 100%);background:var(--philosophy-wash)}
.about-philosophy-intro{padding-top:42px}
.about-philosophy-intro p{color:var(--slate);font-size:12px;font-weight:600;line-height:1.3;letter-spacing:.085em;text-transform:uppercase}
.about-growth{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(420px,40svh,510px);background:var(--philosophy-wash)}
.about-growth-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:brightness(1.26) saturate(1.18)}
.about-growth-mask{position:absolute;inset:0;display:flex;justify-content:center;align-items:flex-start;padding:clamp(54px,6vw,91px) 3vw 90px;background:linear-gradient(180deg,transparent 54%,#fff 100%),var(--philosophy-wash)}
.about-growth.is-ready .about-growth-mask{mix-blend-mode:screen}
.about-growth h1{width:100%;font-weight:700;line-height:.9;letter-spacing:-.075em;text-align:center;text-transform:uppercase;-webkit-text-stroke:2px #000;paint-order:stroke fill}
.about-growth h1 span{display:block;white-space:nowrap}
.about-growth h1 span:first-child{font-size:clamp(78px,11vw,166px)}
.about-growth h1 span:last-child{font-size:clamp(55px,7.5vw,114px);margin-top:clamp(24px,3.1vw,48px)}

.about-principles{background:#fff;padding:0 0 92px}
.about-principles-intro{text-align:center}
.about-principles-label{color:var(--slate);font-size:12px;font-weight:600;line-height:1.3;letter-spacing:.085em;text-transform:uppercase}
.about-principles-intro h2{margin:15px auto 0;font-size:clamp(48px,5.1vw,70px);font-weight:500;line-height:1.04;letter-spacing:-.058em;text-wrap:balance}
.about-principles-intro>p:last-child{max-width:670px;margin:18px auto 0;color:var(--slate);font-size:19px;line-height:1.45;text-wrap:balance}
.about-principles-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:55px}
.about-principle-card{min-width:0;min-height:310px;padding:34px 38px 37px;border-radius:22px;background:var(--cool);display:flex;flex-direction:column}
.about-principle-heading{display:flex;align-items:center;gap:20px}
.about-principle-icon{width:60px;height:60px}
.about-principle-heading h3{font-size:29px;font-weight:500;line-height:1.1;letter-spacing:-.04em}
.about-principle-card>p{max-width:490px;margin-top:auto;font-family:'Newsreader',Georgia,serif;font-size:clamp(36px,3.5vw,48px);font-weight:400;line-height:1.08;letter-spacing:-.025em;text-wrap:balance}

.about-people{background:#fff;padding:0 0 118px}
.about-people-intro{padding-top:72px;border-top:1px solid var(--line);text-align:left}
.about-section-label{color:var(--slate);font-size:12px;font-weight:600;line-height:1.3;letter-spacing:.085em;text-transform:uppercase}
.about-people-intro h2{max-width:940px;margin-top:25px;font-size:clamp(47px,5.5vw,78px);font-weight:500;line-height:1.06;letter-spacing:-.056em;text-wrap:balance}
.about-people-intro h2 span{font-family:'Newsreader',Georgia,serif;font-weight:400;letter-spacing:-.035em}
.about-people-group{margin-top:91px}
.about-people-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:24px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.about-people-heading h3{font-size:clamp(34px,3.15vw,44px);font-weight:500;line-height:1.08;letter-spacing:-.045em}
.about-people-heading p{color:var(--slate);font-size:13px;line-height:1.4}
.about-team-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.about-person-card{min-width:0;margin:0;overflow:hidden;border:1px solid var(--line);border-radius:15px;background:var(--cool)}
.about-person-photo{width:100%;aspect-ratio:1;overflow:hidden;background-color:#e5e8ec;background-repeat:no-repeat}
.about-person-photo img{display:block;width:100%;height:100%;object-fit:cover}
.portrait-sheet{background-image:url('assets/team-portraits-contact-sheet.png');background-size:300% 300%}
.portrait-sheet--1{background-position:0% 0%}.portrait-sheet--2{background-position:50% 0%}.portrait-sheet--3{background-position:100% 0%}
.portrait-sheet--4{background-position:0% 50%}.portrait-sheet--5{background-position:50% 50%}.portrait-sheet--6{background-position:100% 50%}
.portrait-sheet--7{background-position:0% 100%}.portrait-sheet--8{background-position:50% 100%}.portrait-sheet--9{background-position:100% 100%}
.about-person-card figcaption{display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-height:98px;padding:22px 24px 23px}
.about-person-card strong{font-size:25px;font-weight:600;line-height:1.1;letter-spacing:-.04em}
.about-person-card figcaption span{color:var(--slate);font-size:14px;line-height:1.3}
.about-network{padding:100px 0 116px;background:var(--cool)}
.about-network-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.47fr);align-items:end;gap:45px;margin-bottom:35px}
.about-network-heading h2{max-width:780px;margin-top:17px;font-size:clamp(40px,4.3vw,60px);font-weight:500;line-height:1.08;letter-spacing:-.052em;text-wrap:balance}
.about-network-heading>p{max-width:320px;padding-bottom:7px;color:var(--slate);font-size:17px;line-height:1.45}
.about-network-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.about-person-card--network{background:#fff}
.about-person-card--network figcaption{min-height:88px;padding:18px 17px 20px}
.about-person-card--network strong{font-size:20px}
.about-person-card--network figcaption span{font-size:13px}

@media(max-width:1080px){
  .about-principle-card{min-height:290px;padding:29px 31px 32px}
  .about-team-grid{gap:15px}
  .about-network-grid{gap:10px}
  .about-person-card--network figcaption{padding:16px 13px 18px}
  .about-person-card--network strong{font-size:18px}
}

@media(max-width:900px){
  .about-network-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
}

@media(max-width:720px){
  .about-opening-inner{padding:45px 0 72px}
  .about-opening h2{font-size:clamp(31px,7.1vw,43px);line-height:1.13;letter-spacing:-.04em}
  .about-philosophy-intro{padding-top:27px}
  .about-growth{min-height:clamp(390px,50svh,480px)}
  .about-growth-mask{padding:62px 14px 65px}
  .about-growth h1{letter-spacing:-.07em;-webkit-text-stroke:1px #000}
  .about-growth h1 span:first-child{font-size:clamp(45px,12.2vw,82px)}
  .about-growth h1 span:last-child{font-size:clamp(27px,7.45vw,49px);margin-top:27px}
  .about-principles{padding-bottom:72px}
  .about-principles-intro h2{font-size:clamp(43px,9vw,58px)}
  .about-principles-intro>p:last-child{font-size:17px}
  .about-principles-grid{grid-template-columns:1fr;gap:12px;margin-top:37px}
  .about-principle-card{padding:28px;min-height:250px}
  .about-principle-card>p{font-size:clamp(35px,7.5vw,43px)}
  .about-people{padding-bottom:80px}
  .about-people-intro{padding-top:56px}
  .about-people-intro h2{font-size:clamp(42px,8vw,58px)}
  .about-people-group{margin-top:66px}
  .about-people-heading{align-items:start;flex-direction:column;gap:10px}
  .about-team-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
  .about-person-card figcaption{min-height:84px;padding:17px 17px 19px}
  .about-person-card strong{font-size:22px}
  .about-network{padding:77px 0 86px}
  .about-network-heading{display:block}
  .about-network-heading>p{margin-top:17px;padding-bottom:0}
  .about-network-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
}

@media(max-width:560px){
  .about-principle-heading h3{font-size:26px}
  .about-principle-icon{width:53px;height:53px}
  .about-team-grid{grid-template-columns:1fr;gap:17px}
  .about-person-photo{aspect-ratio:1.14}
  .about-person-card--network .about-person-photo{aspect-ratio:1}
  .about-person-card--network strong{font-size:18px}
}
