/* Every clamp below reads `clamp(<390px value>, <390px value> + (100vw - 24.375rem) * <rise>,
   <1728px value>)`: 24.375rem is the 390px frame, so the floor holds exactly there, and the rise is
   the difference over the 1338px to the 1728px frame.

   Two roots, one rhythm: the page, and the canvas the editor lays the same blocks out in. */
.dossier,
.post-type-dossier .is-root-container {
    /* 60px → 96px */
    --dossier-gap: clamp(3.75rem, 3.75rem + (100vw - 24.375rem) * 0.02691, 6rem);

    /* 60px → 160px */
    --dossier-gap-conclusion: clamp(3.75rem, 3.75rem + (100vw - 24.375rem) * 0.07474, 10rem);

    /* 92px → 224px */
    --dossier-gap-section: clamp(5.75rem, 5.75rem + (100vw - 24.375rem) * 0.09865, 14rem);

    /* 128px → 232px, measured to the top of the picture, which reaches above the band */
    --dossier-gap-contact: clamp(8rem, 8rem + (100vw - 24.375rem) * 0.07773, 14.5rem);

    /* 60px → 128px */
    & > .hero {
        margin-block-end: clamp(3.75rem, 3.75rem + (100vw - 24.375rem) * 0.05082, 8rem);
    }

    /* Running text and headings carry their own distance; these carry none. */
    & > :is(.image, .embed, .download-list, .button, .quote, .image-slider, .contents) {
        margin-block: var(--dossier-gap);
    }

    & > .quote--conclusion {
        margin-block-start: var(--dossier-gap-conclusion);
    }

    /* The reading column stands at the right edge of the content band rather than in the middle
       of it, so the note beside the text has room on the left. `!important` because the block
       editor centres every block in its canvas that way, and no weight of selector reaches past
       it. */
    & > :not(.alignwide, .alignfull, .quote-aside) {
        @media (min-width: 64rem) {
            margin-inline: auto max(0px, calc((100% - var(--sav-content-width)) / 2)) !important;
        }
    }

    /* 60px, where the note stands in the column with the text. */
    & > .quote-aside {
        margin-block: 3.75rem;

        /* 386px at the left edge of the band, 74px before the reading column. Out of the flow,
           so it starts on the line of the block below it. */
        @media (min-width: 64rem) {
            float: inline-start;
            clear: inline-start;
            inline-size: 24.125rem;
            margin-block: 0;
            margin-inline: max(0px, calc((100% - var(--sav-content-width)) / 2)) auto !important;
        }
    }

    /* Two paragraphs are no longer neighbours with the note between them. */
    & > .wp-block-paragraph + .quote-aside + .wp-block-paragraph {
        @media (min-width: 64rem) {
            margin-block-start: var(--sav-text-m-line);
        }
    }

    & > :is(.argument-list, .article-teaser) {
        margin-block-start: var(--dossier-gap-section);

        /* A note at the end of the free content reaches below the text it stands beside. */
        @media (min-width: 64rem) {
            clear: inline-start;
        }
    }

    & > .contact-person {
        margin-block-start: var(--dossier-gap-contact);

        @media (min-width: 64rem) {
            clear: inline-start;
        }
    }
}

.dossier {
    /* Contains the note beside the text, which is floated out of the reading column. */
    display: flow-root;

    /* Padding, not a margin: a margin would collapse out of the article and the closing
       section would set the distance to the footer itself. */
    padding-block-end: var(--dossier-gap-section);
}