@font-face {
  font-family: 'SuisseIntl';
  src:
    local('Suisse Intl'),
    local('SuisseIntl-Regular'),
    url('../fonts/suisseintl/SuisseIntl-Regular-WebXL.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

html {
  font-family: 'SuisseIntl', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  /* soften Safari/macOS rendering */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
*{
  box-sizing: border-box;
}

html, body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
  background: #fff;   
}

@supports not (overflow-x: clip) {
  html,
  body {
    overflow-x: hidden;
  }
}

:root {
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

@supports (padding: constant(safe-area-inset-top)) {
  :root {
    --safe-top: constant(safe-area-inset-top);
    --safe-bottom: constant(safe-area-inset-bottom);
  }
}

@supports (top: max(0px)) {
  :root {
    --safe-top: max(
      env(safe-area-inset-top, 0px),
      env(safe-area-max-inset-top, 0px)
    );
    --safe-bottom: max(
      env(safe-area-inset-bottom, 0px),
      env(safe-area-max-inset-bottom, 0px)
    );
  }
}

:root{
  --page-transition-duration: .4s;
  --page-transition-easing: ease;
  --page-transition-distance: 24px;
  --reveal-duration: .6s;
  --reveal-easing: ease;
  --reveal-distance: 32px;
  --viewport-top-offset: 0px;
  --viewport-bottom-offset: 0px;
  --bottom-blur-reserve: 0px;

  --header-height:80px;
  --page-gutter: 16px;
}
body {
  margin: 0;
  padding: var(--page-gutter);
  font-family: inherit;
  font-size: 14px;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;

  background: #fff;  
  transition: background-color var(--page-transition-duration, .4s) var(--page-transition-easing, ease);

}

@media (max-width: 640px) {
  :root {
    --page-gutter: 8px;
  }

  body {
    padding-top: var(--page-gutter);
    /* vermeidet 100vh-Bugs mit Safari-URL-Bar */
    min-height: 100dvh;
  }

}

.red {
  color: red;
}

body.transitions-enabled .main,
body.transitions-enabled .footer {
  opacity: 0;
  transform: translateY(var(--page-transition-distance, 24px));
  transition:
    opacity var(--page-transition-duration, .4s) var(--page-transition-easing, ease),
    transform var(--page-transition-duration, .4s) var(--page-transition-easing, ease),
    filter var(--page-transition-duration, .4s) var(--page-transition-easing, ease);
}

html.mobile-transitions-disabled body.transitions-enabled .main,
html.mobile-transitions-disabled body.transitions-enabled .footer,
html.ios-safari-mobile-safe-mode body.transitions-enabled .main,
html.ios-safari-mobile-safe-mode body.transitions-enabled .footer {
  opacity: 1;
  transform: none;
  filter: none;
  transition: none;
}

body.transitions-enabled.is-page-entering .main,
body.transitions-enabled.is-page-entering .footer {
  opacity: 0;
  filter: blur(30px);
  transform: translateY(var(--page-transition-distance, 24px));
}

body.transitions-enabled.is-page-entered .main,
body.transitions-enabled.is-page-entered .footer {
  opacity: 1;
   filter: blur(0px);
  transform: translateY(0);
}

body.transitions-enabled.is-page-leaving .main,
body.transitions-enabled.is-page-leaving .footer {
  opacity: 0;
  transform: translateY(calc(var(--page-transition-distance, 24px) * -0.5));
}

.no-js .main,
.no-js .footer {
  opacity: 1;
  transform: none;
}

body.transitions-disabled .main,
body.transitions-disabled .footer {
  opacity: 1;
  transform: none;
  transition: none;
}

.introtext {
  padding-top: clamp(120px, 8%, 220px);
  padding-bottom: clamp(80px, 6%, 200px);
  max-width: 800px;
  margin: 0;
}

@media (max-width: 640px) {
.introtext {
  padding-top: 100px;
  padding-bottom: 60px;
  margin: 0 auto;
  text-align: center;
}
}

body, button, input, select, textarea {
  font-family: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: clamp(24px, 1.7vw, 36px);
  line-height: 1.15;
  font-style: normal;
  font-weight: 400;
}

p {
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.2;
}

img {
  border-radius: 4px;
}

.media-item {
  position: relative;
  background-color: transparent;
  border-radius: 4px;
  overflow: hidden;
  --media-aspect: auto;
  aspect-ratio: var(--media-aspect, auto);
}

.media-item--has-aspect::before {
  content: "";
  display: block;
  padding-top: var(--media-aspect-fallback, 0);
}

@supports (aspect-ratio: 1) {
  .media-item--has-aspect::before {
    content: none;
    display: none;
    padding-top: 0;
  }
}

.media-item picture,
.media-item img,
.media-item video,
.media-item canvas,
.media-item svg,
.media-item iframe,
.media-item .lottie,
.media-item .video-embed {
  display: block;
  width: 100%;
  height: auto;
  background: transparent;
  transition: opacity .4s ease;
  position: absolute;
}

.media-item--has-aspect picture,
.media-item--has-aspect img,
.media-item--has-aspect video,
.media-item--has-aspect canvas,
.media-item--has-aspect svg,
.media-item--has-aspect .lottie,
.media-item--has-aspect .video-embed {
  height: 100%;
}

.media-item--has-aspect img,
.media-item--has-aspect video,
.media-item--has-aspect canvas,
.media-item--has-aspect svg,
.media-item--has-aspect .video-embed {
  object-fit: cover;
}

.media-item--loading picture,
.media-item--loading video,
.media-item--loading canvas,
.media-item--loading svg,
.media-item--loading iframe,
.media-item--loading .lottie,
.media-item--loading .video-embed {
  opacity: 1;
}

.media-item--loading img:not([data-poster-image="true"]) {
  opacity: 0;
}

.media-item--loaded img {
  opacity: 1;
}

.media-item__placeholder {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  border-radius: inherit;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  filter: blur(18px);
  transform: scale(1.05);
  transition: opacity .4s ease, filter .4s ease, transform .4s ease, visibility 0s linear .4s;
  will-change: opacity, filter, transform;
  opacity: 1;
}

.media-item--placeholder-hidden .media-item__placeholder {
  opacity: 0;
  filter: blur(0);
  transform: scale(1);
  visibility: hidden;
}

.media-item .video-embed {
  position: relative;
  background: transparent;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.video-embed--background iframe {
  pointer-events: none;
}

.video-embed--interactive iframe {
  pointer-events: auto;
}

.video-embed iframe {
  position: relative;
  z-index: 1;
}

.media-item__poster {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  transition: opacity .4s ease, filter .4s ease, transform .4s ease;
  background: #000;
  overflow: hidden;
  border-radius: inherit;
  filter: blur(18px);
  transform: scale(1.05);
  will-change: opacity, filter, transform;
}

.media-item__poster img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.media-item__poster--hidden,
.media-item__poster.trigger-hide {
  opacity: 0;
}

.media-item--placeholder-hidden .media-item__poster {
  filter: none;
  transform: none;
}

.no-js .media-item__poster {
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}

.no-js .media-item__placeholder {
  opacity: 0 !important;
}

.no-js .media-item--loading img {
  opacity: 1 !important;
}

.header {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: var(--header-height);
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  --header-blur-height: 60px;
  --mobile-menu-top: calc(var(--safe-top, 0px) + 50px);
  --mobile-menu-bottom: calc(var(--safe-bottom, 0px) + var(--viewport-bottom-offset, 0px) + 40px);
  --mobile-project-controls-top: calc(var(--safe-top, 0px) - 4px);
}

body:not(.template-project) .header.scroll-down {
  pointer-events: none;
}

/* ---------------------------------
	
	HEADER BLUR
	
-----------------------------------*/


.header-blur {
  position: absolute;
  inset: 0;
  top: 0;
  height: var(--header-blur-height, 60px);
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
  background: rgba(255, 255, 255, 0);
}


.header-blur::before,
.header-blur::after,
.header-blur__layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.header-blur::after {
  content: "";
  z-index: 8;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  -webkit-mask: linear-gradient(
    to bottom,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,1) 12.5%,
    rgba(0,0,0,0) 25%
  );
  mask: linear-gradient(
    to bottom,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,1) 12.5%,
    rgba(0,0,0,0) 25%
  );
}

.header-blur__layer:nth-of-type(6) {
  z-index: 7;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  -webkit-mask: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 12.5%,
    rgba(0,0,0,1) 12.5%,
    rgba(0,0,0,1) 25%,
    rgba(0,0,0,0) 37.5%
  );
  mask: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 12.5%,
    rgba(0,0,0,1) 12.5%,
    rgba(0,0,0,1) 25%,
    rgba(0,0,0,0) 37.5%
  );
}

