/* asquared · Grid Typography: the articles (blog/_article.html, written to blog/<slug>/index.html by blog/_build.py).
   This page's own layout, after style.css and pages.css (PAGES.md). Use the
   tokens and the module from style.css; never restyle the shell (header,
   footer) or the shared components here.

   Two parts:
   1. The page: the facts rail, the featured image, the newer/older rows.
   2. .entry-content: everything the WordPress block editor can put in a
      post, written against the markup and class names WordPress saves
      (core blocks, text formats, the palette's colour classes), so this part
      ports into the theme as it is. blog/block-editor-specimen/ shows all of
      it; every post uses the same rules.

   The module. --g (one unit) exists inside .wrap. The post sits on the
   8-column grid: on desktop the facts take columns 1-2 and the text starts
   on column 3; the measure is 4 columns (31 units, about 70 characters,
   since the text size follows the unit) from 1280 px, 5 below; wide blocks
   run to column 8, full blocks to the window's edges. Vertical rhythm is
   --step: 1 unit on desktop, 2 on tablets, 3 on phones (17-21 px). */

/* =============================================================== 1. the page */

.a-article > .p-head > .wrap > .p-grid { padding-bottom: 0; }
.a-article > .a-post > .wrap > .p-grid { padding-top: calc(var(--g) * 4); padding-bottom: 0; }
.a-post { overflow-x: clip; } /* a full-width block is 100vw: never a sideways scroll */

.a-grid { align-items: start; }
.a-grid > * { grid-column: 1 / -1; min-width: 0; }

/* the facts: published, author, categories, reading time, tags (style.css
   .facts: an ink top rule, hairline rows) */
.a-grid > .a-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: calc(var(--g) * 3);
  margin-bottom: calc(var(--g) * 6);
}
.a-grid > .a-meta { grid-row: auto; }           /* style.css gives .facts grid-area: facts */
.a-meta > .a-meta-tags { grid-column: 1 / -1; }
.a-meta dd { overflow-wrap: anywhere; }
.a-tags { display: inline; }
.a-tags li { display: inline; }
.a-tags li + li::before { content: ", "; }

/* the featured image: whole page columns, a tall picture narrower */
.a-cover { margin-bottom: calc(var(--g) * 6); }
.a-cover img { width: 100%; }

/* below the desktop rail: the picture under the title, then the facts, then the text */
@media (max-width: 1023px) {
  .a-grid > .a-cover { order: -1; }
}
@media (min-width: 640px) {
  .a-grid > .a-meta { grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: var(--g); margin-bottom: calc(var(--g) * 4); }
  .a-grid > .a-cover { margin-bottom: calc(var(--g) * 4); }
  .a-grid > .a-cover--4 { grid-column: 1 / span 6; }
  .a-grid > .a-cover--3 { grid-column: 1 / span 4; }
}

/* desktop: the facts are the rail (columns 1-2) beside the picture and the text */
@media (min-width: 1024px) {
  .a-grid > .a-meta { display: block; grid-column: 1 / span 2; grid-row: 1 / span 2; margin: 0; }
  .a-grid > .a-cover { grid-column: 3 / span 6; grid-row: 1; margin-bottom: calc(var(--g) * 3); }
  .a-grid > .a-cover--4 { grid-column: 3 / span 4; }
  .a-grid > .a-cover--3 { grid-column: 3 / span 3; }
  .a-grid > .entry-content { grid-column: 3 / -1; grid-row: 2; }
}

/* newer, older, back to the blog: rows on hairlines, the title on the text's
   column; the row under the pointer or the focus is the page's mint field */
