@font-face {
  font-family: "Overpass Mono";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../assets/fonts/overpass-mono-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Overpass Mono";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../assets/fonts/overpass-mono-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Overpass";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../assets/fonts/overpass-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Overpass";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../assets/fonts/overpass-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

body,
h1,
h2,
h3,
p,
figure,
ul,
ol {
  margin: 0;
  padding: 0;
}

ul,
ol {
  list-style: none;
}

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

button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  cursor: pointer;
}

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

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}
:root {
  --spacing-none: 0;
  --spacing-3xs: 4px;
  --spacing-2xs: 8px;
  --spacing-xs: 16px;
  --spacing-sm: 24px;
  --spacing-md: clamp(24px, 2.2222222222vw, 32px);
  --spacing-lg: clamp(32px, 2.7777777778vw, 40px);
  --spacing-xl: clamp(32px, 3.3333333333vw, 48px);
  --spacing-2xl: clamp(32px, 4.4444444444vw, 64px);
  --spacing-3xl: clamp(32px, 5.5555555556vw, 80px);
  --wrapper-margin: clamp(24px, 4.1666666667vw, 60px);
  --wrapper-width: 1320px;
  --grid-gap: 24px;
  --type-h1-size: clamp(45px, 8.3333333333vw, 120px);
  --type-h1-lh: 0.9167;
  --type-h2-size: clamp(30px, 2.7777777778vw, 40px);
  --type-h2-lh: 1.25;
  --type-h3-size: clamp(20px, 1.8055555556vw, 26px);
  --type-h3-lh: 1.1539;
  --type-button-size: clamp(25px, 2.4305555556vw, 35px);
  --type-button-lh: 1;
  --type-menu-size: clamp(20px, 2.0833333333vw, 30px);
  --type-menu-lh: 1.2667;
  --type-menu-footer-size: clamp(18px, 1.3888888889vw, 20px);
  --type-menu-footer-lh: 1.3;
  --type-copy-size: clamp(17px, 1.3888888889vw, 20px);
  --type-copy-lh: 1.3;
  --type-copy-ls: 0.02em;
  --type-h4-size: clamp(17px, 1.3888888889vw, 20px);
  --type-h4-lh: 1.3;
  --type-h4b-size: 20px;
  --type-h4b-lh: 1.3;
  --type-intro-size: clamp(19px, 1.5972222222vw, 23px);
  --type-intro-lh: 1.3913;
  --type-desc-size: clamp(17px, 1.25vw, 18px);
  --type-desc-lh: 1.3889;
  --type-std-size: clamp(17px, 1.3888888889vw, 20px);
  --type-std-lh: 1.3;
  --type-std-ls: 0.05em;
  --logo-header-size: clamp(143px, 16.9444444444vw, 244px);
  --logo-footer-size: clamp(145px, 13.3333333333vw, 192px);
  --header-arrow-w: clamp(40px, 4.9305555556vw, 71px);
  --header-arrow-h: clamp(51px, 6.3194444444vw, 91px);
  --button-icon-w: clamp(58.451px, 7.4305555556vw, 107px);
  --button-icon-h: clamp(50px, 6.3469444444vw, 91.396px);
  --arrow-ellipse-size: clamp(50px, 5.8333333333vw, 84px);
  --social-icon-size: 63px;
  --overlay-gap: 31px;
  --button-label-padding: clamp(16px, 2.2222222222vw, 32px);
  --header-image-ratio: 1440 / 672;
  --image-large-ratio: 1320 / 681;
  --image-medium-ratio: 660 / 474;
  --image-square-size: clamp(254px, 37.2222222222vw, 536px);
  --case-text-min: 424px;
  --list-icon-size: 24px;
  --image-grid-gap: 0;
  --wrapper-narrow: 872px;
  --icon-expertise-size: clamp(100px, 12.0138888889vw, 173px);
  --software-icon-size: clamp(40px, 4.4444444444vw, 64px);
  --vita-line-width: 24px;
  --vita-line-height: 60px;
  --vita-date-max: 280px;
  --stack-gap: 2px;
  --art-ratio-portrait: 424 / 496;
  --art-ratio-landscape: 424 / 320;
  --lightbox-nav-size: clamp(50px, 5.8333333333vw, 84px);
  --img-arrow: url(../assets/img/arrow.svg);
  --img-button-arrow: url(../assets/img/button-arrow.svg);
  --img-arrow-ellipse: url(../assets/img/arrow-ellipse.svg);
  --img-list-icon: url(../assets/img/list-icon.svg);
}

