@charset "UTF-8";
.centre, .center {
  float: none;
  margin-inline: auto;
}

.medium, .small {
  width: 100%;
}

.medium {
  max-width: 40rem;
}

.small {
  max-width: 20rem;
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  font: inherit;
  line-height: 1;
}

html {
  scroll-behavior: smooth;
}

ul, ol {
  list-style: none;
  padding: 0;
}

a {
  color: inherit;
  text-decoration: none;
}

img, picture, svg {
  width: 100%;
  max-width: 100%;
  display: block;
}

.visually-hidden {
  position: absolute;
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

body {
  color: #0d0d0d;
}

body {
  font-family: futura-pt, sans-serif;
}

.font-flash-fix {
  font-family: moret, serif;
  font-weight: 300;
}
.font-flash-fix em {
  font-style: italic;
}
.font-flash-fix span {
  font-family: futura-pt, sans-serif;
  font-weight: 600;
}

nav > ul {
  font-family: futura-pt-bold, sans-serif;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 0.08em;
  font-size: 0.8rem;
}
nav > ul > li:hover, nav > ul > li.open {
  text-decoration: underline;
  text-underline-offset: 0.2em;
  text-decoration-color: #DA4F4E;
  text-decoration-thickness: 0.4em;
  text-underline-offset: 0.6em;
}

nav > ul ul, ul.sectionlist {
  font-family: moret, serif;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 300;
  font-size: 1rem;
}
nav > ul ul li, ul.sectionlist li {
  margin-block: 0.8em 1em;
}
nav > ul ul li a, ul.sectionlist li a {
  text-decoration: underline;
  text-decoration-thickness: 0.05em;
  text-underline-offset: 0.3em;
  position: relative;
}
nav > ul ul li a.current, ul.sectionlist li a.current {
  padding-left: 1.4rem;
}
nav > ul ul li a.current::before, ul.sectionlist li a.current::before {
  left: 0;
  content: url("/assets/img/arrow.svg");
  width: 1rem;
  height: auto;
  position: absolute;
}
nav > ul ul li a:hover, nav > ul ul li a.current, ul.sectionlist li a:hover, ul.sectionlist li a.current {
  text-decoration-color: #0d0d0d;
  color: #ec4047;
  font-style: italic;
}

main {
  container-type: inline-size;
}

em {
  font-style: italic;
}

strong {
  font-weight: 600;
  letter-spacing: -0.01em;
}

h1, h2, aside blockquote {
  text-wrap: pretty;
}

.sidebar h1 {
  font-family: futura-pt, sans-serif;
  font-weight: 300;
  font-size: 2rem;
  margin-bottom: 0.2em;
}
.sidebar p {
  line-height: 1.4;
  font-size: 0.9rem;
}

h2 {
  font-family: moret, serif;
  font-weight: 300;
  font-size: 2.8rem;
  margin-block: 1.2em 0.6em;
  line-height: 1;
}

.sectioncontent h2 {
  font-size: 10rem;
  margin-block: 0 2.4rem;
  padding-bottom: 2.4rem;
  border-bottom: 1px solid black;
  letter-spacing: -0.03em;
  line-height: 0.92;
}
.sectioncontent .downloadlinks p {
  font-size: 1rem;
  font-family: moret, serif;
}
.sectioncontent .downloadlinks p a {
  font-style: italic;
}

h3 {
  font-family: moret, serif;
  font-size: 2.8rem;
  font-weight: 300;
  margin-block: 4rem 2rem;
}

h4 {
  font-family: futura-pt, sans-serif;
  font-weight: 300;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-block: 2.4em 1.2em;
}

p {
  font-size: 1.4rem;
  line-height: 1.4;
  margin-top: 0.8em;
}
p a {
  text-decoration: underline;
  text-decoration-color: #ec4047;
  text-underline-offset: 0.15em;
}
p a:hover {
  color: #DA4F4E;
}

figcaption {
  margin-top: 1rem;
  font-family: moret, serif;
  font-size: 1rem;
  line-height: 1.4;
}
figcaption a {
  text-decoration: underline;
  text-decoration-color: #ec4047;
  text-underline-offset: 0.15em;
}
figcaption a:hover {
  color: #DA4F4E;
}
figcaption em {
  font-style: italic;
}

.contentpagecontainer .sidebar {
  text-align: right;
}
.contentpagecontainer .sidebar .pagetitle {
  font-family: moret, serif;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 0.8;
  font-size: 1.8rem;
}
.contentpagecontainer .sidebar .pagetitle a {
  opacity: 1;
  transition: opacity 1500ms cubic-bezier(0.215, 0.61, 0.355, 1);
}
.contentpagecontainer .sidebar .pagetitle.off a {
  opacity: 0;
  pointer-events: none;
  transition: opacity 300ms cubic-bezier(0.215, 0.61, 0.355, 1);
}
.contentpagecontainer .sidebar a {
  color: #ec4047;
}
.contentpagecontainer .sidebar a:hover {
  color: #0d0d0d;
}
.contentpagecontainer .sidebar ul li {
  line-height: 1.4;
  font-family: futura-pt, sans-serif;
  font-weight: 300;
}

form {
  font-family: futura-pt, sans-serif;
  font-weight: 400;
  font-size: 0.9rem;
}
form .inputcontainer label {
  font-size: 0.6rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 400;
}
form .inputcontainer label span.labeldetail {
  text-transform: none;
}
form .inputcontainer label:has(+ input:focus) {
  font-weight: 600;
  letter-spacing: 0.015em;
}
form .inputcontainer label:has(+ input:focus) span.labeldetail {
  font-weight: 400;
  letter-spacing: 0.04em;
}
form .modest label {
  font-size: 0.8rem;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 300;
}
form input {
  font-size: 1rem;
}
form .labelflourish {
  font-weight: 700;
}

.spinewidthresults {
  font-family: moret, serif;
  font-size: 3.8rem;
  line-height: 1.2;
}
.spinewidthresults span.selection, .spinewidthresults span.result {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.15em;
  text-decoration-color: #0d0d0d;
}
.spinewidthresults span.selection {
  font-style: italic;
}
.spinewidthresults span.result {
  color: #ec4047;
}

aside blockquote {
  position: relative;
  float: right;
  max-width: 26ch;
  font-family: moret, serif;
  font-size: 2rem;
  padding: 0.2em 0 0.22em 1em;
  margin: 0.4rem 0 0.4rem 2rem;
  border-left: 0.4em solid #DA4F4E;
  line-height: 1.3;
}
aside blockquote::before {
  position: absolute;
  top: 0.35em;
  left: 0.6em;
  content: "“";
}
aside blockquote::after {
  content: "”";
  position: relative;
  left: 0.07em;
}
@container (width < 650px) {
  aside blockquote {
    max-width: 80%;
    padding-right: 1em;
    float: none;
    margin-inline: auto;
    margin-block: 2rem;
  }
}

hr {
  margin: 3.8rem 1rem;
  border: 0;
}
hr::before {
  margin-inline: auto;
  content: "";
  display: block;
  width: 8rem;
  height: 0.1rem;
  background: #DA4F4E;
}
hr.spacer {
  opacity: 0;
  margin: 1.9rem 1rem;
}

.maxwidth {
  display: grid;
  grid-template-columns: [fullwidth-start] minmax(1.2rem, 1fr) [maxwidth-start] min(100% - 2.4rem, 1200px) [maxwidth-end] minmax(1.2rem, 1fr) [fullwidth-end];
}
.maxwidth > * {
  grid-area: maxwidth;
}

.bookcover figure {
  margin-right: 1.4rem;
  margin-bottom: 1rem;
  float: left;
  width: 20rem;
  max-width: 50%;
}
@container (width < 400px) {
  .bookcover figure {
    float: none;
    margin-inline: auto;
  }
}

.bookcover {
  border-radius: 0.2rem;
  overflow: hidden;
  position: relative;
  box-shadow: -42px 32px 50px 0px rgba(0, 0, 0, 0.1), -20px 15px 20px 0px rgba(0, 0, 0, 0.1), -10px 10px 10px 0px rgba(0, 0, 0, 0.05), -60px 60px 60px -5px rgba(0, 0, 0, 0.05), -42px 32px 94px -22px rgba(0, 0, 0, 0.03), -56px 57px 43px -1px rgba(0, 0, 0, 0.08), -30px 28px 20px 0 rgba(0, 0, 0, 0.08), -10px 6px 10px 0 rgba(0, 0, 0, 0.01);
}
.bookcover::after {
  opacity: 0.8;
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgb(255, 255, 255);
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.1) 3%, rgba(255, 255, 255, 0) 7%, rgba(255, 255, 255, 0) 98%, rgba(255, 255, 255, 0.25) 100%);
  mix-blend-mode: screen;
}

