/*--------------------------------------------------------------
# Responsive Sizes
--------------------------------------------------------------*/
:root {
  --rs-0-0-1: 0rem;
  --rs-0-0-2: 0rem;
  --rs-0-0-3: 0rem;
  --rs-0-0-4: 0rem;
  --rs-0-1-1: clamp(0rem, -0.3753581662rem + 0.9551098376vw, 1rem);
  --rs-0-1-2: clamp(0rem, -0.3753581662rem + 0.9551098376vw, 1rem);
  --rs-0-1-3: clamp(0rem, -0.3753581662rem + 0.9551098376vw, 1rem);
  --rs-0-1-4: clamp(0rem, -0.3753581662rem + 0.9551098376vw, 1rem);
  --rs-0-2-2: clamp(0rem, -0.7507163324rem + 1.9102196753vw, 2rem);
  --rs-0-2-3: clamp(0rem, -0.7507163324rem + 1.9102196753vw, 2rem);
  --rs-0-2-4: clamp(0rem, -0.7507163324rem + 1.9102196753vw, 2rem);
  --rs-0-3-3: clamp(0rem, -1.1260744986rem + 2.8653295129vw, 3rem);
  --rs-0-3-4: clamp(0rem, -1.1260744986rem + 2.8653295129vw, 3rem);
  --rs-1-1-2: 1rem;
  --rs-1-1-3: 1rem;
  --rs-1-1-4: 1rem;
  --rs-1-2-2: clamp(1rem, 0.6246418338rem + 0.9551098376vw, 2rem);
  --rs-1-2-3: clamp(1rem, 0.6246418338rem + 0.9551098376vw, 2rem);
  --rs-1-2-4: clamp(1rem, 0.6246418338rem + 0.9551098376vw, 2rem);
  --rs-1-3-3: clamp(1rem, 0.2492836676rem + 1.9102196753vw, 3rem);
  --rs-1-3-4: clamp(1rem, 0.2492836676rem + 1.9102196753vw, 3rem);
  --rs-2-2-3: 2rem;
  --rs-2-2-4: 2rem;
  --rs-2-3-3: clamp(2rem, 1.6246418338rem + 0.9551098376vw, 3rem);
  --rs-2-3-4: clamp(2rem, 1.6246418338rem + 0.9551098376vw, 3rem);
}

@media screen and (min-width: 1440px) {
  :root {
    --rs-0-0-1: clamp(0rem, -1.2857142857rem + 0.8928571429vw, 1rem);
    --rs-0-0-2: clamp(0rem, -2.5714285714rem + 1.7857142857vw, 2rem);
    --rs-0-0-3: clamp(0rem, -3.8571428571rem + 2.6785714286vw, 3rem);
    --rs-0-0-4: clamp(0rem, -5.1428571429rem + 3.5714285714vw, 4rem);
    --rs-0-1-1: 1rem;
    --rs-0-1-2: clamp(1rem, -0.2857142857rem + 0.8928571429vw, 2rem);
    --rs-0-1-3: clamp(1rem, -1.5714285714rem + 1.7857142857vw, 3rem);
    --rs-0-1-4: clamp(1rem, -2.8571428571rem + 2.6785714286vw, 4rem);
    --rs-0-2-2: 2rem;
    --rs-0-2-3: clamp(2rem, 0.7142857143rem + 0.8928571429vw, 3rem);
    --rs-0-2-4: clamp(2rem, -0.5714285714rem + 1.7857142857vw, 4rem);
    --rs-0-3-3: 3rem;
    --rs-0-3-4: clamp(3rem, 1.7142857143rem + 0.8928571429vw, 4rem);
    --rs-1-1-2: clamp(1rem, -0.2857142857rem + 0.8928571429vw, 2rem);
    --rs-1-1-3: clamp(1rem, -1.5714285714rem + 1.7857142857vw, 3rem);
    --rs-1-1-4: clamp(1rem, -2.8571428571rem + 2.6785714286vw, 4rem);
    --rs-1-2-2: 2rem;
    --rs-1-2-3: clamp(2rem, 0.7142857143rem + 0.8928571429vw, 3rem);
    --rs-1-2-4: clamp(2rem, -0.5714285714rem + 1.7857142857vw, 4rem);
    --rs-1-3-3: 3rem;
    --rs-1-3-4: clamp(3rem, 1.7142857143rem + 0.8928571429vw, 4rem);
    --rs-2-2-3: clamp(2rem, 0.7142857143rem + 0.8928571429vw, 3rem);
    --rs-2-2-4: clamp(2rem, -0.5714285714rem + 1.7857142857vw, 4rem);
    --rs-2-3-3: 3rem;
    --rs-2-3-4: clamp(3rem, 1.7142857143rem + 0.8928571429vw, 4rem);
  }
}
/*--------------------------------------------------------------
# Variables
--------------------------------------------------------------*/
:root {
  --border-radius: clamp(2.5rem, 2.1246418338rem + 0.9551098376vw, 3.5rem);
}
@media screen and (min-width: 1440px) {
  :root {
    --border-radius: clamp(3.5rem, -1rem + 3.125vw, 7rem);
  }
}

