/* Carat Clair, thème « écrin » (07/11/2026). Porcelaine ivoire, encre, grenat d'écrin pour l'action, filets champagne.
   Variables propres (--cc-*) : la couleur de site.json n'est pas utilisée. */
:root{
  --fond:#faf7f2;--papier:#fffdf9;--encre:#1f1b1d;--doux:#6b6266;--ligne:#e7dfd3;--ligne-f:#d6cab8;
  --champ:#b8955a;--champ-texte:#86662f;--grenat:#6e1a2a;--grenat-f:#521320;--grenat-texte:#7d2333;
  --nuit:#1d191c;--sur-nuit:#efe7dc;--sur-nuit-doux:#b9aea6;--ok:#2f6b4a;--ko:#9b2c2c;--aff:#f6efe4;
  --titre:"Cormorant Garamond",Garamond,"Times New Roman",serif;--texte:Jost,"Helvetica Neue",Arial,sans-serif;
}
@media (prefers-color-scheme:dark){:root{
  --fond:#141114;--papier:#1c181b;--encre:#efe9e2;--doux:#b2a8a2;--ligne:#342c30;--ligne-f:#4a3f44;
  --champ:#d3b47c;--champ-texte:#d9bd88;--grenat:#8c2638;--grenat-f:#a8344a;--grenat-texte:#eaa2ae;
  --nuit:#0e0c0e;--ok:#7fcf9f;--ko:#ff9c9c;--aff:#231d1a}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fond);color:var(--encre);font:300 17px/1.72 var(--texte);font-variant-numeric:lining-nums}
img{max-width:100%;height:auto}
a{color:var(--grenat-texte);text-decoration-thickness:1px;text-underline-offset:.2em}
:focus-visible{outline:1px solid var(--champ);outline-offset:3px}
strong,b{font-weight:500}
.cc-cont{max-width:1160px;margin:0 auto;padding:0 16px}
.cc-saut{position:absolute;left:-999px}.cc-saut:focus{left:8px;top:8px;z-index:99;background:var(--papier);padding:8px 12px}
.cc-sur{margin:0 0 14px;font:400 .72rem/1.4 var(--texte);text-transform:uppercase;letter-spacing:.28em;color:var(--champ-texte)}
.cc-sur--centre{text-align:center}
.cc-sur--centre::before,.cc-sur--centre::after{content:"";display:inline-block;width:36px;height:1px;background:var(--champ);vertical-align:middle;margin:0 14px}

/* En-tête centré */
.cc-ent{background:var(--fond);border-bottom:1px solid var(--ligne)}
.cc-ent__l{display:flex;flex-direction:column;align-items:center;gap:12px;padding-top:22px;padding-bottom:10px}
.cc-logo{display:inline-flex;align-items:center;gap:14px;text-decoration:none;color:var(--encre);margin:0}
.cc-logo__m{font:500 1.6rem/1 var(--titre);text-transform:uppercase;letter-spacing:.32em;margin-right:-.32em}
.cc-logo__d{width:8px;height:8px;border:1px solid var(--champ);transform:rotate(45deg);flex:none}
.cc-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:2px 6px}
.cc-nav a{display:block;padding:8px 12px;color:var(--doux);text-decoration:none;font:400 .76rem/1.2 var(--texte);text-transform:uppercase;letter-spacing:.16em;border-bottom:1px solid transparent}
.cc-nav a:hover{color:var(--encre)}
.cc-nav a[aria-current]{color:var(--encre);border-bottom-color:var(--champ)}
@media (max-width:760px){.cc-ent__l{padding-top:16px;gap:6px}.cc-logo__m{font-size:1.3rem}
 .cc-nav{width:calc(100% + 32px);margin:0 -16px;overflow-x:auto;scrollbar-width:none}.cc-nav ul{flex-wrap:nowrap;justify-content:flex-start;padding:0 8px}.cc-nav a{white-space:nowrap;padding:8px 10px;letter-spacing:.12em}}

/* Héros éditorial centré */
.cc-heros{text-align:center;padding:56px 0 64px;background:radial-gradient(ellipse 60% 70% at 50% 0%,color-mix(in srgb,var(--champ) 14%,transparent),transparent 70%)}
.cc-heros__c{max-width:880px}
.cc-solitaire{display:block;color:var(--champ)}
.cc-heros__ill{width:84px;height:84px;margin:0 auto 18px}
.cc-heros h1{font:400 clamp(2.4rem,6vw,4.4rem)/1.02 var(--titre);letter-spacing:-.01em;margin:0 0 22px;text-wrap:balance}
.cc-chapo{font:400 italic clamp(1.15rem,2.2vw,1.4rem)/1.5 var(--titre);color:var(--doux);margin:0 auto 28px;max-width:34em}
.cc-boutons{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:0 0 36px}
.cc-btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:14px 28px;font:400 .8rem/1.2 var(--texte);text-transform:uppercase;letter-spacing:.2em;text-decoration:none;border-radius:0}
.cc-btn--plein{background:var(--grenat);color:#fff}.cc-btn--plein:hover{background:var(--grenat-f);color:#fff}
.cc-btn--filet{border:1px solid var(--encre);color:var(--encre)}.cc-btn--filet:hover{background:var(--encre);color:var(--fond)}
.cc-releve{display:flex;justify-content:center;flex-wrap:wrap;margin:0 auto 22px;border-top:1px solid var(--ligne);border-bottom:1px solid var(--ligne);max-width:640px}
.cc-releve div{flex:1 1 0;min-width:0;padding:16px 10px}
.cc-releve div + div{border-left:1px solid var(--ligne)}
.cc-releve dt{font:400 .66rem/1.3 var(--texte);text-transform:uppercase;letter-spacing:.2em;color:var(--doux);order:2}
.cc-releve div{display:flex;flex-direction:column-reverse;gap:4px}
.cc-releve dd{margin:0;font:500 clamp(1.6rem,3.4vw,2.2rem)/1 var(--titre);color:var(--encre)}
.cc-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 18px;font-size:.82rem;color:var(--doux)}
.cc-meta p{margin:0}.cc-meta a{color:inherit}
@media (max-width:520px){.cc-heros{padding:36px 0 44px}.cc-heros__ill{width:64px;height:64px}.cc-btn{width:100%}.cc-releve div{padding:12px 4px}}

