.twz-cookiemonster.twz-cm-popup {
    --popup-backgroundcolor: var(--grey-950);
    --popup-textcolor: var(--grey-50);
    --popup-btn-allow-all-bg: var(--green-500);
    --popup-slider-bg: var(--green-500);
    --popup-btn-allow-all-textcolor: var(--black);

    --popup-more-info-hovercolor: color-mix(in srgb, var(--green-500) 90%, var(--black));
}
.gform_wrapper form {

   .gfield--type-choice {
      legend {
         margin-block-end: 0.8rem;

         &:has(+ .gfield_description) {
            margin-block-end: 0.8rem;

            .gfield_description {
               margin-block-end: 1em;
            }
         }
      }
   }

   :is(.gfield_checkbox, .gfield_radio) {

      & > .gchoice {
         position: relative;
         align-items: center;

         & > label {
            color: var(--label-color, var(--text-color));
            line-height: 1.3;
         }

         & > input:where([type="radio"], [type="checkbox"]) {
            margin: 0;
            position: absolute;
            inset-block-start: 0.25em;
            inset-inline-start: 0;
         }
      }

      :is(button, input[type="text"]) {
         margin-block-start: 0.75em;
      }
   }

   .ginput_container_consent {
      display: flex;
      align-items: flex-start;
      gap: 1.6rem;
   }

   .gfield--type-consent legend {
      position: absolute;
      inline-size: 1px;
      block-size: 1px;
      overflow: clip;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
   }

   :is(.ginput_container_consent, :is(.gfield_checkbox, .gfield_radio)) {
      :is(input[type=checkbox], input[type=radio]) {
         width: 2rem;
         min-width: 2rem;
         height: 2rem;
         margin: 0;
         flex-shrink: 0;
         transform: none;
         opacity: 0;
         position: relative;
         display: none;

         & + label {
            position: relative;
            display: inline-block;
            color: var(--grey-50, #e5e2e1);
            font-size: var(--font-size);
            padding-inline-start: 2em;
            font-weight: 400;
            line-height: 1.5;
            text-transform: uppercase;

            &.gfield_consent_label {
               font-size: var(--font-size);
            }

            &::after {
               content: '';
               position: absolute;
               inset-block-start: 0.2rem;
               inset-inline-start: 0;
               inline-size: 2rem;
               block-size: 2rem;
               border: 0.2rem solid rgb(255 255 255 / 20%);
               border-radius: 0;
               background: transparent;
            }
         }

         &:checked + label::after {
            border-color: var(--green-500, #5aad5a);
            background-color: var(--green-500, #5aad5a);
            background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' fill='none' viewBox='0 0 12 10'%3E%3Cpath stroke='%23211b1e' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.8' d='m1 5.2 3.2 3.2L11 1.6'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: center;
            background-size: 1.2rem 1rem;
         }

         &:focus-visible + label::after {
            outline: 2px solid var(--green-500, #5aad5a);
            outline-offset: 2px;
         }
      }
   }

   input[type=radio] {
      & + label {
         text-transform: none;

         &::after {
            border-radius: 50%;
         }
      }

      &:checked + label::after {
         background-image: none;
         box-shadow: inset 0 0 0 0.4rem var(--green-500, #5aad5a);
         background-color: transparent;
      }
   }
}

.gform_wrapper form {

   .gfield--type-fileupload {
      display: flex;
      flex-direction: column;
      gap: 0.8rem;
   }

   .ginput_container.ginput_container_fileupload {
      position: relative;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 1.6rem;
      margin-block-start: 0;
   }

   .gfield--type-fileupload .ginput_container_fileupload .ginput_preview_list {
      display: none;
   }

   .gfield--file-image {
      flex: 1 1 100%;
      display: grid;
      grid-template-columns: minmax(0, 1fr);

      .gfield_label {
         grid-area: 1 / 1;
         align-self: center;
         justify-self: start;
         z-index: 1;
         margin-inline-start: calc(3.5rem + 3.3rem + 1.8rem);
         pointer-events: none;
         color: rgb(255 255 255 / 40%);
         font-size: 1.2rem;
         line-height: 1.33;
         text-transform: uppercase;
         transition: opacity 0.2s ease-in-out;
      }

      &.gfield--has-file .gfield_label {
         opacity: 0;
         visibility: hidden;
      }

      .ginput_container_fileupload {
         grid-area: 1 / 1;
         justify-content: flex-start;
         align-content: center;
         gap: 1.8rem;
         min-block-size: 8.5rem;
         padding: 1.6rem 3.5rem;
         background-color: var(--form-file-bg, #2a2a2a);
         border: 0.2rem dashed rgb(255 255 255 / 10%);
         margin-block-start: 0;

         &:is(:hover, :focus-within) {
            border-color: var(--white);
         }
      }

      .twz-form-fileupload__icon {
         display: flex;
         flex-shrink: 0;
         align-items: center;
         inline-size: 3.3rem;
         block-size: 3.8rem;

         :is(.twz-icon, svg) {
            inline-size: 100%;
            block-size: 100%;
         }
      }

      .twz-form-fileupload__filename {
         flex: 1 1 auto;
         min-inline-size: 0;
         color: var(--grey-50, #e5e2e1);
         font-size: 1.2rem;
         line-height: 1.33;
         text-transform: uppercase;
         overflow: hidden;
         text-overflow: ellipsis;
         white-space: nowrap;

         &:empty {
            display: none;
         }
      }

      .gform_fileupload_rules {
         position: absolute;
         inline-size: 1px;
         block-size: 1px;
         overflow: clip;
         clip: rect(0, 0, 0, 0);
         white-space: nowrap;
      }

      input[type="file"] {
         position: absolute;
         inset: 0;
         opacity: 0;
         cursor: pointer;
      }
   }

   .gfield--file-cv {
      flex: 1 1 100%;
      display: grid;
      grid-template-columns: minmax(0, 1fr);

      .gfield_label {
         grid-area: 1 / 1;
         align-self: center;
         justify-self: start;
         z-index: 1;
         margin-inline-start: 1.7rem;
         pointer-events: none;
      }

      .ginput_container_fileupload {
         grid-area: 1 / 1;
         justify-content: space-between;
         min-block-size: 6rem;
         padding: 1.7rem;
         background-color: var(--form-select-bg, #201f1f);
         border: 1px solid rgb(255 255 255 / 10%);
      }

      .gform_fileupload_rules {
         margin: 0;
         margin-inline-start: auto;
         padding: 0.5rem 1.7rem;
         border: 1px solid var(--green-500, #5aad5a);
         color: transparent;
         font-size: 0;
         font-style: normal;
         line-height: 1.33;
         text-transform: uppercase;
         cursor: pointer;
         pointer-events: none;

         &::after {
            content: "SELECT FILE";
            color: var(--green-500, #5aad5a);
            font-size: 1.2rem;
         }
      }

      input[type="file"] {
         position: absolute;
         inset: 0;
         opacity: 0;
         cursor: pointer;
      }

      .twz-form-fileupload__filename {
         flex: 1 1 auto;
         min-inline-size: 0;
         margin-inline-start: auto;
         color: var(--grey-50, #e5e2e1);
         font-size: 1.2rem;
         line-height: 1.33;
         text-align: end;
         text-transform: uppercase;
         overflow: hidden;
         text-overflow: ellipsis;
         white-space: nowrap;

         &:empty {
            display: none;
         }
      }

      .ginput_container_fileupload.has-file {
         .gform_fileupload_rules {
            display: none;
         }
      }

      &.gfield--has-file .gfield_label {
         opacity: 0;
         visibility: hidden;
      }

      &:has(input[type="file"]:focus-visible) .gform_fileupload_rules {
         outline: 2px solid var(--green-500, #5aad5a);
         outline-offset: 2px;
      }
   }
}

:is(input:not([type="submit"]):not([type="file"]), textarea, select) {
  width: 100%;
  transition: border-color 0.3s ease-in-out, color 0.3s ease-in-out;
  padding: var(--padding-y) var(--padding-x);
  border: var(--border) solid var(--bordercolor);
  color: var(--inputcolor);
  font-size: var(--font-size);
  font-weight: 400;
  background-color: var(--backgroundcolor);
  border-radius: var(--input-border-radius);

  &::-moz-placeholder {
    -moz-transition: color 0.3s ease-in-out;
    transition: color 0.3s ease-in-out;
    color: var(--placeholdercolor);
    text-transform: uppercase;
  }

  &::placeholder {
    transition: color 0.3s ease-in-out;
    color: var(--placeholdercolor);
    text-transform: uppercase;
  }

  &:focus {
    outline: none;
    border-color: var(--bordercolor--focused);

    &::-moz-placeholder {
      color: var(--placeholdercolor--focused);
    }

    &::placeholder {
      color: var(--placeholdercolor--focused);
    }
  }
}

input {
  &[type="number"] {
    display: inline-block;
    padding: 1rem 1.3rem;
  }
}

textarea {
  resize: vertical;
  min-block-size: 8.6rem;
}

.gform_wrapper form .gfield--type-website .ginput_container_website {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;

  &::before {
    content: "HTTPS://";
    display: flex;
    flex-shrink: 0;
    align-items: center;
    padding: 0 1.2rem 0 1.3rem;
    background-color: var(--form-file-bg, #2a2a2a);
    border: var(--border) solid var(--bordercolor);
    border-inline-end: 0;
    color: rgb(255 255 255 / 40%);
    font-size: 1.2rem;
    line-height: 1.33;
    white-space: nowrap;
  }

  input {
    flex: 1 1 auto;
    inline-size: auto;
    min-inline-size: 0;
    border-inline-start: 0;
  }
}

:is(label, legend) {
   color: var(--labelcolor);
   font-size: var(--labelsize);
   line-height: 1.5;
   text-transform: uppercase;

   &:not(.twz-label) + .ginput_container {
      margin-block-start: 0.8rem;
   }
}

:is(.twz-label, .gfield_label, .gfield--type-select .gfield_label) {
   display: block;
   margin: 0;
   color: var(--labelcolor);
   font-size: var(--labelsize);
   font-weight: 400;
   line-height: 1.5;
   text-transform: uppercase;
}

.twz-fieldrow {
   display: flex;
   flex-direction: column;
   gap: 0.8rem;
}

.gfield--outside-section .gfield_consent_label {
   text-transform: none;
   color: var(--labelcolor);
   font-size: var(--labelsize);

   a {
      color: var(--green-500, #5aad5a);
      text-decoration: underline;
      text-underline-offset: 0.2rem;
   }
}

.gform_wrapper form .gform_fields {
   counter-reset: form-section;
}

.gform-body:has(.twz-form-section) + .gform_footer {  
   @media (min-width: 1025px) {
      width: min(60%, var(--row-m));
      margin-inline-start: auto;
   }
}

form .twz-form-section {
   counter-increment: form-section;
   display: grid;
   grid-template-columns: 1fr min(60%, var(--row-m));
   gap: 1.6rem 3.2rem;
   align-items: start;
   margin-block-end: 3.5rem;

   @media (max-width: 1024px) {
      grid-template-columns: 1fr;
      gap: 2rem;
   }

   .gfield--type-section {
      margin: 0;
      padding: 0;
      border: none;
      grid-column: auto;
   
      &::before {
         content: counter(form-section, decimal-leading-zero);
         display: block;
         margin-block-end: 0.8rem;
         color: var(--white);
         font-family: var(--font-special);
         font-size: 3.2rem;
         font-weight: 600;
         line-height: 1.1;
         text-transform: uppercase;
      }
   
      .gsection_title {
         margin: 0;
         color: var(--green-500, #5aad5a);
         font-family: var(--font-special);
         font-size: 1.6rem;
         font-weight: 400;
         letter-spacing: -0.04rem;
         line-height: 1.5;
         text-transform: uppercase;
      }
   
      @media (max-width: 1024px) {
         grid-column: 1;
      }
   }

   + fieldset.gfield {
      @media (min-width: 1025px) {
         width: min(60%, var(--row-s));
         margin-left: auto;
      }
   }
}

.twz-form-section__fields {
   display: grid;
   grid-template-columns: repeat(12, minmax(0, 1fr));
   gap: 3.2rem;
   padding: 3.3rem;
   background-color: var(--form-section-bg, #1c1b1b);
   border: 1px solid rgb(255 255 255 / 10%);

   @media (max-width: 1024px) {
      padding: 2rem;
      gap: 2rem;
   }

   &:where(:has(> .gfield--type-fileupload)):not(:has(> :where(:not(.gfield--type-fileupload)))) {
      display: flex;
      flex-wrap: wrap;
      gap: 1.6rem;
      padding: 0;
      background: transparent;
      border: none;
   }
}

.gfield--outside-section {
   grid-column: 1 / -1;
   margin-inline-start: calc(min(32%, 43.6rem) + 3.2rem);
   inline-size: calc(100% - min(32%, 43.6rem) - 3.2rem);

   @media (max-width: 1024px) {
      margin-inline-start: 0;
      inline-size: 100%;
   }
}

.gform_wrapper form {

   .gfield--type-select {
      display: flex;
      flex-direction: column;
      gap: 0.8rem;
   }

   .gfield_select {
      -webkit-appearance: none;
         -moz-appearance: none;
              appearance: none;
      padding-inline-end: 4rem;
      background-color: var(--form-select-bg, #201f1f);
      background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23e5e2e1' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m4 6 4 4 4-4'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 1.2rem center;
      background-size: 1.6rem;
      color: var(--grey-50, #e5e2e1);
      text-transform: uppercase;
   }

   .ginput_container_select {
      margin: 0;
   }
}

.twz-form {
  &:has(.gf_page_steps) {
    .twz-form__wrapper {
      justify-content: center;
    }
  }

  .gform_page_footer {
    & > .gform_previous_button {
        border: 2px solid var(--primary-color);
        color: var(--primary-color);
    }
  }

  .gf_page_steps {
    flex-direction: column;
    gap: 0;
  }

  .gf_step_label {
    --gf-local-text-transform: inherit;
  }

  form {
    --gf-field-pg-steps-number-bg-color-complete: var(--primary-color);
    --gf-field-pg-steps-number-border-color-complete: var(--primary-color);
    --gf-field-pg-steps-number-border-color: var(--secondary-color);
    --gf-local-border-color: var(--secondary-color);
    --gf-field-pg-steps-number-color-active: var(--white);
    --gf-field-pg-steps-number-bg-color-active: var(--secondary-color);
  }
}

.gform_footer {
  --btn-bg: var(--green-500);
  --btn-color: var(--black);

  margin-inline-start: calc(min(32%, 43.6rem) + 3.2rem);
  inline-size: calc(100% - min(32%, 43.6rem) - 3.2rem);
  margin-block-start: 2rem;

  @media (max-width: 1024px) {
    margin-inline-start: 0;
    inline-size: 100%;
  }
}

:is(input[type="button"], input[type="submit"]) {
  width: 100%;

  &:is(:hover, :focus-visible) {
    background-color: color-mix(in srgb, var(--green-500) 90%, var(--black));
  }
}
.gform_wrapper form {

  .gform_validation_errors {
    border: 0 none;
    margin-block: 0 2.4rem;
    padding: 0;
    background-color: inherit;
    box-shadow: none;
    outline: 0 none;

    &:focus {
      outline: 0;
      border: 0 none;
    }

    .validation-error {
      background-color: unset;
      color: var(--textcolor-error, #ff6b6b);
      border: 0 none;
      font-size: 1.8rem;
      line-height: 1.4;
    }

    .validation-error__hint {
      margin-block: 0.8rem 0;
      color: var(--grey-50, #e5e2e1);
      font-size: 1.4rem;
      line-height: 1.4;
    }
  }

  .gfield_required {
    color: var(--form-error-color, #ff6b6b);
    font-size: 1.2rem;
    display: inline-block;
    padding-inline-start: 0.5rem;
  }

  .gfield_error {
    .gfield_label {
      color: var(--form-error-color, #ff6b6b);
    }

    :is(input, textarea, select) {
      border-color: var(--form-error-color, #ff6b6b);

      &::-moz-placeholder {
        color: var(--form-error-color, #ff6b6b);
      }

      &::placeholder {
        color: var(--form-error-color, #ff6b6b);
      }
    }

    .ginput_container_website::before {
      border-color: var(--form-error-color, #ff6b6b);
    }

    .ginput_container_fileupload {
      border-color: var(--form-error-color, #ff6b6b);
    }

    .gfield--file-image .ginput_container_fileupload {
      border-color: var(--form-error-color, #ff6b6b);
    }

    :is(.ginput_container_consent, :is(.gfield_checkbox, .gfield_radio)) {
      :is(input[type=checkbox], input[type=radio]) + label::after {
        border-color: var(--form-error-color, #ff6b6b);
      }
    }

    .validation_message {
      display: block;
      flex: 1 1 100%;
      order: 99;
      margin-block-start: 0.8rem;
      padding: 0;
      color: var(--form-error-color, #ff6b6b);
      background: transparent;
      border-radius: var(--form-radius);
      font-size: 1.4rem;
      font-style: normal;
      line-height: 1.4;
    }

    .validation_message.validation_message--hidden-on-empty:not(:empty) {
      display: block;
    }
  }

  :is(.gfield--type-captcha, .gfield--type-honeypot) {
    display: none;
  }

}

html {
  scroll-behavior: smooth;
  font-family: var(--font-base);
  font-size: 62.5%;
}

body {
  font-size: var(--fs-p);
  line-height: 1.652;
  font-weight: 400;
  color: var(--text-color);
  background-color: var(--theme-bg);

  @media (max-width: 767px) {
    line-height: 1.5;
  }

  &::after {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 100;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.3s ease;
  }
}

.content {
  overflow-x: clip;
}

[id] {
  scroll-margin-top: calc(var(--nav-height) + var(--nav-gap));
}

:focus-visible {
  outline: 2px solid var(--green-500);
  outline-offset: 2px;
}

:is(img, picture) {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: var(--hotspots);
}

a {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 0.1em;
  text-underline-offset: 0.4em;
}

.full-link {
  position: absolute;
  inset: 0;
  z-index: 5;
  text-decoration: none;
}

.row {
  inline-size: min(var(--row-width, 95%), var(--row-maxwidth, 140rem));
  margin-inline: auto;
  padding-block: var(--paddingTop, var(--row-padding-block)) var(--paddingBottom, var(--row-padding-block));  
}

:is(.row--grey-950, .row--grey-980) {
  position: relative;
  
  &::before {
    content: '';
    width: 100vw;
    height: 100%;
    margin-left: 50%;
    translate: -50% 0;
    background: var(--backgroundColor);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
  }
}

.row--grey-950 {
  --backgroundColor: var(--grey-950);
}

.row--small {
  --row-maxwidth: var(--row-m);
}

.row--full {
  --row-width: 100%;
  --row-maxwidth: 100%;
}

.row.row--padding-top-none { 
  --paddingTop: var(--padding-none);
}

.row.row--padding-top-small { 
  --paddingTop: var(--padding-small);
}

.row.row--padding-top-medium { 
  --paddingTop: var(--padding-medium);
}

.row.row--padding-top-large { 
  --paddingTop: var(--padding-large);
}

.row.row--padding-top-xlarge { 
  --paddingTop: var(--padding-xlarge);
}


.row.row--padding-bottom-none { 
  --paddingBottom: var(--padding-none);
}

.row.row--padding-bottom-small { 
  --paddingTop: var(--padding-small);
}

.row.row--padding-bottom-medium { 
  --paddingTop: var(--padding-medium);
}

.row.row--padding-bottom-large { 
  --paddingTop: var(--padding-large);
}

.row.row--padding-bottom-xlarge { 
  --paddingTop: var(--padding-xlarge);
}


.row.row--margin-top-small { 
  --marginTop: var(--margin-small);
}

.row.row--margin-top-medium { 
  --marginTop: var(--margin-medium);
}

.row.row--margin-top-large { 
  --marginTop: var(--margin-large);
}

.row.row--margin-top-xlarge { 
  --marginTop: var(--margin-xlarge);
}

.row.row--margin-bottom-small { 
  --marginBottom: var(--margin-small);
}

.row.row--margin-bottom-medium { 
  --marginBottom: var(--margin-medium);
}

.row.row--margin-bottom-large { 
  --marginBottom: var(--margin-large);
}

.row.row--margin-bottom-xlarge { 
  --marginBottom: var(--margin-xlarge);
}

.wp-block-columns {
  gap: 6rem;
}
/* Document
 * ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */

 html {
    line-height: 1.15; /* 1 */
    -webkit-text-size-adjust: 100%;
            text-size-adjust: 100%; /* 2 */
  }
  
  body {
    margin: 0;
    padding: 0;
  }
  
  * {
    box-sizing: border-box;
  }
  
  /* Sections
   * ========================================================================== */
  
  /**
   * Correct the font size and margin on `h1` elements within `section` and
   * `article` contexts in Chrome, Edge, Firefox, and Safari.
   */
  
  h1 {
    font-size: 2em;
  }
  
  :where(h1, h2, h3, h4, h5, h6, p) {
    margin: 0;
  }
  
  /* Grouping content
   * ========================================================================== */
  
  /**
   * Remove the margin on nested lists in Chrome, Edge, IE, and Safari.
   */
  
  :where(menu, dl dl, dl ol, dl ul, ol dl, ul dl) {
    margin: 0;
  }
  
  /**
   * Remove the margin on nested lists in Edge 18- and IE.
   */
  
  :where(ol ol, ol ul, ul ol, ul ul) {
    margin: 0;
  }
  
  /**
   * 1. Add the correct box sizing in Firefox.
   * 2. Correct the inheritance of border color in Firefox.
   * 3. Show the overflow in Edge 18- and IE.
   */
  
  hr {
    box-sizing: content-box; /* 1 */
    color: inherit; /* 2 */
    height: 0; /* 1 */
    overflow: visible; /* 3 */
  }
  
  /**
   * Add the correct display in IE.
   */
  
  main {
    display: block;
  }
  
  /**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
  
  pre {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  
  /* Text-level semantics
   * ========================================================================== */
  
  /**
   * Remove the gray background on active links in IE 10.
   */
  
  a {
    background-color: transparent;
  }
  
  /**
   * Add the correct text decoration in Edge 18-, IE, and Safari.
   */
  
  abbr[title] {
    text-decoration: underline;
    text-decoration: underline dotted;
  }
  
  
  /**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
  
  :where(code, kbd, samp) {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  
  /**
   * Add the correct font size in all browsers.
   */
  
  small {
    font-size: 80%;
  }
  
  /* Embedded content
   * ========================================================================== */
  
  /**
   * Add the correct display in IE 9-.
   */
  
  :where(audio, video) {
    display: inline-block;
  }
  
  /**
   * Add the correct display in iOS 4-7.
   */
  
  audio:not([controls]) {
    display: none;
    height: 0;
  }
  
  /**
   * Remove the border on images within links in IE 10-.
   */
  
  :where(img, picture) {
    display: inline-block;
    max-width: 100%;
    height: auto;
    border-style: none;
  }
  
  /**
   * Hide the overflow in IE.
   */
  
  svg:not(:root) {
    overflow: hidden;
  }
  
  /* Tabular data
   * ========================================================================== */
  
  /**
   * 1. Correct table border color inheritance in all Chrome, Edge, and Safari.
   * 2. Remove text indentation from table contents in Chrome, Edge, and Safari.
   */
  
  table {
    border-color: inherit; /* 1 */
    text-indent: 0; /* 2 */
  }
  
  /* Forms
   * ========================================================================== */
  
  /**
   * Remove the margin on controls in Safari.
   */
  
  :where(button, input, select) {
    margin: 0;
  }
  
  /**
   * 1. Show the overflow in IE.
   * 2. Remove the inheritance of text transform in Edge 18-, Firefox, and IE.
   */
  
  button {
    overflow: visible; /* 1 */
    text-transform: none; /* 2 */
  }
  
  /**
   * Correct the inability to style buttons in iOS and Safari.
   */
  
  :where(button, [type="button"], [type="reset"], [type="submit"]) {
    appearance: button;
  }
  
  /**
   * Correct the padding in Firefox.
   */
  
  fieldset {
    padding: 0.35em 0.75em 0.625em;
  }
  
  /**
   * Show the overflow in Edge 18- and IE.
   */
  
  input {
    overflow: visible;
  }
  
  /**
   * 1. Correct the text wrapping in Edge 18- and IE.
   * 2. Correct the color inheritance from `fieldset` elements in IE.
   */
  
  legend {
    box-sizing: border-box; /* 1 */
    color: inherit; /* 2 */
    display: table; /* 1 */
    max-width: 100%; /* 1 */
    white-space: normal; /* 1 */
  }
  
  /**
   * 1. Add the correct display in Edge 18- and IE.
   * 2. Add the correct vertical alignment in Chrome, Edge, and Firefox.
   */
  
  progress {
    display: inline-block; /* 1 */
    vertical-align: baseline; /* 2 */
  }
  
  /**
   * Remove the inheritance of text transform in Firefox.
   */
  
  select {
    text-transform: none;
  }
  
  /**
   * 1. Remove the margin in Firefox and Safari.
   * 2. Remove the default vertical scrollbar in IE.
   */
  
  textarea {
    margin: 0; /* 1 */
    overflow: auto; /* 2 */
  }
  
  /**
   * 1. Add the correct box sizing in IE 10-.
   * 2. Remove the padding in IE 10-.
   */
  
  :where([type="checkbox"], [type="radio"]) {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
  }
  
  /**
   * 1. Correct the odd appearance in Chrome, Edge, and Safari.
   * 2. Correct the outline style in Safari.
   */
  
  [type="search"] {
    appearance: textfield; /* 1 */
    outline-offset: -2px; /* 2 */
  }
  
  /**
   * Correct the cursor style of increment and decrement buttons in Safari.
   */
  
  :is(::-webkit-inner-spin-button, ::-webkit-outer-spin-button) {
    height: auto;
  }
  
  /**
   * Correct the text style of placeholders in Chrome, Edge, and Safari.
   */
  
  ::-webkit-input-placeholder {
    color: inherit;
    opacity: 0.54;
  }
  
  /**
   * Remove the inner padding in Chrome, Edge, and Safari on macOS.
   */
  
  ::-webkit-search-decoration {
    appearance: none;
  }
  
  /**
   * 1. Correct the inability to style upload buttons in iOS and Safari.
   * 2. Change font properties to `inherit` in Safari.
   */
  
  ::-webkit-file-upload-button {
    appearance: button; /* 1 */
    font: inherit; /* 2 */
  }
  
  /**
   * Remove the inner border and padding of focus outlines in Firefox.
   */
  
  ::-moz-focus-inner {
    border-style: none;
    padding: 0;
  }
  
  /**
   * Restore the focus outline styles unset by the previous rule in Firefox.
   */
  
  :-moz-focusring {
    outline: 1px dotted ButtonText;
  }
  
  /**
   * Remove the additional :invalid styles in Firefox.
   */
  
  :-moz-ui-invalid {
    box-shadow: none;
  }
  
  /* Interactive
   * ========================================================================== */
  
  /*
   * Add the correct display in Edge 18- and IE.
   */
  
  details {
    display: block;
  }
  
  /*
   * Add the correct styles in Edge 18-, IE, and Safari.
   */
  
  /*
   * Add the correct display in all browsers.
   */
  
  summary {
    display: list-item;
  }
  
  menu {
    padding: unset;
    list-style: none;
  }
  
  /* Scripting
   * ========================================================================== */
  
  /**
   * Add the correct display in IE 9-.
   */
  
  canvas {
    display: inline-block;
  }
  
  /**
   * Add the correct display in IE.
   */
  
  template {
    display: none;
  }
  
  /* User interaction
   * ========================================================================== */
  
  /**
   * Add the correct display in IE 10-.
   */
  
  [hidden] {
    display: none;
  }
@font-face {
    font-family: "Barlow Condensed";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/Barlow-Condensed-SemiBold.woff2") format("woff2");
}

@font-face {
    font-family: "Barlow Condensed";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/Barlow-Condensed-Regular.woff2") format("woff2");
}

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

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

:root {

    --font-base: "Roboto", sans-serif;
    --font-special: "Barlow Condensed", sans-serif;

    --white: #ffffff;
    --black: #000000;

    --green-500: #5AAD5A;
    --green-800: #121A12;

    --grey-50: #E5E2E1;
    --grey-200: #A3A3A3;
    --grey-400: #8c8c8c;
    --grey-500: #71717A;
    --grey-950: #141414;
    --grey-980: #0A0A0A;

    --text-color: var(--white);
    --theme-bg: var(--grey-980);

    --radius: 0px;

    --padding-none: 0;
    --padding-small: 3rem;
    --padding-medium: 6rem;
    --padding-large: 9rem;
    --padding-xlarge: 12rem;

    --padding-default: var(--padding-large);
    --row-padding-block: var(--padding-default);

    --margin-none: 0;
    --margin-small: 3rem;
    --margin-medium: 6rem;
    --margin-large: 9rem;

    --nav-height: 9.1rem;

    --row-s: 80rem;
    --row-m: 90rem;
    --row-l: 110rem;
    --row-xl: 140rem;

    --row-maxwidth: var(--row-xl);
    --row-width: 95%;

    /* Font size scale — named by px equivalent (1rem = 10px) */
    --fs-10:  1.0rem;
    --fs-16:  1.6rem;
    --fs-24:  2.4rem;
    --fs-26:  2.6rem;
    --fs-32:  3.2rem;
    --fs-40:  4.0rem;
    --fs-48:  4.8rem;
    --fs-72:  7.2rem;
    --fs-150: 15rem;

    --theme-fs-base: var(--fs-16);
    --fs-p: var(--fs-16);

    @media (max-width: 1024px) {
        --nav-height: 6.5rem;

        --padding-small: 1.5rem;
        --padding-medium: 3rem;
        --padding-large: 4.5rem;
        --padding-xlarge: 6rem;
    }
}
:where(h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6) {
  font-family: var(--font-special);
  font-weight: 600;
  line-height: 1.3;
  text-transform: uppercase;
  color: var(--text-color, inherit);

  &:has(+ *:not([hidden])) {
    margin-block-end: 0.5em;
  }
}

:is(h1, .h1, h2, .h2) {
  font-size: clamp(var(--fs-48), 9vw, var(--fs-72));
}

:is(h3, .h3) {
  font-size: clamp(var(--fs-24), 4vw, var(--fs-32));
  line-height: 1.4;
}

:is(h4, .h4) {
  font-size: clamp(var(--fs-24), 5vw, var(--fs-26));
  line-height: 1.4;
}

:is(h5, .h5) {
  font-size: clamp(var(--fs-16), 5vw, var(--fs-24));
  line-height: 1.4;
}

p {
  font-size: var(--fs-p);
  line-height: 1.652;

  a:not(:is(.button, .btn)) {
    text-decoration: underline;
    text-decoration-thickness: 0.1em;
    text-underline-offset: 0.4em;
    color: inherit;
  }

  &:has(+ :is(h1, h2, h3, h4, h5, h6)) + :is(h1, h2, h3, h4, h5, h6) {
    margin-block-start: .5em;
  }

}

p:not(:first-child) {
  margin-block-start: 0.75em;
}

a:not(.btn) {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.list--unstyled {
  list-style: none;
  padding: 0;
  margin: 0;
}

.uppercase {
    text-transform: uppercase;
}

/* WYSIWYG typography, text colors, and button classes (front-end + editor) */

:is(.twz-text, .twz-project-list__intro, .mce-content-body, .acf-field-wysiwyg) {
    :where(.h1, .h2, .h3, .h4, .h5) {
        margin: 0;
        font-family: var(--font-special);
        font-weight: 600;
        line-height: 1.3;
        text-transform: uppercase;
        color: var(--grey-50, #e5e2e1);
    }

    :is(.h1, .h2) {
        font-size: clamp(var(--fs-48), 9vw, var(--fs-72));
    }

    :is(.h3) {
        font-size: clamp(var(--fs-24), 4vw, var(--fs-32));
        line-height: 1.4;
    }

    :is(.h4) {
        font-size: clamp(var(--fs-24), 5vw, var(--fs-26));
        line-height: 1.4;
    }

    :is(.h5) {
        font-size: clamp(var(--fs-16), 5vw, var(--fs-24));
        line-height: 1.4;
    }

    :is(.white, span.white) {
        color: var(--white, #fff);
    }

    :is(.green-500, span.green-500) {
        color: var(--green-500, #5aad5a);
    }

    :is(.grey-50, span.grey-50) {
        color: var(--grey-50, #e5e2e1);
    }

    :is(.grey-200, span.grey-200) {
        color: var(--grey-200, #a3a3a3);
    }

    :is(.black, span.black) {
        color: var(--black, #000);
    }
}