/* ===== Firmia — feuille de style commune ===== */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:#0B1D33}
.racine{container-type:inline-size;min-height:100vh;display:flex;flex-direction:column;background:#F6F7F4;font-family:'Instrument Sans',system-ui,sans-serif;color:#0B1D33}
[id]{scroll-margin-top:88px}
a{color:inherit}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #5FD3BD;outline-offset:2px}
button:disabled{opacity:.7;cursor:progress}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.conteneur{max-width:1240px;width:100%;margin:0 auto;padding:0 20px;box-sizing:border-box}

/* ----- Barre utilitaire ----- */
.utilitaire{background:#0B1D33;border-bottom:1px solid rgba(246,247,244,.1)}
.utilitaire .barre{max-width:1240px;margin:0 auto;padding:0 20px;box-sizing:border-box;min-height:40px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 20px;font-size:13.5px;color:#A9B8C8}
.utilitaire-liens{display:flex;flex-wrap:wrap;gap:6px 20px}
.utilitaire a{color:#A9B8C8;text-decoration:none}
.utilitaire a:hover{color:#F6F7F4}
.utilitaire a.ouvert{display:inline-flex;align-items:center;gap:8px;color:#5FD3BD;font-weight:600}
.utilitaire a.ouvert::before{content:"";width:7px;height:7px;border-radius:50%;background:#5FD3BD}
@media (max-width:600px){.utilitaire .barre>span:first-child{display:none}.utilitaire .barre{justify-content:center}}

/* ----- Menu principal (collant, sombre) ----- */
.entete{position:sticky;top:0;z-index:50;background:rgba(11,29,51,.94);-webkit-backdrop-filter:saturate(1.3) blur(12px);backdrop-filter:saturate(1.3) blur(12px);border-bottom:1px solid rgba(246,247,244,.08);transition:box-shadow .2s ease}
.entete.is-scrolled{box-shadow:0 14px 32px -18px rgba(0,0,0,.7)}
.nav{position:relative;max-width:1240px;margin:0 auto;box-sizing:border-box;padding:0 20px;height:72px;display:flex;align-items:center;gap:16px}
.nav-logo{flex-shrink:0;display:flex;align-items:center;gap:10px;color:#F6F7F4;text-decoration:none;font-family:Sora,sans-serif;font-size:22px;font-weight:600;letter-spacing:-.03em}
.nav-liens{list-style:none;margin:0 auto;padding:0;display:flex;align-items:center;gap:2px}
.nav-lien{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 14px;border:0;border-radius:10px;background:none;color:#D5DEE7;font:500 15.5px 'Instrument Sans',system-ui,sans-serif;text-decoration:none;cursor:pointer}
.nav-lien:hover,.nav-lien[aria-expanded="true"],.nav-lien.nav-actif{background:rgba(246,247,244,.09);color:#FFFFFF}
.nav-lien svg{transition:transform .2s ease}
.nav-lien[aria-expanded="true"] svg{transform:rotate(180deg)}
.nav-actions{flex-shrink:0;display:flex;align-items:center;gap:8px;margin-left:auto}
.nav-liens+.nav-actions{margin-left:0}
.nav-cta{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 18px;border-radius:12px;background:#0FA38A;color:#0B1D33;text-decoration:none;font-size:15px;font-weight:700;white-space:nowrap}
.nav-cta:hover{background:#3CC3A9}
.nav-burger{display:none;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:12px;background:rgba(246,247,244,.09);color:#F6F7F4;cursor:pointer}
.nav-burger .icone-fermer,.nav-burger[aria-expanded="true"] .icone-ouvrir{display:none}
.nav-burger[aria-expanded="true"] .icone-fermer{display:block}

/* Menu déroulant Produits */
.menu-produits{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);width:min(720px,calc(100vw - 32px));box-sizing:border-box;padding:10px;background:#FFFFFF;border:1px solid #E3E8EC;border-radius:18px;box-shadow:0 28px 56px -18px rgba(0,0,0,.45);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.menu-produits[hidden],.menu-mobile[hidden]{display:none}
.produit-item{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:14px;border-radius:12px;color:#0B1D33;text-decoration:none}
.produit-item:hover,.produit-item[aria-current="page"]{background:#F6F7F4}
.produit-icone{flex-shrink:0;width:40px;height:40px;border-radius:11px;background:#0B1D33;color:#5FD3BD;display:flex;align-items:center;justify-content:center}
.produit-item strong{display:block;font-family:Sora,sans-serif;font-size:15.5px;font-weight:600}
.produit-item small{display:block;margin-top:4px;font-size:13.5px;line-height:1.45;color:#4B5B6D}
.menu-pied{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:4px;padding:12px 14px;border-radius:12px;background:#F6F7F4;color:#0B7A67;font-size:14.5px;font-weight:600;text-decoration:none}
.menu-pied:hover{background:#E7F6F2}

/* Menu mobile */
.menu-mobile{position:absolute;top:calc(100% + 8px);left:12px;right:12px;max-height:calc(100vh - 130px);overflow:auto;padding:12px;background:#FFFFFF;border:1px solid #E3E8EC;border-radius:18px;box-shadow:0 28px 56px -18px rgba(0,0,0,.45)}
.menu-mobile .produit-item{flex-direction:row;align-items:center;gap:14px;padding:10px}
.menu-mobile-titre{margin:6px 10px 4px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#0B7A67}
.menu-mobile-liens{display:flex;flex-direction:column;margin:8px 0 12px;padding-top:8px;border-top:1px solid #E3E8EC}
.menu-mobile-liens a{padding:13px 10px;border-radius:10px;color:#0B1D33;text-decoration:none;font-size:17px;font-weight:500}
.menu-mobile-liens a:hover{background:#F6F7F4}
.nav-cta-plein{display:flex;width:100%;height:52px;box-sizing:border-box;font-size:16px}
@media (max-width:980px){.nav-liens{display:none}.nav-burger{display:inline-flex}.nav-liens+.nav-actions{margin-left:auto}}
@media (max-width:440px){.nav-actions>.nav-cta{display:none}}

/* ----- Onglets produits (accueil) ----- */
.onglet{--o-bg:#FFFFFF;--o-border:#E3E8EC;--o-icon-bg:#0B1D33;--o-icon-fg:#5FD3BD;--o-title:#0B1D33;--o-text:#4B5B6D;transition:background-color .2s,border-color .2s}
.onglet:hover{--o-border:#9FB0BF}
.onglet[aria-selected="true"]{--o-bg:#0B1D33;--o-border:#0B1D33;--o-icon-bg:#0FA38A;--o-icon-fg:#0B1D33;--o-title:#FFFFFF;--o-text:#A9B8C8}
[role="tabpanel"]:focus-visible{outline:3px solid #5FD3BD;outline-offset:8px;border-radius:12px}
.lien-fleche{display:inline-flex;align-items:center;gap:8px;color:#0B7A67;font-size:16px;font-weight:600;text-decoration:none}
.lien-fleche:hover{text-decoration:underline}
.lien-clair{color:#5FD3BD}

/* ----- Animation : contrôles ----- */
.icone-play{display:none}
.icone-pause{display:flex}
.fx-paused .icone-play{display:flex}
.fx-paused .icone-pause{display:none}
.fx-hors-ecran,.fx-hors-ecran *{animation-play-state:paused !important}

/* ----- Pages produits ----- */
.pp-hero{background:#0B1D33;color:#F6F7F4;padding:clamp(36px,5.5cqi,80px) 0 clamp(56px,7cqi,104px)}
.pp-hero-grille{display:flex;flex-wrap:wrap;align-items:center;gap:40px 64px}
.pp-hero-texte{flex:1 1 440px;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.fil{font-size:14px;color:#A9B8C8}
.fil a{color:#A9B8C8;text-decoration:none}
.fil a:hover{color:#F6F7F4;text-decoration:underline}
.fil span[aria-current]{color:#F6F7F4}
.pp-nom{display:flex;flex-wrap:wrap;align-items:center;gap:12px;font-family:Sora,sans-serif;font-size:18px;font-weight:600}
.pp-icone{width:48px;height:48px;border-radius:13px;background:#0FA38A;color:#0B1D33;display:flex;align-items:center;justify-content:center}
.badge-acces{display:inline-flex;align-items:center;padding:5px 12px;border-radius:999px;border:1px solid rgba(95,211,189,.35);font-family:'Instrument Sans',system-ui,sans-serif;font-size:13px;font-weight:600;color:#5FD3BD}
.pp-titre{margin:0;font-family:Sora,sans-serif;font-size:clamp(36px,4.6cqi,62px);font-weight:600;line-height:1.05;letter-spacing:-.035em}
.pp-intro{margin:0;max-width:600px;font-size:clamp(17px,1.35cqi,19px);line-height:1.6;color:#A9B8C8}
.boutons{display:flex;flex-wrap:wrap;gap:12px;padding-top:6px}
.btn{display:inline-flex;align-items:center;gap:10px;height:54px;padding:0 24px;border-radius:12px;box-sizing:border-box;font-size:17px;font-weight:600;text-decoration:none}
.btn-teal{background:#0FA38A;color:#0B1D33;font-weight:700}
.btn-teal:hover{background:#3CC3A9}
.btn-contour{border:1.5px solid rgba(246,247,244,.3);color:#F6F7F4}
.btn-contour:hover{border-color:#F6F7F4}
.section{padding:clamp(56px,7.8cqi,104px) 0}
.section-claire{background:#F6F7F4}
.section-blanche{background:#FFFFFF}
.section-sombre{background:#0B1D33;color:#F6F7F4}
.etiquette{display:flex;align-items:center;gap:16px;margin-bottom:clamp(18px,2.4cqi,28px)}
.etiquette span:first-child{font-family:Sora,sans-serif;font-size:14px;font-weight:600;letter-spacing:.14em;color:#0B7A67;white-space:nowrap}
.etiquette span:last-child{flex-grow:1;height:1px;background:#D5DCE2}
.section-sombre .etiquette span:first-child{color:#5FD3BD}
.section-sombre .etiquette span:last-child{background:rgba(246,247,244,.16)}
.titre{margin:0;max-width:820px;font-family:Sora,sans-serif;font-size:clamp(28px,3.1cqi,44px);font-weight:600;line-height:1.12;letter-spacing:-.03em}
.texte{margin:14px 0 0;max-width:680px;font-size:17px;line-height:1.6;color:#4B5B6D}
.section-sombre .texte{color:#A9B8C8}
.grille-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;margin-top:28px}
.carte{background:#FFFFFF;border:1px solid #E3E8EC;border-radius:20px;padding:26px}
.carte h3{margin:0 0 8px;font-family:Sora,sans-serif;font-size:19px;font-weight:600}
.carte p{margin:0;font-size:16px;line-height:1.6;color:#4B5B6D}
.stat{margin-top:24px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;background:#E7F6F2;border-radius:20px;padding:22px 26px}
.stat-chiffre{font-family:Sora,sans-serif;font-size:clamp(32px,3.4cqi,44px);font-weight:600;letter-spacing:-.02em;color:#0B7A67;white-space:nowrap}
.stat p{margin:0;font-size:16.5px;line-height:1.5;font-weight:500}
.stat .stat-source{margin-top:4px;font-size:13.5px;font-weight:400;color:#33584F}
.etapes{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.etapes li{background:#F6F7F4;border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:10px}
.etape-num{font-family:Sora,sans-serif;font-size:34px;font-weight:600;line-height:1;color:#0FA38A}
.etapes h3{margin:0;font-family:Sora,sans-serif;font-size:18px;font-weight:600}
.etapes p{margin:0;font-size:15.5px;line-height:1.55;color:#4B5B6D}
.fonctions{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-top:28px}
.fonction{display:flex;gap:16px;align-items:flex-start;background:rgba(246,247,244,.05);border:1px solid rgba(246,247,244,.12);border-radius:20px;padding:22px}
.fonction-icone{flex-shrink:0;width:44px;height:44px;border-radius:12px;background:rgba(95,211,189,.14);color:#5FD3BD;display:flex;align-items:center;justify-content:center}
.fonction h3{margin:0 0 6px;font-family:Sora,sans-serif;font-size:17.5px;font-weight:600}
.fonction p{margin:0;font-size:15.5px;line-height:1.55;color:#A9B8C8}
.pp-duo{display:flex;flex-wrap:wrap;gap:24px 48px;align-items:stretch}
.pp-duo>div:first-child{flex:3 1 460px;min-width:0}
.carte-sombre{flex:2 1 340px;min-width:0;box-sizing:border-box;background:#0B1D33;color:#F6F7F4;border-radius:24px;padding:30px;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.carte-sombre h3{margin:0;font-family:Sora,sans-serif;font-size:20px;font-weight:600}
.carte-sombre p{margin:0;font-size:16px;line-height:1.6;color:#A9B8C8}
.puces{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;padding:0;list-style:none}
.puces li{padding:8px 14px;border-radius:999px;background:#FFFFFF;border:1px solid #E3E8EC;font-size:15px;font-weight:500}
.carte-sombre .puces{margin-top:0}
.carte-sombre .puces li{background:transparent;border-color:rgba(246,247,244,.22);color:#F6F7F4}
.faq{max-width:880px}
.faq details{border-bottom:1px solid #D5DCE2}
.faq details:first-child{border-top:1px solid #D5DCE2}
.faq summary{list-style:none;cursor:pointer;position:relative;padding:22px 48px 22px 0;font-family:Sora,sans-serif;font-size:18px;font-weight:600;line-height:1.35}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:8px;top:50%;transform:translateY(-50%);font-family:'Instrument Sans',sans-serif;font-size:28px;font-weight:400;color:#0B7A67}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:0 0 22px;max-width:760px;font-size:16.5px;line-height:1.6;color:#4B5B6D}
.autres{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-top:22px}
.autre{display:flex;align-items:center;gap:16px;padding:22px;border-radius:20px;background:#FFFFFF;border:1px solid #E3E8EC;color:#0B1D33;text-decoration:none}
.autre:hover{border-color:#0B7A67}
.autre strong{display:block;font-family:Sora,sans-serif;font-size:17px;font-weight:600}
.autre small{display:block;margin-top:4px;font-size:14.5px;line-height:1.45;color:#4B5B6D}
.autre-fleche{margin-left:auto;font-size:22px;color:#0B7A67}

/* ----- Accès anticipé (toutes les pages) ----- */
.section-acces{background:#0B1D33;padding:clamp(56px,7.2cqi,104px) 0}
.cta-carte{background:#0B7A67;border-radius:28px;padding:clamp(28px,5cqi,64px);display:flex;flex-wrap:wrap;align-items:center;gap:28px 56px}
.cta-texte{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:14px}
.cta-texte h2{margin:0;font-family:Sora,sans-serif;font-size:clamp(28px,3.2cqi,44px);font-weight:600;line-height:1.1;letter-spacing:-.03em;color:#FFFFFF}
.cta-texte p{margin:0;font-size:17px;line-height:1.6;color:#E6F4F0}
.form-acces{flex:1 1 360px;min-width:0;display:flex;flex-direction:column;gap:8px}
.form-acces label{font-size:15px;font-weight:600;color:#FFFFFF}
.form-acces input[type="email"]{height:56px;box-sizing:border-box;padding:0 18px;border:0;border-radius:12px;background:#FFFFFF;color:#0B1D33;font-family:inherit;font-size:17px}
.form-acces button{height:56px;border:0;border-radius:12px;background:#0B1D33;color:#FFFFFF;font-family:inherit;font-size:17px;font-weight:600;cursor:pointer}
.form-acces button:hover{background:#16304F}
.form-message{margin:4px 0 0;min-height:24px;font-size:15.5px;font-weight:600;line-height:1.5;color:#FFFFFF}
.form-note{margin:0;font-size:13.5px;line-height:1.55;color:#E6F4F0}
.form-note a{color:#FFFFFF}

/* ----- Pied de page ----- */
.pied{flex-grow:1;background:#081626;color:#A9B8C8}
.pied-grille{max-width:1240px;margin:0 auto;padding:56px 20px 36px;box-sizing:border-box;display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:32px}
.pied-logo{display:inline-flex;align-items:center;gap:10px;color:#F6F7F4;text-decoration:none;font-family:Sora,sans-serif;font-size:22px;font-weight:600;letter-spacing:-.03em}
.pied-marque p{margin:14px 0 0;font-size:15px;line-height:1.6}
.pied h2{margin:0 0 14px;font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#5FD3BD}
.pied ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.pied ul a{color:#D5DEE7;text-decoration:none;font-size:15px}
.pied ul a:hover{color:#FFFFFF;text-decoration:underline}
.pied-bas{max-width:1240px;margin:0 auto;padding:20px 20px 32px;box-sizing:border-box;border-top:1px solid rgba(246,247,244,.1);font-size:14px}

/* ----- Politique de confidentialité ----- */
.legal{max-width:760px;margin:0 auto;padding:56px 20px 96px;box-sizing:border-box}
.legal h1{font-family:Sora,sans-serif;font-size:clamp(32px,5vw,44px);font-weight:600;line-height:1.1;letter-spacing:-.03em;margin:0 0 12px}
.legal h2{font-family:Sora,sans-serif;font-size:21px;font-weight:600;letter-spacing:-.01em;margin:40px 0 10px}
.legal p,.legal li{font-size:17px;line-height:1.65;color:#33424F}
.legal ul{padding-left:22px}
.legal a{color:#0B7A67}
.legal .maj{color:#4B5B6D;font-size:15px;margin:0 0 32px}
.legal .contact{background:#FFFFFF;border:1px solid #E3E8EC;border-radius:14px;padding:16px 20px}

/* ----- Animation du haut de page ----- */
@keyframes fxScene{0%{opacity:0}2%{opacity:1}23%{opacity:1}25%{opacity:0}100%{opacity:0}}
@keyframes fxBar{0%{width:0}25%{width:100%}25.01%{width:0}100%{width:0}}
@keyframes fxLabel{0%{opacity:1}24.9%{opacity:1}25%{opacity:.5}100%{opacity:.5}}
@keyframes fxBlink{0%,100%{opacity:1}50%{opacity:.2}}
@keyframes fxDash{to{stroke-dashoffset:-48}}
@keyframes fxWalk{from{transform:translateX(-120px)}to{transform:translateX(1220px)}}
@keyframes fxLeg{0%,100%{transform:rotate(18deg)}50%{transform:rotate(-18deg)}}
@keyframes fxType{0%,100%{transform:translateY(0)}50%{transform:translateY(2px)}}
@keyframes fxFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes fxNotif{0%,6%{opacity:0;transform:translateY(14px)}16%,94%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(0)}}
@keyframes fxScan{0%{transform:translateY(0)}100%{transform:translateY(170px)}}
@keyframes fxRise{0%{transform:translateY(0);opacity:0}25%{opacity:1}100%{transform:translateY(-150px);opacity:0}}
@keyframes fxGrow{0%,8%{transform:scaleY(.15)}55%,100%{transform:scaleY(1)}}
@keyframes fxCursor{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes fxPulse{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes fxPacket{0%{transform:translateX(0);opacity:0}8%{opacity:1}92%{opacity:1}100%{transform:translateX(940px);opacity:0}}
.fx-scene{opacity:0;animation:fxScene 16s linear infinite}
.fx-bar{width:0;animation:fxBar 16s linear infinite}
.fx-label{opacity:.5;animation:fxLabel 16s linear infinite}
.fx-blink{animation:fxBlink 1.6s ease-in-out infinite}
.fx-dash{stroke-dasharray:10 14;animation:fxDash 1s linear infinite}
.fx-walk{animation:fxWalk 8s linear infinite}
.fx-leg{transform-box:fill-box;transform-origin:50% 0;animation:fxLeg .8s ease-in-out infinite}
.fx-type{animation:fxType .4s ease-in-out infinite}
.fx-float{animation:fxFloat 2s ease-in-out infinite}
.fx-notif{opacity:0;animation:fxNotif 4s ease-out infinite}
.fx-scan{animation:fxScan 2s linear infinite}
.fx-rise{animation:fxRise 2s ease-out infinite}
.fx-grow{transform-box:fill-box;transform-origin:50% 100%;animation:fxGrow 4s ease-out infinite}
.fx-cursor{animation:fxCursor 1s steps(1) infinite}
.fx-pulse{animation:fxPulse 2s ease-in-out infinite}
.fx-packet{animation:fxPacket 2s linear infinite}
.fx-t2{animation-delay:4s}.fx-t3{animation-delay:8s}.fx-t4{animation-delay:12s}
.fx-leg-b{animation-delay:-.4s}
.fx-walk-b{animation-delay:-3.2s}
.fx-d1{animation-delay:-.4s}.fx-d2{animation-delay:-.9s}.fx-d3{animation-delay:-1.3s}
.fx-n2{animation-delay:.5s}.fx-n3{animation-delay:1s}
.fx-f2{animation-delay:-.7s}.fx-f3{animation-delay:-1.4s}
.fx-p2{animation-delay:-.5s}.fx-p3{animation-delay:-1s}.fx-p4{animation-delay:-1.5s}
.fx-r2{animation-delay:-.5s}.fx-r3{animation-delay:-1s}.fx-r4{animation-delay:-1.5s}
.fx-paused,.fx-paused *{animation-play-state:paused !important}
@media (prefers-reduced-motion:reduce){.fx-stage *{animation:none !important}.fx-scene{opacity:0}.fx-scene.fx-t4{opacity:1}.fx-notif{opacity:1}.fx-label{opacity:.5}.fx-label.fx-t4{opacity:1}}