/* Scène Lockin : l'identité du produit (crème, encre, corail, Inter). Tout est proportionné par --u (image) et --r (loupe). */
@font-face{font-family:"Inter";src:url("../assets/fonts/Inter-latin.woff2") format("woff2");font-weight:100 900;font-display:swap}
.ll{position:absolute;inset:0;overflow:hidden;isolation:isolate;background:#faf9f6;color:#252a27;font-family:Inter,"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased;--u:1px;--r:1px;--corail:#c74630;--gris:#68726b;--trait:#1c1a18;font-synthesis:none}
.ll p,.ll h2,.ll ul{margin:0;padding:0}
.ll-mur{position:absolute;left:0;top:0;opacity:0;will-change:transform,opacity;z-index:0}
.ll-voile{position:absolute;left:0;right:0;top:0;height:calc(var(--u)*220);background:linear-gradient(180deg,#faf9f6f5 0 52%,#faf9f600 100%);z-index:1;pointer-events:none}
.ll-nappe{position:absolute;left:50%;top:44%;width:calc(var(--u)*1500);height:calc(var(--u)*620);margin:calc(var(--u)*-310) 0 0 calc(var(--u)*-750);background:radial-gradient(closest-side,#faf9f6f2 40%,#faf9f600 100%);z-index:1;pointer-events:none}
.ll-clair{position:absolute;left:0;top:0;width:512px;height:512px;margin:-256px;border-radius:50%;background:radial-gradient(closest-side,#faf9f6 0 88%,#faf9f600 100%);will-change:transform;z-index:2;pointer-events:none}
.ll-ombre{position:absolute;left:0;top:0;border-radius:50%;background:radial-gradient(closest-side,#3a241a42 0 58%,#3a241a00 100%);will-change:transform;z-index:3;pointer-events:none}
.ll-verre{position:absolute;left:0;top:0;will-change:transform;z-index:4;pointer-events:none}
.ll-loupe{position:absolute;left:0;top:0;width:0;height:0;will-change:transform;z-index:5}
.ll-monture{position:absolute;left:calc(var(--r)*-400);top:calc(var(--r)*-400);width:calc(var(--r)*800);height:calc(var(--r)*800);overflow:visible;pointer-events:none}
.ll-prise{position:absolute;left:calc(var(--r)*-330);top:calc(var(--r)*-330);width:calc(var(--r)*660);height:calc(var(--r)*660);border-radius:50%;cursor:grab}
.ll-prise:active{cursor:grabbing}
.ll-manche{-webkit-appearance:none;appearance:none;position:absolute;left:calc(var(--r)*253);top:calc(var(--r)*168);width:calc(var(--r)*640);height:calc(var(--r)*88);transform-origin:0 50%;transform:rotate(40deg);border:calc(var(--r)*5.5) solid var(--trait);border-radius:0 calc(var(--r)*46) calc(var(--r)*46) 0;background:linear-gradient(180deg,#e0634a 0,#c74630 40%,#96301f 100%);display:flex;align-items:center;padding:0 0 0 calc(var(--r)*72);color:#fff6ec;font:620 calc(var(--r)*31)/1 Inter,"Helvetica Neue",Arial,sans-serif;letter-spacing:-.018em;cursor:grab;white-space:nowrap}
.ll-manche::before{content:"";position:absolute;left:0;top:calc(var(--r)*-5.5);bottom:calc(var(--r)*-5.5);width:calc(var(--r)*44);background:linear-gradient(180deg,#494644,#1c1a18);border-right:calc(var(--r)*5.5) solid var(--trait)}
.ll-manche:disabled{cursor:default}
.ll-manche:focus-visible,.ll-stop:focus-visible,.ll-fin__a a:focus-visible{outline:2px solid #252a27;outline-offset:3px}

.ll-tete{position:absolute;left:clamp(14px,calc(var(--u)*56),56px);right:clamp(14px,calc(var(--u)*56),56px);top:clamp(10px,calc(var(--u)*40),40px);display:flex;justify-content:space-between;align-items:flex-start;opacity:0;z-index:30;pointer-events:none}
.ll-logo{display:flex;align-items:center;gap:calc(var(--u)*13);font-size:clamp(19px,calc(var(--u)*34),34px);font-weight:500;letter-spacing:-.025em;line-height:1}
.ll-logo svg{width:clamp(17px,calc(var(--u)*30),30px);height:clamp(15px,calc(var(--u)*27),27px);overflow:visible}
.ll-droite{display:flex;flex-direction:column;align-items:flex-end;gap:7px}
.ll-etapes{position:relative;display:block;width:190px;height:13px}
.ll-etape{position:absolute;right:0;top:0;font-size:13px;line-height:1;font-weight:600;letter-spacing:.14em;white-space:pre;opacity:0}
.ll-pied{font-size:clamp(9px,calc(var(--u)*13),13px);line-height:1;font-weight:600;letter-spacing:.15em;color:var(--gris)}

.ll-couv,.ll-acc{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 5vw;z-index:9;pointer-events:none}
.ll-couv__m{display:flex;align-items:center;gap:calc(var(--u)*26);font-size:clamp(64px,calc(var(--u)*150),150px);font-weight:500;letter-spacing:-.035em;line-height:1}
.ll-couv__m svg{width:calc(var(--u)*118);height:calc(var(--u)*104);min-width:50px;min-height:44px;overflow:visible}
.ll-couv__s{font-size:clamp(17px,calc(var(--u)*32),32px);font-weight:500;color:var(--gris);margin-top:calc(var(--u)*20)!important}
.ll-couv i{position:absolute;left:50%;top:calc(50% + var(--u)*104);width:calc(var(--u)*120);height:3px;background:var(--corail);transform-origin:0 50%}
.ll-acc p{opacity:0}
.ll-acc__a,.ll-acc__b{font-size:clamp(34px,calc(var(--u)*98),98px);font-weight:640;letter-spacing:-.035em;line-height:1.08}
.ll-acc__a{color:#8a938c}
.ll-acc__c{font-size:clamp(14px,calc(var(--u)*25),25px);font-weight:500;color:var(--gris);line-height:1.4;max-width:calc(var(--u)*900);margin-top:calc(var(--u)*30)!important}

.ll-dem{position:absolute;left:0;right:0;top:33%;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 16px;z-index:9;pointer-events:none}
.ll-q{font-size:clamp(30px,calc(var(--u)*92),92px);font-weight:640;letter-spacing:-.035em;line-height:1.06;transform-origin:50% 0;min-height:1.06em}
.ll-caret{display:inline-block;width:calc(var(--u)*6);min-width:3px;height:.84em;margin-left:calc(var(--u)*6);background:var(--corail);vertical-align:-.1em}
.ll-pack{font-size:clamp(15px,calc(var(--u)*28),28px);font-weight:500;color:#3b423d;margin-top:calc(var(--u)*30)!important}
.ll-pack b{font-weight:680;color:var(--corail)}
.ll-note{font-size:clamp(12px,calc(var(--u)*19),19px);font-weight:500;color:var(--gris);margin-top:calc(var(--u)*9)!important}
.ll-lancer{display:inline-block;margin-top:calc(var(--u)*30);padding:calc(var(--u)*17) calc(var(--u)*44);border-radius:calc(var(--u)*14);background:var(--corail);color:#fff;font-size:clamp(15px,calc(var(--u)*26),26px);font-weight:640;letter-spacing:-.01em}
.ll-public{font-size:clamp(13px,calc(var(--u)*22),22px);font-weight:520;color:var(--gris);margin-top:calc(var(--u)*24)!important}

.ll-flanc{position:absolute;font-size:calc(var(--u)*84);font-weight:640;letter-spacing:-.035em;line-height:1.02;z-index:7;pointer-events:none;opacity:0;text-shadow:0 0 calc(var(--u)*34) #faf9f6,0 0 calc(var(--u)*14) #faf9f6}
.ll-flanc--g{text-align:right}
.ll-m{display:block;overflow:hidden;padding:.06em .1em .16em;margin:-.06em -.1em -.16em}
.ll-m>span{display:block;will-change:transform}
.ll-corail{color:var(--corail)}
.ll-ligne{display:none;position:absolute;left:0;right:0;text-align:center;font-size:calc(var(--u)*46);font-weight:640;letter-spacing:-.03em;line-height:1.1;z-index:7;pointer-events:none;opacity:0}
.ll-conseil{position:absolute;font-size:clamp(13px,calc(var(--u)*23),23px);font-weight:500;color:var(--gris);line-height:1.3;width:calc(var(--u)*430);z-index:7;pointer-events:none;text-shadow:0 0 calc(var(--u)*16) #faf9f6;opacity:0}
.ll-mes{position:absolute;z-index:7;pointer-events:none;text-shadow:0 0 12px #faf9f6;width:calc(var(--u)*230);opacity:0;will-change:transform}
.ll-mes b{display:block;font-size:calc(var(--u)*50);font-weight:640;letter-spacing:-.035em;font-variant-numeric:tabular-nums;line-height:1}
.ll-mes b em{font-style:normal;color:var(--corail)}
.ll-mes span{display:block;font-size:clamp(11px,calc(var(--u)*17.5),17.5px);font-weight:540;color:var(--gris);margin-top:calc(var(--u)*8);line-height:1.2}
.ll-mes--t{text-align:right;transform-origin:100% 0}
.ll-mes--a{transform-origin:0 0}
.ll-statut{position:absolute;left:50%;transform:translateX(-50%);font-size:clamp(11px,calc(var(--u)*16),16px);font-weight:640;letter-spacing:.11em;text-transform:uppercase;color:var(--corail);white-space:nowrap;z-index:7;pointer-events:none;opacity:0}
.ll-explic{position:absolute;left:50%;transform:translateX(-50%);width:min(calc(var(--u)*760),calc(100% - 32px));text-align:center;font-size:clamp(13px,calc(var(--u)*20),20px);font-weight:500;color:#4c544e;line-height:1.3;z-index:7;pointer-events:none;opacity:0}
.ll-stop{-webkit-appearance:none;appearance:none;display:none;position:absolute;left:12px;bottom:6px;padding:7px 12px;border:0;border-radius:6px;background:var(--corail);color:#fff;font:640 12.5px/1.2 Inter,Arial,sans-serif;z-index:40}

.ll-fiche{position:absolute;left:0;top:0;background:#fff;border:1px solid #e3e6df;border-radius:calc(var(--u)*14);padding:calc(var(--u)*17) calc(var(--u)*21);box-shadow:0 calc(var(--u)*12) calc(var(--u)*30) #303b2922;will-change:transform;pointer-events:none;transform-origin:50% 50%}
.ll-fiche small{display:block;font-size:calc(var(--u)*15);font-weight:560;color:var(--gris);line-height:1.2}
.ll-fiche b{display:block;font-size:calc(var(--u)*25);font-weight:640;letter-spacing:-.022em;margin-top:calc(var(--u)*3);line-height:1.2}
.ll-fiche i{position:absolute;right:calc(var(--u)*18);top:calc(var(--u)*17);font-style:normal;font-size:calc(var(--u)*14.5);font-weight:640;color:var(--corail);display:flex;align-items:center;gap:calc(var(--u)*6)}
.ll-fiche i svg{width:calc(var(--u)*15);height:calc(var(--u)*15)}
.ll-masc{position:absolute;left:0;top:0;opacity:0;will-change:transform;pointer-events:none;user-select:none;filter:drop-shadow(0 7px 8px #3a241a2e)}
.ll-masc--assise{z-index:19;width:auto}
.ll-masc--prete{z-index:24}
.ll-masc--clin{z-index:24}

.ll-titre{position:absolute;left:0;right:0;top:calc(var(--u)*90);text-align:center;font-size:calc(var(--u)*72);font-weight:640;letter-spacing:-.035em;line-height:1.02;z-index:8;pointer-events:none;opacity:0}
.ll-page{position:absolute;left:0;top:0;width:min(calc(var(--u)*1100),calc(100% - 24px));background:#fff;border:1px solid #e3e6df;border-radius:calc(var(--u)*22);padding:calc(var(--u)*42) calc(var(--u)*56) calc(var(--u)*38);box-shadow:0 calc(var(--u)*18) calc(var(--u)*50) #303b2914;z-index:8;opacity:0;will-change:transform,opacity}
.ll-vide{display:none;font-size:calc(var(--u)*34);font-weight:600;letter-spacing:-.02em;margin-top:calc(var(--u)*12)!important}
.ll-page.est-vide>*:not(.ll-vide):not(.ll-sur){display:none}
.ll-page.est-vide .ll-vide{display:block}
.ll-sur{font-size:calc(var(--u)*15);font-weight:660;letter-spacing:.09em;color:var(--gris)}
.ll-page h2{font-size:calc(var(--u)*54);font-weight:660;letter-spacing:-.032em;line-height:1.08;margin:calc(var(--u)*10) 0 calc(var(--u)*20)!important}
.ll-rub{font-size:calc(var(--u)*23);font-weight:660;letter-spacing:-.012em;color:var(--corail);margin-top:calc(var(--u)*18)!important}
.ll-lab{font-size:calc(var(--u)*17);font-weight:640;color:var(--gris);margin-top:calc(var(--u)*11)!important}
.ll-page ul{list-style:none;margin-top:calc(var(--u)*5)!important}
.ll-page li{font-size:calc(var(--u)*24);font-weight:500;line-height:1.36;letter-spacing:-.008em}
.ll-page li sup{color:var(--corail);font-size:.72em;font-weight:720;vertical-align:.3em;line-height:0}
.ll-txt{font-size:calc(var(--u)*24);font-weight:500;line-height:1.36;letter-spacing:-.008em;margin-top:calc(var(--u)*4)!important}
.ll-src{font-size:calc(var(--u)*16.5);font-weight:540;color:var(--gris);margin-top:calc(var(--u)*18)!important}

.ll-fin{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 16px;z-index:22}
.ll-fin p{opacity:0}
.ll-fin__m{display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*18);font-size:clamp(46px,calc(var(--u)*104),104px);font-weight:500;letter-spacing:-.035em;line-height:1}
.ll-fin__m svg{width:calc(var(--u)*82);height:calc(var(--u)*72);min-width:36px;min-height:32px;overflow:visible}
.ll-fin__d{font-size:clamp(20px,calc(var(--u)*40),40px);font-weight:600;letter-spacing:-.025em;margin-top:calc(var(--u)*14)!important}
.ll-fin__p{font-size:clamp(13px,calc(var(--u)*21),21px);font-weight:640;color:var(--corail);margin-top:calc(var(--u)*30)!important}
.ll-fin__c{font-size:clamp(16px,calc(var(--u)*29),29px);font-weight:620;letter-spacing:-.016em;margin-top:calc(var(--u)*10)!important}
.ll-fin__r{font-size:clamp(13px,calc(var(--u)*20),20px);font-weight:480;line-height:1.42;color:#4c544e;max-width:calc(var(--u)*840);margin-top:calc(var(--u)*12)!important}
.ll-fin__l{color:var(--gris);font-size:clamp(12px,calc(var(--u)*17.5),17.5px)}
.ll-fin__a{display:flex;gap:calc(var(--u)*18);margin-top:calc(var(--u)*26)!important}
.ll-fin__a a{padding:calc(var(--u)*13) calc(var(--u)*26);min-height:40px;display:inline-flex;align-items:center;border-radius:calc(var(--u)*12);border:1.5px solid #252a27;color:#252a27;text-decoration:none;font-size:clamp(13.5px,calc(var(--u)*20),20px);font-weight:620}
.ll-fin__a a:first-child{background:var(--corail);border-color:var(--corail);color:#fff}

/* Téléphone debout : une seule colonne, la loupe au centre, le manche sans texte, un bouton dédié pour l'arrêt. */
.ll.est-haut .ll-flanc{display:none}
.ll.est-haut .ll-ligne{display:block}
.ll.est-haut .ll-conseil{width:100%;text-align:center;font-size:13px}
.ll.est-haut [data-r="conseil"]{display:none}
.ll.est-haut .ll-ligne{font-size:21px;padding:0 12px}
.ll.est-haut .ll-manche{pointer-events:none}
.ll.est-haut .ll-manche span{visibility:hidden}
.ll.est-haut .ll-prise{display:none}
.ll.est-haut .ll-stop{display:block}
.ll.est-haut .ll-mes{width:auto}
.ll.est-haut .ll-mes b{font-size:23px}
.ll.est-haut .ll-mes span{font-size:10px;width:76px;margin-top:1px}
.ll.est-haut .ll-q{font-size:34px}
.ll.est-haut .ll-page{padding:16px 16px 14px;border-radius:14px}
.ll.est-haut .ll-sur{font-size:10px}
.ll.est-haut .ll-page h2{font-size:24px;margin:4px 0 8px!important}
.ll.est-haut .ll-rub{font-size:14px;margin-top:10px!important}
.ll.est-haut .ll-lab{font-size:12px;margin-top:6px!important}
.ll.est-haut .ll-page li,.ll.est-haut .ll-txt{font-size:13.5px;line-height:1.34}
.ll.est-haut .ll-src{font-size:11.5px;margin-top:10px!important}
.ll.est-haut .ll-titre{top:62px;font-size:26px}
.ll.est-haut .ll-fiche{padding:7px 11px;border-radius:9px}
.ll.est-haut .ll-fiche small{font-size:10px}
.ll.est-haut .ll-fiche b{font-size:13.5px;margin-top:0}
.ll.est-haut .ll-fiche i{font-size:10px;top:8px;right:10px;gap:3px}
.ll.est-haut .ll-fiche i svg{width:10px;height:10px}
.ll.est-haut .ll-tete{right:12px;left:12px}
.ll.est-haut .ll-etapes{width:130px}
.ll.est-haut .ll-etape{font-size:10.5px}
.ll.est-haut .ll-droite{gap:4px}
.ll.est-haut .ll-acc__a,.ll.est-haut .ll-acc__b{font-size:40px}
.ll.est-haut .ll-acc__c{max-width:none;font-size:15px;margin-top:14px!important}
.ll.est-haut .ll-couv__s{margin-top:10px!important}
.ll.est-court .ll-explic:not(.ll-explic--p){display:none}
.ll.est-court .ll-fiche small{display:none}
.ll.est-court .ll-fiche{padding:5px 11px}
.ll.est-court .ll-fiche i{top:6px}
@media (max-height:520px){.ll-public,.ll-note{display:none}.ll-lancer{margin-top:calc(var(--u)*18)}.ll-etape,.ll-pied{font-size:10px}.ll-etapes{height:10px}}
/* Fin commune (css/fin.css) aux couleurs de Lockin */
.ll-fin.fc{padding:6vh 6vw 12vh;--fc-texte:#252a27;--fc-texte-2:#4c544e;--fc-accent:#c74630;--fc-sur-accent:#fff;--fc-accent-texte:#b13d29;--fc-trait:#e2ddd3;--fc-corps:Inter,"Helvetica Neue",Arial,sans-serif;--fc-titre:650 1em/1 Inter,"Helvetica Neue",Arial,sans-serif}
.ll-fin.fc .fc__nom{letter-spacing:-.045em}