/* Four robot forms illustrate the closing statement in 04. */
.v3-content .hardware-showcase{
  margin:40px 0 0;background:#e7e7e7;color:#181818;overflow:hidden;
}
.hardware-lineup{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  margin:0;padding:0;gap:0;isolation:isolate;
}
.hardware-lineup figure{margin:0;overflow:hidden;min-width:0;aspect-ratio:4/5}
.hardware-lineup img{
  display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%;
  mix-blend-mode:multiply;filter:grayscale(1);transform:scale(1);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%),linear-gradient(180deg,transparent 0,#000 14%,#000 88%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%),linear-gradient(180deg,transparent 0,#000 14%,#000 88%,transparent 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
  transition:transform .7s cubic-bezier(.2,.7,.2,1);
}
.hardware-lineup figure:last-child img{object-position:65% center}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .hardware-lineup figure:hover img{transform:scale(1.035)}
}
#skills .hardware-heading{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);
  gap:36px 8%;align-items:start;margin:0 0 28px;
}
#skills .hardware-heading h4{margin:0;font-size:24px;line-height:1.45;font-weight:500;color:inherit}
#skills .hardware-heading p{margin:0;font-size:18px;line-height:1.7;color:inherit;opacity:.75;text-wrap:balance}
@media(max-width:600px){
  .v3-content .hardware-showcase{margin-top:28px}
  #skills .hardware-heading{grid-template-columns:1fr;gap:12px;margin-bottom:22px}
  #skills .hardware-heading h4{font-size:22px}
  #skills .hardware-heading p{font-size:16px}
  .hardware-lineup{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hardware-lineup figure{aspect-ratio:4/5}
}

@font-face{font-family:"Xrogo Hardware SC";src:url("fonts/NotoSansSC-Hardware.woff2") format("woff2");font-weight:100 900;font-display:swap}
html:lang(zh-CN) .hardware-heading{font-family:Inter,"Xrogo Hardware SC",sans-serif}
