/* ------------------------- Variables -------------------------------------------------- */

:root {
  /* CSS Animations */
  --animation-default-fast: 0.4s cubic-bezier(0.425, 0, 0, 1);
  --animation-default: 0.8s cubic-bezier(0.425, 0, 0, 1);
  --animation-ease: 0.15s ease;
  --section-padding: 10em;
  
  /* Colors */
  --color-rgb-dark: 36, 32, 33;
  --color-rgb-light: 241, 241, 241;
  --color-rgb-primary: 222, 81, 38;
  
  /* Sizes */
  --col-width-left-responsive: clamp(30em, 60vh, 38.5em);
  --col-width-right-responsive: calc(100vw - ((var(--gap) * 3) + var(--col-width-left)));
  --g-size-home: calc(((100vw - (var(--col-width-right) + (var(--gap) * 3))) * 0.7516233766) + (var(--gap) * 2));
  --relative-nav-height: calc(((100vw - (var(--col-width-left) + (var(--gap) * 3))) * 0.1234256927) + (var(--gap) * 2));
}

/* Tablet */
@media screen and (max-width: 991px) {
  :root {
    --relative-nav-height: calc(2.10875em + (var(--gap) * 2));
    --col-width-left: 100%;
    --col-width-right: 100%;
    --col-width-left-responsive: 100%;
    --col-width-right-responsive: 100%;
  }
}

/* Mobile Landscape */
@media screen and (max-width: 767px) {}

/* Mobile Portrait */
@media screen and (max-width: 479px) {}

/* ------------------------- Copy/Paste Media Queries -------------------------------------------------- */

@media screen and (max-width: 991px) {}
@media screen and (max-width: 767px) {}
@media screen and (max-width: 479px) {}

@media screen and (min-width: 992px) {}
@media screen and (min-width: 768px) {}
@media screen and (min-width: 480px) {}

@media (hover: hover) and (pointer: fine) {}
@media (hover: none) and (pointer: coarse) {}

:is(.wf-design-mode, .w-editor) {}

/* ------------------------- Scaling System made by Dennis Snellenberg -------------------------------------------------- */

/* Desktop */
:root {
  --size-unit: 16; /* body font-size in design - no px */
  --size-container-ideal: 1440; /* screen-size in design - no px */
  --size-container-min: 992px;
  --size-container-max: 100vw;
  --size-container: clamp(var(--size-container-min), 100vw, var(--size-container-max));
  --size-font: calc(var(--size-container) / (var(--size-container-ideal) / var(--size-unit)));
}

/* Tablet */
@media screen and (max-width: 991px) {
	:root {
    --size-container-ideal: 834; /* screen-size in design - no px */
    --size-container-min: 768px;
    --size-container-max: 991px;
	}
}

/* Mobile Landscape */
@media screen and (max-width: 767px) {
	:root {
    --size-container-ideal: 390; /* screen-size in design - no px */
    --size-container-min: 480px;
    --size-container-max: 767px;
	}
}

/* Mobile Portrait */
@media screen and (max-width: 479px) {
	:root {
    --size-container-ideal: 390; /* screen-size in design - no px */
    --size-container-min: 240px;
    --size-container-max: 479px;
	}
}

/* ------------------------- Viewportheight -------------------------------------------------- */

:root {
  --vh-in-px: 8px; /* Default fallback */
  --vh: var(--vh-in-px);
  --dvh: var(--vh); /* Same as original VH */
  --svh: var(--vh);
  --lvh: var(--vh);
}

/* Only on non-touch devices */
@media (hover: hover) and (pointer: fine) {
  :root {
    --vh: 1vh;
  }

  /* If the device supports svh and lvh */
  @supports (height: 1svh) {
    :root {
      --vh: 1vh; /* Viewport height */
      --dvh: 1dvh; /* Dynamic viewport height */
      --svh: 1svh; /* Small viewport height */
      --lvh: 1lvh; /* Large viewport height */
    }
  }
}

/* Only on touch devices */
@media (hover: none) and (pointer: coarse) {
  /* Set vh to dvh initially */
  :root {
    --vh: var(--vh-in-px);
  }
  
  /* If the device supports lvh */
  @supports (height: 1lvh) {
    :root {
      --dvh: 1dvh; /* Dynamic viewport height */
      --svh: 1svh; /* Small viewport height */
      --lvh: 1lvh; /* Large viewport height */
    }
  }
}

/* ------------------------- Lenis -------------------------------------------------- */

html.lenis {height: auto;}
.lenis.lenis-smooth {height: 100vh;}
.lenis.lenis-smooth [data-lenis-prevent]
.lenis.lenis-stopped {overflow: hidden;}
.lenis.lenis-scrolling iframe {pointer-events: none;}

/* ------------------------- Hide Scrollbar -------------------------------------------------- */

body ::-webkit-scrollbar, body::-webkit-scrollbar{display: none;} /* Chrome, Safari, Opera */
body {-ms-overflow-style: none;} /* IE & Edge */
html {scrollbar-width: none;} /* Firefox */

/* ------------------------- Body -------------------------------------------------- */

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
li, ul, figure { padding: 0; margin: 0; list-style: none;}

