/* t514 lot 2 : pages publiques du blog (/blog, /blog/categorie/{id}, /blog/{slug}, aperçu de l'admin).
   Port de la feuille de la maquette de Béryl (outils-mddrone\t514-import\source\index.html), valeurs reprises telles quelles.
   Tout est sous .md-blog et préfixé md-blog- (la maquette utilisait carte, bouton, grille, nav… déjà pris par Bootstrap
   et theme.css). Exceptions voulues : les classes du texte des articles (chapeau, citation, produit, tableau, officiel,
   coche, num, credit, bouton), écrites dans l'admin et filtrées par BlogHtml, stylées seulement sous .md-blog-texte.
   En-tête et pied : ceux du site (décision d'Aymen « 3 go », 21/10/2026). Fond à courbes topo des bandeaux noirs : fichier
   fond-topographique.svg absent de la maquette reçue → bandeaux noirs unis (à fournir, charte : ne pas le remplacer). */
.md-blog{
  --md-blanc:#ffffff; --md-gris:#f8f8f8; --md-noir:#000000; --md-violet:#6a67ce; --md-lime:#e7fdba;
  --md-corail:#fd636b; --md-jaune:#ffb901; --md-turquoise:#3be8b0; --md-bleu:#1aafd0;
  --md-encre-2:#55536b; --md-encre-sombre:#cfcde0; --md-trait:#e6e5ef;
  --md-f-titre:"Paytone One","Arial Black",sans-serif; --md-f-texte:Roboto,Arial,sans-serif; --md-f-main:"Gochi Hand",cursive;
  --md-r-petit:6px; --md-r-carte:12px; --md-r-pilule:999px;
  --md-ombre:0 2px 12px rgba(0,0,0,.08); --md-ombre-haute:0 10px 30px rgba(0,0,0,.12);
  --md-largeur:1200px; --md-lecture:680px;
  display:block;background:var(--md-blanc);color:var(--md-noir);font:400 16px/1.5 var(--md-f-texte);-webkit-font-smoothing:antialiased;text-align:left
}
.md-blog *,.md-blog *::before,.md-blog *::after{box-sizing:border-box}
@media (prefers-reduced-motion:reduce){.md-blog *{transition:none!important;animation:none!important}}
.md-blog img{max-width:100%;display:block}
.md-blog a{color:inherit}
.md-blog a:hover,.md-blog a:focus{color:inherit}
.md-blog :focus-visible{outline:3px solid var(--md-noir);outline-offset:3px;border-radius:4px}
.md-blog .md-blog-sombre :focus-visible{outline-color:var(--md-blanc)}
.md-blog h1,.md-blog h2,.md-blog h3{font-family:var(--md-f-titre);font-weight:400;text-wrap:balance;margin:0;color:inherit;letter-spacing:normal;text-transform:none}
.md-blog p{margin:0}
.md-blog figure{margin:0}
.md-blog blockquote{margin:0;padding:0;border:0;font-size:inherit}
.md-blog .md-blog-env{max-width:var(--md-largeur);margin-left:auto;margin-right:auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.md-blog .md-blog-cache{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Boutons et pastilles ---------- */
.md-blog .md-blog-bouton,.md-blog-texte .bouton{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border:2px solid var(--md-noir);border-radius:var(--md-r-pilule);font:700 16px/1.2 var(--md-f-texte);text-decoration:none;cursor:pointer;background:var(--md-blanc);color:var(--md-noir);transition:transform .15s ease, box-shadow .15s ease}
.md-blog .md-blog-bouton:hover,.md-blog-texte .bouton:hover{transform:translateY(-2px);box-shadow:0 4px 0 var(--md-noir);text-decoration:none}
.md-blog .md-blog-bouton--action,.md-blog-texte .bouton--action{background:var(--md-violet);color:var(--md-blanc)}
.md-blog .md-blog-bouton--action:hover,.md-blog .md-blog-bouton--action:focus{color:var(--md-blanc)}
.md-blog-texte .bouton--lime{background:var(--md-lime)}
.md-blog .md-blog-pastille{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:var(--md-r-pilule);font:700 14px/1.45 var(--md-f-texte);background:var(--md-lime);color:var(--md-noir);text-decoration:none;white-space:nowrap}
.md-blog a.md-blog-pastille:hover{color:var(--md-noir);text-decoration:none}
.md-blog .md-blog-cat-reglementation{background:var(--md-bleu)} .md-blog .md-blog-cat-missions{background:var(--md-turquoise)} .md-blog .md-blog-cat-bons-plans{background:var(--md-jaune)}
.md-blog .md-blog-cat-formation{background:var(--md-lime)} .md-blog .md-blog-cat-communaute{background:var(--md-corail)} .md-blog .md-blog-cat-actualites{background:var(--md-blanc);box-shadow:inset 0 0 0 2px var(--md-noir)}

.md-blog .md-blog-barre{position:fixed;top:env(safe-area-inset-top,0px);left:0;height:4px;width:0;background:var(--md-violet);z-index:1100;transition:width .1s linear}

/* ---------- Bandeaux noirs ---------- */
.md-blog .md-blog-sombre{position:relative;background:var(--md-noir);color:var(--md-blanc);isolation:isolate;overflow:hidden}

/* ---------- Liste du blog ---------- */
.md-blog .md-blog-une{margin-top:32px;position:relative;z-index:2}
.md-blog .md-blog-une__grille{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);gap:24px;align-items:start}
@media (max-width:900px){.md-blog .md-blog-une__grille{grid-template-columns:1fr}}
.md-blog .md-blog-carte-une{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);background:var(--md-blanc);border-radius:var(--md-r-carte);box-shadow:var(--md-ombre-haute);overflow:hidden;text-decoration:none}
.md-blog .md-blog-carte-une:hover{text-decoration:none}
.md-blog .md-blog-carte-une__photo{position:relative;min-height:340px;background:var(--md-gris)}
.md-blog .md-blog-carte-une__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.md-blog .md-blog-carte-une:hover .md-blog-carte-une__photo img{transform:scale(1.04)}
.md-blog .md-blog-carte-une__etiquette{position:absolute;left:16px;top:16px;font:400 22px/1 var(--md-f-main);background:var(--md-lime);padding:6px 12px;border-radius:var(--md-r-petit);transform:rotate(-3deg)}
.md-blog .md-blog-carte-une__texte{padding:28px;display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.md-blog .md-blog-carte-une h2{font-size:28px;line-height:1.15}
.md-blog .md-blog-carte-une p{color:var(--md-encre-2)}
@media (max-width:640px){.md-blog .md-blog-carte-une{grid-template-columns:1fr}.md-blog .md-blog-carte-une__photo{min-height:220px}.md-blog .md-blog-carte-une__texte{padding:22px}}
.md-blog .md-blog-meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:14px;color:var(--md-encre-2);align-items:center}
.md-blog .md-blog-meta span+span::before{content:"·";margin-right:14px}
.md-blog .md-blog-lire{margin-top:auto;font-weight:700;display:inline-flex;gap:8px;align-items:center}
.md-blog .md-blog-lire::after{content:"→";transition:transform .2s ease}
.md-blog a:hover .md-blog-lire::after{transform:translateX(4px)}

