.showcase-all{justify-self:end}.showcase-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,3vw,40px) clamp(20px,2.4vw,32px);margin:0;padding:0;list-style:none;display:grid}.showcase-card{align-content:start;gap:22px;min-width:0;display:grid}.showcase-shot{aspect-ratio:16/10;border:1px solid var(--ink-line);background:#ece6da;border-radius:18px;transition:transform .3s;display:block;position:relative}.showcase-shot:hover{transform:translateY(-3px)}.showcase-shot .shot-desktop{object-fit:cover;object-position:top;border-radius:17px;width:100%;height:100%;display:block}.showcase-shot .shot-mobile{aspect-ratio:390/844;object-fit:cover;object-position:top;border:3px solid var(--ink);background:var(--light);border-radius:12px;width:21%;height:auto;position:absolute;bottom:-10%;right:5%;box-shadow:0 12px 30px #1a1a1640}.shot-empty{height:100%;color:var(--ink-2);font:400 13px var(--font-mono-stack);place-items:center;display:grid}.showcase-body{gap:8px;padding-right:24%;display:grid}.showcase-body h3{font-size:clamp(22px,2vw,26px);font-weight:500}.showcase-body h3 a{text-decoration:none}.showcase-body p{color:var(--ink-2);font-size:15px;line-height:1.5}.showcase-meta{font:400 13px var(--font-mono-stack);align-items:center;gap:12px;display:flex}.showcase-meta .swatches{display:inline-flex}.showcase-meta .swatches i{border:1px solid #1a1a1633;border-radius:50%;width:14px;height:14px;margin-right:-4px}.showcase-actions{flex-wrap:wrap;gap:8px 20px;margin-top:6px;display:flex}.showcase-actions .text-link{font-size:15px}.design-facts{background:var(--ink-line);border:1px solid var(--ink-line);border-radius:20px;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin-top:clamp(48px,6vw,80px);padding:0;list-style:none;display:grid;overflow:hidden}.design-facts li{background:var(--light);align-content:start;gap:6px;padding:24px;display:grid}.design-facts strong{font-size:19px;font-weight:500}.design-facts span{color:var(--ink-2);font-size:15px;line-height:1.5}@media (max-width:1100px){.showcase-grid,.design-facts{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:760px){.showcase-all{justify-self:start}.showcase-grid,.design-facts{grid-template-columns:minmax(0,1fr)}.showcase-body{padding-right:0}.showcase-card{gap:30px}}
