/* Relative layout units throughout: viewport space, fractional columns,
   and font-relative type, insets, and interaction details. */
#projects.home-projects {
  --project-section-space: 16svh;
  padding-block: var(--project-section-space);
  padding-inline: 0;
  scroll-margin-top: 5rem;
  background: var(--bg);
  isolation: isolate;
}
#projects.home-projects .home-project-grid {
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: 1.5vw 2.2vw;
  width: 94%;
  margin-inline: auto;
}
#projects.home-projects .home-project-panel {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: end;
  min-width: 0;
  min-height: max(30rem, 32vw);
  overflow: hidden;
  background: var(--bg);
  color: var(--fg);
  text-decoration: none;
}
#projects.home-projects .home-project-panel--manufacturing { grid-column: 1 / -1; }
#projects.home-projects .home-project-image {
  position: absolute;
  inset: 0;
  z-index: -2;
  overflow: hidden;
}
#projects.home-projects .home-project-media {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .85;
  filter: saturate(.8);
  transition: transform .7s ease, opacity .4s;
}
#projects.home-projects .home-project-panel::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: rgb(0 0 0 / 50%);
}
#projects.home-projects .home-project-copy { position: relative; z-index: 2; width: 100%; padding: max(1.75rem, 3.4vw); }
#projects.home-projects h3 { margin: 0 0 .35em; font: 500 clamp(2.25rem, 3.7vw, 4.75rem)/1.08 var(--font-display); letter-spacing: -.035em; }
#projects.home-projects .home-project-copy > p { max-width: 43ch; margin: 0; color: var(--fg); font: 400 clamp(.875rem, 1.1vw, 1.125rem)/1.65 var(--font-body); }
#projects.home-projects .home-project-link { display: inline-flex; align-items: center; gap: 1.6em; margin-top: 1.75em; font: 500 clamp(.8125rem, .8vw, 1rem)/1.4 var(--font-display); }
#projects.home-projects .home-project-link > span { font-size: 1.65em; transition: transform .25s; }
#projects.home-projects .home-project-panel:hover .home-project-media { transform: scale(1.025); opacity: 1; }
#projects.home-projects .home-project-panel:hover .home-project-link > span { transform: translate(.15em, -.15em); }
#projects.home-projects .home-project-panel:focus-visible { outline: .125em solid var(--fg); outline-offset: -.375em; }
@media (max-width: 56.25em) {
  #projects.home-projects .home-project-grid { width: 100%; grid-template-columns: 1fr; grid-template-rows: none; gap: 1rem; }
  #projects.home-projects .home-project-panel { grid-column: 1; grid-row: auto; min-height: max(32rem, 68svh); }
  #projects.home-projects .home-project-copy { padding: 3rem 6vw; }
  #projects.home-projects h3 { font-size: clamp(2rem, 9.2vw, 3rem); }
  #projects.home-projects .home-project-copy > p { max-width: 38ch; }
  #projects.home-projects .home-project-link { font-size: .8rem; margin-top: 1.75em; gap: 1.6em; }
}
@media (prefers-reduced-motion: reduce) {
  #projects.home-projects .home-project-media, #projects.home-projects .home-project-link > span { transition: none; }
  #projects.home-projects .home-project-panel:hover .home-project-media { transform: none; }
}