.md-blog .md-blog-news{background:var(--md-blanc);border-radius:var(--md-r-carte);box-shadow:var(--md-ombre-haute);padding:22px 22px 10px}
.md-blog .md-blog-news h2{font-size:24px;display:flex;align-items:center;gap:10px}
.md-blog .md-blog-news h2::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--md-corail);box-shadow:0 0 0 4px rgba(253,99,107,.25)}
.md-blog .md-blog-news ol{list-style:none;margin:12px 0 0;padding:0}
.md-blog .md-blog-news li+li{border-top:1px solid var(--md-trait)}
.md-blog .md-blog-news a{display:grid;grid-template-columns:72px minmax(0,1fr);gap:14px;padding:14px 0;text-decoration:none;align-items:center}
.md-blog .md-blog-news img,.md-blog .md-blog-news__vide{width:72px;height:72px;object-fit:cover;border-radius:10px;background:var(--md-gris)}
.md-blog .md-blog-news time{font-size:14px;color:var(--md-encre-2);font-variant-numeric:tabular-nums}
.md-blog .md-blog-news strong{display:block;font-size:16px;line-height:1.3;margin-top:2px}
.md-blog .md-blog-news a:hover strong{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}

.md-blog .md-blog-sujets{padding-top:56px;padding-bottom:8px;scroll-margin-top:96px}
.md-blog .md-blog-sujets__tete{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px}
.md-blog .md-blog-sujets h2{font-size:32px}
.md-blog .md-blog-sujets__tete p{color:var(--md-encre-2)}
.md-blog .md-blog-filtres{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 0;padding:0;list-style:none}
.md-blog .md-blog-filtre{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:6px 18px 6px 6px;border:2px solid var(--md-noir);border-radius:var(--md-r-pilule);background:var(--md-blanc);font:700 16px/1 var(--md-f-texte);cursor:pointer;color:var(--md-noir);text-decoration:none}
.md-blog .md-blog-filtre:hover{color:var(--md-noir);text-decoration:none;background:var(--md-gris)}
.md-blog .md-blog-filtre__picto{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--md-blanc);overflow:hidden;flex:none}
.md-blog .md-blog-filtre__picto img{width:38px;height:38px}
.md-blog .md-blog-filtre .md-blog-compte{font-weight:400;color:var(--md-encre-2);font-variant-numeric:tabular-nums}
.md-blog .md-blog-filtre--actif,.md-blog .md-blog-filtre--actif:hover{background:var(--md-noir);color:var(--md-blanc)}
.md-blog .md-blog-filtre--actif .md-blog-compte{color:var(--md-encre-sombre)}
.md-blog .md-blog-filtre--tous{padding-left:18px}

