/* ---------- Formulaire de commande / réservation ---------- */
.of-overlay{
  position:fixed;inset:0;z-index:400;background:rgba(16,17,19,.62);
  display:flex;align-items:flex-end;justify-content:center;
  opacity:0;pointer-events:none;transition:opacity .2s;
}
.of-overlay.open{opacity:1;pointer-events:auto}
/* fond noir : si la fiche rebondit en haut, on voit le prolongement de l'en-tête, pas un vide clair */
.of-card{
  background:var(--black);width:100%;max-width:520px;max-height:94vh;overflow:auto;
  border-radius:24px 24px 0 0;position:relative;transform:translateY(24px);transition:transform .25s;
  overscroll-behavior:none;-webkit-overflow-scrolling:touch;
}
.of-form,.of-done{background:var(--bg)}
.of-grab{display:block;width:44px;height:5px;border-radius:99px;background:rgba(255,255,255,.28);margin:-.6rem auto 1rem}
@media(min-width:640px){.of-grab{display:none}}
.of-overlay.open .of-card{transform:none}
@media(min-width:640px){
  .of-overlay{align-items:center;padding:1.5rem}
  .of-card{border-radius:24px}
}
.of-close{
  position:absolute;top:.9rem;right:.9rem;z-index:2;width:40px;height:40px;border-radius:50%;
  border:none;padding:0;background:rgba(255,255,255,.14);color:#fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:background .2s;
}
.of-close:hover{background:var(--orange)}
.of-head{background:var(--black);color:#fff;padding:1.6rem 1.5rem 1.4rem}
.of-kicker{font-size:.75rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--orange)}
.of-head h2{font-size:1.35rem;font-weight:800;line-height:1.2;margin:.4rem 3rem .9rem 0;color:#fff}
.of-choices{display:grid;gap:.5rem}
.of-choices[hidden]{display:none}
.of-choices-label{font-size:.82rem;font-weight:600;color:rgba(255,255,255,.7);margin-bottom:.1rem}
.of-choice{
  font-family:inherit;color:#fff;cursor:pointer;text-align:left;width:100%;
  display:flex;align-items:center;gap:.75rem;
  background:var(--black-2);border:1.5px solid var(--line-dark);border-radius:14px;padding:.85rem 1rem;
  transition:border-color .2s,background .2s;
}
.of-choice:hover{border-color:rgba(255,255,255,.4)}
.of-dot{
  width:20px;height:20px;border-radius:50%;flex:none;border:2px solid rgba(255,255,255,.45);
  display:flex;align-items:center;justify-content:center;
}
.of-choice-name{flex:1;font-size:.95rem;font-weight:700}
.of-choice-price{font-size:1rem;font-weight:800;white-space:nowrap}
.of-choice-price small{font-size:.72rem;font-weight:700;color:rgba(255,255,255,.6)}
.of-choice[aria-checked="true"]{border-color:var(--orange);background:rgba(244,85,30,.14)}
.of-choice[aria-checked="true"] .of-dot{border-color:var(--orange)}
.of-choice[aria-checked="true"] .of-dot::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--orange)}
.of-choices + .of-price{margin-top:.8rem}
.of-price[hidden]{display:none}
.of-price{
  display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  background:var(--black-2);border:1px solid var(--line-dark);border-radius:14px;padding:.8rem 1rem;
}
.of-price span{font-size:.8rem;font-weight:600;color:rgba(255,255,255,.6)}
.of-price b{font-size:1.45rem;font-weight:800;color:#fff;white-space:nowrap}
.of-price b small{font-size:.8rem;font-weight:700;color:var(--orange);margin-left:.25rem}
.of-notes{list-style:none;display:grid;gap:.35rem;margin-top:.8rem}
.of-notes li{font-size:.78rem;line-height:1.45;color:rgba(255,255,255,.72);padding-left:1rem;position:relative}
.of-notes li::before{content:"";position:absolute;left:0;top:.5em;width:6px;height:6px;border-radius:50%;background:var(--orange)}

.of-form{padding:1.3rem 1.5rem 1.5rem;display:grid;gap:.85rem}
.of-field{display:grid;gap:.3rem}
.of-field label{font-size:.82rem;font-weight:700}
.of-field label i{font-style:normal;font-weight:600;color:var(--gray)}
.of-field input,.of-field textarea{
  font:inherit;font-size:1rem;color:var(--black);background:var(--white);
  border:1.5px solid var(--line);border-radius:12px;padding:.75rem .9rem;width:100%;
  transition:border-color .2s,box-shadow .2s;
}
.of-field textarea{min-height:84px;resize:vertical}
.of-field input:focus,.of-field textarea:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(244,85,30,.18)}
.of-field input[aria-invalid="true"]{border-color:#C9302C}
.of-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.of-consent{font-size:.74rem;color:var(--gray);line-height:1.5}
.of-submit{width:100%;border:none;cursor:pointer;font-family:inherit;font-size:1rem;padding:1rem 1.4rem}
.of-submit[disabled]{opacity:.6;cursor:wait}
.of-error{font-size:.85rem;font-weight:600;color:#C9302C}

.of-done{padding:2rem 1.5rem 1.8rem;text-align:center;display:grid;gap:.8rem;justify-items:center}
.of-done .of-check{
  width:56px;height:56px;border-radius:50%;background:#2EBE76;color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:1.6rem;font-weight:800;
}
.of-done h3{font-size:1.3rem;font-weight:800}
.of-done p{font-size:.92rem;color:#3c3c3c;max-width:24rem}
.of-done .btn-wa{width:100%;max-width:22rem}
.of-later{background:none;border:none;font:inherit;font-size:.85rem;font-weight:700;color:var(--gray);cursor:pointer;text-decoration:underline}

/* ---------- Inscription e-mail (visiteurs) ---------- */
.oc-card{
  position:fixed;left:16px;right:16px;bottom:88px;z-index:300;max-width:380px;
  background:var(--white);border-radius:20px;padding:1.2rem 1.2rem 1rem;
  box-shadow:0 18px 44px rgba(16,17,19,.22);
  transform:translateY(16px);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;
}
.oc-card.show{transform:none;opacity:1;pointer-events:auto}
@media(min-width:861px){.oc-card{left:24px;right:auto;bottom:24px}}
.oc-card h3{font-size:1.02rem;font-weight:800;margin-right:2rem}
.oc-card p{font-size:.84rem;color:#3c3c3c;margin:.3rem 0 .8rem;line-height:1.45}
.oc-row{display:flex;gap:.5rem}
.oc-row input{
  flex:1;min-width:0;font:inherit;font-size:.95rem;border:1.5px solid var(--line);border-radius:99px;padding:.65rem .95rem;
}
.oc-row input:focus{outline:none;border-color:var(--orange)}
.oc-row button{
  border:none;cursor:pointer;font-family:inherit;font-weight:700;font-size:.85rem;
  background:var(--black);color:#fff;border-radius:99px;padding:.65rem 1rem;white-space:nowrap;
}
.oc-row button:hover{background:var(--orange)}
.oc-close{
  position:absolute;top:.6rem;right:.6rem;width:32px;height:32px;border-radius:50%;border:none;padding:0;
  background:var(--bg);cursor:pointer;color:var(--black);
  display:flex;align-items:center;justify-content:center;
}
.oc-small{font-size:.7rem;color:var(--gray);margin-top:.6rem;line-height:1.4}