/* The home page's projects: a compact grid of cards under the profile. */
.home-projects { margin-top: 0.75rem; text-align: left; }
.front-group { margin-top: 1rem; }
.front-group:first-child { margin-top: 0; }
.front-group h2 { margin: 0 0 .4rem .2rem; font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.front-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.front-card { display: grid; gap: .1rem; padding: .55rem .7rem; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); color: var(--text); text-decoration: none; box-shadow: 0 10px 22px -14px rgba(0, 0, 0, 0.45), 0 1px 3px rgba(0, 0, 0, 0.12); }
.front-card:hover, .front-card:focus-visible { border-color: var(--accent); }
.front-card:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.front-card strong { font-size: .95rem; }
.front-card small, .front-card span { color: var(--muted); font-size: .78rem; line-height: 1.3; }
.front-card span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* A group with one project gives it the full width, so its description has room. */
.front-grid:has(> .front-card:only-child) { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 560px) {
  .front-grid:not(:has(> .front-card:only-child)) .front-card span { display: none; }
}