.a-more > .wrap > .p-grid { padding-top: calc(var(--g) * 8); }
.a-pager { grid-column: 1 / -1; border-top: 1px solid var(--ink); }
.a-pager > li { border-bottom: 1px solid var(--hair); }
.a-pager a {
  display: grid;
  grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
  column-gap: var(--g);
  align-items: baseline;
  padding-block: var(--g) calc(var(--g) * 1.5);
  text-decoration: none;
}
.a-pager a:focus-visible { outline-offset: -2px; }
.a-dir { grid-column: 1 / span 2; padding-left: var(--g); font-size: 15px; color: var(--ink-2); }
.a-ttl {
  grid-column: 3 / -1;
  padding-right: var(--g);
  font-weight: 600;
  font-size: clamp(20px, 0.9rem + 0.9vw, 32px);
  line-height: 1.1;
  letter-spacing: -0.022em;
  text-wrap: balance;
}
.a-pager a:hover .a-ttl { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.16em; }
[data-mint="hover"]:is(:hover, :focus-within, .is-on) .a-dir { color: var(--ink); }
@media (max-width: 639px) {
  .a-more > .wrap > .p-grid { padding-top: 72px; }
  .a-pager a { padding: 14px 12px 16px; row-gap: 4px; }
  .a-dir, .a-ttl { grid-column: 1 / -1; padding: 0; }
  .a-dir { font-size: 14px; }
}

/* =============================================================== 2. the content */

.entry-content {
  --measure: 100%;
  --step: calc(var(--g) * 3);
  --pad: calc(var(--g) * 3);
  --bleed: calc((100vw - var(--g) * 63) / 2);    /* the content's left edge to the window's */
  display: flow-root;
  font-size: clamp(17px, calc(var(--g) * 0.85), 21px);
  line-height: 1.6;
  text-wrap: pretty;
  overflow-wrap: break-word;
}
@media (min-width: 640px) {
  .entry-content { --measure: calc(var(--g) * 55); --step: calc(var(--g) * 2); --pad: calc(var(--g) * 2); }
}
@media (min-width: 1024px) {
  .entry-content { --measure: calc(var(--g) * 39); --step: var(--g); --bleed: calc((100vw - var(--g) * 63) / 2 + var(--g) * 16); }
}
@media (min-width: 1280px) {
  .entry-content { --measure: calc(var(--g) * 31); }
}

/* ---------- flow ---------- */

.entry-content > * { max-width: var(--measure); margin-block: 0; }
.entry-content > * + *,
.entry-content :is(.wp-block-group, .wp-block-column, .wp-block-media-text__content, .wp-block-cover__inner-container, .wp-block-details, blockquote) > * + * { margin-top: var(--step); }
.entry-content :is(.wp-block-group, .wp-block-column, .wp-block-media-text__content, .wp-block-cover__inner-container) > :first-child { margin-top: 0; }

/* ---------- alignments ---------- */

.entry-content > .alignwide { max-width: none; }
.entry-content > .alignfull { max-width: none; width: 100vw; margin-left: calc(var(--bleed) * -1); }
.entry-content > .alignfull > .wp-element-caption { margin-left: var(--bleed); max-width: var(--measure); }
.entry-content > .aligncenter { margin-left: 0; margin-right: auto; text-align: center; }
.entry-content .wp-block-image.aligncenter img { display: inline-block; vertical-align: top; }

.entry-content > :is(.alignleft, .alignright) { width: calc(var(--g) * 23); margin-bottom: var(--step); }
/* a float stands where the next block starts: its top on that block's first line */
.entry-content > .alignleft { float: left; margin: calc(var(--step) + 0.4em) var(--step) var(--step) 0; }
.entry-content > .alignright { float: right; margin: calc(var(--step) + 0.4em) 0 var(--step) var(--step); }
@media (min-width: 1024px) {
  .entry-content > :is(.alignleft, .alignright) { width: calc(var(--g) * 15); }
  .entry-content > .alignleft { margin-right: var(--g); }
  .entry-content > .alignright { margin-left: var(--g); }
}
/* phones: a floated block stands on its own line */
@media (max-width: 639px) {
  .entry-content > :is(.alignleft, .alignright) { float: none; width: auto; margin: var(--step) 0 0; }
}

