/**
 * Shared vertical rhythm.
 * The desktop reference is the Home hero-to-first-section inset (66px).
 * Adjacent sections share one inset instead of stacking two insets.
 */
:root { --apex-section-space: 66px; }

.apex-main > :is(
  .apex-section,
  .about-intro,
  .about-product-strip,
  .contact-main,
  .contact-map,
  .library-groups,
  .apex-page-content,
  .apex-page-cta-wrap
) { padding-block: var(--apex-section-space); }

.apex-main > :is(
  .apex-section,
  .about-intro,
  .about-product-strip,
  .contact-main,
  .contact-map,
  .library-groups,
  .apex-page-content,
  .apex-page-cta-wrap
) + :is(
  .apex-section,
  .about-intro,
  .about-product-strip,
  .contact-main,
  .contact-map,
  .library-groups,
  .apex-page-content,
  .apex-page-cta-wrap
) { padding-top: 0; }

/* Full-page commerce and account shells do not use child section wrappers. */
.apex-cart-page,
.apex-account-page > .apex-container { padding-block: var(--apex-section-space); }
.woocommerce-account .apex-page-content { padding-bottom: var(--apex-section-space); }

/* Standard pages and the account template wrap their sections in an article. */
.apex-main > .apex-page > :is(.apex-page-header, .apex-page-content, .apex-page-cta-wrap) {
  padding-block: var(--apex-section-space);
}
.apex-main > .apex-page > :is(.apex-page-header, .apex-page-content, .apex-page-cta-wrap)
+ :is(.apex-page-header, .apex-page-content, .apex-page-cta-wrap) { padding-top: 0; }

/* The 404 template itself is the content container. */
.error404 #main-content { padding-block: var(--apex-section-space); }
.error404 #main-content > .apex-page-header { padding: 0; }

/* Library groups are sections nested inside one shared container. */
.library-intro { padding-block: var(--apex-section-space); }
.library-groups { padding-bottom: var(--apex-section-space); }
.library-group { margin: 0; padding-bottom: var(--apex-section-space); }
.library-group:last-child { padding-bottom: 0; }

/* Process phases are semantic subsections inside a single page section. */
.process-phase > h2 { margin-top: var(--apex-section-space); }
.process-products { margin-block: var(--apex-section-space); }

@media (max-width: 1180px) {
  :root { --apex-section-space: 54px; }
}

@media (max-width: 767px) {
  :root { --apex-section-space: 38px; }
}