```html
<style>
body{
background:#fff7fb;
font-family:Arial,sans-serif;
}

.kamoda-title{
text-align:center;
padding:40px 20px;
}

.kamoda-title h1{
font-size:42px;
color:#e84393;
margin-bottom:10px;
}

.kamoda-title p{
color:#666;
font-size:18px;
}

.kamoda-container{
max-width:1200px;
margin:auto;
display:flex;
gap:30px;
padding:20px;
flex-wrap:wrap;
}

.kamoda-form{
flex:2;
background:white;
padding:30px;
border-radius:20px;
box-shadow:0 5px 20px rgba(0,0,0,.08);
}

.kamoda-info{
flex:1;
background:#fff0f6;
padding:30px;
border-radius:20px;
border:2px solid #ff69b4;
}

.kamoda-section{
font-size:24px;
color:#e84393;
margin-bottom:20px;
font-weight:bold;
}

label{
display:block;
margin-top:15px;
font-weight:bold;
color:#333;
}

input,
textarea,
select{
width:100%;
padding:12px;
border:1px solid #ddd;
border-radius:10px;
margin-top:5px;
box-sizing:border-box;
}

.row{
display:flex;
gap:15px;
}

.row > div{
flex:1;
}

button{
width:100%;
padding:16px;
background:#e84393;
color:white;
border:none;
border-radius:12px;
font-size:18px;
margin-top:20px;
cursor:pointer;
font-weight:bold;
}

button:hover{
background:#d63384;
}

.step{
margin-bottom:20px;
padding-bottom:15px;
border-bottom:1px solid #ffd6ea;
}

.step strong{
color:#e84393;
}

.footer-icons{
display:flex;
justify-content:space-around;
margin-top:25px;
text-align:center;
font-size:14px;
}

@media(max-width:768px){
.row{
flex-direction:column;
}
.kamoda-container{
flex-direction:column;
}
}
</style>

<div class="kamoda-title">
<h1>🌸 Réservation Click & Collect</h1>
<p>Kamoda Morez - Réservez vos articles en quelques clics</p>
</div>

<div class="kamoda-container">

<div class="kamoda-form">

<div class="kamoda-section">
🛍️ Votre réservation
</div>

<form action="https://formsubmit.co/kamoda39@yahoo.com" method="POST">

<input type="hidden" name="_subject" value="Nouvelle réservation Kamoda">
<input type="hidden" name="_captcha" value="false">

<div class="row">

<div>
<label>Nom et prénom</label>
<input type="text" name="Nom" required>
</div>

<div>
<label>Téléphone</label>
<input type="tel" name="Téléphone" required>
</div>

</div>

<label>Email</label>
<input type="email" name="Email" required>

<label>Article souhaité</label>
<input type="text" name="Article" placeholder="Ex : Robe, Veste, Sac..." required>

<div class="row">

<div>
<label>Taille</label>
<select name="Taille">
<option>XS</option>
<option>S</option>
<option>M</option>
<option>L</option>
<option>XL</option>
<option>XXL</option>
</select>
</div>

<div>
<label>Quantité</label>
<input type="number" name="Quantité" min="1" value="1">
</div>

</div>

<div class="row">

<div>
<label>Date de retrait</label>
<input type="date" name="Date retrait" required>
</div>

<div>
<label>Heure de retrait</label>
<input type="time" name="Heure retrait" required>
</div>

</div>

<label>Informations complémentaires</label>
<textarea name="Message" rows="5" placeholder="Couleur souhaitée, question, demande particulière..."></textarea>

<button type="submit">
💖 Envoyer ma réservation
</button>

</form>

</div>

<div class="kamoda-info">

<div class="kamoda-section">
📍 Kamoda Morez
</div>

<p>
38 Quai Jobez<br>
39400 Hauts-de-Bienne
</p>

<div class="kamoda-section">
🕒 Horaires
</div>

<p>
Mardi : 09h45 - 12h00 / 14h15 - 19h00<br><br>

Mercredi : 09h45 - 12h00 / 14h15 - 19h00<br><br>

Jeudi : 09h45 - 12h00 / 14h15 - 19h00<br><br>

Vendredi : 09h45 - 12h00 / 14h15 - 19h00<br><br>

Samedi : 09h30 - 12h30 / 14h00 - 18h00
</p>

<div class="kamoda-section">
✨ Comment ça fonctionne ?
</div>

<div class="step">
<strong>1.</strong> Je remplis le formulaire.
</div>

<div class="step">
<strong>2.</strong> Kamoda reçoit ma demande.
</div>

<div class="step">
<strong>3.</strong> Ma réservation est préparée.
</div>

<div class="step">
<strong>4.</strong> Je viens récupérer mon article.
</div>

<div class="footer-icons">

<div>
💖<br>
Mode
</div>

<div>
🛍️<br>
Réservation
</div>

<div>
📞<br>
Conseil
</div>

</div>

</div>

</div>
```