a.copy, button.copy {
  grid-area: copy;
}

a.download, button.download {
  grid-area: download;
}

a.copy, button.copy, a.download, button.download {
  padding-inline: 0.1rem;
  opacity: 0.2;
  position: relative;
}
a.copy.copysuccess::after, button.copy.copysuccess::after, a.download.copysuccess::after, button.download.copysuccess::after {
  content: "copied";
  position: absolute;
  left: 1rem;
  background: black;
  color: white;
  font-size: 0.7rem;
  padding: 0.1em 0.2em;
  animation: moveAndFade 1s forwards;
}
@keyframes moveAndFade {
  0% {
    top: 0;
    opacity: 1;
  }
  100% {
    top: -0.4rem;
    opacity: 0;
  }
}
a.copy:hover, a.copy.copysuccess, button.copy:hover, button.copy.copysuccess, a.download:hover, a.download.copysuccess, button.download:hover, button.download.copysuccess {
  opacity: 1;
  fill: #DA4F4E;
}
a.copy svg, button.copy svg, a.download svg, button.download svg {
  display: inline-block;
  height: 0.74em;
  width: auto;
}
a.copy.big, button.copy.big, a.download.big, button.download.big {
  opacity: 1;
  background: rgba(255, 255, 255, 0.7);
  padding: 0.5rem 1rem;
  text-transform: uppercase;
  border: 1px dotted rgba(0, 0, 0, 0.4);
}
a.copy.big svg, button.copy.big svg, a.download.big svg, button.download.big svg {
  height: 0.9em;
}
a.copy.big:hover, button.copy.big:hover, a.download.big:hover, button.download.big:hover {
  background: rgb(255, 255, 255);
  color: black;
  border: 1px solid black;
}
a.copy.big.copysuccess, button.copy.big.copysuccess, a.download.big.copysuccess, button.download.big.copysuccess {
  color: #ec4047;
  border: 1px solid black;
}
a.copy.big.copysuccess::after, button.copy.big.copysuccess::after, a.download.big.copysuccess::after, button.download.big.copysuccess::after {
  transform: translate(2.2rem, -0.55rem);
}

