@charset "UTF-8";
html, body, h1, h2, h3, h4, h5, h6, p, hr, abbr, address, b, blockquote, cite,
em, i, pre, q, small, strong, sub, sup, template, time, u, form, input, textarea,
button, select, optgroup, option, label, fieldset, legend, datalist, output,
iframe, img, map, area, canvas, figcaption, figure, picture, svg, audio, source,
track, video, a, nav, ul, ol, li, dl, dt, dd, table, caption, th, tr, td, thead,
tbody, tfoot, col, colgroup, div, span, header, footer, main, section, article,
aside, details, dialog, summary, data, object, embed {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
:root {
  --small-header-mq: 32rem;
  --safe-area-inline: 20px;
  --bleed-safe-area-inline: 10px;
  --icon--linkedin--font-family: 'Font Awesome 7 Brands';
  --icon--linkedin--content: '';
  --icon--drupal--font-family: 'Font Awesome 7 Brands';
  --icon--drupal--content: '';
  --icon--github--font-family: 'Font Awesome 7 Brands';
  --icon--github--content: '';
  --icon--facebook--font-family: 'Font Awesome 7 Brands';
  --icon--facebook--content: '';
  --icon--twitter--font-family: 'Font Awesome 7 Brands';
  --icon--twitter--content: '';
  --icon--x--font-family: 'Font Awesome 7 Brands';
  --icon--x--content: '';
}
@media (width > 48rem) {
  :root {
    --safe-area-inline: clamp(20px, 5vw, 80px);
    --bleed-safe-area-inline: clamp(10px, 5vw, 20px);
  }
}

body {
  padding-inline: var(--safe-area-inline);
  color: var(--color);
  font-family: var(--font-family);
  font-weight: var(--font-weight);
  font-size: 1rem;
  line-height: 1.2;
  width: 100%;
}

a:focus-visible, button:focus-visible,
[role=button]:focus-visible,
input[type=submit]:focus-visible, details summary:focus-visible {
  outline: var(--focus-visible--outline-width, 4px) var(--focus-visible--outline-style, dashed) var(--focus-visible--outline-color, currentColor);
  outline-offset: var(--focus-visible--outline-offset, 4px);
  transition: all 200ms ease-in-out;
}

details summary {
  align-items: var(--summary--align-items, center);
  background-color: var(--summary--bg-color, transparent);
  color: var(--summary--color);
  cursor: var(--summary--cursor, pointer);
  display: var(--summary--display, inline-flex);
  font-family: var(--summary--font-family);
  font-weight: var(--summary--font-weight);
  font-style: var(--summary--font-style);
  font-size: var(--summary--font-size);
  line-height: var(--summary--line-height);
  margin: var(--summary--margin, 0);
  padding: var(--summary--padding, 0);
  pointer-events: var(--summary--pointer-events, all);
  position: relative;
  text-transform: var(--summary--text-transform);
  transition: var(--summary--transition, all 200ms ease-in-out);
}
details summary::-webkit-details-marker, details summary::marker {
  content: "";
  display: none;
}
details summary:hover, details summary:focus {
  color: var(--summary--color--active, var(--summary--color));
}
details[open] summary {
  margin: var(--summary--margin--open, var(--summary--margin));
  color: var(--summary--color--open, var(--summary--color));
}

p a {
  display: var(--animate-underline--display, inline);
  line-height: 1;
  background-image: linear-gradient(0deg, var(--animate-underline--underline-color, currentColor) 0%, var(--animate-underline--underline-color, currentColor) 100%);
  background-size: var(--animate-underline--bg-size--width, 0%) var(--animate-underline--bg-size--thickness, 1px);
  background-repeat: no-repeat;
  background-position-y: var(--animate-underline--bg-position-y, 1.1em);
  background-position-x: var(--animate-underline--bg-position-x, right);
  transition: all 200ms ease-in-out;
}
p a:hover, p a:focus-visible {
  --animate-underline--bg-size--width: var(--animate-underline--bg-size--width--active);
}

p a {
  --animate-underline--bg-size--width: 100%;
  --animate-underline--bg-size--width--active: 0%;
}

h1, h2, h3, h4 {
  font-size: var(--heading--font-size);
  color: var(--heading--color, var(--body--color, inherit));
  line-height: var(--heading--line-height, 1.1);
  font-weight: var(--heading--font-weight);
  text-transform: var(--heading--text-transform);
  transition: var(--heading--transition, all 200ms ease-in-out);
  margin-top: var(--heading--margin-top);
  margin-bottom: var(--heading--margin-bottom);
}

h1 {
  --heading--font-size: var(--h1--font-size, clamp(2.44140625rem, 1.9836425781rem + 2.5431315104vw, 3.8146972656rem));
  --heading--font-weight: var(--h1--font-weight);
}

h2 {
  --heading--font-size: var(--h2--font-size, clamp(1.5625rem, 1.26953125rem + 1.6276041667vw, 2.44140625rem));
  --heading--font-weight: var(--h2--font-weight);
}

h3 {
  --heading--font-size: var(--h3--font-size, clamp(1.25rem, 1.015625rem + 1.3020833333vw, 1.953125rem));
  --heading--font-weight: var(--h3--font-weight);
}

h4 {
  --heading--font-size: var(--h4--font-size, clamp(1rem, 0.8125rem + 1.0416666667vw, 1.5625rem));
  --heading--font-weight: var(--h4--font-weight);
}

p {
  color: var(--color, inherit);
  display: var(--p--display, block);
  font-size: var(--p--font-size);
  font-style: var(--p--font-style);
  line-height: var(--p--line-height, 1.6);
  margin: var(--p--margin, 0 0 1em 0);
  padding: var(--p--padding, 0);
  max-width: var(--p--max-width, 80ch);
}
p:last-of-type {
  margin-bottom: 0;
}
p:has(code) {
  --p--max-width: none;
}
blockquote {
  margin: var(--blockquote--margin, 0);
  padding: var(--blockquote--padding, 0);
  position: relative;
  text-indent: 4ch;
  quotes: "“" "”" "'" "'";
}
blockquote p {
  --p--font-size: var(--blockquote--font-size, 1.5625rem);
}
blockquote p::before {
  content: open-quote;
}
blockquote p::after {
  content: close-quote;
}

form label:has(+ input, + div) {
  font-size: 1.25rem;
  font-weight: var(--label--font-weight);
}

form legend {
  font-size: 0.8rem;
  font-weight: var(--small-copy--font-weight);
}

figure figcaption {
  --p--font-family: var(--caption--font-family, inherit);
  --p--font-size: var(--caption--font-size, 1rem);
  --p--margin: var(--caption--margin, 0.5em 0 0 0);
  --p--padding: var(--caption--padding);
}

figure {
  display: var(--figure--display, block);
  height: var(--figure--height, auto);
  width: var(--figure--width, auto);
  position: var(--figure--position, relative);
}
figure:has(figcaption) {
  --figure--display: table;
  --figure--width: 100%;
}
figure figcaption {
  display: var(--figcaption--display, table-caption);
  caption-side: var(--figcaption--caption-side, bottom);
  line-height: var(--figcaption--line-height);
}

hr {
  border: var(--hr--border-width, 1px) var(--hr--border-style, solid) var(--hr--border-color, threedface);
  margin: var(--hr--margin, 0.5em 0);
  transform: scaleY(0.5);
}

html {
  font-size: max(125%, 20 / 1440 * 100vw);
  scroll-behavior: smooth;
  background-color: var(--bg-color);
}
html[style*=padding-right] {
  padding-right: 0 !important;
}

strong {
  font-weight: var(--strong--font-weight);
}

svg {
  display: var(--svg--display, block);
  height: var(--svg--height);
  margin: var(--svg--margin);
  max-width: var(--svg--max-width);
  width: var(--svg--width);
}
svg path {
  fill: var(--svg--path--fill);
  transition: var(--svg--path--transition, all 200ms ease-in-out);
  transition-delay: var(--svg--path--transition-delay, 0ms);
}
svg rect:not([id]) {
  stroke: var(--svg--rect--stroke);
  transition: var(--svg--rect--transition, all 200ms ease-in-out);
  transition-delay: var(--svg--rect--transition-delay, 0ms);
}

[data-unpublished=node] {
  background-color: #ffc0cb;
}

[data-unpublished=paragraph] {
  position: relative;
}
[data-unpublished=paragraph]::after {
  background-image: repeating-linear-gradient(45deg, rgba(255, 192, 203, 0.125) 25%, transparent 25%, transparent 75%, rgba(255, 192, 203, 0.125) 75%, rgba(255, 192, 203, 0.125)), repeating-linear-gradient(45deg, rgba(255, 192, 203, 0.125) 25%, transparent 25%, transparent 75%, rgba(255, 192, 203, 0.125) 75%, rgba(255, 192, 203, 0.125));
  background-position: 0 0, 10px 10px;
  background-size: 20px 20px;
  content: "";
  inset: 0;
  mix-blend-mode: multiply;
  pointer-events: none;
  position: absolute;
  z-index: 100;
}
[data-unpublished=paragraph]::before {
  background-color: #ffc0cb;
  color: #000000;
  content: "Unpublished";
  display: block;
  font-size: 0.75em;
  font-weight: var(--unpublished--font-weight);
  padding: 1em;
  pointer-events: none;
  margin-bottom: 1rem;
}

button,
[role=button],
input[type=submit] {
  background-color: var(--button--bg-color);
  border: var(--button--border--width, 0) var(--button--border--style, solid) var(--button--border--color);
  border-radius: var(--button--border-radius, 0);
  color: var(--button--color);
  cursor: pointer;
  display: var(--button--display, inline-block);
  font-family: var(--button--font-family);
  font-size: var(--button--font-size);
  font-weight: var(--button--font-weight);
  line-height: var(--button--line-height);
  margin: var(--button--margin, 0);
  padding: var(--button--padding, 0);
  text-align: var(--button--text-align);
  text-transform: var(--button--text-transform);
  transition: var(--button--transition, all 200ms ease-in-out);
  width: var(--button--width);
}
button:hover, button:focus,
[role=button]:hover,
[role=button]:focus,
input[type=submit]:hover,
input[type=submit]:focus {
  background-color: var(--button--bg-color--active, var(--button--bg-color));
  color: var(--button--color--active, var(--button--color, currentColor));
}

img {
  display: var(--img--display, block);
  max-width: var(--img--max-width, 100%);
  height: var(--img--height, auto);
  width: var(--img--width, auto);
  -o-object-fit: var(--img--object-fit, initial);
     object-fit: var(--img--object-fit, initial);
  position: var(--img--position);
}

a {
  color: var(--a--color);
  cursor: pointer;
  display: var(--a--display, inline-block);
  font-size: var(--a--font-size);
  font-weight: var(--a--font-weight);
  letter-spacing: var(--a--letter-spacing);
  line-height: var(--a--line-height);
  margin: var(--a--margin, 0);
  padding: var(--a--padding, 0);
  pointer-events: var(--a--pointer-events, all);
  position: var(--a--position);
  text-decoration-line: var(--a--text-decoration-line, none);
  text-decoration-thickness: var(--a--text-decoration-thickness, 1px);
  text-underline-offset: var(--a--text-underline-offset, 0.25em);
  text-transform: var(--a--text-transform);
  transition: all 200ms ease-in-out;
  width: var(--a--width);
}
a:hover, a:focus {
  color: var(--a--color--active, var(--a--color, currentColor));
  background-color: var(--a--bg-color--active, var(--a--bg-color));
}

table {
  border: var(--table--border--width, 1px) var(--table--border--style, solid) var(--table--border--color, transparent);
  padding: var(--table--padding, 0);
  margin: var(--table--margin, 0);
  border-collapse: collapse;
  table-layout: auto;
  width: var(--table--width);
  color: var(--table--color);
}
table tr {
  background-color: var(--tr--bg-color);
  border: var(--tr--border--width, 1px) var(--tr--border--style, solid) var(--tr--border--color);
  vertical-align: var(--tr--vertical-align, middle);
}
table th {
  font-size: var(--th--font-size);
  font-family: var(--th--font-family);
  font-weight: var(--th--font-weight);
  padding: var(--th--padding, 1rem);
  text-align: var(--th--text-align);
  text-transform: var(--th--text-transform);
  vertical-align: var(--th--vertical-align, middle);
  border: var(--th--border--width, 1px) var(--th--border--style, solid) var(--th--border--color);
}
table td {
  padding: var(--td--padding, 1rem);
  text-align: var(--td--text-align);
  vertical-align: var(--td--vertical-align, middle);
  border: var(--td--border--width, 1px) var(--td--border--style, solid) var(--td--border--color);
  line-height: var(--td--line-height);
}
table:last-child {
  margin-bottom: 0;
}

dl {
  display: var(--dl--display, block);
  line-height: var(--dl--line-height);
  margin: var(--dl--margin, 0);
  padding: var(--dl--padding, 2em);
  font-size: var(--dl--font-size);
  font-weight: var(--dl--font-weight);
}
dl dt {
  display: var(--dt--display);
  font-family: var(--dt--font-family);
  font-size: var(--dt--font-size);
  font-weight: var(--dt--font-weight);
  margin: var(--dt--margin, 0);
  padding: var(--dt--padding, 0);
}
dl dd {
  display: var(--dd--display);
  font-family: var(--dd--font-family);
  font-size: var(--dd--font-size);
  font-weight: var(--dd--font-weight);
  margin: var(--dd--margin, 0);
  padding: var(--dd--padding, 2em);
}

ul,
ol {
  margin: var(--list--margin, 1em 0);
  padding: var(--list--padding, 0 0 0 2em);
  display: var(--list--display, block);
  line-height: var(--list--line-height, 1.6);
  max-width: var(--list--max-width);
  color: var(--color);
}
ul[class],
ol[class] {
  --list--margin: 0;
  --list--padding: 0;
  --li--style-type: none;
}
ul li,
ol li {
  padding: var(--li--padding, 0);
  margin: var(--li--margin, 0);
  list-style-type: var(--li--style-type);
}
ul li::marker,
ol li::marker {
  color: var(--li--marker--color);
  font-family: var(--li--marker--font-family);
  font-size: var(--li--marker--font-size);
  font-weight: var(--li--marker--font-weight);
}

ul {
  --li--style-type: disc;
}

ol {
  --li--style-type: decimal;
}

:is(h2, h3, h4, h5, h6) + :is(h2, h3, h4, h5, h6) {
  --heading--margin-top: 0;
}

form {
  margin: var(--form--margin, 0);
  padding: var(--form--padding, 0);
  display: var(--form--display, grid);
  gap: var(--form--gap, 1.25rem);
}
form input[type=email],
form input[type=password],
form input[type=text],
form input[type=file],
form input[type=tel],
form input[type=search],
form input[type=url],
form input[type=date],
form select,
form textarea {
  color: var(--form-input--color);
  display: var(--form-input--display, block);
  padding: var(--form-input--padding, 0.4em 0 0.2em 0);
  width: var(--form-input--width, 100%);
  outline: none;
  border-bottom: 1px solid var(--highlight-color);
}
form input[type=email]:invalid,
form input[type=password]:invalid,
form input[type=text]:invalid,
form input[type=file]:invalid,
form input[type=tel]:invalid,
form input[type=search]:invalid,
form input[type=url]:invalid,
form input[type=date]:invalid,
form select:invalid,
form textarea:invalid {
  box-shadow: none;
}
form textarea {
  resize: vertical;
}
form select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
form input[type=date] {
  --form-input--width: auto;
}
form legend {
  margin-bottom: 1em;
}
form label {
  cursor: pointer;
}
form label[class*=required]::after {
  content: "*";
  color: var(--highlight-color);
  margin-left: 0.25em;
}

input[type=checkbox] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 1px solid var(--color);
  cursor: pointer;
  width: 1em;
  height: 1em;
  transform: translateY(-0.075em);
  display: inline-grid;
  place-content: center;
  outline: 0;
  aspect-ratio: 1/1;
}
input[type=checkbox]::before {
  content: "";
  width: 0.65em;
  height: 0.65em;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
  transform: scale(0);
  transform-origin: bottom left;
  transition: 120ms transform ease-in-out;
  box-shadow: inset 1em 1em var(--highlight-color);
}
input[type=checkbox]:checked::before {
  transform: scale(1);
}
input[type=checkbox] + label {
  margin-left: 0.25em;
}

input[type=radio] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 1px solid var(--color);
  cursor: pointer;
  width: 1em;
  height: 1em;
  transform: translateY(-0.075em);
  display: inline-grid;
  place-content: center;
  border-radius: 50%;
  outline: 0;
  aspect-ratio: 1/1;
}
input[type=radio]::before {
  border-radius: 50%;
  content: "";
  width: 0.6em;
  height: 0.6em;
  transform: scale(0);
  transform-origin: center;
  transition: 120ms transform ease-in-out;
  box-shadow: inset 1em 1em var(--highlight-color);
}
input[type=radio]:checked::before {
  transform: scale(1);
}
input[type=radio] + label {
  margin-left: 0.25em;
}
