/* Rendez-vous découverte Levco Web, direction 2a (valeurs reprises de « Decouverte 2a - Toutes les pages.dc.html ») */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:#f7f5f9;color:#1d1424;font-family:'Geist',system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-anchor:none}
button{font-family:inherit}
a{color:#7a2fd0}
a:hover{color:#6524b3}
h1{margin:0;font-family:'Source Serif 4',serif;font-weight:400;letter-spacing:-.02em;color:#1d1424}
p{margin:0}
input,textarea,select{font-family:'Geist',system-ui,sans-serif}

/* ---------- Coque ordinateur ---------- */
.shell{min-height:100vh;min-height:100dvh;display:grid;grid-template-columns:340px minmax(0,1fr);background:#f7f5f9}
.shell.solo{grid-template-columns:minmax(0,1fr)}

.rail{background:#1a1024;color:#f4eefa;padding:40px 36px;display:flex;flex-direction:column;justify-content:space-between;position:sticky;top:0;height:100vh;height:100dvh}
.rail-top{display:flex;flex-direction:column;gap:56px}
.logo{display:flex;flex-direction:column;gap:4px}
.logo b{font:600 19px 'Geist';letter-spacing:-.01em}
.logo span{font:500 10px 'Geist';letter-spacing:.22em;color:#b99be0}
.rail-title{display:flex;flex-direction:column;gap:12px}
.rail-title strong{font:400 30px/1.15 'Source Serif 4',serif;letter-spacing:-.01em}
.rail-title span{font:400 14px/1.5 'Geist';color:#bfb3cc}
.recap{display:flex;flex-direction:column;border-top:1px solid #33243f}
.recap div{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid #33243f;font:400 14px 'Geist'}
.recap div span:first-child{color:#9a8ca9}
.recap div span:last-child{color:#f4eefa;text-align:right}
.rail-foot{font:400 13px/1.5 'Geist';color:#9a8ca9}

.main{display:flex;flex-direction:column;padding:40px 72px 48px;min-height:100vh;min-height:100dvh;min-width:0}
.topbar{height:36px;display:flex;justify-content:space-between;align-items:center;flex:none}
.back{font:500 14px 'Geist';color:#6e6577;background:none;border:none;padding:0;cursor:pointer}
.back:hover{color:#1d1424}
.progress{display:flex;align-items:center;gap:14px}
.progress span{font:500 13px 'Geist';color:#6e6577}
.ticks{display:flex;gap:4px}
.ticks i{display:block;width:18px;height:3px;border-radius:2px;background:#e4e0ea}
.ticks i.on{background:#7a2fd0}
.logo-inline{display:flex;align-items:baseline;gap:12px}
.logo-inline b{font:600 19px 'Geist';letter-spacing:-.01em;color:#1d1424}
.logo-inline span{font:500 10px 'Geist';letter-spacing:.22em;color:#7a2fd0}

.center{flex:1;display:flex;flex-direction:column;justify-content:center;min-height:0;padding:24px 0}
.actions{display:flex;justify-content:flex-start;padding-top:24px;flex:none}
.btn{font:600 15px 'Geist';padding:14px 24px;border:none;border-radius:4px;background:#7a2fd0;color:#fff;cursor:pointer;text-decoration:none;display:inline-block}
.btn:hover{background:#6524b3;color:#fff}
.btn:disabled{opacity:.4;cursor:default}
.btn:disabled:hover{background:#7a2fd0}

/* ---------- Bandeau mobile (masqué sur ordinateur) ---------- */
.mband{display:none}

/* ---------- Écran motif ---------- */
.entry{display:flex;flex-direction:column;gap:32px;max-width:760px}
.head{display:flex;flex-direction:column;gap:12px}
.entry h1{font-size:44px;line-height:1.1}
.entry .head p{font:400 16px/1.5 'Geist';color:#6e6577}
.motifs{display:flex;flex-direction:column;border-top:1px solid #e4e0ea}
.motif{cursor:pointer;display:grid;grid-template-columns:minmax(0,1fr) 120px;gap:32px;padding:22px 20px;margin:0 -20px;border:none;border-bottom:1px solid #e4e0ea;border-radius:4px;background:none;text-align:left;color:inherit;width:calc(100% + 40px)}
.motif:hover{background:#f0e9f9}
.motif-txt{display:flex;flex-direction:column;gap:6px}
.motif-txt b{font:600 17px 'Geist';color:#1d1424}
.motif-txt .desc{font:400 14.5px/1.55 'Geist';color:#6e6577;text-wrap:pretty}
.motif-dur{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:2px}
.motif-dur b{font:500 20px 'Source Serif 4',serif;color:#7a2fd0}
.motif-dur span{font:400 12px 'Geist';color:#6e6577}
.motif-dur-m{display:none}

/* ---------- Questions ---------- */
.q{display:flex;flex-direction:column;gap:28px;max-width:640px}
.q .head{gap:10px}
.q h1{font-size:38px;line-height:1.15;text-wrap:balance}
.q .head p{font:400 15px 'Geist';color:#6e6577}
.textq{display:flex;flex-direction:column;gap:12px}
.textq input{width:100%;min-width:0;font:400 17px 'Geist';padding:16px 18px;border:1px solid #d9d3e0;border-radius:4px;background:#fff;color:#1d1424;outline:none}
.textq input:focus,.other textarea:focus{border-color:#7a2fd0;box-shadow:0 0 0 3px #ece2f8}
.alt{align-self:flex-start;cursor:pointer;font:400 14px 'Geist';color:#6e6577;text-decoration:underline;text-underline-offset:3px;background:none;border:none;padding:0}
.alt:hover{color:#1d1424}
.opts{display:flex;flex-direction:column;gap:8px}
.opt{cursor:pointer;display:grid;grid-template-columns:18px 1fr;gap:14px;align-items:center;padding:14px 18px;border:1px solid #e4e0ea;background:#fff;border-radius:4px;text-align:left;width:100%;color:inherit}
.opt:hover{border-color:#7a2fd0}
.opt.sel{border-color:#7a2fd0;background:#f5effc}
.mark{width:16px;height:16px;border-radius:50%;border:1.5px solid #b5afbb;background:transparent;color:#fff;font:700 10px/13px 'Geist';text-align:center}
.multi .mark{border-radius:3px}
.opt.sel .mark{background:#7a2fd0;border-color:#7a2fd0}
.opt-l{font:400 15.5px/1.4 'Geist';color:#1d1424}
.other textarea{width:100%;min-height:80px;font:400 15.5px/1.4 'Geist';padding:12px 18px;border:1px solid #d9d3e0;border-radius:4px;background:#fff;color:#1d1424;outline:none;resize:none}

/* ---------- Coordonnées ---------- */
.form{display:flex;flex-direction:column;gap:24px;max-width:640px}
.form .head{gap:8px}
.form h1{font-size:36px;line-height:1.15}
.form .head p{font:400 15px 'Geist';color:#6e6577}
.grid2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
.fld{min-width:0;display:flex;flex-direction:column;gap:6px;font:500 13px 'Geist';color:#3d3445}
.fld em{font-style:normal;font-weight:400;color:#8a8192}
.inp{width:100%;min-width:0;font:400 15px 'Geist';padding:11px 13px;border:1px solid #d9d3e0;border-radius:4px;background:#fff;color:#1d1424;outline:none}
.inp:focus{border-color:#7a2fd0}
.tel{display:grid;grid-template-columns:72px 1fr;gap:6px;position:relative}
.cc{font:400 15px 'Geist';padding:11px 8px;border:1px solid #d9d3e0;border-radius:4px;background:#fff;color:#1d1424;cursor:pointer;text-align:center;white-space:nowrap}
.cc:focus{outline:none;border-color:#7a2fd0}
input.cc{cursor:text}
.ccmenu{position:absolute;top:calc(100% + 4px);left:0;z-index:20;width:240px;max-height:260px;overflow-y:auto;background:#fff;border:1px solid #e4e0ea;border-radius:4px;box-shadow:0 12px 32px rgba(29,20,36,.12)}
.ccmenu button{display:flex;gap:10px;width:100%;padding:10px 12px;border:none;background:none;text-align:left;font:400 14px 'Geist';color:#1d1424;cursor:pointer}
.ccmenu button:hover{background:#f5effc}
.ccmenu button span:last-child{margin-left:auto;color:#6e6577}
.ccmenu button.oth{border-top:1px solid #efecf2}
.partners{display:flex;flex-direction:column;gap:10px;grid-column:1 / -1}
.partner{display:grid;grid-template-columns:1fr 40px;gap:6px}
.rm{border:1px solid #e4e0ea;background:#fff;border-radius:4px;color:#6e6577;cursor:pointer;font:400 16px 'Geist'}
.rm:hover{border-color:#7a2fd0;color:#1d1424}
.addp{align-self:flex-start;cursor:pointer;font:500 14px 'Geist';color:#7a2fd0;background:none;border:none;padding:0;text-align:left}
.addp em{font-style:normal;font-weight:400;color:#6e6577}
.addp:hover{color:#6524b3}
.err{font:400 13px 'Geist';color:#7a2fd0}

/* ---------- Créneau ---------- */
.cal-wrap{display:flex;flex-direction:column;gap:28px}
.cal-wrap .head{gap:8px}
.cal-wrap h1{font-size:38px;line-height:1.1}
.cal-wrap .head p{font:400 15px 'Geist';color:#6e6577}
.cal-grid{display:grid;grid-template-columns:400px 260px;gap:40px;align-items:start}
.cal{background:#fff;border:1px solid #e4e0ea;border-radius:6px;padding:22px 22px 18px;display:flex;flex-direction:column;gap:14px}
.cal-h{display:flex;justify-content:space-between;align-items:center}
.cal-h b{font:600 15px 'Geist';color:#1d1424}
.cal-h .tzm{display:none}
.nav{display:flex;gap:6px}
.nav button{font:500 15px 'Geist';color:#6e6577;padding:2px 8px;border:1px solid #e4e0ea;border-radius:4px;background:none;cursor:pointer}
.nav button:disabled{opacity:.35;cursor:default}
.days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.dow{text-align:center;font:500 12px 'Geist';color:#8a8192;padding:4px 0}
.day{height:42px;display:flex;align-items:center;justify-content:center;border-radius:4px;background:transparent;color:#b5afbb;font:400 14px 'Geist';border:none;padding:0}
.day.ok{background:#f5effc;color:#1d1424;font-weight:600;cursor:pointer}
.day.sel{background:#7a2fd0;color:#fff;font-weight:600}
.day.today:not(.sel){box-shadow:inset 0 0 0 1px #e4e0ea}
.tz{font:400 13px 'Geist';color:#6e6577;padding-top:8px;border-top:1px solid #efecf2;display:flex;align-items:center;gap:4px;position:relative}
.tz-pick{position:relative;cursor:pointer;text-decoration:underline;text-decoration-color:#d9d3e0;text-underline-offset:3px}
.tz-pick:hover{color:#1d1424}
.tz select{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;font-size:16px}
.slots{display:flex;flex-direction:column;gap:8px}
.slots-h{font:600 15px 'Geist';color:#1d1424;padding-bottom:6px}
.slots-h::first-letter{text-transform:uppercase}
.slot-list{display:flex;flex-direction:column;gap:8px}
.slot{cursor:pointer;padding:11px;text-align:center;border:1px solid #e4e0ea;background:#fff;color:#1d1424;border-radius:4px;font:500 15px 'Geist';font-variant-numeric:tabular-nums}
.slot:hover{border-color:#7a2fd0}
.slot.sel{background:#7a2fd0;color:#fff;border-color:#7a2fd0}
.slot-empty{font:400 14px/1.5 'Geist';color:#6e6577;padding:4px 0}

/* ---------- Confirmation et écrans de fin ---------- */
.done{display:grid;grid-template-columns:minmax(0,1fr) 560px;gap:64px;align-items:center;max-width:1100px;width:100%;margin:0 auto}
.done-txt{display:flex;flex-direction:column;gap:20px}
.kicker{font:600 12px 'Geist';letter-spacing:.12em;color:#7a2fd0}
.done h1,.end h1{font-size:38px;line-height:1.15;text-wrap:balance}
.done-txt p,.end p{font:400 16px/1.6 'Geist';color:#4f4657}
.booked{display:flex;align-items:center;gap:16px;padding:16px 18px;border:1px solid #e4e0ea;background:#fff;border-radius:4px}
.booked div{display:flex;flex-direction:column;gap:2px;flex:1}
.booked span{font:400 12px 'Geist';color:#6e6577}
.booked b{font:600 15px 'Geist';color:#1d1424}
.video{display:flex;flex-direction:column;gap:10px}
.frame{position:relative;aspect-ratio:16/9;border-radius:6px;background:#1a1024;overflow:hidden}
.video-box{position:absolute;left:-10000px;top:0;width:560px;height:315px;opacity:0;pointer-events:none;border-radius:6px;overflow:hidden;z-index:5}
.video-box.shown{opacity:1;pointer-events:auto}
.video-box iframe{display:block;width:100%;height:100%;border:0}
@media (max-width:1023px){.video-box{border-radius:8px}}
.frame .loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:400 12px ui-monospace,Menlo,monospace;color:#9a8ca9;padding:0 16px;text-align:center}
.video>span{font:400 13px 'Geist';color:#6e6577}
.end{display:flex;flex-direction:column;gap:20px;max-width:640px;width:100%;margin:0 auto}
.note{padding:16px 18px;border:1px solid #e4e0ea;background:#fff;border-radius:4px;display:flex;flex-direction:column;gap:8px}
.note b{font:600 14px 'Geist';color:#1d1424}
.note ul{margin:0;padding-left:18px;font:400 14px/1.6 'Geist';color:#4f4657}
.end .small{font:400 14px 'Geist';color:#6e6577}

/* ---------- Mobile ---------- */
@media (max-width:1023px){
  .shell,.shell.solo{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}
  .rail{display:none}
  .mband{display:flex;flex-direction:column;gap:14px;background:#1a1024;color:#f4eefa;padding:18px 20px 16px;padding-top:calc(18px + env(safe-area-inset-top))}
  .mband-row{display:flex;justify-content:space-between;align-items:center;height:28px}
  .mband .back{color:#bfb3cc;min-height:28px}
  .mband .back:hover{color:#f4eefa}
  .mband-logo{font:600 17px 'Geist';letter-spacing:-.01em}
  .mband-step{font:500 12px 'Geist';color:#bfb3cc}
  .mband-sum{display:flex;flex-direction:column;gap:10px}
  .mband-sum span{font:400 13px 'Geist';color:#f4eefa}
  .mticks{display:flex;gap:4px}
  .mticks i{flex:1;height:3px;border-radius:2px;background:#3a2a4a}
  .mticks i.on{background:#7a2fd0}
  .main{padding:28px 20px 0;min-height:0;flex:1}
  .main .topbar{display:none}
  .center{justify-content:flex-start;padding:0 0 28px}
  .actions{position:sticky;bottom:0;margin:0 -20px;padding:14px 20px 28px;padding-bottom:calc(28px + env(safe-area-inset-bottom));background:#f7f5f9;border-top:1px solid #ebe7ef}
  .actions .btn{width:100%;height:52px;font:600 15.5px 'Geist';border-radius:6px;padding:0}

  .entry{gap:20px}
  .head{gap:8px}
  .entry h1{font-size:30px;line-height:1.12}
  .entry .head p{font-size:14.5px}
  .motifs{border-top:none;gap:10px}
  .motif{display:flex;flex-direction:column;gap:6px;padding:16px;margin:0;width:100%;background:#fff;border:1px solid #e4e0ea;border-radius:6px}
  .motif:hover{background:#fff}
  .motif:active{border-color:#7a2fd0}
  .motif-dur{display:none}
  .motif-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
  .motif-txt b{font:600 15.5px/1.3 'Geist'}
  .motif .motif-dur-m{display:inline;font:500 16px 'Source Serif 4',serif;color:#7a2fd0;white-space:nowrap}
  .motif-txt .desc{font:400 13.5px/1.5 'Geist'}

  .q{gap:20px}
  .q .head{gap:8px}
  .q h1{font-size:28px;line-height:1.15}
  .q .head p{font-size:14px}
  .textq{gap:14px}
  .textq input{font-size:16px;padding:15px 14px;border-radius:6px}
  .alt{padding:8px 0}
  .opt{gap:12px;min-height:48px;padding:10px 14px;border-radius:6px}
  .opt-l{font-size:14.5px;line-height:1.35}
  .other textarea{font-size:16px;border-radius:6px;padding:12px 14px}

  .form{gap:18px}
  .form .head{gap:6px}
  .form h1{font-size:26px}
  .form .head p{font-size:14px}
  .grid2{gap:12px 10px}
  .grid2 .full{grid-column:1 / -1}
  .fld{gap:5px;font-size:12.5px}
  .inp,.cc{font-size:16px;padding:11px 12px;border-radius:6px}
  .tel{grid-template-columns:64px 1fr}
  .cc{padding:11px 4px}
  .rm{border-radius:6px}
  .addp{font-size:13.5px;margin-top:-2px}
  .addp em{display:none}
  .order-email{order:3}.order-partners{order:4}.order-tel{order:5}.order-company{order:6}.order-site{order:7}

  .cal-wrap{gap:18px}
  .cal-wrap .head{gap:6px}
  .cal-wrap h1{font-size:28px}
  .cal-wrap .head p{font-size:14px;line-height:1.45}
  .cal-grid{grid-template-columns:minmax(0,1fr);gap:18px}
  .cal{border-radius:8px;padding:14px 12px 10px;gap:8px}
  .cal-h{padding:0 4px}
  .cal-h b{font-size:14px}
  .nav button{font-size:14px;padding:0 8px}
  .days{gap:3px}
  .dow{font-size:11px;padding:2px 0}
  .day{height:40px;border-radius:6px}
  .tz{font-size:12px;padding-top:6px}
  .slots-h{font-size:14px;padding-bottom:0}
  .slot-list{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
  .slot{height:44px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:6px}

  .done{display:flex;flex-direction:column;gap:16px;align-items:stretch}
  .done-txt{gap:16px}
  .kicker{font-size:11px}
  .done h1,.end h1{font-size:28px}
  .done-txt p,.end p{font-size:15px;line-height:1.55}
  .booked{gap:12px;padding:14px 16px;border-radius:6px}
  .booked b{font-size:14px}
  .video{gap:8px}
  .frame{border-radius:8px}
  .video>span{line-height:1.45}
  .end{gap:16px}
}
@media (max-width:1023px) and (min-width:700px){
  .main{padding-left:40px;padding-right:40px}
  .actions{margin:0 -40px;padding-left:40px;padding-right:40px}
}