/* Vitrine */
.cc-vitrine{padding:56px 0 48px;background:var(--papier);border-top:1px solid var(--ligne);border-bottom:1px solid var(--ligne)}
.cc-aff{max-width:720px;margin:0 auto 6px;text-align:center}.cc-aff .aff{margin:0}
.cc-vitrine .selection{margin:18px 0 0}
.cc-vitrine__suite{text-align:center;margin:26px 0 0;font:400 .78rem/1.4 var(--texte);text-transform:uppercase;letter-spacing:.18em}
.cc-vitrine__suite a{color:var(--encre)}

/* Outil de l'accueil */
.cc-outil{padding:64px 0}
.cc-outil__tete{text-align:center;max-width:720px;margin:0 auto 28px}
.cc-outil__tete h2{font:400 clamp(1.9rem,4vw,2.8rem)/1.1 var(--titre);margin:0 0 12px;text-wrap:balance}
.cc-outil__tete p:last-child{color:var(--doux);margin:0}
.cc-outil .outil{max-width:1000px;margin:0 auto}

/* Entrées : sommaire numéroté en chiffres romains */
.cc-entrees{padding:56px 0 24px;border-top:1px solid var(--ligne)}
.cc-sommaire{list-style:none;margin:24px auto 0;padding:0;max-width:900px;border-top:1px solid var(--ligne)}
.cc-sommaire a{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:18px;align-items:baseline;padding:20px 4px;border-bottom:1px solid var(--ligne);text-decoration:none;color:var(--encre);transition:background .2s}
.cc-sommaire a:hover{background:var(--papier)}
.cc-sommaire__n{font:400 italic 1.7rem/1 var(--titre);color:var(--champ-texte);text-align:center}
.cc-sommaire__t strong{display:block;font:500 1.45rem/1.2 var(--titre)}
.cc-sommaire__t span{display:block;color:var(--doux);font-size:.93rem;margin-top:4px}
.cc-sommaire__type{font:400 .66rem/1 var(--texte);text-transform:uppercase;letter-spacing:.2em;color:var(--doux);border:1px solid var(--ligne-f);padding:6px 10px}
@media (max-width:620px){.cc-sommaire a{grid-template-columns:40px minmax(0,1fr);gap:12px;padding:16px 0}.cc-sommaire__type{display:none}.cc-sommaire__n{font-size:1.35rem}}

