Rivalry2

Программа самостоятельного изучения PHP. Часть 1

2026-03-10 10:49 Diff

Давно я вынашивал идею создания курса по изучению одного из самых популярных языков Web-среды разработки — PHP. Проанализировав количество предложений по видеокурсам, вебинарам и книгам, я понял, что делать ещё один курс не имеет смысла.

Но по коммерческим причинам за бортом информационного крейсера остались те, кто изучает программирование самостоятельно, комбинируя различные источники информации. Поэтому, если вы начинаете учить язык PHP, то я надеюсь, что моя программа вам поможет!

Как это всё читать?

Цели. Данный набор шагов по изучению не даст вам ответы на то, как работает тот или иной инструмент языка или его обвязки. Основная цель состоит в том, чтобы получить чёткое описание пошаговой программы изучения языка с пониманием того, что же получится по итогам.

Средства. Поиск источников информации, данных, выбор технологических решений оставляется на откуп изучающему — он волен сам выбирать, прочитать о технологии из книги, с сайта или посмотреть запись на YouTube. Я постараюсь давать ссылки на материалы, но относитесь к ним именно как к рекомендациям!

Для владеющих английским я настоятельно рекомендую к прочтению статью на Hackernoon, которая отлично раскладывает по полочкам навыки современного веб-программиста.

Уровень входа. Сам курс подразумевает отсутствие опыта программирования до начала изучения. Однако, мы пишем web-приложение, и оно не сможет обойтись без пользовательского интерфейса, который, в свою очередь, базируется на языке разметки HTML и таблицах стилей CSS. Для этого есть отличный ресурс. Там можно изучить эти языки, но сам сайт отлично работает и как справочник, так что можно будет к нему обращаться по мере изучения языка.

Содержание. Каждый блок состоит из нескольких частей: 1. Название части блока и задачи. 2. Постановка цели части блока. 3. Описание практической части, которую необходимо выполнить для того, чтобы усвоить информацию. 4. Описание получаемой ценности. 5. Комментарии и сопутствующие ссылки. 6. Практика. Как видите, каждый блок изучения имеет практическую часть. Запомните:

Просто читать о технологиях, не практикуясь в их применении, бесполезно! Без практики можете сразу забыть об обучении и не тратить драгоценное время!

Временные рамки. Если у вас есть полный рабочий день из 8 часов, который вы можете посвящать обучению, то на первый блок у вас должна уйти неделя непрерывного обучения. Разумеется, кто-то будет совмещать всё с основной работой, но как и с любым обучением я рекомендую посвящать не менее 1.5 часов в день изучению и практике. В идеале — 2-3 часа. Этого хватит для того, чтобы вникнуть в тему, изучить материал и попрактиковаться. Разумеется, при таком подходе изучение первого блока займёт гораздо больше 1 недели, но у вас в первом приоритете должно быть качество, а не скорость!

Блок 1. Знакомство с языком. Первое приложение

Итак, начнём. Стремиться будем к тому, чтобы получить работающее приложение. Данный блок посвящён процедурному программированию и пока не рассматривает объекты. Основная цель — познакомиться с фундаментальными вещами.

Часть 1. Введение и базовые понятия

Задача: Установка окружения и запуск PHP.

Цель: Готовимся к работе с языком и средой.

Ценность: Мы готовим себе среду, в которой начнём изучать язык. Без неё продвинуться вперёд не получится.

Практика: 1. Узнать, как работает сайт с применением PHP — разобраться, как приходит запрос, как он передаётся веб-серверу, как он передаётся PHP на выполнение. 2. Установить сборку OpenServer/XAMPP. 3. Установить ПО для написания кода.

Комментарии. Пока мы ставим упрощённую сборку, которую затем заменим на более «продвинутый» вариант (виртуальную машину или контейнер). Сейчас нужно сконцентрироваться на PHP.

Для начала работы я рекомендую использовать обычные блокноты с подсветкой, например, Notepad++ или Sublime, а не IDE. Дело в том, что IDE будут давать подсказки, не давая нарастить опыт в самостоятельном поиске ошибок и их устранении.

Полезные материалы:

справочник HTML/CSS;
что потребуется для запуска PHP-скриптов?
ещё о работе PHP;
лучшая книга для начала изучения PHP.

Часть 2. Переменные, типы

Задача: Написать первый простой скрипт

Цель: Первые шаги в программировании.

Ценность: Начинаем писать настоящий код и запускать его. Ни один PHP-скрипт не работает без переменных. Более того, типизация переменных — важная тема, которая не только полезна в работе, но и крайне интересна интервьюерам на собеседованиях!

Практика: 1. Понять, что такое переменные. 2. Познакомиться с типами переменных. 3. Узнать, что такое typehinting в PHP7. 4. Узнать про приведение типов и их преобразование. 5. Узнать про правильное именование переменных. 6. Реализовать простые математические операции. 7. Константы. 8. Использование комментариев.

Комментарии. Помимо того, что переменные вообще можно создавать и использовать, немаловажным моментом является корректность их использования. Например, применение дробной переменной там, где используются целочисленные значения не только приведёт к ненужным накладным расходам, но и может дать неожиданный результат по итогам работы скрипта.

Также важно осознать, почему имена переменных типа «asd» и «massiv_chisel» так нелюбимы профессиональными разработчиками.

Полезные материалы:

Роберт Мартин — «Чистый код»;
официальная документация про переменные;
базовый стандарт оформления кода в PHP.

Часть 3. Функции

Задача: Учимся повторному использованию кода.

Цель: Сделать код нелинейным и повторно применяемым.

Ценность: Функции — основополагающая часть любого приложения, которое dы хотите использовать больше 15 минут. Без них нельзя работать ни с объектами, ни со стандартным поведением.

Также мы знакомимся с принципом DRY, который поощряет использование функций.

Практика: 1. Узнать, что такое DRY. 2. Познакомиться с функциями. 3. Посмотреть, какие переменные и в каком количестве можно передавать в функции. 4. Что такое возвращаемое значение? Как оно происходит? 5. Что такое передача аргументов по ссылке? 6. Что такое статические и глобальные переменные? Чем плохи глобальные переменные? 7. Узнать про про правильное именование функций (см. Роберт Мартин — «Чистый код»). 8. Узнать и научиться правильно применять рекурсию (классическая задача — вычисление ряда Фибоначчи или возведение числа в степень). При изучении массивов нужно будет вернуться к вопросам рекурсии. 9. Изучить синтаксис комментариев PHPDoc.

Комментарии. Первый сложный для понимания блок, «ломающий мозг», если до этого с функциями не сталкивались. Главное здесь — осознать назначение функций, а также научиться их правильно создавать. Эта часть обучения очень важна для последующих шагов.

Полезные материалы:

DRY и другие важные принципы;
официальная документация про функции;
Хабр про рекурсию;
Хабр про PHPDoc.

Часть 4. Ветвления

Задача: Учимся менять логику в зависимости от состояния и внешних воздействий.

Цель: Увеличиваем нелинейность кода и создаём разветвляющуюся логику.

Ценность: Ветвления позволяют делать код гибким, а логике дают возможность меняться в зависимости от внешних условий. Этот подход лежит в основе многих современных практик программирования. Без ветвлений невозможно создать даже простой блок логина пользователя.

Практика: 1. Познакомиться с блок-схемами и тем, как они описывают различные логические схемы. 2. Познакомиться с конструкциями if, if-else, if-else if-else. В качестве условий можно брать математические операции сравнения. 3. Познакомиться с конструкцией switch. 4. Насписать код, который будет генерировать случайное число от 1 до 3. В зависимости от сгенерированного числа будет вызываться одна из трёх созданных вами функций. 5. Познакомиться с тернарным оператором. Чем тернарный оператор в PHP 7 отличается от него же, но в PHP 5? 6. Что такое статические и глобальные переменные? Чем плохи глобальные переменные? 7. Узнать, какие условия возможны в PHP. Что такое empty, isset, !empty ? 8. Что такое «==» и «===»? Чем они отличаются?

Комментарии. С ветвлениями нужно быть аккуратными. Они предоставляют мощный механизм построения логических конструкций, но с ними можно быстро скатиться в спагетти-код. Поэтому всегда тщательно проектируйте ветвления вашей программы, чтобы она была читаемой и поддерживаемой.

Полезные материалы:

совсем просто про блок-схемы;
блок-схемы отлично описываются Википедией;
официальная документация про ветвления;
что такое спагетти-код?

Часть 5. Массивы

Задача: Знакомимся с первой структурой хранения данных.

Цель: Узнаём о том, что наборы переменных можно объединять в структуры.

Ценность: Множество действий в программировании делается не с простыми (скалярными) переменными, а с применением сложных структур. Например, мы попробуем взаимодействовать с хранилищем в виде CSV-файла. Но что, если нам надо поработать с выборкой из 3 строк в одном случае и из 7 — в другом. Нам нужен динамический набор однообразных данных. И эту задачу (и далеко не только её) отлично решают массивы.

Практика: 1. Узнать, что такое массив. 2. Познакомиться с индексными и ассоциативными массивами. 3. Узнать, что такое многомерные массивы. 4. Слить два массива при помощи array_merge. 5. Что такое array_shift, array_pop, explode, implode? 6. Обратить внимание на полный и сокращённый синтаксис объявления массивов.

Комментарии. Урок идёт в тесной связке со следующим уроком. Лучше всего изучать их вместе для лучшего понимания.

Полезные материалы:

официальная документация про массивы;
а ещё в PHP можно делать вот так.

Часть 6. Циклы

Задача: Учимся множественному повторению действий.

Цель: Объединить вместе знания о переменных, массивах и функциях, научиться эффективно пользоваться наборами данных.

Ценность: Мы познакомились с большой и важной частью процедурного программирования. Она будет полезна практически всегда. Изученная группа создаёт 90 процентов исполняемого кода. Далее уже начинаются прикладные вопросы, решающие конкретные задачи, тогда как пройденный выше блок будет характерен практически для каждого языка программирования.

Практика: 1. Познакомиться с циклами while, do-while, for. Понять, что for вполне достаточно (нужно начиться заменять while и do-while при помощи for). 2. Вывести на экран разные циклы. (см. FizzBuzz). 3. Узнать, что такое бесконечный цикл, а также конструкции break и continue. 4. Узнать, что такое цикл foreach. 5. Создать двумерный массив, обойти его вложенными циклами. 6. Взять многомерный массив. Его уже не получится гибко обходить простыми циклами. Нужна рекурсивная функция. Задача: создать массив, хранящий многоуровневое меню сайта в виде [Страница — URL — [ Вложенные пункты в том же виде ] ]. Например, до 5 уровней. При помощи рекурсивной функции сгенерировать на его основании древовидное меню на сайт.

Комментарии. Завершаем с фундаментальными основами. Обязательно уделите время многомерным циклам. Посмотрите на то, как меняется время выполнения программы, если вложенным будет цикл на 1 000, 1 000 000 элементов.

Полезные материалы:

цикл for и другие управляющие конструкции;
о задаче FizzBuzz и не только.

Часть 7. Файлы

Задача: Начинаем выносить данные из оперативной памяти в более стабильные хранилища.

Цель: Научиться работать с примитивным хранилищем данных.

Ценность: PHP плохо умеет сохранять данные между разными вызовами скриптов сам по себе. Это его особенность. Пока мы не умеем работать с базами данных и другими хранилищами, но уже научимся сохранять информацию в самый простой носитель — файл.

Для чтения же нужно что-то чуть усложнённое, а значит понадобится структура, в качестве которой выступает формат CSV.

Реализация простой фотогалереи с выводом фотографий из указанной папки поможет окончательно закрепить знания в работе с файловой системой.

Практика: 1. Поработать с простыми файлами — почитать и позаписывать данные. 2. Научиться записывать в файл логи выполнения программы (записать в файл содержимое переменной). Какие режимы работы с файлами существуют? 3. Научиться работать со структурированной информацией — CSV-форматом. 4. Научиться получать списки файлов в директориях и сформировать фотогалерею из файлов, лежащих в указанной папке. 5. Узнать про разницу между абсолютными и относительными адресами. 6. Узнать, что такое домашняя директория сайта, домашняя директория хоста, корневая директория. Чем они отличаются? Когда они нужны? 7. Посчитать слова в файле (считать, что слово — это часть текста, отделённая пробелом или знаком препинания). 8. Как подключать файлы с кодом? В чём разница между include и require? Зачем им _once? 9. Настроить окружение так, чтобы все запросы, кроме запросов к статическим файлам, направлялись к index.php. 10. Зачем нужна такая архитектура? Что такое «человеко-понятный URL»?

Комментарии. Решаем сугубо прикладные задачи. Обратите особое внимание на последнюю задачу — создание т. н. единой точки доступа в приложение. Такой подход впоследствии вы встретите во многих приложениях и фреймворках. Его нужно освоить и понять, в чём его суть.

Полезные материалы:

считаем слова в файле;
как правильно логировать данные?
единая точка входа в web-приложения.

Часть 8. Обработка форм

Задача: Учимся работать с пользовательским вводом.

Цель: Научиться делать наше приложение интерактивным.

Ценность: Формы — это один из немногих способов получения данных от пользователя. Работать с ними — важно. Но не менее важно, чтобы эта обработка была безопасной. Главная идея, которую нужно вынести отсюда — «любые данные, поступающие от пользователя извне, априори опасны, и их надо обязательно проверять и готовить к обработке, прежде чем впускать внутрь системы».

Практика: 1. Узнать про методы HTTP (GET, PUT, POST, DELETE и т. д.) Чем они отличаются? Чем HTTPS отличается от HTTP? Что такое заголовки? Какие статусы ответа может возвращать сервер? 2. Посмотреть, как создать форму на HTML, которая будет отправлять данные к скрипту script.php. 3. Узнать, что такое суперглобальные массивы $_REQUEST, $_POST, $_GET, $_FILE. 4. Обработать данные от формы и записать их в файл. 5. Узнать, что такое валидация данных (очень хорошо, если удастся разобраться с регулярными выражениями — например, как проверить, что введённый адрес является корректным email-адресом?) 6. Узнать, как защититься от XSS, CSRF атак. Почему и как нужно защищать формы? 7. Узнать, что так CAPTCHA. 8. Научиться загружать файл на сервер. 9. Улучшить фотогалерею — теперь человек сам загружает файлы изображений. Кстати, а точно ли он загружает изображение, а не файл с вирусом?

Комментарии. Обработать форму довольно просто, но гораздо сложнее обеспечить безопасность работы, ведь, к сожалению, пользователи не на 100 % настроены дружелюбно по отношению к вашему приложению. Поэтому важно не просто принимать данные к обработке.

Полезные материалы:

официальная документация про обработку форм;
защищаемся от XSS;
защищаемся от CSRF-атак.

Часть 9. Простая работа с базами данных

Задача: Структурируем хранение данных.

Цель: Файлы — это хорошо, но совершенно неоптимально.

Ценность: Файлы неудобны для хранения тем, что поиск данных в них усложнён и требует создания дополнительного функционала. Сама работа с ними достаточно медленная и тяжеловесная. Базы данных решают не только эту проблему, но и проблему структурирования данных в системе.

Практика: 1. В сборке, установленной на 1 занятии, есть СУБД (скорее всего MySQL). Научиться подключаться к ней при помощи клиента. Например, HeidiSQL. 2. Научиться создавать простые таблицы с данными. 3. Узнать, что такое 3-нормальная форма и как она реализуется на примере таких структур как библиотеки, новостные сайты, свойства товаров. 4. Изучить простейшие команды выполнения запросов — SELECT, INSERT, UPDATE, DELETE. 5. Усовершенствовать обработку формы обратной связи — сохранять полученные данные в БД. 6. Что, если в форме передаются файлы? Как их привязать к отзыву? 7. Узнать, что такое SQL-инъекция. Как её избежать?

Комментарии. Практически ни одно современное приложение не обходится без хранилищ. Пока учимся самым простым вещам, чтобы потом их сделать интереснее и сложнее.

Полезные материалы:

о MySQL;
расширение PHP для работы с MySQL;
SQL-инъекции.

Часть 10. Сессии и cookie

Задача: Сохраняем состояние пользователя между запросами.

Цель: Позволить пользователю видеть свою информацию между шагами работы на сайте.

Ценность: Поскольку скрипты PHP постоянно умирают, нужно как-то сохранять их состояние. Можно делать это и в БД, но это неудобно и дорого. Механизм сессий позволяет привязывать пакет данных к пользователю на протяжении его работы с системой. Cookie помогают пользователю проще идентифицировать себя перед сервером.

Практика: 1. Познакомиться с механизмом сессий. Выяснить, сколько хранится сессия, как ею управлять. 2. Создать форму авторизации. Логика простая — человек вводит пару логин пароль. После этого его состояние можно сохранять в базе данных и в сессиях. 3. Узнать, почему нельзя хранить пароль пользователя в открытом виде. Узнать, что такое хэш (md5, blowfish, crc32, base64). 4. Научиться сохранять в сессии данные о пользователе после авторизации. Например, создать два скрипта PHP, и показывать на них имя пользователя в случае, если пользователь авторизован. 5. Познакомиться с механизмом Cookie. Чётко понимать, что можно хранить в них, а что нельзя. Почему Cookie — небезопасное хранилище? 6. Реализовать функционал «Запомнить меня» в форме логина.

Комментарии. Завершающая часть, которая позволяет нам работать с каждым пользователем персонально. Уже после неё можно привязывать к пользователю «Корзину» в интернет-магазине, создавать личные кабинете и т. п.

Полезные материалы:

сессии и Cookies;
подробный пример формы логина;
как правильно хэшировать пароли?

Часть 11. Первое приложение

Задача: Написать первое приложение.

Цель: Вспомнить всё!

Ценность: Не просто же так корпели над блоком?

Практика: 1. Создаём приложение «Личный блог». Пока всё будет очень просто. 2. Модуль «Авторизация». Человек может залогиниться на сайте по заранее созданным логину и паролю, хранимым в БД. 3. Модуль «Роли». Человек может быть анонимом, читателем и админом. Читатель может отправлять сообщения через форму обратной связи. Админу доступна страница создания новых статей (форма). 4. Итого на сайте должны быть следующие страницы: главная со списком статей (например, myblog.com), страница статьи (например, myblog.com/article?id=4 или myblog.com/article/4), страница обратной связи (например, myblog.com/feedback), страница создания статьи (например, myblog.com/new) 5.* Попробуйте улучшить страницу создания новой статьи так, чтобы можно было ещё и редактировать существующие статьи.

Справились?

Да, самостоятельное обучение — это довольно сложный процесс. Но оцените, как приятно ощущается своё первое приложение!

Часть 2 здесь!








<!doctype html>
<html lang="ru" class="no-js no-touch ">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="yandex-verification" content="3019a35aeda6b45d" />
        
    


        
            <script type="text/javascript">
                var html = document.getElementsByTagName('html')[0];
                html.className = html.className.replace('no-js', '');

                window.React = {};
                window.metrics = [];
                window.TEST_ENV = false;
                window.isSuperuser = false;
                window.isStaff = false;
                window.isHeadTeacher = false;

                
            </script>

            
        

        
        


    
        

        
            <script type="text/javascript">
                window.DEBUG_COUNTERS = true;

                var yaParams = {
                    'course_title': 'b',
                    'ab': 'b',
                    'features': JSON.parse('{"category-catalog-redirect": true, "landing-price-mode-switcher": true, "register-instead-of-start-test": true, "main-page-redesign": true, "subscription_genus_basic": true, "adblender": true, "greenlight": true, "phone": true, "professions": true, "course_enrol": true, "new_lessons_page": true, "jivosite": false, "course-page-single-screen": true, "right-price": false, "course_page_header_footer_new": true, "submit-application": false, "prof_dev_certificate": false, "assessment-react": true, "new-events-calendar": true, "new-pre-assessment-screen": true, "recommended_courses": true, "tinkoff_payment": true, "payment-page-3-front-refactor": true, "installment-calculator": true, "boomstream-player": true, "finsystems": true, "new-reviews": true}')
                };
            </script>
        

        <!-- MindBox JavaScript SDK --->
        <script>
            mindbox = window.mindbox || function() { mindbox.queue.push(arguments); };
            mindbox.queue = mindbox.queue || [];
            mindbox('create');
        </script>
        <script src="https://api.mindbox.ru/scripts/v1/tracker.js" async></script>
        <!-- End MindBox JavaScript SDK --->

        <!-- Yandex.Metrika counter -->
        <script type="text/javascript">
            (function (ids) {
                function yamInit(d, w, c, id) {
                    (w[c] = w[c] || []).push(function () {
                        try {
                            const metrika = new Ya.Metrika2({
                                id: id,
                                params: window.yaParams || {},
                                clickmap: true,
                                trackLinks: true,
                                accurateTrackBounce: true,
                                webvisor: true
                            });
                            w.yaMetriks.push(metrika);
                            w['yaCounter' + id] = metrika;
                        } catch (e) {
                        }
                    });

                    var n = d.getElementsByTagName('script')[0],
                        s = d.createElement('script'),
                        f = function () {
                            n.parentNode.insertBefore(s, n);
                        };
                    s.type = 'text/javascript';
                    s.async = true;
                    s.src = 'https://mc.yandex.ru/metrika/tag.js';

                    if (w.opera == '[object Opera]') {
                        d.addEventListener('DOMContentLoaded', f, false);
                    } else {
                        f();
                    }
                }

                window['yaMetriks'] = [];

                (Array.isArray(ids) ? ids : [ids]).forEach(id => {
                    if (id) {
                        yamInit(document, window, 'yandex_metrika_callbacks2', id)
                    }
                })
            })([34531570, 82755226, 93715742])
        </script>
        <!-- /Yandex.Metrika counter -->

        <script type="text/javascript" id="advcakeAsync">
            (function (a) {
                var b = a.createElement('script');
                b.async = 1;
                b.src = '//0gs25f.ru/';
                a = a.getElementsByTagName('script')[0];
                a.parentNode.insertBefore(b, a)
            })(document);
            window.advcake_data = window.advcake_data || [];
        </script>

        
            <script>
                !(function (w, d, t) {
                    w.TiktokAnalyticsObject = t;
                    var ttq = (w[t] = w[t] || []);
                    (ttq.methods = [
                        'page',
                        'track',
                        'identify',
                        'instances',
                        'debug',
                        'on',
                        'off',
                        'once',
                        'ready',
                        'alias',
                        'group',
                        'enableCookie',
                        'disableCookie'
                    ]),
                        (ttq.setAndDefer = function (t, e) {
                            t[e] = function () {
                                t.push([e].concat(Array.prototype.slice.call(arguments, 0)));
                            };
                        });
                    for (var i = 0; i < ttq.methods.length; i++)
                        ttq.setAndDefer(ttq, ttq.methods[i]);
                    (ttq.instance = function (t) {
                        for (var e = ttq._i[t] || [], n = 0; n < ttq.methods.length; n++)
                            ttq.setAndDefer(e, ttq.methods[n]);
                        return e;
                    }),
                        (ttq.load = function (e, n) {
                            var i = 'https://analytics.tiktok.com/i18n/pixel/events.js';
                            (ttq._i = ttq._i || {}),
                                (ttq._i[e] = []),
                                (ttq._i[e]._u = i),
                                (ttq._t = ttq._t || {}),
                                (ttq._t[e] = +new Date()),
                                (ttq._o = ttq._o || {}),
                                (ttq._o[e] = n || {});
                            var o = document.createElement('script');
                            (o.type = 'text/javascript'),
                                (o.async = !0),
                                (o.src = i + '?sdkid=' + e + '&lib=' + t);
                            var a = document.getElementsByTagName('script')[0];
                            a.parentNode.insertBefore(o, a);
                        });

                    ttq.load("C4IDL5C17T561FR1EMKG");
                    ttq.page();
                })(window, document, 'ttq');
            </script>
        

        
            <script>
                window.vkAsyncInit = function () {
                    VK.Retargeting.Init("VK-RTRG-410987-bLXUv");
                    VK.Retargeting.Hit();
                }
            </script>
            <script src="//vk.com/js/api/openapi.js?159" async></script>
            <noscript>
                <img src="https://vk.com/rtrg?p=VK-RTRG-410987-bLXUv"
                     style="position:fixed; left:-999px;" alt="" />
            </noscript>
        

        
            <!-- rick.ai/q -->
            <script type="text/javascript">
                (function(e) {
                    var t = e.createElement("script");
                    t.src = "https://store-b2b.ru/tag.js?id=wsse7xcbtr07r1";
                    t.type = "module";
                    t.async = true;
                    t.crossorigin = "anonymous";
                    e.head.appendChild(t)
                })(document)
            </script>
            <script type="text/javascript" nomodule src="https://store-b2b.ru/tag.js?id=wsse7xcbtr07r1&nomodule"></script>
            <!-- end rick.ai/q -->
        

        
            <script type="text/javascript">
                !(function (n, e, t, r, a, s) {
                  function i(n, r) {
                    const a = e.createElement(t),
                      s = e.getElementsByTagName(t)[0];
                    (a.async = 1),
                      (a.src = n),
                      (a.onerror = r),
                      s.parentNode.insertBefore(a, s);
                  }
                  (n.SalesNinja = ['init', 'start', 'onPersonalization', 'reachGoal'].reduce(
                    (e, t) => {
                      return (
                        (e[t] = function () {
                          const e = Array.prototype.slice.call(arguments);
                          e.unshift(t), n[r].apply(0, e);
                        }),
                        e
                      );
                    },
                    { k: r, ready: !1 }
                  )),
                    (n[r] = function () {
                      let e,
                        t,
                        a = new Promise((n, r) => {
                          (e = n), (t = r);
                        });
                      return (
                        (n[r].r = n[r].r || []).push({ s: e, f: t }),
                        (n[r].c = n[r].c || []).push(arguments),
                        a
                      );
                    }),
                    i(a, () => {
                      i(s);
                    });
                })(
                  window,
                  document,
                  'script',
                  'ninja',
                  'https://cdn.sales-ninja.me/userBundle.js',
                  'https://bundle.sales-ninja.me/userBundle.js'
                );
                ninja('init', 'c20cc0ff-6d2f-42ac-9b66-1103c735a13a');
                ninja('start');
            </script>
        

        
            <script type="text/javascript">
                window.TMR_PIXEL_ID = 3316675;
                var _tmr = window._tmr || (window._tmr = []);
                _tmr.push({id: "3316675", type: "pageView", start: (new Date()).getTime()});
                (function (d, w, id) {
                  if (d.getElementById(id)) return;
                  var ts = d.createElement("script"); ts.type = "text/javascript"; ts.async = true; ts.id = id;
                  ts.src = "https://top-fwz1.mail.ru/js/code.js";
                  var f = function () {var s = d.getElementsByTagName("script")[0]; s.parentNode.insertBefore(ts, s);};
                  if (w.opera == "[object Opera]") { d.addEventListener("DOMContentLoaded", f, false); } else { f(); }
                })(document, window, "tmr-code");
            </script>
            <noscript>
                <div>
                    <img src="https://top-fwz1.mail.ru/counter?id=3316675;js=na"
                         style="position:absolute;left:-9999px;" alt="Top.Mail.Ru" />
                </div>
            </noscript>
        

        <!-- Pixel Tag Code -->
        <script type="text/javascript">
          (function (t, l, g, r, m) {
            t[g] ||
              ((g = t[g] =
                function () {
                  g.run ? g.run.apply(g, arguments) : g.queue.push(arguments);
                }),
              (g.queue = []),
              (t = l.createElement(r)),
              (t.async = !0),
              (t.src = m),
              (l = l.getElementsByTagName(r)[0]),
              l.parentNode.insertBefore(t, l));
          })(window, document, 'tgp', 'script', 'https://telegram.org/js/pixel.js');
          tgp('init', '4bxSybss');
        </script>
        <!-- End Pixel Tag Code -->

        

        <!-- GTM is no more -->
    



        <link rel="canonical" href="https://otus.ru/nest/post/877/"/>
        
            <link rel="amphtml" href="https://otus.ru/nest/post/877/?amp"/>
        

        <title>Программа самостоятельного изучения PHP. Часть 1 | OTUS</title>

        <meta property="og:type" content="website"/>
        <meta property="og:url" content="https://otus.ru/nest/post/877/"/>

        <meta property="og:title" content="Программа самостоятельного изучения PHP. Часть 1 | OTUS">
        <meta property="og:description" content="Программа самостоятельного изучения PHP. Часть 1 в OTUS, только интересные посты!">
        <meta name="description" content="Программа самостоятельного изучения PHP. Часть 1 в OTUS, только интересные посты!">

        <meta property="og:site_name" content="Otus">
        <meta property="fb:app_id" content="486413851704844"/>

        
            <meta property="og:image" content="/static/img/favicons/android-chrome-537x240.jpg?nocache">
            
                <meta property="og:image:width" content="537">
            
            
                <meta property="og:image:height" content="240">
            
            <link href="/static/img/favicons/android-chrome-537x240.jpg" rel="image_src"/>
            <meta property="vk:image" content="/static/img/favicons/android-chrome-537x240.jpg">
        

        <link href="/static/img/favicons/apple-touch-icon.png" rel="apple-touch-icon"/>
        <link href="/static/img/favicons/apple-touch-icon-57x57.png" sizes="57x57" rel="apple-touch-icon"/>
        <link href="/static/img/favicons/apple-touch-icon-60x60.png" sizes="60x60" rel="apple-touch-icon"/>
        <link href="/static/img/favicons/apple-touch-icon-72x72.png" sizes="72x72" rel="apple-touch-icon"/>
        <link href="/static/img/favicons/apple-touch-icon-76x76.png" sizes="76x76" rel="apple-touch-icon"/>
        <link href="/static/img/favicons/apple-touch-icon-114x114.png" sizes="114x114" rel="apple-touch-icon"/>
        <link href="/static/img/favicons/apple-touch-icon-120x120.png" sizes="120x120" rel="apple-touch-icon"/>
        <link href="/static/img/favicons/apple-touch-icon-144x144.png" sizes="144x144" rel="apple-touch-icon"/>
        <link href="/static/img/favicons/apple-touch-icon-152x152.png" sizes="152x152" rel="apple-touch-icon"/>
        <link href="/static/img/favicons/apple-touch-icon-180x180.png" sizes="180x180" rel="apple-touch-icon"/>
        

        <link type="image/png" href="/static/img/favicons/favicon-32x32.png" sizes="32x32" rel="icon"/>
        <link type="image/png" href="/static/img/favicons/favicon-16x16.png" sizes="16x16" rel="icon"/>
        <link type="image/x-icon" href="/static/img/favicons/favicon.ico" rel="shortcut icon"/>
        <link rel="mask-icon" href="/static/img/favicons/safari-pinned-tab.svg" color="#000000"/>

        <meta name="msapplication-TileColor" content="#ffffff">
        <meta name="msapplication-TileImage" content="/static/img/favicons/mstile-144x144.png">
        <meta name="theme-color" content="#FFFFFF"/>

        <link rel="manifest" href="/manifest.json" crossorigin="use-credentials">

        
            <meta name="sw" content="https://otus.ru/static/js/service-worker.8ed2b.js"/>
        
        <meta name="csrf" id="meta-csrf" content="98cnIdrC3MedNnRyysAQqH3CBnsPSagny32UXPBA9IrIAQ92AMGmcmaaoZytf62c"/>
        <meta name="auth" content="false"/>
        <meta name="phone_confirmed" content="false"/>
        <meta name="next" content='{"value": "/nest/post/877/"}'/>
        
        

        
            
                <link href="https://otus.ru/static/css/vendor.react.dd7f4.css" rel="stylesheet" />
<link href="https://otus.ru/static/css/vendor.common.5ac2f.css" rel="stylesheet" />
<link href="https://otus.ru/static/css/otus-react:header-search.37c7a.css" rel="stylesheet" />
                <link href="https://otus.ru/static/css/fonts.211eb.css" rel="stylesheet" />
                <link href="https://otus.ru/static/css/otus-icons.e3e2d.css" rel="stylesheet" />
                
                    <link href="https://otus.ru/static/css/vendor.common.5ac2f.css" rel="stylesheet" />
<link href="https://otus.ru/static/css/vendor.otus-scss.59b5e.css" rel="stylesheet" />
<link href="https://otus.ru/static/css/otus-scss.2de41.css" rel="stylesheet" />
                
                
            
        
    
            <script type="application/ld+json">
            {
    "@context": "https://schema.org",
    "@type": "Organization",
    "name": "Otus",
    "url": "https://otus.ru",
    "logo": "https://otus.ru/__new_static__/img/meta-image.png",
    "sameAs": [
        "https://vk.com/otusru",
        "https://t.me/Otusjava"
    ]
}
            </script>
            </head>
    <body class="  body-header3">
        <script type="application/ld+json">
            {
              "@context" : "http://schema.org",
              "@type" : "Organization",
              "name" : "OTUS",
              "url" : "https://otus.ru",
              "logo": "https://otus.ru/static/img/favicons/apple-touch-icon-180x180.png",
              "sameAs": [
                "",
                "https://www.youtube.com/channel/UCetgtvy93o3i3CvyGXKFU3g",
                "https://www.instagram.com/otus.ru/"
              ],
              "contactPoint": [
                {
                    "@type": "ContactPoint",
                    "telephone": "+7-499-938-92-02",
                    "contactType": "customer service",
                    "areaServed": "RU"
                }
              ]
            }
        </script>
        <!-- TODO FIXME DRY -->>
<script
    src="https://smartcaptcha.yandexcloud.net/captcha.js?render=onload&onload=smartCaptchaInit"
  defer
></script>

<script>
    function smartCaptchaInit() {
        const sitekey = 'ysc1_cM9ClhSx0kwuG9QxSMfFmxHnC1gsW7Axbyddkmzref6982c0';
        const test = false;

        if (!window.smartCaptcha || !sitekey) {
            return;
        }

        const widgetId = window.smartCaptcha.render('captcha-container', {
            sitekey,
            invisible: true,
            test,
            hideShield: true,
        });

    }
</script>

<div id="captcha-container"></div>

        <script src="https://otus.ru/js-18n"></script>
        <script>
            window.texts = {
                companyEmail: "help@otus.ru",
                separateQuestionCount: " из "
            }
            
            window.language = 'ru-ru'
            
                window.config = {
                    isEnablePhoneConfirm: true
                }
            
            
        </script>
        
            <script src="https://otus.ru/js-18n"></script>
            <script>
                window.texts = {
                    companyEmail: "help@otus.ru",
                    separateQuestionCount: " из "
                }
                
                window.language = 'ru-ru'
            </script>
        
        
    <script type="application/ld+json">
        {
            "@context": "https://schema.org",
            "@type": "BlogPosting",
            "mainEntityOfPage": {
              "@type": "WebPage",
              "@id": "https://otus.ru/nest/post/877/"
            },
            "headline": "Программа самостоятельного изучения PHP. Часть 1",
            "image": "",  
            "author": {
                "@type": "Person",
                "name": "Александр",
                "url": "https://otus.ru/profile/45136/"
            },
            "publisher": {
              "@type": "Organization",
              "name": "OTUS",
              "logo": {
                "@type": "ImageObject",
                "url": "https://otus.ru/static/img/favicons/apple-touch-icon-180x180.png"
              }
            },
            "datePublished": "2019-07-29T20:45:08.375167+03:00",
            "dateModified": "2023-12-19T00:45:30.702810+03:00"
        }
    </script>

        <div class="body-wrapper">
            <div class="body body_header3 drawer  body_not-subscribed drawer--right blog-drawer ">
                
                    
                        
                            




    
        <div class="before-header-ui">
    <div class="before-header-ui__ellipse1"></div>
    <div class="before-header-ui__ellipse2"></div>
    <div class="before-header-ui__container">
        <div class="before-header-ui__img before-header-ui__img_sales"></div>
        <div class="before-header-ui__content">
            <div class="before-header-ui__title hide-phone">Курсы по нейросетям со скидкой до 30%</div>
            <div class="before-header-ui__title show-phone">Курсы по нейросетям со скидкой до 30%</div>
        </div>
        <a href="https://otus.ru/catalog/courses?categories=neural_networks&utm_source=internal&utm_medium=free&utm_campaign=otus&utm_term=chank&utm_content=sla_sale_20-02-2026-10-04-2026" rel="nofollow noreferrer noopener" target="_blank" class="before-header-ui__button">Выбрать курс</a>
    </div>
</div>
    


                        
                        
                            