body {
  -webkit-font-smoothing: antialiased;
}

html, body {
  width: 100%;
  min-height: 100%;
  -webkit-font-smoothing: antialiased;
  position: relative;
}

/* Selection */
::selection {
  background-color: var(--color-primary);
  color: var(--color-dark);
  text-shadow: none;
}

::-moz-selection {
  background-color: var(--color-primary);
  color: var(--color-dark);
  text-shadow: none;
}

/* General */
canvas, img, video, picture, figure {
  max-width: 100%;
  height: auto;
  box-sizing: border-box;
  display: block;
}

img {
  width: 100%;
}

svg {
  max-width: none;
  height: auto;
  box-sizing: border-box;
}

audio, canvas, iframe, img, svg, video, picture, figure {
  vertical-align: middle;
}

h1, h2, h3, h4, h5, h6, p, a, li, ul, ol, span, strong, em, figcaption  {padding: 0; margin: 0;}

.main-wrap {
  min-height: calc(100 * var(--vh));
}

/* ------------------------- Font Sizes -------------------------------------------------- */

h1, .h1, h2, .h2 {
  font-size: 16em;
}

h3, .h3 {
  font-size: 3.875em;
}

h4, .h4 {
  font-size: 2.5em;
}

h5, .h5, .pl {
  font-size: 1.25em;
  line-height: 1;
  letter-spacing: -0.04em;
  font-weight: 500;
}

.pm {
  font-size: 1em;
  line-height: 1.3;
  font-weight: 500;
  letter-spacing: -0.02em;
}

p {
  font-size: 1em;
  line-height: 1.3;
  font-weight: 400;
  letter-spacing: -0.02em;
}

strong, p strong {
  font-weight: 500;
}


@media screen and (max-width: 991px) {}
@media screen and (max-width: 767px) {}
@media screen and (max-width: 479px) {}

/* ------------------------- Loading -------------------------------------------------- */

:is(.wf-design-mode, .w-editor) .loading-container {
  display: none;
}

/* ------------------------- Split Text -------------------------------------------------- */

.single-word {
  overflow: hidden;
  position: relative;
  margin-bottom: -0.055em;
  margin-left: -0.1em;
  margin-right: -0.1em;
  padding: 0 0.1em;
  display: inline-block;
}

.single-word .single-char {
  position: relative;
  display: inline-block;
}

.single-word .single-word-inner {
  position: relative;
  display: inline-block;
}

.project-header__h1 .single-word {
  margin-bottom: -0.055em;
}

/* ------------------------- Underline Link -------------------------------------------------- */

.underline-link {
  cursor: pointer;
}

.underline-link::before,
.underline-link.is--alt::before,
.underline-link.is--alt::after{
  content: "";
  position: absolute;
  bottom: 0em;
  left: 0;
  width: 100%;
  height: 0.0625em;
  background-color: currentColor;
  transition: transform var(--animation-default);
  transform-origin: right;
  transform: scaleX(0) rotate(0.001deg);
}

.underline-link:hover::before {
  transform-origin: left;
  transform: scaleX(1) rotate(0.001deg);
}

/* Alt */
.underline-link.is--alt::before {
  transform-origin: left;
  transform: scaleX(1) rotate(0.001deg);
  transition-delay: 0.3s;
}

.underline-link.is--alt:hover::before {
  transform-origin: right;
  transform: scaleX(0) rotate(0.001deg);
  transition-delay: 0s;
}

.underline-link.is--alt::after {
  transform-origin: right;
  transform: scaleX(0) rotate(0.001deg);
  transition-delay: 0s;
}

.underline-link.is--alt:hover::after {
  transform-origin: left;
  transform: scaleX(1) rotate(0.001deg);
  transition-delay: 0.3s;
}

/* ------------------------- Hamburger -------------------------------------------------- */

.hamburger__bar {
  transform: translateY(0.3125em) rotate(0.001deg);
}

.hamburger__bar:nth-child(2) {
  transform: translateY(-0.3125em) rotate(0.001deg);
}

.mobile-nav .hamburger__bar {
  transform: translateY(0em) rotate(45deg);
}

.mobile-nav .hamburger__bar:nth-child(2) {
  transform: translateY(0em) rotate(-45deg);
}

/* ------------------------- Home - Visual -------------------------------------------------- */


:is(.wf-design-mode, .w-editor) .home-visual {
  height: auto;
}

/* ------------------------- Marquee -------------------------------------------------- */

.marquee__collection > *:nth-child(4n + 1) .marquee__logo-border-svg {
  transform: scaleY(-1);
}

.marquee__collection > *:nth-child(4n + 3) .marquee__logo-border-svg {
  transform: scale(-1);
}

.marquee__collection > *:nth-child(4n + 4) .marquee__logo-border-svg {
  transform: scaleX(-1);
}

.marquee__logo-img[data-logo-size="XL"] {
  height: 100%;
}

.marquee__logo-img[data-logo-size="L"] {
  height: 80%;
}

.marquee__logo-img[data-logo-size="M"] {
  height: 65%;
}

.marquee__logo-img[data-logo-size="S"] {
  height: 50%;
}

