import React from 'react';
import PageHeader from '../components/PageHeader';
import { CheckCircle2, MapPin, Mountain, Leaf, Cloud, Wrench, Award } from 'lucide-react';

const SurveyingPage: React.FC = () => {
  const surveyTypes = [
    {
      icon: MapPin,
      title: 'Инженерно-геодезические изыскания',
      description: 'Работы включают выполнение топографической съемки различных масштабов, обмерные и разбивочные работы, обеспечение корректных геометрических размеров и форм элементов сооружения.'
    },
    {
      icon: Mountain,
      title: 'Инженерно-геологические изыскания',
      description: 'Оценка состояния грунтов, бурение разведочных скважин, испытания грунтов зондированием и штампами, лабораторный анализ их состава и физико-механических характеристик.'
    },
    {
      icon: Leaf,
      title: 'Инженерно-экологические изыскания',
      description: 'Радиационные исследования, определение содержания нефтепродуктов, тяжелых металлов, бактерий в почвах и грунтах, воздухе, подземных и поверхностных водах.'
    },
    {
      icon: Cloud,
      title: 'Инженерно-гидрологические и инженерно-метеорологические изыскания',
      description: 'Комплексное исследование гидрометеорологических условий территории и оценка влияния гидрометеорологических факторов на площадку строительства.'
    }
  ];

  const geodesicWorks = [
    'Создание опорных геодезических сетей',
    'Геодезические наблюдения за деформациями и осадками зданий и сооружений, движениями земной поверхности и опасными природными процессами',
    'Создание и обновление инженерно-топографических планов в масштабах 1:200 - 1:5000, в том числе в цифровой форме, съемка подземных коммуникаций и сооружений',
    'Трассирование линейных объектов',
    'Инженерно-гидрографические работы',
    'Специальные геодезические и топографические работы при строительстве и реконструкции зданий и сооружений'
  ];

  const geologicalWorks = [
    'Инженерно-геологическая съемка в масштабах 1:500 - 1:25000',
    'Проходка горных выработок с их опробованием, лабораторные исследования физико-механических свойств грунтов и химических свойств проб подземных вод',
    'Изучение опасных геологических и инженерно-геологических процессов с разработкой рекомендаций по инженерной защите территории',
    'Гидрогеологические исследования',
    'Инженерно-геофизические исследования',
    'Инженерно-геокриологические исследования',
    'Сейсмологические и сейсмотектонические исследования территории, сейсмическое микрорайонирование'
  ];

  const ecologicalWorks = [
    'Инженерно-экологическая съемка территории',
    'Исследования химического загрязнения почвогрунтов, поверхностных и подземных вод, атмосферного воздуха, источников загрязнения',
    'Лабораторные химико-аналитические и газохимические исследования образцов и проб почвогрунтов и воды',
    'Исследования и оценка физических воздействий и радиационной обстановки на территории',
    'Изучение растительности, животного мира, санитарно-эпидемиологические и медико-биологические исследования территории'
  ];

  const hydrometeorologicalWorks = [
    'Метеорологические наблюдения и изучение гидрологического режима водных объектов',
    'Изучение опасных гидрометеорологических процессов и явлений с расчетами их характеристик',
    'Изучение русловых процессов водных объектов, деформаций и переработки берегов',
    'Исследования ледового режима водных объектов'
  ];

  const geotechnicalWorks = [
    'Проходка горных выработок с их опробованием и лабораторные исследования механических свойств грунтов с определением характеристик для конкретных схем расчета оснований фундаментов',
    'Полевые испытания грунтов с определением их стандартных прочностных и деформационных характеристик (штамповые, сдвиговые, прессиометрические, срезные). Испытания эталонных и натурных свай',
    'Определение стандартных механических характеристик грунтов методами статического, динамического и бурового зондирования',
    'Физическое и математическое моделирование взаимодействия зданий и сооружений с геологической средой',
    'Специальные исследования характеристик грунтов по отдельным программам для нестандартных, в том числе нелинейных методов расчета оснований фундаментов и конструкции зданий и сооружений',
    'Геотехнический контроль строительства зданий, сооружений и прилегающих территорий'
  ];

  const pricing = [
    { service: 'Инженерные изыскания под коттедж (геология+геодезия)', price: 'от 25000 ₽' },
    { service: 'Инженерно-геологические изыскания для строительства', price: 'от 500 ₽ / м.' },
    { service: 'Инженерно-геологические изыскания с экспертизой', price: 'от 500 ₽ / м.' },
    { service: 'Геологические изыскания (особо крупные объекты)', price: 'от 300 ₽ / м.' },
    { service: 'Геологические изыскания под коттедж', price: 'от 15000 ₽' },
    { service: 'Инженерно-геодезические изыскания для строительства', price: 'от 5000 ₽' },
    { service: 'Геоподоснова (топоплан с коммуникациями)', price: 'от 10000 ₽' },
    { service: 'Геодезические изыскания под коттедж (топосъемка)', price: 'от 5000 ₽' },
    { service: 'Определение границ, координатная привязка', price: 'от 2000 ₽' },
    { service: 'Разбивка осей, реперы, сопровождение строительства', price: 'от 2000 ₽' },
    { service: 'Инженерно-экологические изыскания', price: 'от 8000 ₽' },
    { service: 'Инженерные изыскания (комплекс работ)', price: '10% скидка', highlight: true }
  ];

  return (
    <div className="bg-white pb-20">
      <PageHeader 
        title="Инженерные изыскания" 
        description="Комплекс мероприятий для сбора и анализа детальной информации о территории строительства"
        image="/media/images/headers/header-injinernie-iziskania.png"
      />

      <div className="container mx-auto px-6 py-20">
        {/* Основное описание */}
        <div className="max-w-5xl mx-auto mb-20">
          <div className="bg-gray-50 rounded-2xl p-8 md:p-12 mb-12">
            <p className="text-lg text-gray-700 leading-relaxed mb-6">
              <strong>Инженерные изыскания для выполнения строительства</strong> – комплекс мероприятий, 
              направленных на сбор и анализ детальной информации о техногенных и природных условиях территории 
              для будущего строительства. Полученные данные входят в состав обязательной документации для 
              разработки проекта и проведения строительных работ.
            </p>
            <p className="text-gray-600 leading-relaxed">
              Необходимость проведения определенных видов изысканий, их объем и состав определяются после анализа 
              технического задания и зависят от вида, уровня ответственности, назначения сооружений, стадии 
              проектирования, условий участка и степени их изученности.
            </p>
          </div>

          <div className="bg-brand-orange text-white rounded-2xl p-8 md:p-12">
            <p className="text-lg leading-relaxed">
              Проведение инженерных изысканий подразумевает анализ данных, оценку возможных последствий реализации 
              проекта, получение санитарно-эпидемиологических заключений и составление технических отчетов, состав 
              которых определяется действующими нормативными документами. Наши специалисты профессионально выполняют 
              изыскания для строящихся или реконструируемых объектов любых типов.
            </p>
          </div>
        </div>

        {/* Типы изысканий */}
        <div className="max-w-6xl mx-auto mb-20">
          <h2 className="text-3xl font-bold text-gray-900 mb-12 text-center">
            Мы выполняем следующие типы инженерных изысканий
          </h2>

          <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
            {surveyTypes.map((type, index) => (
              <div 
                key={index}
                className="bg-white border-2 border-gray-200 rounded-2xl p-8 hover:border-brand-orange transition-all duration-300 hover:shadow-xl"
              >
                <div className="flex items-start gap-4 mb-4">
                  <div className="flex-shrink-0 w-14 h-14 bg-brand-orange text-white rounded-xl flex items-center justify-center">
                    <type.icon size={28} />
                  </div>
                  <h3 className="text-xl font-bold text-gray-900 leading-tight pt-2">
                    {type.title}
                  </h3>
                </div>
                <p className="text-gray-600 leading-relaxed">
                  {type.description}
                </p>
              </div>
            ))}
          </div>
        </div>

        {/* Допуски к работам */}
        <div className="max-w-6xl mx-auto mb-20">
          <div className="text-center mb-12">
            <div className="inline-flex items-center gap-3 bg-brand-orange text-white px-8 py-4 rounded-full mb-6">
              <Award size={32} />
              <span className="text-xl font-bold">ООО ГЕОВЕКТОР ИМЕЕТ ДОПУСК К СЛЕДУЮЩИМ ВИДАМ РАБОТ</span>
            </div>
          </div>

          <div className="space-y-12">
            {/* Инженерно-геодезические */}
            <div className="bg-gray-50 rounded-2xl p-8">
              <h3 className="text-2xl font-bold text-gray-900 mb-6 flex items-center gap-3">
                <div className="w-2 h-8 bg-brand-orange rounded"></div>
                Инженерно-геодезические изыскания
              </h3>
              <ul className="space-y-3">
                {geodesicWorks.map((work, index) => (
                  <li key={index} className="flex items-start gap-3">
                    <CheckCircle2 className="flex-shrink-0 text-brand-orange mt-1" size={20} />
                    <span className="text-gray-700">{work}</span>
                  </li>
                ))}
              </ul>
            </div>

            {/* Инженерно-геологические */}
            <div className="bg-gray-50 rounded-2xl p-8">
              <h3 className="text-2xl font-bold text-gray-900 mb-6 flex items-center gap-3">
                <div className="w-2 h-8 bg-brand-orange rounded"></div>
                Инженерно-геологические изыскания
              </h3>
              <ul className="space-y-3">
                {geologicalWorks.map((work, index) => (
                  <li key={index} className="flex items-start gap-3">
                    <CheckCircle2 className="flex-shrink-0 text-brand-orange mt-1" size={20} />
                    <span className="text-gray-700">{work}</span>
                  </li>
                ))}
              </ul>
            </div>

            {/* Инженерно-экологические */}
            <div className="bg-gray-50 rounded-2xl p-8">
              <h3 className="text-2xl font-bold text-gray-900 mb-6 flex items-center gap-3">
                <div className="w-2 h-8 bg-brand-orange rounded"></div>
                Инженерно-экологические изыскания
              </h3>
              <ul className="space-y-3">
                {ecologicalWorks.map((work, index) => (
                  <li key={index} className="flex items-start gap-3">
                    <CheckCircle2 className="flex-shrink-0 text-brand-orange mt-1" size={20} />
                    <span className="text-gray-700">{work}</span>
                  </li>
                ))}
              </ul>
            </div>

            {/* Инженерно-гидрометеорологические */}
            <div className="bg-gray-50 rounded-2xl p-8">
              <h3 className="text-2xl font-bold text-gray-900 mb-6 flex items-center gap-3">
                <div className="w-2 h-8 bg-brand-orange rounded"></div>
                Инженерно-гидрометеорологические изыскания
              </h3>
              <ul className="space-y-3">
                {hydrometeorologicalWorks.map((work, index) => (
                  <li key={index} className="flex items-start gap-3">
                    <CheckCircle2 className="flex-shrink-0 text-brand-orange mt-1" size={20} />
                    <span className="text-gray-700">{work}</span>
                  </li>
                ))}
              </ul>
            </div>

            {/* Инженерно-геотехнические */}
            <div className="bg-gray-50 rounded-2xl p-8">
              <h3 className="text-2xl font-bold text-gray-900 mb-6 flex items-center gap-3">
                <div className="w-2 h-8 bg-brand-orange rounded"></div>
                Инженерно-геотехнические изыскания
              </h3>
              <p className="text-sm text-gray-600 italic mb-6">
                (Выполняются в составе инженерно-геологических изысканий или отдельно на изученной 
                в инженерно-геологическом отношении территории под отдельные здания и сооружения).
              </p>
              <ul className="space-y-3">
                {geotechnicalWorks.map((work, index) => (
                  <li key={index} className="flex items-start gap-3">
                    <CheckCircle2 className="flex-shrink-0 text-brand-orange mt-1" size={20} />
                    <span className="text-gray-700">{work}</span>
                  </li>
                ))}
              </ul>
            </div>
          </div>
        </div>

        {/* Прайс-лист */}
        <div className="max-w-5xl mx-auto">
          <h2 className="text-3xl font-bold text-gray-900 mb-8 text-center">
            Цены на основные виды работ по инженерным изысканиям
          </h2>

          <div className="overflow-x-auto shadow-lg rounded-2xl">
            <table className="w-full bg-white">
              <thead>
                <tr className="bg-brand-orange text-white">
                  <th className="px-6 py-4 text-left font-bold">Наименование услуги</th>
                  <th className="px-6 py-4 text-right font-bold w-48">Стоимость</th>
                </tr>
              </thead>
              <tbody>
                {pricing.map((item, index) => (
                  <tr 
                    key={index}
                    className={`border-b border-gray-200 transition-colors ${
                      item.highlight 
                        ? 'bg-brand-orange/10 hover:bg-brand-orange/20' 
                        : index % 2 === 0 
                          ? 'bg-white hover:bg-gray-50' 
                          : 'bg-gray-50 hover:bg-gray-100'
                    }`}
                  >
                    <td className={`px-6 py-4 ${item.highlight ? 'font-bold text-gray-900' : 'text-gray-700'}`}>
                      {item.service}
                    </td>
                    <td className={`px-6 py-4 text-right ${item.highlight ? 'text-brand-orange font-bold text-lg' : 'font-semibold text-gray-900'}`}>
                      {item.price}
                    </td>
                  </tr>
                ))}
              </tbody>
            </table>
          </div>

          {/* Призыв к действию */}
          <div className="mt-12 text-center">
            <div className="bg-gray-50 rounded-2xl p-8">
              <p className="text-gray-700 mb-6">
                Точную стоимость работ можно узнать после анализа технического задания и условий объекта
              </p>
              <a 
                href="#/contacts" 
                className="inline-block px-8 py-4 bg-brand-orange text-white font-bold rounded-lg hover:bg-orange-600 transition-colors text-lg"
              >
                Получить консультацию
              </a>
            </div>
          </div>
        </div>
      </div>
    </div>
  );
};

export default SurveyingPage;