.entry-content .has-text-align-left { text-align: left; }
.entry-content .has-text-align-center { text-align: center; }
.entry-content .has-text-align-right { text-align: right; }

/* ---------- paragraph ---------- */

.entry-content .has-small-font-size { font-size: 0.8333em; line-height: 1.55; }
.entry-content .has-medium-font-size { font-size: 1.1111em; line-height: 1.5; }
.entry-content .has-large-font-size { font-size: 1.4444em; line-height: 1.3; font-weight: 500; letter-spacing: -0.012em; }
.entry-content .has-x-large-font-size {
  font-size: clamp(28px, 1rem + 2vw, 46px);
  line-height: 1.06;
  font-weight: 600;
  letter-spacing: -0.03em;
  text-wrap: balance;
}

/* the drop cap: an ink cell three lines tall, the letter cut out of it */
.entry-content .has-drop-cap:not(:focus)::first-letter {
  float: left;
  margin: 0.1em 0.24em 0 0;
  padding: 0.1em 0.2em 0.1em;
  background: var(--ink);
  color: var(--ground);
  font-size: 3.85em;
  font-weight: 600;
  line-height: 0.86;
  letter-spacing: 0;
  text-transform: uppercase;
}

/* ---------- headings ---------- */

.entry-content :is(h1, h2, h3, h4, h5, h6) { font-weight: 600; text-wrap: balance; }
.entry-content h1 {
  margin-top: calc(var(--step) * 4);
  font-size: clamp(30px, 1rem + 2.2vw, 54px);
  line-height: 1.04;
  letter-spacing: -0.034em;
}
/* a section of the article starts on an ink rule, as the facts and the plates do */
.entry-content h2 {
  margin-top: calc(var(--step) * 3);
  padding-top: var(--step);
  border-top: 1px solid currentColor;
  font-size: clamp(25px, 0.9rem + 1.3vw, 38px);
  line-height: 1.1;
  letter-spacing: -0.028em;
  clear: both;
}
.entry-content h3 { margin-top: calc(var(--step) * 2); font-size: clamp(21px, 0.9rem + 0.6vw, 27px); line-height: 1.18; letter-spacing: -0.018em; }
.entry-content h4 { margin-top: calc(var(--step) * 2); font-size: clamp(19px, 0.95rem + 0.3vw, 22px); line-height: 1.25; letter-spacing: -0.01em; }
.entry-content h5 { margin-top: calc(var(--step) * 2); font-size: 1em; line-height: 1.4; }
.entry-content h6 { margin-top: calc(var(--step) * 2); font-size: 0.8333em; line-height: 1.4; color: var(--ink-2); }
.entry-content > :is(h1, h2, h3, h4, h5, h6):first-child { margin-top: 0; }
@media (min-width: 1280px) {
  /* a right float stands in the margin here: only a left one is cleared */
  .entry-content h2 { clear: left; }
}

/* ---------- lists ---------- */

.entry-content :is(ul, ol) { padding-left: 1.4em; }
.entry-content ol { padding-left: 2.1em; list-style-type: decimal-leading-zero; }
.entry-content ol[type="a" s] { list-style-type: lower-alpha; }
.entry-content ol[type="A" s] { list-style-type: upper-alpha; }
.entry-content ol[type="i" s] { list-style-type: lower-roman; }
.entry-content ol[type="I" s] { list-style-type: upper-roman; }
.entry-content ol > li::marker { font-family: var(--mono); font-weight: 500; font-size: 0.82em; }
/* the homepage's squares: filled at the first level, open below it */
.entry-content ul > li { position: relative; }
.entry-content ul > li::before {
  content: "";
  position: absolute;
  left: -1.4em;
  top: 0.62em;
  width: 0.36em;
  height: 0.36em;
  background: currentColor;
}
.entry-content :is(ul, ol) ul > li::before { background: transparent; box-shadow: inset 0 0 0 1.5px currentColor; }
.entry-content li + li,
.entry-content li > :is(ul, ol) { margin-top: 0.4em; }

