---
import Layout from "@/layouts/Layout.astro";
import ScheduleButton from "@/components/ScheduleButton.astro";
import SectionTitle from "@/components/SectionTitle.astro";
import Paragraph from "@/components/Paragraph.astro";
import Em from "@/components/Em.astro";
import { Image } from "astro:assets";

import room from "@/assets/room.jpg";
---

<Layout
  title="J. Hunter DeLoche | Music"
  description="Hunter has been playing music for over 8 years. While he considers the electric guitar and bass as his main instruments, he also has experience singing and playing the drums. Additionally, he is proficient in using Ableton Live and Logic Pro to record, mix, and produce music. He considers Radiohead, The Mars Volta, and Nine Inch Nails to be his greatest musical inspirations."
>
  <div class="flex flex-col gap-10 md:flex-row items-center justify-around">
    <div class="basis-1/2">
      <SectionTitle>Music Production</SectionTitle>
      <Paragraph>
        <Em>Hunter</Em> has been playing music for over 8 years. While he considers
        the electric guitar and bass as his main instruments, he also has experience
        singing and playing the drums. Additionally, he is proficient in using Ableton
        Live and Logic Pro to record, mix, and produce music. He considers Radiohead,
        The Mars Volta, and Nine Inch Nails to be his greatest musical inspirations.
      </Paragraph>
      <Paragraph>
        Hunter is passionate about ever step of the music creation process. When
        creating a peice of music, he has a focus on the balance and tone of
        each instrument and sound. Often, he invents story concepts that drive
        his musical compositions. In his album <Em>Event Horizon,</Em> the music
        told the story of Atlas Corpus, a fictitious character in a mental institution.
        He finds the arrangement of the sound and story to create a whole greater
        than the sum of its parts to be the most rewarding aspect of composition.
      </Paragraph>
    </div>
    <div class="basis-5/12">
      <Image
        class="rounded-md w-full border-accent border-[1px] drop-shadow-accent"
        src={room}
        alt="Hunter standing in his room with guitar."
      />
    </div>
  </div>
  <!-- <ScheduleButton event_path="1-hour-music-lesson" -->
  <!--   >Schedule a music lesson with Hunter</ScheduleButton -->
  <!-- > -->
</Layout>