<script setup lang="ts">
import PureCitySvg from "~/assets/pure-city.svg";
</script>

<template>
  <section class="py-16 bg-slate-100">
    <h2 class="text-4xl font-semibold col-w mx-auto mb-8 px-4 md:px-16 flex items-center gap-8">
      <img :src="PureCitySvg" class="h-16" alt="">
      Контакты
    </h2>

    <div class="grid gap-8 grid-flow-row sm:grid-flow-col col-w mx-auto px-4 md:px-16">
      <div class="flex gap-2">
        <Icon name="bi:geo-alt" class="opacity-50 mt-1 shrink-0"></Icon>
        197372, г.&nbsp;Санкт-Петербург, ул.&nbsp;Ильюшина, д.1, кор.1, литер&nbsp;А, пом.4-Н
      </div>
      <div class="flex flex-col gap-2">
        <div class="flex items-center gap-2">
          <Icon name="bi:telephone" class="opacity-50"></Icon>
          <a href="tel:(812) 342-90-29" class="link">(812) 342-90-29</a>
        </div>
        <div class="flex flex-col">
          <div class="text-sm">Отдел продаж:</div>
          <div class="flex items-center gap-2">
            <Icon name="bi:envelope" class="opacity-50"></Icon>
            <a href="mailto:pure-city@inbox.ru" class="link">pure-city@inbox.ru</a>
          </div>
        </div>
        <div class="flex flex-col">
          <div class="text-sm">Бухгалтерия:</div>
          <div class="flex items-center gap-2">
            <Icon name="bi:envelope" class="opacity-50"></Icon>
            <a href="mailto:pure-city@yandex.ru" class="link">pure-city@yandex.ru</a>
          </div>
        </div>
      </div>
      <div class="text-slate-500 flex flex-col">
        <div>ИНН 7814311311</div>
        <div>КПП 781401001</div>
        <div>ОГРН 1047855173255</div>
      </div>
    </div>
</section>
</template>

<style scoped lang="postcss">

</style>
