/* Trockenrechner : « Hygrometer » (14/11/2026). Marine encre, cyan condensation, ambre des euros. DA : theme/DA.md */
:root{
  --fond:#f4f7f9; --papier:#ffffff; --encre:#10263b; --doux:#4a5d6e; --trait:#d5dee6; --trait2:#e8eef2;
  --eau:#0f7fa3; --eau-clair:#d9f0f7; --eau-vif:#3fb6dc; --ambre:#b86e00; --ambre-clair:#fff1d9; --vert:#2f7d4f; --vert-clair:#e3f3e9; --rouge:#a8352b;
  --cta:#0f7fa3; --cta-txt:#ffffff; --zone:#5fbf86;
  --t-titre:"Familjen Grotesk",system-ui,sans-serif; --t-corps:"Manrope",system-ui,sans-serif; --t-mono:"Martian Mono",ui-monospace,monospace;
  --r:10px; --l:1120px;
}
@media (prefers-color-scheme: dark){:root{
  --fond:#0b1622; --papier:#122233; --encre:#e6eef5; --doux:#a9bccc; --trait:#2a4157; --trait2:#1b3044;
  --eau:#4cc3e8; --eau-clair:#13394a; --eau-vif:#4cc3e8; --ambre:#ffb648; --ambre-clair:#3a2a10; --vert:#7fd6a2; --vert-clair:#163a27; --rouge:#ff8a7d;
  --cta:#4cc3e8; --cta-txt:#06202c; --zone:#5fbf86;
}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fond);color:var(--encre);font:400 1.0625rem/1.65 var(--t-corps);overflow-x:hidden}
img,svg{max-width:100%;height:auto}
a{color:var(--eau);text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
h1,h2,h3{font-family:var(--t-titre);line-height:1.15;letter-spacing:-.01em;color:var(--encre)}
h1{font-size:clamp(1.9rem,4.4vw,3rem);margin:.2em 0 .35em;font-weight:700}
h2{font-size:clamp(1.4rem,2.6vw,1.85rem);margin:2.2em 0 .6em;font-weight:700}
h3{font-size:1.2rem;margin:1.6em 0 .5em}
p,ul,ol{margin:0 0 1em}
strong{font-weight:700}
.evitement{position:absolute;left:-9999px}.evitement:focus{left:1rem;top:1rem;background:var(--papier);padding:.5rem 1rem;z-index:10}
/* en-tête */
.ent{background:var(--papier);border-bottom:1px solid var(--trait)}
.ent__l{max-width:var(--l);margin:0 auto;padding:.8rem 16px;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.logo{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;color:var(--encre);font:700 1.3rem var(--t-titre)}
.logo b{color:var(--eau);font-weight:700}
.logo__goutte{width:30px;height:30px}.logo__goutte path{fill:var(--eau-vif)}.logo__goutte .logo__trait{fill:none;stroke:var(--papier);stroke-width:2.2;stroke-linecap:round}
.ent nav ul,.pied__nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.3rem 1.1rem}
.ent nav a,.pied__nav a{color:var(--encre);text-decoration:none;font-weight:500;font-size:.95rem}
.ent nav a[aria-current],.ent nav a:hover{color:var(--eau);text-decoration:underline}
.hygro{height:6px;background:linear-gradient(90deg,#e0a42c 0%,#e8c45a 30%,var(--zone) 40%,var(--zone) 60%,#4aa6c9 70%,#1f5f8f 100%);position:relative}
.hygro__zone{position:absolute;left:40%;width:20%;top:-3px;bottom:-3px;border:2px solid var(--encre);border-radius:3px;opacity:.55}
/* héros */
.heros{background:radial-gradient(1200px 400px at 10% 0%,var(--eau-clair),transparent 70%),var(--fond)}
.heros__l{max-width:var(--l);margin:0 auto;padding:2.2rem 16px 2rem;display:grid;grid-template-columns:1.05fr 1fr;gap:2rem;align-items:start}
.sur{font:600 .78rem var(--t-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--eau);margin:0}
.heros__chapo{font-size:1.15rem;color:var(--doux);max-width:36em}
.releves{list-style:none;padding:0;margin:1.2rem 0;display:flex;flex-wrap:wrap;gap:.8rem}
.releves li{background:var(--papier);border:1px solid var(--trait);border-radius:var(--r);padding:.55rem .8rem;min-width:7.5rem}
.releves strong{display:block;font:600 1.35rem var(--t-mono);color:var(--encre)}
.releves span{font-size:.82rem;color:var(--doux)}
.panneau{background:var(--papier);border:1px solid var(--trait);border-top:5px solid var(--eau);border-radius:var(--r);padding:1.1rem 1.1rem .8rem;box-shadow:0 10px 30px -18px rgba(16,38,59,.35)}
.panneau__tete{display:flex;gap:.6rem;align-items:center}
.panneau__tete h2{margin:0;font-size:1.3rem}
.panneau__g{display:inline-grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--ambre-clair);color:var(--ambre);font:700 1rem var(--t-mono)}
.panneau__txt{color:var(--doux);font-size:.95rem;margin:.5rem 0 .8rem}
.panneau__pied{margin:.8rem 0 0;font-size:.92rem}
.tuiles{max-width:var(--l);margin:0 auto;padding:0 16px}
.tuiles ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem}
.tuiles a{display:flex;flex-direction:column;gap:.2rem;height:100%;background:var(--papier);border:1px solid var(--trait);border-radius:var(--r);padding:.9rem;text-decoration:none;color:var(--encre)}
.tuiles a:hover{border-color:var(--eau)}
.tuiles__u{font:600 1.2rem var(--t-mono);color:var(--ambre)}
.tuiles__l{font:600 .72rem var(--t-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--doux)}
.tuiles__txt{font-size:.88rem;color:var(--doux)}
/* bandeau intérieur */
.bandeau{background:var(--papier);border-bottom:1px solid var(--trait)}
.bandeau__l{max-width:var(--l);margin:0 auto;padding:1.4rem 16px 1.2rem}
.bandeau__chapo{font-size:1.12rem;color:var(--doux);max-width:46em}
.fil{font-size:.85rem;color:var(--doux)}.fil a{color:var(--doux)}
.signature,.maj{display:inline-block;margin:0 1rem 0 0;font-size:.88rem;color:var(--doux)}
.signature a{color:var(--doux)}
/* contenu */
.cont{max-width:var(--l);margin:0 auto;padding:1.5rem 16px 3rem}
.art{max-width:820px}
.art--comparatif,.art--pilier,.art--outil{max-width:none}
.art--comparatif>p,.art--pilier>p,.art--outil>p,.art--comparatif>h2,.art--pilier>h2,.art--outil>h2,.art--comparatif>ul,.art--pilier>ul,.art--outil>ul{max-width:820px}
.aff,.encadre{background:var(--eau-clair);border-left:4px solid var(--eau);border-radius:0 var(--r) var(--r) 0;padding:.8rem 1rem;margin:1.2rem 0}
.encadre p:last-child{margin-bottom:0}
.reponse{background:var(--papier);border:1px solid var(--trait);border-left:5px solid var(--ambre);border-radius:var(--r);padding:1rem 1.1rem;margin:0 0 1.5rem;font-size:1.08rem}
.reponse p:last-child{margin:0}
.petit{font-size:.86rem;color:var(--doux)}
.methode-lien{font-size:.86rem;margin:.4rem 0 1.4rem}
.gros{font:600 1.6rem var(--t-mono);color:var(--encre)}
.mois{font-family:var(--t-mono)}
.sommaire{background:var(--papier);border:1px solid var(--trait);border-radius:var(--r);padding:.6rem 1rem;margin:0 0 1.5rem;max-width:820px}
.sommaire summary{cursor:pointer;font-weight:700}
.sommaire ol{margin:.6rem 0 .2rem;padding-left:1.3rem}
/* figures */
.illu{margin:1.6rem 0;max-width:820px}
.illu img{display:block;width:100%;height:auto;border:1px solid var(--trait);border-radius:var(--r);background:#fff}
.illu figcaption{font-size:.85rem;color:var(--doux);margin-top:.4rem}
/* tableaux */
table{border-collapse:collapse;width:100%;font-size:.92rem;background:var(--papier);margin:1rem 0}
.tab,table{display:block;overflow-x:auto;max-width:100%}
thead th{background:var(--trait2);text-align:left;font-weight:700}
th,td{padding:.5rem .6rem;border-bottom:1px solid var(--trait);vertical-align:top}
td.n,th.n{text-align:right;font-family:var(--t-mono);font-size:.85rem;white-space:nowrap}
tbody tr:hover{background:var(--trait2)}
/* outils */
.outil{background:var(--papier);border:1px solid var(--trait);border-radius:var(--r);padding:1rem;margin:1.2rem 0}
.panneau .outil{border:0;padding:0;margin:0}
.grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.8rem}
.outil label{display:block;font-size:.85rem;font-weight:700;margin-bottom:.25rem}
.outil input,.outil select{width:100%;font:inherit;font-size:1rem;padding:.5rem .6rem;border:1px solid var(--trait);border-radius:8px;background:var(--fond);color:var(--encre)}
.outil input:focus,.outil select:focus{outline:2px solid var(--eau);outline-offset:1px}
.res{margin-top:1rem;padding-top:.9rem;border-top:1px dashed var(--trait)}
.res__chiffres{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.6rem;margin:0 0 .8rem}
.res__chiffres div{background:var(--fond);border-radius:8px;padding:.55rem .7rem}
.res__chiffres span{display:block;font-size:.78rem;color:var(--doux)}
.res__chiffres strong{font:600 1.15rem var(--t-mono);color:var(--ambre)}
.res ol,.res ul{padding-left:1.2rem}
.res li{margin:.3rem 0}
.res a[rel~="sponsored"]{font-weight:700}
.btn,.cta{display:inline-block;background:var(--cta);color:var(--cta-txt);text-decoration:none;font-weight:700;border-radius:8px;padding:.6rem 1rem;border:0;cursor:pointer;font-size:.95rem;text-align:center}
.btn:hover,.cta:hover{filter:brightness(1.08);text-decoration:none}
.cta--petit{padding:.35rem .7rem;font-size:.85rem}
.aff-discret{color:var(--doux)}
/* cartes produit */
.selection{background:var(--papier);border:1px solid var(--trait);border-radius:calc(var(--r) + 4px);padding:1.2rem;margin:0 0 2rem}
.selection__sur{font:600 .75rem var(--t-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--eau);margin:0}
.selection__titre{margin:.2rem 0 .4rem}
.selection__intro{color:var(--doux)}
.selection__grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.9rem}
.selection__pied{font-size:.85rem;color:var(--doux);margin:1rem 0 0}
.prod{background:var(--papier);border:1px solid var(--trait);border-radius:var(--r);padding:.9rem;display:flex;flex-direction:column;gap:.45rem;margin:1rem 0}
.selection .prod{margin:0}
.prod--un{border-color:var(--eau);box-shadow:inset 0 4px 0 var(--eau)}
.prod__tete{display:flex;justify-content:space-between;gap:.5rem;align-items:flex-start;flex-wrap:wrap}
.prod__badge{margin:0;font-weight:700;font-size:.85rem;color:var(--encre);display:flex;gap:.4rem;align-items:center}
.prod__badge span{display:inline-grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--encre);color:var(--papier);font:600 .75rem var(--t-mono)}
.prod__pastilles{margin:0;display:flex;gap:.3rem;flex-wrap:wrap}
.pastille{font:600 .68rem var(--t-mono);text-transform:uppercase;letter-spacing:.04em;padding:.15rem .4rem;border-radius:5px;background:var(--eau-clair);color:var(--eau)}
.p-adsorption{background:var(--ambre-clair);color:var(--ambre)}
.p-wae{background:var(--vert-clair);color:var(--vert)}
.prod__nom{margin:0;font:700 1.12rem var(--t-titre)}
.prod__nom span{color:var(--doux);font-weight:600}
.prod__pourquoi{margin:0;font-size:.93rem}
.prod__caracs{display:grid;grid-template-columns:1fr 1fr;gap:.25rem .8rem;margin:.2rem 0;font-size:.82rem}
.prod__caracs div{display:flex;flex-direction:column;border-bottom:1px solid var(--trait2);padding-bottom:.2rem}
.prod__caracs dt{color:var(--doux)}.prod__caracs dd{margin:0;font-family:var(--t-mono);font-size:.8rem}
.prod__pm{font-size:.85rem}.prod__pm ul{margin:.2rem 0;padding-left:1.1rem}
.prod__plus li::marker{content:"+ ";color:var(--vert)}.prod__moins li::marker{content:"– ";color:var(--rouge)}
.prod__achat{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex-wrap:wrap}
.prod__prix{margin:0;display:flex;flex-direction:column}
.prod__prix strong{font:600 1.25rem var(--t-mono);color:var(--encre)}
.prod__prix s{font-size:.85rem;color:var(--doux)}
.prod__prix span{font-size:.75rem;color:var(--doux)}
.prod__statut{margin:0;font-size:.8rem;color:var(--ambre)}
.prod__vendeurs{list-style:none;margin:.2rem 0 0;padding:.4rem 0 0;border-top:1px dashed var(--trait);font-size:.82rem}
.prod__vendeurs li{display:flex;justify-content:space-between;gap:.5rem;flex-wrap:wrap}
/* verdict, FAQ, suite */
.verdict{background:var(--papier);border:1px solid var(--trait);border-radius:var(--r);padding:1rem 1.2rem;margin:2rem 0;max-width:820px}
.verdict__liste{list-style:none;padding:0}.verdict__liste li{display:flex;justify-content:space-between;gap:.6rem;align-items:center;padding:.4rem 0;border-bottom:1px solid var(--trait2);flex-wrap:wrap}
.faq{max-width:820px}
details{background:var(--papier);border:1px solid var(--trait);border-radius:8px;padding:.6rem .9rem;margin:.5rem 0}
details summary{cursor:pointer;font-weight:700}
details[open] summary{margin-bottom:.4rem}
.suite{margin-top:2.5rem}
.cartes{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.8rem}
.cartes a{display:flex;flex-direction:column;gap:.25rem;height:100%;background:var(--papier);border:1px solid var(--trait);border-radius:var(--r);padding:.9rem;text-decoration:none;color:var(--encre)}
.cartes a:hover{border-color:var(--eau)}
.cartes span{font-size:.88rem;color:var(--doux)}
/* collant mobile */
.collant{position:fixed;left:8px;right:8px;bottom:8px;z-index:20;display:none;align-items:center;gap:.6rem;background:var(--papier);border:1px solid var(--trait);border-radius:12px;padding:.5rem .6rem;box-shadow:0 8px 24px -8px rgba(0,0,0,.35)}
.collant.vu{display:flex}
.collant__n{display:inline-grid;place-items:center;width:1.6rem;height:1.6rem;border-radius:50%;background:var(--encre);color:var(--papier);font:600 .8rem var(--t-mono);flex:none}
.collant__txt{flex:1;min-width:0;display:flex;flex-direction:column;font-size:.8rem}
.collant__txt strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.collant__x{background:none;border:0;font-size:1.3rem;color:var(--doux);cursor:pointer}
@media (min-width:900px){.collant{display:none!important}}
/* pied */
.pied{background:var(--papier);margin-top:2rem;border-top:1px solid var(--trait)}
.pied__l{max-width:var(--l);margin:0 auto;padding:1.6rem 16px 2rem;display:grid;gap:1rem}
.pied__marque p{color:var(--doux);font-size:.92rem;max-width:40em}
.pied__legal{font-size:.9rem}
@media (max-width:860px){
  .heros__l{grid-template-columns:1fr}
  .tuiles ul{grid-template-columns:1fr 1fr}
}
@media (max-width:600px){
  body{font-size:1rem}
  .tuiles ul{grid-template-columns:1fr}
  .prod__caracs{grid-template-columns:1fr}
  table{font-size:.85rem}
  .a-collant .pied{padding-bottom:4.5rem}
}