<header class="header3 js-header3">
  <div class="header3__container">
    <a class="header3__logo" href="/">
      <img
        class="header3__logo-img"
        
          src="/static/img/logos/logo-2022-without-text.svg"
        
        
        width="82"
        height="42"
        alt="Logo"
      />
    </a>
    <nav class="header3__nav">
      <div id="headerSearch" class="header3__nav-item header3__nav-item-search">
  <div class="header-search-icon">
    <svg
      class="header-search-icon__icon"
      viewBox="0 0 24 24"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <circle
        cx="11.767"
        cy="11.767"
        r="8.989"
        stroke="currentColor"
        stroke-width="1.5"
        stroke-linecap="round"
        stroke-linejoin="round"
      ></circle>
      <path
        d="M18.018 18.485 21.542 22"
        stroke="currentColor"
        stroke-width="1.5"
        stroke-linecap="round"
        stroke-linejoin="round"
      ></path>
    </svg>
  </div>
</div>
 
      
  
  
    
    
  <div data-name="learning" class="header3__nav-item js-header3-popup-trigger header3__nav-item_only-desktop header3__nav-item_with-hover " >
    
  <span title="Обучение" class="header3__nav-item-arrow-title">Обучение</span>
  <div class="header3__nav-item-arrow-container js-header3-popup-arrow">
    <svg
      width="10"
      height="5"
      viewBox="0 0 10 5"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      class="header3__nav-item-arrow"
    >
      <path
        fill-rule="evenodd"
        clip-rule="evenodd"
        d="M1.10067 0.378818C1.29593 0.183556 1.61251 0.183555 1.80778 0.378818L5.00023 3.57127L8.19272 0.378777C8.38798 0.183515 8.70457 0.183515 8.89983 0.378777C9.09509 0.574039 9.09509 0.890622 8.89983 1.08588L5.3643 4.62142C5.26426 4.72146 5.13237 4.77024 5.00127 4.76777C4.8695 4.77079 4.73676 4.72202 4.6362 4.62146L1.10067 1.08592C0.905408 0.890663 0.905408 0.57408 1.10067 0.378818Z"
        fill="currentColor"
      ></path>
    </svg>
  </div>

    
  </div>
  
  
    
  
    
      <div class="header3__nav-item-popup-wrapper js-header3-popup" data-name="learning" style="display: none;">
        <div class="header3__nav-item-popup-container js-header3-popup-container">
          <div class="header3__nav-item-popup-content">
  



<div class="header3__nav-column">
  
  
  
    
  <div>
    <p class="header3__nav-section-title ">Направления</p>
    
  <div class="header3__nav-section-items header3__nav-section-items_learning header3__nav-section-items_learning_rows-8">
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/programming/"
          >
            Программирование (117)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/architecture/"
          >
            Архитектура (17)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/data-science/"
          >
            Data Science (27)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/operations/"
          >
            Инфраструктура (58)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/gamedev/"
          >
            GameDev (10)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/information-security-courses/"
          >
            Безопасность (15)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/marketing-business/"
          >
            Управление (46)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/analytics/"
          >
            Аналитика и анализ (25)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/business-product/"
          >
            Бизнес и продукт в IT (26)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/import-substitution/"
          >
            Импортозамещение (15)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/testing/"
          >
            Тестирование (12)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/neural_networks/"
          >
            Нейросети (9)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/it-bez-programmirovanija/"
          >
            IT без программирования (19)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/corporate/"
          >
            Корпоративные курсы (27)
          </a>
        
    
    </div>

  </div>

  


</div>

  <div class="header3__nav-column">
    
  
    
  <div>
    <p class="header3__nav-section-title ">События</p>
    
      <div class="header3__nav-section-items  ">
        
  
  <a
    class="header3__nav-section-item"
    href="/lessons/calendar/2026/"
  >
    Календарь запуска курсов
  </a>

  <a
    class="header3__nav-section-item"
    href="/events/near/"
  >
    Календарь мероприятий
  </a>

      </div>
    
  </div>

  


    
  
    
  <div>
    <p class="header3__nav-section-title ">Другое</p>
    
      <div class="header3__nav-section-items  ">
        
    
        <a
          class="header3__nav-section-item"
          href="/categories/spec/"
        >
          Специализации (13)
        </a>
    

    
        <a
          class="header3__nav-section-item"
          href="/categories/online/"
        >
          Подготовительные курсы (14)
        </a>
    

    <a
      class="header3__nav-section-item header3__nav-section-item_bold"
      href="/subscription"
    >
      Подписка на курсы
    </a>
    <a
      class="header3__nav-section-item"
      href="/tests"
    >
      Проверьте свои знания
    </a>

      </div>
    
  </div>

  


  </div>



  <div class="header3__nav-column">
    
  
  
    
  <div>
    <p class="header3__nav-section-title header3__nav-section-items-recommendation-title">OTUS рекомендует</p>
    
      <div class="header3__nav-section-items header3__nav-section-items_not-items header3__nav-section-items-recommendation">
        
  





  




  




<a
  href="/lessons/ai-dlya-analitiki-i-raboty-s-dannymi/"
  class="header3__card-recommendation"
>
  <div
    class="header3__card-recommendation-background"
    style="background: linear-gradient( 90deg,#0A4489, #00316B);"
  ></div>
  <div class="header3__card-recommendation-header">
    <div class="header3__card-recommendation-header-photo-wrapper" style="background: linear-gradient( 90deg,#0A4489, #00316B);">
      <img
        src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAiIGhlaWdodD0iODAiIHZpZXdCb3g9IjAgMCA4MCA4MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoCiAgICAgICAgZD0iTTM1LjAwNDcgNDUuODcyNUMzNS4wMDQ3IDQ2LjkzMDYgMzYuMTA5IDQ3LjU3NTcgMzYuOTYwMyA0Ny4wMTQ5TDQ0LjYyOTIgNDEuOTYzMUM0NS4wMDI5IDQxLjcxNjkgNDUuMjI5OSA0MS4yODUyIDQ1LjIyOTkgNDAuODIwN1YyNi43NDg5QzQ1LjIyOTkgMjYuNzQ4OSA0Ny43ODYyIDI2Ljc0ODkgNTQuMTc3IDIyLjcwNzRDNTcuMzAxMiAyMC43MzE4IDU4Ljg5OCAxOC43NTYxIDU5LjcxNDMgMTcuMjUyNUM2MC4yNDY1IDE2LjI3MjEgNTkuMjUxMSAxNS41NTg4IDU4LjI5NjUgMTYuMDcyM0M1NS4zMjkyIDE3LjY2ODQgNDkuMzkxOCAyMC4wMTMyIDQwLjExNzMgMjAuMDEzMkMzMC44NDI4IDIwLjAxMzIgMjQuOTA1NCAxNy42Njg0IDIxLjkzODEgMTYuMDcyM0MyMC45ODM1IDE1LjU1ODggMTkuOTg4MSAxNi4yNzIxIDIwLjUyMDMgMTcuMjUyNUMyMS4zMzY2IDE4Ljc1NjEgMjIuOTMzNCAyMC43MzE4IDI2LjA1NzcgMjIuNzA3NEMzMi40NDg0IDI2Ljc0ODkgMzUuMDA0NyAyNi43NDg5IDM1LjAwNDcgMjYuNzQ4OVY0NS44NzI1WiIKICAgICAgICBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxlbGxpcHNlIGN4PSIyNi45NTM1IiBjeT0iMzUuNTUyNiIgcng9IjMuOTQ5MTQiIHJ5PSI0LjA4NTMyIiBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxlbGxpcHNlIGN4PSI1My4yODEyIiBjeT0iMzUuNTUyNiIgcng9IjMuOTQ5MTQiIHJ5PSI0LjA4NTMyIiBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0iTTI1LjYzNzIgNTkuNjM1QzI1LjYzNzIgNTguNzk2MSAyNi4yMjY2IDU4LjExNiAyNi45NTM2IDU4LjExNkMyNy42ODA2IDU4LjExNiAyOC4yNyA1OC43OTYxIDI4LjI3IDU5LjYzNVY2Mi4wNDRDMjguMjcgNjIuNDQ2OSAyOC4xMzEzIDYyLjgzMzMgMjcuODg0NCA2My4xMTgxQzI3LjM3MDMgNjMuNzExNCAyNi41MzY4IDYzLjcxMTQgMjYuMDIyOCA2My4xMTgxQzI1Ljc3NTkgNjIuODMzMyAyNS42MzcyIDYyLjQ0NjkgMjUuNjM3MiA2Mi4wNDRWNTkuNjM1WiIKICAgICAgICBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0iTTQ0LjA2NjUgNTkuNjM1QzQ0LjA2NjUgNTguNzk2MSA0NC42NTU5IDU4LjExNiA0NS4zODI5IDU4LjExNkM0Ni4xMDk5IDU4LjExNiA0Ni42OTkzIDU4Ljc5NjEgNDYuNjk5MyA1OS42MzVWNjIuMDQ0QzQ2LjY5OTMgNjIuNDQ2OSA0Ni41NjA2IDYyLjgzMzMgNDYuMzEzOCA2My4xMTgxQzQ1Ljc5OTcgNjMuNzExNCA0NC45NjYyIDYzLjcxMTQgNDQuNDUyMSA2My4xMTgxQzQ0LjIwNTIgNjIuODMzMyA0NC4wNjY1IDYyLjQ0NjkgNDQuMDY2NSA2Mi4wNDRWNTkuNjM1WiIKICAgICAgICBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0iTTI5LjU4NjQgNTkuNjM1QzI5LjU4NjQgNTguNzk2MSAzMC4xNzU3IDU4LjExNiAzMC45MDI3IDU4LjExNkMzMS42Mjk4IDU4LjExNiAzMi4yMTkxIDU4Ljc5NjEgMzIuMjE5MSA1OS42MzVWNjIuMDQ0QzMyLjIxOTEgNjIuNDQ2OSAzMi4wODA0IDYyLjgzMzMgMzEuODMzNiA2My4xMTgxQzMxLjMxOTUgNjMuNzExNCAzMC40ODYgNjMuNzExNCAyOS45NzE5IDYzLjExODFDMjkuNzI1IDYyLjgzMzMgMjkuNTg2NCA2Mi40NDY5IDI5LjU4NjQgNjIuMDQ0VjU5LjYzNVoiCiAgICAgICAgZmlsbD0id2hpdGUiIC8+CiAgICA8cGF0aAogICAgICAgIGQ9Ik00OC4wMTU3IDU5LjYzNUM0OC4wMTU3IDU4Ljc5NjEgNDguNjA1MSA1OC4xMTYgNDkuMzMyMSA1OC4xMTZDNTAuMDU5MSA1OC4xMTYgNTAuNjQ4NSA1OC43OTYxIDUwLjY0ODUgNTkuNjM1VjYyLjA0NEM1MC42NDg1IDYyLjQ0NjkgNTAuNTA5OCA2Mi44MzMzIDUwLjI2MjkgNjMuMTE4MUM0OS43NDg4IDYzLjcxMTQgNDguOTE1MyA2My43MTE0IDQ4LjQwMTIgNjMuMTE4MUM0OC4xNTQ0IDYyLjgzMzMgNDguMDE1NyA2Mi40NDY5IDQ4LjAxNTcgNjIuMDQ0VjU5LjYzNVoiCiAgICAgICAgZmlsbD0id2hpdGUiIC8+CiAgICA8cGF0aAogICAgICAgIGQ9Ik0zMy41MzU1IDU5LjYzNUMzMy41MzU1IDU4Ljc5NjEgMzQuMTI0OSA1OC4xMTYgMzQuODUxOSA1OC4xMTZDMzUuNTc4OSA1OC4xMTYgMzYuMTY4MyA1OC43OTYxIDM2LjE2ODMgNTkuNjM1VjYyLjA0NEMzNi4xNjgzIDYyLjQ0NjkgMzYuMDI5NiA2Mi44MzMzIDM1Ljc4MjcgNjMuMTE4MUMzNS4yNjg2IDYzLjcxMTQgMzQuNDM1MSA2My43MTE0IDMzLjkyMTEgNjMuMTE4MUMzMy42NzQyIDYyLjgzMzMgMzMuNTM1NSA2Mi40NDY5IDMzLjUzNTUgNjIuMDQ0VjU5LjYzNVoiCiAgICAgICAgZmlsbD0id2hpdGUiIC8+CiAgICA8cGF0aAogICAgICAgIGQ9Ik01MS45NjQ4IDU5LjYzNUM1MS45NjQ4IDU4Ljc5NjEgNTIuNTU0MiA1OC4xMTYgNTMuMjgxMiA1OC4xMTZDNTQuMDA4MiA1OC4xMTYgNTQuNTk3NiA1OC43OTYxIDU0LjU5NzYgNTkuNjM1VjYyLjA0NEM1NC41OTc2IDYyLjQ0NjkgNTQuNDU4OSA2Mi44MzMzIDU0LjIxMiA2My4xMTgxQzUzLjY5OCA2My43MTE0IDUyLjg2NDUgNjMuNzExNCA1Mi4zNTA0IDYzLjExODFDNTIuMTAzNSA2Mi44MzMzIDUxLjk2NDggNjIuNDQ2OSA1MS45NjQ4IDYyLjA0NFY1OS42MzVaIgogICAgICAgIGZpbGw9IndoaXRlIiAvPgo8L3N2Zz4="
        class="header3__card-recommendation-header-photo header3__card-recommendation-header-photo_default"
      />
      <img 
        src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAiIGhlaWdodD0iODAiIHZpZXdCb3g9IjAgMCA4MCA4MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxtYXNrIGlkPSJhIiBmaWxsPSIjZmZmIj4KICAgICAgICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIKICAgICAgICAgICAgZD0iTTAgMTJDMCA1LjM3MyA1LjM3MyAwIDEyIDBoNTZjNi42MjcgMCAxMiA1LjM3MyAxMiAxMnY1NmMwIDYuNjI3LTUuMzczIDEyLTEyIDEySDEyQzUuMzczIDgwIDAgNzQuNjI3IDAgNjhWMTJabTM1LjAwNSAzMy44NzNjMCAxLjA1OCAxLjEwNCAxLjcwMyAxLjk1NSAxLjE0Mmw3LjY3LTUuMDUyYy4zNzMtLjI0Ni42LS42NzguNi0xLjE0MlYyNi43NDlzMi41NTYgMCA4Ljk0Ny00LjA0MmMzLjEyNC0xLjk3NSA0LjcyMS0zLjk1MSA1LjUzNy01LjQ1NC41MzMtLjk4MS0uNDYzLTEuNjk0LTEuNDE3LTEuMTgtMi45NjggMS41OTUtOC45MDUgMy45NC0xOC4xOCAzLjk0LTkuMjc0IDAtMTUuMjEyLTIuMzQ1LTE4LjE3OS0zLjk0LS45NTQtLjUxNC0xLjk1LjE5OS0xLjQxOCAxLjE4LjgxNyAxLjUwMyAyLjQxMyAzLjQ3OSA1LjUzOCA1LjQ1NCA2LjM5IDQuMDQyIDguOTQ3IDQuMDQyIDguOTQ3IDQuMDQydjE5LjEyNFptLTguMDUxLTYuMjM1YzIuMTggMCAzLjk0OS0xLjgzIDMuOTQ5LTQuMDg1IDAtMi4yNTctMS43NjgtNC4wODYtMy45NS00LjA4Ni0yLjE4IDAtMy45NDkgMS44My0zLjk0OSA0LjA4NiAwIDIuMjU2IDEuNzY4IDQuMDg1IDMuOTUgNC4wODVabTMwLjI3Ni00LjA4NWMwIDIuMjU2LTEuNzY4IDQuMDg1LTMuOTQ5IDQuMDg1LTIuMTggMC0zLjk0OS0xLjgzLTMuOTQ5LTQuMDg1IDAtMi4yNTcgMS43NjgtNC4wODYgMy45NS00LjA4NiAyLjE4IDAgMy45NDggMS44MyAzLjk0OCA0LjA4NlpNMjYuOTU0IDU4LjExNmMtLjcyNyAwLTEuMzE3LjY4LTEuMzE3IDEuNTE5djIuNDA5YzAgLjQwMy4xMzkuNzkuMzg2IDEuMDc0LjUxNC41OTMgMS4zNDcuNTkzIDEuODYxIDAgLjI0Ny0uMjg1LjM4Ni0uNjcxLjM4Ni0xLjA3NHYtMi40MDljMC0uODM5LS41OS0xLjUxOS0xLjMxNy0xLjUxOVptMTguNDI5IDBjLS43MjcgMC0xLjMxNy42OC0xLjMxNyAxLjUxOXYyLjQwOWMwIC40MDMuMTQuNzkuMzg2IDEuMDc0LjUxNC41OTMgMS4zNDguNTkzIDEuODYyIDAgLjI0Ny0uMjg1LjM4NS0uNjcxLjM4NS0xLjA3NHYtMi40MDljMC0uODM5LS41OS0xLjUxOS0xLjMxNi0xLjUxOVptLTE1Ljc5NyAxLjUxOWMwLS44MzkuNTktMS41MTkgMS4zMTctMS41MTlzMS4zMTYuNjggMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLS4xMzkuNzktLjM4NiAxLjA3NC0uNTE0LjU5My0xLjM0Ny41OTMtMS44NjEgMGExLjY0NSAxLjY0NSAwIDAgMS0uMzg2LTEuMDc0di0yLjQwOVptMTkuNzQ2LTEuNTE5Yy0uNzI3IDAtMS4zMTYuNjgtMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLjEzOC43OS4zODUgMS4wNzQuNTE0LjU5MyAxLjM0OC41OTMgMS44NjIgMCAuMjQ3LS4yODUuMzg1LS42NzEuMzg1LTEuMDc0di0yLjQwOWMwLS44MzktLjU4OS0xLjUxOS0xLjMxNi0xLjUxOVptLTE1Ljc5NyAxLjUxOWMwLS44MzkuNTktMS41MTkgMS4zMTctMS41MTlzMS4zMTYuNjggMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLS4xMzkuNzktLjM4NSAxLjA3NC0uNTE0LjU5My0xLjM0OC41OTMtMS44NjIgMGExLjY0NSAxLjY0NSAwIDAgMS0uMzg2LTEuMDc0di0yLjQwOVptMTkuNzQ2LTEuNTE5Yy0uNzI3IDAtMS4zMTYuNjgtMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLjEzOC43OS4zODUgMS4wNzQuNTE0LjU5MyAxLjM0OC41OTMgMS44NjIgMCAuMjQ3LS4yODUuMzg2LS42NzEuMzg2LTEuMDc0di0yLjQwOWMwLS44MzktLjU5LTEuNTE5LTEuMzE3LTEuNTE5WiIgLz4KICAgIDwvbWFzaz4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIgogICAgICAgIGQ9Ik0wIDEyQzAgNS4zNzMgNS4zNzMgMCAxMiAwaDU2YzYuNjI3IDAgMTIgNS4zNzMgMTIgMTJ2NTZjMCA2LjYyNy01LjM3MyAxMi0xMiAxMkgxMkM1LjM3MyA4MCAwIDc0LjYyNyAwIDY4VjEyWm0zNS4wMDUgMzMuODczYzAgMS4wNTggMS4xMDQgMS43MDMgMS45NTUgMS4xNDJsNy42Ny01LjA1MmMuMzczLS4yNDYuNi0uNjc4LjYtMS4xNDJWMjYuNzQ5czIuNTU2IDAgOC45NDctNC4wNDJjMy4xMjQtMS45NzUgNC43MjEtMy45NTEgNS41MzctNS40NTQuNTMzLS45ODEtLjQ2My0xLjY5NC0xLjQxNy0xLjE4LTIuOTY4IDEuNTk1LTguOTA1IDMuOTQtMTguMTggMy45NC05LjI3NCAwLTE1LjIxMi0yLjM0NS0xOC4xNzktMy45NC0uOTU0LS41MTQtMS45NS4xOTktMS40MTggMS4xOC44MTcgMS41MDMgMi40MTMgMy40NzkgNS41MzggNS40NTQgNi4zOSA0LjA0MiA4Ljk0NyA0LjA0MiA4Ljk0NyA0LjA0MnYxOS4xMjRabS04LjA1MS02LjIzNWMyLjE4IDAgMy45NDktMS44MyAzLjk0OS00LjA4NSAwLTIuMjU3LTEuNzY4LTQuMDg2LTMuOTUtNC4wODYtMi4xOCAwLTMuOTQ5IDEuODMtMy45NDkgNC4wODYgMCAyLjI1NiAxLjc2OCA0LjA4NSAzLjk1IDQuMDg1Wm0zMC4yNzYtNC4wODVjMCAyLjI1Ni0xLjc2OCA0LjA4NS0zLjk0OSA0LjA4NS0yLjE4IDAtMy45NDktMS44My0zLjk0OS00LjA4NSAwLTIuMjU3IDEuNzY4LTQuMDg2IDMuOTUtNC4wODYgMi4xOCAwIDMuOTQ4IDEuODMgMy45NDggNC4wODZaTTI2Ljk1NCA1OC4xMTZjLS43MjcgMC0xLjMxNy42OC0xLjMxNyAxLjUxOXYyLjQwOWMwIC40MDMuMTM5Ljc5LjM4NiAxLjA3NC41MTQuNTkzIDEuMzQ3LjU5MyAxLjg2MSAwIC4yNDctLjI4NS4zODYtLjY3MS4zODYtMS4wNzR2LTIuNDA5YzAtLjgzOS0uNTktMS41MTktMS4zMTctMS41MTlabTE4LjQyOSAwYy0uNzI3IDAtMS4zMTcuNjgtMS4zMTcgMS41MTl2Mi40MDljMCAuNDAzLjE0Ljc5LjM4NiAxLjA3NC41MTQuNTkzIDEuMzQ4LjU5MyAxLjg2MiAwIC4yNDctLjI4NS4zODUtLjY3MS4zODUtMS4wNzR2LTIuNDA5YzAtLjgzOS0uNTktMS41MTktMS4zMTYtMS41MTlabS0xNS43OTcgMS41MTljMC0uODM5LjU5LTEuNTE5IDEuMzE3LTEuNTE5czEuMzE2LjY4IDEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy0uMTM5Ljc5LS4zODYgMS4wNzQtLjUxNC41OTMtMS4zNDcuNTkzLTEuODYxIDBhMS42NDUgMS42NDUgMCAwIDEtLjM4Ni0xLjA3NHYtMi40MDlabTE5Ljc0Ni0xLjUxOWMtLjcyNyAwLTEuMzE2LjY4LTEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy4xMzguNzkuMzg1IDEuMDc0LjUxNC41OTMgMS4zNDguNTkzIDEuODYyIDAgLjI0Ny0uMjg1LjM4NS0uNjcxLjM4NS0xLjA3NHYtMi40MDljMC0uODM5LS41ODktMS41MTktMS4zMTYtMS41MTlabS0xNS43OTcgMS41MTljMC0uODM5LjU5LTEuNTE5IDEuMzE3LTEuNTE5czEuMzE2LjY4IDEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy0uMTM5Ljc5LS4zODUgMS4wNzQtLjUxNC41OTMtMS4zNDguNTkzLTEuODYyIDBhMS42NDUgMS42NDUgMCAwIDEtLjM4Ni0xLjA3NHYtMi40MDlabTE5Ljc0Ni0xLjUxOWMtLjcyNyAwLTEuMzE2LjY4LTEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy4xMzguNzkuMzg1IDEuMDc0LjUxNC41OTMgMS4zNDguNTkzIDEuODYyIDAgLjI0Ny0uMjg1LjM4Ni0uNjcxLjM4Ni0xLjA3NHYtMi40MDljMC0uODM5LS41OS0xLjUxOS0xLjMxNy0xLjUxOVoiCiAgICAgICAgZmlsbD0iI2ZmZiIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0ibTM2Ljk2IDQ3LjAxNSAxLjEgMS42Ny0xLjEtMS42N1ptNy42Ny01LjA1MiAxLjEgMS42Ny0xLjEtMS42N1ptLjYtMTUuMjE0di0yaC0ydjJoMlptOC45NDctNC4wNDIgMS4wNjkgMS42OS0xLjA2OS0xLjY5Wm01LjUzNy01LjQ1NCAxLjc1OC45NTQtMS43NTgtLjk1NFptLTEuNDE3LTEuMTguOTQ3IDEuNzYtLjk0Ny0xLjc2Wm0tMzYuMzU5IDAtLjk0NyAxLjc2Ljk0Ny0xLjc2Wm0tMS40MTggMS4xOCAxLjc1OC0uOTU1LTEuNzU4Ljk1NVptNS41MzggNS40NTQtMS4wNyAxLjY5IDEuMDctMS42OVptOC45NDcgNC4wNDJoMnYtMmgtMnYyWm0tOC45ODIgMzYuMzcgMS41MTEtMS4zMS0xLjUxMSAxLjMxWm0xLjg2MSAwIDEuNTEyIDEuMzA5LTEuNTEyLTEuMzFabTE2LjU2OCAwLTEuNTExIDEuMzA5IDEuNTExLTEuMzFabTEuODYyIDAgMS41MTEgMS4zMDktMS41MTEtMS4zMVptLTE0LjQ4IDAtMS41MTItMS4zMSAxLjUxMiAxLjMxWm0tMS44NjIgMCAxLjUxMS0xLjMxLTEuNTExIDEuMzFabTE4LjQzIDAtMS41MTIgMS4zMDkgMS41MTEtMS4zMVptMS44NiAwIDEuNTEyIDEuMzA5LTEuNTExLTEuMzFabS0xNC40OCAwIDEuNTEyIDEuMzA5LTEuNTExLTEuMzFabS0xLjg2MSAwLTEuNTExIDEuMzA5IDEuNTExLTEuMzFabTE4LjQzIDAgMS41MS0xLjMxLTEuNTEgMS4zMVptMS44NjEgMCAxLjUxMSAxLjMwOS0xLjUxMS0xLjMxWk0xMi0yQzQuMjY4LTItMiA0LjI2OC0yIDEyaDRDMiA2LjQ3NyA2LjQ3NyAyIDEyIDJ2LTRabTU2IDBIMTJ2NGg1NnYtNFptMTQgMTRjMC03LjczMi02LjI2OC0xNC0xNC0xNHY0YzUuNTIzIDAgMTAgNC40NzcgMTAgMTBoNFptMCA1NlYxMmgtNHY1Nmg0Wk02OCA4MmM3LjczMiAwIDE0LTYuMjY4IDE0LTE0aC00YzAgNS41MjMtNC40NzcgMTAtMTAgMTB2NFptLTU2IDBoNTZ2LTRIMTJ2NFpNLTIgNjhjMCA3LjczMiA2LjI2OCAxNCAxNCAxNHYtNEM2LjQ3NyA3OCAyIDczLjUyMyAyIDY4aC00Wm0wLTU2djU2aDRWMTJoLTRabTM3Ljg2IDMzLjM0NWEuNzkxLjc5MSAwIDAgMSAuODEyLS4wMjEuNjU2LjY1NiAwIDAgMSAuMzMzLjU0OWgtNGMwIDIuNDU0IDIuNzE0IDQuMzU1IDUuMDU1IDIuODEybC0yLjItMy4zNFptNy42NjktNS4wNTItNy42NjkgNS4wNTIgMi4yIDMuMzQgNy42Ny01LjA1Mi0yLjIwMS0zLjM0Wm0tLjI5OS41MjhjMC0uMTc4LjA4Ni0uMzg4LjI5OS0uNTI4bDIuMiAzLjM0YTMuMzY1IDMuMzY1IDAgMCAwIDEuNTAxLTIuODEyaC00Wm0wLTE0LjA3MlY0MC44Mmg0VjI2Ljc0OWgtNFptOS44NzgtNS43MzJjLTMuMDk3IDEuOTU5LTUuMTk3IDIuODk1LTYuNDY0IDMuMzRhOC44NDUgOC44NDUgMCAwIDEtMS4yOC4zNjIgMi40MiAyLjQyIDAgMCAxLS4yMDMuMDMxSDQ1LjE5bC4wMTgtLjAwMWguMDJjLjAwMSAwIC4wMDMgMCAuMDAzIDJzLjAwMiAyIC4wMDMgMmguMDU0YTMuMTk2IDMuMTk2IDAgMCAwIC4yNTYtLjAxN2MuMTQ0LS4wMTQuMzI3LS4wMzguNTUyLS4wOC40NS0uMDg0IDEuMDY5LS4yMzggMS44NzUtLjUyMSAxLjYxLS41NjYgMy45ODItMS42NSA3LjI3Ni0zLjczM2wtMi4xMzgtMy4zODFabTQuODQ5LTQuNzE5Yy0uNjM3IDEuMTczLTEuOTgzIDIuOTA2LTQuODQ5IDQuNzE5bDIuMTM4IDMuMzhjMy4zODItMi4xMzggNS4yMy00LjM1NiA2LjIyNi02LjE5bC0zLjUxNS0xLjkwOVptMS4yODcgMS41MzZjLS4xMDYuMDU2LS40OTQuMTczLS45MTYtLjE1OGExLjIzMyAxLjIzMyAwIDAgMS0uNDQ4LS43Ni45ODUuOTg1IDAgMCAxIC4wNzctLjYxOGwzLjUxNSAxLjkwOWMuMzA4LS41NjguNDcyLTEuMjQ4LjM1MS0xLjk2YTIuNzY4IDIuNzY4IDAgMCAwLTEuMDI1LTEuNzE4Yy0xLjAyNi0uODA1LTIuMzg4LS43ODgtMy40NDktLjIxOGwxLjg5NSAzLjUyM1ptLTE5LjEyNyA0LjE4YzkuNjI4IDAgMTUuODg5LTIuNDM4IDE5LjEyNy00LjE4bC0xLjg5NS0zLjUyM2MtMi42OTYgMS40NS04LjMxIDMuNzAyLTE3LjIzMiAzLjcwMnY0Wm0tMTkuMTI2LTQuMThjMy4yMzggMS43NDIgOS40OTkgNC4xOCAxOS4xMjYgNC4xOHYtNGMtOC45MjEgMC0xNC41MzUtMi4yNTMtMTcuMjMxLTMuNzAzbC0xLjg5NSAzLjUyM1ptMS4yODctMS41MzZjLjA0Mi4wNzguMTMxLjMuMDc3LjYxOWExLjIzMiAxLjIzMiAwIDAgMS0uNDQ5Ljc1OWMtLjQyMi4zMy0uODEuMjE1LS45MTUuMTU4bDEuODk1LTMuNTIzYy0xLjA2LS41Ny0yLjQyNC0uNTg3LTMuNDQ5LjIxOGEyLjc2OCAyLjc2OCAwIDAgMC0xLjAyNiAxLjcxOWMtLjEyLjcxMS4wNDMgMS4zOTEuMzUyIDEuOTU5bDMuNTE1LTEuOTA5Wm00Ljg0OSA0LjcxOWMtMi44NjctMS44MTMtNC4yMTItMy41NDYtNC44NDktNC43MTlsLTMuNTE1IDEuOTA5Yy45OTUgMS44MzQgMi44NDQgNC4wNTIgNi4yMjYgNi4xOWwyLjEzOC0zLjM4Wm03Ljg3OCA1LjczMmMwLTIgLjAwMS0yIC4wMDMtMkgzNS4wNDdsLjAyNS4wMDFoLjAwMWEyLjQyIDIuNDIgMCAwIDEtLjIwMi0uMDMgOC44NTIgOC44NTIgMCAwIDEtMS4yOC0uMzYzYy0xLjI2Ny0uNDQ1LTMuMzY3LTEuMzgxLTYuNDY0LTMuMzRsLTIuMTM4IDMuMzhjMy4yOTMgMi4wODQgNS42NjYgMy4xNjggNy4yNzYgMy43MzQuODA2LjI4MyAxLjQyNS40MzcgMS44NzUuNTJhNi4zNTYgNi4zNTYgMCAwIDAgLjczNy4wOTVsLjA3MS4wMDJoLjA1NGMuMDAxIDAgLjAwMyAwIC4wMDMtMlptMiAxOS4xMjRWMjYuNzQ5aC00djE5LjEyNGg0Wm0tOC4xMDItMTAuMzJjMCAxLjIxNi0uOTM2IDIuMDg1LTEuOTUgMi4wODV2NGMzLjM1IDAgNS45NS0yLjc4OSA1Ljk1LTYuMDg1aC00Wm0tMS45NS0yLjA4NmMxLjAxNCAwIDEuOTUuODcgMS45NSAyLjA4Nmg0YzAtMy4yOTctMi42LTYuMDg2LTUuOTUtNi4wODZ2NFptLTEuOTQ5IDIuMDg2YzAtMS4yMTYuOTM2LTIuMDg2IDEuOTUtMi4wODZ2LTRjLTMuMzUgMC01Ljk1IDIuNzktNS45NSA2LjA4Nmg0Wm0xLjk1IDIuMDg1Yy0xLjAxNCAwLTEuOTUtLjg3LTEuOTUtMi4wODVoLTRjMCAzLjI5NiAyLjYgNi4wODUgNS45NSA2LjA4NXYtNFptMjYuMzI3IDRjMy4zNSAwIDUuOTUtMi43ODkgNS45NS02LjA4NWgtNGMwIDEuMjE2LS45MzcgMi4wODUtMS45NSAyLjA4NXY0Wm0tNS45NDktNi4wODVjMCAzLjI5NiAyLjYgNi4wODUgNS45NSA2LjA4NXYtNGMtMS4wMTQgMC0xLjk1LS44Ny0xLjk1LTIuMDg1aC00Wm01Ljk1LTYuMDg2Yy0zLjM1IDAtNS45NSAyLjc5LTUuOTUgNi4wODZoNGMwLTEuMjE2LjkzNi0yLjA4NiAxLjk1LTIuMDg2di00Wm01Ljk0OCA2LjA4NmMwLTMuMjk3LTIuNi02LjA4Ni01Ljk0OS02LjA4NnY0YzEuMDEzIDAgMS45NS44NyAxLjk1IDIuMDg2aDRaTTI3LjYzNyA1OS42MzVhLjM3LjM3IDAgMCAxLS4xMDMuMjM2Ljc3NC43NzQgMCAwIDEtLjU4LjI0NXYtNGMtMi4wOTEgMC0zLjMxNyAxLjg1NC0zLjMxNyAzLjUxOWg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjEwMy0uMjM2YS40NS40NSAwIDAgMSAuMDg2LjE0Mi4yNzcuMjc3IDAgMCAxIC4wMTcuMDk0aC00YzAgLjg0OC4yOSAxLjcxLjg3NCAyLjM4NGwzLjAyMy0yLjYyWm0tMS4xNjEgMGEuNzc2Ljc3NiAwIDAgMSAuNTgtLjI0NWMuMjcgMCAuNDc2LjEyNC41ODEuMjQ1bC0zLjAyMyAyLjYyYzEuMzEyIDEuNTEzIDMuNTczIDEuNTEzIDQuODg1IDBsLTMuMDIzLTIuNjJabS0uMTAzLjIzNmMwLS4wMjcuMDA0LS4wNTguMDE3LS4wOTRhLjQ1LjQ1IDAgMCAxIC4wODYtLjE0MmwzLjAyMyAyLjYyYTMuNjQ0IDMuNjQ0IDAgMCAwIC44NzQtMi4zODRoLTRabTAtMi40MDl2Mi40MDloNHYtMi40MDloLTRabS42ODMuNDgxYy0uMjkgMC0uNDktLjE0LS41OC0uMjQ1YS4zNy4zNyAwIDAgMS0uMTAzLS4yMzZoNGMwLTEuNjY1LTEuMjI2LTMuNTE5LTMuMzE3LTMuNTE5djRabTE5LjExMy0uNDgxYS4zNy4zNyAwIDAgMS0uMTAyLjIzNi43NzQuNzc0IDAgMCAxLS41ODEuMjQ1di00Yy0yLjA5MSAwLTMuMzE3IDEuODU0LTMuMzE3IDMuNTE5aDRabTAgMi40MDl2LTIuNDA5aC00djIuNDA5aDRabS0uMTAyLS4yMzZhLjQ1LjQ1IDAgMCAxIC4wODUuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxNy4wOTRoLTRjMCAuODQ4LjI5IDEuNzEuODc1IDIuMzg0bDMuMDIzLTIuNjJabS0xLjE2MiAwYS43NzUuNzc1IDAgMCAxIC41OC0uMjQ1Yy4yNzEgMCAuNDc3LjEyNC41ODIuMjQ1bC0zLjAyMyAyLjYyYzEuMzExIDEuNTEzIDMuNTczIDEuNTEzIDQuODg0IDBsLTMuMDIzLTIuNjJabS0uMTAzLjIzNmMwLS4wMjcuMDA1LS4wNTguMDE4LS4wOTRhLjQ1LjQ1IDAgMCAxIC4wODUtLjE0MmwzLjAyMyAyLjYyYTMuNjQ1IDMuNjQ1IDAgMCAwIC44NzQtMi4zODRoLTRabTAtMi40MDl2Mi40MDloNHYtMi40MDloLTRabS42ODQuNDgxYy0uMjkgMC0uNDktLjE0LS41OC0uMjQ1YS4zNjkuMzY5IDAgMCAxLS4xMDQtLjIzNmg0YzAtMS42NjUtMS4yMjUtMy41MTktMy4zMTYtMy41MTl2NFptLTE0LjQ4LTRjLTIuMDkxIDAtMy4zMTcgMS44NTQtMy4zMTcgMy41MTloNGEuMzcuMzcgMCAwIDEtLjEwMy4yMzYuNzc0Ljc3NCAwIDAgMS0uNTguMjQ1di00Wm0zLjMxNiAzLjUxOWMwLTEuNjY1LTEuMjI1LTMuNTE5LTMuMzE2LTMuNTE5djRjLS4yOSAwLS40OS0uMTQtLjU4LS4yNDVhLjM3LjM3IDAgMCAxLS4xMDQtLjIzNmg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjg3NCAyLjM4NGEzLjY0NCAzLjY0NCAwIDAgMCAuODc0LTIuMzg0aC00YzAtLjAyNy4wMDUtLjA1OC4wMTctLjA5NGEuNDUuNDUgMCAwIDEgLjA4Ni0uMTQybDMuMDIzIDIuNjJabS00Ljg4NSAwYzEuMzEyIDEuNTEzIDMuNTczIDEuNTEzIDQuODg1IDBsLTMuMDIzLTIuNjJhLjc3NS43NzUgMCAwIDEgLjU4LS4yNDVjLjI3IDAgLjQ3Ni4xMjQuNTgxLjI0NWwtMy4wMjMgMi42MlptLS44NzQtMi4zODRjMCAuODQ4LjI5IDEuNzEuODc0IDIuMzg0bDMuMDIzLTIuNjJhLjQ1LjQ1IDAgMCAxIC4wODYuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxNy4wOTRoLTRabTAtMi40MDl2Mi40MDloNHYtMi40MDloLTRabTIyLjQzIDBhLjM3LjM3IDAgMCAxLS4xMDMuMjM2Ljc3NC43NzQgMCAwIDEtLjU4MS4yNDV2LTRjLTIuMDkgMC0zLjMxNiAxLjg1NC0zLjMxNiAzLjUxOWg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjEwMy0uMjM2YS40NTMuNDUzIDAgMCAxIC4wODUuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxOC4wOTRoLTRjMCAuODQ4LjI5IDEuNzEuODc0IDIuMzg0bDMuMDIzLTIuNjJabS0xLjE2MiAwYS43NzYuNzc2IDAgMCAxIC41ODEtLjI0NWMuMjcgMCAuNDc2LjEyNC41OC4yNDVsLTMuMDIyIDIuNjJjMS4zMTEgMS41MTMgMy41NzMgMS41MTMgNC44ODQgMGwtMy4wMjMtMi42MlptLS4xMDMuMjM2YzAtLjAyNy4wMDUtLjA1OC4wMTgtLjA5NGEuNDUuNDUgMCAwIDEgLjA4NS0uMTQybDMuMDIzIDIuNjJhMy42NDQgMy42NDQgMCAwIDAgLjg3NC0yLjM4NGgtNFptMC0yLjQwOXYyLjQwOWg0di0yLjQwOWgtNFptLjY4NC40ODFjLS4yOSAwLS40OS0uMTQtLjU4LS4yNDVhLjM3LjM3IDAgMCAxLS4xMDQtLjIzNmg0YzAtMS42NjUtMS4yMjUtMy41MTktMy4zMTYtMy41MTl2NFptLTE0LjQ4LTRjLTIuMDkxIDAtMy4zMTYgMS44NTQtMy4zMTYgMy41MTloNGEuMzcuMzcgMCAwIDEtLjEwNC4yMzYuNzc0Ljc3NCAwIDAgMS0uNTguMjQ1di00Wm0zLjMxNiAzLjUxOWMwLTEuNjY1LTEuMjI1LTMuNTE5LTMuMzE2LTMuNTE5djRjLS4yOSAwLS40OS0uMTQtLjU4LS4yNDVhLjM3LjM3IDAgMCAxLS4xMDQtLjIzNmg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjg3NCAyLjM4NGEzLjY0NCAzLjY0NCAwIDAgMCAuODc0LTIuMzg0aC00YzAtLjAyNy4wMDUtLjA1OC4wMTgtLjA5NGEuNDUuNDUgMCAwIDEgLjA4NS0uMTQybDMuMDIzIDIuNjJabS00Ljg4NCAwYzEuMzExIDEuNTEzIDMuNTczIDEuNTEzIDQuODg0IDBsLTMuMDIzLTIuNjJhLjc3Ni43NzYgMCAwIDEgLjU4LS4yNDVjLjI3MSAwIC40NzcuMTI0LjU4MS4yNDVsLTMuMDIyIDIuNjJabS0uODc0LTIuMzg0YzAgLjg0OC4yODkgMS43MS44NzQgMi4zODRsMy4wMjMtMi42MmEuNDUzLjQ1MyAwIDAgMSAuMDg1LjE0Mi4yNzcuMjc3IDAgMCAxIC4wMTcuMDk0aC00Wm0wLTIuNDA5djIuNDA5aDR2LTIuNDA5aC00Wm0yMi40MjkgMGEuMzcuMzcgMCAwIDEtLjEwMy4yMzYuNzc0Ljc3NCAwIDAgMS0uNTguMjQ1di00Yy0yLjA5MiAwLTMuMzE3IDEuODU0LTMuMzE3IDMuNTE5aDRabTAgMi40MDl2LTIuNDA5aC00djIuNDA5aDRabS0uMTAzLS4yMzZhLjQ1LjQ1IDAgMCAxIC4wODUuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxOC4wOTRoLTRjMCAuODQ4LjI5IDEuNzEuODc0IDIuMzg0bDMuMDIzLTIuNjJabS0xLjE2MiAwYS43NzYuNzc2IDAgMCAxIC41ODEtLjI0NWMuMjcgMCAuNDc2LjEyNC41OC4yNDVsLTMuMDIyIDIuNjJjMS4zMTIgMS41MTMgMy41NzMgMS41MTMgNC44ODUgMGwtMy4wMjMtMi42MlptLS4xMDIuMjM2YzAtLjAyNy4wMDQtLjA1OC4wMTctLjA5NGEuNDU1LjQ1NSAwIDAgMSAuMDg1LS4xNDJsMy4wMjMgMi42MmEzLjY0NSAzLjY0NSAwIDAgMCAuODc1LTIuMzg0aC00Wm0wLTIuNDA5djIuNDA5aDR2LTIuNDA5aC00Wm0uNjgzLjQ4MWMtLjI5IDAtLjQ5LS4xNC0uNTgtLjI0NWEuMzcuMzcgMCAwIDEtLjEwMy0uMjM2aDRjMC0xLjY2NS0xLjIyNi0zLjUxOS0zLjMxNy0zLjUxOXY0WiIKICAgICAgICBmaWxsPSIjZmZmIiBtYXNrPSJ1cmwoI2EpIiAvPgo8L3N2Zz4="
        class="header3__card-recommendation-header-photo header3__card-recommendation-header-photo_default_inverted"
      />
    </div>
    <div class="header3__card-recommendation-header-content">
      <div class="header3__card-recommendation-header-content-tag">
        
          Курс
        
      </div>
      <div class="header3__card-recommendation-header-sub">
        
          <span
            class="header3__card-recommendation-header-sub-chunk header3__card-recommendation-header-sub-chunk_green"
          >
            Скидка 20000 ₽
          </span>
        
      </div>
    </div>
  </div>
  <h6 class="header3__card-recommendation-title">
    AI для аналитики и работы с данными
  </h6>
  <div class="header3__card-recommendation-footer">
    
      
        12 марта
      
      , 2026
      
        · 2 месяца
      
    
  </div>
