/* Page d'accueil Clipser : piste C « Du carton au jardin » */
.clpa{--encre:#1E1B4B;--encre-c:#2C2860;--papier:#FFF8EF;--lilas:#D9D6F2;--peche:#FFB59E;--corail:#E2552C;
  background:var(--encre);color:var(--papier);font-family:Fredoka,'Arial Rounded MT Bold',system-ui,sans-serif;overflow:hidden}
.clpa a{color:var(--papier)}
.clpa a:hover{color:var(--peche)}
.clpa-in,.clpa-zone,.clpa-hero{max-width:1240px;margin:0 auto;padding-left:24px;padding-right:24px;box-sizing:border-box}
.clpa-h2{margin:0;font-size:clamp(32px,4vw,44px);font-weight:700;line-height:1.08}
.clpa-centre{text-align:center;margin-bottom:28px}
.clpa-intro{margin:0;font-size:clamp(17px,1.6vw,20px);line-height:1.5;color:var(--lilas);max-width:46ch}
.clpa-sur{margin:0 0 8px;font-size:15px;font-weight:600;color:var(--peche)}
.clpa-btn{display:inline-flex;align-items:center;min-height:56px;padding:0 28px;border-radius:999px;background:var(--corail);color:#fff!important;text-decoration:none;font-size:19px;font-weight:600}
.clpa-btn-encre{background:var(--encre)}

/* ---------- Haut de page ---------- */
.clpa-hero{padding-top:28px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:22px}
.clpa-anim{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 28px;width:100%;max-width:640px}
.clpa-pot{width:200px;height:200px;flex:none}
.clpa-cote{position:relative;width:340px;max-width:100%;height:150px;text-align:left}
.clpa-objets{position:absolute;left:0;top:40px;width:100%;height:70px;font-size:50px;font-weight:700;line-height:70px}
.clpa-w{position:absolute;left:0;top:0;white-space:nowrap;opacity:0}
.clpa-signature{position:absolute;left:0;top:18px;display:flex;flex-direction:column;gap:8px}
.clpa-mot svg{display:block;width:320px;max-width:100%;height:auto}
.clpa-mot-txt{font-size:84px;line-height:1}
.clpa-base{margin:0;font-size:19px;font-weight:500;color:var(--lilas)}
.clpa-titre{margin:12px 0 0;font-size:clamp(40px,6vw,76px);line-height:1.02;font-weight:700;letter-spacing:-1px;max-width:16ch;color:var(--papier)}
.clpa-titre span{color:var(--peche)}

/* Animation (une fois) : pot à plat → plié → la plante sort → les objets s'écrivent → clipser */
.clpa-pot{animation:clpaPot .4s ease-out both}
.clpa-g{transform-box:view-box;transform-origin:62px 93px;animation:clpaPli .8s cubic-bezier(.5,0,.2,1) .6s both}
.clpa-d{transform-box:view-box;transform-origin:82px 93px;animation:clpaPli .8s cubic-bezier(.5,0,.2,1) .9s both}
.clpa-r{opacity:0;animation:clpaRain 1.5s linear both}
.clpa-f1{transform-box:view-box;transform-origin:72px 66px;animation:clpaF1 .55s ease-out 1.8s both}
.clpa-f2{transform-box:view-box;transform-origin:72px 66px;animation:clpaF2 .55s ease-out 2s both}
.clpa-w{animation:clpaMot1 .48s linear both;animation-delay:calc(2.4s + var(--i) * .48s)}
.clpa-signature{animation:clpaApp .45s ease-out both;animation-delay:calc(2.4s + var(--n) * .48s)}
.clpa-mot{animation:clpaEcrit .45s ease-out both;animation-delay:calc(2.4s + var(--n) * .48s)}
.clpa-base{animation:clpaMonte .4s ease-out both;animation-delay:calc(2.9s + var(--n) * .48s)}
.clpa-t1{animation:clpaMonte .6s ease-out 2.6s both}
.clpa-t2{animation:clpaMonte .6s ease-out 3s both}
@keyframes clpaPot{from{opacity:0;transform:translateY(12px)}}
@keyframes clpaPli{from{transform:scaleX(1.75);fill:#F2542D}to{transform:scaleX(1);fill:#C23E1C}}
@keyframes clpaRain{0%,20%{opacity:0}33%,47%{opacity:1}100%{opacity:0}}
@keyframes clpaF1{0%{transform:scale(0) rotate(-25deg)}65%{transform:scale(1.18) rotate(6deg)}100%{transform:scale(1) rotate(0)}}
@keyframes clpaF2{0%{transform:scale(0) rotate(25deg)}65%{transform:scale(1.18) rotate(-6deg)}100%{transform:scale(1) rotate(0)}}
@keyframes clpaMot1{0%{opacity:1;clip-path:inset(0 100% 0 0)}33%,88%{opacity:1;clip-path:inset(0 0 0 0)}100%{opacity:0;clip-path:inset(0 0 0 0)}}
@keyframes clpaApp{from{opacity:0}to{opacity:1}}
@keyframes clpaEcrit{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes clpaMonte{from{opacity:0;transform:translateY(12px)}}
/* Déjà vue pendant cette visite, ou animations désactivées sur l'appareil : état final direct */
.clpa-vu .clpa-pot,.clpa-vu .clpa-g,.clpa-vu .clpa-d,.clpa-vu .clpa-f1,.clpa-vu .clpa-f2,.clpa-vu .clpa-signature,.clpa-vu .clpa-mot,.clpa-vu .clpa-base,.clpa-vu .clpa-t1,.clpa-vu .clpa-t2{animation:none}
.clpa-vu .clpa-r,.clpa-vu .clpa-w{display:none}
@media (prefers-reduced-motion: reduce){
  .clpa-pot,.clpa-g,.clpa-d,.clpa-f1,.clpa-f2,.clpa-signature,.clpa-mot,.clpa-base,.clpa-t1,.clpa-t2{animation:none}
  .clpa-r,.clpa-w{display:none}
}

/* ---------- Du carton au jardin ---------- */
.clpa-zone{padding-top:88px}
.clpa-etapes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:18px}
.clpa-etape{background:var(--encre-c);border-radius:30px;padding:26px;display:flex;flex-direction:column;gap:12px}
.clpa-etape p{margin:0;font-size:17px;line-height:1.45;color:var(--lilas)}
.clpa-num{font-size:15px;color:var(--peche)}
.clpa-et{font-size:24px}
.clpa-ph,.clpa-carton{width:100%;height:220px;object-fit:cover;border-radius:20px;display:block}
.clpa-vide{background:#3D3A68}
.clpa-carton{background:var(--papier);display:flex;align-items:center;justify-content:center;gap:6px}
.clpa-carton span{width:70px;height:150px;background:#FF8400;border:2px dashed var(--encre);border-radius:4px;box-sizing:border-box}
.clpa-carton .fond{width:70px;height:70px;background:#fff;border:2px solid var(--encre);align-self:flex-end;margin-bottom:35px}

/* ---------- Nos univers ---------- */
.clpa-clair{background:var(--papier);color:var(--encre);margin-top:88px;padding:72px 0}
.clpa-clair a{color:#C23E1C}
.clpa-entete{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:26px}
.clpa-entete a{font-size:17px;font-weight:600}
.clpa-univers{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.clpa-u{display:flex;flex-direction:column;gap:6px;background:#fff;border-radius:26px;padding:14px 14px 18px;color:var(--encre)!important;text-decoration:none}
.clpa-u b{font-size:22px;padding:0 6px}
.clpa-u span{font-size:15px;line-height:1.35;color:#3D3A68;padding:0 6px}
.clpa-uim{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:18px;display:block}
.clpa-bientot{display:flex;align-items:center;justify-content:center}
.clpa-bientot i{font-style:normal;background:#fff;border-radius:999px;padding:6px 14px;font-size:14px;font-weight:600}
a.clpa-u:hover{box-shadow:0 0 0 2px var(--encre)}

/* ---------- La boucle ---------- */
.clpa-boucle{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:40px;align-items:center}
.clpa-boucle .clpa-h2{margin-bottom:16px}
.clpa-chiffres{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.clpa-chiffres div{background:var(--encre-c);border-radius:24px;padding:22px;display:flex;flex-direction:column;gap:6px}
.clpa-chiffres b{font-size:30px}
.clpa-chiffres span{font-size:16px;color:var(--lilas)}

/* ---------- Tarif membre ---------- */
.clpa .clpa-zone:last-child{padding-bottom:72px}
.clpa-membre{background:var(--corail);color:#fff;border-radius:36px;padding:44px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px}
.clpa-membre b{font-size:32px;line-height:1.1}
.clpa-membre p{margin:8px 0 0;font-size:18px;line-height:1.45;max-width:640px}

/* Le pied de page enchaîne directement sur la page sombre */
body.home .clp-footer{margin-top:0!important}
@media (max-width:600px){.clpa-membre{padding:28px}.clpa-objets{font-size:40px}}