/* ---------- quote, pullquote ---------- */

.entry-content blockquote { margin-inline: 0; }
.entry-content :is(.wp-block-quote, blockquote:not(.wp-block-pullquote blockquote)) {
  padding-left: var(--pad);
  border-left: 2px solid currentColor;
  font-weight: 500;
  font-size: 1.0556em;
  letter-spacing: -0.006em;
}
.entry-content cite {
  display: block;
  font-style: normal;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.4;
  letter-spacing: 0;
  color: var(--ink-2);
}
.entry-content .wp-block-quote.is-style-large {
  padding: var(--step) 0 0;
  border-left: 0;
  border-top: 1px solid currentColor;
  font-weight: 600;
  font-size: clamp(24px, 0.9rem + 1.2vw, 34px);
  line-height: 1.15;
  letter-spacing: -0.024em;
}
.entry-content .wp-block-quote.is-style-large p { text-wrap: balance; }
.entry-content .wp-block-pullquote {
  margin-block: calc(var(--step) * 3);
  padding-block: calc(var(--step) * 1.5) calc(var(--step) * 2);
  border-top: 2px solid currentColor;
  border-bottom: 1px solid currentColor;
}
.entry-content * + .wp-block-pullquote,
.entry-content .wp-block-pullquote + * { margin-top: calc(var(--step) * 3); }
.entry-content .wp-block-pullquote blockquote { margin: 0; padding: 0; border: 0; }
.entry-content .wp-block-pullquote p {
  font-weight: 600;
  font-size: clamp(27px, 1rem + 1.9vw, 46px);
  line-height: 1.06;
  letter-spacing: -0.032em;
  text-wrap: balance;
}
.entry-content .wp-block-pullquote cite { margin-top: var(--step); }

/* ---------- code, preformatted, verse ---------- */

.entry-content :is(code, kbd, pre) { font-family: var(--mono); }
.entry-content :not(pre) > code {
  padding: 0.08em 0.3em;
  background: rgba(17, 17, 17, 0.07);
  font-size: 0.84em;
  overflow-wrap: anywhere;
}
.entry-content pre { overflow-x: auto; white-space: pre; tab-size: 2; }
.entry-content .wp-block-code {
  padding: calc(var(--step) * 1.5);
  border-top: 1px solid var(--ink);
  background: rgba(17, 17, 17, 0.05);
  font-size: 0.8em;
  line-height: 1.6;
}
.entry-content .wp-block-code code { font: inherit; background: none; padding: 0; }
.entry-content .wp-block-preformatted {
  padding: calc(var(--step) * 1.5);
  border: 1px solid var(--hair);
  font-size: 0.8em;
  line-height: 1.6;
  white-space: pre-wrap;
}
.entry-content .wp-block-verse {
  padding-left: var(--pad);
  font-family: var(--sans);
  font-size: 1em;
  line-height: 1.6;
  white-space: pre-wrap;
}
.entry-content kbd {
  display: inline-block;
  padding: 0 0.35em;
  border: 1px solid currentColor;
  font-size: 0.8em;
  font-weight: 500;
  line-height: 1.45;
}

/* ---------- table ---------- */

.entry-content .wp-block-table { overflow-x: auto; }
.entry-content table {
  width: 100%;
  border-collapse: collapse;
  border-top: 1px solid currentColor;
  font-size: 0.8889em;
  line-height: 1.45;
}
.entry-content :is(th, td) {
  padding: 0.6em 0.8em 0.65em 0;
  border-bottom: 1px solid var(--hair);
  text-align: left;
  vertical-align: top;
}
.entry-content thead :is(th, td) { border-bottom-color: currentColor; font-weight: 600; }
.entry-content tfoot :is(th, td) { border-top: 1px solid currentColor; border-bottom: 0; font-weight: 500; }
.entry-content table.has-fixed-layout { table-layout: fixed; }
.entry-content .is-style-stripes table { border-top-color: currentColor; }
.entry-content .is-style-stripes :is(th, td) { padding-left: 0.8em; border-bottom: 0; }
.entry-content .is-style-stripes tbody tr:nth-child(odd) { background: rgba(17, 17, 17, 0.05); }
.entry-content .is-style-stripes thead :is(th, td) { border-bottom: 1px solid currentColor; }
.entry-content .wp-block-table td.num { font-size: 0.94em; }

