/* Configurateur */
.cf{max-width:1240px;margin:auto;padding:100px 24px 120px}
.cf-intro{max-width:820px;margin-bottom:36px}
.cf-intro h1{font-size:clamp(2rem,4.6vw,3.4rem);margin:18px 0 14px}
.cf-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:28px;align-items:start}
.cf-controls{display:grid;gap:16px}
.cf-step{border:1px solid var(--line);padding:20px;display:grid;gap:14px;min-width:0}
.cf-step legend{display:flex;align-items:center;gap:10px;font:700 1.08rem var(--h);padding:0 6px}
.cf-step legend span{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:var(--grad);color:#06070d;font-size:.9rem}
.field{display:grid;gap:6px;font-size:.88rem;font-weight:500;color:#d5daea}
.field input{min-height:46px;padding:10px 14px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--txt);font:16px var(--f)}
.field input:focus{outline:none;border-color:var(--c1);box-shadow:0 0 0 3px rgba(34,211,238,.2)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.cf-chip input,.plan-pick input{position:absolute;opacity:0}
.cf-chip span{display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:8px 14px;border-radius:999px;border:1px solid var(--line);cursor:pointer;font-weight:500;font-size:.92rem;transition:border-color .2s}
.cf-chip span:hover{border-color:var(--c1)}
.cf-chip input:checked+span,.plan-pick input:checked+span{background:var(--grad);color:#06070d;border-color:transparent;font-weight:600}
.cf-chip input:focus-visible+span,.plan-pick input:focus-visible+span{outline:2px solid var(--c1);outline-offset:3px}
.swatches{display:flex;flex-wrap:wrap;gap:10px}
.swatch{width:46px;height:46px;border-radius:50%;border:2px solid rgba(255,255,255,.25);cursor:pointer;box-shadow:inset 0 0 0 3px rgba(255,255,255,.9)}
.swatch.dark{box-shadow:inset 0 0 0 3px #0b0e1c}
.swatch:hover,.swatch:focus-visible{transform:scale(1.08);border-color:var(--c1)}
.colors{display:flex;flex-wrap:wrap;gap:14px;align-items:end}
.colors label{display:grid;gap:6px;font-size:.85rem;color:#d5daea}
.colors input[type=color]{width:64px;height:40px;border:1px solid var(--line);border-radius:10px;background:none;cursor:pointer;padding:2px}
.check{display:flex!important;align-items:center;gap:8px;font-size:.92rem;color:#d5daea;cursor:pointer}
.check input{width:18px;height:18px;accent-color:#22d3ee}
.plan-picks{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.plan-pick span{display:grid;gap:2px;padding:10px 14px;border-radius:14px;border:1px solid var(--line);cursor:pointer}
.plan-pick small{opacity:.85}
.hint-s{font-size:.85rem;color:var(--mut)}
.opts-list{display:grid;gap:4px}
.opt{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:9px 10px;border-radius:12px;cursor:pointer;font-size:.93rem}
.opt:hover{background:rgba(255,255,255,.04)}
.opt input{width:18px;height:18px;accent-color:#22d3ee}
.o-price{color:var(--c1);font-weight:600;white-space:nowrap;font-size:.88rem}
.opt.inc{opacity:.75;cursor:default}
.opt.inc .o-price{color:#4ade80}

/* Scène d'aperçu */
.cf-stage{position:sticky;top:84px;display:grid;gap:12px;justify-items:center}
.cf-devices{display:flex;gap:6px;padding:4px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.04)}
.cf-devices button{min-height:38px;padding:6px 14px;border-radius:999px;border:0;background:none;color:var(--mut);font:600 .85rem var(--f);cursor:pointer}
.cf-devices button[aria-pressed=true]{background:var(--grad);color:#06070d}
.frame{width:100%;display:grid;justify-items:center}
.cf-note{min-height:1.2em;font-size:.88rem;color:var(--c1);text-align:center}
.cf-disclaimer{font-size:.8rem;color:var(--mut);text-align:center;max-width:460px}

/* Mini-site */
.mini{--mp:#22d3ee;--ma:#a855f7;--mf:'Space Grotesk',sans-serif;--mbg:#f8f7f4;--mtx:#1b1d26;--mcard:#fff;--mline:rgba(0,0,0,.08);background:var(--mbg);color:var(--mtx);overflow-y:auto;overscroll-behavior:contain;font:12px/1.45 'Inter',system-ui,sans-serif;box-shadow:0 30px 80px -20px rgba(0,0,0,.8),0 0 0 1px var(--line);transition:width .35s}
.mini.dark{--mbg:#0c0e18;--mtx:#eef1fb;--mcard:#161a2b;--mline:rgba(255,255,255,.1)}
.mini.phone{width:300px;height:600px;border-radius:34px;border:9px solid #12152a}
.mini.desk{width:100%;max-width:620px;height:460px;border-radius:14px;border:8px solid #12152a;border-top-width:22px}
.mini::-webkit-scrollbar{width:0}
.m-head{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:8px;padding:10px 12px;background:var(--mbg);border-bottom:1px solid var(--mline)}
.m-logo{display:flex;align-items:center;gap:6px;font:700 13px var(--mf);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m-mark{width:18px;height:18px;border-radius:6px;background:linear-gradient(135deg,var(--mp),var(--ma));flex:none}
.m-nav{display:none;gap:10px;font-size:10px;opacity:.75;white-space:nowrap}
.m-nav i{display:none}
.mini.desk .m-nav{display:flex}
.m-lang,.m-cart{font-size:10px;font-weight:600;padding:3px 7px;border-radius:999px;border:1px solid var(--mline);white-space:nowrap}
.m-hero{padding:34px 16px 26px;text-align:center;background:linear-gradient(135deg,color-mix(in srgb,var(--mp) 22%,var(--mbg)),color-mix(in srgb,var(--ma) 18%,var(--mbg)))}
.m-hero b{display:block;font:700 22px/1.15 var(--mf);margin-bottom:6px}
.mini.desk .m-hero b{font-size:30px}
.m-hero p{opacity:.8;margin-bottom:14px}
.m-ctas{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.m-btn{display:inline-block;padding:7px 12px;border-radius:999px;background:var(--mp);color:#fff;font-weight:600;font-size:11px}
.m-btn+.m-btn,.m-form .m-btn{background:var(--ma)}
.mini.dark .m-btn{color:#06070d}
.m-sec{padding:16px 12px;border-bottom:1px solid var(--mline)}
.m-sec h4{font:700 13px var(--mf);margin-bottom:10px;color:var(--mp)}
.m-grid{display:grid;grid-template-columns:1fr;gap:8px}
.mini.desk .m-grid{grid-template-columns:repeat(3,1fr)}
.m-card{background:var(--mcard);border:1px solid var(--mline);border-radius:10px;padding:8px;display:grid;gap:5px}
.m-img{display:block;height:54px;border-radius:7px;background:linear-gradient(135deg,color-mix(in srgb,var(--mp) 45%,transparent),color-mix(in srgb,var(--ma) 45%,transparent))}
.m-add,.m-price{font-style:normal;font-size:10px;font-weight:600;color:var(--ma)}
.m-add{background:var(--ma);color:#fff;border-radius:6px;padding:3px 6px;justify-self:start}
.m-days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.m-days i{font-style:normal;text-align:center;padding:6px 0;border-radius:6px;background:var(--mcard);border:1px solid var(--mline);font-size:10px}
.m-days i.on{background:var(--mp);color:#fff;border-color:transparent}
.m-video{height:110px;border-radius:10px;display:grid;place-items:center;font-size:26px;color:#fff;background:linear-gradient(135deg,var(--mp),var(--ma))}
.m-gal{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}
.m-gal i{height:44px;border-radius:6px;background:color-mix(in srgb,var(--mp) 35%,var(--mcard))}
.m-gal i:nth-child(even){background:color-mix(in srgb,var(--ma) 35%,var(--mcard))}
.m-stars{color:#f5b301;font-size:15px;letter-spacing:2px}
.m-avis p{font-style:italic;opacity:.8;margin-top:4px}
.m-news{display:flex;gap:8px;align-items:center}
.m-news i{width:46px;height:36px;border-radius:6px;background:color-mix(in srgb,var(--ma) 40%,var(--mcard));flex:none}
.m-info{display:flex;gap:10px;align-items:center}
.m-info b{display:block}
.m-map{width:60px;height:46px;border-radius:8px;display:grid;place-items:center;background:color-mix(in srgb,var(--mp) 20%,var(--mcard));flex:none}
.m-form{display:grid;gap:6px}
.m-form i{height:20px;border-radius:6px;background:var(--mcard);border:1px solid var(--mline)}
.m-form i.tall{height:40px}
.m-form .m-btn{justify-self:start}
.m-foot{padding:14px 12px;text-align:center;font-size:10px;opacity:.6}

/* Barre de total */
.cf-bar{position:sticky;bottom:12px;z-index:30;margin-top:24px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 16px;border-radius:18px;background:rgba(11,14,28,.92);border:1px solid rgba(34,211,238,.35);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 20px 50px -20px rgba(0,0,0,.9)}
.cf-bar>div{flex:1;min-width:180px}
.cf-bar small{display:block;color:var(--mut);font-size:.8rem}
.cf-bar b{font:700 1.4rem var(--h)}
.cf-bar #cf-monthly{color:var(--c1);font-weight:600}
#cf-see{display:none}

@media (max-width:900px){
  .cf{padding:90px 16px 110px}
  .cf-layout{grid-template-columns:1fr}
  .cf-stage{position:static;order:-1}
  .mini.phone{width:min(300px,100%);height:520px}
  .mini.desk{height:400px}
  #cf-see{display:inline-flex}
  .cf-bar .btn{flex:1}
}
@media (max-width:420px){.cf-step{padding:16px 12px}.plan-picks{grid-template-columns:1fr 1fr}}
body:has(.cf) .ai-bubble{bottom:110px}
@media (max-width:900px){body:has(.cf) .ai-bubble{bottom:150px;padding:10px;min-height:48px}body:has(.cf) .ai-label{display:none}}
body:has(.cf) .fab{display:none}

.chips.pay{margin-bottom:4px}
.opt[hidden]{display:none}
.cf-bar #cf-monthly{font-size:.85rem}
.cf-warn{max-width:520px;padding:12px 16px;border-radius:14px;border:1px solid rgba(250,204,21,.45);background:rgba(250,204,21,.08);color:#fde68a;font-size:.88rem;line-height:1.5;text-align:left}
.cf-warn b{color:#fef3c7}
