.v63-website-grid { align-items:start; }
.v63-project-visual { min-height:clamp(310px,34vw,500px); background:var(--v61-ink); }
.v62-project[data-layout='large'] .v63-project-visual { min-height:clamp(340px,44vw,610px); }
.v62-project[data-layout='tall'] .v63-project-visual { min-height:clamp(340px,44vw,610px); }
.v63-project-visual .v63-desktop-shot { object-position:top center; filter:saturate(.92) contrast(1.03); }
.v63-project-visual .v63-mobile-shot { z-index:2; top:auto; right:clamp(.9rem,3vw,2.5rem); bottom:clamp(.9rem,3vw,2.5rem); left:auto; width:clamp(74px,17%,142px); height:auto; max-height:76%; object-fit:cover; object-position:top; border:4px solid #f5f0e9; border-radius:1.1rem; box-shadow:0 1rem 2.5rem rgba(0,0,0,.38); }
.v62-project--website-thamesford .v62-project-visual { background:#23111d; }
.v62-project--website-rails .v62-project-visual { background:#201713; }
.v62-project--website-thamesford .v62-project-wash,.v62-project--website-rails .v62-project-wash { background:linear-gradient(118deg,rgba(var(--v61-pink-rgb),.23),rgba(var(--v61-pink-rgb),.04) 54%,transparent); }
.v62-project--website-rails .v62-project-wash { background:linear-gradient(118deg,rgba(var(--v61-pink-rgb),.16),rgba(var(--v61-ink-rgb),.04) 58%,transparent); }
.v62-project:hover .v63-mobile-shot,.v62-project:focus .v63-mobile-shot { transform:translate3d(-.35rem,-.35rem,0) rotate(-1.5deg) scale(1.04); }
.v63-archive-head { display:grid; grid-template-columns:1fr .78fr; gap:2rem; align-items:end; margin:clamp(5rem,11vw,10rem) 0 clamp(2.5rem,6vw,5rem); padding-top:clamp(3rem,7vw,6rem); border-top:1px solid rgba(var(--v61-ink-rgb),.18); }
.v63-archive-head h2 { max-width:13ch; margin:0; }
.v63-archive-head p { max-width:33rem; margin:0; color:var(--v61-muted); font-size:1rem; }
.v63-archive-grid .v62-project { grid-column:span 6; }
@media (max-width:900px) { .v62-project[data-layout='large'] .v63-project-visual,.v62-project[data-layout='tall'] .v63-project-visual { min-height:clamp(300px,58vw,500px); } }
@media (max-width:780px) { .v63-project-visual,.v62-project[data-layout='large'] .v63-project-visual,.v62-project[data-layout='tall'] .v63-project-visual { min-height:clamp(250px,76vw,370px); } .v63-project-visual .v63-mobile-shot { width:clamp(68px,23%,104px); border-width:3px; border-radius:.8rem; } .v63-archive-head { grid-template-columns:1fr; margin-top:4.5rem; } .v63-archive-grid .v62-project { grid-column:auto; } }





.v63-project-visual {
  min-height: 0;
  aspect-ratio: var(--v64-desktop-aspect, 16 / 10);
}

.v62-project[data-layout='large'] .v63-project-visual,
.v62-project[data-layout='tall'] .v63-project-visual {
  min-height: 0;
}

.v63-project-visual .v63-desktop-shot {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}


.v64-mobile-frame {
  position: absolute;
  z-index: 2;
  top: auto;
  right: clamp(1rem, 4.4vw, 4.5rem);
  bottom: clamp(0.85rem, 3vw, 2.5rem);
  left: auto;
  width: clamp(74px, 17%, 142px);
  aspect-ratio: 390 / 844;
  overflow: hidden;
  border-radius: 0.7rem;
  box-shadow: 0 18px 30px rgba(27, 49, 56, 0.24);
}

.v64-mobile-frame::after {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 4px #f5eee3;
  content: '';
  pointer-events: none;
}

.v64-mobile-frame .v63-mobile-shot {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: cover;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

@media (max-width: 780px) {
  .v64-mobile-frame {
    right: clamp(0.75rem, 4.4vw, 1.25rem);
    bottom: clamp(0.65rem, 3vw, 1rem);
    width: clamp(68px, 23%, 104px);
  }
}

@media (max-width: 900px) {
  .v62-project[data-layout='large'] .v63-project-visual,
  .v62-project[data-layout='tall'] .v63-project-visual {
    min-height: 0;
  }
}

@media (max-width: 780px) {
  .v63-project-visual,
  .v62-project[data-layout='large'] .v63-project-visual,
  .v62-project[data-layout='tall'] .v63-project-visual {
    min-height: 0;
  }
}