</a>


      </div>
    
  </div>

  


  </div>


</div>
          <svg
  class="header3__nav-item-popup-figure"
  viewBox="0 0 600 600"
  fill="none"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M125.573 140.619C131.659 71.6017 210.245 34.9562 267.027 74.6573L553.942 275.262C610.723 314.962 603.117 401.233 540.247 430.55L222.58 578.681C159.71 607.997 88.7344 558.37 94.8204 489.355L125.573 140.619Z"
    stroke="#eaeaea"
    class="header3__nav-item-popup-figure-spinner"
  ></path>
  <path
    d="M148.472 246.647C133.624 191.005 184.615 140.013 240.257 154.862L519.856 229.476C575.498 244.325 594.059 313.877 553.266 354.67L348.281 559.656C307.488 600.449 237.935 581.888 223.087 526.246L148.472 246.647Z"
    fill="url(#paint0_linear-learning)"
  ></path>
  <defs>
    <linearGradient
      id="paint0_linear-learning"
      x1="128.696"
      y1="395.739"
      x2="443.538"
      y2="180.173"
      gradientUnits="userSpaceOnUse"
    >
      <stop stop-color="#f9f9f9"></stop>
      <stop offset="1" stop-color="#EBEBEB"></stop>
    </linearGradient>
  </defs>
</svg>

        </div>
      </div>
    
  

  



  

 
      
  
  
    
    
  <div data-name="info" class="header3__nav-item js-header3-popup-trigger header3__nav-item_only-desktop header3__nav-item_with-hover " >
    
  <span title="Информация" class="header3__nav-item-arrow-title">Информация</span>
  <div class="header3__nav-item-arrow-container js-header3-popup-arrow">
    <svg
      width="10"
      height="5"
      viewBox="0 0 10 5"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      class="header3__nav-item-arrow"
    >
      <path
        fill-rule="evenodd"
        clip-rule="evenodd"
        d="M1.10067 0.378818C1.29593 0.183556 1.61251 0.183555 1.80778 0.378818L5.00023 3.57127L8.19272 0.378777C8.38798 0.183515 8.70457 0.183515 8.89983 0.378777C9.09509 0.574039 9.09509 0.890622 8.89983 1.08588L5.3643 4.62142C5.26426 4.72146 5.13237 4.77024 5.00127 4.76777C4.8695 4.77079 4.73676 4.72202 4.6362 4.62146L1.10067 1.08592C0.905408 0.890663 0.905408 0.57408 1.10067 0.378818Z"
        fill="currentColor"
      ></path>
    </svg>
  </div>

    
  </div>
  
  
    
  
    
      <div class="header3__nav-item-popup-wrapper js-header3-popup" data-name="info" style="display: none;">
        <div class="header3__nav-item-popup-container js-header3-popup-container">
          <div class="header3__nav-item-popup-content">
    <div class="header3__nav-column">
  
  
  
    
  <div>
    <p class="header3__nav-section-title ">OTUS</p>
    
      <div class="header3__nav-section-items  ">
        
  
    <a
      class="header3__nav-section-item"
      href="/about"
    >
      О компании
    </a>

    <a
      class="header3__nav-section-item"
      href="/smi/"
    >
      СМИ о нас
    </a>

    <a
      class="header3__nav-section-item   js-stats"
      href="/journal/"
      target="_blank"
      rel="noreferrer nofollow"
      data-event="header;click_otus_journal"
      data-goal="click_otus_journal"
    >
      OTUS Журнал
    </a>

    <a
      class="header3__nav-section-item"
      href="https://direct.otus.ru/"
      target="_blank"
      rel="noreferrer nofollow"
    >
      OTUS Директ
    </a>

    <a
      class="header3__nav-section-item"
      href="/legal/common/"
    >
      Сведения об образовательной организации
    </a>
  

  <a
    class="header3__nav-section-item"
    href="/contacts/"
  >
    Контактная информация
  </a>

      </div>
    
  </div>

  


</div>
<div class="header3__nav-column">
  
  
  
    
  <div>
    <p class="header3__nav-section-title ">Студентам</p>
    
      <div class="header3__nav-section-items  ">
        
  <a
    class="header3__nav-section-item"
    href="/reviews"
  >
    Отзывы
  </a>

  
    <a
      class="header3__nav-section-item"
      target="_blank"
      href="https://landing.otus.ru/about-otus"
    >
      Как выбрать курс
    </a>
    <a
      class="header3__nav-section-item"
      target="_blank"
      href="https://landing.otus.ru/gallery"
    >
      Истории выпускников
    </a>
  

  <a
    class="header3__nav-section-item"
    href="/instructors/"
  >
    Наши преподаватели
  </a>

  <a
    class="header3__nav-section-item"
    href="/employers/all/"
  >
    Наши партнеры
  </a>

  
    <a
      class="header3__nav-section-item"
      href="/about/loyalty/"
    >
      Программа лояльности
    </a>

    <a
      class="header3__nav-section-item"
      href="/faq/"
    >
      Вопросы и ответы
    </a>
  

      </div>
    
  </div>

  


</div>
<div class="header3__nav-column">
  
  
  
    
  <div>
    <p class="header3__nav-section-title ">Преподавателям</p>
    
      <div class="header3__nav-section-items  ">
        
  <a
    class="header3__nav-section-item"
    href="/teach/"
  >
    Стать преподавателем
  </a>

  <a
    class="header3__nav-section-item"
    href="/instructors/"
  >
    Наши преподаватели
  </a>

  
    <a
      class="header3__nav-section-item"
      href="/nest/dlja-prepodavatelej/"
    >
      База знаний
    </a>
  

      </div>
    
  </div>

  


</div>

  <div class="header3__nav-column header3__nav-column_space-between">
    
  
  
    
  <div>
    <p class="header3__nav-section-title header3__nav-section-items-recommendation-title">OTUS рекомендует</p>
    
      <div class="header3__nav-section-items header3__nav-section-items_not-items header3__nav-section-items-recommendation">
        
  





  




  




<a
  href="/lessons/ai-dlya-analitiki-i-raboty-s-dannymi/"
  class="header3__card-recommendation"
>
  <div
    class="header3__card-recommendation-background"
    style="background: linear-gradient( 90deg,#0A4489, #00316B);"
  ></div>
  <div class="header3__card-recommendation-header">
    <div class="header3__card-recommendation-header-photo-wrapper" style="background: linear-gradient( 90deg,#0A4489, #00316B);">
      <img
        src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAiIGhlaWdodD0iODAiIHZpZXdCb3g9IjAgMCA4MCA4MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoCiAgICAgICAgZD0iTTM1LjAwNDcgNDUuODcyNUMzNS4wMDQ3IDQ2LjkzMDYgMzYuMTA5IDQ3LjU3NTcgMzYuOTYwMyA0Ny4wMTQ5TDQ0LjYyOTIgNDEuOTYzMUM0NS4wMDI5IDQxLjcxNjkgNDUuMjI5OSA0MS4yODUyIDQ1LjIyOTkgNDAuODIwN1YyNi43NDg5QzQ1LjIyOTkgMjYuNzQ4OSA0Ny43ODYyIDI2Ljc0ODkgNTQuMTc3IDIyLjcwNzRDNTcuMzAxMiAyMC43MzE4IDU4Ljg5OCAxOC43NTYxIDU5LjcxNDMgMTcuMjUyNUM2MC4yNDY1IDE2LjI3MjEgNTkuMjUxMSAxNS41NTg4IDU4LjI5NjUgMTYuMDcyM0M1NS4zMjkyIDE3LjY2ODQgNDkuMzkxOCAyMC4wMTMyIDQwLjExNzMgMjAuMDEzMkMzMC44NDI4IDIwLjAxMzIgMjQuOTA1NCAxNy42Njg0IDIxLjkzODEgMTYuMDcyM0MyMC45ODM1IDE1LjU1ODggMTkuOTg4MSAxNi4yNzIxIDIwLjUyMDMgMTcuMjUyNUMyMS4zMzY2IDE4Ljc1NjEgMjIuOTMzNCAyMC43MzE4IDI2LjA1NzcgMjIuNzA3NEMzMi40NDg0IDI2Ljc0ODkgMzUuMDA0NyAyNi43NDg5IDM1LjAwNDcgMjYuNzQ4OVY0NS44NzI1WiIKICAgICAgICBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxlbGxpcHNlIGN4PSIyNi45NTM1IiBjeT0iMzUuNTUyNiIgcng9IjMuOTQ5MTQiIHJ5PSI0LjA4NTMyIiBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxlbGxpcHNlIGN4PSI1My4yODEyIiBjeT0iMzUuNTUyNiIgcng9IjMuOTQ5MTQiIHJ5PSI0LjA4NTMyIiBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0iTTI1LjYzNzIgNTkuNjM1QzI1LjYzNzIgNTguNzk2MSAyNi4yMjY2IDU4LjExNiAyNi45NTM2IDU4LjExNkMyNy42ODA2IDU4LjExNiAyOC4yNyA1OC43OTYxIDI4LjI3IDU5LjYzNVY2Mi4wNDRDMjguMjcgNjIuNDQ2OSAyOC4xMzEzIDYyLjgzMzMgMjcuODg0NCA2My4xMTgxQzI3LjM3MDMgNjMuNzExNCAyNi41MzY4IDYzLjcxMTQgMjYuMDIyOCA2My4xMTgxQzI1Ljc3NTkgNjIuODMzMyAyNS42MzcyIDYyLjQ0NjkgMjUuNjM3MiA2Mi4wNDRWNTkuNjM1WiIKICAgICAgICBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0iTTQ0LjA2NjUgNTkuNjM1QzQ0LjA2NjUgNTguNzk2MSA0NC42NTU5IDU4LjExNiA0NS4zODI5IDU4LjExNkM0Ni4xMDk5IDU4LjExNiA0Ni42OTkzIDU4Ljc5NjEgNDYuNjk5MyA1OS42MzVWNjIuMDQ0QzQ2LjY5OTMgNjIuNDQ2OSA0Ni41NjA2IDYyLjgzMzMgNDYuMzEzOCA2My4xMTgxQzQ1Ljc5OTcgNjMuNzExNCA0NC45NjYyIDYzLjcxMTQgNDQuNDUyMSA2My4xMTgxQzQ0LjIwNTIgNjIuODMzMyA0NC4wNjY1IDYyLjQ0NjkgNDQuMDY2NSA2Mi4wNDRWNTkuNjM1WiIKICAgICAgICBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0iTTI5LjU4NjQgNTkuNjM1QzI5LjU4NjQgNTguNzk2MSAzMC4xNzU3IDU4LjExNiAzMC45MDI3IDU4LjExNkMzMS42Mjk4IDU4LjExNiAzMi4yMTkxIDU4Ljc5NjEgMzIuMjE5MSA1OS42MzVWNjIuMDQ0QzMyLjIxOTEgNjIuNDQ2OSAzMi4wODA0IDYyLjgzMzMgMzEuODMzNiA2My4xMTgxQzMxLjMxOTUgNjMuNzExNCAzMC40ODYgNjMuNzExNCAyOS45NzE5IDYzLjExODFDMjkuNzI1IDYyLjgzMzMgMjkuNTg2NCA2Mi40NDY5IDI5LjU4NjQgNjIuMDQ0VjU5LjYzNVoiCiAgICAgICAgZmlsbD0id2hpdGUiIC8+CiAgICA8cGF0aAogICAgICAgIGQ9Ik00OC4wMTU3IDU5LjYzNUM0OC4wMTU3IDU4Ljc5NjEgNDguNjA1MSA1OC4xMTYgNDkuMzMyMSA1OC4xMTZDNTAuMDU5MSA1OC4xMTYgNTAuNjQ4NSA1OC43OTYxIDUwLjY0ODUgNTkuNjM1VjYyLjA0NEM1MC42NDg1IDYyLjQ0NjkgNTAuNTA5OCA2Mi44MzMzIDUwLjI2MjkgNjMuMTE4MUM0OS43NDg4IDYzLjcxMTQgNDguOTE1MyA2My43MTE0IDQ4LjQwMTIgNjMuMTE4MUM0OC4xNTQ0IDYyLjgzMzMgNDguMDE1NyA2Mi40NDY5IDQ4LjAxNTcgNjIuMDQ0VjU5LjYzNVoiCiAgICAgICAgZmlsbD0id2hpdGUiIC8+CiAgICA8cGF0aAogICAgICAgIGQ9Ik0zMy41MzU1IDU5LjYzNUMzMy41MzU1IDU4Ljc5NjEgMzQuMTI0OSA1OC4xMTYgMzQuODUxOSA1OC4xMTZDMzUuNTc4OSA1OC4xMTYgMzYuMTY4MyA1OC43OTYxIDM2LjE2ODMgNTkuNjM1VjYyLjA0NEMzNi4xNjgzIDYyLjQ0NjkgMzYuMDI5NiA2Mi44MzMzIDM1Ljc4MjcgNjMuMTE4MUMzNS4yNjg2IDYzLjcxMTQgMzQuNDM1MSA2My43MTE0IDMzLjkyMTEgNjMuMTE4MUMzMy42NzQyIDYyLjgzMzMgMzMuNTM1NSA2Mi40NDY5IDMzLjUzNTUgNjIuMDQ0VjU5LjYzNVoiCiAgICAgICAgZmlsbD0id2hpdGUiIC8+CiAgICA8cGF0aAogICAgICAgIGQ9Ik01MS45NjQ4IDU5LjYzNUM1MS45NjQ4IDU4Ljc5NjEgNTIuNTU0MiA1OC4xMTYgNTMuMjgxMiA1OC4xMTZDNTQuMDA4MiA1OC4xMTYgNTQuNTk3NiA1OC43OTYxIDU0LjU5NzYgNTkuNjM1VjYyLjA0NEM1NC41OTc2IDYyLjQ0NjkgNTQuNDU4OSA2Mi44MzMzIDU0LjIxMiA2My4xMTgxQzUzLjY5OCA2My43MTE0IDUyLjg2NDUgNjMuNzExNCA1Mi4zNTA0IDYzLjExODFDNTIuMTAzNSA2Mi44MzMzIDUxLjk2NDggNjIuNDQ2OSA1MS45NjQ4IDYyLjA0NFY1OS42MzVaIgogICAgICAgIGZpbGw9IndoaXRlIiAvPgo8L3N2Zz4="
        class="header3__card-recommendation-header-photo header3__card-recommendation-header-photo_default"
      />
      <img 
        src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAiIGhlaWdodD0iODAiIHZpZXdCb3g9IjAgMCA4MCA4MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxtYXNrIGlkPSJhIiBmaWxsPSIjZmZmIj4KICAgICAgICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIKICAgICAgICAgICAgZD0iTTAgMTJDMCA1LjM3MyA1LjM3MyAwIDEyIDBoNTZjNi42MjcgMCAxMiA1LjM3MyAxMiAxMnY1NmMwIDYuNjI3LTUuMzczIDEyLTEyIDEySDEyQzUuMzczIDgwIDAgNzQuNjI3IDAgNjhWMTJabTM1LjAwNSAzMy44NzNjMCAxLjA1OCAxLjEwNCAxLjcwMyAxLjk1NSAxLjE0Mmw3LjY3LTUuMDUyYy4zNzMtLjI0Ni42LS42NzguNi0xLjE0MlYyNi43NDlzMi41NTYgMCA4Ljk0Ny00LjA0MmMzLjEyNC0xLjk3NSA0LjcyMS0zLjk1MSA1LjUzNy01LjQ1NC41MzMtLjk4MS0uNDYzLTEuNjk0LTEuNDE3LTEuMTgtMi45NjggMS41OTUtOC45MDUgMy45NC0xOC4xOCAzLjk0LTkuMjc0IDAtMTUuMjEyLTIuMzQ1LTE4LjE3OS0zLjk0LS45NTQtLjUxNC0xLjk1LjE5OS0xLjQxOCAxLjE4LjgxNyAxLjUwMyAyLjQxMyAzLjQ3OSA1LjUzOCA1LjQ1NCA2LjM5IDQuMDQyIDguOTQ3IDQuMDQyIDguOTQ3IDQuMDQydjE5LjEyNFptLTguMDUxLTYuMjM1YzIuMTggMCAzLjk0OS0xLjgzIDMuOTQ5LTQuMDg1IDAtMi4yNTctMS43NjgtNC4wODYtMy45NS00LjA4Ni0yLjE4IDAtMy45NDkgMS44My0zLjk0OSA0LjA4NiAwIDIuMjU2IDEuNzY4IDQuMDg1IDMuOTUgNC4wODVabTMwLjI3Ni00LjA4NWMwIDIuMjU2LTEuNzY4IDQuMDg1LTMuOTQ5IDQuMDg1LTIuMTggMC0zLjk0OS0xLjgzLTMuOTQ5LTQuMDg1IDAtMi4yNTcgMS43NjgtNC4wODYgMy45NS00LjA4NiAyLjE4IDAgMy45NDggMS44MyAzLjk0OCA0LjA4NlpNMjYuOTU0IDU4LjExNmMtLjcyNyAwLTEuMzE3LjY4LTEuMzE3IDEuNTE5djIuNDA5YzAgLjQwMy4xMzkuNzkuMzg2IDEuMDc0LjUxNC41OTMgMS4zNDcuNTkzIDEuODYxIDAgLjI0Ny0uMjg1LjM4Ni0uNjcxLjM4Ni0xLjA3NHYtMi40MDljMC0uODM5LS41OS0xLjUxOS0xLjMxNy0xLjUxOVptMTguNDI5IDBjLS43MjcgMC0xLjMxNy42OC0xLjMxNyAxLjUxOXYyLjQwOWMwIC40MDMuMTQuNzkuMzg2IDEuMDc0LjUxNC41OTMgMS4zNDguNTkzIDEuODYyIDAgLjI0Ny0uMjg1LjM4NS0uNjcxLjM4NS0xLjA3NHYtMi40MDljMC0uODM5LS41OS0xLjUxOS0xLjMxNi0xLjUxOVptLTE1Ljc5NyAxLjUxOWMwLS44MzkuNTktMS41MTkgMS4zMTctMS41MTlzMS4zMTYuNjggMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLS4xMzkuNzktLjM4NiAxLjA3NC0uNTE0LjU5My0xLjM0Ny41OTMtMS44NjEgMGExLjY0NSAxLjY0NSAwIDAgMS0uMzg2LTEuMDc0di0yLjQwOVptMTkuNzQ2LTEuNTE5Yy0uNzI3IDAtMS4zMTYuNjgtMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLjEzOC43OS4zODUgMS4wNzQuNTE0LjU5MyAxLjM0OC41OTMgMS44NjIgMCAuMjQ3LS4yODUuMzg1LS42NzEuMzg1LTEuMDc0di0yLjQwOWMwLS44MzktLjU4OS0xLjUxOS0xLjMxNi0xLjUxOVptLTE1Ljc5NyAxLjUxOWMwLS44MzkuNTktMS41MTkgMS4zMTctMS41MTlzMS4zMTYuNjggMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLS4xMzkuNzktLjM4NSAxLjA3NC0uNTE0LjU5My0xLjM0OC41OTMtMS44NjIgMGExLjY0NSAxLjY0NSAwIDAgMS0uMzg2LTEuMDc0di0yLjQwOVptMTkuNzQ2LTEuNTE5Yy0uNzI3IDAtMS4zMTYuNjgtMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLjEzOC43OS4zODUgMS4wNzQuNTE0LjU5MyAxLjM0OC41OTMgMS44NjIgMCAuMjQ3LS4yODUuMzg2LS42NzEuMzg2LTEuMDc0di0yLjQwOWMwLS44MzktLjU5LTEuNTE5LTEuMzE3LTEuNTE5WiIgLz4KICAgIDwvbWFzaz4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIgogICAgICAgIGQ9Ik0wIDEyQzAgNS4zNzMgNS4zNzMgMCAxMiAwaDU2YzYuNjI3IDAgMTIgNS4zNzMgMTIgMTJ2NTZjMCA2LjYyNy01LjM3MyAxMi0xMiAxMkgxMkM1LjM3MyA4MCAwIDc0LjYyNyAwIDY4VjEyWm0zNS4wMDUgMzMuODczYzAgMS4wNTggMS4xMDQgMS43MDMgMS45NTUgMS4xNDJsNy42Ny01LjA1MmMuMzczLS4yNDYuNi0uNjc4LjYtMS4xNDJWMjYuNzQ5czIuNTU2IDAgOC45NDctNC4wNDJjMy4xMjQtMS45NzUgNC43MjEtMy45NTEgNS41MzctNS40NTQuNTMzLS45ODEtLjQ2My0xLjY5NC0xLjQxNy0xLjE4LTIuOTY4IDEuNTk1LTguOTA1IDMuOTQtMTguMTggMy45NC05LjI3NCAwLTE1LjIxMi0yLjM0NS0xOC4xNzktMy45NC0uOTU0LS41MTQtMS45NS4xOTktMS40MTggMS4xOC44MTcgMS41MDMgMi40MTMgMy40NzkgNS41MzggNS40NTQgNi4zOSA0LjA0MiA4Ljk0NyA0LjA0MiA4Ljk0NyA0LjA0MnYxOS4xMjRabS04LjA1MS02LjIzNWMyLjE4IDAgMy45NDktMS44MyAzLjk0OS00LjA4NSAwLTIuMjU3LTEuNzY4LTQuMDg2LTMuOTUtNC4wODYtMi4xOCAwLTMuOTQ5IDEuODMtMy45NDkgNC4wODYgMCAyLjI1NiAxLjc2OCA0LjA4NSAzLjk1IDQuMDg1Wm0zMC4yNzYtNC4wODVjMCAyLjI1Ni0xLjc2OCA0LjA4NS0zLjk0OSA0LjA4NS0yLjE4IDAtMy45NDktMS44My0zLjk0OS00LjA4NSAwLTIuMjU3IDEuNzY4LTQuMDg2IDMuOTUtNC4wODYgMi4xOCAwIDMuOTQ4IDEuODMgMy45NDggNC4wODZaTTI2Ljk1NCA1OC4xMTZjLS43MjcgMC0xLjMxNy42OC0xLjMxNyAxLjUxOXYyLjQwOWMwIC40MDMuMTM5Ljc5LjM4NiAxLjA3NC41MTQuNTkzIDEuMzQ3LjU5MyAxLjg2MSAwIC4yNDctLjI4NS4zODYtLjY3MS4zODYtMS4wNzR2LTIuNDA5YzAtLjgzOS0uNTktMS41MTktMS4zMTctMS41MTlabTE4LjQyOSAwYy0uNzI3IDAtMS4zMTcuNjgtMS4zMTcgMS41MTl2Mi40MDljMCAuNDAzLjE0Ljc5LjM4NiAxLjA3NC41MTQuNTkzIDEuMzQ4LjU5MyAxLjg2MiAwIC4yNDctLjI4NS4zODUtLjY3MS4zODUtMS4wNzR2LTIuNDA5YzAtLjgzOS0uNTktMS41MTktMS4zMTYtMS41MTlabS0xNS43OTcgMS41MTljMC0uODM5LjU5LTEuNTE5IDEuMzE3LTEuNTE5czEuMzE2LjY4IDEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy0uMTM5Ljc5LS4zODYgMS4wNzQtLjUxNC41OTMtMS4zNDcuNTkzLTEuODYxIDBhMS42NDUgMS42NDUgMCAwIDEtLjM4Ni0xLjA3NHYtMi40MDlabTE5Ljc0Ni0xLjUxOWMtLjcyNyAwLTEuMzE2LjY4LTEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy4xMzguNzkuMzg1IDEuMDc0LjUxNC41OTMgMS4zNDguNTkzIDEuODYyIDAgLjI0Ny0uMjg1LjM4NS0uNjcxLjM4NS0xLjA3NHYtMi40MDljMC0uODM5LS41ODktMS41MTktMS4zMTYtMS41MTlabS0xNS43OTcgMS41MTljMC0uODM5LjU5LTEuNTE5IDEuMzE3LTEuNTE5czEuMzE2LjY4IDEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy0uMTM5Ljc5LS4zODUgMS4wNzQtLjUxNC41OTMtMS4zNDguNTkzLTEuODYyIDBhMS42NDUgMS42NDUgMCAwIDEtLjM4Ni0xLjA3NHYtMi40MDlabTE5Ljc0Ni0xLjUxOWMtLjcyNyAwLTEuMzE2LjY4LTEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy4xMzguNzkuMzg1IDEuMDc0LjUxNC41OTMgMS4zNDguNTkzIDEuODYyIDAgLjI0Ny0uMjg1LjM4Ni0uNjcxLjM4Ni0xLjA3NHYtMi40MDljMC0uODM5LS41OS0xLjUxOS0xLjMxNy0xLjUxOVoiCiAgICAgICAgZmlsbD0iI2ZmZiIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0ibTM2Ljk2IDQ3LjAxNSAxLjEgMS42Ny0xLjEtMS42N1ptNy42Ny01LjA1MiAxLjEgMS42Ny0xLjEtMS42N1ptLjYtMTUuMjE0di0yaC0ydjJoMlptOC45NDctNC4wNDIgMS4wNjkgMS42OS0xLjA2OS0xLjY5Wm01LjUzNy01LjQ1NCAxLjc1OC45NTQtMS43NTgtLjk1NFptLTEuNDE3LTEuMTguOTQ3IDEuNzYtLjk0Ny0xLjc2Wm0tMzYuMzU5IDAtLjk0NyAxLjc2Ljk0Ny0xLjc2Wm0tMS40MTggMS4xOCAxLjc1OC0uOTU1LTEuNzU4Ljk1NVptNS41MzggNS40NTQtMS4wNyAxLjY5IDEuMDctMS42OVptOC45NDcgNC4wNDJoMnYtMmgtMnYyWm0tOC45ODIgMzYuMzcgMS41MTEtMS4zMS0xLjUxMSAxLjMxWm0xLjg2MSAwIDEuNTEyIDEuMzA5LTEuNTEyLTEuMzFabTE2LjU2OCAwLTEuNTExIDEuMzA5IDEuNTExLTEuMzFabTEuODYyIDAgMS41MTEgMS4zMDktMS41MTEtMS4zMVptLTE0LjQ4IDAtMS41MTItMS4zMSAxLjUxMiAxLjMxWm0tMS44NjIgMCAxLjUxMS0xLjMxLTEuNTExIDEuMzFabTE4LjQzIDAtMS41MTIgMS4zMDkgMS41MTEtMS4zMVptMS44NiAwIDEuNTEyIDEuMzA5LTEuNTExLTEuMzFabS0xNC40OCAwIDEuNTEyIDEuMzA5LTEuNTExLTEuMzFabS0xLjg2MSAwLTEuNTExIDEuMzA5IDEuNTExLTEuMzFabTE4LjQzIDAgMS41MS0xLjMxLTEuNTEgMS4zMVptMS44NjEgMCAxLjUxMSAxLjMwOS0xLjUxMS0xLjMxWk0xMi0yQzQuMjY4LTItMiA0LjI2OC0yIDEyaDRDMiA2LjQ3NyA2LjQ3NyAyIDEyIDJ2LTRabTU2IDBIMTJ2NGg1NnYtNFptMTQgMTRjMC03LjczMi02LjI2OC0xNC0xNC0xNHY0YzUuNTIzIDAgMTAgNC40NzcgMTAgMTBoNFptMCA1NlYxMmgtNHY1Nmg0Wk02OCA4MmM3LjczMiAwIDE0LTYuMjY4IDE0LTE0aC00YzAgNS41MjMtNC40NzcgMTAtMTAgMTB2NFptLTU2IDBoNTZ2LTRIMTJ2NFpNLTIgNjhjMCA3LjczMiA2LjI2OCAxNCAxNCAxNHYtNEM2LjQ3NyA3OCAyIDczLjUyMyAyIDY4aC00Wm0wLTU2djU2aDRWMTJoLTRabTM3Ljg2IDMzLjM0NWEuNzkxLjc5MSAwIDAgMSAuODEyLS4wMjEuNjU2LjY1NiAwIDAgMSAuMzMzLjU0OWgtNGMwIDIuNDU0IDIuNzE0IDQuMzU1IDUuMDU1IDIuODEybC0yLjItMy4zNFptNy42NjktNS4wNTItNy42NjkgNS4wNTIgMi4yIDMuMzQgNy42Ny01LjA1Mi0yLjIwMS0zLjM0Wm0tLjI5OS41MjhjMC0uMTc4LjA4Ni0uMzg4LjI5OS0uNTI4bDIuMiAzLjM0YTMuMzY1IDMuMzY1IDAgMCAwIDEuNTAxLTIuODEyaC00Wm0wLTE0LjA3MlY0MC44Mmg0VjI2Ljc0OWgtNFptOS44NzgtNS43MzJjLTMuMDk3IDEuOTU5LTUuMTk3IDIuODk1LTYuNDY0IDMuMzRhOC44NDUgOC44NDUgMCAwIDEtMS4yOC4zNjIgMi40MiAyLjQyIDAgMCAxLS4yMDMuMDMxSDQ1LjE5bC4wMTgtLjAwMWguMDJjLjAwMSAwIC4wMDMgMCAuMDAzIDJzLjAwMiAyIC4wMDMgMmguMDU0YTMuMTk2IDMuMTk2IDAgMCAwIC4yNTYtLjAxN2MuMTQ0LS4wMTQuMzI3LS4wMzguNTUyLS4wOC40NS0uMDg0IDEuMDY5LS4yMzggMS44NzUtLjUyMSAxLjYxLS41NjYgMy45ODItMS42NSA3LjI3Ni0zLjczM2wtMi4xMzgtMy4zODFabTQuODQ5LTQuNzE5Yy0uNjM3IDEuMTczLTEuOTgzIDIuOTA2LTQuODQ5IDQuNzE5bDIuMTM4IDMuMzhjMy4zODItMi4xMzggNS4yMy00LjM1NiA2LjIyNi02LjE5bC0zLjUxNS0xLjkwOVptMS4yODcgMS41MzZjLS4xMDYuMDU2LS40OTQuMTczLS45MTYtLjE1OGExLjIzMyAxLjIzMyAwIDAgMS0uNDQ4LS43Ni45ODUuOTg1IDAgMCAxIC4wNzctLjYxOGwzLjUxNSAxLjkwOWMuMzA4LS41NjguNDcyLTEuMjQ4LjM1MS0xLjk2YTIuNzY4IDIuNzY4IDAgMCAwLTEuMDI1LTEuNzE4Yy0xLjAyNi0uODA1LTIuMzg4LS43ODgtMy40NDktLjIxOGwxLjg5NSAzLjUyM1ptLTE5LjEyNyA0LjE4YzkuNjI4IDAgMTUuODg5LTIuNDM4IDE5LjEyNy00LjE4bC0xLjg5NS0zLjUyM2MtMi42OTYgMS40NS04LjMxIDMuNzAyLTE3LjIzMiAzLjcwMnY0Wm0tMTkuMTI2LTQuMThjMy4yMzggMS43NDIgOS40OTkgNC4xOCAxOS4xMjYgNC4xOHYtNGMtOC45MjEgMC0xNC41MzUtMi4yNTMtMTcuMjMxLTMuNzAzbC0xLjg5NSAzLjUyM1ptMS4yODctMS41MzZjLjA0Mi4wNzguMTMxLjMuMDc3LjYxOWExLjIzMiAxLjIzMiAwIDAgMS0uNDQ5Ljc1OWMtLjQyMi4zMy0uODEuMjE1LS45MTUuMTU4bDEuODk1LTMuNTIzYy0xLjA2LS41Ny0yLjQyNC0uNTg3LTMuNDQ5LjIxOGEyLjc2OCAyLjc2OCAwIDAgMC0xLjAyNiAxLjcxOWMtLjEyLjcxMS4wNDMgMS4zOTEuMzUyIDEuOTU5bDMuNTE1LTEuOTA5Wm00Ljg0OSA0LjcxOWMtMi44NjctMS44MTMtNC4yMTItMy41NDYtNC44NDktNC43MTlsLTMuNTE1IDEuOTA5Yy45OTUgMS44MzQgMi44NDQgNC4wNTIgNi4yMjYgNi4xOWwyLjEzOC0zLjM4Wm03Ljg3OCA1LjczMmMwLTIgLjAwMS0yIC4wMDMtMkgzNS4wNDdsLjAyNS4wMDFoLjAwMWEyLjQyIDIuNDIgMCAwIDEtLjIwMi0uMDMgOC44NTIgOC44NTIgMCAwIDEtMS4yOC0uMzYzYy0xLjI2Ny0uNDQ1LTMuMzY3LTEuMzgxLTYuNDY0LTMuMzRsLTIuMTM4IDMuMzhjMy4yOTMgMi4wODQgNS42NjYgMy4xNjggNy4yNzYgMy43MzQuODA2LjI4MyAxLjQyNS40MzcgMS44NzUuNTJhNi4zNTYgNi4zNTYgMCAwIDAgLjczNy4wOTVsLjA3MS4wMDJoLjA1NGMuMDAxIDAgLjAwMyAwIC4wMDMtMlptMiAxOS4xMjRWMjYuNzQ5aC00djE5LjEyNGg0Wm0tOC4xMDItMTAuMzJjMCAxLjIxNi0uOTM2IDIuMDg1LTEuOTUgMi4wODV2NGMzLjM1IDAgNS45NS0yLjc4OSA1Ljk1LTYuMDg1aC00Wm0tMS45NS0yLjA4NmMxLjAxNCAwIDEuOTUuODcgMS45NSAyLjA4Nmg0YzAtMy4yOTctMi42LTYuMDg2LTUuOTUtNi4wODZ2NFptLTEuOTQ5IDIuMDg2YzAtMS4yMTYuOTM2LTIuMDg2IDEuOTUtMi4wODZ2LTRjLTMuMzUgMC01Ljk1IDIuNzktNS45NSA2LjA4Nmg0Wm0xLjk1IDIuMDg1Yy0xLjAxNCAwLTEuOTUtLjg3LTEuOTUtMi4wODVoLTRjMCAzLjI5NiAyLjYgNi4wODUgNS45NSA2LjA4NXYtNFptMjYuMzI3IDRjMy4zNSAwIDUuOTUtMi43ODkgNS45NS02LjA4NWgtNGMwIDEuMjE2LS45MzcgMi4wODUtMS45NSAyLjA4NXY0Wm0tNS45NDktNi4wODVjMCAzLjI5NiAyLjYgNi4wODUgNS45NSA2LjA4NXYtNGMtMS4wMTQgMC0xLjk1LS44Ny0xLjk1LTIuMDg1aC00Wm01Ljk1LTYuMDg2Yy0zLjM1IDAtNS45NSAyLjc5LTUuOTUgNi4wODZoNGMwLTEuMjE2LjkzNi0yLjA4NiAxLjk1LTIuMDg2di00Wm01Ljk0OCA2LjA4NmMwLTMuMjk3LTIuNi02LjA4Ni01Ljk0OS02LjA4NnY0YzEuMDEzIDAgMS45NS44NyAxLjk1IDIuMDg2aDRaTTI3LjYzNyA1OS42MzVhLjM3LjM3IDAgMCAxLS4xMDMuMjM2Ljc3NC43NzQgMCAwIDEtLjU4LjI0NXYtNGMtMi4wOTEgMC0zLjMxNyAxLjg1NC0zLjMxNyAzLjUxOWg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjEwMy0uMjM2YS40NS40NSAwIDAgMSAuMDg2LjE0Mi4yNzcuMjc3IDAgMCAxIC4wMTcuMDk0aC00YzAgLjg0OC4yOSAxLjcxLjg3NCAyLjM4NGwzLjAyMy0yLjYyWm0tMS4xNjEgMGEuNzc2Ljc3NiAwIDAgMSAuNTgtLjI0NWMuMjcgMCAuNDc2LjEyNC41ODEuMjQ1bC0zLjAyMyAyLjYyYzEuMzEyIDEuNTEzIDMuNTczIDEuNTEzIDQuODg1IDBsLTMuMDIzLTIuNjJabS0uMTAzLjIzNmMwLS4wMjcuMDA0LS4wNTguMDE3LS4wOTRhLjQ1LjQ1IDAgMCAxIC4wODYtLjE0MmwzLjAyMyAyLjYyYTMuNjQ0IDMuNjQ0IDAgMCAwIC44NzQtMi4zODRoLTRabTAtMi40MDl2Mi40MDloNHYtMi40MDloLTRabS42ODMuNDgxYy0uMjkgMC0uNDktLjE0LS41OC0uMjQ1YS4zNy4zNyAwIDAgMS0uMTAzLS4yMzZoNGMwLTEuNjY1LTEuMjI2LTMuNTE5LTMuMzE3LTMuNTE5djRabTE5LjExMy0uNDgxYS4zNy4zNyAwIDAgMS0uMTAyLjIzNi43NzQuNzc0IDAgMCAxLS41ODEuMjQ1di00Yy0yLjA5MSAwLTMuMzE3IDEuODU0LTMuMzE3IDMuNTE5aDRabTAgMi40MDl2LTIuNDA5aC00djIuNDA5aDRabS0uMTAyLS4yMzZhLjQ1LjQ1IDAgMCAxIC4wODUuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxNy4wOTRoLTRjMCAuODQ4LjI5IDEuNzEuODc1IDIuMzg0bDMuMDIzLTIuNjJabS0xLjE2MiAwYS43NzUuNzc1IDAgMCAxIC41OC0uMjQ1Yy4yNzEgMCAuNDc3LjEyNC41ODIuMjQ1bC0zLjAyMyAyLjYyYzEuMzExIDEuNTEzIDMuNTczIDEuNTEzIDQuODg0IDBsLTMuMDIzLTIuNjJabS0uMTAzLjIzNmMwLS4wMjcuMDA1LS4wNTguMDE4LS4wOTRhLjQ1LjQ1IDAgMCAxIC4wODUtLjE0MmwzLjAyMyAyLjYyYTMuNjQ1IDMuNjQ1IDAgMCAwIC44NzQtMi4zODRoLTRabTAtMi40MDl2Mi40MDloNHYtMi40MDloLTRabS42ODQuNDgxYy0uMjkgMC0uNDktLjE0LS41OC0uMjQ1YS4zNjkuMzY5IDAgMCAxLS4xMDQtLjIzNmg0YzAtMS42NjUtMS4yMjUtMy41MTktMy4zMTYtMy41MTl2NFptLTE0LjQ4LTRjLTIuMDkxIDAtMy4zMTcgMS44NTQtMy4zMTcgMy41MTloNGEuMzcuMzcgMCAwIDEtLjEwMy4yMzYuNzc0Ljc3NCAwIDAgMS0uNTguMjQ1di00Wm0zLjMxNiAzLjUxOWMwLTEuNjY1LTEuMjI1LTMuNTE5LTMuMzE2LTMuNTE5djRjLS4yOSAwLS40OS0uMTQtLjU4LS4yNDVhLjM3LjM3IDAgMCAxLS4xMDQtLjIzNmg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjg3NCAyLjM4NGEzLjY0NCAzLjY0NCAwIDAgMCAuODc0LTIuMzg0aC00YzAtLjAyNy4wMDUtLjA1OC4wMTctLjA5NGEuNDUuNDUgMCAwIDEgLjA4Ni0uMTQybDMuMDIzIDIuNjJabS00Ljg4NSAwYzEuMzEyIDEuNTEzIDMuNTczIDEuNTEzIDQuODg1IDBsLTMuMDIzLTIuNjJhLjc3NS43NzUgMCAwIDEgLjU4LS4yNDVjLjI3IDAgLjQ3Ni4xMjQuNTgxLjI0NWwtMy4wMjMgMi42MlptLS44NzQtMi4zODRjMCAuODQ4LjI5IDEuNzEuODc0IDIuMzg0bDMuMDIzLTIuNjJhLjQ1LjQ1IDAgMCAxIC4wODYuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxNy4wOTRoLTRabTAtMi40MDl2Mi40MDloNHYtMi40MDloLTRabTIyLjQzIDBhLjM3LjM3IDAgMCAxLS4xMDMuMjM2Ljc3NC43NzQgMCAwIDEtLjU4MS4yNDV2LTRjLTIuMDkgMC0zLjMxNiAxLjg1NC0zLjMxNiAzLjUxOWg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjEwMy0uMjM2YS40NTMuNDUzIDAgMCAxIC4wODUuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxOC4wOTRoLTRjMCAuODQ4LjI5IDEuNzEuODc0IDIuMzg0bDMuMDIzLTIuNjJabS0xLjE2MiAwYS43NzYuNzc2IDAgMCAxIC41ODEtLjI0NWMuMjcgMCAuNDc2LjEyNC41OC4yNDVsLTMuMDIyIDIuNjJjMS4zMTEgMS41MTMgMy41NzMgMS41MTMgNC44ODQgMGwtMy4wMjMtMi42MlptLS4xMDMuMjM2YzAtLjAyNy4wMDUtLjA1OC4wMTgtLjA5NGEuNDUuNDUgMCAwIDEgLjA4NS0uMTQybDMuMDIzIDIuNjJhMy42NDQgMy42NDQgMCAwIDAgLjg3NC0yLjM4NGgtNFptMC0yLjQwOXYyLjQwOWg0di0yLjQwOWgtNFptLjY4NC40ODFjLS4yOSAwLS40OS0uMTQtLjU4LS4yNDVhLjM3LjM3IDAgMCAxLS4xMDQtLjIzNmg0YzAtMS42NjUtMS4yMjUtMy41MTktMy4zMTYtMy41MTl2NFptLTE0LjQ4LTRjLTIuMDkxIDAtMy4zMTYgMS44NTQtMy4zMTYgMy41MTloNGEuMzcuMzcgMCAwIDEtLjEwNC4yMzYuNzc0Ljc3NCAwIDAgMS0uNTguMjQ1di00Wm0zLjMxNiAzLjUxOWMwLTEuNjY1LTEuMjI1LTMuNTE5LTMuMzE2LTMuNTE5djRjLS4yOSAwLS40OS0uMTQtLjU4LS4yNDVhLjM3LjM3IDAgMCAxLS4xMDQtLjIzNmg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjg3NCAyLjM4NGEzLjY0NCAzLjY0NCAwIDAgMCAuODc0LTIuMzg0aC00YzAtLjAyNy4wMDUtLjA1OC4wMTgtLjA5NGEuNDUuNDUgMCAwIDEgLjA4NS0uMTQybDMuMDIzIDIuNjJabS00Ljg4NCAwYzEuMzExIDEuNTEzIDMuNTczIDEuNTEzIDQuODg0IDBsLTMuMDIzLTIuNjJhLjc3Ni43NzYgMCAwIDEgLjU4LS4yNDVjLjI3MSAwIC40NzcuMTI0LjU4MS4yNDVsLTMuMDIyIDIuNjJabS0uODc0LTIuMzg0YzAgLjg0OC4yODkgMS43MS44NzQgMi4zODRsMy4wMjMtMi42MmEuNDUzLjQ1MyAwIDAgMSAuMDg1LjE0Mi4yNzcuMjc3IDAgMCAxIC4wMTcuMDk0aC00Wm0wLTIuNDA5djIuNDA5aDR2LTIuNDA5aC00Wm0yMi40MjkgMGEuMzcuMzcgMCAwIDEtLjEwMy4yMzYuNzc0Ljc3NCAwIDAgMS0uNTguMjQ1di00Yy0yLjA5MiAwLTMuMzE3IDEuODU0LTMuMzE3IDMuNTE5aDRabTAgMi40MDl2LTIuNDA5aC00djIuNDA5aDRabS0uMTAzLS4yMzZhLjQ1LjQ1IDAgMCAxIC4wODUuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxOC4wOTRoLTRjMCAuODQ4LjI5IDEuNzEuODc0IDIuMzg0bDMuMDIzLTIuNjJabS0xLjE2MiAwYS43NzYuNzc2IDAgMCAxIC41ODEtLjI0NWMuMjcgMCAuNDc2LjEyNC41OC4yNDVsLTMuMDIyIDIuNjJjMS4zMTIgMS41MTMgMy41NzMgMS41MTMgNC44ODUgMGwtMy4wMjMtMi42MlptLS4xMDIuMjM2YzAtLjAyNy4wMDQtLjA1OC4wMTctLjA5NGEuNDU1LjQ1NSAwIDAgMSAuMDg1LS4xNDJsMy4wMjMgMi42MmEzLjY0NSAzLjY0NSAwIDAgMCAuODc1LTIuMzg0aC00Wm0wLTIuNDA5djIuNDA5aDR2LTIuNDA5aC00Wm0uNjgzLjQ4MWMtLjI5IDAtLjQ5LS4xNC0uNTgtLjI0NWEuMzcuMzcgMCAwIDEtLjEwMy0uMjM2aDRjMC0xLjY2NS0xLjIyNi0zLjUxOS0zLjMxNy0zLjUxOXY0WiIKICAgICAgICBmaWxsPSIjZmZmIiBtYXNrPSJ1cmwoI2EpIiAvPgo8L3N2Zz4="
        class="header3__card-recommendation-header-photo header3__card-recommendation-header-photo_default_inverted"
      />
    </div>
    <div class="header3__card-recommendation-header-content">
      <div class="header3__card-recommendation-header-content-tag">
        
          Курс
        
      </div>
      <div class="header3__card-recommendation-header-sub">
        
          <span
            class="header3__card-recommendation-header-sub-chunk header3__card-recommendation-header-sub-chunk_green"
          >
            Скидка 20000 ₽
          </span>
        
      </div>
    </div>
  </div>
  <h6 class="header3__card-recommendation-title">
    AI для аналитики и работы с данными
  </h6>
  <div class="header3__card-recommendation-footer">
    
      
        12 марта
      
      , 2026
      
        · 2 месяца
      
    
  </div>