/* En-tête des pages internes */
.cc-tete{text-align:center;padding:10px 0 34px;border-bottom:1px solid var(--ligne);background:var(--papier)}
.cc-tete .cc-cont{max-width:900px}
.fil{font-size:.76rem;color:var(--doux);margin:0;padding:16px 0 26px;letter-spacing:.04em}.fil a{color:var(--doux)}
.cc-tete h1{font:400 clamp(2rem,5vw,3.4rem)/1.08 var(--titre);margin:0 0 16px;text-wrap:balance}
.cc-tete .cc-chapo{margin-bottom:18px}
.cc-filet{display:block;width:9px;height:9px;border:1px solid var(--champ);transform:rotate(45deg);margin:22px auto 0;position:relative}

/* Texte courant : colonne éditoriale centrée */
.cc-texte{max-width:780px;padding-top:40px}
.cc--accueil .cc-texte{padding-top:56px;border-top:1px solid var(--ligne);max-width:1160px}
.cc--accueil .art{max-width:780px;margin:0 auto}
.art h2{font:400 clamp(1.7rem,3.4vw,2.25rem)/1.15 var(--titre);margin:2.1em 0 .55em;text-wrap:balance}
.art h3{font:500 1.4rem/1.25 var(--titre);margin:1.7em 0 .4em}
.art ul,.art ol{padding-left:1.2em}.art li{margin:.35em 0}.art li::marker{color:var(--champ)}
.art > p:first-of-type:not(.aff):not(.cc-sur)::first-letter{float:left;font:500 3.6em/.82 var(--titre);margin:.06em .1em 0 0;color:var(--grenat-texte)}
.signature,.maj{margin:0}.signature a{color:inherit}
.petit{font-size:.82rem;color:var(--doux)}
.aff{background:var(--aff);border:0;border-top:1px solid var(--champ);border-bottom:1px solid var(--champ);padding:12px 16px;margin:0 0 1.6em;font-size:.84rem;line-height:1.55;color:var(--doux)}
.encadre{border:1px solid var(--ligne-f);outline:1px solid var(--ligne-f);outline-offset:4px;background:var(--papier);padding:16px 22px;margin:2em 4px;text-align:center}
.encadre p{margin:.3em 0}
.ref{font-size:.82rem;color:var(--doux)}
.illu{margin:0 0 1.5rem}.illu img{display:block;width:100%;height:auto;max-height:min(56vw,440px);object-fit:cover}.illu figcaption{font-size:.76rem;color:var(--doux);margin-top:.4rem}

/* Tableaux : filets fins, en-têtes en petites capitales, défilement interne */
table{display:block;overflow-x:auto;max-width:100%;border-collapse:collapse;margin:1.4em 0;font-size:.9rem;-webkit-overflow-scrolling:touch}
th{font:500 .66rem/1.3 var(--texte);text-transform:uppercase;letter-spacing:.14em;color:var(--doux);text-align:left;padding:10px 12px;border-bottom:1px solid var(--champ);vertical-align:bottom}
td{padding:11px 12px;border-bottom:1px solid var(--ligne);vertical-align:top}
tbody tr:hover td{background:var(--papier)}
td .petit{display:block;font-size:.76rem}
.methode-lien{font-size:.76rem;margin:-.6em 0 1.4em;letter-spacing:.04em}.methode-lien a{color:var(--doux)}

