/* ================= MAQUETTE « COMME UNE APPLI CONNUE » SUR LA VITRINE (lot 2, à valider) =================
   Chargée UNIQUEMENT en aperçu (?style=appli, voir site.js) : tout est sous body.apercu-appli, le site public ne la voit pas.
   Direction : la vitrine parle comme l'appli MyEly. Titres Arial 800 géants et serrés, cartes blanches en feuilles arrondies,
   pilules, chiffres énormes, listes façon réglages, la journée d'exemple DANS un téléphone, barre d'onglets en bas sur mobile.
   Restent : beige, bleu Elysium (fond #2E9BFF texte noir ; texte #1466b8), couleurs des repas et des macros, ELYSIUM en Cormorant. */
body.apercu-appli{--a-encre:#111;--a-doux:#6b6358;--a-bleu:#1466b8;--a-brand:#2E9BFF;--a-r:28px;--a-rr:40px}
html[data-theme="obscur"] body.apercu-appli{--a-encre:#EAF2FF;--a-doux:#AEB6C4;--a-bleu:#7cc0ff}
body.apercu-appli .frame,body.apercu-appli .ambscan,body.apercu-appli .grain,body.apercu-appli .cur,body.apercu-appli .curdot{display:none!important}

/* ---------- typographie ---------- */
body.apercu-appli h1{overflow-wrap:normal!important;word-break:normal!important;hyphens:none!important;font-size:clamp(48px,7vw,104px)!important;line-height:.9!important;letter-spacing:-.055em!important;color:var(--a-encre)}
body.apercu-appli h1 em,body.apercu-appli h2 em{font-style:normal!important;color:var(--a-brand)}
body.apercu-appli h2{font-size:clamp(36px,5.2vw,66px)!important;line-height:.98!important;letter-spacing:-.045em!important;color:var(--a-encre);text-wrap:balance}
body.apercu-appli h3{letter-spacing:-.025em!important}
body.apercu-appli .lede,body.apercu-appli .phead p,body.apercu-appli .sec-head p{font-size:clamp(17px,1.9vw,20px)!important;line-height:1.55!important;color:var(--a-doux)}
body.apercu-appli .lede b{color:var(--a-encre);font-weight:800}
body.apercu-appli .eyebrow,body.apercu-appli .kick{display:inline-flex!important;align-items:center;gap:8px;width:auto;padding:8px 13px!important;border-radius:999px;background:var(--pilule);
  color:var(--a-encre)!important;font:800 11px/1 Arial,Helvetica,sans-serif!important;letter-spacing:.14em!important;text-transform:uppercase;margin-bottom:22px!important}
body.apercu-appli .eyebrow::before,body.apercu-appli .kick::before{content:""!important;width:7px!important;height:7px!important;border-radius:50%;background:var(--a-brand)!important;flex:none}

/* ---------- boutons ---------- */
body.apercu-appli .btn{min-height:56px;padding:0 28px;border-radius:999px;font:800 16px/1 Arial,Helvetica,sans-serif;letter-spacing:-.01em;border:0}
body.apercu-appli .btn.main,body.apercu-appli .plan .btn{background:var(--a-brand);color:#111;box-shadow:0 10px 24px color-mix(in srgb,var(--a-brand) 35%,transparent)}
body.apercu-appli .btn.line{background:var(--pilule);color:var(--a-encre);border:0}
body.apercu-appli .more{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:999px;background:var(--pilule);border:0!important;color:var(--a-encre)!important;font:800 14px/1 Arial,Helvetica,sans-serif;text-decoration:none}
body.apercu-appli .more::after{content:"›";font-size:18px;line-height:0;color:var(--a-doux)}

/* ---------- en-tête : menu en pilules, la page courante en noir ---------- */
body.apercu-appli header.status{background:color-mix(in srgb,var(--fond) 82%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent)}
body.apercu-appli nav.menu{top:8px;height:auto!important;min-height:0!important;align-items:center;gap:4px;padding:7px 9px;border-radius:999px;background:var(--carte);box-shadow:var(--ombre)}
body.apercu-appli nav.menu a{padding:10px 15px;border-radius:999px;font:700 13.5px/1 Arial,Helvetica,sans-serif;letter-spacing:0;text-transform:none;color:var(--a-doux)}
body.apercu-appli nav.menu a:hover{color:var(--a-encre);background:var(--pilule)}
body.apercu-appli nav.menu a[aria-current="page"]{background:var(--actif);color:var(--actif-t)}
body.apercu-appli nav.menu a[aria-current="page"]::after{display:none}
body.apercu-appli nav.menu a.go{border:0;background:var(--a-brand);color:#111;padding:10px 18px}
body.apercu-appli nav.menu .theme-btn{border:0;background:var(--pilule)}

/* ---------- sections en feuilles arrondies ---------- */
body.apercu-appli main section{border-top:0!important}
body.apercu-appli section.soft>.wrap,body.apercu-appli .sec.alt>.wrap{background:var(--carte);border-radius:var(--a-rr);box-shadow:var(--ombre);padding:clamp(28px,5vw,72px)!important;max-width:calc(1120px - 2*var(--edge,24px))}
@media(max-width:700px){body.apercu-appli section.soft>.wrap{margin:0 12px;border-radius:30px}}

/* ---------- accueil : en-tête ---------- */
body.apercu-appli .hero{padding-top:clamp(40px,6vw,72px)!important}
body.apercu-appli .hero .wrap{align-items:center}
body.apercu-appli .hero h1{font-size:clamp(48px,6.6vw,96px)!important}
body.apercu-appli .hero .ctas .btn{padding:0 24px}
body.apercu-appli .sign{padding:8px 14px 8px 10px;border-radius:999px;background:var(--carte);box-shadow:var(--ombre);display:inline-flex!important}
body.apercu-appli .avis-c{background:var(--carte)!important;border:0!important;border-radius:22px!important;box-shadow:var(--ombre)}
body.apercu-appli .avis-n{font:800 40px/1 Arial,Helvetica,sans-serif!important;letter-spacing:-.05em;color:var(--a-encre)!important}
body.apercu-appli .avis-n small{font:700 13px Arial,Helvetica,sans-serif;letter-spacing:0;color:var(--a-doux);margin-left:8px}

/* la journée d'exemple DANS un téléphone (écran « Ma diète » de l'appli) */
body.apercu-appli .day{max-width:390px!important;background:#14120F;border-radius:56px;padding:12px;box-shadow:0 40px 80px rgba(40,30,15,.28),0 0 0 1px rgba(0,0,0,.4)}
body.apercu-appli .tel-ecran{position:relative;background:var(--fond);border-radius:45px;height:min(760px,78vh);overflow:hidden;display:flex;flex-direction:column}
body.apercu-appli .tel-defile{flex:1;overflow-y:auto;padding:44px 16px 18px;scrollbar-width:none}
body.apercu-appli .tel-defile::-webkit-scrollbar{display:none}
body.apercu-appli .tel-encoche{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:96px;height:26px;border-radius:20px;background:#14120F;z-index:2}
body.apercu-appli .tel-sur{font:700 9.5px/1 Arial,Helvetica,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--a-doux)}
body.apercu-appli .tel-titre{margin:6px 0 12px;font:800 30px/1 Arial,Helvetica,sans-serif;letter-spacing:-.03em;color:var(--a-encre)}
body.apercu-appli .tel-jours{display:flex;gap:5px;margin-bottom:14px}
body.apercu-appli .tel-jours span{flex:1;text-align:center;padding:8px 0;border-radius:12px;background:var(--pilule);font:700 12.5px/1 Arial,Helvetica,sans-serif;color:var(--a-doux)}
body.apercu-appli .tel-jours .on{background:var(--actif);color:var(--actif-t)}
body.apercu-appli .tel-gros{display:flex;align-items:baseline;gap:6px}
body.apercu-appli .tel-gros b{font:800 50px/1 Arial,Helvetica,sans-serif;letter-spacing:-.05em;color:var(--a-encre)}
body.apercu-appli .tel-gros span{font:700 15px Arial,Helvetica,sans-serif;color:var(--a-doux)}
body.apercu-appli .tel-sous{margin:4px 0 14px;font:12px/1.4 Arial,Helvetica,sans-serif;color:var(--a-doux)} body.apercu-appli .tel-sous b{color:var(--a-bleu)}
body.apercu-appli .tel-defile .meals{grid-template-columns:1fr!important;gap:10px}
body.apercu-appli .tel-defile .meals .meal{grid-column:auto!important}
body.apercu-appli .tel-onglets{flex:none;display:flex;justify-content:space-around;padding:10px 6px 18px;border-top:1px solid var(--line);background:var(--carte)}
body.apercu-appli .tel-onglets div{display:flex;flex-direction:column;align-items:center;gap:4px;font:10px Arial,Helvetica,sans-serif;color:var(--a-doux)}
body.apercu-appli .tel-onglets .on{color:var(--a-bleu);font-weight:700}
body.apercu-appli .tel-onglets svg,body.apercu-appli .appbar svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
body.apercu-appli .day-lab{display:none}
body.apercu-appli .day-note{margin-top:18px}

/* ---------- idées reçues : une liste façon réglages ---------- */
body.apercu-appli .myths{gap:0!important;margin-top:28px;max-width:none}
body.apercu-appli .myths details{border:0!important;border-bottom:1px solid var(--line)!important;border-radius:0!important;background:none!important}
body.apercu-appli .myths details:last-child{border-bottom:0!important}
body.apercu-appli .myths summary{padding:20px 4px!important;font:800 clamp(18px,2.2vw,23px)/1.25 Arial,Helvetica,sans-serif!important;letter-spacing:-.02em;color:var(--a-encre)}
body.apercu-appli .myths summary::after{content:"›"!important;border:0!important;background:var(--pilule)!important;color:var(--a-encre)!important;font:700 20px/1 Arial,Helvetica,sans-serif!important;transform:rotate(90deg)}
body.apercu-appli .myths details[open] summary::after{transform:rotate(-90deg)!important}
body.apercu-appli .myths .ans{padding:0 4px 22px!important;font-size:16px}
body.apercu-appli .verdict{border-radius:999px!important;padding:6px 11px!important;font:800 11px/1 Arial,Helvetica,sans-serif!important}

/* ---------- chiffres géants en tuiles ---------- */
body.apercu-appli .figures{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px!important;border:0!important;padding:0!important;margin-top:44px!important}
@media(max-width:820px){body.apercu-appli .figures{grid-template-columns:repeat(2,minmax(0,1fr))}}
body.apercu-appli .figures .fg{background:var(--carte);border:0!important;border-radius:24px;box-shadow:var(--ombre);padding:22px 20px!important;min-width:0}
body.apercu-appli .figures .v{font:800 clamp(44px,5.6vw,72px)/1 Arial,Helvetica,sans-serif!important;letter-spacing:-.06em!important;color:var(--a-encre)!important}
body.apercu-appli .figures .v small{font:800 .5em Arial,Helvetica,sans-serif;color:var(--a-brand)}
body.apercu-appli .figures .k{margin-top:10px;font:700 12.5px/1.35 Arial,Helvetica,sans-serif!important;letter-spacing:0!important;text-transform:none!important;color:var(--a-doux)!important}
body.apercu-appli .two blockquote{margin:0;background:var(--a-brand);color:#111;border:0!important;border-radius:var(--a-rr);padding:clamp(28px,4vw,48px)!important;box-shadow:0 20px 40px color-mix(in srgb,var(--a-brand) 30%,transparent)}
body.apercu-appli .two blockquote p{font:800 clamp(26px,3.2vw,40px)/1.08 Arial,Helvetica,sans-serif!important;letter-spacing:-.035em;color:#111!important}
body.apercu-appli .two blockquote footer{margin-top:16px;font:700 13px Arial,Helvetica,sans-serif;color:rgba(0,0,0,.6)!important}

/* ---------- assiettes : cartes produit d'appli ---------- */
body.apercu-appli .plate{border:0!important;border-radius:26px!important;background:var(--carte)!important;box-shadow:var(--ombre);padding:8px}
body.apercu-appli .plate img{border-radius:20px}
body.apercu-appli .plate h3{font:800 21px/1.1 Arial,Helvetica,sans-serif!important;letter-spacing:-.03em!important;margin:10px 0 6px}
body.apercu-appli .plate .tag{border-radius:999px!important;padding:6px 10px!important;font:800 10.5px/1 Arial,Helvetica,sans-serif!important}
body.apercu-appli .plate .mac{border-top:0!important;gap:6px!important}
body.apercu-appli .plate .mac span{padding:5px 9px;border-radius:999px;background:var(--pilule);font:700 11.5px/1 Arial,Helvetica,sans-serif}
body.apercu-appli .plate .mac .kc{background:var(--a-brand);color:#111;margin-left:auto}

/* ---------- ce que tu reçois : lignes cochées ---------- */
body.apercu-appli .recois{display:flex!important;flex-direction:column;gap:0!important;margin-top:28px!important}
body.apercu-appli .recois li{display:flex;align-items:center;gap:16px;padding:16px 0!important;border:0!important;border-bottom:1px solid var(--line)!important;border-radius:0!important;background:none!important;font:16.5px/1.45 Arial,Helvetica,sans-serif;color:var(--a-doux)}
body.apercu-appli .recois li:last-child{border-bottom:0!important}
body.apercu-appli .recois li b{color:var(--a-encre);font-weight:800}
body.apercu-appli .recois svg{flex:none;width:34px!important;height:34px!important;padding:8px;border-radius:12px;background:color-mix(in srgb,var(--a-brand) 16%,var(--carte));stroke:var(--a-bleu)!important;stroke-width:2.4!important;fill:none}
body.apercu-appli .recois-prix{display:inline-block;padding:14px 20px;border-radius:999px;background:var(--pilule);font:700 16px Arial,Helvetica,sans-serif}
body.apercu-appli .recois-prix b{font-weight:800;color:var(--a-encre)}

/* ---------- maintien / évolution / fin : grandes cartes pleines ---------- */
body.apercu-appli .maintien,body.apercu-appli .evo{max-width:none!important;border-radius:var(--a-rr)!important;padding:clamp(30px,6vw,80px)!important;box-shadow:var(--ombre)}
body.apercu-appli .maintien{background:color-mix(in srgb,#f1c232 16%,var(--carte))}
body.apercu-appli .evo{background:color-mix(in srgb,#6aa84f 15%,var(--carte))!important}
body.apercu-appli .chute{display:inline-block;padding:12px 18px;border-radius:999px;background:var(--actif);color:var(--actif-t)!important;font:800 15px/1 Arial,Helvetica,sans-serif!important;border:0!important}
body.apercu-appli section.end{background:none!important}
body.apercu-appli section.end>.wrap{background:var(--a-brand);border-radius:var(--a-rr);padding:clamp(40px,7vw,96px) clamp(24px,5vw,64px)!important;box-shadow:0 30px 60px color-mix(in srgb,var(--a-brand) 30%,transparent)}
body.apercu-appli section.end h2,body.apercu-appli section.end .lede,body.apercu-appli section.end .contact,body.apercu-appli section.end .contact a{color:#111!important}
body.apercu-appli section.end .eyebrow{background:rgba(255,255,255,.55)}
body.apercu-appli section.end .btn.main{background:#111;color:#fff;box-shadow:none}
@media(max-width:700px){body.apercu-appli section.end>.wrap,body.apercu-appli .maintien,body.apercu-appli .evo{margin:0 12px}}

/* ---------- autres pages : en-tête de page, cartes, formules, FAQ ---------- */
body.apercu-appli .phead{background:none!important;border:0!important}
body.apercu-appli .phead h1 .l2{color:var(--a-brand)}
body.apercu-appli .sec{border-top:0!important}
body.apercu-appli .card,body.apercu-appli .quote,body.apercu-appli .team .coach,body.apercu-appli .faq details,body.apercu-appli .legal{
  background:var(--carte)!important;border:0!important;border-radius:var(--a-r)!important;box-shadow:var(--ombre)}
body.apercu-appli .legal{padding:clamp(24px,4vw,48px)!important}
body.apercu-appli .plan{border-radius:32px!important;padding:28px 24px!important}   /* bordure de couleur et halo néon de la version de base gardés */
body.apercu-appli .plan h3{font:800 26px/1.05 Arial,Helvetica,sans-serif!important;letter-spacing:-.035em!important}
body.apercu-appli .plan .now .n1{font:800 72px/.9 Arial,Helvetica,sans-serif!important;letter-spacing:-.06em}
body.apercu-appli .plan .now .n2,body.apercu-appli .plan .now .eur{font:800 22px Arial,Helvetica,sans-serif!important}
body.apercu-appli .plan li{border-radius:16px!important}
body.apercu-appli .plan .badge-offert{border-radius:999px}
body.apercu-appli .faq summary{font:800 18px/1.3 Arial,Helvetica,sans-serif!important;letter-spacing:-.02em}

/* ---------- mobile : barre d'onglets comme dans l'appli ---------- */
body.apercu-appli .appbar{display:none}
@media(max-width:760px){
  body.apercu-appli .appbar{display:flex;position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:9998;justify-content:space-around;padding:8px 6px;border-radius:24px;
    background:color-mix(in srgb,var(--carte) 88%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 10px 30px rgba(40,30,15,.18)}
  body.apercu-appli .appbar a{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:56px;padding:4px 0;font:600 10.5px/1 Arial,Helvetica,sans-serif;color:var(--a-doux);text-decoration:none}
  body.apercu-appli .appbar a[aria-current="page"]{color:var(--a-bleu);font-weight:800}
  body.apercu-appli .burger,body.apercu-appli nav.msheet{display:none!important}
  body.apercu-appli{padding-bottom:96px}
  body.apercu-appli .apercu-bandeau{bottom:calc(84px + env(safe-area-inset-bottom,0px));font-size:11.5px}
  body.apercu-appli .day{border-radius:48px}
}
body.apercu-appli section:not(.sec) .figures .fg:last-child .v{font-size:clamp(28px,3.2vw,42px)!important;letter-spacing:-.04em!important}
body.apercu-appli .two h2{font-size:clamp(32px,4.2vw,54px)!important}
/* boutons : texte toujours centré dans la pilule (les pages hors accueil gardaient un padding vertical) */
body.apercu-appli .btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;padding-top:0!important;padding-bottom:0!important;line-height:1.1!important;text-align:center}
body.apercu-appli .plan .btn{display:flex!important}
/* encadré final des pages (« Prêt à commencer ») : une vraie carte, avec de l'air */
body.apercu-appli .cta{border-top:0!important;padding:clamp(48px,8vh,90px) var(--edge)!important}
body.apercu-appli .cta-in{padding:clamp(32px,5vw,64px) clamp(22px,4vw,56px)!important;border-radius:var(--a-rr)!important}
body.apercu-appli .cta-in .kick,body.apercu-appli .cta-in .eyebrow{margin-top:0!important}

body.apercu-appli .step .st h3{font:800 24px/1.1 Arial,Helvetica,sans-serif!important;text-transform:none!important;letter-spacing:-.03em!important;color:var(--a-encre)!important;margin:0 0 8px!important}
body.apercu-appli .step .st p{font:15.5px/1.6 Arial,Helvetica,sans-serif!important;color:var(--a-doux)!important}
body.apercu-appli .step .st p b{color:var(--a-encre)!important;font-weight:800!important}

/* citation de la Méthode : grande carte bleue, comme celle de l'accueil */
body.apercu-appli .quote{background:var(--a-brand)!important;padding:clamp(28px,4vw,48px)!important;border-radius:var(--a-rr)!important;box-shadow:0 20px 40px color-mix(in srgb,var(--a-brand) 30%,transparent)!important}
body.apercu-appli .quote blockquote{font:800 clamp(24px,3vw,38px)/1.12 Arial,Helvetica,sans-serif!important;letter-spacing:-.035em;color:#111!important;margin:0}
body.apercu-appli .quote figcaption{margin-top:16px;font:700 12px Arial,Helvetica,sans-serif!important;letter-spacing:.12em;color:rgba(0,0,0,.6)!important}
body.apercu-appli .partner-strip{border:0!important;padding:16px 22px!important;border-radius:999px;background:var(--carte);box-shadow:var(--ombre);margin-top:22px!important;flex-wrap:wrap}

/* chiffres qui sont des mots (« Des années ») : plus petits, jamais coupés */
body.apercu-appli .figures .v.mot{font-size:clamp(28px,3vw,40px)!important;letter-spacing:-.04em!important;overflow-wrap:normal;word-break:normal;hyphens:none}

/* ---------- Coachs : cartes profil d'appli ---------- */
body.apercu-appli .coach{padding:10px!important;overflow:hidden}
body.apercu-appli .coach .ph{border-radius:22px;overflow:hidden}
body.apercu-appli .coach .body{padding:18px 14px 12px!important}
body.apercu-appli .coach .role{display:inline-flex;padding:6px 11px;border-radius:999px;background:color-mix(in srgb,var(--a-brand) 16%,var(--carte));color:var(--a-bleu)!important;
  font:800 10.5px/1 Arial,Helvetica,sans-serif!important;letter-spacing:.1em!important;text-transform:uppercase}
body.apercu-appli .coach h3{font:800 34px/1 Arial,Helvetica,sans-serif!important;letter-spacing:-.04em!important;margin:12px 0 10px!important;text-transform:none!important}
body.apercu-appli .coach p{font:15.5px/1.6 Arial,Helvetica,sans-serif!important;color:var(--a-doux)!important}

/* ---------- Résultats : tuiles de chiffres, cartes de transformation, avis en bulles ---------- */
body.apercu-appli .rstat{background:var(--carte)!important;border:0!important;border-radius:24px!important;box-shadow:var(--ombre);padding:22px 28px!important}
body.apercu-appli .rstat .v{font:800 clamp(36px,4.4vw,56px)/1 Arial,Helvetica,sans-serif!important;letter-spacing:-.05em!important;color:var(--a-encre)!important}
body.apercu-appli .rstat .k,body.apercu-appli .figures .k{text-transform:none!important;letter-spacing:0!important;font:700 12.5px/1.35 Arial,Helvetica,sans-serif!important;color:var(--a-doux)!important;margin-top:8px}
body.apercu-appli .tcard{background:var(--carte)!important;border:0!important;border-radius:28px!important;box-shadow:var(--ombre);padding:8px}
body.apercu-appli .tphoto{border-radius:22px;border:0!important;overflow:hidden}
body.apercu-appli .tphoto .play{background:var(--a-brand)!important;border:0!important;box-shadow:0 8px 20px rgba(0,0,0,.25)}
body.apercu-appli .tphoto .play::after{border-color:transparent transparent transparent #111!important}
body.apercu-appli .tphoto .vtag{border-radius:999px!important;padding:6px 11px!important;background:rgba(17,17,17,.75)!important;color:#fff!important;font:700 11px/1 Arial,Helvetica,sans-serif!important;letter-spacing:0!important;text-transform:none!important}
body.apercu-appli .tbody{padding:16px 14px 10px!important}
body.apercu-appli .tnum{font:800 clamp(30px,3.2vw,42px)/1 Arial,Helvetica,sans-serif!important;letter-spacing:-.05em!important;color:var(--a-encre)!important}
body.apercu-appli .tnum small{display:inline-block!important;margin:0 0 0 8px!important;padding:5px 10px;border-radius:999px;background:var(--pilule);font:700 12px/1 Arial,Helvetica,sans-serif!important;letter-spacing:0!important;color:var(--a-doux)!important;vertical-align:middle}
body.apercu-appli .tquote,body.apercu-appli .tframe{font:15.5px/1.55 Arial,Helvetica,sans-serif!important;font-style:normal!important;color:var(--a-encre)!important}
body.apercu-appli .tfoot{border-top:1px solid var(--line)!important}
body.apercu-appli .tname{font:800 13px/1.2 Arial,Helvetica,sans-serif!important;letter-spacing:0!important;text-transform:none!important}
body.apercu-appli .tname i{font:600 12px Arial,Helvetica,sans-serif!important;letter-spacing:0!important;text-transform:none!important}
body.apercu-appli .tlink{padding:8px 13px;border-radius:999px;background:var(--pilule);color:var(--a-encre)!important;font:800 12px/1 Arial,Helvetica,sans-serif!important;letter-spacing:0!important;text-transform:none!important}
body.apercu-appli .wcard{background:var(--carte)!important;border:0!important;border-radius:4px 26px 26px 26px!important;box-shadow:var(--ombre);padding:26px 24px 22px!important}
body.apercu-appli .wcard::before,body.apercu-appli .wcard::after{color:var(--a-brand)!important;opacity:1!important}
body.apercu-appli .wcard .wq{font:16.5px/1.55 Arial,Helvetica,sans-serif!important;font-style:normal!important;color:var(--a-encre)!important}
body.apercu-appli .wcard .wq b{font-weight:800!important}
body.apercu-appli .wcard .wa{font:700 12px Arial,Helvetica,sans-serif!important;letter-spacing:0!important;text-transform:none!important;color:var(--a-doux)!important}
body.apercu-appli .rnote{font:13px/1.6 Arial,Helvetica,sans-serif!important;letter-spacing:0!important;text-transform:none!important}
body.apercu-appli .rmoreig a{display:inline-flex;padding:13px 20px;border-radius:999px;background:var(--pilule);border:0!important;color:var(--a-encre)!important;font:800 14px/1 Arial,Helvetica,sans-serif;letter-spacing:0;text-transform:none}
body.apercu-appli .wcard .wq{margin-top:0!important}

/* titres : jamais coupés en plein mot */
body.apercu-appli h1,body.apercu-appli h2,body.apercu-appli h3{overflow-wrap:normal!important;word-break:normal!important;hyphens:manual!important}
/* FAQ : titres de colonne à leur taille */
body.apercu-appli .faq-sec .sec-head h2{font-size:clamp(28px,2.9vw,40px)!important;line-height:1.02!important}

/* ---------- Contact : formulaire dans une carte, champs gris arrondis, infos façon réglages ---------- */
body.apercu-appli .cform{background:var(--carte);border-radius:var(--a-rr);box-shadow:var(--ombre);padding:clamp(22px,4vw,40px)}
body.apercu-appli .cform label{font:700 13px/1.2 Arial,Helvetica,sans-serif!important;letter-spacing:0!important;text-transform:none!important;color:var(--a-encre)!important}
body.apercu-appli .cform input,body.apercu-appli .cform select,body.apercu-appli .cform textarea{background:var(--pilule)!important;border:2px solid transparent!important;border-radius:16px!important;padding:14px 16px!important;font:16px/1.35 Arial,Helvetica,sans-serif!important}
body.apercu-appli .cform input:focus,body.apercu-appli .cform select:focus,body.apercu-appli .cform textarea:focus{border-color:var(--a-brand)!important;background:var(--carte)!important}
body.apercu-appli .cform .btn{background:var(--a-brand)!important}
body.apercu-appli .cinfo{background:var(--carte)!important;border:0!important;border-radius:var(--a-rr)!important;box-shadow:var(--ombre);padding:8px 26px!important}
body.apercu-appli .cinfo .ci .k{display:inline-flex;align-self:flex-start;padding:6px 11px;border-radius:999px;background:color-mix(in srgb,var(--a-brand) 16%,var(--carte));color:var(--a-bleu)!important;
  font:800 10.5px/1 Arial,Helvetica,sans-serif!important;letter-spacing:.1em!important}
body.apercu-appli .cinfo .ci a,body.apercu-appli .cinfo .ci .v{font:800 19px/1.25 Arial,Helvetica,sans-serif!important;letter-spacing:-.02em;margin-top:4px}
body.apercu-appli .cinfo .ci p{font:15px/1.5 Arial,Helvetica,sans-serif!important;color:var(--a-doux)!important}

/* ---------- pages légales : sommaire gris arrondi, articles numérotés en pastilles ---------- */
body.apercu-appli .legal .toc{background:var(--pilule)!important;border:0!important;border-radius:24px!important}
body.apercu-appli .legal .toc .toc-k{color:var(--a-encre)!important;font-weight:800!important}
body.apercu-appli .legal .toc a b,body.apercu-appli .legal .toc b{color:var(--a-bleu)}
body.apercu-appli .legal h3{font:800 clamp(20px,2.4vw,26px)/1.15 Arial,Helvetica,sans-serif!important;text-transform:none!important;letter-spacing:-.03em!important}
body.apercu-appli .legal h3 .num{background:color-mix(in srgb,var(--a-brand) 16%,var(--carte))!important;border:0!important;color:var(--a-bleu)!important;font:800 13px/1 Arial,Helvetica,sans-serif!important;border-radius:12px!important}
body.apercu-appli .legal p,body.apercu-appli .legal li{font-family:Arial,Helvetica,sans-serif}
body.apercu-appli .legal .intro{background:color-mix(in srgb,var(--a-brand) 10%,var(--carte))!important;border:0!important;border-radius:20px!important}

/* mobile : bandeau d'aperçu en haut (il cachait le bas des écrans), bouton clair/obscur dans l'en-tête */
body.apercu-appli .theme-mob{display:none;position:fixed;top:12px;right:14px;z-index:60;width:40px;height:40px;place-items:center;border:0;border-radius:50%;background:var(--carte);box-shadow:var(--ombre);color:var(--a-encre);cursor:pointer}
body.apercu-appli .theme-mob svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:760px){
  body.apercu-appli .theme-mob{display:grid}
  body.apercu-appli .apercu-bandeau{padding:7px 14px;font-size:11.5px;white-space:nowrap}
  body.apercu-appli .apercu-bandeau .ab-long{display:none}
}

/* toucher d'appli : boutons et cartes s'enfoncent légèrement (rien si « réduire les animations ») */
@media(prefers-reduced-motion:no-preference){
  body.apercu-appli .btn,body.apercu-appli .more,body.apercu-appli nav.menu a,body.apercu-appli .appbar a,body.apercu-appli .tlink,body.apercu-appli .theme-mob{transition:transform .12s ease,background .2s,color .2s}
  body.apercu-appli .btn:active,body.apercu-appli .more:active,body.apercu-appli nav.menu a:active,body.apercu-appli .appbar a:active,body.apercu-appli .tlink:active,body.apercu-appli .theme-mob:active{transform:scale(.96)}
  body.apercu-appli .plate,body.apercu-appli .tcard,body.apercu-appli .step,body.apercu-appli .plan,body.apercu-appli .myths summary{transition:transform .15s ease,box-shadow .2s}
  body.apercu-appli .plate:active,body.apercu-appli .tcard:active,body.apercu-appli .plan:active{transform:scale(.985)}
}
body.apercu-appli .btn:focus-visible,body.apercu-appli nav.menu a:focus-visible,body.apercu-appli .appbar a:focus-visible{outline:3px solid var(--a-brand);outline-offset:3px}

/* ======================= PARCOURS CLIENT (maquette) : accès, questionnaire, choix de formule ======================= */
/* accès : une feuille blanche, champs gris arrondis */
body.apercu-appli .auth-card{background:var(--carte);border-radius:var(--a-rr);box-shadow:var(--ombre);padding:clamp(28px,5vw,44px)!important;max-width:460px!important}
body.apercu-appli .auth-card h1{font-size:clamp(34px,6vw,48px)!important;line-height:.95!important}
body.apercu-appli .auth-card .sub{font:16px/1.55 Arial,Helvetica,sans-serif!important;color:var(--a-doux)!important}
body.apercu-appli .auth-form label,body.apercu-appli .qfield label{font:700 13px/1.2 Arial,Helvetica,sans-serif!important;letter-spacing:0!important;text-transform:none!important;color:var(--a-encre)!important}
body.apercu-appli .auth-form input,body.apercu-appli .qfield input,body.apercu-appli .qfield textarea,body.apercu-appli .qfield select,body.apercu-appli .pick-in{
  background:var(--pilule)!important;border:2px solid transparent!important;border-radius:16px!important;padding:14px 16px!important;font:16px/1.35 Arial,Helvetica,sans-serif!important;color:var(--a-encre)!important}
body.apercu-appli .auth-form input:focus,body.apercu-appli .qfield input:focus,body.apercu-appli .qfield textarea:focus,body.apercu-appli .qfield select:focus,body.apercu-appli .pick-in:focus{border-color:var(--a-brand)!important;background:var(--carte)!important}
body.apercu-appli .auth-form .btn{width:100%;background:var(--a-brand)!important}
body.apercu-appli .auth-alt{font:14.5px/1.5 Arial,Helvetica,sans-serif!important}
body.apercu-appli .auth-msg{border-radius:16px!important}

/* questionnaire : une carte par étape, des réponses qu'on coche comme dans une appli */
body.apercu-appli .qtop{background:color-mix(in srgb,var(--fond) 82%,transparent)!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
body.apercu-appli .qstep{background:var(--carte);border:0!important;border-radius:var(--a-r);box-shadow:var(--ombre);padding:28px clamp(18px,4vw,32px)!important;margin-top:16px!important}
body.apercu-appli .qstep h2{font-size:clamp(26px,3.6vw,38px)!important;line-height:1.05!important}
body.apercu-appli .qhint{font-family:Arial,Helvetica,sans-serif!important;color:var(--a-doux)!important}
body.apercu-appli .qcard{background:var(--pilule)!important;border:2px solid transparent!important;border-radius:16px!important;padding:15px 16px!important}
body.apercu-appli .qcard .tx{font:700 15.5px/1.35 Arial,Helvetica,sans-serif!important}
body.apercu-appli .qcard:has(input:checked){background:color-mix(in srgb,var(--a-brand) 14%,var(--carte))!important;border-color:var(--a-brand)!important}
body.apercu-appli .qcard .dot{width:22px!important;height:22px!important;border:2px solid #C9BFAF!important;background:var(--carte)}
body.apercu-appli .qcard:has(input:checked) .dot{border-color:var(--a-bleu)!important;background:var(--a-bleu)}
body.apercu-appli .qcard:has(input:checked) .dot::after{inset:5px!important;background:#fff!important;box-shadow:none!important}
body.apercu-appli .qcard:has(input[type=checkbox]) .dot{border-radius:7px!important}
body.apercu-appli .qwarn{border-radius:16px!important;border:0!important;background:color-mix(in srgb,#f1c232 18%,var(--carte))!important}
body.apercu-appli .qintro{padding-top:12px}
body.apercu-appli .pick-chips .chip,body.apercu-appli .pick-rien{border-radius:999px!important}

/* choix de la formule : la carte choisie s'entoure de bleu, le bouton se remplit */
body.apercu-appli .opt-card{transition:transform .15s ease,box-shadow .2s}
body.apercu-appli .opt-card:has(input:checked){outline:0!important;box-shadow:0 0 0 3px var(--a-brand),0 18px 40px color-mix(in srgb,var(--a-brand) 25%,transparent)!important;transform:translateY(-4px)}
body.apercu-appli .opt-choix{border:0!important;background:var(--pilule);min-height:54px;display:grid!important;place-items:center;font:800 15px/1 Arial,Helvetica,sans-serif!important}
body.apercu-appli .opt-card:has(input:checked) .opt-choix{background:var(--a-brand)!important;color:#111!important}
body.apercu-appli .optrecap{background:var(--carte);border-radius:24px;box-shadow:var(--ombre);border:0!important;padding:18px 22px!important}
body.apercu-appli .recline b{font:800 24px Arial,Helvetica,sans-serif!important;letter-spacing:-.03em}

/* grand titre replié dans la barre du haut (mobile) : le titre de la page remplace le logo */
body.apercu-appli .titre-barre{display:none}
@media(max-width:760px){
  body.apercu-appli .titre-barre{display:block;position:fixed;top:0;left:64px;right:64px;z-index:58;height:64px;line-height:64px;text-align:center;pointer-events:none;
    font:800 16px/64px Arial,Helvetica,sans-serif;letter-spacing:-.02em;color:var(--a-encre);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s}
  body.apercu-appli.titre-replie .titre-barre{opacity:1;transform:none}
  body.apercu-appli .logo{transition:opacity .25s}
  body.apercu-appli.titre-replie .logo{opacity:0}
}
/* barre du haut des pages membres : le lien de droite en pilule */
body.apercu-appli .qtop .back{display:inline-flex;align-items:center;padding:10px 14px;border-radius:999px;background:var(--pilule);color:var(--a-encre)!important;
  font:800 12.5px/1 Arial,Helvetica,sans-serif!important;letter-spacing:0!important;text-transform:none!important;white-space:nowrap;margin-right:48px}
@media(min-width:761px){body.apercu-appli .qtop .back{margin-right:0}}

/* ---------- espace client (maquette) : sur téléphone, les rubriques deviennent la barre d'onglets du bas, comme dans l'appli ---------- */
@media(max-width:760px){
  body.apercu-appli #esp-nav.esp-nav{position:fixed!important;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));top:auto!important;z-index:9998;margin:0!important;
    padding:6px!important;border:0!important;border-radius:24px!important;background:color-mix(in srgb,var(--carte) 88%,transparent)!important;
    backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 10px 30px rgba(40,30,15,.18)!important}
  body.apercu-appli #esp-nav button{background:none!important;border:0!important;color:var(--a-doux)!important;box-shadow:none!important;min-height:52px;flex-direction:column;gap:3px;font:600 10.5px/1 Arial,Helvetica,sans-serif!important}
  body.apercu-appli #esp-nav button[aria-current="true"]{color:var(--a-bleu)!important;font-weight:800!important}
  body.apercu-appli #esp-nav button[aria-current="true"] svg{stroke:var(--a-bleu)!important}
  body.apercu-appli.membre{padding-bottom:96px}
}

/* téléphone de l'accueil : l'onglet Courses (articles à cocher, comme dans l'appli) */
body.apercu-appli .tel-defile[hidden]{display:none!important}
body.apercu-appli .tel-liste{display:flex;flex-direction:column}
body.apercu-appli .tel-art{display:flex;align-items:center;gap:10px;width:100%;padding:11px 2px;border:0;border-bottom:1px solid var(--line);background:none;text-align:left;cursor:pointer;
  font:13.5px/1.35 Arial,Helvetica,sans-serif;color:var(--a-encre)}
body.apercu-appli .tel-art .case{flex:none;width:20px;height:20px;border-radius:7px;border:1.5px solid #C9BFAF;display:grid;place-items:center;transition:background .15s,border-color .15s}
body.apercu-appli .tel-art.fait{color:#A79C8C;text-decoration:line-through}
body.apercu-appli .tel-art.fait .case{background:var(--a-bleu);border-color:var(--a-bleu)}
body.apercu-appli .tel-art.fait .case::after{content:"";width:9px;height:5px;border:solid #fff;border-width:0 0 2px 2px;transform:rotate(-45deg) translate(1px,-1px)}
body.apercu-appli .tel-onglets > div[role=button]:focus-visible{outline:2px solid var(--a-brand);outline-offset:2px;border-radius:8px}

/* mobile : les plats de l'accueil défilent de côté, cartes qui dépassent du bord (comme une boutique d'applis) */
@media(max-width:760px){
  body.apercu-appli .plates{display:flex!important;gap:12px!important;overflow-x:auto;scroll-snap-type:x mandatory;margin-left:calc(-1*var(--edge,20px))!important;margin-right:calc(-1*var(--edge,20px))!important;
    padding:4px var(--edge,20px) 18px!important;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  body.apercu-appli .plates::-webkit-scrollbar{display:none}
  body.apercu-appli .plate{flex:0 0 78%;scroll-snap-align:center}
}
body.apercu-appli .hero h1{font-size:clamp(46px,6vw,86px)!important}

/* mobile : les formules défilent de côté comme un écran d'abonnement d'appli, avec des points */
@media(max-width:760px){
  body.apercu-appli .plans:not(.optgroup){display:flex!important;gap:14px!important;overflow-x:auto;scroll-snap-type:x mandatory;margin-left:calc(-1*var(--edge,20px))!important;margin-right:calc(-1*var(--edge,20px))!important;
    padding:22px var(--edge,20px) 10px!important;scrollbar-width:none}
  body.apercu-appli .plans:not(.optgroup)::-webkit-scrollbar{display:none}
  body.apercu-appli .plans:not(.optgroup) .plan{flex:0 0 86%;scroll-snap-align:center}
  body.apercu-appli .plans-points{display:flex;justify-content:center;gap:7px;margin-top:6px}
  body.apercu-appli .plans-points i{width:7px;height:7px;border-radius:999px;background:#C9BFAF;transition:width .2s,background .2s}
  body.apercu-appli .plans-points i.on{width:22px;background:var(--a-encre)}
}
body.apercu-appli .plans-points{display:none}
@media(max-width:760px){body.apercu-appli .plans-points{display:flex}}

/* ===== bas d'écran mobile : bouton d'action + onglets dans UN bloc qui touche le bas (fond du site, cf. Safari iOS) ===== */
body.apercu-appli .bas-appli{display:none}
@media(max-width:760px){
  body.apercu-appli .dock{display:none!important}
  body.apercu-appli .bas-appli{display:block;position:fixed;left:0;right:0;bottom:0;z-index:9998;background:var(--fond);border-top:1px solid var(--line);
    padding:0 10px env(safe-area-inset-bottom,0px)}
  body.apercu-appli .bas-appli .appbar{position:static!important;left:auto;right:auto;bottom:auto;box-shadow:none!important;background:none!important;backdrop-filter:none;-webkit-backdrop-filter:none;border-radius:0;padding:6px 2px 8px}
  body.apercu-appli .bas-cta{display:flex!important;width:100%;max-height:0;min-height:0!important;margin:0;opacity:0;overflow:hidden;padding:0 20px!important;transition:max-height .25s ease,opacity .2s,margin .25s}
  body.apercu-appli .bas-appli.cta-on .bas-cta{max-height:56px;min-height:52px!important;opacity:1;margin:10px 0 2px}
  body.apercu-appli{padding-bottom:150px}
  /* le bandeau d'aperçu monte sous l'en-tête, en petite pilule */
  body.apercu-appli .apercu-bandeau{top:calc(70px + env(safe-area-inset-top,0px));bottom:auto!important;left:auto;right:12px;transform:none;padding:6px 12px;font-size:11px;opacity:.92}
}

/* ============ ALIGNEMENT SUR LE GUIDE DE L'APPLI (app/maquette/STYLE_APPLI_CONNUE.md, 04/10) ============
   Inspiration : Revolut (gros chiffres serrés, un seul accent), Apple Santé / Forme (cartes blanches, tuiles), Nike Run Club (noir = actif).
   Corrige ce qui contredisait le guide : sur-titres en pilules, noir en surface, aplats bleus et pastel, repas en cartes, halos. */

/* 1. sur-titres : 700 capitales grises, letter-spacing .22em, jamais bleus, sans pilule ni barre */
body.apercu-appli .eyebrow,body.apercu-appli .kick{background:none!important;padding:0!important;border-radius:0!important;color:var(--a-doux)!important;
  font:700 11px/1.2 Arial,Helvetica,sans-serif!important;letter-spacing:.22em!important;margin-bottom:14px!important}
body.apercu-appli .eyebrow::before,body.apercu-appli .kick::before{display:none!important}
body.apercu-appli section.end .eyebrow{background:none!important}

/* 2. titres : -.03em (le guide), le grand titre d'accueil un cran plus serré ; le mot coloré en bleu de TEXTE (#1466b8) */
body.apercu-appli h2{letter-spacing:-.03em!important}
body.apercu-appli h1{letter-spacing:-.04em!important}
body.apercu-appli h1 em,body.apercu-appli h2 em,body.apercu-appli .phead h1 .l2,body.apercu-appli .auth-card h1 .l2{color:var(--a-bleu)!important}

/* 3. le noir ne veut dire que « sélectionné » : plus de pilule ni de bouton noirs */
body.apercu-appli .chute{background:var(--pilule)!important;color:var(--a-encre)!important}
body.apercu-appli section.end .btn.main{background:var(--a-brand)!important;color:#111!important;box-shadow:0 10px 24px color-mix(in srgb,var(--a-brand) 35%,transparent)!important}

/* 4. plus d'aplats : la fin de page, les citations, maintien et évolution deviennent des cartes blanches (filet de 3 px pour identifier) */
body.apercu-appli section.end>.wrap{background:var(--carte)!important;box-shadow:var(--ombre)!important}
body.apercu-appli section.end h2,body.apercu-appli section.end .lede,body.apercu-appli section.end .contact{color:inherit!important}
body.apercu-appli section.end h2{color:var(--a-encre)!important} body.apercu-appli section.end .lede,body.apercu-appli section.end .contact{color:var(--a-doux)!important}
body.apercu-appli section.end .contact a{color:var(--a-bleu)!important}
body.apercu-appli .two blockquote,body.apercu-appli .quote{background:var(--carte)!important;box-shadow:var(--ombre)!important}
body.apercu-appli .two blockquote p,body.apercu-appli .quote blockquote{color:var(--a-encre)!important}
body.apercu-appli .two blockquote footer,body.apercu-appli .quote figcaption{color:var(--a-doux)!important}
body.apercu-appli .maintien{background:var(--carte)!important;border-top:3px solid #f1c232!important}
body.apercu-appli .evo{background:var(--carte)!important;border-top:3px solid #6aa84f!important}
/* étiquettes des plats : pilules neutres, la couleur du repas en point */
body.apercu-appli .plate .tag{background:var(--pilule)!important;color:var(--a-encre)!important;border:0!important;display:inline-flex!important;align-items:center;gap:6px}


/* 6. les repas sont des LIGNES séparées par un filet, pas des cartes (règle 7 du guide) */
body.apercu-appli .meals{gap:0!important}
body.apercu-appli .meals .meal{background:none!important;box-shadow:none!important;border-radius:0!important;border-bottom:1px solid var(--filet-doux)!important}
body.apercu-appli .meals .meal:last-child{border-bottom:0!important}
body.apercu-appli .meals .meal .meal-hd{padding:12px 0 0!important}
body.apercu-appli .meals .meal .meal-in{padding:6px 0 12px 56px!important}
body.apercu-appli .meals .meal .meal-in .ings-l li{border-bottom:0!important;padding:1px 0 1px 13px}
body.apercu-appli .hero h1{font-size:clamp(44px,5.2vw,74px)!important}
/* ligne de repas resserrée, comme la planche : type + kcal, puis le plat juste dessous, puis les grammes */
body.apercu-appli .meals .meal .meal-in{padding-top:0!important}
body.apercu-appli .meals .meal .meal-in .plat{min-height:0!important;margin:-14px 0 4px!important;padding:2px 0!important}
body.apercu-appli .meals .meal .meal-in .dish,body.apercu-appli .meals .meal .meal-in .dn{font:700 15px/1.25 Arial,Helvetica,sans-serif!important}
body.apercu-appli .meals .meal .meal-in .ings-l{font-size:12.5px!important;line-height:1.5!important;color:var(--gris)}
/* formules : la période en sur-titre gris ; « Le plus complet » en pilule neutre (une seule pilule bleue : « Le plus choisi ») */
body.apercu-appli .plan .pterm{color:var(--a-doux)!important;font:700 11px/1.2 Arial,Helvetica,sans-serif!important;letter-spacing:.22em!important}
body.apercu-appli .plan.feat::before{font:800 11px/1 Arial,Helvetica,sans-serif!important;letter-spacing:.06em!important;padding:7px 12px!important}

/* ---- passe page par page selon le guide ---- */
/* règle 2 : l'unité à côté du chiffre, 15 px 700 grise (plus jamais en bleu) */
body.apercu-appli .figures .v small,body.apercu-appli .rstat .v small{font:700 .3em/1 Arial,Helvetica,sans-serif!important;letter-spacing:0!important;color:var(--a-doux)!important;margin-left:.45em!important;vertical-align:.12em}
/* règle 4 : pilules neutres sauf l'info principale ou l'action (étiquettes de rôle, de contact, d'avis) */
body.apercu-appli .coach .role{background:var(--pilule)!important;color:var(--a-encre)!important}
/* contact : les intitulés sont des sur-titres (gris, sans pilule), l'identifiant Instagram ne se coupe pas au milieu d'un mot */
body.apercu-appli .cinfo .ci .k{background:none!important;padding:0!important;border-radius:0!important;color:var(--a-doux)!important;font:700 11px/1.2 Arial,Helvetica,sans-serif!important;letter-spacing:.22em!important;text-transform:uppercase}
@media(max-width:760px){body.apercu-appli .cinfo .ci a{font-size:clamp(14px,4.6vw,19px)!important;overflow-wrap:normal!important;word-break:normal!important}}
/* FAQ : la réponse en texte simple, filet de couleur de la rubrique à gauche (pas d'aplat pastel) */
body.apercu-appli .faq details>p b{color:var(--a-encre)!important;font-weight:800!important}
body.apercu-appli .faq details[open]{box-shadow:var(--ombre)!important}

/* ============ COULEURS DE LA VERSION DE BASE (Dimitri 04/10 : « rajouter de la couleur, les mêmes codes ») ============
   Même langue que l'appli, mais la palette du site revient : sur-titres bleus avec leur trait, trait bleu sous les titres,
   filets de couleur des repas sur les avis, étiquettes des plats colorées, coches bleues, citation violette, bloc vert. */
body.apercu-appli .eyebrow,body.apercu-appli .kick,body.apercu-appli .plan .pterm,body.apercu-appli .cinfo .ci .k{color:var(--blue)!important}
body.apercu-appli .eyebrow::before,body.apercu-appli .kick::before{display:inline-block!important;content:""!important;flex:none!important;width:22px!important;height:2px!important;padding:0!important;border-radius:2px!important;background:var(--brand)!important;margin:0 10px 0 0!important;vertical-align:middle}
body.apercu-appli .eyebrow{display:flex!important;align-items:center}
body.apercu-appli .trace{display:block!important}
body.apercu-appli .figures .v small,body.apercu-appli .rstat .v small{color:var(--blue)!important}
body.apercu-appli .avis-c{border-top:3px solid var(--c)!important}
body.apercu-appli .two blockquote{background:var(--p-violet)!important;border-left:3px solid var(--b-violet)!important;box-shadow:none!important}
body.apercu-appli .quote{border-left:3px solid var(--brand)!important}
body.apercu-appli .plate .tag.pdj{background:var(--pdj-bg)!important;border:1px solid var(--pdj)!important}
body.apercu-appli .plate .tag.dej{background:var(--dej-bg)!important;border:1px solid var(--dej)!important}
body.apercu-appli .plate .tag.sig{background:var(--brand)!important;border:1px solid var(--brand)!important;color:#0a0d12!important}
body.apercu-appli .recois svg{background:var(--brand)!important;stroke:#111!important;border-radius:50%!important}
body.apercu-appli .chute{background:var(--carte)!important;border-left:3px solid var(--brand)!important;border-radius:0 12px 12px 0!important;color:var(--a-encre)!important}
body.apercu-appli .evo{background:var(--p-vert)!important;border-top:0!important;box-shadow:none!important}
body.apercu-appli .meals .meal{border-left:3px solid var(--mc,transparent)!important;padding-left:10px!important}
body.apercu-appli .trace{margin-top:10px!important} body.apercu-appli .trace path{stroke:var(--brand)!important;stroke-dashoffset:0!important} body.apercu-appli .trace .tnode{opacity:1!important;fill:var(--brand)!important;filter:none!important}

/* ============ EFFETS DE LA VERSION DE BASE (Dimitri 04/10 : « il manque des effets et des couleurs ») ============
   Rallumés en retirant les règles qui les éteignaient : auréoles des en-têtes et de l'accueil, grands numéros de section
   en contour, frise des 4 étapes de la Méthode (trait qui se remplit), encadré final en dégradé pastel, guillemets des avis,
   cadres des photos des coachs, avantages des formules et réponses de la FAQ sur fond pastel. Ici, ce qui manque encore : */
body.apercu-appli .figures .fg{border-top:3px solid var(--fc,var(--b-bleu))!important}
body.apercu-appli .figures .fg:nth-child(1){--fc:var(--b-jaune)} body.apercu-appli .figures .fg:nth-child(2){--fc:var(--b-vert)}
body.apercu-appli .figures .fg:nth-child(3){--fc:var(--b-violet)} body.apercu-appli .figures .fg:nth-child(4){--fc:var(--b-bleu)}
body.apercu-appli .meals .meal{background:var(--mp)!important;border-radius:14px!important;border-bottom:0!important;margin-bottom:8px!important}
/* Résultats : les chiffres du haut gardent leur filet de couleur, les kilos des transformations en bleu, le « des avis au-dessus du texte */
body.apercu-appli .rstat{border-top:3px solid var(--rc,var(--b-bleu))!important}
body.apercu-appli .tnum{color:var(--blue)!important}
body.apercu-appli .wcard{padding-top:66px!important} body.apercu-appli .wcard::before{top:12px!important;line-height:1!important}
/* accueil : l'idée reçue ouverte se colore en jaune (comme avant), son bouton en bleu ; l'appel final sur sa bande bleu clair */
body.apercu-appli .myths summary::after{background:color-mix(in srgb,var(--brand) 16%,var(--carte))!important;color:var(--blue)!important}
body.apercu-appli .myths details{transition:background .2s}
body.apercu-appli .myths details[open]{background:var(--p-jaune)!important;border-radius:14px!important;border-bottom-color:transparent!important}
body.apercu-appli .myths details[open] summary,body.apercu-appli .myths details[open] .ans{padding-left:16px!important;padding-right:16px!important}
body.apercu-appli section.end>.wrap{background:var(--p-bleu)!important;box-shadow:none!important}

/* ============ COULEURS ET SURVOLS ENCORE MANQUANTS (comparaison page par page avec la version de base, 04/10 soir) ============
   Relevé par comparaison des styles calculés (ancien site / nouveau), en clair et en obscur, bureau et mobile.
   var(--blue) plutôt que var(--a-bleu) : #1466b8 en clair, #2E9BFF en obscur, exactement comme avant. */
/* le mot de couleur des grands titres retrouve le bleu Elysium vif (accueil, en-têtes de toutes les pages) */
body.apercu-appli h1 em,body.apercu-appli h2 em,body.apercu-appli .phead h1 .l2{color:var(--brand)!important}
/* liens « Voir… », note des avis, rôle des coachs, chute de la formule, sommaire légal : texte bleu comme avant (la pilule reste) */
body.apercu-appli .more,body.apercu-appli .rmoreig a,body.apercu-appli .avis-n,body.apercu-appli .coach .role,body.apercu-appli .chute,
body.apercu-appli .legal .toc .toc-k{color:var(--blue)!important}
body.apercu-appli .more::after{color:var(--blue)}
body.apercu-appli .legal .toc a b,body.apercu-appli .legal h3 .num{color:var(--blue)!important}
body.apercu-appli .legal h3 .num{background:var(--p-bleu)!important;border-radius:999px!important}
/* survols de la version de base, éteints par la maquette */
@media(hover:hover){
  body.apercu-appli .btn.main:hover,body.apercu-appli section.end .btn.main:hover,body.apercu-appli .plan .btn:hover,body.apercu-appli .cform .btn:hover,body.apercu-appli nav.menu a.go:hover{background:#5ab1ff!important;color:#111!important}
  body.apercu-appli .btn.line:hover{background:var(--ice);color:var(--fond)}
  body.apercu-appli nav.menu .theme-btn:hover{color:var(--blue);background:color-mix(in srgb,var(--brand) 16%,var(--carte))}
  body.apercu-appli .more:hover,body.apercu-appli .rmoreig a:hover{background:color-mix(in srgb,var(--brand) 16%,var(--carte))}
  body.apercu-appli .tlink:hover{color:var(--blue)!important}
  body.apercu-appli .plate:hover{transform:translateY(-4px);box-shadow:0 18px 40px -26px rgba(60,45,20,.45),var(--ombre)}
  body.apercu-appli .coach{transition:transform .2s ease,box-shadow .2s}
  body.apercu-appli .coach:hover{transform:translateY(-3px);box-shadow:0 0 0 1.5px rgba(46,155,255,.45),0 26px 60px -34px rgba(46,155,255,.4)}
  body.apercu-appli .faq details{transition:box-shadow .2s}
  body.apercu-appli .faq details:hover{box-shadow:0 0 0 1.5px color-mix(in srgb,var(--line) 55%,var(--brand)),var(--ombre)!important}
}
/* mobile : « programmation » et « confidentialité » débordaient du grand titre à 48 px (texte coupé au bord à 390 px) */
@media(max-width:420px){body.apercu-appli .phead h1{font-size:clamp(34px,11vw,48px)!important}}
/* FAQ : la question ouverte s'entoure de bleu, comme avant (filet devenu anneau, la carte n'a plus de bordure) */
body.apercu-appli .faq details[open]{box-shadow:0 0 0 1.5px color-mix(in srgb,var(--line) 40%,var(--brand)),var(--ombre)!important}

/* Retours de Yoann (04/10, 20h24-20h32) :
   1. l'étiquette kcal des plats n'est plus bleue comme le badge « Signature » : pilule noire, sobre (claire en obscur)
   2. les grands titres sur 2 lignes se chevauchaient (le « q » touchait la ligne du dessous) : interligne relevé partout, toujours serré */
body.apercu-appli .plate .mac .kc{background:var(--actif,#111)!important;color:var(--actif-t,#fff)!important}
body.apercu-appli h1,body.apercu-appli .auth-card h1{line-height:1.06!important}
body.apercu-appli h2,body.apercu-appli .faq-sec .sec-head h2{line-height:1.1!important}
body.apercu-appli h3{line-height:1.2!important}

/* Cartes des plats (accueil) alignées entre elles (Dimitri 04/10) : titre sur 2 lignes réservées, description au même niveau,
   macros calées en bas, et les kcal TOUJOURS sur leur propre ligne à droite (avant : tantôt à côté, tantôt dessous) */
body.apercu-appli .plate{display:flex;flex-direction:column}
body.apercu-appli .plate-in{flex:1;display:flex;flex-direction:column}
body.apercu-appli .plate h3{line-height:1.12!important;min-height:2.24em}
body.apercu-appli .plate .mac{margin-top:auto!important;padding-top:14px}
body.apercu-appli .plate .mac::after{content:"";order:1;flex-basis:100%;height:0}
body.apercu-appli .plate .mac .kc{order:2}
body.apercu-appli .plate-in>.tag{align-self:flex-start}

/* DEUX MODÈLES DE BOUTON, PAS PLUS (Dimitri 06/10) : « Recevoir mon programme » en bleu (.btn.main / .btn),
   tout le reste comme « Voir la méthode » (.btn.line). Les liens-pilules .more prennent le même habit. */
body.apercu-appli .btn.line,body.apercu-appli .plan .btn.line,body.apercu-appli .cform .btn.line{background:var(--pilule)!important;color:var(--a-encre)!important;box-shadow:none!important;border:0!important}
body.apercu-appli .more{min-height:56px;padding:0 28px;font:800 16px/1 Arial,Helvetica,sans-serif;letter-spacing:-.01em;background:var(--pilule);color:var(--a-encre)!important;justify-content:center}
body.apercu-appli .more::after{content:none}
@media (hover:hover){body.apercu-appli .more:hover{background:var(--ice);color:var(--fond)!important}}
body.apercu-appli .rmoreig a.btn.line{min-height:56px;padding:10px 26px;font:800 16px/1.2 Arial,Helvetica,sans-serif;text-align:center;letter-spacing:-.01em;text-transform:none}
/* survol des boutons « Voir la méthode » : le fond s'inverse ET le bouton suit la souris (aimant de site.js, sur tous les .btn) */
@media (hover:hover){body.apercu-appli .btn.line:hover{background:var(--ice)!important;color:var(--fond)!important}}

/* Téléphone de l'accueil, MODE SOMBRE seulement : liseré clair et halo blanc très diffus, pour qu'il ne se fonde pas dans le noir.
   Exception assumée à la charte « pas de lueur » pour ce seul élément (vote Damien, go de Dimitri, 06/10 14h50). Le mode clair ne change pas. */
html[data-theme="obscur"] body.apercu-appli .day{box-shadow:0 0 0 1.5px rgba(235,242,255,.55),0 0 18px 2px rgba(235,242,255,.16),0 0 46px 6px rgba(235,242,255,.07),0 40px 80px rgba(0,0,0,.55)!important}
/* CHIFFRES (11/10, Yoann) : les légendes des 4 tuiles sur la même ligne, sur TOUTES les pages (accueil, Méthode, Qui sommes-nous).
   Chaque tuile partage les 2 rangées de la grille (chiffre / légende) : un chiffre sur 2 lignes (« Des années ») ne décale plus sa légende. */
body.apercu-appli .figures .fg{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0}
body.apercu-appli .figures .v{align-self:end}
