.about-studio-page{background:#fff;color:#191817}
.about-hero{padding-top:66px;padding-bottom:62px;text-align:center}
.about-categories{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:0 auto 46px}
.about-categories a{border:1px solid rgba(25,24,23,.08);border-radius:999px;background:#f2f1ef;color:inherit;padding:11px 22px;text-decoration:none;font:11px var(--sans);letter-spacing:.01em;transition:background .25s,transform .25s}
.about-categories a:hover{background:#e5e2dc;transform:translateY(-2px)}
.about-hero .eyebrow{margin-bottom:20px}
.about-hero h1{font:300 clamp(48px,6.7vw,104px)/.93 "Bodoni Moda",var(--serif);letter-spacing:-.065em;margin:0 auto;max-width:920px;color:#3d3a36;font-synthesis:none;font-variation-settings:"opsz" 72,"wght" 300}
.about-hero-copy{display:flex;justify-content:center;gap:55px;margin:30px auto 0;max-width:680px;color:#8c8984}
.about-hero-copy p{font-size:13px;line-height:1.55;max-width:270px;margin:0}
.about-project{padding-top:0;padding-bottom:125px}
.about-project-media{margin:0;overflow:hidden;background:#ddd}
.about-project-media img{display:block;width:100%;aspect-ratio:1.72;object-fit:cover;object-position:center 52%;transition:transform .7s ease}
.about-project-media:hover img{transform:scale(1.025)}
.about-project-caption{display:flex;justify-content:space-between;align-items:end;gap:30px;padding-top:15px}
.about-project-caption h2{font:clamp(30px,4vw,60px)/.92 var(--serif);letter-spacing:-.055em;margin:0}
.about-location{margin:8px 0 0;color:#77736d;font:italic 14px var(--serif)}
.about-project-caption .text-link{color:inherit;margin-bottom:4px}
.about-project-text{width:min(540px,100%);margin:42px auto 0;text-align:center}
.about-project-text p{font:18px/1.5 var(--serif);margin:0 0 23px}
.about-profile{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:8vw;align-items:center;padding-top:110px;padding-bottom:145px;border-top:1px solid rgba(25,24,23,.1)}
.about-profile-media{margin:0;overflow:hidden;background:#ddd}
.about-profile-media img{display:block;width:100%;aspect-ratio:1.5;object-fit:cover;filter:grayscale(1);transition:transform .7s ease}
.about-profile-media:hover img{transform:scale(1.02)}
.about-profile-copy{max-width:490px}
.about-profile-copy h1,.about-profile-copy h2{font:clamp(58px,7vw,110px)/.9 var(--serif);letter-spacing:-.07em;margin:22px 0 35px}
.about-profile-text{font:18px/1.5 var(--serif)}
.about-profile-text p{margin:0 0 22px}
.about-next{padding-top:32px;padding-bottom:135px;border-top:1px solid rgba(25,24,23,.1)}
.about-next-grid{margin-top:23px;border-top:1px solid rgba(25,24,23,.18)}
.about-next-grid a{display:grid;grid-template-columns:70px 1fr auto;align-items:center;gap:16px;padding:19px 0;border-bottom:1px solid rgba(25,24,23,.18);color:inherit;text-decoration:none;font:clamp(23px,3.2vw,46px)/1 var(--serif);letter-spacing:-.04em;transition:padding .25s,background .25s}
.about-next-grid a:hover{padding-left:12px;background:#f7f6f2}
.about-next-grid span{font:10px var(--mono);letter-spacing:.1em;color:#85817a}
.about-next-grid b{font:25px var(--sans);font-weight:400}

/* Phone: the About page is a single, unscrollable introduction with one project image. */
@media(max-width:1000px){
  html:has(.page-about){overflow:hidden}
  .page-about{height:100svh;overflow:hidden;background:#fff}
  .page-about .about-studio-page{height:100svh;padding-top:142px;display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden}
  .page-about .about-hero{padding:13px 18px 11px}
  .page-about .about-hero .eyebrow{display:none}
  .page-about .about-hero h1{max-width:430px;font-size:clamp(34px,9.8vw,43px);line-height:.91;letter-spacing:-.058em;font-variation-settings:"opsz" 14,"wght" 300}
  .page-about .about-hero-copy{display:block;margin-top:13px}
  .page-about .about-hero-copy p{max-width:350px;margin:0 auto 4px;font-size:10px;line-height:1.3;letter-spacing:.065em}
  .page-about .about-hero-copy p:last-child{margin-bottom:0}
  .page-about .about-project{min-height:0;padding:0 20px 10px;display:flex;flex-direction:column;overflow:hidden}
  .page-about .about-project-media{min-height:0;flex:1;margin:0}
  .page-about .about-project-media img{width:100%;height:100%;aspect-ratio:auto;object-position:center 52%}
  .page-about .about-project-caption{display:flex;flex:0 0 auto;align-items:end;padding-top:7px}
  .page-about .about-project-caption h2{font-size:19px;line-height:.95}
  .page-about .about-location{margin-top:3px;font-size:9px}
  .page-about .about-project-caption .text-link,.page-about .about-project-text,.page-about .about-profile,.page-about .about-next,.page-about>.site-footer{display:none}
}
@media(max-width:700px){.about-hero{padding-top:46px;padding-bottom:48px}.about-categories{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;margin:0 -24px 38px;padding:0 24px 4px;scrollbar-width:none}.about-categories::-webkit-scrollbar{display:none}.about-categories a{white-space:nowrap;padding:10px 16px;font-size:10px}.about-hero h1{font-size:49px}.about-hero-copy{display:block;margin-top:24px}.about-hero-copy p{margin:0 auto 12px;font-size:12px}.about-project{padding-bottom:84px}.about-project-media img{aspect-ratio:.95}.about-project-caption{display:block;padding-top:13px}.about-project-caption h2{font-size:35px}.about-project-caption .text-link{margin-top:18px}.about-project-text{margin-top:31px}.about-project-text p{font-size:17px}.about-profile{display:flex;flex-direction:column;gap:42px;padding-top:78px;padding-bottom:88px}.about-profile-media{width:100%}.about-profile-media img{aspect-ratio:.92}.about-profile-copy{width:100%}.about-profile-copy h2{font-size:61px;margin:18px 0 28px}.about-profile-text{font-size:18px}.about-next{padding-bottom:82px}.about-next-grid a{grid-template-columns:38px 1fr auto;font-size:24px}.about-next-grid b{font-size:20px}}