.md-blog .md-blog-grille{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding-top:28px;padding-bottom:64px}
@media (max-width:980px){.md-blog .md-blog-grille{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.md-blog .md-blog-grille{grid-template-columns:1fr}}
.md-blog .md-blog-carte{display:flex;flex-direction:column;background:var(--md-blanc);border-radius:var(--md-r-carte);box-shadow:var(--md-ombre);overflow:hidden;text-decoration:none;transition:transform .2s ease, box-shadow .2s ease}
.md-blog .md-blog-carte:hover{transform:translateY(-4px);box-shadow:var(--md-ombre-haute);text-decoration:none}
.md-blog .md-blog-carte__photo{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--md-gris)}
.md-blog .md-blog-carte__photo img{width:100%;height:100%;object-fit:cover}
.md-blog .md-blog-carte__photo .md-blog-pastille{position:absolute;left:14px;bottom:14px}
.md-blog .md-blog-carte__texte{display:flex;flex-direction:column;gap:10px;padding:20px 22px 22px;flex:1}
.md-blog .md-blog-carte h3{font-size:22px;line-height:1.2}
.md-blog .md-blog-carte p{color:var(--md-encre-2)}
.md-blog .md-blog-vide{grid-column:1/-1;padding:40px;border:2px dashed var(--md-trait);border-radius:var(--md-r-carte);text-align:center;color:var(--md-encre-2)}