@media (max-width: 600px) {
  :root {
    --spacing-md: 24px;
    --spacing-lg: 32px;
    --spacing-xl: 32px;
    --spacing-2xl: 32px;
    --spacing-3xl: 32px;
    --wrapper-margin: 24px;
    --type-h1-size: 45px;
    --type-h1-lh: 1.0667;
    --type-h2-size: 30px;
    --type-h2-lh: 1.3333;
    --type-h3-size: 20px;
    --type-h3-lh: 1.25;
    --type-button-size: 25px;
    --type-button-lh: 1;
    --type-menu-size: 20px;
    --type-menu-lh: 1.3;
    --type-menu-footer-size: 18px;
    --type-menu-footer-lh: 1.2778;
    --type-copy-size: 17px;
    --type-copy-lh: 1.1765;
    --type-h4-size: 17px;
    --type-h4-lh: 1.1765;
    --type-h4b-size: 20px;
    --type-h4b-lh: 1.25;
    --type-intro-size: 19px;
    --type-intro-lh: 1.3158;
    --type-desc-size: 17px;
    --type-desc-lh: 1.1765;
    --type-std-size: 17px;
    --type-std-lh: 1.1765;
    --logo-header-size: 143px;
    --logo-footer-size: 145px;
    --header-arrow-w: 40px;
    --header-arrow-h: 51px;
    --button-icon-w: 58.451px;
    --button-icon-h: 50px;
    --arrow-ellipse-size: 50px;
    --overlay-gap: 24px;
    --button-label-padding: 16px;
    --header-image-ratio: 300 / 448;
    --image-square-size: 100%;
    --case-text-min: 254px;
    --list-icon-size: 16px;
    --image-grid-gap: 24px;
    --icon-expertise-size: 100px;
    --software-icon-size: 40px;
    --vita-line-width: 16px;
    --lightbox-nav-size: 50px;
    --img-arrow: url(../assets/img/arrow-mobile.svg);
    --img-button-arrow: url(../assets/img/button-arrow-mobile.svg);
    --img-arrow-ellipse: url(../assets/img/arrow-ellipse-mobile.svg);
    --img-list-icon: url(../assets/img/list-icon-mobile.svg);
  }
}
body {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 400;
  font-size: var(--type-copy-size);
  line-height: var(--type-copy-lh);
  letter-spacing: var(--type-copy-ls);
  min-height: 100vh;
  color: #000000;
  background-color: #ffffff;
  overflow-x: hidden;
}
body.is-menu-open {
  overflow: hidden;
}

.wrapper {
  width: 100%;
  max-width: var(--wrapper-width);
  margin-inline: auto;
}

.page-stack {
  display: flex;
  flex-direction: column;
  gap: var(--stack-gap);
  align-items: flex-start;
  width: 100%;
}

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

.skip-link {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-menu-footer-size);
  line-height: var(--type-menu-footer-lh);
  letter-spacing: 0;
}
.skip-link:focus-visible {
  outline: 2px solid #000000;
  outline-offset: 4px;
}
.skip-link {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 100;
  padding: 8px 16px;
  color: #ffffff;
  background-color: #000000;
  transform: translateY(-200%);
}
.skip-link:focus-visible {
  transform: translateY(0);
}

.js [data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s cubic-bezier(0.22, 0.61, 0.36, 1), transform 0.7s cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: opacity, transform;
}

.js [data-reveal].is-revealed {
  opacity: 1;
  transform: none;
  will-change: auto;
}

.js .case-grid__item:nth-child(3n+2) {
  transition-delay: 0.08s;
}
.js .case-grid__item:nth-child(3n+3) {
  transition-delay: 0.16s;
}
@media (max-width: 1100px) {
  .js .case-grid__item:nth-child(3n+2), .js .case-grid__item:nth-child(3n+3) {
    transition-delay: 0s;
  }
  .js .case-grid__item:nth-child(2n) {
    transition-delay: 0.08s;
  }
}
@media (max-width: 600px) {
  .js .case-grid__item:nth-child(n) {
    transition-delay: 0s;
  }
}