.marquee__logo-img[data-logo-size="XS"] {
  height: 35%;
}

/* ------------------------- Tags -------------------------------------------------- */


[data-tags] .w-condition-invisible {
  display: block !important;
  opacity: 0.3;
}

[data-tags] .work-card__single-tag p {
  opacity: 0.3;
}

[data-tags] .work-card__single-tag:has(.work-card__tag-check) p {
  opacity: 1;
}

/* Webflow Editor */
:is(.wf-design-mode, .w-editor) [data-tags] .work-card__single-tag:has(.w-condition-invisible) p {
  opacity: 0.3;
}

/* ------------------------- Parallax -------------------------------------------------- */

[data-parallax-strength] {
  --parallax-strength: 0%;
  --parallax-height: 0%;
}

[data-parallax-target] {
  height: calc(100% + (var(--parallax-height) * 2));
  top: calc(var(--parallax-height) * -1);
  will-change: transform;
}

/* ------------------------- Btn -------------------------------------------------- */

.btn {
  clip-path: polygon(99.9% 0.1%, 99.9% 99.9%, 99.9% 99.9%, 0.1% 99.9%, 0.1% 0.1%);
}

.btn .btn__side-left {
  transform: rotate(180deg);
}

.btn .btn__side-right,
.btn:hover .btn__side-left{
  transition: var(--animation-default-fast);
  clip-path: polygon(100% 0%, 100% 70%, 35% 100%, 0% 100%, 0% 0%);
}