</a>


      </div>
    
  </div>

  


    
  
  
    
  <div>
    <p class="header3__nav-section-title ">Ответим на ваши вопросы</p>
    
      <div class="header3__nav-section-items  ">
        
  <a
    class="header3__nav-section-item header3__nav-section-item_phone"
    rel="noopener noreferrer"
    href="tel:+7 499 938-92-02"
  >
    <svg
      class="header3__phone-icon"
      width="24"
      height="24"
      viewBox="0 0 24 24"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <path
        d="M14.352 2.75a7.971 7.971 0 0 1 7.041 7.032M14.352 6.293a4.426 4.426 0 0 1 3.5 3.5"
        stroke="currentColor"
        stroke-width="2"
        stroke-linecap="round"
        stroke-linejoin="round"
      ></path>
      <path
        clip-rule="evenodd"
        d="M7.7 16.299C.803 9.4 1.783 6.241 2.51 5.223c.094-.164 2.396-3.611 4.865-1.589 6.126 5.045-1.63 4.332 3.514 9.477 5.146 5.144 4.431-2.611 9.477 3.514 2.022 2.469-1.425 4.771-1.588 4.864-1.018.728-4.178 1.709-11.078-5.19Z"
        stroke="currentColor"
        stroke-width="2"
        stroke-linecap="round"
        stroke-linejoin="round"
        ></path>
    </svg>
    +7 499 938-92-02
  </a>

      </div>
    
  </div>

  


  </div>


</div>
          <svg
  class="header3__nav-item-popup-figure"
  viewBox="0 0 600 600"
  fill="none"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M125.573 140.619C131.659 71.6017 210.245 34.9562 267.027 74.6573L553.942 275.262C610.723 314.962 603.117 401.233 540.247 430.55L222.58 578.681C159.71 607.997 88.7344 558.37 94.8204 489.355L125.573 140.619Z"
    stroke="#eaeaea"
    class="header3__nav-item-popup-figure-spinner"
  ></path>
  <path
    d="M148.472 246.647C133.624 191.005 184.615 140.013 240.257 154.862L519.856 229.476C575.498 244.325 594.059 313.877 553.266 354.67L348.281 559.656C307.488 600.449 237.935 581.888 223.087 526.246L148.472 246.647Z"
    fill="url(#paint0_linear-info)"
  ></path>
  <defs>
    <linearGradient
      id="paint0_linear-info"
      x1="128.696"
      y1="395.739"
      x2="443.538"
      y2="180.173"
      gradientUnits="userSpaceOnUse"
    >
      <stop stop-color="#f9f9f9"></stop>
      <stop offset="1" stop-color="#EBEBEB"></stop>
    </linearGradient>
  </defs>
</svg>

        </div>
      </div>
    
  

  



  


      <a class="header3__nav-item header3__nav-item-b2b header3__nav-item_with-hover" href="/b2b">
        Компаниям
      </a>
    </nav>
    <div class="header3__nav header3__nav_right">
      
        
    
        
  <div data-name="" class="header3__nav-item js-header3-popup-trigger   js-open-modal-reg header3__button-sign-up-container" >
    
    <button class="header3__button-sign-up">
        <svg class="header3__button-sign-up-icon" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
            <path
                clip-rule="evenodd"
                d="M9.922 21.808c-3.814 0-7.072-.577-7.072-2.887s3.237-4.41 7.072-4.41c3.814 0 7.072 2.08 7.072 4.39 0 2.308-3.237 2.907-7.072 2.907ZM9.922 11.216A4.534 4.534 0 1 0 5.39 6.683a4.518 4.518 0 0 0 4.501 4.533h.032Z"
                stroke="currentColor"
                stroke-width="2"
                stroke-linecap="round"
                stroke-linejoin="round"
            ></path>
            <path
                d="M19.131 8.13v4.01M21.178 10.134h-4.09"
                stroke="currentColor"
                stroke-width="2"
                stroke-linecap="round"
                stroke-linejoin="round"
            ></path>
        </svg>
        Зарегистрироваться
    </button>

    
  </div>
  

    



    
        
  <div data-name="" class="header3__nav-item js-header3-popup-trigger   js-open-modal-login header3__button-sign-in-container" data-modal-id="new-log-reg">
    
    <button class="header3__button-sign-in">
        Войти
    </button>

    
  </div>
  

    



      
      

<div class="header3__hamburger">
  <button data-name="hamburger" class="header3__hamburger-button js-header3-popup-trigger">
    <svg
      class="header3__hamburger-icon js-header3-popup-trigger-icon-default"
      width="28"
      height="22"
      viewBox="0 0 28 22"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <path
        d="M2.15999 0.119995C1.09961 0.119995 0.23999 0.979576 0.23999 2.04C0.23999 3.10035 1.09961 3.96 2.15999 3.96H25.84C26.9004 3.96 27.76 3.10035 27.76 2.04C27.76 0.979576 26.9004 0.119995 25.84 0.119995H2.15999ZM2.15999 9.08C1.09961 9.08 0.23999 9.93957 0.23999 11C0.23999 12.0604 1.09961 12.92 2.15999 12.92H25.84C26.9004 12.92 27.76 12.0604 27.76 11C27.76 9.93957 26.9004 9.08 25.84 9.08H2.15999ZM2.15999 18.04C1.09961 18.04 0.23999 18.8996 0.23999 19.96C0.23999 21.0204 1.09961 21.88 2.15999 21.88H25.84C26.9004 21.88 27.76 21.0204 27.76 19.96C27.76 18.8996 26.9004 18.04 25.84 18.04H2.15999Z"
        fill="currentColor"
      ></path>
    </svg>
    <svg
      width="24"
      height="24"
      viewBox="0 0 24 24"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      class="header3__hamburger-icon-close js-header3-popup-trigger-icon-close"
    >
      <path
        fill-rule="evenodd"
        clip-rule="evenodd"
        d="M12 0.75C11.3096 0.75 10.75 1.30964 10.75 2V10.75L2 10.75C1.30964 10.75 0.75 11.3096 0.75 12C0.75 12.6904 1.30964 13.25 2 13.25L10.75 13.25L10.75 22C10.75 22.6904 11.3096 23.25 12 23.25C12.6904 23.25 13.25 22.6904 13.25 22L13.25 13.25L22 13.25C22.6904 13.25 23.25 12.6904 23.25 12C23.25 11.3096 22.6904 10.75 22 10.75L13.25 10.75V2C13.25 1.30964 12.6904 0.75 12 0.75Z"
        fill="currentColor"
      ></path>
    </svg>
  </button>
  <div
    data-name="hamburger"
    data-only-click="true"
    class="header3__nav-item-popup-wrapper js-header3-popup"
    style="display: none;"
  >
    <div
      class="header3__nav-item-popup-container js-header3-popup-container"
    >
      <svg
  class="header3__nav-item-popup-figure"
  viewBox="0 0 600 600"
  fill="none"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M125.573 140.619C131.659 71.6017 210.245 34.9562 267.027 74.6573L553.942 275.262C610.723 314.962 603.117 401.233 540.247 430.55L222.58 578.681C159.71 607.997 88.7344 558.37 94.8204 489.355L125.573 140.619Z"
    stroke="#eaeaea"
    class="header3__nav-item-popup-figure-spinner"
  ></path>
  <path
    d="M148.472 246.647C133.624 191.005 184.615 140.013 240.257 154.862L519.856 229.476C575.498 244.325 594.059 313.877 553.266 354.67L348.281 559.656C307.488 600.449 237.935 581.888 223.087 526.246L148.472 246.647Z"
    fill="url(#paint0_linear-hamburger)"
  ></path>
  <defs>
    <linearGradient
      id="paint0_linear-hamburger"
      x1="128.696"
      y1="395.739"
      x2="443.538"
      y2="180.173"
      gradientUnits="userSpaceOnUse"
    >
      <stop stop-color="#f9f9f9"></stop>
      <stop offset="1" stop-color="#EBEBEB"></stop>
    </linearGradient>
  </defs>
</svg>

      <div class="header3__nav-item-popup-content header3__hamburger-tabs">
        <ul>
          <li
            class="header3__hamburger-tabs-tab header3__hamburger-tabs-tab_active"
          >
            Обучение
          </li>
          <li class="header3__hamburger-tabs-tab">
            Информация
          </li>
          <li data-url="/b2b" class="header3__hamburger-tabs-tab header3__hamburger-tabs-tab_link">
            Компаниям
          </li>
        </ul>
        <div class="header3__hamburger-tabs-tab-content-wrapper">
          <div
            class="header3__hamburger-tabs-tab-content header3__hamburger-tabs-tab-learning header3__hamburger-tabs-tab-content_active"
          >
            



<div class="header3__nav-column">
  
  
  
    
  <div>
    <p class="header3__nav-section-title ">Направления</p>
    
  <div class="header3__nav-section-items header3__nav-section-items_learning header3__nav-section-items_learning_rows-8">
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/programming/"
          >
            Программирование (117)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/architecture/"
          >
            Архитектура (17)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/data-science/"
          >
            Data Science (27)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/operations/"
          >
            Инфраструктура (58)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/gamedev/"
          >
            GameDev (10)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/information-security-courses/"
          >
            Безопасность (15)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/marketing-business/"
          >
            Управление (46)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/analytics/"
          >
            Аналитика и анализ (25)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/business-product/"
          >
            Бизнес и продукт в IT (26)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/import-substitution/"
          >
            Импортозамещение (15)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/testing/"
          >
            Тестирование (12)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/neural_networks/"
          >
            Нейросети (9)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/it-bez-programmirovanija/"
          >
            IT без программирования (19)
          </a>
        
    
        
          <a
            class="header3__nav-section-item"
            href="/categories/corporate/"
          >
            Корпоративные курсы (27)
          </a>
        
    
    </div>

  </div>

  


</div>

  <div class="header3__nav-column">
    
  
    
  <div>
    <p class="header3__nav-section-title ">События</p>
    
      <div class="header3__nav-section-items  ">
        
  
  <a
    class="header3__nav-section-item"
    href="/lessons/calendar/2026/"
  >
    Календарь запуска курсов
  </a>

  <a
    class="header3__nav-section-item"
    href="/events/near/"
  >
    Календарь мероприятий
  </a>

      </div>
    
  </div>

  


    
  
    
  <div>
    <p class="header3__nav-section-title ">Другое</p>
    
      <div class="header3__nav-section-items  ">
        
    
        <a
          class="header3__nav-section-item"
          href="/categories/spec/"
        >
          Специализации (13)
        </a>
    

    
        <a
          class="header3__nav-section-item"
          href="/categories/online/"
        >
          Подготовительные курсы (14)
        </a>
    

    <a
      class="header3__nav-section-item header3__nav-section-item_bold"
      href="/subscription"
    >
      Подписка на курсы
    </a>
    <a
      class="header3__nav-section-item"
      href="/tests"
    >
      Проверьте свои знания
    </a>

      </div>
    
  </div>

  


  </div>



  <div class="header3__nav-column">
    
  
  
    
  <div>
    <p class="header3__nav-section-title header3__nav-section-items-recommendation-title">OTUS рекомендует</p>
    
      <div class="header3__nav-section-items header3__nav-section-items_not-items header3__nav-section-items-recommendation">
        
  





  




  




<a
  href="/lessons/ai-dlya-analitiki-i-raboty-s-dannymi/"
  class="header3__card-recommendation"