@media (prefers-reduced-motion: reduce) {
  .js [data-reveal] {
    opacity: 1;
    transform: none;
    transition: none;
  }
}
.navi {
  position: sticky;
  top: 0;
  z-index: 30;
  width: 100%;
  background-color: #ffffff;
  border-bottom: 1px solid transparent;
  transition: border-color 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.navi.is-scrolled, .navi--solid {
  border-bottom-color: #000000;
}

.navi__bar {
  padding-inline: var(--wrapper-margin);
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 65px;
}

.navi__logo {
  display: flex;
  align-items: center;
  align-self: stretch;
  padding-block: 4px;
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity 0.35s cubic-bezier(0.22, 0.61, 0.36, 1), transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.navi.is-scrolled .navi__logo, .navi--solid .navi__logo {
  opacity: 1;
  transform: none;
}

.navi__logo-img {
  width: 56px;
  height: 56px;
  object-fit: contain;
}

.navi__burger-frame {
  display: flex;
  align-items: center;
  align-self: stretch;
  padding-block: 4px;
}

@media (prefers-reduced-motion: reduce) {
  .navi__logo {
    transform: none;
  }
}
.site-footer {
  width: 100%;
  padding-top: var(--spacing-lg);
  background-color: #ffffff;
}

.site-footer__inner {
  padding-inline: var(--wrapper-margin);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: var(--spacing-xl);
  background-color: #000000;
}

.site-footer__menu {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.site-footer__menu .level_1 {
  display: flex;
  flex-direction: column;
  gap: 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.site-footer__menu .nav-item > a,
.site-footer__menu-link {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-menu-footer-size);
  line-height: var(--type-menu-footer-lh);
  letter-spacing: 0;
}
.site-footer__menu .nav-item > a:focus-visible,
.site-footer__menu-link:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 4px;
}
.site-footer__menu .nav-item > a,
.site-footer__menu-link {
  color: #ffffff;
  white-space: nowrap;
  transition: color 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.site-footer__logo {
  width: var(--logo-footer-size);
  height: var(--logo-footer-size);
  object-fit: cover;
}

.site-footer__social {
  display: flex;
  gap: var(--spacing-lg);
  align-items: center;
}

.site-footer__social-link:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 4px;
}
.site-footer__social-link {
  display: block;
  transition: opacity 0.2s cubic-bezier(0.22, 0.61, 0.36, 1), transform 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.site-footer__social-icon--linkedin {
  display: block;
  flex-shrink: 0;
  width: var(--social-icon-size);
  height: var(--social-icon-size);
  background-image: url("../assets/img/icon-linkedin.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.site-footer__social-icon--instagram {
  display: block;
  flex-shrink: 0;
  width: var(--social-icon-size);
  height: var(--social-icon-size);
  background-image: url("../assets/img/icon-instagram.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

@media (max-width: 600px) {
  .site-footer__inner {
    flex-direction: column;
    gap: var(--spacing-md);
  }
  .site-footer__logo {
    order: 1;
  }
  .site-footer__menu {
    order: 2;
    align-items: center;
    width: 224px;
    max-width: 100%;
    text-align: center;
  }
  .site-footer__social {
    order: 3;
  }
}
@media (hover: hover) {
  .site-footer__menu .nav-item > a:hover,
  .site-footer__menu-link:hover {
    color: #e73441;
    text-decoration: underline;
    text-underline-offset: 0.25em;
  }
  .site-footer__social-link:hover {
    opacity: 0.7;
    transform: translateY(-2px);
  }
  .site-footer__logo {
    transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
  }
  .site-footer__inner:hover .site-footer__logo {
    transform: scale(1.03);
  }
}
.burger:focus-visible {
  outline: 2px solid #000000;
  outline-offset: 4px;
}
.burger {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 65px;
  height: 100%;
  padding-block: 24px;
  padding-left: 8px;
  padding-right: 8px;
  color: #000000;
  background-color: #ffffff;
}

.burger__lines {
  position: relative;
  display: block;
  flex-shrink: 0;
  width: 49px;
  height: 18.425px;
  transition: transform 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.burger__lines::before, .burger__lines::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: currentcolor;
}
.burger__lines::before {
  top: 0;
}
.burger__lines::after {
  bottom: 0;
}

.burger__close {
  position: relative;
  display: none;
  flex-shrink: 0;
  width: 57.002px;
  height: 57.002px;
}

.burger__close-part::before, .burger__close-part::after {
  content: "";
  position: absolute;
  background-color: currentcolor;
}
.burger__close-part::before {
  top: 0;
  left: 50%;
  width: 2px;
  height: 100%;
  transform: translateX(-50%);
}
.burger__close-part::after {
  top: 50%;
  left: 0;
  width: 100%;
  height: 2px;
  transform: translateY(-50%);
}
.burger__close-part {
  position: absolute;
  top: 8.348px;
  left: 8.348px;
  width: 40.306px;
  height: 40.306px;
}
.burger__close-part--b {
  transform: rotate(-45deg);
}

.burger[aria-expanded=true] {
  padding-inline: 8px;
}
.burger[aria-expanded=true] .burger__lines {
  display: none;
}
.burger[aria-expanded=true] .burger__close {
  display: block;
}

@media (hover: hover) {
  .burger[aria-expanded=false]:hover .burger__lines {
    transform: scaleX(1.12);
  }
}
.dropdown-menu {
  position: fixed;
  inset: 65px 0 0 0;
  z-index: 20;
  display: flex;
  justify-content: center;
  padding-top: var(--spacing-3xl);
  padding-inline: 24px;
  overflow-y: auto;
  background-color: #ffffff;
}
.dropdown-menu[hidden] {
  display: none;
}

.dropdown-menu .level_1 {
  display: flex;
  flex: 1 0 0;
  list-style: none;
  margin: 0;
  padding: 0;
  flex-direction: column;
  gap: var(--spacing-md);
  align-items: center;
  min-width: 0;
}

.dropdown-menu .nav-item {
  display: flex;
  align-items: center;
  justify-content: center;
}

.dropdown-menu .nav-item > a,
.dropdown-menu .nav-item > button {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-menu-size);
  line-height: var(--type-menu-lh);
  letter-spacing: 0;
}
.dropdown-menu .nav-item > a:focus-visible,
.dropdown-menu .nav-item > button:focus-visible {
  outline: 2px solid #000000;
  outline-offset: 4px;
}
.dropdown-menu .nav-item > a,
.dropdown-menu .nav-item > button {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  color: #000000;
  text-align: center;
  transition: color 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.dropdown-menu .nav-item > a[data-current=true] {
  color: #e73441;
}

@media (hover: hover) {
  .dropdown-menu .nav-item > a:not([data-current=true]):hover {
    color: #e73441;
  }
}
.page-header {
  padding-inline: var(--wrapper-margin);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3xs);
  align-items: center;
  width: 100%;
  padding-block: var(--spacing-2xl);
  background-color: #ffffff;
}

.page-header__row {
  width: 100%;
  max-width: var(--wrapper-width);
  margin-inline: auto;
  display: flex;
  gap: var(--spacing-xs);
  align-items: center;
}

.page-header__logo {
  flex-shrink: 0;
  width: var(--logo-header-size);
  height: var(--logo-header-size);
  object-fit: cover;
}

.page-header__title {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h1-size);
  line-height: var(--type-h1-lh);
  letter-spacing: 0;
  text-transform: uppercase;
  flex: 1 0 0;
  min-width: 0;
  color: #000000;
}

.page-header__subline {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 400;
  font-size: var(--type-copy-size);
  line-height: var(--type-copy-lh);
  letter-spacing: var(--type-copy-ls);
  flex: 1 0 0;
  min-width: 0;
  color: #000000;
}

.page-header__arrow {
  display: block;
  flex-shrink: 0;
  width: var(--header-arrow-w);
  height: var(--header-arrow-h);
  background-image: var(--img-arrow);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
}

@media (max-width: 600px) {
  .page-header__row {
    flex-direction: column;
    align-items: flex-start;
  }
  .page-header__title,
  .page-header__subline {
    flex: none;
    width: 100%;
  }
}
.case-grid {
  padding-inline: var(--wrapper-margin);
  width: 100%;
  background-color: #ffffff;
}

.case-grid__list {
  width: 100%;
  max-width: var(--wrapper-width);
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--grid-gap);
}
@media (max-width: 1100px) {
  .case-grid__list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 600px) {
  .case-grid__list {
    grid-template-columns: 1fr;
  }
}

.case-tile:focus-visible {
  outline: 2px solid #000000;
  outline-offset: 4px;
}
.case-tile {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 424/500;
  overflow: hidden;
}

.case-tile__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-color: #e6eaec;
  transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.case-tile__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  gap: var(--overlay-gap);
  align-items: center;
  justify-content: center;
  padding-inline: var(--spacing-md);
  background-color: #e73441;
  opacity: 0;
  transition: opacity 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.case-tile__headline {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h3-size);
  line-height: var(--type-h3-lh);
  letter-spacing: 0;
  width: 100%;
  color: #ffffff;
  text-align: center;
}

.case-tile__description {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 400;
  font-size: var(--type-copy-size);
  line-height: var(--type-copy-lh);
  letter-spacing: var(--type-copy-ls);
  width: 100%;
  color: #ffffff;
  text-align: center;
}

.case-tile__arrow {
  display: block;
  flex-shrink: 0;
  width: var(--arrow-ellipse-size);
  height: var(--arrow-ellipse-size);
  background-image: var(--img-arrow-ellipse);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  transform: translateY(8px);
  transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

@media (hover: hover) {
  .case-tile:hover .case-tile__overlay {
    opacity: 1;
  }
  .case-tile:hover .case-tile__arrow {
    transform: none;
  }
  .case-tile:hover .case-tile__img {
    transform: scale(1.04);
  }
}
.case-tile.is-active .case-tile__overlay,
.case-tile:focus-visible .case-tile__overlay {
  opacity: 1;
}
.case-tile.is-active .case-tile__arrow,
.case-tile:focus-visible .case-tile__arrow {
  transform: none;
}
.case-tile.is-active .case-tile__img,
.case-tile:focus-visible .case-tile__img {
  transform: scale(1.04);
}

.header-image {
  width: 100%;
  aspect-ratio: var(--header-image-ratio);
  overflow: hidden;
  background-color: #e6eaec;
}

.header-image__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.case-intro {
  padding-inline: var(--wrapper-margin);
  width: 100%;
  padding-block: var(--spacing-xl);
  background-color: #ffffff;
}

.case-intro__inner {
  width: 100%;
  max-width: var(--wrapper-width);
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
}

.case-intro__text {
  display: flex;
  flex: 1 0 0;
  flex-direction: column;
  gap: var(--spacing-xl);
  min-width: var(--case-text-min);
  padding-right: var(--spacing-2xl);
  padding-block: var(--spacing-md);
}

.case-intro__headline {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h2-size);
  line-height: var(--type-h2-lh);
  letter-spacing: 0;
  width: 100%;
  color: #000000;
}

.case-intro__tasks {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
  width: 100%;
}

.case-intro__tasks-title {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h3-size);
  line-height: var(--type-h3-lh);
  letter-spacing: 0;
  width: 100%;
  color: #000000;
}

.case-intro__collaboration {
  margin-top: var(--spacing-sm);
}

.task-list {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

.task-list__item {
  display: flex;
  gap: var(--spacing-xs);
  align-items: flex-start;
}

.task-list__icon {
  display: block;
  flex-shrink: 0;
  width: var(--list-icon-size);
  height: var(--list-icon-size);
  background-image: var(--img-list-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.task-list__text {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 400;
  font-size: var(--type-copy-size);
  line-height: var(--type-copy-lh);
  letter-spacing: var(--type-copy-ls);
  flex: 1 0 0;
  min-width: 0;
  color: #000000;
}

.case-intro__square {
  flex-shrink: 0;
  width: var(--image-square-size);
  max-width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
  background-color: #e6eaec;
}

.case-intro__square-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.image-grid {
  padding-inline: var(--wrapper-margin);
  width: 100%;
  background-color: #ffffff;
}

.image-grid__inner {
  width: 100%;
  max-width: var(--wrapper-width);
  margin-inline: auto;
  display: flex;
  gap: var(--image-grid-gap);
}

.image-grid__item {
  overflow: hidden;
  background-color: #e6eaec;
}

.image-grid__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-color: #e6eaec;
}

.image-grid--two .image-grid__item {
  flex: 1 0 0;
  min-width: 0;
  aspect-ratio: var(--image-medium-ratio);
}

.image-grid--one .image-grid__item {
  width: 100%;
  aspect-ratio: var(--image-large-ratio);
}

@media (max-width: 600px) {
  .image-grid--two .image-grid__inner {
    flex-direction: column;
  }
  .image-grid--two .image-grid__item {
    flex: none;
    width: 100%;
  }
  .image-grid {
    padding-top: var(--image-grid-gap);
  }
}
.related {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  width: 100%;
  padding-block: var(--spacing-3xl);
  background-color: #ffffff;
}

.related__headline {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h2-size);
  line-height: var(--type-h2-lh);
  letter-spacing: 0;
  color: #000000;
  text-align: center;
}

.textblock {
  padding-inline: var(--wrapper-margin);
  display: flex;
  justify-content: center;
  width: 100%;
  padding-block: var(--spacing-xl);
  background-color: #ffffff;
}

.textblock__inner {
  width: 100%;
  max-width: var(--wrapper-width);
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.textblock--h1 {
  padding-block: var(--spacing-3xl);
}

.textblock--h4 {
  padding-block: var(--spacing-md);
}

.textblock--narrow .textblock__inner {
  max-width: var(--wrapper-narrow);
}

.textblock--center .textblock__inner {
  align-items: center;
  text-align: center;
}

.textblock__h1 {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h1-size);
  line-height: var(--type-h1-lh);
  letter-spacing: 0;
  text-transform: uppercase;
  width: 100%;
  color: #000000;
}

.textblock__h2 {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h2-size);
  line-height: var(--type-h2-lh);
  letter-spacing: 0;
  color: #000000;
}

.textblock__h3 {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h3-size);
  line-height: var(--type-h3-lh);
  letter-spacing: 0;
  color: #000000;
}

