.about-intro{display:grid;grid-template-columns:1fr 1fr;background:var(--surface)}
.about-title{padding:70px var(--margin);padding-right:48px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:28px}
.about-title h1{font-size:var(--display)}
.about-title p{font-size:18px;max-width:40ch}
.about-intro>img{height:570px}
.about-story{display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:start}
.about-story h2{max-width:14ch}
.about-story p{max-width:46ch;margin-bottom:24px}
.about-purpose{background:var(--ink);color:var(--light)}
.about-purpose .service-heading>p{color:var(--on-dark)}
.purpose-grid{display:grid;grid-template-columns:1fr 1fr;gap:7vw}
.purpose-grid article{padding:38px;background:#353a3c}
.purpose-grid h3{font-size:32px;margin-bottom:24px}
.purpose-grid p{max-width:44ch}
.about-works{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.about-works figure{min-width:0}
.about-works img{height:380px}
.about-works figcaption{margin-top:18px;font-size:18px}
.about-offices{background:var(--surface)}
.about-offices .offices{grid-template-columns:1fr 1fr;margin:0;gap:7vw}
.about-offices h2{margin-bottom:40px}
.about-offices .offices h3{font-size:24px}
.about-offices .offices p{font-size:18px}
@media(max-width:800px){.about-title{padding-block:48px;padding-right:30px}.about-title h1{font-size:64px}.about-intro>img{height:560px}.about-story{gap:32px}.purpose-grid{gap:28px}.purpose-grid article{padding:28px}.about-works img{height:330px}}
@media(max-width:600px){.about-intro{grid-template-columns:1fr}.about-title{padding:44px var(--margin);gap:24px}.about-title h1{font-size:56px}.about-intro>img{height:290px}.about-story,.purpose-grid,.about-works{grid-template-columns:1fr;gap:28px}.about-story p:last-child{margin-bottom:0}.about-purpose .service-heading h2{font-size:40px}.purpose-grid h3{font-size:30px}.about-works img{height:300px}.about-offices .offices{grid-template-columns:1fr;gap:32px}}