>
  <div
    class="header3__card-recommendation-background"
    style="background: linear-gradient( 90deg,#0A4489, #00316B);"
  ></div>
  <div class="header3__card-recommendation-header">
    <div class="header3__card-recommendation-header-photo-wrapper" style="background: linear-gradient( 90deg,#0A4489, #00316B);">
      <img
        src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAiIGhlaWdodD0iODAiIHZpZXdCb3g9IjAgMCA4MCA4MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoCiAgICAgICAgZD0iTTM1LjAwNDcgNDUuODcyNUMzNS4wMDQ3IDQ2LjkzMDYgMzYuMTA5IDQ3LjU3NTcgMzYuOTYwMyA0Ny4wMTQ5TDQ0LjYyOTIgNDEuOTYzMUM0NS4wMDI5IDQxLjcxNjkgNDUuMjI5OSA0MS4yODUyIDQ1LjIyOTkgNDAuODIwN1YyNi43NDg5QzQ1LjIyOTkgMjYuNzQ4OSA0Ny43ODYyIDI2Ljc0ODkgNTQuMTc3IDIyLjcwNzRDNTcuMzAxMiAyMC43MzE4IDU4Ljg5OCAxOC43NTYxIDU5LjcxNDMgMTcuMjUyNUM2MC4yNDY1IDE2LjI3MjEgNTkuMjUxMSAxNS41NTg4IDU4LjI5NjUgMTYuMDcyM0M1NS4zMjkyIDE3LjY2ODQgNDkuMzkxOCAyMC4wMTMyIDQwLjExNzMgMjAuMDEzMkMzMC44NDI4IDIwLjAxMzIgMjQuOTA1NCAxNy42Njg0IDIxLjkzODEgMTYuMDcyM0MyMC45ODM1IDE1LjU1ODggMTkuOTg4MSAxNi4yNzIxIDIwLjUyMDMgMTcuMjUyNUMyMS4zMzY2IDE4Ljc1NjEgMjIuOTMzNCAyMC43MzE4IDI2LjA1NzcgMjIuNzA3NEMzMi40NDg0IDI2Ljc0ODkgMzUuMDA0NyAyNi43NDg5IDM1LjAwNDcgMjYuNzQ4OVY0NS44NzI1WiIKICAgICAgICBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxlbGxpcHNlIGN4PSIyNi45NTM1IiBjeT0iMzUuNTUyNiIgcng9IjMuOTQ5MTQiIHJ5PSI0LjA4NTMyIiBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxlbGxpcHNlIGN4PSI1My4yODEyIiBjeT0iMzUuNTUyNiIgcng9IjMuOTQ5MTQiIHJ5PSI0LjA4NTMyIiBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0iTTI1LjYzNzIgNTkuNjM1QzI1LjYzNzIgNTguNzk2MSAyNi4yMjY2IDU4LjExNiAyNi45NTM2IDU4LjExNkMyNy42ODA2IDU4LjExNiAyOC4yNyA1OC43OTYxIDI4LjI3IDU5LjYzNVY2Mi4wNDRDMjguMjcgNjIuNDQ2OSAyOC4xMzEzIDYyLjgzMzMgMjcuODg0NCA2My4xMTgxQzI3LjM3MDMgNjMuNzExNCAyNi41MzY4IDYzLjcxMTQgMjYuMDIyOCA2My4xMTgxQzI1Ljc3NTkgNjIuODMzMyAyNS42MzcyIDYyLjQ0NjkgMjUuNjM3MiA2Mi4wNDRWNTkuNjM1WiIKICAgICAgICBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0iTTQ0LjA2NjUgNTkuNjM1QzQ0LjA2NjUgNTguNzk2MSA0NC42NTU5IDU4LjExNiA0NS4zODI5IDU4LjExNkM0Ni4xMDk5IDU4LjExNiA0Ni42OTkzIDU4Ljc5NjEgNDYuNjk5MyA1OS42MzVWNjIuMDQ0QzQ2LjY5OTMgNjIuNDQ2OSA0Ni41NjA2IDYyLjgzMzMgNDYuMzEzOCA2My4xMTgxQzQ1Ljc5OTcgNjMuNzExNCA0NC45NjYyIDYzLjcxMTQgNDQuNDUyMSA2My4xMTgxQzQ0LjIwNTIgNjIuODMzMyA0NC4wNjY1IDYyLjQ0NjkgNDQuMDY2NSA2Mi4wNDRWNTkuNjM1WiIKICAgICAgICBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0iTTI5LjU4NjQgNTkuNjM1QzI5LjU4NjQgNTguNzk2MSAzMC4xNzU3IDU4LjExNiAzMC45MDI3IDU4LjExNkMzMS42Mjk4IDU4LjExNiAzMi4yMTkxIDU4Ljc5NjEgMzIuMjE5MSA1OS42MzVWNjIuMDQ0QzMyLjIxOTEgNjIuNDQ2OSAzMi4wODA0IDYyLjgzMzMgMzEuODMzNiA2My4xMTgxQzMxLjMxOTUgNjMuNzExNCAzMC40ODYgNjMuNzExNCAyOS45NzE5IDYzLjExODFDMjkuNzI1IDYyLjgzMzMgMjkuNTg2NCA2Mi40NDY5IDI5LjU4NjQgNjIuMDQ0VjU5LjYzNVoiCiAgICAgICAgZmlsbD0id2hpdGUiIC8+CiAgICA8cGF0aAogICAgICAgIGQ9Ik00OC4wMTU3IDU5LjYzNUM0OC4wMTU3IDU4Ljc5NjEgNDguNjA1MSA1OC4xMTYgNDkuMzMyMSA1OC4xMTZDNTAuMDU5MSA1OC4xMTYgNTAuNjQ4NSA1OC43OTYxIDUwLjY0ODUgNTkuNjM1VjYyLjA0NEM1MC42NDg1IDYyLjQ0NjkgNTAuNTA5OCA2Mi44MzMzIDUwLjI2MjkgNjMuMTE4MUM0OS43NDg4IDYzLjcxMTQgNDguOTE1MyA2My43MTE0IDQ4LjQwMTIgNjMuMTE4MUM0OC4xNTQ0IDYyLjgzMzMgNDguMDE1NyA2Mi40NDY5IDQ4LjAxNTcgNjIuMDQ0VjU5LjYzNVoiCiAgICAgICAgZmlsbD0id2hpdGUiIC8+CiAgICA8cGF0aAogICAgICAgIGQ9Ik0zMy41MzU1IDU5LjYzNUMzMy41MzU1IDU4Ljc5NjEgMzQuMTI0OSA1OC4xMTYgMzQuODUxOSA1OC4xMTZDMzUuNTc4OSA1OC4xMTYgMzYuMTY4MyA1OC43OTYxIDM2LjE2ODMgNTkuNjM1VjYyLjA0NEMzNi4xNjgzIDYyLjQ0NjkgMzYuMDI5NiA2Mi44MzMzIDM1Ljc4MjcgNjMuMTE4MUMzNS4yNjg2IDYzLjcxMTQgMzQuNDM1MSA2My43MTE0IDMzLjkyMTEgNjMuMTE4MUMzMy42NzQyIDYyLjgzMzMgMzMuNTM1NSA2Mi40NDY5IDMzLjUzNTUgNjIuMDQ0VjU5LjYzNVoiCiAgICAgICAgZmlsbD0id2hpdGUiIC8+CiAgICA8cGF0aAogICAgICAgIGQ9Ik01MS45NjQ4IDU5LjYzNUM1MS45NjQ4IDU4Ljc5NjEgNTIuNTU0MiA1OC4xMTYgNTMuMjgxMiA1OC4xMTZDNTQuMDA4MiA1OC4xMTYgNTQuNTk3NiA1OC43OTYxIDU0LjU5NzYgNTkuNjM1VjYyLjA0NEM1NC41OTc2IDYyLjQ0NjkgNTQuNDU4OSA2Mi44MzMzIDU0LjIxMiA2My4xMTgxQzUzLjY5OCA2My43MTE0IDUyLjg2NDUgNjMuNzExNCA1Mi4zNTA0IDYzLjExODFDNTIuMTAzNSA2Mi44MzMzIDUxLjk2NDggNjIuNDQ2OSA1MS45NjQ4IDYyLjA0NFY1OS42MzVaIgogICAgICAgIGZpbGw9IndoaXRlIiAvPgo8L3N2Zz4="
        class="header3__card-recommendation-header-photo header3__card-recommendation-header-photo_default"
      />
      <img 
        src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAiIGhlaWdodD0iODAiIHZpZXdCb3g9IjAgMCA4MCA4MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxtYXNrIGlkPSJhIiBmaWxsPSIjZmZmIj4KICAgICAgICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIKICAgICAgICAgICAgZD0iTTAgMTJDMCA1LjM3MyA1LjM3MyAwIDEyIDBoNTZjNi42MjcgMCAxMiA1LjM3MyAxMiAxMnY1NmMwIDYuNjI3LTUuMzczIDEyLTEyIDEySDEyQzUuMzczIDgwIDAgNzQuNjI3IDAgNjhWMTJabTM1LjAwNSAzMy44NzNjMCAxLjA1OCAxLjEwNCAxLjcwMyAxLjk1NSAxLjE0Mmw3LjY3LTUuMDUyYy4zNzMtLjI0Ni42LS42NzguNi0xLjE0MlYyNi43NDlzMi41NTYgMCA4Ljk0Ny00LjA0MmMzLjEyNC0xLjk3NSA0LjcyMS0zLjk1MSA1LjUzNy01LjQ1NC41MzMtLjk4MS0uNDYzLTEuNjk0LTEuNDE3LTEuMTgtMi45NjggMS41OTUtOC45MDUgMy45NC0xOC4xOCAzLjk0LTkuMjc0IDAtMTUuMjEyLTIuMzQ1LTE4LjE3OS0zLjk0LS45NTQtLjUxNC0xLjk1LjE5OS0xLjQxOCAxLjE4LjgxNyAxLjUwMyAyLjQxMyAzLjQ3OSA1LjUzOCA1LjQ1NCA2LjM5IDQuMDQyIDguOTQ3IDQuMDQyIDguOTQ3IDQuMDQydjE5LjEyNFptLTguMDUxLTYuMjM1YzIuMTggMCAzLjk0OS0xLjgzIDMuOTQ5LTQuMDg1IDAtMi4yNTctMS43NjgtNC4wODYtMy45NS00LjA4Ni0yLjE4IDAtMy45NDkgMS44My0zLjk0OSA0LjA4NiAwIDIuMjU2IDEuNzY4IDQuMDg1IDMuOTUgNC4wODVabTMwLjI3Ni00LjA4NWMwIDIuMjU2LTEuNzY4IDQuMDg1LTMuOTQ5IDQuMDg1LTIuMTggMC0zLjk0OS0xLjgzLTMuOTQ5LTQuMDg1IDAtMi4yNTcgMS43NjgtNC4wODYgMy45NS00LjA4NiAyLjE4IDAgMy45NDggMS44MyAzLjk0OCA0LjA4NlpNMjYuOTU0IDU4LjExNmMtLjcyNyAwLTEuMzE3LjY4LTEuMzE3IDEuNTE5djIuNDA5YzAgLjQwMy4xMzkuNzkuMzg2IDEuMDc0LjUxNC41OTMgMS4zNDcuNTkzIDEuODYxIDAgLjI0Ny0uMjg1LjM4Ni0uNjcxLjM4Ni0xLjA3NHYtMi40MDljMC0uODM5LS41OS0xLjUxOS0xLjMxNy0xLjUxOVptMTguNDI5IDBjLS43MjcgMC0xLjMxNy42OC0xLjMxNyAxLjUxOXYyLjQwOWMwIC40MDMuMTQuNzkuMzg2IDEuMDc0LjUxNC41OTMgMS4zNDguNTkzIDEuODYyIDAgLjI0Ny0uMjg1LjM4NS0uNjcxLjM4NS0xLjA3NHYtMi40MDljMC0uODM5LS41OS0xLjUxOS0xLjMxNi0xLjUxOVptLTE1Ljc5NyAxLjUxOWMwLS44MzkuNTktMS41MTkgMS4zMTctMS41MTlzMS4zMTYuNjggMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLS4xMzkuNzktLjM4NiAxLjA3NC0uNTE0LjU5My0xLjM0Ny41OTMtMS44NjEgMGExLjY0NSAxLjY0NSAwIDAgMS0uMzg2LTEuMDc0di0yLjQwOVptMTkuNzQ2LTEuNTE5Yy0uNzI3IDAtMS4zMTYuNjgtMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLjEzOC43OS4zODUgMS4wNzQuNTE0LjU5MyAxLjM0OC41OTMgMS44NjIgMCAuMjQ3LS4yODUuMzg1LS42NzEuMzg1LTEuMDc0di0yLjQwOWMwLS44MzktLjU4OS0xLjUxOS0xLjMxNi0xLjUxOVptLTE1Ljc5NyAxLjUxOWMwLS44MzkuNTktMS41MTkgMS4zMTctMS41MTlzMS4zMTYuNjggMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLS4xMzkuNzktLjM4NSAxLjA3NC0uNTE0LjU5My0xLjM0OC41OTMtMS44NjIgMGExLjY0NSAxLjY0NSAwIDAgMS0uMzg2LTEuMDc0di0yLjQwOVptMTkuNzQ2LTEuNTE5Yy0uNzI3IDAtMS4zMTYuNjgtMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLjEzOC43OS4zODUgMS4wNzQuNTE0LjU5MyAxLjM0OC41OTMgMS44NjIgMCAuMjQ3LS4yODUuMzg2LS42NzEuMzg2LTEuMDc0di0yLjQwOWMwLS44MzktLjU5LTEuNTE5LTEuMzE3LTEuNTE5WiIgLz4KICAgIDwvbWFzaz4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIgogICAgICAgIGQ9Ik0wIDEyQzAgNS4zNzMgNS4zNzMgMCAxMiAwaDU2YzYuNjI3IDAgMTIgNS4zNzMgMTIgMTJ2NTZjMCA2LjYyNy01LjM3MyAxMi0xMiAxMkgxMkM1LjM3MyA4MCAwIDc0LjYyNyAwIDY4VjEyWm0zNS4wMDUgMzMuODczYzAgMS4wNTggMS4xMDQgMS43MDMgMS45NTUgMS4xNDJsNy42Ny01LjA1MmMuMzczLS4yNDYuNi0uNjc4LjYtMS4xNDJWMjYuNzQ5czIuNTU2IDAgOC45NDctNC4wNDJjMy4xMjQtMS45NzUgNC43MjEtMy45NTEgNS41MzctNS40NTQuNTMzLS45ODEtLjQ2My0xLjY5NC0xLjQxNy0xLjE4LTIuOTY4IDEuNTk1LTguOTA1IDMuOTQtMTguMTggMy45NC05LjI3NCAwLTE1LjIxMi0yLjM0NS0xOC4xNzktMy45NC0uOTU0LS41MTQtMS45NS4xOTktMS40MTggMS4xOC44MTcgMS41MDMgMi40MTMgMy40NzkgNS41MzggNS40NTQgNi4zOSA0LjA0MiA4Ljk0NyA0LjA0MiA4Ljk0NyA0LjA0MnYxOS4xMjRabS04LjA1MS02LjIzNWMyLjE4IDAgMy45NDktMS44MyAzLjk0OS00LjA4NSAwLTIuMjU3LTEuNzY4LTQuMDg2LTMuOTUtNC4wODYtMi4xOCAwLTMuOTQ5IDEuODMtMy45NDkgNC4wODYgMCAyLjI1NiAxLjc2OCA0LjA4NSAzLjk1IDQuMDg1Wm0zMC4yNzYtNC4wODVjMCAyLjI1Ni0xLjc2OCA0LjA4NS0zLjk0OSA0LjA4NS0yLjE4IDAtMy45NDktMS44My0zLjk0OS00LjA4NSAwLTIuMjU3IDEuNzY4LTQuMDg2IDMuOTUtNC4wODYgMi4xOCAwIDMuOTQ4IDEuODMgMy45NDggNC4wODZaTTI2Ljk1NCA1OC4xMTZjLS43MjcgMC0xLjMxNy42OC0xLjMxNyAxLjUxOXYyLjQwOWMwIC40MDMuMTM5Ljc5LjM4NiAxLjA3NC41MTQuNTkzIDEuMzQ3LjU5MyAxLjg2MSAwIC4yNDctLjI4NS4zODYtLjY3MS4zODYtMS4wNzR2LTIuNDA5YzAtLjgzOS0uNTktMS41MTktMS4zMTctMS41MTlabTE4LjQyOSAwYy0uNzI3IDAtMS4zMTcuNjgtMS4zMTcgMS41MTl2Mi40MDljMCAuNDAzLjE0Ljc5LjM4NiAxLjA3NC41MTQuNTkzIDEuMzQ4LjU5MyAxLjg2MiAwIC4yNDctLjI4NS4zODUtLjY3MS4zODUtMS4wNzR2LTIuNDA5YzAtLjgzOS0uNTktMS41MTktMS4zMTYtMS41MTlabS0xNS43OTcgMS41MTljMC0uODM5LjU5LTEuNTE5IDEuMzE3LTEuNTE5czEuMzE2LjY4IDEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy0uMTM5Ljc5LS4zODYgMS4wNzQtLjUxNC41OTMtMS4zNDcuNTkzLTEuODYxIDBhMS42NDUgMS42NDUgMCAwIDEtLjM4Ni0xLjA3NHYtMi40MDlabTE5Ljc0Ni0xLjUxOWMtLjcyNyAwLTEuMzE2LjY4LTEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy4xMzguNzkuMzg1IDEuMDc0LjUxNC41OTMgMS4zNDguNTkzIDEuODYyIDAgLjI0Ny0uMjg1LjM4NS0uNjcxLjM4NS0xLjA3NHYtMi40MDljMC0uODM5LS41ODktMS41MTktMS4zMTYtMS41MTlabS0xNS43OTcgMS41MTljMC0uODM5LjU5LTEuNTE5IDEuMzE3LTEuNTE5czEuMzE2LjY4IDEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy0uMTM5Ljc5LS4zODUgMS4wNzQtLjUxNC41OTMtMS4zNDguNTkzLTEuODYyIDBhMS42NDUgMS42NDUgMCAwIDEtLjM4Ni0xLjA3NHYtMi40MDlabTE5Ljc0Ni0xLjUxOWMtLjcyNyAwLTEuMzE2LjY4LTEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy4xMzguNzkuMzg1IDEuMDc0LjUxNC41OTMgMS4zNDguNTkzIDEuODYyIDAgLjI0Ny0uMjg1LjM4Ni0uNjcxLjM4Ni0xLjA3NHYtMi40MDljMC0uODM5LS41OS0xLjUxOS0xLjMxNy0xLjUxOVoiCiAgICAgICAgZmlsbD0iI2ZmZiIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0ibTM2Ljk2IDQ3LjAxNSAxLjEgMS42Ny0xLjEtMS42N1ptNy42Ny01LjA1MiAxLjEgMS42Ny0xLjEtMS42N1ptLjYtMTUuMjE0di0yaC0ydjJoMlptOC45NDctNC4wNDIgMS4wNjkgMS42OS0xLjA2OS0xLjY5Wm01LjUzNy01LjQ1NCAxLjc1OC45NTQtMS43NTgtLjk1NFptLTEuNDE3LTEuMTguOTQ3IDEuNzYtLjk0Ny0xLjc2Wm0tMzYuMzU5IDAtLjk0NyAxLjc2Ljk0Ny0xLjc2Wm0tMS40MTggMS4xOCAxLjc1OC0uOTU1LTEuNzU4Ljk1NVptNS41MzggNS40NTQtMS4wNyAxLjY5IDEuMDctMS42OVptOC45NDcgNC4wNDJoMnYtMmgtMnYyWm0tOC45ODIgMzYuMzcgMS41MTEtMS4zMS0xLjUxMSAxLjMxWm0xLjg2MSAwIDEuNTEyIDEuMzA5LTEuNTEyLTEuMzFabTE2LjU2OCAwLTEuNTExIDEuMzA5IDEuNTExLTEuMzFabTEuODYyIDAgMS41MTEgMS4zMDktMS41MTEtMS4zMVptLTE0LjQ4IDAtMS41MTItMS4zMSAxLjUxMiAxLjMxWm0tMS44NjIgMCAxLjUxMS0xLjMxLTEuNTExIDEuMzFabTE4LjQzIDAtMS41MTIgMS4zMDkgMS41MTEtMS4zMVptMS44NiAwIDEuNTEyIDEuMzA5LTEuNTExLTEuMzFabS0xNC40OCAwIDEuNTEyIDEuMzA5LTEuNTExLTEuMzFabS0xLjg2MSAwLTEuNTExIDEuMzA5IDEuNTExLTEuMzFabTE4LjQzIDAgMS41MS0xLjMxLTEuNTEgMS4zMVptMS44NjEgMCAxLjUxMSAxLjMwOS0xLjUxMS0xLjMxWk0xMi0yQzQuMjY4LTItMiA0LjI2OC0yIDEyaDRDMiA2LjQ3NyA2LjQ3NyAyIDEyIDJ2LTRabTU2IDBIMTJ2NGg1NnYtNFptMTQgMTRjMC03LjczMi02LjI2OC0xNC0xNC0xNHY0YzUuNTIzIDAgMTAgNC40NzcgMTAgMTBoNFptMCA1NlYxMmgtNHY1Nmg0Wk02OCA4MmM3LjczMiAwIDE0LTYuMjY4IDE0LTE0aC00YzAgNS41MjMtNC40NzcgMTAtMTAgMTB2NFptLTU2IDBoNTZ2LTRIMTJ2NFpNLTIgNjhjMCA3LjczMiA2LjI2OCAxNCAxNCAxNHYtNEM2LjQ3NyA3OCAyIDczLjUyMyAyIDY4aC00Wm0wLTU2djU2aDRWMTJoLTRabTM3Ljg2IDMzLjM0NWEuNzkxLjc5MSAwIDAgMSAuODEyLS4wMjEuNjU2LjY1NiAwIDAgMSAuMzMzLjU0OWgtNGMwIDIuNDU0IDIuNzE0IDQuMzU1IDUuMDU1IDIuODEybC0yLjItMy4zNFptNy42NjktNS4wNTItNy42NjkgNS4wNTIgMi4yIDMuMzQgNy42Ny01LjA1Mi0yLjIwMS0zLjM0Wm0tLjI5OS41MjhjMC0uMTc4LjA4Ni0uMzg4LjI5OS0uNTI4bDIuMiAzLjM0YTMuMzY1IDMuMzY1IDAgMCAwIDEuNTAxLTIuODEyaC00Wm0wLTE0LjA3MlY0MC44Mmg0VjI2Ljc0OWgtNFptOS44NzgtNS43MzJjLTMuMDk3IDEuOTU5LTUuMTk3IDIuODk1LTYuNDY0IDMuMzRhOC44NDUgOC44NDUgMCAwIDEtMS4yOC4zNjIgMi40MiAyLjQyIDAgMCAxLS4yMDMuMDMxSDQ1LjE5bC4wMTgtLjAwMWguMDJjLjAwMSAwIC4wMDMgMCAuMDAzIDJzLjAwMiAyIC4wMDMgMmguMDU0YTMuMTk2IDMuMTk2IDAgMCAwIC4yNTYtLjAxN2MuMTQ0LS4wMTQuMzI3LS4wMzguNTUyLS4wOC40NS0uMDg0IDEuMDY5LS4yMzggMS44NzUtLjUyMSAxLjYxLS41NjYgMy45ODItMS42NSA3LjI3Ni0zLjczM2wtMi4xMzgtMy4zODFabTQuODQ5LTQuNzE5Yy0uNjM3IDEuMTczLTEuOTgzIDIuOTA2LTQuODQ5IDQuNzE5bDIuMTM4IDMuMzhjMy4zODItMi4xMzggNS4yMy00LjM1NiA2LjIyNi02LjE5bC0zLjUxNS0xLjkwOVptMS4yODcgMS41MzZjLS4xMDYuMDU2LS40OTQuMTczLS45MTYtLjE1OGExLjIzMyAxLjIzMyAwIDAgMS0uNDQ4LS43Ni45ODUuOTg1IDAgMCAxIC4wNzctLjYxOGwzLjUxNSAxLjkwOWMuMzA4LS41NjguNDcyLTEuMjQ4LjM1MS0xLjk2YTIuNzY4IDIuNzY4IDAgMCAwLTEuMDI1LTEuNzE4Yy0xLjAyNi0uODA1LTIuMzg4LS43ODgtMy40NDktLjIxOGwxLjg5NSAzLjUyM1ptLTE5LjEyNyA0LjE4YzkuNjI4IDAgMTUuODg5LTIuNDM4IDE5LjEyNy00LjE4bC0xLjg5NS0zLjUyM2MtMi42OTYgMS40NS04LjMxIDMuNzAyLTE3LjIzMiAzLjcwMnY0Wm0tMTkuMTI2LTQuMThjMy4yMzggMS43NDIgOS40OTkgNC4xOCAxOS4xMjYgNC4xOHYtNGMtOC45MjEgMC0xNC41MzUtMi4yNTMtMTcuMjMxLTMuNzAzbC0xLjg5NSAzLjUyM1ptMS4yODctMS41MzZjLjA0Mi4wNzguMTMxLjMuMDc3LjYxOWExLjIzMiAxLjIzMiAwIDAgMS0uNDQ5Ljc1OWMtLjQyMi4zMy0uODEuMjE1LS45MTUuMTU4bDEuODk1LTMuNTIzYy0xLjA2LS41Ny0yLjQyNC0uNTg3LTMuNDQ5LjIxOGEyLjc2OCAyLjc2OCAwIDAgMC0xLjAyNiAxLjcxOWMtLjEyLjcxMS4wNDMgMS4zOTEuMzUyIDEuOTU5bDMuNTE1LTEuOTA5Wm00Ljg0OSA0LjcxOWMtMi44NjctMS44MTMtNC4yMTItMy41NDYtNC44NDktNC43MTlsLTMuNTE1IDEuOTA5Yy45OTUgMS44MzQgMi44NDQgNC4wNTIgNi4yMjYgNi4xOWwyLjEzOC0zLjM4Wm03Ljg3OCA1LjczMmMwLTIgLjAwMS0yIC4wMDMtMkgzNS4wNDdsLjAyNS4wMDFoLjAwMWEyLjQyIDIuNDIgMCAwIDEtLjIwMi0uMDMgOC44NTIgOC44NTIgMCAwIDEtMS4yOC0uMzYzYy0xLjI2Ny0uNDQ1LTMuMzY3LTEuMzgxLTYuNDY0LTMuMzRsLTIuMTM4IDMuMzhjMy4yOTMgMi4wODQgNS42NjYgMy4xNjggNy4yNzYgMy43MzQuODA2LjI4MyAxLjQyNS40MzcgMS44NzUuNTJhNi4zNTYgNi4zNTYgMCAwIDAgLjczNy4wOTVsLjA3MS4wMDJoLjA1NGMuMDAxIDAgLjAwMyAwIC4wMDMtMlptMiAxOS4xMjRWMjYuNzQ5aC00djE5LjEyNGg0Wm0tOC4xMDItMTAuMzJjMCAxLjIxNi0uOTM2IDIuMDg1LTEuOTUgMi4wODV2NGMzLjM1IDAgNS45NS0yLjc4OSA1Ljk1LTYuMDg1aC00Wm0tMS45NS0yLjA4NmMxLjAxNCAwIDEuOTUuODcgMS45NSAyLjA4Nmg0YzAtMy4yOTctMi42LTYuMDg2LTUuOTUtNi4wODZ2NFptLTEuOTQ5IDIuMDg2YzAtMS4yMTYuOTM2LTIuMDg2IDEuOTUtMi4wODZ2LTRjLTMuMzUgMC01Ljk1IDIuNzktNS45NSA2LjA4Nmg0Wm0xLjk1IDIuMDg1Yy0xLjAxNCAwLTEuOTUtLjg3LTEuOTUtMi4wODVoLTRjMCAzLjI5NiAyLjYgNi4wODUgNS45NSA2LjA4NXYtNFptMjYuMzI3IDRjMy4zNSAwIDUuOTUtMi43ODkgNS45NS02LjA4NWgtNGMwIDEuMjE2LS45MzcgMi4wODUtMS45NSAyLjA4NXY0Wm0tNS45NDktNi4wODVjMCAzLjI5NiAyLjYgNi4wODUgNS45NSA2LjA4NXYtNGMtMS4wMTQgMC0xLjk1LS44Ny0xLjk1LTIuMDg1aC00Wm01Ljk1LTYuMDg2Yy0zLjM1IDAtNS45NSAyLjc5LTUuOTUgNi4wODZoNGMwLTEuMjE2LjkzNi0yLjA4NiAxLjk1LTIuMDg2di00Wm01Ljk0OCA2LjA4NmMwLTMuMjk3LTIuNi02LjA4Ni01Ljk0OS02LjA4NnY0YzEuMDEzIDAgMS45NS44NyAxLjk1IDIuMDg2aDRaTTI3LjYzNyA1OS42MzVhLjM3LjM3IDAgMCAxLS4xMDMuMjM2Ljc3NC43NzQgMCAwIDEtLjU4LjI0NXYtNGMtMi4wOTEgMC0zLjMxNyAxLjg1NC0zLjMxNyAzLjUxOWg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjEwMy0uMjM2YS40NS40NSAwIDAgMSAuMDg2LjE0Mi4yNzcuMjc3IDAgMCAxIC4wMTcuMDk0aC00YzAgLjg0OC4yOSAxLjcxLjg3NCAyLjM4NGwzLjAyMy0yLjYyWm0tMS4xNjEgMGEuNzc2Ljc3NiAwIDAgMSAuNTgtLjI0NWMuMjcgMCAuNDc2LjEyNC41ODEuMjQ1bC0zLjAyMyAyLjYyYzEuMzEyIDEuNTEzIDMuNTczIDEuNTEzIDQuODg1IDBsLTMuMDIzLTIuNjJabS0uMTAzLjIzNmMwLS4wMjcuMDA0LS4wNTguMDE3LS4wOTRhLjQ1LjQ1IDAgMCAxIC4wODYtLjE0MmwzLjAyMyAyLjYyYTMuNjQ0IDMuNjQ0IDAgMCAwIC44NzQtMi4zODRoLTRabTAtMi40MDl2Mi40MDloNHYtMi40MDloLTRabS42ODMuNDgxYy0uMjkgMC0uNDktLjE0LS41OC0uMjQ1YS4zNy4zNyAwIDAgMS0uMTAzLS4yMzZoNGMwLTEuNjY1LTEuMjI2LTMuNTE5LTMuMzE3LTMuNTE5djRabTE5LjExMy0uNDgxYS4zNy4zNyAwIDAgMS0uMTAyLjIzNi43NzQuNzc0IDAgMCAxLS41ODEuMjQ1di00Yy0yLjA5MSAwLTMuMzE3IDEuODU0LTMuMzE3IDMuNTE5aDRabTAgMi40MDl2LTIuNDA5aC00djIuNDA5aDRabS0uMTAyLS4yMzZhLjQ1LjQ1IDAgMCAxIC4wODUuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxNy4wOTRoLTRjMCAuODQ4LjI5IDEuNzEuODc1IDIuMzg0bDMuMDIzLTIuNjJabS0xLjE2MiAwYS43NzUuNzc1IDAgMCAxIC41OC0uMjQ1Yy4yNzEgMCAuNDc3LjEyNC41ODIuMjQ1bC0zLjAyMyAyLjYyYzEuMzExIDEuNTEzIDMuNTczIDEuNTEzIDQuODg0IDBsLTMuMDIzLTIuNjJabS0uMTAzLjIzNmMwLS4wMjcuMDA1LS4wNTguMDE4LS4wOTRhLjQ1LjQ1IDAgMCAxIC4wODUtLjE0MmwzLjAyMyAyLjYyYTMuNjQ1IDMuNjQ1IDAgMCAwIC44NzQtMi4zODRoLTRabTAtMi40MDl2Mi40MDloNHYtMi40MDloLTRabS42ODQuNDgxYy0uMjkgMC0uNDktLjE0LS41OC0uMjQ1YS4zNjkuMzY5IDAgMCAxLS4xMDQtLjIzNmg0YzAtMS42NjUtMS4yMjUtMy41MTktMy4zMTYtMy41MTl2NFptLTE0LjQ4LTRjLTIuMDkxIDAtMy4zMTcgMS44NTQtMy4zMTcgMy41MTloNGEuMzcuMzcgMCAwIDEtLjEwMy4yMzYuNzc0Ljc3NCAwIDAgMS0uNTguMjQ1di00Wm0zLjMxNiAzLjUxOWMwLTEuNjY1LTEuMjI1LTMuNTE5LTMuMzE2LTMuNTE5djRjLS4yOSAwLS40OS0uMTQtLjU4LS4yNDVhLjM3LjM3IDAgMCAxLS4xMDQtLjIzNmg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjg3NCAyLjM4NGEzLjY0NCAzLjY0NCAwIDAgMCAuODc0LTIuMzg0aC00YzAtLjAyNy4wMDUtLjA1OC4wMTctLjA5NGEuNDUuNDUgMCAwIDEgLjA4Ni0uMTQybDMuMDIzIDIuNjJabS00Ljg4NSAwYzEuMzEyIDEuNTEzIDMuNTczIDEuNTEzIDQuODg1IDBsLTMuMDIzLTIuNjJhLjc3NS43NzUgMCAwIDEgLjU4LS4yNDVjLjI3IDAgLjQ3Ni4xMjQuNTgxLjI0NWwtMy4wMjMgMi42MlptLS44NzQtMi4zODRjMCAuODQ4LjI5IDEuNzEuODc0IDIuMzg0bDMuMDIzLTIuNjJhLjQ1LjQ1IDAgMCAxIC4wODYuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxNy4wOTRoLTRabTAtMi40MDl2Mi40MDloNHYtMi40MDloLTRabTIyLjQzIDBhLjM3LjM3IDAgMCAxLS4xMDMuMjM2Ljc3NC43NzQgMCAwIDEtLjU4MS4yNDV2LTRjLTIuMDkgMC0zLjMxNiAxLjg1NC0zLjMxNiAzLjUxOWg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjEwMy0uMjM2YS40NTMuNDUzIDAgMCAxIC4wODUuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxOC4wOTRoLTRjMCAuODQ4LjI5IDEuNzEuODc0IDIuMzg0bDMuMDIzLTIuNjJabS0xLjE2MiAwYS43NzYuNzc2IDAgMCAxIC41ODEtLjI0NWMuMjcgMCAuNDc2LjEyNC41OC4yNDVsLTMuMDIyIDIuNjJjMS4zMTEgMS41MTMgMy41NzMgMS41MTMgNC44ODQgMGwtMy4wMjMtMi42MlptLS4xMDMuMjM2YzAtLjAyNy4wMDUtLjA1OC4wMTgtLjA5NGEuNDUuNDUgMCAwIDEgLjA4NS0uMTQybDMuMDIzIDIuNjJhMy42NDQgMy42NDQgMCAwIDAgLjg3NC0yLjM4NGgtNFptMC0yLjQwOXYyLjQwOWg0di0yLjQwOWgtNFptLjY4NC40ODFjLS4yOSAwLS40OS0uMTQtLjU4LS4yNDVhLjM3LjM3IDAgMCAxLS4xMDQtLjIzNmg0YzAtMS42NjUtMS4yMjUtMy41MTktMy4zMTYtMy41MTl2NFptLTE0LjQ4LTRjLTIuMDkxIDAtMy4zMTYgMS44NTQtMy4zMTYgMy41MTloNGEuMzcuMzcgMCAwIDEtLjEwNC4yMzYuNzc0Ljc3NCAwIDAgMS0uNTguMjQ1di00Wm0zLjMxNiAzLjUxOWMwLTEuNjY1LTEuMjI1LTMuNTE5LTMuMzE2LTMuNTE5djRjLS4yOSAwLS40OS0uMTQtLjU4LS4yNDVhLjM3LjM3IDAgMCAxLS4xMDQtLjIzNmg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjg3NCAyLjM4NGEzLjY0NCAzLjY0NCAwIDAgMCAuODc0LTIuMzg0aC00YzAtLjAyNy4wMDUtLjA1OC4wMTgtLjA5NGEuNDUuNDUgMCAwIDEgLjA4NS0uMTQybDMuMDIzIDIuNjJabS00Ljg4NCAwYzEuMzExIDEuNTEzIDMuNTczIDEuNTEzIDQuODg0IDBsLTMuMDIzLTIuNjJhLjc3Ni43NzYgMCAwIDEgLjU4LS4yNDVjLjI3MSAwIC40NzcuMTI0LjU4MS4yNDVsLTMuMDIyIDIuNjJabS0uODc0LTIuMzg0YzAgLjg0OC4yODkgMS43MS44NzQgMi4zODRsMy4wMjMtMi42MmEuNDUzLjQ1MyAwIDAgMSAuMDg1LjE0Mi4yNzcuMjc3IDAgMCAxIC4wMTcuMDk0aC00Wm0wLTIuNDA5djIuNDA5aDR2LTIuNDA5aC00Wm0yMi40MjkgMGEuMzcuMzcgMCAwIDEtLjEwMy4yMzYuNzc0Ljc3NCAwIDAgMS0uNTguMjQ1di00Yy0yLjA5MiAwLTMuMzE3IDEuODU0LTMuMzE3IDMuNTE5aDRabTAgMi40MDl2LTIuNDA5aC00djIuNDA5aDRabS0uMTAzLS4yMzZhLjQ1LjQ1IDAgMCAxIC4wODUuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxOC4wOTRoLTRjMCAuODQ4LjI5IDEuNzEuODc0IDIuMzg0bDMuMDIzLTIuNjJabS0xLjE2MiAwYS43NzYuNzc2IDAgMCAxIC41ODEtLjI0NWMuMjcgMCAuNDc2LjEyNC41OC4yNDVsLTMuMDIyIDIuNjJjMS4zMTIgMS41MTMgMy41NzMgMS41MTMgNC44ODUgMGwtMy4wMjMtMi42MlptLS4xMDIuMjM2YzAtLjAyNy4wMDQtLjA1OC4wMTctLjA5NGEuNDU1LjQ1NSAwIDAgMSAuMDg1LS4xNDJsMy4wMjMgMi42MmEzLjY0NSAzLjY0NSAwIDAgMCAuODc1LTIuMzg0aC00Wm0wLTIuNDA5djIuNDA5aDR2LTIuNDA5aC00Wm0uNjgzLjQ4MWMtLjI5IDAtLjQ5LS4xNC0uNTgtLjI0NWEuMzcuMzcgMCAwIDEtLjEwMy0uMjM2aDRjMC0xLjY2NS0xLjIyNi0zLjUxOS0zLjMxNy0zLjUxOXY0WiIKICAgICAgICBmaWxsPSIjZmZmIiBtYXNrPSJ1cmwoI2EpIiAvPgo8L3N2Zz4="
        class="header3__card-recommendation-header-photo header3__card-recommendation-header-photo_default_inverted"
      />
    </div>
    <div class="header3__card-recommendation-header-content">
      <div class="header3__card-recommendation-header-content-tag">
        
          Курс
        
      </div>
      <div class="header3__card-recommendation-header-sub">
        
          <span
            class="header3__card-recommendation-header-sub-chunk header3__card-recommendation-header-sub-chunk_green"
          >
            Скидка 20000 ₽
          </span>
        
      </div>
    </div>
  </div>
  <h6 class="header3__card-recommendation-title">
    AI для аналитики и работы с данными
  </h6>
  <div class="header3__card-recommendation-footer">
    
      
        12 марта
      
      , 2026
      
        · 2 месяца
      
    
  </div>
</a>


      </div>
    
  </div>

  


  </div>


          </div>
          <div class="header3__hamburger-tabs-tab-content">
            <div class="header3__nav-column">
  
  
  
    
  <div>
    <p class="header3__nav-section-title ">OTUS</p>
    
      <div class="header3__nav-section-items  ">
        
  
    <a
      class="header3__nav-section-item"
      href="/about"
    >
      О компании
    </a>

    <a
      class="header3__nav-section-item"
      href="/smi/"
    >
      СМИ о нас
    </a>

    <a
      class="header3__nav-section-item   js-stats"
      href="/journal/"
      target="_blank"
      rel="noreferrer nofollow"
      data-event="header;click_otus_journal"
      data-goal="click_otus_journal"
    >
      OTUS Журнал
    </a>

    <a
      class="header3__nav-section-item"
      href="https://direct.otus.ru/"
      target="_blank"
      rel="noreferrer nofollow"
    >
      OTUS Директ
    </a>

    <a
      class="header3__nav-section-item"
      href="/legal/common/"
    >
      Сведения об образовательной организации
    </a>
  

  <a
    class="header3__nav-section-item"
    href="/contacts/"
  >
    Контактная информация
  </a>

      </div>
    
  </div>

  


</div>
<div class="header3__nav-column">
  
  
  
    
  <div>
    <p class="header3__nav-section-title ">Студентам</p>
    
      <div class="header3__nav-section-items  ">
        
  <a
    class="header3__nav-section-item"
    href="/reviews"
  >
    Отзывы
  </a>

  
    <a
      class="header3__nav-section-item"
      target="_blank"
      href="https://landing.otus.ru/about-otus"
    >
      Как выбрать курс
    </a>
    <a
      class="header3__nav-section-item"
      target="_blank"
      href="https://landing.otus.ru/gallery"
    >
      Истории выпускников
    </a>
  

  <a
    class="header3__nav-section-item"
    href="/instructors/"
  >
    Наши преподаватели
  </a>

  <a
    class="header3__nav-section-item"
    href="/employers/all/"
  >
    Наши партнеры
  </a>

  
    <a
      class="header3__nav-section-item"
      href="/about/loyalty/"
    >
      Программа лояльности
    </a>

    <a
      class="header3__nav-section-item"
      href="/faq/"
    >
      Вопросы и ответы
    </a>
  

      </div>
    
  </div>

  


</div>
<div class="header3__nav-column">
  
  
  
    
  <div>
    <p class="header3__nav-section-title ">Преподавателям</p>
    
      <div class="header3__nav-section-items  ">
        
  <a
    class="header3__nav-section-item"
    href="/teach/"
  >
    Стать преподавателем
  </a>

  <a
    class="header3__nav-section-item"
    href="/instructors/"
  >
    Наши преподаватели
  </a>

  
    <a
      class="header3__nav-section-item"
      href="/nest/dlja-prepodavatelej/"
    >
      База знаний
    </a>
  

      </div>
    
  </div>

  


</div>

  <div class="header3__nav-column header3__nav-column_space-between">
    
  
  
    
  <div>
    <p class="header3__nav-section-title header3__nav-section-items-recommendation-title">OTUS рекомендует</p>
    
      <div class="header3__nav-section-items header3__nav-section-items_not-items header3__nav-section-items-recommendation">
        
  





  




  




<a
  href="/lessons/ai-dlya-analitiki-i-raboty-s-dannymi/"
  class="header3__card-recommendation"