/* Font variables */
:root {
  --font-size-button: clamp(1.7rem, 1.5873925501rem + 0.2865329513vw, 2rem);
  --font-size-text-small: clamp(1.1rem, 1.0249283668rem + 0.1910219675vw, 1.3rem);
  --font-size-text-standard: clamp(1.5rem, 1.3873925501rem + 0.2865329513vw, 1.8rem);
  --font-size-text-large: clamp(2rem, 1.4744985673rem + 1.3371537727vw, 3.4rem);
  --font-size-headline-primary: clamp(4.8rem, 3.0733524355rem + 4.3935052531vw, 9.4rem);
  --font-size-headline-secondary-1: clamp(4.6rem, 2.9484240688rem + 4.2024832856vw, 9rem);
  --font-size-headline-secondary-2: clamp(2.4rem, 1.7243553009rem + 1.7191977077vw, 4.2rem);
  --line-height-text-small: clamp(1.35rem, 1.2561604585rem + 0.2387774594vw, 1.6rem);
  --line-height-text-standard: clamp(2.3rem, 2.1873925501rem + 0.2865329513vw, 2.6rem);
  --line-height-text-large: clamp(2.6rem, 1.7742120344rem + 2.1012416428vw, 4.8rem);
  --line-height-headline-primary: clamp(5.4rem, 3.8985673352rem + 3.8204393505vw, 9.4rem);
  --line-height-headline-secondary-1: clamp(5.2rem, 3.7736389685rem + 3.629417383vw, 9rem);
  --line-height-headline-secondary-2: clamp(2.8rem, 2.1243553009rem + 1.7191977077vw, 4.6rem);
}

@media screen and (min-width: 1440px) {
  :root {
    --font-size-button: clamp(2rem, 1.4857142857rem + 0.3571428571vw, 2.4rem);
    --font-size-text-small: clamp(1.3rem, 0.9142857143rem + 0.2678571429vw, 1.6rem);
    --font-size-text-standard: clamp(1.8rem, 0.7714285714rem + 0.7142857143vw, 2.6rem);
    --font-size-text-large: clamp(3.4rem, 1.8571428571rem + 1.0714285714vw, 4.6rem);
    --font-size-headline-primary: clamp(9.4rem, 3.4857142857rem + 4.1071428571vw, 14rem);
    --font-size-headline-secondary-1: clamp(9rem, 5.1428571429rem + 2.6785714286vw, 12rem);
    --font-size-headline-secondary-2: clamp(4.2rem, 2.9142857143rem + 0.8928571429vw, 5.2rem);
    --line-height-text-small: clamp(1.6rem, 1.1242857143rem + 0.3303571429vw, 1.97rem);
    --line-height-text-standard: clamp(2.6rem, 0.8rem + 1.25vw, 4rem);
    --line-height-text-large: clamp(4.8rem, 3.5142857143rem + 0.8928571429vw, 5.8rem);
    --line-height-headline-primary: clamp(9.4rem, 3.4857142857rem + 4.1071428571vw, 14rem);
    --line-height-headline-secondary-1: clamp(9rem, 5.1428571429rem + 2.6785714286vw, 12rem);
    --line-height-headline-secondary-2: clamp(4.6rem, 3.3142857143rem + 0.8928571429vw, 5.6rem);
  }
}
:root {
  --bricolage--small-letter-spacing: -0.02em;
}

/* color variables */
:root {
  /* Light */
  --color-light-angle: 56;
  --color-light-saturation: 29%;
  --color-light-lightness: 91%;
  --color-light: hsl(var(--color-light-angle), var(--color-light-saturation), var(--color-light-lightness));
  /* Dark */
  --color-dark-angle: 251;
  --color-dark-saturation: 27%;
  --color-dark-lightness: 12%;
  --color-dark: hsl(var(--color-dark-angle), var(--color-dark-saturation), var(--color-dark-lightness));
  /* Accent */
  --color-accent-angle: 16;
  --color-accent-saturation: 100%;
  --color-accent-lightness: 55%;
  --color-accent: hsl(var(--color-accent-angle), var(--color-accent-saturation), var(--color-accent-lightness));
}