.header-blur__layer:nth-of-type(5) {
  z-index: 6;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  -webkit-mask: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 25%,
    rgba(0,0,0,1) 25%,
    rgba(0,0,0,1) 37.5%,
    rgba(0,0,0,0) 50%
  );
  mask: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 25%,
    rgba(0,0,0,1) 25%,
    rgba(0,0,0,1) 37.5%,
    rgba(0,0,0,0) 50%
  );
}

.header-blur__layer:nth-of-type(4) {
  z-index: 5;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  -webkit-mask: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 37.5%,
    rgba(0,0,0,1) 37.5%,
    rgba(0,0,0,1) 50%,
    rgba(0,0,0,0) 62.5%
  );
  mask: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 37.5%,
    rgba(0,0,0,1) 37.5%,
    rgba(0,0,0,1) 50%,
    rgba(0,0,0,0) 62.5%
  );
}

.header-blur__layer:nth-of-type(3) {
  z-index: 4;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  -webkit-mask: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 50%,
    rgba(0,0,0,1) 50%,
    rgba(0,0,0,1) 62.5%,
    rgba(0,0,0,0) 75%
  );
  mask: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 50%,
    rgba(0,0,0,1) 50%,
    rgba(0,0,0,1) 62.5%,
    rgba(0,0,0,0) 75%
  );
}

