
import React from 'react';
import SectionWrapper from './SectionWrapper';
import { ArrowRight } from 'lucide-react';
import { motion } from 'framer-motion';
import { SectionProps } from '../types';

interface Member {
    id: number;
    name: string;
    role: string;
    bio: string;
    image: string;
}

const members: Member[] = [
    {
        id: 1,
        name: 'Ахметзянов  Арсен',
        role: 'CEO / Генеральный директор',
        bio: 'Более 15 лет в IT-индустрии. Руководил внедрением крупных цифровых платформ. Автор стратегии развития суверенных ИИ-решений для госсектора.',
        image: '/media/team/arsen.jpg'
    },
    {
        id: 2,
        name: 'Мирсаяпов  Эдгар',
        role: 'CCO / Коммерческий директор',
        bio: 'Эксперт по стратегическому развитию бизнеса. Отвечает за коммерциализацию продукта, взаимодействие с партнерами и масштабирование на федеральном уровне.',
        image: '/media/team/edgar.jpg'
    },
    {
        id: 3,
        name: 'Решетников Александр',
        role: 'CTO / Технический директор',
        bio: 'Архитектор высоконагруженных систем. Специализируется на проектировании безопасной инфраструктуры ЦОД и оптимизации нейросетевых моделей.',
        image: '/media/team/alexandr.jpg'
    },
    {
        id: 4,
        name: 'Зулькарнаев Даниэль',
        role: 'CPO / Менеджер проекта',
        bio: 'Управляет жизненным циклом продукта. Координирует работу команд разработки и внедрения, обеспечивая соответствие функционала требованиям заказчика.',
        image: '/media/team/daniel.jpg'
    }
];

const PRIVACY_POLICY = `
**ПОЛИТИКА ОБРАБОТКИ ПЕРСОНАЛЬНЫХ ДАННЫХ ООО «ИЗИ ГРУПП»**

**I. Общие положения**
1.1. Настоящая Политика обработки персональных данных (далее – Политика) разработана в соответствии с требованиями Федерального закона от 27.07.2006 № 152-ФЗ «О персональных данных» (далее – ФЗ № 152) и определяет порядок обработки персональных данных (ПДн) и меры по обеспечению безопасности ПДн в Обществе с ограниченной ответственностью «ИЗИ ГРУПП» (далее – Оператор).
1.2. Оператор осуществляет обработку ПДн с целью обеспечения соблюдения законов РФ, а также с целью осуществления своей основной деятельности: предоставление информации о продуктах и услугах, консультирование, ответ на обращения пользователей, а также заключение и исполнение договоров.
1.3. Действие Политики распространяется на все процессы Оператора, связанные с обработкой ПДн.

**II. Сведения об Операторе**
Наименование: Общество с ограниченной ответственностью «ИЗИ ГРУПП» (ООО «ИЗИ ГРУПП»)
Адрес: Респ. Башкортостан, г. Уфа, пр-кт Октября, д. 107а, кв. 436.
ИНН: 0277953363
КПП: 027701001
Сайт: gov.iieasy.ru

**III. Принципы и цели обработки ПДн**
3.1. **Принципы обработки ПДн:** Обработка ПДн осуществляется на законной и справедливой основе, ограничивается достижением конкретных, заранее определенных и законных целей. Содержание и объем обрабатываемых ПДн соответствуют заявленным целям обработки.

3.2. **Цели обработки ПДн:**
* Установление обратной связи с пользователем по его запросу, инициированному через предоставленные каналы связи (в том числе через мессенджеры).
* Предоставление информации о продуктах, экспертизе и услугах Оператора.
* Анализ эффективности работы сайта и его улучшение.
* Заключение и исполнение договоров, стороной которых является субъект ПДн.

**IV. Перечень обрабатываемых ПДн**
4.1. В рамках исполнения целей, указанных в п. 3.2., Оператор может обрабатывать следующие категории ПДн, предоставляемые пользователем добровольно:
* Имя (предоставленное пользователем);
* Номер телефона (для оперативной связи).
* Электронная почта

4.2. **Обезличенные данные:** Оператор также обрабатывает обезличенные данные, которые не используются для идентификации конкретного пользователя: IP-адрес, данные о браузере, информация, содержащаяся в файлах cookie, сведения о действиях на сайте. Обработка обезличенных данных осуществляется исключительно для ведения статистики и улучшения работы сайта.

**V. Порядок и условия обработки ПДн**
5.1. **Согласие субъекта:** Обработка ПДн осуществляется с согласия субъекта ПДн. Такое согласие считается полученным в момент, когда пользователь инициирует контакт с Оператором через предоставленные каналы связи, тем самым добровольно предоставляя свои данные для обратной связи.
5.2. **Локализация данных:** В соответствии с ч. 5 ст. 18 ФЗ № 152, Оператор обеспечивает запись, систематизацию, накопление, хранение, уточнение (обновление, изменение) и извлечение ПДн граждан Российской Федерации с использованием баз данных, находящихся на территории Российской Федерации.
5.3. **Срок обработки:** Обработка ПДн осуществляется с момента получения согласия и прекращается:
* после достижения целей обработки;
* в случае отзыва согласия субъекта ПДн;
* при ликвидации Оператора.
5.4. **Передача третьим лицам:** Оператор не раскрывает и не передает ПДн третьим лицам без согласия субъекта ПДн, за исключением случаев, предусмотренных законодательством РФ.

**VI. Права субъекта персональных данных**
Субъект ПДн имеет право:
* Получить информацию, касающуюся обработки его ПДн.
* Требовать уточнения своих ПДн, их блокирования или уничтожения в случае, если данные являются неполными, устаревшими, неточными, незаконно полученными или не являются необходимыми для заявленной цели обработки.
* Отозвать свое согласие на обработку ПДн путем направления соответствующего запроса Оператору.

**VII. Заключительные положения**
7.1. Настоящая Политика вступает в силу с момента ее утверждения Оператором и является общедоступной.
7.2. Настоящая Политика подлежит размещению на официальном сайте Оператора.
7.3. Контроль за выполнением требований настоящей Политики осуществляется Оператором.
`;