/*---------------------------------------------------------------
# Mixins
---------------------------------------------------------------*/
/* Text */
/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/
html {
  scroll-behavior: smooth;
  overflow-x: hidden;
}

:root {
  font-size: 62.5%; /* 1rem = 10px */
}

body {
  overflow-x: clip;
  font-family: "Inter";
  font-size: var(--font-size-text-standard);
  line-height: var(--line-height-text-standard);
  font-weight: 400;
  color: var(--color-dark);
}

p {
  margin: 0;
}

a {
  text-decoration: none;
  color: inherit;
  /*
    &:visited {
      color: inherit;
    }
  */
}

:where(h1, h2, h3, h4, h5, h6) {
  font-family: "Bricolage Grotesque";
  line-height: 1;
  letter-spacing: var(--bricolage--small-letter-spacing);
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/
.u-round-border {
  border-radius: var(--border-radius);
}

.u-scroll-transition {
  transition: all 0.3s ease-in-out;
}

.u-no-margin {
  margin: 0 !important;
}

/*

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
.headline-primary {
  font-family: "Bricolage Grotesque";
  letter-spacing: var(--bricolage--small-letter-spacing);
  font-size: var(--font-size-headline-primary);
  font-weight: 500;
}
.headline-secondary-1 {
  font-family: "Bricolage Grotesque";
  letter-spacing: var(--bricolage--small-letter-spacing);
  font-size: var(--font-size-headline-secondary-1);
  font-weight: 500;
}
.headline-secondary-2 {
  font-family: "Bricolage Grotesque";
  letter-spacing: var(--bricolage--small-letter-spacing);
  font-size: var(--font-size-headline-secondary-2);
  font-weight: 700;
  line-height: 1.1;
}

.text {
  font-family: "Inter";
  font-size: var(--font-size-text-standard);
  line-height: var(--line-height-text-standard);
  font-weight: 400;
}
.text--accent {
  color: var(--color-accent);
}
.text--light {
  color: var(--color-light);
}
.text--dark {
  color: var(--color-dark);
}

.text-large {
  font-family: "Bricolage Grotesque";
  font-size: var(--font-size-text-large);
  line-height: 1.41;
  font-weight: 300;
  letter-spacing: var(--bricolage--small-letter-spacing);
}

/* Buttons */
:root {
  --button-color: var(--color-accent);
}

.button {
  display: inline-flex;
  align-items: center;
  border: 0.2rem solid var(--button-color);
  color: var(--button-color);
  padding-inline: 0.85em;
  --height: clamp(3.85rem, 3.4746418338rem + 0.9551098376vw, 4.85rem);
  height: var(--height);
  border-radius: 5rem;
  font-family: "Bricolage Grotesque";
  font-size: calc(var(--font-size-button) * 1);
  line-height: var(--height);
  font-weight: 500;
  margin-right: auto;
  white-space: nowrap;
  transition: scale 0.2s ease-in-out;
  position: relative;
}
.button:is(:hover, :focus), .button:has(a:focus-visible) {
  scale: 1.05;
}
.button:focus-visible, .button:has(a:focus-visible) {
  outline: 2px solid var(--color-accent);
  outline-offset: 0.3em;
}
@media screen and (min-width: 1440px) {
  .button {
    height: clamp(4.85rem, 4.5285714286rem + 0.2232142857vw, 5.1rem);
  }
}
.button svg {
  width: 1.3em;
  height: 1.3em;
  margin-left: 0.5em;
  fill: var(--button-color);
}
.button--arrow-down svg,
.button--arrow-down .button__arrow-container {
  transform: rotate(45deg);
}
.button--arrow-right svg,
.button--arrow-right .button__arrow-container {
  transform: rotate(-45deg);
}
.button--glass {
  backdrop-filter: blur(12px);
  background-color: hsla(var(--color-light-angle), var(--color-light-saturation), var(--color-light-lightness), 0.35);
}
.button__link {
  z-index: 1;
}
.button__link > a:focus-visible {
  outline: none;
}
.button__link > a::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.button__arrow-container {
  position: relative;
  display: inline-flex;
  --size: 1.3em;
  width: var(--size);
  height: var(--size);
  margin-left: 0.5em;
  border-radius: 50%;
  background-color: var(--button-color);
  overflow: hidden;
  --transition-time: 0.5s;
  --transition-delay: 0.18s;
  --transition-effect: ease-in-out;
}
.button__arrow1, .button__arrow2 {
  align-items: center;
  bottom: 0px;
  display: flex;
  justify-content: center;
  left: 0px;
  position: absolute;
  right: 0px;
  top: 0px;
}
.button__arrow1 svg, .button__arrow2 svg {
  --size: 70%;
  width: var(--size);
  height: var(--size);
  margin-left: unset;
  transform: unset;
}
.button__arrow1 {
  transform: translate(0%, 0%);
  transition: transform var(--transition-time) var(--transition-effect);
}
.button__arrow2 {
  transform: translate(-100%, -100%);
  transition: transform var(--transition-time) var(--transition-effect) var(--transition-delay);
}
.button:is(:hover, :focus) .button__arrow1, .button:has(a:focus-visible) .button__arrow1 {
  transform: translate(100%, 100%);
  transition: transform var(--transition-time) var(--transition-effect) var(--transition-delay);
}
.button:is(:hover, :focus) .button__arrow2, .button:has(a:focus-visible) .button__arrow2 {
  transform: translate(0%, 0%);
  transition: transform var(--transition-time) var(--transition-effect);
}

/* Icons */
/* Size variables */
:root {
  --size-icon: clamp(6.75rem, 5.0233524355rem + 4.3935052531vw, 11.35rem);
}
@media screen and (min-width: 1440px) {
  :root {
    --size-icon: clamp(11.35rem, 2.6714285714rem + 6.0267857143vw, 18.1rem);
  }
}

.icon {
  width: var(--size-icon);
  height: var(--size-icon);
}
.icon svg {
  width: 100%;
  height: 100%;
}

/* Sections */
:root {
  --padding-section-inline: clamp(1.5rem, -0.9398280802rem + 6.2082139446vw, 8rem);
  --padding-section-block: clamp(3.8rem, 2.223495702rem + 4.0114613181vw, 8rem);
}
@media screen and (min-width: 1440px) {
  :root {
    --padding-section-inline: clamp(8rem, 0.2857142857rem + 5.3571428571vw, 14rem);
    --padding-section-block: clamp(8rem, 2.8571428571rem + 3.5714285714vw, 12rem);
  }
}

.section {
  padding-inline: var(--padding-section-inline);
  background-color: var(--color-light);
  --section-background: var(--color-light);
}
.section--color-scheme-light {
  background-color: var(--color-light);
  color: var(--color-dark);
  --button-color: var(--color-accent);
  --headline-color: var(--color-dark);
  --section-background: var(--color-light);
}
.section--color-scheme-light:where(.headline) {
  color: var(--headline-color);
}
.section--color-scheme-dark {
  background-color: var(--color-dark);
  color: var(--color-light);
  --button-color: var(--color-accent);
  --headline-color: var(--color-accent);
  --section-background: var(--color-dark);
}
.section--color-scheme-accent {
  background-color: var(--color-accent);
  color: var(--color-light);
  --button-color: var(--color-light);
  --headline-color: var(--color-light);
  --section-background: var(--color-accent);
}
.section__container {
  padding-block: var(--padding-section-block);
}

/* Card Slider */
.card-slider {
  margin-block: clamp(2.67em, 1.9830945559em + 1.7478510029vw, 4.5em);
  --button-size: clamp(2.97rem, 2.8386246418rem + 0.3342884432vw, 3.32rem);
}
@media screen and (min-width: 1440px) {
  .card-slider {
    --button-size: clamp(3.32rem, 3.0242857143rem + 0.2053571429vw, 3.55rem);
  }
}
.card-slider__cards-container {
  --color-cards-background: hsla(var(--color-light-angle), var(--color-light-saturation), var(--color-light-lightness), 0.2);
  --color-cards-items: var(--color-accent);
  --padding-inline: var(--padding-section-inline);
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  overflow-x: auto;
  scrollbar-width: none;
  gap: clamp(1.2em, 0.6106876791em + 1.4995224451vw, 2.77em);
  cursor: grab;
  padding-block: 0.5em;
  padding-inline: var(--padding-inline);
  scroll-padding-inline: var(--padding-inline);
  left: 50%;
  position: relative;
  transform: translateX(-50%);
  width: var(--body-width);
}
@media (pointer: coarse) and (hover: none) {
  .card-slider__cards-container {
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
  }
}
.card-slider__cards-container.dragging {
  cursor: grabbing;
  user-select: none;
}
.card-slider__controls-wrapper {
  margin-left: auto;
  width: fit-content;
  margin-top: calc(0.25 * var(--button-size) + 2 * var(--rs-0-1-1));
}
.card-slider__controls-wrapper:not(:has(.card-slider__control-button:not(:disabled))) {
  display: none;
}
.card-slider__control-button {
  background-color: unset;
  border: unset;
  padding: unset;
  width: var(--button-size);
  height: var(--button-size);
  border-radius: 50%;
  cursor: pointer;
  transition: scale 0.2s ease-in-out;
}
.card-slider__control-button:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 0.3em;
}
.card-slider__control-button:is(:hover, :focus):not(:disabled) {
  scale: 1.05;
}
.card-slider__control-button:disabled {
  opacity: 0.2;
  cursor: not-allowed;
}
.card-slider__control-button svg {
  width: 100%;
  height: 100%;
  fill: var(--button-color);
}

