/* D-065 site-wide section rhythm. One vertical scale for every <main> section, loaded last (not on /book-call).

   Tokens (D-026 scale, now site-wide):
     section  120 / 96 / 72   (>=1280 / 768-1279 / <768)  every content section, top and bottom
     band      64 / 56 / 48                                logo bands and quote strips: compact, never a full section

   Rules:
     1. A section's padding owner (the section itself for authored z* sections, otherwise its captured
        .section-padding / .padding-section-* wrapper) takes --z-pt / --z-pb. Nothing else sets section padding.
     2. Two neighbours on the same background read as one field, so the lower one drops its top padding and the
        gap between their content is one section step, never two (site-spacing.js marks these [data-z-join]).
        After a band, the join keeps the difference so the band sits centred in its field.
     3. The first section (the hero) keeps its own top spacing under the nav; its bottom is one section step.
     4. Zero-padding variants (full-bleed media), the product hero's flush art and the homepage Workspace hero keep
        their own spacing.
   Selectors carry main:not(#z-spacing) (ID weight) because earlier layers set section padding with stacked-class
   !important rules; this file is the single source for vertical section rhythm. */
:root { --z-space-section: 120px; --z-space-band: 64px; --z-space-logo: 32px; }
@media (max-width: 1279px) { :root { --z-space-section: 96px; --z-space-band: 56px; } }
@media (max-width: 767px) { :root { --z-space-section: 72px; --z-space-band: 48px; --z-space-logo: 28px; } }

