/* ============================================================
   Maître d’Offre · page Prix
   Fil : les consultations qui passent, les dix jours, le calcul,
   l’unité « dossier », puis les deux formules.
   Motifs repris du site : règle graduée, coche, chiffres en mono.
   ============================================================ */

/* ---------- 1. En-tête et défilé des consultations ---------- */

.px-hero{padding-bottom:30px}
.px-sur{margin-bottom:18px;position:relative;z-index:1}
.px-mois{position:relative;z-index:1;margin-top:46px;padding:22px 24px 20px;border-radius:var(--r-l);background:color-mix(in srgb,var(--surface) 82%,transparent);border:1px solid var(--trait);box-shadow:var(--ombre-1);backdrop-filter:blur(6px)}
.px-mois-tete{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;align-items:baseline}
.px-leg{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:.82rem;color:var(--texte2)}
.px-leg span{display:inline-flex;align-items:center;gap:7px}
.px-l-pin{width:10px;height:10px;border-radius:50%;background:var(--accent)}
.px-l-offre{width:22px;height:10px;border-radius:3px;background:color-mix(in srgb,var(--ambre) 50%,transparent)}
.px-mois-piste{position:relative;margin-top:18px;height:96px}
.px-offres{position:absolute;inset:auto 0 30px 0;height:30px;display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.px-o{position:relative;border-radius:6px;overflow:hidden;margin-right:3px}
.px-o::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,color-mix(in srgb,var(--ambre) 32%,transparent),color-mix(in srgb,var(--ambre) 55%,transparent));transform-origin:left;transform:scaleX(var(--p,0))}
.px-o b{position:relative;display:block;padding:6px 10px;font-family:var(--mono);font-weight:400;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:#6b5000;opacity:var(--p,0)}
.px-pins{position:absolute;inset:0 0 66px 0}
.px-pin{position:absolute;top:8px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 18%,transparent);opacity:0;transform:translateY(-8px) scale(.6);transition:opacity .45s,transform .45s cubic-bezier(.22,1,.36,1),background .6s,box-shadow .6s}
.px-pin::after{content:"";position:absolute;left:50%;top:14px;width:1px;height:12px;background:var(--trait-fort)}
.px-pin.on{opacity:1;transform:none}
.px-pin.passe{background:var(--beton);box-shadow:none;opacity:.7}
.px-pin.ok.on2{background:var(--accent-sombre);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 28%,transparent)}
.px-jgrad{position:absolute;inset:auto 0 0 0;height:24px;display:grid;grid-template-columns:repeat(30,1fr);border-top:1px solid var(--trait-fort)}
.px-jgrad span{border-left:1px solid var(--trait);font-family:var(--mono);font-size:.62rem;color:var(--texte2);padding:4px 0 0 3px}
.px-jgrad span:first-child{border-left:0}
.px-mois-fin{margin-top:12px;font-size:.95rem;color:var(--encre);font-weight:550;opacity:0;transition:opacity .6s}
.px-mois.fin .px-mois-fin{opacity:1}

/* ---------- 2. Ce que coûte une offre : la règle des dix jours ---------- */

.px-cout{display:grid;grid-template-columns:1fr 1.05fr;gap:48px;align-items:center}
.px-taches{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:0}
.px-taches li{display:grid;grid-template-columns:44px 1fr;gap:12px;padding:16px 0;border-top:1px solid var(--trait);font-size:1.02rem}
.px-taches li:last-child{color:var(--encre);font-weight:550}
.px-n{color:var(--texte2);font-size:.85rem;padding-top:3px}