/* Boutons marchands */
.btn,.cta{display:flex;align-items:center;justify-content:center;gap:10px;background:var(--grenat);color:#fff;text-decoration:none;font:400 .78rem/1.25 var(--texte);text-transform:uppercase;letter-spacing:.16em;padding:14px 18px;min-height:48px;border-radius:0;text-align:center;transition:background .2s}
.btn{display:inline-flex}
.btn:hover,.cta:hover{background:var(--grenat-f);color:#fff}
.cta--petit,.cta--tab{display:inline-flex;min-height:0;white-space:nowrap;background:transparent;color:var(--grenat-texte);border:1px solid currentColor;padding:7px 11px;font-size:.66rem;letter-spacing:.12em}
.cta--tab:hover,.cta--petit:hover{background:var(--grenat);border-color:var(--grenat);color:#fff}

/* Outils */
.outil{background:var(--papier);border:1px solid var(--ligne-f);padding:22px 24px 24px;margin:1.6em 0;position:relative}
.outil::before{content:"";position:absolute;inset:5px;border:1px solid var(--ligne);pointer-events:none}
.outil > *{position:relative}
.outil label{display:block;font:400 .68rem/1.3 var(--texte);text-transform:uppercase;letter-spacing:.18em;color:var(--doux);margin:1em 0 .45em}
.outil label:has(input[type=checkbox]){display:flex;align-items:center;gap:10px;font-size:.95rem;text-transform:none;letter-spacing:0;color:var(--encre)}
.outil input,.outil select{width:100%;min-height:48px;padding:10px 12px;font:400 1.02rem/1.2 var(--texte);color:var(--encre);background:var(--fond);border:0;border-bottom:1px solid var(--encre);border-radius:0}
.outil input[type=number]{font:500 1.35rem/1 var(--titre)}
.outil input:focus,.outil select:focus{outline:0;border-bottom:2px solid var(--grenat-texte)}
.outil input[type=checkbox]{width:18px;height:18px;min-height:0;accent-color:var(--grenat)}
.res{margin-top:22px;padding-top:18px;border-top:1px solid var(--champ)}
.res p{margin:.4em 0}
.res__top{font:400 1.2rem/1.4 var(--titre)}
.gros{font:500 clamp(2rem,5vw,2.8rem)/1 var(--titre);color:var(--grenat-texte);margin:0 .1em}
.res table{font-size:.86rem}
@media (min-width:860px){
 .cc-outil .outil{display:grid;grid-template-columns:1.1fr 1fr 1fr 1fr;column-gap:22px;align-items:end}
 .cc-outil .outil > *{grid-column:1 / -1}
 .cc-outil .outil > label[for=budget]{grid-column:1;grid-row:1}.cc-outil .outil > #budget{grid-column:1;grid-row:2}
 .cc-outil .outil > label[for=type]{grid-column:2;grid-row:1}.cc-outil .outil > #type{grid-column:2;grid-row:2}
 .cc-outil .outil > label[for=forme]{grid-column:3;grid-row:1}.cc-outil .outil > #forme{grid-column:3;grid-row:2}
 .cc-outil .outil > label:has(#or18){grid-column:4;grid-row:2;align-self:center;margin:0;font-size:.88rem;line-height:1.3}}

/* FAQ, sommaire, à lire aussi */
details{border-bottom:1px solid var(--ligne)}
summary{cursor:pointer;list-style:none;position:relative;padding:16px 34px 16px 0;font:500 1.22rem/1.35 var(--titre)}
summary::-webkit-details-marker{display:none}
summary::after{content:"";position:absolute;right:8px;top:24px;width:7px;height:7px;border:1px solid var(--champ);transform:rotate(45deg);transition:background .2s}
details[open] summary::after{background:var(--champ)}
details p{margin:0 0 16px}
.faq{margin-top:2.4em}
.sommaire{border-top:1px solid var(--ligne);border-bottom:1px solid var(--ligne);margin:1.6em 0}
.sommaire summary{font-size:1.1rem}
.sommaire ol{margin:0 0 14px;padding-left:1.6em}
h2[id]{scroll-margin-top:12px}
.cartes{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1px;background:var(--ligne);border:1px solid var(--ligne)}
.cartes a{display:block;height:100%;background:var(--fond);padding:18px;text-decoration:none;color:var(--encre)}
.cartes a:hover{background:var(--papier)}
.cartes strong{display:block;font:500 1.25rem/1.2 var(--titre)}
.cartes span{display:block;color:var(--doux);font-size:.88rem;margin-top:6px}
.suite{margin-top:3em}
.suite h2{text-align:center}

/* Sélection et écrins */
.selection{margin:1.6em 0 2em}
.selection__tete{text-align:center;max-width:680px;margin:0 auto 22px}
.selection__titre{font:400 clamp(1.8rem,3.6vw,2.5rem)/1.12 var(--titre);margin:0 0 8px}
.selection__intro{color:var(--doux);margin:0}
.selection__grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.selection__note{font-size:.8rem;color:var(--doux);text-align:center;max-width:720px;margin:20px auto 4px}
.selection__meth{text-align:center;margin:0}
.prod{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0;background:var(--papier);border:1px solid var(--ligne-f);padding:26px 22px 22px;margin:1.4em 0;position:relative}
.prod::before{content:"";position:absolute;inset:5px;border:1px solid var(--ligne);pointer-events:none}
.prod > *{position:relative;max-width:100%}
.selection .prod{margin:0}
.prod--un{border-color:var(--champ)}
.prod__rang{margin:0 0 6px;font:400 italic 2.2rem/1 var(--titre);color:var(--champ-texte)}
.prod__badge{margin:0 0 14px;font:400 .66rem/1.4 var(--texte);text-transform:uppercase;letter-spacing:.2em;color:var(--grenat-texte)}
.prod__img{max-height:170px;object-fit:contain;margin:0 0 12px}
.prod__marque{margin:0;font:400 .7rem/1.3 var(--texte);text-transform:uppercase;letter-spacing:.18em;color:var(--doux)}
.prod__nom{margin:4px 0 10px;font:500 1.35rem/1.2 var(--titre);text-wrap:balance}
.prod__pourquoi{margin:0 0 14px;font-size:.9rem;color:var(--doux);line-height:1.55}
.prod__caracs{width:100%;margin:0 0 14px;font-size:.82rem;border-top:1px solid var(--ligne)}
.prod__caracs div{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid var(--ligne);text-align:left}
.prod__caracs dt{color:var(--doux);flex:none;max-width:45%}.prod__caracs dd{margin:0;text-align:right;overflow-wrap:anywhere}
.prod__pm{width:100%;text-align:left;font-size:.86rem;margin:0 0 12px}.prod__pm ul{list-style:none;margin:0;padding:0}
.prod__pm li{position:relative;padding-left:1.2em;margin:.2em 0}.prod__pm li::before{position:absolute;left:0}
.prod__plus li::before{content:"+";color:var(--ok)}.prod__moins li::before{content:"\2212";color:var(--ko)}
.prod__achat{margin-top:auto;width:100%}
.prod__prix{margin:0 0 12px;line-height:1.2}.prod__prix strong{font:500 2rem/1.1 var(--titre)}
.prod__prix s{color:var(--doux);margin-left:.4em}
.prod__prix span{display:block;color:var(--doux);font-size:.72rem;margin-top:4px}
.verdict{border-top:1px solid var(--champ);border-bottom:1px solid var(--champ);padding:6px 0 16px;margin:2.4em 0 1em}
.verdict h2{margin-top:.6em}.verdict__liste{list-style:none;margin:0;padding:0}
.verdict__liste li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid var(--ligne)}
.collant{display:none}
@media (max-width:760px){
.collant.vu{display:flex;align-items:center;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--papier);border-top:1px solid var(--champ);box-shadow:0 -6px 18px rgba(0,0,0,.1);padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
.collant__txt{flex:1;min-width:0;line-height:1.25}.collant__txt strong,.collant__txt span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.collant__txt strong{font:500 1.05rem/1.2 var(--titre)}.collant__txt span{font-size:.74rem;color:var(--doux)}
.cta--collant{flex:none;width:auto;min-height:44px;padding:10px 14px;font-size:.68rem}
.collant__x{flex:none;background:none;border:0;color:var(--doux);font-size:1.4rem;line-height:1;padding:6px;cursor:pointer}
body.a-collant{padding-bottom:80px}}

/* Pied de page centré, nuit */
.cc-pied{background:var(--nuit);color:var(--sur-nuit-doux);text-align:center;padding:56px 0 36px;margin-top:72px;font-size:.88rem}
.cc-pied__ill{width:46px;height:46px;margin:0 auto 14px;color:var(--champ)}
.cc-logo--pied{color:var(--sur-nuit);justify-content:center}
.cc-pied__acc{max-width:34em;margin:14px auto 22px;font:400 italic 1.12rem/1.5 var(--titre);color:var(--sur-nuit)}
.cc-pied__nav ul{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:4px 22px}
.cc-pied__nav a{color:var(--sur-nuit);text-decoration:none;font-size:.74rem;text-transform:uppercase;letter-spacing:.16em}
.cc-pied__liens{margin:0 0 10px;padding-top:20px;border-top:1px solid #3a3236;max-width:820px;margin-left:auto;margin-right:auto}
.cc-pied__liens a{color:var(--sur-nuit-doux)}.cc-pied__liens span{color:var(--champ);font-size:.6rem;margin:0 8px;vertical-align:.15em}
.cc-pied .petit{color:var(--sur-nuit-doux);margin:0}
.cc-pied a:hover{color:#fff}

/* Mobile : écrins en carrousel à défilement, tableaux qui défilent plutôt que des colonnes écrasées */
@media (max-width:700px){
.selection__grille{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin:0 -16px;padding:0 16px 10px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.selection__grille .prod{flex:0 0 86%;scroll-snap-align:center}
.selection__grille--1 .prod{flex-basis:100%}
th,td{min-width:8.5em}th:first-child,td:first-child{min-width:6.5em}
table{border-right:1px solid var(--ligne)}}
