/* Independent About columns keep each lower section with its own content. */
@media (min-width:751px){
 body[data-page="about"] .about-page{display:grid;grid-template-columns:minmax(0,.39fr) minmax(0,.61fr);column-gap:clamp(28px,4vw,56px);align-items:start;align-content:start;padding-top:14px}
 body[data-page="about"] .oversize-ten{font-size:clamp(198px,20.8vw,293px)}
 body[data-page="about"] .about-column{display:flex;flex-direction:column;min-width:0;gap:clamp(18px,2vw,26px)}
 body[data-page="about"] .about-editorial .editorial-copy{max-width:min(100%,80ch)}
 body[data-page="about"] .about-contact-copy{max-width:100%}
 body[data-page="about"] .about-representation,body[data-page="about"] .about-contact{min-width:0;grid-template-columns:minmax(0,1fr);gap:8px;align-content:start;padding:16px 0 0}
 body[data-page="about"] .about-representation p,body[data-page="about"] .about-contact-copy>p{font-size:1rem;line-height:1.4}
 body[data-page="about"] .about-contact h2{font-size:clamp(30px,3vw,42px);line-height:1;margin-top:11px}
 body[data-page="about"] .about-contact-copy>p{margin-bottom:13px}
}
@media (max-width:750px){
 body[data-page="about"] .about-page{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
 body[data-page="about"] .about-column,body[data-page="about"] .about-identity{display:contents}
 body[data-page="about"] .about-editorial{grid-area:auto;grid-row:1;margin-bottom:26px;min-width:0}
 body[data-page="about"] .about-identity .metadata{grid-area:auto;grid-row:2;margin:0 0 8px}
 body[data-page="about"] .about-representation{grid-row:3;margin-top:22px}
 body[data-page="about"] .about-contact{grid-row:4}
 body[data-page="about"] .about-representation,body[data-page="about"] .about-contact{grid-template-columns:minmax(0,1fr);gap:8px;padding:17px 0}
}

/* Keep the About grid in natural flow within the desktop page shell. */
@media (min-width:900px){
 body[data-page="about"]>main{flex:1 1 auto}
 body[data-page="about"] .about-page{flex:0 0 auto;justify-content:normal}
}
@media (min-width:900px) and (max-height:1080px){
 body[data-page="about"] .site-footer{margin-top:16px}
}

/* Short desktop shell rhythm; tall desktop and mobile retain their spacing. */
@media (min-width:1024px) and (max-height:950px){
 body[data-page="about"]{min-height:0;display:block}
 body[data-page="about"]>main{min-height:55vh;display:block}
 body[data-page="about"] .about-column{gap:18px}
 body[data-page="about"] .about-contact{padding-top:12px}
 body[data-page="about"] .about-signal-entry{margin-top:16px;padding-top:10px}
 body[data-page="about"] .site-footer{margin-top:8px}
}