/* ---------- separator ---------- */

.entry-content hr {
  height: 0;
  margin: calc(var(--step) * 2) 0 0;
  color: inherit;
  border: 0;
  border-top: 1px solid currentColor;
  opacity: 1;
  width: calc(var(--g) * 7);    /* one page column */
  max-width: var(--measure);
}
.entry-content > * + hr,
.entry-content > hr + * { margin-top: calc(var(--step) * 2); }
.entry-content hr.is-style-wide { width: auto; }
.entry-content hr.is-style-dots {
  width: 40px;
  height: 8px;
  border: 0;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 8' shape-rendering='crispEdges'%3E%3Crect width='8' height='8' fill='%23111111'/%3E%3Crect x='16' width='8' height='8' fill='%23111111'/%3E%3Crect x='32' width='8' height='8' fill='%23111111'/%3E%3C/svg%3E") 0 0 / 40px 8px no-repeat;
}
.entry-content hr.is-style-dots::before { content: none; }

/* ---------- details, footnotes ---------- */

.entry-content .wp-block-details { border-top: 1px solid currentColor; border-bottom: 1px solid var(--hair); }
.entry-content .wp-block-details + .wp-block-details { margin-top: 0; border-top: 0; }
.entry-content .wp-block-details summary {
  display: flex;
  gap: 0.6em;
  padding-block: 0.6em 0.7em;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
}
.entry-content .wp-block-details summary::-webkit-details-marker { display: none; }
.entry-content .wp-block-details summary::before { content: "+"; flex: none; width: 0.8em; font-family: var(--mono); font-weight: 500; }
.entry-content .wp-block-details[open] > summary::before { content: "\2212"; }
.entry-content .wp-block-details[open] { padding-bottom: var(--step); }
.entry-content .wp-block-details > summary + * { margin-top: 0; }
.entry-content .wp-block-details > :not(summary) { padding-left: 1.4em; }

.entry-content :is(sup, sub) { position: relative; font-size: 0.72em; line-height: 0; vertical-align: baseline; }
.entry-content sup { top: -0.48em; }
.entry-content sub { bottom: -0.22em; }
.entry-content sup.fn a {
  padding-inline: 0.12em;
  font-family: var(--mono);
  font-weight: 500;
  text-decoration: none;
}
.entry-content sup.fn a:hover { text-decoration: underline; }
.entry-content .wp-block-footnotes {
  margin-top: calc(var(--step) * 3);
  padding-top: var(--step);
  border-top: 1px solid currentColor;
  font-size: 0.8333em;
  line-height: 1.55;
}
.entry-content .wp-block-footnotes li:target { background: rgba(17, 17, 17, 0.07); }
.entry-content .wp-block-footnotes a[href^="#"] { text-decoration: none; }

/* ---------- buttons, file ---------- */

.entry-content .wp-block-buttons { display: flex; flex-wrap: wrap; align-items: center; gap: var(--g); }
.entry-content .wp-block-buttons.is-content-justification-center { justify-content: center; }
.entry-content .wp-block-buttons.is-content-justification-right { justify-content: flex-end; }
.entry-content .wp-block-buttons.is-vertical { flex-direction: column; align-items: flex-start; }
.entry-content :is(.wp-block-button__link, .wp-block-file__button) {
  display: inline-flex;
  align-items: center;
  min-height: max(44px, calc(var(--g) * 2));
  padding: 0.4em 1.1em;
  border: 1px solid var(--ink);
  border-radius: 0;
  background: var(--ink);
  color: var(--ground);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.2;
  text-decoration: none;
}
/* the states step, they never tween */
.entry-content :is(.wp-block-button__link, .wp-block-file__button):hover { background: var(--ground); color: var(--ink); }
.entry-content .is-style-outline > .wp-block-button__link { background: transparent; color: var(--ink); }
.entry-content .is-style-outline > .wp-block-button__link:hover { background: var(--ink); color: var(--ground); }
.entry-content .wp-block-file {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.6em var(--g);
  padding-block: 0.8em;
  border-top: 1px solid currentColor;
  border-bottom: 1px solid var(--hair);
}
.entry-content .wp-block-file > a:first-child { font-weight: 500; overflow-wrap: anywhere; }
.entry-content .wp-block-file__button { min-height: 40px; font-size: 15px; }