>
  <div
    class="header3__card-recommendation-background"
    style="background: linear-gradient( 90deg,#0A4489, #00316B);"
  ></div>
  <div class="header3__card-recommendation-header">
    <div class="header3__card-recommendation-header-photo-wrapper" style="background: linear-gradient( 90deg,#0A4489, #00316B);">
      <img
        src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAiIGhlaWdodD0iODAiIHZpZXdCb3g9IjAgMCA4MCA4MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoCiAgICAgICAgZD0iTTM1LjAwNDcgNDUuODcyNUMzNS4wMDQ3IDQ2LjkzMDYgMzYuMTA5IDQ3LjU3NTcgMzYuOTYwMyA0Ny4wMTQ5TDQ0LjYyOTIgNDEuOTYzMUM0NS4wMDI5IDQxLjcxNjkgNDUuMjI5OSA0MS4yODUyIDQ1LjIyOTkgNDAuODIwN1YyNi43NDg5QzQ1LjIyOTkgMjYuNzQ4OSA0Ny43ODYyIDI2Ljc0ODkgNTQuMTc3IDIyLjcwNzRDNTcuMzAxMiAyMC43MzE4IDU4Ljg5OCAxOC43NTYxIDU5LjcxNDMgMTcuMjUyNUM2MC4yNDY1IDE2LjI3MjEgNTkuMjUxMSAxNS41NTg4IDU4LjI5NjUgMTYuMDcyM0M1NS4zMjkyIDE3LjY2ODQgNDkuMzkxOCAyMC4wMTMyIDQwLjExNzMgMjAuMDEzMkMzMC44NDI4IDIwLjAxMzIgMjQuOTA1NCAxNy42Njg0IDIxLjkzODEgMTYuMDcyM0MyMC45ODM1IDE1LjU1ODggMTkuOTg4MSAxNi4yNzIxIDIwLjUyMDMgMTcuMjUyNUMyMS4zMzY2IDE4Ljc1NjEgMjIuOTMzNCAyMC43MzE4IDI2LjA1NzcgMjIuNzA3NEMzMi40NDg0IDI2Ljc0ODkgMzUuMDA0NyAyNi43NDg5IDM1LjAwNDcgMjYuNzQ4OVY0NS44NzI1WiIKICAgICAgICBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxlbGxpcHNlIGN4PSIyNi45NTM1IiBjeT0iMzUuNTUyNiIgcng9IjMuOTQ5MTQiIHJ5PSI0LjA4NTMyIiBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxlbGxpcHNlIGN4PSI1My4yODEyIiBjeT0iMzUuNTUyNiIgcng9IjMuOTQ5MTQiIHJ5PSI0LjA4NTMyIiBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0iTTI1LjYzNzIgNTkuNjM1QzI1LjYzNzIgNTguNzk2MSAyNi4yMjY2IDU4LjExNiAyNi45NTM2IDU4LjExNkMyNy42ODA2IDU4LjExNiAyOC4yNyA1OC43OTYxIDI4LjI3IDU5LjYzNVY2Mi4wNDRDMjguMjcgNjIuNDQ2OSAyOC4xMzEzIDYyLjgzMzMgMjcuODg0NCA2My4xMTgxQzI3LjM3MDMgNjMuNzExNCAyNi41MzY4IDYzLjcxMTQgMjYuMDIyOCA2My4xMTgxQzI1Ljc3NTkgNjIuODMzMyAyNS42MzcyIDYyLjQ0NjkgMjUuNjM3MiA2Mi4wNDRWNTkuNjM1WiIKICAgICAgICBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0iTTQ0LjA2NjUgNTkuNjM1QzQ0LjA2NjUgNTguNzk2MSA0NC42NTU5IDU4LjExNiA0NS4zODI5IDU4LjExNkM0Ni4xMDk5IDU4LjExNiA0Ni42OTkzIDU4Ljc5NjEgNDYuNjk5MyA1OS42MzVWNjIuMDQ0QzQ2LjY5OTMgNjIuNDQ2OSA0Ni41NjA2IDYyLjgzMzMgNDYuMzEzOCA2My4xMTgxQzQ1Ljc5OTcgNjMuNzExNCA0NC45NjYyIDYzLjcxMTQgNDQuNDUyMSA2My4xMTgxQzQ0LjIwNTIgNjIuODMzMyA0NC4wNjY1IDYyLjQ0NjkgNDQuMDY2NSA2Mi4wNDRWNTkuNjM1WiIKICAgICAgICBmaWxsPSJ3aGl0ZSIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0iTTI5LjU4NjQgNTkuNjM1QzI5LjU4NjQgNTguNzk2MSAzMC4xNzU3IDU4LjExNiAzMC45MDI3IDU4LjExNkMzMS42Mjk4IDU4LjExNiAzMi4yMTkxIDU4Ljc5NjEgMzIuMjE5MSA1OS42MzVWNjIuMDQ0QzMyLjIxOTEgNjIuNDQ2OSAzMi4wODA0IDYyLjgzMzMgMzEuODMzNiA2My4xMTgxQzMxLjMxOTUgNjMuNzExNCAzMC40ODYgNjMuNzExNCAyOS45NzE5IDYzLjExODFDMjkuNzI1IDYyLjgzMzMgMjkuNTg2NCA2Mi40NDY5IDI5LjU4NjQgNjIuMDQ0VjU5LjYzNVoiCiAgICAgICAgZmlsbD0id2hpdGUiIC8+CiAgICA8cGF0aAogICAgICAgIGQ9Ik00OC4wMTU3IDU5LjYzNUM0OC4wMTU3IDU4Ljc5NjEgNDguNjA1MSA1OC4xMTYgNDkuMzMyMSA1OC4xMTZDNTAuMDU5MSA1OC4xMTYgNTAuNjQ4NSA1OC43OTYxIDUwLjY0ODUgNTkuNjM1VjYyLjA0NEM1MC42NDg1IDYyLjQ0NjkgNTAuNTA5OCA2Mi44MzMzIDUwLjI2MjkgNjMuMTE4MUM0OS43NDg4IDYzLjcxMTQgNDguOTE1MyA2My43MTE0IDQ4LjQwMTIgNjMuMTE4MUM0OC4xNTQ0IDYyLjgzMzMgNDguMDE1NyA2Mi40NDY5IDQ4LjAxNTcgNjIuMDQ0VjU5LjYzNVoiCiAgICAgICAgZmlsbD0id2hpdGUiIC8+CiAgICA8cGF0aAogICAgICAgIGQ9Ik0zMy41MzU1IDU5LjYzNUMzMy41MzU1IDU4Ljc5NjEgMzQuMTI0OSA1OC4xMTYgMzQuODUxOSA1OC4xMTZDMzUuNTc4OSA1OC4xMTYgMzYuMTY4MyA1OC43OTYxIDM2LjE2ODMgNTkuNjM1VjYyLjA0NEMzNi4xNjgzIDYyLjQ0NjkgMzYuMDI5NiA2Mi44MzMzIDM1Ljc4MjcgNjMuMTE4MUMzNS4yNjg2IDYzLjcxMTQgMzQuNDM1MSA2My43MTE0IDMzLjkyMTEgNjMuMTE4MUMzMy42NzQyIDYyLjgzMzMgMzMuNTM1NSA2Mi40NDY5IDMzLjUzNTUgNjIuMDQ0VjU5LjYzNVoiCiAgICAgICAgZmlsbD0id2hpdGUiIC8+CiAgICA8cGF0aAogICAgICAgIGQ9Ik01MS45NjQ4IDU5LjYzNUM1MS45NjQ4IDU4Ljc5NjEgNTIuNTU0MiA1OC4xMTYgNTMuMjgxMiA1OC4xMTZDNTQuMDA4MiA1OC4xMTYgNTQuNTk3NiA1OC43OTYxIDU0LjU5NzYgNTkuNjM1VjYyLjA0NEM1NC41OTc2IDYyLjQ0NjkgNTQuNDU4OSA2Mi44MzMzIDU0LjIxMiA2My4xMTgxQzUzLjY5OCA2My43MTE0IDUyLjg2NDUgNjMuNzExNCA1Mi4zNTA0IDYzLjExODFDNTIuMTAzNSA2Mi44MzMzIDUxLjk2NDggNjIuNDQ2OSA1MS45NjQ4IDYyLjA0NFY1OS42MzVaIgogICAgICAgIGZpbGw9IndoaXRlIiAvPgo8L3N2Zz4="
        class="header3__card-recommendation-header-photo header3__card-recommendation-header-photo_default"
      />
      <img 
        src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAiIGhlaWdodD0iODAiIHZpZXdCb3g9IjAgMCA4MCA4MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxtYXNrIGlkPSJhIiBmaWxsPSIjZmZmIj4KICAgICAgICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIKICAgICAgICAgICAgZD0iTTAgMTJDMCA1LjM3MyA1LjM3MyAwIDEyIDBoNTZjNi42MjcgMCAxMiA1LjM3MyAxMiAxMnY1NmMwIDYuNjI3LTUuMzczIDEyLTEyIDEySDEyQzUuMzczIDgwIDAgNzQuNjI3IDAgNjhWMTJabTM1LjAwNSAzMy44NzNjMCAxLjA1OCAxLjEwNCAxLjcwMyAxLjk1NSAxLjE0Mmw3LjY3LTUuMDUyYy4zNzMtLjI0Ni42LS42NzguNi0xLjE0MlYyNi43NDlzMi41NTYgMCA4Ljk0Ny00LjA0MmMzLjEyNC0xLjk3NSA0LjcyMS0zLjk1MSA1LjUzNy01LjQ1NC41MzMtLjk4MS0uNDYzLTEuNjk0LTEuNDE3LTEuMTgtMi45NjggMS41OTUtOC45MDUgMy45NC0xOC4xOCAzLjk0LTkuMjc0IDAtMTUuMjEyLTIuMzQ1LTE4LjE3OS0zLjk0LS45NTQtLjUxNC0xLjk1LjE5OS0xLjQxOCAxLjE4LjgxNyAxLjUwMyAyLjQxMyAzLjQ3OSA1LjUzOCA1LjQ1NCA2LjM5IDQuMDQyIDguOTQ3IDQuMDQyIDguOTQ3IDQuMDQydjE5LjEyNFptLTguMDUxLTYuMjM1YzIuMTggMCAzLjk0OS0xLjgzIDMuOTQ5LTQuMDg1IDAtMi4yNTctMS43NjgtNC4wODYtMy45NS00LjA4Ni0yLjE4IDAtMy45NDkgMS44My0zLjk0OSA0LjA4NiAwIDIuMjU2IDEuNzY4IDQuMDg1IDMuOTUgNC4wODVabTMwLjI3Ni00LjA4NWMwIDIuMjU2LTEuNzY4IDQuMDg1LTMuOTQ5IDQuMDg1LTIuMTggMC0zLjk0OS0xLjgzLTMuOTQ5LTQuMDg1IDAtMi4yNTcgMS43NjgtNC4wODYgMy45NS00LjA4NiAyLjE4IDAgMy45NDggMS44MyAzLjk0OCA0LjA4NlpNMjYuOTU0IDU4LjExNmMtLjcyNyAwLTEuMzE3LjY4LTEuMzE3IDEuNTE5djIuNDA5YzAgLjQwMy4xMzkuNzkuMzg2IDEuMDc0LjUxNC41OTMgMS4zNDcuNTkzIDEuODYxIDAgLjI0Ny0uMjg1LjM4Ni0uNjcxLjM4Ni0xLjA3NHYtMi40MDljMC0uODM5LS41OS0xLjUxOS0xLjMxNy0xLjUxOVptMTguNDI5IDBjLS43MjcgMC0xLjMxNy42OC0xLjMxNyAxLjUxOXYyLjQwOWMwIC40MDMuMTQuNzkuMzg2IDEuMDc0LjUxNC41OTMgMS4zNDguNTkzIDEuODYyIDAgLjI0Ny0uMjg1LjM4NS0uNjcxLjM4NS0xLjA3NHYtMi40MDljMC0uODM5LS41OS0xLjUxOS0xLjMxNi0xLjUxOVptLTE1Ljc5NyAxLjUxOWMwLS44MzkuNTktMS41MTkgMS4zMTctMS41MTlzMS4zMTYuNjggMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLS4xMzkuNzktLjM4NiAxLjA3NC0uNTE0LjU5My0xLjM0Ny41OTMtMS44NjEgMGExLjY0NSAxLjY0NSAwIDAgMS0uMzg2LTEuMDc0di0yLjQwOVptMTkuNzQ2LTEuNTE5Yy0uNzI3IDAtMS4zMTYuNjgtMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLjEzOC43OS4zODUgMS4wNzQuNTE0LjU5MyAxLjM0OC41OTMgMS44NjIgMCAuMjQ3LS4yODUuMzg1LS42NzEuMzg1LTEuMDc0di0yLjQwOWMwLS44MzktLjU4OS0xLjUxOS0xLjMxNi0xLjUxOVptLTE1Ljc5NyAxLjUxOWMwLS44MzkuNTktMS41MTkgMS4zMTctMS41MTlzMS4zMTYuNjggMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLS4xMzkuNzktLjM4NSAxLjA3NC0uNTE0LjU5My0xLjM0OC41OTMtMS44NjIgMGExLjY0NSAxLjY0NSAwIDAgMS0uMzg2LTEuMDc0di0yLjQwOVptMTkuNzQ2LTEuNTE5Yy0uNzI3IDAtMS4zMTYuNjgtMS4zMTYgMS41MTl2Mi40MDljMCAuNDAzLjEzOC43OS4zODUgMS4wNzQuNTE0LjU5MyAxLjM0OC41OTMgMS44NjIgMCAuMjQ3LS4yODUuMzg2LS42NzEuMzg2LTEuMDc0di0yLjQwOWMwLS44MzktLjU5LTEuNTE5LTEuMzE3LTEuNTE5WiIgLz4KICAgIDwvbWFzaz4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIgogICAgICAgIGQ9Ik0wIDEyQzAgNS4zNzMgNS4zNzMgMCAxMiAwaDU2YzYuNjI3IDAgMTIgNS4zNzMgMTIgMTJ2NTZjMCA2LjYyNy01LjM3MyAxMi0xMiAxMkgxMkM1LjM3MyA4MCAwIDc0LjYyNyAwIDY4VjEyWm0zNS4wMDUgMzMuODczYzAgMS4wNTggMS4xMDQgMS43MDMgMS45NTUgMS4xNDJsNy42Ny01LjA1MmMuMzczLS4yNDYuNi0uNjc4LjYtMS4xNDJWMjYuNzQ5czIuNTU2IDAgOC45NDctNC4wNDJjMy4xMjQtMS45NzUgNC43MjEtMy45NTEgNS41MzctNS40NTQuNTMzLS45ODEtLjQ2My0xLjY5NC0xLjQxNy0xLjE4LTIuOTY4IDEuNTk1LTguOTA1IDMuOTQtMTguMTggMy45NC05LjI3NCAwLTE1LjIxMi0yLjM0NS0xOC4xNzktMy45NC0uOTU0LS41MTQtMS45NS4xOTktMS40MTggMS4xOC44MTcgMS41MDMgMi40MTMgMy40NzkgNS41MzggNS40NTQgNi4zOSA0LjA0MiA4Ljk0NyA0LjA0MiA4Ljk0NyA0LjA0MnYxOS4xMjRabS04LjA1MS02LjIzNWMyLjE4IDAgMy45NDktMS44MyAzLjk0OS00LjA4NSAwLTIuMjU3LTEuNzY4LTQuMDg2LTMuOTUtNC4wODYtMi4xOCAwLTMuOTQ5IDEuODMtMy45NDkgNC4wODYgMCAyLjI1NiAxLjc2OCA0LjA4NSAzLjk1IDQuMDg1Wm0zMC4yNzYtNC4wODVjMCAyLjI1Ni0xLjc2OCA0LjA4NS0zLjk0OSA0LjA4NS0yLjE4IDAtMy45NDktMS44My0zLjk0OS00LjA4NSAwLTIuMjU3IDEuNzY4LTQuMDg2IDMuOTUtNC4wODYgMi4xOCAwIDMuOTQ4IDEuODMgMy45NDggNC4wODZaTTI2Ljk1NCA1OC4xMTZjLS43MjcgMC0xLjMxNy42OC0xLjMxNyAxLjUxOXYyLjQwOWMwIC40MDMuMTM5Ljc5LjM4NiAxLjA3NC41MTQuNTkzIDEuMzQ3LjU5MyAxLjg2MSAwIC4yNDctLjI4NS4zODYtLjY3MS4zODYtMS4wNzR2LTIuNDA5YzAtLjgzOS0uNTktMS41MTktMS4zMTctMS41MTlabTE4LjQyOSAwYy0uNzI3IDAtMS4zMTcuNjgtMS4zMTcgMS41MTl2Mi40MDljMCAuNDAzLjE0Ljc5LjM4NiAxLjA3NC41MTQuNTkzIDEuMzQ4LjU5MyAxLjg2MiAwIC4yNDctLjI4NS4zODUtLjY3MS4zODUtMS4wNzR2LTIuNDA5YzAtLjgzOS0uNTktMS41MTktMS4zMTYtMS41MTlabS0xNS43OTcgMS41MTljMC0uODM5LjU5LTEuNTE5IDEuMzE3LTEuNTE5czEuMzE2LjY4IDEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy0uMTM5Ljc5LS4zODYgMS4wNzQtLjUxNC41OTMtMS4zNDcuNTkzLTEuODYxIDBhMS42NDUgMS42NDUgMCAwIDEtLjM4Ni0xLjA3NHYtMi40MDlabTE5Ljc0Ni0xLjUxOWMtLjcyNyAwLTEuMzE2LjY4LTEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy4xMzguNzkuMzg1IDEuMDc0LjUxNC41OTMgMS4zNDguNTkzIDEuODYyIDAgLjI0Ny0uMjg1LjM4NS0uNjcxLjM4NS0xLjA3NHYtMi40MDljMC0uODM5LS41ODktMS41MTktMS4zMTYtMS41MTlabS0xNS43OTcgMS41MTljMC0uODM5LjU5LTEuNTE5IDEuMzE3LTEuNTE5czEuMzE2LjY4IDEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy0uMTM5Ljc5LS4zODUgMS4wNzQtLjUxNC41OTMtMS4zNDguNTkzLTEuODYyIDBhMS42NDUgMS42NDUgMCAwIDEtLjM4Ni0xLjA3NHYtMi40MDlabTE5Ljc0Ni0xLjUxOWMtLjcyNyAwLTEuMzE2LjY4LTEuMzE2IDEuNTE5djIuNDA5YzAgLjQwMy4xMzguNzkuMzg1IDEuMDc0LjUxNC41OTMgMS4zNDguNTkzIDEuODYyIDAgLjI0Ny0uMjg1LjM4Ni0uNjcxLjM4Ni0xLjA3NHYtMi40MDljMC0uODM5LS41OS0xLjUxOS0xLjMxNy0xLjUxOVoiCiAgICAgICAgZmlsbD0iI2ZmZiIgLz4KICAgIDxwYXRoCiAgICAgICAgZD0ibTM2Ljk2IDQ3LjAxNSAxLjEgMS42Ny0xLjEtMS42N1ptNy42Ny01LjA1MiAxLjEgMS42Ny0xLjEtMS42N1ptLjYtMTUuMjE0di0yaC0ydjJoMlptOC45NDctNC4wNDIgMS4wNjkgMS42OS0xLjA2OS0xLjY5Wm01LjUzNy01LjQ1NCAxLjc1OC45NTQtMS43NTgtLjk1NFptLTEuNDE3LTEuMTguOTQ3IDEuNzYtLjk0Ny0xLjc2Wm0tMzYuMzU5IDAtLjk0NyAxLjc2Ljk0Ny0xLjc2Wm0tMS40MTggMS4xOCAxLjc1OC0uOTU1LTEuNzU4Ljk1NVptNS41MzggNS40NTQtMS4wNyAxLjY5IDEuMDctMS42OVptOC45NDcgNC4wNDJoMnYtMmgtMnYyWm0tOC45ODIgMzYuMzcgMS41MTEtMS4zMS0xLjUxMSAxLjMxWm0xLjg2MSAwIDEuNTEyIDEuMzA5LTEuNTEyLTEuMzFabTE2LjU2OCAwLTEuNTExIDEuMzA5IDEuNTExLTEuMzFabTEuODYyIDAgMS41MTEgMS4zMDktMS41MTEtMS4zMVptLTE0LjQ4IDAtMS41MTItMS4zMSAxLjUxMiAxLjMxWm0tMS44NjIgMCAxLjUxMS0xLjMxLTEuNTExIDEuMzFabTE4LjQzIDAtMS41MTIgMS4zMDkgMS41MTEtMS4zMVptMS44NiAwIDEuNTEyIDEuMzA5LTEuNTExLTEuMzFabS0xNC40OCAwIDEuNTEyIDEuMzA5LTEuNTExLTEuMzFabS0xLjg2MSAwLTEuNTExIDEuMzA5IDEuNTExLTEuMzFabTE4LjQzIDAgMS41MS0xLjMxLTEuNTEgMS4zMVptMS44NjEgMCAxLjUxMSAxLjMwOS0xLjUxMS0xLjMxWk0xMi0yQzQuMjY4LTItMiA0LjI2OC0yIDEyaDRDMiA2LjQ3NyA2LjQ3NyAyIDEyIDJ2LTRabTU2IDBIMTJ2NGg1NnYtNFptMTQgMTRjMC03LjczMi02LjI2OC0xNC0xNC0xNHY0YzUuNTIzIDAgMTAgNC40NzcgMTAgMTBoNFptMCA1NlYxMmgtNHY1Nmg0Wk02OCA4MmM3LjczMiAwIDE0LTYuMjY4IDE0LTE0aC00YzAgNS41MjMtNC40NzcgMTAtMTAgMTB2NFptLTU2IDBoNTZ2LTRIMTJ2NFpNLTIgNjhjMCA3LjczMiA2LjI2OCAxNCAxNCAxNHYtNEM2LjQ3NyA3OCAyIDczLjUyMyAyIDY4aC00Wm0wLTU2djU2aDRWMTJoLTRabTM3Ljg2IDMzLjM0NWEuNzkxLjc5MSAwIDAgMSAuODEyLS4wMjEuNjU2LjY1NiAwIDAgMSAuMzMzLjU0OWgtNGMwIDIuNDU0IDIuNzE0IDQuMzU1IDUuMDU1IDIuODEybC0yLjItMy4zNFptNy42NjktNS4wNTItNy42NjkgNS4wNTIgMi4yIDMuMzQgNy42Ny01LjA1Mi0yLjIwMS0zLjM0Wm0tLjI5OS41MjhjMC0uMTc4LjA4Ni0uMzg4LjI5OS0uNTI4bDIuMiAzLjM0YTMuMzY1IDMuMzY1IDAgMCAwIDEuNTAxLTIuODEyaC00Wm0wLTE0LjA3MlY0MC44Mmg0VjI2Ljc0OWgtNFptOS44NzgtNS43MzJjLTMuMDk3IDEuOTU5LTUuMTk3IDIuODk1LTYuNDY0IDMuMzRhOC44NDUgOC44NDUgMCAwIDEtMS4yOC4zNjIgMi40MiAyLjQyIDAgMCAxLS4yMDMuMDMxSDQ1LjE5bC4wMTgtLjAwMWguMDJjLjAwMSAwIC4wMDMgMCAuMDAzIDJzLjAwMiAyIC4wMDMgMmguMDU0YTMuMTk2IDMuMTk2IDAgMCAwIC4yNTYtLjAxN2MuMTQ0LS4wMTQuMzI3LS4wMzguNTUyLS4wOC40NS0uMDg0IDEuMDY5LS4yMzggMS44NzUtLjUyMSAxLjYxLS41NjYgMy45ODItMS42NSA3LjI3Ni0zLjczM2wtMi4xMzgtMy4zODFabTQuODQ5LTQuNzE5Yy0uNjM3IDEuMTczLTEuOTgzIDIuOTA2LTQuODQ5IDQuNzE5bDIuMTM4IDMuMzhjMy4zODItMi4xMzggNS4yMy00LjM1NiA2LjIyNi02LjE5bC0zLjUxNS0xLjkwOVptMS4yODcgMS41MzZjLS4xMDYuMDU2LS40OTQuMTczLS45MTYtLjE1OGExLjIzMyAxLjIzMyAwIDAgMS0uNDQ4LS43Ni45ODUuOTg1IDAgMCAxIC4wNzctLjYxOGwzLjUxNSAxLjkwOWMuMzA4LS41NjguNDcyLTEuMjQ4LjM1MS0xLjk2YTIuNzY4IDIuNzY4IDAgMCAwLTEuMDI1LTEuNzE4Yy0xLjAyNi0uODA1LTIuMzg4LS43ODgtMy40NDktLjIxOGwxLjg5NSAzLjUyM1ptLTE5LjEyNyA0LjE4YzkuNjI4IDAgMTUuODg5LTIuNDM4IDE5LjEyNy00LjE4bC0xLjg5NS0zLjUyM2MtMi42OTYgMS40NS04LjMxIDMuNzAyLTE3LjIzMiAzLjcwMnY0Wm0tMTkuMTI2LTQuMThjMy4yMzggMS43NDIgOS40OTkgNC4xOCAxOS4xMjYgNC4xOHYtNGMtOC45MjEgMC0xNC41MzUtMi4yNTMtMTcuMjMxLTMuNzAzbC0xLjg5NSAzLjUyM1ptMS4yODctMS41MzZjLjA0Mi4wNzguMTMxLjMuMDc3LjYxOWExLjIzMiAxLjIzMiAwIDAgMS0uNDQ5Ljc1OWMtLjQyMi4zMy0uODEuMjE1LS45MTUuMTU4bDEuODk1LTMuNTIzYy0xLjA2LS41Ny0yLjQyNC0uNTg3LTMuNDQ5LjIxOGEyLjc2OCAyLjc2OCAwIDAgMC0xLjAyNiAxLjcxOWMtLjEyLjcxMS4wNDMgMS4zOTEuMzUyIDEuOTU5bDMuNTE1LTEuOTA5Wm00Ljg0OSA0LjcxOWMtMi44NjctMS44MTMtNC4yMTItMy41NDYtNC44NDktNC43MTlsLTMuNTE1IDEuOTA5Yy45OTUgMS44MzQgMi44NDQgNC4wNTIgNi4yMjYgNi4xOWwyLjEzOC0zLjM4Wm03Ljg3OCA1LjczMmMwLTIgLjAwMS0yIC4wMDMtMkgzNS4wNDdsLjAyNS4wMDFoLjAwMWEyLjQyIDIuNDIgMCAwIDEtLjIwMi0uMDMgOC44NTIgOC44NTIgMCAwIDEtMS4yOC0uMzYzYy0xLjI2Ny0uNDQ1LTMuMzY3LTEuMzgxLTYuNDY0LTMuMzRsLTIuMTM4IDMuMzhjMy4yOTMgMi4wODQgNS42NjYgMy4xNjggNy4yNzYgMy43MzQuODA2LjI4MyAxLjQyNS40MzcgMS44NzUuNTJhNi4zNTYgNi4zNTYgMCAwIDAgLjczNy4wOTVsLjA3MS4wMDJoLjA1NGMuMDAxIDAgLjAwMyAwIC4wMDMtMlptMiAxOS4xMjRWMjYuNzQ5aC00djE5LjEyNGg0Wm0tOC4xMDItMTAuMzJjMCAxLjIxNi0uOTM2IDIuMDg1LTEuOTUgMi4wODV2NGMzLjM1IDAgNS45NS0yLjc4OSA1Ljk1LTYuMDg1aC00Wm0tMS45NS0yLjA4NmMxLjAxNCAwIDEuOTUuODcgMS45NSAyLjA4Nmg0YzAtMy4yOTctMi42LTYuMDg2LTUuOTUtNi4wODZ2NFptLTEuOTQ5IDIuMDg2YzAtMS4yMTYuOTM2LTIuMDg2IDEuOTUtMi4wODZ2LTRjLTMuMzUgMC01Ljk1IDIuNzktNS45NSA2LjA4Nmg0Wm0xLjk1IDIuMDg1Yy0xLjAxNCAwLTEuOTUtLjg3LTEuOTUtMi4wODVoLTRjMCAzLjI5NiAyLjYgNi4wODUgNS45NSA2LjA4NXYtNFptMjYuMzI3IDRjMy4zNSAwIDUuOTUtMi43ODkgNS45NS02LjA4NWgtNGMwIDEuMjE2LS45MzcgMi4wODUtMS45NSAyLjA4NXY0Wm0tNS45NDktNi4wODVjMCAzLjI5NiAyLjYgNi4wODUgNS45NSA2LjA4NXYtNGMtMS4wMTQgMC0xLjk1LS44Ny0xLjk1LTIuMDg1aC00Wm01Ljk1LTYuMDg2Yy0zLjM1IDAtNS45NSAyLjc5LTUuOTUgNi4wODZoNGMwLTEuMjE2LjkzNi0yLjA4NiAxLjk1LTIuMDg2di00Wm01Ljk0OCA2LjA4NmMwLTMuMjk3LTIuNi02LjA4Ni01Ljk0OS02LjA4NnY0YzEuMDEzIDAgMS45NS44NyAxLjk1IDIuMDg2aDRaTTI3LjYzNyA1OS42MzVhLjM3LjM3IDAgMCAxLS4xMDMuMjM2Ljc3NC43NzQgMCAwIDEtLjU4LjI0NXYtNGMtMi4wOTEgMC0zLjMxNyAxLjg1NC0zLjMxNyAzLjUxOWg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjEwMy0uMjM2YS40NS40NSAwIDAgMSAuMDg2LjE0Mi4yNzcuMjc3IDAgMCAxIC4wMTcuMDk0aC00YzAgLjg0OC4yOSAxLjcxLjg3NCAyLjM4NGwzLjAyMy0yLjYyWm0tMS4xNjEgMGEuNzc2Ljc3NiAwIDAgMSAuNTgtLjI0NWMuMjcgMCAuNDc2LjEyNC41ODEuMjQ1bC0zLjAyMyAyLjYyYzEuMzEyIDEuNTEzIDMuNTczIDEuNTEzIDQuODg1IDBsLTMuMDIzLTIuNjJabS0uMTAzLjIzNmMwLS4wMjcuMDA0LS4wNTguMDE3LS4wOTRhLjQ1LjQ1IDAgMCAxIC4wODYtLjE0MmwzLjAyMyAyLjYyYTMuNjQ0IDMuNjQ0IDAgMCAwIC44NzQtMi4zODRoLTRabTAtMi40MDl2Mi40MDloNHYtMi40MDloLTRabS42ODMuNDgxYy0uMjkgMC0uNDktLjE0LS41OC0uMjQ1YS4zNy4zNyAwIDAgMS0uMTAzLS4yMzZoNGMwLTEuNjY1LTEuMjI2LTMuNTE5LTMuMzE3LTMuNTE5djRabTE5LjExMy0uNDgxYS4zNy4zNyAwIDAgMS0uMTAyLjIzNi43NzQuNzc0IDAgMCAxLS41ODEuMjQ1di00Yy0yLjA5MSAwLTMuMzE3IDEuODU0LTMuMzE3IDMuNTE5aDRabTAgMi40MDl2LTIuNDA5aC00djIuNDA5aDRabS0uMTAyLS4yMzZhLjQ1LjQ1IDAgMCAxIC4wODUuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxNy4wOTRoLTRjMCAuODQ4LjI5IDEuNzEuODc1IDIuMzg0bDMuMDIzLTIuNjJabS0xLjE2MiAwYS43NzUuNzc1IDAgMCAxIC41OC0uMjQ1Yy4yNzEgMCAuNDc3LjEyNC41ODIuMjQ1bC0zLjAyMyAyLjYyYzEuMzExIDEuNTEzIDMuNTczIDEuNTEzIDQuODg0IDBsLTMuMDIzLTIuNjJabS0uMTAzLjIzNmMwLS4wMjcuMDA1LS4wNTguMDE4LS4wOTRhLjQ1LjQ1IDAgMCAxIC4wODUtLjE0MmwzLjAyMyAyLjYyYTMuNjQ1IDMuNjQ1IDAgMCAwIC44NzQtMi4zODRoLTRabTAtMi40MDl2Mi40MDloNHYtMi40MDloLTRabS42ODQuNDgxYy0uMjkgMC0uNDktLjE0LS41OC0uMjQ1YS4zNjkuMzY5IDAgMCAxLS4xMDQtLjIzNmg0YzAtMS42NjUtMS4yMjUtMy41MTktMy4zMTYtMy41MTl2NFptLTE0LjQ4LTRjLTIuMDkxIDAtMy4zMTcgMS44NTQtMy4zMTcgMy41MTloNGEuMzcuMzcgMCAwIDEtLjEwMy4yMzYuNzc0Ljc3NCAwIDAgMS0uNTguMjQ1di00Wm0zLjMxNiAzLjUxOWMwLTEuNjY1LTEuMjI1LTMuNTE5LTMuMzE2LTMuNTE5djRjLS4yOSAwLS40OS0uMTQtLjU4LS4yNDVhLjM3LjM3IDAgMCAxLS4xMDQtLjIzNmg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjg3NCAyLjM4NGEzLjY0NCAzLjY0NCAwIDAgMCAuODc0LTIuMzg0aC00YzAtLjAyNy4wMDUtLjA1OC4wMTctLjA5NGEuNDUuNDUgMCAwIDEgLjA4Ni0uMTQybDMuMDIzIDIuNjJabS00Ljg4NSAwYzEuMzEyIDEuNTEzIDMuNTczIDEuNTEzIDQuODg1IDBsLTMuMDIzLTIuNjJhLjc3NS43NzUgMCAwIDEgLjU4LS4yNDVjLjI3IDAgLjQ3Ni4xMjQuNTgxLjI0NWwtMy4wMjMgMi42MlptLS44NzQtMi4zODRjMCAuODQ4LjI5IDEuNzEuODc0IDIuMzg0bDMuMDIzLTIuNjJhLjQ1LjQ1IDAgMCAxIC4wODYuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxNy4wOTRoLTRabTAtMi40MDl2Mi40MDloNHYtMi40MDloLTRabTIyLjQzIDBhLjM3LjM3IDAgMCAxLS4xMDMuMjM2Ljc3NC43NzQgMCAwIDEtLjU4MS4yNDV2LTRjLTIuMDkgMC0zLjMxNiAxLjg1NC0zLjMxNiAzLjUxOWg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjEwMy0uMjM2YS40NTMuNDUzIDAgMCAxIC4wODUuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxOC4wOTRoLTRjMCAuODQ4LjI5IDEuNzEuODc0IDIuMzg0bDMuMDIzLTIuNjJabS0xLjE2MiAwYS43NzYuNzc2IDAgMCAxIC41ODEtLjI0NWMuMjcgMCAuNDc2LjEyNC41OC4yNDVsLTMuMDIyIDIuNjJjMS4zMTEgMS41MTMgMy41NzMgMS41MTMgNC44ODQgMGwtMy4wMjMtMi42MlptLS4xMDMuMjM2YzAtLjAyNy4wMDUtLjA1OC4wMTgtLjA5NGEuNDUuNDUgMCAwIDEgLjA4NS0uMTQybDMuMDIzIDIuNjJhMy42NDQgMy42NDQgMCAwIDAgLjg3NC0yLjM4NGgtNFptMC0yLjQwOXYyLjQwOWg0di0yLjQwOWgtNFptLjY4NC40ODFjLS4yOSAwLS40OS0uMTQtLjU4LS4yNDVhLjM3LjM3IDAgMCAxLS4xMDQtLjIzNmg0YzAtMS42NjUtMS4yMjUtMy41MTktMy4zMTYtMy41MTl2NFptLTE0LjQ4LTRjLTIuMDkxIDAtMy4zMTYgMS44NTQtMy4zMTYgMy41MTloNGEuMzcuMzcgMCAwIDEtLjEwNC4yMzYuNzc0Ljc3NCAwIDAgMS0uNTguMjQ1di00Wm0zLjMxNiAzLjUxOWMwLTEuNjY1LTEuMjI1LTMuNTE5LTMuMzE2LTMuNTE5djRjLS4yOSAwLS40OS0uMTQtLjU4LS4yNDVhLjM3LjM3IDAgMCAxLS4xMDQtLjIzNmg0Wm0wIDIuNDA5di0yLjQwOWgtNHYyLjQwOWg0Wm0tLjg3NCAyLjM4NGEzLjY0NCAzLjY0NCAwIDAgMCAuODc0LTIuMzg0aC00YzAtLjAyNy4wMDUtLjA1OC4wMTgtLjA5NGEuNDUuNDUgMCAwIDEgLjA4NS0uMTQybDMuMDIzIDIuNjJabS00Ljg4NCAwYzEuMzExIDEuNTEzIDMuNTczIDEuNTEzIDQuODg0IDBsLTMuMDIzLTIuNjJhLjc3Ni43NzYgMCAwIDEgLjU4LS4yNDVjLjI3MSAwIC40NzcuMTI0LjU4MS4yNDVsLTMuMDIyIDIuNjJabS0uODc0LTIuMzg0YzAgLjg0OC4yODkgMS43MS44NzQgMi4zODRsMy4wMjMtMi42MmEuNDUzLjQ1MyAwIDAgMSAuMDg1LjE0Mi4yNzcuMjc3IDAgMCAxIC4wMTcuMDk0aC00Wm0wLTIuNDA5djIuNDA5aDR2LTIuNDA5aC00Wm0yMi40MjkgMGEuMzcuMzcgMCAwIDEtLjEwMy4yMzYuNzc0Ljc3NCAwIDAgMS0uNTguMjQ1di00Yy0yLjA5MiAwLTMuMzE3IDEuODU0LTMuMzE3IDMuNTE5aDRabTAgMi40MDl2LTIuNDA5aC00djIuNDA5aDRabS0uMTAzLS4yMzZhLjQ1LjQ1IDAgMCAxIC4wODUuMTQyLjI3Ny4yNzcgMCAwIDEgLjAxOC4wOTRoLTRjMCAuODQ4LjI5IDEuNzEuODc0IDIuMzg0bDMuMDIzLTIuNjJabS0xLjE2MiAwYS43NzYuNzc2IDAgMCAxIC41ODEtLjI0NWMuMjcgMCAuNDc2LjEyNC41OC4yNDVsLTMuMDIyIDIuNjJjMS4zMTIgMS41MTMgMy41NzMgMS41MTMgNC44ODUgMGwtMy4wMjMtMi42MlptLS4xMDIuMjM2YzAtLjAyNy4wMDQtLjA1OC4wMTctLjA5NGEuNDU1LjQ1NSAwIDAgMSAuMDg1LS4xNDJsMy4wMjMgMi42MmEzLjY0NSAzLjY0NSAwIDAgMCAuODc1LTIuMzg0aC00Wm0wLTIuNDA5djIuNDA5aDR2LTIuNDA5aC00Wm0uNjgzLjQ4MWMtLjI5IDAtLjQ5LS4xNC0uNTgtLjI0NWEuMzcuMzcgMCAwIDEtLjEwMy0uMjM2aDRjMC0xLjY2NS0xLjIyNi0zLjUxOS0zLjMxNy0zLjUxOXY0WiIKICAgICAgICBmaWxsPSIjZmZmIiBtYXNrPSJ1cmwoI2EpIiAvPgo8L3N2Zz4="
        class="header3__card-recommendation-header-photo header3__card-recommendation-header-photo_default_inverted"
      />
    </div>
    <div class="header3__card-recommendation-header-content">
      <div class="header3__card-recommendation-header-content-tag">
        
          Курс
        
      </div>
      <div class="header3__card-recommendation-header-sub">
        
          <span
            class="header3__card-recommendation-header-sub-chunk header3__card-recommendation-header-sub-chunk_green"
          >
            Скидка 20000 ₽
          </span>
        
      </div>
    </div>
  </div>
  <h6 class="header3__card-recommendation-title">
    AI для аналитики и работы с данными
  </h6>
  <div class="header3__card-recommendation-footer">
    
      
        12 марта
      
      , 2026
      
        · 2 месяца
      
    
  </div>