.textblock__pair {
  display: flex;
  flex-direction: column;
  gap: 8px;
  justify-content: center;
  width: 100%;
}

.textblock__pair--lead {
  gap: var(--spacing-xs);
}

.textblock__pair-title {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h4b-size);
  line-height: var(--type-h4b-lh);
  letter-spacing: var(--type-copy-ls);
  color: #000000;
}

.textblock__pair-copy {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 400;
  font-size: var(--type-copy-size);
  line-height: var(--type-copy-lh);
  letter-spacing: var(--type-copy-ls);
  color: #000000;
}

.textblock--image .textblock__inner {
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--spacing-lg);
  align-items: flex-start;
}

.textblock__copy {
  display: flex;
  flex: 1 0 0;
  flex-direction: column;
  gap: var(--spacing-xl);
  min-width: var(--case-text-min);
  padding-top: var(--spacing-md);
}

.textblock__intro {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 400;
  font-size: var(--type-intro-size);
  line-height: var(--type-intro-lh);
  letter-spacing: var(--type-copy-ls);
  width: 100%;
  color: #000000;
  overflow-wrap: break-word;
}

.textblock__square {
  flex-shrink: 0;
  width: var(--image-square-size);
  max-width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
  background-color: #e6eaec;
}

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

.textblock--image-left .textblock__square {
  order: -1;
}

