/* Projects landing only. Ordinary Project pages retain their independent UI. */
.projects-landing-page {overflow-x:clip}
.projects-landing {
  width:min(112rem,calc(100% - 2*clamp(.65rem,2vw,2rem)));
  margin-inline:auto;
  padding:clamp(1.2rem,2.6vw,3rem) 0 clamp(3rem,7vw,7rem);
}
.projects-landing-heading {
  display:flex;
  flex-wrap:wrap;
  gap:.5rem 1.5rem;
  justify-content:space-between;
  align-items:end;
  margin:0 0 clamp(.7rem,1.7vw,1.5rem);
}
.projects-landing-heading h1 {
  margin:0;
  color:var(--bone,#f6f0ee);
  font:400 clamp(4.1rem,9.6vw,9rem)/.75 "Bebas Neue",sans-serif;
  letter-spacing:.01em;
  text-transform:uppercase;
}
.projects-landing-count {
  padding:.2rem 0;
  color:var(--bone,#f6f0ee);
  opacity:.72;
  font:400 clamp(.87rem,1.1vw,1.1rem)/1.3 "Cormorant Garamond",serif;
}
.projects-landing-mosaic {
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  grid-auto-rows:clamp(66px,7.1vw,128px);
  grid-auto-flow:row dense;
  gap:clamp(5px,.75vw,13px);
}
.projects-landing-tile {
  grid-column:span 4;
  grid-row:span 3;
  min-width:0;
  min-height:0;
  overflow:hidden;
  isolation:isolate;
  background:var(--panel,#1f1820);
}
.projects-landing-tile:nth-child(8n + 1) {grid-column:span 7;grid-row:span 4}
.projects-landing-tile:nth-child(8n + 2),
.projects-landing-tile:nth-child(8n + 3) {grid-column:span 5;grid-row:span 2}
.projects-landing-tile:nth-child(8n + 7),
.projects-landing-tile:nth-child(8n + 8) {grid-column:span 6;grid-row:span 3}
.projects-landing-link {
  position:relative;
  display:block;
  width:100%;
  height:100%;
  min-height:0;
  color:white;
  background:#17121c;
  text-decoration:none;
  outline-offset:-5px;
}
.projects-landing-art {
  position:absolute;
  inset:0;
  display:block;
  overflow:hidden;
  background:#17121c;
}
.projects-landing-art img {
  display:block;
  width:100%;
  height:100%;
  object-fit:var(--crop-fit, cover);
  object-position:var(--crop-x,50%) var(--crop-y,50%);
  transform:scale(var(--crop-zoom,1));
  transform-origin:var(--crop-x,50%) var(--crop-y,50%);
  filter:brightness(.81) saturate(.98);
  transition:filter .3s ease;
}
.projects-landing-art--empty {
  background:
    radial-gradient(ellipse at 65% 28%,color-mix(in srgb,var(--violet,#6f6897) 45%,transparent),transparent 70%),
    linear-gradient(135deg,var(--panel,#1b141f),var(--black,#090709));
}
.projects-landing-link::after {
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  background:linear-gradient(180deg,transparent 18%,rgba(0,0,0,.09) 40%,rgba(0,0,0,.79) 100%);
  pointer-events:none;
  transition:background .3s ease;
}
.projects-landing-info {
  position:absolute;
  z-index:2;
  bottom:0;
  left:0;
  width:100%;
  padding:clamp(1.05rem,2.35vw,2.75rem);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:clamp(.35rem,.55vw,.65rem);
  pointer-events:none;
  min-width:0;
}
.projects-landing-title {
  display:block;
  max-width:100%;
  font:400 clamp(2.5rem,4.15vw,5.8rem)/.89 "Bebas Neue",sans-serif;
  letter-spacing:.015em;
  color:#fff;
  text-shadow:0 3px 25px rgba(0,0,0,.65);
  overflow-wrap:anywhere;
  text-wrap:balance;
}
.projects-landing-tile:nth-child(8n + 2) .projects-landing-title,
.projects-landing-tile:nth-child(8n + 3) .projects-landing-title {
  font-size:clamp(2rem,3vw,4rem);
}
.projects-landing-meta {
  display:block;
  color:#f1e9f0;
  font:500 clamp(.78rem,.92vw,.98rem)/1.35 "Cormorant Garamond",serif;
  letter-spacing:.025em;
  opacity:.9;
}
.projects-landing-link:hover .projects-landing-art img,
.projects-landing-link:focus-visible .projects-landing-art img {filter:brightness(.45) saturate(.9)}
.projects-landing-link:hover::after,
.projects-landing-link:focus-visible::after {
  background:linear-gradient(180deg,rgba(0,0,0,.1) 0%,rgba(0,0,0,.16) 36%,rgba(0,0,0,.86) 100%);
}
.projects-landing-link:hover .projects-landing-title,
.projects-landing-link:focus-visible .projects-landing-title {text-shadow:0 3px 18px rgba(0,0,0,.9)}
.projects-landing-link:focus-visible {outline:3px solid var(--peach,#ffbe99);outline-offset:-4px}
.projects-landing-empty {
  border:1px dashed var(--line,#58515d);
  padding:clamp(2rem,5vw,5rem);
  text-align:center;
  color:var(--bone,#efe9e8);
}
@media(max-width:1050px) {
  .projects-landing-mosaic {grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:clamp(80px,10vw,130px)}
  .projects-landing-tile,
  .projects-landing-tile:nth-child(n) {grid-column:span 3;grid-row:span 3}
  .projects-landing-tile:nth-child(6n + 1) {grid-column:span 6;grid-row:span 4}
  .projects-landing-tile:nth-child(6n + 4) {grid-column:span 3;grid-row:span 4}
  .projects-landing-title,
  .projects-landing-tile:nth-child(n) .projects-landing-title {font-size:clamp(2.2rem,5vw,4.5rem)}
}
@media(max-width:640px) {
  .projects-landing {width:calc(100% - 1rem);padding-top:1.3rem}
  .projects-landing-heading {padding:.2rem .35rem}
  .projects-landing-heading h1 {font-size:clamp(3.7rem,14vw,6rem)}
  .projects-landing-mosaic {grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:clamp(78px,24vw,135px);gap:6px}
  .projects-landing-tile:nth-child(n) {grid-column:span 2;grid-row:span 3}
  .projects-landing-tile:nth-child(5n + 1) {grid-row:span 4}
  .projects-landing-info {padding:clamp(1rem,5vw,1.8rem)}
  .projects-landing-title,.projects-landing-tile:nth-child(n) .projects-landing-title {font-size:clamp(2.8rem,11vw,5rem)}
  .projects-landing-meta {font-size:.93rem}
}
@media(prefers-reduced-motion:reduce) {
  .projects-landing-art img,.projects-landing-link::after {transition:none}
}