/* Cards */
:root {
  --card-width: clamp(23.4rem, 17.5444126074rem + 14.899713467vw, 39rem);
  --card-padding: clamp(2.2rem, 1.712034384rem + 1.2416427889vw, 3.5rem);
}
@media screen and (min-width: 1440px) {
  :root {
    --card-width: clamp(39rem, 8.7857142857rem + 20.9821428571vw, 62.5rem);
    --card-padding: clamp(3.5rem, 0.5428571429rem + 2.0535714286vw, 5.8rem);
  }
}

.card {
  --color-items: var(--color-cards-items, --color-accent);
  --color-background: var(--color-cards-background, hsla(56, 29%, 91%, 0.2));
  --image-size: var(--size-icon);
  display: grid;
  flex: 0 0 auto;
  scroll-snap-align: start;
  width: var(--card-width);
  padding: var(--card-padding);
  padding-bottom: 2.5em;
  border-radius: var(--border-radius);
  box-shadow: 5px 5px 20px hsl(var(--color-dark-angle), var(--color-dark-saturation), var(--color-dark-lightness), 0.2);
  background-color: var(--color-background);
  color: var(--color-items);
  grid-template-rows: min-content min-content auto;
}
.card:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 0.3em;
}
.card__image {
  order: -1;
  --fill-color: var(--color-items);
  width: var(--image-size);
  height: var(--image-size);
  margin-bottom: calc(0.55 * var(--image-size));
}
.card__image svg {
  fill: var(--fill-color);
}
.card__title {
  font-family: "Bricolage Grotesque";
  letter-spacing: var(--bricolage--small-letter-spacing);
  font-size: var(--font-size-headline-secondary-2);
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: 0.5lh;
}
.card__text {
  font-family: "Inter";
  font-size: var(--font-size-text-standard);
  line-height: var(--line-height-text-standard);
  font-weight: 400;
  width: 80%;
}

