/* One section gap: 48px on small screens, growing to 72px on desktop. */
:root {
  --section-space: clamp(3rem, 6vw, 4.5rem);
  --content-space: clamp(1.25rem, 2vw, 1.5rem);
  --heading-space: clamp(1.5rem, 3vw, 2rem);
  --panel-space: clamp(1rem, 3vw, 2rem);
}

/* Use a single leading margin instead of adding adjacent component padding. */
#main-content :is(.pcc-text, .pcc-split, .pcc-image, .pcc-two, .pcc-latest-news, .pcc-supporters, .committee) {
  margin-block: var(--section-space) 0;
  padding-block: 0;
}
/* Background sections need internal space as well as the gap above them. */
#main-content .pcc-latest-news {
  padding-block: var(--section-space);
}
#main-content .pcc-promo {
  margin-block: var(--section-space) 0;
  padding: var(--heading-space);
}
#main-content .pcc-split { gap: var(--heading-space); }
#main-content .pcc-two { gap: var(--heading-space); }
#main-content .pcc-hero-copy { padding-block: var(--section-space); }
#main-content .pcc-hero--compact .pcc-hero-copy { padding-block: var(--heading-space); }
#main-content .pcc-hero h1 { margin-block: .75rem var(--content-space); }
#main-content :is(.pcc-text, .pcc-split, .pcc-promo, .pcc-supporters, .committee) h2 {
  margin-block: 0 var(--content-space);
}
#main-content .pcc-promo > .eyebrow { margin-bottom: .75rem; }
#main-content .actions { margin-top: var(--content-space); }
#main-content .actions:empty { display: none; }
#main-content :is(.prose, .pcc-split-copy, .pcc-hero-copy) > :last-child { margin-bottom: 0; }
#main-content .prose > :first-child { margin-top: 0; }
#main-content .prose :is(p, ul, ol) { margin-block: 0 var(--content-space); }
#main-content .prose :is(h2, h3, h4) { margin-block: var(--heading-space) .75rem; }
#main-content .prose :is(p, ul, ol):last-child { margin-bottom: 0; }

/* Document headings, forms and account pages use the same spacing scale. */
#main-content .page-heading { padding-block: var(--section-space) var(--heading-space); }
#main-content .page-heading h1 { margin-block: 0 var(--content-space); }
#main-content .page-heading > :last-child { margin-bottom: 0; }
#main-content .supporting-page { padding-block: var(--section-space) 0; }
#main-content .supporting-page .page-heading { padding-block: 0 var(--heading-space); }
#main-content .supporting-page__canvas > :first-child { margin-top: 0; }
#main-content .article-image img { margin-bottom: var(--heading-space); }
#main-content.webform-page { padding-block: var(--section-space) 0; }
#main-content.webform-page .page-heading { padding: 0; margin-bottom: var(--heading-space); }
#main-content.webform-page .page-heading h1 { margin-bottom: 0; }
#main-content.webform-page fieldset { margin-block: var(--heading-space); padding: var(--panel-space); }
#main-content.webform-page fieldset fieldset { margin-block: var(--content-space) 0; padding: 0; }
#main-content.webform-page .form-item { margin-bottom: var(--content-space); }
#main-content.webform-page :is(.form-checkboxes, .form-radios) .form-item,
#main-content.webform-page .fieldset-wrapper > :last-child { margin-bottom: 0; }
#main-content:is(.account-page, .profile-page) { margin-block: var(--section-space) 0; }
#main-content:is(.account-page, .profile-page) .page-heading { padding: 0; margin-bottom: var(--heading-space); }
.site-footer { margin-top: var(--section-space); padding-block: var(--section-space) var(--heading-space); }
