/* composants.css - GÉNÉRÉ depuis index.html par _composants_accueil.py : ne pas éditer.
   Retoucher l'accueil puis relancer : python3 _composants_accueil.py */
/* 1. Fondamentaux (jetons de l'accueil ; spécificité nulle : une page peut les redéfinir) */
:where(:root){--c-bg:#F4F6F5;--c-bg2:#FFFFFF;--c-bg3:var(--c-menthe);--c-border:rgba(0,0,0,0.07);--c-border2:rgba(0,0,0,0.13);--c-ink:#000000;--c-muted:#5C6560;--c-mid:#454B48;--c-text:#1A1D1B;--topbar-h:40px;--c-vert:#00C27E;--c-vert-lt:#00F5A0;--c-vert-bg:rgba(0,194,126,.08);--c-vert-br:rgba(0,194,126,.22);--c-jaune:#00C27E;--c-jaune-lt:#00F5A0;--c-jaune-bg:rgba(0,194,126,.08);--c-jaune-br:rgba(0,194,126,.22);--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-7:28px;--sp-8:32px;--sp-10:40px;--sp-12:48px;--sp-16:64px;--sp-20:80px;--r-sm:8px;--r-md:12px;--r-lg:18px;--r-xl:24px;--r-full:999px;--ff-h:'Schibsted Grotesk',sans-serif;--ff-b:'Manrope',sans-serif;--ease-out:cubic-bezier(0.16,1,0.3,1);--ease-spring:cubic-bezier(0.34,1.56,0.64,1);--shadow-card:0 1px 3px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.06);--shadow-hover:0 8px 32px rgba(0,0,0,.10),0 2px 8px rgba(0,0,0,.06)}
:where(:root){--c-band:#000000;--c-menthe:#E6FFF5;--c-vert-txt:#007A50;--t-titre-ls:-0.04em;--t-titre-lh:1.05;--t-h2:clamp(32px,4.5vw,56px);--t-h2-poids:800;--t-h2-compact:clamp(30px,3.3vw,46px);--t-surtitre:11px;--t-surtitre-ls:.12em;--t-chapeau:17px;--t-chapeau-lh:1.8;--t-corps:16px;--t-corps-lh:1.6;--s-large:1140px;--s-esp:110px;--s-r-bloc:36px;--s-r-carte:24px;--s-r-petit:18px;--s-lueur:0 8px 26px rgba(0,245,160,.30);--s-lueur-survol:0 12px 34px rgba(0,245,160,.45);--s-halo:0 0 0 4px rgba(0,245,160,.12),0 18px 44px rgba(0,194,126,.14)}
@media (max-width:900px){:where(:root){--s-esp:72px}}
:where(html[data-theme="dark"]){--c-bg:#0B0F0D;--c-bg2:#151B18;--c-bg3:#0F1512;--c-ink:#EAF0EC;--c-text:#E3E9E5;--c-mid:#AEB6B1;--c-muted:#8A928D;--c-border:rgba(255,255,255,.10);--c-border2:rgba(255,255,255,.16);--c-vert:#00E58F;--c-vert-lt:#00F5A0;--c-vert-bg:rgba(0,242,160,.12);--c-vert-br:rgba(0,242,160,.30);--c-jaune:#00E58F;--c-jaune-lt:#00F5A0;--c-band:#1B231F;--c-menthe:#10201A;--c-vert-txt:#3DEBAE}
:where(:root){--c-vert-titre:#009E66;--c-focus:#007A50}\n:where(html[data-theme="dark"]){--c-vert-titre:var(--c-vert);--c-focus:#00F5A0}
/* 2. Socle : composants communs de l'accueil (et alias des anciennes classes) */
.btn-primary,.btn-vert,.btn-submit,.nf-btn.primary,.prose .ctamid.ctasim a,.ctafin a.bg{font-family:var(--ff-h);font-size:15px;font-weight:600;background:var(--c-vert-lt);color:#0a0a09;padding:14px 28px;border-radius:var(--r-full);border:none;cursor:pointer;letter-spacing:-0.02em;display:inline-flex;align-items:center;gap:8px;transition:background .2s,transform .18s var(--ease-spring),box-shadow .2s}
.btn-primary:hover,.btn-vert:hover,.btn-submit:hover,.nf-btn.primary:hover,.prose .ctamid.ctasim a:hover,.ctafin a.bg:hover{background:var(--c-vert);transform:translateY(-2px);box-shadow:0 10px 28px rgba(0,194,126,.32)}
.btn-primary svg,.btn-vert svg,.btn-submit svg,.nf-btn.primary svg,.prose .ctamid.ctasim a svg,.ctafin a.bg svg{width:15px;height:15px;transition:transform .2s}
.btn-primary:hover svg,.btn-vert:hover svg,.btn-submit:hover svg,.nf-btn.primary:hover svg,.prose .ctamid.ctasim a:hover svg,.ctafin a.bg:hover svg{transform:translateX(3px)}
.btn-ghost,.hs-btn-ghost,.nf-btn.ghost{font-family:var(--ff-h);font-size:15px;font-weight:500;background:transparent;color:var(--c-text);padding:14px 28px;border-radius:var(--r-full);border:1px solid var(--c-border2);cursor:pointer;letter-spacing:-0.02em;transition:all .2s}
.btn-ghost:hover,.hs-btn-ghost:hover,.nf-btn.ghost:hover{border-color:rgba(0,0,0,.28);background:rgba(0,0,0,.04)}
.proof-strip{display:flex;align-items:center;gap:20px;flex-wrap:wrap;animation:ca-fadeUp .7s .3s var(--ease-out) both}
.proof-item{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--c-muted)}
.section-tag{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--c-vert-txt);margin-bottom:20px}
.section-tag::before{content:'';display:inline-block;width:12px;height:12px;background:var(--c-vert);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.27 2L19.27 2Q22.17 2 20.12 4.05L13.42 10.76Q12.08 12.09 13.97 12.09L19.08 12.09Q21.86 12.09 19.9 14.06L13.91 20.04Q11.95 22 11.95 19.22L11.95 13.45Q11.95 12.19 10.69 12.19L4.73 12.19Q1.83 12.19 3.88 10.14L11.84 2.18Q12.02 2 12.27 2Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.27 2L19.27 2Q22.17 2 20.12 4.05L13.42 10.76Q12.08 12.09 13.97 12.09L19.08 12.09Q21.86 12.09 19.9 14.06L13.91 20.04Q11.95 22 11.95 19.22L11.95 13.45Q11.95 12.19 10.69 12.19L4.73 12.19Q1.83 12.19 3.88 10.14L11.84 2.18Q12.02 2 12.27 2Z'/%3E%3C/svg%3E") center/contain no-repeat}
.section-h2{font-size:clamp(32px,4.5vw,56px);font-weight:800;margin-bottom:16px;max-width:680px}
.section-lead{font-size:17px;font-weight:300;color:var(--c-mid);line-height:1.8;max-width:520px}
.sim-card{background:var(--c-bg2);border:1px solid var(--c-border);border-radius:var(--r-xl);overflow:hidden;margin-top:64px;box-shadow:var(--shadow-card)}
.ff{display:flex;flex-direction:column;gap:6px;min-width:0;text-align:left}
.ff label,.copro-form label,.form-card label{font-size:13px;font-weight:600;color:var(--c-mid)}
.ff .form-in{width:100%;box-sizing:border-box}
.ff-star{font-weight:700}
.ff-oblig{grid-column:1/-1;margin:0;font-size:12.5px;color:var(--c-mid)}
select.form-in,div.copro-form select{padding-left:11px}
select.form-in:disabled{opacity:.6;cursor:not-allowed}
.ff .form-in[aria-invalid="true"]{border-color:#C0392B;box-shadow:0 0 0 3px rgba(192,57,43,.12)}
.ff-err,.copro-form .ferr{font-size:12.5px;line-height:1.4;color:#C0392B;min-height:0}
.ff-err:empty,.copro-form .ferr:empty{display:none}
html[data-theme="dark"] .ff-err,html[data-theme="dark"] .copro-form .ferr,html[data-theme="dark"] .ff-fail,html[data-theme="dark"] .copro-fail,html[data-theme="dark"] .err-msg{color:#FF8A80}
.ff-fail,.copro-fail,.err-msg{margin:12px 0 0;padding:10px 14px;border-radius:10px;background:rgba(192,57,43,.08);color:#C0392B;font-size:13.5px;line-height:1.5;text-align:left}
.ff-consent{display:grid;grid-template-columns:auto 1fr;gap:8px;margin:12px 2px 0;font-size:12.5px;line-height:1.55;color:var(--c-mid);text-align:left}
.ff-consent svg{margin-top:3px;color:var(--c-vert-txt,#007A50)}
.ff-consent p{margin:0}
.form-in,.copro-form input:not(.hp),.copro-form select,.copro-form textarea{background:var(--c-bg2);border:1px solid var(--c-border2);border-radius:var(--r-sm);padding:12px 15px;font-size:14px;font-family:var(--ff-b);color:var(--c-text);outline:none;transition:border-color .2s,box-shadow .2s}
.form-in::placeholder,.copro-form input:not(.hp)::placeholder,.copro-form select::placeholder,.copro-form textarea::placeholder{color:rgba(0,0,0,.28)}
.form-in:focus,.copro-form input:not(.hp):focus,.copro-form select:focus,.copro-form textarea:focus{border-color:rgba(0,194,126,.5);box-shadow:0 0 0 3px rgba(0,194,126,.1)}
.ff-rassure{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px 20px;margin:2px 0 0;padding:0;list-style:none;font-size:13.5px;font-weight:500;color:var(--c-text)}
.ff-rassure li{display:inline-flex;align-items:center;gap:8px}
.ff-rassure li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c-vert);box-shadow:0 0 0 4px rgba(0,194,126,.14);flex:none}
.faq-grid{margin-top:48px;display:flex;flex-direction:column;gap:12px}
.faq-item,.faq-city details,.pt-faq details{background:var(--c-bg2);border:1px solid var(--c-border);border-radius:var(--r-lg);overflow:hidden;transition:border-color .2s}
.faq-item:has(.faq-a.open){border-color:var(--c-vert-br)}
.faq-q,.faq-city summary,.pt-faq summary{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;background:none;border:none;cursor:pointer;text-align:left;font-family:var(--ff-h);font-size:16px;font-weight:700;color:var(--c-ink);letter-spacing:-0.025em;transition:color .18s}
.faq-q:hover,.faq-city summary:hover,.pt-faq summary:hover{color:var(--c-vert)}
.faq-arrow{flex-shrink:0;transition:transform .25s var(--ease-out);color:var(--c-muted)}
.faq-q.active .faq-arrow{transform:rotate(180deg);color:var(--c-vert)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s var(--ease-out)}
.faq-a.open{max-height:300px}
.faq-a p{padding:0 24px 20px;font-size:15px;color:var(--c-mid);line-height:1.8;font-weight:300}
.faq-a strong{color:var(--c-ink);font-weight:600}
@media(max-width:1024px){
.proof-strip{justify-content:center}
.proof-strip{justify-content:center}
}
@media(max-width:640px){
.btn-primary,.btn-vert,.btn-submit,.nf-btn.primary,.prose .ctamid.ctasim a,.ctafin a.bg,.btn-ghost,.hs-btn-ghost,.nf-btn.ghost{width:100%;justify-content:center}
}
html[data-theme="dark"] .btn-vert,html[data-theme="dark"] .btn-submit,html[data-theme="dark"] .nf-btn.primary,html[data-theme="dark"] .prose .ctamid.ctasim a,html[data-theme="dark"] .ctafin a.bg{background:var(--c-vert-lt)!important;color:#05231a!important}
html:is(.touches,.sys) .faq-item,html:is(.touches,.sys) .faq-city details,html:is(.touches,.sys) .pt-faq details{border-width:1px!important;border-radius:24px!important}
html:is(.touches,.sys) .btn-primary,html:is(.touches,.sys) .btn-vert,html:is(.touches,.sys) .btn-submit,html:is(.touches,.sys) .nf-btn.primary,html:is(.touches,.sys) .prose .ctamid.ctasim a,html:is(.touches,.sys) .ctafin a.bg{box-shadow:0 8px 26px rgba(0,245,160,.30)}
html:is(.touches,.sys) .btn-primary:hover,html:is(.touches,.sys) .btn-vert:hover,html:is(.touches,.sys) .btn-submit:hover,html:is(.touches,.sys) .nf-btn.primary:hover,html:is(.touches,.sys) .prose .ctamid.ctasim a:hover,html:is(.touches,.sys) .ctafin a.bg:hover{box-shadow:0 12px 34px rgba(0,245,160,.45)!important}
html:is(.touches,.sys) .sim-card{border:1px solid var(--c-vert)!important;border-radius:28px!important;box-shadow:0 0 0 4px rgba(0,245,160,.13),0 26px 70px rgba(0,194,126,.18)!important}
html.sys .sim-card{border-radius:var(--s-r-bloc)!important}
html.sys .faq-item,html.sys .faq-city details,html.sys .pt-faq details{border-radius:var(--s-r-petit)!important}
html.sys .faq-item,html.sys .faq-city details,html.sys .pt-faq details{background:var(--c-bg2)!important;border:1px solid var(--c-border2)!important;box-shadow:none!important}
html.sys .faq-item:hover,html.sys .faq-city details:hover,html.sys .pt-faq details:hover{border-color:var(--c-vert)!important}
@media (max-width:900px){
html.sys .sim-card{border-radius:26px!important}
}
html.sys .btn-primary,html.sys .btn-vert,html.sys .btn-submit,html.sys .nf-btn.primary,html.sys .prose .ctamid.ctasim a,html.sys .ctafin a.bg{box-shadow:0 8px 26px rgba(0,245,160,.30)}
html.sys .btn-primary:hover,html.sys .btn-vert:hover,html.sys .btn-submit:hover,html.sys .nf-btn.primary:hover,html.sys .prose .ctamid.ctasim a:hover,html.sys .ctafin a.bg:hover{box-shadow:0 12px 34px rgba(0,245,160,.45)!important}
html.sys .btn-primary,html.sys .btn-vert,html.sys .btn-submit,html.sys .nf-btn.primary,html.sys .prose .ctamid.ctasim a,html.sys .ctafin a.bg{font-weight:600}
.sim-card{border-radius:24px!important;box-shadow:0 18px 50px rgba(0,0,0,.09)!important}
.faq-item,.faq-city details,.pt-faq details{border-radius:16px!important}
@keyframes ca-fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
/* 2 bis. Accessibilité (audit du 29/10/2026) : contrastes AA, focus clavier, évitement, cibles, formulaires */
/* Vert en thème clair : petits textes en --c-vert-txt (#007A50, 5,4:1 sur blanc), grands titres en --c-vert-titre
   (#009E66, 3,2:1) ; #00F5A0 reste aux fonds sombres et aux boutons pleins */
html:not([data-theme="dark"]) .ac-vert,html:not([data-theme="dark"]) .hs-hero h1 em{color:var(--c-vert-titre)}
html:not([data-theme="dark"]) #histoire .story-kicker,html:not([data-theme="dark"]) .story-kicker,html:not([data-theme="dark"]) .sim-badge,html:not([data-theme="dark"]) .res-badge,html:not([data-theme="dark"]) .blog-cta,html:not([data-theme="dark"]) .sim-restart,html:not([data-theme="dark"]) .res-list h5,html:not([data-theme="dark"]) .success :is(h3,h4),html:not([data-theme="dark"]) .m-val.v,html:not([data-theme="dark"]) .bc-tag,html:not([data-theme="dark"]) .bc-more,html:not([data-theme="dark"]) .city-badge,html:not([data-theme="dark"]) .ff-consent a,html:not([data-theme="dark"]) .recap-mention a,html.pg-legal:not([data-theme="dark"]) .prose a,html.pg-404:not([data-theme="dark"]) .prose a{color:var(--c-vert-txt)}
html:not([data-theme="dark"]) .hs-box-dark a:not(.btn-primary),html:not([data-theme="dark"]) .hs-band a:not(.btn-primary){color:#00F5A0}
/* Focus clavier : un contour net partout (menu compris), jamais seulement un fond */
html:is(.sys) :focus-visible:not(.q-label):not(main){outline:2px solid var(--c-focus)!important;outline-offset:2px!important}
html:is(.sys) :is(footer,.topbar,.hs-band,.hs-box-dark,.process-wrap,.promesse-wrap,.partner-card,.hs-cta,.ctafin,.ctasim,#cookieBanner) :focus-visible{outline-color:#00F5A0!important}
html:is(.sys) .form-in:focus-visible,html:is(.sys) .copro-form :is(input,select,textarea):focus-visible{outline-offset:1px!important}
/* Lien d'évitement : masqué jusqu'au focus */
.evitement{position:fixed;left:16px;top:-80px;z-index:1000;padding:12px 20px;border-radius:999px;background:var(--c-vert-lt);color:#0a0a09;font-family:var(--ff-h);font-weight:700;font-size:15px;text-decoration:none;box-shadow:0 8px 26px rgba(0,0,0,.25)}
.evitement:focus{top:12px}
main#contenu{display:block;width:100%;flex:1 0 auto}
main#contenu:focus{outline:none}
/* Cibles tactiles d'au moins 24 px, sans changer l'aspect */
.topbar .tb-link{padding-block:8px}
.topbar .tb-close{width:32px;height:32px;right:8px}
.breadcrumb a,.hero .meta a,.prose p>a[href^="/qui-sommes-nous"]{display:inline-block;padding-block:4px;margin-block:-4px}
/* Pastille cookies : retirée une fois le choix fait (le lien « Gérer les cookies » du pied de page suffit) */
.cookie-fab,.cookie-fab.show,#cookieFab{display:none!important}
/* Formulaires : champs jamais plus larges que leur carte ; texte indicatif lisible en sombre ; libellé visible */
.form-in,.copro-form :is(input,select,textarea){max-width:100%;box-sizing:border-box}
.form-row>*,.recap-form>*{min-width:0}
.btn-sub{max-width:100%;box-sizing:border-box}
@media (max-width:640px){.btn-sub{white-space:normal;padding-left:18px;padding-right:18px}}
html[data-theme="dark"] .form-in::placeholder,html[data-theme="dark"] .copro-form :is(input,textarea)::placeholder{color:rgba(255,255,255,.5)}
.copro-form .ff-oblig{margin:4px 0 10px}
.recap-form label.sr-only{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto;clip-path:none;white-space:normal;grid-column:1/-1;font-size:13px;font-weight:600;color:var(--c-mid)}
/* 2 ter. Parcours (audit du 29/10/2026, lot 1) */
/* Champs à 16 px sur mobile et tablette tactile : l'iPhone ne zoome plus à la saisie */
@media (max-width:900px),(pointer:coarse){html input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),html select,html textarea{font-size:16px!important}}
/* Bandeau installateur sur mobile : il défile avec la page (le menu remonte d'autant), préfixe court et lisible */
.topbar .tb-court{display:none}
@media (max-width:640px){
  html .topbar{position:absolute!important}
  html body:not(.tb-off) nav{margin-top:calc(-1 * var(--tb-dec,0px))}
  html .topbar .tb-txt strong{display:inline!important}
  .topbar .tb-long{display:none}
  .topbar .tb-court{display:inline}
}
/* Menu mobile : accès au simulateur en bas du panneau (le bouton de l'en-tête est masqué sous 600 px) */
.nav-links>li.nav-cta-mob{display:none}
@media (max-width:600px){
  nav.open .nav-links>li.nav-cta-mob{display:block;margin-top:8px}
  nav.open .nav-links>li.nav-cta-mob>a{display:flex!important;align-items:center;justify-content:center;min-height:50px;padding:0 20px!important;border-radius:999px!important;background:#00F5A0!important;color:#0a0a09!important;font-family:var(--ff-h);font-weight:700!important;font-size:15px!important;letter-spacing:-.01em}
  nav.open .nav-links>li.nav-cta-mob>a:hover{filter:brightness(.95)}
}
/* Surtitre du haut de page sur deux lignes (mobile) : l'éclair suit le texte au lieu de rester seul à gauche */
@media (max-width:640px){
  html.sys :is(.hs-hero .hs-badge,.simp-hero .simp-badge,.hero-in>.badge){display:block!important;text-align:center}
  html.sys :is(.hs-hero .hs-badge,.simp-hero .simp-badge,.hero-in>.badge)::before{vertical-align:-1px;margin-right:8px}
}
/* Simulateur sur mobile : réponses en lignes compactes (pictogramme à gauche) pour voir la question et ses réponses d'un coup d'oeil */
@media (max-width:640px){
  html .sim-body .sim-opts{grid-template-columns:1fr!important;gap:7px!important}
  html .sim-body .sim-opt{display:grid;grid-template-columns:28px minmax(0,1fr);column-gap:12px;align-items:center;padding:8px 14px}
  html .sim-body .sim-opt .opt-emoji{grid-row:1 / span 2;margin:0}
  html .sim-body .sim-opt .opt-emoji svg{width:26px;height:26px}
  html .sim-body .sim-opt .opt-title,html .sim-body .sim-opt .opt-desc{grid-column:2}
  html .sim-body .sim-opt .opt-desc{line-height:1.4}
}
/* 3. Composants complets de l'accueil (pages <html class="ds-accueil">) */
:where(html.ds-accueil) .hero{min-height:100svh;display:flex;align-items:center;justify-content:center;padding-top:calc(var(--topbar-h) + 88px);position:relative;overflow:hidden;background:var(--c-bg);width:100%;box-sizing:border-box}
:where(html.ds-accueil) .hero-grain{position:absolute;inset:0;pointer-events:none;opacity:.35;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E")}
:where(html.ds-accueil) .hero-circle1{position:absolute;width:700px;height:700px;border-radius:50%;background:radial-gradient(circle,rgba(0,194,126,.07) 0%,transparent 64%);top:-140px;left:50%;transform:translateX(-50%);pointer-events:none}
:where(html.ds-accueil) .hero-circle2{position:absolute;width:440px;height:440px;border-radius:50%;background:radial-gradient(circle,rgba(0,194,126,.05) 0%,transparent 64%);bottom:-80px;right:-80px;pointer-events:none}
:where(html.ds-accueil) .grid-lines{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(0,0,0,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.025) 1px,transparent 1px);background-size:72px 72px;mask-image:radial-gradient(ellipse 80% 55% at 50% 0%,black 0%,transparent 100%)}
:where(html.ds-accueil) .hero-layout{position:relative;z-index:2;width:100%;max-width:1140px;margin:0 auto;padding:40px 48px 80px;display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:56px;align-items:center}
:where(html.ds-accueil) .hero-text{display:flex;flex-direction:column;align-items:flex-start;gap:24px;text-align:left}
:where(html.ds-accueil) .hero-h1{font-size:clamp(32px,3.8vw,58px);font-weight:800;letter-spacing:-0.045em;line-height:1.08;color:var(--c-ink);animation:ca-fadeUp .7s .08s var(--ease-out) both}
:where(html.ds-accueil) .hero-h1 .line2{display:block;white-space:normal;line-height:1.05}
:where(html.ds-accueil) .ac-vert{color:var(--c-vert)}
:where(html.ds-accueil) .ac-black{color:var(--c-ink)}
:where(html.ds-accueil) .hero-sub{font-size:15px;font-weight:300;color:var(--c-mid);max-width:420px;line-height:1.75;animation:ca-fadeUp .7s .16s var(--ease-out) both}
:where(html.ds-accueil) .hero-actions{display:flex;gap:12px;flex-wrap:wrap;animation:ca-fadeUp .7s .22s var(--ease-out) both}
:where(html.ds-accueil) .sw{max-width:1080px;margin:0 auto;padding:80px 48px 64px}
:where(html.ds-accueil) .why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:64px}
:where(html.ds-accueil) .why-card{background:var(--c-bg2);border:1.5px solid var(--c-vert);border-radius:var(--r-xl);padding:32px 28px;position:relative;overflow:hidden;box-shadow:var(--shadow-card);transition:transform .28s var(--ease-out),box-shadow .28s}
:where(html.ds-accueil) .why-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-hover)}
:where(html.ds-accueil) .why-num{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--c-muted);margin-bottom:32px}
:where(html.ds-accueil) .why-icon{width:48px;height:48px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;margin-bottom:20px}
:where(html.ds-accueil) .why-icon svg{width:24px;height:24px}
:where(html.ds-accueil) .why-card h4{font-family:var(--ff-h);font-size:18px;font-weight:700;letter-spacing:-0.035em;margin-bottom:12px}
:where(html.ds-accueil) .why-card p{font-size:14px;color:var(--c-muted);line-height:1.75;font-weight:300}
:where(html.ds-accueil) .process-wrap{border-top:1px solid var(--c-border);background:var(--c-bg)}
:where(html.ds-accueil) .process-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--c-border);border-radius:var(--r-xl);overflow:hidden;margin-top:64px;background:var(--c-bg2);box-shadow:var(--shadow-card)}
:where(html.ds-accueil) .p-step{padding:32px 24px;border-right:1px solid var(--c-border);transition:background .2s}
:where(html.ds-accueil) .p-step:last-child{border-right:none}
:where(html.ds-accueil) .p-step:hover{background:rgba(0,0,0,.02)}
:where(html.ds-accueil) .p-num{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;margin-bottom:32px}
:where(html.ds-accueil) .p-num.nv{color:var(--c-vert)}
:where(html.ds-accueil) .p-num.nj{color:var(--c-jaune)}
:where(html.ds-accueil) .p-num.nm{color:var(--c-muted)}
:where(html.ds-accueil) .p-icon{width:40px;height:40px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;margin-bottom:20px}
:where(html.ds-accueil) .p-icon svg{width:20px;height:20px}
:where(html.ds-accueil) .p-step :is(h3,h4){font-family:var(--ff-h);font-size:15px;font-weight:700;letter-spacing:-0.03em;margin-bottom:8px}
:where(html.ds-accueil) .p-step p{font-size:13px;color:var(--c-muted);line-height:1.6;font-weight:300}
:where(html.ds-accueil) .blog-wrap{border-top:1px solid var(--c-border)}
:where(html.ds-accueil) .blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px}
:where(html.ds-accueil) .blog-card{background:var(--c-bg2);border:1px solid var(--c-border);border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-card);transition:transform .25s var(--ease-out),box-shadow .25s;text-decoration:none;display:flex;flex-direction:column}
:where(html.ds-accueil) .blog-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover)}
:where(html.ds-accueil) .blog-thumb{height:160px;display:flex;align-items:center;justify-content:center;font-size:48px;position:relative;overflow:hidden}
:where(html.ds-accueil) .blog-tag{position:absolute;top:14px;left:14px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:3px 10px;border-radius:var(--r-full);background:rgba(0,0,0,.06);color:var(--c-mid)}
:where(html.ds-accueil) .blog-body{padding:20px;display:flex;flex-direction:column;flex:1}
:where(html.ds-accueil) .blog-date{font-size:11px;color:var(--c-muted);font-weight:400;margin-bottom:8px}
:where(html.ds-accueil) .blog-title{font-family:var(--ff-h);font-size:16px;font-weight:700;letter-spacing:-0.035em;color:var(--c-ink);line-height:1.3;margin-bottom:8px}
:where(html.ds-accueil) .blog-excerpt{font-size:13px;color:var(--c-muted);line-height:1.65;font-weight:300;flex:1;margin-bottom:16px}
:where(html.ds-accueil) .blog-cta{font-family:var(--ff-h);font-size:12px;font-weight:600;color:var(--c-vert);display:inline-flex;align-items:center;gap:5px;transition:gap .15s}
:where(html.ds-accueil) .blog-card:hover .blog-cta{gap:8px}
:where(html.ds-accueil) .blog-wrap{border-top:1px solid var(--c-border)}
:where(html.ds-accueil) .blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px}
:where(html.ds-accueil) .blog-card{background:var(--c-bg2);border:1px solid var(--c-border);border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-card);transition:transform .25s var(--ease-out),box-shadow .25s;text-decoration:none;display:flex;flex-direction:column}
:where(html.ds-accueil) .blog-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover)}
:where(html.ds-accueil) .blog-thumb{height:160px;display:flex;align-items:center;justify-content:center;font-size:48px;position:relative;overflow:hidden}
:where(html.ds-accueil) .blog-tag{position:absolute;top:14px;left:14px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:3px 10px;border-radius:var(--r-full);background:rgba(0,0,0,.06);color:var(--c-mid)}
:where(html.ds-accueil) .blog-body{padding:20px;display:flex;flex-direction:column;flex:1}
:where(html.ds-accueil) .blog-date{font-size:11px;color:var(--c-muted);font-weight:400;margin-bottom:8px}
:where(html.ds-accueil) .blog-title{font-family:var(--ff-h);font-size:16px;font-weight:700;letter-spacing:-0.035em;color:var(--c-ink);line-height:1.3;margin-bottom:8px}
:where(html.ds-accueil) .blog-excerpt{font-size:13px;color:var(--c-muted);line-height:1.65;font-weight:300;flex:1;margin-bottom:16px}
:where(html.ds-accueil) .blog-cta{font-family:var(--ff-h);font-size:12px;font-weight:600;color:var(--c-vert);display:inline-flex;align-items:center;gap:5px;transition:gap .15s}
:where(html.ds-accueil) .blog-card:hover .blog-cta{gap:8px}
:where(html.ds-accueil) .partner-wrap{border-top:1px solid var(--c-border);padding:80px 48px;background:var(--c-bg)}
:where(html.ds-accueil) .partner-inner{max-width:1080px;margin:0 auto}
:where(html.ds-accueil) .partner-card{background:var(--c-band);
  border-radius:28px;
  padding:60px;
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
  gap:40px;
  position:relative;
  overflow:hidden;}
