@keyframes click-pulse {
  0% {
    transform: scale(1);
  }

  10% {
    transform: scale(calc(1 - var(--pulse)));
  }

  40% {
    transform: scale(calc(1 + var(--pulse) * .5));
  }

  100% {
    transform: scale(1);
  }
}

.pulse {
  --pulse: .03;
  animation: click-pulse var(--transition-default) linear;
}

html {
  -moz-text-size-adjust: 100%;
  text-size-adjust: 100%;
  line-height: 1.15;
}

body {
  margin: 0;
}

main {
  display: block;
}

h1 {
  margin: .67em 0;
  font-size: 2em;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

pre {
  font-family: monospace;
  font-size: 1em;
}

a {
  background-color: #0000;
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline dotted;
}

b, strong {
  font-weight: bolder;
}

code, kbd, samp {
  font-family: monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub, sup {
  vertical-align: baseline;
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}

img {
  border-style: none;
}

button, input, optgroup, select, textarea {
  margin: 0;
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
}

button, input {
  overflow: visible;
}

button, select {
  text-transform: none;
}

button, [type="button"], [type="reset"], [type="submit"] {
  appearance: button;
}

button::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

[type="button"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

[type="reset"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

button:-moz-focusring {
  outline: 1px dotted buttontext;
}

[type="button"]:-moz-focusring {
  outline: 1px dotted buttontext;
}

[type="reset"]:-moz-focusring {
  outline: 1px dotted buttontext;
}

[type="submit"]:-moz-focusring {
  outline: 1px dotted buttontext;
}

fieldset {
  padding: .35em .75em .625em;
}

legend {
  box-sizing: border-box;
  max-width: 100%;
  color: inherit;
  white-space: normal;
  padding: 0;
  display: table;
}

progress {
  vertical-align: baseline;
}

textarea {
  overflow: auto;
}

[type="checkbox"], [type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

[type="number"]::-webkit-inner-spin-button {
  height: auto;
}

[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  appearance: textfield;
  outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
  appearance: none;
}

::-webkit-file-upload-button {
  font: inherit;
  appearance: button;
}

details {
  display: block;
}

summary {
  display: list-item;
}

template, [hidden] {
  display: none;
}

h1, h2, h3, h4, h5, h6 {
  font: inherit;
  vertical-align: baseline;
  border: 0;
  margin: 0;
  padding: 0;
  font-size: 100%;
}

body {
  -moz-osx-font-smoothing: grayscale;
  backface-visibility: hidden;
  line-height: 1;
  -webkit-font-smoothing: antialiased !important;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: "";
  content: none;
}

table {
  border-spacing: 0;
  border-collapse: collapse;
}

img {
  -ms-interpolation-mode: bicubic;
}

iframe {
  background: none;
  overflow: hidden;
}

:root {
  --colors-bg-one: #fff;
  --colors-bg-two: #000;
  --colors-bg-three: #e5e5e5;
  --colors-theme-one: #ffde00;
  --colors-text-one: #000;
  --colors-text-two: #fff;
  --color: var(--colors-text-one);
  --bg-color: var(--colors-bg-one);
  --transition-fast: .2s;
  --transition-default: .4s;
  --transition-slow: .8s;
  --transition-easing: cubic-bezier(.65, .05, .36, 1);
  --transition-easing-quad: cubic-bezier(.8, 0, .2, 1);
  --transition-easing-out: cubic-bezier(.11, .46, .36, 1);
  --transition-easing-back: cubic-bezier(.5, .01, .19, 1.65);
  --transition-easing-out-back: cubic-bezier(.3, 1.36, .59, .99);
  --transition-easing-in: cubic-bezier(.58, 0, 1, .52);
  --window-width: 100vw;
  --window-height: 100vh;
  --document-height: 100vh;
  --inner-height: 100vh;
  --navbar-height: 0;
  --current-navbar-height: 0;
  --max-content: 1280px;
  --cw: min(1vw, calc(1280px / 100));
  --gutter: calc(16 * 1px + (30 - 16) * (100vw - var(--m) * 1px) / (var(--d) - var(--m)));
  --padding: calc(16 * 1px + (30 - 16) * (100vw - var(--m) * 1px) / (var(--d) - var(--m)));
  --block-padding: calc(var(--font-book) * .5);
  --hover-opacity: .08;
  --border-radius: calc(var(--gutter) * .5);
  --speed: var(--transition-default);
  --nav-height: calc(0px);
  --footer-height: calc(0px);
}

.main {
  z-index: 100;
}

.bg {
  z-index: 150;
}

.fs-video {
  z-index: 175;
}

.nav {
  z-index: 200;
}

.body:has(.media--fullscreen) .nav {
  z-index: 99;
}

.bottom {
  z-index: 201;
}

.footer {
  z-index: 202;
}

.popover {
  z-index: 300;
}

.media-popover {
  z-index: 350;
}

.cookies-cursor {
  z-index: 375;
}

:root {
  --view-transition-duration: calc(var(--transition-slow) * .75);
}

::view-transition-old(root), ::view-transition-new(root) {
  z-index: 1;
  animation-duration: calc(var(--view-transition-duration) * 1);
  animation-timing-function: var(--transition-easing-quad);
  animation-delay: 0s;
  animation-fill-mode: both;
}

::view-transition-group(*) {
  animation-duration: var(--view-transition-duration);
  animation-timing-function: var(--transition-easing-quad);
}

::view-transition-group(.text), ::view-transition-group(.title), ::view-transition-group(bg-scroll), ::view-transition-group(bg-bottom), ::view-transition-group(bg-nav) {
  z-index: 2;
}

::view-transition-group(footer), ::view-transition-group(nav-scroll), ::view-transition-group(nav-top), ::view-transition-group(bottom) {
  z-index: 3;
}

::view-transition-group(popover-project) {
  z-index: 4;
}

::view-transition-group(grid-reader), ::view-transition-group(info-reader), ::view-transition-group(grid-related), ::view-transition-group(info-related) {
  z-index: 5;
}

::view-transition-group(media-item), ::view-transition-group(reader-comma), ::view-transition-group(contact-btn), ::view-transition-group(media-copy) {
  z-index: 6;
}

@media (width <= 599px) {
  .fader--desktop {
    display: none !important;
  }
}

@media (width > 599px) {
  .fader--mobile {
    display: none !important;
  }
}

.fader--loader img, img.fader--loader, .fader--loader video, video.fader--loader {
  width: 100% !important;
}

.fader {
  --vert: calc(var(--padding) * 0);
  --hor: calc(var(--gutter) * 1);
  --move-duration: calc(var(--transition-slow) * .5);
  --opacity-duration: calc(var(--transition-slow) * .5);
  --timing-function: cubic-bezier(.06, .82, 0, 1);
  will-change: transform, opacity, clip-path;
  opacity: 0;
  transition: transform var(--timing-function), opacity ease, clip-path var(--transition-easing), color ease, background-color ease, border-color ease;
  transition-delay: 0s;
}

.fader[style*="--fader-duration"] {
  --move-duration: var(--fader-duration);
  --opacity-duration: var(--fader-duration);
}

.fader.split__text {
  transition-property: transform, opacity, clip-path;
}

.no-js .fader {
  animation: fader-fader-in var(--move-duration);
  animation-delay: .4s;
  animation-fill-mode: both;
}

@keyframes fader-fader-in {
  0% {
    transform: translateY(calc(var(--vert) * 1));
    opacity: 0;
  }

  100% {
    opacity: 1;
    transform: none;
  }
}

.js .fader {
  transform: translateY(calc(var(--vert) * 1));
  opacity: 0;
}

.body--firefox .js .fader, .body--firefox .js .fader.fader--top-start {
  transform: none;
}

.body--firefox .js .fader--clip {
  transform: translateY(calc(var(--vert) * 1));
}

.body--firefox .js .fader--clip.fader--top-start {
  transform: translateY(calc(var(--vert) * -1));
}

.body--firefox .js .fader--clip-hor, .body--firefox .js .fader--clip-hor.fader--top-start {
  transform: translateY(calc(var(--vert) * 0));
}

.body--firefox .js .fader--up {
  transform: translateY(100%);
}

.body--firefox .js .fader--up.fader--top-start {
  transform: translateY(-100%);
}

.js .fader--top-start {
  transform: translateY(calc(var(--vert) * -1));
}

.js .fader--shrink {
  transform: scale(1.1);
}

.js .fader--left {
  transform: translateX(calc(var(--hor) * -1));
}

.js .fader--right {
  transform: translateX(calc(var(--hor) * 1));
}

.js .fader--bl {
  transform: translate(calc(var(--hor) * -1), var(--vert));
}

.js .fader--bl.fader--top-start {
  transform: translate(calc(var(--hor) * -1), calc(var(--vert) * -1));
}

.js .fader--br {
  transform: translate(calc(var(--hor) * 1), var(--vert));
}

.js .fader--br.fader--top-start {
  transform: translate(calc(var(--hor) * 1), calc(var(--vert) * -1));
}

.js .fader--still {
  will-change: opacity;
  transform: initial;
  transition-property: opacity;
}

.js .fader--fullscreen, .js .fader--no-fade {
  will-change: auto;
  opacity: 1;
  transition-property: none;
  transform: none;
}

.js .fader--clip {
  transform: translateY(calc(var(--vert) * 1));
  opacity: 1;
  clip-path: inset(100% 0 0);
}

.js .fader--clip.fader--top-start {
  transform: translateY(calc(var(--vert) * -1));
}

.js .fader--clip-hor {
  transform: translateY(calc(var(--vert) * 0));
  opacity: 1;
  clip-path: inset(0 100% 0 0);
}

.js .fader--clip-hor.fader--top-start {
  transform: translateY(calc(var(--vert) * 0));
}

.js .fader--up {
  opacity: 1;
  transform: translateY(100%);
}

.js .fader--up.fader--top-start {
  transform: translateY(-100%);
}

.js .fader--fast-load {
  --move-duration: 0s;
  --opacity-duration: .1s;
  transform: none;
}

.js .fader.nav__item {
  pointer-events: none;
}

.js .fader.fader--loader:not(.fader--loaded) {
  opacity: 0;
}

.js .fader.video--cover, .js .fader.cover {
  transform: scale(1.05);
}

@media (width <= 800px) {
  .js .fader--bl {
    transform: translate(0, var(--vert));
  }

  .js .fader--bl.fader--top-start {
    transform: translate(0, calc(var(--vert) * -1));
  }

  .js .fader--br {
    transform: translate(0, var(--vert));
  }

  .js .fader--br.fader--top-start {
    transform: translate(0, calc(var(--vert) * -1));
  }
}

.js .fader3:not(.fader--loader, .fader--loading), .js .fader3.fader--loaded {
  opacity: 1;
  transition-duration: var(--move-duration), var(--opacity-duration), var(--move-duration), var(--transition-slow), var(--transition-slow), var(--transition-slow);
  transform: none;
}

.js .fader3:not(.fader--loader, .fader--loading).fader--still, .js .fader3.fader--loaded.fader--still {
  transition-duration: var(--opacity-duration);
}

.js .fader3:not(.fader--loader, .fader--loading).fader--no-fade, .js .fader3.fader--loaded.fader--no-fade {
  transition-duration: 0s;
}

.js .fader3:not(.fader--loader, .fader--loading).fader--clip, .js .fader3:not(.fader--loader, .fader--loading).fader--clip-hor, .js .fader3.fader--loaded.fader--clip, .js .fader3.fader--loaded.fader--clip-hor {
  clip-path: inset(0);
}

.fold-out {
  visibility: hidden;
  opacity: 0;
  width: 100%;
  max-height: 0;
  padding-top: 1px;
  padding-bottom: 1px;
  transition: max-height .6s, opacity .3s, visibility 0s .6s;
  overflow: hidden;
}

.fold-out[style*="max-height"]:not([style*="max-height: 0"]) {
  visibility: visible;
  opacity: 1;
  transition: max-height .6s, opacity .3s .3s, visibility;
}

[data-fo-holder="default"] .fold-out {
  transition-timing-function: var(--transition-easing-quad), ease, ease;
}

[data-fo-holder="default"] .fold-out[style*="max-height"]:not([style*="max-height: 0"]) {
  opacity: 1;
  transition-timing-function: var(--transition-easing-quad), ease, ease;
}

.fold-out--opened {
  visibility: visible;
  opacity: 1;
  max-height: none;
  transition: none;
  overflow: visible;
}

::view-transition-group(history-loader) {
  z-index: 9999;
}

.history-loader {
  --line-thickness: .2rem;
  --line-color: var(--colors-text-one);
  --line-origin: left;
  --z-index: 9999;
  pointer-events: none;
  z-index: var(--z-index);
  opacity: 0;
  width: 100%;
  height: 100%;
  transition: opacity var(--transition-default);
  view-transition-name: history-loader;
  position: fixed;
  top: 0;
  left: 0;
}

.history-loader .history-loader__bg {
  background-color: var(--colors-theme-one);
  width: 100%;
  height: 100%;
  display: none;
  position: absolute;
  top: 0;
  left: 0;
}

.body--two .history-loader .history-loader__bg {
  background-color: var(--colors-theme-two);
}

.history-loader .history-loader__line {
  transform-origin: var(--line-origin);
  width: 100%;
  height: var(--line-thickness);
  background-color: var(--line-color);
  transition-duration: var(--transition-default);
  transition-property: transform, opacity, background-color;
  position: absolute;
  top: 0;
  left: 0;
  transform: scaleX(0);
}

.history-loader[data-status="start"], .history-loader[data-status="animation-done"], .history-loader[data-status="loading-done"], .history-loader[data-status="new-content"] {
  opacity: 1;
}

.history-loader[data-status="start"] .history-loader__line, .history-loader[data-status="animation-done"] .history-loader__line, .history-loader[data-status="loading-done"] .history-loader__line, .history-loader[data-status="new-content"] .history-loader__line {
  transform: scaleX(.5);
}

.history-loader[data-status="end"] .history-loader__line {
  transform: scaleX(1);
}

.hor-scroll {
  --btn-margin: .6em;
  --content-margin: var(--btn-margin);
  --hor-gutter: var(--small-gutter);
  --scrollbar-width: 11px;
  --scrollbar-width-touch: 6px;
  --gradient-width: calc(var(--hor-gutter) * 4);
  --gradient-color: var(--bg-color);
  --margin-bottom: var(--block-padding);
  --gradient-transition-dur: .4s;
  width: calc(100% + var(--hor-gutter) * 2);
  margin: 0 calc(var(--hor-gutter) * -1) calc(var(--margin-bottom) - var(--scrollbar-width));
  padding: 0 calc(var(--content-margin) * 1);
  display: flex;
  position: relative;
}

.hor-scroll:before, .hor-scroll:after {
  display: none !important;
}

.hor-scroll .hor-scroll__content {
  margin: calc(var(--content-margin) * -1) calc(var(--content-margin) * -1) 0;
  padding-right: calc(var(--hor-gutter) - var(--content-margin));
  padding-bottom: calc(var(--scrollbar-width) - var(--content-margin));
  padding-left: calc(var(--hor-gutter) - var(--content-margin));
  flex-wrap: wrap;
  justify-content: flex-start;
  display: flex;
}

.projects-scroll .hor-scroll .hor-scroll__content {
  align-items: flex-end;
}

.hor-scroll[data-center="true"], .hor-scroll[data-center="true"] .hor-scroll__content {
  justify-content: center;
}

.hor-scroll[data-scroll="true"]:before, .hor-scroll[data-scroll="true"]:after {
  pointer-events: none;
  content: "";
  z-index: 1;
  width: var(--gradient-width);
  height: calc(100% - var(--scrollbar-width));
  transition: opacity var(--gradient-transition-dur);
  position: absolute;
  top: 0;
  bottom: 0;
}

.hor-scroll[data-scroll="true"]:before {
  background: linear-gradient(to left, transparent 0%, var(--gradient-color) 100%);
  left: 0;
}

.hor-scroll[data-scroll="true"]:after {
  background: linear-gradient(to right, transparent 0%, var(--gradient-color) 100%);
  right: 0;
}

.hor-scroll[data-scroll="true"][data-left="true"]:before, .hor-scroll[data-scroll="true"][data-right="true"]:after {
  opacity: 0;
}

.hor-scroll[data-scroll="true"] .hor-scroll__content {
  white-space: nowrap;
  overflow: scroll;
  flex-wrap: nowrap !important;
}

.hor-scroll[data-scroll="true"] .hor-scroll__content > * {
  white-space: nowrap;
  flex-shrink: 0;
}

.hor-scroll[data-scroll="true"][data-center="true"] .hor-scroll__content {
  padding-right: calc(var(--hor-gutter));
  padding-left: calc(var(--hor-gutter));
  justify-content: flex-start;
}

.hor-scroll[data-scroll="true"][data-center="true"] .hor-scroll__content > :first-child {
  margin-left: auto;
}

.hor-scroll[data-scroll="true"][data-center="true"] .hor-scroll__content > :last-child {
  margin-right: auto;
}

.hor-scroll[data-mask="true"][data-scroll="true"]:before, .hor-scroll[data-mask="true"][data-scroll="true"]:after {
  content: none;
}

.hor-scroll[data-mask="true"][data-left="true"] .hor-scroll__content {
  mask-image: linear-gradient(to left, transparent 0, black var(--gradient-width));
}

.hor-scroll[data-mask="true"][data-right="true"] .hor-scroll__content {
  mask-image: linear-gradient(to right, transparent 0, black var(--gradient-width));
}

.hor-scroll[data-mask="true"][data-left="true"][data-right="true"] .hor-scroll__content {
  mask-image: none;
}

.hor-scroll[data-mask="true"][data-left="false"][data-right="false"] .hor-scroll__content {
  mask-image: linear-gradient(to right, transparent 0, black var(--gradient-width), black calc(100% - var(--gradient-width)), transparent 100%);
}

.body--touch .hor-scroll {
  margin-bottom: calc(var(--margin-bottom) - var(--scrollbar-width-touch));
}

.body--touch .hor-scroll .hor-scroll__content {
  padding-bottom: calc(var(--scrollbar-width-touch) - var(--content-margin));
}

.body--touch .hor-scroll[data-scroll="true"]:before, .body--touch .hor-scroll[data-scroll="true"]:after {
  height: calc(100% - var(--scrollbar-width-touch));
}

.ar {
  background-color: #eee;
  position: relative;
  overflow: auto;
  display: block !important;
}

.ar:before {
  content: " ";
  float: left;
  width: 0;
  height: 0;
  padding-top: calc(var(--ar-height) / var(--ar-width) * 100%);
  display: block;
}

.ar > img, .ar > video {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.ar--1-1 {
  --ar-width: 1;
  --ar-height: 1;
}

.ar--4-3 {
  --ar-width: 4;
  --ar-height: 3;
}

.ar--16-9 {
  --ar-width: 16;
  --ar-height: 9;
}

@media (width <= 1200px) {
  .ar--4-3 {
    --ar-width: 1;
    --ar-height: 1;
  }
}

@media (width <= 1023px) {
  .ar--4-3 {
    --ar-width: 3;
    --ar-height: 4;
  }
}

@media (width <= 800px) {
  .ar--4-3 {
    --ar-width: 4;
    --ar-height: 3;
  }
}

.hidden {
  display: none !important;
}

.faded {
  opacity: 0;
}

.invisible {
  visibility: hidden;
}

.disabled {
  pointer-events: none;
  opacity: var(--hover-opacity);
}

.img-responsive {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

iframe {
  background: none;
  max-width: 100%;
}

.sprite {
  display: inline-block;
}

.clear:before, .clear:after {
  content: " ";
  display: table;
}

.clear:after {
  clear: both;
}

.text--left {
  text-align: left;
}

.text--right {
  text-align: right;
}

.text--center {
  text-align: center;
}

.text--medium {
  font-size: var(--font-medium);
}

.capitalize {
  text-transform: capitalize;
}

.legibility {
  text-rendering: optimizelegibility;
}

.relative {
  position: relative;
}

.fixed {
  position: fixed;
}

.absolute {
  width: 100%;
  position: absolute;
}

.sticky {
  position: sticky;
  top: 0;
}

@media (width >= 1601px) {
  .visible-xl {
    display: none !important;
  }
}

@media (width <= 1600px) {
  .hidden-xl {
    display: none !important;
  }
}

@media (width >= 1401px) {
  .visible-large {
    display: none !important;
  }
}

@media (width <= 1400px) {
  .hidden-large {
    display: none !important;
  }
}

@media (width >= 1201px) {
  .visible-small {
    display: none !important;
  }
}

@media (width <= 1200px) {
  .hidden-small {
    display: none !important;
  }
}

@media (width >= 1024px) {
  .visible-tablet {
    display: none !important;
  }
}

@media (width <= 1023px) {
  .hidden-tablet {
    display: none !important;
  }
}

@media (width >= 801px) {
  .visible-phablet {
    display: none !important;
  }
}

@media (width <= 800px) {
  .hidden-phablet {
    display: none !important;
  }
}

@media (width >= 600px) {
  .visible-mobile {
    display: none !important;
  }
}

@media (width <= 599px) {
  .hidden-mobile {
    display: none !important;
  }
}

@media (orientation: portrait) {
  .visible-landscape, .hidden-portrait {
    display: none !important;
  }
}

@media (orientation: landscape) {
  .visible-portrait, .hidden-landscape {
    display: none !important;
  }
}

@media (height >= 441px) {
  .visible-mobile-horizontal {
    display: none !important;
  }
}

@media (height <= 440px) {
  .hidden-mobile-horizontal {
    display: none !important;
  }
}

:root {
  --font-family-serif: "ivypresto-display", serif;
  --font-family-sans: "ff-real-text-pro-2", sans-serif;
  --font-family-sans-bold: "ff-real-text-pro", sans-serif;
  --font-family-display: "ff-real-headline-pro", sans-serif;
  --d: 1440;
  --m: 402;
  --font-intro: calc(20 * 1px + (28 - 20) * (100vw - var(--m) * 1px) / (var(--d) - var(--m)));
  --font-normal: calc(26 * 1px + (32 - 26) * (100vw - var(--m) * 1px) / (var(--d) - var(--m)));
  --font-medium: calc(24 * 1px + (40 - 24) * (100vw - var(--m) * 1px) / (var(--d) - var(--m)));
  --font-large: calc(30 * 1px + (52 - 30) * (100vw - var(--m) * 1px) / (var(--d) - var(--m)));
  --font-xl: calc(36 * 1px + (64 - 36) * (100vw - var(--m) * 1px) / (var(--d) - var(--m)));
  --font-xxl: calc(44 * 1px + (80 - 44) * (100vw - var(--m) * 1px) / (var(--d) - var(--m)));
  --font-cq-normal: calc(26 * 1px + (32 - 26) * (100cqw - var(--m) * 1px) / (var(--d) - var(--m)));
  --font-cq-medium: calc(24 * 1px + (40 - 24) * (100cqw - var(--m) * 1px) / (var(--d) - var(--m)));
  --font-cq-large: calc(30 * 1px + (52 - 30) * (100cqw - var(--m) * 1px) / (var(--d) - var(--m)));
  --font-cq-xl: calc(36 * 1px + (64 - 36) * (100cqw - var(--m) * 1px) / (var(--d) - var(--m)));
  --font-cq-xxl: calc(44 * 1px + (80 - 44) * (100cqw - var(--m) * 1px) / (var(--d) - var(--m)));
  --font-small: clamp(11px, .133929vw + 9.07143px, 12.5px);
  --font-book: clamp(13px, .535714vw + 5.28571px, 19px);
  --font-body: clamp(18px, .625vw + 9px, 25px);
  --font-cq-small: clamp(14px, .625cqw + 5px, 21px);
  --font-cq-book: clamp(16px, .714286cqw + 5.71429px, 24px);
  --font-cq-body: clamp(18px, .625cqw + 9px, 25px);
}

@media (width <= 599px) {
  :root {
    --font-body: var(--font-book);
  }
}

b, strong {
  font-family: var(--font-family-sans-bold);
  font-weight: normal;
}

svg, video, img {
  width: 100%;
  height: auto;
}

svg[style*="--ratio"], video[style*="--ratio"], img[style*="--ratio"] {
  aspect-ratio: var(--ratio);
}

@media (width <= 599px) {
  svg[style*="--ratio-mobile"], video[style*="--ratio-mobile"], img[style*="--ratio-mobile"] {
    aspect-ratio: var(--ratio-mobile);
  }
}

a {
  cursor: pointer;
  color: var(--color);
  text-decoration: none;
}

button {
  cursor: pointer;
  color: var(--color);
  background-color: #0000;
  border: 0;
  padding: 0;
  line-height: 1;
}

ul {
  list-style: outside !important;
}

ol {
  list-style: decimal;
}

h1, p, ul, ol {
  line-height: var(--lineheight);
  margin: 0;
}

h1 button:before, h1 a:before, p button:before, p a:before, ul button:before, ul a:before, ol button:before, ol a:before {
  content: "[";
}

h1 button:after, h1 a:after, p button:after, p a:after, ul button:after, ul a:after, ol button:after, ol a:after {
  content: "]";
}

.body--touch h1 button, body:not(.body--touch) h1 button:focus, body:not(.body--touch) h1 button:hover, h1 button.hover, .body--touch h1 a, body:not(.body--touch) h1 a:focus, body:not(.body--touch) h1 a:hover, h1 a.hover, .body--touch p button, body:not(.body--touch) p button:focus, body:not(.body--touch) p button:hover, p button.hover, .body--touch p a, body:not(.body--touch) p a:focus, body:not(.body--touch) p a:hover, p a.hover, .body--touch ul button, body:not(.body--touch) ul button:focus, body:not(.body--touch) ul button:hover, ul button.hover, .body--touch ul a, body:not(.body--touch) ul a:focus, body:not(.body--touch) ul a:hover, ul a.hover, .body--touch ol button, body:not(.body--touch) ol button:focus, body:not(.body--touch) ol button:hover, ol button.hover, .body--touch ol a, body:not(.body--touch) ol a:focus, body:not(.body--touch) ol a:hover, ol a.hover {
  text-decoration: underline;
}

h1 + h1, h1 + p, h1 + ul, h1 + ol, p + h1, p + p, p + ul, p + ol, ul + h1, ul + p, ul + ul, ul + ol, ol + h1, ol + p, ol + ul, ol + ol {
  padding-top: calc(var(--lineheight) * 1em);
}

.text--collaborates-columns h1, .text--columns h1, h1 .text--2-columns, .text--3-columns h1, .text--collaborates-columns p, .text--columns p, p .text--2-columns, .text--3-columns p, .text--collaborates-columns ul, .text--columns ul, ul .text--2-columns, .text--3-columns ul, .text--collaborates-columns ol, .text--columns ol, ol .text--2-columns, .text--3-columns ol {
  break-inside: avoid;
  margin-bottom: calc(var(--lineheight) * 1em);
}

.text--collaborates-columns h1 + p, .text--collaborates-columns h1 + ul, .text--collaborates-columns h1 + ol, .text--columns h1 + p, .text--columns h1 + ul, .text--columns h1 + ol, h1 .text--2-columns + p, h1 .text--2-columns + ul, h1 .text--2-columns + ol, .text--3-columns h1 + p, .text--3-columns h1 + ul, .text--3-columns h1 + ol, .text--collaborates-columns p + p, .text--collaborates-columns p + ul, .text--collaborates-columns p + ol, .text--columns p + p, .text--columns p + ul, .text--columns p + ol, p .text--2-columns + p, p .text--2-columns + ul, p .text--2-columns + ol, .text--3-columns p + p, .text--3-columns p + ul, .text--3-columns p + ol, .text--collaborates-columns ul + p, .text--collaborates-columns ul + ul, .text--collaborates-columns ul + ol, .text--columns ul + p, .text--columns ul + ul, .text--columns ul + ol, ul .text--2-columns + p, ul .text--2-columns + ul, ul .text--2-columns + ol, .text--3-columns ul + p, .text--3-columns ul + ul, .text--3-columns ul + ol, .text--collaborates-columns ol + p, .text--collaborates-columns ol + ul, .text--collaborates-columns ol + ol, .text--columns ol + p, .text--columns ol + ul, .text--columns ol + ol, ol .text--2-columns + p, ol .text--2-columns + ul, ol .text--2-columns + ol, .text--3-columns ol + p, .text--3-columns ol + ul, .text--3-columns ol + ol {
  padding-top: 0;
}

h1 {
  font-family: var(--font-family-sans-bold);
}

button :focus {
  outline: none;
}

@keyframes fade-in-out {
  0% {
    opacity: 1;
  }

  10% {
    opacity: .5;
  }

  20% {
    opacity: 1;
  }

  100% {
    opacity: 1;
  }
}

address {
  font-style: normal;
}

label {
  min-width: 0;
}

input[type="checkbox"] {
  vertical-align: middle;
  margin-right: .5em;
}

textarea, select, input[type="text"], input[type="time"], input[type="date"], input[type="month"], input[type="email"], input[type="password"], input[type="tel"], input[type="number"], input[type="url"], input[type="submit"] {
  width: auto;
  min-height: 1.7em;
  color: var(--color);
  background-color: var(--bg-color);
  transition: border-color var(--speed);
  border: none;
  border-radius: 0;
  padding: 0;
  line-height: 1.3;
}

textarea::placeholder, select::placeholder, input[type="text"]::placeholder, input[type="time"]::placeholder, input[type="date"]::placeholder, input[type="month"]::placeholder, input[type="email"]::placeholder, input[type="password"]::placeholder, input[type="tel"]::placeholder, input[type="number"]::placeholder, input[type="url"]::placeholder, input[type="submit"]::placeholder {
  color: var(--color);
  opacity: 1;
  text-decoration: underline;
}

body:not(.body--touch) textarea:focus::placeholder, body:not(.body--touch) select:focus::placeholder, body:not(.body--touch) input[type="text"]:focus::placeholder, body:not(.body--touch) input[type="time"]:focus::placeholder, body:not(.body--touch) input[type="date"]:focus::placeholder, body:not(.body--touch) input[type="month"]:focus::placeholder, body:not(.body--touch) input[type="email"]:focus::placeholder, body:not(.body--touch) input[type="password"]:focus::placeholder, body:not(.body--touch) input[type="tel"]:focus::placeholder, body:not(.body--touch) input[type="number"]:focus::placeholder, body:not(.body--touch) input[type="url"]:focus::placeholder, body:not(.body--touch) input[type="submit"]:focus::placeholder {
  color: #fff;
  opacity: 0;
}

body:not(.body--touch) textarea:focus, body:not(.body--touch) textarea:hover, textarea.hover, body:not(.body--touch) select:focus, body:not(.body--touch) select:hover, select.hover, body:not(.body--touch) input[type="text"]:focus, body:not(.body--touch) input[type="text"]:hover, input[type="text"].hover, body:not(.body--touch) input[type="time"]:focus, body:not(.body--touch) input[type="time"]:hover, input[type="time"].hover, body:not(.body--touch) input[type="date"]:focus, body:not(.body--touch) input[type="date"]:hover, input[type="date"].hover, body:not(.body--touch) input[type="month"]:focus, body:not(.body--touch) input[type="month"]:hover, input[type="month"].hover, body:not(.body--touch) input[type="email"]:focus, body:not(.body--touch) input[type="email"]:hover, input[type="email"].hover, body:not(.body--touch) input[type="password"]:focus, body:not(.body--touch) input[type="password"]:hover, input[type="password"].hover, body:not(.body--touch) input[type="tel"]:focus, body:not(.body--touch) input[type="tel"]:hover, input[type="tel"].hover, body:not(.body--touch) input[type="number"]:focus, body:not(.body--touch) input[type="number"]:hover, input[type="number"].hover, body:not(.body--touch) input[type="url"]:focus, body:not(.body--touch) input[type="url"]:hover, input[type="url"].hover, body:not(.body--touch) input[type="submit"]:focus, body:not(.body--touch) input[type="submit"]:hover, input[type="submit"].hover {
  --speed: var(--transition-fast);
}

textarea.hover, select.hover, input[type="text"].hover, input[type="time"].hover, input[type="date"].hover, input[type="month"].hover, input[type="email"].hover, input[type="password"].hover, input[type="tel"].hover, input[type="number"].hover, input[type="url"].hover, input[type="submit"].hover {
  --speed: .1s;
}

input[type="submit"]:before {
  content: "[";
}

input[type="submit"]:after {
  content: "]";
}

input[type="time"]::-webkit-date-and-time-value {
  text-align: left;
}

input[type="date"]::-webkit-date-and-time-value {
  text-align: left;
}

html {
  scrollbar-gutter: stable;
  box-sizing: border-box;
  height: var(--inner-height);
  font-size: 62.5% !important;
}

.body {
  --underline-width: 1px;
  --underline-top: calc(50% + .48em);
  --shadow-width: .075em;
  --bold: 600;
  font-family: var(--font-family-sans);
  --lineheight: 1.3;
  font-size: var(--font-book);
  font-kerning: normal;
  height: auto;
  min-height: 100%;
  color: var(--color);
  word-break: break-word;
  overflow-wrap: break-word;
  background-color: var(--bg-color);
  -webkit-tap-highlight-color: transparent;
  line-height: 1;
  display: block;
  overflow: hidden auto;
}

.body:not(.body--interacted, [data-pagetype="project"], [data-pagetype="reader"]):has(.fs-video) {
  --color: var(--colors-text-two);
}

.body--touch {
  cursor: pointer;
}

.ratio {
  width: 100%;
  height: 0;
  padding-bottom: var(--percentage);
  background-position: center;
  background-size: cover;
  display: block;
  position: relative;
  overflow: hidden;
}

.ratio--2-1 {
  padding-bottom: 50%;
}

.ratio--16-9 {
  padding-bottom: 56.25%;
}

.ratio--3-2 {
  padding-bottom: 66.66%;
}

.ratio--4-3 {
  padding-bottom: 75%;
}

.ratio--1-1 {
  padding-bottom: 100%;
}

.ratio--3-4 {
  padding-bottom: 133.33%;
}

.ratio--4-5 {
  padding-bottom: 125%;
}

.ratio img, .ratio video {
  object-fit: cover;
  width: 100%;
  position: absolute;
  height: 100% !important;
}

.ratio--placeholder {
  position: initial;
}

.ratio--placeholder img, .ratio--placeholder video {
  position: initial;
  object-fit: initial;
  height: auto !important;
}

.ratio--cover img, .ratio--cover video {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.ratio--contain img, .ratio--contain video {
  border-radius: var(--border-radius);
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 100%;
}

.ratio--aspect-ratio {
  aspect-ratio: var(--ar);
  height: auto;
}

.ratio .ratio__holder {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
}

.ratio .ratio__overlay {
  opacity: 0;
  background-color: var(--colors-bg-two);
  width: 100%;
  height: 100%;
  transition: opacity var(--transition-slow);
  position: absolute;
}

.ratio .ratio__overlay--visible {
  opacity: 1;
}

.ratio .ratio__overlay .ratio__text {
  color: var(--colors-text-two);
  padding: 1.8rem 2.6rem;
}

@media (width <= 1023px) {
  .ratio .ratio__overlay .ratio__text {
    padding: 1.1rem var(--padding);
  }
}

@media (width <= 800px) {
  .columns__item--1-1 .ratio--16-9 {
    padding-bottom: 100%;
  }
}

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

.chromeframe {
  z-index: 1000;
  box-sizing: border-box;
  background-color: var(--colors-theme-one);
  width: 100%;
  padding: 20px;
  font-weight: bold;
  position: fixed;
  bottom: 0;
}

blockquote, figure {
  margin: 0;
  padding: 0;
}

cite {
  font-style: normal;
}

input[type="text"], input[type="time"], input[type="date"], input[type="month"], input[type="email"], input[type="password"], input[type="tel"], input[type="number"], input[type="url"], input[type="submit"] {
  color: var(--colors);
  appearance: none;
  word-break: normal;
  border-radius: 0;
}

input[type="text"]:placeholder-shown, input[type="time"]:placeholder-shown, input[type="date"]:placeholder-shown, input[type="month"]:placeholder-shown, input[type="email"]:placeholder-shown, input[type="password"]:placeholder-shown, input[type="tel"]:placeholder-shown, input[type="number"]:placeholder-shown, input[type="url"]:placeholder-shown, input[type="submit"]:placeholder-shown {
  text-overflow: ellipsis;
}

textarea, select {
  color: var(--colors);
  appearance: none;
  border-radius: 0;
}

::selection {
  color: var(--bg-color);
  text-shadow: none;
  background: var(--color);
}

:focus {
  outline-style: none;
  outline-color: #0000;
}

.bg {
  --speed: var(--transition-fast);
  pointer-events: none;
  width: 100%;
  height: calc(var(--nav-height) - var(--padding));
  background-color: var(--bg-color);
  transition: transform var(--speed) var(--transition-easing);
  position: absolute;
}

.bg:after {
  content: none;
  z-index: -1;
  width: 100%;
  height: calc(var(--padding) * 2);
  background: linear-gradient(to bottom, color-mix(in srgb, var(--bg-color) 100%, transparent) 0%, color-mix(in srgb, var(--bg-color) 98.7%, transparent) 8.1%, color-mix(in srgb, var(--bg-color) 95.1%, transparent) 15.5%, color-mix(in srgb, var(--bg-color) 89.6%, transparent) 22.5%, color-mix(in srgb, var(--bg-color) 82.5%, transparent) 29%, color-mix(in srgb, var(--bg-color) 74.1%, transparent) 35.3%, color-mix(in srgb, var(--bg-color) 64.8%, transparent) 41.2%, color-mix(in srgb, var(--bg-color) 55%, transparent) 47.1%, color-mix(in srgb, var(--bg-color) 45%, transparent) 52.9%, color-mix(in srgb, var(--bg-color) 35.2%, transparent) 58.8%, color-mix(in srgb, var(--bg-color) 25.9%, transparent) 64.7%, color-mix(in srgb, var(--bg-color) 17.5%, transparent) 71%, color-mix(in srgb, var(--bg-color) 10.4%, transparent) 77.5%, color-mix(in srgb, var(--bg-color) 4.9%, transparent) 84.5%, color-mix(in srgb, var(--bg-color) 1.3%, transparent) 91.9%, color-mix(in srgb, var(--bg-color) 0%, transparent) 100%);
  position: absolute;
  top: calc(100% - 1px);
  left: 0;
}

.body:not([data-pagetype="project"], [data-pagetype="reader"]) .bg--nav {
  view-transition-name: bg-nav;
}

.body--show-scroll-nav .bg--nav {
  transform: translateY(-100%);
}

.bg--scroll {
  transform: translateY(calc(var(--scroll-nav-height) * -1));
  height: var(--scroll-nav-height);
  position: fixed;
  top: 0;
}

.body:not([data-pagetype="project"], [data-pagetype="reader"]) .bg--scroll {
  view-transition-name: bg-scroll;
}

.body--show-scroll-nav.body--scrolling-up .bg--scroll {
  transform: none;
}

.bg--footer {
  transform: translateY(calc(100% + var(--padding) * 2));
  height: calc(var(--footer-height));
  transition: transform var(--speed) var(--transition-easing);
  position: fixed;
  bottom: 0;
}

.bg--footer:after {
  top: auto;
  bottom: calc(100% - 1px);
  transform: rotate(180deg);
}

.body:not([data-pagetype="project"], [data-pagetype="reader"]) .bg--footer {
  view-transition-name: bg-bottom;
}

.body--first-interaction.body--at-top[data-pagetype="home"] .bg--footer, .body--scrolling-down.body--show-scroll-nav[data-pagetype="home"] .bg--footer, .body--at-bottom[data-pagetype="home"] .bg--footer {
  transform: none;
}

.bg--project {
  display: none;
}

.bg--project-bottom {
  view-transition-name: unset !important;
}

@media (width <= 800px) {
  .bg--project {
    --bg-color: var(--colors-bg-three);
    pointer-events: auto;
    z-index: 11;
    height: calc(var(--padding) * 1.5 + 100px);
    margin-top: -100px;
    margin-bottom: calc(var(--padding) * .5);
    view-transition-name: unset;
    flex-shrink: 0;
    display: block;
    position: sticky;
    top: -100px;
  }

  .bg--project:after {
    pointer-events: none;
    content: "";
  }

  .bg--project-bottom {
    z-index: 0;
    height: calc(var(--padding) * 2 + 4.5em);
    margin-bottom: -100px;
    position: sticky;
    bottom: -100px;
    transform: none;
  }

  .bg--project-bottom:after {
    content: "";
  }
}

@media (width <= 599px) {
  .body--at-bottom[data-pagetype="home"] .bg--bottom {
    transform: translateY(calc(100% + var(--padding) * 2)) !important;
  }
}

.bottom {
  --speed: var(--transition-fast);
  pointer-events: none;
  width: 100%;
  padding: var(--padding) var(--gutter);
  transition: opacity var(--speed);
  justify-content: space-between;
  align-items: center;
  display: flex;
  position: fixed;
  bottom: 0;
}

.body:not([data-pagetype="project"], [data-pagetype="reader"]) .bottom {
  view-transition-name: bottom;
}

body:not(.body--interacted, [data-pagetype="project"], [data-pagetype="reader"]) .bottom {
  opacity: 0;
}

.bottom .bottom__up {
  pointer-events: auto;
  width: 2em;
  transition: opacity var(--transition-default), visibility 0s 0s;
  display: flex;
}

.body--at-top .bottom .bottom__up {
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  transition: opacity var(--transition-default), visibility 0s var(--transition-default);
}

.body--no-scroll .bottom .bottom__up {
  display: none;
}

.bottom .bottom__up svg {
  width: auto;
  transition: transform var(--speed) var(--transition-easing);
}

.bottom .bottom__up--active svg, .bottom .bottom__up.hover svg, body:not(.body--touch) .bottom .bottom__up:focus svg, body:not(.body--touch) .bottom .bottom__up:hover svg {
  --speed: var(--transition-fast);
  transform: translateY(-.5rem);
}

@media (width <= 599px) {
  body:not(.body--at-bottom) .bottom .bottom__up {
    pointer-events: none;
    visibility: hidden;
    opacity: 0;
    transition: opacity var(--transition-default), visibility 0s var(--transition-default);
  }
}

.buttons {
  --btn-margin: .25em;
  width: calc(100% + var(--btn-margin) * 2);
  margin: calc(var(--btn-margin) * -1);
  flex-wrap: wrap;
  display: flex;
}

.column {
  width: 100%;
  padding-right: var(--gutter);
  padding-left: var(--gutter);
  flex-direction: column;
  align-items: center;
  display: flex;
  container-type: inline-size;
}

.columns {
  --columns-gutter: var(--gutter);
  width: 100%;
  max-width: 1280px;
  padding: 0 calc(var(--columns-gutter) / -2 + var(--gutter));
  background-color: #ddd;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.columns--neg-margins {
  width: calc(100% + var(--gutter) * 2);
  max-width: none;
  margin-right: calc(-1 * var(--gutter));
  margin-left: calc(-1 * var(--gutter));
}

.columns--between {
  justify-content: space-between;
}

.columns--center {
  justify-content: center;
}

.columns--end {
  justify-content: flex-end;
}

.columns--clean {
  padding: 0;
}

.columns--hidden {
  display: none;
}

.columns--half-gutter {
  --columns-gutter: calc(var(--gutter) * .5);
}

.columns--no-gutter {
  --columns-gutter: calc(0px);
}

.columns--vert-center {
  align-items: center;
}

.columns--vert-stretch {
  align-items: stretch;
}

.columns--vert-stretch .columns__item > :first-child:last-child {
  height: 100%;
}

.columns .columns__item {
  --fraction: 1;
  width: calc(100% * var(--fraction) - var(--columns-gutter));
  max-width: calc(100% * var(--fraction) - var(--columns-gutter));
  min-height: 2rem;
  margin-right: calc(var(--columns-gutter) / 2);
  margin-left: calc(var(--columns-gutter) / 2);
  background-color: #ccc;
  container-type: inline-size;
}

.columns .columns__item--1-2 {
  --fraction: 1 / 2;
}

.columns .columns__item--1-3 {
  --fraction: 1 / 3;
}

.columns .columns__item--2-3 {
  --fraction: 2 / 3;
}

.columns .columns__item--1-4 {
  --fraction: 1 / 4;
}

.columns .columns__item--3-4 {
  --fraction: 3 / 4;
}

.columns .columns__item--1-5 {
  --fraction: 1 / 5;
}

.columns .columns__item--2-5 {
  --fraction: 2 / 5;
}

.columns .columns__item--3-5 {
  --fraction: 3 / 5;
}

.columns .columns__item--4-5 {
  --fraction: 4 / 5;
}

.columns .columns__item--1-6 {
  --fraction: 1 / 6;
}

.columns .columns__item--5-6 {
  --fraction: 5 / 6;
}

.columns .columns__item--1-12 {
  --fraction: 1 / 12;
}

.columns .columns__item--5-12 {
  --fraction: 5 / 12;
}

@media (width <= 1023px) {
  .columns .columns__item--1-4, .columns .columns__item--1-3 {
    --fraction: 1 / 2;
  }

  .columns .columns__item--4-5, .columns .columns__item--3-5, .columns .columns__item--3-4, .columns .columns__item--2-3, .columns .columns__item--1-2 {
    --fraction: 1;
  }
}

@media (width <= 599px) {
  .columns .columns__item--5-12, .columns .columns__item--5-6, .columns .columns__item--2-5, .columns .columns__item--3-5, .columns .columns__item--4-5, .columns .columns__item--3-4, .columns .columns__item--1-3 {
    --fraction: 1;
  }

  .columns .columns__item--1-6, .columns .columns__item--1-5, .columns .columns__item--1-4 {
    --fraction: 1 / 2;
  }

  .columns .columns__item--1-12 {
    --fraction: 1 / 4;
  }
}

@media (width <= 374px) {
  .columns .columns__item--1-4 {
    --fraction: 1;
  }
}

.detail {
  overscroll-behavior: contain;
  width: 100%;
  height: calc(var(--inner-height) - var(--padding) * 2);
  overflow: hidden scroll;
}

.detail .detail__scroll {
  min-height: calc(var(--inner-height) - var(--padding) * 2);
  display: flex;
}

.detail .detail__blocks, .detail .detail__info {
  padding: 0 var(--padding);
  color: var(--color);
  background-color: var(--bg-color);
}

.detail .detail__content {
  gap: var(--padding) 0;
  padding: var(--padding) 0;
  flex-direction: column;
  display: flex;
  position: relative;
}

.detail .detail__content--vert-center {
  justify-content: center;
  align-items: center;
  max-width: 20em;
  min-height: 100%;
  margin: 0 auto;
}

.detail .detail__blocks {
  --bg-color: var(--colors-bg-three);
  --color: var(--colors-text-one);
  width: 60%;
}

.detail .detail__info {
  --bg-color: var(--colors-bg-two);
  --color: var(--colors-text-two);
  flex-direction: column;
  flex-shrink: 0;
  width: 40%;
  min-width: 40rem;
  display: flex;
}

.detail .detail__info .detail__info-close {
  margin: calc(var(--padding) * .5) calc(var(--padding) * -.5) calc(var(--padding) * -.25) 0;
  align-self: flex-end;
}

body:not(.body--touch) .detail .detail__info .detail__info-close:focus, body:not(.body--touch) .detail .detail__info .detail__info-close:hover, .detail .detail__info .detail__info-close.hover {
  text-decoration: underline;
}

.detail .detail__info .detail__content {
  top: min(-1px, var(--inner-height) - var(--element-height) - var(--padding) * 2);
  padding-top: calc(var(--padding) * 1);
  position: sticky;
}

@media (width <= 800px) {
  .detail {
    --bg-color: var(--colors-bg-three);
    height: calc(var(--inner-height) - var(--padding) * 2);
    background-color: var(--bg-color);
    border-radius: 3rem 3rem 0 0;
  }

  .detail--touching {
    will-change: transform;
  }

  .detail--animating-back {
    transition: transform var(--transition-default) var(--transition-easing);
    transform: translateY(0) !important;
  }

  .detail--animating-away {
    transition-property: transform;
    transform: translateY(100%);
  }

  .detail .detail__scroll {
    flex-direction: column;
    align-items: center;
  }

  .detail .detail__scroll:before {
    pointer-events: none;
    content: "";
    z-index: 12;
    top: var(--padding);
    opacity: .5;
    background-color: var(--colors-bg-two);
    border-radius: 10rem;
    flex-shrink: 0;
    width: 4em;
    height: 5px;
    position: sticky;
  }

  .detail .detail__content--vert-center {
    min-height: calc(var(--inner-height) - var(--padding) * 6.5);
  }

  .detail .detail__blocks {
    --bg-color: transparent;
    width: 100%;
    padding-bottom: calc(var(--padding) * 2);
  }

  .detail .detail__info {
    --bg-color: transparent;
    --color: var(--colors-text-one);
    width: 100%;
    min-width: 0;
    padding-top: 0;
  }
}

.footer {
  --speed: var(--transition-fast);
  pointer-events: none;
  bottom: calc(var(--bottom-height) * -1);
  width: 100%;
  height: var(--bottom-height);
  padding: 0 var(--gutter);
  padding-left: calc(var(--toggle-width) + var(--gutter) * 1.8);
  visibility: hidden;
  transition: transform var(--speed) var(--transition-easing), opacity var(--speed), visibility 0s var(--transition-default);
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  display: flex;
  position: fixed;
  transform: none;
}

body:not([data-pagetype="project"], [data-pagetype="reader"]) .footer {
  view-transition-name: footer;
}

body:not(.body--interacted, [data-pagetype="project"], [data-pagetype="reader"]) .footer {
  opacity: 0;
}

.body--first-interaction.body--at-top[data-pagetype="home"] .footer, .body--scrolling-down.body--show-scroll-nav[data-pagetype="home"] .footer, .body--at-bottom[data-pagetype="home"] .footer {
  visibility: visible;
  transition: transform var(--speed) var(--transition-easing), opacity var(--speed), visibility 0s 0s;
  transform: translateY(-100%);
}

.footer .footer__btn {
  pointer-events: auto;
  margin-top: -.1em;
  margin-left: .3em;
  text-decoration: underline;
  position: relative;
}

.footer .footer__btn--bogdan {
  --underline-width: .06em;
  --underline-top: calc(50% + .48em);
  --shadow-width: .075em;
  --bold: 600;
  font-family: var(--font-family-serif);
  font-weight: var(--bold);
}

body:not(.body--touch) .footer .footer__btn:focus, body:not(.body--touch) .footer .footer__btn:hover {
  text-decoration: none;
}

@media (width <= 599px) {
  .footer {
    justify-content: space-between;
    gap: 0;
  }

  .body--at-bottom[data-pagetype="home"] .footer {
    transform: none !important;
  }

  .footer .footer__btn--bogdan, .footer .footer__separator {
    display: none;
  }
}

.fs-video {
  pointer-events: none;
  opacity: 0;
  width: 100%;
  height: 100%;
  transition: opacity var(--transition-default), visibility 0s var(--transition-default);
  position: fixed;
  top: 0;
  left: 0;
}

.body:not(.body--interacted, [data-pagetype="project"], [data-pagetype="reader"]) .fs-video {
  visibility: visible;
  opacity: 1;
  transition: opacity var(--transition-default), visibility 0s 0s;
}

.body--interacted .fs-video {
  visibility: hidden;
}

.fs-video video {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.grid {
  gap: var(--padding) 0;
  width: 100%;
  transition: opacity var(--speed);
  grid-auto-rows: auto;
  align-items: start;
  display: grid;
}

.grid--faded-out {
  opacity: 0;
}

.grid--projects {
  grid-template-columns: repeat(auto-fill, minmax(15em, 1fr));
}

.body--table .grid--projects {
  display: none;
}

.body--touch .grid--projects {
  grid-template-columns: repeat(auto-fill, minmax(21em, 1fr));
}

body:not(.body--interacted, [data-pagetype="project"], [data-pagetype="reader"]) .grid--collaborators, body:not(.body--interacted, [data-pagetype="project"], [data-pagetype="reader"]) .grid--projects, body:not(.body--interacted, [data-pagetype="project"], [data-pagetype="reader"]) .grid--team {
  pointer-events: none;
  opacity: 0;
}

.grid--contact-projects, .grid--reader, .grid--related {
  grid-template-columns: repeat(auto-fill, minmax(12em, 1fr));
}

.grid--team {
  grid-template-columns: repeat(auto-fill, minmax(19em, 1fr));
}

.grid--collaborators {
  grid-template-columns: repeat(auto-fill, minmax(26em, 1fr));
}

.grid--reader {
  view-transition-name: grid-reader;
}

.grid--related {
  view-transition-name: grid-related;
}

.grid .grid__cell {
  gap: var(--padding) 0;
  flex-direction: column;
  display: flex;
}

.grid--contact {
  gap: var(--padding) calc(var(--padding) * .5);
  padding-right: calc(var(--padding) * .5);
  grid-template-columns: repeat(3, 1fr);
}

.grid--contact .grid__cell {
  gap: calc(var(--lineheight) * 1em) 0;
}

@media (width <= 1023px) {
  .grid--contact {
    gap: var(--padding) calc(var(--padding) * .5 - var(--block-padding));
    grid-template-columns: repeat(2, 1fr);
  }

  .grid--contact > :nth-child(2) {
    grid-row-start: 2;
    grid-column-start: 1;
  }

  .grid--contact > :nth-child(3) {
    grid-row: 1 / span 2;
    grid-column-start: 2;
  }
}

@media (width <= 599px) {
  .grid--projects {
    grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));
    display: none;
  }

  .grid--projects:has(.item--categories-hidden, .item--applications-hidden, .item--statuses-hidden, .item--themes-hidden, .item--values-hidden, .item--activities-hidden, .item--search-hidden) {
    display: grid;
  }

  .body--table .grid--projects:has(.item--categories-hidden, .item--applications-hidden, .item--statuses-hidden, .item--themes-hidden, .item--values-hidden, .item--activities-hidden, .item--search-hidden) {
    display: none;
  }

  .grid--contact {
    grid-template-columns: 1fr;
    padding-right: 0;
  }

  .grid--contact > :nth-child(2), .grid--contact > :nth-child(3) {
    grid-column-start: initial;
    grid-row-start: initial;
  }

  .grid--contact-projects {
    display: none;
  }

  .grid--team {
    grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));
  }
}

@media (width <= 374px) {
  .grid--team {
    grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));
  }
}

.info {
  flex-direction: column;
  display: flex;
}

.info--reader {
  view-transition-name: info-reader;
}

.info--related {
  view-transition-name: info-related;
}

.info .info__item {
  justify-content: space-between;
  align-items: flex-start;
  gap: 0 1em;
  width: 100%;
  display: flex;
  position: relative;
}

.info .info__item--low-margin, .info .info__item--margin {
  align-items: baseline;
}

.info .info__item--low-margin:not(:last-child) {
  margin-bottom: calc(var(--padding) * .5);
}

.info .info__item--margin:not(:last-child) {
  margin-bottom: var(--padding);
}

.info .info__item--line {
  border-bottom: .5px solid var(--color);
  line-height: var(--lineheight);
  padding: .15em 0;
}

.info .info__item .info__item-side {
  text-wrap: balance;
}

.info .info__item .info__item-side--bold {
  font-family: var(--font-family-sans-bold);
}

.info .info__item .info__item-side--link.hover, body:not(.body--touch) .info .info__item .info__item-side--link:focus, body:not(.body--touch) .info .info__item .info__item-side--link:hover {
  text-decoration: underline;
}

.info .info__item .info__item-side--no-shrink {
  flex-shrink: 0;
}

.info .info__item .info__item-side:last-child {
  text-align: right;
}

.main {
  gap: var(--padding) 0;
  min-height: calc(var(--window-height) - var(--nav-height) - var(--padding));
  padding-bottom: var(--footer-height);
  flex-direction: column;
  align-items: center;
  display: flex;
}

body[data-pagetype="home"] .main {
  justify-content: space-between;
}

.body--no-view-transitions .main {
  transition: opacity var(--transition-default);
}

.html--loader .body--no-view-transitions .main {
  opacity: 0;
}

.nav {
  --speed: var(--transition-fast);
  width: 100%;
  padding: var(--padding) var(--gutter);
  transition: transform var(--speed) var(--transition-easing);
  position: relative;
}

.body--no-view-transitions .nav {
  transition: transform var(--transition-default) var(--transition-easing);
}

.nav .nav__content {
  --underline-width: .06em;
  --underline-top: calc(50% + .48em);
  --shadow-width: .075em;
  --bold: 600;
  font-family: var(--font-family-serif);
  --lineheight: 1.5;
  font-size: var(--font-normal);
  margin: calc((var(--lineheight) - 1) * -.5em - .1em) -.05em;
  line-height: var(--lineheight);
  margin-bottom: 0;
}

.nav .nav__content .nav__section .nav__topic {
  font-size: 0;
}

.nav .nav__content .nav__section .nav__after--colon {
  display: none;
}

.nav .nav__content .nav__section .nav__block {
  --extra-height: .4em;
  width: 0;
  height: calc(1em + var(--extra-height));
  margin: calc(var(--extra-height) * -.5) 0;
  font-size: var(--font-normal);
  white-space: nowrap;
  transition: width linear, margin-right linear;
  transition-duration: var(--transition-slow);
  position: relative;
  top: .05em;
  overflow: hidden;
}

.nav .nav__content .nav__section--visible .nav__after--colon {
  display: inline;
}

.nav .nav__content .nav__section--visible .nav__block {
  width: var(--block-width);
  transition-duration: var(--transition-fast);
  margin-right: .25em;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="0"] {
  transition-delay: 0s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="1"] {
  transition-delay: .15s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="2"] {
  transition-delay: .3s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="3"] {
  transition-delay: .45s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="4"] {
  transition-delay: .6s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="5"] {
  transition-delay: .75s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="6"] {
  transition-delay: .9s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="7"] {
  transition-delay: 1.05s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="8"] {
  transition-delay: 1.2s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="9"] {
  transition-delay: 1.35s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="10"] {
  transition-delay: 1.5s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="11"] {
  transition-delay: 1.65s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="12"] {
  transition-delay: 1.8s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="13"] {
  transition-delay: 1.95s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="14"] {
  transition-delay: 2.1s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="15"] {
  transition-delay: 2.25s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="16"] {
  transition-delay: 2.4s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="17"] {
  transition-delay: 2.55s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="18"] {
  transition-delay: 2.7s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="19"] {
  transition-delay: 2.85s;
}

.nav .nav__content .nav__section--visible .nav__block[data-index="20"] {
  transition-delay: 3s;
}

.nav .nav__content .nav__block {
  display: inline-block;
}

.nav .nav__content .nav__item, .nav .nav__content .nav__before, .nav .nav__content .nav__after, .nav .nav__content .nav__ampersand {
  transition: opacity var(--speed);
}

.nav .nav__content .nav__item {
  pointer-events: auto;
  cursor: pointer;
  text-decoration: underline;
  text-decoration-thickness: var(--underline-width);
  text-underline-offset: .1em;
}

.nav .nav__content .nav__item--reader {
  --pulse: .1;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  display: inline-flex;
  position: relative;
}

.nav .nav__content .nav__item--reader .nav__item-label {
  text-decoration: underline;
  text-decoration-thickness: var(--underline-width);
  text-underline-offset: .1em;
}

.nav .nav__content .nav__item--bogdan {
  pointer-events: none;
  text-decoration: none;
}

body:not([data-pagetype="home"]) .nav .nav__content .nav__item--bogdan, .body--filtered .nav .nav__content .nav__item--bogdan, .body:not(.body--at-top) .nav .nav__content .nav__item--bogdan {
  pointer-events: auto;
  text-decoration: underline;
  text-decoration-thickness: var(--underline-width);
  text-underline-offset: .1em;
}

.nav .nav__content .nav__item--search {
  background: none;
  border: 0;
  min-width: 3.14em;
  min-height: 1em;
  margin: 0 -.2em;
  padding: 0 .2em;
  display: inline-block;
}

.nav .nav__content .nav__item--search::placeholder {
  color: var(--color);
  opacity: 1;
}

.nav .nav__content .nav__item--search:focus::placeholder {
  opacity: var(--hover-opacity);
}

.nav .nav__content .nav__item.hover, body:not(.body--touch) .nav .nav__content .nav__item:focus, body:not(.body--touch) .nav .nav__content .nav__item:hover, .nav .nav__content .nav__item.hover .nav__item-label, body:not(.body--touch) .nav .nav__content .nav__item:focus .nav__item-label, body:not(.body--touch) .nav .nav__content .nav__item:hover .nav__item-label {
  text-decoration: none;
}

.nav .nav__content .nav__item .nav__item-counter {
  display: none;
}

.nav .nav__content .nav__item .nav__item-counter[data-total]:not([data-total="[0]"]) {
  align-self: flex-start;
  margin-left: .2em;
  margin-right: -.2em;
  font-size: .5em;
  display: inline-block;
  position: relative;
  top: 0;
  text-decoration: none !important;
}

.nav .nav__content .nav__item .nav__item-counter[data-total]:not([data-total="[0]"]):before {
  content: attr(data-total);
}

.nav .nav__content .nav__before {
  margin-right: -.2em;
}

.nav .nav__content .nav__after {
  margin-left: -.2em;
}

.body:not([data-pagetype="project"], [data-pagetype="reader"]) .nav--top {
  view-transition-name: nav-top;
}

.nav--top .nav__content .nav__topic:not(.nav__topic--single) {
  transition: opacity var(--speed);
}

.nav--top .nav__content .nav__topic:not(.nav__topic--single):has(.nav__item--active) .nav__item, .nav--top .nav__content .nav__topic:not(.nav__topic--single):has(.nav__item--active) .nav__before, .nav--top .nav__content .nav__topic:not(.nav__topic--single):has(.nav__item--active) .nav__after, .nav--top .nav__content .nav__topic:not(.nav__topic--single):has(.nav__item--active) .nav__ampersand {
  opacity: var(--hover-opacity);
}

.nav--top .nav__content .nav__topic:not(.nav__topic--single):has(.nav__item--active) .nav__item--active, .nav--top .nav__content .nav__topic:not(.nav__topic--single):has(.nav__item--active) .nav__item[aria-current="page"], .nav--top .nav__content .nav__topic:not(.nav__topic--single):has(.nav__item--active) .nav__item.hover, body:not(.body--touch) .nav--top .nav__content .nav__topic:not(.nav__topic--single):has(.nav__item--active) .nav__item:focus, body:not(.body--touch) .nav--top .nav__content .nav__topic:not(.nav__topic--single):has(.nav__item--active) .nav__item:hover {
  opacity: 1;
}

.nav--top .nav__content:has(.nav__item--active[data-tax="activities"]) .nav__topic:not(:has(.nav__item[data-tax="activities"])), .nav--top .nav__content:has(.nav__item--active[data-tax="values"]) .nav__topic:not(:has(.nav__item[data-tax="values"])) {
  opacity: var(--hover-opacity);
}

.nav--scroll {
  visibility: hidden;
  transition: transform var(--speed) var(--transition-easing), visibility 0s var(--transition-default);
  position: fixed;
  top: 0;
  transform: translateY(-100%);
}

.body:not([data-pagetype="project"], [data-pagetype="reader"]) .nav--scroll {
  view-transition-name: nav-scroll;
}

.body--show-scroll-nav.body--scrolling-up .nav--scroll {
  visibility: visible;
  transition: transform var(--speed) var(--transition-easing), visibility 0s 0s;
  transform: none;
}

.nav--scroll .nav__content .nav__topic:not(.nav__topic--single) .nav__block {
  display: none;
}

.nav--scroll .nav__content .nav__topic:not(.nav__topic--single) .nav__block:has(.nav__item--active) {
  display: inline-block;
}

.nav--scroll .nav__content .nav__topic--single {
  display: none;
}

.nav--scroll .nav__content .nav__topic--single:has(.nav__item--active) {
  display: inline-block;
}

@media (width <= 599px) {
  .nav .nav__content {
    --lineheight: 1.3;
  }

  .nav .nav__content .nav__section .nav__block {
    top: .15em;
  }
}

.projects-scroll {
  --color: var(--colors-text-one);
  --small-gutter: var(--block-padding);
  width: 100%;
  padding: 0 var(--small-gutter);
  color: var(--color);
}

.popover .projects-scroll {
  --small-gutter: var(--gutter);
  z-index: 11;
  margin-top: auto;
  position: sticky;
  bottom: 0;
}

.table {
  transition: opacity var(--speed);
  padding-bottom: 1px;
  display: none;
  position: relative;
}

.table:after {
  content: "";
  background-color: var(--color);
  width: 100%;
  height: 1px;
  display: block;
  position: absolute;
  bottom: 0;
}

.table--faded-out {
  opacity: 0;
}

body:not(.body--interacted, [data-pagetype="project"], [data-pagetype="reader"]) .table {
  pointer-events: none;
  opacity: 0;
}

.body--table .table {
  width: 100%;
  margin-bottom: var(--block-padding);
  flex-direction: column;
  display: flex;
  overflow: hidden;
}

.table .table__row {
  --speed: var(--transition-slow);
  border-top: 1px solid var(--color);
  align-items: center;
  min-height: calc(2em + 1px);
  display: flex;
}

.table .table__row .table__cell {
  margin: 0 calc(var(--gutter) * .25);
  flex-grow: 1;
  flex-shrink: 0;
  padding: 0;
}

.table .table__row .table__cell:first-child {
  margin-left: var(--gutter);
}

.table .table__row .table__cell:last-child {
  margin-right: var(--gutter);
  text-align: right;
}

.table .table__row .table__cell--nr {
  width: 2em;
}

.table .table__row .table__cell--media {
  width: 4.2em;
  position: relative;
}

.table .table__row .table__cell--tags, .table .table__row .table__cell--title {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex-shrink: 1;
  width: 20em;
  margin-right: 0;
  padding: .1em 0;
  overflow: hidden;
}

.table .table__row .table__cell--title {
  flex-grow: 5;
}

.table .table__row .table__cell--tags {
  flex-grow: 3;
}

.table .table__row .table__cell--date {
  width: 5.5em;
}

.table .table__row .table__cell--type {
  width: 6.5em;
}

.table .table__row .table__cell--actions {
  flex-grow: 0;
  width: 4.2em;
}

.table .table__row .table__cell .table__title--active, .table .table__row .table__cell .table__title.hover, body:not(.body--touch) .table .table__row .table__cell .table__title:focus, body:not(.body--touch) .table .table__row .table__cell .table__title:hover {
  text-decoration: underline;
}

.table .table__row .table__cell .table__media {
  width: auto;
  max-height: 2em;
  display: flex;
}

.table .table__row .table__cell .table__copy {
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
}

@media (width <= 599px) {
  .body--table .table {
    display: none;
  }

  .body--table .table:has(.item--categories-hidden, .item--applications-hidden, .item--statuses-hidden, .item--themes-hidden, .item--values-hidden, .item--activities-hidden, .item--search-hidden) {
    display: flex;
  }

  .table .table__row .table__cell--nr, .table .table__row .table__cell--media {
    flex-grow: 0;
  }

  .table .table__row .table__cell--actions {
    width: auto;
  }
}

.button {
  --speed: var(--transition-default);
  --pulse: .03;
  color: var(--color);
  align-items: center;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}

.button:before {
  content: "[";
}

.button:after {
  content: "]";
}

.hor-scroll .button, .buttons .button {
  max-width: calc(100% - var(--btn-margin) * 2);
  margin: var(--btn-margin);
}

.cookies .button {
  color: var(--cookies-color);
}

.button[data-hor-scroll-active="true"], .button--active, .button.hover, body:not(.body--touch) .button:focus, body:not(.body--touch) .button:hover {
  text-decoration: underline;
}

.cover {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.embed {
  position: relative;
}

.empty {
  height: calc(var(--window-height) - var(--nav-height) - var(--footer-height) - var(--padding) * 2);
  padding: var(--padding) var(--gutter);
  line-height: var(--lineheight);
  text-align: center;
  align-items: center;
  display: flex;
}

.empty--hidden {
  display: none;
}

.empty .empty__text {
  max-width: 25em;
}

.empty .empty__text p {
  text-wrap: balance;
}

.full-touch {
  height: 100vh;
  position: fixed;
}

.gallery-dots {
  display: none;
}

.relative .gallery-dots, .body--touch .grid--projects:not(.grid--reader, .grid--related) .gallery-dots {
  bottom: calc(var(--block-padding) * 3);
  gap: calc(var(--block-padding) * 3);
  justify-content: center;
  width: 100%;
  display: flex;
  position: absolute;
}

.relative .gallery-dots .gallery-dots__dot, .body--touch .grid--projects:not(.grid--reader, .grid--related) .gallery-dots .gallery-dots__dot {
  width: 9px;
  height: 9px;
  transition: background-color var(--transition-fast);
  background-color: #888;
  border-radius: 50%;
  position: relative;
}

.relative .gallery-dots .gallery-dots__dot--active, .body--touch .grid--projects:not(.grid--reader, .grid--related) .gallery-dots .gallery-dots__dot--active {
  background-color: var(--colors-bg-three);
}

.relative .gallery-dots .gallery-dots__dot--active {
  background-color: #eee;
}

.gallery {
  display: none;
}

.text .gallery {
  display: block;
}

.relative .gallery, .body--touch .grid--projects:not(.grid--reader, .grid--related) .gallery {
  cursor: pointer;
  width: 100%;
  display: flex;
  position: relative;
}

.relative .gallery .gallery__item, .body--touch .grid--projects:not(.grid--reader, .grid--related) .gallery .gallery__item {
  visibility: hidden;
  opacity: 0;
  object-fit: cover;
  width: 100%;
  height: 100%;
  transition: opacity var(--transition-fast), visibility 0s var(--transition-fast);
  display: block;
  position: absolute;
}

.relative .gallery .gallery__item--contain, .body--touch .grid--projects:not(.grid--reader, .grid--related) .gallery .gallery__item--contain {
  object-fit: contain;
}

.relative .gallery .gallery__item--active, .body--touch .grid--projects:not(.grid--reader, .grid--related) .gallery .gallery__item--active {
  visibility: visible;
  opacity: 1;
  transition: opacity var(--transition-fast), visibility 0s 0s;
}

.relative .gallery--media .gallery__item:first-child, .body--touch .grid--projects:not(.grid--reader, .grid--related) .gallery--media .gallery__item:first-child {
  position: relative;
}

.relative .gallery--landscape, .body--touch .grid--projects:not(.grid--reader, .grid--related) .gallery--landscape {
  aspect-ratio: 4 / 3;
}

.relative .gallery--square, .body--touch .grid--projects:not(.grid--reader, .grid--related) .gallery--square {
  aspect-ratio: 1;
}

.relative .gallery--portrait, .body--touch .grid--projects:not(.grid--reader, .grid--related) .gallery--portrait {
  aspect-ratio: 3 / 4;
}

.heading {
  font-family: var(--font-family-sans-bold);
  font-weight: normal;
}

.heading--cq.heading--h1 {
  font-size: var(--font-cq-xl);
}

.heading--cq.heading--h2 {
  font-size: var(--font-cq-large);
}

.heading--cq.heading--h3 {
  font-size: var(--font-cq-medium);
}

.hor-scroll-items {
  align-self: center;
  display: flex;
}

.hor-title {
  width: 1em;
  height: 1em;
  margin: var(--btn-margin);
  position: relative;
}

.hor-title .hor-title__text {
  bottom: calc(var(--block-padding) + 1em);
  transform-origin: 0 100%;
  font-family: var(--font-family-sans-bold);
  white-space: nowrap;
  position: absolute;
  transform: rotate(-90deg) translateY(1em);
}

.item--categories-hidden, .item--applications-hidden, .item--statuses-hidden, .item--themes-hidden, .item--values-hidden, .item--activities-hidden, .item--search-hidden {
  display: none !important;
}

.media-copy {
  pointer-events: none;
  opacity: 0;
  transition: opacity var(--transition-default);
}

.media-copy--active {
  opacity: 1;
}

.nav__item--reader .media-copy {
  width: auto;
  height: 100%;
  position: absolute;
}

.table .media-copy {
  max-height: 2em;
}

.info .reader-btn .media-copy {
  max-height: 2em;
  position: absolute;
}

.body--touch .projects-scroll .media-copy {
  opacity: 1;
}

.media-holder {
  gap: var(--block-padding) 0;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  display: flex;
}

.media-holder--multiply {
  mix-blend-mode: multiply;
}

.body--safari .media-holder--multiply {
  transform: translate3d(0, 0, 0);
}

.media-holder .media-holder__media {
  width: 100%;
  position: relative;
}

.media-holder .media-holder__media .media-holder__zoom-btn {
  right: calc(var(--block-padding) * 2.25);
  bottom: calc(var(--block-padding) * 2.25);
  display: none;
  position: absolute;
}

.body--touch .media-holder .media-holder__media .media-holder__zoom-btn {
  display: block;
}

.media-holder .media-holder__media--white-text .media-holder__zoom-btn {
  color: var(--colors-text-two);
}

.media-holder button.media-holder__media {
  cursor: zoom-in;
}

.media-holder--fit-in-popover .media-holder__media {
  width: auto;
}

.media-holder--fit-in-popover .media-holder__media img, .media-holder--fit-in-popover .media-holder__media video {
  width: auto;
  max-width: 100%;
  max-height: calc(var(--window-height) - var(--padding) * 4);
}

.media-holder .media-holder__caption {
  --lineheight: 1.3;
  font-size: var(--font-small);
}

@media (width <= 599px) {
  .media-holder--fit-in-popover .media-holder__media img, .media-holder--fit-in-popover .media-holder__media video {
    max-height: calc(var(--inner-height) - var(--padding) * 4 - var(--block-padding) * 4 - var(--font-normal) * 2.2 - 3em);
  }

  .media-holder .media-holder__caption {
    padding: 0 var(--block-padding);
  }

  .detail .media-holder .media-holder__caption {
    padding: 0;
  }
}

.media-popover {
  visibility: hidden;
  opacity: 0;
  background-color: var(--colors-bg-one);
  width: 100%;
  height: 100%;
  transition: opacity var(--transition-default), visibility 0s var(--transition-default);
  position: fixed;
  top: 0;
  left: 0;
}

.media-popover--active {
  visibility: visible;
  opacity: 1;
  transition: opacity var(--transition-default), visibility 0s 0s;
}

.media-popover .media-popover__media {
  top: calc(var(--padding) * .5);
  left: calc(var(--gutter) * .5);
  width: calc(100% - var(--gutter) * 1);
  height: calc(100% - var(--padding) * 1);
  object-fit: contain;
  position: absolute;
}

.media-popover .media-popover__close-btn {
  right: var(--gutter);
  bottom: var(--padding);
  position: fixed;
}

.media-popover .media-popover__close-btn.hover, body:not(.body--touch) .media-popover .media-popover__close-btn:focus, body:not(.body--touch) .media-popover .media-popover__close-btn:hover {
  text-decoration: underline;
}

.media-popover--white-text {
  background-color: var(--colors-bg-two);
}

.media-popover--white-text .media-popover__close-btn {
  color: var(--colors-text-two);
}

@media (width <= 800px) {
  .media-popover {
    -webkit-overflow-scrolling: touch;
    overflow: auto hidden;
  }

  .media-popover .media-popover__media {
    width: auto;
    max-width: none;
    height: 100%;
    padding: calc(var(--padding) * .75) calc(var(--gutter) * .75);
    object-fit: cover;
    display: block;
    position: relative;
    top: 0;
    left: 0;
  }

  .media-popover .media-popover__close-btn {
    right: calc(var(--gutter) * 1.5);
    bottom: calc(var(--padding) * 1.5);
  }
}

.media {
  --play-pause-width: 3.6em;
  --audio-width: 3.7em;
  --fullscreen-width: 3em;
  --media-padding: calc(var(--block-padding) * 1.5);
  --media-btn-height: 3.5rem;
  --media-audio-height: 1.4rem;
  --btn-bg-color: #000;
  --color: var(--colors-text-two);
  --bg-opacity: .85;
  --progress-width: 1px;
  --time-width: 2.8em;
  --play-size: calc(3vw + 3rem);
  border-radius: 0;
  position: relative;
  overflow: hidden;
}

.media:before {
  content: "";
  opacity: .1;
  background-color: var(--btn-bg-color);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.media .media__holder {
  width: 100%;
  transition: opacity var(--transition-default);
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
  overflow: hidden;
}

.media .media__holder--hidden {
  opacity: 0;
  transition-duration: 0s !important;
}

.media .media__holder .media__video {
  isolation: isolate;
  max-width: 100%;
  position: relative;
}

.media .media__preview {
  object-fit: contain;
  width: 100%;
  height: 100%;
  transition: opacity var(--transition-default);
  object-fit: cover;
  position: absolute;
  top: 0;
}

.media .media__overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.body--touch .media .media__overlay {
  pointer-events: none;
}

.media .media__buttons {
  gap: 0 var(--media-padding);
  width: 100%;
  height: auto;
  padding: var(--media-padding);
  transition: opacity var(--transition-default);
  opacity: 0;
  justify-content: space-between;
  align-items: center;
  display: flex;
  position: absolute;
  bottom: 0;
}

.body--touch .media .media__buttons {
  opacity: 1;
}

.media .media__buttons--cover {
  display: none;
}

.media .media__buttons .media__buttons-bg {
  pointer-events: none;
  width: 100%;
  height: calc(var(--media-padding) * 3 + 14px);
  opacity: .15;
  background: linear-gradient(0deg, var(--btn-bg-color) 20%, transparent 100%);
  transition: opacity var(--transition-default);
  position: absolute;
  bottom: 0;
  left: 0;
}

.media .media__buttons .media__btn-holder {
  gap: 0 var(--media-padding);
  color: var(--color);
  align-items: center;
  margin: 0;
  display: flex;
}

.media .media__buttons .media__btn-holder--bl {
  justify-content: center;
}

.media .media__buttons .media__btn-holder--bm {
  opacity: 0;
  flex-grow: 1;
  display: flex;
  position: relative;
}

.media .media__buttons .media__btn-holder--br {
  justify-content: flex-end;
}

.slick-slider .media .media__buttons .media__btn-holder {
  pointer-events: none;
}

.slick-current .media .media__buttons .media__btn-holder {
  pointer-events: auto;
}

.media .media__buttons .media__time, .media .media__buttons .media__btn, .media .media__buttons .media__progress {
  z-index: 10;
  position: relative;
}

body:not(.body--touch) .media .media__buttons .media__btn:focus, body:not(.body--touch) .media .media__buttons .media__btn:hover, .media .media__buttons .media__btn.hover, body:not(.body--touch) .media .media__buttons .media__progress:focus, body:not(.body--touch) .media .media__buttons .media__progress:hover, .media .media__buttons .media__progress.hover {
  transition-duration: var(--transition-fast);
  text-decoration: underline;
}

.media .media__buttons .media__btn.hover, .media .media__buttons .media__progress.hover {
  transition-duration: .1s;
}

.media .media__buttons .media__time {
  width: var(--time-width);
  display: flex;
  position: relative;
}

.media .media__buttons .media__btn {
  box-sizing: content-box;
  margin: calc(var(--media-padding) * -.5);
  padding: calc(var(--media-padding) * .5);
  transition: opacity var(--transition-default);
  line-height: 1.1;
  display: flex;
}

.media .media__buttons .media__btn--play-pause {
  width: var(--play-pause-width);
}

.media .media__buttons .media__btn--audio {
  width: var(--audio-width);
}

.media .media__buttons .media__btn--fullscreen {
  width: var(--fullscreen-width);
  display: flex;
}

.media .media__buttons .media__btn .media__btn-play, .media .media__buttons .media__btn .media__btn-pause, .media .media__buttons .media__btn .media__btn-unmute, .media .media__buttons .media__btn .media__btn-mute, .media .media__buttons .media__btn .media__btn-grow, .media .media__buttons .media__btn .media__btn-shrink {
  justify-content: center;
  width: 100%;
}

.media .media__buttons .media__btn .media__btn-play svg, .media .media__buttons .media__btn .media__btn-pause svg, .media .media__buttons .media__btn .media__btn-unmute svg, .media .media__buttons .media__btn .media__btn-mute svg, .media .media__buttons .media__btn .media__btn-grow svg, .media .media__buttons .media__btn .media__btn-shrink svg {
  height: auto;
}

.media .media__buttons .media__btn .media__btn-play svg path, .media .media__buttons .media__btn .media__btn-play svg rect, .media .media__buttons .media__btn .media__btn-pause svg path, .media .media__buttons .media__btn .media__btn-pause svg rect, .media .media__buttons .media__btn .media__btn-unmute svg path, .media .media__buttons .media__btn .media__btn-unmute svg rect, .media .media__buttons .media__btn .media__btn-mute svg path, .media .media__buttons .media__btn .media__btn-mute svg rect {
  fill: var(--color);
}

.media .media__buttons .media__btn .media__btn-grow svg, .media .media__buttons .media__btn .media__btn-shrink svg {
  width: 100%;
}

.media .media__buttons .media__btn .media__btn-grow svg path, .media .media__buttons .media__btn .media__btn-shrink svg path {
  stroke: var(--color);
}

.media .media__buttons .media__btn .media__btn-play {
  display: flex;
}

.media .media__buttons .media__btn .media__btn-play svg {
  width: 70%;
}

.media .media__buttons .media__btn .media__btn-pause {
  display: none;
}

.media .media__buttons .media__btn .media__btn-pause svg {
  width: 70%;
}

.media .media__buttons .media__btn .media__btn-unmute {
  display: flex;
}

.media .media__buttons .media__btn .media__btn-unmute svg {
  width: 85%;
}

.media .media__buttons .media__btn .media__btn-mute {
  display: none;
}

.media .media__buttons .media__btn .media__btn-mute svg {
  width: 100%;
  margin-right: -3px;
}

.media .media__buttons .media__btn .media__btn-grow {
  display: flex;
}

.media .media__buttons .media__btn .media__btn-shrink {
  display: none;
}

.media .media__buttons .media__progress {
  cursor: pointer;
  height: calc(var(--media-btn-height) - var(--media-padding));
  margin-right: var(--progress-width);
  flex-grow: 1;
  align-items: center;
  display: none;
  position: relative;
}

.media .media__buttons .media__progress:before {
  content: "";
  width: 100%;
  height: var(--progress-width);
  background-color: var(--color);
  position: absolute;
}

.media .media__buttons .media__progress .media__time {
  display: none;
}

.media .media__buttons .media__progress .media__progress-bar {
  width: var(--progress-width);
  background-color: var(--color);
  height: 1.4rem;
  position: absolute;
}

.media .media__buttons .media__progress {
  display: flex;
}

.media .media__play {
  --underline-width: 1.5px;
  --underline-top: calc(50% + .48em);
  --shadow-width: .075em;
  font-family: var(--font-family-display);
  --lineheight: 1.5;
  font-style: normal;
  font-weight: 500;
  font-size: var(--font-intro);
  padding: calc(var(--play-size) * .3) calc(var(--play-size) * .26) calc(var(--play-size) * .3) calc(var(--play-size) * .34);
  white-space: nowrap;
  transition: opacity var(--transition-default);
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.media .media__play svg {
  transition: transform var(--transition-default);
}

.media .media__play svg path {
  fill: var(--color);
}

body:not(.body--touch) .media .media__play:focus, body:not(.body--touch) .media .media__play:hover, .media .media__play.hover {
  text-decoration: underline;
}

body:not(.body--touch) .media .media__play:focus svg, body:not(.body--touch) .media .media__play:hover svg, .media .media__play.hover svg {
  transition-duration: var(--transition-fast);
  transform: scale(1.15);
}

.media .media__play.hover svg {
  transition-duration: .1s;
}

.media .media__caption {
  --lineheight: 1.3;
  font-size: var(--font-small);
  margin-top: var(--media-padding);
}

.media--audio {
  --color: var(--colors-text-one);
  --btn-bg-color: var(--colors-bg-one);
}

.media--audio:before {
  content: none !important;
}

.media--audio .media__buttons {
  opacity: 1;
  padding: 0 0 .1em;
  position: relative;
}

.media--audio .media__buttons .media__buttons-bg {
  display: none;
}

.media--audio .media__buttons .media__btn-holder--bm {
  opacity: 1 !important;
}

.media--audio .media__buttons .media__progress {
  height: var(--media-audio-height);
}

.media--audio .media__buttons .media__progress .media__progress-bar {
  height: 100%;
}

.media--audio .media__play {
  display: none;
}

.media--has-preview .media__holder .media__video {
  transition: opacity var(--transition-default);
  opacity: 0 !important;
}

.media--has-preview .media__preview .media__video, .media--started .media__holder .media__video {
  opacity: 1 !important;
}

.media--started .media__preview {
  opacity: 0;
  transition-delay: var(--transition-default);
}

.media--started .media__buttons .media__btn-holder--bm {
  opacity: 1;
}

.media--fullscreen {
  z-index: 1000;
  border-radius: 0;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
}

.media--fullscreen:before {
  opacity: var(--bg-opacity);
}

.media--fullscreen .media__holder {
  height: 100%;
}

.media--fullscreen .media__holder .media__video {
  object-fit: contain;
  width: 100%;
  height: 100%;
}

.media--fullscreen .media__buttons {
  padding-bottom: calc(var(--media-padding) * 2);
}

.media--fullscreen .media__buttons .media__btn .media__btn-grow {
  display: none;
}

.media--fullscreen .media__buttons .media__btn .media__btn-shrink {
  display: flex;
}

.media--cover {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.media--cover.media--fullscreen {
  position: fixed;
}

.media--cover .media__holder {
  height: 100%;
}

.media--cover .media__holder .media__video {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.media--cover .media__preview {
  object-fit: cover;
}

.media--cover .media__buttons--regular {
  display: none;
}

.media--cover .media__buttons--cover {
  display: flex;
}

.media--autoplay .media__buttons, .media--playing .media__buttons {
  opacity: 0;
  transition-delay: var(--transition-slow);
}

.body--touch .media--autoplay .media__buttons, .body--touch .media--playing .media__buttons {
  opacity: 0;
}

.media--autoplay .media__buttons .media__btn--play-pause .media__btn-play, .media--playing .media__buttons .media__btn--play-pause .media__btn-play {
  display: none;
}

.media--autoplay .media__buttons .media__btn--play-pause .media__btn-pause, .media--playing .media__buttons .media__btn--play-pause .media__btn-pause {
  display: flex;
}

.media--autoplay .media__buttons .media__progress .media__progress-bar, .media--playing .media__buttons .media__progress .media__progress-bar {
  transition: left .25s linear;
}

.media--autoplay .media__play, .media--playing .media__play {
  pointer-events: none;
  opacity: 0;
}

.media--autoplay.media--audio .media__buttons, .media--playing.media--audio .media__buttons {
  opacity: 1 !important;
}

.media--focus .media__buttons, body:not(.body--touch) .media:hover .media__buttons, .media.hover .media__buttons {
  opacity: 1;
  transition-delay: 0s;
}

.media--muted .media__buttons .media__btn .media__btn-unmute {
  display: none;
}

.media--muted .media__buttons .media__btn .media__btn-mute {
  display: flex;
}

.slick-current .media--autoplay .media__buttons, .body--touch .media--autoplay .media__buttons {
  opacity: .5;
}

.media--autoplay .media__buttons .media__btn-holder--bl {
  display: none;
}

.media--autoplay .media__buttons .media__btn-holder--bm {
  visibility: hidden;
}

.media--autoplay .media__buttons .media__btn-holder--br {
  display: flex;
}

.media--autoplay .media__buttons .media__btn--audio, .media--autoplay .media__buttons .media__btn--fullscreen, .media--autoplay .media__buttons .media__btn--play-pause {
  display: none;
}

.media--autoplay.media--has-audio .media__buttons .media__btn-holder--br, .media--autoplay.media--has-audio .media__buttons .media__btn--audio {
  display: flex;
}

.media--autoplay.media--focus:not(.media--has-audio) .media__buttons, body:not(.body--touch) .media--autoplay:hover:not(.media--has-audio) .media__buttons, .media--autoplay.hover:not(.media--has-audio) .media__buttons {
  opacity: 0;
}

.slick-current .media--touched .media__buttons, .body--touch .media--touched .media__buttons {
  opacity: 1;
  transition-delay: 0s;
}

.ratio .media {
  width: 100%;
  height: 100%;
  position: absolute;
}

.ratio .media--fullscreen {
  position: fixed;
}

.ratio .media .media__holder {
  height: 100%;
}

@media (width <= 1023px) {
  .grid--contact .media--audio {
    padding: 0 var(--block-padding);
  }
}

.member {
  gap: var(--block-padding) 0;
  flex-direction: column;
  display: flex;
}

.member .member__text {
  padding: 0 var(--block-padding);
  line-height: var(--lineheight);
}

.member .member__text .member__name {
  font-family: var(--font-family-sans-bold);
}

.member .member__text .member__intro {
  margin-top: calc(var(--lineheight) * 1em);
}

.member .member__text .member__more {
  padding-top: calc(var(--lineheight) * 1em);
}

.member .member__text .member__read-more {
  display: inline-block;
}

.member .member__text .member__read-more:before {
  content: "[";
}

.member .member__text .member__read-more:after {
  content: "]";
}

.member .member__text .member__read-more .member__read-more-text {
  margin: 0 -.25em;
}

.member .member__text .member__read-more .member__read-more-text:before {
  content: "read more";
}

.member .member__text .member__read-more[data-active="1"] .member__read-more-text:before {
  content: "close";
}

body:not(.body--touch) .member .member__text .member__read-more:focus, body:not(.body--touch) .member .member__text .member__read-more:hover, .member .member__text .member__read-more.hover {
  text-decoration: underline;
}

@media (width <= 1023px) {
  .grid--contact .newsletter {
    padding: 0 var(--block-padding);
  }
}

.popover {
  pointer-events: none;
  overscroll-behavior: contain;
  width: 100%;
  height: var(--window-height);
  visibility: hidden;
  opacity: 0;
  transition-delay: 0s, var(--transition-default);
  transition-duration: var(--transition-default), 0s;
  transition-property: opacity, visibility;
  position: fixed;
  top: 0;
  left: 0;
  overflow: hidden scroll;
}

.popover .popover__bg {
  pointer-events: none;
  opacity: 0;
  background-color: var(--bg-color);
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
}

.popover--rotate {
  transform-origin: calc(var(--inner-height) * .5) calc(var(--inner-height) * .5);
  width: var(--inner-height);
  height: 100vw;
  transform: rotate(-90deg);
}

.popover .popover__scroller {
  width: 100%;
  min-height: 100%;
  padding: var(--padding) var(--gutter);
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
}

.popover .popover__scroller:has(.circle) {
  padding-top: calc(var(--header-height) + 3rem);
}

.popover .popover__scroller .popover__bg-btn {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.popover .popover__scroller .popover__content {
  transform: translateY(var(--padding));
  padding: var(--block-padding);
  background-color: var(--bg-color);
  transition-timing-function: var(--transition-easing-in), ease, ease;
  transition-duration: var(--transition-default), var(--transition-slow), var(--transition-slow);
  flex-direction: column;
  margin: 0 auto;
  transition-property: transform, color, background-color;
  display: flex;
  position: relative;
}

.popover .popover__scroller .popover__content .popover__header {
  margin-bottom: calc(var(--block-padding) - .2em);
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.popover .popover__scroller .popover__content .popover__close {
  position: relative;
  top: auto;
  left: auto;
}

.popover .popover__floaters {
  --padding-x: 25vw;
  --padding-y: 25vh;
  pointer-events: none;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  overflow: hidden;
}

.popover--project {
  pointer-events: auto;
  height: var(--inner-height);
  visibility: visible;
  opacity: 1;
  transition: none;
  top: 100vh;
  overflow: hidden;
}

.body--project-popover-vt .popover--project {
  view-transition-name: popover-project;
}

body[data-pagetype="project"] .popover--project, body[data-pagetype="reader"] .popover--project {
  top: 0;
}

.popover--project .popover__scroller {
  padding: calc(var(--padding) * 2) calc(var(--padding) * 2) 0;
}

.popover--project .popover__scroller .popover__content {
  background-color: #0000;
  border-radius: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  transform: none;
}

.popover--faq .popover__scroller .popover__content {
  padding-top: 0;
  transform: none;
}

.popover--faq .popover__scroller .popover__content .popover__close {
  top: var(--font-size-xxl);
}

.popover--regular .popover__scroller .popover__content {
  color: var(--colors-text-one);
  background-color: var(--color);
}

.popover--regular .popover__scroller .popover__content a {
  color: var(--colors-text-one);
}

.popover--regular .popover__scroller .popover__content .popover__close svg line {
  stroke: var(--colors-text-one);
}

.popover--inverted .popover__scroller .popover__content {
  color: var(--colors-text-two);
  background-color: var(--colors-bg-two);
}

.popover--inverted .popover__scroller .popover__content a {
  color: var(--colors-text-two);
}

.popover--inverted .popover__scroller .popover__content .popover__close svg line {
  stroke: var(--colors-text-two);
}

.popover--video .popover__scroller {
  padding: var(--padding) var(--gutter);
}

.popover--video .popover__scroller .popover__content {
  padding: var(--block-padding);
  color: var(--color);
  background-color: var(--bg-color);
}

.popover--cookies-bottom {
  --cookie-padding: calc(var(--padding) * .5);
  background-color: #0000;
}

.popover--cookies-bottom .popover__content {
  background-color: #0000;
  border-radius: 1rem;
  width: 100%;
  height: auto;
  top: auto;
  transition: transform var(--transition-default) !important;
  bottom: 0 !important;
  left: 0 !important;
  transform: translateY(120%) !important;
}

.popover--cookies-bottom .popover__content .popover__close {
  display: none;
  top: calc(var(--cookie-padding) * .5) !important;
  right: calc(var(--cookie-padding) * .5) !important;
}

.popover--cookies-bottom .popover__content .popover__close g {
  stroke: var(--colors-text-two);
}

.popover--cookies-bottom.popover--active .popover__content {
  transform: none !important;
}

.popover--cookies-center {
  --cookie-padding: calc(var(--block-padding) * 2);
  --cookies-color: var(--colors-text-one);
  --cookies-bg-color: var(--bg-color);
  --cookies-key-width: 6em;
}

.popover--cookies-center .popover__bg {
  opacity: .5;
  transition-duration: var(--transition-slow);
  transition-property: opacity, background-color;
}

.popover--cookies-center .popover__scroller {
  padding: var(--padding) var(--gutter);
}

.popover--cookies-center .popover__scroller .popover__bg-btn {
  pointer-events: none;
}

.body:has(.cookies-cursor) .popover--cookies-center .popover__scroller .popover__bg-btn {
  pointer-events: auto;
}

.popover--cookies-center .popover__scroller .popover__content {
  padding: var(--padding) var(--gutter);
  color: var(--cookies-color);
  background-color: var(--cookies-bg-color);
}

.popover--cookies-center .popover__scroller .popover__content .popover__close {
  display: none;
  top: var(--cookie-padding) !important;
  right: var(--cookie-padding) !important;
}

.popover--cookies-center.popover--cookies-1 .popover__scroller .popover__content {
  width: 30em;
}

.popover--cookies-center.popover--cookies-2 .popover__scroller .popover__content {
  width: 40em;
}

.popover--active {
  pointer-events: auto;
  visibility: visible;
  opacity: 1;
  transition-delay: 0s, 0s;
}

.popover--active .popover__scroller .popover__content {
  transition-timing-function: var(--transition-easing-out), ease, ease;
  transform: none;
}

@media (width <= 1200px) {
  .popover--project .popover__scroller {
    padding: calc(var(--padding) * 2) 0 0;
  }
}

@media (height <= 440px) {
  .popover--rotate {
    pointer-events: auto;
    visibility: visible;
    opacity: 1;
    transition-delay: 0s, 0s;
  }
}

.project {
  --speed: var(--transition-fast);
  gap: var(--block-padding);
  flex-direction: column;
  display: flex;
  position: relative;
}

.project .project__hover {
  gap: var(--block-padding) 0;
  line-height: var(--lineheight);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.project .project__hover .project__media {
  width: 100%;
  transition: opacity var(--speed);
  display: flex;
  position: relative;
}

.project .project__hover .project__link {
  margin-top: calc(var(--block-padding) * -.5 - .5em);
  padding: 0 var(--block-padding);
  line-height: var(--lineheight);
  text-align: center;
  text-wrap: balance;
  opacity: 0;
  transition: opacity var(--speed);
  position: absolute;
}

.project .project__hover .project__link.hover, body:not(.body--touch) .project .project__hover .project__link:focus, body:not(.body--touch) .project .project__hover .project__link:hover {
  text-decoration: underline;
}

.project .project__hover .project__text {
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
}

.project .project__hover .project__text .project__nr {
  pointer-events: none;
  transition: opacity var(--speed);
}

.project .project__hover .project__tags, .project .project__hover .project__read-more, .project .project__hover .project__intro {
  display: none;
}

.project .project__hover.hover .project__media, body:not(.body--touch) .project .project__hover:focus .project__media, body:not(.body--touch) .project .project__hover:hover .project__media {
  opacity: 0;
}

.project .project__hover.hover .project__link, body:not(.body--touch) .project .project__hover:focus .project__link, body:not(.body--touch) .project .project__hover:hover .project__link, .project .project__hover.hover .project__text .reader-btn, body:not(.body--touch) .project .project__hover:focus .project__text .reader-btn, body:not(.body--touch) .project .project__hover:hover .project__text .reader-btn {
  opacity: 1;
}

.project .project__hover.hover .project__text .project__nr, body:not(.body--touch) .project .project__hover:focus .project__text .project__nr, body:not(.body--touch) .project .project__hover:hover .project__text .project__nr {
  opacity: 0;
}

.project .project__copy {
  pointer-events: none;
  width: 100%;
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
}

.project--small .project__hover .project__link, .body--touch .project .project__hover .project__link {
  width: 100%;
  font-family: var(--font-family-sans-bold);
  text-align: left;
  text-wrap: auto;
  opacity: 1;
  margin-top: 0;
  position: relative;
}

.project--small .project__hover .project__text, .body--touch .project .project__hover .project__text {
  width: 100%;
  padding: 0 var(--block-padding);
  justify-content: space-between;
}

.project--small .project__hover .project__text .project__nr, .body--touch .project .project__hover .project__text .project__nr {
  order: 0;
  position: relative;
  opacity: 1 !important;
}

.project--small {
  margin: var(--btn-margin);
}

.project--small .project__hover .project__link {
  padding: 0;
  display: flex;
  order: initial !important;
  width: auto !important;
}

.project--small .project__hover .project__text {
  align-self: center;
  width: auto !important;
  padding: 0 !important;
}

.project--small .project__hover .project__media {
  max-height: 3em;
}

.project--small .project__copy {
  top: calc(var(--block-padding) + 1em);
}

.body--touch .grid--projects:not(.grid--reader, .grid--related) .project:not(.project--small) .project__hover {
  padding: 0 var(--block-padding);
}

.body--touch .grid--projects:not(.grid--reader, .grid--related) .project:not(.project--small) .project__hover .project__link {
  padding: 0;
}

.body--touch .grid--projects:not(.grid--reader, .grid--related) .project:not(.project--small) .project__hover .project__media {
  width: calc(100% + var(--block-padding) * 2);
  max-width: none;
  margin: 0 calc(var(--block-padding) * -1);
}

.body--touch .grid--projects:not(.grid--reader, .grid--related) .project:not(.project--small) .project__hover .project__media:has(.gallery) > img, .body--touch .grid--projects:not(.grid--reader, .grid--related) .project:not(.project--small) .project__hover .project__media:has(.gallery) > video {
  display: none;
}

.body--touch .grid--projects:not(.grid--reader, .grid--related) .project:not(.project--small) .project__hover .project__text {
  padding: 0 !important;
}

.body--touch .grid--projects:not(.grid--reader, .grid--related) .project:not(.project--small) .project__hover .project__intro {
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  order: 2;
  width: 100%;
  display: -webkit-box;
  overflow: hidden;
}

.body--touch .grid--projects:not(.grid--reader, .grid--related) .project:not(.project--small) .project__hover .project__read-more {
  order: 3;
  align-self: flex-start;
  display: block;
}

.body--touch .grid--projects:not(.grid--reader, .grid--related) .project:not(.project--small) .project__hover .project__read-more:before {
  content: "[";
}

.body--touch .grid--projects:not(.grid--reader, .grid--related) .project:not(.project--small) .project__hover .project__read-more:after {
  content: "]";
}

body:not(.body--touch) .body--touch .grid--projects:not(.grid--reader, .grid--related) .project:not(.project--small) .project__hover .project__read-more:focus, body:not(.body--touch) .body--touch .grid--projects:not(.grid--reader, .grid--related) .project:not(.project--small) .project__hover .project__read-more:hover, .body--touch .grid--projects:not(.grid--reader, .grid--related) .project:not(.project--small) .project__hover .project__read-more.hover {
  text-decoration: underline;
}

.body--touch .grid--projects:not(.grid--reader, .grid--related) .project:not(.project--small) .project__hover .project__tags {
  --lineheight: 1.3;
  font-size: var(--font-small);
  order: 4;
  align-self: flex-start;
  display: block;
}

.quote {
  --underline-width: 1.5px;
  --underline-top: calc(50% + .48em);
  --shadow-width: .075em;
  font-family: var(--font-family-display);
  --lineheight: 1.5;
  font-style: normal;
  font-weight: 500;
  font-size: var(--font-intro);
  width: 100%;
  max-width: calc(47.5 * var(--font-book));
  line-height: var(--lineheight);
}

.quote:before {
  content: "“";
  display: inline-block;
}

.quote:after {
  content: "”";
  display: inline-block;
}

.reader-btn {
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.reader-btn:before {
  content: attr(data-add);
}

.reader-btn--added:before {
  content: attr(data-remove);
}

.project .reader-btn {
  opacity: 0;
  transition: opacity var(--speed);
  position: absolute;
}

.body--touch .project .reader-btn {
  opacity: 1;
  order: 1;
  position: relative;
}

.project--small .reader-btn {
  align-self: flex-end;
  order: initial !important;
}

.reader-btn.hover, body:not(.body--touch) .reader-btn:focus, body:not(.body--touch) .reader-btn:hover {
  text-decoration: underline;
}

.text-holder {
  justify-content: space-evenly;
  width: 100%;
  display: flex;
}

.text {
  width: 100%;
  max-width: 47.5em;
}

.text--cq {
  font-size: var(--font-cq-book);
}

.text--collaborates-columns, .text--collaborates {
  transition: opacity var(--speed);
}

body:not(.body--interacted, [data-pagetype="project"], [data-pagetype="reader"]) .text--collaborates-columns, body:not(.body--interacted, [data-pagetype="project"], [data-pagetype="reader"]) .text--collaborates {
  opacity: 0;
}

.text--collaborates {
  padding: 0 var(--gutter);
  align-self: flex-start;
}

.text--collaborates-columns {
  column-count: 5;
  column-gap: var(--gutter);
  max-width: none;
  margin-top: var(--padding);
  padding: 0 var(--block-padding);
}

@media (width <= 2263px) {
  .text--collaborates-columns {
    column-count: 4;
  }
}

@media (width <= 84.5em) {
  .text--collaborates-columns {
    column-count: 3;
  }
}

@media (width <= 63.375em) {
  .text--collaborates-columns {
    column-count: 2;
  }
}

.detail__content--vert-center .text {
  text-align: center;
}

.detail__content--vert-center .text p {
  text-wrap: balance;
}

@media (width <= 1023px) {
  .grid--contact .text {
    padding: 0 var(--block-padding);
  }
}

@media (width <= 599px) {
  .text--collaborates {
    padding: 0 var(--gutter);
  }
}

.toggle {
  --toggle-size: 1.2em;
  --toggle-width: calc(var(--toggle-size) + 4px + .8em);
  --toggle-border-width: 2px;
  --toggle-color: var(--bg-color);
  --toggle-bg-color: var(--colors-text-one);
  cursor: pointer;
  transition: opacity var(--transition-default);
  align-items: center;
  display: flex;
  position: relative;
}

.toggle .toggle__btn {
  padding: .6em calc(var(--toggle-width) * .5 - var(--toggle-border-width) * 2) .4em;
  font-size: var(--toggle-size);
  vertical-align: middle;
  background-color: var(--toggle-bg-color);
  transition: background-color var(--transition-default);
  border-radius: 1em;
  flex-shrink: 0;
  margin-right: .5em;
  display: inline-block;
  position: relative;
}

.toggle .toggle__btn:before {
  content: "";
  top: var(--toggle-border-width);
  left: var(--toggle-border-width);
  transform: translateX(calc(var(--toggle-width) - 1em - var(--toggle-border-width) * 4));
  width: calc(1em - var(--toggle-border-width) * 2);
  height: calc(1em - var(--toggle-border-width) * 2);
  border-radius: calc(1em - var(--toggle-border-width) * 2);
  background-color: var(--toggle-color);
  transition: transform var(--transition-default) var(--transition-easing), background-color var(--transition-default);
  position: absolute;
}

.toggle--text-on .toggle__btn {
  margin-right: 0;
}

.toggle--text-on .toggle__text {
  color: var(--toggle-color);
  transition: opacity var(--transition-default), color var(--transition-default);
  margin-top: -.1em;
  position: absolute;
}

.toggle--text-on .toggle__text--on {
  left: .8em;
}

.toggle--text-on .toggle__text--off {
  opacity: 0;
  right: .5em;
}

.toggle--switch {
  justify-content: flex-end;
}

.toggle--switch .toggle__btn {
  order: 1;
  margin-left: .5em;
  margin-right: 0;
}

.toggle--inverted {
  mix-blend-mode: screen;
}

.toggle--off {
  opacity: .3;
}

.toggle--off .toggle__btn:before {
  transform: none;
}

.toggle--off.toggle--text-on {
  opacity: 1;
}

.toggle--off.toggle--text-on .toggle__text--on {
  opacity: 0;
}

.toggle--off.toggle--text-on .toggle__text--off {
  opacity: 1;
}

.bottom .toggle {
  --toggle-size: 1.8em;
  --toggle-width: calc(var(--toggle-size) + 4px + .8em);
  pointer-events: auto;
  will-change: transform;
}

.bottom .toggle--off {
  opacity: 1;
}

.bottom .toggle .toggle__text {
  pointer-events: none;
}

body:not(.body--touch) .bottom .toggle:focus, body:not(.body--touch) .bottom .toggle:hover, .bottom .toggle.hover {
  opacity: 1;
}

body:not(.body--touch) .bottom .toggle:focus .toggle__text, body:not(.body--touch) .bottom .toggle:hover .toggle__text, .bottom .toggle.hover .toggle__text {
  text-decoration: underline;
}

body:not(.body--touch) .toggle:focus, body:not(.body--touch) .toggle:hover, .toggle.hover {
  opacity: .6;
}

.toggle--bordered .toggle__btn {
  padding: calc(.6em - var(--toggle-border-width)) calc(var(--toggle-width) * .5 - var(--toggle-border-width)) calc(.4em - var(--toggle-border-width));
  border: var(--toggle-color) solid var(--toggle-border-width);
  background-color: var(--toggle-bg-color);
  border-radius: 10rem;
}

.toggle--bordered .toggle__btn:before {
  transform: translateX(calc(var(--toggle-width) - 1em));
  width: calc(1em - var(--toggle-border-width) * 4);
  height: calc(1em - var(--toggle-border-width) * 4);
  background-color: var(--toggle-color);
}

.toggle--bordered.toggle--off .toggle__btn:before {
  transform: none;
}

body:not(.body--touch) .toggle--bordered:focus, body:not(.body--touch) .toggle--bordered:hover, .toggle--bordered.hover {
  opacity: 1;
}

body:not(.body--touch) .toggle--bordered:focus .toggle__btn, body:not(.body--touch) .toggle--bordered:hover .toggle__btn, .toggle--bordered.hover .toggle__btn {
  background-color: var(--toggle-color);
}

body:not(.body--touch) .toggle--bordered:focus .toggle__btn:before, body:not(.body--touch) .toggle--bordered:hover .toggle__btn:before, .toggle--bordered.hover .toggle__btn:before {
  background-color: var(--toggle-bg-color);
}

body:not(.body--touch) .toggle--bordered.toggle--text-on:focus .toggle__text, body:not(.body--touch) .toggle--bordered.toggle--text-on:hover .toggle__text, .toggle--bordered.toggle--text-on.hover .toggle__text {
  color: var(--toggle-bg-color);
}

@media (width <= 599px) {
  .bottom .toggle {
    visibility: hidden;
  }

  body:has(.item--categories-hidden, .item--applications-hidden, .item--statuses-hidden, .item--themes-hidden, .item--values-hidden, .item--activities-hidden, .item--search-hidden) .bottom .toggle {
    visibility: visible;
  }
}

.top {
  display: none;
}

@media (width <= 599px) {
  .top {
    opacity: .15;
    background-color: var(--colors-text-one);
    width: 100%;
    height: .5px;
    display: flex;
    position: fixed;
    top: 0;
  }
}

.video-embed {
  --play-size: calc(3vw + 3rem);
  --color: var(--colors-text-two);
  width: 100vw;
  max-width: 100%;
  height: 0;
  margin-bottom: var(--padding);
  background-color: var(--colors-text-one);
  padding-bottom: 56.25%;
  position: relative;
  overflow: hidden;
}

.video-embed:before {
  left: 0;
}

.video-embed:after {
  right: 0;
}

.video-embed .video-embed__img, .video-embed .video-embed__overlay {
  pointer-events: none;
  width: 100%;
  height: 100%;
  transition: opacity var(--transition-default), transform calc(var(--transition-slow) * 1.5) var(--transition-easing);
  position: absolute;
  top: 0;
  left: 0;
}

.video-embed .video-embed__img {
  object-fit: cover;
}

.video-embed .video-embed__overlay {
  opacity: .15;
  background-color: var(--colors-text-one);
}

.video-embed .video-embed__play {
  --underline-width: 1.5px;
  --underline-top: calc(50% + .48em);
  --shadow-width: .075em;
  font-family: var(--font-family-display);
  --lineheight: 1.5;
  font-style: normal;
  font-weight: 500;
  font-size: var(--font-intro);
  width: var(--play-size);
  height: var(--play-size);
  white-space: nowrap;
  transition: opacity var(--transition-default);
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.video-embed .video-embed__play svg {
  transition: transform var(--transition-default);
}

.video-embed .video-embed__play svg path {
  fill: var(--color);
}

body:not(.body--touch) .video-embed .video-embed__play:focus, body:not(.body--touch) .video-embed .video-embed__play:hover, .video-embed .video-embed__play.hover {
  text-decoration: underline;
}

body:not(.body--touch) .video-embed .video-embed__play:focus svg, body:not(.body--touch) .video-embed .video-embed__play:hover svg, .video-embed .video-embed__play.hover svg {
  transition-duration: var(--transition-fast);
  transform: scale(1.15);
}

.video-embed .video-embed__play.hover svg {
  transition-duration: .1s;
}

body:not(.body--iframes-accepted) .video-embed .video-embed__play, .video-embed:has(.blocked-iframe--visible) .video-embed__play {
  display: none;
}

.video-embed iframe {
  opacity: 0;
  width: 100%;
  height: 100%;
  transition: opacity var(--transition-default);
  border: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.video-embed--show-iframe .video-embed__img, .video-embed--show-iframe .video-embed__overlay {
  opacity: 0;
}

.video-embed--show-iframe .video-embed__play {
  pointer-events: none;
  opacity: 0;
}

.video-embed--show-iframe iframe {
  opacity: 1;
}

.video {
  gap: var(--block-padding) 0;
  flex-direction: column;
  width: 100%;
  display: flex;
}

.video .video__caption {
  --lineheight: 1.3;
  font-size: var(--font-small);
}

.grid .video .video__caption {
  padding: 0 var(--block-padding);
}

@media (width <= 599px) {
  .video .video__caption {
    padding: 0 var(--block-padding);
  }

  .detail .video .video__caption {
    padding: 0;
  }
}

.blocked-iframe {
  --color: #black;
  z-index: 2;
  width: 100%;
  height: 100%;
  min-height: 16rem;
  color: var(--color);
  background-color: #ccc;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 10%;
  display: none;
  position: absolute;
}

.video-embed .blocked-iframe {
  --color: var(--colors-text-two);
  background-color: #0000001a;
}

body:not(.body--iframes-accepted) .blocked-iframe, .blocked-iframe--visible {
  display: flex;
}

.blocked-iframe .blocked-iframe__text {
  color: var(--color);
  text-align: center;
  margin-bottom: 1em;
}

.blocked-iframe .blocked-iframe__button {
  color: var(--color);
  text-decoration: underline;
}

.blocked-iframe .blocked-iframe__button.hover, body:not(.body--touch) .blocked-iframe .blocked-iframe__button:focus, body:not(.body--touch) .blocked-iframe .blocked-iframe__button:hover {
  text-decoration: none;
}

body:not(.body--iframes-accepted) iframe, iframe:has( + .blocked-iframe--visible) {
  display: none;
}

.cookies-cursor {
  pointer-events: none;
  will-change: transform;
  z-index: 1000;
  opacity: 0;
  position: fixed;
  top: 0;
  left: 0;
}

body:has(.popover--active) .cookies-cursor--active {
  opacity: 1;
}

.cookies-cursor .cookies-cursor__content {
  color: var(--colors-text-one);
  white-space: nowrap;
  position: absolute;
  bottom: 0;
  transform: translate(-50%, -50%);
}

.cookies, .cookies .cookies__general {
  gap: var(--padding);
  flex-direction: column;
  display: flex;
}

.cookies .cookies__general .cookies__title {
  line-height: var(--lineheight);
  position: relative;
}

.cookies .cookies__table {
  line-height: var(--lineheight);
}

.cookies .cookies__table .cookies__key {
  width: var(--cookies-key-width);
  padding: 0 var(--cookie-padding) var(--cookie-padding) 0;
  vertical-align: top;
}

.cookies .cookies__table .cookies__value {
  gap: var(--cookie-padding);
  padding: 0 var(--cookie-padding) var(--cookie-padding) 0;
  vertical-align: top;
  flex-direction: column;
  display: flex;
}

.cookies .cookies__buttons {
  justify-content: flex-start;
  align-items: baseline;
  margin: 0 -.5em;
  display: flex;
}

.popover--cookies-bottom .cookies {
  padding: calc(var(--cookie-padding) * .5) calc(var(--cookie-padding) * 2);
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.popover--cookies-bottom .cookies .cookies__buttons {
  flex-shrink: 0;
}

.cookies .cookies__reject, .cookies .cookies__accept, .cookies .cookies__settings, .cookies .cookies__selected {
  margin: 0 .5em;
}

.cookies .cookies__reject, .cookies .cookies__settings, .cookies .cookies__selected {
  color: var(--cookies-color);
  position: relative;
}

.cookies .cookies__reject:before, .cookies .cookies__settings:before, .cookies .cookies__selected:before {
  content: "[";
}

.cookies .cookies__reject:after, .cookies .cookies__settings:after, .cookies .cookies__selected:after {
  content: "]";
}

body:not(.body--touch) .cookies .cookies__reject:focus, body:not(.body--touch) .cookies .cookies__reject:hover, .cookies .cookies__reject.hover, body:not(.body--touch) .cookies .cookies__settings:focus, body:not(.body--touch) .cookies .cookies__settings:hover, .cookies .cookies__settings.hover, body:not(.body--touch) .cookies .cookies__selected:focus, body:not(.body--touch) .cookies .cookies__selected:hover, .cookies .cookies__selected.hover {
  text-decoration: underline;
}

@media (width <= 800px) {
  .cookies .cookies__general {
    margin-bottom: var(--cookie-padding);
  }

  .popover--cookies-bottom .cookies {
    padding: var(--cookie-padding);
    flex-direction: column;
  }

  .popover--cookies-bottom .cookies .cookies__buttons {
    justify-content: space-between;
  }

  .popover--cookies-center .cookies {
    padding: calc(var(--cookie-padding) * 0) var(--cookie-padding);
  }

  .popover--cookies-center .cookies .cookies__buttons {
    justify-content: space-between;
  }
}

@media (width <= 599px) {
  .cookies:has(.cookies__reject) .cookies__buttons {
    flex-direction: column;
    align-items: center;
    margin: -.5em 0;
  }

  .cookies:has(.cookies__reject) .cookies__buttons .cookies__reject, .cookies:has(.cookies__reject) .cookies__buttons .cookies__accept, .cookies:has(.cookies__reject) .cookies__buttons .cookies__settings, .cookies:has(.cookies__reject) .cookies__buttons .cookies__selected {
    margin: .5em 0;
  }
}

@media print {
  html, body {
    width: 900px;
  }

  html {
    font-size: 62.5%;
  }

  body {
    padding-top: 0;
  }

  .nav, .footer {
    display: none;
  }

  .text {
    padding-bottom: 1em;
  }

  section {
    break-inside: avoid;
  }

  .gallery-holder .gallery-holder__gallery {
    width: 100%;
  }
}
/*# sourceMappingURL=bogdan.780f6d97.css.map */