/* A connected company statement, followed by the audience it serves. */
body.home.about-page { --about-copy:#a0a0a0; }
body.home.about-page .navbar-row { margin-bottom:0; }
body.about-page .about-manifesto .container-main { display:block; width:100%; max-width:var(--measure-main); margin-inline:auto; padding-inline:var(--gutter); }
body.about-page .about-intro { padding:80px 0 56px; }
body.about-page .about-intro .b-eyebrow { margin:0 0 28px; }
body.about-page .about-intro h1 { margin:0 0 32px; font:500 clamp(30px,2.85vw,38px)/1.14 'Inter Tight',Arial,sans-serif; letter-spacing:-.022em; color:#dedede; }
body.about-page .manifesto-prose,
body.about-page .audience-copy { max-width:66ch; }
body.about-page .manifesto-prose p,
body.about-page .audience-copy p { margin:0 0 24px; font:400 16px/1.65 'IBM Plex Sans',Arial,sans-serif; color:var(--about-copy); }
body.about-page .manifesto-prose p:last-child,
body.about-page .audience-copy p:last-child { margin-bottom:0; }
body.about-page .about-audience { padding:0 0 96px; }
body.about-page .about-audience .container-main::before { content:''; display:block; height:1px; background:#333; margin-bottom:32px; }
body.about-page .about-audience h2 { margin:0 0 24px; font:500 22px/1.25 'Inter Tight',Arial,sans-serif; letter-spacing:-.015em; color:#dedede; }
body.about-page .manifesto-actions { display:flex; align-items:center; flex-wrap:wrap; gap:20px 28px; margin-top:32px; }
body.about-page .manifesto-actions .b-btn { background:#cfcfcf; border-color:#cfcfcf; color:#1a1a1a; width:auto; min-height:48px; }
body.about-page .about-work-link { display:inline-flex; align-items:center; min-height:44px; color:#aaa; font:400 14px/1.5 'IBM Plex Sans',Arial,sans-serif; text-decoration:none; }
body.about-page .about-work-link:hover { color:#eee; }
body.about-page .about-work-link span { margin-left:12px; }
@media(prefers-reduced-motion:no-preference) {
    html.about-pending body.about-page :is(.about-kicker,.about-intro h1 span,.manifesto-prose p),
    body.about-page.about-motion-ready :is(.about-kicker,.about-intro h1 span,.manifesto-prose p) {
        opacity:0;
        filter:blur(10px);
    }
    body.about-page.about-motion-ready.about-fold-ready .about-kicker {
        animation:hm-hero-phrase-in 760ms cubic-bezier(.25,.1,.25,1) 80ms both;
    }
    body.about-page.about-motion-ready.about-fold-ready .about-intro h1 span:first-child {
        animation:hm-hero-phrase-in 900ms cubic-bezier(.25,.1,.25,1) 170ms both;
    }
    body.about-page.about-motion-ready.about-fold-ready .about-intro h1 span:last-child {
        animation:hm-hero-phrase-in 900ms cubic-bezier(.25,.1,.25,1) 260ms both;
    }
    body.about-page.about-motion-ready.about-fold-ready .manifesto-prose p:first-child {
        animation:hm-hero-phrase-in 900ms cubic-bezier(.25,.1,.25,1) 390ms both;
    }
    body.about-page.about-motion-ready.about-fold-ready .manifesto-prose p:last-child {
        animation:hm-hero-phrase-in 900ms cubic-bezier(.25,.1,.25,1) 480ms both;
    }
    body.about-page.about-motion-ready .about-home-visual .line {
        transform:scaleX(0);
        transform-origin:left center;
    }
    body.about-page.about-motion-ready.about-fold-ready .about-home-visual .line {
        animation:hm-curve-in var(--hm-curve-dur) var(--hm-fold-ease) both;
        animation-delay:calc(720ms + (var(--i,0) * 14ms));
    }
    body.about-page.about-motion-ready .about-reveal {
        opacity:0;
        filter:blur(8px);
        transition:
            opacity 620ms cubic-bezier(.32,.72,0,1),
            filter 720ms cubic-bezier(.32,.72,0,1);
        transition-delay:var(--about-delay,0ms);
    }
    body.about-page.about-motion-ready .about-reveal--scale {
        transform:scale(.985);
        transform-origin:50% 50%;
        transition:
            opacity 620ms cubic-bezier(.32,.72,0,1),
            filter 720ms cubic-bezier(.32,.72,0,1),
            transform 760ms cubic-bezier(.32,.72,0,1);
        transition-delay:var(--about-delay,0ms);
    }
    body.about-page.about-motion-ready .about-reveal.is-visible {
        opacity:1;
        filter:blur(0);
        transform:none;
    }
}
@media(max-width:700px) {
 body.about-page .about-manifesto .container-main { padding-inline:var(--gutter); }
 body.about-page .about-intro { padding:48px 0 40px; }
 body.about-page .about-audience { padding-bottom:64px; }
 body.about-page .manifesto-prose p,body.about-page .audience-copy p { font-size:15px; line-height:1.6; }
 body.about-page .manifesto-actions { gap:12px; flex-direction:column; align-items:flex-start; }
}

/* Shares the homepage system studies' projection, rim geometry and neutral ink. */
body.about-page .about-linework { margin:16px 0 48px; overflow:hidden; }
body.about-page .about-linework svg { display:block; width:100%; height:auto; }
.about-matter-study text { font-family:'IBM Plex Mono',monospace; letter-spacing:.5px; }
.study-title { font-size:7px; fill:#c7c7c7; }
.study-ink { font-size:7px; fill:#a9a9a9; }
.study-small { font-size:5.5px; fill:#b5b5b5; letter-spacing:.3px; }
.study-matter { font-size:9px; fill:#dedede; }
.study-exception { font-size:7px; fill:#b8a274; }
.study-secondary { font-size:5.5px; fill:#8e8e8e; letter-spacing:.3px; }
@media(max-width:700px) {
 body.about-page .about-linework { margin:8px 0 32px; }
 body.about-page .about-linework svg { width:125%; max-width:none; margin-left:-12.5%; }
 .about-matter-study .study-secondary { font-size:6px; }
}

body.about-page .about-engagements { margin-top:48px; max-width:66ch; }
@media(max-width:700px) {
 body.about-page .about-engagements { margin-top:36px; }
}

body.about-page .about-linework:focus-visible { outline:1px solid #77766d; outline-offset:6px; }

@media print {
 body.about-page .about-reveal { opacity:1; filter:none; transform:none; transition:none; }
}

/* Operations follows the company introduction, before the audience and CTA. */
body.home.about-page .b-ops { padding:24px 0 80px; }
body.home.about-page .b-ops .container-main { margin-bottom:40px; }
body.home.about-page .ops-card-title { font-size:22px; }
body.home.about-page .ops-card-copy { padding:24px 24px 32px; gap:8px; }
body.home.about-page .ops-card-body { margin-top:4px; color:var(--site-copy); }
@media(max-width:940px) {
 body.home.about-page .ops-rail { overflow-x:auto; scroll-snap-type:x mandatory; -webkit-mask-image:none; mask-image:none; }
 body.home.about-page .ops-track { animation:none; transform:none; padding-right:24px; }
}
@media(max-width:600px) {
 body.home.about-page .b-ops { padding:16px 0 56px; }
 body.home.about-page .ops-card-title { font-size:21px; }
}

/* Keep the operations rail inside the shared page column. */
body.home.about-page .ops-flow {
    width:100%;
    max-width:var(--measure-main);
    margin-inline:auto;
    padding-inline:var(--gutter);
    box-sizing:border-box;
}
body.home.about-page .ops-track { padding-left:0; }

/* A quiet, text-only audience grid. */
body.about-page .audience-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    list-style:none;
    margin:32px 0 0;
    padding:0;
    border-top:1px solid var(--site-edge,#303030);
}
body.about-page .audience-grid li {
    padding:28px 32px 28px 0;
    border-bottom:1px solid var(--site-edge,#303030);
    color:var(--site-copy,#ababab);
    font:400 20px/1.35 'Suisse Intl',Arial,sans-serif;
    letter-spacing:-.01em;
}
body.about-page .audience-grid li:nth-child(even) {
    padding-left:32px;
    border-left:1px solid var(--site-edge,#303030);
}
@media(max-width:600px) {
    body.about-page .audience-grid { grid-template-columns:1fr; margin-top:24px; }
    body.about-page .audience-grid li,
    body.about-page .audience-grid li:nth-child(even) { padding:22px 0; border-left:0; font-size:18px; }
}

/* The homepage line field connects the introduction to the operations rail. */
body.about-page .about-home-visual { padding:0 0 56px; }
body.about-page .about-home-visual .curve-pattern {
    margin:0;
    --curve-h:176px;
    height:var(--curve-h);
    -webkit-mask-image:linear-gradient(to top,#000 12%,rgba(0,0,0,.55) 58%,transparent 100%);
    mask-image:linear-gradient(to top,#000 12%,rgba(0,0,0,.55) 58%,transparent 100%);
}
body.about-page .about-home-visual .line { background:#e0e0e0; opacity:calc(.28 + (var(--i,0) * .036)); }
@media(max-width:600px) {
    body.about-page .about-home-visual { padding-bottom:40px; }
    body.about-page .about-home-visual .curve-pattern { --curve-h:120px; }
}

@media(prefers-reduced-motion:reduce) {
    html.about-pending body.about-page :is(.about-kicker,.about-intro h1 span,.manifesto-prose p),
    body.about-page :is(.about-kicker,.about-intro h1 span,.manifesto-prose p,.about-reveal,.about-home-visual .line) {
        opacity:1;
        filter:none;
        transform:none;
        animation:none;
        transition:none;
    }
}

/* Experience uses the same quiet grid as the audience section. */
body.about-page .about-experience { padding:0 0 64px; }
body.about-page .about-experience h2 {
    margin:0 0 24px;
    color:var(--site-heading,#e5e5e5);
    font:400 28px/1.15 'Suisse Intl',Arial,sans-serif;
    letter-spacing:-.01em;
}
@media(max-width:600px) {
    body.about-page .about-experience { padding-bottom:40px; }
    body.about-page .about-experience h2 { font-size:26px; }
}

/* One spacing rhythm for the introduction, visual, grids, and operations. */
body.home.about-page {
    --about-section-gap:96px;
    --about-heading-gap:30px;
    --about-visual-gap:52px;
}
body.about-page .about-intro { padding:80px 0 var(--about-visual-gap); }
body.about-page .about-home-visual { padding:0 0 var(--about-section-gap); }
body.about-page .about-experience { padding:0 0 var(--about-section-gap); }
body.home.about-page .b-ops { padding:0 0 var(--about-section-gap); }
body.home.about-page .b-ops .container-main { margin-bottom:var(--about-heading-gap); }
body.home.about-page .ops-rail { padding-bottom:0; }
body.about-page .about-audience { padding:0 0 var(--about-section-gap); }
body.about-page .about-audience .container-main::before { display:none; }
body.about-page .about-experience h2,
body.about-page .about-audience h2 { margin:0; }
body.about-page .audience-grid { margin-top:var(--about-heading-gap); }
body.about-page .manifesto-actions { margin-top:40px; }
@media(max-width:700px) {
    body.home.about-page {
        --about-section-gap:64px;
        --about-heading-gap:26px;
        --about-visual-gap:36px;
    }
    body.about-page .about-intro { padding-top:48px; }
    body.about-page .manifesto-actions { margin-top:32px; }
}

/* Full-width experience grids, separated by quiet category labels. */
body.about-page .experience-groups { margin-top:calc(var(--about-heading-gap) + 20px); }
body.about-page .experience-group + .experience-group { margin-top:56px; }
body.about-page .experience-group h3 {
    margin:0 0 18px;
    color:var(--site-muted,#919191);
    font:400 12px/1.5 'IBM Plex Mono',monospace;
    letter-spacing:.04em;
}
body.about-page .experience-group ul {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    list-style:none;
    padding:0;
    margin:0;
    border-top:1px solid var(--site-edge,#303030);
}
body.about-page .experience-group li {
    padding:28px 32px 28px 0;
    border-bottom:1px solid var(--site-edge,#303030);
    color:var(--site-copy,#ababab);
    font:400 20px/1.35 'Suisse Intl',Arial,sans-serif;
    letter-spacing:-.01em;
}
body.about-page .experience-group li:nth-child(even) {
    padding-left:32px;
    border-left:1px solid var(--site-edge,#303030);
}
body.about-page .experience-group li:last-child:nth-child(odd) { grid-column:1 / -1; }
body.about-page .b-ops .b-section-head { display:block; }
body.about-page .operations-bridge {
    max-width:72ch;
    margin:24px 0 0;
    color:var(--site-copy);
    font:400 16px/1.6 'Suisse Intl',Arial,sans-serif;
}
@media(max-width:600px) {
    body.about-page .experience-group + .experience-group { margin-top:48px; }
    body.about-page .experience-group ul { grid-template-columns:1fr; }
    body.about-page .experience-group li,
    body.about-page .experience-group li:nth-child(even) { padding:22px 0; border-left:0; font-size:18px; }
    body.about-page .operations-bridge { font-size:15px; }
}

body.about-page .about-experience > .container-main > .audience-grid { margin-top:calc(var(--about-heading-gap) + 20px); }

/* Homepage-aligned editorial finish. */
body.about-page .about-kicker {
    display:flex;
    align-items:center;
    gap:10px;
    margin:0 0 28px;
    color:var(--site-muted,#919191);
    font:400 11px/1.5 'IBM Plex Mono',monospace;
    letter-spacing:.045em;
}
body.about-page .about-kicker::before {
    content:'';
    width:10px;
    height:1px;
    background:currentColor;
    flex:none;
}
body.about-page .about-intro h1 span { display:inline-block; }
body.about-page .manifesto-prose {
    display:grid;
    gap:18px;
    max-width:620px;
}
body.about-page .manifesto-prose p { margin:0; }
body.about-page .about-home-visual .curve-pattern {
    --curve-h:148px;
    height:var(--curve-h);
}
body.about-page .b-ops .b-section-head {
    max-width:720px;
}
body.about-page .operations-bridge,
body.about-page .audience-lede {
    max-width:620px;
    color:var(--site-copy,#969696);
    font:400 16px/1.6 'Suisse Intl',Arial,sans-serif;
    text-wrap:pretty;
}
body.about-page .operations-bridge { margin:22px 0 0; }
body.about-page .audience-lede { margin:20px 0 0; }
body.about-page .about-audience .audience-grid {
    margin-top:30px;
}
body.about-page .about-audience {
    border-top:var(--hairline) solid var(--site-edge,#303030);
    padding-top:72px;
}
body.about-page .about-audience .manifesto-actions {
    margin-top:36px;
}
body.about-page .about-audience .b-btn {
    box-shadow:0 0 0 1px rgba(255,255,255,.06);
    transition:background-color 160ms ease-out,color 160ms ease-out;
}
@media(hover:hover) and (pointer:fine) {
    body.about-page .about-audience .b-btn:hover {
        background:#f0f0f0;
        color:#101010;
    }
}
@media(max-width:700px) {
    body.about-page .about-kicker { margin-bottom:22px; }
    body.about-page .manifesto-prose { gap:16px; }
    body.about-page .about-home-visual .curve-pattern { --curve-h:116px; }
    body.about-page .operations-bridge,
    body.about-page .audience-lede {
        font-size:15px;
        line-height:1.6;
    }
    body.about-page .about-audience {
        padding-top:64px;
    }
    body.about-page .about-audience .audience-grid { margin-top:28px; }
}