.header-blur__layer:nth-of-type(2) {
  z-index: 3;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  -webkit-mask: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 62.5%,
    rgba(0,0,0,1) 62.5%,
    rgba(0,0,0,1) 75%,
    rgba(0,0,0,0) 87.5%
  );
  mask: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 62.5%,
    rgba(0,0,0,1) 62.5%,
    rgba(0,0,0,1) 75%,
    rgba(0,0,0,0) 87.5%
  );
}

.header-blur__layer:nth-of-type(1) {
  z-index: 2;
  backdrop-filter: blur(1px);
  -webkit-backdrop-filter: blur(1px);
  -webkit-mask: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 75%,
    rgba(0,0,0,1) 75%,
    rgba(0,0,0,1) 87.5%,
    rgba(0,0,0,0) 100%
  );
  mask: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 75%,
    rgba(0,0,0,1) 75%,
    rgba(0,0,0,1) 87.5%,
    rgba(0,0,0,0) 100%
  );
}

.header-blur::before {
  content: "";
  z-index: 1;
  backdrop-filter: blur(0.5px);
  -webkit-backdrop-filter: blur(0.5px);
  -webkit-mask: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 87.5%,
    rgba(0,0,0,1) 87.5%,
    rgba(0,0,0,1) 100%
  );
  mask: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 87.5%,
    rgba(0,0,0,1) 87.5%,
    rgba(0,0,0,1) 100%
  );
}

body.header-blur-disabled .header-blur,
body.header-blur-disabled .header-blur::before,
body.header-blur-disabled .header-blur::after,
body.header-blur-disabled .header-blur__layer {
  display: none !important;
}

@media (max-width: 640px) {
  html.ios-safari-mobile-safe-mode .header::after {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: calc(var(--safe-top, 0px) + 8px);
    min-height: 32px;
    background: #fff;
    pointer-events: none;
    z-index: 9;
    opacity: 1;
    visibility: visible;
    transition: opacity .2s ease, visibility 0s linear 0s;
  }

  html.ios-safari-mobile-safe-mode.is-scrolled-past-top .header::after,
  html.ios-safari-mobile-safe-mode .header.scroll-down::after {
    opacity: 0;
    visibility: hidden;
    transition: opacity .18s ease, visibility 0s linear .18s;
  }
}

/* ---------------------------------
		
		LOGO
	
-----------------------------------*/