</a>


      </div>
    
  </div>

  


    
  
  
    
  <div>
    <p class="header3__nav-section-title ">Ответим на ваши вопросы</p>
    
      <div class="header3__nav-section-items  ">
        
  <a
    class="header3__nav-section-item header3__nav-section-item_phone"
    rel="noopener noreferrer"
    href="tel:+7 499 938-92-02"
  >
    <svg
      class="header3__phone-icon"
      width="24"
      height="24"
      viewBox="0 0 24 24"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <path
        d="M14.352 2.75a7.971 7.971 0 0 1 7.041 7.032M14.352 6.293a4.426 4.426 0 0 1 3.5 3.5"
        stroke="currentColor"
        stroke-width="2"
        stroke-linecap="round"
        stroke-linejoin="round"
      ></path>
      <path
        clip-rule="evenodd"
        d="M7.7 16.299C.803 9.4 1.783 6.241 2.51 5.223c.094-.164 2.396-3.611 4.865-1.589 6.126 5.045-1.63 4.332 3.514 9.477 5.146 5.144 4.431-2.611 9.477 3.514 2.022 2.469-1.425 4.771-1.588 4.864-1.018.728-4.178 1.709-11.078-5.19Z"
        stroke="currentColor"
        stroke-width="2"
        stroke-linecap="round"
        stroke-linejoin="round"
        ></path>
    </svg>
    +7 499 938-92-02
  </a>

      </div>
    
  </div>

  


  </div>


          </div>
        </div>
        <div class="header3__hamburger-pagination">
  <div
    class="header3__hamburger-pagination-button header3__hamburger-pagination-button_prev"
  >
    <svg
      width="24"
      height="24"
      viewBox="0 0 24 24"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <path
        d="M19.75 11.726h-15M13.7 5.701l6.05 6.024-6.05 6.025"
        stroke="currentColor"
        stroke-width="1.5"
        stroke-linecap="round"
        stroke-linejoin="round"
      ></path>
    </svg>
  </div>
  <div class="header3__hamburger-pagination-items"></div>
  <div
    class="header3__hamburger-pagination-button header3__hamburger-pagination-button_next"
  >
    <svg
      width="24"
      height="24"
      viewBox="0 0 24 24"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <path
        d="M19.75 11.726h-15M13.7 5.701l6.05 6.024-6.05 6.025"
        stroke="currentColor"
        stroke-width="1.5"
        stroke-linecap="round"
        stroke-linejoin="round"
      ></path>
    </svg>
  </div>
</div>

      </div>
    </div>
  </div>
</div>

    </div>
  </div>
</header>

                        
                    
                

                
                
    <div class="blog js-blog">
        
            
                

<div class="blog__nav-wrapper">
    <div class="nav nav_blue nav_mobile-fix">
        <div class="nav__scroll">
            <div class="container container-relative container-overflow-auto">
                <div class="nav__items nav__float-left">
                    <a href="/nest/" class="nav__item"  title="Блоги">Блоги</a>
                    <a href="/nest/posts/" class="nav__item nav__item_divider nav__item_divider-pad"  title="Посты">
                        Посты
                    </a>
                    <a href="/nest/best/" class="nav__item nav__item_divider"
                        
                     title="Лучшие">
                        Лучшие
                    </a>
                    
                    <a href="/nest/users/" class="nav__item"  title="Участники">Участники</a>

                    <div class="nav__item show-md">
                        <form action="/nest/search/" method="get" class="inline-block search js-search">
    <div class="search__box js-search-box  search__box_close">
        <input autocomplete="off"
               name="q"
               placeholder="Поиск блогов, постов, текста в постах"
               class="search__input input"
                
        />
        <i class="ic ic-close search__box-close js-cancel"></i>
        <button class="button button_gray2 search__box-button">
            <i class="ic ic-search-black search__icon"></i>Найти
        </button>
    </div>
    <div class="search__button js-open-search">
        <i class="ic ic-search search__icon"></i>Поиск
    </div>
</form>

<form action="/nest/post/add/" method="get" class="js-form-need-auth inline-block">
    
        <input type="hidden" name="blog" value="9"/>
    
    
</form>
                    </div>
                </div>

                <div class="nav__items nav__float-right hide-md">
                    <div class="nav__item vertical-middle">
                        <form action="/nest/search/" method="get" class="inline-block search js-search">
    <div class="search__box js-search-box  search__box_close">
        <input autocomplete="off"
               name="q"
               placeholder="Поиск блогов, постов, текста в постах"
               class="search__input input"
                
        />
        <i class="ic ic-close search__box-close js-cancel"></i>
        <button class="button button_gray2 search__box-button">
            <i class="ic ic-search-black search__icon"></i>Найти
        </button>
    </div>
    <div class="search__button js-open-search">
        <i class="ic ic-search search__icon"></i>Поиск
    </div>
</form>

<form action="/nest/post/add/" method="get" class="js-form-need-auth inline-block">
    
        <input type="hidden" name="blog" value="9"/>
    
    
</form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
            
        

        <div class="blog__content">
            
    <div class="container">
        <div class="container__row container__row_gutter-24">
            <div class="container__col container__col_8 container__col_md-12">
                
    

<div class="blog-post">
    <div class="blog__tile blog-post__tile">
        <article class="blog-post-content">
            
                

<div class="post-info">
    <a href="/profile/45136/">
        
            <div class="post-info__avatar ic ic-blog-default-avatar" style="background-image: url(https://cdn.otus.ru/media/public/30/cd/30cda2bff76c491f83b5905dea3fdc93.jpg);"></div>
        
        <div class="post-info__author">Александр</div>
    </a>
    <div class="post-info__time">29.07.19 в 17:45</div>
    
</div>


    <h1 class="blog__h1">Программа самостоятельного изучения PHP. Часть 1</h1>


<div class="post-info">
    <div class="post-info__blogs">
        
            <a href="/nest/php/" class="post-info__blog" title="PHP" >PHP</a> → 
        
            <a href="/nest/php-art/" class="post-info__blog" title="Полезные материалы по PHP" >Полезные материалы по PHP</a>
        
    </div>

    

    
        <div class="post-info__tags">
            Теги: php, php программирование, разработка на php, самостоятельное обучение
        </div>
    
</div>


    
        
            <div class="blog-post-text blog-post-text_markdown markdown">
                
                    <p><img alt="PHP_Deep_23.8-5020-617f54.png" src="https://cdn.otus.ru/media/public/61/7f/PHP_Deep_23.8-5020-617f54.png"></p>
<p>Давно я вынашивал идею создания курса по изучению одного из самых популярных языков Web-среды разработки — <strong>PHP</strong>. Проанализировав количество предложений по видеокурсам, вебинарам и книгам, я понял, что делать ещё один курс не имеет смысла.<cut> </cut></p>
<p>Но по коммерческим причинам за бортом информационного крейсера остались те, кто <strong>изучает программирование самостоятельно</strong>, комбинируя различные источники информации. Поэтому, если <strong>вы начинаете учить язык PHP</strong>, то я надеюсь, что моя программа вам поможет!</p>
<h2>Как это всё читать?</h2>
<p><strong>Цели</strong>. Данный набор шагов по изучению не даст вам ответы на то, как работает тот или иной инструмент языка или его обвязки. Основная цель состоит в том, чтобы получить чёткое описание пошаговой программы изучения языка с пониманием того, что же получится по итогам.</p>
<p><strong>Средства</strong>. Поиск источников информации, данных, выбор технологических решений оставляется на откуп изучающему — он волен сам выбирать, прочитать о технологии из книги, с сайта или посмотреть запись на YouTube. Я постараюсь давать ссылки на материалы, но относитесь к ним именно как к рекомендациям!</p>
<p>Для владеющих английским я настоятельно рекомендую к прочтению статью на <a href="https://hackernoon.com/the-2019-web-developer-roadmap-ab89ac3c380e">Hackernoon</a>, которая отлично раскладывает по полочкам навыки современного веб-программиста.</p>
<p><strong>Уровень входа</strong>. Сам курс подразумевает отсутствие опыта программирования до начала изучения. Однако, мы пишем web-приложение, и оно не сможет обойтись без пользовательского интерфейса, который, в свою очередь, базируется на языке разметки HTML и таблицах стилей CSS. Для этого есть отличный <a href="http://htmlbook.ru/">ресурс</a>. Там можно изучить эти языки, но сам сайт отлично работает и как справочник, так что можно будет к нему обращаться по мере изучения языка.</p>
<p><strong>Содержание</strong>. Каждый блок состоит из нескольких частей:
1. Название части блока и задачи.
2. Постановка цели части блока.
3. Описание практической части, которую необходимо выполнить для того, чтобы усвоить информацию.
4. Описание получаемой ценности.
5. Комментарии и сопутствующие ссылки.
6. Практика. Как видите, каждый блок изучения имеет практическую часть. Запомните:</p>
<h4>Просто читать о технологиях, не практикуясь в их применении, бесполезно! Без практики можете сразу забыть об обучении и не тратить драгоценное время!</h4>
<p><strong>Временные рамки</strong>. Если у вас есть полный рабочий день из 8 часов, который вы можете посвящать обучению, то на первый блок у вас должна уйти неделя непрерывного обучения. Разумеется, кто-то будет совмещать всё с основной работой, но как и с любым обучением я рекомендую посвящать не менее 1.5 часов в день изучению и практике. В идеале — 2-3 часа. Этого хватит для того, чтобы вникнуть в тему, изучить материал и попрактиковаться. Разумеется, при таком подходе изучение первого блока займёт гораздо больше 1 недели, но у вас в первом приоритете должно быть качество, а не скорость!</p>
<h2>Блок 1. Знакомство с языком. Первое приложение</h2>
<p>Итак, начнём. Стремиться будем к тому, чтобы получить работающее приложение. Данный блок посвящён процедурному программированию и пока не рассматривает объекты. Основная цель — познакомиться с фундаментальными вещами.</p>
<h3>Часть 1. Введение и базовые понятия</h3>
<p><strong>Задача</strong>: Установка окружения и запуск PHP.</p>
<p><strong>Цель</strong>: Готовимся к работе с языком и средой.</p>
<p><strong>Ценность</strong>: Мы готовим себе среду, в которой начнём изучать язык. Без неё продвинуться вперёд не получится.</p>
<p><strong>Практика</strong>:
1. Узнать, как работает сайт с применением PHP — разобраться, как приходит запрос, как он передаётся веб-серверу, как он передаётся PHP на выполнение.
2. Установить сборку OpenServer/XAMPP.
3. Установить ПО для написания кода.</p>
<p><strong>Комментарии</strong>. Пока мы ставим упрощённую сборку, которую затем заменим на более «продвинутый» вариант (виртуальную машину или контейнер). Сейчас нужно сконцентрироваться на PHP.</p>
<p>Для начала работы я рекомендую использовать обычные блокноты с подсветкой, например, <strong>Notepad++</strong> или <strong>Sublime</strong>, а не IDE. Дело в том, что IDE будут давать подсказки, не давая нарастить опыт в самостоятельном поиске ошибок и их устранении.</p>
<p><strong>Полезные материалы</strong>:</p>
<ul>
<li><a href="http://htmlbook.ru/">справочник HTML/CSS</a>;</li>
<li><a href="http://https//www.php.net/manual/ru/tutorial.requirements.php">что потребуется для запуска PHP-скриптов?</a></li>
<li><a href="http://phpfaq.ru/newbie/na_tanke">ещё о работе PHP</a>;</li>
<li><a href="https://www.ozon.ru/context/detail/id/137538198/">лучшая книга для начала изучения PHP</a>.</li>
</ul>
<h3>Часть 2. Переменные, типы</h3>
<p><strong>Задача</strong>: Написать первый простой скрипт</p>
<p><strong>Цель</strong>: Первые шаги в программировании.</p>
<p><strong>Ценность</strong>: Начинаем писать настоящий код и запускать его. Ни один PHP-скрипт не работает без переменных. Более того, типизация переменных — важная тема, которая не только полезна в работе, но и крайне интересна интервьюерам на собеседованиях!</p>
<p><strong>Практика</strong>:
1. Понять, что такое переменные.
2. Познакомиться с типами переменных.
3. Узнать, что такое typehinting в PHP7.
4. Узнать про приведение типов и их преобразование.
5. Узнать про правильное именование переменных.
6. Реализовать простые математические операции.
7. Константы.
8. Использование комментариев.</p>
<p><strong>Комментарии</strong>. Помимо того, что переменные вообще можно создавать и использовать, немаловажным моментом является корректность их использования. Например, применение дробной переменной там, где используются целочисленные значения не только приведёт к ненужным накладным расходам, но и может дать неожиданный результат по итогам работы скрипта.</p>
<p>Также важно осознать, почему имена переменных типа «asd» и «massiv_chisel» так нелюбимы профессиональными разработчиками.</p>
<p><strong>Полезные материалы</strong>:</p>
<ul>
<li><a href="https://www.ozon.ru/context/detail/id/28336354/">Роберт Мартин — «Чистый код»</a>;</li>
<li><a href="https://www.php.net/manual/ru/language.variables.php">официальная документация про переменные</a>;</li>
<li><a href="https://svyatoslav.biz/misc/psr_translation/#_PSR-1">базовый стандарт оформления кода в PHP</a>.</li>
</ul>
<h3>Часть 3. Функции</h3>
<p><strong>Задача</strong>: Учимся повторному использованию кода.</p>
<p><strong>Цель</strong>: Сделать код нелинейным и повторно применяемым.</p>
<p><strong>Ценность</strong>: Функции — основополагающая часть любого приложения, которое dы хотите использовать больше 15 минут. Без них нельзя работать ни с объектами, ни со стандартным поведением.</p>
<p>Также мы знакомимся с принципом DRY, который поощряет использование функций.</p>
<p><strong>Практика</strong>:
1. Узнать, что такое DRY.
2. Познакомиться с функциями.
3. Посмотреть, какие переменные и в каком количестве можно передавать в функции.
4. Что такое возвращаемое значение? Как оно происходит?
5. Что такое передача аргументов по ссылке?
6. Что такое статические и глобальные переменные? Чем плохи глобальные переменные?
7. Узнать про про правильное именование функций (см. Роберт Мартин — «Чистый код»).
8. Узнать и научиться правильно применять рекурсию (классическая задача — вычисление ряда Фибоначчи или возведение числа в степень). При изучении массивов нужно будет вернуться к вопросам рекурсии.
9. Изучить синтаксис комментариев PHPDoc.</p>
<p><strong>Комментарии</strong>. Первый сложный для понимания блок, «ломающий мозг», если до этого с функциями не сталкивались. Главное здесь — осознать назначение функций, а также научиться их правильно создавать. Эта часть обучения очень важна для последующих шагов.</p>
<p><strong>Полезные материалы</strong>:</p>
<ul>
<li><a href="https://habr.com/ru/post/144611/">DRY и другие важные принципы</a>;</li>
<li><a href="https://www.php.net/manual/ru/functions.user-defined.php">официальная документация про функции</a>;</li>
<li><a href="https://habr.com/ru/post/337030/">Хабр про рекурсию</a>;</li>
<li><a href="https://habr.com/ru/sandbox/22836/">Хабр про PHPDoc</a>.</li>
</ul>
<h3>Часть 4. Ветвления</h3>
<p><strong>Задача</strong>: Учимся менять логику в зависимости от состояния и внешних воздействий.</p>
<p><strong>Цель</strong>: Увеличиваем нелинейность кода и создаём разветвляющуюся логику.</p>
<p><strong>Ценность</strong>: Ветвления позволяют делать код гибким, а логике дают возможность меняться в зависимости от внешних условий. Этот подход лежит в основе многих современных практик программирования. Без ветвлений невозможно создать даже простой блок логина пользователя.</p>
<p><strong>Практика</strong>:
1. Познакомиться с блок-схемами и тем, как они описывают различные логические схемы.
2. Познакомиться с конструкциями if, if-else, if-else if-else. В качестве условий можно брать математические операции сравнения.
3. Познакомиться с конструкцией <strong>switch</strong>.
4. Насписать код, который будет генерировать случайное число от 1 до 3. В зависимости от сгенерированного числа будет вызываться одна из трёх созданных вами функций.
5. Познакомиться с <strong>тернарным оператором</strong>. Чем тернарный оператор в PHP 7 отличается от него же, но в PHP 5?
6. Что такое статические и глобальные переменные? Чем плохи глобальные переменные?
7. Узнать, какие условия возможны в PHP. Что такое empty, isset, !empty ?
8. Что такое «==» и «===»? Чем они отличаются?</p>
<p><strong>Комментарии</strong>. С ветвлениями нужно быть аккуратными. Они предоставляют мощный механизм построения логических конструкций, но с ними можно быстро скатиться в <strong>спагетти-код</strong>. Поэтому всегда тщательно проектируйте ветвления вашей программы, чтобы она была читаемой и поддерживаемой.</p>
<p><strong>Полезные материалы</strong>:</p>
<ul>
<li><a href="https://habr.com/ru/post/47126/">совсем просто про блок-схемы</a>;</li>
<li><a href="https://ru.wikipedia.org/wiki/%D0%91%D0%BB%D0%BE%D0%BA-%D1%81%D1%85%D0%B5%D0%BC%D0%B0">блок-схемы отлично описываются Википедией</a>;</li>
<li><a href="https://www.php.net/manual/ru/control-structures.elseif.php">официальная документация про ветвления</a>;</li>
<li><a href="http://qaru.site/questions/288323/what-are-the-characteristics-of-spaghetti-code">что такое спагетти-код?</a></li>
</ul>
<h3>Часть 5. Массивы</h3>
<p><strong>Задача</strong>: Знакомимся с первой структурой хранения данных.</p>
<p><strong>Цель</strong>: Узнаём о том, что наборы переменных можно объединять в структуры.</p>
<p><strong>Ценность</strong>: Множество действий в программировании делается не с простыми (скалярными) переменными, а с применением сложных структур. Например, мы попробуем взаимодействовать с хранилищем в виде CSV-файла. Но что, если нам надо поработать с выборкой из 3 строк в одном случае и из 7 — в другом. Нам нужен динамический набор однообразных данных. И эту задачу (и далеко не только её) отлично решают массивы.</p>
<p><strong>Практика</strong>:
1. Узнать, что такое массив.
2. Познакомиться с индексными и ассоциативными массивами.
3. Узнать, что такое многомерные массивы.
4. Слить два массива при помощи array_merge.
5. Что такое array_shift, array_pop, explode, implode?
6. Обратить внимание на полный и сокращённый синтаксис объявления массивов.</p>
<p><strong>Комментарии</strong>. Урок идёт в тесной связке со следующим уроком. Лучше всего изучать их вместе для лучшего понимания.</p>
<p><strong>Полезные материалы</strong>:</p>
<ul>
<li><a href="https://www.php.net/manual/ru/language.types.array.php">официальная документация про массивы</a>;</li>
<li><a href="http://php720.com/lesson/34">а ещё в PHP можно делать вот так</a>.</li>
</ul>
<h3>Часть 6. Циклы</h3>
<p><strong>Задача</strong>: Учимся множественному повторению действий.</p>
<p><strong>Цель</strong>: Объединить вместе знания о переменных, массивах и функциях, научиться эффективно пользоваться наборами данных.</p>
<p><strong>Ценность</strong>: Мы познакомились с большой и важной частью процедурного программирования. Она будет полезна практически всегда. Изученная группа создаёт 90 процентов исполняемого кода. Далее уже начинаются прикладные вопросы, решающие конкретные задачи, тогда как пройденный выше блок будет характерен практически для каждого языка программирования.</p>
<p><strong>Практика</strong>:
1. Познакомиться с циклами while, do-while, for. Понять, что for вполне достаточно (нужно начиться заменять while и do-while при помощи for).
2. Вывести на экран разные циклы. (см. FizzBuzz).
3. Узнать, что такое бесконечный цикл, а также конструкции break и continue.
4. Узнать, что такое цикл foreach.
5. Создать двумерный массив, обойти его вложенными циклами.
6. Взять многомерный массив. Его уже не получится гибко обходить простыми циклами. Нужна рекурсивная функция. <strong>Задача</strong>: создать массив, хранящий многоуровневое меню сайта в виде [Страница — URL — [ Вложенные пункты в том же виде ] ]. Например, до 5 уровней. При помощи рекурсивной функции сгенерировать на его основании древовидное меню на сайт.</p>
<p><strong>Комментарии</strong>. Завершаем с фундаментальными основами. Обязательно уделите время многомерным циклам. Посмотрите на то, как меняется время выполнения программы, если вложенным будет цикл на 1 000, 1 000 000 элементов.</p>
<p><strong>Полезные материалы</strong>:</p>
<ul>
<li><a href="https://www.php.net/manual/ru/control-structures.for.php">цикл for и другие управляющие конструкции</a>;</li>
<li><a href="https://habr.com/ru/post/298134/">о задаче FizzBuzz и не только</a>.</li>
</ul>
<h3>Часть 7. Файлы</h3>
<p><strong>Задача</strong>: Начинаем выносить данные из оперативной памяти в более стабильные хранилища.</p>
<p><strong>Цель</strong>: Научиться работать с примитивным хранилищем данных.</p>
<p><strong>Ценность</strong>: PHP плохо умеет сохранять данные между разными вызовами скриптов сам по себе. Это его особенность. Пока мы не умеем работать с базами данных и другими хранилищами, но уже научимся сохранять информацию в самый простой носитель — файл.</p>
<p>Для чтения же нужно что-то чуть усложнённое, а значит понадобится структура, в качестве которой выступает формат CSV.</p>
<p>Реализация простой фотогалереи с выводом фотографий из указанной папки поможет окончательно закрепить знания в работе с файловой системой.</p>
<p><strong>Практика</strong>:
1. Поработать с простыми файлами — почитать и позаписывать данные.
2. Научиться записывать в файл логи выполнения программы (записать в файл содержимое переменной). Какие режимы работы с файлами существуют?
3. Научиться работать со структурированной информацией — CSV-форматом.
4. Научиться получать списки файлов в директориях и сформировать фотогалерею из файлов, лежащих в указанной папке.
5. Узнать про разницу между абсолютными и относительными адресами.
6. Узнать, что такое домашняя директория сайта, домашняя директория хоста, корневая директория. Чем они отличаются? Когда они нужны?
7. Посчитать слова в файле (считать, что слово — это часть текста, отделённая пробелом или знаком препинания).
8. Как подключать файлы с кодом? В чём разница между include и require? Зачем им _once?
9. Настроить окружение так, чтобы все запросы, кроме запросов к статическим файлам, направлялись к index.php. 10. Зачем нужна такая архитектура? Что такое «человеко-понятный URL»?</p>
<p><strong>Комментарии</strong>. Решаем сугубо прикладные задачи. Обратите особое внимание на последнюю задачу — создание т. н. единой точки доступа в приложение. Такой подход впоследствии вы встретите во многих приложениях и фреймворках. Его нужно освоить и понять, в чём его суть.</p>
<p><strong>Полезные материалы</strong>:</p>
<ul>
<li><a href="https://devenergy.ru/archives/688">считаем слова в файле</a>;</li>
<li><a href="https://habr.com/ru/post/327834/">как правильно логировать данные?</a></li>
<li><a href="https://habr.com/ru/post/115389/">единая точка входа в web-приложения</a>.</li>
</ul>
<h3>Часть 8. Обработка форм</h3>
<p><strong>Задача</strong>: Учимся работать с пользовательским вводом.</p>
<p><strong>Цель</strong>: Научиться делать наше приложение интерактивным.</p>
<p><strong>Ценность</strong>: Формы — это один из немногих способов получения данных от пользователя. Работать с ними — важно. Но не менее важно, чтобы эта обработка была безопасной. Главная идея, которую нужно вынести отсюда — «любые данные, поступающие от пользователя извне, априори опасны, и их надо обязательно проверять и готовить к обработке, прежде чем впускать внутрь системы».</p>
<p><strong>Практика</strong>:
1. Узнать про методы HTTP (GET, PUT, POST, DELETE и т. д.) Чем они отличаются? Чем HTTPS отличается от HTTP? Что такое заголовки? Какие статусы ответа может возвращать сервер?
2. Посмотреть, как создать форму на HTML, которая будет отправлять данные к скрипту script.php.
3. Узнать, что такое суперглобальные массивы $_REQUEST, $_POST, $_GET, $_FILE.
4. Обработать данные от формы и записать их в файл.
5. Узнать, что такое валидация данных (очень хорошо, если удастся разобраться с регулярными выражениями — например, как проверить, что введённый адрес является корректным email-адресом?)
6. Узнать, как защититься от XSS, CSRF атак. Почему и как нужно защищать формы?
7. Узнать, что так CAPTCHA.
8. Научиться загружать файл на сервер.
9. Улучшить фотогалерею — теперь человек сам загружает файлы изображений. Кстати, а точно ли он загружает изображение, а не файл с вирусом?</p>
<p><strong>Комментарии</strong>. Обработать форму довольно просто, но гораздо сложнее обеспечить безопасность работы, ведь, к сожалению, пользователи не на 100 % настроены дружелюбно по отношению к вашему приложению. Поэтому важно не просто принимать данные к обработке.</p>
<p><strong>Полезные материалы</strong>:</p>
<ul>
<li><a href="https://www.php.net/manual/ru/tutorial.forms.php">официальная документация про обработку форм</a>;</li>
<li><a href="https://habr.com/ru/company/pentestit/blog/211494/">защищаемся от XSS</a>;</li>
<li><a href="https://habr.com/ru/post/318748/">защищаемся от CSRF-атак</a>.</li>
</ul>
<h3>Часть 9. Простая работа с базами данных</h3>
<p><strong>Задача</strong>: Структурируем хранение данных.</p>
<p><strong>Цель</strong>: Файлы — это хорошо, но совершенно неоптимально.</p>
<p><strong>Ценность</strong>: Файлы неудобны для хранения тем, что поиск данных в них усложнён и требует создания дополнительного функционала. Сама работа с ними достаточно медленная и тяжеловесная. Базы данных решают не только эту проблему, но и проблему структурирования данных в системе.</p>
<p><strong>Практика</strong>:
1. В сборке, установленной на 1 занятии, есть СУБД (скорее всего MySQL). Научиться подключаться к ней при помощи клиента. Например, HeidiSQL.
2. Научиться создавать простые таблицы с данными.
3. Узнать, что такое 3-нормальная форма и как она реализуется на примере таких структур как библиотеки, новостные сайты, свойства товаров.
4. Изучить простейшие команды выполнения запросов — SELECT, INSERT, UPDATE, DELETE.
5. Усовершенствовать обработку формы обратной связи — сохранять полученные данные в БД.
6. Что, если в форме передаются файлы? Как их привязать к отзыву?
7. Узнать, что такое SQL-инъекция. Как её избежать?</p>
<p><strong>Комментарии</strong>. Практически ни одно современное приложение не обходится без хранилищ. Пока учимся самым простым вещам, чтобы потом их сделать интереснее и сложнее.</p>
<p><strong>Полезные материалы</strong>:</p>
<ul>
<li><a href="https://www.ozon.ru/context/detail/id/28277643/">о MySQL</a>;</li>
<li><a href="https://www.php.net/manual/ru/intro.mysqli.php">расширение PHP для работы с MySQL</a>;</li>
<li><a href="https://habr.com/ru/post/148151/">SQL-инъекции</a>.</li>
</ul>
<h3>Часть 10. Сессии и cookie</h3>
<p><strong>Задача</strong>: Сохраняем состояние пользователя между запросами.</p>
<p><strong>Цель</strong>: Позволить пользователю видеть свою информацию между шагами работы на сайте.</p>
<p><strong>Ценность</strong>: Поскольку скрипты PHP постоянно умирают, нужно как-то сохранять их состояние. Можно делать это и в БД, но это неудобно и дорого. Механизм сессий позволяет привязывать пакет данных к пользователю на протяжении его работы с системой. Cookie помогают пользователю проще идентифицировать себя перед сервером.</p>
<p><strong>Практика</strong>:
1. Познакомиться с механизмом сессий. Выяснить, сколько хранится сессия, как ею управлять.
2. Создать форму авторизации. Логика простая — человек вводит пару логин пароль. После этого его состояние можно сохранять в базе данных и в сессиях.
3. Узнать, почему нельзя хранить пароль пользователя в открытом виде. Узнать, что такое хэш (md5, blowfish, crc32, base64).
4. Научиться сохранять в сессии данные о пользователе после авторизации. Например, создать два скрипта PHP, и показывать на них имя пользователя в случае, если пользователь авторизован.
5. Познакомиться с механизмом Cookie. Чётко понимать, что можно хранить в них, а что нельзя. Почему Cookie — небезопасное хранилище?
6. Реализовать функционал «Запомнить меня» в форме логина.</p>
<p><strong>Комментарии</strong>. Завершающая часть, которая позволяет нам работать с каждым пользователем персонально. Уже после неё можно привязывать к пользователю «Корзину» в интернет-магазине, создавать личные кабинете и т. п.</p>
<p><strong>Полезные материалы</strong>:</p>
<ul>
<li><a href="https://www.php.net/manual/ru/session.examples.basic.php">сессии и Cookies</a>;</li>
<li><a href="https://www.tutorialspoint.com/php/php_login_example.htm">подробный пример формы логина</a>;</li>
<li><a href="https://habr.com/ru/post/210760/">как правильно хэшировать пароли?</a></li>
</ul>
<h3>Часть 11. Первое приложение</h3>
<p><strong>Задача</strong>: Написать первое приложение.</p>
<p><strong>Цель</strong>: Вспомнить всё!</p>
<p><strong>Ценность</strong>: Не просто же так корпели над блоком?</p>
<p><strong>Практика</strong>:
1. Создаём приложение «Личный блог». Пока всё будет очень просто.
2. Модуль «Авторизация». Человек может залогиниться на сайте по заранее созданным логину и паролю, хранимым в БД.
3. Модуль «Роли». Человек может быть анонимом, читателем и админом. Читатель может отправлять сообщения через форму обратной связи. Админу доступна страница создания новых статей (форма).
4. Итого на сайте должны быть следующие страницы: главная со списком статей (например, myblog.com), страница статьи (например, myblog.com/article?id=4 или myblog.com/article/4), страница обратной связи (например, myblog.com/feedback), страница создания статьи (например, myblog.com/new)
5.* Попробуйте улучшить страницу создания новой статьи так, чтобы можно было ещё и редактировать существующие статьи.</p>
<h2>Справились?</h2>
<p><strong>Да, самостоятельное обучение — это довольно сложный процесс</strong>. Но оцените, как приятно ощущается своё первое приложение!</p>
<p><a href="https://otus.ru/nest/post/1005/">Часть 2 здесь!</a></p>
                
            </div>
        
    

            
        </article>

        
    </div>

    
        <div class="blog__tile blog__tile_slim">
            <div class="blog-post__footer">
    
    <div class="blog-post__footer-item blog-post__footer-item_right">
        <div class="inline-block">
            <div class="blog-post__footer-text blog-post__footer-text_share">Поделиться</div>
            <div class="blog-post__footer-icons">
                <div class="blog-post__footer-icon-box hover-ic js-share" data-href="https://otus.ru/nest/post/877/" data-type="tg">
                    <div class="blog-post__footer-icon ic ic-tg-square ic-tg-square-hover"></div>
                </div>
                <div class="blog-post__footer-icon-box hover-ic js-share" data-href="https://otus.ru/nest/post/877/" data-type="tw">
                    <div class="blog-post__footer-icon ic ic-twitter-square ic-twitter-square-hover"></div>
                </div>
                <div class="blog-post__footer-icon-box hover-ic js-share" data-href="https://otus.ru/nest/post/877/" data-type="vk">
                    <div class="blog-post__footer-icon ic ic-vk-square ic-vk-square-hover"></div>
                </div>
                
            </div>
        </div>
        <div class="inline-block float-right_ssm">
            <div class="blog__counters-item blog__counters-item_bookmark">
                <a href="#"
                   class="js-blog-post-mark blog-post__footer-icon blog-post__footer-icon_star"
                   post_id=877></a>
            </div>
        </div>
    </div>

    <div class="blog-post__footer-item">
        <div class="blog-vote">
            
                <div class="blog-vote__item blog-vote__item_border blog-vote__item_left js-blog-post-dislike"
                     data-url="/nest/vote/post/" data-id=877></div>
            
            <div class="blog-vote__item blog-vote__item_border blog-vote__item_center blog-vote__item_pos js-post-votes"
                 data-url="/nest/vote/post/" data-id=877>
                4
            </div>
            
                <div class="blog-vote__item blog-vote__item_border blog-vote__item_right js-blog-post-like"
                     data-url="/nest/vote/post/" data-id=877></div>
            
        </div>
    </div>

    <div class="inline-block float-right_ssm">
        <a class="blog-post__footer-item" href="/nest/post/877/#comments">
            <div class="blog-post__footer-icon blog-post__footer-icon_comments"></div>
            <div class="blog-post__footer-text js-blog-post-comments-counter">0</div>
        </a>

        <div class="blog-post__footer-item">
            <div class="blog-post__footer-icon blog-post__footer-icon_views"></div>
            <div class="blog-post__footer-text">112</div>
        </div>
    </div>
</div>
        </div>
    
</div>

    
        
    <div
        id="formSubscribe"
        class="blog-subscribe__container js-subscribe-container"
    >
        <form
            method="post"
            novalidate
            action="/nest/blog/subscribe/"
            class="js-ajax-form js-new-validation blog-subscribe blog__external"
            data-before-send='[
                {"action": "addClass", "el": "#formSubscribe .js-content", "class": "hidden"},
                {"action": "show", "el": "#formSubscribe .js-loader"}
            ]'
            data-after-complete='[
                {"action": "hide", "el": "#formSubscribe .js-loader"}
            ]'
            data-after-error='[{"action": "removeClass", "el": "#formSubscribe .js-content", "class": "hidden"}]'
            data-after-success='[
                {"action": "addClass", "el": "#formSubscribe .js-block-common", "class": "hidden"},
                {"action": "show", "el": "#formSubscribe .js-block-success"},
                {"action": "addClass", "el": "#formSubscribe.js-subscribe-container", "class": "blog-subscribe__container_finish"}
            ]'
            data-success-msg="false"
        >
            <div class="js-block-common">
                <p class="blog-subscribe__title">Не пропустите новые полезные статьи!</p>
                <div class="blog-subscribe__fields">
                    <input type="hidden" name="csrfmiddlewaretoken" value="98cnIdrC3MedNnRyysAQqH3CBnsPSagny32UXPBA9IrIAQ92AMGmcmaaoZytf62c">
                    <input type="hidden" name="object_id" value="9"/>
                    <div class="js-content">
                        <div class="new-input-line blog-subscribe__input-line">
                            <div class="new-input-group new-input-group_right blog-subscribe__group">
                                <div class="new-input new-input_fake new-input_full">
                                    <input
                                        type="email"
                                        class="new-input new-input_full js-placeholder new-input_border-no blog-subscribe__input"
                                        data-title="email"
                                        autocomplete="email"
                                        name="email"
                                        required
                                        placeholder="Введите ваш email"
                                    />
                                    <div class="new-input__error-sign new-ic new-ic-warning js-new-input-error">
                                        <div class="new-input__error-text-container">
                                            <p class="new-input__error-text js-new-input-error-text"></p>
                                        </div>
                                    </div>
                                </div>
                                <button
                                    type="submit"
                                    class="new-input-group__addon new-input-group__addon_button new-button new-button_blue blog-subscribe__button"
                                >
                                    Подписаться
                                </button>
                            </div>
                        </div>
                        <div class="new-input-line new-input-line_last">
                            <label class="checkbox checkbox_new">
                                <input required type="checkbox" checked name="subscription_agree" value="true">
                                <div class="checkbox__label blog-subscribe__checkbox-text">
                                    Соглашаюсь получать полезные новости, статьи,
                                    приглашения на мастер-классы и специальные предложения OTUS
                                </div>
                            </label>
                            <div class="new-input__error-sign new-ic new-ic-warning js-new-input-error">
                                <div class="new-input__error-text-container">
                                    <p class="new-input__error-text js-new-input-error-text"></p>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="hide js-loader">
                        <i class="ic loader loader_md loader_absolute-center ic-loader"></i>
                    </div>
                </div>
            </div>

            <div class="js-block-success blog-subscribe__success hide">
                <p class="blog-subscribe__title">Спасибо за подписку!</p>
                <p class="blog-subscribe__text text-center">
                    Мы отправили вам письмо для подтверждения вашего email.
                    <br/>
                    С уважением, OTUS!
                </p>
            </div>
        </form>
    </div>


        