.md-blog .md-blog-appel{background:var(--md-lime)}
.md-blog .md-blog-appel .md-blog-env{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:28px;align-items:center;padding-top:44px;padding-bottom:44px}
.md-blog .md-blog-appel__photo{margin:0;position:relative;width:360px}
.md-blog .md-blog-appel__photo img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:var(--md-r-carte);border:2px solid var(--md-noir)}
.md-blog .md-blog-appel__photo figcaption{position:absolute;right:10px;bottom:10px;font-size:14px;background:rgba(0,0,0,.6);color:var(--md-blanc);padding:2px 10px;border-radius:var(--md-r-pilule)}
.md-blog .md-blog-appel h2{font-size:32px}
.md-blog .md-blog-appel p{margin-top:6px;max-width:56ch}
@media (max-width:900px){.md-blog .md-blog-appel .md-blog-env{grid-template-columns:1fr;gap:20px}.md-blog .md-blog-appel__photo{width:100%;max-width:520px}}

/* ---------- Article ---------- */
.md-blog .md-blog-apercu{position:sticky;top:0;z-index:1050;background:var(--md-jaune);border-bottom:2px solid var(--md-noir);font-size:15px;padding:8px 0}
.md-blog .md-blog-apercu a{font-weight:700;margin-left:12px;text-decoration:underline}
.md-blog .md-blog-ariane{font-size:14px;color:var(--md-encre-2);padding-top:14px;padding-bottom:14px}
.md-blog .md-blog-ariane ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.md-blog .md-blog-ariane li+li::before{content:"›";margin-right:6px}
.md-blog .md-blog-ariane a{text-decoration:none}
.md-blog .md-blog-ariane a:hover{text-decoration:underline}
.md-blog .md-blog-banniere{padding-top:48px;padding-bottom:48px}
.md-blog .md-blog-banniere .md-blog-env{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
.md-blog .md-blog-banniere h1{font-size:clamp(32px,4.2vw,48px);line-height:1.05;margin-top:16px;color:var(--md-blanc)}
.md-blog .md-blog-banniere .md-blog-meta{color:var(--md-encre-sombre);margin-top:22px}
.md-blog .md-blog-auteur{display:inline-flex;align-items:center;gap:10px;color:var(--md-blanc);font-weight:700}
.md-blog .md-blog-auteur__logo{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:50%;background:var(--md-blanc)}
.md-blog .md-blog-auteur__logo img{width:auto;height:24px}
.md-blog .md-blog-banniere figure{margin:0;position:relative}
.md-blog .md-blog-banniere figure img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--md-r-carte)}
.md-blog .md-blog-banniere figcaption{position:absolute;right:10px;bottom:10px;font-size:14px;background:rgba(0,0,0,.6);padding:2px 10px;border-radius:var(--md-r-pilule)}
.md-blog .md-blog-banniere__note{position:absolute;left:-14px;top:-16px;font:400 22px/1 var(--md-f-main);background:var(--md-lime);color:var(--md-noir);padding:6px 12px;border-radius:var(--md-r-petit);transform:rotate(-3deg)}
@media (max-width:860px){.md-blog .md-blog-banniere .md-blog-env{grid-template-columns:1fr;gap:28px}.md-blog .md-blog-banniere figure{order:-1}.md-blog .md-blog-banniere figure img{aspect-ratio:16/9}.md-blog .md-blog-banniere__note{left:10px}}