:where(html.ds-accueil) .partner-card::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 80% at 85% 50%,rgba(0,242,160,.07) 0%,transparent 70%);pointer-events:none}
:where(html.ds-accueil) .partner-card::after{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(0,242,160,.35),transparent)}
:where(html.ds-accueil) .partner-left{flex:1;min-width:0}
:where(html.ds-accueil) .partner-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--c-jaune-lt);margin-bottom:20px}
:where(html.ds-accueil) .partner-eyebrow::before{content:'';display:inline-block;width:12px;height:12px;background:var(--c-jaune-lt);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.27 2L19.27 2Q22.17 2 20.12 4.05L13.42 10.76Q12.08 12.09 13.97 12.09L19.08 12.09Q21.86 12.09 19.9 14.06L13.91 20.04Q11.95 22 11.95 19.22L11.95 13.45Q11.95 12.19 10.69 12.19L4.73 12.19Q1.83 12.19 3.88 10.14L11.84 2.18Q12.02 2 12.27 2Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.27 2L19.27 2Q22.17 2 20.12 4.05L13.42 10.76Q12.08 12.09 13.97 12.09L19.08 12.09Q21.86 12.09 19.9 14.06L13.91 20.04Q11.95 22 11.95 19.22L11.95 13.45Q11.95 12.19 10.69 12.19L4.73 12.19Q1.83 12.19 3.88 10.14L11.84 2.18Q12.02 2 12.27 2Z'/%3E%3C/svg%3E") center/contain no-repeat}
:where(html.ds-accueil) .partner-card h2{font-size:clamp(20px,2.4vw,32px);line-height:1.15;margin-bottom:16px;color:#fff;font-weight:800}
:where(html.ds-accueil) .partner-card .partner-desc{font-size:15px;color:rgba(255,255,255,.5);font-weight:300;line-height:1.75;margin-bottom:28px;max-width:520px}
:where(html.ds-accueil) .p-feats{display:flex;gap:20px;flex-wrap:wrap}
:where(html.ds-accueil) .p-feat{display:flex;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,.45);white-space:nowrap}
:where(html.ds-accueil) .p-feat::before{content:'';display:block;width:4px;height:4px;border-radius:50%;background:var(--c-jaune-lt);flex-shrink:0}
:where(html.ds-accueil) .partner-right{flex-shrink:0;display:flex;flex-direction:column;align-items:flex-end;gap:12px;position:relative;z-index:1}
:where(html.ds-accueil) .btn-jaune{font-family:var(--ff-h);font-size:15px;font-weight:700;background:var(--c-jaune-lt);color:#0a0a09;padding:16px 32px;border-radius:var(--r-full);border:none;cursor:pointer;white-space:nowrap;letter-spacing:-0.02em;transition:all .22s;display:inline-flex;align-items:center;gap:8px}
:where(html.ds-accueil) .btn-jaune:hover{background:#00C27E;transform:translateY(-2px);box-shadow:0 12px 32px rgba(0,242,160,.28)}
:where(html.ds-accueil) .p-note{font-size:12px;color:rgba(255,255,255,.3);line-height:1.5;text-align:right;white-space:nowrap}
:where(html.ds-accueil) .faq-section{border-top:1px solid var(--c-border);background:var(--c-bg3)}
:where(html.ds-accueil) .reveal{opacity:1;transform:translateY(0);transition:opacity .6s var(--ease-out),transform .75s var(--ease-spring)}
:where(html.ds-accueil) .reveal.will-animate{opacity:0;transform:translateY(40px) scale(.97)}
@media(prefers-reduced-motion:reduce){
:where(html.ds-accueil) .reveal.will-animate{opacity:1;transform:none}
}
:where(html.ds-accueil) .reveal.visible{opacity:1;transform:translateY(0)}
:where(html.ds-accueil) .rd1{transition-delay:.08s}
:where(html.ds-accueil) .rd2{transition-delay:.16s}
:where(html.ds-accueil) .rd3{transition-delay:.24s}
@media(max-width:1024px){
:where(html.ds-accueil) .hero-layout{grid-template-columns:1fr;gap:32px;padding:32px 24px 48px}
:where(html.ds-accueil) .hero-text{align-items:center;text-align:center}
:where(html.ds-accueil) .hero-sub{max-width:100%}
:where(html.ds-accueil) .hero-text{align-items:center;text-align:center;width:100%}
:where(html.ds-accueil) .hero-sub{max-width:100%}
}
@media(max-width:900px){
:where(html.ds-accueil) .why-grid{grid-template-columns:1fr 1fr}
:where(html.ds-accueil) .process-grid{grid-template-columns:1fr 1fr}
:where(html.ds-accueil) .p-step:nth-child(2){border-right:none}
:where(html.ds-accueil) .p-step:nth-child(1),:where(html.ds-accueil) .p-step:nth-child(2){border-bottom:1px solid var(--c-border)}
:where(html.ds-accueil) .partner-card{flex-direction:column;align-items:flex-start;padding:40px}
:where(html.ds-accueil) .partner-right{align-items:flex-start;width:100%}
:where(html.ds-accueil) .btn-jaune{width:100%;justify-content:center}
:where(html.ds-accueil) .p-note{text-align:left;white-space:normal}
}
@media(max-width:900px){
:where(html.ds-accueil) .blog-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
:where(html.ds-accueil) .hero-h1{font-size:clamp(28px,8vw,38px);word-break:break-word}
:where(html.ds-accueil) .hero-h1 .line2{white-space:normal}
:where(html.ds-accueil) .hero-sub{font-size:15px;max-width:100%}
:where(html.ds-accueil) .reco-foot{white-space:normal}
:where(html.ds-accueil) .hero-text{min-width:0}
:where(html.ds-accueil) .hero-actions{flex-direction:column;width:100%}
:where(html.ds-accueil) .blog-grid{grid-template-columns:1fr}
:where(html.ds-accueil) .sw{padding:64px 20px 48px}
:where(html.ds-accueil) .hero-layout{padding:40px 16px 56px;grid-template-columns:1fr}
:where(html.ds-accueil) .partner-card{padding:32px 20px}
:where(html.ds-accueil) .why-grid,:where(html.ds-accueil) .process-grid{grid-template-columns:1fr}
:where(html.ds-accueil) .p-step{border-right:none;border-bottom:1px solid var(--c-border)}
:where(html.ds-accueil) .p-step:last-child{border-bottom:none}
:where(html.ds-accueil) .partner-card{padding:48px 24px}
:where(html.ds-accueil) .partner-wrap{padding:48px 20px}
:where(html.ds-accueil) .hero-layout{padding:40px 16px 60px;overflow:hidden;width:100%}
}
:where(html.ds-accueil) .why-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
:where(html.ds-accueil) .why-card .why-num{margin-bottom:0}
:where(html.ds-accueil) .why-card .why-icon{margin-bottom:0}
:where(html.ds-accueil) #histoire .story-intro .section-h2{margin:14px 0 18px}
:where(html.ds-accueil) #histoire .story-intro .section-lead{margin-bottom:14px}
@media(max-width:600px){
:where(html.ds-accueil) .why-grid{grid-template-columns:1fr}
}
:where(html.ds-accueil) .p-head{display:flex;align-items:center;gap:12px;margin-bottom:18px}
:where(html.ds-accueil) .p-step .p-num{margin-bottom:0}
:where(html.ds-accueil) .p-step .p-icon{margin-bottom:0}
:where(html.ds-accueil) .blog-grid .blog-thumb{height:172px;font-size:0;background:linear-gradient(150deg,#0c1a13 0%,#123326 55%,#0d251a 100%);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}
:where(html.ds-accueil) .blog-grid .blog-thumb::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 74% 24%,rgba(0,194,126,.32),transparent 60%)}
:where(html.ds-accueil) .blog-grid .blog-thumb svg{width:60px;height:60px;position:relative;z-index:1}
:where(html.ds-accueil) .blog-grid .blog-tag{z-index:2;background:rgba(255,255,255,.12);color:#c8f5e2;border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
:where(html.ds-accueil) .blog-grid a.blog-card:nth-of-type(n+4){display:none}
:where(html.ds-accueil) .reco{position:relative;background:var(--c-bg2);border:1px solid var(--c-border);border-radius:24px;box-shadow:0 30px 60px rgba(0,0,0,.12);padding:20px 22px;width:100%}
:where(html.ds-accueil) .reco::before{content:"";position:absolute;inset:0;border-radius:24px;background:radial-gradient(120% 80% at 90% 0%,rgba(0,242,160,.13),transparent 60%);pointer-events:none}
:where(html.ds-accueil) .reco-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
:where(html.ds-accueil) .reco-head .t{font-family:var(--ff-h);font-weight:800;font-size:15px;color:var(--c-ink)}
:where(html.ds-accueil) .reco-pill{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;background:var(--c-vert-bg);color:var(--c-vert-txt);padding:5px 11px;border-radius:999px}
:where(html.ds-accueil) .reco-row{display:flex;align-items:center;gap:14px;padding:10px 0;border-top:1px solid var(--c-border);text-align:left}
:where(html.ds-accueil) .reco-ico{width:42px;height:42px;border-radius:12px;background:var(--c-vert-bg);display:flex;align-items:center;justify-content:center;flex-shrink:0}
:where(html.ds-accueil) .reco-ico svg{width:22px;height:22px;color:var(--c-vert)}
:where(html.ds-accueil) .reco-row .k{font-size:12px;color:var(--c-muted)}
:where(html.ds-accueil) .reco-row .v{font-family:var(--ff-h);font-weight:700;font-size:16px;color:var(--c-ink)}
:where(html.ds-accueil) .reco-row .r{margin-left:auto;text-align:right}
:where(html.ds-accueil) .reco-foot{margin-top:16px;background:var(--c-band);color:#fff;border-radius:14px;padding:12px 14px;display:flex;align-items:center;gap:9px;font-size:11.5px;white-space:normal;letter-spacing:-.01em}
:where(html.ds-accueil) .reco-foot svg{width:15px;height:15px}
:where(html.ds-accueil) .reco-foot .g{color:var(--c-vert-lt);font-weight:700}
:where(html.ds-accueil) .reco-foot svg{color:var(--c-vert-lt);flex-shrink:0}
@media(max-width:900px){
:where(html.ds-accueil) .reco{max-width:440px;margin:0 auto}
}
:where(html.ds-accueil) .blog-grid .blog-thumb{background:#0d1a14}
:where(html.ds-accueil) .blog-grid .blog-thumb::after{display:none}
:where(html.ds-accueil) .blog-grid .blog-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
:where(html.ds-accueil) .blog-grid .blog-tag{background:rgba(255,255,255,.92);color:#0d1a14;border:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
:where(html.ds-accueil) #heroScene{display:none}
html.touches:where(.ds-accueil) #heroScene{display:block;position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;transition:transform .5s cubic-bezier(.16,1,.3,1)}
html.touches:where(.ds-accueil) .hero-voile{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,var(--c-bg) 0%,var(--c-bg) 30%,rgba(244,246,245,.72) 44%,rgba(244,246,245,0) 60%),linear-gradient(180deg,var(--c-bg) 0%,rgba(244,246,245,0) 22%)}
html[data-theme="dark"].touches:where(.ds-accueil) #heroScene{opacity:.09}
html[data-theme="dark"].touches:where(.ds-accueil) .hero-voile{display:none}
html.touches:where(.ds-accueil) .hero-reco{align-self:end;transition:transform .5s cubic-bezier(.16,1,.3,1)}
html.touches:where(.ds-accueil) .hero-reco .reco{background:rgba(255,255,255,.74);-webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3);border:1px solid rgba(255,255,255,.9);box-shadow:0 30px 70px rgba(11,15,13,.14)}
html[data-theme="dark"].touches:where(.ds-accueil) .hero-reco .reco{background:rgba(21,27,24,.78);border-color:rgba(255,255,255,.12)}
html.touches:where(.ds-accueil) .hero-reco .reco-row,html.touches:where(.ds-accueil) .hero-reco .reco-foot{animation:ca-recoIn .7s cubic-bezier(.16,1,.3,1) both}
html.touches:where(.ds-accueil) .hero-reco .reco-row:nth-of-type(2){animation-delay:1.1s}
html.touches:where(.ds-accueil) .hero-reco .reco-row:nth-of-type(3){animation-delay:1.45s}
html.touches:where(.ds-accueil) .hero-reco .reco-row:nth-of-type(4){animation-delay:1.8s}
html.touches:where(.ds-accueil) .hero-reco .reco-foot{animation-delay:2.2s}
:where(html.ds-accueil) #heroScene .obj{animation:ca-sceneMonte 1s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--i)*45ms)}
:where(html.ds-accueil) #heroScene .vitre{animation:ca-sceneAllume 1.4s ease 1.3s both}
:where(html.ds-accueil) #heroScene .halo{transform-box:fill-box;transform-origin:center;animation:ca-sceneHalo 4.5s ease-in-out 2s infinite both}
:where(html.ds-accueil) #heroScene .flux{stroke-dasharray:5 11;animation:ca-sceneFlux 1.1s linear infinite}
:where(html.ds-accueil) #heroScene .led{animation:ca-sceneLed 1.6s ease-in-out infinite}
:where(html.ds-accueil) #heroScene .passe{animation:ca-scenePasse 11s linear 2.5s infinite both}
@media (max-width:980px){
html.touches:where(.ds-accueil) .hero{padding-bottom:300px}
html.touches:where(.ds-accueil) #heroScene{top:auto;bottom:0;height:320px}
html.touches:where(.ds-accueil) .hero-voile{background:linear-gradient(180deg,var(--c-bg) 0%,rgba(244,246,245,0) 100%);top:auto;bottom:160px;height:160px}
}
@media (max-width:760px){
html.touches:where(.ds-accueil) #heroScene,html.touches:where(.ds-accueil) .hero-voile{display:none}
html.touches:where(.ds-accueil) .hero{padding-bottom:64px;min-height:0}
}
@media (prefers-reduced-motion:reduce){
:where(html.ds-accueil) #heroScene *,html.touches:where(.ds-accueil) .hero-reco *{animation:none!important}
}
html.touches:where(.ds-accueil) .hero .proof-strip{display:inline-flex;align-self:flex-start;flex-wrap:nowrap;gap:0;margin-top:30px;padding:6px;border-radius:18px;background:rgba(255,255,255,.62);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.9);box-shadow:0 10px 40px rgba(11,15,13,.06)}
html.touches:where(.ds-accueil) .hero .proof-item{padding:13px 20px;gap:9px;font-size:14.5px;font-weight:600;color:var(--c-mid);white-space:nowrap}
html.touches:where(.ds-accueil) .hero .proof-item+.proof-item{border-left:1px solid var(--c-border)}
html.touches:where(.ds-accueil) .hero .proof-dot{width:7px;height:7px;border-radius:50%;background:var(--c-vert);box-shadow:0 0 0 4px rgba(0,194,126,.16);flex:none}
html[data-theme="dark"].touches:where(.ds-accueil) .hero .proof-strip{background:rgba(21,27,24,.72);border-color:rgba(255,255,255,.12);box-shadow:none}
@media (max-width:980px){
html.touches:where(.ds-accueil) .hero .proof-strip{align-self:center}
}
@media (max-width:560px){
html.touches:where(.ds-accueil) .hero .proof-strip{flex-direction:column;align-self:stretch;width:100%}
html.touches:where(.ds-accueil) .hero .proof-item+.proof-item{border-left:0;border-top:1px solid var(--c-border)}
}
html.touches:where(.ds-accueil) .partner-card .p-feats{display:inline-flex;flex-wrap:nowrap;gap:0;padding:6px;border-radius:18px;background:rgba(255,255,255,.08);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.16)}
html.touches:where(.ds-accueil) .partner-card .p-feat{display:flex;align-items:center;gap:9px;padding:13px 20px;margin:0;background:none;border:0;border-radius:0;font-size:14.5px;font-weight:600;color:#fff;white-space:nowrap}
html.touches:where(.ds-accueil) .partner-card .p-feat::before{display:none}
html.touches:where(.ds-accueil) .partner-card .p-feat+.p-feat{border-left:1px solid rgba(255,255,255,.16)}
html.touches:where(.ds-accueil) .partner-card .proof-dot{width:7px;height:7px;border-radius:50%;background:#00F5A0;box-shadow:0 0 0 4px rgba(0,245,160,.18);flex:none}
@media (max-width:640px){
html.touches:where(.ds-accueil) .partner-card .p-feats{flex-direction:column;width:100%}
html.touches:where(.ds-accueil) .partner-card .p-feat+.p-feat{border-left:0;border-top:1px solid rgba(255,255,255,.16)}
}
:where(html.ds-accueil) .promesse-wrap{background:#141917;color:#fff;position:relative;overflow:clip}
:where(html.ds-accueil) .promesse-wrap::before{content:"";position:absolute;right:-8%;top:-30%;width:800px;height:800px;background:radial-gradient(closest-side,rgba(0,245,160,.13),rgba(0,245,160,0));pointer-events:none}
:where(html.ds-accueil) .promesse-in{position:relative;max-width:1140px;margin:0 auto;padding:110px 48px 72px;display:grid;grid-template-columns:1.3fr .7fr;gap:72px;align-items:start}
html.touches:where(.ds-accueil) .promesse-txt.lit,:where(html.ds-accueil) .promesse-txt{font-family:var(--ff-h);font-size:clamp(26px,3vw,40px)!important;line-height:1.18!important;font-weight:500!important;letter-spacing:-.03em;color:#fff!important;max-width:none!important;margin:0}
:where(html.ds-accueil) .promesse-sous{margin-top:26px;font-size:18px;line-height:1.6;color:rgba(255,255,255,.72);max-width:48ch;font-weight:300}
:where(html.ds-accueil) .promesse-coche{list-style:none;padding:0;margin:0 0 30px}
:where(html.ds-accueil) .promesse-coche li{display:flex;gap:12px;align-items:center;padding:15px 0;border-bottom:1px solid rgba(255,255,255,.10);font-family:var(--ff-h);font-weight:600;font-size:16.5px;letter-spacing:-.01em}
:where(html.ds-accueil) .promesse-coche svg{width:20px;height:20px;flex:none;color:#00F5A0}
:where(html.ds-accueil) .promesse-note{margin-top:14px;font-size:13.5px;color:rgba(255,255,255,.5)}
:where(html.ds-accueil) .tuiles{position:relative;max-width:1236px;margin:0 auto;padding:0 48px 110px;display:flex;gap:10px;height:470px;box-sizing:content-box}
:where(html.ds-accueil) .tuile{position:relative;flex:1;min-width:0;border-radius:26px;overflow:hidden;isolation:isolate;color:#fff;display:flex;align-items:flex-end;text-decoration:none;transition:flex .7s var(--ease-out)}
:where(html.ds-accueil) .tuile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;filter:blur(7px) saturate(.8);transform:scale(1.08);transition:filter .7s var(--ease-out),transform .9s var(--ease-out)}
:where(html.ds-accueil) .tuile::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(20,25,23,.05) 25%,rgba(20,25,23,.9) 100%)}
:where(html.ds-accueil) .tuile-in{padding:26px;width:100%}
:where(html.ds-accueil) .tuile h3{font-family:var(--ff-h);font-size:24px;font-weight:700;letter-spacing:-.03em;line-height:1.1;color:#fff;margin:0}
:where(html.ds-accueil) .tuile p,:where(html.ds-accueil) .tuile-lien{display:block;max-width:40ch;max-height:0;opacity:0;overflow:hidden;transition:max-height .6s var(--ease-out),opacity .4s,margin .4s}
:where(html.ds-accueil) .tuile p{font-size:15px;line-height:1.55;color:rgba(255,255,255,.84)}
:where(html.ds-accueil) .tuile-lien{font-family:var(--ff-h);font-weight:700;font-size:14.5px;color:#00F5A0}
:where(html.ds-accueil) .tuile-fl{position:absolute;top:20px;right:20px;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.16);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:grid;place-items:center}
:where(html.ds-accueil) .tuile-fl svg{width:16px;height:16px}
:where(html.ds-accueil) .tuile:hover,:where(html.ds-accueil) .tuile:focus-visible,:where(html.ds-accueil) .tuile.on{flex:3.1}
:where(html.ds-accueil) .tuile:hover img,:where(html.ds-accueil) .tuile:focus-visible img,:where(html.ds-accueil) .tuile.on img{filter:none;transform:scale(1)}
:where(html.ds-accueil) .tuile:hover p,:where(html.ds-accueil) .tuile:focus-visible p,:where(html.ds-accueil) .tuile.on p{max-height:100px;opacity:1;margin-top:8px}
:where(html.ds-accueil) .tuile:hover .tuile-lien,:where(html.ds-accueil) .tuile:focus-visible .tuile-lien,:where(html.ds-accueil) .tuile.on .tuile-lien{max-height:30px;opacity:1;margin-top:12px}
:where(html.ds-accueil) .tuiles:hover .tuile.on:not(:hover){flex:1}
:where(html.ds-accueil) .tuiles:hover .tuile.on:not(:hover) img{filter:blur(7px) saturate(.8);transform:scale(1.08)}
:where(html.ds-accueil) .tuiles:hover .tuile.on:not(:hover) p,:where(html.ds-accueil) .tuiles:hover .tuile.on:not(:hover) .tuile-lien{max-height:0;opacity:0;margin-top:0}
@media (max-width:900px){
:where(html.ds-accueil) .promesse-in{grid-template-columns:1fr;gap:36px;padding:72px 20px 48px}
:where(html.ds-accueil) .tuiles{flex-direction:column;height:auto;padding:0 20px 72px}
:where(html.ds-accueil) .tuile{flex:none!important;min-height:240px}
:where(html.ds-accueil) .tuile::after{background:linear-gradient(180deg,rgba(20,25,23,.45) 0%,rgba(20,25,23,.78) 40%,rgba(20,25,23,.96) 100%)}
:where(html.ds-accueil) .tuile p{color:#fff}
:where(html.ds-accueil) .tuile h3,:where(html.ds-accueil) .tuile p,:where(html.ds-accueil) .tuile-lien{text-shadow:0 1px 12px rgba(0,0,0,.6)}
:where(html.ds-accueil) .tuile img{filter:none!important;transform:none!important}
:where(html.ds-accueil) .tuile p{max-height:100px!important;opacity:1!important;margin-top:8px!important}
:where(html.ds-accueil) .tuile-lien{max-height:30px!important;opacity:1!important;margin-top:12px!important}
}
:where(html.ds-accueil) #pourquoi{padding:96px 24px}
:where(html.ds-accueil) #pourquoi .sw{position:relative;max-width:1236px;margin:0 auto;padding:72px 64px 56px;border-radius:36px;overflow:hidden;isolation:isolate;color:#fff;min-height:760px;display:flex;flex-direction:column;justify-content:space-between;gap:72px}
:where(html.ds-accueil) #pourquoi .sw::before{content:"";position:absolute;inset:0;z-index:-2;background:#141917 url(/photos/08-recharge-vehicule-sunset.jpg) center/cover no-repeat;transition:transform 1.6s var(--ease-out)}
:where(html.ds-accueil) #pourquoi .sw:hover::before{transform:scale(1.04)}
:where(html.ds-accueil) #pourquoi .sw::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(11,15,13,.88) 0%,rgba(11,15,13,.55) 42%,rgba(11,15,13,.08) 72%),linear-gradient(180deg,rgba(11,15,13,0) 45%,rgba(11,15,13,.78) 100%)}
:where(html.ds-accueil) #pourquoi .sw>.reveal{max-width:600px}
:where(html.ds-accueil) #pourquoi .section-tag{color:#00F5A0!important}
:where(html.ds-accueil) #pourquoi .section-h2{color:#fff!important}
:where(html.ds-accueil) #pourquoi .section-lead,html.touches:where(.ds-accueil) #pourquoi .lit{color:#fff!important;font-weight:400!important;max-width:560px!important}
:where(html.ds-accueil) #pourquoi .why-grid{margin-top:0!important;gap:14px!important}
:where(html.ds-accueil) #pourquoi .why-card{background:rgba(255,255,255,.09)!important;-webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3);border:1px solid rgba(255,255,255,.20)!important;border-radius:24px!important;box-shadow:none!important;padding:28px 28px 30px!important;transition:background .35s var(--ease-out),transform .35s var(--ease-out),border-color .35s!important}
:where(html.ds-accueil) #pourquoi .why-card:hover{background:rgba(255,255,255,.16)!important;border-color:rgba(0,245,160,.6)!important;transform:translateY(-6px)!important}
:where(html.ds-accueil) #pourquoi .why-head{display:none!important}
:where(html.ds-accueil) #pourquoi .why-icon{display:none!important}
:where(html.ds-accueil) #pourquoi .why-num{color:#00F5A0!important;opacity:1!important;font-size:22px!important;letter-spacing:-.02em}
:where(html.ds-accueil) #pourquoi .why-card h4{color:#fff!important;font-size:20px!important;letter-spacing:-.03em;margin-bottom:10px!important}
:where(html.ds-accueil) #pourquoi .why-card p{color:rgba(255,255,255,.82)!important;font-size:14.5px!important;line-height:1.65!important;font-weight:400!important}
@media (max-width:900px){
:where(html.ds-accueil) #pourquoi{padding:56px 12px}
:where(html.ds-accueil) #pourquoi .sw{margin:0 auto;padding:44px 22px 24px;border-radius:26px;min-height:0;gap:44px}
:where(html.ds-accueil) #pourquoi .sw::after{background:linear-gradient(180deg,rgba(11,15,13,.82) 0%,rgba(11,15,13,.6) 40%,rgba(11,15,13,.86) 100%)}
}
html.touches:where(.ds-accueil) .lit{font-size:clamp(20px,2.1vw,27px)!important;line-height:1.45!important;font-weight:400!important;max-width:760px!important;color:var(--c-ink)!important;letter-spacing:-.015em}
html.touches:where(.ds-accueil) .lit .lw{opacity:.2;transition:opacity .45s ease}
html.touches:where(.ds-accueil) .lit .lw.on{opacity:1}
html.touches:where(.ds-accueil) .process-wrap{position:relative;overflow:clip}
@media (min-width:981px){
html.touches:where(.ds-accueil) .process-wrap .sw{display:grid;grid-template-columns:.85fr 1.15fr;gap:64px;align-items:start;padding-top:110px;padding-bottom:130px}
html.touches:where(.ds-accueil) .process-wrap .sw>.reveal:first-child{position:sticky;top:150px}
html.touches:where(.ds-accueil) .process-grid{display:grid!important;grid-template-columns:1fr!important;gap:20px!important;margin-top:0!important;background:none!important;border:0!important;box-shadow:none!important;overflow:visible!important;border-radius:0!important;transform:none!important}
html.touches:where(.ds-accueil) .p-step{position:sticky;padding:36px 38px 42px!important;box-shadow:0 -18px 40px rgba(0,0,0,.30)!important}
html.touches:where(.ds-accueil) .p-step:nth-child(1){top:150px}
html.touches:where(.ds-accueil) .p-step:nth-child(2){top:168px}
html.touches:where(.ds-accueil) .p-step:nth-child(3){top:186px}
html.touches:where(.ds-accueil) .p-step:nth-child(4){top:204px}
html.touches:where(.ds-accueil) .p-step :is(h3,h4){font-size:24px!important;margin:34px 0 10px!important}
html.touches:where(.ds-accueil) .p-step :is(h3,h4) br{display:none}
html.touches:where(.ds-accueil) .process-wrap .section-h2{font-size:clamp(30px,3.3vw,46px)}
html.touches:where(.ds-accueil) .p-step p{font-size:16px!important;max-width:46ch}
}
html.touches:where(.ds-accueil) .process-wrap::before{content:"";position:absolute;left:18%;top:-10%;width:900px;height:900px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(0,245,160,.16),rgba(0,245,160,0));pointer-events:none}
html.touches:where(.ds-accueil) .process-wrap .sw{position:relative}
html.touches:where(.ds-accueil) .why-card{border-width:1px!important;border-radius:24px!important}
html.touches:where(.ds-accueil) .p-step{border-radius:24px!important;background:#1B211E!important;border-color:rgba(255,255,255,.09)!important}
html.touches:where(.ds-accueil) .partner-card{background:radial-gradient(120% 160% at 12% 0%,#0E5A41 0%,#0A3A2B 45%,#0B1F18 100%)!important;border-radius:32px!important}
html.touches:where(.ds-accueil) .partner-card .partner-desc{color:rgba(255,255,255,.72)!important}
@media (prefers-reduced-motion:reduce){
html.touches:where(.ds-accueil) .lit .lw{opacity:1;transition:none}
}
:where(html.ds-accueil) .process-wrap{background:var(--c-menthe)!important;border-top:none!important}
:where(html.ds-accueil) .why-card{border:1px solid var(--c-border)!important;border-radius:24px!important;box-shadow:0 8px 30px rgba(0,0,0,.06)!important;transition:transform .28s var(--ease-out),box-shadow .28s,border-color .28s!important}
:where(html.ds-accueil) .why-card:hover{transform:translateY(-6px);box-shadow:0 22px 48px rgba(0,0,0,.10)!important;border-color:var(--c-vert-br)!important}
:where(html.ds-accueil) .why-card::before{display:none!important}
:where(html.ds-accueil) .why-icon{background:var(--c-vert-bg)!important;width:54px!important;height:54px!important;border-radius:16px!important;margin-bottom:22px!important}
:where(html.ds-accueil) .why-icon svg{stroke:var(--c-vert)!important}
:where(html.ds-accueil) .why-num{color:var(--c-vert-txt)!important;font-weight:800!important}
:where(html.ds-accueil) .process-grid{border:none!important;background:transparent!important;box-shadow:none!important;overflow:visible!important;gap:20px!important;margin-top:48px!important}
:where(html.ds-accueil) .p-step{background:var(--c-bg2)!important;border:1px solid var(--c-border)!important;border-radius:20px!important;box-shadow:0 8px 26px rgba(0,0,0,.05)!important;transition:transform .28s var(--ease-out),box-shadow .28s!important}
:where(html.ds-accueil) .p-step:hover{transform:translateY(-6px);box-shadow:0 20px 44px rgba(0,0,0,.10)!important}
:where(html.ds-accueil) .p-icon{display:none!important}
:where(html.ds-accueil) .p-head{margin-bottom:16px!important}
:where(html.ds-accueil) .p-num{display:inline-flex!important;align-items:center;justify-content:center;background:var(--c-band)!important;color:var(--c-vert-lt)!important;font-family:var(--ff-h);font-weight:800!important;font-size:12.5px!important;padding:8px 13px!important;border-radius:11px!important;letter-spacing:0!important;margin-bottom:0!important}
:where(html.ds-accueil) .blog-card{border-radius:22px!important}
:where(html.ds-accueil) .blog-card:hover{transform:translateY(-6px);box-shadow:0 20px 44px rgba(0,0,0,.10)!important}
:where(html.ds-accueil) #pourquoi{background:var(--c-bg2)!important}
:where(html.ds-accueil) .why-card{background:transparent!important;border:1.5px solid var(--c-border)!important;box-shadow:none!important;border-radius:20px!important}
:where(html.ds-accueil) .why-card:hover{border-color:var(--c-vert)!important;transform:translateY(-4px)!important;box-shadow:none!important}
:where(html.ds-accueil) .why-icon{background:transparent!important;border:1.6px solid var(--c-vert)!important;border-radius:14px!important;width:50px!important;height:50px!important}
:where(html.ds-accueil) .why-num{font-family:var(--ff-h)!important;font-size:38px!important;font-weight:800!important;color:rgba(0,194,126,.20)!important;letter-spacing:-.04em!important;text-transform:none!important}
:where(html.ds-accueil) .process-wrap{background:var(--c-band)!important;border-top:none!important}
:where(html.ds-accueil) .process-wrap .section-tag{color:var(--c-vert-lt)!important}
:where(html.ds-accueil) .process-wrap .section-h2{color:#fff!important}
:where(html.ds-accueil) .process-wrap .section-lead{color:rgba(255,255,255,.7)!important}
:where(html.ds-accueil) .p-step{background:rgba(255,255,255,.05)!important;border:1px solid rgba(255,255,255,.12)!important;box-shadow:none!important}
:where(html.ds-accueil) .p-step:hover{background:rgba(255,255,255,.09)!important;transform:translateY(-6px)!important;box-shadow:none!important}
:where(html.ds-accueil) .p-step :is(h3,h4){color:#fff!important}
:where(html.ds-accueil) .p-step p{color:rgba(255,255,255,.68)!important}
:where(html.ds-accueil) .p-num{background:var(--c-vert)!important;color:#05231a!important}
:where(html.ds-accueil) .blog-wrap{background:var(--c-menthe)!important;border-top:none!important;overflow:hidden}
:where(html.ds-accueil) .faq-section{background:var(--c-bg2)!important}
:where(html.ds-accueil) .faq-section .sw{display:grid!important;grid-template-columns:330px 1fr!important;gap:56px!important;align-items:start!important}
@media(max-width:860px){
:where(html.ds-accueil) .faq-section .sw{grid-template-columns:1fr!important;gap:24px!important}
}
@keyframes ca-fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes ca-recoIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes ca-sceneMonte{from{opacity:0;transform:translateY(46px)}to{opacity:1;transform:none}}
@keyframes ca-sceneAllume{from{opacity:0}to{opacity:1}}
@keyframes ca-sceneHalo{0%,100%{opacity:.55;transform:scale(.94)}50%{opacity:.95;transform:scale(1.05)}}
@keyframes ca-sceneFlux{to{stroke-dashoffset:-16}}
@keyframes ca-sceneLed{50%{opacity:.35}}
@keyframes ca-scenePasse{0%{transform:translate(0,0);opacity:0}4%{opacity:1}92%{opacity:1}100%{transform:translate(var(--dx),var(--dy));opacity:0}}
