/* Compact, equal-sided retro bezel for project media. No cabinet artwork. */
body.human-interface-v2.detail-page-active #page-detail .retro-detail-hero > .retro-detail-visual.retro-device-frame {
  --bezel: clamp(14px, 1.7vw, 25px);
  box-sizing: border-box;
  aspect-ratio: auto;
  padding: var(--bezel);
  border: 1px solid #d2cbbb;
  border-radius: 22px;
  background: linear-gradient(135deg, #f4efe4 0%, #e8e1d4 52%, #d8d0c1 100%);
  box-shadow: inset 2px 3px 3px #fffaf0, inset -2px -3px 4px #bdb5a5, 0 8px 18px rgba(60,48,31,.10);
  filter: none;
}
body.human-interface-v2.detail-page-active #page-detail .retro-detail-hero > .retro-device-frame::before,
body.human-interface-v2.detail-page-active #page-detail .retro-detail-hero > .retro-device-frame::after { display:none; }
body.human-interface-v2.detail-page-active #page-detail .retro-detail-hero > .retro-device-frame > img,
body.human-interface-v2.detail-page-active #page-detail .retro-detail-hero > .retro-device-frame > .gac-hero-carousel {
  position: relative;
  inset: auto;
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  border: 3px solid #34332d;
  border-radius: 10px;
  box-shadow: 0 0 0 3px #b5ad9d, 0 -3px 6px rgba(43,36,25,.25);
  object-fit: contain;
}
@media(max-width:600px) {
  body.human-interface-v2.detail-page-active #page-detail .retro-detail-hero > .retro-detail-visual.retro-device-frame { --bezel:12px; border-radius:15px; margin-top:26px; }
  body.human-interface-v2.detail-page-active #page-detail .retro-detail-hero > .retro-device-frame > img,
  body.human-interface-v2.detail-page-active #page-detail .retro-detail-hero > .retro-device-frame > .gac-hero-carousel { border-width:2px; border-radius:6px; }
}
/* Let visual sections grow on large monitors; preserve normal/mobile layout. */
@media(min-width:1440px) {
  body.human-interface-v2 #page-home > .container,
  body.human-interface-v2 #page-home .hero > .container,
  body.human-interface-v2 #page-home > section > .container {
    width: min(1640px, calc(100% - 160px));
    max-width: none;
  }
  body.human-interface-v2 #page-home .hero-inner {
    width: 100%;
    max-width: none;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: clamp(56px, 5vw, 100px);
    padding-inline: clamp(20px, 3vw, 64px);
  }
  body.human-interface-v2 #page-home .hero-greeting { font-size:clamp(4rem,4.2vw,5.4rem); }
  body.human-interface-v2 #page-home .hero-person-name { font-size:clamp(6rem,6.8vw,8.8rem); }
  body.human-interface-v2 #page-home .hero-intro-list { font-size:clamp(1rem,1vw,1.22rem); }
}

/* Shared card layout: copy determines height, irrespective of selected project. */
body.human-interface-v2 #page-home .home-featured-grid {
  height: auto;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  grid-template-rows: repeat(2, minmax(280px, auto));
  gap: 20px;
}
body.human-interface-v2 #page-home .home-featured-grid .project-card .project-name,
body.human-interface-v2 #page-home .home-featured-grid .project-card .project-desc {
  display: block;
  overflow: visible;
  max-height: none;
  -webkit-line-clamp: unset;
}
body.human-interface-v2 #page-home .home-featured-grid .project-card:first-child .project-info {
  position: relative;
  inset: auto;
  min-height: 100%;
  box-sizing: border-box;
}
body.human-interface-v2 #page-home .home-featured-grid .project-card:nth-child(n+2) {
  grid-template-columns: minmax(0, .42fr) minmax(0, .58fr);
  align-items: stretch;
}
body.human-interface-v2 #page-home .home-featured-grid .project-card:nth-child(n+2) .project-media {
  position: relative;
  min-height: 0;
}
body.human-interface-v2 #page-home .home-featured-grid .project-card:nth-child(n+2) .project-img {
  position: absolute;
  inset: 0;
}
body.human-interface-v2 #page-home .home-featured-grid .project-card:nth-child(n+2) .project-info {
  height: auto;
  padding: 24px;
}
body.human-interface-v2 #page-home .home-featured-grid .project-card:nth-child(n+2) .project-name {
  font-size: clamp(1.15rem, 1.35vw, 1.45rem);
  line-height: 1.35;
}
body.human-interface-v2 #page-home .home-featured-grid .project-card:nth-child(n+2) .project-desc {
  margin-top: 12px;
  font-size: .875rem;
  line-height: 1.7;
}
body.human-interface-v2 #page-home .home-featured-grid .project-card:nth-child(n+2) .project-arrow {
  position: static;
  align-self: flex-end;
  flex: 0 0 30px;
  margin: 16px 0 0;
}
@media (max-width: 1100px) {
  body.human-interface-v2 #page-home .home-featured-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
  }
  body.human-interface-v2 #page-home .home-featured-grid .project-card:first-child {
    grid-row: auto;
    height: auto;
  }
  body.human-interface-v2 #page-home .home-featured-grid .project-card:first-child .project-info {
    min-height: 520px;
  }
}
@media (max-width: 640px) {
  body.human-interface-v2 #page-home .home-featured-grid .project-card:nth-child(n+2) {
    grid-template-columns: minmax(0, 1fr);
  }
  body.human-interface-v2 #page-home .home-featured-grid .project-card:nth-child(n+2) .project-media {
    height: auto;
    aspect-ratio: 16 / 10;
  }
  body.human-interface-v2 #page-home .home-featured-grid .project-card:nth-child(n+2) .project-info {
    padding: 24px;
    border-left: 0;
    border-top: 1px solid var(--line);
  }
  body.human-interface-v2 #page-home .home-featured-grid .project-card:nth-child(n+2) .project-name {
    font-size: 1.35rem;
  }
}

/* Archive cards use the same complete introduction as the hero and homepage. */
body.human-interface-v2 #page-projects #featuredProjects .project-name,
body.human-interface-v2 #page-projects #featuredProjects .project-desc {
  display: block;
  overflow: visible;
  max-height: none;
  -webkit-line-clamp: unset;
}