/* Scroll Wide Animation */
.scroll-wide-container {
  --border: calc(var(--padding-section-inline) * (1 - var(--scroll-animation, 1)));
  --transition-time: 0.1s;
  margin-inline: calc(-1 * var(--padding-section-inline) + var(--border, 0px));
  margin-top: var(--border);
  border-radius: var(--border) var(--border) 0 0;
  overflow: hidden;
  transition: all var(--transition-time) ease;
}
.scroll-wide-container__inner {
  height: 100%;
  margin-inline: calc(-1 * var(--border));
  margin-top: calc(-1 * var(--border));
  transition: all var(--transition-time) ease;
}
.scroll-wide-container__inner--zoom-out {
  transform: scale(calc(1 + 0.3 * (1 - var(--scroll-animation, 1))));
  transition: all calc(3 * var(--transition-time)) ease-out;
}

/* Scroll Opacity Animation */
.scroll-opacity {
  opacity: var(--scroll-animation, 1);
}

/*--------------------------------------------------------------
# Site Header
--------------------------------------------------------------*/
:root {
  --header-padding-top: clamp(2.1rem, 1.2742120344rem + 2.1012416428vw, 4.3rem);
  --header-padding-bottom: clamp(2.5rem, 1.2142857143rem + 0.8928571429vw, 3.5rem);
  --header-content-height: clamp(2.5rem, 2.3123209169rem + 0.4775549188vw, 3rem);
  --header-height: calc(var(--header-content-height) + var(--header-padding-top) + var(--header-padding-bottom));
  --nav-buttons-padding-inline: 0.85em;
}
@media screen and (min-width: 1440px) {
  :root {
    --header-content-height: clamp(3rem, 2.3571428571rem + 0.4464285714vw, 3.5rem);
  }
}

:root {
  --header-menu-font-family: "Inter";
  --header-menu-font-size: var(--font-size-text-small);
  --header-menu-font-weight: 700;
}

.site-header {
  padding-inline: var(--padding-section-inline);
  padding-top: var(--header-padding-top);
  padding-bottom: var(--header-padding-bottom);
  position: relative;
  z-index: 10;
}

.inside-header {
  display: flex;
  justify-content: space-between;
}

.header-image {
  height: var(--header-content-height);
}

a:has(.header-image) {
  display: flex;
}

