.pad {
	padding-bottom: 50px;
}

.recent-projects-template .site-inner>.wrap {
  max-width: 100%;
  width: 100%;
}

.entry-title {
	display: none;
}

.project-hero-image {
  position: relative;
  aspect-ratio: 7 / 2;
  width: 100%;
  height: auto;
}

.project-hero-image img {
  position: absolute;
  inset: 0;
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.project-hero-content {
  padding: 20px;
  text-align: center;
}

.project-hero-title {
  font-size: clamp(1.556rem, 3.939vw + 0.242rem, 3.444rem);
  font-weight: bold;
  text-wrap: balance;
}

.project-date {
  font-size: clamp(0.778rem, 0.833vw + 0.5rem, 1.389rem);
}





/* gallery */
:root {
  --gallery-columns: 4;
  --gallery-gap: 20px;
}

/* gallery layout */
.gallery-main .container {
  display: flex;
  gap: var(--gallery-gap);
  flex-wrap: wrap;
}

.lightbox-img-wrap {
  width: calc((100% - var(--gallery-gap) * calc(var(--gallery-columns) - 1)) / var(--gallery-columns));
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.gallery-main .container img {
  aspect-ratio: 1 / 1;
  width: 100%;
  height: auto;
}



/* lightbox */
.lightboxpreview {
  transition: all .3s linear;
  padding-top:60%;
  cursor:pointer;
  background-size:cover;
}
   
.lightbox-content {
  max-height:75svh;
  height:75svh;
}

.lightbox-close { 
  cursor:pointer;
  margin-left: auto;
  position:absolute;
  right:-30px;
  top:-30px;
  color:white;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
}

.modalscale {
  transform:scale(0);
  opacity:0;
}

.lightbox-container, .lightbox-btn, .lightbox-image-wrapper, .lightbox-enabled{
  transition:all .4s ease-in-out;
}

.lightbox-enabled:hover {
  transform:scale(1.1)
}

.lightbox-enabled {
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  object-fit:cover;
  cursor:pointer;
}

.lightbox-container {
  width:100svw;
  height:100svh;
  position:fixed;
  top:0;
  left:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background-color:rgba(0,0,0,.6);
  z-index:9999;
  opacity:0;
  pointer-events:none;
}

.lightbox-container.active {
  opacity:1;
  pointer-events:all;
}

.lightbox-image-wrapper {
  display:flex;
  transform:scale(0);
  align-items:center;
  justify-content:center;
  max-width:90vw;
  max-height:90vh;
  position:relative;
}

.lightbox-container.active .lightbox-image-wrapper {transform:scale(1);}
.lightbox-btn, .close {
  color:white;
  z-index:9999999;
  cursor:pointer; 
  position:absolute;
  font-size:50px;
}

.lightbox-btn {
	text-shadow: 0 0 30px rgba(0,0,0,.4);
}

.left {left:50px;}
.right {right:50px;}

.close {
  top:50px;
  right:50px;
}

.lightbox-image {
  width:100%;
  max-height:95vh;
  object-fit:cover;
 }

@keyframes slideleft {
  33% {
    transform:translateX(-300px);
    opacity:0;
  }
  
  66% {
    transform:translateX(300px);
    opacity:0;
  }
}


.slideleft {
   animation-name: slideleft;
   animation-duration: .5s; 
   animation-timing-function: ease; 
}

@keyframes slideright {
  33% {
    transform:translateX(300px);
    opacity:0;
  }
  66% {
    transform:translateX(-300px);
    opacity:0;
  }
}


.slideright{
   animation-name: slideright;
   animation-duration: .5s; 
   animation-timing-function: ease; 
}
	

@media(max-width: 1024px) {
  :root {
    --gallery-columns: 3;
  }
  
}

@media(max-width: 768px) {
  :root {
    --gallery-columns: 2;
  }

  .right, .left {
    bottom: 10px;
  }

  .close {
    top: 10px;
    right: 10px;
  }

  .gallery-main .container img {
    left: 0;
  }

  .project-hero-image {
    aspect-ratio: 5 / 3;
  }

  .block-editor-content {
    text-align: initial;
  }
  
}

@media(max-width: 550px) {
  :root {
    --gallery-gap: 10px;
  }
}