.downloads {
  --topgap: 0.5rem;
  position: relative;
  padding-left: 3rem;
  padding-top: var(--topgap);
  width: max-content;
  margin-top: 2rem;
  border-top: 0.1em solid #DA4F4E;
  color: #DA4F4E;
}
.downloads p {
  margin: 0;
  padding: 0;
  padding-top: 0.1rem;
  font-family: moret, serif;
  font-weight: 300;
  font-size: 1rem;
}
.downloads p a {
  margin-inline: 0.2em;
  color: #0d0d0d;
}
.downloads p a:hover {
  color: #DA4F4E;
}
.downloads::before {
  position: absolute;
  left: 0;
  top: var(--topgap);
  font-family: remixicon;
  font-size: 1.2rem;
  content: "\ec59";
  background: #ec4047;
  color: white;
  padding: 0.2em;
}

header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: white;
}
header nav {
  border-bottom: 1px solid black;
  position: relative;
  padding-inline: 1.2rem;
  display: flex;
}
header nav a.home {
  margin-inline-end: auto;
}
header nav ul {
  display: flex;
  align-items: center;
}
header nav ul li:not(:last-of-type) {
  margin-inline-end: 2rem;
}
header nav ul > a:hover, header nav ul > a:focus, header nav ul > a.current {
  text-decoration: underline;
  text-decoration-color: #ec4047;
  text-underline-offset: 0.6em;
  text-decoration-thickness: 0.28em;
}
header nav ul li ul {
  display: none;
  position: absolute;
  background: white;
  color: #0d0d0d;
  top: 100%;
  right: 0%;
  width: 100%;
  justify-content: end;
  padding-inline: 1.2rem;
  border-bottom: 1px solid black;
  border-top: 1px solid black;
  text-align: right;
}
header nav ul li:hover ul, header nav ul li.open ul {
  display: flex;
}

body:has(.sidebar) header nav ul li ul {
  width: calc(100% - 18rem);
}

a.home > img {
  height: 2.4rem;
  margin-block: 0.6rem;
}

.contentpagecontainer {
  margin-top: 2.4rem;
  display: grid;
  grid-template-columns: 15rem 2.4rem 1fr;
  grid-template-areas: "sidebar . main";
  padding-inline: 1.2rem;
}
.contentpagecontainer .sidebar {
  grid-area: sidebar;
  align-self: start;
  position: sticky;
  top: 7rem;
  margin-top: 0.4em;
}
.contentpagecontainer .sidebar ul li {
  border-right: 0.05rem solid #0d0d0d;
  padding-right: 1.2rem;
}
.contentpagecontainer .sidebar ul li:not(:last-of-type) {
  padding-bottom: 1.4rem;
}
.contentpagecontainer .sidebar ul li.pagetitle {
  padding-bottom: 2rem;
}
.contentpagecontainer main {
  grid-area: main;
  padding-bottom: 4rem;
}

body.interactive, body:has(.sidebar) {
  display: grid;
  grid-template-rows: auto 1fr;
  min-height: 100dvh;
}
body.interactive main, body:has(.sidebar) main {
  min-height: 100%;
  display: grid;
  grid-template-columns: 18rem minmax(0, 1fr);
}

.sidebar {
  background: white;
  border-right: 1px solid black;
  display: grid;
  grid-template-columns: [full-start] 1.2rem [content-start half-column-one-start third-column-one-start uneven-large-one-start] 1fr 0.6rem 1fr [third-column-one-end] 0.6rem [third-column-two-start uneven-large-two-start] 1fr [half-column-one-end] 0.6rem [half-column-two-start] 1fr [third-column-two-end uneven-large-one-end] 0.6rem [third-column-three-start] 1fr 0.6rem 1fr [third-column-three-end uneven-large-two-end half-column-two-end content-end] 1.2rem [full-end];
  align-content: start;
}
.sidebar .details {
  grid-column: full;
  padding-block: 3.6rem;
  border-bottom: 1px solid black;
  display: grid;
  grid-template-columns: subgrid;
}
.sidebar .details > * {
  grid-column: content;
}
.sidebar form, .sidebar .controls {
  display: grid;
  grid-template-columns: subgrid;
  padding-block: 2.4rem 4.8rem;
  grid-column: full;
}
.sidebar form.single-button-form, .sidebar .controls.single-button-form {
  padding-block: 0;
}