@media (max-width: 600px) {
  .textblock__square {
    flex: 1 0 0;
    width: auto;
    min-width: min(var(--case-text-min), 100%);
  }
  .textblock--image-left .textblock__square {
    order: 0;
  }
}
.textblock__mail:focus-visible,
.email:focus-visible {
  outline: 2px solid #000000;
  outline-offset: 4px;
}
.textblock__mail,
.email {
  font-weight: 700;
  color: #e73441;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.expertise {
  padding-inline: var(--wrapper-margin);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-lg);
  align-items: center;
  width: 100%;
  padding-block: var(--spacing-xl);
  background-color: #ffffff;
  border-top: 1px solid #000000;
  border-bottom: 1px solid #000000;
}

.expertise__row {
  width: 100%;
  max-width: var(--wrapper-width);
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  align-items: center;
}

.expertise__item {
  display: flex;
  flex: 1 0 0;
  flex-wrap: wrap;
  gap: var(--spacing-lg);
  align-items: center;
  min-width: min(320px, 100%);
}

.expertise__icon {
  flex-shrink: 0;
  width: var(--icon-expertise-size);
  height: var(--icon-expertise-size);
  object-fit: contain;
}

.expertise__text {
  display: flex;
  flex: 1 0 0;
  flex-direction: column;
  gap: var(--spacing-xs);
  align-items: flex-start;
  min-width: min(var(--case-text-min), 100%);
}

.expertise__headline {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h3-size);
  line-height: var(--type-h3-lh);
  letter-spacing: 0;
  width: 100%;
  color: #000000;
}

.expertise__description {
  font-family: "Overpass", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 400;
  font-size: var(--type-desc-size);
  line-height: var(--type-desc-lh);
  letter-spacing: var(--type-std-ls);
  width: 100%;
  color: #000000;
}

.software {
  padding-inline: var(--wrapper-margin);
  display: flex;
  justify-content: center;
  width: 100%;
  padding-block: var(--spacing-xl);
  background-color: #ffffff;
  border-bottom: 1px solid #000000;
}

.software__list {
  width: 100%;
  max-width: var(--wrapper-width);
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-lg);
  align-items: center;
  justify-content: space-between;
}

.software__icon {
  flex-shrink: 0;
  width: var(--software-icon-size);
  height: auto;
  object-fit: contain;
}

@media (max-width: 600px) {
  .software__list {
    justify-content: flex-start;
  }
}
.vita {
  padding-inline: var(--wrapper-margin);
  display: flex;
  justify-content: center;
  width: 100%;
  background-color: #ffffff;
}

.vita__list {
  display: flex;
  flex: 1 0 0;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: center;
  max-width: var(--wrapper-narrow);
  min-width: 0;
}

.vita__line {
  position: relative;
  flex-shrink: 0;
  width: var(--vita-line-width);
  height: var(--vita-line-height);
}
.vita__line::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 2px;
  height: 100%;
  background-color: currentcolor;
  transform: translateX(-50%);
}

.vita__station {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  align-items: center;
  width: 100%;
}

