{"id":1768,"date":"2026-09-06T20:47:43","date_gmt":"2026-09-06T20:47:43","guid":{"rendered":"https:\/\/maroczain.com\/cuisine.maroczain.com\/?page_id=1768"},"modified":"2026-09-06T20:48:34","modified_gmt":"2026-09-06T20:48:34","slug":"culture-marocaine","status":"publish","type":"page","link":"https:\/\/maroczain.com\/cuisine.maroczain.com\/culture-marocaine\/","title":{"rendered":"Culture Marocaine"},"content":{"rendered":"\n<!-- ============================================================\n MAROC ZAIN ACADEMY\n MZA CULTURE MAROCAINE\n PATRIMOINE \u00b7 ARTS \u00b7 SAVOIR-FAIRE \u00b7 TRADITIONS\n VERSION PRESTIGE\n============================================================ -->\n\n<div id=\"mza-culture-maroc\">\n\n<style>\n#mza-culture-maroc,\n#mza-culture-maroc *{\n  box-sizing:border-box;\n}\n\n#mza-culture-maroc{\n  --green:#073b2d;\n  --green2:#0b5943;\n  --red:#8b2031;\n  --gold:#c8a35c;\n  --gold2:#ebd49a;\n  --ivory:#faf6ed;\n  --cream:#eee2cf;\n  --sand:#d8c09a;\n  --ink:#181511;\n  --muted:#746b61;\n  --line:#d8c7a6;\n  --white:#fff;\n  --dark:#10130f;\n\n  width:100%;\n  overflow:hidden;\n  background:var(--ivory);\n  color:var(--ink);\n  font-family:Arial,Helvetica,sans-serif;\n}\n\n#mza-culture-maroc button,\n#mza-culture-maroc input{\n  font:inherit;\n}\n\n#mza-culture-maroc button{\n  cursor:pointer;\n}\n\n#mza-culture-maroc img{\n  display:block;\n  width:100%;\n}\n\n#mza-culture-maroc .wrap{\n  width:min(1360px,calc(100% - 34px));\n  margin:auto;\n}\n\n#mza-culture-maroc .eyebrow{\n  color:#98743a;\n  font-size:9px;\n  line-height:1.5;\n  font-weight:900;\n  letter-spacing:3px;\n  text-transform:uppercase;\n}\n\n#mza-culture-maroc h2{\n  margin:13px 0 22px;\n  color:var(--green);\n  font:400 clamp(44px,6vw,72px)\/.96 Georgia,serif;\n}\n\n#mza-culture-maroc h2 em{\n  display:block;\n  color:var(--red);\n  font-weight:400;\n}\n\n#mza-culture-maroc .gold-line{\n  width:75px;\n  height:1px;\n  margin:24px auto;\n  background:var(--gold);\n}\n\n#mza-culture-maroc .section-head{\n  max-width:900px;\n  margin:0 auto 58px;\n  text-align:center;\n}\n\n#mza-culture-maroc .section-head p{\n  color:var(--muted);\n  line-height:1.8;\n}\n\n\n\/* ============================================================\n HERO\n============================================================ *\/\n\n#mza-culture-maroc .hero{\n  min-height:96vh;\n  position:relative;\n  display:flex;\n  align-items:center;\n  overflow:hidden;\n  background:var(--green);\n  color:#fff;\n}\n\n#mza-culture-maroc .hero-image{\n  position:absolute;\n  inset:0;\n}\n\n#mza-culture-maroc .hero-image img{\n  width:100%;\n  height:100%;\n  object-fit:cover;\n}\n\n#mza-culture-maroc .hero-overlay{\n  position:absolute;\n  inset:0;\n  z-index:2;\n  background:\n    linear-gradient(\n      90deg,\n      rgba(2,22,15,.97) 0%,\n      rgba(2,22,15,.86) 37%,\n      rgba(2,22,15,.35) 69%,\n      rgba(0,0,0,.18) 100%\n    ),\n    linear-gradient(\n      180deg,\n      rgba(0,0,0,.05),\n      rgba(0,0,0,.52)\n    );\n}\n\n#mza-culture-maroc .hero-frame{\n  position:absolute;\n  z-index:3;\n  inset:24px;\n  border:1px solid rgba(235,212,154,.58);\n}\n\n#mza-culture-maroc .hero-frame:after{\n  content:\"\";\n  position:absolute;\n  inset:8px;\n  border:1px solid rgba(235,212,154,.16);\n}\n\n#mza-culture-maroc .hero-copy{\n  width:min(850px,88%);\n  position:relative;\n  z-index:4;\n  margin-left:max(5vw,40px);\n  padding:100px 0;\n}\n\n#mza-culture-maroc .seal{\n  width:105px;\n  height:105px;\n  display:grid;\n  place-items:center;\n  margin-bottom:32px;\n  border:1px solid var(--gold);\n  border-radius:50%;\n  color:var(--gold2);\n  font:20px Georgia,serif;\n  letter-spacing:5px;\n}\n\n#mza-culture-maroc .hero .eyebrow{\n  color:var(--gold2);\n}\n\n#mza-culture-maroc .hero h1{\n  margin:17px 0 24px;\n  font:400 clamp(58px,8.5vw,116px)\/.87 Georgia,serif;\n  letter-spacing:-4px;\n}\n\n#mza-culture-maroc .hero h1 span,\n#mza-culture-maroc .hero h1 em{\n  display:block;\n}\n\n#mza-culture-maroc .hero h1 em{\n  color:var(--gold2);\n  font-weight:400;\n}\n\n#mza-culture-maroc .hero p{\n  max-width:720px;\n  color:rgba(255,255,255,.77);\n  font:17px\/1.8 Georgia,serif;\n}\n\n#mza-culture-maroc .actions{\n  display:flex;\n  flex-wrap:wrap;\n  gap:9px;\n  margin-top:32px;\n}\n\n#mza-culture-maroc .btn-gold,\n#mza-culture-maroc .btn-line,\n#mza-culture-maroc .btn-green{\n  min-height:50px;\n  padding:14px 20px;\n  font-size:9px;\n  font-weight:900;\n  letter-spacing:1.2px;\n}\n\n#mza-culture-maroc .btn-gold{\n  border:1px solid var(--gold);\n  background:var(--gold);\n  color:#20180d;\n}\n\n#mza-culture-maroc .btn-line{\n  border:1px solid var(--gold);\n  background:rgba(0,0,0,.12);\n  color:#fff;\n}\n\n#mza-culture-maroc .btn-green{\n  border:1px solid var(--green);\n  background:var(--green);\n  color:#fff;\n}\n\n\n\/* ============================================================\n NAV\n============================================================ *\/\n\n#mza-culture-maroc .nav{\n  background:#fff;\n  border-bottom:1px solid var(--line);\n}\n\n#mza-culture-maroc .nav .wrap{\n  display:flex;\n  justify-content:center;\n  flex-wrap:wrap;\n}\n\n#mza-culture-maroc .nav button{\n  padding:16px 15px;\n  border:0;\n  background:transparent;\n  color:var(--green);\n  font-size:9px;\n  font-weight:900;\n  letter-spacing:1px;\n}\n\n\n\/* ============================================================\n INTRO\n============================================================ *\/\n\n#mza-culture-maroc .intro{\n  padding:120px 0;\n}\n\n#mza-culture-maroc .intro-grid{\n  display:grid;\n  grid-template-columns:.92fr 1.08fr;\n  gap:85px;\n  align-items:center;\n}\n\n#mza-culture-maroc .intro-photo{\n  height:690px;\n  position:relative;\n  background:var(--green);\n}\n\n#mza-culture-maroc .intro-photo:before{\n  content:\"\";\n  position:absolute;\n  inset:-15px 15px 15px -15px;\n  border:1px solid var(--gold);\n}\n\n#mza-culture-maroc .intro-photo img{\n  height:100%;\n  object-fit:cover;\n  position:relative;\n}\n\n#mza-culture-maroc .chapter{\n  color:rgba(200,163,92,.22);\n  font:110px\/.8 Georgia,serif;\n}\n\n#mza-culture-maroc .intro-copy p{\n  color:var(--muted);\n  line-height:1.9;\n}\n\n#mza-culture-maroc .signature{\n  margin-top:28px;\n  padding-top:22px;\n  border-top:1px solid var(--line);\n  color:var(--green);\n  font:italic 21px Georgia,serif;\n}\n\n\n\/* ============================================================\n 6 GRANDES FAMILLES\n============================================================ *\/\n\n#mza-culture-maroc .families{\n  padding:110px 0;\n  background:var(--green);\n  color:#fff;\n}\n\n#mza-culture-maroc .families h2{\n  color:#fff;\n}\n\n#mza-culture-maroc .families h2 em{\n  color:var(--gold2);\n}\n\n#mza-culture-maroc .families .section-head p{\n  color:rgba(255,255,255,.62);\n}\n\n#mza-culture-maroc .family-grid{\n  display:grid;\n  grid-template-columns:repeat(3,1fr);\n  border-top:1px solid rgba(235,212,154,.27);\n  border-left:1px solid rgba(235,212,154,.27);\n}\n\n#mza-culture-maroc .family{\n  min-height:285px;\n  padding:34px 29px;\n  border-right:1px solid rgba(235,212,154,.27);\n  border-bottom:1px solid rgba(235,212,154,.27);\n}\n\n#mza-culture-maroc .family small{\n  color:var(--gold2);\n  font:19px Georgia,serif;\n}\n\n#mza-culture-maroc .family h3{\n  margin:20px 0 11px;\n  font:400 29px Georgia,serif;\n}\n\n#mza-culture-maroc .family p{\n  color:rgba(255,255,255,.58);\n  font-size:12px;\n  line-height:1.7;\n}\n\n\n\/* ============================================================\n UNIVERS\n============================================================ *\/\n\n#mza-culture-maroc .univers{\n  padding:120px 0;\n  background:var(--cream);\n}\n\n#mza-culture-maroc .controls{\n  display:flex;\n  justify-content:space-between;\n  gap:12px;\n  flex-wrap:wrap;\n  margin-bottom:35px;\n}\n\n#mza-culture-maroc #culture-search{\n  width:min(440px,100%);\n  padding:14px;\n  border:1px solid #ccb98f;\n  background:#fff;\n  outline:none;\n}\n\n#mza-culture-maroc .filters{\n  display:flex;\n  flex-wrap:wrap;\n  gap:7px;\n}\n\n#mza-culture-maroc .filter{\n  padding:11px 13px;\n  border:1px solid #ccb98f;\n  background:#fff;\n  color:var(--green);\n  font-size:9px;\n  font-weight:900;\n}\n\n#mza-culture-maroc .filter.active{\n  background:var(--green);\n  color:#fff;\n  border-color:var(--green);\n}\n\n#mza-culture-maroc .culture-grid{\n  display:grid;\n  grid-template-columns:repeat(4,1fr);\n  gap:14px;\n}\n\n#mza-culture-maroc .culture-card{\n  min-height:365px;\n  overflow:hidden;\n  padding:0;\n  border:1px solid var(--line);\n  background:#fff;\n  text-align:left;\n  transition:.25s;\n}\n\n#mza-culture-maroc .culture-card:hover{\n  transform:translateY(-4px);\n  box-shadow:0 14px 36px rgba(0,0,0,.09);\n}\n\n#mza-culture-maroc .card-image{\n  height:185px;\n  position:relative;\n  overflow:hidden;\n  background:var(--green);\n}\n\n#mza-culture-maroc .card-image img{\n  height:100%;\n  object-fit:cover;\n}\n\n#mza-culture-maroc .card-num{\n  position:absolute;\n  top:14px;\n  left:14px;\n  min-width:38px;\n  height:38px;\n  display:grid;\n  place-items:center;\n  padding:0 8px;\n  background:rgba(5,37,27,.89);\n  color:var(--gold2);\n  font:14px Georgia,serif;\n}\n\n#mza-culture-maroc .card-body{\n  padding:19px;\n}\n\n#mza-culture-maroc .card-category{\n  color:#997239;\n  font-size:8px;\n  font-weight:900;\n  letter-spacing:1.5px;\n}\n\n#mza-culture-maroc .culture-card h3{\n  margin:9px 0;\n  color:var(--green);\n  font:400 22px Georgia,serif;\n}\n\n#mza-culture-maroc .culture-card p{\n  color:var(--muted);\n  font-size:11px;\n  line-height:1.6;\n}\n\n#mza-culture-maroc .discover{\n  display:block;\n  margin-top:13px;\n  color:var(--red);\n  font-size:8px;\n  font-weight:900;\n  letter-spacing:1px;\n}\n\n\n\/* ============================================================\n DETAIL\n============================================================ *\/\n\n#mza-culture-maroc .detail{\n  display:none;\n  grid-template-columns:.85fr 1.15fr;\n  margin:35px 0;\n  border:1px solid var(--gold);\n  background:#fff;\n}\n\n#mza-culture-maroc .detail.show{\n  display:grid;\n}\n\n#mza-culture-maroc .detail-photo{\n  min-height:570px;\n  background:var(--green);\n}\n\n#mza-culture-maroc .detail-photo img{\n  height:100%;\n  min-height:570px;\n  object-fit:cover;\n}\n\n#mza-culture-maroc .detail-copy{\n  position:relative;\n  padding:45px;\n}\n\n#mza-culture-maroc .detail-copy h3{\n  margin:10px 0;\n  color:var(--green);\n  font:400 clamp(37px,5vw,52px) Georgia,serif;\n}\n\n#mza-culture-maroc .detail-copy p{\n  color:var(--muted);\n  line-height:1.8;\n}\n\n#mza-culture-maroc .close{\n  position:absolute;\n  right:13px;\n  top:13px;\n  width:38px;\n  height:38px;\n  border:1px solid var(--line);\n  background:#fff;\n}\n\n#mza-culture-maroc .learning{\n  display:grid;\n  grid-template-columns:1fr 1fr;\n  gap:12px;\n  margin-top:20px;\n}\n\n#mza-culture-maroc .learning-box{\n  padding:17px;\n  background:var(--ivory);\n}\n\n#mza-culture-maroc .learning-box h4{\n  margin:0 0 9px;\n  color:var(--green);\n  font:400 18px Georgia,serif;\n}\n\n#mza-culture-maroc .learning-box ul{\n  margin:0;\n  padding-left:17px;\n  color:var(--muted);\n  font-size:12px;\n  line-height:1.7;\n}\n\n#mza-culture-maroc .masterclass{\n  margin-top:18px;\n  padding:18px;\n  border-left:3px solid var(--gold);\n  background:#f2e7d5;\n  color:var(--muted);\n  line-height:1.65;\n}\n\n\n\/* ============================================================\n REGIONS\n============================================================ *\/\n\n#mza-culture-maroc .regions{\n  padding:115px 0;\n  background:#fff;\n}\n\n#mza-culture-maroc .region-grid{\n  display:grid;\n  grid-template-columns:repeat(4,1fr);\n  gap:12px;\n}\n\n#mza-culture-maroc .region{\n  min-height:210px;\n  padding:27px;\n  border:1px solid var(--line);\n  background:var(--ivory);\n}\n\n#mza-culture-maroc .region strong{\n  color:var(--gold);\n  font:18px Georgia,serif;\n}\n\n#mza-culture-maroc .region h3{\n  margin:15px 0 9px;\n  color:var(--green);\n  font:400 24px Georgia,serif;\n}\n\n#mza-culture-maroc .region p{\n  color:var(--muted);\n  font-size:11px;\n  line-height:1.6;\n}\n\n\n\/* ============================================================\n UNESCO\n============================================================ *\/\n\n#mza-culture-maroc .heritage{\n  padding:115px 0;\n  background:var(--dark);\n  color:#fff;\n}\n\n#mza-culture-maroc .heritage h2{\n  color:#fff;\n}\n\n#mza-culture-maroc .heritage h2 em{\n  color:var(--gold2);\n}\n\n#mza-culture-maroc .heritage .section-head p{\n  color:rgba(255,255,255,.61);\n}\n\n#mza-culture-maroc .heritage-grid{\n  display:grid;\n  grid-template-columns:repeat(4,1fr);\n  gap:12px;\n}\n\n#mza-culture-maroc .heritage-card{\n  min-height:215px;\n  padding:28px;\n  border:1px solid rgba(235,212,154,.28);\n}\n\n#mza-culture-maroc .heritage-card small{\n  color:var(--gold2);\n}\n\n#mza-culture-maroc .heritage-card h3{\n  margin:13px 0 9px;\n  font:400 24px Georgia,serif;\n}\n\n#mza-culture-maroc .heritage-card p{\n  color:rgba(255,255,255,.56);\n  font-size:11px;\n  line-height:1.6;\n}\n\n\n\/* ============================================================\n FINAL\n============================================================ *\/\n\n#mza-culture-maroc .final{\n  padding:125px 0;\n  background:var(--green);\n  color:#fff;\n}\n\n#mza-culture-maroc .final-box{\n  max-width:1050px;\n  position:relative;\n  margin:auto;\n  padding:75px 45px;\n  border:1px solid var(--gold);\n  text-align:center;\n}\n\n#mza-culture-maroc .final-box:after{\n  content:\"\";\n  position:absolute;\n  inset:8px;\n  border:1px solid rgba(235,212,154,.23);\n}\n\n#mza-culture-maroc .final-box>*{\n  position:relative;\n  z-index:2;\n}\n\n#mza-culture-maroc .final .eyebrow{\n  color:var(--gold2);\n}\n\n#mza-culture-maroc .final h2{\n  color:#fff;\n}\n\n#mza-culture-maroc .final h2 em{\n  color:var(--gold2);\n}\n\n#mza-culture-maroc .final p{\n  max-width:760px;\n  margin:auto;\n  color:rgba(255,255,255,.68);\n  line-height:1.8;\n}\n\n#mza-culture-maroc .final-grid{\n  display:grid;\n  grid-template-columns:repeat(4,1fr);\n  margin:38px 0;\n  border-top:1px solid rgba(235,212,154,.25);\n  border-bottom:1px solid rgba(235,212,154,.25);\n}\n\n#mza-culture-maroc .final-grid div{\n  padding:22px 8px;\n  border-right:1px solid rgba(235,212,154,.25);\n}\n\n#mza-culture-maroc .final-grid div:last-child{\n  border-right:0;\n}\n\n#mza-culture-maroc .final-grid strong{\n  display:block;\n  color:var(--gold2);\n  font:31px Georgia,serif;\n}\n\n#mza-culture-maroc .final-grid span{\n  color:rgba(255,255,255,.49);\n  font-size:8px;\n}\n\n\n\/* ============================================================\n RESPONSIVE\n============================================================ *\/\n\n@media(max-width:1100px){\n\n  #mza-culture-maroc .culture-grid,\n  #mza-culture-maroc .region-grid,\n  #mza-culture-maroc .heritage-grid{\n    grid-template-columns:repeat(3,1fr);\n  }\n\n}\n\n@media(max-width:900px){\n\n  #mza-culture-maroc .intro-grid,\n  #mza-culture-maroc .detail.show{\n    grid-template-columns:1fr;\n  }\n\n  #mza-culture-maroc .family-grid{\n    grid-template-columns:repeat(2,1fr);\n  }\n\n  #mza-culture-maroc .culture-grid,\n  #mza-culture-maroc .region-grid,\n  #mza-culture-maroc .heritage-grid{\n    grid-template-columns:repeat(2,1fr);\n  }\n\n}\n\n@media(max-width:650px){\n\n  #mza-culture-maroc .hero-copy{\n    margin:auto;\n  }\n\n  #mza-culture-maroc .hero h1{\n    letter-spacing:-1px;\n  }\n\n  #mza-culture-maroc .family-grid,\n  #mza-culture-maroc .culture-grid,\n  #mza-culture-maroc .region-grid,\n  #mza-culture-maroc .heritage-grid,\n  #mza-culture-maroc .learning,\n  #mza-culture-maroc .final-grid{\n    grid-template-columns:1fr;\n  }\n\n  #mza-culture-maroc .intro-photo{\n    height:520px;\n  }\n\n}\n<\/style>\n\n\n<!-- ============================================================\n HERO\n============================================================ -->\n\n<section class=\"hero\">\n\n  <div class=\"hero-image\">\n\n    <img decoding=\"async\"\n      src=\"https:\/\/commons.wikimedia.org\/wiki\/Special:Redirect\/file\/161-MoroccoDoorBahia.jpg\"\n      alt=\"Patrimoine architectural marocain\">\n\n  <\/div>\n\n  <div class=\"hero-overlay\"><\/div>\n  <div class=\"hero-frame\"><\/div>\n\n  <div class=\"hero-copy\">\n\n    <div class=\"seal\">MZA<\/div>\n\n    <div class=\"eyebrow\">\n      MAROC ZAIN ACADEMY \u00b7 PATRIMOINE &#038; ARTS DU MAROC\n    <\/div>\n\n    <h1>\n      <span>Culture<\/span>\n      <em>Marocaine<\/em>\n    <\/h1>\n\n    <p>\n      Artisanat, architecture, musique, v\u00eatements,\n      gastronomie, art de vivre, traditions,\n      terroirs et patrimoine oral :\n      explorer le Maroc \u00e0 travers ses savoir-faire vivants.\n    <\/p>\n\n    <div class=\"actions\">\n\n      <button\n        type=\"button\"\n        class=\"btn-gold\"\n        data-scroll=\"mza-culture-univers\">\n        EXPLORER LES UNIVERS\n      <\/button>\n\n      <button\n        type=\"button\"\n        class=\"btn-line\"\n        data-scroll=\"mza-culture-regions\">\n        VOYAGE \u00c0 TRAVERS LE MAROC\n      <\/button>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n NAV\n============================================================ -->\n\n<nav class=\"nav\">\n\n  <div class=\"wrap\">\n\n    <button type=\"button\" data-scroll=\"mza-culture-intro\">\n      LA COLLECTION\n    <\/button>\n\n    <button type=\"button\" data-scroll=\"mza-culture-families\">\n      6 PILIERS\n    <\/button>\n\n    <button type=\"button\" data-scroll=\"mza-culture-univers\">\n      24 UNIVERS\n    <\/button>\n\n    <button type=\"button\" data-scroll=\"mza-culture-regions\">\n      R\u00c9GIONS\n    <\/button>\n\n    <button type=\"button\" data-scroll=\"mza-culture-heritage\">\n      PATRIMOINE VIVANT\n    <\/button>\n\n    <button type=\"button\" data-scroll=\"mza-culture-final\">\n      PARCOURS MZA\n    <\/button>\n\n  <\/div>\n\n<\/nav>\n\n\n<!-- ============================================================\n INTRO\n============================================================ -->\n\n<section class=\"intro\" id=\"mza-culture-intro\">\n\n  <div class=\"wrap intro-grid\">\n\n    <div class=\"intro-photo\">\n\n      <img decoding=\"async\"\n        src=\"https:\/\/commons.wikimedia.org\/wiki\/Special:Redirect\/file\/Zellij artisan in F\u00e8s, Morocco 2016.jpg\"\n        alt=\"Artisan zellige \u00e0 F\u00e8s\">\n\n    <\/div>\n\n    <div class=\"intro-copy\">\n\n      <div class=\"chapter\">01<\/div>\n\n      <div class=\"eyebrow\">\n        UN PATRIMOINE VIVANT\n      <\/div>\n\n      <h2>\n        Comprendre le Maroc\n        <em>par ses gestes.<\/em>\n      <\/h2>\n\n      <p>\n        La culture marocaine ne se r\u00e9sume pas aux monuments.\n        Elle vit dans les ateliers, les cuisines,\n        les maisons, les places, les f\u00eates,\n        la musique et les gestes transmis\n        d&#8217;une g\u00e9n\u00e9ration \u00e0 l&#8217;autre.\n      <\/p>\n\n      <p>\n        MZA Culture Marocaine a pour vocation de transformer\n        ce patrimoine en parcours de d\u00e9couverte,\n        en ateliers p\u00e9dagogiques et en Master Classes.\n      <\/p>\n\n      <div class=\"signature\">\n        MAROC ZAIN ACADEMY \u00b7 Le Maroc comme grande \u00e9cole\n      <\/div>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n SIX PILIERS\n============================================================ -->\n\n<section class=\"families\" id=\"mza-culture-families\">\n\n  <div class=\"wrap\">\n\n    <header class=\"section-head\">\n\n      <div class=\"eyebrow\">\n        MZA CULTURE MAROCAINE\n      <\/div>\n\n      <h2>\n        Six Grands Piliers\n        <em>du patrimoine<\/em>\n      <\/h2>\n\n      <div class=\"gold-line\"><\/div>\n\n      <p>\n        Une lecture transversale de la richesse culturelle marocaine.\n      <\/p>\n\n    <\/header>\n\n\n    <div class=\"family-grid\">\n\n      <article class=\"family\">\n        <small>I<\/small>\n        <h3>Arts &#038; Artisanat<\/h3>\n        <p>\n          Zellige, bois, pl\u00e2tre, cuir, cuivre,\n          poterie, tapis, bijoux et broderies.\n        <\/p>\n      <\/article>\n\n      <article class=\"family\">\n        <small>II<\/small>\n        <h3>V\u00eatement &#038; Parure<\/h3>\n        <p>\n          Caftan, djellaba, babouches,\n          bijoux, broderies et ornements.\n        <\/p>\n      <\/article>\n\n      <article class=\"family\">\n        <small>III<\/small>\n        <h3>Musique &#038; Arts Vivants<\/h3>\n        <p>\n          Gnawa, Malhoun, Andalou,\n          A\u00efta, Ahidous, Ahwach et Cha\u00e2bi.\n        <\/p>\n      <\/article>\n\n      <article class=\"family\">\n        <small>IV<\/small>\n        <h3>Architecture &#038; Habitat<\/h3>\n        <p>\n          Riads, m\u00e9dinas, kasbahs,\n          ksour, patios, jardins et d\u00e9coration.\n        <\/p>\n      <\/article>\n\n      <article class=\"family\">\n        <small>V<\/small>\n        <h3>Art de Vivre<\/h3>\n        <p>\n          Cuisine, p\u00e2tisserie, th\u00e9,\n          hospitalit\u00e9, hammam et c\u00e9r\u00e9monies.\n        <\/p>\n      <\/article>\n\n      <article class=\"family\">\n        <small>VI<\/small>\n        <h3>Traditions &#038; Terroirs<\/h3>\n        <p>\n          Tbourida, moussems, contes,\n          produits du terroir et cultures r\u00e9gionales.\n        <\/p>\n      <\/article>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n UNIVERS\n============================================================ -->\n\n<section class=\"univers\" id=\"mza-culture-univers\">\n\n  <div class=\"wrap\">\n\n    <header class=\"section-head\">\n\n      <div class=\"eyebrow\">\n        COLLECTION MZA \u00b7 CULTURE MAROCAINE\n      <\/div>\n\n      <h2>\n        24 Univers\n        <em>\u00e0 explorer<\/em>\n      <\/h2>\n\n      <div class=\"gold-line\"><\/div>\n\n      <p>\n        Chaque univers pourra devenir sa propre Master Class MZA.\n      <\/p>\n\n    <\/header>\n\n\n    <div class=\"controls\">\n\n      <input\n        type=\"search\"\n        id=\"culture-search\"\n        placeholder=\"Rechercher : zellige, musique, tajine, tapis\u2026\">\n\n      <div class=\"filters\">\n\n        <button type=\"button\" class=\"filter active\" data-cat=\"all\">\n          TOUS\n        <\/button>\n\n        <button type=\"button\" class=\"filter\" data-cat=\"artisanat\">\n          ARTISANAT\n        <\/button>\n\n        <button type=\"button\" class=\"filter\" data-cat=\"arts\">\n          ARTS VIVANTS\n        <\/button>\n\n        <button type=\"button\" class=\"filter\" data-cat=\"architecture\">\n          ARCHITECTURE\n        <\/button>\n\n        <button type=\"button\" class=\"filter\" data-cat=\"artdevivre\">\n          ART DE VIVRE\n        <\/button>\n\n        <button type=\"button\" class=\"filter\" data-cat=\"traditions\">\n          TRADITIONS\n        <\/button>\n\n      <\/div>\n\n    <\/div>\n\n\n    <div id=\"culture-detail\" class=\"detail\"><\/div>\n\n    <div id=\"culture-grid\" class=\"culture-grid\"><\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n REGIONS\n============================================================ -->\n\n<section class=\"regions\" id=\"mza-culture-regions\">\n\n  <div class=\"wrap\">\n\n    <header class=\"section-head\">\n\n      <div class=\"eyebrow\">\n        LE MAROC PAR SES TERRITOIRES\n      <\/div>\n\n      <h2>\n        Cultures\n        <em>r\u00e9gionales<\/em>\n      <\/h2>\n\n      <div class=\"gold-line\"><\/div>\n\n    <\/header>\n\n\n    <div class=\"region-grid\">\n\n      <article class=\"region\">\n        <strong>01<\/strong>\n        <h3>F\u00e8s &#038; Mekn\u00e8s<\/h3>\n        <p>\n          Zellige, broderie, gastronomie,\n          m\u00e9dina, musique arabo-andalouse et m\u00e9tiers d&#8217;art.\n        <\/p>\n      <\/article>\n\n      <article class=\"region\">\n        <strong>02<\/strong>\n        <h3>Rabat &#038; Sal\u00e9<\/h3>\n        <p>\n          Broderie, architecture,\n          musique andalouse et h\u00e9ritages urbains.\n        <\/p>\n      <\/article>\n\n      <article class=\"region\">\n        <strong>03<\/strong>\n        <h3>Marrakech<\/h3>\n        <p>\n          Tanjia, artisanat,\n          jardins, m\u00e9dina et Dakka Marrakchia.\n        <\/p>\n      <\/article>\n\n      <article class=\"region\">\n        <strong>04<\/strong>\n        <h3>T\u00e9touan &#038; Nord<\/h3>\n        <p>\n          H\u00e9ritages andalous,\n          broderies et traditions m\u00e9diterran\u00e9ennes.\n        <\/p>\n      <\/article>\n\n      <article class=\"region\">\n        <strong>05<\/strong>\n        <h3>Essaouira<\/h3>\n        <p>\n          Gnawa, bois de thuya,\n          culture portuaire et arts.\n        <\/p>\n      <\/article>\n\n      <article class=\"region\">\n        <strong>06<\/strong>\n        <h3>Souss<\/h3>\n        <p>\n          Argan, amlou,\n          Ahwach et traditions amazighes.\n        <\/p>\n      <\/article>\n\n      <article class=\"region\">\n        <strong>07<\/strong>\n        <h3>Atlas<\/h3>\n        <p>\n          Tapis, architecture de terre,\n          Ahidous et cultures montagnardes.\n        <\/p>\n      <\/article>\n\n      <article class=\"region\">\n        <strong>08<\/strong>\n        <h3>Sahara Marocain<\/h3>\n        <p>\n          Po\u00e9sie, hospitalit\u00e9,\n          th\u00e9, musique et traditions sahariennes.\n        <\/p>\n      <\/article>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n PATRIMOINE VIVANT\n============================================================ -->\n\n<section class=\"heritage\" id=\"mza-culture-heritage\">\n\n  <div class=\"wrap\">\n\n    <header class=\"section-head\">\n\n      <div class=\"eyebrow\">\n        PATRIMOINE CULTUREL IMMAT\u00c9RIEL\n      <\/div>\n\n      <h2>\n        Des traditions\n        <em>toujours vivantes<\/em>\n      <\/h2>\n\n      <div class=\"gold-line\"><\/div>\n\n      <p>\n        Quelques grands rep\u00e8res du patrimoine culturel marocain.\n      <\/p>\n\n    <\/header>\n\n\n    <div class=\"heritage-grid\">\n\n      <article class=\"heritage-card\">\n        <small>2019<\/small>\n        <h3>Gnawa<\/h3>\n        <p>\n          Musique, pratiques,\n          performances et traditions communautaires.\n        <\/p>\n      <\/article>\n\n      <article class=\"heritage-card\">\n        <small>2020<\/small>\n        <h3>Couscous<\/h3>\n        <p>\n          Savoirs, savoir-faire\n          et pratiques li\u00e9s \u00e0 sa pr\u00e9paration et sa consommation.\n        <\/p>\n      <\/article>\n\n      <article class=\"heritage-card\">\n        <small>2021<\/small>\n        <h3>Tbourida<\/h3>\n        <p>\n          Art \u00e9questre collectif\n          et repr\u00e9sentation traditionnelle.\n        <\/p>\n      <\/article>\n\n      <article class=\"heritage-card\">\n        <small>2021<\/small>\n        <h3>Calligraphie Arabe<\/h3>\n        <p>\n          Connaissances,\n          comp\u00e9tences et pratiques artistiques.\n        <\/p>\n      <\/article>\n\n      <article class=\"heritage-card\">\n        <small>2023<\/small>\n        <h3>Malhoun<\/h3>\n        <p>\n          Art po\u00e9tique et musical\n          enracin\u00e9 dans la culture urbaine marocaine.\n        <\/p>\n      <\/article>\n\n      <article class=\"heritage-card\">\n        <small>2023<\/small>\n        <h3>Gravure sur M\u00e9taux<\/h3>\n        <p>\n          Savoir-faire li\u00e9s \u00e0 l&#8217;or,\n          l&#8217;argent et le cuivre.\n        <\/p>\n      <\/article>\n\n      <article class=\"heritage-card\">\n        <small>2024<\/small>\n        <h3>Henn\u00e9<\/h3>\n        <p>\n          Rituels,\n          pratiques esth\u00e9tiques et sociales.\n        <\/p>\n      <\/article>\n\n      <article class=\"heritage-card\">\n        <small>2025<\/small>\n        <h3>Caftan Marocain<\/h3>\n        <p>\n          Arts, traditions\n          et savoir-faire associ\u00e9s au caftan marocain.\n        <\/p>\n      <\/article>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n FINAL\n============================================================ -->\n\n<section class=\"final\" id=\"mza-culture-final\">\n\n  <div class=\"wrap\">\n\n    <div class=\"final-box\">\n\n      <div class=\"eyebrow\">\n        GRAND PARCOURS MZA \u00b7 CULTURE MAROCAINE\n      <\/div>\n\n      <h2>\n        Le Maroc\n        <em>de A \u00e0 Z<\/em>\n      <\/h2>\n\n      <p>\n        Une biblioth\u00e8que culturelle \u00e9volutive r\u00e9unissant\n        Master Classes, ateliers, fiches patrimoine,\n        cartes r\u00e9gionales, quiz et parcours de d\u00e9couverte.\n      <\/p>\n\n\n      <div class=\"final-grid\">\n\n        <div>\n          <strong>24<\/strong>\n          <span>UNIVERS<\/span>\n        <\/div>\n\n        <div>\n          <strong>8<\/strong>\n          <span>TERRITOIRES<\/span>\n        <\/div>\n\n        <div>\n          <strong>6<\/strong>\n          <span>GRANDS PILIERS<\/span>\n        <\/div>\n\n        <div>\n          <strong>1<\/strong>\n          <span>COLLECTION MZA<\/span>\n        <\/div>\n\n      <\/div>\n\n\n      <button\n        type=\"button\"\n        class=\"btn-gold\"\n        id=\"culture-start\">\n        COMMENCER L&#8217;EXPLORATION\n      <\/button>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<script>\n(function(){\n\n\"use strict\";\n\n\nconst IMG={\n\n  zellige:\n  \"https:\/\/commons.wikimedia.org\/wiki\/Special:Redirect\/file\/Zellij artisan in F\u00e8s, Morocco 2016.jpg\",\n\n  zellige2:\n  \"https:\/\/commons.wikimedia.org\/wiki\/Special:Redirect\/file\/\u0627\u0644\u0632\u0644\u064a\u062c \u0628\u0627\u0644\u0641\u0633\u064a\u0641\u0633\u0627\u0621 \u0627\u0644\u062a\u0642\u0644\u064a\u062f\u064a \u0627\u0644\u0645\u063a\u0631\u0628\u064a.jpg\",\n\n  gnawa:\n  \"https:\/\/commons.wikimedia.org\/wiki\/Special:Redirect\/file\/Les Gnaoua du Maroc par Brutus Art.jpg\",\n\n  tbourida:\n  \"https:\/\/commons.wikimedia.org\/wiki\/Special:Redirect\/file\/Tbourida.jpg\",\n\n  bahia:\n  \"https:\/\/commons.wikimedia.org\/wiki\/Special:Redirect\/file\/161-MoroccoDoorBahia.jpg\",\n\n  jemaa:\n  \"https:\/\/commons.wikimedia.org\/wiki\/Special:Redirect\/file\/Jamaa-fna.jpg\",\n\n  default:\n  \"https:\/\/commons.wikimedia.org\/wiki\/Special:Redirect\/file\/Zellij artisan in F\u00e8s, Morocco 2016.jpg\"\n\n};\n\n\n\/* ============================================================\n 24 UNIVERS\n============================================================ *\/\n\nconst DATA=[\n\n{\n id:1,\n cat:\"artisanat\",\n title:\"Zellige Marocain\",\n img:IMG.zellige,\n desc:\"De la terre cuite \u00e0 la composition g\u00e9om\u00e9trique.\",\n learn:[\n   \"Comprendre la fabrication du carreau\",\n   \"D\u00e9couvrir la d\u00e9coupe traditionnelle\",\n   \"Lire les motifs g\u00e9om\u00e9triques\",\n   \"Comprendre l'assemblage\"\n ],\n master:\"MASTER CLASS MZA \u00b7 ZELLIGE \u2014 de l'atelier de F\u00e8s \u00e0 la composition d\u00e9corative.\"\n},\n\n{\n id:2,\n cat:\"artisanat\",\n title:\"Tadelakt\",\n img:IMG.bahia,\n desc:\"Enduits traditionnels, mati\u00e8re, finition et architecture.\",\n learn:[\n   \"Origines et usages\",\n   \"Supports\",\n   \"Application\",\n   \"Finition\"\n ],\n master:\"MASTER CLASS MZA \u00b7 TADELAKT & ENDUITS TRADITIONNELS.\"\n},\n\n{\n id:3,\n cat:\"artisanat\",\n title:\"Pl\u00e2tre Sculpt\u00e9\",\n img:IMG.bahia,\n desc:\"D\u00e9cor architectural, motifs et savoir-faire.\",\n learn:[\n   \"Motifs\",\n   \"Composition\",\n   \"Outils\",\n   \"Finition\"\n ],\n master:\"MASTER CLASS MZA \u00b7 PL\u00c2TRE SCULPT\u00c9 MAROCAIN.\"\n},\n\n{\n id:4,\n cat:\"artisanat\",\n title:\"Bois Sculpt\u00e9\",\n img:IMG.bahia,\n desc:\"C\u00e8dre, thuya, portes, plafonds et mobilier.\",\n learn:[\n   \"Essences\",\n   \"Tra\u00e7age\",\n   \"Sculpture\",\n   \"Finition\"\n ],\n master:\"MASTER CLASS MZA \u00b7 BOIS D'ART MAROCAIN.\"\n},\n\n{\n id:5,\n cat:\"artisanat\",\n title:\"Dinanderie & Cuivre\",\n img:IMG.default,\n desc:\"Plateaux, lanternes, gravure et objets d\u00e9coratifs.\",\n learn:[\n   \"M\u00e9taux\",\n   \"Martelage\",\n   \"Gravure\",\n   \"Polissage\"\n ],\n master:\"MASTER CLASS MZA \u00b7 DINANDERIE & GRAVURE.\"\n},\n\n{\n id:6,\n cat:\"artisanat\",\n title:\"Poterie Marocaine\",\n img:IMG.zellige2,\n desc:\"Terre, fa\u00e7onnage, d\u00e9cor et cuisson.\",\n learn:[\n   \"Argiles\",\n   \"Modelage\",\n   \"D\u00e9coration\",\n   \"Cuisson\"\n ],\n master:\"MASTER CLASS MZA \u00b7 POTERIE & C\u00c9RAMIQUE.\"\n},\n\n{\n id:7,\n cat:\"artisanat\",\n title:\"Tapis Marocain\",\n img:IMG.default,\n desc:\"Tissage, motifs, symboles et traditions r\u00e9gionales.\",\n learn:[\n   \"Laine\",\n   \"M\u00e9tier \u00e0 tisser\",\n   \"Motifs\",\n   \"R\u00e9gions\"\n ],\n master:\"MASTER CLASS MZA \u00b7 TAPIS DU MAROC.\"\n},\n\n{\n id:8,\n cat:\"artisanat\",\n title:\"Cuir & Maroquinerie\",\n img:IMG.default,\n desc:\"Babouches, sacs et m\u00e9tiers traditionnels du cuir.\",\n learn:[\n   \"Peaux\",\n   \"D\u00e9coupe\",\n   \"Assemblage\",\n   \"Finition\"\n ],\n master:\"MASTER CLASS MZA \u00b7 CUIR MAROCAIN.\"\n},\n\n{\n id:9,\n cat:\"artisanat\",\n title:\"Bijoux Marocains\",\n img:IMG.default,\n desc:\"Argent, or, symboles, filigrane et parures r\u00e9gionales.\",\n learn:[\n   \"M\u00e9taux\",\n   \"Formes\",\n   \"Techniques\",\n   \"Patrimoine r\u00e9gional\"\n ],\n master:\"MASTER CLASS MZA \u00b7 BIJOUX & PARURES.\"\n},\n\n{\n id:10,\n cat:\"arts\",\n title:\"Gnawa\",\n img:IMG.gnawa,\n desc:\"Musique, instruments, rythmes et traditions.\",\n learn:[\n   \"Guembri\",\n   \"Qraqeb\",\n   \"Rythmes\",\n   \"Transmission\"\n ],\n master:\"MASTER CLASS MZA \u00b7 UNIVERS GNAWA.\"\n},\n\n{\n id:11,\n cat:\"arts\",\n title:\"Malhoun\",\n img:IMG.gnawa,\n desc:\"Po\u00e9sie populaire et art musical marocain.\",\n learn:[\n   \"Qasida\",\n   \"Po\u00e9sie\",\n   \"Interpr\u00e9tation\",\n   \"R\u00e9pertoire\"\n ],\n master:\"MASTER CLASS MZA \u00b7 MALHOUN.\"\n},\n\n{\n id:12,\n cat:\"arts\",\n title:\"Musique Andalouse\",\n img:IMG.gnawa,\n desc:\"R\u00e9pertoire savant, noubas et instruments.\",\n learn:[\n   \"Histoire\",\n   \"Noubas\",\n   \"Instruments\",\n   \"\u00c9coute\"\n ],\n master:\"MASTER CLASS MZA \u00b7 MUSIQUE ARABO-ANDALOUSE.\"\n},\n\n{\n id:13,\n cat:\"arts\",\n title:\"A\u00efta & Cha\u00e2bi\",\n img:IMG.gnawa,\n desc:\"Chant populaire, rythmes et traditions r\u00e9gionales.\",\n learn:[\n   \"Styles\",\n   \"Rythmes\",\n   \"Voix\",\n   \"R\u00e9pertoires\"\n ],\n master:\"MASTER CLASS MZA \u00b7 A\u00cfTA & CHA\u00c2BI.\"\n},\n\n{\n id:14,\n cat:\"arts\",\n title:\"Ahidous & Ahwach\",\n img:IMG.gnawa,\n desc:\"Po\u00e9sie, chant, danse et expression collective amazighe.\",\n learn:[\n   \"Rythme\",\n   \"Danse\",\n   \"Po\u00e9sie\",\n   \"Transmission\"\n ],\n master:\"MASTER CLASS MZA \u00b7 ARTS COLLECTIFS AMAZIGHS.\"\n},\n\n{\n id:15,\n cat:\"architecture\",\n title:\"Riad Marocain\",\n img:IMG.bahia,\n desc:\"Patio, jardin, lumi\u00e8re et organisation domestique.\",\n learn:[\n   \"Patio\",\n   \"Eau\",\n   \"D\u00e9cor\",\n   \"Circulation\"\n ],\n master:\"MASTER CLASS MZA \u00b7 ARCHITECTURE DU RIAD.\"\n},\n\n{\n id:16,\n cat:\"architecture\",\n title:\"Kasbahs & Ksour\",\n img:IMG.bahia,\n desc:\"Architecture de terre et habitats fortifi\u00e9s.\",\n learn:[\n   \"Terre\",\n   \"Structure\",\n   \"Organisation\",\n   \"Conservation\"\n ],\n master:\"MASTER CLASS MZA \u00b7 KASBAHS & KSOUR.\"\n},\n\n{\n id:17,\n cat:\"architecture\",\n title:\"M\u00e9dinas du Maroc\",\n img:IMG.jemaa,\n desc:\"Souks, fondouks, ruelles et organisation urbaine.\",\n learn:[\n   \"Quartiers\",\n   \"Souks\",\n   \"M\u00e9tiers\",\n   \"Patrimoine\"\n ],\n master:\"MASTER CLASS MZA \u00b7 M\u00c9DINAS DU MAROC.\"\n},\n\n{\n id:18,\n cat:\"artdevivre\",\n title:\"Art du Th\u00e9 Marocain\",\n img:IMG.default,\n desc:\"Th\u00e9, menthe, service et hospitalit\u00e9.\",\n learn:[\n   \"Th\u00e9\",\n   \"Menthe\",\n   \"Gestuelle\",\n   \"Service\"\n ],\n master:\"MASTER CLASS MZA \u00b7 TH\u00c9 & HOSPITALIT\u00c9.\"\n},\n\n{\n id:19,\n cat:\"artdevivre\",\n title:\"Cuisine Marocaine\",\n img:IMG.default,\n desc:\"Tajines, couscous, pastilla et cuisines r\u00e9gionales.\",\n learn:[\n   \"Produits\",\n   \"Techniques\",\n   \"\u00c9pices\",\n   \"Service\"\n ],\n master:\"MASTER CLASS CUISINE MZA.\"\n},\n\n{\n id:20,\n cat:\"artdevivre\",\n title:\"P\u00e2tisserie Marocaine\",\n img:IMG.default,\n desc:\"Cornes de gazelle, chebakia, briouates et art du plateau.\",\n learn:[\n   \"P\u00e2tes\",\n   \"Amandes\",\n   \"Miel\",\n   \"Pr\u00e9sentation\"\n ],\n master:\"MZA P\u00c2TISSERIE MAROCAINE \u00b7 ROYAL PRO MAX.\"\n},\n\n{\n id:21,\n cat:\"artdevivre\",\n title:\"Hammam Traditionnel\",\n img:IMG.bahia,\n desc:\"Architecture, gestes et art du soin traditionnel.\",\n learn:[\n   \"Espaces\",\n   \"Rituel\",\n   \"Produits\",\n   \"Hospitalit\u00e9\"\n ],\n master:\"MASTER CLASS MZA \u00b7 HAMMAM & ART DU SOIN.\"\n},\n\n{\n id:22,\n cat:\"traditions\",\n title:\"Tbourida\",\n img:IMG.tbourida,\n desc:\"Cheval, troupe, synchronisation et patrimoine \u00e9questre.\",\n learn:[\n   \"Histoire\",\n   \"Cheval\",\n   \"Troupe\",\n   \"Synchronisation\"\n ],\n master:\"MASTER CLASS MZA \u00b7 TBOURIDA & PATRIMOINE \u00c9QUESTRE.\"\n},\n\n{\n id:23,\n cat:\"traditions\",\n title:\"Mariage Marocain\",\n img:IMG.bahia,\n desc:\"Tenues, c\u00e9r\u00e9monial, musique, gastronomie et traditions.\",\n learn:[\n   \"C\u00e9r\u00e9monies\",\n   \"Tenues\",\n   \"Musique\",\n   \"Hospitalit\u00e9\"\n ],\n master:\"MASTER CLASS MZA \u00b7 C\u00c9R\u00c9MONIAL DU MARIAGE MAROCAIN.\"\n},\n\n{\n id:24,\n cat:\"traditions\",\n title:\"Terroirs du Maroc\",\n img:IMG.default,\n desc:\"Argan, safran, miel, dattes, huile d'olive et amlou.\",\n learn:[\n   \"Produits\",\n   \"R\u00e9gions\",\n   \"Savoir-faire\",\n   \"Valorisation\"\n ],\n master:\"MASTER CLASS MZA \u00b7 TERROIRS & PRODUITS DU MAROC.\"\n}\n\n];\n\n\nlet activeCat=\"all\";\n\n\nfunction render(){\n\n const q=\n document.getElementById(\"culture-search\")\n .value\n .toLowerCase()\n .trim();\n\n\n const list=DATA.filter(function(x){\n\n   const catOK=\n   activeCat===\"all\" ||\n   x.cat===activeCat;\n\n   const searchOK=\n   !q ||\n   (\n     x.title+\" \"+x.desc+\" \"+x.master\n   )\n   .toLowerCase()\n   .includes(q);\n\n   return catOK && searchOK;\n\n });\n\n\n document.getElementById(\n   \"culture-grid\"\n ).innerHTML=\n list.map(function(x){\n\n   return`\n\n   <button\n     type=\"button\"\n     class=\"culture-card\"\n     data-culture=\"${x.id}\">\n\n     <div class=\"card-image\">\n\n       <img decoding=\"async\"\n         loading=\"lazy\"\n         src=\"${x.img}\"\n         alt=\"${x.title}\">\n\n       <span class=\"card-num\">\n         ${String(x.id).padStart(2,\"0\")}\n       <\/span>\n\n     <\/div>\n\n     <div class=\"card-body\">\n\n       <span class=\"card-category\">\n         ${x.cat.toUpperCase()}\n       <\/span>\n\n       <h3>${x.title}<\/h3>\n\n       <p>${x.desc}<\/p>\n\n       <span class=\"discover\">\n         D\u00c9COUVRIR L'UNIVERS \u2192\n       <\/span>\n\n     <\/div>\n\n   <\/button>\n\n   `;\n\n }).join(\"\");\n\n\n document.querySelectorAll(\n   \"#mza-culture-maroc [data-culture]\"\n ).forEach(function(btn){\n\n   btn.onclick=function(){\n\n     openDetail(\n       Number(btn.dataset.culture)\n     );\n\n   };\n\n });\n\n}\n\n\n\/* ============================================================\n DETAIL\n============================================================ *\/\n\nfunction openDetail(id){\n\n const x=\n DATA.find(function(item){\n   return item.id===id;\n });\n\n if(!x){\n   return;\n }\n\n\n const d=\n document.getElementById(\n   \"culture-detail\"\n );\n\n\n d.innerHTML=`\n\n <div class=\"detail-photo\">\n\n   <img decoding=\"async\"\n     src=\"${x.img}\"\n     alt=\"${x.title}\">\n\n <\/div>\n\n\n <div class=\"detail-copy\">\n\n   <button\n     type=\"button\"\n     class=\"close\"\n     id=\"culture-close\">\n     \u00d7\n   <\/button>\n\n\n   <div class=\"eyebrow\">\n     UNIVERS ${String(x.id).padStart(2,\"0\")}\n   <\/div>\n\n\n   <h3>\n     ${x.title}\n   <\/h3>\n\n\n   <p>\n     ${x.desc}\n   <\/p>\n\n\n   <div class=\"learning\">\n\n     <div class=\"learning-box\">\n\n       <h4>\n         D\u00e9couvrir\n       <\/h4>\n\n       <ul>\n\n       ${\n         x.learn.map(function(y){\n           return\"<li>\"+y+\"<\/li>\";\n         }).join(\"\")\n       }\n\n       <\/ul>\n\n     <\/div>\n\n\n     <div class=\"learning-box\">\n\n       <h4>\n         Parcours MZA\n       <\/h4>\n\n       <ul>\n         <li>Histoire & patrimoine<\/li>\n         <li>Gestes & techniques<\/li>\n         <li>Atelier pratique<\/li>\n         <li>Projet final<\/li>\n       <\/ul>\n\n     <\/div>\n\n   <\/div>\n\n\n   <div class=\"masterclass\">\n\n     <strong>\n       PROCHAINE MASTER CLASS\n     <\/strong>\n\n     <br><br>\n\n     ${x.master}\n\n   <\/div>\n\n <\/div>\n\n `;\n\n\n d.classList.add(\"show\");\n\n\n d.scrollIntoView({\n   behavior:\"smooth\",\n   block:\"start\"\n });\n\n\n document.getElementById(\n   \"culture-close\"\n ).onclick=function(){\n\n   d.classList.remove(\"show\");\n\n };\n\n}\n\n\n\/* ============================================================\n FILTERS\n============================================================ *\/\n\ndocument.querySelectorAll(\n \"#mza-culture-maroc .filter\"\n).forEach(function(btn){\n\n btn.onclick=function(){\n\n   document.querySelectorAll(\n     \"#mza-culture-maroc .filter\"\n   ).forEach(function(x){\n\n     x.classList.remove(\"active\");\n\n   });\n\n   btn.classList.add(\"active\");\n\n   activeCat=\n   btn.dataset.cat;\n\n   render();\n\n };\n\n});\n\n\ndocument.getElementById(\n \"culture-search\"\n).oninput=render;\n\n\n\/* ============================================================\n NAV\n============================================================ *\/\n\nfunction go(id){\n\n const x=\n document.getElementById(id);\n\n if(x){\n\n   x.scrollIntoView({\n     behavior:\"smooth\",\n     block:\"start\"\n   });\n\n }\n\n}\n\n\ndocument.querySelectorAll(\n \"#mza-culture-maroc [data-scroll]\"\n).forEach(function(btn){\n\n btn.onclick=function(){\n\n   go(btn.dataset.scroll);\n\n };\n\n});\n\n\ndocument.getElementById(\n \"culture-start\"\n).onclick=function(){\n\n go(\"mza-culture-univers\");\n\n};\n\n\nrender();\n\n})();\n<\/script>\n\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>MZA MAROC ZAIN ACADEMY \u00b7 PATRIMOINE &#038; ARTS DU MAROC Culture Marocaine Artisanat, architecture, musique, v\u00eatements, gastronomie, art de vivre, traditions, terroirs et patrimoine oral : explorer le Maroc \u00e0 travers ses savoir-faire vivants. EXPLORER LES UNIVERS VOYAGE \u00c0 TRAVERS LE MAROC LA COLLECTION 6 PILIERS 24 UNIVERS R\u00c9GIONS PATRIMOINE VIVANT PARCOURS MZA 01 UN [&hellip;]<\/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-1768","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/maroczain.com\/cuisine.maroczain.com\/wp-json\/wp\/v2\/pages\/1768","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/maroczain.com\/cuisine.maroczain.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/maroczain.com\/cuisine.maroczain.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/maroczain.com\/cuisine.maroczain.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/maroczain.com\/cuisine.maroczain.com\/wp-json\/wp\/v2\/comments?post=1768"}],"version-history":[{"count":2,"href":"https:\/\/maroczain.com\/cuisine.maroczain.com\/wp-json\/wp\/v2\/pages\/1768\/revisions"}],"predecessor-version":[{"id":1771,"href":"https:\/\/maroczain.com\/cuisine.maroczain.com\/wp-json\/wp\/v2\/pages\/1768\/revisions\/1771"}],"wp:attachment":[{"href":"https:\/\/maroczain.com\/cuisine.maroczain.com\/wp-json\/wp\/v2\/media?parent=1768"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}