.md-blog .md-blog-corps{display:grid;grid-template-columns:minmax(0,var(--md-lecture)) minmax(0,300px);justify-content:space-between;gap:56px;padding-top:48px;padding-bottom:24px}
@media (max-width:1020px){.md-blog .md-blog-corps{grid-template-columns:minmax(0,1fr)}.md-blog .md-blog-rail{display:none}}
.md-blog .md-blog-rail__collant{position:sticky;top:24px;display:flex;flex-direction:column;gap:16px}
.md-blog .md-blog-boite{border-radius:var(--md-r-carte);padding:20px;background:var(--md-gris)}
.md-blog .md-blog-boite h2{font:700 14px/1.2 var(--md-f-texte);text-transform:uppercase;letter-spacing:.08em;margin:0 0 12px}
.md-blog .md-blog-boite--ia{background:var(--md-noir);color:var(--md-blanc)}
.md-blog .md-blog-boite--ia p{font-size:14px;color:var(--md-encre-sombre);margin:-4px 0 14px}
.md-blog .md-blog-boutons-ia,.md-blog .md-blog-boutons-partage{display:flex;flex-wrap:wrap;gap:8px}
.md-blog .md-blog-puce{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border-radius:var(--md-r-pilule);border:2px solid var(--md-blanc);background:transparent;color:var(--md-blanc);font:700 14px/1 var(--md-f-texte);text-decoration:none;cursor:pointer}
.md-blog .md-blog-puce:hover,.md-blog .md-blog-puce:focus{background:var(--md-blanc);color:var(--md-noir);text-decoration:none}
.md-blog .md-blog-ia-logo{display:grid;place-items:center;width:26px;height:26px;margin-left:-8px;border-radius:50%;background:var(--md-blanc)}
.md-blog .md-blog-ia-logo svg{width:16px;height:16px}
.md-blog .md-blog-ia-logo--chatgpt{color:#000}.md-blog .md-blog-ia-logo--claude{color:#d97757}.md-blog .md-blog-ia-logo--gemini{color:#4285f4}.md-blog .md-blog-ia-logo--perplexity{color:#1fb8cd}
.md-blog .md-blog-partage{display:inline-grid;place-items:center;width:46px;height:46px;padding:0;border-radius:50%;border:2px solid var(--md-noir);background:var(--md-blanc);color:var(--md-noir);cursor:pointer;transition:background .15s ease,color .15s ease}
.md-blog .md-blog-partage:hover,.md-blog .md-blog-partage:focus-visible{background:var(--md-noir);color:var(--md-blanc)}
.md-blog .md-blog-partage--facebook:hover,.md-blog .md-blog-partage--facebook:focus-visible{background:#0866ff;border-color:#0866ff}
.md-blog .md-blog-partage--linkedin:hover,.md-blog .md-blog-partage--linkedin:focus-visible{background:#0a66c2;border-color:#0a66c2}
.md-blog .md-blog-boutons-partage{gap:10px}
.md-blog .md-blog-sommaire ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.md-blog .md-blog-sommaire a{display:block;padding:7px 10px;border-radius:8px;text-decoration:none;font-size:15px;line-height:1.35;border-left:3px solid transparent;color:var(--md-noir);font-weight:400}
.md-blog .md-blog-sommaire a:hover{background:var(--md-blanc)}
.md-blog .md-blog-sommaire a.md-blog-actif{border-left-color:var(--md-violet);background:var(--md-blanc);font-weight:700}
.md-blog .md-blog-sommaire .md-blog-niv3 a{padding-left:22px;font-size:14px}

.md-blog .md-blog-outils-mobile{display:none;margin-top:28px;gap:12px;flex-direction:column}
@media (max-width:1020px){.md-blog .md-blog-outils-mobile{display:flex}}
.md-blog .md-blog-outils-mobile details{background:var(--md-gris);border-radius:var(--md-r-carte);padding:4px 20px}
.md-blog .md-blog-outils-mobile summary{cursor:pointer;font-weight:700;padding:12px 0}

/* Texte de l'article (HTML écrit dans l'admin, BlogHtml) */
.md-blog .md-blog-texte{font-size:18px;line-height:1.7}
.md-blog .md-blog-texte>*+*{margin-top:22px}
.md-blog-texte .chapeau{font-size:21px;line-height:1.55;font-weight:400;padding-left:20px;border-left:6px solid var(--md-lime)}
.md-blog .md-blog-texte h2{font-size:32px;line-height:1.15;margin-top:56px;scroll-margin-top:96px}
.md-blog .md-blog-texte h3{font-size:24px;line-height:1.2;margin-top:40px;scroll-margin-top:96px;display:flex;gap:12px;align-items:baseline}
.md-blog-texte h3 .num{font:700 15px/1 var(--md-f-texte);background:var(--md-violet);color:var(--md-blanc);border-radius:var(--md-r-pilule);padding:6px 12px;flex:none;transform:translateY(-3px)}
.md-blog .md-blog-texte h2+*,.md-blog .md-blog-texte h3+*{margin-top:14px}
.md-blog .md-blog-texte a{color:var(--md-violet);font-weight:700;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.md-blog .md-blog-texte ul{padding-left:0;list-style:none;margin-bottom:0}
.md-blog .md-blog-texte ul li{position:relative;padding-left:30px}
.md-blog .md-blog-texte ul li+li{margin-top:8px}
.md-blog .md-blog-texte ul li::before{content:"";position:absolute;left:4px;top:.62em;width:12px;height:12px;border-radius:50%;background:var(--md-turquoise);box-shadow:0 0 0 3px var(--md-lime)}
.md-blog .md-blog-texte ul.coche li::before{content:"✓";width:auto;height:auto;background:none;box-shadow:none;top:0;left:2px;font-weight:700;color:var(--md-violet)}
.md-blog .md-blog-texte ol{margin-bottom:0}
.md-blog .md-blog-texte strong{font-weight:700}
.md-blog .md-blog-texte figure img{width:100%;height:auto;border-radius:var(--md-r-carte);background:var(--md-gris)}
.md-blog .md-blog-texte figcaption{font-size:14px;line-height:1.45;color:var(--md-encre-2);margin-top:10px;display:flex;flex-wrap:wrap;gap:4px 12px;justify-content:space-between}
.md-blog-texte .credit{white-space:nowrap}

.md-blog-texte .citation{position:relative;background:var(--md-lime);border-radius:var(--md-r-carte);padding:40px 32px 28px;margin-top:44px!important;margin-bottom:44px!important}
.md-blog-texte .citation__etiquette{position:absolute;top:-16px;left:24px;background:var(--md-noir);color:var(--md-lime);font:400 22px/1 var(--md-f-main);padding:7px 14px;border-radius:var(--md-r-petit);transform:rotate(-3deg)}
.md-blog-texte .citation blockquote{margin:0;font:400 clamp(22px,2.6vw,28px)/1.3 var(--md-f-titre)}
.md-blog-texte .citation blockquote::before{content:"«\00a0"}
.md-blog-texte .citation blockquote::after{content:"\00a0»"}

.md-blog-texte .tableau{overflow-x:auto;border-radius:var(--md-r-carte);border:1px solid var(--md-trait)}
.md-blog-texte .tableau table{border-collapse:collapse;width:100%;min-width:520px;font-size:16px;line-height:1.45;margin:0}
.md-blog-texte .tableau th,.md-blog-texte .tableau td{text-align:left;padding:12px 14px;vertical-align:top;border-bottom:1px solid var(--md-trait)}
.md-blog-texte .tableau thead th{background:var(--md-noir);color:var(--md-blanc);font-weight:700}
.md-blog-texte .tableau tbody th{font-family:var(--md-f-titre);font-weight:400;white-space:nowrap}
.md-blog-texte .tableau tr:last-child td,.md-blog-texte .tableau tr:last-child th{border-bottom:0}
.md-blog-texte .tableau caption{caption-side:bottom;text-align:left;font-size:14px;color:var(--md-encre-2);padding:10px 14px}

.md-blog-texte .officiel{border-left:0;background:var(--md-gris);border-radius:var(--md-r-carte);padding:20px 22px;font-size:17px}
.md-blog-texte .officiel p+p{margin-top:10px}
.md-blog-texte .officiel cite{display:block;font-style:normal;font-size:14px;color:var(--md-encre-2);margin-top:12px}

.md-blog-texte .produit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:center;gap:8px 24px;background:var(--md-blanc);border:2px solid var(--md-noir);border-radius:var(--md-r-carte);padding:18px 22px;box-shadow:6px 6px 0 var(--md-lime)}
.md-blog-texte .produit__photo img{width:100%;height:auto;display:block}
.md-blog-texte .produit__etiquette{display:inline-block;background:var(--md-noir);color:var(--md-lime);font:400 19px/1 var(--md-f-main);padding:6px 12px;border-radius:var(--md-r-petit);transform:rotate(-3deg)}
.md-blog .md-blog-texte .produit p{font-size:16px;line-height:1.5;margin-top:8px;color:var(--md-encre-2)}
.md-blog .md-blog-texte .produit .produit__nom{font:400 22px/1.2 var(--md-f-titre);color:var(--md-noir);margin-top:12px}
.md-blog .md-blog-texte .produit .bouton{margin-top:14px;color:var(--md-noir);text-decoration:none;font-size:15px;min-height:44px}
.md-blog .md-blog-texte .bouton--action{color:var(--md-blanc);text-decoration:none}
@media (max-width:640px){.md-blog-texte .produit{grid-template-columns:1fr}}

.md-blog .md-blog-texte .md-blog-boite h2{font:700 14px/1.2 var(--md-f-texte);text-transform:uppercase;letter-spacing:.08em;margin:0 0 12px}
.md-blog .md-blog-texte .md-blog-boite a{font-weight:700;text-decoration:none}
.md-blog .md-blog-texte .md-blog-partage{color:var(--md-noir)}
.md-blog .md-blog-texte .md-blog-partage:hover{color:var(--md-blanc)}
.md-blog .md-blog-texte .md-blog-puce{color:var(--md-blanc)}
.md-blog .md-blog-texte .md-blog-puce:hover{color:var(--md-noir)}
.md-blog .md-blog-texte .md-blog-sommaire a{color:var(--md-noir);font-weight:400;text-decoration:none}

.md-blog .md-blog-galerie h2{margin-top:56px}
.md-blog .md-blog-galerie__tete{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.md-blog .md-blog-galerie__piste{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 14px;margin-top:14px}
.md-blog .md-blog-galerie__piste img{flex:none;width:220px;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:10px;scroll-snap-align:start;box-shadow:var(--md-ombre)}

.md-blog .md-blog-faq details{border-top:1px solid var(--md-trait);padding:4px 0}
.md-blog .md-blog-faq details:last-child{border-bottom:1px solid var(--md-trait)}
.md-blog .md-blog-faq summary{cursor:pointer;list-style:none;font-weight:700;padding:14px 40px 14px 0;position:relative;font-size:18px;display:block}
.md-blog .md-blog-faq summary::-webkit-details-marker{display:none}
.md-blog .md-blog-faq summary::after{content:"+";position:absolute;right:6px;top:8px;font:400 28px/1 var(--md-f-titre);color:var(--md-violet)}
.md-blog .md-blog-faq details[open] summary::after{content:"–"}
.md-blog .md-blog-faq details p{padding-bottom:14px}

.md-blog .md-blog-sources{font-size:15px;line-height:1.55;color:var(--md-encre-2);border-top:2px solid var(--md-noir);padding-top:18px;margin-top:56px!important}
.md-blog .md-blog-texte .md-blog-sources h2{font:700 14px/1.2 var(--md-f-texte);text-transform:uppercase;letter-spacing:.08em;color:var(--md-noir);margin:0 0 10px}
.md-blog .md-blog-sources ol{margin:0;padding-left:20px}
.md-blog .md-blog-texte .md-blog-sources a{color:var(--md-encre-2);font-weight:400}

.md-blog .md-blog-suite{background:var(--md-noir);color:var(--md-blanc);border-radius:var(--md-r-carte);padding:30px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;margin-top:44px!important;position:relative;overflow:hidden;isolation:isolate}
.md-blog .md-blog-texte .md-blog-suite h2{font-size:26px;margin:0!important}
.md-blog .md-blog-suite p{color:var(--md-encre-sombre);font-size:16px;margin-top:6px!important}
.md-blog .md-blog-suite--lime{background:var(--md-lime);color:var(--md-noir);border:2px solid var(--md-noir)}
.md-blog .md-blog-suite+.md-blog-suite--lime{margin-top:16px!important}
.md-blog .md-blog-suite--lime p{color:var(--md-encre-2)}
.md-blog .md-blog-texte .md-blog-suite .md-blog-bouton--action{color:var(--md-blanc);text-decoration:none}
@media (max-width:640px){.md-blog .md-blog-suite{grid-template-columns:1fr}}

.md-blog .md-blog-relais{background:var(--md-gris);padding-top:56px;padding-bottom:64px}
.md-blog .md-blog-relais h2{font-size:32px}
.md-blog .md-blog-relais .md-blog-grille{padding-top:24px;padding-bottom:0}

.md-blog .md-blog-message{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);background:var(--md-noir);color:var(--md-blanc);padding:12px 20px;border-radius:var(--md-r-pilule);font-weight:700;opacity:0;pointer-events:none;transition:all .25s ease;z-index:1100}
.md-blog .md-blog-message.md-blog-visible{opacity:1;transform:translate(-50%,0)}

/* Polices de la maquette de Béryl. custom.css (t180, Brand Kit) impose Roboto !important hors h1/h2 sur tout le site : sur
   les pages du blog seulement, titres h3, citations, nom de produit et en-têtes de ligne des tableaux en Paytone One,
   étiquettes manuscrites en Gochi Hand, comme la maquette (polices du Brand Kit, servies par md-polices.css). */
.md-blog h3,.md-blog-texte .citation blockquote,.md-blog .md-blog-texte .produit .produit__nom,.md-blog-texte .tableau tbody th{font-family:var(--md-f-titre)!important}
.md-blog .md-blog-carte-une__etiquette,.md-blog .md-blog-banniere__note,.md-blog-texte .citation__etiquette,.md-blog-texte .produit__etiquette{font-family:var(--md-f-main)!important}

/* Bloc « cas » de la maquette (drone, distance aux tiers, ce qui n'est pas exigé) : l'import du lot 1 a gardé p.distance,
   le titre et les étiquettes, sans les cadres « article » (décision 3 du lot 1) ; cadres et étiquettes redessinés ici. */
.md-blog-texte div:has(> p.distance){display:grid;grid-template-columns:150px minmax(0,1fr);row-gap:12px}
.md-blog .md-blog-texte div:has(> p.distance) > *{margin-top:0}
.md-blog .md-blog-texte div:has(> p.distance) > p.distance{font:400 20px/1.2 var(--md-f-main);font-family:var(--md-f-main)!important;border:2px solid var(--md-noir);border-right:0;border-radius:var(--md-r-carte) 0 0 var(--md-r-carte);padding:16px 0 16px 18px}
.md-blog .md-blog-texte div:has(> p.distance) > div{border:2px solid var(--md-noir);border-left:0;border-radius:0 var(--md-r-carte) var(--md-r-carte) 0;padding:16px 18px;font-size:16px;line-height:1.5}
.md-blog .md-blog-texte div:has(> p.distance) > div h3{display:block;font:400 18px/1.25 var(--md-f-titre);margin:0}
.md-blog .md-blog-texte div:has(> p.distance) > div > div{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.md-blog .md-blog-texte div:has(> p.distance) > div > div > span{font-size:14px;background:var(--md-gris);border-radius:var(--md-r-pilule);padding:2px 10px}
@media (max-width:560px){
  .md-blog-texte div:has(> p.distance){grid-template-columns:1fr;row-gap:0}
  .md-blog .md-blog-texte div:has(> p.distance) > p.distance{border-right:2px solid var(--md-noir);border-bottom:0;border-radius:var(--md-r-carte) var(--md-r-carte) 0 0;padding:16px 18px 0;margin-top:12px}
  .md-blog .md-blog-texte div:has(> p.distance) > div{border-left:2px solid var(--md-noir);border-top:0;border-radius:0 0 var(--md-r-carte) var(--md-r-carte);padding-top:6px}
}