/* Shared outer rails. Reading columns and panel interiors remain intentional insets. */
body.brand-system{--page-gutter:48px;--page-width:1460px;--reading-width:72ch}
@media(max-width:1000px){body.brand-system{--page-gutter:32px}}
@media(max-width:700px){body.brand-system{--page-gutter:20px}}
body.brand-system .wrap,
body.brand-system .topbar .nav,
body.brand-system .brand-family .brand-family-inner{
 width:min(calc(100% - 2 * var(--page-gutter)),var(--page-width));
 margin-inline:auto;
}
body.brand-system .topbar .nav{max-width:var(--page-width);padding-inline:0}
body.brand-system main .breadcrumbs{
 width:100%;max-width:none;margin-inline:0;
 padding:0 max(var(--page-gutter),calc((100% - var(--page-width))/2));
 min-height:44px;gap:8px;align-items:center;flex-wrap:wrap;
}
body.brand-system main .breadcrumbs a{
 display:inline-flex;align-items:center;min-height:44px;padding-inline:0;flex-shrink:0;
}
body.brand-system main .breadcrumbs>[aria-current="page"]{min-width:0;overflow-wrap:anywhere;padding-block:10px}
body.brand-system .page-hero.compact>.wrap,
body.brand-system .page-hero:not(.compact)>.wrap,
body.brand-system.page-case :is(.case-hero,.page-hero.compact)>.wrap{
 width:min(calc(100% - 2 * var(--page-gutter)),var(--page-width));
}
/* The article title, metadata and body share one reading rail. */
body.brand-system.page-article .page-hero.compact>.wrap,
body.brand-system.page-article .case-body>.wrap,
body.brand-system.page-article .insight-hero-image{
 width:min(calc(100% - 2 * var(--page-gutter)),var(--reading-width));
}
body.brand-system.page-article .insight-article-meta{
 width:min(calc(100% - 2 * var(--page-gutter)),90ch);
 font-size:.9rem;
}
body.brand-system.page-article .insight-share-bar{
 font-size:1.125rem;width:100%;padding-inline:max(var(--page-gutter),calc((100% - var(--reading-width))/2));
}
/* These older case templates use a narrower editorial body throughout. */
body.brand-system:has(.case-story-inner) .case-hero>.wrap,
body.brand-system:has(.case-story-inner) .case-body>.wrap{
 width:min(calc(100% - 2 * var(--page-gutter)),1100px);
}
body.brand-system.page-legal .page-hero.compact>.wrap{max-width:860px}

body.brand-system:not(.page-article):has(.case-body) :is(.case-hero,.page-hero.compact)>.wrap{
 width:min(calc(100% - 2 * var(--page-gutter)),1100px);
}