/* ===== m7fix.css — passe responsive mobile (chargée en dernier) ===== */
@media(max-width:600px){
  /* --- « Pas juste un écran » --- */
  .qz-a .l{top:calc(env(safe-area-inset-top,0px) + 92px)!important;font-size:clamp(28px,8.4vw,36px)!important}
  .qz-a .r{left:20px!important;right:20px!important;bottom:4vh!important;font-size:clamp(14px,4vw,16px)!important;line-height:1.4!important}
  .qz-sc{top:50%!important;--sw:72vw;--sh:min(40vw,24vh)}
  .qz-sc.f1{--sw:min(58vw,40vh);--sh:min(43vw,30vh)}
  .qz-sc.f2,.qz-sc.f3,.qz-sc.f4{--sw:min(34vw,19vh);--sh:min(68vw,36vh)}
  .qz-sc .dm{font-size:13px!important}
  .qz-sc .dm.h{top:-34px!important}
  .qz-sc .dm.v{right:-34px!important;width:24px!important}
  .qz-sc .nm,.qz-sc.f4 .nm{bottom:-54px!important;font-size:11px!important}
  .qz-sc .fr .ft{height:26px!important}
  /* --- « Marques, laissez-nous… » --- */
  .qz-b h2{top:calc(env(safe-area-inset-top,0px) + 92px)!important;font-size:clamp(30px,9.4vw,42px)!important;padding:0 16px;box-sizing:border-box}
  .qz-b em{font-size:14px!important;margin:.3em 4px 0 0!important}
  .qz-q{top:40%!important;width:min(42vw,22vh)!important}
  .qz-b .r{left:20px!important;right:20px!important;bottom:calc(2vh + 235px)!important;font-size:clamp(12px,3.4vw,14px)!important}
  .qz-c{bottom:2vh!important;gap:8px!important}
}
@media(max-width:600px){
  /* --- « Avant QTouch / Couches » : schéma plus grand et lisible --- */
  .ml-pin{padding:78px 12px 10px!important;gap:6px!important}
  .ml-hd{min-height:128px!important}
  .ml-hd h2{font-size:clamp(24px,7vw,28px)!important}
  .ml-hd p{font-size:14px!important;margin-top:6px!important}
  .ml-n{height:auto!important;min-height:200px;gap:8px!important;padding:18px!important}
  .ml-n .tx b{font-size:30px!important;line-height:1.1;white-space:nowrap}
  .ml-n .tx small{font-size:19px!important;line-height:1.25}
  .tile{width:76px!important;height:76px!important;border-radius:24px!important}.tile svg{width:40px!important;height:40px!important}
  .ml-n .tg{font-size:20px!important;padding:8px 13px!important}
  .ml-n .lay{font-size:16px!important}
  .n-an .ad{width:80px!important;height:80px!important}
  .n-sc .tx b{font-size:26px!important}.n-sc .tx small{font-size:18px!important}
  .n-sc .cd span{font-size:15px!important;padding:5px 10px!important}
  .n-sc .lv{font-size:16px!important}
  .ml-b{font-size:24px!important;padding:16px 18px!important;max-width:300px;top:330px!important}
  .ml-ct{width:270px!important;left:450px!important}
  .ml-ct b{font-size:24px!important}.ml-ct small{font-size:18px!important}
  .ml-ct .cc span{font-size:16px!important}
  .ml-q img{height:66px!important}.ml-q small{font-size:17px!important}
  .ml-cv .ml-st div{padding:8px 12px!important;border-radius:14px!important}
}
/* --- maquette « appli mobile » : dessinée 2,5× plus grande puis réduite (évite les polices < 6 px que les navigateurs agrandissent) --- */
.tw-c .mph .oapp{inset:auto!important;left:5px!important;top:5px!important;width:205px!important;height:405px!important;transform:scale(.4);transform-origin:0 0;padding:17px 12px 0!important;border-radius:35px!important}
.tw-c .mph .ot{gap:5px!important}.tw-c .mph .ot i{width:15px!important;height:15px!important}
.tw-c .mph .tg{font-size:9px!important;margin-top:7px!important;white-space:nowrap}
.tw-c .mph .oh{margin:10px 0!important}
.tw-c .mph .oh b{font-size:22px!important}
.tw-c .mph .oh span{padding:4px 10px!important;font-size:9px!important}
.tw-c .mph .oc{height:62px!important;margin-bottom:8px!important;border-radius:12px!important}
.tw-c .mph .oc div{padding:0 0 8px 10px!important}
.tw-c .mph .oc b{font-size:12.5px!important}.tw-c .mph .oc small{font-size:8.5px!important}
@media(max-width:600px){
  /* --- tableau de bord : entièrement visible (plus coupé à gauche/droite) --- */
  .tw-db{scale:.88;transform-origin:50% 0}
  .tw-chn:not(.mq){scale:.88;transform-origin:50% 0}
}
@media(max-width:600px){
  /* --- prix : bloc moins rembourré, chiffres côte à côte --- */
  #prix .h7-bk{padding:22px 18px!important}
  #prix .nb{display:flex!important;gap:10px!important;flex-wrap:nowrap!important}
  #prix .nb>div{flex:1 1 0;min-width:0}
}
@media(max-width:700px){
  /* --- matériel : titre sous le menu, cartes sous le titre --- */
  .ps7-head{top:calc(env(safe-area-inset-top,0px) + 84px)!important}
  .ps7-head h2{font-size:clamp(26px,7.6vw,32px)!important}
  .ps7-track{top:max(31vh,240px)!important}
  .ps7-card{height:min(44vh,400px)!important}
}
/* --- « 3 · Et aussi » supprimé : récit raccourci (0,76 de la hauteur) --- */
.tw7{height:1085vh!important}
.tw-chs span+span:last-child{}
@media(max-width:900px){.tw7{height:1175vh!important}}
/* --- matériel : plus de téléphone, les cartes défilent sous le titre --- */
.ps7-hint{display:none!important}
/* téléphone : caché, monte du bas au clic sur un écran */
.ps7-card{cursor:pointer}
.ps7{height:300vh!important}
.ps7-track{top:calc(9vh + 190px)!important}
.ps7-card{height:min(52vh,calc(91vh - 230px),520px)!important}
@media(max-width:700px){.ps7{height:340vh!important}.ps7-track{top:max(31vh,240px)!important}.ps7-card{height:min(46vh,400px)!important}}
/* bouton d'ouverture du téléphone : en haut à droite de chaque écran */
.ps7-card .pl{top:18px!important;bottom:auto!important;right:18px!important;background:#F97316!important;box-shadow:0 8px 18px -6px rgba(249,115,22,.7)}
.ps7-card .pl::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(249,115,22,.45);animation:ps7Pl 1.8s ease-out infinite}
@keyframes ps7Pl{from{transform:scale(.85);opacity:1}to{transform:scale(1.35);opacity:0}}
.ps7-card .nm{right:80px}
@media(prefers-reduced-motion:reduce){.ps7-card .pl::after{animation:none}}