.px-regle-carte{padding:30px}
.px-regle-tete{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.px-jours{font-family:var(--display);font-variation-settings:"wdth" 108;font-weight:600;font-size:clamp(2.4rem,4.4vw,3.4rem);letter-spacing:-.045em;line-height:1}
.px-jours .num{font-family:inherit}
.px-regle{position:relative;margin-top:22px;height:58px;border-radius:var(--r-s);background:var(--carte);overflow:hidden}
.px-regle::after{
  content:"";position:absolute;inset:auto 0 0 0;height:16px;pointer-events:none;
  background-image:repeating-linear-gradient(to right,var(--beton) 0 1px,transparent 1px 10%);
}
.px-remplit{
  position:absolute;inset:0 auto 0 0;width:100%;transform-origin:left;transform:scaleX(0);
  background:linear-gradient(90deg,color-mix(in srgb,var(--ambre) 30%,transparent),color-mix(in srgb,var(--ambre) 55%,transparent));
  transition:transform 3.2s cubic-bezier(.45,0,.25,1) .3s;
}
.vu .px-remplit{transform:scaleX(1)}
.px-graduation{position:absolute;inset:0;display:grid;grid-template-columns:repeat(10,1fr)}
.px-graduation span{font-family:var(--mono);font-size:.68rem;color:var(--texte2);padding:8px 0 0 6px;border-left:1px solid var(--trait)}
.px-graduation span:first-child{border-left:0}
.px-fermees{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}
.px-fermees span{
  display:grid;gap:4px;padding:10px 12px;border-radius:var(--r-s);border:1px solid var(--trait);background:var(--surface);
  font-size:.8rem;color:var(--texte2);transition:opacity .6s,filter .6s;
}
.px-fermees b{font-family:var(--mono);font-weight:400;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ambre);opacity:0;transition:opacity .5s}
.vu .px-fermees span{opacity:.45;filter:grayscale(1)}
.vu .px-fermees b{opacity:1}
.vu .px-fermees span:nth-child(1),.vu .px-fermees span:nth-child(1) b{transition-delay:1.1s}
.vu .px-fermees span:nth-child(2),.vu .px-fermees span:nth-child(2) b{transition-delay:1.9s}
.vu .px-fermees span:nth-child(3),.vu .px-fermees span:nth-child(3) b{transition-delay:2.7s}
.vu .px-fermees span:nth-child(4),.vu .px-fermees span:nth-child(4) b{transition-delay:3.4s}