.logo {
  display:block;
  position:fixed;
  left:32px;
  top:0px;
  z-index:2000;
  height:var(--header-height);
  display:flex;
  align-items: center;
  font-size: 14px;
  line-height: 1.2;
  text-decoration: none;
  font-weight: 400;
  transition: color .0s ease, transform .3s ease, opacity .3s ease;
  color: #FFFFFF;
  mix-blend-mode: difference;
  transform: translate3d(0, 0, 0);
  transition: transform .3s cubic-bezier(.4,0,.2,1), opacity .3s ease;
}
.logo.scroll-down {
  transform: translateY(-120%);
  opacity: 0;
  pointer-events: none;
}
@media screen and (max-width:640px){
  .logo {
    left:16px;
    top: calc(var(--mobile-logo-top, var(--safe-top, 0px)) + 2px);
  }
}


@media (hover: hover) and (pointer: fine) {
  .logo:hover {
    color: #ff0000;
    mix-blend-mode: normal;
  }
}

.logo:focus-visible {
  color: #ff0000;
  mix-blend-mode: normal;
}

/* DISABLE HOME HOVER */
.logo--home {
  pointer-events: none;
  cursor: default;
}
.logo--home:focus-visible {
  color: inherit;
}


/* ---------------------------------
	
	MENU / NAVIGATION
	
-----------------------------------*/

.header .menu {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  transition: color .2s ease, transform .3s cubic-bezier(.4,0,.2,1), opacity .3s ease;
  transform: translate3d(0, 0, 0);
  opacity: 1;
  will-change: transform, opacity;
  background-color: rgba(255, 255, 255, .7);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  overflow: visible;
  justify-self: center;
  box-shadow: none;
}
.header.scroll-down .menu {
  /*transform: translate3d(0, -120%, 0);*/
  transform:translateY(-120%);
  opacity: 0;
}
@media (max-width: 640px) {
  .header .menu {
    transition: color .2s ease, transform .3s cubic-bezier(.4,0,.2,1), opacity .3s ease;
  }

  .header.scroll-down .menu {
    transform: translate3d(-50%, calc(100% + var(--mobile-menu-bottom, 12px) + 16px), 0);
    opacity: 0;
    pointer-events: none;
  }
}

.menu {
  --menu-pill-color: rgba(222, 222, 222, 1);
}

.menu ul {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 10px 3px;
  border-radius: 999px;
  color: #000;
  position: relative;
  z-index: 2;
}



.menu li { margin: 0; }

.menu a {
  text-decoration: none;
  font-size: 14px;
  line-height: 1.2;
  color: inherit;
  white-space: nowrap;
  padding: 6px 12px;
  border-radius: 999px;
  transition: color .2s ease, background-color .2s ease;
}

/* FIREFOX BUTTON FIX */
html.browser-firefox body .menu ul{
  padding-top:11px;
  padding-bottom:9px;
}
html.browser-firefox body .project-title{
  padding-bottom:5px;
}
html.browser-firefox body .filters a{
  padding-bottom:7px;
}

@media (hover: hover) and (pointer: fine) {
  .menu a:hover {
    background-color: var(--menu-pill-color, rgba(222, 222, 222, 1));
    color: #000;
  }
}

.menu a:focus-visible {
  background-color: var(--menu-pill-color, rgba(222, 222, 222, 1));
  color: #000;
}

.menu li.is-active a,
.menu a[aria-current="page"] {
  background-color: var(--menu-pill-color, rgba(222, 222, 222, 1));
  color: #000;
  pointer-events: none;
  cursor: default;
}

.menu li.is-active a:focus-visible {
  background-color: var(--menu-pill-color, rgba(222, 222, 222, 1));
}

.menu-indicator {
  position: absolute;
  top: 50%;
  left: 0;
  height: calc(100% - 6px);
  border-radius: 999px;
  background-color: var(--menu-pill-color, rgba(222, 222, 222, 1));
  transform: translate3d(0, -50%, 0);
  transition: transform .3s cubic-bezier(.4,.0,.2,1), width .3s cubic-bezier(.4,.0,.2,1), opacity .3s ease;
  opacity: 0;
  pointer-events: none;
  z-index: 1;
}

.menu-indicator.no-transition {
  transition: none !important;
}

