/* Targeted About polish only. CTA button styling remains inherited and untouched. */
body[data-page=about] #main .designer-section{background-color:#E2DAD1;align-items:start;column-gap:4.5%}
body[data-page=about] #main .editorial.top-rule{background-color:#F1EDE5;column-gap:4.5%;align-items:start;padding-bottom:clamp(52px,5.2vw,76px)}
body[data-page=about] #main :is(.designer-section,.editorial.top-rule) .eyebrow{margin-bottom:18px;color:var(--color-espresso-brand)}
body[data-page=about] #main :is(.designer-section,.editorial.top-rule) .eyebrow::before{width:32px;height:1px;background:var(--color-brass)}
body[data-page=about] #main .designer-section>div:first-child{padding-top:2px}
body[data-page=about] #main .editorial.top-rule .approach-heading{padding:0;max-width:none;background:transparent;border:0}
body[data-page=about] #main .approach-heading h2{margin-bottom:0}

@media(max-width:850px){
 body[data-page=about] #main :is(.designer-section,.editorial.top-rule){row-gap:22px}
 body[data-page=about] #main .designer-section>div:first-child{padding-top:0}
 body[data-page=about] #main .editorial.top-rule{padding-bottom:48px}
 
}

/* Ten percent smaller About hero headline. */
body[data-page=about] #main .page-title h1{font-size:clamp(30.15px,3.267vw,46.8px)!important}
@media(max-width:850px){body[data-page=about] #main .page-title h1{font-size:30.15px!important}}

/* Consistent, five percent smaller About section headings. */
body[data-page=about] #main .about-layout h2,
body[data-page=about] #main .designer-section h2,
body[data-page=about] #main .editorial.top-rule h2{font-size:calc(var(--type-h2) * .95)!important}

/* Five percent less vertical padding in the three About content sections. */
body[data-page=about] #main .about-layout{padding-top:11.4px;padding-bottom:calc(var(--about-space) * .95)}
body[data-page=about] #main :is(.designer-section,.editorial.top-rule){padding-top:clamp(41.8px,4.56vw,64.6px)}
body[data-page=about] #main .designer-section{padding-bottom:clamp(38px,4.18vw,60.8px)}
body[data-page=about] #main .editorial.top-rule{padding-bottom:clamp(49.4px,4.94vw,72.2px)}
@media(max-width:850px){body[data-page=about] #main .editorial.top-rule{padding-bottom:45.6px}}

/* Footer meets the CTA background while its internal padding stays intact. */
body[data-page=about] #main .cta{margin-bottom:0}

/* Image-led studio introduction; retain the original photograph and all copy. */
body[data-page=about] #main .about-layout{padding-top:90px;padding-bottom:clamp(44px,4.5vw,64px);grid-template-columns:minmax(0,46fr) minmax(0,54fr);column-gap:6%;align-items:center}
body[data-page=about] #main .about-photo{width:100%;max-width:none}
body[data-page=about] #main .about-layout>div:last-child{align-self:center;padding-top:0;max-width:56ch}
body[data-page=about] #main .about-layout h1{font-family:var(--sans);font-size:calc(var(--type-page-h1) * .95)!important;font-weight:400!important;letter-spacing:.01em;line-height:1.12!important;margin:0 0 24px}
body[data-page=about] #main .editorial.top-rule{padding-top:clamp(41.8px,4.56vw,64.6px);padding-bottom:clamp(38px,4.18vw,60.8px)}
@media(max-width:850px){
 body[data-page=about] #main .about-layout{grid-template-columns:1fr;padding-top:48px;padding-bottom:44px;row-gap:30px}
 body[data-page=about] #main .about-photo{max-width:480px}
 body[data-page=about] #main .about-layout>div:last-child{max-width:none}
}

/* More compact About image and surrounding space. */
body[data-page=about] #main .about-layout{padding-top:64px;padding-bottom:40px}
body[data-page=about] #main .about-photo{width:90%;justify-self:start}
@media(max-width:850px){
 body[data-page=about] #main .about-layout{padding-top:32px;padding-bottom:32px;row-gap:24px}
 body[data-page=about] #main .about-photo{width:90%}
}

/* Align the introduction with the Designer section and balance image spacing. */
body[data-page=about] #main .about-layout{grid-template-columns:minmax(0,2fr) minmax(0,3fr);column-gap:4.5%;padding-block:48px}
body[data-page=about] #main .about-photo{width:100%;max-width:none}
@media(max-width:850px){
 body[data-page=about] #main .about-layout{grid-template-columns:1fr;padding-block:32px}
 body[data-page=about] #main .about-photo{width:100%;max-width:480px}
}

/* Image ends at the Designer biography's left edge; intro text retains a gap. */
@media(min-width:851px){
 body[data-page=about] #main .about-layout{grid-template-columns:minmax(0,42.7fr) minmax(0,52.8fr);column-gap:4.5%}
 body[data-page=about] #main .about-photo{width:100%;max-width:none}
}

/* Match the introduction heading to Meet the Designer. */
body[data-page=about] #main .about-layout h1{font-size:calc(var(--type-h2) * .95)!important}

/* Studio label echoes the Designer section's editorial label. */
body[data-page=about] #main .about-layout .studio-label{margin-bottom:18px;color:var(--color-espresso-brand)}
body[data-page=about] #main .about-layout .studio-label::before{width:32px;height:1px;background:var(--color-brass)}

/* Trim five percent from every edge without modifying the source image. */
body[data-page=about] #main .about-photo{overflow:hidden}
body[data-page=about] #main .about-photo img{width:125.534436%;max-width:none;margin:-8.536341% -12.767218% -9.620959%;aspect-ratio:1;object-fit:cover}

/* Ten percent smaller About image, retaining the existing crop. */
body[data-page=about] #main .about-photo{width:90%;justify-self:start}

/* Bring the About text slightly closer to the image. */
@media(min-width:851px){body[data-page=about] #main .about-layout{column-gap:3%}}

/* Small final alignment and spacing adjustments, About page only. */
@media(min-width:851px){body[data-page=about] #main .about-layout>div:last-child{position:relative;top:-18px}}
body[data-page=about] #main :is(.designer-section,.editorial.top-rule){padding-top:clamp(36.575px,3.99vw,56.525px);padding-bottom:clamp(33.25px,3.6575vw,53.2px);column-gap:4.5%;align-items:start}
body[data-page=about] #main :is(.designer-section,.editorial.top-rule) .eyebrow{margin-bottom:18px}
body[data-page=about] #main :is(.designer-section,.editorial.top-rule)>div:first-child{padding-top:2px}
body[data-page=about] #main :is(.about-layout,.designer-section,.editorial.top-rule)>div:last-child>p:not(.eyebrow){margin-bottom:20px}
body[data-page=about] #main :is(.about-layout,.designer-section,.editorial.top-rule)>div:last-child>p:last-child{margin-bottom:0}
@media(max-width:850px){body[data-page=about] #main :is(.designer-section,.editorial.top-rule)>div:first-child{padding-top:0}}