---
import { Image } from "astro:assets";
import me from "../assets/me.jpeg";
---

<div class="border border-solid rounded-lg p-6 surface">
  <div class="flex flex-col md:flex-row gap-6 items-center md:items-start">
    <div class="flex-1 space-y-2 text-lg">
      <h1 class="text-5xl font-bold">Hi, I'm Dustin!</h1>
      <p>
        I'm a senior full stack software engineer from Michigan, currently
        working on some cool stuff at Zenimax Online Studios!
      </p>
      <p>
        Lately you can find me out in nature, at cars and coffees taking
        pictures, or at home playing around with my homelab or enjoying some
        video games, shows, or movies!
      </p>
    </div>
    <Image
      class="rounded-full size-40 shrink-0"
      loading="eager"
      src={me}
      alt="Me smiling in my snowboarding jacket on a sunny winter day"
    />
  </div>
</div>