.main-navigation,
.lang-nav {
  display: flex;
  font-family: var(--header-menu-font-family);
  font-size: var(--header-menu-font-size);
  font-weight: var(--header-menu-font-weight);
  line-height: var(--header-content-height);
}
.main-navigation ul,
.lang-nav ul {
  display: flex;
  list-style: none;
  margin: unset;
  padding: unset;
}
.main-navigation a,
.lang-nav a {
  text-decoration: none;
  color: inherit;
}

.main-navigation {
  margin-left: auto;
}
.main-navigation .mobile-menu-control-wrapper,
.main-navigation .menu-toggle {
  display: none;
}
.main-navigation .inside-navigation {
  display: flex;
}
.main-navigation .main-nav {
  display: flex;
  align-items: center;
}
.main-navigation .menu-item a {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--color-dark);
  padding-inline: var(--nav-buttons-padding-inline);
  height: var(--header-content-height);
  border-radius: var(--header-content-height);
  transition: scale 0.2s ease-in-out;
}
.main-navigation .menu-item a:is(:hover, :focus) {
  scale: 1.05;
}

.lang-nav {
  display: flex;
  align-items: center;
  text-transform: uppercase;
  color: var(--color-light);
  padding-inline: var(--nav-buttons-padding-inline);
  border-radius: var(--header-content-height);
  overflow: hidden;
  margin-left: clamp(1em, 0.8873925501em + 0.2865329513vw, 1.3em);
}
.lang-nav__list {
  display: flex;
  --list-gap: 1em;
  gap: var(--list-gap);
}
.lang-nav__link {
  display: inline-block;
}
.lang-nav__link[aria-current] {
  position: relative;
  color: var(--color-dark);
  --hole-size: calc(0.38 * var(--header-content-height));
}
.lang-nav__link[aria-current]::before {
  content: "";
  position: absolute;
  top: calc(-0.5 * var(--header-content-height));
  bottom: calc(-0.5 * var(--header-content-height));
  left: 50%;
  width: 1000%;
  transform: translateX(-50%);
  background-color: var(--color-dark);
  z-index: -1;
  mask: radial-gradient(circle at center, transparent var(--hole-size), black calc(var(--hole-size) + 0.3px));
  transition: transform 0.1s ease-in-out;
}
.lang-nav:has(.lang-nav__link:not([aria-current]):focus) .lang-nav__item .lang-nav__link[aria-current] {
  color: var(--color-light);
}
.lang-nav:has(.lang-nav__link:not([aria-current]):focus) .lang-nav__item .lang-nav__link:not([aria-current]) {
  color: var(--color-dark);
}
.lang-nav:has(.lang-nav__link:not([aria-current]):focus) .lang-nav__item:last-child .lang-nav__link[aria-current]::before {
  transform: translateX(calc(-60% - var(--list-gap)));
}
.lang-nav:has(.lang-nav__link:not([aria-current]):focus) .lang-nav__item:first-child .lang-nav__link[aria-current]::before {
  transform: translateX(calc(-40% + var(--list-gap)));
}

