/* Yuboost : compléments propres au thème WordPress (ce que les maquettes faisaient en JS ou en ligne) */
.yb-pl{display:grid;gap:0}
.yb-pl-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:11px 0;border-bottom:1px solid var(--ink-12);font-size:15px}
.yb-pl-row small{color:var(--muted);margin-left:6px}
.yb-pl-row b{font-weight:400;white-space:nowrap}
.amelia-wrap:empty{display:none}
.gw-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}
@media (max-width:900px){.gw-list{grid-template-columns:1fr}}
.prose{max-width:72ch;font-size:17px;line-height:1.65}
.prose h2{margin-top:40px}.prose h3{margin-top:28px}.prose p,.prose ul,.prose ol{margin-top:16px}
.prose ul,.prose ol{padding-left:22px}
.prose img{max-width:100%;height:auto;border-radius:var(--radius-card)}
.legal-body{max-width:72ch}
.pagination .nav-links{display:flex;gap:8px;flex-wrap:wrap}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;border:1px solid var(--ink-12);border-radius:var(--radius-pill);text-decoration:none;color:var(--ink)}
.pagination .page-numbers.current{background:var(--night);color:#fff;border-color:var(--night)}
.g-main .layer.photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s var(--ease)}
.g-main .layer.photo.on{opacity:1}
/* plus de halos sur les cartes (décision du 20.10), quel que soit l'ordre d'extraction du CSS */
.bcard::before,.price::before,.b::before,.fm::before,.rev::before,.art>div:last-child::before,.quiz .box::before,.w::before,.kpi::before,.pcard::before{content:none}
.brow summary{display:grid;grid-template-columns:minmax(0,1fr) auto 18px;grid-auto-flow:column;align-items:center}
.brow .inc{display:inline;grid-template-columns:none;margin:0}

