html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  margin: 0;
  padding: 0; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after, q:before, q:after {
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

a {
  text-decoration: none; }

* {
  box-sizing: border-box; }

*:after, *:before {
  box-sizing: inherit; }

img {
  max-width: 100%; }

::-moz-selection {
  background-color: rgba(37, 37, 37, 0.77);
  color: #ffffff; }

::selection {
  background-color: rgba(37, 37, 37, 0.77);
  color: #ffffff; }

@font-face {
  font-family: 'Ortica';
  src: url("../fonts/Ortica-Light.woff") format("woff"), url("../fonts/Ortica-Light.woff2") format("woff2");
  font-weight: normal;
  font-style: normal; }

/*********************
Variables
*********************/
/*********************
Mixins
*********************/
.h1 {
  font-family: 'Ortica', serif;
  font-weight: 200;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 27px;
  line-height: 0.96296;
  letter-spacing: 0.07407em; }
  @media screen and (min-width: 768px) {
    .h1 {
      font-size: 37px;
      line-height: 0.97297;
      letter-spacing: 0.05405em; } }
  @media screen and (min-width: 1440px) {
    .h1 {
      font-size: 2.56944vw; } }

.h2 {
  font-family: 'Ortica', serif;
  font-weight: 200;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 20px;
  line-height: 1.1;
  letter-spacing: 0.1em; }
  @media screen and (min-width: 768px) {
    .h2 {
      font-size: 24px;
      line-height: 1.08333;
      letter-spacing: 0.05417em; } }
  @media screen and (min-width: 1440px) {
    .h2 {
      font-size: 1.66667vw; } }

.p {
  font-family: brandon-grotesque, sans-serif;
  font-weight: 400;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 17px;
  line-height: 1.47059;
  letter-spacing: 0.01765em; }
  .p a,
  .p strong {
    font-family: brandon-grotesque, sans-serif;
    font-weight: 500;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: 0.11353em; }
  .p.small {
    font-size: 15px;
    line-height: 1.46667;
    letter-spacing: 0; }
  .p.tiny {
    font-size: 13px;
    line-height: 1.46667;
    letter-spacing: 0; }
  @media screen and (min-width: 1440px) {
    .p {
      font-size: 1.18056vw; }
      .p.small {
        font-size: 1.04167vw; }
      .p.tiny {
        font-size: 0.90278vw; } }

html {
  height: 100%; }

body {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  background-color: #ececec;
  color: #252525;
  /* &.is-loading {
    overflow: hidden;
    opacity: 0;
  }

  &.is-done-loading {
    opacity: 1;
    transition: .5s;
  } */ }
  body.noscroll {
    overflow: hidden; }

.main {
  position: relative;
  flex: 1; }

img {
  display: block; }

a {
  color: inherit; }

img:not([src]):not([srcset]) {
  visibility: hidden; }

/* Recommended styles for Splitting */
.splitting .word,
.splitting .char {
  display: inline-block; }

/* Psuedo-element chars */
.splitting .char {
  position: relative; }

/**
 * Populate the psuedo elements with the character to allow for expanded effects
 * Set to `display: none` by default; just add `display: block` when you want
 * to use the psuedo elements
 */
.splitting .char::before,
.splitting .char::after {
  content: attr(data-char);
  position: absolute;
  top: 0;
  left: 0;
  visibility: hidden;
  transition: inherit;
  user-select: none; }

/* Expanded CSS Variables */
.splitting {
  /* The center word index */
  --word-center: calc((var(--word-total) - 1) / 2);
  /* The center character index */
  --char-center: calc((var(--char-total) - 1) / 2);
  /* The center character index */
  --line-center: calc((var(--line-total) - 1) / 2); }

.splitting .word {
  /* Pecent (0-1) of the word's position */
  --word-percent: calc(var(--word-index) / var(--word-total));
  /* Pecent (0-1) of the line's position */
  --line-percent: calc(var(--line-index) / var(--line-total)); }

.splitting .char {
  /* Percent (0-1) of the char's position */
  --char-percent: calc(var(--char-index) / var(--char-total));
  /* Offset from center, positive & negative */
  --char-offset: calc(var(--char-index) - var(--char-center));
  /* Absolute distance from center, only positive */
  --distance: calc(
     (var(--char-offset) * var(--char-offset)) / var(--char-center)
  );
  /* Distance from center where -1 is the far left, 0 is center, 1 is far right */
  --distance-sine: calc(var(--char-offset) / var(--char-center));
  /* Distance from center where 1 is far left/far right, 0 is center */
  --distance-percent: calc((var(--distance) / var(--char-center))); }

.splide__container {
  box-sizing: border-box;
  position: relative; }

.splide__list {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  margin: 0 !important;
  padding: 0 !important;
  transform-style: preserve-3d; }

.splide.is-initialized:not(.is-active) .splide__list {
  display: block; }

.splide__pagination {
  -ms-flex-align: center;
  align-items: center;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: center;
  justify-content: center;
  margin: 0;
  pointer-events: none; }

.splide__pagination li {
  display: inline-block;
  line-height: 1;
  list-style-type: none;
  margin: 0;
  pointer-events: auto; }

.splide__progress__bar {
  width: 0; }

.splide {
  outline: none;
  position: relative;
  visibility: hidden; }

.splide.is-initialized, .splide.is-rendered {
  visibility: visible; }

.splide__slide {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  box-sizing: border-box;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  list-style-type: none !important;
  margin: 0;
  outline: none;
  position: relative; }

.splide__slide img {
  vertical-align: bottom; }

.splide__slider {
  position: relative; }

.splide__spinner {
  animation: splide-loading 1s linear infinite;
  border: 2px solid #999;
  border-left-color: transparent;
  border-radius: 50%;
  bottom: 0;
  contain: strict;
  display: inline-block;
  height: 20px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 20px; }

.splide__track {
  overflow: hidden;
  position: relative;
  z-index: 0; }

@keyframes splide-loading {
  0% {
    transform: rotate(0); }
  to {
    transform: rotate(1turn); } }

.splide--draggable > .splide__slider > .splide__track, .splide--draggable > .splide__track {
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none; }

.splide--fade > .splide__slider > .splide__track > .splide__list, .splide--fade > .splide__track > .splide__list {
  display: block; }

.splide--fade > .splide__slider > .splide__track > .splide__list > .splide__slide, .splide--fade > .splide__track > .splide__list > .splide__slide {
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  z-index: 0; }

.splide--fade > .splide__slider > .splide__track > .splide__list > .splide__slide.is-active, .splide--fade > .splide__track > .splide__list > .splide__slide.is-active {
  opacity: 1;
  position: relative;
  z-index: 1; }

.splide--rtl {
  direction: rtl; }

.splide--ttb.is-active > .splide__slider > .splide__track > .splide__list, .splide--ttb.is-active > .splide__track > .splide__list {
  display: block; }

.splide__arrow {
  -ms-flex-align: center;
  align-items: center;
  background: #ccc;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  display: -ms-flexbox;
  display: flex;
  height: 2em;
  -ms-flex-pack: center;
  justify-content: center;
  opacity: .7;
  padding: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2em;
  z-index: 1; }

.splide__arrow svg {
  fill: #000;
  height: 1.2em;
  width: 1.2em; }

.splide__arrow:hover {
  opacity: .9; }

.splide__arrow:focus {
  outline: none; }

.splide__arrow--prev {
  left: 1em; }

.splide__arrow--prev svg {
  transform: scaleX(-1); }

.splide__arrow--next {
  right: 1em; }

.splide__pagination {
  bottom: .5em;
  left: 0;
  padding: 0 1em;
  position: absolute;
  right: 0;
  z-index: 1; }

.splide__pagination__page {
  background: #ccc;
  border: 0;
  border-radius: 50%;
  display: inline-block;
  height: 8px;
  margin: 3px;
  opacity: .7;
  padding: 0;
  transition: transform .2s linear;
  width: 8px; }

.splide__pagination__page.is-active {
  background: #fff;
  transform: scale(1.4); }

.splide__pagination__page:hover {
  cursor: pointer;
  opacity: .9; }

.splide__pagination__page:focus {
  outline: none; }

.splide__progress__bar {
  background: #ccc;
  height: 3px; }

.splide--nav > .splide__slider > .splide__track > .splide__list > .splide__slide, .splide--nav > .splide__track > .splide__list > .splide__slide {
  border: 3px solid transparent;
  cursor: pointer; }

.splide--nav > .splide__slider > .splide__track > .splide__list > .splide__slide.is-active, .splide--nav > .splide__track > .splide__list > .splide__slide.is-active {
  border: 3px solid #000; }

.splide--nav > .splide__slider > .splide__track > .splide__list > .splide__slide:focus, .splide--nav > .splide__track > .splide__list > .splide__slide:focus {
  outline: none; }

.splide--rtl > .splide__arrows .splide__arrow--prev, .splide--rtl > .splide__slider > .splide__track > .splide__arrows .splide__arrow--prev, .splide--rtl > .splide__track > .splide__arrows .splide__arrow--prev {
  left: auto;
  right: 1em; }

.splide--rtl > .splide__arrows .splide__arrow--prev svg, .splide--rtl > .splide__slider > .splide__track > .splide__arrows .splide__arrow--prev svg, .splide--rtl > .splide__track > .splide__arrows .splide__arrow--prev svg {
  transform: scaleX(1); }

.splide--rtl > .splide__arrows .splide__arrow--next, .splide--rtl > .splide__slider > .splide__track > .splide__arrows .splide__arrow--next, .splide--rtl > .splide__track > .splide__arrows .splide__arrow--next {
  left: 1em;
  right: auto; }

.splide--rtl > .splide__arrows .splide__arrow--next svg, .splide--rtl > .splide__slider > .splide__track > .splide__arrows .splide__arrow--next svg, .splide--rtl > .splide__track > .splide__arrows .splide__arrow--next svg {
  transform: scaleX(-1); }

.splide--ttb > .splide__arrows .splide__arrow, .splide--ttb > .splide__slider > .splide__track > .splide__arrows .splide__arrow, .splide--ttb > .splide__track > .splide__arrows .splide__arrow {
  left: 50%;
  transform: translate(-50%); }

.splide--ttb > .splide__arrows .splide__arrow--prev, .splide--ttb > .splide__slider > .splide__track > .splide__arrows .splide__arrow--prev, .splide--ttb > .splide__track > .splide__arrows .splide__arrow--prev {
  top: 1em; }

.splide--ttb > .splide__arrows .splide__arrow--prev svg, .splide--ttb > .splide__slider > .splide__track > .splide__arrows .splide__arrow--prev svg, .splide--ttb > .splide__track > .splide__arrows .splide__arrow--prev svg {
  transform: rotate(-90deg); }

.splide--ttb > .splide__arrows .splide__arrow--next, .splide--ttb > .splide__slider > .splide__track > .splide__arrows .splide__arrow--next, .splide--ttb > .splide__track > .splide__arrows .splide__arrow--next {
  bottom: 1em;
  top: auto; }

.splide--ttb > .splide__arrows .splide__arrow--next svg, .splide--ttb > .splide__slider > .splide__track > .splide__arrows .splide__arrow--next svg, .splide--ttb > .splide__track > .splide__arrows .splide__arrow--next svg {
  transform: rotate(90deg); }

.splide--ttb > .splide__pagination, .splide--ttb > .splide__slider > .splide__pagination {
  bottom: 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  left: auto;
  padding: 1em 0;
  right: .5em;
  top: 0; }

footer {
  padding: 0 5.06667vw 24px;
  text-align: center; }
  footer em {
    font-style: italic; }
  footer .siteby {
    margin-top: 12px; }
  footer .p a {
    letter-spacing: 0;
    font-weight: normal; }
  @media screen and (min-width: 640px) {
    footer {
      display: flex;
      justify-content: space-between;
      align-items: center; }
      footer .siteby {
        margin-top: 0; } }
  @media screen and (min-width: 768px) {
    footer {
      padding: 0 2.36111vw 3.18182vh; } }

header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 5;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  padding: 24px 5.06667vw;
  pointer-events: none; }
  header .menu,
  header .logo {
    line-height: 1.0;
    pointer-events: all; }
  header .menu .hamburger {
    display: block;
    position: relative;
    width: 15px;
    height: 14px; }
    header .menu .hamburger:before, header .menu .hamburger:after {
      content: ''; }
    header .menu .hamburger:before, header .menu .hamburger:after,
    header .menu .hamburger span {
      position: absolute;
      left: 0;
      width: 100%;
      height: 2px;
      background-color: currentColor; }
    header .menu .hamburger:before {
      top: 0; }
    header .menu .hamburger:after {
      bottom: 0; }
    header .menu .hamburger span {
      top: 50%;
      margin-top: -1px; }
    header .menu .hamburger + a {
      display: none; }
  header .logo {
    position: relative; }
    header .logo .light,
    header .logo .dark {
      display: block;
      transition: .5s; }
    header .logo .light {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      opacity: 0; }
      header .logo .light img {
        filter: brightness(1000%); }
    header .logo img {
      margin-top: 0.06944vw;
      height: 11px;
      width: auto; }
    header .logo span {
      position: absolute;
      top: 0;
      right: 0; }
  header a {
    text-transform: uppercase;
    letter-spacing: 0.11353em; }
  @media screen and (min-width: 768px) {
    header {
      z-index: 10;
      padding: 3.18182vh 2.36111vw; }
      header .menu .hamburger {
        display: none; }
        header .menu .hamburger + a {
          display: block; }
      header .logo img {
        height: 0.76389vw;
        min-height: 11px; } }

.device-desktop header .menu,
.device-desktop header .logo {
  transition: .5s; }
  .device-desktop header .menu:hover,
  .device-desktop header .logo:hover {
    opacity: .5; }
  .device-desktop header .menu:active,
  .device-desktop header .logo:active {
    transform: scale(0.95);
    transition: .15s; }

body.is-loading .loader {
  transform: translateY(0); }
  body.is-loading .loader .logo {
    transform: translateY(0); }

body:before {
  content: '';
  display: block;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  z-index: 11;
  background-color: #2B2B2B;
  opacity: 0;
  transition: height .9s; }

body.is-menu-loading .loader {
  transition-delay: .1s; }
  body.is-menu-loading .loader .logo {
    transition-delay: .1s; }

body.is-menu-loading:before {
  height: 100%;
  opacity: 1; }

.loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  background-color: #2B2B2B;
  transform: translateY(100%);
  overflow: hidden;
  transition: 1s; }
  .loader .logo {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: translateY(-100%);
    transition: 1s; }
    .loader .logo svg {
      width: 62px;
      height: auto;
      overflow: visible; }
      .loader .logo svg path {
        fill: #fff; }
    @media screen and (min-width: 1440px) {
      .loader .logo svg {
        width: 4.30556vw; } }

body.fade:before,
body.single-project:before {
  height: 100%;
  opacity: 0;
  pointer-events: none;
  transition: opacity .5s; }

body.fade .loader,
body.single-project .loader {
  display: none; }

body.fade.is-loading:before,
body.single-project.is-loading:before {
  opacity: 1;
  pointer-events: all; }

nav {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
  height: 0;
  opacity: 0;
  pointer-events: none;
  overflow: hidden;
  transition: height 1s, opacity 0s linear 1s; }
  nav.is-open {
    opacity: 1;
    height: 100%;
    pointer-events: all;
    transition: height 1s, opacity 0s; }
    nav.is-open .overlay .primary li {
      transform: translateY(0%);
      opacity: 1;
      transition: .5s; }
      nav.is-open .overlay .primary li:nth-child(1) {
        transition-delay: .3s; }
      nav.is-open .overlay .primary li:nth-child(2) {
        transition-delay: .4s; }
      nav.is-open .overlay .primary li:nth-child(3) {
        transition-delay: .5s; }
    nav.is-open .overlay .sub li {
      transform: translateY(0%);
      opacity: 1;
      transition: .5s; }
      nav.is-open .overlay .sub li:nth-child(1) {
        transition-delay: .6s; }
      nav.is-open .overlay .sub li:nth-child(2) {
        transition-delay: .7s; }
      nav.is-open .overlay .sub li:nth-child(3) {
        transition-delay: .8s; }
      nav.is-open .overlay .sub li:nth-child(4) {
        transition-delay: .9s; }
      nav.is-open .overlay .sub li:nth-child(5) {
        transition-delay: 1s; }
    nav.is-open .overlay .logo .head,
    nav.is-open .overlay .logo .body,
    nav.is-open .overlay .logo .pedastal {
      transform: translateY(0%);
      opacity: 1; }
    nav.is-open .overlay .logo .head {
      transition-delay: 1s; }
    nav.is-open .overlay .logo .body {
      transition-delay: 1.1s; }
    nav.is-open .overlay .logo .pedastal {
      transition-delay: 1.2s; }
    nav.is-open + header {
      color: #fff; }
      nav.is-open + header .logo .light {
        opacity: 1; }
      nav.is-open + header .logo .dark {
        opacity: 0; }
  @media screen and (min-width: 768px) {
    nav {
      z-index: 5; } }
  nav .overlay {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: #2B2B2B; }
    nav .overlay .close {
      position: absolute;
      z-index: 5;
      transform: rotate(45deg);
      top: 30px;
      left: 50%;
      margin-left: -21px;
      width: 42px;
      height: 42px;
      cursor: pointer; }
      nav .overlay .close:before, nav .overlay .close:after {
        content: '';
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100%;
        height: 1px;
        background-color: #fff; }
      nav .overlay .close:before {
        transform: translate3d(-50%, -50%, 0); }
      nav .overlay .close:after {
        transform: translate3d(-50%, -50%, 0) rotate(90deg); }
    nav .overlay .image {
      display: none; }
    nav .overlay .image {
      position: relative; }
      nav .overlay .image ul,
      nav .overlay .image li {
        height: 100%; }
      nav .overlay .image video,
      nav .overlay .image img {
        width: 100%;
        height: 100%;
        object-fit: cover; }
    nav .overlay .text {
      display: flex;
      flex-direction: column;
      justify-content: center;
      height: 100%;
      width: 100%;
      padding-left: 10.13333vw;
      padding-right: 10.13333vw;
      color: #fff;
      overflow-y: scroll;
      -ms-overflow-style: none;
      scrollbar-width: none; }
      nav .overlay .text::-webkit-scrollbar {
        display: none; }
      nav .overlay .text .inner {
        margin: auto; }
    nav .overlay .primary {
      padding-top: 117px; }
      nav .overlay .primary li {
        transform: translateY(50%);
        opacity: 0;
        transition: 0s;
        transition-delay: 1s; }
        nav .overlay .primary li .h1 {
          font-size: 37px;
          line-height: 1.0;
          letter-spacing: 0.05459em;
          text-transform: uppercase; }
        nav .overlay .primary li + li {
          margin-top: 27px; }
        @media screen and (min-width: 768px) {
          nav .overlay .primary li .h1 {
            font-size: 47px;
            letter-spacing: 0.05468em; } }
        @media screen and (min-width: 1440px) {
          nav .overlay .primary li .h1 {
            font-size: 3.26389vw; }
          nav .overlay .primary li + li {
            margin-top: 3.06818vh; } }
    nav .overlay .sub {
      padding-top: 87px;
      padding-bottom: 66px;
      padding-top: 64px;
      padding-bottom: 58px; }
      nav .overlay .sub ul {
        display: flex;
        flex-direction: column;
        width: 100%; }
      nav .overlay .sub li {
        transform: translateY(50%);
        opacity: 0;
        transition: 0s;
        transition-delay: 1s;
        letter-spacing: 0.11353em; }
        nav .overlay .sub li a {
          text-transform: uppercase;
          color: #fff; }
        nav .overlay .sub li + li {
          margin-top: 20px; }
    nav .overlay .logo {
      display: none; }
      nav .overlay .logo svg {
        width: 58px; }
        nav .overlay .logo svg path {
          fill: #fff; }
      @media screen and (min-width: 1440px) {
        nav .overlay .logo svg {
          transform: scale(0.9);
          width: 4.02778vw; } }
    @media screen and (min-width: 768px) {
      nav .overlay .inner {
        width: 100%; }
      nav .overlay .close {
        display: none; }
      nav .overlay .image {
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        min-width: 50%;
        width: 43.75vw;
        height: 100%; }
        nav .overlay .image ul li {
          opacity: 0;
          transition: opacity 1s;
          z-index: 2; }
          nav .overlay .image ul li img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover; }
          nav .overlay .image ul li.is-active {
            opacity: 1;
            z-index: 1; }
      nav .overlay .text {
        padding-left: 0;
        padding-right: 0;
        padding: calc(58px + 4.72222vw); }
      nav .overlay .primary {
        padding-top: 0; }
      nav .overlay .sub {
        padding-top: 8.52273vh;
        padding-bottom: 0; }
      nav .overlay .logo {
        display: block;
        position: absolute;
        bottom: 0;
        left: 0;
        padding: 3.18182vh 2.36111vw; }
        nav .overlay .logo svg {
          overflow: visible; }
        nav .overlay .logo .head,
        nav .overlay .logo .body,
        nav .overlay .logo .pedastal {
          opacity: 0;
          transition: .5s; }
        nav .overlay .logo .head,
        nav .overlay .logo .pedastal {
          transform: translateX(-10%); }
        nav .overlay .logo .body {
          transform: translateX(10%); } }
    @media screen and (min-width: 1024px) {
      nav .overlay .image {
        min-width: 0; } }
    @media screen and (min-width: 1440px) {
      nav .overlay .text {
        padding: 8.75vw; }
      nav .overlay .sub li + li {
        margin-top: 2.27273vh; } }

.device-desktop nav .primary li a,
.device-desktop nav .sub li a {
  display: inline-block;
  transition: .5s; }
  .device-desktop nav .primary li a:hover,
  .device-desktop nav .sub li a:hover {
    opacity: .5; }
  .device-desktop nav .primary li a:active,
  .device-desktop nav .sub li a:active {
    transform: scale(0.95);
    transition: .15s; }

.device-desktop nav .close {
  transition: .5s; }
  .device-desktop nav .close:before, .device-desktop nav .close:after {
    transition: .5s; }
  .device-desktop nav .close:hover:before, .device-desktop nav .close:hover:after {
    opacity: .75; }
  .device-desktop nav .close:active {
    transform: rotate(45deg) scale(0.95);
    transition: .15s; }

@media screen and (min-width: 768px) {
  .device-desktop nav .overlay {
    height: 100vh; } }

.splash {
  position: fixed;
  z-index: 15;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #ECECEC; }
  .splash .image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .88;
    opacity: 0; }
    .splash .image img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover; }
    .splash .image .mobile {
      display: none; }
    @media screen and (max-aspect-ratio: 1 / 1) and (max-width: 767px) {
      .splash .image .mobile {
        display: block; }
      .splash .image .desktop {
        display: none; } }
  .splash .logo {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
    .splash .logo svg {
      width: 62px;
      height: auto;
      overflow: visible; }
      .splash .logo svg path {
        fill: #fff;
        opacity: 0;
        /* &.head,
        &.pedastal {
          transform: translateX(-25%);
        }

        &.body {
          transform: translateX(25%);
        } */ }
    @media screen and (min-width: 1440px) {
      .splash .logo svg {
        width: 4.30556vw; } }

.main.about {
  padding-top: 73px;
  overflow: hidden; }
  .main.about footer {
    margin-top: 76px; }
  @media screen and (min-width: 1024px) {
    .main.about {
      padding-top: 8.40278vw; }
      .main.about footer {
        margin-top: 9.30556vw; } }
  .main.about .border {
    margin: auto;
    width: 90.66667vw;
    max-width: 945px;
    border: 1px solid #1A1A1A;
    border-radius: 9999px;
    padding-bottom: 41.6vw; }
    @media screen and (min-width: 640px) {
      .main.about .border {
        padding-top: 0;
        padding-bottom: 0; }
        .main.about .border:before, .main.about .border:after {
          content: '';
          display: block;
          padding-top: 50%; }
        .main.about .border:before {
          margin-bottom: -25%; }
        .main.about .border:after {
          margin-top: -15%; } }
    @media screen and (min-width: 768px) {
      .main.about .border:before {
        margin-bottom: -28.5%; }
      .main.about .border:after {
        margin-top: -25%; } }
    @media screen and (min-width: 1024px) {
      .main.about .border:after {
        margin-top: 0; } }
    @media screen and (min-width: 1440px) {
      .main.about .border {
        max-width: 65.625vw; } }
  .main.about .intro {
    padding-top: 108px; }
    .main.about .intro .text {
      text-align: center; }
    .main.about .intro .h1 {
      margin: auto;
      width: 50%;
      min-width: 262px;
      text-transform: uppercase; }
    .main.about .intro .p {
      margin: 19px auto 0;
      width: 75%;
      max-width: 320px; }
      .main.about .intro .p a {
        display: inline-block;
        font-family: brandon-grotesque, sans-serif;
        font-weight: 500;
        font-style: normal;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        margin-top: 8px; }
      .main.about .intro .p p + p {
        margin-top: 55px; }
    @media screen and (min-width: 640px) {
      .main.about .intro {
        position: relative;
        min-height: 0;
        padding: 0; }
        .main.about .intro .h1 {
          margin: 0 auto;
          width: 60%; } }
    @media screen and (min-width: 1024px) {
      .main.about .intro {
        min-height: 0; }
        .main.about .intro .h1 {
          width: 100%;
          max-width: 32.22222vw; }
        .main.about .intro .p {
          margin-top: 1.52778vw;
          max-width: 346px; } }
    @media screen and (min-width: 1440px) {
      .main.about .intro .p {
        max-width: 24.02778vw; } }
  .main.about .body {
    margin-top: 60px;
    padding-left: 5.86667vw;
    padding-right: 5.86667vw; }
    .main.about .body .p a {
      font-family: brandon-grotesque, sans-serif;
      font-weight: 500;
      font-style: normal;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale; }
    .main.about .body .p p + p {
      margin-top: 31px; }
    @media screen and (min-width: 768px) {
      .main.about .body .p {
        column-count: 2;
        column-gap: 8.33333vw; }
        .main.about .body .p p:first-child {
          padding-bottom: 14.02778vw; }
        .main.about .body .p p:last-child {
          padding-top: 8.81944vw; }
        .main.about .body .p p + p {
          margin-top: 0; } }
    @media screen and (min-width: 1024px) {
      .main.about .body {
        padding-left: 6.875vw;
        padding-right: 6.875vw;
        margin-top: 6.94444vw; } }
  .main.about .values {
    margin-top: 55px; }
    .main.about .values .image {
      margin-left: 12.8vw;
      margin-right: 12.8vw; }
      .main.about .values .image:last-child {
        margin-top: 44px; }
      .main.about .values .image img {
        width: 100%; }
    .main.about .values .text {
      margin-top: 59px;
      padding-left: 5.86667vw;
      padding-right: 5.86667vw; }
      .main.about .values .text .h1 {
        text-transform: uppercase; }
    .main.about .values .accordian {
      margin-top: 28px; }
    .main.about .values .panel .h2 {
      line-height: 1.5;
      text-transform: uppercase;
      opacity: .71; }
      .main.about .values .panel .h2 span {
        position: relative;
        display: inline-block;
        padding-right: .5em; }
        .main.about .values .panel .h2 span:before, .main.about .values .panel .h2 span:after {
          content: '';
          display: block;
          position: absolute;
          top: 50%;
          left: 100%;
          width: 0.4em;
          height: 0.025em;
          background-color: #252525; }
        .main.about .values .panel .h2 span:after {
          transform: rotate(-90deg);
          transition: .5s; }
    .main.about .values .panel .open {
      height: 0;
      overflow: hidden; }
    .main.about .values .panel .p {
      padding-top: 2px;
      padding-bottom: 11px; }
    .main.about .values .panel.is-active .h2 {
      opacity: 1; }
      .main.about .values .panel.is-active .h2 span:after {
        transform: rotate(0); }
    .main.about .values .panel.is-active .open {
      height: auto; }
    .main.about .values .panel.activating .h2 {
      opacity: 1; }
    .main.about .values .panel.deactivating .h2 {
      opacity: .71; }
    .main.about .values .panel:last-child .p {
      padding-bottom: 0; }
    .main.about .values .panel + .panel {
      margin-top: 16px; }
    @media screen and (min-width: 768px) {
      .main.about .values {
        position: relative; }
        .main.about .values .image {
          margin: 0;
          position: absolute; }
          .main.about .values .image:first-child {
            top: 1.66667vw;
            right: -5.48611vw;
            width: 44.9735%; }
          .main.about .values .image:last-child {
            margin-top: 0;
            top: 60%;
            right: 6.80556vw;
            width: 38.9417%;
            box-shadow: 0 0.13889vw 1.66667vw rgba(0, 0, 0, 0.22); }
        .main.about .values .text {
          width: 50%;
          padding-right: 0; }
        .main.about .values .accordian {
          margin-top: 68px;
          padding-right: 1.38889vw; } }
    @media screen and (min-width: 1024px) {
      .main.about .values {
        margin-top: 5.41667vw; }
        .main.about .values .image:last-child {
          top: 24.02778vw; }
        .main.about .values .text {
          padding-left: 6.875vw; }
        .main.about .values .accordian {
          margin-top: 4.72222vw; }
        .main.about .values .panel .p {
          padding-top: 0.48611vw;
          padding-bottom: 0.83333vw; }
        .main.about .values .panel + .panel {
          margin-top: 1.52778vw; } }
  .main.about .awards {
    margin-top: 83px;
    border-top: 1px solid #252525;
    padding-top: 83px; }
    .main.about .awards .logos {
      display: grid;
      grid-template-columns: 1fr 1fr;
      column-gap: 13.33333vw;
      row-gap: 55px;
      padding-left: 7.46667vw;
      padding-right: 7.46667vw; }
      .main.about .awards .logos .logo {
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #ececec; }
        .main.about .awards .logos .logo img {
          position: relative;
          width: 100%;
          height: auto;
          mix-blend-mode: multiply;
          transform: translate3d(0, 0, 0);
          z-index: 1; }
    .main.about .awards .text {
      margin-top: 80px;
      padding-left: 5.86667vw;
      padding-right: 5.86667vw; }
      .main.about .awards .text .h1 {
        text-transform: uppercase; }
      .main.about .awards .text h3 {
        font-weight: 500; }
    .main.about .awards .list {
      margin-top: 36px; }
      .main.about .awards .list.is-expanded {
        overflow: hidden; }
        .main.about .awards .list.is-expanded li.more {
          display: none; }
        .main.about .awards .list.is-expanded li.hidden {
          display: block; }
      .main.about .awards .list li.more .p {
        text-transform: uppercase; }
      .main.about .awards .list li.hidden {
        display: none; }
      .main.about .awards .list li + li {
        margin-top: 15px; }
    @media screen and (min-width: 768px) {
      .main.about .awards {
        margin-top: 11.25vw; }
        .main.about .awards .logos {
          grid-template-columns: 1fr 1fr 1fr 1fr;
          column-gap: 5.55556vw; }
        .main.about .awards .text {
          display: flex; }
        .main.about .awards .h1 {
          flex: 1; }
        .main.about .awards .list {
          margin-top: 0;
          width: 60%; } }
    @media screen and (min-width: 1024px) {
      .main.about .awards {
        padding-top: 5.76389vw; }
        .main.about .awards .logos,
        .main.about .awards .text {
          padding-left: 6.875vw;
          padding-right: 6.875vw; }
        .main.about .awards .text {
          margin-top: 5.97222vw; }
        .main.about .awards .list {
          width: 29.86111vw; }
          .main.about .awards .list li + li {
            margin-top: 1.18056vw; } }
  .main.about .connect {
    margin-top: 96px;
    border-top: 1px solid #252525; }
    .main.about .connect .wrap {
      padding-top: 93px; }
    .main.about .connect .text {
      text-align: center; }
    .main.about .connect .h1 {
      text-transform: uppercase; }
    .main.about .connect .icon {
      margin-top: 33px; }
    .main.about .connect svg {
      width: 31px;
      height: auto; }
    .main.about .connect .p {
      margin-top: 13px; }
      .main.about .connect .p a {
        letter-spacing: inherit; }
    @media screen and (min-width: 1024px) {
      .main.about .connect {
        position: relative;
        margin-top: 8.33333vw; }
        .main.about .connect .wrap {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          padding-top: 0; }
          .main.about .connect .wrap:before {
            content: '';
            display: block;
            width: 100%;
            height: 0;
            padding-top: 50%; }
        .main.about .connect .text {
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          padding-bottom: 4.86111vw; }
        .main.about .connect .icon {
          margin-top: 2.56944vw; }
        .main.about .connect .p {
          margin-top: 0.90278vw; } }
    @media screen and (min-width: 1440px) {
      .main.about .connect svg {
        width: 2.15278vw; } }

.device-desktop .main.about .awards .list li.more p {
  display: inline-block;
  cursor: pointer;
  transition: .5s; }
  .device-desktop .main.about .awards .list li.more p:hover {
    opacity: .5; }
  .device-desktop .main.about .awards .list li.more p:active {
    transform: scale(0.95);
    transition: .15s; }

.device-desktop .main.about .values .panel .h2 {
  cursor: pointer;
  transition: .35s; }
  .device-desktop .main.about .values .panel .h2:hover {
    opacity: 1; }

.device-desktop .main.about .connect a {
  display: inline-block;
  transition: .5s; }
  .device-desktop .main.about .connect a:hover {
    opacity: .5; }
  .device-desktop .main.about .connect a:active {
    transform: scale(0.95);
    transition: .15s; }

.main.contact {
  padding-top: 73px; }
  .main.contact footer {
    margin-top: 76px; }
  @media screen and (min-width: 1024px) {
    .main.contact {
      padding-top: 8.40278vw; }
      .main.contact footer {
        margin-top: 9.30556vw; } }
  .main.contact .border {
    margin: auto;
    width: 90.66667vw;
    max-width: 945px;
    border: 1px solid #1A1A1A;
    border-radius: 9999px;
    padding-bottom: 37.33333vw; }
    @media screen and (min-width: 640px) {
      .main.contact .border {
        padding-top: 0;
        padding-bottom: 0; }
        .main.contact .border:before, .main.contact .border:after {
          content: '';
          display: block;
          padding-top: 50%; }
        .main.contact .border:before {
          margin-bottom: -15%; }
        .main.contact .border:after {
          margin-top: -15%; } }
    @media screen and (min-width: 768px) {
      .main.contact .border:before {
        margin-bottom: -25%; }
      .main.contact .border:after {
        margin-top: -25%; } }
    @media screen and (min-width: 1024px) {
      .main.contact .border:before {
        margin-bottom: -35%; } }
    @media screen and (min-width: 1200px) {
      .main.contact .border:before {
        margin-bottom: -37.5%; } }
    @media screen and (min-width: 1440px) {
      .main.contact .border {
        max-width: 65.625vw; } }
  .main.contact .intro {
    padding-top: 139px; }
    .main.contact .intro .windows {
      display: flex;
      justify-content: center; }
    .main.contact .intro .window:first-child {
      margin-top: 5.33333vw;
      margin-right: -6.66667vw; }
      .main.contact .intro .window:first-child .image video,
      .main.contact .intro .window:first-child .image img {
        box-shadow: none; }
    .main.contact .intro .window:last-child {
      margin-top: 2.66667vw;
      margin-left: -4.26667vw; }
    .main.contact .intro .image {
      position: relative;
      width: 26.4vw;
      height: 55.46667vw; }
      .main.contact .intro .image img,
      .main.contact .intro .image video {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        box-shadow: 0 2px 13px rgba(0, 0, 0, 0.5); }
    .main.contact .intro .text {
      margin-top: 43px;
      text-align: center; }
    .main.contact .intro .h1 {
      margin: auto;
      width: 50%;
      min-width: 262px;
      text-transform: uppercase; }
    .main.contact .intro .p {
      margin: 28px auto 0;
      width: 75%;
      max-width: 320px; }
      .main.contact .intro .p a {
        display: inline-block;
        letter-spacing: inherit;
        margin-top: 8px; }
      .main.contact .intro .p p + p {
        margin-top: 55px; }
    @media screen and (min-width: 640px) {
      .main.contact .intro {
        position: relative;
        min-height: 0;
        padding: 0; }
        .main.contact .intro .window:first-child {
          margin-top: 31px;
          margin-right: -42px; }
        .main.contact .intro .window:last-child {
          margin-top: 15px;
          margin-left: -27px; }
        .main.contact .intro .image {
          width: 161px;
          height: 338px; }
        .main.contact .intro .text {
          margin-top: 61px; }
        .main.contact .intro .h1 {
          margin: 0 auto;
          width: 40%; } }
    @media screen and (min-width: 1024px) {
      .main.contact .intro {
        min-height: 0; }
        .main.contact .intro .h1 {
          width: 100%;
          max-width: 27.77778vw; }
        .main.contact .intro .p {
          margin-top: 1.875vw;
          max-width: 346px; } }
    @media screen and (min-width: 1440px) {
      .main.contact .intro .window:first-child {
        margin-top: 2.15278vw;
        margin-right: -2.91667vw; }
      .main.contact .intro .window:last-child {
        margin-top: 1.04167vw;
        margin-left: -1.875vw; }
      .main.contact .intro .image {
        width: 11.18056vw;
        height: 23.47222vw; }
        .main.contact .intro .image img {
          box-shadow: 0 0.13889vw 0.90278vw rgba(0, 0, 0, 0.5); }
      .main.contact .intro .text {
        margin-top: 4.23611vw; }
      .main.contact .intro .p {
        max-width: 24.02778vw; } }
  .main.contact .instagram {
    margin-top: 60px;
    padding-left: 7.46667vw;
    padding-right: 7.46667vw; }
    .main.contact .instagram .text {
      max-width: 447px;
      margin: auto;
      text-align: center; }
    .main.contact .instagram .h1 {
      text-transform: uppercase; }
    .main.contact .instagram .icon {
      margin-top: 28px;
      text-align: center; }
    .main.contact .instagram svg {
      width: 31px;
      height: auto; }
    @media screen and (min-width: 1440px) {
      .main.contact .instagram {
        margin-top: 4.16667vw; }
        .main.contact .instagram .text {
          max-width: 31.04167vw; }
        .main.contact .instagram .icon {
          margin-top: 1.94444vw; }
        .main.contact .instagram svg {
          width: 2.15278vw; } }
  .main.contact .newsletter {
    margin-top: 60px;
    padding-left: 7.46667vw;
    padding-right: 7.46667vw; }
    .main.contact .newsletter .text,
    .main.contact .newsletter .form {
      max-width: 447px;
      margin: auto; }
    .main.contact .newsletter .text {
      text-align: center; }
    .main.contact .newsletter .h1 {
      text-transform: uppercase; }
    .main.contact .newsletter .form {
      margin-top: 7px;
      text-align: center; }
    .main.contact .newsletter form .field {
      transition: .5s; }
    .main.contact .newsletter form.is-submitting .field {
      pointer-events: none;
      opacity: .5; }
    .main.contact .newsletter form.has-error .error {
      height: auto; }
    .main.contact .newsletter form.has-submitted .success {
      height: auto; }
    .main.contact .newsletter .textbox {
      appearance: none;
      border: 0;
      border-bottom: 1px solid #979797;
      padding: 13px 0;
      width: 100%;
      background-color: transparent;
      text-align: center;
      border-radius: 0; }
    .main.contact .newsletter .error {
      margin-top: 4px;
      color: #7F4C4C;
      height: 0;
      overflow: hidden; }
    .main.contact .newsletter .submit {
      margin-top: 27px; }
    .main.contact .newsletter button {
      font-family: brandon-grotesque, sans-serif;
      font-weight: 500;
      font-style: normal;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      font-size: 17px;
      line-height: 1.17647;
      letter-spacing: 0.11353em;
      text-transform: uppercase;
      color: #929292;
      appearance: none;
      margin: 0;
      padding: 0;
      border: 0;
      background-color: transparent; }
      @media screen and (min-width: 1440px) {
        .main.contact .newsletter button {
          font-size: 1.18056vw; } }
    .main.contact .newsletter .success {
      height: 0;
      overflow: hidden; }
      .main.contact .newsletter .success p {
        padding-top: 27px; }
    @media screen and (min-width: 768px) {
      .main.contact .newsletter .form {
        margin-top: 28px; } }
    @media screen and (min-width: 1440px) {
      .main.contact .newsletter {
        margin-top: 4.16667vw; }
        .main.contact .newsletter .text,
        .main.contact .newsletter .form {
          max-width: 31.04167vw; }
        .main.contact .newsletter .textbox {
          padding: 0.90278vw 0; }
        .main.contact .newsletter .error {
          margin-top: 0.27778vw; }
        .main.contact .newsletter .submit {
          margin-top: 1.875vw; }
        .main.contact .newsletter .form {
          margin-top: 1.94444vw; }
        .main.contact .newsletter .success p {
          padding-top: 1.875vw; } }

.device-desktop .main.contact .intro a,
.device-desktop .main.contact .instagram a {
  display: inline-block;
  transition: .5s; }
  .device-desktop .main.contact .intro a:hover,
  .device-desktop .main.contact .instagram a:hover {
    opacity: .5; }
  .device-desktop .main.contact .intro a:active,
  .device-desktop .main.contact .instagram a:active {
    transform: scale(0.95);
    transition: .15s; }

.device-desktop .main.contact .newsletter button {
  cursor: pointer;
  transition: .5s; }
  .device-desktop .main.contact .newsletter button:hover {
    opacity: .5; }
  .device-desktop .main.contact .newsletter button:active {
    transform: scale(0.95);
    transition: .15s; }

.main.collection {
  padding-top: 124px; }
  .main.collection footer {
    margin-top: 151px; }
  .main.collection .center {
    padding-left: 8vw;
    padding-right: 8vw; }
  @media screen and (min-width: 768px) {
    .main.collection {
      padding-top: 9.79167vw; }
      .main.collection footer {
        margin-top: 12.56944vw; }
      .main.collection .center {
        padding-left: 7.98611vw;
        padding-right: 7.98611vw; } }
  .main.collection .intro .left .image {
    margin-top: 39px;
    position: relative; }
    .main.collection .intro .left .image:before {
      content: '';
      display: block;
      width: 100%;
      height: 0;
      padding-top: 114.35185%; }
    .main.collection .intro .left .image picture {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }
    .main.collection .intro .left .image img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover; }
  .main.collection .intro .h1 {
    text-align: center;
    text-transform: uppercase; }
  .main.collection .intro .image img {
    width: 100%; }
  .main.collection .intro .p {
    margin-top: 54px; }
    .main.collection .intro .p p + p {
      margin-top: 1.47059em; }
  .main.collection .intro .right .image {
    margin-top: 51px;
    position: relative; }
    .main.collection .intro .right .image:before {
      content: '';
      display: block;
      width: 100%;
      height: 0;
      padding-top: 120.71535%; }
    .main.collection .intro .right .image picture {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }
    .main.collection .intro .right .image img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover; }
  @media screen and (min-width: 768px) {
    .main.collection .intro .center {
      display: flex; }
    .main.collection .intro .left {
      width: 30vw; }
      .main.collection .intro .left .group {
        position: relative; }
        .main.collection .intro .left .group:before {
          content: '';
          display: block;
          width: 100%;
          height: 0;
          padding-top: 187.5%; }
      .main.collection .intro .left .inner {
        display: flex;
        flex-direction: column;
        justify-content: center;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%; }
      .main.collection .intro .left .h1 {
        order: 2;
        margin-top: 3.19444vw; }
      .main.collection .intro .left .image {
        order: 1;
        margin-top: 0; }
    .main.collection .intro .p {
      margin-top: 3.95833vw; }
    .main.collection .intro .right {
      display: flex;
      flex-direction: column;
      flex: 1;
      padding-left: 7.43056vw; }
      .main.collection .intro .right .image {
        margin-top: 0; }
      .main.collection .intro .right .p {
        display: flex;
        flex-direction: column;
        justify-content: center;
        flex: 1; } }
  @media screen and (min-width: 768px) and (max-width: 1023px) {
    .main.collection .intro .left .h1 {
      font-size: 28px; } }
  .main.collection .gallery {
    margin-top: 95px;
    border-top: 1px solid #454341;
    padding-top: 94px; }
    .main.collection .gallery .h1 {
      text-align: center;
      text-transform: uppercase; }
    .main.collection .gallery ul {
      display: grid;
      grid-template-columns: 1fr 1fr;
      column-gap: 3.2vw;
      row-gap: 2.93333vw;
      margin-top: 33px; }
    .main.collection .gallery li a {
      display: block;
      position: relative; }
      .main.collection .gallery li a:before {
        content: '';
        display: block;
        width: 100%;
        height: 0;
        padding-top: 100.76336%; }
      .main.collection .gallery li a picture {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%; }
      .main.collection .gallery li a img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover; }
    @media screen and (min-width: 768px) {
      .main.collection .gallery {
        margin-top: 8.81944vw;
        padding-top: 8.75vw; }
        .main.collection .gallery .h1 {
          text-align: left; }
        .main.collection .gallery ul {
          grid-template-columns: 1fr 1fr 1fr;
          column-gap: 2.29167vw;
          row-gap: 2.36111vw;
          margin-top: 2.36111vw; } }
  .main.collection .overlay {
    position: fixed;
    z-index: 10;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    overflow: hidden;
    transition: 1s; }
    .main.collection .overlay.is-open {
      height: 100%; }
    .main.collection .overlay.light .ui {
      color: #454341; }
    .main.collection .overlay .ui {
      position: absolute;
      z-index: 2;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      color: #fff;
      pointer-events: none; }
      .main.collection .overlay .ui .pagination .previous,
      .main.collection .overlay .ui .pagination .cursor {
        display: none; }
      .main.collection .overlay .ui .pagination .next {
        position: absolute;
        bottom: 23px;
        right: 24px;
        pointer-events: all; }
        .main.collection .overlay .ui .pagination .next i {
          display: flex;
          justify-content: center;
          align-items: center;
          width: 74px;
          height: 74px;
          border: 1px solid currentColor;
          border-radius: 50%;
          text-align: center;
          color: currentColor;
          transition: .5s; }
        .main.collection .overlay .ui .pagination .next svg {
          display: block;
          width: 39.3162%;
          transition: .5s; }
          .main.collection .overlay .ui .pagination .next svg path {
            fill: currentColor; }
      .main.collection .overlay .ui .exit {
        position: absolute;
        z-index: 5;
        transform: rotate(45deg);
        top: 30px;
        left: 50%;
        margin-left: -21px;
        width: 42px;
        height: 42px;
        cursor: pointer;
        pointer-events: all;
        transition: .5s; }
        .main.collection .overlay .ui .exit a {
          display: block;
          width: 100%;
          height: 100%;
          pointer-events: all; }
        .main.collection .overlay .ui .exit:before, .main.collection .overlay .ui .exit:after {
          content: '';
          display: block;
          position: absolute;
          top: 50%;
          left: 50%;
          width: 100%;
          height: 1px;
          background-color: currentColor;
          pointer-events: none; }
        .main.collection .overlay .ui .exit:before {
          transform: translate3d(-50%, -50%, 0); }
        .main.collection .overlay .ui .exit:after {
          transform: translate3d(-50%, -50%, 0) rotate(90deg); }
      @media screen and (min-width: 768px) {
        .main.collection .overlay .ui .pagination .cursor i {
          width: 129px;
          height: 129px; } }
      @media screen and (min-width: 1024px) {
        .main.collection .overlay .ui .pagination {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          cursor: none; }
          .main.collection .overlay .ui .pagination .previous,
          .main.collection .overlay .ui .pagination .next {
            display: block;
            position: absolute;
            top: 0;
            width: 50%;
            height: 100%;
            pointer-events: all; }
            .main.collection .overlay .ui .pagination .previous i,
            .main.collection .overlay .ui .pagination .next i {
              display: none; }
          .main.collection .overlay .ui .pagination .previous {
            left: 0; }
          .main.collection .overlay .ui .pagination .next {
            right: 0; }
          .main.collection .overlay .ui .pagination .cursor {
            display: block;
            position: absolute;
            z-index: 2;
            opacity: 0; }
            .main.collection .overlay .ui .pagination .cursor.is-visible {
              opacity: 1; }
            .main.collection .overlay .ui .pagination .cursor i {
              position: absolute;
              top: 50%;
              left: 50%;
              transform: translate3d(-50%, -50%, 0);
              display: flex;
              justify-content: center;
              align-items: center;
              border: 1px solid currentColor;
              border-radius: 50%;
              text-align: center;
              color: currentColor;
              transition: .5s; }
            .main.collection .overlay .ui .pagination .cursor svg {
              display: block;
              width: 39.3162%;
              transition: .5s; }
              .main.collection .overlay .ui .pagination .cursor svg path {
                fill: currentColor; }
            .main.collection .overlay .ui .pagination .cursor.is-previous svg {
              transform: rotate(180deg); }
            .main.collection .overlay .ui .pagination .cursor.is-next svg {
              transform: rotate(0deg); } }
    .main.collection .overlay .splide .splide__slide {
      display: flex; }
    .main.collection .overlay .splide .image {
      flex: 1; }
      .main.collection .overlay .splide .image img {
        width: 100%;
        height: 100%;
        object-fit: cover; }

.device-mobile .main.project .splide.desktop {
  display: none; }

.device-desktop .main.collection .gallery li a img {
  transition: .5s; }

.device-desktop .main.collection .gallery li a:hover img {
  opacity: .75; }

.device-desktop .main.collection .gallery li a:active img {
  transform: scale(0.95);
  transition: .15s; }

.device-desktop .main.collection .overlay .ui .pagination .cursor i {
  transition: .5s; }

.device-desktop .main.collection .overlay .ui .pagination:active .cursor i {
  opacity: .75;
  transform: scale(0.95) translate3d(-50%, -50%, 0);
  transition: .15s; }

@media screen and (max-width: 1023px) {
  .device-desktop .main.collection .overlay .ui .pagination .next {
    cursor: pointer;
    transition: .5s; }
    .device-desktop .main.collection .overlay .ui .pagination .next:hover {
      opacity: .75; }
    .device-desktop .main.collection .overlay .ui .pagination .next:active {
      transform: scale(0.95);
      transition: .15s; } }

.device-desktop .main.collection .overlay .ui .exit {
  transition: .5s; }
  .device-desktop .main.collection .overlay .ui .exit:before, .device-desktop .main.collection .overlay .ui .exit:after {
    transition: .5s; }
  .device-desktop .main.collection .overlay .ui .exit:hover:before, .device-desktop .main.collection .overlay .ui .exit:hover:after {
    opacity: .75; }
  .device-desktop .main.collection .overlay .ui .exit:active {
    transform: rotate(45deg) scale(0.95);
    transition: .15s; }

.device-desktop .main.collection .splide.mobile {
  display: none; }

.main.collections {
  padding-top: 133px; }
  .main.collections footer {
    margin-top: 194px; }
  @media screen and (min-width: 768px) {
    .main.collections {
      padding-top: 4.51389vw; }
      .main.collections footer {
        margin-top: 12.15278vw; } }
  .main.collections .intro {
    text-align: center; }
    .main.collections .intro h1 {
      text-transform: uppercase; }
    .main.collections .intro h2 {
      display: inline-flex;
      flex-direction: column;
      margin-top: 57px; }
      .main.collections .intro h2 span:nth-child(1) {
        margin-left: -39px;
        text-transform: uppercase;
        text-align: left; }
      .main.collections .intro h2 span:nth-child(2) {
        margin-right: -39px;
        text-transform: uppercase; }
      .main.collections .intro h2 span:nth-child(3) {
        margin-right: 2px;
        font-family: 'Cormorant', serif;
        font-weight: 200;
        font-style: italic;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-size: 27px;
        line-height: 1.22222;
        letter-spacing: -0.00222em;
        text-align: right; }
        @media screen and (min-width: 1440px) {
          .main.collections .intro h2 span:nth-child(3) {
            font-size: 2.56944vw; } }
    @media screen and (min-width: 768px) {
      .main.collections .intro h2 {
        margin-top: 5.76389vw; }
        .main.collections .intro h2 span:nth-child(1) {
          margin-left: -2.01389vw; }
        .main.collections .intro h2 span:nth-child(2) {
          margin-right: -2.01389vw; }
        .main.collections .intro h2 span:nth-child(3) {
          margin-right: 2.29167vw; } }
  .main.collections .list {
    margin-top: 57px;
    padding-left: 5.33333vw;
    padding-right: 5.33333vw; }
    .main.collections .list li {
      width: 335px;
      margin: auto; }
      .main.collections .list li + li {
        margin-top: 93px; }
    .main.collections .list a {
      display: block;
      pointer-events: none; }
    .main.collections .list .preview {
      width: 267px;
      position: relative;
      pointer-events: all; }
      .main.collections .list .preview:before {
        content: '';
        display: block;
        width: 100%;
        height: 0;
        padding-top: 114.23221%; }
      .main.collections .list .preview picture {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%; }
      .main.collections .list .preview img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover; }
    .main.collections .list .view {
      position: relative;
      margin-top: 43px;
      padding-top: 36px;
      text-align: center;
      text-transform: uppercase; }
      .main.collections .list .view .image {
        position: relative;
        position: absolute;
        bottom: 100%;
        right: 0;
        width: 151px;
        pointer-events: all; }
        .main.collections .list .view .image:before {
          content: '';
          display: block;
          width: 100%;
          height: 0;
          padding-top: 113.24503%; }
        .main.collections .list .view .image picture {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%; }
        .main.collections .list .view .image img {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          object-fit: cover; }
    .main.collections .list h2,
    .main.collections .list .button span {
      pointer-events: all; }
    .main.collections .list .button {
      margin-top: 20px;
      color: #929292; }
    @media screen and (min-width: 768px) {
      .main.collections .list {
        margin-top: 6.45833vw;
        padding-left: 12.43056vw;
        padding-right: 12.43056vw; }
        .main.collections .list li {
          width: 100%; }
          .main.collections .list li:nth-child(even) .preview {
            order: 2; }
          .main.collections .list li:nth-child(even) .view {
            order: 1;
            padding-left: 5.06944vw;
            padding-right: 10.83333vw; }
          .main.collections .list li:nth-child(odd) .view {
            padding-left: 15.41667vw;
            padding-right: 0.48611vw; }
          .main.collections .list li + li {
            margin-top: 8.68056vw; }
        .main.collections .list a {
          display: flex; }
        .main.collections .list .preview {
          width: 35.83333vw; }
        .main.collections .list .view {
          flex: 1;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          margin-top: 0;
          padding-top: 0; }
          .main.collections .list .view .image {
            position: relative;
            bottom: auto;
            right: auto;
            margin: 2.98611vw auto 0;
            width: 16.73611vw; }
        .main.collections .list .button {
          display: inline-block;
          margin-top: 3.33333vw;
          width: 50%;
          line-height: 1.17647; } }

.device-desktop .main.collections .list li a .button span {
  display: block;
  transition: .5s; }

.device-desktop .main.collections .list li a:hover .button span {
  opacity: .5; }

.device-desktop .main.collections .list li a:active .button span {
  transform: scale(0.95);
  transition: .15s; }

body.page-template-page-home header .menu {
  color: #fff; }

body.page-template-page-home header .logo .light {
  opacity: 1; }

body.page-template-page-home header .logo .dark {
  opacity: 0; }

.main.home {
  width: 100%;
  height: 100%; }
  .main.home .background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
    .main.home .background ul li {
      opacity: 0;
      transition: opacity 2s;
      z-index: 2; }
      .main.home .background ul li.is-active {
        opacity: 1;
        z-index: 1; }
    .main.home .background .mobile {
      display: none; }
    .main.home .background img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover; }
    @media (max-aspect-ratio: 1 / 1) {
      .main.home .background .mobile {
        display: block; }
      .main.home .background .desktop {
        display: none; } }
  .main.home .navigation {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.15) 25%, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0.15) 75%, rgba(0, 0, 0, 0) 100%); }
    .main.home .navigation ul {
      display: flex;
      width: 100%;
      height: 100%; }
      .main.home .navigation ul li {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 1; }
        .main.home .navigation ul li.is-active a .circle {
          opacity: 1; }
        .main.home .navigation ul li a {
          display: block;
          position: relative;
          color: #fff; }
          .main.home .navigation ul li a .title {
            display: block; }
          .main.home .navigation ul li a .circle {
            position: absolute;
            top: 50%;
            left: 50%;
            margin-top: -122px;
            margin-left: -122px;
            width: 244px;
            height: 244px;
            border: 1px solid currentColor;
            border-radius: 50%;
            opacity: 0;
            transition: opacity .5s; }
      @media (max-width: 767px) {
        .main.home .navigation ul {
          flex-direction: column;
          justify-content: center; }
          .main.home .navigation ul li {
            flex: .2; }
            .main.home .navigation ul li a .circle {
              margin-top: -90px;
              margin-left: -90px;
              width: 180px;
              height: 180px; } }
      @media screen and (min-width: 1440px) {
        .main.home .navigation ul li a .circle {
          margin-top: -8.47222vw;
          margin-left: -8.47222vw;
          width: 16.94444vw;
          height: 16.94444vw; } }
    .main.home .navigation .h1 {
      text-transform: uppercase; }
      @media screen and (min-width: 768px) {
        .main.home .navigation .h1 {
          font-size: 47px;
          line-height: 1.14894;
          letter-spacing: 0.05468em; } }
      @media screen and (min-width: 1440px) {
        .main.home .navigation .h1 {
          font-size: 3.26389vw; } }

.device-mobile .main.home .background {
  position: fixed;
  top: 0; }

.device-mobile .main.home .navigation .scroll {
  height: 100%; }

.device-mobile .main.home .navigation ul {
  position: fixed;
  top: 0; }

.device-desktop .main.home .navigation .scroll {
  height: 100%; }

.device-desktop .main.home .navigation ul li a {
  display: inline-block;
  transition: .5s; }
  .device-desktop .main.home .navigation ul li a:active {
    transform: scale(0.95);
    opacity: .75;
    transition: .15s; }

.main.portfolio .categoryBar {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  padding: 24px 5.06667vw;
  background-color: #ECECEC; }
  .main.portfolio .categoryBar:hover ul {
    transform: translateY(0); }
  .main.portfolio .categoryBar ul {
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translateY(-100%);
    background-color: #ECECEC;
    transition: .5s; }
    .main.portfolio .categoryBar ul.is-visible {
      transform: translateY(0); }
  .main.portfolio .categoryBar li + li {
    margin-left: 28px; }
  .main.portfolio .categoryBar a {
    line-height: 1.0; }
    .main.portfolio .categoryBar a.is-active {
      font-family: brandon-grotesque, sans-serif;
      font-weight: 600;
      font-style: normal;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      letter-spacing: 0.11353em; }
  @media screen and (min-width: 768px) {
    .main.portfolio .categoryBar {
      padding: 3.18182vh 2.36111vw; } }
  @media screen and (max-width: 1023px) {
    .main.portfolio .categoryBar:before {
      content: '\00A0';
      font-size: 17px;
      line-height: 1.0; }
    .main.portfolio .categoryBar:after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: #E3E3E3; }
    .main.portfolio .categoryBar ul {
      position: absolute;
      top: 100%;
      left: 0;
      width: 100%;
      padding: 6px 0; } }
  @media screen and (min-width: 1024px) {
    .main.portfolio .categoryBar {
      padding: 0;
      background-color: transparent; }
      .main.portfolio .categoryBar ul {
        padding: 3.18182vh 2.36111vw; }
      .main.portfolio .categoryBar li + li {
        margin-left: 4.72222vw; } }

.main.portfolio .scrollbar {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 10px;
  height: calc(100% - 65px);
  background-color: #252525;
  transition: .5s;
  --bar-height: 0px; }
  .main.portfolio .scrollbar.is-short {
    height: calc(100% - 94px); }
  .main.portfolio .scrollbar .bar {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: var(--bar-height);
    cursor: pointer;
    transition: background-color .5s; }
    .main.portfolio .scrollbar .bar:hover {
      background-color: #929292; }
    .main.portfolio .scrollbar .bar.main {
      z-index: 2;
      background-color: #fff;
      cursor: auto; }
      .main.portfolio .scrollbar .bar.main:hover {
        background-color: #fff; }
  @media screen and (min-width: 768px) {
    .main.portfolio .scrollbar {
      height: calc(100% - 6.36364vh - 17px);
      width: 20px; }
      .main.portfolio .scrollbar.is-short {
        height: calc(100% - 6.36364vh - 46px); } }
  @media screen and (min-width: 1024px) {
    .main.portfolio .scrollbar {
      height: 100%; }
      .main.portfolio .scrollbar.is-short {
        height: calc(100% - 6.36364vh - 17px); } }
  @media screen and (min-width: 1440px) {
    .main.portfolio .scrollbar.is-short {
      height: calc(100% - 6.36364vh - 1.18056vw); } }

.main.portfolio .splide__slide {
  width: 100vw;
  height: 100vh; }
  .main.portfolio .splide__slide .image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .88; }
    .main.portfolio .splide__slide .image:after {
      content: '';
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.15) 25%, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0.15) 75%, rgba(0, 0, 0, 0) 100%);
      transition: .5s; }
    .main.portfolio .splide__slide .image img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover; }
    .main.portfolio .splide__slide .image .mobile {
      display: none; }
    @media screen and (max-aspect-ratio: 1 / 1) and (max-width: 767px) {
      .main.portfolio .splide__slide .image .mobile {
        display: block; }
      .main.portfolio .splide__slide .image .desktop {
        display: none; } }
    @media screen and (min-width: 768px) {
      .main.portfolio .splide__slide .image:after {
        background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0.5) 100%); } }
  .main.portfolio .splide__slide .text {
    display: flex;
    justify-content: center;
    position: absolute;
    z-index: 3;
    bottom: 37px;
    left: 0;
    width: 100%;
    color: #fff;
    /* .title,
      .circle {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 179px;
        height: 179px;
        padding-left: 20px;
        padding-right: 20px;
        border: 1px solid currentColor;
        border-radius: 50%;
        color: currentColor;
        transition: .5s;
      } */ }
    .main.portfolio .splide__slide .text .inner {
      display: flex;
      justify-content: center;
      position: relative; }
    .main.portfolio .splide__slide .text .title,
    .main.portfolio .splide__slide .text .circle {
      width: 179px;
      height: 179px;
      color: currentColor; }
    .main.portfolio .splide__slide .text .circle {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate3d(-50%, -50%, 0);
      border: 1px solid currentColor;
      border-radius: 50%; }
    .main.portfolio .splide__slide .text .title {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding-left: 20px;
      padding-right: 20px; }
    .main.portfolio .splide__slide .text strong {
      text-align: center;
      text-transform: uppercase; }
      .main.portfolio .splide__slide .text strong + .p {
        margin-top: 4px; }
  @media screen and (max-width: 767px) {
    .main.portfolio .splide__slide .text {
      width: 100%;
      height: 100%;
      bottom: 0;
      align-items: center;
      padding-top: 94px; } }
  @media screen and (min-width: 768px) {
    .main.portfolio .splide__slide .text {
      bottom: 3.54167vw; }
      .main.portfolio .splide__slide .text .title,
      .main.portfolio .splide__slide .text .circle {
        min-width: 179px;
        min-height: 179px;
        width: 13.88889vw;
        height: 13.88889vw; }
      .main.portfolio .splide__slide .text .title {
        padding-left: 1.38889vw;
        padding-right: 1.38889vw; }
      .main.portfolio .splide__slide .text strong + .p {
        margin-top: 0.27778vw; } }

.main.portfolio .top .text {
  text-align: center;
  text-transform: uppercase; }

.main.portfolio .top .to-top {
  display: block;
  padding-top: 34px;
  padding-bottom: 69px; }

@media screen and (min-width: 768px) {
  .main.portfolio .top .to-top {
    padding-top: 2.36111vw;
    padding-bottom: 4.79167vw; } }

.device-desktop .main.portfolio .categoryBar li a {
  display: inline-block;
  transition: .5s; }
  .device-desktop .main.portfolio .categoryBar li a:hover {
    opacity: .5; }
  .device-desktop .main.portfolio .categoryBar li a:active {
    transform: scale(0.95);
    transition: .15s; }

.device-desktop .main.portfolio .splide__slide a .text {
  pointer-events: none; }
  .device-desktop .main.portfolio .splide__slide a .text .inner {
    pointer-events: none;
    transition: .5s; }
  .device-desktop .main.portfolio .splide__slide a .text + .image:after {
    opacity: .5; }
  .device-desktop .main.portfolio .splide__slide a .text.can-hover .inner {
    pointer-events: all; }
  .device-desktop .main.portfolio .splide__slide a .text:hover + .image:after {
    opacity: 1; }
  .device-desktop .main.portfolio .splide__slide a .text:active .inner {
    opacity: .5;
    transform: scale(0.95);
    transition: .15s; }

.device-desktop .main.portfolio .top a {
  transition: .5s; }
  .device-desktop .main.portfolio .top a:hover {
    opacity: .5; }
  .device-desktop .main.portfolio .top a:active {
    transform: scale(0.95);
    transition: .15s; }

.main.press {
  padding-top: 73px; }
  .main.press footer {
    margin-top: 76px; }
  @media screen and (min-width: 1024px) {
    .main.press {
      padding-top: 8.40278vw; }
      .main.press footer {
        margin-top: 9.30556vw; } }
  .main.press .border {
    margin: auto;
    width: 90.66667vw;
    max-width: 945px;
    border: 1px solid #1A1A1A;
    border-radius: 9999px;
    padding-bottom: 55.46667vw; }
    @media screen and (min-width: 640px) {
      .main.press .border {
        padding-bottom: 0; }
        .main.press .border:after {
          content: '';
          display: block;
          padding-top: 50%; } }
    @media screen and (min-width: 1440px) {
      .main.press .border {
        max-width: 65.625vw; } }
  .main.press .intro {
    padding-top: 108px;
    padding-bottom: 113px;
    min-height: 322px; }
    .main.press .intro .text {
      text-align: center; }
    .main.press .intro .h1 {
      margin: auto;
      width: 50%;
      min-width: 262px;
      text-transform: uppercase; }
    .main.press .intro .p {
      margin: 20px auto 0;
      width: 75%;
      min-width: 320px; }
      .main.press .intro .p a {
        letter-spacing: inherit; }
    @media screen and (min-width: 640px) {
      .main.press .intro {
        position: relative;
        min-height: 0;
        padding: 0; }
        .main.press .intro:before {
          content: '';
          display: block;
          padding-top: 50%; }
        .main.press .intro .text {
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          position: absolute; }
        .main.press .intro .h1 {
          margin: 0;
          width: 40%; } }
    @media screen and (min-width: 1024px) {
      .main.press .intro {
        min-height: 0; }
        .main.press .intro .h1 {
          width: 100%;
          max-width: 27.77778vw; }
        .main.press .intro .p {
          margin-top: 1.38889vw;
          max-width: 44.44444vw; } }
  .main.press .list ul {
    border-top: 1px solid #1A1A1A; }
  .main.press .list li {
    border-bottom: 1px solid #1A1A1A; }
    .main.press .list li a {
      display: block;
      position: relative;
      padding: 18px 22px; }
    .main.press .list li .h2 {
      text-transform: uppercase; }
    .main.press .list li .p {
      margin-top: 4px; }
    .main.press .list li .image {
      position: absolute;
      right: 0;
      top: 50%;
      transform: translate3d(0, -35%, 0);
      pointer-events: none; }
      .main.press .list li .image .reveal {
        width: 14.16667vw;
        overflow: hidden; }
      .main.press .list li .image img {
        width: 14.16667vw;
        height: auto;
        max-width: none; }
      @media screen and (max-width: 767px) {
        .main.press .list li .image {
          display: none; } }
    @media screen and (min-width: 768px) {
      .main.press .list li a {
        display: flex;
        align-items: center; }
        .main.press .list li a .image .reveal {
          opacity: 0;
          transition: opacity .25s; }
        .main.press .list li a:hover .image .reveal {
          opacity: 1; }
      .main.press .list li .h2 {
        width: 40%;
        padding-right: 22px; }
      .main.press .list li .p {
        margin-top: 0;
        width: 25%; }
      .main.press .list li .image {
        width: 35%; } }
    @media screen and (min-width: 1024px) {
      .main.press .list li a {
        padding: 2.08333vw 4.16667vw; }
      .main.press .list li .h2 {
        width: 47.5%;
        padding-right: 4.16667vw; }
      .main.press .list li .p {
        width: 22.5%;
        padding-right: 4.16667vw; }
      .main.press .list li .image {
        width: 30%; } }

.device-desktop .main.press .intro a {
  display: inline-block;
  transition: .5s; }
  .device-desktop .main.press .intro a:hover {
    opacity: .5; }
  .device-desktop .main.press .intro a:active {
    transform: scale(0.95);
    transition: .15s; }

.device-desktop .main.press .list a .h2 {
  transform-origin: left;
  transition: .5s; }

.device-desktop .main.press .list a:hover .h2 {
  opacity: .5; }

.device-desktop .main.press .list a:active .h2 {
  transform: scale(0.95);
  transition: .15s; }

body.single-project header,
body.single-project .navigation {
  display: none; }

.main.project .toggleDetails {
  position: absolute;
  bottom: 23px;
  z-index: 3;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 74px;
  height: 74px;
  border: 1px solid currentColor;
  border-radius: 50%;
  text-align: center;
  color: currentColor;
  transition: .5s; }
  .main.project .toggleDetails span {
    font-size: 13px;
    font-style: italic;
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 0.11353em;
    line-height: 1.23529; }
  .main.project .toggleDetails.open {
    left: 24px;
    pointer-events: all; }
  .main.project .toggleDetails.close {
    left: 50%;
    margin-left: -37px;
    pointer-events: none;
    opacity: 0; }
  .main.project .toggleDetails.hidden {
    opacity: 0;
    pointer-events: none; }
  @media screen and (min-width: 768px) {
    .main.project .toggleDetails {
      width: 129px;
      height: 129px; }
      .main.project .toggleDetails.open, .main.project .toggleDetails.close {
        left: 1.45833vw;
        bottom: 1.52778vw;
        margin: 0; }
      .main.project .toggleDetails span {
        font-size: 17px; } }

.main.project .details {
  position: fixed;
  z-index: 3;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: #fff;
  pointer-events: none; }
  .main.project .details .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(43, 43, 43, 0.93);
    padding-bottom: 121px;
    pointer-events: none;
    opacity: 0;
    transition: .5s; }
    .main.project .details .overlay .text {
      height: 100%;
      padding: 85px 9.6vw 0;
      overflow: scroll;
      -ms-overflow-style: none;
      scrollbar-width: none; }
      .main.project .details .overlay .text::-webkit-scrollbar {
        display: none; }
      .main.project .details .overlay .text h1 {
        text-transform: uppercase; }
        .main.project .details .overlay .text h1 + .p {
          margin-top: 19px; }
      .main.project .details .overlay .text .p p + p {
        margin-top: 1em; }
  .main.project .details.is-open + .ui .open {
    opacity: 0;
    pointer-events: none; }
  .main.project .details.is-open .close {
    opacity: 1;
    pointer-events: all; }
  .main.project .details.is-open .overlay {
    opacity: 1;
    pointer-events: all; }
  .main.project .details.is-open ~ .exit {
    opacity: 0;
    pointer-events: none; }
  .main.project .details.is-open ~ .pagination {
    pointer-events: none; }
    .main.project .details.is-open ~ .pagination .previous,
    .main.project .details.is-open ~ .pagination .next {
      pointer-events: none; }
    .main.project .details.is-open ~ .pagination .cursor {
      pointer-events: none; }
      .main.project .details.is-open ~ .pagination .cursor i {
        opacity: 0; }
  @media screen and (min-width: 768px) {
    .main.project .details .overlay {
      display: flex;
      justify-content: center;
      align-items: center;
      padding-bottom: 0; }
      .main.project .details .overlay .text {
        margin: auto;
        width: 100%;
        min-width: 472px;
        height: auto;
        max-height: 100%;
        padding: 10vh 40px; }
        .main.project .details .overlay .text h1,
        .main.project .details .overlay .text .p {
          margin: auto;
          width: 100%;
          width: 30vw;
          min-width: 432px; }
        .main.project .details .overlay .text h1 {
          text-align: center; }
          .main.project .details .overlay .text h1 + .p {
            margin-top: 5.20833vw; } }

.main.project .ui {
  position: fixed;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: #fff;
  pointer-events: none;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0.15) 100%); }
  .main.project .ui .pagination .previous,
  .main.project .ui .pagination .cursor {
    display: none; }
  .main.project .ui .pagination .next {
    position: absolute;
    bottom: 23px;
    right: 24px;
    pointer-events: all; }
    .main.project .ui .pagination .next i {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 74px;
      height: 74px;
      border: 1px solid currentColor;
      border-radius: 50%;
      text-align: center;
      color: #fff;
      transition: .5s; }
    .main.project .ui .pagination .next svg {
      display: block;
      width: 39.3162%;
      transition: .5s; }
      .main.project .ui .pagination .next svg path {
        fill: currentColor; }
  .main.project .ui .exit {
    position: absolute;
    z-index: 5;
    transform: rotate(45deg);
    top: 30px;
    left: 50%;
    margin-left: -21px;
    width: 42px;
    height: 42px;
    pointer-events: all;
    transition: .5s; }
    @media screen and (min-width: 768px) {
      .main.project .ui .exit {
        top: 0;
        margin-left: -63px;
        width: 126px;
        height: 126px;
        border-radius: 50%; } }
    .main.project .ui .exit a {
      display: block;
      position: absolute;
      top: 50%;
      left: 50%;
      margin-top: -21px;
      margin-left: -21px;
      width: 42px;
      height: 42px;
      pointer-events: all; }
      .main.project .ui .exit a:before, .main.project .ui .exit a:after {
        content: '';
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100%;
        height: 1px;
        background-color: #fff;
        pointer-events: none; }
      .main.project .ui .exit a:before {
        transform: translate3d(-50%, -50%, 0); }
      .main.project .ui .exit a:after {
        transform: translate3d(-50%, -50%, 0) rotate(90deg); }
  @media screen and (min-width: 768px) {
    .main.project .ui .pagination .cursor i {
      width: 129px;
      height: 129px; }
    .main.project .ui .pagination .next i {
      width: 129px;
      height: 129px; } }

.main.project .splide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #2B2B2B; }
  .main.project .splide .splide__track,
  .main.project .splide .splide__list,
  .main.project .splide .splide__slide {
    height: 100%; }
  .main.project .splide .splide__slide {
    display: flex;
    /* cursor: grab;

      &:active {
        cursor: grabbing;
      } */ }
    .main.project .splide .splide__slide.next .text h3,
    .main.project .splide .splide__slide.next .text h2 {
      opacity: 0;
      transform: translateY(20px);
      transition: .5s; }
    .main.project .splide .splide__slide.next .image img {
      object-fit: cover; }
    .main.project .splide .splide__slide.next.in h3,
    .main.project .splide .splide__slide.next.in h2 {
      opacity: 1;
      transform: translateY(0);
      transition: 1s; }
    .main.project .splide .splide__slide.next.in h3 {
      transition-delay: .35s; }
    .main.project .splide .splide__slide.next.in h2 {
      transition-delay: .5s; }
    .main.project .splide .splide__slide.remove-text .text {
      transition: 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
      @media (max-width: 1023px) {
        .main.project .splide .splide__slide.remove-text .text {
          transform: translateY(100%); } }
      @media screen and (min-width: 1024px) {
        .main.project .splide .splide__slide.remove-text .text {
          transform: translateX(-100%); } }
    .main.project .splide .splide__slide:first-child .image img {
      object-fit: cover; }
  .main.project .splide .text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: absolute;
    padding-left: 7.98611vw;
    padding-right: 7.98611vw;
    background-color: #2B2B2B;
    color: #fff;
    text-transform: uppercase; }
    .main.project .splide .text h2 {
      margin-top: 38px; }
    @media (max-width: 1023px) {
      .main.project .splide .text {
        bottom: 0;
        left: 0;
        width: 100%;
        height: 50%; } }
    @media screen and (min-width: 1024px) {
      .main.project .splide .text {
        top: 0;
        left: 0;
        width: 50%;
        height: 100%; } }
  .main.project .splide .image {
    flex: 1; }
    .main.project .splide .image img {
      width: 100%;
      height: 100%;
      object-fit: contain; }
    .main.project .splide .image.cover img {
      object-fit: cover; }

.device-mobile .main.project .splide.desktop {
  display: none; }

.device-desktop .main.project .ui .pagination .cursor i {
  transition: .5s; }

.device-desktop .main.project .ui .pagination:active .cursor i {
  opacity: .75;
  transform: scale(0.95) translate3d(-50%, -50%, 0);
  transition: .15s; }

@media screen and (max-width: 1023px) {
  .device-desktop .main.project .ui .pagination .next {
    cursor: pointer;
    transition: .5s; }
    .device-desktop .main.project .ui .pagination .next:hover {
      opacity: .75; }
    .device-desktop .main.project .ui .pagination .next:active {
      transform: scale(0.95);
      transition: .15s; } }

.device-desktop .main.project .ui .exit a {
  transition: .5s; }
  .device-desktop .main.project .ui .exit a:before, .device-desktop .main.project .ui .exit a:after {
    transition: .5s; }
  .device-desktop .main.project .ui .exit a:hover:before, .device-desktop .main.project .ui .exit a:hover:after {
    opacity: .75; }
  .device-desktop .main.project .ui .exit a:active {
    transform: scale(0.95);
    transition: .15s; }

.device-desktop .main.project .ui .toggleDetails {
  transition: .5s; }
  .device-desktop .main.project .ui .toggleDetails:hover {
    opacity: .75; }
  .device-desktop .main.project .ui .toggleDetails:active {
    transform: scale(0.95);
    transition: .15s; }

.device-desktop .main.project .splide.mobile {
  display: none; }

@media screen and (min-width: 1024px) {
  .device-desktop .main.project .pagination {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: none; }
    .device-desktop .main.project .pagination .previous,
    .device-desktop .main.project .pagination .next {
      display: block;
      position: absolute;
      top: 0;
      width: 50%;
      height: 100%;
      pointer-events: all; }
      .device-desktop .main.project .pagination .previous i,
      .device-desktop .main.project .pagination .next i {
        display: none; }
    .device-desktop .main.project .pagination .previous {
      left: 0; }
      .device-desktop .main.project .pagination .previous.is-disabled ~ .cursor.is-visible.is-previous {
        opacity: .3; }
    .device-desktop .main.project .pagination .next {
      right: 0; }
    .device-desktop .main.project .pagination .cursor {
      display: block;
      position: absolute;
      z-index: 2; }
      .device-desktop .main.project .pagination .cursor.is-visible i {
        opacity: 1; }
      .device-desktop .main.project .pagination .cursor i {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate3d(-50%, -50%, 0);
        display: flex;
        justify-content: center;
        align-items: center;
        border: 1px solid currentColor;
        border-radius: 50%;
        text-align: center;
        color: #fff;
        opacity: 0;
        transition: .5s; }
      .device-desktop .main.project .pagination .cursor svg {
        display: block;
        width: 39.3162%;
        transition: .5s; }
        .device-desktop .main.project .pagination .cursor svg path {
          fill: currentColor; }
      .device-desktop .main.project .pagination .cursor.is-previous svg {
        transform: rotate(180deg); }
      .device-desktop .main.project .pagination .cursor.is-next svg {
        transform: rotate(0deg); } }