/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
@keyframes hero-filter-fade {
  0% {
    opacity: 0;
    scale: 0.95;
  }
  100% {
    opacity: 1;
    scale: 1;
  }
}
@keyframes hero-image-fade {
  0% {
    filter: blur(12px);
    scale: 1.1;
  }
  100% {
    filter: blur(0);
    scale: 1;
  }
}
.hero {
  position: relative;
  height: calc(100vh - var(--header-height, 0px));
  background-color: var(--color-light);
  --transition-time: 1.5s;
}
.hero.block-editor-block-list__block {
  height: unset;
}
.hero__container {
  padding-top: clamp(2.5rem, 0.6232091691rem + 4.7755491882vw, 7.5rem);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media screen and (min-width: 1440px) {
  .hero__container {
    padding-top: clamp(7.5rem, -0.8571428571rem + 5.8035714286vw, 14rem);
  }
}
.hero__image {
  position: absolute;
  top: calc(-1 * var(--header-height));
  left: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  background-color: var(--color-light);
}
.hero__image img {
  height: 100%;
  min-height: 73rem;
  width: 100%;
  object-fit: cover;
  object-position: 55% max(22%, -33vh);
  scale: 1.1;
  filter: blur(12px);
  animation: hero-image-fade var(--transition-time) cubic-bezier(0.39, 0.58, 0.57, 1) forwards;
}
.hero__image-filter {
  z-index: 1;
  backdrop-filter: blur(12px);
  background-color: hsla(var(--color-light-angle), var(--color-light-saturation), var(--color-light-lightness), 0.35);
  mask-size: 100%;
  mask-repeat: no-repeat;
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  margin-top: auto;
  opacity: 0;
  animation: hero-filter-fade var(--transition-time) cubic-bezier(0.39, 0.58, 0.57, 1) 0.03s forwards;
}
.hero__filter-wrapper {
  position: absolute;
  top: var(--header-height);
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  --min-width-filter: 67rem;
  margin-inline: var(--padding-section-inline);
}
@media screen and (max-width: 670px) {
  .hero__filter-wrapper {
    margin-inline: 0;
    min-width: var(--min-width-filter);
    left: 10%;
    bottom: -5rem;
    transform: translateX(-10%);
  }
}
.hero__title {
  font-family: "Bricolage Grotesque";
  letter-spacing: var(--bricolage--small-letter-spacing);
  font-size: var(--font-size-headline-primary);
  font-weight: 500;
  z-index: 10;
  hyphens: manual;
}
.hero__title * {
  font-size: inherit;
  font-family: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
}
.hero__intro {
  width: 15em;
  margin-right: 1.7em;
  margin-top: 1em;
  margin-left: auto;
  z-index: 10;
}
@media screen and (max-width: 570px) {
  .hero__intro {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
  }
}

/*--------------------------------------------------------------
# Contact Form using Contact Form 7
--------------------------------------------------------------*/
/* Inner Contact Form using Contact Form 7 */
/* Normalizing inputs */
:where(input[type=submit i]) {
  padding-block: 0;
  padding-inline: 0;
  border-width: 0;
  border-style: unset;
  border-color: unset;
  border-image: unset;
  cursor: pointer;
}

/* end normalizing inputs */
.wpcf7 {
  grid-column: 2;
  container-type: inline-size;
  margin-top: 0.7em;
  margin-bottom: auto;
}
@container (max-width: 500px) {
  .wpcf7 {
    grid-column: 1/-1;
    margin-top: 1em;
  }
}
.wpcf7 > form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 1.1em;
  row-gap: 1.5em;
  font-size: var(--font-size-text-standard);
  --input-padding-inline: 1.1em;
  --input-padding-block: 0.8em;
  --input-height: calc(2 * var(--input-padding-block) + 1lh);
}
@container (max-width: 365px) {
  .wpcf7 > form {
    grid-template-columns: 1fr;
    row-gap: 1.15em;
    margin-top: 0.3em;
  }
}
.wpcf7 > form.invalid .wpcf7-response-output,
.wpcf7 > form .wpcf7-response-output, .wpcf7 > form.sent .wpcf7-response-output {
  border: unset;
  border-radius: unset;
  padding: unset;
  display: flex;
  width: fit-content;
  margin: 0;
  order: 999;
  grid-column: 1/-1;
}
.wpcf7 .button {
  position: relative;
  width: 7.5em;
}
.wpcf7 .button .wpcf7-submit {
  color: inherit;
  background-color: unset;
  height: 100%;
  width: 100%;
  text-align: start;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  padding-inline: 1em;
  border-radius: var(--border-radius);
}
.wpcf7 .button .gb-shape,
.wpcf7 .button .button__arrow-container {
  margin-left: auto;
}
.wpcf7[lang=en-US] .button {
  width: 6.3em;
}

.contact-form__input-wrapper {
  position: relative;
}
.contact-form__input-wrapper .wpcf7-form-control-wrap {
  position: unset;
}
.contact-form__input-wrapper:has(*[aria-required=true]) .contact-form__label-visual-hints::before {
  content: "*";
}
.contact-form__input-wrapper > label:not(:has(.wpcf7-quiz-label)),
.contact-form__input-wrapper .wpcf7-quiz-label {
  position: absolute;
  top: var(--input-padding-block);
  left: var(--input-padding-inline);
  z-index: 1;
  line-height: 1;
  color: inherit;
  transition: all 0.2s ease-in-out;
}
.contact-form__input-wrapper:focus-within > label:not(:has(.wpcf7-quiz-label)),
.contact-form__input-wrapper:focus-within .wpcf7-quiz-label, .contact-form__input-wrapper:not(:has(input:placeholder-shown, textarea:placeholder-shown)) > label:not(:has(.wpcf7-quiz-label)),
.contact-form__input-wrapper:not(:has(input:placeholder-shown, textarea:placeholder-shown)) .wpcf7-quiz-label {
  top: calc(-0.7 * var(--input-padding-block));
  left: -0.4em;
  font-size: 0.9em;
  padding-inline: 0.5em;
  padding-bottom: 0.2em;
  background-color: var(--color-accent);
  border-radius: 0 0 1rem;
}
.contact-form__input-wrapper:focus-within > label:not(:has(.wpcf7-quiz-label)) .contact-form__label-visual-hints::after,
.contact-form__input-wrapper:focus-within .wpcf7-quiz-label .contact-form__label-visual-hints::after, .contact-form__input-wrapper:not(:has(input:placeholder-shown, textarea:placeholder-shown)) > label:not(:has(.wpcf7-quiz-label)) .contact-form__label-visual-hints::after,
.contact-form__input-wrapper:not(:has(input:placeholder-shown, textarea:placeholder-shown)) .wpcf7-quiz-label .contact-form__label-visual-hints::after {
  content: ":";
}
.contact-form__input-wrapper:has(.contact-form__textarea) {
  grid-column: 1/-1;
}
.contact-form__input, .contact-form__textarea {
  border-radius: 0.5rem;
  border: unset;
  background-color: hsla(var(--color-light-angle), var(--color-light-saturation), var(--color-light-lightness), 0.2);
  padding-inline: var(--input-padding-inline);
  padding-block: var(--input-padding-block);
  border-radius: calc(0.5 * var(--input-height));
  color: var(--color-light);
}
.contact-form__input:focus, .contact-form__textarea:focus {
  outline: unset;
  border: 1px solid var(--color-light);
  background-color: unset;
}
.contact-form__input::placeholder, .contact-form__textarea::placeholder {
  opacity: 0;
}
.contact-form__input {
  width: 100%;
  height: var(--input-height);
}
.contact-form__textarea {
  height: 15em;
}
.contact-form__mandatory-text {
  order: 99;
  margin-left: auto;
}
.contact-form__submit-wrapper {
  grid-column: 1/-1;
  display: flex;
  justify-content: space-between;
}

