/* Yodriv · site v5 · « La confiance » (06) : ce que Yodriv ne fait jamais (écritures barrées), puis un classeur à tiroirs à essayer. Fond blanc. Les règles viennent du logiciel. */
.cf-jam{display:grid;margin-top:28px}
.cf-ligne{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(20px,3vw,34px) 0;border-top:1px solid var(--border-subtle)}
.cf-ligne:nth-child(even){grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)}.cf-ligne:nth-child(even) .cf-txt{order:2}
.cf-txt h3{margin:0;font:800 clamp(34px,5vw,68px)/1 Lexend;letter-spacing:-.05em}
.cf-txt h3 s{position:relative;display:inline-block;text-decoration:none;color:var(--status-danger)}
.cf-txt h3 s::after{content:"";position:absolute;left:-2%;right:-2%;top:54%;height:.11em;border-radius:99px;background:var(--status-danger);transform:rotate(-2deg) scaleX(0);transform-origin:left;transition:transform .7s .35s var(--sortie)}
.cf-ligne.vu s::after,.js .cf-ligne:not(.reveler) s::after{transform:rotate(-2deg) scaleX(1)}
.cf-txt p{margin:16px 0 0;max-width:34ch;font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:var(--text-secondary)}
.cf-carte{position:relative;padding:20px;border-radius:26px;background:#fff;box-shadow:0 0 0 1px var(--border-subtle),var(--shadow-card)}
.cf-tete{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.cf-tete img{flex:none;border-radius:50%;background:var(--brand-primarySoft)}
.cf-tete span{display:grid}.cf-tete b{font:800 18px/1.1 Lexend}.cf-tete small{font:500 14px Lexend;color:var(--text-secondary)}
.cf-lig{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px;padding:12px 14px;border-radius:16px;background:var(--surface-page);font:600 15px Lexend}
.cf-lig small{font:500 13px Lexend;color:var(--text-secondary)}
.cf-flou{filter:blur(7px);user-select:none}
.cf-verrou,.cf-ok{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:99px;font:700 13px Lexend}
.cf-verrou{background:var(--border-subtle)}.cf-ok{background:var(--status-successSoft);color:var(--status-success)}
.cf-verrou svg,.cf-ok svg,.cf-cle svg,.cf-cad svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.cf-pile{position:relative;height:215px}
.cf-pile .cf-carte{position:absolute;left:0;right:0;padding:16px}
.cf-pile .cf-carte:nth-child(1){top:0;transform:rotate(-4deg) scale(.92);opacity:.55}.cf-pile .cf-carte:nth-child(2){top:34px;transform:rotate(3deg) scale(.96);opacity:.8}.cf-pile .cf-carte:nth-child(3){top:70px;z-index:2}
.cf-cad{position:absolute;z-index:3;left:50%;top:60%;display:grid;place-items:center;width:62px;height:62px;margin:-31px 0 0 -31px;border-radius:50%;background:var(--text-primary);color:#fff}
.cf-cad svg{width:26px;height:26px;stroke-width:2.2}
.cf-jrn{display:grid;gap:8px}.cf-jrn div{display:flex;align-items:center;gap:10px;font:500 15px Lexend;color:var(--text-secondary)}.cf-jrn b{color:var(--text-primary)}.cf-jrn time{margin-left:auto;font:600 13px Lexend}.cf-jrn i{flex:none;width:9px;height:9px;border-radius:50%;background:#22A06B}

/* Les démonstrations : un interrupteur, des tiroirs, un bouton qui ajoute une ligne au journal */
.cf-bascule{display:inline-flex;justify-self:start;gap:4px;padding:4px;border-radius:99px;background:var(--surface-page);box-shadow:inset 0 0 0 1px var(--border-subtle)}
.cf-bascule button{display:inline-flex;align-items:center;gap:8px;padding:5px 16px 5px 5px;border:0;border-radius:99px;background:transparent;font:700 14.5px Lexend;color:var(--text-primary);cursor:pointer;transition:background var(--duration-normal),color var(--duration-normal)}
.cf-bascule button img{border-radius:50%;background:#fff}
.cf-bascule button[aria-pressed="true"]{background:var(--brand-primary);color:#fff;box-shadow:var(--shadow-saphir)}
.cf-bascule button:focus-visible,.cf-ouvrir:focus-visible,.cf-tiroir:focus-visible{outline:3px solid var(--focus-light);outline-offset:3px}
.cf-pay{position:relative}.cf-pay .cf-val{transition:filter .45s var(--sortie)}
.cf-pay .cf-b-m{display:none}
.cf-carte.masque .cf-pay .cf-val{filter:blur(7px);user-select:none}
.cf-carte.masque .cf-pay .cf-b-v{display:none}.cf-carte.masque .cf-pay .cf-b-m{display:inline-flex;animation:cf-saut .45s var(--ressort)}
@keyframes cf-saut{from{transform:scale(.6);opacity:0}}
.cf-armoire{display:grid;gap:10px;padding:14px;border-radius:26px;background:linear-gradient(#fff,#EEF2F8);box-shadow:0 0 0 1px var(--border-subtle),0 30px 50px -36px rgb(23 43 70 / .45)}
.cf-tiroir{display:flex;align-items:center;gap:12px;min-height:58px;padding:8px 14px;border:0;border-radius:16px;background:#fff;text-align:left;cursor:pointer;box-shadow:0 0 0 1px var(--border-subtle),0 8px 14px -10px rgb(23 43 70 / .35);transition:transform .45s var(--ressort),box-shadow .3s}
.cf-tiroir>span:nth-child(2){display:grid;flex:1;min-width:0}.cf-tiroir b{font:800 15.5px/1.15 Lexend;letter-spacing:-.02em}.cf-tiroir small{font:500 13px Lexend;color:var(--text-secondary)}
.cf-tiroir>i{flex:none;width:44px;height:14px;border-radius:99px;background:linear-gradient(#D6DEE9,#B7C3D3);box-shadow:inset 0 2px 3px rgb(255 255 255 / .8)}
.cf-cle{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:50%;background:var(--surface-page);color:var(--text-secondary)}
.cf-cle svg{width:18px;height:18px}
.cf-tiroir.ouvert{transform:translateY(-3px);box-shadow:0 0 0 2px var(--brand-primary),0 16px 24px -14px rgb(36 87 167 / .5)}
.cf-tiroir.ouvert .cf-cle{background:var(--status-successSoft);color:var(--status-success)}
.cf-eleves{display:flex;flex:none}.cf-eleves img{margin-left:-8px;border-radius:50%;background:var(--brand-primarySoft);box-shadow:0 0 0 2px #fff}.cf-eleves img:first-child{margin-left:0}
.cf-tiroir.secoue{animation:cf-sec .4s}
@keyframes cf-sec{20%,60%{transform:translateX(-8px)}40%,80%{transform:translateX(8px)}}
.cf-msg{min-height:24px;margin:2px 0 0;padding-left:6px;font:700 15px Lexend;color:var(--status-danger)}
.cf-ouvrir{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:11px 20px;border:0;border-radius:99px;background:var(--brand-primary);color:#fff;font:700 15px Lexend;cursor:pointer;box-shadow:var(--shadow-saphir);transition:transform var(--duration-normal) var(--ressort)}
.cf-ouvrir:hover{transform:translateY(-2px)}.cf-ouvrir svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.cf-jrn .nouveau{animation:cf-nouveau .6s var(--ressort);padding:6px 10px;margin:0 -10px;border-radius:12px;background:var(--brand-primarySoft)}
@keyframes cf-nouveau{from{opacity:0;transform:translateY(-10px) scale(.96)}}

.cf-garanties{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.cf-garanties li{display:flex;align-items:center;gap:10px;padding:8px 18px 8px 8px;border-radius:99px;background:#fff;box-shadow:inset 0 0 0 1px var(--border-subtle);font:600 15px/1.3 Lexend;color:var(--text-primary)}
.cf-garanties svg{flex:none;width:18px;height:18px;padding:7px;box-sizing:content-box;border-radius:50%;background:var(--brand-primary);color:#fff;fill:none;stroke:currentColor}
@media (max-width:1100px){.cf-essai{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.cf-essai-txt{grid-column:1/-1}}
@media (max-width:860px){.cf-ligne,.cf-ligne:nth-child(even){grid-template-columns:minmax(0,1fr)}.cf-ligne:nth-child(even) .cf-txt{order:0}}

@media (prefers-reduced-motion:reduce){.cf-txt h3 s::after{transition:none;transform:rotate(-2deg) scaleX(1)}.cf-tiroir.secoue,.cf-carte.masque .cf-b-m,.cf-jrn .nouveau{animation:none}}

/* Chaque image dit ce qu'elle montre */
.cf-visuel{display:grid;gap:10px}
.cf-legende{margin:0;padding-left:6px;font:700 13.5px/1.3 Lexend;letter-spacing:.01em;color:var(--brand-primary)}
.cf-ferme{padding:20px}
.cf-ferme .cf-cad{top:55%}