html body main:not(#z-spacing) > * { --z-pt: var(--z-space-section); --z-pb: var(--z-space-section); }
html body main:not(#z-spacing) > :is(.z-logo-band, .z-quote, :has(> .padding-global .z-logo-bank)) { --z-pt: var(--z-space-band); --z-pb: var(--z-space-band); }
/* D-114 logo strips (user, 2026-11-01, option A): a tighter band than quote strips, 32px (28 on phones) above and below. */
html body main:not(#z-spacing) > :is(.z-logo-band, :has(> .padding-global .z-logo-bank)) { --z-pt: var(--z-space-logo); --z-pb: var(--z-space-logo); }
html body main:not(#z-spacing) > [data-z-join] { --z-pt: 0px; }
html body main:not(#z-spacing) > :is(.z-logo-band, .z-quote, :has(> .padding-global .z-logo-bank)) + [data-z-join]:not(.z-logo-band, .z-quote) { --z-pt: calc(var(--z-space-section) - var(--z-space-band)); }
html body main:not(#z-spacing) > :is(.z-logo-band, :has(> .padding-global .z-logo-bank)) + [data-z-join]:not(.z-logo-band, .z-quote) { --z-pt: calc(var(--z-space-section) - var(--z-space-logo)); }

/* The product hero's art sits flush on its bottom edge, so it keeps its own bottom. */
html body main:not(#z-spacing) > .z-hb--product { --z-pb: 0px; }
html body main:not(#z-spacing) > .z-hb--product + [data-z-join] { --z-pt: var(--z-space-section); }
html body main:not(#z-spacing) > .z-hb--product + [data-z-join]:is(.z-logo-band, .z-quote) { --z-pt: var(--z-space-band); }
html body main:not(#z-spacing) > .z-hb--product + [data-z-join]:is(.z-logo-band, :has(> .padding-global .z-logo-bank)) { --z-pt: var(--z-space-logo); }

/* Padding owners: bottom everywhere; top everywhere except the first section (the hero keeps its own top). */
html body main:not(#z-spacing) > *:is(.z3-sec, .z9-cta, .z-sec, .z8-commit):not(:has(.z3-hero)),
html body main:not(#z-spacing) > *:not(.z3-sec, .z9-cta, .z-sec, .z8-commit, :has(.z3-hero)) > .padding-global > :is(.container-large, .container-medium, .container-small, .z-container-large) > :is(.section-padding, .padding-section-large, .padding-section-medium, .padding-section-small, .padding-xxlarge.padding-bottom, .padding-xxlarge.padding-top):not(.z-section-zero-padding, .z-section-full-width-zero-padding),
html body main:not(#z-spacing) > *:not(.z3-sec, .z9-cta, .z-sec, .z8-commit, :has(.z3-hero)) > .padding-global.container-large > :is(.section-padding, .padding-section-large, .padding-section-medium),
html body main:not(#z-spacing) > *:not(.z3-sec, .z9-cta, .z-sec, .z8-commit, :has(.z3-hero)) > .section-padding:not(.z-section-zero-padding, .z-section-full-width-zero-padding) { padding-bottom: var(--z-pb) !important; }
html body main:not(#z-spacing) > :not(:first-child):is(.z3-sec, .z9-cta, .z-sec, .z8-commit):not(:has(.z3-hero)),
html body main:not(#z-spacing) > :not(:first-child):not(.z3-sec, .z9-cta, .z-sec, .z8-commit, :has(.z3-hero)) > .padding-global > :is(.container-large, .container-medium, .container-small, .z-container-large) > :is(.section-padding, .padding-section-large, .padding-section-medium, .padding-section-small, .padding-xxlarge.padding-bottom, .padding-xxlarge.padding-top):not(.z-section-zero-padding, .z-section-full-width-zero-padding),
html body main:not(#z-spacing) > :not(:first-child):not(.z3-sec, .z9-cta, .z-sec, .z8-commit, :has(.z3-hero)) > .padding-global.container-large > :is(.section-padding, .padding-section-large, .padding-section-medium),
html body main:not(#z-spacing) > :not(:first-child):not(.z3-sec, .z9-cta, .z-sec, .z8-commit, :has(.z3-hero)) > .section-padding:not(.z-section-zero-padding, .z-section-full-width-zero-padding) { padding-top: var(--z-pt) !important; }

/* Captured spacer components standing in for a section's padding (customer stories) take the section steps. */
html body main:not(#z-spacing) > :not(:first-child) > .spacer-component:first-child { padding-top: var(--z-pt) !important; height: auto !important; }
html body main:not(#z-spacing) > * > .spacer-component:last-child { padding-top: var(--z-pb) !important; height: auto !important; }

/* The step is measured to the content: a trailing margin on the last block (hero art, article sections, list
   wrappers) or a leading margin on the first would add to it, so the outer edges of a section's content are trimmed. */
html body main:not(#z-spacing) > * :is(.section-padding, .padding-section-large, .padding-section-medium, .padding-section-small, .padding-xxlarge) > :last-child,
html body main:not(#z-spacing) > * :is(.section-padding, .padding-section-large, .padding-section-medium, .padding-section-small, .padding-xxlarge) > :last-child > :last-child,
html body main:not(#z-spacing) > * :is(.section-padding, .padding-section-large, .padding-section-medium, .padding-section-small, .padding-xxlarge) > :last-child > :last-child > :last-child,
html body main:not(#z-spacing) > * :is(.section-padding, .padding-section-large, .padding-section-medium, .padding-section-small, .padding-xxlarge) > :last-child > :last-child > :last-child > :last-child,
html body main:not(#z-spacing) > * :is(.section-padding, .padding-section-large, .padding-section-medium, .padding-section-small, .padding-xxlarge) > :last-child > :last-child > :last-child > :last-child > :last-child { margin-bottom: 0 !important; }
html body main:not(#z-spacing) > :not(:first-child) :is(.section-padding, .padding-section-large, .padding-section-medium, .padding-section-small, .padding-xxlarge) > :first-child,
html body main:not(#z-spacing) > :not(:first-child) :is(.section-padding, .padding-section-large, .padding-section-medium, .padding-section-small, .padding-xxlarge) > :first-child > :first-child,
html body main:not(#z-spacing) > :not(:first-child) :is(.section-padding, .padding-section-large, .padding-section-medium, .padding-section-small, .padding-xxlarge) > :first-child > :first-child > :first-child { margin-top: 0 !important; }