const DATA_STORAGE_POLICY = `
**ПОЛИТИКА ХРАНЕНИЯ И ЗАЩИТЫ ДАННЫХ ООО «ИЗИ ГРУПП»**

**1. Общие гарантии**
1.1. ООО «ИЗИ ГРУПП» (далее — Оператор) гарантирует полную конфиденциальность и безопасность данных клиентов и пользователей в строгом соответствии с законодательством Российской Федерации, включая ФЗ № 152 «О персональных данных».
1.2. Приоритетом Оператора является предотвращение несанкционированного доступа, уничтожения, изменения, блокирования, копирования, распространения, а также иных неправомерных действий третьих лиц в отношении хранимой информации.

**2. Места и способы хранения**
2.1. **Локализация:** Все данные граждан Российской Федерации хранятся исключительно на серверах, физически расположенных на территории Российской Федерации.
2.2. **Электронные носители:** Хранение данных осуществляется в защищенных электронных базах данных. Доступ к серверам ограничен и защищен современными программно-аппаратными средствами.
2.3. **Бумажные носители:** В случае использования бумажных носителей, они хранятся в запираемых шкафах или сейфах, доступ к которым имеют только уполномоченные сотрудники.

**3. Меры по обеспечению безопасности**
Для защиты данных Оператор применяет следующий комплекс мер:

* **Технические меры:** Использование антивирусного программного обеспечения, межсетевых экранов (firewalls), средств шифрования данных при их передаче по каналам связи (протоколы SSL/TLS).

* **Организационные меры:** Регулярное обучение сотрудников правилам информационной безопасности, назначение ответственных лиц за организацию обработки данных.

* **Управление доступом:** Доступ к персональным данным предоставляется только тем сотрудникам, которым он необходим для выполнения должностных обязанностей. Каждому сотруднику присваивается уникальный идентификатор (логин) и пароль.

**4. Конфиденциальность**
4.1. Оператор обязуется не раскрывать третьим лицам и не распространять персональные данные без согласия субъекта, если иное не предусмотрено федеральным законом.
4.2. Все сотрудники Оператора, имеющие доступ к данным, подписывают обязательство о неразглашении конфиденциальной информации.

**5. Уничтожение данных**
5.1. По достижении целей обработки или в случае утраты необходимости в достижении этих целей, если иное не предусмотрено федеральным законом, данные подлежат уничтожению.
5.2. Уничтожение производится способом, исключающим возможность восстановления содержания данных (например, физическое уничтожение носителя или безвозвратное удаление файлов с использованием специализированного ПО).
`;