.vita__icon {
  display: block;
  flex-shrink: 0;
  width: var(--list-icon-size);
  height: var(--list-icon-size);
  background-image: var(--img-list-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.vita__date {
  font-family: "Overpass", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 300;
  font-size: var(--type-std-size);
  line-height: var(--type-std-lh);
  letter-spacing: var(--type-std-ls);
  font-weight: 700;
  flex: 1 0 0;
  max-width: var(--vita-date-max);
  min-width: 112px;
  color: #000000;
}

.vita__entry {
  display: flex;
  flex: 1 0 0;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  min-width: 212px;
}

.vita__role {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h4-size);
  line-height: var(--type-h4-lh);
  letter-spacing: var(--type-copy-ls);
  width: 100%;
  color: #000000;
}

.vita__place {
  font-family: "Overpass", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 300;
  font-size: var(--type-std-size);
  line-height: var(--type-std-lh);
  letter-spacing: var(--type-std-ls);
  width: 100%;
  color: #000000;
}

.legal {
  padding-inline: var(--wrapper-margin);
  display: flex;
  justify-content: center;
  width: 100%;
  padding-bottom: var(--spacing-3xl);
  background-color: #ffffff;
}

.legaltext {
  width: 100%;
  max-width: var(--wrapper-narrow);
  color: #000000;
}
.legaltext h2 {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h2-size);
  line-height: var(--type-h2-lh);
  letter-spacing: 0;
  margin-top: var(--spacing-2xl);
  margin-bottom: var(--spacing-xs);
}
.legaltext h2:first-child {
  margin-top: 0;
}
.legaltext h3 {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h3-size);
  line-height: var(--type-h3-lh);
  letter-spacing: 0;
  margin-top: var(--spacing-lg);
  margin-bottom: 8px;
}
.legaltext h4 {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h4-size);
  line-height: var(--type-h4-lh);
  letter-spacing: var(--type-copy-ls);
  margin-top: var(--spacing-md);
  margin-bottom: 8px;
}
.legaltext p {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 400;
  font-size: var(--type-copy-size);
  line-height: var(--type-copy-lh);
  letter-spacing: var(--type-copy-ls);
  margin-bottom: var(--spacing-xs);
  overflow-wrap: break-word;
}
.legaltext ul {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: var(--spacing-xs);
}
.legaltext li {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 400;
  font-size: var(--type-copy-size);
  line-height: var(--type-copy-lh);
  letter-spacing: var(--type-copy-ls);
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.legaltext li::before {
  display: block;
  flex-shrink: 0;
  width: var(--list-icon-size);
  height: var(--list-icon-size);
  background-image: var(--img-list-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  content: "";
  margin-top: 0.2em;
}
.legaltext ul.noicon li::before {
  display: none;
}
.legaltext a:focus-visible {
  outline: 2px solid #000000;
  outline-offset: 4px;
}
.legaltext a {
  color: #e73441;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}
.legaltext .legal__button {
  padding: 0;
  border: 0;
  font: inherit;
  cursor: pointer;
}

.art-grid {
  padding-inline: var(--wrapper-margin);
  display: flex;
  justify-content: center;
  width: 100%;
  padding-top: 24px;
  background-color: #ffffff;
}

.art-grid__inner {
  width: 100%;
  max-width: var(--wrapper-width);
  margin-inline: auto;
  display: flex;
  gap: 24px;
  align-items: flex-start;
}

.art-grid__col {
  display: flex;
  flex: 1 0 0;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  min-width: 0;
}

.art-tile:focus-visible {
  outline: 2px solid #000000;
  outline-offset: 4px;
}
.art-tile {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
  background-color: #e6eaec;
}
.art-tile::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.3);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.art-tile--landscape {
  aspect-ratio: var(--art-ratio-landscape);
}
.art-tile--portrait {
  aspect-ratio: var(--art-ratio-portrait);
}

.art-tile__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

@media (hover: hover) {
  .art-tile:hover .art-tile__img {
    transform: scale(1.04);
  }
  .art-tile:hover::after {
    opacity: 1;
  }
}
.art-tile:focus-visible .art-tile__img {
  transform: scale(1.04);
}
.art-tile:focus-visible::after {
  opacity: 1;
}

@media (max-width: 600px) {
  .art-grid__inner {
    flex-direction: column;
  }
  .art-grid__col {
    flex: none;
    width: 100%;
  }
}
/*! PhotoSwipe main CSS by Dmytro Semenov | photoswipe.com */
.pswp {
  --pswp-bg: #000;
  --pswp-placeholder-bg: #222;
  --pswp-root-z-index: 100000;
  --pswp-preloader-color: rgba(79, 79, 79, 0.4);
  --pswp-preloader-color-secondary: rgba(255, 255, 255, 0.9);
  /* defined via js:
  --pswp-transition-duration: 333ms; */
  --pswp-icon-color: #fff;
  --pswp-icon-color-secondary: #4f4f4f;
  --pswp-icon-stroke-color: #4f4f4f;
  --pswp-icon-stroke-width: 2px;
  --pswp-error-text-color: var(--pswp-icon-color);
}

/*
	Styles for basic PhotoSwipe (pswp) functionality (sliding area, open/close transitions)
*/
.pswp {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: var(--pswp-root-z-index);
  display: none;
  touch-action: none;
  outline: 0;
  opacity: 0.003;
  contain: layout style size;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* Prevents focus outline on the root element,
  (it may be focused initially) */
.pswp:focus {
  outline: 0;
}

.pswp * {
  box-sizing: border-box;
}

.pswp img {
  max-width: none;
}

.pswp--open {
  display: block;
}

.pswp,
.pswp__bg {
  transform: translateZ(0);
  will-change: opacity;
}

.pswp__bg {
  opacity: 0.005;
  background: var(--pswp-bg);
}

.pswp,
.pswp__scroll-wrap {
  overflow: hidden;
}

.pswp__scroll-wrap,
.pswp__bg,
.pswp__container,
.pswp__item,
.pswp__content,
.pswp__img,
.pswp__zoom-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.pswp__img,
.pswp__zoom-wrap {
  width: auto;
  height: auto;
}

.pswp--click-to-zoom.pswp--zoom-allowed .pswp__img {
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  cursor: zoom-in;
}

.pswp--click-to-zoom.pswp--zoomed-in .pswp__img {
  cursor: move;
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: grab;
}

.pswp--click-to-zoom.pswp--zoomed-in .pswp__img:active {
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: grabbing;
}

/* :active to override grabbing cursor */
.pswp--no-mouse-drag.pswp--zoomed-in .pswp__img,
.pswp--no-mouse-drag.pswp--zoomed-in .pswp__img:active,
.pswp__img {
  cursor: -webkit-zoom-out;
  cursor: -moz-zoom-out;
  cursor: zoom-out;
}

/* Prevent selection and tap highlights */
.pswp__container,
.pswp__img,
.pswp__button,
.pswp__counter {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.pswp__item {
  /* z-index for fade transition */
  z-index: 1;
  overflow: hidden;
}

.pswp__hidden {
  display: none !important;
}

/* Allow to click through pswp__content element, but not its children */
.pswp__content {
  pointer-events: none;
}

.pswp__content > * {
  pointer-events: auto;
}

/*

  PhotoSwipe UI

*/
/*
	Error message appears when image is not loaded
	(JS option errorMsg controls markup)
*/
.pswp__error-msg-container {
  display: grid;
}

.pswp__error-msg {
  margin: auto;
  font-size: 1em;
  line-height: 1;
  color: var(--pswp-error-text-color);
}

/*
class pswp__hide-on-close is applied to elements that
should hide (for example fade out) when PhotoSwipe is closed
and show (for example fade in) when PhotoSwipe is opened
 */
.pswp .pswp__hide-on-close {
  opacity: 0.005;
  will-change: opacity;
  transition: opacity var(--pswp-transition-duration) cubic-bezier(0.4, 0, 0.22, 1);
  z-index: 10; /* always overlap slide content */
  pointer-events: none; /* hidden elements should not be clickable */
}

/* class pswp--ui-visible is added when opening or closing transition starts */
.pswp--ui-visible .pswp__hide-on-close {
  opacity: 1;
  pointer-events: auto;
}

/* <button> styles, including css reset */
.pswp__button {
  position: relative;
  display: block;
  width: 50px;
  height: 60px;
  padding: 0;
  margin: 0;
  overflow: hidden;
  cursor: pointer;
  background: none;
  border: 0;
  box-shadow: none;
  opacity: 0.85;
  -webkit-appearance: none;
  -webkit-touch-callout: none;
}

.pswp__button:hover,
.pswp__button:active,
.pswp__button:focus {
  transition: none;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
  opacity: 1;
}

.pswp__button:disabled {
  opacity: 0.3;
  cursor: auto;
}

.pswp__icn {
  fill: var(--pswp-icon-color);
  color: var(--pswp-icon-color-secondary);
}

.pswp__icn {
  position: absolute;
  top: 14px;
  left: 9px;
  width: 32px;
  height: 32px;
  overflow: hidden;
  pointer-events: none;
}

.pswp__icn-shadow {
  stroke: var(--pswp-icon-stroke-color);
  stroke-width: var(--pswp-icon-stroke-width);
  fill: none;
}

.pswp__icn:focus {
  outline: 0;
}

/*
	div element that matches size of large image,
	large image loads on top of it,
	used when msrc is not provided
*/
div.pswp__img--placeholder,
.pswp__img--with-bg {
  background: var(--pswp-placeholder-bg);
}

.pswp__top-bar {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 60px;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  z-index: 10;
  /* allow events to pass through top bar itself */
  pointer-events: none !important;
}

.pswp__top-bar > * {
  pointer-events: auto;
  /* this makes transition significantly more smooth,
     even though inner elements are not animated */
  will-change: opacity;
}

/*

  Close button

*/
.pswp__button--close {
  margin-right: 6px;
}

/*

  Arrow buttons

*/
.pswp__button--arrow {
  position: absolute;
  top: 0;
  width: 75px;
  height: 100px;
  top: 50%;
  margin-top: -50px;
}

.pswp__button--arrow:disabled {
  display: none;
  cursor: default;
}

.pswp__button--arrow .pswp__icn {
  top: 50%;
  margin-top: -30px;
  width: 60px;
  height: 60px;
  background: none;
  border-radius: 0;
}

.pswp--one-slide .pswp__button--arrow {
  display: none;
}

/* hide arrows on touch screens */
.pswp--touch .pswp__button--arrow {
  visibility: hidden;
}

/* show arrows only after mouse was used */
.pswp--has_mouse .pswp__button--arrow {
  visibility: visible;
}

.pswp__button--arrow--prev {
  right: auto;
  left: 0px;
}

.pswp__button--arrow--next {
  right: 0px;
}

.pswp__button--arrow--next .pswp__icn {
  left: auto;
  right: 14px;
  /* flip horizontally */
  transform: scale(-1, 1);
}

/*

  Zoom button

*/
.pswp__button--zoom {
  display: none;
}

.pswp--zoom-allowed .pswp__button--zoom {
  display: block;
}

/* "+" => "-" */
.pswp--zoomed-in .pswp__zoom-icn-bar-v {
  display: none;
}

/*

  Loading indicator

*/
.pswp__preloader {
  position: relative;
  overflow: hidden;
  width: 50px;
  height: 60px;
  margin-right: auto;
}

.pswp__preloader .pswp__icn {
  opacity: 0;
  transition: opacity 0.2s linear;
  animation: pswp-clockwise 600ms linear infinite;
}

.pswp__preloader--active .pswp__icn {
  opacity: 0.85;
}

@keyframes pswp-clockwise {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/*

  "1 of 10" counter

*/
.pswp__counter {
  height: 30px;
  margin-top: 15px;
  margin-inline-start: 20px;
  font-size: 14px;
  line-height: 30px;
  color: var(--pswp-icon-color);
  text-shadow: 1px 1px 3px var(--pswp-icon-color-secondary);
  opacity: 0.85;
}

.pswp--one-slide .pswp__counter {
  display: none;
}

.pswp {
  --pswp-bg: #000;
  --pswp-placeholder-bg: #000;
  z-index: 60;
}

.pswp__top-bar {
  justify-content: center;
  height: 65px;
}

.pswp__preloader {
  position: absolute;
  top: 0;
  left: 0;
}

.pswp .pswp__button--close:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 4px;
}
.pswp .pswp__button--close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 65px;
  height: 65px;
  margin: 0;
  padding-inline: 8px;
  padding-block: 24px;
  color: #ffffff;
  opacity: 1;
}

.lightbox__close-icon {
  position: relative;
  flex-shrink: 0;
  width: 40.306px;
  height: 40.306px;
  transform: rotate(-45deg);
}
.lightbox__close-icon::before, .lightbox__close-icon::after {
  content: "";
  position: absolute;
  background-color: currentcolor;
}
.lightbox__close-icon::before {
  top: 0;
  left: 50%;
  width: 2px;
  height: 100%;
  transform: translateX(-50%);
}
.lightbox__close-icon::after {
  top: 50%;
  left: 0;
  width: 100%;
  height: 2px;
  transform: translateY(-50%);
}

.pswp .pswp__button--arrow {
  display: block;
  flex-shrink: 0;
  width: var(--lightbox-nav-size);
  height: var(--lightbox-nav-size);
  background-image: var(--img-arrow-ellipse);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.pswp .pswp__button--arrow:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 4px;
}
.pswp .pswp__button--arrow {
  position: absolute;
  top: 50%;
  margin-top: calc(var(--lightbox-nav-size) / -2);
  opacity: 1;
  overflow: visible;
  transition: transform 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.pswp--touch .pswp__button--arrow {
  visibility: visible;
}

.pswp .pswp__button--arrow--prev {
  left: 24px;
  transform: rotate(180deg);
}

.pswp .pswp__button--arrow--next {
  right: 24px;
}

@media (hover: hover) {
  .pswp .pswp__button--arrow--next:hover {
    transform: translateX(4px);
  }
  .pswp .pswp__button--arrow--prev:hover {
    transform: rotate(180deg) translateX(4px);
  }
}
@media (max-width: 600px) {
  .pswp .pswp__button--arrow {
    top: auto;
    bottom: 24px;
    margin-top: 0;
  }
}
.button:focus-visible {
  outline: 2px solid #000000;
  outline-offset: 4px;
}
.button {
  display: inline-flex;
  align-items: stretch;
  background-color: #ffffff;
  transition: background-color 0.2s cubic-bezier(0.22, 0.61, 0.36, 1), transform 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.button__label {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-button-size);
  line-height: var(--type-button-lh);
  letter-spacing: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  padding-inline: var(--button-label-padding);
  color: #000000;
  border: 2px solid #000000;
  border-right: 0;
  white-space: nowrap;
  transition: color 0.2s cubic-bezier(0.22, 0.61, 0.36, 1), border-color 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.button__icon {
  position: relative;
  flex-shrink: 0;
  width: var(--button-icon-w);
  height: var(--button-icon-h);
  border: 2px solid #000000;
  transition: border-color 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.button__icon::before {
  content: "";
  position: absolute;
  top: -2px;
  left: -2px;
  width: var(--button-icon-w);
  height: var(--button-icon-h);
  background-color: #000000;
  transition: background-color 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);
  -webkit-mask: var(--img-button-arrow) center/100% 100% no-repeat;
  mask: var(--img-button-arrow) center/100% 100% no-repeat;
}

@media (hover: hover) {
  .button:hover {
    background-color: #000000;
    transform: translateY(-2px);
  }
  .button:hover .button__label {
    color: #ffffff;
    border-color: #ffffff;
  }
  .button:hover .button__icon {
    border-color: #ffffff;
  }
  .button:hover .button__icon::before {
    background-color: #ffffff;
  }
}
.contact {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-lg);
  align-items: center;
  justify-content: center;
  width: 100%;
  padding-top: var(--spacing-xl);
  background-color: #ffffff;
}

.contact__content {
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: center;
  width: 100%;
  padding-block: var(--spacing-xl);
  border-top: 1px solid #000000;
}

.contact__headline {
  font-family: "Overpass Mono", ui-monospace, "SFMono-Regular", "Menlo", monospace;
  font-weight: 700;
  font-size: var(--type-h2-size);
  line-height: var(--type-h2-lh);
  letter-spacing: 0;
  width: 100%;
  color: #000000;
  text-align: center;
}

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