.menu-indicator.is-visible {
  opacity: 1;
}

.menu.menu--indicator-visible li a {
  background-color: transparent;
}

.menu.menu--indicator-visible li.is-active a {
  background-color: transparent;
}


.header-shop {
  margin-left: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2;
  text-decoration: none;
  position: absolute;
  top: 32px;
  right: 32px;
  z-index: 2000;
  color: #9B9B9B;
}

@media (max-width: 640px) {
  .header-shop {
    top: calc(var(--mobile-logo-top, var(--safe-top, 0px)) + 2px);
    right: 16px;
    height: var(--header-height);
    display: flex;
    align-items: center;
  }
}

/* Hide/show the menu pill on scroll like logo & shop */
@media (min-width: 641px) {
  .scroll-down .menu {
    /* On desktop, slide up out of view to match logo/shop behavior */
    transform: translate3d(0, -120%, 0);
    opacity: 0;
    pointer-events: none;
  }
}


/* Global link styling */
a {
  color: black;
  text-decoration: none !important;
}

@media (hover: hover) and (pointer: fine) {
  a:hover {
    color: red;
  }
}



.footer {
  --footer-column-gap: clamp(24px, 6vw, 50px);
  --footer-gap: clamp(24px, 3vw, 40px);
  padding-top: clamp(120px, 10%, 200px) !important;
}

.footer__inner {
  display: flex;
  flex-wrap: wrap;
  column-gap: var(--footer-column-gap);
  row-gap: clamp(24px, 10vw, 48px);
}


.footer__brand {
  flex: 0 0 100%;
  order: 1;
}

.footer__column {
  flex: 1 1 calc(50% - var(--footer-column-gap) / 2);
  max-width: calc(50% - var(--footer-column-gap) / 2);
  min-width: clamp(120px, calc(50% - var(--footer-column-gap) / 2), 220px);
}

.footer__column--address { order: 2; }
.footer__column--contact { order: 3; }
.footer__column--social { order: 4; }
.footer__column--legal { order: 5; }

.footer__brand-link {
  display: inline-block;
  font-size: clamp(24px, 1.7vw, 36px);
  line-height: 1;
  text-decoration: none;
  color: inherit;
}

