/*
 * The preloader component.
 *
 * Edit this file. It is served as it is — nothing compiles it, and the
 * order it loads in is set in resources/css/order.php.
 */

.preloader {
  align-self:flex-start;
  display:flex;
  height:calc(var(--mobile-vh)*100);
  inset:0;
  overflow:hidden;
  position:fixed;
  z-index:100;
}

.preloader.is-hidden {
  pointer-events:none;
}

html.no-js .preloader {
  display:none;
}

.preloader__item {
  align-items:center;
  background-color:#181818;
  display:flex;
  flex-grow:1;
  flex-shrink:0;
  justify-content:center;
  overflow:hidden;
  position:relative;
  transition:transform .6s ease;
}

.preloader__item.is-hidden {
  transform:translateY(-100%);
}

.preloader__image {
  aspect-ratio:1/1;
  width:360px;
}

@media (max-width:900px)and (orientation:landscape),screen and (max-width:767px) {

  .preloader__image {
    width:240px;
  }
}

.preloader__image-container,
.preloader__image-wrapper {
  aspect-ratio:1/1;
  position:relative;
}

.preloader__image-container span:after,
.preloader__image-container span:before,
.preloader__image-container:after,
.preloader__image-container:before,
.preloader__image-wrapper span:after,
.preloader__image-wrapper span:before,
.preloader__image-wrapper:after,
.preloader__image-wrapper:before {
  background-color:#f1ede4;
  content:"";
  position:absolute;
  transition:all .4s ease;
  z-index:1;
}

.preloader__image-container:before,
.preloader__image-wrapper:before {
  height:1px;
  left:0;
  top:0;
  width:0;
}

.preloader__image-container:after,
.preloader__image-wrapper:after {
  height:0;
  right:0;
  top:0;
  width:1px;
}

.preloader__image-container>span:before,
.preloader__image-wrapper>span:before {
  bottom:0;
  height:1px;
  right:0;
  width:0;
}

.preloader__image-container>span:after,
.preloader__image-wrapper>span:after {
  bottom:0;
  height:0;
  left:0;
  width:1px;
}

.preloader__image-container.frame-top:before,
.preloader__image-wrapper.frame-top:before {
  width:100%;
}

.preloader__image-container.frame-right:after,
.preloader__image-wrapper.frame-right:after {
  height:100%;
}

.preloader__image-container.frame-bottom>span:before,
.preloader__image-wrapper.frame-bottom>span:before {
  width:100%;
}

.preloader__image-container.frame-left>span:after,
.preloader__image-wrapper.frame-left>span:after {
  height:100%;
}

.preloader__image-container>span,
.preloader__image-wrapper>span {
  display:block;
  height:100%;
  inset:0;
  pointer-events:none;
  position:absolute;
  width:100%;
}

.breadcrumbs {
  align-items:center;
  display:flex;
  gap:12px;
  justify-content:flex-start;
  margin-top:var(--header-height);
  margin-inline:var(--offset-x);
  padding-top:16px;
}

@media screen and (max-width:1199px) {

  .breadcrumbs {
    gap:8px;
  }
}

.breadcrumbs-item {
  align-items:center;
  display:flex;
  gap:4px;
  opacity:.6;
  text-transform:uppercase;
  transition:opacity .3s ease-in-out;
}

@media(any-hover:hover),(hover:hover)and (pointer:fine) {

  .breadcrumbs-item:not(:disabled):hover {
    opacity:1;
  }
}

.dropdown-menu {
  -webkit-clip-path:inset(0 0 100% 0);
  clip-path:inset(0 0 100% 0);
  left:0;
  pointer-events:none;
  position:absolute;
  top:100%;
  transition:-webkit-clip-path .6s cubic-bezier(.25,.25,0,1);
  transition:clip-path .6s cubic-bezier(.25,.25,0,1);
  transition:clip-path .6s cubic-bezier(.25,.25,0,1),-webkit-clip-path .6s cubic-bezier(.25,.25,0,1);
  z-index:2;
}

.dropdown-menu.is-active {
  -webkit-clip-path:inset(0 0 0 0);
  clip-path:inset(0 0 0 0);
  pointer-events:auto;
}