/* Sélecteur de langue (TranslatePress) */
.nav-lang,.mega-lang,.foot-lang{display:inline-flex;align-items:center;gap:6px;font-size:13px;letter-spacing:.04em}
.nav-lang a,.mega-lang a,.foot-lang a{color:inherit;text-decoration:none;opacity:.55;transition:opacity .25s var(--ease)}
.nav-lang a:hover,.mega-lang a:hover,.foot-lang a:hover{opacity:1}
.nav-lang .on,.mega-lang .on,.foot-lang .on{font-weight:600}
.nav-lang a+ .on,.nav-lang .on+a,.nav-lang a+a,.mega-lang a+ .on,.mega-lang .on+a,.foot-lang a+ .on,.foot-lang .on+a{margin-left:0}
.nav-lang>*+*::before,.mega-lang>*+*::before,.foot-lang>*+*::before{content:"/";margin-right:6px;opacity:.4}
.nav-lang{color:var(--ink);margin-right:2px}
.nav.on-dark:not(.compact) .nav-lang{color:#fff}
body.menu-open .nav.on-dark .nav-lang{color:var(--ink)}
.mega-lang{display:none}
.foot-lang{margin-left:14px}
@media (max-width:900px){.nav-lang{display:none}.mega-lang{display:inline-flex;justify-content:center;font-size:15px;padding-top:6px}}

/* ===== Mobile (24.10) : la maquette ne tenait pas sur téléphone. Règle de Laura : les grilles deviennent des carrousels, sauf les listes. ===== */
@media (max-width:900px){
  /* 1. Carrousel mobile : .m-car gagne toujours, même sur une grille déclarée après */
  .m-car{display:flex!important;grid-template-columns:none!important;flex-wrap:nowrap!important;overflow-x:auto;overflow-y:hidden;gap:14px;min-width:0;contain:inline-size;scroll-snap-type:x mandatory;scroll-padding-left:var(--gutter);scrollbar-width:none;margin-left:calc(var(--gutter) * -1);margin-right:calc(var(--gutter) * -1);padding:4px var(--gutter) 12px;-webkit-overflow-scrolling:touch}
  .m-car::-webkit-scrollbar{display:none}
  .m-car>*{flex:0 0 min(78vw,320px)!important;width:auto;min-width:0;scroll-snap-align:start}
  .pillars.m-car>*{flex-basis:min(80vw,320px)!important}
  .arts.m-car>*,.videos.m-car>*,.w-grid.m-car>*{flex-basis:min(82vw,340px)!important}
  .egrid.m-car>*,.kpis.m-car>*,.prices.m-car>*,.packs.m-car>*{flex-basis:min(70vw,280px)!important}
  .steps.m-car>*{flex-basis:min(82vw,340px)!important}
  /* 2. Grilles sans classe m-car qui doivent aussi défiler sur téléphone */
  .arts:not(#agrid),.videos,.egrid,.w-grid,.packs,.prices,.fam,.fam-x,.how3,.grid3:not(.brail),.feat3,.why .w-grid{display:flex;grid-template-columns:none;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;gap:14px;min-width:0;scroll-snap-type:x mandatory;scroll-padding-left:var(--gutter);scrollbar-width:none;margin-left:calc(var(--gutter) * -1);margin-right:calc(var(--gutter) * -1);padding:4px var(--gutter) 12px}
  .arts:not(#agrid)>*,.videos>*,.egrid>*,.w-grid>*,.packs>*,.prices>*,.fam>*,.fam-x>*,.how3>*,.grid3:not(.brail)>*{flex:0 0 min(78vw,320px);min-width:0;scroll-snap-align:start}
  .arts:not(#agrid)>*,.videos>*{flex-basis:min(82vw,340px)}
  .packs>*,.prices>*,.egrid>*{flex-basis:min(70vw,280px)}
  .fam>*{flex-basis:min(74vw,300px);height:auto}
  /* 3. Listes : une colonne, tout visible (perfusions, bilans, articles, vitamines) */
  .pgrid,#agrid.arts,.bgrid-wide,.vgrid,.grid3.compact{display:grid;grid-template-columns:1fr;gap:16px;padding:0}
  /* 4. Blocs à largeur minimale qui élargissaient la page */
  .g-thumbs{display:flex;grid-template-columns:none;overflow-x:auto;gap:10px;scrollbar-width:none;padding-bottom:4px}
  .g-thumbs::-webkit-scrollbar{display:none}
  .g-thumbs button{flex:0 0 84px}
  .cmp2{grid-template-columns:minmax(0,1fr) 92px 84px;max-width:100%}
  .cmp2 > div > span{font-size:14px;padding:12px 0}
  .cmp2 .cmp2-head span{font-size:12px;line-height:1.2}
  .cmp2 .cmp2-head .brand{font-size:18px}
  .card img{filter:none}
  .job{grid-template-columns:1fr;gap:8px}
  .job .arr{display:none}
  .form,.form *{min-width:0}
  .form .row{grid-template-columns:1fr}
  .form input,.form select,.form textarea,.form .in{width:100%;max-width:100%}
  .c-grid,.city-grid,.ac-hero,.v-grid,.zones .wrap,.fam-head{grid-template-columns:minmax(0,1fr)}
  .fluted-wrap,.fluted{max-width:100%;overflow:hidden}
  .mosaic{grid-auto-rows:110px}
  footer .nl{grid-template-columns:1fr}
  html,body{overflow-x:hidden;max-width:100%}
}
@media (max-width:560px){
  .m-car>*{flex-basis:min(84vw,320px)!important}
  .cmp2{grid-template-columns:minmax(0,1fr) 84px 76px}
}
@media (max-width:700px){
  /* Biomarqueurs : « mesuré dans » passe sous le nom au lieu d'être coupé */
  .brow summary{grid-template-columns:minmax(0,1fr) 24px!important;grid-auto-flow:row!important;row-gap:2px;column-gap:10px}
  .brow summary>*:first-child{grid-column:1;grid-row:1}
  .brow .inc{grid-column:1;grid-row:2;display:block!important;font-size:12px;line-height:1.35;white-space:normal}
  .brow summary>*:nth-child(3),.brow summary::after{grid-column:2;grid-row:1}
  .bcat-h{grid-template-columns:minmax(0,1fr)}
}
