/* Masquer les liens de navigation en doublon dans le footer */
footer .wpcom-ai-footer-nav-buttons {
  display: none;
}

/* Barre sticky - fond dark + hover violet */
.is-position-sticky {
  background: #0a0a0a !important;
}

.is-position-sticky a {
  color: #ffffff !important;
}

.is-position-sticky a:hover {
  color: #a855f7 !important;
}

/* Fix header plein écran grands moniteurs (32 pouces+) */
.wp-block-template-part.alignfull,
header.wp-block-template-part,
.wp-block-image.alignfull,
.wp-block-image.size-full {
  max-width: 100% !important;
  width: 100% !important;
}

.wp-block-image.size-full img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto;
  object-fit: cover;
}

/* Fond noir header pour grands écrans */
header.wp-block-template-part {
  background-color: #000000;
}
/* Série Histoire : encart en tête d'article */
.cpmp-serie{background:#141018;border-radius:16px;padding:1rem 1.4rem;margin:0 0 2rem;color:#f4f4f6;}
.cpmp-serie__eyebrow{display:block;font-size:11px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:#9b51e0;margin:0 0 0.35rem;}
.cpmp-serie__text{margin:0;font-size:0.95rem;line-height:1.5;color:#d6d6dc;}
.cpmp-serie__link{color:#c69cf2!important;font-weight:700;text-decoration:none;white-space:nowrap;}
.cpmp-serie__link:hover{color:#ffffff!important;text-decoration:underline;}
.cpmp-serie__link::after{content:" \2192";}

/* Série Histoire : liste des épisodes sur la page de la série */
.cpmp-episodes{list-style:none;margin:2rem 0;padding:0;display:flex;flex-direction:column;gap:14px;}
.cpmp-episode{display:grid;grid-template-columns:64px 1fr;gap:18px;align-items:start;background:#f5f5f5;border-radius:18px;padding:1.3rem 1.4rem;}
.cpmp-episode__num{font-size:2rem;font-weight:800;line-height:1;color:#9b51e0;letter-spacing:-0.03em;}
.cpmp-episode__title{margin:0 0 0.4rem;font-size:1.15rem;font-weight:800;line-height:1.25;}
.cpmp-episode__title a{color:#0f0f0f;text-decoration:none;}
.cpmp-episode__title a:hover{color:#9b51e0;}
.cpmp-episode__pitch{margin:0;font-size:0.95rem;line-height:1.55;color:#5f5e5a;}
.cpmp-episode--soon{background:#f5edfc;}
.cpmp-episode--soon .cpmp-episode__num{color:#c9a9ef;}
@media (max-width:600px){.cpmp-episode{grid-template-columns:44px 1fr;gap:12px;padding:1.1rem;}.cpmp-episode__num{font-size:1.5rem;}}
/* Série Histoire : vignette sur les cartes d'épisodes publiés */
.cpmp-episode--img{overflow:hidden;}
.cpmp-episode__thumb{grid-column:1/-1;display:block;margin:-1.3rem -1.4rem 0.3rem;line-height:0;}
.cpmp-episode__thumb img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;border-radius:0;transition:transform 0.35s ease;}
.cpmp-episode__thumb:hover img{transform:scale(1.02);}
@media (max-width:600px){.cpmp-episode__thumb{margin:-1.1rem -1.1rem 0.2rem;}}
.cpmp-episode__thumb img{height:auto!important;max-height:none!important;aspect-ratio:16/9!important;object-fit:cover!important;}
/* Série Histoire : encart page d'accueil */
.cpmp-histo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);background:#141018 radial-gradient(110% 130% at 0% 0%,rgba(155,81,224,.24),transparent 60%);border-radius:22px;overflow:hidden;margin:0}
.cpmp-histo__body{padding:2.2rem 2rem;display:flex;flex-direction:column;justify-content:center}
.cpmp-histo__eyebrow{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#9b51e0;margin:0 0 14px}
.cpmp-histo__heading{color:#fff!important;font-size:28px;font-weight:800;line-height:1.12;letter-spacing:-.015em;margin:0 0 12px}
.cpmp-histo__sub{color:#bdbdc6!important;font-size:15px;line-height:1.55;margin:0 0 22px;max-width:420px}
.cpmp-histo__btn{color:#fff!important;background:#9b51e0;padding:11px 20px;border-radius:999px;font-size:13px;font-weight:700;align-self:flex-start;text-decoration:none!important;transition:background .15s}
.cpmp-histo__btn:hover{background:#7a3bc4}
.cpmp-histo__btn::after{content:" \2192"}
.cpmp-histo__last{position:relative;margin:0!important}
.cpmp-histo__last .wp-block-query,.cpmp-histo__last .wp-block-post-template,.cpmp-histo__last .wp-block-post{height:100%;margin:0!important;padding:0;list-style:none}
.cpmp-histo__last .wp-block-post{position:relative}
.cpmp-histo__last .wp-block-post-featured-image{margin:0!important;height:100%;min-height:260px;border-radius:0!important;aspect-ratio:auto!important}
.cpmp-histo__last .wp-block-post-featured-image a{display:block;height:100%}
.cpmp-histo__last .wp-block-post-featured-image img{width:100%;height:100%!important;object-fit:cover;border-radius:0!important;transition:transform .35s ease}
.cpmp-histo__last .wp-block-post:hover .wp-block-post-featured-image img{transform:scale(1.03)}
.cpmp-histo__last .wp-block-post-title{position:absolute;left:0;right:0;bottom:0;margin:0!important;padding:3.5rem 1.6rem 1.3rem;background:linear-gradient(to top,rgba(10,8,14,.92),rgba(10,8,14,0));font-size:19px!important;line-height:1.25;font-weight:800;pointer-events:none}
.cpmp-histo__last .wp-block-post-title a{color:#fff!important;text-decoration:none;pointer-events:auto}
.cpmp-histo__last .wp-block-post-title::before{content:"Dernier épisode";display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#c69cf2;margin-bottom:6px;font-weight:700}
@media (max-width:781px){.cpmp-histo{grid-template-columns:1fr}.cpmp-histo__body{padding:1.6rem 1.4rem}.cpmp-histo__heading{font-size:23px}.cpmp-histo__last .wp-block-post-featured-image{aspect-ratio:16/9!important;min-height:0}.cpmp-histo__last .wp-block-post-title{font-size:16px!important;padding:2.5rem 1.2rem 1rem}}
/* Série Histoire : encart page d'accueil, liseret violet autour de la vignette */
.cpmp-histo__last{padding:16px!important}
.cpmp-histo__last .wp-block-post-featured-image{border:3px solid #9b51e0!important;border-radius:12px!important;overflow:hidden;box-sizing:border-box;max-width:100%}
.cpmp-histo__last .wp-block-post-title{left:3px!important;right:3px!important;bottom:3px!important;border-radius:0 0 9px 9px}
@media (max-width:781px){.cpmp-histo__last{padding:0 14px 14px!important}}

/* Newsletter accueil : enveloppe qui arrive du bord droit et se pose derrière le titre (déclenchée au scroll par le snippet 12) */
.cpmp-nl--inline{position:relative;overflow:hidden;--env-x:27%}
.cpmp-nl--inline>*{position:relative;z-index:2}
.cpmp-nl--inline::before{content:"";position:absolute;z-index:1;top:22px;left:var(--env-x);width:150px;height:120px;pointer-events:none;opacity:.9;transform:rotate(-10deg);background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 130 104'%3E%3Crect x='5' y='22' width='120' height='80' rx='8' fill='%235b21b6'/%3E%3Cpath d='M5 30 L65 64 L125 30 Q125 22 117 22 L13 22 Q5 22 5 30 Z' fill='%234c1d95'/%3E%3Crect x='20' y='4' width='90' height='62' rx='5' fill='%23f5f3ff'/%3E%3Crect x='30' y='16' width='44' height='5' rx='2.5' fill='%23a78bfa'/%3E%3Crect x='30' y='27' width='66' height='4' rx='2' fill='%23ddd6fe'/%3E%3Crect x='30' y='36' width='58' height='4' rx='2' fill='%23ddd6fe'/%3E%3Cpath d='M5 44 L65 76 L125 44 L125 94 Q125 102 117 102 L13 102 Q5 102 5 94 Z' fill='%237c3aed'/%3E%3Cpath d='M5 94 L52 66 M125 94 L78 66' stroke='%236d28d9' stroke-width='2.5' stroke-linecap='round'/%3E%3Ccircle cx='65' cy='76' r='11' fill='%23c026d3'/%3E%3Ccircle cx='65' cy='76' r='7.5' fill='none' stroke='%23f0abfc' stroke-width='1.5'/%3E%3C/svg%3E")}
.cpmp-nl--inline.cpmp-anim::before{left:calc(100% + 30px);transform:rotate(18deg)}
.cpmp-nl--inline.cpmp-anim.is-in::before{animation:cpmpEnvEdge 1.6s cubic-bezier(.22,1.2,.36,1) forwards}
@keyframes cpmpEnvEdge{0%{left:calc(100% + 30px);transform:rotate(18deg)}100%{left:var(--env-x);transform:rotate(-10deg)}}
@media (max-width:781px){.cpmp-nl--inline{--env-x:calc(100% - 125px)}.cpmp-nl--inline::before{top:14px;width:110px;height:88px}}

/* Easter egg podcast : le triangle play devient un égaliseur au survol */
.cpmp-cta__btn::before{content:"";display:none;width:15px;height:15px;flex-shrink:0;background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-repeat:no-repeat;background-position:0 100%,50% 100%,100% 100%;background-size:3.5px 30%,3.5px 100%,3.5px 65%}
.cpmp-cta__podcast:hover .cpmp-cta__btn svg{display:none}
.cpmp-cta__podcast:hover .cpmp-cta__btn::before{display:block;animation:cpmpEq .9s ease-in-out infinite}
@keyframes cpmpEq{0%,100%{background-size:3.5px 30%,3.5px 100%,3.5px 65%}33%{background-size:3.5px 100%,3.5px 65%,3.5px 30%}66%{background-size:3.5px 65%,3.5px 30%,3.5px 100%}}

/* Easter egg Série Histoire : « Dernier épisode » se retape au survol (copie en ::after, qui ne s'affiche qu'au survol, pour que Safari relance l'animation) */
.cpmp-histo__last .wp-block-post-title{display:flex;flex-direction:column}
.cpmp-histo__last .wp-block-post-title::after{content:"Dernier épisode";display:none;order:-1;width:max-content;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#c69cf2;margin-bottom:6px;font-weight:700}
.cpmp-histo__last .wp-block-post:hover .wp-block-post-title::before{display:none}
.cpmp-histo__last .wp-block-post:hover .wp-block-post-title::after{display:block;animation:cpmpType .9s steps(15,end) both}
@keyframes cpmpType{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}

@media (prefers-reduced-motion:reduce){.cpmp-nl--inline.cpmp-anim::before,.cpmp-nl--inline.cpmp-anim.is-in::before{animation:none!important;left:var(--env-x)!important;transform:rotate(-10deg)!important}.cpmp-cta__podcast:hover .cpmp-cta__btn::before,.cpmp-histo__last .wp-block-post:hover .wp-block-post-title::after{animation:none!important}}


/* Accueil : bloc « Les guides essentiels » (après le flux Articles) */
.cpmp-guides{--g-bg:#f5f5f5;--g-card:#ffffff;--g-text:#0f0f0f;--g-sub:#5f5e5a;--g-tag:#8a8a94;--g-btn-bg:#0f0f0f;--g-btn-tx:#ffffff;--g-thumb:#e9e7ee;--g-shadow:rgba(20,16,24,.10);background:var(--g-bg);border-radius:22px;padding:2.2rem 2rem 2rem;color:var(--g-text)}
.cpmp-guides__head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin:0 0 1.6rem}
.cpmp-guides__eyebrow{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#9b51e0;margin:0 0 10px}
.cpmp-guides__heading{font-size:28px!important;font-weight:800;line-height:1.12;letter-spacing:-.015em;margin:0 0 8px!important;color:var(--g-text)!important}
.cpmp-guides__sub{font-size:15px;line-height:1.55;color:var(--g-sub);margin:0;max-width:520px}
.cpmp-guides__btn{color:var(--g-btn-tx)!important;background:var(--g-btn-bg);padding:11px 20px;border-radius:999px;font-size:13px;font-weight:700;text-decoration:none!important;white-space:nowrap;transition:background .15s}
.cpmp-guides__btn:hover{background:#7a3bc4}
.cpmp-guides__btn::after{content:" \2192"}
.cpmp-guides__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.cpmp-guide{margin:0}
.cpmp-guide a{display:flex;flex-direction:column;height:100%;background:var(--g-card);border-radius:16px;overflow:hidden;text-decoration:none!important;color:var(--g-text)!important;box-shadow:0 1px 0 rgba(0,0,0,.04);transition:transform .2s ease,box-shadow .2s ease}
.cpmp-guide a:hover{transform:translateY(-3px);box-shadow:0 10px 24px var(--g-shadow)}
.cpmp-guide__thumb{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--g-thumb)}
.cpmp-guide__thumb img{width:100%;height:100%!important;object-fit:cover;display:block;border-radius:0!important;transition:transform .35s ease}
.cpmp-guide a:hover .cpmp-guide__thumb img{transform:scale(1.03)}
.cpmp-guide__body{padding:14px 16px 18px;display:flex;gap:12px;align-items:flex-start}
.cpmp-guide__num{font-size:20px;font-weight:800;line-height:1.1;color:#9b51e0;letter-spacing:-.03em;flex-shrink:0}
.cpmp-guide__tag{display:block;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--g-tag);margin:0 0 4px}
.cpmp-guide__title{display:block;font-size:16px;font-weight:800;line-height:1.3}
.cpmp-guide a:hover .cpmp-guide__title{color:#9b51e0}
@media (max-width:900px){.cpmp-guides__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.cpmp-guides{padding:1.6rem 1.1rem 1.2rem;border-radius:18px}.cpmp-guides__heading{font-size:23px!important}.cpmp-guides__grid{grid-template-columns:1fr;gap:10px}.cpmp-guide a{flex-direction:row;align-items:center}.cpmp-guide__thumb{width:112px;flex-shrink:0;align-self:stretch;aspect-ratio:auto}.cpmp-guide__body{padding:12px 14px;gap:10px}.cpmp-guide__num{font-size:17px}.cpmp-guide__title{font-size:14.5px}.cpmp-guides__head{margin-bottom:1.2rem}}
@media (prefers-reduced-motion:reduce){.cpmp-guide a,.cpmp-guide__thumb img{transition:none}.cpmp-guide a:hover{transform:none}}


/* Guides essentiels : 3 colonnes aussi sur iPad (601-900 px), comme le flux Articles */
@media (min-width:601px) and (max-width:900px){.cpmp-guides__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.cpmp-guides{padding:1.9rem 1.6rem 1.7rem}.cpmp-guide__body{padding:12px 12px 14px;gap:8px}.cpmp-guide__num{font-size:17px}.cpmp-guide__title{font-size:14.5px}}


/* Pages catégorie : en-tête (titre + description de la catégorie) */
.cpmp-cat-head{border-bottom:3px solid var(--wp--preset--color--contrast);padding-bottom:18px;margin-bottom:2.2rem!important}
.cpmp-cat-head .cpmp-cat-head__title{font-size:clamp(28px,4vw,40px)!important;font-weight:800;letter-spacing:-.02em;line-height:1.1;margin:0 0 10px!important;text-transform:none}
.cpmp-cat-head .cpmp-cat-head__intro{font-size:17px;line-height:1.55;color:#5f5e5a;max-width:680px;margin:0!important}
.cpmp-cat-head .cpmp-cat-head__intro p{margin:0}
.cpmp-cat-label{border-bottom:3px solid var(--wp--preset--color--contrast);margin-bottom:var(--wp--preset--spacing--50)!important}
.cpmp-cat-label p{margin:0 0 6px;font-weight:800;text-transform:uppercase}
/* Pages catégorie : bloc « Les essentiels » (requête sur l'étiquette essentiel, extrait 13) — visible seulement avec l'extrait actif, en page 1, et à partir de 3 articles */
.cpmp-ess{display:none!important;margin-bottom:3rem!important}
body.cpmp-ess-on:not(.paged) .cpmp-ess:has(.wp-block-post:nth-child(3)){display:block!important}
.cpmp-ess .wp-block-query{margin:0}
.cpmp-ess .cpmp-guides__grid{counter-reset:ess;margin:0!important;padding:0!important}
.cpmp-ess .wp-block-post{counter-increment:ess;margin:0!important;display:flex;flex-direction:column;background:var(--g-card);border-radius:16px;overflow:hidden;box-shadow:0 1px 0 rgba(0,0,0,.04);transition:transform .2s ease,box-shadow .2s ease}
.cpmp-ess .wp-block-post:hover{transform:translateY(-3px);box-shadow:0 10px 24px var(--g-shadow)}
.cpmp-ess .wp-block-post-featured-image{margin:0!important;border-radius:0!important;aspect-ratio:16/9;overflow:hidden;background:var(--g-thumb)}
.cpmp-ess .wp-block-post-featured-image a{display:block;height:100%}
.cpmp-ess .wp-block-post-featured-image img{width:100%;height:100%!important;object-fit:cover;border-radius:0!important;transition:transform .35s ease}
.cpmp-ess .wp-block-post:hover .wp-block-post-featured-image img{transform:scale(1.03)}
.cpmp-ess .wp-block-post-title{position:relative;margin:0!important;padding:14px 16px 18px 50px;font-size:16px!important;font-weight:800!important;line-height:1.3!important;letter-spacing:0}
.cpmp-ess .wp-block-post-title::before{content:counter(ess,decimal-leading-zero);position:absolute;left:16px;top:13px;font-size:20px;font-weight:800;line-height:1.1;color:#9b51e0;letter-spacing:-.03em}
.cpmp-ess .wp-block-post-title a{color:var(--g-text)!important;text-decoration:none!important}
.cpmp-ess .wp-block-post:hover .wp-block-post-title a{color:#9b51e0!important}
@media (min-width:601px) and (max-width:900px){.cpmp-ess .wp-block-post-title{font-size:14.5px!important;padding:12px 12px 14px 44px}.cpmp-ess .wp-block-post-title::before{left:12px;font-size:17px}}
@media (max-width:600px){.cpmp-cat-head .cpmp-cat-head__intro{font-size:15.5px}.cpmp-ess .wp-block-post{flex-direction:row;align-items:center}.cpmp-ess .wp-block-post-featured-image{width:112px;flex-shrink:0;align-self:stretch;aspect-ratio:auto!important}.cpmp-ess .wp-block-post-title{font-size:14.5px!important;padding:12px 14px 12px 44px}.cpmp-ess .wp-block-post-title::before{left:12px;top:11px;font-size:17px}}
@media (prefers-reduced-motion:reduce){.cpmp-ess .wp-block-post,.cpmp-ess .wp-block-post-featured-image img{transition:none}.cpmp-ess .wp-block-post:hover{transform:none}}


/* Actualités : le bloc essentiels devient « Les dossiers suivis » (un article par dossier, étiquette essentiel déplacée à chaque rebondissement) */
.cpmp-ess__dos{display:none}
body.category-actualites .cpmp-ess__std{display:none}
body.category-actualites .cpmp-ess__dos{display:inline}



/* Fiche app App Store dans les articles (bloc .cpmp-app, réutilisable) */
.cpmp-app{display:flex;align-items:center;gap:16px;background:#f5f5f5;border-radius:18px;padding:16px 18px;margin:1.8rem 0}
.cpmp-app__icon{flex-shrink:0;line-height:0}
.cpmp-app__icon img{width:64px!important;height:64px!important;border-radius:22%!important;display:block;box-shadow:0 1px 3px rgba(0,0,0,.12)}
.cpmp-app__body{flex:1;min-width:0}
.cpmp-app__name{display:block;font-size:17px;font-weight:800;line-height:1.25;color:#0f0f0f!important;text-decoration:none!important}
.cpmp-app__name:hover{color:#9b51e0!important}
.cpmp-app__meta{display:block;font-size:13.5px;line-height:1.45;color:#5f5e5a;margin-top:3px}
.cpmp-app__btn{flex-shrink:0;color:#fff!important;background:#9b51e0;padding:10px 18px;border-radius:999px;font-size:13px;font-weight:700;text-decoration:none!important;white-space:nowrap;transition:background .15s}
.cpmp-app__btn:hover{background:#7a3bc4}
@media (max-width:600px){.cpmp-app{flex-wrap:wrap;gap:12px 14px;padding:14px}.cpmp-app__icon img{width:56px!important;height:56px!important}.cpmp-app__btn{width:100%;text-align:center}}


/* Barre de menu collée au header : supprime la marge de 32 px entre les deux (09/11/2026) */
.wp-site-blocks > header.wp-block-template-part + * { margin-block-start: 0; }



/* Accueil : guides essentiels animés au défilement, effet « Cascade » (11/11/2026). CSS seul : sans prise en charge du navigateur ou avec « Réduire les animations », le bloc reste fixe. */
@supports (animation-timeline: view()){
@media (prefers-reduced-motion: no-preference){
@keyframes cpmpRise{from{opacity:.15;transform:translateY(56px)}to{opacity:1;transform:none}}
@keyframes cpmpLine{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.cpmp-guides-wrap .cpmp-guides__eyebrow{display:inline-block;position:relative}
.cpmp-guides-wrap .cpmp-guides__eyebrow::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:2px;background:#9b51e0;transform-origin:0 50%;animation:cpmpLine linear both;animation-timeline:view();animation-range:entry 20% cover 40%}
.cpmp-guides-wrap .cpmp-guide{animation:cpmpRise linear both;animation-timeline:view();animation-range:entry 0% cover 30%}
.cpmp-guides-wrap .cpmp-guide:nth-child(3n+2){animation-range:entry 12% cover 38%}
.cpmp-guides-wrap .cpmp-guide:nth-child(3n){animation-range:entry 24% cover 46%}
@media (max-width:600px){.cpmp-guides-wrap .cpmp-guide:nth-child(n){animation-range:entry 0% cover 30%}}
}
}



/* Série Histoire : socle d'animations au défilement sur tous les épisodes (11/11/2026). Ciblage : pages qui contiennent l'encart .cpmp-serie (bloc 10471). CSS seul : sans prise en charge du navigateur ou avec « Réduire les animations », l'article reste fixe. Les paragraphes ne bougent jamais. */
@supports (animation-timeline: view()){
@media (prefers-reduced-motion: no-preference){
@keyframes cpmpHBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes cpmpHUp{from{opacity:.2;transform:translateY(32px)}to{opacity:1;transform:none}}
@keyframes cpmpHUline{from{text-decoration-color:transparent}to{text-decoration-color:currentColor}}
@keyframes cpmpHWipe{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes cpmpHZoom{from{transform:scale(1.18)}to{transform:scale(1)}}
@keyframes cpmpHSlide{from{opacity:.2;transform:translateX(-28px)}to{opacity:1;transform:none}}
/* Barre de lecture violette */
body:has(.cpmp-serie)::after{content:"";position:fixed;top:0;left:0;right:0;height:3px;background:#9b51e0;z-index:100000;pointer-events:none;transform-origin:0 50%;animation:cpmpHBar linear both;animation-timeline:scroll(root)}
/* Intertitres : montent, puis le soulignement apparaît */
body:has(.cpmp-serie) :is(.wp-block-post-content,.entry-content) h2{animation:cpmpHUp linear both;animation-timeline:view();animation-range:entry 0% cover 25%}
body:has(.cpmp-serie) :is(.wp-block-post-content,.entry-content) h2 span{animation:cpmpHUline linear both;animation-timeline:view();animation-range:cover 15% cover 35%}
/* Images : se découvrent de haut en bas */
body:has(.cpmp-serie) :is(.wp-block-post-content,.entry-content) figure.wp-block-image{overflow:hidden;animation:cpmpHWipe linear both;animation-timeline:view();animation-range:entry 0% cover 35%}
body:has(.cpmp-serie) :is(.wp-block-post-content,.entry-content) figure.wp-block-image img{animation:cpmpHZoom linear both;animation-timeline:view();animation-range:entry 0% cover 50%}
/* Citations : glissent depuis la gauche */
body:has(.cpmp-serie) :is(.wp-block-post-content,.entry-content) :is(.cpmp-quote,.wp-block-quote,.wp-block-pullquote){animation:cpmpHSlide linear both;animation-timeline:view();animation-range:entry 0% cover 30%}
/* Listes : arrivent ligne par ligne */
body:has(.cpmp-serie) :is(.wp-block-post-content,.entry-content) ul.wp-block-list>li,body:has(.cpmp-serie) :is(.wp-block-post-content,.entry-content) ol.wp-block-list>li{animation:cpmpHSlide linear both;animation-timeline:view();animation-range:entry 0% cover 22%}
}
}



/* Série Histoire : blocs « moments » réutilisables, à poser en bloc HTML dans un épisode (11/11/2026). .cpmp-days = jours en cartes, .cpmp-frise = frise chronologique, .cpmp-bars = barres de chiffres. Premier usage : Erebor (10130). */
.cpmp-days{margin:2rem 0}
.cpmp-days__head{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#9b51e0;margin:0 0 12px!important}
.cpmp-days__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.cpmp-day{background:#f5f5f5;border-radius:16px;padding:16px 18px 18px;display:flex;flex-direction:column;gap:6px;min-width:0}
.cpmp-day__k{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#8a8a94}
.cpmp-day__d{font-size:26px;font-weight:800;letter-spacing:-.02em;line-height:1.05;color:#0f0f0f}
.cpmp-day__t{font-size:15px!important;line-height:1.5;color:#3d3c39;margin:0!important}
.cpmp-day__t a{color:inherit!important;text-decoration:underline}
.cpmp-day--last{background:#141018}
.cpmp-day--last .cpmp-day__k{color:#9b51e0}
.cpmp-day--last .cpmp-day__d{color:#c69cf2}
.cpmp-day--last .cpmp-day__t,.cpmp-day--last .cpmp-day__t a{color:#d6d6dc!important}
.cpmp-frise{position:relative;margin:2rem 0;padding-left:30px}
.cpmp-frise::before{content:"";position:absolute;left:7px;top:8px;bottom:8px;width:2px;background:#e3e0e8}
.cpmp-frise__fill{position:absolute;left:7px;top:8px;bottom:8px;width:2px;background:#9b51e0;transform-origin:50% 0}
.cpmp-frise__list{list-style:none!important;margin:0!important;padding:0!important;display:flex;flex-direction:column;gap:20px}
.cpmp-frise__item{position:relative;margin:0!important;padding:0!important}
.cpmp-frise__item::before{content:"";position:absolute;left:-29px;top:6px;width:12px;height:12px;border-radius:50%;background:#fff;border:3px solid #9b51e0;box-sizing:border-box}
.cpmp-frise__date{display:block;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#9b51e0;margin:0 0 2px}
.cpmp-frise__text{display:block;font-size:16px;line-height:1.5}
.cpmp-frise__text a{color:inherit!important;text-decoration:underline}
.cpmp-frise__item--last::before{background:#9b51e0}
.cpmp-frise__item--last .cpmp-frise__text{font-weight:800}
.cpmp-bars{margin:2rem 0;background:#f5f5f5;border-radius:18px;padding:20px 20px 16px}
.cpmp-bars__head{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#9b51e0;margin:0 0 14px!important}
.cpmp-bars__row{display:grid;grid-template-columns:minmax(0,9.5rem) minmax(0,1fr) 4.6rem;gap:12px;align-items:center;margin:0 0 12px}
.cpmp-bars__lab{font-size:14px;line-height:1.3;color:#5f5e5a}
.cpmp-bars__lab small{display:block;font-size:12px;color:#8a8a94}
.cpmp-bars__track{height:14px;background:#e9e1f4;border-radius:999px;overflow:hidden}
.cpmp-bars__fill{display:block;height:100%;background:#9b51e0;border-radius:999px;transform-origin:0 50%}
.cpmp-bars__v{font-size:15px;font-weight:800;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.cpmp-bars__src{font-size:12.5px!important;color:#8a8a94;margin:4px 0 0!important}
.cpmp-bars__src a{color:inherit!important;text-decoration:underline}
@media (max-width:600px){.cpmp-days__grid{grid-template-columns:1fr}.cpmp-day__d{font-size:22px}.cpmp-bars{padding:16px 14px 12px}.cpmp-bars__row{grid-template-columns:minmax(0,1fr) 4.2rem;gap:6px 10px}.cpmp-bars__track{grid-column:1/-1;grid-row:2}}
@supports (animation-timeline: view()){
@media (prefers-reduced-motion: no-preference){
@keyframes cpmpMUp{from{opacity:.15;transform:translateY(40px)}to{opacity:1;transform:none}}
@keyframes cpmpMGrowY{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes cpmpMGrowX{from{transform:scaleX(.04)}to{transform:scaleX(1)}}
.cpmp-day{animation:cpmpMUp linear both;animation-timeline:view();animation-range:entry 0% cover 30%}
.cpmp-day:nth-child(2){animation-range:entry 15% cover 40%}
.cpmp-day:nth-child(3){animation-range:entry 30% cover 50%}
.cpmp-frise{view-timeline:--cpmpFrise block}
.cpmp-frise__fill{animation:cpmpMGrowY linear both;animation-timeline:--cpmpFrise;animation-range:entry 60% exit 40%}
.cpmp-frise__item{animation:cpmpMUp linear both;animation-timeline:view();animation-range:entry 0% cover 30%}
.cpmp-bars__fill{animation:cpmpMGrowX linear both;animation-timeline:view();animation-range:entry 20% cover 45%}
@media (max-width:600px){.cpmp-day:nth-child(n){animation-range:entry 0% cover 30%}}
}
}



/* Tout le site : animations légères au défilement (11/11/2026). Règle : naturel, jamais lourd. Barre de lecture sur tous les articles, images qui apparaissent en douceur (hors série Histoire, qui a son propre effet), essentiels des pages catégorie en cascade comme sur l'accueil. Les paragraphes ne bougent jamais. CSS seul, désactivé avec « Réduire les animations ». */
@supports (animation-timeline: view()){
@media (prefers-reduced-motion: no-preference){
@keyframes cpmpSBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes cpmpSFade{from{opacity:.3;transform:translateY(20px)}to{opacity:1;transform:none}}
body.single-post::after{content:"";position:fixed;top:0;left:0;right:0;height:3px;background:#9b51e0;z-index:100000;pointer-events:none;transform-origin:0 50%;animation:cpmpSBar linear both;animation-timeline:scroll(root)}
body.single-post:not(:has(.cpmp-serie)) :is(.wp-block-post-content,.entry-content) figure.wp-block-image{animation:cpmpSFade linear both;animation-timeline:view();animation-range:entry 0% cover 20%}
.cpmp-ess .wp-block-post{animation:cpmpRise linear both;animation-timeline:view();animation-range:entry 0% cover 30%}
.cpmp-ess .wp-block-post:nth-child(3n+2){animation-range:entry 12% cover 38%}
.cpmp-ess .wp-block-post:nth-child(3n){animation-range:entry 24% cover 46%}
@media (max-width:600px){.cpmp-ess .wp-block-post:nth-child(n){animation-range:entry 0% cover 30%}}
}
}


/* Essentiels des pages catégorie : la cascade passe par « translate » pour garder l'effet de survol (qui utilise « transform ») */
@supports (animation-timeline: view()){
@media (prefers-reduced-motion: no-preference){
@keyframes cpmpRiseT{from{opacity:.15;translate:0 56px}to{opacity:1;translate:none}}
.cpmp-ess .wp-block-post{animation-name:cpmpRiseT}
}
}



/* Pages fixes : animations légères au défilement (11/11/2026). Série Histoire, À propos, Shop, Newsletter, Podcast. Liens, Contact et Mentions légales volontairement sans effet. Les survols existants passent par « transform », les animations par « translate » / « scale » pour ne pas les casser. */
@supports (animation-timeline: view()){
@media (prefers-reduced-motion: no-preference){
@keyframes cpmpPUp{from{opacity:.15;translate:0 44px}to{opacity:1;translate:none}}
@keyframes cpmpPLine{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes cpmpPHero{from{scale:1.06}to{scale:1}}

/* Série Histoire : un fil violet relie les épisodes et se remplit en descendant, les cartes arrivent une par une */
body.page-id-10469 .cpmp-episodes{position:relative;padding-left:24px!important;view-timeline:--cpmpEpisodes block}
body.page-id-10469 .cpmp-episodes::before{content:"";position:absolute;left:6px;top:10px;bottom:10px;width:3px;border-radius:3px;background:#e9e1f4}
body.page-id-10469 .cpmp-episodes::after{content:"";position:absolute;left:6px;top:10px;bottom:10px;width:3px;border-radius:3px;background:#9b51e0;transform-origin:50% 0;animation:cpmpPLine linear both;animation-timeline:--cpmpEpisodes;animation-range:entry 40% exit 60%}
body.page-id-10469 .cpmp-episode{animation:cpmpPUp linear both;animation-timeline:view();animation-range:entry 0% cover 25%}
@media (max-width:600px){body.page-id-10469 .cpmp-episodes{padding-left:18px!important}body.page-id-10469 .cpmp-episodes::before,body.page-id-10469 .cpmp-episodes::after{left:3px}}

/* À propos : portrait qui se pose, cartes du setup en cascade */
body.page-id-2 .cpmp-about-hero img{animation:cpmpPHero linear both;animation-timeline:scroll(root);animation-range:0 420px}
body.page-id-2 .cpmp-setup-card{animation:cpmpPUp linear both;animation-timeline:view();animation-range:entry 0% cover 28%}
body.page-id-2 .cpmp-setup-card:nth-child(3n+2){animation-range:entry 8% cover 34%}
body.page-id-2 .cpmp-setup-card:nth-child(3n){animation-range:entry 16% cover 40%}

/* Shop : produits en cascade */
body.page-id-8627 .product-card{animation:cpmpPUp linear both;animation-timeline:view();animation-range:entry 0% cover 30%}
body.page-id-8627 .product-card:nth-child(3n+2){animation-range:entry 12% cover 38%}
body.page-id-8627 .product-card:nth-child(3n){animation-range:entry 24% cover 46%}

/* Newsletter : cartes en cascade, traits violets qui se dessinent */
body.page-id-7619 .nl-card{animation:cpmpPUp linear both;animation-timeline:view();animation-range:entry 0% cover 30%}
body.page-id-7619 .nl-card:nth-child(even){animation-range:entry 12% cover 38%}
body.page-id-7619 .nl-why-item{position:relative;border-left-color:transparent!important}
body.page-id-7619 .nl-why-item::before{content:"";position:absolute;left:-3px;top:0;bottom:0;width:3px;background:#9b51e0;transform-origin:50% 0;animation:cpmpPLine linear both;animation-timeline:view();animation-range:entry 10% cover 40%}

/* Podcast : visuel qui se pose, plateformes l'une après l'autre */
body.page-id-9938 .cpmp-podcast-hero img{animation:cpmpPHero linear both;animation-timeline:scroll(root);animation-range:0 420px}
body.page-id-9938 .cpmp-podcast-btn{animation:cpmpPUp linear both;animation-timeline:view();animation-range:entry 0% cover 25%}

@media (max-width:600px){body.page-id-2 .cpmp-setup-card:nth-child(n),body.page-id-8627 .product-card:nth-child(n),body.page-id-7619 .nl-card:nth-child(n){animation-range:entry 0% cover 28%}}
}
}



/* ===== Accueil v2 (11/11/2026) : dernier article animé, bandeau de chiffres, rail Série Histoire épinglé. Inspiré de scroll-craft, CSS seul. Sans prise en charge : version fixe (rail défilant au doigt). ===== */

/* Bandeau de chiffres */
.cpmp-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;border-top:1px solid #e6e3ea;border-bottom:1px solid #e6e3ea;padding:28px 0;margin:0 0 var(--wp--preset--spacing--50)}
.cpmp-stats__item{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;min-width:0}
.cpmp-stats__n{font-size:48px;font-weight:800;line-height:1;letter-spacing:-.03em;color:#9b51e0;font-variant-numeric:tabular-nums}
.cpmp-stats__l{font-size:14px;line-height:1.35;color:#5f5e5a;max-width:220px}
@media (max-width:600px){.cpmp-stats{gap:8px;padding:20px 0}.cpmp-stats__n{font-size:32px}.cpmp-stats__l{font-size:12px}}

/* Rail Série Histoire : version de base (fixe, défilement horizontal au doigt) */
.cpmp-rail{position:relative;margin-top:var(--wp--preset--spacing--70)!important;margin-bottom:var(--wp--preset--spacing--70)!important;background:#141018 radial-gradient(90% 120% at 0% 0%,rgba(155,81,224,.28),transparent 60%);color:#f4f4f6;padding:56px 0}
.cpmp-rail__sticky{position:relative;z-index:1;max-width:1240px;margin:0 auto!important;padding:0 24px}
.cpmp-rail__head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin:0 0 28px}
.cpmp-rail__heading{color:#fff!important;font-size:30px!important;font-weight:800;line-height:1.12;letter-spacing:-.015em;margin:0 0 10px!important}
.cpmp-rail__sub{color:#bdbdc6!important;font-size:15px;line-height:1.55;margin:0!important;max-width:460px}
.cpmp-rail__query{margin:0!important}
.cpmp-rail .wp-block-post-template{display:flex!important;gap:18px;list-style:none;margin:0!important;padding:0 0 10px!important;overflow-x:auto;scroll-snap-type:x mandatory;counter-reset:ep}
.cpmp-rail .wp-block-post{flex:0 0 min(78vw,380px);margin:0!important;scroll-snap-align:start;counter-increment:ep;display:flex;flex-direction:column;gap:12px}
.cpmp-rail .wp-block-post-featured-image{margin:0!important;border-radius:14px!important;overflow:hidden;border:2px solid rgba(155,81,224,.55)}
.cpmp-rail .wp-block-post-featured-image img{border-radius:0!important;transition:transform .35s ease}
.cpmp-rail .wp-block-post:hover .wp-block-post-featured-image img{transform:scale(1.03)}
.cpmp-rail .wp-block-post-title{margin:0!important;font-size:17px!important;font-weight:800;line-height:1.3}
.cpmp-rail .wp-block-post-title::before{content:"Épisode " counter(ep,decimal-leading-zero);display:block;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#c69cf2;margin:0 0 6px}
.cpmp-rail .wp-block-post-title a{color:#fff!important;text-decoration:none!important}
.cpmp-rail .wp-block-post:hover .wp-block-post-title a{color:#c69cf2!important}
@media (max-width:600px){.cpmp-rail{padding:40px 0}.cpmp-rail__sticky{padding:0 16px}.cpmp-rail__heading{font-size:24px!important}.cpmp-rail .wp-block-post-title{font-size:15px!important}}

/* Dernier article : arrivée du titre et du résumé au chargement */
@media (prefers-reduced-motion: no-preference){
@keyframes cpmpLastIn{from{opacity:0;translate:0 22px;clip-path:inset(0 0 100% 0)}to{opacity:1;translate:none;clip-path:inset(0 0 0 0)}}
@keyframes cpmpLastFade{from{opacity:0;translate:0 10px}to{opacity:1;translate:none}}
.cpmp-last .wp-block-post-title{animation:cpmpLastIn .9s cubic-bezier(.2,.7,.2,1) .15s both}
.cpmp-last .wp-block-post-excerpt,.cpmp-last .wp-block-post-author-name{animation:cpmpLastFade .7s ease .5s both}
}

@supports (animation-timeline: view()){
@media (prefers-reduced-motion: no-preference){
/* Dernier article : parallaxe douce de l'image */
@keyframes cpmpLastPara{from{translate:0 -3%}to{translate:0 6%}}
.cpmp-last .wp-block-post-featured-image{overflow:hidden}
.cpmp-last .wp-block-post-featured-image img{scale:1.12;animation:cpmpLastPara linear both;animation-timeline:scroll(root);animation-range:0 900px}

/* Chiffres qui comptent */
@property --cpmpN{syntax:"<integer>";initial-value:0;inherits:false}
@keyframes cpmpCount{from{--cpmpN:0}to{--cpmpN:var(--to)}}
.cpmp-count{display:inline-block;font-size:0;counter-reset:cpmpn var(--cpmpN);animation:cpmpCount linear both;animation-timeline:view();animation-range:entry 20% cover 50%}
.cpmp-count::after{content:counter(cpmpn);font-size:48px}
@media (max-width:600px){.cpmp-count::after{font-size:32px}}

/* Rail épinglé : la page passe au sombre, la section reste fixe et les épisodes défilent de droite à gauche */
@keyframes cpmpRailBg{0%{opacity:0}14%{opacity:1}86%{opacity:1}100%{opacity:0}}
@keyframes cpmpRailX{from{transform:translateX(0)}to{transform:translateX(min(0px,calc(-100% + 100vw - 48px)))}}
.cpmp-rail{height:260vh;padding:0;background:none;view-timeline:--cpmpRail block}
.cpmp-rail::before{content:"";position:absolute;inset:0;background:#141018 radial-gradient(90% 60% at 0% 30%,rgba(155,81,224,.28),transparent 60%);animation:cpmpRailBg linear both;animation-timeline:--cpmpRail;animation-range:cover 0% cover 100%}
.cpmp-rail__sticky{position:sticky;top:0;height:100vh;max-width:none;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding:0 24px}
.cpmp-rail__head{max-width:1192px;width:100%;margin:0 auto 32px}
.cpmp-rail .wp-block-post-template{overflow:visible;width:max-content;scroll-snap-type:none;animation:cpmpRailX linear both;animation-timeline:--cpmpRail;animation-range:contain 0% contain 100%}
.cpmp-rail .wp-block-post{flex:0 0 380px}
@media (max-width:600px){.cpmp-rail{height:220vh}.cpmp-rail__sticky{padding:0 16px}.cpmp-rail .wp-block-post{flex:0 0 78vw}@keyframes cpmpRailX{from{transform:translateX(0)}to{transform:translateX(min(0px,calc(-100% + 100vw - 32px)))}}}
}
}


/* Accueil v2 : déclaration du compteur au niveau racine (certains navigateurs refusent @property imbriqué) */
@property --cpmpN{syntax:"<integer>";initial-value:0;inherits:false}



/* Accueil v2, correctif du 11/11 (15 h 25) : bandeau de chiffres retiré du modèle à la demande de David ; rail Série Histoire non épinglé (l'épinglage ne fonctionnait pas chez lui). Le rail défile au doigt / au trackpad, la carte qui arrive grandit et s'éclaire. Annule les règles « Rail épinglé » plus haut. */
.cpmp-rail .wp-block-post-template{scrollbar-width:thin;scrollbar-color:#9b51e0 rgba(255,255,255,.08);-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;padding-bottom:14px!important}
.cpmp-rail .wp-block-post-template::-webkit-scrollbar{height:6px}
.cpmp-rail .wp-block-post-template::-webkit-scrollbar-thumb{background:#9b51e0;border-radius:6px}
.cpmp-rail .wp-block-post-template::-webkit-scrollbar-track{background:rgba(255,255,255,.08);border-radius:6px}
@supports (animation-timeline: view()){
.cpmp-rail{height:auto;padding:56px 0;background:#141018 radial-gradient(90% 120% at 0% 0%,rgba(155,81,224,.28),transparent 60%);view-timeline:none}
.cpmp-rail::before{content:none;animation:none}
.cpmp-rail__sticky{position:relative;top:auto;height:auto;max-width:1240px;display:block;overflow:visible;padding:0 24px}
.cpmp-rail__head{max-width:none;margin:0 0 28px}
.cpmp-rail .wp-block-post-template{overflow-x:auto;width:auto;scroll-snap-type:x mandatory;animation:none;transform:none}
.cpmp-rail .wp-block-post{flex:0 0 min(78vw,380px)}
@media (max-width:600px){.cpmp-rail{height:auto;padding:40px 0}.cpmp-rail__sticky{padding:0 16px}.cpmp-rail .wp-block-post{flex:0 0 78vw}}
@media (prefers-reduced-motion: no-preference){
@keyframes cpmpRailCard{from{opacity:.35;scale:.9}to{opacity:1;scale:1}}
.cpmp-rail .wp-block-post{animation:cpmpRailCard linear both;animation-timeline:view(inline);animation-range:entry 0% entry 100%}
}
}



/* Accueil, 11/11 (15 h 30) : retour de l'encart Série Histoire d'origine (.cpmp-histo) à la demande de David, le rail faisait « gros pavé ». Seule animation : l'image du dernier épisode arrive depuis le bord droit et se pose à sa place. Les règles .cpmp-rail plus haut ne servent plus. */
@supports (animation-timeline: view()){
@media (prefers-reduced-motion: no-preference){
@keyframes cpmpHistoImg{from{opacity:.1;translate:160px 0}to{opacity:1;translate:none}}
.cpmp-histo__last{animation:cpmpHistoImg linear both;animation-timeline:view();animation-range:entry 0% cover 40%}
@media (max-width:781px){@keyframes cpmpHistoImg{from{opacity:.1;translate:90px 0}to{opacity:1;translate:none}}}
}
}



/* Correctif 11/11 (15 h 35) : un parent en overflow:hidden devient un conteneur de défilement, donc view() s'y accroche et l'animation ne part jamais. On passe par une timeline nommée posée sur un élément dont le défilement est celui de la page. */
@supports (animation-timeline: view()){
@media (prefers-reduced-motion: no-preference){
/* Accueil : image du dernier épisode Histoire qui arrive du bord droit */
.cpmp-histo{view-timeline:--cpmpHisto block}
.cpmp-histo__last{animation:cpmpHistoImg linear both;animation-timeline:--cpmpHisto;animation-range:entry 0% cover 45%}
/* Barres des articles (Erebor, Allbirds) : la timeline vient de la ligne, pas de la piste */
.cpmp-bars__row{view-timeline:--cpmpBarRow block}
.cpmp-bars__fill{animation-timeline:--cpmpBarRow}
/* Série Histoire : léger dézoom des images, timeline prise sur la figure */
body:has(.cpmp-serie) :is(.wp-block-post-content,.entry-content) figure.wp-block-image{view-timeline:--cpmpFig block}
body:has(.cpmp-serie) :is(.wp-block-post-content,.entry-content) figure.wp-block-image img{animation-timeline:--cpmpFig}
/* Shop : le conteneur coupait en overflow-x:hidden, on passe en clip (même rendu, sans créer de zone de défilement) */
body.page-id-8627 .shop-wrap{overflow-x:clip}
}
}



/* Newsletter accueil, 11/11 (15 h 40) : l'enveloppe glisse désormais par translate/rotate (pris en charge par le GPU) au lieu d'animer « left », qui saccadait au milieu depuis l'animation du dernier article. Même trajet, même rebond, même durée. Le titre du dernier article n'anime plus de clip-path (moins de travail au chargement). */
.cpmp-nl--inline::before{transform:none;rotate:-10deg}
.cpmp-nl--inline.cpmp-anim::before{left:var(--env-x);transform:none;translate:100vw 0;rotate:18deg;will-change:translate,rotate}
.cpmp-nl--inline.cpmp-anim.is-in::before{animation:cpmpEnvGlide 1.6s cubic-bezier(.22,1.2,.36,1) forwards}
@keyframes cpmpEnvGlide{from{translate:100vw 0;rotate:18deg}to{translate:0 0;rotate:-10deg}}
@keyframes cpmpLastIn{from{opacity:0;translate:0 22px}to{opacity:1;translate:none}}
@media (prefers-reduced-motion:reduce){.cpmp-nl--inline.cpmp-anim::before,.cpmp-nl--inline.cpmp-anim.is-in::before{animation:none!important;left:var(--env-x)!important;transform:none!important;translate:0 0!important;rotate:-10deg!important}}



/* Accueil, 11/11 (20 h 25) : cascade des guides essentiels accentuée à la demande de David (trop discrète sur Mac). Départ plus bas, léger zoom, décalage plus marqué entre colonnes, effet étalé sur une plus grande partie du défilement. Version téléphone inchangée en amplitude. */
@supports (animation-timeline: view()){
@media (prefers-reduced-motion: no-preference){
@keyframes cpmpGuideRise{from{opacity:0;transform:translateY(110px) scale(.92)}to{opacity:1;transform:none}}
.cpmp-guides-wrap .cpmp-guide{animation-name:cpmpGuideRise;animation-range:entry 0% cover 42%}
.cpmp-guides-wrap .cpmp-guide:nth-child(3n+2){animation-range:entry 18% cover 52%}
.cpmp-guides-wrap .cpmp-guide:nth-child(3n){animation-range:entry 36% cover 62%}
@media (max-width:600px){.cpmp-guides-wrap .cpmp-guide:nth-child(n){animation-name:cpmpRise;animation-range:entry 0% cover 30%}}
}
}



/* Pages catégorie, 11/11 (20 h 27) : même cascade accentuée que sur l'accueil pour les blocs « Les essentiels » et « Les dossiers suivis », par cohérence. Passe par translate/scale pour garder le survol. Téléphone inchangé. */
@supports (animation-timeline: view()){
@media (prefers-reduced-motion: no-preference){
@keyframes cpmpEssRise{from{opacity:0;translate:0 110px;scale:.92}to{opacity:1;translate:none;scale:1}}
.cpmp-ess .wp-block-post{animation-name:cpmpEssRise;animation-range:entry 0% cover 42%}
.cpmp-ess .wp-block-post:nth-child(3n+2){animation-range:entry 18% cover 52%}
.cpmp-ess .wp-block-post:nth-child(3n){animation-range:entry 36% cover 62%}
@media (max-width:600px){.cpmp-ess .wp-block-post:nth-child(n){animation-name:cpmpRiseT;animation-range:entry 0% cover 30%}}
}
}



/* (11/11, 23 h 20) Mode sombre des pages Liens et Newsletter déplacé dans le contenu de ces pages, comme le Shop : des règles media query de couleur système dans ce CSS commun faisaient croire à l'extension Noir que tout le site avait un mode sombre, et elle cessait d'assombrir les autres pages. Ne jamais mettre de media query de couleur système ici. */

/* Liens, mode clair */
@media (min-width:100000px){
body.page-id-7539 .lp-avatar-ring img{border-color:#fff}
body.page-id-7539 .lp-name{color:#1a1a2e}
body.page-id-7539 .lp-bio{color:#5f5e66}
body.page-id-7539 .lp-btn{background:#f0ecff;border:1.5px solid #d4c8ff;color:#1a1a2e}
body.page-id-7539 .lp-arrow{color:#7a5fd6}
body.page-id-7539 .lp-btn-amazon{background:#fff8ec;border-color:#ffd98a;color:#7a4f00}
body.page-id-7539 .lp-btn-amazon .lp-arrow{color:#b37700}
body.page-id-7539 .lp-btn-ultrahuman{background:#000;border-color:rgba(255,255,255,.18);color:#f2f2f2}
body.page-id-7539 .lp-btn-ultrahuman .lp-arrow{color:#bdbdbd}
}
/* Liens, mode sombre */
@media (min-width:100000px){
body.page-id-7539,body.page-id-7539 .wp-site-blocks,body.page-id-7539 main{background:#111517!important}
body.page-id-7539 .lp-avatar-ring img{border-color:#111517}
body.page-id-7539 .lp-name{color:#f4f0ff}
body.page-id-7539 .lp-bio{color:#b3a9c9}
body.page-id-7539 .lp-btn{background:#1e1830;border:1.5px solid rgba(180,100,255,.4);color:#ede6ff}
body.page-id-7539 .lp-arrow{color:#b9a4f5}
body.page-id-7539 .lp-btn-amazon{background:#231c10;border-color:rgba(255,153,0,.45);color:#ffe4a0}
body.page-id-7539 .lp-btn-amazon .lp-arrow{color:#f0a830}
body.page-id-7539 .lp-btn-ultrahuman{background:#000;border-color:rgba(255,255,255,.22);color:#f2f2f2}
}

/* Newsletter, mode sombre */
@media (min-width:100000px){
body.page-id-7619,body.page-id-7619 .wp-site-blocks,body.page-id-7619 main{background:#111517!important}
body.page-id-7619 .nl-page{color:#ececf0!important}
body.page-id-7619 .nl-h1,body.page-id-7619 .nl-h2,body.page-id-7619 .nl-card-title,body.page-id-7619 .nl-why-item h3,body.page-id-7619 .nl-form-intro h2,body.page-id-7619 .nl-author h2{color:#ffffff!important}
body.page-id-7619 .nl-h1 span,body.page-id-7619 .nl-h2 span,body.page-id-7619 .nl-intro strong{color:#c69cf2!important}
body.page-id-7619 .nl-tagline,body.page-id-7619 .nl-intro,body.page-id-7619 .nl-card-desc,body.page-id-7619 .nl-why-item p,body.page-id-7619 .nl-author p,body.page-id-7619 .nl-form-intro p{color:#d9d6e0!important;opacity:1!important}
body.page-id-7619 .nl-card,body.page-id-7619 .nl-author{background:#1b1624!important;border-color:rgba(155,81,224,.38)!important}
body.page-id-7619 .nl-card:hover{background:#231c30!important;border-color:rgba(155,81,224,.65)!important}
body.page-id-7619 .nl-author a{color:#c69cf2!important}
body.page-id-7619 .nl-author a:hover{color:#e0c6fb!important}
body.page-id-7619 .nl-legal{color:#b8b4c2!important;opacity:1!important}
body.page-id-7619 .nl-form-block .wp-block-jetpack-subscriptions__textfield input[type="email"]{background:#1b1624!important;color:#ffffff!important;border-color:rgba(155,81,224,.55)!important}
body.page-id-7619 .nl-form-block .wp-block-jetpack-subscriptions__textfield input[type="email"]::placeholder{color:rgba(255,255,255,.5)!important}
}




/* Articles, 12/11/2026 : bouton « Ajouter ce blog à mes sources préférées » (Google Preferred Sources) sous la date, dans l'en-tête de l'article (modèle single). Lien direct vers google.com/preferences/source?q=cestpourmapomme.com, ouvert dans un nouvel onglet. */
.cpmp-gsource{display:flex;justify-content:center;margin-top:var(--wp--preset--spacing--40)!important}
.cpmp-gsource__btn{display:inline-flex;align-items:center;gap:10px;padding:11px 22px;border-radius:999px;border:1.5px solid rgba(255,255,255,.28);background:rgba(255,255,255,.04);color:inherit!important;font-size:15px;line-height:1.3;text-decoration:none!important;transition:border-color .2s ease,background .2s ease,transform .2s ease}
.cpmp-gsource__btn strong{font-weight:800}
.cpmp-gsource__g{flex-shrink:0;width:20px;height:20px}
.cpmp-gsource__btn:hover{border-color:#9b51e0;background:rgba(155,81,224,.14);transform:translateY(-1px)}
.cpmp-gsource__btn:focus-visible{outline:2px solid #9b51e0;outline-offset:3px}
@media (max-width:600px){.cpmp-gsource__btn{font-size:13.5px;padding:10px 16px;gap:8px}}
@media (prefers-reduced-motion:reduce){.cpmp-gsource__btn{transition:none}.cpmp-gsource__btn:hover{transform:none}}




/* Articles, 13/11/2026 : encart Ko-fi « Ce blog vous est utile ? », placé automatiquement par le modèle single avant l'intertitre (H2) le plus proche du milieu de l'article ; pas d'encart sous 3 intertitres. Même famille visuelle que .cpmp-app. */
.cpmp-kofi{display:flex;align-items:center;gap:18px;background:#f5f5f5;border:1.5px solid #e3d4f5;border-radius:18px;padding:20px 22px;margin:2.2rem 0!important;color:#0f0f0f}
.cpmp-kofi[hidden]{display:none}
.cpmp-kofi__icon{flex-shrink:0;color:#0f0f0f;line-height:0}
.cpmp-kofi__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.cpmp-kofi__title{font-size:18px;font-weight:800;line-height:1.25}
.cpmp-kofi__text{font-size:14.5px;line-height:1.5;color:#5f5e5a}
.cpmp-kofi__btn{flex-shrink:0;color:#fff!important;background:#9b51e0;padding:11px 20px;border-radius:999px;font-size:14px;font-weight:700;text-decoration:none!important;white-space:nowrap;transition:background .15s}
.cpmp-kofi__btn:hover{background:#7a3bc4}
.cpmp-kofi__btn::after{content:" \2192"}
@media (max-width:600px){.cpmp-kofi{flex-wrap:wrap;gap:12px 14px;padding:16px}.cpmp-kofi__icon svg{width:38px;height:38px}.cpmp-kofi__body{flex-basis:calc(100% - 56px)}.cpmp-kofi__btn{width:100%;text-align:center}}
@supports (animation-timeline: view()){@media (prefers-reduced-motion: no-preference){.cpmp-kofi{animation:cpmpSFade linear both;animation-timeline:view();animation-range:entry 0% cover 20%}}}



/* Encart Ko-fi, correctif iPhone 13/11 (00 h 25) : le bouton pleine largeur débordait à droite (padding ajouté à la largeur). */
.cpmp-kofi,.cpmp-kofi__btn{box-sizing:border-box}
@media (max-width:600px){.cpmp-kofi{align-items:flex-start}.cpmp-kofi__icon{margin-top:4px}.cpmp-kofi__btn{display:block;max-width:100%}}



/* Perf, 13/11/2026 : l'image de fond de l'encart Podcast (accueil) passait en PNG d'origine de 1,9 Mo. On la sert via le CDN Photon, redimensionnée à 900 px de large et convertie en WebP pour les navigateurs qui le gèrent. Le style en ligne du modèle n'est plus téléchargé. */
.cpmp-cta__podcast-image{background-image:url('https://i0.wp.com/cestpourmapomme.com/wp-content/uploads/2026/08/c26c513f-666b-4172-a4a1-d9fde6f1d29c.png?w=900&ssl=1')!important}



/* Boutons de partage Jetpack, 13/11/2026 : style maison monochrome. Pastilles grises qui passent au violet du site au survol, titre « Partager » en sur-titre violet comme les encarts du site, bouton « Plus » assorti. */
body .sharedaddy .sd-title{font-size:11px!important;font-weight:700!important;letter-spacing:.16em;text-transform:uppercase;color:#9b51e0!important;margin:0 0 12px!important}
body .sharedaddy .sd-title::before{display:none!important}
body .sd-social-icon .sd-content ul{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0!important}
body .sd-social-icon .sd-content ul li{margin:0!important}
body .sd-social-icon .sd-content ul li[class*='share-'] a.sd-button{width:44px!important;height:44px!important;padding:0!important;display:inline-flex!important;align-items:center;justify-content:center;border-radius:50%!important;background:#f5f5f5!important;color:#0f0f0f!important;border:1.5px solid #e6e3ea!important;box-shadow:none!important;transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease}
body .sd-social-icon .sd-content ul li[class*='share-'] a.sd-button::before{color:inherit!important;top:0!important;font-size:20px!important}
body .sd-social-icon .sd-content ul li[class*='share-'] a.sd-button:hover{background:#9b51e0!important;color:#fff!important;border-color:#9b51e0!important;transform:translateY(-2px)}
body .sharedaddy a.sd-button.share-more{height:44px!important;display:inline-flex!important;align-items:center;gap:6px;padding:0 18px!important;border-radius:999px!important;background:#f5f5f5!important;color:#0f0f0f!important;border:1.5px solid #e6e3ea!important;box-shadow:none!important;font-size:14px!important;font-weight:700!important;transition:background .2s ease,color .2s ease,border-color .2s ease}
body .sharedaddy a.sd-button.share-more span{color:inherit!important}
body .sharedaddy a.sd-button.share-more:hover{background:#9b51e0!important;color:#fff!important;border-color:#9b51e0!important}
body .sharedaddy a.sd-button.share-more::before{color:inherit!important}
@media (prefers-reduced-motion:reduce){body .sd-social-icon .sd-content ul li[class*='share-'] a.sd-button:hover{transform:none}}



/* Boutons de partage, correctif 13/11 (09 h 05) à la demande de David : plus de cercles, logos seuls en violet et plus gros. Remplace le style en pastilles juste au-dessus. */
body .sharedaddy .sd-content ul{gap:22px!important}
body .sharedaddy .sd-content ul li a.sd-button,body .sd-social-icon .sd-content ul li[class*='share-'] a.sd-button{width:auto!important;height:auto!important;min-width:0!important;padding:4px!important;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;color:#9b51e0!important;opacity:1!important}
body .sharedaddy .sd-content ul li a.sd-button::before,body .sd-social-icon .sd-content ul li[class*='share-'] a.sd-button::before{color:#9b51e0!important;font-size:32px!important;width:32px!important;height:32px!important;line-height:32px!important;top:0!important;opacity:1!important;transition:color .2s ease,transform .2s ease;display:inline-block}
body .sharedaddy .sd-content ul li a.sd-button:hover,body .sd-social-icon .sd-content ul li[class*='share-'] a.sd-button:hover{background:none!important;border:0!important;transform:none!important}
body .sharedaddy .sd-content ul li a.sd-button:hover::before{color:#7a3bc4!important;transform:translateY(-2px) scale(1.08)}
body .sharedaddy a.sd-button.share-more{height:auto!important;padding:4px!important;background:none!important;border:0!important;border-radius:0!important;color:#9b51e0!important;font-size:16px!important;font-weight:700!important;gap:8px}
body .sharedaddy a.sd-button.share-more::before{font-size:26px!important;width:26px!important;height:26px!important;line-height:26px!important}
body .sharedaddy a.sd-button.share-more:hover{background:none!important;color:#7a3bc4!important}
@media (prefers-reduced-motion:reduce){body .sharedaddy .sd-content ul li a.sd-button:hover::before{transform:none}}



/* Boutons de partage, 13/11 (09 h 10) : mise en ligne façon « PARTAGER  f X in » sur une seule rangée, d'après le modèle envoyé par David. Le « Plus » ne garde que son icône. */
body .sharedaddy .sd-block{display:flex!important;align-items:center;flex-wrap:wrap;gap:6px 18px}
body .sharedaddy .sd-title{display:inline-block!important;margin:0!important;font-size:15px!important;letter-spacing:.06em;color:#0f0f0f!important}
body .sharedaddy .sd-content{display:inline-block}
body .sharedaddy .sd-content ul{gap:16px!important}
body .sharedaddy .sd-content ul li a.sd-button::before,body .sd-social-icon .sd-content ul li[class*='share-'] a.sd-button::before{font-size:28px!important;width:28px!important;height:28px!important;line-height:28px!important}
body .sharedaddy a.sd-button.share-more span{display:none!important}
body .sharedaddy a.sd-button.share-more{gap:0}
body .sharedaddy a.sd-button.share-more::before{font-size:24px!important}



/* Boutons de partage, 13/11 (09 h 10) : « PARTAGER » en violet et aligné sur la rangée de logos (le lien « Personnaliser », visible seulement connecté, décalait le centrage). */
body .sharedaddy .sd-block{align-items:flex-start!important}
body .sharedaddy .sd-title{color:#9b51e0!important;line-height:36px!important;height:36px}
body .sharedaddy .sd-content ul li a.sd-button{line-height:0!important;vertical-align:top}



/* Bouton « J'aime » Jetpack, 13/11 (09 h 12) : le bouton est une iframe de WordPress.com, son cadre n'est pas stylable. On met « J'AIME ÇA » sur la même ligne que le bouton, comme « PARTAGER », et on passe la couleur violette aux liens de l'iframe (Jetpack lit .sd-link-color). */
body .sharedaddy.sd-like{display:flex!important;align-items:flex-start;flex-wrap:wrap;gap:6px 18px}
body .sharedaddy.sd-like .sd-title{line-height:36px!important;height:36px;margin:0!important}
body .sharedaddy.sd-like .sd-link-color{color:#9b51e0!important}
body .sharedaddy.sd-like .sd-text-color{color:#5f5e5a!important}



/* Bouton « J'aime » Jetpack masqué sur tout le site, 13/11 (09 h 15), à la demande de David : iframe non stylable, peu utilisé. Masqué, il n'est jamais visible, donc Jetpack ne charge pas son iframe. Pour le couper à la source : Jetpack > Réglages > Partage > « J'aime ». */
body .sharedaddy.sd-like,body .jetpack-likes-widget-wrapper{display:none!important}