.btn .btn__side-left,
.btn:hover .btn__side-right {
  transition: var(--animation-default-fast);
  clip-path: polygon(100% 0%, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
}

/* BG Colors */
.btn[data-btn-bg="orange"] {
  color: var(--color-orange);
}

.btn[data-btn-bg="gold"] {
  color: var(--color-gold);
}

.btn[data-btn-bg="green"] {
  color: var(--color-green);
}

/* Text Colors */
.btn[data-btn-color="light"] .btn__p {
  color: var(--color-light);
}

/* ------------------------- Home Picks -------------------------------------------------- */

@media screen and (min-width: 992px) {
  .home-picks [data-parallax-target] {
    height: 100%;
    top: 0%;
  }
}

/* ------------------------- More cards - Two -------------------------------------------------- */

.more-cards-two .more-cards__item:nth-child(1) {
  width: var(--col-width-right);
}

.more-cards-two .more-cards__item:nth-child(2) {
  width: var(--col-width-left);
}

.more-cards-two.is--green .news-card__date {
 color: var(--color-green); 
}

.more-cards-two.is--green .news-card__tag {
 background-color: var(--color-darkgreen);   
}

@media screen and (min-width: 992px) {
  .more-cards-two .more-cards__item:nth-child(2) .work-card__before {
    padding-top: 66.666%;
  }
}

@media screen and (min-width: 768px) {
  .more-cards-two .more-cards__item:nth-child(2) .work-card__before {
    padding-top: 55%;
  }
}

/* ------------------------- More cards - Three -------------------------------------------------- */

.more-cards-three.is--green .news-card__tag {
  background-color: var(--color-darkgreen);
}

.more-cards-three.is--green .news-card__date {
  color: var(--color-green);
}

@media screen and (min-width: 992px) {
  
  .more-cards-three .more-cards__item:nth-child(1) {
    width: 27.3125em;
  }
  
  .more-cards-three .more-cards__item:nth-child(2) {
    width: 32.875em;
  }
  
  .more-cards-three .more-cards__item:nth-child(2) .work-card__before {
    padding-top: 110%;
  }
  
  .more-cards-three .more-cards__item:nth-child(3) {
    width: 27.3125em;
  }
}

@media screen and (max-width: 767px) {
  .more-cards-three .more-cards__item:nth-child(3) {
    display: none;
  }
}

/* ------------------------- Work Grid -------------------------------------------------- */

@media screen and (min-width: 992px) {

  .card-grid .card-grid__item:nth-child(7n + 1) {
    width: var(--col-width-left);
  }
  
  .card-grid .card-grid__item:nth-child(7n + 1) .work-card__before {
    padding-top: 66.666%;
  }
  
  .card-grid .card-grid__item:nth-child(7n + 2) {
    width: var(--col-width-right);
  }
  
  .card-grid .card-grid__item:nth-child(7n + 3) {
    width: 27.3125em;
  }
  
  .card-grid .card-grid__item:nth-child(7n + 3) .work-card__before {
    padding-top: 85%;
  }
  
  .card-grid .card-grid__item:nth-child(7n + 4) {
    width: 32.875em;
  }
  
  .card-grid .card-grid__item:nth-child(7n + 4) .work-card__before {
    padding-top: 110%;
  }
  
  .card-grid .card-grid__item:nth-child(7n + 5) {
    width: 27.3125em;
  }
  
  .card-grid .card-grid__item:nth-child(7n + 5) .work-card__before {
    padding-top: 85%;
  }
  
  .card-grid .card-grid__item:nth-child(7n + 6) {
    width: var(--col-width-right);
    margin-right: 1em;
  }
}

@media (min-width: 768px) and (max-width: 991px) {

  .card-grid .card-grid__item:nth-child(4n + 2),
  .card-grid .card-grid__item:nth-child(4n + 3){
    width: 21.125em;
  }
  
  .card-grid .card-grid__item:nth-child(4n + 1),
  .card-grid .card-grid__item:nth-child(4n + 4){
    width: 29.125em;
  }
}


/* ------------------------- Work Card -------------------------------------------------- */

@media (hover: hover) and (pointer: fine) {
  
  .work-card__h3, 
  .work-slab__h3 {
    --trans-mult: 1;
  }
  
  .news-card__h3, 
  .news-slab__h3 {
    --trans-mult: 0.5;
  }
  
  .work-card .cover-image,
  .work-slab .cover-image,
  .footer__thumbnail .cover-image,
  .home-picks__row-img .cover-image {
    transition: transform var(--animation-default);
    transform: scale(1) rotate(0.001deg);
  }
  
  .home-picks__row-img:hover .cover-image {
    transform: scale(1.033) rotate(0.001deg);
  }
  
  .work-card:hover .cover-image,
  .footer__thumbnail:hover .cover-image {
    transform: scale(1.05) rotate(0.001deg);
  }
  
  .work-slab:hover .cover-image{
    transform: scale(1.1) rotate(0.001deg);
  }
  
  :is(.work-card, .work-slab, .news-card, .news-slab) :is(.work-card__h3, .work-slab__h3, .news-card__h3, .news-slab__h3) .single-word-inner {
    transition: transform var(--animation-default);
    text-shadow: 0em 1em 0em currentColor;
    transform: translateY(0%) rotate(0.001deg);
  }
  
  :is(.work-card, .work-slab, .news-card, .news-slab):hover :is(.work-card__h3, .work-slab__h3, .news-card__h3, .news-slab__h3) .single-word-inner {
    transform: translateY(-100%) rotate(0.001deg);
  }
}

/* ------------------------- Grid List Buttons -------------------------------------------------- */

.gridlist-btn .gridlist__fill { 
  transition: clip-path var(--animation-default);
}

.gridlist-btn[data-gridlist-type="grid"][data-gridlist-status="active"] .gridlist__fill {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}

.gridlist-btn[data-gridlist-type="grid"][data-gridlist-status="not-active"] .gridlist__fill {
  clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
}

.gridlist-btn[data-gridlist-type="list"][data-gridlist-status="active"] .gridlist__fill {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}

.gridlist-btn[data-gridlist-type="list"][data-gridlist-status="not-active"] .gridlist__fill {
  clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
}

/* ------------------------- Grid List Groups -------------------------------------------------- */

[data-gridlist-group] {
  transform-origin: top right;
}

[data-gridlist-group][data-gridlist-type="list"] {
  transform-origin: top left;
}

/* In */

[data-gridlist-group][data-gridlist-status="not-active"] {
  transform: translateX(-100%) translateY(0) rotate(0.001deg);
  position: absolute;
  top: 0;
}

[data-gridlist-group][data-gridlist-status="transitioning-in"] {
  transform: translateX(0%) translateY(0) rotate(0.001deg);
  position: relative;
  transition: transform var(--animation-default);
  z-index: 1;
}

/* Out */

[data-gridlist-group][data-gridlist-status="active"] {
  transform: translateX(0%) translateY(0) rotate(0.001deg);
  position: relative;
  z-index: 1;
  
}

[data-gridlist-group][data-gridlist-status="transitioning-out"] {
  transform: translateX(-66%) translateY(0) rotate(-6deg);
  position: absolute;
  top: 0;
  transition: transform var(--animation-default);
}

/* Left/Right Overwrite */

[data-gridlist-group][data-gridlist-type="list"][data-gridlist-status="not-active"] {
  transform: translateX(100%) translateY(0) rotate(0.001deg);
}

[data-gridlist-group][data-gridlist-type="list"][data-gridlist-status="transitioning-out"] {
  transform: translateX(66%) translateY(0) rotate(6deg);
}

@media screen and (min-width: 992px) {
  [data-gridlist-group][data-gridlist-status="transitioning-out"] {
    transform: translateX(-50%) translateY(0) rotate(-6deg);
  }
  [data-gridlist-group][data-gridlist-type="list"][data-gridlist-status="transitioning-out"] {
    transform: translateX(50%) translateY(0) rotate(6deg);
  }
}

/* ------------------------- Mobile Navigation -------------------------------------------------- */

.mobile-nav__dark {
  transition: all var(--animation-default);
}

[data-navigation-status="active"] .mobile-nav__dark {
  opacity: 0.7;
  visibility: visible;
}

.mobile-nav__card {
  transition: transform var(--animation-default);
}

[data-navigation-status="active"] .mobile-nav__card {
  transform: translateY(0%) rotate(0.001deg);
}

/* ------------------------- Fixed Navigation -------------------------------------------------- */

.fixed-nav {
  transition: transform var(--animation-default), background-color var(--animation-ease), color var(--animation-ease);
}

[data-scrolling-started="true"][data-scrolling-direction="up"] .fixed-nav {
  transform: translateY(0%) rotate(0.001deg);
}

[data-theme-nav="dark"] .fixed-nav {
  background-color: var(--color-dark);
  color: var(--color-light);
}

[data-bg-nav="green"] .fixed-nav {
  background-color: var(--color-darkgreen);
}

[data-bg-nav="orange"] .fixed-nav {
  background-color: var(--color-orange);
}

/* ------------------------- Team Card -------------------------------------------------- */

.team-card[data-text-color="Dark"] .team-card__info {
  color: var(--color-dark);
}
  
.home-teamcards__list .home-teamcards__item:nth-child(4n-3) {
  width: 21.75em;
  margin-left: 6.25em;
}

/*.home-teamcards__list .home-teamcards__item:nth-child(4n-3) .team-card {*/
/*  transform-origin: right center; */
/*}*/

.home-teamcards__list .home-teamcards__item:nth-child(4n-2) {
  width: 32.75em;
  margin-left: 17.5em;
  margin-top: 15em;
}

/*.home-teamcards__list .home-teamcards__item:nth-child(4n-2) .team-card {*/
/*  transform-origin: left center; */
/*}*/

.home-teamcards__list .home-teamcards__item:nth-child(4n-1) {
  width: 32.75em;
  margin-left: var(--gap);
}

/*.home-teamcards__list .home-teamcards__item:nth-child(4n-1) .team-card {*/
/*  transform-origin: right center; */
/*}*/

.home-teamcards__list .home-teamcards__item:nth-child(4n) {
  width: 21.75em;
  margin-left: 29.25em;
  margin-top: 20em;
  margin-bottom: 10em;
}

/*.home-teamcards__list .home-teamcards__item:nth-child(4n) .team-card {*/
/*  transform-origin: left center; */
/*}*/

@media screen and (max-width: 991px) {
  .home-teamcards__list .home-teamcards__item {
    font-size: 0.5791666667em;
  }
}

@media screen and (max-width: 767px) {
  .home-teamcards__list .home-teamcards__item {
    font-size: 1em;
  }
  
  .home-teamcards__list .home-teamcards__item:nth-child(4n-3) {
    width: 15em;
    margin-left: var(--gap);
  }
  
  .home-teamcards__list .home-teamcards__item:nth-child(4n-2) {
    width: 17.5em;
    margin-left: auto;
    margin-top: 5em;
    margin-right: var(--gap);
  }
  
  .home-teamcards__list .home-teamcards__item:nth-child(4n-1) {
    width: 15em;
    margin-top: 5em;
    margin-left: var(--gap);
  }
  
  .home-teamcards__list .home-teamcards__item:nth-child(4n) {
    width: 17.5em;
    margin-left: auto;
    margin-top: 5em;
    margin-bottom: 5em;
    margin-right: var(--gap);
  }
}

/* ------------------------- Custom Cursor-------------------------------------------------- */

body:has(a:hover, button:hover, [data-hover]:hover) .cursor {
  mix-blend-mode: unset;
}

body:has(a:hover, button:hover, [data-hover]:hover) .cursor__svg {
  color: var(--color-primary);
}

@media (hover: none) and (pointer: coarse) {
  .cursor {
    display: none;
  }
}

/* ------------------------- Site Credits -------------------------------------------------- */

.footer-credits__hitbox {
  transition: all var(--animation-default-fast);
} 


.footer__credits-p:hover + .footer-credits__hitbox,
.footer-credits__hitbox:hover {
  opacity: 1;
  visibility: visible;
  transform: translateY(0em) rotate(0.001deg);
}

/* ------------------------- Modal -------------------------------------------------- */

.modal__dark {
  transition: all var(--animation-default);
  opacity: 0;
  visibility: hidden;
}

[data-modal-group-status="active"] .modal__dark {
  opacity: 1;
  visibility: visible;
}

[data-modal-name][data-modal-status] {
  transition: transform var(--animation-default-fast);
  transform: translateX(105%) scale(1.05) rotate(4deg);
  transform-origin: left center;
}

[data-modal-name][data-modal-status="active"] {
  transition: transform var(--animation-default);
  transform: translateX(0%) scale(1) rotate(0.001deg);
}

[data-modal-name][data-modal-status] .modal__contact {
  transition: all var(--animation-default-fast) 0s;
  transform: rotate(4deg);
  opacity: 0;
  visibility: hidden;
  transform-origin: right top;
}

[data-modal-name][data-modal-status="active"] .modal__contact {
  transition: transform var(--animation-default) 0.3s, all var(--animation-default) 0.2s;
  opacity: 1;
  visibility: visible;
  transform: rotate(0.001deg);
}

.modal__btn-close {
  transition: transform var(--animation-default), opacity var(--animation-default);
  transform: rotate(0.001deg);
  opacity: 0.5;
}

.modal__btn-close:hover {
  transform: rotate(90deg);
  opacity: 1;
}


/* ------------------------- Form -------------------------------------------------- */

/* Field: Error */
[data-validate].is--error input,
[data-validate].is--error textarea,
[data-validate].is--error select{
  border-color: var(--color-primary);
  background-color: rgba(173, 61, 27, .05);
}

[data-validate].is--error input::placeholder,
[data-validate].is--error textarea::placeholder,
[data-validate].is--error select::placeholder {
  color: rgba(173, 61, 27, 0.3);
}

.form-field-icon svg path {
  stroke-linecap: square !important;
  stroke-linejoin: square !important;
  stroke-width: 1.25px !important;
}

[data-validate].is--error .form-field-icon.is--error,
[data-validate].is--error .radiocheck-field-icon.is--error{
  opacity: 1;
}

/* Field: Success */
[data-validate].is--success .form-field-icon.is--success,
[data-validate].is--success .radiocheck-field-icon.is--success{
  opacity: 1;
}

/* Field: Custom Radio or Checkbox */
[data-validate] .radiocheck-field input:focus-visible ~ .radiocheck-custom {
  background-color: #D0CFCD;
  color: #E2E1DF;
}

[data-validate] .radiocheck-field input:focus-visible:checked ~ .radiocheck-custom,
[data-validate] .radiocheck-field input:checked ~ .radiocheck-custom {
  background-color: #131313;
  color: #EFEEEC;
}

[data-validate] .radiocheck-field .radiocheck-label.is--small {
  margin-top: 0.125em;
}

[data-validate].is--error .radiocheck-custom {
  border-color: var(--color-primary);
}

[data-validate].is--error input:checked ~ .radiocheck-custom {
  border-color: #131313; 
}

/* Field: Select */
[data-validate] select:has(option[value=""]:checked) {
  color: rgba(19, 19, 19, 0.3);
}  


/* ------------------------- Project -------------------------------------------------- */

.project-sections > section:first-child {
  padding-top: 0;
}

/* Last */

.project-sections > .project-image-full-gap:last-child {
  /*padding-bottom: var(--gap);*/
  padding-bottom: 9.375em;
}

.project-sections > .project-image-split:last-child,
.project-sections > .project-image-split-container:last-child,
.project-sections > .project-image-full-container:last-child {
  padding-bottom: 6.25em;
  padding-bottom: 9.375em;
}

.project-sections > .project-image-full:last-child {
  /*padding-bottom: 0;*/
  padding-bottom: 9.375em;
}

.project-sections > .project-quote:last-child {
  padding-bottom: 12.5em;
}

.project-sections > .project-rich:last-child {
  padding-bottom: 9.375em;
}

/* Stacking */

.project-image-full + .project-image-split,
.project-image-split-container + .project-image-full-container {
  padding-top: var(--gap);
}

.project-image-full + .project-image-full {
  padding-top: 0;
}

.project-quote + section {
  padding-top: 12.5em;
}

.project-rich + section {
  padding-top: 9.375em;
}

@media screen and (max-width: 767px) {
  
  .project-quote + section {
    padding-top: 9.375em;
  }

  .project-rich + section {
    padding-top: 6.25em;
  }
  
  .project-sections > .project-image-full-gap:last-child,
  .project-sections > .project-image-split:last-child,
  .project-sections > .project-image-split-container:last-child,
  .project-sections > .project-image-full-container:last-child,
  .project-sections > .project-image-full:last-child,
  .project-sections > .project-rich:last-child {
    padding-bottom: 6.25em;
  }
}

/* ------------------------- Share Button -------------------------------------------------- */

.share-btn .share-btn__svg {
  transition: transform var(--animation-default-fast);
  transform: translateY(0%) rotate(0.001deg);
}

.share-btn .share-btn__svg.is--duplicate {
  transform: translateY(200%) rotate(0.001deg);
}

.share-btn:hover .share-btn__svg {
  transform: translateY(-200%) rotate(0.001deg);
}

.share-btn:hover .share-btn__svg.is--duplicate {
  transform: translateY(0%) rotate(0.001deg);
}


/* ------------------------- Rich -------------------------------------------------- */

.rich h1 strong,
.rich h2 strong,
.rich h3 strong,
.rich h4 strong,
.rich h5 strong,
.rich h6 strong,
.rich a strong,
.rich p strong { 
  font-size: inherit;
  margin-top: inherit;
  line-height: inherit;
  font-weight: inherit;
  margin-bottom: inherit;
}

.rich h1,
.rich h2 {
  font-size: 3.875em;
  letter-spacing: -0.03em;
  font-family: Denton Condensed, Arial, sans-serif;
  font-weight: 400;
  line-height: 0.8;
  margin-top: 1em;
  margin-bottom: 1em;
}

.rich h3 {
  letter-spacing: -0.04em;
  font-family: Neue Haas Grotesk Display Pro, Arial, sans-serif;
  font-size: 1.625em;
  font-weight: 500;
  line-height: 1;
  margin-top: 1em;
  margin-bottom: 1em;
}

.rich h4 {
  letter-spacing: -0.04em;
  font-family: Neue Haas Grotesk Display Pro, Arial, sans-serif;
  font-size: 1.25em;
  font-weight: 500;
  line-height: 1;
  margin-top: 1em;
  margin-bottom: 1em;
}

.rich h5,
.rich h6 {
  letter-spacing: -0.04em;
  font-family: Neue Haas Grotesk Display Pro, Arial, sans-serif;
  font-size: 1em;
  font-weight: 500;
  line-height: 1;
  margin-top: 1em;
  margin-bottom: 1em;
}

.rich p,
.rich li {
  margin-bottom: 1em;
  font-size: 1em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #656565;
}

.rich p strong {
  font-weight: 500;
  color: var(--color-dark);
}

.rich ul,
.rich ol {
  padding-left: 1.5em;
  margin-bottom: 1em;
}

.rich li {
  position: relative;
  list-style: none;
  margin-bottom: 0.5em;
}

.rich li::before {
  content: "";
  display: block;
  position: absolute;
  top: 0.6em;
  left: -1em;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: var(--color-dark);
}

.rich figure {
  width: 100%;
  max-width: 100%;
  margin-top: 1em;
  margin-bottom: 1em;
}

.rich img {
  width: 100%;
  max-width: 100%;
}

.rich figcaption {
  letter-spacing: -0.04em;
  font-family: Neue Haas Grotesk Display Pro, Arial, sans-serif;
  font-size: 1em;
  font-weight: 500;
  line-height: 1;
  color: var(--color-dark);
  text-align: left;
  margin-top: 0.5em;
}

.rich blockquote {
  font-size: 3.875em;
  letter-spacing: -0.03em;
  font-family: Denton Condensed, Arial, sans-serif;
  font-weight: 400;
  line-height: 0.8;
  border-left: 0px solid transparent;
  margin: 0;
  padding: 0;
  margin-top: 1em;
  margin-bottom: 1em;
}

.rich > :first-child {
  margin-top: 0;
}

.rich > :last-child {
  margin-bottom: 0;
}

.rich a {
  color: var(--color-dark);
  text-decoration: none;
  position: relative;
}

.rich a::before,
.rich a::after{
  content: "";
  position: absolute;
  bottom: 0em;
  left: 0;
  width: 100%;
  height: 0.0625em;
  background-color: currentColor;
  transition: transform var(--animation-default);
  transform-origin: right;
  transform: scaleX(0) rotate(0.001deg);
}

.rich a::before {
  transform-origin: left;
  transform: scaleX(1) rotate(0.001deg);
  transition-delay: 0.3s;
}

.rich a:hover::before {
  transform-origin: right;
  transform: scaleX(0) rotate(0.001deg);
  transition-delay: 0s;
}

.rich a::after {
  transform-origin: right;
  transform: scaleX(0) rotate(0.001deg);
  transition-delay: 0s;
}

.rich a:hover::after {
  transform-origin: left;
  transform: scaleX(1) rotate(0.001deg);
  transition-delay: 0.3s;
}

@media screen and (max-width: 991px) {
  .rich h1,
  .rich h2,
  .rich blockquote{
    font-size: 3.125em;
  }
}
@media screen and (max-width: 991px) {}
@media screen and (max-width: 767px) {}
@media screen and (max-width: 479px) {}



/* ------------------------- Vimeo Advanced Player -------------------------------------------------- */

/* Placeholder */
.vimeo-player[data-vimeo-activated="true"][data-vimeo-loaded="true"] .vimeo-player__placeholder {
  opacity: 0;
}

/* Dark (Overlay) */
.vimeo-player[data-vimeo-playing="false"] .vimeo-player__dark {
  opacity: 0.33;
}

.vimeo-player[data-vimeo-activated="false"][data-vimeo-playing="false"] .vimeo-player__dark {
  opacity: 0;
}

.vimeo-player[data-vimeo-activated="true"][data-vimeo-loaded="true"] .vimeo-player__dark {
  opacity: 0;
}

@media (hover: hover) and (pointer: fine) {
  .vimeo-player[data-vimeo-hover="true"]:hover .vimeo-player__dark {
    opacity: 0.33 !important;
  }
}

/* Pause */
.vimeo-player .vimeo-player__pause {
  display: none;
}

.vimeo-player[data-vimeo-playing="true"] .vimeo-player__pause {
  display: flex;
}

.vimeo-player .vimeo-player__pause .vimeo-player__btn {
  opacity: 0;
}

.vimeo-player[data-vimeo-activated="true"][data-vimeo-playing="false"] .vimeo-player__pause .vimeo-player__btn,
.vimeo-player[data-vimeo-activated="true"][data-vimeo-hover="true"]:hover .vimeo-player__pause .vimeo-player__btn {
  opacity: 1;
}

@media (hover: none) and (pointer: coarse) {
  .vimeo-player[data-vimeo-activated="true"][data-vimeo-playing="true"] .vimeo-player__pause .vimeo-player__btn {
    opacity: 0 !important;
  }
}

/* Play */
.vimeo-player[data-vimeo-playing="true"] .vimeo-player__play {
  opacity: 0;
}

/* Loading */
.vimeo-player .vimeo-player__loading {
  opacity: 0;
}

.vimeo-player[data-vimeo-playing="true"] .vimeo-player__loading {
  opacity: 1;
}

.vimeo-player[data-vimeo-playing="true"][data-vimeo-loaded="true"] .vimeo-player__loading {
  opacity: 0;
}

/* Interface */
.vimeo-player .vimeo-player__interface {
  opacity: 0;
}

.vimeo-player[data-vimeo-activated="false"][data-vimeo-playing="false"] .vimeo-player__interface {
  opacity: 1;
}

.vimeo-player .vimeo-player__interface * {
  pointer-events: all; /* Make children of div clickable by user */
}

.vimeo-player[data-vimeo-activated="true"][data-vimeo-playing="false"] .vimeo-player__interface,
.vimeo-player[data-vimeo-activated="true"][data-vimeo-hover="true"]:hover .vimeo-player__interface {
  opacity: 1;
}

@media (hover: none) and (pointer: coarse) {
  .vimeo-player[data-vimeo-activated="true"][data-vimeo-playing="true"] .vimeo-player__interface {
    opacity: 0 !important;
  }
}

/* Interface - Variables */
.vimeo-player {
  --timeline-rounded-corners: 0em;
  --timeline-dot-height: 0.5em;
  --timeline-dot-color: var(--color-light);
  --progress-bg: rgba(var(--color-rgb-light), 0.2);
  --progress-fill-bg: var(--color-light);
  --progress-height: 0.125em;
}

/* Interface - Timeline */
.vimeo-player progress::-webkit-progress-bar {
  border-radius: var(--timeline-rounded-corners);
  background-color: var(--progress-bg);
  box-shadow: 0;
}

.vimeo-player progress::-webkit-progress-value {
  background: var(--progress-fill-bg);
}

.vimeo-player progress::-moz-progress-bar{
  border-radius: var(--timeline-rounded-corners);
  background: var(--progress-fill-bg);
  box-shadow: 0;
}

.vimeo-player progress::-ms-fill {
  border-radius: var(--timeline-rounded-corners);
}

/* Interface - Range */
.vimeo-player [type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
}
 
.vimeo-player [type="range"]:focus {
  outline: none;
}
 
.vimeo-player [type="range"]::-ms-track {
  width: 100%;
  cursor: pointer;
  background-color: transparent;
  border-color: transparent;
  color: transparent;
}

.vimeo-player [type="range"]::-webkit-slider-runnable-track{
  width: 100%;
  height: var(--progress-height);
  cursor: pointer;
  background-color: var(--progress-bg);
  border-radius: var(--timeline-rounded-corners);
  background-color: transparent;
  border-color: transparent;
  color: transparent;
}

.vimeo-player [type="range"]::-webkit-slider-thumb {
  box-shadow: 0;
  height: var(--timeline-dot-height);
  width: 0.125em;
  border-radius: var(--timeline-rounded-corners);
  background-color: var(--timeline-dot-color);
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: calc((var(--progress-height) / 2) - (var(--timeline-dot-height) / 2));
}

.vimeo-player [type="range"]::-webkit-slider-runnable-track,
.vimeo-player [type="range"]:focus::-webkit-slider-runnable-track {
  background-color: transparent;
  border-color: transparent;
  color: transparent;
}

.vimeo-player [type="range"]::-moz-range-track {
  width: 100%;
  height: var(--progress-height);
  cursor: pointer;
  background: var(--progress-bg);
  border-radius: 0;
  border: 0;
  border-radius: var(--timeline-rounded-corners);
  overflow: hidden;
  opacity: 1 !important;
}

.vimeo-player [type="range"]::-moz-range-thumb {
  box-shadow: 0;
  border: 0;
  height: var(--timeline-dot-height);
  width: var(--timeline-dot-height);
  border-radius: var(--timeline-rounded-corners);
  background: var(--timeline-dot-color);
  cursor: pointer;
  box-shadow: 0;
}

/* Interface - Mute */
.vimeo-player .vimeo-player__mute svg:nth-child(2),
.vimeo-player[data-vimeo-muted="true"] .vimeo-player__mute svg:nth-child(1) {
  display: none;
}

.vimeo-player .vimeo-player__mute svg:nth-child(1),
.vimeo-player[data-vimeo-muted="true"] .vimeo-player__mute svg:nth-child(2) {
  display: block;
}

/* Interface - Fullscreen */
.vimeo-player .vimeo-player__fullscreen svg:nth-child(2),
.vimeo-player[data-vimeo-fullscreen="true"] .vimeo-player__fullscreen svg:nth-child(1) {
  display: none;
}

.vimeo-player .vimeo-player__fullscreen svg:nth-child(1),
.vimeo-player[data-vimeo-fullscreen="true"] .vimeo-player__fullscreen svg:nth-child(2) {
  display: block;
}

/* ------------------------- Image Cycle -------------------------------------------------- */

:is(.wf-design-mode, .w-editor) .cover-collection-item {
  display: none;
}

:is(.wf-design-mode, .w-editor) .cover-collection-item:first-child {
  display: block;
}

[data-image-cycle-item="active"] {
  transition: opacity 0.4s ease 0s, visibility 0s ease 0s;
  opacity: 1;
  visibility: visible;
  z-index: 3;
}

[data-image-cycle-item="previous"] {
  transition: opacity 0.4s ease 0.4s, visibility 0s ease 0.4s;
  opacity: 0;
  visibility: visible;
  z-index: 2;
}

[data-image-cycle-item="not-active"] {
  opacity: 0;
  visibility: hidden;
  z-index: 1;
}