const Team: React.FC<SectionProps> = ({ onOpenModal }) => {
  
  const handleMemberClick = (member: Member) => {
      if (onOpenModal) {
          onOpenModal({
              title: member.name,
              type: 'article',
              theme: 'dark',
              content: {
                  text: `**${member.role}**\n\n${member.bio}\n\nКлючевые компетенции:\n- Стратегическое планирование\n- Управление R&D\n- Взаимодействие с госсектором`
              }
          })
      }
  }

  const handleLaunchPilot = () => {
      if (onOpenModal) {
          onOpenModal({
              title: 'Запуск пилотного проекта',
              type: 'form',
              theme: 'dark',
              content: {
                  text: 'Оставьте заявку на развертывание пилотной версии системы в вашем регионе или ведомстве.'
              }
          })
      }
  }

  const handleLegal = (title: string) => {
      if (onOpenModal) {
          let content = '';
          if (title === 'Политика конфиденциальности') {
              content = PRIVACY_POLICY;
          } else if (title === 'Политика хранения данных') {
              content = DATA_STORAGE_POLICY;
          }

          onOpenModal({
              title: title,
              type: 'article',
              theme: 'dark',
              content: {
                  text: content
              }
          })
      }
  }

  return (
    <SectionWrapper id="team" transitionEffect="gradient" fitScreen={false}>
      <div className="max-w-7xl mx-auto px-6 md:px-12 w-full flex flex-col justify-between items-center text-center relative min-h-full pb-20 lg:pb-10">
        
            <div className="w-full flex flex-col items-center flex-grow justify-center py-12 lg:py-6">
                <motion.div 
                    className="inline-block border border-theme px-4 py-1 rounded-full mb-6 lg:mb-4 font-mono text-xs text-theme-muted"
                    initial={{ opacity: 0, y: -20 }}
                    whileInView={{ opacity: 1, y: 0 }}
                    transition={{ duration: 0.6 }}
                >
                    iiEasy Group
                </motion.div>

                <motion.h2 
                    className="text-4xl md:text-6xl lg:text-7xl font-black text-theme-main mb-6 lg:mb-4 tracking-tighter"
                    initial={{ opacity: 0, scale: 0.8 }}
                    whileInView={{ opacity: 1, scale: 1 }}
                    transition={{ duration: 0.8, ease: [0.645, 0.045, 0.355, 1.000] }}
                >
                    ЯДРО КОМАНДЫ
                </motion.h2>
                
                <motion.p 
                    className="text-base md:text-lg text-theme-muted mb-8 lg:mb-8 max-w-2xl mx-auto"
                    initial={{ opacity: 0 }}
                    whileInView={{ opacity: 1 }}
                    transition={{ delay: 0.3, duration: 0.8 }}
                >
                Локальная команда разработчиков, интегрированная в специфику регионального управления.
                </motion.p>

                <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 md:gap-6 lg:gap-4 mb-10 lg:mb-12 w-full max-w-6xl px-4 md:px-0">
                    {members.map((member, i) => (
                        <motion.div 
                            key={member.id} 
                            initial={{ opacity: 0, y: 30 }}
                            whileInView={{ opacity: 1, y: 0 }}
                            whileTap={{ scale: 0.95 }}
                            transition={{ delay: 0.4 + i * 0.1, duration: 0.6 }}
                            onClick={() => handleMemberClick(member)}
                            className="bg-theme-card p-4 lg:p-5 border border-theme hover:border-[#20e3b2] transition-all duration-300 cursor-pointer group flex flex-col items-center hover:-translate-y-2 rounded-sm"
                        >
                            <div className="w-20 h-20 md:w-28 md:h-28 lg:w-20 lg:h-20 rounded-full mb-4 overflow-hidden border-2 border-transparent group-hover:border-[#20e3b2] transition-all duration-500">
                                {/* Use responsive classes: grayscale-0 on mobile, grayscale on large screens. */}
                                <img 
                                    src={member.image} 
                                    alt={member.name} 
                                    className="w-full h-full object-cover grayscale-0 lg:grayscale lg:group-hover:grayscale-0 transition-all duration-500" 
                                />
                            </div>
                            <h3 className="text-theme-main font-bold text-base lg:text-sm mb-1 font-mono">{member.name}</h3>
                            <p className="text-theme-muted text-[10px] uppercase tracking-wider mb-2 h-6 flex items-center justify-center leading-tight">{member.role}</p>
                            
                            <div className="w-full h-px bg-theme-main/10 group-hover:bg-[#20e3b2]/30 transition-colors my-2"></div>
                            {/* Always visible on mobile, hidden and revealed on hover on desktop */}
                            <div className="text-[10px] text-theme-muted/60 opacity-100 lg:opacity-0 lg:group-hover:opacity-100 transition-opacity">
                                Нажмите для инфо
                            </div>
                        </motion.div>
                    ))}
                </div>

                <motion.button 
                    initial={{ opacity: 0, y: 20 }}
                    whileInView={{ opacity: 1, y: 0 }}
                    whileTap={{ scale: 0.95 }}
                    transition={{ delay: 0.8 }}
                    onClick={handleLaunchPilot}
                    className="px-8 py-4 lg:px-10 lg:py-4 bg-theme-main text-theme-card font-bold font-mono text-base lg:text-lg hover:bg-[#20e3b2] hover:text-black transition-colors duration-300 flex items-center gap-4 mx-auto border border-theme-main mb-8 lg:mb-8"
                >
                    ЗАПУСТИТЬ ПИЛОТ
                    <ArrowRight className="w-5 h-5" />
                </motion.button>
            </div>
            
            {/* Enhanced Footer */}
            <footer className="w-full py-6 lg:py-4 border-t border-theme/20 bg-theme-card/30 backdrop-blur-sm mt-auto relative z-20">
                <div className="max-w-7xl mx-auto px-6 flex flex-col md:flex-row justify-between items-center gap-4 lg:gap-3 text-[10px] lg:text-xs font-mono text-theme-muted uppercase tracking-wider text-center md:text-left">
                    <div className="flex flex-col md:flex-row gap-2 md:gap-6 items-center">
                        <span className="font-bold text-theme-main text-xs">ООО «ИЗИ ГРУПП»</span>
                        <a href="https://иилегко.рф" className="hover:text-[#20e3b2] transition-colors border-b border-transparent hover:border-[#20e3b2] pb-0.5">
                            иилегко.рф
                        </a>
                    </div>
                    
                    <div className="flex flex-col md:flex-row gap-2 md:gap-6 items-center">
                        <button onClick={() => handleLegal('Политика конфиденциальности')} className="hover:text-theme-main transition-colors opacity-70 hover:opacity-100">
                            Политика конфиденциальности
                        </button>
                        <button onClick={() => handleLegal('Политика хранения данных')} className="hover:text-theme-main transition-colors opacity-70 hover:opacity-100">
                            Политика хранения данных
                        </button>
                    </div>
                </div>
            </footer>
      </div>
    </SectionWrapper>
  );
};

export default Team;
