@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/inter/inter-regular.woff2") format("woff2");
}

@font-face {
  font-family: Inter;
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/inter/inter-italic.woff2") format("woff2");
}

@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/inter/inter-medium.woff2") format("woff2");
}

@font-face {
  font-family: Inter;
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/inter/inter-mediumitalic.woff2") format("woff2");
}

@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/inter/inter-semibold.woff2") format("woff2");
}

@font-face {
  font-family: Inter;
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/inter/inter-semibolditalic.woff2") format("woff2");
}

@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/inter/inter-bold.woff2") format("woff2");
}

@font-face {
  font-family: Inter;
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/inter/inter-bolditalic.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: italic;
  font-weight: 100;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-thinitalic.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-extraLight.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: italic;
  font-weight: 200;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-extraLightitalic.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-light.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-lightitalic.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-regular.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-italic.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-medium.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-mediumitalic.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-semibold.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-semibolditalic.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-bold.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-bolditalic.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-extrabold.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-extrabolditalic.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-black.woff2") format("woff2");
}

@font-face {
  font-family: InterDisplay;
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url("/assets/fonts/inter/interdisplay-blackitalic.woff2") format("woff2");
}

@property --template-columns {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --template-rows {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --column {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --row {
  syntax: "*";
  inherits: false;
  initial-value: auto;
}

@property --color {
  syntax: "*";
  inherits: false;
  initial-value: currentColor;
}

@property --background-color {
  syntax: "*";
  inherits: false;
  initial-value: transparent;
}

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

:where(html, body, div, span, button, input, select, textarea, object, iframe, h1, h2, h3, h4, h5, h6, hr, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, main, menu, nav, section, summary, time, mark, audio, video) {
  font: inherit;
  vertical-align: baseline;
  background: none;
  border: 0;
  outline: 0;
  min-width: 0;
  margin: 0;
  padding: 0;
  font-size: 100%;
}

:where(article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, svg) {
  display: block;
}

:root {
  --font-primary: "Inter", sans-serif;
  --font-family: var(--font-primary);
  --font-size: clamp(1em, .75em + 1vw, 1.5em);
  --font-size-h2: 140%;
  --font-size-h3: 140%;
  --font-size-h4: ;
  --font-size-h5: ;
  --font-weight: 400;
  --font-weight-h2: 600;
  --font-weight-h3: 600;
  --font-weight-h4: ;
  --line-height: clamp(1.3em, 1.25em + .5vw, 1.65em);
  --line-height-h2: 110%;
  --line-height-h3: clamp(1.2em, .7em + 1.4vw, 1.5em);
  --line-height-h4: ;
  --max-width-default: 65ch;
  --text-decoration-style: underline;
  --text-underline-offset: .15em;
  --text-underline-offset-hover: var(--text-underline-offset);
  --text-decoration-thickness: .08em;
  --text-decoration-thickness-hover: .14em;
  --border-width: ;
  --border-radius: .28rem;
  --ratio-square: 1;
  --ratio-landscape: 4/3;
  --ratio-portrait: 3/4;
  --ratio-widescreen: 16/9;
  --ratio-ultrawide: 18/5;
  --ratio-golden: 1.618/1;
  --grid-column-gap: var(--size-s-m);
  --grid-row-gap: var(--size-s-m);
  --space-0-xl: clamp(0rem, -1.5714rem + 7.8571vw, 8.25rem);
  --size-4xs: clamp(0rem, 0rem + 0vw, 0rem);
  --size-3xs: clamp(.25rem, .2262rem + .119vw, .375rem);
  --size-2xs: clamp(.5rem, .4643rem + .1786vw, .6875rem);
  --size-xs: clamp(.75rem, .6905rem + .2976vw, 1.0625rem);
  --size-s: clamp(1rem, .9286rem + .3571vw, 1.375rem);
  --size-m: clamp(1.5rem, 1.3929rem + .5357vw, 2.0625rem);
  --size-l: clamp(1.75rem, 1.619rem + .6548vw, 2.4375rem);
  --size-xl: clamp(2.5rem, 2.3214rem + .8929vw, 3.4375rem);
  --size-2xl: clamp(3rem, 2.7857rem + 1.0714vw, 4.125rem);
  --size-3xl: clamp(4rem, 3.7143rem + 1.4286vw, 5.5rem);
  --size-4xl: clamp(6rem, 5.5714rem + 2.1429vw, 8.25rem);
  --size-4xs-3xs: clamp(0rem, -.0714rem + .3571vw, .375rem);
  --size-3xs-2xs: clamp(.25rem, .1667rem + .4167vw, .6875rem);
  --size-2xs-xs: clamp(.5rem, .3929rem + .5357vw, 1.0625rem);
  --size-xs-s: clamp(.75rem, .631rem + .5952vw, 1.375rem);
  --size-s-m: clamp(1rem, .7976rem + 1.0119vw, 2.0625rem);
  --size-m-l: clamp(1.5rem, 1.3214rem + .8929vw, 2.4375rem);
  --size-l-xl: clamp(1.75rem, 1.4286rem + 1.6071vw, 3.4375rem);
  --size-xl-2xl: clamp(2.5rem, 2.1905rem + 1.5476vw, 4.125rem);
  --size-2xl-3xl: clamp(3rem, 2.5238rem + 2.381vw, 5.5rem);
  --size-3xl-4xl: clamp(4rem, 3.1905rem + 4.0476vw, 8.25rem);
  --size-xl-l: clamp(2.4375rem, 2.5119rem + -.0595vw, 2.5rem);
  --size-m-xl: clamp(1.5rem, 1.131rem + 1.8452vw, 3.4375rem);
  --size-m-2xl: clamp(1.5rem, 1rem + 2.5vw, 4.125rem);
  --size-3xs-l: clamp(.25rem, -.1667rem + 2.0833vw, 2.4375rem);
  --size-4xs-2xl: clamp(0rem, -.7857rem + 3.9286vw, 4.125rem);
  --size-4xs-3xl: clamp(0rem, -1.0476rem + 5.2381vw, 5.5rem);
  --size-4xs-4xl: clamp(0rem, -1.5714rem + 7.8571vw, 8.25rem);
  --size-m-4xl: clamp(1.5rem, .2143rem + 6.4286vw, 8.25rem);
  --size-xs-2xl: clamp(.75rem, .1071rem + 3.2143vw, 4.125rem);
  --size-xs-l: clamp(.75rem, .4286rem + 1.6071vw, 2.4375rem);
  --size-s-2xl: clamp(1rem, .4048rem + 2.9762vw, 4.125rem);
  --size-m-2xs: clamp(.6875rem, 1.6548rem + -.7738vw, 1.5rem);
  --background-color-dark: var(--black);
  --background-color-light: var(--white);
  --background-color: var(--background-color-light);
  --color-dark: var(--white);
  --color-light: var(--black);
  --color: var(--color-light);
  --color-link-dark: var(--accent-color-dark);
  --color-link-light: var(--accent-color-light);
  --color-link: var(--color-link-light);
  --color-link-hover-dark: var(--accent-color-dark);
  --color-link-hover-light: var(--accent-color-light);
  --color-link-hover: var(--blue-darker);
  --accent-color-dark: var(--blue);
  --accent-color-light: var(--blue);
  --accent-color: var(--accent-color-light);
  --subtle-color-dark: var(--white);
  --subtle-color-light: var(--black);
  --subtle-color: var(--subtle-color-light);
  --subtle-background-color-dark: ;
  --subtle-background-color-light: ;
  --subtle-background-color: light-dark(var(--background-subtle-color-light), var(--background-subtle-color-dark));
  --color-debug: var(--red);
  --black: #1a1a1a;
  --white: #f1f2eb;
  --true-white: #fff;
  --true-black: #000;
  --gray: #b7b7b7;
  --gray-dark: #212121;
  --gray-light: #edefec;
  --green: #91cd55;
  --green-alt: #e5eedb;
  --lightgreen: #e5eedb;
  --green-75: #91ce55bf;
  --green-50: #91ce5580;
  --green-25: #91ce5540;
  --green-15: #92ce551c;
  --purple: #4c2c92;
  --lightblue: #cfd7e6;
  --blue: #15388a;
  --blue-darker: #02265c;
  --blue-alt: #f0f4f9;
  --blue-75: #15388abf;
  --blue-50: #15388a80;
  --blue-25: #15388a40;
  --blue-15: #15388a26;
  --blue-25-solid: #91a0c4;
  --blue-15-solid: #e5e8f0;
  --blue-05: #15388a0d;
  --yellow: #f8e86a;
  --rose: #f7ccdb;
  --red: #ec6656;
}

html {
  color-scheme: light dark;
  background-color: #f9f9f9;
  background-color: var(--background-color, #f9f9f9);
  color: var(--color);
  accent-color: #191919;
  accent-color: var(--accent-color);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif;
  font-family: var(--font-family, sans-serif);
  font-size: var(--font-size);
  font-weight: 500;
  line-height: var(--line-height);
  font-kerning: normal;
  font-variant-ligatures: common-ligatures no-discretionary-ligatures no-historical-ligatures contextual;
  font-variant-numeric: slashed-zero;
  hanging-punctuation: first allow-end last;

  @supports (font-variation-settings: normal) {
    font-feature-settings: "liga" 1, "calt" 1;
  }

  text-decoration-skip-ink: auto;
  text-rendering: optimizespeed;
  text-wrap: pretty;
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  text-size-adjust: none;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}

body {
  --template-columns: minmax(0,1fr);
  --template-rows: auto;
  --column: 1 / -1;
  --column-gap: 0;
  --row-gap: 0;
  overflow-x: clip;
}

:where(a, [data-type="link"]) {
  --color: var(--color-link);
  color: var(--color);
  text-decoration-skip-ink: auto;
  text-decoration-style: var(--text-decoration-style);
  text-decoration-thickness: var(--text-decoration-thickness);
  text-underline-offset: var(--text-underline-offset);

  &:hover {
    --color: var(--color-link-hover);
    --text-decoration-thickness: var(--text-decoration-thickness-hover);
    --text-underline-offset: var(--text-underline-offset-hover);
  }
}

summary::-webkit-details-marker, summary::marker {
  content: "";
  display: none;
}

footer-site {
  --column: 1 / -1;
  background-color: var(--background-color);
  padding-block-start: var(--size-2xl);
  padding-block-end: var(--size-xl);

  & > * {
    --column: 2 / -2;
  }

  & menu li {
    --flex-grow: 0;
    padding-inline-end: 1.5ch;
  }

  & h3 {
    padding-block-end: 1ch;
  }

  & h3 span {
    --font-size-h3: 120%;
    --line-height-h3: 85%;
  }

  & a:hover {
    padding-block: .2ch;
  }
}

input, button, textarea, select {
  font-family: inherit;
  font-size: inherit;
  color: var(--color);
  background-color: var(--blue-15);
}

select {
  appearance: none;
  box-shadow: none;
  background-color: var(--blue-15);
  padding-inline: var(--size-2xs);
  padding-block: var(--size-2xs);
  border-radius: 0;
  outline: none;
}

button, input, label {
  line-height: 1.1;
}

input, textarea {
  color: var(--color);
  padding-inline: var(--size-2xs);
  padding-block: var(--size-2xs);
}

input::placeholder, textarea::placeholder {
  color: var(--blue);
}

input:focus::placeholder, textarea:focus::placeholder {
  opacity: 0;
}

input[type="search"]::placeholder {
  color: var(--blue);
}

input[type="search"]:focus::placeholder {
  opacity: 0;
}

input[type="submit"] {
  background-color: var(--blue);
  color: var(--white);
}

form .alert.error {
  margin-block-end: var(--space-xs);
}

form .alert.error span {
  background-color: var(--blue);
  color: var(--white);
  font-size: 80%;
  font-family: var(--font-family-primary);
  padding-block: .35ch;
  padding-inline: .65ch;
}

form .alert.error span:before {
  content: "↑";
  padding-inline-end: 1ch;
}

form .alert.error span:after {
  content: "↑";
  padding-inline-start: 1ch;
}

:where(h1, h2, h3, h4, h5, h6) span {
  text-wrap: pretty;
}

h1 span {
  font-size: var(--font-size-h1, --font-size);
  font-weight: var(--font-weight-h1, --font-weight);
  line-height: var(--line-height-h1, --line-height);
}

h2 span {
  font-size: var(--font-size-h2, --font-size);
  font-weight: var(--font-weight-h2, --font-weight);
  line-height: var(--line-height-h2, --line-height);
}

h3 span {
  font-size: var(--font-size-h3, --font-size);
  font-weight: var(--font-weight-h3, --font-weight);
  line-height: var(--line-height-h3, --line-height);
}

h4 span {
  font-size: var(--font-size-h4, --font-size);
  font-weight: var(--font-weight-h4, --font-weight);
  line-height: var(--line-height-h4, --line-height);
}

h5 span {
  font-size: var(--font-size-h5, --font-size);
  font-weight: var(--font-weight-h5, --font-weight);
  line-height: var(--line-height-h5, --line-height);
}

h6 span {
  font-size: var(--font-size-h6, --font-size);
  font-weight: var(--font-weight-h6, --font-weight);
  line-height: var(--line-height-h6, --line-height);
}

header-site {
  --row: 2;
  padding-block-start: var(--size-s-m);
  padding-block-end: var(--size-s-m);

  & svg {
    width: min(40rem, 98vw);
    margin-inline: auto;
    transition: all .15s ease-in;
    display: block;
  }

  & a {
    &:hover {
      & .element.shapes {
        fill: var(--blue);
        transition: all .52s ease-in-out;
      }
    }
  }
}

header, header-site {
  display: var(--display);
  background-color: var(--background-color, transparent);
  color: var(--color);
}

img {
  object-fit: contain;
}

main, footer-site {
  --column: 1 / -1;
  --row: ;
  --template-columns: var(--size-4xs-4xl)
    repeat(2, minmax(0,1fr))
    var(--size-4xs-4xl)
    repeat(2, minmax(0,1fr))
    var(--size-4xs-4xl);
  --template-rows: auto;
  --column-gap: var(--size-m);
  --row-gap: var(--size-m-2xl);
  max-width: 120rem;
  padding-block-end: var(--size-4xl);

  & > * {
    --column: 2 / -2;
  }
}

menu {
  list-style-type: none;
}

ol {
  hyphens: none;
  text-wrap: pretty;
}

ol[role="list"] {
  list-style: none;
}

p {
  text-wrap: pretty;
}

p + p {
  margin-block-start: 1lh;
}

p strong {
  font-weight: 600;
}

p em {
  font-style: italic;
}

:focus {
  scroll-padding-block-end: 8vh;
}

:focus-visible {
  --outline-size: max(2px, .15em);
  --outline-color: var(--accent-color);
  outline: var(--outline-width, var(--outline-size)) var(--outline-style, solid) var(--outline-color, currentColor);
  outline-offset: var(--outline-offset, var(--outline-size));
}

:target {
  scroll-margin-block: 5ex;
  scroll-padding-block-start: 2rem;
}

::selection {
  background-color: var(--blue);
  color: var(--white);
}

site-menu-collapsible {
  --row: 1;

  & * {
    -webkit-user-select: none;
    user-select: none;
  }

  & menu-toc {
    --template-columns: 1fr;
    --column-gap: var(--column-gap);
    padding-inline: calc(var(--size-m-4xl));
    width: min(45rem, 100%);
    margin-inline: auto;

    & > * {
      --column: 2 / -2;
      --row: ;
    }
  }

  & details[open] {
    background: var(--blue-25);
    padding-block-end: var(--size-s-m);
    transition: all .45s ease-out;

    & menu-toc {
      animation: .4s both fadeDown;
    }

    & svg {
      fill: var(--blue);
    }

    & summary span {
      opacity: 0;
    }
  }

  & summary {
    font-size: var(--size-s);
    padding-inline: var(--size-s);
    padding-block: var(--size-s);
    justify-content: flex-end;
    align-items: center;
    width: 12ch;
    margin-left: auto;
    display: flex;

    & span, & svg {
      cursor: pointer;
      -webkit-user-select: none;
      user-select: none;
    }

    & span {
      text-decoration: underline;
      text-decoration-thickness: var(--text-decoration-thickness);
      text-underline-offset: var(--text-underline-offset);
    }

    & svg {
      vertical-align: baseline;
      height: 100%;
      transition: all .15s linear;
      display: inline;
    }

    &:hover {
      --text-decoration-thickness: var(--text-decoration-thickness-hover);
      color: var(--blue);
      fill: var(--blue);

      & svg {
        transform: scaleY(.85);
      }
    }

    & svg {
      height: var(--size-s);
      width: auto;
      margin-inline-start: 1ch;
    }
  }

  & menu {
    grid-column-gap: 2rem;
    grid-row-gap: 1rem;
    padding-block: var(--size-l);
    grid-template-columns: repeat(auto-fill, minmax(25ch, 1fr));
    display: grid;
  }

  & form {
    display: flex;
  }

  & input[type="search"] {
    background-color: var(--blue-15-solid);
    flex-grow: 1;
    margin-inline-end: var(--size-2xs);
  }

  & input[type="search"]::placeholder {
    color: var(--gray-dark);
  }

  & input[type="search"]:focus::placeholder {
    opacity: 0;
  }

  & input[type="submit"] {
    background-color: var(--blue-75);
    color: var(--white);

    &:active {
      background-color: var(--blue);
      color: var(--white);
    }
  }
}

site-menu-collapsible:has(details[open]) {
  box-shadow: 0 1px 1px #00000013, 0 2px 2px #00000013, 0 4px 4px #00000013, 0 8px 8px #00000013, 0 16px 16px #00000013;
}

@media (scripting: none) {
  site-menu-collapsible {
    display: none !important;
  }
}

@keyframes fadeDown {
  from {
    opacity: 1;
    transform: translateY(-200px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

section, section-audio, section-collapsible, section-header, section-heading, section-image, section-images, section-link, section-links, section-quote, section-text, site-menu-collapsible, section-video {
  background-color: var(--background-color, transparent);
  color: var(--color);
}

svg[data-type="clippath"] {
  width: 0;
  height: 0;
  position: absolute;
  bottom: 0;
  right: 0;
}

ul[role="list"] {
  list-style: none;
}

ol, ul {
  hyphens: none;
  text-wrap: pretty;
}

section-contact-form {
  justify-self: center;
  width: 100%;
  max-width: 65ch;

  & form {
    --row-gap: 1rem;
    --template-columns: 1fr;
  }

  & form > * {
    --column: span 1;
  }

  & label {
    font-weight: 600;
  }

  & label:not(:first-of-type) {
    padding-top: 2rem;
  }

  & input[type="submit"] {
    margin-block: var(--size-xl-2xl);
  }

  & [data-type="honeypot"] {
    display: none;
  }

  & input::placeholder, & textarea::placeholder {
    opacity: .5;
  }
}

section-collapsible:first-of-type > :first-child {
  border-top-left-radius: 1ch;
  border-top-right-radius: 1ch;
}

section-collapsible:last-of-type > :first-child {
  border-bottom-right-radius: 1ch;
  border-bottom-left-radius: 1ch;
}

section-collapsible + section-collapsible {
  margin-top: calc(var(--row-gap) * -.9);
}

section-collapsible {
  --column: 2 / -2;

  & details {
    height: auto;
    padding: calc(var(--row-gap)*.5);
    background-color: #fff;
    box-shadow: 0 1px 2px #0000001a;

    & > * {
      margin-block-start: 1lh;
      padding-inline-start: var(--size-xs);
      display: block;
    }

    &:hover {
      box-shadow: 0 1px 1px #00000013, 0 2px 2px #00000013, 0 4px 4px #00000013, 0 8px 8px #00000013, 0 16px 16px #00000013;
    }
  }

  & summary {
    cursor: pointer;
    padding-block: var(--size-xs);
    justify-content: space-between;
    margin: 0;
    display: flex;

    & span {
      font-size: var(--size-s);
      hyphens: none;
      text-underline-offset: var(--text-underline-offset);
      width: 90%;
      text-decoration-thickness: var(--text-decoration-thickness);
    }

    &:after {
      content: "+";
      color: var(--black);
      align-self: center;
      padding-inline-end: var(--size-xs);
      font-size: 160%;
      font-weight: 400;
    }
  }

  &:hover {
    & summary {
      &:after {
        color: var(--blue);
      }
    }
  }

  & details[open] {
    padding-bottom: var(--size-m);

    & summary {
      padding-block-end: var(--size-xs);

      & span {
        color: var(--black);
        font-weight: 600;
        text-decoration: none;
      }
    }

    & summary:after {
      content: "-";
      color: var(--blue);
    }
  }

  & ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
  }

  & ul li {
    display: flex;
  }

  & ul li:before {
    content: "-";
    margin-inline-start: -.5ch;
    padding-inline-end: .5ch;
  }
}

section-heading {
  &[modifiers*="full-width"] {
    --column: 2 / -2;

    & > * {
      max-width: unset;
      margin-inline: none;
    }
  }
}

section-links {
  --column: 2  / -2;
  padding-block-end: var(--size-m-l);

  & ul {
    gap: var(--row-gap);
    grid-template-columns: repeat(1, minmax(0, 1fr));
    display: grid;

    @media (width >= 24rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    @media (width >= 56rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }

  & li {
    background-color: var(--true-white);
    border-radius: .5rem;
    transition: all .15s;
    position: relative;
    transform: scale(.98);
    box-shadow: 0 1px 3px #0000001a;

    &:hover {
      background-color: var(--blue);
      box-shadow: 0 1px 1px #00000013, 0 2px 2px #00000013, 0 4px 4px #00000013, 0 8px 8px #00000013, 0 16px 16px #00000013;

      & a {
        text-decoration-color: var(--white);
      }

      & img {
        display: none;
      }

      & span {
        color: var(--white);
        transform: translateY(var(--size-3xs)) scale(1.15);
      }
    }
  }

  & a {
    border-radius: var(--border-radius-default);
    padding-bottom: var(--size-xs);
    aspect-ratio: 3 / 2;
    flex-direction: column;
    align-items: center;
    display: grid;
  }

  & span {
    justify-self: center;
    transition: all .15s;
  }

  & img {
    object-fit: contain;
    aspect-ratio: 16 / 9;
    border-radius: var(--border-radius-default-inner);
    mix-blend-mode: multiply;
    width: 100%;
    height: 100%;
    padding: var(--size-3xs-l);
    overflow: hidden;
    margin-block: .42rem !important;
    margin-inline: .5rem !important;
  }
}

section-quote {
  & blockquote {
    quotes: none;

    &:before, &:after {
      content: none;
    }
  }
}

section-search-results {
  & ol {
    --flex-direction: column;
  }
}

section-text-image {
  --flex-gap: var(--size-s);
  container-type: inline-size;

  & div {
    --flex-basis: 80vw;
    hyphens: none;
    text-wrap: pretty;
    align-content: center;
  }

  & h2 {
    padding-block-end: var(--size-xs);
  }

  & figure {
    --flex-basis: 80vw;
    align-self: center;
    max-width: 30rem;
    display: flex;
    overflow: clip;
  }

  @container (width >= 28rem) {
    & div {
      --flex-basis: 40%;
      justify-self: flex-start;
    }

    & figure {
      --flex-basis: 50%;

      &[data-layout-position*="left"] {
        order: -1;
      }

      &[data-layout-position*="right"] {
        order: 2;
      }
    }
  }
}

section-text {
  & section {
    display: contents;
  }

  max-width: var(--max-width-default);
  margin-inline-end: auto;

  &[modifiers*="multi-column"] {
    column-width: 28ch;
    column-gap: var(--column-gap);
  }

  & ul {
    padding-block: var(--grid-row-gap);
    list-style-type: none;

    & li {
      display: flex;
    }

    & li:not(:last-of-type) {
      padding-block-end: calc(var(--grid-row-gap)*.333);
    }

    & li:before {
      content: "-";
      text-indent: -1ch;
    }
  }
}

section[data-block*="news"] {
  --column: 1 / -1;
  background-color: var(--green);

  & p {
    padding-inline: calc(var(--size-4xs-4xl) + var(--column-gap));
    padding-block: var(--size-2xs);
  }

  & p a {
    color: currentColor;
  }
}

figure-image {
  height: auto;

  & img {
    object-fit: contain;
    width: auto;
    max-width: 100%;
    max-height: 60vh;
    display: flex;
  }
}

section-images {
  --column: 2 / -2;
  --template-columns: repeat(auto-fill, minmax(var(--auto-grid-min-size), 1fr));
  --template-rows: ;
  --auto-grid-size: var(--size-s);

  &[layout="grid"] {
    --template-columns: ;
    --template-rows: ;

    &[size="m"] {
      --auto-grid-size: var(--size-m);
    }

    &[size="l"] {
      --auto-grid-size: var(--size-l);
    }

    &[size="xl"] {
      --auto-grid-size: var(--size-xl);
    }
  }

  &[layout="reel"] {
    --column: 1 / -1;
    block-size: auto;
    padding-block: var(--size-3xs-l);
    padding-inline: var(--size-3xs-l);
    margin-block: var(--size-3xs-l);
    scrollbar-color: var(--color);
    height: max(35vh, 30vw);
    display: flex;
    overflow: auto hidden;

    &[size="l"] {
      height: clamp(32rem, 80vh, 25rem);
    }

    & > * {
      block-size: 100%;
      flex: none;
      width: auto;
    }

    & > * + * {
      margin-inline-start: var(--size-3xs-l);
    }
  }
}

figure-video {
  background: #fff;

  & mux-player {
    aspect-ratio: 16 / 9;
    aspect-ratio: 16 / 9;
    object-fit: contain;
    background: #fff;
    border-radius: 10px;
    overflow: clip;
    box-shadow: 0 1px 1px #00000013, 0 2px 2px #00000013, 0 4px 4px #00000013, 0 8px 8px #00000013, 0 16px 16px #00000013;
  }
}

@-webkit-keyframes animation-words {
  0% {
    opacity: 0;
    scale: .95;
  }

  100% {
    scale: 1;
  }
}

@keyframes animation-words {
  0% {
    opacity: 0;
    scale: .95;
  }

  100% {
    scale: 1;
  }
}

@-webkit-keyframes animation-shape {
  0% {
    opacity: 0;
    transform: translateY(-2rem);
  }

  100% {
    opacity: 1;
  }
}

@keyframes animation-shape {
  0% {
    opacity: 0;
    transform: translateY(-2rem);
  }

  100% {
    opacity: 1;
  }
}

[data-flex] {
  flex-wrap: wrap;
  flex-direction: var(--flex-direction);
  gap: var(--flex-gap);
  display: flex;

  & > * {
    flex-grow: var(--flex-grow, 1);
    flex-shrink: var(--flex-shrink, 1);
    flex-basis: var(--flex-basis);
  }
}

[data-grid] {
  grid-template-columns: var(--template-columns);
  grid-template-rows: var(--template-rows);
  column-gap: var(--column-gap);
  row-gap: var(--row-gap);
  display: grid;

  & > * {
    grid-column: var(--column);
    grid-row: var(--row);
  }
}

@media (prefers-reduced-motion: no-preference) {
  :root {
    view-transition-name: root;
  }

  @view-transition {
    navigation: auto;
  }

  ::view-transition-group(root) {
    animation-duration: .5s;
    animation-delay: .25s;
  }
}

/*# sourceMappingURL=site.min.css.map */