/* Shared frame contract: backgrounds span the viewport; content uses the inner frame. */
@media screen {
  :root {
    --wwc-header: 1750px;
    --wwc-content: 1500px;
    --wwc-footer: 1350px;
    --wwc-gutter: clamp(18px, 2vw, 24px);
    --wwc-header-pad: max(var(--wwc-gutter), calc((100% - var(--wwc-header)) / 2));
    --wwc-content-pad: max(var(--wwc-gutter), calc((100% - var(--wwc-content)) / 2));
    --wwc-footer-pad: max(var(--wwc-gutter), calc((100% - var(--wwc-footer)) / 2));
  }
  main :where(section, article, aside, figure, div) { min-width: 0; }
  :is(body, main) > .practical-guide,
  :is(body, main) > .decision-example {
    box-sizing: border-box;
    width: min(var(--wwc-content), calc(100% - 2 * var(--wwc-gutter)));
    max-width: var(--wwc-content);
    margin-inline: auto;
  }
  .wag-ad-slot { width: min(var(--wwc-content), calc(100% - 2 * var(--wwc-gutter))); }
  /* Local directory templates also inject theme styles after their stylesheets. */
  .fdnl-body :is(.fdnl-breadcrumbs, .fdnl-section, .fdnl-hero > div) {
    box-sizing: border-box; width: 100% !important; max-width: none !important;
    margin-inline: 0 !important; padding-inline: var(--wwc-content-pad) !important;
  }
  .fdnl-body .fdnl-site-header { box-sizing: border-box; width: 100%; max-width: none; margin-inline: 0; padding-inline: var(--wwc-header-pad); }
  .fdnl-body .fdnl-site-header__inner { width: 100%; max-width: var(--wwc-header); margin-inline: auto; }
  .fdnl-body .fdnl-footer { box-sizing: border-box; width: 100%; max-width: none; margin-inline: 0; padding-inline: var(--wwc-footer-pad); }
  .fdnl-body .fdnl-footer__inner { width: 100%; max-width: var(--wwc-footer); margin-inline: auto; }

  :root {
    --content-max-width: var(--wwc-content); --header-max-width: var(--wwc-header); --footer-max-width: var(--wwc-footer);
    --content-padding: var(--wwc-content-pad) !important; --header-padding: var(--wwc-header-pad) !important; --footer-padding: var(--wwc-footer-pad) !important;
  }
  .site-header { padding-inline: var(--header-padding); }
  .portal-shell:not(.generalist-shell) > :is(.generalist-home, .home-task-start),
  .portal-frontpage-v2 > .portal-board { width: min(var(--wwc-content), calc(100% - 2 * var(--wwc-gutter))); max-width: var(--wwc-content); padding-inline: 0; margin-inline: auto; }
  .portal-frontpage-v2 > .portal-board { padding-block: 0; margin-block: 32px 48px; }
  .pathway-page, .directory-data-page, .directory-glossary-page, .directory-methods { box-sizing: border-box; width: 100%; max-width: none; margin-inline: 0; padding-inline: var(--wwc-content-pad); }
  footer.site-footer, .generalist-footer { padding-inline: var(--wwc-footer-pad); }
  .site-footer > .footer-top, .site-footer > .footer-bottom { width: 100%; max-width: var(--wwc-footer); margin-inline: auto; }
}
