/* Page d'accueil du site (0.81.80). Toutes les couleurs viennent de la palette choisie (--t-*) : changer de palette recolore toute la page.
   Gras réservé aux titres. Tout ce qui bouge s'arrête si l'appareil demande moins d'animations. */
html{scroll-behavior:smooth}
.lp{--lp-ink:var(--t-ink,#173b7d);--lp-muted:var(--t-muted,#526b8b);--lp-accent:var(--t-accent,#eb5d53);--lp-main:var(--t-leaf,#255fbd);--lp-panel:var(--t-panel,#fff);--lp-soft:var(--t-section,#e8f1ff);--lp-line:var(--t-border,#d3e2f6);--lp-bg:var(--t-bg,#f7f9ff);overflow-x:clip}
.lp-inner{max-width:1280px;margin:0 auto}
.lp-narrow{max-width:860px}
.lp-section{padding:96px 5% 40px;position:relative}
.lp-section h2{font:500 clamp(34px,4vw,54px)/1.1 Fraunces,Georgia,serif;letter-spacing:-.03em;color:var(--lp-ink);margin:14px 0 14px;max-width:820px}
.lp-lead{font-size:18px;line-height:1.65;color:var(--lp-muted);max-width:700px;margin:0 0 40px;font-weight:400}
.lp-lead strong{font-weight:600;color:var(--lp-ink)}
.lp .lp-fine,.lp .hero-copy p.lp-fine{font-size:13.5px;line-height:1.5;color:var(--lp-muted);margin:14px 0 0;font-weight:400;max-width:none}

/* En-tête : reste en haut, se pose sur un fond quand on descend. */
.lp-header{position:sticky;top:0;max-width:none;padding:0 max(5%,calc((100% - 1480px)/2 + 5%));transition:background .3s,box-shadow .3s,height .3s;z-index:60}
.lp-header.is-stuck{background:color-mix(in srgb,var(--lp-bg) 88%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--lp-line);height:72px}
.site-header nav.lp-nav{gap:26px;font-weight:500;color:var(--lp-ink)}
.site-header nav.lp-nav a{position:relative;padding:6px 0}
.site-header nav.lp-nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--lp-accent);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.site-header nav.lp-nav a:hover::after,.site-header nav.lp-nav a:focus-visible::after{transform:scaleX(1)}
.site-header nav.lp-nav .nav-pill{font-size:14px;font-weight:600;padding:12px 20px;gap:0}
.lp-short{display:none}

.lp .lp-nav .nav-pill,.lp .lp-hero .cta,.lp .lp-panel .cta,.lp .lp-plan .cta,.lp .lp-film-actions .cta{background:var(--lp-main)!important;color:var(--t-reverse,#fff)!important}
html:root body[data-theme] .lp .lp-section .overline,html:root body[data-theme] .lp .lp-hero .overline{color:color-mix(in srgb,var(--lp-accent) 50%,var(--lp-ink))!important}
/* Haut de page : le mot qui tourne, la scène animée. */
.lp-hero .hero-copy>p:not(.lp-rotor):not(.lp-fine){max-width:590px}
.lp-rotor{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:16px!important;color:var(--lp-muted)!important;margin:-8px 0 26px!important;font-weight:400}
.lp-rotor-window{display:inline-block;height:1.9em;overflow:hidden;border-radius:999px;background:var(--lp-soft);padding:0 14px}
.lp-rotor-track{display:flex;flex-direction:column;animation:lp-rotor 9s cubic-bezier(.7,0,.2,1) infinite}
.lp-rotor-track b{height:1.9em;line-height:1.9em;font-weight:600;color:var(--lp-ink);white-space:nowrap}
@keyframes lp-rotor{0%,20%{transform:translateY(0)}25%,45%{transform:translateY(-1.9em)}50%,70%{transform:translateY(-3.8em)}75%,95%{transform:translateY(-5.7em)}100%{transform:translateY(-7.6em)}}
.lp-stage .petal{transition:transform .5s cubic-bezier(.2,.7,.2,1);translate:var(--px,0) var(--py,0)}
.lp-stage .petal.a{animation:lp-drift 11s ease-in-out infinite}
.lp-stage .petal.b{animation:lp-drift 13s 1s ease-in-out infinite reverse}
.lp-stage .petal.c{animation:lp-drift 9s .5s ease-in-out infinite}
@keyframes lp-drift{0%,100%{margin:0}50%{margin:-10px 0 0 8px}}
.lp-win{padding:18px 20px 20px;border-radius:14px}
.lp-win small{display:block;font-size:11px;letter-spacing:.14em;font-weight:600;color:var(--lp-muted);margin-bottom:12px}
.lp-win-week{left:6%;top:11%;width:min(62%,360px);transform:rotate(-5deg);animation:lp-bob 9s ease-in-out infinite}
.lp-win-day{right:1%;bottom:10%;width:min(58%,330px);transform:rotate(4deg);animation:lp-bob 10s 1.2s ease-in-out infinite}
@keyframes lp-bob{0%,100%{translate:0 0}50%{translate:0 -12px}}
.lp-week{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.lp-week>span{font-size:11px;font-weight:600;color:var(--lp-muted);text-align:center}
.lp-week>i{display:block;height:24px;border-radius:6px;background:var(--c);opacity:0;transform:scale(.4);animation:lp-pop 9s calc(var(--d)*.16s + .4s) infinite}
@keyframes lp-pop{0%{opacity:0;transform:scale(.4)}4%{opacity:1;transform:scale(1.08)}7%,82%{opacity:1;transform:scale(1)}90%,100%{opacity:0;transform:scale(.4)}}
.lp-win-day ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.lp-win-day li{display:grid;grid-template-columns:44px 1fr 22px;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;background:var(--lp-soft);font-size:13.5px;color:var(--lp-ink);opacity:0;animation:lp-slide 9s calc(var(--d)*.5s + 3s) infinite}
.lp-win-day li b{font-weight:600;font-variant-numeric:tabular-nums;font-size:12px;color:var(--lp-muted)}
.lp-win-day li em{font-style:normal;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:12px;background:var(--lp-main);color:var(--t-reverse,#fff)}
.lp-win-day li em:empty{background:none;border:1.5px solid var(--lp-line)}
@keyframes lp-slide{0%{opacity:0;transform:translateX(24px)}5%,84%{opacity:1;transform:none}92%,100%{opacity:0;transform:translateX(-12px)}}
.lp-chip{position:absolute;left:8%;bottom:20%;z-index:3;background:var(--lp-ink);color:var(--lp-bg);font-size:13px;font-weight:600;padding:9px 16px;border-radius:999px;box-shadow:0 12px 26px color-mix(in srgb,var(--lp-ink) 30%,transparent);opacity:0;animation:lp-chip 9s 5.4s infinite}
@keyframes lp-chip{0%{opacity:0;transform:translateY(14px) scale(.9)}6%,76%{opacity:1;transform:none}86%,100%{opacity:0;transform:translateY(-8px)}}
.lp-stage .round-stamp{z-index:3}
a.scroll-indicator{text-decoration:none}

/* Bande de confiance. */
.lp-trust{background:var(--lp-soft);padding:24px 5%;position:relative;z-index:2}
.lp-trust ul{list-style:none;max-width:1280px;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px 32px}
.lp-trust li{display:flex;align-items:center;gap:12px;font-size:15.5px;line-height:1.45;color:var(--lp-ink);font-weight:400}
.lp-trust svg,.lp-icon svg{width:24px;height:24px;flex:0 0 24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.lp-trust svg{color:color-mix(in srgb,var(--lp-accent) 55%,var(--lp-ink))}

/* Apparition au défilement. */
/* Sans script (ou si le script échoue), tout reste visible : un bloc n’est caché en attendant son tour que si le script a démarré (.lp-js). */
.lp-js .lp-reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--lp-delay,0s)}
.lp-js .lp-reveal.is-in{opacity:1;transform:none}

/* Ce que fait Oxaleo. */
.lp-features{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.lp-card{background:var(--lp-panel);border:1px solid var(--lp-line);border-radius:16px;padding:28px 26px;position:relative;overflow:hidden;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s,opacity .7s}
.lp-card::before{content:"";position:absolute;inset:auto -30% -60% auto;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--lp-main) 16%,transparent),transparent 70%);opacity:0;transition:opacity .4s}
.lp-card:hover{transform:translateY(-6px);box-shadow:0 22px 48px color-mix(in srgb,var(--lp-ink) 12%,transparent);border-color:color-mix(in srgb,var(--lp-main) 40%,var(--lp-line))}
.lp-card:hover::before{opacity:1}
.lp-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--lp-soft);color:var(--lp-ink);margin-bottom:18px;transition:transform .4s cubic-bezier(.2,.7,.2,1),background .3s,color .3s}
.lp-card:hover .lp-icon{transform:rotate(-8deg) scale(1.08);background:var(--lp-main);color:var(--t-reverse,#fff)}
.lp-card h3,.lp-tile h3{font:600 19px/1.3 'DM Sans',sans-serif;color:var(--lp-ink);margin:0 0 8px}
.lp-card p,.lp-tile p,.lp-panel p{font-size:15.5px;line-height:1.6;color:var(--lp-muted);margin:0;font-weight:400;position:relative}

/* Démonstration filmée. */
.lp-film .lp-inner{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:center}
.lp-film h2{margin-top:14px}
.lp-film .lp-lead{margin-bottom:26px}
.lp-chapters{list-style:none;margin:0 0 30px;padding:0;display:grid;gap:8px}
.lp-chapters li{display:grid;grid-template-columns:34px 1fr;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;border:1px solid transparent;font-size:15.5px;line-height:1.4;color:var(--lp-muted);transition:background .3s,border-color .3s,color .3s;font-weight:400}
.lp-chapters li b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--lp-soft);color:var(--lp-ink);font-weight:600;font-size:14px;transition:background .3s,color .3s}
.lp-chapters li.is-on{background:var(--lp-panel);border-color:var(--lp-line);color:var(--lp-ink)}
.lp-chapters li.is-on b{background:var(--lp-main);color:var(--t-reverse,#fff)}
.lp-film-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.lp-film-actions .lp-fine{margin:0}
.lp-film-frame{position:relative;border-radius:18px;background:var(--lp-panel);border:1px solid var(--lp-line);box-shadow:0 34px 80px color-mix(in srgb,var(--lp-ink) 20%,transparent);isolation:isolate}
.lp-film-frame::before{content:"";position:absolute;inset:-18px;border-radius:30px;z-index:-1;background:conic-gradient(from var(--lp-turn,0deg),var(--t-card1,#ffe078),var(--t-card2,#ffb09f),var(--t-card3,#b7e6d6),var(--t-blob,#bedaff),var(--t-card1,#ffe078));filter:blur(34px);opacity:.75;animation:lp-turn 12s linear infinite}
@property --lp-turn{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes lp-turn{to{--lp-turn:360deg}}
.lp-film-bar{display:flex;align-items:center;gap:7px;padding:11px 14px;border-bottom:1px solid var(--lp-line)}
.lp-film-bar i{width:10px;height:10px;border-radius:50%;background:var(--t-card2,#ffb09f)}
.lp-film-bar i:nth-child(2){background:var(--t-card1,#ffe078)}
.lp-film-bar i:nth-child(3){background:var(--t-card3,#b7e6d6)}
.lp-film-bar span{margin-left:10px;font-size:12px;color:var(--lp-muted);font-weight:400}
.lp-video{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:0 0 17px 17px;background:var(--lp-soft)}
.lp-video-toggle{position:absolute;right:12px;bottom:12px;border:0;border-radius:999px;padding:8px 14px;font:500 12.5px 'DM Sans',sans-serif;background:var(--lp-ink);color:var(--lp-bg);cursor:pointer;opacity:0;transition:opacity .25s}
.lp-film-frame:hover .lp-video-toggle,.lp-video-toggle:focus-visible,.lp-video-toggle[aria-pressed=true]{opacity:1}
.lp .curve-break{background:var(--t-section,#e8f1ff);margin-top:40px}

/* Pour qui. */
.lp-two{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:38px}
.lp-panel{background:var(--lp-panel);border:1px solid var(--lp-line);border-radius:22px;padding:38px 36px;display:flex;flex-direction:column;align-items:flex-start}
.lp-panel-school{background:var(--lp-ink);border-color:var(--lp-ink)}
.lp-panel.lp-panel-school h3,.lp-panel.lp-panel-school li{color:var(--lp-bg)}
.lp-panel.lp-panel-school p{color:color-mix(in srgb,var(--lp-bg) 84%,var(--lp-ink))}
.lp-panel.lp-panel-school .lp-tag{background:color-mix(in srgb,var(--lp-bg) 16%,var(--lp-ink));color:var(--lp-bg)}
.lp-panel.lp-panel-school li::before{background:var(--t-card1,#ffe078)}
.lp .lp-panel.lp-panel-school a.quiet-link{color:var(--lp-bg)!important;border-color:currentColor!important;font-weight:600}
.lp-tag{display:inline-block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;padding:6px 12px;border-radius:999px;background:var(--lp-soft);color:var(--lp-ink);margin-bottom:18px}
.lp-panel h3{font:500 30px/1.15 Fraunces,Georgia,serif;letter-spacing:-.02em;color:var(--lp-ink);margin:0 0 12px}
.lp-panel ul,.lp-plan ul{list-style:none;margin:22px 0 30px;padding:0;display:grid;gap:11px;width:100%}
.lp-panel li,.lp-plan li{position:relative;padding-left:24px;font-size:15.5px;line-height:1.5;color:var(--lp-ink);font-weight:400}
.lp-panel li::before,.lp-plan li::before{content:"";position:absolute;left:2px;top:.52em;width:9px;height:9px;border-radius:50%;background:var(--lp-accent)}
.lp-panel .cta,.lp-panel .quiet-link{margin-top:auto}

/* Ce qui nous distingue. */
.lp-bento{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:38px}
.lp-tile{background:var(--lp-panel);border:1px solid var(--lp-line);border-radius:18px;padding:26px 24px;position:relative;overflow:hidden;transition:transform .35s cubic-bezier(.2,.7,.2,1),opacity .7s}
.lp-tile:hover{transform:translateY(-4px)}
.lp-tile-wide{grid-column:span 2;background:var(--lp-soft);border-color:transparent;padding-right:42%}
.lp-tile-wide h3{font:500 26px/1.2 Fraunces,Georgia,serif;letter-spacing:-.02em}
.lp-lock{position:absolute;right:6%;top:50%;translate:0 -50%;width:30%;display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
.lp-lock span{height:22px;border-radius:6px;background:var(--lp-main);opacity:.18;animation:lp-cipher 3.2s calc(var(--i,0)*.18s) ease-in-out infinite}
.lp-lock span:nth-child(1){--i:0}.lp-lock span:nth-child(2){--i:3}.lp-lock span:nth-child(3){--i:1}.lp-lock span:nth-child(4){--i:5}.lp-lock span:nth-child(5){--i:2}.lp-lock span:nth-child(6){--i:6}.lp-lock span:nth-child(7){--i:4}.lp-lock span:nth-child(8){--i:7}
@keyframes lp-cipher{0%,100%{opacity:.16;transform:scaleX(1)}50%{opacity:.9;transform:scaleX(.72)}}
.lp-sheets{position:absolute;right:8%;top:50%;translate:0 -50%;width:26%;aspect-ratio:1}
.lp-sheets span{position:absolute;inset:0;width:62%;height:84%;margin:auto;border-radius:8px;background:var(--lp-panel);border:1px solid var(--lp-line);box-shadow:0 10px 24px color-mix(in srgb,var(--lp-ink) 12%,transparent);animation:lp-fan 6s ease-in-out infinite}
.lp-sheets span:nth-child(1){--r:-14deg;--x:-26%}.lp-sheets span:nth-child(2){--r:0deg;--x:0%}.lp-sheets span:nth-child(3){--r:14deg;--x:26%;border-top:5px solid var(--lp-accent)}
@keyframes lp-fan{0%,100%{transform:translateX(0) rotate(0)}40%,70%{transform:translateX(var(--x)) rotate(var(--r))}}

/* Offres. */
.lp-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.lp-plan{position:relative;background:var(--lp-panel);border:1px solid var(--lp-line);border-radius:22px;padding:34px 30px 30px;display:flex;flex-direction:column;align-items:flex-start}
.lp-plan.is-current{border:2px solid var(--lp-main);box-shadow:0 26px 60px color-mix(in srgb,var(--lp-main) 18%,transparent)}
.lp-plan.is-soon{background:color-mix(in srgb,var(--lp-panel) 55%,var(--lp-bg));border-style:dashed}
.lp-plan.is-soon>*:not(.lp-badge){opacity:.55;filter:grayscale(.7)}
.lp-badge{position:absolute;top:-13px;left:28px;font-size:12px;font-weight:600;letter-spacing:.06em;padding:6px 12px;border-radius:999px;background:var(--lp-main);color:var(--t-reverse,#fff)}
.lp-plan.is-soon .lp-badge{background:var(--lp-panel);color:var(--lp-muted);border:1px dashed var(--lp-muted)}
.lp-plan h3{font:500 30px/1.1 Fraunces,Georgia,serif;letter-spacing:-.02em;color:var(--lp-ink);margin:6px 0 10px}
.lp-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;margin:0 0 10px}
.lp-price b{font:500 44px/1 Fraunces,Georgia,serif;letter-spacing:-.03em;color:var(--lp-ink)}
.lp-price span{font-size:14px;color:var(--lp-muted);font-weight:400}
.lp-plan-lead{font-size:15.5px;color:var(--lp-muted);margin:0;font-weight:400}
.lp-plan ul{margin:22px 0 28px}
.lp-plan .cta,.lp-soon-button{margin-top:auto}
.lp-soon-button{display:inline-block;padding:12px 20px;border-radius:999px;border:1.5px dashed var(--lp-muted);font-size:14px;font-weight:500;color:var(--lp-muted)}

/* Questions. */
.lp-faq{display:grid;gap:10px;margin-top:30px}
.lp-faq details{background:var(--lp-panel);border:1px solid var(--lp-line);border-radius:14px;padding:0 22px;transition:border-color .3s,opacity .7s,transform .7s}
.lp-faq details[open]{border-color:color-mix(in srgb,var(--lp-main) 45%,var(--lp-line))}
.lp-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 0;font:600 17px/1.4 'DM Sans',sans-serif;color:var(--lp-ink)}
.lp-faq summary::-webkit-details-marker{display:none}
.lp-faq summary::after{content:"+";flex:0 0 28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--lp-soft);color:var(--lp-ink);font-weight:500;font-size:20px;transition:transform .3s}
.lp-faq details[open] summary::after{transform:rotate(45deg)}
.lp-faq p{margin:0;padding:0 0 20px;font-size:15.5px;line-height:1.65;color:var(--lp-muted);max-width:700px;font-weight:400}
.lp .promise{margin-top:90px}

/* Pied de page. */
.lp-footer{align-items:center}
.lp-footer nav{display:flex;flex-wrap:wrap;gap:8px 24px}
.lp-footer nav a{color:inherit;text-decoration:underline;text-underline-offset:3px;font-weight:400}
.lp-footer nav a:hover{text-decoration-thickness:2px}

/* ───── 0.81.81 — plus de couleur. ─────
   Mesuré sur les 14 palettes (sonde-teintes.mjs) : l'encre tient partout sur une couleur vive de la palette adoucie à 45 % au plus
   (au moins 6,2 pour 1) ; le texte discret n'y tient pas (2,6 pour 1) ; l'encre ne tient pas sur la couleur pleine (1,3 pour 1).
   Donc : une surface colorée est une couleur vive adoucie, et tout texte posé dessus est à l'encre. Les formes pleines ne portent jamais de texte. */
.lp{--c1:var(--t-card1,#ffe078);--c2:var(--t-card2,#ffb09f);--c3:var(--t-card3,#b7e6d6);--c4:var(--t-card4,#ffd0ab);--c5:var(--t-blob,#bedaff)}
/* Haut de page : deux halos de couleur côté illustration, jamais derrière le texte. */
.lp-hero{isolation:isolate}
.lp-hero::before{content:"";position:absolute;z-index:-1;inset:-90px 0 0 46%;pointer-events:none;background:radial-gradient(42% 46% at 72% 18%,color-mix(in srgb,var(--c1) 60%,transparent),transparent 72%),radial-gradient(40% 44% at 88% 78%,color-mix(in srgb,var(--c3) 55%,transparent),transparent 72%),radial-gradient(30% 36% at 40% 96%,color-mix(in srgb,var(--c2) 42%,transparent),transparent 72%);animation:lp-breathe 12s ease-in-out infinite}
@keyframes lp-breathe{0%,100%{opacity:.75;transform:scale(1)}50%{opacity:1;transform:scale(1.04)}}
/* Bande de confiance : trois pastilles de couleur. */
.lp-trust{background:none;padding:6px 5% 0}
.lp-trust li{--tint:var(--c3);padding:14px 18px;border-radius:16px;background:color-mix(in srgb,var(--tint) 45%,var(--lp-panel))}
.lp-trust li:nth-child(2){--tint:var(--c1)}
.lp-trust li:nth-child(3){--tint:var(--c5)}
.lp-trust svg{color:var(--lp-ink)}
/* Bande qui défile : ce que contient Oxaleo, en pastilles de couleur. Décorative (le contenu est repris juste dessous). */
.lp-marquee{overflow:hidden;padding:30px 0 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.lp-marquee-track{display:flex;gap:12px;width:max-content;animation:lp-marquee 44s linear infinite}
.lp-marquee:hover .lp-marquee-track{animation-play-state:paused}
.lp-marquee span{--tint:var(--c1);display:inline-flex;align-items:center;gap:9px;padding:10px 18px;border-radius:999px;font-size:15px;font-weight:500;line-height:1.3;color:var(--lp-ink);background:color-mix(in srgb,var(--tint) 45%,var(--lp-panel));white-space:nowrap}
.lp-marquee span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--lp-ink);opacity:.5}
.lp-marquee span:nth-child(5n+2){--tint:var(--c3)}
.lp-marquee span:nth-child(5n+3){--tint:var(--c5)}
.lp-marquee span:nth-child(5n+4){--tint:var(--c2)}
.lp-marquee span:nth-child(5n){--tint:var(--c4)}
@keyframes lp-marquee{to{transform:translateX(-50%)}}
/* Titres de rubrique : un passage surligné, comme au feutre. */
.lp-section h2 em{font-style:normal;padding:0 .1em;border-radius:6px;background:linear-gradient(transparent 58%,color-mix(in srgb,var(--hl,var(--c1)) 45%,var(--lp-bg)) 58%);-webkit-box-decoration-break:clone;box-decoration-break:clone}
#demo h2 em{--hl:var(--c3)}#pour-qui h2 em{--hl:var(--c2)}#atouts h2 em{--hl:var(--c5)}#offres h2 em{--hl:var(--c3)}#questions h2 em{--hl:var(--c4)}
/* Une forme de couleur par rubrique, à droite, derrière les cartes : elle ne passe jamais sous un texte nu. */
.lp-section{isolation:isolate}
.lp-section::after{content:"";position:absolute;z-index:-1;right:-7%;top:60px;width:min(36vw,440px);aspect-ratio:1;border-radius:46% 54% 58% 42%/50% 44% 56% 50%;background:var(--orb,var(--c5));opacity:.32;pointer-events:none;animation:lp-orb 16s ease-in-out infinite}
#produit{--orb:var(--c1)}#demo{--orb:var(--c3)}#pour-qui{--orb:var(--c2)}#atouts{--orb:var(--c5)}#offres{--orb:var(--c3)}#questions{--orb:var(--c4)}
#demo::after{top:10px;right:-8%}
#atouts::after,#questions::after{right:auto;left:-10%;top:auto;bottom:0}
@keyframes lp-orb{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(-18px,14px) rotate(8deg)}}
/* Les six cartes : chacune sa couleur. */
.lp-features .lp-card{--tint:var(--c1);background:color-mix(in srgb,var(--tint) 38%,var(--lp-panel));border-color:transparent}
.lp-features .lp-card:nth-child(2){--tint:var(--c3)}
.lp-features .lp-card:nth-child(3){--tint:var(--c5)}
.lp-features .lp-card:nth-child(4){--tint:var(--c4)}
.lp-features .lp-card:nth-child(5){--tint:var(--c2)}
.lp-features .lp-card:nth-child(6){--tint:var(--c3)}
.lp-features .lp-card:hover{background:color-mix(in srgb,var(--tint) 45%,var(--lp-panel));border-color:transparent}
.lp-features .lp-card p{color:var(--lp-ink)}
.lp-features .lp-card .lp-icon{background:var(--lp-panel)}
.lp-features .lp-card::before{background:radial-gradient(circle,color-mix(in srgb,var(--lp-panel) 80%,transparent),transparent 70%)}
/* La démonstration : l'étape en cours se colore. */
.lp-chapters li.is-on{background:color-mix(in srgb,var(--c3) 40%,var(--lp-panel));border-color:transparent}
/* Pour qui : le panneau des enseignants prend une couleur. */
.lp-panel:not(.lp-panel-school){background:color-mix(in srgb,var(--c1) 36%,var(--lp-panel));border-color:transparent}
.lp-panel:not(.lp-panel-school) p{color:var(--lp-ink)}
.lp-panel:not(.lp-panel-school) .lp-tag{background:var(--lp-panel)}
/* Ce qui nous distingue : six tuiles, six couleurs. */
.lp-bento .lp-tile{--tint:var(--c5);background:color-mix(in srgb,var(--tint) 40%,var(--lp-panel));border-color:transparent}
.lp-bento .lp-tile:nth-child(2){--tint:var(--c1)}
.lp-bento .lp-tile:nth-child(3){--tint:var(--c3)}
.lp-bento .lp-tile:nth-child(4){--tint:var(--c2)}
.lp-bento .lp-tile:nth-child(5){--tint:var(--c4)}
.lp-bento .lp-tile:nth-child(6){--tint:var(--c1)}
.lp-bento .lp-tile p{color:var(--lp-ink)}
.lp-lock span{background:var(--lp-ink)}
/* L'offre ouverte : un liseré aux couleurs de la palette. */
.lp-plan.is-current{overflow:visible}
.lp-plan.is-current::before{content:"";position:absolute;left:18px;right:18px;top:-2px;height:6px;border-radius:0 0 8px 8px;background:linear-gradient(90deg,var(--c1),var(--c2),var(--c3),var(--c5));pointer-events:none}
/* Questions : la réponse ouverte se colore. */
.lp-faq details[open]{background:color-mix(in srgb,var(--c5) 34%,var(--lp-panel));border-color:transparent}
.lp-faq details[open] p{color:var(--lp-ink)}
.lp-faq details:nth-child(2n)[open]{background:color-mix(in srgb,var(--c1) 34%,var(--lp-panel))}
.lp-faq details:nth-child(3n)[open]{background:color-mix(in srgb,var(--c3) 34%,var(--lp-panel))}
@media(max-width:1080px){.lp-section::after{display:none}.lp-hero::before{inset:58% 0 0 0;opacity:.6}}
@media(max-width:720px){.lp-marquee{padding-top:22px}.lp-marquee span{font-size:14px;padding:9px 15px}}
@media(prefers-reduced-motion:reduce){.lp-marquee{-webkit-mask-image:none;mask-image:none}.lp-marquee-track{flex-wrap:wrap;justify-content:center;width:auto;padding:0 5%}.lp-marquee-track span:nth-child(n+13){display:none}}
@media(max-width:1080px){.lp-features{grid-template-columns:repeat(2,1fr)}.lp-bento{grid-template-columns:repeat(2,1fr)}.lp-plans{grid-template-columns:1fr;max-width:560px}.lp-film .lp-inner{grid-template-columns:1fr;gap:36px}.site-header nav.lp-nav a:not(.lp-login){display:none}.site-header nav.lp-nav a.lp-login{display:inline-block}}
@media(max-width:720px){.lp-section{padding:64px 6% 24px}.lp-trust ul,.lp-features,.lp-two,.lp-bento{grid-template-columns:1fr}.lp-tile-wide{grid-column:auto;padding-right:24px;padding-bottom:120px}.lp-lock{right:auto;left:24px;top:auto;bottom:24px;translate:none;width:56%}.lp-sheets{right:auto;left:24px;top:auto;bottom:10px;translate:none;width:96px}.lp-panel{padding:28px 24px}.lp-header{height:68px}.site-header nav.lp-nav{gap:14px}.site-header nav.lp-nav .nav-pill{font-size:13.5px;padding:10px 16px;min-height:44px}.lp-long{display:none}.lp-short{display:inline}.lp-stage{height:440px!important}.lp-win{padding:14px 15px 16px}.lp-win-week{left:1%;top:5%;width:58%}.lp-win-day{right:0;bottom:11%;width:63%}.lp-win-day li{grid-template-columns:40px 1fr 20px;padding:7px 9px;font-size:13px}.lp-stage .round-stamp{right:3%;top:0;width:84px;height:84px;font-size:12px}.lp-chip{left:2%;bottom:3%}.lp-stage .hero-caption{display:none}.lp-footer{flex-direction:column;align-items:flex-start}.lp-rotor{font-size:15px!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.lp *,.lp *::before,.lp *::after{animation:none!important;transition:none!important}.lp-js .lp-reveal{opacity:1;transform:none}.lp-week>i,.lp-win-day li,.lp-chip{opacity:1;transform:none}.lp-rotor-track{transform:none}}

/* ───── 0.81.83 — pétales, scènes vivantes et couleurs franches. ─────
   Choix du porteur : les propositions 1 (« Pétales ») et 5 (« Vivant ») réunies, « avec des couleurs tapantes ».
   Les zones prennent la forme des feuilles du logo et se balancent comme elles ; chaque carte montre le produit en petit.
   Règle tenue : un texte n'est jamais posé sur une couleur franche, sauf les deux paires mesurées sûres sur les 14 palettes
   (texte « reverse » sur la couleur principale ; fond de page sur l'encre). Les couleurs franches vont aux scènes, aux bandeaux,
   aux traits et aux pastilles d'icône. Les zones de texte gardent une couleur de la palette adoucie à 45 % au plus, texte à l'encre. */
@keyframes lp-sway{0%,100%{rotate:calc(var(--sway,1deg)*-1)}50%{rotate:var(--sway,1deg)}}
@keyframes lp-leaf{0%,100%{rotate:0deg;translate:0 0}50%{rotate:26deg;translate:-26px 32px}}
/* La forme de couleur de chaque rubrique devient une feuille qui dérive. */
.lp-section::after{border-radius:100% 6% 100% 6%;opacity:.42;animation:lp-leaf 18s ease-in-out infinite}
/* Les zones : mouvements doux (tourner, grandir, se déplacer), séparés de l'apparition au défilement. */
.lp .lp-card,.lp .lp-tile,.lp .lp-panel,.lp .lp-plan,.lp .lp-trust li,.lp .lp-faq details,.lp .journey .step{transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1),scale .5s cubic-bezier(.34,1.56,.64,1),translate .3s ease,box-shadow .3s ease,background-color .3s ease;transition-delay:var(--lp-delay,0s),var(--lp-delay,0s),0s,0s,0s,0s}
.lp-js .lp-reveal:not(.is-in).lp-card,.lp-js .lp-reveal:not(.is-in).lp-tile,.lp-js .lp-reveal:not(.is-in).lp-panel,.lp-js .lp-reveal:not(.is-in).lp-plan{transform:scale(.5) rotate(-16deg)}
/* Un reflet traverse le bouton principal. */
.lp .lp-hero .cta,.lp .lp-panel .cta,.lp .lp-plan .cta,.lp .lp-film-actions .cta,.lp .promise .cta{position:relative;overflow:hidden}
.lp .lp-hero .cta::after,.lp .lp-panel .cta::after,.lp .lp-plan .cta::after,.lp .lp-film-actions .cta::after,.lp .promise .cta::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,color-mix(in srgb,#fff 45%,transparent) 50%,transparent 65%);translate:-120% 0;animation:lp-shine 4.5s ease-in-out infinite}
@keyframes lp-shine{0%,62%{translate:-120% 0}100%{translate:120% 0}}
/* Titres : le passage important se souligne d'un trait franc, qui se trace à l'arrivée. */
.lp-section h2 em{padding:0;border-radius:0;background:linear-gradient(var(--lp-accent),var(--lp-accent)) no-repeat 0 96%/100% .13em}
.lp-js .lp-section h2.lp-reveal em{background-size:0% .13em;transition:background-size .9s cubic-bezier(.2,.7,.2,1) .35s}
.lp-js .lp-section h2.lp-reveal.is-in em{background-size:100% .13em}
/* Pastilles en feuille : icône sur la couleur principale, points de couleur franche. */
.lp-trust li{border-radius:40px 12px 40px 12px;padding:16px 24px}
.lp-trust li:nth-child(2){border-radius:12px 40px 12px 40px}
.lp-trust li:hover{scale:1.04}
.lp-trust svg{box-sizing:content-box;padding:7px;border-radius:50% 50% 50% 8px;background:var(--lp-main);color:var(--t-reverse,#fff)}
.lp-marquee span{border-radius:22px 6px 22px 6px}
.lp-marquee span:nth-child(even){border-radius:6px 22px 6px 22px}
.lp-marquee span::before{width:10px;height:10px;background:var(--lp-main);opacity:1}
.lp-marquee span:nth-child(even)::before{background:var(--lp-accent)}
/* Les six cartes : des feuilles de six couleurs, en grille inégale ; en tête de chacune, une petite scène du produit sur une couleur franche. */
.lp-features{grid-template-columns:repeat(6,1fr);gap:28px 24px}
.lp-features .lp-card{--sway:.8deg;grid-column:span 2;padding:20px 20px 34px;border-radius:104px 26px 104px 26px;transform-origin:0% 100%;background:color-mix(in srgb,var(--tint) 45%,var(--lp-panel));box-shadow:0 28px 50px -32px color-mix(in srgb,var(--lp-ink) 60%,transparent);animation:lp-sway 7s ease-in-out infinite;animation-delay:calc(var(--n,0)*-1.3s)}
.lp-features .lp-card:nth-child(even){border-radius:26px 104px 26px 104px;transform-origin:100% 100%}
.lp-features .lp-card:nth-child(1){--n:0}.lp-features .lp-card:nth-child(2){--n:1}.lp-features .lp-card:nth-child(3){--n:2}.lp-features .lp-card:nth-child(4){--n:3}.lp-features .lp-card:nth-child(5){--n:4}.lp-features .lp-card:nth-child(6){--n:5;--sway:.3deg}
.lp-features .lp-card:hover{animation-play-state:paused;scale:1.035;box-shadow:0 38px 60px -28px color-mix(in srgb,var(--lp-ink) 62%,transparent)}
.lp-features .lp-card::before{display:none}
.lp-features .lp-card:nth-child(-n+2){grid-column:span 3}
.lp-features .lp-card:nth-child(6){grid-column:span 6;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:32px;align-items:center;padding:20px 20px 20px 64px}
.lp-features .lp-card:nth-child(6) .lp-mini{grid-column:2;grid-row:1 / span 2;margin:0;height:200px}
.lp-features .lp-card:nth-child(6) h3{grid-column:1;align-self:end;font:500 28px/1.2 Fraunces,Georgia,serif;letter-spacing:-.02em}
.lp-features .lp-card:nth-child(6) p{grid-column:1;align-self:start;font-size:17px}
.lp-features .lp-icon{display:none}
.lp-features .lp-card h3,.lp-features .lp-card p{padding:0 18px}
.lp-features .lp-card:nth-child(6) h3,.lp-features .lp-card:nth-child(6) p{padding:0}
/* 0.81.84 — le porteur : « les fonds colorés, faut qu'ils soient un peu légers, c'est fort ». Chaque fond est adouci vers le blanc. */
.lp-mini{display:block;position:relative;height:160px;margin:0 0 22px;border-radius:84px 14px 84px 14px;background:color-mix(in srgb,var(--scene,var(--lp-main)) var(--force,60%),var(--lp-panel));overflow:hidden;transition:scale .5s cubic-bezier(.34,1.56,.64,1)}
.lp-m1,.lp-m3{--force:56%}.lp-m2{--force:72%}.lp-m4,.lp-m6{--force:80%}.lp-m5{--force:66%}
.lp-features .lp-card:nth-child(even) .lp-mini{border-radius:14px 84px 14px 84px}
.lp-features .lp-card:nth-child(-n+2) .lp-mini{height:200px}
.lp-features .lp-card:hover .lp-mini{scale:1.03}
/* 1 — Programmation : cinq périodes qui se remplissent. */
.lp-m1{--scene:var(--lp-main);display:flex;align-items:flex-end;gap:5%;padding:22px 13% 0}
.lp-m1 i{flex:1;border-radius:10px 10px 0 0;background:var(--c);height:var(--h);transform-origin:50% 100%;animation:lp-grow 8s cubic-bezier(.2,.8,.2,1) infinite;animation-delay:calc(var(--d)*.28s)}
@keyframes lp-grow{0%{transform:scaleY(0)}9%,84%{transform:scaleY(1)}93%,100%{transform:scaleY(0)}}
/* 2 — Emploi du temps : la semaine se pose. */
.lp-m2{--scene:var(--c1);display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(4,1fr);gap:6px;padding:20px 12%}
.lp-m2 i{border-radius:7px;background:var(--c);grid-row:span var(--s,1);opacity:0;animation:lp-pop 8s calc(var(--d)*.14s + .2s) infinite}
/* 3 — Cahier journal : la journée se remplit, les séances se cochent. */
.lp-m3{--scene:var(--lp-accent);display:grid;align-content:center;gap:9px;padding:14px 14%}
.lp-m3 span{display:grid;grid-template-columns:38px 1fr 20px;align-items:center;gap:10px;padding:9px 11px;border-radius:9px;background:var(--lp-panel);opacity:0;animation:lp-slide 8s calc(var(--d)*.45s + .3s) infinite}
.lp-m3 span::before{content:"";height:7px;border-radius:4px;background:var(--lp-ink);opacity:.4}
.lp-m3 b{height:8px;border-radius:4px;background:var(--c)}
.lp-m3 em{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--lp-line);background:var(--lp-main);animation:lp-tick 8s calc(var(--d)*.45s + 1.6s) infinite both}
@keyframes lp-tick{0%,4%{background:transparent;scale:.6}9%,84%{background:var(--lp-main);border-color:var(--lp-main);scale:1}93%,100%{background:transparent;scale:.6}}
/* 4 — Séances : une séquence avance, étape par étape. */
.lp-m4{--scene:var(--c3);display:flex;align-items:center;justify-content:space-between;padding:0 15%}
.lp-m4::before,.lp-m4::after{content:"";position:absolute;left:15%;right:15%;top:50%;height:5px;margin-top:-2.5px;border-radius:3px;background:var(--lp-panel)}
.lp-m4::after{background:var(--lp-main);transform-origin:0 50%;animation:lp-line 8s cubic-bezier(.5,0,.3,1) infinite}
.lp-m4 i{position:relative;z-index:1;width:32px;height:32px;border-radius:50%;background:var(--lp-panel);border:4px solid var(--lp-panel);animation:lp-step 8s calc(var(--d)*1.35s + .2s) infinite both}
@keyframes lp-line{0%,3%{transform:scaleX(0)}70%,88%{transform:scaleX(1)}96%,100%{transform:scaleX(0)}}
@keyframes lp-step{0%,2%{border-color:var(--lp-panel);background:var(--lp-panel);scale:1}6%{scale:1.3}10%,88%{border-color:var(--lp-main);background:var(--lp-accent);scale:1}96%,100%{border-color:var(--lp-panel);background:var(--lp-panel)}}
/* 5 — Compétences : les acquis s'allument. */
.lp-m5{--scene:var(--lp-ink);display:grid;grid-template-columns:repeat(6,1fr);place-items:center;gap:8px 4px;padding:20px 14%}
.lp-m5 i{width:22px;height:22px;border-radius:50%;border:2px solid color-mix(in srgb,var(--lp-bg) 45%,transparent);animation:lp-light 8s calc(var(--d)*.16s + .3s) infinite both}
@keyframes lp-light{0%,3%{background:transparent;border-color:color-mix(in srgb,var(--lp-bg) 45%,transparent);scale:.8}8%,86%{background:var(--c);border-color:transparent;scale:1}95%,100%{background:transparent;border-color:color-mix(in srgb,var(--lp-bg) 45%,transparent);scale:.8}}
/* 6 — Bilans et documents : les pages sortent, le PDF est prêt. */
.lp-m6{--scene:var(--c5)}
.lp-m6 i{position:absolute;left:50%;top:50%;width:96px;height:126px;margin:-63px 0 0 -48px;border-radius:8px;background:var(--lp-panel);box-shadow:0 12px 26px -10px color-mix(in srgb,var(--lp-ink) 45%,transparent);animation:lp-fan 7s ease-in-out infinite}
.lp-m6 i:nth-child(1){--r:-16deg;--x:-78%;border-top:8px solid var(--lp-accent)}
.lp-m6 i:nth-child(2){--r:0deg;--x:0%;border-top:8px solid var(--lp-main)}
.lp-m6 i:nth-child(3){--r:16deg;--x:78%;border-top:8px solid var(--c1)}
.lp-m6 i::before{content:"";position:absolute;left:14%;right:14%;top:22%;height:46%;background:repeating-linear-gradient(var(--lp-line) 0 3px,transparent 3px 11px)}
.lp-m6 b{position:absolute;right:12%;bottom:13%;padding:8px 14px;border-radius:999px;background:var(--lp-ink);color:var(--lp-bg);font:600 12.5px/1 'DM Sans',sans-serif;animation:lp-chip 7s 2.2s infinite both}
/* La démonstration : étapes et cadre en feuille. */
.lp-chapters li{border-radius:26px 8px 26px 8px}
.lp-film-frame{border-radius:64px 18px 18px 18px}
.lp-film-bar{padding-left:40px}
/* Le fil « de la première idée au prochain progrès » : quatre feuilles de couleur, numéro et symbole sur la couleur principale. */
.lp .journey .step{--tint:var(--c1);--sway:.7deg;position:relative;border:0;overflow:hidden;transform-origin:0% 100%;background:color-mix(in srgb,var(--tint) 45%,var(--lp-panel));box-shadow:0 28px 50px -32px color-mix(in srgb,var(--lp-ink) 60%,transparent);animation:lp-sway 8s ease-in-out infinite}
html:root body[data-theme] .lp .journey .step{border-radius:72px 20px 72px 20px!important;background:color-mix(in srgb,var(--tint) 45%,var(--lp-panel))!important}
html:root body[data-theme] .lp .journey .step:nth-child(even){border-radius:20px 72px 20px 72px!important}
.lp .journey .step:nth-child(even){transform-origin:100% 100%}
.lp .journey .step:nth-child(2){--tint:var(--c3);animation-delay:-2s}
.lp .journey .step:nth-child(3){--tint:var(--c5);animation-delay:-4s}
.lp .journey .step:nth-child(4){--tint:var(--c2);animation-delay:-6s}
.lp .journey .step:hover{animation-play-state:paused;scale:1.035}
.lp .journey .step::before{content:"";position:absolute;left:0;right:0;top:0;height:10px;background:linear-gradient(90deg,var(--lp-main),var(--lp-accent))}
.lp .journey .step:nth-child(2)::before{background:linear-gradient(90deg,var(--lp-accent),var(--c1))}
.lp .journey .step:nth-child(3)::before{background:linear-gradient(90deg,var(--c1),var(--c3))}
.lp .journey .step:nth-child(4)::before{background:linear-gradient(90deg,var(--c3),var(--lp-main))}
/* 0.81.84 — le porteur : « les icônes en bleu, pas bon ; l'animé et le blanc, mieux ». Numéro et pictogramme sur blanc ;
   chaque étape a son petit dessin animé (barres qui montent, lignes qui s'écrivent, points qui se relient, anneau qui se remplit). */
html:root body[data-theme] .lp .journey .step .step-number{display:inline-block;padding:7px 14px;border-radius:999px;background:var(--lp-panel);color:var(--lp-ink)}
html:root body[data-theme] .lp .journey .step .step-symbol{display:flex;align-items:flex-end;justify-content:center;gap:5px;box-sizing:border-box;width:88px;height:68px;padding:13px 15px;border-radius:30px 10px 30px 10px;background:var(--lp-panel);font-size:0;line-height:0;margin:22px 0 18px;position:relative;overflow:hidden}
.lp-pic1 i{flex:1;border-radius:4px 4px 0 0;background:var(--c);height:var(--h);transform-origin:50% 100%;animation:lp-grow 6s cubic-bezier(.2,.8,.2,1) infinite;animation-delay:calc(var(--d)*.22s)}
html:root body[data-theme] .lp .journey .step .lp-pic2{flex-direction:column;align-items:stretch;justify-content:center;gap:7px}
.lp-pic2 i{height:6px;border-radius:3px;background:var(--c);width:var(--h);transform-origin:0 50%;animation:lp-write 6s cubic-bezier(.2,.8,.2,1) infinite;animation-delay:calc(var(--d)*.35s)}
@keyframes lp-write{0%{transform:scaleX(0)}10%,84%{transform:scaleX(1)}93%,100%{transform:scaleX(0)}}
html:root body[data-theme] .lp .journey .step .lp-pic3{align-items:center;justify-content:space-between}
.lp-pic3::before,.lp-pic3::after{content:"";position:absolute;left:22px;right:22px;top:50%;height:4px;margin-top:-2px;border-radius:2px;background:var(--lp-line)}
.lp-pic3::after{background:var(--lp-main);transform-origin:0 50%;animation:lp-line 6s cubic-bezier(.5,0,.3,1) infinite}
.lp-pic3 i{position:relative;z-index:1;flex:none;width:15px;height:15px;border-radius:50%;background:var(--lp-panel);border:3px solid var(--lp-line);animation:lp-dot 6s calc(var(--d)*1s + .2s) infinite both}
@keyframes lp-dot{0%,2%{border-color:var(--lp-line);background:var(--lp-panel);scale:1}6%{scale:1.35}10%,88%{border-color:var(--lp-main);background:var(--c);scale:1}96%,100%{border-color:var(--lp-line);background:var(--lp-panel)}}
html:root body[data-theme] .lp .journey .step .lp-pic4{align-items:center}
.lp-pic4 i{flex:none;width:42px;height:42px;border-radius:50%;background:conic-gradient(var(--lp-main) var(--lp-fill,300deg),var(--lp-line) 0);-webkit-mask:radial-gradient(circle,transparent 12px,#000 13px);mask:radial-gradient(circle,transparent 12px,#000 13px);animation:lp-fill 6s cubic-bezier(.4,0,.2,1) infinite}
@property --lp-fill{syntax:'<angle>';inherits:false;initial-value:300deg}
@keyframes lp-fill{0%{--lp-fill:0deg}55%,88%{--lp-fill:300deg}100%{--lp-fill:0deg}}
/* Certaines palettes donnaient à ces étapes un fond sombre et un texte clair : sur la couleur adoucie, tout le texte passe à l'encre. */
html:root body[data-theme] .lp .journey .step h3,html:root body[data-theme] .lp .journey .step .open,html:root body[data-theme] .lp .journey .step p{color:var(--lp-ink)!important}
/* Pour qui : deux grandes feuilles. */
.lp-two{gap:30px}
.lp-panel{border-radius:150px 34px 150px 34px;padding:66px 56px 56px 72px}
.lp-panel.lp-panel-school{border-radius:34px 150px 34px 150px;padding:66px 72px 56px 56px}
.lp-panel:hover{scale:1.015}
/* Ce qui nous distingue : six feuilles qui se balancent, un point de couleur franche devant chaque titre. */
.lp-bento{gap:24px 20px}
.lp-bento .lp-tile{--dot:var(--lp-main);--sway:.9deg;border-radius:72px 20px 72px 20px;padding-top:38px;padding-bottom:36px;padding-left:38px;transform-origin:0% 100%;animation:lp-sway 9s ease-in-out infinite;animation-delay:calc(var(--n,0)*-1.7s)}
.lp-bento .lp-tile:nth-child(even){border-radius:20px 72px 20px 72px;transform-origin:100% 100%}
.lp-bento .lp-tile:nth-child(1){--n:0;--sway:.5deg}.lp-bento .lp-tile:nth-child(2){--n:1;--dot:var(--lp-accent)}.lp-bento .lp-tile:nth-child(3){--n:2}.lp-bento .lp-tile:nth-child(4){--n:3;--dot:var(--lp-accent)}.lp-bento .lp-tile:nth-child(5){--n:4}.lp-bento .lp-tile:nth-child(6){--n:5;--sway:.5deg;--dot:var(--lp-accent)}
.lp-bento .lp-tile:hover{animation-play-state:paused;scale:1.03;transform:none}
.lp-bento .lp-tile h3::before{content:"";display:inline-block;width:.6em;height:.6em;margin-right:.5em;border-radius:50% 50% 50% 2px;background:var(--dot)}
.lp-lock span{background:var(--lp-main)}
/* Les offres : trois feuilles ; l'offre ouverte garde son trait de couleur principale. */
.lp-plans{gap:28px}
.lp-plan{border-radius:84px 24px 84px 24px;padding:48px 36px 38px 44px}
.lp-plan:nth-child(even){border-radius:24px 84px 24px 84px;padding:48px 44px 38px 36px}
.lp-plan.is-current::before{display:none}
.lp-plan.is-current:hover{scale:1.02}
.lp-badge{left:58px}
/* Questions : des feuilles ; un trait franc s'allonge quand la réponse s'ouvre. */
.lp-faq details{position:relative;overflow:hidden;border-radius:34px 10px 34px 10px;padding:0 30px}
.lp-faq details:nth-child(even){border-radius:10px 34px 10px 34px}
.lp-faq details:hover{translate:6px 0}
.lp-faq details::after{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(var(--lp-main),var(--lp-accent));scale:1 0;transform-origin:50% 0;transition:scale .35s ease}
.lp-faq details[open]::after{scale:1 1}
/* Vos couleurs : quatorze palettes à essayer sur la page elle-même. */
.lp-swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:12px}
.lp-swatch{display:flex;align-items:center;gap:12px;min-height:54px;padding:12px 16px;border:1.5px solid var(--lp-line);border-radius:26px 8px 26px 8px;background:var(--lp-panel);color:var(--lp-ink);font:500 15px/1.25 'DM Sans',sans-serif;text-align:left;cursor:pointer;transition:translate .25s ease,box-shadow .25s ease,border-color .25s ease}
.lp-swatch:nth-child(even){border-radius:8px 26px 8px 26px}
.lp-swatch:hover{translate:0 -4px;box-shadow:0 18px 30px -18px color-mix(in srgb,var(--lp-ink) 60%,transparent)}
.lp-swatch[aria-pressed=true]{border-color:var(--lp-main);box-shadow:0 0 0 3px color-mix(in srgb,var(--lp-main) 32%,transparent)}
.lp-swatch-dots{display:flex;flex:none}
.lp-swatch-dots i{width:24px;height:24px;border-radius:50%;background:var(--s);border:2px solid var(--lp-panel);margin-left:-9px}
.lp-swatch-dots i:first-child{margin-left:0}
@media(max-width:1080px){.lp-features .lp-card,.lp-features .lp-card:nth-child(-n+2){grid-column:span 3}.lp-features .lp-card:nth-child(6){grid-column:span 6}}
@media(max-width:720px){.lp-features{grid-template-columns:1fr;gap:22px}.lp-features .lp-card,.lp-features .lp-card:nth-child(even){border-radius:72px 22px 72px 22px;padding:16px 16px 30px}.lp-features .lp-card,.lp-features .lp-card:nth-child(-n+2),.lp-features .lp-card:nth-child(6){grid-column:auto;display:block}.lp-features .lp-card:nth-child(6){padding:16px 16px 30px}.lp-mini,.lp-features .lp-card:nth-child(even) .lp-mini{border-radius:58px 12px 58px 12px}.lp-features .lp-card:nth-child(6) .lp-mini{margin:0 0 22px;height:160px}.lp-features .lp-card:nth-child(-n+2) .lp-mini{height:160px}.lp-features .lp-card:nth-child(6) h3{font:600 19px/1.3 'DM Sans',sans-serif;letter-spacing:0}.lp-features .lp-card:nth-child(6) p{font-size:15.5px}.lp-features .lp-card:nth-child(6) h3,.lp-features .lp-card:nth-child(6) p{padding:0 18px}.lp-panel,.lp-panel.lp-panel-school{border-radius:84px 24px 84px 24px;padding:50px 30px 40px 38px}.lp-plan,.lp-plan:nth-child(even){border-radius:64px 20px 64px 20px;padding:44px 28px 34px 34px}.lp-bento .lp-tile,.lp-bento .lp-tile:nth-child(even){border-radius:56px 18px 56px 18px}.lp-trust li,.lp-trust li:nth-child(2){border-radius:30px 10px 30px 10px}.lp-film-frame{border-radius:36px 14px 14px 14px}.lp-swatches{grid-template-columns:1fr 1fr}.lp-swatch{padding:10px 12px;gap:9px;font-size:14px}.lp-swatch-dots i{width:20px;height:20px}}
@media(prefers-reduced-motion:reduce){.lp-m2 i,.lp-m3 span{opacity:1}.lp-m5 i{background:var(--c);border-color:transparent}.lp-js .lp-section h2.lp-reveal em{background-size:100% .13em}}