/* téléphone : navigation entre produits */
/* « Choisissez votre écran » : même typographie que « Un clic : c'est en ligne partout » */
.ps7-k{background:none!important;padding:0!important;color:#F26B1D!important;letter-spacing:.14em!important}
.ps7-head h2{font-family:'Figtree',sans-serif!important;font-weight:600!important;letter-spacing:-.045em!important;line-height:1!important;color:#141218!important}
.ps7-head h2 b{background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;color:#141218!important;font-weight:600!important}
/* bannière mobile : la pub Fresh Lab */
.dv.bn .ban.fl{display:flex;align-items:center;gap:4px;padding:3px 4px 3px 3px!important;border-radius:6px!important;background:#fff!important;color:#15130F!important;box-shadow:0 6px 14px -5px rgba(20,18,24,.45)!important;border:1px solid #F0E6DA}
.dv.bn .ban.fl img{width:15px;height:15px;border-radius:4px;object-fit:cover;flex:none}
.dv.bn .ban.fl .ft{display:flex;flex-direction:column;min-width:0;line-height:1.05;text-align:left}
.dv.bn .ban.fl .ft b{all:unset;font-size:6px;font-weight:800;color:#15130F}
.dv.bn .ban.fl .ft small{font-size:4.6px;color:#BE185D;font-weight:700;white-space:nowrap}
.dv.bn .ban.fl em{margin-left:auto;font-style:normal;font-size:5px;font-weight:800;padding:2px 5px;border-radius:99px;background:#BE185D;color:#fff}
/* canaux cliquables → agrandissement */
.tw-chn,.tw-chn .tw-c{pointer-events:auto!important}.tw-c{cursor:zoom-in}

/* zoom d'un canal : l'image reste entière et nette dans la carte (plus d'agrandissement ×3 qui débordait) */

/* « Un espace pour chacun » : vrai bouton de redirection en bas de chaque carte + défilement fluide */
.h7-sg .rl{scroll-snap-type:x proximity!important;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scroll-padding-left:24px}
.h7-sg .cd{scroll-snap-stop:normal;transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s!important}
.h7-sg .cd .im{flex:none}
.h7-sg .cd .go{margin-top:auto!important;display:flex!important;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:0 9px 0 22px;border-radius:999px;background:var(--c);color:#fff!important;font:700 16px/1.2 Inter,system-ui,sans-serif!important;letter-spacing:-.01em;box-shadow:0 14px 28px -16px var(--c);transition:box-shadow .25s,filter .25s}
.h7-sg .cd .im{margin-bottom:22px}
.h7-sg .cd .go svg{flex:none;width:38px;height:38px;padding:9px;box-sizing:border-box;border-radius:50%;background:rgba(255,255,255,.22);fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s}
.h7-sg .cd:hover .go{filter:brightness(1.06);box-shadow:0 18px 34px -14px var(--c)}
.h7-sg .cd:hover .go svg{transform:translateX(4px)}
@media(max-width:600px){.h7-sg .cd .go{min-height:52px;font-size:15px!important;padding-left:18px}.h7-sg .cd .go svg{width:34px;height:34px;padding:8px}}

/* canaux : plus de zoom au clic */
.tw-c{cursor:default!important}
/* bannière mobile Fresh Lab : le texte reste dans le téléphone */
.dv.bn .ban.fl{overflow:hidden;max-width:92%;box-sizing:border-box}
.dv.bn .ban.fl .ft{flex:1 1 auto;min-width:0;margin:0!important;padding:0!important;background:none!important;border-radius:0!important;overflow:hidden}
.dv.bn .ban.fl .ft b,.dv.bn .ban.fl .ft small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.dv.bn .ban.fl .ft small{font-size:4.2px!important;letter-spacing:-.01em}

/* badge « New » à côté du lien App : orange, avec un reflet qui passe de temps en temps */
.h7-nav nav a .nw,.n7 nav a .nw{position:relative!important;top:auto!important;right:auto!important;display:inline-flex;align-items:center;margin-left:6px;vertical-align:1px;height:18px;padding:0 7px!important;border-radius:6px!important;background:#F26B1D!important;color:#fff!important;font-size:10.5px!important;font-weight:700!important;letter-spacing:0!important;text-transform:none!important;overflow:hidden;line-height:1}
.h7-nav nav a .nw::after,.n7 nav a .nw::after{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);transform:skewX(-20deg);animation:nwShine 3.6s ease-in-out infinite}
@keyframes nwShine{0%,62%{left:-120%}82%,100%{left:140%}}
@media(prefers-reduced-motion:reduce){.h7-nav nav a .nw::after,.n7 nav a .nw::after{animation:none}}

/* h7-sg-bleed : le carrousel « Pour qui » va jusqu au bord droit de l écran */
.h7-sg{overflow-x:clip}
.h7-sg .rl{margin-right:calc(50% - 50vw)!important;padding-right:24px}