/* ---------- links ---------- */

.entry-content a { text-decoration-thickness: 1px; text-underline-offset: 0.22em; }
.entry-content a:visited { text-decoration-color: rgba(17, 17, 17, 0.42); }
.entry-content a:hover { text-decoration-thickness: 2px; text-decoration-color: currentColor; }
.entry-content a:focus-visible { outline-offset: 2px; }
.entry-content :is(.has-ink-background-color, .has-grey-dark-background-color, .has-grey-background-color) :focus-visible { outline-color: var(--ground); }
.entry-content :is(.has-ink-background-color, .has-grey-dark-background-color, .has-grey-background-color) a:visited { text-decoration-color: rgba(244, 244, 242, 0.5); }

/* ---------- inline formats ---------- */

.entry-content s, .entry-content del { text-decoration-thickness: 1px; }
.entry-content abbr[title] { text-decoration: underline dotted 1px; text-underline-offset: 0.22em; cursor: help; }
/* the highlight: ink, the type cut out of it */
.entry-content mark {
  padding: 0 0.16em;
  background: var(--ink);
  color: var(--ground);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
/* the highlight tool with a text colour only (WordPress writes a transparent background) */
.entry-content mark.has-inline-color { padding: 0; color: inherit; }
/* a highlight given any background colour is the one highlight */
.entry-content mark[style*="background-color"]:not([style*="rgba(0, 0, 0, 0)"]) {
  padding: 0 0.16em;
  background-color: var(--ink) !important;
  color: var(--ground) !important;
}
/* an inline image sits in the line, a capital letter high */
.entry-content :is(p, li, td, th, h1, h2, h3, h4, h5, h6, figcaption, cite, summary) img {
  display: inline-block;
  width: auto;
  height: 1em;
  vertical-align: -0.12em;
}
.entry-content :is(p, li, td, th, h1, h2, h3, h4, h5, h6, figcaption, cite, summary) img[style*="width"] { height: auto; }

/* ---------- image, gallery ---------- */

.entry-content img { max-width: 100%; height: auto; }
.entry-content .wp-element-caption,
.entry-content figcaption {
  margin-top: 0.7em;
  font-size: 14px;
  line-height: 1.45;
  color: var(--ink-2);
  text-wrap: pretty;
}
.entry-content .aligncenter > .wp-element-caption { text-align: center; }

.entry-content .wp-block-gallery {
  --gap: var(--g);
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap);
  align-items: stretch;
}
.entry-content .wp-block-gallery > .wp-block-image {
  display: flex;
  flex-direction: column;
  flex: 1 0 calc((100% - var(--gap) * 2) / 3);
  max-width: 100%;
  margin: 0;
}
.entry-content .wp-block-gallery.columns-2 > .wp-block-image { flex-basis: calc((100% - var(--gap)) / 2); }
.entry-content .wp-block-gallery.columns-4 > .wp-block-image { flex-basis: calc((100% - var(--gap) * 3) / 4); }
.entry-content .wp-block-gallery.columns-1 > .wp-block-image { flex-basis: 100%; }
.entry-content .wp-block-gallery.is-cropped > .wp-block-image img { flex: 1 1 auto; height: 100%; object-fit: cover; }
.entry-content .wp-block-gallery > .blocks-gallery-caption { flex-basis: 100%; margin-top: 0; }
@media (max-width: 639px) {
  .entry-content .wp-block-gallery { --gap: calc(var(--g) * 2); }
  .entry-content .wp-block-gallery:not(.columns-1) > .wp-block-image { flex-basis: calc((100% - var(--gap)) / 2); }
}

