@charset "utf-8";

/* Variables */
:root {
  --text-color: #212121;
  --grey-text-color: #7f7f7f;
  --light-grey: rgba(0,0,0,0.1);  


  --gutter: 1.4%;
  --side-padding: 100px;
  --top-padding: 47px;
  --top-header-width: 140px;
  --side-header-width: 88px;
  --menu-item-height: 80px;
  --product-shop-gutter: 30px;
}

/* General */
html {
  font-size: 25px;
  letter-spacing: 0.042rem;
  line-height: 1.2;
  color: var(--text-color);
  background: white;
  font-family: 'Helvetica Neue', arial, sans-serif;
  min-height: 100vh;
  max-width: 100vw; 
  overflow-x: hidden;
  scroll-behavior: smooth;
  
}

html * {
  -webkit-tap-highlight-color: transparent;
}

fieldset {
  padding: 0; border: none;
}

legend {
  text-align: center;
}

input,select,textarea {
  outline: none;
}

body .mobile, .content .mobile, .large, .tablet { display: none }

*::-webkit-input-placeholder { color: var(--placeholder-color, #9b9b9b); }
*:-moz-placeholder { color: var(--placeholder-color, #9b9b9b); }
*::-moz-placeholder { color: var(--placeholder-color, #9b9b9b); }
*:-ms-input-placeholder { color: var(--placeholder-color, #9b9b9b); }

::selection { background: var(--text-color); color: white; opacity: 1; }

.footer *::selection, .footer::selection {
  background: white; color: black;
}

.full-width {
  max-width: calc(1640px + var(--side-padding) * 2);
  width: 100%;
  padding: 0 var(--side-padding);
}

dt,dd,dl { margin: 0; padding: 0; }

input, select {
  padding: 5px;
  border: none;
  background: transparent;
}

ol, ul, li {
  margin: 0; padding: 0;
  display: block;
}

h1,h2,h3,h4,h5 {
  font-weight: normal;
  margin-top: 0;
  line-height: 1.2;
}

ul, ol, p {
  margin: 0;
}

a {
  color: inherit; text-decoration: none;
}

.is-full-screen {
  overflow: hidden;
}

/* Side "Header" */
  
  /* General */
  .header {
    width: var(--side-header-width);
    position: fixed;   
    background: white;
    display: flex; 
    flex-direction: column;
    align-items: center;
    top: 0; bottom: 0; left: 0;
    z-index: 2;
    padding-top: var(--top-padding);
    letter-spacing: -0.02rem;
  }

  .header:after {
    content: ''; display: block;
    position: absolute; right: 0; top: var(--top-padding); bottom: 0;
    border-right: 1px solid var(--text-color);
    width: 2px;
    z-index: 9999;
  }
  
  
  /* Breadcrumbs */  

  .breadcrumbs__wrapper {
    display: flex;    
    writing-mode: tb;
    transform: scaleX(-1) scaleY(-1);
    margin-bottom: auto;
    font-size: 1.1rem;
    font-weight: bold;
    align-items: flex-end;
    padding-bottom: 0.09rem;
    padding-left: 0.15rem;
    min-width: 1rem;
  } 

  .menu-toggle {    
    padding: 17px 8px;    
    position: relative;
    transition: none;
  }

  .menu-toggle:hover {
    color: white;
    transition: 0.25s color 0s;    
  }

  .menu-toggle:after {
    content: ''; display: block;
    position: absolute; top: 0; left: 0; right: 0; 
    height: 0%;
    background: black;
    z-index: -1;
    transition: 0.25s all;
  }

  .is-menu-open .menu-toggle:after {
    display: none;
  }
  
  .menu-toggle:hover:after {
    height: 100%;
  }
  

  .menu-toggle:hover {
    opacity: 0.9;
  } 

  .menu--breadcrumbs {
    padding-bottom: 0.5rem;
    padding-left: 0.34rem;
    transition: 0.25s opacity;

  }

  @media (max-height: 500px) {
    .menu--breadcrumbs {
      display: none;
    }
  }

  .is-menu-open .menu--breadcrumbs {
    opacity: 0; pointer-events: none;
  }

  .is-menu-open .menu-toggle {
    text-indent: -100vw;
    background: white url('../images/close.svg') 50% 100% no-repeat;
    background-size: contain;
    height: 100vh; z-index: 2;
    position: absolute; bottom: 0; 
    left: 0; right: 0;
    background-size: 23px;
  }

  .is-menu-open .languages,
  .is-menu-open .social-links {
    position: relative;
    z-index: 3;
  }

  .menu--breadcrumbs .menu__item {
    display: flex;
    flex-direction: row-reverse;
  }
  
  .menu--breadcrumbs .menu-item,
  .menu--breadcrumbs .menu-item.current-menu-ancestor > .menu-item__inner > .menu-item__link {
    display: none;
  }

  .menu--breadcrumbs .menu-item.current-menu-ancestor,
  .menu--breadcrumbs .menu-item.current-menu-ancestor * {
    display: flex;
  }


  .menu--breadcrumbs .menu-item {
    color: rgba(33, 33, 33 ,0.2);
  }
  
  .menu--breadcrumbs .menu-item.current-menu-ancestor .submenu .menu-item {
    font-size: 0.8rem;
    display: block;
    margin-top: 0.34rem;
    letter-spacing: -0.01em;
    transition: 0.25s all;
  }

  .menu--breadcrumbs .menu-item.current-menu-ancestor .submenu .menu-item:hover {
    color: var(--text-color);
  }

  .menu--breadcrumbs .menu-item.current-menu-ancestor .current-menu-item {
    display: block;
    color: rgba(33, 33, 33, 0.47);
  }

  /* Hebrew */
  .languages {
    margin-bottom: 42px;
    color: var(--text-color);
    transition: 0.25s all;
  }

  .language:hover {
    opacity: 0.5;
  }

  [hreflang="he"] {
    font-family: 'Simpler';
    font-weight: bold;
    font-size: 0.8rem;
  }

  /* Social */
  .social-links {
    margin-bottom: 18px;
    z-index: 2;
  }

  .social-link {
    position: relative;
    margin-bottom: 17px;
  }

  .social-link__link {
    display: block;
  }

  .social-link__icon {
    margin: 0 auto;
  }

  .social-link__title {
    position: absolute; 
    background: black;
    color: white;
    font-size: 13px;
    font-weight: normal;
    letter-spacing: 0.015rem;
    width: calc(var(--side-header-width) + 20px);
    text-align: right;
    padding: 1px 10px 1px 0px;
    border-radius: 0 100px 100px 0;
    left: calc(var(--side-header-width) * -0.55);
    transition: 0.4s all cubic-bezier(0.54, 0.01, 0.38, 0.97);
    transform: translateX(-100%);
  }

  .social-link:hover .social-link__title {
    transform: none;
  }


/* Top header */
.top {
  position: fixed; top: 0; right: 0;
  padding-right: var(--side-padding);
  left: calc(var(--side-padding) + var(--side-header-width));
  padding-top: 30px;
  background: white;
  z-index: 20;
  display: flex;
  align-items: center;
}

.video-animation__video {
  width: 100%;
}

.logo__link {
  margin-right: auto;
  font-weight: bold;
  font-size: 1.72rem;
  letter-spacing: -0.04em; 
  margin-top: -37px;
}

.showreel__link {
  display: block; width: 98px;
  position: relative; 
  margin-top: -11px; margin-right: -22px;
  margin-left: 47px;
}

.top-shop-icon {
  margin-top: -23px;
  margin-inline-start: 52px;
  width: 55px; height: auto;
}


.top-shop-icon__image,
.top-shop-icon__image * {
  width: 100%; height: 100%;
}

.search {
  position: relative;
  top: -17px;
}

.search__prefix {
  position: absolute;
  top: 6px; left: 0px; width: 27px; height: 33px;
  background: url('../images/hash.png') 0% 50% no-repeat; 
  background-size: 13px;
  display: block; font-style: italic;
}

.search__submit {
  background: url('../images/tiny-right-gray.svg') 50% 50% no-repeat;
  border: none; height: 40px; width: 30px;  background-size: 25px;
  position: absolute; right: -5px; top: 2px;
}

.search__submit:focus,
.search__submit:hover {
  background-image: url('../images/tiny-right.svg');
}

.search__input {
  border-bottom: 1px solid var(--text-color);
  width: 402px;
  padding-left: 27px;
  font-size: 1rem;
  padding-bottom: 4px;
  letter-spacing: -0.04em;
} 

.search__input::placeholder {
  color: #7F7F7F;
}

.search .ui-autocomplete {
  border: 1px solid black;
  margin-top: -2px;
  padding: 9px 14px;
  max-height: 170px;
  overflow-y: auto;
}

.search .ui-menu-item {
  font-size: 0.56rem;
  color: rgba(0,0,0,0.4);
  border: none;
  border-bottom: 1px solid rgba(0,0,0,0.1);
  padding: 10px 0;
  letter-spacing: 0.01em;
  height: 1.55rem;  
}

.search .ui-menu-item:last-child {
  border: none; 
}

.search .ui-menu-item.ui-state-focus {
  color: black; font-weight: bold;
  background: none; border-left: none; 
  border-right: none; border-top: none;
}

/* Content */
.content {
  margin-left: var(--side-header-width);
  margin-top: calc(var(--top-padding) + var(--top-header-width) - 8px);
  margin-bottom: var(--side-padding);
}

.gform_title,
.title {
  font-size: 3.8rem;
  letter-spacing: -0.03em;
  font-weight: bold;  
  margin-top: -0.9rem;
  margin-bottom: 2.4rem;
}

.text {
  line-height: 1.3;
  font-size: 0.9rem;
  letter-spacing: -0.012em;
  color: var(--grey-text-color);
  max-width: 35rem;
  margin-bottom: 3.34rem;
}


/* Main menu */
.main-menu { 
  position: fixed; top: 0; 
  left: var(--side-header-width); 
  bottom: 0; right: 0;
  display: flex; z-index: 9;
  align-items: center;
  padding-left: var(--side-padding);
  pointer-events: none;
}

.main-menu:after {
  content: ''; display: block;
  background: white; position: absolute;
  top: 0; right: 0; bottom: 0;
  z-index: -1; width: 100%;
  transform: scaleX(0);
  transform-origin: 100% 50%;
  transition: 0.7s transform cubic-bezier(0.38, 0.01, 0.02, 1.01) 0.35s;
}

.is-menu-open .main-menu:after {
  transform: none;
  transition: 0.7s transform cubic-bezier(0.42, 0, 0, 1);
}

.is-menu-open .main-menu {
  pointer-events: all;
}

.icon {
  display: block;
}

.main-menu .menu-item__link--with-icon *,
.main-menu .menu-item__link--with-icon {
  display: block;
  height: var(--menu-item-height);
}

.menu--main-menu {
  width: 100%;
}

.main-menu .menu-item {
  display: flex;
  width: 100%;
  height: var(--menu-item-height); 
  overflow: hidden;
  position: relative;   
  margin: 1.05rem 0;
  letter-spacing: -0.03em;
}

.main-menu .submenu__item,
.main-menu .submenu__item .menu-item__link {
  display: block; width: auto; height: auto; overflow: visible; position: static;
  transition: none;
}

.main-menu .submenu__item  .menu-item__title {
  font-size: 2rem;
  font-weight: normal;
  letter-spacing: -0.008rem;
  color: rgba(0,0,0,0.2);
  transition: 0.25s all;
}         

.main-menu .submenu__item .menu-item__link:focus .menu-item__title,
.main-menu .submenu__item:hover .menu-item__title,
.main-menu .submenu__item.current-menu-item .menu-item__title {
  color: black;
}

.menu__item--main-menu {
  transform: translateY(0.5rem);
  transform-origin: 100% 100%;
  opacity: 0;
  transition: 0.25s all 0s ease-in-out;
}

.is-menu-open .menu__item--main-menu:nth-child(4) { transition-delay: 0.7s }
.is-menu-open .menu__item--main-menu:nth-child(3) { transition-delay: 0.77s }
.is-menu-open .menu__item--main-menu:nth-child(2) { transition-delay: 0.84s }
.is-menu-open .menu__item--main-menu:nth-child(1) { transition-delay: 0.91s }


.is-menu-open .menu-item {
  transform: none;
  opacity: 1;  
  transition-duration: 0.35s;
}

.main-menu .menu-item__inner { 
  position: relative; top: 0; display: flex;
  transition: 0.25s all;    
}

.main-menu .menu__item--main-menu:not(.is-open):hover .menu-item__inner {
  top: calc(var(--menu-item-height) * -1);
}


.menu-item__icon {
  width: auto; max-width: 320px;
  position: absolute;
}

.menu-item__icon-wrapper {
  position: absolute;
}

.main-menu .menu-item__title {
  display: block; 
  font-size: 3.2rem; font-weight: bold;
  color: black;
  line-height: 1;
}

.main-menu .submenu {
  display: flex;
  opacity: 0; visibility: hidden;
  margin-left: 0.5rem;
  transition: 0.25s all;
}

.main-menu .is-open .submenu {
  opacity: 1; visibility: visible;
}

/* Video popup */
.video-popup {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;  
  background: white; z-index: 99999;
}


.video-popup__play,
.video-popup__close {
  display: block; 
  position: absolute; z-index: 2;
}

.video-popup__play {
  top: 0; left: 0; width: 100%; height: 100%; margin: 0;
  background: url('../images/play.svg') 50% 50% no-repeat;
  transition: 0.25s all;
}

.is-playing .video-popup__play {
  opacity: 0;
}

.video-popup__close {
  top: 0; left: 0; width: 108px; height: 130px;
  background: url('../images/esc-white.svg') 47px 58px no-repeat;  
  z-index: 50;
}

[data-current-type="image"] .video-popup__close  {
  background-image: url('../images/esc.svg')
}

.fade-enter-active, .fade-leave-active {
  transition: opacity 0.25s;
}
.fade-enter, .fade-leave-to  {
  opacity: 0;
}

  /* Video player */

  .video-popup__video,
  .video-popup__video > *,
  .plyr.plyr--video,
  .plyr__video-wrapper {
    background: white;    
  }

  .plyr.plyr--video .plyr__controls {
    background: rgba(255,255,255,0.75);;
    padding: 23px 10px;
  }

  symbol {
    fill: black;
  }

  .plyr .plyr__video-wrapper video {
    width: 100%; height: calc(100%);
    object-fit: contain;   
    object-position: 50% 50%;
    background: white;
  }

  .plyr .plyr__controls input[type="range"],
  .plyr .plyr__progress .plyr__progress__buffer,
  .plyr .plyr__progress input[type=range] {
    color: black;
    border-radius:0;
    height: 2px;
    background: black;
  }

  .plyr .plyr__progress progress {
    background: black;
    box-shadow: none;
    opacity: 1;
    height: 2px;
    margin-top: -1px;
  }

  .plyr .plyr__controls input[type="range"] {
    -webkit-appearance: none;
  }

  .plyr.plyr--full-ui input[type=range]::-moz-range-thumb {
    border-radius: 0;
    background: black;
    width: 2px; height: 26px;
    position: relative; top: -8px;
    -moz-appearance: none;
    box-shadow: none;
    cursor: grab;    
  }
  
  .plyr.plyr--full-ui input[type=range]::-ms-thumb {
    border-radius: 0;
    background: black;
    width: 2px; height: 26px;
    position: relative; top: -8px;
    -ms-appearance: none;
    box-shadow: none;
    cursor: grab;    
  }
  
  .plyr.plyr--full-ui input[type=range]::-webkit-slider-thumb {
    border-radius: 0;
    background: black;
    width: 2px; height: 26px;
    position: relative; top: -8px;
    -webkit-appearance: none;
    box-shadow: none;
    cursor: grab;
  }

  .plyr.plyr--full-ui input[type=range]::-webkit-slider-thumb:active {
    cursor: grabbing;
  }

  .plyr.plyr--full-ui input[type=range]::-ms-thumb:active {
    cursor: grabbing;
  }

  .plyr.plyr--full-ui input[type=range]::-moz-range-thumb:active {
    cursor: grabbing;
  }

  .plyr.plyr--full-ui input[type=range]::-webkit-slider-runnable-track {
    height: 2px; color: black;
  }

  .plyr.plyr--full-ui input[type=range]::-moz-range-track {
    height: 2px; color: black;
  }

  .plyr.plyr--full-ui input[type=range]::-ms-track  {
    height: 2px; color: black;
  }

  .plyr .plyr__controls .plyr__control.plyr__tab-focus, 
  .plyr .plyr__controls .plyr__control:hover, 
  .plyr .plyr__controls .plyr__control[aria-expanded=true] {
    background: none;
  }

  .plyr .plyr__tooltip::before {
    border-top-color: black;
  }

  .plyr .plyr__tooltip {
    background: black; color: white;
    border-radius: 0; bottom: 19px;
  }

  .plyr .plyr__controls .plyr__time {
    text-shadow: none; color: black;
    opacity: 1; font-weight: bold;    
    font-size: 0.95rem;
    position: relative;
    top: -1px;
  }

  .plyr .plyr__control--overlaid,
  .plyr.plyr--full-ui .plyr__control.plyr__tab-focus, 
  .plyr.plyr--full-ui .plyr__control:hover, 
  .plyr.plyr--full-ui .plyr__control[aria-expanded=true] {
    background: none;
    border-radius: 0;    
  }

  .plyr .plyr__controls .plyr__controls__item[data-plyr="fullscreen"] {
    width: 52px; height: 42px;
    opacity: 1;
  }

  .plyr__controls .plyr__controls__item[data-plyr="fullscreen"] svg,
  .plyr__controls .plyr__controls__item[data-plyr="fullscreen"] svg * {
    width: 100%; height: 100%; opacity: 1;
  }


  .plyr .plyr__control--overlaid svg {
    width: 110px; height: 110px;
  }

  .plyr .plyr__control.plyr__tab-focus {    
    box-shadow: none;
    opacity: 0.55;
  }

  .plyr .plyr__controls .plyr__tab-focus::-webkit-slider-runnable-track {
    box-shadow: none !important;
    border: none;    
    opacity: 0.5;
  }

  /* Showreel */


  /* New simple player */
  .video-popup__wrapper .plyr .plyr__control--overlaid,
  #content .plyr .plyr__control--overlaid {
    position: absolute; top: 0; left: 0; right: 0; bottom: 0;
    width: 100%; height: 100%;
    background: transparent; 
    z-index: 10; display: block; opacity: 1 !important; visibility: visible;
    transform: none; -webkit-transform: none; -moz-transform: none;
    transform: translateZ(0); -webkit-transform: translateZ(0);
    cursor: none; display: block !important;
  }

  .video-popup__wrapper .plyr .plyr__control--overlaid svg,
  #content .plyr .plyr__control--overlaid svg {
    display: none;
  }

  .cursor {
    position: fixed; transform: translateZ(0);
    width: 120px; height: 120px; display: block;
    background: url('../images/cursor-play.svg') 50% 50% no-repeat;
    margin-top: -60px; margin-left: -60px;
    z-index: 99999999999999;
    pointer-events: none;
    opacity: 0;
  }  

  .cursor.is-playing {
    background-image: url('../images/cursor-pause.svg');
  }

  .cursor.is-hover {
    opacity: 1;
  }

  /* Landscape */
  @media (max-height: 500px) {
    .cursor { display: none }
    .video-popup__close {
      background-size: 40px;
      background-position: 14px 22px;
    }

    .video-popup__wrapper .plyr .plyr__control--overlaid, 
    #content .plyr .plyr__control--overlaid,
    .video-thumbnail__wrapper {
      background: url('../images/cursor-play.svg') 50% 50% no-repeat;
      background-size: 60px;    
    }    

    .plyr.plyr--full-ui .plyr__video-embed>.plyr__video-embed__container,
    .plyr .plyr__video-wrapper {
      padding: 0 !important;
      height: 100%;
      transform: none !important;
    }


    .video-popup__wrapper .plyr--playing .plyr__control--overlaid, 
    #content .plyr--playing .plyr__control--overlaid {
      opacity: 0 !important;
    }

  }

/* Homepage */
.page-template-homepage .top,
.page-template-homepage .content,
.page-template-homepage .header {
  opacity: 0;
}

.page-template-homepage body.is-has-seen-intro .top,
.page-template-homepage body.is-has-seen-intro .content,
.page-template-homepage body.is-has-seen-intro .header {
  opacity: 1;
  transition: 0.25s all;  
}

  /* Text */
  .page__content--homepage {
    font-size: 4rem;
    font-weight: bold;
    line-height: 1;
    letter-spacing: -0.02em;
    margin-bottom: 3.6rem;
    padding-top: 1.8rem;
    padding-left: 0.7rem;
  }

  /* Video intro */
  .intro-video__component {
    position: fixed; z-index: 9999999;
    background: white;
    top: 0; left: 0; bottom: 0; right: 0; 
    opacity: 0; visibility: hidden;
    transition: 0.25s all;
  }


  .is-showing-intro .intro-video__component {
    opacity: 1; visibility: visible;
  }

  /* Packery */
  .packery {
    margin-right: calc(var(--gutter) * -1);
  }

  .packery__item {
    margin: 0;    
  }

  .packery__item,
  .packery__item[data-width="1"] { width: calc(25% - var(--gutter)) }
  .packery__item[data-width="2"] { width: calc(50% - var(--gutter)) }
  .packery__item[data-width="3"] { width: calc(75% - var(--gutter)) }
  .packery__item[data-width="4"] { width: calc(100% - var(--gutter)) }


  .thumb__image-wrapper {
    position: relative;
  }

  .thumb__image-wrapper:after {
    content: ''; display: block;
    position: absolute; top: 0; left: 0; bottom: 0; right: 0;
  }

  .packery__gutter {
    width: var(--gutter);
  }

  .thumb__inner {
    position: relative;
    overflow: hidden;
    display: block;
  }

  .image__link {
    z-index: 2;
  }

  .image__link--video {
    background: url('../images/play-thumb.svg') 50% 50% no-repeat;
  }

  .image__link--hidden {
    display: none;
  }

  .thumb__image img,
  .thumb__image {
    width: 100%;
  }

  .thumb__image--placeholder {
    padding-top: 56.25%;
  }

  .thumb__image--placeholder.thumb__image--packery-thumb-1x1,
  .thumb__image--placeholder.thumb__image--packery-thumb-2x2,
  .thumb__image--placeholder.thumb__image--packery-thumb-3x3,
  .thumb__image--placeholder.thumb__image--packery-thumb-4x4 { padding-top: 100%; }
  

    /* Thumbnail video player */
    .video-thumbnail__overlay {
      cursor: pointer;
    }

    .video-thumbnail__wrapper {
      z-index: 2;
      background: url('../images/cursor-play.svg') 50% 50% no-repeat;
    }

    .video-thumbnail__plyr .plyr__video-wrapper,
    .video-thumbnail__plyr,
    .video-thumbnail__plyr .plyr {
      height: 100%;
      padding: 0 !important;
    }

    .video-thumbnail__plyr .plyr--full-ui .plyr__video-embed>.plyr__video-embed__container {
      padding: 0; transform: none !important;
      height: 100%;
    }

    .video-thumbnail__plyr .plyr .plyr__video-wrapper video {
      background: black;
    }

    .plyr__video-wrapper iframe {
      height: 100%; width: 100%;
    }
    
    .video-thumbnail {
      width: 100%; height: 100%; display: block;
    }

    .video-thumbnail__fullscreen {
      position: absolute; z-index: 100;
      top: 0; right: 0; font-weight: 600;      
      background: black; color: white;
      padding: 9px 28px 12px 28px; font-size: 1.01rem;
    }

    .video-thumbnail__fullscreen-inner {
      border-bottom: 1px solid;
      line-height: 1; 
      display: inline-block;
    }

    /* Overlay */
    .thumb__link {
      z-index: 2;
    }
    
    .directionality__inner {
    }

    .thumb[data-height="4"][data-width="2"] .directionality,
    .thumb[data-height="4"][data-width="1"] .directionality,
    .thumb[data-height="3"][data-width="2"] .directionality,
    .thumb[data-height="3"][data-width="1"] .directionality {
      perspective: 1000vw;
    }

    .thumb__title-inner:before {
      content: '+ ';
    }
    
    .thumb__title {
      font-size: 1.6rem;
      font-weight: bold;
      line-height: 1;
      text-align: center;
      letter-spacing: -0.04em;
      opacity: 0;      
    }

    .no-directionality:hover .thumb__title {
      opacity: 1;
    }

    .thumb--homepage .thumb__title,
    .thumb--category .thumb__title {
      position: absolute; top: 0; bottom: 0; left: 0; bottom: 0;
      display: flex; justify-content: center; align-items: center;
      text-align: center; width: 100%; height: 100%;
      padding: 30px;      
    }

    

    .directionality.in-bottom .thumb__title,
    .directionality.in-top    .thumb__title,
    .directionality.in-left   .thumb__title,
    .directionality.in-right  .thumb__title {
      opacity: 1;
      transition: 0.5s all 0.2s;
    }


    @media (max-width: 1550px) {
      .thumb__title {
        font-size: 1.6rem;
        line-height: 1.1;
      }
    }

    .thumb__link-inner {
      background: rgba(255, 255, 255, 0.85);
      position: absolute;
      top: 0;
      left: 0;
      bottom: -1px;
      right: -1px;      
      display: flex;
      justify-content: center;
      align-items: center;            
      z-index: 2;
      overflow: hidden;
    }

    .no-directionality .thumb__link-inner {
      opacity: 0;
      transition: 0.3s all;
    }

    .product-thumb .no-directionality .product-thumb__content-inner > * {
      transition: none;      
    }

    .no-directionality:hover .thumb__link-inner ,
    .product-thumb .no-directionality:hover .product-thumb__content-inner {
      opacity: 1;
    }

    .product-thumb:focus-within .product-thumb__content-inner {
      opacity: 1;
    }

    .no-directionality .product-thumb__content-inner > *:nth-child(3) { transition-delay: 0.0s }
    .no-directionality .product-thumb__content-inner > *:nth-child(2) { transition-delay: 0.05s }
    .no-directionality .product-thumb__content-inner > *:nth-child(1) { transition-delay: 0.1s }

    .product-thumb:focus-within .thumb__link-inner,
    .product-thumb:focus .thumb__link-inner,
    .no-directionality.thumb__link:hover .thumb__link-inner {
      opacity: 1;
    }

    .product-thumb:focus-within .product-thumb__content-inner > *,
    .product-thumb:focus .product-thumb__content-inner > *,
    .no-directionality.thumb__link:hover .product-thumb__content-inner > * {
      opacity: 1; transform: none; 
    }

/* Single project */

  /* Intro, collapsible */
  .project__intro { 
    margin-bottom: 2rem
  }

  html:not(.is-dragging) .collapsible__content {
    transition: 0.3s all;
  }

  .project__nav--previous {
    padding-right: 0.5rem;
  }

  .project__navs {
    font-size: 0.75em;    
    letter-spacing: 0.01rem;
    margin-right: 73px;
    margin-top: 0.9rem;
    height: 50px;
    justify-content: center;
    display: flex;
  }

  .project__nav  {
    padding: 0 30px 0 50px;
    color: var(--grey-text-color);
    transition: 0.25s all;
    white-space: nowrap;
    display: flex; align-items: center;
    cursor: url(../images/arrow-project-left.svg), w-resize;
  }

  .project__nav--next {
    padding: 0 50px 0 20px;
    cursor: url(../images/arrow-project.svg), e-resize;
  }

  .project__navs--bottom {
    justify-content: space-between;
    margin-top: 48px;
    margin-bottom: 152px;
    margin-right: 0;
  }

  .project__navs--bottom > * {
    padding: 0;
    font-size: 1.18rem;
  }

  .project__nav:hover {
    color: black;
  }

  .project__top {
    display: flex; 
    justify-content: space-between; align-items: flex-start;
    margin-bottom: 0.9rem;
  }

  .project__title {
    margin-bottom: 0;
    line-height: 1;
    margin-right: 2rem;
    margin-top: -9px;
  }

  .project__role {
    font-weight: bold;
  }

  .project__content  {
    margin-bottom: 1.45rem;
    padding-top: 1rem;
  }

  .project__content p {
    margin-bottom: 1rem;
  }

  .project__credit a,
  .project__content a {
    display: inline-block;
    background-image: linear-gradient(to right, black 40%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 9px 3px;
    background-position: bottom 1px left -6px;
    background-repeat: repeat-x;
  }

  .project__credit a {
    line-height: 1.2;
    background-position: bottom 0 left -6px;
  }

  .project__credit .project__credit-link--creator {
    background: none;
  }

  .project__content a:hover {
    color: black;
  }
  
  .project__download,
  .project__sale-link,
  .project__credits {
    font-size: 0.78rem;
    line-height: 1.2;    
    letter-spacing: -0.015em;
    margin-bottom: 0;    
    padding-bottom: 0;
  }

  .project__credits  {
    margin-bottom: 2.11rem;
    line-height: 1.5;
    color: black;
  }

  .project__sale {
    padding-bottom: 0.62rem;
  }

  .project__download-link,
  .project__sale-link {
    height: 33px;
    line-height: 1;    
    background: url('../images/gift.svg') 0 50% no-repeat;
    display: flex; align-items: center;
    padding-left: 46px;
  }

  .project__download-link span,
  .project__sale-link span {
    display: block;
  }

  .project__download-link {
    margin-bottom: 10px;
    background-image: url('../images/download.svg');
  }

  .project__download-link:hover {
    background-image: url('../images/download-hover.svg');
  }

  .project__sale-link:hover {
    background-image: url('../images/gift-hover.svg');
  }

  .collapsible__handle {
    display: block;
    height: 75px;
    margin-top: 33px;
    cursor: grab;
    position: relative;
    background: url('../images/down-2.svg') 50% 48px no-repeat;  
    background-size: 17px;  
  }

  .is-collapsible-open .collapsible__handle {
    background: url('../images/up-2.svg') 50% 8px no-repeat;
  }



  .collapsible__handle:active {
    cursor: grabbing;
  }

  .collapsible__handle:before {
    content: ''; display: block;
    position: absolute; left: 0; right: 0; top: calc(50% - 1px);
    border-top: 2px solid black;

  }

  .collapsible__content {
    overflow: hidden;
  }

  .is-dragging {
    user-select: none;
  }

  /* Images, sale button */
  .project__images {
    position: relative;
  }

  .project__sale-button {
    position: fixed; top: 50%; right: 0px;
    z-index: 5; 
    transform: translateY(-50%);
    transition: 0.25s all; 
  }

  .is-down-to-products .project__sale-button,
  .is-past-intro.is-down-to-products .project__sale-button,
  .is-collapsible-open .project__sale-button {
    visibility: hidden; opacity: 0; pointer-events: none;
  }

  .is-past-intro .project__sale-button {
    visibility: visible; opacity: 1; pointer-events: all;
  }

  @media (max-width: 1600px) {
    .project__sale-button { 
      transform: scale(0.65) translateY(-50%);
      right: -24px;
    }
  }


  /* Product thumbs */
  .project__products {
    
  }

  .product-thumb--project {
    width: calc(25% - var(--product-shop-gutter) * 2);
  }

  .product-thumb__link-inner {
    flex-direction: column;
    text-align: center;
  }

  .product__links {
    display: flex; justify-content: center;
  }

  .product__link {
    margin: 0 8px;
    width: 143px; height: 65px;
    display: block;
    background: url('../images/marmelada.svg') 50% 50% no-repeat;
    background-size: cover;
  }

  .product__link--etsy {
    background-image: url('../images/etsy.svg');
  }

  .product__link--etsy:hover {
    background-image: url('../images/etsy-hover.svg');
  }

  .product__link--marmelada:hover {
    background-image: url('../images/marmelada-hover.svg');
  }

  .product-thumb__title {
    display: block;    
    font-size: 1.5rem;
  }

  /* Product's sale part */
  .project__products {
    border-top: 1px solid;
    margin-top: 2.55rem;
    padding-top: 3.76rem;
  }

  .project__subtitle {
    text-align: center;
    font-weight: bold;    
    font-size: 2.8rem;
    letter-spacing: -0.12rem;
    margin-bottom: 3.5rem;
  }
  
  .project__product-thumbs {
    max-width: 1300px;
    margin: 0 auto 0 auto;
  }
  
  .project__product-thumbs .product-thumb--project {
    margin: 0 var(--product-shop-gutter);
  }
  
  .project__product-thumbs .product-thumb .product-thumb__title {
    font-size: 1.1rem;
    margin-bottom: 0.6rem;
  }
  

  .project__product-thumbs .product-thumb__price {
    font-size: 0.96rem;
    margin-bottom: 1.5rem;
  }

  .project__product-thumbs .product__link {
    height: 37px; width: 73px;
    display: block;
  }

  .project__product-thumbs .product__link img {
    width: 100%; height: 100%;
  }

  /* Lightbox */

  .lightbox {
    background: black; z-index: 2000;
    display: flex; flex-direction: column;
    position: fixed; top: 0; left: 0; bottom: 0; right: 0;
    z-index: 999999999;    
  }

  .fade-enter {
    opacity: 0;
    transition: 0.25s all;
  }

  .fade-leave {
    opacity: 1; 
  }

  .lightbox__content {
    position: relative; height: calc(100vh - 100px);
    margin: 50px 158px; margin-bottom: 0;
    display: flex; justify-content: center; align-items: center;
    z-index: 2;
  }

  .lightbox:not([data-current-type="image"]) .lightbox__content,
  .lightbox:not([data-current-type="image"]) .lightbox__content > *,
  .lightbox:not([data-current-type="image"]) .lightbox__player,
  .lightbox:not([data-current-type="image"]) .plyr  {
    width: 100vw; height: 100vh; margin: 0; max-height: none;
  }

  .lightbox__pager {
    position: absolute; top: 0; left: 0; bottom: 0; right: 0;
    display: flex; justify-content: center; align-items: stretch;
    z-index: 0; z-index: 50;
  }

  .lightbox:not([data-current-type="image"]) .lightbox__pager {
    justify-content: space-between;
    pointer-events: none;
    z-index: 5;
  }

  .lightbox:not([data-current-type="image"]) .lightbox__nav  {
    width: 25%; flex: 0 0 25%;
    pointer-events: all;
  }

  [data-current-type="image"] .lightbox__pager {
    z-index: 3;
  }


  .lightbox__image  {
    object-fit: contain;
  }

  .lightbox__nav,
  .lightbox__nav:active  {
    width: 50%; display: block;
    height: 100%; position: relative;
    background: none; flex: 1;

    cursor: url(../images/arrow-left.svg), w-resize;
  }

  .lightbox__nav--next,
  .lightbox__nav--next:active {
    cursor: url(../images/arrow.svg), e-resize;
  }
  
  [data-current-type="image"] .lightbox__nav {
    cursor: url(../images/arrow-white-left.svg), w-resize;
  }

  [data-current-type="image"] .lightbox__nav--next {
    cursor: url(../images/arrow-white-right.svg), w-resize;
  }

  .lightbox__pager-text {
    width: 250px; font-size: 1.5rem;
    text-align: center; font-weight: normal;
    color: black;
    display: none;
  }

  .lightbox__player > video {
    height: 100%; width: 100%;
  }

  .lightbox .plyr .plyr__video-wrapper video {
    object-fit: contain;
  }

  .lightbox__player {
    max-height: calc(100vh - 150px);
    position: relative;
  }


  .lightbox__player-wrapper--youtube,
  .lightbox__player-wrapper--vimeo {
    width: 100%;  
  }

  .plyr .plyr__video-embed, 
  .plyr.plyr--full-ui .plyr__video-embed>.plyr__video-embed__container,
  .plyr .plyr__video-wrapper--fixed-ratio {
    height: 100%; padding: 0 !important;
    transform: none !important;
  }

    /* Nav buttons for the gallery */
    .lightbox__nav:after,
    .lightbox__nav:before {
      content: ''; display: block;
      height: 3px; background: black;
      width: 24px; position: absolute; top: 50%;
      transform-origin: 0% 50%; border-radius: 50px;
      transform: rotate(-45deg) translate(0, 1px);
      transition: 0.15s transform;
      display: none;
    }

    .lightbox__nav:before  {
      transform: rotate(45deg) translate(0, -1px);
    }

    .lightbox__nav:hover:after {
      transform: rotate(-35deg) translate(0, 1px);
    }

    .lightbox__nav:hover:before {
      transform: rotate(35deg) translate(1px, 0px);
    }

    .lightbox__nav:hover:active:after {
      transform: rotate(-25deg) translate(0, 1px);
    }

    .lightbox__nav:hover:active:before {
      transform: rotate(25deg) translate(0, 0px);
    }

    .lightbox__nav--next:before,
    .lightbox__nav--next:after {
      transform-origin: 100% 50%;
    }

    .lightbox__nav--next:after {
      transform: rotate(-45deg) translate(1px, -1px);
    }

    .lightbox__nav--next:hover:after {
      transform: rotate(-35deg) translate(0px, -1px);
    }

    .lightbox__nav--next:hover:before {
      transform: rotate(35deg) translate(0, 0px);
    }

    .lightbox__nav--next:hover:active:after {
      transform: rotate(-25deg) translate(0px, -1px);
    }

    .lightbox__nav--next:hover:active:before {
      transform: rotate(25deg) translate(0, 0px);
    }

    

    .lightbox .is-disabled.lightbox__nav.lightbox__nav:before,
    .lightbox .is-disabled.lightbox__nav:after {
      transform: rotate(0) translate(0, 0);
    }

    .lightbox .is-disabled {
      pointer-events: none; cursor: default;
    }


/* Error page */
.page-template-error-404 {
  overflow-y: hidden;
}

.page-template-error-404,
.page-template-error-404 .top,
.page-template-error-404 .header {
  background: black;
  color: white;
  --text-color: white;
}


.page-template-error-404 .is-menu-open,
.page-template-error-404 .is-menu-open .top,
.page-template-error-404 .is-menu-open .header  {
  --text-color: #323233;
}

.page-template-error-404 body:not(.is-menu-open) .search__prefix {
  background-image: url('../images/hash-white.png');
}

.page-template-error-404 body:not(.is-menu-open) .search__input::placeholder {
  color: white;
}

.page-template-error-404 body:not(.is-menu-open) .search__submit {
  background-image: url('../images/search-button-white.svg');
}

.page-template-error-404 .video-animation, 
.page-template-error-404 .social-link__icon {
  filter: invert(1);
}

.page-template-error-404 .is-menu-open {
  --text-color: #323232;
}

.page-template-error-404 .is-menu-open,
.page-template-error-404 .main-menu {
  color: black;
  --text-color: #323232;
  transition: none;
}
 
.page-template-error-404 .main-menu .menu-item,
.page-template-error-404 .main-menu:after {
  transition: none;
}

.page-template-error-404 .is-menu-open .video-animation,
.page-template-error-404 .is-menu-open .social-link__icon {
  filter: none;
}

.page-template-error-404 .is-menu-open .header,
.page-template-error-404 .is-menu-open .top {
  background: white; color: black;
}

.page-template-error-404 .is-menu-open .header:after {
  border-color: black;
}

.page-template-error-404 .social-link__title {
  background: white; color: black;
}

.error__wrapper {
  height: calc(100vh - 16rem);
  position: relative;
}



.error__animation,
.error__animation svg {
  height: 100%;
  transform: none !important;
  position: absolute;
  
}

.error__animation svg {
  width: auto !important;
}

.error__content .error__text {
  font-weight: normal;
}

/* Search results */
.search-thumbs {
  display: flex;
  flex-wrap: wrap;
}

.search-thumb {
  width: calc((100% / 3) - var(--gutter));
  margin: calc(var(--gutter) / 2);
  position: relative;
  padding-top: calc((100% / 3) - var(--gutter));
  overflow: hidden;
}

.search-thumb:not(.member-thumb) > *{
  position: absolute; top: 0; left: 0; right: 0; bottom: 0;
}

.member-thumb .video-animation__video {
  width: 100%;
  display: block;
}

/* Our story */

  .clients__title {
    margin-left: -0.6rem;
    margin-bottom: 3rem;
  }

  /* Clients */
  .clients {
    display: flex;
    flex-wrap: wrap;
    margin: calc(var(--gutter) / 2 * -1);
  }

  .client {
    width: calc((100% / 6) - var(--gutter));
    margin: calc(var(--gutter) / 2)
  }

  .client__inner {
    position: relative;
    padding-top: 100%;
  }

/* Team */
.member-thumb {
  font-size: 1.2rem;
  letter-spacing: -0.030rem;
  font-weight: bold;
  color: #c1c1c1;
  line-height: 1;
  position: relative;
  padding: 0;
}

.member-thumb__wrapper {
  position: relative;
  margin-bottom: 0.54rem;
}

.member__email {
  position: absolute; left: 0; bottom: 0;
  z-index: 2;
  display: block;
  background: black; color: white;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0;
  padding: 7px 9px;
  border: 2px solid black;
  transition: 0.25s all;
}

.member-thumb__video-wrapper {
  padding-top: 100%;
}

.member-thumb__video-wrapper  * {
  width: 100%; height: 100%;
  object-fit: cover; object-position: 0 50%;
}

.member__email:after {
  content: ''; display: block;
  position: absolute; top: 0; left: 0; bottom: 0;
  width: 0%; background: white;
  z-index: -1;
  transition: 0.25s all;
}

.member__email:focus:after,
.member__email:hover:after {
  width: 100%;
}

.member__email:focus,
.member__email:hover {
  color: black;
}

.member-thumb__name {
  margin-bottom: 0.1rem;
  font-weight: bold;
  line-height: 1;
  color: var(--text-color);
}

.member-thumb__role {
  font-weight: normal;
}

.member-thumb__video {
  
}

/* Search */
.search-thumb .thumb__title {
  font-size: 1.6rem;
}

.text-animation--not-found {
  font-weight: bold;
  font-size: 2.8rem;
  font-size: 3.65vw;
  line-height: 1;
  letter-spacing: -0.0566em;
  word-break: break-all;
}

@media (max-width: 1600px) {
  .text-animation--not-found {
    font-size: 2.2vw;
  }
}

.line-top {
  font-weight: bold; font-size: 1.55rem;
  margin-left: 0.5rem;
}

.line-top:before {
  content: ''; display: block;
  width: 2.5rem;
  border-top: 8px solid;
  margin-bottom: 1.12rem;
  margin-top: 3rem;
}

.not-found__text {
  color: black;
}

.not-found {
  max-width: calc(100vh - 50px);
}

/* Products */
.product-thumb .product-thumb__title {
  font-size: 1.6rem;
  margin-bottom: 0.5rem;
}

.product-thumb__content-inner {
  padding: 30px;
  opacity: 0;
  transition: 0.25s all 0.2s;
}

.in-right .product-thumb__content-inner,
.in-left .product-thumb__content-inner,
.in-top .product-thumb__content-inner,
.in-bottom .product-thumb__content-inner {
  opacity: 1;
}

.product-thumb .thumb__title:before {
  display: none;
}

.product-thumb__price {
  font-size: 1rem;
  letter-spacing: -0.01em;
  display: block;
  margin-bottom: 1.7rem
}

/* Contact */
.contact__title  {
  margin-bottom: 1.8rem;
}

.contact__form {
  max-width: 1251px;
  padding-top: 12px;
}

.contact__text {
  margin-top: -1.9rem;
  font-size: 1rem;
  letter-spacing: -0.0em;
}

.gfield_label {
  display: none;
}

.gform_fields {
  display: flex;
  flex-wrap: wrap
}

.gfield {
  margin-bottom: 1rem;
  width: 100%;
}


.gfield,
.gfield_error-svg,
.ginput_container  {
  height: 3.2rem;
}

.ginput_recaptcha,
.ginput_recaptcha ~ .gfield_error-svg {
  height: 4.5rem;
}

.gfield_error {
  height: 4.8rem;
}



.gfield:last-child {
  position: fixed; top: -200vh;
}

.gform_button,
.gfield input, 
.gfield textarea {
  font-size: 1.62rem;
  letter-spacing: -0.05em;
  background: black; 
  width: 100%;
  border: 3px solid black;
  padding: 0.42rem 0.85rem;
  height: 100%;
}

.field--phone {
  width: 39.5%;
  margin-right: 1rem;
}

.field--email {
  width: calc(60.5% - 1rem);
}

.gfield textarea::placeholder,
.gfield input::placeholder {
  color: white;
}



.field--message {
  height: 13rem;
}

.gfield textarea {
  padding-top: 0.7rem;
  height: 100%;
  margin: 0;
  position: absolute; top: 0; left: 0; right: 0;
}

.ginput_container_textarea,
.ginput_container_textarea ~ .gfield_error-svg {
  height: 100%;
}

.gform_footer  {
  display: flex;
  justify-content: flex-end;
  margin-top: 0.42rem;
  position: relative;
}

.gform_button {
  background: white;
  border-width: 3px;  
  font-size: 1.37rem;
  padding: 10px 28px;
  width: auto;
  font-weight: bold;
  letter-spacing: -0.02rem;
}

input.gform_button  {
  display: block !important;
  position: absolute;
  bottom: 0; opacity: 0;
}

.gform_button:active {
  background: black; color: white;
}

.gfield {
  position: relative;
}


.gfield .is-with-content,
.gfield input:focus,
.gfield textarea:focus {
  background: white; color: black;
}

#error {
  position: fixed; top: -100vh;
}

.validation_message {
  font-size: 0.78rem; font-weight: bold;
  display: block; margin-bottom: 0.5rem;
  margin-top: 0.66rem;
  letter-spacing: -0.02em;;
}


.gform_wrapper {
  transition: 0.25s all;
}

.gform_wrapper.is-loading .gform_body {
  cursor: wait;
  pointer-events: none;
  opacity: 0.85;
}

.gform_wrapper.is-loading .gform_body * {
  cursor: wait;
}


  /* Error state */

  .gfield_error textarea,
  .gfield_error textarea:focus,
  .gfield_error .is-with-content *,
  .gfield_error input:focus,
  .gfield_error input {  
    background: white;
    border: none;
  }

  .gfield_error input::placeholder,
  .gfield_error textarea::placeholder {
    color: rgba(0,0,0,0.15);
  }

  .gfield_error-svg {
    position: absolute; top: 0; left: 0;
    width: 100%; 
    pointer-events: none;
    display: none;
  }

  .gfield_error .gfield_error-svg {
    display: block;
  }

  .gfield_error-rect {
    fill: none; 
    stroke: black;
    stroke-width: 9px;
    stroke-dasharray: 19px 6px;
    animation: 1000000s error-border;
  }

  @keyframes error-border {
    to {
      stroke-dashoffset: 100000000;
    }
  }

  /* Confirmation message */
  .page--confirmation {
    text-align: center;
    font-size: 1.3rem;
    letter-spacing: -0.038em;
    font-weight: normal;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    color: black;
  }

  .page--confirmation br {
    display: none;
  }

  .page--confirmation h1 {
    font-weight: bold;
    font-size: 8.3rem;
    letter-spacing: -0.04em;
    margin-bottom: 0rem;
    line-height: 1;
    margin-bottom: 0.9rem;
    margin-top: 0.7rem;
    position: relative;
    left: -0.5rem;
  }

  .page--confirmation a {
    display: inline-block;
    
    margin-top: 2.2rem;
    border: 3px solid black;
    padding: 0.25rem 1.42rem 0.45rem 1.42rem;
    font-size: 1.42rem;
    letter-spacing: -0.075rem;
    font-weight: bold;
  }

  .page--confirmation a:active {
    background: black; color: white;
  }

/* Client form */
.page--client-form .gfield {
  margin-bottom: 10px;
}


.page--client-form .gform_title {
  font-size: 4.55rem;
  margin-bottom: 0.7rem;
}

.form-item--half {
  width: calc(50% - 6px);
  margin-right: 6px;
  float: left;
}

.gfield:not(.form-item--half) + .form-item--half + .form-item--half,
.form-item--half:nth-of-type(even) {
  margin-right: 0;
  margin-left: 6px;
}


.gfield:not(.form-item--half) + .form-item--half {
  margin-left: 0;
  margin-right: 6px;
}

.page--client-form .gform_button {
  margin-top: 3.6rem;
  font-size: 1.55rem;
  min-width: 231px;
  text-align: center;
  padding: 15px;
}

.bottom-sections {
  margin-top: 41px;
}

.bottom-section__title {
  font-size: 1.2rem;
  letter-spacing: -0.035em;
  margin-bottom: 35px
}

.bottom-section--1 .bottom-section__title {
  margin-bottom: 10px;
}

.bottom-section__columns {
  display: flex;
}

.bottom-section__column {
  margin-left: 5.5%;
  margin-bottom: 52px;
}

.bottom-section__column * {
  font-size: 0.78rem;
  letter-spacing: -0.023em;
  line-height: 1.5;  
}

.bottom-section__column h3 {
  font-weight: 900;
  margin-bottom: 9px;
}

/* Buttons */
a.gform_button,
.page--confirmation a {
  position: relative;
  transition: 0.15s color 0.15s;
  background: none;
}

a.gform_button:after,
.page--confirmation a:after {
  content: ''; display: block;
  position: absolute; left: 0; top: 0; bottom: 0; width: 0;
  background: black;
  z-index: -1;
  transition: 0.45s width;
}

a.gform_button:focus,
a.gform_button:hover,
.page--confirmation a:focus,
.page--confirmation a:hover {
  color: white;
}

a.gform_button:focus:after,
a.gform_button:hover:after,
.page--confirmation a:focus:after,
.page--confirmation a:hover:after {
  width: 100%;

}



/* Huge screens */
@media (min-width: 1921px) {
  .full-width {
    max-width: none;
  }
   
  .packery__item,
  .packery__item[data-width="1"] { width: calc(25% - var(--gutter)) }
  .packery__item[data-width="2"] { width: calc(50% - var(--gutter)) }
  .packery__item[data-width="3"] { width: calc(50% - var(--gutter)) }
  .packery__item[data-width="4"] { width: calc(100% - var(--gutter)) }

  .packery--project .packery__item[data-width="2"] { width: calc(50% - var(--gutter)) }
  .packery--project .packery__item[data-width="4"] { width: calc(100% - var(--gutter)) }

  .text-animation--not-found { 
    font-size: 2.2rem;
  }
}

/* Shop */

  /* Top */
  .shop__title {
    margin-bottom: 38px;
  }
  .shop__top-image, .shop__top-image * {
    display: block; width: 100%;
  }

  .shop__top-image {
    margin-bottom: 148px;
  }

  /* Back to store */
  .hover-link {
    display: block;
    letter-spacing: 0;
    font-size: 0.78rem;
    font-weight: bold;
    margin-bottom: 22px;
    margin-top: -21px;

    transition: 0.25s color;
  }

  .hover-link__inner {
    display: inline-block;
    position: relative;
    padding: 8px 17px 12px 10px;
    padding-inline-start: 10px;
    padding-inline-end: 17px;
  }

  .hover-link__inner:before {
    content: ''; display: block;
    position: absolute;
    inset-inline-start: 0; bottom: 0; top: 0;
    width: 0%;
    transition: 0.25s width;
    background: black;
    z-index: -1;
  }

  @media (pointer: fine) {
    .hover-link:hover .hover-link__inner:before {
      width: 100%;
    }
  
    .hover-link:hover {
      color: white;
    }
  }

  .hover-link__arrow {
    font-size: 1.3em;
    position: relative ;
    top: 0.1em;    
  }


  .back-to-store + .title {
    font-size: 4.5rem;
    margin-bottom: 79px;
  }
 
  /* Category */
  .product-category__top {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 33px;
  }

  .title.product-category__title {
    font-size: 1.6rem;
    margin: 0;
  }

  .product-category__link {
    font-size: 0.7rem;
    letter-spacing: -0.02em;
    color: #888;
  }

  .product-category {
    --shop-gutter: 11px;
    border-bottom: 1px solid;
    padding-bottom: 42px;
    margin-bottom: 36px;
  }

  .product-category:last-child {
    border-bottom: 0;
  }

  .product-category__thumbs,
  .product-category__thumbs .flickity-viewport,
  .product-category__thumbs .flickity-slider {
    height: 100%; width: 100%;
  }

  .product-category .product-thumb--project {
    width: 20%;
  }

  .product-category .thumb__title  {
    font-size: 1.1rem;
  }

  .product-category .product-thumb__price {
    margin-bottom: 52px;
  }

  .product-category .product__link {
    width: 104px; height: 47px;
  }

  .product-category .product-thumb__price {
    color: #777;
    font-size: 0.8rem;
  }

  .product-thumb__content-inner {
    padding: 0;
  }

  .product-thumb__inner {
    padding: 0 var(--shop-gutter);
  }

  .product-category__thumbs {
    --margin: 12px;
    padding: 0 var(--margin);
    margin: 0 auto;
    width: calc(100% - var(--margin) * 2);
  }

  .product-category__thumbs .flickity-prev-next-button svg {
     display: none; 
  }

  .product-category__thumbs .flickity-prev-next-button {
    background: url('../images/shop-left.svg') 50% 50% no-repeat;
    width: 51px;
    border-radius: 0;
    left: -62px; margin-top: 1px;
  }

  .product-category__thumbs .flickity-prev-next-button.next {
    left: auto; right: -62px;
    background-image: url('../images/shop-right.svg');
  }

  @media (max-width: 1350px)  {
    
  }

  @media (max-width: 1200px) {
    .product-category .product-thumb--project {
      width: 25%;
    }    

    .shop__top-image {
      margin-bottom: 58px;
    }

    .product-category__thumbs .flickity-prev-next-button {
      width: 30px;
      background-size: contain;
      left: -33px;
    }

    .product-category__thumbs .flickity-prev-next-button.next {
      right: -33px;
    }

    .product-category__thumbs .thumb__link:focus .thumb__link-inner {
      display: flex;
    }    
  }

  @media (max-width: 1000px) {
    .product-category .product-thumb--project {
      width: 33.33%;
    }
  }
