---
import SectionCard from "../components/SectionCard.astro";
import LocaleCopy from "../components/LocaleCopy.astro";
import {
  aiLabCapabilities,
  aiLabSources,
  collageImages,
  ventureDesk,
  ventureSignals,
} from "../data/profile";
import {
  editorialPromises,
  getSectionHref,
  hero,
  launchSections,
  schoolDossiers,
} from "../data/site";
import BaseLayout from "../layouts/BaseLayout.astro";

const education = launchSections.find((section) => section.slug === "education");
const writing = launchSections.find((section) => section.slug === "writing");
const jazzMusic = launchSections.find((section) => section.slug === "jazz-music");
const languages = launchSections.find((section) => section.slug === "languages");
const norway = launchSections.find((section) => section.slug === "norway");
const projects = launchSections.find((section) => section.slug === "projects");
---

<BaseLayout
  title="Dave Gilligan | Hybrid IT, AI, Jazz, and Literary Magazine"
  description="A hybrid hi-tech and retro editorial homepage for Dave Gilligan, weaving AI systems, jazz, writing, languages, advocacy, and lived geography into a magazine-like personal site."
>
  <main class="page-shell page-shell--cover">
    <section class="cover-hero">
      <div class="container cover-hero__inner">
        <article class="cover-hero__copy">
          <span class="eyebrow eyebrow--cover"><LocaleCopy copy={hero.kicker} /></span>
          <p class="cover-hero__brand">davegilligan.com</p>
          <h1><LocaleCopy copy={hero.title} /></h1>
          <p class="cover-hero__lede"><LocaleCopy copy={hero.lede} /></p>
          <p class="cover-hero__sublede"><LocaleCopy copy={hero.sublede} /></p>

          <div class="cover-hero__actions">
            <a class="button button--dark" href="#venture-desk">Enter the front page</a>
            <a class="button button--soft" href="/ai-lab">Read the machine-room issue</a>
          </div>

          <div class="cover-hero__billboard">
            <div>
              <span>Writing desk</span>
              {writing && <strong><LocaleCopy copy={writing.coverline} /></strong>}
              {writing && <p><LocaleCopy copy={writing.strap} /></p>}
            </div>
            <div>
              <span>Jazz desk</span>
              {jazzMusic && <strong><LocaleCopy copy={jazzMusic.coverline} /></strong>}
              {jazzMusic && <p><LocaleCopy copy={jazzMusic.strap} /></p>}
            </div>
          </div>
        </article>

        <aside class="cover-hero__visual">
          <div class="cover-collage">
            {collageImages.map((image, index) => (
              <figure class={`cover-collage__frame cover-collage__frame--${index + 1}`}>
                <img src={image.src} alt={image.alt} loading="lazy" />
                <figcaption><LocaleCopy copy={image.caption} /></figcaption>
              </figure>
            ))}
          </div>

        </aside>
      </div>
    </section>

    <section id="venture-desk" class="container venture-desk">
      <div class="venture-desk__grid">
        {ventureDesk.map((venture) => (
          <article class="panel venture-story">
            <div class="venture-story__meta">
              <span>{venture.years}</span>
              <span>{venture.role}</span>
              <span>{venture.location}</span>
            </div>
            <p class="venture-story__label">{venture.label}</p>
            <h2>{venture.name}</h2>
            <p class="venture-story__summary"><LocaleCopy copy={venture.summary} /></p>
            <p class="venture-story__detail"><LocaleCopy copy={venture.detail} /></p>
            <ul>
              {venture.highlights.en.map((_, i) => (
                <li><LocaleCopy copy={{ en: venture.highlights.en[i], fr: venture.highlights.fr[i], nb: venture.highlights.nb[i] }} /></li>
              ))}
            </ul>
            <p class="venture-story__source">
              Source:
              <a href={venture.source.url} target="_blank" rel="noreferrer">{venture.source.label}</a>
            </p>
          </article>
        ))}
      </div>

      <div class="signal-deck">
        {ventureSignals.map((signal) => (
          <a
            class="signal-deck__card"
            href={signal.href}
            target={signal.external ? "_blank" : undefined}
            rel={signal.external ? "noreferrer" : undefined}
          >
            <img src={signal.imageSrc} alt={signal.imageAlt} loading="lazy" />
            <span><LocaleCopy copy={signal.strap} /></span>
            <strong>{signal.name}</strong>
            <p><LocaleCopy copy={signal.summary} /></p>
            <small>{signal.imageNote}</small>
          </a>
        ))}
      </div>
    </section>

    <section class="container ai-observatory">
      <article class="panel ai-observatory__lead">
        <div class="capsule__kicker">
          <span>AI Lab cover package</span>
          <span>Credited to Blue Note Logic Inc</span>
        </div>
        <p class="ai-observatory__eyebrow">Special report / useful futures</p>
        <h2>Private AI, cited answers, and machine intelligence with a memory.</h2>
        <p>
          The AI Lab issue is where the machinery stops posing and starts working: private corpora,
          document intelligence, multilingual controls, and deployment paths that stay close to the
          evidence instead of wandering off into vendor theatre.
        </p>
        <div class="ai-observatory__actions">
          <a class="button button--dark" href="/ai-lab">Enter the AI Lab</a>
          <a class="button button--soft" href="/projects">See the April builds</a>
        </div>
      </article>

      <div class="ai-observatory__list">
        {aiLabCapabilities.map((capability) => (
          <article>
            <span><LocaleCopy copy={capability.title} /></span>
            <p><LocaleCopy copy={capability.summary} /></p>
          </article>
        ))}
      </div>
    </section>

    <section class="container section-marquee section-marquee--cover">
      <div class="section-marquee__row section-marquee__row--cover">
        {[languages, norway, projects].filter(Boolean).map((section) => (
          <a href={getSectionHref(section!)}>
            <span>{section!.title}</span>
            <strong><LocaleCopy copy={section!.strap} /></strong>
          </a>
        ))}
      </div>
    </section>

    <section class="container launch-ledger">
      <div class="section-header section-header--tight">
        <div class="section-header__title">Elsewhere In The Paper</div>
        <div class="section-header__meta">
          Every desk has its own rhythm, but the page keeps them under one masthead: less menu,
          more newsroom, with clippings, notebooks, civic files, and machine-room traces in plain
          sight.
        </div>
      </div>

      <div class="section-grid">
        {launchSections.map((section) => (
          <SectionCard
            slug={section.slug}
            label={section.label}
            title={section.title}
            summary={section.summary}
            tone={section.tone}
            href={getSectionHref(section)}
          />
        ))}
      </div>
    </section>

    <section id="schools" class="container cover-feature">
      <article class="panel cover-feature__lead">
        <div class="capsule__kicker">
          <span>Education dossier</span>
          <span>{education?.label}</span>
        </div>
        {education && <h2><LocaleCopy copy={education.coverline} /></h2>}
        {education && <p><LocaleCopy copy={education.summary} /></p>}
        <ul>
          {education && education.samples.en.map((_, i) => (
            <li><LocaleCopy copy={{ en: education.samples.en[i], fr: education.samples.fr[i], nb: education.samples.nb[i] }} /></li>
          ))}
        </ul>
        <a class="button button--dark" href="/education">Read the school issue</a>
      </article>

      <div class="cover-feature__schools">
        {schoolDossiers.map((school) => (
          <article class="school-card school-card--cover">
            <img src={school.logo} alt={school.institution} loading="lazy" />
            <div>
              <div class="school-card__meta">
                <span>{school.years}</span>
                <span>{school.city}</span>
              </div>
              <h3>{school.institution}</h3>
              <p><strong>{school.program}</strong></p>
              <p><LocaleCopy copy={school.teaser} /></p>
            </div>
          </article>
        ))}
      </div>
    </section>

    <section class="container manifesto">
      <div class="section-header section-header--tight">
        <div class="section-header__title">Editorial Promises</div>
        <div class="section-header__meta">
          The magazine stays bright, image-aware, technically serious, and unapologetically
          literary.
        </div>
      </div>

      <div class="manifesto-grid">
        {editorialPromises.en.map((_, i) => (
          <article class="manifesto-card">
            <span>Promise {i + 1}</span>
            <p><LocaleCopy copy={{ en: editorialPromises.en[i], fr: editorialPromises.fr[i], nb: editorialPromises.nb[i] }} /></p>
          </article>
        ))}
      </div>
    </section>

    <section class="container source-block source-block--compact">
      <div class="section-header section-header--tight">
        <div class="section-header__title">Homepage Credits</div>
        <div class="section-header__meta">
          Venture descriptions are paraphrased from official sites. Image credits for school
          photography live in the education issue, where the full dossier notes already appear.
        </div>
      </div>

      <div class="source-list">
        {aiLabSources.map((source) => (
          <article>
            <a href={source.url} target="_blank" rel="noreferrer">{source.label}</a>
            <p>{source.note}</p>
          </article>
        ))}
      </div>
    </section>

  </main>
</BaseLayout>
