/* bakule-chatbot: the public pages: the privacy policy. */

/* privacy policy */

/* Long-form reading (privacy policy) wants a narrower measure, but the page
   frame stays the same width everywhere so navigating causes no layout shift. */
.prose > * {
    max-width: 44rem;
}

/* Its rhythm, largest gap first: a part (one way to ask, or both) is set off
   by a rule; a section inside a part by space; a heading sits close to the
   text it heads. Without this, a part's last section dropped its margin and
   the next part's heading ran straight into it. */
.prose h2 {
    margin-bottom: 0.6rem;
}

.prose h3 {
    margin-bottom: 0.35rem;
}

.prose .section {
    margin-bottom: 2rem;
}

.prose .part {
    margin: 2.75rem 0;
    padding-top: 1.75rem;
    border-top: 1px solid var(--bakule-chat-rule);
}

.prose .part > h2 {
    margin-bottom: 1.25rem;
    font-size: 1.2rem;
}

.prose .part .section {
    margin-bottom: 1.5rem;
}

/* Last in a part or in the page, as any section is. */
.prose .section:last-child {
    margin-bottom: 0;
}

.prose .part + .section {
    padding-top: 1.75rem;
    border-top: 1px solid var(--bakule-chat-rule);
}

/* The controller, who runs the instance, and the data protection officer:
   three cards in a row where there is room, stacked where there is not. */
.prose > .parties {
    max-width: none;
    display: grid;
    grid-template-columns: 1fr;
    /* stylelint-disable-next-line property-disallowed-list -- a grid's, which Safari 12 knows */
    gap: 0.85rem;
    margin-bottom: 2rem;
}

@media (min-width: 48rem) {
    .prose > .parties {
        grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    }
}

/* Each is a .panel; in the grid, the gap does the spacing. */
.prose .party {
    margin: 0;
}

.prose .party h2 {
    font-size: 1rem;
}

/* A party on the privacy policy: name, address, phone, email, one per line.
   Not indented or boxed, because it is an address and reads as one. */
.contact {
    line-height: 1.6;
}

/* footer */

.footer {
    border-top: 1px solid var(--bakule-chat-rule);
    margin-top: 3rem;
    padding-top: 1rem;
    color: var(--bakule-chat-ink-faint);
    font-size: 0.875rem;
}

/* Spaced as the masthead's bar is, an element of its own for the same reason. */
.footer__links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: -0.5rem 0 0 -1.25rem;
}

.footer__links > * {
    margin-top: 0.5rem;
    margin-left: 1.25rem;
}