.footer__column {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.footer__column--legal {
  min-width: 0px !important;
}

.footer__link {
  display: inline-block;
  text-decoration: none;
  color: inherit;
  font-size: 14px;
  line-height: 1.2;
}

.footer__link--multiline {
  white-space: normal;
}

@media (hover: hover) and (pointer: fine) {
  .footer__link:hover,
  .footer__brand-link:hover {
    color: #ff0000;
  }
}

.footer__link:focus-visible,
.footer__brand-link:focus-visible {
  color: #ff0000;
}

/* REVEAL ANIMATIONS */


/*.reveal-on-scroll {
  opacity: 0;
  transform: translateY(var(--reveal-distance, 32px));
  filter:blur(20px);
  transition:
    opacity var(--reveal-duration, .6s) var(--reveal-easing, ease),
    transform var(--reveal-duration, .6s) var(--reveal-easing, ease),
    filter var(--reveal-duration, .6s) var(--reveal-easing, ease);
}

.reveal-on-scroll.is-revealed {
  opacity: 1;
  transform: translateY(0);
  filter:blur(0px);
}*/

body.scroll-reveal-enabled .reveal-on-scroll {
  opacity: 0;
  transform: translateY(var(--reveal-distance, 32px));
  filter:blur(30px);
  transition:
    opacity var(--reveal-duration, .6s) var(--reveal-easing, ease),
    transform var(--reveal-duration, .6s) var(--reveal-easing, ease),
    filter var(--reveal-duration, .6s) var(--reveal-easing, ease);

}

html.mobile-transitions-disabled body.scroll-reveal-enabled .reveal-on-scroll,
html.ios-safari-mobile-safe-mode body.scroll-reveal-enabled .reveal-on-scroll {
  opacity: 1;
  transform: none;
  filter: none;
  transition: none;
}

body.scroll-reveal-enabled .reveal-on-scroll.is-revealed {
  opacity: 1;
  transform: translateY(0);
  filter:blur(0px);
}

body.scroll-reveal-disabled .reveal-on-scroll {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  filter: none !important;
}

body.transitions-enabled.is-page-leaving .footer.reveal-on-scroll,
body.transitions-enabled.is-page-leaving .footer.reveal-on-scroll.is-revealed {
  opacity: 0;
  filter: blur(30px);
  transform: translateY(calc(var(--page-transition-distance, 24px) * -0.5));
}



/* ---------------------------------
	
	RESPONSIVE
	
-----------------------------------*/



@media (min-width: 768px) {
  .footer__column {
    min-width: clamp(160px, calc(50% - var(--footer-column-gap) / 2), 280px);
  }

  .footer__column--legal {
    margin-left: auto;
  }
}

@media (min-width: 1025px) {
  .footer__inner {
    flex-wrap: nowrap;
    align-items: flex-start;
    row-gap: 0;
  }

  .footer__brand {
    flex: 0 0 auto;
    margin-right: var(--footer-gap);
  }

  .footer__column {
    flex: 0 0 auto;
    min-width: 160px;
  }

  .footer__column--legal {
    margin-left: auto;
    align-items: flex-end;
    text-align: right;
  }
}


@media (max-width: 640px) {
  :root{
    --header-height:50px;
  }
  html body {
    --mobile-logo-top: calc(var(--safe-top, 0px) + 4px + var(--viewport-top-offset, 0px));
    --mobile-menu-top: calc(var(--safe-top, 0px) - 2px + var(--viewport-top-offset, 0px));
    --mobile-menu-bottom: calc(var(--safe-bottom, 0px) + var(--viewport-bottom-offset, 0px) + 40px);
    --mobile-project-controls-top: calc(var(--safe-top, 0px) - 16px + var(--viewport-top-offset, 0px));
  }
  html.ios-safari body {
    --mobile-logo-top: calc(var(--safe-top, 0px) + 4px + var(--viewport-top-offset, 0px));
    --mobile-menu-top: calc(var(--safe-top, 0px) - 2px + var(--viewport-top-offset, 0px));
    --mobile-menu-bottom: 40px;
    --mobile-project-controls-top: calc(var(--safe-top, 0px) - 16px + var(--viewport-top-offset, 0px));
  }

  html.browser-chrome:not(.ios-chrome) body {
    --mobile-logo-top: calc(var(--safe-top, 0px) + 4px);
    --mobile-menu-top: calc(var(--safe-top, 0px) + 4px);
    --mobile-menu-bottom: calc(var(--safe-bottom, 0px) + var(--viewport-bottom-offset, 0px) + 40px);
    --mobile-project-controls-top: calc(var(--safe-top, 0px) - 10px);
  }

  .logo,
  .header a,
  .header .menu,
  .header-shop {
    -webkit-tap-highlight-color: transparent;
  }

  .header {
    --header-blur-height: 60px;
  }

  body::after {
    display: none;
  }

  html.ios-safari body::after {
    display: none;
  }

  .header .menu {
    position: fixed;
    top: auto;
    bottom: var(--mobile-menu-bottom);
    left: 50%;
    transform: translate3d(-50%, 0, 0);
    z-index: 1100;
    box-shadow: 0 0px 20px rgba(0, 0, 0, 0.5);
    opacity: 1;
    pointer-events: auto;
  }

  .footer {
    margin: 0 0 8px 8px;
  }

  .footer__inner {
    flex-wrap: wrap;
    column-gap: clamp(24px, 6vw, 50px);
    row-gap: clamp(24px, 10vw, 48px);
  }

  .footer__brand {
    flex: 0 0 100%;
  }

  .footer__column {
    flex: 0 0 50%;
    max-width: 50%;
    align-items: flex-start;
  }

  .footer__column--legal {
    align-items: flex-start;
    text-align: left;
  }



  body.transitions-enabled.is-page-leaving .header .menu {
    transform: translate3d(-50%, calc(100% + var(--mobile-menu-bottom, 12px) + 16px), 0);
    opacity: 0;
    pointer-events: none;
  }

  body.transitions-enabled:not(.is-page-entered) .header .menu {
    transform: translate3d(-50%, 0, 0);
    opacity: 1;
    pointer-events: auto;
    visibility: visible;
    transition: none;
  }

}