/* La phrase charnière */
.px-phrase{text-align:center;padding:clamp(48px,7vw,96px) clamp(24px,5vw,64px)}
.px-phrase p{
  font-family:var(--display);font-variation-settings:"wdth" 108;font-weight:600;
  font-size:clamp(1.6rem,3.6vw,2.9rem);letter-spacing:-.035em;line-height:1.12;color:#A7ADB2;
  text-wrap:balance;
}
.px-phrase .px-phrase-2{color:#F7F8F8;margin-top:10px;opacity:0;transform:translateY(12px);transition:opacity .9s cubic-bezier(.22,1,.36,1) .7s,transform .9s cubic-bezier(.22,1,.36,1) .7s}
.px-phrase.vu .px-phrase-2{opacity:1;transform:none}
.px-phrase-2::after{
  content:"";display:block;width:64px;height:3px;border-radius:3px;margin:26px auto 0;background:#00E0B8;
  transform:scaleX(0);transition:transform .8s cubic-bezier(.22,1,.36,1) 1.3s;
}
.px-phrase.vu .px-phrase-2::after{transform:scaleX(1)}

/* ---------- 3. Le calcul ---------- */

.px-calc{margin-top:34px;padding:clamp(24px,3.4vw,40px);display:grid;grid-template-columns:1fr 1.1fr;gap:30px 48px;box-shadow:var(--ombre-2)}
.px-reglages{display:grid;gap:28px;align-content:start}
.px-champ{display:grid;gap:12px}
.px-saisie{display:flex;align-items:baseline;gap:10px;border-bottom:2px solid var(--encre);padding-bottom:6px;max-width:340px}
.px-saisie input{
  border:0;background:transparent;outline:none;width:100%;min-width:0;padding:0;color:var(--encre);
  font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:clamp(1.7rem,3vw,2.2rem);letter-spacing:-.03em;
}
.px-saisie span{font-family:var(--mono);color:var(--texte2);font-size:.95rem;white-space:nowrap}
.px-saisie:focus-within{border-color:var(--accent)}
.px-curseur{width:100%;max-width:340px;accent-color:var(--accent);margin:0}
.px-nb{display:inline-flex;width:fit-content;padding:4px;gap:4px;border-radius:var(--r-pill);background:var(--carte);border:1px solid var(--trait)}
.px-nb button{border:0;cursor:pointer;background:transparent;color:var(--texte2);min-width:48px;padding:9px 14px;border-radius:var(--r-pill);font-family:var(--mono);font-size:1rem;transition:background .3s,color .3s,box-shadow .3s}
.px-nb button[aria-checked="true"]{background:var(--surface);color:var(--encre);box-shadow:var(--ombre-1)}
.px-espoir{max-width:44ch}

.px-resultat{align-self:start;padding:24px 26px;border-radius:var(--r-l);background:var(--encre);color:#EDEEEF;position:relative;overflow:hidden}
.px-resultat::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 80% at 100% 0%,color-mix(in srgb,#00E0B8 18%,transparent),transparent 70%);pointer-events:none}
.px-resultat > *{position:relative}
.px-resultat .etiquette{color:#A7ADB2}
.px-gros{
  margin-top:10px;font-family:var(--display);font-variation-settings:"wdth" 108;font-weight:600;
  font-size:clamp(2.2rem,4.6vw,3.6rem);letter-spacing:-.045em;line-height:1;color:#F7F8F8;
}
.px-gros .num{font-family:inherit;font-variant-numeric:tabular-nums}
.px-gros small{font-family:var(--ui);font-size:.95rem;font-weight:400;letter-spacing:0;color:#A7ADB2}
.px-an{margin-top:12px;color:#C9CDD1;font-size:.98rem}
.px-an b{color:#00E0B8;font-weight:550}

.px-balance{grid-column:1 / -1;display:grid;gap:12px;padding-top:6px}
.px-barre{display:grid;grid-template-columns:minmax(150px,240px) 1fr 110px;gap:14px;align-items:center;font-size:.9rem}
.px-lib{color:var(--texte2)}
.px-barre.gain .px-lib{color:var(--encre);font-weight:550}
.px-jauge{height:14px;border-radius:999px;background:var(--carte);overflow:hidden}
.px-jauge i{display:block;height:100%;width:0;border-radius:999px;background:var(--beton);transition:width .9s cubic-bezier(.22,1,.36,1)}
.px-barre.gain .px-jauge i{background:linear-gradient(90deg,var(--accent),#00E0B8)}
.px-val{text-align:right;font-size:.95rem}


/* ---------- 4. Ce qu’on appelle un dossier ---------- */

.px-dossier{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.px-schema{display:grid;justify-items:center;padding:30px 24px;border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--trait);box-shadow:var(--ombre-1)}
.px-ao{padding:12px 22px;border-radius:var(--r-pill);background:var(--encre)}
.px-ao .etiquette{color:#F7F8F8}
.px-fils{width:70%;height:44px;overflow:visible}
.px-fils path{fill:none;stroke:var(--beton);stroke-width:1.5;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1s cubic-bezier(.65,0,.35,1) .3s}
.vu .px-fils path{stroke-dashoffset:0}
.px-lots{display:grid;grid-template-columns:1fr 1fr;gap:14px;width:100%}
.px-lot{
  display:grid;gap:7px;padding:16px;border-radius:var(--r-m);background:var(--fond);border:1px solid var(--trait);
  opacity:0;transform:translateY(10px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1);
}
.vu .px-lot{opacity:1;transform:none;transition-delay:1s}
.vu .px-lot + .px-lot{transition-delay:1.15s}
.px-lot b{font-size:.95rem;margin-bottom:2px}
.px-lot span{font-size:.82rem;color:var(--texte2);display:flex;gap:7px;align-items:baseline}
.px-lot span::before{content:"\2713";color:var(--accent-sombre);font-weight:700}
.px-egal{margin-top:18px;font-size:1rem;color:var(--texte2)}
.px-egal .num{font-family:var(--display);font-variation-settings:"wdth" 108;font-weight:600;font-size:2rem;letter-spacing:-.04em;color:var(--encre);margin-right:6px}

/* ---------- 5. Les formules ---------- */

.px-formules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:34px;align-items:stretch}
.px-nom{font-size:clamp(1.9rem,3vw,2.4rem);margin-top:10px;letter-spacing:-.04em}
.px-pourqui{margin-top:8px;color:var(--texte2);min-height:3.2em;max-width:40ch}
.px-maitre .px-pourqui{color:#A7ADB2}
.px-maitre .prix .unite{color:#A7ADB2}
.px-maitre .prix .gros{color:#F7F8F8}
.px-volume{margin:4px 0 4px;font-size:1.05rem}
.px-volume b{font-size:1.25rem;margin-right:4px}
.px-maitre .px-volume{color:#F7F8F8}
.px-maitre .px-volume b{color:#00E0B8}
.px-formule .px-volume b{color:var(--accent-sombre)}
.px-maitre.px-formule .px-volume b{color:#00E0B8}
.px-unitaire{
  display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;
  margin-top:20px;padding:16px 18px;border-radius:var(--r-m);
  background:color-mix(in srgb,var(--accent) 9%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 30%,var(--trait));
}
.px-maitre .px-unitaire{background:rgba(255,255,255,.05);border-color:rgba(0,224,184,.3)}
.px-sous{flex-basis:100%;font-size:.85rem;color:var(--texte2);margin-top:-4px}
.px-maitre .px-sous{color:#A7ADB2}
.px-u{font-family:var(--display);font-variation-settings:"wdth" 108;font-weight:600;font-size:1.9rem;letter-spacing:-.04em;line-height:1;color:var(--accent-sombre)}
.px-u .num{font-family:inherit}
.px-maitre .px-u{color:#00E0B8}
.px-maitre li .v{color:#00E0B8}
.px-maitre li{color:#D3D7DA}
.px-maitre .petit{color:#A7ADB2}
.px-maitre::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(55% 45% at 100% 0%,color-mix(in srgb,#00E0B8 15%,transparent),transparent 70%),
             radial-gradient(40% 40% at 0% 100%,rgba(169,124,0,.14),transparent 70%);
}
.px-maitre > *{position:relative}

/* Bâtisseur, la formule centrale : liseré vert, fond légèrement teinté, ombre plus marquée */
.px-batisseur{
  border-color:color-mix(in srgb,var(--accent) 60%,transparent);
  background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 7%,var(--surface)),var(--surface) 55%);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 60%,transparent),var(--ombre-2);
}
.px-batisseur .px-unitaire{background:color-mix(in srgb,var(--accent) 12%,var(--surface))}
@media (min-width:901px){.px-formules .px-pourqui{min-height:6.2em}}

.px-comparez{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;text-align:center;gap:18px;margin-top:22px;padding:20px 26px;border-radius:var(--r-l);border:1px dashed var(--trait-fort)}
.px-comparez p{font-size:1.06rem;color:var(--texte2)}
.px-comparez b{color:var(--encre);font-weight:600}
.px-mini{display:grid;gap:6px;width:min(320px,100%)}
.px-mini span{display:block;height:10px;border-radius:999px;transform-origin:left;transform:scaleX(0);transition:transform 1.4s cubic-bezier(.22,1,.36,1)}
.px-mini-a{background:linear-gradient(90deg,var(--accent),#00E0B8);width:6%}
.px-mini-b{background:color-mix(in srgb,var(--ambre) 50%,transparent)}
.vu .px-mini span{transform:scaleX(1)}
.vu .px-mini-b{transition-delay:.25s;transition-duration:2.2s}

.px-inclus{display:grid;grid-template-columns:1.5fr 1fr;gap:18px;margin-top:18px}
.px-inclus-seul{grid-template-columns:1fr}
.px-inclus-seul .px-liste{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}
@media (max-width:760px){.px-inclus-seul .px-liste{grid-template-columns:1fr}}
.px-liste{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:10px}
.px-liste li{display:grid;grid-template-columns:18px 1fr;gap:11px;font-size:.97rem}
.px-liste .v{color:var(--accent-sombre);font-weight:700}
.px-plus{display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.px-plus .btn{align-self:flex-start}

.px-modules{margin-top:96px}
.px-mod-tete{display:grid;grid-template-columns:1.4fr 1fr;gap:34px;align-items:end}
.px-mod-tete h2{font-size:clamp(1.8rem,3.1vw,2.6rem);text-wrap:balance}
.px-paliers{margin-top:0;background:var(--surface)}
.px-paliers .tres-petit{margin-top:4px}
.px-mod-lecteur{display:grid;grid-template-columns:1.55fr 1fr;gap:18px;margin-top:34px;align-items:start}
.px-mod-ecran{position:relative;aspect-ratio:16 / 9;max-width:100%;border-radius:var(--r-l);overflow:hidden;background:#F1F2EF;box-shadow:var(--ombre-2);border:1px solid var(--trait)}
.px-mod-ecran video{display:block;width:100%;height:100%;object-fit:cover;background:#F1F2EF}
.px-mod-legende{position:absolute;left:14px;top:14px;margin:0;padding:6px 12px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--encre) 82%,transparent);color:#F7F8F8;backdrop-filter:blur(8px)}
.px-mod-liste{display:grid;gap:8px}
.px-mod-item{border-radius:var(--r-m);border:1px solid var(--trait);background:var(--surface);transition:border-color .3s,box-shadow .3s}
.px-mod-item.actif{border-color:color-mix(in srgb,var(--accent) 45%,var(--trait));box-shadow:var(--ombre-1)}
.px-mod-onglet{position:relative;display:flex;align-items:center;gap:12px;width:100%;padding:14px 18px;border:0;background:transparent;cursor:pointer;text-align:left;font-family:var(--ui);color:var(--encre)}
.px-mod-num{font-size:.78rem;color:var(--texte2)}
.px-mod-nom{font-weight:600;font-size:1.05rem}
.px-mod-item:not(.actif) .px-mod-nom{color:var(--texte2)}
.px-mod-item:not(.actif):hover .px-mod-nom{color:var(--encre)}
.px-mod-prog{position:absolute;left:18px;right:18px;bottom:0;height:2px;background:var(--trait);border-radius:2px;overflow:hidden;opacity:0}
.px-mod-item.actif .px-mod-prog{opacity:1}
.px-mod-prog i{display:block;height:100%;width:0;background:var(--accent)}
.px-mod-detail{display:none;padding:12px 18px 18px}
.px-mod-item.actif .px-mod-detail{display:block;animation:fondu .45s ease}
.px-mod-lien{color:var(--accent-sombre);font-weight:550;white-space:nowrap}
.px-mod-accroche{font-weight:600;font-size:1.02rem;color:var(--encre);margin:0 0 10px}
.px-mod-valeur{margin:0;display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:.92rem}
.px-mod-valeur dt{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-sombre);padding-top:3px;white-space:nowrap}
.px-mod-valeur dd{margin:0;color:var(--texte2)}
.px-mod-detail .px-mod-lien{display:inline-block;margin-top:12px;font-size:.92rem}
@media (max-width:560px){.px-mod-valeur{grid-template-columns:1fr}.px-mod-valeur dd{margin-bottom:6px}}
.px-lots-mod{margin-top:16px;padding-top:14px;border-top:1px solid var(--trait);display:grid;gap:8px}
.px-chips{display:flex;flex-wrap:wrap;gap:6px}
.px-chips span{padding:5px 11px;border-radius:var(--r-pill);font-size:.82rem;font-weight:550;color:var(--accent-sombre);background:color-mix(in srgb,var(--accent) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 28%,var(--trait))}
.px-mod-pied{margin-top:22px;text-align:center}

.px-signature{margin:34px auto 0;max-width:70ch;text-align:center;color:var(--texte2);font-size:1.02rem}

/* ---------- Sélecteur au mois / à l’année ---------- */

.px-periode{display:inline-flex;gap:4px;padding:4px;margin-top:28px;border-radius:var(--r-pill);background:var(--carte);border:1px solid var(--trait)}
.px-periode button{display:inline-flex;align-items:center;gap:8px;border:0;cursor:pointer;background:transparent;color:#4A5056;font-family:var(--ui);font-size:.92rem;font-weight:500;padding:9px 18px;border-radius:var(--r-pill);transition:background .3s,color .3s,box-shadow .3s}
.px-periode button[aria-checked="true"]{background:var(--surface);color:var(--encre);box-shadow:var(--ombre-1)}
.px-badge{font-size:.72rem;font-weight:600;padding:3px 8px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--accent) 16%,transparent);color:#005A48}
.px-periode + .px-formules{margin-top:18px}
.px-acc-droite .px-periode{margin:0 0 14px}
.prix .gros,.prix .unite{transition:opacity .25s}
.px-bascule-en-cours .prix .gros,.px-bascule-en-cours .prix .unite,.px-bascule-en-cours .prix .px-avant{opacity:0}
.prix .px-avant{flex-basis:100%;font-family:var(--mono);font-size:1rem;color:var(--texte2);text-decoration:line-through;text-decoration-thickness:1.5px;margin-bottom:-6px;transition:opacity .25s}
.px-maitre .prix .px-avant{color:#A7ADB2}

/* ---------- Accueil : le prix en trois formules ---------- */

.px-acc-prix{display:grid;grid-template-columns:1fr 1.15fr;gap:48px;align-items:center}
.px-acc-cartes{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:stretch}
.px-acc-carte{padding:24px}
.px-acc-carte .px-nom{font-size:clamp(1.6rem,2.4vw,2rem)}
.px-acc-carte .px-pourqui{font-size:.92rem;min-height:4.4em}
.px-acc-carte .prix .gros{font-size:clamp(2rem,3.4vw,2.6rem)}
.px-acc-carte .px-unitaire{margin-top:16px;padding:12px 14px}
.px-acc-carte .px-u{font-size:1.5rem}
/* Trois cartes : le texte passe au-dessus, les cartes prennent toute la largeur */
.px-acc-trois{grid-template-columns:1fr;gap:34px}
.px-acc-trois > .rev:first-child{max-width:820px}
.px-acc-trois .px-acc-cartes{grid-template-columns:repeat(3,minmax(0,1fr))}
.px-acc-trois .px-acc-carte .px-pourqui{min-height:6.6em}

/* ---------- Écrans moyens et petits ---------- */

@media (max-width:1040px){
  .px-cout,.px-dossier,.px-calc,.px-mod-tete,.px-mod-lecteur,.px-acc-prix{grid-template-columns:1fr}
  .px-inclus{grid-template-columns:1fr}
}
@media (max-width:900px){
  .px-formules,.px-acc-trois .px-acc-cartes{grid-template-columns:1fr}
}
@media (max-width:760px){
  .px-formules,.px-acc-cartes{grid-template-columns:1fr}
  .px-acc-trois .px-acc-carte .px-pourqui{min-height:0}
  .px-acc-carte .px-pourqui{min-height:0}
  .px-barre{grid-template-columns:1fr auto;gap:6px 12px}
  .px-barre .px-jauge{grid-column:1 / -1;grid-row:2}
  .px-fermees{grid-template-columns:repeat(2,1fr)}
  .px-graduation span{font-size:.58rem;padding-left:3px}
  .px-pourqui{min-height:0}
  .px-lots{grid-template-columns:1fr}
  .px-fils{display:none}
  .px-ao{margin-bottom:14px}
  .px-jgrad span{font-size:.5rem;padding-left:1px;letter-spacing:-.04em}
  .px-o b{padding:6px 5px;font-size:.55rem;letter-spacing:.06em}
  .px-mois{padding:18px 16px}
  .px-modules{margin-top:70px}
}

@media (prefers-reduced-motion:reduce){
  .px-remplit,.px-mini span{transition:none}
  .px-phrase .px-phrase-2,.px-lot,.px-fermees span,.px-fermees b,.px-fils path{transition:none}
}

/* Modules, sur grand écran : la liste monte à hauteur du titre, la section se voit d'un coup */
@media (min-width:1041px){
  .px-modules{display:grid;grid-template-columns:1.55fr 1fr;column-gap:18px;align-items:start}
  .px-mod-tete{grid-column:1;grid-row:1;display:block}
  .px-mod-lecteur{display:contents}
  .px-mod-ecran{grid-column:1;grid-row:2;margin-top:34px}
  /* la liste commence à hauteur du titre et finit au ras de la vidéo : les deux colonnes ont le même bas */
  .px-mod-liste{grid-column:2;grid-row:1 / span 2;align-self:stretch;display:flex;flex-direction:column;margin-top:var(--px-mod-haut,58px)}
  .px-mod-item.actif{flex:1 1 auto}
  .px-mod-pied{grid-column:1 / -1}
}

/* La phrase « Vous répondez à… » dit d'un coup d'œil à qui s'adresse chaque formule */
.px-pourqui{color:var(--encre);font-weight:500}
.px-maitre .px-pourqui{color:#F7F8F8}
.px-ideal{display:block;font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--texte2);font-weight:400;margin-bottom:4px}
.px-maitre .px-ideal{color:#A7ADB2}
.px-offert{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;text-align:center;gap:14px 22px;margin-top:22px;padding:20px 26px;border-radius:var(--r-l);background:#E3F4EF;border:1px solid rgba(0,168,140,.28)}
.px-offert p{font-size:1.06rem;color:var(--texte2);max-width:62ch}
.px-offert b{color:var(--encre);font-weight:600}