/* Composant « nuancier » extrait du systeme de design Decical. */
.nuancier{margin-top:12px;border-top:1px solid var(--trait)}
.nua-axe{display:grid;grid-template-columns:minmax(150px,1.1fr) 3fr;
 border-bottom:1px solid var(--trait)}
.nua-axe .l{font-family:var(--mono);font-size:10px;letter-spacing:.16em;
 text-transform:uppercase;color:var(--gris);padding:12px 20px 12px 0}
.nua-axe .g{display:flex;position:relative}
.nua-axe .g span{flex:1;font-family:var(--mono);font-size:10px;color:var(--gris);
 padding:12px 0 12px 7px;border-left:1px solid var(--trait)}
.nua-l{display:grid;grid-template-columns:minmax(150px,1.1fr) 3fr;
 align-items:center;border-bottom:1px solid var(--trait)}
.nua-l .n{padding:16px 20px 16px 0;font-size:15px;font-weight:600;line-height:1.3}
.nua-l .n a{color:inherit;text-decoration:none;border-bottom:1px solid transparent}
.nua-l .n a:hover{color:var(--olive);border-bottom-color:var(--olive)}
.nua-l .p{position:relative;height:56px;display:flex;align-items:center}
.nua-l .p::before{content:"";position:absolute;inset:0;
 background:repeating-linear-gradient(to right,var(--trait) 0 1px,transparent 1px 20%)}
.nua-l .b{position:absolute;height:14px;border-radius:var(--r-pill);
 background:var(--trait)}
.nua-l .v{position:absolute;font-family:var(--mono);font-size:10.5px;
 letter-spacing:.08em;color:var(--gris);white-space:nowrap;top:7px}
.nua-l.vous{background:var(--olive-p)}
.nua-l.vous .n{font-weight:800}
.nua-l.vous .b{background:linear-gradient(to right,var(--olive),var(--lime));
 height:18px;box-shadow:0 4px 14px rgba(78,129,0,.26)}
.nua-l.vous .v{color:var(--olive-t);font-weight:700}
.nua-l .cas{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;
 color:var(--gris);padding-left:8px;position:relative;z-index:1}
.nua-leg{margin-top:16px;font-size:13.5px;color:var(--gris);max-width:72ch}
@media(max-width:820px){

 .nua-axe,.nua-l{grid-template-columns:1fr}

 .nua-axe .l{padding-bottom:6px}

 .nua-axe .g{display:none}

 .nua-l .n{padding:14px 0 0}

 .nua-l .p{height:44px}}
