/* Sol Genesys brand, matched to the roadmap deck */
:root {
  --navy: #13202b;
  --paper: #f4f1ea;
  --orange: #e58a3c;
  --blue: #2c6e99;
  --muted: #55606b;
  --display: "Space Grotesk", system-ui, sans-serif;
  --body: "IBM Plex Sans", system-ui, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--navy); font: 1rem/1.55 var(--body); }
a { color: var(--blue); }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
.intro { padding: 5rem 1.5rem 3rem; max-width: 60rem; margin: 0 auto; }
.intro h1 { font: 700 clamp(2.2rem, 6vw, 4rem)/1.05 var(--display); margin: 0 0 1rem; max-width: 18ch; }
.maker { font: 500 1rem var(--display); margin: 0 0 2rem; }
.maker a { color: var(--orange); text-decoration: none; }
main { max-width: 60rem; margin: 0 auto; padding: 0 1.5rem 5rem; }
.grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 3rem 2rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 24rem), 1fr)); }
.work a { text-decoration: none; color: inherit; }
.work img { width: 100%; height: auto; border: 1px solid #d9d4c7; }
.work h2 { font: 700 1.4rem/1.2 var(--display); margin: 1rem 0 0.25rem; }
.work a:hover h2 { color: var(--blue); }
.industry { color: var(--muted); margin: 0; }
.empty { color: var(--muted); }