.editorcontrols form.sidebar-search {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 18rem;
  grid-template-columns: [full-start] 1.2rem [content-start half-column-one-start third-column-one-start uneven-large-one-start] 1fr 0.6rem 1fr [third-column-one-end] 0.6rem [third-column-two-start uneven-large-two-start] 1fr [half-column-one-end] 0.6rem [half-column-two-start] 1fr [third-column-two-end uneven-large-one-end] 0.6rem [third-column-three-start] 1fr 0.6rem 1fr [third-column-three-end uneven-large-two-end half-column-two-end content-end] 1.2rem [full-end];
  padding-block: 1.2rem;
  z-index: 100;
  background: white;
  border-right: 1px solid black;
  border-top: 1px solid black;
}
.editorcontrols form.sidebar-search div.formfield {
  margin-block: 0;
}
.editorcontrols .formfield-group {
  display: grid;
  grid-template-columns: subgrid;
  padding-block: 0.6rem;
  grid-column: full;
}
.editorcontrols .formfield {
  margin-block: 0.3rem 0.5rem;
  grid-column: content;
  display: grid;
  grid-template-columns: subgrid;
  row-gap: 0.6rem;
}
.editorcontrols .formfield:has(.visually-hidden) {
  margin-block: 0.5rem;
}
.editorcontrols .formfield p.label {
  margin-top: 1rem;
  font-size: 1rem;
  font-weight: 300;
}
.editorcontrols .formfield .copyable-header {
  margin-top: 1rem;
  font-size: 1rem;
}
.editorcontrols .formfield p.alt-text {
  background: #f6f6f6;
  padding: 0.6rem;
  margin-top: 0;
}
.editorcontrols .formfield p.fielderror {
  color: #ec4047;
  font-size: 0.65rem;
  margin: 0;
}
.editorcontrols .formfield label {
  display: block;
}
.editorcontrols .formfield input, .editorcontrols .formfield select, .editorcontrols .formfield button {
  width: 100%;
  padding: 0.2rem 0.4rem;
  height: 2rem;
  outline: none;
  border: 1px solid black;
}
.editorcontrols .formfield button {
  background: white;
  font-size: small;
}
.editorcontrols .formfield button:disabled {
  opacity: 0.4;
  cursor: default;
}
.editorcontrols .formfield .modest {
  display: flex;
  align-items: center;
  justify-self: start;
}
.editorcontrols .formfield .modest input, .editorcontrols .formfield .modest select {
  width: auto;
}
.editorcontrols .formfield select {
  background: transparent;
}
.editorcontrols .formfield label:has(input[type=checkbox]:disabled), .editorcontrols .formfield select:disabled, .editorcontrols .formfield.modest:has(input[type=checkbox]:disabled) label {
  cursor: default;
  opacity: 0.1;
}
.editorcontrols .formfield label:has(input[type=checkbox]:disabled) .pretendcheckbox, .editorcontrols .formfield select:disabled .pretendcheckbox, .editorcontrols .formfield.modest:has(input[type=checkbox]:disabled) label .pretendcheckbox {
  background: #ccc;
}
.editorcontrols .formfield.modest:has(input[type=checkbox]:not(:checked)) .pretendcheckbox {
  border: 1px dotted rgba(0, 0, 0, 0.4);
}
.editorcontrols .formfield .inputcontainer label:not(.fileuploadtrigger) {
  border-bottom: none;
  color: black;
  width: fit-content;
  padding: 0.2rem 0;
}
.editorcontrols .formfield .inputcontainer:has(input.quiet:not(:focus)) {
  opacity: 0.4;
}
.editorcontrols .formfield .inputcontainer input.quiet:not(:focus) {
  border: 1px dotted rgba(0, 0, 0, 0.4);
}
.editorcontrols .formfield .inputcontainer p.helper {
  font-size: 0.65rem;
  color: rgba(0, 0, 0, 0.5);
  margin: 0.15rem 0 0;
  line-height: 1.3;
}
.editorcontrols .formfield.full > * {
  grid-column: content;
}
.editorcontrols .formfield.rowhalf :nth-child(odd) {
  grid-column: half-column-one;
}
.editorcontrols .formfield.rowhalf :nth-child(even) {
  grid-column: half-column-two;
}
.editorcontrols .formfield.rowquarter {
  grid-template-columns: repeat(4, 1fr);
  gap: 0.6rem;
}
.editorcontrols .formfield.rowthird :nth-child(3n-2) {
  grid-column: third-column-one;
}
.editorcontrols .formfield.rowthird :nth-child(3n-1) {
  grid-column: third-column-two;
}
.editorcontrols .formfield.rowthird :nth-child(3n) {
  grid-column: third-column-three;
}
.editorcontrols .formfield.uneven .larger:nth-child(odd) {
  grid-column: uneven-large-one;
}
.editorcontrols .formfield.uneven .larger:nth-child(even) {
  grid-column: uneven-large-two;
}
.editorcontrols .formfield.uneven > *:not(.larger):nth-child(odd) {
  grid-column: third-column-one;
}
.editorcontrols .formfield.uneven > *:not(.larger):nth-child(even) {
  grid-column: third-column-three;
}
.editorcontrols .formfield.radiobox.iconvisual label, .editorcontrols .formfield.checkbox.iconvisual label {
  border: 1px dotted rgba(0, 0, 0, 0.4);
  min-height: 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.4rem;
  cursor: pointer;
  opacity: 0.4;
}
.editorcontrols .formfield.radiobox.iconvisual label:has(input:checked:not(:disabled)), .editorcontrols .formfield.checkbox.iconvisual label:has(input:checked:not(:disabled)) {
  border: 1px solid black;
  fill: black;
  opacity: 1;
}
.editorcontrols .formfield.radiobox.iconvisual label svg, .editorcontrols .formfield.checkbox.iconvisual label svg {
  width: 23%;
  place-self: center;
}
.editorcontrols .formfield.modest label {
  display: flex;
  align-items: center;
  cursor: pointer;
  gap: 0.4rem;
}
.editorcontrols .formfield.modest label .pretendcheckbox {
  position: relative;
  left: 0;
  top: 0;
  border: 1px solid black;
  border-radius: 0;
  width: 1.2rem;
  height: 1.2rem;
  overflow: hidden;
}
.editorcontrols .formfield.modest:has(input[type=checkbox]:checked) label .pretendcheckbox::before, .editorcontrols .formfield.modest:has(input[type=checkbox]:checked) label .pretendcheckbox::after {
  content: "";
  width: 200%;
  height: 1px;
  background: black;
  position: absolute;
  left: 0;
}
.editorcontrols .formfield.modest:has(input[type=checkbox]:checked) label .pretendcheckbox::before {
  top: -1px;
  transform-origin: top left;
  transform: rotate(45deg);
}
.editorcontrols .formfield.modest:has(input[type=checkbox]:checked) label .pretendcheckbox::after {
  bottom: -1px;
  transform-origin: bottom left;
  transform: rotate(-45deg);
}
.editorcontrols .formfield.countries {
  font-size: 1.4rem;
}

