/* Shared content width for the five updated pages. */
body { --site-safe-width: 1360px; }

/* Home and About follow the solution page content grid and breakpoints. */
body.about-site { --site-safe-width: 1300px; --site-gutter: 192px; }
body.figma-home { --site-safe-width: 1300px; --site-gutter: 192px; }

body.about-site header.fh-header,
body.figma-home header.fh-header { --site-gutter: inherit; }
.about-site .about-page .container,
.about-site .history-roadmap-inner,
.about-site .fh-header .fh-header-inner,
.about-site .proto-footer-main {
  width: min(var(--site-safe-width), calc(100% - var(--site-gutter)));
  max-width: var(--site-safe-width);
  margin-inline: auto;
}
@media (max-width: 1200px) {
  body.about-site, body.figma-home { --site-gutter: 64px; }
}
@media (max-width: 640px) {
  body.about-site, body.figma-home { --site-gutter: 40px; }
}

.about-site .about-page .about-history-hero { width: 100%; margin-inline: 0; }

/* Homepage outer containers share one authoritative safe-width rule. */
body.figma-home .fh-header .fh-header-inner,
body.figma-home .fh-hero-copy,
body.figma-home main > section > .proto-wrap,
body.figma-home .proto-footer-main,
body.figma-home .proto-footer-nav,
body.figma-home .proto-footer-search {
  box-sizing: border-box;
  width: min(var(--site-safe-width), calc(100% - var(--site-gutter)));
  max-width: var(--site-safe-width);
  min-width: 0;
  margin-inline: auto;
}
