/**
 * Section rhythm.
 *
 * Vertical separation between the top-level sections of a page, and at the seam
 * where the footer promotional strip meets the government footer.
 *
 * The theme used to get this from css/global.css, which set
 * `.paragraph { padding: var(--space-3xl) 0 }` and then halved the padding on
 * the facing edges of adjacent paragraphs so the gap between two sections came
 * to one step rather than two. That file was one of the legacy chrome
 * stylesheets deleted when QGDS took over the global design, and nothing
 * replaced the rule. Every component whose own CSS never set vertical padding
 * has rendered flush against its neighbours since: on /primary-producers the
 * four .paragraph-all-disasters blocks each began at the exact y the previous
 * one ended, so every disaster-event heading sat hard against the card grid of
 * the event above it and read as belonging to those cards rather than its own.
 *
 * Only a handful of components carry vertical padding of their own (see
 * paragraph-intro.css, paragraph-text-search.css, paragraph-text-cards.css and
 * paragraph-text-buttons.css). The rules below cover the rest, using the same
 * halving trick as the original: each side of a boundary contributes half a
 * step, so the measured gap is one step whichever two sections meet. The rule
 * applies to self-padded sections too. At a shared boundary it reduces each
 * section's facing edge to half a step; otherwise two adjacent self-padded
 * components each contribute a full step and produce a 96px/128px double gap.
 */

:root {
  /* The gap between two adjacent sections. This is the rhythm the sections
     that space themselves already use (3rem, rising to 4rem from lg up; see
     paragraph-text-buttons.css and templates/homepage.css). It is expressed
     here as the gap rather than as per-side padding so the two halves below
     add up to exactly one step. */
  --qrida-section-gap: 3rem;
  --qrida-section-step: calc(var(--qrida-section-gap) / 2);
}

@media (min-width: 992px) {
  :root {
    --qrida-section-gap: 4rem;
  }
}

/* ---------------------------------------------------------------------------
 * 1. Sections inside the QGDS content body.
 *
 * The `:not()` list contains only the two carousels. They are full-bleed media
 * bands whose edge is the band itself and are intentionally allowed to sit
 * flush (that is how the pair stacks on the home page). Every other top-level
 * component participates, including intro, text-search, text-cards and
 * text-buttons: their facing padding is normalised instead of added together.
 *
 * `* + *` never matches the first section and `:has(+ *)` never matches the
 * last, so no dead space is introduced under the banner or above the footer.
 * ------------------------------------------------------------------------- */

/* Only the carousels are excluded from the rhythm.
 *
 * The list used to name every self-padded component. Excluding them at both
 * ends meant nothing normalised a seam between two of them, so two adjacent
 * text-buttons sections contributed 64px each and sat 128px apart where every
 * other boundary on the site is 64px. That is the shape on /grants-rebates and
 * three times over on /fisheries-support.
 *
 * The rhythm sets padding rather than adding to it, so bringing these
 * components back in replaces their own 64px with the 32px half-step at both
 * ends of the seam. Verified by diffing every section's computed padding
 * across ten pages before and after: three 128px seams become 64px and no
 * other boundary moves, including the deliberate 96px border-bottom seams.
 *
 * The carousels stay out because they are full-bleed and manage their own
 * edges.
 * ------------------------------------------------------------------------- */

.qld-content-body
  > *:not(.paragraph-carousel-image, .paragraph-carousel-video)
  + *:not(.paragraph-carousel-image, .paragraph-carousel-video) {
  padding-block-start: var(--qrida-section-step);
}

.qld-content-body
  > *:not(.paragraph-carousel-image, .paragraph-carousel-video):has(
    + *:not(.paragraph-carousel-image, .paragraph-carousel-video)
  ) {
  padding-block-end: var(--qrida-section-step);
}

/* ---------------------------------------------------------------------------
 * 1a. Sections that end in a rule.
 *
 * The intro block on a listing page carries `border-bottom border-dark`, so its
 * bottom edge is drawn, not implied. The half-step above it therefore reads as
 * the closing space of that section and the rule as its terminator, which
 * leaves the section below opening on a half step: on /loans the rule sat at
 * y=1200 and "View the range of loans QRIDA delivers" at y=1232, 32px under a
 * full-bleed horizontal rule, with only 24px between the same heading and the
 * grid it introduces. The heading read as the last line of the block that had
 * just ended rather than as the first of the one it heads. /tools-resources/faqs
 * measured identically.
 *
 * So a boundary carrying a rule spends a whole step below it rather than half,
 * and the half above stays where it is, keeping the rule clear of the intro's
 * own copy. Self-padded sections are already normalized to the half-step by
 * section 1, so the full-step override applies to every non-carousel successor.
 * Placed after the rule in section 1, which it ties with on specificity.
 * ------------------------------------------------------------------------- */

.qld-content-body
  > .border-bottom
  + *:not(.paragraph-carousel-image, .paragraph-carousel-video) {
  padding-block-start: var(--qrida-section-gap);
}

/* /news puts the same boundary between two blocks rather than between two
 * sections: its content layout holds nothing but the bordered intro deck, and
 * the listing the rule introduces is the next block in the content region, so
 * the rule above never sees it as a sibling. It opened on the listing block's
 * own 2rem of padding, which is the half step by another name. Same treatment,
 * so the three comparable listing pages open their listing on one step instead
 * of 64px on two and 32px on the third.
 *
 * `#block-mainpagecontent` is the region's main block, which is what the
 * content layout always sits inside, and the :has() keeps this to pages whose
 * content really does end in a rule. The id is needed on merit: the news
 * listing block sets its own padding through an id selector in
 * css/blocks/block-general.css. */
#block-mainpagecontent:has(.qld-content-body > .border-bottom:last-child) + * {
  padding-block-start: var(--qrida-section-gap);
}

/* ---------------------------------------------------------------------------
 * 2. Headings inside editor prose.
 *
 * A heading that follows body copy took 32px (h4) or 36px (h2, h3) above it and
 * left 24px below, near enough equal for it to read as belonging to the block
 * above as much as to the one it introduces. On /primary-producers that is
 * "Individually Disaster Stricken Properties", which sat 36px under the
 * paragraph it has nothing to do with. Widening the space above to twice the
 * 24px below groups each heading with the copy it heads.
 *
 * Scoped to the top level of a rich-text field item, so it reaches the editor's
 * own section headings and not headings that belong to a component (card
 * titles, accordion buttons, listing rows).
 * ------------------------------------------------------------------------- */

.qld-content-body .text-content .field__item > :is(h2, h3):not(:first-child) {
  margin-block-start: var(--space-5xl);
}

/* h4 is used both as a section heading and as a sub-heading in this content, so
   it takes a smaller step than h2/h3 and keeps some of the hierarchy. */
.qld-content-body .text-content .field__item > h4:not(:first-child) {
  margin-block-start: var(--space-4xl);
}

/* ---------------------------------------------------------------------------
 * 3. Footer promotional strip.
 *
 * The last block in the footer_top region is the recent-news listing, which
 * carries no padding of its own, so "View all news and stories" sat flush on
 * the footer's blue edge and the news cards read as falling into the footer.
 * The strip wrapper is the right owner: it is the single seam between the
 * promotional blocks and the government footer, so the gap lands once whatever
 * the region happens to contain, and the blocks above it keep their own
 * spacing.
 *
 * Padding, not margin: the footer has no top margin of its own, so a bottom
 * margin here would collapse through and do nothing. Block axis only, so the
 * full-width strip cannot introduce horizontal overflow.
 * ------------------------------------------------------------------------- */

.qld-footer-promo {
  padding-block-end: var(--qrida-section-gap);
}