{"id":12,"date":"2025-11-29T11:58:57","date_gmt":"2025-11-29T11:58:57","guid":{"rendered":"https:\/\/liamidisaobaneportfolio.ovh\/?page_id=12"},"modified":"2026-05-08T20:40:40","modified_gmt":"2026-05-08T20:40:40","slug":"a-propos","status":"publish","type":"page","link":"https:\/\/liamidisaobaneportfolio.ovh\/index.php\/a-propos\/","title":{"rendered":"Mon parcours"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"12\" class=\"elementor elementor-12\">\n\t\t\t\t<div class=\"elementor-element elementor-element-62746ec e-flex e-con-boxed e-con e-parent\" data-id=\"62746ec\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;video&quot;,&quot;background_video_link&quot;:&quot;https:\\\/\\\/liamidisaobaneportfolio.ovh\\\/wp-content\\\/uploads\\\/2025\\\/11\\\/Design-sans-titre.mp4&quot;,&quot;background_play_on_mobile&quot;:&quot;yes&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-background-video-container\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t<video class=\"elementor-background-video-hosted\" autoplay muted playsinline loop><\/video>\n\t\t\t\t\t<\/div>\t\t<div class=\"elementor-element elementor-element-f8430f7 elementor-widget elementor-widget-html\" data-id=\"f8430f7\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section style=\"text-align: center; padding: 80px 20px; font-family: 'Roboto', sans-serif; background: transparent;\">\r\n<h1 style=\"font-size: 4rem; font-weight: 1000; color: #f5f5f5; margin-bottom: 20px letter-spacing: 2px;\">Mon parcours<\/h1>\r\n<p style=\"font-size: 1.3rem; color: #ddd; max-width: 800px; margin: 0 auto; line-height: 1.8;\">D\u00e9couvrez mon parcours, mes comp\u00e9tences et ma passion pour l'informatique.<\/p>\r\n\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-0965307 e-flex e-con-boxed e-con e-parent\" data-id=\"0965307\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-800f95f elementor-widget elementor-widget-html\" data-id=\"800f95f\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- Importation de la police Roboto -->\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto:wght@400;700&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n  body {\r\n    font-family: 'Roboto', sans-serif;\r\n    margin: 0;\r\n    padding: 0;\r\n    background: #f5f5f5;\r\n  }\r\n\r\n  \/* Section \u00c0 PROPOS *\/\r\n  .about-section {\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n    padding: 60px 10%;\r\n    gap: 40px;\r\n    flex-wrap: wrap;\r\n    background-color: #fff;\r\n    border-radius: 10px;\r\n    box-shadow: 0 5px 20px rgba(0,0,0,0.1);\r\n  }\r\n\r\n  .about-text {\r\n    flex: 1 1 500px;\r\n    max-width: 600px;\r\n  }\r\n\r\n  .about-text h1 {\r\n    color: #FFD700;\r\n    font-size: 2rem;\r\n    margin-bottom: 20px;\r\n    font-weight: 700;\r\n  }\r\n\r\n  .about-text h2 {\r\n    color: #000;\r\n    font-size: 2.5rem;\r\n    font-weight: 900;\r\n    margin-bottom: 20px;\r\n  }\r\n\r\n  .about-text p {\r\n    font-size: 1.1rem;\r\n    line-height: 1.8;\r\n    color: #333;\r\n  }\r\n\r\n  .about-image {\r\n    flex: 1 1 300px;\r\n    max-width: 400px;\r\n    height: 400px;\r\n    border-radius: 10px;\r\n    overflow: hidden;\r\n  }\r\n\r\n  .about-image img {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n    border-radius: 10px;\r\n    transition: transform 0.3s ease;\r\n  }\r\n\r\n  .about-image img:hover {\r\n    transform: scale(1.05);\r\n  }\r\n\r\n  \/* Responsive *\/\r\n  @media (max-width: 900px) {\r\n    .about-section {\r\n      flex-direction: column;\r\n      align-items: center;\r\n    }\r\n\r\n    .about-image {\r\n      width: 80%;\r\n      height: 300px;\r\n      margin-top: 30px;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<section class=\"about-section\">\r\n  <div class=\"about-text\">\r\n    <h1>A PROPOS<\/h1>\r\n    <h2>LIAMIDI Saobane<\/h2>\r\n    <p>\r\n      Je suis actuellement en fin de deuxi\u00e8me ann\u00e9e de BTS SIO, sp\u00e9cialit\u00e9 SLAM, o\u00f9 j'ai acquis des comp\u00e9tences solides en d\u00e9veloppement d'applications et en conception de bases de donn\u00e9es. Cependant, ma v\u00e9ritable passion s'est r\u00e9cemment tourn\u00e9e vers un domaine qui me fascine chaque jour davantage : la cybers\u00e9curit\u00e9. Comprendre les failles, anticiper les menaces, prot\u00e9ger les donn\u00e9es sensibles et s\u00e9curiser les syst\u00e8mes sont des d\u00e9fis techniques et strat\u00e9giques qui me motivent profond\u00e9ment. J'aime analyser les vuln\u00e9rabilit\u00e9s, me renseigner sur les derni\u00e8res attaques et bonnes pratiques (OWASP, chiffrement, gestion des acc\u00e8s), et chercher constamment comment rendre une application plus fiable et plus r\u00e9siliente. Aujourd'hui, je souhaite me sp\u00e9cialiser en cybers\u00e9curit\u00e9 pour allier ma rigueur de d\u00e9veloppeur \u00e0 une v\u00e9ritable expertise en protection des syst\u00e8mes d'information, et contribuer \u00e0 des projets o\u00f9 la s\u00e9curit\u00e9 est int\u00e9gr\u00e9e d\u00e8s la conception.\r\n    <\/p>\r\n  <\/div>\r\n  <div class=\"about-image\">\r\n    <img decoding=\"async\" src=\"https:\/\/portfolio-saoban-ndmlaq81sj.live-website.com\/wp-content\/uploads\/2025\/10\/PHOTO_SAO-removebg-preview.png\" \r\n         alt=\"LIAMIDI Saobane\">\r\n  <\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4779a55 e-flex e-con-boxed e-con e-parent\" data-id=\"4779a55\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3cd5f2c elementor-widget elementor-widget-html\" data-id=\"3cd5f2c\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section style=\"background-color: #fff; text-align: center; padding: 50px 20px; font-family: 'Roboto', sans-serif;\">\r\n<h2 style=\"font-size: 1.6rem; font-weight: bold; color: #ffd700; margin-bottom: 5px;\">Parcours Professionnel &amp; Formation<\/h2>\r\n<h1 style=\"font-size: 3.4rem; font-weight: 1000; color: #000; margin-bottom: 50px;\">Exp\u00e9riences &amp; Formation<\/h1>\r\n<div style=\"display: flex; justify-content: center; gap: 40px; flex-wrap: wrap;\">\r\n\r\n<!-- Section Exp\u00e9riences Professionnelles -->\r\n<div style=\"background-color: #fff; border: 2px solid #eee; border-radius: 12px; padding: 30px 40px; width: 500px; text-align: left;\">\r\n<h2 style=\"color: #ffd700; font-weight: bold; font-size: 1.8rem; text-align: center; margin-bottom: 15px; position: relative;\">Exp\u00e9riences Professionnelles<\/h2>\r\n\r\n<!-- Deuxi\u00e8me Stage 2025 -->\r\n<div style=\"position: relative; margin-left: 20px; padding-left: 20px; margin-bottom: 30px;\">\r\n<div style=\"display: flex; align-items: center; gap: 8px; margin-bottom: 8px;\">\r\n<h3 style=\"color: #000; font-weight: bold; font-size: 1.4rem; margin: 0;\">Stage D\u00e9veloppeur fullstack - WordPress<\/h3>\r\n<\/div>\r\n<div style=\"background-color: #ffd700; display: inline-block; padding: 4px 10px; border-radius: 6px; color: #000; font-weight: 600; font-size: 1rem;\">2025 - 2\u00e8me ann\u00e9e BTS<\/div>\r\n<p style=\"margin-top: 15px; color: #000; font-size: 1.2rem; line-height: 1.6;\"><strong>Cr\u00e9ation d'un site WordPress :<\/strong>\r\n- D\u00e9veloppement d'un site vitrine avec int\u00e9gration de boutique en ligne\r\n- Conception de pages de vente et pr\u00e9sentation d'articles\r\n- Mise en place d'un syst\u00e8me de paiement s\u00e9curis\u00e9\r\n- Personnalisation avanc\u00e9e du th\u00e8me et des fonctionnalit\u00e9s\r\n- Optimisation de l'exp\u00e9rience utilisateur et du parcours d'achat<\/p>\r\n<\/div>\r\n\r\n<!-- Premier Stage 2024 -->\r\n<div style=\"position: relative; margin-left: 20px; padding-left: 20px;\">\r\n<div style=\"display: flex; align-items: center; gap: 8px; margin-bottom: 8px;\">\r\n<h3 style=\"color: #000; font-weight: bold; font-size: 1.4rem; margin: 0;\">Stage BTS SIO - D\u00e9veloppement web<\/h3>\r\n<\/div>\r\n<div style=\"background-color: #ffd700; display: inline-block; padding: 4px 10px; border-radius: 6px; color: #000; font-weight: 600; font-size: 1rem;\">2024 - 1\u00e8re ann\u00e9e BTS<\/div>\r\n<p style=\"margin-top: 15px; color: #000; font-size: 1.2rem; line-height: 1.6;\"><strong>Cr\u00e9ation de sites WordPress :<\/strong>\r\n- Conception d'un site vitrine moderne.\r\n- Refonte compl\u00e8te d'un ancien site.\r\n- Gestion des plugins et s\u00e9curit\u00e9.\r\n- Personnalisation du th\u00e8me et du contenu.\r\n- Optimisation SEO de base.<\/p>\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n<!-- Section Dipl\u00f4mes & Formations -->\r\n<div style=\"background-color: #fff; border: 2px solid #eee; border-radius: 12px; padding: 30px 40px; width: 500px; text-align: left;\">\r\n<h2 style=\"color: #ffd700; font-weight: bold; font-size: 1.8rem; text-align: center; margin-bottom: 15px; position: relative;\">Dipl\u00f4mes &amp; Formations<\/h2>\r\n<div style=\"position: relative; margin-left: 20px; padding-left: 20px;\">\r\n<div style=\"display: flex; align-items: center; gap: 8px; margin-bottom: 8px;\">\r\n<h3 style=\"color: #000; font-weight: bold; font-size: 1.4rem; margin: 0;\">BTS SIO Option SLAM<\/h3>\r\n<\/div>\r\n<div style=\"background-color: #ffd700; display: inline-block; padding: 4px 10px; border-radius: 6px; color: #000; font-weight: 600; font-size: 1rem;\">Sept 2024 - Juin 2026 (2 ans)<\/div>\r\n<p style=\"margin-top: 15px; color: #000; font-size: 1.2rem; line-height: 1.6;\"><strong>\u00c9cole IRIS Paris :<\/strong>\r\n- D\u00e9veloppement d'applications web et mobiles\r\n- Conception de bases de donn\u00e9es\r\n- Programmation orient\u00e9e objet (Python, Java)\r\n- Gestion de projet informatique\r\n- S\u00e9curit\u00e9 et maintenance applicative<\/p>\r\n\r\n<div style=\"display: flex; align-items: center; gap: 8px; margin-top: 20px;\">\r\n<h3 style=\"color: #000; font-weight: bold; font-size: 1.4rem; margin: 0;\">Baccalaur\u00e9at G\u00e9n\u00e9ral<\/h3>\r\n<\/div>\r\n<div style=\"background-color: #ffd700; display: inline-block; padding: 4px 10px; border-radius: 6px; color: #000; font-weight: 600; font-size: 1rem; margin-top: 4px;\">Sept 2022 - Juin 2023<\/div>\r\n<p style=\"margin-top: 10px; color: #000; font-size: 1.2rem;\">UFUK - B\u00e9nin<\/p>\r\n\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1db4114 e-flex e-con-boxed e-con e-parent\" data-id=\"1db4114\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3732239 elementor-widget elementor-widget-html\" data-id=\"3732239\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- SECTION COURS OPENCLASSROOM -->\r\n<section style=\"background-color:#fff; text-align:center; padding:80px 10%; font-family:'Roboto', sans-serif;\">\r\n\r\n  <!-- TITRE GLOBAL -->\r\n  <h2 style=\"color:#FFD700; font-size:1.6rem; font-weight:700; margin-bottom:10px;\">\r\n    Cours OpenClassrooms\r\n  <\/h2>\r\n  <h1 style=\"color:#000; font-weight:1000; font-size:3.2rem; margin-bottom:15px;\">\r\n    Formations suivies sur OpenClassrooms\r\n  <\/h1>\r\n  <p style=\"color:#333; font-size:1.1rem; max-width:700px; margin:0 auto 50px; line-height:1.6;\">\r\n    D\u00e9couvrez l'ensemble des comp\u00e9tences acquises dans chaque formation.\r\n  <\/p>\r\n\r\n  <!-- FORMATION WORDPRESS -->\r\n  <div style=\"border:2px solid #eee; border-radius:12px; padding:25px 30px; margin-bottom:25px; position:relative; text-align:left;\">\r\n    <div style=\"display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;\">\r\n      <div style=\"display:flex; align-items:center; gap:15px;\">\r\n        <i class=\"fab fa-wordpress\" style=\"font-size:3rem; color:#21759B;\"><\/i>\r\n        <div>\r\n          <h2 style=\"color:#000; font-weight:900; font-size:1.6rem; margin:0;\">Cr\u00e9ation de site WordPress<\/h2>\r\n          <p style=\"color:#444; font-size:1rem; margin-top:5px;\">Fondamentaux de la conception et gestion de sites WordPress modernes.<\/p>\r\n        <\/div>\r\n      <\/div>\r\n      <div style=\"display:flex; align-items:center; gap:10px;\">\r\n        <div style=\"background-color:#808080; color:#fff; padding:6px 10px; border-radius:5px; font-size:0.9rem;\">15 heures<\/div>\r\n        <div style=\"background-color:#808080; color:#fff; padding:6px 10px; border-radius:5px; font-size:0.9rem;\">Niveau Avanc\u00e9<\/div>\r\n        <div class=\"toggle-btn\" style=\"cursor:pointer; transition:transform 0.3s;\">\r\n          <i class=\"fas fa-caret-down\" style=\"color:#FFD700; font-size:2.5rem;\"><\/i>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- MODULES WORDPRESS -->\r\n    <div class=\"hidden-content\" style=\"display:none; margin-top:20px; color:#333; font-size:1.2rem; line-height:1.6;\">\r\n      \r\n      <div style=\"margin-bottom:15px; background-color:#fff; padding:20px; border-radius:10px; border-left:6px solid #FFD700;\">\r\n        <h3 style=\"font-weight:900; color:#000;\">Module 1 : D\u00e9couverte WordPress<\/h3>\r\n        <ul style=\"margin-top:10px; padding-left:20px;\">\r\n          <li>D\u00e9couverte de WordPress et mise en place du site web<\/li>\r\n          <li>Installation de l\u2019environnement de travail<\/li>\r\n          <li>Initiation au fonctionnement d\u2019un site web<\/li>\r\n          <li>Cr\u00e9ation du premier site WordPress<\/li>\r\n        <\/ul>\r\n      <\/div>\r\n\r\n      <div style=\"margin-bottom:15px; background-color:#fff; padding:20px; border-radius:10px; border-left:6px solid #FFD700;\">\r\n        <h3 style=\"font-weight:900; color:#000;\">Module 2 : Administration<\/h3>\r\n        <ul style=\"margin-top:10px; padding-left:20px;\">\r\n          <li>Prise en main du tableau de bord WordPress<\/li>\r\n          <li>Cr\u00e9ation d\u2019articles et gestion du contenu<\/li>\r\n          <li>Param\u00e9trage g\u00e9n\u00e9ral du site<\/li>\r\n          <li>Cr\u00e9ation d\u2019une page d\u2019accueil et d\u2019un menu de navigation<\/li>\r\n          <li>Personnalisation de l\u2019apparence<\/li>\r\n        <\/ul>\r\n      <\/div>\r\n\r\n      <div style=\"margin-bottom:15px; background-color:#fff; padding:20px; border-radius:10px; border-left:6px solid #FFD700;\">\r\n        <h3 style=\"font-weight:900; color:#000;\">Module 3 : Configuration & Extensions<\/h3>\r\n        <ul style=\"margin-top:10px; padding-left:20px;\">\r\n          <li>Choix et configuration du th\u00e8me<\/li>\r\n          <li>S\u00e9lection des extensions adapt\u00e9es au projet<\/li>\r\n          <li>Param\u00e9trage du builder de pages<\/li>\r\n        <\/ul>\r\n      <\/div>\r\n\r\n      <div style=\"margin-bottom:15px; background-color:#fff; padding:20px; border-radius:10px; border-left:6px solid #FFD700;\">\r\n        <h3 style=\"font-weight:900; color:#000;\">Module 4 : Personnalisation<\/h3>\r\n        <ul style=\"margin-top:10px; padding-left:20px;\">\r\n          <li>Personnalisation du contenu et du design<\/li>\r\n          <li>Pr\u00e9paration de la page d\u2019accueil avec Elementor<\/li>\r\n          <li>Ajout de fonctionnalit\u00e9s compl\u00e9mentaires<\/li>\r\n        <\/ul>\r\n      <\/div>\r\n\r\n      <div style=\"margin-bottom:30px; background-color:#fff; padding:20px; border-radius:10px; border-left:6px solid #FFD700;\">\r\n        <h3 style=\"font-weight:900; color:#000;\">Module 5 : Lancement & Optimisation<\/h3>\r\n        <ul style=\"margin-top:10px; padding-left:20px;\">\r\n          <li>Optimisation SEO et performances<\/li>\r\n          <li>Suivi du trafic<\/li>\r\n          <li>V\u00e9rification finale avant mise en ligne<\/li>\r\n          <li>Mise en ligne du site professionnel<\/li>\r\n        <\/ul>\r\n      <\/div>\r\n\r\n      <!-- COMP\u00c9TENCES WORDPRESS -->\r\n      <div style=\"margin-top:40px;\">\r\n        <h3 style=\"color:#000; font-weight:1000; font-size:1.5rem;\">\r\n          <i class=\"fas fa-brain\" style=\"color:#000; margin-right:8px;\"><\/i>Comp\u00e9tences acquises\r\n        <\/h3>\r\n        <div style=\"display:flex; flex-wrap:wrap; gap:15px; margin-top:20px;\">\r\n          <div style=\"background:#ff0000; color:#fff; padding:10px 18px; border-radius:8px; font-weight:800;\">Cr\u00e9ation de sites WordPress<\/div>\r\n          <div style=\"background:#ff0000; color:#fff; padding:10px 18px; border-radius:8px; font-weight:800;\">Personnalisation de th\u00e8mes<\/div>\r\n          <div style=\"background:#ff0000; color:#fff; padding:10px 18px; border-radius:8px; font-weight:800;\">Optimisation SEO<\/div>\r\n          <div style=\"background:#ff0000; color:#fff; padding:10px 18px; border-radius:8px; font-weight:800;\">Gestion de contenu<\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- FORMATION PYTHON -->\r\n  <div style=\"border:2px solid #eee; border-radius:12px; padding:25px 30px; margin-bottom:25px; position:relative; text-align:left;\">\r\n    <div style=\"display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;\">\r\n      <div style=\"display:flex; align-items:center; gap:15px;\">\r\n        <i class=\"fab fa-python\" style=\"font-size:3rem; color:#3776AB;\"><\/i>\r\n        <div>\r\n          <h2 style=\"color:#000; font-weight:900; font-size:1.6rem; margin:0;\">Les bases du langage Python<\/h2>\r\n          <p style=\"color:#444; font-size:1rem; margin-top:5px;\">Apprentissage du langage Python et de la logique de programmation.<\/p>\r\n        <\/div>\r\n      <\/div>\r\n      <div style=\"display:flex; align-items:center; gap:10px;\">\r\n        <div style=\"background-color:#808080; color:#fff; padding:6px 10px; border-radius:5px; font-size:0.9rem;\">6 heures<\/div>\r\n        <div style=\"background-color:#808080; color:#fff; padding:6px 10px; border-radius:5px; font-size:0.9rem;\">Niveau D\u00e9butant<\/div>\r\n        <div class=\"toggle-btn\" style=\"cursor:pointer; transition:transform 0.3s;\">\r\n          <i class=\"fas fa-caret-down\" style=\"color:#FFD700; font-size:2.5rem;\"><\/i>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- MODULES PYTHON -->\r\n    <div class=\"hidden-content\" style=\"display:none; margin-top:20px; color:#333; font-size:1.2rem; line-height:1.6;\">\r\n      \r\n      <div style=\"margin-bottom:15px; background-color:#fff; padding:20px; border-radius:10px; border-left:6px solid #FFD700;\">\r\n        <h3 style=\"font-weight:900; color:#000;\">Module 1 : Cr\u00e9ation de donn\u00e9es<\/h3>\r\n        <ul style=\"margin-top:10px; padding-left:20px;\">\r\n          <li>Installation de l\u2019environnement Python<\/li>\r\n          <li>Lancement du premier programme<\/li>\r\n          <li>Utilisation de variables et types de donn\u00e9es<\/li>\r\n          <li>Manipulation des listes et dictionnaires<\/li>\r\n        <\/ul>\r\n      <\/div>\r\n\r\n      <div style=\"margin-bottom:15px; background-color:#fff; padding:20px; border-radius:10px; border-left:6px solid #FFD700;\">\r\n        <h3 style=\"font-weight:900; color:#000;\">Module 2 : Logique de programmation<\/h3>\r\n        <ul style=\"margin-top:10px; padding-left:20px;\">\r\n          <li>Gestion des conditions et boucles<\/li>\r\n          <li>Cr\u00e9ation de fonctions<\/li>\r\n          <li>Am\u00e9lioration de la lisibilit\u00e9 et gestion des erreurs<\/li>\r\n        <\/ul>\r\n      <\/div>\r\n\r\n      <div style=\"margin-bottom:30px; background-color:#fff; padding:20px; border-radius:10px; border-left:6px solid #FFD700;\">\r\n        <h3 style=\"font-weight:900; color:#000;\">Module 3 : Extraction de donn\u00e9es Web<\/h3>\r\n        <ul style=\"margin-top:10px; padding-left:20px;\">\r\n          <li>Importation et utilisation de packages<\/li>\r\n          <li>Extraction et transformation des donn\u00e9es web<\/li>\r\n          <li>Chargement et manipulation de fichiers de donn\u00e9es<\/li>\r\n        <\/ul>\r\n      <\/div>\r\n\r\n      <!-- COMP\u00c9TENCES PYTHON -->\r\n      <div style=\"margin-top:40px;\">\r\n        <h3 style=\"color:#000; font-weight:1000; font-size:1.5rem;\">\r\n          <i class=\"fas fa-brain\" style=\"color:#000; margin-right:8px;\"><\/i>Comp\u00e9tences acquises\r\n        <\/h3>\r\n        <div style=\"display:flex; flex-wrap:wrap; gap:15px; margin-top:20px;\">\r\n          <div style=\"background:#ff0000; color:#fff; padding:10px 18px; border-radius:8px; font-weight:800;\">Programmation Python<\/div>\r\n          <div style=\"background:#ff0000; color:#fff; padding:10px 18px; border-radius:8px; font-weight:800;\">Logique de code<\/div>\r\n          <div style=\"background:#ff0000; color:#fff; padding:10px 18px; border-radius:8px; font-weight:800;\">Manipulation de donn\u00e9es<\/div>\r\n          <div style=\"background:#ff0000; color:#fff; padding:10px 18px; border-radius:8px; font-weight:800;\">Extraction Web<\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- FORMATION SQL -->\r\n  <div style=\"border:2px solid #eee; border-radius:12px; padding:25px 30px; margin-bottom:25px; position:relative; text-align:left;\">\r\n    <div style=\"display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;\">\r\n      <div style=\"display:flex; align-items:center; gap:15px;\">\r\n        <i class=\"fas fa-database\" style=\"font-size:3rem; color:#4479A1;\"><\/i>\r\n        <div>\r\n          <h2 style=\"color:#000; font-weight:900; font-size:1.6rem; margin:0;\">Perfectionnez ma ma\u00eetrise de SQL<\/h2>\r\n          <p style=\"color:#444; font-size:1rem; margin-top:5px;\">Ma\u00eetrise approfondie de SQL : requ\u00eates complexes, optimisation, proc\u00e9dures stock\u00e9es et fonctions avanc\u00e9es.<\/p>\r\n        <\/div>\r\n      <\/div>\r\n      <div style=\"display:flex; align-items:center; gap:10px;\">\r\n        <div style=\"background-color:#808080; color:#fff; padding:6px 10px; border-radius:5px; font-size:0.9rem;\">10 heures<\/div>\r\n        <div style=\"background-color:#808080; color:#fff; padding:6px 10px; border-radius:5px; font-size:0.9rem;\">Niveau Avanc\u00e9<\/div>\r\n        <div class=\"toggle-btn\" style=\"cursor:pointer; transition:transform 0.3s;\">\r\n          <i class=\"fas fa-caret-down\" style=\"color:#FFD700; font-size:2.5rem;\"><\/i>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- MODULES SQL -->\r\n    <div class=\"hidden-content\" style=\"display:none; margin-top:20px; color:#333; font-size:1.2rem; line-height:1.6;\">\r\n      \r\n      <div style=\"margin-bottom:15px; background-color:#fff; padding:20px; border-radius:10px; border-left:6px solid #FFD700;\">\r\n        <h3 style=\"font-weight:900; color:#000;\">Partie 1 : Ma\u00eetrisez les fonctions avanc\u00e9es dans SQL<\/h3>\r\n        <ul style=\"margin-top:10px; padding-left:20px;\">\r\n          <li>Tirez un maximum de ce cours<\/li>\r\n          <li>Mettez en place votre environnement SQL<\/li>\r\n          <li>Maitrisez les dates et les tableaux<\/li>\r\n          <li>R\u00e9cup\u00e9rez vos informations associ\u00e9es \u00e0 votre base de donn\u00e9es<\/li>\r\n          <li>Fiabilisez vos donn\u00e9es \u00e0 l'aide de contraintes<\/li>\r\n          <li>Quiz : Ma\u00eetriser les fonctions avanc\u00e9es dans SQL<\/li>\r\n        <\/ul>\r\n      <\/div>\r\n\r\n      <div style=\"margin-bottom:30px; background-color:#fff; padding:20px; border-radius:10px; border-left:6px solid #FFD700;\">\r\n        <h3 style=\"font-weight:900; color:#000;\">Partie 2 : R\u00e9solvez des requ\u00eates SQL complexes<\/h3>\r\n        <ul style=\"margin-top:10px; padding-left:20px;\">\r\n          <li>R\u00e9solvez des requ\u00eates complexes gr\u00e2ce aux jointures<\/li>\r\n          <li>Rendez accessible le retour d'une requ\u00eate gr\u00e2ce aux vues<\/li>\r\n          <li>Mettez en place des proc\u00e9dures et fonctions stock\u00e9es<\/li>\r\n          <li>Quiz : R\u00e9soudre des requ\u00eates SQL complexes<\/li>\r\n        <\/ul>\r\n      <\/div>\r\n\r\n      <!-- COMP\u00c9TENCES SQL -->\r\n      <div style=\"margin-top:40px;\">\r\n        <h3 style=\"color:#000; font-weight:1000; font-size:1.5rem;\">\r\n          <i class=\"fas fa-brain\" style=\"color:#000; margin-right:8px;\"><\/i>Comp\u00e9tences acquises\r\n        <\/h3>\r\n        <div style=\"display:flex; flex-wrap:wrap; gap:15px; margin-top:20px;\">\r\n          <div style=\"background:#ff0000; color:#fff; padding:10px 18px; border-radius:8px; font-weight:800;\">Requ\u00eates SQL complexes<\/div>\r\n          <div style=\"background:#ff0000; color:#fff; padding:10px 18px; border-radius:8px; font-weight:800;\">Jointures et sous-requ\u00eates<\/div>\r\n          <div style=\"background:#ff0000; color:#fff; padding:10px 18px; border-radius:8px; font-weight:800;\">Proc\u00e9dures stock\u00e9es<\/div>\r\n          <div style=\"background:#ff0000; color:#fff; padding:10px 18px; border-radius:8px; font-weight:800;\">Fen\u00eatrage (Window functions)<\/div>\r\n          <div style=\"background:#ff0000; color:#fff; padding:10px 18px; border-radius:8px; font-weight:800;\">Optimisation et contraintes<\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<!-- Font Awesome -->\r\n<script src=\"https:\/\/kit.fontawesome.com\/a076d05399.js\" crossorigin=\"anonymous\"><\/script>\r\n\r\n<!-- SCRIPT TOGGLE -->\r\n<script>\r\ndocument.querySelectorAll('.toggle-btn').forEach(btn => {\r\n  btn.addEventListener('click', () => {\r\n    const hiddenContent = btn.parentElement.parentElement.nextElementSibling;\r\n    const icon = btn.querySelector('i');\r\n    const isVisible = hiddenContent.style.display === 'block';\r\n\r\n    hiddenContent.style.display = isVisible ? 'none' : 'block';\r\n    icon.style.transform = isVisible ? 'rotate(0deg)' : 'rotate(180deg)';\r\n  });\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7242c2c e-flex e-con-boxed e-con e-parent\" data-id=\"7242c2c\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0e69071 elementor-widget elementor-widget-html\" data-id=\"0e69071\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section style=\"background-color: #fff; text-align: center; padding: 50px 20px; font-family: 'Roboto', sans-serif;\">\r\n    <h1 style=\"font-size: 2.5rem; font-weight: bold; color: #000; margin-bottom: 40px;\">Langages et outils utilis\u00e9s<\/h1>\r\n    \r\n    <div style=\"display: flex; justify-content: center; flex-wrap: wrap; gap: 30px; max-width: 900px; margin: 0 auto;\">\r\n        <!-- Java -->\r\n        <div style=\"text-align: center; width: 100px;\">\r\n            <div style=\"background: #fff; width: 70px; height: 70px; border-radius: 15px; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); padding: 10px;\">\r\n                <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/java_logo.png\" alt=\"Java\" style=\"width: 50px; height: 50px; object-fit: contain;\">\r\n            <\/div>\r\n            <span style=\"color: #000; font-weight: 600; font-size: 1rem;\">Java<\/span>\r\n        <\/div>\r\n\r\n        <!-- HTML -->\r\n        <div style=\"text-align: center; width: 100px;\">\r\n            <div style=\"background: #fff; width: 70px; height: 70px; border-radius: 15px; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); padding: 10px;\">\r\n                <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/html_logo.png\" alt=\"HTML\" style=\"width: 50px; height: 50px; object-fit: contain;\">\r\n            <\/div>\r\n            <span style=\"color: #000; font-weight: 600; font-size: 1rem;\">HTML<\/span>\r\n        <\/div>\r\n\r\n        <!-- CSS -->\r\n        <div style=\"text-align: center; width: 100px;\">\r\n            <div style=\"background: #fff; width: 70px; height: 70px; border-radius: 15px; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); padding: 10px;\">\r\n                <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/css_logo.png\" alt=\"CSS\" style=\"width: 50px; height: 50px; object-fit: contain;\">\r\n            <\/div>\r\n            <span style=\"color: #000; font-weight: 600; font-size: 1rem;\">CSS<\/span>\r\n        <\/div>\r\n\r\n        <!-- JavaScript -->\r\n        <div style=\"text-align: center; width: 100px;\">\r\n            <div style=\"background: #fff; width: 70px; height: 70px; border-radius: 15px; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); padding: 10px;\">\r\n                <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/javascript_logo.png\" alt=\"JavaScript\" style=\"width: 50px; height: 50px; object-fit: contain;\">\r\n            <\/div>\r\n            <span style=\"color: #000; font-weight: 600; font-size: 1rem;\">JavaScript<\/span>\r\n        <\/div>\r\n\r\n        <!-- WordPress -->\r\n        <div style=\"text-align: center; width: 100px;\">\r\n            <div style=\"background: #fff; width: 70px; height: 70px; border-radius: 15px; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); padding: 10px;\">\r\n                <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/wordpress_logo.png\" alt=\"WordPress\" style=\"width: 50px; height: 50px; object-fit: contain;\">\r\n            <\/div>\r\n            <span style=\"color: #000; font-weight: 600; font-size: 1rem;\">WordPress<\/span>\r\n        <\/div>\r\n\r\n        <!-- C -->\r\n        <div style=\"text-align: center; width: 100px;\">\r\n            <div style=\"background: #fff; width: 70px; height: 70px; border-radius: 15px; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); padding: 10px;\">\r\n                <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/Langage_C_logo.png\" alt=\"Langage C\" style=\"width: 50px; height: 50px; object-fit: contain;\">\r\n            <\/div>\r\n            <span style=\"color: #000; font-weight: 600; font-size: 1rem;\">Langage C<\/span>\r\n        <\/div>\r\n\r\n        <!-- SQL -->\r\n        <div style=\"text-align: center; width: 100px;\">\r\n            <div style=\"background: #fff; width: 70px; height: 70px; border-radius: 15px; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); padding: 10px;\">\r\n                <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/sql_logo.png\" alt=\"SQL\" style=\"width: 50px; height: 50px; object-fit: contain;\">\r\n            <\/div>\r\n            <span style=\"color: #000; font-weight: 600; font-size: 1rem;\">SQL<\/span>\r\n        <\/div>\r\n\r\n        <!-- MySQL -->\r\n        <div style=\"text-align: center; width: 100px;\">\r\n            <div style=\"background: #fff; width: 70px; height: 70px; border-radius: 15px; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); padding: 10px;\">\r\n                <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/mysql_logo.png\" alt=\"MySQL\" style=\"width: 50px; height: 50px; object-fit: contain;\">\r\n            <\/div>\r\n            <span style=\"color: #000; font-weight: 600; font-size: 1rem;\">MySQL<\/span>\r\n        <\/div>\r\n\r\n        <!-- Visual Studio Code -->\r\n        <div style=\"text-align: center; width: 100px;\">\r\n            <div style=\"background: #fff; width: 70px; height: 70px; border-radius: 15px; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); padding: 10px;\">\r\n                <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/vscode_logo.png\" alt=\"VS Code\" style=\"width: 50px; height: 50px; object-fit: contain;\">\r\n            <\/div>\r\n            <span style=\"color: #000; font-weight: 600; font-size: 1rem;\">VS Code<\/span>\r\n        <\/div>\r\n\r\n        <!-- XAMPP -->\r\n        <div style=\"text-align: center; width: 100px;\">\r\n            <div style=\"background: #fff; width: 70px; height: 70px; border-radius: 15px; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); padding: 10px;\">\r\n                <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/xampp_logo.png\" alt=\"XAMPP\" style=\"width: 50px; height: 50px; object-fit: contain;\">\r\n            <\/div>\r\n            <span style=\"color: #000; font-weight: 600; font-size: 1rem;\">XAMPP<\/span>\r\n        <\/div>\r\n\r\n        <!-- Eclipse -->\r\n        <div style=\"text-align: center; width: 100px;\">\r\n            <div style=\"background: #fff; width: 70px; height: 70px; border-radius: 15px; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); padding: 10px;\">\r\n                <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/eclipse_logo.png\" alt=\"Eclipse\" style=\"width: 50px; height: 50px; object-fit: contain;\">\r\n            <\/div>\r\n            <span style=\"color: #000; font-weight: 600; font-size: 1rem;\">Eclipse<\/span>\r\n        <\/div>\r\n\r\n        <!-- UML -->\r\n        <div style=\"text-align: center; width: 100px;\">\r\n            <div style=\"background: #fff; width: 70px; height: 70px; border-radius: 15px; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); padding: 10px;\">\r\n                <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/UML_logo.png\" alt=\"UML\" style=\"width: 50px; height: 50px; object-fit: contain;\">\r\n            <\/div>\r\n            <span style=\"color: #000; font-weight: 600; font-size: 1rem;\">UML<\/span>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-aff7513 e-flex e-con-boxed e-con e-parent\" data-id=\"aff7513\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-79a00f3 elementor-widget elementor-widget-html\" data-id=\"79a00f3\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- SECTION MESURES D'EXPERTISE -->\r\n<section style=\"background-color:#fff; padding:100px 10%; font-family:'Roboto', sans-serif; text-align:center;\">\r\n\r\n  <!-- Titres centr\u00e9s -->\r\n  <div style=\"margin-bottom:60px;\">\r\n    <h3 style=\"color:#FFD700; font-size:1.2rem; font-weight:700; letter-spacing:2px; margin:0;\">\r\n      MESURES D'EXPERTISE\r\n    <\/h3>\r\n    <h1 style=\"color:#000; font-size:2.6rem; font-weight:1000; margin-top:10px;\">\r\n      Comp\u00e9tences Quantifi\u00e9es\r\n    <\/h1>\r\n  <\/div>\r\n\r\n  <!-- Trois sections -->\r\n  <div style=\"display:flex; justify-content:center; gap:40px; flex-wrap:wrap;\">\r\n\r\n    <!-- SECTION 1 - D\u00e9veloppement -->\r\n    <div style=\"flex:1; min-width:280px; max-width:400px; background:#fff; border:1.5px solid #ddd; border-radius:15px; padding:30px; box-shadow:0 2px 8px rgba(0,0,0,0.05);\">\r\n      <i class=\"fas fa-code\" style=\"font-size:2.3rem; color:#FFD700; margin-bottom:10px;\"><\/i>\r\n      <h2 style=\"color:#000; font-weight:900; font-size:1.7rem;\">D\u00e9veloppement<\/h2>\r\n\r\n      <!-- Cercle -->\r\n      <div style=\"position:relative; width:120px; height:120px; margin:25px auto;\">\r\n        <svg width=\"120\" height=\"120\">\r\n          <circle cx=\"60\" cy=\"60\" r=\"52\" stroke=\"#eee\" stroke-width=\"10\" fill=\"none\"\/>\r\n          <circle cx=\"60\" cy=\"60\" r=\"52\" stroke=\"#FFD700\" stroke-width=\"10\" fill=\"none\"\r\n                  stroke-dasharray=\"326\" stroke-dashoffset=\"32\"\r\n                  style=\"transform:rotate(-90deg); transform-origin:50% 50%; transition:0.5s;\"\/>\r\n        <\/svg>\r\n        <div style=\"position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);\r\n                    font-size:1.4rem; font-weight:900; color:#000;\">90%<\/div>\r\n      <\/div>\r\n\r\n      <h3 style=\"color:#000; font-weight:900; font-size:1.2rem; margin-bottom:10px;\">\r\n        D\u00e9veloppement d'applications web (Front-end & Back-end)\r\n      <\/h3>\r\n      <p style=\"color:#777; font-size:1.05rem; margin-bottom:20px;\">\r\n        HTML \u00b7 CSS \u00b7 JavaScript \u00b7 Java \u00b7 PHP \u00b7 C \u00b7 WordPress\r\n      <\/p>\r\n\r\n      <!-- Outils -->\r\n      <div style=\"display:flex; gap:10px; justify-content:center; flex-wrap:wrap;\">\r\n        <div style=\"background:#f0f0f0; color:#555; padding:8px 15px; border-radius:6px; font-weight:700;\">\r\n          Visual Studio Code\r\n        <\/div>\r\n        <div style=\"background:#f0f0f0; color:#555; padding:8px 15px; border-radius:6px; font-weight:700;\">\r\n          XAMPP\r\n        <\/div>\r\n        <div style=\"background:#f0f0f0; color:#555; padding:8px 15px; border-radius:6px; font-weight:700;\">\r\n          Eclipse\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- SECTION 2 - Gestion de projets -->\r\n    <div style=\"flex:1; min-width:280px; max-width:400px; background:#fff; border:1.5px solid #ddd; border-radius:15px; padding:30px; box-shadow:0 2px 8px rgba(0,0,0,0.05);\">\r\n      <i class=\"fas fa-project-diagram\" style=\"font-size:2.3rem; color:#FFD700; margin-bottom:10px;\"><\/i>\r\n      <h2 style=\"color:#000; font-weight:900; font-size:1.7rem;\">Gestion de projets et outils collaboratifs<\/h2>\r\n\r\n      <!-- Cercle -->\r\n      <div style=\"position:relative; width:120px; height:120px; margin:25px auto;\">\r\n        <svg width=\"120\" height=\"120\">\r\n          <circle cx=\"60\" cy=\"60\" r=\"52\" stroke=\"#eee\" stroke-width=\"10\" fill=\"none\"\/>\r\n          <circle cx=\"60\" cy=\"60\" r=\"52\" stroke=\"#FFD700\" stroke-width=\"10\" fill=\"none\"\r\n                  stroke-dasharray=\"326\" stroke-dashoffset=\"65\"\r\n                  style=\"transform:rotate(-90deg); transform-origin:50% 50%; transition:0.5s;\"\/>\r\n        <\/svg>\r\n        <div style=\"position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);\r\n                    font-size:1.4rem; font-weight:900; color:#000;\">80%<\/div>\r\n      <\/div>\r\n\r\n      <h3 style=\"color:#000; font-weight:900; font-size:1.2rem; margin-bottom:10px;\">\r\n        Coordination et suivi de projets informatiques\r\n      <\/h3>\r\n      <p style=\"color:#777; font-size:1.05rem; margin-bottom:20px;\">\r\n        Trello \u00b7 GitHub \u00b7 Gantt Project \u00b7 Discord\r\n      <\/p>\r\n\r\n      <div style=\"display:flex; gap:10px; justify-content:center; flex-wrap:wrap;\">\r\n        <div style=\"background:#f0f0f0; color:#555; padding:8px 15px; border-radius:6px; font-weight:700;\">\r\n          Gantt Project\r\n        <\/div>\r\n        <div style=\"background:#f0f0f0; color:#555; padding:8px 15px; border-radius:6px; font-weight:700;\">\r\n          Discord\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- SECTION 3 - Bases de donn\u00e9es -->\r\n    <div style=\"flex:1; min-width:280px; max-width:400px; background:#fff; border:1.5px solid #ddd; border-radius:15px; padding:30px; box-shadow:0 2px 8px rgba(0,0,0,0.05);\">\r\n      <i class=\"fas fa-database\" style=\"font-size:2.3rem; color:#FFD700; margin-bottom:10px;\"><\/i>\r\n      <h2 style=\"color:#000; font-weight:900; font-size:1.7rem;\">Bases de donn\u00e9es<\/h2>\r\n\r\n      <!-- Cercle -->\r\n      <div style=\"position:relative; width:120px; height:120px; margin:25px auto;\">\r\n        <svg width=\"120\" height=\"120\">\r\n          <circle cx=\"60\" cy=\"60\" r=\"52\" stroke=\"#eee\" stroke-width=\"10\" fill=\"none\"\/>\r\n          <circle cx=\"60\" cy=\"60\" r=\"52\" stroke=\"#FFD700\" stroke-width=\"10\" fill=\"none\"\r\n                  stroke-dasharray=\"326\" stroke-dashoffset=\"16\"\r\n                  style=\"transform:rotate(-90deg); transform-origin:50% 50%; transition:0.5s;\"\/>\r\n        <\/svg>\r\n        <div style=\"position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);\r\n                    font-size:1.4rem; font-weight:900; color:#000;\">95%<\/div>\r\n      <\/div>\r\n\r\n      <h3 style=\"color:#000; font-weight:900; font-size:1.2rem; margin-bottom:10px;\">\r\n        Conception et gestion de bases de donn\u00e9es\r\n      <\/h3>\r\n      <p style=\"color:#777; font-size:1.05rem; margin-bottom:20px;\">\r\n        SQL \u00b7 UML\r\n      <\/p>\r\n\r\n      <div style=\"display:flex; gap:10px; justify-content:center; flex-wrap:wrap;\">\r\n        <div style=\"background:#f0f0f0; color:#555; padding:8px 15px; border-radius:6px; font-weight:700;\">\r\n          MySQL\r\n        <\/div>\r\n        <div style=\"background:#f0f0f0; color:#555; padding:8px 15px; border-radius:6px; font-weight:700;\">\r\n          Mod\u00e9lisation UML\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- Font Awesome -->\r\n<script src=\"https:\/\/kit.fontawesome.com\/a076d05399.js\" crossorigin=\"anonymous\"><\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-85c028c e-flex e-con-boxed e-con e-parent\" data-id=\"85c028c\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5c5d74e elementor-widget elementor-widget-html\" data-id=\"5c5d74e\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section style=\"text-align: center; padding: 80px 5%; font-family: 'Poppins', sans-serif; background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%); color: #000; border-radius: 25px; max-width: 1200px; margin: 80px auto; box-shadow: 0 10px 30px rgba(0,0,0,0.1); position: relative; overflow: hidden;\">\r\n\r\n  <!-- \u00c9l\u00e9ment d\u00e9coratif -->\r\n  <div style=\"position: absolute; top: -50px; right: -50px; width: 200px; height: 200px; background: #FFD700; border-radius: 50%; opacity: 0.1;\"><\/div>\r\n  <div style=\"position: absolute; bottom: -80px; left: -80px; width: 250px; height: 250px; background: #FFD700; border-radius: 50%; opacity: 0.05;\"><\/div>\r\n\r\n  <!-- Titres -->\r\n  <div style=\"position: relative; z-index: 2;\">\r\n    <h1 style=\"color: #000; font-size: 3.5rem; font-weight: 800; margin-bottom: 20px; line-height: 1.2;\">Certifications<\/h1>\r\n    <h2 style=\"color: #FFD700; font-weight: 700; font-size: 1.6rem; margin-bottom: 60px; letter-spacing: 2px;\">Mes accr\u00e9ditations<\/h2>\r\n  <\/div>\r\n\r\n  <!-- Grille des certifications -->\r\n  <div style=\"display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 30px; position: relative; z-index: 2;\">\r\n\r\n    <!-- Certification WordPress -->\r\n    <div class=\"certification-card\" style=\"background: #fff; padding: 40px 30px; border-radius: 20px; box-shadow: 0 8px 25px rgba(0,0,0,0.08); transition: all 0.3s ease; border: 2px solid transparent; position: relative; overflow: hidden;\">\r\n      <div style=\"width: 80px; height: 80px; background: linear-gradient(135deg, #21759b, #1a6485); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 25px; box-shadow: 0 8px 20px rgba(33, 117, 155, 0.3);\">\r\n        <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/wordpress_logo.png\" \r\n             alt=\"WordPress\" \r\n             style=\"width: 45px; height: 45px;\">\r\n      <\/div>\r\n      <h3 style=\"color: #000; font-size: 1.5rem; font-weight: 700; margin-bottom: 15px;\">WordPress<\/h3>\r\n      <p style=\"color: #666; font-size: 1rem; margin-bottom: 25px; line-height: 1.6;\">Certification en d\u00e9veloppement et gestion de sites WordPress<\/p>\r\n      <a href=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/Certification-wordpress.pdf\" \r\n         target=\"_blank\"\r\n         style=\"background: linear-gradient(135deg, #21759b, #1a6485); color: white; border: none; padding: 12px 30px; border-radius: 50px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(33, 117, 155, 0.3); text-decoration: none; display: inline-block;\">\r\n        Voir la certification\r\n      <\/a>\r\n    <\/div>\r\n\r\n    <!-- Certification Python -->\r\n    <div class=\"certification-card\" style=\"background: #fff; padding: 40px 30px; border-radius: 20px; box-shadow: 0 8px 25px rgba(0,0,0,0.08); transition: all 0.3s ease; border: 2px solid transparent; position: relative; overflow: hidden;\">\r\n      <div style=\"width: 80px; height: 80px; background: linear-gradient(135deg, #3776ab, #2d5f87); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 25px; box-shadow: 0 8px 20px rgba(55, 118, 171, 0.3);\">\r\n        <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/python.png\" \r\n             alt=\"Python\" \r\n             style=\"width: 45px; height: 45px;\">\r\n      <\/div>\r\n      <h3 style=\"color: #000; font-size: 1.5rem; font-weight: 700; margin-bottom: 15px;\">Python<\/h3>\r\n      <p style=\"color: #666; font-size: 1rem; margin-bottom: 25px; line-height: 1.6;\">Certification en programmation Python et d\u00e9veloppement d'applications<\/p>\r\n      <a href=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/Certification-python.pdf\" \r\n         target=\"_blank\"\r\n         style=\"background: linear-gradient(135deg, #3776ab, #2d5f87); color: white; border: none; padding: 12px 30px; border-radius: 50px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(55, 118, 171, 0.3); text-decoration: none; display: inline-block;\">\r\n        Voir la certification\r\n      <\/a>\r\n    <\/div>\r\n\r\n    <!-- Certification C -->\r\n    <div class=\"certification-card\" style=\"background: #fff; padding: 40px 30px; border-radius: 20px; box-shadow: 0 8px 25px rgba(0,0,0,0.08); transition: all 0.3s ease; border: 2px solid transparent; position: relative; overflow: hidden;\">\r\n      <div style=\"width: 80px; height: 80px; background: linear-gradient(135deg, #00599c, #004d84); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 25px; box-shadow: 0 8px 20px rgba(0, 89, 156, 0.3);\">\r\n        <img decoding=\"async\" src=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/Langage_C_logo.png\" \r\n             alt=\"Langage C\" \r\n             style=\"width: 45px; height: 45px;\">\r\n      <\/div>\r\n      <h3 style=\"color: #000; font-size: 1.5rem; font-weight: 700; margin-bottom: 15px;\">Langage C<\/h3>\r\n      <p style=\"color: #666; font-size: 1rem; margin-bottom: 25px; line-height: 1.6;\">Certification en programmation syst\u00e8me et algorithmique en C<\/p>\r\n      <a href=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/12\/Certification-langage-c.pdf\" \r\n         target=\"_blank\"\r\n         style=\"background: linear-gradient(135deg, #00599c, #004d84); color: white; border: none; padding: 12px 30px; border-radius: 50px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(0, 89, 156, 0.3); text-decoration: none; display: inline-block;\">\r\n        Voir la certification\r\n      <\/a>\r\n    <\/div>\r\n\r\n    <!-- Certification R\u00c9SEAU TCP\/IP (NOUVELLE - 4\u00e8me carte) -->\r\n    <div class=\"certification-card\" style=\"background: #fff; padding: 40px 30px; border-radius: 20px; box-shadow: 0 8px 25px rgba(0,0,0,0.08); transition: all 0.3s ease; border: 2px solid transparent; position: relative; overflow: hidden;\">\r\n      <div style=\"width: 80px; height: 80px; background: linear-gradient(135deg, #E65100, #BF360C); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 25px; box-shadow: 0 8px 20px rgba(230, 81, 0, 0.3);\">\r\n        <i class=\"fas fa-network-wired\" style=\"font-size: 42px; color: white;\"><\/i>\r\n      <\/div>\r\n      <h3 style=\"color: #000; font-size: 1.5rem; font-weight: 700; margin-bottom: 15px;\">R\u00e9seau TCP\/IP<\/h3>\r\n      <p style=\"color: #666; font-size: 1rem; margin-bottom: 25px; line-height: 1.6;\">Conception, configuration et optimisation d'un r\u00e9seau TCP\/IP (plan d'adressage, DHCP, DNS, routage)<\/p>\r\n      <a href=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2026\/05\/certificat-ReseauTCP-IP.pdf\" \r\n         target=\"_blank\"\r\n         style=\"background: linear-gradient(135deg, #E65100, #BF360C); color: white; border: none; padding: 12px 30px; border-radius: 50px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(230, 81, 0, 0.3); text-decoration: none; display: inline-block;\">\r\n        Voir la certification\r\n      <\/a>\r\n    <\/div>\r\n\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<!-- Font Awesome pour l'ic\u00f4ne r\u00e9seau -->\r\n<script src=\"https:\/\/kit.fontawesome.com\/a076d05399.js\" crossorigin=\"anonymous\"><\/script>\r\n\r\n<!-- Styles et animations -->\r\n<style>\r\n  \/* Effets de hover sur les cartes *\/\r\n  .certification-card:hover {\r\n    transform: translateY(-10px);\r\n    border-color: #FFD700 !important;\r\n    box-shadow: 0 15px 35px rgba(0,0,0,0.15) !important;\r\n  }\r\n\r\n  \/* Effets sur les boutons *\/\r\n  a:hover {\r\n    transform: translateY(-2px);\r\n    box-shadow: 0 6px 20px rgba(0,0,0,0.2) !important;\r\n    text-decoration: none !important;\r\n    color: white !important;\r\n  }\r\n\r\n  \/* Responsive *\/\r\n  @media (max-width: 768px) {\r\n    section {\r\n      padding: 50px 5%;\r\n      margin: 40px auto;\r\n    }\r\n    \r\n    h1 {\r\n      font-size: 2.8rem !important;\r\n    }\r\n    \r\n    .certification-card {\r\n      padding: 30px 20px !important;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<script>\r\n  \/\/ Ajouter les effets de hover dynamiquement\r\n  document.addEventListener('DOMContentLoaded', function() {\r\n    const cards = document.querySelectorAll('.certification-card');\r\n    cards.forEach(card => {\r\n      card.addEventListener('mouseenter', function() {\r\n        this.style.transform = 'translateY(-10px)';\r\n        this.style.borderColor = '#FFD700';\r\n        this.style.boxShadow = '0 15px 35px rgba(0,0,0,0.15)';\r\n      });\r\n      \r\n      card.addEventListener('mouseleave', function() {\r\n        this.style.transform = 'translateY(0)';\r\n        this.style.borderColor = 'transparent';\r\n        this.style.boxShadow = '0 8px 25px rgba(0,0,0,0.08)';\r\n      });\r\n    });\r\n  });\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2f2321a e-flex e-con-boxed e-con e-parent\" data-id=\"2f2321a\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9b27d75 elementor-widget elementor-widget-html\" data-id=\"9b27d75\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section style=\"text-align: center; padding: 80px 5%; font-family: 'Poppins', sans-serif; background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%); color: #000; border-radius: 25px; max-width: 1400px; margin: 80px auto; box-shadow: 0 10px 30px rgba(0,0,0,0.1); position: relative; overflow: hidden;\">\r\n\r\n  <!-- \u00c9l\u00e9ments d\u00e9coratifs -->\r\n  <div style=\"position: absolute; top: -50px; right: -50px; width: 200px; height: 200px; background: #FFD700; border-radius: 50%; opacity: 0.1;\"><\/div>\r\n  <div style=\"position: absolute; bottom: -80px; left: -80px; width: 250px; height: 250px; background: #FFD700; border-radius: 50%; opacity: 0.05;\"><\/div>\r\n\r\n  <!-- Titres -->\r\n  <div style=\"position: relative; z-index: 2;\">\r\n    <h1 style=\"color: #000; font-size: 3.5rem; font-weight: 800; margin-bottom: 20px; line-height: 1.2;\">Mes Projets<\/h1>\r\n    <h2 style=\"color: #FFD700; font-weight: 700; font-size: 1.6rem; margin-bottom: 60px; letter-spacing: 2px;\">R\u00e9alisations professionnelles et acad\u00e9miques<\/h2>\r\n  <\/div>\r\n\r\n  <!-- Grille des projets -->\r\n  <div style=\"display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 30px; position: relative; z-index: 2;\">\r\n\r\n    <!-- Projet GLPI -->\r\n    <a href=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2025\/11\/INSTALLATION-DE-GLPI.pdf\" target=\"_blank\" class=\"project-card\" style=\"text-decoration: none; background: #fff; padding: 35px 25px; border-radius: 20px; box-shadow: 0 8px 25px rgba(0,0,0,0.08); transition: all 0.3s ease; border: 2px solid transparent; cursor: pointer; position: relative; overflow: hidden; display: block;\">\r\n      <div style=\"width: 80px; height: 80px; background: linear-gradient(135deg, #2c3e6d, #1a2a4a); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 25px; box-shadow: 0 8px 20px rgba(44, 62, 109, 0.3);\">\r\n        <i class=\"fas fa-tasks\" style=\"font-size: 40px; color: white;\"><\/i>\r\n      <\/div>\r\n      <h3 style=\"color: #000; font-size: 1.5rem; font-weight: 700; margin-bottom: 15px;\">GLPI<\/h3>\r\n      <p style=\"color: #666; font-size: 0.95rem; margin-bottom: 20px; line-height: 1.6;\">D\u00e9ploiement et configuration de la solution ITSM pour la gestion des services informatiques<\/p>\r\n      <div style=\"display: inline-block; background: #FFD70020; padding: 6px 15px; border-radius: 20px;\">\r\n        <span style=\"color: #FFD700; font-size: 0.85rem; font-weight: 600;\">\ud83d\udcc4 Ouvrir la documentation PDF<\/span>\r\n      <\/div>\r\n    <\/a>\r\n\r\n    <!-- Site E-enseignement WordPress -->\r\n    <a href=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2026\/05\/E-ENSEIGNEMENT.pdf\" target=\"_blank\" class=\"project-card\" style=\"text-decoration: none; background: #fff; padding: 35px 25px; border-radius: 20px; box-shadow: 0 8px 25px rgba(0,0,0,0.08); transition: all 0.3s ease; border: 2px solid transparent; cursor: pointer; position: relative; overflow: hidden; display: block;\">\r\n      <div style=\"width: 80px; height: 80px; background: linear-gradient(135deg, #21759b, #1a6485); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 25px; box-shadow: 0 8px 20px rgba(33, 117, 155, 0.3);\">\r\n        <i class=\"fas fa-chalkboard-teacher\" style=\"font-size: 40px; color: white;\"><\/i>\r\n      <\/div>\r\n      <h3 style=\"color: #000; font-size: 1.5rem; font-weight: 700; margin-bottom: 15px;\">Site E-enseignement<\/h3>\r\n      <p style=\"color: #666; font-size: 0.95rem; margin-bottom: 20px; line-height: 1.6;\">Cr\u00e9ation d'une plateforme de formation en ligne avec CMS WordPress<\/p>\r\n      <div style=\"display: inline-block; background: #FFD70020; padding: 6px 15px; border-radius: 20px;\">\r\n        <span style=\"color: #FFD700; font-size: 0.85rem; font-weight: 600;\">\ud83d\udcc4 Ouvrir la documentation PDF<\/span>\r\n      <\/div>\r\n    <\/a>\r\n\r\n    <!-- Refonte Snake en C -->\r\n    <a href=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2026\/05\/Snake.pdf\" target=\"_blank\" class=\"project-card\" style=\"text-decoration: none; background: #fff; padding: 35px 25px; border-radius: 20px; box-shadow: 0 8px 25px rgba(0,0,0,0.08); transition: all 0.3s ease; border: 2px solid transparent; cursor: pointer; position: relative; overflow: hidden; display: block;\">\r\n      <div style=\"width: 80px; height: 80px; background: linear-gradient(135deg, #00599c, #004d84); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 25px; box-shadow: 0 8px 20px rgba(0, 89, 156, 0.3);\">\r\n        <i class=\"fas fa-gamepad\" style=\"font-size: 40px; color: white;\"><\/i>\r\n      <\/div>\r\n      <h3 style=\"color: #000; font-size: 1.5rem; font-weight: 700; margin-bottom: 15px;\">Refonte du Snake en C<\/h3>\r\n      <p style=\"color: #666; font-size: 0.95rem; margin-bottom: 20px; line-height: 1.6;\">Jeu Snake revisit\u00e9 avec interface graphique et fonctionnalit\u00e9s avanc\u00e9es<\/p>\r\n      <div style=\"display: inline-block; background: #FFD70020; padding: 6px 15px; border-radius: 20px;\">\r\n        <span style=\"color: #FFD700; font-size: 0.85rem; font-weight: 600;\">\ud83d\udcc4 Ouvrir la documentation PDF<\/span>\r\n      <\/div>\r\n    <\/a>\r\n\r\n    <!-- Client lourd Java -->\r\n    <a href=\"docs\/java.pdf\" target=\"_blank\" class=\"project-card\" style=\"text-decoration: none; background: #fff; padding: 35px 25px; border-radius: 20px; box-shadow: 0 8px 25px rgba(0,0,0,0.08); transition: all 0.3s ease; border: 2px solid transparent; cursor: pointer; position: relative; overflow: hidden; display: block;\">\r\n      <div style=\"width: 80px; height: 80px; background: linear-gradient(135deg, #f89820, #e76f00); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 25px; box-shadow: 0 8px 20px rgba(248, 152, 32, 0.3);\">\r\n        <i class=\"fab fa-java\" style=\"font-size: 45px; color: white;\"><\/i>\r\n      <\/div>\r\n      <h3 style=\"color: #000; font-size: 1.5rem; font-weight: 700; margin-bottom: 15px;\">Application Web Java<\/h3>\r\n      <p style=\"color: #666; font-size: 0.95rem; margin-bottom: 20px; line-height: 1.6;\">Client lourd : Cr\u00e9ation d'application web en Java (JEE, Servlets, JSP)<\/p>\r\n      <div style=\"display: inline-block; background: #FFD70020; padding: 6px 15px; border-radius: 20px;\">\r\n        <span style=\"color: #FFD700; font-size: 0.85rem; font-weight: 600;\">\ud83d\udcc4 Ouvrir la documentation PDF<\/span>\r\n      <\/div>\r\n    <\/a>\r\n\r\n    <!-- Client l\u00e9ger PHP -->\r\n    <a href=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2026\/05\/Documentation-PPE-Java.pdf\" target=\"_blank\" class=\"project-card\" style=\"text-decoration: none; background: #fff; padding: 35px 25px; border-radius: 20px; box-shadow: 0 8px 25px rgba(0,0,0,0.08); transition: all 0.3s ease; border: 2px solid transparent; cursor: pointer; position: relative; overflow: hidden; display: block;\">\r\n      <div style=\"width: 80px; height: 80px; background: linear-gradient(135deg, #777bb4, #5c5f8c); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 25px; box-shadow: 0 8px 20px rgba(119, 123, 180, 0.3);\">\r\n        <i class=\"fab fa-php\" style=\"font-size: 50px; color: white;\"><\/i>\r\n      <\/div>\r\n      <h3 style=\"color: #000; font-size: 1.5rem; font-weight: 700; margin-bottom: 15px;\">Application Web PHP<\/h3>\r\n      <p style=\"color: #666; font-size: 0.95rem; margin-bottom: 20px; line-height: 1.6;\">Client l\u00e9ger : Cr\u00e9ation d'application web en PHP \/ Symfony<\/p>\r\n      <div style=\"display: inline-block; background: #FFD70020; padding: 6px 15px; border-radius: 20px;\">\r\n        <span style=\"color: #FFD700; font-size: 0.85rem; font-weight: 600;\">\ud83d\udcc4 Ouvrir la documentation PDF<\/span>\r\n      <\/div>\r\n    <\/a>\r\n\r\n    <!-- Stage 1\u00e8re ann\u00e9e - Appariteur -->\r\n    <a href=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2026\/05\/Appariteur.net-Presentation-de-sao-1.pdf\" target=\"_blank\" class=\"project-card\" style=\"text-decoration: none; background: #fff; padding: 35px 25px; border-radius: 20px; box-shadow: 0 8px 25px rgba(0,0,0,0.08); transition: all 0.3s ease; border: 2px solid transparent; cursor: pointer; position: relative; overflow: hidden; display: block;\">\r\n      <div style=\"width: 80px; height: 80px; background: linear-gradient(135deg, #e84393, #c2185b); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 25px; box-shadow: 0 8px 20px rgba(232, 67, 147, 0.3);\">\r\n        <i class=\"fas fa-briefcase\" style=\"font-size: 40px; color: white;\"><\/i>\r\n      <\/div>\r\n      <h3 style=\"color: #000; font-size: 1.5rem; font-weight: 700; margin-bottom: 15px;\">Stage 1\u02b3\u1d49 ann\u00e9e - Appariteur<\/h3>\r\n      <p style=\"color: #666; font-size: 0.95rem; margin-bottom: 20px; line-height: 1.6;\">Cr\u00e9ation de site WordPress pour l'entreprise Appariteur<\/p>\r\n      <div style=\"display: inline-block; background: #FFD70020; padding: 6px 15px; border-radius: 20px;\">\r\n        <span style=\"color: #FFD700; font-size: 0.85rem; font-weight: 600;\">\ud83d\udcc4 Ouvrir la documentation PDF<\/span>\r\n      <\/div>\r\n    <\/a>\r\n\r\n    <!-- Stage 2\u00e8me ann\u00e9e - Association \u00e9v\u00e9nementielle -->\r\n    <a href=\"https:\/\/liamidisaobaneportfolio.ovh\/wp-content\/uploads\/2026\/05\/Doc-subvision.pdf\" target=\"_blank\" class=\"project-card\" style=\"text-decoration: none; background: #fff; padding: 35px 25px; border-radius: 20px; box-shadow: 0 8px 25px rgba(0,0,0,0.08); transition: all 0.3s ease; border: 2px solid transparent; cursor: pointer; position: relative; overflow: hidden; display: block;\">\r\n      <div style=\"width: 80px; height: 80px; background: linear-gradient(135deg, #6c5ce7, #4834d4); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 25px; box-shadow: 0 8px 20px rgba(108, 92, 231, 0.3);\">\r\n        <i class=\"fas fa-calendar-alt\" style=\"font-size: 40px; color: white;\"><\/i>\r\n      <\/div>\r\n      <h3 style=\"color: #000; font-size: 1.5rem; font-weight: 700; margin-bottom: 15px;\">Stage 2\u1d49 ann\u00e9e - La subvision<\/h3>\r\n      <p style=\"color: #666; font-size: 0.95rem; margin-bottom: 20px; line-height: 1.6;\">Cr\u00e9ation de site WordPress pour une association d'\u00e9v\u00e9nementiel<\/p>\r\n      <div style=\"display: inline-block; background: #FFD70020; padding: 6px 15px; border-radius: 20px;\">\r\n        <span style=\"color: #FFD700; font-size: 0.85rem; font-weight: 600;\">\ud83d\udcc4 Ouvrir la documentation PDF<\/span>\r\n      <\/div>\r\n    <\/a>\r\n\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<!-- Font Awesome -->\r\n<script src=\"https:\/\/kit.fontawesome.com\/a076d05399.js\" crossorigin=\"anonymous\"><\/script>\r\n\r\n<style>\r\n  .project-card:hover {\r\n    transform: translateY(-10px);\r\n    border-color: #FFD700 !important;\r\n    box-shadow: 0 15px 35px rgba(0,0,0,0.15) !important;\r\n  }\r\n\r\n  .project-card:active {\r\n    transform: translateY(-5px);\r\n  }\r\n\r\n  @media (max-width: 768px) {\r\n    section {\r\n      padding: 50px 5%;\r\n      margin: 40px auto;\r\n    }\r\n    \r\n    h1 {\r\n      font-size: 2.5rem !important;\r\n    }\r\n    \r\n    h2 {\r\n      font-size: 1.2rem !important;\r\n    }\r\n    \r\n    .project-card {\r\n      padding: 25px 20px !important;\r\n    }\r\n  }\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-e9a4b95 e-flex e-con-boxed e-con e-parent\" data-id=\"e9a4b95\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3a4f72f elementor-widget elementor-widget-html\" data-id=\"3a4f72f\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section style=\"background-color: #ffd700; padding: 80px 10%; font-family: 'Roboto', sans-serif; text-align: center; border-radius: 20px; border: 2px solid rgba(0,0,0,0.1);\"><!-- Titre avec ic\u00f4ne -->\r\n<div style=\"margin-bottom: 50px;\"><i class=\"fas fa-user-check\" style=\"font-size: 3rem; color: #fff; margin-bottom: 10px;\"><\/i>\r\n<h2 style=\"color: #fff; font-size: 3rem; font-weight: 1000; margin-top: 10px;\">Qualit\u00e9s personnelles<\/h2>\r\n<\/div>\r\n<!-- Sections des qualit\u00e9s -->\r\n<div style=\"display: flex; flex-wrap: wrap; justify-content: center; gap: 20px;\">\r\n<div style=\"background: #e0e0e0; color: #555; padding: 15px 25px; border-radius: 10px; font-weight: 900; min-width: 120px;\">Rigoureux<\/div>\r\n<div style=\"background: #e0e0e0; color: #555; padding: 15px 25px; border-radius: 10px; font-weight: 900; min-width: 120px;\">Cr\u00e9atif<\/div>\r\n<div style=\"background: #e0e0e0; color: #555; padding: 15px 25px; border-radius: 10px; font-weight: 900; min-width: 120px;\">Organis\u00e9<\/div>\r\n<div style=\"background: #e0e0e0; color: #555; padding: 15px 25px; border-radius: 10px; font-weight: 900; min-width: 120px;\">Pers\u00e9v\u00e9rant<\/div>\r\n<div style=\"background: #e0e0e0; color: #555; padding: 15px 25px; border-radius: 10px; font-weight: 900; min-width: 120px;\">Curieux<\/div>\r\n<div style=\"background: #e0e0e0; color: #555; padding: 15px 25px; border-radius: 10px; font-weight: 900; min-width: 120px;\">Autonome<\/div>\r\n<\/div>\r\n<\/section><!-- Font Awesome pour ic\u00f4ne -->\r\n<script src=\"https:\/\/kit.fontawesome.com\/a076d05399.js\" crossorigin=\"anonymous\"><\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Mon parcours D\u00e9couvrez mon parcours, mes comp\u00e9tences et ma passion pour l&rsquo;informatique. A PROPOS LIAMIDI Saobane Je suis actuellement en fin de deuxi\u00e8me ann\u00e9e de BTS SIO, sp\u00e9cialit\u00e9 SLAM, o\u00f9 j&rsquo;ai acquis des comp\u00e9tences solides en d\u00e9veloppement d&rsquo;applications et en conception de bases de donn\u00e9es. Cependant, ma v\u00e9ritable passion s&rsquo;est r\u00e9cemment tourn\u00e9e vers un domaine [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"ocean_post_layout":"full-screen","ocean_both_sidebars_style":"","ocean_both_sidebars_content_width":0,"ocean_both_sidebars_sidebars_width":0,"ocean_sidebar":"","ocean_second_sidebar":"","ocean_disable_margins":"enable","ocean_add_body_class":"","ocean_shortcode_before_top_bar":"","ocean_shortcode_after_top_bar":"","ocean_shortcode_before_header":"","ocean_shortcode_after_header":"","ocean_has_shortcode":"","ocean_shortcode_after_title":"","ocean_shortcode_before_footer_widgets":"","ocean_shortcode_after_footer_widgets":"","ocean_shortcode_before_footer_bottom":"","ocean_shortcode_after_footer_bottom":"","ocean_display_top_bar":"off","ocean_display_header":"on","ocean_header_style":"minimal","ocean_center_header_left_menu":"","ocean_custom_header_template":"","ocean_custom_logo":0,"ocean_custom_retina_logo":0,"ocean_custom_logo_max_width":0,"ocean_custom_logo_tablet_max_width":0,"ocean_custom_logo_mobile_max_width":0,"ocean_custom_logo_max_height":0,"ocean_custom_logo_tablet_max_height":0,"ocean_custom_logo_mobile_max_height":0,"ocean_header_custom_menu":"","ocean_menu_typo_font_family":"","ocean_menu_typo_font_subset":"","ocean_menu_typo_font_size":0,"ocean_menu_typo_font_size_tablet":0,"ocean_menu_typo_font_size_mobile":0,"ocean_menu_typo_font_size_unit":"px","ocean_menu_typo_font_weight":"","ocean_menu_typo_font_weight_tablet":"","ocean_menu_typo_font_weight_mobile":"","ocean_menu_typo_transform":"","ocean_menu_typo_transform_tablet":"","ocean_menu_typo_transform_mobile":"","ocean_menu_typo_line_height":0,"ocean_menu_typo_line_height_tablet":0,"ocean_menu_typo_line_height_mobile":0,"ocean_menu_typo_line_height_unit":"","ocean_menu_typo_spacing":0,"ocean_menu_typo_spacing_tablet":0,"ocean_menu_typo_spacing_mobile":0,"ocean_menu_typo_spacing_unit":"","ocean_menu_link_color":"","ocean_menu_link_color_hover":"","ocean_menu_link_color_active":"","ocean_menu_link_background":"","ocean_menu_link_hover_background":"","ocean_menu_link_active_background":"","ocean_menu_social_links_bg":"","ocean_menu_social_hover_links_bg":"","ocean_menu_social_links_color":"","ocean_menu_social_hover_links_color":"","ocean_disable_title":"on","ocean_disable_heading":"default","ocean_post_title":"","ocean_post_subheading":"","ocean_post_title_style":"","ocean_post_title_background_color":"","ocean_post_title_background":0,"ocean_post_title_bg_image_position":"","ocean_post_title_bg_image_attachment":"","ocean_post_title_bg_image_repeat":"","ocean_post_title_bg_image_size":"","ocean_post_title_height":0,"ocean_post_title_bg_overlay":0.5,"ocean_post_title_bg_overlay_color":"","ocean_disable_breadcrumbs":"default","ocean_breadcrumbs_color":"","ocean_breadcrumbs_separator_color":"","ocean_breadcrumbs_links_color":"","ocean_breadcrumbs_links_hover_color":"","ocean_display_footer_widgets":"off","ocean_display_footer_bottom":"off","ocean_custom_footer_template":"","footnotes":""},"class_list":["post-12","page","type-page","status-publish","hentry","entry"],"_links":{"self":[{"href":"https:\/\/liamidisaobaneportfolio.ovh\/index.php\/wp-json\/wp\/v2\/pages\/12","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/liamidisaobaneportfolio.ovh\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/liamidisaobaneportfolio.ovh\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/liamidisaobaneportfolio.ovh\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/liamidisaobaneportfolio.ovh\/index.php\/wp-json\/wp\/v2\/comments?post=12"}],"version-history":[{"count":89,"href":"https:\/\/liamidisaobaneportfolio.ovh\/index.php\/wp-json\/wp\/v2\/pages\/12\/revisions"}],"predecessor-version":[{"id":349,"href":"https:\/\/liamidisaobaneportfolio.ovh\/index.php\/wp-json\/wp\/v2\/pages\/12\/revisions\/349"}],"wp:attachment":[{"href":"https:\/\/liamidisaobaneportfolio.ovh\/index.php\/wp-json\/wp\/v2\/media?parent=12"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}