/*!******************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./components/blocks/portfolio/styles/src/portfolio.scss ***!
  \******************************************************************************************************************************************************************************************************************************************************************************/
:root{
  --spacing-m:clamp(10rem, 35vh, 20rem);
  --spacing-s:calc(var(--spacing-m)/2);
  --col-default:content;
  --col-full:1 / -1;
  --col-left:full-width-start / center-start;
  --col-right:center-start / content-end;
  --col-right-extended:center-start / -1;
  --border-radius-l:10rem;
  --border-radius-ml:6rem;
  --border-radius-m:4rem;
  --border-radius-s:2rem;
  --border-l:0 0 var(--border-radius-l) 0;
  --border-ml:0 0 var(--border-radius-ml) 0;
  --border-m:0 0 var(--border-radius-m) 0;
  --border-s:0 0 var(--border-radius-s) 0;
  --ease-smooth:cubic-bezier(0.5, 0.05, 0, 1);
}

[data-wp-router-region=content].is-loading{
  opacity:.7;
  pointer-events:none;
  position:relative;
  transition:opacity .3s ease-in-out;
}

[data-wp-router-region=content].is-loading:after{
  background:hsla(0,0%,100%,.8);
  bottom:0;
  content:"";
  left:0;
  position:absolute;
  right:0;
  top:0;
  z-index:2;
}

.footer__menu a.is-active,.footer__sub-menu a.is-active,.header__menu a.is-active{
  font-weight:700;
  position:relative;
}

.footer__menu a.is-active:after,.footer__sub-menu a.is-active:after,.header__menu a.is-active:after{
  background-color:currentColor;
  bottom:-4px;
  content:"";
  height:2px;
  left:0;
  position:absolute;
  right:0;
}

.footer__menu a,.footer__sub-menu a,.header__menu a{
  transition:all .2s ease-in-out;
}

.footer__menu a:hover,.footer__sub-menu a:hover,.header__menu a:hover{
  opacity:.8;
}

.portfolio-archive{
  --column:var(--col-full);
  display:grid;
  gap:2rem;
  grid-template-columns:1fr 1fr;
}

.portfolio-archive-item{
  align-items:center;
  aspect-ratio:8/10;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  overflow:hidden;
  padding-bottom:4rem;
  position:relative;
  text-decoration:none;
}
.portfolio-archive-item:before{
  background:linear-gradient(0deg, #09372e, rgba(9,55,46,0));
  bottom:0;
  content:"";
  display:block;
  height:60%;
  left:0;
  position:absolute;
  transform-origin:bottom;
  transition:transform .6s var(--ease-smooth), opacity .6s var(--ease-smooth);
  width:100%;
  z-index:1;
}
.portfolio-archive-item:last-of-type{
  border-radius:var(--border-m);
}
.portfolio-archive-item__image{
  height:100%;
  left:0;
  -o-object-fit:cover;
     object-fit:cover;
  position:absolute;
  top:0;
  width:100%;
  z-index:0;
}
.portfolio-archive-item__logo{
  height:auto;
  width:10rem;
}
.portfolio-archive-item__logo,.portfolio-archive-item__name{
  transform:translateY(4rem);
  transition:transform .6s var(--ease-smooth), opacity .6s var(--ease-smooth);
  z-index:1;
}
.portfolio-archive-item__name{
  color:#fff;
  font-size:clamp(1.5rem, 4vw, 2rem);
  margin:2rem 0 0;
  opacity:0;
}
.portfolio-archive-item:hover:before{
  transform:scaleY(1.2);
}
.portfolio-archive-item:hover .portfolio-archive-item__logo{
  opacity:.5;
  transform:translateY(2rem) scale(.6);
}
.portfolio-archive-item:hover .portfolio-archive-item__name{
  opacity:1;
  transform:none;
}

/*! Add Soul */
/*# sourceMappingURL=portfolio.css.map*/