.editorresults, .signatureresults {
  background: #f6f6f6;
  --minimumcolumnsize: 24rem;
  padding: 3.6rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(var(--minimumcolumnsize), 100%), 1fr));
  gap: 1.2rem;
  align-content: start;
}
.editorresults .contents, .signatureresults .contents {
  display: grid;
  grid-template-columns: auto min(1fr, fit-content);
  gap: 0.2rem;
  grid-template-areas: "content copy";
  justify-content: start;
}
.editorresults .row, .signatureresults .row {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  grid-column: 1/-1;
  gap: 1.2rem;
}
.editorresults .section, .signatureresults .section {
  display: grid;
  grid-template-columns: subgrid;
}
.editorresults .linkresultholder, .signatureresults .linkresultholder {
  display: flex;
  flex-direction: column;
  background: white;
  padding: 0.6rem 1.2rem;
  gap: 0.6rem;
}
.editorresults .linkresultholder.linkresultoff, .signatureresults .linkresultholder.linkresultoff {
  display: none;
}
.editorresults .linkresultholder.linkresulton, .signatureresults .linkresultholder.linkresulton {
  display: flex;
}
.editorresults .linkresultholder:has(a.copy), .signatureresults .linkresultholder:has(a.copy) {
  padding-right: 0.8rem;
}
.editorresults .linkresultholder .linkresultname, .signatureresults .linkresultholder .linkresultname {
  font-family: moret, serif;
  font-weight: 400;
  color: #ec4047;
}
.editorresults .linkresultholder .linkresultdetail, .signatureresults .linkresultholder .linkresultdetail {
  min-height: 1rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.editorresults .linkresultholder.invalid, .signatureresults .linkresultholder.invalid {
  opacity: 0.6;
  filter: blur(1px);
}
.editorresults .linkhover a:hover, .signatureresults .linkhover a:hover {
  text-decoration: underline;
  text-decoration-color: #DA4F4E;
}
.editorresults .qrcode-output svg, .signatureresults .qrcode-output svg {
  display: block;
  max-width: 100%;
  height: auto;
}
.editorresults .generated-url, .signatureresults .generated-url {
  font-size: 0.7rem;
  word-break: break-all;
  color: rgba(0, 0, 0, 0.6);
  margin-top: 0.6rem;
}

input[type=color] {
  margin-bottom: 4px;
}

.editorcontrols .formfield input[type=range] {
  height: auto;
  border: none;
  padding: 0;
}

.editorcontrols .formfield.shadow-direction label,
.editorcontrols .formfield.logo-position label {
  min-height: unset;
  padding: 0.3rem;
}
.editorcontrols .formfield.shadow-direction label svg,
.editorcontrols .formfield.logo-position label svg {
  width: 1rem;
  height: 1rem;
  display: block;
}

.editorcontrols .formfield.pasteup-modes {
  display: flex;
  gap: 0.3rem;
}
.editorcontrols .formfield.pasteup-modes .pasteup-mode {
  flex: 1;
  width: auto;
  border: 1px dotted rgba(0, 0, 0, 0.4);
  background: white;
  cursor: pointer;
  font-size: 0.6rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.editorcontrols .formfield.pasteup-modes .pasteup-mode:hover {
  border: 1px solid black;
}
.editorcontrols .formfield.pasteup-modes .pasteup-mode.is-active {
  border: 1px solid black;
  background: black;
  color: white;
}

.pasteup-swatches {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0.3rem;
}

.pasteup-swatch {
  aspect-ratio: 1;
  width: 100%;
  border: 2px solid transparent;
  cursor: pointer;
  outline: none;
  padding: 0;
}
.pasteup-swatch:hover {
  border-color: rgba(0, 0, 0, 0.35);
}
.pasteup-swatch.is-active {
  border-color: rgba(0, 0, 0, 0.6);
}

.fileuploadtrigger {
  cursor: pointer;
  display: block;
  width: 100%;
  padding: 0.2rem 0.4rem;
  height: 2rem;
  border: 1px dotted rgba(0, 0, 0, 0.4);
  background: white;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.8rem;
  line-height: 1.6rem;
}
.fileuploadtrigger:hover {
  border: 1px solid black;
}

.editorcontrols .formfield.formats label {
  font-size: 0.6rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0.3rem 0.5rem;
}

.ratio-shape {
  display: inline-block;
  border: 1px solid currentColor;
  flex-shrink: 0;
}

.paste-up-wrap {
  grid-column: 1/-1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100%;
  width: 100%;
  position: sticky;
  top: 6rem;
}

.paste-up-dropzone {
  text-align: center;
  font-family: moret, serif;
  font-size: 1.8rem;
  line-height: 1.4;
  background: white;
  padding: 80px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.2rem;
  border: 2px dashed rgba(0, 0, 0, 0.6);
  width: 12em;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.paste-up-dropzone.is-dragover {
  border-color: rgba(0, 0, 0, 0.8);
  background: rgb(240.9, 240.9, 240.9);
}

.paste-up-canvas-wrap {
  display: flex;
  align-items: flex-start;
  gap: 1.2rem;
  width: 100%;
  overflow: hidden;
}
.paste-up-canvas-wrap canvas {
  min-width: 0;
  max-width: 100%;
  max-height: calc(100vh - 8rem);
  height: auto;
  display: block;
}

.emailfooters {
  background: #f6f6f6;
  padding: 3.6rem 2.4rem;
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}

.emailfootercontainer {
  background: none;
  display: grid;
  grid-template-columns: auto 1fr;
  place-items: start;
  grid-template-areas: "copy emailfooter";
  gap: 0.6rem;
}
.emailfootercontainer .emailfooter {
  background: none;
}

.qr-code-container {
  background: none;
  display: grid;
  grid-template-columns: auto 1fr;
  place-items: start;
  grid-template-areas: "qr-code download";
  gap: 0.6rem;
}

.qrcode-output {
  grid-area: qr-code;
}
.qrcode-output svg {
  width: 500px;
  height: auto;
}

body.home {
  min-height: 100dvh;
  display: grid;
  grid-template-rows: auto 1fr;
  grid-template-areas: "header" "content";
}

main.home img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

main.photo-gallery-parent .sidebar .sidebar-content {
  display: grid;
  grid-template-columns: subgrid;
  grid-area: full;
  padding-block: 3.6rem 4.8rem;
}
main.photo-gallery-parent .sidebar .sidebar-content > * {
  grid-column: content;
}

.sidebar select.size-select {
  font-size: 1rem;
  border: 1px solid black;
  padding: 0.4rem;
  background: white;
  width: 100%;
  cursor: pointer;
  font-family: inherit;
}
.sidebar a.download-button, .sidebar button.download-button {
  font-size: 1rem;
  border: 1px solid black;
  padding: 0.4rem 0.4rem 0.4rem 2.6rem;
  align-items: center;
  position: relative;
  text-align: left;
  cursor: pointer;
}
.sidebar a.download-button::before, .sidebar button.download-button::before {
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  content: url("/assets/icons/download.svg");
  width: 1rem;
  height: auto;
  position: absolute;
}
.sidebar a.download-button.crop-4x5::before, .sidebar button.download-button.crop-4x5::before {
  border: 1px solid #DA4F4E;
  content: "";
  width: 12px;
  height: 15px;
}
.sidebar a.download-button.crop-9x16::before, .sidebar button.download-button.crop-9x16::before {
  border: 1px solid #DA4F4E;
  content: "";
  left: 13.5px;
  width: 9px;
  height: 16px;
}
.sidebar a.download-button.crop-16x9::before, .sidebar button.download-button.crop-16x9::before {
  border: 1px solid #DA4F4E;
  content: "";
  left: 10px;
  width: 16px;
  height: 9px;
}
.sidebar a.download-button.crop-sq::before, .sidebar button.download-button.crop-sq::before {
  border: 1px solid #DA4F4E;
  content: "";
  width: 12px;
  height: 12px;
}
.sidebar a.download-button:hover, .sidebar button.download-button:hover {
  color: #ec4047;
}
.sidebar a.download-button .icon, .sidebar button.download-button .icon {
  grid-column: 1/2;
}
.sidebar a.download-button .icon svg, .sidebar button.download-button .icon svg {
  max-height: 1.3rem;
}
.sidebar a.download-button .text, .sidebar button.download-button .text {
  grid-column: 3/-1;
}
.sidebar a.download-button .text .download-group, .sidebar button.download-button .text .download-group {
  display: grid;
  grid-template-columns: subgrid;
  grid-column: full;
}

a.clear-filters {
  border: 1px solid black;
  padding: 0.2rem 0.4rem;
  margin-bottom: 2rem;
  display: block;
  width: fit-content;
  font-size: 0.8rem;
  opacity: 0.8;
}
a.clear-filters.disabled {
  opacity: 0.3;
}
a.clear-filters span {
  color: #ec4047;
}
a.clear-filters:not(.disabled):hover {
  background: #ec4047;
  color: white;
  border: 1px solid #ec4047;
  opacity: 1;
}
a.clear-filters:not(.disabled):hover span {
  color: white;
}

a.go-back {
  padding: 0.2rem 0.4rem;
  margin-bottom: 2rem;
  display: block;
  width: fit-content;
  font-size: 0.8rem;
  opacity: 0.8;
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
a.go-back span {
  color: #ec4047;
  font-size: 1.4em;
  line-height: 0.1;
}

ul.authors-list {
  margin-top: 2rem;
  grid-area: content;
}
ul.authors-list li {
  margin-block: 0.6rem;
  position: relative;
  margin-left: 1.2rem;
  line-height: 1.2;
  text-wrap: balance;
}
ul.authors-list li::before {
  content: "–";
  color: #ec4047;
  margin-right: 0.8rem;
  position: absolute;
  left: -1.2rem;
  top: 0rem;
  line-height: 1.2;
}
ul.authors-list li.selected {
  font-weight: 700;
}
ul.authors-list li.selected a:hover {
  text-decoration: none;
  color: #ec4047;
}
ul.authors-list li.selected::before {
  content: "x";
  font-weight: 400;
}
ul.authors-list li a {
  text-decoration: none;
}
ul.authors-list li a:hover {
  text-decoration: underline;
  text-decoration-color: #DA4F4E;
}

.photo-gallery-container {
  padding: 1.2rem;
  background: #f6f6f6;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr));
  gap: 1rem;
  align-items: start;
  align-content: start;
}
.photo-gallery-container .pagination {
  grid-column: 1/-1;
  display: flex;
  align-items: center;
  justify-self: start;
  font-size: 0.8rem;
  margin-top: 1.2rem;
  padding-block: 1.2rem;
  border-top: 1px solid black;
}
.photo-gallery-container .pagination a.next-prev:hover {
  text-decoration: underline;
}
.photo-gallery-container .pagination a.next-prev:not([href]) {
  opacity: 0.3;
  pointer-events: none;
}
.photo-gallery-container .pagination a.next-prev:not([href]):hover {
  text-decoration: none;
}
.photo-gallery-container .pagination ul {
  display: flex;
  align-items: center;
  font-family: futura-pt, sans-serif;
  font-weight: 400;
  margin-inline: 1.2rem;
}
.photo-gallery-container .pagination ul li:hover {
  text-decoration: none;
}
.photo-gallery-container .pagination ul li a {
  padding: 0.2rem;
  margin-inline: 0.4em;
}
.photo-gallery-container .pagination ul li a[aria-current=page] {
  font-family: futura-pt-bold, sans-serif;
  font-weight: 700;
}
.photo-gallery-container .pagination ul li a:hover {
  color: #ec4047;
}

.photo-gallery-preview, .photo-preview {
  background: white;
  padding: 1rem;
  position: relative;
  z-index: 10;
}
.photo-gallery-preview button, .photo-preview button {
  border: none;
  outline: none;
  background: none;
  padding: 0;
}
.photo-gallery-preview a.photo-count, .photo-preview a.photo-count {
  padding: 0.5rem;
}
.photo-gallery-preview .photo-count, .photo-preview .photo-count {
  --overlay-inset: 1.4rem;
  position: absolute;
  top: var(--overlay-inset);
  background: white;
  font-size: 0.8rem;
  opacity: 0.5;
  z-index: 20;
  left: var(--overlay-inset);
  gap: 0.2rem;
  align-items: start;
  display: none;
}
.photo-gallery-preview .photo-count button, .photo-preview .photo-count button {
  display: flex;
  gap: 0.2rem;
  padding: 0.5rem;
  cursor: pointer;
}
.photo-gallery-preview .photo-count svg, .photo-preview .photo-count svg {
  padding-top: 0.08rem;
  height: 0.7rem;
}
.photo-gallery-preview:hover .photo-count, .photo-preview:hover .photo-count {
  display: flex;
}
.photo-gallery-preview:hover .photo-count:hover, .photo-preview:hover .photo-count:hover {
  opacity: 1;
}
.photo-gallery-preview:hover .details .edition-badge, .photo-preview:hover .details .edition-badge {
  opacity: 1;
}
.photo-gallery-preview .details, .photo-preview .details {
  font-size: 1rem;
}
.photo-gallery-preview .gallery-image-details, .photo-preview .gallery-image-details {
  font-size: 0.8rem;
}
.photo-gallery-preview .details, .photo-gallery-preview .gallery-image-details, .photo-preview .details, .photo-preview .gallery-image-details {
  margin-block: 1rem 0.4rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.photo-gallery-preview .details .edition-badge, .photo-gallery-preview .gallery-image-details .edition-badge, .photo-preview .details .edition-badge, .photo-preview .gallery-image-details .edition-badge {
  opacity: 0.4;
  align-self: start;
  font-family: futura-pt, sans-serif;
  text-transform: uppercase;
  font-size: 0.5rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1;
  padding: 0.35em 0.45em;
  margin-bottom: 0.4rem;
  border: 1px solid black;
}
.photo-gallery-preview .details .title a:hover, .photo-gallery-preview .gallery-image-details .title a:hover, .photo-preview .details .title a:hover, .photo-preview .gallery-image-details .title a:hover {
  text-decoration: underline;
  text-decoration-color: #ec4047;
  text-underline-offset: 0.2em;
}
.photo-gallery-preview .details .author, .photo-gallery-preview .gallery-image-details .author, .photo-preview .details .author, .photo-preview .gallery-image-details .author {
  letter-spacing: 0.01em;
}
.photo-gallery-preview .gallery-image-details, .photo-preview .gallery-image-details {
  flex-direction: row;
  justify-content: space-between;
  align-items: end;
}
.photo-gallery-preview .gallery-image-details a.details-main-link, .photo-preview .gallery-image-details a.details-main-link {
  text-decoration: underline;
  text-decoration-color: #ec4047;
  text-underline-offset: 0.2em;
}
.photo-gallery-preview .gallery-image-details a.details-main-link:hover, .photo-preview .gallery-image-details a.details-main-link:hover {
  text-decoration: none;
}
.photo-gallery-preview .gallery-image-details a.details-secondary-link, .photo-preview .gallery-image-details a.details-secondary-link {
  font-style: italic;
}
.photo-gallery-preview .gallery-image-details a.details-secondary-link:hover, .photo-preview .gallery-image-details a.details-secondary-link:hover {
  color: #ec4047;
}

.gallery-image {
  background: #f6f6f6;
}
.gallery-image .photo-container {
  max-width: 100%;
  max-height: calc(100vh - 2.4rem - 20px);
}
.gallery-image .photo-container img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  object-position: top left;
}

.photo-gallery, .gallery-image {
  background: #f6f6f6;
}
.photo-gallery .photos-container, .gallery-image .photos-container {
  padding: 1.2rem;
  columns: 3;
  gap: 1rem;
}
@container (max-width: 1100px) {
  .photo-gallery .photos-container, .gallery-image .photos-container {
    columns: 2;
  }
}
@container (max-width: 850px) {
  .photo-gallery .photos-container, .gallery-image .photos-container {
    columns: 1;
  }
}
.photo-gallery .photos-container .photo-preview, .gallery-image .photos-container .photo-preview {
  margin-bottom: 1rem;
  break-inside: avoid;
}

.sidebar .gallery-details .edition-badge, .sidebar .details .edition-badge {
  width: fit-content;
  font-family: futura-pt, sans-serif;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 0.65rem;
  letter-spacing: 0.06em;
  line-height: 1;
  padding: 0.4em 0.5em;
  margin-bottom: 1.2rem;
  border: 1px solid black;
  opacity: 0.6;
}
.sidebar .gallery-details .author, .sidebar .details .author {
  font-family: moret, serif;
  font-weight: 400;
  font-size: 1rem;
  margin-top: 0.6rem;
  text-wrap: balance;
}

ul.sectionlist {
  grid-column: full;
  padding: 2.4rem 1.2rem;
}
ul.sectionlist li {
  margin-bottom: 1rem;
}

.sectioncontent {
  background: #f6f6f6;
  padding: 2.4rem 3.6rem;
}
.sectioncontent p {
  max-width: 48rem;
}
.sectioncontent figure {
  max-width: 54rem;
  margin-block: 1.2rem;
}
.sectioncontent .downloadlinks {
  margin-top: 1.6rem;
}
.sectioncontent .downloadlinks p {
  padding: 0.6rem 2.4rem;
  border-bottom: 1px solid black;
  max-width: 32rem;
  margin-block: 0.6rem;
  position: relative;
}
.sectioncontent .downloadlinks p::before {
  left: 0.4rem;
  top: 0.7rem;
  content: url("/assets/icons/download.svg");
  width: 1rem;
  height: auto;
  position: absolute;
}

.definitioncontainer {
  margin-block: 2rem 1rem;
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 1.2rem;
  max-width: 48rem;
}
.definitioncontainer ~ .definitioncontainer {
  margin-block: 1rem;
}
.definitioncontainer h3 {
  letter-spacing: 0.06em;
  font-size: 1rem;
  line-height: 1.4;
  margin: 0.42rem 0 0 0;
  text-align: right;
  text-transform: uppercase;
}
.definitioncontainer .definitioncontent p:first-of-type {
  margin-top: 0;
}

.signatureresults {
  background: transparent;
  padding: 3.6rem 2.4rem;
  display: grid;
  grid-template-columns: auto 1fr;
  place-items: start;
  grid-template-areas: "copy emailfooter";
  gap: 2.4rem;
}
.signatureresults .signature {
  all: initial;
}
.signatureresults .signature, .signatureresults .copy {
  position: sticky;
  top: 7rem;
}

/*# sourceMappingURL=styles.css.map */