.projects-archive-clean{
  background:#000;
}

.projects-filter-bar{
  background:#000;
  border-bottom:1.5px solid #fff;
  border-left:1.5px solid #fff;
  padding:18px 22px; /* reduced */
}

.projects-filter-bar__row{
  display:block;
  max-width:1100px; 
  margin:0 auto; 
}

.projects-filter-bar__left{
  display:grid;
  grid-template-columns:repeat(8, minmax(0, 1fr));
  gap:10px; 
  align-items:stretch;
}

.projects-filter-link{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:38px; 
  padding:8px 10px; 
  border:1px solid #fff; 
  background:transparent;
  color:#fff;
  text-decoration:none;
  text-transform:uppercase;
  font-family:var(--font-sans);
  font-size:.72rem; 
  line-height:1.1;
  letter-spacing:.05em;
  text-align:center;
  transition:background .2s ease, color .2s ease;
  box-sizing:border-box;
}

.projects-filter-link:hover,
.projects-filter-link:focus{
  background:#fff;
  color:#000;
}

.projects-filter-link.is-active{
  background:#fff;
  color:#000;
}

@media (max-width: 1320px){
  .projects-filter-bar__left{
    grid-template-columns:repeat(4, minmax(0, 1fr));
  }
}

.projects-filter-mobile{
  display:none;
}

.projects-filter-mobile__controls{
  display:flex;
  align-items:center;
  gap:8px;
  width:auto;
}

.projects-filter-mobile__group{
  position:relative;
  flex:0 0 auto;
  min-width:160px;
}

.projects-filter-mobile__group::after{
  content:"";
  position:absolute;
  top:50%;
  right:12px;
  width:8px;
  height:8px;
  border-right:1.5px solid #fff;
  border-bottom:1.5px solid #fff;
  transform:translateY(-65%) rotate(45deg);
  pointer-events:none;
}

.projects-filter-mobile__select{
  width:100%;
  height:36px;
  padding:0 30px 0 12px;
  border:1.5px solid #fff;
  border-radius:0;
  background:#000;
  color:#fff;
  font-family:var(--font-sans);
  font-size:.8rem;
  line-height:1;
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
}

.projects-grid-clean{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0;
  border-left:1.5px solid #fff;
}

.project-card-clean{
  position:relative;
  display:block;
  aspect-ratio:8 / 5;
  overflow:hidden;
  border-right:1.5px solid #fff;
  border-bottom:1.5px solid #fff;
  background:#111;
}

.project-card-clean__link{
  display:block;
  width:100%;
  height:100%;
  text-decoration:none;
  color:inherit;
  position:relative;
}

.project-card-clean__media,
.project-card-clean__placeholder{
  width:100%;
  height:100%;
}

.project-card-clean__media img,
.project-card-clean__placeholder{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.project-card-clean__placeholder{
  background:
    linear-gradient(to bottom,rgba(0,0,0,.1),rgba(0,0,0,.45)),
    #222;
}

.project-card-clean__link::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0);
  pointer-events:none;
  transition:background .3s ease;
}

.project-card-clean__title{
  position:absolute;
  left:20px;
  bottom:18px;
  z-index:2;
  margin:0;
  color:#fff;
  font-family:var(--font-serif);
  font-size:clamp(1rem,1.5vw,1.35rem);
  font-weight:400;
  line-height:1.15;
  letter-spacing:.01em;
  text-shadow:0 1px 3px rgba(0,0,0,.45);
  max-width:calc(100% - 40px);
  opacity:1;
  transform:none;
}

/* desktop only */
@media (min-width: 992px){
  .project-card-clean__title{
    opacity:0;
    transform:translateY(10px);
    transition:opacity .3s ease, transform .3s ease;
    pointer-events:none;
  }

  .project-card-clean__link:hover::after,
  .project-card-clean__link:focus::after{
    background:rgba(0,0,0,.68);
  }

  .project-card-clean__link:hover .project-card-clean__title,
  .project-card-clean__link:focus .project-card-clean__title{
    opacity:1;
    transform:translateY(0);
  }
}

.projects-empty-clean{
  min-height:40vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:40px 20px;
  border-left:1.5px solid #fff;
  border-bottom:1.5px solid #fff;
}

.projects-empty-clean p{
  margin:0;
  color:#fff;
  font-family:var(--font-sans);
  font-size:1rem;
  opacity:.8;
}

@media(max-width:991px){

  .projects-archive-clean{
    padding-top:var(--mobile-header-height);
  }

  .projects-filter-bar{
    padding:6px 12px;
    border-left:none;
    border-top:1.5px solid #fff;
    border-bottom:1.5px solid #fff;
  }

  .projects-filter-desktop{
    display:none;
  }

  .projects-filter-mobile{
    display:block;
  }

  .projects-filter-mobile__controls{
    width:auto;
    justify-content:flex-start;
    gap:10px;
  }

  .projects-filter-mobile__select{
    height:30px;
    padding:0 24px 0 6px;
    font-size:.8rem;
    border:none;
    background:#000;
  }

  .projects-filter-mobile__group{
    min-width:130px;
  }

  .projects-grid-clean{
    grid-template-columns:1fr;
    border-left:none;
  }

  .project-card-clean{
    border-left:none;
    border-right:none;
    border-bottom:1.5px solid #fff;
  }

  .project-card-clean__title{
    left:16px;
    bottom:14px;
    max-width:calc(100% - 32px);
  }

  .projects-empty-clean{
    border-left:none;
    border-right:none;
  }

  .project-card-clean__link::after{
    content:"";
    position:absolute;
    top:auto;
    left:0;
    right:0;
    bottom:0;
    height:80px;
    background:linear-gradient(
      to top,
      rgba(0, 0, 0, 0.8) 0%,
      rgba(0, 0, 0, 0.31) 55%,
      rgba(0,0,0,0) 100%
    );
    pointer-events:none;
    z-index:1;
  }

  .project-card-clean__title{
    position:absolute;
    left:16px;
    bottom:14px;
    z-index:2; 
  }

}