/* ---------- embed ---------- */

.entry-content .wp-block-embed__wrapper { position: relative; background: var(--ink); }
.entry-content .wp-has-aspect-ratio .wp-block-embed__wrapper::before { content: ""; display: block; padding-top: 56.25%; }
.entry-content .wp-embed-aspect-21-9 .wp-block-embed__wrapper::before { padding-top: 42.85%; }
.entry-content .wp-embed-aspect-4-3 .wp-block-embed__wrapper::before { padding-top: 75%; }
.entry-content .wp-embed-aspect-1-1 .wp-block-embed__wrapper::before { padding-top: 100%; }
.entry-content .wp-embed-aspect-9-16 .wp-block-embed__wrapper::before { padding-top: 177.77%; }
.entry-content .wp-has-aspect-ratio .wp-block-embed__wrapper iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.entry-content .wp-block-embed iframe { display: block; max-width: 100%; border: 0; }

/* ---------- media & text, columns ---------- */

.entry-content .wp-block-media-text {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--g);
  align-items: center;
}
.entry-content .wp-block-media-text.is-vertically-aligned-top { align-items: start; }
.entry-content .wp-block-media-text.is-vertically-aligned-bottom { align-items: end; }
.entry-content .wp-block-media-text__media { margin: 0; }
.entry-content .wp-block-media-text__media img { width: 100%; }
.entry-content .wp-block-media-text__content { padding: var(--pad) 0; }
.entry-content .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media { grid-column: 2; grid-row: 1; }
.entry-content .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content { grid-column: 1; grid-row: 1; }
.entry-content .wp-block-media-text.has-background .wp-block-media-text__content { padding-inline: var(--pad); }

.entry-content .wp-block-columns { display: flex; gap: var(--step) var(--g); }
.entry-content .wp-block-column { flex: 1 1 0; min-width: 0; }
.entry-content .wp-block-columns.are-vertically-aligned-center { align-items: center; }

@media (max-width: 639px) {
  .entry-content .wp-block-media-text.is-stacked-on-mobile { grid-template-columns: 100%; row-gap: var(--step); }
  .entry-content .wp-block-media-text.is-stacked-on-mobile > * { grid-column: 1 !important; grid-row: auto !important; }
  .entry-content .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content { padding-block: 0; }
  .entry-content .wp-block-columns:not(.is-not-stacked-on-mobile) { flex-direction: column; }
}

/* ---------- group, cover ---------- */

.entry-content :is(.wp-block-group, p, h1, h2, h3, h4, h5, h6, .wp-block-columns).has-background { padding: var(--pad); }
.entry-content h2.has-background { border-top: 0; }

/* the cover: the picture is never dimmed (images are never shaded): the
   text stands on an ink plate, legible on any picture */