.wpcf7-not-valid {
  border: 1px solid var(--color-light) !important;
}

span.wpcf7-not-valid-tip {
  visibility: hidden;
  width: 0;
  height: 0;
}

.wpcf7-spinner {
  display: none;
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
.footer-nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

main .section:last-child {
  margin-bottom: calc(var(--footer-height) - var(--border-radius));
  border-radius: 0 0 var(--border-radius) var(--border-radius);
}

.site {
  z-index: 1;
  position: relative;
}

footer:focus-within {
  position: relative;
}

.site-footer {
  background-color: var(--color-dark);
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100vh;
}
.site-footer:focus-within {
  position: relative;
  margin-top: calc(-1 * var(--footer-height));
  height: auto;
}

/*--------------------------------------------------------------
# Complianz Cookie Banner
--------------------------------------------------------------*/
#cmplz-cookiebanner-container {
  /* Container */
  /* Message */
  /* All buttons */
}
#cmplz-cookiebanner-container .cmplz-cookiebanner {
  border-radius: var(--border-radius) var(--border-radius) 0 0;
  background-color: hsla(var(--color-light-angle), var(--color-light-saturation), var(--color-light-lightness), 0.6);
  color: var(--color-dark);
  gap: 0.1em;
  padding: var(--border-radius);
  padding-top: calc(0.75 * var(--border-radius));
  padding-bottom: calc(0.5 * var(--border-radius));
  backdrop-filter: blur(12px);
  bottom: 0;
  right: var(--padding-section-inline);
  width: 22em;
  min-width: 30rem;
}
@media screen and (max-width: 400px) {
  #cmplz-cookiebanner-container .cmplz-cookiebanner {
    width: unset;
    min-width: unset;
    left: var(--padding-section-inline);
  }
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-body {
  min-width: unset;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-message {
  width: 100%;
  font-size: var(--font-size-text-small);
}
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-accept {
  background-color: unset;
  padding: unset;
  width: unset;
  margin-right: auto;
  margin-top: 0.5em;
  display: inline-flex;
  align-items: center;
  border: 0.2rem solid var(--button-color);
  color: var(--button-color);
  padding-inline: 0.85em;
  --height: clamp(2.8875rem, 2.6059813754rem + 0.7163323782vw, 3.6375rem);
  height: var(--height);
  border-radius: 5rem;
  font-family: "Bricolage Grotesque";
  font-size: calc(var(--font-size-button) * 0.75);
  line-height: var(--height);
  font-weight: 500;
  margin-right: auto;
  white-space: nowrap;
  transition: scale 0.2s ease-in-out;
  position: relative;
}
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-accept:is(:hover, :focus), #cmplz-cookiebanner-container .cmplz-buttons .cmplz-accept:has(a:focus-visible) {
  scale: 1.05;
}
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-accept:focus-visible, #cmplz-cookiebanner-container .cmplz-buttons .cmplz-accept:has(a:focus-visible) {
  outline: 2px solid var(--color-accent);
  outline-offset: 0.3em;
}
@media screen and (min-width: 1440px) {
  #cmplz-cookiebanner-container .cmplz-buttons .cmplz-accept {
    height: clamp(4.85rem, 4.5285714286rem + 0.2232142857vw, 5.1rem);
  }
}
/*# sourceMappingURL=styles.css.map */