{"id":3551,"date":"2026-08-22T16:17:37","date_gmt":"2026-08-22T16:17:37","guid":{"rendered":"https:\/\/maroczain.com\/?page_id=3551"},"modified":"2026-08-22T18:22:48","modified_gmt":"2026-08-22T18:22:48","slug":"connexion-securisee","status":"publish","type":"page","link":"https:\/\/maroczain.com\/en\/connexion-securisee\/","title":{"rendered":"Connexion securis\u00e9e"},"content":{"rendered":"<!DOCTYPE html>\n<html lang=\"fr\">\n<head>\n  <meta charset=\"UTF-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n  <meta name=\"robots\" content=\"noindex,nofollow\">\n  <title>Connexion s\u00e9curis\u00e9e | Maroc Zain Academy<\/title>\n\n  <style>\n    *{\n      box-sizing:border-box;\n      margin:0;\n      padding:0;\n    }\n\n    body{\n      font-family:Arial, Helvetica, sans-serif;\n      min-height:100vh;\n      display:flex;\n      align-items:center;\n      justify-content:center;\n      background:\n        linear-gradient(rgba(1,31,55,.86),rgba(3,54,82,.90)),\n        url('https:\/\/images.unsplash.com\/photo-1436491865332-7a61a109cc05?auto=format&fit=crop&w=1600&q=80')\n        center\/cover no-repeat;\n      padding:25px;\n    }\n\n    .login-wrapper{\n      width:100%;\n      max-width:1050px;\n      display:grid;\n      grid-template-columns:1.1fr .9fr;\n      background:#fff;\n      border-radius:28px;\n      overflow:hidden;\n      box-shadow:0 25px 70px rgba(0,0,0,.28);\n    }\n\n    .brand-panel{\n      padding:65px 55px;\n      background:linear-gradient(135deg,#003b5c,#006f91);\n      color:#fff;\n      position:relative;\n    }\n\n    .badge{\n      display:inline-block;\n      background:#e9c84a;\n      color:#06263a;\n      padding:8px 16px;\n      border-radius:999px;\n      font-weight:700;\n      margin-bottom:28px;\n    }\n\n    .brand-panel h1{\n      font-size:46px;\n      line-height:1.05;\n      margin-bottom:20px;\n    }\n\n    .brand-panel p{\n      font-size:18px;\n      line-height:1.7;\n      opacity:.92;\n    }\n\n    .security-list{\n      margin-top:35px;\n      display:grid;\n      gap:15px;\n    }\n\n    .security-item{\n      display:flex;\n      align-items:center;\n      gap:12px;\n      font-size:15px;\n    }\n\n    .security-icon{\n      width:34px;\n      height:34px;\n      border-radius:50%;\n      display:grid;\n      place-items:center;\n      background:rgba(255,255,255,.13);\n    }\n\n    .login-panel{\n      padding:60px 50px;\n      background:#fff;\n    }\n\n    .login-panel h2{\n      color:#07354d;\n      font-size:32px;\n      margin-bottom:10px;\n    }\n\n    .subtitle{\n      color:#6b7a85;\n      margin-bottom:35px;\n      line-height:1.6;\n    }\n\n    .form-group{\n      margin-bottom:20px;\n    }\n\n    label{\n      display:block;\n      margin-bottom:8px;\n      color:#203746;\n      font-weight:700;\n      font-size:14px;\n    }\n\n    .input-wrap{\n      position:relative;\n    }\n\n    input{\n      width:100%;\n      padding:15px 45px 15px 15px;\n      border:1px solid #d7e0e5;\n      border-radius:12px;\n      outline:none;\n      font-size:16px;\n      transition:.25s ease;\n    }\n\n    input:focus{\n      border-color:#087fa4;\n      box-shadow:0 0 0 4px rgba(8,127,164,.10);\n    }\n\n    .toggle-password{\n      position:absolute;\n      right:12px;\n      top:50%;\n      transform:translateY(-50%);\n      border:0;\n      background:none;\n      cursor:pointer;\n      font-size:18px;\n    }\n\n    .options{\n      display:flex;\n      justify-content:space-between;\n      align-items:center;\n      gap:15px;\n      margin:10px 0 24px;\n      font-size:14px;\n    }\n\n    .remember{\n      display:flex;\n      align-items:center;\n      gap:8px;\n    }\n\n    .remember input{\n      width:auto;\n    }\n\n    a{\n      color:#087fa4;\n      text-decoration:none;\n      font-weight:700;\n    }\n\n    a:hover{\n      text-decoration:underline;\n    }\n\n    .login-btn{\n      width:100%;\n      padding:16px;\n      border:0;\n      border-radius:12px;\n      background:linear-gradient(135deg,#006f91,#003b5c);\n      color:white;\n      font-size:16px;\n      font-weight:800;\n      cursor:pointer;\n      transition:.25s ease;\n    }\n\n    .login-btn:hover{\n      transform:translateY(-1px);\n      box-shadow:0 10px 25px rgba(0,84,120,.25);\n    }\n\n    .security-note{\n      margin-top:25px;\n      padding:16px;\n      border-radius:12px;\n      background:#f5f9fb;\n      color:#526773;\n      font-size:13px;\n      line-height:1.6;\n      border-left:4px solid #e9c84a;\n    }\n\n    .footer-login{\n      margin-top:25px;\n      text-align:center;\n      color:#8a98a0;\n      font-size:12px;\n    }\n\n    @media(max-width:820px){\n      .login-wrapper{\n        grid-template-columns:1fr;\n      }\n\n      .brand-panel{\n        padding:40px 30px;\n      }\n\n      .brand-panel h1{\n        font-size:34px;\n      }\n\n      .login-panel{\n        padding:40px 30px;\n      }\n    }\n  <\/style>\n<\/head>\n\n<body>\n\n  <main class=\"login-wrapper\">\n\n    <section class=\"brand-panel\">\n\n      <div class=\"badge\">\ud83d\udd10 ESPACE S\u00c9CURIS\u00c9<\/div>\n\n      <h1>Maroc Zain Academy<\/h1>\n\n      <p>\n        Acc\u00e9dez \u00e0 votre espace personnel de formation,\n        vos cours, QCM, examens, attestations et suivi de progression.\n      <\/p>\n\n      <div class=\"security-list\">\n\n        <div class=\"security-item\">\n          <div class=\"security-icon\">\ud83d\udd12<\/div>\n          <span>Connexion HTTPS s\u00e9curis\u00e9e<\/span>\n        <\/div>\n\n        <div class=\"security-item\">\n          <div class=\"security-icon\">\ud83d\udee1\ufe0f<\/div>\n          <span>Protection contre les tentatives abusives<\/span>\n        <\/div>\n\n        <div class=\"security-item\">\n          <div class=\"security-icon\">\ud83d\udc64<\/div>\n          <span>Acc\u00e8s contr\u00f4l\u00e9 selon votre profil<\/span>\n        <\/div>\n\n        <div class=\"security-item\">\n          <div class=\"security-icon\">\ud83d\udccb<\/div>\n          <span>Journalisation des connexions<\/span>\n        <\/div>\n\n      <\/div>\n\n    <\/section>\n\n\n    <section class=\"login-panel\">\n\n      <h2>Connexion<\/h2>\n\n      <p class=\"subtitle\">\n        Identifiez-vous pour acc\u00e9der \u00e0 votre espace Maroc Zain Academy.\n      <\/p>\n\n      <!--\n        IMPORTANT :\n        cette action pointe vers la connexion WordPress.\n        Adaptez l'URL si WordPress est install\u00e9 dans un sous-dossier.\n      -->\n\n      <form\n        method=\"post\"\n        action=\"https:\/\/maroczain.com\/wp-login.php\"\n        autocomplete=\"on\"\n      >\n\n        <div class=\"form-group\">\n          <label for=\"user_login\">\n            Identifiant ou adresse e-mail\n          <\/label>\n\n          <input\n            type=\"text\"\n            id=\"user_login\"\n            name=\"log\"\n            autocomplete=\"username\"\n            required\n>\n        <\/div>\n\n        <div class=\"form-group\">\n\n          <label for=\"user_pass\">\n            Mot de passe\n          <\/label>\n\n          <div class=\"input-wrap\">\n\n            <input\n              type=\"password\"\n              id=\"user_pass\"\n              name=\"pwd\"\n              autocomplete=\"current-password\"\n              required\n>\n\n            <button\n              type=\"button\"\n              class=\"toggle-password\"\n              id=\"togglePassword\"\n              aria-label=\"Afficher ou masquer le mot de passe\"\n            >\n              \ud83d\udc41\ufe0f\n            <\/button>\n\n          <\/div>\n\n        <\/div>\n\n        <div class=\"options\">\n\n          <label class=\"remember\">\n            <input\n              type=\"checkbox\"\n              name=\"rememberme\"\n              value=\"forever\"\n            >\n            Se souvenir de moi\n          <\/label>\n\n          <a href=\"https:\/\/maroczain.com\/wp-login.php?action=lostpassword\">\n            Mot de passe oubli\u00e9 ?\n          <\/a>\n\n        <\/div>\n\n        <!-- Redirection apr\u00e8s connexion -->\n        <input\n          type=\"hidden\"\n          name=\"redirect_to\"\n          value=\"https:\/\/maroczain.com\/mon-compte\/\"\n        >\n\n        <button\n          type=\"submit\"\n          class=\"login-btn\"\n        >\n          \ud83d\udd10 Acc\u00e9der \u00e0 mon espace\n        <\/button>\n\n      <\/form>\n\n      <div class=\"security-note\">\n        \ud83d\udee1\ufe0f Pour votre s\u00e9curit\u00e9, ne communiquez jamais votre mot de passe.\n        Plusieurs tentatives incorrectes peuvent entra\u00eener un blocage\n        temporaire de la connexion.\n      <\/div>\n\n      <div class=\"footer-login\">\n        \u00a9 2026 Maroc Zain Academy \u2014 Acc\u00e8s s\u00e9curis\u00e9\n      <\/div>\n\n    <\/section>\n\n  <\/main>\n\n\n  <script>\n    const togglePassword =\n      document.getElementById(\"togglePassword\");\n\n    const password =\n      document.getElementById(\"user_pass\");\n\n    togglePassword.addEventListener(\"click\", function () {\n\n      if(password.type === \"password\"){\n        password.type = \"text\";\n        togglePassword.textContent = \"\ud83d\ude48\";\n      } else {\n        password.type = \"password\";\n        togglePassword.textContent = \"\ud83d\udc41\ufe0f\";\n      }\n\n    });\n  <\/script>\n\n<\/body>\n<\/html>","protected":false},"excerpt":{"rendered":"<p>Connexion s\u00e9curis\u00e9e | Maroc Zain Academy \ud83d\udd10 ESPACE S\u00c9CURIS\u00c9 Maroc Zain Academy Acc\u00e9dez \u00e0 votre espace personnel de formation, vos cours, QCM, examens, attestations et suivi de progression. \ud83d\udd12 Connexion HTTPS s\u00e9curis\u00e9e \ud83d\udee1\ufe0f Protection contre les tentatives abusives \ud83d\udc64 Acc\u00e8s contr\u00f4l\u00e9 selon votre profil \ud83d\udccb Journalisation des connexions Connexion Identifiez-vous pour acc\u00e9der \u00e0 votre espace [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-3551","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/maroczain.com\/en\/wp-json\/wp\/v2\/pages\/3551","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/maroczain.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/maroczain.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/maroczain.com\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/maroczain.com\/en\/wp-json\/wp\/v2\/comments?post=3551"}],"version-history":[{"count":2,"href":"https:\/\/maroczain.com\/en\/wp-json\/wp\/v2\/pages\/3551\/revisions"}],"predecessor-version":[{"id":3664,"href":"https:\/\/maroczain.com\/en\/wp-json\/wp\/v2\/pages\/3551\/revisions\/3664"}],"wp:attachment":[{"href":"https:\/\/maroczain.com\/en\/wp-json\/wp\/v2\/media?parent=3551"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}