/* Shared page frame. Full-bleed artwork and dialog interiors remain independent. */
:root {
  --page-width: 1192px;
  --page-gutter: 32px;
  --page-top: 170px;
  --page-bottom: 90px;
  --page-heading-gap: 52px;
  --page-frame: min(var(--page-width), calc(100% - 2 * var(--page-gutter)));
}
body > .masthead.glass-nav,
.membership-page > .masthead.glass-nav {
  position: absolute;
  top: 24px;
  left: 0;
  right: 0;
  width: var(--page-frame);
  max-width: var(--page-width);
  margin-inline: auto;
  padding-inline: 24px;
}
body > .library-main,
.membership-page > .member-main,
body > .admin-main {
  box-sizing: border-box;
  width: var(--page-frame);
  max-width: var(--page-width);
  margin-inline: auto;
  padding: var(--page-top) 0 var(--page-bottom);
}
.landing-main > :is(.intro-strip,.integrations-section,.featured-section,.possibilities-section,.how-section,.closing-cta),
body > .site-footer {
  box-sizing: border-box;
  width: var(--page-frame);
  max-width: var(--page-width);
  margin-inline: auto;
}
body > .site-footer { padding-inline: 0; }
.landing-hero {
  padding-left: max(var(--page-gutter), calc((100% - var(--page-width)) / 2));
  padding-right: max(var(--page-gutter), calc((100% - var(--page-width)) / 2));
}
.hero-bottom {
  left: max(var(--page-gutter), calc((100% - var(--page-width)) / 2));
  right: max(var(--page-gutter), calc((100% - var(--page-width)) / 2));
}
.member-main > .member-hero,
.policy-content > .member-hero,
.member-main > .account-heading,
.library-main > .library-intro { margin-bottom: var(--page-heading-gap); }
.policy-content section > :is(p,ul,ol) { max-width: 78ch; }
/* Admin has an in-flow header; keep its frame aligned without reserving it twice. */
body > .admin-header { box-sizing: border-box; width: var(--page-frame); max-width: var(--page-width); margin-inline: auto; padding-inline: 0; }
body > .admin-main { padding-top: 64px; }
@media (max-width: 1000px) {
  :root { --page-gutter: 24px; }
}
@media (max-width: 700px) {
  :root { --page-gutter: 20px; --page-top: 128px; --page-bottom: 60px; --page-heading-gap: 36px; }
  body > .masthead.glass-nav,
  .membership-page > .masthead.glass-nav { top: 16px; padding-inline: 17px; }
  body > .admin-main { padding-top: 36px; }
}