/* kv3-mobile-v3.css : mobile et tablette (sous 1080 px) de la refonte Koncrete V3.
   Partie A : règles du prototype koncrete-site-v93.html (v92 mobile) jamais portées dans Webflow.
   Partie B : corrections de l'audit D64 du 03/11/2026. Aucune règle au-dessus de 1080 px : le desktop ne change pas.
   Les sélecteurs sont préfixés body:not(#kv3m) pour passer devant les feuilles de gabarit (.kv3-v3 ...). */

/* ===== Partie A : prototype v93 ===== */
@media (max-width:1080px){
body:not(#kv3m) .phone{left:auto;right:auto;margin-left:-135px;width:250px;height:510px;position:relative;bottom:auto;margin:36px auto -150px;border-radius:40px;transform:rotate(-3deg) translateY(40px)}
body:not(#kv3m) .hero__video{left:20px;right:20px;width:auto;top:calc(var(--nav-h) + 12px);max-height:42vh}
body:not(#kv3m) .hero{height:auto;min-height:100svh;display:flex;flex-direction:column}
body:not(#kv3m) .hero__video,body:not(#kv3m) .hero.is-video .hero__video{left:16px;right:16px;top:calc(var(--nav-h) + 8px);bottom:auto;width:calc(100% - 32px);height:calc(100% - var(--nav-h) - 8px);max-height:none;aspect-ratio:auto;border-radius:22px}
body:not(#kv3m) .hero h1,body:not(#kv3m) .hero.is-video h1{font-size:clamp(40px,11.5vw,60px);max-width:none;line-height:.95}
body:not(#kv3m) .n-app.in .phone{transform:rotate(-3deg) translateY(0)}
body:not(#kv3m) .hero.is-full .hero__media{position:absolute;inset:0;height:auto}
body:not(#kv3m) .hero.is-full .hero__video{left:0;right:0;top:0;width:100%;height:100%}
body:not(#kv3m) .hero.is-full .hero__content{padding-top:calc(var(--nav-h) + 26svh)}
body:not(#kv3m) .hero.is-full h1{font-size:clamp(44px,12.5vw,64px)}
body:not(#kv3m) .hero.is-full .trust{border-top-color:rgba(255,255,255,.2)}
body:not(#kv3m) .hero.is-full .trust div + div{border-left-color:rgba(255,255,255,.2)}
body:not(#kv3m) .hero.is-full .hero__fullveil{background:linear-gradient(0deg,rgba(6,20,20,.88) 0%,rgba(6,20,20,.6) 45%,rgba(6,20,20,.22) 72%,rgba(6,20,20,.5) 100%)}
body:not(#kv3m) a,body:not(#kv3m) button,body:not(#kv3m) summary,body:not(#kv3m) label,body:not(#kv3m) [role=button]{-webkit-tap-highlight-color:transparent}
body:not(#kv3m) .news-form input,body:not(#kv3m) .pq-f input,body:not(#kv3m) .pq-f select,body:not(#kv3m) .pq-f textarea,body:not(#kv3m) .sort select,body:not(#kv3m) .usearch input,body:not(#kv3m) .osr__f input,body:not(#kv3m) .fld input,body:not(#kv3m) .fld input[type=date]{font-size:16px}
body:not(#kv3m) .social{gap:10px}
body:not(#kv3m) .social a{width:44px;height:44px}
body:not(#kv3m) .news-form .btn{height:42px}
body:not(#kv3m) .news-form input{height:42px}
body:not(#kv3m) .chip,body:not(#kv3m) .ou-quick .chip{height:40px}
body:not(#kv3m) .chips a,body:not(#kv3m) .svl__chips a{display:inline-flex;align-items:center;min-height:40px;padding-top:0;padding-bottom:0}
body:not(#kv3m) .morph__pills a,body:not(#kv3m) .vtabs a{height:40px}
body:not(#kv3m) .ar-copy{height:40px}
body:not(#kv3m) .ar-back{min-height:44px}
body:not(#kv3m) .ar-back i{width:40px;height:40px}
body:not(#kv3m) .kv3-lg-print{height:40px}
body:not(#kv3m) .kv3-lg-sum summary{padding:14px 18px;margin:-16px -18px}
body:not(#kv3m) .kv3-lg-sum[open] summary{padding-bottom:14px;margin-bottom:-4px}
body:not(#kv3m) .ulink{display:inline-block;padding:12px 0;margin:-12px 0}
body:not(#kv3m) .pd-sub a{padding:10px 0;margin:-10px 0}
body:not(#kv3m) dd>a[href^="tel:"],body:not(#kv3m) dd>a[href^="mailto:"]{display:inline-block;padding:10px 0;margin:-10px 0}
body:not(#kv3m) .rng input{height:32px;border-radius:0;background:linear-gradient(rgba(255,255,255,.18),rgba(255,255,255,.18)) 0 50%/100% 4px no-repeat}
body:not(#kv3m) .rng input::-webkit-slider-thumb{width:28px;height:28px}
body:not(#kv3m) .rng input::-moz-range-thumb{width:20px;height:20px}
body:not(#kv3m) .pq-range input{height:32px;border-radius:0;background:linear-gradient(var(--ink),var(--ink)) 0 50%/var(--p,50%) 4px no-repeat,linear-gradient(var(--line),var(--line)) 0 50%/100% 4px no-repeat}
body:not(#kv3m) .pq-range input::-webkit-slider-thumb{width:28px;height:28px}
body:not(#kv3m) .tag{font-size:12px}
body:not(#kv3m) .uh__lb{font-size:11.5px}
body:not(#kv3m) .kfl__p,body:not(#kv3m) .ucard__tag,body:not(#kv3m) .bcard__tag{font-size:12px}
body:not(#kv3m) .gb__axis span{font-size:11.5px}
body:not(#kv3m) .tag,body:not(#kv3m) .uidx__n{-webkit-backdrop-filter:none;backdrop-filter:none}
body:not(#kv3m) .ar-bar{transition:opacity .3s var(--ease),top .35s var(--ease)}
body:has(#nav.m-up) .ar-bar{top:0}
body:not(#kv3m) .m-quote{height:40px;position:relative}
body:not(#kv3m) .foot__legal div{gap:0 22px}
body:not(#kv3m) .seg button{height:38px}
body:not(#kv3m) .pd-thumbs button{height:40px}
body:not(#kv3m) .pnav__links a{padding:12px 13px}
body:not(#kv3m) .kapm__dots button{position:relative}
}
@media (hover:none) and (max-width:1080px){
body:not(#kv3m) .btn,body:not(#kv3m) .chip,body:not(#kv3m) .mbar__main,body:not(#kv3m) .mbar__call,body:not(#kv3m) .m-quote{transition:background .2s,color .2s,box-shadow .2s,transform .18s var(--ease)}
body:not(#kv3m) .btn:active,body:not(#kv3m) .chip:active,body:not(#kv3m) .mbar__main:active,body:not(#kv3m) .mbar__call:active,body:not(#kv3m) .m-quote:active{transform:scale(.97)}
}
@media (max-width:400px){
body:not(#kv3m) .ct-right{flex-wrap:wrap;row-gap:10px}
}
@media (max-width:374px){
body:not(#kv3m) .core__lbl{left:calc(100% + 12px);gap:8px}
body:not(#kv3m) .core__lbl::before{width:12px}
body:not(#kv3m) .core__lbl small{display:none}
}
@media (min-width:700px) and (max-width:1080px){
body:not(#kv3m) .pg,body:not(#kv3m) .foot__inner,body:not(#kv3m) .mmenu__scroll,body:not(#kv3m) .mmenu__foot,body:not(#kv3m) .hero__content,body:not(#kv3m) .services__aside,body:not(#kv3m) .stabs,body:not(#kv3m) .sprog,body:not(#kv3m) .reviews__head,body:not(#kv3m) .row,body:not(#kv3m) .hm__in,body:not(#kv3m) .ia__in,body:not(#kv3m) .kap__in,body:not(#kv3m) .about,body:not(#kv3m) .clients,body:not(#kv3m) .news,body:not(#kv3m) .scards{padding-left:max(32px,env(safe-area-inset-left,0px));padding-right:max(32px,env(safe-area-inset-right,0px))}
body:not(#kv3m) .nav__bar{padding-left:max(32px,env(safe-area-inset-left,0px));padding-right:max(28px,env(safe-area-inset-right,0px))}
body:not(#kv3m) .scards,body:not(#kv3m) .row,body:not(#kv3m) .stabs{scroll-padding-inline:32px}
body:not(#kv3m) .crumbs,body:not(#kv3m) .pnav,body:not(#kv3m) .ct-bar,body:not(#kv3m) .ct-filters,body:not(#kv3m) .usg,body:not(#kv3m) .pd-rel.pgrid,body:not(#kv3m) .ofam,body:not(#kv3m) .factors,body:not(#kv3m) .acc,body:not(#kv3m) .guide,body:not(#kv3m) .svc-tabs,body:not(#kv3m) .hm__grid,body:not(#kv3m) .hm__people,body:not(#kv3m) .ufilter,body:not(#kv3m) .og__l,body:not(#kv3m) .brubs,body:not(#kv3m) .mrail{margin-left:-32px;margin-right:-32px;padding-left:32px;padding-right:32px;scroll-padding-inline:32px}
body:not(#kv3m) .kapm__rail{margin-left:-32px;margin-right:-32px}
body:not(#kv3m) .usg>*,body:not(#kv3m) .pd-rel>*,body:not(#kv3m) .factors>*,body:not(#kv3m) .acc>*,body:not(#kv3m) .guide>*,body:not(#kv3m) .ofam>*,body:not(#kv3m) .og__l>*,body:not(#kv3m) .brubs>*,body:not(#kv3m) .hm__people>*,body:not(#kv3m) .hm__grid>*{scroll-margin-left:32px}
body:not(#kv3m) .usg>*,body:not(#kv3m) .pd-rel>*,body:not(#kv3m) .factors>*,body:not(#kv3m) .acc>*,body:not(#kv3m) .guide>*{flex-basis:44%}
body:not(#kv3m) .ofam>*{flex-basis:31%}
body:not(#kv3m) .mn__h,body:not(#kv3m) .mlinks a{font-size:24px;padding:20px 0}
body:not(#kv3m) .mn__p,body:not(#kv3m) .mn2__p{margin-right:-32px}
body:not(#kv3m) .mn__in{padding-right:32px}
body:not(#kv3m) .mbar{left:max(32px,calc(50% - 280px));right:max(32px,calc(50% - 280px))}
body:not(#kv3m) .hero__cta{flex-direction:row;max-width:620px}
body:not(#kv3m) .hero__cta .btn{flex:1;width:auto}
body:not(#kv3m) .ia__cards--soon{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
body:not(#kv3m) .ia__cards--soon>:first-child,body:not(#kv3m) .ia__cards--soon>:last-child:nth-child(even){grid-column:1/-1}
body:not(#kv3m) .foot__btns{flex-direction:row;max-width:620px}
body:not(#kv3m) .foot__btns .btn{flex:1;width:auto}
body:not(#kv3m) .news-form{max-width:440px}
body:not(#kv3m) .foot__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 32px;padding:32px 0 8px}
body:not(#kv3m) .foot__cols>div+div,body:not(#kv3m) .foot__cols>div+div:last-child{border:0;border-top:1px solid rgba(255,255,255,.14)}
body:not(#kv3m) .foot__cols a{font-size:15.5px}
body:not(#kv3m) .pd-hero{grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:32px;align-items:start}
body:not(#kv3m) .pd-info h1{font-size:clamp(40px,5.8vw,58px)}
body:not(#kv3m) .pd-info .quote{margin-top:4px}
body:not(#kv3m) .faq{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:40px}
body:not(#kv3m) .rvw{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:40px}
body:not(#kv3m) .know{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
body:not(#kv3m) .bas{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:20px}
body:not(#kv3m) .calc{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;padding:44px 36px}
body:not(#kv3m) .an{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:32px;padding:40px 36px}
body:not(#kv3m) .pq-split,body:not(#kv3m) .pq-net{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
body:not(#kv3m) .pq-ba{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
body:not(#kv3m) .pq-facts{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
body:not(#kv3m) .pq-facts b{font-size:clamp(44px,6.4vw,60px)}
body:not(#kv3m) .pq-hero--form{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px}
body:not(#kv3m) .pq-hero--form h1{font-size:clamp(40px,6vw,56px)}
body:not(#kv3m) .pqp-g{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
body:not(#kv3m) .pqi-g{grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:40px}
body:not(#kv3m) .ct-routes{grid-template-columns:repeat(3,minmax(0,1fr))}
body:not(#kv3m) .wlist,body:not(#kv3m) .forbid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:28px}
body:not(#kv3m) .uband{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:32px;padding:48px 40px}
body:not(#kv3m) .oband{grid-template-columns:minmax(0,1fr) auto;gap:32px;padding:40px}
body:not(#kv3m) .svl__row{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:16px 28px;align-items:start}
body:not(#kv3m) .calc__res b{font-size:20px}
body:has(#nav.m-up) .pd-media{top:16px}
body:not(#kv3m) .pqp-r{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
body:not(#kv3m) .fam a{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) auto;gap:12px 28px;padding:28px 0}
body:not(#kv3m) .fam__name{grid-column:1;grid-row:1;font-size:clamp(30px,4.6vw,44px)}
body:not(#kv3m) .fam__chips{grid-column:1;grid-row:2;order:0}
body:not(#kv3m) .fam__use{display:block;grid-column:2;grid-row:1/3;align-self:center}
body:not(#kv3m) .fam__go{grid-column:3;grid-row:1/3}
body:not(#kv3m) .pgrid:not(.pd-rel):not(.pgrid--few),body:not(#kv3m) .pgrid--many:not(.pd-rel){grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 16px}
body:not(#kv3m) .oall{columns:2;column-gap:40px}
body:not(#kv3m) .kv3-lg-body{max-width:680px}
}
/* ===== Partie B : corrections D64 ===== */
/* Dans ce fichier, « body:not(#kv3m) » devient le préfixe body:not(#kv3m) au montage. Aucune règle hors @media. */

/* B1. Transversal mobile et tablette */
@media (max-width:1080px){
/* pied de page : le dernier carrousel des fiches benne, affrètement, évacuation finissait par un embed, donc la section perdait son padding bas (règle .pd-sec:last-child) et le pied de page (margin-top -32px) recouvrait les cartes */
body:not(#kv3m) main .pg>section.pd-sec:last-of-type{padding-bottom:100px}
/* bouton « Devis » de la navbar : texte rogné de 3 px */
body:not(#kv3m) .nav__actions .m-quote{width:auto;min-width:0;flex-shrink:0;padding:0 16px;white-space:nowrap}
/* fil d'Ariane : dernier segment jamais collé au bord, espace de fin réel dans le défileur */
body:not(#kv3m) .crumbs{scroll-padding-inline:20px}
body:not(#kv3m) .crumbs::after{content:"";flex:none;width:12px;height:1px}
body:not(#kv3m) .crumbs .w-dyn-bind-empty,body:not(#kv3m) .crumbs .w-dyn-bind-empty+i{display:none}
/* dégradé de bord sur les défileurs horizontaux (attribut posé par kv3-mobile-v1.js) */
body:not(#kv3m) [data-kv3-fade~="r"]{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent)}
body:not(#kv3m) [data-kv3-fade~="l"]{-webkit-mask-image:linear-gradient(90deg,transparent,#000 44px);mask-image:linear-gradient(90deg,transparent,#000 44px)}
body:not(#kv3m) [data-kv3-fade~="l"][data-kv3-fade~="r"]{-webkit-mask-image:linear-gradient(90deg,transparent,#000 44px,#000 calc(100% - 44px),transparent);mask-image:linear-gradient(90deg,transparent,#000 44px,#000 calc(100% - 44px),transparent)}
/* pied de page : liens de 17 à 22 px de haut, cibles tactiles portées à 40 px sans changer le rythme */
body:not(#kv3m) .foot__cols>div+div ul a{display:inline-block;padding:10px 0;margin:-10px 0}
body:not(#kv3m) .foot__legal div a{padding:12px 0}
/* héros : les trois chiffres alignés en haut, l'étiquette sur deux lignes ne décale plus le chiffre */
body:not(#kv3m) .trust{align-items:start}
body:not(#kv3m) .trust div{display:flex;flex-direction:column;justify-content:flex-start;gap:4px}
/* titres de section : rag équilibré sur deux ou trois lignes */
body:not(#kv3m) .lv-head h2,body:not(#kv3m) .h-display:not(h1){text-wrap:balance}
/* catalogues (Types) : grand titre réduit quand il est long (classe posée par le script), unité jamais orpheline */
body:not(#kv3m) .ct-hero h1{text-wrap:balance}
body:not(#kv3m) .ct-hero h1.is-long{font-size:clamp(40px,11vw,60px);letter-spacing:-.03em}
/* tri des catalogues : 16 px pour éviter le zoom iOS (rappel, le prototype le prévoit aussi) */
body:not(#kv3m) .sort select{font-size:16px}
/* segmentés : jamais de pastille seule sur une deuxième ligne */
body:not(#kv3m) .seg--wrap{display:flex;flex-wrap:wrap;gap:2px;border-radius:18px}
body:not(#kv3m) .seg--wrap .w-button,body:not(#kv3m) .seg--wrap button{flex:1 1 auto;text-align:center;padding:0 10px;white-space:nowrap}
body:not(#kv3m) #eTruck{display:flex;width:100%}
body:not(#kv3m) #eTruck button{flex:1 1 0;height:auto;min-height:44px;padding:6px 6px;white-space:normal;line-height:1.15;font-size:12.5px;text-align:center}
/* tableau des bennes : la note n'est plus collée au filet */
body:not(#kv3m) .specs>.rv>p:last-child{margin-top:14px}
/* calculateur des articles (embed .bl-calc) : les styles de kv3-v8.css perdent contre la remise à zéro du gabarit article */
body:not(#kv3m) .bl-calc{background:var(--paper);border-radius:22px;padding:24px 22px;margin:36px 0 44px;color:var(--ink)}
body:not(#kv3m) .bl-calc__h{display:flex;flex-direction:column;gap:8px;margin-bottom:22px}
body:not(#kv3m) .bl-calc__k{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600}
body:not(#kv3m) .bl-calc__k i{width:8px;height:8px;border-radius:50%;background:var(--accent)}
body:not(#kv3m) .bl-calc__h p{font-size:15px;color:var(--grey-dark);margin:0}
body:not(#kv3m) .bl-calc__in{display:grid;grid-template-columns:1fr;gap:12px}
body:not(#kv3m) .bl-calc__in label{display:flex;flex-direction:column;gap:7px;font-size:12.5px;font-weight:600;color:var(--grey-dark)}
body:not(#kv3m) .bl-calc__f{display:flex;align-items:center;height:52px;padding:0 16px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);transition:box-shadow .25s}
body:not(#kv3m) .bl-calc__f:focus-within{box-shadow:inset 0 0 0 1.5px var(--ink)}
body:not(#kv3m) .bl-calc__f input,body:not(#kv3m) .bl-calc__f select{flex:1;min-width:0;border:0;background:none;outline:none;font:inherit;font-size:16px;font-weight:500;color:var(--ink);height:100%;appearance:none;-webkit-appearance:none;border-radius:0;box-shadow:none;margin:0;padding:0}
body:not(#kv3m) .bl-calc__f select{padding-right:26px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M3 4.5 6 7.5l3-3' stroke='%230E2626' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right center no-repeat;text-overflow:ellipsis}
body:not(#kv3m) .bl-calc__f em{font-style:normal;font-size:14px;color:var(--grey);margin-left:6px}
body:not(#kv3m) .bl-calc__out{display:grid;grid-template-columns:1fr;gap:12px;margin:14px 0 0;padding:0}
body:not(#kv3m) .bl-calc__out div{background:var(--ink);color:#fff;border-radius:18px;padding:16px 18px;margin:0}
body:not(#kv3m) .bl-calc__out dt{font-size:12px;color:rgba(255,255,255,.62);font-weight:500}
body:not(#kv3m) .bl-calc__out dd{font-family:var(--display);font-stretch:var(--display-stretch);font-weight:650;font-size:26px;letter-spacing:-.02em;margin:6px 0 0;color:#fff}
body:not(#kv3m) .bl-calc__note{font-size:13px;color:var(--grey);margin:14px 0 0}
/* tableaux des articles : le défileur garde sa coque, le dégradé de bord signale la suite */
body:not(#kv3m) .bl-table{scroll-padding-inline:20px}
/* page 404 : le titre passait sous la navbar ; icônes flèche absentes dans les ronds */
body:not(#kv3m) #nfHero{padding-top:calc(var(--nav-h) + 36px)}
body:not(#kv3m) #nfFam .fam__go i:empty::before,body:not(#kv3m) #nfRoutes .ct-r i:empty::before{content:"";display:block;width:14px;height:14px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M2 7h10M8 3l4 4-4 4' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M2 7h10M8 3l4 4-4 4' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
/* transporteurs : le panneau « Votre flotte » passe sous la maquette au lieu de la recouvrir */
body:not(#kv3m) .tsoon__vis{display:flex;flex-direction:column;align-items:center;gap:16px}
body:not(#kv3m) .tsoon__vis .tfl{position:static;width:min(320px,100%);margin:0 auto}
/* blog : le carrousel des rubriques garde la marge de 20 px et l'arrondi des cartes */
body:not(#kv3m) .brubs{padding-left:20px;padding-right:20px;scroll-padding-inline:20px}
body:not(#kv3m) .brub{overflow:hidden}
/* fournisseurs : les styles de l'ancien bloc V2 (embed masqué) ne doivent plus cacher le menu */
body:not(#kv3m) .nav__actions>.btn--ghost,body:not(#kv3m) .nav__actions>.btn--accent:not(.m-quote){display:none!important}
body:not(#kv3m) .nav__actions>.m-quote{display:inline-flex!important;width:auto!important;margin:0!important}
body:not(#kv3m) .nav__actions{display:flex!important;width:auto!important}

/* livraison : bloc « Le bon format pour chaque chantier ». Le prototype pose les largeurs et la hauteur des trois
   volumes en style en ligne (--w, --h) ; Webflow les a convertis en classes inline-div-N dont les valeurs viennent
   d'autres pages (inline-div-1 : height 660px). On remet les valeurs du prototype. */
body:not(#kv3m) .scale__col.inline-div-1{--w:260px;height:auto}
body:not(#kv3m) .scale__col.inline-div-3{--w:340px;height:auto}
body:not(#kv3m) .scale__col.inline-div-5{--w:600px;height:auto}
body:not(#kv3m) .scale__blk.inline-div-0,body:not(#kv3m) .scale__blk.inline-div-2,body:not(#kv3m) .scale__blk.inline-div-4{--h:156px;height:156px;width:var(--w);padding:0;transform:none}
body:not(#kv3m) .scale__col{width:var(--w);flex:none;min-width:150px}
body:not(#kv3m) .scale__blk{background:var(--ink);border-radius:12px 12px 4px 4px;position:relative}
body:not(#kv3m) .scale__blk b{position:absolute;left:16px;top:14px;color:var(--white);font-size:19px;font-family:var(--display);font-stretch:var(--display-stretch);font-weight:600;opacity:1}
/* usages : le champ de recherche n'a pas d'input dans le gabarit Webflow (croix seule) : masqué tant qu'il n'en a pas ; tuiles de familles avec vignette (posée par le script) */
body:not(#kv3m) .usearch:not(:has(input)){display:none}
body:not(#kv3m) .svh__tile--t .svh__img img{width:100%;height:100%;object-fit:contain;padding:34% 0 6%;transform:scale(1.08)}
/* usages : chips à largeur libre, libellés jamais coupés */
body:not(#kv3m) .ufam b,body:not(#kv3m) .chip b{white-space:normal}
}

/* B2. Tablette : deux et trois colonnes, pied de page déplié, carrousels à trois cartes */
@media (min-width:700px) and (max-width:1080px){
body:not(#kv3m) .foot__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 32px;padding:32px 0 8px}
body:not(#kv3m) .foot__cols>div:first-child{grid-column:1/-1;padding-bottom:36px}
body:not(#kv3m) .foot__cols>div+div,body:not(#kv3m) .foot__cols>div+div:last-child{border:0;border-top:1px solid rgba(255,255,255,.14)}
body:not(#kv3m) .foot__cols>div+div .foot__h{cursor:default;padding:24px 0 14px;margin:0;font-size:13px;font-weight:500;color:rgba(255,255,255,.5)}
body:not(#kv3m) .foot__cols>div+div .foot__h::after{display:none}
body:not(#kv3m) .foot__cols>div+div ul{max-height:none;overflow:visible;padding-bottom:28px}
body:not(#kv3m) .foot__cols a{font-size:15.5px}
/* logos clients sur quatre colonnes */
body:not(#kv3m) .clw{grid-template-columns:repeat(4,1fr)}
body:not(#kv3m) .clw__c{height:124px}
/* titres des pages géographiques sur la même échelle que les fiches produit */
body:not(#kv3m) .ou-hero h1{font-size:clamp(44px,5.8vw,58px)}
body:not(#kv3m) .ct-hero h1.is-long{font-size:clamp(44px,7vw,72px)}
/* cartes jumelles alignées en haut, sans vide gris */
body:not(#kv3m) .know{align-items:start}
body:not(#kv3m) .know__c{height:auto}
/* carrousels à trois cartes pleines */
body:not(#kv3m) .pd-rel.pgrid>*,body:not(#kv3m) .ofam>*,body:not(#kv3m) .og__l>*,body:not(#kv3m) .hm__people>*{flex-basis:31%}
/* livraison : en tablette les trois volumes se partagent la largeur (règles du prototype à partir de 700 px) */
body:not(#kv3m) .scale{overflow:visible}
body:not(#kv3m) .scale__row{width:auto;gap:clamp(20px,3.4vw,48px);align-items:flex-start}
body:not(#kv3m) .scale__col,body:not(#kv3m) .scale__col.inline-div-1,body:not(#kv3m) .scale__col.inline-div-3,body:not(#kv3m) .scale__col.inline-div-5{flex:0 1 var(--w);width:auto;min-width:0}
body:not(#kv3m) .scale__blk.inline-div-0,body:not(#kv3m) .scale__blk.inline-div-2,body:not(#kv3m) .scale__blk.inline-div-4{width:100%}
/* « À lire aussi » : trois cartes sur trois colonnes, jamais de carte orpheline */
body:not(#kv3m) .bgrid--rel{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
/* texte courant limité à 72 caractères par ligne sur les guides et les pages légales */
body:not(#kv3m) .ar-prose,body:not(#kv3m) .kv3-lg-body,body:not(#kv3m) .rich--rt{max-width:680px}
body:not(#kv3m) .tsoon__vis .tfl{width:min(320px,60%)}
}

/* B3. Petits écrans (360 px) : titres longs des pages légales, chips */
@media (max-width:400px){
body:not(#kv3m) .kv3-lg-hero h1{font-size:clamp(38px,11vw,46px);overflow-wrap:anywhere}
body:not(#kv3m) .ct-hero h1{font-size:clamp(52px,16vw,66px)}
body:not(#kv3m) .ct-hero h1.is-long{font-size:clamp(36px,10.5vw,52px)}
}


/* B3b. Petits écrans : schémas des héros lisibles */
@media (max-width:560px){
/* évacuation : le schéma des filières (SVG 760 × 420) est réduit à 0,46 ; titres grossis, sous-titres masqués */
body:not(#kv3m) .fl text.fl-t{font-size:24px}
body:not(#kv3m) .fl text.fl-s{display:none}
body:not(#kv3m) svg.fl{overflow:visible}
/* location de bennes : cotes du schéma à l'échelle */
body:not(#kv3m) .morph__svg .b-dims text{font-size:22px}
}

/* B4. Animations mobiles (sous 1080 px seulement, mode réduit respecté) */
@media (max-width:1080px){
/* cascade des cartes dans les défileurs et les grilles : décalage posé par le script (--kv3-i) */
body:not(#kv3m) .rv.kv3-stag{transition-delay:calc(var(--kv3-i,0) * 70ms)}
/* compteurs : le chiffre se pose en douceur */
body:not(#kv3m) [data-kv3-count]{transition:opacity .4s var(--ease)}
/* barre basse : glisse à l'arrivée, respiration au repos */
body:not(#kv3m) .mbar{transition:transform .55s var(--ease),opacity .35s}
body:not(#kv3m) .mbar:not(.is-on){opacity:0}
/* navbar : fond qui se pose quand on défile (classe is-solid posée par le script) */
body:not(#kv3m) #nav.kv3-scrolled .nav__bar{box-shadow:0 1px 0 var(--line)}
/* appui : léger enfoncement des cartes tactiles */
body:not(#kv3m) .pcard:active,body:not(#kv3m) .ucard:active,body:not(#kv3m) .ocard:active,body:not(#kv3m) .brub:active,body:not(#kv3m) .bcard:active{transform:scale(.985);transition:transform .18s var(--ease)}
}
@media (max-width:1080px) and (prefers-reduced-motion:reduce){
body:not(#kv3m) .rv.kv3-stag{transition-delay:0ms}
body:not(#kv3m) .mbar{transition:none}
body:not(#kv3m) .pcard:active,body:not(#kv3m) .ucard:active,body:not(#kv3m) .ocard:active,body:not(#kv3m) .brub:active,body:not(#kv3m) .bcard:active{transform:none}
}

/* B5. Accueil mobile, retours du 3 novembre */
@media (max-width:1080px){
/* héros : la vidéo revenait en carte arrondie à cause de la règle .hero__video du prototype (classe .hero.is-full
   devenue .kv3-hero.is-full dans Webflow). Plein écran bord à bord, sans rayon, cadrage un peu plus bas. */
body:not(#kv3m) .kv3-hero.is-full .hero__media{position:absolute;inset:0;height:auto;border-radius:0;overflow:hidden}
body:not(#kv3m) .kv3-hero.is-full .hero__video,body:not(#kv3m) .kv3-hero.is-full.is-video .hero__video{position:absolute;left:0;right:0;top:0;bottom:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;border-radius:0;object-fit:cover;object-position:50% 62%}
body:not(#kv3m) .kv3-hero.is-full{min-height:100svh}
/* section app : téléphones plus petits pour que l'écran et le texte 1 à 4 tiennent ensemble dans la hauteur du mobile */
body:not(#kv3m) .kapm__rail{padding:14px 0 18px}
body:not(#kv3m) .kapm .kph{--w:196px;--h:406px;--r:36px;--b:8px;--s:.4636}
body:not(#kv3m) .kapm .kph__btn--a{top:88px}
body:not(#kv3m) .kapm .kph__btn--b{top:123px;height:39px}
body:not(#kv3m) .kapm .kph__btn--c{top:169px;height:39px}
body:not(#kv3m) .kapm .kph__btn--d{top:135px;height:61px}
body:not(#kv3m) .kapm .kph__island{width:61px;height:18px;margin-left:-30px}
body:not(#kv3m) .kapm__txt{min-height:118px}
body:not(#kv3m) .kapm__txt b{font-size:23px}
body:not(#kv3m) .kapm__txt p{font-size:15px;line-height:1.55}
/* « Notre réseau » : cartes sombres, aucun voile de bord (l'attribut data-kv3-fade n'y est plus posé par le script) */
body:not(#kv3m) .hm__people[data-kv3-fade]{-webkit-mask-image:none;mask-image:none}
}
@media (max-width:370px){
body:not(#kv3m) .kapm .kph{--w:176px;--h:365px;--r:32px;--b:7px;--s:.4163}
body:not(#kv3m) .kapm .kph__btn--a{top:79px}
body:not(#kv3m) .kapm .kph__btn--b{top:110px;height:35px}
body:not(#kv3m) .kapm .kph__btn--c{top:152px;height:35px}
body:not(#kv3m) .kapm .kph__btn--d{top:121px;height:55px}
body:not(#kv3m) .kapm .kph__island{width:55px;height:16px;margin-left:-27px}
}
@media (min-width:700px) and (max-width:1080px){
/* tablette : la hauteur d'écran suffit, le téléphone garde la taille du prototype */
body:not(#kv3m) .kapm .kph{--w:232px;--h:481px;--r:42px;--b:9px;--s:.5487}
body:not(#kv3m) .kapm .kph__btn--a{top:104px}
body:not(#kv3m) .kapm .kph__btn--b{top:146px;height:46px}
body:not(#kv3m) .kapm .kph__btn--c{top:200px;height:46px}
body:not(#kv3m) .kapm .kph__btn--d{top:160px;height:72px}
body:not(#kv3m) .kapm .kph__island{width:72px;height:21px;margin-left:-36px}
body:not(#kv3m) .kapm__txt{min-height:150px}
}