/* The software showcase shares the site's editorial type and dark gallery palette. */
.software-showcase { display: grid; gap: clamp(64px, 7vw, 100px); padding-top: 32px; }
.software-project { --project-glow: #839fc32b; display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(240px, 1fr); align-items: center; gap: clamp(30px, 5vw, 72px); }
.software-thespia { --project-glow: #a1677629; }
.software-vesikaa { --project-glow: #b59ae52b; }
.software-slate { --project-glow: #9182ff24; }
.software-kingdom { --project-glow: #a49b6124; }
.software-project .project-figure { min-width: 0; }
.software-preview { position: relative; display: block; border: 1px solid #d4e2ee30; border-radius: 5px; background: #14161c; overflow: hidden; box-shadow: 0 18px 50px #0006, 0 0 65px var(--project-glow); transition: transform .65s cubic-bezier(.2,.65,.25,1), border-color .65s, box-shadow .65s; }
.software-preview img { display: block; width: 100%; height: auto; }
.software-preview:focus-visible { outline: 2px solid var(--accent); outline-offset: 7px; }
.software-preview:is(:hover, :focus-visible) { border-color: #d4e2ee80; box-shadow: 0 24px 60px #0009, 0 0 80px var(--project-glow); }
.software-project figcaption { display: flex; justify-content: space-between; gap: 16px; padding-top: 14px; font-size: 9px; line-height: 1.6; color: var(--muted); }
.software-project figcaption span:last-child { white-space: nowrap; }
.software-project .project-body { padding: 0 0 26px; }
.software-status { display: inline-flex; align-items: center; gap: 8px; font-size: 9px; line-height: 1.5; letter-spacing: .13em; text-transform: uppercase; color: var(--muted); }
.software-status::before { content: ""; width: 5px; height: 5px; border: 1px solid currentColor; border-radius: 50%; }
.software-status.is-live { color: #aecdbd; }
.software-status.is-live::before { background: currentColor; }
.software-project .project-title { font-size: clamp(26px, 2.8vw, 38px); letter-spacing: -1.2px; gap: 13px; margin: 25px 0 22px; }
.software-project .software-lead { font-size: clamp(18px, 1.6vw, 22px); line-height: 1.4; letter-spacing: -.35px; color: var(--ink); margin-bottom: 12px; }
.software-project .project-body > p:not(.software-lead) { font-size: 13px; line-height: 1.85; max-width: 360px; }
.software-visit { display: inline-flex; align-items: center; justify-content: space-between; gap: 45px; min-height: 44px; margin-top: 21px; }
.software-detail { display: block; font-size: 10px; letter-spacing: .03em; color: var(--muted); margin-top: 28px; }
@media (hover: hover) and (pointer: fine) {
  .software-preview:hover { transform: translateY(-3px); }
}
@media (max-width: 1000px) {
  .software-project { grid-template-columns: minmax(0, 1.4fr) minmax(220px, 1fr); gap: 30px; }
  .software-project .project-title { font-size: 28px; }
}
@media (max-width: 700px) {
  .software-showcase { padding-top: 12px; gap: 64px; }
  .software-project { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .software-project .project-body { padding: 0; }
  .software-project .project-title { margin: 17px 0; font-size: 30px; }
  .software-project .project-body > p:not(.software-lead) { max-width: none; }
}
@media (prefers-reduced-motion: reduce) {
  .software-preview { transition: none; }
  .software-preview:hover { transform: none; }
}