Atelier Tadelakt MZA \u2014 Prestige Royal<\/title>\n\n<style>\n:root{\n --bg:#0f1511;\n --bg2:#171d18;\n --panel:#1e2821;\n --panel2:#243128;\n --gold:#d4aa57;\n --gold2:#f0d18a;\n --cream:#f3ead9;\n --text:#f8f5ed;\n --muted:#c8c1b5;\n --accent:#a86d3c;\n --success:#3d8a62;\n --danger:#b15353;\n --shadow:0 20px 60px rgba(0,0,0,.3);\n --radius:24px;\n}\n\n*{box-sizing:border-box}\nhtml{scroll-behavior:smooth}\n\nbody{\n margin:0;\n font-family:Arial,Helvetica,sans-serif;\n background:\n radial-gradient(circle at top right,rgba(212,170,87,.12),transparent 26%),\n linear-gradient(180deg,var(--bg),#121a15 55%,var(--bg));\n color:var(--text);\n line-height:1.6;\n}\n\na{text-decoration:none;color:inherit}\n\n.mza-page{\n width:100%;\n overflow:hidden;\n}\n\n.container{\n width:min(1200px,92%);\n margin:auto;\n}\n\n.hero{\n min-height:88vh;\n display:flex;\n align-items:center;\n position:relative;\n background:\n linear-gradient(90deg,rgba(10,14,11,.94),rgba(10,14,11,.5)),\n url(\"https:\/\/images.unsplash.com\/photo-1600566753190-17f0baa2a6c3?auto=format&fit=crop&w=1900&q=85\")\n center\/cover no-repeat;\n}\n\n.hero-content{\n max-width:820px;\n padding:100px 0 80px;\n}\n\n.badge{\n display:inline-flex;\n align-items:center;\n gap:8px;\n border:1px solid rgba(212,170,87,.4);\n border-radius:999px;\n padding:9px 16px;\n background:rgba(0,0,0,.3);\n color:var(--gold2);\n font-weight:900;\n font-size:.8rem;\n letter-spacing:.1em;\n}\n\nh1{\n font-size:clamp(2.7rem,7vw,5.7rem);\n line-height:.95;\n margin:24px 0;\n letter-spacing:-.04em;\n}\n\nh2{\n font-size:clamp(2rem,4vw,3.6rem);\n line-height:1.05;\n margin:10px 0 18px;\n}\n\n.gold{color:var(--gold2)}\n\n.hero p,\n.lead{\n max-width:820px;\n color:var(--muted);\n font-size:1.08rem;\n}\n\n.actions{\n display:flex;\n gap:12px;\n flex-wrap:wrap;\n margin-top:28px;\n}\n\n.btn{\n cursor:pointer;\n border:0;\n padding:15px 22px;\n border-radius:14px;\n font-weight:900;\n font-size:.95rem;\n transition:.25s;\n}\n\n.btn:hover{\n transform:translateY(-3px);\n}\n\n.btn-gold{\n background:linear-gradient(135deg,var(--gold2),var(--gold));\n color:#111;\n box-shadow:0 10px 30px rgba(212,170,87,.18);\n}\n\n.btn-outline{\n color:white;\n background:rgba(255,255,255,.04);\n border:1px solid rgba(255,255,255,.18);\n}\n\n.section{\n padding:80px 0;\n}\n\n.eyebrow{\n color:var(--gold2);\n text-transform:uppercase;\n letter-spacing:.14em;\n font-size:.8rem;\n font-weight:900;\n}\n\n.stats{\n display:grid;\n grid-template-columns:repeat(4,1fr);\n gap:15px;\n margin-top:35px;\n}\n\n.stat{\n background:linear-gradient(145deg,var(--panel),#172119);\n border:1px solid rgba(212,170,87,.15);\n padding:25px;\n border-radius:20px;\n text-align:center;\n}\n\n.stat strong{\n display:block;\n font-size:1.9rem;\n color:var(--gold2);\n}\n\n.grid{\n display:grid;\n grid-template-columns:repeat(2,1fr);\n gap:20px;\n margin-top:38px;\n}\n\n.card{\n background:linear-gradient(145deg,var(--panel),var(--panel2));\n border:1px solid rgba(212,170,87,.14);\n border-radius:var(--radius);\n padding:26px;\n box-shadow:var(--shadow);\n}\n\n.card-num{\n color:var(--gold2);\n font-size:.8rem;\n font-weight:900;\n letter-spacing:.1em;\n}\n\n.card h3{\n margin:8px 0;\n font-size:1.4rem;\n}\n\n.card p{\n color:var(--muted);\n margin-bottom:0;\n}\n\n.workflow{\n display:grid;\n grid-template-columns:repeat(4,1fr);\n gap:15px;\n margin-top:35px;\n}\n\n.step{\n background:#17221b;\n border:1px solid rgba(212,170,87,.14);\n border-radius:20px;\n padding:23px;\n}\n\n.step span{\n display:inline-flex;\n width:38px;\n height:38px;\n align-items:center;\n justify-content:center;\n border-radius:50%;\n background:var(--gold2);\n color:#111;\n font-weight:900;\n margin-bottom:12px;\n}\n\n.tools{\n background:\n linear-gradient(rgba(15,21,17,.94),rgba(15,21,17,.94)),\n url(\"https:\/\/images.unsplash.com\/photo-1600585152915-d208bec867a1?auto=format&fit=crop&w=1800&q=80\")\n center\/cover fixed;\n}\n\n.tool-grid{\n display:grid;\n grid-template-columns:1fr 1fr;\n gap:22px;\n margin-top:30px;\n}\n\n.tool{\n background:rgba(27,39,31,.9);\n border:1px solid rgba(212,170,87,.16);\n padding:28px;\n border-radius:24px;\n}\n\n.form-grid{\n display:grid;\n grid-template-columns:1fr 1fr;\n gap:14px;\n}\n\nlabel{\n display:block;\n margin-bottom:6px;\n font-size:.88rem;\n font-weight:700;\n color:#ddd5c7;\n}\n\ninput,\nselect{\n width:100%;\n padding:13px 14px;\n border-radius:12px;\n border:1px solid rgba(255,255,255,.12);\n background:#111a14;\n color:white;\n outline:none;\n}\n\ninput:focus,\nselect:focus{\n border-color:var(--gold);\n}\n\n.result{\n margin-top:18px;\n background:#111a14;\n border:1px solid rgba(212,170,87,.22);\n padding:20px;\n border-radius:18px;\n}\n\n.result-grid{\n display:grid;\n grid-template-columns:repeat(2,1fr);\n gap:10px;\n margin-top:12px;\n}\n\n.metric{\n background:rgba(255,255,255,.035);\n padding:12px;\n border-radius:12px;\n}\n\n.metric small{\n color:var(--muted);\n display:block;\n}\n\n.metric b{\n color:white;\n font-size:1.1rem;\n}\n\n.mission{\n display:grid;\n grid-template-columns:1fr 1fr;\n gap:32px;\n align-items:center;\n}\n\n.mission-box{\n background:linear-gradient(145deg,var(--panel),#141d16);\n border:1px solid rgba(212,170,87,.2);\n border-radius:26px;\n padding:34px;\n}\n\n.checks{\n list-style:none;\n padding:0;\n margin:22px 0;\n}\n\n.checks li{\n margin:10px 0;\n color:#ddd5c8;\n}\n\n.checks li:before{\n content:\"\u2713\";\n color:var(--gold2);\n margin-right:10px;\n font-weight:900;\n}\n\n.quiz{\n margin-top:32px;\n}\n\n.question{\n background:var(--panel);\n border:1px solid rgba(212,170,87,.14);\n padding:24px;\n border-radius:20px;\n margin-bottom:16px;\n}\n\n.answer{\n display:block;\n width:100%;\n text-align:left;\n margin-top:8px;\n padding:12px 14px;\n border-radius:12px;\n border:1px solid rgba(255,255,255,.1);\n background:#121c15;\n color:white;\n cursor:pointer;\n}\n\n.answer:hover{\n border-color:var(--gold);\n}\n\n.answer.correct{\n border-color:#4e9a71;\n background:rgba(78,154,113,.15);\n}\n\n.answer.wrong{\n border-color:#b15353;\n background:rgba(177,83,83,.15);\n}\n\n.final{\n text-align:center;\n}\n\n.final-box{\n padding:52px 30px;\n border-radius:30px;\n background:linear-gradient(145deg,#1e2821,#111812);\n border:1px solid rgba(212,170,87,.2);\n}\n\nfooter{\n border-top:1px solid rgba(255,255,255,.07);\n padding:35px 0;\n text-align:center;\n color:#999;\n}\n\n.toast{\n display:none;\n position:fixed;\n bottom:20px;\n right:20px;\n z-index:9999;\n background:var(--gold2);\n color:#111;\n padding:15px 18px;\n border-radius:13px;\n font-weight:900;\n box-shadow:var(--shadow);\n}\n\n@media(max-width:900px){\n .stats,\n .workflow{\n grid-template-columns:repeat(2,1fr);\n }\n\n .tool-grid,\n .mission{\n grid-template-columns:1fr;\n }\n}\n\n@media(max-width:620px){\n .grid,\n .stats,\n .workflow,\n .form-grid{\n grid-template-columns:1fr;\n }\n\n .section{\n padding:58px 0;\n }\n\n .btn{\n width:100%;\n }\n\n .hero{\n min-height:auto;\n }\n\n .hero-content{\n padding:70px 0;\n }\n}\n<\/style>\n<\/head>\n\n<body>\n\n<div class=\"mza-page\">\n\n<section class=\"hero\">\n <div class=\"container\">\n <div class=\"hero-content\">\n\n <span class=\"badge\">\n \ud83c\uddf2\ud83c\udde6 MZA DESIGN \u00b7 SAVOIR-FAIRE MAROCAIN\n <\/span>\n\n <h1>\n Atelier\n <span class=\"gold\">Tadelakt<\/span>\n <\/h1>\n\n <p>\n Comprendre et ma\u00eetriser l\u2019un des rev\u00eatements embl\u00e9matiques du Maroc :\n pr\u00e9paration des supports, mati\u00e8re, pigmentation, application,\n lissage, finition au savon noir et chiffrage complet du chantier.\n <\/p>\n\n <div class=\"actions\">\n <button class=\"btn btn-gold\" onclick=\"goTo('programme')\">\n Commencer l\u2019atelier\n <\/button>\n\n <button class=\"btn btn-outline\" onclick=\"goTo('calculateur')\">\n Ouvrir le calculateur\n <\/button>\n <\/div>\n\n <\/div>\n <\/div>\n<\/section>\n\n\n<section class=\"section\">\n<div class=\"container\">\n\n<span class=\"eyebrow\">Formation professionnelle MZA<\/span>\n\n<h2>\nDe la mati\u00e8re brute \u00e0 la\n<span class=\"gold\">finition d\u2019exception.<\/span>\n<\/h2>\n\n<p class=\"lead\">\nL\u2019apprenant ne se contente pas de regarder. Il analyse un chantier,\ncalcule les surfaces, pr\u00e9pare son intervention, choisit la finition,\n\u00e9value les quantit\u00e9s et \u00e9tablit son prix client.\n<\/p>\n\n<div class=\"stats\">\n\n<div class=\"stat\">\n<strong>8<\/strong>\nMissions\n<\/div>\n\n<div class=\"stat\">\n<strong>4<\/strong>\nProjets pratiques\n<\/div>\n\n<div class=\"stat\">\n<strong>1<\/strong>\nCalculateur\n<\/div>\n\n<div class=\"stat\">\n<strong>1<\/strong>\nProjet final\n<\/div>\n\n<\/div>\n\n<\/div>\n<\/section>\n\n\n<section class=\"section\" id=\"programme\">\n<div class=\"container\">\n\n<span class=\"eyebrow\">Parcours p\u00e9dagogique<\/span>\n\n<h2>\nLes 8 missions de\n<span class=\"gold\">l\u2019atelier Tadelakt.<\/span>\n<\/h2>\n\n<div class=\"grid\">\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 01<\/span>\n<h3>D\u00e9couvrir le Tadelakt<\/h3>\n<p>\nOrigines, usages marocains, propri\u00e9t\u00e9s d\u00e9coratives,\ncomportement en milieu humide et principales applications.\n<\/p>\n<\/div>\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 02<\/span>\n<h3>Analyser le support<\/h3>\n<p>\nIdentifier les supports compatibles, rep\u00e9rer les d\u00e9fauts,\ncontr\u00f4ler l\u2019adh\u00e9rence et pr\u00e9parer le chantier.\n<\/p>\n<\/div>\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 03<\/span>\n<h3>Pr\u00e9parer les surfaces<\/h3>\n<p>\nNettoyage, reprise des d\u00e9fauts, cr\u00e9ation de l\u2019accroche,\nhumidification et pr\u00e9paration avant application.\n<\/p>\n<\/div>\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 04<\/span>\n<h3>Pr\u00e9parer la mati\u00e8re<\/h3>\n<p>\nDosage, consistance, homog\u00e9n\u00e9isation,\npigmentation et pr\u00e9paration des quantit\u00e9s n\u00e9cessaires.\n<\/p>\n<\/div>\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 05<\/span>\n<h3>Appliquer<\/h3>\n<p>\nOrganisation du travail, premi\u00e8re passe, deuxi\u00e8me passe,\n\u00e9paisseur, angles et continuit\u00e9 visuelle.\n<\/p>\n<\/div>\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 06<\/span>\n<h3>Lisser & compacter<\/h3>\n<p>\nUtilisation du galet, fermeture du grain, contr\u00f4le de la surface\net recherche de l\u2019aspect final.\n<\/p>\n<\/div>\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 07<\/span>\n<h3>Finition au savon<\/h3>\n<p>\nProtection de surface, application du savon,\npolissage, entretien et contr\u00f4le final.\n<\/p>\n<\/div>\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 08<\/span>\n<h3>Chiffrer le chantier<\/h3>\n<p>\nM\u00e9tr\u00e9, mati\u00e8re, pertes, main-d\u2019\u0153uvre,\nco\u00fbt de revient, marge et prix client.\n<\/p>\n<\/div>\n\n<\/div>\n\n<\/div>\n<\/section>\n\n\n<section class=\"section\">\n<div class=\"container\">\n\n<span class=\"eyebrow\">M\u00e9thode chantier<\/span>\n\n<h2>\nLe processus\n<span class=\"gold\">MZA en 8 \u00e9tapes.<\/span>\n<\/h2>\n\n<div class=\"workflow\">\n\n<div class=\"step\">\n<span>1<\/span>\n<h3>Diagnostic<\/h3>\n<p>\u00c9valuer l\u2019\u00e9tat du support et l\u2019environnement.<\/p>\n<\/div>\n\n<div class=\"step\">\n<span>2<\/span>\n<h3>M\u00e9tr\u00e9<\/h3>\n<p>Calculer pr\u00e9cis\u00e9ment les surfaces utiles.<\/p>\n<\/div>\n\n<div class=\"step\">\n<span>3<\/span>\n<h3>Pr\u00e9paration<\/h3>\n<p>Corriger et pr\u00e9parer les parois.<\/p>\n<\/div>\n\n<div class=\"step\">\n<span>4<\/span>\n<h3>Mati\u00e8re<\/h3>\n<p>Pr\u00e9parer le m\u00e9lange et la pigmentation.<\/p>\n<\/div>\n\n<div class=\"step\">\n<span>5<\/span>\n<h3>Application<\/h3>\n<p>Appliquer progressivement le rev\u00eatement.<\/p>\n<\/div>\n\n<div class=\"step\">\n<span>6<\/span>\n<h3>Galet<\/h3>\n<p>Lisser et compacter la surface.<\/p>\n<\/div>\n\n<div class=\"step\">\n<span>7<\/span>\n<h3>Protection<\/h3>\n<p>Appliquer la finition protectrice adapt\u00e9e.<\/p>\n<\/div>\n\n<div class=\"step\">\n<span>8<\/span>\n<h3>Contr\u00f4le<\/h3>\n<p>Inspecter l\u2019aspect, les d\u00e9fauts et la finition.<\/p>\n<\/div>\n\n<\/div>\n\n<\/div>\n<\/section>\n\n\n<section class=\"section tools\" id=\"calculateur\">\n<div class=\"container\">\n\n<span class=\"eyebrow\">MZA Tadelakt Engine<\/span>\n\n<h2>\nCalculer votre\n<span class=\"gold\">chantier.<\/span>\n<\/h2>\n\n<p class=\"lead\">\nLe calculateur estime les surfaces, la quantit\u00e9 de mati\u00e8re\net le budget global \u00e0 partir des donn\u00e9es saisies.\n<\/p>\n\n<div class=\"tool-grid\">\n\n<div class=\"tool\">\n\n<h3>\ud83d\udcd0 M\u00e9tr\u00e9 du chantier<\/h3>\n\n<div class=\"form-grid\">\n\n<div>\n<label>Longueur pi\u00e8ce (m)<\/label>\n<input id=\"longueur\" type=\"number\" value=\"4\" min=\"1\" step=\".1\">\n<\/div>\n\n<div>\n<label>Largeur pi\u00e8ce (m)<\/label>\n<input id=\"largeur\" type=\"number\" value=\"3\" min=\"1\" step=\".1\">\n<\/div>\n\n<div>\n<label>Hauteur murs (m)<\/label>\n<input id=\"hauteur\" type=\"number\" value=\"2.8\" min=\"2\" step=\".1\">\n<\/div>\n\n<div>\n<label>Ouvertures \u00e0 d\u00e9duire (m\u00b2)<\/label>\n<input id=\"ouvertures\" type=\"number\" value=\"4\" min=\"0\" step=\".1\">\n<\/div>\n\n<\/div>\n\n<br>\n\n<button class=\"btn btn-gold\" onclick=\"calculSurface()\">\nCalculer la surface\n<\/button>\n\n<div class=\"result\">\n\n<strong>R\u00e9sultats<\/strong>\n\n<div class=\"result-grid\">\n\n<div class=\"metric\">\n<small>P\u00e9rim\u00e8tre<\/small>\n<b id=\"perimetre\">14 m<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Surface brute murs<\/small>\n<b id=\"brut\">39.2 m\u00b2<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Surface nette<\/small>\n<b id=\"net\">35.2 m\u00b2<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Surface sol<\/small>\n<b id=\"sol\">12 m\u00b2<\/b>\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n\n\n<div class=\"tool\">\n\n<h3>\ud83e\uddf1 Quantit\u00e9 de mati\u00e8re<\/h3>\n\n<div class=\"form-grid\">\n\n<div>\n<label>Surface \u00e0 traiter (m\u00b2)<\/label>\n<input id=\"surface\" type=\"number\" value=\"35.2\" min=\"1\" step=\".1\">\n<\/div>\n\n<div>\n<label>Consommation estim\u00e9e (kg\/m\u00b2)<\/label>\n<input id=\"rendement\" type=\"number\" value=\"2.5\" min=\".1\" step=\".1\">\n<\/div>\n\n<div>\n<label>Marge pertes (%)<\/label>\n<input id=\"pertes\" type=\"number\" value=\"10\" min=\"0\">\n<\/div>\n\n<div>\n<label>Poids d\u2019un sac (kg)<\/label>\n<input id=\"sac\" type=\"number\" value=\"20\" min=\"1\">\n<\/div>\n\n<\/div>\n\n<br>\n\n<button class=\"btn btn-gold\" onclick=\"calculMatiere()\">\nCalculer la quantit\u00e9\n<\/button>\n\n<div class=\"result\">\n\n<div class=\"result-grid\">\n\n<div class=\"metric\">\n<small>Besoin th\u00e9orique<\/small>\n<b id=\"kgBase\">88 kg<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Avec pertes<\/small>\n<b id=\"kgTotal\">96.8 kg<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Sacs n\u00e9cessaires<\/small>\n<b id=\"nbSacs\">5<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>R\u00e9serve chantier<\/small>\n<b id=\"reserve\">8.8 kg<\/b>\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n\n\n<div class=\"tool\">\n\n<h3>\ud83d\udcb0 Budget chantier<\/h3>\n\n<div class=\"form-grid\">\n\n<div>\n<label>Nombre de sacs<\/label>\n<input id=\"budgetSacs\" type=\"number\" value=\"5\" min=\"1\">\n<\/div>\n\n<div>\n<label>Prix par sac (MAD)<\/label>\n<input id=\"prixSac\" type=\"number\" value=\"180\" min=\"0\">\n<\/div>\n\n<div>\n<label>Main-d\u2019\u0153uvre (MAD\/m\u00b2)<\/label>\n<input id=\"mainOeuvre\" type=\"number\" value=\"220\" min=\"0\">\n<\/div>\n\n<div>\n<label>Marge commerciale (%)<\/label>\n<input id=\"marge\" type=\"number\" value=\"25\" min=\"0\">\n<\/div>\n\n<\/div>\n\n<br>\n\n<button class=\"btn btn-gold\" onclick=\"calculBudget()\">\nCalculer le prix client\n<\/button>\n\n<div class=\"result\">\n\n<div class=\"result-grid\">\n\n<div class=\"metric\">\n<small>Mati\u00e8re<\/small>\n<b id=\"matiereBudget\">900 MAD<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Main-d\u2019\u0153uvre<\/small>\n<b id=\"moBudget\">7 744 MAD<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Co\u00fbt de revient<\/small>\n<b id=\"coutRevient\">8 644 MAD<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Prix client estim\u00e9<\/small>\n<b id=\"prixClient\">10 805 MAD<\/b>\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n\n\n<div class=\"tool\">\n\n<h3>\ud83c\udfa8 Fiche finition<\/h3>\n\n<div class=\"form-grid\">\n\n<div>\n<label>Type de pi\u00e8ce<\/label>\n<select id=\"pieceType\">\n<option>Salle de bain<\/option>\n<option>Hammam<\/option>\n<option>Spa<\/option>\n<option>Mur d\u00e9coratif<\/option>\n<option>Suite de riad<\/option>\n<option>Restaurant<\/option>\n<\/select>\n<\/div>\n\n<div>\n<label>Style<\/label>\n<select id=\"styleProjet\">\n<option>Traditionnel marocain<\/option>\n<option>Riad Prestige<\/option>\n<option>Minimaliste<\/option>\n<option>Royal<\/option>\n<option>Contemporain<\/option>\n<\/select>\n<\/div>\n\n<div>\n<label>Teinte<\/label>\n<select id=\"teinte\">\n<option>Terre de Marrakech<\/option>\n<option>Ivoire<\/option>\n<option>Sable<\/option>\n<option>Vert olive<\/option>\n<option>Rouge profond<\/option>\n<option>Gris min\u00e9ral<\/option>\n<\/select>\n<\/div>\n\n<div>\n<label>Niveau finition<\/label>\n<select id=\"finition\">\n<option>Mate<\/option>\n<option>Satin\u00e9e<\/option>\n<option>Polie<\/option>\n<option>Prestige Royal<\/option>\n<\/select>\n<\/div>\n\n<\/div>\n\n<br>\n\n<button class=\"btn btn-gold\" onclick=\"genererFiche()\">\nG\u00e9n\u00e9rer la fiche\n<\/button>\n\n<div class=\"result\" id=\"ficheProjet\">\nVotre fiche projet appara\u00eetra ici.\n<\/div>\n\n<\/div>\n\n<\/div>\n<\/div>\n<\/section>\n\n\n<section class=\"section\">\n<div class=\"container mission\">\n\n<div class=\"mission-box\">\n\n<span class=\"eyebrow\">Mission chantier n\u00b01<\/span>\n\n<h2>\nSalle de bain\n<span class=\"gold\">Riad Prestige.<\/span>\n<\/h2>\n\n<p>\nUn client souhaite r\u00e9aliser un rev\u00eatement Tadelakt\nsur les murs d\u2019une salle de bain haut de gamme.\n<\/p>\n\n<ul class=\"checks\">\n<li>Mesurer les murs.<\/li>\n<li>D\u00e9duire les ouvertures.<\/li>\n<li>Choisir la teinte.<\/li>\n<li>Calculer les quantit\u00e9s.<\/li>\n<li>\u00c9valuer les pertes.<\/li>\n<li>Calculer la main-d\u2019\u0153uvre.<\/li>\n<li>D\u00e9terminer le prix client.<\/li>\n<li>Cr\u00e9er la fiche chantier.<\/li>\n<\/ul>\n\n<button class=\"btn btn-gold\" onclick=\"lancerMission()\">\nLancer la mission\n<\/button>\n\n<\/div>\n\n<div class=\"mission-box\">\n\n<span class=\"eyebrow\">Niveau Prestige Royal<\/span>\n\n<h3>Autres missions<\/h3>\n\n<ul class=\"checks\">\n<li>Hammam marocain traditionnel<\/li>\n<li>Spa d\u2019h\u00f4tel 5 \u00e9toiles<\/li>\n<li>Suite de riad<\/li>\n<li>Niche d\u00e9corative<\/li>\n<li>Vasque et meuble int\u00e9gr\u00e9<\/li>\n<li>Mur signature restaurant<\/li>\n<li>Villa contemporaine<\/li>\n<li>Palais de r\u00e9ception<\/li>\n<\/ul>\n\n<\/div>\n\n<\/div>\n<\/section>\n\n\n<section class=\"section\">\n<div class=\"container\">\n\n<span class=\"eyebrow\">\u00c9valuation rapide<\/span>\n\n<h2>\nMini-QCM\n<span class=\"gold\">Tadelakt.<\/span>\n<\/h2>\n\n<div class=\"quiz\">\n\n<div class=\"question\">\n<strong>1. Pourquoi faut-il analyser le support avant application ?<\/strong>\n\n<button class=\"answer\" onclick=\"answer(this,false)\">\nUniquement pour choisir la couleur.\n<\/button>\n\n<button class=\"answer\" onclick=\"answer(this,true)\">\nPour v\u00e9rifier son \u00e9tat, son adh\u00e9rence et sa compatibilit\u00e9.\n<\/button>\n\n<button class=\"answer\" onclick=\"answer(this,false)\">\nPour conna\u00eetre uniquement la hauteur de la pi\u00e8ce.\n<\/button>\n<\/div>\n\n\n<div class=\"question\">\n<strong>2. \u00c0 quoi sert la marge de perte dans le calcul mati\u00e8re ?<\/strong>\n\n<button class=\"answer\" onclick=\"answer(this,false)\">\n\u00c0 r\u00e9duire artificiellement le devis.\n<\/button>\n\n<button class=\"answer\" onclick=\"answer(this,true)\">\n\u00c0 couvrir les chutes, ajustements et al\u00e9as du chantier.\n<\/button>\n\n<button class=\"answer\" onclick=\"answer(this,false)\">\n\u00c0 supprimer le besoin de m\u00e9trage.\n<\/button>\n<\/div>\n\n\n<div class=\"question\">\n<strong>3. Le galet intervient principalement dans quelle phase ?<\/strong>\n\n<button class=\"answer\" onclick=\"answer(this,false)\">\nLe d\u00e9montage du mur.\n<\/button>\n\n<button class=\"answer\" onclick=\"answer(this,true)\">\nLe lissage et le compactage de la surface.\n<\/button>\n\n<button class=\"answer\" onclick=\"answer(this,false)\">\nLa mesure de la pi\u00e8ce.\n<\/button>\n<\/div>\n\n<\/div>\n\n<\/div>\n<\/section>\n\n\n<section class=\"section final\">\n<div class=\"container\">\n\n<div class=\"final-box\">\n\n<span class=\"eyebrow\">Examen final \u00b7 Collection Royal<\/span>\n\n<h2>\nProjet final\n<span class=\"gold\">Hammam MZA.<\/span>\n<\/h2>\n\n<p class=\"lead\" style=\"margin:auto\">\nL\u2019apprenant doit concevoir et chiffrer un chantier complet de Tadelakt\npour un hammam marocain : surfaces, mat\u00e9riaux, finition,\norganisation des travaux, co\u00fbt de revient et offre commerciale.\n<\/p>\n\n<div class=\"actions\" style=\"justify-content:center\">\n\n<button class=\"btn btn-gold\" onclick=\"masterProject()\">\nCommencer le projet final\n<\/button>\n\n<button class=\"btn btn-outline\" onclick=\"window.print()\">\nImprimer la fiche\n<\/button>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n<\/section>\n\n\n<footer>\n<div class=\"container\">\n<strong style=\"color:#f0d18a\">\nMAROC ZAIN ACADEMY\n<\/strong><br>\nMZA Design \u00b7 Atelier Tadelakt \u00b7 Patrimoine \u00b7 Artisanat \u00b7 Excellence\n<\/div>\n<\/footer>\n\n<\/div>\n\n<div id=\"toast\" class=\"toast\"><\/div>\n\n\n<script>\n\nfunction goTo(id){\n const element=document.getElementById(id);\n\n if(element){\n element.scrollIntoView({\n behavior:\"smooth\",\n block:\"start\"\n });\n }\n}\n\n\nfunction toast(message){\n\n const el=document.getElementById(\"toast\");\n\n el.innerHTML=message;\n el.style.display=\"block\";\n\n setTimeout(function(){\n el.style.display=\"none\";\n },3500);\n}\n\n\nfunction formatMAD(number){\n\n return new Intl.NumberFormat(\n \"fr-FR\",\n {\n maximumFractionDigits:0\n }\n ).format(number)+\" MAD\";\n\n}\n\n\nfunction calculSurface(){\n\n const L=parseFloat(\n document.getElementById(\"longueur\").value\n )||0;\n\n const l=parseFloat(\n document.getElementById(\"largeur\").value\n )||0;\n\n const h=parseFloat(\n document.getElementById(\"hauteur\").value\n )||0;\n\n const ouvertures=parseFloat(\n document.getElementById(\"ouvertures\").value\n )||0;\n\n const perimetre=2*(L+l);\n\n const brut=perimetre*h;\n\n const net=Math.max(\n 0,\n brut-ouvertures\n );\n\n const sol=L*l;\n\n document.getElementById(\"perimetre\").innerText=\n perimetre.toFixed(1)+\" m\";\n\n document.getElementById(\"brut\").innerText=\n brut.toFixed(1)+\" m\u00b2\";\n\n document.getElementById(\"net\").innerText=\n net.toFixed(1)+\" m\u00b2\";\n\n document.getElementById(\"sol\").innerText=\n sol.toFixed(1)+\" m\u00b2\";\n\n document.getElementById(\"surface\").value=\n net.toFixed(1);\n\n calculMatiere();\n\n toast(\"\u2713 M\u00e9tr\u00e9 actualis\u00e9.\");\n}\n\n\nfunction calculMatiere(){\n\n const surface=parseFloat(\n document.getElementById(\"surface\").value\n )||0;\n\n const rendement=parseFloat(\n document.getElementById(\"rendement\").value\n )||0;\n\n const pertes=parseFloat(\n document.getElementById(\"pertes\").value\n )||0;\n\n const poidsSac=parseFloat(\n document.getElementById(\"sac\").value\n )||1;\n\n const kgBase=\n surface*rendement;\n\n const kgTotal=\n kgBase*(1+pertes\/100);\n\n const nbSacs=\n Math.ceil(kgTotal\/poidsSac);\n\n const reserve=\n (nbSacs*poidsSac)-kgBase;\n\n document.getElementById(\"kgBase\").innerText=\n kgBase.toFixed(1)+\" kg\";\n\n document.getElementById(\"kgTotal\").innerText=\n kgTotal.toFixed(1)+\" kg\";\n\n document.getElementById(\"nbSacs\").innerText=\n nbSacs;\n\n document.getElementById(\"reserve\").innerText=\n reserve.toFixed(1)+\" kg\";\n\n document.getElementById(\"budgetSacs\").value=\n nbSacs;\n\n calculBudget();\n\n toast(\"\u2713 Quantit\u00e9 de mati\u00e8re calcul\u00e9e.\");\n}\n\n\nfunction calculBudget(){\n\n const sacs=parseFloat(\n document.getElementById(\"budgetSacs\").value\n )||0;\n\n const prixSac=parseFloat(\n document.getElementById(\"prixSac\").value\n )||0;\n\n const surface=parseFloat(\n document.getElementById(\"surface\").value\n )||0;\n\n const mo=parseFloat(\n document.getElementById(\"mainOeuvre\").value\n )||0;\n\n const marge=parseFloat(\n document.getElementById(\"marge\").value\n )||0;\n\n const matiere=\n sacs*prixSac;\n\n const mainOeuvre=\n surface*mo;\n\n const cout=\n matiere+mainOeuvre;\n\n const prixClient=\n cout*(1+marge\/100);\n\n document.getElementById(\"matiereBudget\").innerText=\n formatMAD(matiere);\n\n document.getElementById(\"moBudget\").innerText=\n formatMAD(mainOeuvre);\n\n document.getElementById(\"coutRevient\").innerText=\n formatMAD(cout);\n\n document.getElementById(\"prixClient\").innerText=\n formatMAD(prixClient);\n\n toast(\"\u2713 Budget chantier calcul\u00e9.\");\n}\n\n\nfunction genererFiche(){\n\n const piece=\n document.getElementById(\"pieceType\").value;\n\n const style=\n document.getElementById(\"styleProjet\").value;\n\n const teinte=\n document.getElementById(\"teinte\").value;\n\n const finition=\n document.getElementById(\"finition\").value;\n\n const surface=\n document.getElementById(\"surface\").value;\n\n document.getElementById(\"ficheProjet\").innerHTML=\n \"<strong>FICHE PROJET MZA<\/strong><br><br>\"+\n \"Type : \"+piece+\"<br>\"+\n \"Style : \"+style+\"<br>\"+\n \"Teinte : \"+teinte+\"<br>\"+\n \"Finition : \"+finition+\"<br>\"+\n \"Surface : \"+surface+\" m\u00b2<br><br>\"+\n \"<strong>Statut :<\/strong> projet pr\u00eat pour \u00e9tude chantier.\";\n\n toast(\"\u2713 Fiche projet g\u00e9n\u00e9r\u00e9e.\");\n}\n\n\nfunction answer(button,correct){\n\n const parent=\n button.parentElement;\n\n parent.querySelectorAll(\".answer\")\n .forEach(function(btn){\n btn.disabled=true;\n });\n\n if(correct){\n button.classList.add(\"correct\");\n toast(\"\u2713 Bonne r\u00e9ponse.\");\n }else{\n button.classList.add(\"wrong\");\n\n parent.querySelectorAll(\".answer\")\n .forEach(function(btn){\n if(\n btn.getAttribute(\"onclick\")\n .includes(\"true\")\n ){\n btn.classList.add(\"correct\");\n }\n });\n\n toast(\"R\u00e9ponse incorrecte. La bonne r\u00e9ponse est indiqu\u00e9e.\");\n }\n}\n\n\nfunction lancerMission(){\n\n goTo(\"calculateur\");\n\n setTimeout(function(){\n toast(\n \"MISSION OUVERTE \u00b7 Commencez par effectuer le m\u00e9tr\u00e9 de la salle de bain.\"\n );\n },500);\n\n}\n\n\nfunction masterProject(){\n\n toast(\n \"\ud83d\udc51 PROJET HAMMAM MZA ACTIV\u00c9 \u00b7 \u00c9tape 1 : d\u00e9finir le m\u00e9trage et les surfaces \u00e0 traiter.\"\n );\n\n}\n\n\ncalculSurface();\n\n<\/script>\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Atelier Tadelakt MZA \u2014 Prestige Royal \ud83c\uddf2\ud83c\udde6 MZA DESIGN \u00b7 SAVOIR-FAIRE MAROCAIN Atelier Tadelakt Comprendre et ma\u00eetriser l\u2019un des rev\u00eatements embl\u00e9matiques du Maroc : pr\u00e9paration des supports, mati\u00e8re, pigmentation, application, lissage, finition au savon noir et chiffrage complet du chantier. Commencer l\u2019atelier Ouvrir le calculateur Formation professionnelle MZA De la mati\u00e8re brute \u00e0 la finition […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1836","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/pages\/1836","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/comments?post=1836"}],"version-history":[{"count":1,"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/pages\/1836\/revisions"}],"predecessor-version":[{"id":1838,"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/pages\/1836\/revisions\/1838"}],"wp:attachment":[{"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/media?parent=1836"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":1836,"date":"2026-09-07T23:05:13","date_gmt":"2026-09-07T23:05:13","guid":{"rendered":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/?page_id=1836"},"modified":"2026-09-07T23:05:13","modified_gmt":"2026-09-07T23:05:13","slug":"atelier-tadelakt","status":"publish","type":"page","link":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/atelier-tadelakt\/","title":{"rendered":"Atelier Tadelakt"},"content":{"rendered":"\n\n\n\n\n\nAtelier Tadelakt MZA \u2014 Prestige Royal<\/title>\n\n<style>\n:root{\n --bg:#0f1511;\n --bg2:#171d18;\n --panel:#1e2821;\n --panel2:#243128;\n --gold:#d4aa57;\n --gold2:#f0d18a;\n --cream:#f3ead9;\n --text:#f8f5ed;\n --muted:#c8c1b5;\n --accent:#a86d3c;\n --success:#3d8a62;\n --danger:#b15353;\n --shadow:0 20px 60px rgba(0,0,0,.3);\n --radius:24px;\n}\n\n*{box-sizing:border-box}\nhtml{scroll-behavior:smooth}\n\nbody{\n margin:0;\n font-family:Arial,Helvetica,sans-serif;\n background:\n radial-gradient(circle at top right,rgba(212,170,87,.12),transparent 26%),\n linear-gradient(180deg,var(--bg),#121a15 55%,var(--bg));\n color:var(--text);\n line-height:1.6;\n}\n\na{text-decoration:none;color:inherit}\n\n.mza-page{\n width:100%;\n overflow:hidden;\n}\n\n.container{\n width:min(1200px,92%);\n margin:auto;\n}\n\n.hero{\n min-height:88vh;\n display:flex;\n align-items:center;\n position:relative;\n background:\n linear-gradient(90deg,rgba(10,14,11,.94),rgba(10,14,11,.5)),\n url(\"https:\/\/images.unsplash.com\/photo-1600566753190-17f0baa2a6c3?auto=format&fit=crop&w=1900&q=85\")\n center\/cover no-repeat;\n}\n\n.hero-content{\n max-width:820px;\n padding:100px 0 80px;\n}\n\n.badge{\n display:inline-flex;\n align-items:center;\n gap:8px;\n border:1px solid rgba(212,170,87,.4);\n border-radius:999px;\n padding:9px 16px;\n background:rgba(0,0,0,.3);\n color:var(--gold2);\n font-weight:900;\n font-size:.8rem;\n letter-spacing:.1em;\n}\n\nh1{\n font-size:clamp(2.7rem,7vw,5.7rem);\n line-height:.95;\n margin:24px 0;\n letter-spacing:-.04em;\n}\n\nh2{\n font-size:clamp(2rem,4vw,3.6rem);\n line-height:1.05;\n margin:10px 0 18px;\n}\n\n.gold{color:var(--gold2)}\n\n.hero p,\n.lead{\n max-width:820px;\n color:var(--muted);\n font-size:1.08rem;\n}\n\n.actions{\n display:flex;\n gap:12px;\n flex-wrap:wrap;\n margin-top:28px;\n}\n\n.btn{\n cursor:pointer;\n border:0;\n padding:15px 22px;\n border-radius:14px;\n font-weight:900;\n font-size:.95rem;\n transition:.25s;\n}\n\n.btn:hover{\n transform:translateY(-3px);\n}\n\n.btn-gold{\n background:linear-gradient(135deg,var(--gold2),var(--gold));\n color:#111;\n box-shadow:0 10px 30px rgba(212,170,87,.18);\n}\n\n.btn-outline{\n color:white;\n background:rgba(255,255,255,.04);\n border:1px solid rgba(255,255,255,.18);\n}\n\n.section{\n padding:80px 0;\n}\n\n.eyebrow{\n color:var(--gold2);\n text-transform:uppercase;\n letter-spacing:.14em;\n font-size:.8rem;\n font-weight:900;\n}\n\n.stats{\n display:grid;\n grid-template-columns:repeat(4,1fr);\n gap:15px;\n margin-top:35px;\n}\n\n.stat{\n background:linear-gradient(145deg,var(--panel),#172119);\n border:1px solid rgba(212,170,87,.15);\n padding:25px;\n border-radius:20px;\n text-align:center;\n}\n\n.stat strong{\n display:block;\n font-size:1.9rem;\n color:var(--gold2);\n}\n\n.grid{\n display:grid;\n grid-template-columns:repeat(2,1fr);\n gap:20px;\n margin-top:38px;\n}\n\n.card{\n background:linear-gradient(145deg,var(--panel),var(--panel2));\n border:1px solid rgba(212,170,87,.14);\n border-radius:var(--radius);\n padding:26px;\n box-shadow:var(--shadow);\n}\n\n.card-num{\n color:var(--gold2);\n font-size:.8rem;\n font-weight:900;\n letter-spacing:.1em;\n}\n\n.card h3{\n margin:8px 0;\n font-size:1.4rem;\n}\n\n.card p{\n color:var(--muted);\n margin-bottom:0;\n}\n\n.workflow{\n display:grid;\n grid-template-columns:repeat(4,1fr);\n gap:15px;\n margin-top:35px;\n}\n\n.step{\n background:#17221b;\n border:1px solid rgba(212,170,87,.14);\n border-radius:20px;\n padding:23px;\n}\n\n.step span{\n display:inline-flex;\n width:38px;\n height:38px;\n align-items:center;\n justify-content:center;\n border-radius:50%;\n background:var(--gold2);\n color:#111;\n font-weight:900;\n margin-bottom:12px;\n}\n\n.tools{\n background:\n linear-gradient(rgba(15,21,17,.94),rgba(15,21,17,.94)),\n url(\"https:\/\/images.unsplash.com\/photo-1600585152915-d208bec867a1?auto=format&fit=crop&w=1800&q=80\")\n center\/cover fixed;\n}\n\n.tool-grid{\n display:grid;\n grid-template-columns:1fr 1fr;\n gap:22px;\n margin-top:30px;\n}\n\n.tool{\n background:rgba(27,39,31,.9);\n border:1px solid rgba(212,170,87,.16);\n padding:28px;\n border-radius:24px;\n}\n\n.form-grid{\n display:grid;\n grid-template-columns:1fr 1fr;\n gap:14px;\n}\n\nlabel{\n display:block;\n margin-bottom:6px;\n font-size:.88rem;\n font-weight:700;\n color:#ddd5c7;\n}\n\ninput,\nselect{\n width:100%;\n padding:13px 14px;\n border-radius:12px;\n border:1px solid rgba(255,255,255,.12);\n background:#111a14;\n color:white;\n outline:none;\n}\n\ninput:focus,\nselect:focus{\n border-color:var(--gold);\n}\n\n.result{\n margin-top:18px;\n background:#111a14;\n border:1px solid rgba(212,170,87,.22);\n padding:20px;\n border-radius:18px;\n}\n\n.result-grid{\n display:grid;\n grid-template-columns:repeat(2,1fr);\n gap:10px;\n margin-top:12px;\n}\n\n.metric{\n background:rgba(255,255,255,.035);\n padding:12px;\n border-radius:12px;\n}\n\n.metric small{\n color:var(--muted);\n display:block;\n}\n\n.metric b{\n color:white;\n font-size:1.1rem;\n}\n\n.mission{\n display:grid;\n grid-template-columns:1fr 1fr;\n gap:32px;\n align-items:center;\n}\n\n.mission-box{\n background:linear-gradient(145deg,var(--panel),#141d16);\n border:1px solid rgba(212,170,87,.2);\n border-radius:26px;\n padding:34px;\n}\n\n.checks{\n list-style:none;\n padding:0;\n margin:22px 0;\n}\n\n.checks li{\n margin:10px 0;\n color:#ddd5c8;\n}\n\n.checks li:before{\n content:\"\u2713\";\n color:var(--gold2);\n margin-right:10px;\n font-weight:900;\n}\n\n.quiz{\n margin-top:32px;\n}\n\n.question{\n background:var(--panel);\n border:1px solid rgba(212,170,87,.14);\n padding:24px;\n border-radius:20px;\n margin-bottom:16px;\n}\n\n.answer{\n display:block;\n width:100%;\n text-align:left;\n margin-top:8px;\n padding:12px 14px;\n border-radius:12px;\n border:1px solid rgba(255,255,255,.1);\n background:#121c15;\n color:white;\n cursor:pointer;\n}\n\n.answer:hover{\n border-color:var(--gold);\n}\n\n.answer.correct{\n border-color:#4e9a71;\n background:rgba(78,154,113,.15);\n}\n\n.answer.wrong{\n border-color:#b15353;\n background:rgba(177,83,83,.15);\n}\n\n.final{\n text-align:center;\n}\n\n.final-box{\n padding:52px 30px;\n border-radius:30px;\n background:linear-gradient(145deg,#1e2821,#111812);\n border:1px solid rgba(212,170,87,.2);\n}\n\nfooter{\n border-top:1px solid rgba(255,255,255,.07);\n padding:35px 0;\n text-align:center;\n color:#999;\n}\n\n.toast{\n display:none;\n position:fixed;\n bottom:20px;\n right:20px;\n z-index:9999;\n background:var(--gold2);\n color:#111;\n padding:15px 18px;\n border-radius:13px;\n font-weight:900;\n box-shadow:var(--shadow);\n}\n\n@media(max-width:900px){\n .stats,\n .workflow{\n grid-template-columns:repeat(2,1fr);\n }\n\n .tool-grid,\n .mission{\n grid-template-columns:1fr;\n }\n}\n\n@media(max-width:620px){\n .grid,\n .stats,\n .workflow,\n .form-grid{\n grid-template-columns:1fr;\n }\n\n .section{\n padding:58px 0;\n }\n\n .btn{\n width:100%;\n }\n\n .hero{\n min-height:auto;\n }\n\n .hero-content{\n padding:70px 0;\n }\n}\n<\/style>\n<\/head>\n\n<body>\n\n<div class=\"mza-page\">\n\n<section class=\"hero\">\n <div class=\"container\">\n <div class=\"hero-content\">\n\n <span class=\"badge\">\n \ud83c\uddf2\ud83c\udde6 MZA DESIGN \u00b7 SAVOIR-FAIRE MAROCAIN\n <\/span>\n\n <h1>\n Atelier\n <span class=\"gold\">Tadelakt<\/span>\n <\/h1>\n\n <p>\n Comprendre et ma\u00eetriser l\u2019un des rev\u00eatements embl\u00e9matiques du Maroc :\n pr\u00e9paration des supports, mati\u00e8re, pigmentation, application,\n lissage, finition au savon noir et chiffrage complet du chantier.\n <\/p>\n\n <div class=\"actions\">\n <button class=\"btn btn-gold\" onclick=\"goTo('programme')\">\n Commencer l\u2019atelier\n <\/button>\n\n <button class=\"btn btn-outline\" onclick=\"goTo('calculateur')\">\n Ouvrir le calculateur\n <\/button>\n <\/div>\n\n <\/div>\n <\/div>\n<\/section>\n\n\n<section class=\"section\">\n<div class=\"container\">\n\n<span class=\"eyebrow\">Formation professionnelle MZA<\/span>\n\n<h2>\nDe la mati\u00e8re brute \u00e0 la\n<span class=\"gold\">finition d\u2019exception.<\/span>\n<\/h2>\n\n<p class=\"lead\">\nL\u2019apprenant ne se contente pas de regarder. Il analyse un chantier,\ncalcule les surfaces, pr\u00e9pare son intervention, choisit la finition,\n\u00e9value les quantit\u00e9s et \u00e9tablit son prix client.\n<\/p>\n\n<div class=\"stats\">\n\n<div class=\"stat\">\n<strong>8<\/strong>\nMissions\n<\/div>\n\n<div class=\"stat\">\n<strong>4<\/strong>\nProjets pratiques\n<\/div>\n\n<div class=\"stat\">\n<strong>1<\/strong>\nCalculateur\n<\/div>\n\n<div class=\"stat\">\n<strong>1<\/strong>\nProjet final\n<\/div>\n\n<\/div>\n\n<\/div>\n<\/section>\n\n\n<section class=\"section\" id=\"programme\">\n<div class=\"container\">\n\n<span class=\"eyebrow\">Parcours p\u00e9dagogique<\/span>\n\n<h2>\nLes 8 missions de\n<span class=\"gold\">l\u2019atelier Tadelakt.<\/span>\n<\/h2>\n\n<div class=\"grid\">\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 01<\/span>\n<h3>D\u00e9couvrir le Tadelakt<\/h3>\n<p>\nOrigines, usages marocains, propri\u00e9t\u00e9s d\u00e9coratives,\ncomportement en milieu humide et principales applications.\n<\/p>\n<\/div>\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 02<\/span>\n<h3>Analyser le support<\/h3>\n<p>\nIdentifier les supports compatibles, rep\u00e9rer les d\u00e9fauts,\ncontr\u00f4ler l\u2019adh\u00e9rence et pr\u00e9parer le chantier.\n<\/p>\n<\/div>\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 03<\/span>\n<h3>Pr\u00e9parer les surfaces<\/h3>\n<p>\nNettoyage, reprise des d\u00e9fauts, cr\u00e9ation de l\u2019accroche,\nhumidification et pr\u00e9paration avant application.\n<\/p>\n<\/div>\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 04<\/span>\n<h3>Pr\u00e9parer la mati\u00e8re<\/h3>\n<p>\nDosage, consistance, homog\u00e9n\u00e9isation,\npigmentation et pr\u00e9paration des quantit\u00e9s n\u00e9cessaires.\n<\/p>\n<\/div>\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 05<\/span>\n<h3>Appliquer<\/h3>\n<p>\nOrganisation du travail, premi\u00e8re passe, deuxi\u00e8me passe,\n\u00e9paisseur, angles et continuit\u00e9 visuelle.\n<\/p>\n<\/div>\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 06<\/span>\n<h3>Lisser & compacter<\/h3>\n<p>\nUtilisation du galet, fermeture du grain, contr\u00f4le de la surface\net recherche de l\u2019aspect final.\n<\/p>\n<\/div>\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 07<\/span>\n<h3>Finition au savon<\/h3>\n<p>\nProtection de surface, application du savon,\npolissage, entretien et contr\u00f4le final.\n<\/p>\n<\/div>\n\n<div class=\"card\">\n<span class=\"card-num\">MISSION 08<\/span>\n<h3>Chiffrer le chantier<\/h3>\n<p>\nM\u00e9tr\u00e9, mati\u00e8re, pertes, main-d\u2019\u0153uvre,\nco\u00fbt de revient, marge et prix client.\n<\/p>\n<\/div>\n\n<\/div>\n\n<\/div>\n<\/section>\n\n\n<section class=\"section\">\n<div class=\"container\">\n\n<span class=\"eyebrow\">M\u00e9thode chantier<\/span>\n\n<h2>\nLe processus\n<span class=\"gold\">MZA en 8 \u00e9tapes.<\/span>\n<\/h2>\n\n<div class=\"workflow\">\n\n<div class=\"step\">\n<span>1<\/span>\n<h3>Diagnostic<\/h3>\n<p>\u00c9valuer l\u2019\u00e9tat du support et l\u2019environnement.<\/p>\n<\/div>\n\n<div class=\"step\">\n<span>2<\/span>\n<h3>M\u00e9tr\u00e9<\/h3>\n<p>Calculer pr\u00e9cis\u00e9ment les surfaces utiles.<\/p>\n<\/div>\n\n<div class=\"step\">\n<span>3<\/span>\n<h3>Pr\u00e9paration<\/h3>\n<p>Corriger et pr\u00e9parer les parois.<\/p>\n<\/div>\n\n<div class=\"step\">\n<span>4<\/span>\n<h3>Mati\u00e8re<\/h3>\n<p>Pr\u00e9parer le m\u00e9lange et la pigmentation.<\/p>\n<\/div>\n\n<div class=\"step\">\n<span>5<\/span>\n<h3>Application<\/h3>\n<p>Appliquer progressivement le rev\u00eatement.<\/p>\n<\/div>\n\n<div class=\"step\">\n<span>6<\/span>\n<h3>Galet<\/h3>\n<p>Lisser et compacter la surface.<\/p>\n<\/div>\n\n<div class=\"step\">\n<span>7<\/span>\n<h3>Protection<\/h3>\n<p>Appliquer la finition protectrice adapt\u00e9e.<\/p>\n<\/div>\n\n<div class=\"step\">\n<span>8<\/span>\n<h3>Contr\u00f4le<\/h3>\n<p>Inspecter l\u2019aspect, les d\u00e9fauts et la finition.<\/p>\n<\/div>\n\n<\/div>\n\n<\/div>\n<\/section>\n\n\n<section class=\"section tools\" id=\"calculateur\">\n<div class=\"container\">\n\n<span class=\"eyebrow\">MZA Tadelakt Engine<\/span>\n\n<h2>\nCalculer votre\n<span class=\"gold\">chantier.<\/span>\n<\/h2>\n\n<p class=\"lead\">\nLe calculateur estime les surfaces, la quantit\u00e9 de mati\u00e8re\net le budget global \u00e0 partir des donn\u00e9es saisies.\n<\/p>\n\n<div class=\"tool-grid\">\n\n<div class=\"tool\">\n\n<h3>\ud83d\udcd0 M\u00e9tr\u00e9 du chantier<\/h3>\n\n<div class=\"form-grid\">\n\n<div>\n<label>Longueur pi\u00e8ce (m)<\/label>\n<input id=\"longueur\" type=\"number\" value=\"4\" min=\"1\" step=\".1\">\n<\/div>\n\n<div>\n<label>Largeur pi\u00e8ce (m)<\/label>\n<input id=\"largeur\" type=\"number\" value=\"3\" min=\"1\" step=\".1\">\n<\/div>\n\n<div>\n<label>Hauteur murs (m)<\/label>\n<input id=\"hauteur\" type=\"number\" value=\"2.8\" min=\"2\" step=\".1\">\n<\/div>\n\n<div>\n<label>Ouvertures \u00e0 d\u00e9duire (m\u00b2)<\/label>\n<input id=\"ouvertures\" type=\"number\" value=\"4\" min=\"0\" step=\".1\">\n<\/div>\n\n<\/div>\n\n<br>\n\n<button class=\"btn btn-gold\" onclick=\"calculSurface()\">\nCalculer la surface\n<\/button>\n\n<div class=\"result\">\n\n<strong>R\u00e9sultats<\/strong>\n\n<div class=\"result-grid\">\n\n<div class=\"metric\">\n<small>P\u00e9rim\u00e8tre<\/small>\n<b id=\"perimetre\">14 m<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Surface brute murs<\/small>\n<b id=\"brut\">39.2 m\u00b2<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Surface nette<\/small>\n<b id=\"net\">35.2 m\u00b2<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Surface sol<\/small>\n<b id=\"sol\">12 m\u00b2<\/b>\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n\n\n<div class=\"tool\">\n\n<h3>\ud83e\uddf1 Quantit\u00e9 de mati\u00e8re<\/h3>\n\n<div class=\"form-grid\">\n\n<div>\n<label>Surface \u00e0 traiter (m\u00b2)<\/label>\n<input id=\"surface\" type=\"number\" value=\"35.2\" min=\"1\" step=\".1\">\n<\/div>\n\n<div>\n<label>Consommation estim\u00e9e (kg\/m\u00b2)<\/label>\n<input id=\"rendement\" type=\"number\" value=\"2.5\" min=\".1\" step=\".1\">\n<\/div>\n\n<div>\n<label>Marge pertes (%)<\/label>\n<input id=\"pertes\" type=\"number\" value=\"10\" min=\"0\">\n<\/div>\n\n<div>\n<label>Poids d\u2019un sac (kg)<\/label>\n<input id=\"sac\" type=\"number\" value=\"20\" min=\"1\">\n<\/div>\n\n<\/div>\n\n<br>\n\n<button class=\"btn btn-gold\" onclick=\"calculMatiere()\">\nCalculer la quantit\u00e9\n<\/button>\n\n<div class=\"result\">\n\n<div class=\"result-grid\">\n\n<div class=\"metric\">\n<small>Besoin th\u00e9orique<\/small>\n<b id=\"kgBase\">88 kg<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Avec pertes<\/small>\n<b id=\"kgTotal\">96.8 kg<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Sacs n\u00e9cessaires<\/small>\n<b id=\"nbSacs\">5<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>R\u00e9serve chantier<\/small>\n<b id=\"reserve\">8.8 kg<\/b>\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n\n\n<div class=\"tool\">\n\n<h3>\ud83d\udcb0 Budget chantier<\/h3>\n\n<div class=\"form-grid\">\n\n<div>\n<label>Nombre de sacs<\/label>\n<input id=\"budgetSacs\" type=\"number\" value=\"5\" min=\"1\">\n<\/div>\n\n<div>\n<label>Prix par sac (MAD)<\/label>\n<input id=\"prixSac\" type=\"number\" value=\"180\" min=\"0\">\n<\/div>\n\n<div>\n<label>Main-d\u2019\u0153uvre (MAD\/m\u00b2)<\/label>\n<input id=\"mainOeuvre\" type=\"number\" value=\"220\" min=\"0\">\n<\/div>\n\n<div>\n<label>Marge commerciale (%)<\/label>\n<input id=\"marge\" type=\"number\" value=\"25\" min=\"0\">\n<\/div>\n\n<\/div>\n\n<br>\n\n<button class=\"btn btn-gold\" onclick=\"calculBudget()\">\nCalculer le prix client\n<\/button>\n\n<div class=\"result\">\n\n<div class=\"result-grid\">\n\n<div class=\"metric\">\n<small>Mati\u00e8re<\/small>\n<b id=\"matiereBudget\">900 MAD<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Main-d\u2019\u0153uvre<\/small>\n<b id=\"moBudget\">7 744 MAD<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Co\u00fbt de revient<\/small>\n<b id=\"coutRevient\">8 644 MAD<\/b>\n<\/div>\n\n<div class=\"metric\">\n<small>Prix client estim\u00e9<\/small>\n<b id=\"prixClient\">10 805 MAD<\/b>\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n\n\n<div class=\"tool\">\n\n<h3>\ud83c\udfa8 Fiche finition<\/h3>\n\n<div class=\"form-grid\">\n\n<div>\n<label>Type de pi\u00e8ce<\/label>\n<select id=\"pieceType\">\n<option>Salle de bain<\/option>\n<option>Hammam<\/option>\n<option>Spa<\/option>\n<option>Mur d\u00e9coratif<\/option>\n<option>Suite de riad<\/option>\n<option>Restaurant<\/option>\n<\/select>\n<\/div>\n\n<div>\n<label>Style<\/label>\n<select id=\"styleProjet\">\n<option>Traditionnel marocain<\/option>\n<option>Riad Prestige<\/option>\n<option>Minimaliste<\/option>\n<option>Royal<\/option>\n<option>Contemporain<\/option>\n<\/select>\n<\/div>\n\n<div>\n<label>Teinte<\/label>\n<select id=\"teinte\">\n<option>Terre de Marrakech<\/option>\n<option>Ivoire<\/option>\n<option>Sable<\/option>\n<option>Vert olive<\/option>\n<option>Rouge profond<\/option>\n<option>Gris min\u00e9ral<\/option>\n<\/select>\n<\/div>\n\n<div>\n<label>Niveau finition<\/label>\n<select id=\"finition\">\n<option>Mate<\/option>\n<option>Satin\u00e9e<\/option>\n<option>Polie<\/option>\n<option>Prestige Royal<\/option>\n<\/select>\n<\/div>\n\n<\/div>\n\n<br>\n\n<button class=\"btn btn-gold\" onclick=\"genererFiche()\">\nG\u00e9n\u00e9rer la fiche\n<\/button>\n\n<div class=\"result\" id=\"ficheProjet\">\nVotre fiche projet appara\u00eetra ici.\n<\/div>\n\n<\/div>\n\n<\/div>\n<\/div>\n<\/section>\n\n\n<section class=\"section\">\n<div class=\"container mission\">\n\n<div class=\"mission-box\">\n\n<span class=\"eyebrow\">Mission chantier n\u00b01<\/span>\n\n<h2>\nSalle de bain\n<span class=\"gold\">Riad Prestige.<\/span>\n<\/h2>\n\n<p>\nUn client souhaite r\u00e9aliser un rev\u00eatement Tadelakt\nsur les murs d\u2019une salle de bain haut de gamme.\n<\/p>\n\n<ul class=\"checks\">\n<li>Mesurer les murs.<\/li>\n<li>D\u00e9duire les ouvertures.<\/li>\n<li>Choisir la teinte.<\/li>\n<li>Calculer les quantit\u00e9s.<\/li>\n<li>\u00c9valuer les pertes.<\/li>\n<li>Calculer la main-d\u2019\u0153uvre.<\/li>\n<li>D\u00e9terminer le prix client.<\/li>\n<li>Cr\u00e9er la fiche chantier.<\/li>\n<\/ul>\n\n<button class=\"btn btn-gold\" onclick=\"lancerMission()\">\nLancer la mission\n<\/button>\n\n<\/div>\n\n<div class=\"mission-box\">\n\n<span class=\"eyebrow\">Niveau Prestige Royal<\/span>\n\n<h3>Autres missions<\/h3>\n\n<ul class=\"checks\">\n<li>Hammam marocain traditionnel<\/li>\n<li>Spa d\u2019h\u00f4tel 5 \u00e9toiles<\/li>\n<li>Suite de riad<\/li>\n<li>Niche d\u00e9corative<\/li>\n<li>Vasque et meuble int\u00e9gr\u00e9<\/li>\n<li>Mur signature restaurant<\/li>\n<li>Villa contemporaine<\/li>\n<li>Palais de r\u00e9ception<\/li>\n<\/ul>\n\n<\/div>\n\n<\/div>\n<\/section>\n\n\n<section class=\"section\">\n<div class=\"container\">\n\n<span class=\"eyebrow\">\u00c9valuation rapide<\/span>\n\n<h2>\nMini-QCM\n<span class=\"gold\">Tadelakt.<\/span>\n<\/h2>\n\n<div class=\"quiz\">\n\n<div class=\"question\">\n<strong>1. Pourquoi faut-il analyser le support avant application ?<\/strong>\n\n<button class=\"answer\" onclick=\"answer(this,false)\">\nUniquement pour choisir la couleur.\n<\/button>\n\n<button class=\"answer\" onclick=\"answer(this,true)\">\nPour v\u00e9rifier son \u00e9tat, son adh\u00e9rence et sa compatibilit\u00e9.\n<\/button>\n\n<button class=\"answer\" onclick=\"answer(this,false)\">\nPour conna\u00eetre uniquement la hauteur de la pi\u00e8ce.\n<\/button>\n<\/div>\n\n\n<div class=\"question\">\n<strong>2. \u00c0 quoi sert la marge de perte dans le calcul mati\u00e8re ?<\/strong>\n\n<button class=\"answer\" onclick=\"answer(this,false)\">\n\u00c0 r\u00e9duire artificiellement le devis.\n<\/button>\n\n<button class=\"answer\" onclick=\"answer(this,true)\">\n\u00c0 couvrir les chutes, ajustements et al\u00e9as du chantier.\n<\/button>\n\n<button class=\"answer\" onclick=\"answer(this,false)\">\n\u00c0 supprimer le besoin de m\u00e9trage.\n<\/button>\n<\/div>\n\n\n<div class=\"question\">\n<strong>3. Le galet intervient principalement dans quelle phase ?<\/strong>\n\n<button class=\"answer\" onclick=\"answer(this,false)\">\nLe d\u00e9montage du mur.\n<\/button>\n\n<button class=\"answer\" onclick=\"answer(this,true)\">\nLe lissage et le compactage de la surface.\n<\/button>\n\n<button class=\"answer\" onclick=\"answer(this,false)\">\nLa mesure de la pi\u00e8ce.\n<\/button>\n<\/div>\n\n<\/div>\n\n<\/div>\n<\/section>\n\n\n<section class=\"section final\">\n<div class=\"container\">\n\n<div class=\"final-box\">\n\n<span class=\"eyebrow\">Examen final \u00b7 Collection Royal<\/span>\n\n<h2>\nProjet final\n<span class=\"gold\">Hammam MZA.<\/span>\n<\/h2>\n\n<p class=\"lead\" style=\"margin:auto\">\nL\u2019apprenant doit concevoir et chiffrer un chantier complet de Tadelakt\npour un hammam marocain : surfaces, mat\u00e9riaux, finition,\norganisation des travaux, co\u00fbt de revient et offre commerciale.\n<\/p>\n\n<div class=\"actions\" style=\"justify-content:center\">\n\n<button class=\"btn btn-gold\" onclick=\"masterProject()\">\nCommencer le projet final\n<\/button>\n\n<button class=\"btn btn-outline\" onclick=\"window.print()\">\nImprimer la fiche\n<\/button>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n<\/section>\n\n\n<footer>\n<div class=\"container\">\n<strong style=\"color:#f0d18a\">\nMAROC ZAIN ACADEMY\n<\/strong><br>\nMZA Design \u00b7 Atelier Tadelakt \u00b7 Patrimoine \u00b7 Artisanat \u00b7 Excellence\n<\/div>\n<\/footer>\n\n<\/div>\n\n<div id=\"toast\" class=\"toast\"><\/div>\n\n\n<script>\n\nfunction goTo(id){\n const element=document.getElementById(id);\n\n if(element){\n element.scrollIntoView({\n behavior:\"smooth\",\n block:\"start\"\n });\n }\n}\n\n\nfunction toast(message){\n\n const el=document.getElementById(\"toast\");\n\n el.innerHTML=message;\n el.style.display=\"block\";\n\n setTimeout(function(){\n el.style.display=\"none\";\n },3500);\n}\n\n\nfunction formatMAD(number){\n\n return new Intl.NumberFormat(\n \"fr-FR\",\n {\n maximumFractionDigits:0\n }\n ).format(number)+\" MAD\";\n\n}\n\n\nfunction calculSurface(){\n\n const L=parseFloat(\n document.getElementById(\"longueur\").value\n )||0;\n\n const l=parseFloat(\n document.getElementById(\"largeur\").value\n )||0;\n\n const h=parseFloat(\n document.getElementById(\"hauteur\").value\n )||0;\n\n const ouvertures=parseFloat(\n document.getElementById(\"ouvertures\").value\n )||0;\n\n const perimetre=2*(L+l);\n\n const brut=perimetre*h;\n\n const net=Math.max(\n 0,\n brut-ouvertures\n );\n\n const sol=L*l;\n\n document.getElementById(\"perimetre\").innerText=\n perimetre.toFixed(1)+\" m\";\n\n document.getElementById(\"brut\").innerText=\n brut.toFixed(1)+\" m\u00b2\";\n\n document.getElementById(\"net\").innerText=\n net.toFixed(1)+\" m\u00b2\";\n\n document.getElementById(\"sol\").innerText=\n sol.toFixed(1)+\" m\u00b2\";\n\n document.getElementById(\"surface\").value=\n net.toFixed(1);\n\n calculMatiere();\n\n toast(\"\u2713 M\u00e9tr\u00e9 actualis\u00e9.\");\n}\n\n\nfunction calculMatiere(){\n\n const surface=parseFloat(\n document.getElementById(\"surface\").value\n )||0;\n\n const rendement=parseFloat(\n document.getElementById(\"rendement\").value\n )||0;\n\n const pertes=parseFloat(\n document.getElementById(\"pertes\").value\n )||0;\n\n const poidsSac=parseFloat(\n document.getElementById(\"sac\").value\n )||1;\n\n const kgBase=\n surface*rendement;\n\n const kgTotal=\n kgBase*(1+pertes\/100);\n\n const nbSacs=\n Math.ceil(kgTotal\/poidsSac);\n\n const reserve=\n (nbSacs*poidsSac)-kgBase;\n\n document.getElementById(\"kgBase\").innerText=\n kgBase.toFixed(1)+\" kg\";\n\n document.getElementById(\"kgTotal\").innerText=\n kgTotal.toFixed(1)+\" kg\";\n\n document.getElementById(\"nbSacs\").innerText=\n nbSacs;\n\n document.getElementById(\"reserve\").innerText=\n reserve.toFixed(1)+\" kg\";\n\n document.getElementById(\"budgetSacs\").value=\n nbSacs;\n\n calculBudget();\n\n toast(\"\u2713 Quantit\u00e9 de mati\u00e8re calcul\u00e9e.\");\n}\n\n\nfunction calculBudget(){\n\n const sacs=parseFloat(\n document.getElementById(\"budgetSacs\").value\n )||0;\n\n const prixSac=parseFloat(\n document.getElementById(\"prixSac\").value\n )||0;\n\n const surface=parseFloat(\n document.getElementById(\"surface\").value\n )||0;\n\n const mo=parseFloat(\n document.getElementById(\"mainOeuvre\").value\n )||0;\n\n const marge=parseFloat(\n document.getElementById(\"marge\").value\n )||0;\n\n const matiere=\n sacs*prixSac;\n\n const mainOeuvre=\n surface*mo;\n\n const cout=\n matiere+mainOeuvre;\n\n const prixClient=\n cout*(1+marge\/100);\n\n document.getElementById(\"matiereBudget\").innerText=\n formatMAD(matiere);\n\n document.getElementById(\"moBudget\").innerText=\n formatMAD(mainOeuvre);\n\n document.getElementById(\"coutRevient\").innerText=\n formatMAD(cout);\n\n document.getElementById(\"prixClient\").innerText=\n formatMAD(prixClient);\n\n toast(\"\u2713 Budget chantier calcul\u00e9.\");\n}\n\n\nfunction genererFiche(){\n\n const piece=\n document.getElementById(\"pieceType\").value;\n\n const style=\n document.getElementById(\"styleProjet\").value;\n\n const teinte=\n document.getElementById(\"teinte\").value;\n\n const finition=\n document.getElementById(\"finition\").value;\n\n const surface=\n document.getElementById(\"surface\").value;\n\n document.getElementById(\"ficheProjet\").innerHTML=\n \"<strong>FICHE PROJET MZA<\/strong><br><br>\"+\n \"Type : \"+piece+\"<br>\"+\n \"Style : \"+style+\"<br>\"+\n \"Teinte : \"+teinte+\"<br>\"+\n \"Finition : \"+finition+\"<br>\"+\n \"Surface : \"+surface+\" m\u00b2<br><br>\"+\n \"<strong>Statut :<\/strong> projet pr\u00eat pour \u00e9tude chantier.\";\n\n toast(\"\u2713 Fiche projet g\u00e9n\u00e9r\u00e9e.\");\n}\n\n\nfunction answer(button,correct){\n\n const parent=\n button.parentElement;\n\n parent.querySelectorAll(\".answer\")\n .forEach(function(btn){\n btn.disabled=true;\n });\n\n if(correct){\n button.classList.add(\"correct\");\n toast(\"\u2713 Bonne r\u00e9ponse.\");\n }else{\n button.classList.add(\"wrong\");\n\n parent.querySelectorAll(\".answer\")\n .forEach(function(btn){\n if(\n btn.getAttribute(\"onclick\")\n .includes(\"true\")\n ){\n btn.classList.add(\"correct\");\n }\n });\n\n toast(\"R\u00e9ponse incorrecte. La bonne r\u00e9ponse est indiqu\u00e9e.\");\n }\n}\n\n\nfunction lancerMission(){\n\n goTo(\"calculateur\");\n\n setTimeout(function(){\n toast(\n \"MISSION OUVERTE \u00b7 Commencez par effectuer le m\u00e9tr\u00e9 de la salle de bain.\"\n );\n },500);\n\n}\n\n\nfunction masterProject(){\n\n toast(\n \"\ud83d\udc51 PROJET HAMMAM MZA ACTIV\u00c9 \u00b7 \u00c9tape 1 : d\u00e9finir le m\u00e9trage et les surfaces \u00e0 traiter.\"\n );\n\n}\n\n\ncalculSurface();\n\n<\/script>\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Atelier Tadelakt MZA \u2014 Prestige Royal \ud83c\uddf2\ud83c\udde6 MZA DESIGN \u00b7 SAVOIR-FAIRE MAROCAIN Atelier Tadelakt Comprendre et ma\u00eetriser l\u2019un des rev\u00eatements embl\u00e9matiques du Maroc : pr\u00e9paration des supports, mati\u00e8re, pigmentation, application, lissage, finition au savon noir et chiffrage complet du chantier. Commencer l\u2019atelier Ouvrir le calculateur Formation professionnelle MZA De la mati\u00e8re brute \u00e0 la finition […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1836","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/pages\/1836","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/comments?post=1836"}],"version-history":[{"count":1,"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/pages\/1836\/revisions"}],"predecessor-version":[{"id":1838,"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/pages\/1836\/revisions\/1838"}],"wp:attachment":[{"href":"https:\/\/maroczain.com\/patrimoine.maroczain.com\/wp-json\/wp\/v2\/media?parent=1836"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}