---
import Layout from "../layouts/Layout.astro";
---

<Layout title="会社概要 - 202510新建ウェブプロジェクト株式会社">
  <!-- Hero セクション -->
  <section
    class="relative bg-linear-to-br from-blue-600 to-blue-400 text-white py-24"
  >
    <div class="max-w-5xl mx-auto text-center px-6">
      <h1 class="text-5xl sm:text-6xl font-extrabold mb-4 drop-shadow-lg">
        会社概要
      </h1>
      <p class="text-xl text-blue-50">
        テクノロジーと人の力で、より良い未来を創る
      </p>
    </div>

    <!-- 下部の波 -->
    <div class="absolute bottom-0 left-0 w-full overflow-hidden leading-none">
      <svg
        class="relative block w-full h-16 text-white"
        xmlns="http://www.w3.org/2000/svg"
        preserveAspectRatio="none"
        viewBox="0 0 1200 120"
      >
        <path
          d="M0,0V46.29c47.79,22.24,103.74,29.33,158,17.39,70.29-15.66,136.56-57.66,207-73.2C438.14-26,511.57,4.09,583,25.13S732.29,74.62,805,58.45C862.73,45.19,913.74,7.57,972,2.3c48.69-4.56,97.61,11.59,144,28.52V0Z"
          opacity=".25"
          fill="currentColor"></path>
        <path
          d="M0,0V15.81C43.42,36.94,91,51.58,137,52.07c63.39.64,127-19.29,190-33.81,104.26-24.16,208.86-22.2,312,7.14C708.59,51.59,811,113.9,915,111.38c62.73-1.53,125.09-28.05,188-48.35V0Z"
          opacity=".5"
          fill="currentColor"></path>
        <path
          d="M0,0V5.63C60,21.47,120,42.95,180,48.3c60,5.36,120-5.32,180-19.77C480,10.08,540,0,600,0s120,10.08,180,28.53c60,14.45,120,25.13,180,19.77,60-5.35,120-26.83,180-42.67V0Z"
          fill="currentColor"></path>
      </svg>
    </div>
  </section>

  <!-- 理念セクション -->
  <section id="vision" class="mx-auto py-20 px-6 text-center">
    <h2 class="text-4xl font-bold text-gray-800 mb-8">企業理念</h2>
    <p class="text-lg leading-relaxed">
      「株式会社火和
      HIYORI（ひより）は、ITソリューションと飲食サービスを融合し、<br />
      人々の暮らしに新しい価値と温かさを生み出す企業です。」
    </p>
    <p class="text-lg leading-relaxed mb-4">
      火のような情熱・エネルギーが、和の心と調和して人や社会を温めるというイメージになります。
    </p>
    <p class="text-lg leading-relaxed">
      特に「火」が持つ強さと「和」が持つ優しさがバランスよく調和しており、<br />
      情熱と調和で価値を作る企業にしたいと思います。
    </p>
  </section>

  <!-- MISSION & VISION -->
  <section class="mx-auto py-20 px-6 text-center">
    <div class="max-w-4xl mx-auto">
      <div class="mb-12">
        <img
          src={`${import.meta.env.BASE_URL}images/MISSION.jpg`}
          alt="MISSION"
          class="w-32 h-32 object-cover rounded-full mx-auto mb-6 shadow-lg"
        />
        <h2 class="text-4xl font-bold text-gray-800 mb-4">MISSION</h2>
        <p class="text-lg leading-relaxed text-gray-700">
          「技術と食文化を通じて、社会に“より良い日和”を創り出す。」
        </p>
      </div>
      <div>
        <img
          src={`${import.meta.env.BASE_URL}images/VISION.jpg`}
          alt="VISION"
          class="w-32 h-32 object-cover rounded-full mx-auto mb-6 shadow-lg"
        />
        <h2 class="text-4xl font-bold text-gray-800 mb-4">VISION</h2>
        <p class="text-lg leading-relaxed text-gray-700">
          「ITの未来と、食の豊かさを両立し、人々の生活を支える企業へ。」
        </p>
      </div>
    </div>
  </section>

  <!-- 代表挨拶 -->
  <section class="bg-gray-50 py-20">
    <div class="mx-auto px-6 flex items-center justify-center">
      <div>
        <img
          src={`${import.meta.env.BASE_URL}images/ceo.jpg`}
          alt="代表写真"
          class="w-80 h-80 object-cover rounded-lg shadow"
        />
      </div>
      <div class="ml-4">
        <h2 class="text-4xl font-bold text-gray-800 mb-6">代表挨拶</h2>
        <p class="text-lg leading-relaxed mb-4">
          平素より格別のご高配を賜り、誠にありがとうございます。
        </p>
        <p class="text-lg leading-relaxed mb-4">
          当社は創業以来、ITと飲食の二つの分野で地域と共に成長してまいりました。
        </p>
        <p class="text-lg leading-relaxed mb-4">
          今後もお客様に満足していただけるサービスを提供し、社会の発展に寄与してまいります。
        </p>
        <p class="mt-6 font-semibold text-gray-800">代表取締役</p>
      </div>
    </div>
  </section>

  <!-- 会社情報 -->
  <section class="max-w-5xl mx-auto py-20 px-6">
    <h2 class="text-4xl font-bold text-center text-gray-800 mb-12">会社情報</h2>

    <div class="bg-white shadow rounded-lg overflow-hidden">
      <table class="w-full text-left border-collapse text-lg">
        <tbody>
          <tr class="border-b border-gray-200">
            <th class="bg-gray-100 w-40 px-6 py-4 font-medium text-gray-700"
              >会社名</th
            >
            <td class="px-6 py-4 text-gray-700"> 株式会社火和 HIYORI </td>
          </tr>
          <tr class="border-b border-gray-200">
            <th class="bg-gray-100 px-6 py-4 font-medium text-gray-700"
              >所在地</th
            >
            <td class="px-6 py-4 text-gray-700"
              >埼玉県川口市赤山３０９ベルドゥムール川口東９０５</td
            >
          </tr>
          <tr class="border-b border-gray-200">
            <th class="bg-gray-100 px-6 py-4 font-medium text-gray-700">設立</th
            >
            <td class="px-6 py-4 text-gray-700">2025年10月</td>
          </tr>
          <tr class="border-b border-gray-200">
            <th class="bg-gray-100 px-6 py-4 font-medium text-gray-700"
              >代表者</th
            >
            <td class="px-6 py-4 text-gray-700">朝元 逢心</td>
          </tr>
          <tr>
            <th class="bg-gray-100 px-6 py-4 font-medium text-gray-700"
              >事業内容</th
            >
            <td class="px-6 py-4 text-gray-700">
              ITソリューション事業・飲食事業
            </td>
          </tr>
        </tbody>
      </table>
    </div>
  </section>
</Layout>
