import React from 'react'
import { Link } from 'gatsby'; 

import Logo from "../images/logo.svg";
import Social from './UI/Social';

const Footer = () => {
    return (
        <footer className='bg-slate-900 mt-[60px] rounded-t-[20px] pt-10 max-md:py-10 max-sm:px-3 max-md:px-6'>
            <nav className="container mx-auto items-stretch flex max-md:flex-col justify-between relative py-3">
                <div className="flex flex-col max-md:mb-5 max-md:items-center">
                    <Logo className="w-32 max-md:w-28 mb-10 max-md:mb-5"/>
                    <p className='text-slate-400 text-xs font-medium'>© 2023 АудитКонсалт</p>
                </div>
                <div className="flex flex-col max-md:mb-5">
                    <Link className='text-base font-medium text-red-500 hover:text-red-600 mb-4' to='/about'>О компании</Link>
                    <ul className='flex flex-col font-normal text-sm text-white'>
                        <li className='mb-[7px]'><Link className='hover:text-slate-200 transition-all' to='/oferta'>Публичная оферта</Link></li>
                        <li><Link className='hover:text-slate-200 transition-all' to='/policy'>Политика конфиденциальности</Link></li>
                    </ul>
                </div>
                <div className="flex flex-col">
                    <Link className='text-base font-medium text-red-500 hover:text-red-600 mb-4' to='/services'>Услуги</Link>
                    <p className='mb-[10px] text-white text-sm font-normal'>Физическим лицам</p>
                    <ul className='flex flex-col mb-5 font-normal text-xs text-slate-400'>
                        <li className='mb-[7px]'><Link className='hover:text-slate-500 transition-all' to='/oferta'>{'>'} 3-НДФЛ</Link></li>
                        <li className='mb-[7px]'><Link className='hover:text-slate-500 transition-all' to='/policy'>{'>'} Уведомление о счетах в иностранных банках</Link></li>
                        <li><Link className='hover:text-slate-500 transition-all' to='/policy'>{'>'} Контролируемые иностранные компании</Link></li>
                    </ul>
                    <p className='mb-[10px] text-white text-sm font-normal'>Юридическим лицам</p>
                    <ul className='flex flex-col mb-5 font-normal text-xs text-slate-400 '>
                        <li className='mb-[7px]'><Link className='hover:text-slate-500 transition-all' to='/oferta'>{'>'} Работа с налоговыми органами</Link></li>
                        <li className='mb-[7px]'><Link className='hover:text-slate-500 transition-all' to='/policy'>{'>'} Аутсорсинг бухгалтерских услуг</Link></li>
                        <li className='mb-[10px]'><Link className='hover:text-slate-500 transition-all' to='/policy'>{'>'} Бухгалтерское сопровождение</Link></li>
                        <li><Link className='text-red-400 hover:text-red-600 transition-all' to='/policy'>+ еще 14 услуг</Link></li>
                    </ul>
                </div>
                <div className="flex flex-col pr-[104px] border-r-[1px] border-slate-400 max-md:mb-5 max-md:border-r-0">
                    <ul className='flex flex-col font-medium text-base text-slate-400'>
                        <li className='mb-[17px]'><Link className='hover:text-slate-500 transition-all' to='/oferta'>Прайс-лист</Link></li>
                        <li className='mb-[17px]'><Link className='hover:text-slate-500 transition-all' to='/contacts'>Контакты</Link></li>
                        <li><Link className='hover:text-slate-500 transition-all' to='/policy'>Калькулятор</Link></li>
                    </ul>
                </div>
                <div className="flex flex-col">
                    <div className="flex flex-col mb-5">
                        <p className='text-slate-500 text-xs mb-2 font-medium'>Всегда рады вашим звонкам</p>
                        <a className='text-xl font-bold text-white hover:text-slate-300 transition-all' href="tel:+79602819790">+7 (960) 281 97-90</a>
                    </div>
                    <p className='text-white text-sm font-medium mb-5 max-w-[210px]'>г.Санкт-Петербург, вн.тер.г. Муниципальный Округ Пулковский Меридиан, ул Бассейная, д. 27, Литера А, помещ. 23-н, офис 1</p>
                    <Social/>
                </div>
            </nav>
        </footer>
    )
}

export default Footer;