/* Premier ecran et boutons, demande du 15 septembre 2026. */
html.vlt-hero-trust-embedded :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust{min-height:100svh!important;height:auto!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;padding-top:var(--vlt-header-h,78px)!important;padding-bottom:0!important}
html.vlt-hero-trust-embedded :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust>div.relative.z-10{position:relative!important;inset:auto!important;translate:none!important;transform:none!important;min-height:0!important;width:100%;flex:1 0 auto;padding-top:clamp(12px,2svh,24px)!important;padding-bottom:clamp(12px,2svh,24px)!important}
html.vlt-hero-trust-embedded :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust .vlt-hero-copy{padding-top:0!important}
html.vlt-hero-trust-embedded :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust .vlt-hero-copy>:first-child{position:static!important;margin:0 0 12px!important}
/* Marges latérales : all-hero-public.css les fixe (compensation du rembourrage du hero, outils px-4) ;
 * un « margin:0 » ici, plus spécifique, décalait le bandeau de 16 px et le tronquait à droite. */
html.vlt-hero-trust-embedded :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust :is(#vlt-hero-trust,#vlt-hero-trust-extra){position:relative!important;inset:auto!important;margin-top:auto!important;width:100%;flex:0 0 auto;padding:10px max(16px,calc((100vw - 1216px)/2))!important}
html.vlt-hero-trust-embedded :is(#root,#main-content) :is(#vlt-hero-trust,#vlt-hero-trust-extra) ul{overflow:visible!important}
html.vlt-hero-trust-embedded :is(#root,#main-content) :is(#vlt-hero-trust,#vlt-hero-trust-extra) li span{white-space:normal!important}
html :is(#root main,main#main-content) .vlt-hero-bleed :is(.vlt-hero-actions,.vlt-supporting-hero-actions){gap:10px!important;margin:16px 0 0!important}
html :is(#root main,main#main-content) .vlt-hero-bleed :is(.vlt-hero-actions,.vlt-supporting-hero-actions)>a{min-height:46px!important;padding:12px 18px!important;font-size:15px!important;line-height:1.25!important;white-space:normal!important}
a.vlt-blue-cta,button.vlt-blue-cta{background:#0764a3!important;background-image:none!important;color:#fff!important;border-color:#0764a3!important}
a.vlt-blue-cta:hover,button.vlt-blue-cta:hover{background:#055488!important;border-color:#055488!important}
:is(a,button).vlt-blue-cta::before,:is(a,button).vlt-blue-cta::after{background-image:none!important;box-shadow:none!important;filter:none!important}
main button,header button,main a[class*="rounded"],header a[class*="rounded"],footer a[class*="rounded"],.vlt-supporting-hero-actions>a{box-shadow:none!important;filter:none!important;text-shadow:none!important}
main a[class*="inline-flex"],main button,header a[class*="rounded"],header button{max-width:100%;min-height:44px;white-space:normal;overflow-wrap:break-word}
@media(min-width:768px){
 html.vlt-route-core-landing :is(#root main,main#main-content)>.vlt-hero-bleed>div.relative.z-10{display:flex!important;align-items:center!important}
 html.vlt-route-core-landing :is(#root main,main#main-content)>.vlt-hero-bleed .vlt-hero-copy>h1{font-size:clamp(32px,6svh,60px)!important;line-height:1.1!important;margin-bottom:16px!important}
 html.vlt-route-core-landing :is(#root main,main#main-content)>.vlt-hero-bleed .vlt-hero-copy>p{font-size:clamp(16px,2.7svh,20px)!important;line-height:1.45!important;margin-top:12px!important}
}
@media(max-width:767px){
 html.vlt-hero-trust-embedded :is(#root,#main-content) :is(#vlt-hero-trust,#vlt-hero-trust-extra) ul{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px 12px!important;flex-wrap:wrap!important}
 html.vlt-hero-trust-embedded :is(#root,#main-content) :is(#vlt-hero-trust,#vlt-hero-trust-extra) ul>li{padding:0!important;min-height:28px;gap:7px!important;align-items:center!important}
 html.vlt-hero-trust-embedded :is(#root,#main-content) :is(#vlt-hero-trust,#vlt-hero-trust-extra) li span{font-size:12px!important;line-height:1.2!important}
 html.vlt-hero-trust-embedded :is(#root,#main-content) :is(#vlt-hero-trust,#vlt-hero-trust-extra) li svg{width:17px!important;height:17px!important}
 html.vlt-route-core-landing :is(#root main,main#main-content)>.vlt-hero-bleed>div.absolute.inset-0{height:clamp(72px,14svh,120px)!important;flex:0 0 auto!important;overflow:hidden!important}
 html.vlt-route-core-landing :is(#root main,main#main-content)>.vlt-hero-bleed>div.absolute.inset-0 :is(img,picture){height:100%!important;width:100%!important;object-fit:cover!important}
 html.vlt-hero-trust-embedded :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust>div.relative.z-10{padding:12px 20px!important}
 html.vlt-route-core-landing :is(#root main,main#main-content)>.vlt-hero-bleed .vlt-hero-copy>h1{font-size:clamp(25px,3.8svh,32px)!important;line-height:1.12!important;margin:10px 0!important}
 html.vlt-route-core-landing :is(#root main,main#main-content)>.vlt-hero-bleed .vlt-hero-copy>p{font-size:16px!important;line-height:1.4!important;margin:10px 0!important}
 html.vlt-route-core-landing :is(#root main,main#main-content)>.vlt-hero-bleed .vlt-hero-copy>:first-child{padding:5px 10px!important;margin:0 0 8px!important}
 html.vlt-route-core-landing :is(#root main,main#main-content)>.vlt-hero-bleed .vlt-hero-copy>:first-child span{font-size:11px!important;line-height:1.2!important}
 html :is(#root main,main#main-content) .vlt-hero-bleed .vlt-hero-actions{flex-direction:row!important;flex-wrap:wrap!important;gap:8px!important;margin-top:12px!important}
 html :is(#root main,main#main-content) .vlt-hero-bleed .vlt-hero-actions>a{flex:1 1 8rem!important;min-height:46px!important;padding:10px 8px!important;font-size:14px!important}
}
@media(max-width:767px) and (max-height:700px){html.vlt-route-core-landing :is(#root main,main#main-content)>.vlt-hero-bleed>div.absolute.inset-0{height:64px!important}}

:is(#root main,main#main-content) .vlt-hero-bleed :is(a,button){box-shadow:none!important;text-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;filter:none!important}
@media(max-width:767px){
 :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust>div:not(.absolute):not(:is(#vlt-hero-trust,#vlt-hero-trust-extra)){min-height:0!important;padding:12px 20px!important;gap:12px!important}
 :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust h1{font-size:clamp(25px,3.8svh,30px)!important;line-height:1.12!important;margin:10px 0!important}
/* Chapô du hero agrandi ; les lignes que le gabarit marque petites (text-sm : réassurance, « Read in English ») gardent leur taille — passe 4. */
 :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust :is(.vlt-lead,.vlt-hero-subtitle,h1~p:not(.text-sm):not(.text-xs)){font-size:16px!important;line-height:1.4!important;margin-top:10px!important}
 :is(#root main,main#main-content) .vlt-hero-bleed nav[aria-label="Fil d'Ariane"],:is(#root main,main#main-content) .vlt-hero-bleed nav[aria-label="Breadcrumb"]{margin-bottom:10px!important;font-size:12px!important}
 :is(#root main,main#main-content) .vlt-hero-bleed .vlt-author-byline:has(+ #vlt-signature){display:none!important}
 :is(#root main,main#main-content) .vlt-hero-bleed #vlt-signature{font-size:12px!important;line-height:1.3!important}
 :is(#root main,main#main-content) .vlt-hero-bleed .vlt-article-hero-media{height:100px!important;max-width:230px;width:100%;margin:0 auto!important}
 :is(#root main,main#main-content) .vlt-hero-bleed .vlt-article-hero-media>div:first-child{height:100px!important;aspect-ratio:auto!important}
 :is(#root main,main#main-content) .vlt-hero-bleed .vlt-article-hero-media>div.absolute{display:none!important}
 :is(#root main,main#main-content) .vlt-hero-bleed .vlt-article-hero-media img{height:100%!important;object-fit:cover!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed>div:first-child>div.grid{gap:12px!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1{padding:8px!important;max-height:120px!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1>div{height:100px!important;aspect-ratio:auto!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1 img{height:100px!important;width:auto!important;object-fit:contain!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-2>div:has(>a){margin-top:12px!important;flex-direction:row!important;flex-wrap:wrap!important;gap:8px!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-2>div:has(>a)>a{flex:1 1 8rem!important;padding:10px!important;min-height:44px!important;font-size:13px!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-2>p:not(.mt-5){font-size:12px!important;line-height:1.35!important;margin-top:8px!important}
}
/* Fiche produit : description et puces repliées derrière « Voir les caractéristiques » (<details>
 * cloné par compactProductHero, toujours fermé au départ). Sur les écrans assez larges et hauts
 * (tablette portrait, PC), le <details> est masqué et les originaux React, portés par
 * data-vlt-hidden, sont réaffichés : seule la fenêtre décide, aucun état JS. */
.vlt-product-hero-details{margin:12px 0;color:#334155}
.vlt-product-hero-details>summary{color:#0764a3;font-weight:600;cursor:pointer;min-height:44px;display:flex;align-items:center;text-decoration:underline;text-underline-offset:3px}
.vlt-product-hero-details[open]>summary{margin-bottom:10px}
@media(min-width:768px) and (min-height:800px){
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-2>.vlt-product-hero-details{display:none!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-2>p.mt-5[data-vlt-hidden]{display:block!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-2>ul[data-vlt-hidden]{display:flex!important}
}

:is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust>div.relative.z-10>div:first-child{padding-top:0!important}
:is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust>div.relative.z-10>div:first-child>:first-child{position:static!important;margin-top:0!important}
@media(min-width:768px){
 :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust h1{font-size:clamp(30px,5.6svh,50px)!important;line-height:1.1!important;margin:12px 0!important}
 :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust :is(.vlt-lead,.vlt-hero-subtitle,h1~p:not(.text-sm):not(.text-xs)){font-size:clamp(16px,2.5svh,19px)!important;line-height:1.4!important;margin-top:10px!important}
 :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust>div.relative.z-10{gap:24px!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed>div:first-child{padding:16px 32px!important;width:100%;flex:1}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1{padding:24px!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1>div{height:clamp(160px,calc(100svh - 300px),500px)!important;aspect-ratio:auto!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1 img{max-height:100%!important;width:auto!important;object-fit:contain!important}
}
@media(min-width:1024px){
 html.vlt-route-contact :is(#root main,main#main-content) .vlt-contact-split-hero.vlt-hero-has-trust{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;grid-template-rows:1fr auto!important;gap:12px 32px!important}
 html.vlt-route-contact :is(#root main,main#main-content) .vlt-contact-split-hero>picture{display:contents!important}
 html.vlt-route-contact :is(#root main,main#main-content) .vlt-contact-split-hero .vlt-contact-hero-image{grid-column:2!important;grid-row:1!important;position:relative!important;height:clamp(200px,50svh,520px)!important;width:100%!important;align-self:center!important;object-fit:cover!important}
 html.vlt-route-contact :is(#root main,main#main-content) .vlt-contact-split-hero>.vlt-contact-hero-copy{grid-column:1!important;grid-row:1!important;width:100%!important;max-width:none!important;padding:16px 0!important;align-self:center!important}
 html.vlt-route-contact :is(#root main,main#main-content) .vlt-contact-split-hero>:is(#vlt-hero-trust,#vlt-hero-trust-extra){grid-column:1/-1!important;grid-row:2!important}
}

html:is(.vlt-route-about,.vlt-route-solutions) :is(#root main,main#main-content) .vlt-hero-bleed .vlt-ab-hero-trust,
html:is(.vlt-route-about,.vlt-route-solutions) :is(#root main,main#main-content) .vlt-hero-bleed>div.relative.z-10>div:first-child>div.mt-5{display:none!important}
html:is(.vlt-route-about,.vlt-route-solutions) :is(#root main,main#main-content) .vlt-hero-bleed>div.relative.z-10>div:first-child>div.mt-8:not(.vlt-equal-actions){display:flex!important;flex-wrap:wrap!important;gap:8px!important;margin-top:12px!important}
html:is(.vlt-route-about,.vlt-route-solutions) :is(#root main,main#main-content) .vlt-hero-bleed>div.relative.z-10>div:first-child>div.mt-8:not(.vlt-equal-actions)>a{min-height:46px!important;padding:10px 14px!important;font-size:14px!important;flex:1 1 8rem!important;white-space:normal!important;box-shadow:none!important}
@media(max-width:767px){
 html:is(.vlt-route-about,.vlt-route-solutions) :is(#root main,main#main-content) .vlt-hero-bleed .vlt-lead{font-size:16px!important;line-height:1.4!important;margin-top:10px!important}
 html:is(.vlt-route-about,.vlt-route-solutions) :is(#root main,main#main-content) .vlt-hero-bleed .demo-h1{font-size:30px!important;line-height:1.12!important;margin:10px 0!important}
 html:is(.vlt-route-about,.vlt-route-solutions) :is(#root main,main#main-content) .vlt-hero-bleed .vlt-ab-hero-media{height:100px!important;max-width:250px!important;margin:0 auto!important}
 html:is(.vlt-route-about,.vlt-route-solutions) :is(#root main,main#main-content) .vlt-hero-bleed .vlt-ab-hero-media>div:first-child{height:100px!important;aspect-ratio:auto!important}
 html:is(.vlt-route-about,.vlt-route-solutions) :is(#root main,main#main-content) .vlt-hero-bleed .vlt-ab-hero-media>div.absolute{display:none!important}
}

#vlt-hero-trust-extra{z-index:5;border-top:1px solid rgba(255,255,255,.15);background:rgba(0,20,35,.9);color:#fff}
#vlt-hero-trust-extra ul{list-style:none;margin:0;padding:0;align-items:center}
#vlt-hero-trust-extra li{display:flex;align-items:center;gap:8px;min-width:0}
#vlt-hero-trust-extra li span{color:#fff!important;font-size:12px;line-height:1.25}
#vlt-hero-trust-extra li svg{color:#2dc7eb!important;flex-shrink:0;width:18px;height:18px}
@media(min-width:768px){#vlt-hero-trust-extra ul{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}}

/* Photos entieres, garanties dans un bandeau apres le hero. */
html.vlt-trust-below-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra){display:none!important}
html.vlt-trust-below-hero :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust{min-height:100svh!important;height:auto!important}
#vlt-page-trust{position:relative;order:1!important;width:100%;margin:0!important;padding:14px max(20px,calc((100vw - 1216px)/2));background:#001f33;color:#fff;border-top:1px solid rgba(255,255,255,.15)}
#vlt-page-trust ul{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;list-style:none;margin:0;padding:0}
#vlt-page-trust li{display:flex;align-items:center;gap:8px;min-width:0}
#vlt-page-trust li span{color:#fff!important;font-size:13px;line-height:1.3;white-space:normal!important}
#vlt-page-trust li svg{color:#2dc7eb!important;flex-shrink:0;width:19px;height:19px}
@media(max-width:767px){
 #vlt-page-trust ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
 html.vlt-route-core-landing :is(#root main,main#main-content)>.vlt-hero-bleed>div.absolute.inset-0{height:auto!important;max-height:none!important;overflow:visible!important}
 html.vlt-route-core-landing :is(#root main,main#main-content)>.vlt-hero-bleed>div.absolute.inset-0 :is(img,picture){height:auto!important;width:100%!important;object-fit:contain!important}
 :is(#root main,main#main-content) .vlt-hero-bleed .vlt-article-hero-media,
 html:is(.vlt-route-about,.vlt-route-solutions) :is(#root main,main#main-content) .vlt-hero-bleed .vlt-ab-hero-media{height:auto!important;max-width:100%!important;width:100%!important;margin:16px auto!important}
 :is(#root main,main#main-content) .vlt-hero-bleed .vlt-article-hero-media>div:first-child,
 html:is(.vlt-route-about,.vlt-route-solutions) :is(#root main,main#main-content) .vlt-hero-bleed .vlt-ab-hero-media>div:first-child{height:auto!important;aspect-ratio:auto!important}
 :is(#root main,main#main-content) .vlt-hero-bleed :is(.vlt-article-hero-media,.vlt-ab-hero-media) img{height:auto!important;width:100%!important;object-fit:contain!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1{max-height:none!important;padding:20px!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1>div{height:auto!important;aspect-ratio:auto!important;min-height:180px}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1 img{height:auto!important;max-height:360px!important;width:auto!important;max-width:100%!important;object-fit:contain!important}
}

@media(max-width:1023px){
 html.vlt-route-contact :is(#root main,main#main-content) .vlt-contact-split-hero{display:flex!important;flex-direction:column!important;padding-left:0!important;padding-right:0!important}
 html.vlt-route-contact :is(#root main,main#main-content) .vlt-contact-split-hero>picture{display:block!important;position:relative!important;inset:auto!important;order:-1!important;width:100%!important;height:auto!important}
 html.vlt-route-contact :is(#root main,main#main-content) .vlt-contact-hero-image{position:relative!important;inset:auto!important;height:auto!important;width:100%!important;object-fit:contain!important;transform:none!important}
 html.vlt-route-contact :is(#root main,main#main-content) .vlt-contact-hero-copy{position:relative!important;inset:auto!important;translate:none!important;transform:none!important;width:100%!important;padding:16px 20px!important}
}
@media(max-width:767px){
 :is(#root main,main#main-content) .vlt-hero-bleed :is(.vlt-article-hero-media,.vlt-ab-hero-media){order:-1!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1{order:-1!important}
}

#vlt-page-trust{display:block!important}
:is(a,button).vlt-blue-cta::before,:is(a,button).vlt-blue-cta::after{background:none!important;box-shadow:none!important;filter:none!important;opacity:0!important}
@media(max-width:1023px){html.vlt-route-contact :is(#root main,main#main-content) .vlt-contact-split-hero::after{display:none!important}}

/* Visuels auparavant reserves au bureau : visibles aussi sur telephone. */
html.vlt-route-core-landing :is(#root main,main#main-content)>.vlt-hero-bleed{background-color:#001f33!important}
html.vlt-trust-below-hero .vlt-hero-bleed div:has(>.demo-pill),html.vlt-trust-below-hero .vlt-hero-bleed .mt-16:has(svg.lucide-award){display:none!important}
a.vlt-audit-devis-cta{background:#0764a3!important;background-image:none!important;box-shadow:none!important;filter:none!important;text-shadow:none!important}
@media(max-width:1023px){
 :is(#root main,main#main-content) .vlt-hero-bleed>div.relative.z-10:has(>div.relative.hidden img){display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:20px!important;justify-content:flex-start!important}
 :is(#root main,main#main-content) .vlt-hero-bleed div.relative.hidden:has(img){display:block!important;order:-1!important;width:100%!important;min-width:0!important;margin:8px 0 0!important}
 :is(#root main,main#main-content) .vlt-hero-bleed div.relative.hidden:has(img)>div:first-child{height:auto!important;aspect-ratio:auto!important}
 :is(#root main,main#main-content) .vlt-hero-bleed div.relative.hidden img{width:100%!important;height:auto!important;object-fit:contain!important}
}

:is(#root main,main#main-content) .vlt-hero-bleed div.relative.hidden:has(img)>div.absolute{display:none!important}
:is(#root main,main#main-content) .vlt-hero-bleed div.relative.hidden:has(img)>div:first-child{height:auto!important;aspect-ratio:auto!important}
:is(#root main,main#main-content) .vlt-hero-bleed div.relative.hidden img{width:100%!important;height:auto!important;object-fit:contain!important}
a.vlt-audit-devis-cta{color:#fff!important}

/* Photos entières : le cadre suit le ratio de l'image, pas une hauteur arbitraire. */
:is(#root main,main#main-content) .vlt-hero-bleed :is(.vlt-ab-hero-media,.vlt-article-hero-media),
:is(#root main,main#main-content) .vlt-hero-bleed>div.relative.z-10>div.relative:has(>div[class*="aspect-"] img){height:auto!important;max-height:none!important;width:100%!important;max-width:none!important;margin:0!important}
:is(#root main,main#main-content) .vlt-hero-bleed :is(.vlt-ab-hero-media,.vlt-article-hero-media)>div:first-child,
:is(#root main,main#main-content) .vlt-hero-bleed>div.relative.z-10>div.relative:has(>div[class*="aspect-"] img)>div:first-child{height:auto!important;aspect-ratio:auto!important;max-height:none!important}
:is(#root main,main#main-content) .vlt-hero-bleed :is(.vlt-ab-hero-media,.vlt-article-hero-media) img,
:is(#root main,main#main-content) .vlt-hero-bleed>div.relative.z-10>div.relative:has(>div[class*="aspect-"] img) img{display:block!important;width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important}
:is(#root main,main#main-content) .vlt-hero-bleed :is(.vlt-ab-hero-media,.vlt-article-hero-media)>div.absolute,
:is(#root main,main#main-content) .vlt-hero-bleed>div.relative.z-10>div.relative:has(>div[class*="aspect-"] img)>div.absolute{display:none!important}
@media(min-width:1024px){
 html.vlt-route-contact :is(#root main,main#main-content) .vlt-contact-split-hero .vlt-contact-hero-image{height:auto!important;max-height:none!important;object-fit:contain!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1{padding:24px!important;align-self:center!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1>div{height:auto!important;aspect-ratio:auto!important;min-height:0!important;display:flex;align-items:center;justify-content:center}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1 img{display:block;width:100%!important;height:auto!important;max-width:480px!important;max-height:none!important;object-fit:contain!important}
 html.vlt-trust-at-hero-foot:not(.vlt-route-core-landing) :is(#root main,main#main-content) .vlt-photo-backdrop.vlt-hero-has-trust{min-height:max(100svh,calc(100vw * var(--vlt-photo-scale,.558) + var(--vlt-header-h,78px)))!important;height:auto!important}
 :is(#root main,main#main-content) .vlt-photo-backdrop>.vlt-full-hero-media{position:absolute!important;top:var(--vlt-header-h,78px)!important;bottom:auto!important;left:0!important;right:0!important;width:100%!important;height:auto!important;aspect-ratio:var(--vlt-photo-aspect,1.79)!important}
 :is(#root main,main#main-content) .vlt-photo-backdrop>.vlt-full-hero-media img{display:block!important;width:100%!important;height:auto!important;object-fit:contain!important;object-position:center!important}
}
html.vlt-route-business-solution main>section:first-of-type>div.grid>div.relative>div:has(>picture>img){height:auto!important;aspect-ratio:auto!important;max-width:100%}
html.vlt-route-business-solution main>section:first-of-type>div.grid>div.relative>div>picture>img{display:block!important;width:100%!important;height:auto!important;object-fit:contain!important}
html.vlt-route-business-solution.vlt-fleet-photo main>section:first-of-type>div.grid>div.relative{width:min(100%,420px)!important;margin-inline:auto!important}
html.vlt-route-business-solution main>section:first-of-type :is(h1,p,[style*="opacity: 0"],[style*="opacity:0"]){opacity:1!important;transform:none!important}
html.vlt-route-business-solution main>section:first-of-type .mt-8:has(>a){flex-wrap:wrap!important}
html.vlt-route-business-solution main>section:first-of-type .mt-8>a{white-space:normal!important;min-width:0!important;max-width:100%;height:auto!important;min-height:48px!important}

/* Téléphone et tablette : la photo précède le texte, sous le menu flottant. */
@media(max-width:1023px){
 html.vlt-trust-at-hero-foot:not(.vlt-route-core-landing) :is(#root main,main#main-content) .vlt-hero-bleed:has(>div.absolute.inset-0 img){display:flex!important;flex-direction:column!important;padding-top:var(--vlt-header-h,78px)!important;padding-bottom:0!important;min-height:100svh!important}
 html.vlt-trust-at-hero-foot:not(.vlt-route-core-landing) :is(#root main,main#main-content) .vlt-hero-bleed:has(>div.absolute.inset-0 img)>div.absolute.inset-0{position:relative!important;inset:auto!important;order:0!important;flex:0 0 auto!important;width:100%!important;height:auto!important;aspect-ratio:auto!important}
 /* photo empilée au-dessus du texte : plus rien n'est posé dessus, le voile de contraste n'a plus lieu d'être (photo « bien visible », relecture du 23/09) */
 html.vlt-trust-at-hero-foot:not(.vlt-route-core-landing) :is(#root main,main#main-content) .vlt-hero-bleed:has(>div.absolute.inset-0 img)::after{background:none!important}
 html.vlt-trust-at-hero-foot:not(.vlt-route-core-landing) :is(#root main,main#main-content) .vlt-hero-bleed:has(>div.absolute.inset-0 img)>div.absolute.inset-0 :is(picture,img){display:block!important;position:relative!important;inset:auto!important;width:100%!important;height:auto!important;max-height:none!important;opacity:1!important;object-fit:contain!important}
 html.vlt-trust-at-hero-foot:not(.vlt-route-core-landing) :is(#root main,main#main-content) .vlt-hero-bleed:has(>div.absolute.inset-0 img)>div.absolute.inset-0>div{display:none!important}
 html.vlt-trust-at-hero-foot:not(.vlt-route-core-landing) :is(#root main,main#main-content) .vlt-hero-bleed:has(>div.absolute.inset-0 img)>div.relative.z-10{order:1!important;flex:0 0 auto!important;padding:20px!important;display:block!important}
 html.vlt-trust-at-hero-foot:not(.vlt-route-core-landing) :is(#root main,main#main-content) .vlt-hero-bleed:has(>div.absolute.inset-0 img) .vlt-hero-copy{padding:0!important;max-width:680px!important;margin-inline:auto!important}
}
@media(max-width:479px){
 html :is(#root main,main#main-content) .vlt-hero-bleed :is(.vlt-hero-actions,.vlt-supporting-hero-actions){flex-direction:column!important;align-items:stretch!important;width:100%!important}
 html :is(#root main,main#main-content) .vlt-hero-bleed :is(.vlt-hero-actions,.vlt-supporting-hero-actions)>a{flex:0 0 auto!important;width:100%!important;height:auto!important;min-height:48px!important;justify-content:center!important;text-align:center!important;box-sizing:border-box!important}
}

@media(max-width:1023px){
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1{padding:16px!important;max-height:none!important}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1>div{height:auto!important;aspect-ratio:auto!important;min-height:0!important;display:flex;justify-content:center}
 html.vlt-route-product-detail :is(#root main,main#main-content) .vlt-hero-bleed .order-1 img{display:block!important;width:min(100%,280px)!important;height:auto!important;max-height:360px!important;object-fit:contain!important}
}
/* Le texte des grandes bannières occupe la zone sombre supérieure de la photo. */
@media(min-width:1024px){
 html.vlt-route-core-landing :is(#root main,main#main-content) .vlt-photo-backdrop>div.relative.z-10{align-items:flex-start!important;justify-content:flex-start!important;padding-top:28px!important;padding-bottom:28px!important}
 html.vlt-route-core-landing :is(#root main,main#main-content) .vlt-photo-backdrop .vlt-hero-copy{width:100%!important;max-width:920px!important;margin-left:0!important;padding-top:0!important}
 html.vlt-route-core-landing :is(#root main,main#main-content) .vlt-photo-backdrop .vlt-hero-copy>h1{font-size:clamp(36px,3.1vw,46px)!important;line-height:1.1!important;margin:12px 0!important}
 html.vlt-route-core-landing :is(#root main,main#main-content) .vlt-photo-backdrop .vlt-hero-copy>p{max-width:880px!important;font-size:18px!important;line-height:1.4!important;text-shadow:none!important}
}
@media(min-width:768px) and (max-width:1023px){
 html.vlt-route-core-landing :is(#root main,main#main-content) .vlt-photo-backdrop .vlt-hero-copy>h1{font-size:clamp(34px,4.7vw,42px)!important;line-height:1.12!important;max-width:none!important}
 html.vlt-route-core-landing :is(#root main,main#main-content) .vlt-photo-backdrop .vlt-hero-copy>p{font-size:18px!important;line-height:1.4!important}
}
/* A consistent reading rhythm, retaining the original colours and components. */
html { --vlt-section-space:64px; --vlt-section-gap:32px; }
main section.vlt-content-section{padding-block:var(--vlt-section-space)!important;scroll-margin-top:100px}
main section.vlt-content-section :is(.mb-16,.mb-14,.mb-12){margin-bottom:var(--vlt-section-gap)!important}
main section.vlt-content-section :is(h2,h3){text-wrap:balance}
main section.vlt-content-section h2+p{max-width:60ch;line-height:1.65}
/* Réponses de FAQ (composant commun) : ~78 caractères par ligne une fois dépliées au lieu de 100 à 107 ; la carte garde sa largeur. 3rem = rembourrage px-6 du paragraphe. */
details.group\/faq>p{max-width:calc(60ch + 3rem)}
main section.vlt-compact-logos{padding-block:32px!important}
main section.vlt-compact-logos :is(.mb-16,.mb-14,.mb-12){margin-bottom:24px!important}
main section.vlt-compact-logos h2{font-size:clamp(24px,2.3vw,32px)!important;line-height:1.25!important}
main section.vlt-compact-logos p{font-size:16px!important}
main .vlt-overview>div{max-width:1280px;padding-top:24px;padding-bottom:24px}
main .vlt-overview p{margin:0;line-height:1.65}
main .vlt-section-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
main .vlt-section-links a{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;border:1px solid #cbdce6;border-radius:12px;color:#0764a3;font-weight:600;text-decoration:none;background:#fff}
main .vlt-section-links a:hover{border-color:#0764a3;background:#eef6fb}
main .vlt-section-links a:focus-visible,.vlt-footer-toggle:focus-visible{outline:2px solid #0764a3;outline-offset:3px}
main .vlt-mobile-scroll-hint{display:none}
main .vlt-guide-strip:focus-visible{outline:2px solid #0764a3;outline-offset:4px}
/* « À lire également » : cadre au format des photos (16:9) — photo entière ET pleine largeur ; l’ancien cadre de 176 px laissait 36 px de blanc de chaque côté (relecture du 23/09). */
main .vlt-guide-strip .h-44{height:auto!important;aspect-ratio:16/9}
main .vlt-guide-strip img{object-fit:contain!important;transform:none!important}
main .vlt-section-photo-frame{height:auto!important;aspect-ratio:auto!important;overflow:hidden!important}
main .vlt-section-photo-frame img{display:block!important;width:100%!important;height:auto!important;object-fit:contain!important;transform:none!important}
footer .vlt-footer-toggle{display:none}
/* Symmetry follows content columns; forms retain the room needed for fields. */
main .vlt-card-grid{align-items:stretch!important;gap:24px!important}
main .vlt-balanced-card{display:flex!important;flex-direction:column!important;height:100%;min-width:0;box-sizing:border-box}
main .vlt-balanced-card>:is(a,.mt-auto):last-child{margin-top:auto}
main .vlt-balanced-card>.vlt-section-photo-frame{aspect-ratio:16/9!important;flex-shrink:0}
main .vlt-balanced-card .vlt-section-photo-frame img{height:100%!important;object-fit:contain!important}
html :is(#root main,main#main-content,main) .vlt-equal-actions.vlt-equal-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;width:100%!important;max-width:600px!important;align-items:stretch!important;grid-auto-rows:1fr}
html :is(#root main,main#main-content,main) .vlt-equal-actions.vlt-equal-actions>a{display:flex;align-items:center;justify-content:center;min-height:48px!important;height:auto!important;width:100%!important;min-width:0!important;box-sizing:border-box;text-align:center;white-space:normal!important;margin:0!important;padding:12px 16px!important;font-size:15px!important;line-height:20px!important;gap:8px!important}
html :is(#root main,main#main-content,main) .vlt-equal-actions.vlt-equal-actions>a svg{flex-shrink:0;margin:0!important}
/* Rangée de deux boutons dans une section centrée : la grille de 600 px se centre aussi (elle restait calée à gauche, jusqu’à 308 px d’écart avec l’axe du titre — /produits/, Volticom Business, /en/about/…, relecture du 23/09). */
html :is(#root main,main#main-content,main) :is(.vlt-equal-actions:is(.justify-center,.items-center),.text-center>.vlt-equal-actions).vlt-equal-actions{margin-left:auto!important;margin-right:auto!important}
/* … sauf là où le gabarit la remet à gauche à partir d’un point de rupture (heros « justify-center md:justify-start » : 84 px de décalage avec le titre, passe 4). */
@media(min-width:768px){html :is(#root main,main#main-content,main) :is(.vlt-equal-actions[class~="md:justify-start"],[class~="md:text-left"]>.vlt-equal-actions).vlt-equal-actions{margin-left:0!important;margin-right:0!important}}
@media(min-width:1024px){html :is(#root main,main#main-content,main) :is(.vlt-equal-actions[class~="lg:justify-start"],[class~="lg:text-left"]>.vlt-equal-actions).vlt-equal-actions{margin-left:0!important;margin-right:0!important}}
html :is(#root main,main#main-content) .text-center>.vlt-supporting-hero-actions{justify-content:center!important}
@media(min-width:1024px){main .vlt-layout-split{grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:48px!important;align-items:start!important}}
@media(max-width:479px){html :is(#root main,main#main-content,main) .vlt-equal-actions.vlt-equal-actions{grid-template-columns:minmax(0,1fr)!important}}
@media(max-width:1023px){html{--vlt-section-space:48px;--vlt-section-gap:28px}}
@media(max-width:639px){
 html{--vlt-section-space:40px;--vlt-section-gap:24px}
 main section.vlt-content-section h2:not(.text-lg):not(.text-xl):not(.text-base):not(.text-sm){font-size:28px!important;line-height:1.2!important}
 main section.vlt-content-section h3{font-size:20px;line-height:1.3}
 main section.vlt-content-section :is(.gap-10,.gap-12,.gap-16){gap:24px!important}
 main section.vlt-content-section :is(.p-8,.p-10){padding:24px!important}
 main section.vlt-content-section .vlt-feature-icon-card{align-items:flex-start!important;text-align:left!important;min-height:0!important}
 main section.vlt-content-section .vlt-feature-icon-tile{margin-bottom:16px!important}
 main #vlt-installation ol>li{display:grid!important;grid-template-columns:44px minmax(0,1fr);column-gap:16px;row-gap:8px;align-content:start}
 main #vlt-installation ol>li>.vlt-feature-icon-tile{grid-row:1/3;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;max-width:44px!important;max-height:44px!important;padding:10px!important;margin:0!important;border-radius:12px!important}
 main #vlt-installation ol>li>.vlt-feature-icon-tile svg{width:24px!important;height:24px!important}
 main #vlt-installation ol>li>h3,main #vlt-installation ol>li>p{grid-column:2;margin:0!important}
 main section.vlt-content-section :is(.vlt-feature-reveal,.vlt-feature-icon-card){opacity:1!important;transform:none!important}
 main section.vlt-compact-logos{padding-block:28px!important}
 main section.vlt-compact-logos h2{font-size:24px!important}
 main .vlt-overview>div{padding-block:20px}
 main .vlt-overview p{padding:16px!important;font-size:15px!important}
 main .vlt-section-links{gap:8px}
 main .vlt-section-links a{padding:8px 12px;font-size:14px}
 main .vlt-guide-strip{display:grid!important;grid-template-columns:none!important;grid-auto-flow:column;grid-auto-columns:min(82vw,320px);gap:16px!important;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding-inline:2px;padding:4px 2px 16px;max-width:100%;min-width:0}
 main .vlt-guide-strip>a{scroll-snap-align:start;min-width:0}
 main .vlt-mobile-scroll-hint{display:block;font-size:14px;color:#536878;margin:12px 0 0}
 footer nav[data-vlt-footer-group]{border-bottom:1px solid #d8e3ea;padding-block:6px}
 footer nav[data-vlt-footer-group]>:is(h2,h3,h4){display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0!important;min-height:48px}
 footer .vlt-footer-toggle{display:inline-flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;border:0;border-radius:8px;background:transparent;color:inherit;font-size:24px;cursor:pointer}
 footer nav[data-vlt-footer-group][data-vlt-collapsed="1"]>ul{display:none!important}
 /* Rendu direct : sous 639 px, le repli est l'état PAR DÉFAUT, pas un état posé en JS. L'image
  * d'attente est gravée en 1366×900, donc pied déplié, et `data-vlt-collapsed` est un attribut
  * dépendant de la fenêtre que le générateur retire : sans cette règle, le pied servi se replie
  * au remplacement de l'image d'attente (−4 376 px en français, −425 px en anglais). Dès que
  * footerDisclosure a posé l'attribut, la règle ci-dessus reprend la main. */
 footer nav[data-vlt-footer-group]:not([data-vlt-collapsed])>ul{display:none!important}
 /* Le glyphe du bouton est gravé à « − » (état desktop) : l'afficher « + » tant que le JS n'a
  * pas tranché, pour que le premier rendu soit cohérent avec la liste repliée. */
 footer nav[data-vlt-footer-group]:not([data-vlt-collapsed]) .vlt-footer-toggle{font-size:0}
 footer nav[data-vlt-footer-group]:not([data-vlt-collapsed]) .vlt-footer-toggle::after{content:"+";font-size:24px}
 footer nav[data-vlt-footer-group]>ul{padding-bottom:14px}
 /* Accordéon collé seulement si la grille ne porte QUE des rubriques repliables (pied français).
  * Le pied anglais met la rubrique « Site » dans la même grille que la marque et les certifications :
  * y annuler l'espacement collait les trois blocs. */
 footer .vlt-footer-link-grid:not(:has(>*:not([data-vlt-footer-group]))){gap:0!important}
}
@media(prefers-reduced-motion:reduce){main .vlt-guide-strip{scroll-behavior:auto!important}}

/* Catalogue local EV : visuels entiers, catégories dans le texte. */
.vlt-local-guide-image{width:100%;height:100%;object-fit:contain!important;display:block;background:#f3f8fc}
.vlt-guide-category{font-size:.75rem;font-weight:650;color:#0764a3;margin:0 0 14px}
.vlt-local-blog-initial{max-width:1216px;margin:auto;padding:48px 24px}
.vlt-local-blog-initial ul{columns:3;column-gap:32px;padding-left:20px}
.vlt-local-blog-initial li{break-inside:avoid;margin-bottom:12px}
@media(max-width:900px){.vlt-local-blog-initial ul{columns:2}}
@media(max-width:600px){.vlt-local-blog-initial ul{columns:1}}

.vlt-guide-topics{background:#f3f8fc;padding:24px max(24px,calc((100vw - 1216px)/2));border-bottom:1px solid #e0eaf2}
.vlt-guide-topics label{display:flex;gap:20px;align-items:center;max-width:860px;margin:auto;font-weight:650;color:#002942}
.vlt-guide-topics select{flex:1;min-width:0;background:#fff;border:1px solid #b5c9d6;border-radius:12px;padding:12px 16px;min-height:48px;font:inherit}
.vlt-visible-section-heading{position:static!important;width:auto!important;height:auto!important;padding:0!important;margin:0 0 32px!important;overflow:visible!important;clip:auto!important;white-space:normal!important;font-size:clamp(26px,2.3vw,34px)!important;line-height:1.25!important;color:#002942;text-align:center}
main .vlt-editorial-card{display:flex!important;flex-direction:column!important;aspect-ratio:auto!important;height:auto!important;flex:0 0 calc(25% - 18px);min-width:0!important;background:#002942}
/* Carrousels éditoriaux : photo qui remplit son cadre (recadrage ≤ 11 % sur les photos paysage, sujet gardé par le point de cadrage) ; les photos en portrait ont été remplacées par des versions paysage (relecture du 23/09). */
main .vlt-editorial-card>picture>img{position:static!important;inset:auto!important;width:100%!important;height:190px!important;object-fit:cover!important;object-position:50% 35%!important;transform:none!important;background:#edf5fa}
main .vlt-editorial-card>div.absolute:not(:has(h3)){display:none!important}
main .vlt-editorial-card>div:has(h3){position:static!important;inset:auto!important;flex:1;padding:24px!important;display:flex;flex-direction:column;background:#002942}
main .vlt-editorial-card h3{font-size:20px!important;line-height:1.35!important;color:#fff!important}
main .vlt-editorial-card p{color:#d8e6ef!important}
main .vlt-editorial-card a{margin-top:auto;min-height:44px;color:#fff!important}
main .vlt-service-photo{display:flex!important;align-items:center!important;min-height:0!important;background:#002942!important}
main .vlt-service-photo>picture>img{display:block!important;position:static!important;inset:auto!important;width:100%!important;height:auto!important;object-fit:contain!important;opacity:1!important}
main .vlt-service-photo>div.absolute{display:none!important}
/* Relecture passe 4 (lot 13, majeur) : sur ordinateur, la photo entière laissait 80 px de marine au-dessus et au-dessous
 * et touchait le bord droit de la carte, coins carrés — on la croyait coupée. Même marge que la colonne de texte
 * (p-10, lg:p-16) sauf côté texte, coins arrondis. Photo toujours à droite (/particuliers/, /professionnels/, EN). */
@media(min-width:768px){main .vlt-service-photo:last-child{padding:40px 40px 40px 0!important}main .vlt-service-photo>picture>img{border-radius:16px!important}}
@media(min-width:1024px){main .vlt-service-photo:last-child{padding:64px 64px 64px 0!important}}
@media(max-width:767px){main .vlt-service-photo:last-child{padding:0 20px 20px!important}main .vlt-service-photo>picture>img{border-radius:12px!important}}
@media(max-width:1023px){main .vlt-editorial-card{flex-basis:calc(50% - 12px)}}
@media(max-width:639px){main .vlt-editorial-card{flex-basis:85vw}main .vlt-editorial-card>picture>img{height:210px!important}}
@media(max-width:600px){.vlt-guide-topics label{display:grid;gap:10px}.vlt-guide-topics select{width:100%}}

/* Les mots d’une réassurance courte doivent rester séparés dans le flux. */
html main p.vlt-quote-note{display:block!important;line-height:1.7!important}
html main p.vlt-quote-note>span[aria-hidden="true"]{display:inline!important;margin-inline:6px;color:inherit!important}
html main p.vlt-quote-note>svg{display:inline-block!important;vertical-align:middle;margin-right:6px}
main #vlt-budget .vlt-equal-actions{margin-top:24px!important}

#devis-pro form .text-gray-400{color:#526477!important;font-size:13px!important;line-height:1.5!important}

/* picture:display:contents ne crée pas de couche ; placer l’image elle-même
   au-dessus du fond évite sa disparition dans le hero Contact sur PC. */
html.vlt-route-contact .vlt-contact-split-hero .vlt-contact-hero-image{z-index:2!important;border-radius:24px}
html.vlt-route-contact .vlt-contact-split-hero::after{display:none!important}
@media(min-width:1024px){header nav>a[href="/devenir-partenaire/"]{display:inline-flex!important;align-items:center;justify-content:center}}

/* Cartes au coin des photos, référence fournie par Anna le 20 septembre.
   Le chevauchement reste dans le flux pour réserver la place sous chaque image. */
main .vlt-photo-feature{position:relative;min-width:0;overflow:visible}
main .vlt-photo-caption{position:relative!important;inset:auto!important;transform:none!important;display:block!important;z-index:2;width:max-content!important;max-width:min(320px,calc(100% - 16px))!important;margin:-112px -24px 0 auto!important;padding:24px!important;border:0!important;border-radius:16px!important;background:#fff!important;color:#002942!important;box-shadow:0 16px 28px rgb(0 31 51 / 14%)!important;text-align:left}
main .vlt-photo-caption[class*="left-"]{margin-left:-24px!important;margin-right:auto!important}
main .vlt-photo-caption>div:has(>svg){display:flex!important}
main .vlt-photo-caption>div:has(>svg):not(:has(p)){width:48px;height:48px;margin-bottom:12px!important}
main .vlt-photo-caption p{margin:0!important;font-size:15px!important;line-height:1.45!important;white-space:normal}
main .vlt-photo-caption p.font-bold{font-size:17px!important;font-weight:750!important;color:#002942!important;margin-bottom:3px!important}
main .vlt-photo-caption p:not(.font-bold){color:#667085!important}
main .vlt-photo-caption.vlt-photo-caption-dark{background:#002942!important;color:#fff!important;max-width:min(320px,calc(100% - 16px))!important;margin-top:-112px!important;padding:28px!important}
main .vlt-photo-caption-dark p.font-bold{color:#fff!important}
main .vlt-photo-caption-dark p:not(.font-bold){color:#d6e4ed!important;line-height:1.6!important}
main .vlt-photo-caption-dark>div:has(svg){gap:12px!important;margin-bottom:10px!important}
html body main .vlt-caption-section a.vlt-photo-cta{display:inline-flex!important;align-items:center;justify-content:center;gap:16px;min-height:54px;padding:15px 24px!important;border-radius:12px!important;max-width:100%;font-weight:750!important;font-size:17px!important;line-height:1.4!important;text-align:center!important;box-shadow:none!important;filter:none!important;text-shadow:none!important;white-space:normal}
main .vlt-photo-cta svg{flex:none;width:22px;height:22px}
@media(max-width:1023px){
 main .vlt-photo-caption,main .vlt-photo-caption[class*="left-"]{margin-right:16px!important;margin-left:auto!important;margin-top:-48px!important}
 main .vlt-photo-caption[class*="left-"]{margin-left:16px!important;margin-right:auto!important}
 main .vlt-photo-caption.vlt-photo-caption-dark{margin-top:-48px!important}
}
@media(max-width:639px){
 main .vlt-photo-caption,main .vlt-photo-caption[class*="left-"],main .vlt-photo-caption.vlt-photo-caption-dark{padding:20px!important;margin-top:-28px!important;max-width:calc(100% - 24px)!important;border-radius:14px!important}
 main .vlt-photo-caption>div:has(>svg):not(:has(p)){width:40px;height:40px;margin-bottom:10px!important}
 main .vlt-photo-caption p.font-bold{font-size:16px!important}
 main .vlt-photo-caption p{font-size:14px!important}
 html body main .vlt-caption-section a.vlt-photo-cta{width:100%;font-size:16px!important;min-height:52px;padding:14px 18px!important}
}

html body main .vlt-caption-section a.vlt-photo-cta{background:#0764a3!important;color:#fff!important;border:1px solid transparent!important}
html body main .vlt-caption-section a.vlt-photo-cta:hover{background:#055184!important}
html body main .vlt-caption-section a.vlt-photo-cta-purple{background:#6a3fe0!important}
html body main .vlt-caption-section a.vlt-photo-cta-purple:hover{background:#5a2fd0!important}

/* Un même débord de 32 px sous chaque photo sur ordinateur. */
@media(min-width:1024px){
 main .vlt-photo-feature{padding-bottom:32px!important}
 main .vlt-photo-caption,main .vlt-photo-caption.vlt-photo-caption-dark{position:absolute!important;top:auto!important;bottom:0!important;left:auto!important;right:-24px!important;margin:0!important}
 main .vlt-photo-caption[class*="left-"]{left:-24px!important;right:auto!important;margin:0!important}
 html body main .vlt-caption-section a.vlt-photo-cta{width:min(100%,380px)!important;min-height:56px!important}
}
/* Dimensions stables des actions, y compris pendant les animations du thème. */
html body main .vlt-caption-section a.vlt-photo-cta{transition:none!important;transform:none!important}
@media(min-width:640px){html body main .vlt-caption-section a.vlt-photo-cta{width:min(100%,380px)!important;min-height:56px!important}}

html body main .vlt-caption-section a.vlt-photo-cta:focus-visible{outline:2px solid #0764a3!important;outline-offset:4px}
/* Pagination du carrousel des livres blancs : les 11 pastilles tiennent sur une ligne, y compris sur téléphone (7 + 4
 * auparavant, à cause du minimum global de 44 px). Cible 24 × 24 px, conforme au critère WCAG 2.2 2.5.8 (23/09). */
main button.min-w-\[24px\].min-h-\[24px\]{min-width:24px!important;min-height:24px!important;width:24px;height:24px;padding:0!important}
main div.flex.justify-center:has(>button.min-w-\[24px\].min-h-\[24px\]){gap:4px!important;flex-wrap:nowrap!important}
/* Extraits des cartes de guides : trois lignes pleines. Étiré par flex-1, l'extrait laissait voir le haut d'une
 * 4e ligne sous les points de suspension (/en/articles/, relecture du 23/09) ; l'élément suivant prend l'espace. */
main p.line-clamp-3.flex-1{flex:0 0 auto}
main p.line-clamp-3.flex-1+*{margin-top:auto}
/* Traits décoratifs isolés de la maquette (64 × 4 px sous les cartes « Ce que comprend votre accompagnement » et sous
 * « Voir nos réalisations ») : lus comme un indicateur de pagination à un seul point (relecture du 23/09). */
main :is(div.mx-auto.mt-20.h-1.w-16.rounded-full, div.w-16.h-1.mt-12.rounded-full){display:none}
/* Catalogue des bornes sur téléphone : deux colonnes compactes au lieu d'une colonne de 42 cartes de 463 px
 * (≈ 20 700 px, 23 écrans — relecture du 23/09). Les fonctions détaillées restent sur chaque fiche. */
@media(max-width:639px){
 main .grid.vlt-card-grid:has(>a[href*="/produits/"],>a[href*="/charging-stations/"]){grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
 main .grid.vlt-card-grid>a:is([href*="/produits/"],[href*="/charging-stations/"])>div:first-child>div.p-7{padding:12px!important}
 main .grid.vlt-card-grid>a:is([href*="/produits/"],[href*="/charging-stations/"])>div.p-5{padding:12px!important}
 main .grid.vlt-card-grid>a:is([href*="/produits/"],[href*="/charging-stations/"]) h3{font-size:15px!important;line-height:1.3!important}
 main .grid.vlt-card-grid>a:is([href*="/produits/"],[href*="/charging-stations/"]) ul{display:none!important}
 main .grid.vlt-card-grid>a:is([href*="/produits/"],[href*="/charging-stations/"]) span.rounded-full{padding:2px 8px!important;font-size:11px!important}
}
/* Tableaux comparatifs sur téléphone : ils défilent dans leur cadre au lieu d'écraser leurs colonnes à 100-130 px
 * (cellules de 6 à 9 lignes, relecture du 23/09). */
@media(max-width:639px){
 main div.overflow-x-auto>table{min-width:560px}
 main div.overflow-x-auto>table:has(tr>:nth-child(5)){min-width:720px}
}
/* Catalogue, téléphone (passe 4) : tableaux défilants lisibles — colonne de tête figée pendant le défilement horizontal,
   colonnes de puissance assez larges pour ne plus couper les mots ; la marque, déjà dans le nom du modèle, est masquée. */
@media(max-width:767px){
main section:is([aria-labelledby="choix-puissance"],[aria-labelledby="comparatif-bornes"]) table :is(th,td):first-child{position:sticky;left:0;z-index:1;background-color:inherit;box-shadow:1px 0 0 #e3edf4}
main section:is([aria-labelledby="choix-puissance"],[aria-labelledby="comparatif-bornes"]) thead th:first-child{background-color:#002942}
main section[aria-labelledby="choix-puissance"] table{min-width:780px!important}
main section[aria-labelledby="choix-puissance"] table :is(th,td):first-child{width:128px}
main section[aria-labelledby="comparatif-bornes"] table :is(th,td):nth-child(2){display:none}
}

/* 27/09 — Liens de lecture réels et sommaires disponibles pendant la lecture. */
.vlt-guide-read{min-height:44px;width:fit-content;text-decoration:none}
.vlt-guide-read:focus-visible{outline:2px solid #0764a3;outline-offset:4px;border-radius:3px}
@media(min-width:1024px){
 /* Gabarit historique à deux colonnes : le dernier lien reste accessible sur petit PC. */
 html.vlt-article-detail main aside:has(nav[aria-label*="Sommaire" i])>div,
 html.vlt-article-detail main aside:has(nav[aria-label*="contents" i])>div{
  position:sticky;top:100px;max-height:calc(100svh - 120px);overflow:auto;overscroll-behavior-y:contain;scrollbar-width:thin;scroll-padding-block:12px
 }
 /* Articles à sommaire intégré : la grille place le sommaire à côté du texte sans déplacement du DOM. */
 html.vlt-article-detail main>div:has(>.vlt-article-toc){
  display:grid;grid-template-columns:16rem minmax(0,1fr);column-gap:3rem;align-items:start;max-width:72rem
 }
 html.vlt-article-detail main>div:has(>.vlt-article-toc)>:not(.vlt-article-toc){grid-column:2;min-width:0}
 html.vlt-article-detail main>div:has(>.vlt-article-toc)>.vlt-prose{grid-row:1}
 html.vlt-article-detail main>div>.vlt-article-toc{
  grid-column:1;grid-row:1;position:sticky;top:100px;max-height:calc(100svh - 120px);overflow:auto;overscroll-behavior-y:contain;scrollbar-width:thin;margin:0;width:100%;box-sizing:border-box
 }
 html.vlt-article-detail main>div>.vlt-article-toc ol{grid-template-columns:1fr}
}

/* Accueil FR : deux cartouches de dimensions identiques, un seul libellé. */
main .vlt-photo-caption.vlt-home-audience-card{width:180px!important;min-height:136px;box-sizing:border-box}
main .vlt-photo-caption.vlt-home-audience-card p.font-bold{margin-bottom:0!important}
@media(max-width:639px){main .vlt-photo-caption.vlt-home-audience-card{min-height:114px}}
/* Toutes les grandes bannières : composition du site public, 20 septembre 2026. */
html.vlt-route-core-landing #root main>.vlt-hero-bleed{
 min-height:100svh!important;height:auto!important;padding:var(--vlt-header-h,78px) 0 0!important;
 display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;
}
html.vlt-route-core-landing #root main>.vlt-hero-bleed>div.relative.z-10{
 position:relative!important;inset:auto!important;transform:none!important;translate:none!important;
 flex:1 0 auto!important;min-height:0!important;width:100%!important;max-width:none!important;margin:0!important;
 padding:clamp(12px,2svh,24px) max(20px,calc((100vw - 1216px)/2))!important;
 display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;
}
html.vlt-route-core-landing #root main>.vlt-hero-bleed .vlt-hero-copy{
 width:100%!important;max-width:768px!important;padding:0!important;margin:0!important;
}
html.vlt-route-core-landing #root main>.vlt-hero-bleed .vlt-hero-copy>h1{
 font-size:clamp(32px,6svh,60px)!important;line-height:1.1!important;margin:12px 0 16px!important;max-width:768px!important;
}
html.vlt-route-core-landing #root main>.vlt-hero-bleed .vlt-hero-copy>p{
 font-size:clamp(16px,2.7svh,20px)!important;line-height:1.45!important;max-width:672px!important;margin:12px 0 0!important;
 /* ombre sur le texte seulement (photo sans voile, décision du 03/09) : renforcée le 23/09, chapô mesuré à 1,8:1 sur les carrosseries claires */
 text-shadow:0 1px 2px rgba(0,20,34,.95),0 0 10px rgba(0,20,34,.8),0 2px 18px rgba(0,20,34,.55)!important;
}
html.vlt-route-core-landing #root main>.vlt-hero-bleed :is(#vlt-hero-trust,#vlt-hero-trust-extra){
 display:block!important;position:relative!important;inset:auto!important;flex:0 0 auto!important;margin:0!important;
 padding:10px max(16px,calc((100vw - 1216px)/2))!important;
}
html.vlt-route-core-landing #root main>.vlt-hero-bleed .mt-16:has(svg.lucide-award){display:none!important}
@media(min-width:1024px){
 html.vlt-route-core-landing #root main>.vlt-hero-bleed>div.absolute.inset-0{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;aspect-ratio:auto!important;
 }
 html.vlt-route-core-landing #root main>.vlt-hero-bleed>div.absolute.inset-0 img{
  display:block!important;width:100%!important;height:100%!important;max-height:none!important;object-fit:cover!important;object-position:50% 60%!important;
 }
}
@media(max-width:1023px){
 html.vlt-route-core-landing #root main>.vlt-hero-bleed>div.absolute.inset-0{
  position:relative!important;inset:auto!important;order:0!important;flex:0 0 auto!important;width:100%!important;height:auto!important;aspect-ratio:auto!important;
 }
 html.vlt-route-core-landing #root main>.vlt-hero-bleed>div.absolute.inset-0 img{
  display:block!important;position:relative!important;width:100%!important;height:auto!important;object-fit:contain!important;
 }
 html.vlt-route-core-landing #root main>.vlt-hero-bleed>div.relative.z-10{display:block!important;padding:12px 20px 20px!important}
 html.vlt-route-core-landing #root main>.vlt-hero-bleed .vlt-hero-copy>h1{font-size:clamp(25px,3.8svh,32px)!important;line-height:1.12!important;margin:10px 0!important}
 html.vlt-route-core-landing #root main>.vlt-hero-bleed .vlt-hero-copy>p{font-size:16px!important;line-height:1.4!important;margin:10px 0!important;text-shadow:none!important}
}

/* Les photos avec un picture gardent la même emprise que les img directs. */
@media(min-width:1024px){html.vlt-route-core-landing #root main>.vlt-hero-bleed>div.absolute.inset-0>picture{display:block!important;width:100%!important;height:100%!important}}
@media(max-width:1023px){html.vlt-route-core-landing #root main>.vlt-hero-bleed>div.absolute.inset-0>picture{display:block!important;width:100%!important;height:auto!important}}
/* Les gabarits à deux colonnes utilisent la grille publique, sans réduire la photo. */
@media(min-width:1024px){
 html:not(.vlt-route-core-landing) :is(#root main,main#main-content) .vlt-hero-bleed>div.relative.z-10:has(.vlt-article-hero-media,.vlt-ab-hero-media){max-width:1280px!important;margin-inline:auto!important;padding-inline:32px!important;align-items:center!important;gap:24px!important}
}
/* La grille de sections ne doit pas aligner les heros tout en haut sur PC. */
@media(min-width:1024px){
 html :is(#root main,main#main-content) .vlt-hero-bleed>div.relative.z-10.vlt-layout-split{align-items:center!important;gap:24px!important}
}

/* Tablette : photo entière et six engagements répartis sur deux lignes. */
@media(min-width:768px) and (max-width:1023px){
 html.vlt-route-core-landing #root main>.vlt-hero-bleed .vlt-hero-copy>h1{font-size:clamp(34px,4.7vw,42px)!important}
 html.vlt-route-core-landing #root main>.vlt-hero-bleed .vlt-hero-copy>p{font-size:18px!important}
 html.vlt-hero-trust-embedded :is(#root,#main-content) :is(#vlt-hero-trust,#vlt-hero-trust-extra) ul{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important;overflow:visible!important}
 html.vlt-hero-trust-embedded :is(#root,#main-content) :is(#vlt-hero-trust,#vlt-hero-trust-extra) li{padding:0!important;min-width:0!important}
 html.vlt-hero-trust-embedded :is(#root,#main-content) :is(#vlt-hero-trust,#vlt-hero-trust-extra) li span{font-size:12px!important;white-space:normal!important}
 #vlt-page-trust ul{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

/* Bandeau commun : même position et présentation que l'accueil.
 * Dans le flux, au pied du hero, sans superposer les photos ni les boutons. */
html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero > :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust){
 display:block!important;position:relative!important;inset:auto!important;order:2!important;
 flex:0 0 auto!important;width:100vw!important;max-width:none!important;margin:0!important;margin-top:auto!important;
 margin-inline:calc((100% - 100vw)/2)!important;
 padding:10px max(16px,calc((100vw - 1216px)/2))!important;z-index:5;
 border-top:1px solid rgb(255 255 255 / 15%)!important;background:rgb(0 20 35 / 78%)!important;
 color:#fff!important;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust) ul{
 display:flex!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:space-between!important;
 gap:0!important;padding:0!important;margin:0!important;list-style:none!important;overflow:visible!important;
}
/* Ordinateur : chaque libellé porte une coupure explicite (retour à la ligne dans le texte, affiché par pre-line) ;
 * les six éléments grandissent tous d'autant, contenu centré : chaque séparateur est à égale distance de ses deux
 * voisins (relecture passe 4, lot 03 : 22 à 97 px de vide inégal avant les séparateurs). */
html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust) li{
 display:flex!important;align-items:center!important;justify-content:center!important;flex:1 1 auto!important;gap:10px!important;min-width:0!important;
 padding:0 1.1rem!important;margin:0!important;border:0!important;
}
html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust) li:first-child{padding-left:0!important}
html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust) li:last-child{padding-right:0!important}
html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust) li+li{border-left:1px solid rgb(255 255 255 / 15%)!important}
html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust) li span{
 color:#fff!important;font:600 12.8px/16px Inter,Arial,sans-serif!important;white-space:pre-line!important;
}
html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust) svg{flex:none!important;width:20px!important;height:20px!important;color:#2dc7eb!important}
/* Hero autonome (section sans .vlt-hero-bleed) : le bandeau ferme le premier écran. La hauteur au-dessus
 * du hero est connue par gabarit — header 76 px, plus le fil d'Ariane de 45 px sur les solutions pro —
 * et fixée ici, plus mesurée en JS : l'image d'attente a ainsi la hauteur finale (mesurée 1366×900,
 * 1024×768, 390×844). */
html .vlt-standalone-trust-hero{--vlt-trust-offset:76px;min-height:calc(100svh - var(--vlt-trust-offset));display:flex;flex-direction:column;align-items:stretch}
html.vlt-route-business-solution .vlt-standalone-trust-hero{--vlt-trust-offset:121px}
html .vlt-standalone-trust-hero>div.relative{flex:1 0 auto;width:100%;align-content:center;padding-block:24px!important}
html.vlt-trust-at-hero-foot .vlt-hero-bleed div:has(>.demo-pill),html.vlt-trust-at-hero-foot .vlt-hero-bleed .mt-16:has(svg.lucide-award){display:none!important}
.ev-hero.vlt-shared-trust-hero{flex-direction:column}
.ev-hero.vlt-shared-trust-hero>.ev-container{flex:1 0 auto}
@media(max-width:1023px){
 html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust) ul{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important}
 html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust) li{justify-content:flex-start!important;padding:0!important;border:0!important;gap:7px!important;min-height:28px!important}
 html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust) li span{font-size:12px!important;line-height:1.2!important;white-space:normal!important}
}
@media(max-width:767px){
 html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust) ul{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px 12px!important}
 html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust) svg{width:17px!important;height:17px!important}
 /* Le fondu de bord du rail défilant historique (ux-fixes.css, mask-image sur #vlt-hero-trust ul)
  * estompait les 40 derniers px de la colonne de droite : sans objet sur cette grille. */
 html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust) ul{-webkit-mask-image:none!important;mask-image:none!important;scroll-snap-type:none!important}
}

html.vlt-route-contact :is(#root main,main#main-content) .vlt-contact-split-hero.vlt-hero-has-trust{padding-bottom:0!important}

html.vlt-route-contact :is(#root main,main#main-content) .vlt-contact-split-hero.vlt-hero-has-trust > :is(#vlt-hero-trust,#vlt-hero-trust-extra){margin:0 calc((100% - 100vw)/2)!important;align-self:end!important}

/* Une source picture est une métadonnée : elle ne doit pas créer une rangée de grille. */
html.vlt-route-contact .vlt-contact-split-hero picture>source{display:none!important}
html.vlt-route-business-solution main>section.vlt-standalone-trust-hero>div.relative{padding-top:24px!important;padding-bottom:24px!important}
html.vlt-route-business-solution .vlt-standalone-trust-hero .mt-16:has(svg.lucide-award){display:none!important}

@media(max-width:1023px){html :is(#root,#main-content,#contenu) .vlt-shared-trust-hero :is(#vlt-hero-trust,#vlt-hero-trust-extra,.ev-hero-trust) li+li{border-left:0!important}}
/* overlay.css — ce que les corrections faisaient en retirant ou déplaçant des nœuds React,
 * exprimé en CSS. Retirer ou déplacer un nœud que React possède casse sa réconciliation au
 * re-rendu suivant (bascule de langue, ouverture du menu) ; masquer ou ordonner en CSS est
 * invisible pour React et s'applique dès le premier rendu. */

/* Masquage générique : posé par les corrections à la place d'un retrait du DOM. */
[data-vlt-hidden] { display: none !important; }

/* Header desktop — parcours « Solutions · Ressources · Devenir partenaire · Pourquoi Volticom ».
 * Le bouton « Solutions » est inséré devant les liens plats, jamais à leur place ; les liens
 * plats sont masqués tant que le bouton existe. L'ordre visuel est déjà donné par ux-fixes.css
 * (`order: 2` sur « Devenir partenaire », `order: 3` sur le volet « À propos ») : le JS ne
 * déplace plus rien. */
header nav[aria-label="Navigation principale"]:has(> [data-vlt-audience-trigger]) > a[href^="/particuliers"],
header nav[aria-label="Navigation principale"]:has(> [data-vlt-audience-trigger]) > a[href^="/professionnels"],
header nav[aria-label="Main navigation"]:has(> [data-vlt-audience-trigger]) > a[href^="/en/individuals"],
header nav[aria-label="Main navigation"]:has(> [data-vlt-audience-trigger]) > a[href^="/en/business"] {
  display: none !important;
}
/* corrections.css — corrections présentationnelles autrefois appliquées par JavaScript après
 * affichage (ux-fixes.js du thème, section-layout.js de l'extension), exprimées en CSS : elles
 * s'appliquent dès le premier rendu et survivent aux re-rendus React. Chaque bloc nomme la
 * fonction d'origine. Les règles « miroir » recopient des déclarations de section-layout.css
 * dont la classe n'est plus posée par le JS ; la forme `:is(.classe, :where(structure))` garde
 * la spécificité d'origine pour ne pas changer l'ordre de cascade (les originaux, désormais
 * sans effet, sont à retirer de section-layout.css lors du nettoyage de la Phase 5). */

/* ── ex-`removeWithdrawnBookletPromotions` (ux-fixes.js #42) ────────────────────────────────
 * Guide « aides et subventions 2026 » retiré (410 côté serveur, functions.php) : ses liens et
 * boutons sont masqués (display:none = hors flux, hors arbre d'accessibilité, hors tabulation,
 * ce que faisaient hidden + aria-hidden + tabindex=-1). Le JS testait aussi le libellé textuel
 * « aides et subventions 2026 pour votre borne » : aucun contenu ne le porte (chunks, 483
 * pré-rendus, données de l'extension) ; seul l'attribut aria-label est couvert ici. */
a[href*="guide-aides-subventions-2026"],
button[href*="guide-aides-subventions-2026"],
a[aria-label*="aides et subventions 2026 pour votre borne" i],
button[aria-label*="aides et subventions 2026 pour votre borne" i] {
  display: none !important;
}

/* ── ex-`sharpenAndFrameHeroImages` (ux-fixes.js #64) ───────────────────────────────────────
 * Le JS écrivait des styles inline `!important` sur le hero de la page (un seul hero, une
 * seule image de hero et un seul calque `.absolute.inset-0` direct : 483 pré-rendus vérifiés) :
 * calques dégradés masqués, photo nette, `object-fit: cover`, cadrage par route et par
 * largeur. Un style inline `!important` prime toute feuille de style ; en CSS, une déclaration
 * `!important` placée dans une couche de cascade prime toute déclaration `!important` hors
 * couche (css-cascade-5, ordre inversé des couches pour l'important) : la couche reproduit donc
 * la priorité qu'avait l'inline face aux règles `!important` de responsive.css, hero-sizing.css,
 * all-hero-public.css et ux-fixes.css — et reste, comme avant, dominée par l'inline
 * `object-fit: contain` d'improvements.js (positionHeroBadges) hors pages landing.
 * La branche AVIF → JPG de l'accueil était morte (aucune source AVIF pour cette image). */
@layer vlt-inline {
  main .vlt-hero-bleed > div.absolute.inset-0:not(div.absolute.inset-0 ~ *) > div {
    display: none !important;
    opacity: 0 !important;
    background: none !important;
    pointer-events: none !important;
  }

  main .vlt-hero-bleed img {
    filter: none !important;
    -webkit-filter: none !important;
    opacity: 1 !important;
    object-fit: cover !important;
  }

  html.vlt-route-home main .vlt-hero-bleed img { object-position: 50% 60% !important; }
  html.vlt-route-individuals main .vlt-hero-bleed img { object-position: 38% 50% !important; }
  html.vlt-route-business main .vlt-hero-bleed img { object-position: 22% 50% !important; }
  html.vlt-route-contact main .vlt-hero-bleed img { object-position: 50% 50% !important; }

  @media (max-width: 767px) {
    html.vlt-route-home main .vlt-hero-bleed img { object-position: 50% 70% !important; }
    html.vlt-route-individuals main .vlt-hero-bleed img { object-position: 32% 58% !important; }
    html.vlt-route-business main .vlt-hero-bleed img { object-position: 18% 55% !important; }
    html.vlt-route-contact main .vlt-hero-bleed img { object-position: 42% 50% !important; }
  }
}

/* ── ex-`organiseSections`, S3 (section-layout.js, ex-l. 17-18) ─────────────────────────────
 * Sections de contenu = `py-16|20|24` (éventuellement préfixé sm:/md:/lg:) hors prose/article,
 * sans h1 ; sections de logos = photo « Tesla » ou #vlt-partners-trust, mêmes exclusions.
 * Règles miroir de section-layout.css l. 3-10 et 37-49, dans le même ordre (une section à la
 * fois « contenu » et « logos » prend le padding « logos », comme avant).
 * #vlt-partners-trust : sur les pages statiques (data-pw-static) le thème l'insère après la
 * passe unique de l'extension, il n'a donc jamais reçu aucune de ces classes ; cet état est
 * reproduit tel quel (exclusion `html[data-pw-static] #vlt-partners-trust`). À trancher : le
 * rendu compact est sans doute celui voulu — il suffira de retirer cette exclusion. */
main section:is(.vlt-content-section, :where(
  :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
    [class~="py-16"], [class~="py-20"], [class~="py-24"],
    [class~="sm:py-16"], [class~="sm:py-20"], [class~="sm:py-24"],
    [class~="md:py-16"], [class~="md:py-20"], [class~="md:py-24"],
    [class~="lg:py-16"], [class~="lg:py-20"], [class~="lg:py-24"]))) {
  padding-block: var(--vlt-section-space) !important;
  scroll-margin-top: 100px;
}
main section:is(.vlt-content-section, :where(
  :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
    [class~="py-16"], [class~="py-20"], [class~="py-24"],
    [class~="sm:py-16"], [class~="sm:py-20"], [class~="sm:py-24"],
    [class~="md:py-16"], [class~="md:py-20"], [class~="md:py-24"],
    [class~="lg:py-16"], [class~="lg:py-20"], [class~="lg:py-24"]))) :is(.mb-16, .mb-14, .mb-12) {
  margin-bottom: var(--vlt-section-gap) !important;
}
main section:is(.vlt-content-section, :where(
  :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
    [class~="py-16"], [class~="py-20"], [class~="py-24"],
    [class~="sm:py-16"], [class~="sm:py-20"], [class~="sm:py-24"],
    [class~="md:py-16"], [class~="md:py-20"], [class~="md:py-24"],
    [class~="lg:py-16"], [class~="lg:py-20"], [class~="lg:py-24"]))) :is(h2, h3) {
  text-wrap: balance;
}
main section:is(.vlt-content-section, :where(
  :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
    [class~="py-16"], [class~="py-20"], [class~="py-24"],
    [class~="sm:py-16"], [class~="sm:py-20"], [class~="sm:py-24"],
    [class~="md:py-16"], [class~="md:py-20"], [class~="md:py-24"],
    [class~="lg:py-16"], [class~="lg:py-20"], [class~="lg:py-24"]))) h2 + p {
  /* 60ch ≈ 78 caractères par ligne en Inter (70ch en donnaient 91 et élargissaient les max-w-2xl/3xl
     du gabarit) — relecture du 23/09. */
  max-width: 60ch;
  line-height: 1.65;
}
/* Sous un titre centré, le paragraphe mesuré reste centré (sans mx-auto dans le gabarit, il partait de la gauche). */
main section:is(.vlt-content-section, :where(
  :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
    [class~="py-16"], [class~="py-20"], [class~="py-24"],
    [class~="sm:py-16"], [class~="sm:py-20"], [class~="sm:py-24"],
    [class~="md:py-16"], [class~="md:py-20"], [class~="md:py-24"],
    [class~="lg:py-16"], [class~="lg:py-20"], [class~="lg:py-24"]))) :is(.text-center > h2, h2.text-center) + p {
  margin-inline: auto;
}
main section:is(.vlt-compact-logos, :where(
  :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
    :has(img[alt="Tesla"]), #vlt-partners-trust))) {
  padding-block: 32px !important;
}
main section:is(.vlt-compact-logos, :where(
  :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
    :has(img[alt="Tesla"]), #vlt-partners-trust))) :is(.mb-16, .mb-14, .mb-12) {
  margin-bottom: 24px !important;
}
main section:is(.vlt-compact-logos, :where(
  :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
    :has(img[alt="Tesla"]), #vlt-partners-trust))) h2 {
  font-size: clamp(24px, 2.3vw, 32px) !important;
  line-height: 1.25 !important;
}
main section:is(.vlt-compact-logos, :where(
  :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
    :has(img[alt="Tesla"]), #vlt-partners-trust))) p {
  font-size: 16px !important;
}

@media (max-width: 639px) {
  main section:is(.vlt-content-section, :where(
    :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
      [class~="py-16"], [class~="py-20"], [class~="py-24"],
      [class~="sm:py-16"], [class~="sm:py-20"], [class~="sm:py-24"],
      [class~="md:py-16"], [class~="md:py-20"], [class~="md:py-24"],
      [class~="lg:py-16"], [class~="lg:py-20"], [class~="lg:py-24"]))) h2:not(.text-lg):not(.text-xl):not(.text-base):not(.text-sm) {
    /* titres de section ; les titres d'encart marqués petits (text-lg : « Bon à savoir ») gardent leur taille — passe 4 */
    font-size: 28px !important;
    line-height: 1.2 !important;
  }
  main section:is(.vlt-content-section, :where(
    :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
      [class~="py-16"], [class~="py-20"], [class~="py-24"],
      [class~="sm:py-16"], [class~="sm:py-20"], [class~="sm:py-24"],
      [class~="md:py-16"], [class~="md:py-20"], [class~="md:py-24"],
      [class~="lg:py-16"], [class~="lg:py-20"], [class~="lg:py-24"]))) h3 {
    font-size: 20px;
    line-height: 1.3;
  }
  main section:is(.vlt-content-section, :where(
    :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
      [class~="py-16"], [class~="py-20"], [class~="py-24"],
      [class~="sm:py-16"], [class~="sm:py-20"], [class~="sm:py-24"],
      [class~="md:py-16"], [class~="md:py-20"], [class~="md:py-24"],
      [class~="lg:py-16"], [class~="lg:py-20"], [class~="lg:py-24"]))) :is(.gap-10, .gap-12, .gap-16) {
    gap: 24px !important;
  }
  main section:is(.vlt-content-section, :where(
    :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
      [class~="py-16"], [class~="py-20"], [class~="py-24"],
      [class~="sm:py-16"], [class~="sm:py-20"], [class~="sm:py-24"],
      [class~="md:py-16"], [class~="md:py-20"], [class~="md:py-24"],
      [class~="lg:py-16"], [class~="lg:py-20"], [class~="lg:py-24"]))) :is(.p-8, .p-10) {
    padding: 24px !important;
  }
  main section:is(.vlt-content-section, :where(
    :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
      [class~="py-16"], [class~="py-20"], [class~="py-24"],
      [class~="sm:py-16"], [class~="sm:py-20"], [class~="sm:py-24"],
      [class~="md:py-16"], [class~="md:py-20"], [class~="md:py-24"],
      [class~="lg:py-16"], [class~="lg:py-20"], [class~="lg:py-24"]))) .vlt-feature-icon-card {
    align-items: flex-start !important;
    text-align: left !important;
    min-height: 0 !important;
  }
  main section:is(.vlt-content-section, :where(
    :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
      [class~="py-16"], [class~="py-20"], [class~="py-24"],
      [class~="sm:py-16"], [class~="sm:py-20"], [class~="sm:py-24"],
      [class~="md:py-16"], [class~="md:py-20"], [class~="md:py-24"],
      [class~="lg:py-16"], [class~="lg:py-20"], [class~="lg:py-24"]))) .vlt-feature-icon-tile {
    margin-bottom: 16px !important;
  }
  main section:is(.vlt-content-section, :where(
    :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
      [class~="py-16"], [class~="py-20"], [class~="py-24"],
      [class~="sm:py-16"], [class~="sm:py-20"], [class~="sm:py-24"],
      [class~="md:py-16"], [class~="md:py-20"], [class~="md:py-24"],
      [class~="lg:py-16"], [class~="lg:py-20"], [class~="lg:py-24"]))) :is(.vlt-feature-reveal, .vlt-feature-icon-card) {
    opacity: 1 !important;
    transform: none !important;
  }
  main section:is(.vlt-compact-logos, :where(
    :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
      :has(img[alt="Tesla"]), #vlt-partners-trust))) {
    padding-block: 28px !important;
  }
  main section:is(.vlt-compact-logos, :where(
    :not(:is(.vlt-prose, article, .prose), :is(.vlt-prose, article, .prose) *, html[data-pw-static] #vlt-partners-trust):not(:has(h1)):is(
      :has(img[alt="Tesla"]), #vlt-partners-trust))) h2 {
    font-size: 24px !important;
  }
}

/* Heros sans photo (dégradé seul) et pages de suivi : la hauteur suit le contenu, le bandeau des six engagements
 * reste au pied du hero. Forcés à 100svh, ils laissaient 300 à 570 px de vide sous le texte et renvoyaient le seul
 * contenu utile (formulaire de suivi, « Lien invalide ou expiré ») sous la ligne de flottaison (relecture du 23/09). */
html.vlt-hero-trust-embedded :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust:not(:has(img, picture)),
html.vlt-route-tracking :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust,
html.vlt-route-legal.vlt-hero-trust-embedded :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust {
  min-height: 0 !important;
}
/* Ramenés à leur contenu, ces heros collaient leur bouton au bandeau (0 px sur /en/articles/, 18 px sur /outils/,
 * passe 4) : respiration fixe sous le contenu, avant le bandeau. En haut, le contenu démarrait 12 px (téléphone) à
 * 17 px (ordinateur) sous l'en-tête flottant : pastille ou fil d'Ariane collés à sa barre (/suivi-intervention/, /avis/,
 * /outils/, /en/articles/ — passe 5). */
html.vlt-hero-trust-embedded :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust:not(:has(img, picture)) > div:not(#vlt-hero-trust):not(#vlt-hero-trust-extra):not(.absolute) {
  padding-top: clamp(28px, 4svh, 40px) !important;
  padding-bottom: clamp(40px, 7svh, 64px) !important;
}

/* Téléphone : la hauteur du hero suit son contenu. Forcée à 100svh, elle laissait 120 à 290 px de fond vide sous le texte
 * (/carrieres/, simulateurs de temps et de coût, /en/contact/ — passe 4) ; les heros dont le contenu remplit l'écran
 * (accueil, particuliers, professionnels) ne changent pas. */
@media (max-width: 767px) {
  html.vlt-hero-trust-embedded :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust,
  html.vlt-trust-at-hero-foot:not(.vlt-route-core-landing) :is(#root main,main#main-content) .vlt-hero-bleed.vlt-hero-has-trust:has(>div.absolute.inset-0 img) {
    min-height: 0 !important; /* photo empilée au-dessus du texte sous 1024 px (hero-sizing.css) : aucune superposition */
  }
}

/* Heros à photo sans voile (accueil, particuliers, professionnels, FR et EN — décision d'Anna) : le bouton secondaire
 * translucide se perdait sur les zones claires de la photo (« Choisir ma borne » sur la Tesla blanche, passe 4). Le bouton
 * reçoit un fond marine opaque ; la photo n'est pas voilée. */
html.vlt-route-core-landing :is(#root main,main#main-content) .vlt-hero-bleed .vlt-hero-actions > a:is([class*="bg-white/10"],[class*="border-white/30"]) {
  background-color: rgba(0, 31, 51, .86) !important;
}
html.vlt-route-core-landing :is(#root main,main#main-content) .vlt-hero-bleed .vlt-hero-actions > a:is([class*="bg-white/10"],[class*="border-white/30"]):hover {
  background-color: #001f33 !important;
}

/* ── Passe 5 (relecture du 23/09 au soir) ─────────────────────────────────────────────────────────────────────────
 * Typographie : titres équilibrés — plus de dernier mot seul (« Schneider EVlink Pro / AC », « Legrand Green’Up / Home ») ;
 * sur ordinateur, paragraphes sans mot orphelin (« zone. », « stakes. », « book. »). Amélioration progressive. Pas de
 * « pretty » sur téléphone : il creusait un trou de ligne dans les colonnes étroites (carte équipe de /avis-clients/). */
:is(#root main, main#main-content) :is(h1, h2, h3) { text-wrap: balance; }
@media (min-width: 768px) {
  :is(#root main, main#main-content) p { text-wrap: pretty; }
}
/* Cartes à icône centrées (accueil, /particuliers/, /en/individuals/…) : la pastille gardait « self-start » et restait
 * calée à gauche au-dessus d'un titre et d'un texte centrés (majeur). Sous 640 px, carte et pastille sont à gauche. */
@media (min-width: 640px) {
  /* !important : la règle commune des pastilles (ux-fixes.css, sélecteur « div.relative.mb-6…:has(> svg) », plus
   * spécifique) les cale à gauche ; aucune autre règle n'impose align-self avec !important. */
  main .vlt-feature-icon-card.items-center > .vlt-feature-icon-tile.self-start { align-self: center !important; }
}
/* Carrousels (« Tout savoir avant d'installer… », « Préparez votre politique de recharge ») : sur téléphone, les flèches
 * restaient à droite du titre et le serraient dans 240 px (4 lignes) — elles passent sous l'introduction. */
@media (max-width: 639px) {
  main [aria-roledescription="carousel"] > div.flex.justify-between:first-child { flex-wrap: wrap; row-gap: 16px; }
  main [aria-roledescription="carousel"] > div.flex.justify-between:first-child > div:first-child { flex: 1 1 100%; }
}
/* /particuliers/ : la note sous le tableau « prise renforcée ou borne » courait sur toute la largeur (≈ 180 caractères). */
main section div.max-w-7xl > p.mt-5.text-sm.text-gray-600.leading-relaxed { max-width: 62ch; }
/* Cartes de contact des articles (ContactCTA). Insérée dans le corps (variante « Un doute sur votre projet ? »), la carte
 * héritait des styles du texte : titre à 67 px de son sur-titre (marge de .vlt-prose h2), liste indentée, 35 px entre les
 * garanties. Elle reprend le rythme de la carte de fin d'article. */
.vlt-prose > section:is([aria-label="Contacter Volticom"], [aria-label="Contact Volticom"]) h2 { margin-top: 1rem; font-size: 1.5rem; }
.vlt-prose > section:is([aria-label="Contacter Volticom"], [aria-label="Contact Volticom"]) p { margin-top: .75rem; }
.vlt-prose > section:is([aria-label="Contacter Volticom"], [aria-label="Contact Volticom"]) ul { margin-top: 0; padding-left: 0; }
.vlt-prose > section:is([aria-label="Contacter Volticom"], [aria-label="Contact Volticom"]) li + li { margin-top: 0; }
@media (min-width: 640px) {
  .vlt-prose > section:is([aria-label="Contacter Volticom"], [aria-label="Contact Volticom"]) h2 { font-size: 1.875rem; }
}
/* Garanties en colonne dans toutes les cartes : sur ordinateur elles se répartissaient en 1 + 2 sur deux lignes. Libellé du
 * bouton en deux lignes équilibrées sur téléphone (« Poser ma question / à un expert », et non « … à un / expert »). */
section:is([aria-label="Contacter Volticom"], [aria-label="Contact Volticom"]) ul { flex-direction: column; flex-wrap: nowrap; row-gap: .5rem; }
section:is([aria-label="Contacter Volticom"], [aria-label="Contact Volticom"]) a { text-wrap: balance; }
/* Sur-titre long (« Une infrastructure dimensionnée au juste coût ») : sur deux lignes sur téléphone, la pilule se
 * déformait ; coins arrondis et lignes équilibrées. */
@media (max-width: 639px) {
  section:is([aria-label="Contacter Volticom"], [aria-label="Contact Volticom"]) .relative.z-10 > span:first-child { border-radius: .75rem; text-wrap: balance; }
}
/* En-tête « Découvrez d'autres modèles électriques » : le lien « Tous les modèles », haut de 44 px (cible tactile), était
 * calé sur le bas du titre et son texte flottait au-dessus de la ligne de base du titre. */
main div.flex.items-end.justify-between:has(> h2 + a[href$="/articles/"]) { align-items: baseline; }

/* Carrousel « À chaque parking sa solution » (accueil, particuliers, professionnels, accueil EN) : à partir de 1 024 px, ses
   quatre cartes occupent chacune un quart de la largeur et tiennent toutes à l'écran ; ses flèches ne faisaient rien
   (audit du 25/09/2026). Masquées seulement quand la piste compte exactement quatre cartes de ce format. */
@media (min-width:1024px){
  div:has(> .flex-shrink-0 > button[aria-label="Précédent"], > .flex-shrink-0 > button[aria-label="Previous"]):has(+ .overflow-x-auto > .lg\:min-w-\[calc\(25\%-18px\)\]:nth-child(4):last-child) > .flex-shrink-0:has(> button[aria-label]){display:none}
}

/* ── Contraste des textes (audit du 25/09/2026 : 784 pages mesurées au pixel, ordinateur et téléphone) ──────────────
   Seuils WCAG : 4,5:1 pour le texte courant, 3:1 pour le grand texte. */
/* Titres de rubrique du menu mobile (« À propos de Volticom »…) : #99a1af sur blanc faisait 2,60:1. */
#mobile-nav p.text-gray-400{color:#5f6877}
/* Textes indicatifs des champs : 3,15:1 (moitié de la couleur du texte), 2,60:1 sur le formulaire de contact. */
input::placeholder,textarea::placeholder{color:#5f6877;opacity:1}
.placeholder\:text-gray-400::placeholder{color:#5f6877}
/* Pastille « FAQ » : #0b6fb8 sur son fond bleu pâle faisait 4,35:1. */
.bg-\[\#0b6fb8\]\/10>span.text-\[\#0b6fb8\]{color:#0a63a5}
/* « Call us », « Email us » des cartes de contact sur bleu nuit : blanc à 60 % (3,9:1) → 82 %. */
a[href^="tel:"] .text-white\/60,a[href^="mailto:"] .text-white\/60{color:rgb(255 255 255 / 82%)}
/* Mot « Business » en dégradé : l'arrêt violet foncé (#7c5cff) passait sous 3:1 sur le bleu nuit. */
.bg-clip-text.via-\[\#7c5cff\]{background-image:linear-gradient(to right,#a78bff,#9d86ff,#2dc7eb)}
/* Mentions sur dégradé (« QUALIFELEC IRVE · AXA… », « Assurance décennale AXA ») : bleu très pâle plein au lieu de 80 %. */
#main-content p.text-sm.text-blue-100\/80,aside p.text-\[11px\].text-blue-100\/80{color:#dbeafe}
nav span.text-blue-100\/60{color:rgb(219 234 254 / 80%)}
/* Héros sur photo (accueil, particuliers, professionnels, en anglais aussi) : le sur-titre cyan passe en cyan clair, et
   un voile sombre doux, limité au bloc de texte, garde titres et paragraphes lisibles sur les zones claires de la photo
   (voiture blanche, mur) sans assombrir le reste de l'image. */
.vlt-hero-bleed .vlt-hero-copy span.text-sm.text-secondary{color:#9ee5f7}
@media (min-width:1024px){
  .vlt-hero-bleed .vlt-hero-copy{position:relative;isolation:isolate}
  .vlt-hero-bleed .vlt-hero-copy::before{content:"";position:absolute;inset:-48px -160px -48px -72px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 82% 78% at 48% 55%,rgba(0,20,34,.7),rgba(0,20,34,.5) 60%,rgba(0,20,34,0) 100%)}
  .vlt-hero-bleed .vlt-hero-copy p.vlt-hero-subtitle.text-blue-100\/90{color:#eef5ff}
}

/* Direction artistique PC — 26/09/2026.
 * La composition PC démarre à 1200 px avec pointeur précis, ou au-delà de 1366 px.
 * Les nouvelles scènes sont décoratives, sans texte intégré ni recadrage.
 */
@media (min-width: 1200px) and (pointer: fine), (min-width: 1367px) {
  html:lang(fr).vlt-route-core-landing.vlt-route-home {
    --vlt-desktop-hero: url('/wp-content/plugins/volticom-site-improvements/desktop-heros/hero-pc-accueil-1672w.webp');
  }
  html:lang(fr).vlt-route-core-landing.vlt-route-individuals {
    --vlt-desktop-hero: url('/wp-content/plugins/volticom-site-improvements/desktop-heros/hero-pc-particuliers-1672w.webp');
  }
  html:lang(fr).vlt-route-core-landing.vlt-route-business {
    --vlt-desktop-hero: url('/wp-content/plugins/volticom-site-improvements/desktop-heros/hero-pc-professionnels-1672w.webp');
  }
  html:lang(fr).vlt-route-core-landing:is(.vlt-route-home,.vlt-route-individuals,.vlt-route-business) #root main > .vlt-hero-bleed > div.absolute.inset-0 {
    background-image: var(--vlt-desktop-hero);
    background-color: #061e30;
    background-size: contain;
    background-position: right center;
    background-repeat: no-repeat;
  }
  html:lang(fr).vlt-route-core-landing:is(.vlt-route-home,.vlt-route-individuals,.vlt-route-business) #root main > .vlt-hero-bleed > div.absolute.inset-0 > :is(img,picture,div) {
    display: none !important;
  }
  html:lang(fr).vlt-route-core-landing:is(.vlt-route-home,.vlt-route-individuals,.vlt-route-business) #root main > .vlt-hero-bleed .vlt-hero-copy {
    width: min(600px, calc(50vw - 40px)) !important;
    max-width: 600px !important;
  }
  html:lang(fr).vlt-route-core-landing:is(.vlt-route-home,.vlt-route-individuals,.vlt-route-business) #root main > .vlt-hero-bleed .vlt-hero-copy::before {
    content: none;
  }
  html:lang(fr).vlt-route-core-landing:is(.vlt-route-home,.vlt-route-individuals,.vlt-route-business) #root main > .vlt-hero-bleed .vlt-hero-actions {
    max-width: 100% !important;
  }
}
@media (min-width: 1200px) and (max-width: 1279px) and (pointer: fine) {
  html:lang(fr).vlt-route-core-landing.vlt-route-home {
    --vlt-desktop-hero: url('/wp-content/plugins/volticom-site-improvements/desktop-heros/hero-pc-accueil-1280w.webp');
  }
  html:lang(fr).vlt-route-core-landing.vlt-route-individuals {
    --vlt-desktop-hero: url('/wp-content/plugins/volticom-site-improvements/desktop-heros/hero-pc-particuliers-1280w.webp');
  }
  html:lang(fr).vlt-route-core-landing.vlt-route-business {
    --vlt-desktop-hero: url('/wp-content/plugins/volticom-site-improvements/desktop-heros/hero-pc-professionnels-1280w.webp');
  }
}
/* Mobile : la photo rejoint le haut de l'écran sous le menu flottant.
 * Le menu reste au-dessus ; la photo conserve ses proportions et son fichier.
 * Les fiches produit gardent leur fond clair et leur visuel détouré entier. */
@media (max-width: 1023px) {
  html:root.vlt-trust-at-hero-foot:not(.vlt-route-product-detail) :is(#root, #main-content) .vlt-hero-bleed.vlt-shared-trust-hero.vlt-hero-has-trust:has(img) {
    padding-top: 0 !important;
    padding-inline: 0 !important;
    margin-top: -76px !important;
  }

  html:root.vlt-trust-at-hero-foot :is(#root, #main-content) .vlt-hero-bleed > div.absolute.inset-0:has(img),
  html:root.vlt-trust-at-hero-foot :is(#root, #main-content) .vlt-contact-split-hero > picture {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    border-radius: 0 !important;
  }

  html:root.vlt-trust-at-hero-foot :is(#root, #main-content) .vlt-hero-bleed > div.absolute.inset-0 img,
  html:root.vlt-trust-at-hero-foot :is(#root, #main-content) .vlt-contact-split-hero > picture > img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    border-radius: 0 !important;
  }

  html:root.vlt-trust-at-hero-foot :is(#root, #main-content) .vlt-hero-bleed > div.relative.z-10.vlt-layout-split:has(img):not(:is(#vlt-hero-trust, #vlt-hero-trust-extra)) {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: none !important;
    padding: 0 20px 12px !important;
  }

  html:root.vlt-trust-at-hero-foot :is(#root, #main-content) .vlt-hero-bleed > div.relative.z-10.vlt-layout-split > div.relative:has(img) {
    order: -1 !important;
    width: calc(100% + 40px) !important;
    max-width: none !important;
    margin: 0 -20px !important;
    padding: 0 !important;
  }

  html:root.vlt-trust-at-hero-foot :is(#root, #main-content) .vlt-hero-bleed > div.relative.z-10.vlt-layout-split > div.relative:has(img) :is(div, picture, img) {
    border-radius: 0 !important;
    box-shadow: none !important;
  }
}

/* Les pages Flotte et Supervision ont un fil d'Ariane avant leur hero. */
@media (max-width: 1023px) {
  html:root.vlt-route-business-solution #main-content:has(> .vlt-standalone-trust-hero img) {
    position: relative;
    margin-top: -76px !important;
  }
  html:root.vlt-route-business-solution #main-content:has(> .vlt-standalone-trust-hero img) > nav {
    position: absolute;
    z-index: 2;
    top: 88px;
    left: 16px;
    right: 16px;
    width: fit-content;
    max-width: calc(100% - 32px);
    border: 0;
    border-radius: 12px;
    background: rgba(255, 255, 255, .92);
  }
  html:root.vlt-route-business-solution #main-content .vlt-standalone-trust-hero:has(img) > .vlt-layout-split {
    width: 100% !important;
    max-width: none !important;
    padding: 0 0 24px !important;
    gap: 24px !important;
  }
  html:root.vlt-route-business-solution #main-content .vlt-standalone-trust-hero:has(img) > .vlt-layout-split > div:first-child {
    padding-inline: 20px;
  }
  html:root.vlt-route-business-solution #main-content .vlt-standalone-trust-hero > .vlt-layout-split > div:has(img) {
    order: -1 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }
  html:root.vlt-route-business-solution #main-content .vlt-standalone-trust-hero > .vlt-layout-split > div:has(img) :is(div, picture, img) {
    border-radius: 0 !important;
    box-shadow: none !important;
    aspect-ratio: auto !important;
  }
  html:root.vlt-route-business-solution #main-content .vlt-standalone-trust-hero img {
    display: block;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
  }
}

/* 27/09 — dégager la photo du menu et garder les deux actions côte à côte.
 * Le rembourrage appartient à l'image : ses proportions naturelles restent intactes.
 * Il récupère 64 px auparavant cachés derrière le menu, sans rogner les véhicules.
 */
@media (max-width: 1023px) {
  html:root:not(.vlt-route-product-detail) main .vlt-hero-bleed img,
  html:root.vlt-route-business-solution main .vlt-standalone-trust-hero img[fetchpriority="high"] {
    padding-top: 64px !important;
    box-sizing: content-box !important;
    background-color: #001d30;
  }
}
@media (max-width: 767px) {
  html:root :is(#root main, main#main-content) :is(.vlt-hero-bleed, .vlt-standalone-trust-hero) :is(.vlt-hero-actions, .vlt-supporting-hero-actions, .vlt-equal-actions) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    width: 100% !important;
    gap: 8px !important;
  }
  html:root :is(#root main, main#main-content) :is(.vlt-hero-bleed, .vlt-standalone-trust-hero) :is(.vlt-hero-actions, .vlt-supporting-hero-actions, .vlt-equal-actions):has(> a:only-child) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  html:root :is(#root main, main#main-content) :is(.vlt-hero-bleed, .vlt-standalone-trust-hero) :is(.vlt-hero-actions, .vlt-supporting-hero-actions, .vlt-equal-actions) > a {
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 56px !important;
    box-sizing: border-box !important;
    padding: 10px 8px !important;
    gap: 6px !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    text-align: center !important;
    justify-content: center !important;
  }
  html:root :is(#root main, main#main-content) :is(.vlt-hero-bleed, .vlt-standalone-trust-hero) :is(.vlt-hero-actions, .vlt-supporting-hero-actions, .vlt-equal-actions) > a > svg {
    width: 16px !important;
    height: 16px !important;
    flex: 0 0 16px !important;
    margin: 0 !important;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed .vlt-hero-copy > h1 {
    font-size: clamp(24px, 7.2vw, 30px) !important;
    line-height: 1.12 !important;
  }
}

/* Téléphone : les actions ferment le premier écran ; engagements après défilement.
 * Une cellule invisible réserve la hauteur disponible sans calcul JavaScript.
 * Les textes, photos et nœuds React sont conservés. */
@media (max-width: 767px) {
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 1fr auto auto auto auto auto auto !important;
    gap: 0 !important;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed::before {
    content: "";
    grid-column: 1;
    grid-row: 1 / 6;
    min-height: 100svh;
    pointer-events: none;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed > div.absolute.inset-0:has(img) {
    grid-column: 1 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    background: #00101b;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed > div.absolute.inset-0:has(img) img {
    background: transparent !important;
    mask-image: linear-gradient(to bottom, transparent 64px, #000 100px);
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed > div.relative.z-10,
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed .vlt-hero-copy {
    display: contents !important;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed .vlt-hero-copy > :is(div, h1, p) {
    grid-column: 1 !important;
    margin-inline: 20px !important;
    max-width: calc(100% - 40px) !important;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed .vlt-hero-copy.vlt-hero-copy > div:first-child {
    grid-row: 2 !important;
    margin: 12px 20px 8px !important;
    width: fit-content !important;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed .vlt-hero-copy > h1 {
    grid-row: 3 !important;
    margin-block: 0 10px !important;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed .vlt-hero-copy > p {
    grid-row: 4 !important;
    margin-block: 0 12px !important;
    align-self: start !important;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed .vlt-hero-copy > .vlt-hero-actions {
    grid-row: 5 !important;
    width: calc(100% - 40px) !important;
    margin-block: 0 16px !important;
    align-self: end !important;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed .vlt-hero-actions ~ p {
    grid-row: 6 !important;
    margin-block: 16px !important;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed > :is(#vlt-hero-trust, #vlt-hero-trust-extra) {
    grid-column: 1 !important;
    grid-row: 7 !important;
  }
}
/* Sur les écrans courts, le texte explicatif reste accessible après les actions. */
@media (max-width: 767px) and (max-height: 700px) {
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed {
    grid-template-rows: 1fr auto auto auto auto auto auto !important;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed::before {
    grid-row: 1 / 5;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed .vlt-hero-copy > .vlt-hero-actions {
    grid-row: 4 !important;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed .vlt-hero-copy > p {
    grid-row: 5 !important;
    margin-block: 12px !important;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed .vlt-hero-actions ~ p {
    grid-row: 6 !important;
  }
}

/* Une typographie plus lisible équilibre les écrans hauts sans rogner la photo. */
@media (max-width: 767px) and (min-height: 701px) {
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed .vlt-hero-copy > h1 {
    font-size: clamp(30px, 4.6svh, 40px) !important;
  }
  html:root.vlt-route-core-landing :is(#root main, main#main-content) > .vlt-hero-bleed .vlt-hero-copy > p {
    font-size: 18px !important;
    line-height: 1.4 !important;
  }
}

/* Très petits téléphones : conserver le numéro international entier dans son CTA. */
@media (max-width: 359px) {
  html:root :is(#root main, main#main-content) :is(.vlt-hero-actions, .vlt-supporting-hero-actions, .vlt-equal-actions) > a[href^="tel:"] {
    padding-inline: 6px !important;
    gap: 0 !important;
  }
  html:root :is(#root main, main#main-content) :is(.vlt-hero-actions, .vlt-supporting-hero-actions, .vlt-equal-actions) > a[href^="tel:"] > svg {
    display: none !important;
  }
}

/* 27/09 — même composition sur téléphone et tablette : photo, texte, actions.
 * Les tablettes tactiles conservent ce gabarit en paysage jusqu'à 1366 px.
 * Les écrans courts défilent naturellement ; aucune image ni phrase n'est coupée. */
@media (min-width: 768px) and (max-width: 1199px), (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 1fr auto auto auto auto auto auto !important;
    gap: 0 !important;
    padding: 0 !important;
    margin-top: -76px !important;
    min-height: 0 !important;
    height: auto !important;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed::before {
    content: none;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed > div.absolute.inset-0:has(img) {
    position: relative !important;
    inset: auto !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: auto !important;
    margin: 0 !important;
    background: #00101b !important;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed > div.absolute.inset-0 > picture,
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed > div.absolute.inset-0 img {
    display: block !important;
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed > div.absolute.inset-0 img {
    padding-top: 64px !important;
    box-sizing: content-box !important;
    background: transparent !important;
    mask-image: linear-gradient(to bottom, transparent 64px, #000 100px);
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed > div.absolute.inset-0 > div {
    display: none !important;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed > div.relative.z-10,
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed .vlt-hero-copy {
    display: contents !important;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed .vlt-hero-copy > :is(div, h1, p) {
    grid-column: 1 !important;
    margin-inline: 24px !important;
    max-width: calc(100% - 48px) !important;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed .vlt-hero-copy.vlt-hero-copy > div:first-child {
    grid-row: 2 !important;
    position: static !important;
    width: fit-content !important;
    margin: 16px 24px 12px !important;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed .vlt-hero-copy > h1 {
    grid-row: 3 !important;
    font-size: clamp(34px, 4.7vw, 48px) !important;
    line-height: 1.12 !important;
    margin-block: 0 14px !important;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed .vlt-hero-copy > p {
    grid-row: 4 !important;
    font-size: 18px !important;
    line-height: 1.4 !important;
    text-shadow: none !important;
    align-self: start !important;
    margin-block: 0 18px !important;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed .vlt-hero-copy > .vlt-hero-actions {
    grid-row: 5 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    align-self: end !important;
    gap: 12px !important;
    width: calc(100% - 48px) !important;
    max-width: 880px !important;
    margin-block: 0 20px !important;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed .vlt-hero-actions > a {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 52px !important;
    padding: 12px 16px !important;
    box-sizing: border-box !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    justify-content: center !important;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed .vlt-hero-actions ~ p {
    grid-row: 6 !important;
    margin-block: 16px !important;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed > :is(#vlt-hero-trust, #vlt-hero-trust-extra) {
    grid-column: 1 !important;
    grid-row: 7 !important;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed :is(#vlt-hero-trust, #vlt-hero-trust-extra) ul {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
    mask-image: none !important;
  }
  html:root.vlt-route-core-landing #root main > .vlt-hero-bleed :is(#vlt-hero-trust, #vlt-hero-trust-extra) li {
    justify-content: flex-start !important;
    padding: 0 !important;
    border: 0 !important;
    min-width: 0 !important;
  }
  html:root.vlt-route-core-landing #root header nav[class~="lg:flex"],
  html:root.vlt-route-core-landing #root header .ml-auto[class~="lg:flex"] {
    display: none !important;
  }
  html:root.vlt-route-core-landing #root header .ml-auto[class~="lg:hidden"] {
    display: flex !important;
  }
  html:root.vlt-route-core-landing #root header div[class~="lg:hidden"]:not(.hidden):not(.ml-auto) {
    display: block !important;
  }
}
/* Exemple fictif sur la photo de l'accueil, sous le logo du menu flottant. */
#root #vlt-rating-demo.vlt-rating-on-hero {
  position: absolute;
  z-index: 12;
  top: 86px;
  left: 36px;
  max-width: calc(100% - 40px);
  padding: 0;
  margin: 0;
  color: #fff;
  text-align: left;
  text-shadow: 0 1px 3px #001421, 0 0 12px #001421;
  scroll-margin-top: 100px;
}
#vlt-rating-demo .vlt-rating-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 14px;
  line-height: 1.4;
}
#vlt-rating-demo .vlt-rating-line strong {font-size: 17px; font-weight: 700;}
#vlt-rating-demo .vlt-rating-fiction-label {
  margin: 3px 0 0;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
}
@media(max-width:1023px) {
  #root #vlt-rating-demo.vlt-rating-on-hero {top: 84px; left: 24px;}
}