.entry-content .wp-block-cover {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: max(360px, calc(var(--g) * 21));
  padding: var(--pad);
  overflow: hidden;
}
.entry-content .wp-block-cover__background,
.entry-content .wp-block-cover__gradient-background { display: none; }
.entry-content .wp-block-cover__image-background,
.entry-content .wp-block-cover__video-background {
  position: absolute;
  inset: 0;
  width: 100%;
  max-width: none;
  height: 100%;
  object-fit: cover;
}
.entry-content .wp-block-cover__inner-container {
  position: relative;
  z-index: 1;
  max-width: calc(var(--g) * 23);
  padding: var(--pad);
  background: var(--ink);
  color: var(--ground);
}
.entry-content .wp-block-cover__inner-container :focus-visible { outline-color: var(--ground); }
.entry-content .wp-block-cover.is-position-top-left { align-items: flex-start; justify-content: flex-start; }
.entry-content .wp-block-cover.is-position-top-center { align-items: flex-start; justify-content: center; }
.entry-content .wp-block-cover.is-position-top-right { align-items: flex-start; justify-content: flex-end; }
.entry-content .wp-block-cover.is-position-center-left { align-items: center; justify-content: flex-start; }
.entry-content .wp-block-cover.is-position-center-right { align-items: center; justify-content: flex-end; }
.entry-content .wp-block-cover.is-position-bottom-left { align-items: flex-end; justify-content: flex-start; }
.entry-content .wp-block-cover.is-position-bottom-center { align-items: flex-end; justify-content: center; }
.entry-content .wp-block-cover.is-position-bottom-right { align-items: flex-end; justify-content: flex-end; }
@media (max-width: 639px) {
  .entry-content .wp-block-cover { min-height: 300px; padding: calc(var(--g) * 2); }
  .entry-content .wp-block-cover__inner-container { max-width: none; }
}

/* ---------- the palette ----------
   theme.json offers five colours from the tokens (slugs: ink, grey-dark,
   grey, ground, mint; custom colours and gradients off). WordPress writes
   these classes with !important; the guards below win over them, so an
   editor's choice can never hide text or add a second mint field:
   - mint is a field, never a text colour: mint text is drawn in the text's colour;
   - ground text away from a dark background is drawn in ink;
   - a dark background always gets ground text, a light one ink text;
   - only the page's first mint background is mint (_build.py marks it
     data-mint, the field the lean keeps flat); a second one is a framed
     ground panel. */
.entry-content .has-ink-color { color: var(--ink) !important; }
.entry-content .has-grey-dark-color { color: #2a2a2a !important; }
.entry-content .has-grey-color { color: #444444 !important; }
.entry-content .has-ground-color { color: var(--ground) !important; }
.entry-content .has-mint-color { color: inherit !important; }

.entry-content .has-ink-background-color { background-color: var(--ink) !important; color: var(--ground); }
.entry-content .has-grey-dark-background-color { background-color: #2a2a2a !important; color: var(--ground); }
.entry-content .has-grey-background-color { background-color: #444444 !important; color: var(--ground); }
.entry-content .has-ground-background-color { background-color: var(--ground) !important; color: var(--ink); outline: 1px solid var(--hair); outline-offset: -1px; }
.entry-content .has-mint-background-color[data-mint] { background-color: var(--mint) !important; color: var(--ink); }
.entry-content .has-mint-background-color:not([data-mint]) { background-color: var(--ground) !important; color: var(--ink); outline: 1px solid var(--ink); outline-offset: -1px; }

.entry-content :is(.has-ink-background-color, .has-grey-dark-background-color, .has-grey-background-color):is(.has-ink-color, .has-grey-dark-color, .has-grey-color) { color: var(--ground) !important; }
.entry-content :is(.has-ground-background-color, .has-mint-background-color):is(.has-ground-color) { color: var(--ink) !important; }
.entry-content .has-ground-color:not(.has-ink-background-color, .has-grey-dark-background-color, .has-grey-background-color):not(:is(.has-ink-background-color, .has-grey-dark-background-color, .has-grey-background-color, .wp-block-cover__inner-container) *) { color: var(--ink) !important; }
.entry-content :is(.has-ink-background-color, .has-grey-dark-background-color, .has-grey-background-color) :is(cite, .wp-element-caption, h6) { color: rgba(244, 244, 242, 0.72); }
.entry-content :is(.has-ink-background-color, .has-grey-dark-background-color, .has-grey-background-color) :not(pre) > code { background: rgba(244, 244, 242, 0.14); }
.entry-content .has-mint-background-color[data-mint] :focus-visible { outline-color: var(--ink); }

@media print {
  .a-pager [data-mint] { background: none; }
  .entry-content .wp-block-cover__image-background { position: static; height: auto; }
}