<div class="blog__tile" id="author_block">
    <div class="blog__h2">Автор</div>
    <div class="post-info">
        <a href="/profile/45136/">
            <div class="post-info__avatar post-info__avatar_big ic ic-blog-default-avatar" style="background-image: url(https://cdn.otus.ru/media/public/30/cd/30cda2bff76c491f83b5905dea3fdc93.jpg);"></div>
            <div class="post-info__author">Александр</div>
        </a>
        <div class="post-info__text">
            Рейтинг:
            <div class="post-info__text-ratingprofile__rating_pos">
                +62
            </div>
        </div>
        <div class="post-info__text">
            
            2531 день
        </div>
        <div class="post-info__button">
            
        </div>
    </div>
</div>

        
            <div class="blog-tile-wrapper">
                <div class="blog-tile">
                    <div class="blog-tile__item blog-tile__item_no-padding-bottom blog-tile__item_last">
                        <div class="blog__h2 blog__h2_slim">Похожие посты</div>
                    </div>
                    
                        <div class="blog-tile__item">
    <a class="blog-tile__item-title" href="/nest/post/228/" title="Прибавляем два часа рабочего времени на PHP">
        Прибавляем два часа рабочего времени на PHP
    </a>
    <a class="blog-post__footer-item blog-post__footer-item_slim" href="/nest/post/228/#comments">
        <div class="blog-post__footer-icon blog-post__footer-icon_comments"></div>
        <div class="blog-post__footer-text">3</div>
    </a>
    <a class="blog-post__footer-item blog-post__footer-item_slim" href="/nest/post/228/#author_block">
        <div class="blog-post__footer-icon ic ic-blog-rating"></div>
        <div class="blog-post__footer-text">+10</div>
    </a>
</div>
                    
                        <div class="blog-tile__item">
    <a class="blog-tile__item-title" href="/nest/post/237/" title="Внедрение предметно-ориентированного проектирования в PHP">
        Внедрение предметно-ориентированного проектирования в PHP
    </a>
    <a class="blog-post__footer-item blog-post__footer-item_slim" href="/nest/post/237/#comments">
        <div class="blog-post__footer-icon blog-post__footer-icon_comments"></div>
        <div class="blog-post__footer-text">0</div>
    </a>
    <a class="blog-post__footer-item blog-post__footer-item_slim" href="/nest/post/237/#author_block">
        <div class="blog-post__footer-icon ic ic-blog-rating"></div>
        <div class="blog-post__footer-text">+7</div>
    </a>
</div>
                    
                        <div class="blog-tile__item">
    <a class="blog-tile__item-title" href="/nest/post/243/" title="Yii2: первое знакомство">
        Yii2: первое знакомство
    </a>
    <a class="blog-post__footer-item blog-post__footer-item_slim" href="/nest/post/243/#comments">
        <div class="blog-post__footer-icon blog-post__footer-icon_comments"></div>
        <div class="blog-post__footer-text">1</div>
    </a>
    <a class="blog-post__footer-item blog-post__footer-item_slim" href="/nest/post/243/#author_block">
        <div class="blog-post__footer-icon ic ic-blog-rating"></div>
        <div class="blog-post__footer-text">+8</div>
    </a>
</div>
                    
                        <div class="blog-tile__item">
    <a class="blog-tile__item-title" href="/nest/post/245/" title="Используем CodeSniffer ">
        Используем CodeSniffer 
    </a>
    <a class="blog-post__footer-item blog-post__footer-item_slim" href="/nest/post/245/#comments">
        <div class="blog-post__footer-icon blog-post__footer-icon_comments"></div>
        <div class="blog-post__footer-text">0</div>
    </a>
    <a class="blog-post__footer-item blog-post__footer-item_slim" href="/nest/post/245/#author_block">
        <div class="blog-post__footer-icon ic ic-blog-rating"></div>
        <div class="blog-post__footer-text">+8</div>
    </a>
</div>
                    
                        <div class="blog-tile__item">
    <a class="blog-tile__item-title" href="/nest/post/244/" title="Кто виноват и как с этим бороться: о безопасности веб-приложений">
        Кто виноват и как с этим бороться: о безопасности веб-приложений
    </a>
    <a class="blog-post__footer-item blog-post__footer-item_slim" href="/nest/post/244/#comments">
        <div class="blog-post__footer-icon blog-post__footer-icon_comments"></div>
        <div class="blog-post__footer-text">0</div>
    </a>
    <a class="blog-post__footer-item blog-post__footer-item_slim" href="/nest/post/244/#author_block">
        <div class="blog-post__footer-icon ic ic-blog-rating"></div>
        <div class="blog-post__footer-text">+9</div>
    </a>
</div>
                    
                </div>
            </div>
        

        <div class="blog__comments blog__comments-blog-default">
            



<div data-comments>
    <div class="blog__h2">
        <div class="text text_inline text_default js-blog-comments-counter">
            0 комментариев
        </div>
        
    </div>

    <div class="js-comments">
        
        

        
    </div>

    
        <div class="blog-comment-deny">
            
                Для комментирования необходимо <a href="/login/?next=https%3A%2F%2Fotus.ru%2Fnest%2Fpost%2F877%2F">авторизоваться</a>
            
        </div>
    
</div>
        </div>
    

            </div>
            
                <div class="container__col container__col_4 container__col_md-0">
                    <div class="blog-tile-wrapper">
    <div class="blog-tile">
        <div class="blog-tile__title">Популярное</div>
        
            <div class="blog-tile__item blog-tile__item_last">Сегодня тут пусто</div>
        
    </div>
</div>
                </div>
            
        </div>
    </div>

        </div>
    </div>

                

                
                    
    <div class="blog-footer">
                        



    <div class="container cookies__container">
        <div class="cookies__margin-block cookies_hide js-cookie">
            <div class="cookies">
                <div class="cookies__title">
                    Посещая наш сайт, вы принимаете <a class="cookies__link" href="/legal/cookie/" target="_blank">политику использования cookie-файлов</a>
                </div>
                <button class="js-cookie-accept cookies__button">ОК</button>
            </div>
        </div>
    </div>


<footer class="footer2 footer2_header3 footer2_desktop  footer2_not-subscribed no-print ">
    <div class="footer2__container container">
        <div class="footer2__container-box">
            <div class="footer2__content">
                <div class="container__row">
                    <div class="container__col container__col_4">
                        <div class="container__row">
                            <div class="container__col container__col_6 container__col_md-5">
                                

<div class="footer2__links">
    
        <div class="footer2__links-row">
            <a href="/about" class="footer2__link"  title="О нас">О нас</a>
        </div>
        <div class="footer2__links-row">
            <a href="/smi/" class="footer2__link"  title="СМИ о нас">СМИ о нас</a>
        </div>
    

    

    <div class="footer2__links-row">
        <a href="/reviews" class="footer2__link"  title="Отзывы">Отзывы</a>
    </div>
    <div class="footer2__links-row">
        <a href="/contacts/" class="footer2__link"  title="Контакты">Контакты</a>
    </div>

    
        <div class="footer2__links-row">
            <a href="/journal/" class="footer2__link"  title="Блог">Блог</a>
        </div>
        <div class="footer2__links-row">
            <a href="/faq/" class="footer2__link"  title="FAQ">FAQ</a>
        </div>
    
</div>

                            </div>
                            <div class="container__col container__col_6 container__col_md-7">
                                <div class="footer2__icons">
                                    

<div class="footer2__social">
    
    
    
        
            <a href="https://vk.com/club145052891" target="_blank" rel="noreferrer nofollow" class="footer2__icon ic ic-vk-footer2 ic-vk-footer2-hover"></a>
        
        
            <a href="https://zen.yandex.ru/id/5bbcbc1ba5bd5400a990e7d9" target="_blank" rel="noreferrer nofollow" class="footer2__icon ic ic-zen ic-zen-hover"></a>
        
        
            <a href="https://www.youtube.com/channel/UCetgtvy93o3i3CvyGXKFU3g" target="_blank" rel="noreferrer nofollow" class="footer2__icon ic ic-yt-footer2 ic-yt-footer2-hover"></a>
        
    
</div>
                                    
                                        
    <a href="https://ttttt.me/Otusjava" target="_blank" rel="noreferrer nofollow" class="footer2__link-extended hover-ic">
        <div class="footer2__icon ic ic-inline ic-tlgrm-footer2 ic-tlgrm-footer2-hover"></div>
        <p class="footer2__link-extended-text">Канал в Telegram</p>
    </a>


    <a href="https://ttttt.me/joinchat/JMakp0NXc-L8nNneHCtx7A" target="_blank" rel="noreferrer nofollow" class="footer2__link-extended hover-ic" >
        <div class="footer2__icon ic ic-inline ic-tlgrm-footer2 ic-tlgrm-footer2-hover"></div>
        <p class="footer2__link-extended-text">Группа в Telegram</p>
    </a>

                                    
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="container__col container__col_4">
                        

<div class="footer2__links footer2__links_center">
    <div class="footer2__links-row">
        <a href="/b2b" class="footer2__link" rel="nofollow" title="Корпоративное обучение">
            Корпоративное обучение
        </a>
    </div>
    <div class="footer2__links-row">
        <a href="/lessons/" class="footer2__link"  title="Каталог курсов">
            Каталог курсов
        </a>
    </div>

    
        <div class="footer2__links-row">
            <a href="/about/loyalty/" class="footer2__link"  title="Программы лояльности">Программы лояльности</a>
        </div>
        <div class="footer2__links-row">
            <a href="/professions/" class="footer2__link"  title="Каталог профессий">Каталог профессий</a>
        </div>
        <div class="footer2__links-row">
            <a href="/employers/all/" class="footer2__link"  title="Наши партнеры">Наши партнеры</a>
        </div>
    

    <div class="footer2__links-row">
        <a href="/teach/" class="footer2__link"  title="Стать преподавателем">
            Стать преподавателем
        </a>
    </div>
</div>

                    </div>
                    <div class="container__col container__col_4">
                        


    <p class="footer2__text footer2__text_margin-bot">Подписка на новости IT, анонсы открытых уроков, спец. предложения</p>
    <form method="post" class="footer2__subscribe js-subscribe" action="/lessons/subscribe/">
        <input type="hidden" name="csrfmiddlewaretoken" value="98cnIdrC3MedNnRyysAQqH3CBnsPSagny32UXPBA9IrIAQ92AMGmcmaaoZytf62c">
        <input
            required
            type="email" 
            name="email"
            class="input footer2__subscribe-input"
            placeholder="Электронная почта"
            value=""
        />
        <button 
            class="footer2__subscribe-button button button_blue button_as-input"
            type="submit"
             disabled
        >
            Подписаться
        </button>
        
        

<div class="new-input-line new-input-line_relative new-input-line_triple footer2__subscribe-policy">
    <label class="new-checkbox new-checkbox_vertical-center new-log-reg__checkbox">
        <input type="checkbox" checked name="terms_agree" value="true"
               class="js-remove-field-error">
        <div class="new-checkbox__label">
            
                Я принимаю условия
            
            
                <a
                    class="new-link-dotted-blue"
                    target="_blank"
                    href="/legal/privacy/"
                >
                    Политики обработки персональных данных
                </a>
            
            
            и
            
                <a
                    class="new-link-dotted-blue"
                    target="_blank"
                    href="/legal/terms/"
                >
                    Пользовательского соглашения
                </a>
            
            
            и даю
            <a target="_blank" class="new-link-dotted-blue" href="
                /legal/lead_privacy_agree/"
            ">
                свое согласие на обработку персональных данных
            </a>
        </div>
    </label>
</div>

    </form>


                        
                            <p class="footer2__text footer2__text_margin-bot">
                                По всем вопросам пишите на
                                <a class="footer2__link" href="mailto:help@otus.ru" target="_blank" rel="nofollow noreferer" title="help@otus.ru">help@otus.ru</a>
                            </p>
                            
                                <p class="footer2__text footer2__text_margin-bot">
                                    <a
                                        class="footer2__link"
                                        href="/legal/common/"
                                        target="_blank"
                                        rel="nofollow noreferer"
                                        title="Сведения об образовательной организации"
                                    >
                                        Сведения об образовательной организации
                                    </a>
                                </p>
                                <p class="footer2__text footer2__text_margin-bot">
                                    <a
                                        class="footer2__link"
                                        href="/legal/it_company_accreditation/"
                                        target="_blank"
                                        rel="nofollow noreferer"
                                        title="OTUS является аккредитованной IT-компанией"
                                    >
                                        OTUS является аккредитованной IT-компанией
                                    </a>
                                </p>
                                <p class="footer2__text footer2__text_margin-bot">
                                    <a
                                        class="footer2__link"
                                        href="/legal/recommendations/"
                                        target="_blank"
                                        rel="nofollow noreferer"
                                        title="Сведения о рекомендательных технологиях"
                                    >
                                        Сведения о рекомендательных технологиях
                                    </a>
                                </p>
                                <p class="footer2__text footer2__text_margin-bot">
                                    <a
                                        class="footer2__link"
                                        href="https://reestr.digital.gov.ru/reestr/2704482/"
                                        target="_blank"
                                        rel="nofollow noreferer"
                                        title="В реестре отечественного ПО №24216"
                                    >
                                        В реестре отечественного ПО №24216
                                    </a>
                                </p>
                            
                        
                    </div>
                </div>
            </div>
            <div class="footer2__info">
                <div class="container__row">
                    <div class="container__col container__col_bottom container__col_8">
                        <div class="container__row">
                            <div class="container__col container__col_3 container__col_md-7">
                                

<p 
    class="footer2__text footer2__text_nowrap footer2__text_margin-right "
>
    © 2015-2026 OTUS
</p>
                            </div>
                            <div class="container__col container__col_3 container__col_md-5">
                                <a
                                    class="footer2__link footer2__link-white-space-normal"
                                    href="/legal/terms/"
                                    
                                    title="Условия использования сервиса"
                                >
                                    Условия использования сервиса
                                </a>
                            </div>
                        </div>
                    </div>
                    <div class="container__col container__col_middle container__col_4">
                        
                            

<div class="footer2__info-logos footer2__info-logos_desktop">
      <div class="footer2__info-logos-row">
        <div class="footer2__info-logo-box">
          <div class="runet__wrapper">
            <div class="runet">
                <div class="runet__text">Премия Рунета <br>2018</div>
            </div>
        </div>
        </div>
        <div class="footer2__info-logo-box">
            <a class="footer2__info-logo footer2__info-logo_skolkovo" href="http://sk.ru/?utm_source=otus" target="_blank" rel="noreferrer nofollow"></a>
        </div>
      </div>
    <div class="footer2__info-logos-row">
      <div class="footer2__info-logo-box footer2__info-logo-box_not-first footer2__info-logo-box_kts">
          <a class="footer2__info-logo footer2__info-logo_kts" href="https://ktsstudio.com/?utm_source=otus" target="_blank" rel="noreferrer nofollow"></a>
      </div>
      <div class="footer2__info-logo-box footer2__info-logo-box_not-first">
        <a class="footer2__info-logo footer2__info-logo_uno" href="http://goodlookin.ru/?utm_source=otus" target="_blank" rel="noreferrer nofollow"></a>
      </div>
    </div>
    <div class="footer2__info-logos-row">
        <div class="footer2__info-logo-box"></div>
        <div class="footer2__info-logo-box">
            <div class="runet-mobile">
                <div class="runet-mobile__text">Премия Рунета <br>2018</div>
            </div>
        </div>
        <div class="footer2__info-logo-box"></div>
    </div>
</div>

                        
                        
                    </div>
                </div>
            </div>
        </div>
    </div>
</footer>

<div class="footer2 footer2_mobile no-print ">
    <div class="container footer2-mobile__container">
        <div class="footer2-mobile__wrapper">
            <div class="footer2-mobile__row">
                <div class="container__row">
                    <div class="container__col container__col_12">
                        


    <p class="footer2__text footer2__text_margin-bot">Подписка на новости IT, анонсы открытых уроков, спец. предложения</p>
    <form method="post" class="footer2__subscribe js-subscribe" action="/lessons/subscribe/">
        <input type="hidden" name="csrfmiddlewaretoken" value="98cnIdrC3MedNnRyysAQqH3CBnsPSagny32UXPBA9IrIAQ92AMGmcmaaoZytf62c">
        <input
            required
            type="email" 
            name="email"
            class="input footer2__subscribe-input"
            placeholder="Электронная почта"
            value=""
        />
        <button 
            class="footer2__subscribe-button button button_blue button_as-input"
            type="submit"
             disabled
        >
            Подписаться
        </button>
        
        

<div class="new-input-line new-input-line_relative new-input-line_triple footer2__subscribe-policy">
    <label class="new-checkbox new-checkbox_vertical-center new-log-reg__checkbox">
        <input type="checkbox" checked name="terms_agree" value="true"
               class="js-remove-field-error">
        <div class="new-checkbox__label">
            
                Я принимаю условия
            
            
                <a
                    class="new-link-dotted-blue"
                    target="_blank"
                    href="/legal/privacy/"
                >
                    Политики обработки персональных данных
                </a>
            
            
            и
            
                <a
                    class="new-link-dotted-blue"
                    target="_blank"
                    href="/legal/terms/"
                >
                    Пользовательского соглашения
                </a>
            
            
            и даю
            <a target="_blank" class="new-link-dotted-blue" href="
                /legal/lead_privacy_agree/"
            ">
                свое согласие на обработку персональных данных
            </a>
        </div>
    </label>
</div>

    </form>


                        
                            <p class="footer2__text footer2__text_margin-bot">
                                По всем вопросам пишите на
                                <a class="footer2__link"
                                   href="mailto:help@otus.ru"
                                   target="_blank" rel="nofollow noreferer"
                                   title="help@otus.ru">help@otus.ru</a>
                            </p>
                            
                                <p class="footer2__text footer2__text_margin-bot">
                                    <a class="footer2__link"
                                    href="/legal/common/"
                                    target="_blank" rel="nofollow noreferer"
                                    title="Сведения об образовательной организации"
                                    >
                                        Сведения об образовательной организации
                                    </a>
                                </p>
                                <p class="footer2__text footer2__text_margin-bot">
                                    <a
                                        class="footer2__link"
                                        href="/legal/it_company_accreditation/"
                                        target="_blank"
                                        rel="nofollow noreferer"
                                        title="OTUS является аккредитованной IT-компанией"
                                    >
                                        OTUS является аккредитованной IT-компанией
                                    </a>
                                </p>
                                <p class="footer2__text footer2__text_margin-bot">
                                    <a
                                        class="footer2__link"
                                        href="/legal/recommendations/"
                                        target="_blank"
                                        rel="nofollow noreferer"
                                        title="Сведения о рекомендательных технологиях"
                                    >
                                        Сведения о рекомендательных технологиях
                                    </a>
                                </p>
                                <p class="footer2__text footer2__text_margin-bot">
                                    <a
                                        class="footer2__link"
                                        href="https://reestr.digital.gov.ru/reestr/2704482/"
                                        target="_blank"
                                        rel="nofollow noreferer"
                                        title="В реестре отечественного ПО №24216"
                                    >
                                        В реестре отечественного ПО №24216
                                    </a>
                                </p>
                            
                        
                    </div>
                </div>
            </div>
            <div class="footer2-mobile__row footer2-mobile__row_social">
                <div class="container__row">
                    
                        <div class="container__col container__col_7 footer2-mobile__col_tg">
                            
    <a href="https://ttttt.me/Otusjava" target="_blank" rel="noreferrer nofollow" class="footer2__link-extended hover-ic">
        <div class="footer2__icon ic ic-inline ic-tlgrm-footer2 ic-tlgrm-footer2-hover"></div>
        <p class="footer2__link-extended-text">Канал в Telegram</p>
    </a>


    <a href="https://ttttt.me/joinchat/JMakp0NXc-L8nNneHCtx7A" target="_blank" rel="noreferrer nofollow" class="footer2__link-extended hover-ic" >
        <div class="footer2__icon ic ic-inline ic-tlgrm-footer2 ic-tlgrm-footer2-hover"></div>
        <p class="footer2__link-extended-text">Группа в Telegram</p>
    </a>

                        </div>
                    
                    <div class="container__col container__col_5 footer2-mobile__col_social">
                        

<div class="footer2__social footer2__social_mobile">
    
    
    
        
            <a href="https://vk.com/club145052891" target="_blank" rel="noreferrer nofollow" class="footer2__icon ic ic-vk-footer2 ic-vk-footer2-hover"></a>
        
        
            <a href="https://zen.yandex.ru/id/5bbcbc1ba5bd5400a990e7d9" target="_blank" rel="noreferrer nofollow" class="footer2__icon ic ic-zen ic-zen-hover"></a>
        
        
            <a href="https://www.youtube.com/channel/UCetgtvy93o3i3CvyGXKFU3g" target="_blank" rel="noreferrer nofollow" class="footer2__icon ic ic-yt-footer2 ic-yt-footer2-hover"></a>
        
    
</div>
                    </div>
                </div>
            </div>
            <div class="footer2-mobile__row">
                <div class="container__row">
                    <div class="container__col container__col_6 container__col_xs375-8">
                        

<div class="footer2__links ">
    <div class="footer2__links-row">
        <a href="/b2b" class="footer2__link" rel="nofollow" title="Корпоративное обучение">
            Корпоративное обучение
        </a>
    </div>
    <div class="footer2__links-row">
        <a href="/lessons/" class="footer2__link" rel=nofollow title="Каталог курсов">
            Каталог курсов
        </a>
    </div>

    
        <div class="footer2__links-row">
            <a href="/about/loyalty/" class="footer2__link" rel=nofollow title="Программы лояльности">Программы лояльности</a>
        </div>
        <div class="footer2__links-row">
            <a href="/professions/" class="footer2__link" rel=nofollow title="Каталог профессий">Каталог профессий</a>
        </div>
        <div class="footer2__links-row">
            <a href="/employers/all/" class="footer2__link" rel=nofollow title="Наши партнеры">Наши партнеры</a>
        </div>
    

    <div class="footer2__links-row">
        <a href="/teach/" class="footer2__link" rel=nofollow title="Стать преподавателем">
            Стать преподавателем
        </a>
    </div>
</div>

                    </div>
                    <div class="container__col container__col_6 container__col_xs375-4">
                        

<div class="footer2__links">
    
        <div class="footer2__links-row">
            <a href="/about" class="footer2__link" rel=nofollow title="О нас">О нас</a>
        </div>
        <div class="footer2__links-row">
            <a href="/smi/" class="footer2__link" rel=nofollow title="СМИ о нас">СМИ о нас</a>
        </div>
    

    

    <div class="footer2__links-row">
        <a href="/reviews" class="footer2__link" rel=nofollow title="Отзывы">Отзывы</a>
    </div>
    <div class="footer2__links-row">
        <a href="/contacts/" class="footer2__link" rel=nofollow title="Контакты">Контакты</a>
    </div>

    
        <div class="footer2__links-row">
            <a href="/journal/" class="footer2__link" rel=nofollow title="Блог">Блог</a>
        </div>
        <div class="footer2__links-row">
            <a href="/faq/" class="footer2__link" rel=nofollow title="FAQ">FAQ</a>
        </div>
    
</div>

                    </div>
                </div>
            </div>
            <div class="footer2-mobile__row footer2-mobile__row_mark">
                <div class="footer2-mobile__mark">
                    

<p 
    class="footer2__text footer2__text_nowrap footer2__text_margin-right footer2__text_margin-right"
>
    © 2015-2026 OTUS
</p>
                    <a
                        class="footer2__link"
                        href="/legal/terms/" 
                        title="Пользовательское соглашение"
                    >
                        Пользовательское соглашение
                    </a>
                </div>
                <div class="footer2-mobile__logos">
                    
                        

<div class="footer2__info-logos footer2__info-logos_tablet">
    <div class="footer2__info-logos-row_mobile">
        <div class="footer2__info-logo-box">
          <a class="footer2__info-logo footer2__info-logo_skolkovo" href="http://sk.ru/?utm_source=otus" target="_blank" rel="noreferrer nofollow"></a>
        </div>
        <div class="footer2__info-logo-box">
            <div class="runet-mobile">
                <div class="runet-mobile__text">Премия Рунета <br>2018</div>
            </div>
        </div>
      <div class="footer2__info-logo-box footer2__info-logo-box_not-first footer2__info-logo-box_kts">
          <a class="footer2__info-logo footer2__info-logo_kts" href="https://ktsstudio.com/?utm_source=otus" target="_blank" rel="noreferrer nofollow"></a>
      </div>
      <div class="footer2__info-logo-box footer2__info-logo-box_not-first">
        <a class="footer2__info-logo footer2__info-logo_uno" href="http://goodlookin.ru/?utm_source=otus" target="_blank" rel="noreferrer nofollow"></a>
      </div>
    </div>
</div>

<div class="footer2__info-logos footer2__info-logos_mobile">
      <div class="footer2__info-logos-row">
        <div class="footer2__info-logo-box">
          <div class="runet-mobile">
            <div class="runet-mobile__text">Премия Рунета <br>2018</div>
          </div>
        </div>
        <div class="footer2__info-logo-box">
          <a class="footer2__info-logo footer2__info-logo_skolkovo" href="http://sk.ru/?utm_source=otus" target="_blank" rel="noreferrer nofollow"></a>
        </div>
      </div>
    <div class="footer2__info-logos-row">
      <div class="footer2__info-logo-box footer2__info-logo-box_not-first footer2__info-logo-box_kts">
          <a class="footer2__info-logo footer2__info-logo_kts" href="https://ktsstudio.com/?utm_source=otus" target="_blank" rel="noreferrer nofollow"></a>
      </div>
      <div class="footer2__info-logo-box footer2__info-logo-box_not-first">
        <a class="footer2__info-logo footer2__info-logo_uno" href="http://goodlookin.ru/?utm_source=otus" target="_blank" rel="noreferrer nofollow"></a>
      </div>
    </div>
</div>

                    
                    
                </div>
            </div>
        </div>
    </div>
</div>

                    </div>

                
            </div>
        </div>

        


        
            
                



<div class="modal-container hide-top hide-transparent new-log-reg-container"
     data-query='{&quot;next&quot;: &quot;/nest/post/877/&quot;}'
     data-modal-ajax="/login-registration/"
     data-modal-ajax-once="true"
     data-modal-id="new-log-reg"
     data-modal-hide-remove-class="hide-top,hide-transparent"
     data-modal-hide-add-class="hide-transparent"
     data-modal-loading="true"
     data-modal-hide-add-delay-class="hide-top">
    <div class="new-log-reg-loader">
        <div class="new-log-reg__login">
            <div class="loader loader_md loader_absolute-center ic-loader ic"></div>
        </div>
    </div>
    <div class="new-log-reg-wrapper js-modal-content">
        <div class="new-log-reg__login"></div>
    </div>
</div>



<div class="modal-container hide-top hide-transparent new-log-reg-container"
     data-query='{&quot;next&quot;: &quot;/nest/post/877/&quot;}'
     data-modal-ajax="/login-registration/"
     
     data-modal-id="new-log-reg-event"
     data-modal-hide-remove-class="hide-top,hide-transparent"
     data-modal-hide-add-class="hide-transparent"
     data-modal-loading="true"
     data-modal-hide-add-delay-class="hide-top">
    <div class="new-log-reg-loader">
        <div class="new-log-reg__login">
            <div class="loader loader_md loader_absolute-center ic-loader ic"></div>
        </div>
    </div>
    <div class="new-log-reg-wrapper js-modal-content">
        <div class="new-log-reg__login"></div>
    </div>
</div>



<div class="modal-container hide" data-modal-id="restore-password">
    <div class="modal-wrapper modal-wrapper_dark js-modal-wrapper">
        <div class="modal new-log-reg__popup">
            <div class="new-log-reg__popup-body">
                <div class="modal__close new-ic new-ic-close-inverse new-log-reg__popup-close js-close-modal"></div>
                <p class="new-log-reg__popup-title">Восстановление пароля</p>

                <form method="post" class="js-restore-password" action="/api/restore_password.send_email">
                    <input type="hidden" name="csrfmiddlewaretoken" value="98cnIdrC3MedNnRyysAQqH3CBnsPSagny32UXPBA9IrIAQ92AMGmcmaaoZytf62c">

                    <div class="new-log-reg__popup-text new-log-reg__popup-text_slim">
                        Введите электронную почту для восстановления пароля
                    </div>

                    

<div class="new-input-line new-input-line_slim new-input-line_relative">
    <input type="email"
           class="new-input  new-input_full js-placeholder  js-input
           
            
           
            js-required
           
           "
           maxlength=""
           name="email"
           autocomplete="off"
           
           required
           placeholder="Электронная почта"
           
           
           
    />
    
    
    <div class="new-input-error new-input-error_bottom js-validation-error hide "></div>
    <div class="new-input-error new-input-error_info new-input-error_bottom hide"></div>
    
</div>

                    <div class="new-input-line js-error hide">
                        <span class="new-input-line__error new-log-reg__popup-error">
                            Пользователь с таким email не найден
                        </span>
                    </div>

                    <div class="new-input-line">
                        <button class="new-button new-button_md new-button_full new-button_blue"
                                type="submit">Восстановить
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>




<div class="modal-container hide" data-modal-id="phone_duplicate">
    <div class="modal-wrapper modal-wrapper_dark js-modal-wrapper" data-no-wrapper-close="true">
        <div class="modal new-log-reg__popup new-log-reg__popup-body">
            <button class="new-log-reg__popup-close new-ic-close-inverse js-close-modal js-stats"
                 data-event="Register;double_tel_bad"
                 style=""></button>
            <form>
                <p class="new-log-reg__popup-title">
                    Ваш телефон уже привязан к<br/>другой учетной записи
                </p>
                <p class="new-log-reg__popup-text">
                    Ваш телефон <b><nobr class="js-phone-duplicate-phone"></nobr></b> уже
                    привязан к учетной записи <b><nobr class="js-phone-duplicate-acc"></nobr></b>.
                    Выберите учетную запись, с которой желаете продолжить работу.
                    Мы привяжем к ней телефон.
                </p>
                <input class="js-dod-phone-dup-modal-phone" type="hidden" value="" name="phone">
                <div class="dod-phone-dup-modal__loader-container">
                    <div class="js-loader-content">
                        <div class="new-input-line">
                            <button
                                class="new-button new-button_md new-button_full new-button_one-line
                                        new-button_blue-inverse js-stats js-dod-phone-dup-modal-submit"
                                type="submit"
                                data-value="1"
                                data-event="Register;double_tel_ok"
                            >
                                Текущий аккаунт <nobr class="js-phone-duplicate-self-acc"></nobr>
                            </button>
                        </div>
                        <div class="new-input-line">
                            <button
                                class="new-button new-button_md new-button_full new-button_one-line
                                        new-button_blue js-stats js-dod-phone-dup-modal-submit"
                                type="submit"
                                data-value="0"
                                data-event="Register;double_tel_ok"
                            >
                                Войти в аккаунт <nobr class="js-phone-duplicate-acc"></nobr>
                            </button>
                        </div>
                        <div class="new-input-line js-error hide">
                            <span class="new-input-line__error new-log-reg__popup-error js-error-text"></span>
                        </div>
                    </div>
                    <div
                        class="js-loader loader loader_absolute-center loader_md ic ic-loader"
                        style="display: none;"
                    ></div>
                </div>
            </form>
        </div>
    </div>
</div>




    <div class="modal-container hide" data-modal-id="teacher-enrollment">
    <div class="modal-wrapper modal-wrapper_dark js-modal-wrapper" data-no-wrapper-close="true">
        <div class="modal new-log-reg__popup">
            <form class="new-log-reg__popup-body js-email-terms-update js-form-in-modal"
                  action="/teacher/request/"
                  data-modal="teacher-enrollment">
                <div class="modal__close new-ic new-ic-close-inverse new-log-reg__popup-close js-close-modal"></div>

                <div class="new-log-reg__popup-title">
                    Заполните номер телефона
                </div>

                <div class="new-log-reg__popup-text new-log-reg__popup-text_slim">
                    Для отправки заявки в преподаватели заполните номер телефона
                </div>

                

<div class="new-input-line new-input-line_slim new-input-line_relative">
    <input type="text"
           class="new-input  new-input_full js-placeholder  js-input
           
            
           
            js-required
           
           "
           maxlength="255"
           name="phone"
           autocomplete="off"
           data-js-mask="phone"
           required
           placeholder="Телефон"
           
           
           
    />
    
    
    <div class="new-input-error new-input-error_bottom js-validation-error hide "></div>
    <div class="new-input-error new-input-error_info new-input-error_bottom hide"></div>
    
</div>


                <div class="new-input-line js-error hide">
                    <span class="new-input-line__error new-log-reg__popup-error js-text"></span>
                </div>
                <div class="new-input-line">
                    <button class="new-button new-button_md new-button_full new-button_blue"
                            type="submit">Отправить
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>

            
            
        

        
            <script src="https://otus.ru/static/js/common.792bd.js" ></script>

            
                <script src="https://otus.ru/static/js/vendor.common.2ae83.js" ></script>
<script src="https://otus.ru/static/js/vendor.otus.90c85.js" ></script>
<script src="https://otus.ru/static/js/otus.714df.js" ></script>
                <script src="https://otus.ru/static/js/vendor.react.3b8bf.js" ></script>
<script src="https://otus.ru/static/js/vendor.common.2ae83.js" ></script>
<script src="https://otus.ru/static/js/vendor.otus-react:header-search.706a9.js" ></script>
<script src="https://otus.ru/static/js/otus-react:header-search.34d9b.js" ></script>

                
            
        
        


    
        <script type="text/javascript">(window.Image ? (new Image()) : document.createElement('img')).src = 'https://vk.com/rtrg?r=w1EsimsoVZRm*rb04TRjaay1IST5bHFNpthXLyHrq1GCPGzgOmMRcY3mDDdxA17TQOlx6ykxwlrtBtW7sMri/2f364oz1QGDuVvxHFqMqER5NT9mlhp1lYbEMKPIB7NgDRQQp5s2IxBuu*caPsHzTtfILgZJsV5bbkH0m8*GleA-&pixel_id=1000094479';</script>
        <script type="text/javascript">(window.Image ? (new Image()) : document.createElement('img')).src = 'https://vk.com/rtrg?p=VK-RTRG-182645-Hs1B';</script>
        <script type="text/javascript">(window.Image ? (new Image()) : document.createElement('img')).src = 'https://vk.com/rtrg?p=VK-RTRG-110005-dVnpE';</script>
        <script type="text/javascript">(window.Image ? (new Image()) : document.createElement('img')).src = 'https://vk.com/rtrg?p=VK-RTRG-226047-a8wzo';</script>

        
        
            
        
    

    
        <noscript>
            <div>
                
                    <img src="https://mc.yandex.ru/watch/34531570" style="position:absolute; left:-9999px; top: 0;" alt=""/>
                
                    <img src="https://mc.yandex.ru/watch/82755226" style="position:absolute; left:-9999px; top: 0;" alt=""/>
                
                    <img src="https://mc.yandex.ru/watch/93715742" style="position:absolute; left:-9999px; top: 0;" alt=""/>
                
            </div>
        </noscript>
    




    <img height="1" width="1" src="https://happy.otus.ru/pixel/otus.gif?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJyZWZlcmVyIjoiaHR0cHM6Ly9vdHVzLnJ1L25lc3QvcG9zdC84NzcvP3V0bV9zb3VyY2U9dHlwZWluJnV0bV9tZWRpdW09ZGlyZWN0JnV0bV9jYW1wYWlnbj1Ob25lIn0.zFnGecLVWMDnAoM7f9UJLP_1ys1i6DDobjiVXkNLz40" style="position:absolute; left:-9999px; top: 0;" alt="" />




        
            
        
        

        
    </body>
</html>