/* Legal and other text pages, from the design's legal boards. Also loaded into the block editor (editor.css). */
.prose-main{max-width:var(--container-text);margin:0 auto;padding:64px 16px 96px}
.prose{display:flex;flex-direction:column;gap:16px;font-size:15px;line-height:24px;color:var(--ink)}
.prose-head{display:flex;flex-direction:column;gap:16px;margin-bottom:12px}
.prose h1{font-weight:800;font-size:36px;line-height:38px;letter-spacing:-.04em;margin:0}
.prose h2{font-weight:600;font-size:18px;line-height:26px;letter-spacing:-.01em;margin:12px 0 0;padding-top:24px;border-top:1px solid var(--rule)}
.prose h3{font-weight:600;font-size:15px;line-height:24px;margin:8px 0 0}
.prose p,.prose li{margin:0}
.prose ul,.prose ol{margin:0;padding-left:20px;display:grid;gap:6px}
.prose a{color:var(--signal-text);text-underline-offset:3px}
.prose a:hover{color:var(--ink)}
.prose strong{font-weight:600}
.prose hr{border:0;border-top:1px solid var(--rule);margin:12px 0}
.prose .is-muted,.prose .has-ink-muted-color,.prose .has-small-font-size{color:var(--ink-muted)}
.prose .has-signal-text-color{color:var(--signal-text)}
.prose .has-small-font-size{font-size:13px;line-height:20px}

/* Tables: sub-processors, retention periods */
.prose figure{margin:0}
.prose .wp-block-table{overflow-x:auto}
.prose table{width:100%;border-collapse:collapse;font-size:14px;line-height:22px}
.prose th{text-align:left;font:500 11px/16px var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted);padding:10px 12px;border-bottom:1px solid var(--rule-strong);background:var(--paper-raised)}
.prose td{padding:10px 12px;border-bottom:1px solid var(--rule);vertical-align:top}
.prose figcaption{font-size:13px;line-height:20px;color:var(--ink-muted);margin-top:8px}

/* "What, why, basis, kept for" boxes: a Group block with the class "use" holding a heading and a definition list */
.prose .use{display:grid;gap:6px;padding:16px;border:1px solid var(--rule);border-radius:var(--radius-md);background:var(--paper-raised)}
.prose .use>p:first-child{font-weight:600}
.prose dl{display:grid;grid-template-columns:120px minmax(0,1fr);gap:4px 12px;margin:0}
.prose dt{font:500 11px/24px var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted)}
.prose dd{margin:0}
@media (max-width:480px){.prose dl{grid-template-columns:minmax(0,1fr)}.prose dd{margin-bottom:8px}}

@media (min-width:768px){
.prose-main{padding:64px 32px 96px}
.prose h1{font-size:56px;line-height:56px;letter-spacing:-.045em}
}

/* Media an editor might add to a text page. */
.prose img{max-width:100%;height:auto;border-radius:var(--radius-sm)}
.prose .alignleft{float:left;margin:4px 24px 12px 0}
.prose .alignright{float:right;margin:4px 0 12px 24px}
.prose .aligncenter{display:block;margin-left:auto;margin-right:auto}
.prose .wp-caption,.prose .wp-block-image{max-width:100%;margin:0}
.prose .wp-caption-text,.prose .gallery-caption,.prose .wp-element-caption{font-size:13px;line-height:20px;color:var(--ink-muted);margin-top:8px}
.prose .post-page-numbers{display:inline-block;padding:4px 8px}

/* Page head from the design's legal boards: eyebrow, lede, contents list. */
.prose-head .is-muted{color:var(--ink-muted)}
.prose .toc{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0;padding:0;list-style:none}
.prose .toc a{font-size:13px;line-height:20px;color:var(--ink-muted);text-decoration:none}
.prose .toc a:hover{color:var(--ink)}
.prose h2[id]{scroll-margin-top:24px}

/* Wide pages (security): an 880px column with the head kept at text width. */
.prose-main.is-wide{max-width:880px}
.prose-main.is-wide .prose-head{max-width:680px}

/* Measure cards: a Group block "cards" holding Group blocks "card" (heading + text). */
.prose .cards{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.prose .card{display:flex;flex-direction:column;gap:6px;padding:16px;border:1px solid var(--rule);border-radius:var(--radius-md);background:var(--paper-raised)}
.prose .card h3{margin:0}
@media (min-width:768px){.prose .cards{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Framed table: a table inside <div class="tbl">. */
.prose .tbl{overflow-x:auto;border:1px solid var(--rule);border-radius:var(--radius-md)}
.prose .tbl table{min-width:560px}
.prose .tbl th{background:var(--paper-sunken);border-bottom:0}
.prose .tbl td{border-bottom:0;border-top:1px solid var(--rule);line-height:20px;padding:12px}