@font-face {
  font-family: "Margin Rubik";
  src: url("/assets/margin-rubik.831342ac7147.woff") format("woff");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  --paper: #efebf4;
  --ink: #28252d;
  --subtle: #544d5d;
  --rule: #8c8197;
  --wash: #ded6e7;
  --spot: #805b72;
  color-scheme: light;
  font-family: "Margin Rubik", ui-rounded, "Arial Rounded MT Bold", sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-synthesis: weight;
}

* { box-sizing: border-box; }
body { margin: 0; font-size: 18px; line-height: 1.7; }
h1, h2, h3, p, figure, dl, dd, ol, ul { margin: 0; }
h1, h2, h3 { font-weight: 700; text-wrap: balance; }
h1 { font-size: clamp(2.5rem, 6.3vw, 5.4rem); line-height: 1.07; letter-spacing: -.045em; }
h2 { font-size: clamp(1.65rem, 2.5vw, 2.15rem); line-height: 1.24; letter-spacing: -.025em; }
h3 { font-size: 1.25rem; line-height: 1.4; }
p, li, dd { overflow-wrap: break-word; }
a { color: inherit; display: inline-flex; align-items: center; min-block-size: 48px; max-inline-size: 100%; text-underline-offset: .22em; text-decoration-thickness: .085em; }
a:hover { background: var(--wash); }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid var(--ink); outline-offset: 5px; }
button, input { font: inherit; color: inherit; border-radius: 0; }
button { min-height: 48px; padding: .55rem 1rem; border: 2px solid var(--ink); background: transparent; cursor: pointer; }
button:hover { background: var(--wash); }
input { min-height: 54px; width: 100%; padding: .65rem .85rem; border: 2px solid var(--ink); background: #fbf9fd; }
img { display: block; width: 100%; height: auto; object-fit: cover; font-size: 16px; line-height: 1.5; color: var(--subtle); }
::selection { background: #cbc0d7; color: #201c26; }
[hidden] { display: none !important; }

.u-page-width { max-width: 1216px; }
.u-auto-margin { margin-inline: auto; }
.u-side-space { padding-inline: 40px; }
.u-grid { display: grid; }
.u-flex { display: flex; }
.u-flex-wrap { flex-wrap: wrap; }
.u-align-center { align-items: center; }
.u-align-end { align-items: end; }
.u-space-between { justify-content: space-between; }
.u-gap-xs { gap: .5rem; }
.u-gap-s { gap: 1rem; }
.u-gap-m { gap: 1.75rem; }
.u-gap-l { gap: 3.5rem; }
.u-min-zero { min-width: 0; }
.u-hero-columns { grid-template-columns: minmax(0, 1.3fr) minmax(0, .8fr); }
.u-reading-columns { grid-template-columns: 176px minmax(0, 720px); }
.u-intro-columns { grid-template-columns: 176px minmax(0, 850px); }
.u-entry-columns { grid-template-columns: 74px minmax(0, 1fr) 28px; }
.u-filter-columns { grid-template-columns: minmax(0, 1fr) auto; }
.u-title-measure { max-width: 17ch; }
.u-article-title { max-width: 20ch; }
.u-copy-measure { max-width: 66ch; }
.u-lead { font-size: clamp(1.15rem, 1.65vw, 1.4rem); }
.u-small-copy { font-size: 16px; }
.u-muted { color: var(--subtle); }
.u-heavy { font-weight: 700; }
.u-tight-leading { line-height: 1.3; }
.u-flat-list { list-style: none; }
.u-no-padding { padding: 0; }
.u-list-indent { padding-inline-start: 1.35rem; }
.u-rule-top { border-top: 3px solid var(--rule); }
.u-rule-bottom { border-bottom: 3px solid var(--rule); }
.u-ink-rule { border-color: var(--ink); }
.u-note-rule { border-inline-start: 3px solid var(--rule); }
.u-pl-m { padding-inline-start: 1.25rem; }
.u-py-s { padding-block: .65rem; }
.u-py-m { padding-block: 1.45rem; }
.u-py-l { padding-block: 2.8rem; }
.u-pt-s { padding-block-start: .8rem; }
.u-pt-m { padding-block-start: 1.75rem; }
.u-pt-l { padding-block-start: 3rem; }
.u-pb-l { padding-block-end: 3rem; }
.u-pb-xl { padding-block-end: 5rem; }
.u-mb-s { margin-block-end: 1rem; }
.u-mb-m { margin-block-end: 1.75rem; }
.u-mb-l { margin-block-end: 3.5rem; }
.u-mt-s { margin-block-start: .6rem; }
.u-mt-m { margin-block-start: 1.5rem; }
.u-mt-l { margin-block-start: 3.5rem; }
.u-mt-xl { margin-block-start: 5rem; }
.u-source-line { font-size: 16px; }
.u-source-gap { column-gap: .6rem; }
.u-initial { font-size: clamp(6rem, 13vw, 11rem); }
.u-initial-leading { line-height: .85; }
.u-initial-tracking { letter-spacing: -.08em; }
.u-entry-initial { font-size: 3rem; }
.u-block { display: block; }
.u-no-decoration { text-decoration: none; }
.u-underlined { text-decoration: underline; }
.u-margin-note { max-width: 25ch; }
.u-square-spot { width: 9px; }
.u-spot-height { height: 9px; }
.u-spot-colour { background: var(--spot); }
.u-paper-plate { background: #e0dae6; }
.u-relative { position: relative; }
.u-collage-ground { background-image: linear-gradient(154deg, transparent 53%, #f8f6f9 53%, #f8f6f9 75%, transparent 75%), linear-gradient(25deg, #d2cbd9 22%, transparent 22%); }
.u-figure-ratio { aspect-ratio: 6 / 5; }
.u-full-height { height: 100%; }
.u-caption { padding-block: .8rem; }
.u-ornament-position { position: absolute; }
.u-ornament-inset { inset: auto 1.5rem 1rem auto; }
.u-ornament-size { font-size: clamp(9rem, 19vw, 16rem); }
.u-no-pointer { pointer-events: none; }
.u-filter-width { max-width: 720px; }
.u-column-gap { column-gap: 2rem; }
.u-bottom-link { font-weight: 700; }

.u-skip-link { position: absolute; inset-inline-start: 16px; top: -100px; padding: .6rem 1rem; background: #fbf9fd; z-index: 10; }
.u-skip-link:focus { top: 12px; }
.u-entry-link:hover { background: #e2dbe9; }
.u-questions li + li { margin-block-start: .6rem; }
.u-paragraph + .u-paragraph { margin-block-start: 1rem; }
.u-term + .u-term { margin-block-start: 2.5rem; }

@media (max-width: 900px) {
  .u-side-space { padding-inline: 28px; }
  .u-hero-columns { grid-template-columns: minmax(0, 1fr) minmax(0, .65fr); }
  .u-reading-columns, .u-intro-columns { grid-template-columns: 140px minmax(0, 1fr); }
  .u-gap-l { gap: 2rem; }
  .u-title-measure { max-width: 20ch; }
}

@media (max-width: 650px) {
  .u-side-space { padding-inline: 20px; }
  .u-hero-columns, .u-reading-columns, .u-intro-columns { grid-template-columns: minmax(0, 1fr); }
  .u-gap-l { gap: 1.75rem; }
  .u-initial { font-size: 5.5rem; }
  .u-hero-plate { max-width: 420px; }
  .u-title-measure, .u-article-title { max-width: 23ch; }
  .u-margin-note { max-width: 100%; }
  .u-margin-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); column-gap: 1rem; }
  .u-entry-columns { grid-template-columns: 44px minmax(0, 1fr) 20px; }
  .u-entry-initial { font-size: 2.1rem; }
  .u-py-l { padding-block: 2rem; }
  .u-mt-xl { margin-block-start: 3.2rem; }
  .u-pb-xl { padding-block-end: 3rem; }
  .u-filter-columns { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}

@media print {
  :root { color: #000; background: #fff; }
  .u-skip-link, .u-filter-controls, .u-hero-plate { display: none; }
  .u-side-space { padding-inline: 0; }
  a { text-decoration: underline; }
  .u-reading-columns { grid-template-columns: 130px minmax(0, 1fr); }
  .u-term { break-inside: avoid; }
}
